FourteenScrews
/
BoltEngine


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
							<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Fourteen Screws Engine</title>
    <style>
	  body {
        position: absolute;
        top: 0;
        left: 0;
        margin: 0;
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
      }

      #canvas {
      	width: 1280px;
      	aspect-ratio: 8/5;
      }

      @media screen and (max-width : 1920px){
        #joystick {
          visibility: hidden;
        }
      }

      @media screen and (max-width : 906px){
        #joystick {
          visibility: visible;
        }
      }
	</style>
  <!-- Google tag (gtag.js) -->
  <script async src="https://www.googletagmanager.com/gtag/js?id=G-RY4PV833S2"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());

    gtag('config', 'G-RY4PV833S2');
  </script>
  </head>
  <body style="text-align: center">
    <noscript>This page contains webassembly and javascript content, please enable javascript in your browser.</noscript>
    <div id="controls">w, s, a, d = forward, back, strafe left, strafe right | &uarr;, &darr;, &larr;, &rarr; = forward, back, turn left, turn right</div>
    <div id="fps"></div>
    <canvas id="canvas" width="320" height="200"></canvas>
    <div id="joystick" style="width:200px; height:200px; position:fixed; bottom:0px; left:0px; z-index: 99999"></div>
    <script src="./bootstrap.js"></script>
    <script src="./vendor/JoyStick/joy.min.js"></script>
  </body>
</html>