Use Uint16Array for RGB16_565 format

Author: zbjornson

Readme.md

@@ -337,6 +337,7 @@ These additional pixel formats have experimental support:
   Some hardware devices and frame buffers use this format. Note that PNG does
   not support this format; when creating a PNG, the image will be converted to
   24-bit RGB. This format is thus suboptimal for generating PNGs.
+  `ImageData` instances for this mode use a `Uint16Array` instead of a `Uint8ClampedArray`.
 * `A1` Each pixel is 1 bit, and pixels are packed together into 32-bit
   quantities. The ordering of the bits matches the endianness of the
   platform: on a little-endian machine, the first pixel is the least-

lib/context2d.js

@@ -339,7 +339,10 @@ Context2d.prototype.createImageData = function(width, height){
     height = width.height;
     width = width.width;
   }
+  var ArrayCtor = this.pixelFormat === "RGB16_565" ? Uint16Array : Uint8ClampedArray;
+  // NB: for some pixelFormats, the stride is not equal to BPP * width.
+  // For example, A1 always pads out to a multiple of 4.
   var Bpp = this.canvas.stride / this.canvas.width;
   var nBytes = Bpp * width * height;
-  return new ImageData(new Uint8ClampedArray(nBytes), width, height);
+  return new ImageData(new ArrayCtor(nBytes), width, height);
 };

src/CanvasRenderingContext2d.cc

@@ -813,9 +813,15 @@ NAN_METHOD(Context2d::GetImageData) {
   uint8_t *src = canvas->data();
 
   Local<ArrayBuffer> buffer = ArrayBuffer::New(Isolate::GetCurrent(), size);
-  Local<Uint8ClampedArray> clampedArray = Uint8ClampedArray::New(buffer, 0, size);
+  Local<TypedArray> dataArray;
 
-  Nan::TypedArrayContents<uint8_t> typedArrayContents(clampedArray);
+  if (canvas->backend()->getFormat() == CAIRO_FORMAT_RGB16_565) {
+    dataArray = Uint16Array::New(buffer, 0, size);
+  } else {
+    dataArray = Uint8ClampedArray::New(buffer, 0, size);
+  }
+
+  Nan::TypedArrayContents<uint8_t> typedArrayContents(dataArray);
   uint8_t* dst = *typedArrayContents;
 
   switch (canvas->backend()->getFormat()) {
@@ -910,7 +916,7 @@ NAN_METHOD(Context2d::GetImageData) {
   const int argc = 3;
   Local<Int32> swHandle = Nan::New(sw);
   Local<Int32> shHandle = Nan::New(sh);
-  Local<Value> argv[argc] = { clampedArray, swHandle, shHandle };
+  Local<Value> argv[argc] = { dataArray, swHandle, shHandle };
 
   Local<Function> ctor = Nan::GetFunction(Nan::New(ImageData::constructor)).ToLocalChecked();
   Local<Object> instance = Nan::NewInstance(ctor, argc, argv).ToLocalChecked();

src/ImageData.cc

@@ -39,7 +39,7 @@ NAN_METHOD(ImageData::New) {
     return Nan::ThrowTypeError("Class constructors cannot be invoked without 'new'");
   }
 
-  Local<Uint8ClampedArray> clampedArray;
+  Local<TypedArray> dataArray;
   uint32_t width;
   uint32_t height;
   int length;
@@ -57,12 +57,12 @@ NAN_METHOD(ImageData::New) {
     }
     length = width * height * 4; // ImageData(w, h) constructor assumes 4 BPP; documented.
 
-    clampedArray = Uint8ClampedArray::New(ArrayBuffer::New(Isolate::GetCurrent(), length), 0, length);
+    dataArray = Uint8ClampedArray::New(ArrayBuffer::New(Isolate::GetCurrent(), length), 0, length);
 
   } else if (info[0]->IsUint8ClampedArray() && info[1]->IsUint32()) {
-    clampedArray = info[0].As<Uint8ClampedArray>();
+    dataArray = info[0].As<Uint8ClampedArray>();
 
-    length = clampedArray->Length();
+    length = dataArray->Length();
     if (length == 0) {
       Nan::ThrowRangeError("The input data has a zero byte length.");
       return;
@@ -86,16 +86,38 @@ NAN_METHOD(ImageData::New) {
       height = size / width;
     }
 
+  } else if (info[0]->IsUint16Array() && info[1]->IsUint32()) { // Intended for RGB16_565 format
+  dataArray = info[0].As<Uint16Array>();
+
+  length = dataArray->Length();
+  if (length == 0) {
+    Nan::ThrowRangeError("The input data has a zero byte length.");
+    return;
+  }
+
+  width = info[1]->Uint32Value();
+  if (width == 0) {
+    Nan::ThrowRangeError("The source width is zero.");
+    return;
+  }
+
+  if (info[2]->IsUint32()) { // Explicit height given
+    height = info[2]->Uint32Value();
+  } else { // Calculate height assuming 2 BPP
+    int size = length / 2;
+    height = size / width;
+  }
+
   } else {
-    Nan::ThrowTypeError("Expected (Uint8ClampedArray, width[, height]) or (width, height)");
+    Nan::ThrowTypeError("Expected (Uint8ClampedArray, width[, height]), (Uint16Array, width[, height]) or (width, height)");
     return;
   }
 
-  Nan::TypedArrayContents<uint8_t> dataPtr(clampedArray);
+  Nan::TypedArrayContents<uint8_t> dataPtr(dataArray);
 
   ImageData *imageData = new ImageData(reinterpret_cast<uint8_t*>(*dataPtr), width, height);
   imageData->Wrap(info.This());
-  info.This()->Set(Nan::New("data").ToLocalChecked(), clampedArray);
+  info.This()->Set(Nan::New("data").ToLocalChecked(), dataArray);
   info.GetReturnValue().Set(info.This());
 }
 

test/canvas.test.js

@@ -730,6 +730,7 @@ describe('Canvas', function () {
         , ctx = canvas.getContext('2d', {pixelFormat: "RGB16_565"});
 
       var imageData = ctx.createImageData(2,6);
+      assert(imageData.data instanceof Uint16Array);
       assert.equal(2, imageData.width);
       assert.equal(6, imageData.height);
       assert.equal(2 * 6 * 2, imageData.data.length);
@@ -829,16 +830,13 @@ describe('Canvas', function () {
       assert.equal(6, imageData.height);
       assert.equal(3 * 6 * 2, imageData.data.length);
 
-      // TODO should be a Uint16Array already?
-      var uint16data = new Uint16Array(imageData.data.buffer, imageData.data.byteOffset, 18);
+      assert.equal((255 & 0b11111) << 11, imageData.data[0]);
+      assert.equal((255 & 0b111111) << 5, imageData.data[1]);
+      assert.equal((255 & 0b11111), imageData.data[2]);
 
-      assert.equal((255 & 0b11111) << 11, uint16data[0]);
-      assert.equal((255 & 0b111111) << 5, uint16data[1]);
-      assert.equal((255 & 0b11111), uint16data[2]);
-
-      assert.equal((255 & 0b11111) << 11, uint16data[3]);
-      assert.equal((255 & 0b111111) << 5, uint16data[4]);
-      assert.equal((255 & 0b11111), uint16data[5]);
+      assert.equal((255 & 0b11111) << 11, imageData.data[3]);
+      assert.equal((255 & 0b111111) << 5, imageData.data[4]);
+      assert.equal((255 & 0b11111), imageData.data[5]);
     });
 
     it("works, full width, A8", function () {
@@ -904,11 +902,8 @@ describe('Canvas', function () {
       assert.equal(1, imageData.height);
       assert.equal(2 * 1 * 2, imageData.data.length);
 
-      // TODO should be a Uint16Array already?
-      var uint16data = new Uint16Array(imageData.data.buffer, imageData.data.byteOffset, 2);
-
-      assert.equal((255 & 0b11111) << 11, uint16data[0]);
-      assert.equal((255 & 0b111111) << 5, uint16data[1]);
+      assert.equal((255 & 0b11111) << 11, imageData.data[0]);
+      assert.equal((255 & 0b111111) << 5, imageData.data[1]);
     });
 
     it("works, slice, A8", function () {

test/imageData.test.js

@@ -40,7 +40,7 @@ describe('ImageData', function () {
     // because our ImageData can support different BPPs.
   });
 
-  it('should construct with typed array', function () {
+  it('should construct with Uint8ClampedArray', function () {
     var data = new Uint8ClampedArray(2 * 3 * 4);
     var imagedata = new ImageData(data, 2);
     assert.strictEqual(imagedata.width, 2);
@@ -55,4 +55,20 @@ describe('ImageData', function () {
     assert(imagedata.data instanceof Uint8ClampedArray);
     assert.strictEqual(imagedata.data.length, 48);
   });
+
+  it('should construct with Uint16Array', function () {
+    var data = new Uint16Array(2 * 3 * 2);
+    var imagedata = new ImageData(data, 2);
+    assert.strictEqual(imagedata.width, 2);
+    assert.strictEqual(imagedata.height, 3);
+    assert(imagedata.data instanceof Uint16Array);
+    assert.strictEqual(imagedata.data.length, 12);
+
+    data = new Uint16Array(3 * 4 * 2);
+    imagedata = new ImageData(data, 3, 4);
+    assert.strictEqual(imagedata.width, 3);
+    assert.strictEqual(imagedata.height, 4);
+    assert(imagedata.data instanceof Uint16Array);
+    assert.strictEqual(imagedata.data.length, 24);
+  });
 });

test/public/tests.js

@@ -1912,8 +1912,10 @@ tests['putImageData() png data'] = function (ctx, done) {
     ctx.drawImage(img, 0, 0, 200, 200)
     var imageData = ctx.getImageData(0, 0, 50, 50)
     var data = imageData.data
-    for (var i = 0, len = data.length; i < len; i += 4) {
-      data[i + 3] = 80
+    if (data instanceof Uint8ClampedArray) {
+      for (var i = 0, len = data.length; i < len; i += 4) {
+        data[i + 3] = 80
+      }
     }
     ctx.putImageData(imageData, 50, 50)
     done(null)
@@ -1933,8 +1935,10 @@ tests['putImageData() png data 2'] = function (ctx, done) {
     ctx.drawImage(img, 0, 0, 200, 200)
     var imageData = ctx.getImageData(0, 0, 50, 50)
     var data = imageData.data
-    for (var i = 0, len = data.length; i < len; i += 4) {
-      data[i + 3] = 80
+    if (data instanceof Uint8ClampedArray) {
+      for (var i = 0, len = data.length; i < len; i += 4) {
+        data[i + 3] = 80
+      }
     }
     ctx.putImageData(imageData, 50, 50, 10, 10, 20, 20)
     done(null)
@@ -1954,10 +1958,12 @@ tests['putImageData() png data 3'] = function (ctx, done) {
     ctx.drawImage(img, 0, 0, 200, 200)
     var imageData = ctx.getImageData(0, 0, 50, 50)
     var data = imageData.data
-    for (var i = 0, len = data.length; i < len; i += 4) {
-      data[i + 0] = data[i + 0] * 0.2
-      data[i + 1] = data[i + 1] * 0.2
-      data[i + 2] = data[i + 2] * 0.2
+    if (data instanceof Uint8ClampedArray) {
+      for (var i = 0, len = data.length; i < len; i += 4) {
+        data[i + 0] = data[i + 0] * 0.2
+        data[i + 1] = data[i + 1] * 0.2
+        data[i + 2] = data[i + 2] * 0.2
+      }
     }
     ctx.putImageData(imageData, 50, 50)
     done(null)