<?php
namespace IcreatorCookieConsent;

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

class BannerPreview extends Banner {

    public function __construct(array $override = []) {
        // Force-preview overrides (no revoke button, add a preview flag)
        $override = wp_parse_args( $override, [
            'show_revoke' => false,
            'is_preview'  => true,
        ] );
        parent::__construct($override);
    }

    protected function wrapper_classes(): string {
        // Add a preview marker class so you can style differently if needed
        $classes = parent::wrapper_classes() . ' iccb-preview';
        return trim($classes);
    }

    public function output(): void {
        // Use a different wrapper ID so your admin JS can target it safely
        ?>
        <div id="iccb-cookie-banner-preview"
             class="<?php echo esc_attr( $this->wrapper_classes() ); ?>"
             data-accent="<?php echo esc_attr( $this->opts['accent_color'] ); ?>"
             data-defaults="<?php echo esc_attr( wp_json_encode( $this->opts['default_categories'] ) ); ?>">
            <?php $this->render_summary(); ?>
            <?php $this->render_details(); ?>
        </div>
        <?php
    }

    // Swap IDs inside the summary so admin JS can listen on preview-only IDs
    protected function render_summary(): void {
        $locale_is_rtl = is_rtl();
        $orders = $this->opts['orders'];
        $preset = $this->opts['preset'];

        $order = $orders[$preset] ?? $orders['balanced'];
        if ($locale_is_rtl && $preset !== 'stacked') {
            $order = array_reverse($order); // mirror for RTL
        }
        $buttons = [
            'accept' => '<button id="iccb-preview-accept" class="iccb-btn iccb-btn--primary">'.esc_html($this->opts['accept_label']).'</button>',
            'reject' => '<button id="iccb-preview-reject" class="iccb-btn iccb-btn--secondary">'.esc_html($this->opts['decline_label']).'</button>',
            'manage' => '<button id="iccb-preview-manage" class="iccb-btn iccb-btn--ghost">'.esc_html($this->opts['manage_label']).'</button>',
        ];
        ?>
        <div class="iccb-summary">
            <div class="iccb-text">
                <h3>
                    <span  class="iccb-cookie-icon">
                        <svg xmlns="http://www.w3.org/2000/svg" class="consentpress-icon" width="21" height="21" viewBox="0 0 21 21" role="img" aria-label="ConsentPress">
                            <g id="surface1">
                                <path class="circle" d="M 62 32 C 62 15.428571 48.571429 2 32 2 C 15.428571 2 2 15.428571 2 32 C 2 48.571429 15.428571 62 32 62 C 48.571429 62 62 48.571429 62 32 Z M 62 32 " transform="matrix(0.328125,0,0,0.328125,0,0)"/>
                                <path class="dot" d="M 8.53125 7.875 C 8.53125 7.148438 7.945312 6.5625 7.21875 6.5625 C 6.492188 6.5625 5.90625 7.148438 5.90625 7.875 C 5.90625 8.601562 6.492188 9.1875 7.21875 9.1875 C 7.945312 9.1875 8.53125 8.601562 8.53125 7.875 Z M 8.53125 7.875 "/>
                                <path class="dot" d="M 13.453125 5.90625 C 13.453125 5.363281 13.011719 4.921875 12.46875 4.921875 C 11.925781 4.921875 11.484375 5.363281 11.484375 5.90625 C 11.484375 6.449219 11.925781 6.890625 12.46875 6.890625 C 13.011719 6.890625 13.453125 6.449219 13.453125 5.90625 Z M 13.453125 5.90625 "/>
                                <path class="dot" d="M 15.421875 10.5 C 15.421875 9.59375 14.6875 8.859375 13.78125 8.859375 C 12.875 8.859375 12.140625 9.59375 12.140625 10.5 C 12.140625 11.40625 12.875 12.140625 13.78125 12.140625 C 14.6875 12.140625 15.421875 11.40625 15.421875 10.5 Z M 15.421875 10.5 "/>
                                <path class="dot" d="M 10.5 13.78125 C 10.5 13.054688 9.914062 12.46875 9.1875 12.46875 C 8.460938 12.46875 7.875 13.054688 7.875 13.78125 C 7.875 14.507812 8.460938 15.09375 9.1875 15.09375 C 9.914062 15.09375 10.5 14.507812 10.5 13.78125 Z M 10.5 13.78125 "/>
                            </g>
                        </svg>
                    </span>
                    <span class="iccb-title"><?php echo esc_html( $this->opts['banner_title']  ); ?></span>
                </h3>
                <p><?php echo esc_html( $this->opts['banner_text']  ); ?></p>
            </div>
            <div class="iccb-summary-actions">
                <?php 
                    if ($preset === 'stacked') {
                        echo '<div class="iccb-primary-actions">' . wp_kses($buttons[$order[0]], $this->button_allowed_html()) . wp_kses($buttons[$order[1]], $this->button_allowed_html()) . '</div>';
                        echo wp_kses($buttons[$order[2]], $this->button_allowed_html());
                    } else {
                        foreach ($order as $key) { echo wp_kses($buttons[$key], $this->button_allowed_html()); }
                    }
                ?>
            </div>
        </div>
        <?php
    }

    // Swap the accordion container ID for preview
    protected function render_details(): void {
        ?>
        <div class="iccb-details">
            <hr />
            <div id="iccb-preview-accordion"></div>
            <div class="">
                <button id="iccb-preview-save">
                    <?php echo esc_html( $this->opts['save_label']  ); ?>
                </button>
                <?php if ( $this->opts['learn_url'] ) : ?>
                    <a class="iccb-learn-more" target="_blank" href="<?php echo esc_url( $this->opts['learn_url'] ); ?>">
                        <?php echo esc_html( $this->opts['learn_text'] ); ?>
                    </a>
                <?php endif; ?>
            </div>
        </div>
        <?php
    }
}
