<?php

namespace GriffinForms\Admin\Html\Pages\Single;

class Message extends \GriffinForms\Admin\Html\Pages\Single\Format
{   
    protected $type = 'message';
    
    public function itemOptions()
    {
        $this->messageContent();
    }
    
    protected function messageContent()
    {
        echo '<div class="container border-bottom griffinforms-item-options w-75 mt-3 pt-3">';
        $this->mergeTokenTools();
        $this->getOption('content', true);
        echo '</div>'; 
    }

    /**
     * Render the back button for message editor.
     */
    protected function backToListBtn()
    {
        $this->buttons->bsBtn([
            'class' => 'gf-back-to-messages-btn gf-btn-light mb-3',
            'label' => $this->lang->getText('Back to messages'),
            'link'  => admin_url('admin.php?page=griffinforms-messages'),
            'icon'  => 'list'
        ]);
    }

    protected function content()
    {
        $this->richText();
    }

    protected function mergeTokenTools()
    {
        $forms = $this->sql->getFormContextOptions();

        echo '<div class="gf-merge-token-panel mb-3">';
        echo '<div class="row mb-2">';
        echo '<div class="col-md-12 small text-muted">' . esc_html($this->lang->getText('merge_tokens_description')) . '</div>';
        echo '</div>';

        echo '<div class="row g-2 align-items-end">';
        echo '<div class="col-md-3">';
        echo '<label class="form-label small">' . esc_html($this->lang->getText('merge_form_context_label')) . '</label>';
        echo '<select class="form-select form-select-sm" id="griffinforms-merge-form-context">';
        echo '<option value="">' . esc_html($this->lang->getText('select_form')) . '</option>';
        foreach ($forms as $form) {
            $label = !empty($form->name) ? $form->name : ('Form ' . $form->id);
            if (!empty($form->heading) && $form->heading !== $label) {
                $label .= ' - ' . $form->heading;
            }
            echo '<option value="' . esc_attr($form->id) . '">' . esc_html($label) . '</option>';
        }
        echo '</select>';
        echo '</div>';

        echo '<div class="col-md-2">';
        echo '<label class="form-label small">' . esc_html($this->lang->getText('merge_item_type_label')) . '</label>';
        echo '<select class="form-select form-select-sm" id="griffinforms-merge-item-type">';
        echo '<option value="field">' . esc_html($this->lang->getText('merge_item_type_field')) . '</option>';
        echo '<option value="form">' . esc_html($this->lang->getText('merge_item_type_form')) . '</option>';
        echo '<option value="submission">' . esc_html($this->lang->getText('merge_item_type_submission')) . '</option>';
        echo '</select>';
        echo '</div>';

        echo '<div class="col-md-3">';
        echo '<label class="form-label small">' . esc_html($this->lang->getText('merge_field_label')) . '</label>';
        echo '<div class="d-flex align-items-center gap-2">';
        echo '<select class="form-select form-select-sm" id="griffinforms-merge-field-select">';
        echo '<option value="">' . esc_html($this->lang->getText('select_field')) . '</option>';
        echo '</select>';
        echo '<span class="spinner is-active" id="griffinforms-merge-field-spinner" style="visibility: hidden;"></span>';
        echo '</div>';
        echo '</div>';

        echo '<div class="col-md-2">';
        echo '<label class="form-label small">' . esc_html($this->lang->getText('merge_attr_label')) . '</label>';
        echo '<select class="form-select form-select-sm" id="griffinforms-merge-attr-select"></select>';
        echo '</div>';

        echo '<div class="col-md-2">';
        echo '<label class="form-label small">' . esc_html($this->lang->getText('merge_fallback_label')) . '</label>';
        echo '<input type="text" class="form-control form-control-sm" id="griffinforms-merge-fallback">';
        echo '</div>';
        echo '</div>';

        echo '<div class="row g-2 align-items-end mt-2">';
        echo '<div class="col-md-10">';
        echo '<label class="form-label small">' . esc_html($this->lang->getText('merge_token_preview_label')) . '</label>';
        echo '<input type="text" class="form-control form-control-sm" id="griffinforms-merge-token-preview" readonly>';
        echo '</div>';

        echo '<div class="col-md-2">';
        echo '<div class="d-flex justify-content-end align-items-center gap-2">';
        echo '<span class="spinner is-active" id="griffinforms-merge-token-spinner" style="visibility: hidden;"></span>';
        echo '<button type="button" class="button button-primary btn-sm" id="griffinforms-merge-token-insert">' . esc_html($this->lang->getText('merge_insert_token_label')) . '</button>';
        echo '</div>';
        echo '</div>';
        echo '</div>';
        echo '</div>';
    }
}
