[FEATURE] Extract html into fluid template from edit module in admin panel 92/56392/6
authorSteffen Frese <s.frese@neusta.de>
Tue, 20 Mar 2018 14:33:33 +0000 (15:33 +0100)
committerSusanne Moog <susanne.moog@typo3.org>
Thu, 29 Mar 2018 11:26:15 +0000 (13:26 +0200)
The edit module should use a fluid template instead of the old php-html
mixed data structure.

Resolves: #84291
Releases: master
Change-Id: I195a746ccbac8e75e9257b8f48a5dfa648110de6
Reviewed-on: https://review.typo3.org/56392
Tested-by: TYPO3com <no-reply@typo3.com>
Reviewed-by: Tobi Kretschmann <tobi@tobishome.de>
Tested-by: Tobi Kretschmann <tobi@tobishome.de>
Reviewed-by: Mathias Schreiber <mathias.schreiber@typo3.com>
Tested-by: Mathias Schreiber <mathias.schreiber@typo3.com>
Reviewed-by: Joerg Boesche <typo3@joergboesche.de>
Tested-by: Joerg Boesche <typo3@joergboesche.de>
Reviewed-by: Susanne Moog <susanne.moog@typo3.org>
Tested-by: Susanne Moog <susanne.moog@typo3.org>
14 files changed:
Build/tsconfig.json
typo3/sysext/adminpanel/Classes/Modules/AbstractModule.php
typo3/sysext/adminpanel/Classes/Modules/AdminPanelModuleInterface.php
typo3/sysext/adminpanel/Classes/Modules/EditModule.php
typo3/sysext/adminpanel/Classes/View/AdminPanelView.php
typo3/sysext/adminpanel/Resources/Private/Language/locallang_edit.xlf [new file with mode: 0644]
typo3/sysext/adminpanel/Resources/Private/Partials/Modules/Edit/BackendButton.html [new file with mode: 0644]
typo3/sysext/adminpanel/Resources/Private/Partials/Modules/Edit/FeEdit.html [new file with mode: 0644]
typo3/sysext/adminpanel/Resources/Private/Partials/Modules/Edit/Toolbar.html [new file with mode: 0644]
typo3/sysext/adminpanel/Resources/Private/Templates/Modules/Edit.html [new file with mode: 0644]
typo3/sysext/adminpanel/Resources/Public/JavaScript/Modules/Edit/OpenBackendHandler.js [new file with mode: 0644]
typo3/sysext/adminpanel/Tests/Unit/View/Fixtures/AdminPanelDisabledModuleFixture.php
typo3/sysext/adminpanel/Tests/Unit/View/Fixtures/AdminPanelEnabledShownOnSubmitInitializeModuleFixture.php
typo3/sysext/lang/Resources/Private/Language/locallang_tsfe.xlf

index c0eeae8..629bdfb 100644 (file)
         "baseUrl": ".",
         "rootDir": "../",
         "paths": {
+            "TYPO3/CMS/Adminpanel/*": [
+                "../typo3/sysext/adminpanel/Resources/Public/JavaScript/*",
+                "../typo3/sysext/adminpanel/Resources/Private/TypeScript/*"
+            ],
             "TYPO3/CMS/Backend/*": [
                 "../typo3/sysext/backend/Resources/Public/JavaScript/*",
                 "../typo3/sysext/backend/Resources/Private/TypeScript/*"
index 090f8da..07f3c61 100644 (file)
@@ -178,4 +178,12 @@ abstract class AbstractModule implements AdminPanelModuleInterface
         }
         return $result;
     }
+
+    /**
+     * @return array
+     */
+    public function getJavaScriptFiles(): array
+    {
+        return [];
+    }
 }
index ec71e9e..12a4ab9 100644 (file)
@@ -103,4 +103,11 @@ interface AdminPanelModuleInterface
      * @return bool
      */
     public function showFormSubmitButton(): bool;
+
+    /**
+     * Returns a string array with javascript files that will be rendered after the module
+     *
+     * @return array
+     */
+    public function getJavaScriptFiles(): array;
 }
index aaa153b..cb52bb4 100644 (file)
@@ -19,6 +19,7 @@ namespace TYPO3\CMS\Adminpanel\Modules;
 use TYPO3\CMS\Backend\Utility\BackendUtility;
 use TYPO3\CMS\Core\Utility\ExtensionManagementUtility;
 use TYPO3\CMS\Core\Utility\GeneralUtility;
+use TYPO3\CMS\Fluid\View\StandaloneView;
 use TYPO3\CMS\Frontend\Controller\TypoScriptFrontendController;
 
 /**
@@ -33,71 +34,48 @@ class EditModule extends AbstractModule
      */
     public function getContent(): string
     {
-        $output = [];
-        if ($this->getBackendUser()->uc['TSFE_adminConfig']['display_edit']) {
+        $view = GeneralUtility::makeInstance(StandaloneView::class);
+        $templateNameAndPath = $this->extResources . '/Templates/Modules/Edit.html';
+        $view->setTemplatePathAndFilename(GeneralUtility::getFileAbsFileName($templateNameAndPath));
+        $view->setPartialRootPaths([$this->extResources . '/Partials']);
 
-            // If another page module was specified, replace the default Page module with the new one
-            $newPageModule = trim((string)$this->getBackendUser()->getTSConfigVal('options.overridePageModule'));
-            $pageModule = BackendUtility::isModuleSetInTBE_MODULES($newPageModule) ? $newPageModule : 'web_layout';
+        $view->assignMultiple([
+            'feEdit' => ExtensionManagementUtility::isLoaded('feedit'),
+            'display' => [
+                'edit' => $this->getBackendUser()->uc['TSFE_adminConfig']['display_edit'],
+                'fieldIcons' => $this->getConfigurationOption('displayFieldIcons'),
+                'displayIcons' => $this->getConfigurationOption('displayIcons'),
+            ],
+            'toolbar' => $this->getBackendUser()->adminPanel->ext_makeToolBar(),
+            'script' => [
+                'pageUid' => (int)$this->getTypoScriptFrontendController()->page['uid'],
+                'pageModule' => $this->getPageModule(),
+                'backendScript' => BackendUtility::getBackendScript(),
+                't3BeSitenameMd5' => \md5('Typo3Backend-' . $GLOBALS['TYPO3_CONF_VARS']['SYS']['sitename']),
+            ],
+        ]);
 
-            if (ExtensionManagementUtility::isLoaded('feedit')) {
-                $output[] = '<div class="typo3-adminPanel-form-group">';
-                $output[] = '  <div class="typo3-adminPanel-form-group-checkbox">';
-                $output[] = '    <input type="hidden" name="TSFE_ADMIN_PANEL[edit_displayFieldIcons]" value="0" />';
-                $output[] = '    <label for="edit_displayFieldIcons">';
-                $output[] = '      <input type="checkbox" id="edit_displayFieldIcons" name="TSFE_ADMIN_PANEL[edit_displayFieldIcons]" value="1"' .
-                            ($this->getBackendUser(
-                            )->uc['TSFE_adminConfig']['edit_displayFieldIcons'] ? ' checked="checked"' : '') .
-                            ' />';
-                $output[] = '      ' . $this->extGetLL('edit_displayFieldIcons');
-                $output[] = '    </label>';
-                $output[] = '  </div>';
-                $output[] = '  <div class="typo3-adminPanel-form-group-checkbox">';
-                $output[] = '    <input type="hidden" name="TSFE_ADMIN_PANEL[edit_displayIcons]" value="0" />';
-                $output[] = '    <label for="edit_displayIcons">';
-                $output[] = '      <input type="checkbox" id="edit_displayIcons" name="TSFE_ADMIN_PANEL[edit_displayIcons]" value="1"' .
-                            ($this->getBackendUser(
-                            )->uc['TSFE_adminConfig']['edit_displayIcons'] ? ' checked="checked"' : '') .
-                            ' />';
-                $output[] = '      ' . $this->extGetLL('edit_displayIcons');
-                $output[] = '    </label>';
-                $output[] = '  </div>';
-                $output[] = '</div>';
-            }
+        return $view->render();
+    }
 
-            $output[] = $this->getBackendUser()->adminPanel->ext_makeToolBar();
+    /**
+     * @return TypoScriptFrontendController
+     */
+    protected function getTypoScriptFrontendController(): TypoScriptFrontendController
+    {
+        return $GLOBALS['TSFE'];
+    }
 
-            $onClick = '
-                if (parent.opener && parent.opener.top && parent.opener.top.TS) {
-                    parent.opener.top.fsMod.recentIds["web"]=' .
-                       (int)$this->getTypoScriptFrontendController()->page['uid'] .
-                       ';
-                    if (parent.opener.top && parent.opener.top.nav_frame && parent.opener.top.nav_frame.refresh_nav) {
-                        parent.opener.top.nav_frame.refresh_nav();
-                    }
-                    parent.opener.top.goToModule("' .
-                       $pageModule .
-                       '");
-                    parent.opener.top.focus();
-                } else {
-                    vHWin=window.open(' .
-                       GeneralUtility::quoteJSvalue(BackendUtility::getBackendScript()) .
-                       ',\'' .
-                       md5('Typo3Backend-' . $GLOBALS['TYPO3_CONF_VARS']['SYS']['sitename']) .
-                       '\');
-                    vHWin.focus();
-                }
-                return false;
-            ';
-            $output[] = '<div class="typo3-adminPanel-form-group">';
-            $output[] = '  <a class="typo3-adminPanel-btn typo3-adminPanel-btn-default" href="#" onclick="' .
-                        htmlspecialchars($onClick) .
-                        '">';
-            $output[] = '    ' . $this->extGetLL('edit_openAB');
-            $output[] = '  </a>';
-            $output[] = '</div>';
-        }
-        return implode('', $output);
+    /**
+     * @return string
+     */
+    private function getPageModule(): string
+    {
+        $newPageModule = \trim(
+            (string)$this->getBackendUser()
+                ->getTSConfigVal('options.overridePageModule')
+        );
+        return BackendUtility::isModuleSetInTBE_MODULES($newPageModule) ? $newPageModule : 'web_layout';
     }
 
     /**
@@ -149,10 +127,10 @@ class EditModule extends AbstractModule
     }
 
     /**
-     * @return TypoScriptFrontendController
+     * @return array
      */
-    protected function getTypoScriptFrontendController(): TypoScriptFrontendController
+    public function getJavaScriptFiles(): array
     {
-        return $GLOBALS['TSFE'];
+        return ['EXT:adminpanel/Resources/Public/JavaScript/Modules/Edit/OpenBackendHandler.js'];
     }
 }
index 8915ae0..1cc0a16 100644 (file)
@@ -128,6 +128,13 @@ class AdminPanelView
             $output[] = '</div>';
         }
 
+        foreach ($module->getJavaScriptFiles() as $javaScriptFile) {
+            $output[] =
+                '<script src="' .
+                PathUtility::getAbsoluteWebPath(GeneralUtility::getFileAbsFileName($javaScriptFile)) .
+                '"></script>';
+        }
+
         return implode('', $output);
     }
 
diff --git a/typo3/sysext/adminpanel/Resources/Private/Language/locallang_edit.xlf b/typo3/sysext/adminpanel/Resources/Private/Language/locallang_edit.xlf
new file mode 100644 (file)
index 0000000..f8315d0
--- /dev/null
@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.0" xmlns:t3="http://typo3.org/schemas/xliff">
+       <file t3:id="1521629227" source-language="en" datatype="plaintext" original="messages" date="2018-03-21T11:47:00Z"
+                 product-name="adminpanel">
+               <header/>
+               <body>
+                       <trans-unit id="displayFieldIcons">
+                               <source>Display edit icons</source>
+                       </trans-unit>
+                       <trans-unit id="displayIcons">
+                               <source>Display edit panels</source>
+                       </trans-unit>
+                       <trans-unit id="openAB">
+                               <source>Open TYPO3 Backend</source>
+                       </trans-unit>
+               </body>
+       </file>
+</xliff>
diff --git a/typo3/sysext/adminpanel/Resources/Private/Partials/Modules/Edit/BackendButton.html b/typo3/sysext/adminpanel/Resources/Private/Partials/Modules/Edit/BackendButton.html
new file mode 100644 (file)
index 0000000..a0c9e6f
--- /dev/null
@@ -0,0 +1,10 @@
+<div class="typo3-adminPanel-form-group">
+       <a class="typo3-adminPanel-btn typo3-adminPanel-btn-default typo3-adminPanel-btn-openBackend"
+                href="#"
+                data-pageUid="{script.pageUid}"
+                data-pageModule="{script.pageModule}"
+                data-t3BeSitenameMd5="{script.t3BeSitenameMd5}"
+                data-backendScript="{script.backendScript}">
+               <f:translate key="LLL:EXT:adminpanel/Resources/Private/Language/locallang_edit.xlf:openAB"/>
+       </a>
+</div>
diff --git a/typo3/sysext/adminpanel/Resources/Private/Partials/Modules/Edit/FeEdit.html b/typo3/sysext/adminpanel/Resources/Private/Partials/Modules/Edit/FeEdit.html
new file mode 100644 (file)
index 0000000..7ee5bfb
--- /dev/null
@@ -0,0 +1,25 @@
+<f:if condition="{feEdit}">
+       <div class="typo3-adminPanel-form-group">
+               <div class="typo3-adminPanel-form-group-checkbox">
+                       <f:form.hidden name="TSFE_ADMIN_PANEL[edit_displayFieldIcons]" value="0"/>
+                       <label for="edit_displayFieldIcons">
+                               <f:form.checkbox
+                                       name="TSFE_ADMIN_PANEL[edit_displayFieldIcons]"
+                                       value="1" checked="{display.fieldIcons}"
+                                       id="edit_displayFieldIcons"/>
+                               <f:translate key="LLL:EXT:adminpanel/Resources/Private/Language/locallang_edit.xlf:displayFieldIcons"/>
+                       </label>
+               </div>
+               <div class="typo3-adminPanel-form-group-checkbox">
+                       <f:form.hidden name="TSFE_ADMIN_PANEL[edit_displayIcons]" value="0"/>
+                       <label for="edit_displayIcons">
+                               <f:form.checkbox
+                                       name="TSFE_ADMIN_PANEL[edit_displayIcons]"
+                                       value="1"
+                                       checked="{display.displayIcons}"
+                                       id="edit_displayIcons"/>
+                               <f:translate key="LLL:EXT:adminpanel/Resources/Private/Language/locallang_edit.xlf:displayIcons"/>
+                       </label>
+               </div>
+       </div>
+</f:if>
diff --git a/typo3/sysext/adminpanel/Resources/Private/Partials/Modules/Edit/Toolbar.html b/typo3/sysext/adminpanel/Resources/Private/Partials/Modules/Edit/Toolbar.html
new file mode 100644 (file)
index 0000000..e64dfee
--- /dev/null
@@ -0,0 +1 @@
+<f:format.raw>{toolbar}</f:format.raw>
diff --git a/typo3/sysext/adminpanel/Resources/Private/Templates/Modules/Edit.html b/typo3/sysext/adminpanel/Resources/Private/Templates/Modules/Edit.html
new file mode 100644 (file)
index 0000000..7b82582
--- /dev/null
@@ -0,0 +1,5 @@
+<f:if condition="{display.edit}">
+       <f:render partial="Modules/Edit/FeEdit" arguments="{_all}"/>
+       <f:render partial="Modules/Edit/Toolbar" arguments="{_all}"/>
+       <f:render partial="Modules/Edit/BackendButton" arguments="{_all}"/>
+</f:if>
diff --git a/typo3/sysext/adminpanel/Resources/Public/JavaScript/Modules/Edit/OpenBackendHandler.js b/typo3/sysext/adminpanel/Resources/Public/JavaScript/Modules/Edit/OpenBackendHandler.js
new file mode 100644 (file)
index 0000000..9ece5d0
--- /dev/null
@@ -0,0 +1,19 @@
+const editModuleBtnOpenBackend = document.querySelector('.typo3-adminPanel-btn-openBackend');
+editModuleBtnOpenBackend.addEventListener('click', editModuleOnClickHandler);
+
+function editModuleOnClickHandler(event) {
+  event.preventDefault();
+  const element = event.target;
+  if (parent.opener && parent.opener.top) {
+    parent.opener.top.fsMod.recentIds['web'] = element.getAttribute('data-pageUid');
+    if (parent.opener.top && parent.opener.top.nav_frame && parent.opener.top.nav_frame.refresh_nav) {
+      parent.opener.top.nav_frame.refresh_nav();
+    }
+    parent.opener.top.goToModule(element.getAttribute('data-pageModule'));
+    parent.opener.top.focus();
+  } else {
+    const vHWin = window.open(element.getAttribute('data-backendScript'), element.getAttribute('data-t3BeSitenameMd5'));
+    vHWin.focus();
+  }
+  return false;
+}
index 4c9fffc..d9cc674 100644 (file)
@@ -128,4 +128,14 @@ class AdminPanelDisabledModuleFixture implements AdminPanelModuleInterface
     {
         return true;
     }
+
+    /**
+     * Returns a string array with javascript files that will be rendered after the module
+     *
+     * @return array
+     */
+    public function getJavaScriptFiles(): array
+    {
+        return [];
+    }
 }
index 8fe133a..0835228 100644 (file)
@@ -129,4 +129,14 @@ class AdminPanelEnabledShownOnSubmitInitializeModuleFixture implements AdminPane
     {
         return true;
     }
+
+    /**
+     * Returns a string array with javascript files that will be rendered after the module
+     *
+     * @return array
+     */
+    public function getJavaScriptFiles(): array
+    {
+        return [];
+    }
 }
index f759873..a9652af 100644 (file)
                        <trans-unit id="edit">
                                <source>Editing</source>
                        </trans-unit>
-                       <trans-unit id="edit_displayIcons">
-                               <source>Display edit panels</source>
-                       </trans-unit>
-                       <trans-unit id="edit_displayFieldIcons">
-                               <source>Display edit icons</source>
-                       </trans-unit>
                        <trans-unit id="edit_editFormsOnPage">
                                <source>Editforms on page</source>
                        </trans-unit>
                        <trans-unit id="edit_editNoPopup">
                                <source>No popup window</source>
                        </trans-unit>
-                       <trans-unit id="edit_openAB">
-                               <source>Open TYPO3 Backend</source>
-                       </trans-unit>
                        <trans-unit id="edit_recordHistory">
                                <source>View record change history</source>
                        </trans-unit>