httprequestcanvasmapping = new Array();

function loadXMLImages()
{
    var canvases = document.getElementsByTagName("canvas");
    for (var i = 0; i < canvases.length; i++)
    {
        httpRequest = new XMLHttpRequest();

        httpRequest.onreadystatechange = function()
        {
            for (var element in httprequestcanvasmapping)
            {
                var httpRequest = httprequestcanvasmapping[element][0];
                var canvas = httprequestcanvasmapping[element][1];
                if (httpRequest.readyState == 4 && httpRequest.status == 200)
                {
                    httprequestcanvasmapping.splice(element, 1);
                    //alert(httpRequest.responseText);
                    drawImage(httpRequest.responseXML, canvas);
                }
            }
        }

        httpRequest.open('GET', canvases.item(i).getAttribute("href"), true);
        httpRequest.send(null);

        tmparray = new Array();
        tmparray.push(httpRequest);
        tmparray.push(canvases.item(i));
        httprequestcanvasmapping.push(tmparray);
    }
}


function drawImage(response, canvas)
{
    var context = canvas.getContext("2d");
    alert(canvas.getAttribute("href"));
    var image = response.documentElement;

    var rows = image.getElementsByTagName("row");
    //alert(rows.length);
    var pixels = rows.item(0).getElementsByTagName("pixel");
    canvas.height = rows.length - 1;
    canvas.width = pixels.length - 1;

    for (var row =0; row < rows.length; row++)
    {
        var pixels = rows.item(row).childNodes;
        for (var pixel = 0; pixel < pixels.length; pixel++)
        {
            var red = pixels.item(pixel).getElementsByTagName("red").item(0).textContent;
            var green = pixels.item(pixel).getElementsByTagName("green").item(0).textContent;
            var blue = pixels.item(pixel).getElementsByTagName("blue").item(0).textContent;
            context.fillStyle = "rgb(" + red + ", " + green + ", " + blue + ")";
            context.fillRect(pixel, row, 1, 1);
        }
    }
}