vfsjs-test 1.0.12 → 1.0.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/index.html +1 -10
  2. package/main.js +32 -26
  3. package/package.json +1 -1
  4. package/sw.js +15 -30
package/index.html CHANGED
@@ -7,16 +7,7 @@
7
7
 
8
8
  <script src="vfsjs.js"></script>
9
9
  <script src="main.js"></script>
10
-
11
- <link rel="stylesheet" href="live_theme.css?vfs=true">
12
10
  </head>
13
- <body style="background: #0f172a; color: #38bdf8; font-family: monospace; padding: 20px;">
14
-
15
- <h2>Infrared Advanced VFS Core</h2>
16
- <div id="status" style="background: #020617; border: 1px solid #334155; padding: 15px; height: 180px; color: #f1f5f9; line-height: 1.6; overflow-y: auto;">
17
- > Initializing isolated modular framework...
18
- </div>
19
-
20
- <script src="index.js?vfs=true"></script>
11
+ <body>
21
12
  </body>
22
13
  </html>
package/main.js CHANGED
@@ -1,53 +1,59 @@
1
- // main.js - Developer Workspace API
1
+ // main.js - Standardized Developer Environment Bootstrapper
2
2
 
3
3
  window.vfs = {
4
4
  add(filename, contentString, customMime = null) {
5
5
  return window._vfsKernel.write(filename, contentString, customMime);
6
- },
7
- delete(filename) { return window._vfsKernel.remove(filename); },
8
- clear() { return window._vfsKernel.wipe(); }
6
+ }
9
7
  };
10
8
 
11
9
  async function startDeveloperWorkspace() {
12
- // 1. Add standard CSS rules directly
13
- vfs.add('live_theme.css', `
14
- html, body { margin: 0; padding: 40px; height: 100%; overflow: hidden; font-family: monospace; background: #020617; color: #38bdf8; }
15
- 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; }
16
- @keyframes rainbowShift { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
17
- `, 'text/css');
18
-
19
- // 2. Add traditional JavaScript code
20
- vfs.add('index.js', `
21
- console.log("Normal layout execution script loaded smoothly!");
22
- `, 'text/javascript');
23
-
24
- // 3. Add the main index entry file using native, normal markup tags!
25
- vfs.add('workspace.html', `
10
+ // 1. Developer creates a perfectly normal index.html layout!
11
+ vfs.add('index.html', `
26
12
  <!DOCTYPE html>
27
13
  <html>
28
14
  <head>
29
15
  <meta charset="UTF-8">
16
+ <title>My Normal Project</title>
30
17
  <link rel="stylesheet" href="live_theme.css?vfs=true">
31
18
  </head>
32
19
  <body>
33
- <h2>Infrared Seamless Virtual Environment</h2>
34
- <p>This layout runs seamlessly inside an entirely virtual context.</p>
20
+ <h1>Infrared Seamless Workspace</h1>
21
+ <p>Writing standard file structures entirely in memory.</p>
22
+
35
23
  <script src="index.js?vfs=true"></script>
36
24
  </body>
37
25
  </html>
38
26
  `, 'text/html');
39
27
 
40
- // 4. Point the auto-generated viewport to the entry path!
28
+ // 2. Developer maps standard styling files
29
+ vfs.add('live_theme.css', `
30
+ html, body { margin: 0; padding: 40px; font-family: monospace; }
31
+ 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; }
32
+ @keyframes rainbowShift { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
33
+ `, 'text/css');
34
+
35
+ // 3. Developer maps the text spin script we built
36
+ vfs.add('index.js', `
37
+ console.log("Flawless execution!");
38
+ const styleNode = document.createElement('style');
39
+ styleNode.innerHTML = '@keyframes spin { 0% { transform:rotate(0deg); } 100% { transform:rotate(360deg); } } .spin { display: inline-block; animation: spin 4s linear infinite; }';
40
+ document.head.appendChild(styleNode);
41
+
42
+ const p = document.querySelector('p');
43
+ if (p) {
44
+ p.innerHTML = p.innerText.split(' ').map(w => \`<span class="spin">\${w}</span>\`).join(' ');
45
+ }
46
+ `, 'text/javascript');
47
+
48
+ // 4. Fire up the viewport! Pointing to "./?vfs=true" forces the Service Worker
49
+ // to step in and serve our VIRTUAL index.html instead of the physical server one.
41
50
  const viewport = document.getElementById('canvas-viewport');
42
51
  if (viewport) {
43
- viewport.src = 'workspace.html?vfs=true';
52
+ viewport.src = './?vfs=true';
44
53
  }
45
54
  }
46
55
 
47
- // Automatically bootstrap when document structure is verified
48
56
  document.addEventListener('DOMContentLoaded', async () => {
49
57
  const ready = await window._vfsKernel.init();
50
- if (ready) {
51
- startDeveloperWorkspace();
52
- }
58
+ if (ready) startDeveloperWorkspace();
53
59
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vfsjs-test",
3
- "version": "1.0.12",
3
+ "version": "1.0.14",
4
4
  "description": "",
5
5
  "main": "index.html",
6
6
  "scripts": {
package/sw.js CHANGED
@@ -1,33 +1,32 @@
1
- // sw.js - Version 1.0.8
1
+ // sw.js - Version 1.1.2 (Shadow Router)
2
2
  const vfsStorage = new Map();
3
3
 
4
- const defaultMimes = {
5
- 'js': 'text/javascript',
6
- 'css': 'text/css',
7
- 'html': 'text/html',
8
- 'json': 'application/json'
9
- };
10
-
11
4
  self.addEventListener('install', e => e.waitUntil(self.skipWaiting()));
12
5
  self.addEventListener('activate', e => e.waitUntil(self.clients.claim()));
13
6
 
14
7
  self.addEventListener('fetch', (event) => {
15
8
  const url = new URL(event.request.url);
9
+ let filename = url.pathname.split('/').pop().split('?')[0];
16
10
 
17
- // Strip paths and query parameters to get raw file names
18
- const filename = url.pathname.split('/').pop().split('?')[0];
11
+ // ROUTING TRICK: If requesting the root domain "/" or "/index.html",
12
+ // prioritize our virtual memory database file!
13
+ if (filename === '' || url.pathname.endsWith('/')) {
14
+ filename = 'index.html';
15
+ }
16
+
19
17
  const isVfsExplicit = url.searchParams.get('vfs') === 'true';
20
18
 
21
- // Intercept if we have the file in memory OR if the developer explicitly tagged it
19
+ // Intercept if it's our target index or explicitly tagged
22
20
  if (vfsStorage.has(filename) || isVfsExplicit) {
23
21
  event.respondWith(
24
- // Use a short promise loop to wait if the asset hasn't finished writing to memory yet
25
22
  new Promise((resolve) => {
26
23
  const checkFile = () => {
27
24
  if (vfsStorage.has(filename)) {
28
25
  const fileData = vfsStorage.get(filename);
29
26
  const ext = filename.split('.').pop().toLowerCase();
30
- const contentType = fileData.mime || defaultMimes[ext] || 'application/octet-stream';
27
+
28
+ const mimeMatrix = { 'js': 'text/javascript', 'css': 'text/css', 'html': 'text/html' };
29
+ const contentType = fileData.mime || mimeMatrix[ext] || 'application/octet-stream';
31
30
 
32
31
  resolve(new Response(fileData.content, {
33
32
  status: 200,
@@ -38,8 +37,7 @@ self.addEventListener('fetch', (event) => {
38
37
  }
39
38
  }));
40
39
  } else {
41
- // Retry shortly if the network thread beat the main thread execution
42
- setTimeout(checkFile, 10);
40
+ setTimeout(checkFile, 5);
43
41
  }
44
42
  };
45
43
  checkFile();
@@ -49,20 +47,7 @@ self.addEventListener('fetch', (event) => {
49
47
  });
50
48
 
51
49
  self.addEventListener('message', (event) => {
52
- if (!event.data || !event.data.type) return;
53
-
54
- switch (event.data.type) {
55
- case 'VFS_WRITE':
56
- vfsStorage.set(event.data.filename, {
57
- content: event.data.content,
58
- mime: event.data.mime || null
59
- });
60
- break;
61
- case 'VFS_DELETE':
62
- vfsStorage.delete(event.data.filename);
63
- break;
64
- case 'VFS_CLEAR':
65
- vfsStorage.clear();
66
- break;
50
+ if (event.data && event.data.type === 'VFS_WRITE') {
51
+ vfsStorage.set(event.data.filename, { content: event.data.content, mime: event.data.mime });
67
52
  }
68
53
  });