got radial view working

app/assets/javascripts/metamaps/Metamaps.Backbone.js

@@ -1,7 +1,7 @@
 Metamaps.Backbone = {};
 Metamaps.Backbone.Map = Backbone.Model.extend({
     urlRoot: '/maps',
-    blacklist: ['created_at', 'updated_at', 'map', 'topics', 'synapses', 'mappings', 'mappers'],
+    blacklist: ['created_at', 'updated_at', 'topics', 'synapses', 'mappings', 'mappers'],
     toJSON: function (options) {
         return _.omit(this.attributes, this.blacklist);
     },
@@ -12,18 +12,45 @@ Metamaps.Backbone.Map = Backbone.Model.extend({
     getUser: function () {
         return Metamaps.Mapper.get(this.get('user_id'));
     },
+    fetchContained: function () {
+        var bb = Metamaps.Backbone;
+        var start = function (data) {
+            this.set('mappers', new bb.MapperCollection(data.mappers));
+            this.set('topics', new bb.TopicCollection(data.topics));
+            this.set('synapses', new bb.SynapseCollection(data.synapses));
+            this.set('mappings', new bb.MappingCollection(data.mappings));
+        }
+
+        $.ajax({
+            url: "/maps/" + this.id + "/contains",
+            success: start,
+            async: false
+        });
+    },
     getTopics: function () {
         if (!this.get('topics')) {
-            this.fetch({async: false});
+            this.fetchContained();
         }
         return this.get('topics');
     },
     getSynapses: function () {
         if (!this.get('synapses')) {
-            this.fetch({async: false});
+            this.fetchContained();
         }
         return this.get('synapses');
     },
+    getMappings: function () {
+        if (!this.get('mappings')) {
+            this.fetchContained();
+        }
+        return this.get('mappings');
+    },
+    getMappers: function () {
+        if (!this.get('mappers')) {
+            this.fetchContained();
+        }
+        return this.get('mappers');
+    },
     attrForCards: function () {
         var obj = {
             id: this.id,

app/assets/javascripts/metamaps/Metamaps.GlobalUI.js

@@ -544,8 +544,7 @@ Metamaps.GlobalUI.Search = {
             self.close(0, true);
             var win;
             if (dataset == "topics") {
-                win = window.open('/topics/' + datum.id, '_blank');
+                Metamaps.Router.topics(datum.id);
-                win.focus();
             } else if (dataset == "maps") {
                 Metamaps.Router.maps(datum.id);
             } else if (dataset == "mappers") {

app/assets/javascripts/metamaps/Metamaps.Router.js

@@ -56,6 +56,7 @@
 
             Metamaps.Famous.viz.hide();
             Metamaps.Active.Map = null;
+            Metamaps.Active.Topic = null;
 
             setTimeout(function(){
                 Metamaps.Router.navigate("");
@@ -93,6 +94,7 @@
 
             Metamaps.Famous.viz.hide();
             Metamaps.Active.Map = null;
+            Metamaps.Active.Topic = null;
 
             setTimeout(function(){
                 Metamaps.Router.navigate("/explore/" + section);
@@ -119,11 +121,40 @@
                 Metamaps.JIT.centerMap();
             }
             Metamaps.Famous.viz.show();
+            Metamaps.Active.Topic = null;
 
             Metamaps.GlobalUI.Search.unlock();
             Metamaps.GlobalUI.Search.close(0, true);
 
             Metamaps.Map.launch(id);
+        },
+        topics: function (id) {
+            
+            document.title = 'Topic ' + id + ' | Metamaps';
+            
+            Metamaps.currentSection = "topic";
+            Metamaps.currentPage = id;
+
+            $('.wrapper').removeClass('homePage explorePage');
+            $('.wrapper').addClass('mapPage');
+
+            Metamaps.Famous.yield.hide();
+            $('.mapsWrapper').fadeOut(300);
+            Metamaps.Famous.explore.hide();
+
+            // clear the visualization, if there was one, before showing its div again
+            if (Metamaps.Visualize.mGraph) {
+                Metamaps.Visualize.mGraph.graph.empty();
+                Metamaps.Visualize.mGraph.plot();
+                Metamaps.JIT.centerMap();
+            }
+            Metamaps.Famous.viz.show();
+            Metamaps.Active.Map = null;
+
+            Metamaps.GlobalUI.Search.unlock();
+            Metamaps.GlobalUI.Search.close(0, true);
+
+            Metamaps.Topic.launch(id);
         }
     });
     

app/assets/javascripts/metamaps/Metamaps.js

@@ -177,12 +177,7 @@ Metamaps.Backbone.init = function () {
 
     self.TopicCollection = Backbone.Collection.extend({
         model: self.Topic,
-        url: '/topics',
+        url: '/topics'
-        comparator: function (a, b) {
-            a = a.get('name').toLowerCase();
-            b = b.get('name').toLowerCase();
-            return a > b ? 1 : a < b ? -1 : 0;
-        }
     });
 
     self.Synapse = Backbone.Model.extend({
@@ -1189,7 +1184,7 @@ Metamaps.Visualize = {
     render: function () {
         var self = Metamaps.Visualize, RGraphSettings, FDSettings;
 
-        if (self.type == "RGraph" && !self.mGraph) {
+        if (self.type == "RGraph" && (!self.mGraph || self.mGraph instanceof $jit.ForceDirected)) {
 
             RGraphSettings = $.extend(true, {}, Metamaps.JIT.ForceDirected.graphSettings);
 
@@ -1197,13 +1192,13 @@ Metamaps.Visualize = {
             $jit.RGraph.Plot.EdgeTypes.implement(Metamaps.JIT.ForceDirected.edgeSettings);
             
             RGraphSettings.width = $(document).width();
-            RgraphSettings.height = $(document).height();
+            RGraphSettings.height = $(document).height();
             RGraphSettings.background = Metamaps.JIT.RGraph.background;
             RGraphSettings.levelDistance = Metamaps.JIT.RGraph.levelDistance;
             
             self.mGraph = new $jit.RGraph(RGraphSettings);
 
-        } else if (self.type == "ForceDirected" && !self.mGraph) {
+        } else if (self.type == "ForceDirected" && (!self.mGraph || self.mGraph instanceof $jit.RGraph)) {
 
             FDSettings = $.extend(true, {}, Metamaps.JIT.ForceDirected.graphSettings);
 
@@ -1228,11 +1223,18 @@ Metamaps.Visualize = {
         // load JSON data, if it's not empty
         if (!self.loadLater) {
             //load JSON data.
-            self.mGraph.loadJSON(Metamaps.JIT.vizData);
+            var rootIndex = 0;
+            if (Metamaps.Active.Topic) {
+                var node = _.find(Metamaps.JIT.vizData, function(node){
+                    return node.id === Metamaps.Active.Topic.id;
+                });
+                rootIndex = _.indexOf(Metamaps.JIT.vizData, node);
+            }
+            self.mGraph.loadJSON(Metamaps.JIT.vizData, rootIndex);
             //compute positions and plot.
             self.computePositions();
             if (self.type == "RGraph") {
-                self.mGraph.animate(Metamaps.JIT.RGraph.animate);
+                self.mGraph.fx.animate(Metamaps.JIT.RGraph.animate);
             } else if (self.type == "ForceDirected") {
                 self.mGraph.animate(Metamaps.JIT.ForceDirected.animateSavedLayout);
             } else if (self.type == "ForceDirected3D") {
@@ -1243,10 +1245,14 @@ Metamaps.Visualize = {
         // update the url now that the map is ready
         setTimeout(function(){
             var m = Metamaps.Active.Map;
+            var t = Metamaps.Active.Topic;
 
             if (m && window.location.pathname !== "/maps/" + m.id) {
                 Metamaps.Router.navigate("/maps/" + m.id);
             }
+            else if (t && window.location.pathname !== "/topics/" + t.id) {
+                Metamaps.Router.navigate("/topics/" + t.id);
+            }
         }, 800);
 
     }
@@ -2433,7 +2439,32 @@ Metamaps.Topic = {
             }
         }
     },
+    launch: function (id) {
+        var bb = Metamaps.Backbone;
+        var start = function (data) {
+            Metamaps.Active.Topic = new bb.Topic(data.topic);
+            Metamaps.Topics = new bb.TopicCollection([data.topic].concat(data.relatives));
+            Metamaps.Synapses = new bb.SynapseCollection(data.synapses);
 
+            // build and render the visualization
+            Metamaps.Visualize.type = "RGraph";
+            Metamaps.JIT.prepareVizData();
+
+            // update filters
+            Metamaps.Filter.reset(); 
+            Metamaps.Filter.initializeFilterData(); // this sets all the visible filters to true
+
+            // these three update the actual filter box with the right list items
+            Metamaps.Filter.checkMetacodes();
+            Metamaps.Filter.checkSynapses();
+            Metamaps.Filter.checkMappers();
+        }
+
+        $.ajax({
+            url: "/topics/" + id + "/network.json",
+            success: start
+        });
+    },
     /*
      *
      *
@@ -2747,6 +2778,7 @@ Metamaps.Map = {
             Metamaps.Mappings = new bb.MappingCollection(data.mappings);
 
             // build and render the visualization
+            Metamaps.Visualize.type = "ForceDirected";
             Metamaps.JIT.prepareVizData();
 
             // update filters
@@ -2760,7 +2792,7 @@ Metamaps.Map = {
         }
 
         $.ajax({
-            url: "/maps/" + id + ".json",
+            url: "/maps/" + id + "/contains.json",
             success: start
         });
     },

app/assets/stylesheets/clean.css

@@ -26,6 +26,10 @@
     display:none;
 }
 
+#toast {
+    display: none;
+}
+
 /*.animations {
    -webkit-transition-duration: .5s;
   -moz-transition-duration: .5s;

app/controllers/maps_controller.rb

@@ -76,6 +76,29 @@ class MapsController < ApplicationController
             redirect_to root_url and return
         end
 
+        respond_to do |format|
+            format.html { 
+                @allmappers = @map.contributors
+                @alltopics = @map.topics # should limit to topics visible to user
+                @allsynapses = @map.synapses # should also be limited
+                @allmappings = @map.mappings
+
+                respond_with(@allmappers, @allmappings, @allsynapses, @alltopics, @map) 
+            }
+            format.json { render json: @map }
+        end
+    end
+
+    # GET maps/:id/contains
+    def contains
+
+        @current = current_user
+        @map = Map.find(params[:id]).authorize_to_show(@current)
+
+        if not @map
+            redirect_to root_url and return
+        end
+
         @allmappers = @map.contributors
         @alltopics = @map.topics # should limit to topics visible to user
         @allsynapses = @map.synapses # should also be limited
@@ -89,11 +112,11 @@ class MapsController < ApplicationController
         @json['mappers'] = @allmappers
 
         respond_to do |format|
-            format.html { respond_with(@allmappers, @allmappings, @allsynapses, @alltopics, @map, @user) }
             format.json { render json: @json }
         end
     end
 
+
     # GET maps/:id/embed
     def embed
         @current = current_user

app/controllers/topics_controller.rb

@@ -32,13 +32,36 @@ class TopicsController < ApplicationController
             redirect_to root_url and return
         end
 
+        respond_to do |format|
+            format.html { 
                 @alltopics = [@topic] + @topic.relatives # should limit to topics visible to user
                 @allsynapses = @topic.synapses # should also be limited
-        @allmetacodes = Metacode.all
+
+                respond_with(@allsynapses, @alltopics, @topic) 
+            }
+            format.json { render json: @topic }
+        end
+    end
+
+    # GET topics/:id/network
+    def network
+        @current = current_user
+        @topic = Topic.find(params[:id]).authorize_to_show(@current)
+
+        if not @topic
+            redirect_to root_url and return
+        end
+
+        @alltopics = @topic.relatives # should limit to topics visible to user
+        @allsynapses = @topic.synapses # should also be limited
+
+        @json = Hash.new()
+        @json['topic'] = @topic
+        @json['relatives'] = @alltopics
+        @json['synapses'] = @allsynapses
 
         respond_to do |format|
-            format.html { respond_with(@allmetacodes, @allsynapses, @alltopics, @topic, @user) }
+            format.json { render json: @json }
-            format.json { render json: @topic }
         end
     end
 

app/views/layouts/application.html.erb

@@ -42,10 +42,7 @@
 <body>
 
     <% if notice %>
-    <p class="notice metamaps"><%= notice %></p>
+    <p id="toast"><%= notice %></p>
-    <% end %>
-    <% if alert %>
-    <p class="alert metamaps"><%= alert %></p>
     <% end %>
 
     <%= content_tag :div, class: authenticated? ? "main authenticated" : "main unauthenticated" do %>

app/views/main/_homemap.html.erb

@@ -1,32 +0,0 @@
-<%#
-  # @file
-  # Shows a map as a card.
-  # Any list of maps uses this rendering.
-  #%>
-<figure class="map <%= first ? "current" : "" %>">
-  <a href="/maps/<%= map.id %>">
-  <div>
-  
-	  <div class="mapCard"> 
-      <span class="title">                                                  
-        <%= map.name %>  
-      </span>
-      <div class="links">                                                   
-         <div class="linkItem contributor">
-             <%= pluralize(map.contributors.count, 'contributor') %>
-         </div>
-         <div class="linkItem mapPerm <%= map.mk_permission %>"><%= map.permission.capitalize %></div>
-         <div class="clearfloat"></div>                                     
-      </div> 
-      <div class="desc">                                                    
-        <%= map.desc %>                          
-      </div>
-      <div class="mapContains">      
-        <span class="topicCount"><%= pluralize(map.topics.count, 'topic') %></span>                 
-        <span class="synapseCount"><%= pluralize(map.synapses.count, 'synapse') %></span>
-      </div>     
-    </div>
-  
-  </div>
-  </a>
-</figure>

app/views/maps/show.html.erb

@@ -5,14 +5,13 @@
 #%>
 
 <% content_for :title, @map.name + " | Metamaps" %>
-
 <script>
 	Metamaps.currentSection = "map";
 	Metamaps.currentPage = <%= @map.id.to_s %>;
     Metamaps.Active.Map = <%= @map.to_json.html_safe %>;
     Metamaps.Mappers = <%= @allmappers.to_json.html_safe %>;
-    Metamaps.Metacodes = <%= @allmetacodes.to_json.html_safe %>;
     Metamaps.Topics = <%= @alltopics.to_json.html_safe %>;
     Metamaps.Synapses = <%= @allsynapses.to_json.html_safe %>;
     Metamaps.Mappings = <%= @allmappings.to_json.html_safe %>;
+    Metamaps.Visualize.type = "ForceDirected";
 </script>

app/views/topics/show.html.erb

@@ -15,48 +15,11 @@
 #%>
 
 <% content_for :title, @topic.name + " | Metamaps" %>  
-
-<% if authenticated? %>
-<div class="sidebarFork">
-    <div class="sidebarForkIcon">
-    </div>
-    <div class="sidebarForkBox"></div>
-</div>
-<% end %>
-<div class="sidebarFilter <%= authenticated? ? 'loggedin' : 'loggedout' %>">
-    <div class="sidebarFilterIcon"></div>
-    <div class="sidebarFilterBox">
-        <h3 class="filterByMetacode">Filter By Metacode</h3><span class="showAll">all</span><span class="hideAll">none</span>
-        <div class="clearfloat"></div>
-        <%= render :partial => 'shared/filterbymetacode' %>
-    </div>
-</div>
-
-<div class="index">
-    <div class="openCheatsheet openLightbox" data-open="cheatsheet"></div>
-    <span class="mapInfo"></span>
-    <div class="clearfloat"></div>
-</div>
-
-<div class="relatives" id="container">
-    <div id="center-container">
-        <div id="infovis"></div>    
-    </div>
-    <div class="showcard" id="showcard"></div>
-</div>
-<div class="clearfloat"></div>
-
-<% if authenticated? %>
-<%= render :partial => 'topics/new' %>
-<%= render :partial => 'synapses/new' %>
-<%= render :partial => 'shared/metacodeoptions' %>
-<% end %>
-
 <script>
+    Metamaps.currentSection = "topic";
+    Metamaps.currentPage = <%= @topic.id.to_s %>;
     Metamaps.Active.Topic = <%= @topic.to_json.html_safe %>;
-    Metamaps.Metacodes = <%= @allmetacodes.to_json.html_safe %>;
     Metamaps.Topics = <%= @alltopics.to_json.html_safe %>;
     Metamaps.Synapses = <%= @allsynapses.to_json.html_safe %>;
-    Metamaps.Mappings = null;
     Metamaps.Visualize.type = "RGraph";
 </script>

config/routes.rb

@@ -18,6 +18,7 @@ Metamaps::Application.routes.draw do
   resources :topics, except: [:index, :new, :edit] do
     get :autocomplete_topic, :on => :collection
   end
+  match 'topics/:id/network', to: 'topics#network', via: :get, as: :network
   
   match 'explore/active', to: 'maps#index', via: :get, as: :activemaps
   match 'explore/featured', to: 'maps#index', via: :get, as: :featuredmaps
@@ -27,6 +28,7 @@ Metamaps::Application.routes.draw do
   match 'maps/topics/:id', to: 'maps#index', via: :get, as: :topicmaps
   resources :maps, except: [:new, :edit]
   match 'maps/:id/embed', to: 'maps#embed', via: :get, as: :embed
+  match 'maps/:id/contains', to: 'maps#contains', via: :get, as: :contains
   
   devise_for :users, :controllers => { :registrations => "registrations" }, :path_names => { :sign_in => 'login', :sign_out => 'logout' }
   devise_scope :user do

public/famous/main.js

@@ -31,7 +31,7 @@ define(function(require, exports, module) {
             Metamaps.JIT.prepareVizData();
             f.viz.surf.removeListener('deploy',prepare);
     };
-    if (Metamaps.currentSection === "map") {
+    if (Metamaps.currentSection === "map" || Metamaps.currentSection === "topic") {
         f.viz.surf.on('deploy', prepare);
     }
     f.viz.mod = new Modifier({
@@ -71,6 +71,7 @@ define(function(require, exports, module) {
             f.yield.surf.removeListener('deploy',loadYield);
     };
     if (!(Metamaps.currentSection === "map" ||
+            Metamaps.currentSection === "topic" ||
             Metamaps.currentSection === "explore" ||
             (Metamaps.currentSection === "" && Metamaps.Active.Mapper) )) {
         f.yield.surf.on('deploy', loadYield);
@@ -169,6 +170,14 @@ define(function(require, exports, module) {
         content: '',
         classes: ['toast']
     });
+    initialToast = function () {
+        var message = document.getElementById('toast') ? document.getElementById('toast').innerHTML : false;
+        if (message) {
+            Metamaps.GlobalUI.notifyUser(message);
+            f.toast.surf.deploy(f.toast.surf._currTarget);
+        }
+    };
+    f.toast.surf.on('deploy', initialToast);
     f.toast.mod = new Modifier({
         origin: [0, 1],
         opacity: 0,