introduced the metamaps.router

app/assets/javascripts/application.js

@@ -17,4 +17,5 @@
 //= require ./orderedLibraries/backbone
 //= require_directory ./librariesForAllPages
 //= require ./metamaps/Metamaps.GlobalUI
+//= require ./metamaps/Metamaps.Router
 //= require ./metamaps/Metamaps.Backbone

app/assets/javascripts/metamaps/JIT.js

@@ -3083,7 +3083,7 @@ var Canvas;
       ctx.fillStyle = Metamaps.Settings.colors.background;
       var xPoint = (-(canvas.width/scale)/2) - (base.translateOffsetX/scale),
         yPoint = (-(canvas.height/scale)/2) - (base.translateOffsetY/scale);
-      ctx.fillRect(xPoint,yPoint,canvas.width/scale,canvas.height/scale);
+      //ctx.fillRect(xPoint,yPoint,canvas.width/scale,canvas.height/scale);
     }
   });
   // END METAMAPS CODE
@@ -6302,13 +6302,15 @@ var EdgeHelper = {
             maxPosX = max(posFrom.x, posTo.x),
             minPosY = min(posFrom.y, posTo.y),
             maxPosY = max(posFrom.y, posTo.y);
-        
+          
         if(pos.x >= minPosX && pos.x <= maxPosX 
             && pos.y >= minPosY && pos.y <= maxPosY) {
           if(Math.abs(posTo.x - posFrom.x) <= epsilon) {
+            
             return true;
           }
           var dist = (posTo.y - posFrom.y) / (posTo.x - posFrom.x) * (pos.x - posFrom.x) + posFrom.y;
+            
           return Math.abs(dist - pos.y) <= epsilon;
         }
         return false;

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

@@ -413,9 +413,14 @@ Metamaps.JIT = {
                     Metamaps.JIT.edgeRender(adj, canvas)
                 },
                 'contains': function (adj, pos) {
-                    var from = adj.nodeFrom.pos.getc(true),
-                        to = adj.nodeTo.pos.getc(true);
-
+                    var from = adj.nodeFrom.pos.getc(),
+                        to = adj.nodeTo.pos.getc();
+                    
+                    // this fixes an issue where when edges are perfectly horizontal or perfectly vertical
+                    // it becomes incredibly difficult to hover over them
+                    if (-1 < pos.x && pos.x < 1) pos.x = 0;
+                    if (-1 < pos.y && pos.y < 1) pos.y = 0;
+                    
                     return $jit.Graph.Plot.edgeHelper.line.contains(from, to, pos, adj.Edge.epsilon);
                 }
             }
@@ -808,12 +813,14 @@ Metamaps.JIT = {
             tempInit = false;
         } else if (!tempInit && node && !node.nodeFrom) {
             // this means you dragged an existing node, autosave that to the database
-            mapping = node.getData('mapping');
-            mapping.set({
-                xloc: node.getPos().x,
-                yloc: node.getPos().y
-            });
-            mapping.save();
+            if (Metamaps.Active.Map) {
+                mapping = node.getData('mapping');
+                mapping.set({
+                    xloc: node.getPos().x,
+                    yloc: node.getPos().y
+                });
+                mapping.save();
+            }
         }
     }, //onDragEndTopicHandler
     canvasClickHandler: function (canvasLoc, e) {

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

@@ -0,0 +1,35 @@
+(function () {
+    var Router = Backbone.Router.extend({
+        routes: {
+            "": "home", // #home
+            "explore/:section": "explore", // #explore/active
+            "maps/:id": "maps" // #maps/7
+        },
+        explore: function (section) {
+            console.log(section);
+        },
+        maps: function (id) {
+            console.log(id);
+        }
+    });
+    Metamaps.Router = new Router();
+    Metamaps.Router.init = function () {
+        Backbone.history.start({
+            pushState: true,
+            root: ''
+        });
+        console.log('router started');
+        $(document).on("click", "a:not([data-bypass])", function (evt) {
+            var href = {
+                prop: $(this).prop("href"),
+                attr: $(this).attr("href")
+            };
+            var root = location.protocol + "//" + location.host + Backbone.history.options.root;
+
+            if (href.prop && href.prop.slice(0, root.length) === root) {
+                evt.preventDefault();
+                Backbone.history.navigate(href.attr, true);
+            }
+        });
+    }
+})();

app/assets/stylesheets/application.css

@@ -88,7 +88,6 @@ body,
 .wrapper,
 #container {
     height: 100%;
-    overflow: hidden;
 }
 .unauthenticated .wrapper.homePage {
     overflow: auto;
@@ -96,6 +95,9 @@ body,
 .wrapper.homePage {
     background: url('mm-homepage-bg-image.png') no-repeat center -249px;
 }
+body.mapBody {
+    overflow: hidden;
+}
 /* scrollbar override */
 
 .maps > div > div.mCS_no_scrollbar {
@@ -111,7 +113,7 @@ body,
     width: auto;
 }
 html {} body {
-    background: url(background2-for-repeating.jpg);
+    background: #E5E5E5;
     font-family: 'LatoLight', helvetica, sans-serif;
     color: #FFF;
 }
@@ -196,6 +198,7 @@ input[type="submit"]:hover {
 /*#barometer_tab {
     display: none;
 }*/
+
 #saveMapLayout {
     display: none;
 }
@@ -557,7 +560,7 @@ label[for="user_remember_me"] {
 /* account */
 
 .sidebarAccount {
-    position: absolute;
+    position: fixed;
     top: 10px;
     right: 10px;
     z-index: 200;
@@ -683,7 +686,7 @@ li.accountInvite span {
 /* Save To New Map */
 
 .sidebarFork {
-    position: absolute;
+    position: fixed;
     top: 10px;
     right: 120px;
     z-index: 200;
@@ -869,7 +872,7 @@ h3.filterByMetacode {
 /* collaborate */
 
 .sidebarCollaborate {
-    position: absolute;
+    position: fixed;
     top: 10px;
     right: 200px;
     z-index: 200;
@@ -949,17 +952,36 @@ h3.realtimeBoxTitle {
 
 /* search */
 
-.sidebarSearch {
-    position: absolute;
+.homeButton {
+    position: fixed;
     top: 10px;
     left: 10px;
+    width: 35px;
+    height: 35px;
+    z-index: 200;
+    background: white;
+    border-top-left-radius: 2px;
+    border-bottom-left-radius: 2px;
+}
+
+.homeButton a {
+    display:block;
+    width: 35px;
+    height: 35px;
+}
+
+.sidebarSearch {
+    position: fixed;
+    top: 10px;
+    left: 45px;
     height: 35px;
     z-index: 200;
 }
 .sidebarSearchIcon {
     float: left;
     width: 80px;
-    border-radius: 2px;
+    border-top-right-radius: 2px;
+    border-bottom-right-radius: 2px;
     height: 35px;
     background: #00BCD4 url('search_icon_32x32.png') no-repeat center center;
     background-size: 25px 25px;
@@ -1269,7 +1291,7 @@ h3.realtimeBoxTitle {
 }
 #cards {
     height: 100%;
-    width: 805px;
+    width: 90%;
     margin: 0 auto;
 }
 #cards p.empty {
@@ -2236,8 +2258,6 @@ div.mapInfoStat {
     height: 100%;
     overflow: hidden;
 }
-
-
 .addMap {
     display: block;
     position: fixed;
@@ -2257,12 +2277,12 @@ div.mapInfoStat {
     display: block;
     position: fixed;
     bottom: 10px;
-    left:50%;
-    margin-left:-55px;
+    left: 50%;
+    margin-left: -55px;
     z-index: 15000;
 }
-#logo a {
-    color: #FFF;
+#logo {
+    color: #6B6B6B;
     font-family: "vinyl", sans-serif;
     font-style: italic;
     text-transform: uppercase;

app/controllers/main_controller.rb

@@ -14,7 +14,8 @@ class MainController < ApplicationController
       @maps = Map.find_all_by_featured(true).shuffle!
       @maps = @maps.slice(0,3)
     elsif authenticated?
-      @maps = Map.order("updated_at DESC").where("permission != ?", "private").limit(3)
+      #@maps = Map.order("updated_at DESC").where("permission != ?", "private").limit(3)
+      @maps = Map.order("name ASC").find_all_by_user_id(@current.id)
     end
     
     respond_with(@maps, @current) 

app/views/layouts/_account.html.erb

@@ -7,7 +7,6 @@
   <% account = current_user %>
   <h3 class="accountHeader">Hello <%= account.name.split[0...1][0] %>!</h3>
   <ul>
-    <li class="accountIcon accountMaps"><a href="/maps/mappers/<%= account.id %>">My Maps</a></li>
     <li class="accountIcon accountSettings"><%= link_to "Account", edit_user_url(account) %></li>
     <% if account.admin %>
       <li class="accountIcon accountAdmin"><%= link_to "Admin", metacodes_path %></li>

app/views/layouts/application.html.erb

@@ -34,7 +34,11 @@
     <%= content_tag :div, class: authenticated? ? "main authenticated" : "main unauthenticated" do %>
 
         <div class="wrapper <%= controller_name == "main" && action_name == "home" ? "homePage" : "" %>" id="wrapper">
-
+            
+            <div class="homeButton">
+                <a href="/"></a>    
+            </div>
+            
             <div class="sidebarSearch">
                 <div class="sidebarSearchIcon"></div>
                 <input type="text" class="sidebarSearchField"></input>
@@ -58,7 +62,7 @@
         </div>
 
         <div class="footer">
-            <div id="logo"><%= link_to "metamaps", root_url %></div>
+            <div id="logo">METAMAPS</div>
         </div>
 
     <% end %>

app/views/main/home.html.erb

@@ -6,7 +6,7 @@
   
 <% content_for :title, "Home | Metamaps" %>   
   
-  
+<% if !authenticated? %>
 <div id="preloaded-images">
    <img src="/assets/metacodes75ms300x300.gif" width="128 height="128" alt="Image 01" />
 </div>  
@@ -16,15 +16,10 @@
 <div class="home_content">
 <div class="home_desc">
   <div class="welcomeTo">
-    <% if !authenticated? %>  
       Welcome to Metamaps
-    <% elsif authenticated? %>
-      Welcome back, <%= @current.name.split[0...1][0] %>!
-    <% end %>
   </div>
   <img id="homeMapImage" src="/assets/metamap128x128.png" width="128" height="128" />
   
-  <% if !authenticated? %>
     <div class="metamapsIs">
       a home on the web for <span class="swapWord">
         <ul class="texts">
@@ -41,21 +36,14 @@
         </ul>
       </span>
     </div>
-  <% end %>
 </div>
 <div class="clearfloat"></div>
 
 <p class="contact">
-  <% if !authenticated? %>
     <a href="/request" class="request button">Request Invite</a>
     <a href="#" class="learnmore button openLightbox" data-open="about">Learn More</a>
-  <% end %>
   <div class="featuredMaps">
-    <% if !authenticated? %>
       explore featured maps from our community
-    <% elsif authenticated? %>
-      explore recently active maps
-    <% end %>
   </div>
 </p>
 
@@ -80,8 +68,7 @@
 </div>
 
 </div>
-
-
+                         
 <script>
 
 $(document).ready(function() {
@@ -108,4 +95,50 @@ $(document).ready(function() {
 });
 
 
-</script>
+</script>
+
+<% elsif authenticated? %>
+  <div class="mapOrder">
+    <span class="displaying">Displaying:</span>
+    <div class="whichMaps">
+   
+      <a href="/explore/active">Recently Active</a> /
+      <a href="/explore/featured">Featured</a> /
+      <a href="/explore/new">Newest First</a>
+         / <a href="/maps/mappers/<%= @current.id %>" class="active">Yours</a>
+    </div>
+    <div class="clearfloat"></div>
+  </div>
+
+<div class="mapsWrapper">
+  <div class="maps" id="cards">
+    <% @maps.each do |map| %>
+      <%= render map %>
+    <% end %>
+    <div class="clearfloat"></div>
+  </div>
+</div>
+
+<script>
+$(document).ready(function() {
+  $('.authenticated div.permission.canEdit .best_in_place').best_in_place();
+  
+  $('.scroll').each(function(index) {
+    $(this).height( $(this).height() ).mCustomScrollbar();
+  });
+  
+  // when you change the title, make sure that the description doesn't overflow
+  $('.best_in_place_name').bind('ajax:success', function() {
+    var p = $(this).parents('.mapCard').find('.scroll');
+    p.height( p.height() ).mCustomScrollbar('update');
+  });
+  
+  // when you change the description, update the scroll box field
+  $('.best_in_place_desc').bind('ajax:success', function() {
+    var s = $(this).parents('.scroll');
+    s.height( s.height() ).mCustomScrollbar('update');
+  });
+});
+</script>
+<% end %>
+                        

app/views/main/requestinvite.html.erb

@@ -8,10 +8,6 @@
   
 <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>
 
-<h1 class="index">
-  Request Invite
-</h1>
-
 <script>
 $(document).ready(function() {
   $('.requestInvite').height( (parseInt($('body').height()) - 40) ); 

app/views/maps/_map.html.erb

@@ -20,7 +20,7 @@
          <div class="linkItem topicCount"><%= map.topics.count %></div>                 
          <div class="linkItem synapseCount"><%= map.synapses.count %></div>         
          <div class="linkItem mapPerm <%= map.mk_permission %>"></div>             
-         <a href="/maps/<%= map.id %>" class="linkItem topicPopout" title="Open Map in New Tab" target="_blank"></a>
+         <a href="/maps/<%= map.id %>" class="linkItem topicPopout"></a>
          <div class="clearfloat"></div>                                     
       </div>                                                                
       <div class="scroll">                                                    

app/views/maps/index.html.erb

@@ -56,9 +56,5 @@ $(document).ready(function() {
     var s = $(this).parents('.scroll');
     s.height( s.height() ).mCustomScrollbar('update');
   });
-
-  $('.mapsWrapper').height( (parseInt($('body').height()) - 39) );
-  var s = $('.maps');
-  s.height( s.height() ).mCustomScrollbar();
 });
 </script>