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

refactoring: move logic of lastclick into special layer, fix labels, fix anchoring

Browse source
This commit is contained in:
Pieter Vander Vennet 2023-04-02 02:59:20 +02:00
parent 25a98af057
commit 52a0810ea9
47 changed files with 682 additions and 197 deletions
Download patch file Download diff file Expand all files Collapse all files

12
Models/ThemeConfig/Conversion/FixImages.ts
View file

@ -5,6 +5,7 @@ import metapaths from "../../../assets/layoutconfigmeta.json"
import tagrenderingmetapaths from "../../../assets/questionabletagrenderingconfigmeta.json"
import Translations from "../../../UI/i18n/Translations"
import { parse as parse_html } from "node-html-parser"
export class ExtractImages extends Conversion<
LayoutConfigJson,
{ path: string; context: string }[]
@ -190,6 +191,17 @@ export class ExtractImages extends Conversion<
const cleanedImages: { path: string; context: string }[] = []
for (const foundImage of allFoundImages) {
if (foundImage.path.startsWith("<") && foundImage.path.endsWith(">")) {
// These is probably html - we ignore
const doc = parse_html(foundImage.path)
const images = Array.from(doc.getElementsByTagName("img"))
const paths = images.map((i) => i.getAttribute("src"))
cleanedImages.push(
...paths.map((path) => ({ path, context: foundImage.context + " (in html)" }))
)
continue
}
// Split "circle:white;./assets/layers/.../something.svg" into ["circle", "./assets/layers/.../something.svg"]
const allPaths = Utils.NoNull(
Utils.NoEmpty(foundImage.path?.split(";")?.map((part) => part.split(":")[0]))

9
Models/ThemeConfig/Conversion/Validation.ts
View file

@ -101,6 +101,11 @@ export class DoesImageExist extends DesugaringStep<string> {
}
}
if (image.startsWith("<") && image.endsWith(">")) {
// This is probably HTML, you're on your own here
return { result: image }
}
if (!this._knownImagePaths.has(image)) {
if (this.doesPathExist === undefined) {
errors.push(
@ -730,9 +735,9 @@ export class ValidateLayer extends DesugaringStep<LayerConfigJson> {
}
}
if (json.minzoom > Constants.userJourney.minZoomLevelToAddNewPoints) {
if (json.minzoom > Constants.minZoomLevelToAddNewPoint) {
;(json.presets?.length > 0 ? errors : warnings).push(
`At ${context}: minzoom is ${json.minzoom}, this should be at most ${Constants.userJourney.minZoomLevelToAddNewPoints} as a preset is set. Why? Selecting the pin for a new item will zoom in to level before adding the point. Having a greater minzoom will hide the points, resulting in possible duplicates`
`At ${context}: minzoom is ${json.minzoom}, this should be at most ${Constants.minZoomLevelToAddNewPoint} as a preset is set. Why? Selecting the pin for a new item will zoom in to level before adding the point. Having a greater minzoom will hide the points, resulting in possible duplicates`
)
}
{

14
Models/ThemeConfig/Json/PointRenderingConfigJson.ts
View file

@ -69,15 +69,25 @@ export default interface PointRenderingConfigJson {
label?: string | TagRenderingConfigJson
/**
* A snippet of css code
* A snippet of css code which is applied onto the container of the entire marker
*/
css?: string | TagRenderingConfigJson
/**
* A snippet of css-classes. They can be space-separated
* A snippet of css-classes which are applied onto the container of the entire marker. They can be space-separated
*/
cssClasses?: string | TagRenderingConfigJson
/**
* Css that is applied onto the label
*/
labelCss?: string | TagRenderingConfigJson
/**
* Css classes that are applied onto the label; can be space-separated
*/
labelCssClasses?: string | TagRenderingConfigJson
/**
* If the map is pitched, the marker will stay parallel to the screen.
* Set to 'map' if you want to put it flattened on the map

10
Models/ThemeConfig/LayerConfig.ts
View file

@ -30,6 +30,7 @@ import { FixedUiElement } from "../../UI/Base/FixedUiElement"
import Svg from "../../Svg"
import { ImmutableStore } from "../../Logic/UIEventSource"
import { OsmTags } from "../OsmFeature"
import Constants from "../Constants"
export default class LayerConfig extends WithContextLoader {
public static readonly syncSelectionAllowed = ["no", "local", "theme-only", "global"] as const
@ -322,7 +323,8 @@ export default class LayerConfig extends WithContextLoader {
} else if (
!hasCenterRendering &&
this.lineRendering.length === 0 &&
!this.source.geojsonSource?.startsWith(
Constants.priviliged_layers.indexOf(<any>this.id) < 0 &&
!this.source?.geojsonSource?.startsWith(
"https://api.openstreetmap.org/api/0.6/notes.json"
)
) {
@ -425,8 +427,10 @@ export default class LayerConfig extends WithContextLoader {
return mapRendering.GetBaseIcon(this.GetBaseTags())
}
public GetBaseTags(): any {
return TagUtils.changeAsProperties(this.source.osmTags.asChange({ id: "node/-1" }))
public GetBaseTags(): Record<string, string> {
return TagUtils.changeAsProperties(
this.source?.osmTags?.asChange({ id: "node/-1" }) ?? [{ k: "id", v: "node/-1" }]
)
}
public GenerateDocumentation(

36
Models/ThemeConfig/PointRenderingConfig.ts
View file

@ -11,6 +11,7 @@ import { FixedUiElement } from "../../UI/Base/FixedUiElement"
import Img from "../../UI/Base/Img"
import Combine from "../../UI/Base/Combine"
import { VariableUiElement } from "../../UI/Base/VariableUIElement"
import { html } from "svelte/types/compiler/utils/namespaces"
export default class PointRenderingConfig extends WithContextLoader {
private static readonly allowed_location_codes = new Set<string>([
@ -28,6 +29,8 @@ export default class PointRenderingConfig extends WithContextLoader {
public readonly iconBadges: { if: TagsFilter; then: TagRenderingConfig }[]
public readonly iconSize: TagRenderingConfig
public readonly label: TagRenderingConfig
public readonly labelCss: TagRenderingConfig
public readonly labelCssClasses: TagRenderingConfig
public readonly rotation: TagRenderingConfig
public readonly cssDef: TagRenderingConfig
public readonly cssClasses?: TagRenderingConfig
@ -72,6 +75,8 @@ export default class PointRenderingConfig extends WithContextLoader {
this.cssDef = this.tr("css", undefined)
}
this.cssClasses = this.tr("cssClasses", undefined)
this.labelCss = this.tr("labelCss", undefined)
this.labelCssClasses = this.tr("labelCssClasses", undefined)
this.iconBadges = (json.iconBadges ?? []).map((overlay, i) => {
return {
if: TagUtils.Tag(overlay.if),
@ -150,7 +155,7 @@ export default class PointRenderingConfig extends WithContextLoader {
}
}
public GetBaseIcon(tags?: any): BaseUIElement {
public GetBaseIcon(tags?: Record<string, string>): BaseUIElement {
tags = tags ?? { id: "node/-1" }
let defaultPin: BaseUIElement = undefined
if (this.label === undefined) {
@ -168,6 +173,10 @@ export default class PointRenderingConfig extends WithContextLoader {
// This layer doesn't want to show an icon right now
return undefined
}
if (htmlDefs.startsWith("<") && htmlDefs.endsWith(">")) {
// This is probably already prepared HTML
return new FixedUiElement(Utils.SubstituteKeys(htmlDefs, tags))
}
return PointRenderingConfig.FromHtmlMulti(htmlDefs, rotation, false, defaultPin)
}
@ -225,10 +234,10 @@ export default class PointRenderingConfig extends WithContextLoader {
}
if (mode === "top") {
anchorH = -iconH / 2
anchorH = iconH / 2
}
if (mode === "bottom") {
anchorH = iconH / 2
anchorH = -iconH / 2
}
const icon = this.GetSimpleIcon(tags)
@ -244,10 +253,11 @@ export default class PointRenderingConfig extends WithContextLoader {
iconAndBadges.SetClass("w-full h-full")
}
const css = this.cssDef?.GetRenderValue(tags)?.txt
const cssClasses = this.cssClasses?.GetRenderValue(tags)?.txt
const css = this.cssDef?.GetRenderValue(tags.data)?.txt
const cssClasses = this.cssClasses?.GetRenderValue(tags.data)?.txt
let label = this.GetLabel(tags)
let htmlEl: BaseUIElement
if (icon === undefined && label === undefined) {
htmlEl = undefined
@ -288,6 +298,12 @@ export default class PointRenderingConfig extends WithContextLoader {
badge.then.GetRenderValue(tags)?.txt,
tags
)
if (htmlDefs.startsWith("<") && htmlDefs.endsWith(">")) {
// This is probably an HTML-element
return new FixedUiElement(Utils.SubstituteKeys(htmlDefs, tags))
.SetStyle("width: 1.5rem")
.SetClass("block")
}
const badgeElement = PointRenderingConfig.FromHtmlMulti(
htmlDefs,
"0",
@ -308,14 +324,20 @@ export default class PointRenderingConfig extends WithContextLoader {
if (this.label === undefined) {
return undefined
}
const cssLabel = this.labelCss?.GetRenderValue(tags.data)?.txt
const cssClassesLabel = this.labelCssClasses?.GetRenderValue(tags.data)?.txt
const self = this
return new VariableUiElement(
tags.map((tags) => {
const label = self.label
?.GetRenderValue(tags)
?.Subs(tags)
?.SetClass("block text-center")
return new Combine([label]).SetClass("flex flex-col items-center mt-1")
?.SetClass("block center absolute text-center ")
?.SetClass(cssClassesLabel)
if (cssLabel) {
label.SetStyle(cssLabel)
}
return new Combine([label]).SetClass("flex flex-col items-center")
})
)
}