/** * 主入口文件 * 初始化应用,连接各个模块 */ import store from './store.js'; import UIRenderer from './renderer.js'; import apiClient from './api.js'; import wsManager from './websocket.js'; import { showNotification, generateId } from './utils.js'; // 全局变量 let renderer = null; /** * 初始化应用 */ function initApp() { // 初始化渲染器 renderer = new UIRenderer(store); // 初始化WebSocket连接 wsManager.connect(); // 绑定WebSocket事件 bindWebSocketEvents(); // 绑定DOM事件 bindDomEvents(); // 初始化WebRTC (如果需要) // initWebRTC(); console.log('App initialized'); } /** * 绑定WebSocket事件 */ function bindWebSocketEvents() { wsManager.on('connect', () => { console.log('WebSocket connected'); showNotification('已连接到服务器'); }); wsManager.on('disconnect', () => { console.log('WebSocket disconnected'); showNotification('与服务器的连接已断开', 5000); }); wsManager.on('message-received', (data) => { console.log('Message received:', data); store.addMessage(data.message); }); wsManager.on('user-joined', (data) => { console.log('User joined:', data); showNotification(`${data.userId} 加入了通话`); }); wsManager.on('user-left', (data) => { console.log('User left:', data); showNotification(`${data.userId} 离开了通话`); }); wsManager.on('media-state-changed', (data) => { console.log('Media state changed:', data); // 更新远端媒体状态 if (data.userId !== store.getLocalUser().id) { store.updateRemoteMedia(data); } }); wsManager.on('network-quality', (data) => { console.log('Network quality changed:', data); // 更新网络质量 const state = store.getState(); if (data.userId === state.session.remoteUser.id) { state.session.remoteUser.networkQuality = data.quality; store.notify({ type: 'NETWORK_CHANGE', quality: data.quality }); } }); wsManager.on('call-ended', (data) => { console.log('Call ended:', data); store.endCall(); showNotification('通话已结束', 3000); }); } /** * 绑定DOM事件 */ function bindDomEvents() { // 切换侧边栏 window.toggleSidebar = function() { store.toggleSidebar(); }; // 切换麦克风 window.toggleMute = function(button) { const state = store.getState(); const currentState = state.session.localUser.mediaState.audio; store.updateLocalMedia('audio', !currentState); }; // 切换视频 window.toggleVideo = function(button) { const state = store.getState(); const currentState = state.session.localUser.mediaState.video; store.updateLocalMedia('video', !currentState); }; // 切换本地视频(用于悬停控制) window.toggleLocalVideo = function() { window.toggleVideo(); }; // 切换录屏 window.toggleRecording = function(button) { const state = store.getState(); const currentState = state.session.localUser.mediaState.recording || false; store.updateLocalMedia('recording', !currentState); // 显示录制状态通知 if (!currentState) { showNotification('开始录制'); } else { showNotification('停止录制'); } }; // 结束通话 window.endCall = function() { // 显示确认对话框 document.getElementById('endCallDialog').classList.remove('hidden'); }; // 取消结束通话 window.cancelEndCall = function() { document.getElementById('endCallDialog').classList.add('hidden'); }; // 确认结束通话 window.confirmEndCall = function() { document.getElementById('endCallDialog').classList.add('hidden'); store.endCall(); showNotification('通话已结束'); }; // 发送消息 window.sendMessage = function() { const chatInput = document.getElementById('chatInput'); const content = chatInput.value.trim(); if (content) { const state = store.getState(); const newMessage = { id: generateId(), senderId: state.session.localUser.id, senderName: state.session.localUser.name, senderAvatar: state.session.localUser.avatar, content: content, type: 'text', timestamp: new Date().toISOString(), isSelf: true }; store.addMessage(newMessage); chatInput.value = ''; // 发送消息到服务器 // wsManager.send('send-message', newMessage); } }; // 处理聊天输入回车 window.handleChatSubmit = function(event) { if (event.key === 'Enter') { window.sendMessage(); } }; // 键盘快捷键 document.addEventListener('keydown', (event) => { // 空格键静音 if (event.code === 'Space' && !event.target.matches('input, textarea')) { event.preventDefault(); window.toggleMute(); } // Ctrl+V 切换视频 if (event.ctrlKey && event.key === 'v') { event.preventDefault(); window.toggleVideo(); } }); // 绑定对话框事件 document.getElementById('cancelEndCall').addEventListener('click', window.cancelEndCall); document.getElementById('confirmEndCall').addEventListener('click', window.confirmEndCall); } /** * 初始化WebRTC */ function initWebRTC() { // 这里可以添加WebRTC初始化代码 console.log('Initializing WebRTC...'); } // 页面加载完成后初始化应用 document.addEventListener('DOMContentLoaded', initApp); // 导出全局变量 export { store, renderer, apiClient, wsManager };