PDA

View Full Version : [OPEN] [UNKNOWN][3.0.0] suspendEvents() doesn't suspend events



mynameisyoda
1 Sep 2009, 9:36 AM
Ext version tested:


Ext 3.0.0



Adapter used:


ext



css used:


only default ext-all.css (dont apply)





Browser versions tested against:


FF3 (firebug 1.4.2 installed)



Operating System:


Mac OS X 10.4.11
WinXP Pro



Description:


calling the suspendEvents() methods doesnt suspend anything...





Debugging already done:


In fireEvent method handler of attribute eventsSuspended should return false



Possible fix:
Module ext-all-debug.js



/**
* <p>Fires the specified event with the passed parameters (minus the event name).</p>
* <p>An event may be set to bubble up an Observable parent hierarchy (See {@link Ext.Component#getBubbleTarget})
* by calling {@link #enableBubble}.</p>
* @param {String} eventName The name of the event to fire.
* @param {Object...} args Variable number of parameters are passed to handlers.
* @return {Boolean} returns false if any of the handlers return false otherwise it returns true.
*/

fireEvent : function(){
var a = TOARRAY(arguments),
ename = toLower(a[0]),
me = this,
ret = TRUE,
ce = me.events[ename],
q,
c;
if (me.eventsSuspended === TRUE) {
if (q = me.suspendedEventsQueue) {
q.push(a);
}
ret = FALSE;// <-- ### FIX...####
}

evant
1 Sep 2009, 5:22 PM
Care to post a test case to demonstrate the issue?



Ext.onReady(function(){
var b = new Ext.Button({
text: 'a',
renderTo: document.body,
listeners: {
click: function(){
console.log('click!');
}
}
});
b.suspendEvents();
});

mynameisyoda
4 Sep 2009, 5:07 AM
Sorry,
the environment where I found the bug is very complex and extract a working code was an hard work.... You know, programmers are lazy... ;).

I was supposing the bug exists also in simple environment but you demonstrate not.

here the example that show the problem in action.
Thanks for your support.



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>FGA::Vehicle Homologation System</title>
<link rel="stylesheet" type="text/css" href="/js/extjs/resources/css/ext-all.css"/>
<script type="text/javascript" src="/js/extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="/js/extjs/ext-all.js"></script>

<script type="text/javascript">
Ext.onReady(function(){

/**
* Tree functionality requirements:
* - checking/unchecking a node recursively check/uncheck his children
* - checking/unchecking a node globally check/uncheck nodes with the same label
*/

// custom function to iterate an object and add nodes to tree
function iterateTree(obj,node){
Ext.iterate(obj, function(k,v){
if(Ext.isObject(v)){
var newNode = new Ext.tree.TreeNode({text:k,leaf:false,checked:true,expanded:true});
var addedNode = node.appendChild(newNode);
iterateTree(v,addedNode);
} else {
v==1 ? v = true : v=false;
var newNode = new Ext.tree.TreeNode({text:k,leaf:true,checked: v});
node.appendChild(newNode);
}
})
}

// define the custom find function
function findAllSimilarNodes(root,attribute, value) {
var similarNodes = Array();
root.cascade(function(currentNode){
console.log(currentNode.attributes[attribute] == value);
if(currentNode.attributes[attribute] == value){
similarNodes.push(currentNode);
}
})
return similarNodes;
}

var tree = new Ext.tree.TreePanel({
xtype:'treepanel'
,renderTo:document.body
,id:'scope-tree'
,title:'Scope tree'
,bodyStyle:'padding:5px'
,width: 200
,height:400
,autoScroll:true
,animate:true
,rootVisible: false
,frame: true
,root: new Ext.tree.TreeNode({
id:'root'
,expanded: true
})
// nodes are added on beforerender
,listeners: {
checkchange: function(node, checked){
//var isChecked = checked;
node.eachChild(function(currentNode){
currentNode.ui.toggleCheck(checked)
});

var similarNodes = findAllSimilarNodes(this.root, 'text',node.text);

Ext.each(similarNodes,function(n){
// must suspend event to not trigger the checkchange listners
// and going in recursion
// BUG REPORT: function go in recursion;
// seems that suspendEvents() dont stop events propagation
// FIX: ext-all-debug.js line 1795 added ret = FALSE;
n.suspendEvents();
console.log('node',n);
n.ui.toggleCheck(checked);
n.resumeEvents();
});
}
,beforeRender: function() {
// transform jsondata in object
// json data in real environment are provided by an Ajax request
var treeobj = Ext.util.JSON.decode('{"250":{"250":{"2500":1},"Y":{"2500":1},"X":{"2500":{"2501":0}}}}');
var rootNode = Ext.getCmp('scope-tree').getRootNode();
iterateTree(treeobj,rootNode);
}
}

});
});
</script>
</head>
<body>
</body>
</html>

Animal
4 Sep 2009, 5:34 AM
Why don't you use



n.ui.suspendEvents();


To actually suspend events from the Component that's firing them?

Condor
4 Sep 2009, 5:37 AM
@Animal: TreeNodeUI doesn't descend from Observable, so it doesn't have a suspendEvents method.

@mynameisyoda: The problem is that Ext.data.Node always relays the event to the ownerTree, even if events are suspended.

IMHO the correct fix is:

Ext.override(Ext.data.Node, {
fireEvent : function(evtName){
if(Ext.data.Node.superclass.fireEvent.apply(this, arguments) === false){
return false;
}
if(this.eventsSuspended !== true){
var ot = this.getOwnerTree();
if(ot){
if(ot.proxyNodeEvent.apply(ot, arguments) === false){
return false;
}
}
}
return true;
}
});

Animal
4 Sep 2009, 5:48 AM
Hmm, that won't work, it fires events through its owning TreeNode:



fireEvent : function(){
return this.node.fireEvent.apply(this.node, arguments);
},


Looking at the code, it does look like it drops through to call the fire method.

evant
6 Sep 2009, 11:09 PM
Or, alternatively, suspend the events on the tree.

mjlecomte
18 Oct 2009, 8:42 AM
What is the status of this thread?