diff options
| -rw-r--r-- | www/frontpage-form.html | 35 | ||||
| -rw-r--r-- | www/frontpage-map.html | 110 | ||||
| -rw-r--r-- | www/index.html | 108 | ||||
| -rw-r--r-- | www/old-index.html | 112 |
4 files changed, 276 insertions, 89 deletions
diff --git a/www/frontpage-form.html b/www/frontpage-form.html new file mode 100644 index 0000000..4d746eb --- /dev/null +++ b/www/frontpage-form.html @@ -0,0 +1,35 @@ +<!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> diff --git a/www/frontpage-map.html b/www/frontpage-map.html new file mode 100644 index 0000000..2af30ce --- /dev/null +++ b/www/frontpage-map.html @@ -0,0 +1,110 @@ +<!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" src="js/json2.js"></script> + <script type="text/javascript" src="js/config.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"> + + function onLoad() { + document.addEventListener("deviceready", onDeviceReady, false); + } + + function gotPosition(position) { + var element = document.getElementById('geolocation'); + element.innerHTML = 'Latitude: ' + position.coords.latitude + '<br />' + + 'Longitude: ' + position.coords.longitude + '<br />' + + '<hr />' + element.innerHTML; + + + + + } + + function positionError(error) { + alert('code: ' + error.code + '\n' + + 'message: ' + error.message + '\n'); + } + + function onDeviceReady() { + // Throw an error if no update is received every 30 seconds + var options = { timeout: 30000 }; + watchID = navigator.geolocation.watchPosition(gotPosition, positionError, options); + } + + </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" onload="onLoad()" ontouchmove="touchmove(event);"> + + <div id="map_box"> + <div id="map"></div> + <p id="sub_map_links"> + <a id="hide_pins_link" rel="nofollow" href="">Hide pins</a> + <a id="all_pins_link" rel="nofollow" href="">Show old</a> + </p> + </div> + + <div id="side"> + + <h1 class="big-green-banner">Click map to report a problem</h1> + + <section class="full-width"> + <menu id="problems-nav" class="tab-nav"> + <ul> + <li><a href="#current">Problems on the map</a></li> + <li><a href="#current_near">Problems nearby</a></li> + </ul> + </menu> + <ul id="current" class="issue-list-a tab"> + <li><p>No problems have been reported yet.</p></li> + </ul> + <ul id="current_near" class="issue-list-a tab"> + <li><p>No problems found.</p></li> + </ul> + </section> + </div> + + </div> + + + </body> +</html> +</html> diff --git a/www/index.html b/www/index.html index 40787ac..1e4665e 100644 --- a/www/index.html +++ b/www/index.html @@ -12,101 +12,31 @@ <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" src="js/json2.js"></script> - <script type="text/javascript" src="js/config.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" ontouchmove="touchmove(event);"> - - <div class="wrapper"> - <div class="table-cell"> - <header id="site-header" role="banner"> - <div class="container"> - <span id="site-logo"></span> - </div> - </header> - <div id="user-meta" class="hidden"></div> - - <div class="container"> - <div class="content" role="main"> - <div id="front-main"> - <div id="front-main-container"> - <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> + function onLoad() { + document.addEventListener("deviceready", onDeviceReady, false); + } + + function onDeviceReady() { + var connectionType = navigator.network.connection.type; + if (connectionType == Connection.UNKNOWN || + connectionType == Connection.NONE) { + window.location = 'frontpage-form.html'; + } else { + // There is a network connection - load the map-based + // front page: + window.location = 'frontpage-map.html'; + } + } - </div> - </div><!-- .content role=main --> - </div><!-- .container --> - </div><!-- .table-cell --> + </script> - <div class="mobile-info"> - <a href="about.html">i</a> - </div> + </head> + <body id="container" class="frontpage fullwidthpage" onload="onLoad()" ontouchmove="touchmove(event);"> - <div class="big-green-banner mobile-map-banner mobile-sign-in-banner"> - <a id="account" href="account.html">Account</a> - </div> - </div> <!-- .wrapper --> + <p>Checking if we have a network connection...</p> - <div class="spinner" id="loadingSpinner"> - <div class="bar1"></div> - <div class="bar2"></div> - <div class="bar3"></div> - <div class="bar4"></div> - <div class="bar5"></div> - <div class="bar6"></div> - <div class="bar7"></div> - <div class="bar8"></div> - <div class="bar9"></div> - <div class="bar10"></div> - <div class="bar11"></div> - <div class="bar12"></div> - </div> </body> </html> </html> diff --git a/www/old-index.html b/www/old-index.html new file mode 100644 index 0000000..cc85172 --- /dev/null +++ b/www/old-index.html @@ -0,0 +1,112 @@ +<!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" src="js/json2.js"></script> + <script type="text/javascript" src="js/config.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" ontouchmove="touchmove(event);"> + + <div class="wrapper"> + <div class="table-cell"> + <header id="site-header" role="banner"> + <div class="container"> + <span id="site-logo"></span> + </div> + </header> + + <div id="user-meta" class="hidden"></div> + + <div class="container"> + <div class="content" role="main"> + <div id="front-main"> + <div id="front-main-container"> + <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><!-- .content role=main --> + </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-sign-in-banner"> + <a id="sign_in" href="sign_in.html">Sign In</a><a id="sign_out" href="#" onclick="sign_out();">Sign Out</a> + </div> + </div> <!-- .wrapper --> + + <div class="spinner" id="loadingSpinner"> + <div class="bar1"></div> + <div class="bar2"></div> + <div class="bar3"></div> + <div class="bar4"></div> + <div class="bar5"></div> + <div class="bar6"></div> + <div class="bar7"></div> + <div class="bar8"></div> + <div class="bar9"></div> + <div class="bar10"></div> + <div class="bar11"></div> + <div class="bar12"></div> + </div> + </body> +</html> +</html> |