<?php
echo "<!-- inc.sliderlist.php -->\n";
/**
 * Lista degli Slider
 * Mostra tutte le gallery di tipo '2' (slider)
 */

if(!isset($azione)) $azione = '';
if(!isset($id_gallery)) $id_gallery = 0;
if(!isset($ord)) $ord = '';

// Se è stato selezionato uno slider, vai all'editor
if($id_gallery > 0) {
    // Passa il controllo all'editor slider
    include "inc.editslider.php";
    return;
}

// Azioni su slider
if($azione == 'elimina_slider' && isset($_POST['id'])) {
    $id = (int)$_POST['id'];
    $sql = "DELETE FROM t_gallery WHERE id=$id AND tipo='2'";
    $mydb->DoQuery($sql);
    
    // Elimina anche le immagini associate
    $sql = "DELETE FROM t_img_gallery WHERE id_gal=$id";
    $mydb->DoQuery($sql);
    
    $azione = '';
}

if($azione == 'salva_slider') {
    $id = isset($_POST['id']) ? (int)$_POST['id'] : 0;
    $titolo = isset($_POST['titolo']) ? trim($_POST['titolo']) : '';
    $visibile = isset($_POST['visibile']) ? $_POST['visibile'] : '1';
    $ordine = isset($_POST['ordine']) ? (int)$_POST['ordine'] : 1;
    
    if($id > 0) {
        // UPDATE
        $sql = "UPDATE t_gallery SET 
                titolo = " . $mydb->Escape($titolo) . ",
                visibile = '$visibile',
                ordine = $ordine
                WHERE id = $id AND tipo='2'";
        $mydb->DoQuery($sql);
    } else {
        // INSERT
        $sql = "INSERT INTO t_gallery (titolo, visibile, ordine, tipo) 
                VALUES (" . $mydb->Escape($titolo) . ", '$visibile', $ordine, '2')";
        $mydb->DoQuery($sql);
        $id_gallery = $mydb->GetLastId();
    }
    
    $azione = '';
}

// Carica lista slider
$sql = "SELECT * FROM t_gallery WHERE tipo='2' ORDER BY ordine ASC, titolo ASC";
$aSliders = $mydb->DoSelect($sql);

?>

<div style="margin-bottom:20px;">
    <h2>Gestione Slider</h2>
    <p>Gli slider sono utilizzati per mostrare immagini rotanti nelle diverse sezioni del sito.</p>
</div>

<form name="frmSliderList" method="post" action="<?=$action?>">
    <input type="hidden" name="MSID" value="<?=$MSID?>" />
    <input type="hidden" name="sezione" value="<?=$sezione?>" />
    <input type="hidden" name="tab" value="<?=$tab?>" />
    <input type="hidden" name="tab2" value="<?=$tab2 ?? ''?>" />
    
    <input type="hidden" name="azione" value="" />
    <input type="hidden" name="id" value="" />
    <input type="hidden" name="id_gallery" value="0" />

<div style="margin-bottom:15px;">
    <button type="button" onclick="nuovoSlider()" class="btn btn-primary">
        + Crea Nuovo Slider
    </button>
</div>

<div class="labels-table-container">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="labels-table">
    <thead>
    <tr>
        <th width="40%">Titolo Slider</th>
        <th width="15%">N° Slide</th>
        <th width="10%">Visibile</th>
        <th width="35%">Azioni</th>
    </tr>
    </thead>
    <tbody>

<?php
if(count($aSliders) == 0) {
    echo '<tr><td colspan="4" align="center" style="padding:40px;">📸 Nessuno slider presente. Clicca su "Crea Nuovo Slider" per iniziare.</td></tr>';
}

foreach($aSliders as $slider) {
    $id_slider = $slider['id'];
    $titolo = htmlspecialchars($slider['titolo']);
    $visibile = $slider['visibile'];
    $ordine = $slider['ordine'];
    
    // Conta le slide di questo slider
    $sql = "SELECT COUNT(*) as n FROM t_img_gallery WHERE id_gal=$id_slider";
    $mydb->DoSelect($sql);
    $rtmp = $mydb->GetRow();
    $n_slides = $rtmp['n'];
?>
    <tr class="slider-row">
        <td class="slider-title"><strong><?=$titolo?></strong></td>
        <td class="slider-count"><?=$n_slides?> slide</td>
        <td class="slider-visible">
            <span style="color:<?=($visibile=='1')?'#28a745':'#dc3545'?>; font-weight:500;">
                <?=($visibile=='1')?'✓ Sì':'✗ No'?>
            </span>
        </td>
        <td class="slider-actions">
            <button type="button" class="btn-translate" onclick="modificaSlider(<?=$id_slider?>); return false;" title="Modifica slider">
                <svg class="btn-icon" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M4.5 11H5.914L12.5 4.414L11.086 3L4.5 9.586V11ZM13.207 3.707L12.293 2.793C11.902 2.402 11.269 2.402 10.878 2.793L10.086 3.586L11.5 5L12.293 4.207C12.684 3.816 12.684 3.183 12.293 2.793L13.207 3.707Z" fill="currentColor"/>
                    <path d="M2 13.5C2 13.776 2.224 14 2.5 14H13.5C13.776 14 14 13.776 14 13.5V7.5C14 7.224 13.776 7 13.5 7H11V8H13V13H3V8H5V7H2.5C2.224 7 2 7.224 2 7.5V13.5Z" fill="currentColor"/>
                </svg>
                <span class="translate-text">Modifica</span>
            </button>
            <button type="button" class="btn-translate" onclick="apriEditor(<?=$id_slider?>); return false;" title="Gestisci slide" style="background:#f8f9fa; color:#333; border-color:#dee2e6; font-weight:600;">
                <svg class="btn-icon" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M1.5 2.5C1.22386 2.5 1 2.72386 1 3V13C1 13.2761 1.22386 13.5 1.5 13.5H14.5C14.7761 13.5 15 13.2761 15 13V3C15 2.72386 14.7761 2.5 14.5 2.5H1.5ZM2 12.5V3.5H14V12.5H2Z" fill="currentColor"/>
                    <path d="M5.5 5.5C5.22386 5.5 5 5.72386 5 6V10C5 10.2761 5.22386 10.5 5.5 10.5C5.77614 10.5 6 10.2761 6 10V6C6 5.72386 5.77614 5.5 5.5 5.5Z" fill="currentColor"/>
                    <path d="M8 5.5C7.72386 5.5 7.5 5.72386 7.5 6V10C7.5 10.2761 7.72386 10.5 8 10.5C8.27614 10.5 8.5 10.2761 8.5 10V6C8.5 5.72386 8.27614 5.5 8 5.5Z" fill="currentColor"/>
                    <path d="M10.5 5.5C10.2239 5.5 10 5.72386 10 6V10C10 10.2761 10.2239 10.5 10.5 10.5C10.7761 10.5 11 10.2761 11 10V6C11 5.72386 10.7761 5.5 10.5 5.5Z" fill="currentColor"/>
                </svg>
                <span class="translate-text">Gestisci Slide</span>
            </button>
            <? if($_level >$OPERLEVEL) { ?>
            <button type="button" class="btn-delete" onclick="if(confirm('Sei sicuro di voler eliminare questo slider e tutte le sue slide?')){ eliminaSlider(<?=$id_slider?>); } return false;" title="Elimina slider">
                <svg class="btn-icon" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M5.5 5.5C5.77614 5.5 6 5.72386 6 6V12C6 12.2761 5.77614 12.5 5.5 12.5C5.22386 12.5 5 12.2761 5 12V6C5 5.72386 5.22386 5.5 5.5 5.5Z" fill="currentColor"/>
                    <path d="M8 5.5C8.27614 5.5 8.5 5.72386 8.5 6V12C8.5 12.2761 8.27614 12.5 8 12.5C7.72386 12.5 7.5 12.2761 7.5 12V6C7.5 5.72386 7.72386 5.5 8 5.5Z" fill="currentColor"/>
                    <path d="M11 6C11 5.72386 10.7761 5.5 10.5 5.5C10.2239 5.5 10 5.72386 10 6V12C10 12.2761 10.2239 12.5 10.5 12.5C10.7761 12.5 11 12.2761 11 12V6Z" fill="currentColor"/>
                    <path fill-rule="evenodd" clip-rule="evenodd" d="M14.5 3C14.5 3.27614 14.2761 3.5 14 3.5H13.5V13.5C13.5 14.0523 13.0523 14.5 12.5 14.5H3.5C2.94772 14.5 2.5 14.0523 2.5 13.5V3.5H2C1.72386 3.5 1.5 3.27614 1.5 3C1.5 2.72386 1.72386 2.5 2 2.5H5.5V1.5C5.5 0.947715 5.94772 0.5 6.5 0.5H9.5C10.0523 0.5 10.5 0.947715 10.5 1.5V2.5H14C14.2761 2.5 14.5 2.72386 14.5 3ZM6.5 2.5V1.5H9.5V2.5H6.5ZM3.5 3.5V13.5H12.5V3.5H3.5Z" fill="currentColor"/>
                </svg>
                <span class="delete-text">Elimina</span>
            </button>
            <? } ?>
        </td>
    </tr>
<?php
}
?>
    </tbody>
</table>
</div>

</form>

<!-- Modale per creazione/modifica slider -->
<div id="modalSlider" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:9999;">
    <div style="position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:white; padding:30px; border-radius:8px; min-width:500px;">
        <h3 id="modalTitle">Nuovo Slider</h3>
        <form name="frmModalSlider" method="post" action="<?=$action?>">
            <input type="hidden" name="MSID" value="<?=$MSID?>" />
            <input type="hidden" name="sezione" value="<?=$sezione?>" />
            <input type="hidden" name="tab" value="<?=$tab?>" />
            <input type="hidden" name="tab2" value="<?=$tab2 ?? ''?>" />
            <input type="hidden" name="ord" value="<?=$ord ?? ''?>" />
            <input type="hidden" name="azione" value="salva_slider" />
            <input type="hidden" name="id" id="modal_id" value="0" />
            
            <table width="100%" cellpadding="5">
                <tr>
                    <td width="30%">Titolo Slider:</td>
                    <td><input type="text" name="titolo" id="modal_titolo" style="width:100%;" required /></td>
                </tr>
                <?/*
                <tr>
                    <td>Ordine:</td>
                    <td><input type="number" name="ordine" id="modal_ordine" value="1" min="1" style="width:80px;" /></td>
                </tr>
                */ ?>
                <tr>
                    <td>Visibile:</td>
                    <td>
                        <label><input type="radio" name="visibile" value="1" checked /> Sì</label>
                        &nbsp;&nbsp;
                        <label><input type="radio" name="visibile" value="0" /> No</label>
                    </td>
                </tr>
                <tr>
                    <td colspan="2" align="center" style="padding-top:20px;">
                        <button type="submit" class="btn btn-primary">Salva</button>
                        &nbsp;&nbsp;
                        <button type="button" onclick="chiudiModal()" class="btn btn-secondary">Annulla</button>
                    </td>
                </tr>
            </table>
        </form>
    </div>
</div>

<script>
function apriEditor(id_gallery) {
    document.frmSliderList.id_gallery.value = id_gallery;
    document.frmSliderList.submit();
}

function nuovoSlider() {
    document.getElementById('modalTitle').textContent = 'Nuovo Slider';
    document.getElementById('modal_id').value = '0';
    document.getElementById('modal_titolo').value = '';
    //document.getElementById('modal_ordine').value = '1';
    document.getElementById('modalSlider').style.display = 'block';
}

function modificaSlider(id) {
    // In un'implementazione completa, qui dovresti caricare i dati via AJAX
    // Per ora apriamo il modale vuoto
    document.getElementById('modalTitle').textContent = 'Modifica Slider';
    document.getElementById('modal_id').value = id;
    document.getElementById('modalSlider').style.display = 'block';
    
    // TODO: Caricare dati esistenti via AJAX
    ajaxSrv("load_slider_data", 'id_gallery=' + id,'load_slider_data_DONE(res)','');
}

function load_slider_data_DONE(res) {
    console.log(res);
    var data = JSON.parse(res);
    if(data.error) {
        alert(data.error);
    } else {
        document.getElementById('modal_titolo').value = data.titolo;
        //document.getElementById('modal_ordine').value = data.ordine;
        var visibile_radios = document.getElementsByName('visibile');
        for(var i=0; i<visibile_radios.length; i++) {
            if(visibile_radios[i].value == data.visibile) {
                visibile_radios[i].checked = true;
            }
        }
    }
}

function eliminaSlider(id) {
    document.frmSliderList.azione.value = 'elimina_slider';
    document.frmSliderList.id.value = id;
    document.frmSliderList.submit();
}

function chiudiModal() {
    document.getElementById('modalSlider').style.display = 'none';
}
</script>
