Obtenir le menu de navigation Zend pour travailler avec jQuery Fisheye

Question

J'utilise Zend_Navigation (ajout doux au cadre, btw) pour construire mon menu, après quoi il doit être rendu dans la page (auto-évidemment). J'ai d'abord mis le conteneur quelque part dans le contrôleur:

// $pages is the array containing all page information
$nav = new Zend_Navigation($pages);
$this->view->navigation($nav);

Ensuite, dans la mise en page, il est rendu comme ceci:

echo $this->navigation()->menu();

qui fonctionne parfaitement. Maintenant: Je veux que le menu soit rendu un peu différemment. La page Je construis utilise jQuery Fisheye-plugin pour construire un menu Dock Mac-like. Cependant, ce plugin a besoin d'un balisage spécifique ...

En fait, il prend une liste d'éléments de <a> contenant à la fois un <img> (par l'icône) et un <span> (pour l'info-bulle). L'assistant standard vue Menu rend tout à l'intérieur d'une liste non ordonnée (logiquement), avec le paramètre 'label' que le texte du lien.

Il semble que le contenu passé au paramètre 'label' est échappé avant de rendre, afin d'insérer le code html il ne me fera aucun bien. En outre, le Fisheye habituellement ne semble pas prendre ses éléments contenus dans une balise <li>, avec la chose entière enveloppée dans <ul></ul>, mais juste une liste d'un niveau d'éléments de <a>.

Je pensais à écrire un helper de vue personnalisée pour la station d'accueil, qui serait en mesure de prendre soin d'insérer le <img> et le <span>, mais je vais avoir beaucoup de mal à obtenir une aide de vue personnalisée attachée à la classe de navigation . Je ne peux pas savoir où le placer et de quelle manière, même si tous mes autres classes personnalisées (modèles et autres) sont gentiment pris en charge par le chargeur automatique. Toutes les idées sur ce sujet?

Et puis, même si je peux obtenir cette aide de vue de travailler, je suis toujours parti avec la liste non ordonnée HTML - Je sais que je peux perdre ce un trop en utilisant l'aide de vue personnalisée, mais je l'ai toujours été fan des principales contenant des menus de navigation dans une liste, dans l'intérêt de la sémantique.

Si quelqu'un peut me aider un peu, je l'apprécie beaucoup. Si le Fisheye juste ne vise pas à travailler avec des années <ul>, ce serait trop mauvais ... y aurait-il une bonne raison pour perdre Zend_Navigation tout à fait dans ce cas?

Answer 1

Je ne l'ai pas vu la façon encore soit en termes de fabrication d'un moteur de rendu personnalisé. Voici ce que je fini par faire bien:

D'abord, au lieu de rendre l'appel menu par défaut (), créer une partie à rendre dans:

// menu.phtml is partial, cms is module
$partial = array('menu.phtml', 'cms');
$this->navigation()->menu()->setPartial($partial);
echo $this->navigation()->menu()->render();

Ensuite, (à partir de la documentation), vous pouvez créer une « coutume » rendre comme ceci:

// -- inside menu.phtml
foreach ($this->container as $page) 
{
    // this just prints a "<a>" or "<span>" tag
    // depending on whether the page has a uri
    echo $this->menu()->htmlify($page), PHP_EOL;
}

J'ai fini par faire ce que j'avais à l'origine (un menu avec un niveau de sous-menus) avec ce script:

// -- another menu.phtml
<ul class="navigation">

<?php

$html = array();

foreach ($this->container as $page) 
{
    $html[] = "<li>";
    $html[] = $this->menu()->htmlify($page) . PHP_EOL;

    if (!empty($page->pages))
    {
        $html[] = "<ul>";
        foreach ($page->pages as $subpage) 
        {
            $html[] = "<li>";
            if ($href = $subpage->getHref()) $html[] = "<a href=\"{$href}\">";
            else $html[] = "<span>";
            $html[] = "<img src=\"/ui/cms/img/icons/edit.png\" alt=\"\"/>";
            $html[] = $subpage->getLabel();
            if ($href) $html[] = "</a>";
            else $html[] = "</span>";            
            $html[] = "</li>";
        }
        $html[] = "</ul>";
    }

    $html[] = "</li>";
}

echo join(PHP_EOL, $html);

?>
</ul>

Vous pouvez simplement modifier le balisage dans la partie et d'ajouter vos images / icônes là.

Answer 2

Désolé, pour la question de la mise en forme sur le post précédent

Pour ajouter votre aide personnalisée procédez comme suit, dans votre bootstrap:

protected function _initNavigation()
{
    $this->bootstrap('view');           // make sure we have a view
    $view = $this->getResource('view');     // get the view resource
    $config = new Zend_Config_Xml(APPLICATION_ROOT . '/config/navigation.xml','nav');
    $container = new Zend_Navigation($config);
    $view->navigation($container);

    // Tell Zend were it can find your custom helpers and what
    // the prefix is going to be.

   $view->addHelperPath(
          APPLICATION_ROOT . '/library/MyApp/View/Helper/Navigation',
          'MyApp_View_Helper_'
          );

}

Ensuite, créez votre aide de vue personnalisée et le mettre dans le chemin de la « addHelperPath ». En fonction de ce que vous voulez faire, vous devez mettre en œuvre au moins votre propre fonction htmlify. Jetez un oeil à Zend / View / Aide / Navigation / menu.php comme exemple.

class MyApp_View_Helper_MyMenu extends Zend_View_Helper_Navigation_Menu
{
    public function myMenu(Zend_Navigation_Container $container = null)
    {
        if (null !== $container) {
            $this->setContainer($container);
        }
        return $this;
    }

    protected function htmlify(Zend_Navigation_Page $page ) 
    {
        ...
    }
}

Ensuite, dans votre script phtml:

   <?php echo $this->navigation()->myMenu()->setMaxDepth(0); ?>

ou tout simplement

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

Maintenant, si vous voulez ajouter vos propres propriétés personnalisées au code HTML généré, vous pouvez les ajouter à votre navigation fichier ini ou xml. Par exemple:

<home>
  <label>Home</label>
  <uri>/</uri>
  <img>
      <src>/images/MyIcon.gif</src>
  <img>
</home>

La balise XML personnalisé <img> sera stocké en tant que propriété de la page de navigation et peut être récupéré comme:

foreach ($iterator as $page) {

    ...

    $properties = new Zend_Config($page->GetCustomProperties());
    $myPicture = $properties->img->src;

    ...
}

Espérons que cela aide. Peter