Add option to load image meta data automatically on load.

Author: blueimp

js/load-image-meta.js

@@ -49,12 +49,12 @@
   // The options arguments accepts an object and supports the following properties:
   // * maxMetaDataSize: Defines the maximum number of bytes to parse.
   // * disableImageHead: Disables creating the imageHead property.
-  loadImage.parseMetaData = function (file, callback, options) {
+  loadImage.parseMetaData = function (file, callback, options, data) {
     options = options || {}
+    data = data || {}
     var that = this
     // 256 KiB should contain all EXIF/ICC/IPTC segments:
     var maxMetaDataSize = options.maxMetaDataSize || 262144
-    var data = {}
     var noMetaData = !(window.DataView && file && file.size >= 12 &&
                       file.type === 'image/jpeg' && loadImage.blobSlice)
     if (noMetaData || !loadImage.readFile(
@@ -140,4 +140,20 @@
       callback(data)
     }
   }
+
+  // Determines if meta data should be loaded automatically:
+  loadImage.hasMetaOption = function (options) {
+    return options.meta
+  }
+
+  var originalTransform = loadImage.transform
+  loadImage.transform = function (img, options, callback, file, data) {
+    if (loadImage.hasMetaOption(options || {})) {
+      loadImage.parseMetaData(file, function (data) {
+        originalTransform.call(loadImage, img, options, callback, file, data)
+      }, options, data)
+    } else {
+      originalTransform.apply(loadImage, arguments)
+    }
+  }
 }))

js/load-image.js

@@ -70,6 +70,10 @@
     return Object.prototype.toString.call(obj) === '[object ' + type + ']'
   }
 
+  loadImage.transform = function (img, options, callback, file, data) {
+    callback(loadImage.scale(img, options, data), data)
+  }
+
   loadImage.onerror = function (img, event, file, callback, options) {
     revokeHelper(img, options)
     if (callback) {
@@ -80,7 +84,7 @@
   loadImage.onload = function (img, event, file, callback, options) {
     revokeHelper(img, options)
     if (callback) {
-      callback(loadImage.scale(img, options))
+      loadImage.transform(img, options, callback, file, {})
     }
   }
 
@@ -149,8 +153,7 @@
     return canvas
   }
 
-  // This method is used to determine if the target image
-  // should be a canvas element:
+  // Determines if the target image should be a canvas element:
   loadImage.hasCanvasOption = function (options) {
     return options.canvas || options.crop || !!options.aspectRatio
   }
@@ -160,7 +163,7 @@
   // Returns a canvas object if the browser supports canvas
   // and the hasCanvasOption method returns true or a canvas
   // object is passed as image, else the scaled image:
-  loadImage.scale = function (img, options) {
+  loadImage.scale = function (img, options, data) {
     options = options || {}
     var canvas = document.createElement('canvas')
     var useCanvas = img.getContext ||
@@ -201,7 +204,7 @@
       }
     }
     if (useCanvas) {
-      options = loadImage.getTransformedOptions(img, options)
+      options = loadImage.getTransformedOptions(img, options, data)
       sourceX = options.left || 0
       sourceY = options.top || 0
       if (options.sourceWidth) {

test/test.js

@@ -503,6 +503,16 @@
         )
       })
     })
+
+    it('Should parse meta data automatically', function (done) {
+      expect(loadImage(blobJPEG, function (img, data) {
+        expect(data).to.be.ok()
+        expect(data.imageHead).to.be.ok()
+        expect(data.exif).to.be.ok()
+        expect(data.exif.get('Orientation')).to.be(6)
+        done()
+      }, {meta: true})).to.be.ok()
+    })
   })
 }(
   this.expect,