Skip to content

GitLab

Commit 3b05d6f0 authored by svilayphiou's avatar svilayphiou
Browse files

javascript prototypes

parent 3fb6340e
Hide whitespace changes
Inline Side-by-side
contour.html
View file @ 3b05d6f0
......@@ -4,6 +4,8 @@
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Contour</title>
<link rel="stylesheet" href="https://semestriel.framapad.org/p/9f7m-osp-website-css/export/txt" type="text/css" media="all" charset="utf-8">
<style>
.tree:before {
......
works-commit.html 0 → 100644
View file @ 3b05d6f0
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>OSP works</title>
<link rel="stylesheet" href="https://semestriel.framapad.org/p/9f7m-osp-website-css/export/txt" type="text/css" media="all" charset="utf-8">
<style>
img {
max-width: 200px;
max-height: 200px;
}
</style>
</head>
<body>
<h1>Works</h1>
<div class="filters">
View through:
<ul>
<li><a href="#" id="filter-commit">Last update</a></li>
<li><a href="works-fonts.html" id="filter-fonts">Fonts</a></li>
<li><a href="#" id="filter-images">Images</a></li>
<li><a href="#" id="filter-readme">Description</a></li>
<li><a href="#" id="filter-tree">Diagram</a></li>
</ul>
</div>
<script type="text/javascript" charset="utf-8">
let body = document.querySelector('body');
var gitlab_url = "http://gitlab.constantvzw.org";
var user_name = "osp";
var repos = [351, 456, 508]
for (i=0; i < repos.length; i++) {
let repo = document.createElement('div'),
title = document.createElement('h2'),
commit = document.createElement('div');
repo.classList.add("repo");
title.classList.add("repo-title");
commit.classList.add('latest-commit');
repo.appendChild(title);
repo.appendChild(commit);
body.appendChild(repo);
getMetadata(i, repos[i], repo);
getLatestCommit(i, repos[i], repo);
}
// METADATA ///////////////////////////////
function getMetadata(i, repoID, repoElt) {
let repo_url = "https://gitlab.constantvzw.org/api/v4/projects/" + repoID;
fetch(repo_url)
.then(function(resp){
//console.log(resp);
//console.log(resp.json());
return resp.json();
})
.then(function(data){
let title = repoElt.querySelector('.repo-title');
name = data.name.split(".").slice(1);
title.innerHTML = name.replace(",", ".");
})
}
// COMMITS ///////////////////////////////
function getLatestCommit(i, repoID, repoElt){
let commits_elt = repoElt.querySelector('.latest-commit');
let commits_url = "https://gitlab.constantvzw.org/api/v4/projects/" + repoID + "/repository/commits?per_page=1";
fetch(commits_url)
.then(function(resp){
return resp.json();
})
.then(function(data){
return data.map(function(commit) {
let li = document.createElement('li'),
time = document.createElement('time'),
msg = document.createElement('p'),
author = document.createElement('p');
msg.classList.add("msg");
author.classList.add("author");
time.innerHTML = commit.created_at;
msg.innerHTML = commit.message;
author.innerHTML = commit.author_name;
li.appendChild(time);
li.appendChild(msg);
li.appendChild(author);
commits_elt.appendChild(li);
let commit_id = commit.id;
let commit_url = "https://gitlab.constantvzw.org/api/v4/projects/" + repoID + "/repository/commits/" + commit_id + "/diff";
fetch(commit_url)
.then(function(resp){
return resp.json();
})
.then(function(data2){
let filesNb = document.createElement('p');
filesNb.classList.add("files-number");
filesNb.innerHTML = data2.length + " changed files";
li.appendChild(filesNb);
})
})
})
//.catch(function(error) {
// console.log(JSON.stringify(error));
//});
}
// END COMMITS
</script>
</body>
</html>
works-fonts.html 0 → 100644
View file @ 3b05d6f0
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>OSP works</title>
<link rel="stylesheet" href="https://semestriel.framapad.org/p/9f7m-osp-website-css/export/txt" type="text/css" media="all" charset="utf-8">
<style>
img {
max-width: 200px;
max-height: 200px;
}
.repo {
outline: 10px solid pink;
margin: 2em;
padding: 2em;
}
.font-folder {
outline: 10px solid blue;
margin: 2em;
padding: 2em;
}
.font-folder:empty {
display: none;
}
input {
font-size: 2em;
}
</style>
</head>
<body>
<h1>Works</h1>
<div class="filters">
View through:
<ul>
<li><a href="works-commit.html" id="filter-commit">Last update</a></li>
<li><a href="#" id="filter-fonts">Fonts</a></li>
<li><a href="#" id="filter-images">Images</a></li>
<li><a href="#" id="filter-readme">Description</a></li>
<li><a href="#" id="filter-tree">Diagram</a></li>
</ul>
</div>
<script type="text/javascript" charset="utf-8">
let body = document.querySelector('body');
var gitlab_url = "http://gitlab.constantvzw.org";
var user_name = "osp";
//var repos = [455, 456, 508, 536]
var repos = [455, 456, 508]
for (i=0; i < repos.length; i++) {
// CREATING DIV REPO
let repo = document.createElement('div'),
title_elt = document.createElement('h2');
repo.classList.add("repo");
title_elt.classList.add("repo-title");
repo.appendChild(title_elt);
body.appendChild(repo);
getFonts(i, repos[i], repo);
}
// GET ALL FONTS ///////////////////////////////
function getFonts(i, repoID, repoElt){
let repo_url = "https://gitlab.constantvzw.org/api/v4/projects/" + repoID;
let nb_fonts = 0;
fetch(repo_url)
.then(function(resp){
return resp.json();
})
.then(function(data){
// FETCH REPO TITLE
let title = repoElt.querySelector('.repo-title');
name = data.name.split(".").slice(1);
title.innerHTML = name.replace(",", ".");
})
// FETCH FONTS OF THE REPO
let fonts_url = "https://gitlab.constantvzw.org/api/v4/projects/" + repoID + "/repository/tree?path=fonts";
fetch(fonts_url)
.then(function(resp){
return resp.json();
})
.then(function(data){
return data.map(function(font) {
// REPO TITLE
let title = repoElt.querySelector('.repo-title:first-child').innerHTML;
getFontFolder(font, repoElt, title, repoID);
})
nbFonts = repoElt.querySelectorAll(".font");
console.log(nbFonts);
})
//.catch(function(error) {
// console.log(JSON.stringify(error));
//});
}
// END GET ALL FONTS
// GET FONT FOLDER
function getFontFolder(font, repoElt, title, repoID){
//var reg = new RegExp(/^[\w\/].*result\b/);
var reg = new RegExp('^(?!.*(ufo|OSX)$).*$');
if (font.type == "tree" && reg.test(font.name)) {
// CREATE FONT FOLDER ELEMENT
let font_folder_elt = document.createElement('div');
font_folder_elt.classList.add('font-folder');
repoElt.appendChild(font_folder_elt);
// FOLDER NAME
//foldername = document.createElement('h3');
//foldername.classList.add('font-name');
//foldername.innerHTML = font.name;
let fonts_url = "https://gitlab.constantvzw.org/api/v4/projects/" + repoID + "/repository/tree?path="+ font.path;
fetch(fonts_url)
.then(function(resp){
return resp.json();
})
.then(function(data){
return data.map(function(font) {
if (font.type == "tree" && reg.test(font.name)) {
getFontFolder(font, repoElt, title, repoID);
} else if (font.name.endsWith(".ttf") || font.name.endsWith(".otf")) {
font_elt.insertBefore(fontname, font_elt.childNodes[0]);
getFont(font, font_folder_elt, title);
}
})
})
} else if (font.name.endsWith(".ttf") || font.name.endsWith(".otf")) {
getFont(font, repoElt, title);
}
}
// END GET FONT FOLDER
// GET ONE FONT
function getFont(font, repoElt, title){
// CREATE FONT ELEMENT
font_elt = document.createElement('div');
font_elt.classList.add('font');
repoElt.appendChild(font_elt);
// FONT NAME
fontname = document.createElement('h4');
fontname.classList.add('font-name');
fontname.innerHTML = font.name;
font_elt.appendChild(fontname);
// FONT PATH
fontfile = font.path.split("/");
fontfile.shift();
var blob_url = 'http://osp.kitchen/api/osp.work.' + title + '/' + font.id + '/blob-data/' + font.path;
fontInput = document.createElement('input');
fontDl = document.createElement('a');
fontface = document.createElement('style');
fontInput.classList.add('font-input');
fontDl.classList.add('font-dl');
fontface.innerHTML = "@font-face { font-family: '" + font.name + "'; src: url('" + blob_url + "')}";
fontInput.value = font.name;
fontInput.style.fontFamily = '"' + font.name + '"';
fontDl.innerHTML = "Download font";
fontDl.setAttribute("href", blob_url);
font_elt.appendChild(fontface);
font_elt.appendChild(fontInput);
font_elt.appendChild(fontDl);
}
// END GET ONE FONT
</script>
</body>
</html>
works-image.html 0 → 100644
View file @ 3b05d6f0
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>OSP works</title>
<link rel="stylesheet" href="https://semestriel.framapad.org/p/9f7m-osp-website-css/export/txt" type="text/css" media="all" charset="utf-8">
<style>
img {
max-width: 200px;
max-height: 200px;
float: left;
}
.archived {
background-color: gray;
}
.repo {
display: flex;
}
.iceberg, .processus {
width: 50%;
}
</style>
</head>
<body>
<h1>Works</h1>
<div class="filters">
View through:
<ul>
<li><a href="#" id="filter-commit">Last update</a></li>
<li><a href="works-fonts.html" id="filter-fonts">Fonts</a></li>
<li><a href="#" id="filter-images">Images</a></li>
<li><a href="#" id="filter-readme">Description</a></li>
<li><a href="#" id="filter-tree">Diagram</a></li>
</ul>
</div>
<script type="text/javascript" charset="utf-8">
let body = document.querySelector('body');
var gitlab_url = "http://gitlab.constantvzw.org";
var user_name = "osp";
var repos = [448, 456, 508]
for (i=0; i < repos.length; i++) {
let repo = document.createElement('div'),
title = document.createElement('h2'),
iceberg = document.createElement('div'),
processus = document.createElement('div');
iceberg_h3 = document.createElement('h3'),
processus_h3 = document.createElement('h3');
repo.classList.add("repo");
title.classList.add("repo-title");
iceberg.classList.add('iceberg');
processus.classList.add('processus');
iceberg_h3.innerHTML = "Iceberg";
processus_h3.innerHTML = "Processus";
repo.appendChild(title);
processus.appendChild(processus_h3);
repo.appendChild(processus);
iceberg.appendChild(iceberg_h3);
repo.appendChild(iceberg);
body.appendChild(repo);
getMetadata(i, repos[i], repo);
let processus_url = "https://gitlab.constantvzw.org/api/v4/projects/" + repos[i] + "/repository/tree?path=processus";
let iceberg_url = "https://gitlab.constantvzw.org/api/v4/projects/" + repos[i] + "/repository/tree?path=iceberg";
getImages(i, repos[i], repo, processus_url, processus);
getImages(i, repos[i], repo, iceberg_url, iceberg);
}
// METADATA ///////////////////////////////
function getMetadata(i, repoID, repoElt) {
let repo_url = "https://gitlab.constantvzw.org/api/v4/projects/" + repoID;
fetch(repo_url)
.then(function(resp){
//console.log(resp);
//console.log(resp.json());
return resp.json();
})
.then(function(data){
let title = repoElt.querySelector('.repo-title');
name = data.name.split(".").slice(1);
title.innerHTML = name.replace(",", ".");
if (data.default_branch == "archive"){
repoElt.classList.add("archived");
}
})
}
// COMMITS ///////////////////////////////
function getImages(i, repoID, repoElt, fetchURL, imageElt){
console.log(fetchURL);
fetch(fetchURL)
.then(function(resp){
return resp.json();
})
.then(function(data){
let title = repoElt.querySelector('.repo-title:first-child').innerHTML;
return data.map(function(image) {
let img = document.createElement('img'),
filename = document.createElement('p');
project_path = [gitlab_url, user_name, "work." + title].join('/');
img.src = project_path + "/raw/master/" + image.path;
filename.innerHTML = image.name;
imageElt.appendChild(filename);
imageElt.appendChild(img);
})
})
//.catch(function(error) {
// console.log(JSON.stringify(error));
//});
}
// END COMMITS
</script>
</body>
</html>
works.html 0 → 100644
View file @ 3b05d6f0
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>OSP works</title>
<link rel="stylesheet" href="https://semestriel.framapad.org/p/9f7m-osp-website-css/export/txt" type="text/css" media="all" charset="utf-8">
<style>
img {
max-width: 200px;
max-height: 200px;
}
</style>
</head>
<body>
<h1>Works</h1>
<div class="filters">
View through:
<ul>
<li><a href="#" id="filter-commit">Last update</a></li>
<li><a href="#" id="filter-fonts">Fonts</a></li>
<li><a href="#" id="filter-images">Images</a></li>
<li><a href="#" id="filter-readme">Description</a></li>
<li><a href="#" id="filter-tree">Diagram</a></li>
</ul>
</div>
<div class="repo">
<h2 class="repo-title"></h2>
<div id="latest-commit"></div>
</div>
<div class="repo">
<h2 class="repo-title"></h2>
<div id="latest-commit"></div>
</div>
<div class="repo">
<h2 class="repo-title"></h2>
<div id="latest-commit"></div>
</div>
<script type="text/javascript" charset="utf-8">
let body = document.querySelector('body');
var gitlab_url = "http://gitlab.constantvzw.org";
var user_name = "osp";
var repos = [351, 456, 508]
for (i=0; i < repos.length; i++) {
let repo = document.createElement('div'),
title = document.createElement('h2'),
commit = document.createElement('div');
title.classList.add("repo-title");
commit.setAttribute('id', 'latest-commit');
repo.appendChild(title);
repo.appendChild(commit);
body.appendChild(repo);
getMetadata(i, repos[i], repo);
getLatestCommit(i, repos[i], repo);
}
// METADATA ///////////////////////////////
function getMetadata(i, repoID, repoElt) {
let repo_url = "https://gitlab.constantvzw.org/api/v4/projects/" + repoID;
fetch(repo_url)
.then(function(resp){
//console.log(resp);
//console.log(resp.json());
return resp.json();
})
.then(function(data){
let title = repoElt.querySelector('.repo-title');
name = data.name.split(".").slice(1);
title.innerHTML = name.replace(",", ".");
})
}
// COMMITS ///////////////////////////////
function getLatestCommit(i, repoID, repoElt){
let commits_elt = repoElt.querySelector('#latest-commit');
let commits_url = "https://gitlab.constantvzw.org/api/v4/projects/" + repoID + "/repository/commits?per_page=1";
fetch(commits_url)
.then(function(resp){
return resp.json();
})
.then(function(data){
return data.map(function(commit) {
let li = document.createElement('li'),
time = document.createElement('time'),
msg = document.createElement('p'),
author = document.createElement('p');
msg.classList.add("msg");
author.classList.add("author");
time.innerHTML = commit.created_at;
msg.innerHTML = commit.message;
author.innerHTML = commit.author_name;
li.appendChild(time);
li.appendChild(msg);
li.appendChild(author);
commits_elt.appendChild(li);
})
})
//.catch(function(error) {
// console.log(JSON.stringify(error));
//});
}
// END COMMITS
</script>
</body>
</html>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment