first commit

2025-12-02 18:52:45 +03:00
commit bdda481bff
202 changed files with 73723 additions and 0 deletions
--- a/web_interface/index.html
+++ b/web_interface/index.html
@@ -0,0 +1,254 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>DeautherX</title>
+    <script src="js/site.js"></script>
+  </head>
+  <body>
+
+    <h1 data-value="DeautherX">DeautherX</h1>
+    <p class="modified-text">created by BlackTechX</p>
+
+<script>
+const letters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
+let interval = null;
+
+window.addEventListener("DOMContentLoaded", () => {
+  startLetterAnimation();
+});
+
+function startLetterAnimation() {
+  const heading = document.querySelector("h1");
+  let iteration = 0;
+  clearInterval(interval);
+
+  interval = setInterval(() => {
+    heading.innerText = heading.innerText
+      .split("")
+      .map((letter, index) => {
+        if (index < iteration) {
+          return heading.dataset.value[index];
+        }
+
+        return letters[Math.floor(Math.random() * 26)];
+      })
+      .join("");
+
+    if (iteration >= heading.dataset.value.length) {
+      clearInterval(interval);
+      setTimeout(() => {
+        removeOtherLetters();
+      }, 200); // Adjusted delay for bubbles to appear after 5 seconds
+    }
+
+    iteration += 1 / 3;
+  }, 100);
+}
+
+
+function removeOtherLetters() {
+  const heading = document.querySelector("h1");
+  const otherLetters = Array.from(heading.innerText)
+    .filter(letter => !heading.dataset.value.includes(letter))
+    .join("");
+
+  let iteration = 0;
+  clearInterval(interval);
+
+  interval = setInterval(() => {
+    heading.innerText = heading.innerText
+      .split("")
+      .map((letter, index) => {
+        if (heading.dataset.value.includes(letter)) {
+          return letter;
+        }
+
+        if (index < iteration) {
+          return otherLetters[index];
+        }
+
+        return letters[Math.floor(Math.random() * 26)];
+      })
+      .join("");
+
+    if (iteration >= otherLetters.length) {
+      clearInterval(interval);
+      animateBubbles();
+      setTimeout(() => {
+        window.location.href = "/scan.html";
+      }, 7000);
+    }
+
+    iteration += 1 / 3;
+  }, 100);
+}
+
+function animateBubbles() {
+  const bubbleCount = 100; // Number of additional bubbles
+  const bubbleSizeMin = 10; // Minimum bubble size in pixels
+  const bubbleSizeMax = 30; // Maximum bubble size in pixels
+  const bubbleSpeedMin = 4; // Minimum bubble rising speed in seconds
+  const bubbleSpeedMax = 10; // Maximum bubble rising speed in seconds
+
+  const heading = document.querySelector("h1");
+  const headingRect = heading.getBoundingClientRect();
+  const bodyRect = document.body.getBoundingClientRect();
+
+  for (let i = 0; i < bubbleCount; i++) {
+    const bubble = document.createElement("div");
+    bubble.classList.add("bubble");
+    bubble.style.left = `${Math.random() * (bodyRect.width - headingRect.width)}px`;
+    bubble.style.bottom = `${Math.random() * bodyRect.height}px`;
+    bubble.style.width = `${bubbleSizeMin + Math.random() * (bubbleSizeMax - bubbleSizeMin)}px`;
+    bubble.style.height = bubble.style.width;
+
+    const delay = Math.random() * 500; // Random delay before bubble appears (reduced to 500 milliseconds)
+    const duration = bubbleSpeedMin + Math.random() * (bubbleSpeedMax - bubbleSpeedMin); // Random duration for bubble rising
+
+    setTimeout(() => {
+      heading.appendChild(bubble);
+      bubble.style.animationDuration = `${duration}s`;
+      bubble.addEventListener("animationend", () => {
+        bubble.remove();
+      });
+    }, delay);
+  }
+}
+</script>
+
+<style>
+body {
+  display: grid;
+  place-items: center;
+  height: 100vh;
+  background-color: black;
+  margin: 0rem;
+  overflow: hidden; /* Prevent scroll bar from appearing */
+}
+
+
+.container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+h1 {
+  font-family: 'Space Mono', monospace;
+  font-size: clamp(3rem, 10vw, 10rem);
+  color: white;
+  padding: 0rem clamp(1rem, 2vw, 3rem);
+  border-radius: clamp(0.4rem, 0.75vw, 1rem);
+  text-align: center;
+}
+
+.modified-text {
+  font-family: 'Space Mono', monospace;
+  font-size: 1rem;
+  color: white;
+  text-align: center;
+  position: absolute;
+  bottom: 15px;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+
+.bubble {
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  transform: translate(-50%, 100%);
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  opacity: 0;
+  animation-name: bubble-rise;
+  animation-timing-function: ease-in-out;
+  animation-fill-mode: forwards;
+  z-index: 9999;
+}
+
+@keyframes bubble-rise {
+  0% {
+    opacity: 0;
+    transform: translate(-50%, 100%);
+  }
+  70% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+    transform: translate(-50%, -200%);
+  }
+}
+
+.bubble::before {
+  content: "";
+  display: block;
+  width: 100%;
+  height: 100%;
+  border-radius: 50%;
+  background-color: rgb(255, 255, 255); /* Default white color */
+}
+
+
+
+
+/* -- YouTube Link Styles -- */
+
+body.menu-toggled > .meta-link > span {
+  color: rgb(30, 30, 30);
+}
+
+#source-link {
+  bottom: 60px;
+}
+
+#source-link > i {
+  color: rgb(94, 106, 210);
+}
+
+#yt-link > i {
+  color: rgb(239, 83, 80);
+}
+
+.meta-link {
+  align-items: center;
+  backdrop-filter: blur(3px);
+  background-color: rgba(255, 255, 255, 0.05);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 6px;
+  bottom: 10px;
+  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
+  cursor: pointer;
+  display: inline-flex;
+  gap: 5px;
+  left: 10px;
+  padding: 10px 20px;
+  position: fixed;
+  text-decoration: none;
+  transition: background-color 400ms, border-color 400ms;
+  z-index: 10000;
+}
+
+.meta-link:hover {
+  background-color: rgba(255, 255, 255, 0.1);
+  border: 1px solid rgba(255, 255, 255, 0.2);
+}
+
+.meta-link > i,
+.meta-link > span {
+  height: 20px;
+  line-height: 20px;
+}
+
+.meta-link > span {
+  color: white;
+  font-family: "Rubik", sans-serif;
+  font-weight: 500;
+}</style>
+
+  </body>
+</html>
+