[TASK] Grid Partials

* use createNewContent label * rename partial folders
b13 · Jul 12, 2024 · 4a23465 · 4a23465
1 parent b513c13
commit 4a23465
Show file tree

Hide file tree

Showing 10 changed files with 166 additions and 156 deletions.
diff --git a/Classes/Tca/ContainerConfiguration.php b/Classes/Tca/ContainerConfiguration.php
@@ -89,10 +89,10 @@ public function __construct(
         $this->label = $label;
         $this->description = $description;
         $this->grid = $grid;
-        if ((GeneralUtility::makeInstance(Typo3Version::class))->getMajorVersion() > 11) {
+        if ((GeneralUtility::makeInstance(Typo3Version::class))->getMajorVersion() === 11) {
             $this->gridPartialPaths = [
                 'EXT:backend/Resources/Private/Partials/',
-                'EXT:container/Resources/Private/Partials12/',
+                'EXT:container/Resources/Private/Partials11/',
             ];
         }
     }

diff --git a/Resources/Private/Partials/PageLayout/Grid/Column.html b/Resources/Private/Partials/PageLayout/Grid/Column.html
@@ -1,73 +1,26 @@
-<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
-      xmlns:core="http://typo3.org/ns/TYPO3/CMS/Core/ViewHelpers"
-      data-namespace-typo3-fluid="true">
-<f:comment>remove class t3-grid-cell (for tests)</f:comment>
-<f:comment>change data-colpos attr</f:comment>
+<f:comment>
+    Styling requires the colpos to be set to the string 'unused'. To preserve type safety in the
+    controller, the string is only used in the template by setting the below "colpos" variable.
+</f:comment>
+<f:variable name="colpos" value="{f:if(condition: column.unused, then: 'unused', else: column.columnNumber)}"/>
+
 <td valign="top" colspan="{column.colSpan}" rowspan="{column.rowSpan}"
-    data-colpos="{column.containerUid}-{column.columnNumber}" data-language-uid="{column.context.siteLanguage.languageId}"
-    class="t3-grid-cell t3js-page-lang-column-{column.context.siteLanguage.languageId} t3js-page-column t3-page-column t3-page-column-{column.columnNumber}
-        {f:if(condition: column.active, else: 't3-grid-cell-unassigned')}
+    data-colpos="{column.columnNumber}" data-tx-container-parent="{column.containerUid}" data-language-uid="{column.context.siteLanguage.languageId}"
+    class="t3js-page-lang-column-{column.context.siteLanguage.languageId} t3js-page-column t3-grid-cell t3-page-column t3-page-column-{colpos}
+        {f:if(condition: column.unassigned, then: 't3-grid-cell-unassigned')}
+        {f:if(condition: '!{column.active} && !{column.unused}', then: 't3-grid-cell-restricted')}
+        {f:if(condition: '!{column.active} && {hideRestrictedColumns} && !{column.unused}', then: 't3-grid-cell-hidden')}
         t3-gridCell-width{column.colSpan}
         t3-gridCell-height{column.rowSpan}">
-    <div class="t3-page-column-header">
-        <f:if condition="{column.active}">
-            <f:then>
-                <div class="t3-page-column-header-icons">
-                    <f:if condition="{allowEditContent} && {column.editUrl}">
-                        <a href="{column.editUrl}" title="{column.editLinkTitle}"><core:icon identifier="actions-document-open" /></a>
-                    </f:if>
-                </div>
-                {column.title}
-            </f:then>
-            <f:else if="{column.unassigned}">
-                {column.title} (<f:format.raw>{column.titleUnassigned}</f:format.raw>)
-            </f:else>
-            <f:else if="!{hideRestrictedColumns}">
-                <f:format.raw>{column.titleInaccessible}</f:format.raw>
-            </f:else>
-            <f:else>
-                <f:format.raw>{column.titleInaccessible}</f:format.raw>
-            </f:else>
-        </f:if>
-    </div>
-    <f:comment>use column.allowNewContent instead of pageContext</f:comment>
-    <f:if condition="{allowEditContent} && {column.contentEditable} && {column.allowNewContent}">
-        <div class="t3-page-ce t3js-page-ce" data-page="{column.context.pageId}" id="{column.uniqueId}">
-            <div class="t3js-page-new-ce t3-page-ce-wrapper-new-ce" id="colpos-{column.columnNumber}-page-{column.context.pageId}-{column.uniqueId}">
-                <a href="{column.newContentUrl}" title="{newContentTitle}" data-title="{newContentTitle}"
-                    class="btn btn-default btn-sm t3js-toggle-new-content-element-wizard disabled">
-                    <core:icon identifier="actions-add" />
-                    {newContentTitleShort}
-                </a>
-            </div>
-            <div class="t3-page-ce-dropzone-available t3js-page-ce-dropzone-available"></div>
-        </div>
-    </f:if>
-    <f:if condition="{column.unassigned}">
-        <div class="t3-page-ce">
-            <div class="t3-page-ce-header">Empty Colpos</div>
-            <div class="t3-page-ce-body">
-                <div class="t3-page-ce-body-inner">
-                    <div class="row">
-                        <div class="col-xs-12">
-                            This column has no "colPos". This is only for display Purposes.
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </f:if>
-    <f:if condition="{column.items}">
-        <f:comment>change data-colpos attr</f:comment>
-        <div data-colpos="{column.containerUid}-{column.columnNumber}" data-language-uid="{column.context.siteLanguage.languageId}"
-            class="t3js-sortable t3js-sortable-lang t3js-sortable-lang-{column.context.siteLanguage.languageId} t3-page-ce-wrapper
-                {f:if(condition: column.items, else: 't3-page-ce-empty')}">
+    <f:render partial="PageLayout/Grid/ColumnHeader" arguments="{_all}" />
+    <f:if condition="{column.active} || {column.unused}">
+        <div data-colpos="{column.columnNumber}" data-language-uid="{column.context.siteLanguage.languageId}"
+             class="t3js-sortable t3js-sortable-lang t3js-sortable-lang-{column.context.siteLanguage.languageId} t3-page-ce-wrapper
+            {f:if(condition: column.items, else: 't3-page-ce-empty')}">
             <f:for each="{column.items}" as="item">
-                <f:if condition="{item.deletePlaceholder} == 0">
-                    <f:render partial="PageLayout/Record" arguments="{_all}" />
-                </f:if>
+                <f:render partial="PageLayout/Record" arguments="{_all}" />
             </f:for>
         </div>
     </f:if>
+    <f:format.raw>{column.afterSectionMarkup}</f:format.raw>
 </td>
-</html>
diff --git a/...tials12/PageLayout/Grid/ColumnHeader.html → ...artials/PageLayout/Grid/ColumnHeader.html b/...tials12/PageLayout/Grid/ColumnHeader.html → ...artials/PageLayout/Grid/ColumnHeader.html
@@ -26,7 +26,7 @@
             <typo3-backend-new-content-element-wizard-button url="{column.newContentUrl}" subject="{newContentTitle}">
                 <button type="button" class="btn btn-default btn-sm">
                     <core:icon identifier="actions-add" />
-                    {newContentTitleShort}
+                    <f:translate key="LLL:EXT:backend/Resources/Private/Language/locallang_layout.xlf:createNewContent" />
                 </button>
             </typo3-backend-new-content-element-wizard-button>
         </div>

diff --git a/Resources/Private/Partials/PageLayout/Record.html b/Resources/Private/Partials/PageLayout/Record.html
@@ -1,32 +1,27 @@
-<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
-      xmlns:core="http://typo3.org/ns/TYPO3/CMS/Core/ViewHelpers"
-      data-namespace-typo3-fluid="true">
 {f:if(condition: '{item.disabled} && {item.context.drawingConfiguration.showHidden} == 0', then: 'display: none;') -> f:variable(name: 'style')}
 <div class="t3-page-ce {item.wrapperClassName} t3js-page-ce t3js-page-ce-sortable" id="element-tt_content-{item.record.uid}" data-table="tt_content" data-uid="{item.record.uid}" data-language-uid="{item.record.sys_language_uid}" style="{style}">
-    <div class="t3-page-ce-dragitem" id="{item.uniqueId}">
+    <div class="t3-page-ce-element t3-page-ce-dragitem t3js-page-ce-dragitem" id="{item.uniqueId}">
         <f:render partial="PageLayout/Record/{item.record.CType}/Header" arguments="{_all}" optional="1">
             <f:render partial="PageLayout/RecordDefault/Header" arguments="{_all}" />
         </f:render>
-        <div class="t3-page-ce-body">
-            <div class="t3-page-ce-body-inner">
-                <div class="{f:if(condition: item.versioned, then: 'ver-element')}">
-                    <f:render partial="PageLayout/RecordDefault/Preview" arguments="{_all}" />
-                </div>
+        <f:spaceless>
+            <div class="t3-page-ce-body">
+                <f:render partial="PageLayout/RecordDefault/Preview" arguments="{_all}" />
             </div>
-            <f:render partial="PageLayout/Record/{item.record.CType}/Footer" arguments="{_all}" optional="1">
-                <f:render partial="PageLayout/RecordDefault/Footer" arguments="{_all}" />
-            </f:render>
-        </div>
+        </f:spaceless>
+        <f:render partial="PageLayout/Record/{item.record.CType}/Footer" arguments="{_all}" optional="1">
+            <f:render partial="PageLayout/RecordDefault/Footer" arguments="{_all}" />
+        </f:render>
     </div>
-    <f:comment>use column.allowNewContent instead of pageContext</f:comment>
-    <f:if condition="{allowEditContent} && {item.column.contentEditable} && {item.column.allowNewContent}">
-        <div class="t3js-page-new-ce t3-page-ce-wrapper-new-ce" id="colpos-{item.column.columnNumber}-page-{item.context.pageId}-{item.column.uniqueId}">
-            <a href="{item.newContentAfterUrl}" title="{f:translate(key: 'LLL:EXT:backend/Resources/Private/Language/locallang_layout.xlf:newContentElement')}" data-title="{f:translate(key: 'LLL:EXT:backend/Resources/Private/Language/locallang_layout.xlf:newContentElement')}" class="btn btn-default btn-sm t3js-toggle-new-content-element-wizard disabled">
-                <core:icon identifier="actions-add" />
-                <f:translate key="LLL:EXT:backend/Resources/Private/Language/locallang_layout.xlf:content" />
-            </a>
+    <f:if condition="{allowEditContent} && {item.column.contentEditable} && {item.column.allowNewContent} && {column.active}">
+        <div class="t3-page-ce-actions t3js-page-new-ce" id="colpos-{item.column.columnNumber}-page-{item.context.pageId}-{item.column.uniqueId}">
+            <typo3-backend-new-content-element-wizard-button url="{item.newContentAfterUrl}" subject="{f:translate(key: 'LLL:EXT:backend/Resources/Private/Language/locallang_layout.xlf:newContentElement')}">
+                <button type="button" class="btn btn-default btn-sm">
+                    <core:icon identifier="actions-add" />
+                    <f:translate key="LLL:EXT:backend/Resources/Private/Language/locallang_layout.xlf:createNewContent" />
+                </button>
+            </typo3-backend-new-content-element-wizard-button>
         </div>
     </f:if>
-    <div class="t3-page-ce-dropzone-available t3js-page-ce-dropzone-available"></div>
+    <div class="t3-page-ce-dropzone t3js-page-ce-dropzone-available"></div>
 </div>
-</html>
diff --git a/Resources/Private/Partials11/PageLayout/Grid/Column.html b/Resources/Private/Partials11/PageLayout/Grid/Column.html
@@ -0,0 +1,73 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
+      xmlns:core="http://typo3.org/ns/TYPO3/CMS/Core/ViewHelpers"
+      data-namespace-typo3-fluid="true">
+<f:comment>remove class t3-grid-cell (for tests)</f:comment>
+<f:comment>change data-colpos attr</f:comment>
+<td valign="top" colspan="{column.colSpan}" rowspan="{column.rowSpan}"
+    data-colpos="{column.containerUid}-{column.columnNumber}" data-language-uid="{column.context.siteLanguage.languageId}"
+    class="t3-grid-cell t3js-page-lang-column-{column.context.siteLanguage.languageId} t3js-page-column t3-page-column t3-page-column-{column.columnNumber}
+        {f:if(condition: column.active, else: 't3-grid-cell-unassigned')}
+        t3-gridCell-width{column.colSpan}
+        t3-gridCell-height{column.rowSpan}">
+    <div class="t3-page-column-header">
+        <f:if condition="{column.active}">
+            <f:then>
+                <div class="t3-page-column-header-icons">
+                    <f:if condition="{allowEditContent} && {column.editUrl}">
+                        <a href="{column.editUrl}" title="{column.editLinkTitle}"><core:icon identifier="actions-document-open" /></a>
+                    </f:if>
+                </div>
+                {column.title}
+            </f:then>
+            <f:else if="{column.unassigned}">
+                {column.title} (<f:format.raw>{column.titleUnassigned}</f:format.raw>)
+            </f:else>
+            <f:else if="!{hideRestrictedColumns}">
+                <f:format.raw>{column.titleInaccessible}</f:format.raw>
+            </f:else>
+            <f:else>
+                <f:format.raw>{column.titleInaccessible}</f:format.raw>
+            </f:else>
+        </f:if>
+    </div>
+    <f:comment>use column.allowNewContent instead of pageContext</f:comment>
+    <f:if condition="{allowEditContent} && {column.contentEditable} && {column.allowNewContent}">
+        <div class="t3-page-ce t3js-page-ce" data-page="{column.context.pageId}" id="{column.uniqueId}">
+            <div class="t3js-page-new-ce t3-page-ce-wrapper-new-ce" id="colpos-{column.columnNumber}-page-{column.context.pageId}-{column.uniqueId}">
+                <a href="{column.newContentUrl}" title="{newContentTitle}" data-title="{newContentTitle}"
+                    class="btn btn-default btn-sm t3js-toggle-new-content-element-wizard disabled">
+                    <core:icon identifier="actions-add" />
+                    {newContentTitleShort}
+                </a>
+            </div>
+            <div class="t3-page-ce-dropzone-available t3js-page-ce-dropzone-available"></div>
+        </div>
+    </f:if>
+    <f:if condition="{column.unassigned}">
+        <div class="t3-page-ce">
+            <div class="t3-page-ce-header">Empty Colpos</div>
+            <div class="t3-page-ce-body">
+                <div class="t3-page-ce-body-inner">
+                    <div class="row">
+                        <div class="col-xs-12">
+                            This column has no "colPos". This is only for display Purposes.
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </f:if>
+    <f:if condition="{column.items}">
+        <f:comment>change data-colpos attr</f:comment>
+        <div data-colpos="{column.containerUid}-{column.columnNumber}" data-language-uid="{column.context.siteLanguage.languageId}"
+            class="t3js-sortable t3js-sortable-lang t3js-sortable-lang-{column.context.siteLanguage.languageId} t3-page-ce-wrapper
+                {f:if(condition: column.items, else: 't3-page-ce-empty')}">
+            <f:for each="{column.items}" as="item">
+                <f:if condition="{item.deletePlaceholder} == 0">
+                    <f:render partial="PageLayout/Record" arguments="{_all}" />
+                </f:if>
+            </f:for>
+        </div>
+    </f:if>
+</td>
+</html>
diff --git a/Resources/Private/Partials11/PageLayout/Record.html b/Resources/Private/Partials11/PageLayout/Record.html
@@ -0,0 +1,32 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
+      xmlns:core="http://typo3.org/ns/TYPO3/CMS/Core/ViewHelpers"
+      data-namespace-typo3-fluid="true">
+{f:if(condition: '{item.disabled} && {item.context.drawingConfiguration.showHidden} == 0', then: 'display: none;') -> f:variable(name: 'style')}
+<div class="t3-page-ce {item.wrapperClassName} t3js-page-ce t3js-page-ce-sortable" id="element-tt_content-{item.record.uid}" data-table="tt_content" data-uid="{item.record.uid}" data-language-uid="{item.record.sys_language_uid}" style="{style}">
+    <div class="t3-page-ce-dragitem" id="{item.uniqueId}">
+        <f:render partial="PageLayout/Record/{item.record.CType}/Header" arguments="{_all}" optional="1">
+            <f:render partial="PageLayout/RecordDefault/Header" arguments="{_all}" />
+        </f:render>
+        <div class="t3-page-ce-body">
+            <div class="t3-page-ce-body-inner">
+                <div class="{f:if(condition: item.versioned, then: 'ver-element')}">
+                    <f:render partial="PageLayout/RecordDefault/Preview" arguments="{_all}" />
+                </div>
+            </div>
+            <f:render partial="PageLayout/Record/{item.record.CType}/Footer" arguments="{_all}" optional="1">
+                <f:render partial="PageLayout/RecordDefault/Footer" arguments="{_all}" />
+            </f:render>
+        </div>
+    </div>
+    <f:comment>use column.allowNewContent instead of pageContext</f:comment>
+    <f:if condition="{allowEditContent} && {item.column.contentEditable} && {item.column.allowNewContent}">
+        <div class="t3js-page-new-ce t3-page-ce-wrapper-new-ce" id="colpos-{item.column.columnNumber}-page-{item.context.pageId}-{item.column.uniqueId}">
+            <a href="{item.newContentAfterUrl}" title="{f:translate(key: 'LLL:EXT:backend/Resources/Private/Language/locallang_layout.xlf:newContentElement')}" data-title="{f:translate(key: 'LLL:EXT:backend/Resources/Private/Language/locallang_layout.xlf:newContentElement')}" class="btn btn-default btn-sm t3js-toggle-new-content-element-wizard disabled">
+                <core:icon identifier="actions-add" />
+                <f:translate key="LLL:EXT:backend/Resources/Private/Language/locallang_layout.xlf:content" />
+            </a>
+        </div>
+    </f:if>
+    <div class="t3-page-ce-dropzone-available t3js-page-ce-dropzone-available"></div>
+</div>
+</html>
diff --git a/Resources/Private/Partials12/PageLayout/Grid/Column.html b/Resources/Private/Partials12/PageLayout/Grid/Column.html