diff --git a/app/assets/images/shattered_@2X.png b/app/assets/images/shattered_@2X.png
new file mode 100644
index 00000000..19322777
Binary files /dev/null and b/app/assets/images/shattered_@2X.png differ
diff --git a/vendor/assets/images/ui-bg_flat_0_aaaaaa_40x100.png b/app/assets/images/ui-bg_flat_0_aaaaaa_40x100.png
similarity index 100%
rename from vendor/assets/images/ui-bg_flat_0_aaaaaa_40x100.png
rename to app/assets/images/ui-bg_flat_0_aaaaaa_40x100.png
diff --git a/vendor/assets/images/ui-bg_flat_75_ffffff_40x100.png b/app/assets/images/ui-bg_flat_75_ffffff_40x100.png
similarity index 100%
rename from vendor/assets/images/ui-bg_flat_75_ffffff_40x100.png
rename to app/assets/images/ui-bg_flat_75_ffffff_40x100.png
diff --git a/vendor/assets/images/ui-bg_glass_55_fbf9ee_1x400.png b/app/assets/images/ui-bg_glass_55_fbf9ee_1x400.png
similarity index 100%
rename from vendor/assets/images/ui-bg_glass_55_fbf9ee_1x400.png
rename to app/assets/images/ui-bg_glass_55_fbf9ee_1x400.png
diff --git a/vendor/assets/images/ui-bg_glass_65_ffffff_1x400.png b/app/assets/images/ui-bg_glass_65_ffffff_1x400.png
similarity index 100%
rename from vendor/assets/images/ui-bg_glass_65_ffffff_1x400.png
rename to app/assets/images/ui-bg_glass_65_ffffff_1x400.png
diff --git a/vendor/assets/images/ui-bg_glass_75_dadada_1x400.png b/app/assets/images/ui-bg_glass_75_dadada_1x400.png
similarity index 100%
rename from vendor/assets/images/ui-bg_glass_75_dadada_1x400.png
rename to app/assets/images/ui-bg_glass_75_dadada_1x400.png
diff --git a/vendor/assets/images/ui-bg_glass_75_e6e6e6_1x400.png b/app/assets/images/ui-bg_glass_75_e6e6e6_1x400.png
similarity index 100%
rename from vendor/assets/images/ui-bg_glass_75_e6e6e6_1x400.png
rename to app/assets/images/ui-bg_glass_75_e6e6e6_1x400.png
diff --git a/vendor/assets/images/ui-bg_glass_95_fef1ec_1x400.png b/app/assets/images/ui-bg_glass_95_fef1ec_1x400.png
similarity index 100%
rename from vendor/assets/images/ui-bg_glass_95_fef1ec_1x400.png
rename to app/assets/images/ui-bg_glass_95_fef1ec_1x400.png
diff --git a/vendor/assets/images/ui-bg_highlight-soft_75_cccccc_1x100.png b/app/assets/images/ui-bg_highlight-soft_75_cccccc_1x100.png
similarity index 100%
rename from vendor/assets/images/ui-bg_highlight-soft_75_cccccc_1x100.png
rename to app/assets/images/ui-bg_highlight-soft_75_cccccc_1x100.png
diff --git a/vendor/assets/images/ui-icons_222222_256x240.png b/app/assets/images/ui-icons_222222_256x240.png
similarity index 100%
rename from vendor/assets/images/ui-icons_222222_256x240.png
rename to app/assets/images/ui-icons_222222_256x240.png
diff --git a/vendor/assets/images/ui-icons_2e83ff_256x240.png b/app/assets/images/ui-icons_2e83ff_256x240.png
similarity index 100%
rename from vendor/assets/images/ui-icons_2e83ff_256x240.png
rename to app/assets/images/ui-icons_2e83ff_256x240.png
diff --git a/vendor/assets/images/ui-icons_454545_256x240.png b/app/assets/images/ui-icons_454545_256x240.png
similarity index 100%
rename from vendor/assets/images/ui-icons_454545_256x240.png
rename to app/assets/images/ui-icons_454545_256x240.png
diff --git a/vendor/assets/images/ui-icons_888888_256x240.png b/app/assets/images/ui-icons_888888_256x240.png
similarity index 100%
rename from vendor/assets/images/ui-icons_888888_256x240.png
rename to app/assets/images/ui-icons_888888_256x240.png
diff --git a/vendor/assets/images/ui-icons_cd0a0a_256x240.png b/app/assets/images/ui-icons_cd0a0a_256x240.png
similarity index 100%
rename from vendor/assets/images/ui-icons_cd0a0a_256x240.png
rename to app/assets/images/ui-icons_cd0a0a_256x240.png
diff --git a/app/assets/javascripts/metamaps/Metamaps.Backbone.js b/app/assets/javascripts/metamaps/Metamaps.Backbone.js
index 6b858bda..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,25 +12,52 @@ 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,
             name: this.get('name'),
             desc: this.get('desc'),
             username: this.getUser().get('name'),
-            mkPermission: this.get("permission").substring(0, 2),
+            mkPermission: this.get("permission") ? this.get("permission").substring(0, 2) : "commons",
             editPermission: this.authorizeToEdit(Metamaps.Active.Mapper) ? 'canEdit' : 'cannotEdit',
             topicCount: this.getTopics().length,
             synapseCount: this.getSynapses().length,
@@ -52,8 +79,8 @@ Metamaps.Backbone.MapsCollection = Backbone.Collection.extend({
         a = a.get(this.sortBy);
         b = b.get(this.sortBy);
         if (this.sortBy === 'name') {
-            a = a.toLowerCase();
-            b = b.toLowerCase();
+            a = a ? a.toLowerCase() : "";
+            b = b ? b.toLowerCase() : "";
         }
         return a > b ? 1 : a < b ? -1 : 0;
     },
diff --git a/app/assets/javascripts/metamaps/Metamaps.GlobalUI.js b/app/assets/javascripts/metamaps/Metamaps.GlobalUI.js
index c7551761..4ecec60b 100644
--- a/app/assets/javascripts/metamaps/Metamaps.GlobalUI.js
+++ b/app/assets/javascripts/metamaps/Metamaps.GlobalUI.js
@@ -555,13 +555,13 @@ Metamaps.GlobalUI.Search = {
             self.close(0, true);
             var win;
             if (dataset == "topics") {
-                win = window.open('/topics/' + datum.id, '_blank');
+                Metamaps.Router.topics(datum.id);
             } else if (dataset == "maps") {
-                win = window.open('/maps/' + datum.id, '_blank');
+                Metamaps.Router.maps(datum.id);
             } else if (dataset == "mappers") {
                 win = window.open('/maps/mappers/' + datum.id, '_blank');
+                win.focus();
             }
-            win.focus();
         }
     },
     initSearchOptions: function () {
diff --git a/app/assets/javascripts/metamaps/Metamaps.Router.js b/app/assets/javascripts/metamaps/Metamaps.Router.js
index 30cbe567..43c2482b 100644
--- a/app/assets/javascripts/metamaps/Metamaps.Router.js
+++ b/app/assets/javascripts/metamaps/Metamaps.Router.js
@@ -22,10 +22,12 @@
 
             // all this only for the logged in home page
             if (Metamaps.Active.Mapper) {
+                
+                Metamaps.Famous.yield.hide();
+                
                 Metamaps.Famous.explore.set('mine');
                 Metamaps.Famous.explore.show();
 
-                $('.yield').fadeOut(300);
                 $('.mapsWrapper').fadeIn(300);
 
                 Metamaps.GlobalUI.Search.open();
@@ -41,17 +43,20 @@
             }
             // logged out home page
             else {
+                
+                Metamaps.Famous.yield.show();
+                
                 Metamaps.Famous.explore.hide();
 
                 Metamaps.GlobalUI.Search.unlock();
                 Metamaps.GlobalUI.Search.close(0, true);
 
-                $('.yield').fadeIn(300);
                 $('.mapsWrapper').fadeOut(300);
             }
 
             Metamaps.Famous.viz.hide();
             Metamaps.Active.Map = null;
+            Metamaps.Active.Topic = null;
 
             setTimeout(function(){
                 Metamaps.Router.navigate("");
@@ -79,8 +84,9 @@
 
             Metamaps.GlobalUI.Search.open();
             Metamaps.GlobalUI.Search.lock();
-
-            $('.yield').fadeOut(300);
+            
+            Metamaps.Famous.yield.hide();
+            
             $('.mapsWrapper').fadeIn(300);
 
             Metamaps.Famous.explore.set(section);
@@ -88,6 +94,7 @@
 
             Metamaps.Famous.viz.hide();
             Metamaps.Active.Map = null;
+            Metamaps.Active.Topic = null;
 
             setTimeout(function(){
                 Metamaps.Router.navigate("/explore/" + section);
@@ -103,9 +110,8 @@
             $('.wrapper').removeClass('homePage explorePage');
             $('.wrapper').addClass('mapPage');
 
-            $('.yield').fadeOut(300);
+            Metamaps.Famous.yield.hide();
             $('.mapsWrapper').fadeOut(300);
-
             Metamaps.Famous.explore.hide();
 
             // clear the visualization, if there was one, before showing its div again
@@ -115,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.Views.js b/app/assets/javascripts/metamaps/Metamaps.Views.js
index 91588f33..fc4da130 100644
--- a/app/assets/javascripts/metamaps/Metamaps.Views.js
+++ b/app/assets/javascripts/metamaps/Metamaps.Views.js
@@ -46,6 +46,9 @@ Metamaps.Views.init = function () {
             this.listenTo(this.collection, 'errorOnFetch', this.handleError);
         },
         render: function () {
+            
+            Metamaps.Loading.loader.hide();
+            
             var that = this;
             this.$el.empty();
 
@@ -56,7 +59,6 @@ Metamaps.Views.init = function () {
             });
         },
         handleSuccess: function () {
-            Metamaps.Loading.loader.hide();
             this.render();
         },
         handleError: function () {
diff --git a/app/assets/javascripts/metamaps/Metamaps.js b/app/assets/javascripts/metamaps/Metamaps.js
index 6b608034..9e1700b3 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({
@@ -1196,7 +1191,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);
 
@@ -1204,13 +1199,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);
 
@@ -1235,11 +1230,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") {
@@ -1250,10 +1252,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);
 
     }
@@ -1272,7 +1278,7 @@ Metamaps.Util = {
     // you may copy this code but please keep the copyright notice as well
     splitLine: function (st, n) {
         var b = '';
-        var s = st;
+        var s = st ? st : '';
         while (s.length > n) {
             var c = s.substring(0, n);
             var d = c.lastIndexOf(' ');
@@ -1339,7 +1345,7 @@ Metamaps.Realtime = {
         var mapperm = Metamaps.Active.Map && Metamaps.Active.Map.authorizeToEdit(Metamaps.Active.Mapper);
 
         if (mapperm) {
-            self.socket = io.connect('http://localhost:5001');
+            self.socket = io.connect('http://localhost:5001'); 
             self.socket.on('connect', function () {
                 console.log('socket connected');
                 self.setupSocket();
@@ -1996,6 +2002,36 @@ Metamaps.Filter = {
             }
         }, time);
     },
+    reset: function () {
+        var self = Metamaps.Filter;
+
+        self.filters.metacodes = [];
+        self.filters.mappers = [];
+        self.filters.synapses = [];
+        self.visible.metacodes = [];
+        self.visible.mappers = [];
+        self.visible.synapses = [];
+
+        $('#filter_by_metacode ul').empty(); 
+        $('#filter_by_mapper ul').empty();
+        $('#filter_by_synapse ul').empty();
+    },
+    initializeFilterData: function () {
+        var self = Metamaps.Filter;
+
+        var check = function (filtersToUse, topicsOrSynapses, propertyToCheck) {
+            Metamaps[topicsOrSynapses].each(function(model) {
+                var prop = model.get(propertyToCheck) ? model.get(propertyToCheck).toString() : false;
+                if (prop && self.visible[filtersToUse].indexOf(prop) === -1) {
+                    self.visible[filtersToUse].push(prop);
+                }
+            });
+        };
+        check('metacodes', 'Topics', 'metacode_id');
+        check('mappers', 'Topics', 'user_id');
+        check('mappers', 'Synapses', 'user_id');
+        check('synapses', 'Synapses', 'desc');
+    },
     /*  
     Most of this data essentially depends on the ruby function which are happening for filter inside view filterBox
     But what these function do is load this data into three accessible array within java : metacodes, mappers and synapses
@@ -2410,7 +2446,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
+        });
+    },
     /*
      *
      *
@@ -2724,16 +2785,21 @@ Metamaps.Map = {
             Metamaps.Mappings = new bb.MappingCollection(data.mappings);
 
             // build and render the visualization
+            Metamaps.Visualize.type = "ForceDirected";
             Metamaps.JIT.prepareVizData();
 
             // update filters
-            Metamaps.Filter.checkMappers();
+            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: "/maps/" + id + ".json",
+            url: "/maps/" + id + "/contains.json",
             success: start
         });
     },
diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index 649f2e2c..148c20c2 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -9,7 +9,6 @@
  * compiled file, but it's generally better to create a new file per style scope.
  *
  *= require_self
- *= require_tree ../../../vendor/assets/stylesheets
  *= require_tree .
  *= require base
  *= require ForceDirected
@@ -84,7 +83,7 @@ html {
 
 } 
 body {
-    background: #d8d9da;
+    background: #d8d9da url(/assets/shattered_@2X.png);
     font-family: 'din-medium', helvetica, sans-serif;
     color: #424242;
 }
diff --git a/app/assets/stylesheets/clean.css b/app/assets/stylesheets/clean.css
index bb137d21..d8bd7550 100644
--- a/app/assets/stylesheets/clean.css
+++ b/app/assets/stylesheets/clean.css
@@ -22,10 +22,14 @@
   margin:0;
 }
 
-.yield {
+#yield {
     display:none;
 }
 
+#toast {
+    display: none;
+}
+
 /*.animations {
    -webkit-transition-duration: .5s;
   -moz-transition-duration: .5s;
@@ -488,6 +492,65 @@
 
 /* end upperRightUI */
 
+
+/* homepage */
+
+.homeWrapper {
+    width: 560px;
+    margin: 0 auto;
+    color: #424242;
+}
+
+.homeTitle {
+    font-size: 48px;
+    line-height: 48px;
+    text-align: center;
+    margin-bottom: 20px;
+}
+
+.homeIntro {
+    font-size: 23px;
+    line-height: 26px;
+    text-align: justify;
+    margin-bottom: 20px;
+}
+
+.homeWrapper .green {
+    color: #4fc059;
+}
+
+.homeVideo {
+    margin-bottom: 20px;
+}
+
+.callToAction a {
+    display: block;
+    width: 220px;
+    height: 12px;
+    padding: 16px 0;
+    text-align: center;
+    border-radius: 2px;
+    font-size: 12px;
+    box-shadow: 0px 1px 1.5px rgba(0,0,0,0.12), 0 1px 1px rgba(0,0,0,0.24);
+    margin: 0 auto;
+    color: #FFFFFF;
+}
+.callToAction .requestInviteCTA {
+    background-color: #4fc059;
+    margin-bottom: 15px;
+}
+.callToAction .requestInviteCTA:hover {
+    background-color: #49ad4e;
+}
+.callToAction .exploreFeaturedCTA {
+    background-color: #a354cd;
+}
+.callToAction .exploreFeaturedCTA:hover {
+    background-color: #9150bc;
+}
+
+/* end home page */
+
 /* infoAndHelp */
 
 .infoAndHelp {
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 7099fce3..ef50717c 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -34,7 +34,7 @@
 
         <!-- app code -->
         <script type="text/javascript">
-            require.config({baseUrl: '/assets/src/'});
+            require.config({baseUrl: '/famous/'});
             require(['main']);
         </script>
 </head>
@@ -42,10 +42,7 @@
 <body>
 
     <% if notice %>
-    <p class="notice metamaps"><%= notice %></p>
-    <% end %>
-    <% if alert %>
-    <p class="alert metamaps"><%= alert %></p>
+    <p id="toast"><%= notice %></p>
     <% end %>
 
     <%= content_tag :div, class: authenticated? ? "main authenticated" : "main unauthenticated" do %>
@@ -61,7 +58,7 @@
             <%= render :partial => 'layouts/upperelements' %>
             <%= render :partial => 'layouts/exploremaps' %>
 
-            <div class="yield"><%= yield %></div>
+            <%= yield %>
 
             <!--<div class="mapElement" id="infovis"></div> <!-- where map visualizations get rendered -->
             <div class="showcard mapElement mapElementHidden" id="showcard"></div> <!-- the topic card -->
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.
-  #%>
-<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>
diff --git a/app/views/main/home.html.erb b/app/views/main/home.html.erb
index 95b0a7d2..993edbc2 100644
--- a/app/views/main/home.html.erb
+++ b/app/views/main/home.html.erb
@@ -5,100 +5,31 @@
   #%>  
   
 <% if !authenticated? %>
-
-<% content_for :title, "Home | Metamaps" %> 
-
-<div id="preloaded-images">
-   <img src="/assets/metacodes75ms300x300.gif" width="128 height="128" alt="Image 01" />
-</div>  
-  
-<div class="home_bg">
-
-<div class="home_content">
-<div class="home_desc">
-  <div class="welcomeTo">
-      Welcome to Metamaps
-  </div>
-  <img id="homeMapImage" src="/assets/metamap128x128.png" width="128" height="128" />
-  
-    <div class="metamapsIs">
-      a home on the web for <span class="swapWord">
-        <ul class="texts">
-        <li>building shared knowledge</li>
-        <li>learning</li>
-        <li>visioning</li>
-        <li>conversing</li>
-        <li>collaborating</li>
-        <li>sensemaking</li>
-        <li>innovating</li>
-        <li>designing</li>
-        <li>playing</li>
-        <li>exploring</li>
-        </ul>
-      </span>
-    </div>
-</div>
-<div class="clearfloat"></div>
-
-<p class="contact">
-    <a href="/request" class="request button" data-bypass="true">Request Invite</a>
-    <a href="/explore/featured" class="learnmore button">Explore Featured</a>
-  <div class="featuredMaps">
-      explore featured maps from our community
-  </div>
-</p>
-
-<div class="centeredProfile">
-  <div id="homeMap">
-    <figure id="homeFigure">
-    <% @maps.each_with_index do |map, index| %>
-      <% first = index == 0 ? true : false %>
-      <%= render :partial => 'main/homemap', :locals => { :map => map, :first => first } %>
-    <% end %>
-    </figure>
-  </div>
-</div>
-</div>
-<div class="clearfloat"></div>
-</div>
-                         
-<script>
-
-  Metamaps.currentSection = "";
-  Metamaps.currentPage = "";
-
-$(document).ready(function() {
-  // flip through these words on the homepage
-  $('.swapWord').textillate({ 
-       in: { effect: 'fadeIn', delay: 20 },
-       out: { effect: 'fadeOut', sync: true }, 
-       loop: true,
-       minDisplayTime: 2000
-  });
-  
-  $('#homeMapImage').hover(function() {
-    $(this).attr('src','/assets/metacodes75ms300x300.gif');
-  }, function() {
-    $(this).attr('src','/assets/metamap128x128.png');
-  });
-                         
-  $('#homeMap .desc').each(function() {
-    $(this).height($(this).height()).mCustomScrollbar({
-      mouseWheelPixels: 200
-    });
-  });
-
-});
-</script>
-
+    <% content_for :title, "Home | Metamaps" %> 
+    <div id="yield">
+        <div class="homeWrapper">
+            <div class="homeTitle">EXPERIENCE METAMAPS</div>
+            <div class="homeIntro">
+            <span class="green">metamaps.cc</span> is a free and open source platform. It enables individuals, communities, and organizations to build and visualize their shared knowledge and unlock their collective intelligence...
+            </div>
+            <iframe class="homeVideo" src="//player.vimeo.com/video/100118167" width="560" height="315" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
+            <div class="callToAction">
+                <a href="/request" class="requestInviteCTA" data-bypass="true">REQUEST INVITE</a>
+                <a href="/explore/featured" class="exploreFeaturedCTA">EXPLORE FEATURED MAPS</a>
+            </div>
+        </div>
+    </div><!-- end yield -->                        
+    <script>
+    Metamaps.currentSection = "";
+    Metamaps.currentPage = "";
+    </script>
 <% elsif authenticated? %>
-  <% content_for :title, "My Maps | Metamaps" %> 
-
-  <script>
+    <% content_for :title, "My Maps | Metamaps" %> 
+    <script>
     Metamaps.Maps.Mine = <%= @maps.to_json.html_safe %>;
     Metamaps.currentSection = "";
     Metamaps.currentPage = "";
     Metamaps.GlobalUI.Search.isOpen = true;
     Metamaps.GlobalUI.Search.lock();
-  </script>
+    </script>
 <% end %>
\ No newline at end of file
diff --git a/app/views/main/requestinvite.html.erb b/app/views/main/requestinvite.html.erb
index b7f0841a..4f0f2b18 100644
--- a/app/views/main/requestinvite.html.erb
+++ b/app/views/main/requestinvite.html.erb
@@ -6,11 +6,12 @@
 
 <% content_for :title, "Request Invite | Metamaps" %>   
   
+<div id="yield">
 <iframe class="requestInvite" src="https://docs.google.com/forms/d/1lWoKPFHErsDfV5l7-SvcHxwX3vDi9nNNVW0rFMgJwgg/viewform?embedded=true" width="700" frameborder="0" marginheight="0" marginwidth="0">Loading...</iframe>
+</div>
 
 <script>
 $(document).ready(function() {
   $('.requestInvite').height( (parseInt($('body').height()) - 40) ); 
 });
-
 </script>
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" %>
-
 <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>
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? %>
-<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>
\ No newline at end of file
diff --git a/config/application.rb b/config/application.rb
index c87ef5b7..d9f5f0f1 100644
--- a/config/application.rb
+++ b/config/application.rb
@@ -53,7 +53,7 @@ module Metamaps
     # Enable the asset pipeline
     config.assets.enabled = true
     config.assets.initialize_on_precompile = false
-
+      
     # Version of your assets, change this if you want to expire all your assets
     config.assets.version = '2.0'
   end
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/app/assets/javascripts/src/main.js b/public/famous/main.js
similarity index 68%
rename from app/assets/javascripts/src/main.js
rename to public/famous/main.js
index b3f7c6b8..3a8c0f91 100644
--- a/app/assets/javascripts/src/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({
@@ -56,6 +56,57 @@ define(function(require, exports, module) {
     };
     f.mainContext.add(f.viz.mod).add(f.viz.surf);
 
+    
+    // CONTENT / OTHER PAGES
+    f.yield = {};
+    f.yield.surf = new Surface({
+        size: [true, true],
+        classes: [],
+        properties: {
+            display: 'none'
+        }
+    });
+    var loadYield = function () {
+            f.loadYield();
+            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);
+    }
+    f.yield.mod = new Modifier({
+        origin: [0.5, 0.5],
+        opacity: 0
+    });
+    f.yield.show = function () {
+        f.yield.surf.setProperties({ "display":"block" });
+        f.yield.mod.setOpacity(
+            1,
+            { duration: 300 }
+        );
+    };
+    f.yield.hide = function () {
+        f.yield.mod.setOpacity(
+            0, 
+            { duration: 300 }, 
+            function() {
+                f.yield.surf.setProperties({"display": "none"});
+            }
+        );
+    };
+    f.mainContext.add(f.yield.mod).add(f.yield.surf);
+    
+    f.loadYield = function () {
+        Metamaps.Loading.loader.hide();
+        var yield = document.getElementById('yield').innerHTML;
+        f.yield.surf.setContent(yield);
+        f.yield.surf.deploy(f.yield.surf._currTarget);
+        f.yield.show();
+    };
+    
+    
     // EXPLORE MAPS BAR
     f.explore = {};
     f.explore.surf = new Surface({
@@ -119,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,
diff --git a/app/assets/javascripts/src/templates.js b/public/famous/templates.js
similarity index 96%
rename from app/assets/javascripts/src/templates.js
rename to public/famous/templates.js
index c3649711..220d32cd 100644
--- a/app/assets/javascripts/src/templates.js
+++ b/public/famous/templates.js
@@ -13,7 +13,6 @@ t.logoContent += '</ul>';
 /* logged out explore maps bars */
 t.activeContent = '<div class="exploreMapsMenu">';
   t.activeContent += '<div class="exploreMapsCenter">';
-        t.activeContent += '<a href="/">My Maps</a>';
         t.activeContent += '<a href="/explore/active" class="active">Recently Active</a>';
         t.activeContent += '<a href="/explore/featured">Featured</a>';
         t.activeContent += '<a href="/explore/new">New</a>';
@@ -23,7 +22,6 @@ t.activeContent += '</div>';
 
 t.featuredContent = '<div class="exploreMapsMenu">';
   t.featuredContent += '<div class="exploreMapsCenter">';
-        t.featuredContent += '<a href="/">My Maps</a>';
         t.featuredContent += '<a href="/explore/active">Recently Active</a>';
         t.featuredContent += '<a href="/explore/featured" class="active">Featured</a>';
         t.featuredContent += '<a href="/explore/new">New</a>';
@@ -33,7 +31,6 @@ t.featuredContent += '</div>';
 
 t.newContent = '<div class="exploreMapsMenu">';
   t.newContent += '<div class="exploreMapsCenter">';
-        t.newContent += '<a href="/">My Maps</a>';
         t.newContent += '<a href="/explore/active">Recently Active</a>';
         t.newContent += '<a href="/explore/featured">Featured</a>';
         t.newContent += '<a href="/explore/new" class="active">New</a>';
@@ -83,4 +80,4 @@ t.newAuthContent = '<div class="exploreMapsMenu">';
 t.newAuthContent += '</div>';
 
     module.exports = t;
-});
\ No newline at end of file
+});
diff --git a/vendor/assets/javascripts/.gitkeep b/vendor/assets/javascripts/.gitkeep
deleted file mode 100644
index e69de29b..00000000
diff --git a/vendor/assets/stylesheets/.gitkeep b/vendor/assets/stylesheets/.gitkeep
deleted file mode 100644
index e69de29b..00000000
diff --git a/vendor/plugins/.gitkeep b/vendor/plugins/.gitkeep
deleted file mode 100644
index e69de29b..00000000