Hi, does anyone know about any prototype based implementations of tree menus? Thanks in advance --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
Tree menu''s are incredibly easy to write, especially with prototype. There are a lot of really big and bloated tree implementations floating around if you''re in to that sort of thing. But for every situation that I''ve really wanted a tree menu, I''ve found it easier to write my own than to try to mash in an external product. If you want some really lightweight code, let me know and I''ll send you what I''ve written. -E On 5/15/07, szimek <szimek-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> > Hi, > > does anyone know about any prototype based implementations of tree > menus? > > Thanks in advance > > > > >-- Eric Ryan Harrison --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
5/15/07, Eric Harrison <blister-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> > If you want some really lightweight code, let me know and I''ll send > you what I''ve written. >Hi, I''m very interesting in your work. Can you send me en example of your tree menu please ? Thanks in advance. -- Cyril CHARLIER --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
On Tuesday 15 May 2007 14:14, Richard Quadling wrote:> I don''t know if you ever saw this, but there was a JS based menu > system called Joust (http://www.ivanpeters.com/). It was smaller than > the DHTMLMenu work that was around at the time. > > One of the great features of this was being able to add to the menu > dynamically. > ><snip> > > But it is NOT a prototype.js based menu system and is no longer supported. > > But the features like this would be great. >Shouldn''t be too hard to do with Prototype. I''ve built several tree menus over the years using DOM and Javascript. The best thing you can do is to take advantage of the DOM to do all your layout for you (makes sense, as the DOM is a tree structure itself). Here''s a rough recipe: For each node in the tree, provide a title node and a ''contents'' node that will contain any child nodes, each with their own title node and contents node, recursively. The title node (or an element within it) can be set up with a click event to Element.toggle() the contents node. If you want to load more nodes on the fly, you can generate the HTML for these extra nodes, which have a nice regular, generator-friendly structure, load it up in an Ajax.Updater, and then use an onComplete or onSuccess callback to add the toggle() interactivity - after finding all the title nodes using $$(). I don''t have a working copy that I can give away, unfortunately. There''s a working tree based on this approach at http://mystring.info/xbhistory/index2.php, but it''s a bit too complex to serve as a learning example (e.g. we''re using Effect.toggle() rather than Element.toggle(), ust to show off!) - should at least explain the DOM structure clearly if you point Firebug at it, though. HTH Dave -- ---------------------- Author Ajax in Action http://manning.com/crane Ajax in Practice http://manning.com/crane2 Prototype & Scriptaculous in Action http://manning.com/crane3 --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
I don''t know if you ever saw this, but there was a JS based menu system called Joust (http://www.ivanpeters.com/). It was smaller than the DHTMLMenu work that was around at the time. One of the great features of this was being able to add to the menu dynamically. So, you would start with nothing other than the root menu and then, as the user clicked on various menus, the click event could load more entries. Now for a small menu, this probably is overkill, but the place where I used it had a LOT of menus. They sold comics, t-shirts, statues, posters, etc. fan-boy stuff and lots of it. You could also jump from one page (say Spiderman T-shirts) to the Statues/SuperHeroes/Spiderman page. Now, if the statues menu didn''t have the superheroes sub menu, it would add just that one entry and then append the spiderman entry. So, only the next level of menus were loaded along with any paths to the root when you jumped into a page. So, the menu only ever contained the minimum required entries for the current session. But it is NOT a prototype.js based menu system and is no longer supported. But the features like this would be great. Richard. On 15/05/07, CHARLIER Cyril <cyril.charlier-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> > 5/15/07, Eric Harrison <blister-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > > If you want some really lightweight code, let me know and I''ll send > > you what I''ve written. > > > > Hi, > > I''m very interesting in your work. Can you send me en example of your > tree menu please ? > > Thanks in advance. > > -- > Cyril CHARLIER > > > >-- ----- 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 -~----------~----~----~----~------~----~------~--~---
I''d suggest using a structure rather than hierarchical divs; I''ve made tree menus mostly out of unordered lists. The children of any node in a list are then contained within an internal <ul> within the <li> of the node. Then, when a list item is clicked, you can open or close it''s internal <ul> with toggling or, as I usually do it, changing the class name of the list item that you click. That way the class name can not only control the display of any internal <ul> but it can also alter the image that appears to the left of the <li> which indicates whether the list is expanded or collapsed. -- Dash -- Dave Crane wrote:> On Tuesday 15 May 2007 14:14, Richard Quadling wrote: > >> I don''t know if you ever saw this, but there was a JS based menu >> system called Joust (http://www.ivanpeters.com/). It was smaller than >> the DHTMLMenu work that was around at the time. >> >> One of the great features of this was being able to add to the menu >> dynamically. >> >> <snip> >> >> But it is NOT a prototype.js based menu system and is no longer supported. >> >> But the features like this would be great. >> >> > Shouldn''t be too hard to do with Prototype. I''ve built several tree menus over > the years using DOM and Javascript. The best thing you can do is to take > advantage of the DOM to do all your layout for you (makes sense, as the DOM > is a tree structure itself). Here''s a rough recipe: > > For each node in the tree, provide a title node and a ''contents'' node that > will contain any child nodes, each with their own title node and contents > node, recursively. The title node (or an element within it) can be set up > with a click event to Element.toggle() the contents node. > > If you want to load more nodes on the fly, you can generate the HTML for these > extra nodes, which have a nice regular, generator-friendly structure, load it > up in an Ajax.Updater, and then use an onComplete or onSuccess callback to > add the toggle() interactivity - after finding all the title nodes using > $$(). > > I don''t have a working copy that I can give away, unfortunately. There''s a > working tree based on this approach at > http://mystring.info/xbhistory/index2.php, but it''s a bit too complex to > serve as a learning example (e.g. we''re using Effect.toggle() rather than > Element.toggle(), ust to show off!) - should at least explain the DOM > structure clearly if you point Firebug at it, though. > > HTH > > Dave > >--~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
On 15 May 2007, at 17:46, David Dashifen Kees wrote:> I''d suggest using a structure rather than hierarchical divs; I''ve made > tree menus mostly out of unordered lists. The children of any node > in a > list are then contained within an internal <ul> within the <li> of the > node. Then, when a list item is clicked, you can open or close it''s > internal <ul> with toggling or, as I usually do it, changing the class > name of the list item that you click. That way the class name can not > only control the display of any internal <ul> but it can also alter > the > image that appears to the left of the <li> which indicates whether the > list is expanded or collapsed.This solution is just one case scenario, ajax-enabled trees are sometimes a better solution (very large trees, a lot of concurrent users working in the same structure, ). Most open source tree classes support both. Best regards Peter De Berdt --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
Hi Dash, I guess unordered lists might be a more semantically correct representation of child nodes than plain ol'' div tags, and would also fit better with Scriptaculous'' house style (e.g. list tags in the Autocompleter response, in Sortables, etc.) Personally, I tend to use div''s rather than anything else when I''m programmatically generating HTML, but that''s just habit. Most of what you''re describing could be done with div''s anyway, I think? The open/close arrow or icon on an element can be set using CSS classes with a non-repeating background and a padding-left roughly equal to the width of the icon. Cheers, Dave On Tuesday 15 May 2007 16:46, David Dashifen Kees wrote:> I''d suggest using a structure rather than hierarchical divs; I''ve made > tree menus mostly out of unordered lists. The children of any node in a > list are then contained within an internal <ul> within the <li> of the > node. Then, when a list item is clicked, you can open or close it''s > internal <ul> with toggling or, as I usually do it, changing the class > name of the list item that you click. That way the class name can not > only control the display of any internal <ul> but it can also alter the > image that appears to the left of the <li> which indicates whether the > list is expanded or collapsed. > > -- Dash -- > > Dave Crane wrote: > > On Tuesday 15 May 2007 14:14, Richard Quadling wrote: > >> I don''t know if you ever saw this, but there was a JS based menu > >> system called Joust (http://www.ivanpeters.com/). It was smaller than > >> the DHTMLMenu work that was around at the time. > >> > >> One of the great features of this was being able to add to the menu > >> dynamically. > >> > >> <snip> > >> > >> But it is NOT a prototype.js based menu system and is no longer > >> supported. > >> > >> But the features like this would be great. > > > > Shouldn''t be too hard to do with Prototype. I''ve built several tree menus > > over the years using DOM and Javascript. The best thing you can do is to > > take advantage of the DOM to do all your layout for you (makes sense, as > > the DOM is a tree structure itself). Here''s a rough recipe: > > > > For each node in the tree, provide a title node and a ''contents'' node > > that will contain any child nodes, each with their own title node and > > contents node, recursively. The title node (or an element within it) can > > be set up with a click event to Element.toggle() the contents node. > > > > If you want to load more nodes on the fly, you can generate the HTML for > > these extra nodes, which have a nice regular, generator-friendly > > structure, load it up in an Ajax.Updater, and then use an onComplete or > > onSuccess callback to add the toggle() interactivity - after finding all > > the title nodes using $$(). > > > > I don''t have a working copy that I can give away, unfortunately. There''s > > a working tree based on this approach at > > http://mystring.info/xbhistory/index2.php, but it''s a bit too complex to > > serve as a learning example (e.g. we''re using Effect.toggle() rather than > > Element.toggle(), ust to show off!) - should at least explain the DOM > > structure clearly if you point Firebug at it, though. > > > > HTH > > > > Dave > > > > > -- > This email has been verified as Virus free > Virus Protection and more available at http://www.plus.net-- ---------------------- Author Ajax in Action http://manning.com/crane Ajax in Practice http://manning.com/crane2 Prototype & Scriptaculous in Action http://manning.com/crane3 --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
On Tuesday 15 May 2007 21:48, Peter De Berdt wrote:> This solution is just one case scenario, ajax-enabled trees are > sometimes a better solution (very large trees, a lot of concurrent > users working in the same structure, ). Most open source tree > classes support both.I don''t think Dash''s suggestions went for or against Ajax versus front-loading the data for the tree. Whether you''re using LI or a DIV, the structure is regular and repeatable, and easily lends itself to lazy-loading data via Ajax. Cheers, Dave -- ---------------------- Author Ajax in Action http://manning.com/crane Ajax in Practice http://manning.com/crane2 Prototype & Scriptaculous in Action http://manning.com/crane3 --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
On 16 May 2007, at 11:59, Dave Crane wrote:> I don''t think Dash''s suggestions went for or against Ajax versus > front-loading > the data for the tree. Whether you''re using LI or a DIV, the > structure is > regular and repeatable, and easily lends itself to lazy-loading > data via > Ajax.Yes, I misread the reply :-) Best regards Peter De Berdt --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
Thank you guys very much for all replies. I don''t really need an ajax based menu - I need to fetch an xml or json (I''ll probably use json because it tends to create smaller files) file using ajax and then use javascript to create a tree menu out of it. The files with data can be pretty large, so I need simple xhtml structure that can be created fast with javascript. I''ll check other implementations first to see how it works, but probably I''ll have to write my own version anyway. Thanks again. -- View this message in context: http://www.nabble.com/Prototype-based-tree-menu-tf3756726.html#a10718080 Sent from the RubyOnRails Spinoffs mailing list archive at Nabble.com. --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
In the past, I''ve used unordered lists with a recursive function to generate it. You could probably ''roll your own'' and end up with about 10-25 lines of code depending on the complexity of the tree. On 5/21/07, szimek <szimek-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> > > > Thank you guys very much for all replies. > > I don''t really need an ajax based menu - I need to fetch an xml or json > (I''ll probably use json because it tends to create smaller files) file > using > ajax and then use javascript to create a tree menu out of it. The files > with > data can be pretty large, so I need simple xhtml structure that can be > created fast with javascript. > > I''ll check other implementations first to see how it works, but probably > I''ll have to write my own version anyway. > > Thanks again. > -- > View this message in context: > http://www.nabble.com/Prototype-based-tree-menu-tf3756726.html#a10718080 > Sent from the RubyOnRails Spinoffs mailing list archive at Nabble.com. > > > > >--~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
Here is an example (among many others) //The menu definition var menu = [ {title: ''Fruits'', entries: [ {title: ''Apple'', entries: [ {title: ''Granny Smith''}, {title: ''Royal Gala''} ]}, {title: ''Banana''} ]}, {title: ''Vegetables'', entries: [ {title: ''Broccoli''} ]} ]; //Recursive function to build the menu function get_menu(obj) { var li = [obj.title]; if (obj.entries) { li.push(Builder.node(''ul'', obj.entries.collect(function(entry) { return get_menu(entry); }))); } return Builder.node(''li'', li); } //Build the menu var ul = Builder.node(''ul'', menu.collect(function(entry) { return get_menu(entry); })); //Add it to DOM $(''menu'').appendChild(ul); On 5/21/07, Jon Trelfa <jtrelfa-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> In the past, I''ve used unordered lists with a recursive function to generate > it. You could probably ''roll your own'' and end up with about 10-25 lines of > code depending on the complexity of the tree. > > > On 5/21/07, szimek <szimek-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > > > > Thank you guys very much for all replies. > > > > I don''t really need an ajax based menu - I need to fetch an xml or json > > (I''ll probably use json because it tends to create smaller files) file > using > > ajax and then use javascript to create a tree menu out of it. The files > with > > data can be pretty large, so I need simple xhtml structure that can be > > created fast with javascript. > > > > I''ll check other implementations first to see how it works, but probably > > I''ll have to write my own version anyway. > > > > Thanks again. > > -- > > View this message in context: > http://www.nabble.com/Prototype-based-tree-menu-tf3756726.html#a10718080 > > Sent from the RubyOnRails Spinoffs mailing list archive at Nabble.com. > > > > > > > > > > >--~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
bnolan-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org
2007-May-21 14:08 UTC
Re: Prototype based tree menu
Nick - that''s nice code but not very friendly to non-js browsers. Be better to define the menu in a UL LI list then add the onclick events afterwards. Nice use of builder though! :) Ben On May 21, 3:56 pm, "Nicolas Terray" <nicolas.ter...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> Here is an example (among many others) > > //The menu definition > var menu = [ > {title: ''Fruits'', entries: [ > {title: ''Apple'', entries: [ > {title: ''Granny Smith''}, > {title: ''Royal Gala''} > ]}, > {title: ''Banana''} > ]}, > {title: ''Vegetables'', entries: [ > {title: ''Broccoli''} > ]} > ]; > > //Recursive function to build the menu > function get_menu(obj) { > var li = [obj.title]; > if (obj.entries) { > li.push(Builder.node(''ul'', obj.entries.collect(function(entry) { > return get_menu(entry); }))); > } > return Builder.node(''li'', li); > > } > > //Build the menu > var ul = Builder.node(''ul'', menu.collect(function(entry) { return > get_menu(entry); })); > > //Add it to DOM > $(''menu'').appendChild(ul); > > On 5/21/07, Jon Trelfa <jtre...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > In the past, I''ve used unordered lists with a recursive function to generate > > it. You could probably ''roll your own'' and end up with about 10-25 lines of > > code depending on the complexity of the tree. > > > On 5/21/07, szimek <szi...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > > Thank you guys very much for all replies. > > > > I don''t really need an ajax based menu - I need to fetch an xml or json > > > (I''ll probably use json because it tends to create smaller files) file > > using > > > ajax and then use javascript to create a tree menu out of it. The files > > with > > > data can be pretty large, so I need simple xhtml structure that can be > > > created fast with javascript. > > > > I''ll check other implementations first to see how it works, but probably > > > I''ll have to write my own version anyway. > > > > Thanks again. > > > -- > > > View this message in context: > >http://www.nabble.com/Prototype-based-tree-menu-tf3756726.html#a10718080 > > > Sent from the RubyOnRails Spinoffs mailing list archive at Nabble.com.--~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
I would also watch out for those with screen readers. Hearing a huge list of links is not a nice idea. Something which was recommended to me to allow screen readers a chance to use navigation systems is to have a hidden link at the top of the page which points to the navigation DIV. Put this DIV as far down the page as possible, but use CSS to place it. The idea here is that the page''s content is FAR more important then the navigation, no matter how pretty. If you are blind and accessing the page via a screen reader, having no mechanism to either jump to the content or to skip the navigation is a pain and one which will instantly lose you a customer. Considering the simplicity of the "fix", HAVING it will at least have you perceived to care about those users who work the web differently to you. Also, embedded UL/LI is also awkward to navigate if non-seeing. Level1 Level1.1 Level1.1.1 Level1.2 Level1.2.1 Level1.3 Level2 etc. For listening to ... Level1 (Jump to Level1.1) Level2 (Actual page jump) Level1.1 (Jump to Level1.1.1) Level1.2 (Jump to Level1.2.1) Level1.1.1 (Actual page jump) Level1.2.1 (Actual page jump) This is REALLY nice to hear. It is just like telephone banking. And using CSS to style all of this is what makes it easier to work with. I believe that you can nearly do all of this with no JS, but I''m no expert! Hopefully an interesting consideration for you all. On 21/05/07, bnolan-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org <bnolan-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> > Nick - that''s nice code but not very friendly to non-js browsers. Be > better to define the menu in a UL LI list then add the onclick events > afterwards. Nice use of builder though! :) > > Ben > > On May 21, 3:56 pm, "Nicolas Terray" <nicolas.ter...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > Here is an example (among many others) > > > > //The menu definition > > var menu = [ > > {title: ''Fruits'', entries: [ > > {title: ''Apple'', entries: [ > > {title: ''Granny Smith''}, > > {title: ''Royal Gala''} > > ]}, > > {title: ''Banana''} > > ]}, > > {title: ''Vegetables'', entries: [ > > {title: ''Broccoli''} > > ]} > > ]; > > > > //Recursive function to build the menu > > function get_menu(obj) { > > var li = [obj.title]; > > if (obj.entries) { > > li.push(Builder.node(''ul'', obj.entries.collect(function(entry) { > > return get_menu(entry); }))); > > } > > return Builder.node(''li'', li); > > > > } > > > > //Build the menu > > var ul = Builder.node(''ul'', menu.collect(function(entry) { return > > get_menu(entry); })); > > > > //Add it to DOM > > $(''menu'').appendChild(ul); > > > > On 5/21/07, Jon Trelfa <jtre...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > > > In the past, I''ve used unordered lists with a recursive function to generate > > > it. You could probably ''roll your own'' and end up with about 10-25 lines of > > > code depending on the complexity of the tree. > > > > > On 5/21/07, szimek <szi...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > > > > Thank you guys very much for all replies. > > > > > > I don''t really need an ajax based menu - I need to fetch an xml or json > > > > (I''ll probably use json because it tends to create smaller files) file > > > using > > > > ajax and then use javascript to create a tree menu out of it. The files > > > with > > > > data can be pretty large, so I need simple xhtml structure that can be > > > > created fast with javascript. > > > > > > I''ll check other implementations first to see how it works, but probably > > > > I''ll have to write my own version anyway. > > > > > > Thanks again. > > > > -- > > > > View this message in context: > > >http://www.nabble.com/Prototype-based-tree-menu-tf3756726.html#a10718080 > > > > Sent from the RubyOnRails Spinoffs mailing list archive at Nabble.com. > > > > >-- ----- 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 -~----------~----~----~----~------~----~------~--~---