diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
index 8a3fd880..cbe5cc13 100644
--- a/app/assets/javascripts/application.js
+++ b/app/assets/javascripts/application.js
@@ -19,11 +19,6 @@
//= require Jit/RGraph/metamapRG
//= require Jit/filters
-function capitaliseFirstLetter(string)
-{
- return string.charAt(0).toUpperCase() + string.slice(1);
-}
-
$(document).ready(function() {
$('.nodemargin').css('padding-top',$('.focus').css('height'));
@@ -55,11 +50,11 @@ function capitaliseFirstLetter(string)
}
);
+ // toggle visibility of item categories based on status in the filters list
$('.legend ul li').click(function(event) {
obj = document.getElementById('container');
var category = $(this).children('img').attr('alt');
- category = capitaliseFirstLetter(category);
// this means that we are on a map view
if (obj != null) {
@@ -74,10 +69,20 @@ function capitaliseFirstLetter(string)
else {
console.log('test');
if (categoryVisible[category] == true) {
- $('#cards .' + category).fadeOut('fast');
+ if (category.split(' ').length == 1) {
+ $('#cards .' + category).fadeOut('slow');
+ }
+ else {
+ $('#cards .' + category.split(' ')[0]).fadeOut('slow');
+ }
}
else if (categoryVisible[category] == false) {
- $('#cards .' + category).fadeIn('fast');
+ if (category.split(' ').length == 1) {
+ $('#cards .' + category).fadeIn('slow');
+ }
+ else {
+ $('#cards .' + category.split(' ')[0]).fadeIn('slow');
+ }
}
}
// toggle the image and the boolean array value
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 610edc8d..4cfddfa0 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -11,36 +11,36 @@
<div id="iconLegend">
<h3>FILTERS</h3>
<ul id="filters-left">
- <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>
- <li><img src="/assets/catalyst.png" alt="catalyst" /><p>catalyst</p></li>
- <li><img src="/assets/closed.png" alt="closed" /><p>closed</p></li>
- <li><img src="/assets/experience.png" alt="experience" /><p>experience</p></li>
- <li><img src="/assets/futuredev.png" alt="future dev" /><p>future dev</p></li>
- <li><img src="/assets/group.png" alt="group" /><p>group</p></li>
- <li><img src="/assets/idea.png" alt="idea" /><p>idea</p></li>
- <li><img src="/assets/implication.png" alt="implication" /><p>implication</p></li>
- <li><img src="/assets/insight.png" alt="insight" /><p>insight</p></li>
- <li><img src="/assets/intention.png" alt="intention" /><p>intention</p></li>
- <li><img src="/assets/knowledge.png" alt="knowledge" /><p>knowledge</p></li>
- <li><img src="/assets/location.png" alt="location" /><p>location</p></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>
+ <li><img src="/assets/catalyst.png" alt="Catalyst" /><p>catalyst</p></li>
+ <li><img src="/assets/closed.png" alt="Closed" /><p>closed</p></li>
+ <li><img src="/assets/experience.png" alt="Experience" /><p>experience</p></li>
+ <li><img src="/assets/futuredev.png" alt="Future Dev" /><p>future dev</p></li>
+ <li><img src="/assets/group.png" alt="Group" /><p>group</p></li>
+ <li><img src="/assets/idea.png" alt="Idea" /><p>idea</p></li>
+ <li><img src="/assets/implication.png" alt="Implication" /><p>implication</p></li>
+ <li><img src="/assets/insight.png" alt="Insight" /><p>insight</p></li>
+ <li><img src="/assets/intention.png" alt="Intention" /><p>intention</p></li>
+ <li><img src="/assets/knowledge.png" alt="Knowledge" /><p>knowledge</p></li>
+ <li><img src="/assets/location.png" alt="Location" /><p>location</p></li>
</ul>
<ul id="filters-right">
- <li><img src="/assets/openissue.png" alt="openissue" /><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>
- <li><img src="/assets/person.png" alt="person" /><p>person</p></li>
- <li><img src="/assets/platform.png" alt="platform" /><p>platform</p></li>
- <li><img src="/assets/problem.png" alt="problem" /><p>problem</p></li>
- <li><img src="/assets/question.png" alt="question" /><p>question</p></li>
- <li><img src="/assets/reference.png" alt="reference" /><p>reference</p></li>
- <li><img src="/assets/requirement.png" alt="requirement" /><p>requirement</p></li>
- <li><img src="/assets/resource.png" alt="resource" /><p>resource</p></li>
- <li><img src="/assets/role.png" alt="role" /><p>role</p></li>
- <li><img src="/assets/task.png" alt="task" /><p>task</p></li>
- <li><img src="/assets/tool.png" alt="tool" /><p>tool</p></li>
- <li><img src="/assets/trajectory.png" alt="trajectory" /><p>trajectory</p></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>
+ <li><img src="/assets/person.png" alt="Person" /><p>person</p></li>
+ <li><img src="/assets/platform.png" alt="Platform" /><p>platform</p></li>
+ <li><img src="/assets/problem.png" alt="Problem" /><p>problem</p></li>
+ <li><img src="/assets/question.png" alt="Question" /><p>question</p></li>
+ <li><img src="/assets/reference.png" alt="Reference" /><p>reference</p></li>
+ <li><img src="/assets/requirement.png" alt="Requirement" /><p>requirement</p></li>
+ <li><img src="/assets/resource.png" alt="Resource" /><p>resource</p></li>
+ <li><img src="/assets/role.png" alt="Role" /><p>role</p></li>
+ <li><img src="/assets/task.png" alt="Task" /><p>task</p></li>
+ <li><img src="/assets/tool.png" alt="Tool" /><p>tool</p></li>
+ <li><img src="/assets/trajectory.png" alt="Trajectory" /><p>trajectory</p></li>
</ul>
</div>
</div>