From b34962b4f5080122b1e5437e68c5db79a3b1cddd Mon Sep 17 00:00:00 2001 From: Connor Turland Date: Fri, 23 Nov 2012 11:00:00 -0800 Subject: [PATCH] added hideAll showAll filters! --- app/assets/javascripts/Jit/filters.js | 30 ++++++ app/assets/javascripts/Jit/jit2.0.0.js | 4 +- app/assets/javascripts/application.js | 143 +++++++++++++++++-------- app/assets/stylesheets/application.css | 2 +- app/assets/stylesheets/base.css | 3 +- app/views/layouts/application.html.erb | 2 + app/views/maps/_newsynapse.html.erb | 2 +- app/views/synapses/_new.html.erb | 2 +- app/views/synapses/edit.html.erb | 2 +- app/views/synapses/new.html.erb | 2 +- 10 files changed, 136 insertions(+), 56 deletions(-) diff --git a/app/assets/javascripts/Jit/filters.js b/app/assets/javascripts/Jit/filters.js index 560b13d8..d53bf105 100644 --- a/app/assets/javascripts/Jit/filters.js +++ b/app/assets/javascripts/Jit/filters.js @@ -74,3 +74,33 @@ function showCategory(g, category, duration) { duration: duration }); } + +function hideAll(g, duration) { + if (duration == null) duration = 500; + g.graph.eachNode( function (n) { + n.setData('alpha', 0, 'end'); + n.eachAdjacency(function(adj) { + adj.setData('alpha', 0, 'end'); + }); + }); + g.fx.animate({ + modes: ['node-property:alpha', + 'edge-property:alpha'], + duration: duration + }); +} + +function showAll(g, duration) { + if (duration == null) duration = 500; + g.graph.eachNode( function (n) { + n.setData('alpha', 1, 'end'); + n.eachAdjacency(function(adj) { + adj.setData('alpha', 1, 'end'); + }); + }); + g.fx.animate({ + modes: ['node-property:alpha', + 'edge-property:alpha'], + duration: duration + }); +} diff --git a/app/assets/javascripts/Jit/jit2.0.0.js b/app/assets/javascripts/Jit/jit2.0.0.js index 7e737b99..41875588 100644 --- a/app/assets/javascripts/Jit/jit2.0.0.js +++ b/app/assets/javascripts/Jit/jit2.0.0.js @@ -3114,8 +3114,8 @@ var Canvas; this.viz = viz; this.config = $.merge({ idSuffix: '-bkcanvas', - levelDistance: 100, - numberOfCircles: 6, + levelDistance: 200, + numberOfCircles: 4, CanvasStyles: {}, offset: 0 }, options); diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index ae469879..c792ca07 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -106,22 +106,26 @@ ); var sliding4 = false; + var lT; $(".legend").hover( function () { + clearTimeout(lT); if (! sliding4) { - sliding4 = true; - $("#iconLegend ul").slideDown('slow', function() { - sliding4 = false; - }); + sliding4 = true; + $("#iconLegend ul").slideDown('slow', function() { + sliding4 = false; + }); } }, function () { - if (! sliding4) { - sliding4 = true; - $("#iconLegend ul").slideUp('slow', function() { - sliding4 = false; - }); - } + lT = setTimeout(function() { + if (! sliding4) { + sliding4 = true; + $("#iconLegend ul").slideUp('slow', function() { + sliding4 = false; + }); + } + },800); } ); @@ -129,45 +133,90 @@ $('.legend ul li').click(function(event) { obj = document.getElementById('container'); - var category = $(this).children('img').attr('alt'); + var switchAll = $(this).attr('id'); + console.log(switchAll); - // this means that we are on a map view - if (obj != null) { - if (fd != null) { - switchVisible(fd, category); - } - else if (rg != null) { - switchVisible(rg, category); - } - } - // this means that we are on a card view - else { - console.log('test'); - if (categoryVisible[category] == true) { - if (category.split(' ').length == 1) { - $('#cards .' + category).fadeOut('slow'); - } - else { - $('#cards .' + category.split(' ')[0]).fadeOut('slow'); - } - } - else if (categoryVisible[category] == false) { - if (category.split(' ').length == 1) { - $('#cards .' + category).fadeIn('slow'); - } - else { - $('#cards .' + category.split(' ')[0]).fadeIn('slow'); - } - } - } - // toggle the image and the boolean array value - if (categoryVisible[category] == true) { - $(this).addClass('toggledOff'); - categoryVisible[category] = false; + if ( switchAll === "showAll" || switchAll === "hideAll") { + if (switchAll == "showAll") { + // this means that we are on a map view + if (obj != null) { + if (fd != null) { + showAll(fd); + } + else if (rg != null) { + showAll(rg); + } + } + // this means that we are on a card view + else { + console.log('rightone'); + $('.item').fadeIn('slow'); + } + $('.legend ul li').not('#hideAll, #showAll').removeClass('toggledOff'); + for (var catVis in categoryVisible) { + categoryVisible[catVis] = true; + } + } + else if (switchAll == "hideAll") { + // this means that we are on a map view + if (obj != null) { + if (fd != null) { + hideAll(fd); + } + else if (rg != null) { + hideAll(rg); + } + } + // this means that we are on a card view + else { + $('.item').fadeOut('slow'); + } + $('.legend ul li').not('#hideAll, #showAll').addClass('toggledOff'); + for (var catVis in categoryVisible) { + categoryVisible[catVis] = false; + } + } } - else if (categoryVisible[category] == false) { - $(this).removeClass('toggledOff'); - categoryVisible[category] = true; + else { + var category = $(this).children('img').attr('alt'); + + // this means that we are on a map view + if (obj != null) { + if (fd != null) { + switchVisible(fd, category); + } + else if (rg != null) { + switchVisible(rg, category); + } + } + // this means that we are on a card view + else { + if (categoryVisible[category] == true) { + if (category.split(' ').length == 1) { + $('#cards .' + category).fadeOut('slow'); + } + else { + $('#cards .' + category.split(' ')[0]).fadeOut('slow'); + } + } + else if (categoryVisible[category] == false) { + if (category.split(' ').length == 1) { + $('#cards .' + category).fadeIn('slow'); + } + else { + $('#cards .' + category.split(' ')[0]).fadeIn('slow'); + } + } + } + // toggle the image and the boolean array value + if (categoryVisible[category] == true) { + $(this).addClass('toggledOff'); + categoryVisible[category] = false; + } + else if (categoryVisible[category] == false) { + $(this).removeClass('toggledOff'); + categoryVisible[category] = true; + } } }); }); diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index 015b6244..524b35f4 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -144,7 +144,7 @@ cursor: pointer; } #iconLegend #filters-right { float:left; } #iconLegend li.toggledOff { - opacity: 0.2; + opacity: 0.4; } /* --- styling feedback button ---*/ diff --git a/app/assets/stylesheets/base.css b/app/assets/stylesheets/base.css index 2ca67cea..1cdee9b0 100644 --- a/app/assets/stylesheets/base.css +++ b/app/assets/stylesheets/base.css @@ -13,9 +13,8 @@ text-align: left; overflow: auto; position:absolute; - top:50%; + top:200px; left:10px; - margin-top:-150px; } #showcard .contributor { font-size:14px; } diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index e696c43a..2cfcab79 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -72,6 +72,7 @@

FILTERS