openlayers/tests/Control/SelectFeature.html

   1 <html>
   2 <head>
   3     <script src="../../lib/OpenLayers.js"></script>
   4     <script type="text/javascript">
   5     function test_Control_SelectFeature_constructor(t) {
   6         t.plan(5);
   7         var options = {
   8 //            geometryTypes: "foo"
   9         };
  10         var layer = "bar";
  11         var control = new OpenLayers.Control.SelectFeature([layer], options);
  12         t.ok(control instanceof OpenLayers.Control.SelectFeature,
  13              "new OpenLayers.Control.SelectFeature returns an instance");
  14         t.eq(control.layers[0], "bar",
  15              "constructor with array of layers sets layer correctly");
  16 //        t.eq(control.handlers.feature.geometryTypes, "foo",
  17 //             "constructor sets options correctly on feature handler");
  18         t.ok(control.layer instanceof OpenLayers.Layer.Vector.RootContainer, "control has a root container layer if constructor was called with an array of layers");
  19
  20         control = new OpenLayers.Control.SelectFeature(layer, options);
  21         t.eq(control.layers, null, "this.layers is null if constructor called with a single layer");
  22         t.eq(control.layer, layer, "this.layer holds the layer that was passed with the constructor if called with a single layer")
  23     }
  24
  25     function test_Control_SelectFeature_destroy(t) {
  26         t.plan(2);
  27         var map = new OpenLayers.Map("map");
  28         var layer = new OpenLayers.Layer.Vector();
  29         map.addLayer(layer);
  30         var control = new OpenLayers.Control.SelectFeature(layer, {box: true});
  31         control.handlers.feature.deactivate = function() {
  32             t.ok(true,
  33                  "control.deactivate calls deactivate on feature handler");
  34         }
  35         control.handlers.box.deactivate = function() {
  36             t.ok(true,
  37                  "control.deactivate calls deactivate on box handler");
  38         }
  39 // should nullify the layer property here
  40         control.destroy();
  41
  42     }
  43
  44     function test_Control_SelectFeature_select(t) {
  45         t.plan(4);
  46         var map = new OpenLayers.Map("map");
  47         var layer1 = new OpenLayers.Layer.Vector();
  48         var layer2 = new OpenLayers.Layer.Vector();
  49         map.addLayers([layer1, layer2]);
  50         var control = new OpenLayers.Control.SelectFeature([layer1, layer2]);
  51         var feature1 = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(0,1));
  52         var feature2 = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(1,0));
  53         layer1.addFeatures(feature1);
  54         layer2.addFeatures(feature2);
  55         var drawFeature = function(feature, style) {
  56             feature.layer.styleMap.createSymbolizer(feature, style);
  57         }
  58         layer1.drawFeature = drawFeature;
  59         layer2.drawFeature = drawFeature;
  60         control.select(feature1);
  61         t.eq(feature1.renderIntent, "select", "render intent is set to select");
  62         control.select(feature2);
  63         t.eq(feature2.renderIntent, "select", "render intent is set to select");
  64         control.unselect(feature1);
  65         t.eq(feature1.renderIntent, "default", "render intent is set back to default");
  66         control.unselect(feature2);
  67         t.eq(feature2.renderIntent, "default", "render intent is set back to default");
  68     }
  69
  70     function test_Control_SelectFeature_clickFeature(t) {
  71         t.plan(6);
  72         // mock up layer
  73         var layer = {
  74             selectedFeatures: [],
  75             drawFeature: function() {},
  76             events: {
  77                 triggerEvent: function() {}
  78             }
  79         };
  80         // mock up active control
  81         var control = new OpenLayers.Control.SelectFeature(layer);
  82         control.handlers.feature = {
  83             evt: {}
  84         };
  85         // mock up features
  86         var features = new Array(4);
  87         for(var i=0; i<features.length; ++i) {
  88             features[i] = {
  89                 id: Math.random(),
  90                 tested: 0,
  91                 style: "",
  92                 layer: layer
  93             };
  94         }
  95
  96         // test that onSelect gets called properly
  97         control.onSelect = function(feature) {
  98             feature.tested += 1;
  99             t.eq(feature.id, features[feature.index].id,
 100                  "onSelect called with proper feature (" + feature.index + ")");
 101             t.eq(feature.tested, feature.test,
 102                  "onSelect called only once for feature (" + feature.index + ")");
 103             t.ok(this == control, "onSelect called in the scope of the control if control.scope is not provided");
 104         }
 105
 106         // test that onUnselect gets called properly
 107         control.onUnselect = function(feature) {
 108             feature.tested += 1;
 109             t.eq(feature.id, features[feature.index].id,
 110                  "onUnselect called with proper feature (" + feature.index + ")");
 111             t.eq(feature.tested, feature.test,
 112                  "onUnselect called only once for feature (" + feature.index + ")");
 113             t.ok(this == control, "onUnselect called in the scope of the control if control.scope is not provided");
 114         }
 115
 116         // mock up first click on first feature (runs 3 tests from onSelect)
 117         var feature = features[0];
 118         feature.index = 0;
 119         feature.test = 1;
 120         control.clickFeature(feature);
 121
 122         // mock up second click on first feature (runs no tests - already selected)
 123         control.toggle = false;
 124         control.clickFeature(feature);
 125
 126         // mock up second click on first feature (runs 3 tests from onUnselect)
 127         control.toggle = true;
 128         feature.test = 2;
 129         control.clickFeature(feature);
 130
 131
 132     }
 133
 134     function test_box(t) {
 135         t.plan(5);
 136         var map = new OpenLayers.Map("map");
 137         var layer = new OpenLayers.Layer.Vector();
 138         map.addLayer(layer);
 139         map.setBaseLayer(layer);
 140         map.setCenter(new OpenLayers.LonLat(1,1));
 141         var control = new OpenLayers.Control.SelectFeature(layer, {'multiple': true, box: true });
 142         var feature = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(0,0));
 143         var feature2 = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(1,1));
 144         var feature3 = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(-2,-2));
 145         var feature4 = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString([
 146             new OpenLayers.Geometry.Point(0, 0), new OpenLayers.Geometry.Point(1, 1)
 147         ]));
 148         layer.addFeatures([feature, feature2, feature3, feature4]);
 149         control.setMap(map);
 150         map.getLonLatFromPixel = function(arg) {
 151             return new OpenLayers.LonLat(arg.x, arg.y);
 152         }
 153         control.selectBox(new OpenLayers.Bounds(-1, -1, 2, 2));
 154         t.eq(layer.selectedFeatures.length, 3, "box around all features selects 3 features");
 155
 156         control.selectBox(new OpenLayers.Bounds(-3, -3, -1, -1));
 157         t.eq(layer.selectedFeatures.length, 4, "box around other features doesn't turn off already selected features.");
 158
 159         control.multipleSelect = function() {
 160             return false;
 161         };
 162         control.selectBox(new OpenLayers.Bounds(-3, -3, -1, -1));
 163         t.eq(layer.selectedFeatures.length, 1, "box around other features correctly turns off already selected features.");
 164
 165         control.geometryTypes = null;
 166         control.selectBox(new OpenLayers.Bounds(-100, -100, 100, 100));
 167         t.eq(layer.selectedFeatures.length, layer.features.length, "all features selected with no geometryTypes filter");
 168
 169         control.geometryTypes = ["OpenLayers.Geometry.Point"];
 170         control.selectBox(new OpenLayers.Bounds(-100, -100, 100, 100));
 171         t.eq(layer.selectedFeatures.length, 3, "3 features selected with geometryTypes filter");
 172
 173
 174     }
 175
 176     function test_Control_SelectFeature_activate(t) {
 177         t.plan(4);
 178         var map = new OpenLayers.Map("map");
 179         var layer = new OpenLayers.Layer.Vector();
 180         map.addLayer(layer);
 181         var control = new OpenLayers.Control.SelectFeature(layer, {box: true});
 182         map.addControl(control);
 183         t.ok(!control.handlers.feature.active,
 184              "feature handler is not active prior to activating control");
 185         t.ok(!control.handlers.box.active,
 186              "box handler is not active prior to activating control");
 187         control.activate();
 188         t.ok(control.handlers.feature.active,
 189              "feature handler is active after activating control");
 190         t.ok(control.handlers.box.active,
 191              "box handler is active after activating control");
 192     }
 193
 194     function test_Control_SelectFeature_deactivate(t) {
 195         t.plan(2);
 196         var map = new OpenLayers.Map("map");
 197         var layer = new OpenLayers.Layer.Vector();
 198         map.addLayer(layer);
 199         var control = new OpenLayers.Control.SelectFeature(layer, {box: true});
 200         map.addControl(control);
 201
 202         control.activate();
 203         control.handlers.feature.deactivate = function() {
 204             t.ok(true,
 205                  "control.deactivate calls deactivate on feature handler");
 206             OpenLayers.Handler.Feature.prototype.deactivate.apply(this, arguments);
 207         }
 208         control.handlers.box.deactivate = function() {
 209             t.ok(true,
 210                  "control.deactivate calls deactivate on box handler");
 211         }
 212         control.deactivate();
 213     }
 214
 215     function test_highlighyOnly(t) {
 216         t.plan(23);
 217
 218         /*
 219          * setup
 220          */
 221
 222         var map, layer, ctrl1, ctrl2, _feature, feature, evt, _style;
 223
 224         map = new OpenLayers.Map("map");
 225         layer = new OpenLayers.Layer.Vector("name", {isBaseLayer: true});
 226         map.addLayer(layer);
 227
 228         ctrl1 = new OpenLayers.Control.SelectFeature(layer, {
 229             highlightOnly: false,
 230             hover: false
 231         });
 232         map.addControl(ctrl1);
 233
 234         ctrl2 = new OpenLayers.Control.SelectFeature(layer, {
 235             highlightOnly: true,
 236             hover: true
 237         });
 238         map.addControl(ctrl2);
 239
 240         ctrl2.activate();
 241         ctrl1.activate();
 242
 243         feature = new OpenLayers.Feature.Vector();
 244         feature.layer = layer;
 245
 246         // override the layer's getFeatureFromEvent func so that it always
 247         // returns the feature referenced to by _feature
 248         layer.getFeatureFromEvent = function(evt) { return _feature; };
 249
 250         evt = {xy: new OpenLayers.Pixel(Math.random(), Math.random())};
 251
 252         map.zoomToMaxExtent();
 253
 254         /*
 255          * tests
 256          */
 257
 258         // with renderIntent
 259
 260         ctrl1.renderIntent = "select";
 261         ctrl2.renderIntent = "temporary";
 262
 263         // mouse over feature, feature is drawn with "temporary"
 264         _feature = feature;
 265         evt.type = "mousemove";
 266         map.events.triggerEvent("mousemove", evt);
 267         t.eq(feature.renderIntent, "temporary",
 268              "feature drawn with expected render intent after \"mouseover\"");
 269         t.eq(feature._lastHighlighter, ctrl2.id,
 270              "feature._lastHighlighter properly set after \"mouseover\"");
 271         t.eq(feature._prevHighlighter, undefined,
 272              "feature._prevHighlighter properly set after \"mouseover\"");
 273
 274         // click in feature, feature is drawn with "select"
 275         _feature = feature;
 276         evt.type = "click";
 277         map.events.triggerEvent("click", evt);
 278         t.eq(feature.renderIntent, "select",
 279              "feature drawn with expected render intent after \"clickin\"");
 280         t.eq(feature._lastHighlighter, ctrl1.id,
 281              "feature._lastHighlighter properly set after \"clickin\"");
 282         t.eq(feature._prevHighlighter, ctrl2.id,
 283              "feature._prevHighlighter properly set after \"clickin\"");
 284
 285         // mouse out of feature, feature is still drawn with "select"
 286         _feature = null;
 287         evt.type = "mousemove";
 288         map.events.triggerEvent("mousemove", evt);
 289         t.eq(feature.renderIntent, "select",
 290              "feature drawn with expected render intent after \"mouseout\"");
 291         t.eq(feature._lastHighlighter, ctrl1.id,
 292              "feature._lastHighlighter properly set after \"nouseout\"");
 293         t.ok(feature._prevHighlighter, ctrl2.id,
 294              "feature._prevHighlighter properly set after \"mouseout\"");
 295
 296         // mouse over feature again, feature is drawn with "temporary"
 297         _feature = feature;
 298         evt.type = "mousemove";
 299         map.events.triggerEvent("mousemove", evt);
 300         t.eq(feature.renderIntent, "temporary",
 301              "feature drawn with expected render intent after \"mouseover\"");
 302         t.eq(feature._lastHighlighter, ctrl2.id,
 303              "feature._lastHighlighter properly set after \"mouseover\"");
 304         t.eq(feature._prevHighlighter, ctrl1.id,
 305              "feature._prevHighlighter properly set after \"mouseover\"");
 306
 307         // mouve out of feature again, feature is still drawn with "select"
 308         _feature = null;
 309         evt.type = "mousemove";
 310         map.events.triggerEvent("mousemove", evt);
 311         t.eq(feature.renderIntent, "select",
 312              "feature drawn with expected render intent after \"mouseout\"");
 313         t.eq(feature._lastHighlighter, ctrl1.id,
 314              "feature._lastHighlighter properly set after \"mouseout\"");
 315         t.eq(feature._prevHighlighter, undefined,
 316              "feature._prevHighlighter properly set after \"mouseout\"");
 317
 318         // click out of feature, feature is drawn with "default"
 319         _feature = null;
 320         evt.type = "click";
 321         map.events.triggerEvent("click", evt);
 322         t.eq(feature.renderIntent, "default",
 323              "feature drawn with expected render intent after \"clickout\"");
 324         t.eq(feature._lastHighlighter, undefined,
 325              "feature._lastHighlighter properly set after \"clickout\"");
 326         t.eq(feature._prevHighlighter, undefined,
 327              "feature._prevHighlighter properly set after \"clickout\"");
 328
 329         // with selectStyle
 330
 331         ctrl1.selectStyle = OpenLayers.Feature.Vector.style["select"];
 332         ctrl2.selectStyle = OpenLayers.Feature.Vector.style["temporary"];
 333
 334         layer.renderer.drawFeature = function(f, s) {
 335             var style = OpenLayers.Feature.Vector.style[_style];
 336             t.eq(s, style, "renderer drawFeature called with expected style obj (" + _style + ")");
 337         };
 338
 339         // mouse over feature, feature is drawn with "temporary"
 340         _feature = feature;
 341         _style = "temporary";
 342         evt.type = "mousemove";
 343         map.events.triggerEvent("mousemove", evt);
 344
 345         // click in feature, feature is drawn with "select"
 346         _feature = feature;
 347         _style = "select";
 348         evt.type = "click";
 349         map.events.triggerEvent("click", evt);
 350
 351         // mouse out of feature, feature is still drawn with "select" and
 352         // the renderer drawFeature method should not be called
 353         _feature = null;
 354         evt.type = "mousemove";
 355         map.events.triggerEvent("mousemove", evt);
 356
 357         // mouse over feature again, feature is drawn with "temporary"
 358         _feature = feature;
 359         _style = "temporary";
 360         evt.type = "mousemove";
 361         map.events.triggerEvent("mousemove", evt);
 362
 363         // mouve out of feature again, feature is still drawn with "select"
 364         _feature = null;
 365         _style = "select";
 366         evt.type = "mousemove";
 367         map.events.triggerEvent("mousemove", evt);
 368
 369         // click out of feature, feature is drawn with "default"
 370         _feature = null;
 371         _style = "default";
 372         evt.type = "click";
 373         map.events.triggerEvent("click", evt);
 374     }
 375
 376     </script>
 377 </head>
 378 <body>
 379     <div id="map" style="width: 400px; height: 250px;"/>
 380 </body>
 381 </html>