Rd 812 restructure (#168)

* chore:
  - restructure repo to be more inline with future feature branch
  - eslint --fix

* fix(MapTilerTerrainControl): fix dodgy import

* chore(tools.js): add comment

* fix(demos): implement demo-utils in demos

* chore(lint): add new line

* fix(demos): fix sky-night demo

* feat(tests): create tests to check that current exports are matched to expected exports

* feat(testing): add testing mocks for browser apis

* chore(demos): remove superfluous code from demos

* 3.0.2

* chore(changelog): update changelog

* fix(types): Unit is a type not a constant, moving to global `types` file

* fix(package.json): use local version of eslint instead of npx

* chore(ColorRamp): because of macos case issues, we need to rename ColorRamp to ColorRamp_ and back again

* chore(ColorRamp): rename colorramp

* fix: make sure correct modules are exported

* fix(lint):apease CI linter (lints differently to local)

---------

Co-authored-by: Les Moffat <[email protected]>

Author: lesbaa

.editorconfig

@@ -0,0 +1,13 @@
+# EditorConfig is awesome: https://EditorConfig.org
+
+# top-most EditorConfig file
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = LF
+charset = utf-8
+trim_trailing_whitespace = false
+insert_final_newline = true
+max_line_length = 180

.husky/pre-commit

@@ -1 +1,2 @@
-npx lint-staged
+npx lint-staged;
+npm run test;

CHANGELOG.md

@@ -1,5 +1,15 @@
 # MapTiler SDK Changelog
 
+## 3.0.2
+## ✨ Features and improvements
+None
+
+## 🐛 Bug fixes
+None
+
+## 🔧 Others
+Restructuring of repo, additon of tests to check consistency of library exports.
+
 ## 3.0.1
 ### New Features
 - Update Maplibre to v5.0.1

demos/colorramps.html demos/00-colorramps.htmldemos/colorramps.html renamed to demos/00-colorramps.html

@@ -30,10 +30,12 @@
   <div id="style-picker-container">
     <select name="mapstyles" id="mapstyles-picker"></select>
   </div>
-
   <script src="../build/maptiler-sdk.umd.min.js"></script>
+  <script src="assets/demo-utils.js"></script>
   <script>
-    maptilersdk.config.apiKey = new URLSearchParams(location.search).get("key") || "API_KEY";
+
+    addPerformanceStats();
+    setupMapTilerApiKey();
 
     if (maptilersdk.config.apiKey === "API_KEY") {
       const errorMessage = "MapTiler API key is missing. Please use URL `key` parameter to set it (`?key=XXXXX`).";
@@ -68,4 +70,4 @@
   </script>
 </body>
 
-</html>
+</html>

demos/simple.html demos/01-simple.htmldemos/simple.html renamed to demos/01-simple.html

@@ -65,16 +65,11 @@
   </div>
 
   <script src="../build/maptiler-sdk.umd.min.js"></script>
-
+  <script src="assets/demo-utils.js"></script>
   <script>
-    maptilersdk.config.apiKey = new URLSearchParams(location.search).get("key") || "API_KEY";
-
-    if (maptilersdk.config.apiKey === "API_KEY") {
-      const errorMessage = "MapTiler API key is missing. Please use URL `key` parameter to set it (`?key=XXXXX`).";
 
-      alert(errorMessage);
-      throw new Error(errorMessage);
-    }
+    addPerformanceStats();
+    setupMapTilerApiKey();
 
     const map = new maptilersdk.Map({
       container: document.getElementById("map-container"),

demos/sky_day.html demos/02-sky-day.htmldemos/sky_day.html renamed to demos/02-sky-day.html

@@ -80,15 +80,11 @@
   </div>
 
   <script src="../build/maptiler-sdk.umd.min.js"></script>
+  <script src="assets/demo-utils.js"></script>
   <script>
-    maptilersdk.config.apiKey = new URLSearchParams(location.search).get("key") || "API_KEY";
 
-    if (maptilersdk.config.apiKey === "API_KEY") {
-      const errorMessage = "MapTiler API key is missing. Please use URL `key` parameter to set it (`?key=XXXXX`).";
-
-      alert(errorMessage);
-      throw new Error(errorMessage);
-    }
+    addPerformanceStats();
+    setupMapTilerApiKey();
 
     const map = new maptilersdk.Map({
       container: document.getElementById("map-container"),
@@ -111,10 +107,12 @@
       });
     });
 
-      document.getElementById("fog-ground-blend").addEventListener("input", (e) => {
-        map.setSky({
-          "fog-ground-blend": parseFloat(e.target.value),
-        });
+    document.getElementById("fog-ground-blend").addEventListener("input", (e) => {
+      map.setSky({
+        "fog-ground-blend": parseFloat(e.target.value),
+      });
+    });
+
     document.getElementById("horizon-color").addEventListener("input", (e) => {
       map.setSky({
         "horizon-color": e.target.value,
@@ -125,6 +123,7 @@
         map.setSky({
           "horizon-fog-blend": parseFloat(e.target.value),
         });
+      });
     document.getElementById("fog-color").addEventListener("input", (e) => {
       map.setSky({
         "fog-color": e.target.value,
@@ -135,6 +134,7 @@
         map.setSky({
           "sky-horizon-blend": parseFloat(e.target.value),
         });
+      });
     document.getElementById("fog-ground-blend").addEventListener("input", (e) => {
       map.setSky({
         "fog-ground-blend": parseFloat(e.target.value),
@@ -145,6 +145,8 @@
         map.setSky({
           "atmosphere-blend": parseFloat(e.target.value),
         });
+      });
+
     document.getElementById("horizon-fog-blend").addEventListener("input", (e) => {
       map.setSky({
         "horizon-fog-blend": parseFloat(e.target.value),
@@ -167,6 +169,8 @@
           "sky-horizon-blend": 1.0,
           "atmosphere-blend": 0.5,
         })
+      });
+
     document.getElementById("atmosphere-blend").addEventListener("input", (e) => {
       map.setSky({
         "atmosphere-blend": parseFloat(e.target.value),
@@ -186,5 +190,4 @@
     });
   </script>
 </body>
-
-</html>
+</html>

demos/sky_night.html demos/03-sky-night.htmldemos/sky_night.html renamed to demos/03-sky-night.html

@@ -27,17 +27,12 @@
 
 <body>
   <div id="map-container"></div>
-
   <script src="../build/maptiler-sdk.umd.min.js"></script>
-  <script>
-    maptilersdk.config.apiKey = new URLSearchParams(location.search).get("key") || "API_KEY";
-
-    if (maptilersdk.config.apiKey === "API_KEY") {
-      const errorMessage = "MapTiler API key is missing. Please use URL `key` parameter to set it (`?key=XXXXX`).";
+  <script src="assets/demo-utils.js"></script>
 
-      alert(errorMessage);
-      throw new Error(errorMessage);
-    }
+  <script>
+    addPerformanceStats();
+    setupMapTilerApiKey();
 
     const map = new maptilersdk.Map({
       container: document.getElementById("map-container"),

demos/readyevent.html demos/04-ready-event.htmldemos/readyevent.html renamed to demos/04-ready-event.html

@@ -31,17 +31,11 @@
     <select name="mapstyles" id="mapstyles-picker"></select>
   </div>
 
-  <script src="../dist/maptiler-sdk.umd.min.js"></script>
+  <script src="assets/demo-utils.js"></script>
   <script>
-    maptilersdk.config.apiKey = new URLSearchParams(location.search).get("key") || "API_KEY";
-
-    if (maptilersdk.config.apiKey === "API_KEY") {
-      const errorMessage = "MapTiler API key is missing. Please use URL `key` parameter to set it (`?key=XXXXX`).";
-
-      alert(errorMessage);
-      throw new Error(errorMessage);
-    }
 
+    addPerformanceStats();
+    setupMapTilerApiKey();
     const map = new maptilersdk.Map({
       container: document.getElementById("map-container"),
       style: maptilersdk.MapStyle.OUTDOOR.DARK,

demos/transform-request.html demos/05-transform-request.htmldemos/transform-request.html renamed to demos/05-transform-request.html

@@ -38,8 +38,12 @@
 
 <body>
   <script src="../build/maptiler-sdk.umd.min.js"></script>
-
+  <script src="assets/demo-utils.js"></script>
   <script>
+
+    addPerformanceStats();
+    setupMapTilerApiKey();
+
     function getRandomMapStyle() {
       const styles = Object.keys(maptilersdk.MapStyle);
       const style = maptilersdk.MapStyle[styles[Math.floor(Math.random() * styles.length)]];
@@ -69,8 +73,6 @@
   </script>
 
   <script>
-    maptilersdk.config.apiKey = "YOUR_API_KEY";
-
     /*
      * The mapLeftTop will lose the WebGL context because it is removed
      * so the event will not be called.