From d0a8cd81410080c6cb46841140f114945d6cbb3d Mon Sep 17 00:00:00 2001 From: Christopher Cameron Date: Tue, 18 Feb 2025 10:42:38 +0000 Subject: [PATCH 1/4] putImageData: Clarify that the operation is not a memcpy Ensure that it be clear that putImage will convert from the source ImageData's color space and pixel format to the output bitmap's color space and pixel format. Also document the two separate putImageData methods as separate methods with a common algorithm, rather than a single method with optional parameters. --- source | 61 +++++++++++++++++++++++++++++++++++++--------------------- 1 file changed, 39 insertions(+), 22 deletions(-) diff --git a/source b/source index 52259ce8fce..797eeba0210 100644 --- a/source +++ b/source @@ -65536,8 +65536,8 @@ interface mixin CanvasImageData { ImageData createImageData([EnforceRange] long sw, [EnforceRange] long sh, optional ImageDataSettings settings = {}); ImageData createImageData(ImageData imagedata); ImageData getImageData([EnforceRange] long sx, [EnforceRange] long sy, [EnforceRange] long sw, [EnforceRange] long sh, optional ImageDataSettings settings = {}); - undefined putImageData(ImageData imagedata, [EnforceRange] long dx, [EnforceRange] long dy); - undefined putImageData(ImageData imagedata, [EnforceRange] long dx, [EnforceRange] long dy, [EnforceRange] long dirtyX, [EnforceRange] long dirtyY, [EnforceRange] long dirtyWidth, [EnforceRange] long dirtyHeight); + undefined putImageData(ImageData imageData, [EnforceRange] long dx, [EnforceRange] long dy); + undefined putImageData(ImageData imageData, [EnforceRange] long dx, [EnforceRange] long dy, [EnforceRange] long dirtyX, [EnforceRange] long dirtyY, [EnforceRange] long dirtyWidth, [EnforceRange] long dirtyHeight); }; enum CanvasLineCap { "butt", "round", "square" }; @@ -70232,19 +70232,34 @@ try { component.

The putImageData() method writes data from - ImageData structures back to the rendering context's output bitmap. Its - arguments are: imagedata, dx, dy, dirtyX, - dirtyY, dirtyWidth, and dirtyHeight.

+ data-x="dom-context-2d-putImageData-short">putImageData(imageData, + dx, dy) method steps are to + put pixels from an + ImageData onto a bitmap, given + imageData, the output bitmap of the rendering context, + dx, dy, 0, 0, + the width of + the imageData structure, and + the height of + the imageData structure.

-

When the last four arguments to this method are omitted, they must be assumed to have the - values 0, 0, the width member of the imagedata structure, and the height - member of the imagedata structure, respectively.

- -

The method, when invoked, must act as follows:

- -
    -
  1. Let buffer be imagedata's The putImageData(imageData, + dx, dy, dirtyX, dirtyY, + dirtyWidth, dirtyHeight) method steps are to + put pixels from an + ImageData onto a bitmap, given + imageData, the output bitmap of the rendering context, + dx, dy, dirtyX, dirtyY, + dirtyWidth, and dirtyHeight.

    + +

    To put pixels from an ImageData + onto a bitmap, given an ImageData imageData, + an output bitmap bitmap, and numbers dx, dy, + dirtyX, dirtyY, dirtyWidth, and dirtyHeight:

    + +
      +
    1. Let buffer be imageData's data attribute value's [[ViewedArrayBuffer]] internal slot.

    2. @@ -70271,12 +70286,12 @@ try {
    3. If dirtyX+dirtyWidth is greater than the width attribute of the imagedata argument, then + data-x="dom-imagedata-width">width attribute of the imageData argument, then let dirtyWidth be the value of that width attribute, minus the value of dirtyX.

      If dirtyY+dirtyHeight is greater than the height attribute of the imagedata argument, then + data-x="dom-imagedata-height">height attribute of the imageData argument, then let dirtyHeight be the value of that height attribute, minus the value of dirtyY.

    4. @@ -70290,12 +70305,14 @@ try { data-x="">dirtyX ≤ x < dirtyX+dirtyWidth and dirtyY ≤ y < dirtyY+dirtyHeight, copy the - four channels of the pixel with coordinate (x, y) in - the imagedata data structure's Canvas Pixel - ArrayBuffer to the pixel with coordinate (dx+x, dy+y) - in the rendering context's output bitmap.

      + data-x="">dirtyY+dirtyHeight, + set the pixel with coordinate (dx+x, + dy+y) in bitmap to the color at coordinate + (x, y) in the imageData data structure's + Canvas Pixel ArrayBuffer, + converted from imageData's colorSpace + to the color space of bitmap + using 'relative-colorimetric' rendering intent.

    Due to the lossy nature of converting between color spaces and converting to and From 15275a5cbf5ddc475e38b2d9751c91fce9f36f70 Mon Sep 17 00:00:00 2001 From: Christopher Cameron Date: Wed, 19 Feb 2025 11:49:57 +0000 Subject: [PATCH 2/4] Change imagedata to imageData --- source | 32 ++++++++++++++++---------------- 1 file changed, 16 insertions(+), 16 deletions(-) diff --git a/source b/source index 797eeba0210..633edcefc68 100644 --- a/source +++ b/source @@ -65534,7 +65534,7 @@ interface mixin CanvasDrawImage { interface mixin CanvasImageData { // pixel manipulation ImageData createImageData([EnforceRange] long sw, [EnforceRange] long sh, optional ImageDataSettings settings = {}); - ImageData createImageData(ImageData imagedata); + ImageData createImageData(ImageData imageData); ImageData getImageData([EnforceRange] long sx, [EnforceRange] long sy, [EnforceRange] long sw, [EnforceRange] long sh, optional ImageDataSettings settings = {}); undefined putImageData(ImageData imageData, [EnforceRange] long dx, [EnforceRange] long dy); undefined putImageData(ImageData imageData, [EnforceRange] long dx, [EnforceRange] long dy, [EnforceRange] long dirtyX, [EnforceRange] long dirtyY, [EnforceRange] long dirtyWidth, [EnforceRange] long dirtyHeight); @@ -69918,7 +69918,7 @@ try {

    Pixel manipulation
    -
    imagedata = new ImageData(sw, sh [, settings])
    +
    imageData = new ImageData(sw, sh [, settings])

    Returns an ImageData object with the given dimensions and the color space indicated by settings. All the pixels in the returned object are transparent @@ -69928,7 +69928,7 @@ try { the width or height arguments are zero.

    -
    imagedata = new ImageData(data, sw [, sh [, settings ] ])
    +
    imageData = new ImageData(data, sw [, sh [, settings ] ])

    Returns an ImageData object using the data provided in the Uint8ClampedArray argument, interpreted using the given @@ -69942,11 +69942,11 @@ try { data and dimensions can't be interpreted consistently, or if either dimension is zero.

    -
    imagedata = context.createImageData(imagedata)
    +
    imageData = context.createImageData(imageData)

    Returns an ImageData object with the same dimensions and color space as the argument. All the pixels in the returned object are transparent black.

    -
    imagedata = context.createImageData(sw, sh [, settings])
    +
    imageData = context.createImageData(sw, sh [, settings])

    Returns an ImageData object with the given dimensions. The color space of the returned object is the color space of @@ -69957,7 +69957,7 @@ try { the width or height arguments are zero.

    -
    imagedata = context.getImageData(sx, sy, sw, sh [, settings])
    +
    imageData = context.getImageData(sx, sy, sw, sh [, settings])

    Returns an ImageData object containing the image data for the given rectangle of the bitmap. The color space of the returned object is the

    -
    imagedata.width
    -
    imagedata.height
    +
    imageData.width
    +
    imageData.height

    Returns the actual dimensions of the data in the ImageData object, in pixels.

    -
    imagedata.data
    +
    imageData.data

    Returns the one-dimensional array containing the data in RGBA order, as integers in the range 0 to 255.

    -
    imagedata.colorSpace
    +
    imageData.colorSpace

    Returns the color space of the pixels.

    -
    context.putImageData(imagedata, dx, dy [, dirtyX, dirtyY, dirtyWidth, dirtyHeight ])
    +
    context.putImageData(imageData, dx, dy [, dirtyX, dirtyY, dirtyWidth, dirtyHeight ])

    Paints the data from the given ImageData object onto the bitmap. If a dirty rectangle is provided, only the pixels from that rectangle are painted.

    @@ -69992,7 +69992,7 @@ try { blending, no shadows, etc.

    Throws an "InvalidStateError" DOMException if the - imagedata object's data attribute value's + imageData object's data attribute value's [[ViewedArrayBuffer]] internal slot is detached.

    @@ -70077,18 +70077,18 @@ try {

The createImageData(imagedata) + data-x="dom-context-2d-createimagedata-imagedata">createImageData(imageData) method steps are:

  1. Let newImageData be a new ImageData object.

  2. Initialize newImageData - given the value of imagedata's width - attribute, the value of imagedata's height + given the value of imageData's width + attribute, the value of imageData's height attribute, and defaultColorSpace set to the value of - imagedata's colorSpace attribute.

  3. + imageData's colorSpace attribute.

  4. Initialize the image data of newImageData to transparent black.

  5. From ab387520a076586bc206a50150019f69a2bbb4ef Mon Sep 17 00:00:00 2001 From: Christopher Cameron Date: Wed, 19 Feb 2025 13:20:50 +0000 Subject: [PATCH 3/4] Incorporate review feedback --- source | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/source b/source index 633edcefc68..a4effb8a974 100644 --- a/source +++ b/source @@ -70236,12 +70236,10 @@ try { dx, dy) method steps are to put pixels from an ImageData onto a bitmap, given - imageData, the output bitmap of the rendering context, + imageData, this's output bitmap, dx, dy, 0, 0, - the width of - the imageData structure, and - the height of - the imageData structure.

    + imageData's width, and + imageData's height.

    The putImageData(imageData, @@ -70249,7 +70247,7 @@ try { dirtyWidth, dirtyHeight) method steps are to put pixels from an ImageData onto a bitmap, given - imageData, the output bitmap of the rendering context, + imageData, this's output bitmap, dx, dy, dirtyX, dirtyY, dirtyWidth, and dirtyHeight.

    From b476e942482e94a2fd86bd86b8c8bb6e6922c474 Mon Sep 17 00:00:00 2001 From: Christopher Cameron Date: Thu, 20 Feb 2025 09:55:19 +0000 Subject: [PATCH 4/4] Incorporate review feedback --- source | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/source b/source index a4effb8a974..019de5b716f 100644 --- a/source +++ b/source @@ -70305,7 +70305,7 @@ try { data-x="">dirtyY ≤ y < dirtyY+dirtyHeight, set the pixel with coordinate (dx+x, - dy+y) in bitmap to the color at coordinate + dy+y) in bitmap to the color of the pixel at coordinate (x, y) in the imageData data structure's Canvas Pixel ArrayBuffer, converted from imageData's colorSpace