[FEATURE] UI changes to "Page" module
authorSoren Malling <soren.malling@gmail.com>
Tue, 7 Aug 2012 21:10:51 +0000 (23:10 +0200)
committerJigal van Hemert <jigal@xs4all.nl>
Sun, 19 Aug 2012 09:13:38 +0000 (11:13 +0200)
This patch covers the following changes

 * Move default column layout to a backend_layout configuration (#39603)
 * Change the db_layout code, to use the default backend_layout (#39603)
 * Make UI changes to the columns rendering (#38013)

The move of default column layout to a backend_layout
is in order to ease the styling.

Change-Id: Idc888f910f5e6b86d86d15ee0cb8acd5417e9bb9
Fixes: #38013
Fixes: #39603
Releases: 6.0
Reviewed-on: http://review.typo3.org/13510
Reviewed-by: Stefan Neufeind
Tested-by: Philipp Gampe
Reviewed-by: Jigal van Hemert
Tested-by: Jigal van Hemert
typo3/sysext/cms/classes/class.tx_cms_backendlayout.php
typo3/sysext/cms/layout/class.tx_cms_layout.php
typo3/sysext/cms/layout/db_layout.php
typo3/sysext/cms/locallang_ttc.xlf
typo3/sysext/t3skin/stylesheets/structure/module_web_page.css
typo3/sysext/t3skin/stylesheets/visual/module_web_page.css

index 98bfbbd..f8387f4 100644 (file)
@@ -145,28 +145,30 @@ class tx_cms_BackendLayout {
                                'backend_layout',
                                'uid=' . $backendLayoutUid
                        );
+               } else {
+                       $backendLayout['config'] = $this->getDefaultColumnLayout();
+               }
 
-                       if ($backendLayout) {
-                               /** @var $parser t3lib_TSparser */
-                               $parser = t3lib_div::makeInstance('t3lib_TSparser');
-                               $parser->parse($backendLayout['config']);
-
-                               $backendLayout['__config']     = $parser->setup;
-                               $backendLayout['__items']      = array();
-                               $backendLayout['__colPosList'] = array();
-
-                                       // create items and colPosList
-                               if ($backendLayout['__config']['backend_layout.'] && $backendLayout['__config']['backend_layout.']['rows.']) {
-                                       foreach ($backendLayout['__config']['backend_layout.']['rows.'] as $row) {
-                                               if (isset($row['columns.']) && is_array($row['columns.'])) {
-                                                       foreach ($row['columns.'] as $column) {
-                                                               $backendLayout['__items'][] = array(
-                                                                       t3lib_div::isFirstPartOfStr($column['name'], 'LLL:') ? $GLOBALS['LANG']->sL($column['name']) : $column['name'],
-                                                                       $column['colPos'],
-                                                                       NULL
-                                                               );
-                                                               $backendLayout['__colPosList'][] = $column['colPos'];
-                                                       }
+               if ($backendLayout) {
+                       /** @var $parser t3lib_TSparser */
+                       $parser = t3lib_div::makeInstance('t3lib_TSparser');
+                       $parser->parse($backendLayout['config']);
+
+                       $backendLayout['__config']     = $parser->setup;
+                       $backendLayout['__items']      = array();
+                       $backendLayout['__colPosList'] = array();
+
+                               // create items and colPosList
+                       if ($backendLayout['__config']['backend_layout.'] && $backendLayout['__config']['backend_layout.']['rows.']) {
+                               foreach ($backendLayout['__config']['backend_layout.']['rows.'] as $row) {
+                                       if (isset($row['columns.']) && is_array($row['columns.'])) {
+                                               foreach ($row['columns.'] as $column) {
+                                                       $backendLayout['__items'][] = array(
+                                                               t3lib_div::isFirstPartOfStr($column['name'], 'LLL:') ? $GLOBALS['LANG']->sL($column['name']) : $column['name'],
+                                                               $column['colPos'],
+                                                               NULL
+                                                       );
+                                                       $backendLayout['__colPosList'][] = $column['colPos'];
                                                }
                                        }
                                }
@@ -175,5 +177,43 @@ class tx_cms_BackendLayout {
 
                return $backendLayout;
        }
+
+       /**
+        * Get default columns layout
+        *
+        * @return string Default four column layout
+        */
+       public function getDefaultColumnLayout() {
+               return '
+               backend_layout {
+                       colCount = 4
+                       rowCount = 1
+                       rows {
+                               1 {
+                                       columns {
+                                               1 {
+                                                       name = LLL:EXT:cms/locallang_ttc.xlf:colPos.I.0
+                                                       colPos = 1
+                                               }
+                                               2 {
+                                                       name = LLL:EXT:cms/locallang_ttc.xlf:colPos.I.1
+                                                       colPos = 0
+                                               }
+                                               3 {
+                                                       name = LLL:EXT:cms/locallang_ttc.xlf:colPos.I.2
+                                                       colPos = 2
+                                               }
+                                               4 {
+                                                       name = LLL:EXT:cms/locallang_ttc.xlf:colPos.I.3
+                                                       colPos = 3
+                                               }
+                                       }
+                               }
+                       }
+               }
+               ';
+       }
+
 }
+
 ?>
\ No newline at end of file
index 21aa9de..8c64a03 100755 (executable)
@@ -388,22 +388,34 @@ class tx_cms_layout extends recordList {
                                                $defLanguageCount[$key] = array();
                                        }
 
+                                               // Start wrapping div
+                                       $content[$key] .= '<div class="t3-page-ce-wrapper">';
+
+                                               // Add new content at the top most position
+                                       $content[$key] .= '
+                                               <div class="t3-page-ce-wrapper-new-ce">
+                                                       <a href="#" onclick="' . htmlspecialchars($this->newContentElementOnClick($id, $key, $lP)) . '" title="' . $GLOBALS['LANG']->getLL('newRecordHere', TRUE) . '">' .
+                                                               t3lib_iconWorks::getSpriteIcon('actions-document-new') .
+                                                       '</a>
+                                               </div>
+                                       ';
+
                                                // Select content elements from this column/language:
                                        $queryParts = $this->makeQueryArray('tt_content', $id, 'AND colPos=' . intval($key) . $showHidden . $showLanguage);
                                        $result = $GLOBALS['TYPO3_DB']->exec_SELECT_queryArray($queryParts);
 
-                                               // If it turns out that there are not content elements in the column, then display a big button which links directly to the wizard script:
-                                       if ($this->doEdit && $this->option_showBigButtons && !intval($key) && !$GLOBALS['TYPO3_DB']->sql_num_rows($result)) {
-                                               $onClick = "window.location.href='db_new_content_el.php?id=" . $id . '&colPos=' . intval($key) . '&sys_language_uid=' . $lP . '&uid_pid=' . $id . '&returnUrl=' . rawurlencode(t3lib_div::getIndpEnv('REQUEST_URI')) . "';";
-                                               $theNewButton = $GLOBALS['SOBE']->doc->t3Button($onClick, $GLOBALS['LANG']->getLL('newPageContent'));
-                                               $content[$key] .= '<img src="clear.gif" width="1" height="5" alt="" /><br />' . $theNewButton;
-                                       }
-
                                                // Traverse any selected elements and render their display code:
                                        $rowArr = $this->getResult($result);
 
                                        foreach ($rowArr as $rKey => $row) {
 
+                                               if ($this->tt_contentConfig['languageMode']) {
+                                                       $languageColumn[$key][$lP] = $head[$key] . $content[$key];
+                                                       if (!$this->defLangBinding) {
+                                                               $languageColumn[$key][$lP] .= '<br /><br />' . $this->newLanguageButton($this->getNonTranslatedTTcontentUids($defLanguageCount[$key], $id, $lP), $lP);
+                                                       }
+                                               }
+
                                                if (is_array($row) && (int) $row['t3ver_state'] != 2) {
                                                        $singleElementHTML = '';
                                                        if (!$lP && $row['sys_language_uid'] != -1) {
@@ -451,8 +463,11 @@ class tx_cms_layout extends recordList {
                                                } else {
                                                        unset($rowArr[$rKey]);
                                                }
+
                                        }
 
+                                       $content[$key] .= '</div>';
+
                                                // Add new-icon link, header:
                                        $newP = $this->newContentElementOnClick($id, $key, $lP);
                                        $colTitle = t3lib_BEfunc::getProcessedValue('tt_content', 'colPos', $key);
@@ -470,49 +485,27 @@ class tx_cms_layout extends recordList {
                                        // For each column, fit the rendered content into a table cell:
                                $out = '';
 
-                               $backendLayoutUid = $this->getSelectedBackendLayoutUid($id);
-                               $backendLayoutRecord = t3lib_BEfunc::getRecord('backend_layout', intval($backendLayoutUid));
-                               $this->tt_contentConfig['showAsGrid'] = !empty($backendLayoutRecord['config']) && !$this->tt_contentConfig['languageMode'];
-
-                               if (!$this->tt_contentConfig['showAsGrid']) {
+                               if ($this->tt_contentConfig['languageMode']) {
+                                               // in language mode process the content elements, but only fill $languageColumn. output will be generated later
                                        foreach ($cList as $k => $key) {
-
-                                               if (!$k) {
-                                                       $out .= '
-                                                               <td><img src="clear.gif" width="' . $lMarg . '" height="1" alt="" /></td>';
-                                               } else {
-                                                       $out .= '
-                                                               <td><img src="clear.gif" width="4" height="1" alt="" /></td>
-                                                               <td class="t3-page-border"><img src="clear.gif" width="1" height="1" alt="" /></td>
-                                                               <td><img src="clear.gif" width="4" height="1" alt="" /></td>';
-                                               }
-                                               $out .= '
-                                                               <td class="t3-page-column t3-page-column-' . $key . '">' . $head[$key] . $content[$key] . '</td>';
-
-                                                       // Storing content for use if languageMode is set:
-                                               if ($this->tt_contentConfig['languageMode']) {
-                                                       $languageColumn[$key][$lP] = $head[$key] . $content[$key];
-                                                       if (!$this->defLangBinding) {
-                                                               $languageColumn[$key][$lP] .= '<br /><br />' . $this->newLanguageButton($this->getNonTranslatedTTcontentUids($defLanguageCount[$key], $id, $lP), $lP);
-                                                       }
+                                               $languageColumn[$key][$lP] = $head[$key] . $content[$key];
+                                               if (!$this->defLangBinding) {
+                                                       $languageColumn[$key][$lP] .= '<br /><br />' .
+                                                               $this->newLanguageButton($this->getNonTranslatedTTcontentUids($defLanguageCount[$key], $id, $lP), $lP);
                                                }
                                        }
 
-                                               // Wrap the cells into a table row:
-                                       $out = '
-                                       <table border="0" cellpadding="0" cellspacing="0" class="t3-page-columns">
-                                               <tr>' . $out . '
-                                               </tr>
-                                       </table>';
-
                                } else {
+
+                                       $backendLayoutRecord = $this->getBackendLayoutConfiguration();
+
                                                // GRID VIEW:
 
                                                // Initialize TS parser to parse config to array
                                        $parser = t3lib_div::makeInstance('t3lib_TSparser');
                                        $parser->parse($backendLayoutRecord['config']);
 
-                                       $grid .= '<div class="t3-gridContainer"><table border="0" cellspacing="1" cellpadding="4" width="100%" height="100%" class="t3-page-columns t3-gridTable">';
+                                       $grid .= '<div class="t3-gridContainer"><table border="0" cellspacing="6" cellpadding="7" width="100%" height="100%" class="t3-page-columns t3-gridTable">';
 
                                                // Add colgroups
                                        $colCount = intval($parser->setup['backend_layout.']['colCount']);
@@ -577,7 +570,7 @@ class tx_cms_layout extends recordList {
                                $out .= t3lib_BEfunc::cshItem($this->descrTable, 'columns_multi', $GLOBALS['BACK_PATH']);
                        }
 
-                               // If language mode, then make another presentation:
+                       // If language mode, then make another presentation:
                                // Notice that THIS presentation will override the value of $out! But it needs the code above to execute since $languageColumn is filled with content we need!
                        if ($this->tt_contentConfig['languageMode']) {
 
@@ -586,6 +579,7 @@ class tx_cms_layout extends recordList {
 
                                        // Reset out - we will make new content here:
                                $out = '';
+
                                        // Separator between language columns (black thin line)
                                $midSep = '
                                                <td><img src="clear.gif" width="4" height="1" alt="" /></td>
@@ -633,7 +627,7 @@ class tx_cms_layout extends recordList {
                                foreach ($languageColumn as $cKey => $cCont) {
                                        $out .= '
                                        <tr>
-                                               <td valign="top">' . implode('</td>' . $midSep . '
+                                               <td valign="top" class="t3-gridCell">' . implode('</td>' . $midSep . '
                                                <td valign="top">', $cCont) . '</td>
                                        </tr>';
 
@@ -827,6 +821,23 @@ class tx_cms_layout extends recordList {
                return $out;
        }
 
+       /**
+        * Get backend layout configuration
+        *
+        * @return array
+        */
+       public function getBackendLayoutConfiguration() {
+               $backendLayoutUid = $this->getSelectedBackendLayoutUid($this->id);
+
+               if (!$backendLayoutUid) {
+                       return array(
+                               'config' => tx_cms_BackendLayout::getDefaultColumnLayout()
+                       );
+               }
+
+               return t3lib_BEfunc::getRecord('backend_layout', intval($backendLayoutUid));
+       }
+
        /**********************************
         *
         * Generic listing of items
@@ -1116,7 +1127,7 @@ class tx_cms_layout extends recordList {
         *
         * @param string $colName Column name
         * @param string $editParams Edit params (Syntax: &edit[...] for alt_doc.php)
-        * @param string $newParams New element params (Syntax: &edit[...] for alt_doc.php)
+        * @param string $newParams New element params (Syntax: &edit[...] for alt_doc.php) OBSOLETE
         * @return string HTML table
         */
        function tt_content_drawColHeader($colName, $editParams, $newParams) {
@@ -1124,12 +1135,6 @@ class tx_cms_layout extends recordList {
                $icons = '';
                        // Create command links:
                if ($this->tt_contentConfig['showCommands']) {
-                               // New record:
-                       if ($newParams) {
-                               $icons .= '<a href="#" onclick="' . htmlspecialchars($newParams) . '" title="' . $GLOBALS['LANG']->getLL('newInColumn', TRUE) . '">' .
-                                               t3lib_iconWorks::getSpriteIcon('actions-document-new') .
-                                               '</a>';
-                       }
                                // Edit whole of column:
                        if ($editParams) {
                                $icons .= '<a href="#" onclick="' . htmlspecialchars(t3lib_BEfunc::editOnClick($editParams, $this->backPath)) . '" title="' . $GLOBALS['LANG']->getLL('editColumn', TRUE) . '">' .
index edc110e..95bdb82 100755 (executable)
@@ -519,20 +519,12 @@ class SC_db_layout {
                        $this->topFuncMenu = t3lib_BEfunc::getFuncMenu($this->id, 'SET[function]', $this->MOD_SETTINGS['function'], $this->MOD_MENU['function'], 'db_layout.php', '');
                        $this->languageMenu = (count($this->MOD_MENU['language'])>1 ? $GLOBALS['LANG']->sL('LLL:EXT:lang/locallang_general.xml:LGL.language', 1) . t3lib_BEfunc::getFuncMenu($this->id, 'SET[language]', $this->current_sys_language, $this->MOD_MENU['language'], 'db_layout.php', '') : '');
 
-                               // Find columns
-                               // SHARED page-TSconfig settings.
-                       $modTSconfig_SHARED = t3lib_BEfunc::getModTSconfig($this->id, 'mod.SHARED');
-                       $this->colPosList = strcmp(trim($this->modTSconfig['properties']['tt_content.']['colPos_list']), '') ? trim($this->modTSconfig['properties']['tt_content.']['colPos_list']) : $modTSconfig_SHARED['properties']['colPos_list'];
-                       if (!strcmp($this->colPosList, '')) {
-                               $backendLayout = t3lib_div::callUserFunction( 'EXT:cms/classes/class.tx_cms_backendlayout.php:tx_cms_BackendLayout->getSelectedBackendLayout', $this->id, $this );
-
-                               if (count($backendLayout['__colPosList'])) {
-                                       $this->colPosList = implode(',', $backendLayout['__colPosList']);
-                               }
-                       }
-                       if (!strcmp($this->colPosList, '')) {
-                               $this->colPosList = '1,0,2,3';
+                               // Find backend layout / coumns
+                       $backendLayout = t3lib_div::callUserFunction( 'tx_cms_BackendLayout->getSelectedBackendLayout', $this->id, $this);
+                       if (count($backendLayout['__colPosList'])) {
+                               $this->colPosList = implode(',', $backendLayout['__colPosList']);
                        }
+
                                // Removing duplicates, if any
                        $this->colPosList = implode(',', array_unique(t3lib_div::intExplode(',', $this->colPosList)));
 
index 4b41c09..b9e876b 100644 (file)
@@ -93,6 +93,9 @@
                        <trans-unit id="colPos.I.0" xml:space="preserve">
                                <source>Left</source>
                        </trans-unit>
+                       <trans-unit id="colPos.I.1" xml:space="preserve">
+                               <source>Normal</source>
+                       </trans-unit>
                        <trans-unit id="colPos.I.2" xml:space="preserve">
                                <source>Right</source>
                        </trans-unit>
index a815b86..64f2379 100644 (file)
@@ -24,9 +24,28 @@ td.t3-page-column {
        left: 4px;
 }
 
+.t3-page-ce-wrapper {
+       padding: 12px 0 5px 0;
+}
+
+.t3-page-ce-wrapper-new-ce {
+       margin-bottom: 7px;
+       margin-left: 5px;
+}
+
+.t3-page-ce-droptarget {
+       padding: 5px;
+}
+
 .t3-page-ce {
        margin-bottom: 5px;
        min-width: 150px;
+       opacity: .70;
+}
+
+.t3-page-ce:hover {
+       opacity: 1;
+       cursor: move;
 }
 
 .t3-page-ce h4 {
index d4820aa..b37d4a4 100644 (file)
@@ -26,6 +26,15 @@ Web > Page
        width: 1px;
 }
 
+.t3-page-ce-wrapper {
+       border-left: 2px solid #c8c8c8;
+}
+
+.t3-page-ce-droptarget {
+       visibility: hidden;
+       background-color: orange;
+}
+
 .t3-page-ce-header {
        background-color: #cacaca;
 }