Using jQuery and Javascript to open the IOS camera app and store it as a variable

Question

Is there a possibility that I can use jQuery and Javascript, so that I can open up the camera app on IOS, take a picture, and than save that image into a variable so I could than upload it into parse?

I dislike using this because you have no control of the image.

<input id = "Input" type="file" accept="image/*" capture="camera">

Thanks

Answer 1

You can use the File API along with a generated, none visible input[type="file"], which will leave you with a File object, which you can then use as binary, or as in the example below, as a base64 url, which you can then pass along to the server.

var btn = document.getElementById('upload-image'),
  uploader = document.createElement('input'),
  image = document.getElementById('img-result');

uploader.type = 'file';

btn.onclick = function() {
  uploader.click();
}

uploader.onchange = function() {
  var reader = new FileReader();
  reader.onload = function(evt) {
    image.src = evt.target.result;
  }
  reader.readAsDataURL(uploader.files[0]);
}

<button id="upload-image">Select Image</button>
<img id="img-result" style="max-width: 200px;" />