@playcraft/cli 0.0.53 → 0.0.55

package/project-templates/playable-template-phaser/scripts/convert-to-webp.js

@@ -0,0 +1,370 @@
+/**
+ * 图片转 WebP 格式脚本
+ * 
+ * 使用方法:
+ *   node scripts/convert-to-webp.js                           // 默认质量 100，保留原图
+ *   node scripts/convert-to-webp.js 90                        // 质量 90
+ *   node scripts/convert-to-webp.js --quality=80              // 质量 80
+ *   node scripts/convert-to-webp.js -q 90 --delete-original   // 质量 90，删除原图
+ *   node scripts/convert-to-webp.js --dry-run                 // 预览模式
+ *   node scripts/convert-to-webp.js --force                   // 强制覆盖
+ *   node scripts/convert-to-webp.js --dir=./public/images     // 指定目录
+ *   node scripts/convert-to-webp.js --help                    // 显示帮助
+ */
+
+const webp = require('webp-converter');
+const fs = require('fs');
+const path = require('path');
+const readline = require('readline');
+
+// 授予权限
+webp.grant_permission();
+
+// 默认配置
+const DEFAULT_CONFIG = {
+    dir: './src/assets',
+    quality: 100,
+    deleteOriginal: false,
+    force: false,
+    isDryRun: false
+};
+
+const SUPPORTED_EXTENSIONS = ['.png', '.jpg', '.jpeg', '.jfif'];
+
+/**
+ * 解析命令行参数
+ */
+function parseArgs() {
+    const args = process.argv.slice(2);
+    const config = { ...DEFAULT_CONFIG };
+
+    // 第一个参数如果是数字，视为质量值
+    if (args[0] && !args[0].startsWith('-') && !isNaN(args[0])) {
+        config.quality = parseInt(args[0]);
+    }
+
+    args.forEach((arg, index) => {
+        if (arg === '--dry-run') {
+            config.isDryRun = true;
+        } else if (arg === '--delete-original' || arg === '-d') {
+            config.deleteOriginal = true;
+        } else if (arg === '--force' || arg === '-f') {
+            config.force = true;
+        } else if (arg.startsWith('--quality=')) {
+            config.quality = parseInt(arg.split('=')[1]) || DEFAULT_CONFIG.quality;
+        } else if (arg === '-q' || arg === '--quality') {
+            const nextArg = args[index + 1];
+            if (nextArg && !isNaN(nextArg)) {
+                config.quality = parseInt(nextArg);
+            }
+        } else if (arg.startsWith('--dir=')) {
+            config.dir = arg.split('=')[1];
+        }
+    });
+
+    // 质量范围检查
+    if (config.quality < 0 || config.quality > 100) {
+        console.error('❌ 质量参数必须在 0-100 之间');
+        process.exit(1);
+    }
+
+    return config;
+}
+
+// 统计信息
+let stats = {
+    total: 0,
+    success: 0,
+    failed: 0,
+    skipped: 0,
+    deleted: 0,
+    originalSize: 0,
+    convertedSize: 0
+};
+
+/**
+ * 递归获取目录下所有图片文件
+ */
+function getAllImageFiles(dir, fileList = []) {
+    if (!fs.existsSync(dir)) {
+        return fileList;
+    }
+
+    const files = fs.readdirSync(dir);
+
+    files.forEach(file => {
+        const filePath = path.join(dir, file);
+        const stat = fs.statSync(filePath);
+
+        if (stat.isDirectory()) {
+            getAllImageFiles(filePath, fileList);
+        } else {
+            const ext = path.extname(file).toLowerCase();
+            if (SUPPORTED_EXTENSIONS.includes(ext)) {
+                fileList.push(filePath);
+            }
+        }
+    });
+
+    return fileList;
+}
+
+/**
+ * 格式化文件大小
+ */
+function formatSize(bytes) {
+    if (bytes === 0) return '0 B';
+    const k = 1024;
+    const sizes = ['B', 'KB', 'MB', 'GB'];
+    const i = Math.floor(Math.log(bytes) / Math.log(k));
+    return (bytes / Math.pow(k, i)).toFixed(2) + ' ' + sizes[i];
+}
+
+/**
+ * 询问用户确认
+ */
+function askConfirmation(question) {
+    const rl = readline.createInterface({
+        input: process.stdin,
+        output: process.stdout
+    });
+
+    return new Promise(resolve => {
+        rl.question(question, answer => {
+            rl.close();
+            resolve(answer.toLowerCase() === 'y' || answer.toLowerCase() === 'yes');
+        });
+    });
+}
+
+/**
+ * 转换单个图片
+ */
+async function convertImage(inputPath, config) {
+    const outputPath = inputPath.replace(/\.(png|jpg|jpeg|jfif)$/i, '.webp');
+    
+    // 如果已经是 webp 格式，跳过
+    if (inputPath.endsWith('.webp')) {
+        console.log(`⏭️  跳过: ${inputPath} (已是 WebP 格式)`);
+        stats.skipped++;
+        return;
+    }
+
+    // 如果输出文件已存在，直接覆盖
+    if (fs.existsSync(outputPath)) {
+        if (config.isDryRun) {
+            console.log(`🔍 [预览] 覆盖: ${outputPath}`);
+        } else {
+            console.log(`⚠️  覆盖: ${outputPath}`);
+        }
+    }
+
+    try {
+        const originalSize = fs.statSync(inputPath).size;
+        stats.originalSize += originalSize;
+
+        if (config.isDryRun) {
+            console.log(`🔍 [预览] ${inputPath} -> ${outputPath}`);
+            console.log(`   原始大小: ${formatSize(originalSize)}`);
+            if (config.deleteOriginal) {
+                console.log(`   ⚠️  将删除原图`);
+            }
+            stats.total++;
+            return;
+        }
+
+        console.log(`🔄 转换中: ${inputPath}`);
+        
+        // 转换图片
+        const result = await webp.cwebp(
+            inputPath,
+            outputPath,
+            `-q ${config.quality}`,
+            '-v'
+        );
+
+        if (result) {
+            const convertedSize = fs.statSync(outputPath).size;
+            stats.convertedSize += convertedSize;
+            
+            const ratio = ((1 - convertedSize / originalSize) * 100).toFixed(2);
+            const sizeChange = ratio > 0 ? '压缩' : '增加';
+            console.log(`✅ 成功: ${outputPath}`);
+            console.log(`   ${formatSize(originalSize)} -> ${formatSize(convertedSize)} (${sizeChange} ${Math.abs(ratio)}%)`);
+            
+            // 删除原图
+            if (config.deleteOriginal) {
+                try {
+                    fs.unlinkSync(inputPath);
+                    console.log(`🗑️  已删除原图: ${inputPath}`);
+                    stats.deleted++;
+                } catch (deleteError) {
+                    console.error(`❌ 删除失败: ${inputPath}`);
+                    console.error(`   错误: ${deleteError.message}`);
+                }
+            }
+            
+            stats.success++;
+        }
+    } catch (error) {
+        console.error(`❌ 失败: ${inputPath}`);
+        console.error(`   错误: ${error.message}`);
+        stats.failed++;
+    }
+
+    stats.total++;
+}
+
+/**
+ * 显示帮助信息
+ */
+function showHelp() {
+    console.log(`
+📸 图片转 WebP 格式工具
+
+使用方法:
+  node scripts/convert-to-webp.js [质量值] [选项]
+
+参数:
+  质量值                           设置转换质量 0-100 (默认: 100)
+                                  示例: node scripts/convert-to-webp.js 90
+
+选项:
+  --quality=<0-100>, -q <0-100>   设置转换质量 (默认: 100)
+  --delete-original, -d           转换后删除原图 ⚠️
+  --force, -f                     强制覆盖已存在的文件，不询问
+  --dry-run                       预览模式，不实际转换
+  --dir=<路径>                    指定源目录 (默认: ./src/assets)
+  --help, -h                      显示此帮助信息
+
+使用示例:
+  # 基础用法
+  node scripts/convert-to-webp.js                    # 质量 100
+  node scripts/convert-to-webp.js 90                 # 质量 90
+  node scripts/convert-to-webp.js --quality=80       # 质量 80
+
+  # 预览模式（推荐首次使用）
+  node scripts/convert-to-webp.js --dry-run          # 预览
+  node scripts/convert-to-webp.js 90 --dry-run       # 质量 90 预览
+
+  # 删除原图（谨慎使用）
+  node scripts/convert-to-webp.js 90 --delete-original
+  node scripts/convert-to-webp.js -q 85 -d
+
+  # 强制覆盖
+  node scripts/convert-to-webp.js --force            # 不询问直接覆盖
+  node scripts/convert-to-webp.js 80 -f -d           # 组合使用
+
+  # 指定目录
+  node scripts/convert-to-webp.js --dir=./public/images
+  node scripts/convert-to-webp.js --dir=./assets -q 90
+
+NPM 快捷命令:
+  npm run webp              # 质量 100
+  npm run webp:preview      # 预览模式
+  npm run webp:80           # 质量 80
+  npm run webp:90           # 质量 90
+
+质量推荐:
+  100   最高质量，文件较大 - 适合重要图标、UI 元素
+  90    极佳质量，推荐使用 - 适合游戏角色、场景图
+  80    优秀质量，文件较小 - 适合背景图、装饰图
+  70    良好质量，大幅压缩 - 适合缩略图、临时图片
+
+注意事项:
+  ⚠️  使用 --delete-original 前请确保备份
+  💡 首次使用建议先运行 --dry-run 预览
+  📦 支持格式: .png, .jpg, .jpeg, .jfif
+    `);
+}
+
+/**
+ * 主函数
+ */
+async function main() {
+    // 显示帮助
+    if (process.argv.includes('--help') || process.argv.includes('-h')) {
+        showHelp();
+        process.exit(0);
+    }
+
+    const config = parseArgs();
+
+    console.log('='.repeat(60));
+    console.log('📸 图片转 WebP 格式工具');
+    console.log('='.repeat(60));
+    console.log(`📁 源目录: ${config.dir}`);
+    console.log(`🎨 质量: ${config.quality}%`);
+    console.log(`🔧 模式: ${config.isDryRun ? '预览模式（不会实际转换）' : '转换模式'}`);
+    console.log(`🗑️  删除原图: ${config.deleteOriginal ? '是 ⚠️' : '否'}`);
+    console.log(`⚡ 强制覆盖: ${config.force ? '是' : '否'}`);
+    console.log('='.repeat(60));
+    console.log('');
+
+    // 检查源目录是否存在
+    if (!fs.existsSync(config.dir)) {
+        console.error(`❌ 错误: 目录 ${config.dir} 不存在`);
+        process.exit(1);
+    }
+
+    // 获取所有图片文件
+    console.log('🔍 扫描图片文件...');
+    const imageFiles = getAllImageFiles(config.dir);
+    
+    if (imageFiles.length === 0) {
+        console.log('⚠️  未找到支持的图片文件');
+        console.log(`   支持格式: ${SUPPORTED_EXTENSIONS.join(', ')}`);
+        process.exit(0);
+    }
+
+    console.log(`📝 找到 ${imageFiles.length} 个图片文件\n`);
+
+    // 如果要删除原图且不是预览模式，要求确认
+    if (config.deleteOriginal && !config.isDryRun && !config.force) {
+        console.log('⚠️  警告: 您选择了删除原图选项！');
+        const confirmed = await askConfirmation('确定要继续吗? (y/n): ');
+        if (!confirmed) {
+            console.log('❌ 已取消操作');
+            process.exit(0);
+        }
+        console.log('');
+    }
+
+    // 逐个转换
+    for (const imagePath of imageFiles) {
+        await convertImage(imagePath, config);
+        console.log('');
+    }
+
+    // 输出统计信息
+    console.log('='.repeat(60));
+    console.log('📊 转换统计');
+    console.log('='.repeat(60));
+    console.log(`总计: ${stats.total} 个文件`);
+    console.log(`成功: ${stats.success} 个`);
+    console.log(`失败: ${stats.failed} 个`);
+    console.log(`跳过: ${stats.skipped} 个`);
+    
+    if (config.deleteOriginal && !config.isDryRun) {
+        console.log(`删除: ${stats.deleted} 个原图`);
+    }
+    
+    if (!config.isDryRun && stats.success > 0) {
+        console.log('');
+        console.log(`原始总大小: ${formatSize(stats.originalSize)}`);
+        console.log(`转换后总大小: ${formatSize(stats.convertedSize)}`);
+        const totalRatio = ((1 - stats.convertedSize / stats.originalSize) * 100).toFixed(2);
+        console.log(`总体压缩率: ${totalRatio}%`);
+        console.log(`节省空间: ${formatSize(stats.originalSize - stats.convertedSize)}`);
+    }
+    
+    console.log('='.repeat(60));
+    console.log(config.isDryRun ? '🔍 预览完成！' : '✨ 转换完成！');
+    console.log('='.repeat(60));
+}
+
+// 运行
+main().catch(error => {
+    console.error('❌ 发生错误:', error);
+    process.exit(1);
+});

package/project-templates/playable-template-phaser/src/Game.ts

@@ -0,0 +1,154 @@
+import * as Phaser from 'phaser';
+import { PreloadScene } from './scenes/PreloadScene';
+import { MainScene } from './scenes/MainScene';
+
+// 设计基准宽度（横屏设计）
+const DESIGN_WIDTH = 1280;
+
+/**
+ * Phaser Game 包装器
+ * 
+ * 负责：
+ * - Phaser 游戏实例的创建与销毁
+ * - 场景注册
+ * - 响应式适配
+ * - 横竖屏切换时销毁重建（不使用 location.reload）
+ * - SDK 生命周期回调
+ */
+export class Game {
+  // 当前 Phaser 游戏实例
+  private game!: Phaser.Game;
+  // 记录当前屏幕方向
+  private currentIsLandscape: boolean;
+  // 当前尺寸
+  private currentWidth: number;
+  private currentHeight: number;
+  // 是否正在重建
+  private isRebuilding: boolean = false;
+
+  constructor(width: number, height: number) {
+    this.currentWidth = width;
+    this.currentHeight = height;
+    this.currentIsLandscape = width > height;
+    
+    this.createGame(width, height);
+  }
+
+  /**
+   * 创建 Phaser 游戏实例
+   */
+  private createGame(width: number, height: number): void {
+    const gameWidth = DESIGN_WIDTH;
+    const gameHeight = height * (DESIGN_WIDTH / width);
+
+    this.game = new Phaser.Game({
+      type: Phaser.AUTO,
+      width: gameWidth,
+      height: gameHeight,
+      backgroundColor: '#1c1c1c',
+      parent: document.body,
+      scale: {
+        mode: Phaser.Scale.WIDTH_CONTROLS_HEIGHT,
+        autoCenter: Phaser.Scale.CENTER_BOTH
+      },
+      render: {
+        antialias: true,
+        antialiasGL: true,
+        pixelArt: false,
+      },
+      scene: [PreloadScene, MainScene]
+    });
+  }
+
+  /**
+   * 响应容器尺寸变化
+   * 横竖屏切换时：销毁旧游戏实例，重建新实例
+   * 同方向尺寸变化时：仅 resize
+   */
+  public resize(width: number, height: number): void {
+    const newIsLandscape = width > height;
+    
+    this.currentWidth = width;
+    this.currentHeight = height;
+    
+    // 横竖屏切换：销毁重建
+    if (newIsLandscape !== this.currentIsLandscape) {
+      console.log('Screen orientation changed:',
+        this.currentIsLandscape ? 'landscape→portrait' : 'portrait→landscape');
+      this.currentIsLandscape = newIsLandscape;
+      
+      this.rebuildGame(width, height);
+      return;
+    }
+    
+    // 方向不变时，只调整画布尺寸
+    // 防御性检查：如果游戏正在重建，跳过 resize
+    if (!this.game || this.isRebuilding) {
+      console.warn('Game not ready for resize, skipping');
+      return;
+    }
+    
+    const gameHeight = height * (DESIGN_WIDTH / width);
+    this.game.scale.resize(DESIGN_WIDTH, gameHeight);
+    console.log('Game resized to:', DESIGN_WIDTH, gameHeight);
+  }
+
+  /**
+   * 销毁旧游戏实例并重建新实例
+   */
+  private rebuildGame(width: number, height: number): void {
+    if (this.isRebuilding) {
+      console.warn('Already rebuilding, skip');
+      return;
+    }
+    this.isRebuilding = true;
+    
+    console.log('Rebuilding game for new orientation...');
+    
+    // 销毁旧实例（true = 移除 canvas）
+    try {
+      this.game.destroy(true);
+    } catch (e) {
+      console.warn('Error destroying old game:', e);
+    }
+    
+    // 短暂延迟确保旧 WebGL 上下文完全释放
+    setTimeout(() => {
+      try {
+        this.createGame(width, height);
+        console.log('Game rebuilt successfully for:', width, height);
+      } catch (e) {
+        console.error('Error rebuilding game:', e);
+      }
+      this.isRebuilding = false;
+    }, 100);
+  }
+
+  public pause(): void {
+    if (this.isRebuilding) return;
+    this.game.scene.pause('MainScene');
+    console.log('Game paused');
+  }
+
+  public resume(): void {
+    if (this.isRebuilding) return;
+    this.game.scene.resume('MainScene');
+    console.log('Game resumed');
+  }
+
+  public volume(value: number): void {
+    if (this.isRebuilding) return;
+    this.game.sound.setVolume(value);
+    console.log(`Volume changed to: ${value}`);
+  }
+
+  public finish(): void {
+    if (this.isRebuilding) return;
+    // 游戏结束时清理 AudioManager
+    const mainScene = this.game.scene.getScene('MainScene') as MainScene;
+    if (mainScene && mainScene.audioManager) {
+      mainScene.audioManager.setGameEnded(true);
+    }
+    console.log('Game finished');
+  }
+}

package/project-templates/playable-template-phaser/src/config/LoadingConfig.ts

@@ -0,0 +1,40 @@
+/**
+ * Loading 页面配置
+ * 通过 sdk.getConfig() 动态获取配置
+ */
+import { sdk } from '@playcraft/adsdk';
+
+// 辅助函数：安全获取嵌套配置值
+function get<T>(path: string, fallback: T): T {
+  const config = sdk.getConfig();
+  const keys = path.split('.');
+  let value: any = config;
+  for (const key of keys) {
+    if (value === undefined || value === null) return fallback;
+    value = value[key];
+  }
+  return value !== undefined ? value : fallback;
+}
+
+// ⚠️ 使用 getter 延迟获取，避免模块顶层缓存问题
+export const LoadingConfig = {
+  // ========== 资源配置 ==========
+  get LOGO_IMAGE(): string { return get('loading.logoImage', ''); },
+
+  // ========== 文案配置 ==========
+  get APP_TITLE(): string { return get('loading.appTitle', 'Sola Mahjong'); },
+  get APP_STARS(): string { return get('loading.appStars', '★★★★★'); },
+  get APP_DESC(): string { return get('loading.appDesc', 'Sola Mahjong: Classic Tile\nPairing for a Relaxing Puzzle'); },
+  get LOADING_TEXT(): string { return get('loading.loadingText', 'Loading Playable Ads'); },
+  GAMEPAD_ICON: '🎮',
+
+  // ========== 时间配置 ==========
+  get SCENE_DURATION(): number { return get('loading.sceneDuration', 100); },
+  DOT_ANIM_DELAY: 200,
+  
+  // ========== 跳跃动画配置 ==========
+  BOUNCE_HEIGHT_LANDSCAPE: 8,
+  BOUNCE_HEIGHT_PORTRAIT: 10,
+  BOUNCE_DURATION: 300,
+  BOUNCE_REPEAT_DELAY: 100,
+};

package/project-templates/playable-template-phaser/src/config/ThemeConfig.ts

@@ -0,0 +1,81 @@
+/**
+ * 主题配置接口
+ * 
+ * 通过 sdk.getConfig() 动态获取配置
+ * 配置来源：theme.schema.json5（默认值）+ theme.data.json5（覆盖值）
+ */
+import { sdk } from '@playcraft/adsdk';
+
+// 辅助函数：安全获取嵌套配置值
+function get<T>(path: string, fallback: T): T {
+  const config = sdk.getConfig();
+  const keys = path.split('.');
+  let value: any = config;
+  for (const key of keys) {
+    if (value === undefined || value === null) return fallback;
+    value = value[key];
+  }
+  return value !== undefined ? value : fallback;
+}
+
+export interface ThemeConfig {
+  // 基础信息
+  name: string;
+  id: string;
+  
+  // 视觉配置
+  backgroundColor: number;
+  primaryColor: number;
+  secondaryColor: number;
+  textColor: string;
+  
+  // 字体配置
+  fontSize: {
+    title: string;
+    body: string;
+    button: string;
+  };
+  
+  // 游戏参数
+  difficulty?: number;
+  enableHints?: boolean;
+  
+  // 资源配置
+  assets?: {
+    buttonImage?: string;
+    backgroundImage?: string;
+    logoImage?: string;
+  };
+}
+
+// 主题配置获取器（使用 getter 延迟获取，避免模块顶层缓存问题）
+export const GameThemeConfig = {
+  // ========== 基础信息 ==========
+  get NAME(): string { return get('name', 'Default Theme'); },
+  get ID(): string { return get('id', 'default'); },
+
+  // ========== 视觉配置 ==========
+  get BACKGROUND_COLOR(): number { return get('visual.backgroundColor', 0xf7d37f); },
+  get PRIMARY_COLOR(): number { return get('visual.primaryColor', 0x4a90e2); },
+  get SECONDARY_COLOR(): number { return get('visual.secondaryColor', 0x3498db); },
+  get TEXT_COLOR(): string { return get('visual.textColor', '#ffffff'); },
+
+  // ========== 字体配置 ==========
+  get FONT_SIZE_TITLE(): string { return get('fontSize.title', '48px'); },
+  get FONT_SIZE_BODY(): string { return get('fontSize.body', '24px'); },
+  get FONT_SIZE_BUTTON(): string { return get('fontSize.button', '32px'); },
+
+  // ========== 游戏参数 ==========
+  get DIFFICULTY(): number { return get('gameplay.difficulty', 5); },
+  get ENABLE_HINTS(): boolean { return get('gameplay.enableHints', true); },
+
+  // ========== 资源配置 ==========
+  get ASSET_LOGO(): string { return get('assets.logo', ''); },
+  get ASSET_BUTTON(): string { return get('assets.buttonImage', ''); },
+  get ASSET_BACKGROUND(): string { return get('assets.backgroundImage', ''); },
+
+  // ========== 获取当前渠道 ==========
+  get CURRENT_CHANNEL(): string {
+    return typeof AD_NETWORK !== 'undefined' ? AD_NETWORK : 'preview';
+  },
+};

package/project-templates/playable-template-phaser/src/index.css

@@ -0,0 +1,18 @@
+body,
+html {
+  margin: 0;
+  padding: 0;
+}
+html {
+  background-color: #fff;
+  overflow: hidden;
+  width: 100%;
+  height: 100%;
+}
+body {
+  height: inherit;
+  width: inherit;
+}
+* {
+  -webkit-tap-highlight-color: transparent;
+}

package/project-templates/playable-template-phaser/src/index.html

@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <title>Phaser Playable Template</title>
+  </head>
+  <body>
+  </body>
+</html>

package/project-templates/playable-template-phaser/src/index.ts

@@ -0,0 +1,30 @@
+import { Game } from './Game';
+import './index.css';
+import { sdk } from '@playcraft/adsdk';
+
+// 主题系统
+import ThemeConfig from './theme/theme.schema.json5';
+import Theme from './theme';
+
+// ⚠️ 重要：setConfig 必须在 playcraftInit 之前调用
+// SDK 会合并 schema 默认值 + themeData 覆盖值，并通过 assetRecordByPath 解析路径
+sdk.setConfig([ThemeConfig, Theme.themeData], {
+  assetRecordByPath: Theme.assetRecordByPath,
+});
+
+// Initialize the SDK
+sdk.playcraftInit((width: number, height: number) => {
+  // Initialize game with container dimensions
+  const game = new Game(width, height);
+
+  // Set up all event listeners
+  sdk.on('playcraftResize', game.resize, game);
+  sdk.on('playcraftPause', game.pause, game);
+  sdk.on('playcraftResume', game.resume, game);
+  sdk.on('playcraftVolume', game.volume, game);
+  sdk.on('playcraftFinish', game.finish, game);
+});
+
+if (__DEV__) {
+  console.log('Development mode');
+}