From fd9dde4408f1239f7c59ceeae1b56302bd172cb9 Mon Sep 17 00:00:00 2001 From: Taylor Richards Date: Sat, 24 Feb 2018 08:13:08 -0500 Subject: [PATCH] make html shell generic, and CSP friendly --- CMakeLists.txt | 22 ++++++- dist/demo-play.css.in | 58 +++++++++++++++++ dist/demo-play.js.in | 62 ++++++++++++++++++ dist/demo_shell.html.in | 22 +++++++ dist/fs2demo_shell.html | 139 ---------------------------------------- dist/fsdemo_shell.html | 139 ---------------------------------------- 6 files changed, 162 insertions(+), 280 deletions(-) create mode 100644 dist/demo-play.css.in create mode 100644 dist/demo-play.js.in create mode 100644 dist/demo_shell.html.in delete mode 100644 dist/fs2demo_shell.html delete mode 100644 dist/fsdemo_shell.html diff --git a/CMakeLists.txt b/CMakeLists.txt index 91be9f9..30a6d85 100644 --- a/CMakeLists.txt +++ b/CMakeLists.txt @@ -235,8 +235,8 @@ if(EMSCRIPTEN) "-s FULL_ES2=1" "-s WASM=1" "-s TOTAL_MEMORY=184549376" - "--shell-file ${CMAKE_SOURCE_DIR}/dist/${FS_BINARY}_shell.html" - "--preload-file game@/" + "--shell-file ${CMAKE_BINARY_DIR}/dist/demo_shell.html" + "--pre-js ${FS_BINARY}_preload.js" # "-s SAFE_HEAP=1" # "-s DEMANGLE_SUPPORT=1" # "-s ASSERTIONS=2" @@ -250,6 +250,24 @@ if(EMSCRIPTEN) foreach(Flag ${LINK_FLAGS}) set_property(TARGET ${FS_BINARY} APPEND_STRING PROPERTY LINK_FLAGS " ${Flag}") endforeach() + + if(FS1) + set(TEXT_COLOR "#4C442D") + set(BG_COLOR "#3E4559") + set(OUTLINE_COLOR "#353B4C") + set(BG_COLOR2 "#798199") + set(GAME_TITLE "FreeSpace Demo") + else() + set(TEXT_COLOR "#FFF") + set(BG_COLOR "#457573") + set(OUTLINE_COLOR "#4D8280") + set(BG_COLOR2 "#182928") + set(GAME_TITLE "FreeSpace 2 Demo") + endif() + + configure_file(${CMAKE_SOURCE_DIR}/dist/demo_shell.html.in ${CMAKE_BINARY_DIR}/dist/demo_shell.html @ONLY) + configure_file(${CMAKE_SOURCE_DIR}/dist/demo-play.css.in ${CMAKE_BINARY_DIR}/dist/demo-play.css @ONLY) + configure_file(${CMAKE_SOURCE_DIR}/dist/demo-play.js.in ${CMAKE_BINARY_DIR}/dist/demo-play.js @ONLY) endif(EMSCRIPTEN) if(FS1) diff --git a/dist/demo-play.css.in b/dist/demo-play.css.in new file mode 100644 index 0000000..6171a05 --- /dev/null +++ b/dist/demo-play.css.in @@ -0,0 +1,58 @@ +html { + box-sizing: border-box; +} +* { + box-sizing: inherit; +} +html, body { + height: 100%; + margin: 0; + padding: 0; + background-color: #222; +} +#progress { + background: #798199 url(demotitle.jpg); + background-repeat: no-repeat; + background-size: cover; + z-index: 10; +} +#progress_container { + width: 70%; + margin: 0 auto; + position: relative; + top: 50%; +} +#progress_bar_back { + width: 100%; + background-color: @BG_COLOR@; + margin: 0 auto; + outline: 3px ridge @OUTLINE_COLOR@; +} +#progress_bar { + text-indent: 20px; + line-height: 30px; + height: 30px; + width: 0%; + background-color: @BG_COLOR2@; + color: #fff; +} +#progress_text { + color: @TEXT_COLOR@; + margin-top: 0.5em; +} +#progress_text, #progress_bar { + font-family: 'Noto Sans', Tahoma, sans-serif; +} +canvas, #progress { + width: 100vw; + height: 75vw; + background-color: #000; + max-height: 100vh; + max-width: 133.333333vh; + margin: auto; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; +} diff --git a/dist/demo-play.js.in b/dist/demo-play.js.in new file mode 100644 index 0000000..cf6db7b --- /dev/null +++ b/dist/demo-play.js.in @@ -0,0 +1,62 @@ +var progress_bar = document.getElementById('progress_bar'); +var progress_text = document.getElementById('progress_text'); + +var Module = { + preRun: [], + postRun: [], + print: (function() { + return function(text) { + if (arguments.length > 1) text = Array.prototype.slice.call(arguments).join(' '); + // These replacements are necessary if you render to raw HTML + //text = text.replace(/&/g, "&"); + //text = text.replace(//g, ">"); + //text = text.replace('\n', '
', 'g'); + console.log(text); + }; + })(), + printErr: function(text) { + if (arguments.length > 1) text = Array.prototype.slice.call(arguments).join(' '); + if (0) { // XXX disabled for safety typeof dump == 'function') { + dump(text + '\n'); // fast, straight to the real console + } else { + console.error(text); + } + }, + canvas: (function() { + var canvas = document.getElementById('canvas'); + + // As a default initial behavior, pop up an alert when webgl context is lost. To make your + // application robust, you may want to override this behavior before shipping! + // See http://www.khronos.org/registry/webgl/specs/latest/1.0/#5.15.2 + canvas.addEventListener("webglcontextlost", function(e) { alert('WebGL context lost. You will need to reload the page.'); e.preventDefault(); }, false); + + return canvas; + })(), + setStatus: function(text) { + var m = text.match(/([^(]+)\((\d+(\.\d+)?)\/(\d+)\)/); + if (m) { + text = m[1]; + var perc = parseInt(m[2]) / parseInt(m[4]) * 100; + if (perc > 0) { + progress_bar.style.width = perc + '%'; + progress_bar.innerHTML = perc.toFixed(1) + '%'; + } + } else { + progress_bar.innerHTML = ''; + } + progress_text.innerHTML = text; + }, + totalDependencies: 0, + monitorRunDependencies: function(left) { + this.totalDependencies = Math.max(this.totalDependencies, left); + Module.setStatus('Preparing... (' + (this.totalDependencies-left) + '/' + this.totalDependencies + ')'); + } +}; +Module.setStatus('Downloading...'); +window.onerror = function() { + Module.setStatus('Exception thrown, see JavaScript console'); + Module.setStatus = function(text) { + if (text) Module.printErr('[post-exception status] ' + text); + }; +}; diff --git a/dist/demo_shell.html.in b/dist/demo_shell.html.in new file mode 100644 index 0000000..c56c895 --- /dev/null +++ b/dist/demo_shell.html.in @@ -0,0 +1,22 @@ + + + + + + + + + @GAME_TITLE@ + + +
+
+
+
+
+
+ + + {{{ SCRIPT }}} + + diff --git a/dist/fs2demo_shell.html b/dist/fs2demo_shell.html deleted file mode 100644 index 729cdb8..0000000 --- a/dist/fs2demo_shell.html +++ /dev/null @@ -1,139 +0,0 @@ - - - - - - - FreeSpace 2 Demo - - - -
-
-
-
-
-
- - - {{{ SCRIPT }}} - - diff --git a/dist/fsdemo_shell.html b/dist/fsdemo_shell.html deleted file mode 100644 index efa9968..0000000 --- a/dist/fsdemo_shell.html +++ /dev/null @@ -1,139 +0,0 @@ - - - - - - - FreeSpace Demo - - - -
-
-
-
-
-
- - - {{{ SCRIPT }}} - - -- 2.39.2