Handle screen-sharing feed ending

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
This commit is contained in:
Šimon Brandner 2022-08-19 17:16:57 +02:00
parent 3406b46db5
commit af7daee3e7
No known key found for this signature in database
GPG key ID: D1D45825D60C24D2
2 changed files with 13 additions and 1 deletions

View file

@ -26,6 +26,7 @@ interface CallFeedState {
videoMuted: boolean;
audioMuted: boolean;
localVolume: number;
disposed: boolean;
stream: MediaStream;
purpose: SDPStreamMetadataPurpose;
}
@ -37,6 +38,7 @@ function getCallFeedState(callFeed: CallFeed): CallFeedState {
videoMuted: callFeed ? callFeed.isVideoMuted() : true,
audioMuted: callFeed ? callFeed.isAudioMuted() : true,
localVolume: callFeed ? callFeed.getLocalVolume() : 0,
disposed: callFeed ? callFeed.idDisposed() : undefined,
stream: callFeed ? callFeed.stream : undefined,
purpose: callFeed ? callFeed.purpose : undefined,
};
@ -69,6 +71,7 @@ export function useCallFeed(callFeed: CallFeed): CallFeedState {
callFeed.on(CallFeedEvent.MuteStateChanged, onMuteStateChanged);
callFeed.on(CallFeedEvent.LocalVolumeChanged, onLocalVolumeChanged);
callFeed.on(CallFeedEvent.NewStream, onUpdateCallFeed);
callFeed.on(CallFeedEvent.Disposed, onUpdateCallFeed);
}
onUpdateCallFeed();

View file

@ -15,10 +15,11 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import { useCallback, useState } from "react";
import { useCallback, useEffect, useState } from "react";
import { Participant } from "../room/InCallView";
import { useEventTarget } from "../useEvents";
import { useCallFeed } from "./useCallFeed";
export function useFullscreen(ref: React.RefObject<HTMLElement>): {
toggleFullscreen: (participant: Participant) => void;
@ -26,6 +27,7 @@ export function useFullscreen(ref: React.RefObject<HTMLElement>): {
} {
const [fullscreenParticipant, setFullscreenParticipant] =
useState<Participant | null>(null);
const { disposed } = useCallFeed(fullscreenParticipant?.callFeed);
const toggleFullscreen = useCallback(
(participant: Participant) => {
@ -52,5 +54,12 @@ export function useFullscreen(ref: React.RefObject<HTMLElement>): {
useEventTarget(ref.current, "fullscreenchange", onFullscreenChanged);
useEffect(() => {
if (disposed) {
document.exitFullscreen();
setFullscreenParticipant(null);
}
}, [disposed]);
return { toggleFullscreen, fullscreenParticipant };
}