Show when connection is lost on PTT mode
This commit is contained in:
parent
5c4bab2a8a
commit
e9b963080c
2 changed files with 32 additions and 3 deletions
|
@ -44,8 +44,11 @@ function getPromptText(
|
|||
activeSpeakerIsLocalUser: boolean,
|
||||
talkOverEnabled: boolean,
|
||||
activeSpeakerUserId: string,
|
||||
activeSpeakerDisplayName: string
|
||||
activeSpeakerDisplayName: string,
|
||||
connected: boolean
|
||||
): string {
|
||||
if (!connected) return "Connection Lost";
|
||||
|
||||
const isTouchScreen = Boolean(window.ontouchstart !== undefined);
|
||||
|
||||
if (showTalkOverError) {
|
||||
|
@ -127,6 +130,7 @@ export const PTTCallView: React.FC<Props> = ({
|
|||
startTalking,
|
||||
stopTalking,
|
||||
transmitBlocked,
|
||||
connected,
|
||||
} = usePTT(
|
||||
client,
|
||||
groupCall,
|
||||
|
@ -234,7 +238,8 @@ export const PTTCallView: React.FC<Props> = ({
|
|||
activeSpeakerIsLocalUser,
|
||||
talkOverEnabled,
|
||||
activeSpeakerUserId,
|
||||
activeSpeakerDisplayName
|
||||
activeSpeakerDisplayName,
|
||||
connected
|
||||
)}
|
||||
</p>
|
||||
{userMediaFeeds.map((callFeed) => (
|
||||
|
|
|
@ -15,10 +15,11 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
import { useCallback, useEffect, useState } from "react";
|
||||
import { MatrixClient } from "matrix-js-sdk/src/client";
|
||||
import { MatrixClient, ClientEvent } from "matrix-js-sdk/src/client";
|
||||
import { GroupCall } from "matrix-js-sdk/src/webrtc/groupCall";
|
||||
import { CallFeed, CallFeedEvent } from "matrix-js-sdk/src/webrtc/callFeed";
|
||||
import { logger } from "matrix-js-sdk/src/logger";
|
||||
import { SyncState } from "matrix-js-sdk/src/sync";
|
||||
|
||||
import { PlayClipFunction, PTTClipID } from "../sound/usePttSounds";
|
||||
|
||||
|
@ -52,6 +53,11 @@ export interface PTTState {
|
|||
startTalking: () => void;
|
||||
stopTalking: () => void;
|
||||
transmitBlocked: boolean;
|
||||
// connected is actually an indication of whether we're connected to the HS
|
||||
// (ie. the client's syncing state) rather than media connection, since
|
||||
// it's peer to peer so we can't really say once peer is 'disconnected' if
|
||||
// there's only one other person in the call and they've lost Internet.
|
||||
connected: boolean;
|
||||
}
|
||||
|
||||
export const usePTT = (
|
||||
|
@ -211,6 +217,17 @@ export const usePTT = (
|
|||
setMicMuteWrapper(true);
|
||||
}, [setMicMuteWrapper]);
|
||||
|
||||
// separate state for connected: we set it separately from other things
|
||||
// in the client sync callback
|
||||
const [connected, setConnected] = useState(true);
|
||||
|
||||
const onClientSync = useCallback(
|
||||
(syncState: SyncState) => {
|
||||
setConnected(syncState !== SyncState.Error);
|
||||
},
|
||||
[setConnected]
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
function onKeyDown(event: KeyboardEvent): void {
|
||||
if (event.code === "Space") {
|
||||
|
@ -245,10 +262,14 @@ export const usePTT = (
|
|||
window.addEventListener("keyup", onKeyUp);
|
||||
window.addEventListener("blur", onBlur);
|
||||
|
||||
client.on(ClientEvent.Sync, onClientSync);
|
||||
|
||||
return () => {
|
||||
window.removeEventListener("keydown", onKeyDown);
|
||||
window.removeEventListener("keyup", onKeyUp);
|
||||
window.removeEventListener("blur", onBlur);
|
||||
|
||||
client.removeListener(ClientEvent.Sync, onClientSync);
|
||||
};
|
||||
}, [
|
||||
groupCall,
|
||||
|
@ -260,6 +281,8 @@ export const usePTT = (
|
|||
pttButtonHeld,
|
||||
enablePTTButton,
|
||||
setMicMuteWrapper,
|
||||
client,
|
||||
onClientSync,
|
||||
]);
|
||||
|
||||
const setTalkOverEnabled = useCallback((talkOverEnabled) => {
|
||||
|
@ -278,5 +301,6 @@ export const usePTT = (
|
|||
startTalking,
|
||||
stopTalking,
|
||||
transmitBlocked,
|
||||
connected,
|
||||
};
|
||||
};
|
||||
|
|
Loading…
Reference in a new issue