Use API key for Thunderforest resources

examples/igc.html

@@ -5,6 +5,9 @@ shortdesc: Example of tracks recorded from multiple paraglider flights on the sa
 docs: >
   <p>The five tracks contain a total of 49,707 unique coordinates. Zoom in to see more detail. The background layer is from <a href="https://www.opencyclemap.org/">OpenCycleMap</a>.</p>
 tags: "complex-geometry, closest-feature, igc, opencyclemap"
+cloak:
+  0e6fc415256d4fbb9b5166a718591d71: Your API key from http://www.thunderforest.com/docs/apikeys/ here
+
 ---
 <div id="map" class="map"></div>
 <input id="time" type="range" value="0" steps="1" />

examples/igc.js

@@ -88,7 +88,8 @@ var map = new ol.Map({
           'All maps © <a href="https://www.opencyclemap.org/">OpenCycleMap</a>',
           ol.source.OSM.ATTRIBUTION
         ],
-        url: 'https://{a-c}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png'
+        url: 'https://{a-c}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png' +
+            '?apikey=0e6fc415256d4fbb9b5166a718591d71'
       })
     }),
     new ol.layer.Vector({

examples/localized-openstreetmap.html

@@ -5,5 +5,8 @@ shortdesc: Example of a localized OpenStreetMap map with a custom tile server an
 docs: >
   <p>The base layer is <a href="https://www.opencyclemap.org/">OpenCycleMap</a> with an overlay from <a href="http://www.openseamap.org/">OpenSeaMap</a>.
 tags: "localized-openstreetmap, openseamap, openstreetmap"
+cloak:
+  0e6fc415256d4fbb9b5166a718591d71: Your API key from http://www.thunderforest.com/docs/apikeys/ here
+
 ---
 <div id="map" class="map"></div>

examples/localized-openstreetmap.js

@@ -11,7 +11,8 @@ var openCycleMapLayer = new ol.layer.Tile({
       'All maps © <a href="https://www.opencyclemap.org/">OpenCycleMap</a>',
       ol.source.OSM.ATTRIBUTION
     ],
-    url: 'https://{a-c}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png'
+    url: 'https://{a-c}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png' +
+        '?apikey=0e6fc415256d4fbb9b5166a718591d71'
   })
 });
 

examples/overviewmap-custom.html

@@ -5,5 +5,8 @@ shortdesc: Example of OverviewMap control with advanced customization.
 docs: >
   <p>This example demonstrates how you can customize the overviewmap control using its supported options as well as defining custom CSS.  You can also rotate the map using the shift key to see how the overview map reacts.</p>
 tags: "overview, overviewmap"
+cloak:
+  0e6fc415256d4fbb9b5166a718591d71: Your API key from http://www.thunderforest.com/docs/apikeys/ here
+
 ---
 <div id="map" class="map"></div>

examples/overviewmap-custom.js

@@ -14,7 +14,8 @@ var overviewMapControl = new ol.control.OverviewMap({
   layers: [
     new ol.layer.Tile({
       source: new ol.source.OSM({
-        'url': 'https://{a-c}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png'
+        'url': 'https://{a-c}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png' +
+            '?apikey=0e6fc415256d4fbb9b5166a718591d71'
       })
     })
   ],

examples/xyz.html

@@ -5,5 +5,8 @@ shortdesc: Example of a XYZ source.
 docs: >
   The XYZ source is used for tile data that is accessed through URLs that include a zoom level and tile grid x/y coordinates.
 tags: "xyz"
+cloak:
+  0e6fc415256d4fbb9b5166a718591d71: Your API key from http://www.thunderforest.com/docs/apikeys/ here
+
 ---
 <div id="map" class="map"></div>

examples/xyz.js

@@ -9,7 +9,8 @@ var map = new ol.Map({
   layers: [
     new ol.layer.Tile({
       source: new ol.source.XYZ({
-        url: 'https://{a-c}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png'
+        url: 'https://{a-c}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png' +
+            '?apikey=0e6fc415256d4fbb9b5166a718591d71'
       })
     })
   ],