<?php
declare(strict_types=1);

include_once 'concha.php';

function chat_e(?string $valor): string
{
    return htmlspecialchars((string)$valor, ENT_QUOTES | ENT_SUBSTITUTE, 'UTF-8');
}

if (!isset($conn) || !($conn instanceof mysqli)) {
    $conn = @new mysqli((string)$host, (string)$usuario, (string)$contra, (string)$basedatos);
    if ($conn->connect_error) {
        die('Error de conexión a la base de datos.');
    }
}

$conn->set_charset('utf8mb4');

$mostrar = isset($_GET['mostrar']) ? (int)$_GET['mostrar'] : 20;
if ($mostrar < 20) {
    $mostrar = 20;
}
if ($mostrar > 200) {
    $mostrar = 200;
}

$totalMensajes = 0;
$sqlTotal = "SELECT COUNT(*) AS total FROM chat WHERE ver = 'si' AND IDM = 0";
$resTotal = $conn->query($sqlTotal);
if ($resTotal instanceof mysqli_result) {
    $filaTotal = $resTotal->fetch_assoc();
    $totalMensajes = isset($filaTotal['total']) ? (int)$filaTotal['total'] : 0;
    $resTotal->free();
}

$mensajes = [];

$stmt = $conn->prepare("
    SELECT ID, nombre, mensaje, fecha
    FROM chat
    WHERE ver = 'si' AND IDM = 0
    ORDER BY fecha DESC, ID DESC
    LIMIT ?
");

if ($stmt) {
    $stmt->bind_param('i', $mostrar);
    $stmt->execute();
    $res = $stmt->get_result();

    while ($row = $res->fetch_assoc()) {
        $mensajes[] = $row;
    }

    $stmt->close();
}

$siguiente = $mostrar + 20;
?>
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Chat</title>
<style>
html, body{
    margin:0;
    padding:0;
    background:#fff;
    font-family:Arial, Helvetica, sans-serif;
    color:#222;
}
body{
    padding:8px;
}
.chat-item{
    border-bottom:1px solid #ececec;
    padding:8px 0;
}
.chat-item:last-child{
    border-bottom:none;
}
.chat-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:8px;
    margin-bottom:4px;
}
.chat-nombre{
    font-size:12px;
    font-weight:bold;
    color:#111;
    line-height:1.2;
}
.chat-fecha{
    font-size:10px;
    color:#888;
    white-space:nowrap;
    text-align:right;
}
.chat-mensaje{
    font-size:12px;
    line-height:1.4;
    color:#333;
    margin:0;
    word-break:break-word;
    white-space:pre-wrap;
}
.reply-list{
    margin-top:6px;
    margin-left:10px;
    padding-left:8px;
    border-left:2px solid #e8e8e8;
}
.reply-item{
    background:#fafafa;
    border:1px solid #ededed;
    padding:6px;
    margin-bottom:5px;
}
.reply-item:last-child{
    margin-bottom:0;
}
.reply-nombre{
    font-size:11px;
    font-weight:bold;
    margin:0 0 2px 0;
}
.reply-fecha{
    font-size:9px;
    color:#888;
    margin-bottom:3px;
}
.reply-mensaje{
    font-size:11px;
    margin:0;
    white-space:pre-wrap;
    word-break:break-word;
    line-height:1.35;
}
.no-mensajes{
    font-size:12px;
    color:#666;
    padding:8px 0;
}
.more-box{
    text-align:center;
    padding-top:10px;
}
.more-btn{
    display:inline-block;
    padding:6px 10px;
    border:1px solid #0d6efd;
    background:#fff;
    color:#0d6efd;
    text-decoration:none;
    font-size:11px;
    font-weight:bold;
}
.more-btn:hover{
    background:#0d6efd;
    color:#fff;
}
</style>
</head>
<body>

<?php if (empty($mensajes)) : ?>
    <div class="no-mensajes">Todavía no hay mensajes publicados.</div>
<?php else : ?>

    <?php foreach ($mensajes as $row) : ?>
        <?php
        $idMensaje = (int)$row['ID'];
        $respuestas = [];

        $stmtResp = $conn->prepare("
            SELECT nombre, mensaje, fecha
            FROM chat
            WHERE ver = 'si' AND IDM = ?
            ORDER BY fecha ASC, ID ASC
        ");

        if ($stmtResp) {
            $stmtResp->bind_param('i', $idMensaje);
            $stmtResp->execute();
            $resResp = $stmtResp->get_result();

            while ($filaResp = $resResp->fetch_assoc()) {
                $respuestas[] = $filaResp;
            }

            $stmtResp->close();
        }
        ?>

        <div class="chat-item">
            <div class="chat-head">
                <div class="chat-nombre"><?php echo chat_e((string)$row['nombre']); ?></div>
                <div class="chat-fecha"><?php echo chat_e((string)$row['fecha']); ?></div>
            </div>

            <p class="chat-mensaje"><?php echo nl2br(chat_e((string)$row['mensaje'])); ?></p>

            <?php if (!empty($respuestas)) : ?>
                <div class="reply-list">
                    <?php foreach ($respuestas as $resp) : ?>
                        <div class="reply-item">
                            <p class="reply-nombre"><?php echo chat_e((string)$resp['nombre']); ?></p>
                            <div class="reply-fecha"><?php echo chat_e((string)$resp['fecha']); ?></div>
                            <p class="reply-mensaje"><?php echo nl2br(chat_e((string)$resp['mensaje'])); ?></p>
                        </div>
                    <?php endforeach; ?>
                </div>
            <?php endif; ?>
        </div>
    <?php endforeach; ?>

<?php endif; ?>

<?php if ($totalMensajes > $mostrar) : ?>
    <div class="more-box">
        <a class="more-btn" href="chat.php?mostrar=<?php echo (int)$siguiente; ?>">Cargar más</a>
    </div>
<?php endif; ?>

</body>
</html>