Zend_Navigation: menu z ikonkami

Zend Framework pozwala na łatwe wyświetlenie systemu nawigacji przy pomocy helpera Zend_View_Helper_Navigation_Menu:

<?php echo $this->navigation()->menu(); ?>

Zgodnie z tym co możemy wyczytać w manualu, powyższy kod wygeneruje menu oparte na tagach <ul> i <li>. W jaki sposób otrzymać coś bardziej skomplikowanego, na przykład menu z ikonami przy każdej pozycji?

Na potrzeby przykładu wyobraźmy sobie menu zdefiniowane w następujący sposób:

<?xml version="1.0" encoding="UTF-8"?>
<configdata>
    <nav>
        <id>main</id>
        <uri>/</uri>
        <pages>

            <index>
                <label>Podsumowanie</label>
                <controller>index</controller>
                <action>index</action>
                <icon>information.png</icon>
            </index>

            <articles>
                <label>Artykuły</label>
                <controller>articles</controller>
                <action>index</action>
                <icon>articles.png</icon>
            </articles>

            <categories>
                <label>Kategorie</label>
                <controller>categories</controller>
                <action>index</action>
                <icon>categories.png</icon>
            </categories>

            <users>
                <label>Użytkownicy</label>
                <controller>users</controller>
                <action>index</action>
                <icon>users.png</icon>
            </users>
        </pages>
    </nav>
</configdata>

Każda pozycja menu ma przyporządkowaną ikonę (nazwę pliku PNG). Obiekt klasy Zend_Navigation tworzymy według instrukcji obsługi:

$config = new Zend_Config_Xml(APPLICATION_PATH . '/configs/navigation.xml', 'nav');
$navigation = new Zend_Navigation($config);

Aby wyświetlić te ikony trzeba utworzyć nowy pomocnik widoku. Nie musimy budować go od podstaw - wykorzystamy klasę Zend_View_Helper_Navigation_Menu jako bazę:

<?php
// IconMenu.php
class Zend_View_Helper_IconMenu extends Zend_View_Helper_Navigation_Menu
{
    protected $_iconPath = '/images/icons';

    public function iconMenu(Zend_Navigation_Container $container = null)
    {
        if (null !== $container) {
            $this->setContainer($container);
        }

        return $this;
    }

    public function htmlify(Zend_Navigation_Page $page)
    {
        // get label and title for translating
        $label = $page->getLabel();
        $title = $page->getTitle();

        // translate label and title?
        if ($this->getUseTranslator() && $t = $this->getTranslator()) {
            if (is_string($label) && !empty($label)) {
                $label = $t->translate($label);
            }
            if (is_string($title) && !empty($title)) {
                $title = $t->translate($title);
            }
        }

        // get attribs for element
        $attribs = array(
            'id'     => $page->getId(),
            'title'  => $title,
            'class'  => $page->getClass()
        );

        // does page have a href?
        if ($href = $page->getHref()) {
            $element = 'a';
            $attribs['href'] = $href;
            $attribs['target'] = $page->getTarget();
        } else {
            $element = 'span';
        }
        
        // dodanie ikonki
        if (null !== $page->icon)
        {
            $icon = '<img src="'.$this->view->baseUrl().$this->_iconPath.'/'.$page->icon.'" alt="" /> ';
        } else {
            $icon = '';
        }

        return '<' . $element . $this->_htmlAttribs($attribs) . '>'
             . $icon
             . $this->view->escape($label)
             . '</' . $element . '>';
    }
}

Z tego kodu najbardziej istotna jest metoda htmlify() która generuje kod HTML danego odnośnika. Skopiowałem ją w całości z klasy bazowej, a następnie wstawiłem kod który dodaje ikonkę (oznaczony komentarzem). Zmienna $_iconPath określa lokalizację ikon na serwerze - w moim przypadku jest to www.domena.tld/images/icons.

Cały kod (plik IconMenu.php) trzeba umieścić w odpowiednim katalogu, aby był dostępny dla klasy Zend_View (np application/view/helpers). Następnie można już wygenerować menu w skrypcie widoku:

<?php echo $this->navigation()->iconMenu(); ?>

Efekt (po dodaniu odpowiednich stylów CSS):