I have just done! But it doesnt work... you can see the file that I have changed.
<?php
/*
# ------------------------------------------------------------------------
# Vina Youtube Carousel Gallery for Joomla 3
# ------------------------------------------------------------------------
# Copyright(C) 2015 www.VinaGecko.com. All Rights Reserved.
# @license http://www.gnu.org/licenseses/gpl-3.0.html GNU/GPL
# Author: VinaGecko.com
# Websites: http://vinagecko.com
# Forum: http://vinagecko.com/forum/
# ------------------------------------------------------------------------
*/
// no direct access
defined('_JEXEC') or die('Restricted access');
?>
<script type="text/javascript">
var Youtube<?php echo $module->id; ?> = {
init: function (config) {
this.container = config.container;
this.data = config.data;
this.attach();
this.fetch();
},
attach: function () {
var self = this,
autoPlay = '?autoplay=0',
showInfo = '&showinfo=0',
autoHide = '&autohide=2',
fullScreen = '',
controls = '&controls=0';
if(self.data.autoPlay) autoPlay = '?autoplay=1';
if(self.data.showInfo) showInfo = '&showinfo=1';
if(self.data.autoHide) autoHide = '&autohide=1';
if(self.data.allowFullScreen) fullScreen = '&fs=1';
if(self.data.controls) controls = '&controls=1';
var mainID = self.data.mainID,
structure = [
'<div class="featured">',
'<iframe src="https://youtube.com/embed/' + mainID + autoPlay + autoHide + showInfo + fullScreen + controls + '" width="' + self.data.width + '" height="' + self.data.height + '" frameborder="0" allowfullscreen />',
'</div>',
'<div class="carousel-container cf">',
'<span class="shadow shadow-left" />',
'<span class="prev controll" />',
'<div class="carousel-inner">',
'<ul class="slider cf" />',
'</div>',
'<span class="next controll" />',
'<span class="shadow shadow-right" />',
'</div>'
];
if (mainID) {
jQuery(structure.join('')).appendTo(self.container);
} else {
throw new Error('The url of the video page is wrong or not defined');
}
},
fetch: function () {
var self = this,
autoPlay = '?autoplay=0',
showInfo = '&showinfo=0',
autoHide = '&autohide=2',
fullScreen = '',
controls = '&controls=0';
if(self.data.autoPlay) autoPlay = '?autoplay=1';
if(self.data.showInfo) showInfo = '&showinfo=1';
if(self.data.autoHide) autoHide = '&autohide=1';
if(self.data.allowFullScreen) fullScreen = '&fs=1';
if(self.data.controls) controls = '&controls=1';
var videos = self.data.videos,
carousel = jQuery(self.container).find('.carousel-container'),
i, l;
for (i = 0, l = videos.length; i < l; i += 1) {
var id = videos[i].videoID;
var url = 'https://youtube.com/embed/'+ id + autoPlay + autoHide + showInfo + fullScreen + controls,
thumb = 'https://img.youtube.com/vi/' + id + '/hqdefault.jpg',
els = [
'<li class="thumb">',
'<a href="' + url + '&rel=0">',
'<img src="' + thumb + '" alt="' + id + '">',
'</a>',
'</li>'
].join('');
carousel.find('.slider').append(els);
}
jQuery(window).load(function () {
self.carousel();
})
},
carousel: function () {
var self = this,
slider = jQuery(self.container).find('.slider'),
controll = jQuery(self.container).find('.carousel-container .controll'),
featured = jQuery(self.container).find('.featured'),
photosLen = slider.find('li').length;
if (photosLen > 3) {
var itemWidth = jQuery(self.container).find('.slider li').outerWidth(true);
controll.css({display: 'block'});
slider.css({
left: '-'+itemWidth+'px'
});
slider.find('li:first').before(slider.find('li:last'));
jQuery(self.container).on('click', '.carousel-container .controll', function (){
var $this = jQuery(this);
if ($this.hasClass('next')) {
var leftIndent = parseInt(slider.css('left')) - itemWidth;
jQuery(self.container).find('.slider:not(:animated)').animate({'left' : leftIndent}, 500, function () {
slider.find('li:last').after(slider.find('li:first'));
slider.css({left : '-'+itemWidth+'px'});
});
} else {
var leftIndent = parseInt(slider.css('left')) + itemWidth;
jQuery(self.container).find('.slider:not(:animated)').animate({'left' : leftIndent}, 500, function () {
slider.find('li:first').before(slider.find('li:last'));
slider.css({left : '-'+itemWidth+'px'});
});
}
});
};
jQuery(self.container).on('click', '.thumb', function (e) {
e.preventDefault();
var href = jQuery(this).find('a').attr('href');
featured.find('iframe').attr({'src' : href+'?autoplay=1'});
slider.find('li').removeClass('current');
jQuery(this).addClass('current');
});
}
};
</script>
