midgard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Refactoring fullscreenhandling

Browse source
This commit is contained in:
Pieter Vander Vennet 2021-01-25 03:12:09 +01:00
parent e1a4c75391
commit 00f610c589
23 changed files with 346 additions and 245 deletions
Download patch file Download diff file Expand all files Collapse all files

1
Logic/Actors/StrayClickHandler.ts
View file

@ -17,7 +17,6 @@ export default class StrayClickHandler {
selectedElement: UIEventSource<string>,
filteredLayers: UIEventSource<{ readonly isDisplayed: UIEventSource<boolean> }[]>,
leafletMap: UIEventSource<L.Map>,
fullscreenMessage: UIEventSource<{content: UIElement, hashText: string}>,
uiToShow: (() => UIElement)) {
this._uiToShow = uiToShow;
const self = this;

77
Logic/Actors/TitleHandler.ts
View file

@ -3,31 +3,70 @@ import LayoutConfig from "../../Customizations/JSON/LayoutConfig";
import Translations from "../../UI/i18n/Translations";
import Locale from "../../UI/i18n/Locale";
import {UIElement} from "../../UI/UIElement";
import TagRenderingAnswer from "../../UI/Popup/TagRenderingAnswer";
import {ElementStorage} from "../ElementStorage";
import Combine from "../../UI/Base/Combine";
export default class TitleHandler{
constructor(layoutToUse: UIEventSource<LayoutConfig>, fullScreenMessage: UIEventSource<{ content: UIElement, hashText: string, titleText?: UIElement }>) {
class TitleElement extends UIElement {
private readonly _layoutToUse: UIEventSource<LayoutConfig>;
private readonly _selectedFeature: UIEventSource<any>;
private readonly _allElementsStorage: ElementStorage;
constructor(layoutToUse: UIEventSource<LayoutConfig>,
selectedFeature: UIEventSource<any>,
allElementsStorage : ElementStorage) {
super(layoutToUse);
this._layoutToUse = layoutToUse;
this._selectedFeature = selectedFeature;
this._allElementsStorage = allElementsStorage;
this.ListenTo(Locale.language);
this.dumbMode = false;
}
InnerRender(): string {
const defaultTitle = Translations.WT(this._layoutToUse.data?.title)?.txt ?? "MapComplete"
const feature = this._selectedFeature.data;
if(feature === undefined){
return defaultTitle;
}
layoutToUse.map((layoutToUse) => {
return Translations.WT(layoutToUse?.title)?.txt ?? "MapComplete"
}, [Locale.language]
).addCallbackAndRun((title) => {
document.title = title
});
const layout = this._layoutToUse.data;
const properties = this._selectedFeature.data.properties;
for (const layer of layout.layers) {
if(layer.title === undefined){
continue;
}
if (layer.overpassTags.matchesProperties(properties)) {
fullScreenMessage.addCallbackAndRun(selected => {
const title = Translations.WT(layoutToUse.data?.title)?.txt ?? "MapComplete"
if(selected?.titleText?.data === undefined){
document.title = title
}else{
selected.titleText.Update();
var d = document.createElement('div');
d.innerHTML = selected.titleText.InnerRender();
const poi = (d.textContent || d.innerText)
document.title = title + " | " + poi;
const title = new TagRenderingAnswer(
this._allElementsStorage.getEventSourceFor(feature),
layer.title
)
return new Combine([defaultTitle," | ", title]).Render();
}
})
}
return defaultTitle;
}
}
export default class TitleHandler {
constructor(layoutToUse: UIEventSource<LayoutConfig>,
selectedFeature: UIEventSource<any>,
allElementsStorage : ElementStorage) {
new TitleElement(layoutToUse, selectedFeature, allElementsStorage)
.addCallbackAndRun(contents => {
const d = document.createElement('div');
d.innerHTML = contents;
// We pass everything into a div to strip out images etc...
document.title = (d.textContent || d.innerText);
});
}
}

2
Logic/MetaTagging.ts
View file

@ -74,7 +74,7 @@ export default class MetaTagging {
const tagsSource = State.state.allElements.getEventSourceFor(feature);
tagsSource.ping();
} catch (e) {
console.error(e)
console.warn(e)
}
});
}

6
Logic/Osm/OsmPreferences.ts
View file

@ -4,7 +4,7 @@ import {Utils} from "../../Utils";
export class OsmPreferences {
public preferences = new UIEventSource<any>({});
public preferences = new UIEventSource<any>({}, "all-osm-preferences");
public preferenceSources: any = {}
private auth: any;
private userDetails: UIEventSource<UserDetails>;
@ -29,7 +29,7 @@ export class OsmPreferences {
return this.longPreferences[prefix + key];
}
const source = new UIEventSource<string>(undefined);
const source = new UIEventSource<string>(undefined, "long-osm-preference:"+prefix+key);
this.longPreferences[prefix + key] = source;
const allStartWith = prefix + key + "-combined";
@ -106,7 +106,7 @@ export class OsmPreferences {
if (this.userDetails.data.loggedIn && this.preferences.data[key] === undefined) {
this.UpdatePreferences();
}
const pref = new UIEventSource<string>(this.preferences.data[key]);
const pref = new UIEventSource<string>(this.preferences.data[key],"osm-preference:"+key);
pref.addCallback((v) => {
this.SetPreference(key, v);
});

96
Logic/UIEventSource.ts
View file

@ -1,14 +1,64 @@
export class UIEventSource<T>{
export class UIEventSource<T> {
public data: T;
private readonly tag: string;
private _callbacks = [];
private static allSources : UIEventSource<any>[] = UIEventSource.PrepPerf();
static PrepPerf(){
// @ts-ignore
window.mcperf = () => {
console.log(UIEventSource.allSources.length, "uieventsources created");
const copy = [...UIEventSource.allSources];
copy.sort((a,b) => b._callbacks.length - a._callbacks.length);
console.log("Topten is:")
for (let i = 0; i < 10; i++) {
console.log(copy[i].tag, copy[i]);
}
}
return [];
}
constructor(data: T) {
constructor(data: T, tag: string = "") {
this.tag = tag;
this.data = data;
UIEventSource.allSources.push(this);
}
public static flatten<X>(source: UIEventSource<UIEventSource<X>>, possibleSources: UIEventSource<any>[]): UIEventSource<X> {
const sink = new UIEventSource<X>(source.data?.data);
source.addCallback((latestData) => {
sink.setData(latestData?.data);
});
for (const possibleSource of possibleSources) {
possibleSource?.addCallback(() => {
sink.setData(source.data?.data);
})
}
return sink;
}
public static Chronic(millis: number, asLong: () => boolean = undefined): UIEventSource<Date> {
const source = new UIEventSource<Date>(undefined);
function run() {
source.setData(new Date());
if (asLong === undefined || asLong()) {
window.setTimeout(run, millis);
}
}
run();
return source;
}
public addCallback(callback: ((latestData: T) => void)): UIEventSource<T> {
if(callback === console.log){
if (callback === console.log) {
// This ^^^ actually works!
throw "Don't add console.log directly as a callback - you'll won't be able to find it afterwards. Wrap it in a lambda instead."
}
@ -36,25 +86,9 @@ export class UIEventSource<T>{
}
}
public static flatten<X>(source: UIEventSource<UIEventSource<X>>, possibleSources: UIEventSource<any>[]): UIEventSource<X> {
const sink = new UIEventSource<X>(source.data?.data);
source.addCallback((latestData) => {
sink.setData(latestData?.data);
});
for (const possibleSource of possibleSources) {
possibleSource?.addCallback(() => {
sink.setData(source.data?.data);
})
}
return sink;
}
public map<J>(f: ((T) => J),
extraSources: UIEventSource<any>[] = [],
g: ((J) => T) = undefined ): UIEventSource<J> {
g: ((J) => T) = undefined): UIEventSource<J> {
const self = this;
const newSource = new UIEventSource<J>(
@ -70,7 +104,7 @@ export class UIEventSource<T>{
extraSource?.addCallback(update);
}
if(g !== undefined) {
if (g !== undefined) {
newSource.addCallback((latest) => {
self.setData(g(latest));
})
@ -79,7 +113,6 @@ export class UIEventSource<T>{
return newSource;
}
public syncWith(otherSource: UIEventSource<T>, reverseOverride = false): UIEventSource<T> {
this.addCallback((latest) => otherSource.setData(latest));
const self = this;
@ -94,7 +127,7 @@ export class UIEventSource<T>{
return this;
}
public stabilized(millisToStabilize) : UIEventSource<T>{
public stabilized(millisToStabilize): UIEventSource<T> {
const newSource = new UIEventSource<T>(this.data);
@ -103,7 +136,7 @@ export class UIEventSource<T>{
currentCallback++;
const thisCallback = currentCallback;
window.setTimeout(() => {
if(thisCallback === currentCallback){
if (thisCallback === currentCallback) {
newSource.setData(latestData);
}
}, millisToStabilize)
@ -112,19 +145,4 @@ export class UIEventSource<T>{
return newSource;
}
public static Chronic(millis: number, asLong: () => boolean = undefined): UIEventSource<Date> {
const source = new UIEventSource<Date>(undefined);
function run() {
source.setData(new Date());
if (asLong === undefined || asLong()) {
window.setTimeout(run, millis);
}
}
run();
return source;
}
}

2
Logic/Web/LocalStorageSource.ts
View file

@ -5,7 +5,7 @@ export class LocalStorageSource {
static Get(key: string, defaultValue: string = undefined): UIEventSource<string> {
try {
const saved = localStorage.getItem(key);
const source = new UIEventSource<string>(saved ?? defaultValue);
const source = new UIEventSource<string>(saved ?? defaultValue, "localstorage:"+key);
source.addCallback((data) => {
localStorage.setItem(key, data);