<?php

namespace GriffinForms\Admin\App\Html\Widgets\PresentationArea\FormControls;

class Inputrating extends \GriffinForms\Admin\App\Html\Widgets\PresentationArea\FormControls\Format
{
    public function getHtml()
    {
        $field_settings = $this->item->getProp('field_settings');
        $s = is_array($field_settings) ? $field_settings : [];
        $is_theme_set = $this->isThemeSet();

        $scale = max(2, min(10, absint($s['scale'] ?? 5)));
        $icon_group = sanitize_key((string) ($s['icon_group'] ?? 'star'));
        $icon_size = max(16, absint($s['icon_size'] ?? 32));
        $icon_spacing = max(0, absint($s['icon_spacing'] ?? 4));
        $color_empty = !empty($s['color_empty']) ? $s['color_empty'] : '#d1d5db';
        $color_filled = !empty($s['color_filled']) ? $s['color_filled'] : '#f5a623';
        $step_labels = array_values(is_array($s['step_labels'] ?? null) ? $s['step_labels'] : []);
        $custom_image_id = absint($s['custom_image_id'] ?? 0);
        $step_image_ids = array_values(is_array($s['step_image_ids'] ?? null) ? $s['step_image_ids'] : []);
        $allow_clear = !empty($s['allow_clear']);

        $icon_preview_map = array(
            'star' => 'star-filled.svg',
            'heart' => 'heart-filled.svg',
            'thumb' => 'thumb-filled.svg',
            'face' => 'face-filled.svg',
            'circle' => 'circle-filled.svg',
            'flag' => 'flag-filled.svg',
            'bolt' => 'bolt-filled.svg',
            'diamond' => 'diamond-filled.svg',
            'custom' => 'star-filled.svg',
        );
        $empty_style = 'width:' . (int) $icon_size . 'px;height:' . (int) $icon_size . 'px;background-color:' . esc_attr($color_empty) . ';-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;';
        $filled_style = 'width:' . (int) $icon_size . 'px;height:' . (int) $icon_size . 'px;background-color:' . esc_attr($color_filled) . ';-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;';

        $label_color = $is_theme_set ? $this->form_theme->getLabelColor() : '';
        $label_color_style = !empty($label_color) ? esc_attr($label_color) : '#6b7280';

        $this->renderRatingClearButtonStyle();

        echo '<div class="gf-rating-field d-flex flex-wrap align-items-start" data-gf-rating-preview="1" style="margin-bottom:12px;row-gap:' . esc_attr($icon_spacing) . 'px;">';
        for ($i = 0; $i < $scale; $i++) {
            $label = $step_labels[$i] ?? '';
            $item_style = 'min-width:' . esc_attr($icon_size) . 'px;';
            if ($i < $scale - 1) {
                $item_style .= 'margin-right:' . esc_attr($icon_spacing) . 'px;';
            }
            echo '<div class="d-flex flex-column align-items-center" style="' . esc_attr($item_style) . '">';
            $step_image_id = !empty($step_image_ids[$i]) ? absint($step_image_ids[$i]) : 0;
            $preview_image_id = $step_image_id ?: ($icon_group === 'custom' ? $custom_image_id : 0);
            if ($preview_image_id > 0) {
                $preview_image = wp_get_attachment_image($preview_image_id, 'full', false, [
                    'class' => 'img-fluid',
                    'style' => 'display:block;width:auto;height:auto;max-height:' . (int) $icon_size . 'px;max-width:100%;object-fit:contain;',
                    'alt' => '',
                ]);
                if (!empty($preview_image)) {
                    echo wp_kses_post($preview_image);
                }
            } elseif (!empty($icon_preview_map[$icon_group])) {
                $icon_url = esc_url(trailingslashit(WP_PLUGIN_URL) . 'griffinforms-form-builder-pro/admin/images/rating-icons/' . $icon_preview_map[$icon_group]);
                echo '<span class="gf-rating-icon-empty" aria-hidden="true" style="' . esc_attr($empty_style) . '-webkit-mask-image:url(' . $icon_url . ');mask-image:url(' . $icon_url . ');display:block;"></span>';
                echo '<span class="gf-rating-icon-filled" aria-hidden="true" style="' . esc_attr($filled_style) . '-webkit-mask-image:url(' . $icon_url . ');mask-image:url(' . $icon_url . ');display:none;"></span>';
            }
            if ($label !== '') {
                echo '<span class="gf-rating-label" style="font-size:11px;line-height:1.2;margin-top:4px;color:' . $label_color_style . ';text-align:center;">' . esc_html($label) . '</span>';
            }
            echo '</div>';
        }
        if ($allow_clear) {
            $clear_classes = 'gf-rating-clear' . ($is_theme_set ? '' : ' gf-rating-clear-default btn btn-sm btn-outline-secondary');
            $clear_btn_type_attr = $is_theme_set ? ' data-gf-button-type="previous"' : '';
            $clear_style_attrs = $is_theme_set ? $this->getFieldStyleAttributes('gf_rating_clear') : '';
            echo '<div class="gf-rating-clear-row" style="width:100%;text-align:left;">'
                . '<button type="button" class="' . esc_attr($clear_classes) . '"' . $clear_btn_type_attr . $clear_style_attrs . ' aria-label="' . esc_attr__('Clear rating', 'griffinforms-form-builder') . '">'
                . esc_html__('Clear', 'griffinforms-form-builder') . '</button>'
                . '</div>';
        }
        echo '</div>';
    }

    private function renderRatingClearButtonStyle(): void
    {
        if (!$this->isThemeSet()) {
            return;
        }

        $prev_css = $this->form_theme->getPreviousButtonCss('default');
        if (empty($prev_css)) {
            return;
        }

        $group = esc_attr($this->getFieldStyleGroupId());
        $selector = '[data-gf-style-group="' . $group . '"][data-gf-style-type="gf_rating_clear"]';
        $css = $selector . ' { ' . $prev_css . ' }';
        $css = \GriffinForms\Items\FormTheme::prepareStyleTagContent($css);
        if ($css !== '') {
            echo '<style>' . $css . '</style>';
        }
    }
}
