<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns="http://www.w3.org/TR/REC-html40">
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=us-ascii">
<meta name=Generator content="Microsoft Word 12 (filtered medium)">
<style>
<!--
/* Font Definitions */
@font-face
{font-family:"Cambria Math";
panose-1:2 4 5 3 5 4 6 3 2 4;}
@font-face
{font-family:Calibri;
panose-1:2 15 5 2 2 2 4 3 2 4;}
@font-face
{font-family:Tahoma;
panose-1:2 11 6 4 3 5 4 4 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0in;
margin-bottom:.0001pt;
font-size:12.0pt;
font-family:"Times New Roman","serif";}
a:link, span.MsoHyperlink
{mso-style-priority:99;
color:blue;
text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
{mso-style-priority:99;
color:purple;
text-decoration:underline;}
span.EmailStyle17
{mso-style-type:personal-reply;
font-family:"Calibri","sans-serif";
color:#1F497D;}
.MsoChpDefault
{mso-style-type:export-only;}
@page Section1
{size:8.5in 11.0in;
margin:1.0in 1.0in 1.0in 1.0in;}
div.Section1
{page:Section1;}
-->
</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 lang=EN-US link=blue vlink=purple>
<div class=Section1>
<p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";
color:#1F497D'>Hi Marius,<o:p></o:p></span></p>
<p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";
color:#1F497D'><o:p> </o:p></span></p>
<p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";
color:#1F497D'>That is actually a pretty good idea. You can still have your
other code run at document ready, but then do the drawing to canvas once the
image is ready. Best of both ;)<o:p></o:p></span></p>
<p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";
color:#1F497D'><o:p> </o:p></span></p>
<p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";
color:#1F497D'>Thanks,<o:p></o:p></span></p>
<p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";
color:#1F497D'>Schalk<o:p></o:p></span></p>
<p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";
color:#1F497D'><o:p> </o:p></span></p>
<div style='border:none;border-top:solid #B5C4DF 1.0pt;padding:3.0pt 0in 0in 0in'>
<p class=MsoNormal><b><span style='font-size:10.0pt;font-family:"Tahoma","sans-serif"'>From:</span></b><span
style='font-size:10.0pt;font-family:"Tahoma","sans-serif"'> Marius Gundersen
[mailto:gundersen@gmail.com] <br>
<b>Sent:</b> Monday, May 24, 2010 4:49 AM<br>
<b>To:</b> Schalk Neethling<br>
<b>Cc:</b> whatwg@lists.whatwg.org<br>
<b>Subject:</b> Re: [whatwg] Canvas and Image problems<o:p></o:p></span></p>
</div>
<p class=MsoNormal><o:p> </o:p></p>
<p class=MsoNormal style='margin-bottom:12.0pt'>You could also add a listener
to the image to check that it actually loads:<o:p></o:p></p>
<p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> <o:p></o:p></p>
<p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'><span
style='font-size:10.0pt;font-family:"Courier New";color:black;background:white'>$</span><span
style='font-size:10.0pt;font-family:"Courier New";color:#5C5C5C;background:
white'>(</span><span style='font-size:10.0pt;font-family:"Courier New";
color:black;background:white'>document</span><span style='font-size:10.0pt;
font-family:"Courier New";color:#5C5C5C;background:white'>).</span><span
style='font-size:10.0pt;font-family:"Courier New";color:black;background:white'>ready</span><span
style='font-size:10.0pt;font-family:"Courier New";color:#5C5C5C;background:
white'>(</span><b><span style='font-size:10.0pt;font-family:"Courier New";
color:#0000C0;background:white'>function</span></b><span style='font-size:10.0pt;
font-family:"Courier New";color:#5C5C5C;background:white'>()</span><span
style='font-size:10.0pt;font-family:"Courier New";background:white'> <span
style='color:#5C5C5C'>{</span></span><o:p></o:p></p>
<p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'><span
style='font-size:10.0pt;font-family:"Courier New";background:white'>
<b><span style='color:#0000C0'>var</span></b> <span style='color:black'>image</span>
<span style='color:#5C5C5C'>=</span> <span style='color:black'>$</span><span
style='color:#5C5C5C'>(</span><span style='color:#005C00'>"#cat"</span><span
style='color:#5C5C5C'>).</span><span style='color:black'>get</span><span
style='color:#5C5C5C'>(</span><span style='color:#004080'>0</span><span
style='color:#5C5C5C'>);</span></span><o:p></o:p></p>
<p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'><span
style='font-size:10.0pt;font-family:"Courier New";background:white'>
image.onload = function(e){</span><o:p></o:p></p>
<p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'><span
style='font-size:10.0pt;font-family:"Courier New";background:white'>
<b><span style='color:#0000C0'>var</span></b> <span style='color:black'>cv</span>
<span style='color:#5C5C5C'>=</span> <span style='color:black'>$</span><span
style='color:#5C5C5C'>(</span><span style='color:#005C00'>"#img_container"</span><span
style='color:#5C5C5C'>).</span><span style='color:black'>get</span><span
style='color:#5C5C5C'>(</span><span style='color:#004080'>0</span><span
style='color:#5C5C5C'>);</span> </span><o:p></o:p></p>
<p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'><span
style='font-size:10.0pt;font-family:"Courier New";background:white'>
<b><span style='color:#0000C0'>var</span></b> <span style='color:black'>ctx</span>
<span style='color:#5C5C5C'>=</span> <span style='color:black'>cv</span><span
style='color:#5C5C5C'>.</span><span style='color:black'>getContext</span><span
style='color:#5C5C5C'>(</span><span style='color:#005C00'>'2d'</span><span
style='color:#5C5C5C'>);</span></span><o:p></o:p></p>
<p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'><span
style='font-size:10.0pt;font-family:"Courier New";background:white'>
</span><o:p></o:p></p>
<p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'><span
style='font-size:10.0pt;font-family:"Courier New";background:white'>
<span style='color:black'>ctx</span><span style='color:#5C5C5C'>.</span><span
style='color:black'>drawImage</span><span style='color:#5C5C5C'>(</span><span
style='color:black'>image</span><span style='color:#5C5C5C'>,</span> <span
style='color:#004080'>0</span><span style='color:#5C5C5C'>,</span> <span
style='color:#004080'>0</span><span style='color:#5C5C5C'>);</span></span><o:p></o:p></p>
<p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>
};<o:p></o:p></p>
<p class=MsoNormal style='margin-bottom:12.0pt'><span style='font-size:10.0pt;
font-family:"Courier New";color:#5C5C5C;background:white'>});</span><o:p></o:p></p>
<div>
<p class=MsoNormal>On Sun, May 23, 2010 at 10:30 PM, Schalk Neethling <<a
href="mailto:schalk@ossreleasefeed.com">schalk@ossreleasefeed.com</a>>
wrote:<o:p></o:p></p>
<p class=MsoNormal>Jip, using $(window).load() works perfect.<o:p></o:p></p>
</div>
<p class=MsoNormal><o:p> </o:p></p>
</div>
</body>
</html>