From afbaa8f7d1de96defa491523d3ff85ea7050bdd4 Mon Sep 17 00:00:00 2001 From: pavel Date: Sat, 28 Feb 2026 13:43:03 +0100 Subject: [PATCH 1/2] fix volume slider --- static/shared/app-core.js | 110 ++++++++++++++++++++++++++++---------- 1 file changed, 83 insertions(+), 27 deletions(-) diff --git a/static/shared/app-core.js b/static/shared/app-core.js index aaaa0b4..deee4bc 100644 --- a/static/shared/app-core.js +++ b/static/shared/app-core.js @@ -576,50 +576,103 @@ function renderChannels() { pList.style.paddingLeft = "24px"; for (const p of participants) { const pRow = document.createElement("div"); - pRow.className = `channel-row ${p.is_speaking ? 'voice-speaking' : ''}`; + pRow.className = `channel-row voice-participant-row ${p.is_speaking ? 'voice-speaking' : ''}`; + pRow.style.display = "block"; pRow.style.padding = "2px 8px"; pRow.style.flexWrap = "wrap"; - let sliderHtml = ''; - if (p.user_id !== state.me.id) { - const vol = state.userVolumes.get(p.user_id) ?? 1.0; - const isVisible = state.voice.visibleVolumeSliders.has(p.user_id); - sliderHtml = ` -
- - - ${Math.round(vol * 100)}% -
- `; + const topRow = document.createElement("div"); + topRow.style.display = "flex"; + topRow.style.alignItems = "center"; + topRow.style.gap = "8px"; + topRow.style.width = "100%"; + + const avatar = document.createElement("div"); + avatar.className = "avatar"; + avatar.style.width = "20px"; + avatar.style.height = "20px"; + avatar.style.fontSize = "10px"; + avatar.textContent = shortName(p.display_name); + topRow.appendChild(avatar); + + const name = document.createElement("span"); + name.style.flex = "1"; + name.style.overflow = "hidden"; + name.style.textOverflow = "ellipsis"; + name.textContent = p.display_name; + topRow.appendChild(name); + + const isRemoteParticipant = p.user_id !== state.me.id; + if (isRemoteParticipant) { + const volumeToggle = document.createElement("button"); + volumeToggle.type = "button"; + volumeToggle.title = "Toggle volume slider"; + volumeToggle.style.display = "grid"; + volumeToggle.style.placeItems = "center"; + volumeToggle.style.width = "20px"; + volumeToggle.style.height = "20px"; + volumeToggle.style.color = "var(--text-muted)"; + volumeToggle.innerHTML = ''; + topRow.appendChild(volumeToggle); + + volumeToggle.addEventListener('click', (e) => { + toggleVolumeSlider(e); + }); } - pRow.innerHTML = ` -
-
${shortName(p.display_name)}
- ${escapeHtml(p.display_name)} - ${p.is_muted ? '' : ''} -
- ${sliderHtml} - `; + if (p.is_muted) { + const muteIcon = document.createElement("i"); + muteIcon.setAttribute("data-lucide", "mic-off"); + muteIcon.className = "voice-muted-icon"; + topRow.appendChild(muteIcon); + } + + pRow.appendChild(topRow); + + const volumeControl = document.createElement("div"); + volumeControl.className = `user-volume-control ${state.voice.visibleVolumeSliders.has(p.user_id) ? 'show-volume' : ''}`; + volumeControl.dataset.userId = p.user_id; + + if (isRemoteParticipant) { + const volumeIcon = document.createElement("i"); + volumeIcon.setAttribute("data-lucide", "volume-2"); + volumeIcon.style.width = "12px"; + volumeIcon.style.height = "12px"; + volumeIcon.style.opacity = "0.6"; + volumeControl.appendChild(volumeIcon); + + const slider = document.createElement("input"); + slider.type = "range"; + slider.min = "0"; + slider.max = "2"; + slider.step = "0.1"; + slider.value = String(state.userVolumes.get(p.user_id) ?? 1.0); + slider.className = "volume-slider"; + volumeControl.appendChild(slider); + + const volumePct = document.createElement("span"); + volumePct.className = "vol-pct"; + volumePct.textContent = `${Math.round((state.userVolumes.get(p.user_id) ?? 1.0) * 100)}%`; + volumeControl.appendChild(volumePct); - const slider = pRow.querySelector('.volume-slider'); - if (slider) { slider.addEventListener('input', (e) => { const val = parseFloat(e.target.value); state.userVolumes.set(p.user_id, val); - pRow.querySelector('.vol-pct').textContent = `${Math.round(val * 100)}%`; + volumePct.textContent = `${Math.round(val * 100)}%`; const gainNode = state.voice.peerGainNodes.get(p.user_id); - if (gainNode) { + if (gainNode && state.voice.audioContext) { gainNode.gain.setTargetAtTime(val, state.voice.audioContext.currentTime, 0.05); } }); - // Stop propagation to prevent joining channel again when clicking slider - slider.addEventListener('click', (e) => e.stopPropagation()); + + volumeControl.addEventListener('click', (e) => e.stopPropagation()); + volumeControl.addEventListener('mousedown', (e) => e.stopPropagation()); + pRow.appendChild(volumeControl); } const toggleVolumeSlider = (e) => { - if (p.user_id === state.me.id) return; + if (!isRemoteParticipant) return; e.preventDefault(); e.stopPropagation(); if (state.voice.visibleVolumeSliders.has(p.user_id)) { @@ -633,6 +686,9 @@ function renderChannels() { // Electron can swallow contextmenu events on some platforms; use // right-button mousedown as a reliable fallback for slider toggle. pRow.addEventListener('contextmenu', toggleVolumeSlider); + pRow.addEventListener('auxclick', (e) => { + if (e.button === 2) toggleVolumeSlider(e); + }); pRow.addEventListener('mousedown', (e) => { if (e.button === 2) toggleVolumeSlider(e); }); From 6dbd5e77c4370792f68f16bd67a4504d1eb6c35c Mon Sep 17 00:00:00 2001 From: pavel Date: Sat, 28 Feb 2026 13:44:57 +0100 Subject: [PATCH 2/2] fix desktop backend url --- main.js | 20 +++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/main.js b/main.js index 1baa6e2..cbc011f 100644 --- a/main.js +++ b/main.js @@ -1,6 +1,7 @@ const { app, BrowserWindow, session, desktopCapturer, ipcMain, clipboard } = require('electron'); const { autoUpdater } = require('electron-updater'); const path = require('path'); +const packageJson = require('./package.json'); const updateState = { status: 'idle', // idle | checking | available | downloading | downloaded | not-available | error @@ -24,6 +25,22 @@ function isNewerVersionAvailable(info) { let updateCheckInProgress = false; +function resolveBackendUrl() { + const configuredUrl = (process.env.CHATTZ_URL || process.env.APP_BASE_URL || '').trim(); + if (configuredUrl) { + return configuredUrl.replace(/\/$/, ''); + } + + const packagedFallback = typeof packageJson.homepage === 'string' + ? packageJson.homepage.trim() + : ''; + if (app.isPackaged && packagedFallback) { + return packagedFallback.replace(/\/$/, ''); + } + + return 'http://localhost:3000'; +} + async function runUpdateCheck(reason = 'manual') { if (updateCheckInProgress) { console.log(`Update check skipped (${reason}): another check is already in progress`); @@ -56,8 +73,9 @@ async function runUpdateCheck(reason = 'manual') { function createWindow() { const sess = session.fromPartition('persist:chattz'); - const backendUrl = (process.env.CHATTZ_URL || process.env.APP_BASE_URL || 'http://localhost:3000').replace(/\/$/, ''); + const backendUrl = resolveBackendUrl(); const backendOrigin = new URL(backendUrl).origin; + console.log(`Desktop backend URL: ${backendUrl}`); const win = new BrowserWindow({ width: 1200,