diff --git a/Customizations/AllKnownLayouts.ts b/Customizations/AllKnownLayouts.ts index 8fea419..fe6b632 100644 --- a/Customizations/AllKnownLayouts.ts +++ b/Customizations/AllKnownLayouts.ts @@ -14,9 +14,10 @@ export class AllKnownLayouts { new Groen(), new GRB(), new BikePumpsLayout(), + new Bookcases() /*new Toilets(), new Statues(), - new Bookcases()*/ + */ ]; const allSets = {}; for (const layout of layouts) { diff --git a/Customizations/Layers/Bookcases.ts b/Customizations/Layers/Bookcases.ts index 81015f1..fcd621c 100644 --- a/Customizations/Layers/Bookcases.ts +++ b/Customizations/Layers/Bookcases.ts @@ -3,6 +3,7 @@ import L from "leaflet"; import {Tag} from "../../Logic/TagsFilter"; import {QuestionDefinition} from "../../Logic/Question"; import {TagRenderingOptions} from "../TagRendering"; +import {NameInline} from "../Questions/NameInline"; export class Bookcases extends LayerDefinition { @@ -10,21 +11,38 @@ export class Bookcases extends LayerDefinition { super(); this.name = "boekenkast"; - this.newElementTags = [new Tag( "amenity", "public_bookcase")]; + this.newElementTags = [new Tag("amenity", "public_bookcase")]; this.icon = "./assets/bookcase.svg"; - this.overpassFilter = new Tag("amenity","public_bookcase"); + this.overpassFilter = new Tag("amenity", "public_bookcase"); this.minzoom = 13; + this.title = new NameInline("ruilboekenkastje"); + this.elementsToShow = [ - this.questions = [ + new TagRenderingOptions( + { + question: "Hoeveel boeken passen in dit boekenruilkastje?", + freeform: { + renderTemplate: "Er passen {capacity} boeken in dit boekenruilkastje", + template: "Er passen $$$ boeken in dit boekenruilkastje", + key: "capacity", + placeholder: "aantal" + }, + priority: 15 + } + ) + + ]; + + /* this.questions = [ QuestionDefinition.noNameOrNameQuestion("Wat is de naam van dit boekenruilkastje?", "Dit boekenruilkastje heeft niet echt een naam", 20), - QuestionDefinition.textQuestion("Hoeveel boeken kunnen er in?", "capacity", 15), QuestionDefinition.textQuestion("Heeft dit boekenkastje een peter, meter of voogd?", "operator", 10), - // QuestionDefinition.textQuestion("Wie kunnen we (per email) contacteren voor dit boekenruilkastje?", "email", 5), + // QuestionDefinition.textQuestion("Wie kunnen we (per email) contacteren voor dit boekenruilkastje?", "email", 5), - ] + ] ; + */ this.style = function (tags) { return { @@ -36,6 +54,7 @@ export class Bookcases extends LayerDefinition { }; } + /* this.elementsToShow = [ @@ -58,7 +77,7 @@ export class Bookcases extends LayerDefinition { new TagMappingOptions({key: "description", template: "Extra beschrijving:

{description}

"}), ] - ; + ;*/ } diff --git a/Customizations/Layers/Park.ts b/Customizations/Layers/Park.ts index e46dc25..dcce5d1 100644 --- a/Customizations/Layers/Park.ts +++ b/Customizations/Layers/Park.ts @@ -9,18 +9,32 @@ import {NameInline} from "../Questions/NameInline"; export class Park extends LayerDefinition { - + private accessByDefault = new TagRenderingOptions({ question: "Is dit park publiek toegankelijk?", mappings: [ - {k: new Tag("access","yes"), txt: "Publiek toegankelijk"}, - {k: new Tag("access",""), txt: "Publiek toegankelijk"}, - {k: new Tag("access","no"), txt: "Niet-publiek toegankelijk park"}, - {k: new Tag("access","guided"), txt: "Enkel toegankelijk met een gids of op een activiteit"} + {k: new Tag("access", "yes"), txt: "Publiek toegankelijk"}, + {k: new Tag("access", ""), txt: "Publiek toegankelijk"}, + {k: new Tag("access", "no"), txt: "Niet publiek toegankelijk"}, + {k: new Tag("access", "guided"), txt: "Enkel toegankelijk met een gids of op een activiteit"} ] }) - - + + private operatorByDefault = new + + TagRenderingOptions({ + question: "Wie beheert dit park?", + freeform: { + key: "operator", + renderTemplate: "Dit park wordt beheerd door {operator}", + template: "$$$", + }, + mappings: [{ + k: null, txt: "De gemeente beheert dit park" + }] + }); + + constructor() { super(); this.name = "park"; @@ -35,8 +49,9 @@ export class Park extends LayerDefinition { this.style = this.generateStyleFunction(); this.title = new NameInline("park"); this.elementsToShow = [new NameQuestion(), - this.accessByDefault - + this.accessByDefault, + this.operatorByDefault + ]; } diff --git a/Customizations/Layouts/Groen.ts b/Customizations/Layouts/Groen.ts index 2432869..f27da74 100644 --- a/Customizations/Layouts/Groen.ts +++ b/Customizations/Layouts/Groen.ts @@ -6,7 +6,7 @@ import {Layout} from "../Layout"; export class Groen extends Layout { constructor() { - super("groen", + super("buurtnatuur", "Buurtnatuur", [new NatureReserves(), new Park(), new Bos()], 10, diff --git a/Customizations/TagRendering.ts b/Customizations/TagRendering.ts index f94b112..695c122 100644 --- a/Customizations/TagRendering.ts +++ b/Customizations/TagRendering.ts @@ -72,7 +72,7 @@ export class TagRenderingOptions { const tagsKV = TagUtils.proprtiesToKV(tags); for (const oneOnOneElement of this.options.mappings) { - if (oneOnOneElement.k.matches(tagsKV)) { + if (oneOnOneElement.k === null || oneOnOneElement.k.matches(tagsKV)) { return false; } } @@ -147,10 +147,9 @@ export class TagRendering extends UIElement { this.elementPriority = options.priority ?? 0; // Prepare the choices for the Radio buttons - let i = 0; const choices: UIElement[] = []; - const alreadyUsedTexts: string[] = []; - + const usedChoices: string [] = []; + for (const choice of options.mappings ?? []) { if (choice.k === null) { this._mapping.push(choice); @@ -167,15 +166,16 @@ export class TagRendering extends UIElement { } } - const txt = choiceSubbed.txt; - if (alreadyUsedTexts.indexOf(txt) < 0) { + + const txt = choiceSubbed.txt + // Choices is what is shown in the radio buttons + if (usedChoices.indexOf(txt) < 0) { + choices.push(new FixedUiElement(txt)); - alreadyUsedTexts.push(txt); + usedChoices.push(txt); + // This is used to convert the radio button index into tags needed to add + this._mapping.push(choiceSubbed); } - - - this._mapping.push(choiceSubbed); - i++; } // Map radiobutton choice and textfield answer onto tagfilter. That tagfilter will be pushed into the changes later on @@ -205,6 +205,7 @@ export class TagRendering extends UIElement { // Prepare the actual input element -> pick an appropriate implementation let inputElement: UIInputElement; + if (this._freeform !== undefined && this._mapping !== undefined) { // Radio buttons with 'other' inputElement = new UIRadioButtonWithOther( @@ -215,14 +216,15 @@ export class TagRendering extends UIElement { pickString ); this._questionElement = inputElement; - } else if (this._mapping !== undefined) { + } else if (this._mapping !== [] && this._mapping.length > 0) { // This is a classic radio selection element - inputElement = new UIRadioButton(new UIEventSource(choices), pickChoice) + inputElement = new UIRadioButton(new UIEventSource(choices), pickChoice, false) this._questionElement = inputElement; } else if (this._freeform !== undefined) { this._textField = new TextField(new UIEventSource(this._freeform.placeholder), pickString); inputElement = this._textField; - this._questionElement = new FixedUiElement(this._freeform.template.replace("$$$", inputElement.Render())) + this._questionElement = new FixedUiElement( + "
" + this._freeform.template.replace("$$$", inputElement.Render()) + "
") } else { throw "Invalid questionRendering, expected at least choices or a freeform" } @@ -239,6 +241,7 @@ export class TagRendering extends UIElement { const cancel = () => { self._questionSkipped.setData(true); self._editMode.setData(false); + self._source.ping(); // Send a ping upstream to render the next question } // Setup the save button and it's action @@ -357,7 +360,7 @@ export class TagRendering extends UIElement { return "
" + - this._question + + "" + this._question + "" + (this._question !== "" ? "
" : "") + this._questionElement.Render() + this._skipButton.Render() + diff --git a/UI/Base/UIRadioButton.ts b/UI/Base/UIRadioButton.ts index d368dc6..2413073 100644 --- a/UI/Base/UIRadioButton.ts +++ b/UI/Base/UIRadioButton.ts @@ -74,9 +74,11 @@ export class UIRadioButton extends UIInputElement { if (this.SelectedElementIndex.data == null) { if (this._selectFirstAsDefault) { const el = document.getElementById(this.IdFor(0)); - // @ts-ignore - el.checked = true; - checkButtons(); + if (el) { + // @ts-ignore + el.checked = true; + checkButtons(); + } } } else { diff --git a/index.css b/index.css index 1d39a9c..830269b 100644 --- a/index.css +++ b/index.css @@ -8,6 +8,10 @@ body { font-family: 'Helvetica Neue', Arial, sans-serif; } +form { + display: inline; +} + #leafletDiv { height: 100%; } @@ -670,6 +674,11 @@ body { } +.question-text{ + font-size: larger; + font-weight: bold; +} + .answer { display: inline-block; margin: 0.1em; diff --git a/index.ts b/index.ts index d9bb317..d05afba 100644 --- a/index.ts +++ b/index.ts @@ -38,7 +38,7 @@ if (location.hostname === "localhost" || location.hostname === "127.0.0.1") { // ----------------- SELECT THE RIGHT QUESTSET ----------------- -let defaultQuest = "groen" +let defaultQuest = "buurtnatuur" if (window.location.search) { const params = window.location.search.substr(1).split("&"); const paramDict: any = {}; @@ -88,7 +88,7 @@ const saveTimeout = 30000; // After this many milliseconds without changes, save const allElements = new ElementStorage(); const osmConnection = new OsmConnection(dryRun); const changes = new Changes( - "Beantwoorden van vragen met MapComplete voor vragenset #" + questSetToRender.name, + "Beantwoorden van vragen met #MapComplete voor vragenset #" + questSetToRender.name, osmConnection, allElements); const bm = new Basemap("leafletDiv", locationControl, new VariableUiElement( locationControl.map((location) => { diff --git a/test.ts b/test.ts index cd6a746..d4b510f 100644 --- a/test.ts +++ b/test.ts @@ -7,9 +7,3 @@ import {OsmLink} from "./Customizations/Questions/OsmLink"; import {ConfirmDialog} from "./UI/ConfirmDialog"; import {Imgur} from "./Logic/Imgur"; -console.log("Hello world") - -Imgur.getDescriptionOfImage("https://i.imgur.com/pJfQYsj.jpg", - (info) => { - console.log(info) - }) \ No newline at end of file