feat: Added some new words to fly past the screen

web/static/js/text.js

@@ -8,73 +8,119 @@
 // set a global var "run" to true before running this function
 "use strict";
 async function flyingText(canvas) {
-    canvas.classList.remove("hidden");
+  canvas.classList.remove("hidden");
 
-    while (runTextAnimation) {
+  while (runTextAnimation) {
-        // wait till ele is rdy in dom + time between spawns
+    // wait till ele is rdy in dom + time between spawns
-        await shootText(canvas, 4);
+    await shootText(canvas, 4);
-    }
+  }
 }
 
 async function shootText(canvas, sec, sta) {
-    // TODO: move to argument, load from backend
+  // TODO: move to argument, load from backend
-    let statements = sta || ["Keyboard-Nerd", "🖤", "Emacs",
+  let statements = sta || [
-                             "Lives in VI", "GNU/Linux", "Arch Linux",
+    "Keyboard-Nerd",
-                             "Computer Science", "Design",
+    "🖤",
-                             "Javascript", "C/C++", "Go", "Bash",
+    "Emacs",
-                             "Java", "Python", "QMK", "Vector Graphics",
+    "Lives in VI",
-                             "Adobe Collection", "OP-1", "Synthesizer",
+    "GNU/Linux",
-                             "6y Work Experience", "Network Security",
+    "Arch Linux",
-                             "CCNA", "Cisco", "Firewalling", "Project MGMT",
+    "Computer Science",
-                             "IT Specialist", "Git", "FreeBSD", "Photography",
+    "Design",
-                             "Emacs-Lisp", "Sophos Firewall",
+    "Javascript",
-                             "Microsoft Server", "Appgate", "Palo Alto FW",
+    "C/C++",
-                             "Linux Server", "FreeNAS", "Hardware",
+    "Go",
-                             "Arduino", "Electronics", "Soldering",
+    "Bash",
-                             "Full Stack Networking", "Hotline-Manager",
+    "Java",
-                             "Trainer for IT-Specialists", "Matlab/Octave",
+    "Python",
-                             "PHP", "CSS", "HTML", "Privacy Advocate",
+    "QMK",
-                             "Winter is coming!", "😺 Person", "Blender",
+    "Vector Graphics",
-                             "Prusa Slicer", "3D-Printing", "Bachelor of Science"];
+    "Adobe Collection",
+    "OP-1",
+    "Synthesizer",
+    "8y Work Experience",
+    "Network Security",
+    "CCNA",
+    "Cisco",
+    "Firewalling",
+    "Project MGMT",
+    "IT Specialist",
+    "Git",
+    "FreeBSD",
+    "Photography",
+    "Emacs-Lisp",
+    "Sophos Firewall",
+    "Microsoft Server",
+    "Appgate",
+    "Palo Alto FW",
+    "Linux Server",
+    "FreeNAS",
+    "Hardware",
+    "Arduino",
+    "Electronics",
+    "Soldering",
+    "Full Stack Networking",
+    "Hotline-Manager",
+    "Trainer for IT-Specialists",
+    "Matlab/Octave",
+    "PHP",
+    "CSS",
+    "HTML",
+    "Privacy Advocate",
+    "Winter is coming!",
+    "😺 Person",
+    "Blender",
+    "Prusa Slicer",
+    "3D-Printing",
+    "Bachelor of Science",
+    "NixOS",
+    "Rust",
+    "ReactJS",
+    "SolidJS",
+    "Teacher",
+    "Typescript",
+    "Snappy Keyboard",
+    "Shanty-Themes",
+  ];
 
-    let stCount = statements.length;
+  let stCount = statements.length;
-    let animationTime = sec;
+  let animationTime = sec;
-    let maxX , maxY, x, y;
+  let maxX, maxY, x, y;
-    // Browser resize
+  // Browser resize
-    maxX = canvas.offsetWidth / 2;
+  maxX = canvas.offsetWidth / 2;
-    maxY = canvas.offsetHeight / 2;
+  maxY = canvas.offsetHeight / 2;
 
-    let curr = document.createElement("p");
+  let curr = document.createElement("p");
-    curr.innerHTML = statements[getRand(stCount)];
+  curr.innerHTML = statements[getRand(stCount)];
-    curr.className = "flying-text";
+  curr.className = "flying-text";
-    curr.style.transition = `${animationTime}s ease-in`;
+  curr.style.transition = `${animationTime}s ease-in`;
 
-    // Get random position + correction to not touch middle to much
+  // Get random position + correction to not touch middle to much
-    x = getRand(maxX * 0.2, maxX);
+  x = getRand(maxX * 0.2, maxX);
-    y = getRand(maxY * 0.45, maxY);
+  y = getRand(maxY * 0.45, maxY);
 
-    // Random direction and correction to not touch right border
+  // Random direction and correction to not touch right border
-    x = (getRand(2) == 1) ? -1*x : 0.3 * x;
+  x = getRand(2) == 1 ? -1 * x : 0.3 * x;
-    y = (getRand(2) == 1) ? -1*y : 0.8 * y;
+  y = getRand(2) == 1 ? -1 * y : 0.8 * y;
 
-    canvas.appendChild(curr);
+  canvas.appendChild(curr);
-    await sleep(1000);
+  await sleep(1000);
 
-    // add the stuff that should be animated (transition in class)
+  // add the stuff that should be animated (transition in class)
-    curr.style.transform = `translate(${x}px, ${y}px)`;
+  curr.style.transform = `translate(${x}px, ${y}px)`;
-    curr.style.fontSize = `${Math.random() + Math.random() + 1.0}vw`;
+  curr.style.fontSize = `${Math.random() + Math.random() + 1.0}vw`;
 
-    // wait to remove it (async)
+  // wait to remove it (async)
-    setTimeout(() => {
+  setTimeout(() => {
-        curr.remove();
+    curr.remove();
-    }, animationTime * 1000 + 2000);
+  }, animationTime * 1000 + 2000);
 }
 
 function getRand(max, min) {
-    min = min || 0;
+  min = min || 0;
-    return min + Math.floor(Math.random() * (max - min));
+  return min + Math.floor(Math.random() * (max - min));
 }
 
 function sleep(ms) {
-    return new Promise((nil) => setTimeout(nil, ms));
+  return new Promise((nil) => setTimeout(nil, ms));
 }