change to modern JS

README.md

@@ -1,13 +1,13 @@
 # image-luminosity
 ## Install
 ```
-$ npm i --save image-luminosity
+$ npm i image-luminosity
 ```
 
 ## Usage
 ```
-var imgLum = require('image-luminosity');
-var image = '/directory/to/img';
+import imgLum from 'image-luminosity';
+const image = '/directory/to/img';
 
 imgLum(image, function(value) {
         console.log(value);

index.js

@@ -1,62 +1,76 @@
-function(imageSrc, callback, dimensions) {
-    var img = document.createElement("img");
-    img.src = imageSrc;
-    img.style.display = "none";
-    document.body.appendChild(img);
-
-    var colorSum = avgR = avgG = avgB = avgA = 0;
-
-    img.onload = function() {
-        // create canvas
-        var canvas = document.createElement("canvas");
-        var sx,sy,sWidth,sHeight;
-        canvas.width = this.width;
-        canvas.height = this.height;
-
-        if (dimensions != null) {
-            sx = dimensions.sx;
-            sy = dimensions.sy;
-            sWidth = dimensions.sWidth;
-            sHeight = dimensions.sHeight;
-        }
-        else {
-            sx = sy = 0;
-            sWidth = canvas.width;
-            sHeight = canvas.height;
-        }
-
-        var ctx = canvas.getContext("2d");
-        ctx.drawImage(this, 0, 0);
-
-        var imageData = ctx.getImageData(sx, sy, sWidth, sHeight);
-        var data = imageData.data;
-        var r, g, b, a, avg;
-
-        for (var x = 0, len = data.length; x < len; x += 4) {
-            r = data[x];
-            g = data[x + 1];
-            b = data[x + 2];
-            a = data[x + 3];
-
-            avgR += r;
-            avgG += g;
-            avgB += b;
-            avgA += a;
-            avg = Math.floor((r + g + b) / 3);
-            colorSum += avg;
-        }
-
-        function average (int) {
-            return Math.floor(int / (sWidth * sHeight));
-        }
-
-        var values = {
-            brightness: average(colorSum),
-            opacity: average(avgA)),
-            r: average(avgR),
-            g: average(avgG),
-            b: average(avgB)
-        }
-        callback(values);
+/**
+ * Detects the luminosity and average color values of an image.
+ * @param {string} imageSource - The source URL of the image.
+ * @param {function} callback - Callback function to receive the result.
+ * @param {object} [dimensions] - Optional crop dimensions {sx, sy, sWidth, sHeight}.
+ */
+const imgLum = (imageSource, callback, dimensions) => {
+  const img = document.createElement('img');
+  img.crossOrigin = 'Anonymous'; // Set this before src
+  img.src = imageSource;
+  img.style.display = 'none';
+  document.body.appendChild(img);
+
+  let colorSum = 0;
+  let avgR = 0;
+  let avgG = 0;
+  let avgB = 0;
+  let avgA = 0;
+
+  function cleanup() {
+    if (img.parentNode) {
+      img.parentNode.removeChild(img);
     }
-}
+  }
+
+  img.onload = function () {
+    const canvas = document.createElement('canvas');
+    let sx, sy, sWidth, sHeight;
+    canvas.width = this.width;
+    canvas.height = this.height;
+
+    if (dimensions != null) {
+      ({ sx, sy, sWidth, sHeight } = dimensions);
+    } else {
+      sx = sy = 0;
+      sWidth = canvas.width;
+      sHeight = canvas.height;
+    }
+
+    const context = canvas.getContext('2d');
+    context.drawImage(this, 0, 0);
+
+    const imageData = context.getImageData(sx, sy, sWidth, sHeight);
+    const data = imageData.data;
+    let r, g, b, a, avg;
+
+    for (let x = 0, length_ = data.length; x < length_; x += 4) {
+      r = data[x];
+      g = data[x + 1];
+      b = data[x + 2];
+      a = data[x + 3];
+
+      avgR += r;
+      avgG += g;
+      avgB += b;
+      avgA += a;
+      avg = Math.floor((r + g + b) / 3);
+      colorSum += avg;
+    }
+
+    const totalPixels = sWidth * sHeight;
+    const average = (int) => Math.floor(int / totalPixels);
+
+    const values = {
+      brightness: average(colorSum),
+      opacity: average(avgA),
+      r: average(avgR),
+      g: average(avgG),
+      b: average(avgB),
+    };
+    callback(values);
+    cleanup();
+  };
+};
+
+export default imgLum;