Merge pull request #52 from studio-YOLO/code-refactoring

Code refactoring
studio-YOLO · May 4, 2024 · 9979c82 · 9979c82
2 parents e87671a + e1df560
commit 9979c82
Show file tree

Hide file tree

Showing 47 changed files with 980 additions and 1,209 deletions.
diff --git a/.npmignore b/.npmignore
@@ -0,0 +1,5 @@
+demo
+test
+lib
+coverage
+.vscode
diff --git a/demo/scripts/black-white-filter-demo.js b/demo/scripts/black-white-filter-demo.js
@@ -7,14 +7,14 @@ const url = "images/img1.jpg";
 var image = new Image();
 image.src = url;
 
-//waiting image load
+// waiting image load
 image.onload = () => {
-
-    // convert image to black and white
+    document.body.appendChild(image);
+    // edit the image
     editpix.toBackWhite(image)
-        .then(blackWhiteImage => {
-            document.body.appendChild(image);
-            document.body.appendChild(blackWhiteImage);
+        .then(resultImage => {
+            // render modified image
+            document.body.appendChild(resultImage);
         })
         .catch(error => { console.log(error) })
 };
diff --git a/demo/scripts/change-brightness-demo.js b/demo/scripts/change-brightness-demo.js
@@ -7,12 +7,13 @@ const url = "images/img7.jpeg";
 var image = new Image();
 image.src = url;
 
-//waiting image load
+// waiting image load
 image.onload = () => {
-
+    document.body.appendChild(image);
+    // edit the image
     editpix.changeBrightness(image, -90)
         .then(resultImage => {
-            document.body.appendChild(image);
+            // render modified image
             document.body.appendChild(resultImage);
         })
         .catch(error => { console.log(error) })

diff --git a/demo/scripts/change-contrast-demo.js b/demo/scripts/change-contrast-demo.js
@@ -7,13 +7,14 @@ const url = "images/img3.jpeg";
 var image = new Image();
 image.src = url;
 
-//waiting image load
+// waiting image load
 image.onload = () => {
-
+    document.body.appendChild(image);
+    // edit the image
     editpix.changeContrast(image, 2)
-        .then(highContrastImage => {
-            document.body.appendChild(image);
-            document.body.appendChild(highContrastImage);
+        .then(resultImage => {
+            // render modified image
+            document.body.appendChild(resultImage);
         })
         .catch(error => { console.log(error) })
 }
diff --git a/demo/scripts/change-exposure-demo.js b/demo/scripts/change-exposure-demo.js
@@ -7,12 +7,13 @@ const url = "images/img7.jpeg";
 var image = new Image();
 image.src = url;
 
-//waiting image load
+// waiting image load
 image.onload = () => {
-
+    document.body.appendChild(image);
+    // edit the image
     editpix.changeExposure(image, -30)
         .then(resultImage => {
-            document.body.appendChild(image);
+            // render modified image
             document.body.appendChild(resultImage);
         })
         .catch(error => { console.log(error) })

diff --git a/demo/scripts/change-highlights-demo.js b/demo/scripts/change-highlights-demo.js
@@ -7,12 +7,13 @@ const url = "images/img7.jpeg";
 var image = new Image();
 image.src = url;
 
-//waiting image load
+// waiting image load
 image.onload = () => {
-
+    document.body.appendChild(image);
+    // edit the image
     editpix.changeHighlights(image, 100)
         .then(resultImage => {
-            document.body.appendChild(image);
+            // render modified image
             document.body.appendChild(resultImage);
         })
         .catch(error => { console.log(error) })

diff --git a/demo/scripts/change-opacity-demo.js b/demo/scripts/change-opacity-demo.js
@@ -7,14 +7,14 @@ const url = "images/img1.jpg";
 var image = new Image();
 image.src = url;
 
-//waiting image load
+// waiting image load
 image.onload = () => {
-
-    // convert image to black and white
+    document.body.appendChild(image);
+    // edit the image
     editpix.changeOpacity(image, 128)
-        .then(newImage => {
-            document.body.appendChild(image);
-            document.body.appendChild(newImage);
+        .then(resultImage => {
+            // render modified image
+            document.body.appendChild(resultImage);
         })
         .catch(error => { console.log(error) })
 };
diff --git a/demo/scripts/change-saturation-demo.js b/demo/scripts/change-saturation-demo.js
@@ -7,12 +7,13 @@ const url = "images/img7.jpeg";
 var image = new Image();
 image.src = url;
 
-//waiting image load
+// waiting image load
 image.onload = () => {
-
+    document.body.appendChild(image);
+    // edit the image
     editpix.changeSaturation(image, 20)
         .then(resultImage => {
-            document.body.appendChild(image);
+            // render modified image
             document.body.appendChild(resultImage);
         })
         .catch(error => { console.log(error) })

diff --git a/demo/scripts/change-shadow-demo.js b/demo/scripts/change-shadow-demo.js
@@ -7,12 +7,13 @@ const url = "images/img7.jpeg";
 var image = new Image();
 image.src = url;
 
-//waiting image load
+// waiting image load
 image.onload = () => {
-
+    document.body.appendChild(image);
+    // edit the image
     editpix.changeShadows(image, -100)
         .then(resultImage => {
-            document.body.appendChild(image);
+            // render modified image
             document.body.appendChild(resultImage);
         })
         .catch(error => { console.log(error) })

diff --git a/demo/scripts/change-sharpness-demo.js b/demo/scripts/change-sharpness-demo.js
@@ -7,12 +7,13 @@ const url = "images/img7.jpeg";
 var image = new Image();
 image.src = url;
 
-//waiting image load
+// waiting image load
 image.onload = () => {
-
+    document.body.appendChild(image);
+    // edit the image
     editpix.changeSharpness(image, 70)
         .then(resultImage => {
-            document.body.appendChild(image);
+            // render modified image
             document.body.appendChild(resultImage);
         })
         .catch(error => { console.log(error) })

diff --git a/demo/scripts/change-temperature-demo.js b/demo/scripts/change-temperature-demo.js
@@ -7,31 +7,14 @@ const url = "images/img8.jpeg";
 var image = new Image();
 image.src = url;
 
-//waiting image load
+// waiting image load
 image.onload = () => {
     document.body.appendChild(image);
-
+    // edit the image
     editpix.changeTemperature(image, 20)
-        .then(highContrastImage => {
-            document.body.appendChild(highContrastImage);
-        })
-        .catch(error => { console.log(error) })
-
-    editpix.changeTemperature(image, 50)
-        .then(highContrastImage => {
-            document.body.appendChild(highContrastImage);
-        })
-        .catch(error => { console.log(error) })
-
-    editpix.changeTemperature(image, -20)
-        .then(highContrastImage => {
-            document.body.appendChild(highContrastImage);
-        })
-        .catch(error => { console.log(error) })
-
-    editpix.changeTemperature(image, -50)
-        .then(highContrastImage => {
-            document.body.appendChild(highContrastImage);
+        .then(resultImage => {
+            // render modified image
+            document.body.appendChild(resultImage);
         })
         .catch(error => { console.log(error) })
 }
diff --git a/demo/scripts/change-tint-demo.js b/demo/scripts/change-tint-demo.js
@@ -7,12 +7,13 @@ const url = "images/img7.jpeg";
 var image = new Image();
 image.src = url;
 
-//waiting image load
+// waiting image load
 image.onload = () => {
-
+    document.body.appendChild(image);
+    // edit the image
     editpix.changeTint(image, -80)
         .then(resultImage => {
-            document.body.appendChild(image);
+            // render modified image
             document.body.appendChild(resultImage);
         })
         .catch(error => { console.log(error) })

diff --git a/demo/scripts/gray-scale-filter-demo.js b/demo/scripts/gray-scale-filter-demo.js
@@ -7,14 +7,14 @@ const url = "images/img1.jpg";
 var image = new Image();
 image.src = url;
 
-//waiting image load
+// waiting image load
 image.onload = () => {
-
-    // convert image to gray scale
+    document.body.appendChild(image);
+    // edit the image
     editpix.toGrayScale(image)
-        .then(grayScaledImage => {
-            document.body.appendChild(image);
-            document.body.appendChild(grayScaledImage);
+        .then(resultImage => {
+            // render modified image
+            document.body.appendChild(resultImage);
         })
         .catch(error => { console.log(error) })
 };
diff --git a/demo/scripts/image-from-url-demo.js b/demo/scripts/image-from-url-demo.js
diff --git a/demo/scripts/optimize-contrast-demo.js b/demo/scripts/optimize-contrast-demo.js
@@ -7,12 +7,14 @@ const url = "images/img2.jpg";
 var image = new Image();
 image.src = url;
 
+// waiting image load
 image.onload = () => {
-
+    document.body.appendChild(image);
+    // edit the image
     editpix.toOptimizedContrast(image)
-        .then(highContrastImage => {
-            document.body.appendChild(image);
-            document.body.appendChild(highContrastImage);
+        .then(resultImage => {
+            // render modified image
+            document.body.appendChild(resultImage);
         })
         .catch(error => { console.log(error) })
 }
diff --git a/demo/scripts/resize-image-demo.js b/demo/scripts/resize-image-demo.js
@@ -12,7 +12,7 @@ container.classList.add("container")
 
 
 
-//waiting image load
+// waiting image load
 image.onload = () => {
     // image dimension before resizing
     console.log("Dimension before resizing: " + image.naturalWidth + "x" + image.naturalHeight);

diff --git a/demo/scripts/sepia-filter-demo.js b/demo/scripts/sepia-filter-demo.js
@@ -7,14 +7,14 @@ const url = "images/img1.jpg";
 var image = new Image();
 image.src = url;
 
-//waiting image load
+// waiting image load
 image.onload = () => {
-
-    // convert image to black and white
+    document.body.appendChild(image);
+    // edit the image
     editpix.toSepia(image)
-        .then(sepiaImage => {
-            document.body.appendChild(image);
-            document.body.appendChild(sepiaImage);
+        .then(resultImage => {
+            // render modified image
+            document.body.appendChild(resultImage);
         })
         .catch(error => { console.log(error) })
 };
diff --git a/src/core/black-white-filter.js b/src/core/black-white-filter.js
@@ -3,7 +3,7 @@
  *  @param {number[]} pixelArray: Image pixel array in the format [R, G, B, alpha,..., R, G, B, alpha].
  *  @returns {number[]} array of black and white image pixels.
  */
-function convertToBW(pixelArray) {
+function toBlackWhite(pixelArray) {
     for (let i = 0; i < pixelArray.length; i += 4) {
         const grayValue =
             0.299 * pixelArray[i] +
@@ -22,4 +22,4 @@ function convertToBW(pixelArray) {
     return pixelArray;
 }
 
-export default convertToBW;
+export default toBlackWhite;
diff --git a/src/core/change-brightness.js b/src/core/change-brightness.js
@@ -1,4 +1,4 @@
-import utils from "../utils.js";
+import {rgbToHsl, hslToRgb} from "../core/colorspace-conversion.js";
 
 /**
  * Function to change the brightness of an image
@@ -10,9 +10,9 @@ function changeBrightness(pixelArray, factor) {
     if (factor == 0)
         return pixelArray;
     for (let i = 0; i < pixelArray.length; i += 4) {
-        const hsl = utils.rgbToHsl(pixelArray[i], pixelArray[i + 1], pixelArray[i + 2]);
+        const hsl = rgbToHsl(pixelArray[i], pixelArray[i + 1], pixelArray[i + 2]);
         hsl.l = Math.max(0, Math.min(100, hsl.l += factor));
-        const rgb = utils.hslToRgb(hsl.h, hsl.s, hsl.l);
+        const rgb = hslToRgb(hsl.h, hsl.s, hsl.l);
 
         pixelArray[i] = rgb.r;
         pixelArray[i + 1] = rgb.g;

diff --git a/src/core/change-saturation.js b/src/core/change-saturation.js
@@ -1,4 +1,4 @@
-import utils from "../utils.js";
+import {rgbToHsl, hslToRgb} from "../core/colorspace-conversion.js";
 
 /**
  * Function to change the saturation of an image.
@@ -10,9 +10,9 @@ function changeSaturation(pixelArray, factor) {
     if (factor == 0)
         return pixelArray;
     for (let i = 0; i < pixelArray.length; i += 4) {
-        let hsl = utils.rgbToHsl(pixelArray[i], pixelArray[i + 1], pixelArray[i + 2]);
+        let hsl = rgbToHsl(pixelArray[i], pixelArray[i + 1], pixelArray[i + 2]);
         hsl.s = Math.max(0, Math.min(100, hsl.s += factor));
-        const rgb = utils.hslToRgb(hsl.h, hsl.s, hsl.l);
+        const rgb = hslToRgb(hsl.h, hsl.s, hsl.l);
 
         pixelArray[i] = rgb.r;
         pixelArray[i + 1] = rgb.g;

diff --git a/src/core/color-selection.js b/src/core/color-selection.js