Fork me on GitHub

Intégration avec Slim Framework


L'extension Jaxon pour Slim Framework s'installe avec Composer.

composer install jaxon-php/jaxon-slim

La version 5.x de l'extension est compatible avec la version 4 du framework.

Les fonctions de l'extension

L'extension peut bootstrapper la libairie à partir du fichier de configuration donné, et fournit toutes les fonctions des extensions d'intégration, à l'exception de la gestion de sessions.

Elle n'implémente pas les fonctions, mais comme Slim Framework s'appuie sur les standards PSR, l'extension utilise les fonctions PSR de Jaxon pour fournir deux middlewares pour bootstrapper la librairie et traiter les requêtes Jaxon, et intégrer les fonctionnalités de logging et d'injection de dépendances.

Les fonctions Twig

Dans les vues Twig, les fonctions jxnCss, jxnJs et jxnScript insèrent les codes CSS et Javascript de Jaxon dans les templates.


// resources/views/demo/index.blade.php

<!-- In page header -->
{{ jxnCss() }}
</head>

<body>
<!-- Page content here -->
</body>

<!-- In page footer -->
{{ jxnJs() }}

{{ jxnScript() }}

Note Dans les exemples suivants, la variable de template rqAppTest prend comme valeur rq(Demo\Ajax\App\AppTest::class).

La fonction jxnBind attache un composant d'UI à un noeud du DOM, et jxnHtml y insère son code HTML.


    <div class="col-md-12" {{ jxnBind(rqAppTest) }}>
        {{ jxnHtml(rqAppTest) }}
    </div>

La fonction jxnPagination insère les liens de pagination d'une fonction d'un composant dans un template.


    <div class="col-md-12" {{ jxnPagination(rqAppTest) }}>
    </div>

La fonction jxnOn lie un évènement sur un élément du DOM à un appel Javascript défini avec une call factory.


    <select class="form-select"
        {{ jxnOn('change', rqAppTest.setColor(jq().val())) }}>
        <option value="black" selected="selected">Black</option>
        <option value="red">Red</option>
        <option value="green">Green</option>
        <option value="blue">Blue</option>
    </select>

La fonction jxnClick est un raccourci pour définir un gestionnaire pour l'évènement click.


    <button type="button" class="btn btn-primary"
        {{ jxnClick(rqAppTest.sayHello(true)) }}>Click me</button>

La fonction jxnEvent définit un ensemble de gestionnaires d'évènements sur les enfants d'un élément du DOM, à l'aide de sélecteurs jQuery.


    <div class="row" {{ jxnEvent([
        ['.app-color-choice', 'change', rqAppTest.setColor(jq().val())]
        ['.ext-color-choice', 'change', rqExtTest.setColor(jq().val())]
    ]) }}>
        <div class="col-md-12">
            <select class="form-control app-color-choice">
                <option value="black" selected="selected">Black</option>
                <option value="red">Red</option>
                <option value="green">Green</option>
                <option value="blue">Blue</option>
            </select>
        </div>
        <div class="col-md-12">
            <select class="form-control ext-color-choice">
                <option value="black" selected="selected">Black</option>
                <option value="red">Red</option>
                <option value="green">Green</option>
                <option value="blue">Blue</option>
            </select>
        </div>
    </div>

La fonction jxnEvent prend en paramètre un tableau dont chaque entrée est un tableau contenant un sélecteur jQuery, un évènement et une call factory.

Les fonctions jxnBind, jxnHtml, jxnPagination, jxnOn, jxnClick et jxnEventsont également définies comme des filtres Twig. Elles peuvent donc être appelées avec une syntaxe différente.


    <div class="col-md-12" {{ rqAppTest|jxnBind }}>
        {{ rqAppTest|jxnHtml }}
    </div>

Enfin, les fonctions des call factories jq, je, jo et rq sont également définies en tant que fonctions Twig.

L'application de démo

L'application de démo dans repo https://github.com/jaxon-php/jaxon-demo-slim intègre l'extension dans la version 4 de Slim Framework.

Démo Slim Framework

Elle affiche dans une même page le formulaire utilisé dans les exemples, qui est construit ici avec des templates Twig, et une calculatrice implémentée dans un package et dont le code dans le repo https://github.com/jaxon-php/jaxon-demo-calc.