[TASK] Fluidification of CreatePages Wizard 47/49947/2
authorMichael Oehlhof <typo3@oehlhof.de>
Thu, 15 Sep 2016 14:29:36 +0000 (16:29 +0200)
committerStefan Neufeind <typo3.neufeind@speedpartner.de>
Mon, 19 Sep 2016 08:34:33 +0000 (10:34 +0200)
Resolves: #77948
Releases: master
Change-Id: I5c7da79ca9ade71cc0e76393d71ef0e4cdaf338e
Reviewed-on: https://review.typo3.org/49947
Tested-by: TYPO3com <no-reply@typo3.com>
Reviewed-by: Markus Sommer <markussom@posteo.de>
Tested-by: Markus Sommer <markussom@posteo.de>
Reviewed-by: Stefan Neufeind <typo3.neufeind@speedpartner.de>
Tested-by: Stefan Neufeind <typo3.neufeind@speedpartner.de>
typo3/sysext/wizard_crpages/Classes/Controller/CreatePagesWizardModuleFunctionController.php
typo3/sysext/wizard_crpages/Resources/Private/Templates/CreatePagesWizard.html [new file with mode: 0644]
typo3/sysext/wizard_crpages/Resources/Public/JavaScript/WizardCreatePages.js

index 5b91afb..f64c8a3 100644 (file)
@@ -14,13 +14,11 @@ namespace TYPO3\CMS\WizardCrpages\Controller;
  * The TYPO3 project - inspiring people to share!
  */
 
-use TYPO3\CMS\Backend\Form\Utility\FormEngineUtility;
 use TYPO3\CMS\Backend\Utility\BackendUtility;
-use TYPO3\CMS\Core\Imaging\Icon;
-use TYPO3\CMS\Core\Imaging\IconFactory;
 use TYPO3\CMS\Core\Messaging\FlashMessage;
 use TYPO3\CMS\Core\Messaging\FlashMessageService;
 use TYPO3\CMS\Core\Utility\GeneralUtility;
+use TYPO3\CMS\Fluid\View\StandaloneView;
 use TYPO3\CMS\Frontend\Page\PageRepository;
 
 /**
@@ -43,25 +41,15 @@ class CreatePagesWizardModuleFunctionController extends \TYPO3\CMS\Backend\Modul
     protected $pagesTsConfig = [];
 
     /**
-     * The type select HTML
-     */
-    protected $typeSelectHtml = '';
-
-    /**
-     * @var IconFactory
-     */
-    protected $iconFactory;
-
-    /**
      * Main function creating the content for the module.
      *
      * @return string HTML content for the module, actually a "section" made through the parent object in $this->pObj
      */
     public function main()
     {
-        $this->iconFactory = GeneralUtility::makeInstance(IconFactory::class);
         $this->getLanguageService()->includeLLFile('EXT:wizard_crpages/Resources/Private/Language/locallang.xlf');
-        $theCode = '';
+        $assigns = [];
+        $assigns['LLPrefix'] = 'LLL:EXT:wizard_crpages/Resources/Private/Language/locallang.xlf:';
         $this->tsConfig = BackendUtility::getPagesTSconfig($this->pObj->id);
         $this->pagesTsConfig = isset($this->tsConfig['TCEFORM.']['pages.']) ? $this->tsConfig['TCEFORM.']['pages.'] : [];
 
@@ -120,59 +108,21 @@ class CreatePagesWizardModuleFunctionController extends \TYPO3\CMS\Backend\Modul
                 $defaultFlashMessageQueue->enqueue($flashMessage);
                 // Display result:
                 $menuItems = $pageRepository->getMenu($this->pObj->id, '*', 'sorting', '', false);
-                $lines = [];
+                $pageLines = [];
                 foreach ($menuItems as $record) {
                     BackendUtility::workspaceOL('pages', $record);
                     if (is_array($record)) {
-                        $lines[] = '<span class="text-nowrap" title="' . BackendUtility::titleAttribForPages($record, '', false) . '">' . $this->iconFactory->getIconForRecord('pages', $record, Icon::SIZE_SMALL)->render() . htmlspecialchars(GeneralUtility::fixed_lgd_cs($record['title'], $this->getBackendUser()->uc['titleLen'])) . '</span>';
+                        $line = [];
+                        $line['titleAttribute'] = BackendUtility::titleAttribForPages($record, '', false);
+                        $line['title'] = GeneralUtility::fixed_lgd_cs($record['title'], $this->getBackendUser()->uc['titleLen']);
+                        $line['record'] = $record;
+                        $pageLines[] = $line;
                     }
                 }
-                $theCode .= '<div class="form-group"><h4>' . $this->getLanguageService()->getLL('wiz_newPages_currentMenu') . '</h4>' . implode('<br />', $lines) . '</div>';
+                $assigns['pages'] = $pageLines;
             } else {
                 // Display create form
-                $this->typeSelectHtml = $this->getTypeSelectHtml();
-                $tableData = [];
-                for ($a = 0; $a < 5; $a++) {
-                    $tableData[] = $this->getFormLine($a);
-                }
-                $theCode .= '
-                                       <h4>' . $this->getLanguageService()->getLL('wiz_newPages') . ':</h4>
-                                       <div class="form-group t3js-wizardcrpages-container">
-                                               ' . implode(LF, $tableData) . '
-                                       </div>
-                                       <div class="form-group">
-                                               <input class="btn btn-default t3js-wizardcrpages-createnewfields" type="button" value="' . $this->getLanguageService()->getLL('wiz_newPages_addMoreLines') . '" />
-                                       </div>
-                                       <div class="form-group">
-                                               <div class="checkbox">
-                                                       <label for="createInListEnd">
-                                                               <input type="checkbox" name="createInListEnd" id="createInListEnd" value="1" />
-                                                               ' . $this->getLanguageService()->getLL('wiz_newPages_listEnd') . '
-                                                       </label>
-                                               </div>
-                                               <div class="checkbox">
-                                                       <label for="hidePages">
-                                                               <input type="checkbox" name="hidePages" id="hidePages" value="1" />
-                                                               ' . $this->getLanguageService()->getLL('wiz_newPages_hidePages') . '
-                                                       </label>
-                                               </div>
-                                               <div class="checkbox">
-                                                       <label for="hidePagesInMenus">
-                                                               <input type="checkbox" name="hidePagesInMenus" id="hidePagesInMenus" value="1" />
-                                                               ' . $this->getLanguageService()->getLL('wiz_newPages_hidePagesInMenus') . '
-                                                       </label>
-                                               </div>
-                                       </div>
-                                       <div class="form-group">
-                                               <input class="btn btn-default" type="submit" name="create" value="' . $this->getLanguageService()->getLL('wiz_newPages_lCreate') . '" />
-                                               <input class="btn btn-default" type="reset" value="' . $this->getLanguageService()->getLL('wiz_newPages_lReset') . '" />
-                                       </div>';
-
-                $this->getPageRenderer()->loadJquery();
-                $this->getPageRenderer()->loadRequireJsModule('TYPO3/CMS/WizardCrpages/WizardCreatePages');
-                // Add inline code
-                $inlineJavaScriptCode = 'var tpl = "' . addslashes(str_replace([LF, TAB], ['', ''], $this->getFormLine('#'))) . '", i, line, div, bg, label;';
-                $this->getPageRenderer()->addJsInlineCode('wizard_crpages', $inlineJavaScriptCode);
+                $assigns['typeSelect'] = $this->getTypeSelectData();
             }
         } else {
             $flashMessage = GeneralUtility::makeInstance(FlashMessage::class, '', $this->getLanguageService()->getLL('wiz_newPages_errorMsg1'), FlashMessage::ERROR);
@@ -183,67 +133,26 @@ class CreatePagesWizardModuleFunctionController extends \TYPO3\CMS\Backend\Modul
             $defaultFlashMessageQueue->enqueue($flashMessage);
         }
         // CSH
-        $theCode .= BackendUtility::cshItem('_MOD_web_func', 'tx_wizardcrpages', null, '<span class="btn btn-default btn-sm">|</span>');
-        $out = '<h1>' . htmlspecialchars($this->getLanguageService()->getLL('wiz_crMany')) . '</h1>';
-        $out .= '<div>' . $theCode . '</div>';
-        return $out;
-    }
+        $assigns['cshItem'] = BackendUtility::cshItem('_MOD_web_func', 'tx_wizardcrpages');
 
-    /**
-     * Return one line in the form
-     *
-     * @param int|string $index An integer: the line counter for which to create the line. Use "#" to create an template for javascript (used by ExtJS)
-     * @return string HTML code for one input line for one new page
-     */
-    protected function getFormLine($index)
-    {
-        if (is_numeric($index)) {
-            $label = $index + 1;
-        } else {
-            // used as template for JavaScript
-            $index = '{0}';
-            $label = '{1}';
-        }
-        $content = '' .
-            '<div class="form-section" id="form-line-' . $index . '">' .
-                '<div class="row">' .
-                    '<div class="form-group col-sm-6">' .
-                        '<label for="page_new_' . $index . '">' .
-                            $this->getLanguageService()->getLL('wiz_newPages_page') . ' ' . $label . ':' .
-                        '</label>' .
-                        '<div class="form-control-wrap">' .
-                            '<input class="form-control" type="text" id="page_new_' . $index . '" name="data[pages][NEW' . $index . '][title]" />' .
-                        '</div>' .
-                    '</div>' .
-                    '<div class="form-group col-sm-6">' .
-                        '<label>' .
-                            $this->getLanguageService()->sL('LLL:EXT:lang/locallang_general.xlf:LGL.type') .
-                        '</label>' .
-                        '<div class="form-control-wrap">' .
-                            '<div class="input-group">' .
-                                '<div id="page_new_icon_' . $index . '" class="input-group-addon input-group-icon">' .
-                                    $this->iconFactory->getIconForRecord('pages', [], Icon::SIZE_SMALL)->render() .
-                                '</div>' .
-                                '<select class="form-control form-control-adapt t3js-wizardcrpages-select-doktype" name="data[pages][NEW' . $index . '][doktype]" data-target="#page_new_icon_' . $index . '">' .
-                                    $this->typeSelectHtml .
-                                '</select>' .
-                            '</div>' .
-                        '</div>' .
-                    '</div>' .
-                '</div>' .
-            '</div>';
-        return $content;
+        // Rendering of the output via fluid
+        $view = GeneralUtility::makeInstance(StandaloneView::class);
+        $view->setTemplatePathAndFilename(GeneralUtility::getFileAbsFileName(
+            'EXT:wizard_crpages/Resources/Private/Templates/CreatePagesWizard.html'
+        ));
+        $view->assignMultiple($assigns);
+        $out = $view->render();
+
+        return $out;
     }
 
     /**
-     * Get type selector
+     * Get type selector data
      *
      * @return string
      */
-    protected function getTypeSelectHtml()
+    protected function getTypeSelectData()
     {
-        $content = '';
-
         // find all available doktypes for the current user
         $types = $GLOBALS['PAGES_TYPES'];
         unset($types['default']);
@@ -260,6 +169,7 @@ class CreatePagesWizardModuleFunctionController extends \TYPO3\CMS\Backend\Modul
 
         // sort by group and allowedDoktypes
         $groupedData = [];
+        $groupLabel = '';
         foreach ($availableDoktypes as $doktypeData) {
             // if it is a group, save the group label for the children underneath
             if ($doktypeData[1] == '--div--') {
@@ -271,20 +181,7 @@ class CreatePagesWizardModuleFunctionController extends \TYPO3\CMS\Backend\Modul
             }
         }
 
-        // render the HTML
-        foreach ($groupedData as $groupLabel => $items) {
-            $groupContent = '';
-            foreach ($items as $item) {
-                $label = htmlspecialchars($this->getLanguageService()->sL($item[0]));
-                $value = $item[1];
-                $icon = !empty($item[2]) ? FormEngineUtility::getIconHtml($item[2], $label, $label) : '';
-                $groupContent .= '<option value="' . htmlspecialchars($value) . '" data-icon="' . htmlspecialchars($icon) . '">' . $label . '</option>';
-            }
-            $groupLabel = htmlspecialchars($this->getLanguageService()->sL($groupLabel));
-            $content .= '<optgroup label="' . $groupLabel . '">' . $groupContent . '</optgroup>';
-        }
-
-        return $content;
+        return $groupedData;
     }
 
     /**
diff --git a/typo3/sysext/wizard_crpages/Resources/Private/Templates/CreatePagesWizard.html b/typo3/sysext/wizard_crpages/Resources/Private/Templates/CreatePagesWizard.html
new file mode 100644 (file)
index 0000000..96294e4
--- /dev/null
@@ -0,0 +1,103 @@
+{namespace core=TYPO3\CMS\Core\ViewHelpers}
+
+<f:be.pageRenderer loadJQuery="true" includeRequireJsModules="{0:'TYPO3/CMS/WizardCrpages/WizardCreatePages'}" />
+<h1><f:translate key="{LLPrefix}wiz_crMany"/></h1>
+<div>
+    <f:if condition="{pages}">
+        <f:then>
+            <div class="form-group">
+                <h4><f:translate key="{LLPrefix}wiz_newPages_currentMenu"/></h4>
+                <f:for each="{pages}" as="page">
+                    <f:render section="Page" arguments="{page: page}" />
+                </f:for>
+            </div>
+        </f:then>
+        <f:else>
+            <h4><f:translate key="{LLPrefix}wiz_newPages"/>:</h4>
+            <div class="form-group t3js-wizardcrpages-container">
+                <f:render section="FormLine" arguments="{line: {index: '0', label: '1', llprefix: '{LLPrefix}', typeselect: '{typeSelect}'}}" />
+                <f:render section="FormLine" arguments="{line: {index: '1', label: '2', llprefix: '{LLPrefix}', typeselect: '{typeSelect}'}}" />
+                <f:render section="FormLine" arguments="{line: {index: '2', label: '3', llprefix: '{LLPrefix}', typeselect: '{typeSelect}'}}" />
+                <f:render section="FormLine" arguments="{line: {index: '3', label: '4', llprefix: '{LLPrefix}', typeselect: '{typeSelect}'}}" />
+                <f:render section="FormLine" arguments="{line: {index: '4', label: '5', llprefix: '{LLPrefix}', typeselect: '{typeSelect}'}}" />
+            </div>
+        </f:else>
+    </f:if>
+    <div class="form-group">
+        <input class="btn btn-default t3js-wizardcrpages-createnewfields" type="button" value="{f:translate(key: '{LLPrefix}wiz_newPages_addMoreLines')}" />
+    </div>
+    <div class="form-group">
+        <div class="checkbox">
+            <label for="createInListEnd">
+                <input type="checkbox" name="createInListEnd" id="createInListEnd" value="1" />
+                {f:translate(key: '{LLPrefix}wiz_newPages_listEnd')}
+            </label>
+        </div>
+        <div class="checkbox">
+            <label for="hidePages">
+                <input type="checkbox" name="hidePages" id="hidePages" value="1" />
+                {f:translate(key: '{LLPrefix}wiz_newPages_hidePages')}
+            </label>
+        </div>
+        <div class="checkbox">
+            <label for="hidePagesInMenus">
+                <input type="checkbox" name="hidePagesInMenus" id="hidePagesInMenus" value="1" />
+                {f:translate(key: '{LLPrefix}wiz_newPages_hidePagesInMenus')}
+            </label>
+        </div>
+    </div>
+    <div class="form-group">
+        <input class="btn btn-default" type="submit" name="create" value="{f:translate(key: '{LLPrefix}wiz_newPages_lCreate')}" />
+        <input class="btn btn-default" type="reset" value="{f:translate(key: '{LLPrefix}wiz_newPages_lReset')}" />
+    </div>
+
+    <f:format.raw>
+        <span class="btn btn-default btn-sm">{cshItem}</span>
+    </f:format.raw>
+</div>
+
+<script type="text/javascript">
+    var tpl = `<f:render section="FormLine" arguments="{line: {index: '[0]', label: '[1]', llprefix: '{LLPrefix}', typeselect: '{typeSelect}'}}" />`, i, line, div, bg, label;
+</script>
+
+<f:section name="Page">
+    <span class="text-nowrap" title="{page.titleAttribute}">
+        <core:iconForRecord table="pages" row="{page.record}" />{page.title}<br />
+    </span>
+</f:section>
+
+<f:section name="FormLine">
+    <div class="form-section" id="form-line-{line.index}">
+        <div class="row">
+            <div class="form-group col-sm-6">
+                <label for="page_new_{line.index}">
+                    <f:translate key="{line.llprefix}wiz_newPages_page"/> {line.label}:
+                </label>
+                <div class="form-control-wrap">
+                    <input class="form-control" type="text" id="page_new_{line.index}" name="data[pages][NEW{line.index}][title]" />
+                </div>
+            </div>
+            <div class="form-group col-sm-6">
+                <label>
+                    <f:translate key="LLL:EXT:lang/locallang_general.xlf:LGL.type"/>
+                </label>
+                <div class="form-control-wrap">
+                    <div class="input-group">
+                        <div id="page_new_icon_{line.index}" class="input-group-addon input-group-icon">
+                            <core:iconForRecord table="pages" row="{id: '0'}" />
+                        </div>
+                        <select class="form-control form-control-adapt t3js-wizardcrpages-select-doktype" name="data[pages][NEW{line.index}][doktype]" data-target="#page_new_icon_{line.index}">
+                            <f:for each="{line.typeselect}" as="typegroup" key="group">
+                                <optgroup label="{f:translate(key: '{group}')}">
+                                    <f:for each="{typegroup}" as="type">
+                                        <option data-icon='{core:icon(identifier: "{type.2}")}' value="{type.1}">{f:translate(key: '{type.0}')}</option>
+                                    </f:for>
+                                </optgroup>
+                            </f:for>
+                        </select>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</f:section>
index 42187c5..bbbf94d 100644 (file)
@@ -37,8 +37,8 @@ define(['jquery'], function($) {
                for (var i = 0; i < 5; i++) {
                        var label = WizardCreatePages.lineCounter + i + 1;
                        var line = tpl
-                               .replace(/\{0\}/g, (WizardCreatePages.lineCounter + i))
-                               .replace(/\{1\}/g, label);
+                               .replace(/\[0\]/g, (WizardCreatePages.lineCounter + i))
+                               .replace(/\[1\]/g, label);
 
                        $(line).appendTo(WizardCreatePages.containerSelector);
                }