I've never really run into any instances where I need events fired in an exact order, but I like the solution you've provided here. Interesting. Thanks!
~Philip On Mon, Nov 7, 2011 at 12:54 PM, Tim Wienk <[email protected]> wrote: > This is not the way you are supposed to go about using events. An > event fires, any attached handlers will be executed because the event > fired, they do not need to know of any other handlers or their > actions, because they were attached to this specific event. > > You should attach the handlers as if they are being executed at the > exact moment when the event fires, at the exact same time, not as a > stack depending on order. The way you're doing it now can lead you > into several hard-to-debug problems, where one handler is attached > earlier (and therefore comes first in the stack) due to a race > condition or lazy loading. > > Imo, if you really need to fire a stack of functions which you may > cancel along the way, implement it as a stack, though if the > functionality of your Fiddle is actually what you need I'm sure > there's a better way. > > In any case, to show an example, a simple way would be: > ``` > element.addEvent('click', function(event){ > var stack = this.retrieve('clickStack', []); > for (var i = 0, l = stack.length; i < l; ++i){ > if (stack[i].call(this, event) === false) break; > } > }); > element.retrieve('clickStack', []).push(fn); > ``` > (like: http://jsfiddle.net/9upWw/7/ ) > > > A more generic example would be something like (excuse the function name): > ``` > Element.implement('addEventStack', function(type, fn){ > var stack = this.retrieve(type + 'Stack'); > if (!stack){ > stack = []; > this.store(type + 'Stack', stack); > this.addEvent('click', function(event){ > var stack = this.retrieve(type + 'Stack'); > for (var i = 0, l = stack.length; i < l; ++i){ > stack[i].call(this, event); > if (event.stoppedImmediatePropagation) break; > } > }); > } > stack.push(fn); > }); > DOMEvent.implement('stopImmediatePropagation', function(){ > this.stoppedImmediatePropagation = true; > }); > ``` > (like: http://jsfiddle.net/9upWw/8/ ) > -- http://lonestarlightandsound.com/
