Refactored out 'layout.ts'

This commit is contained in:
Pieter Vander Vennet 2020-11-11 16:23:49 +01:00
parent 36f5e896df
commit 73f32e0ecf
30 changed files with 465 additions and 400 deletions

View file

@ -1,5 +1,4 @@
import {UIElement} from "./UI/UIElement";
import {Layout} from "./Customizations/Layout";
import {Utils} from "./Utils";
import {ElementStorage} from "./Logic/ElementStorage";
import {Changes} from "./Logic/Osm/Changes";
@ -12,6 +11,7 @@ import {UIEventSource} from "./Logic/UIEventSource";
import {LocalStorageSource} from "./Logic/Web/LocalStorageSource";
import {QueryParameters} from "./Logic/Web/QueryParameters";
import {BaseLayer} from "./Logic/BaseLayer";
import LayoutConfig from "./Customizations/JSON/LayoutConfig";
/**
* Contains the global state: a bunch of UI-event sources
@ -38,9 +38,9 @@ export default class State {
minZoomLevelToAddNewPoints: (Utils.isRetina() ? 18 : 19)
};
public static runningFromConsole: boolean = false;
public static runningFromConsole: boolean = false;
public readonly layoutToUse = new UIEventSource<Layout>(undefined);
public readonly layoutToUse = new UIEventSource<LayoutConfig>(undefined);
/**
The mapping from id -> UIEventSource<properties>
@ -113,7 +113,7 @@ export default class State {
accuracy: number
}> = new UIEventSource<{ latlng: {lat:number, lng:number}, accuracy: number }>(undefined);
public layoutDefinition: string;
public installedThemes: UIEventSource<{ layout: Layout; definition: string }[]>;
public installedThemes: UIEventSource<{ layout: LayoutConfig; definition: string }[]>;
public layerControlIsOpened: UIEventSource<boolean> = QueryParameters.GetQueryParameter("layer-control-toggle", "false")
.map<boolean>((str) => str !== "false", [], b => "" + b)
@ -122,7 +122,7 @@ export default class State {
str => isNaN(Number(str)) ? 0 : Number(str), [], n => "" + n
);
constructor(layoutToUse: Layout) {
constructor(layoutToUse: LayoutConfig) {
const self = this;
this.layoutToUse.setData(layoutToUse);
@ -138,7 +138,7 @@ export default class State {
})
}
this.zoom = asFloat(
QueryParameters.GetQueryParameter("z", "" + layoutToUse.startzoom)
QueryParameters.GetQueryParameter("z", "" + layoutToUse.startZoom)
.syncWith(LocalStorageSource.Get("zoom")));
this.lat = asFloat(QueryParameters.GetQueryParameter("lat", "" + layoutToUse.startLat)
.syncWith(LocalStorageSource.Get("lat")));
@ -158,14 +158,14 @@ export default class State {
this.layoutToUse.addCallback(layoutToUse => {
const lcd = self.locationControl.data;
lcd.zoom = lcd.zoom ?? layoutToUse?.startzoom;
lcd.zoom = lcd.zoom ?? layoutToUse?.startZoom;
lcd.lat = lcd.lat ?? layoutToUse?.startLat;
lcd.lon = lcd.lon ?? layoutToUse?.startLon;
self.locationControl.ping();
});
function featSw(key: string, deflt: (layout: Layout) => boolean): UIEventSource<boolean> {
function featSw(key: string, deflt: (layout: LayoutConfig) => boolean): UIEventSource<boolean> {
const queryParameterSource = QueryParameters.GetQueryParameter(key, undefined);
// I'm so sorry about someone trying to decipher this
@ -182,7 +182,7 @@ export default class State {
this.featureSwitchUserbadge = featSw("fs-userbadge", (layoutToUse) => layoutToUse?.enableUserBadge ?? true);
this.featureSwitchSearch = featSw("fs-search", (layoutToUse) => layoutToUse?.enableSearch ?? true);
this.featureSwitchLayers = featSw("fs-layers", (layoutToUse) => layoutToUse?.enableLayers ?? true);
this.featureSwitchAddNew = featSw("fs-add-new", (layoutToUse) => layoutToUse?.enableAdd ?? true);
this.featureSwitchAddNew = featSw("fs-add-new", (layoutToUse) => layoutToUse?.enableAddNewPoints ?? true);
this.featureSwitchWelcomeMessage = featSw("fs-welcome-message", () => true);
this.featureSwitchIframe = featSw("fs-iframe", () => false);
this.featureSwitchMoreQuests = featSw("fs-more-quests", (layoutToUse) => layoutToUse?.enableMoreQuests ?? true);
@ -198,8 +198,8 @@ export default class State {
);
this.installedThemes = this.osmConnection.preferencesHandler.preferences.map<{ layout: Layout, definition: string }[]>(allPreferences => {
const installedThemes: { layout: Layout, definition: string }[] = [];
this.installedThemes = this.osmConnection.preferencesHandler.preferences.map<{ layout: LayoutConfig, definition: string }[]>(allPreferences => {
const installedThemes: { layout: LayoutConfig, definition: string }[] = [];
if (allPreferences === undefined) {
return installedThemes;
}
@ -208,18 +208,13 @@ export default class State {
const themename = allPreferencesKey.match(/^mapcomplete-installed-theme-(.*)-combined-length$/);
if (themename && themename[1] !== "") {
const customLayout = self.osmConnection.GetLongPreference("installed-theme-" + themename[1]);
if(customLayout.data === undefined){
if (customLayout.data === undefined) {
console.log("No data defined for ", themename[1]);
continue;
}
try {
const layout = State.FromBase64(customLayout.data);
if(layout.id === undefined){
// This is an old style theme
// We remove it
customLayout.setData(undefined);
continue;
}
const layout = new LayoutConfig(
JSON.parse(btoa(customLayout.data)));
installedThemes.push({
layout: layout,
definition: customLayout.data
@ -257,10 +252,10 @@ export default class State {
if (layoutToUse === undefined) {
return;
}
if (this.layoutToUse.data.supportedLanguages.indexOf(currentLanguage) < 0) {
console.log("Resetting language to", layoutToUse.supportedLanguages[0], "as", currentLanguage, " is unsupported")
if (this.layoutToUse.data.language.indexOf(currentLanguage) < 0) {
console.log("Resetting language to", layoutToUse.language[0], "as", currentLanguage, " is unsupported")
// The current language is not supported -> switch to a supported one
Locale.language.setData(layoutToUse.supportedLanguages[0]);
Locale.language.setData(layoutToUse.language[0]);
}
}).ping()
@ -288,5 +283,4 @@ export default class State {
}
public static FromBase64 : (data: string) => Layout = undefined;
}