Grazia, Slim-like парсер для PHP

17 октября 2011 г.

Про HAML можно прочитать здесь.

Синтаксис и стандарты, краткий экскурс

Общее

Шаблоны должны быть в UTF-8 without BOM (ANSI as UTF-8).
Для индентации (отступов) можно использовать только табы.
Все строки, не поддающиеся обработке, будут выведены без изменений.

Doctype

Подобно Slim, Grazia поддерживает следующие типы документов:

doctype 5/html/1.1/strict/frameset/m

doctype 5 и doctype html эквивалентны и заменяются ““, остальные соответствующими доктайпами (XHTML), HTML 4 не поддерживается.

HTML комментарии

/! HTML comment
   nested by indentation

Превращается в:

<!--
  HTML comment
  nested by indentation
-->

HTML комментарии для IE

/[if IE]
   only for IE

Превращается в:

<!--[if IE]>
  only for IE
<![endif]-->

И

/[if !IE]
   all browsers except IE

Соответственно в:

<!--[if !IE]><!-->
   all browsers except IE
<!--<![endif]-->

Тэги:

h1 inline-content

Вложенные тэги

h1
   Content
   p inline
   h2
     | not parse
     h1 will not parsed

При использовании ‘|’ в начале строки, все последующие строки в блоке будут выведены без изменений. По дефолту (без использования ‘|’) Grazia будет заменять первое слово в строке на тэг (если такой тэг будет найден).

Вышеуказанный пример превращается соответственно в:

<h1>
   Content
   <p>inline</p>
   <h2>
     not parse
     h1 will not parsed
   </h2>
</h1>

Обработка PHP кода

Как и в Slim и HAML для вывода переменной используется знак ‘=’.
=’ — вывод переменной с одним пробелом ( ) в конце.

Пример:

p = $super_content

Результат:

<p><?php echo($super_content) ?></p>

Использование тега в данном случае не обязательно, в начале строки может просто стоять ‘=’.

Внимание: В отличие от Slim, в Grazia нет возможности использования функции htmlentities() прямо в шаблоне (вы можете сами вставить готовый PHP-код для этого, но это не приветствуется, все переменные должны быть отфильтрованы еще перед передачей в шаблон).

Логические структуры и циклы

- if $sidebar
  = $sidebar_title
<?php if($sidebar): ?>
   <?php echo($sidebar_title) ?>
<?php endif ?>

После знака ‘-‘ может следовать любой PHP-код.

PHP-код в атрибутах

a href="{$link}"

Результат:

<a href="<?php echo($link) ?>"></a>

Если вам нужно вывести знаки { } без изменений, используйте { и } соответственно.

Кстати, все значения аттрибутов должны быть заключены в кавычки (`, ” или ‘). Логические атрибуты (disabled, checked и т.д.) без значений, должны быть записаны так: checked=”checked” (в отличие от Slim).

Атрибуты

Еще атрибуты могут быть размещены в несколько строк, для этого можно использовать только круглые скобки.

link ( rel="stylesheet" href="default.css" 
       type="text/css" media="screen")

Короткое обозначение id и class

Как и в HAML:

#myid.myclass.myclass2 My example
<div id="myid" class="myclass myclass2">My example</div>

Комментарии

Как и в Slim:
/ This is my comment, it will not be included on output
     This is another comment line because I'm nested!
 p This is my content

Фильтры

Список доступных на данный момент фильтров:

  • javascript
  • css
  • php
  • raw (вывод без изменений)

Пример:

javascript:
   $(content).do_something();

Вывод:

<script type="text/javascript">
   $(content).do_something();
</script>

Реальный пример

Выше была только небольшая справка, для полной картины взгляните на шаблон и сгенерированный HTML ниже.

/ doctype declaration
doctype html
/!
  Template for 
 
html lang="en"
  head
    meta http-equiv="content-type" content="text/html; charset=UTF-8"
    title orange
    link( rel="stylesheet" href="default.css"
      type="text/css" media="screen" )
  body
    #wrap
      header id="page_header"
        h1
          a href="#" orange
        nav
          ul
            li.selected
              a href="#" Journal
            li
              a href="#" About
            li
              a href="#" Work
            li
              a href="#" Feed
 
      section id="content"
        section.page
          ol.posts
            li
              article
                h1
                  a href="#" Lorem Ipsum
                  small 27th September 2011
 
                section.body
                  p
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ligula risus, ultricies vel sodales non, euismod quis lacus. Donec quis lacinia velit. Praesent blandit nibh sit amet nisi egestas sit amet pulvinar neque vestibulum. Ut justo ipsum, consequat et consequat eu, posuere in magna. Donec tristique auctor tortor, non auctor ante faucibus in. Curabitur tortor orci, consectetur vitae ullamcorper eu, lobortis a odio. Morbi pulvinar diam sed mi pulvinar sodales. Quisque ornare ornare cursus. Phasellus commodo rutrum orci sed pharetra. Morbi rutrum lacinia lectus eget tempus. Quisque sit amet malesuada purus. Nam sed nisi turpis.
          menu.page_links More Articles:
            strong 1
            a href="#" 2
            a href="#" 3
            span.next
              a href="#" »
            a href="#" Last ›
        aside
          h3 Categories
          ul
            li
              a href="#" Lorem ipsum dolor sit amet.
            li
              a href="#" In arcu augue, suscipit a.
            li
              a href="#" Vestibulum ante ipsum primis in.
          h3 Meta
          p Ut quam est, scelerisque a pharetra feugiat, rutrum ac lacus. Sed iaculis nibh vel justo varius congue. Curabitur rhoncus erat id nunc consequat vel dignissim nulla consequat.
 
      footer id="page_footer"
        p MMXI
    /! end #wrap
    javascript:
      $(content).do_something();
	  
	  
	  <!DOCTYPE html>
<!--
    Template for 
    
-->
<html lang="en">
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
        <title>orange</title>
        <link rel="stylesheet" href="default.css" type="text/css" media="screen" />
    </head>
    <body>
        <div id="wrap">
 
            <header id="page_header">
                <h1>
                    <a href="#">orange</a>
                </h1>
                <nav>
                    <ul>
                        <li class="selected">
                            <a href="#">Journal</a>
 
                        </li>
                        <li>
                            <a href="#">About</a>
                        </li>
                        <li>
                            <a href="#">Work</a>
                        </li>
                        <li>
 
                            <a href="#">Feed</a>
                            
                        </li>
                    </ul>
                </nav>
            </header>
            <section id="content">
                <section class="page">
                    <ol class="posts">
 
                        <li>
                            <article>
                                <h1>
                                    <a href="#">Lorem Ipsum</a>
                                    <small>27th September 2011</small>
                                    
                                </h1>
                                <section class="body">
                                    <p>
 
                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ligula risus, ultricies vel sodales non, euismod quis lacus. Donec quis lacinia velit. Praesent blandit nibh sit amet nisi egestas sit amet pulvinar neque vestibulum. Ut justo ipsum, consequat et consequat eu, posuere in magna. Donec tristique auctor tortor, non auctor ante faucibus in. Curabitur tortor orci, consectetur vitae ullamcorper eu, lobortis a odio. Morbi pulvinar diam sed mi pulvinar sodales. Quisque ornare ornare cursus. Phasellus commodo rutrum orci sed pharetra. Morbi rutrum lacinia lectus eget tempus. Quisque sit amet malesuada purus. Nam sed nisi turpis.
                                    </p>
                                </section>
                            </article>
                        </li>
                    </ol>
                    <menu class="page_links">
                        More Articles:
                        <strong>1</strong>
 
                        <a href="#">2</a>
                        <a href="#">3</a>
                        <span class="next">
                            <a href="#">»</a>
                        </span>
                        <a href="#">Last ›</a>
                    </menu>
 
                </section>
                <aside>
                    <h3>Categories</h3>
                    <ul>
                        <li>
                            <a href="#">Lorem ipsum dolor sit amet.</a>
                        </li>
                        <li>
 
                            <a href="#">In arcu augue, suscipit a.</a>
                        </li>
                        <li>
                            <a href="#">Vestibulum ante ipsum primis in.</a>
                        </li>
                    </ul>
                    <h3>Meta</h3>
 
                    <p>Ut quam est, scelerisque a pharetra feugiat, rutrum ac lacus. Sed iaculis nibh vel justo varius congue. Curabitur rhoncus erat id nunc consequat vel dignissim nulla consequat.</p>
                    
                </aside>
            </section>
            <footer id="page_footer">
                <p>MMXI</p>
            </footer>
        </div>
        <!-- end #wrap -->
 
        <script type="text/javascript">
            $(content).do_something();
        </script>
        
    </body>
</html>

Как использовать

require 'grazia.php';

$options = array(
 'cache_path' => 'cache',
);

$grazia = new Grazia($options);

$out = $grazia->parse('path/to/template');

echo eval('?>' . $out);

Если не хотите использовать кэш, просто передавайте пустой массив.

Код

Github: github.com/abuddy/Grazia

Код основан на HAML парсере: github.com/wilkerlucio/limber-haml

Теги:
рубрика PHP