[OpenLayers-Commits] r11874 - in trunk/openlayers: lib/OpenLayers/Control tests/Control

commits-20090109 at openlayers.org commits-20090109 at openlayers.org
Tue Apr 5 02:35:52 EDT 2011


Author: erilem
Date: 2011-04-04 23:35:49 -0700 (Mon, 04 Apr 2011)
New Revision: 11874

Modified:
   trunk/openlayers/lib/OpenLayers/Control/Panel.js
   trunk/openlayers/tests/Control/Panel.html
Log:
change Panel to avoid redrawing every control on every activate/deactivate, p=jorix, r=me (closes #2906)

Modified: trunk/openlayers/lib/OpenLayers/Control/Panel.js
===================================================================
--- trunk/openlayers/lib/OpenLayers/Control/Panel.js	2011-04-05 06:22:12 UTC (rev 11873)
+++ trunk/openlayers/lib/OpenLayers/Control/Panel.js	2011-04-05 06:35:49 UTC (rev 11874)
@@ -96,16 +96,16 @@
      */
     destroy: function() {
         OpenLayers.Control.prototype.destroy.apply(this, arguments);
-        for(var i = this.controls.length - 1 ; i >= 0; i--) {
-            if(this.controls[i].events) {
-                this.controls[i].events.un({
-                    "activate": this.redraw,
-                    "deactivate": this.redraw,
-                    scope: this
+        for (var ctl, i = this.controls.length - 1; i >= 0; i--) {
+            ctl = this.controls[i];
+            if (ctl.events) {
+                ctl.events.un({
+                    activate: this.iconOn,
+                    deactivate: this.iconOff
                 });
             }
-            OpenLayers.Event.stopObservingElement(this.controls[i].panel_div);
-            this.controls[i].panel_div = null;
+            OpenLayers.Event.stopObservingElement(ctl.panel_div);
+            ctl.panel_div = null;
         }
         this.activeState = null;
     },
@@ -172,13 +172,7 @@
         this.div.innerHTML = "";
         if (this.active) {
             for (var i=0, len=this.controls.length; i<len; i++) {
-                var element = this.controls[i].panel_div;
-                if (this.controls[i].active) {
-                    element.className = this.controls[i].displayClass + "ItemActive";
-                } else {    
-                    element.className = this.controls[i].displayClass + "ItemInactive";
-                }    
-                this.div.appendChild(element);
+                this.div.appendChild(this.controls[i].panel_div);
             }
         }
     },
@@ -195,7 +189,6 @@
         if (!this.active) { return false; }
         if (control.type == OpenLayers.Control.TYPE_BUTTON) {
             control.trigger();
-            this.redraw();
             return;
         }
         if (control.type == OpenLayers.Control.TYPE_TOGGLE) {
@@ -239,6 +232,7 @@
         // since they need to pass through.
         for (var i=0, len=controls.length; i<len; i++) {
             var element = document.createElement("div");
+            element.className = controls[i].displayClass + "ItemInactive";
             controls[i].panel_div = element;
             if (controls[i].title != "") {
                 controls[i].panel_div.title = controls[i].title;
@@ -277,14 +271,31 @@
                 control.deactivate();
             }
             control.events.on({
-                "activate": this.redraw,
-                "deactivate": this.redraw,
-                scope: this
+                activate: this.iconOn,
+                deactivate: this.iconOff
             });
         }  
     },
 
     /**
+     * Method: iconOn
+     * Internal use, for use only with "controls[i].events.on/un".
+     */
+     iconOn: function() {
+        var d = this.panel_div; // "this" refers to a control on panel!
+        d.className = d.className.replace(/ItemInactive$/, "ItemActive");
+    },
+
+    /**
+     * Method: iconOff
+     * Internal use, for use only with "controls[i].events.on/un".
+     */
+     iconOff: function() {
+        var d = this.panel_div; // "this" refers to a control on panel!
+        d.className = d.className.replace(/ItemActive$/, "ItemInactive");
+    },
+
+    /**
      * Method: onClick
      */
     onClick: function (ctrl, evt) {

Modified: trunk/openlayers/tests/Control/Panel.html
===================================================================
--- trunk/openlayers/tests/Control/Panel.html	2011-04-05 06:22:12 UTC (rev 11873)
+++ trunk/openlayers/tests/Control/Panel.html	2011-04-05 06:35:49 UTC (rev 11874)
@@ -10,7 +10,7 @@
         t.eq( control.displayClass,  "olControlPanel", "displayClass is correct" );
     }
     function test_Control_Panel_constructor2 (t) {
-        t.plan(16);
+        t.plan(19);
         var map = new OpenLayers.Map('map');
         var toolControl = new OpenLayers.Control.ZoomBox();
         var AnotherToolControl = OpenLayers.Class(OpenLayers.Control, {
@@ -22,53 +22,68 @@
               CLASS_NAME: 'mbControl.TestToggle',
               type: OpenLayers.Control.TYPE_TOGGLE
         });
-        
+
         var toggleControl = new ToggleControl();
         var buttonControl = new OpenLayers.Control.Button({
             trigger: function () {
-                t.ok(true, "trigger function of button is called.");     
+                t.ok(true, "trigger function of button is called.");
             }
         });
 
         var panel = new OpenLayers.Control.Panel(
             {defaultControl: anotherToolControl});
-        t.ok(panel instanceof OpenLayers.Control.Panel, 
+        t.ok(panel instanceof OpenLayers.Control.Panel,
               "new OpenLayers.Control.Panel returns object");
         panel.redraw = function(){
-            panel.redrawsCount++;            
+            panel.redrawsCount++;
+            OpenLayers.Control.Panel.prototype.redraw.apply(this, arguments);
         };
 
+        // To get length of events.listeners error-free
+        var getListenerLength= function(events,key){
+            if(!events) {
+                return -2; // events is destroyed
+            } else if(!events.listeners) {
+                return -1; // events is destroyed
+            } else if(!events.listeners[key]) {
+                return 0; // no listener in event
+            } else {
+                return events.listeners[key].length;
+            }
+        };
+        var toolEventListenerLength = getListenerLength(toolControl.events,"activate");
         panel.addControls([toolControl, anotherToolControl, toggleControl]);
         t.eq(panel.controls.length, 3,
               "added three controls to the panel");
         panel.addControls([buttonControl]);
 
-        panel.redrawsCount = 0;              
+        panel.redrawsCount = 0;
         map.addControl(panel);
-        t.ok((panel.redrawsCount > 0), "Redraw called on add panel to map " + 
-            panel.redrawsCount + " times.");        
-        t.ok((panel.active),"Panel is active after add panel to map.");        
-        
-        panel.redrawsCount = 0;              
+        t.eq(getListenerLength(toolControl.events,"activate"), toolEventListenerLength+1,
+            "toolControl additional listener for \"activate\" after adding Panel to the map.");
+        t.ok((panel.redrawsCount > 0), "Redraw called on add panel to map " +
+            panel.redrawsCount + " times.");
+        t.ok((panel.active),"Panel is active after add panel to map.");
+
+        panel.redrawsCount = 0;
         panel.addControls(new AnotherToolControl());
         t.ok((panel.redrawsCount > 0),
             "Redraw called on add control to panel after add panel to map " +
-            panel.redrawsCount + " times."); 
+            panel.redrawsCount + " times.");
 
         panel.deactivate();
-        panel.redrawsCount = 0;                      
-        panel.activate();        
+        panel.redrawsCount = 0;
+        panel.activate();
         t.ok((panel.redrawsCount > 0),"Redraw called on activate panel " +
-            panel.redrawsCount + " times."); 
+            panel.redrawsCount + " times.");
 
         panel.activateControl(toolControl);
         t.ok(toolControl.active && !anotherToolControl.active && !toggleControl.active && !buttonControl.active,
               "activated one tool control, the other one is inactive and the toggle & button controls also.");
 
-        panel.redrawsCount = 0;              
         panel.activateControl(toggleControl);
-        t.eq(panel.redrawsCount, 1, "Redraw called on activated toggle " +
-            panel.redrawsCount + " times.");
+        t.eq(toggleControl.panel_div.className,"mbControlTestToggleItemActive",
+            "className of icon div for toggle control is active.");
         t.ok(toolControl.active && !anotherToolControl.active && toggleControl.active,
               "activated the toggle control, which has no influence on the tool & togggle controls.");
         panel.activateControl(buttonControl);
@@ -79,16 +94,21 @@
         buttonControl.activate();
         t.ok(buttonControl.active && toolControl.active && !anotherToolControl.active && toggleControl.active,
               "activated the button control, which has no influence on the tool & togggle controls.");
-              
-        panel.redrawsCount = 0; 
+
         panel.activateControl(anotherToolControl);
-        t.ok((panel.redrawsCount > 0),
-            "Redraw called on activated tool control " + panel.redrawsCount + 
-            " times.");
+        t.eq(anotherToolControl.panel_div.className,"mbControlTestToolItemActive",
+            "className of icon div for anotherToolControl is active.");
+        t.eq(toolControl.panel_div.className,"olControlZoomBoxItemInactive",
+            "className of icon div for toolControl is inactive.");
         t.ok(!toolControl.active && anotherToolControl.active && toggleControl.active,
               "activated the other tool control, the first one is inactive and the toggle control still active.");
         t.ok(buttonControl.active,
               "activated the other tool control, the button control still active.");
+
+        panel.destroy();
+        t.eq(getListenerLength(toolControl.events,"activate"), toolEventListenerLength,
+            "toolControl additional listeners removed after destroy Panel.");
+        map.destroy();
     }
     function test_Control_Panel_titles (t) { 
         t.plan(2); 



More information about the Commits mailing list