diff options
| -rw-r--r-- | www/css/base.css | 4 | ||||
| -rw-r--r-- | www/js/fixmystreet.js | 23 | ||||
| -rw-r--r-- | www/js/map-OpenLayers.js | 9 | ||||
| -rw-r--r-- | www/js/mobile.js | 32 | ||||
| -rw-r--r-- | www/report.html | 65 |
5 files changed, 111 insertions, 22 deletions
diff --git a/www/css/base.css b/www/css/base.css index 35b1853..fe7568e 100644 --- a/www/css/base.css +++ b/www/css/base.css @@ -1453,7 +1453,9 @@ a:hover.button-left { vertical-align: top; } .issue-list-a li a .img, .list-a li a .img { - text-align: right; + width: 90px; + float: right; + height:auto; } .issue-list-a li a .img img, .list-a li a .img img { height: auto; diff --git a/www/js/fixmystreet.js b/www/js/fixmystreet.js index 8ca2705..1e283db 100644 --- a/www/js/fixmystreet.js +++ b/www/js/fixmystreet.js @@ -79,7 +79,6 @@ function tabs(elem, indirect) { $(document).delegate( '#front-page', 'pageshow', function(event, ui) { // Geolocation - console.log('frontpage pageshow'); if (geo_position_js.init() && !$('#geolocate_link').length) { console.log('adding thing'); $('#postcodeForm').after('<a href="#" id="geolocate_link">… or locate me automatically</a>'); @@ -92,7 +91,6 @@ $(document).bind('pageshow', function(){ $html.removeClass('no-js').addClass('js'); - // Preload the new report pin document.createElement('img').src = '../i/pin-green.png'; @@ -112,6 +110,13 @@ $(document).bind('pageshow', function(){ margin: 0 }); $('#fms_pan_zoom').css({ top: '2.75em !important' }); + } else { + $('#map_box').css({ + zIndex: '', position: '', + top: '', left: '', right: '', bottom: '', + width: '', height: '10em', + margin: '' + }); } }); @@ -506,17 +511,3 @@ $.fn.drawer = function(id, ajax) { } } }); - -/* -XXX Disabled because jerky on Android and makes map URL bar height too small on iPhone. -// Hide URL bar -$(window).load(function(){ - window.setTimeout(function(){ - var s = window.pageYOffset || document.compatMode === "CSS1Compat" && document.documentElement.scrollTop || document.body.scrollTop || 0; - if (s < 20 && !location.hash) { - window.scrollTo(0, 1); - } - }, 0); -}); -*/ - diff --git a/www/js/map-OpenLayers.js b/www/js/map-OpenLayers.js index caa326d..3c136cf 100644 --- a/www/js/map-OpenLayers.js +++ b/www/js/map-OpenLayers.js @@ -259,7 +259,7 @@ $(document).delegate('#submit-problem', 'pageshow', function(event) { }); }); -$(document).delegate('#around-page', 'pageshow', function(event) { +function show_map(event) { ensureNonZeroHeight(); set_map_config(); @@ -293,6 +293,7 @@ $(document).delegate('#around-page', 'pageshow', function(event) { } 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; @@ -362,7 +363,11 @@ $(document).delegate('#around-page', 'pageshow', function(event) { fixmystreet_onload(); } fixContentHeight(fixmystreet.map); -}); +} + +$(document).delegate('#around-page', 'pageshow', show_map ); +$(document).delegate('#report-page', 'pageshow', show_map ); + /* Overridding the buttonDown function of PanZoom so that it does zoomTo(0) rather than zoomToMaxExtent() diff --git a/www/js/mobile.js b/www/js/mobile.js index fda1c3a..f902baa 100644 --- a/www/js/mobile.js +++ b/www/js/mobile.js @@ -485,13 +485,15 @@ function save_report() { function display_saved_reports() { if ( localStorage.getObject( 'reports' ) ) { var r = localStorage.getObject('reports'); - var list = $('<ul></ul>'); + var list = $('<ul id="current" class="issue-list-a tab open"></ul>'); for ( i = 0; i < r.length; i++ ) { if ( r[i] && r[i].title ) { - var item = $('<li id="' + i + '">' + r[i].title + '</li>'); + var item = $('<li class="saved-report" id="' + i + '"></li>'); + var content = $('<a class="text"><h4>' + r[i].title + '</h4></a>'); if ( r[i].file ) { - $('<img src="' + r[i].file + '" width="100">').appendTo(item); + $('<img class="img" src="' + r[i].file + '" height="60" width="90">').prependTo(content); } + content.appendTo(item); item.appendTo(list); } } @@ -501,6 +503,28 @@ function display_saved_reports() { } } +function open_saved_report_page(e) { + localStorage.currentReport = this.id; + $.mobile.changePage('report.html'); +} + +function display_saved_report() { + var r = localStorage.getObject('reports')[localStorage.currentReport]; + fixmystreet.latitude = r.lat; + fixmystreet.longitude = r.lon; + fixmystreet.pins = [ [ r.lat, r.lon, 'yellow', '', "", 'big' ] ]; + + $('#title').text(r.title); + $('#details').text(r.detail); + if ( r.file ) { + $('#photo').attr('src', r.file); + $('#photo_link').attr('href', r.file); + $('#report-img').show(); + } else { + $('#report-img').hide(); + } +} + $(document).bind('pageinit', function() { $('#postcodeForm').submit(locate); $('#mapForm').submit(postReport); @@ -521,3 +545,5 @@ $(document).delegate('#report-created', 'pageshow',function() { $(document).delegate('#account-page', 'pageshow', display_account_page); $(document).delegate('#my-reports-page', 'pageshow', display_saved_reports); +$(document).delegate('#report-page', 'pageshow', display_saved_report); +$(document).delegate('.saved-report', 'click', open_saved_report_page); diff --git a/www/report.html b/www/report.html new file mode 100644 index 0000000..d3994e7 --- /dev/null +++ b/www/report.html @@ -0,0 +1,65 @@ + <div class="wrapper" id="report-page" data-role="page"> + <div class="table-cell"> + <!-- header id="site-header" role="banner"> + <div class="container"> + <span id="site-logo"></span> + </div> + </header --> + + <div id="user-meta"> + + </div> + + <div class="container" data-role="content"> + <div class="content" id="report" role="main" data-enhance="false"> + + +<input type="hidden" name="zoom" value="3"> +<script type="text/javascript"> +var fixmystreet = { + 'page': 'report', + 'area': [ ], + 'all_pins': '', + 'latitude': 51.629107614789, + 'longitude': -0.060880696400998, + + 'zoom': 3, + 'numZoomLevels': 5, + 'zoomOffset': 13, + 'map_type': "", + 'pins': [ [ 51.629107614789, -0.060880696400998, 'yellow', '', "", 'big' ] + ] + +} +</script> +<div id="map_box"> + <div id="map"></div> +</div> + +<div class="problem-header cf"> + <h1 id="title">Bent street light11 outside 72</h1> + +<div id="report-img" class="update-img"> + <a id="photo_link" href="" rel="fancy"><img id="photo" alt="Photo of this report" width="250" src=""><span>zoom</span></a> +</div> + +<div id="details"> +</div> + +</div> + + + </div> + + <div data-role="footer" data-id="foo1" data-position="fixed"> + <div data-role="navbar"> + <ul> + <li><a href="index.html">Report</a></li> + <li><a href="account.html">Account</a></li> + <li><a href="about.html">Info</a></li> + </ul> + </div><!-- /navbar --> + </div> + </div> + </div><!-- .table-cell --> + </div> |