Add auto icon picker for presets
This commit is contained in:
parent
f67508336a
commit
ca391e948d
11 changed files with 18 additions and 13 deletions
|
@ -30,7 +30,7 @@ export class LayerDefinition {
|
|||
tags: Tag[],
|
||||
title: string | UIElement,
|
||||
description?: string | UIElement,
|
||||
icon: string
|
||||
icon?: string
|
||||
}[]
|
||||
/**
|
||||
* Not really used anymore
|
||||
|
@ -102,7 +102,7 @@ export class LayerDefinition {
|
|||
tags: Tag[],
|
||||
title: string | UIElement,
|
||||
description?: string | UIElement,
|
||||
icon: string
|
||||
icon?: string
|
||||
}[],
|
||||
icon: string,
|
||||
minzoom: number,
|
||||
|
|
|
@ -16,7 +16,6 @@ export class Bookcases extends LayerDefinition {
|
|||
tags: [new Tag("amenity", "public_bookcase")],
|
||||
description: "Add a new bookcase here",
|
||||
title: Translations.t.bookcases.bookcase,
|
||||
icon: "/assets/bookcase.svg"
|
||||
}];
|
||||
this.icon = "./assets/bookcase.svg";
|
||||
this.overpassFilter = new Tag("amenity", "public_bookcase");
|
||||
|
|
|
@ -20,7 +20,6 @@ export class GhostBike extends LayerDefinition {
|
|||
{
|
||||
title: "Ghost bike",
|
||||
description: "Add a missing ghost bike to the map",
|
||||
icon: "/assets/bike/ghost.svg",
|
||||
tags: [new Tag("historic", "memorial"), new Tag("memorial", "ghost_bike")]
|
||||
}
|
||||
]
|
||||
|
|
|
@ -13,12 +13,10 @@ export class InformationBoard extends LayerDefinition {
|
|||
overpassFilter: new Tag("tourism", "information"),
|
||||
presets: [{
|
||||
title: "Informatiebord",
|
||||
icon: "/assets/nature/info.png",
|
||||
tags: [new Tag("tourism", "information")]
|
||||
},
|
||||
{
|
||||
title: "Kaart",
|
||||
icon: "/assets/map.svg",
|
||||
tags: [new Tag("tourism", "information"), new Tag("information", "map")]
|
||||
}],
|
||||
maxAllowedOverlapPercentage: 0,
|
||||
|
|
|
@ -14,7 +14,6 @@ export class Map extends LayerDefinition {
|
|||
this.overpassFilter = new Tag("information", "map");
|
||||
this.presets = [{
|
||||
title: "Map",
|
||||
icon: "/assets/map.svg",
|
||||
tags: [new Tag("tourism", "information"), new Tag("information", "map")]
|
||||
}];
|
||||
|
||||
|
|
|
@ -21,7 +21,6 @@ export class NatureReserves extends LayerDefinition {
|
|||
this.presets = [{
|
||||
title: "Natuurreservaat",
|
||||
description: "Voeg een ontbrekend, erkend natuurreservaat toe, bv. een gebied dat beheerd wordt door het ANB of natuurpunt",
|
||||
icon: undefined,
|
||||
tags: [new Tag("leisure", "nature_reserve"),
|
||||
new Tag("fixme", "Toegevoegd met MapComplete, geometry nog uit te tekenen")]
|
||||
}
|
||||
|
|
|
@ -54,7 +54,6 @@ export class Park extends LayerDefinition {
|
|||
title: "Park",
|
||||
description: "Voeg een ontbrekend park toe. Een park is een groene ruimte die openbaar is." +
|
||||
"Typisch vind je er banken, vuilbakken, standbeelden, ... ",
|
||||
icon: undefined,
|
||||
tags: [new Tag("leisure", "park"),
|
||||
new Tag("fixme", "Toegevoegd met MapComplete, geometry nog uit te tekenen")]
|
||||
}];
|
||||
|
|
|
@ -14,7 +14,6 @@ export class Viewpoint extends LayerDefinition {
|
|||
presets: [{
|
||||
title: "Bezienswaardigheid (andere)",
|
||||
description: "Wens je een foto toe te voegen dat geen park, bos of (erkend) natuurreservaat is? Dit kan hiermee",
|
||||
icon: "/assets/viewpoint.svg",
|
||||
tags: [new Tag("tourism", "viewpoint"),
|
||||
new Tag("fixme", "Added with mapcomplete. This viewpoint should probably me merged with some existing feature")]
|
||||
}],
|
||||
|
|
|
@ -16,14 +16,12 @@ export class Overpass {
|
|||
|
||||
public buildQuery(bbox: string): string {
|
||||
const filters = this._filter.asOverpass()
|
||||
console.log(filters)
|
||||
let filter = ""
|
||||
for (const filterOr of filters) {
|
||||
filter += 'nwr' + filterOr + ';'
|
||||
}
|
||||
const query =
|
||||
'[out:json][timeout:25]' + bbox + ';(' + filter + ');out body;>;out skel qt;'
|
||||
console.log(query)
|
||||
return "https://overpass-api.de/api/interpreter?data=" + encodeURIComponent(query)
|
||||
}
|
||||
|
||||
|
|
|
@ -276,7 +276,8 @@ export class TagUtils {
|
|||
static ApplyTemplate(template: string, tags: any): string {
|
||||
for (const k in tags) {
|
||||
while (template.indexOf("{" + k + "}") >= 0) {
|
||||
template = template.replace("{" + k + "}", tags[k]);
|
||||
const escaped = tags[k].replace(/</g, '<').replace(/>/g, '>');
|
||||
template = template.replace("{" + k + "}", escaped);
|
||||
}
|
||||
}
|
||||
return template;
|
||||
|
|
14
index.ts
14
index.ts
|
@ -214,6 +214,17 @@ for (const layer of layoutToUse.layers) {
|
|||
|
||||
for (const preset of layer.presets) {
|
||||
|
||||
if (preset.icon === undefined) {
|
||||
const tags = {};
|
||||
for (const tag of preset.tags) {
|
||||
const k = tag.key;
|
||||
if (typeof (k) === "string") {
|
||||
tags[k] = tag.value;
|
||||
}
|
||||
}
|
||||
preset.icon = layer.style(tags).icon.iconUrl;
|
||||
}
|
||||
|
||||
const addButton = {
|
||||
name: preset.title,
|
||||
description: preset.description,
|
||||
|
@ -283,6 +294,9 @@ InitUiElements.OnlyIf(featureSwitchAddNew, () => {
|
|||
* This is given to the div which renders fullscreen on mobile devices
|
||||
*/
|
||||
selectedElement.addCallback((feature) => {
|
||||
if (feature?.feature?.properties === undefined) {
|
||||
return;
|
||||
}
|
||||
const data = feature.feature.properties;
|
||||
// Which is the applicable set?
|
||||
for (const layer of layoutToUse.layers) {
|
||||
|
|
Loading…
Reference in a new issue