Add 404, fixing custom layouts and redirects

Customizations/AllKnownLayouts.ts

@@ -30,8 +30,6 @@ export class AllKnownLayouts {
         return sharedLayers;
     }
 
-
-
     public static allKnownLayouts: Map<string, LayoutConfig> = AllKnownLayouts.AllLayouts();
     public static layoutsList: LayoutConfig[] = AllKnownLayouts.GenerateOrderedList(AllKnownLayouts.allKnownLayouts);
 

Logic/DetermineLayout.ts

@@ -10,9 +10,10 @@ import {UIEventSource} from "./UIEventSource";
 import {LocalStorageSource} from "./Web/LocalStorageSource";
 import LZString from "lz-string";
 import * as personal from "../assets/themes/personal/personal.json";
-import {FixLegacyTheme} from "../Models/ThemeConfig/LegacyJsonConvert";
+import {FixLegacyTheme, PrepareTheme} from "../Models/ThemeConfig/LegacyJsonConvert";
 import {LayerConfigJson} from "../Models/ThemeConfig/Json/LayerConfigJson";
 import SharedTagRenderings from "../Customizations/SharedTagRenderings";
+import * as known_layers from "../assets/generated/known_layers.json"
 
 export default class DetermineLayout {
 
@@ -106,10 +107,19 @@ export default class DetermineLayout {
                 }
             }
 
-            json = new FixLegacyTheme().convertStrict({
+            const knownLayersDict = new Map<string, LayerConfigJson>()
+            for (const key in known_layers["default"]) {
+                knownLayersDict.set(key, known_layers["default"][key])
+            }
+            
+            const converState = {
                 tagRenderings: SharedTagRenderings.SharedTagRenderingJson,
-                sharedLayers: new Map<string, LayerConfigJson>() // FIXME: actually add the layers
+                sharedLayers: knownLayersDict
-            }, json, "While loading a dynamic theme")
+            }
+            
+            json = new FixLegacyTheme().convertStrict(converState, json, "While loading a dynamic theme")
+            
+            json = new PrepareTheme().convertStrict(converState, json, "While preparing a dynamic theme")
             
             const layoutToUse = new LayoutConfig(json, false);
             userLayoutParam.setData(layoutToUse.id);

UI/Base/SubtleButton.ts

@@ -8,32 +8,35 @@ import {UIElement} from "../UIElement";
 
 
 export class SubtleButton extends UIElement {
+    private readonly imageUrl: string | BaseUIElement;
+    private readonly message: string | BaseUIElement;
+    private readonly linkTo: { url: string | UIEventSource<string>; newTab?: boolean };
 
-    private readonly _element: BaseUIElement
 
     constructor(imageUrl: string | BaseUIElement, message: string | BaseUIElement, linkTo: { url: string | UIEventSource<string>, newTab?: boolean } = undefined) {
         super();
-        this._element = SubtleButton.generateContent(imageUrl, message, linkTo)
+        this.imageUrl = imageUrl;
-        this.SetClass("block flex p-3 my-2 bg-blue-100 rounded-lg hover:shadow-xl hover:bg-blue-200 link-no-underline")
+        this.message = message;
-
+        this.linkTo = linkTo;
     }
 
-    private static generateContent(imageUrl: string | BaseUIElement, messageT: string | BaseUIElement, linkTo: { url: string | UIEventSource<string>, newTab?: boolean } = undefined): BaseUIElement {
+    protected InnerRender(): string | BaseUIElement {
-        const message = Translations.W(messageT);
+        const classes=  "block flex p-3 my-2 bg-blue-100 rounded-lg hover:shadow-xl hover:bg-blue-200 link-no-underline";
-        message
+        const message = Translations.W(this.message);
         let img;
-        if ((imageUrl ?? "") === "") {
+        if ((this.imageUrl ?? "") === "") {
             img = undefined;
-        } else if (typeof (imageUrl) === "string") {
+        } else if (typeof (this.imageUrl) === "string") {
-            img = new Img(imageUrl)
+            img = new Img(this.imageUrl)
         } else {
-            img = imageUrl;
+            img = this.imageUrl;
         }
         img?.SetClass("block flex items-center justify-center h-11 w-11 flex-shrink0 mr-4")
         const image = new Combine([img])
             .SetClass("flex-shrink-0");
 
-        if (linkTo == undefined) {
+        if (this.linkTo == undefined) {
+            this.SetClass(classes)
             return new Combine([
                 image,
                 message?.SetClass("block overflow-ellipsis"),
@@ -46,13 +49,10 @@ export class SubtleButton extends UIElement {
                 image,
                 message?.SetClass("block overflow-ellipsis")
             ]).SetClass("flex group w-full"),
-            linkTo.url,
+            this.linkTo.url,
-            linkTo.newTab ?? false
+            this.linkTo.newTab ?? false
-        )
+        ).SetClass(classes)
-    }
 
-    protected InnerRender(): string | BaseUIElement {
-        return this._element;
     }
 
 

all_themes_index.ts

@@ -1,19 +1,18 @@
-import {FixedUiElement} from "./UI/Base/FixedUiElement";
-import {QueryParameters} from "./Logic/Web/QueryParameters";
-import Combine from "./UI/Base/Combine";
-import AvailableBaseLayers from "./Logic/Actors/AvailableBaseLayers";
-import MinimapImplementation from "./UI/Base/MinimapImplementation";
 import {Utils} from "./Utils";
 import AllThemesGui from "./UI/AllThemesGui";
-import DetermineLayout from "./Logic/DetermineLayout";
+import {QueryParameters} from "./Logic/Web/QueryParameters";
-import LayoutConfig from "./Models/ThemeConfig/LayoutConfig";
+
-import DefaultGUI from "./UI/DefaultGUI";
+
-import State from "./State";
+const layout = QueryParameters.GetQueryParameter("layout", undefined).data ?? ""
-import AvailableBaseLayersImplementation from "./Logic/Actors/AvailableBaseLayersImplementation";
+const customLayout = QueryParameters.GetQueryParameter("userlayout", undefined).data ?? ""
-import ShowOverlayLayerImplementation from "./UI/ShowDataLayer/ShowOverlayLayerImplementation";
+const l = window.location;
-import {DefaultGuiState} from "./UI/DefaultGuiState";
+if( layout !== ""){
+    window.location.replace(l.protocol + "//" + window.location.host+"/"+layout+".html"+ l.search + l.hash);
+}else if (customLayout !== ""){
+    window.location.replace(l.protocol + "//" + window.location.host+"/theme.html"+ l.search + l.hash);
+}
+
 
-// Miscelleanous
 Utils.DisableLongPresses()
 document.getElementById("decoration-desktop").remove();
 new AllThemesGui();

index.html

@@ -77,7 +77,7 @@
 <span class="absolute" id="belowmap" style="z-index: -1">Below</span>
 <div id="leafletDiv"></div>
 
-<script src="./all_themes_index.ts">new AllThemesGui();</script>
+<script src="./all_themes_index.ts"></script>
 <script async data-goatcounter="https://pietervdvn.goatcounter.com/count" src="//gc.zgo.at/count.js"></script>
 
 </body>

index.ts

@@ -1,5 +1,4 @@
 import {FixedUiElement} from "./UI/Base/FixedUiElement";
-import {QueryParameters} from "./Logic/Web/QueryParameters";
 import Combine from "./UI/Base/Combine";
 import AvailableBaseLayers from "./Logic/Actors/AvailableBaseLayers";
 import MinimapImplementation from "./UI/Base/MinimapImplementation";
@@ -20,14 +19,6 @@ ShowOverlayLayerImplementation.Implement();
 // Miscelleanous
 Utils.DisableLongPresses()
 
-// --------------------- Special actions based on the parameters -----------------
-// @ts-ignore
-if (location.href.startsWith("http://buurtnatuur.be")) {
-    // Reload the https version. This is important for the 'locate me' button
-    window.location.replace("https://buurtnatuur.be");
-}
-
-
 class Init {
     public static Init(layoutToUse: LayoutConfig, encoded: string) {
 
@@ -42,23 +33,6 @@ class Init {
             return;
         }
 
-        // Workaround/legacy to keep the old paramters working as I renamed some of them
-        if (layoutToUse?.id === "cyclofix") {
-            const legacy = QueryParameters.GetQueryParameter("layer-bike_shops", "true", "Legacy - keep De Fietsambassade working");
-            const correct = QueryParameters.GetQueryParameter("layer-bike_shop", "true", "Legacy - keep De Fietsambassade working")
-            if (legacy.data !== "true") {
-                correct.setData(legacy.data)
-            }
-            console.log("layer-bike_shop toggles: legacy:", legacy.data, "new:", correct.data)
-
-            const legacyCafe = QueryParameters.GetQueryParameter("layer-bike_cafes", "true", "Legacy - keep De Fietsambassade working")
-            const correctCafe = QueryParameters.GetQueryParameter("layer-bike_cafe", "true", "Legacy - keep De Fietsambassade working")
-            if (legacyCafe.data !== "true") {
-                correctCafe.setData(legacy.data)
-            }
-        }
-
-
         const guiState = new DefaultGuiState()
         State.state = new State(layoutToUse);
         DefaultGuiState.state = guiState;

notfound.ts

@@ -0,0 +1,11 @@
+import {FixedUiElement} from "./UI/Base/FixedUiElement";
+import Combine from "./UI/Base/Combine";
+import {SubtleButton} from "./UI/Base/SubtleButton";
+import Svg from "./Svg";
+
+new Combine([new FixedUiElement("This page is not found"),
+new SubtleButton(Svg.back_svg(), "Back to index", {
+    url: "./index.html",
+    newTab: false
+})
+]).AttachTo("maindiv")

package.json

@@ -47,7 +47,7 @@
     "deploy:production": "cd ~/git/mapcomplete.github.io/ && git pull && cd - && rm -rf ./assets/generated && npm run prepare-deploy && npm run optimize-images && rm -rf ~/git/mapcomplete.github.io/* && cp -r dist/* ~/git/mapcomplete.github.io/ && cd ~/git/mapcomplete.github.io/ && echo \"mapcomplete.osm.be\" > CNAME  && git add * && git commit -m 'New MapComplete Version' && git push && cd - && npm run clean && npm run gittag",
     "gittag": "ts-node scripts/printVersion.ts | bash",
     "lint": "tslint --project . -c tslint.json '**.ts' ",
-    "clean": "rm -rf .cache/ && (find *.html | grep -v \"\\(index\\|land\\|test\\|preferences\\|customGenerator\\|professional\\|automaton\\|theme\\).html\" | xargs rm) && (ls | grep \"^index_[a-zA-Z_]\\+\\.ts$\" | xargs rm) && (ls | grep \".*.webmanifest$\" | xargs rm)",
+    "clean": "rm -rf .cache/ && (find *.html | grep -v \"\\(404|index\\|land\\|test\\|preferences\\|customGenerator\\|professional\\|automaton\\|theme\\).html\" | xargs rm) && (ls | grep \"^index_[a-zA-Z_]\\+\\.ts$\" | xargs rm) && (ls | grep \".*.webmanifest$\" | xargs rm)",
     "generate:dependency-graph": "node_modules/.bin/depcruise --exclude \"^node_modules\" --output-type dot Logic/State/MapState.ts > dependencies.dot && dot dependencies.dot -T svg -o dependencies.svg && rm dependencies.dot",
     "genPostal": " ts-node ./scripts/postal_code_tools/createRoutablePoint.ts /home/pietervdvn/Downloads/postal_codes/postal_codes_town_hall_points.geojson /home/pietervdvn/Downloads/31370/Postcodes.geojson\n"
   },

scripts/generateLayerOverview.ts

@@ -26,22 +26,6 @@ interface LayersAndThemes {
 
 class LayerOverviewUtils {
 
-    loadThemesAndLayers(): LayersAndThemes {
-
-        const layerFiles = ScriptUtils.getLayerFiles();
-
-        const themeFiles: LayoutConfigJson[] = ScriptUtils.getThemeFiles().map(x => x.parsed);
-
-        console.log("Discovered", layerFiles.length, "layers and", themeFiles.length, "themes\n")
-        if (layerFiles.length + themeFiles.length === 0) {
-            throw "Panic: no themes and layers loaded!"
-        }
-        return {
-            layers: layerFiles,
-            themes: themeFiles
-        }
-    }
-
     writeSmallOverview(themes: { id: string, title: any, shortDescription: any, icon: string, hideFromOverview: boolean }[]) {
         const perId = new Map<string, any>();
         for (const theme of themes) {
@@ -191,6 +175,8 @@ class LayerOverviewUtils {
             "layers": Array.from(sharedLayers.values()),
             "themes": Array.from(sharedThemes.values())
         }))
+
+        writeFileSync("./assets/generated/known_layers.json", JSON.stringify(Array.from(sharedLayers.values())))
     }
 }