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.