<!DOCTYPE html> <!-- webkit-test-runner [ useFlexibleViewport=true ] -->

<html>
<head>
    <script>
        if (window.testRunner) {
            testRunner.dumpAsText();
            testRunner.waitUntilDone();
        }

        function getUIScript(x, y)
        {
            return `
            (function() {
                var eventStream = {
                    events : [
                        {
                            interpolate : "linear",
                            timestep: 0.025,
                            startEvent : {
                                inputType : "hand",
                                timeOffset : 0,
                                touches : [
                                    {
                                        inputType : "finger",
                                        phase : "began",
                                        id : 1,
                                        x : ${x},
                                        y : ${y},
                                        pressure : 0
                                    }
                                ]
                            },
                            endEvent : {
                                inputType : "hand",
                                timeOffset : 3.0,
                                touches : [
                                    {
                                        inputType : "finger",
                                        phase : "stationary",
                                        id : 1,
                                        x : ${x},
                                        y : ${y},
                                        pressure : 500
                                    }
                                ]
                            }
                        }
                    ]
                };

                uiController.sendEventStream(JSON.stringify(eventStream), function() {
                    uiController.uiScriptComplete();
                });
            })();`
        }

        function runTest()
        {
            if (!testRunner.runUIScript)
                return;

            var output = '';
            var target = document.getElementById('target');
            var forces = [];
            
            target.addEventListener('touchforcechange', function(event) {
                forces.push(event.touches[0].force);
            });
            
            target.addEventListener('touchstart', function(event) {
                event.preventDefault();
            });
            
            if (testRunner.runUIScript) {
                const bounds = target.getBoundingClientRect();
                testRunner.runUIScript(getUIScript(bounds.left + bounds.width / 2, bounds.top + bounds.height / 2), result => {
                    var middleIndex = Math.floor(forces.length/2);
                
                    if ((forces[0] < forces[middleIndex]) && (forces[middleIndex] < forces[forces.length - 1]))
                        output += 'PASS: Generated increasing force';
                    
                    document.getElementById('target').innerHTML = output;
                    testRunner.notifyDone();
               });
            }
        }

        window.addEventListener('load', runTest, false);
    </script>
    <style>
        #target {
            height: 100px;
            width: 200px;
            background-color: silver;
        }
    </style>
    <meta name="viewport" content="initial-scale=1">
</head>
<body>
<div id="target">
    This test requires UIScriptController to run.
</div>
</body>
</html>