Merge branch 'dithering-algorithm'

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2018 Marty Oehme
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

LICENSE.md

@@ -1,2 +0,0 @@
-
-Copyright (C) 2018 

lib/Dither.dart

@@ -21,16 +21,23 @@ class Pixed {
     PixelArray pxArr = new PixelArray.fromPixelArray(image);
     for (var y = 0; y < pxArr.getHeight(); y++) {
       for (var x = 0; x < pxArr.getWidth(); x++) {
-        var px = pxArr.getPixel(x, y);
+        pxArr.setPixel( _quantizePixel(pxArr.getPixel(x, y)) );
-        px.r = (steps * px.r / 255).round() * (255 ~/ steps);
-        px.g = (steps * px.g / 255).round() * (255 ~/ steps);
-        px.b = (steps * px.b / 255).round() * (255 ~/ steps);
       }
     }
     return pxArr;
   }
 
-  static PixelArray calcQuantizeError(PixelArray original, PixelArray quantized) {
+  static Pixel _quantizePixel(Pixel pixel, [int steps=1]) {
+    return new Pixel(
+        pixel.x,
+        pixel.y,
+        (steps * pixel.r / 255).round() * (255 ~/ steps),
+        (steps * pixel.g / 255).round() * (255 ~/ steps),
+        (steps * pixel.b / 255).round() * (255 ~/ steps),
+        pixel.a);
+  }
+
+  static PixelArray quantizeError(PixelArray original, PixelArray quantized) {
     PixelArray pxArr = new PixelArray.fromPixelArray(original);
     for (var y = 0; y < pxArr.getHeight(); y++) {
       for (var x = 0; x < pxArr.getWidth(); x++) {
@@ -43,6 +50,47 @@ class Pixed {
     }
     return pxArr;
   }
+
+  static Pixel _quantizeErrorPixel(Pixel original, Pixel quantized) {
+    return new Pixel(original.x, original.y,
+        original.r - quantized.r,
+        original.g - quantized.g,
+        original.b - quantized.b,
+        original.a);
+  }
+
+  static PixelArray dither(PixelArray image) {
+    PixelArray pxArr = new PixelArray.fromPixelArray(image);
+    for (var y = 0; y < pxArr.getHeight()-1; y++) {
+      for (var x = 1; x < pxArr.getWidth()-1; x++) {
+        Pixel origPx = pxArr.getPixel(x, y);
+        Pixel quantPx = _quantizePixel(origPx);
+        Pixel errPx = _quantizeErrorPixel(origPx, quantPx);
+        pxArr.setPixel(quantPx);
+
+        Pixel px = pxArr.getPixel(x+1, y);
+        px.r = (px.r + errPx.r * (7/16)).toInt();
+        px.g = (px.g + errPx.g * (7/16)).toInt();
+        px.b = (px.b + errPx.b * (7/16)).toInt();
+
+        px = pxArr.getPixel(x-1, y+1);
+        px.r = (px.r + errPx.r * (3/16)).toInt();
+        px.g = (px.g + errPx.g * (3/16)).toInt();
+        px.b = (px.b + errPx.b * (3/16)).toInt();
+
+        px = pxArr.getPixel(x, y+1);
+        px.r = (px.r + errPx.r * (5/16)).toInt();
+        px.g = (px.g + errPx.g * (5/16)).toInt();
+        px.b = (px.b + errPx.b * (5/16)).toInt();
+
+        px = pxArr.getPixel(x+1, y+1);
+        px.r = (px.r + errPx.r * (1/16)).toInt();
+        px.g = (px.g + errPx.g * (1/16)).toInt();
+        px.b = (px.b + errPx.b * (1/16)).toInt();
+      }
+    }
+    return pxArr;
+  }
 }
 
 class Pixel {
@@ -81,7 +129,7 @@ class PixelArray {
     pixels = new List(height);
     for (int y = 0; y < height; y++) {
       pixels[y] = new List(width);
-      for (int x = 0; x < height; x++) {
+      for (int x = 0; x < width; x++) {
         pixels[y][x] = new Pixel(x, y, 0, 0, 0, 0);
       }
     }
@@ -92,7 +140,6 @@ class PixelArray {
     int y = 0;
     int x = 0;
     pixels[y] = new List(imageWidth);
-    print(pixels[0].length.toString() + ","+ pixels.length.toString());
     for (var pos = 0; pos < array.length; pos = pos + 4) {
       if (x >= imageWidth) {
         x = 0;
@@ -107,7 +154,7 @@ class PixelArray {
   PixelArray.fromImageData(ImageData imagedata, int imageWidth): this.fromByteArray(imagedata.data, imageWidth);
 
   PixelArray.fromPixelArray(PixelArray pixelArray) {
-    pixels = new List<List<Pixel>>.from(pixelArray.pixels);
+    pixels = pixelArray.clone().pixels;
   }
 
   Uint8ClampedList toByteArray() {

web/index.html

@@ -14,8 +14,8 @@
 </head>
 
 <body>
-<canvas id="input" width="712" height="470"></canvas>
+<canvas id="input"></canvas>
 
-<canvas id="output" width="712" height="470"></canvas>
+<canvas id="output"></canvas>
 </body>
 </html>

web/main.dart

@@ -8,11 +8,15 @@ ImageElement inputImg;
 ImageElement outputImg;
 
 void main() {
-  inputImg = new ImageElement(src: 'kitten.jpg', width: 712, height: 470);
+  inputImg = new ImageElement(src: 'kitten.jpg');
 
   input = document.querySelector('#input');
   output = document.querySelector('#output');
 
+  input.width = inputImg.width;
+  input.height = inputImg.height;
+  output.width = inputImg.width;
+  output.height = inputImg.height;
   inputImg.onLoad.listen(imgLoaded);
 }
 
@@ -20,9 +24,9 @@ void imgLoaded(Event e) {
   print("image loaded");
   input.context2D.drawImage(inputImg, 0, 0);
 
-  PixelArray px = new PixelArray.fromImageData(getImageData(input), 712);
+  PixelArray px = new PixelArray.fromImageData(getImageData(input), input.width);
   px = Pixed.greyscale(px);
-
+  px = Pixed.dither(px);
   output.context2D.putImageData(px.toImageData(), 0, 0);
 }