Files
chatroom/resources/js/chat-room/game-panels.js
T

102 lines
2.6 KiB
JavaScript

// 小型游戏弹窗通用事件代理,收口各游戏头部关闭按钮内联 onclick。
let gamePanelEventsBound = false;
/**
* 关闭指定 Alpine 游戏面板。
*
* @param {string} panelId 面板 DOM ID
* @returns {void}
*/
function closeAlpineGamePanel(panelId) {
const panel = document.getElementById(panelId);
const panelData = panel && typeof window.Alpine?.$data === "function"
? window.Alpine.$data(panel)
: null;
if (!panelData) {
return;
}
// 多数游戏面板提供 close(),占卜面板只暴露 show 状态,因此保留 show=false 兜底。
if (typeof panelData.close === "function") {
panelData.close();
return;
}
panelData.show = false;
}
/**
* 打开五子棋面板,作为公屏邀请按钮和存量全局函数之间的桥接。
*
* @returns {void}
*/
function openGomokuPanelFromInvite() {
if (typeof window.openGomokuPanel === "function") {
window.openGomokuPanel();
return;
}
const panel = document.getElementById("gomoku-panel");
const panelData = panel && typeof window.Alpine?.$data === "function"
? window.Alpine.$data(panel)
: null;
panelData?.open?.();
}
/**
* 接受五子棋公屏邀请,业务仍沿用五子棋面板里的存量全局函数。
*
* @param {string} gameId 对局 ID
* @returns {void}
*/
function acceptGomokuInviteFromMessage(gameId) {
if (!gameId) {
return;
}
window.acceptGomokuInvite?.(gameId);
}
/**
* 绑定小型游戏面板通用关闭事件。
*
* @returns {void}
*/
export function bindGamePanelControls() {
if (gamePanelEventsBound || typeof document === "undefined") {
return;
}
gamePanelEventsBound = true;
document.addEventListener("click", (event) => {
if (!(event.target instanceof Element)) {
return;
}
const gomokuOpenButton = event.target.closest("[data-gomoku-open-panel]");
if (gomokuOpenButton) {
event.preventDefault();
openGomokuPanelFromInvite();
return;
}
const gomokuAcceptButton = event.target.closest("[data-gomoku-accept-id]");
if (gomokuAcceptButton) {
event.preventDefault();
acceptGomokuInviteFromMessage(gomokuAcceptButton.getAttribute("data-gomoku-accept-id") || "");
return;
}
const closeButton = event.target.closest("[data-game-panel-close]");
if (!closeButton) {
return;
}
event.preventDefault();
closeAlpineGamePanel(closeButton.getAttribute("data-game-panel-close") || "");
});
}