1document.addEventListener("readystatechange", (event) => {
 2  // When HTML/DOM elements are ready:
 3  if (event.target.readyState === "interactive") {
 4    // Inspired by how https://laasanha.neocities.org/ does it
 5    var draggableElements =
 6      document.getElementsByClassName("window-decorations");
 7
 8    for (var i = 0; i < draggableElements.length; i++) {
 9      dragElement(draggableElements[i]);
10    }
11
12    function dragElement(elmnt) {
13      var pos1 = 0,
14        pos2 = 0,
15        pos3 = 0,
16        pos4 = 0;
17      var rightJustified =
18        elmnt.parentElement.classList.contains("right-justified");
19      elmnt.onmousedown = dragMouseDown;
20      elmnt.style.cursor = "grab";
21      elmnt.getElementsByClassName("window-button-close")[0].onmousedown =
22        function closeWindow(e) {
23          e = e || window.event;
24          e.preventDefault();
25          elmnt.parentElement.className += " destroying-anim";
26          setTimeout(function () {
27            elmnt.parentElement.remove();
28          }, 540);
29        };
30
31      function dragMouseDown(e) {
32        e = e || window.event;
33        e.preventDefault();
34        // get the mouse cursor position at startup:
35        pos3 = e.clientX;
36        pos4 = e.clientY;
37
38        let style = window.getComputedStyle(elmnt.parentElement);
39        pos1 = Number(style.getPropertyValue("top").replace("px", ""));
40        if (rightJustified) {
41          pos2 = Number(style.getPropertyValue("right").replace("px", ""));
42        } else {
43          pos2 = Number(style.getPropertyValue("left").replace("px", ""));
44        }
45        elmnt.style.cursor = "grabbing";
46        document.onmouseup = closeDragElement;
47        // call a function whenever the cursor moves:
48        document.onmousemove = elementDrag;
49      }
50
51      function elementDrag(e) {
52        e = e || window.event;
53        e.preventDefault();
54        // calculate the new cursor position:
55        // set the element's new position:
56        elmnt.parentElement.style.top = pos1 + e.clientY - pos4 + "px";
57        if (rightJustified) {
58          elmnt.parentElement.style.right = pos2 - e.clientX + pos3 + "px";
59        } else {
60          elmnt.parentElement.style.left = pos2 + e.clientX - pos3 + "px";
61        }
62      }
63
64      function closeDragElement() {
65        elmnt.style.cursor = "grab";
66        // stop moving when mouse button is released:
67        document.onmouseup = null;
68        document.onmousemove = null;
69      }
70    }
71  }
72});