Translations
This commit is contained in:
parent
68929e4067
commit
1343955f44
6 changed files with 76 additions and 40 deletions
|
@ -4,6 +4,7 @@ import {TagRenderingOptions} from "../TagRendering";
|
|||
import {NameInline} from "../Questions/NameInline";
|
||||
import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWithUpload";
|
||||
import Translations from "../../UI/i18n/Translations";
|
||||
import T from "../../UI/i18n/Translation";
|
||||
|
||||
export class Bookcases extends LayerDefinition {
|
||||
|
||||
|
@ -16,36 +17,38 @@ export class Bookcases extends LayerDefinition {
|
|||
this.overpassFilter = new Tag("amenity", "public_bookcase");
|
||||
this.minzoom = 11;
|
||||
|
||||
const Tr = Translations.t;
|
||||
const Trq = Tr.bookcases.questions;
|
||||
this.title = new NameInline(Translations.t.bookcases.bookcase);
|
||||
this.elementsToShow = [
|
||||
new ImageCarouselWithUploadConstructor(),
|
||||
new TagRenderingOptions({
|
||||
question: "Heeft dit boekenruilkastje een naam?",
|
||||
question: Trq.hasName,
|
||||
freeform: {
|
||||
key: "name",
|
||||
template: "De naam is $$$",
|
||||
template: "$$$",
|
||||
renderTemplate: "", // We don't actually render it, only ask
|
||||
placeholder: "",
|
||||
extraTags: new Tag("noname","")
|
||||
extraTags: new Tag("noname", "")
|
||||
},
|
||||
mappings: [
|
||||
{k: new Tag("noname", "yes"), txt: "Neen, er is geen naam aangeduid op het boekenruilkastje"},
|
||||
{k: new Tag("noname", "yes"), txt: Trq.noname},
|
||||
]
|
||||
}),
|
||||
|
||||
new TagRenderingOptions(
|
||||
{
|
||||
question: "Hoeveel boeken passen in dit boekenruilkastje?",
|
||||
question: Trq.capacity,
|
||||
freeform: {
|
||||
renderTemplate: "Er passen {capacity} boeken in dit boekenruilkastje",
|
||||
template: "Er passen $nat$ boeken in dit boekenruilkastje",
|
||||
renderTemplate: Trq.capacityRender,
|
||||
template: Trq.capacityInput,
|
||||
key: "capacity",
|
||||
placeholder: "aantal"
|
||||
},
|
||||
}
|
||||
),
|
||||
new TagRenderingOptions({
|
||||
question: "Wat voor soort boeken heeft dit boekenruilkastje?",
|
||||
question: Trq.bookkinds,
|
||||
mappings: [
|
||||
{k: new Tag("books", "children"), txt: "Voornamelijk kinderboeken"},
|
||||
{k: new Tag("books", "adults"), txt: "Voornamelijk boeken voor volwassenen"},
|
||||
|
|
|
@ -28,10 +28,11 @@ export class TagRenderingOptions implements TagDependantUIElementConstructor {
|
|||
"int": (str) => str.indexOf(".") < 0 && !isNaN(Number(str)),
|
||||
"nat": (str) => str.indexOf(".") < 0 && !isNaN(Number(str)) && Number(str) > 0,
|
||||
"float": (str) => !isNaN(Number(str)),
|
||||
"pfloat": (str) => !isNaN(Number(str)) && Number(str) > 0,
|
||||
"email": (str) => EmailValidator.validate(str),
|
||||
"phone": (str, country) => {
|
||||
return parsePhoneNumberFromString(str, country.toUpperCase())?.isValid() ?? false;
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
public static formatting = {
|
||||
|
@ -212,9 +213,7 @@ class TagRendering extends UIElement implements TagDependantUIElement {
|
|||
this._userDetails = changes.login.userDetails;
|
||||
this.ListenTo(this._userDetails);
|
||||
|
||||
if (options.question !== undefined) {
|
||||
this._question = Translations.W(options.question);
|
||||
}
|
||||
|
||||
this._priority = options.priority ?? 0;
|
||||
this._tagsPreprocessor = function (properties) {
|
||||
if (options.tagsPreprocessor === undefined) {
|
||||
|
@ -228,6 +227,10 @@ class TagRendering extends UIElement implements TagDependantUIElement {
|
|||
return newTags;
|
||||
};
|
||||
|
||||
if (options.question !== undefined) {
|
||||
this._question = this.ApplyTemplate(options.question);
|
||||
}
|
||||
|
||||
this._mapping = [];
|
||||
this._freeform = options.freeform;
|
||||
|
||||
|
@ -497,7 +500,8 @@ class TagRendering extends UIElement implements TagDependantUIElement {
|
|||
if (this.IsQuestioning() || this._editMode.data) {
|
||||
// Not yet known or questioning, we have to ask a question
|
||||
|
||||
const question = this._question.Render();
|
||||
const question =
|
||||
this.ApplyTemplate(this._question).Render();
|
||||
|
||||
return "<div class='question'>" +
|
||||
"<span class='question-text'>" + question + "</span>" +
|
||||
|
@ -535,20 +539,25 @@ class TagRendering extends UIElement implements TagDependantUIElement {
|
|||
}
|
||||
|
||||
private ApplyTemplate(template: string | UIElement): UIElement {
|
||||
if(template === undefined || template === null){
|
||||
if (template === undefined || template === null) {
|
||||
throw "Trying to apply a template, but the template is null/undefined"
|
||||
}
|
||||
const tags = this._tagsPreprocessor(this._source.data);
|
||||
|
||||
const contents = Translations.W(template).map(contents =>
|
||||
{
|
||||
let templateStr = "";
|
||||
if (template instanceof UIElement) {
|
||||
template = template.Render();
|
||||
templateStr = template.Render();
|
||||
} else {
|
||||
templateStr = template;
|
||||
}
|
||||
return new FixedUiElement(TagUtils.ApplyTemplate(template, tags));
|
||||
const tags = this._tagsPreprocessor(this._source.data);
|
||||
return TagUtils.ApplyTemplate(templateStr, tags);
|
||||
}, [this._source]
|
||||
);
|
||||
return new VariableUiElement(contents);
|
||||
}
|
||||
|
||||
|
||||
InnerUpdate(htmlElement: HTMLElement) {
|
||||
super.InnerUpdate(htmlElement);
|
||||
this._questionElement.Update(); // Another manual update for them
|
||||
}
|
||||
|
||||
}
|
|
@ -1,7 +1,7 @@
|
|||
import {UIEventSource} from "./UIEventSource";
|
||||
import {TagDependantUIElement} from "../Customizations/UIElementConstructor";
|
||||
|
||||
export abstract class UIElement {
|
||||
export abstract class UIElement extends UIEventSource<string>{
|
||||
|
||||
private static nextId: number = 0;
|
||||
|
||||
|
@ -14,6 +14,7 @@ export abstract class UIElement {
|
|||
public static runningFromConsole = false;
|
||||
|
||||
protected constructor(source: UIEventSource<any>) {
|
||||
super("");
|
||||
this.id = "ui-element-" + UIElement.nextId;
|
||||
this._source = source;
|
||||
UIElement.nextId++;
|
||||
|
@ -50,7 +51,8 @@ export abstract class UIElement {
|
|||
// The element is not painted
|
||||
return;
|
||||
}
|
||||
element.innerHTML = this.InnerRender();
|
||||
this.setData(this.InnerRender());
|
||||
element.innerHTML = this.data;
|
||||
if (this._hideIfEmpty) {
|
||||
if (element.innerHTML === "") {
|
||||
element.parentElement.style.display = "none";
|
||||
|
|
|
@ -327,8 +327,39 @@ export default class Translations {
|
|||
}
|
||||
),
|
||||
bookcase: new T({
|
||||
nl: "Boekenruilkastje"
|
||||
nl: "Boekenruilkastje",
|
||||
en: "Public bookcase"
|
||||
}),
|
||||
questions: {
|
||||
hasName: new T(
|
||||
{
|
||||
nl: "Heeft dit boekenruilkastje een naam?",
|
||||
en: "Does this bookcase have a name?"
|
||||
}),
|
||||
noname: new T({
|
||||
nl: "Neen, er is geen naam aangeduid op het boekenruilkastje",
|
||||
en: "No, there is no clearly visible name on the public bookcase"
|
||||
},
|
||||
),
|
||||
capacity: new T({
|
||||
nl: "Hoeveel boeken passen in dit boekenruilkastje?",
|
||||
en: "How much books fit into this public bookcase?"
|
||||
}),
|
||||
capacityRender: new T({
|
||||
nl: "Er passen {capacity} boeken in dit boekenruilkastje",
|
||||
en: "{capacity} books fit in this bookcase"
|
||||
}),
|
||||
capacityInput: new T({
|
||||
nl: "Er passen $nat$ boeken in dit boekenruilkastje",
|
||||
en: "$nat$ books fit into this public bookcase"
|
||||
}),
|
||||
bookkinds: new T({
|
||||
nl: "Wat voor soort boeken heeft dit boekenruilkastje?",
|
||||
en: "What kind of books can be found in this public bookcase"
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
|
||||
image: {
|
||||
|
@ -469,8 +500,8 @@ export default class Translations {
|
|||
|
||||
}),
|
||||
phoneNumberIs: new T({
|
||||
en: "The phone number of this {category} is <a href='tel:{phone}'>{phone}</a>",
|
||||
nl: "Het telefoonnummer van {category} is <a href='tel:{phone}'>{phone}</a>"
|
||||
en: "The phone number of this {category} is <a href='tel:{phone}' target='_blank'>{phone}</a>",
|
||||
nl: "Het telefoonnummer van {category} is <a href='tel:{phone}' target='_blank'>{phone}</a>"
|
||||
})
|
||||
|
||||
}
|
||||
|
|
9
test.ts
9
test.ts
|
@ -1,9 +0,0 @@
|
|||
import {DropDown} from "./UI/Input/DropDown";
|
||||
import {UIEventSource} from "./UI/UIEventSource";
|
||||
|
||||
const source = new UIEventSource(10)
|
||||
|
||||
const dd = new DropDown("Test", [
|
||||
{value: 5, shown: "five"},
|
||||
{value: 10, shown: "ten"}
|
||||
], source).AttachTo("maindiv")
|
Loading…
Reference in a new issue