(undefined)
let mla = new MapLibreAdaptor(map, mapProperties)
mla.allowMoving.setData(false)
mla.allowZooming.setData(false)
- state?.mapProperties?.rasterLayer?.addCallbackAndRunD((l) => mla.rasterLayer.set(l))
-
+ let rotation = new UIEventSource(value.data)
+ rotation.addCallbackD(rotation => {
+ const r = (rotation + mapProperties.rotation.data + 360) % 360
+ console.log("Setting value to", r)
+ value.setData(""+Math.floor(r))
+ }, [mapProperties.rotation])
let directionElem: HTMLElement | undefined
- $: value.addCallbackAndRunD((degrees) => {
- if (directionElem === undefined) {
+ $: rotation.addCallbackAndRunD((degrees) => {
+ if (!directionElem?.style) {
return
}
directionElem.style.rotate = degrees + "deg"
@@ -32,13 +42,14 @@
let mainElem: HTMLElement
+
function onPosChange(x: number, y: number) {
const rect = mainElem.getBoundingClientRect()
const dx = -(rect.left + rect.right) / 2 + x
const dy = (rect.top + rect.bottom) / 2 - y
const angle = (180 * Math.atan2(dy, dx)) / Math.PI
const angleGeo = Math.floor((450 - angle) % 360)
- value.setData("" + angleGeo)
+ rotation.setData(angleGeo)
}
let isDown = false
@@ -46,7 +57,7 @@
onPosChange(e.x, e.y)}
on:mousedown={(e) => {
isDown = true
@@ -71,7 +82,7 @@
-
diff --git a/src/UI/InputElement/InputHelper.svelte b/src/UI/InputElement/InputHelper.svelte
index 200e2afc2..ed5cbb64d 100644
--- a/src/UI/InputElement/InputHelper.svelte
+++ b/src/UI/InputElement/InputHelper.svelte
@@ -1,67 +1,25 @@
-{#if type === "translation"}
-
-{:else if type === "direction"}
-
-{:else if type === "date"}
-
-{:else if type === "time"}
-
-{:else if type === "points_in_time"}
-
-{:else if type === "color"}
-
-{:else if type === "image"}
-
-{:else if type === "tag"}
-
-{:else if type === "simple_tag"}
-
-{:else if type === "opening_hours"}
-
-{:else if type === "slope"}
-
-{:else if type === "wikidata"}
-
-{:else if type === "distance"}
-
-
-{:else}
-
+{#if type === "distance"}
+
+{:else if validatorHelper !== undefined}
+
{/if}
diff --git a/src/UI/InputElement/InputHelpers.ts b/src/UI/InputElement/InputHelpers.ts
deleted file mode 100644
index bae5aaec9..000000000
--- a/src/UI/InputElement/InputHelpers.ts
+++ /dev/null
@@ -1,67 +0,0 @@
-import { UIEventSource } from "../../Logic/UIEventSource"
-
-import { MapProperties } from "../../Models/MapProperties"
-import { Feature } from "geojson"
-import { GeoOperations } from "../../Logic/GeoOperations"
-import { ValidatorType } from "./Validators"
-
-export interface InputHelperProperties {
- /**
- * Extra arguments which might be used by the helper component
- */
- args?: (string | number | boolean)[]
-
- /**
- * Used for map-based helpers, such as 'direction'
- */
- mapProperties?: Partial & {
- readonly location: UIEventSource<{ lon: number; lat: number }>
- }
- /**
- * The feature that this question is about
- * Used by the wikidata-input to read properties, which in turn is used to read the name to pre-populate the text field.
- * Additionally, used for direction input to set the default location if no mapProperties with location are given
- */
- feature?: Feature
-}
-
-export default class InputHelpers {
- public static hideInputField: ValidatorType[] = ["translation", "simple_tag", "tag","time"]
-
- /**
- * Constructs a mapProperties-object for the given properties.
- * Assumes that the first helper-args contains the desired zoom-level
- * Used for the 'direction' input helper
- * @param properties
- * @private
- */
- public static constructMapProperties(
- properties: InputHelperProperties
- ): Partial {
- let location = properties?.mapProperties?.location
- if (!location) {
- const [lon, lat] = GeoOperations.centerpointCoordinates(properties.feature)
- location = new UIEventSource<{ lon: number; lat: number }>({ lon, lat })
- }
- let mapProperties: Partial = properties?.mapProperties ?? { location }
- if (!mapProperties.location) {
- mapProperties = { ...mapProperties, location }
- }
- let zoom = 17
- if (properties?.args?.[0] !== undefined) {
- zoom = Number(properties.args[0])
- if (isNaN(zoom)) {
- throw "Invalid zoom level for argument at 'length'-input"
- }
- }
- if (!mapProperties.zoom) {
- mapProperties = { ...mapProperties, zoom: new UIEventSource(zoom) }
- }
- if (!mapProperties.rasterLayer) {
- /* mapProperties = {
- ...mapProperties, rasterLayer: properties?.mapProperties?.rasterLayer
- }*/
- }
- return mapProperties
- }
-}
diff --git a/src/UI/InputElement/Validator.ts b/src/UI/InputElement/Validator.ts
index b6cc2f4d4..96703f838 100644
--- a/src/UI/InputElement/Validator.ts
+++ b/src/UI/InputElement/Validator.ts
@@ -1,6 +1,7 @@
import { Translation } from "../i18n/Translation"
import Translations from "../i18n/Translations"
import { HTMLInputTypeAttribute } from "svelte/elements"
+import { ComponentType } from "svelte/types/runtime/internal/dev"
/**
* A 'TextFieldValidator' contains various methods to check and cleanup an entered value or to give feedback.
@@ -21,6 +22,8 @@ export abstract class Validator {
public readonly textArea: boolean
public readonly isMeta?: boolean
+ public readonly inputHelper : ComponentType = undefined
+ public readonly hideInputField: boolean = false
constructor(
name: string,
@@ -80,4 +83,5 @@ export abstract class Validator {
public validateArguments(args: string): undefined | string {
return undefined
}
+
}
diff --git a/src/UI/InputElement/Validators.ts b/src/UI/InputElement/Validators.ts
index 6c830c213..50fa1e52c 100644
--- a/src/UI/InputElement/Validators.ts
+++ b/src/UI/InputElement/Validators.ts
@@ -1,105 +1,114 @@
import { Validator } from "./Validator"
+import FloatValidator from "./Validators/FloatValidator"
import StringValidator from "./Validators/StringValidator"
+import PFloatValidator from "./Validators/PFloatValidator"
import TextValidator from "./Validators/TextValidator"
import DateValidator from "./Validators/DateValidator"
+import { TimeValidator } from "./Validators/TimeValidator"
import NatValidator from "./Validators/NatValidator"
import IntValidator from "./Validators/IntValidator"
-import DistanceValidator from "./Validators/DistanceValidator"
+import PNatValidator from "./Validators/PNatValidator"
import DirectionValidator from "./Validators/DirectionValidator"
import WikidataValidator from "./Validators/WikidataValidator"
-import PNatValidator from "./Validators/PNatValidator"
-import FloatValidator from "./Validators/FloatValidator"
-import PFloatValidator from "./Validators/PFloatValidator"
import EmailValidator from "./Validators/EmailValidator"
import UrlValidator from "./Validators/UrlValidator"
-import PhoneValidator from "./Validators/PhoneValidator"
import OpeningHoursValidator from "./Validators/OpeningHoursValidator"
+import PhoneValidator from "./Validators/PhoneValidator"
import ColorValidator from "./Validators/ColorValidator"
-import SimpleTagValidator from "./Validators/SimpleTagValidator"
import ImageUrlValidator from "./Validators/ImageUrlValidator"
import TagKeyValidator from "./Validators/TagKeyValidator"
-import TranslationValidator from "./Validators/TranslationValidator"
-import FediverseValidator from "./Validators/FediverseValidator"
import IconValidator from "./Validators/IconValidator"
-import TagValidator from "./Validators/TagValidator"
-import IdValidator from "./Validators/IdValidator"
import SlopeValidator from "./Validators/SlopeValidator"
+import CollectionTimesValidator from "./Validators/CollectionTimesValidator"
+import IdValidator from "./Validators/IdValidator"
+import FediverseValidator from "./Validators/FediverseValidator"
+import SimpleTagValidator from "./Validators/SimpleTagValidator"
import VeloparkValidator from "./Validators/VeloparkValidator"
import NameSuggestionIndexValidator from "./Validators/NameSuggestionIndexValidator"
-import CurrencyValidator from "./Validators/CurrencyValidator"
import RegexValidator from "./Validators/RegexValidator"
-import { TimeValidator } from "./Validators/TimeValidator"
-import CollectionTimesValidator from "./Validators/CollectionTimesValidator"
+import CurrencyValidator from "./Validators/CurrencyValidator"
+import TagValidator from "./Validators/TagValidator"
+import TranslationValidator from "./Validators/TranslationValidator"
+import DistanceValidator from "./Validators/DistanceValidator"
-export type ValidatorType = (typeof Validators.availableTypes)[number]
+export const availableValidators = [
+ "color",
+ "currency",
+ "date",
+ "time",
+ "direction",
+ "distance",
+ "email",
+ "fediverse",
+ "float",
+ "icon",
+ "id",
+ "image",
+ "int",
+ "key",
+ "nat",
+ "nsi",
+ "opening_hours",
+ "pfloat",
+ "phone",
+ "pnat",
+ "points_in_time",
+ "regex",
+ "simple_tag",
+ "slope",
+ "string",
+ "tag",
+ "text",
+ "translation",
+ "url",
+ "velopark",
+ "wikidata",
+] as const
+export type ValidatorType = (typeof availableValidators)[number]
export default class Validators {
- public static readonly availableTypes = [
- "color",
- "currency",
- "date",
- "time",
- "direction",
- "distance",
- "email",
- "fediverse",
- "float",
- "icon",
- "id",
- "image",
- "int",
- "key",
- "nat",
- "nsi",
- "opening_hours",
- "pfloat",
- "phone",
- "pnat",
- "points_in_time",
- "regex",
- "simple_tag",
- "slope",
- "string",
- "tag",
- "text",
- "translation",
- "url",
- "velopark",
- "wikidata",
- ] as const
-
+ public static readonly availableTypes = availableValidators
public static readonly AllValidators: ReadonlyArray = [
new StringValidator(),
- new TextValidator(),
- new DateValidator(),
- new TimeValidator(),
- new NatValidator(),
- new IntValidator(),
- new DistanceValidator(),
- new DirectionValidator(),
- new WikidataValidator(),
- new PNatValidator(),
new FloatValidator(),
new PFloatValidator(),
- new EmailValidator(),
- new UrlValidator(),
- new PhoneValidator(),
- new OpeningHoursValidator(),
+ new TextValidator(),
+ new NatValidator(),
+ new PNatValidator(),
+ new IntValidator(),
+ new DateValidator(),
+ new TimeValidator(),
new ColorValidator(),
- new ImageUrlValidator(),
- new SimpleTagValidator(),
- new TagValidator(),
- new TagKeyValidator(),
- new TranslationValidator(),
- new IconValidator(),
- new FediverseValidator(),
- new IdValidator(),
+
+ new DirectionValidator(),
new SlopeValidator(),
- new VeloparkValidator(),
- new NameSuggestionIndexValidator(),
+
+
+ new UrlValidator(),
+ new EmailValidator(),
+ new PhoneValidator(),
+ new FediverseValidator(),
+ new ImageUrlValidator(),
+
+ new OpeningHoursValidator(),
+ new CollectionTimesValidator(),
new CurrencyValidator(),
+
+ new WikidataValidator(),
+
+ new TagKeyValidator(),
+ new IconValidator(),
+ new VeloparkValidator(),
+
+ new IdValidator(),
new RegexValidator(),
- new CollectionTimesValidator()
+ new SimpleTagValidator(),
+ new TranslationValidator(),
+ new TagValidator(),
+
+ new NameSuggestionIndexValidator(),
+
+ new DistanceValidator(),
]
private static _byType = Validators._byTypeConstructor()
diff --git a/src/UI/InputElement/Validators/CollectionTimesValidator.ts b/src/UI/InputElement/Validators/CollectionTimesValidator.ts
index 5847657c8..3fc5ce13d 100644
--- a/src/UI/InputElement/Validators/CollectionTimesValidator.ts
+++ b/src/UI/InputElement/Validators/CollectionTimesValidator.ts
@@ -1,7 +1,12 @@
import StringValidator from "./StringValidator"
+import { ComponentType } from "svelte/types/runtime/internal/dev"
+import CollectionTimes from "../Helpers/CollectionTimes/CollectionTimes.svelte"
export default class CollectionTimesValidator extends StringValidator{
+ public readonly inputHelper: ComponentType = CollectionTimes
constructor() {
super("points_in_time", "'Points in time' are points according to a fixed schedule, e.g. 'every monday at 10:00'. They are typically used for postbox collection times or times of mass at a place of worship")
}
+
+
}
diff --git a/src/UI/InputElement/Validators/ColorValidator.ts b/src/UI/InputElement/Validators/ColorValidator.ts
index 88dd5a893..df984e53e 100644
--- a/src/UI/InputElement/Validators/ColorValidator.ts
+++ b/src/UI/InputElement/Validators/ColorValidator.ts
@@ -1,7 +1,11 @@
import { Validator } from "../Validator"
+import ColorInput from "../Helpers/ColorInput.svelte"
export default class ColorValidator extends Validator {
+ inputHelper = ColorInput
+
constructor() {
super("color", "Shows a color picker")
}
+
}
diff --git a/src/UI/InputElement/Validators/DateValidator.ts b/src/UI/InputElement/Validators/DateValidator.ts
index 340b8159a..5cc02c7c7 100644
--- a/src/UI/InputElement/Validators/DateValidator.ts
+++ b/src/UI/InputElement/Validators/DateValidator.ts
@@ -1,6 +1,10 @@
import { Validator } from "../Validator"
+import DateInput from "../Helpers/DateInput.svelte"
export default class DateValidator extends Validator {
+ public readonly inputHelper = DateInput
+ public readonly hideInputField = true
+
constructor() {
super("date", "A date with date picker")
}
@@ -25,4 +29,5 @@ export default class DateValidator extends Validator {
return [year, month, day].join("-")
}
+
}
diff --git a/src/UI/InputElement/Validators/DirectionValidator.ts b/src/UI/InputElement/Validators/DirectionValidator.ts
index 4cf14d9ad..24719d491 100644
--- a/src/UI/InputElement/Validators/DirectionValidator.ts
+++ b/src/UI/InputElement/Validators/DirectionValidator.ts
@@ -1,6 +1,9 @@
import IntValidator from "./IntValidator"
+import DirectionInput from "../Helpers/DirectionInput.svelte"
export default class DirectionValidator extends IntValidator {
+
+ public readonly inputHelper = DirectionInput
constructor() {
super(
"direction",
diff --git a/src/UI/InputElement/Validators/DistanceValidator.ts b/src/UI/InputElement/Validators/DistanceValidator.ts
index b51130159..ddca39f09 100644
--- a/src/UI/InputElement/Validators/DistanceValidator.ts
+++ b/src/UI/InputElement/Validators/DistanceValidator.ts
@@ -3,6 +3,7 @@ import { Utils } from "../../../Utils"
import { eliCategory } from "../../../Models/RasterLayerProperties"
export default class DistanceValidator extends Validator {
+
private readonly docs: string = [
"#### Helper-arguments",
"Options are:",
@@ -58,4 +59,5 @@ export default class DistanceValidator extends Validator {
}
return undefined
}
+
}
diff --git a/src/UI/InputElement/Validators/ImageUrlValidator.ts b/src/UI/InputElement/Validators/ImageUrlValidator.ts
index 5d9e11507..2d27f1d74 100644
--- a/src/UI/InputElement/Validators/ImageUrlValidator.ts
+++ b/src/UI/InputElement/Validators/ImageUrlValidator.ts
@@ -1,9 +1,11 @@
import UrlValidator from "./UrlValidator"
import { Translation } from "../../i18n/Translation"
+import ImageHelper from "../Helpers/ImageHelper.svelte"
export default class ImageUrlValidator extends UrlValidator {
private static readonly allowedExtensions = ["jpg", "jpeg", "svg", "png"]
public readonly isMeta = true
+ public readonly inputHelper = ImageHelper
constructor() {
super(
@@ -37,4 +39,6 @@ export default class ImageUrlValidator extends UrlValidator {
}
return ImageUrlValidator.hasValidExternsion(str)
}
+
}
+
diff --git a/src/UI/InputElement/Validators/OpeningHoursValidator.ts b/src/UI/InputElement/Validators/OpeningHoursValidator.ts
index 66990aaeb..a296f6cf0 100644
--- a/src/UI/InputElement/Validators/OpeningHoursValidator.ts
+++ b/src/UI/InputElement/Validators/OpeningHoursValidator.ts
@@ -1,7 +1,12 @@
import { Validator } from "../Validator"
import MarkdownUtils from "../../../Utils/MarkdownUtils"
+import { ComponentType } from "svelte/types/runtime/internal/dev"
+import OpeningHoursInput from "../Helpers/OpeningHoursInput.svelte"
export default class OpeningHoursValidator extends Validator {
+
+ public readonly inputHelper= OpeningHoursInput
+
constructor() {
super(
"opening_hours",
@@ -39,4 +44,6 @@ export default class OpeningHoursValidator extends Validator {
].join("\n")
)
}
+
+
}
diff --git a/src/UI/InputElement/Validators/SimpleTagValidator.ts b/src/UI/InputElement/Validators/SimpleTagValidator.ts
index f39ca9d1d..732874f11 100644
--- a/src/UI/InputElement/Validators/SimpleTagValidator.ts
+++ b/src/UI/InputElement/Validators/SimpleTagValidator.ts
@@ -2,12 +2,15 @@ import { Validator } from "../Validator"
import { Translation } from "../../i18n/Translation"
import Translations from "../../i18n/Translations"
import TagKeyValidator from "./TagKeyValidator"
+import SimpleTagInput from "../Helpers/SimpleTagInput.svelte"
/**
* Checks that the input conforms `key=value`, where `key` and `value` don't have too much weird characters
*/
export default class SimpleTagValidator extends Validator {
private static readonly KeyValidator = new TagKeyValidator()
+ public readonly inputHelper = SimpleTagInput
+ public readonly hideInputField = true
public readonly isMeta = true
constructor() {
@@ -50,4 +53,6 @@ export default class SimpleTagValidator extends Validator {
isValid(tag: string, _): boolean {
return this.getFeedback(tag, _) === undefined
}
+
}
+
diff --git a/src/UI/InputElement/Validators/SlopeValidator.ts b/src/UI/InputElement/Validators/SlopeValidator.ts
index 8409fa49b..79e033090 100644
--- a/src/UI/InputElement/Validators/SlopeValidator.ts
+++ b/src/UI/InputElement/Validators/SlopeValidator.ts
@@ -1,6 +1,9 @@
import FloatValidator from "./FloatValidator"
+import SlopeInput from "../Helpers/SlopeInput.svelte"
export default class SlopeValidator extends FloatValidator {
+ public readonly inputHelper =SlopeInput
+
constructor() {
super(
"slope",
@@ -40,4 +43,5 @@ export default class SlopeValidator extends FloatValidator {
}
return super.reformat(str) + lastChar
}
+
}
diff --git a/src/UI/InputElement/Validators/TagValidator.ts b/src/UI/InputElement/Validators/TagValidator.ts
index 8c69dd71d..7900f348f 100644
--- a/src/UI/InputElement/Validators/TagValidator.ts
+++ b/src/UI/InputElement/Validators/TagValidator.ts
@@ -1,11 +1,14 @@
import { Validator } from "../Validator"
import { Translation } from "../../i18n/Translation"
+import TagInput from "../Helpers/TagInput.svelte"
/**
* Checks that the input conforms a JSON-encoded tag expression or a simpleTag`key=value`,
*/
export default class TagValidator extends Validator {
public readonly isMeta = true
+ public readonly inputHelper = TagInput
+ public readonly hideInputField = true
constructor() {
super("tag", "A simple tag of the format `key=value` OR a tagExpression")
@@ -18,4 +21,5 @@ export default class TagValidator extends Validator {
isValid(tag: string, _): boolean {
return this.getFeedback(tag, _) === undefined
}
+
}
diff --git a/src/UI/InputElement/Validators/TimeValidator.ts b/src/UI/InputElement/Validators/TimeValidator.ts
index 867d35226..2d32ada1d 100644
--- a/src/UI/InputElement/Validators/TimeValidator.ts
+++ b/src/UI/InputElement/Validators/TimeValidator.ts
@@ -1,11 +1,15 @@
import { Validator } from "../Validator"
+import TimeInput from "../Helpers/TimeInput.svelte"
export class TimeValidator extends Validator {
- inputmode = "time"
+ public readonly inputmode = "time"
+ public readonly inputHelper = TimeInput
+ public readonly hideInputField = true
constructor() {
super("time", "A time picker")
}
+
}
diff --git a/src/UI/InputElement/Validators/TranslationValidator.ts b/src/UI/InputElement/Validators/TranslationValidator.ts
index f0a602e72..ca51e38c2 100644
--- a/src/UI/InputElement/Validators/TranslationValidator.ts
+++ b/src/UI/InputElement/Validators/TranslationValidator.ts
@@ -1,7 +1,10 @@
import { Validator } from "../Validator"
+import TranslationInput from "../Helpers/TranslationInput.svelte"
export default class TranslationValidator extends Validator {
+ public readonly inputHelper = TranslationInput
public readonly isMeta = true
+ public readonly hideInputField = true
constructor() {
super("translation", "Makes sure the the string is of format `Record` ")
}
@@ -14,4 +17,5 @@ export default class TranslationValidator extends Validator {
return false
}
}
+
}
diff --git a/src/UI/InputElement/Validators/WikidataValidator.ts b/src/UI/InputElement/Validators/WikidataValidator.ts
index acbaf9ffc..58c9c46b5 100644
--- a/src/UI/InputElement/Validators/WikidataValidator.ts
+++ b/src/UI/InputElement/Validators/WikidataValidator.ts
@@ -3,9 +3,11 @@ import { Validator } from "../Validator"
import { Translation } from "../../i18n/Translation"
import Translations from "../../i18n/Translations"
import MarkdownUtils from "../../../Utils/MarkdownUtils"
+import WikidataInputHelper from "../Helpers/WikidataInputHelper.svelte"
export default class WikidataValidator extends Validator {
public static readonly _searchCache = new Map>()
+ public readonly inputHelper = WikidataInputHelper
private static docs = [
"#### Helper arguments",
@@ -182,4 +184,5 @@ Another example is to search for species and trees:
}
return clipped
}
+
}
diff --git a/src/UI/Popup/TagRendering/FreeformInput.svelte b/src/UI/Popup/TagRendering/FreeformInput.svelte
index 23e7bacac..9ca78679e 100644
--- a/src/UI/Popup/TagRendering/FreeformInput.svelte
+++ b/src/UI/Popup/TagRendering/FreeformInput.svelte
@@ -8,8 +8,8 @@
import InputHelper from "../../InputElement/InputHelper.svelte"
import type { Feature } from "geojson"
import { Unit } from "../../../Models/Unit"
- import InputHelpers from "../../InputElement/InputHelpers"
import type { SpecialVisualizationState } from "../../SpecialVisualization"
+ import Validators from "../../InputElement/Validators"
export let value: UIEventSource
export let unvalidatedText: UIEventSource = new UIEventSource(value.data)
@@ -29,6 +29,7 @@
}
const dispatch = createEventDispatcher<{ selected }>()
+ let hideInput = Validators.get(config.freeform.type).hideInputField
export let feedback: UIEventSource
onDestroy(
value.addCallbackD(() => {
@@ -44,6 +45,16 @@
{#if inline}
+ {#if hideInput}
+
+ {:else}
+ {/if}
- {:else if InputHelpers.hideInputField.indexOf(config.freeform.type) < 0}
+ {:else if !hideInput}
{/if}
+ {#if !(inline && hideInput)}
+ {/if}
diff --git a/src/assets/svg/Direction_stroke.svelte b/src/assets/svg/Direction_stroke.svelte
index c6e5a51af..d1d0d8711 100644
--- a/src/assets/svg/Direction_stroke.svelte
+++ b/src/assets/svg/Direction_stroke.svelte
@@ -1,4 +1,4 @@
-
\ No newline at end of file
+
\ No newline at end of file