From 52e9188b55993a39288a5af3ed8a26fe8b2b9b08 Mon Sep 17 00:00:00 2001 From: Miquel Company Rodriguez Date: Tue, 6 Jun 2017 13:35:17 +0200 Subject: [PATCH 1/5] Go to fullscreen when f key is pressed --- src/js/modules/webslides.js | 26 ++++++++++++++++++++++++++ src/js/plugins/keyboard.js | 3 +++ src/js/utils/keys.js | 3 ++- 3 files changed, 31 insertions(+), 1 deletion(-) diff --git a/src/js/modules/webslides.js b/src/js/modules/webslides.js index 20b1fbc..0dc241d 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.mozFullScreen + || document.webkitIsFullScreen + || document.msFullScreenElement; + + if(!isFullscreen) { + const requestFullscreen = el.requestFullscreen + || el.webkitRequestFullScreen + || el.mozRequestFullScreen + || el.msRequestFullscreen; + requestFullscreen.call(el); + } else { + const cancelFullscreen = document.exitFullScreen + || document.mozCancelFullScreen + || document.webkitCancelFullScreen + || 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; From 6f79bce0de14a3b64f31fd1078d4f3ecffbb0dba Mon Sep 17 00:00:00 2001 From: Miquel Company Rodriguez Date: Tue, 6 Jun 2017 15:52:47 +0200 Subject: [PATCH 2/5] Add keyboard test --- test/plugins/keyboard.test.js | 4 ++++ 1 file changed, 4 insertions(+) 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); }); From 504ad99df92d83d3b04060869759c36fc16fa604 Mon Sep 17 00:00:00 2001 From: Miquel Company Rodriguez Date: Tue, 6 Jun 2017 16:09:23 +0200 Subject: [PATCH 3/5] Standarize the order of the prefixed --- src/js/modules/webslides.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/js/modules/webslides.js b/src/js/modules/webslides.js index 0dc241d..19df7e0 100644 --- a/src/js/modules/webslides.js +++ b/src/js/modules/webslides.js @@ -423,8 +423,8 @@ export default class WebSlides { fullscreen() { const el = document.documentElement; const isFullscreen = document.fullscreen - || document.mozFullScreen || document.webkitIsFullScreen + || document.mozFullScreen || document.msFullScreenElement; if(!isFullscreen) { @@ -435,8 +435,8 @@ export default class WebSlides { requestFullscreen.call(el); } else { const cancelFullscreen = document.exitFullScreen - || document.mozCancelFullScreen || document.webkitCancelFullScreen + || document.mozCancelFullScreen || document.msExitFullscreen; cancelFullscreen.call(document); From af13de6696a2b93cc955ad1a5b47092909d7908d Mon Sep 17 00:00:00 2001 From: Miquel Company Rodriguez Date: Tue, 6 Jun 2017 16:26:40 +0200 Subject: [PATCH 4/5] Add tests to fullscreen function --- test/modules/webslides.test.js | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/test/modules/webslides.test.js b/test/modules/webslides.test.js index 96db655..cd50aa2 100644 --- a/test/modules/webslides.test.js +++ b/test/modules/webslides.test.js @@ -72,4 +72,15 @@ test('WebSlides utility', () => { expect(webslides.isDisabled()).toBe(true); webslides.enable(); expect(webslides.isDisabled()).toBe(false); + + const requestFullscreenMock = jest.fn(); + const exitFullScreenMock = jest.fn(); + document.fullscreen = false; + document.documentElement.requestFullscreen = requestFullscreenMock; + document.exitFullScreen = exitFullScreenMock; + webslides.fullscreen(); + expect(requestFullscreenMock.mock.calls.length).toBe(1); + document.fullscreen = true; + webslides.fullscreen(); + expect(exitFullScreenMock.mock.calls.length).toBe(1); }); From 18662f38f67e29c1d0b529ab13363e4d8d224720 Mon Sep 17 00:00:00 2001 From: Miquel Company Rodriguez Date: Tue, 6 Jun 2017 16:30:19 +0200 Subject: [PATCH 5/5] Cleaner fullscreen function test --- test/modules/webslides.test.js | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/test/modules/webslides.test.js b/test/modules/webslides.test.js index cd50aa2..29dced6 100644 --- a/test/modules/webslides.test.js +++ b/test/modules/webslides.test.js @@ -73,14 +73,13 @@ test('WebSlides utility', () => { webslides.enable(); expect(webslides.isDisabled()).toBe(false); - const requestFullscreenMock = jest.fn(); - const exitFullScreenMock = jest.fn(); + document.fullscreen = false; - document.documentElement.requestFullscreen = requestFullscreenMock; - document.exitFullScreen = exitFullScreenMock; + document.documentElement.requestFullscreen = jest.fn(); + document.exitFullScreen = jest.fn(); webslides.fullscreen(); - expect(requestFullscreenMock.mock.calls.length).toBe(1); + expect(document.documentElement.requestFullscreen.mock.calls.length).toBe(1); document.fullscreen = true; webslides.fullscreen(); - expect(exitFullScreenMock.mock.calls.length).toBe(1); + expect(document.exitFullScreen.mock.calls.length).toBe(1); });