diff options
Diffstat (limited to 'misc/openlayers/tests/Events/buttonclick.html')
| -rw-r--r-- | misc/openlayers/tests/Events/buttonclick.html | 214 |
1 files changed, 214 insertions, 0 deletions
diff --git a/misc/openlayers/tests/Events/buttonclick.html b/misc/openlayers/tests/Events/buttonclick.html new file mode 100644 index 0000000..dadbd3a --- /dev/null +++ b/misc/openlayers/tests/Events/buttonclick.html @@ -0,0 +1,214 @@ +<html> +<head> + <script src="../OLLoader.js"></script> + <script type="text/javascript"> + + var log, buttonClick, events, element, button; + function init() { + element = document.getElementById("map"); + button = document.getElementById("button"); + } + function trigger(evt) { + OpenLayers.Util.applyDefaults(evt, { + button: 1, + target: button + }); + events.handleBrowserEvent(evt); + } + function logEvent(evt) { + log.push(evt); + } + + function test_ButtonClick(t) { + t.plan(1); + events = new OpenLayers.Events({}, element); + buttonClick = new OpenLayers.Events.buttonclick(events); + t.ok(buttonClick.target === events, "target set from constructor arg"); + buttonClick.destroy(); + events.destroy(); + } + + function test_getPressedButton(t) { + t.plan(4); + + // set up + + events = new OpenLayers.Events({}, element); + buttonClick = new OpenLayers.Events.buttonclick(events); + + var button = document.createElement('button'), + span1 = document.createElement('span'), + span2 = document.createElement('span'), + span3 = document.createElement('span'); + button.className = 'olButton'; + button.appendChild(span1); + span1.appendChild(span2); + span2.appendChild(span3); + + t.ok(buttonClick.getPressedButton(button) === button, + 'getPressedButton returns button when element is button'); + t.ok(buttonClick.getPressedButton(span1) === button, + 'getPressedButton returns button when element is button descendant level 1'); + t.ok(buttonClick.getPressedButton(span2) === button, + 'getPressedButton returns button when element is button descendant level 2'); + t.eq(buttonClick.getPressedButton(span3), undefined, + 'getPressedButton returns undefined when element is button descendant level 3'); + + // test + + + // tear down + + buttonClick.destroy(); + events.destroy(); + } + + function test_ignore(t) { + t.plan(5); + + // set up + + events = new OpenLayers.Events({}, element); + buttonClick = new OpenLayers.Events.buttonclick(events); + + var link = document.createElement('a'), + span1 = document.createElement('span'), + span2 = document.createElement('span'), + span3 = document.createElement('span'); + link.appendChild(span1); + span1.appendChild(span2); + span2.appendChild(span3); + + t.eq(buttonClick.ignore(link), true, + 'ignore returns true when element is a link'); + t.eq(buttonClick.ignore(span1), true, + 'ignore returns true when element is link descendant level 1'); + t.eq(buttonClick.ignore(span2), true, + 'ignore returns true when element is link descendant level 2'); + t.eq(buttonClick.ignore(span3), false, + 'ignore returns false when element is link descendant level 3'); + t.eq(buttonClick.ignore(element), false, + 'ignore returns false when element is not a link'); + + + // tear down + + buttonClick.destroy(); + events.destroy(); + } + + function test_ButtonClick_buttonClick(t) { + t.plan(27); + events = new OpenLayers.Events({}, element); + events.on({ + "buttonclick": logEvent, + "mousedown": logEvent, + "mouseup": logEvent, + "click": logEvent, + "dblclick": logEvent, + "touchstart": logEvent, + "touchend": logEvent, + "keydown": logEvent + }); + buttonClick = events.extensions["buttonclick"]; + + // a complete click + log = []; + trigger({type: "mousedown"}); + trigger({type: "mouseup"}); + t.eq(log.length, 1, "one event fired for mousedown-mouseup"); + t.eq(log[0].type, "buttonclick", "buttonclick event fired"); + + // a complete tap + log = []; + trigger({type: "touchstart"}); + trigger({type: "touchend"}); + t.eq(log.length, 1, "one event fired for touchstart-touchend"); + t.eq(log[0].type, "buttonclick", "buttonclick event fired"); + + // mouse sequence started on button + log = []; + trigger({type: "mousedown"}); + trigger({type: "mouseup", target: element}); + t.eq(log.length, 1, "one event fired for mousedown-(leave)-mouseup"); + t.eq(log[0].type, "mouseup", "mouseup event goes through when sequence not finished on button"); + + // touch sequence started on button + log = []; + trigger({type: "touchstart"}); + trigger({type: "touchmove"}); + trigger({type: "touchend"}); + t.eq(log.length, 1, "one event fired for touchstart-(leave)-touchend"); + t.eq(log[0].type, "touchend", "touchend event goes through when sequence not finished on button"); + + // mouse sequence finished on button + log = []; + trigger({type: "mousedown", target: element}); + trigger({type: "mouseup"}); + t.eq(log.length, 2, "two event fired for mousedown-(enter)-mouseup"); + t.eq(log[0].type, "mousedown", "mousedown unrelated to button goes through"); + t.eq(log[1].type, "mouseup", "mouseup goes through when sequence started outside button"); + + // touch sequence finished on button + log = []; + trigger({type: "touchstart", target: element}); + trigger({type: "touchend"}); + t.eq(log.length, 2, "two event fired for touchstart-(enter)-touchend"); + t.eq(log[0].type, "touchstart", "touchstart unrelated to button goes through"); + t.eq(log[1].type, "touchend", "touchend goes through when sequence started outside button"); + + // dblclick + log = []; + trigger({type: "mousedown"}); + trigger({type: "mouseup"}); + trigger({type: "click"}); + trigger({type: "mousedown"}); + trigger({type: "mouseup"}); + trigger({type: "click"}); + trigger({type: "dblclick"}); + t.eq(log.length, 2, "two events fired for doubleclick"); + t.eq(log[0].type, "buttonclick", "buttonclick for 1st click"); + t.eq(log[1].type, "buttonclick", "buttonclick for 2nd click"); + + // dblclick - IE + log = []; + trigger({type: "mousedown"}); + trigger({type: "mouseup"}); + trigger({type: "mouseup"}); + trigger({type: "dblclick"}); + t.eq(log.length, 2, "two events fired for dblclick in IE"); + t.eq(log[0].type, "buttonclick", "buttonclick for 1st click in IE"); + t.eq(log[1].type, "buttonclick", "buttonclick for 2nd click IE"); + + // rightclick + log = []; + trigger({type: "mousedown", button: 2}); + trigger({type: "mouseup", button: 2}); + t.eq(log.length, 2, "two events fired for rightclick"); + t.eq(log[0].type, "mousedown", "mousedown from rightclick goes through"); + t.eq(log[1].type, "mouseup", "mouseup from rightclick goes through"); + + // keydown RETURN + log = []; + trigger({type: "keydown", keyCode: OpenLayers.Event.KEY_RETURN}); + trigger({type: "click"}); + t.eq(log.length, 1, "one event fired for RETURN keydown"); + t.eq(log[0].type, "buttonclick", "buttonclick for RETURN keydown"); + + // keydown SPACE + log = []; + trigger({type: "keydown", keyCode: OpenLayers.Event.KEY_SPACE}); + trigger({type: "click"}); + t.eq(log.length, 1, "one event fired for SPACE keydown"); + t.eq(log[0].type, "buttonclick", "buttonclick for SPACE keydown"); + } + </script> +</head> +<body onload="init()"> + <div id="map" style="width: 600px; height: 300px;"> + <div id="button" class="olButton"> + <img class="olAlphaImg"> + </div> + </div> +</body> +</html> |