diff --git a/templates/tag.html b/templates/tag.html
index f859062..c6269bb 100644
--- a/templates/tag.html
+++ b/templates/tag.html
@@ -78,10 +78,11 @@ request.send();
request.onload=function(){
jsonData=JSON.parse(request.response);
console.log(jsonData);
- showList(window.location.hash.slice(1));
+ showList();
+ setClassDisplay(decodeURI(window.location.hash.slice(1)));
}
-function showList(tag){
+function showList(){
let SideNav=document.getElementsByClassName("SideNav")[0];
let tagLable=document.getElementById("tagLable");
for(i in jsonData["postListJson"]){
@@ -96,55 +97,67 @@ function showList(tag){
tagLable.appendChild(showLabels);
}
- if(encodeURI(jsonData["postListJson"][i]['label'])==tag || tag==''){
- let item=document.createElement("a");
- item.setAttribute("class","SideNav-item d-flex flex-items-center flex-justify-between");
- item.setAttribute("href",jsonData["postListJson"][i]['postUrl']);
+ // if(encodeURI(jsonData["postListJson"][i]['label'])==tag || tag==''){
+ let item=document.createElement("a");
+ item.setAttribute("class","SideNav-item d-flex flex-items-center flex-justify-between "+jsonData["postListJson"][i]['label']);
+ item.setAttribute("href",jsonData["postListJson"][i]['postUrl']);
- let center=document.createElement("div");
- center.setAttribute("class","d-flex flex-items-center");
+ let center=document.createElement("div");
+ center.setAttribute("class","d-flex flex-items-center");
- svg=document.createElementNS('http://www.w3.org/2000/svg','svg');
- path=document.createElementNS("http://www.w3.org/2000/svg","path");
- span=document.createElement("span");
- svg.setAttributeNS(null,"class","SideNav-icon octicon");
- svg.setAttributeNS(null,"style","witdh:16px;height:16px");
- path.setAttributeNS(null, "d", IconList["post"]);
- svg.appendChild(path);
+ svg=document.createElementNS('http://www.w3.org/2000/svg','svg');
+ path=document.createElementNS("http://www.w3.org/2000/svg","path");
+ span=document.createElement("span");
+ svg.setAttributeNS(null,"class","SideNav-icon octicon");
+ svg.setAttributeNS(null,"style","witdh:16px;height:16px");
+ path.setAttributeNS(null, "d", IconList["post"]);
+ svg.appendChild(path);
- let title=document.createElement("span");
- title.setAttribute("class","listTitle");
- title.innerHTML=jsonData["postListJson"][i]['postTitle'];
- center.appendChild(svg);
- center.appendChild(title);
+ let title=document.createElement("span");
+ title.setAttribute("class","listTitle");
+ title.innerHTML=jsonData["postListJson"][i]['postTitle'];
+ center.appendChild(svg);
+ center.appendChild(title);
- let listLabels=document.createElement("div");
- listLabels.setAttribute("class","listLabels");
- let LabelName=document.createElement("span");
- LabelName.setAttribute("class","Label");
- LabelName.setAttribute("style","background-color:"+jsonData["postListJson"][i]['labelColor']);
- LabelName.innerHTML=jsonData["postListJson"][i]['label'];
- listLabels.appendChild(LabelName);
- let LabelTime=document.createElement("span");
- LabelTime.setAttribute("class","Label");
- LabelTime.setAttribute("style","background-color:"+jsonData["postListJson"][i]['dateLabelColor']);
- LabelTime.innerHTML=jsonData["postListJson"][i]['createdDate'];
- listLabels.appendChild(LabelTime);
+ let listLabels=document.createElement("div");
+ listLabels.setAttribute("class","listLabels");
+ let LabelName=document.createElement("span");
+ LabelName.setAttribute("class","Label");
+ LabelName.setAttribute("style","background-color:"+jsonData["postListJson"][i]['labelColor']);
+ LabelName.innerHTML=jsonData["postListJson"][i]['label'];
+ listLabels.appendChild(LabelName);
+ let LabelTime=document.createElement("span");
+ LabelTime.setAttribute("class","Label");
+ LabelTime.setAttribute("style","background-color:"+jsonData["postListJson"][i]['dateLabelColor']);
+ LabelTime.innerHTML=jsonData["postListJson"][i]['createdDate'];
+ listLabels.appendChild(LabelTime);
- item.appendChild(center);
- item.appendChild(listLabels);
- SideNav.appendChild(item);
- }
+ item.appendChild(center);
+ item.appendChild(listLabels);
+ SideNav.appendChild(item);
+ // }
}
}
function updateShowTag(label){
if(window.location.hash.slice(1)!=encodeURI(label)){
window.location.hash="#"+(label);
- showList(label);
+ setClassDisplay(label);
console.log("change to "+label);
}
}
+function setClassDisplay(lable) {
+ let SideNav = document.getElementsByClassName("SideNav-item");
+ for(let i = 0; i < SideNav.length; i++){
+ SideNav[i].style.display='none';
+ }
+
+ let lables = document.getElementsByClassName(lable);
+ for(let i = 0; i < lables.length; i++){
+ lables[i].style.display='block';
+ }
+}
+
{% endblock %}