Commit bead76ad authored by webchick's avatar webchick

Issue #1987398 by Nigel_S, Tim Bozeman, InternetDevels, adsw12, joelpittet,...

Issue #1987398 by Nigel_S, Tim Bozeman, InternetDevels, adsw12, joelpittet, Cottser, mdrummond, dsayswhat, jerdavis, rteijeiro, LewisNyman, Rumato, gnuget: Field.module - Convert theme_ functions to Twig.
parent b933a5b4
......@@ -7,46 +7,55 @@
use Drupal\Component\Utility\NestedArray;
use Drupal\Core\Field\FieldDefinitionInterface;
use Drupal\Core\Render\Element;
/**
* Returns HTML for an individual form element.
* Prepares variables for individual form element templates.
*
* Default template: field-multiple-value-form.html.twig.
*
* Combines multiple values into a table with drag-n-drop reordering.
*
* @param $variables
* @param array $variables
* An associative array containing:
* - element: A render element representing the form element.
*
* @ingroup themeable
*
* @todo Convert to a template.
*/
function theme_field_multiple_value_form($variables) {
function template_preprocess_field_multiple_value_form(&$variables) {
$element = $variables['element'];
$output = '';
$variables['multiple'] = $element['#cardinality_multiple'];
if ($element['#cardinality_multiple']) {
$form_required_marker = array('#theme' => 'form_required_marker');
$required = !empty($element['#required']) ? drupal_render($form_required_marker) : '';
if ($variables['multiple']) {
$table_id = drupal_html_id($element['#field_name'] . '_values');
$order_class = $element['#field_name'] . '-delta-order';
$header = array(
array(
'data' => '<h4 class="label">' . t('!title !required', array('!title' => $element['#title'], '!required' => $required)) . "</h4>",
'data' => array(
'#prefix' => '<h4 class="label">',
'title' => array(
'#markup' => t($element['#title']),
),
'#suffix' => '</h4>',
),
'colspan' => 2,
'class' => array('field-label'),
),
t('Order', array(), array('context' => 'Sort order')),
);
if (!empty($element['#required'])) {
$header[0]['data']['required'] = array(
'#theme' => 'form_required_marker',
'#element' => $element,
);
}
$rows = array();
// Sort items according to '_weight' (needed when the form comes back after
// preview or failed validation)
// preview or failed validation).
$items = array();
foreach (element_children($element) as $key) {
$variables['button'] = array();
foreach (Element::children($element) as $key) {
if ($key === 'add_more') {
$add_more_button = &$element[$key];
$variables['button'] = &$element[$key];
}
else {
$items[] = &$element[$key];
......@@ -57,10 +66,15 @@ function theme_field_multiple_value_form($variables) {
// Add the items as table rows.
foreach ($items as $item) {
$item['_weight']['#attributes']['class'] = array($order_class);
$delta_element = drupal_render($item['_weight']);
// Remove weight form element from item render array so it can be rendered
// in a separate table column.
$delta_element = $item['_weight'];
unset($item['_weight']);
$cells = array(
array('data' => '', 'class' => array('field-multiple-drag')),
drupal_render($item),
array('data' => $item),
array('data' => $delta_element, 'class' => array('delta-order')),
);
$rows[] = array(
......@@ -69,7 +83,7 @@ function theme_field_multiple_value_form($variables) {
);
}
$table = array(
$variables['table'] = array(
'#type' => 'table',
'#header' => $header,
'#rows' => $rows,
......@@ -85,19 +99,15 @@ function theme_field_multiple_value_form($variables) {
),
),
);
$output = '<div class="form-item">';
$output .= drupal_render($table);
$output .= $element['#description'] ? '<div class="description">' . $element['#description'] . '</div>' : '';
$output .= '<div class="clearfix">' . drupal_render($add_more_button) . '</div>';
$output .= '</div>';
$variables['description'] = $element['#description'];
}
else {
foreach (element_children($element) as $key) {
$output .= drupal_render($element[$key]);
$variables['elements'] = array();
foreach (Element::children($element) as $key) {
$variables['elements'][] = $element[$key];
}
}
return $output;
}
/**
......
......@@ -5,6 +5,7 @@
*/
use Drupal\Component\Utility\Html;
use Drupal\Component\Utility\String;
use Drupal\Component\Utility\Xss;
use Drupal\Core\Entity\ContentEntityInterface;
use Drupal\Core\Entity\EntityTypeInterface;
......@@ -136,9 +137,12 @@ function field_theme() {
return array(
'field' => array(
'render element' => 'element',
'template' => 'field',
),
'field_multiple_value_form' => array(
'file' => 'field.form.inc',
'render element' => 'element',
'template' => 'field-multiple-value-form',
),
);
}
......@@ -355,14 +359,11 @@ function field_theme_suggestions_field(array $variables) {
function template_preprocess_field(&$variables, $hook) {
$element = $variables['element'];
// There's some overhead in calling check_plain() so only call it if the label
// variable is being displayed. Otherwise, set it to NULL to avoid PHP
// warnings if a theme implementation accesses the variable even when it's
// supposed to be hidden. If a theme implementation needs to print a hidden
// label, it needs to supply a preprocess function that sets it to the
// sanitized element title or whatever else is wanted in its place.
$variables['label_hidden'] = ($element['#label_display'] == 'hidden');
$variables['label'] = check_plain($element['#title']);
// Always set the field label - allow themes to decide whether to display it.
// In addition the label should be rendered but hidden to support screen
// readers.
$variables['label'] = String::checkPlain($element['#title']);
// We want other preprocess functions and the theme implementation to have
// fast access to the field item render arrays. The item render array keys
......@@ -417,7 +418,7 @@ function template_preprocess_field(&$variables, $hook) {
// element in order have them rendered on the desired HTML element (e.g., on
// the <a> element of a field item being rendered as a link). Other field
// formatters leave them within $element['#items'][$delta]['_attributes'] to
// be rendered on the item wrappers provided by theme_field().
// be rendered on the item wrappers provided by field.html.twig.
foreach ($variables['items'] as $delta => $item) {
$variables['item_attributes'][$delta] = !empty($element['#items'][$delta]->_attributes) ? new Attribute($element['#items'][$delta]->_attributes) : clone($default_attributes);
}
......@@ -427,87 +428,6 @@ function template_preprocess_field(&$variables, $hook) {
* @} End of "defgroup field".
*/
/**
* Returns HTML for a field.
*
* This is the default theme implementation to display the value of a field.
* Theme developers who are comfortable with overriding theme functions may do
* so in order to customize this markup. This function can be overridden with
* varying levels of specificity. For example, for a field named 'body'
* displayed on the 'article' content type, any of the following functions will
* override this default implementation. The first of these functions that
* exists is used:
* - THEMENAME_field__body__article()
* - THEMENAME_field__article()
* - THEMENAME_field__body()
* - THEMENAME_field()
*
* Theme developers who prefer to customize templates instead of overriding
* functions may copy the "field.html.twig" from the "modules/field/theme"
* folder of the Drupal installation to somewhere within the theme's folder and
* customize it, just like customizing other Drupal templates such as
* page.html.twig or node.html.twig. However, it takes longer for the server to
* process templates than to call a function, so for websites with many fields
* displayed on a page, this can result in a noticeable slowdown of the website.
* For these websites, developers are discouraged from placing a field.html.twig
* file into the theme's folder, but may customize templates for specific
* fields. For example, for a field named 'body' displayed on the 'article'
* content type, any of the following templates will override this default
* implementation. The first of these templates that exists is used:
* - field--body--article.html.twig
* - field--article.html.twig
* - field--body.html.twig
* - field.html.twig
* So, if the body field on the article content type needs customization, a
* field--body--article.html.twig file can be added within the theme's folder.
* Because it's a template, it will result in slightly more time needed to
* display that field, but it will not impact other fields, and therefore, is
* unlikely to cause a noticeable change in website performance. A very rough
* guideline is that if a page is being displayed with more than 100 fields and
* they are all themed with a template instead of a function, it can add up to
* 5% to the time it takes to display that page. This is a guideline only and
* the exact performance impact depends on the server configuration and the
* details of the website.
*
* @param array $variables
* An associative array containing:
* - label_hidden: A boolean indicating whether to show or hide the field
* label.
* - title_attributes: A string containing the attributes for the title.
* - label: The label for the field.
* - content_attributes: A string containing the attributes for the content's
* div.
* - items: An array of field items.
* - item_attributes: An array of attributes for each item.
* - classes: A string containing the classes for the wrapping div.
* - attributes: A string containing the attributes for the wrapping div.
*
* @see template_preprocess_field()
* @see field.html.twig
*
* @ingroup themeable
*/
function theme_field($variables) {
$output = '';
// Render the label, if it's not hidden.
if (!$variables['label_hidden']) {
$output .= '<div class="field-label"' . $variables['title_attributes'] . '>' . $variables['label'] . '</div>';
}
// Render the items.
$output .= '<div class="field-items"' . $variables['content_attributes'] . '>';
foreach ($variables['items'] as $delta => $item) {
$output .= '<div class="field-item"' . $variables['item_attributes'][$delta] . '>' . drupal_render($item, TRUE) . '</div>';
}
$output .= '</div>';
// Render the top-level DIV.
$output = '<div' . $variables['attributes'] . '>' . $output . '</div>';
return $output;
}
/**
* Assembles a partial entity structure with initial IDs.
*
......
{#
/**
* @file
* Default theme implementation for an individual form element.
*
* Available variables for all fields:
* - multiple: Whether there are multiple instances of the field.
*
* Available variables for single cardinality fields:
* - elements: Form elements to be rendered.
*
* Available variables when there are multiple fields.
* - table: Table of field items.
* - description: Description text for the form element.
* - button: "Add another item" button.
*
* @see template_preprocess_field_multiple_value_form()
*
* @ingroup themeable
*/
#}
{% if multiple %}
<div class="form-item">
{{ table }}
{% if description %}
<div class="description">{{ description }}</div>
{% endif %}
{% if button %}
<div class="clearfix">{{ button }}</div>
{% endif %}
</div>
{% else %}
{% for element in elements %}
{{ element }}
{% endfor %}
{% endif %}
......@@ -25,17 +25,10 @@
* - item_attributes: List of HTML attributes for each item.
*
* @see template_preprocess_field()
* @see theme_field()
*
* @ingroup themeable
*/
#}
<!--
THIS FILE IS NOT USED AND IS HERE AS A STARTING POINT FOR CUSTOMIZATION ONLY.
See http://api.drupal.org/api/function/theme_field/8 for details.
After copying this file to your theme's folder and customizing it, remove this
HTML comment.
-->
<div{{ attributes }}>
{% if not label_hidden %}
<div class="field-label"{{ title_attributes }}>{{ label }}:&nbsp;</div>
......
......@@ -6,6 +6,7 @@
*/
use Drupal\Core\Template\RenderWrapper;
use Drupal\Core\Template\Attribute;
/**
* Implements hook_preprocess_HOOK() for page templates.
......@@ -145,27 +146,22 @@ function bartik_menu_tree__shortcut_default($variables) {
}
/**
* Implements theme_field__field_type().
* Implements theme_preprocess_HOOK() for field templates.
*
* @see template_preprocess_field()
*/
function bartik_field__taxonomy_term_reference($variables) {
$output = '';
// Render the label either as a visible list or make it visually hidden for accessibility.
$hidden_class = empty($variables['label_hidden']) ? '' : ' visually-hidden';
$output .= '<h3 class="field-label' . $hidden_class . '">' . $variables['label'] . ': </h3>';
// Render the items.
$output .= ($variables['element']['#label_display'] == 'inline') ? '<ul class="links inline">' : '<ul class="links">';
foreach ($variables['items'] as $delta => $item) {
$output .= '<li class="taxonomy-term-reference-' . $delta . '"' . $variables['item_attributes'][$delta] . '>' . drupal_render($item) . '</li>';
function bartik_preprocess_field(&$variables) {
$element = $variables['element'];
if ($element['#field_type'] == 'taxonomy_term_reference') {
$label_attributes['class'] = array('field-label');
if ($variables['label_hidden']) {
$label_attributes['class'][] = 'visually-hidden';
}
if ($variables['element']['#label_display'] == 'inline') {
$label_attributes['class'][] = 'inline';
}
$variables['label_attributes'] = new Attribute($label_attributes);
}
$output .= '</ul>';
// Render the top-level DIV.
$variables['attributes']['class'][] = 'clearfix';
$output = '<div ' . $variables['attributes'] . '>' . $output . '</div>';
return $output;
}
/**
......
{#
/**
* @file
* Bartik theme override for taxonomy term fields.
*
* Available variables:
* - attributes: HTML attributes for the containing element.
* - label_hidden: Whether the field label has been set to hidden.
* - label_attributes: HTML attributes for the label.
* - label: The label for the field.
* - content_attributes: HTML attributes for the content.
* - items: List of all the field items.
* - item_attributes: HTML attributes for each item.
*
* @see template_preprocess_field()
* @see bartik_preprocess_field()
*
* @ingroup themeable
*/
#}
<div class="{{ attributes.class }} clearfix"{{ attributes }}>
<h3{{ label_attributes }}>{{ label }}: </h3>
<ul class="links">
{% for delta, item in items %}
<li class="taxonomy-term-reference-{{ delta }}"{{ item_attributes[delta] }}>{{ item }}</li>
{% endfor %}
</ul>
</div>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment