Small improvements to the custom theme generator

AllTranslationAssets.ts

@@ -99,7 +99,7 @@ export default class AllTranslationAssets {
     getStartedNewAccount: new Translation( {"en":" or <a href='https://www.openstreetmap.org/user/new' target='_blank'>create a new account</a>","nl":" of <a href='https://www.openstreetmap.org/user/new' target='_blank'>maak een nieuwe account aan</a> ","fr":" ou <a href='https://www.openstreetmap.org/user/new' target='_blank'>enregistrez-vous</a>","es":" o <a href='https://www.openstreetmap.org/user/new' target='_blank'>crea una nueva cuenta</a>","ca":" o <a href='https://www.openstreetmap.org/user/new' target='_blank'>crea un nou compte</a>","gl":" ou <a href='https://www.openstreetmap.org/user/new' target='_blank'>crea unha nova conta</a>","de":" oder <a href='https://www.openstreetmap.org/user/new' target='_blank'>ein neues Konto anlegen</a>"} ),
     noTagsSelected: new Translation( {"en":"No tags selected","es":"No se han seleccionado etiquetas","ca":"No s'han seleccionat etiquetes","gl":"Non se seleccionaron etiquetas","nl":"Geen tags geselecteerd","fr":"Aucune balise sélectionnée","de":"Keine Tags ausgewählt"} ),
     customThemeIntro: new Translation( {"en":"<h3>Custom themes</h3>These are previously visited user-generated themes.","nl":"<h3>Onofficiële thema's</h3>De onderstaande thema's heb je eerder bezocht en zijn gemaakt door andere OpenStreetMappers.","fr":"<h3>Thèmes personnalisés</h3>Vous avez déjà visité ces thèmes personnalisés.","gl":"<h3>Temas personalizados</h3>Estes son temas xerados por usuarios previamente visitados.","de":"<h3>Kundenspezifische Themen</h3>Dies sind zuvor besuchte benutzergenerierte Themen"} ),
-    aboutMapcomplete: new Translation( {"en":"<h3>About MapComplete</h3><p>MapComplete is an OpenStreetMap editor that is meant to help everyone to easily add information on a <b>single theme.</b></p><p>Only features relevant to a single theme are shown with a few predefined questions, in order to keep things <b>simple and extremly user-friendly</b>.The theme maintainer can also choose a language for the interface, choose to disable elements or even to embed it into a different website without any UI-element at all.</p><p>However, another important part of MapComplete is to always <b>offer the next step</b> to learn more about OpenStreetMap:<ul><li>An iframe without UI-elements will link to a full-screen version</li><li>The fullscreen version offers information about OpenStreetMap</li><li>If you're not logged in, you're asked to log in</li><li>If you answered a single question, you are allowed to add points</li><li>At a certain point, the actual added tags appear which later get linked to the wiki...</li></ul></p><p>Do you notice an issue with MapComplete? Do you have a feature request? Do you want to help translating? Head over to <a href='https://github.com/pietervdvn/MapComplete' target='_blank'>the source code</a> or <a href='https://github.com/pietervdvn/MapComplete/issues' target='_blank'>issue tracker.</a> Follow the edit count on <a href='https://osmcha.org/?filters=%7B%22date__gte%22%3A%5B%7B%22label%22%3A%222020-07-05%22%2C%22value%22%3A%222020-07-05%22%7D%5D%2C%22editor%22%3A%5B%7B%22label%22%3A%22mapcomplete%22%2C%22value%22%3A%22mapcomplete%22%7D%5D%7D' target='_blank' >OsmCha</a></p>","nl":"<h3>Over MapComplete</h3><p>MapComplete is een OpenStreetMap-editor om eenvoudig informatie toe te voegen over <b>één enkel onderwerp</b>.</p><p>Om de editor zo <b>simpel en gebruiksvriendelijk mogelijk</b> te houden, worden enkel objecten relevant voor het thema getoond.Voor deze objecten kunnen dan vragen beantwoord worden, of men kan een nieuw punt van dit thema toevoegen.De maker van het thema kan er ook voor opteren om een aantal elementen van de gebruikersinterface uit te schakelen of de taal ervan in te stellen.</p><p>Een ander belangrijk aspect is om bezoekers stap voor stap meer te leren over OpenStreetMap:<ul><li>Een iframe zonder verdere uitleg linkt naar de volledige versie van MapComplete</li><li>De volledige versie heeft uitleg over OpenStreetMap</li><li>Als je niet aangemeld bent, wordt er je gevraagd dit te doen</li><li>Als je minstens één vraag hebt beantwoord, kan je punten gaan toevoegen.</li><li>Heb je genoeg changesets, dan verschijnen de tags die wat later doorlinken naar de wiki</li></ul></p><p>Merk je een bug of wil je een extra feature? Wil je helpen vertalen? Bezoek dan de <a href='https://github.com/pietervdvn/MapComplete' target='_blank'>broncode</a> en <a href='https://github.com/pietervdvn/MapComplete/issues' target='_blank'>issue tracker</a>. Volg de edits <a href='https://osmcha.org/?filters=%7B%22date__gte%22%3A%5B%7B%22label%22%3A%222020-07-05%22%2C%22value%22%3A%222020-07-05%22%7D%5D%2C%22editor%22%3A%5B%7B%22label%22%3A%22mapcomplete%22%2C%22value%22%3A%22mapcomplete%22%7D%5D%7D' target='_blank' >op OsmCha</a></p>","de":"<h3>Über MapComplete</h3><p>MapComplete ist ein OpenStreetMap-Editor, der jedem helfen soll, auf einfache Weise Informationen zu einem <b>Einzelthema hinzuzufügen.</b></p><p>Nur Merkmale, die für ein einzelnes Thema relevant sind, werden mit einigen vordefinierten Fragen gezeigt, um die Dinge <b>einfach und extrem benutzerfreundlich</b> zu halten.Der Themen-Betreuer kann auch eine Sprache für die Schnittstelle wählen, Elemente deaktivieren oder sogar in eine andere Website ohne jegliches UI-Element einbetten.</p><p>Ein weiterer wichtiger Teil von MapComplete ist jedoch, immer <b>den nächsten Schritt anzubieten</b>um mehr über OpenStreetMap zu erfahren:<ul><li>Ein iframe ohne UI-Elemente verlinkt zu einer Vollbildversion</li><li>Die Vollbildversion bietet Informationen über OpenStreetMap</li><li>Wenn Sie nicht eingeloggt sind, werden Sie gebeten, sich einzuloggen</li><li>Wenn Sie eine einzige Frage beantwortet haben, dürfen Sie Punkte hinzufügen</li><li>An einem bestimmten Punkt erscheinen die tatsächlich hinzugefügten Tags, die später mit dem Wiki verlinkt werden...</li></ul></p><p>Fällt Ihnen ein Problem mit MapComplete auf? Haben Sie einen Feature-Wunsch? Wollen Sie beim Übersetzen helfen? Gehen Sie <a href='https://github.com/pietervdvn/MapComplete' target='_blank'>zum Quellcode</a> oder <a href='https://github.com/pietervdvn/MapComplete/issues' target='_blank'>zur Problemverfolgung</a>.</p>"} ),
+    aboutMapcomplete: new Translation( {"en":"<h3>About MapComplete</h3><p>MapComplete is an OpenStreetMap editor that is meant to help everyone to easily add information on a <b>single theme.</b></p><p>Only features relevant to a single theme are shown with a few predefined questions, in order to keep things <b>simple and extremly user-friendly</b>.The theme maintainer can also choose a language for the interface, choose to disable elements or even to embed it into a different website without any UI-element at all.</p><p>However, another important part of MapComplete is to always <b>offer the next step</b> to learn more about OpenStreetMap:<ul><li>An iframe without UI-elements will link to a full-screen version</li><li>The fullscreen version offers information about OpenStreetMap</li><li>If you're not logged in, you're asked to log in</li><li>If you answered a single question, you are allowed to add points</li><li>At a certain point, the actual added tags appear which later get linked to the wiki...</li></ul></p><p>Do you notice an issue with MapComplete? Do you have a feature request? Do you want to help translating? Head over to <a href='https://github.com/pietervdvn/MapComplete' target='_blank'>the source code</a> or <a href='https://github.com/pietervdvn/MapComplete/issues' target='_blank'>issue tracker.</a> Follow the edit count on <a href='https://osmcha.org/?filters=%7B%22date__gte%22%3A%5B%7B%22label%22%3A%222021-01-01%22%2C%22value%22%3A%222021-01-01%22%7D%5D%2C%22editor%22%3A%5B%7B%22label%22%3A%22mapcomplete%22%2C%22value%22%3A%22mapcomplete%22%7D%5D%7D' target='_blank' >OsmCha</a></p>","nl":"<h3>Over MapComplete</h3><p>MapComplete is een OpenStreetMap-editor om eenvoudig informatie toe te voegen over <b>één enkel onderwerp</b>.</p><p>Om de editor zo <b>simpel en gebruiksvriendelijk mogelijk</b> te houden, worden enkel objecten relevant voor het thema getoond.Voor deze objecten kunnen dan vragen beantwoord worden, of men kan een nieuw punt van dit thema toevoegen.De maker van het thema kan er ook voor opteren om een aantal elementen van de gebruikersinterface uit te schakelen of de taal ervan in te stellen.</p><p>Een ander belangrijk aspect is om bezoekers stap voor stap meer te leren over OpenStreetMap:<ul><li>Een iframe zonder verdere uitleg linkt naar de volledige versie van MapComplete</li><li>De volledige versie heeft uitleg over OpenStreetMap</li><li>Als je niet aangemeld bent, wordt er je gevraagd dit te doen</li><li>Als je minstens één vraag hebt beantwoord, kan je punten gaan toevoegen.</li><li>Heb je genoeg changesets, dan verschijnen de tags die wat later doorlinken naar de wiki</li></ul></p><p>Merk je een bug of wil je een extra feature? Wil je helpen vertalen? Bezoek dan de <a href='https://github.com/pietervdvn/MapComplete' target='_blank'>broncode</a> en <a href='https://github.com/pietervdvn/MapComplete/issues' target='_blank'>issue tracker</a>. Volg de edits <a href='https://osmcha.org/?filters=%7B%22date__gte%22%3A%5B%7B%22label%22%3A%222021-01-01%22%2C%22value%22%3A%222021-01-01%22%7D%5D%2C%22editor%22%3A%5B%7B%22label%22%3A%22mapcomplete%22%2C%22value%22%3A%22mapcomplete%22%7D%5D%7D' target='_blank' >op OsmCha</a></p>","de":"<h3>Über MapComplete</h3><p>MapComplete ist ein OpenStreetMap-Editor, der jedem helfen soll, auf einfache Weise Informationen zu einem <b>Einzelthema hinzuzufügen.</b></p><p>Nur Merkmale, die für ein einzelnes Thema relevant sind, werden mit einigen vordefinierten Fragen gezeigt, um die Dinge <b>einfach und extrem benutzerfreundlich</b> zu halten.Der Themen-Betreuer kann auch eine Sprache für die Schnittstelle wählen, Elemente deaktivieren oder sogar in eine andere Website ohne jegliches UI-Element einbetten.</p><p>Ein weiterer wichtiger Teil von MapComplete ist jedoch, immer <b>den nächsten Schritt anzubieten</b>um mehr über OpenStreetMap zu erfahren:<ul><li>Ein iframe ohne UI-Elemente verlinkt zu einer Vollbildversion</li><li>Die Vollbildversion bietet Informationen über OpenStreetMap</li><li>Wenn Sie nicht eingeloggt sind, werden Sie gebeten, sich einzuloggen</li><li>Wenn Sie eine einzige Frage beantwortet haben, dürfen Sie Punkte hinzufügen</li><li>An einem bestimmten Punkt erscheinen die tatsächlich hinzugefügten Tags, die später mit dem Wiki verlinkt werden...</li></ul></p><p>Fällt Ihnen ein Problem mit MapComplete auf? Haben Sie einen Feature-Wunsch? Wollen Sie beim Übersetzen helfen? Gehen Sie <a href='https://github.com/pietervdvn/MapComplete' target='_blank'>zum Quellcode</a> oder <a href='https://github.com/pietervdvn/MapComplete/issues' target='_blank'>zur Problemverfolgung</a>.</p>"} ),
     backgroundMap: new Translation( {"en":"Background map","ca":"Mapa de fons","es":"Mapa de fondo","nl":"Achtergrondkaart","fr":"Carte de fonds","de":"Hintergrundkarte"} ),
     layerSelection: {      zoomInToSeeThisLayer: new Translation( {"en":"Zoom in to see this layer","ca":"Amplia per veure aquesta capa","es":"Amplía para ver esta capa","nl":"Vergroot de kaart om deze laag te zien","fr":"Aggrandissez la carte pour voir cette couche","de":"Vergrößern, um diese Ebene zu sehen"} ),
       title: new Translation( {"en":"Select layers","nl":"Selecteer lagen"} ),

Models/Constants.ts

@@ -2,7 +2,7 @@ import { Utils } from "../Utils";
 
 export default class Constants {
     
-    public static vNumber = "0.6.0";
+    public static vNumber = "0.6.0a";
 
     // The user journey states thresholds when a new feature gets unlocked
     public static userJourney = {

UI/CustomGenerator/TagRenderingPanel.ts

@@ -62,6 +62,13 @@ export default class TagRenderingPanel extends InputElement<TagRenderingConfigJs
             return new SingleSetting<any>(value, input, id, name, description);
         }
         
+        this._value.addCallback(value => {
+            if(value?.freeform?.key == ""){
+                value.freeform = undefined;
+                this._value.ping();
+            }
+        })
+
         const questionSettings = [
 
 

customGenerator.html

@@ -8,6 +8,15 @@
 
     <style type="text/css">
 
+        img {
+            min-width: 35px;
+            min-height: 35px;
+        }
+        
+        input{
+            border: 0.5px solid #939393;
+        }
+        
         .icon-preview {
             max-width: 2em;
             max-height: 2em ;