import {TagRendering} from "./Customizations/TagRendering"; import {UserBadge} from "./UI/UserBadge"; import {CenterMessageBox} from "./UI/CenterMessageBox"; import {TagUtils} from "./Logic/Tags"; import {FeatureInfoBox} from "./UI/FeatureInfoBox"; import {SimpleAddUI} from "./UI/SimpleAddUI"; import {SearchAndGo} from "./UI/SearchAndGo"; import {AllKnownLayouts} from "./Customizations/AllKnownLayouts"; import {Layout} from "./Customizations/Layout"; import {FixedUiElement} from "./UI/Base/FixedUiElement"; import {InitUiElements} from "./InitUiElements"; import {StrayClickHandler} from "./Logic/Leaflet/StrayClickHandler"; import {GeoLocationHandler} from "./Logic/Leaflet/GeoLocationHandler"; import {State} from "./State"; import {QueryParameters} from "./Logic/Web/QueryParameters"; import {LocalStorageSource} from "./Logic/Web/LocalStorageSource"; import {PersonalLayout} from "./Logic/PersonalLayout"; import {FromJSON} from "./Customizations/JSON/FromJSON"; import {FullScreenMessageBox} from "./UI/FullScreenMessageBoxHandler"; import {UIEventSource} from "./Logic/UIEventSource"; TagRendering.injectFunction(); // --------------------- 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"); } let testing: UIEventSource; if (location.hostname === "localhost" || location.hostname === "127.0.0.1") { testing = QueryParameters.GetQueryParameter("test", "true"); // Set to true if testing and changes should NOT be saved testing.setData(testing.data ?? "true") // If you have a testfile somewhere, enable this to spoof overpass // This should be hosted independantly, e.g. with `cd assets; webfsd -p 8080` + a CORS plugin to disable cors rules //Overpass.testUrl = "http://127.0.0.1:8080/streetwidths.geojson"; } else { testing = QueryParameters.GetQueryParameter("test", "false"); } // ----------------- SELECT THE RIGHT QUESTSET ----------------- let defaultLayout = "bookcases" let hash = window.location.hash; const path = window.location.pathname.split("/").slice(-1)[0]; if (path !== "index.html") { defaultLayout = path.substr(0, path.length - 5); console.log("Using layout", defaultLayout) } // Run over all questsets. If a part of the URL matches a searched-for part in the layout, it'll take that as the default for (const k in AllKnownLayouts.allSets) { const layout = AllKnownLayouts.allSets[k]; const possibleParts = (layout.locationContains ?? []); for (const locationMatch of possibleParts) { if (locationMatch === "") { continue } if (window.location.href.toLowerCase().indexOf(locationMatch.toLowerCase()) >= 0) { defaultLayout = layout.name; } } } defaultLayout = QueryParameters.GetQueryParameter("layout", defaultLayout).data; let layoutToUse: Layout = AllKnownLayouts.allSets[defaultLayout.toLowerCase()] ?? AllKnownLayouts["all"]; const userLayoutParam = QueryParameters.GetQueryParameter("userlayout", "false"); const layoutFromBase64 = userLayoutParam.data; if (layoutFromBase64 !== "false") { try { // layoutFromBase64 contains the name of the theme. This is partly to do tracking with goat counter const dedicatedHashFromLocalStorage = LocalStorageSource.Get("user-layout-" + layoutFromBase64.replace(" ", "_")); if(dedicatedHashFromLocalStorage.data?.length < 10){ dedicatedHashFromLocalStorage.setData(undefined); } const hashFromLocalStorage = LocalStorageSource.Get("last-loaded-user-layout"); if (hash.length < 10) { hash = dedicatedHashFromLocalStorage.data ?? hashFromLocalStorage.data; } else { console.log("Saving hash to local storage") hashFromLocalStorage.setData(hash); dedicatedHashFromLocalStorage.setData(hash); } layoutToUse = FromJSON.FromBase64(hash.substr(1)); userLayoutParam.setData(layoutToUse.id); } catch (e) { new FixedUiElement("Error: could not parse the custom layout:
"+e).AttachTo("centermessage"); throw e; } } if (layoutToUse === undefined) { console.log("Incorrect layout") new FixedUiElement("Error: incorrect layout " + defaultLayout + "
Go back").AttachTo("centermessage").onClick(() => { }); throw "Incorrect layout" } console.log("Using layout: ", layoutToUse.id); State.state = new State(layoutToUse); if (layoutToUse.hideFromOverview) { State.state.osmConnection.GetPreference("hidden-theme-" + layoutToUse.id + "-enabled").setData("true"); } if (layoutFromBase64 !== "false") { State.state.layoutDefinition = hash.substr(1); if (!testing) { State.state.osmConnection.OnLoggedIn(() => { State.state.osmConnection.GetLongPreference("installed-theme-" + layoutToUse.id).setData(State.state.layoutDefinition); }) }else{ console.warn("NOT saving custom layout to OSM as we are tesing -> probably in an iFrame") } } InitUiElements.InitBaseMap(); new FixedUiElement("").AttachTo("decoration-desktop"); // Remove the decoration function setupAllLayerElements() { // ------------- Setup the layers ------------------------------- InitUiElements.InitLayers(); InitUiElements.InitLayerSelection(); // ------------------ Setup various other UI elements ------------ InitUiElements.OnlyIf(State.state.featureSwitchAddNew, () => { let presetCount = 0; for (const layer of State.state.filteredLayers.data) { for (const preset of layer.layerDef.presets) { presetCount++; } } if (presetCount == 0) { return; } new StrayClickHandler(() => { return new SimpleAddUI(); } ); }); new CenterMessageBox().AttachTo("centermessage"); } setupAllLayerElements(); function updateFavs() { const favs = State.state.favouriteLayers.data ?? []; layoutToUse.layers = []; for (const fav of favs) { const layer = AllKnownLayouts.allLayers[fav]; if (!!layer) { layoutToUse.layers.push(layer); } for (const layouts of State.state.installedThemes.data) { for (const layer of layouts.layout.layers) { if (typeof layer === "string") { continue; } if (layer.id === fav) { layoutToUse.layers.push(layer); } } } } setupAllLayerElements(); State.state.layerUpdater.ForceRefresh(); State.state.locationControl.ping(); } if (layoutToUse === AllKnownLayouts.allSets[PersonalLayout.NAME]) { State.state.favouriteLayers.addCallback(updateFavs); State.state.installedThemes.addCallback(updateFavs); } /** * Show the questions and information for the selected element * This is given to the div which renders fullscreen on mobile devices */ State.state.selectedElement.addCallback((feature) => { if (feature?.feature?.properties === undefined) { return; } const data = feature.feature.properties; // Which is the applicable set? for (const layer of layoutToUse.layers) { if (typeof layer === "string") { continue; } const applicable = layer.overpassFilter.matches(TagUtils.proprtiesToKV(data)); if (applicable) { // This layer is the layer that gives the questions const featureBox = new FeatureInfoBox( feature.feature, State.state.allElements.getElement(data.id), layer.title, layer.elementsToShow, ); State.state.fullScreenMessage.setData(featureBox); break; } } } ); InitUiElements.OnlyIf(State.state.featureSwitchUserbadge, () => { new UserBadge().AttachTo('userbadge'); }); InitUiElements.OnlyIf((State.state.featureSwitchSearch), () => { new SearchAndGo().AttachTo("searchbox"); }); new FullScreenMessageBox(() => { State.state.selectedElement.setData(undefined) }).AttachTo("messagesboxmobile"); InitUiElements.OnlyIf(State.state.featureSwitchWelcomeMessage, () => { InitUiElements.InitWelcomeMessage() }); if ((window != window.top && !State.state.featureSwitchWelcomeMessage.data) || State.state.featureSwitchIframe.data) { const currentLocation = State.state.locationControl; const url = `${window.location.origin}${window.location.pathname}?z=${currentLocation.data.zoom}&lat=${currentLocation.data.lat}&lon=${currentLocation.data.lon}`; const content = ``; new FixedUiElement(content).AttachTo("messagesbox"); new FixedUiElement(content).AttachTo("help-button-mobile") } new GeoLocationHandler().AttachTo("geolocate-button"); State.state.locationControl.ping();