diff --git a/src/js/modules/webslides.js b/src/js/modules/webslides.js index 20b1fbc..19df7e0 100644 --- a/src/js/modules/webslides.js +++ b/src/js/modules/webslides.js @@ -417,6 +417,32 @@ export default class WebSlides { return this.el.classList.contains(CLASSES.DISABLED); } + /** + * Puts the browser into fullscreen + */ + fullscreen() { + const el = document.documentElement; + const isFullscreen = document.fullscreen + || document.webkitIsFullScreen + || document.mozFullScreen + || document.msFullScreenElement; + + if(!isFullscreen) { + const requestFullscreen = el.requestFullscreen + || el.webkitRequestFullScreen + || el.mozRequestFullScreen + || el.msRequestFullscreen; + requestFullscreen.call(el); + } else { + const cancelFullscreen = document.exitFullScreen + || document.webkitCancelFullScreen + || document.mozCancelFullScreen + || document.msExitFullscreen; + + cancelFullscreen.call(document); + } + } + /** * Registers a plugin to be loaded when the instance is created. It allows * (on purpose) to replace default plugins. diff --git a/src/js/plugins/keyboard.js b/src/js/plugins/keyboard.js index 46f9882..39a995a 100644 --- a/src/js/plugins/keyboard.js +++ b/src/js/plugins/keyboard.js @@ -61,6 +61,9 @@ export default class Keyboard { case Keys.RIGHT: method = !this.ws_.isVertical ? this.ws_.goNext : null; break; + case Keys.F: + method = this.ws_.fullscreen; + break; } if (method) { diff --git a/src/js/utils/keys.js b/src/js/utils/keys.js index 5a27e76..19a80d8 100644 --- a/src/js/utils/keys.js +++ b/src/js/utils/keys.js @@ -11,7 +11,8 @@ const Keys = { DOWN: 40, PLUS: [107, 171], MINUS: [109, 173], - ESCAPE: 27 + ESCAPE: 27, + F: 70 }; export default Keys; diff --git a/test/modules/webslides.test.js b/test/modules/webslides.test.js index 96db655..29dced6 100644 --- a/test/modules/webslides.test.js +++ b/test/modules/webslides.test.js @@ -72,4 +72,14 @@ test('WebSlides utility', () => { expect(webslides.isDisabled()).toBe(true); webslides.enable(); expect(webslides.isDisabled()).toBe(false); + + + document.fullscreen = false; + document.documentElement.requestFullscreen = jest.fn(); + document.exitFullScreen = jest.fn(); + webslides.fullscreen(); + expect(document.documentElement.requestFullscreen.mock.calls.length).toBe(1); + document.fullscreen = true; + webslides.fullscreen(); + expect(document.exitFullScreen.mock.calls.length).toBe(1); }); diff --git a/test/plugins/keyboard.test.js b/test/plugins/keyboard.test.js index 0aa1d9b..e5bcb41 100644 --- a/test/plugins/keyboard.test.js +++ b/test/plugins/keyboard.test.js @@ -22,6 +22,7 @@ test('Keyboard plugin', () => { const goto = jest.fn(); const next = jest.fn(); const prev = jest.fn(); + const fullscreen = jest.fn(); const ws = document.getElementById('webslides'); let disabled = true; @@ -31,6 +32,7 @@ test('Keyboard plugin', () => { goNext: next, goPrev: prev, isVertical: false, + fullscreen: fullscreen, isDisabled: () => disabled, el: ws }; @@ -61,4 +63,6 @@ test('Keyboard plugin', () => { expect(prev.mock.calls.length).toBe(2); simulateKeyEvent(document, Keys.RIGHT); expect(next.mock.calls.length).toBe(3); + simulateKeyEvent(document, Keys.F); + expect(fullscreen.mock.calls.length).toBe(1); });