Fix back button; add title

This commit is contained in:
Pieter Vander Vennet 2021-01-08 18:02:07 +01:00
parent 6e77504854
commit 2f57010202
14 changed files with 115 additions and 43 deletions

View file

@ -0,0 +1,19 @@
import {UIEventSource} from "../UIEventSource";
import {UIElement} from "../../UI/UIElement";
export default class HistoryHandling {
constructor(hash: UIEventSource<string>, fullscreenMessage: UIEventSource<{ content: UIElement, hashText: string }>) {
hash.addCallback(h => {
if (h === undefined || h === "") {
fullscreenMessage.setData(undefined);
}
})
fullscreenMessage.addCallback(fs => {
hash.setData(fs?.hashText);
})
}
}

View file

@ -17,7 +17,7 @@ export default class StrayClickHandler {
selectedElement: UIEventSource<string>,
filteredLayers: UIEventSource<{ readonly isDisplayed: UIEventSource<boolean> }[]>,
leafletMap: UIEventSource<L.Map>,
fullscreenMessage: UIEventSource<UIElement>,
fullscreenMessage: UIEventSource<{content: UIElement, hashText: string}>,
uiToShow: (() => UIElement)) {
this._uiToShow = uiToShow;
const self = this;
@ -51,7 +51,7 @@ export default class StrayClickHandler {
self._lastMarker.bindPopup(popup);
self._lastMarker.on("click", () => {
fullscreenMessage.setData(self._uiToShow());
fullscreenMessage.setData({content: self._uiToShow(), hashText: "new"});
uiElement.Update();
});
});

View file

@ -0,0 +1,33 @@
import {UIEventSource} from "../UIEventSource";
import LayoutConfig from "../../Customizations/JSON/LayoutConfig";
import Translations from "../../UI/i18n/Translations";
import Locale from "../../UI/i18n/Locale";
import {UIElement} from "../../UI/UIElement";
export default class TitleHandler{
constructor(layoutToUse: UIEventSource<LayoutConfig>, fullScreenMessage: UIEventSource<{ content: UIElement, hashText: string, titleText?: UIElement }>) {
layoutToUse.map((layoutToUse) => {
return Translations.WT(layoutToUse?.title)?.txt ?? "MapComplete"
}, [Locale.language]
).addCallbackAndRun((title) => {
document.title = title
});
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;
}
})
}
}

View file

@ -1,29 +1,52 @@
import {UIEventSource} from "../UIEventSource";
import Constants from "../../Models/Constants";
import {Utils} from "../../Utils";
export default class Hash {
public static hash : UIEventSource<string> = Hash.Get();
private static Get() : UIEventSource<string>{
if(Utils.runningFromConsole){
public static hash: UIEventSource<string> = Hash.Get();
/**
* Gets the current string, including the pound sign
* @constructor
*/
public static Current(): string {
if (Hash.hash.data === undefined || Hash.hash.data === "") {
return ""
} else {
return "#" + Hash.hash.data;
}
}
private static Get(): UIEventSource<string> {
if (Utils.runningFromConsole) {
return new UIEventSource<string>(undefined);
}
const hash = new UIEventSource<string>(window.location.hash.substr(1));
hash.addCallback(h => {
if(h === undefined || h === ""){
if (h === "undefined") {
console.warn("Got a literal 'undefined' as hash, ignoring")
h = undefined;
}
if (h === undefined || h === "") {
window.location.hash = "";
return;
}
h = h.replace(/\//g, "_");
window.location.hash = "#" + h;
});
window.onhashchange = () => {
hash.setData(window.location.hash.substr(1))
let newValue = window.location.hash.substr(1);
if (newValue === "") {
newValue = undefined;
}
hash.setData(newValue)
}
return hash;
}
}

View file

@ -43,27 +43,23 @@ export class QueryParameters {
private static Serialize() {
const parts = []
for (const key of QueryParameters.order) {
if (QueryParameters.knownSources[key] === undefined || QueryParameters.knownSources[key].data === undefined) {
if (QueryParameters.knownSources[key]?.data === undefined) {
continue;
}
if (QueryParameters.knownSources[key].data === undefined) {
continue;
}
if (QueryParameters.knownSources[key].data === "undefined") {
continue;
}
if (QueryParameters.knownSources[key].data == QueryParameters.defaults[key]) {
if (QueryParameters.knownSources[key].data === QueryParameters.defaults[key]) {
continue;
}
parts.push(encodeURIComponent(key) + "=" + encodeURIComponent(QueryParameters.knownSources[key].data))
}
// Don't pollute the history every time a parameter changes
history.replaceState(null, "", "?" + parts.join("&") + "#" + Hash.hash.data);
history.replaceState(null, "", "?" + parts.join("&") + Hash.Current());
}