Hierarchical menu, based on rubytree
gem. Outputs html (other formats planned) with optional JavaScript show/hide.
See examples/example.rb
and examples/example.css
in the distribution directory.
require 'hmenu' root = HMenu::Node.new('ROOT')
Simple example:
root.add_path('/aaa/bbb/ccc/eee', { # all keys are optional :name => 'test2', :href => '/xxx/yyy/2.html', :n => 10 :extra_class => 'my-css-class hmenu-selected' })
CSS class hmenu-selected
is special: it will be “opened” on startup by the “embedded” JavaScript code (see below).
The :n
key will be used to sort list items.
html_ul_simple = root.to_html_ul
You can add any extra/custom information:
root.add_path('/aaa/bbb/ccc/ddd', { :name => 'test1', :href => '/xxx/yyy/zzz.html', :custom_info => Object.new })
And then match within a code block to “mangle” the output:
html_ul = root.to_html_ul do |node, output| # code block is optional! if node.content.respond_to? :[] and node.content[:custom_info].class == Object output[:name] += ' (extra_info is just an Object)' # edit text output[:extra_class] = 'hmenu-selected' # add a CSS class output[:href] = nil # turn off hyperref end end
Some Style (HMenu::CSS), and some JavaScript code (HMenu::JS) to show/hide submenus:
puts <<END # you may use a template system like ERB if you wish... <head> <script type="text/javascript"> #{HMenu::JS.out} </script> <style type="text/css"> #{HMenu::CSS.out} #{File.read File.join HMenu::ROOTDIR, 'examples/example.css'} </style> </head> <body onload="reset_menus();"> #{html_ul} </body> END
gem install hierarchical_menu
Copyright 2010 Guido De Rosa <[email protected]>
Same of RubyTree.