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

Formatting

Browse source
This commit is contained in:
Pieter Vander Vennet 2021-06-18 14:30:49 +02:00
parent 55f03c3de7
commit c41690aab3
2 changed files with 22 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

9
UI/BigComponents/Basemap.ts
View file

@ -12,13 +12,14 @@ export class Basemap {
constructor(leafletElementId: string, constructor(leafletElementId: string,
location: UIEventSource<Loc>, location: UIEventSource<Loc>,
currentLayer: UIEventSource<BaseLayer>, currentLayer: UIEventSource<BaseLayer>,
lastClickLocation: UIEventSource<{ lat: number, lon: number }>, lastClickLocation?: UIEventSource<{ lat: number, lon: number }>,
extraAttribution: BaseUIElement) { extraAttribution?: BaseUIElement) {
this.map = L.map(leafletElementId, { this.map = L.map(leafletElementId, {
center: [location.data.lat ?? 0, location.data.lon ?? 0], center: [location.data.lat ?? 0, location.data.lon ?? 0],
zoom: location.data.zoom ?? 2, zoom: location.data.zoom ?? 2,
layers: [currentLayer.data.layer], layers: [currentLayer.data.layer],
zoomControl: false, zoomControl: false,
attributionControl: extraAttribution !== undefined
}); });
L.control.scale( L.control.scale(
@ -70,12 +71,12 @@ export class Basemap {
this.map.on("click", function (e) { this.map.on("click", function (e) {
// @ts-ignore // @ts-ignore
lastClickLocation.setData({lat: e.latlng.lat, lon: e.latlng.lng}) lastClickLocation?.setData({lat: e.latlng.lat, lon: e.latlng.lng})
}); });
this.map.on("contextmenu", function (e) { this.map.on("contextmenu", function (e) {
// @ts-ignore // @ts-ignore
lastClickLocation.setData({lat: e.latlng.lat, lon: e.latlng.lng}); lastClickLocation?.setData({lat: e.latlng.lat, lon: e.latlng.lng});
}); });

35
UI/Input/DirectionInput.ts
View file

@ -10,20 +10,28 @@ import {FixedUiElement} from "../Base/FixedUiElement";
*/ */
export default class DirectionInput extends InputElement<string> { export default class DirectionInput extends InputElement<string> {
private readonly value: UIEventSource<string>;
public readonly IsSelected: UIEventSource<boolean> = new UIEventSource<boolean>(false); public readonly IsSelected: UIEventSource<boolean> = new UIEventSource<boolean>(false);
private readonly value: UIEventSource<string>;
constructor(value?: UIEventSource<string>) { constructor(value?: UIEventSource<string>) {
super(); super();
this.value = value ?? new UIEventSource<string>(undefined); this.value = value ?? new UIEventSource<string>(undefined);
} }
GetValue(): UIEventSource<string> {
return this.value;
}
IsValid(str: string): boolean {
const t = Number(str);
return !isNaN(t) && t >= 0 && t <= 360;
}
protected InnerConstructElement(): HTMLElement { protected InnerConstructElement(): HTMLElement {
const element = new Combine([ const element = new Combine([
new FixedUiElement("").SetClass("w-full h-full absolute top-0 left-O rounded-full"), new FixedUiElement("").SetClass("w-full h-full absolute top-0 left-O rounded-full"),
Svg.direction_svg().SetStyle( Svg.direction_svg().SetStyle(
`position: absolute;top: 0;left: 0;width: 100%;height: 100%;transform:rotate(${this.value.data ?? 0}deg);`) `position: absolute;top: 0;left: 0;width: 100%;height: 100%;transform:rotate(${this.value.data ?? 0}deg);`)
@ -40,18 +48,12 @@ export default class DirectionInput extends InputElement<string> {
cone.style.transform = `rotate(${rotation}deg)`; cone.style.transform = `rotate(${rotation}deg)`;
}) })
this.RegisterTriggers(element) this.RegisterTriggers(element)
return element; return element;
} }
GetValue(): UIEventSource<string> {
return this.value;
}
private RegisterTriggers(htmlElement: HTMLElement) { private RegisterTriggers(htmlElement: HTMLElement) {
const self = this; const self = this;
@ -83,19 +85,16 @@ export default class DirectionInput extends InputElement<string> {
} }
htmlElement.onmouseup = (ev) => { htmlElement.onmouseup = (ev) => {
isDown = false; ev.preventDefault(); isDown = false;
ev.preventDefault();
} }
htmlElement.onmousemove = (ev: MouseEvent) => { htmlElement.onmousemove = (ev: MouseEvent) => {
if (isDown) { if (isDown) {
onPosChange(ev.clientX, ev.clientY); onPosChange(ev.clientX, ev.clientY);
} ev.preventDefault(); }
ev.preventDefault();
} }
} }
IsValid(str: string): boolean {
const t = Number(str);
return !isNaN(t) && t >= 0 && t <= 360;
}
} }