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

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

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

        $vtabsStyle = $this->opt('vtabs_style', 'kl-style-2');

        if( empty ( $options['single_vertical_tab'] ) ){
            return;
        }


        echo '<div class="vertical_tabs ' . $vtabsStyle . ' clearfix">';
        echo '<div class="tabbable">';

        if ( ! empty ( $options['single_vertical_tab'] ) && is_array( $options['single_vertical_tab'] ) )
        {
            echo '<ul class="nav fixclear">';

            $i       = 1;
            $content = '';

            foreach ( $options['single_vertical_tab'] as $tab )
            {
                $cls  = '';
                $icon = '';

                if ( $i == 1 ) {
                    $cls = 'active';
                }

                $uniq_name = $i . uniqid();

                // ICON CHECK
                if ( ! empty ( $tab['vts_tab_icon'] ) ) {
                    $iconHolder = $tab['vts_tab_icon'];
                    $icon = !empty( $iconHolder['family'] )  ? '<span '.zn_generate_icon( $tab['vts_tab_icon'] ).'></span>' : '';
                    // $icon = '<span><span class="' . $tab['vts_tab_icon'] . '"></span></span>';
                }

                // Tab Handle
                echo '<li class="' . $cls . '">';
                echo '<a href="#tabs_v2-pane' . $uniq_name . '" data-toggle="tab">';
                echo $icon;
                echo $tab['vts_tab_title'];
                echo '</a>';

                echo '</li>';

                // TAB CONTENT
                $content .= '<div class="tab-pane fade in ' . $cls . '" id="tabs_v2-pane' . $uniq_name . '">';

                $content .= '<h4>' . $tab['vts_tab_c_title'] . '</h4>';

                $content .= wpautop($tab['vts_tab_c_content']);

                $content .= '</div>';

                $i ++;
            }

            echo '</ul>';

            echo '<div class="tab-content">';

            echo do_shortcode( $content );

            echo '</div>';
        }

        echo '</div>';
        echo '</div>';
    }

    /**
     * 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()
    {
        $extra_options = array (
            "name"           => __( "Tabs", 'zn_framework' ),
            "description"    => __( "Here you can add your desired tabs.", 'zn_framework' ),
            "id"             => "single_vertical_tab",
            "std"            => "",
            "type"           => "group",
            "add_text"       => __( "Tab", 'zn_framework' ),
            "remove_text"    => __( "Tab", 'zn_framework' ),
            "group_sortable" => true,
            "subelements"    => array (
                array (
                    "name"        => __( "Tab Title", 'zn_framework' ),
                    "description" => __( "Please enter the desired title that will appear as tab.", 'zn_framework' ),
                    "id"          => "vts_tab_title",
                    "std"         => "",
                    "type"        => "text"
                ),
                array (
                    "name"        => __( "Tab icon", 'zn_framework' ),
                    "description" => __( "Select your desired icon that will appear on the left side of the tab title.", 'zn_framework' ),
                    "id"          => "vts_tab_icon",
                    "std"         => "",
                    "type"        => "icon_list",
                    'class'       => 'zn_full',
                ),
                array (
                    "name"        => __( "Tab Content Title", 'zn_framework' ),
                    "description" => __( "Please enter the desired title that will appear inside the tab.", 'zn_framework' ),
                    "id"          => "vts_tab_c_title",
                    "std"         => "",
                    "type"        => "text"
                ),
                array (
                    "name"        => __( "Content", 'zn_framework' ),
                    "description" => __( "Please enter the desired content for this tab.", 'zn_framework' ),
                    "id"          => "vts_tab_c_content",
                    "std"         => "",
                    "type"        => "visual_editor"
                )
            )
        );
        return array (
                array (
                    "name"        => __( "Select style", 'zn_framework' ),
                    "description" => __( "Select the desired style for this element", 'zn_framework' ),
                    "id"          => "vtabs_style",
                    "type"        => "select",
                    "std"         => "kl-style-2",
                    "options"     => array (
                        'kl-style-1' => __( 'Style 1', 'zn_framework' ),
                        'kl-style-2' => __( 'Style 2', 'zn_framework' ),
                    ),
                ),
                $extra_options,
        );
    }
}
