<?php
/*session_start();
if (!isset($_SESSION["admin"])) {
    header("Location: login.html");
    exit;
}*/

date_default_timezone_set("Europe/Madrid");

$carpetaVideo = $_SERVER['DOCUMENT_ROOT'] . "/assets/cstvideo/";
$carpetaImage = $_SERVER['DOCUMENT_ROOT'] . "/assets/cstimage/";

if ($_SERVER["REQUEST_METHOD"] === "POST") {
    $archivo = trim($_POST["archivo"]); // nombre completo de la imagen sin extensión

    // Imagen: jpg o png
    $imagenJpg = "$carpetaImage/$archivo.jpg";
    $imagenPng = "$carpetaImage/$archivo.png";
    $borradoImg = false;

    if (file_exists($imagenJpg)) {
        unlink($imagenJpg);
        $borradoImg = true;
    } elseif (file_exists($imagenPng)) {
        unlink($imagenPng);
        $borradoImg = true;
    }

    // Video: solo las 7 primeras posiciones del nombre de la imagen
    $videoBase = substr($archivo, 0, 7); // 7 primeros caracteres
    $video = "$carpetaVideo/$videoBase.mp4";
    $borradoVid = false;

    if (file_exists($video)) {
        unlink($video);
        $borradoVid = true;
    }

    // Eliminar entrada de los JSON del catálogo
    $jsonFiles = [
        __DIR__ . "/catalogo.json",
        __DIR__ . "/catalogoservidor.json"
    ];
    $codigoBase = substr($archivo, 0, 7); // ej. "984_a01"

    foreach ($jsonFiles as $jsonPath) {
        if (file_exists($jsonPath)) {
            $data = json_decode(file_get_contents($jsonPath), true);
            if (is_array($data)) {
                $data = array_values(array_filter($data, function($item) use ($archivo, $codigoBase) {
                    // elimina si el campo imagen coincide con el archivo (con .jpg o .png)
                    // o si el codigo coincide con los 7 primeros caracteres
                    $imgMatch = isset($item['imagen']) && (
                        $item['imagen'] === $archivo . '.jpg' ||
                        $item['imagen'] === $archivo . '.png' ||
                        $item['imagen'] === $archivo
                    );
                    $codeMatch = isset($item['codigo']) && $item['codigo'] === $codigoBase;
                    return !$imgMatch && !$codeMatch;
                }));
                file_put_contents($jsonPath, json_encode($data, JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE));
            }
        }
    }

    echo "✅ Resultado: ";
    echo $borradoImg ? "Imagen borrada " : "Imagen no encontrada ";
    echo $borradoVid ? "Video borrado " : "Video no encontrado ";
    echo "Catálogo actualizado. ";
    echo "<a href='media.php'> Volver </a>";
    exit;
}

// --- Lista de imágenes ---
$imagenes = array_merge(
    glob($carpetaImage . "*.jpg"),
    glob($carpetaImage . "*.png")
);

$opciones = [];
foreach ($imagenes as $img) {
    $nombreArchivo = basename($img);
    $nombreBase = preg_replace('/\.(jpg|png)$/i', '', $nombreArchivo);
    $opciones[$nombreBase] = $nombreArchivo;
}
?>

<!DOCTYPE html>
<html lang="ES">
<title>media</title>

<head>
    <meta charset="UTF-8">
    <meta name="description" content="Autor: Jose Manuel Abecia Buil">
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0, viewport-fit=cover, maximum-scale=1.0, user-scalable=no">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">


    <link rel="shortcut icon" type="image/x-icon" href="../favicon.ico">
    <!--<script language="javascript" type="text/javascript" src="./js/indexpdf.js"></script>-->

    <link rel="stylesheet" href="../css/styleNew.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
    <script src="../js/scriptNew.js"></script>


    <style>
        #preview {
          margin-top: 15px;
          max-width: 300px;
          border: 1px solid #ccc;
          padding: 5px;
          display: none;
        }
        
        .center {
            display: block;
            margin-left: auto;
            margin-right: auto;
            width: 100%;
        }

        .formLogs {
            padding: 20px;
            overflow: auto;
            display: flex;
            flex-direction: column;
            width: 100%;
            border: 0px solid gainsboro;
            justify-content: left;
            align-items: left;
            height: 80vh;
            margin: 2;
            font-family: Arial, sans-serif;
            background-color: white;
        }
    </style>
</head>

<body>
    <header class="header" id="idHeader">
        <ul>
            <button class="menu-button2">
                <img src="../iconos/64_pefirhor.png" alt="PEFiR">
            </button>
            <li class="menu-item"></li>
            <button class="menu-button3">
                <i class="fas fa-right-to-bracket fa-lg" onclick="window.open('../app/home.html', '_self');"></i>
            </button>
        </ul>

    </header>

    <footer class="footer">
        <ul>
            <!--<li><a href="#" class="fas fa-table-cells fa-lg" onclick="creaExcel()"></a>
            </li>

            <li id="deleteId" style="display: none;"><a href="#" class="fas fa-eraser fa-lg"
                    onclick="deleteRecord()"></a>
            </li>
            <li id="cleanId" style="display: none;"><a href="#" class="fas fa-trash-can fa-lg"
                    onclick="cleanLogsButtonAllia()"></a>
            </li>-->

        </ul>
    </footer>

    <div class="formLogs">
      <form method="post" onsubmit="return confirmarBorrado()">
          <label for="archivo">Selecciona imagen:</label>
          <select name="archivo" id="archivo" required onchange="mostrarPreview(this)">
            <option value="">-- Selecciona un recurso --</option>
            <?php foreach ($opciones as $base => $mostrar): ?>
              <option value="<?= htmlspecialchars($base) ?>"
                      data-file="<?= htmlspecialchars($mostrar) ?>">
                <?= htmlspecialchars($mostrar) ?>
              </option>
            <?php endforeach; ?>
          </select>
          <br><br>
          <img id="preview" src="" alt="Vista previa">
          <br><br>
          <button type="submit">🗑️ Borrar imagen y video</button>
        </form>
    </div>

    <!-- Icono de ayuda -->
    <div class="help-icon" id="helpButton">?</div>

    <div class="tooltip" id="helpTooltip">
        <!-- Imagen del icono y texto -->
        <p><span class="icon"><i class="fas fa-right-to-bracket fa-lg"></i></span> Navega hacia atrás</p>
    </div>

    <script>

        function mostrarPreview(sel) {
          const opt = sel.options[sel.selectedIndex];
          const file = opt.getAttribute("data-file");
          const preview = document.getElementById("preview");
          if (file) {
            preview.src = "/assets/cstimage/" + file;
            preview.style.display = "block";
          } else {
            preview.style.display = "none";
          }
        }

        function confirmarBorrado() {
          const sel = document.getElementById("archivo");
          const opt = sel.options[sel.selectedIndex];
          const file = opt.getAttribute("data-file");

          return confirm("⚠️ Se borrará la imagen '" + file + 
                        "' y su video asociado.\n\n¿Seguro que deseas continuar?");
        }
        // Función para mostrar y ocultar el tooltip
        document.getElementById("helpButton").addEventListener("click", function () {
            let tooltip = document.getElementById("helpTooltip");
            tooltip.style.display = (tooltip.style.display === "block") ? "none" : "block";
        });

        // Cierra el tooltip si se hace clic fuera de él
        document.addEventListener("click", function (event) {
            let tooltip = document.getElementById("helpTooltip");
            let helpButton = document.getElementById("helpButton");
            if (!helpButton.contains(event.target) && !tooltip.contains(event.target)) {
                tooltip.style.display = "none";
            }
        });
    </script>
</body>

</html>

