improves map zooming

TauCetiStation · Feb 3, 2019 · 7f1e71e · 7f1e71e
1 parent 20ee1db
commit 7f1e71e
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 17 deletions.
diff --git a/ui/build.gradle b/ui/build.gradle
@@ -7,7 +7,7 @@ minifyJs {
     source = fileTree 'src/main/ui/script.js'
     dest = file 'src/main/dist/webroot/static/script.min.js'
     closure {
-        compilerOptions.languageIn = 'ECMASCRIPT6_STRICT'
+        compilerOptions.languageIn = 'ECMASCRIPT6'
         compilerOptions.languageOut = 'ECMASCRIPT5_STRICT'
     }
 }

diff --git a/ui/src/main/ui/script.js b/ui/src/main/ui/script.js
@@ -1,21 +1,8 @@
-'use strict';
-
-const OVERLAYS_DEF = [{
-    name: 'Pipes',
-    value: 'pipes'
-}, {
-    name: 'Power net',
-    value: 'power'
-}, {
-    name: 'Disposal',
-    value: 'dispo'
-}];
-
 let map = L.map('map', {
     zoomControl: false,
     attributionControl: false,
     minZoom: 3,
-    maxZoom: 6,
+    maxZoom: 7,
     maxBounds: [[0, 0], [-255, 255]],
     crs: L.CRS.Simple
 }).setView([-128, 128], 4);
@@ -25,10 +12,25 @@ L.control.attribution({
     position: 'bottomright',
     prefix: '<a href="https://taucetistation.org/">TauCeti</a>'
 }).addAttribution('Made with ♥').addTo(map);
+
+const COLLAGE_LINK = 'https://collage.taucetistation.org/#2017';
+const ARCHIVE_LINK = 'https://map-archive.taucetistation.org/#2017';
+
 L.control.attribution({
     position: 'bottomleft',
     prefix: ''
-}).addAttribution('<b><a href="https://collage.taucetistation.org/#2017" target="_blank">Collage</a></b> | <b><a href="https://map-archive.taucetistation.org/#2017" target="_blank">Archive</a></b>').addTo(map);
+}).addAttribution(`<b><a href="${COLLAGE_LINK}" target="_blank">Collage</a></b> | <b><a href="${ARCHIVE_LINK}" target="_blank">Archive</a></b>`).addTo(map);
+
+const OVERLAYS_DEF = [{
+    name: 'Pipes',
+    value: 'pipes'
+}, {
+    name: 'Power net',
+    value: 'power'
+}, {
+    name: 'Disposal',
+    value: 'dispo'
+}];
 
 let stations = {};
 let overlays = {};
@@ -73,10 +75,19 @@ map.on('baselayerchange', e => {
     currentDate = e.name;
 });
 
+map.on('zoomend', () => {
+    let el = document.getElementById('map');
+    if (map.getZoom() >= 5) {
+        el.style.imageRendering = 'pixelated';
+    } else {
+        el.style.removeProperty('image-rendering')
+    }
+});
+
 function createLayer(id, name) {
     return L.tileLayer(`/tiles/{id}/${name}/{z}/{y}/{x}?v=${window.VERSION}`, {
         id: id,
         maxNativeZoom: 5,
-        maxZoom: 6
+        maxZoom: 7
     })
 }