<?php
/**
 * Customizer fields for general layout settings.
 *
 * @package Eronex
 * @since   0.0.1
 */

use Kirki\Field\Background;
use Kirki\Field\Dimension;
use Kirki\Field\Dimensions;
use Kirki\Field\Select;
use Kirki\Pro\Field\Divider;
use Kirki\Pro\Field\InputSlider;

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

new Select(
	array(
		'label'    => esc_html__( 'Theme Layout', 'eronex' ),
		'settings' => 'eronex_layout',
		'section'  => 'eronex_general_layout',
		'default'  => 'full-width',
		'choices'  => array(
			'full-width' => esc_html__( 'Full Width', 'eronex' ),
			'boxed'      => esc_html__( 'Boxed', 'eronex' ),
		),
	)
);

new Divider(
	array(
		'settings'        => 'eronex_boxed_separator',
		'section'         => 'eronex_general_layout',
		'choices'         => array(
			'color' => $separator_color,
		),
		'active_callback' => array(
			array(
				'setting'  => 'eronex_layout',
				'operator' => '===',
				'value'    => 'boxed',
			),
		),
	)
);

new Dimension(
	array(
		'label'           => esc_html__( 'Box Width', 'eronex' ),
		'settings'        => 'eronex_layout_width',
		'section'         => 'eronex_general_layout',
		'transport'       => 'auto',
		'responsive'      => true,
		'default'         => array(
			'desktop' => '1280px',
			'tablet'  => '1140px',
			'mobile'  => '1025px',
		),
		'active_callback' => array(
			array(
				'setting'  => 'eronex_layout',
				'operator' => '===',
				'value'    => 'boxed',
			),
		),
		'output'          => array(
			array(
				'element'     => '.eronex-primary-wrapper,.eronex-header',
				'property'    => 'max-width',
				'media_query' => array(
					'desktop' => $desktop_media_query,
					'tablet'  => $tablet_media_query,
					'mobile'  => $mobile_media_query,
				),
			),
		),
	)
);

new Background(
	array(
		'label'           => esc_html__( 'Box Background', 'eronex' ),
		'settings'        => 'eronex_boxed_bg',
		'section'         => 'eronex_general_layout',
		'transport'       => 'auto',
		'default'         => array(
			'background-color'      => '',
			'background-image'      => '',
			'background-repeat'     => '',
			'background-position'   => '',
			'background-size'       => '',
			'background-attachment' => '',
		),
		'active_callback' => array(
			array(
				'setting'  => 'eronex_layout',
				'operator' => '===',
				'value'    => 'boxed',
			),
		),
		'output'          => array(
			array(
				'element' => '.eronex-content-inner',
			),
		),
	)
);

new Divider(
	array(
		'settings' => 'eronex_body_bg_separator',
		'section'  => 'eronex_general_layout',
		'choices'  => array(
			'color' => $separator_color,
		),
	)
);

new Background(
	array(
		'label'     => esc_html__( 'Body Background', 'eronex' ),
		'settings'  => 'eronex_body_bg',
		'section'   => 'eronex_general_layout',
		'transport' => 'auto',
		'default'   => array(
			'background-color'      => '',
			'background-image'      => '',
			'background-repeat'     => 'repeat',
			'background-position'   => 'center center',
			'background-size'       => 'cover',
			'background-attachment' => 'scroll',
		),
		'output'    => array(
			array(
				'element' => 'body',
			),
		),
	)
);

new Divider(
	array(
		'settings' => 'eronex_container_separator',
		'section'  => 'eronex_general_layout',
		'choices'  => array(
			'color' => $separator_color,
		),
	)
);

new Select(
	array(
		'label'    => esc_html__( 'Container Layout', 'eronex' ),
		'settings' => 'eronex_container_layout',
		'section'  => 'eronex_general_layout',
		'default'  => 'container',
		'choices'  => array(
			'container'       => esc_html__( 'Normal', 'eronex' ),
			'container-fluid' => esc_html__( 'Fluid', 'eronex' ),
			'full-width'      => esc_html__( 'Full Width', 'eronex' ),
		),
	)
);

new Dimension(
	array(
		'label'           => esc_html__( 'Container Width', 'eronex' ),
		'settings'        => 'eronex_container_width',
		'section'         => 'eronex_general_layout',
		'transport'       => 'auto',
		'responsive'      => true,
		'default'         => array(
			'desktop' => '1140px',
			'tablet'  => '1024px',
			'mobile'  => '767px',
		),
		'output'          => array(
			array(
				'element'     => '.eronex-container',
				'property'    => 'max-width',
				'media_query' => array(
					'desktop' => $desktop_media_query,
					'tablet'  => $tablet_media_query,
					'mobile'  => $mobile_media_query,
				),
			),
			array(
				'element'     => '.eronex-header:not(.eronex-appear) .eronex-navbar-style-5',
				'property'    => 'max-width',
				'media_query' => array(
					'desktop' => $desktop_media_query,
					'tablet'  => $tablet_media_query,
					'mobile'  => $mobile_media_query,
				),
			),
		),
		'active_callback' => array(
			array(
				'setting'  => 'eronex_container_layout',
				'operator' => '===',
				'value'    => 'container',
			),
		),
	)
);

new Divider(
	array(
		'settings' => 'eronex_sidebar_layout_separator',
		'section'  => 'eronex_general_layout',
		'choices'  => array(
			'color' => $separator_color,
		),
	)
);

new Select(
	array(
		'label'    => esc_html__( 'Sidebar Layout', 'eronex' ),
		'settings' => 'eronex_sidebar_layout',
		'section'  => 'eronex_general_layout',
		'default'  => 'right',
		'choices'  => array(
			'none'  => esc_html__( 'No Sidebar', 'eronex' ),
			'left'  => esc_html__( 'Left Sidebar', 'eronex' ),
			'right' => esc_html__( 'Right Sidebar', 'eronex' ),
		),
	)
);

new Select(
	array(
		'label'    => esc_html__( 'Sidebar Style', 'eronex' ),
		'settings' => 'eronex_sidebar_style',
		'section'  => 'eronex_general_layout',
		'default'  => 'boxed',
		'choices'  => array(
			'boxed'   => esc_html__( 'Boxed', 'eronex' ),
			'unboxed' => esc_html__( 'Unboxed', 'eronex' ),
		),
	)
);

new Divider(
	array(
		'settings' => 'eronex_content_wrapper_padding_separator',
		'section'  => 'eronex_general_layout',
		'choices'  => array(
			'color' => $separator_color,
		),
	),
);

new Dimensions(
	array(
		'settings'   => 'eronex_content_wrapper_padding',
		'label'      => esc_html__( 'Content Padding', 'eronex' ),
		'section'    => 'eronex_general_layout',
		'default'    => array(
			'mobile'  => array(
				'padding-top'    => '',
				'padding-bottom' => '',
			),
			'tablet'  => array(
				'padding-top'    => '',
				'padding-bottom' => '',
			),
			'desktop' => array(
				'padding-top'    => '',
				'padding-bottom' => '',
			),
		),
		'choices'    => array(
			'labels' => array(
				'padding-top'    => esc_html__( 'Top', 'eronex' ),
				'padding-bottom' => esc_html__( 'Bottom', 'eronex' ),
			),
		),
		'output'     => array(
			array(
				'element'     => '.eronex-content-inner',
				'media_query' => array(
					'desktop' => $desktop_media_query,
					'tablet'  => $tablet_media_query,
					'mobile'  => $mobile_media_query,
				),
			),
		),
		'transport'  => 'auto',
		'responsive' => true,
	)
);

new Divider(
	array(
		'settings' => 'eronex_breakpoint_separator',
		'section'  => 'eronex_general_layout',
		'choices'  => array(
			'color' => $separator_color,
		),
	)
);

new InputSlider(
	array(
		'label'    => esc_html__( 'Tablet Breakpoint', 'eronex' ),
		'settings' => 'eronex_tablet_breakpoint',
		'section'  => 'eronex_general_layout',
		'default'  => '1025',
		'choices'  => array(
			'min'  => 0,
			'max'  => 1600,
			'step' => 1,
		),
	)
);

new InputSlider(
	array(
		'label'    => esc_html__( 'Mobile Breakpoint', 'eronex' ),
		'settings' => 'eronex_mobile_breakpoint',
		'section'  => 'eronex_general_layout',
		'default'  => '767',
		'choices'  => array(
			'min'  => 0,
			'max'  => 1200,
			'step' => 1,
		),
	)
);
