title: Lightswitch HTML5 image upload (IOS Devices) Rotation issue (combining 2 javascripts)
body: <p>I implemented in Lightswitch HTML5 a Photoupload Function from:
  <a href="http://www.paulspatterson.com/lightswitch-html-client-save-images/" rel="nofollow noreferrer">http://www.paulspatterson.com/lightswitch-html-client-save-images/</a></p>
  <p>in general it works, but it seems iOS devices create wrong exit data (images are displayed rotated).
  A solution was mentioned to use following js:
  <a href="https://gokercebeci.com/dev/canvasresize" rel="nofollow noreferrer">https://gokercebeci.com/dev/canvasresize</a></p>
  <p>unfortunately my JavaScript skills are too low to combine the following 2 JavaScripts:
  Please Help :)</p>
  <pre><code>function createHTML5Uploader() {
      var $file_browse_button = $('&lt;input name=&quot;file&quot; type=&quot;file&quot; style=&quot;margin-bottom: 10px;&quot; /&gt;');
      $element.append($file_browse_button);
  
      var $preview = $('&lt;div&gt;&lt;/div&gt;');
      $element.append($preview);
  
      $file_browse_button.bind('change', function handleFileSelect(evt) {
          var files = evt.target.files;
          if (files.length == 1) {
              var reader = new FileReader();
              reader.onload = function (e) {
                  previewImageAndSetContentItem(e.target.result, $preview, contentItem);
              };
              reader.readAsDataURL(files[0]);
          } else {
              // if no file was chosen (e.g., if file-choosing was cancelled), 
              //     explicity ensure that the content is set back to null: 
              previewImageAndSetContentItem(null, $preview, contentItem);
          }
      });
  }
  </code></pre>
  <p>and</p>
  <pre><code>$('input[name=photo]').change(function(e) {
  var file = e.target.files[0];
  canvasResize(file, {
  width: 300,
  height: 0,
  crop: false,
  quality: 80,
  //rotate: 90,
  callback: function(data, width, height) {
  $(img).attr('src', data);
  }
  });
  });
  </code></pre>