<!DOCTYPE html>
<html>
<head>
    <title>Touch Adjustment : Plugin boundary - bug ????</title>
    <script src="../resources/js-test.js"></script>
    <script src="resources/touchadjustment.js"></script>
    <style>
        #plugin {
          height: 160px;
          margin-left: 10px;
          margin-top: 10px;
          width: 320px;
        }
        #toolbar {
          -webkit-box-align: stretch;
          -webkit-box-orient: horizontal;
          display: -webkit-box;
          margin-left: 10px;
        }
    </style>
</head>
<body>

<div id=sandbox>
    <embed id="plugin" type="Application/x-webkit-test-webplugin">
    <div id="toolbar" onckick="function(){}">
      <button id="button1">A</button>
      <button id="button2">B</button>
      <button id="button3">C</button>
    </div>
</div>

<p id='description'></p>
<div id='console'></div>

<script>
    // Set up shortcut access to elements
    var ids = ['sandbox', 'plugin', 'toolbar', 'button1', 'button2', 'button3'];
    var e = {};
    ids.forEach(function(a) {
        e[a] = document.getElementById(a);
    });
    var bounds = {};
    ids.forEach(function(a) {
        bounds[a] = findAbsoluteBounds(e[a]);
    });

    function testMidpoint(id)
    {
        var x = bounds[id].left + bounds[id].width / 2;
        var y = bounds[id].top + bounds[id].height / 2;
        testTouchPoint(touchPoint(x, y, 10), e[id]); 
    }

    function testBoundary(buttonId)
    {
      var x = bounds[buttonId].left + bounds[buttonId].width / 2;
      var y = (bounds['plugin'].top + bounds['plugin'].height + bounds[buttonId].top) / 2;
      testTouchPoint(touchPoint(x, y - 5, 10), e['plugin']); 
      testTouchPoint(touchPoint(x, y + 5, 10), e[buttonId]);
    }

    function testDirectTouches()
    {
        debug('Test direct hits.');
        testMidpoint('plugin');
        testMidpoint('button1');
        testMidpoint('button2');
        testMidpoint('button3');
    }

    function testIndirectTouches()
    {
        debug('Test hits spanning the plugin boundary.');
        testBoundary('button1');
        testBoundary('button2');
        testBoundary('button3');
    }

    function runTests()
    {
        if (window.testRunner && window.internals && internals.touchNodeAdjustedToBestClickableNode) {
            description('Tests touch-adjustment at a plugin boundary.');
            testDirectTouches();
            testIndirectTouches();
            e['sandbox'].style.display = 'none';
        }
    }
    runTests();
</script>
</body>
</html>