Fix fullscreen on Safari (#814)
* Fix fullscreen on Safari Safari only supports it via the webkit prefix Fixes https://github.com/vector-im/element-call/issues/539 * NOT THAT LOGGER, VSCODE
This commit is contained in:
parent
fef503c65d
commit
b9ee9583e4
2 changed files with 13 additions and 1 deletions
5
src/@types/global.d.ts
vendored
5
src/@types/global.d.ts
vendored
|
@ -27,4 +27,9 @@ declare global {
|
||||||
interface MediaElement extends HTMLVideoElement {
|
interface MediaElement extends HTMLVideoElement {
|
||||||
setSinkId: (id: string) => void;
|
setSinkId: (id: string) => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface HTMLElement {
|
||||||
|
// Safari only supports this prefixed, so tell the type system about it
|
||||||
|
webkitRequestFullscreen: () => void;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -15,6 +15,7 @@ See the License for the specific language governing permissions and
|
||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
import { logger } from "matrix-js-sdk/src/logger";
|
||||||
import { useCallback, useEffect, useState } from "react";
|
import { useCallback, useEffect, useState } from "react";
|
||||||
|
|
||||||
import { useEventTarget } from "../useEvents";
|
import { useEventTarget } from "../useEvents";
|
||||||
|
@ -36,7 +37,13 @@ export function useFullscreen(ref: React.RefObject<HTMLElement>): {
|
||||||
setFullscreenParticipant(null);
|
setFullscreenParticipant(null);
|
||||||
} else {
|
} else {
|
||||||
try {
|
try {
|
||||||
|
if (ref.current.requestFullscreen) {
|
||||||
ref.current.requestFullscreen();
|
ref.current.requestFullscreen();
|
||||||
|
} else if (ref.current.webkitRequestFullscreen) {
|
||||||
|
ref.current.webkitRequestFullscreen();
|
||||||
|
} else {
|
||||||
|
logger.error("No available fullscreen API!");
|
||||||
|
}
|
||||||
setFullscreenParticipant(tileDes);
|
setFullscreenParticipant(tileDes);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.warn("Failed to fullscreen:", error);
|
console.warn("Failed to fullscreen:", error);
|
||||||
|
|
Loading…
Reference in a new issue