Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
screenfull
Advanced tools
screenfull - npm Package Compare versions
Comparing version 5.0.2 to 5.1.0
@@ -51,2 +51,3 @@ /// <reference lib="dom"/> | ||
| @param element - Default is `<html>`. If called with another element than the currently active, it will switch to that if it's a decendant. | ||
| @param options - [`FullscreenOptions`](https://developer.mozilla.org/en-US/docs/Web/API/FullscreenOptions). | ||
| @returns A promise that resolves after the element enters fullscreen. | ||
@@ -74,2 +75,11 @@ | ||
| // 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 | ||
@@ -85,3 +95,3 @@ const element = $('#target')[0]; // Get DOM element from jQuery collection | ||
| */ | ||
| request(element?: Element): Promise<void>; | ||
| request(element?: Element, options?: FullscreenOptions): Promise<void>; | ||
@@ -98,2 +108,4 @@ /** | ||
| @param element - Default is `<html>`. If called with another element than the currently active, it will switch to that if it's a decendant. | ||
| @param options - [`FullscreenOptions`](https://developer.mozilla.org/en-US/docs/Web/API/FullscreenOptions). | ||
| @returns A promise that resolves after the element enters/exits fullscreen. | ||
@@ -112,3 +124,3 @@ | ||
| */ | ||
| toggle(element?: Element): Promise<void>; | ||
| toggle(element?: Element, options?: FullscreenOptions): Promise<void>; | ||
@@ -115,0 +127,0 @@ /** |
| /*! | ||
| * screenfull | ||
| * v5.0.2 - 2020-02-13 | ||
| * v5.1.0 - 2020-12-24 | ||
| * (c) Sindre Sorhus; MIT License | ||
@@ -85,3 +85,3 @@ */ | ||
| var screenfull = { | ||
| request: function (element) { | ||
| request: function (element, options) { | ||
| return new Promise(function (resolve, reject) { | ||
@@ -97,3 +97,3 @@ var onFullScreenEntered = function () { | ||
| var returnPromise = element[fn.requestFullscreen](); | ||
| var returnPromise = element[fn.requestFullscreen](options); | ||
@@ -126,4 +126,4 @@ if (returnPromise instanceof Promise) { | ||
| }, | ||
| toggle: function (element) { | ||
| return this.isFullscreen ? this.exit() : this.request(element); | ||
| toggle: function (element, options) { | ||
| return this.isFullscreen ? this.exit() : this.request(element, options); | ||
| }, | ||
@@ -130,0 +130,0 @@ onchange: function (callback) { |
| { | ||
| "name": "screenfull", | ||
| "version": "5.0.2", | ||
| "version": "5.1.0", | ||
| "description": "Simple wrapper for cross-browser usage of the JavaScript Fullscreen API, which lets you bring the page or any element into fullscreen.", | ||
@@ -5,0 +5,0 @@ "license": "MIT", |
@@ -9,31 +9,2 @@ # screenfull.js | ||
| <br> | ||
| --- | ||
| <div align="center"> | ||
| <p> | ||
| <p> | ||
| <sup> | ||
| <a href="https://github.com/sponsors/sindresorhus">My open source work is supported by the community</a> | ||
| </sup> | ||
| </p> | ||
| <sup>Special thanks to:</sup> | ||
| <br> | ||
| <br> | ||
| <a href="https://github.com/botpress/botpress"> | ||
| <img src="https://sindresorhus.com/assets/thanks/botpress-logo.svg" width="260" alt="Botpress"> | ||
| </a> | ||
| <br> | ||
| <sub><b>Botpress is an open-source conversational assistant creation platform.</b></sub> | ||
| <br> | ||
| <sub>They <a href="https://github.com/botpress/botpress/blob/master/.github/CONTRIBUTING.md">welcome contributions</a> from anyone, whether you're into machine learning,<br>want to get started in open-source, or just have an improvement idea.</sub> | ||
| <br> | ||
| </p> | ||
| </div> | ||
| --- | ||
| <br> | ||
| ## Install | ||
@@ -91,3 +62,3 @@ | ||
| [Supported browsers](http://caniuse.com/fullscreen) | ||
| [Supported browsers](https://caniuse.com/#feat=fullscreen) | ||
@@ -126,2 +97,14 @@ **Note:** In order to use this package in Internet Explorer, you need a [`Promise` polyfill](https://github.com/stefanpenner/es6-promise). | ||
| #### Hide navigation user-interface on mobile devices | ||
| ```js | ||
| const element = document.getElementById('target'); | ||
| document.getElementById('button').addEventListener('click', () => { | ||
| if (screenfull.isEnabled) { | ||
| screenfull.request(element, {navigationUI: 'hide'}); | ||
| } | ||
| }); | ||
| ``` | ||
| #### Fullscreen an element with jQuery | ||
@@ -212,8 +195,10 @@ | ||
| #### .request() | ||
| #### .request(element, options?) | ||
| Make an element fullscreen. | ||
| Accepts a DOM element. Default is `<html>`. If called with another element than the currently active, it will switch to that if it's a decendant. | ||
| Accepts a DOM element and [`FullscreenOptions`](https://developer.mozilla.org/en-US/docs/Web/API/FullscreenOptions). | ||
| The default element is `<html>`. If called with another element than the currently active, it will switch to that if it's a decendant. | ||
| If your page is inside an `<iframe>` you will need to add a `allowfullscreen` attribute (+ `webkitallowfullscreen` and `mozallowfullscreen`). | ||
@@ -231,6 +216,8 @@ | ||
| #### .toggle() | ||
| #### .toggle(element, options?) | ||
| Requests fullscreen if not active, otherwise exits. | ||
| Accepts a DOM element and [`FullscreenOptions`](https://developer.mozilla.org/en-US/docs/Web/API/FullscreenOptions). | ||
| Returns a promise that resolves after the element enters/exits fullscreen. | ||
@@ -283,3 +270,3 @@ | ||
| iframe.setAttribute('id', 'external-iframe'); | ||
| iframe.setAttribute('src', 'http://new-page-website.com'); | ||
| iframe.setAttribute('src', 'https://new-page-website.com'); | ||
| iframe.setAttribute('frameborder', 'no'); | ||
@@ -301,5 +288,5 @@ iframe.style.position = 'absolute'; | ||
| - [Using the Fullscreen API in web browsers](http://hacks.mozilla.org/2012/01/using-the-fullscreen-api-in-web-browsers/) | ||
| - [Using the Fullscreen API in web browsers](https://hacks.mozilla.org/2012/01/using-the-fullscreen-api-in-web-browsers/) | ||
| - [MDN - Fullscreen API](https://developer.mozilla.org/en/DOM/Using_full-screen_mode) | ||
| - [W3C Fullscreen spec](http://dvcs.w3.org/hg/fullscreen/raw-file/tip/Overview.html) | ||
| - [Building an amazing fullscreen mobile experience](http://www.html5rocks.com/en/mobile/fullscreen/) | ||
| - [W3C Fullscreen spec](https://fullscreen.spec.whatwg.org/) | ||
| - [Building an amazing fullscreen mobile experience](https://developers.google.com/web/fundamentals/native-hardware/fullscreen/) |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by2.83%
18109
- Lines of code
- increased by3.44%
301
Worsened metrics
- Number of lines in readme file
- decreased by-4.35%
286
No dependency changes