39
Render API Виктория Султановская [email protected] Render API

The render api

Embed Size (px)

Citation preview

Page 1: The render api

Render API

Виктория Султановская[email protected]

Render API

Page 2: The render api

2

Render API Что такое Render API

Концепция Render Arrays

Преимущества подхода

Ключевые свойства

Работа функций render(), drupal_render() и drupal_render_children()

Рендеринг страницы

Render API и темизация

Render API

Page 3: The render api

3

Что такое Render API

Render API

Page 4: The render api

4

Что такое Render API

Render API

Page 5: The render api

5

Что такое Render API/** * Drupal 6 page callback * @return string */function mymodule_drupal6_page() { $items = mymodule_get_items(); $output = theme('mymodule_items', $items); $output .= theme('pager'); return $output;}

Render API

Page 6: The render api

6

Что такое Render API/**

* Drupal 7 page callback

* @return array

*/

function mymodule_drupal7_page() {

$items = mymodule_get_items();

...

$output[] = array(

'#theme' => 'mymodule_items', '#items' => $items

);

$output[] = array(

'#theme' => 'pager'

);

...

return $output;

}

Render API

Page 7: The render api

7

Концепция Render Arrays

Рендер массив Рендеринг

Render API

Page 8: The render api

8

Концепция Render Arrays

Страница в Drupal 7

Render API

Page 9: The render api

9

Преимущества подхода

- Модули могут внести свои изменения в отдаваемый контент.

- Единая система формирования контента

Render API

Page 10: The render api

10

Ключевые свойства#typehook_element_info()

(link, radio,

checkbox)

#theme имя вызываемой функции темизацииФункция должна отрендерить все дочерние элементы

Render API

Page 11: The render api

11

Ключевые свойства

#theme_wrappers Обрабатывается после #theme

Это позволяет дополнительно обернуть дочерние элементы нужными нам тегами

<form>

<input type=”checkbox”/>

<input type=”text”/>

</form>

Render API

Page 12: The render api

12

Ключевые свойства

#theme_wrappers

<form>

<div class=”extra-container”>

<input type=”checkbox”/>

<input type=”text”/>

</div>

</form>

Render API

Page 13: The render api

13

Ключевые свойства #attached js

css

libraries

function

Render API

Page 14: The render api

14

Ключевые свойства//attach internal resources

$build['#attached'] = array(

'js' => $module_path . '/block.js',

'css' => $module_path . '/block.css',

'library' => array(

array('system', 'drupal.ajax')

)

);

Render API

Page 15: The render api

15

Ключевые свойства//attach external resources

$build['#attached']['js'][] = array(

'http://code.jquery.com/jquery.min.js' =>

array('type ' => 'external')

);

Render API

Page 16: The render api

16

Ключевые свойства//attach function $build['#attached']['drupal_add_http_header'] = array(

array('Content-Type', 'application/rss-xml; charset = utf-8')

);

Render API

Page 17: The render api

17

Ключевые свойства

#attacheddrupal_add_js()

drupal_add_css()

Render API

Page 18: The render api

18

Ключевые свойства #cache: настройки кэширования

элемента Возможность кэширования отдельных частей

страницы

Свойства:

keys / cid – ключ кэша

granularity – кэш по роли, юзеру, странице

expire – время жизни

bin – хранилище (таблица cache по умолчанию)

Render API

Page 19: The render api

19

Ключевые свойства

#states – условия изменения состояния

состояния - enabled/disabled, visible/invisible, …

условия - empty/filled, checked, value …

Render API

Page 20: The render api

20

Ключевые свойства#states

Render API

Page 21: The render api

21

Ключевые свойства#states

Render API

Page 22: The render api

22

Ключевые свойства

banner_display_type

show_banner_imageshow_banner_html

Render API

Page 23: The render api

23

Ключевые свойства/**

* Implement hook_form

*/

$form['banner_html']['#states'] = array(

'visible' => array(

':input[name="banner_display_type"]' => array('value' => 'show_banner_html')

)

);

Render API

Page 24: The render api

24

Ключевые свойства

/**

* Implement hook_form

*/ $form['banner_image']['#states'] = array(

//banner_image - fieldset

'visible' => array(

':input[name="banner_display_type"]' => array('value' => 'show_banner_image')

)

);

);

Render API

Page 25: The render api

25

Ключевые свойства

#pre_render/#post_render преобработка/постобработка (содержат массив функций, которые будут вызваны перед/после рендеринга массива)

#prefix/#suffix

#printed

#access

Render API

Page 26: The render api

26

drupal_render()render()drupal_render_children()

Render API

Page 27: The render api

27

Этапы работы drupal_render()

- #access и #pinted

- загрузка свойств по-умолчанию (если указан #type)

- #pre_render

- #theme

- #theme_wrappers

Render API

Page 28: The render api

28

Этапы работы drupal_render() - #post_render

- #states

- #attached

- #cache

- Возвращает

#prefix.$output.#suffix

Render API

Page 29: The render api

29

Рендеринг страницы - Все элементы страницы собраны в

рендер массиве

- Можно изменить страницу с помощью двух хуков hook_page_build() - дает возможность добавить элементы на страницу

- hook_page_alter() - дает возможность изменить уже существующие элементы

Render API

Page 30: The render api

30

Render API и темизация

- Для обработки рендер-массивов в шаблоне нужно использовать drupal_render()/render().

- hide()/show() - управляют видимостью элемента в рендер-массиве.

Render API

Page 31: The render api

31

Render API и темизация<!-- node.tpl.php -->

<div class="content"<?php print $content_attributes;?>>

<?php

// We hide the comments and links now so that we can render them later.

hide($content['comments']);

hide($content['links']);

print render($content);

?>

</div>

<?php print render($content['links']); ?>

<?php print render($content['comments']); ?>

Render API

Page 32: The render api

32

Render API и темизация

- В Drupal 7 есть два вида передачи данных в функцию темизации

properties-as-variable

element-as-variable

Render API

Page 33: The render api

33

Render API и темизацияfunction mymodule_theme() {

return array(

//properties-as-variable

'mymodule_items' => array(

'variables' => array(

'items' => array(),

'title' => ''

)

)

);

}

Render API

Page 34: The render api

34

Render API и темизация

function theme_mymodule_items($vars){

$items = $vars['items'];

$title = $vars['title'];

}

properties-as-variable

Render API

Page 35: The render api

35

Render API и темизация

function mymodule_theme() {

return array(

//element-as-variable

'mymodule_element' => array(

'render_element' => 'items'

)

);

}

Render API

Page 36: The render api

36

element-as-variable

function theme_mymodule_element($vars){

$element = $vars['item'];

$items = $element['items'];

$title = $element['title'];

}

Render API

Render API и темизация

Page 37: The render api

37

Вывод

Render API - позволяет сделать код

- быстрым (благодаря #cache),

- прозрачным и понятным (благодаря концепции рендер-массивов)

- удобным (благодаря #states, #attached)

Render API

Page 38: The render api

38

ВопросыRender API

Page 39: The render api

Render API

Виктория Султановская[email protected]