ios6 canvas high resolution y-value

Question

I have an html5 webapp that recently was broken on iOS6. We take a high resolution jpeg image and render it on a canvas element. We first load a lower resolution thumbnail as a placeholder while the higher resolution jpeg downloads in the background. In iOS6 the high resolution image, once loaded gets way out of aspect on the y dimension. Here is a sample page I created as a test that just switches between a thumbnail and a high resolution image:

http://www.video-monitoring.com/beachcams/jupiter/canvas.htm

If you test this on iOS6 you will see the high res image get squished.

Here is the javascript code:

        var imgCanvas;
    var imgContext;
    var downloader = new Image();
    var w = 400;
    var h = 300;
    var hq = true;
    var lqUrl = "http://www.video-monitoring.com/beachcams/jupiter/pics/s2/sep0112k/s211403_.jpg";
    var hqUrl = "http://www.video-monitoring.com/beachcams/jupiter/pics/s2/sep0112k/s211403w.jpg";

    window.onload = function () {
        imgCanvas = document.getElementById('canvas');
        imgContext = imgCanvas.getContext('2d');
        downloader.onload = imageOnLoad;
        downloader.src = hqUrl;
    }


    function imageOnLoad() {
        imgContext.clearRect(0, 0, w, h);
        imgContext.drawImage(downloader, 0, 0, w, h)
    }

    function btnClick() {
        hq = !hq;
        if (hq) downloader.src = hqUrl;
        else downloader.src = lqUrl;
    }

Here's the html:

    <input type="button" name='changeres' id='changeres' onclick="btnClick()" value='Change Resolution' />
<canvas width="2000px" height="1000px"  id="canvas">

</canvas>

So my question is what has changed in iOS6 where this is now rendered incorrectly? Is there something I am doing that is not standard? It renders properly on all other browsers. It works in iOS5. Here's the production version of the webapp: http://www.video-monitoring.com/beachcams/jupiter/slideshow.htm