Your IP : 216.73.216.84

Current Path : /home/helpink/www/components/com_jbusinessdirectory/views/event/tmpl/
Upload File :
Current File : /home/helpink/www/components/com_jbusinessdirectory/views/event/tmpl/event_videos.php

<?php /**
 * @package    J-BusinessDirectory
 *
 * @author     CMSJunkie http://www.cmsjunkie.com/
 * @copyright  Copyright (C) 2007 - 2022 CMSJunkie. All rights reserved.
 * @license    https://www.gnu.org/licenses/agpl-3.0.en.html
 */

defined('_JEXEC') or die('Restricted access');

// Include LightGallery
JBusinessUtil::enqueueStyle('libraries/lightgallery/lightgallery.min.css');
JBusinessUtil::enqueueScript('libraries/lightgallery/lightgallery.min.js');
JBusinessUtil::enqueueScript('libraries/lightgallery/plugins/video/lg-video.min.js');
?>
<div class='video-container row' id="video-gallery">
    <?php
    if(!empty($this->videos)){
        $index = 0;
        foreach( $this->videos as $video ){
            if(!empty($video->url))	{
                $index++;
    ?>
                <div class="col-md-6">
                    <div class="video-item" 
                         data-src="<?php echo $this->escape($video->url) ?>"
                         data-sub-html="">
                        <div class="videoSitesLoader-holder">
                            <div class="play_btn"></div>
                            <div class="videoSitesLoader" style="background-image:url('<?php echo $video->videoThumbnail ?>')"></div>
                        </div>
                    </div>
                </div>
                  <?php if ($index % 2 == 0){ ?>
                	</div>
              	    <div class='video-container row'>
                <?php
                    }
            }
        }
    }  ?>
    <div class="clear"></div>
</div>

<script type="text/javascript">
    window.addEventListener('load', function() {
        const videoGallery = lightGallery(document.getElementById('video-gallery'), {
            selector: '.video-item',
            plugins: [lgVideo],
            videojs: true,
            videojsOptions: {
                muted: false,
                controls: true
            },
            speed: 500,
            counter: true,
            download: false,
            autoplayFirstVideo: true,
            gotoNextSlideOnVideoEnd: true,
            autoplayVideoOnSlide: true,
            loadYouTubeThumbnail: true,
            youtubePlayerParams: {
                modestbranding: 1,
                showinfo: 0,
                rel: 0
            },
            vimeoPlayerParams: {
                byline: 0,
                portrait: 0
            }
        });

        // Handle click on video items
        document.querySelectorAll('.video-item').forEach((item, index) => {
            item.addEventListener('click', (e) => {
                e.preventDefault();
                videoGallery.openGallery(index);
            });
        });
    });
</script>