yii2-jade The Tale Jade Template Engine brings the popular and powerful Templating-Language Jade for Node.js to PHP!

Yii2 Jade

  1. Requirements
  2. Installation
  3. Configuration
  4. Usage
  5. Examples
  6. Links
  7. License

The Tale Jade Template Engine brings the popular and powerful Templating-Language Jade for Node.js to PHP!

Tale Jade for PHP

Requirements

  • YII 2.0
  • PHP 5.4+

Installation

The preferred way to install this extension is through composer.

To install, either run

$ php composer.phar require conquer/jade "*"

or add

"conquer/jade": "*"

to the `require` section of your composer.json file.

Configuration

return [
    //....
    'components' => [
        'view' => [       
            'defaultExtension' => 'jade', // Set jade as default to use base view file names without extension.
            'renderers' => [
                'jade' => [
                    'class' => 'conquer\jade\JadeRenderer',
                    'cacheDuration' => 0, // seconds. 0 - compile every time
                ],
            ],
        ],
    ],
];

Usage

class SiteController extends Controller
{
    // if you do not specify a defaultExtension, you should specify it here
    $layout = 'main.jade';
    ...
    public function actionIndex()
    {
        return $this->render('index', []);
        // or
        // return $this->render('index.jade', []);
    }
}

Examples

Main layout
-
    use yii\bootstrap\Html;
    use assets\AppAsset;
    /* @var $this \yii\web\View */
    /* @var $content string */
    AppAsset::register($this);
-$this->beginPage()
doctype html
html(lang=Yii::$app->language)
    // BEGIN HEAD
    head
        meta(charset="utf-8")
        title
            != Html::encode($this->title)
        meta(http-equiv="X-UA-Compatible", content="IE=edge")
        meta(content="width=device-width initial-scale=1", name="viewport")
        != Html::csrfMetaTags()
        meta(content="", name="description")
        meta(content="", name="author")
        link(rel="shortcut icon", href="/favicon.ico")
        - $this->head()
    // END HEAD
    body(class=$this->params['body-class'])
        - $this->beginBody()
        != $content
        - $this->endBody()
    - $this->endPage()
Sub layout
-
    use yii\web\YiiAsset;
    use yii\base\Widget;
    use yii\bootstrap\Html;
    use yii\helpers\Url;
    /* @var $this \yii\web\View */
    /* @var $content string */
    $this->params['body-class'] = 'page-header-fixed page-sidebar-closed-hide-logo';
    YiiAsset::register($this);
    
- $this->beginContent('@views/layouts/main.jade');

// BEGIN HEADER & CONTENT DIVIDER
include header

.clearfix
// END HEADER & CONTENT DIVIDER
// BEGIN CONTAINER
.page-container
    // sidebar.jade is placed at @views/layouts/partials/sidebar.jade
    // jade engine just puts rendered content here
    include partials/sidebar
    != $content
// END CONTAINER
include partials/footer

- $this->endContent();
Login
-
    use yii\helpers\Html
    use yii\bootstrap\ActiveForm
    $this->title = 'Login'
    $this->params['breadcrumbs'][] = $this->title;
    
.site-login
    h1 #{$view->title}
    p Please fill out the following fields to login:
    .row
        .col-lg-5
            - $form = ActiveForm::begin(['id' => 'login-form'])
            != $form->field($model, 'username')
            != $form->field($model, 'password')->passwordInput()
            != $form->field($model, 'rememberMe')->checkbox()
            .form-group
                !=Html::submitButton('Login', ['class' => 'btn btn-primary', 'name' => 'login-button'])
            - ActiveForm::end()
Custom filters

For example, you can wrap \Yii::t('category', $message) function to short form of :t You should define a new filter in config file:

return [
    //....
    'components' => [
        'view' => [       
            'defaultExtension' => 'jade',
            'renderers' => [
            'jade' => [
                'class' => 'conquer\jade\JadeRenderer',
                'filters' => [
                    't' => function($node, $indent, $newLine){
                        return "<?=\Yii::t('category', '" . trim($node->text()) ."')?>";
                    },
                ],
            ],
        ],
    ],
];

Now you can use this filter:

-
    use yii\helpers\Html;
    use yii\widgets\ActiveForm;
    /* @var $this yii\web\View */
    /* @var $model common\models\User */
    /* @var $form yii\widgets\ActiveForm */
    
.h3
    :t Change password
-
    $form = ActiveForm::begin([
        'action' => '/user/profile#tab_1_2',
        'options' => [
            'class' => 'form-horizontal'
        ]
    ]);

!= $form->field($model, 'current_password')->passwordInput()
!= $form->field($model, 'password')->passwordInput()
!= $form->field($model, 'password_repeat')->passwordInput()

.margin-top-10
    button.btn.btn-primary(type='submit')
        :t Submit
    a.btn.default(href="javascript:;")
        :t Cancel
- ActiveForm::end();

Links

License

Jade extension for Yii2 Framework is released under the MIT license.

0 0
1 follower
0 downloads
Yii Version: 2.0
License: MIT
Category: User Interface
Developed by: Andrey Borodulin
Created on: Dec 8, 2016
Last updated: a year ago

Related Extensions