From 8fbb3c9fc7e3f7090e2e045e8b02c37b5272d5d5 Mon Sep 17 00:00:00 2001
From: Julien Veyssier <eneiluj@gmx.fr>
Date: Mon, 12 Jun 2017 18:46:16 +0200
Subject: [PATCH] refs #22 support transparent and opacity fields for all tile
 server types in tileservers.php

---
 controller/tileservers.php |  8 ++++++--
 js/gpxedit.js              | 36 ++++++++++++++++++++++++++++++++----
 templates/gpxcontent.php   | 32 +++++++++-----------------------
 3 files changed, 47 insertions(+), 29 deletions(-)

diff --git a/controller/tileservers.php b/controller/tileservers.php
index 9b31997..5247f70 100644
--- a/controller/tileservers.php
+++ b/controller/tileservers.php
@@ -7,7 +7,9 @@ $baseTileServers = [
     //    'url' => '',
     //    'attribution' => '',
     //    'minzoom' => '',
-    //    'maxzoom' => ''
+    //    'maxzoom' => '',
+    //    'opacity' => '0-1',
+    //    'transparent' => 'true|false'
     //),
     //Array(
     //    'name' => 'tilewms',
@@ -135,7 +137,9 @@ $baseTileServers = [
         'url' => 'http://{s}.tile.openstreetmap.fr/route500/{z}/{x}/{y}.png',
         'attribution' => '&copy, Tiles © <a href="http://www.openstreetmap.fr">OpenStreetMap France</a>',
         'minzoom' => '1',
-        'maxzoom' => '20'
+        'maxzoom' => '20',
+        'transparent' => 'true',
+        'opacity' => '0.5'
     ),
 ];
 ?>
diff --git a/js/gpxedit.js b/js/gpxedit.js
index 79b8b04..b161e90 100644
--- a/js/gpxedit.js
+++ b/js/gpxedit.js
@@ -207,7 +207,15 @@
             var minz = parseInt($(this).attr('minzoom'));
             var maxz = parseInt($(this).attr('maxzoom'));
             var sattrib = $(this).attr('attribution');
-            baseLayers[sname] = new L.TileLayer(surl, {minZoom: minz, maxZoom: maxz, attribution: sattrib});
+            var stransparent = ($(this).attr('transparent') === 'true');
+            var sopacity = $(this).attr('opacity');
+            if (sopacity !== '') {
+                sopacity = parseFloat(sopacity);
+            }
+            else {
+                sopacity = 1;
+            }
+            baseLayers[sname] = new L.TileLayer(surl, {minZoom: minz, maxZoom: maxz, attribution: sattrib, opacity: sopacity, transparent: stransparent});
         });
         $('#basetileservers li[type=tilewms]').each(function() {
             var sname = $(this).attr('name');
@@ -216,7 +224,13 @@
             var sversion = $(this).attr('version') || '1.1.1';
             var stransparent = ($(this).attr('transparent') === 'true');
             var sformat = $(this).attr('format') || 'image/png';
-            var sopacity = $(this).attr('opacity') || 1;
+            var sopacity = $(this).attr('opacity');
+            if (sopacity !== '') {
+                sopacity = parseFloat(sopacity);
+            }
+            else {
+                sopacity = 1;
+            }
             var sattrib = $(this).attr('attribution') || '';
             baseLayers[sname] = new L.tileLayer.wms(surl, {layers: slayers, version: sversion, transparent: stransparent, opacity: sopacity, format: sformat, attribution: sattrib});
         });
@@ -238,7 +252,15 @@
             var minz = parseInt($(this).attr('minzoom'));
             var maxz = parseInt($(this).attr('maxzoom'));
             var sattrib = $(this).attr('attribution');
-            baseOverlays[sname] = new L.TileLayer(surl, {minZoom: minz, maxZoom: maxz, attribution: sattrib});
+            var stransparent = ($(this).attr('transparent') === 'true');
+            var sopacity = $(this).attr('opacity');
+            if (sopacity !== '') {
+                sopacity = parseFloat(sopacity);
+            }
+            else {
+                sopacity = 1;
+            }
+            baseOverlays[sname] = new L.TileLayer(surl, {minZoom: minz, maxZoom: maxz, attribution: sattrib, opacity: sopacity, transparent: stransparent});
         });
         $('#basetileservers li[type=overlaywms]').each(function() {
             var sname = $(this).attr('name');
@@ -247,7 +269,13 @@
             var sversion = $(this).attr('version') || '1.1.1';
             var stransparent = ($(this).attr('transparent') === 'true');
             var sformat = $(this).attr('format') || 'image/png';
-            var sopacity = $(this).attr('opacity') || 1;
+            var sopacity = $(this).attr('opacity');
+            if (sopacity !== '') {
+                sopacity = parseFloat(sopacity);
+            }
+            else {
+                sopacity = 1;
+            }
             var sattrib = $(this).attr('attribution') || '';
             baseOverlays[sname] = new L.tileLayer.wms(surl, {layers: slayers, version: sversion, transparent: stransparent, opacity: sopacity, format: sformat, attribution: sattrib});
         });
diff --git a/templates/gpxcontent.php b/templates/gpxcontent.php
index 575f9b7..73fb43d 100644
--- a/templates/gpxcontent.php
+++ b/templates/gpxcontent.php
@@ -81,29 +81,15 @@ foreach($_['extrasymbols'] as $symbol){
 echo '</ul>'."\n";
 echo '<ul id="basetileservers" style="display:none">';
 foreach($_['basetileservers'] as $ts){
-    echo '<li name="';
-    p($ts['name']);
-    echo '" type="';
-    p($ts['type']);
-    echo '" url="';
-    p($ts['url']);
-    echo '" layers="';
-    p($ts['layers']);
-    echo '" version="';
-    p($ts['version']);
-    echo '" format="';
-    p($ts['format']);
-    echo '" opacity="';
-    p($ts['opacity']);
-    echo '" transparent="';
-    p($ts['transparent']);
-    echo '" minzoom="';
-    p($ts['minzoom']);
-    echo '" maxzoom="';
-    p($ts['maxzoom']);
-    echo '" attribution="';
-    p($ts['attribution']);
-    echo '"></li>';
+    echo '<li';
+    foreach (Array('name', 'type', 'url', 'layers', 'version', 'format', 'opacity', 'transparent', 'minzoom', 'maxzoom', 'attribution') as $field) {
+        if (array_key_exists($field, $ts)) {
+            echo ' '.$field.'="';
+            p($ts[$field]);
+            echo '"';
+        }
+    }
+    echo '></li>';
 }
 echo '</ul>'."\n";