AluraNetwork · DarkCat736 · Feb 28, 2025 · Feb 28, 2025 · Feb 28, 2025 · Feb 28, 2025
diff --git a/static/public/filepath-helper.js b/static/public/filepath-helper.js
@@ -0,0 +1,13 @@
+class filePathHelper {
+    constructor(URL) {
+        this.url = URL;
+        //this.relativeURL = isRelative;
+        this.convertedURL = null;
+    }
+
+    relativeToAbsolute() {
+        let currentURL = window.location.origin + window.location.pathname;
+        this.convertedURL = currentURL.replace(window.location.pathname.substring(window.location.pathname.lastIndexOf('/') + 1), this.url);
+        return this.convertedURL;
+    }
+}
diff --git a/static/public/index.html b/static/public/index.html
@@ -1,13 +1,11 @@
 <!DOCTYPE html>
 <html lang="en">
-
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>PhantomOS</title>
     <link rel="stylesheet" href="style.css">
 </head>
-
 <body>
     <canvas id="rainCanvas"></canvas>
     <div id="apps-bar">
@@ -24,6 +22,9 @@
             <div class="app-icon" data-app="settings">
                 <img src="icons/settings.png" alt="Settings">
             </div>
+            <div class="app-icon" data-app="chat" data-iframe-src="/phantomchat/index.html">
+                <img src="icons/chat.png" alt="Chat">
+            </div>
         </div>
         <div id="time-date">
             <button id="time-button">
@@ -49,6 +50,9 @@
                 <div class="start-item" data-app="settings">
                     <img src="icons/settings.png" alt="Settings"><span>Settings</span>
                 </div>
+                <div class="start-item" data-app="chat" data-iframe-src="/phantomchat/index.html">
+                    <img src="icons/chat.png" alt="Chat"><span>Chat</span>
+                </div>
             </div>
         </div>
         <div class="start-section">
@@ -63,6 +67,9 @@
                 <div class="start-item" data-app="settings">
                     <img src="icons/settings.png" alt="Settings"><span>Settings</span>
                 </div>
+                <div class="start-item" data-app="chat" data-iframe-src="/phantomchat/index.html">
+                    <img src="icons/chat.png" alt="Chat"><span>Phantom Chat</span>
+                </div>
             </div>
         </div>
     </div>
@@ -89,8 +96,9 @@
         <div id="credits-content">
             <h1>PhantomOS Credits</h1>
             <p>Developed by: dyamuh</p>
-            <p>Backend: dyamuh with UV backend</p>
+            <p>Backend: dyamuh (using UV backend)</p>
             <p>Frontend: dyamuh, darkcat736, norsegod99</p>
+            <p>Support: Riftriot</p>
             <canvas id="particles-canvas"></canvas>
         </div>
     </div>
@@ -142,8 +150,19 @@ <h2>About PhantomOS</h2>
             </div>
         </div>
     </div>
+    <div class="window" id="chat-window">
+        <div class="window-header">
+            <div>Phantom Chat</div>
+            <div class="window-controls">
+                <button class="minimize">-</button>
+                <button class="maximize">□</button>
+                <button class="close">×</button>
+            </div>
+        </div>
+        <iframe src="/phantomchat/index.html" style="width: 100%; height: 100%; border: none;"></iframe>
+    </div>
     <script src="script.js"></script>
+    <script src="filepath-helper.js"></script>
     <script src="particles.js"></script>
 </body>
-
 </html>
diff --git a/static/public/phantomchat/index.html b/static/public/phantomchat/index.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>PhantomChat</title>
+</head>
+<body style="color:white;">
+<h1>PhantomChat</h1>
+<p><i>This service is not currently available.</i></p>
+</body>
+</html>
diff --git a/static/public/phantomchat/style.css b/static/public/phantomchat/style.css
@@ -0,0 +1,7 @@
+body {
+    overflow: hidden;
+    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    background-color: #202020;
+    color: #d0d0d0;
+    color: white;
+}
diff --git a/static/public/script.js b/static/public/script.js
@@ -35,15 +35,15 @@ timeButton.addEventListener('click', () => {
 
 wifiStatus.textContent = "Connected";
 
-// COMBINED event listener for app icons and start menu items:
 [...appIcons, ...appListItems].forEach(item => {
     item.addEventListener('click', () => {
         const app = item.getAttribute('data-app');
         const window = document.getElementById(`${app}-window`);
 
-        if (app === 'google') {
-            const uvFrame = document.getElementById('uv-frame');
-            const iframeSrc = item.dataset.iframeSrc;
+        if (app === 'google' || app === 'chat') {
+            const uvFrame = window.querySelector('iframe');
+            const iframeSrc = new filePathHelper(item.dataset.iframeSrc).relativeToAbsolute();
+            console.log(new filePathHelper(item.dataset.iframeSrc).relativeToAbsolute());
             uvFrame.src = iframeSrc;
         }
 
@@ -52,7 +52,7 @@ wifiStatus.textContent = "Connected";
         window.classList.add('show');
         bringWindowToFront(window);
 
-        if (appList.classList.contains('show')) { // Only close if app list is open
+        if (appList.classList.contains('show')) {
             appList.classList.remove('show');
         }
 
@@ -70,7 +70,6 @@ wifiStatus.textContent = "Connected";
     });
 });
 
-
 windows.forEach(window => {
     const minimizeButton = window.querySelector('.minimize');
     const maximizeButton = window.querySelector('.maximize');
@@ -169,7 +168,6 @@ startButton.addEventListener('click', () => {
     appList.classList.toggle('show');
 });
 
-
 function bringWindowToFront(window) {
     const allWindows = document.querySelectorAll('.window');
     let maxZIndex = 10;
@@ -253,7 +251,6 @@ themeButtons.forEach(button => {
     });
 });
 
-
 const rainCanvas = document.getElementById('rainCanvas');
 const ctx = rainCanvas.getContext('2d');
 rainCanvas.width = window.innerWidth;
@@ -293,3 +290,49 @@ window.addEventListener('resize', () => {
     rainCanvas.height = window.innerHeight;
 });
 
+let timeout;
+
+function V2() {
+    let shouldRun = true;
+    function loop() {
+        if (!shouldRun) return;
+
+        const numRaindrops = 100;
+
+        for (let i = 0; i < numRaindrops; i++) {
+            const raindrop = document.createElement('div');
+            raindrop.classList.add('raindrop');
+            const randomX = Math.random() * 100;
+            const randomDelay = Math.random() * 5;
+
+            raindrop.style.opacity = 1;
+            raindrop.style.left = `${randomX}vw`;
+            raindrop.style.animationDuration = `${Math.random() * 6 + 1}s`;
+            raindrop.style.animationDelay = `-${randomDelay}s`;
+
+            document.body.appendChild(raindrop);
+        }
+    }
+    loop();
+
+    console.log("Wallpaper changed to V2");
+}
+
+function stopV2() {
+    clearTimeout(timeout);
+}
+
+function switchToV2() {
+    V2();
+    rainCanvas.style.opacity = 0;
+}
+
+function switchToV1() {
+    rainCanvas.style.opacity = 1;
+    const raindrops = document.querySelectorAll('.raindrop');
+    raindrops.forEach(raindrop => raindrop.remove());
+}
+
+function switchToV3(){
+    canvas3.style.opacity = 0;
+}