thr3ads.net - Rails spinoffs - Class.create [Dec 2007]

If this information is useful, please help other people find it:
Share via:

rzarajczyk-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org

2007-Dec-07 14:10 UTC

Class.create

is it possibile to create a subclass of DOM Elements? For example I
would like to be able to write:

var MyMenu = Class.create(''UL'', {
  initialize: function () {
  },
  addItem: function (item) {
    // create new LI and attach to this
  }
});

var menu = new MyMenu();
menu.addItem(''hello'');

and I would like this code to create a new UL element, which would
have an addidional addItem method. Is it possible?
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

Nicolás Sanguinetti

2007-Dec-07 14:28 UTC

head link

Re: Class.create

I don''t think you can do that, but something like the following might
do the trick for you:

var Menu = Class.create({
  initialize: function(id) {
    this.id = id;
    this.items = [];
  },
  addItem: function(item) {
    this.items.push(item);
    return this;
  },
  toElement: function() {
    var menu = new Element("ul", { id: this.id, className:
"menu" });
    this.items.map(Element.insert.curry(menu));
    return menu;
  }
});

You could have a similar MenuItem class that encapsulates the logic of
your menu items (event handling and whatnot), whose toElement returns
a <li>.

Then, since your Menu class responds to "toElement" you can just pass
it to Element.insert/update, etc to add it to the DOM.

var fileMenu = new Menu("file");
fileMenu.addItem(...);
$("menu_bar").insert(fileMenu);

See also
http://groups.google.com/group/rubyonrails-spinoffs/msg/d8a72071c044d7e3
for more on how toElement works.

Best,
-Nicolas

On Dec 7, 2007 12:10 PM, rzarajczyk-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org
<rzarajczyk-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:>
> is it possibile to create a subclass of DOM Elements? For example I
> would like to be able to write:
>
> var MyMenu = Class.create(''UL'', {
>   initialize: function () {
>   },
>   addItem: function (item) {
>     // create new LI and attach to this
>   }
> });
>
> var menu = new MyMenu();
> menu.addItem(''hello'');
>
> and I would like this code to create a new UL element, which would
> have an addidional addItem method. Is it possible?
> >
>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

Richard Quadling

2007-Dec-07 14:53 UTC

head link

Re: Class.create

On 07/12/2007, rzarajczyk-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org
<rzarajczyk-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:>
> is it possibile to create a subclass of DOM Elements? For example I
> would like to be able to write:
>
> var MyMenu = Class.create(''UL'', {
>   initialize: function () {
>   },
>   addItem: function (item) {
>     // create new LI and attach to this
>   }
> });
>
> var menu = new MyMenu();
> menu.addItem(''hello'');
>
> and I would like this code to create a new UL element, which would
> have an addidional addItem method. Is it possible?
Absolutely.


You can use ...

Element.addMethods(''UL'', {
	addItem: function(element, s_TextOrHTML) {
		// Extend the select.
		element = $(element);

		// Create the new LI
		var o_LI = document.createElement(''LI'');
		element.insert(o_LI);
		o_LI.update(s_TextOrHTML);

		return element;
	}
});

maybe. Slightly tested.

This adds a new method to all ULs.

$(''someULid'').addItem(''Text or
<b>html</b>'');

-- 
-----
Richard Quadling
Zend Certified Engineer : http://zend.com/zce.php?c=ZEND002498&r=213474731
"Standing on the shoulders of some very clever giants!"

--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

rzarajczyk-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org

2007-Dec-07 15:07 UTC

head link

Re: Class.create

Yes, to ALL ULs. And I want to add method only to selected UL''s -
those, which are instances of MyMenu.

So far the only working workaround I know is using global object -
MyMenuFactory:

MyMenuFactory = {
  createMenu: function () {
    var menu = new Element(''ul'');
    menu.addItem = function () { ... }
  }
}

The results are similar to what I want, but from the OOP point of view
it''s wrong - and besides it uses one more name in global namespace (I
would like to avoid it)


@Nicolás Sanguinetti: to insert/update yes, but what if I want to
remove the menu later?

--
Rafal Zarajczyk

On Dec 7, 3:53 pm, "Richard Quadling"
<rquadl...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org>
wrote:> On 07/12/2007, rzarajc...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org
<rzarajc...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>
>
>
>
>
> > is it possibile to create a subclass of DOM Elements? For example I
> > would like to be able to write:
>
> > var MyMenu = Class.create(''UL'', {
> >   initialize: function () {
> >   },
> >   addItem: function (item) {
> >     // create new LI and attach to this
> >   }
> > });
>
> > var menu = new MyMenu();
> > menu.addItem(''hello'');
>
> > and I would like this code to create a new UL element, which would
> > have an addidional addItem method. Is it possible?
>
> Absolutely.
>
> You can use ...
>
> Element.addMethods(''UL'', {
>         addItem: function(element, s_TextOrHTML) {
>                 // Extend the select.
>                 element = $(element);
>
>                 // Create the new LI
>                 var o_LI = document.createElement(''LI'');
>                 element.insert(o_LI);
>                 o_LI.update(s_TextOrHTML);
>
>                 return element;
>         }
>
> });
>
> maybe. Slightly tested.
>
> This adds a new method to all ULs.
>
> $(''someULid'').addItem(''Text or
<b>html</b>'');
>
> --
> -----
> Richard Quadling
> Zend Certified Engineer
:http://zend.com/zce.php?c=ZEND002498&r=213474731
> "Standing on the shoulders of some very clever giants!"--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

Rails spinoffs - Dec 2007 - Class.create

Class.create

Re: Class.create

Re: Class.create

Re: Class.create