Bastian-Greshake-Tzovaras/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Add cyclestreet theme, various bugfixes

Browse source
This commit is contained in:
Pieter Vander Vennet 2020-08-27 18:44:16 +02:00
parent 72a744f60d
commit 60c15e9c8d
23 changed files with 412 additions and 211 deletions
Download patch file Download diff file Expand all files Collapse all files

8
UI/Base/TabbedComponent.ts
View file

@ -35,9 +35,13 @@ export class TabbedComponent extends UIElement {
headerBar = "<div class='tabs-header-bar'>" + headerBar + "</div>"
const content = this.content[this._source.data].Render();
const content = this.content[this._source.data];
return headerBar + "<div class='tab-content'>" + content.Render() + "</div>";
}
return headerBar + "<div class='tab-content'>" + content + "</div>";
protected InnerUpdate(htmlElement: HTMLElement) {
super.InnerUpdate(htmlElement);
this.content[this._source.data].Update();
}
}

2
UI/CustomThemeGenerator/Preview.ts
View file

@ -13,7 +13,7 @@ export class Preview extends UIElement {
private reloadButton: Button;
private otherPreviews: VariableUiElement;
constructor(url: UIEventSource<string>, config: UIEventSource<LayoutConfigJson>) {
constructor(url: UIEventSource<string>, testurl: UIEventSource<string>, config: UIEventSource<LayoutConfigJson>) {
super(undefined);
this.config = config;
this.url = url;

16
UI/CustomThemeGenerator/ThemeGenerator.ts
View file

@ -85,8 +85,7 @@ class MappingGenerator extends UIElement {
}
InnerRender(): string {
const combine = new VerticalCombine(this.elements);
combine.clss = "bordered";
const combine = new VerticalCombine(this.elements).SetClass("bordered");
return combine.Render();
}
}
@ -186,8 +185,7 @@ class TagRenderingGenerator
}
InnerRender(): string {
const combine = new VerticalCombine(this.elements);
combine.clss = "bordered";
const combine = new VerticalCombine(this.elements).SetClass("bordered");
return combine.Render();
}
}
@ -235,8 +233,7 @@ class PresetGenerator extends UIElement {
}
InnerRender(): string {
const combine = new VerticalCombine(this.elements);
combine.clss = "bordered";
const combine = new VerticalCombine(this.elements).SetClass("bordered");
return combine.Render();
}
@ -460,7 +457,7 @@ class AllLayerComponent extends UIElement {
header: "<img src='./assets/add.svg'>",
content: new Button("Add a new layer", () => {
config.data.layers.push({
id: "",
name: "",
title: {
key: "*",
render: "Title"
@ -506,6 +503,7 @@ export class ThemeGenerator extends UIElement {
public readonly themeObject: UIEventSource<LayoutConfigJson>;
private readonly allQuestionFields: UIElement[];
public url: UIEventSource<string>;
public testurl: UIEventSource<string>;
private loginButton: Button
@ -535,7 +533,9 @@ export class ThemeGenerator extends UIElement {
if (window.location.hostname === "127.0.0.1") {
baseUrl = "http://127.0.0.1:1234";
}
this.url = base64.map((data) => `${baseUrl}/index.html?test=true&userlayout=${this.themeObject.data.name}#${data}`);
this.url = base64.map((data) => `${baseUrl}/index.html?userlayout=${this.themeObject.data.name}#${data}`);
this.testurl = base64.map((data) => `${baseUrl}/index.html?test=true&userlayout=${this.themeObject.data.name}#${data}`);
const self = this;
pingThemeObject = () => {self.themeObject.ping()};

2
UI/Input/TextField.ts
View file

@ -57,7 +57,7 @@ export class ValidatedTextField {
return undefined;
}
}
return new And(tags).asHumanString(false);
return new And(tags).asHumanString(false, false);
},
value: value,
startValidated: true

6
UI/MoreScreen.ts
View file

@ -23,8 +23,10 @@ export class MoreScreen extends UIElement {
}
private createLinkButton(layout: Layout, customThemeDefinition: string = undefined) {
if (layout.hideFromOverview && State.state.osmConnection.userDetails.data.name !== "Pieter Vander Vennet") {
return undefined;
if (layout.hideFromOverview) {
if (State.state.osmConnection.GetPreference("hidden-theme-" + layout.name + "-enabled").data !== "true") {
return undefined;
}
}
if (layout.name === State.state.layoutToUse.data.name) {
return undefined;

9
UI/UIElement.ts
View file

@ -6,7 +6,7 @@ export abstract class UIElement extends UIEventSource<string>{
public readonly id: string;
public readonly _source: UIEventSource<any>;
public clss : string = ""
private clss: string[] = []
private _hideIfEmpty = false;
@ -41,6 +41,7 @@ export abstract class UIElement extends UIEventSource<string>{
public onClick(f: (() => void)) {
this._onClick = f;
this.SetClass("clickable")
this.Update();
return this;
}
@ -107,7 +108,7 @@ export abstract class UIElement extends UIEventSource<string>{
}
Render(): string {
return `<span class='uielement ${this.clss}' id='${this.id}'>${this.InnerRender()}</span>`
return `<span class='uielement ${this.clss.join(" ")}' id='${this.id}'>${this.InnerRender()}</span>`
}
AttachTo(divId: string) {
@ -142,7 +143,9 @@ export abstract class UIElement extends UIEventSource<string>{
}
public SetClass(clss: string): UIElement {
this.clss = clss;
if (this.clss.indexOf(clss) < 0) {
this.clss.push(clss);
}
return this;
}

6
UI/UserBadge.ts
View file

@ -7,6 +7,7 @@ import {UserDetails} from "../Logic/Osm/OsmConnection";
import {State} from "../State";
import {Utils} from "../Utils";
import {UIEventSource} from "../Logic/UIEventSource";
import {SubtleButton} from "./Base/SubtleButton";
/**
* Handles and updates the user badge
@ -23,7 +24,10 @@ export class UserBadge extends UIElement {
super(State.state.osmConnection.userDetails);
this._userDetails = State.state.osmConnection.userDetails;
this._languagePicker = Utils.CreateLanguagePicker();
this._loginButton = Translations.t.general.loginWithOpenStreetMap.Clone().onClick(() => State.state.osmConnection.AttemptLogin());
this._loginButton = Translations.t.general.loginWithOpenStreetMap
.Clone()
.SetClass("userbadge-login")
.onClick(() => State.state.osmConnection.AttemptLogin());
this._logout = new FixedUiElement("<img src='assets/logout.svg' class='small-userbadge-icon' alt='logout'>")
.onClick(() => {
State.state.osmConnection.LogOut();

36
UI/WelcomeMessage.ts
View file

@ -7,6 +7,7 @@ import Translations from "./i18n/Translations";
import {VariableUiElement} from "./Base/VariableUIElement";
import {Utils} from "../Utils";
import {UIEventSource} from "../Logic/UIEventSource";
import Combine from "./Base/Combine";
export class WelcomeMessage extends UIElement {
@ -30,28 +31,37 @@ export class WelcomeMessage extends UIElement {
}
this.description = fromLayout((layout) => layout.welcomeMessage);
this.plzLogIn = fromLayout((layout) => layout.gettingStartedPlzLogin);
this.plzLogIn.onClick(()=> State.state.osmConnection.AttemptLogin());
this.plzLogIn =
fromLayout((layout) => layout.gettingStartedPlzLogin
.onClick(() => {State.state.osmConnection.AttemptLogin()})
);
this.welcomeBack = fromLayout((layout) => layout.welcomeBackMessage);
this.tail = fromLayout((layout) => layout.welcomeTail);
}
protected InnerUpdate(htmlElement: HTMLElement) {
super.InnerUpdate(htmlElement);
console.log("Innerupdating welcome message")
this.plzLogIn.Update();
}
InnerRender(): string {
let loginStatus = "";
let loginStatus = undefined;
if (State.state.featureSwitchUserbadge.data) {
loginStatus = (State.state.osmConnection.userDetails.data.loggedIn ? this.welcomeBack : this.plzLogIn).Render();
loginStatus = loginStatus + "<br/>"
loginStatus = (State.state.osmConnection.userDetails.data.loggedIn ? this.welcomeBack :
this.plzLogIn);
}
return "<span>" +
this.description.Render() +
"<br/></br>" +
loginStatus +
this.tail.Render() +
"<br/>" +
this.languagePicker.Render() +
"</span>";
return new Combine([
this.description,
"<br/></br>",
// TODO this button is broken - figure out why loginStatus,
this.tail,
"<br/>",
this.languagePicker
]).Render()
}