<?php
session_start();
include('../../../includes/config.php');

if (!isset($_SESSION['user_id']) || !isset($_GET['recipient_id'])) {
    http_response_code(403);
    echo "Unauthorized or missing recipient.";
    exit;
}

$sender_id = $_SESSION['user_id'];
$recipient_id = (int)$_GET['recipient_id'];

// Fetch recipient user info
$stmt = $conn->prepare("SELECT first_name, last_name FROM users WHERE id = ?");
$stmt->bind_param("i", $recipient_id);
$stmt->execute();
$recipient = $stmt->get_result()->fetch_assoc();
$stmt->close();

if (!$recipient) {
    echo "Recipient not found.";
    exit;
}

$recipient_name = htmlspecialchars($recipient['first_name'] . ' ' . $recipient['last_name'], ENT_QUOTES, 'UTF-8');
?>

<!-- Message Modal -->
<div id="messageModal" style="display:block;">
    <span class="close">&times;</span>
    <h3>Message <?= $recipient_name ?></h3>
    <form method="POST" id="sendMessageForm">
        <input type="hidden" name="recipient_id" value="<?= $recipient_id ?>" />
        <label for="subject">Subject</label>
        <input type="text" name="subject" id="subject" required />

        <label for="message">Message</label>
        <textarea name="message" id="message" required></textarea>

        <button type="submit">Send</button>
    </form>
    <div id="messageStatus" style="margin-top: 10px;"></div>
</div>

<script>
document.getElementById("sendMessageForm").addEventListener("submit", function(e) {
    e.preventDefault();
    const form = e.target;
    const formData = new FormData(form);

    fetch('../shared/messaging/send_message.php', {
        method: 'POST',
        body: formData
    })
    .then(res => res.json())
    .then(data => {
        const status = document.getElementById("messageStatus");
        if (data.success) {
            status.innerHTML = "<span style='color: green;'>Message sent successfully!</span>";
            form.reset();
        } else {
            status.innerHTML = "<span style='color: red;'>Error: " + data.message + "</span>";
        }
    })
    .catch(err => {
        document.getElementById("messageStatus").innerHTML = "<span style='color: red;'>An error occurred.</span>";
    });
});

// Close modal on close icon click
document.querySelector('.close').addEventListener('click', function() {
    document.getElementById('messageModal').style.display = 'none';
});
</script>

<style>
#messageModal {
    position: fixed;
    top: 10%;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(255, 255, 255, 0.95);
    border-radius: 15px;
    padding: 20px 30px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.4);
    z-index: 2000;
    width: 90%;
    max-width: 480px;
    color: #333;
}
#messageModal .close {
    float: right;
    cursor: pointer;
    font-weight: 700;
    font-size: 1.2rem;
    color: #666;
}
#messageModal form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 10px;
}
#messageModal input[type="text"],
#messageModal textarea {
    padding: 8px;
    font-size: 1rem;
    border-radius: 8px;
    border: 1px solid #ccc;
    width: 100%;
}
#messageModal textarea {
    min-height: 80px;
}
#messageModal button {
    background: #ff6f00;
    color: white;
    padding: 10px;
    border: none;
    border-radius: 25px;
    cursor: pointer;
    font-weight: 600;
}
#messageModal button:hover {
    background: #e65c00;
}
</style>
