Add current location in localstorage, fixes #13

This commit is contained in:
Pieter Vander Vennet 2020-07-24 17:53:09 +02:00
parent 2a61ae6e1f
commit 89b78ee709
5 changed files with 28 additions and 25 deletions

View file

@ -0,0 +1,15 @@
import {UIEventSource} from "../UI/UIEventSource";
export class LocalStorageSource {
static Get(key: string, defaultValue: string = undefined): UIEventSource<string> {
const saved = localStorage.getItem(key);
const source = new UIEventSource<string>(saved ?? defaultValue);
source.addCallback((data) => {
localStorage.setItem(key, data);
console.log("Wriging ", key, data)
});
return source;
}
}

View file

@ -67,7 +67,7 @@ export class UIEventSource<T>{
} }
public syncWith(otherSource: UIEventSource<T>){ public syncWith(otherSource: UIEventSource<T>) : UIEventSource<T>{
this.addCallback((latest) => otherSource.setData(latest)); this.addCallback((latest) => otherSource.setData(latest));
const self = this; const self = this;
otherSource.addCallback((latest) => self.setData(latest)); otherSource.addCallback((latest) => self.setData(latest));
@ -76,6 +76,7 @@ export class UIEventSource<T>{
}else{ }else{
otherSource.setData(this.data); otherSource.setData(this.data);
} }
return this;
} }
} }

View file

@ -1,24 +1,7 @@
import {UIEventSource} from "../UIEventSource"; import {UIEventSource} from "../UIEventSource";
import {OsmConnection} from "../../Logic/OsmConnection"; import {LocalStorageSource} from "../../Logic/LocalStorageSource";
export default class Locale { export default class Locale {
public static language: UIEventSource<string> = Locale.getInitialLanguage(); public static language: UIEventSource<string> = LocalStorageSource.Get('language', "en");
private static getInitialLanguage() {
// The key to save in local storage
const LANGUAGE_KEY = 'language'
const lng = new UIEventSource("en");
const saved = localStorage.getItem(LANGUAGE_KEY);
lng.setData(saved);
lng.addCallback(data => {
console.log("Selected language", data);
localStorage.setItem(LANGUAGE_KEY, data)
});
return lng;
}
} }

View file

@ -10,18 +10,18 @@
crossorigin=""/> crossorigin=""/>
<link rel="stylesheet" href="./index.css"/> <link rel="stylesheet" href="./index.css"/>
<!--
<meta property="og:image" content="https://buurtnatuur.be/assets/BuurtnatuurFront.jpg"> <meta property="og:image" content="https://buurtnatuur.be/assets/BuurtnatuurFront.jpg">
<meta property="og:type" content="website"> <meta property="og:type" content="website">
<meta property="og:title" content="Buurtnatuur.be - samen natuur in kaart brengen"> <meta property="og:title" content="Buurtnatuur.be - samen natuur in kaart brengen">
<meta property="og:description" <meta property="og:description"
content="Met deze tool kan je natuur in je buurt in kaart brengen en meer informatie geven over je favoriete plekje"> content="Met deze tool kan je natuur in je buurt in kaart brengen en meer informatie geven over je favoriete plekje">
--> <!--
<meta property="og:image" content="/assets/bike/cyclofix.jpeg"/> <meta property="og:image" content="/assets/bike/cyclofix.jpeg"/>
<meta property="og:type" content="website"/> <meta property="og:type" content="website"/>
<meta property="og:title" content="Cyclofix - a map for and by cyclists"/> <meta property="og:title" content="Cyclofix - a map for and by cyclists"/>
<meta property="og:description" <meta property="og:description"
content="With this tool, cyclists can contribute to a map of cycling infrastructure"/> content="With this tool, cyclists can contribute to a map of cycling infrastructure"/>
-->
</head> </head>
<body> <body>
<div id="messagesboxmobilewrapper"> <div id="messagesboxmobilewrapper">

View file

@ -30,6 +30,7 @@ import Combine from "./UI/Base/Combine";
import {Img} from "./UI/Img"; import {Img} from "./UI/Img";
import {QueryParameters} from "./Logic/QueryParameters"; import {QueryParameters} from "./Logic/QueryParameters";
import {Utils} from "./Utils"; import {Utils} from "./Utils";
import {LocalStorageSource} from "./Logic/LocalStorageSource";
// --------------------- Special actions based on the parameters ----------------- // --------------------- Special actions based on the parameters -----------------
@ -92,9 +93,12 @@ const fullScreenMessage = new UIEventSource<UIElement>(undefined);
// The latest element that was selected - used to generate the right UI at the right place // The latest element that was selected - used to generate the right UI at the right place
const selectedElement = new UIEventSource<{ feature: any }>(undefined); const selectedElement = new UIEventSource<{ feature: any }>(undefined);
const zoom = QueryParameters.GetQueryParameter("z"); const zoom = QueryParameters.GetQueryParameter("z")
const lat = QueryParameters.GetQueryParameter("lat"); .syncWith(LocalStorageSource.Get("zoom"));
const lon = QueryParameters.GetQueryParameter("lon"); const lat = QueryParameters.GetQueryParameter("lat")
.syncWith(LocalStorageSource.Get("lat"));
const lon = QueryParameters.GetQueryParameter("lon")
.syncWith(LocalStorageSource.Get("lon"));
const locationControl = new UIEventSource<{ lat: number, lon: number, zoom: number }>({ const locationControl = new UIEventSource<{ lat: number, lon: number, zoom: number }>({