No, it's really not bad, I just wanted to explore what is possible and what is not. Thanks again.
On Aug 25, 9:02 pm, Aaron Newton <[email protected]> wrote: > That's not how prototypal inheritance works, and attaching methods to > specific elements presents garbage collection issues. In short, not really. > Perhaps element shortcuts aren't really what you need. > Is it really so bad to have to refer to the instance of a class? > > On Tue, Aug 25, 2009 at 9:00 PM, reaktivo <[email protected]> wrote: > > > Thanks for the answers. Is there a way I could extend only the > > elements I specify and not the Element class itself ? It seems to me, > > that not all elements should have the functionality I'm trying to add. > > > On Aug 25, 6:05 pm, Aaron Newton <[email protected]> wrote: > > > Be cautious about what you name these > > > properties. In general, you should try and ensure your names are > > > relatively unique. Naming an element method "scroll" is quite likely > > > to collide with something elsewhere. Try and give your name something > > > less likely to be overwritten. > > > As for the best way to add such methods, Arian is correct. Look at > > > Fx.Tween or Fx.Reveal for examples. > > > > On Tue, Aug 25, 2009 at 3:59 PM, Arian <[email protected]> wrote: > > > > > I have a solution for your first problem: > > > > > You can create something link this: > > > > > Element.Properties.scroller = { > > > > > set: function(options){ > > > > this.eliminate('scroller').store('scroller:options',options); > > > > }, > > > > > get: function(options){ > > > > if (options || !this.retrieve('scroller')){ > > > > if (options || !this.retrieve('scroller:options')) > > > > this.set('scroller', options); > > > > this.store('scroller', new Scroller(this, this.retrieve > > > > ('scroller:options'))); > > > > } > > > > > }; > > > > > Element.implement({ > > > > > scroll: function(what){ > > > > var scroller = this.get('scroller'); > > > > switch(what){ > > > > case: 'start': scroller.start(); break; > > > > case: 'next': scroller.nextItem(); break; > > > > } > > > > } > > > > > }); > > > > > On this way you can do the same thing like Fx.Tween, first you can do > > > > elmt.set('scroller',{options}); > > > > and then elmt.scroll('start'); > > > > > and that looks pretty semantic... > > > > > On 25 aug, 20:11, reaktivo <[email protected]> wrote: > > > > > I'm creating a scrolling text ticker class in MooTools, named > > > > > Scroller. The initializer takes two arguments, the element it's going > > > > > to "control" and the options for the scroller, and has a bunch of > > > > > methods start(), stop(), nextItem(), toggle(), etc. The initializer > > > > > calls the occlude method of Class.Occlude. So an example for calling > > > > > it is: > > > > > > var s = new Scroller($("scroller"), options); > > > > > > then call s.start() or s.nextItem() or whatever. > > > > > > I want to be able to add the methods to the element itself, so I > > could > > > > > call $('scroller').nextItem(), $('scoller').start(), etc. It just > > > > > seems more semantically correct, but it seems to be frowned upon, or > > > > > I've never seen it in use, I suppose there's a reason, I just want to > > > > > know why. > > > > > > Also, whenever I write a class for example the scroller, I'll add > > > > > this: > > > > > > $extend (Scroller, { > > > > > all: function(els, options) { > > > > > els.each(function(el) { > > > > > new Scroller(el, options); > > > > > }); > > > > > } > > > > > }); > > > > > > and this: > > > > > > Scroller.all($$('.moo-scroller'), { > > > > > interval: 4000, > > > > > //autostart: false, > > > > > tween: { > > > > > duration: 1000, > > > > > transition: "expo:in:out" > > > > > } > > > > > }); > > > > > > So I can just add my script tag before </body> and add classes > > > > > correspondingly. So I'm thinking of creating a "Widgeter" class that > > > > > handles this and more, so my own Scroller class and any other class > > > > > could add itself to Widgeter like so: > > > > > > initializer: function() { > > > > > ... > > > > > if(Widgeter) Widgeter.add(Scroller); > > > > > > } > > > > > > and Widgeter would have a function something like this: > > > > > > $extend(Widgeter, { > > > > > > prefix: 'widget-', > > > > > > add: function(widget_class) { > > > > > if(!widgets_arr.contains(widget_class)) > > widgets_arr.push > > > > > (widget_class); > > > > > }, > > > > > > init: function() { > > > > > widgets_arr.each(this.widgetize); > > > > > }, > > > > > > widgetize: function(widget_class, options) { > > > > > $$(this.prefix + > > > > widget_class.toLowerCase()).each(function(element) > > > > > { > > > > > new widget_class(element, options); > > > > > this.occlude(widget_class.toString(), > > element); > > > > > }); > > > > > > } > > > > > > }); > > > > > > so all the classes that add functionality to elements. > > > > > > So what do you think ?
