nova64 0.2.5 → 0.2.6

package/dist/examples/storage-quest/code.js

@@ -0,0 +1,209 @@
+// examples/storage-quest/code.js
+// Demonstrates Nova64's persistent storage API.
+// Collect gems to earn points, upgrade your ship, and watch everything
+// persist across full page reloads via saveData/loadData.
+
+const SAVE_KEY = 'storagequest';
+const GEM_COLORS = [0xffdd00, 0x00ffaa, 0xff4488, 0x44aaff];
+const UPGRADE_COST = [0, 50, 150, 400]; // cumulative cost per level (level 0 = start)
+
+let state; // the persistent game state
+let ship;
+let gems = [];
+let particles = [];
+let upgradeFlash = 0;
+let saveFlash = 0;
+
+function defaultState() {
+  return { score: 0, highScore: 0, level: 1, shipLevel: 0, totalGems: 0, runs: 0 };
+}
+
+function spawnGems(count) {
+  for (let i = 0; i < count; i++) {
+    const angle = Math.random() * Math.PI * 2;
+    const r = 3 + Math.random() * 6;
+    const color = GEM_COLORS[(gems.length + i) % GEM_COLORS.length];
+    gems.push({
+      mesh: createSphere(0.25, color, [Math.cos(angle) * r, 0.5, Math.sin(angle) * r], 6, {
+        material: 'holographic',
+        emissive: color,
+      }),
+      x: Math.cos(angle) * r,
+      z: Math.sin(angle) * r,
+      spin: Math.random() * Math.PI * 2,
+      color,
+    });
+  }
+}
+
+export function init() {
+  // Load persistent state or create fresh
+  state = loadData(SAVE_KEY, defaultState());
+  state.runs = (state.runs || 0) + 1;
+
+  setCameraPosition(0, 12, 16);
+  setCameraTarget(0, 0, 0);
+  setAmbientLight(0x334466, 1.1);
+  setFog(0x050515, 20, 45);
+
+  // Ground
+  const ground = createPlane(30, 30, 0x0a0a22, [0, 0, 0]);
+  rotateMesh(ground, -Math.PI / 2, 0, 0);
+
+  // Ship color reflects upgrade level
+  const shipColors = [0x0088ff, 0x00ffaa, 0xffaa00, 0xff44aa];
+  const sz = 0.5 + state.shipLevel * 0.15;
+  ship = createCube(sz * 2, shipColors[state.shipLevel % shipColors.length], [0, 0.6, 0], {
+    material: 'metallic',
+    emissive: 0x002244,
+  });
+
+  spawnGems(5 + state.level * 2);
+}
+
+export function update(dt) {
+  const speed = 4 + state.shipLevel * 0.8;
+  let mx = 0,
+    mz = 0;
+  if (key('KeyW') || key('ArrowUp')) mz -= speed * dt;
+  if (key('KeyS') || key('ArrowDown')) mz += speed * dt;
+  if (key('KeyA') || key('ArrowLeft')) mx -= speed * dt;
+  if (key('KeyD') || key('ArrowRight')) mx += speed * dt;
+
+  // Move ship — read position, apply delta, write back
+  const pos = getMeshPosition(ship);
+  const nx = Math.max(-13, Math.min(13, pos.x + mx));
+  const nz = Math.max(-13, Math.min(13, pos.z + mz));
+  setPosition(ship, nx, pos.y, nz);
+  rotateMesh(ship, 0, dt * 0.5, 0);
+
+  // Gem spin and collection
+  gems = gems.filter(g => {
+    g.spin += dt * 1.2;
+    rotateMesh(g.mesh, dt * 0.5, dt, 0);
+    const dist = Math.hypot(nx - g.x, nz - g.z);
+    if (dist < 1.0) {
+      // Collect!
+      removeMesh(g.mesh);
+      state.score += 10 * state.level;
+      state.totalGems++;
+      if (state.score > state.highScore) state.highScore = state.score;
+      sfx('coin');
+      // Spawn particle burst
+      for (let p = 0; p < 6; p++) {
+        particles.push({
+          x: g.x,
+          y: 0.5,
+          z: g.z,
+          vx: (Math.random() - 0.5) * 4,
+          vy: 1 + Math.random() * 2,
+          vz: (Math.random() - 0.5) * 4,
+          life: 0.6,
+          color: g.color,
+          mesh: createSphere(0.1, g.color, [g.x, 0.5, g.z], 4),
+        });
+      }
+      return false;
+    }
+    return true;
+  });
+
+  // Auto-save and level up when all gems collected
+  if (gems.length === 0) {
+    state.level++;
+    saveData(SAVE_KEY, state);
+    saveFlash = 1.5;
+    sfx('powerup');
+    spawnGems(5 + state.level * 2);
+  }
+
+  // Particles
+  particles = particles.filter(p => {
+    p.vy -= 3 * dt;
+    p.x += p.vx * dt;
+    p.y += p.vy * dt;
+    p.z += p.vz * dt;
+    p.life -= dt;
+    setPosition(p.mesh, p.x, p.y, p.z);
+    if (p.life <= 0) {
+      removeMesh(p.mesh);
+      return false;
+    }
+    return true;
+  });
+
+  // Upgrade ship (press U)
+  if (keyp('KeyU') && state.shipLevel < 3) {
+    const cost = UPGRADE_COST[state.shipLevel + 1];
+    if (state.score >= cost) {
+      state.score -= cost;
+      state.shipLevel++;
+      saveData(SAVE_KEY, state);
+      saveFlash = 1.5;
+      upgradeFlash = 2;
+      sfx('powerup');
+    }
+  }
+
+  // Manual save (press Enter)
+  if (keyp('Enter')) {
+    saveData(SAVE_KEY, state);
+    saveFlash = 1.5;
+    sfx('confirm');
+  }
+
+  // Reset save (press R + Shift together)
+  if (key('ShiftLeft') && keyp('KeyR')) {
+    deleteData(SAVE_KEY);
+    state = defaultState();
+    saveFlash = 1.5;
+    sfx('error');
+  }
+
+  upgradeFlash = Math.max(0, upgradeFlash - dt);
+  saveFlash = Math.max(0, saveFlash - dt);
+}
+
+export function draw() {
+  // Header
+  rect(0, 0, 320, 18, rgba8(10, 5, 30, 255), true);
+  printCentered('STORAGE QUEST', 4, 0xffffff);
+
+  // Score panel
+  rect(4, 22, 150, 60, rgba8(15, 10, 40, 200), true);
+  rect(4, 22, 150, 60, rgba8(60, 40, 120, 180), false);
+  print(`SCORE`, 10, 27, 0xaaaaff);
+  print(`${state.score}`, 10, 36, 0xffffff);
+  print(`BEST: ${state.highScore}`, 10, 46, 0x888888);
+  print(`LEVEL: ${state.level}`, 10, 56, 0x88aaff);
+  print(`GEMS: ${state.totalGems}`, 10, 66, 0xffdd44);
+
+  // Persistence panel
+  rect(160, 22, 156, 60, rgba8(15, 10, 40, 200), true);
+  rect(160, 22, 156, 60, rgba8(60, 40, 120, 180), false);
+  print('PERSISTENT DATA', 166, 27, 0xaaaaff);
+  print(`Runs: ${state.runs}`, 166, 37, 0xdddddd);
+  print(`Ship lvl: ${state.shipLevel}`, 166, 47, 0xdddddd);
+  const nextCost = state.shipLevel < 3 ? UPGRADE_COST[state.shipLevel + 1] : 'MAX';
+  print(`Upgrade: ${nextCost}pts`, 166, 57, 0xffaa44);
+  print('(U to upgrade)', 166, 67, 0x555577);
+
+  // Save indicator
+  if (saveFlash > 0) {
+    const alpha = Math.floor((saveFlash / 1.5) * 220);
+    rect(100, 86, 120, 12, rgba8(0, 180, 100, alpha), true);
+    print(
+      upgradeFlash > 0 ? 'SHIP UPGRADED!' : 'DATA SAVED!',
+      112,
+      89,
+      upgradeFlash > 0 ? 0xffdd00 : 0xffffff
+    );
+  }
+
+  // Gem counter
+  print(`Gems remaining: ${gems.length}`, 10, 90, 0xdddddd);
+
+  // Controls footer
+  rect(0, 170, 320, 10, rgba8(10, 5, 30, 255), true);
+  print('WASD: move  U: upgrade  Enter: save  Shift+R: reset', 2, 172, 0x333355);
+}

package/dist/examples/strider-demo-3d/IMPROVEMENT_OPTIONS.md

@@ -0,0 +1,285 @@
+# Shadow Ninja 3D - Improvement Options
+
+## Current Problems & Solutions
+
+### 🔴 **What Was Wrong:**
+
+1. **Broken Physics**
+   - Collision detection was unreliable
+   - Player would fall through platforms
+   - No proper ground detection
+2. **Bad Level Design**
+   - Platforms at random Z positions (confusing depth)
+   - No progression or tutorial
+   - Unclear where to go
+3. **Poor Controls**
+   - No coyote time (grace period after leaving platform)
+   - No jump buffering (early jump presses ignored)
+   - Difficult to land jumps
+4. **Terrible Visuals**
+   - Dark colors that hide gameplay
+   - Abstract shapes instead of characters
+   - No visual feedback
+
+### ✅ **What's Been Fixed (code-fixed.js):**
+
+1. **Proper Platformer Physics**
+   - Reliable AABB collision detection
+   - Coyote time (150ms grace after leaving platform)
+   - Jump buffering (100ms early jump window)
+   - Air control vs ground control
+   - Proper gravity and friction
+
+2. **Professional Level Design**
+   - Tutorial section (teaches basics)
+   - Easy section (builds confidence)
+   - Medium section (introduces challenges)
+   - Hard section (tests skills)
+   - Victory area
+   - All platforms on same Z plane (no confusing depth)
+
+3. **Responsive Controls**
+   - Arrow keys for movement
+   - Space for jump
+   - Works immediately, feels good
+
+4. **Clear Visual Design**
+   - Bright, visible colors
+   - Clear character with eyes and feet
+   - Animated movement (foot bobbing when walking)
+   - Coin rotation and bobbing
+
+## 🎨 **Options to Make It Even Better:**
+
+### Option 1: Use Free GLB Models (Best Quality)
+
+**Where to get models:**
+
+- [Poly Pizza](https://poly.pizza) - Free low-poly models
+- [Sketchfab](https://sketchfab.com/search?features=downloadable&licenses=7c23a1ba438d4306920229c12afcb5f&type=models) - Free Creative Commons models
+- [Quaternius](http://quaternius.com/assets.html) - Free game assets
+- [Kenney Assets](https://kenney.nl/assets) - Free game models
+
+**To use GLB models:**
+
+1. Download a ninja/character GLB file
+2. Place in `/public/models/ninja.glb`
+3. Set `CONFIG.USE_GLB_MODELS = true` in code-fixed.js
+4. The game will automatically load and render the model
+
+**Example models:**
+
+```javascript
+// Ninja character
+await loadModel('/models/ninja.glb', [0, 2, 0], 1);
+
+// Platform models
+await loadModel('/models/platform.glb', [x, y, 0], 1);
+
+// Coin models
+await loadModel('/models/coin.glb', [x, y, 0], 0.3);
+
+// Enemy models
+await loadModel('/models/enemy.glb', [x, y, 0], 0.8);
+```
+
+### Option 2: Improve Graphics with Textures
+
+Add textures to the simple geometry:
+
+```javascript
+const texture = await loadTexture('/textures/character.png');
+const material = createTexturedMaterial(texture);
+```
+
+### Option 3: Add More Game Features
+
+**Easy additions:**
+
+- Double jump
+- Dash ability
+- Wall jump
+- Moving platforms
+- Collectible power-ups
+- Particle effects on landing
+- Sound effects
+
+**Example - Double Jump:**
+
+```javascript
+let doubleJumpAvailable = true;
+
+// In updateInput:
+if (isKeyPressed('Space')) {
+  if (player.grounded) {
+    player.vel.y = CONFIG.JUMP_POWER;
+    doubleJumpAvailable = true;
+  } else if (doubleJumpAvailable) {
+    player.vel.y = CONFIG.JUMP_POWER;
+    doubleJumpAvailable = false;
+  }
+}
+```
+
+### Option 4: Add Procedural Level Generation
+
+Generate levels automatically:
+
+```javascript
+function generateLevel(difficulty) {
+  for (let i = 0; i < 50; i++) {
+    const x = i * 5;
+    const y = 2 + Math.random() * difficulty * 3;
+    addPlatform(x, y, 3 + Math.random() * 2);
+
+    if (Math.random() < 0.3) addCoin(x, y + 2);
+    if (Math.random() < 0.2) addEnemy(x, y + 1);
+  }
+}
+```
+
+### Option 5: Add Visual Polish
+
+**Particle systems:**
+
+```javascript
+// Jump dust particles
+function createJumpDust() {
+  for (let i = 0; i < 5; i++) {
+    const particle = createSphere(0.1, 0xcccccc, [
+      player.pos.x + (Math.random() - 0.5),
+      player.pos.y - 1,
+      player.pos.z,
+    ]);
+    // Animate and fade out
+  }
+}
+```
+
+**Camera shake on impact:**
+
+```javascript
+function shakeCamera(intensity) {
+  camera.pos.x += (Math.random() - 0.5) * intensity;
+  camera.pos.y += (Math.random() - 0.5) * intensity;
+}
+```
+
+## 🚀 **Recommended Next Steps:**
+
+### Immediate (Do This Now):
+
+1. ✅ **Use code-fixed.js** instead of current code.js
+2. Test the game - it should actually work!
+3. Adjust CONFIG values for difficulty
+
+### Short Term (1-2 hours):
+
+1. Download free GLB models from Poly Pizza
+2. Add them to the project
+3. Enable `USE_GLB_MODELS` flag
+4. Add double jump ability
+5. Add particle effects
+
+### Medium Term (1 day):
+
+1. Create multiple levels
+2. Add boss fights
+3. Add combo system
+4. Add checkpoints
+5. Add sound effects
+
+### Long Term (1 week):
+
+1. Procedural level generation
+2. Multiplayer racing mode
+3. Level editor
+4. Mobile controls
+5. Leaderboards
+
+## 📝 **How to Use code-fixed.js:**
+
+1. **Rename files:**
+
+   ```bash
+   cd /Users/brendonsmith/exp/nova64/examples/strider-demo-3d
+   mv code.js code-old.js
+   mv code-fixed.js code.js
+   ```
+
+2. **Refresh browser** - game should now work properly!
+
+3. **Test the improvements:**
+   - Jump should feel responsive
+   - Landing on platforms should be reliable
+   - Level progression should be clear
+   - Character should be visible
+
+## 🎮 **Expected Results:**
+
+### Before (code-old.js):
+
+- ❌ Player falls through platforms
+- ❌ Jumps feel unresponsive
+- ❌ Unclear where to go
+- ❌ Dark and confusing visuals
+- ❌ Not fun to play
+
+### After (code-fixed.js):
+
+- ✅ Reliable collision detection
+- ✅ Jumps feel good (coyote time + buffering)
+- ✅ Clear level progression
+- ✅ Bright, visible graphics
+- ✅ Actually fun to play!
+
+## 🔧 **Tuning the Game:**
+
+Edit CONFIG values in code-fixed.js:
+
+```javascript
+const CONFIG = {
+  PLAYER_SPEED: 8, // ← Make character faster/slower
+  JUMP_POWER: 12, // ← Make jumps higher/lower
+  GRAVITY: 30, // ← Change gravity strength
+  CAMERA_DISTANCE: 15, // ← Zoom in/out
+  // etc...
+};
+```
+
+## 📊 **Performance:**
+
+The fixed version is actually MORE performant because:
+
+- Simpler collision detection
+- Fewer objects in scene
+- Better organized code
+- No unnecessary calculations
+
+## 🆘 **Still Having Issues?**
+
+If the game still doesn't feel right:
+
+1. **Check console for errors**
+2. **Verify all platforms are at Z=0**
+3. **Test jump timing (should be forgiving)**
+4. **Check collision box sizes match visuals**
+5. **Ensure camera follows smoothly**
+
+## 🎯 **The Real Problem:**
+
+The original code tried to do too much:
+
+- Complex enemy AI before basic physics worked
+- Grappling hooks before basic jumps worked
+- Wall running before collision detection worked
+- Fancy graphics before gameplay worked
+
+**Good game design order:**
+
+1. ✅ Physics and collision (make it work)
+2. ✅ Basic movement (make it feel good)
+3. ✅ Simple level (prove it's fun)
+4. Then add: Polish, features, graphics, etc.
+
+The new code follows this principle. Start simple, make it work, then iterate!

package/dist/examples/strider-demo-3d/cache-test.html

@@ -0,0 +1,132 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Knight Platformer - Cache Diagnostic</title>
+    <style>
+        body {
+            font-family: monospace;
+            padding: 20px;
+            background: #1a1a1a;
+            color: #00ff00;
+        }
+        .status {
+            padding: 10px;
+            margin: 10px 0;
+            border-radius: 5px;
+        }
+        .good { background: #002200; border: 2px solid #00ff00; }
+        .bad { background: #220000; border: 2px solid #ff0000; color: #ff6666; }
+        .info { background: #001122; border: 2px solid #6666ff; color: #aaaaff; }
+        button {
+            background: #4444ff;
+            color: white;
+            padding: 10px 20px;
+            border: none;
+            border-radius: 5px;
+            cursor: pointer;
+            margin: 5px;
+        }
+        button:hover { background: #6666ff; }
+        pre {
+            background: #000;
+            padding: 10px;
+            border-radius: 5px;
+            overflow-x: auto;
+        }
+    </style>
+</head>
+<body>
+    <h1>🥷 Knight Platformer - Cache Diagnostic</h1>
+    
+    <div id="results"></div>
+    
+    <button onclick="runTest()">🔍 Test Cache Status</button>
+    <button onclick="clearAndReload()">🔄 Clear & Reload Game</button>
+    <button onclick="openIncognito()">🕵️ Instructions for Incognito</button>
+    
+    <script>
+        async function runTest() {
+            const results = document.getElementById('results');
+            results.innerHTML = '<h2>Testing...</h2>';
+            
+            try {
+                // Fetch the code.js file with cache-busting
+                const response = await fetch('./code.js?t=' + Date.now());
+                const code = await response.text();
+                
+                let html = '<h2>Test Results:</h2>';
+                
+                // Check for triple emoji (correct code)
+                if (code.includes('🎯🎯🎯 START BUTTON CLICKED AT')) {
+                    html += '<div class="status good">✅ SERVER HAS CORRECT CODE (Triple emoji found)</div>';
+                } else if (code.includes('🎯 START BUTTON CLICKED!')) {
+                    html += '<div class="status bad">❌ SERVER HAS OLD CODE (Single emoji found)</div>';
+                } else {
+                    html += '<div class="status bad">❌ CANNOT FIND BUTTON CALLBACK</div>';
+                }
+                
+                // Check cache buster
+                if (code.includes('CACHE-BUST-FINAL-001-REFRESH-NOW')) {
+                    html += '<div class="status good">✅ Latest cache-buster present</div>';
+                } else {
+                    html += '<div class="status bad">❌ Old or missing cache-buster</div>';
+                }
+                
+                // Check for module-level callback
+                if (code.includes('const startGameCallback = ()')) {
+                    html += '<div class="status good">✅ Callback at module level</div>';
+                } else {
+                    html += '<div class="status bad">❌ Callback not at module level</div>';
+                }
+                
+                // Show first 50 lines
+                const lines = code.split('\n').slice(0, 50);
+                html += '<div class="status info">';
+                html += '<h3>First 50 lines of code.js from server:</h3>';
+                html += '<pre>' + lines.join('\n').replace(/</g, '&lt;').replace(/>/g, '&gt;') + '</pre>';
+                html += '</div>';
+                
+                // Instructions
+                html += '<div class="status info">';
+                html += '<h3>📋 To Fix Browser Cache:</h3>';
+                html += '<ol>';
+                html += '<li><strong>Mac:</strong> Press Cmd + Shift + R</li>';
+                html += '<li><strong>Windows/Linux:</strong> Press Ctrl + Shift + F5</li>';
+                html += '<li><strong>Or:</strong> Open Developer Tools (F12) → Right-click refresh → "Empty Cache and Hard Reload"</li>';
+                html += '<li><strong>Or:</strong> Open in incognito/private window</li>';
+                html += '</ol>';
+                html += '</div>';
+                
+                results.innerHTML = html;
+                
+            } catch (error) {
+                results.innerHTML = `<div class="status bad">❌ Error: ${error.message}</div>`;
+            }
+        }
+        
+        function clearAndReload() {
+            // Try to clear cache via JavaScript (limited effect)
+            if ('caches' in window) {
+                caches.keys().then(names => {
+                    names.forEach(name => caches.delete(name));
+                });
+            }
+            
+            alert('Cache cleared (partial). Now do a HARD RELOAD:\n\nMac: Cmd + Shift + R\nWindows: Ctrl + Shift + F5');
+            
+            // Reload with cache bust
+            setTimeout(() => {
+                window.location.href = '../strider-demo-3d/?cachebust=' + Date.now();
+            }, 1000);
+        }
+        
+        function openIncognito() {
+            const url = window.location.origin + '/examples/strider-demo-3d/';
+            alert(`Open this URL in an incognito/private window:\n\n${url}\n\nChrome/Edge: Ctrl+Shift+N\nFirefox: Ctrl+Shift+P\nSafari: Cmd+Shift+N`);
+        }
+        
+        // Run test on load
+        runTest();
+    </script>
+</body>
+</html>