Split out sidebar code from the search code so it can be reused for the

map key more cleanly.

diff --git a/app/controllers/geocoder_controller.rb b/app/controllers/geocoder_controller.rb
index 8abcbdc4445a773acaad8bfe2506e90e16b609ba..27e7cbf3e7e41db234c311faf57e5a63ac94390a 100644 (file)
--- a/app/controllers/geocoder_controller.rb
+++ b/app/controllers/geocoder_controller.rb
@@ -21,13 +21,13 @@ class GeocoderController < ApplicationController
     results_count = count_results(results)
 
     render :update do |page|
-      page.replace_html :search_results_content, :partial => 'results', :object => results
+      page.replace_html :sidebar_content, :partial => 'results', :object => results
 
       if results_count == 1
         position = results.collect { |s| s[:results] }.compact.flatten[0]
         page.call "setPosition", position[:lat], position[:lon], position[:zoom]
       else
-        page.call "openSearchResults"
+        page.call "openSidebar"
       end
     end
   end
@@ -44,8 +44,8 @@ class GeocoderController < ApplicationController
     results.push description_geonames(lat, lon)
 
     render :update do |page|
-      page.replace_html :search_results_content, :partial => 'results', :object => results
-      page.call "openSearchResults"
+      page.replace_html :sidebar_content, :partial => 'results', :object => results
+      page.call "openSidebar"
     end
   end
 

diff --git a/app/views/site/_key.rhtml b/app/views/site/_key.rhtml
new file mode 100644 (file)
index 0000000..2d8f1bc
--- /dev/null
+++ b/app/views/site/_key.rhtml
@@ -0,0 +1,12 @@
+<% content_for :left_menu do %>
+<%= link_to_function "Map key", "showKey();" %>
+<% end %>
+
+<script type="text/javascript">
+<!--
+  function showKey() {
+    updateSidebar("Map key", "<p><img src='images/keymapnik11.png' /></p>");
+    openSidebar();
+  }
+// -->
+</script>

diff --git a/app/views/site/_search.rhtml b/app/views/site/_search.rhtml
index c874e180ccaa08bb7a3d36bef53ec0c6e4957e51..19b4ca2d1351d199ffa1ce31afb326e61cf0243a 100644 (file)
--- a/app/views/site/_search.rhtml
+++ b/app/views/site/_search.rhtml
@@ -1,26 +1,8 @@
-<div id="search_results">
-  <table class="search_results_title" width="100%">
-    <tr>
-      <td align="left" id="search_title">Search Results</td>
-      <td align="right"><a href="javascript:closeSearchResults()">Close</a></td>
-    </tr>
-  </table>
-  <div id="search_results_content">
-  </div>
-</div>
-
 <script type="text/javascript">
 <!--
-  function showKey() {
-    $("search_results").style.display = "block";
-    $("search_results_content").innerHTML = "<p><img src='images/keymapnik11.png' /></p>";
-    $("search_title").innerHTML = "Map key";
-       resizeMap();
-  }
-
   function startSearch() {
-    $("search_results_content").innerHTML = "<p class='search_results_entry'>Searching...</p>";
-    $("search_title").innerHTML = "Search Results";
+    updateSidebar("Search Results", "<p class='search_results_entry'>Searching...</p>");
+
     $("search_field").style.display = "none";
     $("search_active").style.display = "inline";
   }
@@ -30,16 +12,6 @@
     $("search_active").style.display = "none";
   }
 
-  function openSearchResults() {
-    $("search_results").style.display = "block";
-    <%= onopen %>
-  }
-
-  function closeSearchResults() {
-    $("search_results").style.display = "none";
-    <%= onclose %>
-  }
-
   function describeLocation() {
     var position = getPosition();
 

diff --git a/app/views/site/_sidebar.rhtml b/app/views/site/_sidebar.rhtml
new file mode 100644 (file)
index 0000000..ae557f9
--- /dev/null
+++ b/app/views/site/_sidebar.rhtml
@@ -0,0 +1,29 @@
+<div id="sidebar">
+  <table class="sidebar_title" width="100%">
+    <tr>
+      <td align="left" id="sidebar_title">Search Results</td>
+      <td align="right"><a href="javascript:closeSidebar()">Close</a></td>
+    </tr>
+  </table>
+  <div id="sidebar_content">
+  </div>
+</div>
+
+<script type="text/javascript">
+<!--
+  function openSidebar() {
+    $("sidebar").style.display = "block";
+    <%= onopen %>
+  }
+
+  function closeSidebar() {
+    $("sidebar").style.display = "none";
+    <%= onclose %>
+  }
+
+  function updateSidebar(title, content) {
+    $("sidebar_title").innerHTML = title;
+    $("sidebar_content").innerHTML = content;
+  }
+// -->
+</script>

diff --git a/app/views/site/edit.rhtml b/app/views/site/edit.rhtml
index 6b5952f3856d32ca3a93294b0d85535e6d5c5843..ceb4702d43808345da7a8bb18b5103f6d073af28 100644 (file)
--- a/app/views/site/edit.rhtml
+++ b/app/views/site/edit.rhtml
@@ -13,7 +13,8 @@
 <% end %>
 <% end %>
 
-<%= render :partial => 'search', :locals => { :onopen => "resizeMap();", :onclose => "resizeMap();" } %>
+<%= render :partial => 'sidebar', :locals => { :onopen => "resizeMap();", :onclose => "resizeMap();" } %>
+<%= render :partial => 'search' %>
 
 <% session[:token] = @user.tokens.create.token unless session[:token] %>
 
@@ -68,14 +69,14 @@
   }
   
   function resizeMap() {
-    var search_results_width = $("search_results").offsetWidth;
+    var sidebar_width = $("sidebar").offsetWidth;
 
-    if (search_results_width > 0) {
-      search_results_width = search_results_width + 5
+    if (sidebar_width > 0) {
+      sidebar_width = sidebar_width + 5
     }
 
-    $("map").style.left = (search_results_width) + "px";
-    $("map").style.width = ($("content").offsetWidth - search_results_width) + "px";
+    $("map").style.left = (sidebar_width) + "px";
+    $("map").style.width = ($("content").offsetWidth - sidebar_width) + "px";
     $("map").style.height = ($("content").offsetHeight - 2) + "px";
   }
 

diff --git a/app/views/site/index.rhtml b/app/views/site/index.rhtml
index 8615c59be460391468283d4c0439f5281388159d..1d8444221482a3fbbc96c9722e24122a21727863 100644 (file)
--- a/app/views/site/index.rhtml
+++ b/app/views/site/index.rhtml
@@ -4,11 +4,9 @@
 <% end %>
 <% end %>
 
-<% content_for :left_menu do %>
-<%= link_to_function "Map key", "showKey();" %>
-<% end %>
-
-<%= render :partial => 'search', :locals => { :onopen => "resizeMap();", :onclose => "resizeMap();" } %>
+<%= render :partial => 'sidebar', :locals => { :onopen => "resizeMap();", :onclose => "resizeMap();" } %>
+<%= render :partial => 'key' %>
+<%= render :partial => 'search' %>
 
 <div id="map"></div> 
 
@@ -139,14 +137,14 @@
   function resizeMap() {
     var centre = map.getCenter();
     var zoom = map.getZoom();
-    var search_results_width = $("search_results").offsetWidth;
+    var sidebar_width = $("sidebar").offsetWidth;
 
-    if (search_results_width > 0) {
-      search_results_width = search_results_width + 5
+    if (sidebar_width > 0) {
+      sidebar_width = sidebar_width + 5
     }
 
-    $("map").style.left = (search_results_width) + "px";
-    $("map").style.width = ($("content").offsetWidth - search_results_width) + "px";
+    $("map").style.left = (sidebar_width) + "px";
+    $("map").style.width = ($("content").offsetWidth - sidebar_width) + "px";
     $("map").style.height = ($("content").offsetHeight - 2) + "px";
 
     map.setCenter(centre, zoom);

diff --git a/public/stylesheets/site.css b/public/stylesheets/site.css
index edaf46cefedbf5b41033947e20aac150c35d7052..b11eb191d028109d3090a21201587c196cae94ba 100644 (file)
--- a/public/stylesheets/site.css
+++ b/public/stylesheets/site.css
@@ -413,7 +413,7 @@ hides rule from IE5-Mac \*/
   bottom: 0px;
 }
 
-#search_results {
+#sidebar {
   display: none;
   position: absolute;
   border: 1px solid black;
@@ -425,7 +425,7 @@ hides rule from IE5-Mac \*/
   bottom: 0px;
 }
 
-#search_results_content {
+#sidebar_content {
   overflow: auto;
   position: absolute;
   font-size: 13px;
@@ -436,7 +436,7 @@ hides rule from IE5-Mac \*/
   right: 0px;
 }
 
-.search_results_title {
+.sidebar_title {
   margin: 0px;
   padding: 3px 6px 3px 6px;
   height: 29px;