<!DOCTYPE html>
<html lang="zh-TW">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>TTVS段考測驗系統</title>
    <link rel="icon" href="https://i.imgur.com/P3EVpnQ.png" type="image/png">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.6.3/css/foundation.min.css">
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-XELSWLMFDR"></script>
    <script src="https://www.gstatic.com/firebasejs/9.23.0/firebase-app-compat.js"></script>
    <script src="https://www.gstatic.com/firebasejs/9.23.0/firebase-database-compat.js"></script>

    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      gtag('config', 'G-XELSWLMFDR');
    </script>
       <script>
       
       document.addEventListener('DOMContentLoaded', function() {
    if (localStorage.getItem('isLoggedIn') !== 'true') {
        alert('由於您尚未登入，按下確定後將返回至首頁進行登入。');
        window.location.href = '../../index.html';
    } else {
        console.log('已登入，用戶可繼續操作');
    }
});

    </script>
    <style>
        body {
    padding: 20px;
    font-family: 'Helvetica Neue', Arial, sans-serif;
    background-color: #ffffff; 
    color: #333;
}
.question-image, .option-image {
    max-width: 200px;
    max-height: 200px;
    margin-top: 10px;
}

.quiz-container {
    max-width: 600px;
    margin: auto;
    background-color: #ffffff;
    border-radius: 15px;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
    padding: 40px;
}

h1 {
    color: #d32f2f; 
    text-align: center;
    margin-bottom: 10px;
    font-size: 26px;
}

.info-text {
    text-align: center;
    margin-bottom: 20px;
    font-size: 18px;
    color: #555;
}

.btn-primary {
    background-color: #d32f2f; 
    border: none;
    color: white;
    transition: background-color 0.3s, transform 0.3s;
    cursor: pointer;
}

.btn-primary:hover {
    background-color: #b71c1c;
}

.hidden {
    display: none;
}

.question {
    margin-top: 20px;
}

.question label {
    margin: 0;
    padding: 2px 0;
    display: block;
}

.result-section {
    text-align: center;
    margin-top: 30px;
    font-size: 18px;
}

footer {
    text-align: center;
    padding: 15px 0;
    color: #333;
    margin-top: 20px;
    border-top: 1px solid #ddd;
}

footer a {
    color: #d32f2f; 
    text-decoration: none;
}

footer a:hover {
    text-decoration: underline;
}

.correct {
    color: #d32f2f;
} 

.incorrect {
    color: #d32f2f;
}

    .correct-answer {
        background-color: yellow;
    }

    .wrong-answer {
        background-color: red;
        color: white;
    }
    .disabled-option {
        pointer-events: none;
    }


    </style>
</head>

<body>
<div class="quiz-container">
    <h1>TTVS段考測驗系統</h1>
    <div class="info-text">本測驗共有 40 題，每題 2.5 分</div>
    
    <label for="studentIDInput">學號:</label>
    <input type="text" id="studentIDInput" name="studentID" required>
    
    <label for="nameInput">姓名:</label>
    <input type="text" id="nameInput" name="name" required>

    <label for="subjectInput">考試科目:</label>
    <select id="subjectInput" name="subject" required>
        <option value="無選擇科目">選擇考試卷並選擇科目</option>
        <option value="ICT">[GLAD國際]ICT計算機能力國際認證</option>
        <option value="APP Inventor">[MOCC]APP Inventor</option>
        <option value="電子商務">[MOCC]電子商務</option>
        <option value="資訊科技">[MOCC]資訊科技</option>
        <option value="資訊安全">[MOCC]資訊安全</option>
    </select>

    <form id="quizForm">
        <div id="questionsContainer"></div>
        <button type="button" id="submitBtn" class="button btn-primary" onclick="submitQuiz()">作答完成</button>
    </form>

    <div id="result" class="result-section"></div>

    <footer>
        <p>國立草屯商工 &copy; 2024-2025 <a href="https://www.nasify.org" target="_blank">NasifyTech納啟科技開發</a></p>
    </footer>
    <script>
        const encodedQuizJsPath = "Li4vLi4vamF2YS9xdWl6c3lzdHRkYXRhLmpz";
        const encodedAntiDebugJsPath = "Li4vLi4vamF2YS9hbnRpRGVidWcuanM";
    
        const quizJsPath = atob(encodedQuizJsPath);
        const quizScript = document.createElement("script");
        quizScript.src = quizJsPath;
        quizScript.defer = true; 
        document.head.appendChild(quizScript);
    
        const antiDebugJsPath = atob(encodedAntiDebugJsPath);
        const antiDebugScript = document.createElement("script");
        antiDebugScript.src = antiDebugJsPath;
        antiDebugScript.defer = true;
        document.head.appendChild(antiDebugScript);
    </script>
    
</div>
</body>
</html>
