<?php
include("../session.php");
if ($role != 'group') {
    header("Location: ../index.php");
    exit;
}

include("../db.php");

if (!isset($_GET['subject_id'])) {
    echo "กรุณาระบุ subject_id"; exit;
}

$subject_id = intval($_GET['subject_id']);
$user_id = $_SESSION['user_id'];

// ตรวจสอบว่าวิชานี้เป็นของกลุ่มนี้จริงไหม
$res = mysqli_query($conn, "SELECT id FROM subjects WHERE id = $subject_id AND group_id = $user_id");
if (mysqli_num_rows($res) == 0) {
    echo "คุณไม่มีสิทธิ์ในวิชานี้"; exit;
}

$question = $choice1 = $choice2 = $choice3 = $choice4 = $correct_choice = "";
$question_image = $choice1_image = $choice2_image = $choice3_image = $choice4_image = "";
$score = 1;
$is_edit = false;
$error = "";

if (isset($_GET['id'])) {
    $is_edit = true;
    $id = intval($_GET['id']);
    $res = mysqli_query($conn, "SELECT * FROM questions WHERE id = $id AND subject_id = $subject_id");
    if ($row = mysqli_fetch_assoc($res)) {
        $question = $row['question'];
        $question_image = $row['question_image'];
        $choice1 = $row['choice1'];
        $choice1_image = $row['choice1_image'];
        $choice2 = $row['choice2'];
        $choice2_image = $row['choice2_image'];
        $choice3 = $row['choice3'];
        $choice3_image = $row['choice3_image'];
        $choice4 = $row['choice4'];
        $choice4_image = $row['choice4_image'];
        $correct_choice = $row['correct_choice'];
        $score = $row['score'];
    } else {
        echo "ไม่พบคำถาม"; exit;
    }
}

// สร้างโฟลเดอร์สำหรับเก็บรูปภาพถ้ายังไม่มี
$upload_dir = '../Uploads/';
if (!is_dir($upload_dir)) {
    mkdir($upload_dir, 0777, true);
}

if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $question = trim($_POST['question']);
    $choice1 = trim($_POST['choice1']);
    $choice2 = trim($_POST['choice2']);
    $choice3 = trim($_POST['choice3']);
    $choice4 = trim($_POST['choice4']);
    $correct_choice = $_POST['correct_choice'];
    $score = intval($_POST['score']);

    // ตรวจสอบว่าคำถามมีข้อความหรือรูปภาพ
    if (empty($question) && empty($_FILES['question_image']['name']) && !$is_edit) {
        $error = "กรุณาระบุคำถาม (ข้อความหรือรูปภาพ)";
    }
    // ตรวจสอบตัวเลือก 1 และ 2
    if (empty($choice1) && empty($_FILES['choice1_image']['name']) && !$is_edit) {
        $error = "กรุณาระบุตัวเลือก 1 (ข้อความหรือรูปภาพ)";
    }
    if (empty($choice2) && empty($_FILES['choice2_image']['name']) && !$is_edit) {
        $error = "กรุณาระบุตัวเลือก 2 (ข้อความหรือรูปภาพ)";
    }
    // ตรวจสอบว่ามีตัวเลือกที่ถูกต้อง
    if (empty($correct_choice)) {
        $error = "กรุณาเลือกคำตอบที่ถูกต้อง";
    }

    if (empty($error)) {
        // ฟังก์ชันอัปโหลดไฟล์
        function upload_file($file, $upload_dir, $prefix) {
            if ($file['name'] != '') {
                $ext = pathinfo($file['name'], PATHINFO_EXTENSION);
                $filename = $prefix . '_' . time() . '.' . $ext;
                $destination = $upload_dir . $filename;
                if (move_uploaded_file($file['tmp_name'], $destination)) {
                    return $filename;
                }
            }
            return null;
        }

        // อัปโหลดรูปภาพ
        $question_image = upload_file($_FILES['question_image'], $upload_dir, 'question');
        $choice1_image = upload_file($_FILES['choice1_image'], $upload_dir, 'choice1');
        $choice2_image = upload_file($_FILES['choice2_image'], $upload_dir, 'choice2');
        $choice3_image = upload_file($_FILES['choice3_image'], $upload_dir, 'choice3');
        $choice4_image = upload_file($_FILES['choice4_image'], $upload_dir, 'choice4');

        // เตรียมคำสั่ง SQL
        if ($is_edit) {
            $sql = "UPDATE questions SET 
                    question='$question', 
                    question_image=" . ($question_image ? "'$question_image'" : "'$question_image'") . ",
                    choice1='$choice1', 
                    choice1_image=" . ($choice1_image ? "'$choice1_image'" : "'$choice1_image'") . ",
                    choice2='$choice2', 
                    choice2_image=" . ($choice2_image ? "'$choice2_image'" : "'$choice2_image'") . ",
                    choice3='$choice3', 
                    choice3_image=" . ($choice3_image ? "'$choice3_image'" : "'$choice3_image'") . ",
                    choice4='$choice4', 
                    choice4_image=" . ($choice4_image ? "'$choice4_image'" : "'$choice4_image'") . ",
                    correct_choice='$correct_choice', 
                    score=$score
                    WHERE id=$id AND subject_id=$subject_id";
        } else {
            $sql = "INSERT INTO questions 
                    (subject_id, question, question_image, choice1, choice1_image, choice2, choice2_image, 
                    choice3, choice3_image, choice4, choice4_image, correct_choice, score)
                    VALUES 
                    ($subject_id, '$question', " . ($question_image ? "'$question_image'" : "NULL") . ", 
                    '$choice1', " . ($choice1_image ? "'$choice1_image'" : "NULL") . ", 
                    '$choice2', " . ($choice2_image ? "'$choice2_image'" : "NULL") . ", 
                    '$choice3', " . ($choice3_image ? "'$choice3_image'" : "NULL") . ", 
                    '$choice4', " . ($choice4_image ? "'$choice4_image'" : "NULL") . ", 
                    '$correct_choice', $score)";
        }

        if (mysqli_query($conn, $sql)) {
            header("Location: questions.php?subject_id=$subject_id");
            exit;
        } else {
            $error = "เกิดข้อผิดพลาดในการบันทึกข้อมูล: " . mysqli_error($conn);
        }
    }
}
?>

<!DOCTYPE html>
<html lang="th">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo $is_edit ? "แก้ไข" : "เพิ่ม"; ?> คำถาม</title>
    <!-- Bootstrap 5 CSS -->
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- Font Awesome Icons -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
    <style>
        :root {
            --primary-color: #4e73df;
            --secondary-color: #858796;
            --success-color: #1cc88a;
            --danger-color: #e74a3b;
            --warning-color: #f6c23e;
            --light-bg: #f8f9fc;
        }
        
        body {
            background-color: var(--light-bg);
            font-family: 'Prompt', sans-serif;
            padding-top: 56px;
        }
        
        .main-navbar {
            background: linear-gradient(90deg, var(--primary-color) 0%, #224abe 100%);
            padding: 0.5rem 1rem;
        }
        
        .main-navbar .navbar-brand {
            color: white;
            font-weight: 600;
        }
        
        .main-navbar .nav-link {
            color: rgba(255, 255, 255, 0.8);
            padding: 0.75rem 1rem;
            border-radius: 0.375rem;
            transition: all 0.3s;
            margin: 0 0.25rem;
        }
        
        .main-navbar .nav-link:hover,
        .main-navbar .nav-link.active {
            color: white;
            background-color: rgba(255, 255, 255, 0.1);
        }
        
        .main-navbar .nav-link i {
            margin-right: 0.5rem;
        }
        
        .card {
            border: none;
            border-radius: 0.5rem;
            box-shadow: 0 0.15rem 1.75rem 0 rgba(58, 59, 69, 0.1);
            margin-bottom: 1.5rem;
        }
        
        .card-header {
            background-color: #f8f9fc;
            border-bottom: 1px solid #e3e6f0;
            padding: 1rem 1.25rem;
        }
        
        .btn-primary {
            background-color: var(--primary-color);
            border-color: var(--primary-color);
        }
        
        .btn-success {
            background-color: var(--success-color);
            border-color: var(--success-color);
        }
        
        .user-dropdown .dropdown-toggle::after {
            display: none;
        }
        
        .user-dropdown .dropdown-toggle {
            display: flex;
            align-items: center;
            color: rgba(255, 255, 255, 0.8);
            text-decoration: none;
        }
        
        .user-dropdown .dropdown-toggle:hover {
            color: white;
        }
        
        .user-dropdown .dropdown-menu {
            margin-top: 0.5rem;
            border: none;
            box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
        }
        
        @media (max-width: 992px) {
            .navbar-collapse {
                background-color: var(--primary-color);
                padding: 1rem;
                border-radius: 0.5rem;
                margin-top: 0.5rem;
            }
        }
        body {
            font-family: 'Prompt', sans-serif;
            background-color: #f5f5f5;
        }
        .card {
            border-radius: 0.5rem;
            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        }
        .form-label {
            font-weight: 500;
        }
        .preview-image {
            max-width: 200px;
            margin-top: 10px;
            border-radius: 0.375rem;
        }
        .error-message {
            color: var(--danger-color);
            margin-bottom: 1rem;
        }
    </style>
    <!-- Font from Google Fonts -->
    <link href="https://fonts.googleapis.com/css2?family=Prompt:wght@300;400;500;600;700&display=swap" rel="stylesheet">
</head>
<body>
    <!-- Main Navbar -->
    <nav class="navbar navbar-expand-lg fixed-top main-navbar">
        <div class="container-fluid">
            <a class="navbar-brand" href="#">
                <i class="fas fa-laptop-code me-2"></i>
                ระบบข้อสอบออนไลน์
            </a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" 
                    aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav me-auto">
                    <li class="nav-item">
                        <a class="nav-link" href="dashboard.php">
                            <i class="fas fa-tachometer-alt"></i>
                            ภาพรวม
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="subjects.php">
                            <i class="fas fa-book"></i>
                            จัดการวิชา
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link active" href="#">
                            <i class="fas fa-file-alt"></i>
                            จัดการข้อสอบ
                        </a>
                    </li>
                </ul>
                <div class="user-dropdown dropdown">
                    <a href="#" class="dropdown-toggle" id="userDropdown" data-bs-toggle="dropdown" aria-expanded="false">
                        <div>
                            <div class="fw-bold text-white"><?php echo htmlspecialchars($u_name); ?></div>
                        </div>
                        <i class="fas fa-chevron-down ms-2"></i>
                    </a>
                    <ul class="dropdown-menu dropdown-menu-end shadow">
                        <li><a class="dropdown-item" href="../logout.php"><i class="fas fa-sign-out-alt me-2"></i> ออกจากระบบ</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </nav>
    
    <!-- Main Content -->
    <div class="container-fluid px-4 mt-4">
        <div class="card">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h6 class="m-0 fw-bold"><?php echo $is_edit ? "แก้ไข" : "เพิ่ม"; ?> คำถาม</h6>
                <a href="questions.php?subject_id=<?php echo $subject_id; ?>" class="btn btn-sm btn-secondary"><i class="fas fa-arrow-left me-1"></i> กลับ</a>
            </div>
            <div class="card-body">
                <?php if (!empty($error)): ?>
                    <div class="error-message"><?php echo htmlspecialchars($error); ?></div>
                <?php endif; ?>
                <form method="post" enctype="multipart/form-data">
                    <div class="mb-3">
                        <label for="question" class="form-label">คำถาม (ระบุข้อความหรือรูปภาพอย่างน้อยอย่างหนึ่ง)</label>
                        <textarea name="question" id="question" class="form-control" rows="4"><?php echo htmlspecialchars($question); ?></textarea>
                    </div>
                    <div class="mb-3">
                        <label for="question_image" class="form-label">รูปภาพสำหรับคำถาม (ถ้ามี)</label>
                        <input type="file" name="question_image" id="question_image" class="form-control" accept="image/*">
                        <?php if ($is_edit && $question_image): ?>
                            <img src="../Uploads/<?php echo $question_image; ?>" alt="Question Image" class="preview-image">
                            <input type="hidden" id="question_image_existing" value="<?php echo $question_image; ?>">
                        <?php endif; ?>
                    </div>
                    <?php for ($i = 1; $i <= 4; $i++): ?>
                    <div class="mb-3">
                        <label for="choice<?php echo $i; ?>" class="form-label">ตัวเลือก <?php echo $i; ?><?php echo $i > 2 ? " (ไม่บังคับ)" : " (ระบุข้อความหรือรูปภาพอย่างน้อยอย่างหนึ่ง)"; ?></label>
                        <input type="text" name="choice<?php echo $i; ?>" id="choice<?php echo $i; ?>" class="form-control"
                               value="<?php echo htmlspecialchars(${"choice$i"}); ?>">
                        <label for="choice<?php echo $i; ?>_image" class="form-label mt-2">รูปภาพสำหรับตัวเลือก <?php echo $i; ?> (ถ้ามี)</label>
                        <input type="file" name="choice<?php echo $i; ?>_image" id="choice<?php echo $i; ?>_image" class="form-control" accept="image/*">
                        <?php if ($is_edit && ${"choice{$i}_image"}): ?>
                            <img src="../Uploads/<?php echo ${"choice{$i}_image"}; ?>" alt="Choice <?php echo $i; ?> Image" class="preview-image">
                            <input type="hidden" id="choice<?php echo $i; ?>_image_existing" value="<?php echo ${"choice{$i}_image"}; ?>">
                        <?php endif; ?>
                    </div>
                    <?php endfor; ?>
                    <div class="mb-3">
                        <label for="correct_choice" class="form-label">คำตอบที่ถูกต้อง</label>
                        <select name="correct_choice" id="correct_choice" class="form-select" required>
                            <option value="">-- เลือก --</option>
                            <?php for ($i = 1; $i <= 4; $i++): ?>
                                <?php if (!empty(${"choice$i"}) || !empty(${"choice{$i}_image"})): ?>
                                    <option value="<?php echo $i; ?>" <?php echo $correct_choice == $i ? "selected" : ""; ?>>
                                        ตัวเลือกที่ <?php echo $i; ?>: <?php echo htmlspecialchars(${"choice$i"}) ?: "รูปภาพ"; ?>
                                    </option>
                                <?php endif; ?>
                            <?php endfor; ?>
                        </select>
                    </div>
                    <div class="mb-3">
                        <label for="score" class="form-label">คะแนน</label>
                        <input type="number" name="score" id="score" class="form-control" required min="1" value="<?php echo $score; ?>">
                    </div>
                    <button type="submit" class="btn btn-success"><?php echo $is_edit ? "อัปเดต" : "บันทึก"; ?></button>
                </form>
            </div>
        </div>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
    <script>
    document.addEventListener('DOMContentLoaded', function() {
        function updateCorrectChoices() {
            const correctSelect = document.getElementById("correct_choice");
            const selected = correctSelect.value;
            correctSelect.innerHTML = '<option value="">-- เลือก --</option>';
            for (let i = 1; i <= 4; i++) {
                let val = document.getElementById("choice" + i).value;
                let img = document.getElementById("choice" + i + "_image").files.length > 0;
                let imgExisting = document.getElementById("choice" + i + "_image_existing")?.value;
                if (val.trim() !== "" || img || imgExisting) {
                    let opt = document.createElement("option");
                    opt.value = i;
                    opt.text = "ตัวเลือกที่ " + i + ": " + (val.trim() !== "" ? val : "รูปภาพ");
                    if (selected == i) opt.selected = true;
                    correctSelect.appendChild(opt);
                }
            }
        }

        for (let i = 1; i <= 4; i++) {
            document.getElementById("choice" + i).addEventListener("input", updateCorrectChoices);
            document.getElementById("choice" + i + "_image").addEventListener("change", updateCorrectChoices);
        }

        updateCorrectChoices();
    });
    </script>
</body>
</html>