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" >
|
<meta name="viewport" content="width=768px" >
|
||||||
<link type="text/css" rel="stylesheet" href="normalize.css">
|
<link type="text/css" rel="stylesheet" href="normalize.css">
|
||||||
<link type="text/css" rel="stylesheet" href="style.css">
|
<link type="text/css" rel="stylesheet" href="style.css">
|
||||||
|
<script type="text/javascript" src="site.js"></script>
|
||||||
<title><?=hesc($title)?></title>
|
<title><?=hesc($title)?></title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<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 {
|
a {
|
||||||
color:black;
|
color:black;
|
||||||
|
text-decoration:underline;
|
||||||
}
|
}
|
||||||
a:hover {
|
a:hover {
|
||||||
color:blue;
|
color:blue;
|
||||||
|
cursor:pointer;
|
||||||
}
|
}
|
||||||
h1 a {
|
h1 a {
|
||||||
text-decoration:none;
|
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;
|
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 {
|
.projtable {
|
||||||
border-collapse: collapse;
|
border-collapse: collapse;
|
||||||
width:100%;
|
width:100%;
|
||||||
@ -91,6 +107,9 @@ html, body {
|
|||||||
color:grey;
|
color:grey;
|
||||||
font-style:italic;
|
font-style:italic;
|
||||||
}
|
}
|
||||||
|
.projtable tr td:first-child {
|
||||||
|
width:95px;
|
||||||
|
}
|
||||||
|
|
||||||
.projinfo {
|
.projinfo {
|
||||||
position:relative;
|
position:relative;
|
||||||
|
Reference in New Issue
Block a user