minor refactoring

diff --git a/index.html b/index.html
index 4a9c25c5fba28eaccb47324922043fc550093e76..101460643a99c8b0636152b0b7ea23e3b3aa0281 100644 (file)
--- a/index.html
+++ b/index.html
@@ -147,54 +147,54 @@ h2 {
     </div>
 
     <script>
-const dialog = document.getElementById("dialog");
-const board = document.getElementById("board");
-const cards = document.getElementsByClassName("card");
-
-const drag_start = (ev) => {
-    ev.target.id = "selected-card";
-    ev.dataTransfer.setData("text/plain", ev.target.id);
-    ev.dropEffect = "move";
-}
+(() => {
+    const drag_start = (ev) => {
+        ev.target.id = "selected-card";
+        ev.dataTransfer.setData("text/plain", ev.target.id);
+        ev.dropEffect = "move";
+    }
 
-const drag_over = (ev) => {
-    ev.preventDefault();
-    ev.dataTransfer.dropEffect = "move";
-}
+    const drag_over = (ev) => {
+        ev.preventDefault();
+        ev.dataTransfer.dropEffect = "move";
+    }
 
-const drag_drop = (ev) => {
-    ev.preventDefault();
-    const tgt = ev.target;
-    const data = document.getElementById(ev.dataTransfer.getData("text"));
-    if (tgt.tagName == "H2") {
-        tgt.parentNode.appendChild(data);
-    } else if (tgt.className == "card") {
-        tgt.parentNode.insertBefore(data, tgt);
-    } else {
-        tgt.appendChild(data);
+    const drag_drop = (ev) => {
+        ev.preventDefault();
+        const tgt = ev.target;
+        const data = document.getElementById(ev.dataTransfer.getData("text"));
+        if (tgt.tagName == "H2") {
+            tgt.parentNode.appendChild(data);
+        } else if (tgt.className == "card") {
+            tgt.parentNode.insertBefore(data, tgt);
+        } else {
+            tgt.appendChild(data);
+        }
+        data.id = null;
     }
-    data.id = null;
-}
 
-const dblclick = (ev) => {
-    dialog.style.display = "block";
-}
+    const dblclick = (ev) => {
+        dialog.style.display = "block";
+    }
 
-window.onclick = (event) => {
-    if (event.target == dialog)
-        dialog.style.display = "none";
-}
+    window.onclick = (ev) => {
+        if (ev.target == dialog) {
+            dialog.style.display = "none";
+        }
+    }
 
-for (let i = 0; i < board.children.length; i++) {
-    board.children[i].ondrop = drag_drop;
-    board.children[i].ondragover = drag_over;
-}
+    for (let i = 0; i < board.children.length; i++) {
+        board.children[i].ondrop = drag_drop;
+        board.children[i].ondragover = drag_over;
+    }
 
-for (let i = 0; i < cards.length; i++) {
-    cards[i].ondblclick = dblclick;
-    cards[i].ondragstart = drag_start;
-    cards[i].draggable = true;
-}
+    const cards = document.getElementsByClassName("card");
+    for (let i = 0; i < cards.length; i++) {
+        cards[i].ondblclick = dblclick;
+        cards[i].ondragstart = drag_start;
+        cards[i].draggable = true;
+    }
+})();
     </script>
 </body>
 </html>