Skip to content
GitLab
Commit c1768c28 authored by Tim Wagner's avatar Tim Wagner
Browse files

Merge branch 'feature_uxRefactoring' into 'master' 

[FEATURE] UX Refactoring

See merge request !3
parents 9911c442 b1d698a4
Hide whitespace changes
Inline Side-by-side
Classes/Controller/YoutubeController.php
View file @ c1768c28
......@@ -83,6 +83,8 @@ class YoutubeController extends ActionController {
'feed' => $jsonArray['items'],
'response' => $jsonArray,
'debugOutput' => $debugOutput,
'showTitle' => (int) ($this->settings['showTitle'] ?? 1),
'showDescription' => (int) ($this->settings['showDescription'] ?? 1),
]
);
......@@ -109,10 +111,7 @@ class YoutubeController extends ActionController {
return $jsonArray;
}
/**
* @var int $index
* @var FileReference $fileObject
*/
/** @var FileReference $fileObject */
foreach ($fileObjects as $index => $fileObject) {
if (!isset($jsonArray[$index])) {
break;
......
Classes/Hooks/PageLayoutView/PluginRenderer.php
View file @ c1768c28
......@@ -54,27 +54,30 @@ class PluginRenderer implements PageLayoutViewDrawItemHookInterface {
$this->adaptPluginHeaderContent($headerContent, $row);
$view = GeneralUtility::makeInstance(StandaloneView::class);
$view->setPartialRootPaths(['EXT:sg_youtube/Resources/Private/Partials/Backend']);
$view->setTemplateRootPaths(['EXT:sg_youtube/Resources/Private/Templates/Youtube']);
$view->setTemplate('Backend.html');
$view->assign('uid', $row['uid']);
// Set plugin options array
$pluginOptions = GeneralUtility::xml2array($row['pi_flexform'], 'T3:');
$templateOptions = [];
if (is_array($pluginOptions)) {
foreach ($pluginOptions['data']['sDEF']['lDEF'] as $option => $value) {
if ($option !== 'settings.showApiResult') {
// $option has the format 'settings.<key>', but in the template we want the language label which
// has the format 'flexform.<key>'.
$templateOptions[str_replace('settings.', '', $option)] = $value['vDEF'];
}
}
// Get available plugin settings and their values from flexform
$pluginConfiguration = GeneralUtility::xml2array(
$row['pi_flexform'], 'T3DataStructure'
)['data']['sDEF']['lDEF'];
$view->assignMultiple([
'pluginOptions' => $templateOptions,
'showApiResult' => $pluginOptions['data']['sDEF']['lDEF']['settings.showApiResult']['vDEF']
]);
}
$templateData = [
'youtubeId' => $pluginConfiguration['settings.id']['vDEF'],
'maxResults' => $pluginConfiguration['settings.maxResults']['vDEF'],
'showTitle' => (int) ($pluginConfiguration['settings.showTitle']['vDEF'] ?? 1),
'showDescription' => (int) ($pluginConfiguration['settings.showDescription']['vDEF'] ?? 1),
'disableLightbox' => $pluginConfiguration['settings.disableLightbox']['vDEF'],
'disableLightboxMobile' => $pluginConfiguration['settings.disableLightboxMobile']['vDEF'],
'aspectRatio' => $pluginConfiguration['settings.aspectRatio']['vDEF'],
'thumbnailType' => $pluginConfiguration['settings.thumbnailType']['vDEF'],
'thumbnailImagesCount' => $pluginConfiguration['settings.thumbnailImages']['vDEF'],
'showApiResult' => $pluginConfiguration['settings.showApiResult']['vDEF'],
];
$view->assign('data', $templateData);
$itemContent .= $view->render();
}
......
Configuration/FlexForms/flexform_sgyoutube_youtube.xml
View file @ c1768c28
......@@ -13,18 +13,6 @@
</TCEforms>
<type>array</type>
<el>
<settings.showApiResult>
<TCEforms>
<exclude>0</exclude>
<label>LLL:EXT:sg_youtube/Resources/Private/Language/locallang.xlf:flexform.showApiResult
</label>
<config>
<type>check</type>
<default>0</default>
</config>
</TCEforms>
</settings.showApiResult>
<settings.id>
<TCEforms>
<exclude>0</exclude>
......@@ -56,6 +44,28 @@
</TCEforms>
</settings.maxResults>
<settings.showTitle>
<TCEforms>
<exclude>0</exclude>
<label>LLL:EXT:sg_youtube/Resources/Private/Language/locallang.xlf:flexform.showTitle</label>
<config>
<type>check</type>
<default>1</default>
</config>
</TCEforms>
</settings.showTitle>
<settings.showDescription>
<TCEforms>
<exclude>0</exclude>
<label>LLL:EXT:sg_youtube/Resources/Private/Language/locallang.xlf:flexform.showDescription</label>
<config>
<type>check</type>
<default>1</default>
</config>
</TCEforms>
</settings.showDescription>
<settings.disableLightbox>
<TCEforms>
<exclude>0</exclude>
......@@ -213,6 +223,18 @@
</config>
</TCEforms>
</settings.thumbnailImages>
<settings.showApiResult>
<TCEforms>
<exclude>0</exclude>
<label>LLL:EXT:sg_youtube/Resources/Private/Language/locallang.xlf:flexform.showApiResult
</label>
<config>
<type>check</type>
<default>0</default>
</config>
</TCEforms>
</settings.showApiResult>
</el>
</ROOT>
</sDEF>
......
Resources/Private/Language/de.locallang.xlf
View file @ c1768c28
......@@ -17,6 +17,10 @@
<source><![CDATA[Settings]]></source>
<target><![CDATA[Einstellungen]]></target>
</trans-unit>
<trans-unit id="backendPreview.thumbnailImagesCount" approved="yes">
<source><![CDATA[Number of thumbnail replacement images]]></source>
<target><![CDATA[Anzahl der Thumbnail-Ersatzbilder]]></target>
</trans-unit>
<trans-unit id="backendPreview.values" approved="yes">
<source><![CDATA[Values]]></source>
<target><![CDATA[Werte]]></target>
......@@ -45,6 +49,14 @@
<source><![CDATA[Show API Result (Debug Output!)]]></source>
<target><![CDATA[Zeige API-Ergebnis an (Debug-Informationen!)]]></target>
</trans-unit>
<trans-unit id="flexform.showDescription" approved="yes">
<source><![CDATA[Show Video Descriptions]]></source>
<target><![CDATA[Videobeschreibungen anzeigen]]></target>
</trans-unit>
<trans-unit id="flexform.showTitle" approved="yes">
<source><![CDATA[Show Video Titles]]></source>
<target><![CDATA[Video-Titel anzeigen]]></target>
</trans-unit>
<trans-unit id="flexform.thumbnailImages" approved="yes">
<source><![CDATA[Custom Thumbnails for the Videos (The first image will be set on the first Youtube Video, then the second image one to the second video and so on...)]]></source>
<target><![CDATA[Benutzerdefinierte Thumbnails für die Videos (Das erste Bild wird auf das erste Youtube-Video gesetzt, dann das zweite Bild auf das zweite Video und so weiter...)]]></target>
......
Resources/Private/Language/locallang.xlf
View file @ c1768c28
......@@ -14,6 +14,9 @@
<trans-unit id="backendPreview.settings">
<source><![CDATA[Settings]]></source>
</trans-unit>
<trans-unit id="backendPreview.thumbnailImagesCount">
<source><![CDATA[Number of thumbnail replacement images]]></source>
</trans-unit>
<trans-unit id="backendPreview.values">
<source><![CDATA[Values]]></source>
</trans-unit>
......@@ -35,6 +38,12 @@
<trans-unit id="flexform.showApiResult">
<source><![CDATA[Show API Result (Debug Output!)]]></source>
</trans-unit>
<trans-unit id="flexform.showDescription">
<source><![CDATA[Show Video Descriptions]]></source>
</trans-unit>
<trans-unit id="flexform.showTitle">
<source><![CDATA[Show Video Titles]]></source>
</trans-unit>
<trans-unit id="flexform.thumbnailImages">
<source><![CDATA[Custom Thumbnails for the Videos (The first image will be set on the first Youtube Video, then the second image one to the second video and so on...)]]></source>
</trans-unit>
......
Resources/Private/Partials/Backend/BooleanIcon.html 0 → 100644
View file @ c1768c28
{namespace core=TYPO3\CMS\Core\ViewHelpers}
<f:if condition="{boolValue}">
<f:then>
<core:icon alternativeMarkupIdentifier="inline" identifier="actions-check"/>
</f:then>
<f:else>
<core:icon alternativeMarkupIdentifier="inline" identifier="actions-close"/>
</f:else>
</f:if>
Resources/Private/Templates/Youtube/Backend.html
View file @ c1768c28
......@@ -8,7 +8,7 @@
<be:link.editRecord uid="{uid}" table="tt_content">
<br/>
<f:if condition="{showApiResult} == 1">
<f:if condition="{data.showApiResult}">
<div class="alert alert-warning">
<h4 class="alert-title">
<f:translate key="backendPreview.apiDebugWarning.header" extensionName="SgYoutube"/>
......@@ -29,17 +29,100 @@
</th>
</tr>
</thead>
<tbody>
<f:for each="{pluginOptions}" as="option" key="labelKey">
<tr>
<th scope="row">
<f:translate key="flexform.id" extensionName="SgYoutube"/>
</th>
<td>
{data.youtubeId}
</td>
</tr>
<tr>
<th scope="row">
<f:translate key="flexform.maxResults" extensionName="SgYoutube"/>
</th>
<td>
{data.maxResults}
</td>
</tr>
<tr>
<th scope="row">
<f:translate key="flexform.showTitle" extensionName="SgYoutube"/>
</th>
<td>
<f:render partial="BooleanIcon" arguments="{boolValue: '{data.showTitle}'}"/>
</td>
</tr>
<tr>
<th scope="row">
<f:translate key="flexform.showDescription" extensionName="SgYoutube"/>
</th>
<td>
<f:render partial="BooleanIcon" arguments="{boolValue: '{data.showDescription}'}"/>
</td>
</tr>
<tr>
<th scope="row">
<f:translate key="flexform.disableLightbox" extensionName="SgYoutube"/>
</th>
<td>
<f:render partial="BooleanIcon" arguments="{boolValue: '{data.disableLightbox}'}"/>
</td>
</tr>
<tr>
<th scope="row">
<f:translate key="flexform.disableLightboxMobile" extensionName="SgYoutube"/>
</th>
<td>
<f:render partial="BooleanIcon" arguments="{boolValue: '{data.disableLightboxMobile}'}"/>
</td>
</tr>
<tr>
<th scope="row">
<f:translate key="flexform.thumbnailType" extensionName="SgYoutube"/>
</th>
<td>
<f:if condition="{data.thumbnailType}">
<f:then>
<f:translate key="flexform.thumbnailType.{data.thumbnailType}"
extensionName="SgYoutube"/>
</f:then>
<f:else>
<f:translate key="flexform.thumbnailType.default" extensionName="SgYoutube"/>
</f:else>
</f:if>
</td>
</tr>
<f:if condition="{data.thumbnailType} == 'byAspectRatio'">
<tr>
<th scope="row">
<f:translate key="flexform.aspectRatio" extensionName="SgYoutube"/>
</th>
<td>
{data.aspectRatio}
</td>
</tr>
</f:if>
<f:if condition="{data.thumbnailImagesCount} > 0">
<tr>
<th scope="row">
<f:translate key="flexform.{labelKey}" extensionName="SgYoutube"/>
<f:translate key="backendPreview.thumbnailImagesCount" extensionName="SgYoutube"/>
</th>
<td>
{option}
{data.thumbnailImagesCount}
</td>
</tr>
</f:for>
</f:if>
</tbody>
</table>
</be:link.editRecord>
Resources/Private/Templates/Youtube/Index.html
View file @ c1768c28
......@@ -8,7 +8,7 @@
<f:if condition="{response.kind} == 'youtube#playlistItemListResponse' && {feed -> f:count() > 0}">
<f:then>
<div class="sg-youtube-playlist">
<f:if condition="{feed -> f:count()} == 1">
<f:if condition="{feed -> f:count()} === 1">
<f:then>
<ul class="sg-youtube">
<li class="sg-youtube-item-container sg-youtube-item-single">
......@@ -25,6 +25,11 @@
</h3>
</div>
</f:if>
<f:if condition="{showDescription} && {feed.0.description}">
<div class="sg-youtube-text">
<f:format.htmlentitiesDecode><f:format.crop maxCharacters="200">{feed.0.description}</f:format.crop></f:format.htmlentitiesDecode>
</div>
</f:if>
</a>
</li>
</ul>
......@@ -38,13 +43,18 @@
<img src="{feed.0.thumbnail}" alt="{feed.0.title}"/>
</div>
</f:if>
<f:if condition="{feed.0.title}">
<f:if condition="{showTitle} && {feed.0.title}">
<div class="sg-youtube-title">
<h3 class="h3">
<f:format.htmlentitiesDecode>{feed.0.title}</f:format.htmlentitiesDecode>
</h3>
</div>
</f:if>
<f:if condition="{showDescription} && {feed.0.description}">
<div class="sg-youtube-text">
<f:format.htmlentitiesDecode><f:format.crop maxCharacters="200">{feed.0.description}</f:format.crop></f:format.htmlentitiesDecode>
</div>
</f:if>
</a>
</div>
</div>
......@@ -58,7 +68,7 @@
<img src="{feedItem.thumbnail}" alt="{feedItem.title}"/>
</div>
</f:if>
<f:if condition="{feedItem.title}">
<f:if condition="{showTitle} && {feedItem.title}">
<div class="sg-youtube-title">
<h3 class="h3">
<f:format.htmlentitiesDecode>{feedItem.title}</f:format.htmlentitiesDecode>
......@@ -84,14 +94,14 @@
<img src="{feedItem.thumbnail}" alt="{feedItem.title}"/>
</div>
</f:if>
<f:if condition="{feedItem.title}">
<f:if condition="{showTitle} && {feedItem.title}">
<div class="sg-youtube-title">
<h3 class="h3">
<f:format.htmlentitiesDecode>{feedItem.title}</f:format.htmlentitiesDecode>
</h3>
</div>
</f:if>
<f:if condition="{feedItem.description}">
<f:if condition="{showDescription} && {feedItem.description}">
<div class="sg-youtube-text">
<f:format.htmlentitiesDecode><f:format.crop maxCharacters="200">{feedItem.description}</f:format.crop></f:format.htmlentitiesDecode>
</div>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment