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

Lots of refactoring, first version of the import helper

Browse source
This commit is contained in:
Pieter Vander Vennet 2022-01-19 20:34:04 +01:00
parent 612b8136ad
commit 3402ac0954
54 changed files with 1104 additions and 315 deletions
Download patch file Download diff file Expand all files Collapse all files

4
UI/Input/CombinedInputElement.ts
View file

@ -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),

2
UI/Input/DropDown.ts
View file

@ -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)

26
UI/Input/FileSelectorButton.ts
View file

@ -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;
}

6
UI/Input/FixedInputElement.ts
View file

@ -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> {

1
UI/Input/InputElement.ts
View file

@ -3,7 +3,6 @@ import BaseUIElement from "../BaseUIElement";
export abstract class InputElement<T> extends BaseUIElement {
abstract IsSelected: UIEventSource<boolean>;
abstract GetValue(): UIEventSource<T>;

2
UI/Input/InputElementMap.ts
View file

@ -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 => {

2
UI/Input/InputElementWrapper.ts
View file

@ -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)

13
UI/Input/LocationInput.ts
View file

@ -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
})

7
UI/Input/RadioButton.ts
View file

@ -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);
});

10
UI/Input/TextField.ts
View file

@ -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("'", "&#39");
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

2
UI/Input/VariableInputElement.ts
View file

@ -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> {