forked from MapComplete/MapComplete
Lots of refactoring, first version of the import helper
This commit is contained in:
parent
612b8136ad
commit
3402ac0954
54 changed files with 1104 additions and 315 deletions
|
@ -145,6 +145,15 @@ export class BBox {
|
|||
this.maxLat + latDiff]])
|
||||
}
|
||||
|
||||
padAbsolute(degrees: number): BBox {
|
||||
|
||||
return new BBox([[
|
||||
this.minLon - degrees,
|
||||
this.minLat - degrees
|
||||
], [this.maxLon + degrees,
|
||||
this.maxLat + degrees]])
|
||||
}
|
||||
|
||||
toLeaflet() {
|
||||
return [[this.minLat, this.minLon], [this.maxLat, this.maxLon]]
|
||||
}
|
||||
|
|
|
@ -1,8 +1,3 @@
|
|||
/***
|
||||
* Saves all the features that are passed in to localstorage, so they can be retrieved on the next run
|
||||
*
|
||||
* Technically, more an Actor then a featuresource, but it fits more neatly this ay
|
||||
*/
|
||||
import FeatureSource, {Tiled} from "../FeatureSource";
|
||||
import {Tiles} from "../../../Models/TileRange";
|
||||
import {IdbLocalStorage} from "../../Web/IdbLocalStorage";
|
||||
|
@ -13,6 +8,11 @@ import SimpleFeatureSource from "../Sources/SimpleFeatureSource";
|
|||
import FilteredLayer from "../../../Models/FilteredLayer";
|
||||
import Loc from "../../../Models/Loc";
|
||||
|
||||
/***
|
||||
* Saves all the features that are passed in to localstorage, so they can be retrieved on the next run
|
||||
*
|
||||
* Technically, more an Actor then a featuresource, but it fits more neatly this ay
|
||||
*/
|
||||
export default class SaveTileToLocalStorageActor {
|
||||
private readonly visitedTiles: UIEventSource<Map<number, Date>>
|
||||
private readonly _layer: LayerConfig;
|
||||
|
|
|
@ -44,7 +44,7 @@ export class Imgur extends ImageProvider {
|
|||
|
||||
}
|
||||
|
||||
static uploadImage(title: string, description: string, blob,
|
||||
static uploadImage(title: string, description: string, blob: File,
|
||||
handleSuccessfullUpload: ((imageURL: string) => void),
|
||||
onFail: (reason: string) => void) {
|
||||
|
||||
|
|
|
@ -1,4 +1,3 @@
|
|||
import State from "../../../State";
|
||||
import {OsmObject} from "../OsmObject";
|
||||
import OsmChangeAction from "./OsmChangeAction";
|
||||
import {Changes} from "../Changes";
|
||||
|
@ -52,7 +51,7 @@ export default class DeleteAction extends OsmChangeAction {
|
|||
return await new ChangeTagAction(
|
||||
this._id, this._softDeletionTags, osmObject.tags,
|
||||
{
|
||||
theme: State.state?.layoutToUse?.id ?? "unkown",
|
||||
... this.meta,
|
||||
changeType: "soft-delete"
|
||||
}
|
||||
).CreateChangeDescriptions(changes)
|
||||
|
|
|
@ -9,7 +9,6 @@ import * as osmtogeojson from "osmtogeojson";
|
|||
* Interfaces overpass to get all the latest data
|
||||
*/
|
||||
export class Overpass {
|
||||
public static testUrl: string = null
|
||||
private _filter: TagsFilter
|
||||
private readonly _interpreterUrl: string;
|
||||
private readonly _timeout: UIEventSource<number>;
|
||||
|
@ -36,10 +35,6 @@ export class Overpass {
|
|||
|
||||
let query = this.buildQuery("[bbox:" + bounds.getSouth() + "," + bounds.getWest() + "," + bounds.getNorth() + "," + bounds.getEast() + "]")
|
||||
|
||||
if (Overpass.testUrl !== null) {
|
||||
console.log("Using testing URL")
|
||||
query = Overpass.testUrl;
|
||||
}
|
||||
const self = this;
|
||||
const json = await Utils.downloadJson(query)
|
||||
|
||||
|
|
|
@ -9,6 +9,7 @@ import MapState from "./MapState";
|
|||
import SelectedFeatureHandler from "../Actors/SelectedFeatureHandler";
|
||||
import Hash from "../Web/Hash";
|
||||
import {BBox} from "../BBox";
|
||||
import FeatureInfoBox from "../../UI/Popup/FeatureInfoBox";
|
||||
|
||||
export default class FeaturePipelineState extends MapState {
|
||||
|
||||
|
@ -93,8 +94,9 @@ export default class FeaturePipelineState extends MapState {
|
|||
leafletMap: self.leafletMap,
|
||||
layerToShow: source.layer.layerDef,
|
||||
doShowLayer: doShowFeatures,
|
||||
allElements: self.allElements,
|
||||
selectedElement: self.selectedElement
|
||||
selectedElement: self.selectedElement,
|
||||
state: self,
|
||||
popup: (tags, layer) => new FeatureInfoBox(tags, layer, self)
|
||||
}
|
||||
);
|
||||
}, this
|
||||
|
@ -112,11 +114,13 @@ export default class FeaturePipelineState extends MapState {
|
|||
*/
|
||||
public AddClusteringToMap(leafletMap: UIEventSource<any>) {
|
||||
const clustering = this.layoutToUse.clustering
|
||||
const self = this;
|
||||
new ShowDataLayer({
|
||||
features: this.featureAggregator.getCountsForZoom(clustering, this.locationControl, clustering.minNeededElements),
|
||||
leafletMap: leafletMap,
|
||||
layerToShow: ShowTileInfo.styling,
|
||||
enablePopups: this.featureSwitchIsDebugging.data,
|
||||
popup: this.featureSwitchIsDebugging.data ? (tags, layer) => new FeatureInfoBox(tags, layer, self) : undefined,
|
||||
state: this
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
@ -41,6 +41,12 @@ export class UIEventSource<T> {
|
|||
|
||||
source.addCallback((latestData) => {
|
||||
sink.setData(latestData?.data);
|
||||
latestData.addCallback(data => {
|
||||
if(source.data !== latestData){
|
||||
return true;
|
||||
}
|
||||
sink.setData(data)
|
||||
})
|
||||
});
|
||||
|
||||
for (const possibleSource of possibleSources ?? []) {
|
||||
|
|
|
@ -8,12 +8,17 @@ import {Utils} from "../../Utils";
|
|||
export class IdbLocalStorage {
|
||||
|
||||
|
||||
public static Get<T>(key: string, options: { defaultValue?: T }): UIEventSource<T>{
|
||||
const src = new UIEventSource<T>(options.defaultValue, "idb-local-storage:"+key)
|
||||
public static Get<T>(key: string, options?: { defaultValue?: T , whenLoaded?: (t: T) => void}): UIEventSource<T>{
|
||||
const src = new UIEventSource<T>(options?.defaultValue, "idb-local-storage:"+key)
|
||||
if(Utils.runningFromConsole){
|
||||
return src;
|
||||
}
|
||||
idb.get(key).then(v => src.setData(v ?? options.defaultValue))
|
||||
idb.get(key).then(v => {
|
||||
src.setData(v ?? options?.defaultValue);
|
||||
if(options?.whenLoaded !== undefined){
|
||||
options?.whenLoaded(v)
|
||||
}
|
||||
})
|
||||
src.addCallback(v => idb.set(key, v))
|
||||
return src;
|
||||
|
||||
|
|
|
@ -22,7 +22,7 @@ export default class Constants {
|
|||
/**
|
||||
* Layer IDs of layers which have special properties through built-in hooks
|
||||
*/
|
||||
public static readonly priviliged_layers: string[] = [...Constants.added_by_default, "type_node", "note", ...Constants.no_include]
|
||||
public static readonly priviliged_layers: string[] = [...Constants.added_by_default, "type_node", "note","import_candidate", ...Constants.no_include]
|
||||
|
||||
|
||||
// The user journey states thresholds when a new feature gets unlocked
|
||||
|
|
|
@ -19,10 +19,13 @@ export interface MinimapOptions {
|
|||
|
||||
export interface MinimapObj {
|
||||
readonly leafletMap: UIEventSource<any>,
|
||||
readonly location: UIEventSource<Loc>;
|
||||
readonly bounds: UIEventSource<BBox>;
|
||||
|
||||
installBounds(factor: number | BBox, showRange?: boolean): void
|
||||
|
||||
TakeScreenshot(): Promise<any>;
|
||||
|
||||
}
|
||||
|
||||
export default class Minimap {
|
||||
|
|
|
@ -11,19 +11,20 @@ import {BBox} from "../../Logic/BBox";
|
|||
import 'leaflet-polylineoffset'
|
||||
import {SimpleMapScreenshoter} from "leaflet-simple-map-screenshoter";
|
||||
import BackgroundMapSwitch from "../BigComponents/BackgroundMapSwitch";
|
||||
import AvailableBaseLayersImplementation from "../../Logic/Actors/AvailableBaseLayersImplementation";
|
||||
|
||||
export default class MinimapImplementation extends BaseUIElement implements MinimapObj {
|
||||
private static _nextId = 0;
|
||||
public readonly leafletMap: UIEventSource<Map>
|
||||
private readonly _id: string;
|
||||
private readonly _background: UIEventSource<BaseLayer>;
|
||||
private readonly _location: UIEventSource<Loc>;
|
||||
public readonly location: UIEventSource<Loc>;
|
||||
private _isInited = false;
|
||||
private _allowMoving: boolean;
|
||||
private readonly _leafletoptions: any;
|
||||
private readonly _onFullyLoaded: (leaflet: L.Map) => void
|
||||
private readonly _attribution: BaseUIElement | boolean;
|
||||
private readonly _bounds: UIEventSource<BBox> | undefined;
|
||||
public readonly bounds: UIEventSource<BBox> | undefined;
|
||||
private readonly _addLayerControl: boolean;
|
||||
private readonly _options: MinimapOptions;
|
||||
|
||||
|
@ -32,8 +33,8 @@ export default class MinimapImplementation extends BaseUIElement implements Mini
|
|||
options = options ?? {}
|
||||
this.leafletMap = options.leafletMap ?? new UIEventSource<Map>(undefined)
|
||||
this._background = options?.background ?? new UIEventSource<BaseLayer>(AvailableBaseLayers.osmCarto)
|
||||
this._location = options?.location ?? new UIEventSource<Loc>({lat: 0, lon: 0, zoom: 1})
|
||||
this._bounds = options?.bounds;
|
||||
this.location = options?.location ?? new UIEventSource<Loc>({lat: 0, lon: 0, zoom: 1})
|
||||
this.bounds = options?.bounds;
|
||||
this._id = "minimap" + MinimapImplementation._nextId;
|
||||
this._allowMoving = options.allowMoving ?? true;
|
||||
this._leafletoptions = options.leafletOptions ?? {}
|
||||
|
@ -46,6 +47,7 @@ export default class MinimapImplementation extends BaseUIElement implements Mini
|
|||
}
|
||||
|
||||
public static initialize() {
|
||||
AvailableBaseLayers.implement(new AvailableBaseLayersImplementation())
|
||||
Minimap.createMiniMap = options => new MinimapImplementation(options)
|
||||
}
|
||||
|
||||
|
@ -153,7 +155,7 @@ export default class MinimapImplementation extends BaseUIElement implements Mini
|
|||
|
||||
if (this._addLayerControl) {
|
||||
const switcher = new BackgroundMapSwitch({
|
||||
locationControl: this._location,
|
||||
locationControl: this.location,
|
||||
backgroundLayer: this._background
|
||||
},
|
||||
this._background
|
||||
|
@ -180,7 +182,7 @@ export default class MinimapImplementation extends BaseUIElement implements Mini
|
|||
return;
|
||||
}
|
||||
this._isInited = true;
|
||||
const location = this._location;
|
||||
const location = this.location;
|
||||
const self = this;
|
||||
let currentLayer = this._background.data.layer()
|
||||
let latLon = <[number, number]>[location.data?.lat ?? 0, location.data?.lon ?? 0]
|
||||
|
@ -268,8 +270,8 @@ export default class MinimapImplementation extends BaseUIElement implements Mini
|
|||
isRecursing = true;
|
||||
location.ping();
|
||||
|
||||
if (self._bounds !== undefined) {
|
||||
self._bounds.setData(BBox.fromLeafletBounds(map.getBounds()))
|
||||
if (self.bounds !== undefined) {
|
||||
self.bounds.setData(BBox.fromLeafletBounds(map.getBounds()))
|
||||
}
|
||||
|
||||
|
||||
|
@ -295,8 +297,8 @@ export default class MinimapImplementation extends BaseUIElement implements Mini
|
|||
}
|
||||
})
|
||||
|
||||
if (self._bounds !== undefined) {
|
||||
self._bounds.setData(BBox.fromLeafletBounds(map.getBounds()))
|
||||
if (self.bounds !== undefined) {
|
||||
self.bounds.setData(BBox.fromLeafletBounds(map.getBounds()))
|
||||
}
|
||||
|
||||
|
||||
|
|
|
@ -50,10 +50,14 @@ export default class ScrollableFullScreen extends UIElement {
|
|||
self.Activate();
|
||||
} else {
|
||||
// Some cleanup...
|
||||
ScrollableFullScreen.empty.AttachTo("fullscreen")
|
||||
|
||||
const fs = document.getElementById("fullscreen");
|
||||
if(fs !== null){
|
||||
ScrollableFullScreen.empty.AttachTo("fullscreen")
|
||||
fs.classList.add("hidden")
|
||||
}
|
||||
|
||||
ScrollableFullScreen._currentlyOpen?.isShown?.setData(false);
|
||||
fs.classList.add("hidden")
|
||||
}
|
||||
})
|
||||
|
||||
|
|
|
@ -127,7 +127,7 @@ export default class Histogram<T> extends VariableUiElement {
|
|||
|
||||
]),
|
||||
keys.map(_ => ["width: 20%"])
|
||||
).SetClass("w-full");
|
||||
).SetClass("w-full zebra-table");
|
||||
}, [sortMode]));
|
||||
}
|
||||
}
|
|
@ -7,40 +7,16 @@ import Svg from "../../Svg";
|
|||
import AllDownloads from "./AllDownloads";
|
||||
import FilterView from "./FilterView";
|
||||
import {UIEventSource} from "../../Logic/UIEventSource";
|
||||
import FeaturePipeline from "../../Logic/FeatureSource/FeaturePipeline";
|
||||
import Loc from "../../Models/Loc";
|
||||
import {BBox} from "../../Logic/BBox";
|
||||
import LayoutConfig from "../../Models/ThemeConfig/LayoutConfig";
|
||||
import FilteredLayer from "../../Models/FilteredLayer";
|
||||
import BaseLayer from "../../Models/BaseLayer";
|
||||
import {OsmConnection} from "../../Logic/Osm/OsmConnection";
|
||||
import BackgroundMapSwitch from "./BackgroundMapSwitch";
|
||||
import {FeatureSourceForLayer} from "../../Logic/FeatureSource/FeatureSource";
|
||||
import Lazy from "../Base/Lazy";
|
||||
import {VariableUiElement} from "../Base/VariableUIElement";
|
||||
import FeatureInfoBox from "../Popup/FeatureInfoBox";
|
||||
import {ElementStorage} from "../../Logic/ElementStorage";
|
||||
import FeatureSwitchState from "../../Logic/State/FeatureSwitchState";
|
||||
import CopyrightPanel from "./CopyrightPanel";
|
||||
import FeaturePipelineState from "../../Logic/State/FeaturePipelineState";
|
||||
|
||||
export default class LeftControls extends Combine {
|
||||
|
||||
constructor(state: FeatureSwitchState & {
|
||||
allElements: ElementStorage;
|
||||
currentView: FeatureSourceForLayer;
|
||||
featureSwitchBackgroundSelection: UIEventSource<boolean>;
|
||||
layoutToUse: LayoutConfig,
|
||||
featurePipeline: FeaturePipeline,
|
||||
currentBounds: UIEventSource<BBox>,
|
||||
locationControl: UIEventSource<Loc>,
|
||||
overlayToggles: any,
|
||||
featureSwitchEnableExport: UIEventSource<boolean>,
|
||||
featureSwitchExportAsPdf: UIEventSource<boolean>,
|
||||
filteredLayers: UIEventSource<FilteredLayer[]>,
|
||||
featureSwitchFilter: UIEventSource<boolean>,
|
||||
backgroundLayer: UIEventSource<BaseLayer>,
|
||||
osmConnection: OsmConnection
|
||||
},
|
||||
constructor(state: FeaturePipelineState,
|
||||
guiState: {
|
||||
currentViewControlIsOpened: UIEventSource<boolean>;
|
||||
downloadControlIsOpened: UIEventSource<boolean>,
|
||||
|
@ -74,7 +50,7 @@ export default class LeftControls extends Combine {
|
|||
}
|
||||
return new Lazy(() => {
|
||||
const tagsSource = state.allElements.getEventSourceById(feature.properties.id)
|
||||
return new FeatureInfoBox(tagsSource, currentViewFL.layerDef, "currentview", guiState.currentViewControlIsOpened)
|
||||
return new FeatureInfoBox(tagsSource, currentViewFL.layerDef,state, "currentview", guiState.currentViewControlIsOpened)
|
||||
.SetClass("md:floating-element-width")
|
||||
})
|
||||
}))
|
||||
|
|
|
@ -61,7 +61,6 @@ export default class DefaultGUI {
|
|||
const hasPresets = state.layoutToUse.layers.some(layer => layer.presets.length > 0);
|
||||
const noteLayer: FilteredLayer = state.filteredLayers.data.filter(l => l.layerDef.id === "note")[0]
|
||||
let addNewNoteDialog: (isShown: UIEventSource<boolean>) => BaseUIElement = undefined;
|
||||
const t = Translations.t.notes
|
||||
if (noteLayer !== undefined) {
|
||||
addNewNoteDialog = (isShown) => new NewNoteUi(noteLayer, isShown, state)
|
||||
}
|
||||
|
@ -144,7 +143,8 @@ export default class DefaultGUI {
|
|||
leafletMap: state.leafletMap,
|
||||
layerToShow: new LayerConfig(home_location_json, "all_known_layers", true),
|
||||
features: state.homeLocation,
|
||||
enablePopups: false,
|
||||
popup: undefined,
|
||||
state
|
||||
})
|
||||
|
||||
state.leafletMap.addCallbackAndRunD(_ => {
|
||||
|
|
|
@ -91,8 +91,9 @@ export default class ExportPDF {
|
|||
features: tile,
|
||||
leafletMap: minimap.leafletMap,
|
||||
layerToShow: tile.layer.layerDef,
|
||||
enablePopups: false,
|
||||
doShowLayer: tile.layer.isDisplayed
|
||||
popup: undefined,
|
||||
doShowLayer: tile.layer.isDisplayed,
|
||||
state: undefined
|
||||
}
|
||||
)
|
||||
})
|
||||
|
|
242
UI/ImportFlow/ConflationChecker.ts
Normal file
242
UI/ImportFlow/ConflationChecker.ts
Normal file
|
@ -0,0 +1,242 @@
|
|||
import {BBox} from "../../Logic/BBox";
|
||||
import LayerConfig from "../../Models/ThemeConfig/LayerConfig";
|
||||
import Combine from "../Base/Combine";
|
||||
import Title from "../Base/Title";
|
||||
import {Overpass} from "../../Logic/Osm/Overpass";
|
||||
import {UIEventSource} from "../../Logic/UIEventSource";
|
||||
import Constants from "../../Models/Constants";
|
||||
import RelationsTracker from "../../Logic/Osm/RelationsTracker";
|
||||
import {VariableUiElement} from "../Base/VariableUIElement";
|
||||
import {FixedUiElement} from "../Base/FixedUiElement";
|
||||
import {FlowStep} from "./FlowStep";
|
||||
import Loading from "../Base/Loading";
|
||||
import {SubtleButton} from "../Base/SubtleButton";
|
||||
import Svg from "../../Svg";
|
||||
import {Utils} from "../../Utils";
|
||||
import {IdbLocalStorage} from "../../Logic/Web/IdbLocalStorage";
|
||||
import Minimap from "../Base/Minimap";
|
||||
import BaseLayer from "../../Models/BaseLayer";
|
||||
import AvailableBaseLayers from "../../Logic/Actors/AvailableBaseLayers";
|
||||
import Loc from "../../Models/Loc";
|
||||
import Attribution from "../BigComponents/Attribution";
|
||||
import ShowDataLayer from "../ShowDataLayer/ShowDataLayer";
|
||||
import StaticFeatureSource from "../../Logic/FeatureSource/Sources/StaticFeatureSource";
|
||||
import ValidatedTextField from "../Input/ValidatedTextField";
|
||||
import {LocalStorageSource} from "../../Logic/Web/LocalStorageSource";
|
||||
import * as currentview from "../../assets/layers/current_view/current_view.json"
|
||||
import * as import_candidate from "../../assets/layers/import_candidate/import_candidate.json"
|
||||
import {GeoOperations} from "../../Logic/GeoOperations";
|
||||
import FeatureInfoBox from "../Popup/FeatureInfoBox";
|
||||
/**
|
||||
* Given the data to import, the bbox and the layer, will query overpass for similar items
|
||||
*/
|
||||
export default class ConflationChecker extends Combine implements FlowStep<any> {
|
||||
|
||||
public readonly IsValid
|
||||
public readonly Value
|
||||
|
||||
constructor(
|
||||
state,
|
||||
params: { bbox: BBox, layer: LayerConfig, geojson: any }) {
|
||||
|
||||
|
||||
const bbox = params.bbox.padAbsolute(0.0001)
|
||||
const layer = params.layer;
|
||||
const toImport = params.geojson;
|
||||
let overpassStatus = new UIEventSource<{ error: string } | "running" | "success" | "idle" | "cached" >("idle")
|
||||
|
||||
const fromLocalStorage = IdbLocalStorage.Get<[any, Date]>("importer-overpass-cache-" + layer.id, {
|
||||
whenLoaded: (v) => {
|
||||
if (v !== undefined) {
|
||||
console.log("Loaded from local storage:", v)
|
||||
const [geojson, date] = v;
|
||||
const timeDiff = (new Date().getTime() - date.getTime()) / 1000;
|
||||
console.log("The cache is ", timeDiff, "seconds old")
|
||||
if (timeDiff < 24 * 60 * 60) {
|
||||
// Recently cached!
|
||||
overpassStatus.setData("cached")
|
||||
return;
|
||||
}
|
||||
}
|
||||
// Load the data!
|
||||
const url = Constants.defaultOverpassUrls[1]
|
||||
const relationTracker = new RelationsTracker()
|
||||
const overpass = new Overpass(params.layer.source.osmTags, [], url, new UIEventSource<number>(180), relationTracker, true)
|
||||
console.log("Loading from overpass!")
|
||||
overpassStatus.setData("running")
|
||||
overpass.queryGeoJson(bbox).then(
|
||||
([data, date] ) => {
|
||||
console.log("Received overpass-data: ", data.features.length,"features are loaded at ", date);
|
||||
overpassStatus.setData("success")
|
||||
fromLocalStorage.setData([data, date])
|
||||
},
|
||||
(error) => {overpassStatus.setData({error})})
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
const geojson : UIEventSource<any> = fromLocalStorage.map(d => {
|
||||
if (d === undefined) {
|
||||
return undefined
|
||||
}
|
||||
return d[0]
|
||||
})
|
||||
|
||||
const background = new UIEventSource<BaseLayer>(AvailableBaseLayers.osmCarto)
|
||||
const location = new UIEventSource<Loc>({lat: 0, lon: 0, zoom: 1})
|
||||
const currentBounds = new UIEventSource<BBox>(undefined)
|
||||
const zoomLevel = ValidatedTextField.InputForType("pnat")
|
||||
zoomLevel.SetClass("ml-1 border border-black")
|
||||
zoomLevel.GetValue().syncWith(LocalStorageSource.Get("importer-zoom-level", "14"), true)
|
||||
const osmLiveData = Minimap.createMiniMap({
|
||||
allowMoving: true,
|
||||
location,
|
||||
background,
|
||||
bounds: currentBounds,
|
||||
attribution: new Attribution(location, state.osmConnection.userDetails, undefined, currentBounds)
|
||||
})
|
||||
osmLiveData.SetClass("w-full").SetStyle("height: 500px")
|
||||
const preview = new StaticFeatureSource(geojson.map(geojson => {
|
||||
if(geojson?.features === undefined){
|
||||
return []
|
||||
}
|
||||
const zoomedEnough: boolean = osmLiveData.location.data.zoom >= Number(zoomLevel.GetValue().data)
|
||||
if(!zoomedEnough){
|
||||
return []
|
||||
}
|
||||
const bounds = osmLiveData.bounds.data
|
||||
return geojson.features.filter(f => BBox.get(f).overlapsWith(bounds))
|
||||
}, [osmLiveData.bounds, zoomLevel.GetValue()]), false);
|
||||
|
||||
|
||||
|
||||
new ShowDataLayer({
|
||||
layerToShow:new LayerConfig(currentview),
|
||||
state,
|
||||
leafletMap: osmLiveData.leafletMap,
|
||||
enablePopups: undefined,
|
||||
zoomToFeatures: true,
|
||||
features: new StaticFeatureSource([
|
||||
bbox.asGeoJson({})
|
||||
], false)
|
||||
})
|
||||
|
||||
|
||||
new ShowDataLayer({
|
||||
layerToShow:layer,
|
||||
state,
|
||||
leafletMap: osmLiveData.leafletMap,
|
||||
popup: (tags, layer) => new FeatureInfoBox(tags, layer, state),
|
||||
zoomToFeatures: false,
|
||||
features: preview
|
||||
})
|
||||
|
||||
new ShowDataLayer({
|
||||
layerToShow:new LayerConfig(import_candidate),
|
||||
state,
|
||||
leafletMap: osmLiveData.leafletMap,
|
||||
popup: (tags, layer) => new FeatureInfoBox(tags, layer, state),
|
||||
zoomToFeatures: false,
|
||||
features: new StaticFeatureSource(toImport.features, false)
|
||||
})
|
||||
|
||||
const nearbyCutoff = ValidatedTextField.InputForType("pnat")
|
||||
nearbyCutoff.SetClass("ml-1 border border-black")
|
||||
nearbyCutoff.GetValue().syncWith(LocalStorageSource.Get("importer-cutoff", "25"), true)
|
||||
|
||||
const matchedFeaturesMap = Minimap.createMiniMap({
|
||||
allowMoving: true,
|
||||
background
|
||||
})
|
||||
matchedFeaturesMap.SetClass("w-full").SetStyle("height: 500px")
|
||||
|
||||
// Featuresource showing OSM-features which are nearby a toImport-feature
|
||||
const nearbyFeatures = new StaticFeatureSource(geojson.map(osmData => {
|
||||
if(osmData?.features === undefined){
|
||||
return []
|
||||
}
|
||||
const maxDist = Number(nearbyCutoff.GetValue().data)
|
||||
return osmData.features.filter(f =>
|
||||
toImport.features.some(imp =>
|
||||
maxDist >= GeoOperations.distanceBetween(imp.geometry.coordinates, GeoOperations.centerpointCoordinates(f))) )
|
||||
}, [nearbyCutoff.GetValue()]), false);
|
||||
|
||||
// Featuresource showing OSM-features which are nearby a toImport-feature
|
||||
const toImportWithNearby = new StaticFeatureSource(geojson.map(osmData => {
|
||||
if(osmData?.features === undefined){
|
||||
return []
|
||||
}
|
||||
const maxDist = Number(nearbyCutoff.GetValue().data)
|
||||
return toImport.features.filter(imp =>
|
||||
osmData.features.some(f =>
|
||||
maxDist >= GeoOperations.distanceBetween(imp.geometry.coordinates, GeoOperations.centerpointCoordinates(f))) )
|
||||
}, [nearbyCutoff.GetValue()]), false);
|
||||
|
||||
new ShowDataLayer({
|
||||
layerToShow:layer,
|
||||
state,
|
||||
leafletMap: matchedFeaturesMap.leafletMap,
|
||||
popup: (tags, layer) => new FeatureInfoBox(tags, layer, state),
|
||||
zoomToFeatures: true,
|
||||
features: nearbyFeatures
|
||||
})
|
||||
|
||||
new ShowDataLayer({
|
||||
layerToShow:new LayerConfig(import_candidate),
|
||||
state,
|
||||
leafletMap: matchedFeaturesMap.leafletMap,
|
||||
popup: (tags, layer) => new FeatureInfoBox(tags, layer, state),
|
||||
zoomToFeatures: false,
|
||||
features: toImportWithNearby
|
||||
})
|
||||
|
||||
|
||||
super([
|
||||
new Title("Comparison with existing data"),
|
||||
new VariableUiElement(overpassStatus.map(d => {
|
||||
if (d === "idle") {
|
||||
return new Loading("Checking local storage...")
|
||||
}
|
||||
if (d["error"] !== undefined) {
|
||||
return new FixedUiElement("Could not load latest data from overpass: " + d["error"]).SetClass("alert")
|
||||
}
|
||||
if(d === "running"){
|
||||
return new Loading("Querying overpass...")
|
||||
}
|
||||
if(d === "cached"){
|
||||
return new FixedUiElement("Fetched data from local storage")
|
||||
}
|
||||
if(d === "success"){
|
||||
return new FixedUiElement("Data loaded")
|
||||
}
|
||||
return new FixedUiElement("Unexpected state "+d).SetClass("alert")
|
||||
})),
|
||||
new VariableUiElement(
|
||||
geojson.map(geojson => {
|
||||
if (geojson === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
return new SubtleButton(Svg.download_svg(), "Download the loaded geojson from overpass").onClick(() => {
|
||||
Utils.offerContentsAsDownloadableFile(JSON.stringify(geojson, null, " "), "mapcomplete-" + layer.id + ".geojson", {
|
||||
mimetype: "application/json+geo"
|
||||
})
|
||||
});
|
||||
})),
|
||||
|
||||
new Title("Live data on OSM"),
|
||||
osmLiveData,
|
||||
new Combine(["The live data is shown if the zoomlevel is at least ", zoomLevel, ". The current zoom level is ", new VariableUiElement(osmLiveData.location.map(l => ""+l.zoom))]).SetClass("flex"),
|
||||
|
||||
new Title("Nearby features"),
|
||||
new Combine([ "The following map shows features to import which have an OSM-feature within ", nearbyCutoff, "meter"]).SetClass("flex"),
|
||||
new FixedUiElement("The red elements on the following map will <b>not</b> be imported!").SetClass("alert"),
|
||||
"Set the range to 0 or 1 if you want to import them all",
|
||||
matchedFeaturesMap
|
||||
])
|
||||
|
||||
this.IsValid = new UIEventSource(false)
|
||||
this.Value = new UIEventSource(undefined)
|
||||
}
|
||||
|
||||
}
|
156
UI/ImportFlow/DataPanel.ts
Normal file
156
UI/ImportFlow/DataPanel.ts
Normal file
|
@ -0,0 +1,156 @@
|
|||
import Combine from "../Base/Combine";
|
||||
import {UIEventSource} from "../../Logic/UIEventSource";
|
||||
import {BBox} from "../../Logic/BBox";
|
||||
import UserRelatedState from "../../Logic/State/UserRelatedState";
|
||||
import Translations from "../i18n/Translations";
|
||||
import {AllKnownLayouts} from "../../Customizations/AllKnownLayouts";
|
||||
import Constants from "../../Models/Constants";
|
||||
import {DropDown} from "../Input/DropDown";
|
||||
import {Utils} from "../../Utils";
|
||||
import LayerConfig from "../../Models/ThemeConfig/LayerConfig";
|
||||
import BaseLayer from "../../Models/BaseLayer";
|
||||
import AvailableBaseLayers from "../../Logic/Actors/AvailableBaseLayers";
|
||||
import Loc from "../../Models/Loc";
|
||||
import Minimap from "../Base/Minimap";
|
||||
import Attribution from "../BigComponents/Attribution";
|
||||
import ShowDataMultiLayer from "../ShowDataLayer/ShowDataMultiLayer";
|
||||
import FilteredLayer, {FilterState} from "../../Models/FilteredLayer";
|
||||
import StaticFeatureSource from "../../Logic/FeatureSource/Sources/StaticFeatureSource";
|
||||
import Toggle from "../Input/Toggle";
|
||||
import Table from "../Base/Table";
|
||||
import {VariableUiElement} from "../Base/VariableUIElement";
|
||||
import {FixedUiElement} from "../Base/FixedUiElement";
|
||||
import {FlowStep} from "./FlowStep";
|
||||
import {Layer} from "leaflet";
|
||||
|
||||
/**
|
||||
* Shows the data to import on a map, asks for the correct layer to be selected
|
||||
*/
|
||||
export class DataPanel extends Combine implements FlowStep<{ bbox: BBox, layer: LayerConfig, geojson: any }>{
|
||||
public readonly IsValid: UIEventSource<boolean>;
|
||||
public readonly Value: UIEventSource<{ bbox: BBox, layer: LayerConfig, geojson: any }>
|
||||
|
||||
constructor(
|
||||
state: UserRelatedState,
|
||||
geojson: { features: { properties: any, geometry: { coordinates: [number, number] } }[] }) {
|
||||
const t = Translations.t.importHelper;
|
||||
|
||||
const propertyKeys = new Set<string>()
|
||||
console.log("Datapanel input got ", geojson)
|
||||
for (const f of geojson.features) {
|
||||
Object.keys(f.properties).forEach(key => propertyKeys.add(key))
|
||||
}
|
||||
|
||||
|
||||
const availableLayers = AllKnownLayouts.AllPublicLayers().filter(l => l.name !== undefined && Constants.priviliged_layers.indexOf(l.id) < 0)
|
||||
const layerPicker = new DropDown("Which layer does this import match with?",
|
||||
[{shown: t.selectLayer, value: undefined}].concat(availableLayers.map(l => ({
|
||||
shown: l.name,
|
||||
value: l
|
||||
})))
|
||||
)
|
||||
|
||||
let autodetected = new UIEventSource(false)
|
||||
for (const layer of availableLayers) {
|
||||
const mismatched = geojson.features.some(f =>
|
||||
!layer.source.osmTags.matchesProperties(f.properties)
|
||||
)
|
||||
if (!mismatched) {
|
||||
layerPicker.GetValue().setData(layer);
|
||||
layerPicker.GetValue().addCallback(_ => autodetected.setData(false))
|
||||
autodetected.setData(true)
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
const withId = geojson.features.map((f, i) => {
|
||||
const copy = Utils.Clone(f)
|
||||
copy.properties.id = "to-import/" + i
|
||||
return copy
|
||||
})
|
||||
|
||||
const matching: UIEventSource<{ properties: any, geometry: { coordinates: [number, number] } }[]> = layerPicker.GetValue().map((layer: LayerConfig) => {
|
||||
if (layer === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
const matching: { properties: any, geometry: { coordinates: [number, number] } }[] = []
|
||||
|
||||
for (const feature of withId) {
|
||||
if (layer.source.osmTags.matchesProperties(feature.properties)) {
|
||||
matching.push(feature)
|
||||
}
|
||||
}
|
||||
|
||||
return matching
|
||||
})
|
||||
const background = new UIEventSource<BaseLayer>(AvailableBaseLayers.osmCarto)
|
||||
const location = new UIEventSource<Loc>({lat: 0, lon: 0, zoom: 1})
|
||||
const currentBounds = new UIEventSource<BBox>(undefined)
|
||||
const map = Minimap.createMiniMap({
|
||||
allowMoving: true,
|
||||
location,
|
||||
background,
|
||||
bounds: currentBounds,
|
||||
attribution: new Attribution(location, state.osmConnection.userDetails, undefined, currentBounds)
|
||||
})
|
||||
map.SetClass("w-full").SetStyle("height: 500px")
|
||||
|
||||
new ShowDataMultiLayer({
|
||||
layers: new UIEventSource<FilteredLayer[]>(AllKnownLayouts.AllPublicLayers().map(l => ({
|
||||
layerDef: l,
|
||||
isDisplayed: new UIEventSource<boolean>(true),
|
||||
appliedFilters: new UIEventSource<Map<string, FilterState>>(undefined)
|
||||
}))),
|
||||
zoomToFeatures: true,
|
||||
features: new StaticFeatureSource(matching, false),
|
||||
state: {
|
||||
...state,
|
||||
filteredLayers: new UIEventSource<FilteredLayer[]>(undefined),
|
||||
backgroundLayer: background
|
||||
},
|
||||
leafletMap: map.leafletMap,
|
||||
|
||||
})
|
||||
var bbox = matching.map(feats => BBox.bboxAroundAll(feats.map(f => new BBox([f.geometry.coordinates]))))
|
||||
|
||||
super([
|
||||
"Has " + geojson.features.length + " features",
|
||||
layerPicker,
|
||||
new Toggle("Automatically detected layer", undefined, autodetected),
|
||||
new Table(["", "Key", "Values", "Unique values seen"],
|
||||
Array.from(propertyKeys).map(key => {
|
||||
const uniqueValues = Utils.Dedup(Utils.NoNull(geojson.features.map(f => f.properties[key])))
|
||||
uniqueValues.sort()
|
||||
return [geojson.features.filter(f => f.properties[key] !== undefined).length + "", key, uniqueValues.join(", "), "" + uniqueValues.length]
|
||||
})
|
||||
).SetClass("zebra-table table-auto"),
|
||||
new VariableUiElement(matching.map(matching => {
|
||||
if (matching === undefined) {
|
||||
return undefined
|
||||
}
|
||||
const diff = geojson.features.length - matching.length;
|
||||
if (diff === 0) {
|
||||
return undefined
|
||||
}
|
||||
const obligatory = layerPicker.GetValue().data?.source?.osmTags?.asHumanString(false, false, {});
|
||||
return new FixedUiElement(`${diff} features will _not_ match this layer. Make sure that all obligatory objects are present: ${obligatory}`).SetClass("alert");
|
||||
})),
|
||||
map
|
||||
]);
|
||||
|
||||
this.Value = bbox.map(bbox =>
|
||||
({
|
||||
bbox,
|
||||
geojson,
|
||||
layer: layerPicker.GetValue().data
|
||||
}), [layerPicker.GetValue()])
|
||||
this.IsValid = matching.map(matching => {
|
||||
if (matching === undefined) {
|
||||
return false
|
||||
}
|
||||
const diff = geojson.features.length - matching.length;
|
||||
return diff === 0;
|
||||
})
|
||||
|
||||
}
|
||||
}
|
105
UI/ImportFlow/FlowStep.ts
Normal file
105
UI/ImportFlow/FlowStep.ts
Normal file
|
@ -0,0 +1,105 @@
|
|||
import {UIEventSource} from "../../Logic/UIEventSource";
|
||||
import Combine from "../Base/Combine";
|
||||
import BaseUIElement from "../BaseUIElement";
|
||||
import {SubtleButton} from "../Base/SubtleButton";
|
||||
import Svg from "../../Svg";
|
||||
import Translations from "../i18n/Translations";
|
||||
import {VariableUiElement} from "../Base/VariableUIElement";
|
||||
import Toggle from "../Input/Toggle";
|
||||
import {UIElement} from "../UIElement";
|
||||
|
||||
export interface FlowStep<T> extends BaseUIElement{
|
||||
readonly IsValid: UIEventSource<boolean>
|
||||
readonly Value: UIEventSource<T>
|
||||
}
|
||||
|
||||
export class FlowPanelFactory<T> {
|
||||
private _initial: FlowStep<any>;
|
||||
private _steps: ((x: any) => FlowStep<any>)[];
|
||||
private _stepNames: string[];
|
||||
|
||||
private constructor(initial: FlowStep<any>, steps: ((x:any) => FlowStep<any>)[], stepNames: string[]) {
|
||||
this._initial = initial;
|
||||
this._steps = steps;
|
||||
this._stepNames = stepNames;
|
||||
}
|
||||
|
||||
public static start<TOut> (step: FlowStep<TOut>): FlowPanelFactory<TOut>{
|
||||
return new FlowPanelFactory(step, [], [])
|
||||
}
|
||||
|
||||
public then<TOut>(name: string, construct: ((t:T) => FlowStep<TOut>)): FlowPanelFactory<TOut>{
|
||||
return new FlowPanelFactory<TOut>(
|
||||
this._initial,
|
||||
this._steps.concat([construct]),
|
||||
this._stepNames.concat([name])
|
||||
)
|
||||
}
|
||||
|
||||
public finish(construct: ((t: T, backButton?: BaseUIElement) => BaseUIElement)) : BaseUIElement {
|
||||
// Construct all the flowpanels step by step (in reverse order)
|
||||
const nextConstr : ((t:any, back?: UIElement) => BaseUIElement)[] = this._steps.map(_ => undefined)
|
||||
nextConstr.push(construct)
|
||||
|
||||
for (let i = this._steps.length - 1; i >= 0; i--){
|
||||
const createFlowStep : (value) => FlowStep<any> = this._steps[i];
|
||||
nextConstr[i] = (value, backButton) => {
|
||||
console.log("Creating flowSTep ", this._stepNames[i])
|
||||
const flowStep = createFlowStep(value)
|
||||
return new FlowPanel(flowStep, nextConstr[i + 1], backButton);
|
||||
}
|
||||
}
|
||||
|
||||
return new FlowPanel(this._initial, nextConstr[0],undefined)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export class FlowPanel<T> extends Toggle {
|
||||
|
||||
constructor(
|
||||
initial: (FlowStep<T>),
|
||||
constructNextstep: ((input: T, backButton: BaseUIElement) => BaseUIElement),
|
||||
backbutton?: BaseUIElement
|
||||
) {
|
||||
const t = Translations.t.general;
|
||||
|
||||
const currentStepActive = new UIEventSource(true);
|
||||
|
||||
let nextStep: UIEventSource<BaseUIElement>= new UIEventSource<BaseUIElement>(undefined)
|
||||
const backButtonForNextStep = new SubtleButton(Svg.back_svg(), t.back).onClick(() => {
|
||||
currentStepActive.setData(true)
|
||||
})
|
||||
|
||||
let elements : (BaseUIElement | string)[] = []
|
||||
if(initial !== undefined){
|
||||
// Startup the flow
|
||||
elements = [
|
||||
initial,
|
||||
new Combine([
|
||||
backbutton,
|
||||
new Toggle(
|
||||
new SubtleButton(Svg.back_svg().SetStyle("transform: rotate(180deg);"), t.next).onClick(() => {
|
||||
const v = initial.Value.data;
|
||||
nextStep.setData(constructNextstep(v, backButtonForNextStep))
|
||||
currentStepActive.setData(false)
|
||||
}),
|
||||
"Select a valid value to continue",
|
||||
initial.IsValid
|
||||
)
|
||||
]).SetClass("flex w-full justify-end space-x-2")
|
||||
|
||||
]
|
||||
}
|
||||
|
||||
|
||||
super(
|
||||
new Combine(elements).SetClass("h-full flex flex-col justify-between"),
|
||||
new VariableUiElement(nextStep),
|
||||
currentStepActive
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
67
UI/ImportFlow/ImportHelperGui.ts
Normal file
67
UI/ImportFlow/ImportHelperGui.ts
Normal file
|
@ -0,0 +1,67 @@
|
|||
import Combine from "../Base/Combine";
|
||||
import {LoginToggle} from "../Popup/LoginButton";
|
||||
import Toggle from "../Input/Toggle";
|
||||
import LanguagePicker from "../LanguagePicker";
|
||||
import BackToIndex from "../BigComponents/BackToIndex";
|
||||
import UserRelatedState from "../../Logic/State/UserRelatedState";
|
||||
import BaseUIElement from "../BaseUIElement";
|
||||
import MoreScreen from "../BigComponents/MoreScreen";
|
||||
import MinimapImplementation from "../Base/MinimapImplementation";
|
||||
import Translations from "../i18n/Translations";
|
||||
import Constants from "../../Models/Constants";
|
||||
import {FlowPanel, FlowPanelFactory} from "./FlowStep";
|
||||
import {RequestFile} from "./RequestFile";
|
||||
import {DataPanel} from "./DataPanel";
|
||||
import {FixedUiElement} from "../Base/FixedUiElement";
|
||||
import ConflationChecker from "./ConflationChecker";
|
||||
|
||||
export default class ImportHelperGui extends LoginToggle {
|
||||
constructor() {
|
||||
const t = Translations.t.importHelper;
|
||||
|
||||
const state = new UserRelatedState(undefined)
|
||||
|
||||
// We disable the userbadge, as various 'showData'-layers will give a read-only view in this case
|
||||
state.featureSwitchUserbadge.setData(false)
|
||||
|
||||
const leftContents: BaseUIElement[] = [
|
||||
new BackToIndex().SetClass("block pl-4"),
|
||||
LanguagePicker.CreateLanguagePicker(Translations.t.importHelper.title.SupportedLanguages())?.SetClass("mt-4 self-end flex-col"),
|
||||
].map(el => el?.SetClass("pl-4"))
|
||||
|
||||
const leftBar = new Combine([
|
||||
new Combine(leftContents).SetClass("sticky top-4 m-4")
|
||||
]).SetClass("block w-full md:w-2/6 lg:w-1/6")
|
||||
|
||||
|
||||
const mainPanel =
|
||||
FlowPanelFactory
|
||||
.start(new RequestFile())
|
||||
.then("datapanel", geojson => new DataPanel(state, geojson))
|
||||
.then("conflation", v => new ConflationChecker(state, v))
|
||||
.finish(_ => new FixedUiElement("All done!"))
|
||||
|
||||
super(
|
||||
new Toggle(
|
||||
new Combine([
|
||||
leftBar,
|
||||
mainPanel.SetClass("m-8 w-full mb-24")
|
||||
]).SetClass("h-full block md:flex")
|
||||
|
||||
,
|
||||
new Combine([
|
||||
t.lockNotice.Subs(Constants.userJourney),
|
||||
MoreScreen.CreateProffessionalSerivesButton()
|
||||
])
|
||||
|
||||
,
|
||||
state.osmConnection.userDetails.map(ud => ud.csCount >= Constants.userJourney.importHelperUnlock)),
|
||||
|
||||
"Login needed...",
|
||||
state)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
MinimapImplementation.initialize()
|
||||
new ImportHelperGui().AttachTo("main")
|
145
UI/ImportFlow/RequestFile.ts
Normal file
145
UI/ImportFlow/RequestFile.ts
Normal file
|
@ -0,0 +1,145 @@
|
|||
import Combine from "../Base/Combine";
|
||||
import {UIEventSource} from "../../Logic/UIEventSource";
|
||||
import Translations from "../i18n/Translations";
|
||||
import {SubtleButton} from "../Base/SubtleButton";
|
||||
import {VariableUiElement} from "../Base/VariableUIElement";
|
||||
import {FixedUiElement} from "../Base/FixedUiElement";
|
||||
import Title from "../Base/Title";
|
||||
import InputElementMap from "../Input/InputElementMap";
|
||||
import BaseUIElement from "../BaseUIElement";
|
||||
import FileSelectorButton from "../Input/FileSelectorButton";
|
||||
import {FlowStep} from "./FlowStep";
|
||||
|
||||
class FileSelector extends InputElementMap<FileList, { name: string, contents: Promise<string> }> {
|
||||
constructor(label: BaseUIElement) {
|
||||
super(
|
||||
new FileSelectorButton(label, {allowMultiple: false, acceptType: "*"}),
|
||||
(x0, x1) => {
|
||||
// Total hack: x1 is undefined is the backvalue - we effectively make this a one-way-story
|
||||
return x1 === undefined || x0 === x1;
|
||||
},
|
||||
filelist => {
|
||||
if (filelist === undefined) {
|
||||
return undefined
|
||||
}
|
||||
const file = filelist.item(0)
|
||||
return {name: file.name, contents: file.text()}
|
||||
},
|
||||
_ => undefined
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* The first step in the import flow: load a file and validate that it is a correct geojson or CSV file
|
||||
*/
|
||||
export class RequestFile extends Combine implements FlowStep<any> {
|
||||
|
||||
public readonly IsValid: UIEventSource<boolean>
|
||||
/**
|
||||
* The loaded GeoJSON
|
||||
*/
|
||||
public readonly Value: UIEventSource<any>
|
||||
|
||||
constructor() {
|
||||
const t = Translations.t.importHelper;
|
||||
const csvSelector = new FileSelector(new SubtleButton(undefined, t.selectFile))
|
||||
const loadedFiles = new VariableUiElement(csvSelector.GetValue().map(file => {
|
||||
if (file === undefined) {
|
||||
return t.noFilesLoaded.SetClass("alert")
|
||||
}
|
||||
return t.loadedFilesAre.Subs({file: file.name}).SetClass("thanks")
|
||||
}))
|
||||
|
||||
const text = UIEventSource.flatten(
|
||||
csvSelector.GetValue().map(v => {
|
||||
if (v === undefined) {
|
||||
return undefined
|
||||
}
|
||||
return UIEventSource.FromPromise(v.contents)
|
||||
}))
|
||||
|
||||
const asGeoJson: UIEventSource<any | { error: string }> = text.map(src => {
|
||||
if (src === undefined) {
|
||||
return undefined
|
||||
}
|
||||
try {
|
||||
const parsed = JSON.parse(src)
|
||||
if (parsed["type"] !== "FeatureCollection") {
|
||||
return {error: "The loaded JSON-file is not a geojson-featurecollection"}
|
||||
}
|
||||
if (parsed.features.some(f => f.geometry.type != "Point")) {
|
||||
return {error: "The loaded JSON-file should only contain points"}
|
||||
}
|
||||
return parsed;
|
||||
|
||||
} catch (e) {
|
||||
// Loading as CSV
|
||||
const lines = src.split("\n")
|
||||
const header = lines[0].split(",")
|
||||
lines.splice(0, 1)
|
||||
if (header.indexOf("lat") < 0 || header.indexOf("lon") < 0) {
|
||||
return {error: "The header does not contain `lat` or `lon`"}
|
||||
}
|
||||
|
||||
const features = []
|
||||
for (let i = 0; i < lines.length; i++) {
|
||||
const line = lines[i];
|
||||
if (line.trim() === "") {
|
||||
continue
|
||||
}
|
||||
const attrs = line.split(",")
|
||||
const properties = {}
|
||||
for (let i = 0; i < header.length; i++) {
|
||||
properties[header[i]] = attrs[i];
|
||||
}
|
||||
const coordinates = [Number(properties["lon"]), Number(properties["lat"])]
|
||||
delete properties["lat"]
|
||||
delete properties["lon"]
|
||||
if (coordinates.some(isNaN)) {
|
||||
return {error: "A coordinate could not be parsed for line " + (i + 2)}
|
||||
}
|
||||
const f = {
|
||||
type: "Feature",
|
||||
properties,
|
||||
geometry: {
|
||||
type: "Point",
|
||||
coordinates
|
||||
}
|
||||
};
|
||||
features.push(f)
|
||||
}
|
||||
|
||||
return {
|
||||
type: "FeatureCollection",
|
||||
features
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
const errorIndicator = new VariableUiElement(asGeoJson.map(v => {
|
||||
if (v === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
if (v?.error === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
return new FixedUiElement(v?.error).SetClass("alert");
|
||||
}))
|
||||
|
||||
super([
|
||||
|
||||
new Title(t.title, 1),
|
||||
t.description,
|
||||
csvSelector,
|
||||
loadedFiles,
|
||||
errorIndicator
|
||||
|
||||
]);
|
||||
this.IsValid = asGeoJson.map(geojson => geojson !== undefined && geojson["error"] === undefined)
|
||||
this.Value = asGeoJson
|
||||
}
|
||||
|
||||
|
||||
}
|
|
@ -1,60 +0,0 @@
|
|||
import {FixedUiElement} from "./Base/FixedUiElement";
|
||||
import {LoginToggle} from "./Popup/LoginButton";
|
||||
import {OsmConnection} from "../Logic/Osm/OsmConnection";
|
||||
import UserRelatedState from "../Logic/State/UserRelatedState";
|
||||
import Combine from "./Base/Combine";
|
||||
import BackToIndex from "./BigComponents/BackToIndex";
|
||||
import BaseUIElement from "./BaseUIElement";
|
||||
import TableOfContents from "./Base/TableOfContents";
|
||||
import LanguagePicker from "./LanguagePicker";
|
||||
import Translations from "./i18n/Translations";
|
||||
import Constants from "../Models/Constants";
|
||||
import Toggle from "./Input/Toggle";
|
||||
import MoreScreen from "./BigComponents/MoreScreen";
|
||||
import Title from "./Base/Title";
|
||||
|
||||
export default class ImportHelperGui extends LoginToggle{
|
||||
|
||||
constructor() {
|
||||
const t = Translations.t.importHelper;
|
||||
|
||||
const state = new UserRelatedState(undefined)
|
||||
|
||||
const leftContents: BaseUIElement[] = [
|
||||
new BackToIndex().SetClass("block pl-4"),
|
||||
LanguagePicker.CreateLanguagePicker(Translations.t.importHelper.title.SupportedLanguages())?.SetClass("mt-4 self-end flex-col"),
|
||||
].map(el => el?.SetClass("pl-4"))
|
||||
|
||||
const leftBar = new Combine([
|
||||
new Combine(leftContents).SetClass("sticky top-4 m-4")
|
||||
]).SetClass("block w-full md:w-2/6 lg:w-1/6")
|
||||
|
||||
|
||||
super(
|
||||
|
||||
new Toggle(
|
||||
new Combine([
|
||||
leftBar,
|
||||
new Combine([
|
||||
new Title(t.title,1),
|
||||
t.description
|
||||
]).SetClass("flex flex-col m-8")
|
||||
]).SetClass("block md:flex")
|
||||
|
||||
,
|
||||
new Combine([
|
||||
t.lockNotice.Subs(Constants.userJourney),
|
||||
MoreScreen.CreateProffessionalSerivesButton()
|
||||
])
|
||||
|
||||
,
|
||||
state.osmConnection.userDetails.map(ud => ud.csCount >= Constants.userJourney.importHelperUnlock)),
|
||||
|
||||
"Login needed...",
|
||||
state)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
new ImportHelperGui().AttachTo("main")
|
|
@ -5,7 +5,6 @@ import BaseUIElement from "../BaseUIElement";
|
|||
|
||||
export default class CombinedInputElement<T, J, X> extends InputElement<X> {
|
||||
|
||||
public readonly IsSelected: UIEventSource<boolean>;
|
||||
private readonly _a: InputElement<T>;
|
||||
private readonly _b: InputElement<J>;
|
||||
private readonly _combined: BaseUIElement;
|
||||
|
@ -19,9 +18,6 @@ export default class CombinedInputElement<T, J, X> extends InputElement<X> {
|
|||
this._a = a;
|
||||
this._b = b;
|
||||
this._split = split;
|
||||
this.IsSelected = this._a.IsSelected.map((isSelected) => {
|
||||
return isSelected || b.IsSelected.data
|
||||
}, [b.IsSelected])
|
||||
this._combined = new Combine([this._a, this._b]);
|
||||
this._value = this._a.GetValue().map(
|
||||
t => combine(t, this._b?.GetValue()?.data),
|
||||
|
|
|
@ -37,7 +37,7 @@ export class DropDown<T> extends InputElement<T> {
|
|||
el.id = "dropdown" + id;
|
||||
|
||||
{
|
||||
const labelEl = Translations.W(label).ConstructElement()
|
||||
const labelEl = Translations.W(label)?.ConstructElement()
|
||||
if (labelEl !== undefined) {
|
||||
const labelHtml = document.createElement("label")
|
||||
labelHtml.appendChild(labelEl)
|
||||
|
|
|
@ -6,16 +6,20 @@ export default class FileSelectorButton extends InputElement<FileList> {
|
|||
|
||||
private static _nextid;
|
||||
IsSelected: UIEventSource<boolean>;
|
||||
private readonly _value = new UIEventSource(undefined);
|
||||
private readonly _value = new UIEventSource<FileList>(undefined);
|
||||
private readonly _label: BaseUIElement;
|
||||
private readonly _acceptType: string;
|
||||
private readonly allowMultiple: boolean;
|
||||
|
||||
constructor(label: BaseUIElement, acceptType: string = "image/*") {
|
||||
constructor(label: BaseUIElement, options?:
|
||||
{ acceptType: "image/*" | string,
|
||||
allowMultiple: true | boolean}) {
|
||||
super();
|
||||
this._label = label;
|
||||
this._acceptType = acceptType;
|
||||
this._acceptType = options?.acceptType ?? "image/*";
|
||||
this.SetClass("block cursor-pointer")
|
||||
label.SetClass("cursor-pointer")
|
||||
this.allowMultiple = options?.allowMultiple ?? true
|
||||
}
|
||||
|
||||
GetValue(): UIEventSource<FileList> {
|
||||
|
@ -38,7 +42,7 @@ export default class FileSelectorButton extends InputElement<FileList> {
|
|||
actualInputElement.type = "file";
|
||||
actualInputElement.accept = this._acceptType;
|
||||
actualInputElement.name = "picField";
|
||||
actualInputElement.multiple = true;
|
||||
actualInputElement.multiple = this.allowMultiple;
|
||||
actualInputElement.id = "fileselector" + FileSelectorButton._nextid;
|
||||
FileSelectorButton._nextid++;
|
||||
|
||||
|
@ -59,6 +63,20 @@ export default class FileSelectorButton extends InputElement<FileList> {
|
|||
|
||||
el.appendChild(actualInputElement)
|
||||
|
||||
el.addEventListener('dragover', (event) => {
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
// Style the drag-and-drop as a "copy file" operation.
|
||||
event.dataTransfer.dropEffect = 'copy';
|
||||
});
|
||||
|
||||
el.addEventListener('drop', (event) => {
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
const fileList = event.dataTransfer.files;
|
||||
this._value.setData(fileList)
|
||||
});
|
||||
|
||||
return el;
|
||||
}
|
||||
|
||||
|
|
|
@ -4,7 +4,6 @@ import Translations from "../i18n/Translations";
|
|||
import BaseUIElement from "../BaseUIElement";
|
||||
|
||||
export class FixedInputElement<T> extends InputElement<T> {
|
||||
public readonly IsSelected: UIEventSource<boolean> = new UIEventSource<boolean>(false);
|
||||
private readonly value: UIEventSource<T>;
|
||||
private readonly _comparator: (t0: T, t1: T) => boolean;
|
||||
|
||||
|
@ -21,17 +20,12 @@ export class FixedInputElement<T> extends InputElement<T> {
|
|||
this.value = new UIEventSource<T>(value);
|
||||
}
|
||||
|
||||
const selected = this.IsSelected;
|
||||
this._el = document.createElement("span")
|
||||
this._el.addEventListener("mouseout", () => selected.setData(false))
|
||||
const e = Translations.W(rendering)?.ConstructElement()
|
||||
if (e) {
|
||||
this._el.appendChild(e)
|
||||
}
|
||||
|
||||
this.onClick(() => {
|
||||
selected.setData(true)
|
||||
})
|
||||
}
|
||||
|
||||
GetValue(): UIEventSource<T> {
|
||||
|
|
|
@ -3,7 +3,6 @@ import BaseUIElement from "../BaseUIElement";
|
|||
|
||||
export abstract class InputElement<T> extends BaseUIElement {
|
||||
|
||||
abstract IsSelected: UIEventSource<boolean>;
|
||||
|
||||
abstract GetValue(): UIEventSource<T>;
|
||||
|
||||
|
|
|
@ -3,7 +3,6 @@ import {UIEventSource} from "../../Logic/UIEventSource";
|
|||
|
||||
|
||||
export default class InputElementMap<T, X> extends InputElement<X> {
|
||||
public readonly IsSelected: UIEventSource<boolean>;
|
||||
private readonly _inputElement: InputElement<T>;
|
||||
private isSame: (x0: X, x1: X) => boolean;
|
||||
private readonly fromX: (x: X) => T;
|
||||
|
@ -21,7 +20,6 @@ export default class InputElementMap<T, X> extends InputElement<X> {
|
|||
this.fromX = fromX;
|
||||
this.toX = toX;
|
||||
this._inputElement = inputElement;
|
||||
this.IsSelected = inputElement.IsSelected;
|
||||
const self = this;
|
||||
this._value = inputElement.GetValue().map(
|
||||
(t => {
|
||||
|
|
|
@ -6,14 +6,12 @@ import {SubstitutedTranslation} from "../SubstitutedTranslation";
|
|||
import FeaturePipelineState from "../../Logic/State/FeaturePipelineState";
|
||||
|
||||
export default class InputElementWrapper<T> extends InputElement<T> {
|
||||
public readonly IsSelected: UIEventSource<boolean>;
|
||||
private readonly _inputElement: InputElement<T>;
|
||||
private readonly _renderElement: BaseUIElement
|
||||
|
||||
constructor(inputElement: InputElement<T>, translation: Translation, key: string, tags: UIEventSource<any>, state: FeaturePipelineState) {
|
||||
super()
|
||||
this._inputElement = inputElement;
|
||||
this.IsSelected = inputElement.IsSelected
|
||||
const mapping = new Map<string, BaseUIElement>()
|
||||
|
||||
mapping.set(key, inputElement)
|
||||
|
|
|
@ -38,6 +38,8 @@ export default class LocationInput extends InputElement<Loc> implements MinimapO
|
|||
private readonly _snappedPointTags: any;
|
||||
private readonly _bounds: UIEventSource<BBox>;
|
||||
private readonly map: BaseUIElement & MinimapObj;
|
||||
public readonly bounds;
|
||||
public readonly location;
|
||||
private readonly clickLocation: UIEventSource<Loc>;
|
||||
private readonly _minZoom: number;
|
||||
|
||||
|
@ -146,6 +148,8 @@ export default class LocationInput extends InputElement<Loc> implements MinimapO
|
|||
}
|
||||
)
|
||||
this.leafletMap = this.map.leafletMap
|
||||
this.bounds = this.map.bounds;
|
||||
this.location = this.map.location;
|
||||
}
|
||||
|
||||
GetValue(): UIEventSource<Loc> {
|
||||
|
@ -186,11 +190,10 @@ export default class LocationInput extends InputElement<Loc> implements MinimapO
|
|||
console.log("Constructing the snap-to layer", this._snapTo)
|
||||
new ShowDataMultiLayer({
|
||||
features: new StaticFeatureSource(this._snapTo, true),
|
||||
enablePopups: false,
|
||||
popup: undefined,
|
||||
zoomToFeatures: false,
|
||||
leafletMap: this.map.leafletMap,
|
||||
layers: State.state.filteredLayers,
|
||||
allElements: State.state.allElements
|
||||
layers: State.state.filteredLayers
|
||||
}
|
||||
)
|
||||
// Show the central point
|
||||
|
@ -202,11 +205,11 @@ export default class LocationInput extends InputElement<Loc> implements MinimapO
|
|||
})
|
||||
new ShowDataLayer({
|
||||
features: new StaticFeatureSource(matchPoint, true),
|
||||
enablePopups: false,
|
||||
popup: undefined,
|
||||
zoomToFeatures: false,
|
||||
leafletMap: this.map.leafletMap,
|
||||
layerToShow: this._matching_layer,
|
||||
allElements: State.state.allElements,
|
||||
state: State.state,
|
||||
selectedElement: State.state.selectedElement
|
||||
})
|
||||
|
||||
|
|
|
@ -4,7 +4,6 @@ import {Utils} from "../../Utils";
|
|||
|
||||
export class RadioButton<T> extends InputElement<T> {
|
||||
private static _nextId = 0;
|
||||
IsSelected: UIEventSource<boolean> = new UIEventSource<boolean>(false);
|
||||
private readonly value: UIEventSource<T>;
|
||||
private _elements: InputElement<T>[];
|
||||
private _selectFirstAsDefault: boolean;
|
||||
|
@ -74,11 +73,7 @@ export class RadioButton<T> extends InputElement<T> {
|
|||
elements[i]?.onClick(() => {
|
||||
selectedElementIndex.setData(i);
|
||||
});
|
||||
elements[i].IsSelected.addCallback((isSelected) => {
|
||||
if (isSelected) {
|
||||
selectedElementIndex.setData(i);
|
||||
}
|
||||
});
|
||||
|
||||
elements[i].GetValue().addCallback(() => {
|
||||
selectedElementIndex.setData(i);
|
||||
});
|
||||
|
|
|
@ -5,7 +5,6 @@ import BaseUIElement from "../BaseUIElement";
|
|||
|
||||
export class TextField extends InputElement<string> {
|
||||
public readonly enterPressed = new UIEventSource<string>(undefined);
|
||||
public readonly IsSelected: UIEventSource<boolean> = new UIEventSource<boolean>(false);
|
||||
private readonly value: UIEventSource<string>;
|
||||
private _element: HTMLElement;
|
||||
private readonly _isValid: (s: string, country?: () => string) => boolean;
|
||||
|
@ -26,11 +25,6 @@ export class TextField extends InputElement<string> {
|
|||
this.value = options?.value ?? new UIEventSource<string>(undefined);
|
||||
this._isValid = options.isValid ?? (_ => true);
|
||||
|
||||
this.onClick(() => {
|
||||
self.IsSelected.setData(true)
|
||||
});
|
||||
|
||||
|
||||
const placeholder = Translations.W(options.placeholder ?? "").ConstructElement().innerText.replace("'", "'");
|
||||
|
||||
this.SetClass("form-text-field")
|
||||
|
@ -107,10 +101,6 @@ export class TextField extends InputElement<string> {
|
|||
};
|
||||
|
||||
|
||||
field.addEventListener("focusin", () => self.IsSelected.setData(true));
|
||||
field.addEventListener("focusout", () => self.IsSelected.setData(false));
|
||||
|
||||
|
||||
field.addEventListener("keyup", function (event) {
|
||||
if (event.key === "Enter") {
|
||||
// @ts-ignore
|
||||
|
|
|
@ -5,7 +5,6 @@ import {VariableUiElement} from "../Base/VariableUIElement";
|
|||
|
||||
export default class VariableInputElement<T> extends InputElement<T> {
|
||||
|
||||
public readonly IsSelected: UIEventSource<boolean>;
|
||||
private readonly value: UIEventSource<T>;
|
||||
private readonly element: BaseUIElement
|
||||
private readonly upstream: UIEventSource<InputElement<T>>;
|
||||
|
@ -16,7 +15,6 @@ export default class VariableInputElement<T> extends InputElement<T> {
|
|||
this.upstream = upstream;
|
||||
this.value = upstream.bind(v => v.GetValue())
|
||||
this.element = new VariableUiElement(upstream)
|
||||
this.IsSelected = upstream.bind(v => v.IsSelected)
|
||||
}
|
||||
|
||||
GetValue(): UIEventSource<T> {
|
||||
|
|
|
@ -24,7 +24,6 @@ export default class OpeningHoursPickerTable extends InputElement<OpeningHour[]>
|
|||
Translations.t.general.weekdays.abbreviations.saturday,
|
||||
Translations.t.general.weekdays.abbreviations.sunday
|
||||
]
|
||||
public readonly IsSelected: UIEventSource<boolean>;
|
||||
/*
|
||||
These html-elements are an overlay over the table columns and act as a host for the ranges in the weekdays
|
||||
*/
|
||||
|
@ -34,7 +33,6 @@ export default class OpeningHoursPickerTable extends InputElement<OpeningHour[]>
|
|||
constructor(source?: UIEventSource<OpeningHour[]>) {
|
||||
super();
|
||||
this.source = source ?? new UIEventSource<OpeningHour[]>([]);
|
||||
this.IsSelected = new UIEventSource<boolean>(false);
|
||||
this.SetStyle("width:100%;height:100%;display:block;");
|
||||
}
|
||||
|
||||
|
|
|
@ -137,10 +137,10 @@ export default class AutoApplyButton implements SpecialVisualization {
|
|||
|
||||
new ShowDataLayer({
|
||||
leafletMap: previewMap.leafletMap,
|
||||
enablePopups: false,
|
||||
popup: undefined,
|
||||
zoomToFeatures: true,
|
||||
features: new StaticFeatureSource(features, false),
|
||||
allElements: state.allElements,
|
||||
state,
|
||||
layerToShow: layer.layerDef,
|
||||
})
|
||||
|
||||
|
|
|
@ -1,5 +1,4 @@
|
|||
import {VariableUiElement} from "../Base/VariableUIElement";
|
||||
import State from "../../State";
|
||||
import Toggle from "../Input/Toggle";
|
||||
import Translations from "../i18n/Translations";
|
||||
import Svg from "../../Svg";
|
||||
|
@ -17,6 +16,10 @@ import TagRenderingConfig from "../../Models/ThemeConfig/TagRenderingConfig";
|
|||
import {AndOrTagConfigJson} from "../../Models/ThemeConfig/Json/TagConfigJson";
|
||||
import DeleteConfig from "../../Models/ThemeConfig/DeleteConfig";
|
||||
import {OsmObject} from "../../Logic/Osm/OsmObject";
|
||||
import {ElementStorage} from "../../Logic/ElementStorage";
|
||||
import LayoutConfig from "../../Models/ThemeConfig/LayoutConfig";
|
||||
import {Changes} from "../../Logic/Osm/Changes";
|
||||
import {OsmConnection} from "../../Logic/Osm/OsmConnection";
|
||||
|
||||
export default class DeleteWizard extends Toggle {
|
||||
/**
|
||||
|
@ -35,13 +38,21 @@ export default class DeleteWizard extends Toggle {
|
|||
* (Note that _delete_reason is used as trigger to do actual deletion - setting such a tag WILL delete from the database with that as changeset comment)
|
||||
*
|
||||
* @param id: The id of the element to remove
|
||||
* @param state: the state of the application
|
||||
* @param options softDeletionTags: the tags to apply if the user doesn't have permission to delete, e.g. 'disused:amenity=public_bookcase', 'amenity='. After applying, the element should not be picked up on the map anymore. If undefined, the wizard will only show up if the point can be (hard) deleted
|
||||
*/
|
||||
constructor(id: string,
|
||||
state: {
|
||||
osmConnection: OsmConnection;
|
||||
allElements: ElementStorage,
|
||||
layoutToUse?: LayoutConfig,
|
||||
changes?: Changes
|
||||
},
|
||||
options: DeleteConfig) {
|
||||
|
||||
const deleteAbility = new DeleteabilityChecker(id, options.neededChangesets)
|
||||
const tagsSource = State.state.allElements.getEventSourceById(id)
|
||||
|
||||
const deleteAbility = new DeleteabilityChecker(id, state, options.neededChangesets)
|
||||
const tagsSource = state.allElements.getEventSourceById(id)
|
||||
|
||||
const isDeleted = new UIEventSource(false)
|
||||
const allowSoftDeletion = !!options.softDeletionTags
|
||||
|
@ -59,12 +70,12 @@ export default class DeleteWizard extends Toggle {
|
|||
const deleteAction = new DeleteAction(id,
|
||||
options.softDeletionTags,
|
||||
{
|
||||
theme: State.state?.layoutToUse?.id ?? "unkown",
|
||||
theme: state?.layoutToUse?.id ?? "unkown",
|
||||
specialMotivation: deleteReasonMatch[0]?.v
|
||||
},
|
||||
deleteAbility.canBeDeleted.data.canBeDeleted
|
||||
)
|
||||
State.state.changes.applyAction(deleteAction)
|
||||
state.changes?.applyAction(deleteAction)
|
||||
isDeleted.setData(true)
|
||||
|
||||
}
|
||||
|
@ -77,6 +88,7 @@ export default class DeleteWizard extends Toggle {
|
|||
return new TagRenderingQuestion(
|
||||
tagsSource,
|
||||
config,
|
||||
state,
|
||||
{
|
||||
cancelButton: cancelButton,
|
||||
/*Using a custom save button constructor erases all logic to actually save, so we have to listen for the click!*/
|
||||
|
@ -112,7 +124,7 @@ export default class DeleteWizard extends Toggle {
|
|||
new Toggle(
|
||||
question,
|
||||
new SubtleButton(Svg.envelope_ui(), t.readMessages.Clone()),
|
||||
State.state.osmConnection.userDetails.map(ud => ud.csCount > Constants.userJourney.addNewPointWithUnreadMessagesUnlock || ud.unreadMessages == 0)
|
||||
state.osmConnection.userDetails.map(ud => ud.csCount > Constants.userJourney.addNewPointWithUnreadMessagesUnlock || ud.unreadMessages == 0)
|
||||
),
|
||||
|
||||
deleteButton,
|
||||
|
@ -131,8 +143,8 @@ export default class DeleteWizard extends Toggle {
|
|||
,
|
||||
deleteAbility.canBeDeleted.map(cbd => allowSoftDeletion || cbd.canBeDeleted !== false)),
|
||||
|
||||
t.loginToDelete.Clone().onClick(State.state.osmConnection.AttemptLogin),
|
||||
State.state.osmConnection.isLoggedIn
|
||||
t.loginToDelete.Clone().onClick(state.osmConnection.AttemptLogin),
|
||||
state.osmConnection.isLoggedIn
|
||||
),
|
||||
isDeleted),
|
||||
undefined,
|
||||
|
@ -275,11 +287,16 @@ class DeleteabilityChecker {
|
|||
public readonly canBeDeleted: UIEventSource<{ canBeDeleted?: boolean, reason: Translation }>;
|
||||
private readonly _id: string;
|
||||
private readonly _allowDeletionAtChangesetCount: number;
|
||||
private readonly _state: {
|
||||
osmConnection: OsmConnection
|
||||
};
|
||||
|
||||
|
||||
constructor(id: string,
|
||||
state: {osmConnection: OsmConnection},
|
||||
allowDeletionAtChangesetCount?: number) {
|
||||
this._id = id;
|
||||
this._state = state;
|
||||
this._allowDeletionAtChangesetCount = allowDeletionAtChangesetCount ?? Number.MAX_VALUE;
|
||||
|
||||
this.canBeDeleted = new UIEventSource<{ canBeDeleted?: boolean; reason: Translation }>({
|
||||
|
@ -299,6 +316,7 @@ class DeleteabilityChecker {
|
|||
const t = Translations.t.delete;
|
||||
const id = this._id;
|
||||
const state = this.canBeDeleted
|
||||
const self = this;
|
||||
if (!id.startsWith("node")) {
|
||||
this.canBeDeleted.setData({
|
||||
canBeDeleted: false,
|
||||
|
@ -308,8 +326,7 @@ class DeleteabilityChecker {
|
|||
}
|
||||
|
||||
// Does the currently logged in user have enough experience to delete this point?
|
||||
|
||||
const deletingPointsOfOtherAllowed = State.state.osmConnection.userDetails.map(ud => {
|
||||
const deletingPointsOfOtherAllowed = this._state.osmConnection.userDetails.map(ud => {
|
||||
if (ud === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
|
@ -320,15 +337,14 @@ class DeleteabilityChecker {
|
|||
})
|
||||
|
||||
const previousEditors = new UIEventSource<number[]>(undefined)
|
||||
|
||||
const allByMyself = previousEditors.map(previous => {
|
||||
if (previous === null || previous === undefined) {
|
||||
// Not yet downloaded
|
||||
return null;
|
||||
}
|
||||
const userId = State.state.osmConnection.userDetails.data.uid;
|
||||
const userId = self._state.osmConnection.userDetails.data.uid;
|
||||
return !previous.some(editor => editor !== userId)
|
||||
}, [State.state.osmConnection.userDetails])
|
||||
}, [self._state.osmConnection.userDetails])
|
||||
|
||||
|
||||
// User allowed OR only edited by self?
|
||||
|
|
|
@ -3,19 +3,20 @@ import TagRenderingQuestion from "./TagRenderingQuestion";
|
|||
import Translations from "../i18n/Translations";
|
||||
import Combine from "../Base/Combine";
|
||||
import TagRenderingAnswer from "./TagRenderingAnswer";
|
||||
import State from "../../State";
|
||||
import Svg from "../../Svg";
|
||||
import Toggle from "../Input/Toggle";
|
||||
import BaseUIElement from "../BaseUIElement";
|
||||
import TagRenderingConfig from "../../Models/ThemeConfig/TagRenderingConfig";
|
||||
import {Unit} from "../../Models/Unit";
|
||||
import Lazy from "../Base/Lazy";
|
||||
import {OsmConnection} from "../../Logic/Osm/OsmConnection";
|
||||
|
||||
export default class EditableTagRendering extends Toggle {
|
||||
|
||||
constructor(tags: UIEventSource<any>,
|
||||
configuration: TagRenderingConfig,
|
||||
units: Unit [],
|
||||
state,
|
||||
options: {
|
||||
editMode?: UIEventSource<boolean>,
|
||||
innerElementClasses?: string
|
||||
|
@ -32,7 +33,7 @@ export default class EditableTagRendering extends Toggle {
|
|||
super(
|
||||
new Lazy(() => {
|
||||
const editMode = options.editMode ?? new UIEventSource<boolean>(false)
|
||||
const rendering = EditableTagRendering.CreateRendering(tags, configuration, units, editMode);
|
||||
const rendering = EditableTagRendering.CreateRendering(state, tags, configuration, units, editMode);
|
||||
rendering.SetClass(options.innerElementClasses)
|
||||
return rendering
|
||||
}),
|
||||
|
@ -41,12 +42,12 @@ export default class EditableTagRendering extends Toggle {
|
|||
)
|
||||
}
|
||||
|
||||
private static CreateRendering(tags: UIEventSource<any>, configuration: TagRenderingConfig, units: Unit[], editMode: UIEventSource<boolean>): BaseUIElement {
|
||||
const answer: BaseUIElement = new TagRenderingAnswer(tags, configuration, State.state)
|
||||
private static CreateRendering(state: {featureSwitchUserbadge?: UIEventSource<boolean>, osmConnection: OsmConnection}, tags: UIEventSource<any>, configuration: TagRenderingConfig, units: Unit[], editMode: UIEventSource<boolean>): BaseUIElement {
|
||||
const answer: BaseUIElement = new TagRenderingAnswer(tags, configuration, state)
|
||||
answer.SetClass("w-full")
|
||||
let rendering = answer;
|
||||
|
||||
if (configuration.question !== undefined && State.state?.featureSwitchUserbadge?.data) {
|
||||
if (configuration.question !== undefined && state?.featureSwitchUserbadge?.data) {
|
||||
// We have a question and editing is enabled
|
||||
const answerWithEditButton = new Combine([answer,
|
||||
new Toggle(new Combine([Svg.pencil_ui()]).SetClass("block relative h-10 w-10 p-2 float-right").SetStyle("border: 1px solid black; border-radius: 0.7em")
|
||||
|
@ -54,12 +55,12 @@ export default class EditableTagRendering extends Toggle {
|
|||
editMode.setData(true);
|
||||
}),
|
||||
undefined,
|
||||
State.state.osmConnection.isLoggedIn)
|
||||
state.osmConnection.isLoggedIn)
|
||||
]).SetClass("flex justify-between w-full")
|
||||
|
||||
|
||||
const question = new Lazy(() =>
|
||||
new TagRenderingQuestion(tags, configuration,
|
||||
new TagRenderingQuestion(tags, configuration,state,
|
||||
{
|
||||
units: units,
|
||||
cancelButton: Translations.t.general.cancel.Clone()
|
||||
|
|
|
@ -3,7 +3,6 @@ import EditableTagRendering from "./EditableTagRendering";
|
|||
import QuestionBox from "./QuestionBox";
|
||||
import Combine from "../Base/Combine";
|
||||
import TagRenderingAnswer from "./TagRenderingAnswer";
|
||||
import State from "../../State";
|
||||
import ScrollableFullScreen from "../Base/ScrollableFullScreen";
|
||||
import Constants from "../../Models/Constants";
|
||||
import SharedTagRenderings from "../../Customizations/SharedTagRenderings";
|
||||
|
@ -16,18 +15,41 @@ import LayerConfig from "../../Models/ThemeConfig/LayerConfig";
|
|||
import {Utils} from "../../Utils";
|
||||
import MoveWizard from "./MoveWizard";
|
||||
import Toggle from "../Input/Toggle";
|
||||
import {OsmConnection} from "../../Logic/Osm/OsmConnection";
|
||||
import {Changes} from "../../Logic/Osm/Changes";
|
||||
import LayoutConfig from "../../Models/ThemeConfig/LayoutConfig";
|
||||
import {ElementStorage} from "../../Logic/ElementStorage";
|
||||
import FilteredLayer from "../../Models/FilteredLayer";
|
||||
import BaseLayer from "../../Models/BaseLayer";
|
||||
import Lazy from "../Base/Lazy";
|
||||
|
||||
export default class FeatureInfoBox extends ScrollableFullScreen {
|
||||
|
||||
|
||||
public constructor(
|
||||
tags: UIEventSource<any>,
|
||||
layerConfig: LayerConfig,
|
||||
state: {
|
||||
filteredLayers: UIEventSource<FilteredLayer[]>;
|
||||
backgroundLayer: UIEventSource<BaseLayer>;
|
||||
featureSwitchIsTesting: UIEventSource<boolean>;
|
||||
featureSwitchIsDebugging: UIEventSource<boolean>;
|
||||
featureSwitchShowAllQuestions: UIEventSource<boolean>;
|
||||
osmConnection: OsmConnection,
|
||||
featureSwitchUserbadge: UIEventSource<boolean>,
|
||||
changes: Changes,
|
||||
layoutToUse: LayoutConfig,
|
||||
allElements: ElementStorage
|
||||
},
|
||||
hashToShow?: string,
|
||||
isShown?: UIEventSource<boolean>
|
||||
isShown?: UIEventSource<boolean>,
|
||||
) {
|
||||
super(() => FeatureInfoBox.GenerateTitleBar(tags, layerConfig),
|
||||
() => FeatureInfoBox.GenerateContent(tags, layerConfig),
|
||||
hashToShow ?? tags.data.id,
|
||||
if (state === undefined) {
|
||||
throw "State is undefined!"
|
||||
}
|
||||
super(() => FeatureInfoBox.GenerateTitleBar(tags, layerConfig, state),
|
||||
() => FeatureInfoBox.GenerateContent(tags, layerConfig, state),
|
||||
hashToShow ?? tags.data.id ?? "item",
|
||||
isShown);
|
||||
|
||||
if (layerConfig === undefined) {
|
||||
|
@ -37,11 +59,12 @@ export default class FeatureInfoBox extends ScrollableFullScreen {
|
|||
}
|
||||
|
||||
private static GenerateTitleBar(tags: UIEventSource<any>,
|
||||
layerConfig: LayerConfig): BaseUIElement {
|
||||
const title = new TagRenderingAnswer(tags, layerConfig.title ?? new TagRenderingConfig("POI"), State.state)
|
||||
layerConfig: LayerConfig,
|
||||
state: {}): BaseUIElement {
|
||||
const title = new TagRenderingAnswer(tags, layerConfig.title ?? new TagRenderingConfig("POI"), state)
|
||||
.SetClass("break-words font-bold sm:p-0.5 md:p-1 sm:p-1.5 md:p-2");
|
||||
const titleIcons = new Combine(
|
||||
layerConfig.titleIcons.map(icon => new TagRenderingAnswer(tags, icon, State.state,
|
||||
layerConfig.titleIcons.map(icon => new TagRenderingAnswer(tags, icon, state,
|
||||
"block w-8 h-8 max-h-8 align-baseline box-content sm:p-0.5 w-10",)
|
||||
))
|
||||
.SetClass("flex flex-row flex-wrap pt-0.5 sm:pt-1 items-center mr-2")
|
||||
|
@ -52,20 +75,32 @@ export default class FeatureInfoBox extends ScrollableFullScreen {
|
|||
}
|
||||
|
||||
private static GenerateContent(tags: UIEventSource<any>,
|
||||
layerConfig: LayerConfig): BaseUIElement {
|
||||
layerConfig: LayerConfig,
|
||||
state: {
|
||||
filteredLayers: UIEventSource<FilteredLayer[]>;
|
||||
backgroundLayer: UIEventSource<BaseLayer>;
|
||||
featureSwitchIsTesting: UIEventSource<boolean>;
|
||||
featureSwitchIsDebugging: UIEventSource<boolean>;
|
||||
featureSwitchShowAllQuestions: UIEventSource<boolean>;
|
||||
osmConnection: OsmConnection,
|
||||
featureSwitchUserbadge: UIEventSource<boolean>,
|
||||
changes: Changes,
|
||||
layoutToUse: LayoutConfig,
|
||||
allElements: ElementStorage
|
||||
}): BaseUIElement {
|
||||
let questionBoxes: Map<string, QuestionBox> = new Map<string, QuestionBox>();
|
||||
|
||||
const allGroupNames = Utils.Dedup(layerConfig.tagRenderings.map(tr => tr.group))
|
||||
if (State.state.featureSwitchUserbadge.data) {
|
||||
if (state?.featureSwitchUserbadge?.data ?? true) {
|
||||
const questionSpecs = layerConfig.tagRenderings.filter(tr => tr.id === "questions")
|
||||
for (const groupName of allGroupNames) {
|
||||
const questions = layerConfig.tagRenderings.filter(tr => tr.group === groupName)
|
||||
const questionSpec = questionSpecs.filter(tr => tr.group === groupName)[0]
|
||||
const questionBox = new QuestionBox({
|
||||
const questionBox = new QuestionBox(state, {
|
||||
tagsSource: tags,
|
||||
tagRenderings: questions,
|
||||
units: layerConfig.units,
|
||||
showAllQuestionsAtOnce: questionSpec?.freeform?.helperArgs["showAllQuestions"] ?? State.state.featureSwitchShowAllQuestions
|
||||
showAllQuestionsAtOnce: questionSpec?.freeform?.helperArgs["showAllQuestions"] ?? state.featureSwitchShowAllQuestions
|
||||
});
|
||||
questionBoxes.set(groupName, questionBox)
|
||||
}
|
||||
|
@ -86,10 +121,10 @@ export default class FeatureInfoBox extends ScrollableFullScreen {
|
|||
|
||||
if (tr.render !== undefined) {
|
||||
questionBox.SetClass("text-sm")
|
||||
const renderedQuestion = new TagRenderingAnswer(tags, tr,State.state,
|
||||
const renderedQuestion = new TagRenderingAnswer(tags, tr, state,
|
||||
tr.group + " questions", "", {
|
||||
specialViz: new Map<string, BaseUIElement>([["questions", questionBox]])
|
||||
})
|
||||
specialViz: new Map<string, BaseUIElement>([["questions", questionBox]])
|
||||
})
|
||||
const possiblyHidden = new Toggle(
|
||||
renderedQuestion,
|
||||
undefined,
|
||||
|
@ -109,7 +144,7 @@ export default class FeatureInfoBox extends ScrollableFullScreen {
|
|||
classes = ""
|
||||
}
|
||||
|
||||
const etr = new EditableTagRendering(tags, tr, layerConfig.units, {
|
||||
const etr = new EditableTagRendering(tags, tr, layerConfig.units, state, {
|
||||
innerElementClasses: innerClasses
|
||||
})
|
||||
if (isHeader) {
|
||||
|
@ -121,8 +156,29 @@ export default class FeatureInfoBox extends ScrollableFullScreen {
|
|||
|
||||
allRenderings.push(...renderingsForGroup)
|
||||
}
|
||||
allRenderings.push(
|
||||
new Toggle(
|
||||
new Lazy(() => FeatureInfoBox.createEditElements(questionBoxes, layerConfig, tags, state)),
|
||||
undefined,
|
||||
state.featureSwitchUserbadge
|
||||
))
|
||||
|
||||
return new Combine(allRenderings).SetClass("block")
|
||||
}
|
||||
|
||||
/**
|
||||
* All the edit elements, together (note that the question boxes are passed though)
|
||||
* @param questionBoxes
|
||||
* @param layerConfig
|
||||
* @param tags
|
||||
* @param state
|
||||
* @private
|
||||
*/
|
||||
private static createEditElements(questionBoxes: Map<string, QuestionBox>,
|
||||
layerConfig: LayerConfig,
|
||||
tags: UIEventSource<any>,
|
||||
state: { filteredLayers: UIEventSource<FilteredLayer[]>; backgroundLayer: UIEventSource<BaseLayer>; featureSwitchIsTesting: UIEventSource<boolean>; featureSwitchIsDebugging: UIEventSource<boolean>; featureSwitchShowAllQuestions: UIEventSource<boolean>; osmConnection: OsmConnection; featureSwitchUserbadge: UIEventSource<boolean>; changes: Changes; layoutToUse: LayoutConfig; allElements: ElementStorage })
|
||||
: BaseUIElement {
|
||||
let editElements: BaseUIElement[] = []
|
||||
questionBoxes.forEach(questionBox => {
|
||||
editElements.push(questionBox);
|
||||
|
@ -131,10 +187,13 @@ export default class FeatureInfoBox extends ScrollableFullScreen {
|
|||
if (layerConfig.allowMove) {
|
||||
editElements.push(
|
||||
new VariableUiElement(tags.map(tags => tags.id).map(id => {
|
||||
const feature = State.state.allElements.ContainingFeatures.get(id)
|
||||
const feature = state.allElements.ContainingFeatures.get(id)
|
||||
if (feature === undefined) {
|
||||
return "This feature is not register in the state.allElements and cannot be moved"
|
||||
}
|
||||
return new MoveWizard(
|
||||
feature,
|
||||
State.state,
|
||||
state,
|
||||
layerConfig.allowMove
|
||||
);
|
||||
})
|
||||
|
@ -147,6 +206,7 @@ export default class FeatureInfoBox extends ScrollableFullScreen {
|
|||
new VariableUiElement(tags.map(tags => tags.id).map(id =>
|
||||
new DeleteWizard(
|
||||
id,
|
||||
state,
|
||||
layerConfig.deletion
|
||||
))
|
||||
).SetClass("text-base"))
|
||||
|
@ -155,59 +215,45 @@ export default class FeatureInfoBox extends ScrollableFullScreen {
|
|||
if (layerConfig.allowSplit) {
|
||||
editElements.push(
|
||||
new VariableUiElement(tags.map(tags => tags.id).map(id =>
|
||||
new SplitRoadWizard(id))
|
||||
new SplitRoadWizard(id, state))
|
||||
).SetClass("text-base"))
|
||||
}
|
||||
|
||||
|
||||
editElements.push(
|
||||
new VariableUiElement(
|
||||
State.state.osmConnection.userDetails
|
||||
state.osmConnection.userDetails
|
||||
.map(ud => ud.csCount)
|
||||
.map(csCount => {
|
||||
if (csCount <= Constants.userJourney.historyLinkVisible
|
||||
&& State.state.featureSwitchIsDebugging.data == false
|
||||
&& State.state.featureSwitchIsTesting.data === false) {
|
||||
&& state.featureSwitchIsDebugging.data == false
|
||||
&& state.featureSwitchIsTesting.data === false) {
|
||||
return undefined
|
||||
}
|
||||
|
||||
return new TagRenderingAnswer(tags, SharedTagRenderings.SharedTagRendering.get("last_edit"), State.state);
|
||||
return new TagRenderingAnswer(tags, SharedTagRenderings.SharedTagRendering.get("last_edit"), state);
|
||||
|
||||
}, [State.state.featureSwitchIsDebugging, State.state.featureSwitchIsTesting])
|
||||
}, [state.featureSwitchIsDebugging, state.featureSwitchIsTesting])
|
||||
)
|
||||
)
|
||||
|
||||
|
||||
editElements.push(
|
||||
new VariableUiElement(
|
||||
State.state.featureSwitchIsDebugging.map(isDebugging => {
|
||||
state.featureSwitchIsDebugging.map(isDebugging => {
|
||||
if (isDebugging) {
|
||||
const config_all_tags: TagRenderingConfig = new TagRenderingConfig({render: "{all_tags()}"}, "");
|
||||
const config_download: TagRenderingConfig = new TagRenderingConfig({render: "{export_as_geojson()}"}, "");
|
||||
const config_id: TagRenderingConfig = new TagRenderingConfig({render: "{open_in_iD()}"}, "");
|
||||
|
||||
return new Combine([new TagRenderingAnswer(tags, config_all_tags, State.state),
|
||||
new TagRenderingAnswer(tags, config_download, State.state),
|
||||
new TagRenderingAnswer(tags, config_id, State.state)])
|
||||
return new Combine([new TagRenderingAnswer(tags, config_all_tags, state),
|
||||
new TagRenderingAnswer(tags, config_download, state),
|
||||
new TagRenderingAnswer(tags, config_id, state)])
|
||||
}
|
||||
})
|
||||
)
|
||||
)
|
||||
|
||||
const editors = new VariableUiElement(State.state.featureSwitchUserbadge.map(
|
||||
userbadge => {
|
||||
if (!userbadge) {
|
||||
return undefined
|
||||
}
|
||||
return new Combine(editElements).SetClass("flex flex-col")
|
||||
}
|
||||
))
|
||||
allRenderings.push(editors)
|
||||
|
||||
return new Combine(allRenderings).SetClass("block")
|
||||
return new Combine(editElements).SetClass("flex flex-col")
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
|
|
@ -246,10 +246,10 @@ ${Utils.special_visualizations_importRequirementDocs}
|
|||
// SHow all relevant data - including (eventually) the way of which the geometry will be replaced
|
||||
new ShowDataMultiLayer({
|
||||
leafletMap: confirmationMap.leafletMap,
|
||||
enablePopups: false,
|
||||
popup: undefined,
|
||||
zoomToFeatures: true,
|
||||
features: new StaticFeatureSource([feature], false),
|
||||
allElements: state.allElements,
|
||||
state: state,
|
||||
layers: state.filteredLayers
|
||||
})
|
||||
|
||||
|
@ -257,10 +257,10 @@ ${Utils.special_visualizations_importRequirementDocs}
|
|||
action.getPreview().then(changePreview => {
|
||||
new ShowDataLayer({
|
||||
leafletMap: confirmationMap.leafletMap,
|
||||
enablePopups: false,
|
||||
popup: undefined,
|
||||
zoomToFeatures: false,
|
||||
features: changePreview,
|
||||
allElements: state.allElements,
|
||||
state,
|
||||
layerToShow: new LayerConfig(conflation_json, "all_known_layers", true)
|
||||
})
|
||||
})
|
||||
|
|
|
@ -16,7 +16,7 @@ export default class QuestionBox extends VariableUiElement {
|
|||
public readonly skippedQuestions: UIEventSource<number[]>;
|
||||
public readonly restingQuestions: UIEventSource<BaseUIElement[]>;
|
||||
|
||||
constructor(options: {
|
||||
constructor(state, options: {
|
||||
tagsSource: UIEventSource<any>,
|
||||
tagRenderings: TagRenderingConfig[], units: Unit[],
|
||||
showAllQuestionsAtOnce?: boolean | UIEventSource<boolean>
|
||||
|
@ -34,7 +34,7 @@ export default class QuestionBox extends VariableUiElement {
|
|||
|
||||
const tagRenderingQuestions = tagRenderings
|
||||
.map((tagRendering, i) =>
|
||||
new Lazy(() => new TagRenderingQuestion(tagsSource, tagRendering,
|
||||
new Lazy(() => new TagRenderingQuestion(tagsSource, tagRendering, state,
|
||||
{
|
||||
units: units,
|
||||
afterSave: () => {
|
||||
|
|
|
@ -3,7 +3,6 @@ import Svg from "../../Svg";
|
|||
import {UIEventSource} from "../../Logic/UIEventSource";
|
||||
import {SubtleButton} from "../Base/SubtleButton";
|
||||
import Minimap from "../Base/Minimap";
|
||||
import State from "../../State";
|
||||
import ShowDataLayer from "../ShowDataLayer/ShowDataLayer";
|
||||
import {GeoOperations} from "../../Logic/GeoOperations";
|
||||
import {LeafletMouseEvent} from "leaflet";
|
||||
|
@ -17,6 +16,12 @@ import ShowDataMultiLayer from "../ShowDataLayer/ShowDataMultiLayer";
|
|||
import LayerConfig from "../../Models/ThemeConfig/LayerConfig";
|
||||
import {BBox} from "../../Logic/BBox";
|
||||
import * as split_point from "../../assets/layers/split_point/split_point.json"
|
||||
import {OsmConnection} from "../../Logic/Osm/OsmConnection";
|
||||
import {Changes} from "../../Logic/Osm/Changes";
|
||||
import LayoutConfig from "../../Models/ThemeConfig/LayoutConfig";
|
||||
import {ElementStorage} from "../../Logic/ElementStorage";
|
||||
import BaseLayer from "../../Models/BaseLayer";
|
||||
import FilteredLayer from "../../Models/FilteredLayer";
|
||||
|
||||
export default class SplitRoadWizard extends Toggle {
|
||||
// @ts-ignore
|
||||
|
@ -28,8 +33,19 @@ export default class SplitRoadWizard extends Toggle {
|
|||
* A UI Element used for splitting roads
|
||||
*
|
||||
* @param id: The id of the road to remove
|
||||
* @param state: the state of the application
|
||||
*/
|
||||
constructor(id: string) {
|
||||
constructor(id: string, state: {
|
||||
filteredLayers: UIEventSource<FilteredLayer[]>;
|
||||
backgroundLayer: UIEventSource<BaseLayer>;
|
||||
featureSwitchIsTesting: UIEventSource<boolean>;
|
||||
featureSwitchIsDebugging: UIEventSource<boolean>;
|
||||
featureSwitchShowAllQuestions: UIEventSource<boolean>;
|
||||
osmConnection: OsmConnection,
|
||||
featureSwitchUserbadge: UIEventSource<boolean>,
|
||||
changes: Changes,
|
||||
layoutToUse: LayoutConfig,
|
||||
allElements: ElementStorage}) {
|
||||
|
||||
const t = Translations.t.split;
|
||||
|
||||
|
@ -41,12 +57,12 @@ export default class SplitRoadWizard extends Toggle {
|
|||
// Toggle variable between show split button and map
|
||||
const splitClicked = new UIEventSource<boolean>(false);
|
||||
// Load the road with given id on the minimap
|
||||
const roadElement = State.state.allElements.ContainingFeatures.get(id)
|
||||
const roadElement = state.allElements.ContainingFeatures.get(id)
|
||||
|
||||
// Minimap on which you can select the points to be splitted
|
||||
const miniMap = Minimap.createMiniMap(
|
||||
{
|
||||
background: State.state.backgroundLayer,
|
||||
background: state.backgroundLayer,
|
||||
allowMoving: true,
|
||||
leafletOptions: {
|
||||
minZoom: 14
|
||||
|
@ -62,19 +78,20 @@ export default class SplitRoadWizard extends Toggle {
|
|||
// Datalayer displaying the road and the cut points (if any)
|
||||
new ShowDataMultiLayer({
|
||||
features: new StaticFeatureSource([roadElement], false),
|
||||
layers: State.state.filteredLayers,
|
||||
layers: state.filteredLayers,
|
||||
leafletMap: miniMap.leafletMap,
|
||||
enablePopups: false,
|
||||
popup: undefined,
|
||||
zoomToFeatures: true,
|
||||
allElements: State.state.allElements,
|
||||
state
|
||||
})
|
||||
|
||||
new ShowDataLayer({
|
||||
features: new StaticFeatureSource(splitPoints, true),
|
||||
leafletMap: miniMap.leafletMap,
|
||||
zoomToFeatures: false,
|
||||
enablePopups: false,
|
||||
popup: undefined,
|
||||
layerToShow: SplitRoadWizard.splitLayerStyling,
|
||||
state
|
||||
})
|
||||
|
||||
|
||||
|
@ -127,15 +144,15 @@ export default class SplitRoadWizard extends Toggle {
|
|||
|
||||
// Only show the splitButton if logged in, else show login prompt
|
||||
const loginBtn = t.loginToSplit.Clone()
|
||||
.onClick(() => State.state.osmConnection.AttemptLogin())
|
||||
.onClick(() => state.osmConnection.AttemptLogin())
|
||||
.SetClass("login-button-friendly");
|
||||
const splitToggle = new Toggle(splitButton, loginBtn, State.state.osmConnection.isLoggedIn)
|
||||
const splitToggle = new Toggle(splitButton, loginBtn, state.osmConnection.isLoggedIn)
|
||||
|
||||
// Save button
|
||||
const saveButton = new Button(t.split.Clone(), () => {
|
||||
hasBeenSplit.setData(true)
|
||||
State.state.changes.applyAction(new SplitAction(id, splitPoints.data.map(ff => ff.feature.geometry.coordinates), {
|
||||
theme: State.state?.layoutToUse?.id
|
||||
state.changes.applyAction(new SplitAction(id, splitPoints.data.map(ff => ff.feature.geometry.coordinates), {
|
||||
theme: state?.layoutToUse?.id
|
||||
}))
|
||||
})
|
||||
|
||||
|
|
|
@ -8,7 +8,6 @@ import {Utils} from "../../Utils";
|
|||
import CheckBoxes from "../Input/Checkboxes";
|
||||
import InputElementMap from "../Input/InputElementMap";
|
||||
import {SaveButton} from "./SaveButton";
|
||||
import State from "../../State";
|
||||
import {VariableUiElement} from "../Base/VariableUIElement";
|
||||
import Translations from "../i18n/Translations";
|
||||
import {FixedUiElement} from "../Base/FixedUiElement";
|
||||
|
@ -36,6 +35,7 @@ export default class TagRenderingQuestion extends Combine {
|
|||
|
||||
constructor(tags: UIEventSource<any>,
|
||||
configuration: TagRenderingConfig,
|
||||
state,
|
||||
options?: {
|
||||
units?: Unit[],
|
||||
afterSave?: () => void,
|
||||
|
@ -71,23 +71,23 @@ export default class TagRenderingQuestion extends Combine {
|
|||
}
|
||||
options = options ?? {}
|
||||
const applicableUnit = (options.units ?? []).filter(unit => unit.isApplicableToKey(configuration.freeform?.key))[0];
|
||||
const question = new SubstitutedTranslation(configuration.question, tags, State.state)
|
||||
const question = new SubstitutedTranslation(configuration.question, tags, state)
|
||||
.SetClass("question-text");
|
||||
|
||||
|
||||
const inputElement: InputElement<TagsFilter> =
|
||||
new VariableInputElement(applicableMappingsSrc.map(applicableMappings =>
|
||||
TagRenderingQuestion.GenerateInputElement(configuration, applicableMappings, applicableUnit, tags)
|
||||
TagRenderingQuestion.GenerateInputElement(state, configuration, applicableMappings, applicableUnit, tags)
|
||||
))
|
||||
|
||||
|
||||
const save = () => {
|
||||
const selection = inputElement.GetValue().data;
|
||||
if (selection) {
|
||||
(State.state?.changes)
|
||||
(state?.changes)
|
||||
.applyAction(new ChangeTagAction(
|
||||
tags.data.id, selection, tags.data, {
|
||||
theme: State.state?.layoutToUse?.id ?? "unkown",
|
||||
theme: state?.layoutToUse?.id ?? "unkown",
|
||||
changeType: "answer",
|
||||
}
|
||||
)).then(_ => {
|
||||
|
@ -101,13 +101,13 @@ export default class TagRenderingQuestion extends Combine {
|
|||
|
||||
if (options.saveButtonConstr === undefined) {
|
||||
options.saveButtonConstr = v => new SaveButton(v,
|
||||
State.state?.osmConnection)
|
||||
state?.osmConnection)
|
||||
.onClick(save)
|
||||
}
|
||||
|
||||
const saveButton = new Combine([
|
||||
options.saveButtonConstr(inputElement.GetValue()),
|
||||
new Toggle(Translations.t.general.testing.SetClass("alert"), undefined, State.state.featureSwitchIsTesting)
|
||||
new Toggle(Translations.t.general.testing.SetClass("alert"), undefined, state.featureSwitchIsTesting)
|
||||
])
|
||||
|
||||
let bottomTags: BaseUIElement;
|
||||
|
@ -117,7 +117,7 @@ export default class TagRenderingQuestion extends Combine {
|
|||
bottomTags = new VariableUiElement(
|
||||
inputElement.GetValue().map(
|
||||
(tagsFilter: TagsFilter) => {
|
||||
const csCount = State.state?.osmConnection?.userDetails?.data?.csCount ?? 1000;
|
||||
const csCount = state?.osmConnection?.userDetails?.data?.csCount ?? 1000;
|
||||
if (csCount < Constants.userJourney.tagsVisibleAt) {
|
||||
return "";
|
||||
}
|
||||
|
@ -145,14 +145,16 @@ export default class TagRenderingQuestion extends Combine {
|
|||
}
|
||||
|
||||
|
||||
private static GenerateInputElement(configuration: TagRenderingConfig,
|
||||
applicableMappings: { if: TagsFilter, then: any, ifnot?: TagsFilter, addExtraTags: Tag[] }[],
|
||||
applicableUnit: Unit,
|
||||
tagsSource: UIEventSource<any>)
|
||||
private static GenerateInputElement(
|
||||
state,
|
||||
configuration: TagRenderingConfig,
|
||||
applicableMappings: { if: TagsFilter, then: any, ifnot?: TagsFilter, addExtraTags: Tag[] }[],
|
||||
applicableUnit: Unit,
|
||||
tagsSource: UIEventSource<any>)
|
||||
: InputElement<TagsFilter> {
|
||||
|
||||
// FreeForm input will be undefined if not present; will already contain a special input element if applicable
|
||||
const ff = TagRenderingQuestion.GenerateFreeform(configuration, applicableUnit, tagsSource);
|
||||
const ff = TagRenderingQuestion.GenerateFreeform(state, configuration, applicableUnit, tagsSource);
|
||||
|
||||
|
||||
const hasImages = applicableMappings.filter(mapping => mapping.then.ExtractImages().length > 0).length > 0
|
||||
|
@ -188,7 +190,7 @@ export default class TagRenderingQuestion extends Combine {
|
|||
|
||||
|
||||
if (applicableMappings.length < 8 || configuration.multiAnswer || hasImages || ifNotsPresent) {
|
||||
inputEls = (applicableMappings ?? []).map((mapping, i) => TagRenderingQuestion.GenerateMappingElement(tagsSource, mapping, allIfNotsExcept(i)));
|
||||
inputEls = (applicableMappings ?? []).map((mapping, i) => TagRenderingQuestion.GenerateMappingElement(state, tagsSource, mapping, allIfNotsExcept(i)));
|
||||
inputEls = Utils.NoNull(inputEls);
|
||||
} else {
|
||||
const dropdown: InputElement<TagsFilter> = new DropDown("",
|
||||
|
@ -336,6 +338,7 @@ export default class TagRenderingQuestion extends Combine {
|
|||
* Returns: [the element itself, the value to select if not selected. The contents of this UIEventSource might swap to undefined if the conditions to show the answer are unmet]
|
||||
*/
|
||||
private static GenerateMappingElement(
|
||||
state,
|
||||
tagsSource: UIEventSource<any>,
|
||||
mapping: {
|
||||
if: TagsFilter,
|
||||
|
@ -352,12 +355,12 @@ export default class TagRenderingQuestion extends Combine {
|
|||
}
|
||||
|
||||
return new FixedInputElement(
|
||||
new SubstitutedTranslation(mapping.then, tagsSource, State.state),
|
||||
new SubstitutedTranslation(mapping.then, tagsSource, state),
|
||||
tagging,
|
||||
(t0, t1) => t1.isEquivalent(t0));
|
||||
}
|
||||
|
||||
private static GenerateFreeform(configuration: TagRenderingConfig, applicableUnit: Unit, tags: UIEventSource<any>): InputElement<TagsFilter> {
|
||||
private static GenerateFreeform(state, configuration: TagRenderingConfig, applicableUnit: Unit, tags: UIEventSource<any>): InputElement<TagsFilter> {
|
||||
const freeform = configuration.freeform;
|
||||
if (freeform === undefined) {
|
||||
return undefined;
|
||||
|
@ -397,12 +400,12 @@ export default class TagRenderingQuestion extends Combine {
|
|||
}
|
||||
|
||||
const tagsData = tags.data;
|
||||
const feature = State.state.allElements.ContainingFeatures.get(tagsData.id)
|
||||
const feature = state.allElements.ContainingFeatures.get(tagsData.id)
|
||||
const input: InputElement<string> = ValidatedTextField.InputForType(configuration.freeform.type, {
|
||||
isValid: (str) => (str.length <= 255),
|
||||
country: () => tagsData._country,
|
||||
location: [tagsData._lat, tagsData._lon],
|
||||
mapBackgroundLayer: State.state.backgroundLayer,
|
||||
mapBackgroundLayer: state.backgroundLayer,
|
||||
unit: applicableUnit,
|
||||
args: configuration.freeform.helperArgs,
|
||||
feature: feature
|
||||
|
@ -418,7 +421,7 @@ export default class TagRenderingQuestion extends Combine {
|
|||
if (freeform.inline) {
|
||||
|
||||
inputTagsFilter.SetClass("w-16-imp")
|
||||
inputTagsFilter = new InputElementWrapper(inputTagsFilter, configuration.render, freeform.key, tags, State.state)
|
||||
inputTagsFilter = new InputElementWrapper(inputTagsFilter, configuration.render, freeform.key, tags, state)
|
||||
inputTagsFilter.SetClass("block")
|
||||
|
||||
}
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
import {UIEventSource} from "../../Logic/UIEventSource";
|
||||
import LayerConfig from "../../Models/ThemeConfig/LayerConfig";
|
||||
import FeatureInfoBox from "../Popup/FeatureInfoBox";
|
||||
import {ShowDataLayerOptions} from "./ShowDataLayerOptions";
|
||||
import {ElementStorage} from "../../Logic/ElementStorage";
|
||||
import RenderingMultiPlexerFeatureSource from "../../Logic/FeatureSource/Sources/RenderingMultiPlexerFeatureSource";
|
||||
import ScrollableFullScreen from "../Base/ScrollableFullScreen";
|
||||
/*
|
||||
// import 'leaflet-polylineoffset';
|
||||
We don't actually import it here. It is imported in the 'MinimapImplementation'-class, which'll result in a patched 'L' object.
|
||||
|
@ -44,12 +44,12 @@ export default class ShowDataLayer {
|
|||
*/
|
||||
private readonly leafletLayersPerId = new Map<string, { feature: any, leafletlayer: any }>()
|
||||
private readonly showDataLayerid: number;
|
||||
|
||||
private readonly createPopup : (tags: any, layer: LayerConfig) => ScrollableFullScreen
|
||||
|
||||
constructor(options: ShowDataLayerOptions & { layerToShow: LayerConfig }) {
|
||||
this._leafletMap = options.leafletMap;
|
||||
this.showDataLayerid = ShowDataLayer.dataLayerIds;
|
||||
ShowDataLayer.dataLayerIds++
|
||||
this._enablePopups = options.enablePopups ?? true;
|
||||
if (options.features === undefined) {
|
||||
console.error("Invalid ShowDataLayer invocation: options.features is undefed")
|
||||
throw "Invalid ShowDataLayer invocation: options.features is undefed"
|
||||
|
@ -57,7 +57,12 @@ export default class ShowDataLayer {
|
|||
this._features = new RenderingMultiPlexerFeatureSource(options.features, options.layerToShow);
|
||||
this._layerToShow = options.layerToShow;
|
||||
this._selectedElement = options.selectedElement
|
||||
this.allElements = options.allElements;
|
||||
this.allElements = options.state?.allElements;
|
||||
this.createPopup = undefined;
|
||||
this._enablePopups = options.popup !== undefined;
|
||||
if(options.popup !== undefined){
|
||||
this.createPopup = options.popup
|
||||
}
|
||||
const self = this;
|
||||
|
||||
options.leafletMap.addCallback(_ => {
|
||||
|
@ -300,14 +305,14 @@ export default class ShowDataLayer {
|
|||
|
||||
leafletLayer.bindPopup(popup);
|
||||
|
||||
let infobox: FeatureInfoBox = undefined;
|
||||
|
||||
let infobox: ScrollableFullScreen = undefined;
|
||||
const id = `popup-${feature.properties.id}-${feature.geometry.type}-${this.showDataLayerid}-${this._cleanCount}-${feature.pointRenderingIndex ?? feature.lineRenderingIndex}-${feature.multiLineStringIndex ?? ""}`
|
||||
popup.setContent(`<div style='height: 65vh' id='${id}'>Popup for ${feature.properties.id} ${feature.geometry.type} ${id} is loading</div>`)
|
||||
const createpopup = this.createPopup;
|
||||
leafletLayer.on("popupopen", () => {
|
||||
if (infobox === undefined) {
|
||||
const tags = this.allElements?.getEventSourceById(feature.properties.id) ?? new UIEventSource<any>(feature.properties);
|
||||
infobox = new FeatureInfoBox(tags, layer);
|
||||
infobox = createpopup(tags, layer );
|
||||
|
||||
infobox.isShown.addCallback(isShown => {
|
||||
if (!isShown) {
|
||||
|
|
|
@ -1,13 +1,20 @@
|
|||
import FeatureSource from "../../Logic/FeatureSource/FeatureSource";
|
||||
import {UIEventSource} from "../../Logic/UIEventSource";
|
||||
import {ElementStorage} from "../../Logic/ElementStorage";
|
||||
import {OsmConnection} from "../../Logic/Osm/OsmConnection";
|
||||
import {Changes} from "../../Logic/Osm/Changes";
|
||||
import LayoutConfig from "../../Models/ThemeConfig/LayoutConfig";
|
||||
import FilteredLayer from "../../Models/FilteredLayer";
|
||||
import BaseLayer from "../../Models/BaseLayer";
|
||||
import LayerConfig from "../../Models/ThemeConfig/LayerConfig";
|
||||
import ScrollableFullScreen from "../Base/ScrollableFullScreen";
|
||||
|
||||
export interface ShowDataLayerOptions {
|
||||
features: FeatureSource,
|
||||
selectedElement?: UIEventSource<any>,
|
||||
allElements?: ElementStorage,
|
||||
leafletMap: UIEventSource<L.Map>,
|
||||
enablePopups?: true | boolean,
|
||||
popup?: undefined | ((tags: any, layer: LayerConfig) => ScrollableFullScreen),
|
||||
zoomToFeatures?: false | boolean,
|
||||
doShowLayer?: UIEventSource<boolean>
|
||||
doShowLayer?: UIEventSource<boolean>,
|
||||
state?: {allElements?: ElementStorage}
|
||||
}
|
|
@ -6,6 +6,8 @@ import StaticFeatureSource from "../../Logic/FeatureSource/Sources/StaticFeature
|
|||
import {GeoOperations} from "../../Logic/GeoOperations";
|
||||
import {Tiles} from "../../Models/TileRange";
|
||||
import * as clusterstyle from "../../assets/layers/cluster_style/cluster_style.json"
|
||||
import State from "../../State";
|
||||
import FeatureInfoBox from "../Popup/FeatureInfoBox";
|
||||
|
||||
export default class ShowTileInfo {
|
||||
public static readonly styling = new LayerConfig(clusterstyle, "ShowTileInfo", true)
|
||||
|
@ -53,7 +55,9 @@ export default class ShowTileInfo {
|
|||
layerToShow: ShowTileInfo.styling,
|
||||
features: new StaticFeatureSource(metaFeature, false),
|
||||
leafletMap: options.leafletMap,
|
||||
doShowLayer: options.doShowLayer
|
||||
doShowLayer: options.doShowLayer,
|
||||
state: State.state,
|
||||
popup: undefined
|
||||
})
|
||||
|
||||
}
|
||||
|
|
|
@ -12,7 +12,6 @@ import MangroveReviews from "../Logic/Web/MangroveReviews";
|
|||
import Translations from "./i18n/Translations";
|
||||
import ReviewForm from "./Reviews/ReviewForm";
|
||||
import OpeningHoursVisualization from "./OpeningHours/OpeningHoursVisualization";
|
||||
import State from "../State";
|
||||
import BaseUIElement from "./BaseUIElement";
|
||||
import Title from "./Base/Title";
|
||||
import Table from "./Base/Table";
|
||||
|
@ -100,10 +99,10 @@ export default class SpecialVisualizations {
|
|||
funcName: "all_tags",
|
||||
docs: "Prints all key-value pairs of the object - used for debugging",
|
||||
args: [],
|
||||
constr: ((state: State, tags: UIEventSource<any>) => {
|
||||
constr: ((state, tags: UIEventSource<any>) => {
|
||||
const calculatedTags = [].concat(
|
||||
SimpleMetaTagger.lazyTags,
|
||||
...state.layoutToUse.layers.map(l => l.calculatedTags?.map(c => c[0]) ?? []))
|
||||
...(state?.layoutToUse?.layers?.map(l => l.calculatedTags?.map(c => c[0]) ?? []) ?? []))
|
||||
return new VariableUiElement(tags.map(tags => {
|
||||
const parts = [];
|
||||
for (const key in tags) {
|
||||
|
@ -129,7 +128,7 @@ export default class SpecialVisualizations {
|
|||
["key", "value"],
|
||||
parts
|
||||
)
|
||||
})).SetStyle("border: 1px solid black; border-radius: 1em;padding:1em;display:block;")
|
||||
})).SetStyle("border: 1px solid black; border-radius: 1em;padding:1em;display:block;").SetClass("zebra-table")
|
||||
})
|
||||
},
|
||||
{
|
||||
|
@ -140,7 +139,7 @@ export default class SpecialVisualizations {
|
|||
defaultValue: AllImageProviders.defaultKeys.join(","),
|
||||
doc: "The keys given to the images, e.g. if <span class='literal-code'>image</span> is given, the first picture URL will be added as <span class='literal-code'>image</span>, the second as <span class='literal-code'>image:0</span>, the third as <span class='literal-code'>image:1</span>, etc... "
|
||||
}],
|
||||
constr: (state: State, tags, args) => {
|
||||
constr: (state, tags, args) => {
|
||||
let imagePrefixes: string[] = undefined;
|
||||
if (args.length > 0) {
|
||||
imagePrefixes = [].concat(...args.map(a => a.split(",")));
|
||||
|
@ -160,7 +159,7 @@ export default class SpecialVisualizations {
|
|||
doc: "The text to show on the button",
|
||||
defaultValue: "Add image"
|
||||
}],
|
||||
constr: (state: State, tags, args) => {
|
||||
constr: (state, tags, args) => {
|
||||
return new ImageUploadFlow(tags, state, args[0], args[1])
|
||||
}
|
||||
},
|
||||
|
@ -259,11 +258,10 @@ export default class SpecialVisualizations {
|
|||
new ShowDataMultiLayer(
|
||||
{
|
||||
leafletMap: minimap["leafletMap"],
|
||||
enablePopups: false,
|
||||
popup: undefined,
|
||||
zoomToFeatures: true,
|
||||
layers: State.state.filteredLayers,
|
||||
features: new StaticFeatureSource(featuresToShow, true),
|
||||
allElements: State.state.allElements
|
||||
layers: state.filteredLayers,
|
||||
features: new StaticFeatureSource(featuresToShow, true)
|
||||
}
|
||||
)
|
||||
|
||||
|
@ -306,11 +304,11 @@ export default class SpecialVisualizations {
|
|||
new ShowDataLayer(
|
||||
{
|
||||
leafletMap: minimap["leafletMap"],
|
||||
enablePopups: false,
|
||||
popup: undefined,
|
||||
zoomToFeatures: true,
|
||||
layerToShow: new LayerConfig(left_right_style_json, "all_known_layers", true),
|
||||
features: new StaticFeatureSource([copy], false),
|
||||
allElements: State.state.allElements
|
||||
state
|
||||
}
|
||||
)
|
||||
|
||||
|
@ -331,7 +329,7 @@ export default class SpecialVisualizations {
|
|||
name: "fallback",
|
||||
doc: "The identifier to use, if <i>tags[subjectKey]</i> as specified above is not available. This is effectively a fallback value"
|
||||
}],
|
||||
constr: (state: State, tags, args) => {
|
||||
constr: (state, tags, args) => {
|
||||
const tgs = tags.data;
|
||||
const key = args[0] ?? "name"
|
||||
let subject = tgs[key] ?? args[1];
|
||||
|
@ -364,7 +362,7 @@ export default class SpecialVisualizations {
|
|||
doc: "Remove this string from the end of the value before parsing. __Note: use `&RPARENs` to indicate `)` if needed__"
|
||||
}],
|
||||
example: "A normal opening hours table can be invoked with `{opening_hours_table()}`. A table for e.g. conditional access with opening hours can be `{opening_hours_table(access:conditional, no @ &LPARENS, &RPARENS)}`",
|
||||
constr: (state: State, tagSource: UIEventSource<any>, args) => {
|
||||
constr: (state, tagSource: UIEventSource<any>, args) => {
|
||||
return new OpeningHoursVisualization(tagSource, state, args[0], args[1], args[2])
|
||||
}
|
||||
},
|
||||
|
@ -380,7 +378,7 @@ export default class SpecialVisualizations {
|
|||
}, {
|
||||
name: "path", doc: "The path (or shorthand) that should be returned"
|
||||
}],
|
||||
constr: (state: State, tagSource: UIEventSource<any>, args) => {
|
||||
constr: (state, tagSource: UIEventSource<any>, args) => {
|
||||
const url = args[0];
|
||||
const shorthands = args[1];
|
||||
const neededValue = args[2];
|
||||
|
@ -413,7 +411,7 @@ export default class SpecialVisualizations {
|
|||
|
||||
}
|
||||
],
|
||||
constr: (state: State, tagSource: UIEventSource<any>, args: string[]) => {
|
||||
constr: (state, tagSource: UIEventSource<any>, args: string[]) => {
|
||||
|
||||
let assignColors = undefined;
|
||||
if (args.length >= 3) {
|
||||
|
@ -461,7 +459,7 @@ export default class SpecialVisualizations {
|
|||
doc: "The url to share (default: current URL)",
|
||||
}
|
||||
],
|
||||
constr: (state: State, tagSource: UIEventSource<any>, args) => {
|
||||
constr: (state, tagSource: UIEventSource<any>, args) => {
|
||||
if (window.navigator.share) {
|
||||
|
||||
const generateShareData = () => {
|
||||
|
@ -580,7 +578,7 @@ export default class SpecialVisualizations {
|
|||
funcName: "export_as_gpx",
|
||||
docs: "Exports the selected feature as GPX-file",
|
||||
args: [],
|
||||
constr: (state, tagSource, args) => {
|
||||
constr: (state, tagSource) => {
|
||||
const t = Translations.t.general.download;
|
||||
|
||||
return new SubtleButton(Svg.download_ui(),
|
||||
|
@ -605,7 +603,7 @@ export default class SpecialVisualizations {
|
|||
funcName: "export_as_geojson",
|
||||
docs: "Exports the selected feature as GeoJson-file",
|
||||
args: [],
|
||||
constr: (state, tagSource, args) => {
|
||||
constr: (state, tagSource) => {
|
||||
const t = Translations.t.general.download;
|
||||
|
||||
return new SubtleButton(Svg.download_ui(),
|
||||
|
@ -672,7 +670,7 @@ export default class SpecialVisualizations {
|
|||
doc: "Text to add onto the note when closing",
|
||||
}
|
||||
],
|
||||
constr: (state, tags, args, guiState) => {
|
||||
constr: (state, tags, args) => {
|
||||
const t = Translations.t.notes;
|
||||
|
||||
let icon = Svg.checkmark_svg()
|
||||
|
@ -711,7 +709,7 @@ export default class SpecialVisualizations {
|
|||
defaultValue: "id"
|
||||
}
|
||||
],
|
||||
constr: (state, tags, args, guiState) => {
|
||||
constr: (state, tags, args) => {
|
||||
|
||||
const t = Translations.t.notes;
|
||||
const textField = ValidatedTextField.InputForType("text", {placeholder: t.addCommentPlaceholder})
|
||||
|
|
26
assets/layers/import_candidate/import_candidate.json
Normal file
26
assets/layers/import_candidate/import_candidate.json
Normal file
|
@ -0,0 +1,26 @@
|
|||
{
|
||||
"id": "import_candidate",
|
||||
"description": "Layer used in the importHelper",
|
||||
"source": {
|
||||
"osmTags": {
|
||||
"and": []
|
||||
}
|
||||
},
|
||||
"mapRendering": [
|
||||
{
|
||||
"location": [
|
||||
"point",
|
||||
"centroid"
|
||||
],
|
||||
"icon": "square:red;",
|
||||
"iconSize": "15,15,center"
|
||||
}
|
||||
],
|
||||
"title": "Import candidate",
|
||||
"tagRenderings": [
|
||||
{
|
||||
"id": "all_tags",
|
||||
"render": "{all_tags()}"
|
||||
}
|
||||
]
|
||||
}
|
|
@ -68,10 +68,6 @@
|
|||
],
|
||||
"tagRenderings": [
|
||||
"images",
|
||||
{
|
||||
"id": "minimap",
|
||||
"render": "{minimap():height: 9rem; border-radius: 2.5rem; overflow:hidden;border:1px solid gray}"
|
||||
},
|
||||
{
|
||||
"render": {
|
||||
"en": "The name of this bookcase is {name}",
|
||||
|
|
|
@ -912,6 +912,10 @@ video {
|
|||
margin-left: 0.25rem;
|
||||
}
|
||||
|
||||
.mb-24 {
|
||||
margin-bottom: 6rem;
|
||||
}
|
||||
|
||||
.mr-0 {
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
@ -1178,6 +1182,10 @@ video {
|
|||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.table-auto {
|
||||
table-layout: auto;
|
||||
}
|
||||
|
||||
.border-collapse {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
@ -1272,6 +1280,12 @@ video {
|
|||
gap: 1rem;
|
||||
}
|
||||
|
||||
.space-x-2 > :not([hidden]) ~ :not([hidden]) {
|
||||
--tw-space-x-reverse: 0;
|
||||
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
|
||||
margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
|
||||
}
|
||||
|
||||
.self-end {
|
||||
align-self: flex-end;
|
||||
}
|
||||
|
@ -2335,6 +2349,10 @@ li::marker {
|
|||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.zebra-table tr:nth-child(even) {
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
.hover\:bg-blue-200:hover {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgba(191, 219, 254, var(--tw-bg-opacity));
|
||||
|
@ -2625,4 +2643,4 @@ li::marker {
|
|||
.xl\:inline {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -482,3 +482,5 @@ li::marker {
|
|||
transition: max-height .5s ease-in-out;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.zebra-table tr:nth-child(even) {background-color: #f2f2f2;}
|
1
index.ts
1
index.ts
|
@ -14,7 +14,6 @@ import {DefaultGuiState} from "./UI/DefaultGuiState";
|
|||
|
||||
// Workaround for a stupid crash: inject some functions which would give stupid circular dependencies or crash the other nodejs scripts running from console
|
||||
MinimapImplementation.initialize()
|
||||
AvailableBaseLayers.implement(new AvailableBaseLayersImplementation())
|
||||
ShowOverlayLayerImplementation.Implement();
|
||||
// Miscelleanous
|
||||
Utils.DisableLongPresses()
|
||||
|
|
|
@ -70,6 +70,9 @@
|
|||
"readMessages": "You have unread messages. Read these before deleting a point - someone might have feedback"
|
||||
},
|
||||
"general": {
|
||||
"next": "Next",
|
||||
"confirm": "Confirm",
|
||||
"back": "Back",
|
||||
"backToMapcomplete": "Back to the theme overview",
|
||||
"loading": "Loading...",
|
||||
"pdf": {
|
||||
|
@ -467,6 +470,12 @@
|
|||
"importHelper": {
|
||||
"title": "Import helper",
|
||||
"description": "The import helper converts an external dataset to notes",
|
||||
"lockNotice": "This page is locked. You need {importHelperUnlock} changesets before you can access here."
|
||||
"lockNotice": "This page is locked. You need {importHelperUnlock} changesets before you can access here.",
|
||||
"selectFile": "Select a .csv or .geojson file to get started",
|
||||
"loadedFilesAre": "Currently loaded file is {file}",
|
||||
"noFilesLoaded": "No file is currently loaded",
|
||||
"selectLayer": "Select a layer...",
|
||||
"selectFileTitle": "Select file",
|
||||
"validateDataTitle": "Validate data"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -22,7 +22,7 @@
|
|||
"generate:polygon-features": "ts-node scripts/downloadFile.ts https://raw.githubusercontent.com/tyrasd/osm-polygon-features/master/polygon-features.json assets/polygon-features.json",
|
||||
"generate:images": "ts-node scripts/generateIncludedImages.ts",
|
||||
"generate:translations": "ts-node scripts/generateTranslations.ts",
|
||||
"watch:translations": "cd langs && ls | entr npm run generate:translations",
|
||||
"watch:translations": "cd langs && ls | entr -c npm run generate:translations",
|
||||
"reset:translations": "ts-node scripts/generateTranslations.ts --ignore-weblate",
|
||||
"generate:layouts": "ts-node scripts/generateLayouts.ts",
|
||||
"generate:docs": "ts-node scripts/generateDocs.ts && ts-node scripts/generateTaginfoProjectFiles.ts",
|
||||
|
|
|
@ -126,10 +126,6 @@ async function main(args: string[]) {
|
|||
}
|
||||
delete f.bbox
|
||||
}
|
||||
|
||||
//const knownKeys = Utils.Dedup([].concat(...allFeatures.map(f => Object.keys(f.properties))))
|
||||
//console.log("Kept keys: ", knownKeys)
|
||||
|
||||
TiledFeatureSource.createHierarchy(
|
||||
new StaticFeatureSource(allFeatures, false),
|
||||
{
|
||||
|
|
Loading…
Reference in a new issue