summaryrefslogtreecommitdiff
path: root/http/res
diff options
context:
space:
mode:
authoremkael <emkael@tlen.pl>2017-04-11 18:28:26 +0200
committeremkael <emkael@tlen.pl>2017-04-11 18:28:26 +0200
commit56a98e9c45a5427cb47676d8888bef69ac8a9e77 (patch)
tree92452494fb088b8e471fb8ef90b534d4c7d46f18 /http/res
parent107b582dd84fc7f4a08cd5e57ce2e90d6910611c (diff)
Interactive, multiple choice filters
Diffstat (limited to 'http/res')
-rw-r--r--http/res/ranking.js35
1 files changed, 27 insertions, 8 deletions
diff --git a/http/res/ranking.js b/http/res/ranking.js
index b1c0bf8..2bba8a1 100644
--- a/http/res/ranking.js
+++ b/http/res/ranking.js
@@ -11,12 +11,12 @@ var playerClick = function(ev) {
var parseHash = function() {
var hash = location.hash.replace(/^#/, '');
- var hashParams = hash.split(',');
+ var hashParams = hash.split(';');
var params = new Map();
hashParams.forEach(function(hashParam) {
var param = hashParam.split(':');
if (param.length > 1) {
- params.set(param[0], param[1]);
+ params.set(param[0], param[1].split(','));
}
});
return params;
@@ -24,20 +24,24 @@ var parseHash = function() {
var constructHash = function(params) {
return Array.from(params).map(function(param) {
- return param[0] + ':' + param[1];
- }).join(',');
+ return param[0] + ':' + param[1].join(',');
+ }).join(';');
}
var readHash = function() {
$('button.btn-primary').removeClass('btn-primary');
var params = parseHash();
- params.forEach(function(value, param) {
- $('button[data-filter="' + param + '"][data-value="' + value + '"]').addClass('btn-primary');
+ params.forEach(function(values, param) {
+ values.forEach(function(value) {
+ $('button[data-filter="' + param + '"][data-value="' + value + '"]').addClass('btn-primary');
+ });
});
var allParams = ['age', 'gender', 'region'];
allParams.forEach(function(param) {
if ($('button[data-filter="' + param + '"].btn-primary').size() == 0) {
$('button[data-clear="' + param + '"]').addClass('btn-primary');
+ } else {
+ $('#filters').collapse();
}
});
filterRows(params);
@@ -47,7 +51,7 @@ var filterRows = function(params) {
$('table.table tbody tr').show().removeClass('gold silver bronze').each(function() {
var row = $(this);
params.forEach(function(value, param) {
- if (row.find('td.' + param).text().trim() != value) {
+ if (value.indexOf(row.find('td.' + param).text().trim()) == -1) {
row.hide();
}
});
@@ -68,7 +72,22 @@ $('button[data-filter]').click(function() {
$('table.table').css('opacity', 0.1);
var button = $(this);
var params = parseHash();
- params.set(button.attr('data-filter'), button.attr('data-value'));
+ var param = params.get(button.attr('data-filter'));
+ var value = button.attr('data-value');
+ var index = param ? param.indexOf(value) : -1;
+ if (index > -1) {
+ param = param.filter(function(v) { return v != value; });
+ } else {
+ if (!param) {
+ param = [];
+ }
+ param.push(value);
+ }
+ if (!param.length) {
+ params.delete(button.attr('data-filter'));
+ } else {
+ params.set(button.attr('data-filter'), param);
+ }
location.hash = constructHash(params);
});