create-threejs-game 1.1.0 → 1.1.2

package/README.md

@@ -14,14 +14,18 @@ Download GLTF asset packs from:
 
 The CLI will ask for the path to your downloaded assets folder and validate it contains `.gltf` or `.glb` files.
 
-**Multi-Pack Support:** You can combine multiple asset packs by organizing them in subdirectories:
+**Multi-Pack Support:** You can combine multiple asset packs by organizing them in subdirectories (nested to any depth):
 ```
 my-assets/
-├── characters/      # Asset pack 1 (with Preview.jpg)
-├── buildings/       # Asset pack 2 (with Preview.jpg)
-└── environment/     # Asset pack 3 (with Preview.jpg)
+├── characters/
+│   ├── humans/        # Has Preview.jpg
+│   └── monsters/      # Has Preview.jpg
+├── buildings/         # Has Preview.jpg
+└── environment/
+    ├── trees/         # Has Preview.jpg
+    └── rocks/         # Has Preview.jpg
 ```
-The CLI auto-detects this structure and combines all preview images into a single grid.
+The CLI recursively finds all directories with previews and combines them into a single grid.
 
 ### 2. Preview Image (Auto-generated for multi-packs)
 Most asset packs include a `Preview.jpg`. For multi-pack directories, the CLI automatically combines all subdirectory previews into one image. For single packs without a preview, take a screenshot of your assets.

package/bin/cli.js

@@ -112,28 +112,41 @@ function findPreview(dir) {
   return null;
 }
 
-// Detect if directory is a multi-pack (has subdirs with previews)
-function detectMultiPack(sourceDir) {
-  const entries = fs.readdirSync(sourceDir, { withFileTypes: true });
-  const subdirs = entries.filter(e => e.isDirectory());
-  
-  if (subdirs.length === 0) return null;
-  
-  const packsWithPreviews = [];
+// Recursively find all directories with preview images
+function findPacksWithPreviews(dir, basePath = dir) {
+  const packs = [];
+  const entries = fs.readdirSync(dir, { withFileTypes: true });
+  
+  // Check if this directory has a preview
+  const preview = findPreview(dir);
+  if (preview && dir !== basePath) {
+    // Use relative path from base as the name
+    const relativePath = path.relative(basePath, dir);
+    packs.push({
+      name: relativePath,
+      path: dir,
+      preview: preview
+    });
+  }
   
-  for (const subdir of subdirs) {
-    const subdirPath = path.join(sourceDir, subdir.name);
-    const preview = findPreview(subdirPath);
-    if (preview) {
-      packsWithPreviews.push({
-        name: subdir.name,
-        path: subdirPath,
-        preview: preview
-      });
-    }
+  // Recursively check subdirectories
+  for (const entry of entries) {
+    if (!entry.isDirectory()) continue;
+    if (entry.name.startsWith('.')) continue; // Skip hidden dirs
+    
+    const subdirPath = path.join(dir, entry.name);
+    const subPacks = findPacksWithPreviews(subdirPath, basePath);
+    packs.push(...subPacks);
   }
   
-  // Consider it a multi-pack if at least 2 subdirs have previews
+  return packs;
+}
+
+// Detect if directory is a multi-pack (has subdirs with previews)
+function detectMultiPack(sourceDir) {
+  const packsWithPreviews = findPacksWithPreviews(sourceDir, sourceDir);
+  
+  // Consider it a multi-pack if at least 2 directories have previews
   if (packsWithPreviews.length >= 2) {
     return packsWithPreviews;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-threejs-game",
-  "version": "1.1.0",
+  "version": "1.1.2",
   "description": "Scaffold a Three.js game project with AI-assisted design documents",
   "bin": {
     "create-threejs-game": "./bin/cli.js"

package/template/scripts/combine-previews.js

@@ -23,29 +23,47 @@ try {
 }
 
 /**
- * Find all preview images in subdirectories
+ * Find preview image in a directory
  */
-function findPreviews(sourceDir) {
+function findPreview(dir) {
+  const previewNames = ['Preview.jpg', 'Preview.png', 'preview.jpg', 'preview.png', 
+                        'Preview.jpeg', 'preview.jpeg'];
+  for (const name of previewNames) {
+    const previewPath = path.join(dir, name);
+    if (fs.existsSync(previewPath)) {
+      return previewPath;
+    }
+  }
+  return null;
+}
+
+/**
+ * Recursively find all preview images in subdirectories (any depth)
+ */
+function findPreviews(sourceDir, basePath = sourceDir) {
   const previews = [];
   const entries = fs.readdirSync(sourceDir, { withFileTypes: true });
   
+  // Check if this directory has a preview (skip the root)
+  if (sourceDir !== basePath) {
+    const preview = findPreview(sourceDir);
+    if (preview) {
+      const relativePath = path.relative(basePath, sourceDir);
+      previews.push({
+        path: preview,
+        name: relativePath
+      });
+    }
+  }
+  
+  // Recursively check subdirectories
   for (const entry of entries) {
     if (!entry.isDirectory()) continue;
+    if (entry.name.startsWith('.')) continue; // Skip hidden dirs
     
-    const subdir = path.join(sourceDir, entry.name);
-    const previewNames = ['Preview.jpg', 'Preview.png', 'preview.jpg', 'preview.png', 
-                          'Preview.jpeg', 'preview.jpeg'];
-    
-    for (const name of previewNames) {
-      const previewPath = path.join(subdir, name);
-      if (fs.existsSync(previewPath)) {
-        previews.push({
-          path: previewPath,
-          name: entry.name
-        });
-        break;
-      }
-    }
+    const subdirPath = path.join(sourceDir, entry.name);
+    const subPreviews = findPreviews(subdirPath, basePath);
+    previews.push(...subPreviews);
   }
   
   return previews;
@@ -182,7 +200,7 @@ async function main() {
 }
 
 // Export for use as module
-module.exports = { findPreviews, combineImages, calculateGrid };
+module.exports = { findPreview, findPreviews, combineImages, calculateGrid };
 
 // Run if called directly
 if (require.main === module) {

package/template/scripts/generate-assets-json.js

@@ -63,8 +63,17 @@ function getCategory(ext) {
   return 'Other';
 }
 
+// Get pack name from relative path (first directory component)
+function getPackName(relativePath) {
+  const parts = relativePath.split('/');
+  if (parts.length > 1) {
+    return parts[0];
+  }
+  return null; // Asset is at root level
+}
+
 // Recursively scan directory for assets
-function scanDirectory(dir, relativeTo) {
+function scanDirectory(dir, relativeTo, rootDir = relativeTo) {
   const assets = [];
   
   if (!fs.existsSync(dir)) {
@@ -77,8 +86,10 @@ function scanDirectory(dir, relativeTo) {
     const fullPath = path.join(dir, item.name);
     
     if (item.isDirectory()) {
+      // Skip hidden directories
+      if (item.name.startsWith('.')) continue;
       // Recursively scan subdirectories
-      assets.push(...scanDirectory(fullPath, relativeTo));
+      assets.push(...scanDirectory(fullPath, relativeTo, rootDir));
     } else if (item.isFile()) {
       const ext = path.extname(item.name).toLowerCase();
       
@@ -93,17 +104,25 @@ function scanDirectory(dir, relativeTo) {
       
       if (!allExtensions.includes(ext)) continue;
       
-      const relativePath = path.relative(relativeTo, fullPath);
+      const relativePath = path.relative(relativeTo, fullPath).replace(/\\/g, '/');
       const category = getCategory(ext);
+      const pack = getPackName(relativePath);
       
-      assets.push({
+      const asset = {
         name: item.name,
-        path: `public/assets/${gameName}/${relativePath.replace(/\\/g, '/')}`,
-        relativePath: relativePath.replace(/\\/g, '/'),
+        path: `public/assets/${gameName}/${relativePath}`,
+        relativePath: relativePath,
         category: category,
         extension: ext,
         focusGlTF: ext === '.gltf' || ext === '.glb'
-      });
+      };
+      
+      // Add pack field if asset is in a subdirectory
+      if (pack) {
+        asset.pack = pack;
+      }
+      
+      assets.push(asset);
     }
   }
   
@@ -115,8 +134,18 @@ console.log(`Scanning assets in: ${assetsDir}`);
 
 const assets = scanDirectory(assetsDir, assetsDir);
 
-// Sort assets by name
-assets.sort((a, b) => a.name.localeCompare(b.name));
+// Sort assets by pack then name
+assets.sort((a, b) => {
+  if (a.pack && b.pack) {
+    const packCompare = a.pack.localeCompare(b.pack);
+    if (packCompare !== 0) return packCompare;
+  } else if (a.pack) {
+    return 1; // Assets with packs after root assets
+  } else if (b.pack) {
+    return -1;
+  }
+  return a.name.localeCompare(b.name);
+});
 
 // Count by category
 const categoryCounts = {};
@@ -124,9 +153,19 @@ for (const asset of assets) {
   categoryCounts[asset.category] = (categoryCounts[asset.category] || 0) + 1;
 }
 
+// Count by pack
+const packCounts = {};
+for (const asset of assets) {
+  const pack = asset.pack || '(root)';
+  packCounts[pack] = (packCounts[pack] || 0) + 1;
+}
+
 // Count glTF assets
 const glTFCount = assets.filter(a => a.focusGlTF).length;
 
+// Get unique packs
+const packs = [...new Set(assets.map(a => a.pack).filter(Boolean))];
+
 // Build output
 const output = {
   metadata: {
@@ -134,7 +173,9 @@ const output = {
     root: `public/assets/${gameName}`,
     totalAssets: assets.length,
     glTFAssetCount: glTFCount,
-    categories: categoryCounts
+    categories: categoryCounts,
+    packs: packs.length > 0 ? packs : undefined,
+    packCounts: packs.length > 0 ? packCounts : undefined
   },
   assets: assets
 };
@@ -147,3 +188,6 @@ console.log(`\nSummary:`);
 console.log(`  Total assets: ${assets.length}`);
 console.log(`  glTF/GLB models: ${glTFCount}`);
 console.log(`  Categories:`, categoryCounts);
+if (packs.length > 0) {
+  console.log(`  Packs (${packs.length}):`, packCounts);
+}