Skip to content
Snippets Groups Projects
Commit b327700d authored by Matthias Adrowski's avatar Matthias Adrowski
Browse files

[TASK] Remove old js dependency

parent 5e85eb79
No related branches found
No related tags found
1 merge request!6TYPO3 11
/**
* JavaScript module for the sg-youtube plugin
*
* @deprecated since version 4.4.0 and will be removed in 5.0.0
*/
module.exports = function() {
'use strict';
const $ = require('jquery');
require('magnific-popup');
/**
* Initialize the whole Popup setup
*/
function init(section) {
$(`${section || ''} .sg-youtube-item`).each(function (index, item) {
let $youtubeItem = $(item),
viewportWidth = Math.max(document.documentElement.clientWidth || 0, window.innerWidth || 0);
if (($youtubeItem.data('disable-lightbox') && viewportWidth >= 680) ||
($youtubeItem.data('disable-lightbox-mobile') && viewportWidth < 680)
) {
$youtubeItem.on('click', replaceThumbnailWithVideo);
} else {
$youtubeItem.magnificPopup({
type: 'iframe',
iframe: {
patterns: {
youtube: {
index: 'youtube.com/',
id: function(url) {
return prepareVideoUrl(url);
},
src: '//www.youtube-nocookie.com/embed/%id%'
}
}
}
});
}
});
}
/**
* Replaces the given element behind the event with a youtube video.
*
* @param {Event} event
*/
function replaceThumbnailWithVideo(event) {
event.preventDefault();
let $youtubeItem = $(event.currentTarget);
// This needs to be done, because the height of inline elements is always 0, if on auto...
$youtubeItem.css('display', 'block');
let queryString = prepareVideoUrl($youtubeItem.attr('href')),
$thumbnailElement = $youtubeItem.find('.sg-youtube-image'),
width = $thumbnailElement.outerWidth() + 'px',
height = $thumbnailElement.outerHeight() + 'px';
$thumbnailElement.replaceWith('<div class="sg-youtube-item sg-card-shadow" ' +
'style="height: ' + height + '; width: ' + width + ';"><iframe ' +
'width="' + width + '" height="' + height + '" ' +
'src="https://www.youtube-nocookie.com/embed/' + queryString + '" frameborder="0" ' +
'allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" ' +
'allowfullscreen></iframe></div>');
}
/**
* Prepares the given url, or returns null.
*
* @param {string} url
* @return {string|null}
*/
function prepareVideoUrl(url) {
let matches = url.match(/watch\?v=(.*)&list=(.*)/);
if (!matches) {
// check if the list parameter is missing
matches = url.match(/watch\?v=([^?&]*)/);
if (!matches) {
return null;
}
}
let [, videoString] = matches,
queryParameterSeparator = '?';
if (matches[2]) {
videoString += '?list=' + matches[2];
queryParameterSeparator = '&';
}
return videoString + queryParameterSeparator + 'autoplay=1&rel=0';
}
init();
};
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment