add LayerSwitcher control. Currently, when added, this will simply loop through all the map layers, display a div (with text in it) which allows you tu turn the layer on or off. Layer visibility is a new concept in Layer.js, including a getter and setter, which uses the style.visibility prop to change the status of the layer.

git-svn-id: http://svn.openlayers.org/trunk/openlayers@31 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
2006-05-14 02:44:49 +00:00
parent 45655e12a2
commit 54c0403850
5 changed files with 60 additions and 1 deletions
@@ -0,0 +1,41 @@
+OpenLayers.Control.LayerSwitcher = Class.create();
+OpenLayers.Control.LayerSwitcher.prototype = 
+  Object.extend( new OpenLayers.Control(), {
+    initialize: function() {
+        OpenLayers.Control.prototype.initialize.apply(this, arguments);
+    },
+    
+    draw: function() {
+        // initialize our internal div
+        OpenLayers.Control.prototype.draw.apply(this);
+        var pixel = new OpenLayers.Pixel(this.map.div.clientWidth-200,4);
+        for(i=0; i<this.map.layers.length; i++) {
+            var div = OpenLayers.Util.createDiv("LayerControl_layer"+i,pixel,new OpenLayers.Size(200,20));
+            div.innerHTML = this.map.layers[i].name;
+            div.style.backgroundColor="white";
+            div.style.padding="5px";
+            div.layerid = i;
+            div.map = this.map;
+            div.ondblclick = this.doubleClick.bindAsEventListener(div);
+            div.onmousedown = this.singleClick.bindAsEventListener(div);
+            this.div.appendChild(div);
+            pixel = pixel.addY(35);
+        }
+        return this.div;
+    },
+    singleClick: function(evt) {
+        var status = this.map.layers[this.layerid].getVisibility();
+        this.map.layers[this.layerid].setVisibility(!status);
+        if (status) {
+            this.style.backgroundColor="black";
+            this.style.color="white";
+        } else {
+            this.style.backgroundColor="white";
+            this.style.color="black";
+        }
+        Event.stop(evt);
+    },
+    doubleClick: function(evt) {
+        Event.stop(evt);
+    }
+});