diff options
Diffstat (limited to 'data')
-rw-r--r-- | data/js/tagops.js | 25 | ||||
-rw-r--r-- | data/style.css | 30 |
2 files changed, 34 insertions, 21 deletions
diff --git a/data/js/tagops.js b/data/js/tagops.js index 3f789ee6..4eebee43 100644 --- a/data/js/tagops.js +++ b/data/js/tagops.js @@ -1,30 +1,29 @@ var l, lim, spoil = 0, cats = {}; - function init() { var i; - l = byName(byId('tagops'), 'a'); + l = byName(byId('tagops'), 'input'); // Categories for(i=0; i<3; i++) { - l[i].tagops_cat = l[i].href.substr(l[i].href.indexOf('#')+1); - l[i].onclick = function() { cats[this.tagops_cat] = !cats[this.tagops_cat]; return set(); }; - cats[l[i].tagops_cat] = hasClass(l[i], 'tsel'); + l[i].tagops_cat = l[i].id.substr(l[i].id.indexOf('cat')+4); + l[i].onchange = function() { cats[this.tagops_cat] = !cats[this.tagops_cat]; return set(); }; + cats[l[i].tagops_cat] = l[i].checked; } // Spoiler level for(i=3; i<6; i++) { l[i].tagops_spoil = i-3; - l[i].onclick = function() { spoil = this.tagops_spoil; return set(); }; - if(hasClass(l[i], 'tsel')) + l[i].onchange = function() { spoil = this.tagops_spoil; return set(); }; + if(l[i].checked) spoil = i-3; } // Summary / all for(i=6; i<8; i++) { l[i].tagops_lim = i == 6; - l[i].onclick = function() { lim = this.tagops_lim; return set(); }; - if(hasClass(l[i], 'tsel')) + l[i].onchange = function() { lim = this.tagops_lim; return set(); }; + if(l[i].checked) lim = i == 6; } @@ -35,15 +34,9 @@ function init() { function set() { var i; - // Set link selection class - for(i=0; i<8; i++) - setClass(l[i], 'tsel', - i < 3 ? cats[l[i].tagops_cat] : - i < 6 ? l[i].tagops_spoil == spoil - : l[i].tagops_lim == lim); - // update tag visibility var t = byName(byId('vntags'), 'span'); + var n = 0; for(i=0; i<t.length; i++) { var v = n < (lim ? 15 : 999); diff --git a/data/style.css b/data/style.css index 036220a7..5f2d5ee4 100644 --- a/data/style.css +++ b/data/style.css @@ -373,13 +373,33 @@ div.vndetails td.anime b { font-size: 10px; font-weight: normal; padding-ri tr#buynow .pricenote { border: 0 } -div#vntags { margin: 15px 30px 0 30px; border-top: 1px solid $border$; padding: 1px 5% 0 5%; text-align: center; } +div#vntags { margin: 0 30px 0 30px; border-top: 1px solid $border$; padding: 1px 5% 0 5%; text-align: center; } #vntags span { white-space: nowrap; margin-left: 15px; } #vntags b { color: $grayedout$; font-weight: normal; font-size: 10px } -#tagops { float: right; text-align: right; width: auto; margin: 0 30px; } -#tagops a { margin: 0 0 0 10px; border: 0; outline: none } -#tagops a.sec { border-left: 1px solid $border$; padding-left: 10px } -#tagops a.tsel { color: $maintext$; } +#tagops { text-align: right; width: auto; } + +#tagops label { margin: 0 0 0 10px; border: 0; outline: none; color: $link$; cursor: pointer; } +#tagops label.sec { border-left: 1px solid $border$; padding-left: 10px } +#tagops label.lst { margin: 0 30px 0 10px; } +#tagops input:checked + label { color: $maintext$; } + +/* tag filter machinery; the order of declarations is important */ + +#tag_spoil_all:checked ~ #vntags .cut2 { display: none; } +#tag_spoil_some:checked ~ #vntags .cut1 { display: none; } +#tag_spoil_none:checked ~ #vntags .cut0 { display: none; } + +#tag_toggle_all:checked ~ #vntags .cut { display: inline } + +#cat_cont:not(:checked) ~ #vntags .cat_cont { display: none; } +#cat_tech:not(:checked) ~ #vntags .cat_tech { display: none; } +#cat_ero:not(:checked) ~ #vntags .cat_ero { display: none; } + +#tag_spoil_none:checked ~ #vntags .tagspl1 { display: none; } +#tag_spoil_none:checked ~ #vntags .tagspl2 { display: none; } +#tag_spoil_some:checked ~ #vntags .tagspl2 { display: none; } + +/* end of tag filter machinery */ .releases table, #screenshots table { width: 100%; } |