<?php

namespace GriffinForms\Admin\Html\Modals;

class createField extends \GriffinForms\Admin\Html\Modals\Format
{   
    protected function headerText()
    {
        $text = $this->lang->getText('select_field_type');
        return $text;
    }
    
    protected function modalContent()
    {
        $field_definitions = $this->config->getFieldDefinitions();

        echo '<div class="gf-createfield-modal">';
        echo '<div id="griffinforms-createfield-wrapper" class="row row-cols-1 row-cols-sm-2 row-cols-lg-4 g-3">';
        
        foreach ($field_definitions as $field_definition) {
            $this->fieldTypeCard((string) ($field_definition['field_type'] ?? ''));
        }
        
        echo '</div>';
        echo '</div>';
        
    }
    
    protected function fieldTypeCard($type)
    {
        echo '<div class="col">';
        echo '<div class="card griffinforms-createfield-card griffinforms-' . esc_attr($type) . '-card h-100">';
        echo '<div class="card-body d-flex flex-column gap-2">';
        echo '<div class="gf-createfield-card-icon-wrap">';
        echo '<img class="gf-createfield-card-icon" src="' . esc_url($this->getFieldIconUrl($type)) . '" alt="" width="24" height="24" loading="lazy" decoding="async" />';
        echo '</div>';
        echo '<div class="card-title fw-semibold mb-0">' . esc_html($this->config->getFriendlyName($type)) . '</div>';
        echo '<p class="card-text small text-secondary mb-3">' . esc_html($this->lang->getText($type . 'description')) . '</p>';
        echo '</div>';
        echo '<div class="card-footer bg-transparent border-top-0 pt-0 px-3 pb-3">';
        $this->fieldTypeBtn($type);
        echo '</div>';
        echo '</div></div>';
        
    }
    
    protected function getFieldIconUrl(string $type): string
    {
        $type = sanitize_key($type);
        if ($type === '') {
            $type = 'text';
        }

        return $this->config->getRootUrl() . 'admin/images/field-icons/griffinforms_icon_' . $type . '.svg';
    }

    protected function fieldTypeBtn($type)
    {
        if ($this->data['context'] === 'builder') {
            echo '<button type="button" class="button button-primary griffinforms-modalaction-fieldtype" ';
            echo 'data-parent-id="0" data-fieldtype="' . esc_attr($type) . '" data-bs-toggle="modal" data-bs-target="#' . esc_attr($this->id) . '">';
            echo esc_html($this->lang->getText('add field'));
            echo '</button>';
        }
        
        if ($this->data['context'] === 'list') {
            $url = get_admin_url() . 'admin.php?page=griffinforms-field&field-type=' . $type . '&return=1';
            echo '<a href="' . esc_url($url) . '" class="button button-primary">';
            echo esc_html($this->lang->getText('add field'));
            echo '</a>';
        }
    }
    
    protected function modalFooter()
    {
        
    }
    
    public function modalJs()
    {
        ob_start();
        ?>
        jQuery(document).ready(function($) {
            var createFieldModal = document.getElementById("<?php echo esc_js($this->id); ?>");
            createFieldModal.addEventListener("show.bs.modal", function (event) {
                var targetButton, rowColumnId;
                targetButton = event.relatedTarget;
                rowColumnId = $(targetButton).attr("data-item-id");
                $(".griffinforms-modalaction-fieldtype").each(function() {
                    $(this).attr("data-parent-id", rowColumnId);
                });
            });
        });
        <?php
        $inline_js = ob_get_clean();
        
        wp_add_inline_script('griffinforms-global-js', $inline_js);
    }
}
