midgard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Full, interactive i18n (still some quests to enable it though)

Browse source
This commit is contained in:
Pieter Vander Vennet 2020-07-21 02:55:28 +02:00
parent fd6f77c98e
commit 0f2dff8f41
15 changed files with 205 additions and 90 deletions
Download patch file Download diff file Expand all files Collapse all files

18
UI/Base/Combine.ts
View file

@ -2,18 +2,30 @@ import {UIElement} from "../UIElement";
import Translations from "../i18n/Translations";
export default class Combine extends UIElement {
private uiElements: UIElement[];
private uiElements: (string | UIElement)[];
constructor(uiElements: (string | UIElement)[]) {
super(undefined);
this.uiElements = uiElements.map(Translations.W);
this.uiElements = uiElements;
}
InnerRender(): string {
let elements = "";
for (const element of this.uiElements) {
elements += element.Render();
if (element instanceof UIElement) {
elements += element.Render();
} else {
elements += element;
}
}
return elements;
}
protected InnerUpdate(htmlElement: HTMLElement) {
for (const element of this.uiElements) {
if (element instanceof UIElement) {
element.Update();
}
}
}
}

14
UI/MessageBoxHandler.ts → UI/FullScreenMessageBoxHandler.ts
View file

@ -1,11 +1,13 @@
/**
* Keeps 'messagebox' and 'messageboxmobile' in sync, shows a 'close' button on the latter one
*/
import {UIEventSource} from "./UIEventSource";
import {UIElement} from "./UIElement";
import {VariableUiElement} from "./Base/VariableUIElement";
import Translations from "./i18n/Translations";
export class MessageBoxHandler {
/**
* Handles the full screen popup on mobile
*/
export class FullScreenMessageBoxHandler {
private _uielement: UIEventSource<UIElement>;
constructor(uielement: UIEventSource<UIElement>,
@ -22,13 +24,13 @@ export class MessageBoxHandler {
}
}
new VariableUiElement(new UIEventSource<string>("<h2>Return to the map</h2>"))
Translations.t.general.returnToTheMap
.onClick(() => {
console.log("Clicked 'return to the map'")
uielement.setData(undefined);
onClear();
})
.AttachTo("to-the-map");
.AttachTo("to-the-map-h2");
}

5
UI/SaveButton.ts
View file

@ -1,5 +1,6 @@
import {UIEventSource} from "./UIEventSource";
import {UIElement} from "./UIElement";
import Translations from "./i18n/Translations";
export class SaveButton extends UIElement {
private _value: UIEventSource<any>;
@ -17,9 +18,9 @@ export class SaveButton extends UIElement {
this._value.data === null
|| this._value.data === ""
) {
return "<span class='save-non-active'>Opslaan</span>"
return "<span class='save-non-active'>"+Translations.t.general.save.Render()+"</span>"
}
return "<span class='save'>Save</span>";
return "<span class='save'>"+Translations.t.general.save.Render()+"</span>";
}
}

7
UI/UIElement.ts
View file

@ -13,10 +13,6 @@ export abstract class UIElement {
this.id = "ui-element-" + UIElement.nextId;
this._source = source;
UIElement.nextId++;
if (UIElement.nextId % 100 == 0) {
console.log(UIElement.nextId)
}
this.ListenTo(source);
}
@ -97,8 +93,7 @@ export abstract class UIElement {
AttachTo(divId: string) {
let element = document.getElementById(divId);
if (element === null) {
console.log("SEVERE: could not attach UIElement to ", divId);
return;
throw "SEVERE: could not attach UIElement to " + divId;
}
element.innerHTML = this.Render();
this.Update();

2
UI/i18n/Translation.ts
View file

@ -30,6 +30,4 @@ export default class Translation extends UIElement {
return new Translation(this.translations).Render();
}
}

38
UI/i18n/Translations.ts
View file

@ -36,13 +36,15 @@ export default class Translations {
nl: 'Van welk type is deze fietsenparking?',
fr: 'TODO: fr'
}),
eg: new T({en: ", for example", nl: ", bijvoorbeeld"}),
stands: new T({en: 'Staple racks', nl: 'Nietjes', fr: 'TODO: fr'}),
loops: new T({en: 'Wheel rack/loops', nl: 'Wielrek/lussen', fr: 'TODO: fr'}),
handlebar: new T({en: 'Handlebar holder', nl: 'Stuurhouder', fr: 'TODO: fr'}),
wall_loops: new T({en: 'Wheel rack/loops', nl: 'Wielrek/lussen', fr: 'TODO: fr'}),
handlebar_holder: new T({en: 'Handlebar holder', nl: 'Stuurhouder', fr: 'TODO: fr'}),
shed: new T({en: 'Shed', nl: 'Schuur', fr: 'TODO: fr'}),
rack: new T({en: 'Rack', nl: 'Rek', fr: 'TODO: fr'}),
double: new T({en: 'Two-tiered', nl: 'Dubbel (twee verdiepingen)', fr: 'TODO: fr'}),
"two-tier": new T({en: 'Two-tiered', nl: 'Dubbel (twee verdiepingen)', fr: 'TODO: fr'}),
},
operator: {
render: new T({
en: 'This bike parking is operated by {operator}',
@ -293,9 +295,15 @@ export default class Translations {
ready: new T({en: 'Done!', nl: 'Klaar!', fr: 'TODO: fr'}),
},
general: {
loginWithOpenStreetMap: new T({en: "Login with OpenStreetMap", nl: "Aanmelden met OpenStreetMap"})
,
loginWithOpenStreetMap: new T({en: "Login with OpenStreetMap", nl: "Aanmelden met OpenStreetMap"}),
getStarted: new T({
en: "<span class='activate-osm-authentication'>Login with OpenStreetMap</span> or <a href='https://www.openstreetmap.org/user/new' target='_blank'>make a free account to get started</a>",
nl: "<span class='activate-osm-authentication'>Meld je aan met je OpenStreetMap-account</span> of <a href='https://www.openstreetmap.org/user/new' target='_blank'>maak snel en gratis een account om te beginnen/a>",
}),
welcomeBack: new T({
en: "You are logged in, welcome back!",
nl: "Je bent aangemeld. Welkom terug!"
}),
search: {
search: new Translation({
en: "Search a location",
@ -314,7 +322,23 @@ export default class Translations {
nl: "Niet gelukt..."
})
}
},
returnToTheMap: new T({
en: "Return to the map",
nl: "Naar de kaart"
}),
save: new T({
en: "Save",
nl: "Opslaan"
}),
cancel: new T({
en: "Cancel",
nl: "Annuleren"
}),
skip: new T({
en: "Skip this question",
nl: "Vraag overslaan"
})
}
}