Le besoin spécifique
Ce petit plugin me permet, dans le cadre de mon environnement professionnel, d'intégrer une vidéo placée sous la forme d'un fichier vidéo sur mon serveur, sur un article de ma documentation Joomla.
Fonctionnement
Le fonctionnement de ce plugin est relativement simple, il vous suffit dans votre article de spécifier le nom du fichier vidéo que vous souhaitez intégrer, pour que votre utilisateur puisse me lancer dans le player par défaut de votre browser.
Syntaxe du plugin
Pour utiliser ce plugin, vous devez utiliser la syntaxe suivante :
{videoSEB explication="Ceci est une explication1" url='__DOCUMENTS__/pexel.mp4'}Titre de ma video 1{/videoSEB}
Mon plugin vous générera alors directement votre vidéo avec son explication spécifiquee t son titre. L'intérêt de ce plugin et de pouvoir, si un jour vous devez effectuer une modification spécifique en terme de CSS par exemple ou tout autre modification comme des parametres (html 6, voyons grands !) de la balise video, de corriger uniquement ce code du plugin et l'ensemble des vidéos de vos sites web se verront ainsi corrigées.
videoseb.xml
<?xml version="1.0" encoding="utf-8"?>
<extension version="1.0" type="plugin" group="Content">
<name>Video SEB</name>
<author>Sebastien LHUILLIER</author>
<creationDate>Novembre 2023</creationDate>
<copyright>Sébastien LHUILLIER</copyright>
<license>GNU General Public License version 2 or later; see LICENSE.txt</license>
<authorEmail>Cette adresse e-mail est protégée contre les robots spammeurs. Vous devez activer le JavaScript pour la visualiser.</authorEmail>
<authorUrl>www.sebastien-lhuillier.com</authorUrl>
<version>1.0</version>
<description>Ce plugin ajoute génére le code spécifique pouyr intégrer une video sur le site de la doc du SEB</description>
<files>
<filename plugin="videoseb">videoseb.php</filename>
<filename>videoseb.xml</filename>
</files>
</extension>videoseb.php
<?php
defined('_JEXEC') or die('Access deny');
class plgContentvideoseb extends JPlugin
{
function onContentPrepare($content, $article, $params, $limit){
$document = JFactory::getDocument();
$document->addStyleSheet('plugins/content/videoseb/style.css');
$re = '/({videoSEB\s*url\s*=\s*\'|"(.*)\'|"\s*explication\s*=\s*\'|"(.*)\'|"\s*}(.*){\/videoSEB})|({videoSEB\s*explication\s*=\s*(\'|")(.*)(\'|")\s*url\s*=\s*(\'|")(.*)(\'|")\s*}(.*){\/videoSEB})/mi';
preg_match_all($re, $article->text, $matches, PREG_SET_ORDER, 0);
$ch = '<div class="titre-video">'.$matches[0][12].'</div>';
$ch .= '<video controls="controls" width="800px">';
$ch .= '<source src="'.$matches[0][10].'" style="800px">';
$ch .= "Votre navigateur ne prend pas en charge la video</video>";
$ch .= '<div class="explications-video">';
//je supprime le tag de l'article
$re = '/{videoSEB.*{\/videoSEB}/m';
$article->text = preg_replace($re,$ch, $article->text);
}
}style.css
video .ribbon-2 {
--f: 10px; /* control the folded part*/
--r: 15px; /* control the ribbon shape */
--t: 10px; /* the top offset */
position: absolute;
inset: var(--t) calc(-1*var(--f)) auto auto;
padding: 0 10px var(--f) calc(10px + var(--r));
clip-path:
polygon(0 0,100% 0,100% calc(100% - var(--f)),calc(100% - var(--f)) 100%,
calc(100% - var(--f)) calc(100% - var(--f)),0 calc(100% - var(--f)),
var(--r) calc(50% - var(--f)/2));
background: #BD1550;
box-shadow: 0 calc(-1*var(--f)) 0 inset #0005;
}
video {
border: 3px solid red;
text-align: center;
}