[html5] r7178 - [giow] (0) Try to introduce 'HD' versions of the ImageData API. PLEASE DO NOT IM [...]

[whatwg at whatwg.org]

Author: ianh
Date: 2012-07-17 00:45:34 -0700 (Tue, 17 Jul 2012)
New Revision: 7178

Modified:
   complete.html
   index
   source
Log:
[giow] (0) Try to introduce 'HD' versions of the ImageData API. PLEASE DO NOT IMPLEMENT THESE IF YOU DO NOT HAVE VARIABLE-RESOLUTION CANVASES.
Affected topics: Canvas, DOM APIs, HTML, Security

Modified: complete.html
===================================================================
--- complete.html	2012-07-16 19:16:26 UTC (rev 7177)
+++ complete.html	2012-07-17 07:45:34 UTC (rev 7178)
@@ -240,7 +240,7 @@
 
   <header class=head id=head><p><a class=logo href=http://www.whatwg.org/><img alt=WHATWG height=101 src=/images/logo width=101></a></p>
    <hgroup><h1 class=allcaps>HTML</h1>
-    <h2 class="no-num no-toc">Living Standard — Last Updated 16 July 2012</h2>
+    <h2 class="no-num no-toc">Living Standard — Last Updated 17 July 2012</h2>
    </hgroup><dl><dt><strong>Web developer edition:</strong></dt>
     <dd><strong><a href=http://developers.whatwg.org/>http://developers.whatwg.org/</a></strong></dd>
     <dt>Multiple-page version:</dt>
@@ -598,26 +598,27 @@
       <ol>
        <li><a href=#2dcontext><span class=secno>4.8.11.1 </span>The 2D context</a>
         <ol>
-         <li><a href=#the-canvas-state><span class=secno>4.8.11.1.1 </span>The canvas state</a></li>
-         <li><a href=#drawingstyle-objects><span class=secno>4.8.11.1.2 </span><code>DrawingStyle</code> objects</a></li>
-         <li><a href=#line-styles><span class=secno>4.8.11.1.3 </span>Line styles</a></li>
-         <li><a href=#text-styles><span class=secno>4.8.11.1.4 </span>Text styles</a></li>
-         <li><a href=#building-paths><span class=secno>4.8.11.1.5 </span>Building paths</a></li>
-         <li><a href=#path-objects><span class=secno>4.8.11.1.6 </span><code>Path</code> objects</a></li>
-         <li><a href=#transformations><span class=secno>4.8.11.1.7 </span>Transformations</a></li>
-         <li><a href=#fill-and-stroke-styles><span class=secno>4.8.11.1.8 </span>Fill and stroke styles</a></li>
-         <li><a href=#drawing-rectangles-to-the-canvas><span class=secno>4.8.11.1.9 </span>Drawing rectangles to the canvas</a></li>
-         <li><a href=#drawing-text-to-the-canvas><span class=secno>4.8.11.1.10 </span>Drawing text to the canvas</a></li>
-         <li><a href=#drawing-paths-to-the-canvas><span class=secno>4.8.11.1.11 </span>Drawing paths to the canvas</a></li>
-         <li><a href=#drawing-images-to-the-canvas><span class=secno>4.8.11.1.12 </span>Drawing images to the canvas</a></li>
-         <li><a href=#hit-regions><span class=secno>4.8.11.1.13 </span>Hit regions</a></li>
-         <li><a href=#pixel-manipulation><span class=secno>4.8.11.1.14 </span>Pixel manipulation</a></li>
-         <li><a href=#compositing><span class=secno>4.8.11.1.15 </span>Compositing</a></li>
-         <li><a href=#image-smoothing><span class=secno>4.8.11.1.16 </span>Image smoothing</a></li>
-         <li><a href=#shadows><span class=secno>4.8.11.1.17 </span>Shadows</a></li>
-         <li><a href=#drawing-model><span class=secno>4.8.11.1.18 </span>Drawing model</a></li>
-         <li><a href=#best-practices><span class=secno>4.8.11.1.19 </span>Best practices</a></li>
-         <li><a href=#examples><span class=secno>4.8.11.1.20 </span>Examples</a></ol></li>
+         <li><a href=#resolution><span class=secno>4.8.11.1.1 </span>Resolution</a></li>
+         <li><a href=#the-canvas-state><span class=secno>4.8.11.1.2 </span>The canvas state</a></li>
+         <li><a href=#drawingstyle-objects><span class=secno>4.8.11.1.3 </span><code>DrawingStyle</code> objects</a></li>
+         <li><a href=#line-styles><span class=secno>4.8.11.1.4 </span>Line styles</a></li>
+         <li><a href=#text-styles><span class=secno>4.8.11.1.5 </span>Text styles</a></li>
+         <li><a href=#building-paths><span class=secno>4.8.11.1.6 </span>Building paths</a></li>
+         <li><a href=#path-objects><span class=secno>4.8.11.1.7 </span><code>Path</code> objects</a></li>
+         <li><a href=#transformations><span class=secno>4.8.11.1.8 </span>Transformations</a></li>
+         <li><a href=#fill-and-stroke-styles><span class=secno>4.8.11.1.9 </span>Fill and stroke styles</a></li>
+         <li><a href=#drawing-rectangles-to-the-canvas><span class=secno>4.8.11.1.10 </span>Drawing rectangles to the canvas</a></li>
+         <li><a href=#drawing-text-to-the-canvas><span class=secno>4.8.11.1.11 </span>Drawing text to the canvas</a></li>
+         <li><a href=#drawing-paths-to-the-canvas><span class=secno>4.8.11.1.12 </span>Drawing paths to the canvas</a></li>
+         <li><a href=#drawing-images-to-the-canvas><span class=secno>4.8.11.1.13 </span>Drawing images to the canvas</a></li>
+         <li><a href=#hit-regions><span class=secno>4.8.11.1.14 </span>Hit regions</a></li>
+         <li><a href=#pixel-manipulation><span class=secno>4.8.11.1.15 </span>Pixel manipulation</a></li>
+         <li><a href=#compositing><span class=secno>4.8.11.1.16 </span>Compositing</a></li>
+         <li><a href=#image-smoothing><span class=secno>4.8.11.1.17 </span>Image smoothing</a></li>
+         <li><a href=#shadows><span class=secno>4.8.11.1.18 </span>Shadows</a></li>
+         <li><a href=#drawing-model><span class=secno>4.8.11.1.19 </span>Drawing model</a></li>
+         <li><a href=#best-practices><span class=secno>4.8.11.1.20 </span>Best practices</a></li>
+         <li><a href=#examples><span class=secno>4.8.11.1.21 </span>Examples</a></ol></li>
        <li><a href=#color-spaces-and-color-correction><span class=secno>4.8.11.2 </span>Color spaces and color correction</a></li>
        <li><a href=#security-with-canvas-elements><span class=secno>4.8.11.3 </span>Security with <code>canvas</code> elements</a></ol></li>
      <li><a href=#the-map-element><span class=secno>4.8.12 </span>The <code>map</code> element</a></li>
@@ -4163,7 +4164,8 @@
     implementations that support scripting. The following features and
     terms are defined in the CSSOM specifications: <a href=#refsCSSOM>[CSSOM]</a> <a href=#refsCSSOMVIEW>[CSSOMVIEW]</a>
 
-    <ul class=brief><li><dfn id=linkstyle><code>LinkStyle</code></dfn></li>
+    <ul class=brief><li><dfn id=screen><code>Screen</code></dfn></li>
+     <li><dfn id=linkstyle><code>LinkStyle</code></dfn></li>
      <li><dfn id=cssstyledeclaration><code>CSSStyleDeclaration</code></dfn></li>
      <li><dfn id=stylesheet><code>StyleSheet</code></dfn></li>
      <li><dfn id=dom-linkstyle-sheet title=dom-linkstyle-sheet><code>sheet</code></dfn></li>
@@ -35298,7 +35300,9 @@
            attribute unsigned long <a href=#dom-canvas-height title=dom-canvas-height>height</a>;
 
   DOMString <a href=#dom-canvas-todataurl title=dom-canvas-toDataURL>toDataURL</a>(optional DOMString type, any... args);
+  DOMString <a href=#dom-canvas-todataurlhd title=dom-canvas-toDataURLHD>toDataURLHD</a>(optional DOMString type, any... args);
   void <a href=#dom-canvas-toblob title=dom-canvas-toBlob>toBlob</a>(<a href=#filecallback>FileCallback</a>? _callback, optional DOMString type, any... args);
+  void <a href=#dom-canvas-toblobhd title=dom-canvas-toBlobHD>toBlobHD</a>(<a href=#filecallback>FileCallback</a>? _callback, optional DOMString type, any... args);
 
   object? <a href=#dom-canvas-getcontext title=dom-canvas-getContext>getContext</a>(DOMString contextId, any... args);
 };</pre>
@@ -35527,6 +35531,7 @@
   </div>
 
   <hr><dl class=domintro><dt><var title="">url</var> = <var title="">canvas</var> . <code title=dom-canvas-toDataURL><a href=#dom-canvas-todataurl>toDataURL</a></code>( [ <var title="">type</var>, ... ] )</dt>
+   <dt><var title="">url</var> = <var title="">canvas</var> . <code title=dom-canvas-toDataURLHD><a href=#dom-canvas-todataurlhd>toDataURLHD</a></code>( [ <var title="">type</var>, ... ] )</dt>
 
    <dd>
 
@@ -35546,9 +35551,14 @@
     to this is if the canvas has either no height or no width, in
     which case the result might simply be "<code title="">data:,</code>".)</p>
 
+    <p>The <code title=dom-canvas-toDataURL><a href=#dom-canvas-todataurl>toDataURL()</a></code>
+    method returns the data at a resolution of 96dpi. The <code title=dom-canvas-toDataURLHD><a href=#dom-canvas-todataurlhd>toDataURLHD()</a></code> method returns
+    it at the native canvas bitmap resolution.</p>
+
    </dd>
 
    <dt><var title="">canvas</var> . <code title=dom-canvas-toBlob><a href=#dom-canvas-toblob>toBlob</a></code>(<var title="">callback</var> [, <var title="">type</var>, ... ])</dt>
+   <dt><var title="">canvas</var> . <code title=dom-canvas-toBlobHD><a href=#dom-canvas-toblobhd>toBlobHD</a></code>(<var title="">callback</var> [, <var title="">type</var>, ... ])</dt>
 
    <dd>
 
@@ -35562,12 +35572,16 @@
     type, and control the way that the image is generated, as given in
     the table below.</p>
 
+    <p>The <code title=dom-canvas-toBlob><a href=#dom-canvas-toblob>toBlob()</a></code> method
+    provides the data at a resolution of 96dpi. The <code title=dom-canvas-toBlobHD><a href=#dom-canvas-toblobhd>toBlobHD()</a></code> method provides it
+    at the native canvas bitmap resolution.</p>
+
    </dd>
 
   </dl><div class=impl>
 
-  <p>The <dfn id=dom-canvas-todataurl title=dom-canvas-toDataURL><code>toDataURL()</code></dfn> method
-  must run the following steps:</p>
+  <p>The <dfn id=dom-canvas-todataurl title=dom-canvas-toDataURL><code>toDataURL()</code></dfn> and <dfn id=dom-canvas-todataurlhd title=dom-canvas-toDataURLHD><code>toDataURLHD()</code></dfn>
+  methods must run the following steps:</p>
 
   <ol><!--ADD-TOPIC:Security--><li><p>If the <code><a href=#the-canvas-element>canvas</a></code> element's <i>origin-clean</i>
    flag is set to false, throw a <code><a href=#securityerror>SecurityError</a></code> exception
@@ -35582,7 +35596,8 @@
 
    <li><p>Let <var title="">file</var> be <a href=#a-serialization-of-the-image-as-a-file>a serialization of the
    image as a file</a>, using the method's arguments (if any) as
-   the <var title="">arguments</var>.</li>
+   the <var title="">arguments</var>, and with the <var title="">native</var> flag set if the method is the <code title=dom-canvas-toDataURLHD><a href=#dom-canvas-todataurlhd>toDataURLHD()</a></code> method, and not
+   otherwise.</li>
 
    <li><p>Return a <a href=#data-protocol title="data protocol"><code title="">data:</code> URL</a> representing <var title="">file</var>. <a href=#refsRFC2397>[RFC2397]</a></p>
 
@@ -35590,8 +35605,9 @@
    not have any parameters, to ensure the same exact URL is generated
    in each browser? -->
 
-  </ol><p>The <dfn id=dom-canvas-toblob title=dom-canvas-toBlob><code>toBlob()</code></dfn> method
-  must run the following steps:</p>
+  </ol><p>The <dfn id=dom-canvas-toblob title=dom-canvas-toBlob><code>toBlob()</code></dfn>
+  and <dfn id=dom-canvas-toblobhd title=dom-canvas-toBlobHD><code>toBlobHD()</code></dfn>
+  methods must run the following steps:</p>
 
   <ol><!--ADD-TOPIC:Security--><li><p>If the <code><a href=#the-canvas-element>canvas</a></code> element's <i>origin-clean</i>
    flag is set to false, throw a <code><a href=#securityerror>SecurityError</a></code> exception
@@ -35611,7 +35627,10 @@
 
     <p>Otherwise, let <var title="">result</var> be a
     <code><a href=#blob>Blob</a></code> object representing <a href=#a-serialization-of-the-image-as-a-file>a serialization of the
-    image as a file</a>, using <var title="">arguments</var>. <a href=#refsFILEAPI>[FILEAPI]</a> </p>
+    image as a file</a>, using <var title="">arguments</var>, and
+    with the <var title="">native</var> flag set if the method is the
+    <code title=dom-canvas-toBlobHD><a href=#dom-canvas-toblobhd>toBlobHD()</a></code> method, and
+    not otherwise. <a href=#refsFILEAPI>[FILEAPI]</a> </p>
 
    </li>
 
@@ -35627,21 +35646,37 @@
    source</dfn>. <a href=#refsFILESYSTEMAPI>[FILESYSTEMAPI]</a></li>
 
   </ol><p>When a user agent is to create <dfn id=a-serialization-of-the-image-as-a-file>a serialization of the image
-  as a file</dfn>, optionally with some given <var title="">arguments</var>, it must create an image file in the format
-  given by the first value of <var title="">arguments</var>, or, if
-  there are no <var title="">arguments</var>, in the PNG format. <a href=#refsPNG>[PNG]</a></p>
+  as a file</dfn>, optionally with some given <var title="">arguments</var>, and optionally with a <var title="">native</var> flag set, it must create an image file in the
+  format given by the first value of <var title="">arguments</var>,
+  or, if there are no <var title="">arguments</var>, in the PNG
+  format. <a href=#refsPNG>[PNG]</a></p>
 
+  <p>If the <var title="">native</var> flag is set, or if the canvas
+  bitmap has one pixel per coordinate space unit, then the image file
+  must have the same pixel data (before compression, if applicable) as
+  the canvas bitmap, and if the file format used supports encoding
+  resolution metadata, the resolution of the bitmap (device pixels per
+  coordinate space units being interpreted as image pixels per CSS
+  pixel) must be given as well.</p>
+
+  <p>Otherwise, the image file's pixel data must be the canvas
+  bitmap's pixel data scaled to one image pixel per coordinate space
+  unitl, and if the file format used supports encoding resolution
+  metadata, the resolution must be given as 96dpi (one image pixel per
+  CSS pixel).</p>
+
   <p>If <var title="">arguments</var> is not empty, the first value
   must be interpreted as a <a href=#mime-type title="MIME type">MIME type</a>
   giving the format to use. If the type has any parameters, it must be
   treated as not supported.</p>
 
-  <p class=example>For example, the value "<code>image/png</code>" would
-  mean to generate a PNG image, the value "<code>image/jpeg</code>"
-  would mean to generate a JPEG image, and the value
-  "<code>image/svg+xml</code>" would mean to generate an SVG image
-  (which would probably require that the implementation actually keep
-  enough information to reliably render an SVG image from the canvas).</p>
+  <p class=example>For example, the value "<code>image/png</code>"
+  would mean to generate a PNG image, the value
+  "<code>image/jpeg</code>" would mean to generate a JPEG image, and
+  the value "<code>image/svg+xml</code>" would mean to generate an SVG
+  image (which would probably require that the implementation actually
+  keep enough information to reliably render an SVG image from the
+  canvas).</p>
 
   <p>User agents must support PNG ("<code>image/png</code>"). User
   agents may support other types. If the user agent does not support
@@ -35814,9 +35849,11 @@
   // pixel manipulation
   <a href=#imagedata>ImageData</a> <a href=#dom-context-2d-createimagedata title=dom-context-2d-createImageData>createImageData</a>(double sw, double sh);
   <a href=#imagedata>ImageData</a> <a href=#dom-context-2d-createimagedata title=dom-context-2d-createImageData>createImageData</a>(<a href=#imagedata>ImageData</a> imagedata);
+  <a href=#imagedata>ImageData</a> <a href=#dom-context-2d-createimagedatahd title=dom-context-2d-createImageDataHD>createImageDataHD</a>(double sw, double sh);
   <a href=#imagedata>ImageData</a> <a href=#dom-context-2d-getimagedata title=dom-context-2d-getImageData>getImageData</a>(double sx, double sy, double sw, double sh);
+  <a href=#imagedata>ImageData</a> <a href=#dom-context-2d-getimagedatahd title=dom-context-2d-getImageDataHD>getImageDataHD</a>(double sx, double sy, double sw, double sh);
   void <a href=#dom-context-2d-putimagedata title=dom-context-2d-putImageData>putImageData</a>(<a href=#imagedata>ImageData</a> imagedata, double dx, double dy);
-  void <a href=#dom-context-2d-putimagedata title=dom-context-2d-putImageData>putImageData</a>(<a href=#imagedata>ImageData</a> imagedata, double dx, double dy, double dirtyX, double dirtyY, double dirtyWidth, double dirtyHeight);
+  void <a href=#dom-context-2d-putimagedatahd title=dom-context-2d-putImageDataHD>putImageDataHD</a>(<a href=#imagedata>ImageData</a> imagedata, double dx, double dy, double dirtyX, double dirtyY, double dirtyWidth, double dirtyHeight);
 };
 <a href=#canvasrenderingcontext2d>CanvasRenderingContext2D</a> implements <a href=#canvasdrawingstyles>CanvasDrawingStyles</a>;
 <a href=#canvasrenderingcontext2d>CanvasRenderingContext2D</a> implements <a href=#canvaspathmethods>CanvasPathMethods</a>;
@@ -35987,9 +36024,50 @@
   </div>
 
 
+  <h6 id=resolution><span class=secno>4.8.11.1.1 </span>Resolution</h6>
 
-  <h6 id=the-canvas-state><span class=secno>4.8.11.1.1 </span>The canvas state</h6>
+  <p>The user agent may use a bitmap of any square resolution as the
+  backing store for a canvas that uses the 2D context. Once a canvas
+  has a bitmap, that canvas must keep its resolution for its
+  lifetime.</p>
 
+  <p class=note>In general, user agents are encouraged to use a
+  resolution equal to the screen resolution. Ideally, the number of
+  device pixels per CSS pixel would be a multiple of two. Several
+  factors can affect the screen resolution: most prominently the
+  actual display resolution, but also important is the current zoom
+  level.</p>
+
+  <p>All the bitmaps created during a single <a href=#concept-task title=concept-task>task</a> for canvases that use 2D contexts
+  must have the same resolution.
+  <!--XXX 4INSERT FINGERPRINT-->
+  </p>
+
+  <pre class=idl>partial interface <a href=#screen>Screen</a> {
+  readonly attribute double <a href=#dom-screen-canvasresolution title=dom-screen-canvasResolution>canvasResolution</a>;
+};</pre>
+
+  <dl class=domintro><dt><var title="">window</var> . <code title=dom-Window-screen>screen</code> . <code title=dom-screen-canvasResolution><a href=#dom-screen-canvasresolution>canvasResolution</a></code></dt>
+
+   <dd>
+
+    <p>Returns the resolution that has been, or will be, used for bitmaps during this <a href=#concept-task title=concept-task>task</a>.</p>
+
+   </dd>
+
+  </dl><div class=impl>
+
+  <p>The <dfn id=dom-screen-canvasresolution title=dom-screen-canvasResolution><code>canvasResolution</code></dfn>
+  attribute of the <code><a href=#screen>Screen</a></code> object must return the
+  resolution, in image pixels per coordinate space units, that any
+  canvas bitmaps created during this <a href=#concept-task title=concept-task>task</a> will use (or have used). <a href=#refsCSSOMVIEW>[CSSOMVIEW]</a></p>
+
+  </div>
+
+
+
+  <h6 id=the-canvas-state><span class=secno>4.8.11.1.2 </span>The canvas state</h6>
+
   <p>Each context maintains a stack of drawing states. <dfn id=drawing-state title="drawing state">Drawing states</dfn> consist of:</p>
 
   <ul class=brief><li>The current <a href=#transformations title=dom-context-2d-transformation>transformation matrix</a>.</li>
@@ -36050,7 +36128,7 @@
   </div>
 
 
-  <h6 id=drawingstyle-objects><span class=secno>4.8.11.1.2 </span><code><a href=#drawingstyle>DrawingStyle</a></code> objects</h6>
+  <h6 id=drawingstyle-objects><span class=secno>4.8.11.1.3 </span><code><a href=#drawingstyle>DrawingStyle</a></code> objects</h6>
 
   <p>All the line styles (line width, caps, joins, and dash patterns)
   and text styles (fonts) described in the next two sections apply to
@@ -36088,7 +36166,7 @@
   </div>
 
 
-  <h6 id=line-styles><span class=secno>4.8.11.1.3 </span>Line styles</h6>
+  <h6 id=line-styles><span class=secno>4.8.11.1.4 </span>Line styles</h6>
 
   <dl class=domintro><dt><var title="">context</var> . <code title=dom-context-2d-lineWidth><a href=#dom-context-2d-linewidth>lineWidth</a></code> [ = <var title="">value</var> ]</dt>
    <dt><var title="">styles</var> . <code title=dom-context-2d-lineWidth><a href=#dom-context-2d-linewidth>lineWidth</a></code> [ = <var title="">value</var> ]</dt>
@@ -36545,7 +36623,7 @@
 hairline width with transform. ack Shaun Morris.  --></div>
 
 
-  <h6 id=text-styles><span class=secno>4.8.11.1.4 </span>Text styles</h6>
+  <h6 id=text-styles><span class=secno>4.8.11.1.5 </span>Text styles</h6>
 
   <dl class=domintro><dt><var title="">context</var> . <code title=dom-context-2d-font><a href=#dom-context-2d-font>font</a></code> [ = <var title="">value</var> ]</dt>
    <dt><var title="">styles</var> . <code title=dom-context-2d-font><a href=#dom-context-2d-font>font</a></code> [ = <var title="">value</var> ]</dt>
@@ -36884,7 +36962,7 @@
    need it, <var title="">physical alignment</var> as the alignment
    value.</li>
 
-  </ol><h6 id=building-paths><span class=secno>4.8.11.1.5 </span>Building paths</h6>
+  </ol><h6 id=building-paths><span class=secno>4.8.11.1.6 </span>Building paths</h6>
 
   <p>Each object implementing the <code><a href=#canvaspathmethods>CanvasPathMethods</a></code>
   interface has a <a href=#concept-path title=concept-path>path</a>. A <dfn id=concept-path title=concept-path>path</dfn> has a list of zero or more subpaths.
@@ -37458,7 +37536,7 @@
 
 
 
-  <h6 id=path-objects><span class=secno>4.8.11.1.6 </span><code><a href=#path>Path</a></code> objects</h6>
+  <h6 id=path-objects><span class=secno>4.8.11.1.7 </span><code><a href=#path>Path</a></code> objects</h6>
 
   <p><code><a href=#path>Path</a></code> objects can be used to declare paths that are
   then later used on <code><a href=#canvasrenderingcontext2d>CanvasRenderingContext2D</a></code> objects. In
@@ -37758,7 +37836,7 @@
 
 
 
-  <h6 id=transformations><span class=secno>4.8.11.1.7 </span><dfn title=dom-context-2d-transformation>Transformations</dfn></h6>
+  <h6 id=transformations><span class=secno>4.8.11.1.8 </span><dfn title=dom-context-2d-transformation>Transformations</dfn></h6>
 
   <p>Each <code><a href=#canvasrenderingcontext2d>CanvasRenderingContext2D</a></code> object has a
   <i>current transformation matrix</i>, as well as methods (described
@@ -37916,7 +37994,7 @@
 
 
 
-  <h6 id=fill-and-stroke-styles><span class=secno>4.8.11.1.8 </span>Fill and stroke styles</h6>
+  <h6 id=fill-and-stroke-styles><span class=secno>4.8.11.1.9 </span>Fill and stroke styles</h6>
 
   <dl class=domintro><dt><var title="">context</var> . <code title=dom-context-2d-fillStyle><a href=#dom-context-2d-fillstyle>fillStyle</a></code> [ = <var title="">value</var> ]</dt>
 
@@ -38339,7 +38417,7 @@
 
 
 
-  <h6 id=drawing-rectangles-to-the-canvas><span class=secno>4.8.11.1.9 </span>Drawing rectangles to the canvas</h6>
+  <h6 id=drawing-rectangles-to-the-canvas><span class=secno>4.8.11.1.10 </span>Drawing rectangles to the canvas</h6>
 
   <p>There are three methods that immediately draw rectangles to the
   bitmap. They each take four arguments; the first two give the <var title="">x</var> and <var title="">y</var> coordinates of the top
@@ -38428,7 +38506,7 @@
 
 
 
-  <h6 id=drawing-text-to-the-canvas><span class=secno>4.8.11.1.10 </span>Drawing text to the canvas</h6>
+  <h6 id=drawing-text-to-the-canvas><span class=secno>4.8.11.1.11 </span>Drawing text to the canvas</h6>
 
   <dl class=domintro><dt><var title="">context</var> . <code title=dom-context-2d-fillText><a href=#dom-context-2d-filltext>fillText</a></code>(<var title="">text</var>, <var title="">x</var>, <var title="">y</var> [, <var title="">maxWidth</var> ] )</dt>
    <dt><var title="">context</var> . <code title=dom-context-2d-strokeText><a href=#dom-context-2d-stroketext>strokeText</a></code>(<var title="">text</var>, <var title="">x</var>, <var title="">y</var> [, <var title="">maxWidth</var> ] )</dt>
@@ -38768,7 +38846,7 @@
 
 
 
-  <h6 id=drawing-paths-to-the-canvas><span class=secno>4.8.11.1.11 </span>Drawing paths to the canvas</h6>
+  <h6 id=drawing-paths-to-the-canvas><span class=secno>4.8.11.1.12 </span>Drawing paths to the canvas</h6>
 
   <p>The context always has a <dfn id=current-default-path>current default path</dfn>. There
   is only one <a href=#current-default-path>current default path</a>, it is not part of the
@@ -39160,7 +39238,7 @@
 
 
 
-  <h6 id=drawing-images-to-the-canvas><span class=secno>4.8.11.1.12 </span>Drawing images to the canvas</h6>
+  <h6 id=drawing-images-to-the-canvas><span class=secno>4.8.11.1.13 </span>Drawing images to the canvas</h6>
 
   <p>To draw images onto the canvas, the <dfn id=dom-context-2d-drawimage title=dom-context-2d-drawImage><code>drawImage</code></dfn> method
   can be used.</p>
@@ -39311,7 +39389,7 @@
   </div>
 
 
-  <h6 id=hit-regions><span class=secno>4.8.11.1.13 </span>Hit regions</h6>
+  <h6 id=hit-regions><span class=secno>4.8.11.1.14 </span>Hit regions</h6>
 
   <p>Each <code><a href=#the-canvas-element>canvas</a></code> element whose <a href=#primary-context>primary
   context</a> is a <code><a href=#canvasrenderingcontext2d>CanvasRenderingContext2D</a></code> object
@@ -39949,7 +40027,7 @@
   </div>
 
 
-  <h6 id=pixel-manipulation><span class=secno>4.8.11.1.14 </span><dfn>Pixel manipulation</dfn></h6>
+  <h6 id=pixel-manipulation><span class=secno>4.8.11.1.15 </span><dfn>Pixel manipulation</dfn></h6>
 
   <dl class=domintro><dt><var title="">imagedata</var> = <var title="">context</var> . <code title=dom-context-2d-createImageData><a href=#dom-context-2d-createimagedata>createImageData</a></code>(<var title="">sw</var>, <var title="">sh</var>)</dt>
 
@@ -39971,6 +40049,18 @@
 
    </dd>
 
+   <dt><var title="">imagedata</var> = <var title="">context</var> . <code title=dom-context-2d-createImageDataHD><a href=#dom-context-2d-createimagedatahd>createImageDataHD</a></code>(<var title="">sw</var>, <var title="">sh</var>)</dt>
+
+   <dd>
+
+    <p>Returns an <code><a href=#imagedata>ImageData</a></code> object whose dimensions equal
+    the dimensions given in the arguments, multiplied by the number of
+    pixels in the canvas bitmap that correspond to each coordinate
+    space unit. All the pixels in the returned object are transparent
+    black.</p>
+
+   </dd>
+
    <dt><var title="">imagedata</var> = <var title="">context</var> . <code title=dom-context-2d-getImageData><a href=#dom-context-2d-getimagedata>getImageData</a></code>(<var title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>, <var title="">sh</var>)</dt>
 
    <dd>
@@ -39988,12 +40078,34 @@
 
    </dd>
 
+   <dt><var title="">imagedata</var> = <var title="">context</var> . <code title=dom-context-2d-getImageDataHD><a href=#dom-context-2d-getimagedatahd>getImageDataHD</a></code>(<var title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>, <var title="">sh</var>)</dt>
+
+   <dd>
+
+    <p>Returns an <code><a href=#imagedata>ImageData</a></code> object containing the image
+    data for the given rectangle of the canvas.</p>
+
+    <p>Throws a <code><a href=#notsupportederror>NotSupportedError</a></code> exception if any of the
+    arguments are not finite. Throws an <code><a href=#indexsizeerror>IndexSizeError</a></code>
+    exception if the either of the width or height arguments are
+    zero.</p>
+
+    <p>The data will be returned at the same resolution as the canvas
+    bitmap.</p>
+
+   </dd>
+
    <dt><var title="">imagedata</var> . <code title=dom-imagedata-width><a href=#dom-imagedata-width>width</a></code></dt>
    <dt><var title="">imagedata</var> . <code title=dom-imagedata-height><a href=#dom-imagedata-height>height</a></code></dt>
 
    <dd>
 
-    <p>Returns the actual dimensions of the data in the <code><a href=#imagedata>ImageData</a></code> object, in device pixels.</p>
+    <p>Returns the actual dimensions of the data in the
+    <code><a href=#imagedata>ImageData</a></code> object, in pixels. For objects returned by
+    the non-HD variants of the methods in this API, this will
+    correspond to the dimensions given to the methods. For the HD
+    variants, the number of pixels might be different than the number
+    of corresponding coordinate space units.</p>
 
    </dd>
 
@@ -40028,42 +40140,96 @@
 
    </dd>
 
+   <dt><var title="">context</var> . <code title=dom-context-2d-putImageDataHD><a href=#dom-context-2d-putimagedatahd>putImageDataHD</a></code>(<var title="">imagedata</var>, <var title="">dx</var>, <var title="">dy</var> [, <var title="">dirtyX</var>, <var title="">dirtyY</var>, <var title="">dirtyWidth</var>, <var title="">dirtyHeight</var> ])</dt>
+
+   <dd>
+
+    <p>Paints the data from the given <code><a href=#imagedata>ImageData</a></code> object
+    onto the canvas, at the canvas bitmap's native resolution. If a
+    dirty rectangle is provided, only the pixels from that rectangle
+    are painted.</p>
+
+    <p>The <code title=dom-context-2d-globalAlpha><a href=#dom-context-2d-globalalpha>globalAlpha</a></code>
+    and <code title=dom-context-2d-globalCompositeOperation><a href=#dom-context-2d-globalcompositeoperation>globalCompositeOperation</a></code>
+    attributes, as well as the shadow attributes, are ignored for the
+    purposes of this method call; pixels in the canvas are replaced
+    wholesale, with no composition, alpha blending, no shadows,
+    etc.</p>
+
+    <p>Throws a <code><a href=#notsupportederror>NotSupportedError</a></code> exception if any of the
+    arguments are not finite.</p>
+
+   </dd>
+
   </dl><div class=impl>
 
-  <p>The <dfn id=dom-context-2d-createimagedata title=dom-context-2d-createImageData><code>createImageData()</code></dfn>
-  method is used to instantiate new blank <code><a href=#imagedata>ImageData</a></code>
-  objects. When the method is invoked with two arguments <var title="">sw</var> and <var title="">sh</var>, it must return an
-  <code><a href=#imagedata>ImageData</a></code> object representing a rectangle with a width
-  in equal to the absolute magnitude of <var title="">sw</var> and a
-  height equal to the absolute magnitude of <var title="">sh</var>.
-  When invoked with a single <var title="">imagedata</var> argument,
-  it must return an <code><a href=#imagedata>ImageData</a></code> object representing a
-  rectangle with the same dimensions as the <code><a href=#imagedata>ImageData</a></code>
-  object passed as the argument. The <code><a href=#imagedata>ImageData</a></code> object
-  returned must be filled with transparent black.</p>
+  <p>The <code title=dom-context-2d-createImageData><a href=#dom-context-2d-createimagedata>createImageData()</a></code> and
+  <code title=dom-context-2d-createImageDataHD><a href=#dom-context-2d-createimagedatahd>createImageDataHD()</a></code>
+  methods are used to instantiate new blank <code><a href=#imagedata>ImageData</a></code>
+  objects.</p>
 
+  <p>When the <dfn id=dom-context-2d-createimagedata title=dom-context-2d-createImageData><code>createImageData()</code></dfn>
+  method is invoked with two arguments <var title="">sw</var> and <var title="">sh</var>, it must return a new <code><a href=#imagedata>ImageData</a></code>
+  object representing a rectangle with a width in equal to the
+  absolute magnitude of <var title="">sw</var> and a height equal to
+  the absolute magnitude of <var title="">sh</var>. When invoked with
+  a single <var title="">imagedata</var> argument, it must return a
+  new <code><a href=#imagedata>ImageData</a></code> object representing a rectangle with the
+  same dimensions as the <code><a href=#imagedata>ImageData</a></code> object passed as the
+  argument. The <code><a href=#imagedata>ImageData</a></code> object returned must be filled
+  with transparent black.</p>
+
+  <p>When the <dfn id=dom-context-2d-createimagedatahd title=dom-context-2d-createImageDataHD><code>createImageDataHD()</code></dfn>
+  method is invoked (with its two arguments <var title="">sw</var> and
+  <var title="">sh</var>) it must return a new <code><a href=#imagedata>ImageData</a></code>
+  object representing a rectangle with a width in equal to the
+  absolute magnitude of <var title="">sw</var> multiplied by <var title="">scale</var> and a height equal to the absolute magnitude of
+  <var title="">sh</var> multiplied by <var title="">scale</var>,
+  where <var title="">scale</var> is the number of pixels in the
+  canvas bitmap per coordinate space units. The <code><a href=#imagedata>ImageData</a></code>
+  object returned must be filled with transparent black.</p>
+
   <p>The <dfn id=dom-context-2d-getimagedata title=dom-context-2d-getImageData><code>getImageData(<var title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>,
-  <var title="">sh</var>)</code></dfn> method must,
-<!--ADD-TOPIC:Security-->
+  <var title="">sh</var>)</code></dfn> method must, if either the <var title="">sw</var> or <var title="">sh</var> arguments are zero,
+  throw an <code><a href=#indexsizeerror>IndexSizeError</a></code> exception; otherwise,
+  <!--ADD-TOPIC:Security-->
   if the <code><a href=#the-canvas-element>canvas</a></code> element's <i>origin-clean</i> flag is set
-  to false, throw a <code><a href=#securityerror>SecurityError</a></code> exception; otherwise, it
-<!--REMOVE-TOPIC:Security-->
-  must return an <code><a href=#imagedata>ImageData</a></code> object with width <var title="">sw</var> and height <var title="">sh</var> representing the
-  underlying pixel data for the area of the canvas denoted by the
-  rectangle whose corners are the four points (<var title="">sx</var>,
-  <var title="">sy</var>), (<span title=""><var title="">sx</var>+<var title="">sw</var></span>, <var title="">sy</var>), (<span title=""><var title="">sx</var>+<var title="">sw</var></span>, <span title=""><var title="">sy</var>+<var title="">sh</var></span>),
-  (<var title="">sx</var>, <span title=""><var title="">sy</var>+<var title="">sh</var></span>), in canvas coordinate space units. Pixels
-  outside the canvas must be returned as transparent black. Pixels
-  must be returned as non-premultiplied alpha values.</p>
+  to false, it must throw a <code><a href=#securityerror>SecurityError</a></code> exception;
+  <!--REMOVE-TOPIC:Security-->
+  otherwise, it must return an <code><a href=#imagedata>ImageData</a></code> object with
+  width <var title="">sw</var> and height <var title="">sh</var>
+  representing the canvas bitmap for the area of the canvas denoted by
+  the rectangle whose corners are the four points (<var title="">sx</var>, <var title="">sy</var>), (<span title=""><var title="">sx</var>+<var title="">sw</var></span>, <var title="">sy</var>), (<span title=""><var title="">sx</var>+<var title="">sw</var></span>, <span title=""><var title="">sy</var>+<var title="">sh</var></span>), (<var title="">sx</var>, <span title=""><var title="">sy</var>+<var title="">sh</var></span>), in
+  canvas coordinate space units. If the canvas bitmap does not
+  represent each coordinate space unit square using exactly one pixel,
+  the value of each pixel in the returned abject must be derived from
+  the value(s) of the pixel(s) in the canvas bitmap that correspond to
+  the same coordinate. Pixels outside the canvas must be returned as
+  transparent black. Pixels must be returned as non-premultiplied
+  alpha values.</p>
 
-  <p>If either the <var title="">sw</var> or <var title="">sh</var>
-  arguments are zero, the method must instead throw an
-  <code><a href=#indexsizeerror>IndexSizeError</a></code> exception.</p>
+  <p>The <dfn id=dom-context-2d-getimagedatahd title=dom-context-2d-getImageDataHD><code>getImageDataHD(<var title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>,
+  <var title="">sh</var>)</code></dfn> method must, if either the <var title="">sw</var> or <var title="">sh</var> arguments are zero,
+  throw an <code><a href=#indexsizeerror>IndexSizeError</a></code> exception; otherwise,
+  <!--ADD-TOPIC:Security-->
+  if the <code><a href=#the-canvas-element>canvas</a></code> element's <i>origin-clean</i> flag is set
+  to false, it must throw a <code><a href=#securityerror>SecurityError</a></code> exception;
+  <!--REMOVE-TOPIC:Security-->
+  otherwise, it must return an <code><a href=#imagedata>ImageData</a></code> object with
+  width <var title="">sw</var> multiplied by <var title="">scale</var>
+  and height <var title="">sh</var> multiplied by <var title="">scale</var> representing the canvas bitmap data for the
+  area of the canvas denoted by the rectangle whose corners are the
+  four points (<var title="">sx</var>, <var title="">sy</var>), (<span title=""><var title="">sx</var>+<var title="">sw</var></span>, <var title="">sy</var>), (<span title=""><var title="">sx</var>+<var title="">sw</var></span>, <span title=""><var title="">sy</var>+<var title="">sh</var></span>), (<var title="">sx</var>, <span title=""><var title="">sy</var>+<var title="">sh</var></span>), in
+  canvas coordinate space units. Pixels outside the canvas must be
+  returned as transparent black. Pixels must be returned as
+  non-premultiplied alpha values.</p>
 
-  <p><code><a href=#imagedata>ImageData</a></code> objects must be initialized so that their
-  <dfn id=dom-imagedata-width title=dom-imagedata-width><code>width</code></dfn> attribute
-  is set to the number of pixels per row in the image data, their <dfn id=dom-imagedata-height title=dom-imagedata-height><code>height</code></dfn> attribute is
-  set to the number of rows in the image data, and their <dfn id=dom-imagedata-data title=dom-imagedata-data><code>data</code></dfn> attribute is
+  <p>New <code><a href=#imagedata>ImageData</a></code> objects must be initialized so that
+  their <dfn id=dom-imagedata-width title=dom-imagedata-width><code>width</code></dfn>
+  attribute is set to the number of pixels per row in the image data,
+  their <dfn id=dom-imagedata-height title=dom-imagedata-height><code>height</code></dfn>
+  attribute is set to the number of rows in the image data, and their
+  <dfn id=dom-imagedata-data title=dom-imagedata-data><code>data</code></dfn> attribute is
   initialized to a <code><a href=#uint8clampedarray>Uint8ClampedArray</a></code> object. The
   <code><a href=#uint8clampedarray>Uint8ClampedArray</a></code> object must use a <a href=#canvas-pixel-arraybuffer>Canvas Pixel
   <code>ArrayBuffer</code></a> for its storage, and must have a
@@ -40082,15 +40248,15 @@
   consecutive indices starting with 0 for the top left pixel's red
   component. <a href=#refsTYPEDARRAY>[TYPEDARRAY]</a></p>
 
-  <p>The <dfn id=dom-context-2d-putimagedata title=dom-context-2d-putImageData><code>putImageData(<var title="">imagedata</var>, <var title="">dx</var>, <var title="">dy</var>, <var title="">dirtyX</var>, <var title="">dirtyY</var>, <var title="">dirtyWidth</var>, <var title="">dirtyHeight</var>)</code></dfn> method writes data from
-  <code><a href=#imagedata>ImageData</a></code> structures back to the canvas.</p>
+  <p>The <dfn id=dom-context-2d-putimagedata title=dom-context-2d-putImageData><code>putImageData()</code></dfn>
+  and <dfn id=dom-context-2d-putimagedatahd title=dom-context-2d-putImageDataHD><code>putImageDataHD()</code></dfn>
+  methods write data from <code><a href=#imagedata>ImageData</a></code> structures back to
+  the canvas. Their arguments are: <var title="">imagedata</var>, <var title="">dx</var>, <var title="">dy</var>, <var title="">dirtyX</var>, <var title="">dirtyY</var>, <var title="">dirtyWidth</var>, and <var title="">dirtyHeight</var>.</p>
 
-  <p>When the last four arguments are omitted, they must be assumed to
-  have the values 0, 0, the <code title=dom-imagedata-width><a href=#dom-imagedata-width>width</a></code> member of the <var title="">imagedata</var> structure, and the <code title=dom-imagedata-height><a href=#dom-imagedata-height>height</a></code> member of the <var title="">imagedata</var> structure, respectively.</p>
+  <p>When the last four arguments to these methods are omitted, they
+  must be assumed to have the values 0, 0, the <code title=dom-imagedata-width><a href=#dom-imagedata-width>width</a></code> member of the <var title="">imagedata</var> structure, and the <code title=dom-imagedata-height><a href=#dom-imagedata-height>height</a></code> member of the <var title="">imagedata</var> structure, respectively.</p>
 
-  <p>When invoked with arguments that do not, per the last few
-  paragraphs, cause an exception to be thrown, the <code title=dom-context-2d-putImageData><a href=#dom-context-2d-putimagedata>putImageData()</a></code> method
-  must act as follows:</p>
+  <p>When invoked, these methods must act as follows:</p>
 
   <ol><li>
 
@@ -40132,107 +40298,92 @@
 
    <li>
 
-    <p>Draw the region of the image data in the horizontal rectangle
-    whose top left corner is at (<var title="">dirtyX</var>,<var title="">dirtyY</var>) and whose bottom right corner is at (<span title=""><var title="">dirtyX</var>+<var title="">dirtyWidth</var></span>,<span title=""><var title="">dirtyY</var>+<var title="">dirtyHeight</var></span>) onto
-    the canvas, aligned such that the top left of the rectangle is at
-    coordinate (<var title="">dx</var>,<var title="">dy</var>).</p>
+    <p>Run the appropriate steps from the following list:</p>
 
-    <p>If the <code title=dom-context-2d-imageSmoothingEnabled><a href=#dom-context-2d-imagesmoothingenabled>imageSmoothingEnabled</a></code>
-    attribute is set to true, then the user agent should attempt to
-    apply a smoothing algorithm to the image data if the canvas does
-    not have exactly one device pixel per coordinate space unit in its
-    underlying pixel data.</p>
+    <dl class=switch><dt>If the method was <code title=dom-context-2d-putImageData><a href=#dom-context-2d-putimagedata>putImageData()</a></code></dt>
 
-   </li>
+     <dd>
 
-  </ol><!-- XXXXX
+      <p>Draw the region of the image data in the horizontal rectangle
+      whose top left corner is at (<var title="">dirtyX</var>,<var title="">dirtyY</var>) and whose bottom right corner is at
+      (<span title=""><var title="">dirtyX</var>+<var title="">dirtyWidth</var></span>,<span title=""><var title="">dirtyY</var>+<var title="">dirtyHeight</var></span>)
+      onto the canvas, aligned such that the top left of the rectangle
+      is at coordinate (<var title="">dx</var>,<var title="">dy</var>).</p>
 
-   <li>
+      <p>If the <code title=dom-context-2d-imageSmoothingEnabled><a href=#dom-context-2d-imagesmoothingenabled>imageSmoothingEnabled</a></code>
+      attribute is set to true, then the user agent should attempt to
+      apply a smoothing algorithm to the image data if the canvas does
+      not have exactly one device pixel per coordinate space unit in
+      the canvas bitmap.</p>
 
-    <p>Let <var title="">scale</var> be the number of device pixels in
-    the underlying pixel data of the canvas per coordinate space
-    unit.</p>
+     </dd>
 
-   </li>
+     <dt>If the method was <code title=dom-context-2d-putImageDataHD><a href=#dom-context-2d-putimagedatahd>putImageDataHD()</a></code></dt>
 
-   <li>
+     <dd>
 
-    <p>Let <var title="">dx<sub>device</sub></var> be the x-coordinate
-    of the device pixel in the underlying pixel data of the canvas
-    corresponding to the <var title="">dx</var> coordinate in the
-    canvas coordinate space.</p>
+      <ol><li>
 
-    <p>Let <var title="">dy<sub>device</sub></var> be the y-coordinate
-    of the device pixel in the underlying pixel data of the canvas
-    corresponding to the <var title="">dy</var> coordinate in the
-    canvas coordinate space.</p>
+        <p>Let <var title="">dx<sub>device</sub></var> be the x-coordinate
+        of the device pixel in the canvas bitmap corresponding to the <var title="">dx</var> coordinate in the canvas coordinate space.</p>
 
-   </li>
+        <p>Let <var title="">dy<sub>device</sub></var> be the y-coordinate
+        of the device pixel in the canvas bitmap corresponding to the <var title="">dy</var> coordinate in the canvas coordinate space.</p>
 
-   <li><p>Otherwise, for all integer values of <var title="">x</var>
-   and <var title="">y</var> where <span title=""><var
-   title="">dirtyX</var> ≤ <var
-   title="">x</var> < <span title=""><var
-   title="">dirtyX</var>+<var title="">dirtyWidth</var></span></span>
-   and <span title=""><var title="">dirtyY</var> ≤ <var
-   title="">y</var> < <span title=""><var
-   title="">dirtyY</var>+<var
-   title="">dirtyHeight</var></span></span>, copy the four channels of
-   the pixel with coordinate (<var title="">x</var>, <var
-   title="">y</var>) in the <var title="">imagedata</var> data
-   structure to the pixel with coordinate (<span title=""><var
-   title="">dx<sub>device</sub></var>+<var title="">x</var></span>,
-   <span title=""><var title="">dy<sub>device</sub></var>+<var
-   title="">y</var></span>) in the underlying pixel data of the
-   canvas.</p></li>
+       </li>
 
-  <p>The handling of pixel rounding when the specified coordinates do
+       <li><p>For all integer values of <var title="">x</var>
+       and <var title="">y</var> where <span title=""><var title="">dirtyX</var> ≤ <var title="">x</var> < <span title=""><var title="">dirtyX</var>+<var title="">dirtyWidth</var></span></span>
+       and <span title=""><var title="">dirtyY</var> ≤ <var title="">y</var> < <span title=""><var title="">dirtyY</var>+<var title="">dirtyHeight</var></span></span>, copy the four channels of
+       the pixel with coordinate (<var title="">x</var>, <var title="">y</var>) in the <var title="">imagedata</var> data
+       structure to the pixel with coordinate (<span title=""><var title="">dx<sub>device</sub></var>+<var title="">x</var></span>,
+       <span title=""><var title="">dy<sub>device</sub></var>+<var title="">y</var></span>) in the canvas bitmap of the
+       canvas.</li>
+
+      </ol></dd>
+
+    </dl></li>
+
+  </ol><p>The handling of pixel rounding when the specified coordinates do
   not exactly map to the device coordinate space is not defined by
   this specification, except that the following must result in no
   visible changes to the rendering:</p>
 
-  <pre>context.putImageData(context.getImageData(x, y, w, h), p, q);</pre>
+  <pre>context.putImageDataHD(context.getImageDataHD(x, y, w, h), p, q);</pre>
 
   <p>...for any value of <var title="">x</var>, <var title="">y</var>,
-  <var title="">w</var>, and <var title="">h</var> and where <var
-  title="">p</var> is the smaller of <var title="">x</var> and the sum
-  of <var title="">x</var> and <var title="">w</var>, and <var
-  title="">q</var> is the smaller of <var title="">y</var> and the sum
+  <var title="">w</var>, and <var title="">h</var> and where <var title="">p</var> is the smaller of <var title="">x</var> and the sum
+  of <var title="">x</var> and <var title="">w</var>, and <var title="">q</var> is the smaller of <var title="">y</var> and the sum
   of <var title="">y</var> and <var title="">h</var>; and except that
   the following two calls:</p>
 
   <pre>context.createImageData(w, h);
 context.getImageData(0, 0, w, h);</pre>
 
-  <p>...must return <code>ImageData</code> objects with the same
-  dimensions, for any value of <var title="">w</var> and <var
-  title="">h</var>. In other words, while user agents may round the
-  arguments of these methods so that they map to device pixel
-  boundaries, any rounding performed must be performed consistently
-  for all of the <code
-  title="dom-context-2d-getImageData">createImageData()</code>, <code
-  title="dom-context-2d-getImageData">getImageData()</code> and <code
-  title="dom-context-2d-putImageData">putImageData()</code>
-  operations.</p>
+  <p>...must return <code><a href=#imagedata>ImageData</a></code> objects with the same
+  dimensions as each other, and the following two calls:<p>
 
-  <p class="note">This implies that the data returned by <code
-  title="dom-context-2d-getImageData">getImageData()</code> is at the
-  resolution of the canvas backing store. This is likely to not be one
-  device pixel to each CSS pixel if the display used is a high
-  resolution display.</p>
+  <pre>context.createImageDataHD(w, h);
+context.getImageDataHD(0, 0, w, h);</pre>
 
-  <p class="note">Due to the lossy nature of converting to and from
+  <p>...must also return <code><a href=#imagedata>ImageData</a></code> objects with the same
+  dimensions as each other, for any value of <var title="">w</var> and
+  <var title="">h</var> in both cases. In other words, while user
+  agents may round the arguments of these methods so that they map to
+  device pixel boundaries, any rounding performed must be performed
+  consistently for all of the methods described in this section.</p>
+
+  <p class=note>Due to the lossy nature of converting to and from
   premultiplied alpha color values, pixels that have just been set
-  using <code
-  title="dom-context-2d-putImageData">putImageData()</code> might be
-  returned to an equivalent <code
-  title="dom-context-2d-getImageData">getImageData()</code> as
+  using <code title=dom-context-2d-putImageDataHD><a href=#dom-context-2d-putimagedatahd>putImageDataHD()</a></code> might
+  be returned to an equivalent <code title=dom-context-2d-getImageDataHD><a href=#dom-context-2d-getimagedatahd>getImageDataHD()</a></code> as
   different values.</p>
---><p>The current path, <a href=#transformations title=dom-context-2d-transformation>transformation matrix</a>,
+
+  <p>The current path, <a href=#transformations title=dom-context-2d-transformation>transformation matrix</a>,
   <a href=#shadows title=shadows>shadow attributes</a>, <a href=#dom-context-2d-globalalpha title=dom-context-2d-globalAlpha>global alpha</a>, the
   <a href=#clipping-region>clipping region</a>, and <a href=#dom-context-2d-globalcompositeoperation title=dom-context-2d-globalCompositeOperation>global composition
-  operator</a> must not affect the <code title=dom-context-2d-getImageData><a href=#dom-context-2d-getimagedata>getImageData()</a></code> and <code title=dom-context-2d-putImageData><a href=#dom-context-2d-putimagedata>putImageData()</a></code>
-  methods.</p>
+  operator</a> must not affect the methods described in this
+  section.</p>
 
   </div>
 
@@ -40245,7 +40396,7 @@
 var context = canvas.getContext('2d');
 
 // create a blank slate
-var data = context.createImageData(canvas.width, canvas.height);
+var data = context.createImageDataHD(canvas.width, canvas.height);
 
 // create some plasma
 FillPlasma(data, 'green'); // green plasma
@@ -40254,7 +40405,7 @@
 AddCloud(data, data.width/2, data.height/2); // put a cloud in the middle
 
 // paint the plasma+cloud on the canvas
-context.putImageData(data, 0, 0);
+context.putImageDataHD(data, 0, 0);
 
 // support methods
 function FillPlasma(data, color) { ... }
@@ -40264,8 +40415,9 @@
 
   <div class=example>
 
-   <p>Here is an example of using <code title=dom-context-2d-getImageData><a href=#dom-context-2d-getimagedata>getImageData()</a></code> and <code title=dom-context-2d-putImageData><a href=#dom-context-2d-putimagedata>putImageData()</a></code> to
-   implement an edge detection filter.</p>
+   <p>Here is an example of using <code title=dom-context-2d-getImageDataHD><a href=#dom-context-2d-getimagedatahd>getImageDataHD()</a></code> and
+   <code title=dom-context-2d-putImageDataHD><a href=#dom-context-2d-putimagedatahd>putImageDataHD()</a></code>
+   to implement an edge detection filter.</p>
 
    <pre><!DOCTYPE HTML>
 <html>
@@ -40285,10 +40437,10 @@
      context.drawImage(image, 0, 0);
 
      // get the image data to manipulate
-     var input = context.getImageData(0, 0, canvas.width, canvas.height);
+     var input = context.getImageDataHD(0, 0, canvas.width, canvas.height);
 
      // get an empty slate to put the data into
-     var output = context.createImageData(canvas.width, canvas.height);
+     var output = context.createImageDataHD(canvas.width, canvas.height);
 
      // alias some variables for convenience
      // notice that we are using input.width and input.height here
@@ -40312,7 +40464,7 @@
      }
 
      // put the image data back after manipulation
-     context.putImageData(output, 0, 0);
+     context.putImageDataHD(output, 0, 0);
    }
   </script>
  </head>
@@ -40326,7 +40478,7 @@
 
 
 
-  <h6 id=compositing><span class=secno>4.8.11.1.15 </span>Compositing</h6>
+  <h6 id=compositing><span class=secno>4.8.11.1.16 </span>Compositing</h6>
 
   <dl class=domintro><dt><var title="">context</var> . <code title=dom-context-2d-globalAlpha><a href=#dom-context-2d-globalalpha>globalAlpha</a></code> [ = <var title="">value</var> ]</dt>
 
@@ -40487,7 +40639,7 @@
 
 
 
-  <h6 id=image-smoothing><span class=secno>4.8.11.1.16 </span>Image smoothing</h6>
+  <h6 id=image-smoothing><span class=secno>4.8.11.1.17 </span>Image smoothing</h6>
 
   <dl class=domintro><dt><var title="">context</var> . <code title=dom-context-2d-imageSmoothingEnabled><a href=#dom-context-2d-imagesmoothingenabled>imageSmoothingEnabled</a></code> [ = <var title="">value</var> ]</dt>
 
@@ -40513,7 +40665,7 @@
   </div>
 
 
-  <h6 id=shadows><span class=secno>4.8.11.1.17 </span><dfn>Shadows</dfn></h6>
+  <h6 id=shadows><span class=secno>4.8.11.1.18 </span><dfn>Shadows</dfn></h6>
 
   <p>All drawing operations are affected by the four global shadow
   attributes.</p>
@@ -40654,7 +40806,7 @@
 
   <div class=impl>
 
-  <h6 id=drawing-model><span class=secno>4.8.11.1.18 </span><dfn>Drawing model</dfn></h6>
+  <h6 id=drawing-model><span class=secno>4.8.11.1.19 </span><dfn>Drawing model</dfn></h6>
 
   <p>When a shape or image is painted, user agents must follow these
   steps, in the order given (or act as if they do):</p>
@@ -40685,7 +40837,7 @@
   </ol></div>
 
 
-  <h6 id=best-practices><span class=secno>4.8.11.1.19 </span>Best practices</h6>
+  <h6 id=best-practices><span class=secno>4.8.11.1.20 </span>Best practices</h6>
 
   <p><i>This section is non-normative.</i></p>
 
@@ -40747,7 +40899,7 @@
   attribute.</p>
 
 
-  <h6 id=examples><span class=secno>4.8.11.1.20 </span>Examples</h6>
+  <h6 id=examples><span class=secno>4.8.11.1.21 </span>Examples</h6>
 
   <p><i>This section is non-normative.</i></p>
 
@@ -40817,14 +40969,14 @@
   rendering the actual canvas bitmap to the output device.</p>
 
   <p class=note>Thus, in the 2D context, colors used to draw shapes
-  onto the canvas will exactly match colors obtained through the <code title=dom-context-2d-getImageData><a href=#dom-context-2d-getimagedata>getImageData()</a></code>
+  onto the canvas will exactly match colors obtained through the <code title=dom-context-2d-getImageDataHD><a href=#dom-context-2d-getimagedatahd>getImageDataHD()</a></code>
   method.</p>
 
   <p>The <code title=dom-canvas-toDataURL><a href=#dom-canvas-todataurl>toDataURL()</a></code> method
-  must not include color space information in the resource
-  returned. Where the output format allows it, the color of pixels in
-  resources created by <code title=dom-canvas-toDataURL><a href=#dom-canvas-todataurl>toDataURL()</a></code> must match those
-  returned by the <code title=dom-context-2d-getImageData><a href=#dom-context-2d-getimagedata>getImageData()</a></code>
+  must not include color space information in the resource returned.
+  Where the output format allows it, the color of pixels in resources
+  created by <code title=dom-canvas-toDataURL><a href=#dom-canvas-todataurl>toDataURLHD()</a></code>
+  must match those returned by the <code title=dom-context-2d-getImageDataHD><a href=#dom-context-2d-getimagedatahd>getImageDataHD()</a></code>
   method.</p>
 
   <p>In user agents that support CSS, the color space used by a
@@ -40909,9 +41061,9 @@
    whether or not a particular glyph is in the font in the first
    place. -->
 
-  </ul><p>The <code title=dom-canvas-toDataURL><a href=#dom-canvas-todataurl>toDataURL()</a></code>, <code title=dom-canvas-toBlob><a href=#dom-canvas-toblob>toBlob()</a></code>, and <code title=dom-context-2d-getImageData><a href=#dom-context-2d-getimagedata>getImageData()</a></code> methods
-  check the flag and will throw a <code><a href=#securityerror>SecurityError</a></code> exception
-  rather than leak cross-origin data.</p>
+  </ul><p>The <code title=dom-canvas-toDataURL><a href=#dom-canvas-todataurl>toDataURL()</a></code>, <code title=dom-canvas-toDataURLHD><a href=#dom-canvas-todataurlhd>toDataURLHD()</a></code>, <code title=dom-canvas-toBlob><a href=#dom-canvas-toblob>toBlob()</a></code>, <code title=dom-context-2d-getImageData><a href=#dom-context-2d-getimagedata>getImageData()</a></code>, and <code title=dom-context-2d-getImageDataHD><a href=#dom-context-2d-getimagedatahd>getImageDataHD()</a></code>
+  methods check the flag and will throw a <code><a href=#securityerror>SecurityError</a></code>
+  exception rather than leak cross-origin data.</p>
 
   <p class=note>Even resetting the canvas state by changing its
   <code title=attr-canvas-width><a href=#attr-canvas-width>width</a></code> or <code title=attr-canvas-height><a href=#attr-canvas-height>height</a></code> attributes doesn't reset

Modified: index
===================================================================
--- index	2012-07-16 19:16:26 UTC (rev 7177)
+++ index	2012-07-17 07:45:34 UTC (rev 7178)
@@ -240,7 +240,7 @@
 
   <header class=head id=head><p><a class=logo href=http://www.whatwg.org/><img alt=WHATWG height=101 src=/images/logo width=101></a></p>
    <hgroup><h1 class=allcaps>HTML</h1>
-    <h2 class="no-num no-toc">Living Standard — Last Updated 16 July 2012</h2>
+    <h2 class="no-num no-toc">Living Standard — Last Updated 17 July 2012</h2>
    </hgroup><dl><dt><strong>Web developer edition:</strong></dt>
     <dd><strong><a href=http://developers.whatwg.org/>http://developers.whatwg.org/</a></strong></dd>
     <dt>Multiple-page version:</dt>
@@ -598,26 +598,27 @@
       <ol>
        <li><a href=#2dcontext><span class=secno>4.8.11.1 </span>The 2D context</a>
         <ol>
-         <li><a href=#the-canvas-state><span class=secno>4.8.11.1.1 </span>The canvas state</a></li>
-         <li><a href=#drawingstyle-objects><span class=secno>4.8.11.1.2 </span><code>DrawingStyle</code> objects</a></li>
-         <li><a href=#line-styles><span class=secno>4.8.11.1.3 </span>Line styles</a></li>
-         <li><a href=#text-styles><span class=secno>4.8.11.1.4 </span>Text styles</a></li>
-         <li><a href=#building-paths><span class=secno>4.8.11.1.5 </span>Building paths</a></li>
-         <li><a href=#path-objects><span class=secno>4.8.11.1.6 </span><code>Path</code> objects</a></li>
-         <li><a href=#transformations><span class=secno>4.8.11.1.7 </span>Transformations</a></li>
-         <li><a href=#fill-and-stroke-styles><span class=secno>4.8.11.1.8 </span>Fill and stroke styles</a></li>
-         <li><a href=#drawing-rectangles-to-the-canvas><span class=secno>4.8.11.1.9 </span>Drawing rectangles to the canvas</a></li>
-         <li><a href=#drawing-text-to-the-canvas><span class=secno>4.8.11.1.10 </span>Drawing text to the canvas</a></li>
-         <li><a href=#drawing-paths-to-the-canvas><span class=secno>4.8.11.1.11 </span>Drawing paths to the canvas</a></li>
-         <li><a href=#drawing-images-to-the-canvas><span class=secno>4.8.11.1.12 </span>Drawing images to the canvas</a></li>
-         <li><a href=#hit-regions><span class=secno>4.8.11.1.13 </span>Hit regions</a></li>
-         <li><a href=#pixel-manipulation><span class=secno>4.8.11.1.14 </span>Pixel manipulation</a></li>
-         <li><a href=#compositing><span class=secno>4.8.11.1.15 </span>Compositing</a></li>
-         <li><a href=#image-smoothing><span class=secno>4.8.11.1.16 </span>Image smoothing</a></li>
-         <li><a href=#shadows><span class=secno>4.8.11.1.17 </span>Shadows</a></li>
-         <li><a href=#drawing-model><span class=secno>4.8.11.1.18 </span>Drawing model</a></li>
-         <li><a href=#best-practices><span class=secno>4.8.11.1.19 </span>Best practices</a></li>
-         <li><a href=#examples><span class=secno>4.8.11.1.20 </span>Examples</a></ol></li>
+         <li><a href=#resolution><span class=secno>4.8.11.1.1 </span>Resolution</a></li>
+         <li><a href=#the-canvas-state><span class=secno>4.8.11.1.2 </span>The canvas state</a></li>
+         <li><a href=#drawingstyle-objects><span class=secno>4.8.11.1.3 </span><code>DrawingStyle</code> objects</a></li>
+         <li><a href=#line-styles><span class=secno>4.8.11.1.4 </span>Line styles</a></li>
+         <li><a href=#text-styles><span class=secno>4.8.11.1.5 </span>Text styles</a></li>
+         <li><a href=#building-paths><span class=secno>4.8.11.1.6 </span>Building paths</a></li>
+         <li><a href=#path-objects><span class=secno>4.8.11.1.7 </span><code>Path</code> objects</a></li>
+         <li><a href=#transformations><span class=secno>4.8.11.1.8 </span>Transformations</a></li>
+         <li><a href=#fill-and-stroke-styles><span class=secno>4.8.11.1.9 </span>Fill and stroke styles</a></li>
+         <li><a href=#drawing-rectangles-to-the-canvas><span class=secno>4.8.11.1.10 </span>Drawing rectangles to the canvas</a></li>
+         <li><a href=#drawing-text-to-the-canvas><span class=secno>4.8.11.1.11 </span>Drawing text to the canvas</a></li>
+         <li><a href=#drawing-paths-to-the-canvas><span class=secno>4.8.11.1.12 </span>Drawing paths to the canvas</a></li>
+         <li><a href=#drawing-images-to-the-canvas><span class=secno>4.8.11.1.13 </span>Drawing images to the canvas</a></li>
+         <li><a href=#hit-regions><span class=secno>4.8.11.1.14 </span>Hit regions</a></li>
+         <li><a href=#pixel-manipulation><span class=secno>4.8.11.1.15 </span>Pixel manipulation</a></li>
+         <li><a href=#compositing><span class=secno>4.8.11.1.16 </span>Compositing</a></li>
+         <li><a href=#image-smoothing><span class=secno>4.8.11.1.17 </span>Image smoothing</a></li>
+         <li><a href=#shadows><span class=secno>4.8.11.1.18 </span>Shadows</a></li>
+         <li><a href=#drawing-model><span class=secno>4.8.11.1.19 </span>Drawing model</a></li>
+         <li><a href=#best-practices><span class=secno>4.8.11.1.20 </span>Best practices</a></li>
+         <li><a href=#examples><span class=secno>4.8.11.1.21 </span>Examples</a></ol></li>
        <li><a href=#color-spaces-and-color-correction><span class=secno>4.8.11.2 </span>Color spaces and color correction</a></li>
        <li><a href=#security-with-canvas-elements><span class=secno>4.8.11.3 </span>Security with <code>canvas</code> elements</a></ol></li>
      <li><a href=#the-map-element><span class=secno>4.8.12 </span>The <code>map</code> element</a></li>
@@ -4163,7 +4164,8 @@
     implementations that support scripting. The following features and
     terms are defined in the CSSOM specifications: <a href=#refsCSSOM>[CSSOM]</a> <a href=#refsCSSOMVIEW>[CSSOMVIEW]</a>
 
-    <ul class=brief><li><dfn id=linkstyle><code>LinkStyle</code></dfn></li>
+    <ul class=brief><li><dfn id=screen><code>Screen</code></dfn></li>
+     <li><dfn id=linkstyle><code>LinkStyle</code></dfn></li>
      <li><dfn id=cssstyledeclaration><code>CSSStyleDeclaration</code></dfn></li>
      <li><dfn id=stylesheet><code>StyleSheet</code></dfn></li>
      <li><dfn id=dom-linkstyle-sheet title=dom-linkstyle-sheet><code>sheet</code></dfn></li>
@@ -35298,7 +35300,9 @@
            attribute unsigned long <a href=#dom-canvas-height title=dom-canvas-height>height</a>;
 
   DOMString <a href=#dom-canvas-todataurl title=dom-canvas-toDataURL>toDataURL</a>(optional DOMString type, any... args);
+  DOMString <a href=#dom-canvas-todataurlhd title=dom-canvas-toDataURLHD>toDataURLHD</a>(optional DOMString type, any... args);
   void <a href=#dom-canvas-toblob title=dom-canvas-toBlob>toBlob</a>(<a href=#filecallback>FileCallback</a>? _callback, optional DOMString type, any... args);
+  void <a href=#dom-canvas-toblobhd title=dom-canvas-toBlobHD>toBlobHD</a>(<a href=#filecallback>FileCallback</a>? _callback, optional DOMString type, any... args);
 
   object? <a href=#dom-canvas-getcontext title=dom-canvas-getContext>getContext</a>(DOMString contextId, any... args);
 };</pre>
@@ -35527,6 +35531,7 @@
   </div>
 
   <hr><dl class=domintro><dt><var title="">url</var> = <var title="">canvas</var> . <code title=dom-canvas-toDataURL><a href=#dom-canvas-todataurl>toDataURL</a></code>( [ <var title="">type</var>, ... ] )</dt>
+   <dt><var title="">url</var> = <var title="">canvas</var> . <code title=dom-canvas-toDataURLHD><a href=#dom-canvas-todataurlhd>toDataURLHD</a></code>( [ <var title="">type</var>, ... ] )</dt>
 
    <dd>
 
@@ -35546,9 +35551,14 @@
     to this is if the canvas has either no height or no width, in
     which case the result might simply be "<code title="">data:,</code>".)</p>
 
+    <p>The <code title=dom-canvas-toDataURL><a href=#dom-canvas-todataurl>toDataURL()</a></code>
+    method returns the data at a resolution of 96dpi. The <code title=dom-canvas-toDataURLHD><a href=#dom-canvas-todataurlhd>toDataURLHD()</a></code> method returns
+    it at the native canvas bitmap resolution.</p>
+
    </dd>
 
    <dt><var title="">canvas</var> . <code title=dom-canvas-toBlob><a href=#dom-canvas-toblob>toBlob</a></code>(<var title="">callback</var> [, <var title="">type</var>, ... ])</dt>
+   <dt><var title="">canvas</var> . <code title=dom-canvas-toBlobHD><a href=#dom-canvas-toblobhd>toBlobHD</a></code>(<var title="">callback</var> [, <var title="">type</var>, ... ])</dt>
 
    <dd>
 
@@ -35562,12 +35572,16 @@
     type, and control the way that the image is generated, as given in
     the table below.</p>
 
+    <p>The <code title=dom-canvas-toBlob><a href=#dom-canvas-toblob>toBlob()</a></code> method
+    provides the data at a resolution of 96dpi. The <code title=dom-canvas-toBlobHD><a href=#dom-canvas-toblobhd>toBlobHD()</a></code> method provides it
+    at the native canvas bitmap resolution.</p>
+
    </dd>
 
   </dl><div class=impl>
 
-  <p>The <dfn id=dom-canvas-todataurl title=dom-canvas-toDataURL><code>toDataURL()</code></dfn> method
-  must run the following steps:</p>
+  <p>The <dfn id=dom-canvas-todataurl title=dom-canvas-toDataURL><code>toDataURL()</code></dfn> and <dfn id=dom-canvas-todataurlhd title=dom-canvas-toDataURLHD><code>toDataURLHD()</code></dfn>
+  methods must run the following steps:</p>
 
   <ol><!--ADD-TOPIC:Security--><li><p>If the <code><a href=#the-canvas-element>canvas</a></code> element's <i>origin-clean</i>
    flag is set to false, throw a <code><a href=#securityerror>SecurityError</a></code> exception
@@ -35582,7 +35596,8 @@
 
    <li><p>Let <var title="">file</var> be <a href=#a-serialization-of-the-image-as-a-file>a serialization of the
    image as a file</a>, using the method's arguments (if any) as
-   the <var title="">arguments</var>.</li>
+   the <var title="">arguments</var>, and with the <var title="">native</var> flag set if the method is the <code title=dom-canvas-toDataURLHD><a href=#dom-canvas-todataurlhd>toDataURLHD()</a></code> method, and not
+   otherwise.</li>
 
    <li><p>Return a <a href=#data-protocol title="data protocol"><code title="">data:</code> URL</a> representing <var title="">file</var>. <a href=#refsRFC2397>[RFC2397]</a></p>
 
@@ -35590,8 +35605,9 @@
    not have any parameters, to ensure the same exact URL is generated
    in each browser? -->
 
-  </ol><p>The <dfn id=dom-canvas-toblob title=dom-canvas-toBlob><code>toBlob()</code></dfn> method
-  must run the following steps:</p>
+  </ol><p>The <dfn id=dom-canvas-toblob title=dom-canvas-toBlob><code>toBlob()</code></dfn>
+  and <dfn id=dom-canvas-toblobhd title=dom-canvas-toBlobHD><code>toBlobHD()</code></dfn>
+  methods must run the following steps:</p>
 
   <ol><!--ADD-TOPIC:Security--><li><p>If the <code><a href=#the-canvas-element>canvas</a></code> element's <i>origin-clean</i>
    flag is set to false, throw a <code><a href=#securityerror>SecurityError</a></code> exception
@@ -35611,7 +35627,10 @@
 
     <p>Otherwise, let <var title="">result</var> be a
     <code><a href=#blob>Blob</a></code> object representing <a href=#a-serialization-of-the-image-as-a-file>a serialization of the
-    image as a file</a>, using <var title="">arguments</var>. <a href=#refsFILEAPI>[FILEAPI]</a> </p>
+    image as a file</a>, using <var title="">arguments</var>, and
+    with the <var title="">native</var> flag set if the method is the
+    <code title=dom-canvas-toBlobHD><a href=#dom-canvas-toblobhd>toBlobHD()</a></code> method, and
+    not otherwise. <a href=#refsFILEAPI>[FILEAPI]</a> </p>
 
    </li>
 
@@ -35627,21 +35646,37 @@
    source</dfn>. <a href=#refsFILESYSTEMAPI>[FILESYSTEMAPI]</a></li>
 
   </ol><p>When a user agent is to create <dfn id=a-serialization-of-the-image-as-a-file>a serialization of the image
-  as a file</dfn>, optionally with some given <var title="">arguments</var>, it must create an image file in the format
-  given by the first value of <var title="">arguments</var>, or, if
-  there are no <var title="">arguments</var>, in the PNG format. <a href=#refsPNG>[PNG]</a></p>
+  as a file</dfn>, optionally with some given <var title="">arguments</var>, and optionally with a <var title="">native</var> flag set, it must create an image file in the
+  format given by the first value of <var title="">arguments</var>,
+  or, if there are no <var title="">arguments</var>, in the PNG
+  format. <a href=#refsPNG>[PNG]</a></p>
 
+  <p>If the <var title="">native</var> flag is set, or if the canvas
+  bitmap has one pixel per coordinate space unit, then the image file
+  must have the same pixel data (before compression, if applicable) as
+  the canvas bitmap, and if the file format used supports encoding
+  resolution metadata, the resolution of the bitmap (device pixels per
+  coordinate space units being interpreted as image pixels per CSS
+  pixel) must be given as well.</p>
+
+  <p>Otherwise, the image file's pixel data must be the canvas
+  bitmap's pixel data scaled to one image pixel per coordinate space
+  unitl, and if the file format used supports encoding resolution
+  metadata, the resolution must be given as 96dpi (one image pixel per
+  CSS pixel).</p>
+
   <p>If <var title="">arguments</var> is not empty, the first value
   must be interpreted as a <a href=#mime-type title="MIME type">MIME type</a>
   giving the format to use. If the type has any parameters, it must be
   treated as not supported.</p>
 
-  <p class=example>For example, the value "<code>image/png</code>" would
-  mean to generate a PNG image, the value "<code>image/jpeg</code>"
-  would mean to generate a JPEG image, and the value
-  "<code>image/svg+xml</code>" would mean to generate an SVG image
-  (which would probably require that the implementation actually keep
-  enough information to reliably render an SVG image from the canvas).</p>
+  <p class=example>For example, the value "<code>image/png</code>"
+  would mean to generate a PNG image, the value
+  "<code>image/jpeg</code>" would mean to generate a JPEG image, and
+  the value "<code>image/svg+xml</code>" would mean to generate an SVG
+  image (which would probably require that the implementation actually
+  keep enough information to reliably render an SVG image from the
+  canvas).</p>
 
   <p>User agents must support PNG ("<code>image/png</code>"). User
   agents may support other types. If the user agent does not support
@@ -35814,9 +35849,11 @@
   // pixel manipulation
   <a href=#imagedata>ImageData</a> <a href=#dom-context-2d-createimagedata title=dom-context-2d-createImageData>createImageData</a>(double sw, double sh);
   <a href=#imagedata>ImageData</a> <a href=#dom-context-2d-createimagedata title=dom-context-2d-createImageData>createImageData</a>(<a href=#imagedata>ImageData</a> imagedata);
+  <a href=#imagedata>ImageData</a> <a href=#dom-context-2d-createimagedatahd title=dom-context-2d-createImageDataHD>createImageDataHD</a>(double sw, double sh);
   <a href=#imagedata>ImageData</a> <a href=#dom-context-2d-getimagedata title=dom-context-2d-getImageData>getImageData</a>(double sx, double sy, double sw, double sh);
+  <a href=#imagedata>ImageData</a> <a href=#dom-context-2d-getimagedatahd title=dom-context-2d-getImageDataHD>getImageDataHD</a>(double sx, double sy, double sw, double sh);
   void <a href=#dom-context-2d-putimagedata title=dom-context-2d-putImageData>putImageData</a>(<a href=#imagedata>ImageData</a> imagedata, double dx, double dy);
-  void <a href=#dom-context-2d-putimagedata title=dom-context-2d-putImageData>putImageData</a>(<a href=#imagedata>ImageData</a> imagedata, double dx, double dy, double dirtyX, double dirtyY, double dirtyWidth, double dirtyHeight);
+  void <a href=#dom-context-2d-putimagedatahd title=dom-context-2d-putImageDataHD>putImageDataHD</a>(<a href=#imagedata>ImageData</a> imagedata, double dx, double dy, double dirtyX, double dirtyY, double dirtyWidth, double dirtyHeight);
 };
 <a href=#canvasrenderingcontext2d>CanvasRenderingContext2D</a> implements <a href=#canvasdrawingstyles>CanvasDrawingStyles</a>;
 <a href=#canvasrenderingcontext2d>CanvasRenderingContext2D</a> implements <a href=#canvaspathmethods>CanvasPathMethods</a>;
@@ -35987,9 +36024,50 @@
   </div>
 
 
+  <h6 id=resolution><span class=secno>4.8.11.1.1 </span>Resolution</h6>
 
-  <h6 id=the-canvas-state><span class=secno>4.8.11.1.1 </span>The canvas state</h6>
+  <p>The user agent may use a bitmap of any square resolution as the
+  backing store for a canvas that uses the 2D context. Once a canvas
+  has a bitmap, that canvas must keep its resolution for its
+  lifetime.</p>
 
+  <p class=note>In general, user agents are encouraged to use a
+  resolution equal to the screen resolution. Ideally, the number of
+  device pixels per CSS pixel would be a multiple of two. Several
+  factors can affect the screen resolution: most prominently the
+  actual display resolution, but also important is the current zoom
+  level.</p>
+
+  <p>All the bitmaps created during a single <a href=#concept-task title=concept-task>task</a> for canvases that use 2D contexts
+  must have the same resolution.
+  <!--XXX 4INSERT FINGERPRINT-->
+  </p>
+
+  <pre class=idl>partial interface <a href=#screen>Screen</a> {
+  readonly attribute double <a href=#dom-screen-canvasresolution title=dom-screen-canvasResolution>canvasResolution</a>;
+};</pre>
+
+  <dl class=domintro><dt><var title="">window</var> . <code title=dom-Window-screen>screen</code> . <code title=dom-screen-canvasResolution><a href=#dom-screen-canvasresolution>canvasResolution</a></code></dt>
+
+   <dd>
+
+    <p>Returns the resolution that has been, or will be, used for bitmaps during this <a href=#concept-task title=concept-task>task</a>.</p>
+
+   </dd>
+
+  </dl><div class=impl>
+
+  <p>The <dfn id=dom-screen-canvasresolution title=dom-screen-canvasResolution><code>canvasResolution</code></dfn>
+  attribute of the <code><a href=#screen>Screen</a></code> object must return the
+  resolution, in image pixels per coordinate space units, that any
+  canvas bitmaps created during this <a href=#concept-task title=concept-task>task</a> will use (or have used). <a href=#refsCSSOMVIEW>[CSSOMVIEW]</a></p>
+
+  </div>
+
+
+
+  <h6 id=the-canvas-state><span class=secno>4.8.11.1.2 </span>The canvas state</h6>
+
   <p>Each context maintains a stack of drawing states. <dfn id=drawing-state title="drawing state">Drawing states</dfn> consist of:</p>
 
   <ul class=brief><li>The current <a href=#transformations title=dom-context-2d-transformation>transformation matrix</a>.</li>
@@ -36050,7 +36128,7 @@
   </div>
 
 
-  <h6 id=drawingstyle-objects><span class=secno>4.8.11.1.2 </span><code><a href=#drawingstyle>DrawingStyle</a></code> objects</h6>
+  <h6 id=drawingstyle-objects><span class=secno>4.8.11.1.3 </span><code><a href=#drawingstyle>DrawingStyle</a></code> objects</h6>
 
   <p>All the line styles (line width, caps, joins, and dash patterns)
   and text styles (fonts) described in the next two sections apply to
@@ -36088,7 +36166,7 @@
   </div>
 
 
-  <h6 id=line-styles><span class=secno>4.8.11.1.3 </span>Line styles</h6>
+  <h6 id=line-styles><span class=secno>4.8.11.1.4 </span>Line styles</h6>
 
   <dl class=domintro><dt><var title="">context</var> . <code title=dom-context-2d-lineWidth><a href=#dom-context-2d-linewidth>lineWidth</a></code> [ = <var title="">value</var> ]</dt>
    <dt><var title="">styles</var> . <code title=dom-context-2d-lineWidth><a href=#dom-context-2d-linewidth>lineWidth</a></code> [ = <var title="">value</var> ]</dt>
@@ -36545,7 +36623,7 @@
 hairline width with transform. ack Shaun Morris.  --></div>
 
 
-  <h6 id=text-styles><span class=secno>4.8.11.1.4 </span>Text styles</h6>
+  <h6 id=text-styles><span class=secno>4.8.11.1.5 </span>Text styles</h6>
 
   <dl class=domintro><dt><var title="">context</var> . <code title=dom-context-2d-font><a href=#dom-context-2d-font>font</a></code> [ = <var title="">value</var> ]</dt>
    <dt><var title="">styles</var> . <code title=dom-context-2d-font><a href=#dom-context-2d-font>font</a></code> [ = <var title="">value</var> ]</dt>
@@ -36884,7 +36962,7 @@
    need it, <var title="">physical alignment</var> as the alignment
    value.</li>
 
-  </ol><h6 id=building-paths><span class=secno>4.8.11.1.5 </span>Building paths</h6>
+  </ol><h6 id=building-paths><span class=secno>4.8.11.1.6 </span>Building paths</h6>
 
   <p>Each object implementing the <code><a href=#canvaspathmethods>CanvasPathMethods</a></code>
   interface has a <a href=#concept-path title=concept-path>path</a>. A <dfn id=concept-path title=concept-path>path</dfn> has a list of zero or more subpaths.
@@ -37458,7 +37536,7 @@
 
 
 
-  <h6 id=path-objects><span class=secno>4.8.11.1.6 </span><code><a href=#path>Path</a></code> objects</h6>
+  <h6 id=path-objects><span class=secno>4.8.11.1.7 </span><code><a href=#path>Path</a></code> objects</h6>
 
   <p><code><a href=#path>Path</a></code> objects can be used to declare paths that are
   then later used on <code><a href=#canvasrenderingcontext2d>CanvasRenderingContext2D</a></code> objects. In
@@ -37758,7 +37836,7 @@
 
 
 
-  <h6 id=transformations><span class=secno>4.8.11.1.7 </span><dfn title=dom-context-2d-transformation>Transformations</dfn></h6>
+  <h6 id=transformations><span class=secno>4.8.11.1.8 </span><dfn title=dom-context-2d-transformation>Transformations</dfn></h6>
 
   <p>Each <code><a href=#canvasrenderingcontext2d>CanvasRenderingContext2D</a></code> object has a
   <i>current transformation matrix</i>, as well as methods (described
@@ -37916,7 +37994,7 @@
 
 
 
-  <h6 id=fill-and-stroke-styles><span class=secno>4.8.11.1.8 </span>Fill and stroke styles</h6>
+  <h6 id=fill-and-stroke-styles><span class=secno>4.8.11.1.9 </span>Fill and stroke styles</h6>
 
   <dl class=domintro><dt><var title="">context</var> . <code title=dom-context-2d-fillStyle><a href=#dom-context-2d-fillstyle>fillStyle</a></code> [ = <var title="">value</var> ]</dt>
 
@@ -38339,7 +38417,7 @@
 
 
 
-  <h6 id=drawing-rectangles-to-the-canvas><span class=secno>4.8.11.1.9 </span>Drawing rectangles to the canvas</h6>
+  <h6 id=drawing-rectangles-to-the-canvas><span class=secno>4.8.11.1.10 </span>Drawing rectangles to the canvas</h6>
 
   <p>There are three methods that immediately draw rectangles to the
   bitmap. They each take four arguments; the first two give the <var title="">x</var> and <var title="">y</var> coordinates of the top
@@ -38428,7 +38506,7 @@
 
 
 
-  <h6 id=drawing-text-to-the-canvas><span class=secno>4.8.11.1.10 </span>Drawing text to the canvas</h6>
+  <h6 id=drawing-text-to-the-canvas><span class=secno>4.8.11.1.11 </span>Drawing text to the canvas</h6>
 
   <dl class=domintro><dt><var title="">context</var> . <code title=dom-context-2d-fillText><a href=#dom-context-2d-filltext>fillText</a></code>(<var title="">text</var>, <var title="">x</var>, <var title="">y</var> [, <var title="">maxWidth</var> ] )</dt>
    <dt><var title="">context</var> . <code title=dom-context-2d-strokeText><a href=#dom-context-2d-stroketext>strokeText</a></code>(<var title="">text</var>, <var title="">x</var>, <var title="">y</var> [, <var title="">maxWidth</var> ] )</dt>
@@ -38768,7 +38846,7 @@
 
 
 
-  <h6 id=drawing-paths-to-the-canvas><span class=secno>4.8.11.1.11 </span>Drawing paths to the canvas</h6>
+  <h6 id=drawing-paths-to-the-canvas><span class=secno>4.8.11.1.12 </span>Drawing paths to the canvas</h6>
 
   <p>The context always has a <dfn id=current-default-path>current default path</dfn>. There
   is only one <a href=#current-default-path>current default path</a>, it is not part of the
@@ -39160,7 +39238,7 @@
 
 
 
-  <h6 id=drawing-images-to-the-canvas><span class=secno>4.8.11.1.12 </span>Drawing images to the canvas</h6>
+  <h6 id=drawing-images-to-the-canvas><span class=secno>4.8.11.1.13 </span>Drawing images to the canvas</h6>
 
   <p>To draw images onto the canvas, the <dfn id=dom-context-2d-drawimage title=dom-context-2d-drawImage><code>drawImage</code></dfn> method
   can be used.</p>
@@ -39311,7 +39389,7 @@
   </div>
 
 
-  <h6 id=hit-regions><span class=secno>4.8.11.1.13 </span>Hit regions</h6>
+  <h6 id=hit-regions><span class=secno>4.8.11.1.14 </span>Hit regions</h6>
 
   <p>Each <code><a href=#the-canvas-element>canvas</a></code> element whose <a href=#primary-context>primary
   context</a> is a <code><a href=#canvasrenderingcontext2d>CanvasRenderingContext2D</a></code> object
@@ -39949,7 +40027,7 @@
   </div>
 
 
-  <h6 id=pixel-manipulation><span class=secno>4.8.11.1.14 </span><dfn>Pixel manipulation</dfn></h6>
+  <h6 id=pixel-manipulation><span class=secno>4.8.11.1.15 </span><dfn>Pixel manipulation</dfn></h6>
 
   <dl class=domintro><dt><var title="">imagedata</var> = <var title="">context</var> . <code title=dom-context-2d-createImageData><a href=#dom-context-2d-createimagedata>createImageData</a></code>(<var title="">sw</var>, <var title="">sh</var>)</dt>
 
@@ -39971,6 +40049,18 @@
 
    </dd>
 
+   <dt><var title="">imagedata</var> = <var title="">context</var> . <code title=dom-context-2d-createImageDataHD><a href=#dom-context-2d-createimagedatahd>createImageDataHD</a></code>(<var title="">sw</var>, <var title="">sh</var>)</dt>
+
+   <dd>
+
+    <p>Returns an <code><a href=#imagedata>ImageData</a></code> object whose dimensions equal
+    the dimensions given in the arguments, multiplied by the number of
+    pixels in the canvas bitmap that correspond to each coordinate
+    space unit. All the pixels in the returned object are transparent
+    black.</p>
+
+   </dd>
+
    <dt><var title="">imagedata</var> = <var title="">context</var> . <code title=dom-context-2d-getImageData><a href=#dom-context-2d-getimagedata>getImageData</a></code>(<var title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>, <var title="">sh</var>)</dt>
 
    <dd>
@@ -39988,12 +40078,34 @@
 
    </dd>
 
+   <dt><var title="">imagedata</var> = <var title="">context</var> . <code title=dom-context-2d-getImageDataHD><a href=#dom-context-2d-getimagedatahd>getImageDataHD</a></code>(<var title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>, <var title="">sh</var>)</dt>
+
+   <dd>
+
+    <p>Returns an <code><a href=#imagedata>ImageData</a></code> object containing the image
+    data for the given rectangle of the canvas.</p>
+
+    <p>Throws a <code><a href=#notsupportederror>NotSupportedError</a></code> exception if any of the
+    arguments are not finite. Throws an <code><a href=#indexsizeerror>IndexSizeError</a></code>
+    exception if the either of the width or height arguments are
+    zero.</p>
+
+    <p>The data will be returned at the same resolution as the canvas
+    bitmap.</p>
+
+   </dd>
+
    <dt><var title="">imagedata</var> . <code title=dom-imagedata-width><a href=#dom-imagedata-width>width</a></code></dt>
    <dt><var title="">imagedata</var> . <code title=dom-imagedata-height><a href=#dom-imagedata-height>height</a></code></dt>
 
    <dd>
 
-    <p>Returns the actual dimensions of the data in the <code><a href=#imagedata>ImageData</a></code> object, in device pixels.</p>
+    <p>Returns the actual dimensions of the data in the
+    <code><a href=#imagedata>ImageData</a></code> object, in pixels. For objects returned by
+    the non-HD variants of the methods in this API, this will
+    correspond to the dimensions given to the methods. For the HD
+    variants, the number of pixels might be different than the number
+    of corresponding coordinate space units.</p>
 
    </dd>
 
@@ -40028,42 +40140,96 @@
 
    </dd>
 
+   <dt><var title="">context</var> . <code title=dom-context-2d-putImageDataHD><a href=#dom-context-2d-putimagedatahd>putImageDataHD</a></code>(<var title="">imagedata</var>, <var title="">dx</var>, <var title="">dy</var> [, <var title="">dirtyX</var>, <var title="">dirtyY</var>, <var title="">dirtyWidth</var>, <var title="">dirtyHeight</var> ])</dt>
+
+   <dd>
+
+    <p>Paints the data from the given <code><a href=#imagedata>ImageData</a></code> object
+    onto the canvas, at the canvas bitmap's native resolution. If a
+    dirty rectangle is provided, only the pixels from that rectangle
+    are painted.</p>
+
+    <p>The <code title=dom-context-2d-globalAlpha><a href=#dom-context-2d-globalalpha>globalAlpha</a></code>
+    and <code title=dom-context-2d-globalCompositeOperation><a href=#dom-context-2d-globalcompositeoperation>globalCompositeOperation</a></code>
+    attributes, as well as the shadow attributes, are ignored for the
+    purposes of this method call; pixels in the canvas are replaced
+    wholesale, with no composition, alpha blending, no shadows,
+    etc.</p>
+
+    <p>Throws a <code><a href=#notsupportederror>NotSupportedError</a></code> exception if any of the
+    arguments are not finite.</p>
+
+   </dd>
+
   </dl><div class=impl>
 
-  <p>The <dfn id=dom-context-2d-createimagedata title=dom-context-2d-createImageData><code>createImageData()</code></dfn>
-  method is used to instantiate new blank <code><a href=#imagedata>ImageData</a></code>
-  objects. When the method is invoked with two arguments <var title="">sw</var> and <var title="">sh</var>, it must return an
-  <code><a href=#imagedata>ImageData</a></code> object representing a rectangle with a width
-  in equal to the absolute magnitude of <var title="">sw</var> and a
-  height equal to the absolute magnitude of <var title="">sh</var>.
-  When invoked with a single <var title="">imagedata</var> argument,
-  it must return an <code><a href=#imagedata>ImageData</a></code> object representing a
-  rectangle with the same dimensions as the <code><a href=#imagedata>ImageData</a></code>
-  object passed as the argument. The <code><a href=#imagedata>ImageData</a></code> object
-  returned must be filled with transparent black.</p>
+  <p>The <code title=dom-context-2d-createImageData><a href=#dom-context-2d-createimagedata>createImageData()</a></code> and
+  <code title=dom-context-2d-createImageDataHD><a href=#dom-context-2d-createimagedatahd>createImageDataHD()</a></code>
+  methods are used to instantiate new blank <code><a href=#imagedata>ImageData</a></code>
+  objects.</p>
 
+  <p>When the <dfn id=dom-context-2d-createimagedata title=dom-context-2d-createImageData><code>createImageData()</code></dfn>
+  method is invoked with two arguments <var title="">sw</var> and <var title="">sh</var>, it must return a new <code><a href=#imagedata>ImageData</a></code>
+  object representing a rectangle with a width in equal to the
+  absolute magnitude of <var title="">sw</var> and a height equal to
+  the absolute magnitude of <var title="">sh</var>. When invoked with
+  a single <var title="">imagedata</var> argument, it must return a
+  new <code><a href=#imagedata>ImageData</a></code> object representing a rectangle with the
+  same dimensions as the <code><a href=#imagedata>ImageData</a></code> object passed as the
+  argument. The <code><a href=#imagedata>ImageData</a></code> object returned must be filled
+  with transparent black.</p>
+
+  <p>When the <dfn id=dom-context-2d-createimagedatahd title=dom-context-2d-createImageDataHD><code>createImageDataHD()</code></dfn>
+  method is invoked (with its two arguments <var title="">sw</var> and
+  <var title="">sh</var>) it must return a new <code><a href=#imagedata>ImageData</a></code>
+  object representing a rectangle with a width in equal to the
+  absolute magnitude of <var title="">sw</var> multiplied by <var title="">scale</var> and a height equal to the absolute magnitude of
+  <var title="">sh</var> multiplied by <var title="">scale</var>,
+  where <var title="">scale</var> is the number of pixels in the
+  canvas bitmap per coordinate space units. The <code><a href=#imagedata>ImageData</a></code>
+  object returned must be filled with transparent black.</p>
+
   <p>The <dfn id=dom-context-2d-getimagedata title=dom-context-2d-getImageData><code>getImageData(<var title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>,
-  <var title="">sh</var>)</code></dfn> method must,
-<!--ADD-TOPIC:Security-->
+  <var title="">sh</var>)</code></dfn> method must, if either the <var title="">sw</var> or <var title="">sh</var> arguments are zero,
+  throw an <code><a href=#indexsizeerror>IndexSizeError</a></code> exception; otherwise,
+  <!--ADD-TOPIC:Security-->
   if the <code><a href=#the-canvas-element>canvas</a></code> element's <i>origin-clean</i> flag is set
-  to false, throw a <code><a href=#securityerror>SecurityError</a></code> exception; otherwise, it
-<!--REMOVE-TOPIC:Security-->
-  must return an <code><a href=#imagedata>ImageData</a></code> object with width <var title="">sw</var> and height <var title="">sh</var> representing the
-  underlying pixel data for the area of the canvas denoted by the
-  rectangle whose corners are the four points (<var title="">sx</var>,
-  <var title="">sy</var>), (<span title=""><var title="">sx</var>+<var title="">sw</var></span>, <var title="">sy</var>), (<span title=""><var title="">sx</var>+<var title="">sw</var></span>, <span title=""><var title="">sy</var>+<var title="">sh</var></span>),
-  (<var title="">sx</var>, <span title=""><var title="">sy</var>+<var title="">sh</var></span>), in canvas coordinate space units. Pixels
-  outside the canvas must be returned as transparent black. Pixels
-  must be returned as non-premultiplied alpha values.</p>
+  to false, it must throw a <code><a href=#securityerror>SecurityError</a></code> exception;
+  <!--REMOVE-TOPIC:Security-->
+  otherwise, it must return an <code><a href=#imagedata>ImageData</a></code> object with
+  width <var title="">sw</var> and height <var title="">sh</var>
+  representing the canvas bitmap for the area of the canvas denoted by
+  the rectangle whose corners are the four points (<var title="">sx</var>, <var title="">sy</var>), (<span title=""><var title="">sx</var>+<var title="">sw</var></span>, <var title="">sy</var>), (<span title=""><var title="">sx</var>+<var title="">sw</var></span>, <span title=""><var title="">sy</var>+<var title="">sh</var></span>), (<var title="">sx</var>, <span title=""><var title="">sy</var>+<var title="">sh</var></span>), in
+  canvas coordinate space units. If the canvas bitmap does not
+  represent each coordinate space unit square using exactly one pixel,
+  the value of each pixel in the returned abject must be derived from
+  the value(s) of the pixel(s) in the canvas bitmap that correspond to
+  the same coordinate. Pixels outside the canvas must be returned as
+  transparent black. Pixels must be returned as non-premultiplied
+  alpha values.</p>
 
-  <p>If either the <var title="">sw</var> or <var title="">sh</var>
-  arguments are zero, the method must instead throw an
-  <code><a href=#indexsizeerror>IndexSizeError</a></code> exception.</p>
+  <p>The <dfn id=dom-context-2d-getimagedatahd title=dom-context-2d-getImageDataHD><code>getImageDataHD(<var title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>,
+  <var title="">sh</var>)</code></dfn> method must, if either the <var title="">sw</var> or <var title="">sh</var> arguments are zero,
+  throw an <code><a href=#indexsizeerror>IndexSizeError</a></code> exception; otherwise,
+  <!--ADD-TOPIC:Security-->
+  if the <code><a href=#the-canvas-element>canvas</a></code> element's <i>origin-clean</i> flag is set
+  to false, it must throw a <code><a href=#securityerror>SecurityError</a></code> exception;
+  <!--REMOVE-TOPIC:Security-->
+  otherwise, it must return an <code><a href=#imagedata>ImageData</a></code> object with
+  width <var title="">sw</var> multiplied by <var title="">scale</var>
+  and height <var title="">sh</var> multiplied by <var title="">scale</var> representing the canvas bitmap data for the
+  area of the canvas denoted by the rectangle whose corners are the
+  four points (<var title="">sx</var>, <var title="">sy</var>), (<span title=""><var title="">sx</var>+<var title="">sw</var></span>, <var title="">sy</var>), (<span title=""><var title="">sx</var>+<var title="">sw</var></span>, <span title=""><var title="">sy</var>+<var title="">sh</var></span>), (<var title="">sx</var>, <span title=""><var title="">sy</var>+<var title="">sh</var></span>), in
+  canvas coordinate space units. Pixels outside the canvas must be
+  returned as transparent black. Pixels must be returned as
+  non-premultiplied alpha values.</p>
 
-  <p><code><a href=#imagedata>ImageData</a></code> objects must be initialized so that their
-  <dfn id=dom-imagedata-width title=dom-imagedata-width><code>width</code></dfn> attribute
-  is set to the number of pixels per row in the image data, their <dfn id=dom-imagedata-height title=dom-imagedata-height><code>height</code></dfn> attribute is
-  set to the number of rows in the image data, and their <dfn id=dom-imagedata-data title=dom-imagedata-data><code>data</code></dfn> attribute is
+  <p>New <code><a href=#imagedata>ImageData</a></code> objects must be initialized so that
+  their <dfn id=dom-imagedata-width title=dom-imagedata-width><code>width</code></dfn>
+  attribute is set to the number of pixels per row in the image data,
+  their <dfn id=dom-imagedata-height title=dom-imagedata-height><code>height</code></dfn>
+  attribute is set to the number of rows in the image data, and their
+  <dfn id=dom-imagedata-data title=dom-imagedata-data><code>data</code></dfn> attribute is
   initialized to a <code><a href=#uint8clampedarray>Uint8ClampedArray</a></code> object. The
   <code><a href=#uint8clampedarray>Uint8ClampedArray</a></code> object must use a <a href=#canvas-pixel-arraybuffer>Canvas Pixel
   <code>ArrayBuffer</code></a> for its storage, and must have a
@@ -40082,15 +40248,15 @@
   consecutive indices starting with 0 for the top left pixel's red
   component. <a href=#refsTYPEDARRAY>[TYPEDARRAY]</a></p>
 
-  <p>The <dfn id=dom-context-2d-putimagedata title=dom-context-2d-putImageData><code>putImageData(<var title="">imagedata</var>, <var title="">dx</var>, <var title="">dy</var>, <var title="">dirtyX</var>, <var title="">dirtyY</var>, <var title="">dirtyWidth</var>, <var title="">dirtyHeight</var>)</code></dfn> method writes data from
-  <code><a href=#imagedata>ImageData</a></code> structures back to the canvas.</p>
+  <p>The <dfn id=dom-context-2d-putimagedata title=dom-context-2d-putImageData><code>putImageData()</code></dfn>
+  and <dfn id=dom-context-2d-putimagedatahd title=dom-context-2d-putImageDataHD><code>putImageDataHD()</code></dfn>
+  methods write data from <code><a href=#imagedata>ImageData</a></code> structures back to
+  the canvas. Their arguments are: <var title="">imagedata</var>, <var title="">dx</var>, <var title="">dy</var>, <var title="">dirtyX</var>, <var title="">dirtyY</var>, <var title="">dirtyWidth</var>, and <var title="">dirtyHeight</var>.</p>
 
-  <p>When the last four arguments are omitted, they must be assumed to
-  have the values 0, 0, the <code title=dom-imagedata-width><a href=#dom-imagedata-width>width</a></code> member of the <var title="">imagedata</var> structure, and the <code title=dom-imagedata-height><a href=#dom-imagedata-height>height</a></code> member of the <var title="">imagedata</var> structure, respectively.</p>
+  <p>When the last four arguments to these methods are omitted, they
+  must be assumed to have the values 0, 0, the <code title=dom-imagedata-width><a href=#dom-imagedata-width>width</a></code> member of the <var title="">imagedata</var> structure, and the <code title=dom-imagedata-height><a href=#dom-imagedata-height>height</a></code> member of the <var title="">imagedata</var> structure, respectively.</p>
 
-  <p>When invoked with arguments that do not, per the last few
-  paragraphs, cause an exception to be thrown, the <code title=dom-context-2d-putImageData><a href=#dom-context-2d-putimagedata>putImageData()</a></code> method
-  must act as follows:</p>
+  <p>When invoked, these methods must act as follows:</p>
 
   <ol><li>
 
@@ -40132,107 +40298,92 @@
 
    <li>
 
-    <p>Draw the region of the image data in the horizontal rectangle
-    whose top left corner is at (<var title="">dirtyX</var>,<var title="">dirtyY</var>) and whose bottom right corner is at (<span title=""><var title="">dirtyX</var>+<var title="">dirtyWidth</var></span>,<span title=""><var title="">dirtyY</var>+<var title="">dirtyHeight</var></span>) onto
-    the canvas, aligned such that the top left of the rectangle is at
-    coordinate (<var title="">dx</var>,<var title="">dy</var>).</p>
+    <p>Run the appropriate steps from the following list:</p>
 
-    <p>If the <code title=dom-context-2d-imageSmoothingEnabled><a href=#dom-context-2d-imagesmoothingenabled>imageSmoothingEnabled</a></code>
-    attribute is set to true, then the user agent should attempt to
-    apply a smoothing algorithm to the image data if the canvas does
-    not have exactly one device pixel per coordinate space unit in its
-    underlying pixel data.</p>
+    <dl class=switch><dt>If the method was <code title=dom-context-2d-putImageData><a href=#dom-context-2d-putimagedata>putImageData()</a></code></dt>
 
-   </li>
+     <dd>
 
-  </ol><!-- XXXXX
+      <p>Draw the region of the image data in the horizontal rectangle
+      whose top left corner is at (<var title="">dirtyX</var>,<var title="">dirtyY</var>) and whose bottom right corner is at
+      (<span title=""><var title="">dirtyX</var>+<var title="">dirtyWidth</var></span>,<span title=""><var title="">dirtyY</var>+<var title="">dirtyHeight</var></span>)
+      onto the canvas, aligned such that the top left of the rectangle
+      is at coordinate (<var title="">dx</var>,<var title="">dy</var>).</p>
 
-   <li>
+      <p>If the <code title=dom-context-2d-imageSmoothingEnabled><a href=#dom-context-2d-imagesmoothingenabled>imageSmoothingEnabled</a></code>
+      attribute is set to true, then the user agent should attempt to
+      apply a smoothing algorithm to the image data if the canvas does
+      not have exactly one device pixel per coordinate space unit in
+      the canvas bitmap.</p>
 
-    <p>Let <var title="">scale</var> be the number of device pixels in
-    the underlying pixel data of the canvas per coordinate space
-    unit.</p>
+     </dd>
 
-   </li>
+     <dt>If the method was <code title=dom-context-2d-putImageDataHD><a href=#dom-context-2d-putimagedatahd>putImageDataHD()</a></code></dt>
 
-   <li>
+     <dd>
 
-    <p>Let <var title="">dx<sub>device</sub></var> be the x-coordinate
-    of the device pixel in the underlying pixel data of the canvas
-    corresponding to the <var title="">dx</var> coordinate in the
-    canvas coordinate space.</p>
+      <ol><li>
 
-    <p>Let <var title="">dy<sub>device</sub></var> be the y-coordinate
-    of the device pixel in the underlying pixel data of the canvas
-    corresponding to the <var title="">dy</var> coordinate in the
-    canvas coordinate space.</p>
+        <p>Let <var title="">dx<sub>device</sub></var> be the x-coordinate
+        of the device pixel in the canvas bitmap corresponding to the <var title="">dx</var> coordinate in the canvas coordinate space.</p>
 
-   </li>
+        <p>Let <var title="">dy<sub>device</sub></var> be the y-coordinate
+        of the device pixel in the canvas bitmap corresponding to the <var title="">dy</var> coordinate in the canvas coordinate space.</p>
 
-   <li><p>Otherwise, for all integer values of <var title="">x</var>
-   and <var title="">y</var> where <span title=""><var
-   title="">dirtyX</var> ≤ <var
-   title="">x</var> < <span title=""><var
-   title="">dirtyX</var>+<var title="">dirtyWidth</var></span></span>
-   and <span title=""><var title="">dirtyY</var> ≤ <var
-   title="">y</var> < <span title=""><var
-   title="">dirtyY</var>+<var
-   title="">dirtyHeight</var></span></span>, copy the four channels of
-   the pixel with coordinate (<var title="">x</var>, <var
-   title="">y</var>) in the <var title="">imagedata</var> data
-   structure to the pixel with coordinate (<span title=""><var
-   title="">dx<sub>device</sub></var>+<var title="">x</var></span>,
-   <span title=""><var title="">dy<sub>device</sub></var>+<var
-   title="">y</var></span>) in the underlying pixel data of the
-   canvas.</p></li>
+       </li>
 
-  <p>The handling of pixel rounding when the specified coordinates do
+       <li><p>For all integer values of <var title="">x</var>
+       and <var title="">y</var> where <span title=""><var title="">dirtyX</var> ≤ <var title="">x</var> < <span title=""><var title="">dirtyX</var>+<var title="">dirtyWidth</var></span></span>
+       and <span title=""><var title="">dirtyY</var> ≤ <var title="">y</var> < <span title=""><var title="">dirtyY</var>+<var title="">dirtyHeight</var></span></span>, copy the four channels of
+       the pixel with coordinate (<var title="">x</var>, <var title="">y</var>) in the <var title="">imagedata</var> data
+       structure to the pixel with coordinate (<span title=""><var title="">dx<sub>device</sub></var>+<var title="">x</var></span>,
+       <span title=""><var title="">dy<sub>device</sub></var>+<var title="">y</var></span>) in the canvas bitmap of the
+       canvas.</li>
+
+      </ol></dd>
+
+    </dl></li>
+
+  </ol><p>The handling of pixel rounding when the specified coordinates do
   not exactly map to the device coordinate space is not defined by
   this specification, except that the following must result in no
   visible changes to the rendering:</p>
 
-  <pre>context.putImageData(context.getImageData(x, y, w, h), p, q);</pre>
+  <pre>context.putImageDataHD(context.getImageDataHD(x, y, w, h), p, q);</pre>
 
   <p>...for any value of <var title="">x</var>, <var title="">y</var>,
-  <var title="">w</var>, and <var title="">h</var> and where <var
-  title="">p</var> is the smaller of <var title="">x</var> and the sum
-  of <var title="">x</var> and <var title="">w</var>, and <var
-  title="">q</var> is the smaller of <var title="">y</var> and the sum
+  <var title="">w</var>, and <var title="">h</var> and where <var title="">p</var> is the smaller of <var title="">x</var> and the sum
+  of <var title="">x</var> and <var title="">w</var>, and <var title="">q</var> is the smaller of <var title="">y</var> and the sum
   of <var title="">y</var> and <var title="">h</var>; and except that
   the following two calls:</p>
 
   <pre>context.createImageData(w, h);
 context.getImageData(0, 0, w, h);</pre>
 
-  <p>...must return <code>ImageData</code> objects with the same
-  dimensions, for any value of <var title="">w</var> and <var
-  title="">h</var>. In other words, while user agents may round the
-  arguments of these methods so that they map to device pixel
-  boundaries, any rounding performed must be performed consistently
-  for all of the <code
-  title="dom-context-2d-getImageData">createImageData()</code>, <code
-  title="dom-context-2d-getImageData">getImageData()</code> and <code
-  title="dom-context-2d-putImageData">putImageData()</code>
-  operations.</p>
+  <p>...must return <code><a href=#imagedata>ImageData</a></code> objects with the same
+  dimensions as each other, and the following two calls:<p>
 
-  <p class="note">This implies that the data returned by <code
-  title="dom-context-2d-getImageData">getImageData()</code> is at the
-  resolution of the canvas backing store. This is likely to not be one
-  device pixel to each CSS pixel if the display used is a high
-  resolution display.</p>
+  <pre>context.createImageDataHD(w, h);
+context.getImageDataHD(0, 0, w, h);</pre>
 
-  <p class="note">Due to the lossy nature of converting to and from
+  <p>...must also return <code><a href=#imagedata>ImageData</a></code> objects with the same
+  dimensions as each other, for any value of <var title="">w</var> and
+  <var title="">h</var> in both cases. In other words, while user
+  agents may round the arguments of these methods so that they map to
+  device pixel boundaries, any rounding performed must be performed
+  consistently for all of the methods described in this section.</p>
+
+  <p class=note>Due to the lossy nature of converting to and from
   premultiplied alpha color values, pixels that have just been set
-  using <code
-  title="dom-context-2d-putImageData">putImageData()</code> might be
-  returned to an equivalent <code
-  title="dom-context-2d-getImageData">getImageData()</code> as
+  using <code title=dom-context-2d-putImageDataHD><a href=#dom-context-2d-putimagedatahd>putImageDataHD()</a></code> might
+  be returned to an equivalent <code title=dom-context-2d-getImageDataHD><a href=#dom-context-2d-getimagedatahd>getImageDataHD()</a></code> as
   different values.</p>
---><p>The current path, <a href=#transformations title=dom-context-2d-transformation>transformation matrix</a>,
+
+  <p>The current path, <a href=#transformations title=dom-context-2d-transformation>transformation matrix</a>,
   <a href=#shadows title=shadows>shadow attributes</a>, <a href=#dom-context-2d-globalalpha title=dom-context-2d-globalAlpha>global alpha</a>, the
   <a href=#clipping-region>clipping region</a>, and <a href=#dom-context-2d-globalcompositeoperation title=dom-context-2d-globalCompositeOperation>global composition
-  operator</a> must not affect the <code title=dom-context-2d-getImageData><a href=#dom-context-2d-getimagedata>getImageData()</a></code> and <code title=dom-context-2d-putImageData><a href=#dom-context-2d-putimagedata>putImageData()</a></code>
-  methods.</p>
+  operator</a> must not affect the methods described in this
+  section.</p>
 
   </div>
 
@@ -40245,7 +40396,7 @@
 var context = canvas.getContext('2d');
 
 // create a blank slate
-var data = context.createImageData(canvas.width, canvas.height);
+var data = context.createImageDataHD(canvas.width, canvas.height);
 
 // create some plasma
 FillPlasma(data, 'green'); // green plasma
@@ -40254,7 +40405,7 @@
 AddCloud(data, data.width/2, data.height/2); // put a cloud in the middle
 
 // paint the plasma+cloud on the canvas
-context.putImageData(data, 0, 0);
+context.putImageDataHD(data, 0, 0);
 
 // support methods
 function FillPlasma(data, color) { ... }
@@ -40264,8 +40415,9 @@
 
   <div class=example>
 
-   <p>Here is an example of using <code title=dom-context-2d-getImageData><a href=#dom-context-2d-getimagedata>getImageData()</a></code> and <code title=dom-context-2d-putImageData><a href=#dom-context-2d-putimagedata>putImageData()</a></code> to
-   implement an edge detection filter.</p>
+   <p>Here is an example of using <code title=dom-context-2d-getImageDataHD><a href=#dom-context-2d-getimagedatahd>getImageDataHD()</a></code> and
+   <code title=dom-context-2d-putImageDataHD><a href=#dom-context-2d-putimagedatahd>putImageDataHD()</a></code>
+   to implement an edge detection filter.</p>
 
    <pre><!DOCTYPE HTML>
 <html>
@@ -40285,10 +40437,10 @@
      context.drawImage(image, 0, 0);
 
      // get the image data to manipulate
-     var input = context.getImageData(0, 0, canvas.width, canvas.height);
+     var input = context.getImageDataHD(0, 0, canvas.width, canvas.height);
 
      // get an empty slate to put the data into
-     var output = context.createImageData(canvas.width, canvas.height);
+     var output = context.createImageDataHD(canvas.width, canvas.height);
 
      // alias some variables for convenience
      // notice that we are using input.width and input.height here
@@ -40312,7 +40464,7 @@
      }
 
      // put the image data back after manipulation
-     context.putImageData(output, 0, 0);
+     context.putImageDataHD(output, 0, 0);
    }
   </script>
  </head>
@@ -40326,7 +40478,7 @@
 
 
 
-  <h6 id=compositing><span class=secno>4.8.11.1.15 </span>Compositing</h6>
+  <h6 id=compositing><span class=secno>4.8.11.1.16 </span>Compositing</h6>
 
   <dl class=domintro><dt><var title="">context</var> . <code title=dom-context-2d-globalAlpha><a href=#dom-context-2d-globalalpha>globalAlpha</a></code> [ = <var title="">value</var> ]</dt>
 
@@ -40487,7 +40639,7 @@
 
 
 
-  <h6 id=image-smoothing><span class=secno>4.8.11.1.16 </span>Image smoothing</h6>
+  <h6 id=image-smoothing><span class=secno>4.8.11.1.17 </span>Image smoothing</h6>
 
   <dl class=domintro><dt><var title="">context</var> . <code title=dom-context-2d-imageSmoothingEnabled><a href=#dom-context-2d-imagesmoothingenabled>imageSmoothingEnabled</a></code> [ = <var title="">value</var> ]</dt>
 
@@ -40513,7 +40665,7 @@
   </div>
 
 
-  <h6 id=shadows><span class=secno>4.8.11.1.17 </span><dfn>Shadows</dfn></h6>
+  <h6 id=shadows><span class=secno>4.8.11.1.18 </span><dfn>Shadows</dfn></h6>
 
   <p>All drawing operations are affected by the four global shadow
   attributes.</p>
@@ -40654,7 +40806,7 @@
 
   <div class=impl>
 
-  <h6 id=drawing-model><span class=secno>4.8.11.1.18 </span><dfn>Drawing model</dfn></h6>
+  <h6 id=drawing-model><span class=secno>4.8.11.1.19 </span><dfn>Drawing model</dfn></h6>
 
   <p>When a shape or image is painted, user agents must follow these
   steps, in the order given (or act as if they do):</p>
@@ -40685,7 +40837,7 @@
   </ol></div>
 
 
-  <h6 id=best-practices><span class=secno>4.8.11.1.19 </span>Best practices</h6>
+  <h6 id=best-practices><span class=secno>4.8.11.1.20 </span>Best practices</h6>
 
   <p><i>This section is non-normative.</i></p>
 
@@ -40747,7 +40899,7 @@
   attribute.</p>
 
 
-  <h6 id=examples><span class=secno>4.8.11.1.20 </span>Examples</h6>
+  <h6 id=examples><span class=secno>4.8.11.1.21 </span>Examples</h6>
 
   <p><i>This section is non-normative.</i></p>
 
@@ -40817,14 +40969,14 @@
   rendering the actual canvas bitmap to the output device.</p>
 
   <p class=note>Thus, in the 2D context, colors used to draw shapes
-  onto the canvas will exactly match colors obtained through the <code title=dom-context-2d-getImageData><a href=#dom-context-2d-getimagedata>getImageData()</a></code>
+  onto the canvas will exactly match colors obtained through the <code title=dom-context-2d-getImageDataHD><a href=#dom-context-2d-getimagedatahd>getImageDataHD()</a></code>
   method.</p>
 
   <p>The <code title=dom-canvas-toDataURL><a href=#dom-canvas-todataurl>toDataURL()</a></code> method
-  must not include color space information in the resource
-  returned. Where the output format allows it, the color of pixels in
-  resources created by <code title=dom-canvas-toDataURL><a href=#dom-canvas-todataurl>toDataURL()</a></code> must match those
-  returned by the <code title=dom-context-2d-getImageData><a href=#dom-context-2d-getimagedata>getImageData()</a></code>
+  must not include color space information in the resource returned.
+  Where the output format allows it, the color of pixels in resources
+  created by <code title=dom-canvas-toDataURL><a href=#dom-canvas-todataurl>toDataURLHD()</a></code>
+  must match those returned by the <code title=dom-context-2d-getImageDataHD><a href=#dom-context-2d-getimagedatahd>getImageDataHD()</a></code>
   method.</p>
 
   <p>In user agents that support CSS, the color space used by a
@@ -40909,9 +41061,9 @@
    whether or not a particular glyph is in the font in the first
    place. -->
 
-  </ul><p>The <code title=dom-canvas-toDataURL><a href=#dom-canvas-todataurl>toDataURL()</a></code>, <code title=dom-canvas-toBlob><a href=#dom-canvas-toblob>toBlob()</a></code>, and <code title=dom-context-2d-getImageData><a href=#dom-context-2d-getimagedata>getImageData()</a></code> methods
-  check the flag and will throw a <code><a href=#securityerror>SecurityError</a></code> exception
-  rather than leak cross-origin data.</p>
+  </ul><p>The <code title=dom-canvas-toDataURL><a href=#dom-canvas-todataurl>toDataURL()</a></code>, <code title=dom-canvas-toDataURLHD><a href=#dom-canvas-todataurlhd>toDataURLHD()</a></code>, <code title=dom-canvas-toBlob><a href=#dom-canvas-toblob>toBlob()</a></code>, <code title=dom-context-2d-getImageData><a href=#dom-context-2d-getimagedata>getImageData()</a></code>, and <code title=dom-context-2d-getImageDataHD><a href=#dom-context-2d-getimagedatahd>getImageDataHD()</a></code>
+  methods check the flag and will throw a <code><a href=#securityerror>SecurityError</a></code>
+  exception rather than leak cross-origin data.</p>
 
   <p class=note>Even resetting the canvas state by changing its
   <code title=attr-canvas-width><a href=#attr-canvas-width>width</a></code> or <code title=attr-canvas-height><a href=#attr-canvas-height>height</a></code> attributes doesn't reset

Modified: source
===================================================================
--- source	2012-07-16 19:16:26 UTC (rev 7177)
+++ source	2012-07-17 07:45:34 UTC (rev 7178)
@@ -55,6 +55,8 @@
         this would cause. We'll probably be able to fix them some day,
         but for now we are living with them. -->
 
+<!--SET FINGERPRINT=<a href="#fingerprint" class="fingerprint"><img src="images/fingerprint.png" alt="(This is a fingerprinting vector.)"></a>-->
+
 <!--START w3c-html-->
   <h2 id="introduction">Introduction</h2>
 <!--END w3c-html-->
@@ -3148,6 +3150,7 @@
     href="#refsCSSOMVIEW">[CSSOMVIEW]</a>
 
     <ul class="brief">
+     <li><dfn><code>Screen</code></dfn></li>
      <li><dfn><code>LinkStyle</code></dfn></li>
      <li><dfn><code>CSSStyleDeclaration</code></dfn></li>
      <li><dfn><code>StyleSheet</code></dfn></li>
@@ -41125,7 +41128,9 @@
            attribute unsigned long <span title="dom-canvas-height">height</span>;
 
   DOMString <span title="dom-canvas-toDataURL">toDataURL</span>(optional DOMString type, any... args);
+  DOMString <span title="dom-canvas-toDataURLHD">toDataURLHD</span>(optional DOMString type, any... args);
   void <span title="dom-canvas-toBlob">toBlob</span>(<span>FileCallback</span>? _callback, optional DOMString type, any... args);
+  void <span title="dom-canvas-toBlobHD">toBlobHD</span>(<span>FileCallback</span>? _callback, optional DOMString type, any... args);
 
   object? <span title="dom-canvas-getContext">getContext</span>(DOMString contextId, any... args);
 };</pre>
@@ -41403,6 +41408,7 @@
   <dl class="domintro">
 
    <dt><var title="">url</var> = <var title="">canvas</var> . <code title="dom-canvas-toDataURL">toDataURL</code>( [ <var title="">type</var>, ... ] )</dt>
+   <dt><var title="">url</var> = <var title="">canvas</var> . <code title="dom-canvas-toDataURLHD">toDataURLHD</code>( [ <var title="">type</var>, ... ] )</dt>
 
    <dd>
 
@@ -41427,9 +41433,15 @@
     which case the result might simply be "<code
     title="">data:,</code>".)</p>
 
+    <p>The <code title="dom-canvas-toDataURL">toDataURL()</code>
+    method returns the data at a resolution of 96dpi. The <code
+    title="dom-canvas-toDataURLHD">toDataURLHD()</code> method returns
+    it at the native canvas bitmap resolution.</p>
+
    </dd>
 
    <dt><var title="">canvas</var> . <code title="dom-canvas-toBlob">toBlob</code>(<var title="">callback</var> [, <var title="">type</var>, ... ])</dt>
+   <dt><var title="">canvas</var> . <code title="dom-canvas-toBlobHD">toBlobHD</code>(<var title="">callback</var> [, <var title="">type</var>, ... ])</dt>
 
    <dd>
 
@@ -41444,6 +41456,11 @@
     type, and control the way that the image is generated, as given in
     the table below.</p>
 
+    <p>The <code title="dom-canvas-toBlob">toBlob()</code> method
+    provides the data at a resolution of 96dpi. The <code
+    title="dom-canvas-toBlobHD">toBlobHD()</code> method provides it
+    at the native canvas bitmap resolution.</p>
+
    </dd>
 
   </dl>
@@ -41451,8 +41468,9 @@
   <div class="impl">
 
   <p>The <dfn
-  title="dom-canvas-toDataURL"><code>toDataURL()</code></dfn> method
-  must run the following steps:</p>
+  title="dom-canvas-toDataURL"><code>toDataURL()</code></dfn> and <dfn
+  title="dom-canvas-toDataURLHD"><code>toDataURLHD()</code></dfn>
+  methods must run the following steps:</p>
 
   <ol>
 
@@ -41471,7 +41489,10 @@
 
    <li><p>Let <var title="">file</var> be <span>a serialization of the
    image as a file</span>, using the method's arguments (if any) as
-   the <var title="">arguments</var>.</p></li>
+   the <var title="">arguments</var>, and with the <var
+   title="">native</var> flag set if the method is the <code
+   title="dom-canvas-toDataURLHD">toDataURLHD()</code> method, and not
+   otherwise.</p></li>
 
    <li><p>Return a <span title="data protocol"><code
    title="">data:</code> URL</span> representing <var
@@ -41483,9 +41504,9 @@
 
   </ol>
 
-  <p>The <dfn
-  title="dom-canvas-toBlob"><code>toBlob()</code></dfn> method
-  must run the following steps:</p>
+  <p>The <dfn title="dom-canvas-toBlob"><code>toBlob()</code></dfn>
+  and <dfn title="dom-canvas-toBlobHD"><code>toBlobHD()</code></dfn>
+  methods must run the following steps:</p>
 
   <ol>
 
@@ -41509,8 +41530,10 @@
 
     <p>Otherwise, let <var title="">result</var> be a
     <code>Blob</code> object representing <span>a serialization of the
-    image as a file</span>, using <var title="">arguments</var>. <a
-    href="#refsFILEAPI">[FILEAPI]</a> </p>
+    image as a file</span>, using <var title="">arguments</var>, and
+    with the <var title="">native</var> flag set if the method is the
+    <code title="dom-canvas-toBlobHD">toBlobHD()</code> method, and
+    not otherwise. <a href="#refsFILEAPI">[FILEAPI]</a> </p>
 
    </li>
 
@@ -41531,22 +41554,38 @@
 
   <p>When a user agent is to create <dfn>a serialization of the image
   as a file</dfn>, optionally with some given <var
-  title="">arguments</var>, it must create an image file in the format
-  given by the first value of <var title="">arguments</var>, or, if
-  there are no <var title="">arguments</var>, in the PNG format. <a
-  href="#refsPNG">[PNG]</a></p>
+  title="">arguments</var>, and optionally with a <var
+  title="">native</var> flag set, it must create an image file in the
+  format given by the first value of <var title="">arguments</var>,
+  or, if there are no <var title="">arguments</var>, in the PNG
+  format. <a href="#refsPNG">[PNG]</a></p>
 
+  <p>If the <var title="">native</var> flag is set, or if the canvas
+  bitmap has one pixel per coordinate space unit, then the image file
+  must have the same pixel data (before compression, if applicable) as
+  the canvas bitmap, and if the file format used supports encoding
+  resolution metadata, the resolution of the bitmap (device pixels per
+  coordinate space units being interpreted as image pixels per CSS
+  pixel) must be given as well.</p>
+
+  <p>Otherwise, the image file's pixel data must be the canvas
+  bitmap's pixel data scaled to one image pixel per coordinate space
+  unitl, and if the file format used supports encoding resolution
+  metadata, the resolution must be given as 96dpi (one image pixel per
+  CSS pixel).</p>
+
   <p>If <var title="">arguments</var> is not empty, the first value
   must be interpreted as a <span title="MIME type">MIME type</span>
   giving the format to use. If the type has any parameters, it must be
   treated as not supported.</p>
 
-  <p class="example">For example, the value "<code>image/png</code>" would
-  mean to generate a PNG image, the value "<code>image/jpeg</code>"
-  would mean to generate a JPEG image, and the value
-  "<code>image/svg+xml</code>" would mean to generate an SVG image
-  (which would probably require that the implementation actually keep
-  enough information to reliably render an SVG image from the canvas).</p>
+  <p class="example">For example, the value "<code>image/png</code>"
+  would mean to generate a PNG image, the value
+  "<code>image/jpeg</code>" would mean to generate a JPEG image, and
+  the value "<code>image/svg+xml</code>" would mean to generate an SVG
+  image (which would probably require that the implementation actually
+  keep enough information to reliably render an SVG image from the
+  canvas).</p>
 
   <p>User agents must support PNG ("<code>image/png</code>"). User
   agents may support other types. If the user agent does not support
@@ -41732,9 +41771,11 @@
   // pixel manipulation
   <span>ImageData</span> <span title="dom-context-2d-createImageData">createImageData</span>(double sw, double sh);
   <span>ImageData</span> <span title="dom-context-2d-createImageData">createImageData</span>(<span>ImageData</span> imagedata);
+  <span>ImageData</span> <span title="dom-context-2d-createImageDataHD">createImageDataHD</span>(double sw, double sh);
   <span>ImageData</span> <span title="dom-context-2d-getImageData">getImageData</span>(double sx, double sy, double sw, double sh);
+  <span>ImageData</span> <span title="dom-context-2d-getImageDataHD">getImageDataHD</span>(double sx, double sy, double sw, double sh);
   void <span title="dom-context-2d-putImageData">putImageData</span>(<span>ImageData</span> imagedata, double dx, double dy);
-  void <span title="dom-context-2d-putImageData">putImageData</span>(<span>ImageData</span> imagedata, double dx, double dy, double dirtyX, double dirtyY, double dirtyWidth, double dirtyHeight);
+  void <span title="dom-context-2d-putImageDataHD">putImageDataHD</span>(<span>ImageData</span> imagedata, double dx, double dy, double dirtyX, double dirtyY, double dirtyWidth, double dirtyHeight);
 };
 <span>CanvasRenderingContext2D</span> implements <span>CanvasDrawingStyles</span>;
 <span>CanvasRenderingContext2D</span> implements <span>CanvasPathMethods</span>;
@@ -41912,7 +41953,56 @@
   </div>
 
 
+  <h6>Resolution</h6>
 
+  <p>The user agent may use a bitmap of any square resolution as the
+  backing store for a canvas that uses the 2D context. Once a canvas
+  has a bitmap, that canvas must keep its resolution for its
+  lifetime.</p>
+
+  <p class="note">In general, user agents are encouraged to use a
+  resolution equal to the screen resolution. Ideally, the number of
+  device pixels per CSS pixel would be a multiple of two. Several
+  factors can affect the screen resolution: most prominently the
+  actual display resolution, but also important is the current zoom
+  level.</p>
+
+  <p>All the bitmaps created during a single <span
+  title="concept-task">task</span> for canvases that use 2D contexts
+  must have the same resolution.
+  <!--XXX 4INSERT FINGERPRINT-->
+  </p>
+
+  <pre class="idl">partial interface <span>Screen</span> {
+  readonly attribute double <span title="dom-screen-canvasResolution">canvasResolution</span>;
+};</pre>
+
+  <dl class="domintro">
+
+   <dt><var title="">window</var> . <code title="dom-Window-screen">screen</code> . <code title="dom-screen-canvasResolution">canvasResolution</code></dt>
+
+   <dd>
+
+    <p>Returns the resolution that has been, or will be, used for bitmaps during this <span title="concept-task">task</span>.</p>
+
+   </dd>
+
+  </dl>
+
+  <div class="impl">
+
+  <p>The <dfn
+  title="dom-screen-canvasResolution"><code>canvasResolution</code></dfn>
+  attribute of the <code>Screen</code> object must return the
+  resolution, in image pixels per coordinate space units, that any
+  canvas bitmaps created during this <span
+  title="concept-task">task</span> will use (or have used). <a
+  href="#refsCSSOMVIEW">[CSSOMVIEW]</a></p>
+
+  </div>
+
+
+
   <h6>The canvas state</h6>
 
   <p>Each context maintains a stack of drawing states. <dfn
@@ -46686,6 +46776,18 @@
 
    </dd>
 
+   <dt><var title="">imagedata</var> = <var title="">context</var> . <code title="dom-context-2d-createImageDataHD">createImageDataHD</code>(<var title="">sw</var>, <var title="">sh</var>)</dt>
+
+   <dd>
+
+    <p>Returns an <code>ImageData</code> object whose dimensions equal
+    the dimensions given in the arguments, multiplied by the number of
+    pixels in the canvas bitmap that correspond to each coordinate
+    space unit. All the pixels in the returned object are transparent
+    black.</p>
+
+   </dd>
+
    <dt><var title="">imagedata</var> = <var title="">context</var> . <code title="dom-context-2d-getImageData">getImageData</code>(<var title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>, <var title="">sh</var>)</dt>
 
    <dd>
@@ -46703,12 +46805,34 @@
 
    </dd>
 
+   <dt><var title="">imagedata</var> = <var title="">context</var> . <code title="dom-context-2d-getImageDataHD">getImageDataHD</code>(<var title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>, <var title="">sh</var>)</dt>
+
+   <dd>
+
+    <p>Returns an <code>ImageData</code> object containing the image
+    data for the given rectangle of the canvas.</p>
+
+    <p>Throws a <code>NotSupportedError</code> exception if any of the
+    arguments are not finite. Throws an <code>IndexSizeError</code>
+    exception if the either of the width or height arguments are
+    zero.</p>
+
+    <p>The data will be returned at the same resolution as the canvas
+    bitmap.</p>
+
+   </dd>
+
    <dt><var title="">imagedata</var> . <code title="dom-imagedata-width">width</code></dt>
    <dt><var title="">imagedata</var> . <code title="dom-imagedata-height">height</code></dt>
 
    <dd>
 
-    <p>Returns the actual dimensions of the data in the <code>ImageData</code> object, in device pixels.</p>
+    <p>Returns the actual dimensions of the data in the
+    <code>ImageData</code> object, in pixels. For objects returned by
+    the non-HD variants of the methods in this API, this will
+    correspond to the dimensions given to the methods. For the HD
+    variants, the number of pixels might be different than the number
+    of corresponding coordinate space units.</p>
 
    </dd>
 
@@ -46744,55 +46868,123 @@
 
    </dd>
 
+   <dt><var title="">context</var> . <code title="dom-context-2d-putImageDataHD">putImageDataHD</code>(<var title="">imagedata</var>, <var title="">dx</var>, <var title="">dy</var> [, <var title="">dirtyX</var>, <var title="">dirtyY</var>, <var title="">dirtyWidth</var>, <var title="">dirtyHeight</var> ])</dt>
+
+   <dd>
+
+    <p>Paints the data from the given <code>ImageData</code> object
+    onto the canvas, at the canvas bitmap's native resolution. If a
+    dirty rectangle is provided, only the pixels from that rectangle
+    are painted.</p>
+
+    <p>The <code title="dom-context-2d-globalAlpha">globalAlpha</code>
+    and <code
+    title="dom-context-2d-globalCompositeOperation">globalCompositeOperation</code>
+    attributes, as well as the shadow attributes, are ignored for the
+    purposes of this method call; pixels in the canvas are replaced
+    wholesale, with no composition, alpha blending, no shadows,
+    etc.</p>
+
+    <p>Throws a <code>NotSupportedError</code> exception if any of the
+    arguments are not finite.</p>
+
+   </dd>
+
   </dl>
 
   <div class="impl">
 
-  <p>The <dfn
+  <p>The <code
+  title="dom-context-2d-createImageData">createImageData()</code> and
+  <code
+  title="dom-context-2d-createImageDataHD">createImageDataHD()</code>
+  methods are used to instantiate new blank <code>ImageData</code>
+  objects.</p>
+
+  <p>When the <dfn
   title="dom-context-2d-createImageData"><code>createImageData()</code></dfn>
-  method is used to instantiate new blank <code>ImageData</code>
-  objects. When the method is invoked with two arguments <var
-  title="">sw</var> and <var title="">sh</var>, it must return an
-  <code>ImageData</code> object representing a rectangle with a width
-  in equal to the absolute magnitude of <var title="">sw</var> and a
-  height equal to the absolute magnitude of <var title="">sh</var>.
-  When invoked with a single <var title="">imagedata</var> argument,
-  it must return an <code>ImageData</code> object representing a
-  rectangle with the same dimensions as the <code>ImageData</code>
-  object passed as the argument. The <code>ImageData</code> object
-  returned must be filled with transparent black.</p>
+  method is invoked with two arguments <var title="">sw</var> and <var
+  title="">sh</var>, it must return a new <code>ImageData</code>
+  object representing a rectangle with a width in equal to the
+  absolute magnitude of <var title="">sw</var> and a height equal to
+  the absolute magnitude of <var title="">sh</var>. When invoked with
+  a single <var title="">imagedata</var> argument, it must return a
+  new <code>ImageData</code> object representing a rectangle with the
+  same dimensions as the <code>ImageData</code> object passed as the
+  argument. The <code>ImageData</code> object returned must be filled
+  with transparent black.</p>
 
+  <p>When the <dfn
+  title="dom-context-2d-createImageDataHD"><code>createImageDataHD()</code></dfn>
+  method is invoked (with its two arguments <var title="">sw</var> and
+  <var title="">sh</var>) it must return a new <code>ImageData</code>
+  object representing a rectangle with a width in equal to the
+  absolute magnitude of <var title="">sw</var> multiplied by <var
+  title="">scale</var> and a height equal to the absolute magnitude of
+  <var title="">sh</var> multiplied by <var title="">scale</var>,
+  where <var title="">scale</var> is the number of pixels in the
+  canvas bitmap per coordinate space units. The <code>ImageData</code>
+  object returned must be filled with transparent black.</p>
+
   <p>The <dfn
   title="dom-context-2d-getImageData"><code>getImageData(<var
   title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>,
-  <var title="">sh</var>)</code></dfn> method must,
-<!--ADD-TOPIC:Security-->
+  <var title="">sh</var>)</code></dfn> method must, if either the <var
+  title="">sw</var> or <var title="">sh</var> arguments are zero,
+  throw an <code>IndexSizeError</code> exception; otherwise,
+  <!--ADD-TOPIC:Security-->
   if the <code>canvas</code> element's <i>origin-clean</i> flag is set
-  to false, throw a <code>SecurityError</code> exception; otherwise, it
-<!--REMOVE-TOPIC:Security-->
-  must return an <code>ImageData</code> object with width <var
-  title="">sw</var> and height <var title="">sh</var> representing the
-  underlying pixel data for the area of the canvas denoted by the
-  rectangle whose corners are the four points (<var title="">sx</var>,
-  <var title="">sy</var>), (<span title=""><var title="">sx</var>+<var
-  title="">sw</var></span>, <var title="">sy</var>), (<span
-  title=""><var title="">sx</var>+<var title="">sw</var></span>, <span
-  title=""><var title="">sy</var>+<var title="">sh</var></span>),
-  (<var title="">sx</var>, <span title=""><var title="">sy</var>+<var
-  title="">sh</var></span>), in canvas coordinate space units. Pixels
-  outside the canvas must be returned as transparent black. Pixels
-  must be returned as non-premultiplied alpha values.</p>
+  to false, it must throw a <code>SecurityError</code> exception;
+  <!--REMOVE-TOPIC:Security-->
+  otherwise, it must return an <code>ImageData</code> object with
+  width <var title="">sw</var> and height <var title="">sh</var>
+  representing the canvas bitmap for the area of the canvas denoted by
+  the rectangle whose corners are the four points (<var
+  title="">sx</var>, <var title="">sy</var>), (<span title=""><var
+  title="">sx</var>+<var title="">sw</var></span>, <var
+  title="">sy</var>), (<span title=""><var title="">sx</var>+<var
+  title="">sw</var></span>, <span title=""><var title="">sy</var>+<var
+  title="">sh</var></span>), (<var title="">sx</var>, <span
+  title=""><var title="">sy</var>+<var title="">sh</var></span>), in
+  canvas coordinate space units. If the canvas bitmap does not
+  represent each coordinate space unit square using exactly one pixel,
+  the value of each pixel in the returned abject must be derived from
+  the value(s) of the pixel(s) in the canvas bitmap that correspond to
+  the same coordinate. Pixels outside the canvas must be returned as
+  transparent black. Pixels must be returned as non-premultiplied
+  alpha values.</p>
 
-  <p>If either the <var title="">sw</var> or <var title="">sh</var>
-  arguments are zero, the method must instead throw an
-  <code>IndexSizeError</code> exception.</p>
+  <p>The <dfn
+  title="dom-context-2d-getImageDataHD"><code>getImageDataHD(<var
+  title="">sx</var>, <var title="">sy</var>, <var title="">sw</var>,
+  <var title="">sh</var>)</code></dfn> method must, if either the <var
+  title="">sw</var> or <var title="">sh</var> arguments are zero,
+  throw an <code>IndexSizeError</code> exception; otherwise,
+  <!--ADD-TOPIC:Security-->
+  if the <code>canvas</code> element's <i>origin-clean</i> flag is set
+  to false, it must throw a <code>SecurityError</code> exception;
+  <!--REMOVE-TOPIC:Security-->
+  otherwise, it must return an <code>ImageData</code> object with
+  width <var title="">sw</var> multiplied by <var title="">scale</var>
+  and height <var title="">sh</var> multiplied by <var
+  title="">scale</var> representing the canvas bitmap data for the
+  area of the canvas denoted by the rectangle whose corners are the
+  four points (<var title="">sx</var>, <var title="">sy</var>), (<span
+  title=""><var title="">sx</var>+<var title="">sw</var></span>, <var
+  title="">sy</var>), (<span title=""><var title="">sx</var>+<var
+  title="">sw</var></span>, <span title=""><var title="">sy</var>+<var
+  title="">sh</var></span>), (<var title="">sx</var>, <span
+  title=""><var title="">sy</var>+<var title="">sh</var></span>), in
+  canvas coordinate space units. Pixels outside the canvas must be
+  returned as transparent black. Pixels must be returned as
+  non-premultiplied alpha values.</p>
 
-  <p><code>ImageData</code> objects must be initialized so that their
-  <dfn title="dom-imagedata-width"><code>width</code></dfn> attribute
-  is set to the number of pixels per row in the image data, their <dfn
-  title="dom-imagedata-height"><code>height</code></dfn> attribute is
-  set to the number of rows in the image data, and their <dfn
-  title="dom-imagedata-data"><code>data</code></dfn> attribute is
+  <p>New <code>ImageData</code> objects must be initialized so that
+  their <dfn title="dom-imagedata-width"><code>width</code></dfn>
+  attribute is set to the number of pixels per row in the image data,
+  their <dfn title="dom-imagedata-height"><code>height</code></dfn>
+  attribute is set to the number of rows in the image data, and their
+  <dfn title="dom-imagedata-data"><code>data</code></dfn> attribute is
   initialized to a <code>Uint8ClampedArray</code> object. The
   <code>Uint8ClampedArray</code> object must use a <span>Canvas Pixel
   <code>ArrayBuffer</code></span> for its storage, and must have a
@@ -46813,24 +47005,23 @@
   component. <a href="#refsTYPEDARRAY">[TYPEDARRAY]</a></p>
 
   <p>The <dfn
-  title="dom-context-2d-putImageData"><code>putImageData(<var
-  title="">imagedata</var>, <var title="">dx</var>, <var
-  title="">dy</var>, <var title="">dirtyX</var>, <var
-  title="">dirtyY</var>, <var title="">dirtyWidth</var>, <var
-  title="">dirtyHeight</var>)</code></dfn> method writes data from
-  <code>ImageData</code> structures back to the canvas.</p>
+  title="dom-context-2d-putImageData"><code>putImageData()</code></dfn>
+  and <dfn
+  title="dom-context-2d-putImageDataHD"><code>putImageDataHD()</code></dfn>
+  methods write data from <code>ImageData</code> structures back to
+  the canvas. Their arguments are: <var title="">imagedata</var>, <var
+  title="">dx</var>, <var title="">dy</var>, <var
+  title="">dirtyX</var>, <var title="">dirtyY</var>, <var
+  title="">dirtyWidth</var>, and <var title="">dirtyHeight</var>.</p>
 
-  <p>When the last four arguments are omitted, they must be assumed to
-  have the values 0, 0, the <code
+  <p>When the last four arguments to these methods are omitted, they
+  must be assumed to have the values 0, 0, the <code
   title="dom-imagedata-width">width</code> member of the <var
   title="">imagedata</var> structure, and the <code
   title="dom-imagedata-height">height</code> member of the <var
   title="">imagedata</var> structure, respectively.</p>
 
-  <p>When invoked with arguments that do not, per the last few
-  paragraphs, cause an exception to be thrown, the <code
-  title="dom-context-2d-putImageData">putImageData()</code> method
-  must act as follows:</p>
+  <p>When invoked, these methods must act as follows:</p>
 
   <ol>
 
@@ -46894,73 +47085,84 @@
 
    <li>
 
-    <p>Draw the region of the image data in the horizontal rectangle
-    whose top left corner is at (<var title="">dirtyX</var>,<var
-    title="">dirtyY</var>) and whose bottom right corner is at (<span
-    title=""><var title="">dirtyX</var>+<var
-    title="">dirtyWidth</var></span>,<span title=""><var
-    title="">dirtyY</var>+<var title="">dirtyHeight</var></span>) onto
-    the canvas, aligned such that the top left of the rectangle is at
-    coordinate (<var title="">dx</var>,<var title="">dy</var>).</p>
+    <p>Run the appropriate steps from the following list:</p>
 
-    <p>If the <code
-    title="dom-context-2d-imageSmoothingEnabled">imageSmoothingEnabled</code>
-    attribute is set to true, then the user agent should attempt to
-    apply a smoothing algorithm to the image data if the canvas does
-    not have exactly one device pixel per coordinate space unit in its
-    underlying pixel data.</p>
+    <dl class="switch">
 
-   </li>
+     <dt>If the method was <code title="dom-context-2d-putImageData">putImageData()</code></dt>
 
-  </ol>
+     <dd>
 
-<!-- XXXXX
+      <p>Draw the region of the image data in the horizontal rectangle
+      whose top left corner is at (<var title="">dirtyX</var>,<var
+      title="">dirtyY</var>) and whose bottom right corner is at
+      (<span title=""><var title="">dirtyX</var>+<var
+      title="">dirtyWidth</var></span>,<span title=""><var
+      title="">dirtyY</var>+<var title="">dirtyHeight</var></span>)
+      onto the canvas, aligned such that the top left of the rectangle
+      is at coordinate (<var title="">dx</var>,<var
+      title="">dy</var>).</p>
 
-   <li>
+      <p>If the <code
+      title="dom-context-2d-imageSmoothingEnabled">imageSmoothingEnabled</code>
+      attribute is set to true, then the user agent should attempt to
+      apply a smoothing algorithm to the image data if the canvas does
+      not have exactly one device pixel per coordinate space unit in
+      the canvas bitmap.</p>
 
-    <p>Let <var title="">scale</var> be the number of device pixels in
-    the underlying pixel data of the canvas per coordinate space
-    unit.</p>
+     </dd>
 
-   </li>
+     <dt>If the method was <code title="dom-context-2d-putImageDataHD">putImageDataHD()</code></dt>
 
-   <li>
+     <dd>
 
-    <p>Let <var title="">dx<sub>device</sub></var> be the x-coordinate
-    of the device pixel in the underlying pixel data of the canvas
-    corresponding to the <var title="">dx</var> coordinate in the
-    canvas coordinate space.</p>
+      <ol>
 
-    <p>Let <var title="">dy<sub>device</sub></var> be the y-coordinate
-    of the device pixel in the underlying pixel data of the canvas
-    corresponding to the <var title="">dy</var> coordinate in the
-    canvas coordinate space.</p>
+       <li>
 
+        <p>Let <var title="">dx<sub>device</sub></var> be the x-coordinate
+        of the device pixel in the canvas bitmap corresponding to the <var
+        title="">dx</var> coordinate in the canvas coordinate space.</p>
+
+        <p>Let <var title="">dy<sub>device</sub></var> be the y-coordinate
+        of the device pixel in the canvas bitmap corresponding to the <var
+        title="">dy</var> coordinate in the canvas coordinate space.</p>
+
+       </li>
+
+       <li><p>For all integer values of <var title="">x</var>
+       and <var title="">y</var> where <span title=""><var
+       title="">dirtyX</var> ≤ <var
+       title="">x</var> < <span title=""><var
+       title="">dirtyX</var>+<var title="">dirtyWidth</var></span></span>
+       and <span title=""><var title="">dirtyY</var> ≤ <var
+       title="">y</var> < <span title=""><var
+       title="">dirtyY</var>+<var
+       title="">dirtyHeight</var></span></span>, copy the four channels of
+       the pixel with coordinate (<var title="">x</var>, <var
+       title="">y</var>) in the <var title="">imagedata</var> data
+       structure to the pixel with coordinate (<span title=""><var
+       title="">dx<sub>device</sub></var>+<var title="">x</var></span>,
+       <span title=""><var title="">dy<sub>device</sub></var>+<var
+       title="">y</var></span>) in the canvas bitmap of the
+       canvas.</p></li>
+
+      </ol>
+
+     </dd>
+
+    </dl>
+
    </li>
 
-   <li><p>Otherwise, for all integer values of <var title="">x</var>
-   and <var title="">y</var> where <span title=""><var
-   title="">dirtyX</var> ≤ <var
-   title="">x</var> < <span title=""><var
-   title="">dirtyX</var>+<var title="">dirtyWidth</var></span></span>
-   and <span title=""><var title="">dirtyY</var> ≤ <var
-   title="">y</var> < <span title=""><var
-   title="">dirtyY</var>+<var
-   title="">dirtyHeight</var></span></span>, copy the four channels of
-   the pixel with coordinate (<var title="">x</var>, <var
-   title="">y</var>) in the <var title="">imagedata</var> data
-   structure to the pixel with coordinate (<span title=""><var
-   title="">dx<sub>device</sub></var>+<var title="">x</var></span>,
-   <span title=""><var title="">dy<sub>device</sub></var>+<var
-   title="">y</var></span>) in the underlying pixel data of the
-   canvas.</p></li>
+  </ol>
 
   <p>The handling of pixel rounding when the specified coordinates do
   not exactly map to the device coordinate space is not defined by
   this specification, except that the following must result in no
   visible changes to the rendering:</p>
 
-  <pre>context.putImageData(context.getImageData(x, y, w, h), p, q);</pre>
+  <pre>context.putImageDataHD(context.getImageDataHD(x, y, w, h), p, q);</pre>
 
   <p>...for any value of <var title="">x</var>, <var title="">y</var>,
   <var title="">w</var>, and <var title="">h</var> and where <var
@@ -46974,30 +47176,25 @@
 context.getImageData(0, 0, w, h);</pre>
 
   <p>...must return <code>ImageData</code> objects with the same
-  dimensions, for any value of <var title="">w</var> and <var
-  title="">h</var>. In other words, while user agents may round the
-  arguments of these methods so that they map to device pixel
-  boundaries, any rounding performed must be performed consistently
-  for all of the <code
-  title="dom-context-2d-getImageData">createImageData()</code>, <code
-  title="dom-context-2d-getImageData">getImageData()</code> and <code
-  title="dom-context-2d-putImageData">putImageData()</code>
-  operations.</p>
+  dimensions as each other, and the following two calls:<p>
 
-  <p class="note">This implies that the data returned by <code
-  title="dom-context-2d-getImageData">getImageData()</code> is at the
-  resolution of the canvas backing store. This is likely to not be one
-  device pixel to each CSS pixel if the display used is a high
-  resolution display.</p>
+  <pre>context.createImageDataHD(w, h);
+context.getImageDataHD(0, 0, w, h);</pre>
 
+  <p>...must also return <code>ImageData</code> objects with the same
+  dimensions as each other, for any value of <var title="">w</var> and
+  <var title="">h</var> in both cases. In other words, while user
+  agents may round the arguments of these methods so that they map to
+  device pixel boundaries, any rounding performed must be performed
+  consistently for all of the methods described in this section.</p>
+
   <p class="note">Due to the lossy nature of converting to and from
   premultiplied alpha color values, pixels that have just been set
   using <code
-  title="dom-context-2d-putImageData">putImageData()</code> might be
-  returned to an equivalent <code
-  title="dom-context-2d-getImageData">getImageData()</code> as
+  title="dom-context-2d-putImageDataHD">putImageDataHD()</code> might
+  be returned to an equivalent <code
+  title="dom-context-2d-getImageDataHD">getImageDataHD()</code> as
   different values.</p>
--->
 
   <p>The current path, <span
   title="dom-context-2d-transformation">transformation matrix</span>,
@@ -47005,10 +47202,8 @@
   title="dom-context-2d-globalAlpha">global alpha</span>, the
   <span>clipping region</span>, and <span
   title="dom-context-2d-globalCompositeOperation">global composition
-  operator</span> must not affect the <code
-  title="dom-context-2d-getImageData">getImageData()</code> and <code
-  title="dom-context-2d-putImageData">putImageData()</code>
-  methods.</p>
+  operator</span> must not affect the methods described in this
+  section.</p>
 
   </div>
 
@@ -47021,7 +47216,7 @@
 var context = canvas.getContext('2d');
 
 // create a blank slate
-var data = context.createImageData(canvas.width, canvas.height);
+var data = context.createImageDataHD(canvas.width, canvas.height);
 
 // create some plasma
 FillPlasma(data, 'green'); // green plasma
@@ -47030,7 +47225,7 @@
 AddCloud(data, data.width/2, data.height/2); // put a cloud in the middle
 
 // paint the plasma+cloud on the canvas
-context.putImageData(data, 0, 0);
+context.putImageDataHD(data, 0, 0);
 
 // support methods
 function FillPlasma(data, color) { ... }
@@ -47041,9 +47236,9 @@
   <div class="example">
 
    <p>Here is an example of using <code
-   title="dom-context-2d-getImageData">getImageData()</code> and <code
-   title="dom-context-2d-putImageData">putImageData()</code> to
-   implement an edge detection filter.</p>
+   title="dom-context-2d-getImageDataHD">getImageDataHD()</code> and
+   <code title="dom-context-2d-putImageDataHD">putImageDataHD()</code>
+   to implement an edge detection filter.</p>
 
    <pre><!DOCTYPE HTML>
 <html>
@@ -47063,10 +47258,10 @@
      context.drawImage(image, 0, 0);
 
      // get the image data to manipulate
-     var input = context.getImageData(0, 0, canvas.width, canvas.height);
+     var input = context.getImageDataHD(0, 0, canvas.width, canvas.height);
 
      // get an empty slate to put the data into
-     var output = context.createImageData(canvas.width, canvas.height);
+     var output = context.createImageDataHD(canvas.width, canvas.height);
 
      // alias some variables for convenience
      // notice that we are using input.width and input.height here
@@ -47090,7 +47285,7 @@
      }
 
      // put the image data back after manipulation
-     context.putImageData(output, 0, 0);
+     context.putImageDataHD(output, 0, 0);
    }
   </script>
  </head>
@@ -47668,16 +47863,15 @@
 
   <p class="note">Thus, in the 2D context, colors used to draw shapes
   onto the canvas will exactly match colors obtained through the <code
-  title="dom-context-2d-getImageData">getImageData()</code>
+  title="dom-context-2d-getImageDataHD">getImageDataHD()</code>
   method.</p>
 
   <p>The <code title="dom-canvas-toDataURL">toDataURL()</code> method
-  must not include color space information in the resource
-  returned. Where the output format allows it, the color of pixels in
-  resources created by <code
-  title="dom-canvas-toDataURL">toDataURL()</code> must match those
-  returned by the <code
-  title="dom-context-2d-getImageData">getImageData()</code>
+  must not include color space information in the resource returned.
+  Where the output format allows it, the color of pixels in resources
+  created by <code title="dom-canvas-toDataURL">toDataURLHD()</code>
+  must match those returned by the <code
+  title="dom-context-2d-getImageDataHD">getImageDataHD()</code>
   method.</p>
 
   <p>In user agents that support CSS, the color space used by a
@@ -47779,10 +47973,12 @@
   </ul>
 
   <p>The <code title="dom-canvas-toDataURL">toDataURL()</code>, <code
-  title="dom-canvas-toBlob">toBlob()</code>, and <code
-  title="dom-context-2d-getImageData">getImageData()</code> methods
-  check the flag and will throw a <code>SecurityError</code> exception
-  rather than leak cross-origin data.</p>
+  title="dom-canvas-toDataURLHD">toDataURLHD()</code>, <code
+  title="dom-canvas-toBlob">toBlob()</code>, <code
+  title="dom-context-2d-getImageData">getImageData()</code>, and <code
+  title="dom-context-2d-getImageDataHD">getImageDataHD()</code>
+  methods check the flag and will throw a <code>SecurityError</code>
+  exception rather than leak cross-origin data.</p>
 
   <p class="note">Even resetting the canvas state by changing its
   <code title="attr-canvas-width">width</code> or <code