1
0
mirror of https://github.com/oupala/apaxy.git synced 2025-08-11 20:54:21 +02:00

feat: add a breadcrumb

Add a breadcrumb to tell the user where he is in the tree. js and html is there and working. It needs some css styling though.
This commit is contained in:
oupala
2019-05-28 14:59:25 +02:00
parent 08446fb51f
commit 33d4777101
2 changed files with 29 additions and 0 deletions

View File

@@ -74,3 +74,29 @@ if (uri.substring(uri.length - 1) !== '/') {
});
})(document);
// generate a breadcrumb
var uri = window.location.pathname.substr(1);
var arr = uri.split('/');
var url = ""
var bread = '<li><strong><a href="/">Home</a></strong></li>';
var cont = 1;
arr.forEach(function(value){
url = url + '/' + value;
if(value != ''){
if(arr.length == cont+1)
bread += "<li class='active'>"+decodeURI(value)+"</li>";
else
bread += "<li><a href='"+url+"'>"+decodeURI(value)+"</a></li>";
}
cont++;
});
document.getElementById("breadcrumbs").innerHTML = bread;
if (uri.substring(uri.length-1) != '/'){
var indexes = document.getElementsByClassName('indexcolname'),
i = indexes.length;
while (i--){
var a = indexes[i].getElementsByTagName('a')[0];
a.href = uri + '/' + a.getAttribute('href',2);
}
}

View File

@@ -1,4 +1,7 @@
<div class="wrapper">
<!-- we open the `wrapper` element here, but close it in the `footer.html` file -->
<ol class="breadcrumb" id="breadcrumbs">
</ol>
<input type="search" id="filter" placeholder="filter contents" />