From bbc50d1305bbd666fecf12e7636e184d007bcc57 Mon Sep 17 00:00:00 2001 From: Connor Turland Date: Mon, 11 Aug 2014 18:57:34 -0400 Subject: [PATCH] got radial view working --- .../javascripts/metamaps/Metamaps.Backbone.js | 33 ++++++++++- .../javascripts/metamaps/Metamaps.GlobalUI.js | 3 +- .../javascripts/metamaps/Metamaps.Router.js | 31 ++++++++++ app/assets/javascripts/metamaps/Metamaps.js | 56 +++++++++++++++---- app/assets/stylesheets/clean.css | 4 ++ app/controllers/maps_controller.rb | 25 ++++++++- app/controllers/topics_controller.rb | 31 ++++++++-- app/views/layouts/application.html.erb | 5 +- app/views/main/_homemap.html.erb | 32 ----------- app/views/maps/show.html.erb | 3 +- app/views/topics/show.html.erb | 41 +------------- config/routes.rb | 2 + public/famous/main.js | 11 +++- 13 files changed, 177 insertions(+), 100 deletions(-) delete mode 100644 app/views/main/_homemap.html.erb diff --git a/app/assets/javascripts/metamaps/Metamaps.Backbone.js b/app/assets/javascripts/metamaps/Metamaps.Backbone.js index c85f08c2..d73623de 100644 --- a/app/assets/javascripts/metamaps/Metamaps.Backbone.js +++ b/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, diff --git a/app/assets/javascripts/metamaps/Metamaps.GlobalUI.js b/app/assets/javascripts/metamaps/Metamaps.GlobalUI.js index 0fe15bed..61dbd435 100644 --- a/app/assets/javascripts/metamaps/Metamaps.GlobalUI.js +++ b/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'); - win.focus(); + Metamaps.Router.topics(datum.id); } else if (dataset == "maps") { Metamaps.Router.maps(datum.id); } else if (dataset == "mappers") { diff --git a/app/assets/javascripts/metamaps/Metamaps.Router.js b/app/assets/javascripts/metamaps/Metamaps.Router.js index d40666c1..43c2482b 100644 --- a/app/assets/javascripts/metamaps/Metamaps.Router.js +++ b/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); } }); diff --git a/app/assets/javascripts/metamaps/Metamaps.js b/app/assets/javascripts/metamaps/Metamaps.js index e8a4efc7..3471b1da 100644 --- a/app/assets/javascripts/metamaps/Metamaps.js +++ b/app/assets/javascripts/metamaps/Metamaps.js @@ -177,12 +177,7 @@ Metamaps.Backbone.init = function () { self.TopicCollection = Backbone.Collection.extend({ model: self.Topic, - url: '/topics', - comparator: function (a, b) { - a = a.get('name').toLowerCase(); - b = b.get('name').toLowerCase(); - return a > b ? 1 : a < b ? -1 : 0; - } + url: '/topics' }); 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 }); }, diff --git a/app/assets/stylesheets/clean.css b/app/assets/stylesheets/clean.css index ea67b21b..e1ac6446 100644 --- a/app/assets/stylesheets/clean.css +++ b/app/assets/stylesheets/clean.css @@ -26,6 +26,10 @@ display:none; } +#toast { + display: none; +} + /*.animations { -webkit-transition-duration: .5s; -moz-transition-duration: .5s; diff --git a/app/controllers/maps_controller.rb b/app/controllers/maps_controller.rb index b8ab6f79..933f29e1 100644 --- a/app/controllers/maps_controller.rb +++ b/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 diff --git a/app/controllers/topics_controller.rb b/app/controllers/topics_controller.rb index dc7ee02d..c1672290 100644 --- a/app/controllers/topics_controller.rb +++ b/app/controllers/topics_controller.rb @@ -32,13 +32,36 @@ class TopicsController < ApplicationController redirect_to root_url and return end - @alltopics = [@topic] + @topic.relatives # should limit to topics visible to user + respond_to do |format| + format.html { + @alltopics = [@topic] + @topic.relatives # should limit to topics visible to user + @allsynapses = @topic.synapses # should also be limited + + 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 - @allmetacodes = Metacode.all + + @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: @topic } + format.json { render json: @json } end end diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index 37d9284d..ef50717c 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -42,10 +42,7 @@ <% if notice %> -

<%= notice %>

- <% end %> - <% if alert %> -

<%= alert %>

+

<%= notice %>

<% end %> <%= content_tag :div, class: authenticated? ? "main authenticated" : "main unauthenticated" do %> diff --git a/app/views/main/_homemap.html.erb b/app/views/main/_homemap.html.erb deleted file mode 100644 index 554783b6..00000000 --- a/app/views/main/_homemap.html.erb +++ /dev/null @@ -1,32 +0,0 @@ -<%# - # @file - # Shows a map as a card. - # Any list of maps uses this rendering. - #%> -
"> - -
- -
- - <%= map.name %> - - -
- <%= map.desc %> -
-
- <%= pluralize(map.topics.count, 'topic') %> - <%= pluralize(map.synapses.count, 'synapse') %> -
-
- -
-
-
diff --git a/app/views/maps/show.html.erb b/app/views/maps/show.html.erb index 8379f429..0c5e4f97 100644 --- a/app/views/maps/show.html.erb +++ b/app/views/maps/show.html.erb @@ -5,14 +5,13 @@ #%> <% content_for :title, @map.name + " | Metamaps" %> - diff --git a/app/views/topics/show.html.erb b/app/views/topics/show.html.erb index 1aba87c0..efe18fcf 100644 --- a/app/views/topics/show.html.erb +++ b/app/views/topics/show.html.erb @@ -15,48 +15,11 @@ #%> <% content_for :title, @topic.name + " | Metamaps" %> - -<% if authenticated? %> -
-
-
-
-
-<% end %> -
-
-
-

Filter By Metacode

allnone -
- <%= render :partial => 'shared/filterbymetacode' %> -
-
- -
-
- -
-
- -
-
-
-
-
-
-
- -<% if authenticated? %> -<%= render :partial => 'topics/new' %> -<%= render :partial => 'synapses/new' %> -<%= render :partial => 'shared/metacodeoptions' %> -<% end %> - \ No newline at end of file diff --git a/config/routes.rb b/config/routes.rb index 930e3a5e..9fba7ba7 100644 --- a/config/routes.rb +++ b/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 diff --git a/public/famous/main.js b/public/famous/main.js index 05f5e160..3a8c0f91 100644 --- a/public/famous/main.js +++ b/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,