tag support 2/2: javascript handling
This commit is contained in:
parent
d440ccc1b3
commit
1a0251071d
@ -260,6 +260,7 @@ function template($title, $content) {
|
||||
<meta name="viewport" content="width=768px" >
|
||||
<link type="text/css" rel="stylesheet" href="normalize.css">
|
||||
<link type="text/css" rel="stylesheet" href="style.css">
|
||||
<script type="text/javascript" src="site.js"></script>
|
||||
<title><?=hesc($title)?></title>
|
||||
</head>
|
||||
<body>
|
||||
|
41
static/site.js
Normal file
41
static/site.js
Normal file
@ -0,0 +1,41 @@
|
||||
(function() {
|
||||
"use strict";
|
||||
|
||||
var show_all = function() {
|
||||
var tr = document.querySelectorAll(".projtable tr");
|
||||
for (var i = 0, e = tr.length; i !== e; ++i) {
|
||||
tr[i].style.display = "table-row";
|
||||
}
|
||||
|
||||
document.querySelector(".tag-filter-warn").remove();
|
||||
};
|
||||
|
||||
var show_tag = function(tag) {
|
||||
var tr = document.querySelectorAll(".projtable tr");
|
||||
for (var i = 0, e = tr.length; i !== e; ++i) {
|
||||
tr[i].style.display = (tr[i].className.split(" ").indexOf("taggedWith-"+tag) === -1) ? "none" : "table-row";
|
||||
}
|
||||
|
||||
var div = document.createElement("div");
|
||||
div.className = "tag-filter-warn";
|
||||
div.innerHTML = "Filtering by tag. <a>reset</a>";
|
||||
document.body.appendChild(div);
|
||||
|
||||
document.querySelector(".tag-filter-warn a").addEventListener('click', function() {
|
||||
show_all();
|
||||
return false;
|
||||
});
|
||||
};
|
||||
|
||||
var get_show_tag = function(tag) {
|
||||
return function() { show_tag(tag); return false; };
|
||||
};
|
||||
|
||||
window.addEventListener('load', function() {
|
||||
var taglinks = document.querySelectorAll(".tag-link");
|
||||
for (var i = 0, e = taglinks.length; i !== e; ++i) {
|
||||
var tag = taglinks[i].getAttribute("data-tag");
|
||||
taglinks[i].addEventListener('click', get_show_tag(tag));
|
||||
}
|
||||
});
|
||||
})();
|
@ -8,9 +8,11 @@ img {
|
||||
}
|
||||
a {
|
||||
color:black;
|
||||
text-decoration:underline;
|
||||
}
|
||||
a:hover {
|
||||
color:blue;
|
||||
cursor:pointer;
|
||||
}
|
||||
h1 a {
|
||||
text-decoration:none;
|
||||
@ -74,6 +76,20 @@ html, body {
|
||||
background:transparent url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAZUlEQVQI12P4//8/Awyrqqp6KSkp/QdhFRWV7cgS+kDBN0B8RVlZuRikACahB+T8ger6BMTXwJJAiTwg4xvMOCj+ART3ZwCa3YYm8QcopgsyEWasDVT3W5AVMHcgO6gViNORXQ8A84NToxbSsJcAAAAASUVORK5CYII=') no-repeat 0 0;
|
||||
}
|
||||
|
||||
.tag-filter-warn {
|
||||
position:fixed;
|
||||
top:0;
|
||||
right:0;
|
||||
|
||||
padding:4px;
|
||||
|
||||
background:lightyellow;
|
||||
border-bottom: 1px solid #888;
|
||||
border-left:1px solid #888;
|
||||
}
|
||||
|
||||
/* */
|
||||
|
||||
.projtable {
|
||||
border-collapse: collapse;
|
||||
width:100%;
|
||||
@ -91,6 +107,9 @@ html, body {
|
||||
color:grey;
|
||||
font-style:italic;
|
||||
}
|
||||
.projtable tr td:first-child {
|
||||
width:95px;
|
||||
}
|
||||
|
||||
.projinfo {
|
||||
position:relative;
|
||||
|
Reference in New Issue
Block a user