Skip to content

Commit

Permalink
[FEATURE] PageLayoutModul - Child rendering reorganice
Browse files Browse the repository at this point in the history 
Reorganize child rendering to support repeatable sections and differ between
BeLayout usage or good old table for childs.
This is backwards compatible, a better solution is in need but not now.

Related: #379
Release: 8.0.0
  • Loading branch information
Alexander Opitz committed May 29, 2022
1 parent d74658a commit da173d8
Show file tree
Hide file tree
Showing 4 changed files with 214 additions and 121 deletions.
3 changes: 3 additions & 0 deletions Resources/Private/Partials/Backend/Handler/DoktypeDefaultHandler/Node.html
View file
Expand Up @@ -36,6 +36,9 @@
<div class="card-body">
<f:render partial="Backend/Handler/DoktypeDefaultHandler/Node/TypeInformation" arguments="{node: node}" />
<f:if condition="{f:count(subject: node.childNodes.sDEF)} > 0">
<f:if condition="{node.rendering.beLayout}">
<f:variable name="beLayout" value="{node.rendering.beLayout}" />
</f:if>
<f:render partial="Backend/Handler/DoktypeDefaultHandler/Node/Childs" arguments="{node: node, beLayout: beLayout}" />
</f:if>
<div class="tvp-edit-record">
Expand Down
124 changes: 3 additions & 121 deletions Resources/Private/Partials/Backend/Handler/DoktypeDefaultHandler/Node/Childs.html
View file
@@ -1,128 +1,10 @@
{namespace tvp=Tvp\TemplaVoilaPlus\ViewHelpers}


<f:if condition="{node.childNodes.sDEF.lDEF}">
<f:render section="renderChildElements" arguments="{fieldConfig: '{node.datastructure.sheets.sDEF.ROOT.el}', childElements: '{node.childNodes.sDEF.lDEF}', childFlexformData: '{node.flexform.data.sDEF.lDEF}'}" />
</f:if>

<f:section name="renderSubFields">
<f:for each="{fieldConfig}" key="fieldKey" as="subFieldConfig">
<f:if condition="!{childElements.{fieldKey}}">
<f:then>
<strong>
<f:if condition="{subFieldConfig.TCEforms.label}">
<f:then>
<f:translate key="{subFieldConfig.TCEforms.label}" default="{subFieldConfig.TCEforms.label}" />
</f:then>
<f:else>
<f:if condition="{subFieldConfig.title}">
<f:translate key="{subFieldConfig.title}" default="{subFieldConfig.title}" />
</f:if>
</f:else>
</f:if>
</strong>
<f:format.crop maxCharacters="2000">
<tvp:format.wordLength maxCharacters="75">
<tvp:format.stripTags whitespace="true">{childFlexformData.{fieldKey}.vDEF}</tvp:format.stripTags>
</tvp:format.wordLength>
</f:format.crop><br/>
</f:then>>
</f:if>
</f:for>
</f:section>

<f:section name="renderChildElements">
<f:for each="{fieldConfig}" key="fieldKey" as="subFieldConfig">

<f:if condition="{childElements.{fieldKey}}">
<tvp:arrayVariable name="layoutHeaders" key="{fieldKey}">
<strong>
<f:if condition="{subFieldConfig.TCEforms.label}">
<f:then>
<f:translate key="{subFieldConfig.TCEforms.label}" default="{subFieldConfig.TCEforms.label}" />
</f:then>
<f:else>
<f:if condition="{subFieldConfig.title}">
<f:translate key="{subFieldConfig.title}" default="{subFieldConfig.title}" />
</f:if>
</f:else>
</f:if>
</strong>
</tvp:arrayVariable>
</f:if>
<f:if condition="{subFieldConfig.type} == 'array'">
<f:then>
<f:if condition="{subFieldConfig.section}">
<f:then>
<f:variable name="subFlexFormData" value="{childFlexformData.{fieldKey}.el}" />
<tvp:arrayVariable name="layoutFields" key="{fieldKey}">
{f:variable(name: 'countWhat', value: '{childElements.{fieldKey}}')}
{f:variable(name: 'count', value: '{f:count(subject: countWhat)}')}
{f:variable(name: 'cellWidth', value: '{100 / count}')}
<table class="table tvp-childs-table table-secondary">
<tr>
<f:for each="{childElements.{fieldKey}}" key="dataKey" as="sectionFieldElements">
<td id="cell{node.rendering.md5}_{layoutKey}" width="{cellWidth}%">
<f:render section="renderChildElements" arguments="{fieldConfig: subFieldConfig.el, childElements: sectionFieldElements, childFlexformData: '{subFlexFormData.{dataKey}}'}" />
</td>
</f:for>
</tr>
</table>
</tvp:arrayVariable>
</f:then>
<f:else>
<f:variable name="subFlexFormData" value="{childFlexformData.{fieldKey}.el}" />
<tvp:arrayVariable name="layoutFields" key="{fieldKey}">
<f:render section="renderChildElements" arguments="{fieldConfig: subFieldConfig.el, childElements: '{childElements.{fieldKey}}', childFlexformData: '{childFlexformData.{fieldKey}.el}'}" />
<f:render section="renderSubFields" arguments="{fieldConfig: subFieldConfig.el, childElements: '{childElements.{fieldKey}}', childFlexformData: '{childFlexformData.{fieldKey}.el}'}" />
</tvp:arrayVariable>
</f:else>
</f:if>
</f:then>
<f:else>
<f:if condition="{childElements.{fieldKey}}">
<f:then>
<tvp:arrayVariable name="layoutFields" key="{fieldKey}">
<f:for each="{childElements.{fieldKey}.vDEF}" as="element">
<f:render partial="Backend/Handler/DoktypeDefaultHandler/Node" arguments="{node: element.node}" />
</f:for>
</tvp:arrayVariable>
</f:then>
</f:if>
</f:else>
</f:if>
</f:for>

<f:if condition="{beLayout}">
<f:then>
<f:for each="{layoutFields}" key="layoutKey" as="_unused">
<tvp:arrayVariable name="layoutComplete" key="{layoutKey}">
<div class="t3-page-column-header">
<div class="t3-page-column-header-label"><f:format.raw>{layoutHeaders.{layoutKey}}</f:format.raw></div>
</div>
<div class="t3-page-ce-wrapper"><f:format.raw>{layoutFields.{layoutKey}}</f:format.raw></div>
</tvp:arrayVariable>
</f:for>
<tvp:renderLayout combinedConfigurationIdentifier="{beLayout}" arguments="{layoutComplete}" />
<f:render partial="Backend/Handler/DoktypeDefaultHandler/Node/ChildsBeLayouts" section="renderChildElements" arguments="{fieldConfig: '{node.datastructure.sheets.sDEF.ROOT.el}', childElements: '{node.childNodes.sDEF.lDEF}', childFlexformData: '{node.flexform.data.sDEF.lDEF}', beLayout: beLayout, subpart: 'CHILD'}" />
</f:then>
<f:else>
{f:variable(name: 'count', value: '{f:count(subject: layoutHeaders)}')}
{f:variable(name: 'cellWidth', value: '{100 / count}')}
<table class="tvp-childs-table">
<tr>
<f:for each="{layoutHeaders}" as="layoutHeader">
<td width="{cellWidth}%"><f:format.raw>{layoutHeader}</f:format.raw></td>
</f:for>
</tr>
<tr>
<f:for each="{layoutFields}" key="layoutKey" as="layoutField">
<td id="cell{node.rendering.md5}_{layoutKey}" width="{cellWidth}%" data-parent-pointer="{node.raw.table}:{node.raw.entity.uid}:sDEF:lDEF:{layoutKey}:vDEF"><f:format.raw>{layoutField}</f:format.raw></td>
</f:for>
</tr>
</table>
<f:render partial="Backend/Handler/DoktypeDefaultHandler/Node/ChildsTable" section="renderChildElements" arguments="{fieldConfig: '{node.datastructure.sheets.sDEF.ROOT.el}', childElements: '{node.childNodes.sDEF.lDEF}', childFlexformData: '{node.flexform.data.sDEF.lDEF}', subpart: 'CHILD'}" />
</f:else>
</f:if>
</f:section>

<f:section name="renderField">
</f:section>
</f:if>
104 changes: 104 additions & 0 deletions Resources/Private/Partials/Backend/Handler/DoktypeDefaultHandler/Node/ChildsBeLayouts.html
View file
@@ -0,0 +1,104 @@
{namespace tvp=Tvp\TemplaVoilaPlus\ViewHelpers}

<f:section name="renderSubFields">
<f:for each="{fieldConfig}" key="fieldKey" as="subFieldConfig">
<f:if condition="!{childElements.{fieldKey}}">
<f:then>
</f:then>>
</f:if>
</f:for>
</f:section>

<f:section name="renderChildElements">
<f:for each="{fieldConfig}" key="fieldKey" as="subFieldConfig">

<f:if condition="{childElements.{fieldKey}}">
<tvp:arrayVariable name="layoutHeaders" key="{fieldKey}">
<strong>
<f:if condition="{subFieldConfig.TCEforms.label}">
<f:then>
<f:translate key="{subFieldConfig.TCEforms.label}" default="{subFieldConfig.TCEforms.label}" />
</f:then>
<f:else>
<f:if condition="{subFieldConfig.title}">
<f:translate key="{subFieldConfig.title}" default="{subFieldConfig.title}" />
</f:if>
</f:else>
</f:if>
</strong>
</tvp:arrayVariable>
</f:if>
<f:if condition="{subFieldConfig.type} == 'array'">
<f:then>
<f:if condition="{subFieldConfig.section}">
<f:then>
<f:variable name="subFlexFormData" value="{childFlexformData.{fieldKey}.el}" />
<tvp:arrayVariable name="layoutFields" key="{fieldKey}">
<f:for each="{childElements.{fieldKey}}" key="dataKey" as="sectionFieldElements">
<f:render section="renderChildElements" arguments="{fieldConfig: subFieldConfig.el, childElements: sectionFieldElements, childFlexformData: '{subFlexFormData.{dataKey}}', beLayout: beLayout, subpart: '{subpart}.{fieldKey}', addIdentKey: '{dataKey}'}" />
</f:for>
</tvp:arrayVariable>
</f:then>
<f:else>
<f:variable name="subFlexFormData" value="{childFlexformData.{fieldKey}.el}" />
<tvp:arrayVariable name="layoutFields" key="{fieldKey}">
<f:render section="renderChildElements" arguments="{fieldConfig: subFieldConfig.el, childElements: '{childElements.{fieldKey}}', childFlexformData: '{childFlexformData.{fieldKey}.el}', beLayout: beLayout, subpart: '{subpart}.{fieldKey}', addIdentKey: '{addIdentKey}'}" />
</tvp:arrayVariable>
</f:else>
</f:if>
</f:then>
<f:else>
<f:if condition="{childElements.{fieldKey}}">
<f:then>
<tvp:arrayVariable name="layoutFields" key="{fieldKey}">
<f:for each="{childElements.{fieldKey}.vDEF}" as="element">
<f:render partial="Backend/Handler/DoktypeDefaultHandler/Node" arguments="{node: element.node}" />
</f:for>
</tvp:arrayVariable>
</f:then>
<f:else>
<tvp:arrayVariable name="layoutHeaders" key="{fieldKey}">
<strong>
<f:if condition="{subFieldConfig.TCEforms.label}">
<f:then>
<f:translate key="{subFieldConfig.TCEforms.label}" default="{subFieldConfig.TCEforms.label}" />
</f:then>
<f:else>
<f:if condition="{subFieldConfig.title}">
<f:translate key="{subFieldConfig.title}" default="{subFieldConfig.title}" />
</f:if>
</f:else>
</f:if>
</strong>
</tvp:arrayVariable>

<tvp:arrayVariable name="layoutFields" key="{fieldKey}">
<f:format.crop maxCharacters="2000">
<tvp:format.wordLength maxCharacters="75">
<tvp:format.stripTags whitespace="true">{childFlexformData.{fieldKey}.vDEF}</tvp:format.stripTags>
</tvp:format.wordLength>
</f:format.crop><br/>
</tvp:arrayVariable>
</f:else>
</f:if>
</f:else>
</f:if>
</f:for>

<f:for each="{layoutFields}" key="layoutKey" as="_unused">
<tvp:arrayVariable name="layoutComplete" key="{layoutKey}">
<div class="t3-page-column-header">
<div class="t3-page-column-header-label"><f:format.raw>{layoutHeaders.{layoutKey}}</f:format.raw></div>
</div>
<div class="t3-page-ce-wrapper"><f:format.raw>{layoutFields.{layoutKey}}</f:format.raw></div>
</tvp:arrayVariable>
<tvp:arrayVariable name="layoutComplete" key="{layoutKey}_plain">{layoutFields.{layoutKey}}</tvp:arrayVariable>
</f:for>

<f:if condition="{addIdentKey}">
<tvp:arrayVariable name="layoutComplete" key="IDENT">{addIdentKey}</tvp:arrayVariable>
</f:if>

<tvp:renderLayout combinedConfigurationIdentifier="{beLayout}" arguments="{layoutComplete}" subpart="{subpart}"/>
</f:section>

104 changes: 104 additions & 0 deletions Resources/Private/Partials/Backend/Handler/DoktypeDefaultHandler/Node/ChildsTable.html
View file
@@ -0,0 +1,104 @@
{namespace tvp=Tvp\TemplaVoilaPlus\ViewHelpers}

<f:section name="renderSubFields">
<f:for each="{fieldConfig}" key="fieldKey" as="subFieldConfig">
<f:if condition="!{childElements.{fieldKey}}">
<f:then>
<strong>
<f:if condition="{subFieldConfig.TCEforms.label}">
<f:then>
<f:translate key="{subFieldConfig.TCEforms.label}" default="{subFieldConfig.TCEforms.label}" />
</f:then>
<f:else>
<f:if condition="{subFieldConfig.title}">
<f:translate key="{subFieldConfig.title}" default="{subFieldConfig.title}" />
</f:if>
</f:else>
</f:if>
</strong>
<f:format.crop maxCharacters="2000">
<tvp:format.wordLength maxCharacters="75">
<tvp:format.stripTags whitespace="true">{childFlexformData.{fieldKey}.vDEF}</tvp:format.stripTags>
</tvp:format.wordLength>
</f:format.crop><br/>
</f:then>>
</f:if>
</f:for>
</f:section>

<f:section name="renderChildElements">
<f:for each="{fieldConfig}" key="fieldKey" as="subFieldConfig">

<f:if condition="{childElements.{fieldKey}}">
<tvp:arrayVariable name="layoutHeaders" key="{fieldKey}">
<strong>
<f:if condition="{subFieldConfig.TCEforms.label}">
<f:then>
<f:translate key="{subFieldConfig.TCEforms.label}" default="{subFieldConfig.TCEforms.label}" />
</f:then>
<f:else>
<f:if condition="{subFieldConfig.title}">
<f:translate key="{subFieldConfig.title}" default="{subFieldConfig.title}" />
</f:if>
</f:else>
</f:if>
</strong>
</tvp:arrayVariable>
</f:if>
<f:if condition="{subFieldConfig.type} == 'array'">
<f:then>
<f:if condition="{subFieldConfig.section}">
<f:then>
<f:variable name="subFlexFormData" value="{childFlexformData.{fieldKey}.el}" />
<tvp:arrayVariable name="layoutFields" key="{fieldKey}">
{f:variable(name: 'countWhat', value: '{childElements.{fieldKey}}')}
{f:variable(name: 'count', value: '{f:count(subject: countWhat)}')}
{f:variable(name: 'cellWidth', value: '{100 / count}')}
<table class="table tvp-childs-table table-secondary">
<tr>
<f:for each="{childElements.{fieldKey}}" key="dataKey" as="sectionFieldElements">
<td id="cell{node.rendering.md5}_{layoutKey}" width="{cellWidth}%">
<f:render section="renderChildElements" arguments="{fieldConfig: subFieldConfig.el, childElements: sectionFieldElements, childFlexformData: '{subFlexFormData.{dataKey}}', beLayout: beLayout, subpart: '{subpart}.{fieldKey}'}" />
</td>
</f:for>
</tr>
</table>
</tvp:arrayVariable>
</f:then>
<f:else>
<f:variable name="subFlexFormData" value="{childFlexformData.{fieldKey}.el}" />
<tvp:arrayVariable name="layoutFields" key="{fieldKey}">
<f:render section="renderChildElements" arguments="{fieldConfig: subFieldConfig.el, childElements: '{childElements.{fieldKey}}', childFlexformData: '{childFlexformData.{fieldKey}.el}', beLayout: beLayout, subpart: '{subpart}.{fieldKey}'}" />
<f:render section="renderSubFields" arguments="{fieldConfig: subFieldConfig.el, childElements: '{childElements.{fieldKey}}', childFlexformData: '{childFlexformData.{fieldKey}.el}'}" />
</tvp:arrayVariable>
</f:else>
</f:if>
</f:then>
<f:else>
<f:if condition="{childElements.{fieldKey}}">
<f:then>
<tvp:arrayVariable name="layoutFields" key="{fieldKey}">
<f:for each="{childElements.{fieldKey}.vDEF}" as="element">
<f:render partial="Backend/Handler/DoktypeDefaultHandler/Node" arguments="{node: element.node}" />
</f:for>
</tvp:arrayVariable>
</f:then>
</f:if>
</f:else>
</f:if>
</f:for>
{f:variable(name: 'count', value: '{f:count(subject: layoutHeaders)}')}
{f:variable(name: 'cellWidth', value: '{100 / count}')}
<table class="tvp-childs-table">
<tr>
<f:for each="{layoutHeaders}" as="layoutHeader">
<td width="{cellWidth}%"><f:format.raw>{layoutHeader}</f:format.raw></td>
</f:for>
</tr>
<tr>
<f:for each="{layoutFields}" key="layoutKey" as="layoutField">
<td id="cell{node.rendering.md5}_{layoutKey}" width="{cellWidth}%" data-parent-pointer="{node.raw.table}:{node.raw.entity.uid}:sDEF:lDEF:{layoutKey}:vDEF"><f:format.raw>{layoutField}</f:format.raw></td>
</f:for>
</tr>
</table>
</f:section>

0 comments on commit da173d8

Please sign in to comment.