midgard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

refactoring: fix basic flow to add a new point

Browse source
This commit is contained in:
Pieter Vander Vennet 2023-04-06 01:33:08 +02:00
parent 52a0810ea9
commit 0241f89d3d
109 changed files with 1931 additions and 1446 deletions
Download patch file Download diff file Expand all files Collapse all files

168
UI/BigComponents/SimpleAddUI.ts
View file

@ -1,29 +1,22 @@
/**
* Asks to add a feature at the last clicked location, at least if zoom is sufficient
*/
import { ImmutableStore, UIEventSource } from "../../Logic/UIEventSource"
import Svg from "../../Svg"
import { SubtleButton } from "../Base/SubtleButton"
import Combine from "../Base/Combine"
import { UIEventSource } from "../../Logic/UIEventSource"
import Translations from "../i18n/Translations"
import Constants from "../../Models/Constants"
import { TagUtils } from "../../Logic/Tags/TagUtils"
import BaseUIElement from "../BaseUIElement"
import { VariableUiElement } from "../Base/VariableUIElement"
import Toggle from "../Input/Toggle"
import UserDetails, { OsmConnection } from "../../Logic/Osm/OsmConnection"
import CreateNewNodeAction from "../../Logic/Osm/Actions/CreateNewNodeAction"
import { OsmObject, OsmWay } from "../../Logic/Osm/OsmObject"
import PresetConfig from "../../Models/ThemeConfig/PresetConfig"
import FilteredLayer from "../../Models/FilteredLayer"
import ConfirmLocationOfPoint from "../NewPoint/ConfirmLocationOfPoint"
import Loading from "../Base/Loading"
import Hash from "../../Logic/Web/Hash"
import { WayId } from "../../Models/OsmFeature"
import { Tag } from "../../Logic/Tags/Tag"
import { LoginToggle } from "../Popup/LoginButton"
import { SpecialVisualizationState } from "../SpecialVisualization"
import { Feature } from "geojson"
import { FixedUiElement } from "../Base/FixedUiElement"
/*
* The SimpleAddUI is a single panel, which can have multiple states:
@ -40,33 +33,18 @@ export interface PresetInfo extends PresetConfig {
boundsFactor?: 0.25 | number
}
export default class SimpleAddUI extends LoginToggle {
/**
*
*/
export default class SimpleAddUI extends Toggle {
constructor(state: SpecialVisualizationState) {
const readYourMessages = new Combine([
Translations.t.general.readYourMessages.Clone().SetClass("alert"),
new SubtleButton(Svg.envelope_ui(), Translations.t.general.goToInbox, {
url: "https://www.openstreetmap.org/messages/inbox",
newTab: false,
}),
])
const filterViewIsOpened = state.guistate.filterViewIsOpened
const takeLocationFrom = state.mapProperties.lastClickLocation
const selectedPreset = new UIEventSource<PresetInfo>(undefined)
takeLocationFrom.addCallback((_) => selectedPreset.setData(undefined))
const presetsOverview = SimpleAddUI.CreateAllPresetsPanel(selectedPreset, state)
async function createNewPoint(
tags: Tag[],
location: { lat: number; lon: number },
snapOntoWay?: OsmWay
): Promise<void> {
tags.push(new Tag(Tag.newlyCreated.key, new Date().toISOString()))
if (snapOntoWay) {
tags.push(new Tag("_referencing_ways", "way/" + snapOntoWay.id))
}
@ -86,10 +64,6 @@ export default class SimpleAddUI extends LoginToggle {
const addUi = new VariableUiElement(
selectedPreset.map((preset) => {
if (preset === undefined) {
return presetsOverview
}
function confirm(
tags: any[],
location: { lat: number; lon: number },
@ -113,7 +87,7 @@ export default class SimpleAddUI extends LoginToggle {
{ category: preset.name },
preset.name["context"]
)
return new ConfirmLocationOfPoint(
return new FixedUiElement("ConfirmLocationOfPoint...") /*ConfirmLocationOfPoint(
state,
filterViewIsOpened,
preset,
@ -128,140 +102,14 @@ export default class SimpleAddUI extends LoginToggle {
cancelIcon: Svg.back_svg(),
cancelText: Translations.t.general.add.backToSelect,
}
)
)*/
})
)
super(
new Toggle(
new Toggle(
new Toggle(
new Loading(Translations.t.general.add.stillLoading).SetClass("alert"),
addUi,
state.dataIsLoading
),
Translations.t.general.add.zoomInFurther.Clone().SetClass("alert"),
state.mapProperties.zoom.map(
(zoom) => zoom >= Constants.minZoomLevelToAddNewPoint
)
),
readYourMessages,
state.osmConnection.userDetails.map(
(userdetails: UserDetails) =>
userdetails.csCount >=
Constants.userJourney.addNewPointWithUnreadMessagesUnlock ||
userdetails.unreadMessages == 0
)
),
Translations.t.general.add.pleaseLogin,
state
new Loading(Translations.t.general.add.stillLoading).SetClass("alert"),
addUi,
state.dataIsLoading
)
}
public static CreateTagInfoFor(
preset: PresetInfo,
osmConnection: OsmConnection,
optionallyLinkToWiki = true
) {
const csCount = osmConnection.userDetails.data.csCount
return new Toggle(
Translations.t.general.add.presetInfo
.Subs({
tags: preset.tags
.map((t) =>
t.asHumanString(
optionallyLinkToWiki &&
csCount > Constants.userJourney.tagsVisibleAndWikiLinked,
true
)
)
.join("&"),
})
.SetStyle("word-break: break-all"),
undefined,
osmConnection.userDetails.map(
(userdetails) => userdetails.csCount >= Constants.userJourney.tagsVisibleAt
)
)
}
private static CreateAllPresetsPanel(
selectedPreset: UIEventSource<PresetInfo>,
state: SpecialVisualizationState
): BaseUIElement {
const presetButtons = SimpleAddUI.CreatePresetButtons(state, selectedPreset)
let intro: BaseUIElement = Translations.t.general.add.intro
let testMode: BaseUIElement = new Toggle(
Translations.t.general.testing.SetClass("alert"),
undefined,
state.featureSwitchIsTesting
)
return new Combine([intro, testMode, presetButtons]).SetClass("flex flex-col")
}
private static CreatePresetSelectButton(preset: PresetInfo) {
const title = Translations.t.general.add.addNew.Subs(
{
category: preset.name,
},
preset.name["context"]
)
return new SubtleButton(
preset.icon(),
new Combine([
title.SetClass("font-bold"),
preset.description?.FirstSentence(),
]).SetClass("flex flex-col")
)
}
/*
* Generates the list with all the buttons.*/
private static CreatePresetButtons(
state: SpecialVisualizationState,
selectedPreset: UIEventSource<PresetInfo>
): BaseUIElement {
const allButtons = []
for (const layer of Array.from(state.layerState.filteredLayers.values())) {
if (layer.isDisplayed.data === false) {
// The layer is not displayed...
if (!state.featureSwitches.featureSwitchFilter.data) {
// ...and we cannot enable the layer control -> we skip, as these presets can never be shown anyway
continue
}
if (layer.layerDef.name === undefined) {
// this layer can never be toggled on in any case, so we skip the presets
continue
}
}
const presets = layer.layerDef.presets
for (const preset of presets) {
const tags = TagUtils.KVtoProperties(preset.tags ?? [])
let icon: () => BaseUIElement = () =>
layer.layerDef.mapRendering[0]
.RenderIcon(new ImmutableStore<any>(tags), false)
.html.SetClass("w-12 h-12 block relative")
const presetInfo: PresetInfo = {
layerToAddTo: layer,
name: preset.title,
title: preset.title,
icon: icon,
preciseInput: preset.preciseInput,
...preset,
}
const button = SimpleAddUI.CreatePresetSelectButton(presetInfo)
button.onClick(() => {
selectedPreset.setData(presetInfo)
})
allButtons.push(button)
}
}
return new Combine(allButtons).SetClass("flex flex-col")
}
}