diff options
-rw-r--r-- | www/js/views/offline.js | 22 | ||||
-rw-r--r-- | www/templates/en/offline.html | 23 |
2 files changed, 41 insertions, 4 deletions
diff --git a/www/js/views/offline.js b/www/js/views/offline.js index d2af4e0..26b3fdb 100644 --- a/www/js/views/offline.js +++ b/www/js/views/offline.js @@ -1,10 +1,11 @@ (function (FMS, Backbone, _, $) { _.extend( FMS, { - OfflineView: FMS.FMSView.extend({ + OfflineView: FMS.LocatorView.extend({ template: 'offline', id: 'offline', prev: 'home', next: 'reports', + skipLocationCheck: true, events: { 'pagehide': 'destroy', @@ -13,7 +14,24 @@ 'click .ui-btn-right': 'onClickButtonNext', 'click #id_photo_button': 'takePhoto', 'click #id_existing': 'addPhoto', - 'click #id_del_photo_button': 'deletePhoto' + 'click #id_del_photo_button': 'deletePhoto', + 'click #locate': 'locate' + }, + + failedLocation: function(details) { + this.finishedLocating(); + this.locateCount = 21; + + $('#locate_result').html('Could not get position'); + }, + + gotLocation: function(info) { + this.finishedLocating(); + + this.model.set('lat', info.coordinates.latitude); + this.model.set('lon', info.coordinates.longitude); + + $('#locate_result').html('Got position (' + info.coordinates.latitude + ', ' + info.coordinates.longitude + ')'); }, takePhoto: function() { diff --git a/www/templates/en/offline.html b/www/templates/en/offline.html index 4c568ec..e56d325 100644 --- a/www/templates/en/offline.html +++ b/www/templates/en/offline.html @@ -3,12 +3,31 @@ <h1>Offline</h1> <a id="offline-next-btn" data-icon="arrow-r" data-iconpos="right" class="ui-btn-right">Save</a> </div> -<div class="container" data-enhance="false"> - <div class="content" role="main"> +<div class="table-cell"> + <div id="locating" class="nodisplay" style="background: white; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 3000; text-align: center; padding-top: 50%"> + <p> + Getting Your Location + </p> + + <p> + Current accuracy is <span id="accuracy">unknown</span> - we'll add the + location to the draft when it's 100m or less. + </p> + + <div style="width:100%; height:10px; border:1px solid black;"> + <div id="progress-bar" style="width:0%; background-color: grey; height:10px;"> + </div> + </div> + </div> + <div class="container" data-enhance="false"> <p> Sorry, there doesn't seem to be any internet connection. You can save this report for sending later though </p> + <p id="locate_result"> + <input type="button" class="green-btn" id="locate" value="locate" > + </p> + <input type="text" value="<% title %>" name="title" id="form_title" placeholder="Provide a title" required> <textarea rows="7" cols="26" name="detail" id="form_detail" placeholder="Please fill in details of the problem." required><% details %></textarea> |