create-threejs-game 1.0.0

package/template/scripts/generate-tdd.js

@@ -0,0 +1,283 @@
+#!/usr/bin/env node
+
+/**
+ * TDD Generation Script
+ * 
+ * Uses Claude API (Opus 4.5) to generate a Technical Design Document
+ * based on the PRD, assets, and concept mockup.
+ * 
+ * Usage:
+ *   node generate-tdd.js
+ * 
+ * Requires:
+ *   - config.json with anthropic.api_key and game settings
+ *   - docs/prd.md (run generate-prd.js first)
+ *   - public/{game_name}/concept.jpg
+ *   - public/assets/{game_name}/assets.json
+ */
+
+const fs = require('fs');
+const path = require('path');
+const https = require('https');
+
+// Load config
+const scriptDir = __dirname;
+const projectRoot = path.join(scriptDir, '..');
+const configPath = path.join(scriptDir, 'config.json');
+
+if (!fs.existsSync(configPath)) {
+  console.error('Error: config.json not found');
+  process.exit(1);
+}
+
+const config = JSON.parse(fs.readFileSync(configPath, 'utf-8'));
+const { anthropic, game } = config;
+
+// Check config first, then env vars
+const apiKey = (anthropic?.api_key && !anthropic.api_key.includes('YOUR_'))
+  ? anthropic.api_key
+  : process.env.ANTHROPIC_API_KEY;
+
+if (!apiKey) {
+  console.error('Error: Anthropic API key not found');
+  console.error('Set ANTHROPIC_API_KEY env var or configure scripts/config.json');
+  process.exit(1);
+}
+
+// Use resolved key
+anthropic.api_key = apiKey;
+
+// Paths
+const prdPath = path.join(projectRoot, 'docs', 'prd.md');
+const conceptPath = path.join(projectRoot, 'public', game.name, 'concept.jpg');
+const assetsJsonPath = path.join(projectRoot, 'public', 'assets', game.name, 'assets.json');
+const previewPath = path.join(projectRoot, 'public', 'assets', game.name, 'Preview.jpg');
+const outputPath = path.join(projectRoot, 'docs', 'tdd.md');
+
+// Check required files
+const missingFiles = [];
+if (!fs.existsSync(prdPath)) missingFiles.push(prdPath + ' (run generate-prd.js first)');
+if (!fs.existsSync(conceptPath)) missingFiles.push(conceptPath);
+if (!fs.existsSync(assetsJsonPath)) missingFiles.push(assetsJsonPath);
+
+if (missingFiles.length > 0) {
+  console.error('Error: Missing required files:');
+  missingFiles.forEach(f => console.error('  - ' + f));
+  process.exit(1);
+}
+
+// Read files
+const prdContent = fs.readFileSync(prdPath, 'utf-8');
+const conceptImage = fs.readFileSync(conceptPath).toString('base64');
+const assetsJson = fs.readFileSync(assetsJsonPath, 'utf-8');
+
+// Load Three.js skills for context
+const skillsDir = path.join(projectRoot, '.claude', 'skills');
+let skillsContext = '';
+if (fs.existsSync(skillsDir)) {
+  const skillFolders = fs.readdirSync(skillsDir);
+  for (const folder of skillFolders) {
+    const skillPath = path.join(skillsDir, folder, 'SKILL.md');
+    if (fs.existsSync(skillPath)) {
+      const content = fs.readFileSync(skillPath, 'utf-8');
+      // Include more skill content for TDD
+      skillsContext += `\n\n### ${folder}\n${content}`;
+    }
+  }
+}
+
+// Build prompt
+const prompt = `Based on the following PRD, create a comprehensive Technical Design Document (TDD) that will ensure we can implement this game with minimal problems and maximum speed.
+
+## PRD (Product Requirements Document):
+${prdContent}
+
+## Available Assets (assets.json):
+\`\`\`json
+${assetsJson}
+\`\`\`
+
+## Three.js Skills Reference:
+${skillsContext.substring(0, 30000)}
+
+---
+
+Create a Technical Design Document with the following sections. Include COMPLETE, RUNNABLE code examples (not pseudocode):
+
+## 1. Overview
+- Technical stack summary table
+- Reference materials list
+
+## 2. Architecture Overview
+- High-level module structure diagram (ASCII art)
+- Game state flow diagram
+
+## 3. Core Engine Systems
+Include full implementation code for:
+- Renderer setup with letterboxing
+- Scene setup with fog and background
+- RTS/appropriate Camera system class
+- Lighting system setup
+- Asset loading system with LoadingManager, GLTF loading, fallback primitives
+- Asset manifest listing core assets to load
+
+## 4. Entity Component System (ECS)
+Include full code for:
+- Core Entity class
+- All component classes (Transform, Health, Movement, Combat, Collision, Selectable, etc.)
+- Unit and building stats configuration objects
+- Entity Factory with creation methods
+
+## 5. Game Systems
+Include full implementation code for each:
+- Entity Manager (add, remove, query)
+- Selection System (click, box select, visual feedback)
+- Command System (move, attack, context-sensitive commands)
+- Movement System (steering, separation, turn rate)
+- Combat System (melee, ranged, projectiles, damage application)
+- Economy/Resource System (gathering, dropoff, training queues)
+- AI System (state machine, economy, military, raids)
+
+## 6. Visual Effects System
+Include code for:
+- Effects Manager class
+- Screen shake implementation
+- Time dilation
+- Floating text
+- Particle effects (sparks, debris)
+- Death sequences (unit collapse, building destruction)
+
+## 7. UI System
+Include complete:
+- HTML structure
+- Full CSS styles
+- HUD elements
+- Menu screens (main, pause, game over)
+- Build palette if applicable
+- Mobile touch controls
+
+## 8. Main Game Loop
+Include full implementation:
+- Game State enum
+- Complete Game class with all methods
+- Animation loop
+- Win/lose condition checking
+- HUD updates
+
+## 9. Implementation Phases
+Ordered list with:
+- Phase name and priority (Critical/Important/Polish)
+- What to implement
+- Dependencies
+
+## 10. Performance Considerations
+- Rendering optimizations
+- Game logic optimizations
+- Memory management tips
+
+## 11. Testing Checklist
+- All success criteria as checkboxes
+
+## 12. Appendix
+- Color palette reference table
+- Animation timing reference table
+- Unit stats reference table
+- Building stats reference table
+
+All code should use Three.js r160 APIs and follow best practices.`;
+
+console.log('Generating TDD with Claude API (Opus 4.5)...');
+console.log('Game:', game.name);
+console.log('This may take a minute due to the comprehensive output...');
+
+// Claude API request
+const requestBody = JSON.stringify({
+  model: 'claude-sonnet-4-20250514',
+  max_tokens: 64000,
+  messages: [{
+    role: 'user',
+    content: [
+      {
+        type: 'image',
+        source: {
+          type: 'base64',
+          media_type: 'image/jpeg',
+          data: conceptImage
+        }
+      },
+      {
+        type: 'text',
+        text: prompt
+      }
+    ]
+  }]
+});
+
+const options = {
+  hostname: 'api.anthropic.com',
+  port: 443,
+  path: '/v1/messages',
+  method: 'POST',
+  headers: {
+    'Content-Type': 'application/json',
+    'x-api-key': anthropic.api_key,
+    'anthropic-version': '2023-06-01'
+  }
+};
+
+const req = https.request(options, (res) => {
+  let data = '';
+  
+  res.on('data', (chunk) => {
+    data += chunk;
+    process.stdout.write('.');
+  });
+  
+  res.on('end', () => {
+    console.log('\n');
+    
+    try {
+      const response = JSON.parse(data);
+      
+      if (response.error) {
+        console.error('API Error:', response.error.message);
+        process.exit(1);
+      }
+      
+      // Extract text content
+      const content = response.content || [];
+      let tddContent = '';
+      
+      for (const block of content) {
+        if (block.type === 'text') {
+          tddContent += block.text;
+        }
+      }
+      
+      if (!tddContent) {
+        console.error('No content in response');
+        process.exit(1);
+      }
+      
+      // Save TDD
+      fs.writeFileSync(outputPath, tddContent);
+      
+      console.log('TDD generated successfully!');
+      console.log('Output:', outputPath);
+      console.log('Length:', tddContent.length, 'characters');
+      
+    } catch (err) {
+      console.error('Error parsing response:', err.message);
+      console.error('Raw response:', data.substring(0, 1000));
+      process.exit(1);
+    }
+  });
+});
+
+req.on('error', (err) => {
+  console.error('Request error:', err.message);
+  process.exit(1);
+});
+
+req.write(requestBody);
+req.end();

package/template/scripts/pipeline.js

@@ -0,0 +1,229 @@
+#!/usr/bin/env node
+
+/**
+ * Full Pipeline Orchestration Script
+ * 
+ * Runs the complete game generation pipeline:
+ * 1. Generate assets.json (if needed)
+ * 2. Generate concept mockup
+ * 3. Generate PRD
+ * 4. Generate TDD
+ * 5. Generate execution plan
+ * 
+ * Usage:
+ *   node pipeline.js [--skip-mockup] [--skip-to=step]
+ * 
+ * Options:
+ *   --skip-mockup     Skip mockup generation (use existing concept.jpg)
+ *   --skip-to=step    Skip to a specific step (assets, mockup, prd, tdd, plan)
+ *   --plan-name=name  Use specific plan name instead of random
+ * 
+ * Requires:
+ *   - config.json with API keys and game settings
+ *   - Assets in public/assets/{game_name}/
+ */
+
+const { execSync, spawn } = require('child_process');
+const fs = require('fs');
+const path = require('path');
+
+// Parse arguments
+const args = process.argv.slice(2);
+const skipMockup = args.includes('--skip-mockup');
+const skipToArg = args.find(a => a.startsWith('--skip-to='));
+const skipTo = skipToArg ? skipToArg.split('=')[1] : null;
+const planNameArg = args.find(a => a.startsWith('--plan-name='));
+const planName = planNameArg ? planNameArg.split('=')[1] : null;
+
+// Script directory
+const scriptDir = __dirname;
+const projectRoot = path.join(scriptDir, '..');
+const configPath = path.join(scriptDir, 'config.json');
+
+// Check config
+if (!fs.existsSync(configPath)) {
+  console.error('Error: config.json not found');
+  console.error('Copy config.example.json to config.json and configure it');
+  process.exit(1);
+}
+
+const config = JSON.parse(fs.readFileSync(configPath, 'utf-8'));
+const gameName = config.game?.name;
+
+if (!gameName) {
+  console.error('Error: game.name not set in config.json');
+  process.exit(1);
+}
+
+console.log('╔═══════════════════════════════════════════════════════════════╗');
+console.log('║           THREE.JS GAME GENERATION PIPELINE                   ║');
+console.log('╚═══════════════════════════════════════════════════════════════╝');
+console.log('');
+console.log('Game:', gameName);
+console.log('Description:', config.game?.description?.substring(0, 60) + '...');
+console.log('');
+
+// Steps
+const steps = ['assets', 'mockup', 'prd', 'tdd', 'plan'];
+const stepIndex = skipTo ? steps.indexOf(skipTo) : 0;
+
+if (skipTo && stepIndex === -1) {
+  console.error('Invalid --skip-to value. Options:', steps.join(', '));
+  process.exit(1);
+}
+
+// Run a script and wait for completion
+function runScript(scriptName, args = []) {
+  return new Promise((resolve, reject) => {
+    console.log(`\n${'─'.repeat(60)}`);
+    console.log(`Running: ${scriptName} ${args.join(' ')}`);
+    console.log('─'.repeat(60) + '\n');
+    
+    const child = spawn('node', [path.join(scriptDir, scriptName), ...args], {
+      cwd: projectRoot,
+      stdio: 'inherit'
+    });
+    
+    child.on('close', (code) => {
+      if (code === 0) {
+        resolve();
+      } else {
+        reject(new Error(`${scriptName} exited with code ${code}`));
+      }
+    });
+    
+    child.on('error', reject);
+  });
+}
+
+// Check if file exists
+function checkFile(filePath, description) {
+  if (fs.existsSync(filePath)) {
+    console.log(`✓ ${description}: ${path.basename(filePath)}`);
+    return true;
+  } else {
+    console.log(`✗ ${description}: NOT FOUND`);
+    return false;
+  }
+}
+
+// Main pipeline
+async function runPipeline() {
+  try {
+    const assetsDir = path.join(projectRoot, 'public', 'assets', gameName);
+    
+    // Step 1: Check/Generate assets.json
+    if (stepIndex <= 0) {
+      console.log('\n📦 STEP 1: Asset Index');
+      console.log('─'.repeat(40));
+      
+      const assetsJsonPath = path.join(assetsDir, 'assets.json');
+      const previewPath = path.join(assetsDir, 'Preview.jpg');
+      
+      // Check for assets directory
+      if (!fs.existsSync(assetsDir)) {
+        console.error(`\nError: Assets directory not found: ${assetsDir}`);
+        console.error('Please add your assets first.');
+        process.exit(1);
+      }
+      
+      // Check for preview image
+      if (!checkFile(previewPath, 'Preview image')) {
+        // Try alternative names
+        const altNames = ['preview.jpg', 'Preview.png', 'preview.png', 'preview.jpeg'];
+        let found = false;
+        for (const alt of altNames) {
+          const altPath = path.join(assetsDir, alt);
+          if (fs.existsSync(altPath)) {
+            console.log(`  Found alternative: ${alt}, renaming to Preview.jpg`);
+            fs.renameSync(altPath, previewPath);
+            found = true;
+            break;
+          }
+        }
+        if (!found) {
+          console.error('\nWarning: No preview image found. Mockup generation may fail.');
+        }
+      }
+      
+      // Generate assets.json if needed
+      if (!fs.existsSync(assetsJsonPath)) {
+        await runScript('generate-assets-json.js', [gameName]);
+      } else {
+        console.log(`✓ assets.json already exists`);
+      }
+    }
+    
+    // Step 2: Generate mockup
+    if (stepIndex <= 1 && !skipMockup) {
+      console.log('\n🎨 STEP 2: Concept Mockup');
+      console.log('─'.repeat(40));
+      
+      const conceptPath = path.join(projectRoot, 'public', gameName, 'concept.jpg');
+      
+      if (fs.existsSync(conceptPath)) {
+        console.log('✓ concept.jpg already exists');
+        console.log('  Use --skip-mockup to keep it, or delete to regenerate');
+      }
+      
+      await runScript('generate-mockup.js');
+    } else if (skipMockup) {
+      console.log('\n🎨 STEP 2: Concept Mockup (SKIPPED)');
+    }
+    
+    // Step 3: Generate PRD
+    if (stepIndex <= 2) {
+      console.log('\n📋 STEP 3: Product Requirements Document');
+      console.log('─'.repeat(40));
+      
+      await runScript('generate-prd.js');
+    }
+    
+    // Step 4: Generate TDD
+    if (stepIndex <= 3) {
+      console.log('\n🔧 STEP 4: Technical Design Document');
+      console.log('─'.repeat(40));
+      
+      await runScript('generate-tdd.js');
+    }
+    
+    // Step 5: Generate Plan
+    if (stepIndex <= 4) {
+      console.log('\n📝 STEP 5: Execution Plan');
+      console.log('─'.repeat(40));
+      
+      const planArgs = planName ? [planName] : [];
+      await runScript('generate-plan.js', planArgs);
+    }
+    
+    // Summary
+    console.log('\n' + '═'.repeat(60));
+    console.log('✅ PIPELINE COMPLETE');
+    console.log('═'.repeat(60));
+    console.log('');
+    console.log('Generated files:');
+    checkFile(path.join(assetsDir, 'assets.json'), '  assets.json');
+    checkFile(path.join(projectRoot, 'public', gameName, 'concept.jpg'), '  concept.jpg');
+    checkFile(path.join(projectRoot, 'docs', 'prd.md'), '  prd.md');
+    checkFile(path.join(projectRoot, 'docs', 'tdd.md'), '  tdd.md');
+    
+    // Find the plan file
+    const plansDir = path.join(projectRoot, 'plans');
+    if (fs.existsSync(plansDir)) {
+      const plans = fs.readdirSync(plansDir).filter(f => f.endsWith('.md'));
+      if (plans.length > 0) {
+        const latestPlan = plans[plans.length - 1];
+        console.log(`  plan: ${latestPlan}`);
+        console.log('');
+        console.log('Next step - run in Claude Code:');
+        console.log(`  Please proceed with implementing the game based on the plan in plans/${latestPlan}`);
+      }
+    }
+    
+  } catch (err) {
+    console.error('\n❌ Pipeline failed:', err.message);
+    process.exit(1);
+  }
+}
+
+runPipeline();