jueves, 18 de agosto de 2011

Blur event firing when it should not

Situation:

-Google Closure Component that contains a seamless field, and a clickable text at its side
-The object should load focused at the seamless field to let the user write on it immmediately, or click at the text
-I wanted to have the object disposed if it loses focus (blur)
-I wante to have the object transformed if the user clicks on the text


This created an issue because the listener to the blur event was listening at the seamless field, and if I clicked the text the object dissapeared with no option to get it changed.

I researched for options like:
-hierarchical propagation of events
-timers
-priority of event dispatching


Nothing of the previous served, the solution was to set two additional listeners in the clickable text, a mouseout and a mouseover. each switch the value of a flag. then when the dispose event gets fired, before executing it, I just needed to check the status of the flag to know if I can dispose the object, or not.

The variable at the declaration space:
 this.outsideClick = true;  



The listeners:
 this.ehChoicer_.listen(goog.dom.getElement(this.makeId(this.rootlabel+'eventChoice')), goog.events.EventType.MOUSEOUT , switchClickComponentOut);  

this.ehChoicer_.listen(goog.dom.getElement(this.makeId(this.rootlabel+'eventChoice')), goog.events.EventType.MOUSEOVER , switchClickComponentIn);


The functions:
 function switchClickComponentOut(){  

this.outsideClick=true;
}
function switchClickComponentIn(){
this.outsideClick=false;
}


The check at the dispose:
 if (this.outsideClick)   

{
//the dispose stuff
}

miércoles, 10 de agosto de 2011

google closure's focus() not working in chrome

google closure's focus() does not work in chrome

but

focusAndPlaceCursorAtStart()

does

Formatting code in blogger

By the way, I've just discovered this tool for formatting code to directly paste it into any blog, like blogger. pretty useful:
http://codeformatter.blogspot.com/2009/06/about-code-formatter.html

Timing problems disposing components in google closure

I was receiving the following error while trying to remove a component in Closure (seamlessField):
 this.getEditableDomHelper() is null  

[Detener en este error] var win = this.getEditableDomHelper().getWindow();

The component was to be disposed after the component received a Blur event (loses focus), problem was that the blur routine was still dispatching while the component was already removed. After looking for an option to wait for the routine to finish, I solved it in a nasty way:

 setTimeout(function(thisObj) { thisObj.dispose(); }, 200, this);  



that is, setting a timeout to let the routine finish, and then disposing it.