<?php

if (!defined('ABSPATH')) {
    exit; // Exit if accessed directly.
}

use Elementor\Controls_Manager;
use Elementor\Group_Control_Background;

class Motiox_Elementor__Menu_Canvas extends Elementor\Widget_Base {

    public function get_name() {
        return 'motiox-menu-canvas';
    }

    public function get_title() {
        return esc_html__('Motiox Menu Canvas', 'motiox');
    }

    public function get_icon() {
        return 'eicon-nav-menu';
    }

    public function get_categories() {
        return ['motiox-addons'];
    }

    protected function register_controls() {
        $this->start_controls_section(
            'icon-menu_style',
            [
                'label' => esc_html__('Icon', 'motiox'),
                'tab'   => Controls_Manager::TAB_STYLE,
            ]
        );

        $this->add_control(
            'layout_style',
            [
                'label'        => esc_html__('Layout Style', 'motiox'),
                'type'         => Controls_Manager::SELECT,
                'options'      => [
                    'layout-1' => esc_html__('Layout 1', 'motiox'),
                    'layout-2' => esc_html__('Layout 2', 'motiox'),
                    'layout-3' => esc_html__('Layout 3', 'motiox'),
                ],
                'default'      => 'layout-2',
                'prefix_class' => 'motiox-canvas-menu-',
            ]
        );


        $this->start_controls_tabs( 'color_tabs' );

        $this->start_controls_tab( 'colors_normal',
            [
                'label' => esc_html__( 'Normal', 'motiox' ),
            ]
        );

        $this->add_group_control(
            Group_Control_Background::get_type(),
            [
                'name'           => 'all_background_button_link',
                'label'          => esc_html__( 'Background Button Link', 'motiox' ),
                'types'          => [ 'classic', 'gradient' ],
                'selector'       => '{{WRAPPER}} .menu-mobile-nav-button .motiox-icon > span',
                'fields_options' => [
                    'color' => [
                        'global' => [
                            'default' => '',
                        ],
                    ],
                ],
            ]
        );


        $this->end_controls_tab();

        $this->start_controls_tab(
            'colors_hover',
            [
                'label' => esc_html__( 'Hover', 'motiox' ),
            ]
        );


        $this->add_group_control(
            Group_Control_Background::get_type(),
            [
                'name'           => 'all_background_button_link_hover',
                'label'          => esc_html__( 'Background Button Link', 'motiox' ),
                'types'          => [ 'classic', 'gradient' ],
                'selector'       => '{{WRAPPER}} .menu-mobile-nav-button:hover .motiox-icon > span',
                'fields_options' => [
                    'color' => [
                        'global' => [
                            'default' => '',
                        ],
                    ],
                ],
            ]
        );

        $this->end_controls_tab();

        $this->end_controls_tabs();

        $this->end_controls_section();

    }

    protected function render() {
        $settings = $this->get_settings_for_display();
        $this->add_render_attribute('wrapper', 'class', 'elementor-canvas-menu-wrapper');
        ?>
        <div <?php $this->print_render_attribute_string('wrapper'); ?>>
            <?php motiox_mobile_nav_button(); ?>
        </div>
        <?php
    }

}

$widgets_manager->register(new Motiox_Elementor__Menu_Canvas());