forked from MapComplete/MapComplete
Refactoring: move all code files into a src directory
This commit is contained in:
parent
de99f56ca8
commit
e75d2789d2
389 changed files with 0 additions and 12 deletions
337
src/UI/Popup/AutoApplyButton.ts
Normal file
337
src/UI/Popup/AutoApplyButton.ts
Normal file
|
|
@ -0,0 +1,337 @@
|
|||
import BaseUIElement from "../BaseUIElement"
|
||||
import { Stores, UIEventSource } from "../../Logic/UIEventSource"
|
||||
import { SubtleButton } from "../Base/SubtleButton"
|
||||
import Img from "../Base/Img"
|
||||
import { FixedUiElement } from "../Base/FixedUiElement"
|
||||
import Combine from "../Base/Combine"
|
||||
import Link from "../Base/Link"
|
||||
import { Utils } from "../../Utils"
|
||||
import StaticFeatureSource from "../../Logic/FeatureSource/Sources/StaticFeatureSource"
|
||||
import { VariableUiElement } from "../Base/VariableUIElement"
|
||||
import Loading from "../Base/Loading"
|
||||
import { OsmConnection } from "../../Logic/Osm/OsmConnection"
|
||||
import Translations from "../i18n/Translations"
|
||||
import LayoutConfig from "../../Models/ThemeConfig/LayoutConfig"
|
||||
import { Changes } from "../../Logic/Osm/Changes"
|
||||
import { UIElement } from "../UIElement"
|
||||
import FilteredLayer from "../../Models/FilteredLayer"
|
||||
import TagRenderingConfig from "../../Models/ThemeConfig/TagRenderingConfig"
|
||||
import Lazy from "../Base/Lazy"
|
||||
import List from "../Base/List"
|
||||
import { SpecialVisualization, SpecialVisualizationState } from "../SpecialVisualization"
|
||||
import { IndexedFeatureSource } from "../../Logic/FeatureSource/FeatureSource"
|
||||
import { MapLibreAdaptor } from "../Map/MapLibreAdaptor"
|
||||
import ShowDataLayer from "../Map/ShowDataLayer"
|
||||
import SvelteUIElement from "../Base/SvelteUIElement"
|
||||
import MaplibreMap from "../Map/MaplibreMap.svelte"
|
||||
import SpecialVisualizations from "../SpecialVisualizations"
|
||||
import { Feature } from "geojson"
|
||||
|
||||
export interface AutoAction extends SpecialVisualization {
|
||||
supportsAutoAction: boolean
|
||||
|
||||
applyActionOn(
|
||||
feature: Feature,
|
||||
state: {
|
||||
layout: LayoutConfig
|
||||
changes: Changes
|
||||
indexedFeatures: IndexedFeatureSource
|
||||
},
|
||||
tagSource: UIEventSource<any>,
|
||||
argument: string[]
|
||||
): Promise<void>
|
||||
}
|
||||
|
||||
class ApplyButton extends UIElement {
|
||||
private readonly icon: string
|
||||
private readonly text: string
|
||||
private readonly targetTagRendering: string
|
||||
private readonly target_layer_id: string
|
||||
private readonly state: SpecialVisualizationState
|
||||
private readonly target_feature_ids: string[]
|
||||
private readonly buttonState = new UIEventSource<
|
||||
"idle" | "running" | "done" | { error: string }
|
||||
>("idle")
|
||||
private readonly layer: FilteredLayer
|
||||
private readonly tagRenderingConfig: TagRenderingConfig
|
||||
private readonly appliedNumberOfFeatures = new UIEventSource<number>(0)
|
||||
|
||||
constructor(
|
||||
state: SpecialVisualizationState,
|
||||
target_feature_ids: string[],
|
||||
options: {
|
||||
target_layer_id: string
|
||||
targetTagRendering: string
|
||||
text: string
|
||||
icon: string
|
||||
}
|
||||
) {
|
||||
super()
|
||||
this.state = state
|
||||
this.target_feature_ids = target_feature_ids
|
||||
this.target_layer_id = options.target_layer_id
|
||||
this.targetTagRendering = options.targetTagRendering
|
||||
this.text = options.text
|
||||
this.icon = options.icon
|
||||
this.layer = this.state.layerState.filteredLayers.get(this.target_layer_id)
|
||||
this.tagRenderingConfig = this.layer.layerDef.tagRenderings.find(
|
||||
(tr) => tr.id === this.targetTagRendering
|
||||
)
|
||||
}
|
||||
|
||||
protected InnerRender(): string | BaseUIElement {
|
||||
if (this.target_feature_ids.length === 0) {
|
||||
return new FixedUiElement("No elements found to perform action")
|
||||
}
|
||||
|
||||
if (this.tagRenderingConfig === undefined) {
|
||||
return new FixedUiElement(
|
||||
"Target tagrendering " + this.targetTagRendering + " not found"
|
||||
).SetClass("alert")
|
||||
}
|
||||
const self = this
|
||||
const button = new SubtleButton(new Img(this.icon), this.text).onClick(() => {
|
||||
this.buttonState.setData("running")
|
||||
window.setTimeout(() => {
|
||||
self.Run()
|
||||
}, 50)
|
||||
})
|
||||
|
||||
const explanation = new Combine([
|
||||
"The following objects will be updated: ",
|
||||
...this.target_feature_ids.map(
|
||||
(id) => new Combine([new Link(id, "https:/ /openstreetmap.org/" + id, true), ", "])
|
||||
),
|
||||
]).SetClass("subtle")
|
||||
|
||||
const mlmap = new UIEventSource(undefined)
|
||||
const mla = new MapLibreAdaptor(mlmap, {
|
||||
rasterLayer: this.state.mapProperties.rasterLayer,
|
||||
})
|
||||
mla.allowZooming.setData(false)
|
||||
mla.allowMoving.setData(false)
|
||||
|
||||
const previewMap = new SvelteUIElement(MaplibreMap, { map: mlmap }).SetClass("h-48")
|
||||
|
||||
const features = this.target_feature_ids.map((id) =>
|
||||
this.state.indexedFeatures.featuresById.data.get(id)
|
||||
)
|
||||
|
||||
new ShowDataLayer(mlmap, {
|
||||
features: StaticFeatureSource.fromGeojson(features),
|
||||
zoomToFeatures: true,
|
||||
layer: this.layer.layerDef,
|
||||
})
|
||||
|
||||
return new VariableUiElement(
|
||||
this.buttonState.map((st) => {
|
||||
if (st === "idle") {
|
||||
return new Combine([button, previewMap, explanation])
|
||||
}
|
||||
if (st === "done") {
|
||||
return new FixedUiElement("All done!").SetClass("thanks")
|
||||
}
|
||||
if (st === "running") {
|
||||
return new Loading(
|
||||
new VariableUiElement(
|
||||
this.appliedNumberOfFeatures.map((appliedTo) => {
|
||||
return (
|
||||
"Applying changes, currently at " +
|
||||
appliedTo +
|
||||
"/" +
|
||||
this.target_feature_ids.length
|
||||
)
|
||||
})
|
||||
)
|
||||
)
|
||||
}
|
||||
const error = st.error
|
||||
return new Combine([
|
||||
new FixedUiElement("Something went wrong...").SetClass("alert"),
|
||||
new FixedUiElement(error).SetClass("subtle"),
|
||||
]).SetClass("flex flex-col")
|
||||
})
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* Actually applies all the changes...
|
||||
*/
|
||||
private async Run() {
|
||||
try {
|
||||
console.log("Applying auto-action on " + this.target_feature_ids.length + " features")
|
||||
|
||||
for (let i = 0; i < this.target_feature_ids.length; i++) {
|
||||
const targetFeatureId = this.target_feature_ids[i]
|
||||
const feature = this.state.indexedFeatures.featuresById.data.get(targetFeatureId)
|
||||
const featureTags = this.state.featureProperties.getStore(targetFeatureId)
|
||||
const rendering = this.tagRenderingConfig.GetRenderValue(featureTags.data).txt
|
||||
const specialRenderings = Utils.NoNull(
|
||||
SpecialVisualizations.constructSpecification(rendering)
|
||||
).filter((v) => typeof v !== "string" && v.func["supportsAutoAction"] === true)
|
||||
|
||||
if (specialRenderings.length == 0) {
|
||||
console.warn(
|
||||
"AutoApply: feature " +
|
||||
targetFeatureId +
|
||||
" got a rendering without supported auto actions:",
|
||||
rendering
|
||||
)
|
||||
}
|
||||
|
||||
for (const specialRendering of specialRenderings) {
|
||||
if (typeof specialRendering === "string") {
|
||||
continue
|
||||
}
|
||||
const action = <AutoAction>specialRendering.func
|
||||
await action.applyActionOn(
|
||||
feature,
|
||||
this.state,
|
||||
featureTags,
|
||||
specialRendering.args
|
||||
)
|
||||
}
|
||||
if (i % 50 === 0) {
|
||||
await this.state.changes.flushChanges("Auto button: intermediate save")
|
||||
}
|
||||
this.appliedNumberOfFeatures.setData(i + 1)
|
||||
}
|
||||
console.log("Flushing changes...")
|
||||
await this.state.changes.flushChanges("Auto button: done")
|
||||
this.buttonState.setData("done")
|
||||
} catch (e) {
|
||||
console.error("Error while running autoApply: ", e)
|
||||
this.buttonState.setData({ error: e })
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default class AutoApplyButton implements SpecialVisualization {
|
||||
public readonly docs: BaseUIElement
|
||||
public readonly funcName: string = "auto_apply"
|
||||
public readonly args: {
|
||||
name: string
|
||||
defaultValue?: string
|
||||
doc: string
|
||||
required?: boolean
|
||||
}[] = [
|
||||
{
|
||||
name: "target_layer",
|
||||
doc: "The layer that the target features will reside in",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "target_feature_ids",
|
||||
doc: "The key, of which the value contains a list of ids",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "tag_rendering_id",
|
||||
doc: "The ID of the tagRendering containing the autoAction. This tagrendering will be calculated. The embedded actions will be executed",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "text",
|
||||
doc: "The text to show on the button",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "icon",
|
||||
doc: "The icon to show on the button",
|
||||
defaultValue: "./assets/svg/robot.svg",
|
||||
},
|
||||
]
|
||||
|
||||
constructor(allSpecialVisualisations: SpecialVisualization[]) {
|
||||
this.docs = AutoApplyButton.generateDocs(
|
||||
allSpecialVisualisations
|
||||
.filter((sv) => sv["supportsAutoAction"] === true)
|
||||
.map((sv) => sv.funcName)
|
||||
)
|
||||
}
|
||||
|
||||
private static generateDocs(supportedActions: string[]) {
|
||||
return new Combine([
|
||||
"A button to run many actions for many features at once.",
|
||||
"To effectively use this button, you'll need some ingredients:",
|
||||
new List([
|
||||
"A target layer with features for which an action is defined in a tag rendering. The following special visualisations support an autoAction: " +
|
||||
supportedActions.join(", "),
|
||||
"A host feature to place the auto-action on. This can be a big outline (such as a city). Another good option for this is the layer ",
|
||||
new Link("current_view", "./BuiltinLayers.md#current_view"),
|
||||
"Then, use a calculated tag on the host feature to determine the overlapping object ids",
|
||||
"At last, add this component",
|
||||
]),
|
||||
])
|
||||
}
|
||||
|
||||
constr(
|
||||
state: SpecialVisualizationState,
|
||||
tagSource: UIEventSource<Record<string, string>>,
|
||||
argument: string[]
|
||||
): BaseUIElement {
|
||||
try {
|
||||
if (
|
||||
!state.layout.official &&
|
||||
!(
|
||||
state.featureSwitchIsTesting.data ||
|
||||
state.osmConnection._oauth_config.url ===
|
||||
OsmConnection.oauth_configs["osm-test"].url
|
||||
)
|
||||
) {
|
||||
const t = Translations.t.general.add.import
|
||||
return new Combine([
|
||||
new FixedUiElement(
|
||||
"The auto-apply button is only available in official themes (or in testing mode)"
|
||||
).SetClass("alert"),
|
||||
t.howToTest,
|
||||
])
|
||||
}
|
||||
|
||||
const target_layer_id = argument[0]
|
||||
const targetTagRendering = argument[2]
|
||||
const text = argument[3]
|
||||
const icon = argument[4]
|
||||
const options = {
|
||||
target_layer_id,
|
||||
targetTagRendering,
|
||||
text,
|
||||
icon,
|
||||
}
|
||||
|
||||
return new Lazy(() => {
|
||||
const to_parse = new UIEventSource<string[]>(undefined)
|
||||
// Very ugly hack: read the value every 500ms
|
||||
Stores.Chronic(500, () => to_parse.data === undefined).addCallback(() => {
|
||||
let applicable = <string | string[]>tagSource.data[argument[1]]
|
||||
if (typeof applicable === "string") {
|
||||
applicable = JSON.parse(applicable)
|
||||
}
|
||||
to_parse.setData(<string[]>applicable)
|
||||
})
|
||||
|
||||
const loading = new Loading("Gathering which elements support auto-apply... ")
|
||||
return new VariableUiElement(
|
||||
Stores.ListStabilized(to_parse).map((ids) => {
|
||||
if (ids === undefined) {
|
||||
return loading
|
||||
}
|
||||
|
||||
if (typeof ids === "string") {
|
||||
ids = JSON.parse(ids)
|
||||
}
|
||||
return new ApplyButton(state, ids, options)
|
||||
})
|
||||
)
|
||||
})
|
||||
} catch (e) {
|
||||
return new FixedUiElement(
|
||||
"Could not generate a auto_apply-button for key " + argument[0] + " due to " + e
|
||||
).SetClass("alert")
|
||||
}
|
||||
}
|
||||
|
||||
getLayerDependencies(args: string[]): string[] {
|
||||
return [args[0]]
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue