title: colorize a png on the canvas
body: <p>I want to colorize a png on the canvas by adding a canvas called tint which will assign the color to the png on the main canvas. But nothing is drawn at all:</p>
  
  <p><a href="http://jsfiddle.net/Br3SB/1/" rel="nofollow"><strong>js fiddel code</strong></a></p>
  
  <p>js</p>
  
  <pre><code>var tint = document.createElement('canvas');
      tint.width = 20;
      tint.height = 20;
      var tintCtx = tintCanvas.getContext('2d');
  
  var canvas = document.getElementById('canvasA');       
  var ctx = canvas.getContext('2d');
  
  
  
  var pic = new Image();
  pic.src = 'http://i3.minus.com/jUyvRw7sMVxJL.png';
  
  var x =0;
  var y=0;
  
  tintCtx.fillStyle = #ff3633;
  tintCtx.fillRect(x,y,20,20);
  tintCtx.globalCompositeOperation = "destination-atop";
  tintCtx.drawImage(pic, x, y);
  
  ctx.drawImage(pic, x, y);
  ctx.globalAlpha = 0.5;
  ctx.drawImage(tint, x, y);
  </code></pre>