<html>
  <head>
    <title>AnimationTool</title>
    <meta charset="utf-8">

    <link rel="icon" href="/favicon.ico">
    <link rel="stylesheet" href="assets/stylesheets/main.css">
  </head>
	<body>
        <div id="dropZone">
          <div id = "topbar">
            <div id="instructions" class="instruction">
              <p>Drag images onto the page to upload them. Advance frames with arrow keys</p>
            </div>
          </div>

          <div id="frameNumber" class="warning">
              <p></p>
          </div>
          <!-- canvas -->
          <div id="currentImage">
            <canvas id="canvasImage" alt="No images uploaded"></canvas>
          </div>

          <div id="settings">
              <div id = "originInfo">Click image to set Origin</div>
              Fps: <input type="number" id="framerate" class="numberinput"><br>
              <input type="checkbox" id="looping" > Looping <br>
              <button id="saveButton" type="button">export .anim with (S)</button>
          </div>
          
        </div>

        <script src="bundle.js"></script>
	</body>
</html>