add debug arg to ppty

www/js/main.js

@@ -3,7 +3,25 @@ import { PPTY } from "./ppty/lib.js";
 
 main();
 
-function endBoot(root) {
+function showMain(debug) {
+  document
+    .querySelector("main")
+    .animate(
+      [
+        { visibility: "visible" },
+        { visibility: "visible", opacity: 1 }
+      ],
+      {
+        duration: 400 * !debug,
+        fill: "forwards",
+      }
+    );
+}
+
+function endBoot(root, debug) {
+  if (root == null)
+    return showMain();
+
   const style = getComputedStyle(root);
   const paddingLeft = parseFloat(style.paddingLeft);
   const paddingRight = parseFloat(style.paddingRight);
@@ -18,26 +36,15 @@ function endBoot(root) {
   const fade = root.animate(
     [{ opacity: 0 }],
     {
-      duration: 400,
-      delay: 3000,
+      duration: 400 * !debug,
+      delay: 3000 * !debug,
       fill: "forwards",
     }
   );
 
   fade.onfinish = () => {
     root.remove();
-    document
-      .querySelector("main")
-      .animate(
-        [
-          { visibility: "visible" },
-          { visibility: "visible", opacity: 1 }
-        ],
-        {
-          duration: 400,
-          fill: "forwards",
-        }
-      );
+    showMain();
   }
 }
 
@@ -62,7 +69,7 @@ function main() {
       }
     ])
     .onfinish(endBoot)
-    .run();
+    .run(false);
 
   const canvas = document.querySelector("#bg-canvas");
   canvas.setAttribute('width', window.innerWidth);

www/js/ppty/ppty.js

@@ -8,8 +8,8 @@ function animDelta(anim) {
 class PPTY {
   #root;
   #blockOptions;
-  #startCallback = _ => { };
-  #finishCallback = _ => { };
+  #startCallback = (root, debug) => { };
+  #finishCallback = (root, debug) => { };
 
   constructor(root, blockOptions) {
     this.#root = root;
@@ -26,10 +26,13 @@ class PPTY {
     return this;
   }
 
-  run() {
+  run(debug = false) {
     var delay = 0;
 
-    this.#startCallback(this.#root);
+    this.#startCallback(this.#root, debug);
+
+    if (debug)
+      return this.#finishCallback(this.#root, debug);
 
     this.#root
       .querySelectorAll(".ppty-block")
@@ -120,7 +123,7 @@ class PPTY {
         setTimeout(() => {
           command.style.borderRightColor = "transparent";
           if (index == blocks.length - 1)
-            this.#finishCallback(this.#root);
+            this.#finishCallback(this.#root, debug);
         }, delay);
       });
   }