<!DOCTYPE html>
<html>
<body>
<div>
<div style="float: left; width: 49%">
<h1>QRcade</h1>
<h3>Spencer Kee & Stephen Downward</h3>
<p>Play Mario by manipulating a QR code! Move the stick left and right for movement, and press the button on the right side to jump. Be careful not to cover the QR code with your hand. Click start (with the mouse) twice to start the game.</p>
<div id="loadingMessage">🎥 Unable to access video stream (please make sure you have a webcam enabled)</div>
<canvas id="canvas" hidden></canvas>
</div>
<div style="float: right; width: 50%;">
<canvas id="nes-canvas" width="256" height="240" style="width: 100%"></canvas>
<button id="up">Up</button>
<button id="down">Down</button>
<button id="left">Left</button>
<button id="right">Right</button>
<button id="a">A</button>
<button id="b">B</button>
<button id="start">Start</button>
<button id="select">Select</button>
</div>
</div>
<div id="output" hidden>
<div id="latency"></div>
<div id="scan"></div>
<div><span id="outputData"></span></div>
</div>
</body>
<head>
<script type="module" src="app.js"></script>
</head>
</html>