<?php
/**
 * Customizer Control: Homepage Layout Manager.
 *
 * @package Pawfect
 */

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

if ( class_exists( 'WP_Customize_Control' ) ) :

    /**
     * A custom control for managing the homepage layout with a drag-and-drop interface.
     */
    class Pawfect_Customize_Layout_Control extends WP_Customize_Control {

        /**
         * The type of control.
         *
         * @var string
         */
        public $type = 'pawfect_layout_manager';

        /**
         * Get all available sections with their properties
         */
        private function get_all_sections() {
            $is_pro = apply_filters( 'pawfect_is_pro_active', false );
            return array(
                'hero_slider'        => array( 'label' => esc_html__( 'Hero Slider', 'pawfect' ), 'pro_only' => false ),
                'press_mentions'     => array( 'label' => esc_html__( 'Press Mentions', 'pawfect' ), 'pro_only' => false ),
                'feature_highlight'  => array( 'label' => esc_html__( 'Feature Highlight', 'pawfect' ), 'pro_only' => false ),
                'why_choose'         => array( 'label' => esc_html__( 'Why Choose Us', 'pawfect' ), 'pro_only' => false ),
                'portfolio'          => array( 'label' => esc_html__( 'Shop by Category', 'pawfect' ), 'pro_only' => false ),
                'featured_collection'=> array( 'label' => esc_html__( 'Featured Collection', 'pawfect' ), 'pro_only' => false ),
                'testimonial'        => array( 'label' => esc_html__( 'Testimonials', 'pawfect' ), 'pro_only' => false ),
                'mission'            => array( 'label' => esc_html__( 'Mission', 'pawfect' ), 'pro_only' => false ),
                'pet_shop'           => array( 'label' => esc_html__( 'Shop By Pet', 'pawfect' ), 'pro_only' => false ),
                'promo_timer'        => array( 'label' => esc_html__( 'Promo Timer', 'pawfect' ), 'pro_only' => ! $is_pro ),
                'crafted'            => array( 'label' => esc_html__( 'Crafted with Care', 'pawfect' ), 'pro_only' => false ),
                'blog'               => array( 'label' => esc_html__( 'Blog', 'pawfect' ), 'pro_only' => false ),
                'promo_banner'       => array( 'label' => esc_html__( 'Promo Banner', 'pawfect' ), 'pro_only' => false ),
                'instagram'          => array( 'label' => esc_html__( 'Instagram Gallery', 'pawfect' ), 'pro_only' => ! $is_pro ),
                'cta'                => array( 'label' => esc_html__( 'Call to Action', 'pawfect' ), 'pro_only' => false ),
                'woocommerce'        => array( 'label' => esc_html__( 'WooCommerce Products', 'pawfect' ), 'pro_only' => false ),
            );
        }

        /**
         * Get default configuration
         */
        private function get_default_config() {
            $all_sections = $this->get_all_sections();
            $config = array();
            $order = 0;

            foreach ( $all_sections as $section_id => $section_data ) {
                $config[ $section_id ] = array(
                    'order' => $order++,
                    'visible' => ! $section_data['pro_only'] // Pro-only sections disabled by default
                );
            }

            return $config;
        }

        /**
         * Enqueue control related scripts/styles.
         */
        public function enqueue() {
            // Enqueue jQuery UI Sortable, as our control depends on it.
            wp_enqueue_script( 'jquery-ui-sortable' );

            // Enqueue the layout manager CSS and JS
            wp_enqueue_style( 'pawfect-controls', PAWFECT_THEME_URL . '/inc/customizer/assets/css/controls.css', array(), PAWFECT_THEME_VERSION );
            wp_enqueue_script( 'pawfect-customizer-layout-js', PAWFECT_THEME_URL . '/inc/customizer/assets/js/customizer-layout.js', array( 'jquery', 'jquery-ui-sortable' ), PAWFECT_THEME_VERSION, true );
        }

        /**
         * Render the control's content.
         *
         * This function renders the HTML for the drag-and-drop interface with eye icons.
         */
        public function render_content() {
            // Get the current layout configuration
            $value = $this->value();

            // If we have the old format (comma-separated string), convert it
            if ( is_string( $value ) && ! empty( $value ) ) {
                $enabled_sections = array_filter( explode( ',', $value ) );
                $layout_config = array();

                // Convert old format to new format
                foreach ( $this->get_all_sections() as $section_id => $section_data ) {
                    $order = array_search( $section_id, $enabled_sections );
                    $layout_config[ $section_id ] = array(
                        'order' => $order !== false ? $order : 999,
                        'visible' => in_array( $section_id, $enabled_sections ) && ! $section_data['pro_only']
                    );
                }
            } else if ( is_array( $value ) && ! empty( $value ) ) {
                $layout_config = $value;
            } else {
                // Default configuration
                $layout_config = $this->get_default_config();
            }

            $all_sections = $this->get_all_sections();

            // Sort sections by order
            uasort( $layout_config, function( $a, $b ) {
                $order_a = isset( $a['order'] ) ? $a['order'] : 0;
                $order_b = isset( $b['order'] ) ? $b['order'] : 0;
                return $order_a - $order_b;
            });
            ?>
            <span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
            <span class="description customize-control-description">
                <?php echo esc_html( $this->description ); ?>
            </span>

            <!-- Hidden input to store the JSON configuration -->
            <input type="hidden" <?php $this->link(); ?> value="<?php echo esc_attr( json_encode( $layout_config ) ); ?>" />

            <!-- FRONTPAGE SECTIONS WITH EYE ICON TOGGLES -->
            <div class="customizer-layout-container">
                <div class="customizer-layout-heading"><?php esc_html_e( 'Frontpage Sections', 'pawfect' ); ?></div>
                <ul id="pawfect-frontpage-elements" class="sortable-list" data-control-id="<?php echo esc_attr( $this->id ); ?>">
                    <?php foreach ( $layout_config as $section_id => $config ) : ?>
                        <?php if ( isset( $all_sections[ $section_id ] ) ) : ?>
                            <?php
                            $section_data = $all_sections[ $section_id ];
                            $is_visible = isset( $config['visible'] ) ? $config['visible'] : true;
                            $is_pro_only = $section_data['pro_only'];

                            $visibility_class = $is_visible ? '' : ' pawfect-disabled';
                            $pro_class = $is_pro_only ? ' pawfect-pro-only' : '';
                            ?>
                            <li class="sortable-item<?php echo esc_attr( $visibility_class . $pro_class ); ?>"
                                data-section-id="<?php echo esc_attr( $section_id ); ?>"
                                data-visible="<?php echo esc_attr( $is_visible ? 'true' : 'false' ); ?>"
                                data-pro-only="<?php echo esc_attr( $is_pro_only ? 'true' : 'false' ); ?>"
                                style="<?php echo esc_attr( $is_visible ? '' : 'opacity: 0.5;' ); ?>">
                                <span class="pawfect-element-label">
                                    <?php echo esc_html( $section_data['label'] ); ?>
                                    <?php if ( $is_pro_only ) : ?>
                                        <span class="pawfect-pro-badge">Pro</span>
                                    <?php endif; ?>
                                </span>
                                <span class="pawfect-visibility-toggle"
                                      data-section="<?php echo esc_attr( $section_id ); ?>"
                                      <?php if ( $is_pro_only ) { echo 'data-pro-only="true"'; } ?>
                                      title="<?php echo esc_attr( $is_visible ? __( 'Click to hide', 'pawfect' ) : __( 'Click to show', 'pawfect' ) ); ?>">
                                    <?php if ( $is_visible ) : ?>
                                        <span class="dashicons dashicons-visibility"></span>
                                    <?php elseif ( $is_pro_only ) : ?>
                                        <span class="dashicons dashicons-lock"></span>
                                    <?php else : ?>
                                        <span class="dashicons dashicons-hidden"></span>
                                    <?php endif; ?>
                                </span>
                            </li>
                        <?php endif; ?>
                    <?php endforeach; ?>
                </ul>
            </div>

            <p class="description customize-control-description" style="margin-top: 10px; font-style: italic; color: #666;">
                <strong><?php esc_html_e( 'Tip:', 'pawfect' ); ?></strong>
                <?php esc_html_e( 'Click the eye icons to show/hide sections, drag to reorder. Pro sections require upgrade.', 'pawfect' ); ?>
            </p>
            <?php
        }
    }

endif;
