history popstate stuff. lil messy implementation, but idfk how to clean up,,,,

This commit is contained in:
remi 2022-06-11 00:47:43 +02:00
parent 980ab5b84c
commit baa691fa03

30
main.js
View File

@ -59,7 +59,7 @@ document.addEventListener("keydown", (e) => {
//if search box not focused, and if we're not on the home page, go back to home page //if search box not focused, and if we're not on the home page, go back to home page
if (!header.querySelector("input").matches(":focus") && !header.classList.contains("fullscreen")) { if (!header.querySelector("input").matches(":focus") && !header.classList.contains("fullscreen")) {
e.preventDefault(); e.preventDefault();
animateHeader(true); goHome();
} else if (header.querySelector("input").matches(":focus") && ime != null) { } else if (header.querySelector("input").matches(":focus") && ime != null) {
toggleIME(); toggleIME();
} else if (header.querySelector("input").matches(":focus")) { } else if (header.querySelector("input").matches(":focus")) {
@ -234,7 +234,7 @@ function search(word) {
return result; return result;
} }
function doSearch() { function doSearch(state = true) {
let val = header.querySelector("input").value; let val = header.querySelector("input").value;
let results = search(val); let results = search(val);
if (results.length == 0) { if (results.length == 0) {
@ -323,6 +323,16 @@ function doSearch() {
} }
main.prepend(header); main.prepend(header);
} }
const url = new URL(window.location);
url.searchParams.set('s', val);
if (state == true) history.pushState(val, "", url);
}
function goHome(state = true) {
animateHeader(true);
const url = new URL(window.location);
url.searchParams.delete('s');
if (state == true) history.pushState(null, "", url);
} }
window.onload = () => { window.onload = () => {
@ -331,10 +341,24 @@ window.onload = () => {
header.querySelector("#search button").onclick = () => {toggleIME();}; header.querySelector("#search button").onclick = () => {toggleIME();};
header.querySelector("span.heonian").onclick = () => { header.querySelector("span.heonian").onclick = () => {
if (!header.classList.contains("fullscreen")) { if (!header.classList.contains("fullscreen")) {
animateHeader(true); goHome();
} }
}; };
loadDictionary(); loadDictionary();
window.addEventListener('popstate', (e) => {
if (e.state == null) {
if (!header.classList.contains("fullscreen")) {
goHome(false);
}
} else {
if (header.classList.contains("fullscreen")) {
animateHeader(false);
}
header.querySelector("input").value = e.state;
doSearch(false);
}
console.log("location: " + document.location + ", state: " + JSON.stringify(e.state));
});
} }
const sortObject = obj => Object.keys(obj).sort().reduce((res, key) => (res[key] = obj[key], res), {}) const sortObject = obj => Object.keys(obj).sort().reduce((res, key) => (res[key] = obj[key], res), {})