<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD>
<META http-equiv=Content-Type content="text/html; charset=us-ascii">
<META content="MSHTML 6.00.2900.3698" name=GENERATOR>
<STYLE>@font-face {
        font-family: Calibri;
}
@font-face {
        font-family: Tahoma;
}
@font-face {
        font-family: Segoe UI;
}
@page WordSection1 {size: 8.5in 11.0in; margin: 1.0in 1.0in 1.0in 1.0in; }
P.MsoNormal {
        FONT-SIZE: 11pt; MARGIN: 0in 0in 0pt; FONT-FAMILY: "Calibri","sans-serif"
}
LI.MsoNormal {
        FONT-SIZE: 11pt; MARGIN: 0in 0in 0pt; FONT-FAMILY: "Calibri","sans-serif"
}
DIV.MsoNormal {
        FONT-SIZE: 11pt; MARGIN: 0in 0in 0pt; FONT-FAMILY: "Calibri","sans-serif"
}
A:link {
        COLOR: blue; TEXT-DECORATION: underline; mso-style-priority: 99
}
SPAN.MsoHyperlink {
        COLOR: blue; TEXT-DECORATION: underline; mso-style-priority: 99
}
A:visited {
        COLOR: purple; TEXT-DECORATION: underline; mso-style-priority: 99
}
SPAN.MsoHyperlinkFollowed {
        COLOR: purple; TEXT-DECORATION: underline; mso-style-priority: 99
}
P.MsoPlainText {
        FONT-SIZE: 11pt; MARGIN: 0in 0in 0pt; FONT-FAMILY: "Calibri","sans-serif"; mso-style-priority: 99; mso-style-link: "Plain Text Char"
}
LI.MsoPlainText {
        FONT-SIZE: 11pt; MARGIN: 0in 0in 0pt; FONT-FAMILY: "Calibri","sans-serif"; mso-style-priority: 99; mso-style-link: "Plain Text Char"
}
DIV.MsoPlainText {
        FONT-SIZE: 11pt; MARGIN: 0in 0in 0pt; FONT-FAMILY: "Calibri","sans-serif"; mso-style-priority: 99; mso-style-link: "Plain Text Char"
}
SPAN.PlainTextChar {
        FONT-FAMILY: "Calibri","sans-serif"; mso-style-priority: 99; mso-style-link: "Plain Text"; mso-style-name: "Plain Text Char"
}
SPAN.EmailStyle19 {
        COLOR: windowtext; FONT-FAMILY: "Segoe UI","sans-serif"; mso-style-type: personal
}
SPAN.EmailStyle20 {
        FONT-WEIGHT: normal; COLOR: #1f497d; FONT-STYLE: normal; FONT-FAMILY: "Segoe UI","sans-serif"; mso-style-type: personal-reply
}
.MsoChpDefault {
        FONT-SIZE: 10pt; mso-style-type: export-only
}
DIV.WordSection1 {
        page: WordSection1
}
</STYLE>
<!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="1026" />
</xml><![endif]--><!--[if gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1" />
</o:shapelayout></xml><![endif]--></HEAD>
<BODY text=#000000 bgColor=#ffffff>
<DIV dir=ltr align=left><SPAN class=870351118-03012011><FONT face=Arial 
color=#0000ff size=2>I thought that the issue was settled as well, but after 
talking to Ian Hixie and Philip Taylor, Ian indicated that if someone provides a 
clear formulation of the spec text that matches webkit behavior, the spec would 
likely be changed to match that.</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=870351118-03012011><FONT face=Arial 
color=#0000ff size=2>I have proposed the changes below, but got no reply (or if 
I got any I missed them):</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=870351118-03012011><SPAN lang=EN>
<P>TML5 - Canvas.</P>
<P>I have read this thread (from and of July 2010) and I happen to agree that 
the Safari/Chromium implementation is more intuitive, and likely less expensive 
to implement, therefore I offer these 2 proposals for changing the spec's 
Drawing model section to match what I perceive to be the preference of most 
people in that discussion.</P>
<P>Of note: According to the current Drawing model, an opaque shape's shadow 
would be erased as part of step 6 when drawn with source-in composite Mode if 
globalAlpha is 1, which is probably not the intended behavior.</P>
<P>Version 1:</P>
<P>4.8.11.1.13 Drawing model</P>
<P><FONT face=Arial color=#0000ff size=2></FONT> </P>
<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>
<P>1. Render the shape or image onto an infinite transparent black bitmap, 
creating image M1, as described in the previous sections except that for the 
purpose of this step every pixel of the image will be considered to be fully 
opaque white and the current fillStyle will be considered to be solid fully 
opaque white and the strokeStyle will be considered fullyOpaque white as 
well.</P>
<P>2. When shadows are drawn, render the shadow from image M1, using a fully 
opaque white shadow color as described in the shadows section, creating image 
M2.</P>
<P>3. Let C1 be a region obtained by intersecting the canvas's cliping region 
with the set of pixels in the canvas that correspond to pixels in M1 (by having 
the same coordinates) that are not fully transparent.</P>
<P>4. Let C2 be a region obtained by intersecting the canvas's cliping region 
with the set of pixels in the canvas that correspond to pixels in M2 (by having 
the same coordinates) that are not fully transparent.</P>
<P>5. Render the shape or image onto an infinite transparent black bitmap, 
creating image A, as described in the previous sections. For shapes, the current 
fill, stroke, and line styles must be honored, and the stroke must itself also 
be subjected to the current transformation matrix.</P>
<P>6. When shadows are drawn, render the shadow from image A, using the current 
shadow styles, creating image B.</P>
<P>7. When shadows are drawn, multiply the alpha component of every pixel in B 
by globalAlpha.</P>
<P>8. When shadows are drawn, composite B with the current canvas bitmap, 
cliping results to region C2 defined above, using the current composition 
operator.</P>
<P>9. Multiply the alpha component of every pixel in A by globalAlpha.</P>
<P>10. Composite A with the current canvas bitmap, cliping results to region C1 
defined above, using the current composition operator. </P>
<P><FONT face=Arial color=#0000ff size=2></FONT> </P>
<P>Version 2:</P>
<P>4.8.11.1.13 Drawing model</P>
<P><FONT face=Arial color=#0000ff size=2></FONT> </P>
<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>
<P>1. Render the shape or image onto an infinite transparent black bitmap, 
creating image A, as described in the previous sections. For shapes, the current 
fill, stroke, and line styles must be honored, and the stroke must itself also 
be subjected to the current transformation matrix.</P>
<P>2. When shadows are drawn, render the shadow from image A, using the current 
shadow styles, creating image B.</P>
<P>3. When shadows are drawn, multiply the alpha component of every pixel in B 
by globalAlpha.</P>
<P>4. When shadows are drawn, composite, using the current composition operator, 
B with the current canvas bitmap, cliping results to the cliping region of the 
canvas and to the pixels that would have taken the shadow's color if the 
composition operator would have been source-over and the shadow would have been 
fully opaque and the globalAlpha would have been 1.</P>
<P>5. Multiply the alpha component of every pixel in A by globalAlpha.</P>
<P>6. Composite, using the current composition operator, A with the current 
canvas bitmap, cliping results to the cliping region of the canvas and to the 
pixels that would have taken the shape's or image's pixel color if the 
composition operator would have been source-over and the image would have been 
fully opaque, the fillStyle and strokeStyle would have been a solid fully opaque 
color, and the globalAlpha would have been 1. </P>
<P> </P>
<P>I also suggest, this change to section 4.8.11.1.3 Compositing:</P>
<P>Instead of:</P>
<P>The operators in the above list must be treated as described by the 
Porter-Duff operator given at the start of their description (e.g. A over B). 
They are to be applied as part of the drawing model, at which point the clipping 
region is also applied. (Without a clipping region, these operators act on the 
whole bitmap with every operation.) [PORTERDUFF]</P>
<P>Say:</P>
<P>The operators in the above list must be treated as described by the 
Porter-Duff operator [PORTERDUFF] given at the start of their description (e.g. 
A over B). They are to be applied as part of the drawing model, which also 
defines the pixels in the canvas that are to be composited.</P>
<P><FONT face=Arial color=#0000ff 
size=2></FONT> </P></SPAN></SPAN></DIV><BR>
<BLOCKQUOTE dir=ltr 
style="PADDING-LEFT: 5px; MARGIN-LEFT: 5px; BORDER-LEFT: #0000ff 2px solid; MARGIN-RIGHT: 0px">
  <DIV class=OutlookMessageHeader lang=en-us dir=ltr align=left>
  <HR tabIndex=-1>
  <FONT face=Tahoma size=2><B>From:</B> whatwg-bounces@lists.whatwg.org 
  [mailto:whatwg-bounces@lists.whatwg.org] <B>On Behalf Of </B>ext Charles 
  Pritchard<BR><B>Sent:</B> Friday, December 31, 2010 8:20 PM<BR><B>To:</B> 
  whatwg<BR><B>Subject:</B> [whatwg] Fwd: RE: Inconsistent behaviour of 
  globalCompositeOperation property<BR></FONT><BR></DIV>
  <DIV></DIV>Implementation issues with the Drawing Model [1] have been floating 
  around for some time.<BR>For whatever reasons, Microsoft is not willing to 
  publicly discuss their issue with the spec,<BR>beyond the scant details listed 
  below.<BR><BR>That's fine and all.. I'm bringing it to the WHATWG's attention 
  because it seems to me<BR>like some of the confusion could be avoided were a 
  "standard" PNG photo available,<BR>demonstrating proper behavior.<BR><BR>I 
  thought this issue was resolved some time ago, but it keeps coming up.<BR>I 
  don't fault anyone, it's a very subtle part of the spec.<BR><BR>This reference 
  image helped me communicate with Robert (Mozilla) last year, about the drawing 
  model section.<BR>Screen cap:<BR><A class=moz-txt-link-freetext 
  href="http://imgur.com/zUu66.png">http://imgur.com/zUu66.png</A> <BR>Generated 
  from:<BR><A class=moz-txt-link-freetext 
  href="https://developer.mozilla.org/en/Canvas_tutorial/Compositing">https://developer.mozilla.org/en/Canvas_tutorial/Compositing</A> 
  <BR>Thread:<BR><A class=moz-txt-link-freetext 
  href="http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2009-December/024316.html">http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2009-December/024316.html</A> 
  <BR><BR>There seems to still be some disagreement over composting:<BR><A 
  class=moz-txt-link-freetext 
  href="https://bugs.webkit.org/show_bug.cgi?id=39177">https://bugs.webkit.org/show_bug.cgi?id=39177</A> 
  <BR><BR>I thought we had a handle on this, following some slight changes to 
  the spec by Ian:<BR><A class=moz-txt-link-freetext 
  href="http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2009-October/023706.html">http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2009-October/023706.html</A> 
  <BR><BR>Apparently it's not handled yet.<BR><BR>Sending out a flare, hoping 
  that we can get this issue put to rest before the next round<BR>of major 
  releases.<BR><BR><BR>-Charles<BR><BR>Below are the only public comments I'm 
  aware of, that MS has posted on the issue:<BR><A class=moz-txt-link-freetext 
  href="http://lists.w3.org/Archives/Public/public-canvas-api/2010OctDec/0070.html">http://lists.w3.org/Archives/Public/public-canvas-api/2010OctDec/0070.html</A> 
  <BR>Earlier thread... <BR><A class=moz-txt-link-freetext 
  href="http://lists.w3.org/Archives/Public/public-canvas-api/2010AprJun/0046.html">http://lists.w3.org/Archives/Public/public-canvas-api/2010AprJun/0046.html</A> 
  <BR><BR>These comments lack the detail necessary to provide feedback. 
  <BR><BR><BR>-------- Original Message -------- 
  <TABLE class=moz-email-headers-table cellSpacing=0 cellPadding=0 border=0>
    <TBODY>
    <TR>
      <TH vAlign=baseline noWrap align=right>Subject: </TH>
      <TD>RE: Inconsistent behaviour of globalCompositeOperation 
property</TD></TR>
    <TR>
      <TH vAlign=baseline noWrap align=right>Resent-Date: </TH>
      <TD>Wed, 15 Dec 2010 23:47:24 +0000</TD></TR>
    <TR>
      <TH vAlign=baseline noWrap align=right>Resent-From: </TH>
      <TD><A class=moz-txt-link-abbreviated 
        href="mailto:public-canvas-api@w3.org">public-canvas-api@w3.org</A></TD></TR>
    <TR>
      <TH vAlign=baseline noWrap align=right>Date: </TH>
      <TD>Wed, 15 Dec 2010 23:45:39 +0000</TD></TR>
    <TR>
      <TH vAlign=baseline noWrap align=right>From: </TH>
      <TD>Jatinder Mann <A class=moz-txt-link-rfc2396E 
        href="mailto:jmann@microsoft.com"><jmann@microsoft.com></A></TD></TR>
    <TR>
      <TH vAlign=baseline noWrap align=right>To: </TH>
      <TD><A class=moz-txt-link-abbreviated 
        href="mailto:public-canvas-api@w3.org">public-canvas-api@w3.org</A> <A 
        class=moz-txt-link-rfc2396E 
        href="mailto:public-canvas-api@w3.org"><public-canvas-api@w3.org></A></TD></TR></TBODY></TABLE><BR><BR>
  <META content="Microsoft Word 14 (filtered medium)" name=Generator>
  <STYLE>@font-face {
        font-family: Calibri;
}
@font-face {
        font-family: Tahoma;
}
@font-face {
        font-family: Segoe UI;
}
@page WordSection1 {size: 8.5in 11.0in; margin: 1.0in 1.0in 1.0in 1.0in; }
P.MsoNormal {
        FONT-SIZE: 11pt; MARGIN: 0in 0in 0pt; FONT-FAMILY: "Calibri","sans-serif"
}
LI.MsoNormal {
        FONT-SIZE: 11pt; MARGIN: 0in 0in 0pt; FONT-FAMILY: "Calibri","sans-serif"
}
DIV.MsoNormal {
        FONT-SIZE: 11pt; MARGIN: 0in 0in 0pt; FONT-FAMILY: "Calibri","sans-serif"
}
A:link {
        COLOR: blue; TEXT-DECORATION: underline; mso-style-priority: 99
}
SPAN.MsoHyperlink {
        COLOR: blue; TEXT-DECORATION: underline; mso-style-priority: 99
}
A:visited {
        COLOR: purple; TEXT-DECORATION: underline; mso-style-priority: 99
}
SPAN.MsoHyperlinkFollowed {
        COLOR: purple; TEXT-DECORATION: underline; mso-style-priority: 99
}
P.MsoPlainText {
        FONT-SIZE: 11pt; MARGIN: 0in 0in 0pt; FONT-FAMILY: "Calibri","sans-serif"; mso-style-priority: 99; mso-style-link: "Plain Text Char"
}
LI.MsoPlainText {
        FONT-SIZE: 11pt; MARGIN: 0in 0in 0pt; FONT-FAMILY: "Calibri","sans-serif"; mso-style-priority: 99; mso-style-link: "Plain Text Char"
}
DIV.MsoPlainText {
        FONT-SIZE: 11pt; MARGIN: 0in 0in 0pt; FONT-FAMILY: "Calibri","sans-serif"; mso-style-priority: 99; mso-style-link: "Plain Text Char"
}
SPAN.PlainTextChar {
        FONT-FAMILY: "Calibri","sans-serif"; mso-style-priority: 99; mso-style-link: "Plain Text"; mso-style-name: "Plain Text Char"
}
SPAN.EmailStyle19 {
        COLOR: windowtext; FONT-FAMILY: "Segoe UI","sans-serif"; mso-style-type: personal
}
SPAN.EmailStyle20 {
        FONT-WEIGHT: normal; COLOR: #1f497d; FONT-STYLE: normal; FONT-FAMILY: "Segoe UI","sans-serif"; mso-style-type: personal-reply
}
.MsoChpDefault {
        FONT-SIZE: 10pt; mso-style-type: export-only
}
DIV.WordSection1 {
        page: WordSection1
}
</STYLE>
<!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="1026" />
</xml><![endif]--><!--[if gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1" />
</o:shapelayout></xml><![endif]-->
  <DIV class=WordSection1>
  <P class=MsoNormal><SPAN style="COLOR: black">We initially felt that the 
  Drawing Model [1], as written in the spec, was incorrectly defined. We have 
  since consulted with many graphics experts, and it appears that the spec as 
  written, and implemented by Firefox and Opera, is the correct definition of 
  Porter-Duff and composition operations, and its behavior is acceptable. 
  <O:P></O:P></SPAN></P>
  <P class=MsoNormal style="MARGIN-LEFT: 0.5in"><SPAN 
  style="COLOR: black"><O:P></O:P></SPAN></P>
  <P class=MsoNormal><SPAN style="COLOR: black">Thanks,<O:P></O:P></SPAN></P>
  <P class=MsoNormal><SPAN style="COLOR: black">Jatinder<O:P></O:P></SPAN></P>
  <P class=MsoNormal style="MARGIN-LEFT: 0.5in"><SPAN 
  style="COLOR: black"><O:P></O:P></SPAN></P>
  <P class=MsoPlainText>[1] <A 
  href="http://dev.w3.org/html5/2dcontext/#drawing-model" 
  moz-do-not-send="true">http://dev.w3.org/html5/2dcontext/#drawing-model</A> 
  <O:P></O:P></P>
  <P class=MsoNormal style="MARGIN-LEFT: 0.5in"><SPAN 
  style="COLOR: black"><O:P></O:P></SPAN></P>
  <P class=MsoPlainText>Jatinder Mann | Microsoft Program Manager | <A 
  href="mailto:jmann@microsoft.com" 
  moz-do-not-send="true">jmann@microsoft.com</A><O:P></O:P></P>
  <P class=MsoNormal><SPAN 
  style="FONT-SIZE: 10pt; COLOR: rgb(31,73,125); FONT-FAMILY: 'Segoe UI','sans-serif'"><O:P></O:P></SPAN></P>
  <DIV>
  <DIV 
  style="BORDER-RIGHT: medium none; PADDING-RIGHT: 0in; BORDER-TOP: rgb(181,196,223) 1pt solid; PADDING-LEFT: 0in; PADDING-BOTTOM: 0in; BORDER-LEFT: medium none; PADDING-TOP: 3pt; BORDER-BOTTOM: medium none">
  <P class=MsoNormal><B><SPAN 
  style="FONT-SIZE: 10pt; FONT-FAMILY: 'Tahoma','sans-serif'">From:</SPAN></B><SPAN 
  style="FONT-SIZE: 10pt; FONT-FAMILY: 'Tahoma','sans-serif'"> <A 
  class=moz-txt-link-abbreviated 
  href="mailto:public-canvas-api-request@w3.org">public-canvas-api-request@w3.org</A> 
  [<A class=moz-txt-link-freetext 
  href="mailto:public-canvas-api-request@w3.org">mailto:public-canvas-api-request@w3.org</A>] 
  <B>On Behalf Of </B>Jatinder Mann<BR><B>Sent:</B> Tuesday, May 25, 2010 11:57 
  AM<BR><B>To:</B> <A class=moz-txt-link-abbreviated 
  href="mailto:public-canvas-api@w3.org">public-canvas-api@w3.org</A><BR><B>Subject:</B> 
  Inconsistent behaviour of globalCompositeOperation 
  property<O:P></O:P></SPAN></P></DIV></DIV>
  <P class=MsoNormal><O:P></O:P></P>
  <P class=MsoPlainText>As we were reviewing the globalCompositeOperation 
  property [1] of the Canvas 2D Context, we have noticed that there is a large 
  inconsistency with the way web browsers implement this 
property.<O:P></O:P></P>
  <P class=MsoPlainText><O:P></O:P></P>
  <P class=MsoPlainText>Firefox 3.6.3 and Opera 10.5 have a similar behaviour 
  that matches the current version of the Canvas 2D Context spec. Chrome 4.1 and 
  Safari 4.0.5 behave similarly to each other, albeit differently from the spec. 
  Today, web developers cannot reliably use this property in designing their 
  webpages due to this interoperability issue. <O:P></O:P></P>
  <P class=MsoPlainText><O:P></O:P></P>
  <P class=MsoPlainText>We consider that the Safari implementation of the 
  Drawing Model makes more sense from a web developer point of view. Most of the 
  Canvas APIs are applied to the next primitive being drawn. However, the 
  clipping behavior, as defined in the current Drawing Model [2], affects the 
  current contents of the Canvas outside of the current primitive being drawn. 
  The Safari Drawing Model calls for the clipping region to only affect the 
  current primitive being drawn. <O:P></O:P></P>
  <P class=MsoPlainText><O:P></O:P></P>
  <P class=MsoPlainText>We recommend updating the spec to match the Safari 
  Drawing Model. We would like to discuss this area in more 
  detail.<O:P></O:P></P>
  <P class=MsoPlainText><O:P></O:P></P>
  <P class=MsoPlainText>Thank you,<O:P></O:P></P>
  <P class=MsoPlainText>Jatinder<O:P></O:P></P>
  <P class=MsoPlainText><O:P></O:P></P>
  <P class=MsoPlainText>[1] <A 
  href="http://dev.w3.org/html5/2dcontext/#compositing" 
  moz-do-not-send="true">http://dev.w3.org/html5/2dcontext/#compositing</A>  
  <O:P></O:P></P>
  <P class=MsoPlainText>[2] <A 
  href="http://dev.w3.org/html5/2dcontext/#drawing-model" 
  moz-do-not-send="true">http://dev.w3.org/html5/2dcontext/#drawing-model</A> 
  <O:P></O:P></P>
  <P class=MsoPlainText><O:P></O:P></P>
  <P class=MsoPlainText>Jatinder Mann | Microsoft Program Manager | <A 
  href="mailto:jmann@microsoft.com" 
  moz-do-not-send="true">jmann@microsoft.com</A><O:P></O:P></P>
  <P class=MsoNormal><O:P></O:P></P></DIV></BLOCKQUOTE></BODY></HTML>