Files
chatroom/resources/js/chat.js
lkddi 66f68bab85 功能:管理员全员清屏 + 离开提示趣味风格
- 新增 ScreenCleared 广播事件
- AdminCommandController 添加 clearScreen 方法(站长权限)
- ChatStateService 添加 clearMessages 方法
- chat.js 添加 ScreenCleared Echo 监听
- 前端:全员清屏按钮(红色🧹)+ 清屏处理逻辑(保留悄悄话)
- 离开提示改为与进入一致的趣味随机语风格(橙色【离开】标签)
2026-02-26 23:05:56 +08:00

71 lines
2.5 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import "./bootstrap";
// 这个文件负责处理浏览器与 Laravel Reverb WebSocket 服务器的通信。
// 通过 Presence Channel 实现聊天室的核心监听。
export function initChat(roomId) {
if (!roomId) {
console.error("未提供 roomId无法初始化 WebSocket 连接。");
return;
}
// 加入带有登录人员追踪的 Presence Channel
window.Echo.join(`room.${roomId}`)
// 当自己成功连接时,获取当前在这里的所有人列表
.here((users) => {
console.log("当前房间内的在线人员:", users);
// 触发自定义事件,让具体的前端 UI 去接管渲染
window.dispatchEvent(
new CustomEvent("chat:here", { detail: users }),
);
})
// 监听其他人的加入
.joining((user) => {
console.log(user.username + " 进入了房间");
window.dispatchEvent(
new CustomEvent("chat:joining", { detail: user }),
);
})
// 监听其他人的离开
.leaving((user) => {
console.log(user.username + " 离开了房间");
window.dispatchEvent(
new CustomEvent("chat:leaving", { detail: user }),
);
})
// 监听新发送的文本消息
.listen("MessageSent", (e) => {
console.log("收到新发言:", e.message);
window.dispatchEvent(
new CustomEvent("chat:message", { detail: e.message }),
);
})
// 监听踢出事件(通常判断是不是自己被踢出了)
.listen("UserKicked", (e) => {
console.log("踢出通知:", e);
window.dispatchEvent(new CustomEvent("chat:kicked", { detail: e }));
})
// 监听封口禁言事件
.listen("UserMuted", (e) => {
console.log("禁言通知:", e);
window.dispatchEvent(new CustomEvent("chat:muted", { detail: e }));
})
// 监听房间主题被改变
.listen("RoomTitleUpdated", (e) => {
console.log("主题改变:", e);
window.dispatchEvent(
new CustomEvent("chat:title-updated", { detail: e }),
);
})
// 监听管理员全员清屏
.listen("ScreenCleared", (e) => {
console.log("全员清屏:", e);
window.dispatchEvent(
new CustomEvent("chat:screen-cleared", { detail: e }),
);
});
}
// 供全局调用
window.initChat = initChat;