change Panel to avoid redrawing every control on every activate/deactivate, p=jorix, r=me (closes #2906)

git-svn-id: http://svn.openlayers.org/trunk/openlayers@11874 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
Éric Lemoine
2011-04-05 06:35:49 +00:00
parent 8337674791
commit 6e3af67dab
2 changed files with 73 additions and 42 deletions

View File

@@ -96,16 +96,16 @@ OpenLayers.Control.Panel = OpenLayers.Class(OpenLayers.Control, {
*/
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 @@ OpenLayers.Control.Panel = OpenLayers.Class(OpenLayers.Control, {
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 @@ OpenLayers.Control.Panel = OpenLayers.Class(OpenLayers.Control, {
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 @@ OpenLayers.Control.Panel = OpenLayers.Class(OpenLayers.Control, {
// 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,13 +271,30 @@ OpenLayers.Control.Panel = OpenLayers.Class(OpenLayers.Control, {
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
*/

View File

@@ -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, {
@@ -36,8 +36,22 @@
"new OpenLayers.Control.Panel returns object");
panel.redraw = function(){
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");
@@ -45,6 +59,8 @@
panel.redrawsCount = 0;
map.addControl(panel);
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.");
@@ -65,10 +81,9 @@
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);
@@ -80,15 +95,20 @@
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);