vfsjs-test 1.0.13 → 1.0.15

package/main.js

@@ -1,90 +1,96 @@
-// main.js - Developer Workspace API
+// main.js - Production Developer Environment Layout
 
 window.vfs = {
+    // Write local strings straight to memory mapping keyspaces
     add(filename, contentString, customMime = null) {
         return window._vfsKernel.write(filename, contentString, customMime);
     },
-    delete(filename) { return window._vfsKernel.remove(filename); },
-    clear() { return window._vfsKernel.wipe(); }
-};
-
-async function startDeveloperWorkspace() {
-    // 1. Add standard CSS rules directly
-    vfs.add('live_theme.css', `
-        html, body { margin: 0; padding: 40px; height: 100%; overflow: hidden; font-family: monospace; background: #020617; color: #38bdf8; }
-        body { background: linear-gradient(-45deg, #ff007f, #7f00ff, #00bfff, #00ff7f, #ffea00, #ff007f) !important; background-size: 400% 400% !important; animation: rainbowShift 12s ease infinite !important; color: #ffffff !important; }
-        @keyframes rainbowShift { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
-    `, 'text/css');
 
-    // 2. Add traditional JavaScript code
-    vfs.add('index.js', `
-    console.log("VFS Engine: Spin test activated inside the seamless frame!");
-
-    // 1. Inject a global CSS animation rule directly into the frame's head
-    const styleNode = document.createElement('style');
-    styleNode.innerHTML = \`
-        @keyframes customSpinMatrix {
-            0% { transform: rotate(0deg); }
-            100% { transform: rotate(360deg); }
-        }
-        .vfs-spinning-target {
-            display: inline-block !important;
-            animation: customSpinMatrix 4s linear infinite !important;
+    // Remote Proxy Asset Grabber (Requires target destination to support CORS)
+    async importRemote(localFilename, remoteUrl, customMime = null) {
+        try {
+            console.log(`[VFS Proxy] Pulling remote source stream: ${remoteUrl}`);
+            const response = await fetch(remoteUrl);
+            if (!response.ok) throw new Error(`HTTP network fault code: ${response.status}`);
+            
+            const remoteTextContent = await response.text();
+            this.add(localFilename, remoteTextContent, customMime);
+            return true;
+        } catch (err) {
+            console.error(`[VFS Proxy Error] Could not map ${localFilename}:`, err);
+            return false;
         }
-    \`;
-    document.head.appendChild(styleNode);
-
-    // 2. Locate all text elements and wrap their text in spinning tags
-    function applySpinToText() {
-        // Target headers, paragraphs, lists, and span layers
-        const textElements = document.querySelectorAll('h1, h2, h3, p, span, li, div');
-        
-        textElements.forEach(element => {
-            // Ignore containers that have children to avoid breaking structure layouts
-            if (element.children.length === 0 && element.innerText.trim() !== '') {
-                const words = element.innerText.split(' ');
-                element.innerHTML = words.map(word => 
-                    \`<span class="vfs-spinning-target">\${word}</span>\`
-                ).join(' ');
-            }
-        });
     }
+};
+
+async function startDeveloperWorkspace() {
+    // 1. Target a real, open-source library on CDNJS (Canvas Confetti)
+    const remoteLibraryUrl = 'https://cdnjs.cloudflare.com/ajax/libs/canvas-confetti/1.9.3/confetti.browser.min.js';
+    
+    // 2. Map the remote asset to a virtual file named "my-confetti-engine.js"
+    const importSuccess = await vfs.importRemote('my-confetti-engine.js', remoteLibraryUrl, 'text/javascript');
 
-    // Run the spin cycle as soon as the virtual document structure loads
-    if (document.readyState === 'loading') {
-        document.addEventListener('DOMContentLoaded', applySpinToText);
-    } else {
-        applySpinToText();
+    if (!importSuccess) {
+        console.error("Failed to fetch library from CDNJS.");
+        return;
     }
-`, 'text/javascript');
 
-    // 3. Add the main index entry file using native, normal markup tags!
-    vfs.add('workspace.html', `
+    // 3. Create the standard HTML layout referencing the newly mapped virtual file
+    vfs.add('index.html', `
         <!DOCTYPE html>
         <html>
         <head>
             <meta charset="UTF-8">
+            <title>CDNJS Virtualization Demo</title>
             <link rel="stylesheet" href="live_theme.css?vfs=true">
         </head>
         <body>
-            <h2>Infrared Seamless Virtual Environment</h2>
-            <p>This layout runs seamlessly inside an entirely virtual context.</p>
+            <h2>CDNJS Virtualization Success!</h2>
+            <p>The confetti script was loaded out of memory as a local same-origin asset.</p>
+            
+            <script src="my-confetti-engine.js?vfs=true"></script>
             <script src="index.js?vfs=true"></script>
         </body>
         </html>
     `, 'text/html');
 
-    // 4. Point the auto-generated viewport to the entry path!
+    // 4. Standard Background Theme Layout
+    vfs.add('live_theme.css', `
+        html, body { margin: 0; padding: 40px; height: 100%; font-family: monospace; background: #020617; color: #f8fafc; text-align: center; }
+        body { background: linear-gradient(-45deg, #1e1b4b, #311042, #0f172a) !important; color: #ffffff !important; }
+        h2 { color: #38bdf8; text-shadow: 0 0 10px rgba(56, 189, 248, 0.4); }
+    `, 'text/css');
+
+    // 5. Execution Script: Call the global function initialized by the CDNJS script
+    vfs.add('index.js', `
+        console.log("Launcher script running. Invoking confetti...");
+        
+        // Ensure the library attached itself to the virtual window context safely
+        if (typeof window.confetti === 'function') {
+            // Fire an endless burst of celebratory confetti particles!
+            setInterval(() => {
+                window.confetti({
+                    particleCount: 50,
+                    spread: 60,
+                    origin: { y: 0.6 }
+                });
+            }, 1500);
+        } else {
+            console.error("Confetti engine not found in virtual window global scope.");
+        }
+    `, 'text/javascript');
+
+    // 6. Point the fullscreen viewport to the directory root
     const viewport = document.getElementById('canvas-viewport');
     if (viewport) {
-        viewport.src = 'workspace.html?vfs=true';
+        viewport.src = './?vfs=true';
     }
 }
 
-// Automatically bootstrap when document structure is verified
+// Global invocation hook listener
 document.addEventListener('DOMContentLoaded', async () => {
-    const ready = await window._vfsKernel.init();
-    if (ready) {
+    const isReady = await window._vfsKernel.init();
+    if (isReady) {
         startDeveloperWorkspace();
     }
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vfsjs-test",
-  "version": "1.0.13",
+  "version": "1.0.15",
   "description": "",
   "main": "index.html",
   "scripts": {

package/sw.js

@@ -1,33 +1,32 @@
-// sw.js - Version 1.0.8
+// sw.js - Version 1.1.2 (Shadow Router)
 const vfsStorage = new Map();
 
-const defaultMimes = {
-    'js': 'text/javascript',
-    'css': 'text/css',
-    'html': 'text/html',
-    'json': 'application/json'
-};
-
 self.addEventListener('install', e => e.waitUntil(self.skipWaiting()));
 self.addEventListener('activate', e => e.waitUntil(self.clients.claim()));
 
 self.addEventListener('fetch', (event) => {
     const url = new URL(event.request.url);
+    let filename = url.pathname.split('/').pop().split('?')[0];
     
-    // Strip paths and query parameters to get raw file names
-    const filename = url.pathname.split('/').pop().split('?')[0];
+    // ROUTING TRICK: If requesting the root domain "/" or "/index.html",
+    // prioritize our virtual memory database file!
+    if (filename === '' || url.pathname.endsWith('/')) {
+        filename = 'index.html';
+    }
+
     const isVfsExplicit = url.searchParams.get('vfs') === 'true';
 
-    // Intercept if we have the file in memory OR if the developer explicitly tagged it
+    // Intercept if it's our target index or explicitly tagged
     if (vfsStorage.has(filename) || isVfsExplicit) {
         event.respondWith(
-            // Use a short promise loop to wait if the asset hasn't finished writing to memory yet
             new Promise((resolve) => {
                 const checkFile = () => {
                     if (vfsStorage.has(filename)) {
                         const fileData = vfsStorage.get(filename);
                         const ext = filename.split('.').pop().toLowerCase();
-                        const contentType = fileData.mime || defaultMimes[ext] || 'application/octet-stream';
+                        
+                        const mimeMatrix = { 'js': 'text/javascript', 'css': 'text/css', 'html': 'text/html' };
+                        const contentType = fileData.mime || mimeMatrix[ext] || 'application/octet-stream';
 
                         resolve(new Response(fileData.content, {
                             status: 200,
@@ -38,8 +37,7 @@ self.addEventListener('fetch', (event) => {
                             }
                         }));
                     } else {
-                        // Retry shortly if the network thread beat the main thread execution
-                        setTimeout(checkFile, 10);
+                        setTimeout(checkFile, 5);
                     }
                 };
                 checkFile();
@@ -49,20 +47,7 @@ self.addEventListener('fetch', (event) => {
 });
 
 self.addEventListener('message', (event) => {
-    if (!event.data || !event.data.type) return;
-
-    switch (event.data.type) {
-        case 'VFS_WRITE':
-            vfsStorage.set(event.data.filename, {
-                content: event.data.content,
-                mime: event.data.mime || null
-            });
-            break;
-        case 'VFS_DELETE':
-            vfsStorage.delete(event.data.filename);
-            break;
-        case 'VFS_CLEAR':
-            vfsStorage.clear();
-            break;
+    if (event.data && event.data.type === 'VFS_WRITE') {
+        vfsStorage.set(event.data.filename, { content: event.data.content, mime: event.data.mime });
     }
 });

package/vfsjs.js

@@ -1,21 +1,21 @@
-// vfsjs.js - Automated Infrastructure Engine Core
+// vfsjs.js - Version 1.2.0 Automated Unified Kernel
 (function() {
     const encoder = new TextEncoder();
 
     const engineCore = {
         async init() {
             try {
-                // 1. Core Service Worker Registration
+                // 1. Establish background proxy thread interception
                 await navigator.serviceWorker.register('./sw.js');
                 if (!navigator.serviceWorker.controller) {
                     await new Promise(r => navigator.serviceWorker.addEventListener('controllerchange', r, { once: true }));
                 }
 
-                // 2. AUTOMATION UPGRADE: Enforce full-screen layout constraints on the main window
+                // 2. Structural Reset: Enforce full-screen boundary constraints on main window
                 Object.assign(document.documentElement.style, { width: '100%', height: '100%', overflow: 'hidden', margin: '0', padding: '0' });
                 Object.assign(document.body.style, { width: '100%', height: '100%', overflow: 'hidden', margin: '0', padding: '0', background: '#020617' });
 
-                // 3. AUTOMATION UPGRADE: Create and mount the seamless borderless canvas iframe
+                // 3. Viewport Ingestion: Spawn the seamless full-window workspace canvas iframe
                 const iframe = document.createElement('iframe');
                 iframe.id = 'canvas-viewport';
                 iframe.setAttribute('scrolling', 'no');
@@ -34,7 +34,7 @@
                 document.body.appendChild(iframe);
                 return true;
             } catch (err) {
-                console.error("VFS Kernel Boot Failure:", err);
+                console.error("VFS Static Initialization Failure:", err);
                 return false;
             }
         },
@@ -48,18 +48,6 @@
                 mime: customMime
             });
             return true;
-        },
-
-        remove(filename) {
-            if (!navigator.serviceWorker.controller) return false;
-            navigator.serviceWorker.controller.postMessage({ type: 'VFS_DELETE', filename: filename });
-            return true;
-        },
-
-        wipe() {
-            if (!navigator.serviceWorker.controller) return false;
-            navigator.serviceWorker.controller.postMessage({ type: 'VFS_CLEAR' });
-            return true;
         }
     };