Introduced SPA router and make use of it

2 files changed, 28 insertions, 2 deletions

diff --git a/src/js/arching-kaos-spa-router.js b/src/js/arching-kaos-spa-router.js
index 650a828..03eac11 100644
--- a/src/js/arching-kaos-spa-router.js
+++ b/src/js/arching-kaos-spa-router.js
@@ -1,4 +1,3 @@
-
 /*
  * A new feature for a new future:
  *
@@ -11,3 +10,29 @@
  * the "route" we got from `location.search`.
  *
  */
+
+function locationHashSetter(value){
+    window.location.hash = value;
+    locationHashOnChange();
+}
+
+function locationHashGetter(){
+    return window.location.hash;
+}
+
+function locationHashOnChange(){
+    if ( window.location.hash !== 'undefined' ){
+        var route = new Object;
+        route.id = window.location.hash;
+        console.log(route);
+        menuinit();
+        if ( menuids.includes(route.id.replace('/','')) ){
+            document.querySelector(route.id.replace('/','')).hidden=false;
+        } else {
+            document.querySelector('#not-found-section').hidden=false;
+        }
+        //menusel(route);
+    } else {
+        menuinit();
+    }
+}
diff --git a/src/js/menu-magic.js b/src/js/menu-magic.js
index b4ee247..7abd050 100644
--- a/src/js/menu-magic.js
+++ b/src/js/menu-magic.js
@@ -44,7 +44,8 @@ function menuinit(){
  */
 function menusel(m){
     menuinit();
-    document.querySelector(m.id.replace('/','')).hidden=false;
+    // document.querySelector(m.id.replace('/','')).hidden=false;
+    locationHashSetter(m.id);
     
     mainContainer.style.display = 'block';
     if ( isMobile ) {