merged develop into thevalueweb

CONTRIBUTING.md

@@ -87,7 +87,7 @@ If you'd like to contribute a fix for a bug you've encountered, first read up on
 aware of the issue. By filing the issue first, we may be able to provide you
 with some insight that guides you in the right direction.
 
-[metamaps-issues]: https://github.com/Connoropolous/metamaps_gen002/issues
+[metamaps-issues]: https://github.com/metamaps/metamaps_gen002/issues
 [git-branching-model]: http://nvie.com/posts/a-successful-git-branching-model/
-[fork-metamaps]: https://github.com/Connoropolous/metamaps_gen002/fork
+[fork-metamaps]: https://github.com/metamaps/metamaps_gen002/fork
 [cla]: http://metamaps.cc/cla

LiveSiteUpdatesNotes.txt

@@ -1,3 +1,9 @@
+make sure that devise key is correct
+
+
+make sure that AWS bucket is set to the metamaps-production bucket
+
+
 make sure that root individuals have same 'joinedwithcode' as 'code'
 
 User.all.each do |u|

README.md

@@ -47,9 +47,9 @@ Copyright (c) 2014 Connor Turland
 [site-blog]: http://blog.metamaps.cc
 [site-beta]: http://metamaps.cc
 [community]: https://plus.google.com/u/0/communities/115060009262157699234
-[license]: https://github.com/Connoropolous/metamaps_gen002/blob/master/LICENSE
+[license]: https://github.com/metamaps/metamaps_gen002/blob/master/LICENSE
-[contributing]: https://github.com/Connoropolous/metamaps_gen002/blob/master/CONTRIBUTING.md
+[contributing]: https://github.com/metamaps/metamaps_gen002/blob/master/CONTRIBUTING.md
-[contributing-issues]: https://github.com/Connoropolous/metamaps_gen002/blob/master/CONTRIBUTING.md#reporting-bugs-and-other-issues
+[contributing-issues]: https://github.com/metamaps/metamaps_gen002/blob/master/CONTRIBUTING.md#reporting-bugs-and-other-issues
-[windows-installation]: https://github.com/Connoropolous/metamaps_gen002/blob/master/WindowsInstallation.md
+[windows-installation]: https://github.com/metamaps/metamaps_gen002/blob/master/WindowsInstallation.md
-[mac-installation]: https://github.com/Connoropolous/metamaps_gen002/blob/master/MacInstallation.md
+[mac-installation]: https://github.com/metamaps/metamaps_gen002/blob/master/MacInstallation.md
-[ubuntu-installation]: https://github.com/Connoropolous/metamaps_gen002/blob/master/UbuntuInstallation.md
+[ubuntu-installation]: https://github.com/metamaps/metamaps_gen002/blob/master/UbuntuInstallation.md

UbuntuInstallation.md

@@ -38,7 +38,7 @@ running this will check your system for requirements as well so you will need to
 
 alright now we can download metamaps from the master using git
 
-    git clone https://github.com/Connoropolous/metamaps_gen002.git
+    git clone https://github.com/metamaps/metamaps_gen002.git
 
 now there is a couple other things we are going to need which is phantomjs, nodejs, postgresql, libpq-dev and redis-server
 

WindowsInstallation.md

@@ -13,7 +13,7 @@ also download node.js, which is also needed http://nodejs.org/download/
 
 Navigate to the folder that you want to download the metamaps files to and run the following: (use your forked git repository address if it's different than this repo. You will also need to go to your Github account settings and add the SSH key that was placed in your clipboard earlier)
 
-    git clone https://github.com/Connoropolous/metamaps_gen002.git --branch develop
+    git clone https://github.com/metamaps/metamaps_gen002.git --branch develop
     cd metamaps_gen002
   
 Now you're in the main directory. 

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

@@ -89,10 +89,20 @@ Metamaps.Backbone.Map = Backbone.Model.extend({
         function capitalize(string) {
             return string.charAt(0).toUpperCase() + string.slice(1);
         }
+
+        var n = this.get('name');
+        var d = this.get('desc');
+
+        var maxNameLength = 32;
+        var maxDescLength = 118;
+        var truncatedName = n ? (n.length > maxNameLength ? n.substring(0, maxNameLength) + "..." : n) : "";
+        var truncatedDesc = d ? (d.length > maxDescLength ? d.substring(0, maxDescLength) + "..." : d) : "";
+
         var obj = {
             id: this.id,
-            name: this.get('name'),
+            name: truncatedName,
-            desc: this.get('desc'),
+            fullName: n,
+            desc: truncatedDesc,
             permission: this.get("permission") ? capitalize(this.get("permission")) : "Commons",
             editPermission: this.authorizeToEdit(Metamaps.Active.Mapper) ? 'canEdit' : 'cannotEdit',
             contributor_count_number: '<span class="cCountColor">' + this.get('contributor_count') + '</span>',
@@ -131,11 +141,20 @@ Metamaps.Backbone.MapsCollection = Backbone.Collection.extend({
         this.id = options.id;
         this.sortBy = options.sortBy;
 
+        if (options.mapperId) {
+            this.mapperId = options.mapperId;
+        }
+
         // this.page represents the NEXT page to fetch
         this.page = models.length > 0 ? (models.length < 20 ? "loadedAll" : 2) : 1;
     },
     url: function() {
+        if (!this.mapperId) {
             return '/explore/' + this.id + '.json';
+        }
+        else {
+            return '/explore/mapper/' + this.mapperId + '.json';
+        }
     },
     comparator: function (a, b) {
         a = a.get(this.sortBy);

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

@@ -92,10 +92,18 @@ Metamaps.GlobalUI = {
         if (Metamaps.Active.Mapper) Metamaps.Active.Mapper = new Metamaps.Backbone.Mapper(Metamaps.Active.Mapper);
 
         var myCollection = Metamaps.Maps.Mine ? Metamaps.Maps.Mine : [];
+        var mapperCollection = [];
+        var mapperOptionsObj = {id: 'mapper', sortBy: 'updated_at' };
+        if (Metamaps.Maps.Mapper) {
+            mapperCollection = Metamaps.Maps.Mapper.models;
+            mapperOptionsObj.mapperId = Metamaps.Maps.Mapper.id;
+        }
         var featuredCollection = Metamaps.Maps.Featured ? Metamaps.Maps.Featured : [];
         var activeCollection = Metamaps.Maps.Active ? Metamaps.Maps.Active : [];
-        Metamaps.Maps.Mine = new Metamaps.Backbone.MapsCollection(myCollection, {id: 'mine', sortBy: 'name' });
+        Metamaps.Maps.Mine = new Metamaps.Backbone.MapsCollection(myCollection, {id: 'mine', sortBy: 'updated_at' });
-        Metamaps.Maps.Featured = new Metamaps.Backbone.MapsCollection(featuredCollection, {id: 'featured', sortBy: 'name' });
+        // 'Mapper' refers to another mapper
+        Metamaps.Maps.Mapper = new Metamaps.Backbone.MapsCollection(mapperCollection, mapperOptionsObj);
+        Metamaps.Maps.Featured = new Metamaps.Backbone.MapsCollection(featuredCollection, {id: 'featured', sortBy: 'updated_at' });
         Metamaps.Maps.Active = new Metamaps.Backbone.MapsCollection(activeCollection, {id: 'active', sortBy: 'updated_at' });
     },
     openLightbox: function (which) {
@@ -602,8 +610,7 @@ Metamaps.GlobalUI.Search = {
             } else if (dataset == "maps") {
                 Metamaps.Router.maps(datum.id);
             } else if (dataset == "mappers") {
-                win = window.open('/maps/mappers/' + datum.id, '_blank');
+                Metamaps.Router.explore("mapper", datum.id);
-                win.focus();
             }
         }
     },

app/assets/javascripts/src/Metamaps.JIT.js

@@ -112,8 +112,10 @@ Metamaps.JIT = {
         });
 
         if (self.vizData.length == 0) {
+            Metamaps.Famous.viz.showInstructions();
             Metamaps.Visualize.loadLater = true;
         }
+        else Metamaps.Famous.viz.hideInstructions();
 
         Metamaps.Visualize.render();
     }, // prepareVizData
@@ -378,11 +380,21 @@ Metamaps.JIT = {
                         if(e.ctrlKey){
                             Metamaps.Visualize.mGraph.busy = false;
                             Metamaps.Mouse.boxEndCoordinates = eventInfo.getPos();
+
+                            var bS = Metamaps.Mouse.boxStartCoordinates;
+                            var bE = Metamaps.Mouse.boxEndCoordinates;
+                            if (Math.abs(bS.x - bE.x) > 20 && Math.abs(bS.y - bE.y) > 20) {
                                 Metamaps.JIT.zoomToBox(e);
-                            //console.log('called zoom to box');
                                 return;
                             }
-                        else if (e.shiftKey) {
+                            else {
+                                Metamaps.Mouse.boxStartCoordinates = null;
+                                Metamaps.Mouse.boxEndCoordinates = null;
+                            }
+                            //console.log('called zoom to box');
+                        }
+                        
+                        if (e.shiftKey) {
                             Metamaps.Visualize.mGraph.busy = false;
                             Metamaps.Mouse.boxEndCoordinates = eventInfo.getPos();
                             Metamaps.JIT.selectWithBox(e);
@@ -1127,11 +1139,18 @@ Metamaps.JIT = {
 		sY = -1 * sY;
 		eY = -1 * eY
 
+        var edgesToToggle = [];
         Metamaps.Synapses.each(function(synapse) {
-			var fromNodeX = synapse.get('edge').nodeFrom.pos.x;
+            var e = synapse.get('edge');
-			var fromNodeY = -1 * synapse.get('edge').nodeFrom.pos.y;
+            if (edgesToToggle.indexOf(e) === -1) {
-			var toNodeX = synapse.get('edge').nodeTo.pos.x;
+                edgesToToggle.push(e);
-			var toNodeY = -1 * synapse.get('edge').nodeTo.pos.y;
+            }
+        });
+		edgesToToggle.forEach(function(edge) {
+			var fromNodeX = edge.nodeFrom.pos.x;
+			var fromNodeY = -1 * edge.nodeFrom.pos.y;
+			var toNodeX = edge.nodeTo.pos.x;
+			var toNodeY = -1 * edge.nodeTo.pos.y;
 
             var maxX = fromNodeX;
 			var maxY = fromNodeY;
@@ -1207,21 +1226,18 @@ Metamaps.JIT = {
 			
             //The test synapse was selected!
 
-            // make sure the edge hasn't been hidden from the page
-            var node1id = synapse.get('edge').nodeFrom.id;
-            var node2id = synapse.get('edge').nodeTo.id;
-            var edge = Metamaps.Visualize.mGraph.graph.getAdjacence(node1id, node2id);
             if(selectTest){
+                // shiftKey = toggleSelect, otherwise 
 				if(e.shiftKey){
-					if(Metamaps.Selected.Edges.indexOf(synapse.get('edge')) != -1 ){
+					if(Metamaps.Selected.Edges.indexOf(edge) != -1 ){
-						Metamaps.Control.deselectEdge(synapse.get('edge'));
+						Metamaps.Control.deselectEdge(edge);
 					}
 					else{
-						if (edge) Metamaps.Control.selectEdge(synapse.get('edge'));
+						Metamaps.Control.selectEdge(edge);
 					}
 				}
 				else{
-					if (edge) Metamaps.Control.selectEdge(synapse.get('edge'));
+					Metamaps.Control.selectEdge(edge);
 				}
 			}
 		});
@@ -1322,9 +1338,9 @@ Metamaps.JIT = {
 
         var disabled = authorized ? "" : "disabled";
 
-        if (Metamaps.Active.Map) menustring += '<li class="rc-hide"><div class="rc-icon"></div>Hide until refresh</li>';
+        if (Metamaps.Active.Map) menustring += '<li class="rc-hide"><div class="rc-icon"></div>Hide until refresh<div class="rc-keyboard">Ctrl+H</div></li>';
-        if (Metamaps.Active.Map && Metamaps.Active.Mapper) menustring += '<li class="rc-remove ' + disabled + '"><div class="rc-icon"></div>Remove from map</li>';
+        if (Metamaps.Active.Map && Metamaps.Active.Mapper) menustring += '<li class="rc-remove ' + disabled + '"><div class="rc-icon"></div>Remove from map<div class="rc-keyboard">Ctrl+M</div></li>';
-        if (Metamaps.Active.Map && Metamaps.Active.Mapper) menustring += '<li class="rc-delete ' + disabled + '"><div class="rc-icon"></div>Delete</li>';
+        if (Metamaps.Active.Map && Metamaps.Active.Mapper) menustring += '<li class="rc-delete ' + disabled + '"><div class="rc-icon"></div>Delete<div class="rc-keyboard">Ctrl+D</div></li>';
         
 
         if (Metamaps.Active.Topic) {
@@ -1337,6 +1353,8 @@ Metamaps.JIT = {
                          <li class="changeP toPrivate"><div class="rc-perm-icon"></div>private</li> \
                      </ul>';
 
+            menustring += '<li class="rc-spacer"></li>';
+
             menustring += '<li class="rc-permission"><div class="rc-icon"></div>Change permissions' + options + '<div class="expandLi"></div></li>';
 
             var metacodeOptions = $('#metacodeOptions').html();
@@ -1344,6 +1362,11 @@ Metamaps.JIT = {
             menustring += '<li class="rc-metacode"><div class="rc-icon"></div>Change metacode' + metacodeOptions + '<div class="expandLi"></div></li>';
         }
         if (Metamaps.Active.Topic) {
+
+            if (!Metamaps.Active.Mapper) {
+                menustring += '<li class="rc-spacer"></li>';
+            }
+
             // set up the get sibling menu as a "lazy load"
             // only fill in the submenu when they hover over the get siblings list item
             var siblingMenu = '<ul id="fetchSiblingList"> \
@@ -1575,9 +1598,11 @@ Metamaps.JIT = {
 
         var disabled = authorized ? "" : "disabled";
 
-        if (Metamaps.Active.Map) menustring += '<li class="rc-hide"><div class="rc-icon"></div>Hide until refresh</li>';
+        if (Metamaps.Active.Map) menustring += '<li class="rc-hide"><div class="rc-icon"></div>Hide until refresh<div class="rc-keyboard">Ctrl+H</div></li>';
-        if (Metamaps.Active.Map && Metamaps.Active.Mapper) menustring += '<li class="rc-remove ' + disabled + '"><div class="rc-icon"></div>Remove from map</li>';
+        if (Metamaps.Active.Map && Metamaps.Active.Mapper) menustring += '<li class="rc-remove ' + disabled + '"><div class="rc-icon"></div>Remove from map<div class="rc-keyboard">Ctrl+M</div></li>';
-        if (Metamaps.Active.Map && Metamaps.Active.Mapper) menustring += '<li class="rc-delete ' + disabled + '"><div class="rc-icon"></div>Delete</li>';
+        if (Metamaps.Active.Map && Metamaps.Active.Mapper) menustring += '<li class="rc-delete ' + disabled + '"><div class="rc-icon"></div>Delete<div class="rc-keyboard">Ctrl+D</div></li>';
+
+        if (Metamaps.Active.Map && Metamaps.Active.Mapper) menustring += '<li class="rc-spacer"></li>';
 
         if (Metamaps.Active.Mapper) {
             var permOptions = '<ul><li class="changeP toCommons"><div class="rc-perm-icon"></div>commons</li> \

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

@@ -6,11 +6,12 @@
         routes: {
             "": "home", // #home
             "explore/:section": "explore", // #explore/active
+            "explore/:section/:id": "explore", // #explore/mapper/1234
             "maps/:id": "maps" // #maps/7
         },
         home: function () {
             
-            if (Metamaps.Active.Mapper) document.title = 'My Maps | Metamaps';
+            if (Metamaps.Active.Mapper) document.title = 'Explore Active Maps | Metamaps';
             else document.title = 'Home | Metamaps';
 
             Metamaps.currentSection = "";
@@ -25,7 +26,7 @@
                 
                 Metamaps.Famous.yield.hide();
                 
-                Metamaps.Famous.explore.set('mine');
+                Metamaps.Famous.explore.set('active');
                 Metamaps.Famous.maps.resetScroll(); // sets the scroll back to the top
                 Metamaps.Famous.explore.show();
 
@@ -34,9 +35,9 @@
                 Metamaps.GlobalUI.Search.open();
                 Metamaps.GlobalUI.Search.lock();
 
-                Metamaps.Views.exploreMaps.setCollection( Metamaps.Maps.Mine );
+                Metamaps.Views.exploreMaps.setCollection( Metamaps.Maps.Active );
-                if (Metamaps.Maps.Mine.length === 0) {
+                if (Metamaps.Maps.Active.length === 0) {
-                    Metamaps.Maps.Mine.getMaps(); // this will trigger an explore maps render
+                    Metamaps.Maps.Active.getMaps(); // this will trigger an explore maps render
                 }
                 else {
                     Metamaps.Views.exploreMaps.render();
@@ -64,13 +65,29 @@
             Metamaps.Active.Map = null;
             Metamaps.Active.Topic = null;
         },
-        explore: function (section) {
+        explore: function (section, id) {
             
             // just capitalize the variable section
-            // either 'mine', 'featured', or 'active'
+            // either 'featured', 'mapper', or 'active'
             var capitalize = section.charAt(0).toUpperCase() + section.slice(1);
             
+            if (section === "featured" || section === "active") {
                 document.title = 'Explore ' + capitalize + ' Maps | Metamaps';
+            }
+            else if (section === "mapper") {
+                $.ajax({
+                    url: "/users/" + id + ".json",
+                    success: function (response) {
+                        document.title = response.name + ' | Metamaps';
+                    },
+                    error: function () {
+                        
+                    }
+                });
+            }
+            else if (section === "mine") {
+                document.title = 'Explore My Maps | Metamaps';
+            }
 
             $('.wrapper').removeClass('homePage mapPage topicPage');
             $('.wrapper').addClass('explorePage');
@@ -78,6 +95,17 @@
             Metamaps.currentSection = "explore";
             Metamaps.currentPage = section;
 
+            // this will mean it's a mapper page being loaded
+            if (id) {
+                if (Metamaps.Maps.Mapper.mapperId !== id) {
+                    // empty the collection if we are trying to load the maps 
+                    // collection of a different mapper than we had previously
+                    Metamaps.Maps.Mapper.reset();
+                    Metamaps.Maps.Mapper.page = 1;
+                }
+                Metamaps.Maps.Mapper.mapperId = id;
+            }
+
             Metamaps.Views.exploreMaps.setCollection( Metamaps.Maps[capitalize] );
             if (Metamaps.Maps[capitalize].length === 0) {
                 Metamaps.Loading.show();
@@ -85,9 +113,14 @@
                     Metamaps.Maps[capitalize].getMaps(); // this will trigger an explore maps render
                 }, 300); // wait 300 milliseconds till the other animations are done to do the fetch 
             }
+            else {
+                if (id) {
+                    Metamaps.Views.exploreMaps.fetchUserThenRender();
+                }
                 else {
                     Metamaps.Views.exploreMaps.render();
                 }
+            }
 
             Metamaps.GlobalUI.Search.open();
             Metamaps.GlobalUI.Search.lock();
@@ -96,7 +129,7 @@
 
             Metamaps.Famous.maps.resetScroll(); // sets the scroll back to the top
             Metamaps.Famous.maps.show();
-            Metamaps.Famous.explore.set(section);
+            Metamaps.Famous.explore.set(section, id);
             Metamaps.Famous.explore.show();
 
             Metamaps.Famous.viz.hide();
@@ -172,13 +205,8 @@
     
     Metamaps.Router = new Router();
 
-    Metamaps.Router.init = function () {
+
-        Backbone.history.start({
+    Metamaps.Router.intercept = function (evt) {
-            silent: true,
-            pushState: true,
-            root: '/'
-        });
-        $(document).on("click", "a:not([data-bypass])", function (evt) {
         var segments;
 
         var href = {
@@ -187,7 +215,7 @@
         };
         var root = location.protocol + "//" + location.host + Backbone.history.options.root;
         
-            if (href.prop && href.prop === root) href.attr = ""
+        if (href.prop && href.prop === root) href.attr = "";
         
         if (href.prop && href.prop.slice(0, root.length) === root) {
             evt.preventDefault();
@@ -197,9 +225,17 @@
 
             if (href.attr === "") Metamaps.Router.home();
             else {
-                    Metamaps.Router[segments[0]](segments[1]);
+                Metamaps.Router[segments[0]](segments[1], segments[2]);
             }
         }
+    };
+
+    Metamaps.Router.init = function () {
+        Backbone.history.start({
+            silent: true,
+            pushState: true,
+            root: '/'
         });
-    }
+        $(document).on("click", "a:not([data-bypass])", Metamaps.Router.intercept);
+    };
 })();

app/assets/javascripts/src/Metamaps.Views.js

@@ -5,6 +5,20 @@
     
 Metamaps.Views.init = function () {
 
+    Metamaps.Views.MapperCard = Backbone.View.extend({
+
+        template: Hogan.compile( $('#mapperCardTemplate').html() ),
+
+        tagNamea: "div",
+
+        className: "mapper",
+
+        render: function () {
+            this.$el.html( this.template.render(this.model) );
+            return this;
+        }
+    });
+
     Metamaps.Views.MapCard = Backbone.View.extend({
 
         template: Hogan.compile( $('#mapCardTemplate').html() ),
@@ -40,12 +54,20 @@ Metamaps.Views.init = function () {
             this.listenTo(this.collection, 'successOnFetch', this.handleSuccess);
             this.listenTo(this.collection, 'errorOnFetch', this.handleError);
         },
-        render: function () {
+        render: function (mapperObj) {
             
             var that = this;
 
             this.el.innerHTML = "";
 
+            // in case it is a page where we have to display the mapper card
+            if (mapperObj) {
+                var view = new Metamaps.Views.MapperCard({ model: mapperObj });
+
+                that.el.appendChild( view.render().el );
+            }
+
+
             this.collection.each(function (map) {
                 var view = new Metamaps.Views.MapCard({ model: map });
 
@@ -69,16 +91,44 @@ Metamaps.Views.init = function () {
             }
 
             Metamaps.Loading.hide();
-            setTimeout(function(){
+
-                var path = Metamaps.currentSection == "" ? "" : "/explore/" + Metamaps.currentPage; 
+            clearTimeout(Metamaps.routerTimeoutFunctionIds);
+            Metamaps.routerTimeoutId = setTimeout((function(localCurrentPage){ return function(){
+                var path = (Metamaps.currentSection == "") ? "" : "/explore/" + localCurrentPage;
+
+                // alter url if for mapper profile page
+                if (that.collection && that.collection.mapperId) {
+                    path += "/" + that.collection.mapperId;
+                }
+
                 Metamaps.Router.navigate(path);
-            }, 500);
+            }})(Metamaps.currentPage), 500);
         },
         handleSuccess: function () {
+            var that = this;
+
+            if (this.collection && this.collection.id === "mapper") {
+                this.fetchUserThenRender();
+            }
+            else {
                 this.render();
+            }
         },
         handleError: function () {
             console.log('error loading maps!'); //TODO 
+        },
+        fetchUserThenRender: function () {
+            var that = this;
+            // first load the mapper object and then call the render function
+            $.ajax({
+                url: "/users/" + this.collection.mapperId + "/details.json",
+                success: function (response) {
+                    that.render(response);
+                },
+                error: function () {
+                    
+                }
+            });
         }
     });
 

app/assets/javascripts/src/Metamaps.js

@@ -749,6 +749,10 @@ Metamaps.Create = {
                 if (datum.id) { // if they clicked on an existing synapse get it
                     Metamaps.Synapse.getSynapseFromAutocomplete(datum.id);
                 }
+                else {
+                    Metamaps.Create.newSynapse.description = datum.value;
+                    Metamaps.Synapse.createSynapseLocally();
+                }
             });
         },
         beingCreated: false,
@@ -1089,6 +1093,36 @@ Metamaps.TopicCard = {
             $('.showcard .yourTopic .mapPerm').click(openPermissionSelect);
             $('.showcard').click(hidePermissionSelect);
         }
+
+        $('.links .mapCount').unbind().click(function(event){
+            $('.mapCount .tip').toggle();
+            $('.showcard .hoverTip').toggleClass('hide');
+            event.stopPropagation();
+        });
+        $('.mapCount .tip').unbind().click(function(event){
+            event.stopPropagation();
+        });
+        $('.showcard').unbind('.hideTip').bind('click.hideTip', function(){
+            $('.mapCount .tip').hide();
+            $('.showcard .hoverTip').removeClass('hide');
+        });
+
+        $('.mapCount .tip li a').click(Metamaps.Router.intercept);
+
+        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 +1196,27 @@ Metamaps.TopicCard = {
             nodeValues.attachments = '';
         }
 
+        var inmapsAr = topic.get("inmaps");
+        var inmapsLinks = topic.get("inmapsLinks");
+        nodeValues.inmaps ='';
+        if (inmapsAr.length < 6) {
+            for (i = 0; i < inmapsAr.length; i++) {
+                var url = "/maps/" + inmapsLinks[i];
+                nodeValues.inmaps += '<li><a href="' + url + '">'  + inmapsAr[i]+ '</a></li>';
+            }
+        }
+        else {
+            for (i = 0; i < 5; i++){
+                var url = "/maps/" + inmapsLinks[i];
+                nodeValues.inmaps += '<li><a href="' + url + '">' + inmapsAr[i] + '</a></li>';
+            }
+            extra = inmapsAr.length - 5;
+            nodeValues.inmaps += '<li><span class="showMore">See ' + extra + ' more...</span></li>'
+            for (i = 5; i < inmapsAr.length; i++){
+                var url = "/maps/" + inmapsLinks[i];
+                nodeValues.inmaps += '<li class="hideExtra extraText"><a href="' + url + '">' + inmapsAr[i]+ '</a></li>';
+            }
+        }
         nodeValues.permission = topic.get("permission");
         nodeValues.mk_permission = topic.get("permission").substring(0, 2);
         nodeValues.map_count = topic.get("map_count").toString();
@@ -1273,8 +1328,13 @@ Metamaps.SynapseCard = {
 
         //if edge data is blank or just whitespace, populate it with data_nil
         if ($('#edit_synapse_desc').html().trim() == '') {
+            if (synapse.authorizeToEdit(Metamaps.Active.Mapper)) {
                 $('#edit_synapse_desc').html(data_nil);
             }
+            else {
+                $('#edit_synapse_desc').html("(no description)");
+            }
+        }
 
         $('#edit_synapse_desc').bind("ajax:success", function () {
             var desc = $(this).html();
@@ -1334,7 +1394,7 @@ Metamaps.SynapseCard = {
     },
     add_user_info: function (synapse) {
         var u = '<div id="edgeUser" class="hoverForTip">';
-        u += '<img src="" width="24" height="24" />'
+        u += '<a href="/explore/mapper/' + synapse.get("user_id") + '"> <img src="" width="24" height="24" /></a>'
         u += '<div class="tip">' + synapse.get("user_name") + '</div></div>';
         $('#editSynLowerBar').append(u);
 
@@ -3412,13 +3472,44 @@ Metamaps.Filter = {
                 else console.log(topic);
             }
         });
+
+        // flag all the edges back to 'untouched'
         Metamaps.Synapses.each(function(synapse) {
            var e = synapse.get('edge');
-           var desc = synapse.get("desc");
+           e.setData('touched', false);
+        });
+        Metamaps.Synapses.each(function(synapse) {
+           var e = synapse.get('edge');
+           var desc;
            var user_id = synapse.get("user_id").toString();
 
-            if (visible.synapses.indexOf(desc) == -1) passesSynapse = false;
+           if (e && !e.getData('touched')) {
-            else passesSynapse = true;
+
+                var synapses = e.getData('synapses');
+
+                // if any of the synapses represent by the edge are still unfiltered
+                // leave the edge visible
+                passesSynapse = false;
+                for (var i = 0; i < synapses.length; i++) {
+                    desc = synapses[i].get("desc");
+                    if (visible.synapses.indexOf(desc) > -1) passesSynapse = true;
+                }
+
+                // if the synapse description being displayed is now being
+                // filtered, set the displayIndex to the first unfiltered synapse if there is one
+                var displayIndex = e.getData("displayIndex") ? e.getData("displayIndex") : 0;
+                var displayedSynapse = synapses[displayIndex];
+                desc = displayedSynapse.get("desc");
+                if (passesSynapse && visible.synapses.indexOf(desc) == -1) {
+                    // iterate and find an unfiltered one
+                    for (var i = 0; i < synapses.length; i++) {
+                        desc = synapses[i].get("desc");
+                        if (visible.synapses.indexOf(desc) > -1) {
+                            e.setData('displayIndex', i);
+                            break;
+                        }
+                    }
+                }
 
                 if (onMap) {
                     // when on a map, 
@@ -3431,19 +3522,17 @@ Metamaps.Filter = {
 
                 var color = Metamaps.Settings.colors.synapses.normal;
                 if (passesSynapse && passesMapper) {
-                if (e) {
                     e.setData('alpha', 1, 'end');
                     e.setData('color', color, 'end');
                 }
-                else console.log(synapse);
-            }
                 else {
-                if (e) {
                     Metamaps.Control.deselectEdge(e, true);
                     e.setData('alpha', opacityForFilter, 'end');
                 }
-                else console.log(synapse);
+
+                e.setData('touched', true);
             }
+            else if (!e) console.log(synapse);
         });
             
         // run the animation
@@ -3493,8 +3582,10 @@ Metamaps.Listeners = {
             case 69: //if e or E is pressed
                 if (e.ctrlKey){
                     e.preventDefault();
+                    if (Metamaps.Active.Map) {
                         Metamaps.JIT.zoomExtents(null, Metamaps.Visualize.mGraph.canvas);
                     }
+                }
                 break;
             case 77: //if m or M is pressed
                 if (e.ctrlKey){
@@ -3931,6 +4022,9 @@ Metamaps.Topic = {
             return;
         }
 
+        // hide the 'double-click to add a topic' message
+        Metamaps.Famous.viz.hideInstructions();
+
         $(document).trigger(Metamaps.Map.events.editedByActiveMapper);
 
         var metacode = Metamaps.Metacodes.get(Metamaps.Create.newTopic.metacode);
@@ -4479,7 +4573,6 @@ Metamaps.Map = {
             encoded_image: canvas.canvas.toDataURL()
         };
 
-        console.log(imageData.encoded_image);
         var map = Metamaps.Active.Map;
 
         var today = new Date();
@@ -4538,13 +4631,13 @@ Metamaps.Map.CheatSheet = {
         };
 
         $('#gettingStarted').click(function() {
-            switchVideo(this,'88334167');
+            //switchVideo(this,'88334167');
         });
         $('#upYourSkillz').click(function() {
-            switchVideo(this,'100118167');
+            //switchVideo(this,'100118167');
         });
         $('#advancedMapping').click(function() {
-            switchVideo(this,'88334167');
+            //switchVideo(this,'88334167');
         });
     }
 }; // end Metamaps.Map.CheatSheet
@@ -4687,6 +4780,8 @@ Metamaps.Map.InfoBox = {
         $('.mapContributors .tip').unbind().click(function(event){
             event.stopPropagation();
         });
+        $('.mapContributors .tip li a').click(Metamaps.Router.intercept);
+
         $('.mapInfoBox').unbind('.hideTip').bind('click.hideTip', function(){
             $('.mapContributors .tip').hide();
         });
@@ -4700,15 +4795,15 @@ Metamaps.Map.InfoBox = {
         var self = Metamaps.Map.InfoBox;
 
         var string = ""; 
-
+        console.log("hello!!")
         string += "<ul>";
 
         Metamaps.Mappers.each(function(m){
-            string += '<li><img class="rtUserImage" width="25" height="25" src="' + m.get("image") + '" />' + m.get("name") + '</li>';
+            string += '<li><a href="/explore/mapper/' + m.get("id") + '">' + '<img class="rtUserImage" width="25" height="25" src="' + m.get("image") + '" />' + m.get("name") + '</a></li>';
         });
         
         string += "</ul>";
-
+        console.log(string);
         return string;
     },
     updateNumbers: function () {

app/assets/stylesheets/application.css

@@ -69,9 +69,6 @@ body,
 .main,
 .wrapper {
     height: 100%;
-}
-.homePage .famousYield {
-    
 }
 .wrapper.mapPage {
     overflow: hidden;
@@ -84,6 +81,8 @@ body {
     background: #d8d9da url(shattered_@2X.png);
     font-family: 'din-medium', helvetica, sans-serif;
     color: #424242;
+    -moz-osx-font-smoothing: grayscale;
+
 }
 h1,
 h2,
@@ -121,6 +120,7 @@ input[type="submit"] {
     border-radius: 2px;
     -webkit-user-select: none;
     font-family: 'din-medium', helvetica, sans-serif;
+    -webkit-font-smoothing: inherit;
 }
 button.button:hover,
 a.button:hover,
@@ -523,7 +523,7 @@ input[type="submit"]:active {
     left: 41px;
     z-index: 9999;
     width: 256px;
-    height: 42px;
+    height: 34px;
 }
 .new_topic #topic_name,
 .new_topic .tt-hint {
@@ -531,7 +531,7 @@ input[type="submit"]:active {
     background: #FFFFFF;
     height: 14px;
     margin: 0;
-    padding: 14px 6px;
+    padding: 10px 6px;
     border: none;
     border-radius: 2px;
     outline: none;
@@ -814,6 +814,7 @@ li.accountInvite span {
 }
 .accountImage {
     background-image: url(user.png);
+    background-size: 84px 84px;
     background-repeat: no-repeat;
     height:84px;
     width:84px;
@@ -1179,6 +1180,14 @@ h3.realtimeBoxTitle {
     color: black;
     box-shadow: 0px 3px 3px rgba(0,0,0,0.12), 0 3px 3px rgba(0,0,0,0.24);
 }
+
+.rightclickmenu .rc-spacer {
+    width:100%;
+    height:0;
+    border-top:1px solid #EBEBEB;
+    margin: 6px 0;
+    padding: 0;
+}
 .rightclickmenu > ul {
     
 }
@@ -1201,6 +1210,14 @@ h3.realtimeBoxTitle {
     background-color: transparent;
     cursor: default;
 }
+
+.rc-keyboard {
+    position: absolute;
+    top: 6px;
+    right: 12px;
+    color: #757575;
+}
+
 .rightclickmenu > ul > li .rc-icon {
     position: absolute;
     top: 0;
@@ -1247,7 +1264,7 @@ h3.realtimeBoxTitle {
     background-position: 0 -32px;
 }
 .rc-metacode li img {
-float: left;
+    display: inline-block;
 }
 .rightclickmenu .rc-permission ul, 
 .rightclickmenu .rc-metacode ul,
@@ -1294,8 +1311,9 @@ float: left;
 }
 .rightclickmenu .rc-metacode > ul > li,
 .rightclickmenu .rc-siblings > ul > li {
-    padding: 6px 10px 6px 8px;
+    padding: 6px 24px 6px 8px;
-    width: 100px;
+    width: auto;
+    white-space: nowrap;
 }
 .rightclickmenu .rc-metacode ul ul,
 .rightclickmenu .rc-siblings ul ul {
@@ -1311,7 +1329,9 @@ float: left;
 .rightclickmenu .rc-metacode ul ul li,
 .rightclickmenu .rc-siblings ul ul li {
     padding: 4px 10px 4px 8px;
-    width: 120px;
+    width: auto;
+    white-space: nowrap;
+    height: 24px;
 }
 .rightclickmenu .expandMetacodeSet {
     position: absolute;
@@ -1324,8 +1344,10 @@ float: left;
     background-position: 0 -32px;
 }
 .rightclickmenu .rc-metacode .mSelectName {
-    padding: 6px 0 0 32px;
+    padding: 0 16px 0 4px;
-    display: block;
+    display: inline-block;
+    position: relative;
+    top: -7px;
 }
 
 .moveMenusUp .rc-metacode ul, 
@@ -1599,6 +1621,7 @@ float: left;
 .wrapper div.mapInfoDesc span {
     float: none !important;
     padding-bottom: 10px;
+    word-wrap: break-word;
 }
 .infoStatIcon {
     float: left;
@@ -1688,6 +1711,9 @@ float: left;
     color: white;
 }
 
+.mapContributors .tip li a {
+    color: white;
+}
 .mapContributors div:after {
     content: '';
     position: absolute;
@@ -1884,9 +1910,21 @@ and it won't be important on password protected instances */
     display: none;
 }
 .mapInfoDelete {
-    background-image: url(delete_mapinfo.png);
+    color: #E0E0E0;
+}
+.mapInfoDelete .deleteMap {
+    width: 16px;
+    height: 16px;
+    margin: 8px auto 0;
+    background-image: url(remove_mapinfo_sprite.png);
     background-repeat: no-repeat;
-    background-position: center 8px;
+    background-position: -16px 0;
+}
+.mapInfoDelete:hover {
+    color: #F5F5F5;
+}
+.mapInfoDelete:hover .deleteMap {
+    background-position: 0 0;
 }
 /* only display delete button if it's a map you created */
 .yourMap .mapInfoDelete {
@@ -1959,6 +1997,7 @@ and it won't be important on password protected instances */
     height: 434px;
     background-color: #e0e0e0;
     padding: 64px 124px 64px 124px;
+    box-shadow: 0px 6px 3px rgba(0, 0, 0, 0.23), 10px 10px 10px rgba(0, 0, 0, 0.19);
     border-radius: 2px;
 }
 .lightboxContent h3 {
@@ -2677,6 +2716,13 @@ and it won't be important on password protected instances */
 .tutorialItem.active {
     color: #00bcd4;
 }
+.tutorialItem.disable {
+    color: #999;
+    cursor: default;
+}
+.tutorialItem.disable:hover {
+    color: #999;
+}
 #upYourSkillz {
     margin: 0 68px;
 }

app/assets/stylesheets/base.css

@@ -247,10 +247,83 @@
   background-image: url(map32_sprite.png);
   background-repeat: no-repeat;
   background-position: 0 0;
+  cursor: pointer;
 }
 .linkItem.mapCount:hover .mapCountIcon {
   background-position: 0 -32px;
 }
+
+.linkItem.mapCount:hover .hoverTip {
+  display: block;
+}
+.CardOnGraph .mapCount .tip, .CardonGraph .mapCount .hoverTip {
+  top: 44px;
+  left: 0px;
+  font-size: 12px !important;
+}
+
+.hoverTip {
+  white-space: nowrap;
+  font-family: 'din-regular';
+  top: 44px;
+  left: 0px;
+  font-size: 12px !important;
+  display: none;
+  position: absolute;
+  background: black;
+  color: white;
+  border-radius: 4px;
+  line-height: 17px;
+  padding: 3px 5px 2px;
+  z-index: 100;
+}
+
+
+.CardOnGraph .mapCount .tip:before, .CardOnGraph .mapCount .hoverTip: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;
+  color: #4FC059;
+}
+
+.mapCount .tip a {
+  color: white;
+}
+
+.mapCount .tip a:hover {
+  color: #757575;
+}
+
+
 .linkItem.synapseCount {
   margin-left: 2px;
   width: 24px;
@@ -269,6 +342,39 @@
 .linkItem.synapseCount:hover .synapseCountIcon {
   background-position: 0 -32px;
 }
+
+.CardOnGraph .synapseCount .tip {
+  position: absolute;
+  background: black;
+  width: auto;
+  top: 44px;
+  color: white;
+  white-space: nowrap;
+  border-radius: 2px;
+  font-size: 12px !important;
+  font-family: 'din-regular';
+  line-height: 12px;
+  padding: 4px 4px 4px;
+  z-index: 100;
+}
+
+.CardOnGraph .synapseCount:hover .tip {
+  display: block;
+}
+
+.CardOnGraph .synapseCount .tip:before {
+  content: '';
+  position: absolute;
+  margin-top: -8px;
+  margin-left: 6px;
+  width: 0;
+  height: 0;
+  border-bottom: 4px solid black;
+  border-left: 5px solid transparent;
+  border-right: 5px solid transparent;
+}
+
+
 .mapPerm {
   width: 32px;
   height: 32px;
@@ -381,11 +487,12 @@ cursor: pointer;
 }
 .CardOnGraph .metacodeSelect {
   display:none;
-  width:200px;
+  width:auto;
   z-index: 2;
   position: absolute;
   background: #EAEAEA;
   left: 300px;
+  white-space: nowrap;
 }
 .CardOnGraph .metacodeSelect ul {
   position: relative; 
@@ -400,10 +507,10 @@ cursor: pointer;
   border: 1px solid #BDBDBD;
 }
 .CardOnGraph .metacodeSelect ul li {
-background-color: #F5F5F5;
+    background-color: #F5F5F5;
-cursor:pointer;
+    cursor:pointer;
-position: relative;
+    position: relative;
-padding: 9px 12px;
+    padding: 9px 24px 9px 12px;
 }
 .CardOnGraph .metacodeSelect ul li:hover {
 background-color: #E0E0E0;
@@ -414,15 +521,17 @@ background-color: #E0E0E0;
   left: 8px;
 }
 .CardOnGraph .metacodeSelect ul li .mSelectName {
-  padding-left: 28px;
+  margin-left: 28px;
+  margin-right: 4px;
 }
 .CardOnGraph .metacodeSelect ul ul {
   display:none;
   position: absolute;
-  left: 200px;
+  left: 100%;
   top: -1px;
   max-height: 270px;
   overflow-y: auto;
+  width: auto;
 }
 .CardOnGraph .metacodeSelect li:hover ul {
   display: block;
@@ -446,7 +555,7 @@ background-color: #E0E0E0;
 }
 .onRightEdge.metacodeSelect ul ul {
   left: auto;
-  right: 200px;
+  right: 100%;
 }
 /* too close to bottom of screen case */
 .onBottomEdge.metacodeSelect {
@@ -565,7 +674,7 @@ padding: 9px 7px 9px 31px;
 height: 12px;
 width: 198px;
 margin: 0 0 0 0;
-border: 1px solid #BDBDBD;
+border: none;
 outline: none;
 font-size: 12px;
 line-height: 12px;
@@ -841,6 +950,7 @@ font-family: 'din-regular', helvetica, sans-serif;
     background: #424242;
     border-radius:2px;
     margin:16px 16px 16px 19px;
+    box-shadow: 0px 3px 3px rgba(0,0,0,0.23), 0 3px 3px rgba(0,0,0,0.16);
 }
 
 .mapCard {
@@ -864,8 +974,10 @@ font-family: 'din-regular', helvetica, sans-serif;
 }
 
 .mapCard .title {
+  word-wrap: break-word;
   font-size:18px;
   line-height:22px;
+  height: 44px;
   display:block;
   padding: 0 16px;
   text-align: center;
@@ -895,11 +1007,11 @@ font-family: 'din-regular', helvetica, sans-serif;
   -webkit-flex: 1;          /* Chrome */
   -ms-flex: 1;              /* IE 10 */
   flex: 1;                  /* NEW, Spec - Opera 12.1, Firefox 20+ */
-   overflow-y:auto;
    padding:0 16px 8px;
    font-family: helvetica, sans-serif;
    font-style: italic;
    font-size: 12px;
+   word-wrap: break-word;
 }
 .mCS_no_scrollbar {
   padding-right: 5px;
@@ -938,3 +1050,78 @@ font-family: 'din-regular', helvetica, sans-serif;
   font-family: 'din-medium', sans-serif;
   color: #DAB539;
 }
+
+
+/* mapper card */
+
+.mapper {
+    float: left;
+    width:220px;
+    height:340px;
+    font-size: 12px;
+    text-align: left;
+    overflow: visible;
+    background: #E0E0E0;
+    border-radius:2px;
+    margin:16px 16px 16px 19px;
+    box-shadow: 0px 3px 3px rgba(0,0,0,0.23), 0 3px 3px rgba(0,0,0,0.16);
+}
+
+.mapperCard {
+  width:100%;
+  height:308px;
+  padding: 16px 0;
+  color:#424242;
+}
+
+.mapperImage {
+    margin: 16px auto 0;
+    width: 96px;
+}
+.mapperImage img {
+  border-radius: 48px;
+  box-shadow: 0px 3px 3px rgba(0,0,0,0.23);
+}
+
+.mapperName {
+    font-size: 24px;
+    text-align: center;
+    margin-top: 24px;
+    padding: 0 16px;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    width: 189px;
+    overflow: hidden;
+}
+
+.mapperInfo {
+    color: #DB5D5D;
+    text-align:center;
+    margin-top: 16px;
+}
+
+.mapperMetadata {
+    background: url(profile_card_sprite.png) no-repeat center 0;
+    height: 64px;
+    width: 160px;
+    margin: 16px auto 0;
+}
+.mapperMetadata .metadataSection {
+    width: 32%;
+    display: inline-block;
+    text-align: center;
+}
+.mapperMetadata .metadataSection div {
+    font-size: 16px;
+    color: #424242;
+    margin: 14px 0;
+}
+.mapperMetadata .metadataMaps {
+    color: #DB5D5D;
+}
+.mapperMetadata .metadataTopics {
+    color: #4FC059;
+}
+.mapperMetadata .metadataSynapses {
+    color: #DAB539;
+}

app/assets/stylesheets/clean.css

@@ -30,6 +30,7 @@
   width: 100%;
   height: 100%;
   margin:0;
+  z-index: 0;
 }
 
 #yield {
@@ -207,16 +208,16 @@
     outline: none;
     font-size: 14px;
     line-height: 14px;
-    background: #FFFFFF; 
+    background: #F5F5F5; 
     font-family: 'din-medium', helvetica, sans-serif;
 }
 .sidebarSearch .tt-dropdown-menu {
     top: 40px !important;
     background: #F5F5F5;
     width: 472px;
-    overflow-y: visible;
+    overflow-y: auto;
     overflow-x: visible;
-    box-shadow: 0 1px 1.5px rgba(0,0,0,0.12), 0 1px 1px rgba(0,0,0,0.24);
+    box-shadow: 0 10px 10px rgba(0,0,0,0.19), 0 6px 3px rgba(0,0,0,0.23);
 }
 
 .autoOptions #mapContribs { 
@@ -321,7 +322,7 @@
     display: table-cell;
     vertical-align: middle;
     height: 32px;
-    padding: 0 8px;
+    padding: 0 18px 0 28px;
 }
 .sidebarSearch .tt-suggestion .icon {
     width: 32px;
@@ -332,18 +333,16 @@
     display: table-cell;
     vertical-align: middle;
     padding: 0 0 0 8px;
-    max-width: 70px;
+    width: 70px;
 }
 .sidebarSearch .tt-dataset-topics .topicIcon {
     width: 32px;
     height: 32px;
-}
-.sidebarSearch .tt-dataset-topics .tt-is-under-cursor .topicIcon,
-.sidebarSearch .tt-dataset-topics .tt-is-under-mouse-cursor .topicIcon {
     margin: 0 auto;
 }
 .sidebarSearch .tt-dataset-topics .metacodeTip {
     display: none;
+    margin: 0 auto;
 }
 .sidebarSearch .tt-dataset-topics .tt-is-under-cursor .metacodeTip,
 .sidebarSearch .tt-dataset-topics .tt-is-under-mouse-cursor .metacodeTip {
@@ -356,7 +355,7 @@
     text-align: center;
 }
 .sidebarSearch .tt-dataset-mappers .tt-suggestion .icon {
-    margin: 4px 9px 4px 4px;
+    margin: 0px 0px 0px 0px;
 }
 .sidebarSearch .tt-dataset-mappers .resultText {
     width: 150px;
@@ -482,8 +481,7 @@
 }
 
 .sidebarSearch .topicOriginatorIcon .tip {
-    left: 30px;
+    right: 30px;
-    right: auto;
     top: 1px;
 }
 .sidebarSearch .tip {
@@ -506,8 +504,7 @@
 }
 
 .sidebarSearch .mapContributorsIcon .tip {
-    left: 40px;
+    right: 40px;
-    right: auto;
     top: -5px;
     padding-top: 5px;
     padding-bottom: 5px;
@@ -530,7 +527,7 @@
     position: absolute;
     width: 0;
     height: 0;
-    border-right: 4px solid #424242;
+    border-left: 4px solid #424242;
     border-top: 5px solid transparent;
     border-bottom: 5px solid transparent;
 }
@@ -540,20 +537,16 @@
 }
 .sidebarSearch .hoverForTip.addToMap .tip:before {
     right: -4px;
-    border-left: 4px solid #424242;
-    border-right: none;
 }
 
 .sidebarSearch .mapContributorsIcon .tip:before {
-    top: 65px;
+    top: 12px;
-    left: -4px;
+    right: -4px;
-    margin-top: -53px;
 }
 
 .sidebarSearch .topicOriginatorIcon .tip:before {
-    top: 58px;
+    top: 5px;
-    left: -4px;
+    right: -4px;
-    margin-top: -53px;
 }
 
 .sidebarSearch .mapContributorsIcon .mapContributors {
@@ -639,6 +632,18 @@
 	box-shadow: 0 3px 3px rgba(0,0,0,0.23), 0 3px 3px rgba(0,0,0,0.16);
 }
 
+.supportUs.upperRightEl {
+    cursor: pointer;
+    color: #4fc059;
+    font-size: 14px;
+    height: 14px;
+    margin: 9px 8px 9px 0;
+    display: none;
+}
+.homePage .supportUs, .explorePage .supportUs {
+    display: block;
+}
+
 .upperRightMapButtons {
 	position: relative;
 	top: -42px; /* puts it just offscreen */
@@ -705,6 +710,18 @@
 
 /* homepage */
 
+.homeWrapper.homeText {
+    margin-top: 5%;
+}
+
+.fullWidthWrapper {
+    width: 100%;
+}
+.fullWidthWrapper.withVideo {
+    height: 315px;
+    background: #757575;
+}
+
 .homeWrapper {
     position: absolute;
     left: 50%;
@@ -754,7 +771,6 @@
     margin-left:54px;
 }
 
-
 .homeWrapper #new_user {
     margin-left: 48px;
     margin-top: 160px;
@@ -803,6 +819,22 @@
 .homeWrapper #new_user .accountForgotPass {
     margin: 8px 0 0 0;
 }
+.callToAction .learnMoreCTA {
+    background-color: #4fb5c0;
+    margin-bottom: 12px;
+}
+.callToAction .learnMoreCTA:hover {
+    background-color: #419599;
+}
+
+.fullWidthWrapper.withPartners {
+    background: url(homepage_bg_fade.png) no-repeat center -300px;
+}
+.homeWrapper.homePartners {
+    padding: 64px 0 280px;
+    height: 96px;
+    background: url(partner_logos.png) no-repeat 0 64px;
+}
 
 
 /* 204x25  , 170x36 */
@@ -819,6 +851,10 @@
     left: 29px;
 }
 
+.unauthenticated .homePage .infoAndHelp {
+    display:none;
+}
+
 .infoAndHelp {
     position: fixed;
     bottom: 20px;
@@ -1109,6 +1145,23 @@
   border-bottom: 2px solid #00BCD4;
 }
 
+.exploreMapsButton.mapperButton {
+    height: 40px;
+    padding: 0;
+}
+.mapperButton img.exploreMapperImage {
+    float: left;
+    border-radius: 12px;
+    margin-top: 8px;
+    margin-right: 8px;
+}
+.exploreMapperName {
+    white-space: nowrap;
+    float: left;
+    margin-top: 12px;
+}
+
+
 .exploreMapsButton .exploreMapsIcon {
     background-repeat: no-repeat;
     width:32px;

app/assets/stylesheets/uservoice.css

@@ -1,11 +1,20 @@
 /* =USERVOICE ICON DEFINE
 --------------------------------------------------------*/
 
+.unauthenticated .uv-icon {
+	display: none;
+}
+
 div.uv-icon.uv-bottom-left {
+<<<<<<< HEAD
 	background-image:url(support_tab_sprite.png);
+=======
+	background-image:url(feedback_sprite.png);
+	background-repeat: no-repeat;
+>>>>>>> develop
 	color:#FFFFFF;
 	cursor:pointer;
-	height:108px;
+	height:110px;
 	left:0;
 	margin-left:0px;
 	text-indent:-100000px;
@@ -13,7 +22,6 @@ div.uv-icon.uv-bottom-left {
 	width:25px;
 	z-index:100000;	
 	opacity: 1;
-	
 }
 
 div.uv-icon.uv-bottom-left:hover {

app/controllers/main_controller.rb

@@ -13,7 +13,7 @@ class MainController < ApplicationController
     respond_to do |format|
         format.html { 
           if authenticated?
-            @maps = Map.where("maps.user_id = ?", @current.id).order("name ASC").page(1).per(20)
+            @maps = Map.where("maps.permission != ?", "private").order("updated_at DESC").page(1).per(20)
             respond_with(@maps, @current) 
           else 
             respond_with(@current) 

app/controllers/maps_controller.rb

@@ -4,10 +4,9 @@ class MapsController < ApplicationController
 
     autocomplete :map, :name, :full => true, :extra_data => [:user_id]
 
-    # GET /maps/recent
+    # GET /explore/active
-    # GET /maps/featured
+    # GET /explore/featured
-    # GET /maps/new
+    # GET /explore/mapper/:id
-    # GET /maps/mappers/:id
     def index
 
         if request.path == "/explore"
@@ -17,6 +16,7 @@ class MapsController < ApplicationController
         @current = current_user
         @user = nil
         @maps = []
+        @mapperId = nil
 
         if !params[:page] 
             page = 1
@@ -29,7 +29,7 @@ class MapsController < ApplicationController
             @request = "active"
 
         elsif request.path.index("/explore/featured") != nil
-            @maps = Map.where("maps.featured = ? AND maps.permission != ?", true, "private").order("name ASC").page(page).per(20)
+            @maps = Map.where("maps.featured = ? AND maps.permission != ?", true, "private").order("updated_at DESC").page(page).per(20)
             @request = "featured"
 
         elsif request.path.index('/explore/mine') != nil  # looking for maps by me
@@ -37,30 +37,21 @@ class MapsController < ApplicationController
                 redirect_to activemaps_url and return
             end
             # don't need to exclude private maps because they all belong to you
-            @maps = Map.where("maps.user_id = ?", @current.id).order("name ASC").page(page).per(20)
+            @maps = Map.where("maps.user_id = ?", @current.id).order("updated_at DESC").page(page).per(20)
             @request = "you"
 
-        elsif request.path.index('/explore/mappers/') != nil  # looking for maps by a mapper
+        elsif request.path.index('/explore/mapper/') != nil  # looking for maps by a mapper
             @user = User.find(params[:id])
-            @maps = Map.where("maps.user_id = ? AND maps.permission != ?", @user.id, "private").order("name ASC").page(page).per(20)
+            @maps = Map.where("maps.user_id = ? AND maps.permission != ?", @user.id, "private").order("updated_at DESC").page(page).per(20)
-            @request = "other"
+            @request = "mapper"
-
-        elsif request.path.index('/explore/topics/') != nil  # looking for maps by a certain topic they include
-            @topic = Topic.find(params[:id]).authorize_to_show(@current)
-            if !@topic
-                redirect_to featuredmaps_url, notice: "Access denied." and return
-            end
-            @maps = @topic.maps.delete_if {|m| m.permission == "private" && (!authenticated? || (authenticated? && @current.id != m.user_id)) }
-            @request = "topic"
         end
 
         respond_to do |format|
             format.html { 
-                if @request == "you"
+                if @request == "active" && authenticated?
                     redirect_to root_url and return
-                else
-                    respond_with(@maps, @request, @user) 
                 end
+                respond_with(@maps, @request, @user)
             }
             format.json { render json: @maps }
         end

app/controllers/users_controller.rb

@@ -65,6 +65,23 @@ class UsersController < ApplicationController
     end
   end
     
+  # GET /users/:id/details [.json]
+  def details
+    @user = User.find(params[:id])
+    
+    @details = Hash.new
+
+    @details['name'] = @user.name
+    @details['created_at'] = @user.created_at.strftime("%m/%d/%Y")
+    @details['image'] = @user.image.url(:ninetysix)
+    @details['generation'] = @user.generation
+    @details['numSynapses'] = @user.synapses.count
+    @details['numTopics'] = @user.topics.count
+    @details['numMaps'] = @user.maps.count
+
+    render json: @details 
+  end
+
   # PUT /user/updatemetacodes
   def updatemetacodes
     @user = current_user

app/helpers/maps_helper.rb

@@ -18,9 +18,9 @@ module MapsHelper
       contributorTip = ''
       firstContributorImage = '/assets/user.png'
       if m.contributors.count > 0 
-        firstContributorImage = m.contributors[0].image.url(:square)
+        firstContributorImage = m.contributors[0].image.url(:thirtytwo)
         m.contributors.each_with_index do |c, index|
-          userImage = c.image.url(:square)
+          userImage = c.image.url(:thirtytwo)
           name = c.name
           contributorTip += '<li> <img class="tipUserImage" width="25" height="25" src=' + userImage + ' />' + '<span>' + name + '</span> </li>'         
         end

app/helpers/synapses_helper.rb

@@ -25,7 +25,7 @@ module SynapsesHelper
       synapse['permission'] = s.permission
       synapse['mapCount'] = s.maps.count
       synapse['originator'] = s.user.name
-      synapse['originatorImage'] = s.user.image.url(:square)
+      synapse['originatorImage'] = s.user.image.url(:thirtytwo)
       synapse['rtype'] = "synapse"
       
       temp.push synapse

app/helpers/topics_helper.rb

@@ -15,8 +15,10 @@ module TopicsHelper
       topic['mapCount'] = t.maps.count
       topic['synapseCount'] = t.synapses.count
       topic['originator'] = t.user.name
-      topic['originatorImage'] = t.user.image.url(:square)
+      topic['originatorImage'] = t.user.image.url(:thirtytwo)
       topic['rtype'] = "topic"
+      topic['inmaps'] = t.inmaps
+      topic['inmapsLinks'] = t.inmapsLinks
        
       temp.push topic
     end

app/helpers/users_helper.rb

@@ -8,7 +8,7 @@ module UsersHelper
       user['id'] = u.id
       user['label'] = u.name
       user['value'] = u.name
-      user['profile'] = u.image.url(:square)
+      user['profile'] = u.image.url(:sixtyfour)
       user['mapCount'] = u.maps.count
       user['created_at'] = u.created_at.strftime("%m/%d/%Y")
       user['rtype'] = "mapper"

app/models/topic.rb

@@ -54,8 +54,16 @@ class Topic < ActiveRecord::Base
     self.synapses.count
   end
 
+  def inmaps
+    self.maps.map(&:name)
+  end
+
+  def inmapsLinks
+    self.maps.map(&:id)
+  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, :inmapsLinks])
   end
 
   def topic_autocomplete_method

app/models/user.rb

@@ -32,7 +32,10 @@ class User < ActiveRecord::Base
     
   # This method associates the attribute ":image" with a file attachment
   has_attached_file :image, :styles => {
-   :square => ['84x84#', :png]
+   :thirtytwo => ['32x32#', :png],
+   :sixtyfour => ['64x64#', :png],
+   :ninetysix => ['96x96#', :png],
+   :onetwentyeight => ['128x128#', :png]
   },
   :default_url => "/assets/user.png"
     
@@ -42,7 +45,7 @@ class User < ActiveRecord::Base
   def as_json(options={})
     { :id => self.id,
       :name => self.name,
-      :image => self.image.url(:square)
+      :image => self.image.url(:sixtyfour)
     }
   end
   

app/views/layouts/_account.html.erb

@@ -4,7 +4,7 @@
   #%>
 
   <% account = current_user %>
-  <%= image_tag user.image.url(:square), :size => "48x48", :class => "sidebarAccountImage" %>
+  <%= image_tag user.image.url(:sixtyfour), :size => "48x48", :class => "sidebarAccountImage" %>
   <h3 class="accountHeader"><%= account.name.split[0...1][0] %></h3>
   <ul>
     <li class="accountListItem accountSettings">

app/views/layouts/_lightboxes.html.erb

@@ -19,7 +19,7 @@
             <div id="rightAboutParms">
                 <p>PRIVATE BETA</p>
                 <p>2.6 (Catalpa)</p>
-                <p>Nov 23, 2014</p>
+                <p>Dec 3, 2014</p>
             </div>  
             <div class="clearfloat">  
             </div>  
@@ -56,13 +56,13 @@
             </a>
           </li>
           <li>
-            <a id="lightbox_source" href="https://github.com/Connoropolous/metamaps_gen002" target="_blank">
+            <a id="lightbox_source" href="https://github.com/metamaps/metamaps_gen002" target="_blank">
               <div class="lightboxAboutIcon"></div>
               source code
             </a>
           </li>
           <li>
-            <a id="lightbox_term" href="http://metamaps.cc/maps/331" target="_blank">
+            <a id="lightbox_term" data-bypass="true" href="http://metamaps.cc/maps/331" target="_blank">
               <div class="lightboxAboutIcon"></div>
               terms
             </a>

app/views/layouts/_templates.html.erb

@@ -35,6 +35,7 @@
     <p class="mapEditedAt"><span>Last edited:</span> {{updated_at}}</p>
     <div class="mapInfoButtonsWrapper">
       <div class="mapInfoDelete">
+        <div class="deleteMap"></div>
         <span>Delete</span>
       </div>
       <div class="mapInfoShare">
@@ -49,7 +50,7 @@
   <a href="/maps/{{id}}">
   <div class="permission {{editPermission}}"> <!-- must be canEdit or cannotEdit -->
 	  <div class="mapCard">                                                   
-      <span class="title">                                                  
+      <span class="title" title="{{fullName}}">                                                  
         {{name}}
       </span>  
       <div class="mapScreenshot">
@@ -73,11 +74,32 @@
   </a>
     </script>
 
+    <script type="text/template" id="mapperCardTemplate">
+    <div class="mapperCard">                                                    
+      <div class="mapperImage">
+        <img src="{{image}}" width="96" height="96" />
+      </div> 
+      <div class="mapperName" title="{{name}}">                                                  
+        {{name}}
+      </div>
+      <div class="mapperInfo">
+        <div class="mapperCreatedAt">Mapper since: {{created_at}}</div>
+        <div class="mapperGeneration">Generation: {{generation}}</div>
+      </div>
+      <div class="mapperMetadata">
+         <div class="metadataSection metadataMaps"><div>{{numMaps}}</div>maps</div>
+         <div class="metadataSection metadataTopics"><div>{{numTopics}}</div>topics</div> 
+         <div class="metadataSection metadataSynapses"><div>{{numSynapses}}</div>synapses</div> 
+         <div class="clearfloat"></div>                               
+      </div>                                         
+    </div>
+    </script>
+        
     <script type="text/template" id="topicSearchTemplate">
     <div class="result{{rtype}}">
       <div class="topicMetacode">
         <img src="{{typeImageURL}}" class="topicIcon" />
-        <span class="metacodeTip">{{type}}</span>
+        <div class="metacodeTip">{{type}}</div>
       </div>
       <div class="resultText">
         <p class="resultTitle">{{label}}</p>
@@ -95,7 +117,7 @@
         </div>
         <div class="topicOriginatorIcon hoverForTip">
             <img width="18" height="18" src="{{originatorImage}}">
-            <span class="tip topicOriginator">created by {{originator}}</span>
+            <span class="tip topicOriginator">{{originator}}</span>
         </div>
         <div class="topicPermission {{permission}}">
         </div>
@@ -107,7 +129,7 @@
     <script type="text/template" id="mapSearchTemplate">
     <div class="result{{rtype}}">
       <div class="searchResIconWrapper">
-        <img class="icon" src="/assets/metamap32c.png">
+        <img class="icon" src="/assets/metamap36c.png">
       </div>
       <div class="resultText">
         <p class="resultTitle">{{label}}</p>
@@ -209,16 +231,20 @@
                 <div class="metacodeSelect">{{{metacode_select}}}</div>
             </div>
             <div class="linkItem contributor">
-                <img src="/assets/user.png" class="contributorIcon" width="32" height="32" />
+                <a href="/explore/mapper/{{userid}}"><img src="/assets/user.png" class="contributorIcon" width="32" height="32" /></a>
                 <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="linkItem mapCount">                  
                 <div class="mapCountIcon"></div>
                 {{map_count}} 
-               </a> 
+                <div class ="hoverTip">Click to see which maps topic appears on</div>
-            <a href="/topics/{{id}}" class="linkItem synapseCount" title="Click to see this topics synapses">
+                <div class="tip"><ul>{{{inmaps}}}</ul></div>                              
+            </div>
+
+            <a href="/topics/{{id}}" class="linkItem synapseCount">
               <div class="synapseCountIcon"></div>
               {{synapse_count}}
+              <div class="tip">Click to see this topics synapses</div>
             </a>
             <div class="linkItem mapPerm {{mk_permission}}" title="{{permission}}"></div>
             <div class="clearfloat"></div>

app/views/layouts/_upperelements.html.erb

@@ -18,6 +18,7 @@
 </div><!-- end upperLeftUI -->
 
 <div class="upperRightUI">
+    <div class="supportUs upperRightEl openLightbox" data-open="donate">SUPPORT US!</div>
     <div class="mapElement upperRightEl upperRightMapButtons">
             <!-- Realtime -->
             <div class="sidebarCollaborate upperRightEl">
@@ -30,7 +31,7 @@
                     <div class="realtimeMapperList">
                         <ul>
                             <li class="rtMapper littleRtOn rtMapperSelf">
-                                <%= image_tag user.image.url(:square), :size => "24x24", :class => "rtUserImage" %>
+                                <%= image_tag user.image.url(:thirtytwo), :size => "24x24", :class => "rtUserImage" %>
                                 <%= user.name %> (me)
                                 <div class="littleJuntoIcon"></div>
                             </li>
@@ -63,7 +64,7 @@
     <div class="sidebarAccount upperRightEl">
         <div class="sidebarAccountIcon">
               <div class="tooltipsUnder">Account</div>
-              <%= image_tag user.image.url(:square), :size => "32x32" %>
+              <%= image_tag user.image.url(:thirtytwo), :size => "32x32" %>
         </div>
         <div class="sidebarAccountBox upperRightBox">
             <%= render :partial => 'layouts/account' %>

app/views/layouts/application.html.erb

@@ -66,7 +66,7 @@
   <![endif]-->
 </head>
 
-<body data-env="<%= Rails.env %>">
+<body data-env="<%= Rails.env %>" class="<%= authenticated? ? "authenticated" : "unauthenticated" %>">
 
     <% if devise_error_messages? %>
       <p id="toast"><%= devise_error_messages! %></p>
@@ -74,7 +74,7 @@
       <p id="toast"><%= notice %></p>
     <% end %>
 
-    <%= content_tag :div, class: authenticated? ? "main authenticated" : "main unauthenticated" do %>
+    <%= content_tag :div, class: "main" do %>
 
         <% classes = action_name == "home" ? "homePage" : ""
            classes += action_name == "home" && authenticated? ? " explorePage" : ""

app/views/main/home.html.erb

@@ -7,6 +7,7 @@
 <% if !authenticated? %>
     <% content_for :title, "Home | Metamaps" %> 
     <div id="yield">
+<<<<<<< HEAD
         <div class="homeWrapper">
                 <div class="homeTextWrapper">
                   <div class="homeLogo"></div>
@@ -47,14 +48,46 @@
                 <div class="clearfloat"></div>
         </div>
     </div><!-- end yield -->                  
+=======
+        <div class="homeWrapper homeText">
+            <div class="homeTitle">Make Sense with Metamaps</div>
+            <div class="homeIntro">
+            <span class="green din-medium">METAMAPS.CC</span> is a free and open source platform that supports real-time sense-making, distributed collaboration, and the creative intelligence of individuals, organizations and communities. We are currently in an <span class="din-medium">invite-only beta.</span>
+            </div>
+        </div>
+        <div class="fullWidthWrapper withVideo">
+            <div class="homeWrapper">
+                <iframe class="homeVideo" src="//player.vimeo.com/video/113154814" width="560" height="315" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
+                <div class="callToAction">
+                    <h3>Who finds it useful?</h3>
+                    <p>Designers, inventors, artists, educators, strategists, consultants, facilitators, entrepreneurs, systems thinkers, changemakers, analysts, students, researchers... maybe you!</p>
+                    <button type="button" class="button learnMoreCTA" onclick="Metamaps.GlobalUI.openLightbox('about');">LEARN MORE</button>
+                    <a href="/explore/featured" class="exploreFeaturedCTA">EXPLORE FEATURED MAPS</a>
+                    <a href="/request" class="requestInviteCTA" data-bypass="true">REQUEST INVITE</a>
+                </div>
+                <div class="clearfloat"></div>
+            </div>
+        </div>
+        <div class="fullWidthWrapper withPartners">
+            <div class="homeWrapper homePartners">
+                <% # our partners %>
+            </div>
+        </div>
+    </div><!-- end yield -->
+    <div class="github-fork-ribbon-wrapper right-bottom">
+        <div class="github-fork-ribbon">
+            <a href="https://github.com/metamaps/metamaps_gen002" target="_blank">Fork me on GitHub</a>
+        </div>
+    </div>                     
+>>>>>>> develop
     <script>
     Metamaps.currentSection = "";
     Metamaps.currentPage = "";
     </script>
 <% elsif authenticated? %>
-    <% content_for :title, "My Maps | Metamaps" %> 
+    <% content_for :title, "Explore Active Maps | Metamaps" %> 
     <script>
-    Metamaps.Maps.Mine = <%= @maps.to_json.html_safe %>;
+    Metamaps.Maps.Active = <%= @maps.to_json.html_safe %>;
     Metamaps.currentSection = "";
     Metamaps.currentPage = "";
     Metamaps.GlobalUI.Search.isOpen = true;

app/views/maps/_mapinfobox.html.erb

@@ -15,16 +15,16 @@
       <% if @map.contributors.count == 0 %>
         <img id="mapContribs" width="25" height="25" src="/assets/user.png" />
       <% elsif @map.contributors.count == 1 %>
-        <img id="mapContribs" width="25" height="25" src="<%= @map.contributors[0].image.url(:square) %>" />
+        <img id="mapContribs" width="25" height="25" src="<%= @map.contributors[0].image.url(:thirtytwo) %>" />
       <% elsif @map.contributors.count == 2 %>
-        <img id="mapContribs" width="25" height="25" src="<%= @map.contributors[0].image.url(:square) %>" class="multiple mTwo" />
+        <img id="mapContribs" width="25" height="25" src="<%= @map.contributors[0].image.url(:thirtytwo) %>" class="multiple mTwo" />
       <% elsif @map.contributors.count > 2 %>
-        <img id="mapContribs" width="25" height="25" src="<%= @map.contributors[0].image.url(:square) %>" class="multiple" />
+        <img id="mapContribs" width="25" height="25" src="<%= @map.contributors[0].image.url(:thirtytwo) %>" class="multiple" />
       <% end %>
       <span><%= @map.contributors.count %></span>
       <div class="tip"> <ul><% @map.contributors.each_with_index do |c, index| %>
-           <li > <img class="rtUserImage" width="25" height="25" src="<%= c.image.url(:square) %>"  />
+           <li ><a href="/explore/mapper/<%= c.id %>" > <img class="rtUserImage" width="25" height="25" src="<%= c.image.url(:thirtytwo) %>"  />
-            <%= c.name %> 
+            <%= c.name %></a> 
             </li>         
         <% end %></ul></div>
     </div>
@@ -51,6 +51,7 @@
     <p class="mapEditedAt"><span>Last edited:</span> <%= @map.updated_at.strftime("%m/%d/%Y") %></p>
     <div class="mapInfoButtonsWrapper">
       <div class="mapInfoDelete">
+        <div class="deleteMap"></div>
         <span>Delete</span>
       </div>
       <div class="mapInfoShare">

app/views/maps/index.html.erb

@@ -4,15 +4,31 @@
   # TODO: What url is this accessible at?
   #%>
   
-<% content_for :title, "Explore Maps | Metamaps" %>
+
 
 <script>
-    <% if @request == "active" %>
+    <% if @request == "you" %>
-      Metamaps.Maps.Active = <%= @maps.to_json.html_safe %>;
+      Metamaps.Maps.Mine = <%= @maps.to_json.html_safe %>;
-      Metamaps.currentPage = "active";
+      Metamaps.currentPage = "mine";
+      <% content_for :title, "Explore My Maps | Metamaps" %>
+
     <% elsif @request == "featured" %>
       Metamaps.Maps.Featured = <%= @maps.to_json.html_safe %>;
       Metamaps.currentPage = "featured";
+      <% content_for :title, "Explore Featured Maps | Metamaps" %>
+
+    <% elsif @request == "active" %>
+      Metamaps.Maps.Active = <%= @maps.to_json.html_safe %>;
+      Metamaps.currentPage = "active";
+      <% content_for :title, "Explore Active Maps | Metamaps" %>
+
+    <% elsif @request == "mapper" %>
+      Metamaps.Maps.Mapper = {
+        models: <%= @maps.to_json.html_safe %>,
+        id: <%= params[:id] %>
+      };
+      Metamaps.currentPage = "mapper";
+      <% content_for :title, @user.name + " | Metamaps" %>
     <% end %>
     Metamaps.currentSection = "explore";
     Metamaps.GlobalUI.Search.isOpen = true;

app/views/shared/_cheatsheet.html.erb

@@ -142,10 +142,10 @@
 </div>
 
 <div id="tutorials">
-    <iframe id="tutorialVideo" src="//player.vimeo.com/video/88334167" width="552" height="326" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
+    <iframe id="tutorialVideo" src="//player.vimeo.com/video/88334167" width="552" height="320" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
     <div class="tutorialItem active" id="gettingStarted">1. GETTING STARTED</div>
-    <div class="tutorialItem" id="upYourSkillz">2. UP YOUR SKILLZ</div>
+    <div class="tutorialItem disable" id="upYourSkillz">2. UP YOUR SKILLZ</div>
-    <div class="tutorialItem" id="advancedMapping">3. ADVANCED MAPPING</div>
+    <div class="tutorialItem disable" id="advancedMapping">3. ADVANCED MAPPING</div>
 </div>
 
 <div id="moreResources">

app/views/shared/_filterBox.html.erb

@@ -81,7 +81,7 @@
     end 
     @mappers.each_with_index do |mapper, index| 
         @mapperlist += '<li data-id="' + mapper.id.to_s + '">'
-        @mapperlist += '<img src="' + mapper.image.url(:square) + '" data-id="' + mapper.id.to_s + '" alt="' + mapper.name + '" />'
+        @mapperlist += '<img src="' + mapper.image.url(:sixtyfour) + '" data-id="' + mapper.id.to_s + '" alt="' + mapper.name + '" />'
         @mapperlist += '<p>' + mapper.name + '</p></li>'
     end
   end

app/views/shared/_metacodeoptions.html.erb

@@ -13,7 +13,7 @@
     	<% set.metacodes.sort { |a, b| a.name <=> b.name }.each do |m| %>
 		  <li data-id="<%= m.id.to_s %>">
 		    <img width="24" height="24" src="<%= m.icon %>" alt="<%= m.name %>" />
-		    <span class="mSelectName"><%= m.name %></span>
+		    <div class="mSelectName"><%= m.name %></div>
 		    <div class="clearfloat"></div>
 		  </li>
 		<% end %>
@@ -27,7 +27,7 @@
   		<% Metacode.order("name").all.each do |m| %>
 		  <li data-id="<%= m.id.to_s %>">
 		    <img width="24" height="24" src="<%= m.icon %>" alt="<%= m.name %>" />
-		    <span class="mSelectName"><%= m.name %></span>
+		    <div class="mSelectName"><%= m.name %></div>
 		    <div class="clearfloat"></div>
 		  </li>
 		<% end %>

app/views/users/edit.html.erb

@@ -10,7 +10,7 @@
   <h3>Edit Account</h3>
   <div class="userImage">
     <div class="userImageDiv" onclick="Metamaps.Account.toggleChangePicture()">
-      <%= image_tag @user.image.url(:square), :size => "84x84" %>
+      <%= image_tag @user.image.url(:ninetysix), :size => "84x84" %>
       <div class="editPhoto"></div>
     </div>
     <div class="userImageMenu">

buildpackswithphantom.txt

@@ -1,2 +0,0 @@
-https://github.com/heroku/heroku-buildpack-ruby.git
-https://github.com/stomita/heroku-buildpack-phantomjs.git

config/routes.rb

@@ -21,8 +21,7 @@ Metamaps::Application.routes.draw do
   match 'explore/active', to: 'maps#index', via: :get, as: :activemaps
   match 'explore/featured', to: 'maps#index', via: :get, as: :featuredmaps
   match 'explore/mine', to: 'maps#index', via: :get, as: :mymaps
-  match 'maps/mappers/:id', to: 'maps#index', via: :get, as: :usermaps
+  match 'explore/mapper/:id', to: 'maps#index', via: :get, as: :usermaps
-  match 'maps/topics/:id', to: 'maps#index', via: :get, as: :topicmaps
   resources :maps, except: [:new, :edit]
   match 'maps/:id/contains', to: 'maps#contains', via: :get, as: :contains
   match 'maps/:id/upload_screenshot', to: 'maps#screenshot', via: :post, as: :screenshot
@@ -36,6 +35,7 @@ Metamaps::Application.routes.draw do
     get 'join' => 'devise/registrations#new', :as => :new_user_registration
   end
 
+  match 'users/:id/details', to: 'users#details', via: :get, as: :details
   match 'user/updatemetacodes', to: 'users#updatemetacodes', via: :post, as: :updatemetacodes
   resources :users, except: [:index, :destroy]
 end

public/famous/main.js

@@ -27,11 +27,34 @@ Metamaps.Famous.build = function () {
 
     // INFOVIS
     f.viz = {};
+
+    var instructions = {
+        addTopic: "Double-click to<br>add a topic!",
+        tabKey: "Use Tab & Shift+Tab to select a metacode",
+        enterKey: "Press Enter to add the topic"
+    };
+
     f.viz.surf = new Surface({
         size: [undefined, undefined],
         classes: [],
         properties: {
-            display: 'none'
+            display: "none",
+            zIndex: "1"
+        }
+    });
+
+    var instrShowing = false;
+    f.viz.instrSurf = new Surface({
+        content: instructions.addTopic,
+        size: [220, 80],
+        classes: ["doubleClickSurf"],
+        properties: {
+            fontFamily: "'din-regular', helvetica, sans-serif",
+            fontSize: "32px",
+            display: "none",
+            textAlign: "center",
+            color: "#999999",
+            zIndex: "0"
         }
     });
     var prepare = function () {
@@ -62,8 +85,20 @@ Metamaps.Famous.build = function () {
             }
         );
     };
-    f.mainContext.add(f.viz.mod).add(f.viz.surf);
+    f.viz.isInstrShowing = function() {
-
+        return instrShowing;
+    }
+    f.viz.showInstructions = function() {
+        instrShowing = true;
+        f.viz.instrSurf.setProperties({ "display":"block" });
+    };
+    f.viz.hideInstructions = function() {
+        instrShowing = false;
+        f.viz.instrSurf.setProperties({ "display":"none" });
+    };
+    var vizMod = f.mainContext.add(f.viz.mod);
+    vizMod.add(f.viz.surf);
+    vizMod.add(f.viz.instrSurf);
     
     // CONTENT / OTHER PAGES
     f.yield = {};
@@ -198,19 +233,24 @@ Metamaps.Famous.build = function () {
             var capitalize = Metamaps.currentPage.charAt(0).toUpperCase() + Metamaps.currentPage.slice(1);
 
             Metamaps.Views.exploreMaps.setCollection( Metamaps.Maps[capitalize] );
+            if (Metamaps.currentPage === "mapper") {
+                Metamaps.Views.exploreMaps.fetchUserThenRender();
+            }
+            else {
                 Metamaps.Views.exploreMaps.render();
+            }
             f.maps.show();
-            f.explore.set(Metamaps.currentPage);
+            f.explore.set(Metamaps.currentPage, Metamaps.Maps.Mapper.mapperId);
             f.explore.show();   
         }
         else if (Metamaps.currentSection === "") {
             Metamaps.Loading.hide();
             if (Metamaps.Active.Mapper) {
 
-                Metamaps.Views.exploreMaps.setCollection( Metamaps.Maps.Mine );
+                Metamaps.Views.exploreMaps.setCollection( Metamaps.Maps.Active );
                 Metamaps.Views.exploreMaps.render();
                 f.maps.show();
-                f.explore.set('mine');
+                f.explore.set('active');
                 f.explore.show();
             }
             else f.explore.set('featured');
@@ -247,9 +287,33 @@ Metamaps.Famous.build = function () {
             { duration: 300, curve: 'easeIn' }
         );
     };
-    f.explore.set = function (section) {
+    f.explore.set = function (section, mapperId) {
         var loggedIn = Metamaps.Active.Mapper ? 'Auth' : '';
+        
+
+        if (section === "mine" || section === "active" || section === "featured") {
             f.explore.surf.setContent(templates[section + loggedIn + 'Content']);
+        }
+        else if (section === "mapper") {
+
+            var setMapper = function(mapperObj) {
+                var mapperContent;
+                mapperContent = "<div class='exploreMapsButton active mapperButton'><img class='exploreMapperImage' width='24' height='24' src='" + mapperObj.image + "' />";
+                mapperContent += "<div class='exploreMapperName'>" + mapperObj.name + "'s Maps</div><div class='clearfloat'></div></div>";
+
+                f.explore.surf.setContent(mapperContent);
+            };
+
+            $.ajax({
+                url: "/users/" + mapperId + ".json",
+                success: function (response) {
+                    setMapper(response);
+                },
+                error: function () {
+                    
+                }
+            });
+        }
     };
     var exploreMod = f.mainContext.add(f.explore.mod);
     exploreMod.add(new Modifier({
@@ -300,6 +364,7 @@ Metamaps.Famous.build = function () {
         if (message) {
             Metamaps.GlobalUI.notifyUser(message);
             f.toast.surf.deploy(f.toast.surf._currTarget);
+            f.toast.surf.removeListener('deploy', initialToast);
         }
     };
     f.toast.surf.on('deploy', initialToast);

public/famous/templates.js

@@ -17,16 +17,16 @@ t.logoContent += '</ul>';
   t.featuredContent += '<a href="/explore/featured" class="active featuredMaps exploreMapsButton"><div class="exploreMapsIcon"></div>Featured Maps</a>';
 
 /* logged in explore maps bars */
-  t.mineAuthContent = '<a href="/" class="active myMaps exploreMapsButton"><div class="exploreMapsIcon"></div>My Maps</a>';
+  t.mineAuthContent = '<a href="/explore/mine" class="active myMaps exploreMapsButton"><div class="exploreMapsIcon"></div>My Maps</a>';
-  t.mineAuthContent += '<a href="/explore/active" class="activeMaps exploreMapsButton"><div class="exploreMapsIcon"></div>Recently Active</a>';
+  t.mineAuthContent += '<a href="/" class="activeMaps exploreMapsButton"><div class="exploreMapsIcon"></div>Recently Active</a>';
   t.mineAuthContent += '<a href="/explore/featured" class="featuredMaps exploreMapsButton"><div class="exploreMapsIcon"></div>Featured</a>';
 
-  t.activeAuthContent = '<a href="/" class="myMaps exploreMapsButton"><div class="exploreMapsIcon"></div>My Maps</a>';
+  t.activeAuthContent = '<a href="/explore/mine" class="myMaps exploreMapsButton"><div class="exploreMapsIcon"></div>My Maps</a>';
-  t.activeAuthContent += '<a href="/explore/active" class="active activeMaps exploreMapsButton"><div class="exploreMapsIcon"></div>Recently Active</a>';
+  t.activeAuthContent += '<a href="/" class="active activeMaps exploreMapsButton"><div class="exploreMapsIcon"></div>Recently Active</a>';
   t.activeAuthContent += '<a href="/explore/featured" class="featuredMaps exploreMapsButton"><div class="exploreMapsIcon"></div>Featured</a>';
 
-  t.featuredAuthContent = '<a href="/" class="myMaps exploreMapsButton"><div class="exploreMapsIcon"></div>My Maps</a>';
+  t.featuredAuthContent = '<a href="/explore/mine" class="myMaps exploreMapsButton"><div class="exploreMapsIcon"></div>My Maps</a>';
-  t.featuredAuthContent += '<a href="/explore/active" class="activeMaps exploreMapsButton"><div class="exploreMapsIcon"></div>Recently Active</a>';
+  t.featuredAuthContent += '<a href="/" class="activeMaps exploreMapsButton"><div class="exploreMapsIcon"></div>Recently Active</a>';
   t.featuredAuthContent += '<a href="/explore/featured" class="active featuredMaps exploreMapsButton"><div class="exploreMapsIcon"></div>Featured</a>';
 
     module.exports = t;