Browse Source

Add terrain icon next to weather (closes #4), update and cleanup code to handle it.

Replaced old terrain graphics with new b/w icons.
Skylar Ittner 2 years ago
parent
commit
466951bca5

BIN
res/screen/android/drawable-hdpi/logo.9.png View File


BIN
res/screen/android/drawable-mdpi/logo.9.png View File


BIN
res/screen/android/drawable-xhdpi/logo.9.png View File


BIN
res/screen/android/drawable-xxhdpi/logo.9.png View File


BIN
res/screen/android/drawable-xxxhdpi/logo.9.png View File


BIN
www/assets/terrain/-1.png View File


BIN
www/assets/terrain/0.png View File


BIN
www/assets/terrain/1.png View File


BIN
www/assets/terrain/10.png View File


BIN
www/assets/terrain/11.png View File


BIN
www/assets/terrain/12.png View File


BIN
www/assets/terrain/13.png View File


BIN
www/assets/terrain/2.png View File


BIN
www/assets/terrain/21.png View File


BIN
www/assets/terrain/22.png View File


BIN
www/assets/terrain/23.png View File


BIN
www/assets/terrain/24.png View File


BIN
www/assets/terrain/3.png View File


BIN
www/assets/terrain/31.png View File


BIN
www/assets/terrain/4.png View File


BIN
www/assets/terrain/41.png View File


BIN
www/assets/terrain/42.png View File


BIN
www/assets/terrain/43.png View File


BIN
www/assets/terrain/5.png View File


BIN
www/assets/terrain/52.png View File


BIN
www/assets/terrain/6.png View File


BIN
www/assets/terrain/7.png View File


BIN
www/assets/terrain/71.png View File


BIN
www/assets/terrain/8.png View File


BIN
www/assets/terrain/81.png View File


BIN
www/assets/terrain/82.png View File


BIN
www/assets/terrain/9.png View File


BIN
www/assets/terrain/90.png View File


BIN
www/assets/terrain/95.png View File


+ 5
- 0
www/css/main.css View File

@@ -175,6 +175,11 @@ body {
175 175
     float: right;
176 176
 }
177 177
 
178
+#terrainicon {
179
+    margin-top: -15px;
180
+    height: 20px;
181
+}
182
+
178 183
 #energybar-container {
179 184
     position: absolute;
180 185
     top: 30px;

+ 9
- 30
www/js/location.js View File

@@ -18,16 +18,15 @@
18 18
 
19 19
 
20 20
 //////////////////////////////////////////////
21
-//  GPS and terrain stuff
21
+//  GPS and map stuff
22 22
 //////////////////////////////////////////////
23 23
 
24 24
 /**
25
- * Handles GPS and terrain data.
25
+ * Handles GPS and map data.
26 26
  */
27 27
 
28 28
 // Globals
29 29
 var lockGot = false;
30
-var terrainGot = false;
31 30
 var latitude = 0.0000;
32 31
 var longitude = 0.0000;
33 32
 var gpsaccuracy = 9999;
@@ -36,7 +35,6 @@ var requiredaccuracy = 40;
36 35
 
37 36
 var fetchplacecounter = 0;
38 37
 var lastgpstime = 0;
39
-var terraintypeid = 0;
40 38
 var map = L.map('map');
41 39
 var tileurl = "http://tile.stamen.com/terrain/{z}/{x}/{y}.jpg";
42 40
 map.setZoom(17);
@@ -176,8 +174,9 @@ function openPlace(feature) {
176 174
  * Hide the loading overlay if everything is loaded, otherwise do nothing
177 175
  */
178 176
 function hideLoading() {
179
-    if (lockGot && terrainGot && gpsaccuracy < requiredaccuracy && $('#loading').css('display') !== 'none') {
177
+    if (lockGot && gpsaccuracy < requiredaccuracy && $('#loading').css('display') !== 'none') {
180 178
         getWeather();
179
+        getTerrain();
181 180
         $('#loading').fadeOut('slow', function () {
182 181
             $('#loading').css('display', 'none');
183 182
             updateStatusBarColor();
@@ -197,25 +196,6 @@ var updatePosition = function (position) {
197 196
     }
198 197
     mapPos(latitude, longitude);
199 198
 };
200
-var updateTerrain = function (position) {
201
-    latitude = position.coords.latitude;
202
-    longitude = position.coords.longitude;
203
-    lastgpstime = position.timestamp;
204
-    gpsaccuracy = position.coords.accuracy;
205
-    var rasterurl = "http://earth.apis.netsyms.net/terrain.php?format=json&lat="
206
-            + latitude + "&long=" + longitude;
207
-    $.get(rasterurl, function (data) {
208
-        if (data.status === 'OK') {
209
-            terraintypeid = data.typeid;
210
-            terraintypename = data.typename;
211
-            $('#terrain-image').attr('src', 'assets/terrain/' + terraintypeid + '.png');
212
-            terrainGot = true;
213
-            hideLoading();
214
-        }
215
-    }, "json").fail(function (err) {
216
-        $('#terrain-image').attr('src', 'assets/terrain/0.png');
217
-    });
218
-};
219 199
 function pingServer() {
220 200
     if (lockGot && gpsaccuracy < requiredaccuracy) {
221 201
         $.get(mkApiUrl('ping') + "?user=" + username + "&lat=" + latitude + "&long=" + longitude);
@@ -231,22 +211,21 @@ function popDiagData() {
231 211
             "\nLongitude: " + longitude +
232 212
             "\nAccuracy: " + gpsaccuracy +
233 213
             "\nWeather: " + rawWeatherData.temperature + " F, " + rawWeatherData.summary + ", " + rawWeatherData.windSpeed + " mph" +
234
-            "\nTerrain: " + terraintypename + " (" + terraintypeid + ")",
214
+            "\nTerrain: " + terrainName + " (" + terrainType + ")",
235 215
             null,
236
-            "Information",
216
+            "World Info",
237 217
             "Close");
238 218
 }
239 219
 // Initial GPS position and stuff
240
-navigator.geolocation.getCurrentPosition(updateTerrain, onError, {timeout: 10000, enableHighAccuracy: true});
220
+navigator.geolocation.getCurrentPosition(updatePosition, onError, {timeout: 10000, enableHighAccuracy: true});
241 221
 // Update position
242 222
 setInterval(function () {
243 223
     navigator.geolocation.getCurrentPosition(updatePosition, onError, {timeout: 10000, enableHighAccuracy: true});
244 224
 }, 1000);
245
-// Update position + terrain
225
+// Update places
246 226
 setInterval(function () {
247
-    navigator.geolocation.getCurrentPosition(updateTerrain, onError, {timeout: 10000, enableHighAccuracy: true});
248 227
     loadPlaces(latitude, longitude);
249
-}, 1000 * 20);
228
+}, 1000 * 15);
250 229
 // Ping the server with coordinates
251 230
 setInterval(pingServer, 5000);
252 231
 // Show error if it's taking too long

+ 21
- 0
www/js/user.js View File

@@ -21,6 +21,8 @@
21 21
 //////////////////////////////////////////////
22 22
 
23 23
 var rawWeatherData = [];
24
+var terrainType = -1;
25
+var terrainName = "Other";
24 26
 
25 27
 /*
26 28
  * Handles general server communication.
@@ -82,6 +84,24 @@ function getWeather() {
82 84
         var currently = data.currently;
83 85
         rawWeatherData = currently;
84 86
         skycons.set("weathericon", currently.icon);
87
+        skycons.play();
88
+    });
89
+}
90
+
91
+function getTerrain() {
92
+    $.getJSON(mkApiUrl('getterrain'), {
93
+        lat: latitude,
94
+        long: longitude
95
+    }, function (data) {
96
+        var terrainid = -1;
97
+        var terrainstr = "Other";
98
+        if (data.status === "OK") {
99
+            terrainid = data.type;
100
+            terrainstr = data.name;
101
+        }
102
+        $('#terrainicon').attr('src', 'assets/terrain/' + terrainid + '.png');
103
+        terrainType = terrainid;
104
+        terrainName = terrainstr;
85 105
     });
86 106
 }
87 107
 
@@ -104,6 +124,7 @@ setInterval(function () {
104 124
 }, 3000);
105 125
 setInterval(function () {
106 126
     getWeather();
127
+    getTerrain();
107 128
 }, 30 * 1000);
108 129
 // Send chat messages
109 130
 $("#chatsendform").submit(function (event) {

+ 4
- 1
www/screens/home.html View File

@@ -43,7 +43,10 @@
43 43
 <div id="overlay-top">
44 44
     <p id="topbar">
45 45
         <span id="namedisp" onclick="openMenu('profile')"></span>
46
-        <span id="worldinfo" onclick="popDiagData()"><canvas id="weathericon" width="22" height="22"></canvas></span>
46
+        <span id="worldinfo" onclick="popDiagData()">
47
+            <canvas id="weathericon" width="22" height="22"></canvas> 
48
+            <img id="terrainicon" src="assets/terrain/-1.png" />
49
+        </span>
47 50
     </p>
48 51
     <div class="progress" id="energybar-container">
49 52
         <div id="energybar" class="progress-bar" role="progressbar" >

Loading…
Cancel
Save