added tooltip for maps that topic appears in

app/assets/javascripts/src/Metamaps.js

@@ -1089,6 +1089,31 @@ Metamaps.TopicCard = {
             $('.showcard .yourTopic .mapPerm').click(openPermissionSelect);
             $('.showcard').click(hidePermissionSelect);
         }
+
+        $('.links .mapCount').unbind().click(function(event){
+            $('.mapCount .tip').toggle();
+            event.stopPropagation();
+        });
+        $('.mapCount .tip').unbind().click(function(event){
+            event.stopPropagation();
+        });
+        $('.showCard').unbind('.hideTip').bind('click.hideTip', function(){
+            $('.mapCount .tip').hide();
+        });
+        var originalText = $('.showMore').html();
+        $('.mapCount .tip .showMore').unbind().toggle(
+            function(event){
+                $('.extraText').toggleClass("hideExtra");
+                $('.showMore').html('Show less...');
+            },
+            function(event){
+                $('.extraText').toggleClass("hideExtra");
+                $('.showMore').html(originalText);
+            });
+
+        $('.mapCount .tip showMore').unbind().click(function(event){
+            event.stopPropagation();
+        });
     },
     handleInvalidLink: function() {
         var self = Metamaps.TopicCard;
@@ -1162,6 +1187,24 @@ Metamaps.TopicCard = {
             nodeValues.attachments = '';
         }
 
+        console.log(topic.get("inmaps"));
+        var inmapsAr = topic.get("inmaps");
+        nodeValues.inmaps ='';
+        if (inmapsAr.length < 6) {
+            for (i = 0; i < inmapsAr.length; i++) {
+                nodeValues.inmaps += '<li>' + inmapsAr[i] + '</li>';
+            }
+        }
+        else {
+            for (i = 0; i < 5; i++){
+                nodeValues.inmaps += '<li>' + inmapsAr[i] + '</li>';
+            }
+            extra = inmapsAr.length - 5;
+            nodeValues.inmaps += '<li><span class="showMore">See ' + extra + ' more...</span></li>'
+            for (i = 5; i < inmapsAr.length; i++){
+                nodeValues.inmaps += '<li class="hideExtra extraText">' + inmapsAr[i] + '</li>';
+            }
+        }
         nodeValues.permission = topic.get("permission");
         nodeValues.mk_permission = topic.get("permission").substring(0, 2);
         nodeValues.map_count = topic.get("map_count").toString();

app/assets/stylesheets/base.css

@@ -251,6 +251,49 @@
 .linkItem.mapCount:hover .mapCountIcon {
   background-position: 0 -32px;
 }
+
+.CardOnGraph .mapCount .tip {
+  top: 44px;
+  left: 0px;
+  font-size: 12px !important;
+}
+
+.CardOnGraph .mapCount .tip:before {
+  content: '';
+  position: absolute;
+  top: 26px;
+  left: 10px;
+  margin-top: -30px;
+  width: 0;
+  height: 0;
+  border-bottom: 4px solid #000000;
+  border-left: 5px solid transparent;
+  border-right: 5px solid transparent;
+}
+
+.CardOnGraph .mapCount .tip li {
+  list-style-type: none;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  padding: 6px 10px;
+  display: block;
+  height: 14px;
+  font-family: 'din-regular', helvetica, sans-serif;
+  font-size: 14px;
+  line-height: 14px;
+  position: relative;
+}
+
+.CardOnGraph .mapCount li.hideExtra {
+  display: none;
+}
+
+.showMore {
+  cursor: pointer;
+}
+
+
 .linkItem.synapseCount {
   margin-left: 2px;
   width: 24px;

app/helpers/topics_helper.rb

@@ -17,7 +17,8 @@ module TopicsHelper
       topic['originator'] = t.user.name
       topic['originatorImage'] = t.user.image.url(:square)
       topic['rtype'] = "topic"
-      
+      topic['inmaps'] = t.inmaps
+       
       temp.push topic
     end
     return temp

app/models/topic.rb

@@ -54,8 +54,12 @@ class Topic < ActiveRecord::Base
     self.synapses.count
   end
 
+  def inmaps
+    self.maps.map(&:name)
+  end
+
   def as_json(options={})
-    super(:methods =>[:user_name, :user_image, :map_count, :synapse_count])
+    super(:methods =>[:user_name, :user_image, :map_count, :synapse_count, :inmaps])
   end
 
   def topic_autocomplete_method

app/views/layouts/_templates.html.erb

@@ -215,10 +215,12 @@
                 <img src="/assets/user.png" class="contributorIcon" width="32" height="32" />
                 <div class="contributorName">{{username}}</div>
             </div>
-            <a href="/explore/topics/{{id}}" class="linkItem mapCount" title="Click to see which maps topic appears on">                  
-                 <div class="mapCountIcon"></div>
-                 {{map_count}}                                                 
-               </a> 
+            <div class="linkItem mapCount" title="Click to see which maps topic appears on">                  
+                <div class="mapCountIcon"></div>
+                {{map_count}} 
+                <div class="tip"><ul>{{{inmaps}}}</ul></div>                              
+            </div>
+
             <a href="/topics/{{id}}" class="linkItem synapseCount" title="Click to see this topics synapses">
               <div class="synapseCountIcon"></div>
               {{synapse_count}}