summaryrefslogtreecommitdiff
path: root/misc/openlayers/tests/manual/feature-handler.html
diff options
context:
space:
mode:
Diffstat (limited to 'misc/openlayers/tests/manual/feature-handler.html')
-rw-r--r--misc/openlayers/tests/manual/feature-handler.html126
1 files changed, 126 insertions, 0 deletions
diff --git a/misc/openlayers/tests/manual/feature-handler.html b/misc/openlayers/tests/manual/feature-handler.html
new file mode 100644
index 0000000..f9b8892
--- /dev/null
+++ b/misc/openlayers/tests/manual/feature-handler.html
@@ -0,0 +1,126 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>Feature Handler Acceptance Test</title>
+ <style type="text/css">
+
+ body {
+ font-size: 0.8em;
+ }
+ p {
+ padding-top: 1em;
+ }
+ li {
+ list-style: none;
+ }
+ #output {
+ width: 300px;
+ height: 300px;
+ }
+ #west {
+ width: 425px;
+ }
+
+ #east {
+ position: absolute;
+ left: 450px;
+ top: 5px;
+ }
+ #map {
+ width: 400px;
+ height: 400px;
+ border: 1px solid gray;
+ }
+
+ </style>
+
+ <script src="../../lib/OpenLayers.js"></script>
+ <script type="text/javascript">
+
+ var map, draw, handler, controls;
+ OpenLayers.Feature.Vector.style['default']['strokeWidth'] = '2';
+
+ function init(){
+ map = new OpenLayers.Map('map');
+
+ var vectors = new OpenLayers.Layer.Vector(
+ "Vector Layer",
+ {isBaseLayer: true}
+ );
+ map.addLayer(vectors);
+
+
+ draw = new OpenLayers.Control.DrawFeature(
+ vectors, OpenLayers.Handler.Polygon
+ );
+ map.addControl(draw);
+
+ var callbacks = {
+ "over": function(feature) {
+ log("over " + feature.id);
+ },
+ "out": function(feature) {
+ log("out " + feature.id);
+ },
+ "click": function(feature) {
+ log("click " + feature.id);
+ },
+ "dblclick": function(feature) {
+ log("dblclick " + feature.id);
+ },
+ "clickout": function(feature) {
+ log("clickout " + feature.id);
+ }
+ };
+
+ handler = new OpenLayers.Handler.Feature(
+ {map: map}, vectors, callbacks
+ );
+
+ map.setCenter(new OpenLayers.LonLat(0, 0), 3);
+
+ }
+
+ function log(msg) {
+ document.getElementById('output').value += msg + "\n";
+ }
+
+ function clearLog() {
+ document.getElementById('output').value = "";
+ }
+
+ </script>
+ </head>
+ <body onload="init()">
+ <div id="west">
+ <div id="map"></div>
+ <p>
+ Draw a few polygons on the map. Some overlapping. Activate the
+ feature handler and ensure that "over" and "out" are called only
+ when mousing over/out of a feature for the first time. The
+ "click" callback should be called for every click on a feature.
+ The "clickout" callback should be called when?
+ </p>
+ </div>
+ <div id="east">
+ <ul>
+ <li>
+ <input type="radio" name="type" value="none" id="noneToggle"
+ onclick="draw.deactivate();handler.deactivate();" checked="checked" />
+ <label for="noneToggle">navigate</label>
+ </li>
+ <li>
+ <input type="radio" name="type" value="polygon" id="polygonToggle"
+ onclick="draw.activate();handler.deactivate();" />
+ <label for="polygonToggle">draw polygon</label>
+ </li>
+ <li>
+ <input type="radio" name="type" value="feature" id="featureToggle"
+ onclick="draw.deactivate();handler.activate();" />
+ <label for="featureToggle">activate feature handler</label>
+ </li>
+ </ul>
+ <button onclick="clearLog();">clear log</button><br />
+ <textarea id="output"></textarea>
+ </div>
+ </body>
+</html>