YUI Menu Examples

YUI Menu provides Horizontal (MenuBar), Vertical (Menu), and Context (ContextMenu) menu systems via semantic HTML markup, CSS, and Javascript.

PHOCOA makes it easy to build Menu and MenuBars (ContextMenu coming soon) for your application. All you have to do is provide the data.

PHOCOA supports multiple ways of defining the menu structure. Click the links to see the same menu implemented with three different techniques:

• Array of objects implementing WFMenuItem interface
• Array of objects implementing WFMenuItem interface, but with menu structure specified via a menuPath field rather than as children
• Nested Associative Array

Building a YUI Menu from an array of objects implementing WFMenuItem

This technique is ideal when your class structure is already arranged hierarchically in the form of your menu structure. All you need to to is implement the WFMenuItem interface and pass an array of the root menu items build your menu.

$menu->setMenuItems($myArray) takes a structure like:

array(
   WFMenuItemBasic::WFMenuItemBasic()
        ->setLabel('Search Engines')
        ->addChild( WFMenuItemBasic::WFMenuItemBasic()->setLabel('YAHOO')->setLink('http://yahoo.com') )
        ->addChild( WFMenuItemBasic::WFMenuItemBasic()->setLabel('Google')->setLink('http://google.com') )
        ->addChild( WFMenuItemBasic::WFMenuItemBasic()->setLabel('Ask')->setLink('http://ask.com') ),
   WFMenuItemBasic::WFMenuItemBasic()
        ->setLabel('PHP Sites')
        ->addChild( WFMenuItemBasic::WFMenuItemBasic()->setLabel('PHP Official Site')->setLink('http://php.net') )
        ->addChild( WFMenuItemBasic::WFMenuItemBasic()->setLabel('Frameworks')
                        ->addChild( WFMenuItemBasic::WFMenuItemBasic()->setLabel('Cake')->setLink('http://cakephp.org') )
                        ->addChild( WFMenuItemBasic::WFMenuItemBasic()->setLabel('Symfony')->setLink('http://symfony-project.org') )
                        ->addChild( WFMenuItemBasic::WFMenuItemBasic()->setLabel('PHOCOA')->setLink('http://phocoa.com') )
                  )
    );

Building a YUI Menu from an array of objects implementing WFMenuTreeBuilding and WFMenuItem (without children)

This technique is ideal when your class structure is flattened, but a single field contains the "path" of where that item should be in the menu. To implement this technique, implement the WFMenuItem interface and the WFMenuTreeBuilding interface.

$menu->setMenuItemsMenuPath($myArray) takes a structure like:

array(
    new YUIMenuExample_ClassWithMenuPath('Search Engines/YAHOO', 'YAHOO', 'http://yahoo.com'),
    new YUIMenuExample_ClassWithMenuPath('Search Engines/Google', 'Google', 'http://google.com'),
    new YUIMenuExample_ClassWithMenuPath('Search Engines/Ask', 'Ask', 'http://Ask.com'),
    new YUIMenuExample_ClassWithMenuPath('PHP Sites/PHP Official Site', 'PHP Sites', 'http://php.net'),
    new YUIMenuExample_ClassWithMenuPath('PHP Sites/Planet PHP', 'Planet PHP', 'http://planetphp.net'),
    new YUIMenuExample_ClassWithMenuPath('PHP Sites/Frameworks/Cake', 'Cake', 'http://cakephp.org'),
    new YUIMenuExample_ClassWithMenuPath('PHP Sites/Frameworks/Symfony', 'Symfony', 'http://symfony-project.org'),
    new YUIMenuExample_ClassWithMenuPath('PHP Sites/Frameworks/PHOCOA', 'PHOCOA', 'http://phocoa.com')
    )

Where YUIMenuExample_ClassWithMenuPath implements WFMenuTree and WFMenuTreeBuilding, and converts it into the requisite tree structure, including the creation of any needed interim nodes.

This is handy when you have a flat structure that contains a field containing path-like data (i.e., a/b/c/d). The algorithm for doing the conversion is a little complex, so PHOCOA includes this as a core capability.

Building a YUI Menu from a Nested Associative Array

This technique is ideal for simple cases where you need only build a menu and don't want to have to implement any class structure at all.

$menu->setMenuItemsNestedArray($myArray) takes a structure like:

array('Search Engines' => array('YAHOO' => 'http://yahoo.com',
            'Google' => 'http://google.com',
            'Ask' => 'http://ask.com'
            ),
        'PHP Sites' => array('PHP Official Site' => 'http://php.net',
            'Planet PHP' => ' http://planetphp.com',
            'Frameworks' => array('Cake' => 'http://cakephp.org',
                'Symfony' => 'http://symfony-project.org',
                'PHOCOA' => 'http://phocoa.com'
                )

            )
     );