JSFiddle - React, Tailwind, and code Playground

by Yoshiharu Kamata

HTML

<script src="https://raw.github.com/stomita/ios-imagefile-megapixel/master/src/megapix-image.js"></script>
<script src="https://raw.github.com/jseidelin/exif-js/master/binaryajax.js"></script>
<script src="https://raw.github.com/jseidelin/exif-js/master/exif.js"></script>
<input id="select" type="file" accept="image/*" />
<canvas id="image"></canvas>
<div id="console"></div>
<img id="img" />

CoffeeScript

$ ->
  $("#select").on "change", -> 
    $("#console").text "a"
    console.log "a"
    reader = new FileReader
    reader.onload = ->
      $("#console").text "onload"
      console.log EXIF.readFromBinaryFile(reader.result)



    reader.readAsBinaryString(this.files[0])

    mpImg = new MegaPixImage this.files[0]
    mpImg.render $("#image").get(0),
      maxWidth: 300
      maxHeight: 300
      orientation: 6