From 6a0e16885dc8cdea2b1455c0f5131c59134d743d Mon Sep 17 00:00:00 2001 From: Flo Date: Tue, 21 Mar 2017 20:56:11 +0100 Subject: [PATCH 1/7] Support full screen mode on iOS and enable "click to toggle fullscreen" in standard browsers --- css/main.css | 1 + index.html | 17 +++++- js/screenfull.js | 150 +++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 167 insertions(+), 1 deletion(-) create mode 100644 js/screenfull.js diff --git a/css/main.css b/css/main.css index 5e63e596..924ec4de 100644 --- a/css/main.css +++ b/css/main.css @@ -1,6 +1,7 @@ html { cursor: none; overflow: hidden; + background: #000; } ::-webkit-scrollbar { diff --git a/index.html b/index.html index 86a69a4a..edc63369 100644 --- a/index.html +++ b/index.html @@ -4,6 +4,12 @@ Magic Mirror + + + + + + @@ -12,8 +18,17 @@ + + + - +
diff --git a/js/screenfull.js b/js/screenfull.js new file mode 100644 index 00000000..de20b55e --- /dev/null +++ b/js/screenfull.js @@ -0,0 +1,150 @@ +/*! +* screenfull +* v3.0.2 - 2017-03-13 +* (c) Sindre Sorhus; MIT License +*/ +(function () { + 'use strict'; + + var isCommonjs = typeof module !== 'undefined' && module.exports; + var keyboardAllowed = typeof Element !== 'undefined' && 'ALLOW_KEYBOARD_INPUT' in Element; + + var fn = (function () { + var val; + + var fnMap = [ + [ + 'requestFullscreen', + 'exitFullscreen', + 'fullscreenElement', + 'fullscreenEnabled', + 'fullscreenchange', + 'fullscreenerror' + ], + // new WebKit + [ + 'webkitRequestFullscreen', + 'webkitExitFullscreen', + 'webkitFullscreenElement', + 'webkitFullscreenEnabled', + 'webkitfullscreenchange', + 'webkitfullscreenerror' + + ], + // old WebKit (Safari 5.1) + [ + 'webkitRequestFullScreen', + 'webkitCancelFullScreen', + 'webkitCurrentFullScreenElement', + 'webkitCancelFullScreen', + 'webkitfullscreenchange', + 'webkitfullscreenerror' + + ], + [ + 'mozRequestFullScreen', + 'mozCancelFullScreen', + 'mozFullScreenElement', + 'mozFullScreenEnabled', + 'mozfullscreenchange', + 'mozfullscreenerror' + ], + [ + 'msRequestFullscreen', + 'msExitFullscreen', + 'msFullscreenElement', + 'msFullscreenEnabled', + 'MSFullscreenChange', + 'MSFullscreenError' + ] + ]; + + var i = 0; + var l = fnMap.length; + var ret = {}; + + for (; i < l; i++) { + val = fnMap[i]; + if (val && val[1] in document) { + for (i = 0; i < val.length; i++) { + ret[fnMap[0][i]] = val[i]; + } + return ret; + } + } + + return false; + })(); + + var screenfull = { + request: function (elem) { + var request = fn.requestFullscreen; + + elem = elem || document.documentElement; + + // Work around Safari 5.1 bug: reports support for + // keyboard in fullscreen even though it doesn't. + // Browser sniffing, since the alternative with + // setTimeout is even worse. + if (/5\.1[.\d]* Safari/.test(navigator.userAgent)) { + elem[request](); + } else { + elem[request](keyboardAllowed && Element.ALLOW_KEYBOARD_INPUT); + } + }, + exit: function () { + document[fn.exitFullscreen](); + }, + toggle: function (elem) { + if (this.isFullscreen) { + this.exit(); + } else { + this.request(elem); + } + }, + onchange: function (callback) { + document.addEventListener(fn.fullscreenchange, callback, false); + }, + onerror: function (callback) { + document.addEventListener(fn.fullscreenerror, callback, false); + }, + raw: fn + }; + + if (!fn) { + if (isCommonjs) { + module.exports = false; + } else { + window.screenfull = false; + } + + return; + } + + Object.defineProperties(screenfull, { + isFullscreen: { + get: function () { + return Boolean(document[fn.fullscreenElement]); + } + }, + element: { + enumerable: true, + get: function () { + return document[fn.fullscreenElement]; + } + }, + enabled: { + enumerable: true, + get: function () { + // Coerce to boolean in case of old WebKit + return Boolean(document[fn.fullscreenEnabled]); + } + } + }); + + if (isCommonjs) { + module.exports = screenfull; + } else { + window.screenfull = screenfull; + } +})(); From 09c03e8ca7687aeea2d01b8cccd909b8cc5d6f32 Mon Sep 17 00:00:00 2001 From: Flo Date: Tue, 21 Mar 2017 20:56:11 +0100 Subject: [PATCH 2/7] Support full screen mode on iOS and enable "click to toggle fullscreen" in standard browsers --- css/main.css | 1 + index.html | 17 +++++- js/screenfull.js | 150 +++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 167 insertions(+), 1 deletion(-) create mode 100644 js/screenfull.js diff --git a/css/main.css b/css/main.css index 01d40aec..49bfe611 100644 --- a/css/main.css +++ b/css/main.css @@ -1,6 +1,7 @@ html { cursor: none; overflow: hidden; + background: #000; } ::-webkit-scrollbar { diff --git a/index.html b/index.html index 606f5aac..72326719 100644 --- a/index.html +++ b/index.html @@ -4,6 +4,12 @@ Magic Mirror + + + + + + @@ -12,8 +18,17 @@ + + + - +
diff --git a/js/screenfull.js b/js/screenfull.js new file mode 100644 index 00000000..de20b55e --- /dev/null +++ b/js/screenfull.js @@ -0,0 +1,150 @@ +/*! +* screenfull +* v3.0.2 - 2017-03-13 +* (c) Sindre Sorhus; MIT License +*/ +(function () { + 'use strict'; + + var isCommonjs = typeof module !== 'undefined' && module.exports; + var keyboardAllowed = typeof Element !== 'undefined' && 'ALLOW_KEYBOARD_INPUT' in Element; + + var fn = (function () { + var val; + + var fnMap = [ + [ + 'requestFullscreen', + 'exitFullscreen', + 'fullscreenElement', + 'fullscreenEnabled', + 'fullscreenchange', + 'fullscreenerror' + ], + // new WebKit + [ + 'webkitRequestFullscreen', + 'webkitExitFullscreen', + 'webkitFullscreenElement', + 'webkitFullscreenEnabled', + 'webkitfullscreenchange', + 'webkitfullscreenerror' + + ], + // old WebKit (Safari 5.1) + [ + 'webkitRequestFullScreen', + 'webkitCancelFullScreen', + 'webkitCurrentFullScreenElement', + 'webkitCancelFullScreen', + 'webkitfullscreenchange', + 'webkitfullscreenerror' + + ], + [ + 'mozRequestFullScreen', + 'mozCancelFullScreen', + 'mozFullScreenElement', + 'mozFullScreenEnabled', + 'mozfullscreenchange', + 'mozfullscreenerror' + ], + [ + 'msRequestFullscreen', + 'msExitFullscreen', + 'msFullscreenElement', + 'msFullscreenEnabled', + 'MSFullscreenChange', + 'MSFullscreenError' + ] + ]; + + var i = 0; + var l = fnMap.length; + var ret = {}; + + for (; i < l; i++) { + val = fnMap[i]; + if (val && val[1] in document) { + for (i = 0; i < val.length; i++) { + ret[fnMap[0][i]] = val[i]; + } + return ret; + } + } + + return false; + })(); + + var screenfull = { + request: function (elem) { + var request = fn.requestFullscreen; + + elem = elem || document.documentElement; + + // Work around Safari 5.1 bug: reports support for + // keyboard in fullscreen even though it doesn't. + // Browser sniffing, since the alternative with + // setTimeout is even worse. + if (/5\.1[.\d]* Safari/.test(navigator.userAgent)) { + elem[request](); + } else { + elem[request](keyboardAllowed && Element.ALLOW_KEYBOARD_INPUT); + } + }, + exit: function () { + document[fn.exitFullscreen](); + }, + toggle: function (elem) { + if (this.isFullscreen) { + this.exit(); + } else { + this.request(elem); + } + }, + onchange: function (callback) { + document.addEventListener(fn.fullscreenchange, callback, false); + }, + onerror: function (callback) { + document.addEventListener(fn.fullscreenerror, callback, false); + }, + raw: fn + }; + + if (!fn) { + if (isCommonjs) { + module.exports = false; + } else { + window.screenfull = false; + } + + return; + } + + Object.defineProperties(screenfull, { + isFullscreen: { + get: function () { + return Boolean(document[fn.fullscreenElement]); + } + }, + element: { + enumerable: true, + get: function () { + return document[fn.fullscreenElement]; + } + }, + enabled: { + enumerable: true, + get: function () { + // Coerce to boolean in case of old WebKit + return Boolean(document[fn.fullscreenEnabled]); + } + } + }); + + if (isCommonjs) { + module.exports = screenfull; + } else { + window.screenfull = screenfull; + } +})(); From 8b9c274fdd7ce18102b3b560deb244e15cae4b17 Mon Sep 17 00:00:00 2001 From: Flo Date: Wed, 22 Mar 2017 22:27:19 +0100 Subject: [PATCH 3/7] Moved scripts to bottom in index.html --- index.html | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/index.html b/index.html index 72326719..e2ad7acb 100644 --- a/index.html +++ b/index.html @@ -18,15 +18,6 @@ - - -
@@ -59,5 +50,14 @@ + + + From becb9fc43e36c30e89a3a6c4ab307490b9d4fc4f Mon Sep 17 00:00:00 2001 From: Flo Date: Wed, 22 Mar 2017 22:27:47 +0100 Subject: [PATCH 4/7] Updated CHANGELOG --- CHANGELOG.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 7fe62971..2f7d7974 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -55,6 +55,8 @@ This project adheres to [Semantic Versioning](http://semver.org/). - Added hideLoading option for News Feed module - Added configurable dateFormat to clock module. - Added multiple calendar icon support. +- Added meta tags to support fullscreen mode on iOS (for server mode) +- Added fullscreen toggle: within browser, clicking on the page turns it into fullscreen ### Fixed - Update .gitignore to not ignore default modules folder. From af0f1939a3e1c9ed135217e7433bb9d383d20249 Mon Sep 17 00:00:00 2001 From: Flo Date: Wed, 22 Mar 2017 22:28:51 +0100 Subject: [PATCH 5/7] Fixed lint errors --- js/screenfull.js | 68 ++++++++++++++++++++++++------------------------ 1 file changed, 34 insertions(+), 34 deletions(-) diff --git a/js/screenfull.js b/js/screenfull.js index de20b55e..f0818493 100644 --- a/js/screenfull.js +++ b/js/screenfull.js @@ -4,58 +4,58 @@ * (c) Sindre Sorhus; MIT License */ (function () { - 'use strict'; + "use strict"; - var isCommonjs = typeof module !== 'undefined' && module.exports; - var keyboardAllowed = typeof Element !== 'undefined' && 'ALLOW_KEYBOARD_INPUT' in Element; + var isCommonjs = typeof module !== "undefined" && module.exports; + var keyboardAllowed = typeof Element !== "undefined" && "ALLOW_KEYBOARD_INPUT" in Element; var fn = (function () { var val; var fnMap = [ [ - 'requestFullscreen', - 'exitFullscreen', - 'fullscreenElement', - 'fullscreenEnabled', - 'fullscreenchange', - 'fullscreenerror' + "requestFullscreen", + "exitFullscreen", + "fullscreenElement", + "fullscreenEnabled", + "fullscreenchange", + "fullscreenerror" ], // new WebKit [ - 'webkitRequestFullscreen', - 'webkitExitFullscreen', - 'webkitFullscreenElement', - 'webkitFullscreenEnabled', - 'webkitfullscreenchange', - 'webkitfullscreenerror' + "webkitRequestFullscreen", + "webkitExitFullscreen", + "webkitFullscreenElement", + "webkitFullscreenEnabled", + "webkitfullscreenchange", + "webkitfullscreenerror" ], // old WebKit (Safari 5.1) [ - 'webkitRequestFullScreen', - 'webkitCancelFullScreen', - 'webkitCurrentFullScreenElement', - 'webkitCancelFullScreen', - 'webkitfullscreenchange', - 'webkitfullscreenerror' + "webkitRequestFullScreen", + "webkitCancelFullScreen", + "webkitCurrentFullScreenElement", + "webkitCancelFullScreen", + "webkitfullscreenchange", + "webkitfullscreenerror" ], [ - 'mozRequestFullScreen', - 'mozCancelFullScreen', - 'mozFullScreenElement', - 'mozFullScreenEnabled', - 'mozfullscreenchange', - 'mozfullscreenerror' + "mozRequestFullScreen", + "mozCancelFullScreen", + "mozFullScreenElement", + "mozFullScreenEnabled", + "mozfullscreenchange", + "mozfullscreenerror" ], [ - 'msRequestFullscreen', - 'msExitFullscreen', - 'msFullscreenElement', - 'msFullscreenEnabled', - 'MSFullscreenChange', - 'MSFullscreenError' + "msRequestFullscreen", + "msExitFullscreen", + "msFullscreenElement", + "msFullscreenEnabled", + "MSFullscreenChange", + "MSFullscreenError" ] ]; @@ -83,7 +83,7 @@ elem = elem || document.documentElement; // Work around Safari 5.1 bug: reports support for - // keyboard in fullscreen even though it doesn't. + // keyboard in fullscreen even though it doesn"t. // Browser sniffing, since the alternative with // setTimeout is even worse. if (/5\.1[.\d]* Safari/.test(navigator.userAgent)) { From b39113f0aefcb825b90305b98150f02d83ad89db Mon Sep 17 00:00:00 2001 From: Flo Date: Fri, 24 Mar 2017 23:10:05 +0100 Subject: [PATCH 6/7] Removed fullscreen toggle; is now own, configurable module --- index.html | 11 +--- js/screenfull.js | 150 ----------------------------------------------- 2 files changed, 1 insertion(+), 160 deletions(-) delete mode 100644 js/screenfull.js diff --git a/index.html b/index.html index e2ad7acb..85951a85 100644 --- a/index.html +++ b/index.html @@ -19,7 +19,7 @@ var version = "#VERSION#"; - +
@@ -50,14 +50,5 @@ - - - diff --git a/js/screenfull.js b/js/screenfull.js deleted file mode 100644 index f0818493..00000000 --- a/js/screenfull.js +++ /dev/null @@ -1,150 +0,0 @@ -/*! -* screenfull -* v3.0.2 - 2017-03-13 -* (c) Sindre Sorhus; MIT License -*/ -(function () { - "use strict"; - - var isCommonjs = typeof module !== "undefined" && module.exports; - var keyboardAllowed = typeof Element !== "undefined" && "ALLOW_KEYBOARD_INPUT" in Element; - - var fn = (function () { - var val; - - var fnMap = [ - [ - "requestFullscreen", - "exitFullscreen", - "fullscreenElement", - "fullscreenEnabled", - "fullscreenchange", - "fullscreenerror" - ], - // new WebKit - [ - "webkitRequestFullscreen", - "webkitExitFullscreen", - "webkitFullscreenElement", - "webkitFullscreenEnabled", - "webkitfullscreenchange", - "webkitfullscreenerror" - - ], - // old WebKit (Safari 5.1) - [ - "webkitRequestFullScreen", - "webkitCancelFullScreen", - "webkitCurrentFullScreenElement", - "webkitCancelFullScreen", - "webkitfullscreenchange", - "webkitfullscreenerror" - - ], - [ - "mozRequestFullScreen", - "mozCancelFullScreen", - "mozFullScreenElement", - "mozFullScreenEnabled", - "mozfullscreenchange", - "mozfullscreenerror" - ], - [ - "msRequestFullscreen", - "msExitFullscreen", - "msFullscreenElement", - "msFullscreenEnabled", - "MSFullscreenChange", - "MSFullscreenError" - ] - ]; - - var i = 0; - var l = fnMap.length; - var ret = {}; - - for (; i < l; i++) { - val = fnMap[i]; - if (val && val[1] in document) { - for (i = 0; i < val.length; i++) { - ret[fnMap[0][i]] = val[i]; - } - return ret; - } - } - - return false; - })(); - - var screenfull = { - request: function (elem) { - var request = fn.requestFullscreen; - - elem = elem || document.documentElement; - - // Work around Safari 5.1 bug: reports support for - // keyboard in fullscreen even though it doesn"t. - // Browser sniffing, since the alternative with - // setTimeout is even worse. - if (/5\.1[.\d]* Safari/.test(navigator.userAgent)) { - elem[request](); - } else { - elem[request](keyboardAllowed && Element.ALLOW_KEYBOARD_INPUT); - } - }, - exit: function () { - document[fn.exitFullscreen](); - }, - toggle: function (elem) { - if (this.isFullscreen) { - this.exit(); - } else { - this.request(elem); - } - }, - onchange: function (callback) { - document.addEventListener(fn.fullscreenchange, callback, false); - }, - onerror: function (callback) { - document.addEventListener(fn.fullscreenerror, callback, false); - }, - raw: fn - }; - - if (!fn) { - if (isCommonjs) { - module.exports = false; - } else { - window.screenfull = false; - } - - return; - } - - Object.defineProperties(screenfull, { - isFullscreen: { - get: function () { - return Boolean(document[fn.fullscreenElement]); - } - }, - element: { - enumerable: true, - get: function () { - return document[fn.fullscreenElement]; - } - }, - enabled: { - enumerable: true, - get: function () { - // Coerce to boolean in case of old WebKit - return Boolean(document[fn.fullscreenEnabled]); - } - } - }); - - if (isCommonjs) { - module.exports = screenfull; - } else { - window.screenfull = screenfull; - } -})(); From 455819566b78dc6cf7c4d1947a62dfb1c9b74f9f Mon Sep 17 00:00:00 2001 From: Flo Date: Fri, 24 Mar 2017 23:13:08 +0100 Subject: [PATCH 7/7] Update CHANGELOG.md --- CHANGELOG.md | 1 - 1 file changed, 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 2f7d7974..53b534f6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -56,7 +56,6 @@ This project adheres to [Semantic Versioning](http://semver.org/). - Added configurable dateFormat to clock module. - Added multiple calendar icon support. - Added meta tags to support fullscreen mode on iOS (for server mode) -- Added fullscreen toggle: within browser, clicking on the page turns it into fullscreen ### Fixed - Update .gitignore to not ignore default modules folder.