diff --git a/index.html b/index.html index 0dfaff6..661b1d3 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,8 @@
-

Slideshow

+

Slideshow

+

Slideshow (No Sleep)

diff --git a/slideshow/index.html b/slideshow/index.html index 45c7b74..8081d15 100644 --- a/slideshow/index.html +++ b/slideshow/index.html @@ -21,7 +21,7 @@ - + \ No newline at end of file diff --git a/slideshow/scripts/index.js b/slideshow/scripts/index.js index bfa8a25..b18b7ee 100644 --- a/slideshow/scripts/index.js +++ b/slideshow/scripts/index.js @@ -249,4 +249,40 @@ } } + // Create the root video element + var video = document.createElement('video'); + video.setAttribute('loop', ''); + // Add some styles if needed + video.setAttribute('style', 'position: fixed;'); + + // A helper to add sources to video + function addSourceToVideo(element, type, dataURI) { + var source = document.createElement('source'); + source.src = dataURI; + source.type = 'video/' + type; + element.appendChild(source); + } + + // A helper to concat base64 + var base64 = function (mimeType, base64) { + return 'data:' + mimeType + ';base64,' + base64; + }; + + if (window.location.href.indexOf('noSleep') > 0) { + // Add Fake sourced + addSourceToVideo(video, 'webm', base64('video/webm', 'GkXfo0AgQoaBAUL3gQFC8oEEQvOBCEKCQAR3ZWJtQoeBAkKFgQIYU4BnQI0VSalmQCgq17FAAw9CQE2AQAZ3aGFtbXlXQUAGd2hhbW15RIlACECPQAAAAAAAFlSua0AxrkAu14EBY8WBAZyBACK1nEADdW5khkAFVl9WUDglhohAA1ZQOIOBAeBABrCBCLqBCB9DtnVAIueBAKNAHIEAAIAwAQCdASoIAAgAAUAmJaQAA3AA/vz0AAA=')); + addSourceToVideo(video, 'mp4', base64('video/mp4', 'AAAAHGZ0eXBpc29tAAACAGlzb21pc28ybXA0MQAAAAhmcmVlAAAAG21kYXQAAAGzABAHAAABthADAowdbb9/AAAC6W1vb3YAAABsbXZoZAAAAAB8JbCAfCWwgAAAA+gAAAAAAAEAAAEAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAIAAAIVdHJhawAAAFx0a2hkAAAAD3wlsIB8JbCAAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAAAAAQAAAAAAIAAAACAAAAAABsW1kaWEAAAAgbWRoZAAAAAB8JbCAfCWwgAAAA+gAAAAAVcQAAAAAAC1oZGxyAAAAAAAAAAB2aWRlAAAAAAAAAAAAAAAAVmlkZW9IYW5kbGVyAAAAAVxtaW5mAAAAFHZtaGQAAAABAAAAAAAAAAAAAAAkZGluZgAAABxkcmVmAAAAAAAAAAEAAAAMdXJsIAAAAAEAAAEcc3RibAAAALhzdHNkAAAAAAAAAAEAAACobXA0dgAAAAAAAAABAAAAAAAAAAAAAAAAAAAAAAAIAAgASAAAAEgAAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABj//wAAAFJlc2RzAAAAAANEAAEABDwgEQAAAAADDUAAAAAABS0AAAGwAQAAAbWJEwAAAQAAAAEgAMSNiB9FAEQBFGMAAAGyTGF2YzUyLjg3LjQGAQIAAAAYc3R0cwAAAAAAAAABAAAAAQAAAAAAAAAcc3RzYwAAAAAAAAABAAAAAQAAAAEAAAABAAAAFHN0c3oAAAAAAAAAEwAAAAEAAAAUc3RjbwAAAAAAAAABAAAALAAAAGB1ZHRhAAAAWG1ldGEAAAAAAAAAIWhkbHIAAAAAAAAAAG1kaXJhcHBsAAAAAAAAAAAAAAAAK2lsc3QAAAAjqXRvbwAAABtkYXRhAAAAAQAAAABMYXZmNTIuNzguMw==')); + + // Append the video to where ever you need + document.body.appendChild(video); + + // Start playing video after any user interaction. + // NOTE: Running video.play() handler without a user action may be blocked by browser. + var playFn = function () { + video.play(); + document.body.removeEventListener('touchend', playFn); + }; + document.body.addEventListener('touchend', playFn); + } + })(); \ No newline at end of file