Thanks for your input! I'm glad I wasn't totally messing this up, i'll have
a look at the plugin idea Eric maybe i'll find some other usages for it.

Thanks all,
 Johan

On Wed, Aug 24, 2011 at 11:50 AM, Eric <lefauv...@gmail.com> wrote:

> Hi,
>
> It may be a little slower as says Victor.
> However, you may try to use part of the class to identify a
> "plugin"class and the other part for identifying the JS class to use.
> Something like that:
>
> $$("*[class^='plugin']).each(function(e) {
>  var jsClass  = e.className.substr(6);
>  if(typeof(window[jsClass])=='function') new (window[jsClass])(e);
> });
>
> if you have an UL with class pluginTabs, it will make a "new Tabs(e)"
> on it.
>
> Note that the above code is not tested at all. You may need to found a
> proper way to check if the class actually exists and you may need to
> use another selector operator than ^= since classes are space
> separated sets (sorry, I don't have time to check the documentation).
>
> On a ground to earth approach, I'd continue doing what you're doing
> right now.
> Only difference perhaps is that I'd add to my plugin classes a static
> method which do the selection and DOM update, so you can give an array
> of class objects to your DOM init and invoke it.
>
> Eric
> On Aug 23, 10:04 am, Johan Arensman <johanm...@gmail.com> wrote:
> > Hey guys,
> >
> > I'm redesigning a template set for different kind of websites. In the
> past
> > quite a lot of 'widgets' have been created in the form of prototype
> Classes
> > and almost every widget works the same way:
> > 1. get all elements with className 'x'
> > 2. for each element: create a new ClassX
> > 3. ClassX modifies the element or does something else with it
> >
> > for example for a 'Tabs' class this piece of code is in the dom:loaded
> > event:
> > $$('ul.tabs').each(function(list) { new Tabs(list); });
> >
> > Now i'm fine with that for now but imagine to duplicate the same behavior
> > for 8 other usages, so 8 other selections are made and JS code is
> executed
> > for them.
> >
> > I would like to know if there's any way to optimize the dom:loaded event.
> > I'm not having any problems right now, it works just fine but I'm afraid
> > that if more functionality is added that performance will become a
> problem.
> >
> > One of my ideas was to combine the global element selectors into 1
> selector
> > and then apply the correct piece of code by checking if a certain class
> or
> > attribute is present on the element like this:
> > $$('ul.tabs, div.map, input.placeholder, a[rel=external]').each(function
> > applySomething(e) {
> >  // if element hasClassName('tabs') then apply tabs functionality etc..
> >  // more checking for classnames and attributes
> >
> > });
> >
> > Is this a good idea? Do I gain performance when doing this? Are there
> other
> > ways to organize this?
> >
> > All input welcome!
> >
> > Greetings,
> > Johan
>
> --
> You received this message because you are subscribed to the Google Groups
> "Prototype & script.aculo.us" group.
> To post to this group, send email to
> prototype-scriptaculous@googlegroups.com.
> To unsubscribe from this group, send email to
> prototype-scriptaculous+unsubscr...@googlegroups.com.
> For more options, visit this group at
> http://groups.google.com/group/prototype-scriptaculous?hl=en.
>
>

-- 
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com.
To unsubscribe from this group, send email to 
prototype-scriptaculous+unsubscr...@googlegroups.com.
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en.

Reply via email to