286 lines
11 KiB
HTML
286 lines
11 KiB
HTML
<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>
|