added hideAll showAll filters!

This commit is contained in:
Connor Turland 2012-11-23 11:00:00 -08:00
parent 53ec317cd0
commit b34962b4f5
10 changed files with 136 additions and 56 deletions

View file

@ -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
});
}

View file

@ -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);

View file

@ -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;
}
}
});
});

View file

@ -144,7 +144,7 @@ cursor: pointer; }
#iconLegend #filters-right { float:left; }
#iconLegend li.toggledOff {
opacity: 0.2;
opacity: 0.4;
}
/* --- styling feedback button ---*/

View file

@ -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; }

View file

@ -72,6 +72,7 @@
<div id="iconLegend">
<h3>FILTERS</h3>
<ul id="filters-left">
<li id="showAll">Show All</li>
<li><img src="/assets/action.png" alt="Action" /><p>action</p></li>
<li><img src="/assets/activity.png" alt="Activity" /><p>activity</p></li>
<li><img src="/assets/bizarre.png" alt="Bizarre" /><p>bizarre</p></li>
@ -88,6 +89,7 @@
<li><img src="/assets/location.png" alt="Location" /><p>location</p></li>
</ul>
<ul id="filters-right">
<li id="hideAll">Hide All</li>
<li><img src="/assets/openissue.png" alt="Open Issue" /><p>open issue</p></li>
<li><img src="/assets/opinion.png" alt="Opinion" /><p>opinion</p></li>
<li><img src="/assets/opportunity.png" alt="Opportunity" /><p>opportunity</p></li>

View file

@ -7,7 +7,7 @@
<%= select_tag :node1_id, options_from_collection_for_select(Item.order("name ASC").visibleToUser(user, nil), "id", "name") %>
<% end %>
<label for="item_category">Directionality of the Connection</label>
<%= form.select :category, options_for_select(['none', 'both', 'from-to', 'to-from']) %>
<%= form.select :category, options_for_select(['none', 'both', 'from-to']) %>
<label for="item_desc">Describe The Connection</label>
<%= form.text_field :desc, class: "description" %>
<% if Item.visibleToUser(user, nil).count > 0 %>

View file

@ -7,7 +7,7 @@
<%= select_tag :node1_id, options_from_collection_for_select(Item.order("name ASC").visibleToUser(user, nil), "id", "name") %>
<% end %>
<label for="item_category">Directionality of the Connection</label>
<%= form.select :category, options_for_select(['none', 'both', 'from-to', 'to-from']) %>
<%= form.select :category, options_for_select(['none', 'both', 'from-to']) %>
<label for="item_desc">Describe The Connection</label>
<%= form.text_field :desc, class: "description" %>
<% if Item.visibleToUser(user, nil).count > 0 %>

View file

@ -5,7 +5,7 @@
<%= select "node1_id", "node1", Item.order("name ASC").visibleToUser(user, nil).map {|p| [ p.name, p.id ] }, { :selected => @synapse.node1_id } %>
<% end %>
<label for="item_category">Directionality of the Connection</label>
<%= form.select :category, options_for_select(['none', 'both', 'from-to', 'to-from'], @synapse.category) %>
<%= form.select :category, options_for_select(['none', 'both', 'from-to'], @synapse.category) %>
<label for="item_desc">Describe The Connection</label>
<%= form.text_field :desc, class: "description" %>
<% if Item.visibleToUser(user, nil).count > 0 %>

View file

@ -6,7 +6,7 @@
<%= select_tag :node1_id, options_from_collection_for_select(Item.order("name ASC").visibleToUser(user, nil), "id", "name") %>
<% end %>
<label for="item_category">Directionality of the Connection</label>
<%= form.select :category, options_for_select(['none', 'both', 'from-to', 'to-from']) %>
<%= form.select :category, options_for_select(['none', 'both', 'from-to']) %>
<label for="item_desc">Describe The Connection</label>
<%= form.text_field :desc, class: "description" %>
<% if Item.visibleToUser(user, nil).count > 0 %>