Usersettings: use a collapsable dropdown, introduce dropdown special visualisation

This commit is contained in:
Pieter Vander Vennet 2024-08-10 12:09:55 +02:00
parent 2e06bf407b
commit 85094fe3ee
14 changed files with 319 additions and 257 deletions

View file

@ -40,7 +40,6 @@ import { Feature, GeoJsonProperties } from "geojson"
import { GeoOperations } from "../Logic/GeoOperations"
import CreateNewNote from "./Popup/Notes/CreateNewNote.svelte"
import AddNewPoint from "./Popup/AddNewPoint/AddNewPoint.svelte"
import UserProfile from "./BigComponents/UserProfile.svelte"
import LayerConfig from "../Models/ThemeConfig/LayerConfig"
import TagRenderingConfig from "../Models/ThemeConfig/TagRenderingConfig"
import { ExportAsGpxViz } from "./Popup/ExportAsGpxViz"
@ -100,6 +99,7 @@ import CloseNoteButton from "./Popup/Notes/CloseNoteButton.svelte"
import PendingChangesIndicator from "./BigComponents/PendingChangesIndicator.svelte"
import QrCode from "./Popup/QrCode.svelte"
import ClearCaches from "./Popup/ClearCaches.svelte"
import GroupedView from "./Popup/GroupedView.svelte"
class NearbyImageVis implements SpecialVisualization {
// Class must be in SpecialVisualisations due to weird cyclical import that breaks the tests
@ -424,17 +424,6 @@ export default class SpecialVisualizations {
}).SetClass("w-full h-full overflow-auto")
},
},
{
funcName: "user_profile",
args: [],
docs: "A component showing information about the currently logged in user (username, profile description, profile picture + link to edit them). Mostly meant to be used in the 'user-settings'",
constr(state: SpecialVisualizationState): BaseUIElement {
return new SvelteUIElement(UserProfile, {
osmConnection: state.osmConnection,
})
},
},
{
funcName: "language_picker",
args: [],
@ -1339,6 +1328,7 @@ export default class SpecialVisualizations {
download: tagSource.map((tags) => Utils.SubstituteKeys(download, tags)),
ariaLabel: tagSource.map((tags) => Utils.SubstituteKeys(ariaLabel, tags)),
newTab: new ImmutableStore(newTab),
icon: tagSource.map((tags) => Utils.SubstituteKeys(icon, tags))
}).setSpan()
},
},
@ -2008,6 +1998,27 @@ export default class SpecialVisualizations {
return new SvelteUIElement<any, any, any>(ClearCaches, {msg: argument[0] ?? "Clear local caches"})
},
},
{
funcName: "group",
docs: "A collapsable group (accordion)",
args: [
{
name: "header",
doc: "The _identifier_ of a single tagRendering. This will be used as header"
},
{
name: "labels",
doc: "A `;`-separated list of either identifiers or label names. All tagRenderings matching this value will be shown in the accordion"
}
],
constr(state: SpecialVisualizationState, tags: UIEventSource<Record<string, string>>, argument: string[], selectedElement: Feature, layer: LayerConfig): SvelteUIElement {
const [header, labelsStr] = argument
const labels = labelsStr.split(";").map(x => x.trim())
return new SvelteUIElement<any, any, any>(GroupedView, {
state, tags, selectedElement, layer, header, labels
})
}
}
]
specialVisualizations.push(new AutoApplyButton(specialVisualizations))