retiam 0.0.0-stage → 1.0.0

package/bin/init.js

@@ -0,0 +1,425 @@
+#!/usr/bin/env node
+
+// =========================================================================
+// File: bin/init.js - Retiam Project Starter & Skeleton Generator
+// =========================================================================
+
+import fs from 'fs';
+import path from 'path';
+import readline from 'readline/promises';
+import { spawnSync } from 'child_process';
+
+const args = process.argv.slice(2);
+
+// Check for --help
+const isHelp = args.includes('--help') || args.includes('-h') || args.includes('help');
+if (isHelp) {
+    console.log(`
+🚀 Retiam WebGPU Engine - Project Initializer
+
+Usage:
+  npx retiam init [directory] [options]
+  npx retiam create [directory] [options]
+
+Arguments:
+  [directory]               Destination directory (default: ./retiam-animation)
+
+Options:
+  -n, --name <name>         Project name for package.json (default: directory name)
+  --title <text>            Hero text to display in Hello World scene (default: Hello World)
+  --pm <manager>            Package manager: npm, pnpm, yarn, bun (default: auto-detected or npm)
+  -f, --force               Overwrite destination directory if files already exist
+  -y, --yes                 Skip interactive prompts and use defaults
+  --install                 Automatically install dependencies after generation
+  --git                     Initialize a Git repository (git init)
+  --json                    Output structured machine-readable JSON for agents and CI
+  --help, -h                Show this help message and exit
+
+Examples:
+  npx retiam init
+  npx retiam init my-animation
+  npx retiam create intro-scene --title "Quantum Mechanics" --pm pnpm
+  npx retiam init my-project -y --install
+  npx retiam init agent-project --json --yes
+`);
+    process.exit(0);
+}
+
+// Auto-detect package manager from npm_config_user_agent
+function detectPackageManager() {
+    const userAgent = process.env.npm_config_user_agent || '';
+    if (userAgent.startsWith('pnpm')) return 'pnpm';
+    if (userAgent.startsWith('yarn')) return 'yarn';
+    if (userAgent.startsWith('bun')) return 'bun';
+    return 'npm';
+}
+
+// Parse CLI flags
+let targetDir = null;
+let projectName = null;
+let heroTitle = 'Hello World';
+let packageManager = detectPackageManager();
+let force = false;
+let nonInteractive = false;
+let runInstall = false;
+let initGit = false;
+let jsonOutput = false;
+
+for (let i = 0; i < args.length; i++) {
+    const arg = args[i];
+    if (arg === '--json') {
+        jsonOutput = true;
+        nonInteractive = true;
+    } else if (arg === '-y' || arg === '--yes') {
+        nonInteractive = true;
+    } else if (arg === '-f' || arg === '--force') {
+        force = true;
+    } else if (arg === '--install') {
+        runInstall = true;
+    } else if (arg === '--git') {
+        initGit = true;
+    } else if (arg === '-n' || arg === '--name') {
+        projectName = args[++i];
+    } else if (arg === '--title') {
+        heroTitle = args[++i] || 'Hello World';
+    } else if (arg === '--pm') {
+        packageManager = args[++i] || packageManager;
+    } else if (!arg.startsWith('-') && !targetDir) {
+        targetDir = arg;
+    }
+}
+
+async function main() {
+    // Interactive setup if TTY and not in --yes / --json mode
+    const isTTY = process.stdin.isTTY && !nonInteractive;
+
+    if (isTTY) {
+        const rl = readline.createInterface({
+            input: process.stdin,
+            output: process.stdout
+        });
+
+        try {
+            console.log(`\n✨ Welcome to Retiam - WebGPU Animation Project Generator\n`);
+
+            if (!targetDir) {
+                const inputDir = await rl.question(`📁 Destination directory (./retiam-animation): `);
+                targetDir = inputDir.trim() || 'retiam-animation';
+            }
+
+            const defaultName = path.basename(path.resolve(process.cwd(), targetDir))
+                .toLowerCase()
+                .replace(/[^a-z0-9_-]/g, '-');
+
+            if (!projectName) {
+                const inputName = await rl.question(`📦 Project name (${defaultName}): `);
+                projectName = inputName.trim() || defaultName;
+            }
+
+            const inputTitle = await rl.question(`🎨 Starter animation text (${heroTitle}): `);
+            if (inputTitle.trim()) {
+                heroTitle = inputTitle.trim();
+            }
+
+            const inputPm = await rl.question(`⚡ Package manager [npm/pnpm/yarn/bun] (${packageManager}): `);
+            if (inputPm.trim()) {
+                packageManager = inputPm.trim().toLowerCase();
+            }
+
+            const inputInstall = await rl.question(`📥 Run '${packageManager} install' now? [y/N]: `);
+            if (inputInstall.trim().toLowerCase().startsWith('y')) {
+                runInstall = true;
+            }
+        } finally {
+            rl.close();
+        }
+    }
+
+    if (!targetDir) {
+        targetDir = 'retiam-animation';
+    }
+
+    const resolvedDir = path.resolve(process.cwd(), targetDir);
+    const resolvedName = projectName || path.basename(resolvedDir)
+        .toLowerCase()
+        .replace(/[^a-z0-9_-]/g, '-') || 'retiam-animation';
+
+    // Conflict check
+    if (fs.existsSync(resolvedDir)) {
+        const existingFiles = fs.readdirSync(resolvedDir).filter(f => !f.startsWith('.'));
+        if (existingFiles.length > 0 && !force) {
+            if (jsonOutput) {
+                console.log(JSON.stringify({
+                    status: 'error',
+                    message: `Target directory '${targetDir}' already exists and is not empty. Use -f or --force to overwrite.`
+                }));
+            } else {
+                console.error(`\n❌ Error: Directory '${targetDir}' is not empty (${existingFiles.length} files found).`);
+                console.error(`   Use -f or --force to proceed anyway.\n`);
+            }
+            process.exit(1);
+        }
+    }
+
+    // Ensure directory structure
+    const srcDir = path.join(resolvedDir, 'src');
+    const scenesDir = path.join(srcDir, 'scenes');
+    fs.mkdirSync(scenesDir, { recursive: true });
+
+    // 1. package.json
+    const packageJson = {
+        name: resolvedName,
+        version: '0.1.0',
+        private: true,
+        type: 'module',
+        scripts: {
+            dev: 'vite',
+            build: 'tsc && vite build',
+            preview: 'vite preview',
+            render: 'retiam render src/scenes/HelloWorld.ts'
+        },
+        dependencies: {
+            retiam: '^1.0.0'
+        },
+        devDependencies: {
+            '@webgpu/types': '^0.1.31',
+            typescript: '^5.5.0',
+            vite: '^5.4.0'
+        }
+    };
+
+    // 2. tsconfig.json
+    const tsconfigJson = {
+        compilerOptions: {
+            target: 'ES2022',
+            module: 'ESNext',
+            moduleResolution: 'bundler',
+            lib: ['ES2022', 'DOM', 'DOM.Iterable'],
+            types: ['@webgpu/types', 'vite/client'],
+            strict: true,
+            esModuleInterop: true,
+            skipLibCheck: true,
+            isolatedModules: true
+        },
+        include: ['src']
+    };
+
+    // 3. vite.config.ts
+    const viteConfig = `import { defineConfig } from 'vite';
+
+export default defineConfig({
+  optimizeDeps: {
+    esbuildOptions: {
+      target: 'es2022',
+      supported: {
+        'top-level-await': true
+      }
+    }
+  },
+  esbuild: {
+    target: 'es2022'
+  },
+  server: {
+    port: 3000,
+    open: true
+  }
+});
+`;
+
+    // 4. index.html
+    const indexHtml = `<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>${resolvedName} - Retiam WebGPU Animation</title>
+    <style>
+      * {
+        box-sizing: border-box;
+      }
+      body {
+        margin: 0;
+        overflow: hidden;
+        background-color: #080C14;
+        width: 100vw;
+        height: 100vh;
+      }
+      canvas {
+        display: block;
+        width: 100vw;
+        height: 100vh;
+      }
+    </style>
+  </head>
+  <body>
+    <canvas id="canvas"></canvas>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
+`;
+
+    // 5. src/main.ts
+    const mainTs = `import HelloWorldScene from './scenes/HelloWorld';
+
+async function bootstrap() {
+  const canvas = document.getElementById('canvas') as HTMLCanvasElement;
+  if (!canvas) {
+    console.error('Canvas element not found');
+    return;
+  }
+
+  canvas.width = window.innerWidth;
+  canvas.height = window.innerHeight;
+
+  window.addEventListener('resize', () => {
+    canvas.width = window.innerWidth;
+    canvas.height = window.innerHeight;
+  });
+
+  const scene = new HelloWorldScene();
+  await scene.start(canvas);
+}
+
+bootstrap().catch((err) => {
+  console.error('Failed to initialize Retiam animation:', err);
+});
+`;
+
+    // 6. src/scenes/HelloWorld.ts
+    const helloWorldTs = `import { Scene, hex, SDFText, Write } from "retiam";
+
+/**
+ * Starter Retiam Scene: Hello World
+ * Features a cinematic Write animation over an obsidian dark substrate.
+ */
+export default class HelloWorldScene extends Scene {
+    public async run(): Promise<void> {
+        // 1. Setup camera and obsidian canvas
+        this.camera.position.set([0, 0, 14]);
+        this.clearColor(hex("#080C14"));
+
+        // 2. Create the hero typography
+        const text = new SDFText("${heroTitle.replace(/"/g, '\\"')}", { fontSize: 1.1 });
+        text.paint.fill = hex("#38BDF8");
+        text.center();
+
+        // 3. Register entity and frame camera with balanced padding
+        this.add(text);
+        this.camera.frame(text, { padding: 0.3 });
+
+        // 4. Choreographed motion: Write animation
+        await this.play(new Write(text, { duration: 1500 }));
+        await this.wait(2000);
+    }
+}
+`;
+
+    // 7. .gitignore
+    const gitignore = `node_modules
+dist
+outputs
+.DS_Store
+*.local
+`;
+
+    // 8. README.md
+    const readme = `# ${resolvedName}
+
+A cinematic WebGPU mathematical animation built with [Retiam](https://github.com/abhilasbiswas/Retiam).
+
+## 🚀 Quick Start
+
+1. **Install dependencies**:
+   \`\`\`bash
+   ${packageManager} install
+   \`\`\`
+
+2. **Start real-time development server (60-144 FPS)**:
+   \`\`\`bash
+   ${packageManager} run dev
+   \`\`\`
+
+3. **Render broadcast video (MP4/WebM)**:
+   \`\`\`bash
+   ${packageManager} run render
+   \`\`\`
+
+## 📁 Project Structure
+
+- \`src/main.ts\`: Entrypoint mounting the WebGPU canvas.
+- \`src/scenes/HelloWorld.ts\`: Starter scene with hero typography and \`Write\` animation.
+- \`vite.config.ts\`: Real-time WebGPU bundler configuration with hot module reload.
+`;
+
+    // Write all template files
+    fs.writeFileSync(path.join(resolvedDir, 'package.json'), JSON.stringify(packageJson, null, 2) + '\n', 'utf8');
+    fs.writeFileSync(path.join(resolvedDir, 'tsconfig.json'), JSON.stringify(tsconfigJson, null, 2) + '\n', 'utf8');
+    fs.writeFileSync(path.join(resolvedDir, 'vite.config.ts'), viteConfig, 'utf8');
+    fs.writeFileSync(path.join(resolvedDir, 'index.html'), indexHtml, 'utf8');
+    fs.writeFileSync(path.join(resolvedDir, '.gitignore'), gitignore, 'utf8');
+    fs.writeFileSync(path.join(resolvedDir, 'README.md'), readme, 'utf8');
+    fs.writeFileSync(path.join(srcDir, 'main.ts'), mainTs, 'utf8');
+    fs.writeFileSync(path.join(scenesDir, 'HelloWorld.ts'), helloWorldTs, 'utf8');
+
+    const createdFiles = [
+        'package.json',
+        'tsconfig.json',
+        'vite.config.ts',
+        'index.html',
+        '.gitignore',
+        'README.md',
+        'src/main.ts',
+        'src/scenes/HelloWorld.ts'
+    ];
+
+    // Optional git init
+    if (initGit) {
+        try {
+            spawnSync('git', ['init'], { cwd: resolvedDir, stdio: 'ignore' });
+        } catch (_) {}
+    }
+
+    // Optional install
+    if (runInstall) {
+        if (!jsonOutput) {
+            console.log(`\n📦 Installing dependencies with ${packageManager}...`);
+        }
+        try {
+            spawnSync(packageManager, ['install'], { cwd: resolvedDir, stdio: jsonOutput ? 'ignore' : 'inherit' });
+        } catch (err) {
+            if (!jsonOutput) {
+                console.warn(`⚠️ Failed to run '${packageManager} install'. Please run it manually.`);
+            }
+        }
+    }
+
+    if (jsonOutput) {
+        console.log(JSON.stringify({
+            status: 'success',
+            directory: targetDir,
+            absolutePath: resolvedDir,
+            projectName: resolvedName,
+            packageManager,
+            files: createdFiles
+        }, null, 2));
+    } else {
+        console.log(`\n✨ Successfully created Retiam project in '${targetDir}'!\n`);
+        console.log(`Next steps:`);
+        if (path.resolve(process.cwd()) !== resolvedDir) {
+            console.log(`  1. cd ${targetDir}`);
+        }
+        if (!runInstall) {
+            console.log(`  2. ${packageManager} install`);
+            console.log(`  3. ${packageManager} run dev          # Real-time WebGPU preview`);
+            console.log(`  4. ${packageManager} run render       # Export MP4 broadcast video\n`);
+        } else {
+            console.log(`  2. ${packageManager} run dev          # Real-time WebGPU preview`);
+            console.log(`  3. ${packageManager} run render       # Export MP4 broadcast video\n`);
+        }
+    }
+}
+
+main().catch((err) => {
+    console.error('Initialization failed:', err);
+    process.exit(1);
+});