Added second joystick. Joysticks should hide on desktop and show on mobile

engine/webapp/index.html

@@ -37,7 +37,8 @@
     <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>
+    <div id="joystick-left" style="width: 30%; aspect-ratio: 1; position: fixed; bottom: 0px; left: 0px; z-index: 99999"></div>
+    <div id="joystick-right" style="width: 30%; aspect-ratio: 1; position: fixed; bottom: 0px; right: 0px; z-index: 99999"></div>
     <script src="./bootstrap.js"></script>
     <script src="./vendor/JoyStick/joy.min.js"></script>
   </body>