From 1e9b2436eaffa4130f6a69c3a108f6feb9dd4ac8 Mon Sep 17 00:00:00 2001
From: Yuqian Yang <crupest@crupest.life>
Date: Sat, 22 Feb 2025 18:11:35 +0800
Subject: feat(services): refactor structure.

---
 services/docker/nginx/sites/www/src/main.ts | 47 +++++++++++++++++++++++++++++
 1 file changed, 47 insertions(+)
 create mode 100644 services/docker/nginx/sites/www/src/main.ts

(limited to 'services/docker/nginx/sites/www/src/main.ts')

diff --git a/services/docker/nginx/sites/www/src/main.ts b/services/docker/nginx/sites/www/src/main.ts
new file mode 100644
index 0000000..09e8661
--- /dev/null
+++ b/services/docker/nginx/sites/www/src/main.ts
@@ -0,0 +1,47 @@
+import "./style.css";
+
+class Emotion {
+  static opposite_map = new Map<Emotion, Emotion>();
+
+  constructor(public readonly name: string) {
+  }
+
+  get opposite(): Emotion {
+    return Emotion.opposite_map.get(this)!;
+  }
+
+  get element(): HTMLDivElement {
+    return document.querySelector<HTMLDivElement>(`.slogan.${this.name}`)!
+  }
+
+  get elementHeight(): number {
+    return this.element.clientHeight;
+  }
+
+  apply() {
+    localStorage.setItem(emotionKey, this.name);
+    document.body.dataset.emotion = this.name;
+    document.body.style.paddingTop = `${this.elementHeight}px`;
+  }
+}
+
+const happy = new Emotion("happy")
+const angry = new Emotion("angry")
+Emotion.opposite_map.set(happy, angry)
+Emotion.opposite_map.set(angry, happy)
+
+const emotionKey = "emotion";
+const savedEmotionName = localStorage.getItem(emotionKey) ?? happy.name;
+
+for (const emotion of [happy, angry]) {
+  if (emotion.name == savedEmotionName) {
+    emotion.apply();
+  }
+  emotion.element.addEventListener("click", () => {
+    emotion.opposite.apply();
+  });
+}
+
+setTimeout(() => {
+  document.body.style.transition = "padding-top 0.8s";
+});
-- 
cgit v1.2.3