daoqi/erqiwang_youle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

模板工程升级修改

Browse Source
This commit is contained in:
joywayer
2026-08-11 22:17:54 +08:00
parent 047561675b
commit 3b7c103387
38 changed files with 16607 additions and 1205 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/js/00_Surface/04_Data.js
+1 -1
View File
@@ -142,7 +142,7 @@ GameData.hallConfigName = ["enablePay",
'wareHouse',//是否开启仓库功能0->不开启1->开启保险箱不开启赠送2->开启赠送不开启保险箱3->开启星星赠送(开启保险箱)4->开启房卡赠送(开启保险箱)5->开启星星房卡赠送(开启保险箱)
'betaText',//版本号后的beta显示内容
'launchImgUrl',//启动页图片地址
'shareType:',//分享朋友圈类型0->链接分享 1->图片分享
'shareType',//分享朋友圈类型0->链接分享 1->图片分享
'shareImgUrl',//分享朋友圈图片链接
'launchWaitTime',//启动等待时间
'shareBgUrl',//分享背景图片
client/js/00_Surface/05_Func.js
+2 -2
View File
@@ -1377,7 +1377,7 @@ Func.accreditlogin=function(type){
];
var ram = ifast_random(100000);
sharelogin("fff23"+ram,headLoginList[ifast_random(headLoginList.length)],"测试"+ram,ifast_random(2)+1,"nanchang","jiangxi","ylgame"+ram);
sharelogin("fff23"+ram,headLoginList[ifast_random(headLoginList.length)],ram + "测试",ifast_random(2)+1,"nanchang","jiangxi","ylgame"+ram);
// sharelogin("fff23"+ram,headLoginList[ifast_random(headLoginList.length)],"测试"+ram,ifast_random(2)+1,"nanchang","jiangxi","oLVKis6bj3_l8qspMybG60KV2GN4");
}
@@ -2432,7 +2432,7 @@ Func.getmarketname = function(){//
return window.settings.getmarketname();
}catch(e){
if(GameData.userAgent != ConstVal.userAgent.uAgent_3){
return 4;
return 2;
}else{
return app_market;
}
client/js/00_Surface/06_Player.js
+18 -1
View File
@@ -17,6 +17,12 @@ function Player(seat){
//this.offline = 0;//玩家是否离线0->否 1->离线
this.canexit=1;//是否可以直接离开
this.onstate=0;//0:在线1:离线2:通话中
/*
{"address":"江西省南昌市青云谱区施尧路靠近上海浦东发展银行(长天支行)","city":"南昌市",
"cityCode":"0791","country":"中国","district":"青云谱区","latitude":28.623546,"longitude":115.900333,
"province":"江西省","street":"施尧路"}
*/
//定位信息 牌桌外
this.addr = null;
this.invitecode = "";//邀请码
this.isStart = false;//能否点击按钮开始游戏
@@ -31,6 +37,14 @@ function Player(seat){
this.charm = undefined;
this.sign = "";//签名
this.tel = "";//绑定手机号
/*
{"address":"江西省南昌市青云谱区施尧路靠近上海浦东发展银行(长天支行)","city":"南昌市",
"cityCode":"0791","country":"中国","district":"青云谱区","latitude":28.623546,"longitude":115.900333,
"province":"江西省","street":"施尧路"}
*/
//定位信息 牌桌内
this.location = null;
}
//玩家信息初始化
if(typeof(Player.prototype.Init) == "undefined"){
@@ -67,6 +81,7 @@ if(typeof(Player.prototype.Init) == "undefined"){
this.charm = undefined;
this.sign = "";//签名
this.tel = "";//绑定手机号
};
}
//玩家微信信息初始化
@@ -107,6 +122,7 @@ if(typeof(Player.prototype.SetMyInfo) == "undefined"){
this.charm = object.charm;
this.sign = object.sign;
this.tel = object.tel;
//this.setTel();
//this.bankpwd = object.bank;//是否设置仓库密码 this.bankpwd = 0;//是否设置仓库密码
//this.paycode = _paycode;
@@ -121,7 +137,7 @@ if(typeof(Player.prototype.SetLocationInfo) == "undefined"){
}else{
set_self(200, 7, "获取定位失败！", 0, 0);
}
this.location = _locationinfo;
};
}
@@ -279,6 +295,7 @@ if(typeof(Player.prototype.SetDeskInfo) == "undefined"){
}else{
this.paycode = "";
}
this.location = _data.location;
this.charm = _data.charm;
this.sign = _data.sign;
};
client/js/00_Surface/07_Desk.js
+2
View File
@@ -421,6 +421,8 @@ Desk.login=function(_msg){//登录
Func.createRoom();
}
Game_Modify.Reconnect(_msg.data.deskinfo);
}else{
Game_Modify.ReconnectNoMakewar();
}
//}
}else{
client/js/00_Surface/08_Utl_Output.js
+36 -30
View File
@@ -545,43 +545,49 @@ Utl.openVideo = function (_playerList, _seat, _roomcode, roomtype) {
set_self(152, 37, 0, 0, 0);
set_self(153, 37, 0, 0, 0);
set_self(107, 37, 0, 0, 0);
for (var i = 0; i < Desk.PlayerList.length; i++) {
if (Desk.PlayerList[i].nickname != "") {
var ind = Logic.ChangeToStatus(C_Player.seat, i);
var text = Func.subString(Desk.PlayerList[i].nickname, Game_Config.Info.Mainnickname, true);
set_self(406 + ind, 7, text, 0, 0);
if (ind == 0) {
if (Game_Config.Info.myPositionDefault) {
set_self(406 + ind, 18, get_self(376 + ind, 18, 0, 0, 0) + get_self(376 + ind, 20, 0, 0, 0) / 2 - text.gblen() * Game_Config.Info.textwidth_1 / 2, 0, 0);
// if (Game_Modify.updatePlayerInfoUI) {
// for (var i = 0; i < Desk.PlayerList.length; i++) {
// Game_Modify.updatePlayerInfoUI(i);
// }
// } else {
for (var i = 0; i < Desk.PlayerList.length; i++) {
if (Desk.PlayerList[i].nickname != "") {
var ind = Logic.ChangeToStatus(C_Player.seat, i);
var text = Func.subString(Desk.PlayerList[i].nickname, Game_Config.Info.Mainnickname, true);
set_self(406 + ind, 7, text, 0, 0);
if (ind == 0) {
if (Game_Config.Info.myPositionDefault) {
set_self(406 + ind, 18, get_self(376 + ind, 18, 0, 0, 0) + get_self(376 + ind, 20, 0, 0, 0) / 2 - text.gblen() * Game_Config.Info.textwidth_1 / 2, 0, 0);
} else {
set_self(406 + ind, 18, Game_Config.Info.myPosition - text.gblen() * Game_Config.Info.textwidth_1 / 2, 0, 0);
}
} else {
set_self(406 + ind, 18, Game_Config.Info.myPosition - text.gblen() * Game_Config.Info.textwidth_1 / 2, 0, 0);
if (Game_Config.Info.otherPositionDefault) {
set_self(406 + ind, 18, get_self(376 + ind, 18, 0, 0, 0) + get_self(376 + ind, 20, 0, 0, 0) / 2 - text.gblen() * Game_Config.Info.textwidth_1 / 2, 0, 0);
} else {
set_self(406 + ind, 18, Game_Config.Info.position[ind - 1] - text.gblen() * Game_Config.Info.textwidth_1 / 2, 0, 0);
}
}
} else {
if (Game_Config.Info.otherPositionDefault) {
set_self(406 + ind, 18, get_self(376 + ind, 18, 0, 0, 0) + get_self(376 + ind, 20, 0, 0, 0) / 2 - text.gblen() * Game_Config.Info.textwidth_1 / 2, 0, 0);
} else {
set_self(406 + ind, 18, Game_Config.Info.position[ind - 1] - text.gblen() * Game_Config.Info.textwidth_1 / 2, 0, 0);
}
}
set_self(436 + ind, 7, 0, 0, 0);
if (ind == 0) {
if (Game_Config.Info.myPositionDefault) {
set_self(436 + ind, 18, get_self(376 + ind, 18, 0, 0, 0) + get_self(376 + ind, 20, 0, 0, 0) / 2 - Game_Config.Info.textwidth_2 / 2, 0, 0);
set_self(436 + ind, 7, 0, 0, 0);
if (ind == 0) {
if (Game_Config.Info.myPositionDefault) {
set_self(436 + ind, 18, get_self(376 + ind, 18, 0, 0, 0) + get_self(376 + ind, 20, 0, 0, 0) / 2 - Game_Config.Info.textwidth_2 / 2, 0, 0);
} else {
set_self(436 + ind, 18, Game_Config.Info.myPosition - Game_Config.Info.textwidth_2 / 2, 0, 0);
}
} else {
set_self(436 + ind, 18, Game_Config.Info.myPosition - Game_Config.Info.textwidth_2 / 2, 0, 0);
}
} else {
if (Game_Config.Info.otherPositionDefault) {
set_self(436 + ind, 18, get_self(376 + ind, 18, 0, 0, 0) + get_self(376 + ind, 20, 0, 0, 0) / 2 - Game_Config.Info.textwidth_2 / 2, 0, 0);
} else {
set_self(436 + ind, 18, Game_Config.Info.position[ind - 1] - Game_Config.Info.textwidth_2 / 2, 0, 0);
if (Game_Config.Info.otherPositionDefault) {
set_self(436 + ind, 18, get_self(376 + ind, 18, 0, 0, 0) + get_self(376 + ind, 20, 0, 0, 0) / 2 - Game_Config.Info.textwidth_2 / 2, 0, 0);
} else {
set_self(436 + ind, 18, Game_Config.Info.position[ind - 1] - Game_Config.Info.textwidth_2 / 2, 0, 0);
}
}
Func.up_imgurl(116 + ind, Desk.PlayerList[i].avatar);
set_group(43 + ind, 37, 1, 0, 0);
}
Func.up_imgurl(116 + ind, Desk.PlayerList[i].avatar);
set_group(43 + ind, 37, 1, 0, 0);
}
}
// }
play_ani123(1, 156, 35, 255, 100, 1000, 0, 0, 1);
Utl.playMusic();
set_self(3141, 37, 0, 0, 0);
client/js/00_Surface/12_Logic.js
+28 -27
View File
@@ -337,35 +337,35 @@ Logic.AppStart=function(){
// 解决：覆盖全局字体渲染函数，统一使用更粗的中文友好字体
// 保存原始的 Canvas fillText 方法
var originalFillText = CanvasRenderingContext2D.prototype.fillText;
var originalStrokeText = CanvasRenderingContext2D.prototype.strokeText;
// var originalFillText = CanvasRenderingContext2D.prototype.fillText;
// var originalStrokeText = CanvasRenderingContext2D.prototype.strokeText;
// 覆盖 fillText 方法，在绘制前统一字体设置
CanvasRenderingContext2D.prototype.fillText = function() {
// 如果当前字体包含 'lighter' 或只有 'Arial'，替换为更适合中文的字体
if (this.font && (this.font.includes('lighter') || this.font.includes('Arial'))) {
// 提取字体大小
var sizeMatch = this.font.match(/(\d+)px/);
if (sizeMatch) {
var size = sizeMatch[1];
// 使用 500 字重（中等粗细）+ 中文友好字体
this.font = '500 ' + size + 'px "Microsoft YaHei", "PingFang SC", Arial, sans-serif';
}
}
return originalFillText.apply(this, arguments);
};
// // 覆盖 fillText 方法，在绘制前统一字体设置
// CanvasRenderingContext2D.prototype.fillText = function() {
// // 如果当前字体包含 'lighter' 或只有 'Arial'，替换为更适合中文的字体
// if (this.font && (this.font.includes('lighter') || this.font.includes('Arial'))) {
// // 提取字体大小
// var sizeMatch = this.font.match(/(\d+)px/);
// if (sizeMatch) {
// var size = sizeMatch[1];
// // 使用 500 字重（中等粗细）+ 中文友好字体
// this.font = '500 ' + size + 'px "Microsoft YaHei", "PingFang SC", Arial, sans-serif';
// }
// }
// return originalFillText.apply(this, arguments);
// };
// 同样覆盖 strokeText 方法
CanvasRenderingContext2D.prototype.strokeText = function() {
if (this.font && (this.font.includes('lighter') || this.font.includes('Arial'))) {
var sizeMatch = this.font.match(/(\d+)px/);
if (sizeMatch) {
var size = sizeMatch[1];
this.font = '500 ' + size + 'px "Microsoft YaHei", "PingFang SC", Arial, sans-serif';
}
}
return originalStrokeText.apply(this, arguments);
};
// // 同样覆盖 strokeText 方法
// CanvasRenderingContext2D.prototype.strokeText = function() {
// if (this.font && (this.font.includes('lighter') || this.font.includes('Arial'))) {
// var sizeMatch = this.font.match(/(\d+)px/);
// if (sizeMatch) {
// var size = sizeMatch[1];
// this.font = '500 ' + size + 'px "Microsoft YaHei", "PingFang SC", Arial, sans-serif';
// }
// }
// return originalStrokeText.apply(this, arguments);
// };
// console.log('[字体优化] Canvas 文字渲染已优化，中英文粗细统一');
// ============================================================================
@@ -1796,6 +1796,7 @@ Logic.setConfigInfo = function(){
}
for(var i=0;i<GameData.hallConfigName.length;i++){
var val = get_paravalue(GameData.serverConfig,GameData.hallConfigName[i]);
// console.log(GameData.hallConfigName[i] + val);
if(val != null){
GameData.hallConfig[GameData.hallConfigName[i]] = val;
}
client/js/01_SubGame/00_SubGame_Config.js
+5 -5
View File
@@ -13,8 +13,8 @@ Game_Config.Debugger={//调试配置
visitorLogin : true,//隐藏式游客登录
visiblePay:true,//审核通过后是否显示支付按钮
serverType:1,//0->正式服务器 1->本地服务器 http://ylyxservice1.0791ts.cn/config/update_json.txt
gameserver:"https://tsgames.daoqi88.cn/config_test/beta_update_jsonv2.txt"+"?"+ifast_random(100000)
// gameserver:"https://tsgames.daoqi88.cn/config_test/test_update_jsonv2.txt"+"?"+ifast_random(100000)
// gameserver:"https://tsgames.daoqi88.cn/config_test/beta_update_jsonv2.txt"+"?"+ifast_random(100000)
gameserver:"https://tsgames.daoqi88.cn/config/update_jsonv2.txt"+"?"+ifast_random(100000)
//gameserver:"https://gameotherwork.ld2sw.cn/update_json/update_json_haiwai.txt"+"?"+ifast_random(100000)
// gameserver:"https://tsgames.daoqi88.cn/config/update_jsonv2.txt"+"?"+ifast_random(100000)
@@ -46,13 +46,13 @@ Game_Config.Info = {
myPosition:130,//自己信息对齐点(根据游戏界面自行修改)
position:[],//其他主界面玩家信息（昵称、积分）居中对齐的x坐标 注意是其他玩家不包括自己从下家开始
//TextContent:["1","2","3","4","5","6","7"],//常用语内容
TextContent:["你好","2","3","4","5","6","7"],//常用语内容
TextContent:["不要吵了不要吵了，专心玩游戏吧。","不要走，决战到天亮！","大家好，很高兴见到各位。","各位真是不好意思，我要离开一会儿。","快点吧，我等的花儿都谢了！","再见了，我会想念大家的。","怎么又断线了，网络怎么这么差啊！"],//常用语内容
TextContentMp3:["","","","","","",""],//常用语对应音效
};
Game_Config.Share={//分享参数
appdownload:"",//下载链接(无需配置，从服务器获取)
title:"Test",//(分享标题)
description:"hello world",//分享描述
title:"进贤麻将",//(分享标题)
description:"欢乐无限",//分享描述
gameTitle:"",//游戏中的分享标题模板工程会自动将游戏名字分享出去、不必写在这个变量里
gameDescription:""//游戏中分享描述
};
client/js/01_SubGame/02_SubGame_Input.js
+5
View File
@@ -93,6 +93,11 @@ Game_Modify.Reconnect = function (_deskinfo) {
if (window.SubGameHooks && SubGameHooks.Reconnect) return SubGameHooks.Reconnect(_deskinfo);
};
// A 类：未开战重连，无 hook 即 no-op
Game_Modify.ReconnectNoMakewar = function () {
if (window.SubGameHooks && SubGameHooks.ReconnectNoMakewar) return SubGameHooks.ReconnectNoMakewar();
};
// A 类：关闭所有声音，无 hook 即 no-op
Game_Modify.stopAllSounds = function () {
if (window.SubGameHooks && SubGameHooks.stopAllSounds) return SubGameHooks.stopAllSounds();
client/js/client_Event.js
+1
View File
@@ -0,0 +1 @@
//精灵事件单元...
client/js/docs/Spine动画集成手册.md
+38 -21
View File
@@ -2,7 +2,10 @@
> 本手册针对 **gameabc 引擎** 的 Spine 项目，说明如何在 Canvas 2D 游戏中加载、
> 控制和管理 Spine 骨骼动画。
> 运行时版本：**spine-canvas 4.2** | 引擎：**gameabc**
> 运行时版本：**Spine 4.2**，`spine-webgl` 与 `spine-canvas` 二选一 —— `index.html`
> 会先探测 WebGL 能力，只加载其中一套（两者暴露同一个全局名 `spine`，同时加载会互相覆盖）；
> WebGL 可用时走叠加层渲染，否则回落 Canvas 2D。上层调用方式两者完全一致。
> 引擎：**gameabc**
---
@@ -27,7 +30,8 @@
Projects/Spine/
├── index.html ← 入口 HTML
├── js/
│ ├── spine-canvas.js ← Spine Canvas 2D 运行时 (第三方库)
│ ├── spine-webgl.js ← Spine WebGL 运行时 (第三方库，探测后二选一)
│ ├── spine-canvas.js ← Spine Canvas 2D 运行时 (第三方库，探测后二选一)
│ ├── gameabc.min.js ← gameabc 游戏引擎
│ ├── SpineMgr.js ← ★ Spine 动画管理器（独立文件，自动挂钩渲染）
│ ├── gamemain.js ← 游戏主逻辑（无需修改）
@@ -48,7 +52,7 @@ Projects/Spine/
| 文件 | 作用 | 需要修改 |
|------|------|----------|
| `js/spine-canvas.js` | Spine 4.2 Canvas 渲染运行时 | ✗ 不要修改 |
| `js/spine-webgl.js` / `js/spine-canvas.js` | Spine 4.2 运行时，`index.html` 探测后**只加载一套** | ✗ 不要修改 |
| `js/SpineMgr.js` | Spine 动画管理器，自动初始化+自动渲染 | ✗ 不需要修改 |
| `js/gamemain.js` | 游戏主逻辑（保持原样） | ✗ 不需要修改 |
| `js/Spine_Event.js` | Spine 动画完成/自定义事件回调 | ✓ 处理动画事件 |
@@ -593,15 +597,19 @@ gameabc_face.mouseup = function(gameid, spid_down, downx, downy, spid_up, upx, u
gameabc_face.spineMgr.setAnimation("hero", "idle", true);
};
// ⚠️ 不要直读 spineMgr._entries[...]：entry 表是 SpineMgr 的内部状态，
// 调用方自己维护业务坐标，并用 ensureEntry 保证 entry 存在即可。
var heroX = 640, heroY = 360;
gameabc_face.mousemove = function(gameid, spid, downx, downy, movex, movey, timelong, offmovex, offmovey) {
// 通过拖拽移动角色
var mgr = gameabc_face.spineMgr;
var entry = mgr._entries["hero"];
if (entry) {
mgr.setPosition("hero", entry.x + offmovex, entry.y + offmovey);
// 根据移动方向翻转
mgr.setFlip("hero", offmovex < 0, false);
}
mgr.ensureEntry("hero", "hero.json", "hero.atlas", { scale: 1 });
heroX += offmovex;
heroY += offmovey;
mgr.setPosition("hero", heroX, heroY);
// 根据移动方向翻转
mgr.setFlip("hero", offmovex < 0, false);
};
```
@@ -742,7 +750,7 @@ gameabc_face.gamemydraw = function(gameid, spid, times, timelong) {
3. **打开浏览器控制台（F12）看报错**
- 404 错误：文件路径有误
- JSON 解析错误：`.json` 文件格式异常
- `spine is not defined`：`spine-canvas.js` 未正确加载
- `spine is not defined`：`spine-webgl.js` / `spine-canvas.js` 均未加载（探测脚本未执行或路径错）
4. **坐标是否在可见范围内？**
- 项目设计尺寸为 1280×720，检查 `x` 和 `y` 是否在此范围
@@ -762,11 +770,17 @@ gameabc_face.gamemydraw = function(gameid, spid, times, timelong) {
- 检查 `gameabc_Project` 中的 `fps` 设置（默认 30）
- SpineMgr 内部是用 `Date.now()` 计算真实时间差的，不依赖帧率
- 如果需要倍速播放，修改 `state.timeScale`：
- 如果需要倍速播放，用 `setAnimation` 的返回值（Spine 的 TrackEntry）改 `timeScale`：
```javascript
var entry = gameabc_face.spineMgr._entries["hero"];
entry.state.timeScale = 2.0; // 2 倍速
var mgr = gameabc_face.spineMgr;
mgr.ensureEntry("hero", "hero.json", "hero.atlas", { scale: 1 });
var track = mgr.setAnimation("hero", "run", true);
if (track) { track.timeScale = 2.0; } // 2 倍速
// 资源尚未就绪时 setAnimation 会把命令排队并返回 null，下一帧就绪后自动执行
```
⚠️ 不要直读 `spineMgr._entries[...]` 拿 `state` —— entry 表是 SpineMgr 的内部状态，
其生命周期（何时 load / 何时因 scale 变化重建）由 SpineMgr 独占管理，
外部持有的引用随时可能失效（如 WebGL context 恢复后整表重建）。
### Q4: 切换动画时有跳帧
@@ -778,9 +792,9 @@ gameabc_face.gamemydraw = function(gameid, spid, times, timelong) {
- 确认没有同一个 id 加载两次
- 检查 `ctx.save()` / `ctx.restore()` 是否配对（SpineMgr 内部已处理）
### Q6: spine-canvas.js 版本与 Spine 编辑器版本不匹配
### Q6: Spine 运行时版本与 Spine 编辑器版本不匹配
- **spine-canvas.js 4.2** 需搭配 **Spine 编辑器 4.2.x** 导出的数据
- **spine-webgl / spine-canvas 4.2** 需搭配 **Spine 编辑器 4.2.x** 导出的数据
- 如果使用 Spine 4.1 编辑器，请下载对应版本的运行时：
```
https://unpkg.com/@esotericsoftware/spine-canvas@4.1/dist/iife/spine-canvas.js
@@ -793,13 +807,16 @@ gameabc_face.gamemydraw = function(gameid, spid, times, timelong) {
`index.html` 中的 script 标签加载顺序至关重要：
```
1. spine-canvas.js ← 先加载 Spine 运行时 (定义 window.spine)
1. spine-webgl.js 或 spine-canvas.js
← 先加载 Spine 运行时 (定义 window.spine)，探测后只加载一套
2. gameabc.min.js ← 再加载游戏引擎
3. SpineMgr.js ← Spine 管理器 + defineProperty 自动挂钩渲染
4. gamemain.js ← 游戏主逻辑（不需修改，直接调用 API 即可）
5. Spine_Event.js ← Spine 事件回调 (依赖 gameabc_face)
6. Project1_Event.js ← 精灵事件
7. gameabc_data.min.js ← 项目配置数据 (引擎初始化)
3. SpineOverlayTransform.js / SpineBackendCanvas.js / SpineBackendWebGL.js
← 渲染后端，必须在 SpineMgr.js 之前（SpineMgr 末尾会立即执行预加载块）
4. SpineMgr.js ← Spine 管理器 + defineProperty 自动挂钩渲染
5. gamemain.js ← 游戏主逻辑（不需修改，直接调用 API 即可）
6. Spine_Event.js ← Spine 事件回调 (依赖 gameabc_face)
7. Project1_Event.js ← 精灵事件
8. gameabc_data.min.js ← 项目配置数据 (引擎初始化)
```
> **不能调换顺序**，`SpineMgr.js` 必须在 `gamemain.js` 之前加载，
client/js/gameabc-framework/core/GameABCUtils.js
+1 -1
View File
@@ -832,7 +832,7 @@ var GameABCUtils = (function() {
};
// console.log('📐 注册裁剪区域: 容器=' + containerId +
// ', 区域=(' + x + ',' + y + ',' + w + ',' + h + ')');
// ', 区域=(' + x + ',' + y + ',' + w + ',' + h + ')');
return true;
},
client/js/gameabc-framework/core/SpriteManager.js
+3 -3
View File
@@ -283,7 +283,7 @@ var SpriteManager = (function() {
return true;
}
console.log('🎨 SpriteManager: 开始初始化 (重构版 v2.0)');
// console.log('🎨 SpriteManager: 开始初始化 (重构版 v2.0)');
// 检查依赖
if (typeof GameABCUtils === 'undefined') {
@@ -292,8 +292,8 @@ var SpriteManager = (function() {
}
_isInitialized = true;
console.log('✅ SpriteManager: 初始化完成');
console.log('ℹ️ SpriteManager: 设计原则 - 精灵由编辑器创建，代码只操作属性');
// console.log('✅ SpriteManager: 初始化完成');
// console.log('ℹ️ SpriteManager: 设计原则 - 精灵由编辑器创建，代码只操作属性');
return true;
},
client/js/gameabc-framework/network/RpcHelper.js
+15 -15
View File
@@ -95,21 +95,21 @@ var RpcHelper = {
}
// 5. 调试信息输出
if (debug || Game_Config.Debugger.isDebugger) {
console.log('RpcHelper发送RPC:', {
app: app,
route: route,
rpc: rpc,
platform_data: {
agentid: data.agentid,
gameid: data.gameid,
playerid: data.playerid,
roomcode: data.roomcode
},
game_data: gameData,
custom_data: customData
});
}
// if (debug || Game_Config.Debugger.isDebugger) {
// console.log('RpcHelper发送RPC:', {
// app: app,
// route: route,
// rpc: rpc,
// platform_data: {
// agentid: data.agentid,
// gameid: data.gameid,
// playerid: data.playerid,
// roomcode: data.roomcode
// },
// game_data: gameData,
// custom_data: customData
// });
// }
// 6. 通过框架发送RPC请求
Utl.sendData(app, route, rpc, data);
client/js/gameabc-framework/spine/SpineBackendCanvas.js
+69
View File
@@ -0,0 +1,69 @@
// ============================================================
// SpineBackendCanvas —— Canvas 2D 渲染后端
// 由 SpineMgr 在 WebGL 不可用时使用。逻辑迁自 SpineMgr.updateAndDraw，行为不变。
//
// 已知性能特征：开启 triangleRendering 后，spine-canvas 对每个三角形都执行一次
// clip() 加一次整张图集的 drawImage。mesh 密集的骨架（如 qixingshisanlan 2784
// 三角形）在 iOS WKWebView 上会因 clip 叠加非轴对齐变换失去 GPU 快路径而卡顿。
// 故本后端仅作回退，主路径见 SpineBackendWebGL。
// ============================================================
(function(){
var SpineBackendCanvas = {
name: "canvas",
_renderer: null,
_ctx: null,
// 是否可用：spine 运行时须提供 Canvas 2D 的 SkeletonRenderer
isAvailable: function() {
return !!(window.spine && window.spine.SkeletonRenderer && !window.spine.SceneRenderer);
},
createAssetManager: function(basePath) {
return new spine.AssetManager(basePath);
},
// Canvas 后端：骨骼位置归零，实际位置由 drawEntry 的 ctx.translate 控制。
// 由 SpineMgr 在 updateWorldTransform 之前调用 —— 之后再改 skeleton.x/y 不会重算
// 世界变换，本帧不生效。
placeEntry: function(entry) {
entry.skeleton.x = 0;
entry.skeleton.y = 0;
},
// 每帧开始：取 gameabc 的绘制上下文
beginFrame: function() {
var ctx = gameabc_face.dc;
if (!ctx) return false;
this._ctx = ctx;
if (!this._renderer) {
this._renderer = new spine.SkeletonRenderer(ctx);
this._renderer.triangleRendering = true; // ★ 启用三角形渲染以支持 Mesh 网格附件
}
// 确保 renderer 用的是当前 ctx (gameabc可能重建)
this._renderer.ctx = ctx;
return true;
},
drawEntry: function(entry) {
var ctx = this._ctx;
ctx.save();
ctx.translate(entry.x, entry.y);
ctx.scale(1, -1); // ★ Spine Y-up → Canvas Y-down（scale 已烘焙进 SkeletonJson.scale）
this._renderer.draw(entry.skeleton);
ctx.restore();
},
endFrame: function() {
this._ctx = null;
}
};
if (typeof module !== "undefined" && module.exports) {
module.exports = SpineBackendCanvas;
}
window.SpineBackendCanvas = SpineBackendCanvas;
})();
client/js/gameabc-framework/spine/SpineBackendWebGL.js
+315
View File
@@ -0,0 +1,315 @@
// ============================================================
// SpineBackendWebGL —— WebGL 渲染后端（主路径）
//
// 在主画布之上叠加一张透明 canvas 绘制 Spine。相比 Canvas 2D 后端，mesh 密集的
// 骨架从"每三角形一次 clip + 整图 drawImage"变为一次 draw call。
//
// 坐标标定：不逆向混淆的 gameabc.min.js，而是每帧从 ctx.getTransform() 读取
// 权威变换矩阵，交由 SpineOverlayTransform 换算成 MVP。
//
// 真机实测确认的完整链路（gameabc_face.dc 属于一张离屏画布，并非 DOM 中可见的
// #canvas，两者是完全不同的两个对象）：
// Spine 坐标 --ctx.getTransform()--> 离屏画布像素(gameabc_face.dc.canvas，
// 实测 backing 1280x720，不在 DOM，getBoundingClientRect() 恒为 0)
// --gameabc 内部 blit--> 显示画布 #canvas（DOM 中可见，实测 backing 1912x880）
// --CSS--> 屏幕（实测 rect 956x440）
//
// 因此本文件区分两个几何来源，各司其职、不可合并成一个：
// - NDC 分母（buildMvp 的 canvasW/canvasH）：取 gameabc_face.dc.canvas 的
// width/height —— Spine 坐标是喂给 dc 的，分母必须与其同源。
// - 叠加层的定位/CSS 尺寸/drawing buffer：取显示画布 #canvas 的
// getBoundingClientRect() 与 width/height(backing) —— 叠加层要盖在屏幕上
// 可见的画面上，且 drawing buffer 尺寸须与主画布有效分辨率一致。
// 历史教训：曾把两者当成同一个对象 —— 用 #canvas 的尺寸做 NDC 分母则缩放错
// （X/Y 倍数不同、宽高比歪）；后又改成全部从 dc.canvas 取，结果叠加层去对齐
// 离屏画布拿到的 rect(0,0,0,0)，_syncSize 每帧提前 return，特效完全不显示。
// ============================================================
(function(){
// gameabc 的全局 logmessage 默认走 mode 0，是空操作（见 gameabc.min.js 的实现），
// 诊断日志必须直接走 console 才能在浏览器与真机 WebView 里看到。
function spineLog(msg) {
if (typeof console !== "undefined" && console.log) {
console.log(msg);
}
}
function spineWarn(msg) {
if (typeof console !== "undefined" && console.warn) {
console.warn(msg);
}
}
var SpineBackendWebGL = {
name: "webgl",
_canvas: null,
_gl: null,
_context: null, // spine.ManagedWebGLRenderingContext
_shader: null,
_batcher: null,
_renderer: null,
_mvp: null, // 复用的 16 元素数组，避免每帧分配
_loggedCanvasIdentity: false, // 权威画布诊断日志只打一次，避免每帧刷屏
_contextLost: false,
_hadVisible: false, // 上一帧是否有可见 entry（用于空闲帧跳过）
_assetManager: null,
_lossHandlersBound: false, // context lost 监听只绑一次
// 是否可用：spine 运行时须是 webgl 版（提供 SceneRenderer 等 GL 专有类）
isAvailable: function() {
return !!(window.spine && window.spine.SceneRenderer && window.SpineOverlayTransform);
},
// (内部) 惰性初始化 GL 资源。失败返回 false，SpineMgr 侧不再绘制。
_ensureGL: function() {
if (this._gl) return true;
this._canvas = document.getElementById("spine_gl");
if (!this._canvas) {
spineWarn("[SpineBackendWebGL] 缺少 spine_gl 元素");
return false;
}
var gl = null;
try {
// alpha:true 让叠加层透出下方主画布；premultipliedAlpha 交由 spine 按图集 pma 标记处理
var opts = { alpha: true, premultipliedAlpha: true, antialias: true, depth: false, stencil: false };
gl = this._canvas.getContext("webgl", opts) || this._canvas.getContext("experimental-webgl", opts);
} catch (err) {
spineWarn("[SpineBackendWebGL] getContext 异常: " + err.message);
return false;
}
if (!gl) {
spineWarn("[SpineBackendWebGL] 无法取得 WebGL context");
return false;
}
this._gl = gl;
this._bindContextLossHandlers();
// context 恢复时复用同一个 ManagedWebGLRenderingContext：
// canvas.getContext() 恢复后返回的是同一个 WebGLRenderingContext 对象，
// 重新 new 会让新纹理注册到新 managed context，而 _assetManager 仍挂在旧的上，
// 造成新旧分叉。shader / batcher / renderer 持有失效的 GPU 资源，则必须重建。
if (!this._context) {
this._context = new spine.ManagedWebGLRenderingContext(gl);
}
// 复用 _context 的代价：Shader / Mesh 构造时都会 context.addRestorable(this)，
// 只有 dispose() 才 removeRestorable。每次 context 恢复都会重走本段，
// 旧对象若不释放就永久堆在 restorables 里（旧 shader 程序 + batcher 顶点/索引缓冲），
// 恢复次数越多占用越大。context 已丢失时 gl.deleteShader/deleteBuffer 按规范是 no-op，
// 安全；仍加 try/catch 防御，释放失败不能挡住重建。
// （SkeletonRenderer 不持有 GL 资源、无 dispose，不需处理。）
if (this._shader) {
try {
this._shader.dispose();
} catch (errShader) {
spineWarn("[SpineBackendWebGL] 释放旧 shader 失败(已忽略): " + errShader.message);
}
this._shader = null;
}
if (this._batcher) {
try {
this._batcher.dispose();
} catch (errBatcher) {
spineWarn("[SpineBackendWebGL] 释放旧 batcher 失败(已忽略): " + errBatcher.message);
}
this._batcher = null;
}
this._shader = spine.Shader.newTwoColoredTextured(this._context);
this._batcher = new spine.PolygonBatcher(this._context);
// 中和 blend 模式：spine-canvas 的 drawTriangles 只跟踪 slot.data.blendMode 却从不应用
// （该文件全文无 globalCompositeOperation），即迁移前所有槽都是按 source-over 画的。
// spine-webgl 的 SkeletonRenderer 会真的调 batcher.setBlendMode()，在"清成透明黑"的
// 叠加层上，screen 槽会输出非预乘颜色导致过亮/白边，multiply 槽会因 srcRgb=DST_COLOR
// 而 RGB 恒 0 变成纯黑剪影（本项目 start 有 9 个 screen 槽，而 game_start 每局必播）。
// additive 在叠加层上恰好等价于 source-over，无差异。
// 本次迁移只求性能、不引入视觉变化，故在此中和，保持 begin() 设定的 Normal 混合
// （SkeletonRenderer.premultipliedAlpha 默认 false，与 PolygonBatcher 构造时的
// SRC_ALPHA / ONE_MINUS_SRC_ALPHA 默认值一致，即"未中和时 Normal 槽会设成的那一组"）。
// 是否放开真实 blend，留作将来一次独立的、经美术确认的改动。
// ⚠️ 必须紧跟每一次 new PolygonBatcher —— context 恢复会重建 batcher，写在别处即失效。
this._batcher.setBlendMode = function() {};
this._renderer = new spine.SkeletonRenderer(this._context);
this._mvp = new Array(16);
gl.disable(gl.DEPTH_TEST);
gl.enable(gl.BLEND);
return true;
},
// (内部) WebGL context lost / restored。
// iOS 在内存压力或切后台返回时会真实触发；不处理的表现是"特效突然全部消失且不再恢复"。
// ⚠️ 只能绑一次：context restored 后 _gl 被置 null，_ensureGL 会重新走一遍，
// 若不加此闩，每恢复一次就多挂一对监听器，重复触发且泄漏。
_bindContextLossHandlers: function() {
if (this._lossHandlersBound) return;
this._lossHandlersBound = true;
var self = this;
this._canvas.addEventListener("webglcontextlost", function(ev){
ev.preventDefault(); // 必须 preventDefault，否则不会触发 restored
self._contextLost = true;
spineWarn("[SpineBackendWebGL] context lost");
}, false);
this._canvas.addEventListener("webglcontextrestored", function(){
spineLog("[SpineBackendWebGL] context restored，重建 GL 资源与纹理");
self._contextLost = false;
self._gl = null; // 迫使 _ensureGL 重建 shader/batcher/renderer
self._hadVisible = false; // 复位空闲帧状态机，避免恢复后多发一次 clear
if (self._onContextRestored) self._onContextRestored();
}, false);
},
// 由 SpineMgr 注入的纹理重建回调（Task 7 接入）
_onContextRestored: null,
createAssetManager: function(basePath) {
if (!this._ensureGL()) {
// GL 不可用时不静默降级成"看似成功"，直接抛出让 SpineMgr.init 失败，
// 由 index.html 的探测脚本保证不会走到这里。
throw new Error("[SpineBackendWebGL] GL 初始化失败，无法创建 AssetManager");
}
this._assetManager = new spine.AssetManager(this._context, basePath);
return this._assetManager;
},
// WebGL 后端：位移并入骨骼，使所有 entry 共用同一 MVP，可批量绘制。
// y 取负是因为 MVP 中含 Spine Y-up → 画布 Y-down 的翻转（见 SpineOverlayTransform 推导）。
placeEntry: function(entry) {
entry.skeleton.x = entry.x;
entry.skeleton.y = -entry.y;
},
beginFrame: function(visibleCount) {
if (this._contextLost) return false;
if (!this._ensureGL()) return false;
// 绘制缓冲画布(NDC 分母来源)：Spine 坐标是喂给 dc 的，分母必须与其同源，
// 只能每帧从 dc 派生（createAssetManager 阶段 dc 可能还不存在，故不能在
// _ensureGL 里固定取一次）。数据源唯一，取不到即报错跳帧，禁止 || 兜底。
var ctx = gameabc_face.dc;
if (!ctx) return false;
var drawCanvas = ctx.canvas;
if (!drawCanvas) {
spineWarn("[SpineBackendWebGL] gameabc_face.dc.canvas 不存在（非标准 CanvasRenderingContext2D 实现），本帧跳过");
return false;
}
// 显示画布(叠加层定位/CSS 尺寸/drawing buffer 来源)：index.html 中
// <div id="ifastgame"><canvas id="canvas"> 是 gameabc 平台约定的固定
// 显示画布契约，并非按 id 猜——但仍须校验存在性/在 DOM/rect 有效，
// 任一项不满足都不能静默继续绘制。
var displayCanvas = (typeof document !== "undefined" && document.getElementById) ? document.getElementById("canvas") : null;
if (!displayCanvas) {
spineWarn("[SpineBackendWebGL] 找不到显示画布 document.getElementById(\"canvas\")，本帧跳过");
return false;
}
if (!displayCanvas.parentNode) {
spineWarn("[SpineBackendWebGL] 显示画布 #canvas 不在 DOM 中，本帧跳过");
return false;
}
var displayRect = displayCanvas.getBoundingClientRect();
if (!displayRect || displayRect.width <= 0 || displayRect.height <= 0) {
spineWarn("[SpineBackendWebGL] 显示画布 #canvas 的 rect 尺寸无效，本帧跳过");
return false;
}
this._logCanvasIdentityOnce(drawCanvas, displayCanvas, displayRect);
// 空闲帧跳过：麻将大部分时间无特效在播，不能因叠加层存在就每帧空 clear 全屏。
// 仅在从"有"变"无"的那一帧 clear 一次收尾。
if (visibleCount === 0) {
if (!this._hadVisible) return false;
this._hadVisible = false;
this._syncSize(displayCanvas);
this._gl.clearColor(0, 0, 0, 0);
this._gl.clear(this._gl.COLOR_BUFFER_BIT);
return false;
}
this._hadVisible = true;
if (!this._syncSize(displayCanvas)) return false;
var m = this._readTransform(ctx);
SpineOverlayTransform.buildMvp(m, drawCanvas.width, drawCanvas.height, this._mvp);
var gl = this._gl;
gl.clearColor(0, 0, 0, 0);
gl.clear(gl.COLOR_BUFFER_BIT);
this._shader.bind();
this._shader.setUniformi(spine.Shader.SAMPLER, 0);
this._shader.setUniform4x4f(spine.Shader.MVP_MATRIX, this._mvp);
this._batcher.begin(this._shader);
return true;
},
// (内部) 读取 gameabc 绘制上下文的权威变换矩阵。
// getTransform() 自 iOS Safari 11 起支持，远低于本项目已验证的 WebView 基线；
// 取不到时退化为单位矩阵（此时叠加层按绘制缓冲画布 dc.canvas 的 backing 尺寸直接映射）。
_readTransform: function(ctx) {
if (typeof ctx.getTransform === "function") {
var t = ctx.getTransform();
return { a: t.a, b: t.b, c: t.c, d: t.d, e: t.e, f: t.f };
}
return { a: 1, b: 0, c: 0, d: 1, e: 0, f: 0 };
},
// (内部) 一次性诊断日志：同时记录两个几何来源的身份与数值，便于后续核对
// ——绘制缓冲画布(dc.canvas，NDC 分母)与显示画布(#canvas，叠加层定位/尺寸)
// 是否为同一个对象、各自的 backing 与显示画布的 rect。
_logCanvasIdentityOnce: function(drawCanvas, displayCanvas, displayRect) {
if (this._loggedCanvasIdentity) return;
this._loggedCanvasIdentity = true;
var drawIdDesc = drawCanvas.id ? ("#" + drawCanvas.id) : "(无 id)";
spineLog("[SpineBackendWebGL] 绘制缓冲画布(gameabc_face.dc.canvas) = " + drawIdDesc +
"，backing=" + drawCanvas.width + "x" + drawCanvas.height +
"；显示画布(#canvas) backing=" + displayCanvas.width + "x" + displayCanvas.height +
"，rect=(" + displayRect.left + "," + displayRect.top + "," + displayRect.width + "," + displayRect.height + ")" +
"，两者是否同一对象=" + (drawCanvas === displayCanvas));
},
// (内部) 每帧把叠加层的位置与尺寸镜像到显示画布(#canvas)的实际显示区域。
// drawing buffer 尺寸直接取显示画布的 backing(width/height)，不再用
// rect × devicePixelRatio 计算——与主画布有效分辨率一致即可，用 DPR 会开出
// 比主画布 backing 还大的 buffer，白白多占显存。
_syncSize: function(displayCanvas) {
var rect = displayCanvas.getBoundingClientRect();
if (rect.width <= 0 || rect.height <= 0) return false;
var host = this._canvas.parentNode;
host.style.left = rect.left + "px";
host.style.top = rect.top + "px";
this._canvas.style.width = rect.width + "px";
this._canvas.style.height = rect.height + "px";
var bw = displayCanvas.width;
var bh = displayCanvas.height;
if (bw <= 0 || bh <= 0) return false;
if (this._canvas.width !== bw || this._canvas.height !== bh) {
this._canvas.width = bw;
this._canvas.height = bh;
}
this._gl.viewport(0, 0, bw, bh);
return true;
},
drawEntry: function(entry) {
this._renderer.draw(this._batcher, entry.skeleton);
},
endFrame: function() {
this._batcher.end();
this._shader.unbind();
}
};
if (typeof module !== "undefined" && module.exports) {
module.exports = SpineBackendWebGL;
}
window.SpineBackendWebGL = SpineBackendWebGL;
})();
client/js/gameabc-framework/spine/SpineMgr.js
+233 -45
View File
@@ -5,12 +5,25 @@
// ============================================================
(function(){
// gameabc 的全局 logmessage 默认走 mode 0，是空操作（见 gameabc.min.js 的实现），
// 诊断日志必须直接走 console 才能在浏览器与真机 WebView 里看到。
function spineLog(msg) {
if (typeof console !== "undefined" && console.log) {
console.log(msg);
}
}
function spineWarn(msg) {
if (typeof console !== "undefined" && console.warn) {
console.warn(msg);
}
}
var SpineMgr = {
// --- 内部状态 ---
_entries: {}, // {id: EntryObject}
_assetManager: null,
_renderer: null, // spine.SkeletonRenderer (Canvas 2D)
_backend: null, // 渲染后端（SpineBackendWebGL / SpineBackendCanvas）
_lastTime: 0, // 上一帧时间戳(ms)
_inited: false,
_loadedPaths: {}, // 已请求加载的资源路径，避免重复请求
@@ -27,15 +40,50 @@ var SpineMgr = {
// ----------------------------------------------------------
init: function(basePath) {
if (!window.spine) {
logmessage("[SpineMgr] spine-canvas.js 未加载，请检查引用");
spineWarn("[SpineMgr] spine 运行时未加载，请检查 index.html 的探测脚本");
return;
}
this._backend = this._selectBackend();
if (!this._backend) {
spineWarn("[SpineMgr] 无可用渲染后端");
return;
}
spineLog("[SpineMgr] 渲染后端: " + this._backend.name);
this._basePath = basePath || this._basePath;
this._assetManager = new spine.AssetManager(this._basePath);
// 挂接 context lost 恢复回调（仅 WebGL 后端有此机制）
var self = this;
if (this._backend.name === "webgl") {
this._backend._onContextRestored = function() {
self._rebuildAfterContextRestored();
};
}
// 后端初始化失败必须显式记录并让 _inited 保持 false，但不能让异常向上抛：
// init 由文件末尾的预加载块经 _ensureInit() 调用，异常会中断整个 IIFE，
// 导致后面的 gameenddraw 拦截根本不安装 —— Spine 从此永不绘制且无迹可循。
// _inited 保持 false 时，各 API 走既有的 if (!this._inited) return 静默路径。
try {
this._assetManager = this._backend.createAssetManager(this._basePath);
} catch (err) {
spineWarn("[SpineMgr] 后端初始化失败: " + err.message);
this._backend = null;
return;
}
this._lastTime = Date.now();
this._inited = true;
},
// (内部) 选定渲染后端。index.html 的探测脚本已决定加载哪套 spine 运行时，
// 此处按运行时实际提供的能力对应上后端实现。
_selectBackend: function() {
if (window.SpineBackendWebGL && SpineBackendWebGL.isAvailable()) {
return SpineBackendWebGL;
}
if (window.SpineBackendCanvas && SpineBackendCanvas.isAvailable()) {
return SpineBackendCanvas;
}
return null;
},
// (内部) 确保已初始化
_ensureInit: function() {
if (!this._inited) {
@@ -43,6 +91,42 @@ var SpineMgr = {
}
},
// ----------------------------------------------------------
// (内部) _preloadAll()
// 按 gameabc_face.spineAssets 清单，把全部 Spine 资源注入当前 AssetManager 并发起加载。
// ⚠️ 必须整批注入，不能只补"当前已存在的 entry"：
// 规避 file:// 下 XHR CORS 用的 rawDataUris 是 Downloader 实例私有的
// （AssetManagerBase 构造时默认 new Downloader()），换一个新 AssetManager
// 就等于换了一份空 rawDataUris。若只补已存在的 entry，context 恢复之后
// 首次触发的新特效（如天胡）会走真实 XHR 被 CORS 拦掉，_tryBuild 里 require()
// 抛异常 → ready 恒 false → 每帧重试且永不显示。
// 返回本次注册的资源组数。
// ----------------------------------------------------------
_preloadAll: function() {
var list = gameabc_face.spineAssets;
if (!list || list.length === 0) return 0;
var textData = gameabc_face.spineTextData || {};
for (var i = 0; i < list.length; i++) {
var name = list[i];
var jsonKey = name + ".json";
var atlasKey = name + ".atlas";
// 将嵌入文本数据注册为 rawDataURI，Spine Downloader 会优先从内存读取
if (textData[jsonKey]) {
this._assetManager.setRawDataURI(jsonKey, "data:," + textData[jsonKey]);
}
if (textData[atlasKey]) {
this._assetManager.setRawDataURI(atlasKey, "data:," + textData[atlasKey]);
}
this._assetManager.loadText(jsonKey);
this._loadedPaths[jsonKey] = true;
this._assetManager.loadTextureAtlas(atlasKey);
this._loadedPaths[atlasKey] = true;
}
spineLog("[SpineMgr] 预加载 " + list.length + " 组 Spine 资源" +
(Object.keys(textData).length > 0 ? "（使用嵌入数据）" : "（使用网络请求）"));
return list.length;
},
// (内部) 自动加载：根据 id 约定文件名 id.json / id.atlas
// 主流 SkeletonJson.scale 方案：从 _scaleMap 读取目标缩放，传入 load() 在解析时烘焙
_autoLoad: function(id) {
@@ -101,16 +185,45 @@ var SpineMgr = {
visible: true,
ready: false,
_hideOnComplete: false, // 播放完成后是否自动隐藏
_hideAfterCompletes: 0 // 剩余多少次 complete 后触发隐藏
_hideAfterCompletes: 0, // 剩余多少次 complete 后触发隐藏
_buildFailLogged: false // 构建失败日志只记一次（_tryBuild 每帧调用）
};
},
// ----------------------------------------------------------
// ensureEntry(id, jsonFile, atlasFile, option)
// 确保 id 对应的 entry 存在并达到 option 指定的状态。
// entry 生命周期归 SpineMgr 管，调用方无需掌握"不在就 load、在就 setScale"的内部规则，
// 也无需从 id 推导文件名（entryId 与资源文件名不一定同名，如 ting_0 -> ting.json）。
// ----------------------------------------------------------
ensureEntry: function(id, jsonFile, atlasFile, option) {
var e = this._entries[id];
if (!e) {
this.load(id, jsonFile, atlasFile, option);
return;
}
if (option && option.scale !== undefined) {
this.setScale(id, option.scale);
}
},
// ----------------------------------------------------------
// isReady() 后端是否已就绪、能真正播放 Spine
// 探测阶段的 canvas 兜底只覆盖"WebGL 不可用"；若探测通过但 GL 初始化失败
// （叠加层 DOM 缺失 / 并发 context 耗尽 / shader 编译失败），此时 canvas 运行时
// 并未加载、回不去，调用方应据此走各自既有的帧动画降级路径，
// 而不是让 Spine 静默失效却以为播成功了。
// ----------------------------------------------------------
isReady: function() {
return !!this._inited;
},
// ----------------------------------------------------------
// (内部) 资源加载完成后实例化骨骼
// 同一 jsonFile+scale 的 SkeletonData 只解析一次，多个 entry 共享
// ----------------------------------------------------------
_buildEntry: function(entry) {
logmessage("[SpineMgr] _buildEntry: " + entry._id + " skelJson.scale=" + entry.scale);
spineLog("[SpineMgr] _buildEntry: " + entry._id + " skelJson.scale=" + entry.scale);
var cacheKey = entry.jsonFile + "_s" + entry.scale;
var skelData = this._skelDataCache[cacheKey];
if (!skelData) {
@@ -122,9 +235,9 @@ var SpineMgr = {
this._assetManager.require(entry.jsonFile)
);
this._skelDataCache[cacheKey] = skelData;
logmessage("[SpineMgr] SkeletonData 解析并缓存: " + cacheKey);
spineLog("[SpineMgr] SkeletonData 解析并缓存: " + cacheKey);
} else {
logmessage("[SpineMgr] SkeletonData 命中缓存: " + cacheKey);
spineLog("[SpineMgr] SkeletonData 命中缓存: " + cacheKey);
}
entry.skeleton = new spine.Skeleton(skelData);
@@ -179,10 +292,15 @@ var SpineMgr = {
e._id = id;
try {
this._buildEntry(e);
logmessage("[SpineMgr] " + id + " 构建完成");
spineLog("[SpineMgr] " + id + " 构建完成");
this._flushCmds(id);
} catch(err) {
logmessage("[SpineMgr] " + id + " 构建失败: " + err.message);
// 重试本身必须保留（资源可能只是还没到齐），但日志只记一次：
// 本方法每帧调用，持续失败时会以约 60 条/秒刷屏并淹没其他日志。
if (!e._buildFailLogged) {
e._buildFailLogged = true;
spineWarn("[SpineMgr] " + id + " 构建失败(仅记一次): " + err.message);
}
e.ready = false;
}
}
@@ -190,6 +308,79 @@ var SpineMgr = {
return true;
},
// ----------------------------------------------------------
// (内部) WebGL context 恢复后重建全部 GPU 资源
// context lost 会让 AssetManager 中缓存的 GLTexture 与 shader 一并作废，
// 必须重新加载资源并重建所有 entry，否则表现为"特效再也不显示"。
// ----------------------------------------------------------
_rebuildAfterContextRestored: function() {
spineLog("[SpineMgr] 重建 Spine 资源（context restored）");
// 记录当前 entry 的声明式状态，重建后按原样恢复
var saved = [];
for (var id in this._entries) {
var e = this._entries[id];
saved.push({
id: id,
jsonFile: e.jsonFile,
atlasFile: e.atlasFile,
x: e.x,
y: e.y,
scale: e.scale,
skin: e.skin,
mixDur: e.mixDur
});
}
// 丢弃全部缓存：SkeletonData 持有已作废的 GLTexture 引用，不能复用
this._entries = {};
this._pendingCmds = {};
this._skelDataCache = {};
this._loadedPaths = {};
// 先释放旧 AssetManager 再换新的：GLTexture 构造时会 context.addRestorable(this)，
// 只有 dispose() 才 removeRestorable。本后端刻意复用同一个 ManagedWebGLRenderingContext
// （见 SpineBackendWebGL._ensureGL 注释），若不释放，每恢复一次就把 23 页图集的
// GLTexture 永久留在 restorables 里（解码位图约 137MB）—— 而 context lost 的诱因
// 正是内存压力，泄漏会把 lost/restore 变成越恢复越糟的死循环。
// context 已丢失时 gl.deleteTexture 等按规范是 no-op，安全；仍加 try/catch 防御，
// 释放失败不能挡住后面的重建。
if (this._assetManager) {
try {
this._assetManager.dispose();
} catch (errDispose) {
spineWarn("[SpineMgr] 释放旧 AssetManager 失败(已忽略): " + errDispose.message);
}
this._assetManager = null;
}
// 本方法在 webglcontextrestored 事件回调中执行，异常会逸出到事件循环，
// 故与 init 同样显式捕获：重建失败就停在不可用状态并留下日志。
try {
this._assetManager = this._backend.createAssetManager(this._basePath);
} catch (err) {
spineWarn("[SpineMgr] context 恢复后重建 AssetManager 失败: " + err.message);
this._inited = false;
return;
}
// 整批重注入 rawDataURI 并重新发起加载：新 AssetManager = 新 Downloader = 空 rawDataUris，
// 只补 saved 里的资源会让恢复后首次触发的新特效在 file:// 下被 CORS 拦死（见 _preloadAll 注释）。
// _preloadAll 会把全部资源写进 _loadedPaths，故下面按 saved 重建 entry 时
// load() 的 if (!this._loadedPaths[...]) 判断会正确跳过重复请求。
this._preloadAll();
for (var i = 0; i < saved.length; i++) {
var s = saved[i];
this.load(s.id, s.jsonFile, s.atlasFile, {
x: s.x, y: s.y, scale: s.scale, skin: s.skin, mixDuration: s.mixDur
});
// 重建后默认不可见：正在播的动画已随 context 丢失，
// 强行续播会出现半截动画，交由下一次业务触发重新播放。
this._entries[s.id].visible = false;
}
},
// ----------------------------------------------------------
// updateAndDraw(ctx) 每帧自动调用
// ctx: gameabc_face.dc (Canvas 2D Context)
@@ -203,29 +394,33 @@ var SpineMgr = {
this._lastTime = now;
if (dt <= 0 || dt > 0.5) dt = 1/30;
if (!this._renderer) {
this._renderer = new spine.SkeletonRenderer(ctx);
this._renderer.triangleRendering = true; // ★ 启用三角形渲染以支持 Mesh 网格附件
}
// 确保 renderer 用的是当前 ctx (gameabc可能重建)
this._renderer.ctx = ctx;
// 先推进动画状态：即使本帧无法绘制（后端未就绪 / context lost），
// 动画时间轴与 complete 事件也必须照常推进，否则回调链会卡死。
var visibleList = [];
for (var id in this._entries) {
var e = this._entries[id];
if (!e.ready || !e.visible) continue;
e.state.update(dt);
e.state.apply(e.skeleton);
// 骨骼位置归零，由 ctx.translate 控制实际位置
e.skeleton.x = 0;
e.skeleton.y = 0;
// 骨骼位置由后端决定：Canvas 后端归零(用 ctx.translate 定位)，
// WebGL 后端写入 x/-y(位移并入骨骼，使所有 entry 共用同一 MVP)。
// 必须在 updateWorldTransform 之前设置，否则不生效于本帧。
this._backend.placeEntry(e);
e.skeleton.updateWorldTransform(spine.Physics.update);
visibleList.push(e);
}
ctx.save();
ctx.translate(e.x, e.y);
ctx.scale(1, -1); // ★ Spine Y-up → Canvas Y-down（scale 已烘焙进 SkeletonJson.scale）
this._renderer.draw(e.skeleton);
ctx.restore();
if (!this._backend.beginFrame(visibleList.length)) return;
// endFrame 必须配对执行：WebGL 后端的 PolygonBatcher 只在 endFrame 里 end()，
// 若 drawEntry 抛出而漏了 end()，batcher.isDrawing 会永久停在 true，
// 下一帧 begin() 即抛 "PolygonBatch is already drawing" 并冒到 gameenddraw —— Spine 永久黑屏。
try {
for (var i = 0; i < visibleList.length; i++) {
this._backend.drawEntry(visibleList[i]);
}
} finally {
this._backend.endFrame();
}
},
@@ -281,10 +476,13 @@ var SpineMgr = {
return;
}
if (e.scale === sx) return; // 已是目标 scale，无需重建
// 目标 scale 与已烘焙 scale 不同 → 清除旧 entry，下次 _autoLoad 将以新 scale 重建
// 目标 scale 与已烘焙 scale 不同 → 清除旧 entry 并以新 scale 重建。
// 文件名必须取自 entry（load 时记录的权威值）：entryId 与资源文件名不一定同名
// （如 entryId=ting_0 对应 ting.json），按 id 推导会去加载不存在的文件。
var savedX = e.x, savedY = e.y;
var savedJson = e.jsonFile, savedAtlas = e.atlasFile;
this.remove(id);
this.load(id, id + ".json", id + ".atlas", { scale: sx, x: savedX, y: savedY });
this.load(id, savedJson, savedAtlas, { scale: sx, x: savedX, y: savedY });
},
setFlip: function(id, flipX, flipY) {
@@ -423,26 +621,16 @@ gameabc_face.spineMgr = SpineMgr;
// 彻底避免 file:// 协议下 XHR CORS 拦截问题
if (gameabc_face.spineAssets && gameabc_face.spineAssets.length > 0) {
SpineMgr._ensureInit();
var list = gameabc_face.spineAssets;
var textData = gameabc_face.spineTextData || {};
for (var i = 0; i < list.length; i++) {
var name = list[i];
var jsonKey = name + ".json";
var atlasKey = name + ".atlas";
// 将嵌入文本数据注册为 rawDataURI，Spine Downloader 会优先从内存读取
if (textData[jsonKey]) {
SpineMgr._assetManager.setRawDataURI(jsonKey, "data:," + textData[jsonKey]);
}
if (textData[atlasKey]) {
SpineMgr._assetManager.setRawDataURI(atlasKey, "data:," + textData[atlasKey]);
}
SpineMgr._assetManager.loadText(jsonKey);
SpineMgr._loadedPaths[jsonKey] = true;
SpineMgr._assetManager.loadTextureAtlas(atlasKey);
SpineMgr._loadedPaths[atlasKey] = true;
if (!SpineMgr._inited) {
// 后端未就绪：跳过预加载，但必须继续往下走完 gameenddraw 拦截的安装。
// 此处不能 return —— 预加载块在 IIFE 函数体内，return 会退出整个 IIFE，
// 反而导致拦截装不上，正是本守卫要避免的后果。
// 回归锁：codes/test/node/spineMgr.gameEndDrawGuard.test.js
spineWarn("[SpineMgr] 后端未就绪，跳过 Spine 资源预加载");
} else {
// 与 context 恢复后的重注入共用同一份实现，避免两处清单分叉
SpineMgr._preloadAll();
}
logmessage("[SpineMgr] 预加载 " + list.length + " 组 Spine 资源" +
(Object.keys(textData).length > 0 ? "（使用嵌入数据）" : "（使用网络请求）"));
}
// ★ 用 defineProperty 拦截 gameenddraw 赋值
client/js/gameabc-framework/spine/SpineOverlayTransform.js
+88
View File
@@ -0,0 +1,88 @@
// ============================================================
// SpineOverlayTransform —— WebGL 叠加层坐标标定（纯函数）
//
// 职责：把 gameabc 主画布的权威变换矩阵换算成 WebGL 的 MVP 矩阵。
// 无副作用、无 DOM 依赖，可独立单测。
//
// 为什么不逆向 gameabc.min.js：那是混淆代码（变量名全打乱），读不出它内部如何
// 映射坐标。而 Spine 绘制发生在 gameenddraw（gameabc 绘制流程末尾），此刻 ctx
// 上已带着 gameabc 设好的全局变换 —— 直接向 ctx 要矩阵即可，权威、且 gameabc
// 后续改缩放/响应旋转时自动跟随。
//
// ⚠️ 真机实测确认：Spine 实际画在 gameabc_face.dc.canvas 这张离屏画布上
// （backing 约 1280x720，不在 DOM），gameabc 再把它 blit 到 DOM 中可见的显示
// 画布 #canvas（backing 约 1912x880），最后经 CSS 缩放到屏幕。本函数的
// canvasW/canvasH 必须传绘制缓冲画布（dc.canvas）的 backing 尺寸，因为
// Spine 坐标正是喂给这张画布的，分母须与其同源；叠加层自身的定位/CSS 尺寸/
// drawing buffer 则是另一个来源（显示画布 #canvas），由调用方
// SpineBackendWebGL 负责，不在本函数职责内。
//
// 推导（Spine 世界坐标 Y-up，画布 Y-down）：
// 位移由调用方经 skeleton.x = e.x; skeleton.y = -e.y 承担，本矩阵只处理
// scale(1,-1) 与投影，等价于 Canvas 后端的 ctx.translate(e.x,e.y)+ctx.scale(1,-1)。
//
// 1) Spine 世界 → 逻辑坐标： Lx = vx, Ly = -vy
// 2) 逻辑 → 画布像素： Px = a*Lx + c*Ly + e, Py = b*Lx + d*Ly + f
// 3) 画布像素 → NDC： x = 2*Px/W - 1, y = 1 - 2*Py/H
//
// 合并：
// x_ndc = (2a/W)*vx + (-2c/W)*vy + (2e/W - 1)
// y_ndc = (-2b/H)*vx + ( 2d/H)*vy + (1 - 2f/H)
//
// 注意：叠加层 drawing buffer 尺寸在推导中被约掉（gl.viewport 覆盖整个 buffer，
// NDC 自动铺满），故本矩阵只依赖 ctx 变换与绘制缓冲画布 backing 尺寸。因此所有
// entry 共用同一个 MVP，可一次 batcher.begin/end 批量绘制。
// ============================================================
(function(){
var SpineOverlayTransform = {
// ----------------------------------------------------------
// buildMvp(m, canvasW, canvasH, out)
// m : {a,b,c,d,e,f} —— ctx.getTransform() 的六元素
// canvasW : 绘制缓冲画布(gameabc_face.dc.canvas)的 backing 宽（实测约 1280）
// canvasH : 绘制缓冲画布(gameabc_face.dc.canvas)的 backing 高（实测约 720）
// out : 可选，长度 16 的复用数组（避免每帧分配）
// 返回列主序 4x4 矩阵
// ----------------------------------------------------------
buildMvp: function(m, canvasW, canvasH, out) {
var r = out || new Array(16);
var sx = 2 / canvasW;
var sy = 2 / canvasH;
// 第 0 列：vx 的系数
r[0] = sx * m.a;
r[1] = -sy * m.b;
r[2] = 0;
r[3] = 0;
// 第 1 列：vy 的系数
r[4] = -sx * m.c;
r[5] = sy * m.d;
r[6] = 0;
r[7] = 0;
// 第 2 列：z 保持
r[8] = 0;
r[9] = 0;
r[10] = 1;
r[11] = 0;
// 第 3 列：平移
r[12] = sx * m.e - 1;
r[13] = 1 - sy * m.f;
r[14] = 0;
r[15] = 1;
return r;
}
};
if (typeof module !== "undefined" && module.exports) {
module.exports = SpineOverlayTransform;
}
// 友乐运行时有 module 无 require 且共享全局作用域，须无条件暴露全局名
window.SpineOverlayTransform = SpineOverlayTransform;
})();
client/js/gameabc-framework/system/AnimationManager.js
+1 -1
View File
@@ -810,7 +810,7 @@ var AnimationManager = AnimationManager || {};
}
_initialized = true;
console.log('[AnimationManager] Initialized (v2.0.0 optimized)');
// console.log('[AnimationManager] Initialized (v2.0.0 optimized)');
};
/**
client/js/gameabc-framework/system/AudioManager.js
+1 -1
View File
@@ -164,7 +164,7 @@ var AudioManager = AudioManager || {};
return;
}
_initialized = true;
console.log('[AudioManager] Initialized (v4.0.0)');
// console.log('[AudioManager] Initialized (v4.0.0)');
};
// ============================================================================
client/js/gameabc-framework/system/EventBus.js
+6 -6
View File
@@ -80,7 +80,7 @@ var EventBus = {
};
this._listeners[eventName].push(listener);
console.log('✅ EventBus: 订阅事件', eventName);
// console.log('✅ EventBus: 订阅事件', eventName);
// 返回取消订阅函数
var self = this;
@@ -121,7 +121,7 @@ var EventBus = {
// 如果没有指定callback,取消该事件的所有监听器
if (!callback) {
delete this._listeners[eventName];
console.log('✅ EventBus: 取消所有', eventName, '监听器');
// console.log('✅ EventBus: 取消所有', eventName, '监听器');
return true;
}
@@ -130,7 +130,7 @@ var EventBus = {
for (var i = listeners.length - 1; i >= 0; i--) {
if (listeners[i].callback === callback) {
listeners.splice(i, 1);
console.log('✅ EventBus: 取消', eventName, '监听器');
// console.log('✅ EventBus: 取消', eventName, '监听器');
return true;
}
}
@@ -152,7 +152,7 @@ var EventBus = {
var listeners = this._listeners[eventName].slice(); // 复制数组,避免迭代中修改
var count = 0;
console.log('📡 EventBus: 触发事件', eventName, data);
// console.log('📡 EventBus: 触发事件', eventName, data);
for (var i = 0; i < listeners.length; i++) {
try {
@@ -204,7 +204,7 @@ var EventBus = {
*/
clear: function() {
this._listeners = {};
console.log('✅ EventBus: 已清空所有监听器');
// console.log('✅ EventBus: 已清空所有监听器');
},
/**
@@ -214,7 +214,7 @@ var EventBus = {
clearEvent: function(eventName) {
if (this._listeners[eventName]) {
delete this._listeners[eventName];
console.log('✅ EventBus: 已清空', eventName, '的所有监听器');
// console.log('✅ EventBus: 已清空', eventName, '的所有监听器');
}
}
};
client/js/gameabc-framework/templates/UIBootstrap.template.js
+2 -2
View File
@@ -79,7 +79,7 @@ UIBootstrap.init = function () {
return true;
}
console.log('[UIBootstrap] 开始初始化 UI 系统...');
// console.log('[UIBootstrap] 开始初始化 UI 系统...');
try {
if (!this._checkDependencies()) { return false; }
@@ -102,7 +102,7 @@ UIBootstrap.init = function () {
this._registerViews();
this.initialized = true;
console.log('[UIBootstrap] UI 系统初始化完成，共', Object.keys(this.views).length, '个组件');
// console.log('[UIBootstrap] UI 系统初始化完成，共', Object.keys(this.views).length, '个组件');
return true;
} catch (err) {
console.error('[UIBootstrap] 初始化失败:', err);
client/js/gameabc-framework/templates/subgame-entry/SubGameHooks.template.js
+15 -2
View File
@@ -1,7 +1,7 @@
// ============================================================================
// SubGameHooks.template.js —— 子游戏接入入口（复制为 codes/SubGameHooks.js 后填实现）
// 平台契约文件(00/01/02 转发壳)会把同名平台接口转发到这里。只需实现【本游戏需要的】hook，
// 未实现的接口由转发壳走平台默认(B)或空操作(A)。严格 ES5。
// 未实现的接口由转发壳走空操作(A)/平台默认返回值(B)/模板默认 UI 渲染(D)。严格 ES5。
// 接口清单与默认值见 spec §9 / 文档 06。
// ============================================================================
@@ -199,8 +199,21 @@ var SubGameHooks = window.SubGameHooks || {};
// [B] getMaxPlayerCount(roomtype)：获取房间最大玩家数量；无 hook 时默认：return Game_Config.Max.PlayerCnt || 4。
// SubGameHooks.getMaxPlayerCount = function (roomtype) { /* ... */ };
// [B] updatePlayerInfoUI(targetSeat)：更新玩家信息 UI；无 hook 时默认：return false（让平台默认处理）。
// [D] updatePlayerInfoUI(targetSeat)：更新指定座位玩家信息 UI；无 hook 时模板提供【可变人数】默认渲染
// （头像/昵称/分数随人数 2/3/4 贴合各玩家，布局见 01 的 Game_Modify.PLAYER_INFO_LAYOUT）。子游戏可用 hook 完全接管。
// SubGameHooks.updatePlayerInfoUI = function (targetSeat) { /* ... */ };
// ===== Game_Modify.*（桌面聊天/语音气泡，3） =====
// 以下接口无 hook 时，模板提供【可变人数】默认渲染（气泡随人数贴合各玩家，布局见 01 的 Game_Modify.BUBBLE_LAYOUT）。
// [D] ShowChat(seat, text)：显示桌面文字聊天气泡（seat 为绝对座位）。
// SubGameHooks.ShowChat = function (seat, text) { /* ... */ };
// [D] gameui_play_voice(uiIndex)：播放桌面语音气泡（uiIndex 为相对显示位序）。
// SubGameHooks.gameui_play_voice = function (uiIndex) { /* ... */ };
// [D] gameui_stop_voice(uiIndex)：停止桌面语音气泡。
// SubGameHooks.gameui_stop_voice = function (uiIndex) { /* ... */ };
window.SubGameHooks = SubGameHooks;
if (typeof module !== 'undefined' && module.exports) { module.exports = SubGameHooks; }
client/js/gameabc-framework/ui/BaseComponent.js
+14 -14
View File
@@ -241,7 +241,7 @@ var BaseComponent = (function() {
this.isDestroyed = false;
this.isInitialized = true;
console.log('🎨 BaseComponent: 初始化组件 "' + this.name + '" (图层: ' + this.layer + ')');
// // console.log('🎨 BaseComponent: 初始化组件 "' + this.name + '" (图层: ' + this.layer + ')');
// 调用子类的init方法
try {
@@ -274,7 +274,7 @@ var BaseComponent = (function() {
return;
}
console.log('🙈 BaseComponent: 隐藏组件 "' + this.name + '" 的所有精灵 (数量: ' + this.sprites.length + ')');
// console.log('🙈 BaseComponent: 隐藏组件 "' + this.name + '" 的所有精灵 (数量: ' + this.sprites.length + ')');
for (var i = 0; i < this.sprites.length; i++) {
var spriteId = this.sprites[i];
@@ -293,7 +293,7 @@ var BaseComponent = (function() {
*/
init: function(config) {
// 子类覆盖此方法
console.log('📝 BaseComponent.init: 请在子类中覆盖此方法');
// console.log('📝 BaseComponent.init: 请在子类中覆盖此方法');
},
/**
@@ -312,11 +312,11 @@ var BaseComponent = (function() {
}
if (this.isVisible) {
console.log('ℹ️ BaseComponent.show: 组件已可见，跳过:', this.name);
// console.log('ℹ️ BaseComponent.show: 组件已可见，跳过:', this.name);
return true;
}
console.log('👁️ BaseComponent: 显示组件 "' + this.name + '" (图层: ' + this.layer + ')');
// console.log('👁️ BaseComponent: 显示组件 "' + this.name + '" (图层: ' + this.layer + ')');
// 显示图层
SpriteManager.showGroup(this.layer);
@@ -344,11 +344,11 @@ var BaseComponent = (function() {
}
if (!this.isVisible) {
console.log('ℹ️ BaseComponent.hide: 组件已隐藏，跳过:', this.name);
// console.log('ℹ️ BaseComponent.hide: 组件已隐藏，跳过:', this.name);
return true;
}
console.log('🙈 BaseComponent: 隐藏组件 "' + this.name + '" (图层: ' + this.layer + ')');
// console.log('🙈 BaseComponent: 隐藏组件 "' + this.name + '" (图层: ' + this.layer + ')');
// 隐藏图层
SpriteManager.hideGroup(this.layer);
@@ -375,7 +375,7 @@ var BaseComponent = (function() {
return false;
}
console.log('💥 BaseComponent: 销毁组件 "' + this.name + '"');
// console.log('💥 BaseComponent: 销毁组件 "' + this.name + '"');
// 移除所有事件监听
this._removeAllEventListeners();
@@ -447,7 +447,7 @@ var BaseComponent = (function() {
// 记录监听器
this.eventListeners[eventName] = wrappedHandler;
console.log('📡 BaseComponent: 组件 "' + this.name + '" 注册事件:', eventName);
// console.log('📡 BaseComponent: 组件 "' + this.name + '" 注册事件:', eventName);
return true;
},
@@ -467,7 +467,7 @@ var BaseComponent = (function() {
EventBus.off(eventName, handler);
delete this.eventListeners[eventName];
console.log('📴 BaseComponent: 组件 "' + this.name + '" 移除事件:', eventName);
// console.log('📴 BaseComponent: 组件 "' + this.name + '" 移除事件:', eventName);
return true;
},
@@ -483,7 +483,7 @@ var BaseComponent = (function() {
return;
}
console.log('📤 BaseComponent: 组件 "' + this.name + '" 触发事件:', eventName);
// console.log('📤 BaseComponent: 组件 "' + this.name + '" 触发事件:', eventName);
EventBus.emit(eventName, data);
},
@@ -511,7 +511,7 @@ var BaseComponent = (function() {
}
this.sprites.push(spriteId);
// console.log('➕ BaseComponent: 组件 "' + this.name + '" 添加精灵:', spriteId);
// // console.log('➕ BaseComponent: 组件 "' + this.name + '" 添加精灵:', spriteId);
return true;
},
@@ -529,7 +529,7 @@ var BaseComponent = (function() {
}
this.sprites.splice(index, 1);
console.log('➖ BaseComponent: 组件 "' + this.name + '" 移除精灵:', spriteId);
// console.log('➖ BaseComponent: 组件 "' + this.name + '" 移除精灵:', spriteId);
return true;
},
@@ -596,7 +596,7 @@ var BaseComponent = (function() {
*/
printState: function() {
var state = this.getState();
console.log('📊 组件状态:', JSON.stringify(state, null, 2));
// console.log('📊 组件状态:', JSON.stringify(state, null, 2));
}
};
client/js/gameabc-framework/ui/DynamicSpriteList.js
+159 -81
View File
@@ -84,7 +84,21 @@
* scrollSensitivity: 5, // 移动5px以上才触发滚动
* bounceSpeed: 1 // 回弹速度
* });
*
*
* 【横向列表（左右滑动）】
* var themeList = new DynamicSpriteList({
* containerId: sprites.LIST_CONTAINER,
* clipArea: { x: 340, y: 240, width: 600, height: 160 },
* orientation: 'horizontal', // 默认 'vertical'
* itemWidth: 262, // 主轴步长（项宽 + 项间距），与纵向 rowHeight 对称
* renderRow: function (ctx) {
* // 横向下 ctx.addSprite 的 x 会叠加该项的主轴基准，y 原样
* var sid = ctx.addSprite('preview', TPL_ID, 0, 0);
* }
* });
* // 事件转发：横向传 offmovex（纵向传 offmovey）
* themeList.handleMouseMove(event.spriteId, event.offset.x);
*
* 【设置数据（触发渲染）】
* // 数据数组中每个元素对应一行
* // setData 会清除旧行、重新创建新行
@@ -176,6 +190,26 @@
* }
* }
*/
/**
* 主轴/交叉轴的引擎操作码与 clipArea 字段映射
* 前缀 DSL_ 是必要的：友乐运行时所有 <script> 共享同一全局作用域，
* 通用名（如 LIST_AXIS）会与其它文件互相覆盖。
* 操作码：18=左右移动 19=上下移动 20=设宽 21=设高
* （docs/important/client/精灵操作详细指南.md:38-41）
*/
var DSL_LIST_AXIS = {
vertical: {
posOp: 19, sizeOp: 21, crossPosOp: 18, crossSizeOp: 20,
clipPos: 'y', clipSize: 'height', crossClipPos: 'x', crossClipSize: 'width',
stepField: 'rowHeight'
},
horizontal: {
posOp: 18, sizeOp: 20, crossPosOp: 19, crossSizeOp: 21,
clipPos: 'x', clipSize: 'width', crossClipPos: 'y', crossClipSize: 'height',
stepField: 'itemWidth'
}
};
function DynamicSpriteList(config) {
// ========================================================================
// 参数验证
@@ -189,8 +223,11 @@ function DynamicSpriteList(config) {
if (!config.clipArea) {
throw new Error('DynamicSpriteList: clipArea is required');
}
if (typeof config.rowHeight !== 'number' || config.rowHeight <= 0) {
throw new Error('DynamicSpriteList: rowHeight must be a positive number');
var orientation = (config.orientation === 'horizontal') ? 'horizontal' : 'vertical';
var axis = DSL_LIST_AXIS[orientation];
var step = config[axis.stepField];
if (typeof step !== 'number' || step <= 0) {
throw new Error('DynamicSpriteList: ' + axis.stepField + ' must be a positive number');
}
var hasTemplates = config.templates && typeof config.templates === 'object';
var hasRenderRow = typeof config.renderRow === 'function';
@@ -220,11 +257,31 @@ function DynamicSpriteList(config) {
};
/**
* 每行高度
* 排列方向：'vertical'(默认) | 'horizontal'
* @type {string}
*/
this.orientation = orientation;
/**
* 轴映射（操作码 + clipArea 取用字段），内部所有方向相关操作一律经此表
* @type {Object}
* @private
*/
this._axis = axis;
/**
* 主轴步长：纵向=行高(rowHeight)，横向=项宽含间距(itemWidth)
* @type {number}
* @private
*/
this._step = step;
/**
* 每行高度（纵向语义保留字段；横向下等于主轴步长）
* @type {number}
*/
this.rowHeight = config.rowHeight;
this.rowHeight = step;
/**
* 模板精灵配置
* @type {Object}
@@ -431,31 +488,31 @@ DynamicSpriteList.prototype.destroy = function() {
/**
* 滚动到指定位置
*
* @param {number} y - 目标Y坐标
* @param {number} offset - 目标主轴偏移量（纵向=Y方向，横向=X方向）
* @param {boolean} [animated=true] - 是否使用动画
* @returns {DynamicSpriteList} 返回自身，支持链式调用
*/
DynamicSpriteList.prototype.scrollTo = function(y, animated) {
var currentY = get_self(this.containerId, 19, 0, 0, 0);
var targetY = this.clipArea.y - y;
// 边界限制
var contentHeight = this._data.length * this.rowHeight;
var minY = this.clipArea.y + this.clipArea.height - contentHeight;
if (targetY < minY) {
targetY = minY;
}
if (targetY > this.clipArea.y) {
targetY = this.clipArea.y;
}
DynamicSpriteList.prototype.scrollTo = function(offset, animated) {
var axis = this._axis;
var clipStart = this.clipArea[axis.clipPos];
var clipSize = this.clipArea[axis.clipSize];
var current = get_self(this.containerId, axis.posOp, 0, 0, 0);
var target = clipStart - offset;
// 边界钳制（双向）：先钳末端，再钳起点。
// 内容不足一屏时 min > clipStart，两条钳制叠加后恒为起点——这正是期望行为。
var contentSize = this._data.length * this._step;
var min = clipStart + clipSize - contentSize;
if (target < min) { target = min; }
if (target > clipStart) { target = clipStart; }
if (animated !== false) {
play_ani(1, this.containerId, 19, currentY, targetY, 0,
Math.abs(targetY - currentY), 0, 0, 0, this.bounceSpeed, 0, 0, 0);
play_ani(1, this.containerId, axis.posOp, current, target, 0,
Math.abs(target - current), 0, 0, 0, this.bounceSpeed, 0, 0, 0);
} else {
set_self(this.containerId, 19, targetY, 0, 0, 0);
set_self(this.containerId, axis.posOp, target, 0, 0, 0);
}
return this;
};
@@ -476,8 +533,8 @@ DynamicSpriteList.prototype.scrollToTop = function(animated) {
* @returns {DynamicSpriteList} 返回自身，支持链式调用
*/
DynamicSpriteList.prototype.scrollToBottom = function(animated) {
var contentHeight = this._data.length * this.rowHeight;
var maxScroll = contentHeight - this.clipArea.height;
var contentSize = this._data.length * this._step;
var maxScroll = contentSize - this.clipArea[this._axis.clipSize];
if (maxScroll < 0) {
maxScroll = 0;
}
@@ -492,7 +549,7 @@ DynamicSpriteList.prototype.scrollToBottom = function(animated) {
* @returns {DynamicSpriteList} 返回自身，支持链式调用
*/
DynamicSpriteList.prototype.scrollToRow = function(rowIndex, animated) {
var y = rowIndex * this.rowHeight;
var y = rowIndex * this._step;
return this.scrollTo(y, animated);
};
@@ -531,36 +588,35 @@ DynamicSpriteList.prototype.handleMouseDown = function(spid, x, y) {
* 需要在 utlmousemove 回调中调用
*
* @param {number} spid - 移动的精灵ID
* @param {number} offsetY - Y方向移动偏移量
* @param {number} offsetMain - 主轴方向移动偏移量（纵向传 Y 方向偏移，横向传 X 方向偏移）
* @returns {boolean} 如果事件被处理返回 true
*
*
* @example
* // 在 SpriteEventController 或 Game_Modify 中
* // 在 SpriteEventController 或 Game_Modify 中（纵向列表传 offmovey，横向列表传 offmovex）
* utlmousemove: function(gameid, spid, downx, downy, movex, movey, timelong, offmovex, offmovey) {
* if (myList.handleMouseMove(spid, offmovey)) {
* if (myList.handleMouseMove(spid, offmovey)) { // 横向列表改传 offmovex
* return; // 事件已处理
* }
* // 其他处理...
* }
*/
DynamicSpriteList.prototype.handleMouseMove = function(spid, offsetY) {
DynamicSpriteList.prototype.handleMouseMove = function(spid, offsetMain) {
if (!this.enableScroll) {
return false;
}
if (spid === this.containerId) {
if (Math.abs(offsetY) > this.scrollSensitivity) {
// 增量移动容器
set_self(this.containerId, 19, offsetY, 1, 0, 0);
if (Math.abs(offsetMain) > this.scrollSensitivity) {
var axis = this._axis;
// 增量移动容器（第4参 1 = 相对增量）
set_self(this.containerId, axis.posOp, offsetMain, 1, 0, 0);
this._isSliding = true;
// 触发滚动回调
if (typeof this.onScroll === 'function') {
var currentY = get_self(this.containerId, 19, 0, 0, 0);
var scrollY = this.clipArea.y - currentY;
var contentHeight = this._data.length * this.rowHeight;
var maxScrollY = contentHeight - this.clipArea.height;
this.onScroll(scrollY, maxScrollY > 0 ? maxScrollY : 0);
var current = get_self(this.containerId, axis.posOp, 0, 0, 0);
var scrolled = this.clipArea[axis.clipPos] - current;
var maxScroll = this._data.length * this._step - this.clipArea[axis.clipSize];
this.onScroll(scrolled, maxScroll > 0 ? maxScroll : 0);
}
}
return true;
@@ -661,29 +717,30 @@ DynamicSpriteList.prototype._addSpriteInternal = function (name, templateSpriteI
* @private
*/
DynamicSpriteList.prototype._render = function() {
set_self(this.containerId, 18, this.clipArea.x, 0, 0);
set_self(this.containerId, 19, this.clipArea.y, 0, 0);
var contentHeight = this._data.length * this.rowHeight;
set_self(this.containerId, 21, contentHeight, 0, 0);
var axis = this._axis;
set_self(this.containerId, axis.posOp, this.clipArea[axis.clipPos], 0, 0);
set_self(this.containerId, axis.crossPosOp, this.clipArea[axis.crossClipPos], 0, 0);
var contentSize = this._data.length * this._step;
set_self(this.containerId, axis.sizeOp, contentSize, 0, 0);
if (this.templates) {
var tnames = Object.keys(this.templates);
if (tnames.length > 0) {
var w = get_self(this.templates[tnames[0]].spriteId, 20, 0, 0, 0);
set_self(this.containerId, 20, w, 0, 0);
// 交叉轴尺寸取首个模板的对应尺寸（纵向=宽 op20，横向=高 op21）
var crossFromTpl = get_self(this.templates[tnames[0]].spriteId, axis.crossSizeOp, 0, 0, 0);
set_self(this.containerId, axis.crossSizeOp, crossFromTpl, 0, 0);
}
} else {
// renderRow 模式：容器宽度取裁剪区宽，保证整行可视宽都在容器 hit 区（点击/拖动检测）内。
// 否则容器保持编辑器预置窄宽度，超出部分点击/拖动报的 spid≠containerId 而失效（对账 bak set_self(fSpid,20,bg宽)）。
set_self(this.containerId, 20, this.clipArea.width, 0, 0);
// renderRow 模式：交叉轴尺寸取裁剪区对应边，保证整个可视区都在容器 hit 区（点击/拖动检测）内
set_self(this.containerId, axis.crossSizeOp, this.clipArea[axis.crossClipSize], 0, 0);
}
for (var rowIndex = 0; rowIndex < this._data.length; rowIndex++) {
var rowData = this._data[rowIndex];
var rowY = rowIndex * this.rowHeight;
var rowBase = rowIndex * this._step;
if (this.renderRow) {
this.renderRow(this._makeRowContext(rowIndex, rowData, rowY));
this.renderRow(this._makeRowContext(rowIndex, rowData, rowBase));
} else {
var names = Object.keys(this.templates);
for (var i = 0; i < names.length; i++) {
@@ -691,7 +748,9 @@ DynamicSpriteList.prototype._render = function() {
var t = this.templates[name];
var ox = (t.offset && t.offset.x) || 0;
var oy = (t.offset && t.offset.y) || 0;
var sid = this._addSpriteInternal(name, t.spriteId, ox, rowY + oy, rowIndex, t.clickable !== false);
var px = (this.orientation === 'horizontal') ? (rowBase + ox) : ox;
var py = (this.orientation === 'horizontal') ? oy : (rowBase + oy);
var sid = this._addSpriteInternal(name, t.spriteId, px, py, rowIndex, t.clickable !== false);
if (t.textProperty && rowData[t.textProperty] !== undefined) {
set_self(sid, 7, rowData[t.textProperty], 0, 0);
}
@@ -708,19 +767,27 @@ DynamicSpriteList.prototype._render = function() {
* 创建行上下文对象（传给 renderRow 回调）
* @param {number} rowIndex - 行索引
* @param {Object} rowData - 行数据
* @param {number} rowBaseY - 行基准 Y 坐标
* @param {number} rowBase - 行基准坐标（纵向=Y，横向=X）
* @returns {Object} 行上下文
* @private
*/
DynamicSpriteList.prototype._makeRowContext = function (rowIndex, rowData, rowBaseY) {
DynamicSpriteList.prototype._makeRowContext = function (rowIndex, rowData, rowBase) {
var self = this;
var isH = (this.orientation === 'horizontal');
return {
rowIndex: rowIndex,
rowData: rowData,
rowBaseY: rowBaseY,
rowBase: rowBase,
// 保留 rowBaseY：renderRow 回调的既有字段协议，不得破坏。
// 当前生产消费方为 RecordView.js（唯一使用本组件的调用方）；
// 回归测试 DynamicSpriteList.test.js 对该字段有硬断言。
rowBaseY: rowBase,
orientation: this.orientation,
containerId: this.containerId,
addSprite: function (name, templateSpriteId, x, y) {
return self._addSpriteInternal(name, templateSpriteId, x, rowBaseY + y, rowIndex, true);
var px = isH ? (rowBase + x) : x;
var py = isH ? y : (rowBase + y);
return self._addSpriteInternal(name, templateSpriteId, px, py, rowIndex, true);
}
};
};
@@ -730,38 +797,39 @@ DynamicSpriteList.prototype._makeRowContext = function (rowIndex, rowData, rowBa
* @private
*/
DynamicSpriteList.prototype._handleBounce = function() {
var currentY = get_self(this.containerId, 19, 0, 0, 0);
var contentHeight = get_self(this.containerId, 21, 0, 0, 0);
var clipY = this.clipArea.y;
var clipH = this.clipArea.height;
var targetY = currentY;
var axis = this._axis;
var current = get_self(this.containerId, axis.posOp, 0, 0, 0);
var contentSize = get_self(this.containerId, axis.sizeOp, 0, 0, 0);
var clipStart = this.clipArea[axis.clipPos];
var clipSize = this.clipArea[axis.clipSize];
var target = current;
var needBounce = false;
if (contentHeight <= clipH) {
// 内容不足一屏，回弹到顶部
if (currentY !== clipY) {
targetY = clipY;
if (contentSize <= clipSize) {
// 内容不足一屏，回弹到起点
if (current !== clipStart) {
target = clipStart;
needBounce = true;
}
} else {
if (currentY > clipY) {
// 超出顶部
targetY = clipY;
if (current > clipStart) {
// 越过起点
target = clipStart;
needBounce = true;
} else {
var minY = clipY + clipH - contentHeight;
if (currentY < minY) {
// 超出底部
targetY = minY;
var min = clipStart + clipSize - contentSize;
if (current < min) {
// 越过末端
target = min;
needBounce = true;
}
}
}
if (needBounce) {
play_ani(1, this.containerId, 19, currentY, targetY, 0,
Math.abs(targetY - currentY), 0, 0, 0, this.bounceSpeed, 0, 0, 0);
play_ani(1, this.containerId, axis.posOp, current, target, 0,
Math.abs(target - current), 0, 0, 0, this.bounceSpeed, 0, 0, 0);
}
};
@@ -772,6 +840,16 @@ DynamicSpriteList.prototype._handleBounce = function() {
* @private
*/
DynamicSpriteList.prototype._handleClick = function(x, y) {
// 裁剪区外的点击一律不算数。
// 原因：引擎的 set_clip 只裁【绘制】、不裁【命中】，而 _render 会把容器的主轴尺寸
// 撑到内容全长（远超可视区）。于是滑出可视区、屏幕上已经看不见的那些项，其矩形
// 仍在容器内，ifast_check_add 照样判为命中 —— 用户点到列表旁的空白带，却选中了
// 一个根本看不见的项。这里按 clipArea 兜住，横纵通用。
var a = this.clipArea;
if (x < a.x || x >= a.x + a.width || y < a.y || y >= a.y + a.height) {
return;
}
var clickedTag = ifast_check_add(this.containerId, x, y);
if (clickedTag === -99999999) { return; }
var rec = this._tagIndex[clickedTag];
client/js/gameabc-framework/ui/RecordView.js
+18 -3
View File
@@ -63,6 +63,10 @@ var RecordView = {
if (typeof gradeinfo[i].gameinfo1 === 'string') {
gradeinfo[i].gameinfo1 = JSON.parse(gradeinfo[i].gameinfo1);
}
// roomtype 归一：平台战绩记录里 roomtype 可能被多做了一层 JSON 序列化，
// 形如 '"11221000100003"'。下游权威 RoomConfigUtils.parse 严格要求 14 位裸字符串
// （故意不做多格式兼容），故在此收包边界剥掉多余的 JSON 引号层。
gradeinfo[i].roomtype = this._normalizeRoomtype(gradeinfo[i].roomtype);
if (i === 0) { this._gradeIdx1 = gradeinfo[i].idx; }
if (i === gradeinfo.length - 1) { this._gradeIdx2 = gradeinfo[i].idx; }
}
@@ -70,6 +74,17 @@ var RecordView = {
this.open();
},
// 剥掉 roomtype 上多余的 JSON 序列化层：'"11221000100003"' → '11221000100003'。
// 多层引号（极端情况）循环剥；非字符串或无引号原样返回；JSON.parse 失败即停止不吞坏值。
_normalizeRoomtype: function (rt) {
var v = rt, guard = 0;
while (typeof v === 'string' && v.length >= 2 && v.charAt(0) === '"' && guard < 5) {
try { v = JSON.parse(v); } catch (e) { break; }
guard++;
}
return v;
},
// 翻页/类型 → 发获取战绩请求（平台通用协议）。类型切换 _requestGrade(type,null)；翻页 _requestGrade(_,direction)。
_requestGrade: function (arg1, direction) {
var data = { agentid: GameData.AgentId, playerid: C_Player.playerid, gameid: GameData.GameId };
@@ -77,9 +92,9 @@ var RecordView = {
this._type = arg1; // 类型切换
data.type = arg1;
} else {
data.type = this._type; // 翻页：type 用当前，direction + gradeidx
data.type = this._type; // 翻页：type 用当前，direction + idx
data.direction = direction;
data.gradeidx = (direction === 1) ? this._gradeIdx1 : this._gradeIdx2;
data.idx = (direction === 1) ? this._gradeIdx1 : this._gradeIdx2;
}
if (typeof Net !== 'undefined' && Net.Send_get_player_grade1) { Net.Send_get_player_grade1(data); }
},
@@ -89,7 +104,7 @@ var RecordView = {
_requestReplayData: function (gameIndex) {
var data = { agentid: GameData.AgentId, playerid: C_Player.playerid, gameid: GameData.GameId };
if (this._gradeData && this._gradeData[gameIndex] && typeof this._gradeData[gameIndex].idx !== 'undefined') {
data.gradeidx = this._gradeData[gameIndex].idx;
data.idx = this._gradeData[gameIndex].idx;
}
if (typeof Net !== 'undefined' && Net.Send_get_player_grade2) { Net.Send_get_player_grade2(data); }
},
client/js/gameabc-framework/ui/UIManager.js
+15 -15
View File
@@ -145,7 +145,7 @@ var UIManager = (function () {
SpriteManager.hide(LOADING_UI.SPRITES.LOADING_ICON);
SpriteManager.hide(LOADING_UI.SPRITES.LOADING_TEXT);
SpriteManager.hideGroup(LOADING_UI.GROUP_ID);
console.log('[UIManager] Loading UI 初始化 (Layer ' + LOADING_UI.LAYER + ')');
// console.log('[UIManager] Loading UI 初始化 (Layer ' + LOADING_UI.LAYER + ')');
}
/** @private */
@@ -153,7 +153,7 @@ var UIManager = (function () {
SpriteManager.hide(MESSAGE_UI.SPRITES.BACKGROUND);
SpriteManager.hide(MESSAGE_UI.SPRITES.TEXT);
SpriteManager.hideGroup(MESSAGE_UI.GROUP_ID);
console.log('[UIManager] Message UI 初始化 (Layer ' + MESSAGE_UI.LAYER + ')');
// console.log('[UIManager] Message UI 初始化 (Layer ' + MESSAGE_UI.LAYER + ')');
}
/** @private */
@@ -164,7 +164,7 @@ var UIManager = (function () {
SpriteManager.hide(CONFIRM_UI.SPRITES.BTN_CONFIRM);
SpriteManager.hide(CONFIRM_UI.SPRITES.BTN_CANCEL);
SpriteManager.hideGroup(CONFIRM_UI.GROUP_ID);
console.log('[UIManager] Confirm UI 初始化 (Layer ' + CONFIRM_UI.LAYER + ')');
// console.log('[UIManager] Confirm UI 初始化 (Layer ' + CONFIRM_UI.LAYER + ')');
}
/**
@@ -227,7 +227,7 @@ var UIManager = (function () {
return true;
}
console.log('[UIManager] 初始化 (v1.0.0)');
// console.log('[UIManager] 初始化 (v1.0.0)');
try {
_components = {};
@@ -239,7 +239,7 @@ var UIManager = (function () {
_isInitialized = true;
this.initialized = true;
console.log('[UIManager] 初始化完成');
// console.log('[UIManager] 初始化完成');
return true;
} catch (err) {
console.error('[UIManager] 初始化失败:', err);
@@ -279,7 +279,7 @@ var UIManager = (function () {
console.warn('[UIManager] registerComponent: 覆盖已存在组件:', name);
}
_components[name] = component;
console.log('[UIManager] 注册组件 "' + name + '"');
// console.log('[UIManager] 注册组件 "' + name + '"');
return true;
},
@@ -305,7 +305,7 @@ var UIManager = (function () {
var c = _components[name];
if (c.isVisible) { c.hide(); }
delete _components[name];
console.log('[UIManager] 注销组件 "' + name + '"');
// console.log('[UIManager] 注销组件 "' + name + '"');
return true;
},
@@ -321,7 +321,7 @@ var UIManager = (function () {
}
_components[name].destroy();
delete _components[name];
console.log('[UIManager] 销毁组件 "' + name + '"');
// console.log('[UIManager] 销毁组件 "' + name + '"');
return true;
},
@@ -371,7 +371,7 @@ var UIManager = (function () {
}
}
_scenes[sceneName] = componentNames;
console.log('[UIManager] 注册场景 "' + sceneName + '" (' + componentNames.length + ' 个组件)');
// console.log('[UIManager] 注册场景 "' + sceneName + '" (' + componentNames.length + ' 个组件)');
return true;
},
@@ -390,7 +390,7 @@ var UIManager = (function () {
return true;
}
console.log('[UIManager] 切换场景 "' + (_currentScene || 'null') + '" → "' + sceneName + '"');
// console.log('[UIManager] 切换场景 "' + (_currentScene || 'null') + '" → "' + sceneName + '"');
_hideCurrentScene();
_showScene(sceneName);
@@ -447,7 +447,7 @@ var UIManager = (function () {
* @param {string} message
*/
showToast: function (message) {
console.log('[UIManager] Toast:', message);
// console.log('[UIManager] Toast:', message);
},
/**
@@ -458,7 +458,7 @@ var UIManager = (function () {
*/
showEffectToast: function (tag, title, description) {
var msg = description ? (title + '：' + description) : title;
console.log('[UIManager] EffectToast [' + tag + ']:', msg);
// console.log('[UIManager] EffectToast [' + tag + ']:', msg);
this.showToast(msg);
},
@@ -575,14 +575,14 @@ var UIManager = (function () {
* 打印状态（调试用）
*/
printState: function () {
console.log('[UIManager] 状态:', JSON.stringify(this.getState(), null, 2));
// console.log('[UIManager] 状态:', JSON.stringify(this.getState(), null, 2));
},
/**
* 销毁 UIManager（销毁所有组件并重置状态）
*/
destroy: function () {
console.log('[UIManager] 开始销毁');
// console.log('[UIManager] 开始销毁');
for (var name in _components) {
if (_components.hasOwnProperty(name)) { this.destroyComponent(name); }
}
@@ -594,7 +594,7 @@ var UIManager = (function () {
_currentScene = null;
_isInitialized = false;
this.initialized = false;
console.log('[UIManager] 销毁完成');
// console.log('[UIManager] 销毁完成');
}
};
client/js/vendor/README-spine-patches.md
Vendored
+125
View File
@@ -0,0 +1,125 @@
# Spine 运行时 vendor 补丁记录
> ⚠️ **升级 `spine-canvas.js` / `spine-webgl.js` 前必读。**
> 这两个文件**不是官方发行版原样**，含本地补丁。直接用官方文件覆盖会导致
> `file://` 协议下资源加载全部失败（表现：所有 Spine 特效不显示）。
## 基线版本
| 文件 | npm 包 | 基线版本 | 字节数 | sha256 |
|---|---|---|---|---|
| `spine-canvas.js` | `@esotericsoftware/spine-canvas` | **4.2.113**（与 4.2.114 官方产物完全相同） | 455670 | `a19ad49c42490d4f41dbc805b0b91d72ccca4236957b2cdab8e57483c3aeb45c` |
| `spine-webgl.js` | `@esotericsoftware/spine-webgl` | **4.2.113** | 553987 | `0c2a0d8cb833297168bac7bbb7821d6ebe87aa11c3708831ca6741468b3d4d25` |
骨架资源导出版本为 **4.2.43**（见 `client/assets/spine/*.json` 的 `skeleton.spine` 字段），
运行时须保持在 **4.2.x** 系列。
官方产物获取地址：
```
https://cdn.jsdelivr.net/npm/@esotericsoftware/spine-canvas@4.2.113/dist/iife/spine-canvas.js
https://cdn.jsdelivr.net/npm/@esotericsoftware/spine-webgl@4.2.113/dist/iife/spine-webgl.js
```
官方原始产物 sha256（用于确认下载无误）：
- spine-canvas 4.2.113/114：`b706c28a…`（4.2.43 版，仅作对照，非本项目基线）
- spine-webgl 4.2.113：`e737ac4e7caa9fae…`（打补丁前）
---
## 补丁清单
### 补丁 1 —— `file://` 下不设 `crossOrigin`
**应用于**：`spine-canvas.js`、`spine-webgl.js`
**位置**：`AssetManager.loadTexture` 中构造 `Image` 处（canvas 版约 5798 行 / webgl 版约 5838 行）。
**原因**：`file://` 协议下设置 `image.crossOrigin = "anonymous"` 会使图片被判为跨域而加载失败。
这是 PNG 图集能在 `file://` 下加载的关键。
```js
// 官方
image.crossOrigin = "anonymous";
// 本地
if (typeof location === "undefined" || location.protocol !== "file:")
image.crossOrigin = "anonymous";
```
⚠️ 只改 `loadTexture` 中的 `image`。webgl 版另有 `logoImage` / `spinnerImage`
（约 14004 / 14008 行，属 loading spinner），**不要动**。
---
### 补丁 2 —— 删除 `toLoad === 0` 提前 resolve 分支
**应用于**：仅 `spine-canvas.js`（**`spine-webgl.js` 未移植，保留官方逻辑**）
**位置**：`AssetManager.loadTextureAtlas`（canvas 版官方约 5826-5830 行）。
```js
// 官方（webgl 版保留此段）
if (toLoad === 0) {
this.success(success, path, atlas);
resolve(atlas);
return;
}
```
**行为差异**：官方在 `atlas.pages.length === 0` 时立即 resolve；删除后该情形下 Promise
永不 resolve，`isLoadingComplete()` 恒为 false，全部 Spine 都不会显示。
**未移植到 webgl 版的理由**：本项目 20 个 atlas 文件实测**全部至少 1 页**（共 23 页），
该分支在本项目不可达，删与不删行为完全相同；而官方逻辑在边界情形下更安全。
**注**：此补丁在 `spine-canvas.js` 中随 commit `1f48f4ea`（2026-04-20）打包引入，
提交信息未提及，**原始意图在仓库中无记录可考**。上述为行为分析，非意图推定。
---
### 补丁 3 —— `rawDataUri` 判定改为 `startsWith("data:")`
**应用于**：`spine-canvas.js`（仅 `downloadText`）、`spine-webgl.js`（`downloadText` + `downloadBinary`）
**位置**：`Downloader.downloadText` / `Downloader.downloadBinary`
（canvas 版约 6070 / 6096 行，webgl 版约 6110 / 6136 行）。
```js
// 官方
if (rawDataUri && !rawDataUri.includes(".")) {
// 本地
if (rawDataUri && rawDataUri.startsWith("data:")) {
```
**原因**：`SpineMgr.js` 用 `setRawDataURI(key, "data:," + textData[key])` 注入嵌入的
json/atlas 文本（见 `client/generated/spine_data.js`），以规避 `file://` 下 XHR 的 CORS 拦截。
而 json 文本中必然含小数点（坐标、版本号等），官方那个「不含点才算 data URI」的判定会误判为
非 data URI，导致回退到 XHR 请求而失败。
**两版差异说明**：`spine-canvas.js` 只改了 `downloadText`，因为本项目只用 `loadText`
（json/atlas 均为文本），不走二进制 `.skel` 路径。`spine-webgl.js` 两处都改了 ——
该判定本身是官方的缺陷逻辑，改为 `startsWith("data:")` 在两处均为纯正确性提升、无副作用。
---
## 升级流程
1. 从上述 CDN 取目标版本的官方 iife 产物，记录其原始 sha256。
2. 逐条比对本文件的补丁清单，确认每处补丁点在新版中仍存在且语境未变。
3. 移植补丁时**必须校验匹配次数**（补丁 1 应命中 1 处、补丁 3 应命中 2 处），
匹配数不符即中止并重新核对，不得盲替。
4. 验证产物：`node --check` 语法检查；用 vm 加载并确认关键 API 齐备
（`AssetManager` / `SkeletonJson` / `AtlasAttachmentLoader` / `Skeleton` /
`AnimationState` / `AnimationStateData` / `Physics` / `TextureAtlas`，
webgl 版另需 `SceneRenderer` / `PolygonBatcher` / `GLTexture` /
`ManagedWebGLRenderingContext`）。
5. 更新本文件的版本号与 sha256。
6. 真机验证 `file://` 下资源加载正常（补丁 1、3 的实际验收点）。
## 已知约束
两个文件都以 `var spine = (() => {...})()` 形式暴露**同一个全局名 `spine`**。
**同时加载两者会互相覆盖**，后加载的胜出。因此运行时只能加载其中一个，
或在两次加载之间抢存引用。相关设计见
`docs/superpowers/specs/2026-08-08-spine-webgl-migration-design.md`。
client/js/vendor/gameabc.min.js
Vendored
+59 -20
View File
@@ -1,3 +1,44 @@
/* ============================================================================
* GAMEABC_TEXT —— 文字渲染统一层（本地补丁，见 js/vendor/README-gameabc-patches.md）
*
* 取代原先写在 js/00_Surface/12_Logic.js 里对 CanvasRenderingContext2D.prototype
* 的猴子补丁，把「字体族 / 字重 / 测宽 / 竖直锚点」四件事收敛到引擎内一处。
*
* 1) 字体族与字重：原写法 'lighter Npx Arial'，Arial 无中文字形，中文走回退字体又被
* weight=100 拉细，导致中英粗细不一；另有三处写成 'Npx bold san-serif'（拼写错误，
* 应为 sans-serif），实际落到默认衬线字体。统一为 500 字重 + 中文友好字体族。
*
* 2) 测宽同源：ifast_measureText 必须与实际绘制用同一 font 串，否则依赖测宽做居中 /
* 换行的地方会有约 3% 的横向偏差。现在两者都走 GAMEABC_TEXT.font()。
*
* 3) 竖直锚点：Canvas 的 textBaseline="top" 锚点 = 基线上移「首个可用字体的 ascent」，
* 但 WebKit（iOS 全部浏览器 + WKWebView）取 CoreText 原始 hhea ascent，
* Blink（PC Chrome/Edge、安卓 WebView）取归一化 typo ascent —— 同字同号相差 0.125em；
* iOS 上首个可用字体是 PingFang SC（ascent 1.06em）会把差距放大到 0.20em，
* 表现为「iOS 文字整体偏下」。alphabetic 是唯一不依赖度量解释的锚点，
* 因此这里改为固定用 alphabetic，由本层自算基线位置。
*
* TOP_TO_BASELINE = 0.845 是实测值：让 WebKit 的渲染结果与改造前 Blink 的外观
* 在 24 / 40 / 64px 三档下逐像素对齐（最大偏差 1px），即「iOS 向网页/安卓看齐」，
* 而不是三端一起位移。调整它会整体上下移动所有文字。
* ========================================================================== */
var GAMEABC_TEXT = {
FAMILY: '"Microsoft YaHei", "PingFang SC", Arial, sans-serif',
WEIGHT: '500',
TOP_TO_BASELINE: 0.845,
font: function(size) {
return this.WEIGHT + ' ' + size + 'px ' + this.FAMILY;
},
/* 绘制前调用：设好字体并把锚点固定为 alphabetic */
prepare: function(ctx, size) {
ctx.font = this.font(size);
ctx.textBaseline = 'alphabetic';
},
/* 把原先「以文字块顶部为锚点的 y」换算成 alphabetic 基线的 y */
baseline: function(y, size) {
return y + this.TOP_TO_BASELINE * size;
}
};
var gameabc_senderror = 0;
var gameabc = function() {
function s(SIt2, L$qig3, Qf4) {
@@ -455,7 +496,7 @@ function dfwtime200() {
return 0;
}
;var dc = ifast_getdc();
dc.font = 'lighter ' + obj.h + 'px Arial';
dc.font = GAMEABC_TEXT.font(obj.h);
if (!caption) {
caption = obj.caption;
}
@@ -2120,10 +2161,9 @@ function GameObjectManager() {
var yyyy;
var uu = gameabc_face.loglist.length - 1;
for (yyyy = uu; yyyy >= 0; yyyy--) {
this.backBufferContext2D.textBaseline = "top";
GAMEABC_TEXT.prepare(this.backBufferContext2D, 32);
this.backBufferContext2D.fillStyle = "red";
this.backBufferContext2D.font = 32 + 'px' + ' bold san-serif';
this.backBufferContext2D.fillText(gameabc_face.loglist[yyyy], 10, 80 + (uu - yyyy) * 32);
this.backBufferContext2D.fillText(gameabc_face.loglist[yyyy], 10, GAMEABC_TEXT.baseline(80 + (uu - yyyy) * 32, 32));
}
;
}
@@ -2135,7 +2175,10 @@ function GameObjectManager() {
}
;if (gameabc_face.obj.caption != "") {
this.backBufferContext2D.fillStyle = "white";
this.backBufferContext2D.font = parseInt(24 * this.backBuffer.width / 480) + "px" + ' bold san-serif';
/* 这一处原本就没有设过 textBaseline，实际用的是默认 alphabetic；
这里显式写死以免依赖上一次绘制在 context 上的残留状态，y 保持不变。 */
this.backBufferContext2D.font = GAMEABC_TEXT.font(parseInt(24 * this.backBuffer.width / 480));
this.backBufferContext2D.textBaseline = 'alphabetic';
this.backBufferContext2D.fillText(gameabc_face.obj.caption, parseInt(this.backBuffer.width / 2) - 50, parseInt(this.backBuffer.height / 2) + 100);
}
;if (gameabc_face.checkmustdraw() == 0) {
@@ -2641,17 +2684,16 @@ function ifast_float(f, r) {
;
}
;function ifast_mydrawtext(spid, recid, sp_x, sp_y, sp_w, sp_h) {
gameabc_face.dc.textBaseline = "top";
GAMEABC_TEXT.prepare(gameabc_face.dc, sp_h);
gameabc_face.dc.fillStyle = gameabc_GameTxt.GameTxtList[recid].Color;
gameabc_face.dc.font = sp_h + 'px' + ' bold san-serif';
var caption = gameabc_GameTxt.GameTxtList[recid].Text;
if (spid <= 0) {
gameabc_face.dc.fillText(caption, sp_x, sp_y, sp_w);
gameabc_face.dc.fillText(caption, sp_x, GAMEABC_TEXT.baseline(sp_y, sp_h), sp_w);
return;
}
;var obj = ifast_getobj(spid);
if (typeof (obj) == "object") {
gameabc_face.dc.fillText(caption, obj.x + sp_x, obj.y + sp_y, sp_w);
gameabc_face.dc.fillText(caption, obj.x + sp_x, GAMEABC_TEXT.baseline(obj.y + sp_y, sp_h), sp_w);
}
;
}
@@ -5290,9 +5332,8 @@ function gameabc_imgtxt() {
}
;gameabc_save(this, context);
gameabc_charge(this, context);
context.textBaseline = "top";
GAMEABC_TEXT.prepare(context, this.h);
context.fillStyle = gameabc_GameTxt.GameTxtList[this.frame].Color;
context.font = 'lighter ' + this.h + 'px Arial';
this.caption = gameabc_GameTxt.GameTxtList[this.frame].Text;
if (this.uidata.GameTxtStyle == 0) {
gameabc_drawtext = this.caption;
@@ -5300,18 +5341,17 @@ function gameabc_imgtxt() {
gameabc_drawtext = gameabc_password.substring(0, this.caption.length + 1);
}
;if (this.w > 0) {
context.fillText(gameabc_drawtext, this.x - xScroll, this.y - yScroll, this.w);
context.fillText(gameabc_drawtext, this.x - xScroll, GAMEABC_TEXT.baseline(this.y - yScroll, this.h), this.w);
} else {
context.fillText(gameabc_drawtext, this.x - xScroll, this.y - yScroll);
context.fillText(gameabc_drawtext, this.x - xScroll, GAMEABC_TEXT.baseline(this.y - yScroll, this.h));
}
;gameabc_restore(this, context);
}
}
;gameabc_imgtxt.prototype = new VisualGameObject;
function draw2(obj, context, ctx) {
context.textBaseline = "top";
var h = obj.h * iui.ratio;
context.font = 'lighter ' + h + 'px Arial';
GAMEABC_TEXT.prepare(context, h);
var w = context.measureText(obj.caption).width;
context.clearRect(0, 0, w, h);
if (obj.uidata.BackColorA != 0) {
@@ -5319,7 +5359,7 @@ function draw2(obj, context, ctx) {
context.fillRect(0, 0, w, h);
}
;context.fillStyle = obj.uidata.FontColor;
context.fillText(obj.caption, 0, 0);
context.fillText(obj.caption, 0, GAMEABC_TEXT.baseline(0, h));
ctx.drawImage(iui.test, 0, 0, w, h, obj.x, obj.y, w / iui.ratio, obj.h);
}
;function gameabc_txt() {
@@ -5340,13 +5380,12 @@ function draw2(obj, context, ctx) {
if (this.uidata.GameTxtStyle > 0) {
return;
}
;context.textBaseline = "top";
;GAMEABC_TEXT.prepare(context, this.h);
if (this.uidata.BackColorA != 0) {
context.fillStyle = this.uidata.BackColor;
context.fillRect(this.x, this.y, this.w, this.h);
}
;context.fillStyle = this.uidata.FontColor;
context.font = 'lighter ' + this.h + 'px Arial';
if (this.caption.indexOf("\n") > 0) {
var strs = new Array();
strs = this.caption.split("\n");
@@ -5355,11 +5394,11 @@ function draw2(obj, context, ctx) {
context.fillRect(this.x, this.y, this.w, this.h * strs.length);
}
;for (var i = 0; i < strs.length; i++) {
context.fillText(strs[i], this.x - xScroll, this.y - yScroll + this.h * i);
context.fillText(strs[i], this.x - xScroll, GAMEABC_TEXT.baseline(this.y - yScroll + this.h * i, this.h));
}
;return;
}
;context.fillText(this.caption, this.x - xScroll, this.y - yScroll);
;context.fillText(this.caption, this.x - xScroll, GAMEABC_TEXT.baseline(this.y - yScroll, this.h));
}
}
;gameabc_txt.prototype = new VisualGameObject;
client/js/vendor/spine-webgl.js
Vendored
+14172
View File
File diff suppressed because one or more lines are too long