diff options
Diffstat (limited to 'misc/openlayers/tests/Handler/Pinch.html')
| -rw-r--r-- | misc/openlayers/tests/Handler/Pinch.html | 285 |
1 files changed, 285 insertions, 0 deletions
diff --git a/misc/openlayers/tests/Handler/Pinch.html b/misc/openlayers/tests/Handler/Pinch.html new file mode 100644 index 0000000..c4883df --- /dev/null +++ b/misc/openlayers/tests/Handler/Pinch.html @@ -0,0 +1,285 @@ +<html> +<head> + <script src="../OLLoader.js"></script> + <script type="text/javascript"> + function test_constructor(t) { + t.plan(3); + var control = new OpenLayers.Control(); + control.id = Math.random(); + var callbacks = {foo: "bar"}; + var options = {bar: "foo"}; + + var oldInit = OpenLayers.Handler.prototype.initialize; + + OpenLayers.Handler.prototype.initialize = function(con, call, opt) { + t.eq(con.id, control.id, + "constructor calls parent with the correct control"); + t.eq(call, callbacks, + "constructor calls parent with the correct callbacks"); + t.eq(opt, options, + "constructor calls parent with the correct options"); + }; + var handler = new OpenLayers.Handler.Pinch(control, callbacks, options); + + OpenLayers.Handler.prototype.initialize = oldInit; + } + + function test_activate(t) { + t.plan(3); + var map = new OpenLayers.Map('map'); + var control = new OpenLayers.Control(); + map.addControl(control); + var handler = new OpenLayers.Handler.Pinch(control); + handler.active = true; + var activated = handler.activate(); + t.ok(!activated, + "activate returns false if the handler was already active"); + handler.active = false; + handler.pinching = true; + activated = handler.activate(); + t.ok(activated, + "activate returns true if the handler was not already active"); + t.ok(!handler.pinching, + "activate sets pinching to false"); + + } + + function test_events(t) { + // each handled event should be activated twice when handler is + // activated, so: + // 27 = 4tests * 2*3events + 1tests * 3events + t.plan(27); + + var map = new OpenLayers.Map('map'); + var control = new OpenLayers.Control(); + map.addControl(control); + var handler = new OpenLayers.Handler.Pinch(control); + + // list below events that should be handled (events) and those + // that should not be handled (nonevents) by the handler + var events = ["touchend", "touchmove", "touchstart"]; + var nonevents = ["mousedown", "mouseup", "mousemove", "mouseout", + "click", "dblclick", "resize", "focus", "blur"]; + map.events.registerPriority = function(type, obj, func) { + // this is one of the mock handler methods + t.eq(OpenLayers.Util.indexOf(nonevents, type), -1, + "registered method is not one of the events " + + "that should not be handled: " + type); + t.ok(OpenLayers.Util.indexOf(events, type) > -1, + "activate calls registerPriority with browser event: " + type); + t.eq(typeof func, "function", + "activate calls registerPriority with a function"); + t.eq(obj["CLASS_NAME"], "OpenLayers.Handler.Pinch", + "activate calls registerPriority with the handler"); + }; + handler.activate(); + handler.deactivate(); + + // set browser event like properties on the handler + for(var i=0; i<events.length; ++i) { + setMethod(events[i]); + } + function setMethod(key) { + handler[key] = function() {return key;}; + } + + map.events.registerPriority = function(type, obj, func) { + var r = func(); + if(typeof r == "string") { + t.eq(r, type, + "activate calls registerPriority with the correct method"); + } + } + handler.activate(); + + } + + function test_callbacks(t) { + t.plan(32); + + var map = new OpenLayers.Map('map', {controls: [], fallThrough: true}); + + var control = new OpenLayers.Control(); + map.addControl(control); + + // set fake values for touches + var testEvents = { + start: { + type: 'touchstart', + touches: [{ + clientX: 100, + clientY: 0 + }, { + clientX: 0, + clientY: 0 + }] + }, + move: { + type: 'touchmove', + touches: [{ + clientX: 100, + clientY: 0 + }, { + clientX: 20, + clientY: 0 + }] + }, + done: { + type: 'touchend', + touches: [] + } + }; + + // set callback methods + var customCb = OpenLayers.Function.False; + var cb = function(evt) { + var callback = evt.type.replace("touch", "").replace("end", "done");; + var tch = testEvents[callback].touches; + t.ok(evt.touches[0].clientX == tch[0].clientX && + evt.touches[0].clientY == tch[0].clientY, + "touchstart sets first touch position correctly in evt"); + t.ok(evt.touches[1].clientX == tch[1].clientX && + evt.touches[1].clientY == tch[1].clientY, + "touchstart sets second touch position correctly in evt"); + t.eq(handler.start.distance, 100, "start distance is " + + "always the same"); + customCb.apply(this, arguments); + } + var callbacks = { + start: cb, + move: cb, + done: function () { + customCb.apply(this, arguments); + } + }; + + var handler = new OpenLayers.Handler.Pinch(control, callbacks); + handler.activate(); + + var old_isMultiTouch = OpenLayers.Event.isMultiTouch; + var old_stop = OpenLayers.Event.stop; + + // test single touch + OpenLayers.Event.isMultiTouch = function() { + return false; + } + + // no callbacks with tests expected (pinch not started) + map.events.handleBrowserEvent(testEvents.start); + // test 1, 2, 3 + t.ok(!handler.started, "1) touchstart (singletouch) sets started to false"); + t.eq(handler.start, null, "1) touchstart (singletouch) sets start to null"); + t.eq(handler.last, null, "1) touchstart (singletouch) sets last to null"); + + handler.started = true; + handler.start = { + distance: 100, + delta: 0, + scale: 1 + }; + handler.last = { + distance: 150, + delta: 10, + scale: 1.5 + }; + + // no callbacks with tests expected (multitouch pinch started, so ignores singletouch) + map.events.handleBrowserEvent(testEvents.start); + // test 4, 5, 6 + t.ok(handler.started, "1) touchstart (singletouch) after pinch started is ignored"); + t.ok(!!handler.start, "1) touchstart (singletouch) after pinch started is ignored"); + t.ok(!!handler.last, "1) touchstart (singletouch) after pinch started is ignored"); + + OpenLayers.Event.stop = function(evt, allowDefault) { + if(allowDefault) { + t.fail( + "touchstart is prevented from falling to other elements"); + } + } + OpenLayers.Event.isMultiTouch = function(evt) { + var res = old_isMultiTouch(evt); + t.ok(res, "fake event is a mutitouch touch event"); + return res; + } + customCb = function(evt, pinchdata) { + t.eq(pinchdata.distance, 100, "2) calculated distance is correct"); + t.eq(pinchdata.delta, 0, "2) calculated delta is correct"); + t.eq(pinchdata.scale, 1, "2) calculated scale is correct"); + } + // test 7, 8, 9, 10, 11, 12, 13 + map.events.handleBrowserEvent(testEvents.start); + // test 14, 15 + t.ok(handler.started, "2) touchstart sets the started flag to true"); + t.ok(!handler.pinching, "2) touchstart sets the pinching flag to false"); + + customCb = function(evt, pinchdata) { + t.eq(pinchdata.distance, 80, "3) calculated distance is correct"); + t.eq(pinchdata.delta, 20, "3) calculated delta is correct"); + t.eq(pinchdata.scale, 0.8, "3) calculated scale is correct"); + } + // test 16, 17, 18, 19, 20, 21, 22 + map.events.handleBrowserEvent(testEvents.move); + // test 23, 24 + t.ok(handler.started, "3) started flag still set to true"); + t.ok(handler.pinching, "3) touchmove sets the pinching flag to true"); + + OpenLayers.Event.isMultiTouch = old_isMultiTouch; + + customCb = function(evt, first, last) { + t.eq(first.distance, 100, "4) calculated distance is correct"); + t.eq(first.delta, 0, "4) calculated delta is correct"); + t.eq(first.scale, 1, "4) calculated scale is correct"); + t.eq(last.distance, 80, "4) calculated distance is correct"); + t.eq(last.delta, 20, "4) calculated delta is correct"); + t.eq(last.scale, 0.8, "4) calculated scale is correct"); + } + // test 25, 26, 27, 28, 29, 30 + map.events.handleBrowserEvent(testEvents.done); + // test 31, 32 + t.ok(!handler.started, "4) started flag is set to false"); + t.ok(!handler.pinching, "4) touchdone sets the pinching flag to false"); + + OpenLayers.Event.stop = old_stop; + + // test move or done before start + customCb = function(evt) { + t.fail("should not pass here") + } + // no callbacks with tests expected + map.events.handleBrowserEvent(testEvents.move); + map.events.handleBrowserEvent(testEvents.done); + + } + + function test_deactivate(t) { + t.plan(6); + var map = new OpenLayers.Map('map'); + var control = new OpenLayers.Control(); + map.addControl(control); + var handler = new OpenLayers.Handler.Pinch(control); + handler.active = false; + var deactivated = handler.deactivate(); + t.ok(!deactivated, + "deactivate returns false if the handler was not already active"); + handler.active = true; + handler.pinching = true; + deactivated = handler.deactivate(); + t.ok(deactivated, + "deactivate returns true if the handler was active already"); + t.ok(!handler.started, + "deactivate sets started to false"); + t.ok(!handler.pinching, + "deactivate sets pinching to false"); + t.ok(handler.start == null, + "deactivate sets start to null"); + t.ok(handler.last == null, + "deactivate sets start to null"); + } + + + </script> +</head> +<body> + <div id="map" style="width: 300px; height: 150px;"/> +</body> +</html> |