diff --git a/web/client/components/map/openlayers/plugins/TileProviderLayer.js b/web/client/components/map/openlayers/plugins/TileProviderLayer.js index 968756f326..54f5c45879 100644 --- a/web/client/components/map/openlayers/plugins/TileProviderLayer.js +++ b/web/client/components/map/openlayers/plugins/TileProviderLayer.js @@ -10,31 +10,8 @@ var Layers = require('../../../../utils/openlayers/Layers'); var ol = require('openlayers'); var TileProvider = require('../../../../utils/TileConfigProvider'); var CoordinatesUtils = require('../../../../utils/CoordinatesUtils'); +const { getUrls, template } = require('../../../../utils/TileProviderUtils'); - -function template(str, data) { - - return str.replace(/(?!(\{?[zyx]?\}))\{*([\w_]+)*\}/g, function() { - let st = arguments[0]; - let key = arguments[1] ? arguments[1] : arguments[2]; - let value = data[key]; - - if (value === undefined) { - throw new Error('No value provided for variable ' + st); - - } else if (typeof value === 'function') { - value = value(data); - } - return value; - }); -} -function getUrls(opt) { - let url = opt.url; - if (opt.subdomains) { - return opt.subdomains.map( c => template(url.replace("{s}", c), opt)); - } - return ['a', 'b', 'c'].map( c => template(url.replace("{s}", c), opt)); -} /*eslint-disable */ function lBoundsToOlExtent(bounds, destPrj){ var [ [ miny, minx], [ maxy, maxx ] ] = bounds; diff --git a/web/client/utils/ConfigProvider.js b/web/client/utils/ConfigProvider.js index db7cfa3a41..9ddf2d1a16 100644 --- a/web/client/utils/ConfigProvider.js +++ b/web/client/utils/ConfigProvider.js @@ -151,7 +151,7 @@ const CONFIGPROVIDER = { attribution: 'Tiles Courtesy of MapQuest — ' + 'Map data {attribution.OpenStreetMap}', - subdomains: '1234' + subdomains: ['1', '2', '3', '4'] }, variants: { OSM: {}, @@ -179,14 +179,14 @@ const CONFIGPROVIDER = { attribution: 'Imagery from MapBox — ' + 'Map data {attribution.OpenStreetMap}', - subdomains: 'abcd' + subdomains: ['a', 'b', 'c', 'd'] } }, MapBoxStyle: { url: 'https://api.mapbox.com/styles/v1/mapbox/{source}/tiles/{z}/{x}/{y}?access_token={accessToken}', options: { attribution: 'Imagery from MapBox', - subdomains: 'abcd' + subdomains: ['a', 'b', 'c', 'd'] } }, Stamen: { @@ -199,7 +199,7 @@ const CONFIGPROVIDER = { credits: { text: 'Map tiles by Stamen Design, under CC BY 3.0. Data by OpenStreetMap, under CC BY SA' }, - subdomains: 'abcd', + subdomains: ['a', 'b', 'c', 'd'], minZoom: 0, maxZoom: 20, maxNativeZoom: 20, @@ -386,7 +386,7 @@ const CONFIGPROVIDER = { options: { attribution: 'Map © 1987-2014 HERE', - subdomains: '1234', + subdomains: ['1', '2', '3', '4'], mapID: 'newest', 'app_id': '', 'app_code': '', @@ -448,7 +448,7 @@ const CONFIGPROVIDER = { options: { attribution: '©2012 Esri & Stamen, Data from OSM and Natural Earth', - subdomains: '0123', + subdomains: ['0', '1', '2', '3'], minZoom: 2, maxZoom: 18, maxNativeZoom: 18, @@ -470,7 +470,7 @@ const CONFIGPROVIDER = { minZoom: 8, maxZoom: 16, maxNativeZoom: 16, - subdomains: '1234', + subdomains: ['1', '2', '3', '4'], bounds: [[47.204642, 15.996093], [49.830896, 22.576904]], attribution: '{attribution.OpenStreetMap}, vizualization CC-By-SA 2.0 Freemap.sk' @@ -488,7 +488,7 @@ const CONFIGPROVIDER = { url: 'http://{s}.basemaps.cartocdn.com/{variant}/{z}/{x}/{y}.png', options: { attribution: '{attribution.OpenStreetMap} © CartoDB', - subdomains: 'abcd', + subdomains: ['a', 'b', 'c', 'd'], maxZoom: 19, maxNativeZoom: 19, variant: 'light_all' @@ -629,7 +629,7 @@ const CONFIGPROVIDER = { minZoom: 1, maxZoom: 18, maxNativeZoom: 18, - subdomains: '0123' + subdomains: ['0', '1', '2', '3'] }, variants: { // OS 1:1m to 1:10K, 1900s diff --git a/web/client/utils/TileProviderUtils.js b/web/client/utils/TileProviderUtils.js new file mode 100644 index 0000000000..6b51a5be35 --- /dev/null +++ b/web/client/utils/TileProviderUtils.js @@ -0,0 +1,43 @@ +const { isArray } = require('lodash'); + +function template(str = "", data = {}) { + return str.replace(/(?!(\{?[zyx]?\}))\{*([\w_]+)*\}/g, function() { + let st = arguments[0]; + let key = arguments[1] ? arguments[1] : arguments[2]; + let value = data[key]; + + if (value === undefined) { + throw new Error('No value provided for variable ' + st); + + } else if (typeof value === 'function') { + value = value(data); + } + return value; + }); +} + +/** + * it will replace a wildcard with each subdomain + * @param opt options to use + * @return array of urls +*/ +function getUrls(opt = {}) { + let url = opt.url || ""; + let subdomains = opt.subdomains || ""; + + if (subdomains) { + // subdomains can be a string or an array of chars + if (typeof subdomains === "string") { + subdomains = subdomains.split(""); + } + if (isArray(subdomains)) { + return subdomains.map( c => template(url.replace("{s}", c), opt)); + } + } + return ['a', 'b', 'c'].map( c => template(url.replace("{s}", c), opt)); +} + +module.exports = { + getUrls, + template +}; diff --git a/web/client/utils/__tests__/TileProviderUtils-test.js b/web/client/utils/__tests__/TileProviderUtils-test.js new file mode 100644 index 0000000000..2cd621a92b --- /dev/null +++ b/web/client/utils/__tests__/TileProviderUtils-test.js @@ -0,0 +1,61 @@ +/* + * Copyright 2018, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. + */ +const expect = require('expect'); + +const {getUrls, template} = require('../TileProviderUtils'); +const url = "//stamen-tiles-{s}.a.ssl.fastly.net/{variant}/{z}/{x}/{y}.{ext}"; +const urlReplaced = "//stamen-tiles-a.a.ssl.fastly.net/{variant}/{z}/{x}/{y}.{ext}"; + +const optArray = { + subdomains: ['a', 'b', 'c', 'd'], + variant: 'toner', // this can't be missing + ext: 'png', // this can't be missing + url +}; +describe('Test the TileProviderUtils', () => { + it('test getUrls defaults', () => { + let urls = getUrls(); + expect(urls.length).toBe(3); + urls.forEach((u) => { + expect(u).toBe(""); + }); + }); + it('test getUrls with String as subdomains', () => { + const opt = { + subdomains: 'abcd', + variant: 'toner', // this can't be missing + ext: 'png', // this can't be missing + url + }; + let urls = getUrls(opt); + expect(urls.length).toBe(opt.subdomains.length); + urls.forEach((u, i) => { + expect(u.indexOf("//stamen-tiles-" + opt.subdomains[i])).toBe(0); + }); + }); + it('test getUrls with array of char as subdomains', () => { + + let urls = getUrls(optArray); + expect(urls.length).toBe(optArray.subdomains.length); + urls.forEach((u, i) => { + expect(u.indexOf("//stamen-tiles-" + optArray.subdomains[i])).toBe(0); + }); + }); + + it('test template defaults', () => { + const value = template(); + expect(value).toBe(""); + }); + it('test template ', () => { + const value = template(urlReplaced, optArray); + expect(value).toBe("//stamen-tiles-a.a.ssl.fastly.net/" + optArray.variant + "/{z}/{x}/{y}." + optArray.ext); + // expect().toBe(); + }); + + +});