From de9691e72392e97c4c39a6430e066417595e1799 Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Thu, 27 Jun 2024 01:57:32 +0200 Subject: [PATCH 1/4] Add switch to disable all layers by default --- src/Logic/State/FeatureSwitchState.ts | 5 +++++ src/Logic/State/LayerState.ts | 9 +++++---- src/Models/FilteredLayer.ts | 9 +++++++-- src/Models/ThemeViewState.ts | 2 +- 4 files changed, 18 insertions(+), 7 deletions(-) diff --git a/src/Logic/State/FeatureSwitchState.ts b/src/Logic/State/FeatureSwitchState.ts index 6fbd1ad3b4..b4030ce1f5 100644 --- a/src/Logic/State/FeatureSwitchState.ts +++ b/src/Logic/State/FeatureSwitchState.ts @@ -68,6 +68,7 @@ export default class FeatureSwitchState extends OsmConnectionFeatureSwitches { public readonly osmApiTileSize: UIEventSource public readonly backgroundLayerId: UIEventSource public readonly featureSwitchMorePrivacy: UIEventSource + public readonly featureSwitchLayerDefault: UIEventSource public constructor(layoutToUse?: LayoutConfig) { super() @@ -234,5 +235,9 @@ export default class FeatureSwitchState extends OsmConnectionFeatureSwitches { layoutToUse?.defaultBackgroundId, "The id of the background layer to start with" ) + + this.featureSwitchLayerDefault = QueryParameters.GetBooleanQueryParameter("fs-layers-enabled",true, + "If set to false, all layers will be disabled - except the explicitly enabled layers" + ) } } diff --git a/src/Logic/State/LayerState.ts b/src/Logic/State/LayerState.ts index f8fb307611..d90b2d9ac0 100644 --- a/src/Logic/State/LayerState.ts +++ b/src/Logic/State/LayerState.ts @@ -1,4 +1,4 @@ -import { UIEventSource } from "../UIEventSource" +import { Store, UIEventSource } from "../UIEventSource" import { GlobalFilter } from "../../Models/GlobalFilter" import FilteredLayer from "../../Models/FilteredLayer" import LayerConfig from "../../Models/ThemeConfig/LayerConfig" @@ -32,15 +32,16 @@ export default class LayerState { * * @param osmConnection * @param layers - * @param context: the context, probably the name of the theme. Used to disambiguate the upstream user preference + * @param context + * @param layersEnabledByDefault */ - constructor(osmConnection: OsmConnection, layers: LayerConfig[], context: string) { + constructor(osmConnection: OsmConnection, layers: LayerConfig[], context: string, layersEnabledByDefault: Store) { this.osmConnection = osmConnection const filteredLayers = new Map() for (const layer of layers) { filteredLayers.set( layer.id, - FilteredLayer.initLinkedState(layer, context, this.osmConnection) + FilteredLayer.initLinkedState(layer, context, this.osmConnection, layersEnabledByDefault) ) } this.filteredLayers = filteredLayers diff --git a/src/Models/FilteredLayer.ts b/src/Models/FilteredLayer.ts index 8732a9a735..a9dccff3e1 100644 --- a/src/Models/FilteredLayer.ts +++ b/src/Models/FilteredLayer.ts @@ -81,7 +81,8 @@ export default class FilteredLayer { public static initLinkedState( layer: LayerConfig, context: string, - osmConnection: OsmConnection + osmConnection: OsmConnection, + enabledByDefault?: Store ) { let isDisplayed: UIEventSource if (layer.syncSelection === "local") { @@ -102,9 +103,13 @@ export default class FilteredLayer { layer ) } else { + let isShown = layer.shownByDefault + if(enabledByDefault !== undefined && enabledByDefault.data === false){ + isShown = false + } isDisplayed = QueryParameters.GetBooleanQueryParameter( FilteredLayer.queryParameterKey(layer), - layer.shownByDefault, + isShown , "Whether or not layer " + layer.id + " is shown" ) } diff --git a/src/Models/ThemeViewState.ts b/src/Models/ThemeViewState.ts index 62e0b7974c..e34a4f4393 100644 --- a/src/Models/ThemeViewState.ts +++ b/src/Models/ThemeViewState.ts @@ -202,7 +202,7 @@ export default class ThemeViewState implements SpecialVisualizationState { ) const self = this - this.layerState = new LayerState(this.osmConnection, layout.layers, layout.id) + this.layerState = new LayerState(this.osmConnection, layout.layers, layout.id, this.featureSwitches.featureSwitchLayerDefault) { const overlayLayerStates = new Map }>() From 45235cab0f528b885fb1dea674d6c3a1584577b9 Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Thu, 27 Jun 2024 02:29:53 +0200 Subject: [PATCH 2/4] Fix #2003, improve comments --- src/Models/Constants.ts | 2 +- src/Models/ThemeViewState.ts | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/Models/Constants.ts b/src/Models/Constants.ts index 1557cbceaf..6c35984ffa 100644 --- a/src/Models/Constants.ts +++ b/src/Models/Constants.ts @@ -10,7 +10,7 @@ export default class Constants { /** * API key for Maproulette * - * Currently there is no user-friendly way to get the user's API key. + * There is no user-friendly way to get the user's API key currently. * See https://github.com/maproulette/maproulette2/issues/476 for more information. * Using an empty string however does work for most actions, but will attribute all actions to the Superuser. */ diff --git a/src/Models/ThemeViewState.ts b/src/Models/ThemeViewState.ts index e34a4f4393..d842016b80 100644 --- a/src/Models/ThemeViewState.ts +++ b/src/Models/ThemeViewState.ts @@ -210,7 +210,7 @@ export default class ThemeViewState implements SpecialVisualizationState { const isDisplayed = QueryParameters.GetBooleanQueryParameter( "overlay-" + rasterInfo.id, rasterInfo.defaultState ?? true, - "Wether or not overlayer layer " + rasterInfo.id + " is shown" + "Whether or not overlayer layer " + rasterInfo.id + " is shown" ) const state = { isDisplayed } overlayLayerStates.set(rasterInfo.id, state) @@ -220,8 +220,8 @@ export default class ThemeViewState implements SpecialVisualizationState { } { - /* Setup the layout source - * A bit tricky, as this is heavily intertwined with the 'changes'-element, which generate a stream of new and changed features too + /* Set up the layout source + * A bit tricky, as this is heavily intertwined with the 'changes'-element, which generates a stream of new and changed features too */ if (this.layout.layers.some((l) => l._needsFullNodeDatabase)) { @@ -704,7 +704,7 @@ export default class ThemeViewState implements SpecialVisualizationState { this.mapProperties.zoom.map((z) => Math.max(Math.floor(z), 0)), this.mapProperties, { - isActive: this.mapProperties.zoom.map((z) => z <= maxzoom), + isActive: this.mapProperties.zoom.map((z) => z < maxzoom), } ) return new SummaryTileSourceRewriter(summaryTileSource, this.layerState.filteredLayers) From a281381284d8d5043c0275c05f95ecaefc955333 Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Thu, 27 Jun 2024 03:39:04 +0200 Subject: [PATCH 3/4] Finetuning of usage within an iFrame --- langs/en.json | 2 +- public/css/index-tailwind-output.css | 8 +- src/Logic/Web/MangroveReviews.ts | 6 +- src/Models/MenuState.ts | 10 ++ src/Models/ThemeConfig/LayoutConfig.ts | 8 +- src/UI/BigComponents/AboutMapComplete.svelte | 102 ++++++++++++ src/UI/BigComponents/CopyrightPanel.ts | 2 +- src/UI/BigComponents/ThemeIntroPanel.svelte | 11 +- src/UI/ThemeViewGUI.svelte | 162 +++++++------------ 9 files changed, 192 insertions(+), 119 deletions(-) create mode 100644 src/UI/BigComponents/AboutMapComplete.svelte diff --git a/langs/en.json b/langs/en.json index 0b0862b328..15b4df93de 100644 --- a/langs/en.json +++ b/langs/en.json @@ -386,7 +386,7 @@ "retry": "Retry", "returnToTheMap": "Return to the map", "save": "Save", - "screenToSmall": "Open {theme} in a new window", + "screenToSmall": "Open {theme} in a new window", "search": { "error": "Something went wrong…", "nothing": "Nothing found…", diff --git a/public/css/index-tailwind-output.css b/public/css/index-tailwind-output.css index 7fe879a304..52963f5837 100644 --- a/public/css/index-tailwind-output.css +++ b/public/css/index-tailwind-output.css @@ -3449,14 +3449,14 @@ video { padding-right: 3rem; } -.pr-1 { - padding-right: 0.25rem; -} - .pl-2 { padding-left: 0.5rem; } +.pr-1 { + padding-right: 0.25rem; +} + .pt-0\.5 { padding-top: 0.125rem; } diff --git a/src/Logic/Web/MangroveReviews.ts b/src/Logic/Web/MangroveReviews.ts index c446658246..bee5f97881 100644 --- a/src/Logic/Web/MangroveReviews.ts +++ b/src/Logic/Web/MangroveReviews.ts @@ -206,10 +206,10 @@ export default class FeatureReviews { this.subjectUri = this.ConstructSubjectUri() - this.subjectUri.addCallbackAndRunD( + this.subjectUri.mapD( async (sub) => { const reviews = await MangroveReviews.getReviews({ sub }) - console.log("Got reviews for", feature, reviews, sub) + console.debug("Got reviews for", feature, reviews, sub) this.addReviews(reviews.reviews, this._name.data) }, [this._name] @@ -221,7 +221,7 @@ export default class FeatureReviews { async (sub) => { try { const reviews = await MangroveReviews.getReviews({ sub }) - console.log("Got reviews (no-encode) for", feature, reviews, sub) + console.debug("Got reviews (no-encode) for", feature, reviews, sub) this.addReviews(reviews.reviews, this._name.data) } catch (e) { console.log("Could not fetch reviews for partially incorrect query ", sub) diff --git a/src/Models/MenuState.ts b/src/Models/MenuState.ts index 30bb6d0097..b40926d6a4 100644 --- a/src/Models/MenuState.ts +++ b/src/Models/MenuState.ts @@ -36,6 +36,11 @@ export class MenuState { public readonly filtersPanelIsOpened: UIEventSource = new UIEventSource(false) public readonly privacyPanelIsOpened: UIEventSource = new UIEventSource(false) + /** + * Standalone copyright panel + */ + public readonly copyrightPanelIsOpened: UIEventSource = new UIEventSource(false) + public readonly communityIndexPanelIsOpened: UIEventSource = new UIEventSource(false) public readonly allToggles: { toggle: UIEventSource @@ -105,6 +110,11 @@ export class MenuState { name: "privacy", showOverOthers: true, }, + { + toggle: this.copyrightPanelIsOpened, + name: "copyright", + showOverOthers: true, + }, { toggle: this.communityIndexPanelIsOpened, name: "community", diff --git a/src/Models/ThemeConfig/LayoutConfig.ts b/src/Models/ThemeConfig/LayoutConfig.ts index 16ea00481b..d9869f2386 100644 --- a/src/Models/ThemeConfig/LayoutConfig.ts +++ b/src/Models/ThemeConfig/LayoutConfig.ts @@ -336,14 +336,16 @@ export default class LayoutConfig implements LayoutInformation { ...json, layers: json.layers.filter((l) => l["id"] !== "favourite"), } - this.usedImages = Array.from( + const usedImages = new ExtractImages(this.official, undefined) .convertStrict( jsonNoFavourites, ConversionContext.construct([json.id], ["ExtractImages"]) ) - .map((i) => i.path) - ).sort() + .flatMap((i) => i.path) + usedImages.sort() + + this.usedImages = Utils.Dedup(usedImages) return this.usedImages } } diff --git a/src/UI/BigComponents/AboutMapComplete.svelte b/src/UI/BigComponents/AboutMapComplete.svelte new file mode 100644 index 0000000000..98000af1c3 --- /dev/null +++ b/src/UI/BigComponents/AboutMapComplete.svelte @@ -0,0 +1,102 @@ + + + diff --git a/src/UI/BigComponents/CopyrightPanel.ts b/src/UI/BigComponents/CopyrightPanel.ts index 7f73e6883f..345f8c047a 100644 --- a/src/UI/BigComponents/CopyrightPanel.ts +++ b/src/UI/BigComponents/CopyrightPanel.ts @@ -40,7 +40,7 @@ export default class CopyrightPanel extends Combine { const t = Translations.t.general.attribution const layoutToUse = state.layout - const iconAttributions: BaseUIElement[] = Utils.Dedup(layoutToUse.getUsedImages()).map( + const iconAttributions: BaseUIElement[] =layoutToUse.getUsedImages().map( CopyrightPanel.IconAttribution ) diff --git a/src/UI/BigComponents/ThemeIntroPanel.svelte b/src/UI/BigComponents/ThemeIntroPanel.svelte index d73d2f106e..71c60d3f30 100644 --- a/src/UI/BigComponents/ThemeIntroPanel.svelte +++ b/src/UI/BigComponents/ThemeIntroPanel.svelte @@ -51,10 +51,13 @@ - - {#if layout.layers.some((l) => l.presets?.length > 0)} - - {/if} + + + + {#if layout.layers.some((l) => l.presets?.length > 0)} + + {/if} + diff --git a/src/UI/ThemeViewGUI.svelte b/src/UI/ThemeViewGUI.svelte index 51385a220b..52ae80932a 100644 --- a/src/UI/ThemeViewGUI.svelte +++ b/src/UI/ThemeViewGUI.svelte @@ -31,8 +31,6 @@ import CopyrightPanel from "./BigComponents/CopyrightPanel" import DownloadPanel from "./DownloadFlow/DownloadPanel.svelte" import ModalRight from "./Base/ModalRight.svelte" - import { Utils } from "../Utils" - import Hotkeys from "./Base/Hotkeys" import LevelSelector from "./BigComponents/LevelSelector.svelte" import SelectedElementTitle from "./BigComponents/SelectedElementTitle.svelte" import ThemeIntroPanel from "./BigComponents/ThemeIntroPanel.svelte" @@ -41,8 +39,6 @@ import RasterLayerOverview from "./Map/RasterLayerOverview.svelte" import IfHidden from "./Base/IfHidden.svelte" import { onDestroy } from "svelte" - import MapillaryLink from "./BigComponents/MapillaryLink.svelte" - import OpenIdEditor from "./BigComponents/OpenIdEditor.svelte" import OpenBackgroundSelectorButton from "./BigComponents/OpenBackgroundSelectorButton.svelte" import StateIndicator from "./BigComponents/StateIndicator.svelte" import ShareScreen from "./BigComponents/ShareScreen.svelte" @@ -50,14 +46,10 @@ import PendingChangesIndicator from "./BigComponents/PendingChangesIndicator.svelte" import Cross from "../assets/svg/Cross.svelte" import LanguagePicker from "./InputElement/LanguagePicker.svelte" - import Mastodon from "../assets/svg/Mastodon.svelte" import Bug from "../assets/svg/Bug.svelte" - import Liberapay from "../assets/svg/Liberapay.svelte" - import OpenJosm from "./Base/OpenJosm.svelte" import Min from "../assets/svg/Min.svelte" import Plus from "../assets/svg/Plus.svelte" import Filter from "../assets/svg/Filter.svelte" - import Add from "../assets/svg/Add.svelte" import Community from "../assets/svg/Community.svelte" import Favourites from "./Favourites/Favourites.svelte" import ImageOperations from "./Image/ImageOperations.svelte" @@ -79,6 +71,9 @@ import ChevronRight from "@babeard/svelte-heroicons/solid/ChevronRight" import DocumentChartBar from "@babeard/svelte-heroicons/outline/DocumentChartBar" import Marker from "./Map/Marker.svelte" + import AboutMapComplete from "./BigComponents/AboutMapComplete.svelte" + import IfNot from "./Base/IfNot.svelte" + import Hotkeys from "./Base/Hotkeys" export let state: ThemeViewState let layout = state.layout @@ -124,11 +119,11 @@ state.mapProperties.installCustomKeyboardHandler(viewport) let canZoomIn = mapproperties.maxzoom.map( (mz) => mapproperties.zoom.data < mz, - [mapproperties.zoom] + [mapproperties.zoom], ) let canZoomOut = mapproperties.minzoom.map( (mz) => mapproperties.zoom.data > mz, - [mapproperties.zoom] + [mapproperties.zoom], ) function updateViewport() { @@ -165,7 +160,7 @@ onDestroy( rasterLayer.addCallbackAndRunD((l) => { rasterLayerName = l.properties.name - }) + }), ) let previewedImage = state.previewedImage @@ -196,7 +191,7 @@ let openMapButton: UIEventSource = new UIEventSource(undefined) let openMenuButton: UIEventSource = new UIEventSource(undefined) let openCurrentViewLayerButton: UIEventSource = new UIEventSource( - undefined + undefined, ) let _openNewElementButton: HTMLButtonElement let openNewElementButton: UIEventSource = new UIEventSource(undefined) @@ -250,27 +245,30 @@
- state.guistate.themeIsOpened.setData(true)} - on:keydown={forwardEventToMap} - htmlElem={openMapButton} - > -
- - - - - -
-
- state.guistate.menuIsOpened.setData(true)} - on:keydown={forwardEventToMap} - htmlElem={openMenuButton} - > - - + + state.guistate.themeIsOpened.setData(true)} + on:keydown={forwardEventToMap} + htmlElem={openMapButton} + > +
+ + + + + +
+
+ + state.guistate.menuIsOpened.setData(true)} + on:keydown={forwardEventToMap} + htmlElem={openMenuButton} + > + + +
{#if currentViewLayer?.tagRenderings && currentViewLayer.defaultIcon()} { @@ -350,8 +348,12 @@ { + if(featureSwitches.featureSwitchWelcomeMessage.data){ state.guistate.themeViewTab.setData("copyright") state.guistate.themeIsOpened.setData(true) + }else{ + state.guistate.copyrightPanelIsOpened.setData(true) + } }} > ©
- new CopyrightPanel(state)} slot="content2" /> +
+ new CopyrightPanel(state)} /> +
+
@@ -569,78 +574,11 @@
-