aboutsummaryrefslogtreecommitdiff
path: root/docker/crupest-nginx/sites/www/src/main.js
diff options
context:
space:
mode:
Diffstat (limited to 'docker/crupest-nginx/sites/www/src/main.js')
-rw-r--r--docker/crupest-nginx/sites/www/src/main.js18
1 files changed, 17 insertions, 1 deletions
diff --git a/docker/crupest-nginx/sites/www/src/main.js b/docker/crupest-nginx/sites/www/src/main.js
index 04d7b6b..39d2ba8 100644
--- a/docker/crupest-nginx/sites/www/src/main.js
+++ b/docker/crupest-nginx/sites/www/src/main.js
@@ -23,14 +23,30 @@ function setBodyPaddingForEmotion(emotion) {
document.body.style.paddingTop = `${emotionElementHeight(emotion)}px`;
}
-setBodyPaddingForEmotion(happy);
+const sloganEmotionKey = "sloganEmotion";
+
+const savedEmotion = localStorage.getItem(sloganEmotionKey) ?? happy;
+if (savedEmotion !== happy && savedEmotion !== angry) {
+ console.error(`Invalid saved emotion: ${savedEmotion}`);
+}
+
+setBodyPaddingForEmotion(savedEmotion);
+setTimeout(() => {
+ document.body.style.transition = "padding-top 1s";
+})
/** @type {HTMLDivElement} */
const sloganContainer = document.querySelector(".slogan-container")
+setTimeout(() => {
+ sloganContainer.dataset.sloganEmotion = savedEmotion;
+ setBodyPaddingForEmotion(savedEmotion);
+}, 500);
+
for (const emotion of [happy, angry]) {
emotionElement(emotion).addEventListener("click", () => {
const opposite = emotionOpposite(emotion);
+ localStorage.setItem(sloganEmotionKey, opposite);
sloganContainer.dataset.sloganEmotion = opposite;
setBodyPaddingForEmotion(opposite);
});