[FEATURE] Integrate accessible content rendering
authorOliver Hader <oliver@typo3.org>
Sun, 6 Nov 2011 15:34:09 +0000 (16:34 +0100)
committerSteffen Ritter <info@rs-websystems.de>
Tue, 29 Nov 2011 12:19:38 +0000 (13:19 +0100)
These changes are a result of the BLE project and are taken from
git://git.typo3.org/TYPO3v4/Incubator.git project-accessibility

Change-Id: I4b87d916bf95fd1670fea1d01201e2e2242cbb36
Resolves: #31767
Related: #31768
Reviewed-on: http://review.typo3.org/6638
Reviewed-by: Oliver Hader
Tested-by: Oliver Hader
Reviewed-by: Steffen Ritter
Tested-by: Steffen Ritter
typo3/class.browse_links.php
typo3/sysext/cms/ext_tables.sql
typo3/sysext/cms/locallang_ttc.xlf
typo3/sysext/cms/tbl_tt_content.php
typo3/sysext/cms/tslib/class.tslib_content.php
typo3/sysext/cms/tslib/class.tslib_menu.php
typo3/sysext/cms/tslib/class.tslib_pagegen.php
typo3/sysext/css_styled_content/pi1/class.tx_cssstyledcontent_pi1.php
typo3/sysext/css_styled_content/pi1/locallang.xlf
typo3/sysext/css_styled_content/static/constants.txt
typo3/sysext/css_styled_content/static/setup.txt

index 527d01a..af5907e 100644 (file)
@@ -902,6 +902,7 @@ class browse_links {
                        $P2['fieldChangeFuncHash'] = t3lib_div::hmac(serialize($this->P['fieldChangeFunc']));
                        $P2['params']['allowedExtensions']=$this->P['params']['allowedExtensions'];
                        $P2['params']['blindLinkOptions']=$this->P['params']['blindLinkOptions'];
+                       $P2['params']['blindLinkFields'] = $this->P['params']['blindLinkFields'];
                        $addPassOnParams.=t3lib_div::implodeArrayForUrl('P',$P2);
 
                        $JScode.='
@@ -1208,6 +1209,13 @@ class browse_links {
                        $allowedItems = $hookObject->addAllowedItems($allowedItems);
                }
 
+                       // Removing link fields if configured
+               $allowedFields = array_diff(
+                       array('target', 'title', 'class', 'params'),
+                       t3lib_div::trimExplode(',', $this->thisConfig['blindLinkFields'], TRUE),
+                       t3lib_div::trimExplode(',', $this->P['params']['blindLinkFields'], TRUE)
+               );
+
                        // if $this->act is not allowed, default to first allowed
                if (!in_array($this->act, $allowedItems)) {
                        $this->act = reset($allowedItems);
@@ -1443,10 +1451,11 @@ class browse_links {
                        break;
                }
 
-               $content .= '
-                       <!--
-                               Selecting params for link:
-                       -->
+               if (in_array('params', $allowedFields, TRUE)) {
+                       $content .= '
+                               <!--
+                                       Selecting params for link:
+                               -->
                                <form action="" name="lparamsform" id="lparamsform">
                                        <table border="0" cellpadding="2" cellspacing="1" id="typo3-linkParams">
                                                <tr>
@@ -1455,10 +1464,14 @@ class browse_links {
                                                </tr>
                                        </table>
                                </form>
+                       ';
+               }
 
-                       <!--
-                               Selecting class for link:
-                       -->
+               if (in_array('class', $allowedFields, TRUE)) {
+                       $content .= '
+                               <!--
+                                       Selecting class for link:
+                               -->
                                <form action="" name="lclassform" id="lclassform">
                                        <table border="0" cellpadding="2" cellspacing="1" id="typo3-linkClass">
                                                <tr>
@@ -1467,10 +1480,14 @@ class browse_links {
                                                </tr>
                                        </table>
                                </form>
+                       ';
+               }
 
-                       <!--
-                               Selecting title for link:
-                       -->
+               if (in_array('title', $allowedFields, TRUE)) {
+                       $content .= '
+                               <!--
+                                       Selecting title for link:
+                               -->
                                <form action="" name="ltitleform" id="ltitleform">
                                        <table border="0" cellpadding="2" cellspacing="1" id="typo3-linkTitle">
                                                <tr>
@@ -1479,10 +1496,11 @@ class browse_links {
                                                </tr>
                                        </table>
                                </form>
-';
+                       ';
+               }
 
                        // Target:
-               if ($this->act!='mail') {
+               if ($this->act != 'mail' && in_array('target', $allowedFields, TRUE)) {
                        $ltarget='
 
 
index 3d825af..9f34328 100755 (executable)
@@ -329,6 +329,7 @@ CREATE TABLE tt_content (
   sectionIndex tinyint(3) unsigned DEFAULT '0' NOT NULL,
   linkToTop tinyint(3) unsigned DEFAULT '0' NOT NULL,
   filelink_size tinyint(3) unsigned DEFAULT '0' NOT NULL,
+  target varchar(30) DEFAULT '' NOT NULL,
   section_frame tinyint(3) unsigned DEFAULT '0' NOT NULL,
   date int(10) unsigned DEFAULT '0' NOT NULL,
   splash_layout varchar(30) DEFAULT '0' NOT NULL,
@@ -340,6 +341,9 @@ CREATE TABLE tt_content (
   sys_language_uid int(11) DEFAULT '0' NOT NULL,
   tx_impexp_origuid int(11) DEFAULT '0' NOT NULL,
   pi_flexform mediumtext,
+  accessibility_title varchar(30) DEFAULT '' NOT NULL,
+  accessibility_bypass tinyint(3) unsigned DEFAULT '0' NOT NULL,
+  accessibility_bypass_text varchar(30) DEFAULT '' NOT NULL,
   l18n_parent int(11) DEFAULT '0' NOT NULL,
   l18n_diffsource mediumblob,
 
index 7c49fa2..217bea8 100644 (file)
                        <trans-unit id="filelink_size_formlabel" xml:space="preserve">
                                <source>Display File Size Information</source>
                        </trans-unit>
+                       <trans-unit id="target" xml:space="preserve">
+                               <source>Target:</source>
+                       </trans-unit>
+                       <trans-unit id="target.I.1" xml:space="preserve">
+                               <source>New window</source>
+                       </trans-unit>
                        <trans-unit id="records" xml:space="preserve">
                                <source>Items:</source>
                        </trans-unit>
                        <trans-unit id="pi_flexform" xml:space="preserve">
                                <source>Plugin Options</source>
                        </trans-unit>
+                       <trans-unit id="accessibility_title" xml:space="preserve">
+                               <source>Block title</source>
+                       </trans-unit>
+                       <trans-unit id="accessibility_bypass" xml:space="preserve">
+                               <source>Add link to bypass block</source>
+                       </trans-unit>
+                       <trans-unit id="accessibility_bypass_text" xml:space="preserve">
+                               <source>Link text to bypass block</source>
+                       </trans-unit>
                        <trans-unit id="ALT.imgOptions" xml:space="preserve">
                                <source>Image Options</source>
                        </trans-unit>
                        <trans-unit id="bodytext.ALT.html" xml:space="preserve">
                                <source>HTML:</source>
                        </trans-unit>
+                       <trans-unit id="menu.ALT.accessibility_title_formlabel" xml:space="preserve">
+                               <source>Menu block title</source>
+                       </trans-unit>
+                       <trans-unit id="menu.ALT.accessibility_bypass_formlabel" xml:space="preserve">
+                               <source>Add link to bypass navigation block</source>
+                       </trans-unit>
+                       <trans-unit id="menu.ALT.accessibility_bypass_text_formlabel" xml:space="preserve">
+                               <source>Link text to bypass navigation block</source>
+                       </trans-unit>
                        <trans-unit id="tabs.text" xml:space="preserve">
                                <source>Text</source>
                        </trans-unit>
                        <trans-unit id="palette.menu" xml:space="preserve">
                                <source>Menu and Sitemap</source>
                        </trans-unit>
+                       <trans-unit id="palette.menu_accessibility" xml:space="preserve">
+                               <source>Accessibility</source>
+                       </trans-unit>
                        <trans-unit id="palette.uploads_layout" xml:space="preserve">
                                <source>Filelinks Layout</source>
                        </trans-unit>
index 37c677b..a3d0f96 100755 (executable)
@@ -1140,6 +1140,21 @@ $TCA['tt_content'] = array(
                                'type' => 'text',
                                'cols' => '30',
                                'rows' => '3',
+                               'wizards' => array(
+                                       '_PADDING' => 2,
+                                       'link' => array(
+                                               'type' => 'popup',
+                                               'title' => 'LLL:EXT:cms/locallang_ttc.xml:image_link_formlabel',
+                                               'icon' => 'link_popup.gif',
+                                               'script' => 'browse_links.php?mode=wizard',
+                                               'params' => array(
+                                                       'blindLinkOptions' => 'folder,file,mail,spec',
+                                                       'blindLinkFields' => 'target,title,class,params'
+                                               ),
+                                               'JSopenParams' => 'height=300,width=500,status=0,menubar=0,scrollbars=1',
+                                       ),
+                               ),
+                               'softref' => 'typolink[linkList]',
                        ),
                ),
                'cols' => array(
@@ -1445,6 +1460,24 @@ $TCA['tt_content'] = array(
                                ),
                        ),
                ),
+               'target' => array(
+                       'label' => 'LLL:EXT:cms/locallang_ttc.xml:target',
+                       'config' => array(
+                               'type' => 'input',
+                               'size' => 20,
+                               'eval' => 'trim',
+                               'wizards' => array(
+                                       'target_picker' => array(
+                                               'type' => 'select',
+                                               'mode' => '',
+                                               'items' => array(
+                                                       array('LLL:EXT:cms/locallang_ttc.xml:target.I.1', '_blank')
+                                               )
+                                       )
+                               ),
+                               'default' => '',
+                       )
+               ),
                'records' => array(
                        'label' => 'LLL:EXT:cms/locallang_ttc.xml:records',
                        'config' => array(
@@ -1646,6 +1679,35 @@ $TCA['tt_content'] = array(
                                'type'=>'passthrough',
                        ),
                ),
+               'accessibility_title' => array(
+                       'label' => 'LLL:EXT:cms/locallang_ttc.xml:accessibility_title',
+                       'config' => array(
+                               'type' => 'input',
+                               'size' => 20,
+                               'eval' => 'trim',
+                               'default' => '',
+                       )
+               ),
+               'accessibility_bypass' => array(
+                       'label' => 'LLL:EXT:cms/locallang_ttc.xml:accessibility_bypass',
+                       'config' => array(
+                               'type' => 'check',
+                               'items' => array(
+                                       '1' => array(
+                                               '0' => 'LLL:EXT:lang/locallang_core.xml:labels.enabled',
+                                       )
+                               )
+                       )
+               ),
+               'accessibility_bypass_text' => array(
+                       'label' => 'LLL:EXT:cms/locallang_ttc.xml:accessibility_bypass_text',
+                       'config' => array(
+                               'type' => 'input',
+                               'size' => 20,
+                               'eval' => 'trim',
+                               'default' => '',
+                       )
+               ),
                'l18n_diffsource' => array(
                        'config'=>array(
                                'type'=>'passthrough',
@@ -1824,6 +1886,7 @@ $TCA['tt_content'] = array(
                                        '--palette--;LLL:EXT:cms/locallang_ttc.xml:palette.general;general,
                                        --palette--;LLL:EXT:cms/locallang_ttc.xml:palette.header;header,
                                        --palette--;LLL:EXT:cms/locallang_ttc.xml:palette.menu;menu,
+                                       --palette--;LLL:EXT:cms/locallang_ttc.xml:palette.menu_accessibility;menu_accessibility,
                                --div--;LLL:EXT:cms/locallang_ttc.xml:tabs.appearance,
                                        --palette--;LLL:EXT:cms/locallang_ttc.xml:palette.frames;frames,
                                --div--;LLL:EXT:cms/locallang_ttc.xml:tabs.access,
@@ -2013,7 +2076,7 @@ $TCA['tt_content'] = array(
                        'canNotCollapse' => 1,
                ),
                'uploads' => array(
-                       'showitem' => 'select_key;LLL:EXT:cms/locallang_ttc.xml:select_key.ALT.uploads_formlabel, --linebreak--, media;LLL:EXT:cms/locallang_ttc.xml:media.ALT.uploads_formlabel, imagecaption;LLL:EXT:cms/locallang_ttc.xml:imagecaption.ALT.uploads_formlabel;;nowrap',
+                       'showitem' => 'select_key;LLL:EXT:cms/locallang_ttc.xml:select_key.ALT.uploads_formlabel, --linebreak--, media;LLL:EXT:cms/locallang_ttc.xml:media.ALT.uploads_formlabel, --linebreak--, target, --linebreak--, imagecaption;LLL:EXT:cms/locallang_ttc.xml:imagecaption.ALT.uploads_formlabel, titleText;LLL:EXT:cms/locallang_ttc.xml:titleText_formlabel, --linebreak--, altText;LLL:EXT:cms/locallang_ttc.xml:altText_formlabel',
                        'canNotCollapse' => 1,
                ),
                'mailform' => array(
@@ -2028,6 +2091,10 @@ $TCA['tt_content'] = array(
                        'showitem' => 'menu_type;LLL:EXT:cms/locallang_ttc.xml:menu_type_formlabel, --linebreak--, pages;LLL:EXT:cms/locallang_ttc.xml:pages.ALT.menu_formlabel',
                        'canNotCollapse' => 1,
                ),
+               'menu_accessibility' => array(
+                       'showitem' => 'accessibility_title;LLL:EXT:cms/locallang_ttc.xml:menu.ALT.accessibility_title_formlabel, --linebreak--, accessibility_bypass;LLL:EXT:cms/locallang_ttc.xml:menu.ALT.accessibility_bypass_formlabel, accessibility_bypass_text;LLL:EXT:cms/locallang_ttc.xml:menu.ALT.accessibility_bypass_text_formlabel',
+                       'canNotCollapse' => 1,
+               ),
                'visibility' => array(
                        'showitem' => 'hidden;LLL:EXT:cms/locallang_ttc.xml:hidden_formlabel, sectionIndex;LLL:EXT:cms/locallang_ttc.xml:sectionIndex_formlabel, linkToTop;LLL:EXT:cms/locallang_ttc.xml:linkToTop_formlabel',
                        'canNotCollapse' => 1,
@@ -2056,4 +2123,4 @@ $TCA['tt_content'] = array(
 );
 
 
-?>
\ No newline at end of file
+?>
index d06cdc9..5c4281c 100644 (file)
@@ -1165,7 +1165,9 @@ class tslib_cObj {
                                t3lib_div::rawUrlEncodeFP($info[3])) . '" width="' . $info[0] . '" height="' . $info[1] . '"' .
                                $this->getBorderAttr(' border="' . intval($conf['border']) . '"') .
                                $params .
-                               ($altParam) . ' />';
+                               ($altParam) .
+                               (!empty($GLOBALS['TSFE']->xhtmlDoctype) ? ' /' : '') .
+                               '>';
                        $linkWrap = isset($conf['linkWrap.'])
                                ? $this->stdWrap($conf['linkWrap'], $conf['linkWrap.'])
                                : $conf['linkWrap'];
@@ -1253,7 +1255,7 @@ class tslib_cObj {
 
                                $params = '&md5=' . $md5_value;
                                foreach (str_split($parametersEncoded, 64) as $index => $chunk) {
-                                       $params .= '&parameters[' . $index . ']=' . rawurlencode($chunk);
+                                       $params .= '&parameters' . rawurlencode('[') . $index . rawurlencode(']') . '=' . rawurlencode($chunk);
                                }
 
                                $url = $GLOBALS['TSFE']->absRefPrefix . 'index.php?eID=tx_cms_showpic&file=' . rawurlencode($imageFile) . $params;
@@ -1412,9 +1414,11 @@ class tslib_cObj {
                $titleText = isset($conf['titleText.'])
                        ? trim($this->stdWrap($conf['titleText'], $conf['titleText.']))
                        : trim($conf['titleText']);
-               $longDesc = isset($conf['longdescURL.'])
-                       ? trim($this->stdWrap($conf['longdescURL'], $conf['longdescURL.']))
-                       : trim($conf['longdescURL']);
+               if (isset($conf['longdescURL.']) && $GLOBALS['TSFE']->config['config']['doctype'] != 'html5') {
+                       $longDesc = $this->typoLink_URL($conf['longdescURL.']);
+               } else {
+                       $longDesc = trim($conf['longdescURL']);
+               }
 
                        // "alt":
                $altParam = ' alt="' . htmlspecialchars($altText) . '"';
@@ -1770,7 +1774,8 @@ class tslib_cObj {
                if ($fieldList) {
                        $fArr = t3lib_div::trimExplode(',', $fieldList, 1);
                        foreach ($fArr as $field) {
-                               $markContentArray['###' . $prefix . $field . '###'] = $nl2br ? nl2br($row[$field]) : $row[$field];
+                               $markContentArray['###' . $prefix . $field . '###'] =
+                                       $nl2br ? nl2br($row[$field], !empty($GLOBALS['TSFE']->xhtmlDoctype)) : $row[$field];
                        }
                } else {
                        if (is_array($row)) {
@@ -1780,7 +1785,8 @@ class tslib_cObj {
                                                        $value = htmlspecialchars($value);
                                                }
 
-                                               $markContentArray['###' . $prefix . $field . '###'] = $nl2br ? nl2br($value) : $value;
+                                               $markContentArray['###' . $prefix . $field . '###'] =
+                                                       $nl2br ? nl2br($value, !empty($GLOBALS['TSFE']->xhtmlDoctype)) : $value;
                                        }
                                }
                        }
@@ -2595,14 +2601,15 @@ class tslib_cObj {
 
        /**
         * br
-        * Searches for single line breaks and replaces them with a <br /> tag
+        * Searches for single line breaks and replaces them with a <br />/<br> tag
+        * according to the doctype
         *
         * @param       string          Input value undergoing processing in this function.
         * @param       array           stdWrap properties for br.
         * @return      string          The processed input value
         */
        public function stdWrap_br($content = '', $conf = array()) {
-               $content = nl2br($content);
+               $content = nl2br($content, !empty($GLOBALS['TSFE']->xhtmlDoctype));
                return $content;
        }
 
@@ -3916,6 +3923,15 @@ class tslib_cObj {
                if (@is_file($theFile)) {
                        $theFileEnc = str_replace('%2F', '/', rawurlencode($theFile));
 
+                       $title = $conf['title'];
+                       if (isset($conf['title.'])) {
+                               $title = $this->stdWrap($title, $conf['title.']);
+                       }
+
+                       $target = $conf['target'];
+                       if (isset($conf['target.'])) {
+                               $target = $this->stdWrap($target, $conf['target.']);
+                       }
                                // the jumpURL feature will be taken care of by typoLink, only "jumpurl.secure = 1" is applyable needed for special link creation
                        if ($conf['jumpurl.']['secure']) {
                                $alternativeJumpUrlParameter = isset($conf['jumpurl.']['parameter.'])
@@ -3923,14 +3939,16 @@ class tslib_cObj {
                                        : $conf['jumpurl.']['parameter'];
                                $typoLinkConf = array(
                                        'parameter' => ($alternativeJumpUrlParameter ? $alternativeJumpUrlParameter : ($GLOBALS['TSFE']->id . ',' . $GLOBALS['TSFE']->type)),
-                                       'fileTarget' => $conf['target'],
+                                       'fileTarget' => $target,
+                                       'title' => $title,
                                        'ATagParams' => $this->getATagParams($conf),
                                        'additionalParams' => '&jumpurl=' . rawurlencode($theFileEnc) . $this->locDataJU($theFileEnc, $conf['jumpurl.']['secure.']) . $GLOBALS['TSFE']->getMethodUrlIdToken
                                );
                        } else {
                                $typoLinkConf = array(
                                        'parameter' => $theFileEnc,
-                                       'fileTarget' => $conf['target'],
+                                       'fileTarget' => $target,
+                                       'title' => $title,
                                        'ATagParams' => $this->getATagParams($conf)
                                );
                        }
@@ -4000,7 +4018,7 @@ class tslib_cObj {
                                                '" width="' . $iconWidth . '" height="' . $iconHeight . '"' . $this->getBorderAttr(' border="0"') .
                                                $this->getAltParam($conf) . ' />';
                                }
-                               if ($conf['icon_link']) {
+                               if ($conf['icon_link'] && !$conf['combinedLink']) {
                                        $icon = $this->wrap($icon, $theLinkWrap);
                                }
                                $icon = isset($conf['icon.'])
@@ -4025,16 +4043,30 @@ class tslib_cObj {
                        $wrap = isset($conf['wrap.'])
                                ? $this->stdWrap($conf['wrap'], $conf['wrap.'])
                                : $conf['wrap'];
-                       if ($conf['ATagBeforeWrap']) {
-                               $theValue = $this->wrap($this->wrap($theValue, $wrap), $theLinkWrap);
+                       if ($conf['combinedLink']) {
+                               $theValue = $icon . $theValue;
+                               if ($conf['ATagBeforeWrap']) {
+                                       $theValue = $this->wrap($this->wrap($theValue, $wrap), $theLinkWrap);
+                               } else {
+                                       $theValue = $this->wrap($this->wrap($theValue, $theLinkWrap), $wrap);
+                               }
+                               $file = isset($conf['file.'])
+                                       ? $this->stdWrap($theValue, $conf['file.'])
+                                       : $theValue;
+                                       // output
+                               $output = $file . $size;
                        } else {
-                               $theValue = $this->wrap($this->wrap($theValue, $theLinkWrap), $wrap);
+                               if ($conf['ATagBeforeWrap']) {
+                                       $theValue = $this->wrap($this->wrap($theValue, $wrap), $theLinkWrap);
+                               } else {
+                                       $theValue = $this->wrap($this->wrap($theValue, $theLinkWrap), $wrap);
+                               }
+                               $file = isset($conf['file.'])
+                                       ? $this->stdWrap($theValue, $conf['file.'])
+                                       : $theValue;
+                                       // output
+                               $output = $icon . $file . $size;
                        }
-                       $file = isset($conf['file.'])
-                               ? $this->stdWrap($theValue, $conf['file.'])
-                               : $theValue;
-                               // output
-                       $output = $icon . $file . $size;
                        if(isset($conf['stdWrap.'])) {
                                $output = $this->stdWrap($output, $conf['stdWrap.']);
                        }
@@ -4826,7 +4858,17 @@ class tslib_cObj {
                                                $linktxt = substr($linktxt, 0, -1);
                                        }
                                }
-                               $target = isset($conf['extTarget']) ? $conf['extTarget'] : $GLOBALS['TSFE']->extTarget;
+
+                               if (isset($conf['extTarget'])) {
+                                       if (isset($conf['extTarget.'])) {
+                                               $target = $this->stdWrap($conf['extTarget'], $conf['extTarget.']);
+                                       } else {
+                                               $target = $conf['extTarget'];
+                                       }
+                               } else {
+                                       $target = $GLOBALS['TSFE']->extTarget;
+                               }
+
                                if ($GLOBALS['TSFE']->config['config']['jumpurl_enable']) {
                                        $res = '<a' . ' href="' . htmlspecialchars($GLOBALS['TSFE']->absRefPrefix .
                                                $GLOBALS['TSFE']->config['mainScript'] . $initP .
@@ -5527,7 +5569,11 @@ class tslib_cObj {
                        }
 
                                // Internal target:
-                       $target = isset($conf['target']) ? $conf['target'] : $GLOBALS['TSFE']->intTarget;
+                       if ($GLOBALS['TSFE']->dtdAllowsFrames) {
+                               $target = isset($conf['target']) ? $conf['target'] : $GLOBALS['TSFE']->intTarget;
+                       } else {
+                               $target = isset($conf['target']) ? $conf['target'] : '';
+                       }
                        if ($conf['target.']) {
                                $target = $this->stdWrap($target, $conf['target.']);
                        }
@@ -5566,7 +5612,11 @@ class tslib_cObj {
                                }
 
                                if ($pU['scheme'] || ($isLocalFile != 1 && $urlChar && (!$containsSlash || $urlChar < $fileChar))) { // url (external): If doubleSlash or if a '.' comes before a '/'.
-                                       $target = isset($conf['extTarget']) ? $conf['extTarget'] : $GLOBALS['TSFE']->extTarget;
+                                       if ($GLOBALS['TSFE']->dtdAllowsFrames) {
+                                               $target = isset($conf['extTarget']) ? $conf['extTarget'] : $GLOBALS['TSFE']->extTarget;
+                                       } else {
+                                               $target = isset($conf['extTarget']) ? $conf['extTarget'] : '';
+                                       }
                                        if ($conf['extTarget.']) {
                                                $target = $this->stdWrap($target, $conf['extTarget.']);
                                        }
index b01e913..797fead 100644 (file)
@@ -738,51 +738,19 @@ class tslib_menu {
                                                }
                                        break;
                                }
+                               if ($this->mconf['sectionIndex']) {
+                                       $sectionIndexes = array();
+
+                                       foreach ($temp as $page) {
+                                               $sectionIndexes = $sectionIndexes + $this->sectionIndex($altSortField, $page['uid']);
+                                       }
+
+                                       $temp = $sectionIndexes;
+                               }
                        } elseif (is_array($this->alternativeMenuTempArray))    {       // Setting $temp array if not level 1.
                                $temp = $this->alternativeMenuTempArray;
                        } elseif ($this->mconf['sectionIndex']) {
-                               if ($GLOBALS['TSFE']->sys_language_uid && count($this->sys_page->getPageOverlay($this->id)))    {
-                                       $sys_language_uid = intval($GLOBALS['TSFE']->sys_language_uid);
-                               } else $sys_language_uid=0;
-
-                               $selectSetup = Array(
-                                       'pidInList'=>$this->id,
-                                       'orderBy'=>$altSortField,
-                                       'where' => 'colPos=0 AND sys_language_uid='.$sys_language_uid,
-                                       'andWhere' => 'sectionIndex!=0'
-                                       );
-                               switch($this->mconf['sectionIndex.']['type'])   {
-                                       case 'all':
-                                               unset($selectSetup['andWhere']);
-                                       break;
-                                       case 'header':
-                                               $selectSetup['andWhere'] .= ' AND header_layout!=100 AND header!=""';
-                                       break;
-                               }
-                               $basePageRow=$this->sys_page->getPage($this->id);
-                               if (is_array($basePageRow))     {
-                                       $res = $this->parent_cObj->exec_getQuery('tt_content',  $selectSetup);
-                                       while ($row = $GLOBALS['TYPO3_DB']->sql_fetch_assoc($res))      {
-                                               $GLOBALS['TSFE']->sys_page->versionOL('tt_content',$row);
-
-                                               if (is_array($row))     {
-                                                       $temp[$row['uid']] = $basePageRow;
-                                                       $temp[$row['uid']]['title'] = $row['header'];
-                                                       $temp[$row['uid']]['nav_title'] = $row['header'];
-                                                       $temp[$row['uid']]['subtitle'] = $row['subheader'];
-                                                       $temp[$row['uid']]['starttime'] = $row['starttime'];
-                                                       $temp[$row['uid']]['endtime'] = $row['endtime'];
-                                                       $temp[$row['uid']]['fe_group'] = $row['fe_group'];
-                                                       $temp[$row['uid']]['media'] = $row['media'];
-
-                                                       $temp[$row['uid']]['header_layout'] = $row['header_layout'];
-                                                       $temp[$row['uid']]['bodytext'] = $row['bodytext'];
-                                                       $temp[$row['uid']]['image'] = $row['image'];
-
-                                                       $temp[$row['uid']]['sectionIndex_uid'] = $row['uid'];
-                                               }
-                                       }
-                               }
+                               $temp = $this->sectionIndex($altSortField);
                        } else {        // Default:
                                $temp = $this->sys_page->getMenu($this->id,'*',$altSortField);          // gets the menu
                        }
@@ -1154,7 +1122,13 @@ class tslib_menu {
                }
 
                        // Setting main target:
-               $mainTarget = $altTarget ? $altTarget : $this->mconf['target'];
+               if ($altTarget) {
+                       $mainTarget = $altTarget;
+               } elseif ($this->mconf['target.']) {
+                       $mainTarget = $this->parent_cObj->stdWrap($this->mconf['target'], $this->mconf['target.']);
+               } else {
+                       $mainTarget = $this->mconf['target'];
+               }
 
                        // Creating link:
                if ($this->mconf['collapse'] && $this->isActive($this->menuArr[$key]['uid'], $this->getMPvar($key)))    {
@@ -1601,6 +1575,72 @@ class tslib_menu {
                return $LD;
        }
 
+       /**
+        * Generates a list of content objects with sectionIndex enabled
+        * available on a specific page
+        *
+        * Used for menu's with sectionIndex enabled
+        *
+        * @param string $altSortField Alternative sorting field
+        * @param integer $pid The page id to search for sections
+        * @return array
+        */
+       protected function sectionIndex($altSortField, $pid = NULL) {
+               $where = 'colPos=0';
+
+               if (!$pid) {
+                       $pid = $this->id;
+                       if ($GLOBALS['TSFE']->sys_language_uid && count($this->sys_page->getPageOverlay($pid))) {
+                               $where .= ' AND sys_language_uid=' . intval($GLOBALS['TSFE']->sys_language_uid);
+                       } else {
+                               $where .= ' AND sys_language_uid=0';
+                       }
+               }
+
+               $selectSetup = array(
+                       'pidInList' => $pid,
+                       'orderBy' => $altSortField,
+                       'where' => $where,
+                       'andWhere' => 'sectionIndex!=0'
+               );
+               switch ($this->mconf['sectionIndex.']['type']) {
+                       case 'all':
+                               unset($selectSetup['andWhere']);
+                       break;
+                       case 'header':
+                               $selectSetup['andWhere'] .= ' AND header_layout!=100 AND header!=""';
+                       break;
+               }
+               $basePageRow = $this->sys_page->getPage($pid);
+               $result = array();
+               if (is_array($basePageRow)) {
+                       $res = $this->parent_cObj->exec_getQuery('tt_content', $selectSetup);
+                       while ($row = $GLOBALS['TYPO3_DB']->sql_fetch_assoc($res)) {
+                               $GLOBALS['TSFE']->sys_page->versionOL('tt_content', $row);
+
+                               if (is_array($row)) {
+                                       $result[$row['uid']] = $basePageRow;
+                                       $result[$row['uid']]['title'] = $row['header'];
+                                       $result[$row['uid']]['nav_title'] = $row['header'];
+                                       $result[$row['uid']]['subtitle'] = $row['subheader'];
+                                       $result[$row['uid']]['starttime'] = $row['starttime'];
+                                       $result[$row['uid']]['endtime'] = $row['endtime'];
+                                       $result[$row['uid']]['fe_group'] = $row['fe_group'];
+                                       $result[$row['uid']]['media'] = $row['media'];
+
+                                       $result[$row['uid']]['header_layout'] = $row['header_layout'];
+                                       $result[$row['uid']]['bodytext'] = $row['bodytext'];
+                                       $result[$row['uid']]['image'] = $row['image'];
+
+                                       $result[$row['uid']]['sectionIndex_uid'] = $row['uid'];
+                               }
+                       }
+                       $GLOBALS['TYPO3_DB']->sql_free_result();
+               }
+
+               return $result;
+       }
+
 }
 
 
index 93ec274..5d3daa5 100644 (file)
@@ -177,6 +177,19 @@ class TSpagegen {
                        $GLOBALS['TSFE']->linkVars='';
                }
 
+                       // dtdAllowsFrames indicates whether to use the target attribute in links
+               $GLOBALS['TSFE']->dtdAllowsFrames = FALSE;
+               if ($GLOBALS['TSFE']->config['config']['doctype']) {
+                       if (in_array(
+                               (string) $GLOBALS['TSFE']->config['config']['doctype'],
+                               array('xhtml_frames', 'html5')
+                       )) {
+                               $GLOBALS['TSFE']->dtdAllowsFrames = TRUE;
+                       }
+               } else {
+                       $GLOBALS['TSFE']->dtdAllowsFrames = TRUE;
+               }
+
                        // Setting XHTML-doctype from doctype
                if (!$GLOBALS['TSFE']->config['config']['xhtmlDoctype'])        {
                        $GLOBALS['TSFE']->config['config']['xhtmlDoctype'] = $GLOBALS['TSFE']->config['config']['doctype'];
@@ -441,7 +454,15 @@ class TSpagegen {
                } else {
                        $_attr = '';
                }
-               $pageRenderer->setHtmlTag('<html' . ($_attr ? ' ' . $_attr : '') . '>');
+
+               $htmlTag = '<html' . ($_attr ? ' ' . $_attr : '') . '>';
+               if (isset($GLOBALS['TSFE']->config['config']['htmlTag_stdWrap.'])) {
+                          $htmlTag = $GLOBALS['TSFE']->cObj->stdWrap(
+                                          $htmlTag,
+                                          $GLOBALS['TSFE']->config['config']['htmlTag_stdWrap.']
+                          );
+               }
+               $pageRenderer->setHtmlTag($htmlTag);
 
                        // Head tag:
                $headTag = $GLOBALS['TSFE']->pSetup['headTag'] ? $GLOBALS['TSFE']->pSetup['headTag'] : '<head>';
@@ -475,11 +496,17 @@ class TSpagegen {
                }
 
                        // Including CSS files
-               if (is_array($GLOBALS['TSFE']->tmpl->setup['plugin.']) && empty($GLOBALS['TSFE']->config['config']['removeDefaultCss'])) {
+               if (is_array($GLOBALS['TSFE']->tmpl->setup['plugin.'])) {
                        $temp_styleLines = array ();
                        foreach ($GLOBALS['TSFE']->tmpl->setup['plugin.'] as $key => $iCSScode) {
-                               if (is_array($iCSScode) && $iCSScode['_CSS_DEFAULT_STYLE']) {
-                                       $temp_styleLines[] = '/* default styles for extension "' . substr($key, 0, - 1) . '" */' . LF . $iCSScode['_CSS_DEFAULT_STYLE'];
+                               if (is_array($iCSScode)) {
+                                       if ($iCSScode['_CSS_DEFAULT_STYLE'] && empty($GLOBALS['TSFE']->config['config']['removeDefaultCss'])) {
+                                               $temp_styleLines[] = '/* default styles for extension "' . substr($key, 0, - 1) . '" */' . LF . $iCSScode['_CSS_DEFAULT_STYLE'];
+                                       }
+                                       if ($iCSScode['_CSS_PAGE_STYLE']) {
+                                               $temp_styleLines[] = '/* specific page styles for extension "' . substr($key, 0, - 1) . '" */' .
+                                                       LF . implode(LF, $iCSScode['_CSS_PAGE_STYLE']);
+                                       }
                                }
                        }
                        if (count($temp_styleLines)) {
index f87a0f4..477bff1 100755 (executable)
@@ -127,7 +127,6 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
 
                                // get flexform values
                        $caption = trim(htmlspecialchars($this->pi_getFFvalue($this->cObj->data['pi_flexform'], 'acctables_caption')));
-                       $summary = trim(htmlspecialchars($this->pi_getFFvalue($this->cObj->data['pi_flexform'], 'acctables_summary')));
                        $useTfoot = trim($this->pi_getFFvalue($this->cObj->data['pi_flexform'], 'acctables_tfoot'));
                        $headerPos = $this->pi_getFFvalue($this->cObj->data['pi_flexform'], 'acctables_headerpos');
                        $noStyles = $this->pi_getFFvalue($this->cObj->data['pi_flexform'], 'acctables_nostyles');
@@ -225,7 +224,8 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
                                // Table tag params.
                        $tableTagParams = $this->getTableAttributes($conf,$type);
                        if (!$noStyles) {
-                               $tableTagParams['class'] = 'contenttable contenttable-'.$type.($tableClass?' '.$tableClass:'');
+                               $tableTagParams['class'] = 'contenttable contenttable-' . $type .
+                                       ($tableClass ? ' ' . $tableClass : '') . $tableTagParams['class'];
                        } elseif ($tableClass) {
                                $tableTagParams['class'] = $tableClass;
                        }
@@ -233,8 +233,8 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
 
                                // Compile table output:
                        $out = '
-                               <table '.t3lib_div::implodeAttributes($tableTagParams).($summary?' summary="'.$summary.'"':'').'>'.     // Omitted xhtmlSafe argument TRUE - none of the values will be needed to be converted anyways, no need to spend processing time on that.
-                               $tableContents.'
+                               <table ' . t3lib_div::implodeAttributes($tableTagParams) . '>' .
+                               $tableContents . '
                                </table>';
 
                                // Calling stdWrap:
@@ -261,6 +261,8 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
                if ($hookObj = $this->hookRequest('render_uploads')) {
                        return $hookObj->render_uploads($content,$conf);
                } else {
+                               // Loading language-labels
+                       $this->pi_loadLL();
 
                        $out = '';
 
@@ -294,12 +296,29 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
                                        // Get the descriptions for the files (if any):
                                $descriptions = t3lib_div::trimExplode(LF,$this->cObj->data['imagecaption']);
 
+                                       // Get the titles for the files (if any)
+                               $titles = t3lib_div::trimExplode(LF, $this->cObj->data['titleText']);
+
+                                       // Get the alternative text for icons/thumbnails
+                               $altTexts = t3lib_div::trimExplode(LF, $this->cObj->data['altText']);
+
+                                       // Add the target to linkProc when explicitly set
+                               if ($this->cObj->data['target']) {
+                                       $conf['linkProc.']['target'] = $this->cObj->data['target'];
+                                       unset($conf['linkProc.']['target.']);
+                               }
+
                                        // Adding hardcoded TS to linkProc configuration:
                                $conf['linkProc.']['path.']['current'] = 1;
-                               $conf['linkProc.']['icon'] = 1; // Always render icon - is inserted by PHP if needed.
-                               $conf['linkProc.']['icon.']['wrap'] = ' | //**//';      // Temporary, internal split-token!
-                               $conf['linkProc.']['icon_link'] = 1;    // ALways link the icon
+                               if ($conf['linkProc.']['combinedLink']) {
+                                       $conf['linkProc.']['icon'] = $type > 0 ? 1 : 0;
+                               } else {
+                                       $conf['linkProc.']['icon'] = 1; // Always render icon - is inserted by PHP if needed.
+                                       $conf['linkProc.']['icon.']['wrap'] = ' | //**//';      // Temporary, internal split-token!
+                                       $conf['linkProc.']['icon_link'] = 1;    // ALways link the icon
+                               }
                                $conf['linkProc.']['icon_image_ext_list'] = ($type==2 || $type==3) ? $GLOBALS['TYPO3_CONF_VARS']['GFX']['imagefile_ext'] : '';  // If the layout is type 2 or 3 we will render an image based icon if possible.
+
                                if ($conf['labelStdWrap.']) {
                                        $conf['linkProc.']['labelStdWrap.'] = $conf['labelStdWrap.'];
                                }
@@ -321,6 +340,15 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
                                                $filesData[$key]['fileextension'] = strtolower($fI['extension']);
                                                $filesData[$key]['description'] = trim($descriptions[$key]);
 
+                                               $conf['linkProc.']['title'] = trim($titles[$key]);
+
+                                               if (isset($altTexts[$key]) && !empty($altTexts[$key])) {
+                                                       $altText = trim($altTexts[$key]);
+                                               } else {
+                                                       $altText = sprintf($this->pi_getLL('uploads.icon'), $fileName);
+                                               }
+                                               $conf['linkProc.']['altText'] = $conf['linkProc.']['iconCObject.']['altText'] = $altText;
+
                                                $this->cObj->setCurrentVal($path);
                                                $GLOBALS['TSFE']->register['ICON_REL_PATH'] = $path.$fileName;
                                                $GLOBALS['TSFE']->register['filename'] = $filesData[$key]['filename'];
@@ -328,6 +356,7 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
                                                $GLOBALS['TSFE']->register['fileSize'] = $filesData[$key]['filesize'];
                                                $GLOBALS['TSFE']->register['fileExtension'] = $filesData[$key]['fileextension'];
                                                $GLOBALS['TSFE']->register['description'] = $filesData[$key]['description'];
+
                                                $filesData[$key]['linkedFilenameParts']
                                                        = $this->beautifyFileLink(
                                                                explode(
@@ -348,7 +377,7 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
 
                                        // Now, lets render the list!
                                $outputEntries = array();
-                               foreach($filesData as $key => $fileData)        {
+                               foreach ($filesData as $key => $fileData) {
                                        $GLOBALS['TSFE']->register['linkedIcon'] = $fileData['linkedFilenameParts'][0];
                                        $GLOBALS['TSFE']->register['linkedLabel'] = $fileData['linkedFilenameParts'][1];
                                        $GLOBALS['TSFE']->register['filename'] = $fileData['filename'];
@@ -361,7 +390,7 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
 
                                if (isset($conf['outerWrap']))  {
                                                // Wrap around the whole content
-                                       $outerWrap = $conf['outerWrap'];
+                                       $outerWrap = $this->cObj->stdWrap($conf['outerWrap'], $conf['outerWrap.']);
                                } else  {
                                                // Table tag params
                                        $tableTagParams = $this->getTableAttributes($conf,$type);
@@ -462,6 +491,7 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
         * @return      string          HTML output.
         * @access private
         * @coauthor    Ernesto Baschny <ernst@cron-it.de>
+        * @coauthor Patrick Broens <patrick@patrickbroens.nl>
         */
         function render_textpic($content, $conf)       {
                        // Look for hook before running default code for function
@@ -521,6 +551,12 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
                        $conf = $this->cObj->joinTSarrays($conf, $conf['rendering.'][$fallbackRenderMethod . '.']);
                }
 
+                       // Set the accessibility mode which uses a different type of markup, used 4.7+
+               $accessibilityMode = FALSE;
+               if (strpos(strtolower($renderMethod), 'caption') || strpos(strtolower($fallbackRenderMethod), 'caption')) {
+                       $accessibilityMode = TRUE;
+               }
+
                        // Global caption
                $globalCaption = '';
                if ($renderGlobalCaption)       {
@@ -565,17 +601,34 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
 
                        // Max Width
                $maxW = intval($this->cObj->stdWrap($conf['maxW'], $conf['maxW.']));
+               $maxWInText = intval($this->cObj->stdWrap($conf['maxWInText'], $conf['maxWInText.']));
+               $fiftyPercentWidthInText = round($maxW / 100 * 50);
 
                if ($contentPosition>=16)       {       // in Text
-                       $maxWInText = intval($this->cObj->stdWrap($conf['maxWInText'],$conf['maxWInText.']));
                        if (!$maxWInText)       {
                                        // If maxWInText is not set, it's calculated to the 50% of the max
-                               $maxW = round($maxW/100*50);
+                               $maxW = $fiftyPercentWidthInText;
                        } else {
                                $maxW = $maxWInText;
                        }
                }
 
+                       // Set the margin for image + text, no wrap always to avoid multiple stylesheets
+               if ($accessibilityMode) {
+                       $noWrapMargin = (integer) (($maxWInText ? $maxWInText : $fiftyPercentWidthInText) +
+                               intval($this->cObj->stdWrap($conf['textMargin'],$conf['textMargin.'])));
+
+                       $this->addPageStyle(
+                               '.csc-textpic-intext-right-nowrap .csc-textpic-text',
+                               'margin-right: ' . $noWrapMargin . 'px;'
+                       );
+
+                       $this->addPageStyle(
+                               '.csc-textpic-intext-left-nowrap .csc-textpic-text',
+                               'margin-left: ' . $noWrapMargin . 'px;'
+                       );
+               }
+
                        // max usuable width for images (without spacers and borders)
                $netW = $maxW - $colspacing * ($colCount - 1) - $colCount * $border * ($borderThickness + $borderSpace) * 2;
 
@@ -764,143 +817,327 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
                if ($noRows)    { $separateRows = 0; }
                if ($rowCount == 1)     { $separateRows = 0; }
 
-                       // Apply optionSplit to the list of classes that we want to add to each image
-               $addClassesImage = $conf['addClassesImage'];
-               if ($conf['addClassesImage.'])  {
-                       $addClassesImage = $this->cObj->stdWrap($addClassesImage, $conf['addClassesImage.']);
-               }
-               $addClassesImageConf = $GLOBALS['TSFE']->tmpl->splitConfArray(array('addClassesImage' => $addClassesImage), $colCount);
-
-                       // Render the images
-               $images = '';
-               for ($c = 0; $c < $imageWrapCols; $c++) {
-                       $tmpColspacing = $colspacing;
-                       if (($c==$imageWrapCols-1 && $imagePosition==2) || ($c==0 && ($imagePosition==1||$imagePosition==0))) {
-                                       // Do not add spacing after column if we are first column (left) or last column (center/right)
-                               $tmpColspacing = 0;
+               if ($accessibilityMode) {
+                       $imagesInColumns = round(($imgCount / ($rowCount * $colCount)), 0 , PHP_ROUND_HALF_UP);
+
+                               // Apply optionSplit to the list of classes that we want to add to each column
+                       $addClassesCol = $conf['addClassesCol'];
+                       if (isset($conf['addClassesCol.'])) {
+                               $addClassesCol = $this->cObj->stdWrap($addClassesCol, $conf['addClassesCol.']);
                        }
+                       $addClassesColConf = $GLOBALS['TSFE']->tmpl->splitConfArray(array('addClassesCol' => $addClassesCol), $colCount);
 
-                       $thisImages = '';
-                       $allRows = '';
-                       $maxImageSpace = 0;
-                       for ($i = $c; $i<count($imgsTag); $i=$i+$imageWrapCols) {
-                               $imgKey = $i+$imgStart;
-                               $colPos = $i%$colCount;
-                               if ($separateRows && $colPos == 0) {
-                                       $thisRow = '';
-                               }
+                               // Apply optionSplit to the list of classes that we want to add to each image
+                       $addClassesImage = $conf['addClassesImage'];
+                       if (isset($conf['addClassesImage.'])) {
+                               $addClassesImage = $this->cObj->stdWrap($addClassesImage, $conf['addClassesImage.']);
+                       }
+                       $addClassesImageConf = $GLOBALS['TSFE']->tmpl->splitConfArray(array('addClassesImage' => $addClassesImage), $imagesInColumns);
+
+                       $rows = array();
+                       $currentImage = 0;
+
+                               // Set the class for the caption (split or global)
+                       $classCaptionAlign = array(
+                               'center' => 'csc-textpic-caption-c',
+                               'right' => 'csc-textpic-caption-r',
+                               'left' => 'csc-textpic-caption-l',
+                       );
+
+                       $captionAlign = $this->cObj->stdWrap($conf['captionAlign'], $conf['captionAlign.']);
+
+                               // Iterate over the rows
+                       for ($rowCounter = 1; $rowCounter <= $rowCount; $rowCounter++) {
+                               $rowColumns = array();
+                                       // Iterate over the columns
+                               for ($columnCounter = 1; $columnCounter <= $colCount; $columnCounter++) {
+                                       $columnImages = array();
+                                               // Iterate over the amount of images allowed in a column
+                                       for ($imagesCounter = 1; $imagesCounter <= $imagesInColumns; $imagesCounter++) {
+                                               $image = NULL;
+                                               $splitCaption = NULL;
+                                               $imageMarkers = $captionMarkers = array();
+                                               $single = '&nbsp;';
+
+                                                       // Set the key of the current image
+                                               $imageKey = $currentImage + $imgStart;
+
+                                                       // Register IMAGE_NUM_CURRENT for the caption
+                                               $GLOBALS['TSFE']->register['IMAGE_NUM_CURRENT'] = $imageKey;
+
+                                                       // Get the image if not an empty cell
+                                               if (isset($imgsTag[$imageKey])) {
+                                                       $image = $this->cObj->stdWrap($imgsTag[$imageKey], $conf['imgTagStdWrap.']);
+
+                                                               // Add the edit icons
+                                                       if ($editIconsHTML) {
+                                                               $image .= $this->cObj->stdWrap($editIconsHTML, $conf['editIconsStdWrap.']);
+                                                       }
+
+                                                               // Wrap the single image
+                                                       $single = $this->cObj->stdWrap($image, $conf['singleStdWrap.']);
+
+                                                               // Get the caption
+                                                       if (!$renderGlobalCaption) {
+                                                               $imageMarkers['caption'] = $this->cObj->stdWrap(
+                                                                       $this->cObj->cObjGet($conf['caption.'], 'caption.'), $conf['caption.']
+                                                               );
+                                                               if ($captionAlign) {
+                                                                       $captionMarkers['classes'] = ' ' . $classCaptionAlign[$captionAlign];
+                                                               }
+
+                                                               $imageMarkers['caption'] = $this->cObj->substituteMarkerArray(
+                                                                       $imageMarkers['caption'],
+                                                                       $captionMarkers,
+                                                                       '###|###',
+                                                                       1,
+                                                                       1
+                                                               );
+                                                       }
+
+                                                       if ($addClassesImageConf[$imagesCounter - 1]['addClassesImage']) {
+                                                               $imageMarkers['classes'] = ' ' . $addClassesImageConf[$imagesCounter - 1]['addClassesImage'];
+                                                       }
+                                               }
+
+                                               $columnImages[] = $this->cObj->substituteMarkerArray(
+                                                       $single,
+                                                       $imageMarkers,
+                                                       '###|###',
+                                                       1,
+                                                       1
+                                               );
+
+                                               $currentImage++;
+                                       }
+
+                                       $rowColumn = $this->cObj->stdWrap(
+                                               implode(LF, $columnImages),
+                                               $conf['columnStdWrap.']
+                                       );
+
+                                               // Start filling the markers for columnStdWrap
+                                       $columnMarkers = array();
+
+                                       if ($addClassesColConf[$columnCounter - 1]['addClassesCol']) {
+                                               $columnMarkers['classes'] = ' ' . $addClassesColConf[$columnCounter - 1]['addClassesCol'];
+                                       }
 
-                                       // Render one image
-                               if($origImages[$imgKey][0]==0) {
-                                       $imageSpace=$this->cObj->data['imagewidth'] + $border*($borderSpace+$borderThickness)*2;
+                                       $rowColumns[] = $this->cObj->substituteMarkerArray(
+                                               $rowColumn,
+                                               $columnMarkers,
+                                               '###|###',
+                                               1,
+                                               1
+                                       );
+                               }
+                               if ($noRows) {
+                                       $rowConfiguration = $conf['noRowsStdWrap.'];
+                               } elseif ($rowCounter == $rowCount) {
+                                       $rowConfiguration = $conf['lastRowStdWrap.'];
                                } else {
-                                       $imageSpace = $origImages[$imgKey][0] + $border*($borderSpace+$borderThickness)*2;
+                                       $rowConfiguration = $conf['rowStdWrap.'];
                                }
 
-                               $GLOBALS['TSFE']->register['IMAGE_NUM'] = $imgKey;
-                               $GLOBALS['TSFE']->register['IMAGE_NUM_CURRENT'] = $imgKey;
-                               $GLOBALS['TSFE']->register['ORIG_FILENAME'] = $origImages[$imgKey]['origFile'];
-                               $GLOBALS['TSFE']->register['imagewidth'] = $origImages[$imgKey][0];
-                               $GLOBALS['TSFE']->register['imagespace'] = $imageSpace;
-                               $GLOBALS['TSFE']->register['imageheight'] = $origImages[$imgKey][1];
-                               if ($imageSpace > $maxImageSpace)       {
-                                       $maxImageSpace = $imageSpace;
+                               $row = $this->cObj->stdWrap(
+                                       implode(LF, $rowColumns),
+                                       $rowConfiguration
+                               );
+
+                                       // Start filling the markers for columnStdWrap
+                               $rowMarkers = array();
+
+                               $rows[] = $this->cObj->substituteMarkerArray(
+                                       $row,
+                                       $rowMarkers,
+                                       '###|###',
+                                       1,
+                                       1
+                               );
+                       }
+
+                       $images = $this->cObj->stdWrap(
+                               implode(LF, $rows),
+                               $conf['allStdWrap.']
+                       );
+                               // Start filling the markers for allStdWrap
+                       $allMarkers = array();
+                       $classes = array();
+
+                               // Add the global caption to the allStdWrap marker array if set
+                       if ($globalCaption) {
+                               $allMarkers['caption'] = $globalCaption;
+                               if ($captionAlign) {
+                                       $classes[] = $classCaptionAlign[$captionAlign];
                                }
-                               $thisImage = '';
-                               $thisImage .= $this->cObj->stdWrap($imgsTag[$imgKey], $conf['imgTagStdWrap.']);
+                       }
+
+                               // Add the border class if needed
+                       if ($border){
+                               $classes[] = $conf['borderClass'] ? $conf['borderClass'] : 'csc-textpic-border';
+                       }
+
+                               // Add the class for equal height if needed
+                       if ($equalHeight) {
+                               $classes[] = 'csc-textpic-equalheight';
+                       }
+
+                       $addClasses = $this->cObj->stdWrap($conf['addClasses'], $conf['addClasses.']);
+                       if ($addClasses) {
+                               $classes[] = $addClasses;
+                       }
+
+                       if ($classes) {
+                               $class = ' ' . implode(' ', $classes);
+                       }
 
-                               if (!$renderGlobalCaption)      {
-                                       $thisImage .= $this->cObj->stdWrap($this->cObj->cObjGet($conf['caption.'], 'caption.'), $conf['caption.']);
+                               // Fill the markers for the allStdWrap
+                       $images = $this->cObj->substituteMarkerArray(
+                               $images,
+                               $allMarkers,
+                               '###|###',
+                               1,
+                               1
+                       );
+               } else {
+                               // Apply optionSplit to the list of classes that we want to add to each image
+                       $addClassesImage = $conf['addClassesImage'];
+                       if (isset($conf['addClassesImage.'])) {
+                               $addClassesImage = $this->cObj->stdWrap($addClassesImage, $conf['addClassesImage.']);
+                       }
+                       $addClassesImageConf = $GLOBALS['TSFE']->tmpl->splitConfArray(array('addClassesImage' => $addClassesImage), $colCount);
+
+                               // Render the images
+                       $images = '';
+                       for ($c = 0; $c < $imageWrapCols; $c++) {
+                               $tmpColspacing = $colspacing;
+                               if (($c == $imageWrapCols - 1 && $imagePosition == 2) || ($c == 0 && ($imagePosition == 1 || $imagePosition == 0))) {
+                                               // Do not add spacing after column if we are first column (left) or last column (center/right)
+                                       $tmpColspacing = 0;
                                }
-                               if ($editIconsHTML)     {
-                                       $thisImage .= $this->cObj->stdWrap($editIconsHTML, $conf['editIconsStdWrap.']);
+
+                               $thisImages = '';
+                               $allRows = '';
+                               $maxImageSpace = 0;
+                               for ($i = $c; $i < count($imgsTag); $i = $i + $imageWrapCols) {
+                                       $imgKey = $i + $imgStart;
+                                       $colPos = $i % $colCount;
+                                       if ($separateRows && $colPos == 0) {
+                                               $thisRow = '';
+                                       }
+
+                                               // Render one image
+                                       if($origImages[$imgKey][0]==0) {
+                                               $imageSpace = $this->cObj->data['imagewidth'] + $border * ($borderSpace + $borderThickness) * 2;
+                                       } else {
+                                               $imageSpace = $origImages[$imgKey][0] + $border * ($borderSpace + $borderThickness) * 2;
+                                       }
+
+                                       $GLOBALS['TSFE']->register['IMAGE_NUM'] = $imgKey;
+                                       $GLOBALS['TSFE']->register['IMAGE_NUM_CURRENT'] = $imgKey;
+                                       $GLOBALS['TSFE']->register['ORIG_FILENAME'] = $origImages[$imgKey]['origFile'];
+                                       $GLOBALS['TSFE']->register['imagewidth'] = $origImages[$imgKey][0];
+                                       $GLOBALS['TSFE']->register['imagespace'] = $imageSpace;
+                                       $GLOBALS['TSFE']->register['imageheight'] = $origImages[$imgKey][1];
+                                       if ($imageSpace > $maxImageSpace) {
+                                               $maxImageSpace = $imageSpace;
+                                       }
+                                       $thisImage = '';
+                                       $thisImage .= $this->cObj->stdWrap($imgsTag[$imgKey], $conf['imgTagStdWrap.']);
+
+                                       if (!$renderGlobalCaption) {
+                                               $thisImage .= $this->cObj->stdWrap($this->cObj->cObjGet($conf['caption.'], 'caption.'), $conf['caption.']);
+                                       }
+                                       if ($editIconsHTML) {
+                                               $thisImage .= $this->cObj->stdWrap($editIconsHTML, $conf['editIconsStdWrap.']);
+                                       }
+                                       $thisImage = $this->cObj->stdWrap($thisImage, $conf['oneImageStdWrap.']);
+                                       $classes = '';
+                                       if ($addClassesImageConf[$colPos]['addClassesImage']) {
+                                               $classes = ' ' . $addClassesImageConf[$colPos]['addClassesImage'];
+                                       }
+                                       $thisImage = str_replace('###CLASSES###', $classes, $thisImage);
+
+                                       if ($separateRows) {
+                                               $thisRow .= $thisImage;
+                                       } else {
+                                               $allRows .= $thisImage;
+                                       }
+                                       $GLOBALS['TSFE']->register['columnwidth'] = $maxImageSpace + $tmpColspacing;
+
+
+                                               // Close this row at the end (colCount), or the last row at the final end
+                                       if ($separateRows && ($i + 1 == count($imgsTag))) {
+                                                       // Close the very last row with either normal configuration or lastRow stdWrap
+                                               $allRows .= $this->cObj->stdWrap($thisRow, (is_array($conf['imageLastRowStdWrap.']) ? $conf['imageLastRowStdWrap.'] : $conf['imageRowStdWrap.']));
+                                       } elseif ($separateRows && $colPos == $colCount - 1) {
+                                               $allRows .= $this->cObj->stdWrap($thisRow, $conf['imageRowStdWrap.']);
+                                       }
                                }
-                               $thisImage = $this->cObj->stdWrap($thisImage, $conf['oneImageStdWrap.']);
-                               $classes = '';
-                               if ($addClassesImageConf[$colPos]['addClassesImage'])   {
-                                       $classes = ' ' . $addClassesImageConf[$colPos]['addClassesImage'];
+                               if ($separateRows) {
+                                       $thisImages .= $allRows;
+                               } else {
+                                       $thisImages .= $this->cObj->stdWrap($allRows, $conf['noRowsStdWrap.']);
                                }
-                               $thisImage = str_replace('###CLASSES###', $classes, $thisImage);
-
-                               if ($separateRows)      {
-                                       $thisRow .= $thisImage;
+                               if ($noRows) {
+                                               // Only needed to make columns, rather than rows:
+                                       $images .= $this->cObj->stdWrap($thisImages, $conf['imageColumnStdWrap.']);
                                } else {
-                                       $allRows .= $thisImage;
+                                       $images .= $thisImages;
                                }
-                               $GLOBALS['TSFE']->register['columnwidth'] = $maxImageSpace + $tmpColspacing;
-
+                       }
 
-                                       // Close this row at the end (colCount), or the last row at the final end
-                               if ($separateRows && ($i+1 == count($imgsTag))) {
-                                               // Close the very last row with either normal configuration or lastRow stdWrap
-                                       $allRows .= $this->cObj->stdWrap($thisRow, (is_array($conf['imageLastRowStdWrap.']) ? $conf['imageLastRowStdWrap.'] : $conf['imageRowStdWrap.']));
-                               } elseif ($separateRows && $colPos == $colCount-1)      {
-                                       $allRows .= $this->cObj->stdWrap($thisRow, $conf['imageRowStdWrap.']);
-                               }
+                               // Add the global caption, if not split
+                       if ($globalCaption) {
+                               $images .= $globalCaption;
                        }
-                       if ($separateRows)      {
-                               $thisImages .= $allRows;
-                       } else {
-                               $thisImages .= $this->cObj->stdWrap($allRows, $conf['noRowsStdWrap.']);
+
+                               // CSS-classes
+                       $captionClass = '';
+                       $classCaptionAlign = array(
+                               'center' => 'csc-textpic-caption-c',
+                               'right' => 'csc-textpic-caption-r',
+                               'left' => 'csc-textpic-caption-l',
+                       );
+                       $captionAlign = $this->cObj->stdWrap($conf['captionAlign'], $conf['captionAlign.']);
+                       if ($captionAlign) {
+                               $captionClass = $classCaptionAlign[$captionAlign];
                        }
-                       if ($noRows)    {
-                                       // Only needed to make columns, rather than rows:
-                               $images .= $this->cObj->stdWrap($thisImages, $conf['imageColumnStdWrap.']);
-                       } else {
-                               $images .= $thisImages;
+                       $borderClass = '';
+                       if ($border) {
+                               $borderClass = $conf['borderClass'] ? $conf['borderClass'] : 'csc-textpic-border';
                        }
-               }
 
-                       // Add the global caption, if not split
-               if ($globalCaption)     {
-                       $images .= $globalCaption;
-               }
-
-                       // CSS-classes
-               $captionClass = '';
-               $classCaptionAlign = array(
-                       'center' => 'csc-textpic-caption-c',
-                       'right' => 'csc-textpic-caption-r',
-                       'left' => 'csc-textpic-caption-l',
-               );
-               $captionAlign = $this->cObj->stdWrap($conf['captionAlign'], $conf['captionAlign.']);
-               if ($captionAlign)      {
-                       $captionClass = $classCaptionAlign[$captionAlign];
-               }
-               $borderClass = '';
-               if ($border)    {
-                       $borderClass = $conf['borderClass'] ? $conf['borderClass'] : 'csc-textpic-border';
-               }
-
-                       // Multiple classes with all properties, to be styled in CSS
-               $class = '';
-               $class .= ($borderClass? ' '.$borderClass:'');
-               $class .= ($captionClass? ' '.$captionClass:'');
-               $class .= ($equalHeight? ' csc-textpic-equalheight':'');
-               $addClasses = $this->cObj->stdWrap($conf['addClasses'], $conf['addClasses.']);
-               $class .= ($addClasses ? ' '.$addClasses:'');
-
-                       // Do we need a width in our wrap around images?
-               $imgWrapWidth = '';
-               if ($position == 0 || $position == 8)   {
-                               // For 'center' we always need a width: without one, the margin:auto trick won't work
-                       $imgWrapWidth = $imageBlockWidth;
-               }
-               if ($rowCount > 1)      {
-                               // For multiple rows we also need a width, so that the images will wrap
-                       $imgWrapWidth = $imageBlockWidth;
-               }
-               if ($caption)   {
-                               // If we have a global caption, we need the width so that the caption will wrap
-                       $imgWrapWidth = $imageBlockWidth;
-               }
+                               // Multiple classes with all properties, to be styled in CSS
+                       $class = '';
+                       $class .= ($borderClass ? ' ' . $borderClass : '');
+                       $class .= ($captionClass ? ' ' . $captionClass : '');
+                       $class .= ($equalHeight ? ' csc-textpic-equalheight' : '');
+                       $addClasses = $this->cObj->stdWrap($conf['addClasses'], $conf['addClasses.']);
+                       $class .= ($addClasses ? ' ' . $addClasses : '');
+
+                               // Do we need a width in our wrap around images?
+                       $imgWrapWidth = '';
+                       if ($position == 0 || $position == 8) {
+                                       // For 'center' we always need a width: without one, the margin:auto trick won't work
+                               $imgWrapWidth = $imageBlockWidth;
+                       }
+                       if ($rowCount > 1) {
+                                       // For multiple rows we also need a width, so that the images will wrap
+                               $imgWrapWidth = $imageBlockWidth;
+                       }
+                       if ($globalCaption) {
+                                       // If we have a global caption, we need the width so that the caption will wrap
+                               $imgWrapWidth = $imageBlockWidth;
+                       }
 
-                       // Wrap around the whole image block
-               $GLOBALS['TSFE']->register['totalwidth'] = $imgWrapWidth;
-               if ($imgWrapWidth)      {
-                       $images = $this->cObj->stdWrap($images, $conf['imageStdWrap.']);
-               } else {
-                       $images = $this->cObj->stdWrap($images, $conf['imageStdWrapNoWidth.']);
+                               // Wrap around the whole image block
+                       $GLOBALS['TSFE']->register['totalwidth'] = $imgWrapWidth;
+                       if ($imgWrapWidth) {
+                               $images = $this->cObj->stdWrap($images, $conf['imageStdWrap.']);
+                       } else {
+                               $images = $this->cObj->stdWrap($images, $conf['imageStdWrapNoWidth.']);
+                       }
                }
 
                $output = $this->cObj->cObjGetSingle($conf['layout'], $conf['layout.']);
@@ -915,9 +1152,54 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
                return $output;
        }
 
+       /***********************************
+        *
+        * Rendering of Content Element properties:
+        *
+        ***********************************/
 
+       /**
+        * Add top or bottom margin to the content element
+        *
+        * Constructs and adds a class to the content element. This class selector
+        * and its declaration are added to the specific page styles.
+        *
+        * @param string $content Content input. Not used, ignore.
+        * @param array $configuration TypoScript configuration
+        * @return string The class name
+        */
+       public function renderSpace($content, array $configuration) {
+                       // Look for hook before running default code for function
+               if (method_exists($this, 'hookRequest') && $hookObject = $this->hookRequest('renderSpace')) {
+                       return $hookObject->renderSpace($content, $configuration);
+               }
 
+               if (isset($configuration['space']) && in_array($configuration['space'], array('before', 'after'))) {
+                       $constant = (int) $configuration['constant'];
 
+                       if ($configuration['space'] === 'before') {
+                               $value = $constant + $this->cObj->data['spaceBefore'];
+                               $declaration = 'margin-top: ' . $value .'px;';
+                       } else {
+                               $value = $constant + $this->cObj->data['spaceAfter'];
+                               $declaration = 'margin-bottom: ' . $value . 'px;';
+                       }
+
+                       if (!empty($value)) {
+                               if ($configuration['stdWrap.']) {
+                                       $className = $this->cObj->stdWrap($value, $configuration['stdWrap.']);
+                               } else {
+                                       $className = $value;
+                               }
+
+                               $selector = '.' . trim($className);
+
+                               $this->addPageStyle($selector, $declaration);
+
+                               return $className;
+                       }
+               }
+       }
 
 
 
@@ -973,30 +1255,100 @@ class tx_cssstyledcontent_pi1 extends tslib_pibase {
         * @param       integer         The "layout" type
         * @return      array           Array with attributes inside.
         */
-       function getTableAttributes($conf,$type)        {
+       function getTableAttributes($conf, $type) {
 
                        // Initializing:
                $tableTagParams_conf = $conf['tableParams_'.$type.'.'];
 
-               $conf['color.'][200] = '';
-               $conf['color.'][240] = 'black';
-               $conf['color.'][241] = 'white';
-               $conf['color.'][242] = '#333333';
-               $conf['color.'][243] = 'gray';
-               $conf['color.'][244] = 'silver';
+               $border = $this->cObj->data['table_border'] ? intval($this->cObj->data['table_border']) : $tableTagParams_conf['border'];
+               $cellSpacing = $this->cObj->data['table_cellspacing'] ? intval($this->cObj->data['table_cellspacing']) : $tableTagParams_conf['cellspacing'];
+               $cellPadding = $this->cObj->data['table_cellpadding'] ? intval($this->cObj->data['table_cellpadding']) : $tableTagParams_conf['cellpadding'];
+               $summary = trim(htmlspecialchars($this->pi_getFFvalue($this->cObj->data['pi_flexform'], 'acctables_summary')));
+
+                       // Create table attributes and classes array:
+               $tableTagParams = $classes = array();
+
+                       // Table attributes for all doctypes except HTML5
+               if ($GLOBALS['TSFE']->config['config']['doctype'] !== 'html5') {
+                       $tableTagParams['border'] = $border;
+                       $tableTagParams['cellspacing'] = $cellSpacing;
+                       $tableTagParams['cellpadding'] = $cellPadding;
+                       if ($summary) {
+                               $tableTagParams['summary'] = $summary;
+                       }
+
+                       // Some attributes are obsolete or have been changed in HTML5
+               } else {
+                       if ($border) {
+                                       // Border property has changed, now with class
+                               $borderClass = 'contenttable-border-' . $border;
+                               $borderDeclaration = 'border-width: ' . $border . 'px; border-style: solid;';
+
+                               $this->addPageStyle('.' . $borderClass, $borderDeclaration);
+
+                               $classes[] = $borderClass;
+                       }
+                       if ($cellSpacing) {
+                                       // Border attribute for HTML5 is 1 when there is cell spacing
+                               $tableTagParams['border'] = 1;
+                                       // Use CSS3 border-spacing in class to have cell spacing
+                               $cellSpacingClass = 'contenttable-cellspacing-' . $cellSpacing;
+                               $cellSpacingDeclaration = 'border-spacing: ' . $cellSpacing . 'px;';
+
+                               $this->addPageStyle('.' . $cellSpacingClass, $cellSpacingDeclaration);
+
+                               $classes[] = $cellSpacingClass;
+                       }
+                       if ($cellPadding) {
+                                       // Cell padding property has changed, now with class
+                               $cellPaddingClass = 'contenttable-cellpadding-' . $cellPadding;
+                               $cellSpacingSelector = '.' . $cellPaddingClass . ' td, .' . $cellPaddingClass . ' th';
+                               $cellPaddingDeclaration = 'padding: ' . $cellPadding . 'px;';
+
+                               $this->addPageStyle($cellSpacingSelector, $cellPaddingDeclaration);
+
+                               $classes[] = $cellPaddingClass;
+                       }
+               }
+                       // Background color is class
+               if (
+                       isset($conf['color.'][$this->cObj->data['table_bgColor']]) &&
+                       !empty($conf['color.'][$this->cObj->data['table_bgColor']])
+               ) {
+                       $classes[] = 'contenttable-color-' . $this->cObj->data['table_bgColor'];
+               }
 
-                       // Create table attributes array:
-               $tableTagParams = array();
-               $tableTagParams['border'] =  $this->cObj->data['table_border'] ? intval($this->cObj->data['table_border']) : $tableTagParams_conf['border'];
-               $tableTagParams['cellspacing'] =  $this->cObj->data['table_cellspacing'] ? intval($this->cObj->data['table_cellspacing']) : $tableTagParams_conf['cellspacing'];
-               $tableTagParams['cellpadding'] =  $this->cObj->data['table_cellpadding'] ? intval($this->cObj->data['table_cellpadding']) : $tableTagParams_conf['cellpadding'];
-               $tableTagParams['bgcolor'] =  isset($conf['color.'][$this->cObj->data['table_bgColor']]) ? $conf['color.'][$this->cObj->data['table_bgColor']] : $conf['color.']['default'];
+               if (!empty($classes)) {
+                       $tableTagParams['class'] = ' ' . implode(' ', $classes);
+               }
 
                        // Return result:
                return $tableTagParams;
        }
 
        /**
+        * Add a style to the page, specific for this page
+        *
+        * The selector can be a contextual selector, like '#id .class p'
+        * The presence of the selector is checked to avoid multiple entries of the
+        * same selector.
+        *
+        * @param string $selector The selector
+        * @param string $declaration The declaration
+        * @return void
+        */
+       protected function addPageStyle($selector, $declaration) {
+               if (!isset($GLOBALS['TSFE']->tmpl->setup['plugin.']['tx_cssstyledcontent.']['_CSS_PAGE_STYLE'])) {
+                       $GLOBALS['TSFE']->tmpl->setup['plugin.']['tx_cssstyledcontent.']['_CSS_PAGE_STYLE'] = array();
+               }
+
+               if (!isset($GLOBALS['TSFE']->tmpl->setup['plugin.']['tx_cssstyledcontent.']['_CSS_PAGE_STYLE'][$selector])) {
+                       $GLOBALS['TSFE']->tmpl->setup['plugin.']['tx_cssstyledcontent.']['_CSS_PAGE_STYLE'][$selector] = TAB . $selector .
+                               ' { ' . $declaration . ' }';
+               }
+       }
+
+       /**
         * Returns an object reference to the hook object if any
         *
         * @param       string          Name of the function you want to call / hook key
index 6f0d065..eb7f267 100644 (file)
@@ -6,6 +6,9 @@
                        <trans-unit id="label.toTop" xml:space="preserve">
                                <source>To top</source>
                        </trans-unit>
+                       <trans-unit id="uploads.icon" xml:space="preserve">
+                               <source>File link icon for %s</source>
+                       </trans-unit>
                        <trans-unit id="login.username" xml:space="preserve">
                                <source>Username:</source>
                        </trans-unit>
@@ -45,6 +48,9 @@
                        <trans-unit id="search.searchButton" xml:space="preserve">
                                <source>Search now!</source>
                        </trans-unit>
+                       <trans-unit id="menu.bypassNavigation" xml:space="preserve">
+                               <source>Skip navigation block</source>
+                       </trans-unit>
                        <trans-unit id="eIcon.html" xml:space="preserve">
                                <source>Edit pure HTML content</source>
                        </trans-unit>
index 33a4992..c875eb3 100644 (file)
@@ -72,7 +72,7 @@ styles.content.imgtext {
     # cat=content/cImage/i3; type=int+; label= Image border, padding: Padding left and right to the image, around the border.
   borderSpace = 0
     # cat=content/cImage/i4; type=string; label= Image border CSS-selector: If you want your border to apply elsewhere, change this setting. E.g. to apply to the whole image+caption, use 'DIV.csc-textpic-border DIV.csc-textpic-imagewrap .csc-textpic-image'.
-  borderSelector = DIV.{$styles.content.imgtext.borderClass} DIV.csc-textpic-imagewrap .csc-textpic-image IMG, DIV.{$styles.content.imgtext.borderClass} DIV.csc-textpic-single-image IMG
+  borderSelector = DIV.{$styles.content.imgtext.borderClass} DIV.csc-textpic-imagewrap IMG
     # cat=content/cImage/i5; type=string; label= Image border class: The name of the CSS class for creating image borders
   borderClass = csc-textpic-border
     # cat=content/cImage/i5; type=boolean; label= Image row separation: Whether images should be rendered/wrapped in separated rows, e.g. inside a DIV.csc-textpic-imagerow element
@@ -82,6 +82,7 @@ styles.content.imgtext {
 }
 
 styles.content.uploads {
+  target = _blank
   jumpurl_secure =
   jumpurl_secure_mimeTypes = pdf=application/pdf, doc=application/msword
   jumpurl =
@@ -132,6 +133,23 @@ styles.content.media {
   defaultAudioHeight = 30
 }
 
+styles.content.table {
+    # cat=content/cTable/k2; type=color; label= Table background color, Color 1: Background color for table when "Backgr. Color" has been set to "Color 1"
+  backgroundColor.1 = #EDEBF1
+    # cat=content/cTable/k3; type=color; label= Table background color, Color 2: Background color for table when "Backgr. Color" has been set to "Color 2"
+  backgroundColor.2 = #F5FFAA
+    # cat=content/cTable/k5; type=color; label= Table background color, Black: Background color for table when "Backgr. Color" has been set to "Black"
+  backgroundColor.240 = black
+    # cat=content/cTable/k6; type=color; label= Table background color, White: Background color for table when "Backgr. Color" has been set to "White"
+  backgroundColor.241 = white
+    # cat=content/cTable/k7; type=color; label= Table background color, Dark Gray: Background color for table when "Backgr. Color" has been set to "Dark Gray"
+  backgroundColor.242 = #333333
+    # cat=content/cTable/k8; type=color; label= Table background color, Gray: Background color for table when "Backgr. Color" has been set to "Gray"
+  backgroundColor.243 = gray
+    # cat=content/cTable/k9; type=color; label= Table background color, Silver: Background color for table when "Backgr. Color" has been set to "Silver"
+  backgroundColor.244 = silver
+}
+
  # cat=advanced/links; type=small; label= Target for internal links: Should match the name of the content PAGE-object in TypoScript when used with frames. Most cases: set to "" (empty). If you have frames in the template set to "page"
 PAGE_TARGET =
 
index 075b331..0ae4119 100644 (file)
@@ -56,19 +56,33 @@ styles.content.editPanelPage {
 # "lib." objects are preserved from unsetting after template parsing
 # *********************************************************************
 
+# Creates a condition for targets. Not allowed in XHTML except for xhtml frames DTD
+lib.parseTarget {
+       override =
+       override.if {
+               isTrue.data = TSFE:dtdAllowsFrames
+       }
+}
+
 # Creates persistent ParseFunc setup for non-HTML content. This is recommended to use (as a reference!)
 lib.parseFunc {
        makelinks = 1
        makelinks.http.keep = {$styles.content.links.keep}
-       makelinks.http.extTarget = {$styles.content.links.extTarget}
+       makelinks.http.extTarget < lib.parseTarget
+       makelinks.http.extTarget =
+       makelinks.http.extTarget.override = {$styles.content.links.extTarget}
        makelinks.mailto.keep = path
        tags {
                link = TEXT
                link {
                        current = 1
                        typolink.parameter.data = parameters : allParams
-                       typolink.extTarget = {$styles.content.links.extTarget}
-                       typolink.target = {$styles.content.links.target}
+                       typolink.extTarget < lib.parseTarget
+                       typolink.extTarget =
+                       typolink.extTarget.override = {$styles.content.links.extTarget}
+                       typolink.target < lib.parseTarget
+                       typolink.target =
+                       typolink.target.override = {$styles.content.links.target}
                        parseFunc.constants =1
                }
        }
@@ -146,26 +160,68 @@ lib.parseFunc_RTE {
 lib.stdheader = COA
 lib.stdheader {
 
-       # Create align style-attribute for <Hx> tags
-       2 = LOAD_REGISTER
-       2.headerStyle.field = header_position
-       2.headerStyle.required = 1
-       2.headerStyle.noTrimWrap = | style="text-align:|;"|
-
-       # Create class="csc-firstHeader" attribute for <Hx> tags
+       # Create class attribute for <Hx> tags
        3 = LOAD_REGISTER
-       3.headerClass = csc-firstHeader
-       3.headerClass.if.value=1
-       3.headerClass.if.equals.data = cObj:parentRecordNumber
-       3.headerClass.noTrimWrap = | class="|"|
+       3 {
+               headerClass {
+                       cObject = COA
+                       cObject {
+                               # Create alignment class for <Hx> tags
+                               10 = TEXT
+                               10 {
+                                       field = header_position
+                                       required = 1
+                                       noTrimWrap = |csc-header-alignment-| |
+                               }
+                               # Create "csc-firstHeader" class for <Hx> tags
+                               20 = TEXT
+                               20 {
+                                       value = csc-firstHeader
+                                       if {
+                                               value = 1
+                                               equals.data = cObj:parentRecordNumber
+                                       }
+                               }
+                               stdWrap {
+                                       trim = 1
+                                       noTrimWrap = | class="|"|
+                                       required = 1
+                               }
+                       }
+               }
+       }
 
-       # Date format:
+       # Date format (not HTML5)
        5 = TEXT
-       5.field = date
-       5.if.isTrue.field = date
-       5.strftime = %x
-       5.wrap = <p class="csc-header-date">|</p>
-       5.prefixComment = 2 | Header date:
+       5 {
+               field = date
+               if {
+                       isTrue {
+                               field = date
+                       }
+                       isFalse = 1
+                       isFalse {
+                               if {
+                                       value = html5
+                                       equals.data = TSFE:config|config|doctype
+                               }
+                       }
+               }
+               strftime = %x
+               wrap = <p class="csc-header-date">|</p>
+               prefixComment = 2 | Header date:
+       }
+
+       # HTML5 <hgroup> open
+       7 = TEXT
+       7 {
+               value = <hgroup>
+               fieldRequired = subheader
+               if {
+                       value = html5
+                       equals.data = TSFE:config|config|doctype
+               }
+       }
 
        # This CASE cObject renders the header content:
        # currentValue is set to the header data, possibly wrapped in link-tags.
@@ -181,23 +237,106 @@ lib.stdheader {
 
        10.1 = TEXT
        10.1.current = 1
-       10.1.dataWrap = <h1{register:headerStyle}{register:headerClass}>|</h1>
+       10.1.dataWrap = <h1{register:headerClass}>|</h1>
 
        10.2 < .10.1
-       10.2.dataWrap = <h2{register:headerStyle}{register:headerClass}>|</h2>
+       10.2.dataWrap = <h2{register:headerClass}>|</h2>
 
        10.3 < .10.1
-       10.3.dataWrap = <h3{register:headerStyle}{register:headerClass}>|</h3>
+       10.3.dataWrap = <h3{register:headerClass}>|</h3>
 
        10.4 < .10.1
-       10.4.dataWrap = <h4{register:headerStyle}{register:headerClass}>|</h4>
+       10.4.dataWrap = <h4{register:headerClass}>|</h4>
 
        10.5 < .10.1
-       10.5.dataWrap = <h5{register:headerStyle}{register:headerClass}>|</h5>
+       10.5.dataWrap = <h5{register:headerClass}>|</h5>
+
+       # HTML5 subheader
+       20 = CASE
+       20 {
+               key {
+                       field = header_layout
+               }
+
+               default = TEXT
+               default {
+                       wrap = <h2>|</h2>
+                       htmlSpecialChars = 1
+                       field = subheader
+               }
+
+               1 < .default
+
+               2 < .default
+               2.wrap = <h3>|</h3>
+
+               3 < .default
+               3.wrap = <h4>|</h4>
+
+               4 < .default
+               4.wrap = <h5>|</h5>
+
+               5 < .default
+               5.wrap = <h6>|</h6>
+
+               if {
+                       isTrue {
+                               field = subheader
+                       }
+                       value = html5
+                       equals.data = TSFE:config|config|doctype
+               }
+       }
+
+       # HTML5 <hgroup> close
+       30 < lib.stdheader.7
+       30 {
+               value = </hgroup>
+       }
+
+       # HTML5 Date
+       40 = COA
+       40 {
+
+               stdWrap {
+                       wrap = <p class="csc-header-date">|</p>
+                       innerWrap {
+                               cObject = COA
+                               cObject {
+                                       10 = TEXT
+                                       10 {
+                                               value = <time
+                                       }
+                                       20 = TEXT
+                                       20 {
+                                               noTrimWrap = | datetime="|"|
+                                               field = date
+                                               strftime = %Y-%m-%d
+                                       }
+                                       30 = TEXT
+                                       30 {
+                                               value = >|</time>
+                                       }
+                               }
+                       }
+                       required = 1
+               }
+               10 = TEXT
+               10 {
+                       field = date
+                       strftime = %B %e, %Y
+               }
+               if {
+                       isTrue {
+                               field = date
+                       }
+                       value = html5
+                       equals.data = TSFE:config|config|doctype
+               }
+       }
 
        # Pops the used registers off the stack:
        98 = RESTORE_REGISTER
-       99 = RESTORE_REGISTER
 
        # Post-processing:
        stdWrap.fieldRequired = header
@@ -211,7 +350,18 @@ lib.stdheader {
        stdWrap.editIcons.beforeLastTag = 1
        stdWrap.editIcons.iconTitle.data = LLL:EXT:css_styled_content/pi1/locallang.xml:eIcon.header
 
-       stdWrap.dataWrap = <div class="csc-header csc-header-n{cObj:parentRecordNumber}">|</div>
+       stdWrap {
+               dataWrap = <div class="csc-header csc-header-n{cObj:parentRecordNumber}">|</div>
+               dataWrap {
+                       override = <header class="csc-header csc-header-n{cObj:parentRecordNumber}">|</header>
+                       override {
+                               if {
+                                       value = html5
+                                       equals.data = TSFE:config|config|doctype
+                               }
+                       }
+               }
+       }
        stdWrap.prefixComment = 2 | Header:
 }
 
@@ -250,99 +400,118 @@ tt_content.stdWrap {
                default {
                        10 = TEXT
                        10 {
-                               value = <div id="c{field:uid}"
-                               override.cObject = TEXT
-                               override.cObject {
-                                       value = <div
-                                       if.value = div
-                                       if.equals.field = CType
+                               cObject = CASE
+                               cObject {
+                                       key.field = CType
+
+                                       default = TEXT
+                                       default {
+                                               value = <div id="c{field:uid}"
+                                       }
+
+                                       div = TEXT
+                                       div {
+                                               value = <div
+                                       }
+
+                                       menu < .default
+                                       menu {
+                                               override = <nav id="c{field:uid}"
+                                               override {
+                                                       if {
+                                                               value = html5
+                                                               equals.data = TSFE:config|config|doctype
+                                                       }
+                                               }
+                                       }
                                }
                                insertData = 1
                        }
 
-                       15 = TEXT
-                       15 {
-                               value = csc-default
-                               noTrimWrap = | class="|" |
-                               required = 1
-                       }
-
                        20 = COA
                        20 {
-                               10 = COA
+                               # Create default class for content
+                               10 = TEXT
                                10 {
-                                       10 = TEXT
-                                       10 {
-                                               value = {$content.spaceBefore}
-                                               wrap = |+
-                                               if.isTrue = {$content.spaceBefore}
-                                       }
-
-                                       20 = TEXT
-                                       20 {
-                                               field = spaceBefore
+                                       value = csc-default
+                                       required = 1
+                                       noTrimWrap = || |
+                               }
+                               # Create class for space before content
+                               20 = USER
+                               20 {
+                                       userFunc = tx_cssstyledcontent_pi1->renderSpace
+                                       space = before
+                                       constant = {$content.spaceBefore}
+                                       stdWrap {
+                                               noTrimWrap = |csc-space-before-| |
                                        }
-
-                                       stdWrap {
-                                               prioriCalc = intval
-                                               wrap = margin-top:|px;
-                                               required = 1
-                                               ifEmpty.value =
+                               }
+                               # Create class for space after content
+                               30 = USER
+                               30 {
+                                       userFunc = tx_cssstyledcontent_pi1->renderSpace
+                                       space = after
+                                       constant = {$content.spaceAfter}
+                                       stdWrap {
+                                               noTrimWrap = |csc-space-after-| |
                                        }
                                }
+                               stdWrap {
+                                       trim = 1
+                                       noTrimWrap = | class="|"|
+                                       required = 1
+                               }
+                       }
 
-                               20 = COA
-                               20 {
-                                       10 = TEXT
-                                       10 {
-                                               value = {$content.spaceAfter}
-                                               wrap = |+
-                                               if.isTrue = {$content.spaceAfter}
-                                       }
+                       30 = TEXT
+                       30 {
+                               cObject = CASE
+                               cObject {
+                                       key.field = CType
 
-                                       20 = TEXT
-                                       20 {
-                                               field = spaceAfter
+                                       default = TEXT
+                                       default {
+                                               value = >|</div>
                                        }
 
-                                       stdWrap {
-                                               prioriCalc = intval
-                                               wrap = margin-bottom:|px;
-                                               required = 1
-                                               ifEmpty.value =
+                                       menu < .default
+                                       menu {
+                                               override = >|</nav>
+                                               override {
+                                                       if {
+                                                               value = html5
+                                                               equals.data = TSFE:config|config|doctype
+                                                       }
+                                               }
                                        }
                                }
-
-                               stdWrap.noTrimWrap = | style="|" |
-                               stdWrap.required = 1
                        }
-                       30 = TEXT
-                       30.value = >|</div>
                }
 
                1 =< tt_content.stdWrap.innerWrap.cObject.default
-               1.15.value = csc-frame csc-frame-invisible
+               1.20.10.value = csc-frame csc-frame-invisible
 
                5 =< tt_content.stdWrap.innerWrap.cObject.default
-               5.15.value = csc-frame csc-frame-rulerBefore
+               5.20.10.value = csc-frame csc-frame-rulerBefore
 
                6 =< tt_content.stdWrap.innerWrap.cObject.default
-               6.15.value = csc-frame csc-frame-rulerAfter
+               6.20.10.value = csc-frame csc-frame-rulerAfter
 
                10 =< tt_content.stdWrap.innerWrap.cObject.default
-               10.15.value = csc-frame csc-frame-indent
+               10.20.10.value = csc-frame csc-frame-indent
 
                11 =< tt_content.stdWrap.innerWrap.cObject.default
-               11.15.value = csc-frame csc-frame-indent3366
+               11.20.10.value = csc-frame csc-frame-indent3366
 
                12 =< tt_content.stdWrap.innerWrap.cObject.default
-               12.15.value = csc-frame csc-frame-indent6633
+               12.20.10.value = csc-frame csc-frame-indent6633
 
                20 =< tt_content.stdWrap.innerWrap.cObject.default
-               20.15.value = csc-frame csc-frame-frame1
+               20.20.10.value = csc-frame csc-frame-frame1
 
                21 =< tt_content.stdWrap.innerWrap.cObject.default
-               21.15.value = csc-frame csc-frame-frame2
+               21.20.10.value = csc-frame csc-frame-frame2
 
                66 = COA
                66 {
@@ -351,27 +520,21 @@ tt_content.stdWrap {
                                value = <a id="c{field:uid}"></a>
                                insertData = 1
                        }
-
+                       # Create div with class for space before content
                        20 = COA
                        20 {
-                               10 = TEXT
+                               10 = USER
                                10 {
-                                       value = {$content.spaceBefore}
-                                       wrap = |+
-                                       if.isTrue = {$content.spaceBefore}
-                               }
-
-                               20 = TEXT
-                               20 {
-                                       field = spaceBefore
+                                       userFunc = tx_cssstyledcontent_pi1->renderSpace
+                                       space = before
+                                       constant = {$content.spaceBefore}
+                                       stdWrap {
+                                               wrap = csc-space-before-|
+                                       }
                                }
-
-                               stdWrap {
-                                       prioriCalc = intval
-                                       wrap = margin-top:|px;
+                               stdWrap {
+                                       wrap = <div class="|"></div>
                                        required = 1
-                                       ifEmpty.value =
-                                       wrap2 = <div style="|"></div>
                                }
                        }
 
@@ -380,17 +543,18 @@ tt_content.stdWrap {
                                value = |
                        }
 
+                       # Create div with class for space after content
                        40 < .20
                        40 {
                                10 {
-                                       value = {$content.spaceAfter}
-                                       if.isTrue = {$content.spaceAfter}
+                                       space = after
+                                       constant = {$content.spaceAfter}
+                                       stdWrap {
+                                               wrap = csc-space-after-|
+                                       }
                                }
-                               20.field = spaceAfter
-                               stdWrap.wrap = margin-bottom:|px;
                        }
                }
-
        }
 
        innerWrap2 = | <p class="csc-linkToTop"><a href="#">{LLL:EXT:css_styled_content/pi1/locallang.xml:label.toTop}</a></p>
@@ -432,6 +596,12 @@ tt_content.header {
                dataWrap = <p class="csc-subheader csc-subheader-{field:layout}">|</p>
                htmlSpecialChars = 1
 
+               if {
+                       value = html5
+                       equals.data = TSFE:config|config|doctype
+                       negate = 1
+               }
+
                editIcons = tt_content:subheader,layout
                editIcons.beforeLastTag = 1
                editIcons.iconTitle.data = LLL:EXT:css_styled_content/pi1/locallang.xml:eIcon.subheader
@@ -508,8 +678,14 @@ tt_content.image.20 {
                        typolink.parameter.field = image_link
                        typolink.parameter.listNum.splitChar = 10
                        typolink.parameter.listNum.stdWrap.data = register : IMAGE_NUM_CURRENT
-                       typolink.target = {$styles.content.links.target}
-                       typolink.extTarget = {$styles.content.links.extTarget}
+
+                       typolink.target < lib.parseTarget
+                       typolink.target =
+                       typolink.target.override = {$styles.content.links.target}
+
+                       typolink.extTarget < lib.parseTarget
+                       typolink.extTarget =
+                       typolink.extTarget.override = {$styles.content.links.extTarget}
 
                        linkParams.ATagParams.dataWrap =  class="{$styles.content.imgtext.linkWrap.lightboxCssClass}" rel="{$styles.content.imgtext.linkWrap.lightboxRelAttribute}"
                }
@@ -523,11 +699,64 @@ tt_content.image.20 {
                        split.returnKey.data = register : IMAGE_NUM_CURRENT
                }
 
+               params =
+               params {
+                       override {
+                               dataWrap = aria-describedby="csc-longdesc-{field:uid}-{register:IMAGE_NUM_CURRENT}"
+                               if {
+                                       isTrue {
+                                               cObject = TEXT
+                                               cObject {
+                                                       field = imagecaption
+                                                       required = 1
+                                                       parseFunc =< lib.parseFunc
+                                                       split {
+                                                               token {
+                                                                       char = 10
+                                                                       if.isPositive = {$styles.content.imgtext.imageTextSplit} + {$styles.content.imgtext.captionSplit}
+                                                               }
+                                                               returnKey.data = register : IMAGE_NUM_CURRENT
+                                                       }
+                                               }
+                                       }
+                                       isFalse = 1
+                                       isFalse {
+                                               if {
+                                                       isFalse {
+                                                               cObject = TEXT
+                                                               cObject {
+                                                                       field = longdescURL
+                                                                       split {
+                                                                               token {
+                                                                                       char = 10
+                                                                               }
+                                                                               returnKey.data = register : IMAGE_NUM_CURRENT
+                                                                       }
+                                                               }
+                                                       }
+                                               }
+                                       }
+                                       isPositive = {$styles.content.imgtext.imageTextSplit} + {$styles.content.imgtext.captionSplit}
+                                       value = html5
+                                       equals.data = TSFE:config|config|doctype
+                               }
+                       }
+               }
+
                titleText < .altText
                titleText.field = titleText
 
-               longdescURL < .altText
-               longdescURL.field = longdescURL
+               longdescURL {
+                       parameter {
+                               field = longdescURL
+                               split {
+                                       token {
+                                               char = 10
+                                       }
+                                       returnKey.data = register : IMAGE_NUM_CURRENT
+                               }
+                       }
+               }
 
                emptyTitleHandling = {$styles.content.imgtext.emptyTitleHandling}
                titleInLink = {$styles.content.imgtext.titleInLink}
@@ -551,17 +780,46 @@ tt_content.image.20 {
        border.field = imageborder
 
        caption {
-               1 = TEXT
+               1 = COA
                1 {
-                       field = imagecaption
-                       required = 1
-                       parseFunc =< lib.parseFunc
-                       br = 1
-                       split.token.char = 10
-                       split.token.if.isPositive = {$styles.content.imgtext.imageTextSplit} + {$styles.content.imgtext.captionSplit}
-                       split.returnKey.data = register : IMAGE_NUM_CURRENT
+                       1 = TEXT
+                       1 {
+                               field = imagecaption
+                               required = 1
+                               parseFunc =< lib.parseFunc
+                               br = 1
+                               trim = 1
+                               split.token.char = 10
+                               split.token.if.isPositive = {$styles.content.imgtext.imageTextSplit} + {$styles.content.imgtext.captionSplit}
+                               split.returnKey.data = register : IMAGE_NUM_CURRENT
+                       }
+                       stdWrap {
+                               required = 1
+                               typolink {
+                                       parameter {
+                                               field = longdescURL
+                                               trim = 1
+                                               split {
+                                                       token {
+                                                               char = 10
+                                                       }
+                                                       returnKey.data = register : IMAGE_NUM_CURRENT
+                                               }
+                                               if {
+                                                       value = html5
+                                                       equals.data = TSFE:config|config|doctype
+                                               }
+                                       }
+                                       ATagParams {
+                                               dataWrap = id="csc-longdesc-{field:uid}-{register:IMAGE_NUM_CURRENT}"
+                                       }
+                                       target = {$styles.content.links.target}
+                                       extTarget = {$styles.content.links.extTarget}
+                               }
+                       }
                }
        }
+
        # captionSplit is deprecated, use imageTextSplit instead
        captionSplit = {$styles.content.imgtext.captionSplit}
        captionAlign.field = imagecaption_position
@@ -578,14 +836,16 @@ tt_content.image.20 {
        borderSpace = {$styles.content.imgtext.borderSpace}
        separateRows = {$styles.content.imgtext.separateRows}
        addClasses =
-       addClassesImage =
-       addClassesImage.ifEmpty = csc-textpic-firstcol csc-textpic-lastcol
-       addClassesImage.override = csc-textpic-firstcol |*| |*| csc-textpic-lastcol
-       addClassesImage.override.if {
+       addClassesCol =
+       addClassesCol.ifEmpty = csc-textpic-firstcol csc-textpic-lastcol
+       addClassesCol.override = csc-textpic-firstcol |*| |*| csc-textpic-lastcol
+       addClassesCol.override.if {
                isGreaterThan.field = imagecols
                value = 1
        }
 
+       addClassesImage = csc-textpic-first |*| |*| csc-textpic-last
+
        #
        imageStdWrap.dataWrap = <div class="csc-textpic-imagewrap" style="width:{register:totalwidth}px;"> | </div>
        imageStdWrapNoWidth.wrap = <div class="csc-textpic-imagewrap"> | </div>
@@ -598,127 +858,226 @@ tt_content.image.20 {
                key.field = imageorient
                # above-center
                default = TEXT
-               default.value = <div class="csc-textpic csc-textpic-center csc-textpic-above###CLASSES###">###IMAGES######TEXT###</div><div class="csc-textpic-clear"><!-- --></div>
+               default.value = <div class="csc-textpic csc-textpic-center csc-textpic-above###CLASSES###">###IMAGES######TEXT###</div>
                # above-right
                1 = TEXT
-               1.value = <div class="csc-textpic csc-textpic-right csc-textpic-above###CLASSES###">###IMAGES######TEXT###</div><div class="csc-textpic-clear"><!-- --></div>
+               1.value = <div class="csc-textpic csc-textpic-right csc-textpic-above###CLASSES###">###IMAGES######TEXT###</div>
                # above-left
                2 = TEXT
-               2.value = <div class="csc-textpic csc-textpic-left csc-textpic-above###CLASSES###">###IMAGES######TEXT###</div><div class="csc-textpic-clear"><!-- --></div>
+               2.value = <div class="csc-textpic csc-textpic-left csc-textpic-above###CLASSES###">###IMAGES######TEXT###</div>
                # below-center
                8 = TEXT
-               8.value = <div class="csc-textpic csc-textpic-center csc-textpic-below###CLASSES###">###TEXT######IMAGES###</div><div class="csc-textpic-clear"><!-- --></div>
+               8.value = <div class="csc-textpic csc-textpic-center csc-textpic-below###CLASSES###">###TEXT######IMAGES###</div>
                # below-right
                9 = TEXT
-               9.value = <div class="csc-textpic csc-textpic-right csc-textpic-below###CLASSES###">###TEXT######IMAGES###</div><div class="csc-textpic-clear"><!-- --></div>
+               9.value = <div class="csc-textpic csc-textpic-right csc-textpic-below###CLASSES###">###TEXT######IMAGES###</div>
                # below-left
                10 = TEXT
-               10.value = <div class="csc-textpic csc-textpic-left csc-textpic-below###CLASSES###">###TEXT######IMAGES###</div><div class="csc-textpic-clear"><!-- --></div>
+               10.value = <div class="csc-textpic csc-textpic-left csc-textpic-below###CLASSES###">###TEXT######IMAGES###</div>
                # intext-right
                17 = TEXT
                17.value = <div class="csc-textpic csc-textpic-intext-right###CLASSES###">###IMAGES######TEXT###</div>
-               17.override = <div class="csc-textpic csc-textpic-intext-right###CLASSES###">###IMAGES######TEXT###</div><div class="csc-textpic-clear"><!-- --></div>
-               17.override.if.isTrue = {$styles.content.imgtext.addIntextClearer}
                # intext-left
                18 = TEXT
                18.value = <div class="csc-textpic csc-textpic-intext-left###CLASSES###">###IMAGES######TEXT###</div>
-               18.override = <div class="csc-textpic csc-textpic-intext-left###CLASSES###">###IMAGES######TEXT###</div><div class="csc-textpic-clear"><!-- --></div>
-               18.override.if.isTrue = {$styles.content.imgtext.addIntextClearer}
                # intext-right-nowrap
                25 = TEXT
-               25.value = <div class="csc-textpic csc-textpic-intext-right-nowrap###CLASSES###">###IMAGES###<div style="margin-right:{register:rowWidthPlusTextMargin}px;">###TEXT###</div></div><div class="csc-textpic-clear"><!-- --></div>
-               25.insertData = 1
+               25.value = <div class="csc-textpic csc-textpic-intext-right-nowrap###CLASSES###">###IMAGES######TEXT###</div>
                # intext-left-nowrap
                26 = TEXT
-               26.value = <div class="csc-textpic csc-textpic-intext-left-nowrap###CLASSES###">###IMAGES###<div style="margin-left:{register:rowWidthPlusTextMargin}px;">###TEXT###</div></div><div class="csc-textpic-clear"><!-- --></div>
-               26.insertData = 1
+               26.value = <div class="csc-textpic csc-textpic-intext-left-nowrap###CLASSES###">###IMAGES######TEXT###</div>
        }
 
        rendering {
-               dl {
+               # Single image - No caption
+               singleNoCaption {
                        # Choose another rendering for special edge cases
                        fallbackRendering = COA
                        fallbackRendering {
-                               # Just one image without a caption => don't need the dl-overhead, use the "simple" rendering
+                               # Single image - Caption
                                10 = TEXT
                                10 {
                                        if {
-                                               isFalse.field = imagecaption
+                                               isTrue.field = imagecaption
                                                value = 1
                                                equals.data = register:imageCount
                                        }
-                                       value = simple
+                                       value = singleCaption
                                }
 
-                               # Multiple images and one global caption => "ul"
+                               # Multiple images and split caption
                                20 = TEXT
                                20 {
                                        if {
                                                value = 1
                                                isGreaterThan.data = register:imageCount
-                                               isTrue.if.isTrue.data = register:renderGlobalCaption
+                                               isTrue.if.isFalse.data = register:renderGlobalCaption
                                                isTrue.field = imagecaption
                                        }
-                                       value = ul
+                                       value = splitCaption
                                }
 
-                               # Multiple images and no caption at all => "ul"
+                               # Multiple images and one global caption
                                30 = TEXT
                                30 {
                                        if {
                                                value = 1
                                                isGreaterThan.data = register:imageCount
+                                               isTrue.if.isTrue.data = register:renderGlobalCaption
+                                               isTrue.field = imagecaption
+                                       }
+                                       value = globalCaption
+                               }
+
+                               # Multiple images and no caption at all
+                               40 = TEXT
+                               40 {
+                                       if {
+                                               value = 1
+                                               isGreaterThan.data = register:imageCount
                                                isFalse.field = imagecaption
                                        }
-                                       value = ul
+                                       value = noCaption
+                               }
+                       }
+                       allStdWrap.wrap = <div class="csc-textpic-imagewrap"> | </div>
+                       singleStdWrap {
+                               wrap = <div class="csc-textpic-image###CLASSES###"> | </div>
+                               wrap {
+                                       override = <figure class="csc-textpic-image###CLASSES###"> | </figure>
+                                       override {
+                                               if {
+                                                       value = html5
+                                                       equals.data = TSFE:config|config|doctype
+                                               }
+                                       }
+                               }
+                       }
+                       rowStdWrap.wrap = |
+                       noRowsStdWrap.wrap = |
+                       lastRowStdWrap.wrap = |
+                       columnStdWrap.wrap = |
+                       imgTagStdWrap.wrap = |
+                       editIconsStdWrap.wrap = <div> | </div>
+                       caption.wrap = |
+               }
+               noCaption {
+                       # Multiple images and no caption at all
+                       fallbackRendering < tt_content.image.20.rendering.singleNoCaption.fallbackRendering.10
+                       allStdWrap.wrap = <div class="csc-textpic-imagewrap"> | </div>
+                       singleStdWrap {
+                               wrap = <div class="csc-textpic-image###CLASSES###"> | </div>
+                               wrap {
+                                       override = <figure class="csc-textpic-image###CLASSES###"> | </figure>
+                               }
+                       }
+                       rowStdWrap.wrap = <div class="csc-textpic-imagerow"> | </div>
+                       noRowsStdWrap.wrap = <div class="csc-textpic-imagerow csc-textpic-imagerow-none"> | </div>
+                       lastRowStdWrap.wrap = <div class="csc-textpic-imagerow csc-textpic-imagerow-last"> | </div>
+                       columnStdWrap.wrap = <div class="csc-textpic-imagecolumn###CLASSES###"> | </div>
+               }
+               singleCaption {
+                       # Just one image with a caption
+                       fallbackRendering < tt_content.image.20.rendering.singleNoCaption.fallbackRendering.10
+                       singleStdWrap {
+                               wrap = <div class="csc-textpic-image###CLASSES###"><table>###CAPTION###<tbody><tr><td> | </td></tr></tbody></table></div>
+                               wrap {
+                                       override = <figure class="csc-textpic-image###CLASSES###">|###CAPTION###</figure>
+                                       override {
+                                               if {
+                                                       value = html5
+                                                       equals.data = TSFE:config|config|doctype
+                                               }
+                                       }
                                }
                        }
-                       imageRowStdWrap.dataWrap = <div class="csc-textpic-imagerow" style="width:{register:rowwidth}px;"> | </div>
-                       imageLastRowStdWrap.dataWrap = <div class="csc-textpic-imagerow csc-textpic-imagerow-last" style="width:{register:rowwidth}px;"> | </div>
-                       noRowsStdWrap.wrap =
-                       oneImageStdWrap.dataWrap = <dl class="csc-textpic-image###CLASSES###" style="width:{register:imagespace}px;"> | </dl>
-                       imgTagStdWrap.wrap = <dt> | </dt>
-                       editIconsStdWrap.wrap = <dd> | </dd>
                        caption {
                                required = 1
-                               wrap = <dd class="csc-textpic-caption"> | </dd>
+                               wrap = <caption class="csc-textpic-caption###CLASSES###"> | </caption>
+                               wrap {
+                                       override = <figcaption class="csc-textpic-caption###CLASSES###"> | </figcaption>
+                                       override {
+                                               if {
+                                                       value = html5
+                                                       equals.data = TSFE:config|config|doctype
+                                               }
+                                       }
+                               }
                        }
                }
-               ul {
-                       # Just one image without a caption => don't need the ul-overhead, use the "simple" rendering
-                       fallbackRendering < tt_content.image.20.rendering.dl.fallbackRendering.10
-                       imageRowStdWrap.dataWrap = <div class="csc-textpic-imagerow" style="width:{register:rowwidth}px;"><ul> | </ul></div>
-                       imageLastRowStdWrap.dataWrap = <div class="csc-textpic-imagerow csc-textpic-imagerow-last" style="width:{register:rowwidth}px;"><ul> | </ul></div>
-                       noRowsStdWrap.wrap = <ul> | </ul>
-                       oneImageStdWrap.dataWrap = <li class="csc-textpic-image###CLASSES###" style="width:{register:imagespace}px;"> | </li>
-                       imgTagStdWrap.wrap =
-                       editIconsStdWrap.wrap = <div> | </div>
-                       caption.wrap = <div class="csc-textpic-caption"> | </div>
-               }
-               div {
-                       # Just one image without a caption => don't need the div-overhead, use the "simple" rendering
-                       fallbackRendering < tt_content.image.20.rendering.dl.fallbackRendering.10
-                       imageRowStdWrap.dataWrap = <div class="csc-textpic-imagerow" style="width:{register:rowwidth}px;"> | </div>
-                       imageLastRowStdWrap.dataWrap = <div class="csc-textpic-imagerow csc-textpic-imagerow-last" style="width:{register:rowwidth}px;"> | </div>
-                       noRowsStdWrap.wrap =
-                       oneImageStdWrap.dataWrap = <div class="csc-textpic-image###CLASSES###" style="width:{register:imagespace}px;"> | </div>
-                       imgTagStdWrap.wrap = <div> | </div>
-                       editIconsStdWrap.wrap = <div> | </div>
-                       caption.wrap = <div class="csc-textpic-caption"> | </div>
+               splitCaption {
+                       fallbackRendering < tt_content.image.20.rendering.singleNoCaption.fallbackRendering.10
+                       singleStdWrap {
+                               wrap = <div class="csc-textpic-image###CLASSES###"><table>###CAPTION###<tbody><tr><td> | </td></tr></tbody></table></div>
+                               wrap {
+                                       override = <figure class="csc-textpic-image###CLASSES###">|###CAPTION###</figure>
+                                       override {
+                                               if {
+                                                       value = html5
+                                                       equals.data = TSFE:config|config|doctype
+                                               }
+                                       }
+                               }
+                       }
+                       rowStdWrap.wrap = <div class="csc-textpic-imagerow"> | </div>
+                       noRowsStdWrap.wrap = <div class="csc-textpic-imagerow csc-textpic-imagerow-none"> | </div>
+                       lastRowStdWrap.wrap = <div class="csc-textpic-imagerow csc-textpic-imagerow-last"> | </div>
+                       columnStdWrap.wrap = <div class="csc-textpic-imagecolumn###CLASSES###"> | </div>
+                       caption {
+                               required = 1
+                               wrap = <caption class="csc-textpic-caption###CLASSES###"> | </caption>
+                               wrap {
+                                       override = <figcaption class="csc-textpic-caption###CLASSES###"> | </figcaption>
+                                       override {
+                                               if {
+                                                       value = html5
+                                                       equals.data = TSFE:config|config|doctype
+                                               }
+                                       }
+                               }
+                       }
                }
-               simple {
-                       imageRowStdWrap.dataWrap = |
-                       imageLastRowStdWrap.dataWrap = |
-                       noRowsStdWrap.wrap =
-                       oneImageStdWrap.dataWrap = |
-                       imgTagStdWrap.wrap = |
-                       editIconsStdWrap.wrap = |
-                       caption.wrap = <div class="csc-textpic-caption"> | </div>
-                       imageStdWrap.dataWrap = <div class="csc-textpic-imagewrap csc-textpic-single-image" style="width:{register:totalwidth}px;"> | </div>
-                       imageStdWrapNoWidth.wrap = <div class="csc-textpic-imagewrap csc-textpic-single-image"> | </div>
+               globalCaption {
+                       # Just one image without a caption
+                       fallbackRendering < tt_content.image.20.rendering.singleNoCaption.fallbackRendering.10
+                       allStdWrap {
+                               wrap = <div class="csc-textpic-imagewrap"><table>###CAPTION###<tbody> | </tbody></table></div>
+                               wrap {
+                                       override = <figure class="csc-textpic-imagewrap"> | ###CAPTION###</figure>
+                                       override {
+                                               if {
+                                                       value = html5
+                                                       equals.data = TSFE:config|config|doctype
+                                               }
+                                       }
+                               }
+                       }
+                       singleStdWrap {
+                               wrap = <div class="csc-textpic-image###CLASSES###"> | </div>
+                               wrap {
+                                       override = <div class="csc-textpic-image###CLASSES###"> | </div>
+                               }
+                       }
+                       rowStdWrap.wrap = <div class="csc-textpic-imagerow"> | </div>
+                       noRowsStdWrap.wrap = <div class="csc-textpic-imagerow csc-textpic-imagerow-none"> | </div>
+                       lastRowStdWrap.wrap = <div class="csc-textpic-imagerow csc-textpic-imagerow-last"> | </div>
+                       columnStdWrap.wrap = <div class="csc-textpic-imagecolumn###CLASSES###"> | </div>
+                       caption {
+                               required = 1
+                               wrap = <caption class="csc-textpic-caption"> | </caption>
+                               wrap {
+                                       override = <figcaption class="csc-textpic-caption###CLASSES###"> | </figcaption>
+                                       override {
+                                               if {
+                                                       value = html5
+                                                       equals.data = TSFE:config|config|doctype
+                                               }
+                                       }
+                               }
+                       }
                }
        }
-       renderMethod = dl
+       renderMethod = singleNoCaption
 
        editIcons = tt_content : image [imageorient|imagewidth|imageheight], [imagecols|image_noRows|imageborder],[image_link|image_zoom],[image_compression|image_effects|image_frames],imagecaption[imagecaption_position]
        editIcons.iconTitle.data = LLL:EXT:css_styled_content/pi1/locallang.xml:eIcon.images
@@ -803,8 +1162,14 @@ tt_content.table {
 
        20.color {
                default =
-               1 = #EDEBF1
-               2 = #F5FFAA
+               1 = {$styles.content.table.backgroundColor.1}
+               2 = {$styles.content.table.backgroundColor.2}
+               200 =
+               240 = {$styles.content.table.backgroundColor.240}
+               241 = {$styles.content.table.backgroundColor.241}
+               242 = {$styles.content.table.backgroundColor.242}
+               243 = {$styles.content.table.backgroundColor.243}
+               244 = {$styles.content.table.backgroundColor.244}
        }
        20.tableParams_0 {
                border =
@@ -848,98 +1213,100 @@ tt_content.uploads {
        10 = < lib.stdheader
 
        20 = USER
-       20.userFunc = tx_cssstyledcontent_pi1->render_uploads
-       20.field = media
-       20.filePath.field = select_key
-
        20 {
+               userFunc = tx_cssstyledcontent_pi1->render_uploads
+               field = media
+               filePath.field = select_key
+
+               outerWrap = <ul class="csc-uploads csc-uploads-{field:layout}">|</ul>
+               outerWrap {
+                       insertData = 1
+               }
+
+               labelStdWrap.wrap = <span class="csc-uploads-fileName">|</span>
+
                # Rendering for each file (e.g. rows of the table) as a cObject
                itemRendering = COA
                itemRendering {
-                       wrap = <tr class="tr-odd tr-first">|</tr> |*| <tr class="tr-even">|</tr> || <tr class="tr-odd">|</tr> |*|
+                       wrap.cObject = COA
+                       wrap.cObject {
+                               10 = LOAD_REGISTER
+                               10 {
+                                       oddEvenClass = li-odd li-first |*| li-even || li-odd
+                                       elementClass = csc-uploads-element csc-uploads-element-{register:fileExtension}
+                                       elementClass.insertData = 1
+                               }
+                               20 = TEXT
+                               20 {
+                                       value = <li class="{register:oddEvenClass} {register:elementClass}">|</li>
+                                       insertData = 1
+                               }
+                               30 = RESTORE_REGISTER
+                       }
 
                        10 = TEXT
-                       10.data = register:linkedIcon
-                       10.wrap = <td class="csc-uploads-icon">|</td>
-                       10.if.isPositive.field = layout
-
-                       20 = COA
-                       20.wrap = <td class="csc-uploads-fileName">|</td>
-                       20.1 = TEXT
-                       20.1 {
-                               data = register:linkedLabel
-                               wrap = <p>|</p>
+                       10 {
+                               data = register:linkedIcon
                        }
-                       20.2 = TEXT
-                       20.2 {
+
+                       20 = TEXT
+                       20 {
                                data = register:description
-                               wrap = <p class="csc-uploads-description">|</p>
+                               htmlSpecialChars = 1
+                               wrap = <span class="csc-uploads-description">|</span>
                                required = 1
                        }
 
                        30 = TEXT
-                       30.if.isTrue.field = filelink_size
-                       30.data = register:fileSize
-                       30.wrap = <td class="csc-uploads-fileSize">|</td>
-                       30.bytes = 1
-                       30.bytes.labels = {$styles.content.uploads.filesizeBytesLabels}
+                       30 {
+                               if.isTrue.field = filelink_size
+                               data = register:fileSize
+                               wrap = <span class="csc-uploads-fileSize">|</span>
+                               bytes = 1
+                               bytes.labels = {$styles.content.uploads.filesizeBytesLabels}
+                       }
                }
                useSpacesInLinkText = 0
                stripFileExtensionFromLinkText = 0
-       }
 
-       20.color {
-               default =
-               1 = #EDEBF1
-               2 = #F5FFAA
-       }
-       20.tableParams_0 {
-               border =
-               cellpadding =
-               cellspacing =
-       }
-       20.tableParams_1 {
-               border =
-               cellpadding =
-               cellspacing =
-       }
-       20.tableParams_2 {
-               border =
-               cellpadding =
-               cellspacing =
-       }
-       20.tableParams_3 {
-               border =
-               cellpadding =
-               cellspacing =
-       }
+               linkProc {
+                       combinedLink = 1
 
-       20.linkProc {
-               target = _blank
-               jumpurl = {$styles.content.uploads.jumpurl}
-               jumpurl.secure = {$styles.content.uploads.jumpurl_secure}
-               jumpurl.secure.mimeTypes = {$styles.content.uploads.jumpurl_secure_mimeTypes}
-               removePrependedNumbers = 1
+                       target < lib.parseTarget
+                       target =
+                       target.override = {$styles.content.uploads.target}
 
-               iconCObject = IMAGE
-               iconCObject.file.import.data = register : ICON_REL_PATH
-               iconCObject.file.width = 150
-       }
+                       title.htmlSpecialChars = 1
 
-       20.filesize {
-               bytes = 1
-               bytes.labels = {$styles.content.uploads.filesizeBytesLabels}
-       }
+                       jumpurl = {$styles.content.uploads.jumpurl}
+                       jumpurl {
+                               secure = {$styles.content.uploads.jumpurl_secure}
+                               secure.mimeTypes = {$styles.content.uploads.jumpurl_secure_mimeTypes}
+                       }
 
-       20.stdWrap {
-               editIcons = tt_content: media, layout [table_bgColor|table_border|table_cellspacing|table_cellpadding], filelink_size, imagecaption
-               editIcons.iconTitle.data = LLL:EXT:css_styled_content/pi1/locallang.xml:eIcon.filelist
+                       removePrependedNumbers = 1
+
+                       iconCObject = IMAGE
+                       iconCObject {
+                               file {
+                                       import.data = register : ICON_REL_PATH
+                                       width = 150
+                               }
+                       }
+               }
+               filesize {
+                       bytes = 1
+                       bytes.labels = {$styles.content.uploads.filesizeBytesLabels}
+               }
+               stdWrap {
+                       editIcons = tt_content: media, layout [table_bgColor|table_border|table_cellspacing|table_cellpadding], filelink_size, imagecaption
+                       editIcons.iconTitle.data = LLL:EXT:css_styled_content/pi1/locallang.xml:eIcon.filelist
 
-               prefixComment = 2 | File list:
+                       prefixComment = 2 | File list:
+               }
        }
 }
 
-
 # ******************
 # CType: multimedia
 # ******************
@@ -1151,7 +1518,9 @@ tt_content.mailform.20 {
        COMMENT.layout = <div class="csc-mailform-label">###LABEL###</div>
        RADIO.layout = <div class="csc-mailform-field">###LABEL### <span class="csc-mailform-radio">###FIELD###</span></div>
        LABEL.layout = <div class="csc-mailform-field">###LABEL### <span class="csc-mailform-label">###FIELD###</span></div>
-       target = {$styles.content.mailform.target}
+       target < lib.parseTarget
+       target =
+       target.override = {$styles.content.mailform.target}
        goodMess = {$styles.content.mailform.goodMess}
        badMess = {$styles.content.mailform.badMess}
        redirect.field = pages
@@ -1193,7 +1562,9 @@ tt_content.search.20 {
                10.htmlSpecialChars = 1
                10.typolink {
                        parameter.field = uid
-                       target = {$styles.content.searchresult.resultTarget}
+                       target < lib.parseTarget
+                       target =
+                       target.override = {$styles.content.searchresult.resultTarget}
                        additionalParams.data = register:SWORD_PARAMS
                        additionalParams.required = 1
                        additionalParams.wrap = &no_cache=1
@@ -1238,7 +1609,10 @@ tt_content.search.20 {
        prev = TEXT
        prev.data = LLL:EXT:css_styled_content/pi1/locallang.xml:search.searchResultPrev
 
-       target = {$styles.content.searchresult.target}
+       target < lib.parseTarget
+       target =
+       target.override = {$styles.content.searchresult.target}
+
        range = 20
 
        stdWrap.prefixComment = 2 | Search result:
@@ -1355,10 +1729,60 @@ tt_content.menu {
                default {
                        special = list
                        special.value.field = pages
-                       wrap = <ul class="csc-menu csc-menu-def">|</ul>
+                       stdWrap {
+                               prepend = COA
+                               prepend {
+                                       stdWrap {
+                                               if.isTrue.field = accessibility_bypass
+                                       }
+                                       10 = LOAD_REGISTER
+                                       10 {
+                                               accessibility_bypass_text = TEXT
+                                               accessibility_bypass_text {
+                                                       field = accessibility_bypass_text
+                                               }
+                                       }
+                                       20 = CONTENT
+                                       20 {
+                                               table = tt_content
+                                               select {
+                                                       pidInList = this
+                                                       orderBy = sorting
+                                                       andWhere {
+                                                               dataWrap = sorting>{field:sorting}
+                                                       }
+                                                       languageField = sys_language_uid
+                                                       max = 1
+                                               }
+                                               renderObj = TEXT
+                                               renderObj {
+                                                       required = 1
+                                                       data = LLL:EXT:css_styled_content/pi1/locallang.xml:menu.bypassNavigation
+                                                       override.data = register:accessibility_bypass_text
+                                                       trim = 1
+                                                       htmlSpecialChars = 1
+                                                       noBlur = 1
+                                                       typolink {
+                                                               parameter {
+                                                                       field = pid
+                                                               }
+                                                               section {
+                                                                       field = uid
+                                                               }
+                                                       }
+                                                       wrap = <li class="csc-nav-bypass">|</li>
+                                               }
+                                       }
+                                       30 = RESTORE_REGISTER
+                               }
+                               outerWrap = <ul class="csc-menu csc-menu-def">|</ul>
+                               required = 1
+                       }
                        1 = TMENU
                        1 {
-                               target = {$PAGE_TARGET}
+                               target < lib.parseTarget
+                               target =
+                               target.override = {$PAGE_TARGET}
                                NO {
                                        stdWrap.htmlSpecialChars = 1
                                        wrapItemAndSub = <li>|</li>
@@ -1372,16 +1796,23 @@ tt_content.menu {
                1 < .default
                1 {
                        special = directory
-                       wrap = <ul class="csc-menu csc-menu-1">|</ul>
+                       stdWrap {
+                               outerWrap = <ul class="csc-menu csc-menu-1">|</ul>
+                       }
                }
 
                # "Sitemap - liststyle"
                2 = HMENU
                2 {
-                       wrap = <div class="csc-sitemap">|</div>
+                       stdWrap < tt_content.menu.20.default.stdWrap
+                       stdWrap {
+                               outerWrap = <div class="csc-sitemap">|</div>
+                       }
                        1 = TMENU
                        1 {
-                               target = {$PAGE_TARGET}
+                               target < lib.parseTarget
+                               target =
+                               target.override = {$PAGE_TARGET}
                                noBlur = 1
                                expAll = 1
                                wrap = <ul>|</ul>
@@ -1400,35 +1831,47 @@ tt_content.menu {
                }
 
                # "Section index (pagecontent w/Index checked - liststyle)"
-               3 < styles.content.get
+               3 < .default
                3 {
-                       wrap = <ul class="csc-menu csc-menu-3">|</ul>
-                       select.andWhere = sectionIndex!=0
-                       select.pidInList.override.field = pages
-                       renderObj = TEXT
-                       renderObj {
-                               fieldRequired = header
-                               trim = 1
-                               field = header
-                               htmlSpecialChars = 1
-                               noBlur = 1
-                               wrap = <li class="csc-section">|</li>
-                               typolink.parameter.field = pid
-                               typolink.section.field = uid
+                       special {
+                               value {
+                                       override {
+                                               data = page:uid
+                                               if {
+                                                       isFalse.field = pages
+                                               }
+                                       }
+                               }
+                       }
+                       stdWrap {
+                               outerWrap = <ul class="csc-menu csc-menu-3">|</ul>
+                       }
+                       1 = TMENU
+                       1 {
+                               sectionIndex = 1
+                               sectionIndex.type = header
+                               NO.wrapItemAndSub = <li class="csc-section">|</li>
                        }
                }
 
                # "Menu of subpages to these pages (with abstract)"
                4 < .1
                4 {
-                       wrap = <dl class="csc-menu csc-menu-4">|</dl>
+                       stdWrap {
+                               prepend.renderObj.wrap = <dt class="csc-nav-bypass">|</dt><dd>&nbsp;</dd>
+                               outerWrap = <dl class="csc-menu csc-menu-4">|</dl>
+                       }
                        1.NO {
                                wrapItemAndSub >
                                linkWrap = <dt>|</dt>
                                after {
-                                       data = field : abstract // field : description // field : subtitle
-                                       required = 1
-                                       htmlSpecialChars = 1
+                                       cObject = TEXT
+                                       cObject {
+                                               data = field : abstract // field : description // field : subtitle
+                                               htmlSpecialChars = 1
+                                               required = 1
+                                       }
+                                       ifBlank = &nbsp;
                                        wrap = <dd>|</dd>
                                }
                                ATagTitle.field = description // title
@@ -1438,7 +1881,9 @@ tt_content.menu {
                # "Recently updated pages"
                5 < .default
                5 {
-                       wrap = <ul class="csc-menu csc-menu-5">|</ul>
+                       stdWrap {
+                               outerWrap = <ul class="csc-menu csc-menu-5">|</ul>
+                       }
                        special = updated
                        special {
                                maxAge = 3600*24*7
@@ -1449,7 +1894,9 @@ tt_content.menu {
                # "Related pages (based on keywords)"
                6 < .default
                6 {
-                       wrap = <ul class="csc-menu csc-menu-6">|</ul>
+                       stdWrap {
+                               outerWrap = <ul class="csc-menu csc-menu-6">|</ul>
+                       }
                        special = keywords
                        special {
                                excludeNoSearchPages = 1
@@ -1459,7 +1906,9 @@ tt_content.menu {
                # "Menu of subpages to these pages + sections - liststyle"
                7 < .1
                7 {
-                       wrap = <ul class="csc-menu csc-menu-7">|</ul>
+                       stdWrap {
+                               outerWrap = <ul class="csc-menu csc-menu-7">|</ul>
+                       }
                        1.expAll = 1
                        2 < .1
                        2 {
@@ -1472,6 +1921,35 @@ tt_content.menu {
        }
 
        20.stdWrap {
+               wrap {
+                       cObject = COA
+                       cObject {
+                               10 = TEXT
+                               10 {
+                                       field = accessibility_title
+                                       htmlSpecialChars = 1
+                                       dataWrap = <map id="map{field:uid}" title="|">
+                                       dataWrap {
+                                               override = <map name="map{field:uid}" title="|">
+                                               override {
+                                                       if {
+                                                               isFalse.data = TSFE:xhtmlDoctype
+                                                       }
+                                               }
+                                       }
+                               }
+
+                               20 = TEXT
+                               20 {
+                                       value = |</map>
+                               }
+                       }
+                       if {
+                               isTrue {
+                                       field = accessibility_title
+                               }
+                       }
+               }
                editIcons = tt_content: menu_type, pages
                editIcons.iconTitle.data = LLL:EXT:css_styled_content/pi1/locallang.xml:eIcon.menuSitemap
 
@@ -1546,7 +2024,11 @@ tt_content.script {
 # ****************
 tt_content.div = TEXT
 tt_content.div {
-       value = <hr />
+       value = <hr>
+       override = <hr />
+       override.if {
+               isTrue.data = TSFE:xhtmlDoctype
+       }
        wrap = <div class="divider">|</div>
        prefixComment = 2 | Div element
 }
@@ -1590,13 +2072,30 @@ tt_content.default {
 
 
 plugin.tx_cssstyledcontent._CSS_DEFAULT_STYLE (
+       /* Headers */
+       .csc-header-alignment-center { text-align: center; }
+       .csc-header-alignment-right { text-align: right; }
+       .csc-header-alignment-left { text-align: left; }
+
+       /* Clear floats after csc-textpic and after csc-textpic-imagerow */
+       DIV.csc-textpic, DIV.csc-textpic DIV.csc-textpic-imagerow, UL.csc-uploads LI { overflow: hidden; }
+
+       /* Set padding for tables */
+       DIV.csc-textpic .csc-textpic-imagewrap table { border-collapse: collapse; border-spacing: 0; }
+       DIV.csc-textpic .csc-textpic-imagewrap table tr td { padding: 0; vertical-align: top; }
+
+       /* Settings for figure and figcaption (HTML5) */
+       DIV.csc-textpic .csc-textpic-imagewrap FIGURE, DIV.csc-textpic FIGURE.csc-textpic-imagewrap { margin: 0; display: table; }
+
        /* Captions */
-       DIV.csc-textpic-caption-c .csc-textpic-caption { text-align: center; }
-       DIV.csc-textpic-caption-r .csc-textpic-caption { text-align: right; }
-       DIV.csc-textpic-caption-l .csc-textpic-caption { text-align: left; }
+       FIGCAPTION.csc-textpic-caption { display: table-caption; }
+       .csc-textpic-caption { text-align: left; caption-side: bottom; }
+       DIV.csc-textpic-caption-c .csc-textpic-caption, .csc-textpic-imagewrap .csc-textpic-caption-c { text-align: center; }
+       DIV.csc-textpic-caption-r .csc-textpic-caption, .csc-textpic-imagewrap .csc-textpic-caption-r { text-align: right; }
+       DIV.csc-textpic-caption-l .csc-textpic-caption, .csc-textpic-imagewrap .csc-textpic-caption-l { text-align: left; }
 
-       /* Needed for noRows setting */
-       DIV.csc-textpic DIV.csc-textpic-imagecolumn { float: left; display: inline; }
+       /* Float the columns */
+       DIV.csc-textpic DIV.csc-textpic-imagecolumn { float: left; }
 
        /* Border just around the image */
        {$styles.content.imgtext.borderSelector} {
@@ -1604,123 +2103,73 @@ plugin.tx_cssstyledcontent._CSS_DEFAULT_STYLE (
                padding: {$styles.content.imgtext.borderSpace}px {$styles.content.imgtext.borderSpace}px;
        }
 
-       DIV.csc-textpic-imagewrap { padding: 0; }
-
-       DIV.csc-textpic IMG { border: none; }
-
-       /* DIV: This will place the images side by side */
-       DIV.csc-textpic DIV.csc-textpic-imagewrap DIV.csc-textpic-image { float: left; }
-
-       /* UL: This will place the images side by side */
-       DIV.csc-textpic DIV.csc-textpic-imagewrap UL { list-style: none; margin: 0; padding: 0; }
-       DIV.csc-textpic DIV.csc-textpic-imagewrap UL LI { float: left; margin: 0; padding: 0; }
-
-       /* DL: This will place the images side by side */
-       DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image { float: left; }
-       DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image DT { float: none; }
-       DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image DD { float: none; }
-       DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image DD IMG { border: none; } /* FE-Editing Icons */
-       DL.csc-textpic-image { margin: 0; }
-       DL.csc-textpic-image DT { margin: 0; display: inline; }
-       DL.csc-textpic-image DD { margin: 0; }
-
-       /* Clearer */
-       DIV.csc-textpic-clear { clear: both; }
-
-       /* Margins around images: */
-
-       /* Pictures on left, add margin on right */
-       DIV.csc-textpic-left DIV.csc-textpic-imagewrap .csc-textpic-image,
-       DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-imagewrap .csc-textpic-image,
-       DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap .csc-textpic-image {
-               display: inline; /* IE fix for double-margin bug */
-               margin-right: {$styles.content.imgtext.colSpace}px;
-       }
-
-       /* Pictures on right, add margin on left */
-       DIV.csc-textpic-right DIV.csc-textpic-imagewrap .csc-textpic-image,
-       DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap .csc-textpic-image,
-       DIV.csc-textpic-intext-right DIV.csc-textpic-imagewrap .csc-textpic-image {
-               display: inline; /* IE fix for double-margin bug */
-               margin-left: {$styles.content.imgtext.colSpace}px;
-       }
-
-       /* Pictures centered, add margin on left */
-       DIV.csc-textpic-center DIV.csc-textpic-imagewrap .csc-textpic-image {
-               display: inline; /* IE fix for double-margin bug */
-               margin-left: {$styles.content.imgtext.colSpace}px;
-       }
-       DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-image .csc-textpic-caption { margin: 0; }
-       DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-image IMG { margin: 0; vertical-align:bottom; }
+       DIV.csc-textpic .csc-textpic-imagewrap IMG { border: none; display: block; }
 
        /* Space below each image (also in-between rows) */
-       DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-image { margin-bottom: {$styles.content.imgtext.rowSpace}px; }
-       DIV.csc-textpic-equalheight DIV.csc-textpic-imagerow { margin-bottom: {$styles.content.imgtext.rowSpace}px; display: block; }
-       DIV.csc-textpic DIV.csc-textpic-imagerow { clear: both; }
-       DIV.csc-textpic DIV.csc-textpic-single-image IMG { margin-bottom: {$styles.content.imgtext.rowSpace}px; }
+       DIV.csc-textpic .csc-textpic-imagewrap .csc-textpic-image { margin-bottom: {$styles.content.imgtext.rowSpace}px; }
+       DIV.csc-textpic .csc-textpic-imagewrap .csc-textpic-imagerow-last .csc-textpic-image { margin-bottom: 0; }
 
-       /* IE7 hack for margin between image rows */
-       *+html DIV.csc-textpic DIV.csc-textpic-imagerow .csc-textpic-image { margin-bottom: 0; }
-       *+html DIV.csc-textpic DIV.csc-textpic-imagerow { margin-bottom: {$styles.content.imgtext.rowSpace}px; }
-
-       /* No margins around the whole image-block */
-       DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-firstcol { margin-left: 0px !important; }
-       DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-lastcol { margin-right: 0px !important; }
+       /* colSpace around image columns, except for last column */
+       DIV.csc-textpic-imagecolumn, TD.csc-textpic-imagecolumn .csc-textpic-image { margin-right: {$styles.content.imgtext.colSpace}px; }
+       DIV.csc-textpic-imagecolumn.csc-textpic-lastcol, TD.csc-textpic-imagecolumn.csc-textpic-lastcol .csc-textpic-image { margin-right: 0; }
 
        /* Add margin from image-block to text (in case of "Text w/ images") */
-       DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap,
-       DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-imagewrap {
-               margin-right: {$styles.content.imgtext.textMargin}px !important;
+       DIV.csc-textpic-intext-left .csc-textpic-imagewrap,
+       DIV.csc-textpic-intext-left-nowrap .csc-textpic-imagewrap {
+               margin-right: {$styles.content.imgtext.textMargin}px;
        }
-       DIV.csc-textpic-intext-right DIV.csc-textpic-imagewrap,
-       DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap {
-               margin-left: {$styles.content.imgtext.textMargin}px !important;
+       DIV.csc-textpic-intext-right .csc-textpic-imagewrap,
+       DIV.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap {
+               margin-left: {$styles.content.imgtext.textMargin}px;
        }
 
        /* Positioning of images: */
 
-       /* Above */
-       DIV.csc-textpic-above DIV.csc-textpic-text { clear: both; }
-
        /* Center (above or below) */
-       DIV.csc-textpic-center { text-align: center; /* IE-hack */ }
-       DIV.csc-textpic-center DIV.csc-textpic-imagewrap { margin: 0 auto; }
-       DIV.csc-textpic-center DIV.csc-textpic-imagewrap .csc-textpic-image { text-align: left; /* Remove IE-hack */ }
-       DIV.csc-textpic-center DIV.csc-textpic-text { text-align: left; /* Remove IE-hack */ }
+       DIV.csc-textpic-center .csc-textpic-imagewrap, DIV.csc-textpic-center FIGURE.csc-textpic-imagewrap { max-width: {$styles.content.imgtext.maxW}px; margin: 0 auto; }
 
        /* Right (above or below) */
-       DIV.csc-textpic-right DIV.csc-textpic-imagewrap { float: right; }
+       DIV.csc-textpic-right .csc-textpic-imagewrap { float: right; }
        DIV.csc-textpic-right DIV.csc-textpic-text { clear: right; }
 
        /* Left (above or below) */
-       DIV.csc-textpic-left DIV.csc-textpic-imagewrap { float: left; }
+       DIV.csc-textpic-left .csc-textpic-imagewrap { float: left; }
        DIV.csc-textpic-left DIV.csc-textpic-text { clear: left; }
 
        /* Left (in text) */
-       DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap { float: left; }
+       DIV.csc-textpic-intext-left .csc-textpic-imagewrap { float: left; }
 
        /* Right (in text) */
-       DIV.csc-textpic-intext-right DIV.csc-textpic-imagewrap { float: right; }
+       DIV.csc-textpic-intext-right .csc-textpic-imagewrap { float: right; }
 
        /* Right (in text, no wrap around) */
-       DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap { float: right; clear: both; }
-       /* Hide from IE5-mac. Only IE-win sees this. \*/
-       * html DIV.csc-textpic-intext-right-nowrap .csc-textpic-text { height: 1%; }
-       /* End hide from IE5/mac */
+       DIV.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap { float: right; }
 
        /* Left (in text, no wrap around) */
-       DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-imagewrap { float: left; clear: both; }
-       /* Hide from IE5-mac. Only IE-win sees this. \*/
-       * html DIV.csc-textpic-intext-left-nowrap .csc-textpic-text,
-       * html .csc-textpic-intext-left ol,
-       * html .csc-textpic-intext-left ul { height: 1%; }
-       /* End hide from IE5/mac */
+       DIV.csc-textpic-intext-left-nowrap .csc-textpic-imagewrap { float: left; }
 
-       DIV.csc-textpic DIV.csc-textpic-imagerow-last { margin-bottom: 0; }
+       DIV.csc-textpic DIV.csc-textpic-imagerow-last, DIV.csc-textpic DIV.csc-textpic-imagerow-none DIV.csc-textpic-last { margin-bottom: 0; }
 
        /* Browser fixes: */
 
        /* Fix for unordered and ordered list with image "In text, left" */
-       .csc-textpic-intext-left ol, .csc-textpic-intext-left ul {padding-left: 40px; overflow: auto; }
+       .csc-textpic-intext-left ol, .csc-textpic-intext-left ul { padding-left: 40px; overflow: auto; }
+
+       /* File Links */
+       UL.csc-uploads { padding: 0; }
+       UL.csc-uploads LI { list-style: none outside none; margin: 1em 0; }
+       UL.csc-uploads IMG { float: left; padding-right: 1em; vertical-align: top; }
+       UL.csc-uploads SPAN { display: block; }
+       UL.csc-uploads SPAN.csc-uploads-fileName { text-decoration: underline; }
+
+       /* Table background colors: */
+
+       TABLE.contenttable-color-1 { background-color: {$styles.content.table.backgroundColor.1}; }
+       TABLE.contenttable-color-2 { background-color: {$styles.content.table.backgroundColor.2}; }
+       TABLE.contenttable-color-240 { background-color: {$styles.content.table.backgroundColor.240}; }
+       TABLE.contenttable-color-241 { background-color: {$styles.content.table.backgroundColor.241}; }
+       TABLE.contenttable-color-242 { background-color: {$styles.content.table.backgroundColor.242}; }
+       TABLE.contenttable-color-243 { background-color: {$styles.content.table.backgroundColor.243}; }
+       TABLE.contenttable-color-244 { background-color: {$styles.content.table.backgroundColor.244}; }
 )