diff --git a/Customizations/JSON/CustomLayoutFromJSON.ts b/Customizations/JSON/CustomLayoutFromJSON.ts index 973dba1..828681d 100644 --- a/Customizations/JSON/CustomLayoutFromJSON.ts +++ b/Customizations/JSON/CustomLayoutFromJSON.ts @@ -39,6 +39,7 @@ export interface LayerConfigJson { minzoom: number, color: TagRenderingConfigJson; overpassTags: string | string[] | { k: string, v: string }[]; + wayHandling: number, presets: [ { // icon: optional. Uses the layer icon by default @@ -231,7 +232,7 @@ export class CustomLayoutFromJSON { json.id, { description: t(json.description), - name: t(json.title), + name: t(json.title.render), icon: icon, minzoom: json.minzoom, title: tr(json.title), @@ -241,7 +242,7 @@ export class CustomLayoutFromJSON { elementsToShow: [new ImageCarouselWithUploadConstructor()].concat(json.tagRenderings.map(tr)), overpassFilter: new And(tags), - wayHandling: LayerDefinition.WAYHANDLING_CENTER_AND_WAY, + wayHandling: parseInt(json.wayHandling) ?? LayerDefinition.WAYHANDLING_CENTER_AND_WAY, maxAllowedOverlapPercentage: 0, style: CustomLayoutFromJSON.StyleFromJson(json, json.style) } diff --git a/Logic/CustomLayersPanel.ts b/Logic/CustomLayersPanel.ts index e36cc58..455b037 100644 --- a/Logic/CustomLayersPanel.ts +++ b/Logic/CustomLayersPanel.ts @@ -59,9 +59,14 @@ export class CustomLayersPanel extends UIElement { const image = (layer.icon ? `` : Img.checkmark); const noimage = (layer.icon ? `` : Img.no_checkmark); + let name = layer.name; + if(typeof (name) !== "string"){ + name = name.InnerRender(); + } + const content = new Combine([ "", - "", layer.name ?? "", " ", + "", name ?? "", " ", layer.description !== undefined ? new Combine(["
", layer.description]) : "", ""]) const cb = new CheckBox( diff --git a/Logic/Osm/OsmConnection.ts b/Logic/Osm/OsmConnection.ts index 00234a0..755e678 100644 --- a/Logic/Osm/OsmConnection.ts +++ b/Logic/Osm/OsmConnection.ts @@ -313,11 +313,12 @@ export class OsmConnection { ``, ``, ``, - layout.maintainer !== undefined ? `` : "", + layout.maintainer !== undefined ? `` : "", ``].join("") }, function (err, response) { if (response === undefined) { console.log("err", err); + alert("Could not upload change (opening failed). Please file a bug report") return; } else { continuation(response); diff --git a/State.ts b/State.ts index 3e2288c..137603c 100644 --- a/State.ts +++ b/State.ts @@ -24,7 +24,7 @@ export class State { // The singleton of the global state public static state: State; - public static vNumber = "0.0.5"; + public static vNumber = "0.0.5b"; public static runningFromConsole: boolean = false; diff --git a/UI/CustomThemeGenerator/ThemeGenerator.ts b/UI/CustomThemeGenerator/ThemeGenerator.ts index 9304d8a..620a959 100644 --- a/UI/CustomThemeGenerator/ThemeGenerator.ts +++ b/UI/CustomThemeGenerator/ThemeGenerator.ts @@ -17,6 +17,7 @@ import {TextField, ValidatedTextField} from "../Input/TextField"; import {Tag} from "../../Logic/TagsFilter"; import {DropDown} from "../Input/DropDown"; import {TagRendering} from "../../Customizations/TagRendering"; +import {LayerDefinition} from "../../Customizations/LayerDefinition"; TagRendering.injectFunction(); @@ -267,9 +268,13 @@ class LayerGenerator extends UIElement { }), createFieldUI("The tags to load from overpass", "overpassTags", layerConfig, { type: "tags", - description: "Tags to load from overpass. The format is key=value&key0=value0&key1=value1, e.g. amenity=public_bookcase or amenity=compressed_air&bicycle=yes. Note that a wildcard is supported, e.g. key=*" + description: "Tags to load from overpass. The format is key=value&key0=value0&key1=value1, e.g. amenity=public_bookcase or amenity=compressed_air&bicycle=yes. Note that a wildcard is supported, e.g. key=* to have everything. An missing tag can be expressed as key=, not as key!=value. E.g. something that is indoor and not private and has no name tag can be queried as indoor=yes&name=&access!=private" }), + createFieldUI("Wayhandling","wayHandling", layerConfig, { + type:"wayhandling", + description: "Specifies how ways (lines and areas) are handled: either the way is shown, a center point is shown or both" + }), new TagRenderingGenerator(fullConfig, layerConfig, layerConfig.title ?? { key: "", @@ -415,6 +420,7 @@ class AllLayerComponent extends UIElement { description: "", minzoom: 12, overpassTags: "", + wayHandling: LayerDefinition.WAYHANDLING_CENTER_AND_WAY, presets: [{}], tagRenderings: [] }); @@ -490,6 +496,22 @@ export class ThemeGenerator extends UIElement { textField = new DropDown("", options, value) + } else if (options.type === "wayhandling") { + const options: { value: string, shown: string | UIElement }[] = + [{value: "" + LayerDefinition.WAYHANDLING_DEFAULT, shown: "Show a line/area as line/area"}, + { + value: "" + LayerDefinition.WAYHANDLING_CENTER_AND_WAY, + shown: "Show a line/area as line/area AND show an icon at the center" + }, + { + value: "" + LayerDefinition.WAYHANDLING_CENTER_ONLY, + shown: "Only show the centerpoint of a way" + }]; + + textField = new DropDown("", + options, + value) + } else if (options.type === "tags") { textField = ValidatedTextField.TagTextField(value.map(CustomLayoutFromJSON.TagsFromJson, [], tags => { if (tags === undefined) { diff --git a/UI/ImageUploadFlow.ts b/UI/ImageUploadFlow.ts index 1852381..e75d82e 100644 --- a/UI/ImageUploadFlow.ts +++ b/UI/ImageUploadFlow.ts @@ -58,7 +58,7 @@ export class ImageUploadFlow extends UIElement { } if (!State.state.osmConnection.userDetails.data.loggedIn) { - return `
${t.pleaseLogin.Render()}
`; + return t.pleaseLogin.Render(); } let currentState: UIElement[] = []; @@ -78,7 +78,7 @@ export class ImageUploadFlow extends UIElement { let currentStateHtml = ""; if (currentState.length > 0) { - currentStateHtml = new VerticalCombine(currentState).Render(); + currentStateHtml = new Combine(currentState).Render(); if (!this._allDone.data) { currentStateHtml = "" + currentStateHtml + diff --git a/UI/ShareScreen.ts b/UI/ShareScreen.ts index ebaacc2..7a5a036 100644 --- a/UI/ShareScreen.ts +++ b/UI/ShareScreen.ts @@ -93,12 +93,12 @@ export class ShareScreen extends UIElement { const switches = [{urlName: "fs-userbadge", human: "Enable the login-button"}, - {urlName: "fs-search", human: "Enable search bar"}, + {urlName: "fs-search", human: "Enable the search bar"}, {urlName: "fs-welcome-message", human: "Enable the welcome message"}, - {urlName: "fs-layers", human: "Enable layer control"}, + {urlName: "fs-layers", human: "Enable thelayer control"}, + {urlName: "layer-control-toggle", human: "Start with the layer control expanded", reverse:true}, {urlName: "fs-add-new", human: "Enable the 'add new POI' button"}, {urlName: "fs-geolocation", human: "Enable the 'geolocate-me' button"}, - {urlName: "layer-control-toggle", human: "Start with the layer control expanded", reverse:true} ] diff --git a/assets/themes/cyclestreets/cyclestreets.json b/assets/themes/cyclestreets/cyclestreets.json new file mode 100644 index 0000000..859f84d --- /dev/null +++ b/assets/themes/cyclestreets/cyclestreets.json @@ -0,0 +1,32 @@ +{ + "layers": [ + { + "id": "Fietsstraat", + "title": { + "render": "{name}", + "key": "name" + }, + "icon": { + "key": "" + }, + "color": { + "key": "", + "render": "#0000ff" + }, + "description": "Een fietsstraat is een straat", + "minzoom": "13", + "presets": [], + "tagRenderings": [], + "overpassTags": "cyclestreet=yes" + } + ], + "language": "nl", + "startLat": "51.2095", + "startZoom": "14", + "maintainer": "Not logged in", + "name": "Fietsstraten", + "title": "Fietsstraten", + "startLon": "3.2228", + "icon": "https://upload.wikimedia.org/wikipedia/commons/thumb/6/6c/Belgian_road_sign_F111.svg/400px-Belgian_road_sign_F111.svg.png", + "description": "Een fietsstraat is een straat waar automobilisten geen fietsers mogen inhalen en waar een maximumsnelheid van 30km/h geldt. " +} \ No newline at end of file diff --git a/index.css b/index.css index ad63471..80d05f7 100644 --- a/index.css +++ b/index.css @@ -1155,8 +1155,10 @@ form { .tab-single-header img { height: 3em; - width: 3em; + max-width: 3em; padding: 0.5em; + display:block; + margin:auto; } @@ -1181,6 +1183,7 @@ form { z-index: 5001; box-shadow: 0 0 10px black; border: 1px solid white; + min-width: 4em; } .tab-non-active {