Files
openlayers/tests/Events/featureclick.html
ahocevar fe0620dc7f Merge pull request #174 from ahocevar/feature-events
Turning @tschaub's FeatureAgent into an event extension. r=@bartvde
2013-05-30 15:33:24 +02:00

92 lines
2.1 KiB
HTML

<html>
<head>
<script src="../OLLoader.js"></script>
<script type="text/javascript">
var layer1, style, logevt, lognoevt, map, lonlat, pixel, element;
function init() {
element = document.getElementById("map");
style = new OpenLayers.StyleMap({
'default': OpenLayers.Util.applyDefaults(
{label: "${l}", pointRadius: 30},
OpenLayers.Feature.Vector.style["default"]
),
'select': OpenLayers.Util.applyDefaults(
{pointRadius: 30},
OpenLayers.Feature.Vector.style.select
)
});
layer1 = new OpenLayers.Layer.Vector("Layer 1", {
styleMap: style
});
layer1.addFeatures([
new OpenLayers.Feature.Vector(OpenLayers.Geometry.fromWKT("POINT(0 0)"), {l:1}),
new OpenLayers.Feature.Vector(OpenLayers.Geometry.fromWKT("POINT(0 0)"), {l:1}),
new OpenLayers.Feature.Vector(OpenLayers.Geometry.fromWKT("POINT(0 0)"), {l:1}),
new OpenLayers.Feature.Vector(OpenLayers.Geometry.fromWKT("POINT(0 0)"), {l:1})
]);
map = new OpenLayers.Map({
div: "map",
allOverlays: true,
layers: [layer1],
zoom: 6,
center: [0, 0],
eventListeners: {
featureclick: logEvent,
nofeatureclick: logNoEvent
}
});
}
function logNoEvent(e) {
lognoevt.push(e);
}
function logEvent(e) {
logevt.push(e);
}
function trigger(type, pxl) {
var map_position = OpenLayers.Util.pagePosition(element);
map.events.triggerEvent(type, {
xy: pxl,
clientX: pxl.x + map_position[0],
clientY: pxl.y + map_position[1],
which: 1 // which == 1 means left-click
});
}
// TESTS
function test_onClick(t) {
t.plan(2);
logevt = [];
lognoevt = [];
lonlat = new OpenLayers.LonLat(0,0);
pixel = map.getPixelFromLonLat(lonlat);
trigger('mousedown', pixel);
trigger('mouseup', pixel);
t.eq(logevt.length, 4, "4 features hit");
trigger('mousedown', {x: 40, y: 40});
trigger('mouseup', {x: 40, y: 40});
t.eq(lognoevt.length, 1, "nofeatureclick fired for click outside features.");
}
// END TESTS
</script>
</head>
<body onload="init()">
<div id="map" style="width: 300px; height: 150px; border: 1px solid black"></div>
</body>
</html>