lbry-desktop/src/ui/util/full-screen.js
2019-05-30 22:11:33 -06:00

43 lines
1.5 KiB
JavaScript

const prefixes = {
fullscreenElement: ['fullscreenElement', 'msFullscreenElement', 'mozFullScreenElement', 'webkitFullscreenElement'],
fullscreenEnabled: ['fullscreenEnabled', 'msFullscreenEnabled', 'mozFullScreenEnabled', 'webkitFullscreenEnabled'],
requestFullscreen: ['requestFullscreen', 'msRequestFullscreen', 'mozRequestFullScreen', 'webkitRequestFullscreen'],
exitFullscreen: ['exitFullscreen', 'msExitFullscreen', 'mozCancelFullScreen', 'webkitExitFullscreen'],
fullscreenChange: ['fullscreenChange', 'MSFullscreenChange', 'mozfullscreenchange', 'webkitfullscreenchange'],
};
const getPrefix = () => {
let prefixIndex = 0;
// validate prefix
prefixes.fullscreenEnabled.some((prefix, index) => {
if (document[prefix] || document[prefix] === false) {
prefixIndex = index;
return true;
}
});
// prefix vendor index
return prefixIndex;
};
export const fullscreenElement = () => {
const index = getPrefix();
return prefixes.fullscreenElement[index];
};
export const requestFullscreen = elem => {
const index = getPrefix();
const prefix = prefixes.requestFullscreen[index];
elem[prefix] && elem[prefix]();
};
export const exitFullscreen = () => {
const index = getPrefix();
const prefix = prefixes.exitFullscreen[index];
document[prefix] && document[prefix]();
};
export const onFullscreenChange = (event, callback) => {
const index = getPrefix();
const prefix = prefixes.fullscreenChange[index];
document[`${event}EventListener`](prefix, callback, false);
};