More refactoring, fix loading of personal theme

This commit is contained in:
pietervdvn 2021-01-02 23:28:14 +01:00
parent 7a7b34b0fa
commit b2c234b51d
3 changed files with 27 additions and 32 deletions

View file

@ -4,18 +4,9 @@ import {UIEventSource} from "./UIEventSource";
import {OsmConnection} from "./Osm/OsmConnection"; import {OsmConnection} from "./Osm/OsmConnection";
export default class InstalledThemes { export default class InstalledThemes {
private static DeleteInvalid(osmConnection: OsmConnection, invalidThemes: any[]){ static InstalledThemes(osmConnection: OsmConnection): UIEventSource<{ layout: LayoutConfig; definition: string }[]> {
// for (const invalid of invalidThemes) { return osmConnection.preferencesHandler.preferences.map<{ layout: LayoutConfig, definition: string }[]>(allPreferences => {
// console.error("Attempting to remove ", invalid)
// osmConnection.GetLongPreference(
// "installed-theme-" + invalid
// ).setData(null);
// }
}
static InstalledThemes(osmConnection: OsmConnection) : UIEventSource<{ layout: LayoutConfig; definition: string }[]>{
return osmConnection.preferencesHandler.preferences.map<{ layout: LayoutConfig, definition: string }[]>(allPreferences => {
const installedThemes: { layout: LayoutConfig, definition: string }[] = []; const installedThemes: { layout: LayoutConfig, definition: string }[] = [];
if (allPreferences === undefined) { if (allPreferences === undefined) {
console.log("All prefs is undefined"); console.log("All prefs is undefined");
@ -31,8 +22,7 @@ export default class InstalledThemes {
continue; continue;
} }
try { try {
var json = atob(customLayout.data); const json = atob(customLayout.data);
console.log("Found a theme:",json);
const layout = new LayoutConfig( const layout = new LayoutConfig(
JSON.parse(json)); JSON.parse(json));
installedThemes.push({ installedThemes.push({
@ -53,5 +43,14 @@ export default class InstalledThemes {
}); });
} }
private static DeleteInvalid(osmConnection: OsmConnection, invalidThemes: any[]) {
for (const invalid of invalidThemes) {
console.error("Attempting to remove ", invalid)
osmConnection.GetLongPreference(
"installed-theme-" + invalid
).setData(null);
}
}
} }

View file

@ -152,7 +152,6 @@ export default class State {
this.layoutToUse.data.defaultBackgroundId ?? AvailableBaseLayers.osmCarto.id, this.layoutToUse.data.defaultBackgroundId ?? AvailableBaseLayers.osmCarto.id,
"The id of the background layer to start with") "The id of the background layer to start with")
.map((selectedId: string) => { .map((selectedId: string) => {
console.log("SELECTED ID", selectedId)
const available = self.availableBackgroundLayers.data; const available = self.availableBackgroundLayers.data;
for (const layer of available) { for (const layer of available) {
if (layer.id === selectedId) { if (layer.id === selectedId) {

View file

@ -1,16 +1,15 @@
import {UIElement} from "../UI/UIElement"; import {UIElement} from "./UIElement";
import State from "../State"; import State from "../State";
import Translations from "../UI/i18n/Translations"; import Translations from "../UI/i18n/Translations";
import {UIEventSource} from "./UIEventSource";
import {AllKnownLayouts} from "../Customizations/AllKnownLayouts"; import {AllKnownLayouts} from "../Customizations/AllKnownLayouts";
import Combine from "../UI/Base/Combine"; import Combine from "../UI/Base/Combine";
import CheckBox from "../UI/Input/CheckBox"; import CheckBox from "../UI/Input/CheckBox";
import * as personal from "../assets/themes/personalLayout/personalLayout.json"; import * as personal from "../assets/themes/personalLayout/personalLayout.json";
import {SubtleButton} from "../UI/Base/SubtleButton"; import {SubtleButton} from "./Base/SubtleButton";
import {FixedUiElement} from "../UI/Base/FixedUiElement"; import {FixedUiElement} from "./Base/FixedUiElement";
import {Img} from "../UI/Img";
import Svg from "../Svg"; import Svg from "../Svg";
import LayoutConfig from "../Customizations/JSON/LayoutConfig"; import LayoutConfig from "../Customizations/JSON/LayoutConfig";
import {UIEventSource} from "../Logic/UIEventSource";
export class PersonalLayersPanel extends UIElement { export class PersonalLayersPanel extends UIElement {
private checkboxes: UIElement[] = []; private checkboxes: UIElement[] = [];
@ -22,7 +21,7 @@ export class PersonalLayersPanel extends UIElement {
this.UpdateView([]); this.UpdateView([]);
const self = this; const self = this;
State.state.installedThemes.addCallback(extraThemes => { State.state.installedThemes.addCallback(extraThemes => {
self.UpdateView(extraThemes.map(layout => layout.layout.layoutConfig)); self.UpdateView(extraThemes.map(layout => layout.layout));
self.Update(); self.Update();
}) })
} }
@ -56,12 +55,12 @@ export class PersonalLayersPanel extends UIElement {
if (typeof layer === "string") { if (typeof layer === "string") {
continue; continue;
} }
let icon = layer.icon ?? Img.AsData(Svg.checkmark); let icon :UIElement = layer.GenerateLeafletStyle(new UIEventSource<any>({id:"node/-1"}), false).icon.html
let iconUnset = layer.icon ?? ""; ?? Svg.checkmark_svg();
if (layer.icon !== undefined && typeof (layer.icon) !== "string") { let iconUnset =new FixedUiElement(icon.Render());
icon = layer.icon.GetRenderValue({"id": "node/-123456"}).txt ?? Img.AsData(Svg.checkmark) icon.SetClass("single-layer-selection-toggle")
iconUnset = icon; iconUnset.SetClass("single-layer-selection-toggle")
}
let name = layer.name ?? layer.id; let name = layer.name ?? layer.id;
if (name === undefined) { if (name === undefined) {
@ -74,15 +73,13 @@ export class PersonalLayersPanel extends UIElement {
layer.description !== undefined ? new Combine(["<br/>", layer.description]) : "", layer.description !== undefined ? new Combine(["<br/>", layer.description]) : "",
]) ])
const iconImage = `<img src="${icon}">`;
const iconUnsetImage = `<img src="${iconUnset}">`
const cb = new CheckBox( const cb = new CheckBox(
new SubtleButton( new SubtleButton(
new FixedUiElement(iconImage).SetStyle(""), icon,
content), content),
new SubtleButton( new SubtleButton(
new FixedUiElement(iconUnsetImage).SetStyle("opacity:0.1;"), iconUnset.SetStyle("opacity:0.1"),
new Combine(["<del>", new Combine(["<del>",
content, content,
"</del>" "</del>"