Simplified update process

This commit is contained in:
Pieter Vander Vennet 2020-07-20 09:57:19 +02:00
parent 5e0d54601c
commit 5c9fb293e9
6 changed files with 51 additions and 69 deletions

View file

@ -5,6 +5,7 @@ import {QuestionDefinition} from "../../Logic/Question";
import {TagRenderingOptions} from "../TagRendering"; import {TagRenderingOptions} from "../TagRendering";
import {NameInline} from "../Questions/NameInline"; import {NameInline} from "../Questions/NameInline";
import {NameQuestion} from "../Questions/NameQuestion"; import {NameQuestion} from "../Questions/NameQuestion";
import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWithUpload";
export class Bookcases extends LayerDefinition { export class Bookcases extends LayerDefinition {
@ -19,7 +20,7 @@ export class Bookcases extends LayerDefinition {
this.title = new NameInline("ruilboekenkastje"); this.title = new NameInline("ruilboekenkastje");
this.elementsToShow = [ this.elementsToShow = [
new ImageCarouselWithUploadConstructor(),
new TagRenderingOptions({ new TagRenderingOptions({
question: "Heeft dit boekenruilkastje een naam?", question: "Heeft dit boekenruilkastje een naam?",
freeform: { freeform: {

View file

@ -25,16 +25,4 @@ export class VerticalCombine extends UIElement {
} }
return "<div class='"+this._className+"'>" + html + "</div>"; return "<div class='"+this._className+"'>" + html + "</div>";
} }
InnerUpdate(htmlElement: HTMLElement) {
for (const element of this._elements){
element.Update();
}
}
Activate() {
for (const element of this._elements){
element.Activate();
}
}
} }

View file

@ -115,18 +115,4 @@ export class FeatureInfoBox extends UIElement {
"</div>"; "</div>";
} }
Activate() {
super.Activate();
for (const infobox of this._infoboxes) {
infobox.Activate();
}
}
Update() {
super.Update();
this._title.Update();
for (const infobox of this._infoboxes) {
infobox.Update();
}
}
} }

View file

@ -43,10 +43,5 @@ export class QuestionPicker extends UIElement {
highestQ.CreateHtml(this.source).Render() + highestQ.CreateHtml(this.source).Render() +
"</div>"; "</div>";
} }
InnerUpdate(htmlElement: HTMLElement) {
}
Activate() {
}
} }

View file

@ -1,4 +1,5 @@
import {UIEventSource} from "./UIEventSource"; import {UIEventSource} from "./UIEventSource";
import instantiate = WebAssembly.instantiate;
export abstract class UIElement { export abstract class UIElement {
@ -58,20 +59,22 @@ export abstract class UIElement {
} }
element.style.pointerEvents = "all"; element.style.pointerEvents = "all";
element.style.cursor = "pointer"; element.style.cursor = "pointer";
/*
const childs = element.children;
for (let i = 0; i < childs.length; i++) {
const ch = childs[i];
console.log(ch);
ch.style.cursor = "pointer";
ch.onclick = () => {
self._onClick();
}
ch.style.pointerEvents = "all";
}*/
} }
this.InnerUpdate(element); this.InnerUpdate(element);
for (const i in this) {
const child = this[i];
if (child instanceof UIElement) {
child.Update();
} else if (child instanceof Array) {
for (const ch of child) {
if (ch instanceof UIElement) {
ch.Update();
}
}
}
}
} }
HideOnEmpty(hide : boolean){ HideOnEmpty(hide : boolean){
@ -99,7 +102,21 @@ export abstract class UIElement {
} }
protected abstract InnerRender(): string; protected abstract InnerRender(): string;
public Activate(): void {};
public Activate(): void {
for (const i in this) {
const child = this[i];
if (child instanceof UIElement) {
child.Activate();
} else if (child instanceof Array) {
for (const ch of child) {
if (ch instanceof UIElement) {
ch.Activate();
}
}
}
}
};
public IsEmpty(): boolean { public IsEmpty(): boolean {
return this.InnerRender() === ""; return this.InnerRender() === "";

View file

@ -4,6 +4,7 @@ import {UIEventSource} from "./UIEventSource";
import {Basemap} from "../Logic/Basemap"; import {Basemap} from "../Logic/Basemap";
import L from "leaflet"; import L from "leaflet";
import {FixedUiElement} from "./Base/FixedUiElement"; import {FixedUiElement} from "./Base/FixedUiElement";
import {VariableUiElement} from "./Base/VariableUIElement";
/** /**
* Handles and updates the user badge * Handles and updates the user badge
@ -13,6 +14,7 @@ export class UserBadge extends UIElement {
private _pendingChanges: UIElement; private _pendingChanges: UIElement;
private _logout: UIElement; private _logout: UIElement;
private _basemap: Basemap; private _basemap: Basemap;
private _homeButton: UIElement;
constructor(userDetails: UIEventSource<UserDetails>, constructor(userDetails: UIEventSource<UserDetails>,
@ -38,6 +40,21 @@ export class UserBadge extends UIElement {
} }
}); });
this._homeButton = new VariableUiElement(
userDetails.map((userinfo) => {
if (userinfo.home) {
return "<img id='home' src='./assets/home.svg' alt='home' class='small-userbadge-icon'> ";
}
return "";
})
).onClick(() => {
const home = userDetails.data?.home;
if (home === undefined) {
return;
}
basemap.map.flyTo([home.lat, home.lon], 18);
});
} }
protected InnerRender(): string { protected InnerRender(): string {
@ -66,9 +83,7 @@ export class UserBadge extends UIElement {
dryrun = " <span class='alert'>TESTING</span>"; dryrun = " <span class='alert'>TESTING</span>";
} }
let home = "";
if (user.home !== undefined) { if (user.home !== undefined) {
home = "<img id='home' src='./assets/home.svg' alt='home' class='small-userbadge-icon'> ";
const icon = L.icon({ const icon = L.icon({
iconUrl: 'assets/home.svg', iconUrl: 'assets/home.svg',
iconSize: [20, 20], iconSize: [20, 20],
@ -91,7 +106,7 @@ export class UserBadge extends UIElement {
dryrun + dryrun +
"</p> " + "</p> " +
"<p id='userstats'>" + "<p id='userstats'>" +
home + this._homeButton.Render() +
settings + settings +
messageSpan + messageSpan +
"<span id='csCount'> " + "<span id='csCount'> " +
@ -104,25 +119,5 @@ export class UserBadge extends UIElement {
"</div>"; "</div>";
} }
InnerUpdate(htmlElement: HTMLElement) {
this._pendingChanges.Update();
var btn = document.getElementById("home");
if (btn) {
const self = this;
btn.onclick = function () {
const home = self._userDetails?.data?.home;
if (home === undefined) {
return;
}
self._basemap.map.flyTo([home.lat, home.lon], 18);
}
}
this._logout.Update();
}
Activate() {
this._pendingChanges.Activate();
}
} }