layout tweaks (#607)

* new map creation pops to new window

* hide the search on logged out homepage

* add { }

* just writing the same code better

* remove that old code

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

@@ -484,6 +484,9 @@ Metamaps.GlobalUI.Search = {
         }
     },
     close: function (closeAfter, bypass) {
+        // for now
+        return
+
         var self = Metamaps.GlobalUI.Search;
 
         self.timeOut = setTimeout(function () {

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

@@ -438,9 +438,23 @@ Metamaps.Map.InfoBox = {
 
     self.attachEventListeners() 
 
-    
-
     self.generateBoxHTML = Hogan.compile($('#mapInfoBoxTemplate').html())
+    
+    var querystring = window.location.search.replace(/^\?/, '')
+    if (querystring == 'new') { 
+      self.open()
+      window.setTimeout(self.requestMapTitle, 3000)
+    }
+  },
+  requestMapTitle: function () {
+    var t = prompt('Please enter a name for your map. You can also set it any time using the map info panel.')
+ 
+    if (t) {
+      Metamaps.Active.Map.set('name', t)
+      Metamaps.Active.Map.save()
+      $('#mapInfoName span').text(t)
+      document.title = t + ' | Metamaps'
+    }
   },
   toggleBox: function (event) {
     var self = Metamaps.Map.InfoBox

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

@@ -93,7 +93,9 @@ Metamaps.Realtime = {
       })
       self.room.videoAdded(self.handleVideoAdded)
 
-      self.room.chat.$container.hide()
+      if (!Metamaps.Active.Map) {
+        self.room.chat.$container.hide()
+      }
       $('body').prepend(self.room.chat.$container)
     } // if Metamaps.Active.Mapper
   },

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

@@ -66,7 +66,7 @@
         Metamaps.GlobalUI.hideDiv('#exploreMaps')
         Metamaps.GlobalUI.showDiv('#yield')
         Metamaps.GlobalUI.Search.unlock()
-        Metamaps.GlobalUI.Search.close(0, true)
+        //Metamaps.GlobalUI.Search.close(0, true)
         Metamaps.Router.timeoutId = setTimeout(navigate, 500)
       }
 
@@ -187,8 +187,8 @@
       Metamaps.Topic.end()
       Metamaps.Active.Topic = null
 
-      Metamaps.GlobalUI.Search.unlock()
+      //Metamaps.GlobalUI.Search.unlock()
-      Metamaps.GlobalUI.Search.close(0, true)
+      //Metamaps.GlobalUI.Search.close(0, true)
 
       Metamaps.Loading.show()
       Metamaps.Map.end()
@@ -219,8 +219,8 @@
       Metamaps.Map.end()
       Metamaps.Active.Map = null
 
-      Metamaps.GlobalUI.Search.unlock()
+      //Metamaps.GlobalUI.Search.unlock()
-      Metamaps.GlobalUI.Search.close(0, true)
+      //Metamaps.GlobalUI.Search.close(0, true)
 
       Metamaps.Topic.end()
       Metamaps.Topic.launch(id)

app/assets/stylesheets/clean.css.erb

@@ -110,8 +110,6 @@
 	top: 10px;
 	left: 24px;
 	z-index:3;
-	box-shadow: 0px 1px 1.5px rgba(0,0,0,0.12), 0 1px 1px rgba(0,0,0,0.24);
-	border-radius: 2px;
 }
 .explorePage .upperLeftUI {
 	box-shadow: none;
@@ -121,23 +119,21 @@
     display:none;
 }
 .homeButton {
-	width: 40px;
-    height: 32px;
-    background-color: #757575;
-    background-image: url(<%= asset_data_uri('home_light.png') %>);
-    background-repeat: no-repeat;
-    background-position: center center;
-    border-top-left-radius: 2px;
-    border-bottom-left-radius: 2px;
     float:left;
+    margin-right: 16px;
 }
 .homeButton:hover {
-    background-image: url(<%= asset_data_uri('home_light.png') %>);
+
 }
 .homeButton a {
     display:block;
-    width: 40px;
+    color: #9E9E9E;
-    height: 32px;
+    font-family: "vinyl", sans-serif;
+    font-style: italic;
+    text-transform: uppercase;
+    font-weight: 400;
+    font-size: 30px;
+    line-height: 38px;
 }
 
 /* end upperLeftUI */

app/assets/stylesheets/search.scss.erb

@@ -8,20 +8,14 @@
 }
 
 .unauthenticated {
-  .homePage .sidebarSearchIcon {
+  .homePage .sidebarSearch {
-    border-radius: 2px;
+    display: none;
-  }
-
-  .homePage .sidebarSearchField,
-  .homePage .sidebarSearch .tt-hint {
-    border-top-left-radius: 2px;
-    border-bottom-left-radius: 2px;
   }
 }
 
 .sidebarSearchIcon {
   float: left;
-  width: 72px;
+  width: 50px;
   border-top-right-radius: 2px;
   border-bottom-right-radius: 2px;
   height: 32px;
@@ -99,13 +93,15 @@
 
   .sidebarSearchField {
     float: left;
+    width: 380px;
+    padding: 7px 10px 3px 10px;
     height: 20px;
     border-top: 1px solid #BDBDBD;
     border-bottom: 1px solid #BDBDBD;
-    border-left: none;
+    border-left: 1px solid #BDBDBD;
     border-right: none;
-    padding: 5px 0 5px 0;
+    border-top-left-radius: 2px;
-    width: 0px;
+    border-bottom-left-radius: 2px;
     margin: 0;
     outline: none;
     font-size: 14px;
@@ -117,13 +113,13 @@
 
   .tt-hint {
     color: transparent;
+    width: 380px;
+    padding: 7px 10px 3px 10px;
     height: 20px;
     border-top: 1px solid #BDBDBD;
     border-bottom: 1px solid #BDBDBD;
     border-left: none;
     border-right: none;
-    padding: 5px 0 5px 0;
-    width: 0px;
     margin: 0;
     outline: none;
     font-size: 14px;

app/controllers/maps_controller.rb

@@ -86,6 +86,20 @@ class MapsController < ApplicationController
     end
   end
 
+  # GET maps/new
+  def new
+    @map = Map.new(name: "Untitled Map", permission: "public", arranged: true)
+    authorize @map
+
+    respond_to do |format|
+      format.html do
+        @map.user = current_user
+        @map.save
+        redirect_to(map_path(@map) + '?new') 
+      end
+    end
+  end
+
   # GET maps/:id
   def show
     @map = Map.find(params[:id])

app/views/layouts/_lightboxes.html.erb

@@ -100,11 +100,6 @@
 
         </div>
 
-        <% # this is the create new map form %>
-        <div class="lightboxContent" id="newmap">
-          <%= render :partial => 'layouts/newmap' %>
-        </div>
-
         <div class="lightboxContent" id="forkmap">
           <%= render :partial => 'shared/forkmap' %>
         </div>

app/views/layouts/_lowermapelements.html.erb

@@ -8,6 +8,6 @@
 <div class="infoAndHelp">
 	<%= render :partial => 'maps/mapinfobox' %>
     <div class="mapInfoIcon infoElement mapElement"><div class="tooltipsAbove">Map Info</div></div>
-    <div class="openCheatsheet openLightbox infoElement" data-open="cheatsheet"><div class="tooltipsAbove">Help</div></div>
+    <div class="openCheatsheet openLightbox infoElement mapElement" data-open="cheatsheet"><div class="tooltipsAbove">Help</div></div>
     <div class="clearfloat"></div>
 </div>

app/views/layouts/_newmap.html.erb

@@ -1,61 +0,0 @@
-<%#
-  # @file
-  # Partial view, renders a form that creates a new map.
-  #%>
-<div class="onConsole">
-<%= form_for Map.new, url: maps_url, remote: true, html: { class: "new_map", id: "new_map" } do |form|%>
-  <h3 class="forCreateMap">Create New Map</h3>
-  
-  <div class="inputGroup">
-    <label for="map_name">Name: </label>
-    <%= form.text_field :name, :maxlength => 140 %>
-    <div class="clearfloat"></div>
-  </div>
-  
-  <div class="inputGroup">
-    <label for="map_desc">Description: </label>
-    <%= form.text_area :desc, class: "description", :rows => 5, :cols => 43 %>
-    <div class="clearfloat"></div>
-  </div>
-  
-  <div class="inputGroup">
-    <label for="map_permission">Permission*: </label>    
-    <p class="permHelper">*new topics and synapses take on the same permission as the map they are created on</p>    
-    <div class="permIconWrapper">
-        <div class="permIcon" data-permission="commons">
-          <div id="newmap_co" class="mapCommonsIcon mapPermIcon selected">
-            <div class="tip">
-              Anyone with an account can edit this map. Anyone without an account can only view it.
-            </div>
-          </div>
-          <h4>COMMONS</h4>
-        </div>
-        <div class="permIcon" data-permission="public">
-          <div id="newmap_pu" class="mapPublicIcon mapPermIcon">
-            <div class="tip">
-              Only people you allow can edit this map. Anyone can view it.
-            </div>
-          </div>
-          <h4>PUBLIC</h4>
-        </div>
-        <div class="permIcon" data-permission="private">
-          <div id="newmap_pr" class="mapPrivateIcon mapPermIcon">
-            <div class="tip">
-              Only people you allow can edit this map. No one else can view it.
-            </div>
-          </div>
-          <h4>PRIVATE</h4>
-        </div>
-        <div class="clearfloat"></div>
-    </div>
-    <p class="permText">Anyone with an account can edit this map. Anyone without an account can only view it.</p>
-    <div class="clearfloat"></div>
-  </div> 
-  
-  <div class="buttonWrapper">
-    <button class="button cancel">Cancel</button>
-    <button class="button submitMap">Create!</button>
-  </div>
-  <div class="clearfloat"></div>
-<% end %>
-</div>

app/views/layouts/_upperelements.html.erb

@@ -4,7 +4,7 @@
 <div class="upperLeftUI">
   <!-- home button -->
   <div class="homeButton">
-    <a href="<%= root_url %>" <% if !current_user || appsPage %><%= 'data-bypass=true' %><% end %>></a>
+    <a href="<%= root_url %>" <% if !current_user || appsPage %><%= 'data-bypass=true' %><% end %>>METAMAPS</a>
   </div> <!-- end homeButton -->
 
   <!-- search box -->
@@ -39,8 +39,11 @@
 
   <% if current_user %>
   <!-- create new map -->
-  <div class="addMap openLightbox upperRightEl upperRightIcon" data-open="newmap"><div class="tooltipsUnder">Create New Map</div>
+  <a href="<%= new_map_path %>" data-bypass="true" target="_blank" class="addMap upperRightEl upperRightIcon">
-  </div><!-- end addMap -->
+    <div class="tooltipsUnder">
+      Create New Map
+    </div>
+  </a><!-- end addMap -->
   <% end %>
 
   <!-- Account / Sign in -->

config/routes.rb

@@ -34,7 +34,7 @@ Metamaps::Application.routes.draw do
   get 'topics/:id/relative_numbers', to: 'topics#relative_numbers', as: :relative_numbers
   get 'topics/:id/relatives', to: 'topics#relatives', as: :relatives
 
-  resources :maps, except: [:index, :new, :edit]
+  resources :maps, except: [:index, :edit]
   get 'maps/:id/export', to: 'maps#export'
   post 'maps/:id/events/:event', to: 'maps#events'
   get 'maps/:id/contains', to: 'maps#contains', as: :contains