improved show more/less on wiki pages

publiclab · Feb 1, 2018 · 072f5ba · 072f5ba
1 parent 00cc80b
commit 072f5ba
Showing 1 changed file with 35 additions and 9 deletions.
diff --git a/app/views/grids/_notes.html.erb b/app/views/grids/_notes.html.erb
@@ -54,7 +54,7 @@
   </tr>
   <% if index == 9 %>
     <tr class="show-all">
-      <td><a>Show <%= nodes.length - 10 %> more <b class="caret"></b></a></td>
+      <td><a>Show <%= (nodes.length - 10) == 0 ? "" : (nodes.length - 10) %> more <b class="caret"></b></a></td>
       <td></td>
       <td></td>
       <td></td>
@@ -73,15 +73,37 @@
 <% end %>
 
 <script>
-(function(){
-  $(".<%= className %>-<%= randomSeed %> .show-all a").click(function() {
+  $(".<%= className %>-<%= randomSeed %> .show-all a").click(function(event) {
     $(".<%= className %>-<%= randomSeed %> tr.hide").toggleClass("hide");
-  });
-  $(".grid-embed-<%= randomSeed %>").click(function() {
-    prompt('Use this HTML code to embed this table on another site.', '<iframe style="border:none;" width="100%" height="900px" src="//publiclab.org/embed/grid/<% if type != "notes" %><%= type.gsub('questions', 'question').gsub('activities', 'activity') %>:<% end %><%= tagname %>"></iframe>')
-  });
-  setupGridSorters(".<%= className %>-<%= randomSeed %>");
-})()
+    console.log(event);
+    if(event.currentTarget.offsetParent.offsetParent.classList[2] == "questions-grid"){
+      // console.log("question was clicked");
+      if(event.currentTarget.firstElementChild.classList[1] !== "caret-up"){
+        $(".questions-grid .show-all a").html("Show less <b class=\"caret caret-up\"></b>");
+        $(".grid-embed-<%= randomSeed %>").click(function() {
+          prompt('Use this HTML code to embed this table on another site.', '<iframe style="border:none;" width="100%" height="900px" src="//publiclab.org/embed/grid/<% if type != "notes" %><%= type.gsub('questions', 'question').gsub('activities', 'activity') %>:<% end %><%= tagname %>"></iframe>')
+        });
+      }else{
+        $(".questions-grid .show-all a").html('Show <%= (nodes.length - 10) == 0 ? "" : (nodes.length - 10) %> more <b class="caret"></b>');
+        for(var i = 12; i < $(".questions-grid tr").length; i++){
+          $(".questions-grid tr")[i].className = "hide";
+        }
+      }  
+    }else if(event.currentTarget.offsetParent.offsetParent.classList[2] == "activity-grid"){
+      // console.log("activity was clicked");
+      if(event.currentTarget.firstElementChild.classList[1] !== "caret-up"){
+        $(".activity-grid .show-all a").html("Show less <b class=\"caret caret-up\"></b>");
+        $(".grid-embed-<%= randomSeed %>").click(function() {
+          prompt('Use this HTML code to embed this table on another site.', '<iframe style="border:none;" width="100%" height="900px" src="//publiclab.org/embed/grid/<% if type != "notes" %><%= type.gsub('questions', 'question').gsub('activities', 'activity') %>:<% end %><%= tagname %>"></iframe>')
+        });
+      }else{
+        $(".activity-grid .show-all a").html('Show <%= (nodes.length - 10) == 0 ? "" : (nodes.length - 10) %> more <b class="caret"></b>');
+        for(var i = 12; i < $(".activity-grid tr").length; i++){
+          $(".activity-grid tr")[i].className = "hide";
+        }
+      }    
+    }
+});
 </script>
 <style>
   a.grid-embed {
@@ -91,4 +113,8 @@
   a.grid-embed:hover {
     color: #888;
   }
+  .caret.caret-up{
+    border-top-width: 0;
+    border-bottom: 4px solid;
+  }
 </style>