diff --git a/client/public/main.js b/client/public/main.js index 00eab1c..7d9eccd 100644 --- a/client/public/main.js +++ b/client/public/main.js @@ -17,6 +17,99 @@ let connectionId = ""; // 当前视图状态:'connect' 或 'call'(可用于未来扩展) let currentView = 'connect'; +function getInvitePayloadFromUrl() { + const params = new URLSearchParams(window.location.search); + if (params.get('invite') !== '1') { + return null; + } + + return { + name: params.get('callerName') || '邀请方', + avatar: params.get('callerAvatar') || '/images/p2.png', + connectionId: params.get('connectionId') || '' + }; +} + +function showCallRequestDialog(caller = {}) { + const dialog = document.getElementById('callRequestDialog'); + if (!dialog) { + return; + } + + const callerName = caller.name || '邀请方'; + const callerAvatar = caller.avatar || '/images/p2.png'; + const targetConnectionId = caller.connectionId || ''; + + if (document.getElementById('callRequestName')) { + document.getElementById('callRequestName').textContent = callerName; + } + if (document.getElementById('callRequestAvatar')) { + document.getElementById('callRequestAvatar').src = callerAvatar; + } + if (document.getElementById('callRequestText')) { + document.getElementById('callRequestText').textContent = targetConnectionId + ? `正在邀请您加入通话 (${targetConnectionId})` + : '正在请求与您进行视频通话'; + } + + if (targetConnectionId) { + connectionId = targetConnectionId; + localStorage.setItem('connectionId', targetConnectionId); + } + + dialog.classList.remove('hidden'); +} + +function bindInviteDialogEvents() { + window.showCallRequest = function (caller) { + showCallRequestDialog(caller); + }; + + window.rejectCall = function () { + const dialog = document.getElementById('callRequestDialog'); + if (dialog) { + dialog.classList.add('hidden'); + } + showNotification('已拒绝通话请求'); + }; + + window.acceptCall = async function () { + const dialog = document.getElementById('callRequestDialog'); + if (dialog) { + dialog.classList.add('hidden'); + } + + const targetConnectionId = + connectionId || + localStorage.getItem('connectionId') || + new URLSearchParams(window.location.search).get('connectionId'); + + if (!targetConnectionId) { + showNotification('缺少连接ID,无法接受邀请', 'error'); + return; + } + + connectionId = targetConnectionId; + localStorage.setItem('connectionId', targetConnectionId); + showNotification('已接受通话请求'); + + if (currentView !== 'call') { + await switchToCallView(targetConnectionId); + } + }; + + const rejectCall = document.getElementById('rejectCall'); + const acceptCall = document.getElementById('acceptCall'); + if (rejectCall && !rejectCall.dataset.bound) { + rejectCall.addEventListener('click', window.rejectCall); + rejectCall.dataset.bound = 'true'; + } + if (acceptCall && !acceptCall.dataset.bound) { + acceptCall.addEventListener('click', window.acceptCall); + acceptCall.dataset.bound = 'true'; + } +} + /** * 切换到call视图(创建/加入通话后) * @param {string} connectionId - 连接ID @@ -152,45 +245,6 @@ function bindCallViewDomEvents() { showNotification('通话已结束'); }; - // 显示通话请求弹窗 - window.showCallRequest = function (caller) { - const dialog = document.getElementById('callRequestDialog'); - if (dialog) { - // 设置通话请求信息 - if (document.getElementById('callRequestName')) { - document.getElementById('callRequestName').textContent = caller.name; - } - if (document.getElementById('callRequestAvatar')) { - document.getElementById('callRequestAvatar').src = caller.avatar; - } - // 显示弹窗 - dialog.classList.remove('hidden'); - } - }; - - // 拒绝通话 - window.rejectCall = function () { - const dialog = document.getElementById('callRequestDialog'); - if (dialog) { - dialog.classList.add('hidden'); - } - showNotification('已拒绝通话请求'); - // 可以在这里添加发送拒绝通话请求到服务器的逻辑 - }; - - // 接受通话 - window.acceptCall = function () { - const dialog = document.getElementById('callRequestDialog'); - if (dialog) { - dialog.classList.add('hidden'); - } - showNotification('已接受通话请求'); - // 可以在这里添加发送接受通话请求到服务器的逻辑 - // 然后初始化通话 - store.initCall(); - store.setUp(connectionId); - }; - // 绑定消息相关事件 chatMessage.bindMessageEvents(); @@ -232,11 +286,7 @@ function bindCallViewDomEvents() { } }); - // 绑定通话请求对话框事件 - const rejectCall = document.getElementById('rejectCall'); - const acceptCall = document.getElementById('acceptCall'); - if (rejectCall) rejectCall.addEventListener('click', window.rejectCall); - if (acceptCall) acceptCall.addEventListener('click', window.acceptCall); + bindInviteDialogEvents(); } // 页面加载完成后初始化(SPA入口) @@ -257,14 +307,21 @@ window.addEventListener('DOMContentLoaded', async () => { // 绑定connect视图事件(加入通话、创建通话等) bindConnectViewEvents(handleJoinCall, handleCreateCall); + bindInviteDialogEvents(); // 检查是否有保存的连接ID,填入输入框 const savedConnectionId = localStorage.getItem('connectionId'); if (savedConnectionId) { + connectionId = savedConnectionId; const connectionIdInput = document.getElementById('connectionIdInput'); if (connectionIdInput) connectionIdInput.value = savedConnectionId; } + const invitePayload = getInvitePayloadFromUrl(); + if (invitePayload) { + window.showCallRequest(invitePayload); + } + console.log('SPA initialized, showing connect view'); } catch (error) { console.error('Error initializing SPA:', error);