<?php
/**
 * ITSWEBER CMS – Page Builder Admin Form: Testimonials
 * Loaded via AJAX into section cards.
 *
 * @author  Benny Weber
 * @copyright ITSWEBER, www.itsweber.de
 *
 * @var array $data    Decoded JSON content
 * @var array $section DB row (id, section_type, instance_label, ...)
 */

$sectionId   = (int) $section['id'];
$items       = (isset($data['items']) && is_array($data['items'])) ? $data['items'] : [];
$containerId = 'testimonials-container-' . $sectionId;
$addBtnId    = 'testimonials-add-' . $sectionId;
?>

<?php admin_field('text', 'title', __('admin.section.heading'), $data['title'] ?? '', [
    'placeholder' => 'z.B. Was Kunden sagen',
]) ?>

<?php admin_field('text', 'subtitle', __('admin.section.subtitle'), $data['subtitle'] ?? '', [
    'placeholder' => 'z.B. Stimmen unserer Partner',
]) ?>

<div class="form-group">
    <label class="form-label">Testimonials</label>
    <div class="section-items-sortable" id="<?= $containerId ?>">
        <?php foreach ($items as $idx => $item): ?>
        <?php admin_item_card_open($idx, 'Testimonial') ?>
            <div class="form-group full-width">
                <label class="form-label">Zitat *</label>
                <textarea name="testimonial_quote[]" class="form-control" rows="3" required><?= e($item['quote'] ?? '') ?></textarea>
            </div>
            <div class="form-group">
                <label class="form-label">Name</label>
                <input type="text" name="testimonial_author[]" class="form-control" value="<?= e($item['author'] ?? '') ?>" placeholder="z.B. Max Mustermann">
            </div>
            <div class="form-group">
                <label class="form-label">Rolle / Firma</label>
                <input type="text" name="testimonial_role[]" class="form-control" value="<?= e($item['role'] ?? '') ?>" placeholder="z.B. CEO, Firma GmbH">
            </div>
            <?php admin_media_picker('testimonial_avatar[]', $item['avatar'] ?? '', 'Avatar', 'image', '/uploads/...') ?>
            <div class="form-group">
                <label class="form-label">Bewertung (0-5 Sterne)</label>
                <select name="testimonial_rating[]" class="form-control">
                    <option value="0"<?= ($item['rating'] ?? 0) == 0 ? ' selected' : '' ?>>Keine</option>
                    <?php for ($s = 1; $s <= 5; $s++): ?>
                    <option value="<?= $s ?>"<?= ($item['rating'] ?? 0) == $s ? ' selected' : '' ?>><?= $s ?> Stern<?= $s > 1 ? 'e' : '' ?></option>
                    <?php endfor; ?>
                </select>
            </div>
        <?php admin_item_card_close() ?>
        <?php endforeach; ?>
    </div>
    <button type="button" class="btn btn-secondary btn-sm" id="<?= $addBtnId ?>" style="margin-top:var(--space-xs);"><?= __('admin.section.add_item') ?></button>
</div>

<script>
(function() {
    var c = document.getElementById('<?= $containerId ?>');
    if (!c) return;

    document.getElementById('<?= $addBtnId ?>').addEventListener('click', function() {
        var n = c.querySelectorAll('.admin-item-card').length;
        if (n >= 6) { alert('Maximal 6 Testimonials'); return; }
        var d = document.createElement('div');
        d.className = 'admin-item-card section-item-sortable';
        d.innerHTML =
            '<div class="admin-item-card-header">' +
                '<div class="item-move-buttons"><button type="button" class="btn btn-xs item-move-up">&#9650;</button><button type="button" class="btn btn-xs item-move-down">&#9660;</button></div>' +
                '<strong class="admin-item-card-label">#' + (n+1) + '</strong>' +
                '<button type="button" class="btn btn-xs btn-danger admin-item-remove">&#10005; <?= __('admin.section.remove_item') ?></button>' +
            '</div>' +
            '<div class="admin-item-card-body">' +
                '<div class="form-group full-width"><label class="form-label">Zitat *</label><textarea name="testimonial_quote[]" class="form-control" rows="3" required></textarea></div>' +
                '<div class="form-group"><label class="form-label">Name</label><input type="text" name="testimonial_author[]" class="form-control" placeholder="z.B. Max Mustermann"></div>' +
                '<div class="form-group"><label class="form-label">Rolle / Firma</label><input type="text" name="testimonial_role[]" class="form-control" placeholder="z.B. CEO, Firma GmbH"></div>' +
                '<div class="form-group"><label class="form-label">Avatar</label><div class="section-media-field-wrap" data-type="image"><input type="text" name="testimonial_avatar[]" class="form-control section-media-input" placeholder="/uploads/..."><button type="button" class="btn btn-secondary btn-sm section-media-browse" data-media-type="image"><?= __('admin.media.choose') ?></button><button type="button" class="btn btn-xs section-media-remove" title="<?= __('admin.media.choose') ?>">&times;</button><div class="section-media-preview" style="display:none;"><img src="" alt="" loading="lazy"></div></div></div>' +
                '<div class="form-group"><label class="form-label">Bewertung</label><select name="testimonial_rating[]" class="form-control"><option value="0">Keine</option><option value="1">1 Stern</option><option value="2">2 Sterne</option><option value="3">3 Sterne</option><option value="4">4 Sterne</option><option value="5">5 Sterne</option></select></div>' +
            '</div>';
        c.appendChild(d);
        a(d);
        if (window.initSectionMediaFields) window.initSectionMediaFields(d);
    });

    c.querySelectorAll('.admin-item-card').forEach(a);

    function a(item) {
        var u=item.querySelector('.item-move-up'),d=item.querySelector('.item-move-down'),r=item.querySelector('.admin-item-remove');
        if(u)u.addEventListener('click',function(e){e.preventDefault();var p=item.previousElementSibling;if(p&&p.classList.contains('admin-item-card'))c.insertBefore(item,p);});
        if(d)d.addEventListener('click',function(e){e.preventDefault();var n=item.nextElementSibling;if(n&&n.classList.contains('admin-item-card'))c.insertBefore(n,item);});
        if(r)r.addEventListener('click',function(e){e.preventDefault();item.remove();});
    }
})();
</script>

<?php admin_section_separator() ?>

<?php admin_field_grid_open(3) ?>
    <?php admin_color_scheme_field($data['color_scheme'] ?? '') ?>
    <?php render_section_text_color_field($data) ?>
    <?php admin_field('select', 'columns', __('admin.section.columns'), $data['columns'] ?? '2', [
        'options' => ['1' => '1 Spalte', '2' => __('admin.section.columns_2'), '3' => __('admin.section.columns_3')],
        'wrap_style' => 'margin:0;',
    ]) ?>
<?php admin_field_grid_close() ?>

<?php admin_field('select', 'layout', 'Layout', $data['layout'] ?? 'staggered', [
    'options' => ['staggered' => 'Versetzt (Staggered)', 'grid' => 'Gleichmaessig (Grid)', 'single' => 'Einzeln (Slider-artig)'],
]) ?>
