<?php
    namespace Pixebuilder\Element;
    
    // prevent direct file access
	if( !defined( 'ABSPATH' ) ) exit;

    class Video extends Item{

        static function get_name(){
            return 'video';
        }

        static function get_default(){
            return array(
                'video' => array(
                    'url' => 'https://www.youtube.com/watch?v=3YmMFTXiWZU'
                )
            );
        }

        static function get_title(){
            return esc_html__('Video', 'pixebuilder');
        }

        static function get_icon(){
            return 'video';
        }
        
        static function render_content($settings){

            $video = empty($settings['video'])? array(): $settings['video'];
            $image = empty($settings['overlay']['image'])? array(): $settings['overlay']['image'];
            $icon = empty($settings['overlay']['icon'])? array(): $settings['overlay']['icon'];

            // overlay
            $overlay = '';
            if( !empty($image['image']) || !empty($icon['icon']) ){
                $video['js-api'] = true;
                
                $overlay .= '<div class="pixe-overlay-background" >';
                if( !empty($icon['icon']) ){
                    $overlay .= pixe_get_icon($icon['icon']);
                }
                $overlay .= '</div>';
            }
        
            // print
            $ret  = '<div class="pixe-video" >';
            if( empty($video['type']) ){
                if( !empty($video['url']) ){
                    $video_html = pixe_get_video($video['url'], $video);
                    
                    if( empty($video_html) ){
                        $video_html = pixe_get_html5_video($video['url'], $video);
                    }

                    $ret .= $video_html;
                }
            }else{
                if( !empty($video['upload']['url']) ){
                    $ret .= pixe_get_html5_video($video['upload']['url'], $video);
                }
            }
            $ret .= $overlay;
            $ret .= '</div>';

            return $ret;
        }

    }

    \Pixe_Builder::register_element('Pixebuilder\Element\Video');

    function video_script(){
?>
$(document).ready(function(){ 
    $('.pixe-item-video .pixe-video').each(function(){
        var video = $(this);
        

        video.find('.pixe-overlay-background').on('click', function(){
            var overlay = $(this);
            overlay.fadeOut(200, function(){
                overlay.remove();
            });

            var iframe = video.find('iframe');
            if( iframe.length ){
                $.pixeVideo.playVideo(iframe);
            }else{
                var html5Video = video.find('video');
                if( html5Video.length ){
                    html5Video.get(0).play();
                }
            }
        });
    });
});
<?php
    }
    \Pixe_Dependency::get()->register_script('video', 'Pixebuilder\Element\video_script');