From 169f7e954c3c87bab630990b8c6e2e2d0a7d427f Mon Sep 17 00:00:00 2001
From: Yohan Boniface <yohanboniface@free.fr>
Date: Tue, 28 Feb 2023 14:08:34 +0100
Subject: [PATCH] Allow to add an overlay tilelayer

cf #71 #976
---
 umap/static/umap/js/umap.js | 40 +++++++++++++++++++++++++++++++++++--
 1 file changed, 38 insertions(+), 2 deletions(-)

diff --git a/umap/static/umap/js/umap.js b/umap/static/umap/js/umap.js
index 4d1e3bfe..d45991a3 100644
--- a/umap/static/umap/js/umap.js
+++ b/umap/static/umap/js/umap.js
@@ -1,6 +1,5 @@
 L.Map.mergeOptions({
-    base_layers: null,
-    overlay_layers: null,
+    overlay: null,
     datalayers: [],
     center: [4, 50],
     zoom: 6,
@@ -507,6 +506,7 @@ L.U.Map.include({
             // Users can put tilelayer URLs by hand, and if they add wrong {variable},
             // Leaflet throw an error, and then the map is no more editable
         }
+        this.setOverlay()
     },
 
     eachTileLayer: function (method, context) {
@@ -522,6 +522,20 @@ L.U.Map.include({
         }
     },
 
+    setOverlay: function () {
+        if (!this.options.overlay || !this.options.overlay.url_template) return;
+        var overlay = this.createTileLayer(this.options.overlay);
+        try {
+            this.addLayer(overlay);
+            if (this.overlay) this.removeLayer(this.overlay);
+            this.overlay = overlay;
+        } catch (e) {
+            this.removeLayer(overlay);
+            console.error(e);
+            this.ui.alert({content: L._('Error in the overlay URL') + ': ' + overlay._url, level: 'error'});
+        }
+    },
+
     initCenter: function () {
         if (this.options.hash && this._hash.parseHash(location.hash)) {
             // FIXME An invalid hash will cause the load to fail
@@ -1059,6 +1073,7 @@ L.U.Map.include({
         'description',
         'licence',
         'tilelayer',
+        'overlay',
         'limitBounds',
         'color',
         'iconClass',
@@ -1334,6 +1349,26 @@ L.U.Map.include({
         customTilelayer.appendChild(builder.build());
     },
 
+    _editOverlay: function (container) {
+        if (!L.Util.isObject(this.options.overlay)) {
+            this.options.overlay = {};
+        }
+        var overlayFields = [
+            ['options.overlay.url_template', {handler: 'BlurInput', helpText: L._('Supported scheme') + ': http://{s}.domain.com/{z}/{x}/{y}.png', placeholder: 'url', helpText: L._('Background overlay url')}],
+            ['options.overlay.maxZoom', {handler: 'BlurIntInput', placeholder: L._('max zoom')}],
+            ['options.overlay.minZoom', {handler: 'BlurIntInput', placeholder: L._('min zoom')}],
+            ['options.overlay.attribution', {handler: 'BlurInput', placeholder: L._('attribution')}],
+            ['options.overlay.opacity', {handler: 'Range', min: 0, max: 1, step: 'any', placeholder: L._('opacity')}],
+            ['options.overlay.tms', {handler: 'Switch', label: L._('TMS format')}]
+        ];
+        var overlay = L.DomUtil.createFieldset(container, L._('Custom overlay'));
+        builder = new L.U.FormBuilder(this, overlayFields, {
+            callback: this.initTileLayers,
+            callbackContext: this
+        });
+        overlay.appendChild(builder.build());
+    },
+
     _editBounds: function (container) {
         if (!L.Util.isObject(this.options.limitBounds)) {
             this.options.limitBounds = {};
@@ -1460,6 +1495,7 @@ L.U.Map.include({
         this._editDefaultProperties(container);
         this._editInteractionsProperties(container);
         this._editTilelayer(container);
+        this._editOverlay(container);
         this._editBounds(container);
         this._editSlideshow(container);
         this._editCredits(container);