HTMLshell.html

   1 <!doctype html>
   2
   3 <!--
   4   HTML template for the emscripted page. Unlike emscipten's official minimal
   5   frontend, this one is really minimal.
   6
   7   by Miloslav Ciz (drummyfish), 2020
   8
   9   Released under CC0 1.0 (https://creativecommons.org/publicdomain/zero/1.0/)
  10   plus a waiver of all other intellectual property. The goal of this work is
  11   be and remain completely in the public domain forever, available for any use
  12   whatsoever.
  13 -->
  14
  15 <html>
  16
  17 <head>
  18   <meta charset="utf-8">
  19   <title>game</title>
  20
  21   <style>
  22     table
  23     {
  24       width: 100%;
  25     }
  26
  27     td
  28     {
  29       width: 11%;
  30       padding: 0;
  31       margin: 0;
  32     }
  33
  34     button
  35     {
  36       width: 100%;
  37     }
  38
  39     canvas
  40     {
  41       display: block;
  42       margin: 10px auto 30px;
  43     }
  44   </style>
  45 </head>
  46
  47 <body>
  48   <canvas class="emscripten" id="canvas" oncontextmenu="event.preventDefault()" tabindex=-1></canvas>
  49
  50   <script type='text/javascript'>
  51     Module = {
  52       print:
  53         function(what)
  54         {
  55           console.log(what);
  56         },
  57       printErr:
  58         function(what)
  59         {
  60           console.error(what);
  61         },
  62       canvas:
  63         (
  64           function()
  65           {
  66             return document.getElementById('canvas');
  67           }
  68         )(),
  69       onRuntimeInitialized: function()
  70         {
  71           pressFunc = Module.cwrap('webButton', '', ['number','number']);
  72         }
  73     };
  74
  75     function down(button)
  76     {
  77       pressFunc(button,1);
  78     }
  79
  80     function up(button)
  81     {
  82       pressFunc(button,0);
  83     }
  84   </script>
  85
  86   {{{ SCRIPT }}}
  87
  88   <table style="user-select:none; -moz-user-select: none; -ms-user-select:none; -webkit-user-select: none; -o-user-select:none;" onselectstart="return false;" unselectable="on">
  89     <tr> <td></td> <td><button onmousedown="down(0)" ontouchstart="down(0)" onmouseup="up(0)" ontouchend="up(0)" onmouseout="up(0)" ontouchleave="(0)">U</button></td> <td></td> <td></td> <td><button onmousedown="down(4)" ontouchstart="down(4)" onmouseup="up(4)" ontouchend="up(4)" onmouseout="up(4)" ontouchleave="(4)">A</button></td> <td></td> <td></td> </tr>
  90     <tr> <td><button onmousedown="down(3)" ontouchstart="down(3)" onmouseup="up(3)" ontouchend="up(3)" onmouseout="up(3)" ontouchleave="(3)">L</button></td> <td></td> <td><button onmousedown="down(1)" ontouchstart="down(1)" onmouseup="up(1)" ontouchend="up(1)" onmouseout="up(1)" ontouchleave="(1)">R</button></td> <td></td> <td></td> <td><button onmousedown="down(5)" ontouchstart="down(5)" onmouseup="up(5)" ontouchend="up(5)" onmouseout="up(5)" ontouchleave="(5)">B</button></td> <td></td> </tr>
  91     <tr> <td></td> <td><button onmousedown="down(2)" ontouchstart="down(2)" onmouseup="up(2)" ontouchend="up(2)" onmouseout="up(2)" ontouchleave="(2)">D</button></td> <td></td> <td></td> <td></td> <td></td> <td><button onmousedown="down(6)" ontouchstart="down(6)" onmouseup="up(6)" ontouchend="up(6)" onmouseout="up(6)" ontouchleave="(6)">C</button></td> </tr>
  92   </table>
  93
  94 </body>
  95 </html>