valky

var imgBlack = new Image();
var imgWhite = new Image();
imgBlack.src = document.getElementById("imgB").src;
imgWhite.src = document.getElementById("imgW").src;
imgBlack.onload = decREMent;
imgWhite.onload = decREMent;
var toLoad = 2;
function decREMent()
{
  if (--toLoad==0)
    loaded();
}

function loaded()
{
  can = document.createElement("canvas");
  var ctx = can.getContext('2d');
  w = imgBlack.width;
  h = imgBlack.height;
  can.width = w;
  can.height = h;

  dataT = ctx.getImageData(0, 0, w, h);
  ctx.drawImage(imgWhite, 0, 0, w, h);
  dataW = ctx.getImageData(0, 0, w, h);
  ctx.drawImage(imgBlack, 0, 0, w, h);
  dataB = ctx.getImageData(0, 0, w, h);

  for (i=0; i<dataW.data.length; i+=4)
  {
    rW = dataW.data[i];
    gW = dataW.data[i+1];
    bW = dataW.data[i+2];
    yW = (rW+gW+bW)/3;

    rB = dataB.data[i];
    gB = dataB.data[i+1];
    bB = dataB.data[i+2];
    yB = (rB+gB+bB)/3;

    r = (rW+rB)/2;
    g = (gW+gB)/2;
    b = (bW+bB)/2;
    a = 255-(yW-yB);

    dataT.data[i+0] = r;
    dataT.data[i+1] = g;
    dataT.data[i+2] = b;
    dataT.data[i+3] = a;
  }

  ctx.putImageData(dataT, 0, 0);
  document.all["imgT"].src = can.toDataURL();
//  document.getElementById("imgB").src = can.toDataURL("image/png");
}