8: No need to use placeholder for wrapper element

This commit is contained in:
metacryst
2023-12-04 15:12:43 -06:00
parent e417df949a
commit 934547c676
2 changed files with 86 additions and 62 deletions

View File

@@ -7,17 +7,16 @@
<script src=""></script> <script src=""></script>
<script type="module" src="https://server.parchment.page/quill.js"></script> <script type="module" src="https://server.parchment.page/quill.js"></script>
<script type="module"> <script type="module">
/* EXAMPLE IMPORTS // EXAMPLE ROUTES
import President from "./Web/President/President.js"; // import President from "./Web/President/President.js";
import RepublicanPrimaries from "./Web/President/RepublicanPrimaries.js"; // import RepublicanPrimaries from "./Web/President/RepublicanPrimaries.js";
import MyRepresentatives from "./Web/myRepresentatives/MyRepresentatives.js"; // import MyRepresentatives from "./Web/myRepresentatives/MyRepresentatives.js";
*/
window.routes = { // Replace with your imported objects, delete empty strings // window.routes = {
"/": /*President*/"", // "/": President,
"/exampleone": /*RepublicanPrimaries*/"", // "/exampleone": RepublicanPrimaries,
"/exampletwo/examplethree": /*MyRepresentatives*/"" // "/exampletwo/examplethree": MyRepresentatives
} // }
</script> </script>
</head> </head>
<body> <body>

View File

@@ -52,15 +52,40 @@ window.navigateTo = function(url) {
window.history.pushState({}, '', url); window.history.pushState({}, '', url);
} }
Object.defineProperty(window, 'routes', {
configurable: true,
enumerable: true,
set: function(newValue) {
Object.defineProperty(window, 'routes', {
value: newValue,
writable: false,
configurable: false,
enumerable: true
});
locationChange();
},
get: function() {
return window.routes;
}
});
function locationChange() { function locationChange() {
console.log("location change")
let URL = window.location.pathname.split("/").filter(d => (d !== 'Web') && (d !== 'index.html')).join("/") let URL = window.location.pathname.split("/").filter(d => (d !== 'Web') && (d !== 'index.html')).join("/")
if(URL === "") URL = "/" if(URL === "") URL = "/"
console.log(URL) console.log(URL)
console.log(document.body.children[0]) console.log(document.body.children[0])
document.body.children[0].replaceWith(new window.routes[URL]()) let wrapper = document.querySelector("#wrapper");
if(wrapper) {
wrapper.replaceWith(new window.routes[URL]())
} else {
document.body.prepend(new window.routes[URL]())
document.body.children[0].id = "wrapper"
}
urlBeforeChange = window.location.href; urlBeforeChange = window.location.href;
} }
function detectMobile() { function detectMobile() {
const mobileDeviceRegex = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i; const mobileDeviceRegex = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i;
return mobileDeviceRegex.test(navigator.userAgent); return mobileDeviceRegex.test(navigator.userAgent);