Keep the map visible as the changeset page is scrolled

diff --git a/app/assets/javascripts/changeset.js b/app/assets/javascripts/changeset.js
index 9e393ad5a51ea698e9add6b832d208d62c3cae20..1010fbac94b03fdeab92db2d3ee3b98e1230295a 100644 (file)
--- a/app/assets/javascripts/changeset.js
+++ b/app/assets/javascripts/changeset.js
@@ -53,6 +53,14 @@ $(document).ready(function () {
     }
   });
 
+  $(window).scroll(function() {
+        if ($(window).scrollTop() > $('.content-heading').outerHeight() + $('#top-bar').outerHeight() ) {
+            $('#changeset_list_map_wrapper').addClass('scrolled');
+        } else {
+            $('#changeset_list_map_wrapper').removeClass('scrolled');
+        }
+  });
+
   var params = OSM.mapParams();
   if (params.bbox) {
     map.fitBounds([[params.minlat, params.minlon],

diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index 0a23207d55ab0972abe09c6fa4c2e4a544cef1f4..b114ffc0e4eef1849a6a81a4c70eb5acd1268859 100644 (file)
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -915,17 +915,31 @@ ul.results-list li { border-bottom: 1px solid #ccc; }
   }
 }
 
+#changeset_list_map_wrapper {
+  position: absolute;
+  width: 50%;
+  height: 490px;
+  top: 0;
+  right: 0;
+}
+
+#changeset_list_map_wrapper.scrolled {
+  position: fixed;
+}
+
 #changeset_list_map {
   position: absolute;
   bottom: 20px;
   top: 20px;
   right: 20px;
-  width: 45%;
-  min-height: 398px;
-  max-height: 598px;
+  left: 20px;
   border: 1px solid #ccc;
 }
 
+#changeset_list_map_wrapper.scrolled #changeset_list_map {
+  margin-left: 93px;
+}
+
 /* Rules for the data browser */
 
 .browse-section {

diff --git a/app/views/changeset/list.html.erb b/app/views/changeset/list.html.erb
index 8ecdda9468fa15ba77d8c9c440467417608f7b13..ee8610574be79dfb4c58e553c44571cc15bdeab1 100644 (file)
--- a/app/views/changeset/list.html.erb
+++ b/app/views/changeset/list.html.erb
@@ -17,7 +17,9 @@
 <%= render :partial => 'changeset_paging_nav' %>
 
 <% if @edits.size > 0 %>
-  <%= render :partial => 'map' %>
+  <div id='changeset_list_map_wrapper'>
+    <%= render :partial => 'map' %>
+  </div>
   <div class='column-1'>
     <%= render :partial => 'changesets', :locals => { :showusername => !params.has_key?(:display_name) } %>
   </div>