Add youtube and poster support to files

Respect them in video element.
This commit is contained in:
Daniel Siepmann 2020-08-21 12:43:33 +02:00
parent a99ccd1d13
commit 3b1f51371b
9 changed files with 147 additions and 9 deletions

View file

@ -0,0 +1,60 @@
<?php
namespace DanielSiepmann\DsSite\EventListener;
/*
* Copyright (C) 2020 Daniel Siepmann <coding@daniel-siepmann.de>
*
* This program is free software; you can redistribute it and/or
* modify it under the terms of the GNU General Public License
* as published by the Free Software Foundation; either version 2
* of the License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program; if not, write to the Free Software
* Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA
* 02110-1301, USA.
*/
use TYPO3\CMS\Core\Resource\Event\EnrichFileMetaDataEvent;
use TYPO3\CMS\Core\Resource\FileReference;
use TYPO3\CMS\Frontend\Resource\FileCollector;
class AddFurtherMetadataToFile
{
/**
* @var FileCollector
*/
private $fileCollector;
public function __construct(FileCollector $fileCollector)
{
$this->fileCollector = $fileCollector;
}
public function __invoke(EnrichFileMetaDataEvent $event): void
{
$record = $event->getRecord();
$record['poster'] = $this->resolvePoster($record);
$event->setRecord($record);
}
private function resolvePoster(array $record): ?FileReference
{
$this->fileCollector->addFilesFromRelation(
'sys_file_metadata',
'poster',
$record
);
$files = $this->fileCollector->getFiles();
return $files[0] ?? null;
}
}

View file

@ -28,3 +28,12 @@ services:
iconIdentifier: 'content-widget-rss' iconIdentifier: 'content-widget-rss'
height: 'medium' height: 'medium'
width: 'small' width: 'small'
# Events
DanielSiepmann\DsSite\EventListener\AddFurtherMetadataToFile:
public: true
tags:
- name: event.listener
identifier: 'AddFurtherMetadataToFile'
event: TYPO3\CMS\Core\Resource\Event\EnrichFileMetaDataEvent
after: 'languageAndWorkspaceOverlay'

View file

@ -0,0 +1,35 @@
<?php
(function (string $extensionKey, string $tableName) {
$languagePath = 'LLL:EXT:' . $extensionKey . '/Resources/Private/Language/locallang_tca.xlf:' . $tableName . '.';
\TYPO3\CMS\Core\Utility\ArrayUtility::mergeRecursiveWithOverrule($GLOBALS['TCA'][$tableName], [
'columns' => [
'youtube' => [
'label' => $languagePath . 'youtube',
'config' => [
'type' => 'input',
'eval' => 'trim',
],
],
'poster' => [
'label' => $languagePath . 'poster',
'config' => \TYPO3\CMS\Core\Utility\ExtensionManagementUtility::getFileFieldTCAConfig(
'poster',
[
'maxitems' => 1,
],
$GLOBALS['TYPO3_CONF_VARS']['GFX']['imagefile_ext']
),
],
],
]);
\TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addToAllTCAtypes(
$tableName,
'youtube, poster',
'',
'after:title'
);
})('ds_site', 'sys_file_metadata');

View file

@ -1,7 +1,7 @@
<?php <?php
(function (string $extensionKey, string $table, string $ctype) { (function (string $extensionKey, string $tableName, string $ctype) {
\TYPO3\CMS\Core\Utility\ArrayUtility::mergeRecursiveWithOverrule($GLOBALS['TCA'][$table], [ \TYPO3\CMS\Core\Utility\ArrayUtility::mergeRecursiveWithOverrule($GLOBALS['TCA'][$tableName], [
'types' => [ 'types' => [
$ctype => [ $ctype => [
'showitem' => implode(',', [ 'showitem' => implode(',', [

View file

@ -1,7 +1,7 @@
<?php <?php
(function (string $extensionKey, string $table, string $ctype) { (function (string $extensionKey, string $tableName, string $ctype) {
\TYPO3\CMS\Core\Utility\ArrayUtility::mergeRecursiveWithOverrule($GLOBALS['TCA'][$table], [ \TYPO3\CMS\Core\Utility\ArrayUtility::mergeRecursiveWithOverrule($GLOBALS['TCA'][$tableName], [
'types' => [ 'types' => [
$ctype => [ $ctype => [
'showitem' => implode(',', [ 'showitem' => implode(',', [

View file

@ -12,6 +12,13 @@
<trans-unit id="tt_content.video"> <trans-unit id="tt_content.video">
<source>Video</source> <source>Video</source>
</trans-unit> </trans-unit>
<trans-unit id="sys_file_metadata.youtube">
<source>YouTube key of Video</source>
</trans-unit>
<trans-unit id="sys_file_metadata.poster">
<source>Poster Image before Video is loaded</source>
</trans-unit>
</body> </body>
</file> </file>
</xliff> </xliff>

View file

@ -1,15 +1,18 @@
<html xmlns:f="http://typo3.org/ns/TYPO3/Fluid/ViewHelpers" <html xmlns:f="http://typo3.org/ns/TYPO3/Fluid/ViewHelpers"
data-namespace-typo3-fluid="true"> data-namespace-typo3-fluid="true">
<figure> <figure>
<video controls> <video controls {f:if(condition: video.properties.poster.publicUrl, then: 'poster="{video.properties.poster.publicUrl}"')}>
<source src="{video.publicUrl}" type="video/mp4"> <source src="https://daniel-siepmann.de/fileadmin/Videos/PHPUnit/UnitTesting-Introduction.mp4" type="video/mp4">
<p> <p>
Sorry, your browser doesn't support embedded videos.<br> Sorry, your browser doesn't support embedded videos.<br>
You can find the raw video file here: <a href="{video.publicUrl}">{video.publicUrl}</a> You can find the raw video file here: <a href="{video.publicUrl}">{video.publicUrl}</a>.
</p> </p>
</video> </video>
<figcaption> <figcaption>
<p>Video v{video.originalFile.uid}: {video.title}</p> <p>Video v{video.originalFile.uid}: {video.title}</p>
<f:if condition="{video.properties.youtube}">
<p>The Video is available on YouTube: <f:link.typolink parameter="https://www.youtube.com/watch?v=EZkwnqb-4vk" target="_blank">https://www.youtube.com/watch?v={video.properties.youtube}</f:link.typolink>.</p>
</f:if>
<p>{video.description -> f:format.nl2br()}</p> <p>{video.description -> f:format.nl2br()}</p>
</figcaption> </figcaption>
</figure> </figure>

View file

@ -11,9 +11,28 @@
<source src="/{video.publicUrl}" type="video/mp4"> <source src="/{video.publicUrl}" type="video/mp4">
</video> </video>
<figcaption> <figcaption>
<p>Video v{video.originalFile.uid}: {video.title}</p>
<p> <p>
Video v{video.originalFile.uid}: {video.title}<br> <f:if condition="{video.properties.youtube}">
{video.description -> f:format.nl2br()} <f:then>
The Video is available on YouTube: <f:link.typolink parameter="https://www.youtube.com/watch?v=EZkwnqb-4vk" target="_blank">https://www.youtube.com/watch?v={video.properties.youtube}</f:link.typolink>.
</f:then>
<f:else>
The Video is not available on YouTube
</f:else>
</f:if>
</p>
<p>{video.description -> f:format.nl2br()}</p>
<p>
<f:if condition="{video.properties.poster}">
<f:then>
<f:image image="{video.properties.poster}" height="210" width="375" />
</f:then>
<f:else>
No poster configured.
</f:else>
</f:if>
</p> </p>
</figcaption> </figcaption>
</figure> </figure>

View file

@ -1,3 +1,8 @@
CREATE TABLE sys_category ( CREATE TABLE sys_category (
slug varchar(2048), slug varchar(2048),
); );
CREATE TABLE sys_file_metadata (
youtube varchar(255) DEFAULT '' NOT NULL,
poster int(11) unsigned DEFAULT '0' NOT NULL,
);