initial

assets/js/magic.js

@@ -0,0 +1,84 @@
+var theCount;
+var alarm = document.getElementById("alarm");
+var panel = document.getElementById("panel");
+var turnOff = document.getElementById("turn-off");
+var turnOffHor = document.getElementById("closing");
+var detonate = document.getElementById("detonate");
+alarm.volume = 0.25; //volume level
+
+var time = document.getElementById("time");
+function showCountDown() {
+  time.innerText = time.innerText - 1;
+  if (time.innerText == 0) {
+    clearInterval(theCount);
+    time.classList.add("crono");
+    abort.classList.add("hide");
+    detonate.classList.add("show");
+    setTimeout(function () {
+      turnOff.classList.add("close");
+      turnOffHor.classList.add("close");
+      reload.classList.add("show");
+      alarm.pause();
+    }, 1500);
+  }
+}
+
+var cover = document.getElementById("cover");
+cover.addEventListener("click", function () {
+  if (this.className == "box") this.classList.add("opened");
+  else this.classList.remove("opened");
+});
+
+var btn = document.getElementById("activate");
+activate.addEventListener("click", function () {
+  this.classList.add("pushed");
+  alarm.load();
+  alarm.currentTime = 10.1;
+  alarm.play();
+  setTimeout(function () {
+    panel.classList.add("show");
+    theCount = setInterval(showCountDown, 1000);
+    alarm.load();
+    alarm.play();
+  }, 500);
+});
+
+var abort = document.getElementById("abort");
+abort.addEventListener("click", function () {
+  btn.classList.remove("pushed");
+  panel.classList.remove("show");
+  clearInterval(theCount);
+  time.innerText = 9;
+  alarm.pause();
+  alarm.currentTime = 10;
+  alarm.play();
+});
+
+var reload = document.getElementById("restart");
+reload.addEventListener("click", function () {
+  panel.classList.remove("show");
+  turnOff.classList.remove("close");
+  turnOffHor.classList.remove("close");
+  abort.classList.remove("hide");
+  detonate.classList.remove("show");
+  cover.classList.remove("opened");
+  btn.classList.remove("pushed");
+  this.classList.remove("show");
+  time.classList.remove("crono");
+  time.innerText = 9;
+});
+
+setTimeout(function () {
+  cover.classList.remove("opened");
+}, 100);
+
+var mute = document.getElementById("mute");
+mute.addEventListener("click", function () {
+  if (this.className == "muted") {
+    alarm.muted = false;
+    this.classList.remove("muted");
+  } else {
+    alarm.muted = true;
+    this.classList.add("muted");
+  }
+});