<?php

namespace GriffinForms\Admin\Html\FormControls\Field\FieldSettings;

class SignatureSettings extends \GriffinForms\Admin\Html\FormControls\Field\FieldSettings\Format
{
    public function html()
    {
        $s = is_array($this->value) ? $this->value : [];

        $pad_height      = isset($s['pad_height'])            ? (int) $s['pad_height']       : 200;
        $pen_color       = isset($s['pen_color'])             ? $s['pen_color']              : '#000000';
        $pen_thickness   = isset($s['pen_thickness'])         ? (int) $s['pen_thickness']    : 2;
        $bg_color        = isset($s['bg_color'])              ? $s['bg_color']               : '#ffffff';
        $sig_placeholder = isset($s['signature_placeholder']) ? $s['signature_placeholder']  : '';

        $pad_height_field = new \GriffinForms\Admin\Html\FormControls\InputNumber('pad_height', $pad_height);
        $pad_height_field->setAttr('min', 50);
        $pad_height_field->setAttr('max', 600);

        $pen_thickness_field = new \GriffinForms\Admin\Html\FormControls\InputNumber('pen_thickness', $pen_thickness);
        $pen_thickness_field->setAttr('min', 1);
        $pen_thickness_field->setAttr('max', 10);

        $sig_placeholder_field = new \GriffinForms\Admin\Html\FormControls\InputText('signature_placeholder', $sig_placeholder);
        ?>
        <div class="row g-3">

            <div class="col-md-6">
                <div class="d-flex align-items-center gap-2">
                    <label class="text-nowrap mb-0"><?php echo esc_html($this->lang->getText('pad_height', 'label')); ?></label>
                    <div style="width:90px"><?php $pad_height_field->html(); ?></div>
                    <span class="text-muted small">px</span>
                </div>
            </div>

            <div class="col-md-6">
                <div class="d-flex align-items-center gap-2">
                    <label class="text-nowrap mb-0"><?php echo esc_html($this->lang->getText('pen_color', 'label')); ?></label>
                    <input type="color" name="pen_color" id="griffinforms-pencolor-inputcolor"
                        class="griffinforms-pencolor griffinforms-field griffinforms-formcontrol"
                        style="width:36px;height:28px;padding:2px;border-radius:4px;cursor:pointer"
                        value="<?php echo esc_attr($pen_color); ?>">
                </div>
            </div>

            <div class="col-md-6">
                <div class="d-flex align-items-center gap-2">
                    <label class="text-nowrap mb-0"><?php echo esc_html($this->lang->getText('pen_thickness', 'label')); ?></label>
                    <div style="width:70px"><?php $pen_thickness_field->html(); ?></div>
                    <span class="text-muted small">px</span>
                </div>
            </div>

            <div class="col-md-6">
                <div class="d-flex align-items-center gap-2">
                    <label class="text-nowrap mb-0"><?php echo esc_html($this->lang->getText('bg_color', 'label')); ?></label>
                    <input type="color" name="bg_color" id="griffinforms-bgcolor-inputcolor"
                        class="griffinforms-bgcolor griffinforms-field griffinforms-formcontrol"
                        style="width:36px;height:28px;padding:2px;border-radius:4px;cursor:pointer"
                        value="<?php echo esc_attr($bg_color); ?>">
                </div>
            </div>

            <div class="col-md-6">
                <div class="d-flex align-items-center gap-2">
                    <label class="text-nowrap mb-0"><?php echo esc_html($this->lang->getText('signature_placeholder', 'label')); ?></label>
                    <div class="flex-grow-1" style="min-width:0"><?php $sig_placeholder_field->html(); ?></div>
                </div>
            </div>

        </div>
        <?php
    }
}
