fix: PTT iframe focus, folds-native PTT badge styling

This commit is contained in:
root
2026-05-14 19:37:19 -04:00
parent 3513608435
commit d76cd0f7ee
3 changed files with 37 additions and 13 deletions
+17
View File
@@ -0,0 +1,17 @@
{
"defaultHomeserver": 0,
"homeserverList": [
"matrix.lotusguild.org"
],
"allowCustomHomeservers": false,
"featuredCommunities": {
"openAsDefault": false,
"spaces": [],
"rooms": [],
"servers": []
},
"hashRouter": {
"enabled": false,
"basename": "/"
}
}
+4 -4
View File
@@ -182,14 +182,14 @@ export function CallControl({
<Box alignItems="Inherit" gap="200">
{pttMode && (
<Chip
variant="Critical"
variant={microphone ? 'Success' : 'Warning'}
fill="Soft"
radii="300"
radii="400"
size="300"
outlined
style={{ pointerEvents: 'none', fontWeight: 700, letterSpacing: '0.06em' }}
style={{ pointerEvents: 'none', fontWeight: 700 }}
>
<Text size="T200">PTT {pttKeyLabel}</Text>
<Text size="T200">{microphone ? '● Live' : `PTT ${pttKeyLabel}`}</Text>
</Chip>
)}
<MicrophoneButton
+16 -9
View File
@@ -2,6 +2,7 @@ import React, { MouseEventHandler, useCallback, useEffect, useRef, useState } fr
import {
Box,
Button,
Chip,
config,
Icon,
IconButton,
@@ -110,13 +111,19 @@ export function CallControls({ callEmbed }: CallControlsProps) {
callEmbed.control.setMicrophone(false);
setPttActive(false);
};
// The EC iframe captures keyboard events when it has focus, so listen on it too
const iframeWindow = callEmbed.iframe.contentWindow;
window.addEventListener('keydown', onKeyDown);
window.addEventListener('keyup', onKeyUp);
window.addEventListener('blur', onBlur);
iframeWindow?.addEventListener('keydown', onKeyDown);
iframeWindow?.addEventListener('keyup', onKeyUp);
return () => {
window.removeEventListener('keydown', onKeyDown);
window.removeEventListener('keyup', onKeyUp);
window.removeEventListener('blur', onBlur);
iframeWindow?.removeEventListener('keydown', onKeyDown);
iframeWindow?.removeEventListener('keyup', onKeyUp);
};
}, [pttMode, pttKey, callEmbed, microphone]);
@@ -136,24 +143,24 @@ export function CallControls({ callEmbed }: CallControlsProps) {
alignItems="Center"
>
{pttMode && (
<Box
<Chip
variant={pttActive ? 'Success' : 'Warning'}
fill="Soft"
radii="400"
style={{
position: 'absolute',
top: '-2.5rem',
top: '-2.2rem',
left: '50%',
transform: 'translateX(-50%)',
background: pttActive ? 'rgba(0,255,136,0.18)' : 'rgba(255,107,0,0.12)',
border: `1px solid ${pttActive ? 'rgba(0,255,136,0.55)' : 'rgba(255,107,0,0.35)'}`,
borderRadius: '99px',
padding: '0.2rem 0.9rem',
pointerEvents: 'none',
whiteSpace: 'nowrap',
}}
outlined
>
<Text size="T200" style={{ color: pttActive ? '#00FF88' : '#FF6B00', fontWeight: 700, letterSpacing: '0.08em' }}>
{pttActive ? '● LIVE' : `PTT — Hold ${pttKeyLabel}`}
<Text size="T200" style={{ fontWeight: 700 }}>
{pttActive ? '● Live' : `PTT — Hold ${pttKeyLabel}`}
</Text>
</Box>
</Chip>
)}
{shareConfirm && (
<Box