fix zooming and improve caching

1 files changed, 33 insertions, 16 deletions

diff --git a/snap.html b/snap.html
index 8b2e2e1..af63bc2 100755
--- a/snap.html
+++ b/snap.html
@@ -83,7 +83,6 @@
 
                 // initialize leaflet
                 map = L.map('map', {
-                    maxZoom: 21,
                     keyboard: false,
                     closePopupOnClick: false
                 });
@@ -96,40 +95,58 @@
                     });
                 });
 
-                var state = "wifi"; // TODO: check other states than listed below
+                var state = 'desktop'; // TODO: check other states than listed below
                 // TODO: too much repeated code, shorten the url part
-                if ("connection" in navigator) {
+                if ('connection' in navigator) {
                     // mobile cordova app
                     state = navigator.connection.type;
                 }
                 console.log('Using tile layer appropriate for ' + state);
-                // download everything and in high resolution
-                if (state == 'wifi') {
-                    layer = L.tileLayer('http://api.tiles.mapbox.com/v4/mapbox.streets/{z}/{x}/{y}@2x.png?access_token=pk.eyJ1IjoiY29kZS13dnMiLCJhIjoielU1N2dQayJ9.miUjtJaW7Y_Xx46dC6m0LA', {
+
+                // mobile resolution is JPG 70% (smallest)
+                var url = 'http://api.tiles.mapbox.com/v4/mapbox.streets/{z}/{x}/{y}.jpg70?access_token=pk.eyJ1IjoiY29kZS13dnMiLCJhIjoielU1N2dQayJ9.miUjtJaW7Y_Xx46dC6m0LA';
+                var attribution = '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors';
+
+                if (state == 'desktop') {
+                    // download everything and in high resolution
+                    layer = L.tileLayer('http://api.tiles.mapbox.com/v4/mapbox.streets/{z}/{x}/{y}@2x.jpg?access_token=pk.eyJ1IjoiY29kZS13dnMiLCJhIjoielU1N2dQayJ9.miUjtJaW7Y_Xx46dC6m0LA', {
+                        useCache: true,
+                        cacheMaxAge: 604800000, // one week
+                        maxZoom: 21,
+                        maxNativeZoom: 19,
+                        attribution: attribution
+                    });
+                    new OSMBuildings(map).load();
+                } else if (state == 'wifi') {
+                    // download low-res and cache as much as possible
+                    // with wifi, fancy buildings are ok
+                    layer = L.tileLayer(url, {
                         useCache: true,
                         cacheMaxAge: 604800000, // one week
+                        maxZoom: 21,
                         maxNativeZoom: 19,
-                        attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
+                        attribution: attribution
                     });
                     new OSMBuildings(map).load();
-                // download low-res and cache as much as possible
-                // we do not need OSMBuildings here
-                } else if (state == "cellular") {
-                    layer = L.tileLayer('http://api.tiles.mapbox.com/v4/mapbox.streets/{z}/{x}/{y}.jpg70?access_token=pk.eyJ1IjoiY29kZS13dnMiLCJhIjoielU1N2dQayJ9.miUjtJaW7Y_Xx46dC6m0LA', {
+                } else if (state == 'cellular') {
+                    // we do not need OSMBuildings here
+                    layer = L.tileLayer(url, {
                         useCache: true,
                         cacheMaxAge: 604800000, // one week
+                        maxZoom: 21,
                         maxNativeZoom: 19,
-                        attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
+                        attribution: attribution
                     });
-                // shit, we're offline - let's hope there is something cached
-                // OSMBuildings won't work, anyway
                 } else {
-                    layer = L.tileLayer('http://api.tiles.mapbox.com/v4/mapbox.streets/{z}/{x}/{y}.jpg70?access_token=pk.eyJ1IjoiY29kZS13dnMiLCJhIjoielU1N2dQayJ9.miUjtJaW7Y_Xx46dC6m0LA', {
+                    // shit, we're offline - let's hope there is something cached
+                    // OSMBuildings won't work, anyway
+                    layer = L.tileLayer(url, {
                         useCache: true,
                         useOnlyCache: true,
                         cacheMaxAge: 604800000, // one week
+                        maxZoom: 21,
                         maxNativeZoom: 19,
-                        attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
+                        attribution: attribution
                     });
                 }
                 layer.addTo(map);