moon
/
soapbox
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fullscreen.js --> fullscreen.ts

This commit is contained in:
Alex Gleason 2022-09-30 19:52:41 -05:00
parent 0b7416b6e5
commit af49171cb9
No known key found for this signature in database
GPG Key ID: 7211D1F99744FBB7
2 changed files with 24 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
app/soapbox/features/ui/util/fullscreen.js → app/soapbox/features/ui/util/fullscreen.ts
View File

@ -1,31 +1,43 @@
// APIs for normalizing fullscreen operations. Note that Edge uses // APIs for normalizing fullscreen operations. Note that Edge uses
// the WebKit-prefixed APIs currently (as of Edge 16). // the WebKit-prefixed APIs currently (as of Edge 16).
export const isFullscreen = () => document.fullscreenElement || export const isFullscreen = (): boolean => {
return Boolean(
document.fullscreenElement ||
// @ts-ignore
document.webkitFullscreenElement || document.webkitFullscreenElement ||
document.mozFullScreenElement; // @ts-ignore
document.mozFullScreenElement,
);
};
export const exitFullscreen = () => { export const exitFullscreen = (): void => {
if (document.exitFullscreen) { if (document.exitFullscreen) {
document.exitFullscreen(); document.exitFullscreen();
} else if (document.webkitExitFullscreen) { } else if ('webkitExitFullscreen' in document) {
// @ts-ignore
document.webkitExitFullscreen(); document.webkitExitFullscreen();
} else if (document.mozCancelFullScreen) { } else if ('mozCancelFullScreen' in document) {
// @ts-ignore
document.mozCancelFullScreen(); document.mozCancelFullScreen();
} }
}; };
export const requestFullscreen = el => { export const requestFullscreen = (el: Element): void => {
if (el.requestFullscreen) { if (el.requestFullscreen) {
el.requestFullscreen(); el.requestFullscreen();
} else if (el.webkitRequestFullscreen) { } else if ('webkitRequestFullscreen' in el) {
// @ts-ignore
el.webkitRequestFullscreen(); el.webkitRequestFullscreen();
} else if (el.mozRequestFullScreen) { } else if ('mozRequestFullScreen' in el) {
// @ts-ignore
el.mozRequestFullScreen(); el.mozRequestFullScreen();
} }
}; };
export const attachFullscreenListener = (listener) => { type FullscreenListener = (this: Document, ev: Event) => void;
export const attachFullscreenListener = (listener: FullscreenListener): void => {
if ('onfullscreenchange' in document) { if ('onfullscreenchange' in document) {
document.addEventListener('fullscreenchange', listener); document.addEventListener('fullscreenchange', listener);
} else if ('onwebkitfullscreenchange' in document) { } else if ('onwebkitfullscreenchange' in document) {
@ -35,7 +47,7 @@ export const attachFullscreenListener = (listener) => {
} }
}; };
export const detachFullscreenListener = (listener) => { export const detachFullscreenListener = (listener: FullscreenListener): void => {
if ('onfullscreenchange' in document) { if ('onfullscreenchange' in document) {
document.removeEventListener('fullscreenchange', listener); document.removeEventListener('fullscreenchange', listener);
} else if ('onwebkitfullscreenchange' in document) { } else if ('onwebkitfullscreenchange' in document) {

2
app/soapbox/features/video/index.tsx
View File

@ -368,7 +368,7 @@ const Video: React.FC<IVideo> = ({
const toggleFullscreen = () => { const toggleFullscreen = () => {
if (isFullscreen()) { if (isFullscreen()) {
exitFullscreen(); exitFullscreen();
} else { } else if (player.current) {
requestFullscreen(player.current); requestFullscreen(player.current);
} }
}; };