From: Gabriel Dunne Date: Sat, 23 Mar 2013 19:45:10 +0000 (-0700) Subject: Added Facets X-Git-Url: https://git.quilime.com/?a=commitdiff_plain;h=1efd67be661f11385f8e91b9138e03653a795886;p=visual-archive.git Added Facets --- diff --git a/public/css/style.css b/public/css/style.css index 0d7885b..5f63115 100644 --- a/public/css/style.css +++ b/public/css/style.css @@ -12,10 +12,12 @@ ul, li { margin:0; } a { - color:#ff0; + color:#ff5; + text-decoration: none; } ul.thumbs { margin-top:35px; + margin-left:120px; text-align:center; } ul.thumbs li { @@ -49,16 +51,32 @@ ul.thumbs li img { #subcontent .container ul { padding:20px; } +#subcontent .container ul.thumbs { + margin:0; +} #subcontent .container li { display:inline-block; + background:#222; margin:5px; } #filter { - position:fixed; - top:5px; - right:5px; color:#eee; background:#777; border:1px solid #aaa; padding:5px; + width:100px; +} +#filter-elem { + position: absolute; + left:5px; + top:5px; +} +#facets { + position:absolute; + left:5px; + top:40px; +} +#clear_filter { + padding:0.5em; + } diff --git a/public/js/script.js b/public/js/script.js index 2fb9dab..9acceaf 100644 --- a/public/js/script.js +++ b/public/js/script.js @@ -1,25 +1,40 @@ var extended_json = {}; +var on_filter_change = function() { + var query = $('#filter').val().toLowerCase(); + var d = jQuery.grep(extended_json.clips, function(clip, i) { + if (clip.id.toLowerCase().indexOf(query) >= 0 || + (clip.description && clip.description.toLowerCase().indexOf(query) >= 0)) + return true; + if (clip.subject) + for (var j = 0; j < clip.subject.length; j++) + if (clip.subject[j].toLowerCase().indexOf(query) >= 0) + return true; + return false; + }); + $('.thumbs li').hide(); + for (var i = 0; i < d.length; i++) { + $('.thumbs li#' + d[i].id).show(); + } +} + $(document).ready(function() { - $('#filter').hide(); - $('#filter').keyup(function() { - var query = this.value.toLowerCase(); - var d = jQuery.grep(extended_json.clips, function(clip, i) { - if (clip.id.toLowerCase().indexOf(query) >= 0 || - (clip.description && clip.description.toLowerCase().indexOf(query) >= 0)) - return true; - if (clip.subject) - for (var j = 0; j < clip.subject.length; j++) - if (clip.subject[j].toLowerCase().indexOf(query) >= 0) - return true; - return false; + $('#facets a').each(function(key, elem) { + + $(elem).click(function() { + $('#filter').val($(elem).text()); + on_filter_change(); }); - $('.thumbs li').hide(); - for (var i = 0; i < d.length; i++) { - $('.thumbs li#' + d[i].id).show(); - } + }) + + $('#clear_filter').click(function(){ + $('#filter').val(""); + on_filter_change(); }); + $('#filter').hide(); + $('#filter').keyup(on_filter_change); + $.getJSON('data/prelinger_extended-search.json', function(data) { extended_json = data; diff --git a/routes/index.js b/routes/index.js index b56c6e9..019ea6e 100644 --- a/routes/index.js +++ b/routes/index.js @@ -1,9 +1,9 @@ var fs = require("fs") -, prelinger = require('../prelinger.json'); +, prelinger = require('../prelinger_extended-search.json'); var LIMIT = false; exports.index = function(req, res) { - var count = 10; + var count = 50; var clips = []; for( var i = 0; i < prelinger.clips.length; i++) { if (LIMIT) { count--; if (count == 0) { break; } } diff --git a/views/index.ejs b/views/index.ejs index 470b0af..75c8974 100644 --- a/views/index.ejs +++ b/views/index.ejs @@ -7,7 +7,63 @@ - + +
+ Filter × +
+ +
+ +
+ +