<!-- based on clientXY-in-zoom-and-scroll.html -->
<script src="../../resources/js-test.js"></script>
<script>
    function clickHandler(e)
    {
        // do something
        event = e;
        var elem = document.getElementById('gizmo');
        elem.textContent = "client(" + e.clientX + "," + e.clientY + ") page(" + e.pageX + "," + e.pageY + ")";
    }
</script>
<br/>
<div id="console"></div>
<div id="testArea">
    <div id="gizmo" style="position: absolute; left: 0px; top: 0px; overflow-x: hidden; overflow-y: hidden; width: 100%; height: 100%; text-align: middle;" onDblClick="clickHandler(event)">Double-click on this page.</div>
</div>

<script>
    var event;

    function sendDblClick()
    {
        if (window.eventSender) {
            eventSender.leapForward(1000); // drain dblclick timer
            eventSender.mouseMoveTo(200, 100); // x and y different for safety
            eventSender.mouseDown();
            eventSender.mouseUp();
            eventSender.mouseDown();
            eventSender.mouseUp();
        }
    }
    function zoomPageIn()
    {
        if (window.eventSender) {
            eventSender.zoomPageIn();
        }
    }

    function zoomPageOut()
    {
        if (window.eventSender) {
            eventSender.zoomPageOut();
        }
    }

    if (window.testRunner) {
        testRunner.dumpAsText();
        testRunner.waitUntilDone();
    }

    // Zoomed.
    function zoomed(e)
    {
        event = e;
        debug("\nZoomed");
        shouldBe("event.clientX", "166");
        shouldBe("event.clientY", "83");
        shouldBe("event.pageX", "166");
        shouldBe("event.pageY", "83");
    }
    window.addEventListener("dblclick", zoomed, false);
    zoomPageIn();
    sendDblClick();
    zoomPageOut();
    window.removeEventListener("dblclick", zoomed, false);

    if (window.testRunner) {
        var area = document.getElementById('testArea');
        area.parentNode.removeChild(area);

        testRunner.notifyDone();
    }
</script>