diff options
| -rw-r--r-- | www/around.html | 2 | ||||
| -rw-r--r-- | www/frontpage-form.html | 77 | ||||
| -rw-r--r-- | www/index.html | 23 | ||||
| -rw-r--r-- | www/js/mobile.js | 51 | ||||
| -rw-r--r-- | www/no_connection.html | 69 |
5 files changed, 93 insertions, 129 deletions
diff --git a/www/around.html b/www/around.html index cdc84bf..66fd243 100644 --- a/www/around.html +++ b/www/around.html @@ -20,7 +20,7 @@ 'latitude': localStorage.latitude, 'longitude': localStorage.longitude, - 'zoom': 2, + 'zoom': 3, 'numZoomLevels': 5, 'zoomOffset': 13, 'map_type': "", diff --git a/www/frontpage-form.html b/www/frontpage-form.html index 4d746eb..e000f58 100644 --- a/www/frontpage-form.html +++ b/www/frontpage-form.html @@ -1,35 +1,42 @@ -<!DOCTYPE html> -<html> - <head> - <title></title> - - <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" /> - <meta charset="utf-8"> - - <link rel="stylesheet" href="css/base.css"> - <link rel="stylesheet" href="css/mobile.css"> - - <script type="text/javascript" src="js/jquery-1.7.0.min.js"></script> - <script type="text/javascript" src="cordova-independent.js"></script> - - <script type="text/javascript"> - - function onLoad() { - document.addEventListener("deviceready", onDeviceReady, false); - } - - function onDeviceReady() { - var connectionType = navigator.network.connection.type; - - } - - </script> - - </head> - <body id="container" class="frontpage fullwidthpage" onload="onLoad()" ontouchmove="touchmove(event);"> - - <p>The front page with a form.</p> - - </body> -</html> -</html> + <div class="wrapper" id="locate-page" data-role="page"> + <div class="table-cell"> + <div class="container"> + <div class="content" role="main"> + <div id="front-main"> + <div id="front-main-container" data-enhance="false"> + <form action="" method="get" name="postcodeForm" id="postcodeForm"> + <label for="pc">Enter a nearby GB postcode, or street name and area:</label> + <div> + <input type="text" name="pc" value="" id="pc" size="10" maxlength="200" placeholder="e.g. ‘B2 4QA’ or ‘Tib St, Manchester’"> + <input type="submit" value="Go" id="submit"> + </div> + </form> + </div> + </div> + + <div class="tablewrapper"> + <div id="front-howto"> + <h2>How to report a problem</h2> + + <ol class="big-numbers"> + <li>Enter a nearby GB postcode, or street name and area</li> + <li>Locate the problem on a map of the area</li> + <li>Enter details of the problem</li> + <li>We send it to the council on your behalf</li> + </ol> + </div> + </div> + </div> + </div> + </div> + <div data-role="footer" data-id="foo1" data-position="fixed"> + <div data-role="navbar"> + <ul> + <li><a href="index.html" class="ui-button-active ui-state-persist">Report</a></li> + <li><a href="account.html">Account</a></li> + <li><a href="about.html">Info</a></li> + <li><a href="my_reports.html">My</a></li> + </ul> + </div><!-- /navbar --> + </div> + </div> <!-- .wrapper --> diff --git a/www/index.html b/www/index.html index df94d7f..ac8584b 100644 --- a/www/index.html +++ b/www/index.html @@ -55,29 +55,8 @@ <div class="table-cell"> <div class="container"> <div class="content" role="main"> - <div id="front-main"> - <div id="front-main-container" data-enhance="false"> - <form action="" method="get" name="postcodeForm" id="postcodeForm"> - <label for="pc">Enter a nearby GB postcode, or street name and area:</label> - <div> - <input type="text" name="pc" value="" id="pc" size="10" maxlength="200" placeholder="e.g. ‘B2 4QA’ or ‘Tib St, Manchester’"> - <input type="submit" value="Go" id="submit"> - </div> - </form> - </div> - </div> - <div class="tablewrapper"> - <div id="front-howto"> - <h2>How to report a problem</h2> - - <ol class="big-numbers"> - <li>Enter a nearby GB postcode, or street name and area</li> - <li>Locate the problem on a map of the area</li> - <li>Enter details of the problem</li> - <li>We send it to the council on your behalf</li> - </ol> - </div> + Determing location </div> </div> </div> diff --git a/www/js/mobile.js b/www/js/mobile.js index 9da0ecb..8c77fc7 100644 --- a/www/js/mobile.js +++ b/www/js/mobile.js @@ -1,3 +1,5 @@ +var can_geolocate = false; + Storage.prototype.setObject = function(key, value) { this.setItem(key, JSON.stringify(value)); }; @@ -140,19 +142,37 @@ function locate() { } return false; } +var watch_id = null; +var watch_count = 0; function foundLocation(myLocation) { var lat = myLocation.coords.latitude; var long = myLocation.coords.longitude; - - show_around( lat, long ); + watch_count++; + if ( myLocation.coords.accuracy < 100 ) { + navigator.geolocation.clearWatch(watch_id); + show_around( lat, long ); + watch_id = null; + } else if ( watch_count > 10 ) { + navigator.geolocation.clearWatch(watch_id); + watch_id = null; + $.mobile.changePage( 'frontpage-form.html' ); + } } -function notFoundLocation() { location_error( 'Could not find location' ); } +function notFoundLocation() { if ( watch_id ) { location_error( 'Could not find location' ); } else { console.log('should not be here'); } } function getPosition() { - - navigator.geolocation.getCurrentPosition(foundLocation, notFoundLocation); + if ( !can_geolocate ) { + window.setTimeout( getPosition, 200 ); + return; + } + if ( !watch_id ) { + watch_count = 0; + watch_id = navigator.geolocation.watchPosition(foundLocation, notFoundLocation, { timeout: 60000, enableHighAccuracy: true } ); + } else { + alert('currently locating'); + } } @@ -428,12 +448,7 @@ function forget() { } function onDeviceReady() { - var location = document.location + ''; - if ( location.indexOf('no_connection.html') < 0 && ( - navigator.network.connection.type == Connection.NONE || - navigator.network.connection.type == Connection.UNKNOWN ) ) { - document.location = 'no_connection.html'; - } + can_geolocate = true; } function get_report_params () { @@ -560,6 +575,20 @@ $(document).delegate('#report-created', 'pageshow',function() { $('#report_url').html( '<a href="' + uri + '">' + uri + '</a>' ); }); +function decide_front_page() { + if ( !can_geolocate ) { + window.setTimeout( decide_front_page, 100 ); + return; + } + if ( navigator.network.connection.type == Connection.NONE || + navigator.network.connection.type == Connection.UNKNOWN ) { + $.mobile.changePage( 'no_connection.html' ); + } else { + getPosition(); + } +} + +$(document).delegate('#front-page', 'pageinit', decide_front_page); $(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); diff --git a/www/no_connection.html b/www/no_connection.html index d81f5f8..110e806 100644 --- a/www/no_connection.html +++ b/www/no_connection.html @@ -1,54 +1,5 @@ -<!DOCTYPE html> -<html> - <head> - <title></title> - - <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" /> - <meta charset="utf-8"> - - <link rel="stylesheet" href="css/base.css"> - <link rel="stylesheet" href="css/mobile.css"> - <script type="text/javascript" src="js/json2.js"></script> - <script type="text/javascript" src="js/config.js"></script> - <script type="text/javascript" charset="utf-8" src="cordova-independent.js"></script> - <script type="text/javascript" src="js/jquery-1.7.0.min.js"></script> - <script src="js/jquery.validate.min.js" type="text/javascript" charset="utf-8"></script> - - <script type="text/javascript" src="js/geo.min.js"></script> - <script type="text/javascript" src="js/fixmystreet.js"></script> - <script type="text/javascript" src="js/mobile.js"></script> - - <script type="text/javascript"> - validation_strings = { - update: 'Please enter a message', - title: 'Please enter a subject', - detail: 'Please enter some details', - name: { - required: 'Please enter your name', - validName: 'Please enter your full name, councils need this information – if you do not wish your name to be shown on the site, untick the box below' - }, - category: 'Please choose a category', - rznvy: { - required: 'Please enter your email', - email: 'Please enter a valid email' - }, - email: { - required: 'Please enter your email', - email: 'Please enter a valid email' - } - }; - </script> - </head> - <body id="container" class="frontpage fullwidthpage mobile-header" ontouchmove="touchmove(event);"> - - <div class="wrapper"> + <div class="wrapper" data-role="page"> <div class="table-cell"> - <header id="site-header" role="banner"> - <div class="container"> - <span id="site-logo"></span> - </div> - </header> - <div class="container"> <div class="content" role="main"> <div class="tablewrapper"> @@ -64,15 +15,13 @@ </div><!-- .container --> </div><!-- .table-cell --> - <div class="mobile-info"> - <a href="about.html">i</a> - </div> - - <div class="big-green-banner mobile-map-banner mobile-nav-banner"> - <a href="index.html">Home</a> - No connection + <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" class="ui-button-active ui-state-persist">Info</a></li> + </ul> + </div><!-- /navbar --> </div> </div> <!-- .wrapper --> - </body> -</html> -</html> |