<?php if(! defined('ABSPATH')){ return; }
/*
 Name: Hover Box
 Description: Create and display a Hover Box element
 Class: TH_HoverBox
 Category: content
 Level: 3
*/

/**
 * Class TH_HoverBox
 *
 * Create and display a Hover Box element
 *
 * @package  Kallyas
 * @category Page Builder
 * @author   Team Hogash
 * @since    3.8.0
 */
class TH_HoverBox extends ZnElements
{
    public static function getName(){
        return __( "Hover Box", 'zn_framework' );
    }

    /**
     * This method is used to display the output of the element.
     *
     * @return void
     */
    function element()
    {
        $options = $this->data['options'];
        $content      = '';
        $cls = 'margin-top:10px;';

        $hover_box_style = $this->opt( 'hover_box_style', 'hover-box' );

        echo '<div class="zn_hover_box '.$this->data['uid'].'">';

        if (isset($options['hb_link']['url']) && empty($options['hb_link']['url'])) {
            $options['hb_link']['url'] = '#';
        }

        if (!empty($options['hb_link']['url'])) {

            echo '
                <a
                href="' . $options['hb_link']['url'] . '"
                target="' . $options['hb_link']['target'] . '"
                style="'.($hover_box_style == 'hover-box-3' && ! empty ( $options['hb_icon'] ) ? 'background-image:url('.$options['hb_icon'].'); background-size:cover':'').'"
                class="hover-box ' . $this->opt( 'hb_align', 'zn_fill_class' ) . ' ' . $hover_box_style . '"
            >';
        }
        if($hover_box_style == 'hover-box-2'){
            echo '<span class="hb-circle"></span>';
        }

        if ( ! empty ( $options['hb_icon'] )  ) {
            echo '<img src="' . $options['hb_icon'] . '" class="hb-img '.( isset($options['hb_rmmargin']) && $options['hb_rmmargin'] == 1 && $hover_box_style == 'hover-box-2' ? 'rb-right' : '' ).'" alt="">';
        }

        if ( ! empty ( $options['hb_desc'] ) ) {
            $content = '<p>' . $options['hb_desc'] . '</p>';
            $cls     = '';
        }
        if (isset($options['hb_title']) && !empty($options['hb_title'])) {
            echo '<h3 style="' . $cls . '">' . $options['hb_title'] . '</h3>';
        }
        if (isset($options['hb_subtitle']) && !empty($options['hb_subtitle'])) {
            echo '<h4>' . $options['hb_subtitle'] . '</h4>';
        }

        echo $content;
        if (isset($options['hb_link']['url']) && !empty($options['hb_link']['url'])) {
            echo '</a>';
        }

        echo '</div>';
    }

    /**
     * Output the inline css to head or after the element in case it is loaded via ajax
     */
    function css(){

        $hb_bgcolor = $this->opt( 'hb_bgcolor', '#969696' );
        $uid = $this->data['uid'];
        $css = '';

        if( $hb_bgcolor != '#969696' ){
            $css = ".{$uid} .hover-box { background-color: $hb_bgcolor; }";
        }

        return $css;
    }

    /**
     * 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"        => __( "Title", 'zn_framework' ),
                        "description" => __( "Please enter a title for this box.", 'zn_framework' ),
                        "id"          => "hb_title",
                        "std"         => "",
                        "type"        => "text",
                    ),
                    array (
                        "name"        => __( "Subtitle", 'zn_framework' ),
                        "description" => __( "Please enter a subtitle for this box.", 'zn_framework' ),
                        "id"          => "hb_subtitle",
                        "std"         => "",
                        "type"        => "text",
                    ),
                    array (
                        "name"        => __( "Description", 'zn_framework' ),
                        "description" => __( "Please enter a description for this box.", 'zn_framework' ),
                        "id"          => "hb_desc",
                        "std"         => "",
                        "type"        => "textarea",
                    ),

                    array (
                        "name"        => __( "Add Image", 'zn_framework' ),
                        "description" => __( "Please select an image for this box.", 'zn_framework' ),
                        "id"          => "hb_icon",
                        "std"         => "",
                        "type"        => "media",
                    ),

                    array (
                        "name"        => __( "Box Link", 'zn_framework' ),
                        "description" => __( "Please choose the link you want to use.", 'zn_framework' ),
                        "id"          => "hb_link",
                        "std"         => "#",
                        "type"        => "link",
                        "options"     => array (
                            '_blank' => __( "New window", 'zn_framework' ),
                            '_self'  => __( "Same window", 'zn_framework' )
                        )
                    ),
                ),
            ),
            'style_options' => array(
                'title' => 'Style options',
                'options' => array(
                    array (
                        "name"        => __( "Hover Box Style", 'zn_framework' ),
                        "description" => __( "Please select the style you want to use.", 'zn_framework' ),
                        "id"          => "hover_box_style",
                        "std"         => "hover-box",
                        "options"     => array (
                            'hover-box'       => __( 'Default Style', 'zn_framework' ),
                            'hover-box-2'     => __( 'Right side Image (since v4.0)', 'zn_framework' ),
                            'hover-box-3'     => __( 'Background-image (since v4.0)', 'zn_framework' )
                        ),
                        "type"        => "select",
                    ),

                    array (
                        "name"        => __( "Box Background-color", 'zn_framework' ),
                        "description" => __( "Select a color.", 'zn_framework' ),
                        "id"          => "hb_bgcolor",
                        "std"         => "#969696",
                        "type"        => "colorpicker",
                        'live' => array(
                            'type'      => 'css',
                            'css_class' => '.'.$this->data['uid'] .' .hover-box',
                            'css_rule'  => 'background-color',
                            'unit'      => ''
                        )
                    ),
                    array (
                        "name"        => __( "Content Style", 'zn_framework' ),
                        "description" => __( "Select the desired alignment for the content", 'zn_framework' ),
                        "id"          => "hb_align",
                        "type"        => "select",
                        "std"         => "style1",
                        "options"     => array (
                            'zn_fill_class' => __( 'Normal', 'zn_framework' ),
                            'centered'      => __( 'Centered', 'zn_framework' )
                        ),
                        'live'        => array(
                            'type'      => 'class',
                            'css_class' => '.'.$this->data['uid'] .' .hover-box'
                        )
                    ),
                    array (
                        "name"        => __( "Remove right margin?", 'zn_framework' ),
                        "description" => __( "Please choose if you don't want a right margin.", 'zn_framework' ),
                        "id"          => "hb_rmmargin",
                        "std"         => "1",
                        "type"        => "select",
                        "options"     => array (
                            '1' => __( "Yes", 'zn_framework' ),
                            '0'  => __( "No", 'zn_framework' )
                        ),
                        "dependency"  => array( 'element' => 'hover_box_style' , 'value'=> array('hover-box-2') )
                    ),
                ),
            ),
        );
    }
}
