Make sure mobile map scrolled into view and fixed.

This prevents scrolling when we're on the full screen map, and makes
sure the map is back in view when it is shown.

2 files changed, 12 insertions, 2 deletions

diff --git a/web/cobrands/fixmystreet/fixmystreet.js b/web/cobrands/fixmystreet/fixmystreet.js
index e53b786c4..b732fa8c0 100644
--- a/web/cobrands/fixmystreet/fixmystreet.js
+++ b/web/cobrands/fixmystreet/fixmystreet.js
@@ -117,7 +117,8 @@ fixmystreet.mobile_reporting = {
   apply_ui: function() {
     // Creates the "app-like" mobile reporting UI with full screen map
     // and special "OK/Cancel" buttons etc.
-    $('html').addClass('mobile-reporting-map');
+    $('html').addClass('mobile-reporting-map only-map');
+    $('html, body').scrollTop(0);
 
     var banner_text = '<a href="/">' + translation_strings.home + '</a> ' + translation_strings.place_pin_on_map;
     $('.big-green-banner')
@@ -130,7 +131,7 @@ fixmystreet.mobile_reporting = {
     // Removes the "app-like" mobile reporting UI, reverting all the
     // changes made by fixmystreet.mobile_reporting.apply_ui().
 
-    $('html').removeClass('mobile-reporting-map');
+    $('html').removeClass('mobile-reporting-map only-map');
 
     var banner_text = translation_strings.report_problem_heading;
     if (typeof variation !== 'undefined' && variation === 1) {
@@ -846,11 +847,13 @@ fixmystreet.display = {
             //of the #side-form or whatever as we will probably want
             //to do this on other pages where #side-form might not be
             $('html, body').animate({ scrollTop: height-60 }, 1000, function(){
+                $('html').removeClass('only-map');
                 $('#mob_sub_map_links').addClass('map_complete');
                 $('#mob_ok').text(translation_strings.map);
             });
         }, function(){
             $('html, body').animate({ scrollTop: 0 }, 1000, function(){
+                $('html').addClass('only-map');
                 $('#mob_sub_map_links').removeClass('map_complete');
                 $('#mob_ok').text(translation_strings.ok);
             });
diff --git a/web/cobrands/sass/_base.scss b/web/cobrands/sass/_base.scss
index 20c745a6b..94ed1fdad 100644
--- a/web/cobrands/sass/_base.scss
+++ b/web/cobrands/sass/_base.scss
@@ -1344,6 +1344,13 @@ a:hover.rap-notes-trigger {
   }
 }
 
+.mobile-reporting-map.only-map {
+  height: 100%;
+  body {
+    height: 100%;
+    overflow: hidden;
+  }
+}
 
 /* Reporting a problem bits */