fixed star behavior and claude init

1 files changed, 27 insertions, 33 deletions

diff --git a/static/app.js b/static/app.js
index e2213f3..b942d7e 100644
--- a/static/app.js
+++ b/static/app.js
@@ -161,39 +161,6 @@ document.querySelectorAll("form[data-confirm]").forEach((form) => {
   });
 });
 
-document.addEventListener("click", async (event) => {
-  const button = event.target.closest(".star-button");
-  if (!button) return;
-
-  const control = button.closest(".star-control");
-  if (!control || !control.dataset.filmId) return;
-
-  const stars = Number(button.dataset.stars || 0);
-  const filmId = control.dataset.filmId;
-
-  button.disabled = true;
-  try {
-    const response = await fetch(`/films/${filmId}/stars`, {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-      },
-      body: JSON.stringify({ stars }),
-    });
-
-    const data = await response.json();
-    if (!response.ok) {
-      return;
-    }
-
-    syncStarControl(control, Number(data.stars || 0));
-  } catch (error) {
-    console.error("Failed to update stars", error);
-  } finally {
-    button.disabled = false;
-  }
-});
-
 document.querySelectorAll(".star-control").forEach((control) => {
   syncStarControl(control, Number(control.dataset.currentStars || 0));
   control.addEventListener("pointerleave", () => clearStarPreview(control));
@@ -205,5 +172,32 @@ document.querySelectorAll(".star-control").forEach((control) => {
   control.querySelectorAll(".star-button").forEach((button) => {
     button.addEventListener("pointerenter", () => previewStarControl(control, Number(button.dataset.stars || 0)));
     button.addEventListener("focus", () => previewStarControl(control, Number(button.dataset.stars || 0)));
+    button.addEventListener("click", async () => {
+      const currentStars = Number(control.dataset.currentStars || 0);
+      const selectedStars = Number(button.dataset.stars || 0);
+      const nextStars = currentStars === selectedStars ? 0 : selectedStars;
+
+      button.disabled = true;
+      try {
+        const response = await fetch(`/films/${control.dataset.filmId}/stars`, {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json",
+          },
+          body: JSON.stringify({ stars: nextStars }),
+        });
+
+        const data = await response.json();
+        if (!response.ok) {
+          return;
+        }
+
+        syncStarControl(control, Number(data.stars || 0));
+      } catch (error) {
+        console.error("Failed to update stars", error);
+      } finally {
+        button.disabled = false;
+      }
+    });
   });
 });