Commit 7996c0fb authored by larowlan's avatar larowlan

Issue #2885877 by tim.plunkett, EclipseGc: Add support for per-region...

Issue #2885877 by tim.plunkett, EclipseGc: Add support for per-region attributes to Layout Templates
parent ee0b6ab2
......@@ -5,6 +5,9 @@
* Provides hook implementations for Layout Discovery.
*/
use Drupal\Core\Render\Element;
use Drupal\Core\Template\Attribute;
/**
* Implements hook_help().
*/
......@@ -36,4 +39,12 @@ function layout_discovery_theme() {
function template_preprocess_layout(&$variables) {
$variables['settings'] = isset($variables['content']['#settings']) ? $variables['content']['#settings'] : [];
$variables['layout'] = isset($variables['content']['#layout']) ? $variables['content']['#layout'] : [];
// Create an attributes variable for each region.
foreach (Element::children($variables['content']) as $name) {
if (!isset($variables['content'][$name]['#attributes'])) {
$variables['content'][$name]['#attributes'] = [];
}
$variables['region_attributes'][$name] = new Attribute($variables['content'][$name]['#attributes']);
}
}
......@@ -18,7 +18,7 @@
%}
{% if content %}
<div{{ attributes.addClass(classes) }}>
<div class="layout__region layout__region--content">
<div {{ region_attributes.content.addClass('layout__region', 'layout__region--content') }}>
{{ content.content }}
</div>
</div>
......
......@@ -22,31 +22,31 @@
{% if content %}
<div{{ attributes.addClass(classes) }}>
{% if content.top %}
<div class="layout__region layout__region--top">
<div {{ region_attributes.top.addClass('layout__region', 'layout__region--top') }}>
{{ content.top }}
</div>
{% endif %}
{% if content.first %}
<div class="layout__region layout__region--first">
<div {{ region_attributes.first.addClass('layout__region', 'layout__region--first') }}>
{{ content.first }}
</div>
{% endif %}
{% if content.second %}
<div class="layout__region layout__region--second">
<div {{ region_attributes.second.addClass('layout__region', 'layout__region--second') }}>
{{ content.second }}
</div>
{% endif %}
{% if content.third %}
<div class="layout__region layout__region--third">
<div {{ region_attributes.third.addClass('layout__region', 'layout__region--third') }}>
{{ content.third }}
</div>
{% endif %}
{% if content.bottom %}
<div class="layout__region layout__region--bottom">
<div {{ region_attributes.bottom.addClass('layout__region', 'layout__region--bottom') }}>
{{ content.bottom }}
</div>
{% endif %}
......
......@@ -22,31 +22,31 @@
{% if content %}
<div{{ attributes.addClass(classes) }}>
{% if content.top %}
<div class="layout__region layout__region--top">
<div {{ region_attributes.top.addClass('layout__region', 'layout__region--top') }}>
{{ content.top }}
</div>
{% endif %}
{% if content.first %}
<div class="layout__region layout__region--first">
<div {{ region_attributes.first.addClass('layout__region', 'layout__region--first') }}>
{{ content.first }}
</div>
{% endif %}
{% if content.second %}
<div class="layout__region layout__region--second">
<div {{ region_attributes.second.addClass('layout__region', 'layout__region--second') }}>
{{ content.second }}
</div>
{% endif %}
{% if content.third %}
<div class="layout__region layout__region--third">
<div {{ region_attributes.third.addClass('layout__region', 'layout__region--third') }}>
{{ content.third }}
</div>
{% endif %}
{% if content.bottom %}
<div class="layout__region layout__region--bottom">
<div {{ region_attributes.bottom.addClass('layout__region', 'layout__region--bottom') }}>
{{ content.bottom }}
</div>
{% endif %}
......
......@@ -19,25 +19,25 @@
{% if content %}
<div{{ attributes.addClass(classes) }}>
{% if content.top %}
<div class="layout__region layout__region--top">
<div {{ region_attributes.top.addClass('layout__region', 'layout__region--top') }}>
{{ content.top }}
</div>
{% endif %}
{% if content.first %}
<div class="layout__region layout__region--first">
<div {{ region_attributes.first.addClass('layout__region', 'layout__region--first') }}>
{{ content.first }}
</div>
{% endif %}
{% if content.second %}
<div class="layout__region layout__region--second">
<div {{ region_attributes.second.addClass('layout__region', 'layout__region--second') }}>
{{ content.second }}
</div>
{% endif %}
{% if content.bottom %}
<div class="layout__region layout__region--bottom">
<div {{ region_attributes.bottom.addClass('layout__region', 'layout__region--bottom') }}>
{{ content.bottom }}
</div>
{% endif %}
......
......@@ -22,43 +22,43 @@
{% if content %}
<div{{ attributes.addClass(classes) }}>
{% if content.top %}
<div class="layout__region layout__region--top">
<div {{ region_attributes.top.addClass('layout__region', 'layout__region--top') }}>
{{ content.top }}
</div>
{% endif %}
{% if content.first_above %}
<div class="layout__region layout__region--first-above">
<div {{ region_attributes.first_above.addClass('layout__region', 'layout__region--first-above') }}>
{{ content.first_above }}
</div>
{% endif %}
{% if content.second_above %}
<div class="layout__region layout__region--second-above">
<div {{ region_attributes.second_above.addClass('layout__region', 'layout__region--second-above') }}>
{{ content.second_above }}
</div>
{% endif %}
{% if content.middle %}
<div class="layout__region layout__region--middle">
<div {{ region_attributes.middle.addClass('layout__region', 'layout__region--middle') }}>
{{ content.middle }}
</div>
{% endif %}
{% if content.first_below %}
<div class="layout__region layout__region--first-below">
<div {{ region_attributes.first_below.addClass('layout__region', 'layout__region--first-below') }}>
{{ content.first_below }}
</div>
{% endif %}
{% if content.second_below %}
<div class="layout__region layout__region--second-below">
<div {{ region_attributes.second_below.addClass('layout__region', 'layout__region--second-below') }}>
{{ content.second_below }}
</div>
{% endif %}
{% if content.bottom %}
<div class="layout__region layout__region--bottom">
<div {{ content.bottom.addClass('layout__region', 'layout__region--bottom') }}>
{{ content.bottom }}
</div>
{% endif %}
......
......@@ -14,7 +14,7 @@
<div{{ attributes.addClass(classes) }}>
{% for region in layout.getRegionNames %}
{% if content[region] %}
<div class="{{ 'layout__region layout__region--' ~ region|clean_class }}">
<div {{ region_attributes[region].addClass('layout__region', 'layout__region--' ~ region|clean_class) }}>
{{ content[region] }}
</div>
{% endif %}
......
......@@ -82,7 +82,7 @@ protected function render(array &$elements) {
public function renderLayoutData() {
$html = [];
$html[] = '<div data-drupal-selector="edit-layout" class="layout layout--onecol">';
$html[] = '<div class="layout__region layout__region--content">';
$html[] = '<div data-drupal-selector="edit-content" class="layout__region layout__region--content">';
$html[] = 'This is the content';
$html[] = '</div>';
$html[] = '</div>';
......@@ -98,11 +98,11 @@ public function renderLayoutData() {
];
$html = [];
$html[] = '<div class="layout-example-1col clearfix">';
$html[] = '<div class="region-top">';
$html[] = '<div data-drupal-selector="edit-layout" class="layout-example-1col clearfix">';
$html[] = '<div data-drupal-selector="edit-top" class="region-top">';
$html[] = 'This string added by #process.';
$html[] = '</div>';
$html[] = '<div class="region-bottom">';
$html[] = '<div data-drupal-selector="edit-bottom" class="region-bottom">';
$html[] = 'This is the bottom';
$html[] = '</div>';
$html[] = '</div>';
......@@ -121,11 +121,11 @@ public function renderLayoutData() {
];
$html = [];
$html[] = '<div class="layout-example-1col clearfix">';
$html[] = '<div class="region-top">';
$html[] = '<div data-drupal-selector="edit-layout" class="layout-example-1col clearfix">';
$html[] = '<div data-drupal-selector="edit-top" class="region-top">';
$html[] = 'This is the top';
$html[] = '</div>';
$html[] = '<div class="region-bottom">';
$html[] = '<div data-drupal-selector="edit-bottom" class="region-bottom">';
$html[] = 'This is the bottom';
$html[] = '</div>';
$html[] = '</div>';
......@@ -145,10 +145,10 @@ public function renderLayoutData() {
$html = [];
$html[] = '<div data-drupal-selector="edit-layout" class="layout layout--layout-test-1col-no-template">';
$html[] = '<div class="layout__region layout__region--top">';
$html[] = '<div data-drupal-selector="edit-top" class="layout__region layout__region--top">';
$html[] = 'This is the top';
$html[] = '</div>';
$html[] = '<div class="layout__region layout__region--bottom">';
$html[] = '<div data-drupal-selector="edit-bottom" class="layout__region layout__region--bottom">';
$html[] = 'This is the bottom';
$html[] = '</div>';
$html[] = '</div>';
......@@ -167,11 +167,11 @@ public function renderLayoutData() {
];
$html = [];
$html[] = '<div class="layout-example-2col clearfix">';
$html[] = '<div class="region-left">';
$html[] = '<div data-drupal-selector="edit-layout" class="layout-example-2col clearfix">';
$html[] = '<div data-drupal-selector="edit-left" class="class-added-by-preprocess region-left">';
$html[] = 'This is the left';
$html[] = '</div>';
$html[] = '<div class="region-right">';
$html[] = '<div data-drupal-selector="edit-right" class="region-right">';
$html[] = 'This is the right';
$html[] = '</div>';
$html[] = '</div>';
......@@ -190,12 +190,12 @@ public function renderLayoutData() {
];
$html = [];
$html[] = '<div class="layout-test-plugin clearfix">';
$html[] = '<div data-drupal-selector="edit-layout" class="layout-test-plugin clearfix">';
$html[] = '<div>';
$html[] = '<span class="setting-1-label">Blah: </span>';
$html[] = 'Config value';
$html[] = '</div>';
$html[] = '<div class="region-main">';
$html[] = '<div data-drupal-selector="edit-main" class="region-main">';
$html[] = 'Main region';
$html[] = '</div>';
$html[] = '</div>';
......
<?php
/**
* @file
* Provides hook implementations for Layout Test.
*/
/**
* Implements hook_preprocess_HOOK() for layout templates.
*/
function template_preprocess_layout_test_2col(&$variables) {
$variables['region_attributes']['left']->addClass('class-added-by-preprocess');
}
......@@ -4,11 +4,11 @@
* Template for an example 1 column layout.
*/
#}
<div class="layout-example-1col clearfix">
<div class="region-top">
<div{{ attributes.addClass('layout-example-1col', 'clearfix') }}>
<div {{ region_attributes.top.addClass('region-top') }}>
{{ content.top }}
</div>
<div class="region-bottom">
<div {{ region_attributes.bottom.addClass('region-bottom') }}>
{{ content.bottom }}
</div>
</div>
......@@ -4,11 +4,11 @@
* Template for an example 2 column layout.
*/
#}
<div class="layout-example-2col clearfix">
<div class="region-left">
<div{{ attributes.addClass('layout-example-2col', 'clearfix') }}>
<div {{ region_attributes.left.addClass('region-left') }}>
{{ content.left }}
</div>
<div class="region-right">
<div {{ region_attributes.right.addClass('region-right') }}>
{{ content.right }}
</div>
</div>
......@@ -4,12 +4,12 @@
* Template for layout_test_plugin layout.
*/
#}
<div class="layout-test-plugin clearfix">
<div{{ attributes.addClass('layout-test-plugin', 'clearfix') }}>
<div>
<span class="setting-1-label">Blah: </span>
{{ settings.setting_1 }}
</div>
<div class="region-main">
<div {{ region_attributes.main.addClass('region-main') }}>
{{ content.main }}
</div>
</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