Commit cc841e14 authored by svilayphiou's avatar svilayphiou
Browse files

Root tree made in js + clicking on it lists subfolder items in the

console.
parent dd12125a
......@@ -6,12 +6,12 @@
<h2 class="repo-title">{{ project.name }}</h2>
<h2 class="repo-title"></h2>
<ul id="views">
<!-- <span>views:</span>
--> <li><a href="#" id="filter-readme">Description</a></li>
<!-- <span>views:</span>-->
<li><a href="#" id="filter-readme">Description</a></li>
<li><a href="#" id="filter-images">Visual process </a></li>
<li><a href="#tree" id="filter-tree">Files</a></li>
<li><a href="#" id="filter-commit">Last updates</a></li>
<li><a href="#" id="filter-images">visual process </a></li>
<li><a href="works-fonts.html" id="filter-fonts">Font used</a></li>
<li><a href="#" id="filter-tree">Diagram</a></li>
<li><a href="" id="filter-fonts">Font used</a></li>
</ul>
</header>
<section id="repo-content">
......@@ -36,12 +36,15 @@
</div>
</div>
</section>
<section id="tree" class="repo-views">
<section id="tree" class="repo-views" >
<h3>Tree</h3>
<ul>
{% for file in project.tree %}
<li>{{ file.name }}</li>
{% endfor %}
<ul v-for="blob in fileList">
<li v-bind:class="blob.type">
<a v-on:click="folder(blob.path)" href="#">
<span v-if="blob.type === 'tree'"></span>
[[ blob.name ]]
</a>
</li>
</ul>
</section>
<section id="commits" class="repo-views">
......@@ -72,12 +75,64 @@
var gitlab_url = "http://gitlab.constantvzw.org";
var user_name = "osp";
var repoID = {{ project.id }};
//var filterTree = new Vue({
// el: '#filter-tree',
// data: {
// name: 'Vue.js'
// },
// // define methods under the `methods` object
// methods: {
// greet: function (event) {
// // `this` inside methods points to the Vue instance
// alert('Hello ' + this.name + '!')
// // `event` is the native DOM event
// if (event) {
// alert(event.target.tagName)
// }
// }
// }
//})
// T R E E
var fileList = [];
var treeURL = "https://gitlab.constantvzw.org/api/v4/projects/" + repoID + "/repository/tree?per_page=100";
fetch(treeURL).then(function(resp){ return resp.json(); })
.then(function(data){
return data.map(function(file) {
console.log(file);
fileList.push(file);
})
})
var treeApp = new Vue({
el: '#tree',
data: {
fileList
},
delimiters: ['[[',']]'],
methods: {
folder: function(path){
var treeURL = "https://gitlab.constantvzw.org/api/v4/projects/" + repoID + "/repository/tree?per_page=100&path="+ path;
fetch(treeURL).then(function(resp){ return resp.json(); })
.then(function(data){
fileList = [];
return data.map(function(file) {
fileList.push(file);
console.log(fileList);
})
})
}
}
})
// I M A G E S
var icebergList = [];
var processusList = [];
let icebergURL = "https://gitlab.constantvzw.org/api/v4/projects/" + repoID + "/repository/tree?path=iceberg";
let processusURL = "https://gitlab.constantvzw.org/api/v4/projects/" + repoID + "/repository/tree?path=processus";
getImages(repoID, icebergURL, icebergList);
getImages(repoID, processusURL, processusList);
......@@ -95,7 +150,6 @@
}
})
function getImages(repoID, apiURL, imageList){
fetch(apiURL).then(function(resp){ return resp.json(); })
.then(function(data){
......@@ -108,6 +162,8 @@
})
});
}
</script>
{% endblock script %}
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