Javascript image manipulation

<script>
function Debug(v)
{
    if(v==null)window.parent.v=[]
    else if(window.parent.v==null)window.parent.v = [v];
    else window.parent.v[window.parent.v.length]=v;
}
var _ = function(id)
{
    return document.getElementById(id);
}
function onInput(inp,event)
{
    var image = new Image();
    image.src = inp.value;
    image.addEventListener("load",function(){imgLoad(this)});
}
function imgLoad(img)
{
    Debug();
    var canvas = _("canvas");
    var G = canvas.getContext("2d");
    G.clearRect(0,0,canvas.width,canvas.height);
    G.drawImage(img,0,0);
    var M = canvas.width/2;
    var imgData=G.getImageData(0,0,M,canvas.height);
    Debug(imgData);
    var w = imgData.width;
    var h = imgData.height;
    var L=3;
    for(var i=0; i<imgData.data.length-4*w; i+=(i%4==2)?2:1)
    {
        if(i%(w*4)==2)i++;
        var mx = Math.max(imgData.data[i+4],imgData.data[i+4*w]);
        imgData.data[i] = 128+Math.abs((imgData.data[i]-mx))*L;
    }
    Debug(imgData);
    G.putImageData(imgData,M,0);
}
</script>
<input type="text" style="width:602" oninput="onInput(this,event)" id="text" value="logo.png"/>
<canvas id="canvas" width="600" height="400" style="border:1px #00ff00 solid">
</canvas>
<script>
onInput(_("text"),null);
</script>