diff --git a/oneko.js b/oneko.js index cbc5174..671d48c 100644 --- a/oneko.js +++ b/oneko.js @@ -8,10 +8,11 @@ if (isReducedMotion) return; const nekoEl = document.createElement("div"); + let persistPosition = true; let nekoPosX = 32; let nekoPosY = 32; - + let mousePosX = 0; let mousePosY = 0; @@ -85,6 +86,34 @@ }; function init() { + let nekoFile = "./oneko.gif" + const curScript = document.currentScript + if (curScript && curScript.dataset.cat) { + nekoFile = curScript.dataset.cat + } + if (curScript && curScript.dataset.persistPosition) { + if (curScript.dataset.persistPosition === "") { + persistPosition = true; + } else { + persistPosition = JSON.parse(curScript.dataset.persistPosition.toLowerCase()); + } + } + + if (persistPosition) { + let storedNeko = JSON.parse(window.localStorage.getItem("oneko")); + if (storedNeko !== null) { + nekoPosX = storedNeko.nekoPosX; + nekoPosY = storedNeko.nekoPosY; + mousePosX = storedNeko.mousePosX; + mousePosY = storedNeko.mousePosY; + frameCount = storedNeko.frameCount; + idleTime = storedNeko.idleTime; + idleAnimation = storedNeko.idleAnimation; + idleAnimationFrame = storedNeko.idleAnimationFrame; + nekoEl.style.backgroundPosition = storedNeko.bgPos; + } + } + nekoEl.id = "oneko"; nekoEl.ariaHidden = true; nekoEl.style.width = "32px"; @@ -96,20 +125,31 @@ nekoEl.style.top = `${nekoPosY - 16}px`; nekoEl.style.zIndex = 2147483647; - let nekoFile = "./oneko.gif" - const curScript = document.currentScript - if (curScript && curScript.dataset.cat) { - nekoFile = curScript.dataset.cat - } nekoEl.style.backgroundImage = `url(${nekoFile})`; - + document.body.appendChild(nekoEl); document.addEventListener("mousemove", function (event) { mousePosX = event.clientX; mousePosY = event.clientY; }); - + + if (persistPosition) { + window.addEventListener("beforeunload", function (event) { + window.localStorage.setItem("oneko", JSON.stringify({ + nekoPosX: nekoPosX, + nekoPosY: nekoPosY, + mousePosX: mousePosX, + mousePosY: mousePosY, + frameCount: frameCount, + idleTime: idleTime, + idleAnimation: idleAnimation, + idleAnimationFrame: idleAnimationFrame, + bgPos: nekoEl.style.backgroundPosition + })); + }); + } + window.requestAnimationFrame(onAnimationFrame); } @@ -124,8 +164,8 @@ lastFrameTimestamp = timestamp; } if (timestamp - lastFrameTimestamp > 100) { - lastFrameTimestamp = timestamp - frame() + lastFrameTimestamp = timestamp; + frame(); } window.requestAnimationFrame(onAnimationFrame); }