cleanup of CSS for Emscripten platform

[rocksndiamonds.git] / build-projects / emscripten / index.html
diff --git a/build-projects/emscripten/index.html b/build-projects/emscripten/index.html

index 03c910cb0f4ffe65368bcdb1e2b9cd9af1390f21..a4d0d975b6117bc27a522e6b84d031e034381b93 100644 (file)
--- a/build-projects/emscripten/index.html
+++ b/build-projects/emscripten/index.html
@@ -3,16 +3,47 @@
  <head>
  <meta charset="utf-8"><meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Loading Rocks'n'Diamonds</title>
+<link rel="icon" type="image/png" href="favicon-32x32.png" sizes="32x32">
+<link rel="icon" type="image/png" href="favicon-16x16.png" sizes="16x16">
+<style>
+body {
+    background: black;
+    text-align: center;
+    vertical-align: middle;
+}
+#loading {
+    color: white;
+    font-size: 120%;
+    font-family: sans-serif;
+}
+#canvas {
+    position: absolute;
+    top: 0px;
+    left: 0px;
+    margin: 0px;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    display: block;
+}
+</style>
  </head>
-<body style="background:black;text-align:center;vertical-align:middle;">
+<body>
  <canvas class="emscripten" id="canvas" oncontextmenu="event.preventDefault()" tabindex=-1></canvas>
+<div id="loading">
+<img src="loading.svg" width="200px" height="200px">
+<br>
+Loading Rocks'n'Diamonds ...
+</div>
  <script type='text/javascript'>
        var Module = {
          arguments: [],
          preRun: [
            function() {}
          ],
-        postRun: [],
+        postRun: [
+          function() { loading.style.display = 'none'; }
+        ],
          print: (function() {
            var element = document.getElementById('output');
            if (element) element.value = ''; // clear browser cache
@@ -50,7 +81,7 @@
          alert("An error occurred, see console.");
          document.title = "Rocks'n'Diamonds (aborted)";
        };
-    </script>
+</script>
  <script async type="text/javascript" src="rocksndiamonds.data.js"></script>
  <script async type="text/javascript" src="rocksndiamonds.js"></script>
  </body>