1 files changed, 94 insertions, 34 deletions
diff --git a/www/js/map-OpenLayers.js b/www/js/map-OpenLayers.js
index c845978..7edcffa 100644
--- a/www/js/map-OpenLayers.js
+++ b/www/js/map-OpenLayers.js
@@ -208,9 +208,63 @@ function fixmystreet_onload() {
 
     fixmystreet.map.addControl( new OpenLayers.Control.Crosshairs(null) );
 }
+OpenLayers.Map.prototype.getCurrentSize = function() {
+    var mapDiv = $(this.div);
+    return new OpenLayers.Size(mapDiv.width(), mapDiv.height());
+};
+
+function fixContentHeight(olMap) {
+    var footer = $("div[data-role='footer']:visible"),
+        content = $("div[data-role='content']:visible:visible"),
+        viewHeight = $(window).height(),
+        contentHeight = viewHeight - footer.outerHeight();
+
+    if ((content.outerHeight() + footer.outerHeight()) !== viewHeight) {
+        contentHeight -= (content.outerHeight() - content.height() + 1);
+        content.height(contentHeight);
+    }
+    content.width($(window).width());
+    olMap.updateSize();
+}
+
+function ensureNonZeroHeight(containerid) {
+    var footer = $("div[id='" + containerid + "'] > div[data-role='footer']"),
+        header = $("div[id='" + containerid + "'] > div[data-role='header']"),
+        content = $("div[id='" + containerid + "'] > div[data-role='content']"),
+        viewHeight = $(window).height(),
+        contentHeight = viewHeight - footer.outerHeight() - header.outerHeight();
+
+    if ((content.outerHeight() + footer.outerHeight() + header.outerHeight()) !== viewHeight) {
+        contentHeight -= (content.outerHeight() - content.height() + 1);
+        content.height(contentHeight);
+        content.width($(window).width());
+    }
+ }
+
+$(document).delegate('#submit-problem', 'pageshow', function(event) {
+    $('#mapForm').submit(postReport);
+    $('#mapForm :input[type=submit]').on('click', function() { submit_clicked = $(this); });
+    $('#side-form, #site-logo').show();
+    $('#pc').val(localStorage.pc);
+    $('#fixmystreet\\.latitude').val(localStorage.latitude);
+    $('#fixmystreet\\.longitude').val(localStorage.longitude);
+    $.getJSON( CONFIG.FMS_URL + 'report/new/ajax', {
+            latitude: $('#fixmystreet\\.latitude').val(),
+            longitude: $('#fixmystreet\\.longitude').val()
+    }, function(data) {
+        if (data.error) {
+            // XXX If they then click back and click somewhere in the area, this error will still show.
+            $('#side-form').html('<h1>Reporting a problem</h1><p>' + data.error + '</p>');
+            return;
+        }
+        $('#councils_text').html(data.councils_text);
+        $('#form_category_row').html(data.category);
+    });
+});
 
-$(function(){
+function show_map(event) {
 
+    ensureNonZeroHeight();
     set_map_config();
 
     fixmystreet.map = new OpenLayers.Map("map", {
@@ -222,6 +276,8 @@ $(function(){
         $('#fms_pan_zoom').css({ top: '2.75em !important' });
     }
 
+    fixContentHeight(fixmystreet.map);
+
     fixmystreet.layer_options = OpenLayers.Util.extend({
         zoomOffset: fixmystreet.zoomOffset,
         transitionEffect: 'resize',
@@ -240,6 +296,7 @@ $(function(){
     }
 
     if (fixmystreet.state_map && fixmystreet.state_map == 'full') {
+        console.log('full page');
         // TODO Work better with window resizing, this is pretty 'set up' only at present
         var $content = $('.content'),
             q = ( $content.offset().left + $content.width() ) / 2;
@@ -308,7 +365,12 @@ $(function(){
     } else {
         fixmystreet_onload();
     }
-});
+    fixContentHeight(fixmystreet.map);
+}
+
+$(document).delegate('#around-page', 'pageshow', show_map );
+$(document).delegate('#report-page', 'pageshow', show_map );
+
 
 OpenLayers.Control.Crosshairs = OpenLayers.Class.create();
 OpenLayers.Control.Crosshairs.CROSSHAIR_SIDE = 100;
@@ -492,13 +554,13 @@ OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {
         });
 
         $('#side-form, #site-logo').show();
-        fixmystreet.map.updateSize(); // might have done, and otherwise Firefox gets confused.
+        //fixmystreet.map.updateSize(); // might have done, and otherwise Firefox gets confused.
         /* For some reason on IOS5 if you use the jQuery show method it
          * doesn't display the JS validation error messages unless you do this
          * or you cause a screen redraw by changing the phone orientation.
          * NB: This has to happen after the call to show() */
         if ( navigator.userAgent.match(/like Mac OS X/i)) {
-            document.getElementById('side-form').style.display = 'block';
+            //document.getElementById('side-form').style.display = 'block';
         }
         $('#side').hide();
         if (typeof heightFix !== 'undefined') {
@@ -529,36 +591,34 @@ OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {
         }
 
         $('#sub_map_links').hide();
-        if ($('html').hasClass('mobile')) {
-            var $map_box = $('#map_box'),
-                width = $map_box.width(),
-                height = $map_box.height();
-            $map_box.append(
-                '<p id="mob_sub_map_links">' +
-                '<a href="#" id="try_again">Try again</a>' +
-                '<a href="#ok" id="mob_ok">OK</a>' +
-                '</p>'
-            ).css({ position: 'relative', width: width, height: height, marginBottom: '1em' });
-            // Making it relative here makes it much easier to do the scrolling later
-
-            $('.mobile-map-banner').text('Right place?').prepend('<a href="index.html">home</a>');
-
-            // mobile user clicks 'ok' on map
-            $('#mob_ok').toggle(function(){
-                //scroll the height of the map box instead of the offset
-                //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(){
-                    $('#mob_sub_map_links').addClass('map_complete');
-                    $('#mob_ok').text('MAP');
-                });
-            }, function(){
-                $('html, body').animate({ scrollTop: 0 }, 1000, function(){
-                    $('#mob_sub_map_links').removeClass('map_complete');
-                    $('#mob_ok').text('OK');
-                });
-            });
-        }
+        var $map_box = $('#map_box');
+        $map_box.append(
+            '<p id="mob_sub_map_links">' +
+            '<a href="#" id="try_again">Try again</a>' +
+            '<a href="#ok" id="mob_ok">OK</a>' +
+            '</p>'
+        ); 
+        // .css({ position: 'relative', width: width, height: height, marginBottom: '1em' });
+        // Making it relative here makes it much easier to do the scrolling later
+
+        $('.mobile-map-banner').text('Right place?').prepend('<a href="index.html">home</a>');
+
+        $('#try_again').on('click', function(){
+            fixmystreet.bbox_strategy.activate();
+            fixmystreet.markers.refresh( { force: true } );
+            if ( fixmystreet.state_pins_were_hidden ) {
+                // If we had pins hidden when we clicked map (which had to show the pin layer as I'm doing it in one layer), hide them again.
+                $('#hide_pins_link').click();
+            }
+            fixmystreet.drag.deactivate();
+            $('#sub_map_links').show();
+            $('#mob_sub_map_links').remove();
+        });
+        $('#mob_ok').on('click', function(){
+            localStorage.latitude = $('#fixmystreet\\.latitude').val();
+            localStorage.longitude = $('#fixmystreet\\.longitude').val();
+            $.mobile.changePage('submit-problem.html')
+        });
 
         fixmystreet.page = 'new';
         location.hash = 'report';