Hierarchical Menu
Hierarchical menu, based on rubytree
gem. Outputs html (other formats planned) with optional JavaScript show/hide.
Example client code.
See examples/example.rb
and examples/example.css
in the distribution directory.
Synopsis
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 list generator:
html_ul_simple = root.to_html_ul
Customize behavior
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
Style and JavaScript to show/hide: complete HTML output
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
Installation
gem install
Author
Copyright 2010 Guido De Rosa <[email protected]>
License
Same of RubyTree.