<?php if(! defined('ABSPATH')){ return; }
/*
Name: STATIC CONTENT - Text and Register
Description: Create and display a STATIC CONTENT - Text and Register element
Class: TH_StaticContentTextAndRegister
Category: header
Level: 1
*/
/**
 * Class TH_StaticContentTextAndRegister
 *
 * Create and display a STATIC CONTENT - Text and Register element
 *
 * @package  Kallyas
 * @category Page Builder
 * @author   Team Hogash
 * @since    4.0.0
 */
class TH_StaticContentTextAndRegister extends ZnElements
{
    const TYPE_ERROR = 0;
    const TYPE_SUCCESS = 1;

    public function __construct(){
        parent::__construct();
        /*
         * Register the ajax script and action for "Ajax Registration"
         */
        add_action('wp_head', array($this, 'addAjaxURL'));
        add_action('wp_ajax_nopriv_th_ajax_register', array($this, 'ajaxRegister'));
    }

    public function addAjaxURL(){
        echo '<script type="text/javascript">';
         echo 'var ajaxurl = "'. admin_url('admin-ajax.php').'";';
        echo '</script>';
    }

    public function ajaxRegister()
    {
        $rm = $_SERVER['REQUEST_METHOD'];
        if('POST' == strtoupper($rm))
        {
            if(isset($_POST['action']) && $_POST['action'] == 'th_ajax_register')
            {
                $formData = wp_parse_args($_POST['formData']);
                if(is_array($formData) && !empty($formData))
                {
                    if( ! isset($formData['user_login']) || empty($formData['user_login'])){
                        exit( $this->_prepareOutput(
                            self::TYPE_ERROR,
                            __('Error', 'zn_framework'),
                            __('Username field is required','zn_framework'))
                        );
                    }
                    $userName = esc_attr($formData['user_login']);
                    // Check if user exists
                    if(username_exists($userName)){
                        exit( $this->_prepareOutput(
                            self::TYPE_ERROR,
                            __('Error', 'zn_framework'),
                            __('Username already exists.','zn_framework'))
                        );
                    }
                    if( ! isset($formData['user_email']) || empty($formData['user_email'])){
                        exit( $this->_prepareOutput(
                            self::TYPE_ERROR,
                            __('Error', 'zn_framework'),
                            __('Email field is required','zn_framework'))
                        );
                    }
                    $userEmail = esc_attr($formData['user_email']);
                    // Check if email exists
                    if(email_exists($userEmail)){
                        exit( $this->_prepareOutput(
                            self::TYPE_ERROR,
                            __('Error', 'zn_framework'),
                            __('Email already registered.','zn_framework'))
                        );
                    }
                    if( ! isset($formData['user_password']) || empty($formData['user_password'])){
                        exit( $this->_prepareOutput(
                            self::TYPE_ERROR,
                            __('Error', 'zn_framework'),
                            __('Password field is required', 'zn_framework'))
                        );
                    }
                    if( ! isset($formData['user_password2']) || empty($formData['user_password2'])){
                        exit( $this->_prepareOutput(
                            self::TYPE_ERROR,
                            __('Error', 'zn_framework'),
                            __('Please confirm your password.','zn_framework'))
                        );
                    }
                    // compare passwords
                    if($formData['user_password'] !== $formData['user_password2']){
                        exit( $this->_prepareOutput(
                            self::TYPE_ERROR,
                            __('Error', 'zn_framework'),
                            __('Passwords do not match.','zn_framework')));
                    }
                    $userPass = esc_attr($formData['user_password']);

                    // So far so good. Add user
                    $new_user = wp_insert_user( array(
                        'user_login' => $userName,
                        'user_email' => $userEmail,
                        'role' => get_option( 'default_role' ),
                        'user_pass' => $userPass,
                    ) );

                    if(is_wp_error($new_user)){
                        exit( $this->_prepareOutput(
                            self::TYPE_ERROR,
                            __('Error', 'zn_framework'),
                            __('Internal error.', 'zn_framework'))
                        );
                    }
                    else {
                        // Send registration notification email
                        wp_new_user_notification($new_user, $userPass);
                        // Reply with a success message
                        exit( $this->_prepareOutput(
                            self::TYPE_SUCCESS,
                            __('Success', 'zn_framework'),
                            __('Successfully registered.', 'zn_framework'))
                        );
                    }
                }
                else {
                    exit( $this->_prepareOutput(
                        self::TYPE_ERROR,
                        __('Error', 'zn_framework'),
                        __('Invalid Request', 'zn_framework'))
                    );
                }
            }
        }
        exit( $this->_prepareOutput(
            self::TYPE_ERROR,
            __('Error', 'zn_framework'),
            __('Invalid Request', 'zn_framework'))
        );
    }

    public static function getName(){
        return __( "STATIC CONTENT - Text and Register", 'zn_framework' );
    }

    /**
     * Create the message that will be sent to the front-end through ajax
     * @param int $type
     * @param string $title
     * @param string $message
     *
     * @return mixed|string|void
     */
    function _prepareOutput($type , $title, $message){
        return json_encode(array(
            'type' => $type,
            'title' => $title,
            'message' => $message,
        ));
    }

    /**
     * Load dependant resources
     */
    function scripts(){
        wp_enqueue_style( 'static_content', THEME_BASE_URI . '/sliders/static_content/sc_styles.css', '', THEME_VERSION );

        if($this->opt('sc_scrolling',0 ) == 1){
            wp_enqueue_script( 'scrollme', THEME_BASE_URI . '/addons/scrollme/jquery.scrollme.min.js', array ( 'jquery' ), THEME_VERSION, true );
        }
    }

    /**
     * Output the inline css to head or after the element in case it is loaded via ajax
     */
    function css(){
        $css = '';
        $scheight = (int)$this->opt('ww_height');
        $uid = $this->data['uid'];

        if(!empty($scheight)){
            if( $this->opt('sc_fullscreen', '0') != 1 ) {
                $css .= '@media only screen and (min-width : 1200px){ .'.$uid.' .static-content--height{height:'.$scheight.'px;} } ';
            }
        }

        return $css;
    }

    /**
     * This method is used to display the output of the element.
     * @return void
     */
    function element()
    {
        $options = $this->data['options'];
        if( empty( $options ) ) { return; }
        $uid = $this->data['uid'];

        $style = '';
        if ( isset ( $options['ww_header_style'] ) && !empty ( $options['ww_header_style'] ) ) {
            $style = 'uh_'.$options['ww_header_style'];
        }

        $bottom_mask = $this->opt('hm_header_bmasks','none');
        $bm_class = $bottom_mask != 'none' ? 'maskcontainer--'.$bottom_mask : '';

        // Scrolling Effect
        $is_screffect = $this->opt('sc_scrolling',0 ) == 1;
        $scrolling_type = $this->opt('sc_scrolling_type','translate_op_scale' );
        $scr_main_class = '';
        $scr_effect_class = '';
        $scr_effect_attribs = '';
        $scr_effect_attribs_fade = '';
        if( $is_screffect ){
            $scr_main_class = 'scrollme';
            $scr_effect_class = 'animateme';

            $scr_effect_attribs_split = '';
            if($scrolling_type == 'translate_op_scale'){
                $scr_effect_attribs_split = 'data-translatey="300" data-opacity="0.1" data-scale="1.5"';
            }
            elseif($scrolling_type == 'translate_op'){
                $scr_effect_attribs_split = 'data-translatey="300" data-opacity="0.1"';
            }
            elseif($scrolling_type == 'translate'){
                $scr_effect_attribs_split = 'data-translatey="300"';
            }
            $scr_effect_attribs = ' data-when="span" data-from="0" data-to="0.75" data-easing="linear" '.$scr_effect_attribs_split;
            $scr_effect_attribs_fade = ' data-when="span" data-from="0" data-to="0.75" data-translatey="200" data-opacity="0.1" data-easing="linear"';
        }
        ?>
<div class="kl-slideshow static-content__slideshow nobg <?php echo $uid; ?> <?php echo $bm_class ?> <?php echo $scr_main_class; ?>">

    <div class="bgback"></div>

    <div class="kl-slideshow-inner static-content__wrapper <?php echo ( $this->opt('sc_fullscreen', '0') ? 'static-content--fullscreen' : '' ); ?> <?php echo ( (int)$this->opt('ww_height') ? 'static-content--height':'' ) ?>">

        <?php if( $this->opt('source_type','') != ''  || $this->opt('source_overlay','') != 0 ){ ?>
        <div class="static-content__source  <?php echo $scr_effect_class; ?>" <?php echo $scr_effect_attribs; ?> >

            <?php
                WpkPageHelper::zn_background_source( array(
                    'source_type' => $this->opt('source_type'),
                    'source_background_image' => $this->opt('background_image'),
                    'source_vd_yt' => $this->opt('source_vd_yt'),
                    'source_vd_self_mp4' => $this->opt('source_vd_self_mp4'),
                    'source_vd_self_ogg' => $this->opt('source_vd_self_ogg'),
                    'source_vd_self_webm' => $this->opt('source_vd_self_webm'),
                    'source_vd_vp' => $this->opt('source_vd_vp'),
                    'source_vd_autoplay' => $this->opt('source_vd_autoplay'),
                    'source_vd_loop' => $this->opt('source_vd_loop'),
                    'source_vd_muted' => $this->opt('source_vd_muted'),
                    'source_vd_controls' => $this->opt('source_vd_controls'),
                    'source_vd_controls_pos' => $this->opt('source_vd_controls_pos'),
                    'source_overlay' => $this->opt('source_overlay'),
                    'source_overlay_color' => $this->opt('source_overlay_color'),
                    'source_overlay_opacity' => $this->opt('source_overlay_opacity'),
                    'source_overlay_color_gradient' => $this->opt('source_overlay_color_gradient'),
                    'source_overlay_color_gradient_opac' => $this->opt('source_overlay_color_gradient_opac'),
                ) );
            ?>
            <div class="th-sparkles"></div>

        </div><!-- /.static-content__source -->
        <?php } ?>

        <div class="static-content__inner container">

            <div class="kl-slideshow-safepadding  sc__container <?php echo $scr_effect_class; ?>" <?php echo $scr_effect_attribs_fade; ?>>

                <div class="static-content default-style static-content--with-login">

                    <?php
                        // Check if this is a request coming from an authenticated user and if it is,
                        // then do not display the form - there's no point in that.
                        // This form will only work for unauthenticated users
                        $section_1_class = 'col-sm-12';
                        $showForm = (!is_user_logged_in() && (int)get_option('users_can_register') == 1);
                        if($showForm){
                            $section_1_class = 'col-sm-10 col-sm-offset-1 col-md-7 col-md-offset-0';
                        }
                    ?>

                    <div class="row">
                        <div class="<?php echo $section_1_class;?>">
                            <?php
                            if (!empty($options['ww_slide_title'])) {
                                echo '<h2 class="static-content__title">'.do_shortcode( $options['ww_slide_title'] ).'</h2>';
                            }

                            if (!empty( $options['ww_slide_subtitle'] )) {
                                echo '<h3 class="static-content__subtitle">'.do_shortcode( $options['ww_slide_subtitle'] ).'</h3>';
                            }

                            if ( !empty( $options['ww_slide_m_button'] ) && !empty ( $options['ww_slide_l_text'] ) && !empty($options['ww_slide_link']['url']) ) {

                                echo '<div class="static-content__infopop fadeBoxIn sc-infopop--left" data-arrow="top">';
                                echo '<a href="'.$options['ww_slide_link']['url'].'" target="'.$options['ww_slide_link']['target'].'" class="sc-infopop__btn">'.$options['ww_slide_l_text'].'</a>';
                                echo '<h5 class="sc-infopop__text">'.$options['ww_slide_m_button'].'</h5>';
                                echo '<div class="clear"></div>';
                                echo '</div>';
                            }
                            ?>
                        </div>
                        <?php if($showForm) { ?>
                        <div class="col-sm-10 col-sm-offset-1 col-md-5 col-md-offset-0">
                            <div class="fancy_register_form">
                                <h4 style="text-align:center"><?php _e("Create <strong>your account</strong> now",'zn_framework');?></h4>
                                <form name="login_form"
                                      method="post"
                                      class="th-register-form register_form_static form-horizontal "
                                      action="<?php echo site_url('wp-login.php?action=register', 'login_post') ?>">
                                    <div class="form-group">
                                        <label class="col-sm-4 control-label" for="user_login"><?php _e("Username",'zn_framework');?></label>
                                        <div class="col-sm-8">
                                            <input type="text" name="user_login" id="user_login" class="form-control inputbox" required
                                               placeholder="<?php _e("Username",'zn_framework');?>"/>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-4 control-label" for="user_email"><?php _e("Email",'zn_framework');?></label>
                                        <div class="col-sm-8">
                                            <input type="email" name="user_email" id="user_email" class="form-control inputbox required"
                                                   placeholder="<?php _e("Your email",'zn_framework');?>"/>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-4 control-label" for="user_password"><?php _e("Your password",'zn_framework');?></label>
                                        <div class="col-sm-8">
                                            <input type="password" name="user_password" id="user_password" class="form-control inputbox" required
                                                   placeholder="<?php _e("Your password",'zn_framework');?>"/>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-4 control-label" for="user_password2"><?php _e("Verify password",'zn_framework');?></label>
                                        <div class="col-sm-8">
                                            <input type="password" name="user_password2" id="user_password2" class="form-control inputbox" required
                                                   placeholder="<?php _e("Verify password",'zn_framework');?>"/>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <div class="col-sm-8 col-sm-offset-4" style="margin-bottom:0;">
                                            <input type="submit"
                                                   name="submit"
                                                   class="zn_sub_button btn btn-fullcolor th-button-register"
                                                   value="<?php _e("REGISTER",'zn_framework');?>"/>
                                        </div>
                                    </div>
                                    <div class="th-response" style="display: none;"></div>
                                    <input type="hidden" value="register" name="zn_form_action"/>
                                    <input type="hidden" value="zn_do_login" name="action"/>
                                    <input type="hidden" value="<?php echo $_SERVER['REQUEST_URI'];?>"
                                           class="zn_login_redirect" name="submit"/>
                                    <div class="links"></div>
                                </form>
                            </div>
<script type="text/javascript">
(function($){
    function thClearForms(classSelector){
        var forms = $(classSelector);
        if(forms && forms.length){
            $.each(forms, function(i, e){
                var inputs = $('input[type="text"], input[type="password"]');
                if(inputs.length){
                    $.each(inputs, function(a, b){
                        $(b).val('');
                    });
                }
            });
        }
    }
    thClearForms('.th-register-form');

    var buttons = $('.th-button-register');
    if(buttons && buttons.length)
    {
        $.each(buttons, function(i, e){
            var button = $(e);
            var form = button.parents('form'),
                target = $('.th-response');

            button.on('click', function(e){
                // No need to submit the form - it will be handled by an AJAX request
                e.preventDefault();
                e.stopPropagation();

                target.attr('class', '').html('');
                button.addClass('zn_blocked');

                $.ajax({
                    url: ajaxurl,
                    data: {
                        action: 'th_ajax_register',
                        formData: form.serialize()
                    },
                    type: 'POST',
                    cache: false,
                    async: true,
                    success: function (response)
                    {
                        if(response && response.length){
                            response = JSON.parse(response);
                        }
                        if(typeof(response) == typeof({})){
                            if(response.type == <?php echo self::TYPE_ERROR;?>){
                                target
                                    .addClass('alert alert-danger')
                                    .attr('role', 'alert')
                                    .css('margin-bottom', 0)
                                    .append('<small>'+response.title+': '+response.message+'</small>')
                                    .fadeIn('fast');
                            }
                            else if(response.type == <?php echo self::TYPE_SUCCESS;?>){
                                target
                                    .addClass('alert alert-success')
                                    .attr('role', 'alert')
                                    .css('margin-bottom', 0)
                                    .append('<small>'+response.title+': '+response.message+'</small>')
                                    .fadeIn(700, function(){
                                        button.remove();
                                        window.setTimeout(function(){
                                            window.location.href = "<?php echo wp_login_url();?>";
                                        }, 1500);
                                    });
                            }
                        }
                        else { console.warn('Invalid response retrieved'); }
                        button.removeClass('zn_blocked');
                    },
                    error: function (jqXHR, textStatus, errorThrown){
                        console.warn('Error(%s): %s', textStatus, errorThrown);
                    }
                });
            });
        });
    }
})(jQuery);
</script>
                        </div><!-- end section right -->
                        <?php } /* End if (! logged in)*/ ?>
                    </div><!-- end row -->
                </div><!-- end static content -->

            </div><!-- /.container -->
        </div><!-- /.static-content__inner -->
    </div><!-- /.static-content__wrapper -->

    <?php
        WpkPageHelper::zn_bottommask_markup($bottom_mask);
    ?>
</div><!-- end kl-slideshow -->
    <?php
    }

    /**
     * This method is used to retrieve the configurable options of the element.
     * @return array The list of options that compose the element and then passed as the argument for the render() function
     */
    function options()
    {
        return array (
            'has_tabs'  => true,
            'general' => array(
                'title' => 'General options',
                'options' => array(
                    array (
                        "name"        => __( "Element Height", 'zn_framework' ),
                        "description" => __( "<strong><em>Please read!</em></strong><br>Enter a numeric value for the slider height. This option works if Fullscreen is disabled. If you don't add any height, the height will be automatically rely on the content inside the element. ", 'zn_framework' ),
                        "id"          => "ww_height",
                        "std"         => "",
                        "type"        => "text",
                        "placeholder" => "ex: 600px",
                        "class"       => "zn_input_xs",
                        'dependency' => array( 'element' => 'sc_fullscreen' , 'value'=> array('0') )
                    ),
                    array (
                        "name"        => __( "Enable fullscreen?", 'zn_framework' ),
                        "description" => __( "Do you want to display the static content as fullscreen?", 'zn_framework' ),
                        "id"          => "sc_fullscreen",
                        "std"         => "0",
                        "type"        => "select",
                        "options"     => array (
                            '1'  => __( "Yes", 'zn_framework' ),
                            '0' => __( "No", 'zn_framework' )
                        )
                    ),
                    array (
                        "name"        => __( "Enable scrolling effect?", 'zn_framework' ),
                        "description" => __( "Do you want to enable the scrolling effects? Might cause performance issues.<br> <strong style=' color: #9B4F4F;'>This options works only if the slider is positioned at the very top opf the page!!</strong>", 'zn_framework' ),
                        "id"          => "sc_scrolling",
                        "std"         => "0",
                        "type"        => "select",
                        "options"     => array (
                            '1'  => __( "Yes", 'zn_framework' ),
                            '0' => __( "No", 'zn_framework' )
                        )
                    ),
                    array (
                        "name"        => __( "Parallax Scrolling effect type?", 'zn_framework' ),
                        "description" => __( "Select the effect type", 'zn_framework' ),
                        "id"          => "sc_scrolling_type",
                        "std"         => "translate_op_scale",
                        "type"        => "select",
                        "options"     => array (
                            'translate_op_scale'  => __( "Translate + Fade + Scale", 'zn_framework' ),
                            'translate_op' => __( "Translate + Fade", 'zn_framework' ),
                            'translate' => __( "Translate", 'zn_framework' )
                        ),
                        'dependency' => array( 'element' => 'sc_scrolling' , 'value'=> array('1') )
                    ),

                    array (
                        "name"        => __( "Main title", 'zn_framework' ),
                        "description" => __( "Please enter a main title.", 'zn_framework' ),
                        "id"          => "ww_slide_title",
                        "std"         => "",
                        "type"        => "textarea"
                    ),
                    array (
                        "name"        => __( "Subtitle", 'zn_framework' ),
                        "description" => __( "Please enter a subtitle", 'zn_framework' ),
                        "id"          => "ww_slide_subtitle",
                        "std"         => "",
                        "type"        => "textarea"
                    ),
                    array (
                        "name"        => __( "Button Main Text", 'zn_framework' ),
                        "description" => __( "Please enter a main text for this button", 'zn_framework' ),
                        "id"          => "ww_slide_m_button",
                        "std"         => "",
                        "type"        => "text"
                    ),
                    array (
                        "name"        => __( "Button Link Text", 'zn_framework' ),
                        "description" => __( "Please enter a text that will appear on the right side of the button", 'zn_framework' ),
                        "id"          => "ww_slide_l_text",
                        "std"         => "",
                        "type"        => "text"
                    ),
                    array (
                        "name"        => __( "Button link", 'zn_framework' ),
                        "description" => __( "Please enter a link that will appear on the right side of the button", 'zn_framework' ),
                        "id"          => "ww_slide_link",
                        "std"         => "",
                        "type"        => "link",
                        "options"     => array (
                            '_self'  => __( "Same window", 'zn_framework' ),
                            '_blank' => __( "New window", 'zn_framework' )
                        )
                    ),

                )
            ),

            'background' => array(
                'title' => 'Background & Styles Options',
                'options' => array(

                    array (
                        "name"        => __( "Element Background Style", 'zn_framework' ),
                        "description" => __( "Select the background style you want to use for this slider. Please note that styles can be created from the unlimited headers options in the theme admin's page.", 'zn_framework' ),
                        "id"          => "ww_header_style",
                        "std"         => "",
                        "type"        => "select",
                        "options"     => WpkZn::getThemeHeaders(),
                        "class"       => ""
                    ),

                    // Background image/video or youtube
                    array (
                        "name"        => __( "Background Source Type", 'zn_framework' ),
                        "description" => __( "Please select the source type of the background.", 'zn_framework' ),
                        "id"          => "source_type",
                        "std"         => "",
                        "type"        => "select",
                        "options"     => array (
                            ''  => __( "None (Will just rely on the background color (if any) )", 'zn_framework' ),
                            'image'  => __( "Image", 'zn_framework' ),
                            'video_self' => __( "Self Hosted Video", 'zn_framework' ),
                            'video_youtube' => __( "Youtube Video", 'zn_framework' )
                        )
                    ),

                    array(
                        'id'          => 'background_image',
                        'name'        => 'Background image',
                        'description' => 'Please choose a background image for this section.',
                        'type'        => 'background',
                        'options' => array( "repeat" => true , "position" => true , "attachment" => true, "size" => true ),
                        'class'       => 'zn_full',
                        'dependency' => array( 'element' => 'source_type' , 'value'=> array('image') )
                    ),

                    // array(
                    //  'id'            => 'enable_parallax',
                    //  'name'          => 'Enable parallax',
                    //  'description'   => 'Select if you want to enable parallax effect on background image',
                    //  'type'          => 'toggle2',
                    //  'std'           => '',
                    //  'value'         => 'yes'
                    // ),



                    // Youtube video
                    array (
                        "name"        => __( "Slide Video Youtube ID", 'zn_framework' ),
                        "description" => __( "Add an Youtube ID", 'zn_framework' ),
                        "id"          => "source_vd_yt",
                        "std"         => "",
                        "type"        => "text",
                        "placeholder" => "ex: tR-5AZF9zPI",
                        "dependency"  => array( 'element' => 'source_type' , 'value'=> array('video_youtube') )
                    ),
                    /* LOCAL VIDEO */
                    array(
                        'id'          => 'source_vd_self_mp4',
                        'name'        => 'Mp4 video source',
                        'description' => 'Add the MP4 video source for your local video',
                        'type'        => 'media_upload',
                        'std'         => '',
                        'data'  => array(
                            'type' => 'video/mp4',
                            'button_title' => 'Add / Change mp4 video',
                        ),
                        "dependency"  => array( 'element' => 'source_type' , 'value'=> array('video_self') )
                    ),
                    array(
                        'id'          => 'source_vd_self_ogg',
                        'name'        => 'Ogg/Ogv video source',
                        'description' => 'Add the OGG video source for your local video',
                        'type'        => 'media_upload',
                        'std'         => '',
                        'data'  => array(
                            'type' => 'video/ogg',
                            'button_title' => 'Add / Change ogg video',
                        ),
                        "dependency"  => array( 'element' => 'source_type' , 'value'=> array('video_self') )
                    ),
                    array(
                        'id'          => 'source_vd_self_webm',
                        'name'        => 'Webm video source',
                        'description' => 'Add the WEBM video source for your local video',
                        'type'        => 'media_upload',
                        'std'         => '',
                        'data'  => array(
                            'type' => 'video/webm',
                            'button_title' => 'Add / Change webm video',
                        ),
                        "dependency"  => array( 'element' => 'source_type' , 'value'=> array('video_self') )
                    ),
                    array(
                        'id'          => 'source_vd_vp',
                        'name'        => 'Video poster',
                        'description' => 'Using this option you can add your desired video poster that will be shown on unsuported devices.',
                        'type'        => 'media',
                        'std'         => '',
                        'class'       => 'zn_full',
                        "dependency"  => array( 'element' => 'source_type' , 'value'=> array('video_self','video_youtube') )
                    ),
                    array(
                        'id'          => 'source_vd_autoplay',
                        'name'        => 'Autoplay video?',
                        'description' => 'Enable autoplay for video?',
                        'type'        => 'select',
                        'std'         => 'yes',
                        "dependency"  => array( 'element' => 'source_type' , 'value'=> array('video_self','video_youtube') ),
                        "options"     => array (
                            "yes" => __( "Yes", 'zn_framework' ),
                            "no"  => __( "No", 'zn_framework' )
                        ),
                        "class"       => "zn_input_xs"
                    ),
                    array(
                        'id'          => 'source_vd_loop',
                        'name'        => 'Loop video?',
                        'description' => 'Enable looping the video?',
                        'type'        => 'select',
                        'std'         => 'yes',
                        "dependency"  => array( 'element' => 'source_type' , 'value'=> array('video_self','video_youtube') ),
                        "options"     => array (
                            "yes" => __( "Yes", 'zn_framework' ),
                            "no"  => __( "No", 'zn_framework' )
                        ),
                        "class"       => "zn_input_xs"
                    ),
                    array(
                        'id'          => 'source_vd_muted',
                        'name'        => 'Start mute?',
                        'description' => 'Start the video with muted audio?',
                        'type'        => 'select',
                        'std'         => 'yes',
                        "dependency"  => array( 'element' => 'source_type' , 'value'=> array('video_self','video_youtube') ),
                        "options"     => array (
                            "yes" => __( "Yes", 'zn_framework' ),
                            "no"  => __( "No", 'zn_framework' )
                        ),
                        "class"       => "zn_input_xs"
                    ),
                    array(
                        'id'          => 'source_vd_controls',
                        'name'        => 'Video controls',
                        'description' => 'Enable video controls?',
                        'type'        => 'select',
                        'std'         => 'yes',
                        "dependency"  => array( 'element' => 'source_type' , 'value'=> array('video_self','video_youtube') ),
                        "options"     => array (
                            "yes" => __( "Yes", 'zn_framework' ),
                            "no"  => __( "No", 'zn_framework' )
                        ),
                        "class"       => "zn_input_xs"
                    ),
                    array(
                        'id'          => 'source_vd_controls_pos',
                        'name'        => 'Video controls position',
                        'description' => 'Video controls position in the slide',
                        'type'        => 'select',
                        'std'         => 'bottom-right',
                        "dependency"  => array( 'element' => 'source_type' , 'value'=> array('video_self','video_youtube') ),
                        "options"     => array (
                            "top-right" => __( "top-right", 'zn_framework' ),
                            "top-left" => __( "top-left", 'zn_framework' ),
                            "top-center"  => __( "top-center", 'zn_framework' ),
                            "bottom-right"  => __( "bottom-right", 'zn_framework' ),
                            "bottom-left"  => __( "bottom-left", 'zn_framework' ),
                            "bottom-center"  => __( "bottom-center", 'zn_framework' ),
                            "middle-right"  => __( "middle-right", 'zn_framework' ),
                            "middle-left"  => __( "middle-left", 'zn_framework' ),
                            "middle-center"  => __( "middle-center", 'zn_framework' )
                        ),
                        "class"       => "zn_input_sm"
                    ),

                    array(
                        'id'          => 'source_overlay',
                        'name'        => 'Background colored overlay',
                        'description' => 'Add slide color overlay over the image or video to darken or enlight?',
                        'type'        => 'select',
                        'std'         => '0',
                        "options"     => array (
                            "1" => __( "Yes (Normal color)", 'zn_framework' ),
                            "2" => __( "Yes (Horizontal gradient)", 'zn_framework' ),
                            "3" => __( "Yes (Vertical gradient)", 'zn_framework' ),
                            "0"  => __( "No", 'zn_framework' )
                        )
                    ),

                    array(
                        'id'          => 'source_overlay_color',
                        'name'        => 'Overlay background color',
                        'description' => 'Pick a color',
                        'type'        => 'colorpicker',
                        'std'         => '#353535',
                        "dependency"  => array( 'element' => 'source_overlay' , 'value'=> array('1', '2', '3') ),
                    ),
                    array(
                        'id'          => 'source_overlay_opacity',
                        'name'        => 'Overlay\'s opacity.',
                        'description' => 'Overlay background colors opacity level.',
                        'type'        => 'slider',
                        'std'         => '30',
                        "helpers"     => array (
                            "step" => "5",
                            "min" => "0",
                            "max" => "100"
                        ),
                        "dependency"  => array( 'element' => 'source_overlay' , 'value'=> array('1', '2', '3') ),
                    ),

                    array(
                        'id'          => 'source_overlay_color_gradient',
                        'name'        => 'Overlay Gradient 2nd Bg. Color',
                        'description' => 'Pick a color',
                        'type'        => 'colorpicker',
                        'std'         => '#353535',
                        "dependency"  => array( 'element' => 'source_overlay' , 'value'=> array('2', '3') ),
                    ),
                    array(
                        'id'          => 'source_overlay_color_gradient_opac',
                        'name'        => 'Gradient Overlay\'s 2nd Opacity.',
                        'description' => 'Overlay gradient 2nd background color opacity level.',
                        'type'        => 'slider',
                        'std'         => '30',
                        "helpers"     => array (
                            "step" => "5",
                            "min" => "0",
                            "max" => "100"
                        ),
                        "dependency"  => array( 'element' => 'source_overlay' , 'value'=> array('2', '3') ),
                    ),

                    // Bottom masks
                    array (
                        "name"        => __( "Bottom masks override", 'zn_framework' ),
                        "description" => __( "The new masks are svg based, vectorial and color adapted. <br> <strong>Disclaimer:</strong> may now work perfectly for all elements!", 'zn_framework' ),
                        "id"          => "hm_header_bmasks",
                        "std"         => "none",
                        "type"        => "select",
                        "options"     => array (
                            'none' => __( 'None, just rely on Background style.', 'zn_framework' ),
                            'shadow' => __( 'Shadow Up', 'zn_framework' ),
                            'shadow_ud' => __( 'Shadow Up and down', 'zn_framework' ),
                            'mask1' => __( 'Raster Mask 1 (Old, not recommended)', 'zn_framework' ),
                            'mask2' => __( 'Raster Mask 2 (Old, not recommended)', 'zn_framework' ),
                            'mask3' => __( 'Vector Mask 3 CENTER (New! From v4.0)', 'zn_framework' ),
                            'mask3 mask3l' => __( 'Vector Mask 3 LEFT (New! From v4.0)', 'zn_framework' ),
                            'mask3 mask3r' => __( 'Vector Mask 3 RIGHT (New! From v4.0)', 'zn_framework' ),
                            'mask4' => __( 'Vector Mask 4 CENTER (New! From v4.0)', 'zn_framework' ),
                            'mask4 mask4l' => __( 'Vector Mask 4 LEFT (New! From v4.0)', 'zn_framework' ),
                            'mask4 mask4r' => __( 'Vector Mask 4 RIGHT (New! From v4.0)', 'zn_framework' ),
                            'mask5' => __( 'Vector Mask 5 (New! From v4.0)', 'zn_framework' ),
                            'mask6' => __( 'Vector Mask 6 (New! From v4.0)', 'zn_framework' ),
                        ),
                    ),
                ),
            ),

        );
    }
}
