nakarte

commit 851d1684c92c8aee391fb72f2efa925fb2de9f4b
parent 42bca19639bcaaa7c2fb7750558f20485475c040
Author: Sergej Orlov <wladimirych@gmail.com>
Date:   Sat, 25 Feb 2017 13:15:35 +0300

[jnx] in contextmenu mark levels with red color if more then 50000 tiles expected

Diffstat:
M
src/lib/leaflet.control.jnx/index.js
 | 
29
++++++++++++++++++-----------
M
src/lib/leaflet.control.jnx/jnx-maker.js
 | 
10
+++++++---
M
src/lib/leaflet.control.jnx/style.css
 | 
4
++++

3 files changed, 29 insertions(+), 14 deletions(-)
diff --git a/src/lib/leaflet.control.jnx/index.js b/src/lib/leaflet.control.jnx/index.js
@@ -4,7 +4,7 @@ import './style.css';
 import 'lib/leaflet.control.commons';
 import {RectangleSelect} from './selector';
 import Contextmenu from 'lib/contextmenu';
-import {makeJnxFromLayer} from './jnx-maker';
+import {makeJnxFromLayer, minZoom} from './jnx-maker';
 import {saveAs} from 'browser-filesaver';
 import {notify} from 'lib/notifications';
 
@@ -41,11 +41,15 @@ L.Control.JNX = L.Control.extend({
 
         },
 
-        estimateTilesNumber: function(zoom) {
+        estimateTilesCount: function(maxZoom) {
+            let tilesCount = 0;
             const bounds = this._selector.getBounds();
-            const topLeftTile = this._map.project(bounds.getNorthWest(), zoom).divideBy(256).floor();
-            const bottomRightTile = this._map.project(bounds.getSouthEast(), zoom).divideBy(256).ceil();
-            return Math.ceil((bottomRightTile.x - topLeftTile.x) * (bottomRightTile.y - topLeftTile.y) * 4 / 3);
+            for (let zoom=minZoom(maxZoom); zoom <= maxZoom; zoom++) {
+                const topLeftTile = this._map.project(bounds.getNorthWest(), zoom).divideBy(256).floor();
+                const bottomRightTile = this._map.project(bounds.getSouthEast(), zoom).divideBy(256).ceil();
+                tilesCount += Math.ceil((bottomRightTile.x - topLeftTile.x) * (bottomRightTile.y - topLeftTile.y));
+            }
+            return tilesCount;
         },
 
         makeMenuItems: function() {
@@ -63,13 +67,16 @@ L.Control.JNX = L.Control.extend({
 
             const items = [{text: `<b>${layerName}</b>`}];
             for (let zoom = maxLevel; zoom >= minLevel; zoom -= 1) {
-                let tilesCount = this.estimateTilesNumber(zoom);
+                let tilesCount = this.estimateTilesCount(zoom);
                 let fileSizeMb = tilesCount * 0.02;
-                items.push({
-                        text: `Zoom ${zoom} (${metersPerPixel.toFixed(2)} m/pixel) &mdash; ${tilesCount} (~${fileSizeMb.toFixed(1)} Mb)`,
-                        callback: () => this.makeJnx(layer, layerName, zoom)
-                    }
-                );
+                let itemClass = tilesCount > 50000 ? 'jnx-menu-warning' : '';
+                let resolutionString = metersPerPixel.toFixed(2);
+                let sizeString = fileSizeMb.toFixed(1);
+                let item = {
+                    text: `<span class="${itemClass}">Zoom ${zoom} (${resolutionString} m/pixel) &mdash; ${tilesCount} tiles (~${sizeString} Mb)</span>`,
+                    callback: () => this.makeJnx(layer, layerName, zoom)
+                };
+                items.push(item);
                 metersPerPixel *= 2;
             }
             return items;
diff --git a/src/lib/leaflet.control.jnx/jnx-maker.js b/src/lib/leaflet.control.jnx/jnx-maker.js
@@ -11,6 +11,10 @@ const defaultXHROptions = {
     isResponseSuccess: (xhr) => xhr.status === 200 || xhr.status === 404
 };
 
+function minZoom(maxZoom) {
+    return Math.max(maxZoom - 4, 0);
+}
+
 function imageFromarrayBuffer(arr) {
     const dataUrl = 'data:image/png;base64,' + btoa(arrayBufferToString(arr));
     const image = new Image();
@@ -60,7 +64,7 @@ async function makeJnxFromLayer(srcLayer, layerName, maxZoomLevel, latLngBounds,
     const xhrQueue = new XHRQueue();
     let doStop = false;
     let error;
-    const minZoomLevel = Math.max(maxZoomLevel - 4, 0);
+    const minZoomLevel = minZoom(maxZoomLevel);
     let progressWeight = 1;
     for (let zoom = maxZoomLevel; zoom >= minZoomLevel; zoom--) {
         let pixelBounds = L.bounds(
@@ -115,4 +119,4 @@ async function makeJnxFromLayer(srcLayer, layerName, maxZoomLevel, latLngBounds,
 }
 
 
-export {makeJnxFromLayer};
-\ No newline at end of file
+export {makeJnxFromLayer, minZoom};
+\ No newline at end of file
diff --git a/src/lib/leaflet.control.jnx/style.css b/src/lib/leaflet.control.jnx/style.css
@@ -53,3 +53,6 @@
     cursor: e-resize !important;
 }
 
+.jnx-menu-warning {
+    color: red;
+}
+\ No newline at end of file