Skip to content

Commit

Permalink
Add screenfull v6.0.2
Browse files Browse the repository at this point in the history
  • Loading branch information
officialxviid committed Mar 3, 2023
1 parent cb7baeb commit cb4c5ab
Show file tree
Hide file tree
Showing 4 changed files with 647 additions and 0 deletions.
175 changes: 175 additions & 0 deletions vendors/screenfull/6.0.2/js/index.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,175 @@
export type RawEventNames = {
readonly requestFullscreen: string;
readonly exitFullscreen: string;
readonly fullscreenElement: string;
readonly fullscreenEnabled: string;
readonly fullscreenchange: string;
readonly fullscreenerror: string;
};

export type EventName = 'change' | 'error';

/**
Simple wrapper for cross-browser usage of the JavaScript [Fullscreen API](https://developer.mozilla.org/en/DOM/Using_full-screen_mode), which lets you bring the page or any element into fullscreen. Smoothens out the browser implementation differences, so you don't have to.
*/
declare const screenfull: {
/**
Whether fullscreen is active.
*/
readonly isFullscreen: boolean;

/**
The element currently in fullscreen, otherwise `undefined`.
*/
readonly element: Element | undefined;

/**
Whether you are allowed to enter fullscreen. If your page is inside an `<iframe>` you will need to add a `allowfullscreen` attribute (+ `webkitallowfullscreen` and `mozallowfullscreen`).
@example
```
import screenfull from 'screenfull';
if (screenfull.isEnabled) {
screenfull.request();
}
```
*/
readonly isEnabled: boolean;

/**
Exposes the raw properties (prefixed if needed) used internally.
*/
raw: RawEventNames;

/**
Make an element fullscreen.
If your page is inside an `<iframe>` you will need to add a `allowfullscreen` attribute (+ `webkitallowfullscreen` and `mozallowfullscreen`).
Keep in mind that the browser will only enter fullscreen when initiated by user events like click, touch, key.
@param element - Default is `<html>`. If called with another element than the currently active, it will switch to that if it's a descendant.
@param options - [`FullscreenOptions`](https://developer.mozilla.org/en-US/docs/Web/API/FullscreenOptions).
@returns A promise that resolves after the element enters fullscreen.
@example
```
import screenfull from 'screenfull';
// Fullscreen the page
document.getElementById('button').addEventListener('click', () => {
if (screenfull.isEnabled) {
screenfull.request();
} else {
// Ignore or do something else
}
});
// Fullscreen an element
const element = document.getElementById('target');
document.getElementById('button').addEventListener('click', () => {
if (screenfull.isEnabled) {
screenfull.request(element);
}
});
// Fullscreen an element with options
const element = document.getElementById('target');
document.getElementById('button').addEventListener('click', () => {
if (screenfull.isEnabled) {
screenfull.request(element, {navigationUI: 'hide'});
}
});
// Fullscreen an element with jQuery
const element = $('#target')[0]; // Get DOM element from jQuery collection
$('#button').on('click', () => {
if (screenfull.isEnabled) {
screenfull.request(element);
}
});
```
*/
request(element?: Element, options?: FullscreenOptions): Promise<void>;

/**
Brings you out of fullscreen.
@returns A promise that resolves after the element exits fullscreen.
*/
exit(): Promise<void>;

/**
Requests fullscreen if not active, otherwise exits.
@param element - The default is `<html>`. If called with another element than the currently active, it will switch to that if it's a descendant.
@param options - [`FullscreenOptions`](https://developer.mozilla.org/en-US/docs/Web/API/FullscreenOptions).
@returns A promise that resolves after the element enters/exits fullscreen.
@example
```
import screenfull from 'screenfull';
// Toggle fullscreen on a image with jQuery
$('img').on('click', event => {
if (screenfull.isEnabled) {
screenfull.toggle(event.target);
}
});
```
*/
toggle(element?: Element, options?: FullscreenOptions): Promise<void>;

/**
Add a listener for when the browser switches in and out of fullscreen or when there is an error.
@example
```
import screenfull from 'screenfull';
// Detect fullscreen change
if (screenfull.isEnabled) {
screenfull.on('change', () => {
console.log('Am I fullscreen?', screenfull.isFullscreen ? 'Yes' : 'No');
});
}
// Detect fullscreen error
if (screenfull.isEnabled) {
screenfull.on('error', event => {
console.error('Failed to enable fullscreen', event);
});
}
```
*/
on(name: EventName, handler: (event: Event) => void): void;

/**
Remove a previously registered event listener.
@example
```
import screenfull from 'screenfull';
screenfull.off('change', callback);
```
*/
off(name: EventName, handler: (event: Event) => void): void;

/**
Alias for `.on('change', function)`.
*/
onchange(handler: (event: Event) => void): void;

/**
Alias for `.on('error', function)`.
*/
onerror(handler: (event: Event) => void): void;
};

export default screenfull;
160 changes: 160 additions & 0 deletions vendors/screenfull/6.0.2/js/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,160 @@
/* eslint-disable promise/prefer-await-to-then */

const methodMap = [
[
'requestFullscreen',
'exitFullscreen',
'fullscreenElement',
'fullscreenEnabled',
'fullscreenchange',
'fullscreenerror',
],
// New WebKit
[
'webkitRequestFullscreen',
'webkitExitFullscreen',
'webkitFullscreenElement',
'webkitFullscreenEnabled',
'webkitfullscreenchange',
'webkitfullscreenerror',

],
// Old WebKit
[
'webkitRequestFullScreen',
'webkitCancelFullScreen',
'webkitCurrentFullScreenElement',
'webkitCancelFullScreen',
'webkitfullscreenchange',
'webkitfullscreenerror',

],
[
'mozRequestFullScreen',
'mozCancelFullScreen',
'mozFullScreenElement',
'mozFullScreenEnabled',
'mozfullscreenchange',
'mozfullscreenerror',
],
[
'msRequestFullscreen',
'msExitFullscreen',
'msFullscreenElement',
'msFullscreenEnabled',
'MSFullscreenChange',
'MSFullscreenError',
],
];

const nativeAPI = (() => {
if (typeof document === 'undefined') {
return false;
}

const unprefixedMethods = methodMap[0];
const returnValue = {};

for (const methodList of methodMap) {
const exitFullscreenMethod = methodList?.[1];
if (exitFullscreenMethod in document) {
for (const [index, method] of methodList.entries()) {
returnValue[unprefixedMethods[index]] = method;
}

return returnValue;
}
}

return false;
})();

const eventNameMap = {
change: nativeAPI.fullscreenchange,
error: nativeAPI.fullscreenerror,
};

// eslint-disable-next-line import/no-mutable-exports
let screenfull = {
// eslint-disable-next-line default-param-last
request(element = document.documentElement, options) {
return new Promise((resolve, reject) => {
const onFullScreenEntered = () => {
screenfull.off('change', onFullScreenEntered);
resolve();
};

screenfull.on('change', onFullScreenEntered);

const returnPromise = element[nativeAPI.requestFullscreen](options);

if (returnPromise instanceof Promise) {
returnPromise.then(onFullScreenEntered).catch(reject);
}
});
},
exit() {
return new Promise((resolve, reject) => {
if (!screenfull.isFullscreen) {
resolve();
return;
}

const onFullScreenExit = () => {
screenfull.off('change', onFullScreenExit);
resolve();
};

screenfull.on('change', onFullScreenExit);

const returnPromise = document[nativeAPI.exitFullscreen]();

if (returnPromise instanceof Promise) {
returnPromise.then(onFullScreenExit).catch(reject);
}
});
},
toggle(element, options) {
return screenfull.isFullscreen ? screenfull.exit() : screenfull.request(element, options);
},
onchange(callback) {
screenfull.on('change', callback);
},
onerror(callback) {
screenfull.on('error', callback);
},
on(event, callback) {
const eventName = eventNameMap[event];
if (eventName) {
document.addEventListener(eventName, callback, false);
}
},
off(event, callback) {
const eventName = eventNameMap[event];
if (eventName) {
document.removeEventListener(eventName, callback, false);
}
},
raw: nativeAPI,
};

Object.defineProperties(screenfull, {
isFullscreen: {
get: () => Boolean(document[nativeAPI.fullscreenElement]),
},
element: {
enumerable: true,
get: () => document[nativeAPI.fullscreenElement] ?? undefined,
},
isEnabled: {
enumerable: true,
// Coerce to boolean in case of old WebKit.
get: () => Boolean(document[nativeAPI.fullscreenEnabled]),
},
});

if (!nativeAPI) {
screenfull = {isEnabled: false};
}

export default screenfull;
9 changes: 9 additions & 0 deletions vendors/screenfull/LICENSE
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
MIT License

Copyright (c) Sindre Sorhus <sindresorhus@gmail.com> (https://sindresorhus.com)

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
Loading

0 comments on commit cb4c5ab

Please sign in to comment.