Recherche rapide : Avancée

 

Vous êtes ici : Accueil > Articles > A la découverte de TYPO3 Phoenix Sprint Release 4 > A la découverte de TYPO3 Phoenix Sprint Release 4 (fin)

Typoscript 2

Oui, beaucoup ne maitrisent pas le typoscript 2 et comme on dit, "la TSREF est ton amie". Il va donc falloir apprendre le typoscript 2 mais il semblerait que ce soit plus simple. Bertrand Keller a rédigé un billet à ce sujet. Vous pouvez le consulter sur son blog.

Avec la version 2, plus de HMENU, de TMENU ni de GMENU. Il n'y a qu'un seul type de menu chargé de collecter les informations à afficher sur le front office. Pour voir à quoi ressemble le Typoscript 2, ouvrez le fichier situé dans Packages/Sites/PhoenixDemoTypo3Org/Resources/Private/TypoScripts/homepage avec votre éditeur préféré.

Ce fichier configure l'affichage du site de démonstration.

Pas de cours de typoscript 2 ici. Notez que la page est partagée en trois parties :
- body pour l'appel du template sous Fluid
- head pour charger les CSS et les fichiers javascript
- parts pour les menus par exemple

/**
 * Root TypoScript template for the TYPO3 Phoenix Demo Site
 */
page = Page
page.body = Template
page.body.source = 'resource://PhoenixDemoTypo3Org/Private/Templates/Page/Default.html'
page.body.sectionName = "body"

page.head {
    stylesheets {
        typo3Stylesheet = Stylesheet
        typo3Stylesheet.source = 'resource://PhoenixDemoTypo3Org/Public/StyleSheets/stylesheet.css'
        typo3Stylesheet.media = 'screen'
    }
}

# Other parts of the page:

page.parts {

    breadcrumbMenu = BreadcrumbMenu

    firstLevelMenu = Menu
    firstLevelMenu {
        entryLevel = 2
    }

    secondLevelMenu = Menu
    secondLevelMenu {
        entryLevel = 2
        maximumLevels = 3
    }

}

Dans le gabarit html, le menu est affiché depuis l'appel d'un marqueur spécifique :

<div id="navigationSecondLevelMenu">
    {parts.secondLevelMenu}
</div>

A partir de là, on se demande comment définir le HTML à afficher pour les menus.
En fait, les objets typoscript sont basé sur Fluid.

Le gabarit est situé dans le dossier suivant : Packages/Application/TYPO3/Resources/Private/Templates/TypoScriptObjects
Il s'agit du fichier Menu.html.

En voici le contenu :

{namespace typo3=F3\TYPO3\ViewHelpers}
<f:render section="itemList" arguments="{items: items}" />

<f:section name="itemList">
    <ul>
        <f:for each="{items}" as="item">
            <li class="{f:if(condition: item.state.active, then: 'active')}">
                <f:link.action package="TYPO3" controller="Node" arguments="{node: item.node}">{item.label}</f:link.action>
                <f:if condition="{item.subItems}">
                    <f:render section="itemList" arguments="{items: item.subItems}" />
                </f:if>
            </li>
        </f:for>
    </ul>
</f:section>

Pour être affiché, ce gabarit fait appel au viewHelper <f:render>.

Voici la ligne :
<f:render section="itemList" arguments="{items: items}" />

Il reçoit en argument un tableau d'éléments renvoyés par l'objet typoscript.
Ensuite, la syntaxe de Fluid fait le reste dans la section intitulée "itemList".

On liste ensuite les items du tableau, donc les éléments du menu et on ajoute au passage une classe CSS "active" si l'état du lien est actif.

On liste également les éléments enfants, ici subitems. Les liens sont générés grâce au viewHelper <f:link> qui reçoit en argument l'id du node soit {node: item.node}

Conclusion

Voilà ce que je pouvais dire sur cette version "sprint release 4" de TYPO3 Phoenix. Ce n'est pas tant le front office qui impressionne mais plutôt toute la mécanique derrière TYPO3 Phoenix : FLOW3, Fluid, ExtJS, Content Repository... Les développeurs de la Core Team ont abandonné la norme JSR-283 pour créer une API qui s'en inspire. Ils ont également créé un système de template - Fluid - car aucun système existant ne répondait à leurs besoins. Tout ceci pour dire TYPO3 Phoenix est construit autour de technologies performantes et orientées objet. Ceci nous change beaucoup de la structure vieillissante de TYPO3 4.x même si FLOW3 a été porté via Extbase.

De nombreux concepts doivent être assimilés. Autant s'y mettre tout de suite pour ne pas rater la transition.

La prochaine version est prévue pour le 12 novembre 2010.

Ressources :

Ext Direct : http://www.sencha.com/products/js/direct.php
Aloha : http://aloha-editor.com/
TYPO3 Phoenix : http://flow3.typo3.org/typo3-phoenix/download/release-notes/sprint-release-4/

Les derniers articles à consulter :