MapViewTemplate: TileServer configuration set to MapTiler by default (with no api key)

entity/Organisation_entity/entityfields/map_config/valueProcess.js

-import("system.translate");
-import("system.vars");
-import("system.util");
-import("system.fileIO");
 import("system.result");
+import("system.vars");
+import("system.vars");
+import("MapViewTemplate_lib");
 
-/* !WARNING! This openstreetmap TileLayer Server is only used for demonstration purposes and to show how this map template configuration works.
- * From the tile-usage-policy: 
- * "Heavy use (e.g. distributing an app that uses tiles from openstreetmap.org) is forbidden without prior permission"
- * See more about the openstreetmap policy here:
- * https://operations.osmfoundation.org/policies/tiles/
- *
- * This means you have to change the following tile source for using the MapViewTemplate in any real scenario (Dev-Serers, Test-Servers, 
- * Production-Servers and so on).
- */
-var licenseCaption = translate.text("License");
-var contributionCaption = translate.text("Contribute map data");
-var selectedTile = {
-    title: "Open Street Map",
-    url: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
-    attribution: translate.withArguments("Map data © %0 contributors | %1 | %2", [
-        "<a href=\"https://openstreetmap.org\">OpenStreetMap</a>", 
-        "<a href=\"https://www.openstreetmap.org/copyright\">" + licenseCaption + "</a>", 
-        "<a href=\"https://www.openstreetmap.org/fixthemap\">" + contributionCaption + "</a>"])
-};
-
+var config = MapViewConfigUtils.getBaseConfiguration();
+config.startingCenterPosition.lat = parseFloat(vars.get("$param.MapViewCenterLat_param"));
+config.startingCenterPosition.lon = parseFloat(vars.get("$param.MapViewCenterLon_param"));
+config.startingCenterPosition.zoomLevel = 5;
 
-var config = {
-    startingCenterPosition : {
-        lat: parseFloat(vars.get("$param.MapViewCenterLat_param")),
-        lon: parseFloat(vars.get("$param.MapViewCenterLon_param")),
-        zoomLevel: 5,
-        //but let's try to locate the users posistion for a better view
-        autoLocate: true
-    },
-    boundaries: {
-        minZoom: 0,
-        maxZoom: 20
-    },
-    tiles: [
-        /*add more tile layer sources here*/
-    ]
-};
+var tileConfig = MapViewConfigUtils.getMainTileConfig();
+config.tiles = tileConfig;
 
 //when opening the AroundLocation view we do want to have the source organisation as center, so let's not overwrite the starting center position by 
 //looking for the users current location
@@ -50,7 +19,5 @@ if (vars.get("$param.MapViewAdditionalFeatures_param"))
    config.startingCenterPosition.autoLocate = false;
 }
 
-config.tiles.push(selectedTile);//the last tile layer will be always selected by leaflet, so let's push it here
-
 var res = JSON.stringify(config);
 result.string(res);
\ No newline at end of file

preferences/_____PREFERENCES_PROJECT/_____PREFERENCES_PROJECT.aod

@@ -85,6 +85,10 @@
       <name>dataCaching.client.forceDisable</name>
       <description>Enabling this option will disable the per-client-context data-cache within the customzing (for exameple the caching of Keywords). This is usefull if you're testing and want to frequently add data like keywords, etc. which are cached which help of the "DataCaching_lib".</description>
     </customBooleanProperty>
+    <customStringProperty>
+      <name>geo.maptiler.apikey</name>
+      <description>An API Key for using Maptiler functions. For example for the MapViewTemplate.</description>
+    </customStringProperty>
   </customConfigProperties>
   <customProperties>
     <customBooleanProperty>

process/MapViewTemplate_lib/MapViewTemplate_lib.aod

+<?xml version="1.0" encoding="UTF-8"?>
+<process xmlns="http://www.adito.de/2018/ao/Model" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" VERSION="1.2.2" xsi:schemaLocation="http://www.adito.de/2018/ao/Model adito://models/xsd/process/1.2.2">
+  <name>MapViewTemplate_lib</name>
+  <majorModelMode>DISTRIBUTED</majorModelMode>
+  <process>%aditoprj%/process/MapViewTemplate_lib/process.js</process>
+  <variants>
+    <element>LIBRARY</element>
+  </variants>
+</process>

process/MapViewTemplate_lib/process.js

+import("system.project");
+import("system.translate");
+
+/**
+ * Provides utility functions for the MapViewTemplate <br/>
+ * <b><u>Don't instanciate this!</u></b>
+ * 
+ * @class
+ */
+function MapViewConfigUtils(){}
+
+/**
+ * Returns a basic object for the configuration of a MapViewTemplate, so this is a starting point of every map configuration. <br/>
+ * Starting coordinates are 0,0 but autoLocation is enabled. <br/
+ * Zoom ist between 1-20. <br/
+ * There are no tiles defined by default. <br/
+ * @return {Object} mutable object with the default configuration 
+ */
+MapViewConfigUtils.getBaseConfiguration = function()
+{
+    var config = {
+        startingCenterPosition : {
+            lat: 0,
+            lon: 0,
+            autoLocate: true
+        },
+        boundaries: {
+            minZoom: 1,
+            maxZoom: 20
+        },
+        tiles: []
+    };
+
+    return config;
+};
+
+/**
+ * Returns the tile configs that are considered to be mainly used in the project.<br/>
+ * 
+ * @return {Array} Array of map tile configs - these are possible map tile types where the user can choose from.
+ */
+MapViewConfigUtils.getMainTileConfig = function ()
+{
+    var res = [];
+    //add more tile configs here if you want, the bottom tile will be the by default selected tileconfig
+    res.push(MapViewConfigUtils.getTileConfigMapTiler());
+    return res;
+};
+
+/**
+ * Returns a tile configuration for an open street map.<br/>
+ * !WARNING! The openstreetmap TileLayer Server forbids heavy and commercial use. This is only for showcase purposes. Never use this in real scenarios.
+ * @return {Object} Configuration as mutable object with a title, url and attribution that can be added to the tiles-property of a MapViewTemplate-config
+ */
+MapViewConfigUtils.getTileConfigOSM = function ()
+{
+    /* !WARNING! This openstreetmap TileLayer Server is only used for demonstration purposes and to show how this map template configuration works.
+     * From the tile-usage-policy: 
+     * "Heavy use (e.g. distributing an app that uses tiles from openstreetmap.org) is forbidden without prior permission"
+     * See more about the openstreetmap policy here:
+     * https://operations.osmfoundation.org/policies/tiles/
+     *
+     * This means you have to change the following tile source for using the MapViewTemplate in any real scenario (Dev-Serers, Test-Servers, 
+     * Production-Servers and so on).
+     */
+    var licenseCaption = translate.text("License");
+    var contributionCaption = translate.text("Contribute map data");
+    var tile = {
+        title: "Open Street Map",
+        url: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
+        attribution: translate.withArguments("Map data © %0 contributors | %1 | %2", [
+            "<a href=\"https://openstreetmap.org\">OpenStreetMap</a>", 
+            "<a href=\"https://www.openstreetmap.org/copyright\">" + licenseCaption + "</a>", 
+            "<a href=\"https://www.openstreetmap.org/fixthemap\">" + contributionCaption + "</a>"])
+    };
+    return tile;
+};
+
+/**
+ * Returns a tile configuration for a maptiler map.<br/>
+ * The required API-key is retreived from the custom _____CONFIGURATION value with the name "geo.maptiler.apikey". <br/>
+ * Uses the "streets" layer.<br/>
+ * @return {Object} Configuration as mutable object with a title, url and attribution that can be added to the tiles-property of a MapViewTemplate-config
+ */
+MapViewConfigUtils.getTileConfigMapTiler = function()
+{
+    var apikey = project.getInstanceConfigValue("custom.geo.maptiler.apikey", "");
+    var mapTilerUrl = "https://api.maptiler.com/maps/streets/256/{z}/{x}/{y}.png?key=" + apikey;
+    var tile = {
+        title: translate.text("Streetmap"),
+        url: mapTilerUrl,
+        //copied from the maptiler website: https://cloud.maptiler.com/maps/basic/leaflet
+        attribution: "\u003ca href=\"https://www.maptiler.com/copyright/\" target=\"_blank\"\u003e\u0026copy; MapTiler\u003c/a\u003e \u003ca href=\"https://www.openstreetmap.org/copyright\" target=\"_blank\"\u003e\u0026copy; OpenStreetMap contributors\u003c/a\u003e"
+    };
+    return tile;
+};
\ No newline at end of file