vfsjs-test 1.0.22 → 1.0.23

package/main.js

@@ -1,39 +1,55 @@
-// main.js - Production Asset Orchestrator
+// main.js - Production Build Wrapper
 
 window.vfs = {
     add(filename, contentString, customMime = null) {
-        return window._vfsKernel.write(filename, contentString, customMime);
+        // Strip out query paths down to base keys
+        let cleanKey = filename.split('?')[0].split('/').pop();
+        window._vfsVirtualCache[cleanKey] = { content: contentString, mime: customMime };
+        console.log(`[VFS Cache] Staging file asset: ${cleanKey}`);
+        return true;
     },
 
     async importRemote(localFilename, remoteUrl, customMime = null) {
         try {
             const response = await fetch(remoteUrl);
-            if (!response.ok) throw new Error(`HTTP network error: ${response.status}`);
+            if (!response.ok) throw new Error(`HTTP Fault: ${response.status}`);
             const text = await response.text();
             this.add(localFilename, text, customMime);
             return true;
         } catch (err) {
-            console.error(`[VFS Proxy Error] Failed loading remote path:`, err);
+            console.error(`[VFS Proxy Error]`, err);
             return false;
         }
     }
 };
 
 async function buildProductionApplication() {
-    // 1. Map assets into the active Service Worker cache storage map first
-    vfs.add('app.js', `console.log("App running cleanly inside VFS!");`, 'text/javascript');
-    vfs.add('style.css', `body { background: #020617; color: #38bdf8; font-family: monospace; padding: 20px; }`, 'text/css');
+    // 1. Stage compilation data targets
+    vfs.add('app.js', `
+        console.log("Launcher script running. Invoking confetti...");
+        if (typeof window.confetti === 'function') {
+            setInterval(() => {
+                window.confetti({ particleCount: 40, spread: 50, origin: { y: 0.6 } });
+            }, 2000);
+        } else {
+            console.error("Confetti script missing from global iframe execution scope.");
+        }
+    `, 'text/javascript');
+
+    vfs.add('style.css', `
+        body { background: #020617 !important; color: #38bdf8 !important; font-family: monospace; padding: 40px; text-align: center; }
+        h2 { text-shadow: 0 0 8px rgba(56,189,248,0.5); }
+    `, 'text/css');
 
-    // 2. Fetch remote modules
+    // 2. Fetch CDNJS/jsDelivr packages that bypass scope paths safely
     await vfs.importRemote('my-confetti-engine.js', 'https://cdn.jsdelivr.net/npm/canvas-confetti@1.9.4/dist/confetti.browser.min.js', 'text/javascript');
 
-    // 3. CRITICAL: Everything is safely in memory. Signal the kernel to open the iframe viewport!
+    // 3. Compile and open viewport
     window._vfsKernel.openViewport();
 }
 
-// Polling initialization hook to bridge cleanly across asynchronous script loads
 (function verifyKernelAvailability() {
-    if (window._vfsKernel && navigator.serviceWorker.controller) {
+    if (window._vfsKernel) {
         buildProductionApplication();
     } else {
         setTimeout(verifyKernelAvailability, 10);

package/package.json

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

package/vfsjs.js

@@ -1,26 +1,24 @@
-// vfsjs.js - Version 5.0.0 (Production Synchronization Engine)
+// vfsjs.js - Version 6.0.0 (Zero-Network Tag Inline Engine)
 (function() {
-    const encoder = new TextEncoder();
-
     const engineCore = {
         async init() {
             try {
-                // 1. Boot the Service Worker thread
+                // 1. Boot Service Worker for the root frame route interception if needed
                 await navigator.serviceWorker.register('./sw.js');
                 if (!navigator.serviceWorker.controller) {
                     await new Promise(r => navigator.serviceWorker.addEventListener('controllerchange', r, { once: true }));
                 }
 
-                // 2. Capture raw HTML layout
-                const developerRawHtml = `<!DOCTYPE html>\n<html>${document.documentElement.innerHTML}</html>`;
-                this.write('index.html', developerRawHtml, 'text/html');
+                // 2. Capture the developer's original raw HTML string structure
+                const rawHtml = document.documentElement.innerHTML;
+                window._vfsRawTemplate = `<!DOCTYPE html>\n<html>${rawHtml}</html>`;
 
-                // 3. Clear window layout & lock sizing boundaries
+                // 3. Clear parent UI layout instantly
                 document.documentElement.innerHTML = ''; 
                 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' });
 
-                // 4. Create the iframe canvas, but leave it blank (src="") so it doesn't request files yet!
+                // 4. Create the pristine layout iframe container
                 const iframe = document.createElement('iframe');
                 iframe.id = 'canvas-viewport';
                 Object.assign(iframe.style, {
@@ -31,44 +29,57 @@
 
                 return true;
             } catch (err) {
-                console.error("VFS Kernel Initialization Fault:", err);
+                console.error("VFS Critical Bootstrap Failure:", err);
                 return false;
             }
         },
 
-        // Called exclusively by main.js once all local/remote files are committed to memory
+        // Called by main.js after vfs.add loops complete
         openViewport() {
             const iframe = document.getElementById('canvas-viewport');
-            if (iframe) {
-                console.log("[VFS Kernel] Memory mapping complete. Opening virtual system pipeline.");
-                iframe.src = './?vfs=true';
-            }
-        },
+            if (!iframe) return;
 
-        write(filename, contentString, customMime) {
-            if (!navigator.serviceWorker.controller) return false;
-            
-            let cleanKey = filename.split('?')[0];
-            if (cleanKey.includes('/')) {
-                cleanKey = cleanKey.split('/').pop();
-            }
+            // Create a virtual document parser out of our captured template
+            const parser = new DOMParser();
+            const doc = parser.parseFromString(window._vfsRawTemplate, 'text/html');
 
-            if (!customMime) {
-                const ext = cleanKey.split('.').pop().toLowerCase();
-                const mimeMatrix = { 'js': 'text/javascript', 'css': 'text/css', 'html': 'text/html', 'json': 'application/json' };
-                customMime = mimeMatrix[ext] || 'application/octet-stream';
-            }
+            // 1. Process and inline all marked script tags out of VFS memory maps
+            const scripts = Array.from(doc.querySelectorAll('script[src*="vfs=true"]'));
+            scripts.forEach(script => {
+                const srcAttr = script.getAttribute('src').split('?')[0].split('/').pop();
+                const virtualCode = window._vfsVirtualCache[srcAttr];
+                
+                if (virtualCode) {
+                    const inlineScript = doc.createElement('script');
+                    inlineScript.textContent = virtualCode.content;
+                    script.parentNode.replaceChild(inlineScript, script);
+                }
+            });
 
-            navigator.serviceWorker.controller.postMessage({
-                type: 'VFS_WRITE',
-                filename: cleanKey,
-                content: encoder.encode(contentString),
-                mime: customMime
+            // 2. Process and inline all marked style sheets out of VFS memory maps
+            const links = Array.from(doc.querySelectorAll('link[rel="stylesheet"][href*="vfs=true"]'));
+            links.forEach(link => {
+                const hrefAttr = link.getAttribute('href').split('?')[0].split('/').pop();
+                const virtualCSS = window._vfsVirtualCache[hrefAttr];
+                
+                if (virtualCSS) {
+                    const inlineStyle = doc.createElement('style');
+                    inlineStyle.textContent = virtualCSS.content;
+                    link.parentNode.replaceChild(inlineStyle, link);
+                }
             });
-            return true;
+
+            // 3. Convert modified dynamic DOM tree back to a string bundle
+            const compilationOutput = `<!DOCTYPE html>\n<html>${doc.documentElement.innerHTML}</html>`;
+
+            // 4. Inject compilation cleanly via srcdoc to bypass unpkg scope boundaries completely!
+            iframe.srcdoc = compilationOutput;
+            console.log("[VFS Kernel] Execution compilation injected successfully via srcdoc channel.");
         }
     };
 
+    // Shared internal key store memory map allocation
+    window._vfsVirtualCache = {};
     window._vfsKernel = engineCore;
 
     if (document.readyState === 'loading') {