diff --git a/Customizations/Layers/BikeParkings.ts b/Customizations/Layers/BikeParkings.ts index ccd737e..84c293e 100644 --- a/Customizations/Layers/BikeParkings.ts +++ b/Customizations/Layers/BikeParkings.ts @@ -10,7 +10,7 @@ import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWi export default class BikeParkings extends LayerDefinition { constructor() { super(); - this.name = "bike_parking"; + this.name = "bike parking"; this.icon = "./assets/bike/parking.svg"; this.overpassFilter = new Tag("amenity", "bicycle_parking"); this.newElementTags = [ @@ -20,10 +20,10 @@ export default class BikeParkings extends LayerDefinition { this.minzoom = 13; this.style = this.generateStyleFunction(); - this.title = new FixedText("Fietsparking"); + this.title = new FixedText("Bicycle parking"); this.elementsToShow = [ new ImageCarouselWithUploadConstructor(), - new OperatorTag(), + // new OperatorTag(), new ParkingType() ]; @@ -36,7 +36,8 @@ export default class BikeParkings extends LayerDefinition { color: "#00bb00", icon: L.icon({ iconUrl: self.icon, - iconSize: [50, 50] + iconSize: [50, 50], + iconAnchor: [25,50] }) }; }; diff --git a/Customizations/Layers/BikeShop.ts b/Customizations/Layers/BikeShop.ts new file mode 100644 index 0000000..3e4413a --- /dev/null +++ b/Customizations/Layers/BikeShop.ts @@ -0,0 +1,112 @@ +import {TagRenderingOptions} from "../TagRendering"; +import {LayerDefinition} from "../LayerDefinition"; +import {Tag} from "../../Logic/TagsFilter"; +import L from "leaflet"; +import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWithUpload"; +import {NameQuestion} from "../Questions/NameQuestion"; + +export class BikeShop extends LayerDefinition { + + + private readonly sellsBikes = new Tag("service:bicycle:retail", "yes"); + private readonly repairsBikes = new Tag("service:bicycle:repair", "yes"); + + constructor() { + super( + { + name: "bike shop or repair", + icon: "assets/bike/repair_shop.svg", + minzoom: 14, + overpassFilter: new Tag("shop", "bicycle"), + newElementTags: [new Tag("shop", "bicycle")] + } + ); + + this.title = new TagRenderingOptions({ + mappings: [ + {k: this.sellsBikes, txt: "Bicycle shop"}, + {k: new Tag("service:bicycle:retail", "no"), txt: "Bicycle repair"}, + {k: new Tag("service:bicycle:retail", ""), txt: "Bicycle repair/shop"}, + ] + }) + + + this.elementsToShow = [ + new ImageCarouselWithUploadConstructor(), + new TagRenderingOptions({ + question: "What is the name of this bicycle shop?", + freeform: { + key: "name", + renderTemplate: "The name of this bicycle shop is {name}", + template: "The name of this bicycle shop is $$$" + } + }), + + new TagRenderingOptions({ + question: "Can one buy a bike here?", + mappings: [ + {k: this.sellsBikes, txt: "Bikes are sold here"}, + {k: new Tag("service:bicycle:retail", "no"), txt: "No bikes are sold here"}, + ] + }), + + new TagRenderingOptions({ + question: "Can one buy a new bike here?", + mappings: [ + {k: new Tag("service:bicycle:second_hand", "yes"), txt: "Second-hand bikes are sold here"}, + {k: new Tag("service:bicycle:second_hand", "only"), txt: "All bicycles sold here are second-hand"}, + {k: new Tag("service:bicycle:second_hand", "no"), txt: "Only brand new bikes are sold here"}, + ] + }).OnlyShowIf(this.sellsBikes), + + + new TagRenderingOptions({ + question: "Does this shop repair bicycles?", + mappings: [ + {k: this.repairsBikes, txt: "Bikes are repaired here, by the shop owner (for a fee)"}, + {k: new Tag("service:bicycle:repair", "only_sold"), txt: "Only bikes that were bought here, are repaired"}, + {k: new Tag("service:bicycle:repair", "brand"), txt: "Only bikes of a fixed brand are repaired here"}, + {k: new Tag("service:bicycle:repair", "no"), txt: "Bikes are not repaired here"}, + ] + }), + + new TagRenderingOptions({ + question: "Can one hire a new bike here?", + mappings: [ + {k: new Tag("service:bicycle:rental", "yes"), txt: "Bikes can be rented here"}, + {k: new Tag("service:bicycle:rental", "no"), txt: "Bikes cannot be rented here"}, + ] + }).OnlyShowIf(this.sellsBikes), + + new TagRenderingOptions({ + question: "Are there tools here so that one can repair their own bike?", + mappings: [ + {k: new Tag("service:bicycle:diy", "yes"), txt: "Tools for DIY are available here"}, + {k: new Tag("service:bicycle:diy", "no"), txt: "No tools for DIY are available here"}, + ] + }), + ] + + + this.style = (tags) => { + let icon = "assets/bike/repair_shop.svg"; + + if (this.sellsBikes.matchesProperties(tags)) { + icon = "assets/bike/shop.svg"; + } + + return { + color: "#ff0000", + icon: L.icon({ + iconUrl: icon, + iconSize: [50, 50], + iconAnchor: [25, 50] + }) + } + } + + + } + + +} \ No newline at end of file diff --git a/Customizations/Layers/BikeStations.ts b/Customizations/Layers/BikeStations.ts index 89f79b3..5af8cfd 100644 --- a/Customizations/Layers/BikeStations.ts +++ b/Customizations/Layers/BikeStations.ts @@ -73,14 +73,19 @@ export default class BikeStations extends LayerDefinition { } } } else { - iconName = "repair_station.svg" + if (!self.pump.matchesProperties(properties)) { + iconName = "repair_station.svg" + } else { + iconName = "repair_station.svg" + } } const iconUrl = `./assets/bike/${iconName}` return { color: "#00bb00", icon: L.icon({ iconUrl: iconUrl, - iconSize: [50, 50] + iconSize: [50, 50], + iconAnchor: [25,50] }) }; }; diff --git a/Customizations/Layers/DrinkingWater.ts b/Customizations/Layers/DrinkingWater.ts index 92e6338..7bdd632 100644 --- a/Customizations/Layers/DrinkingWater.ts +++ b/Customizations/Layers/DrinkingWater.ts @@ -10,8 +10,8 @@ export class DrinkingWater extends LayerDefinition { constructor() { super(); - this.name = "drinking_water"; - this.icon = "./assets/bug.svg"; + this.name = "drinking water"; + this.icon = "./assets/bike/drinking_water.svg"; this.overpassFilter = new Or([ new And([ @@ -52,7 +52,8 @@ export class DrinkingWater extends LayerDefinition { color: "#00bb00", icon: new L.icon({ iconUrl: self.icon, - iconSize: [40, 40] + iconSize: [50, 50], + iconAnchor: [25,50] }) }; }; diff --git a/Customizations/Layouts/Cyclofix.ts b/Customizations/Layouts/Cyclofix.ts index 548981b..dfc35d0 100644 --- a/Customizations/Layouts/Cyclofix.ts +++ b/Customizations/Layouts/Cyclofix.ts @@ -2,7 +2,8 @@ import {Layout} from "../Layout"; import BikeParkings from "../Layers/BikeParkings"; import BikeServices from "../Layers/BikeStations"; import {GhostBike} from "../Layers/GhostBike"; -import {DrinkingWater, DrinkingWaterLayer} from "../Layers/DrinkingWater"; +import {DrinkingWater} from "../Layers/DrinkingWater"; +import {BikeShop} from "../Layers/BikeShop"; export default class Cyclofix extends Layout { @@ -10,7 +11,7 @@ export default class Cyclofix extends Layout { super( "pomp", "Cyclofix bicycle infrastructure", - [new GhostBike(), new BikeServices(), new BikeParkings(), new DrinkingWater()], + [new BikeServices(), new BikeShop(), new DrinkingWater(), new BikeParkings()], 16, 50.8465573, 4.3516970, diff --git a/Customizations/Questions/bike/StationOperator.ts b/Customizations/Questions/bike/StationOperator.ts index 001f920..56b00eb 100644 --- a/Customizations/Questions/bike/StationOperator.ts +++ b/Customizations/Questions/bike/StationOperator.ts @@ -18,7 +18,7 @@ export default class BikeStationOperator extends TagRenderingOptions { {k: new Tag("operator", "Stad Halle"), txt: "Stad Halle"}, {k: new Tag("operator", "Saint Gilles - Sint Gillis"), txt: "Saint Gilles - Sint Gillis"}, {k: new Tag("operator", "Jette"), txt: "Jette"}, - {k: new Tag("operator", "private"), txt: "Beheer door een privépersoon"} + {k: new Tag("operator", "private"), txt: "Operated by a private individual"} ] }); } diff --git a/Customizations/Questions/bike/StationPumpTools.ts b/Customizations/Questions/bike/StationPumpTools.ts index be81c8b..532f24c 100644 --- a/Customizations/Questions/bike/StationPumpTools.ts +++ b/Customizations/Questions/bike/StationPumpTools.ts @@ -6,7 +6,7 @@ export default class BikeStationPumpTools extends TagRenderingOptions { constructor() { super({ priority: 15, - question: "Which services are available at this bike station?", + question: "Which services are available here?", mappings: [ {k: new And([new Tag("service:bicycle:tools", "no"), new Tag("service:bicycle:pump", "yes")]), txt: "There is only a pump available."}, {k: new And([new Tag("service:bicycle:tools", "yes"), new Tag("service:bicycle:pump", "no")]), txt: "There are only tools (screwdrivers, pliers...) available."}, diff --git a/Customizations/TagRendering.ts b/Customizations/TagRendering.ts index 5f45a26..a0e6749 100644 --- a/Customizations/TagRendering.ts +++ b/Customizations/TagRendering.ts @@ -270,9 +270,9 @@ class TagRendering extends UIElement implements TagDependantUIElement { const cancelContents = this._editMode.map((isEditing) => { if (isEditing) { - return "Annuleren"; + return "Cancel"; } else { - return "Overslaan (Ik weet het niet zeker...)"; + return "Skip this question"; } }); // And at last, set up the skip button diff --git a/Logic/StrayClickHandler.ts b/Logic/StrayClickHandler.ts index 85ccc9d..89acbcc 100644 --- a/Logic/StrayClickHandler.ts +++ b/Logic/StrayClickHandler.ts @@ -32,15 +32,16 @@ export class StrayClickHandler { self._lastMarker = L.marker([lastClick.lat, lastClick.lon]); const uiElement = uiToShow(); const popup = L.popup().setContent(uiElement.Render()); - uiElement.Activate(); uiElement.Update(); + uiElement.Activate(); self._lastMarker.addTo(map); self._lastMarker.bindPopup(popup).openPopup(); self._lastMarker.on("click", () => { leftMessage.setData(self._uiToShow); }); - + uiElement.Update(); + uiElement.Activate(); }); selectElement.addCallback(() => { diff --git a/UI/Base/CheckBox.ts b/UI/Base/CheckBox.ts new file mode 100644 index 0000000..9cdb21e --- /dev/null +++ b/UI/Base/CheckBox.ts @@ -0,0 +1,19 @@ +import {UIElement} from "../UIElement"; +import {UIEventSource} from "../UIEventSource"; + + +export class CheckBox extends UIElement{ + private data: UIEventSource; + + constructor(data: UIEventSource) { + super(data); + this.data = data; + + } + + + protected InnerRender(): string { + return "Current val: "+this.data.data; + } + +} \ No newline at end of file diff --git a/UI/CenterMessageBox.ts b/UI/CenterMessageBox.ts index 8bbb7a0..a5cd8b6 100644 --- a/UI/CenterMessageBox.ts +++ b/UI/CenterMessageBox.ts @@ -40,11 +40,11 @@ export class CenterMessageBox extends UIElement { return this._centermessage.data; } if (this._queryRunning.data) { - return "Data wordt geladen..."; + return "Data is loading..."; } else if (this._zoomInMore.data) { - return "Zoom in om de data te zien en te bewerken"; + return "Zoom in more to see the data"; } - return "Klaar!"; + return "Done!"; } diff --git a/UI/Image/ImageCarousel.ts b/UI/Image/ImageCarousel.ts index 9d4e1fd..b3f40d8 100644 --- a/UI/Image/ImageCarousel.ts +++ b/UI/Image/ImageCarousel.ts @@ -23,10 +23,10 @@ export class ImageCarouselConstructor implements TagDependantUIElementConstructo return 0; } - construct(tags: UIEventSource, changes: Changes): TagDependantUIElement { - return new ImageCarousel(tags, changes); + construct(dependencies: { tags: UIEventSource, changes: Changes }): TagDependantUIElement { + return new ImageCarousel(dependencies.tags, dependencies.changes); } - + } export class ImageCarousel extends TagDependantUIElement { diff --git a/UI/ImageUploadFlow.ts b/UI/ImageUploadFlow.ts index 5a55f53..3d0f633 100644 --- a/UI/ImageUploadFlow.ts +++ b/UI/ImageUploadFlow.ts @@ -9,7 +9,6 @@ import {VariableUiElement} from "./Base/VariableUIElement"; export class ImageUploadFlow extends UIElement { private _licensePicker: UIElement; private _selectedLicence: UIEventSource; - private _licenseExplanation: UIElement; private _isUploading: UIEventSource = new UIEventSource(0) private _uploadOptions: (license: string) => { title: string; description: string; handleURL: (url: string) => void; allDone: (() => void) }; private _userdetails: UIEventSource; @@ -31,12 +30,11 @@ export class ImageUploadFlow extends UIElement { this._uploadOptions = uploadOptions; this.ListenTo(this._isUploading); - const licensePicker = new DropDown("Jouw foto wordt gepubliceerd ", - + const licensePicker = new DropDown("The picture is published ", [ - {value: "CC0", shown: "in het publiek domein"}, - {value: "CC-BY-SA 4.0", shown: "onder een CC-BY-SA-licentie"}, - {value: "CC-BY 4.0", shown: "onder een CC-BY-licentie"} + {value: "CC0", shown: "in the public domain"}, + {value: "CC-BY-SA 4.0", shown: "with a CC-BY-SA license"}, + {value: "CC-BY 4.0", shown: "with a CC-BY license"} ], preferedLicense ); @@ -44,48 +42,37 @@ export class ImageUploadFlow extends UIElement { this._selectedLicence = licensePicker.GetValue(); - const licenseExplanations = { - "CC-BY-SA 4.0": - "Creative Commonse met naamsvermelding en gelijk delen
" + - "Je foto mag door iedereen gratis gebruikt worden, als ze je naam vermelden én ze afgeleide werken met deze licentie en attributie delen.", - "CC-BY 4.0": - "Creative Commonse met naamsvermelding
" + - "Je foto mag door iedereen gratis gebruikt worden, als ze je naam vermelden", - "CC0": - "Geen copyright
Je foto mag door iedereen voor alles gebruikt worden" - } - this._licenseExplanation = new VariableUiElement( - this._selectedLicence.map((license) => { - return licenseExplanations[license] - }) - ); } InnerRender(): string { if (!this._userdetails.data.loggedIn) { - return "
Gelieve je aan te melden om een foto toe te voegen of vragen te beantwoorden
"; + return "
Please log in to add a picture
"; } + + let uploadingMessage = ""; if (this._isUploading.data == 1) { - return "Bezig met een foto te uploaden..." + uploadingMessage = "Uploading a picture..." } if (this._isUploading.data > 0) { - return "Bezig met uploaden, nog " + this._isUploading.data + " foto's te gaan..." + uploadingMessage = "Uploading multiple pictures, " + this._isUploading.data + " left..." } return "" + "
" + - + "" + "("

Naar de kaart

"), + new VariableUiElement(new UIEventSource("

Return to the map

"), () => { document.getElementById("to-the-map").onclick = function () { uielement.setData(undefined); diff --git a/UI/SaveButton.ts b/UI/SaveButton.ts index 60d8bda..23065ff 100644 --- a/UI/SaveButton.ts +++ b/UI/SaveButton.ts @@ -19,7 +19,7 @@ export class SaveButton extends UIElement { ) { return "Opslaan" } - return "Opslaan"; + return "Save"; } } \ No newline at end of file diff --git a/UI/SearchAndGo.ts b/UI/SearchAndGo.ts index 918bdb3..679764e 100644 --- a/UI/SearchAndGo.ts +++ b/UI/SearchAndGo.ts @@ -9,7 +9,7 @@ import {VariableUiElement} from "./Base/VariableUIElement"; export class SearchAndGo extends UIElement { - private _placeholder = new UIEventSource("Zoek naar een locatie...") + private _placeholder = new UIEventSource("Search a location...") private _searchField = new TextField({ placeholder: new VariableUiElement(this._placeholder), fromString: str => str, @@ -41,7 +41,7 @@ export class SearchAndGo extends UIElement { private RunSearch() { const searchString = this._searchField.GetValue().data; this._searchField.Clear(); - this._placeholder.setData("Bezig met zoeken..."); + this._placeholder.setData("Searching..."); const self = this; Geocoding.Search(searchString, this._map, (result) => { @@ -56,10 +56,10 @@ export class SearchAndGo extends UIElement { [bb[1], bb[3]] ] self._map.map.fitBounds(bounds); - this._placeholder.setData("Zoek naar een locatie..."); + this._placeholder.setData("Search a location..."); }, () => { - this._placeholder.setData("Niets gevonden: er ging iets mis"); + this._placeholder.setData("Something went wrong. Try again."); }); } diff --git a/UI/SimpleAddUI.ts b/UI/SimpleAddUI.ts index 956569b..2aa3e0e 100644 --- a/UI/SimpleAddUI.ts +++ b/UI/SimpleAddUI.ts @@ -42,7 +42,7 @@ export class SimpleAddUI extends UIElement { //