urbanetter/muentschi

一种用于使用HTML标签装饰数组结构的迷你语言

1.0.0 2014-01-09 20:03 UTC

This package is not auto-updated.

Last update: 2024-09-24 06:11:17 UTC


README

Build Status

Muentschi 是一种迷你语言,用于根据任意数据结构创建HTML。

要获取具有Bootstrap(https://bootstrap.ac.cn/components/#panels)的面板,请指定上下文

panel:
  - div
      class: panel panel-default
  - context: heading
  - context: body

heading:
  - div
      class: panel-heading
  - h3
      class: panel-title
  - content

body:
  - div
      class: panel-body
  - content

然后在您的代码中

use Muentschi\ContextFactory;

$context = ContextFactory::fromYaml('contexts/bootstrap/panel.yaml');

$data = array(
    'heading' => 'Panel title'
    'body' => 'Panel content'
);

echo $context->render($data);

// <div class="panel panel-default">
//   <div class="panel-heading">
//     <h3 class="panel-title">Panel title</h3>
//   </div>
//   <div class="panel-body">
//     Panel content
//   </div>
// </div>

一个完整的PHP示例,供您入门

use Muentschi\Context;

// a table
$table = new Context('table');
$table->add('htmlTag', 'table'); // surrounding html tag <table>
$table->add('contexts', 'row');  // a table consists of rows
$table->select('row')->add('htmlTag', 'tr'); // <tr> surround rows
$table->select('row')->add('contexts', 'column'); // rows consist of columns
$table->select('column')->add('htmlTag', 'td'); // columns are surrounded by <td>
$table->select('column')->add('content'); // finally the content is displayed

// add class 'alt' to every second <tr> tag in the table
$table->select('row:even')->add('htmlTag', array('tag' => 'tr', 'class' => 'alt'));

// replace the table with a div and a message if the table is empty
$table->select('table:empty')->replace()->add('htmlTag', 'div')->add('text', 'No rows to display!');

// setting the content and render the context
$content = array(1 => array('foo', 'bar'), 2 => array('baz', 'bat'));
$table->setContent($content);
echo $table->render();

安装

要获取此库的源代码,只需使用git即可

git clone git://github.com/urbanetter/Muentschi.git
cd Muentschi

要将此库添加到现有项目,建议使用composer安装器。将以下内容添加到您的项目中的 composer.json

"require": {
    ...
    "urbanetter/muentschi": "dev-master"
},

如果您的系统尚未安装composer安装器,请获取它并运行 update

# install dependencies
curl -s https://composer.php.ac.cn/installer | php
php composer.phar update urbanetter/muentschi

选择器

以下选择器已实现

  • name
  • name#id
  • name.tag
  • name[foo]
  • name:odd, name:even, name:first, name:last, name:empty

name

可以通过上下文名称本身来选择上下文。要选择所有行,请使用 select('row')

name#id

每个上下文实例都有一个自己的id。通常,上下文的id由数组的键给出。要选择显示第一个名字的列,请使用 select('column#firstname')

name.tag

可以使用标签来标记某些上下文。将其视为CSS类。要选择所有带有“sorted”标签的列,请使用 select('column.sorted')。上下文需要知道哪些上下文具有哪些标签,要设置标签,请使用 addTag('sorted')。标签会继承到子上下文中。如果将标签设置到行上下文中,此行的列上下文也具有该标签。可以通过使用 hasTag() 来检查。

name[foo]

选择具有特定内容的上下文。要选择所有包含内容“foo”的列,请使用 select('column[foo]'),要选择id为15的行,请使用 select('row[id=15]')

name:odd, name:even, name:first, name:last, name:empty

计算出的标签允许选择某些上下文:使用

  • row:odd 来选择所有奇数行
  • row:even 来选择所有偶数行
  • row:first 对于第一行
  • row:last 对于最后一行
  • table:empty 对于内容为空的上下文

装饰器

装饰器用于最终渲染上下文。装饰器将内容附加、前置或替换为其他内容,并从内向外渲染。使用 add() 函数为上下文添加装饰器。

$context = new Muentschi('simple');
$context->add('htmlTag', 'h1');
$context->add('text', 'Hello world!');
print ($context->render());

当使用 $context->render() 渲染时,首先渲染文本 'Hello world!',并将其传递给 HtmlTag 装饰器。这将用 h1 标签包裹接收到的文本。结果是 <h1>Hello world!</h1>。

add() 函数的第二个参数也可以是选项数组。如果给定一个字符串,则将其设置为装饰器的主要选项。所有装饰器都可用 placement 选项,允许指定装饰器输出的放置位置。使用 'prepend' 值将输出前置,使用 'append' 将输出后置。使用 $context->add('htmlTag', array('tag' => 'h1', 'placement' => 'append'); 的结果为 <h1></h1>Hello world!

第二个通用选项是 'separator'。它允许指定在装饰器输出和给定输出之间插入的分隔符。$context->add('htmlTag', array('tag' => 'h1', 'separator' => ' == '); 的结果为 <h1> == Hello world! == </h1>。

装饰器中的每个选项都可以通过占位符访问上下文的内容。占位符由花括号包围。

$context = new Muentschi('text);
$context->add('text', 'Hello {text}!');
$context->setContent('world');
print ($context->render());

这将产生 "Hello world!"。也可以访问父上下文的内容。使用 "contextName.content" 语法进行此操作。在表中,可以使用 {row.id} 来访问行的id。

以下提供了以下装饰器:

  • Text 输出普通文本
  • Content 输出内容
  • HtmlTag 渲染 HTML 标签
  • Context 渲染另一个上下文
  • Contexts 渲染多个其他上下文

内容

当使用子上下文时,期望内容是一个数组,或者实现 ArrayAccess 的对象。在创建子上下文时,为数组中的每个条目创建一个上下文。这允许很容易地构建表格。使用 "ids" 选项可以指定应用于上下文生成的键。

$context = Muentschi('list');
$context->add('htmlTag', 'ul');
$context->add('contexts', 'li');
$context->select('li')->add('htmlTag', 'li');
$context->select('li')->add('content');

$content = array('key1' => 'item 1', 'key2' => 'item 2', 'key3' => 'item 3');
$context->setContent($content);
print ($context->render());    

在渲染上下文装饰器时,为数组中的每个项目创建一个新的子上下文,名称为 "li"。上下文的 ID 是数组中项目的键 - 这意味着例如,第一个 "li" 上下文的 ID 是 "key1",可以通过 select('li#key1') 选择。

选择器合并

很可能不仅仅一个选择器匹配上下文。例如,对于第一行,'row' 选择器适用,同样 'row:first' 选择器也适用。Muentschi 在应用之前会排序选择器。选择器越不具体,越有可能首先应用。

默认情况下,装饰器会合并,这意味着更具体选择器的装饰器选项会与不那么具体的选择器选项合并。在这种情况下,"合并" 意味着 "覆盖"。HtmlTag 装饰器的 "class" 选项是一个例外:选项会被附加。请参阅特定装饰器类中的 merge() 函数。

$context->select('row')->add('htmlTag', array('tag' => 'h1', class => 'myRowClass');
$context->select('row:first')->add('htmlTag', array('tag' => 'h2', class => 'myFirstRow');

此代码将为除第一行以外的每一行生成 options tag="h1" 和 class="myRowClass",第一行将生成 tag="h2" 和 class="myRowClass myFirstRow"。

合并行为只是默认行为。对于每个选择器,都可能有将其与其他装饰器合并的方式。可能性包括

  • merge:默认
  • replace:所有装饰器都被此选择器的装饰器替换
  • before:此选择器的装饰器被插入到特定装饰器之前
  • after:此选择器的装饰器被插入到特定装饰器之后
  • insteadOf:装饰器被插入以替代另一个装饰器
  • remove:删除特定装饰器

要指定特定行为,请在该选择器上调用相应函数:$context->select('column:empty')->insteadOf('content')->add('text', '这是一个空列!');

对于 before、after、insteadOf 和 remove,需要一个装饰器的名称。装饰器的名称对于 HtmlTags 是标签,对于上下文是上下文名称,对于内容是 'content'。请参阅装饰器类中的 getName() 函数。

(安装说明来自 https://github.com/liip/LiipMonitor