Document<\/title>\n <\/head>\n <style>\n .title {\n font-family: 'Noto Sans JP', sans-serif;\n margin-bottom: 8px;\n text-align: center;\n font-size: 20px;\n color: white;\n background-color: #00448D;\n padding: 20px;\n border: 1px solid #00448D;\n font-weight: bold;\n }\n \n button#userInfo-button {\n font-size: 17px; \n text-transform: uppercase; \n background-color: #bd1e2d; \n color: black; \n color: white; \n font-weight: bold; \n padding: 5px 10px; \n border: none; \n border-radius: 15px; \n cursor: pointer; \n transition: 0.3s; \n }\n .group {\n border: 1px solid #f2f2f2;\n padding: 2px;\n margin-bottom: 8px;\n background-color: #00448D;\n }\n .title-group {\n font-family: 'Noto Sans JP', sans-serif;\n margin-bottom: 2px;\n align-items: center;\n text-align: left;\n font-size: 15px;\n padding-left: 10px;\n color: black;\n background-color: #f2f2f2;\n padding: 10px; \n font-weight: bold;\n }\n .sub-title {\n align-items: center;\n font-family: 'Noto Sans JP', sans-serif;\n font-weight: normal; \n padding: 10px;\n color: black;\n font-size: 15px; \n margin-bottom: 2px;\n }\n \n .question {\n font-family: 'Noto Sans JP', sans-serif;\n margin-bottom: 2px;\n text-align: left;\n font-size: 15px;\n color: black;\n background-color: #f2f2f2;\n padding: 8px;\n padding-left: 15px;\n padding-bottom: 15px;\n border: 1px solid white;\n font-weight: normal;\n }\n .question label { \n transition: background-color 0.3s, color 0.3s; \n display: block; \n padding: 2px;\n border-radius: 5px;\n font-weight: normal;\n font-size:15px;\n }\n .question label:hover {\n background-color: #99e6ff; \n color: #EA1019; \n }\n .selected-answer {\n background-color: #d3d3d3;\n }\n #questionContainer {\n user-select: none; \/* Standard syntax *\/\n }\n .jft-explanation {\n display: none; \n color: white; \n font-style: italic; \n margin-top: 1em; \n margin-bottom: 1em; \n margin-left: 1em; \n background-color: #008780; \n border-radius: 15px; \n padding: 15px 15px;\n }\n \n .submit-button-container {\n text-align: center;\n display: flex;\n justify-content: center;\n position: fixed;\n bottom: 8px;\n left: 0;\n right: 0;\n margin: auto;\n transition: transform 0.3s;\n }\n #submitButtonContainer:hover {\n transform: translateX(10px);\n }\n button#equestion-button {\n font-size: 17px; \n text-transform: uppercase; \n background-color: #bd1e2d; \n color: black; \n color: white; \n font-weight: bold; \n padding: 5px 10px; \n border: none; \n border-radius: 15px; \n cursor: pointer; \n transition: 0.3s; \n flex: 0 0 auto; \n }\n \n button#equestion-button:hover {\n background-color: #00a3cc; \n color: #bd1e2d; \n }\n \n .view-answers-button:hover {\n background-color: #bd1e2d; \n color: white; \n }\n \n .question-img {\n max-width: 100%; \n height: auto; \n }\n \n @media (min-width: 768px) {\n .question-img {\n max-width: 550px; \n }\n }\n \n button#equestion-button:disabled {\n background-color: #d3d3d3; \n color: #a8a8a8; \n cursor: not-allowed; \n }\n \n #timerContainer {\n position: fixed;\n top: 8%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: #00448D;\n color: white;\n padding: 5px 5px; \n border-radius: 15px;\n text-align: center;\n opacity: 0.5;\n transition: opacity 0.3s;\n }\n \n #timerContainer:hover {\n opacity: 0.9;\n }\n #timer {\n font-size: 17px; \n }\n #userInfo {\n background-color: #f2f2f2;\n padding: 10px;\n color: #00448D;\n border: 1px solid #f2f2f2;\n margin-bottom: 10px; \n text-align: center; \n }\n #login-alert {\n background-color: #f2f2f2;\n padding: 10px;\n color: #00a3cc ;\n border: 1px solid #f2f2f2;\n margin-bottom: 10px; \n }\n #classId, #userName, #careerId, #userEmail, #userId {\n border: 1px solid #00a3cc;\n background-color: white;\n border-radius: 6px;\n font-size: 15px;\n color: black;\n padding: 8px 22px;\n display: inline-block;\n text-align: left;\n }\n \n button#resetQuiz-button {\n font-size: 17px; \n text-transform: uppercase; \n background-color: #00448D; \n color: black; \n color: white; \n font-weight: bold; \n padding: 5px 10px; \n border: none; \n border-radius: 15px; \n cursor: pointer; \n transition: 0.3s; \n flex: 0 0 auto; \n }\n \n button#equestion-button:hover {\n background-color: #bd1e2d; \n color: whitesmoke; \n }\n \n body, input, button {\n font-family: 'Roboto', sans-serif;\n }\n \n .login-popup {\n position: fixed;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.5);\n display: none; \n justify-content: center;\n align-items: center;\n z-index: 1000; \n }\n \n .login-popup-content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n text-align: center; \n position: relative;\n background: black;\n color: white;\n font-size: 17px;\n padding: 35px 35px;\n border-radius: 10px;\n }\n .start-popup-content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n text-align: center; \n position: relative;\n background: black;\n color: white;\n font-size: 17px;\n padding: 20px 20px;\n border-radius: 10px;\n }\n \n #userIdSection {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 20px;\n border-radius: 10px;\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n background-color: #fff;\n }\n .popup {\n position: fixed;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.5);\n display: none;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n }\n .popup-content {\n background: white;\n padding: 20px;\n border-radius: 10px;\n width: 90%;\n max-width: 500px;\n text-align: center;\n }\n .popup-content input, .popup-content select {\n box-sizing: border-box;\n width: 100%;\n padding: 10px;\n margin: 10px 0;\n border: 1px solid #00a3cc; \n border-radius: 6px; \n font-size: 15px;\n color: black;\n background-color: white;\n display: inline-block;\n text-align: left;\n }\n .popup-content button {\n width: 100%;\n padding: 10px;\n margin: 10px 0;\n border: none;\n border-radius: 5px;\n background-color: #00448D;\n color: white;\n cursor: pointer;\n }\n <\/style> \n <body>\n <div id=\"userIdPopup\" class=\"popup\">\n <div class=\"popup-content\"> \n <h3>NH\u1eacP TH\u00d4NG TIN \u0110\u1ec2 TI\u1ebeP T\u1ee4C<\/h3>\n <input id=\"userName\" placeholder=\"H\u1ecd v\u00e0 t\u00ean\"\/>\n <input id=\"userId\" placeholder=\"M\u00e3 h\u1ecdc vi\u00ean\" \/>\n <input id=\"classId\" placeholder=\"L\u1edbp h\u1ecdc\" \/>\n <input id=\"careerId\" placeholder=\"M\u00e3 \u0111\u01a1n h\u00e0ng\" \/>\n <input id=\"userEmail\" placeholder=\"Email c\u1ee7a b\u1ea1n\"\/>\n <button id=\"userInfo-button\" onclick=\"checkUserId()\">X\u00e1c nh\u1eadn<\/button>\n <\/div>\n <\/div>\n <div id=\"userInfo\" style=\"display: block;\">\n <h2>T\u1eeb v\u1ef1ng tu\u1ea7n 1-2<\/h2>\n <div class=\"submit-button-container\">\n <button id=\"equestion-button\" onclick=\"submitQuiz()\">G\u1eedi k\u1ebft qu\u1ea3<\/button>\n <button id=\"resetQuiz-button\" onclick=\"resetQuiz()\" style=\"display:none;\">L\u00e0m l\u1ea1i b\u00e0i<\/button>\n <\/div>\n <\/div>\n <div id=\"questionContainer\"><\/div>\n <div id=\"timerContainer\">\n <span id=\"timer\"><\/span>\n <\/div>\n <div id=\"startQuizPopup\" class=\"login-popup\" style=\"display:none;\">\n <div class=\"start-popup-content\">\n <p>H\u00e3y ch\u1edd hi\u1ec7u l\u1ec7nh \u0111\u1ec3 b\u1eaft \u0111\u1ea7u!<\/p>\n <button onclick=\"startTimer()\" style=\"color:#0A7CFF;\">B\u1eaft \u0111\u1ea7u<\/button>\n <\/div>\n <\/div>\n <\/body>\n <script>\n document.addEventListener('DOMContentLoaded', () => { \n const savedUserId = localStorage.getItem('userId');\n const savedName = localStorage.getItem('userName');\n const savedClassId = localStorage.getItem('classId');\n const savedCareerId = localStorage.getItem('careerId');\n const savedEmail = localStorage.getItem('userEmail');\n\n if (savedUserId && savedName && savedClassInput && savedCareerInput && savedEmail) {\n document.getElementById('userIdPopup').style.display = 'none';\n loadQuestions();\n } else {\n document.getElementById('userIdPopup').style.display = 'flex';\n }\n });\n \n function checkUserId() {\n const userId = document.getElementById('userId').value.trim();\n const userName = document.getElementById('userName').value.trim();\n const classId = document.getElementById('classId').value.trim();\n const careerId = document.getElementById('careerId').value.trim();\n const userEmail = document.getElementById('userEmail').value.trim();\n if (!userId||!userName||!classId||!careerId||!userEmail) {\n alert('Vui l\u00f2ng nh\u1eadp \u0110\u1ea7y \u0111\u1ee7 th\u00f4ng tin!');\n return;\n }\n const url = `https:\/\/script.google.com\/macros\/s\/AKfycbzun9nk_UcN4EtT2mDJ1w2cgzMVy75VRsCD3czcMNIjpnFN-KdKTqNQ3piwtAR5Rndn\/exec?action=checkUserId&userId=${userId}`;\n fetch(url)\n .then(response => response.json())\n .then(result => {\n if (result.exists) {\n localStorage.setItem('userId', userId);\n if (!localStorage.getItem('deviceId')) {\n const deviceId = generateRandomID();\n localStorage.setItem('deviceId', deviceId);\n }\n document.getElementById('userIdPopup').style.display = 'none';\n loadQuestions();\n } else {\n alert('ID ng\u01b0\u1eddi d\u00f9ng kh\u00f4ng t\u1ed3n t\u1ea1i. Vui l\u00f2ng v\u00e0o Chat nh\u1eadp ch\u1eef ID \u0111\u1ec3 l\u1ea5y ID.');\n }\n })\n .catch(error => {\n console.error('Error:', error);\n alert('C\u00f3 l\u1ed7i x\u1ea3y ra khi ki\u1ec3m tra ID ng\u01b0\u1eddi d\u00f9ng.');\n });\n }\n \n let timeLeft = 180*60; \n let timerInterval; \n let correctAnswers = [];\n let totalQuestions = 0;\n const spreadsheetId = \"1QboxJvUgP-iV89NR3MwnLbFdCttFjb86K9ZMB2J1NoU\";\n window.quizTestName = \"Th\u1eed nghi\u1ec7m\";\n function loadQuestions() {\n \n document.getElementById('startQuizPopup').style.display = 'flex';\n const url = `https:\/\/script.google.com\/macros\/s\/AKfycbwpXEE0C9lLBCBR-GmDyeUgVqSvhz_enquTwV0k72RScp8g4SKZ7PK-KZJ-wOoeg6KV\/exec?action=fetchQuestions&spreadsheetId=${spreadsheetId}`;\n fetch(url)\n .then(response => response.json())\n .then(questions => {\n displayQuestions(questions); \n });\n document.getElementById('equestion-button').style.display = '';\n document.getElementById('timerContainer').style.display = '';\n \n }\n \n function startTimer() {\n document.getElementById('startQuizPopup').style.display = 'none';\n if (!timerInterval) {\n timerInterval = setInterval(updateTimer, 1000);\n }\n }\n \n \n function displayQuestions(data) {\n const container = document.getElementById('questionContainer');\n let currentGroupHTML = '';\n correctAnswers = data.slice(1).map(row => row[13]);\n questionTypes = data.slice(1).map(row => row[14]);\n questionScores = data.slice(1).map(row => parseFloat(row[15]));\n let currentTitle = null;\n data.forEach((row, index) => {\n if (index > 0) {\n if (row[1]) {\n container.innerHTML += `\n <div class=\"title\">\n <p>${row[1]}<\/p>\n <\/div>`;\n }\n if (row[2] && row[2] !== currentTitle) { \n if (currentGroupHTML) {\n container.innerHTML += `<div class=\"group\">${currentGroupHTML}<\/div>`;\n currentGroupHTML = '';\n }\n currentTitle = row[2];\n currentGroupHTML += `\n <div class=\"title-group\">\n <p><b>${currentTitle}<\/b><\/br> <span class=\"sub-title\">${row[3]}<\/span><\/p>\n ${row[4] ? `<img decoding=\"async\" class=\"question-img\" src=\"${row[4]}\" alt=\"Image for question ${index + 1}\"\/>` : \"\"}\n ${row[5] ? `<div class=\"embed-container\"><iframe loading=\"lazy\" width=\"560\" height=\"315\" src=\"${row[5]}\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" allowfullscreen><\/iframe><\/div>` : \"\"} \n <\/div>`;\n }\n var radioD = row[12] ? `<label><input type=\"radio\" name=\"question${index}\" value=\"D\">${row[12]}<\/label>` : '';\n currentGroupHTML += `\n <div class=\"question\">\n <p>${row[6]}<\/p>\n ${row[7] ? `<img decoding=\"async\" class=\"question-img\" src=\"${row[7]}\" alt=\"Image for question ${index + 1}\"\/>` : \"\"}\n ${row[8] ? `<div class=\"embed-container\"><iframe loading=\"lazy\" width=\"560\" height=\"315\" src=\"${row[8]}\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" allowfullscreen><\/iframe><\/div>` : \"\"} \n <label><input type=\"radio\" name=\"question${index}\" value=\"A\">${row[9]}<\/label>\n <label><input type=\"radio\" name=\"question${index}\" value=\"B\">${row[10]}<\/label>\n <label><input type=\"radio\" name=\"question${index}\" value=\"C\"${row[11] ? '' : 'disabled'}>${row[11]}<\/label>\n ${radioD}`;\n if (row[16]) {\n currentGroupHTML += `\n <div id=\"explanation${index}\" class=\"jft-explanation\">\n Gi\u1ea3i th\u00edch:<br> ${row[16]}\n <\/div>`;\n }\n currentGroupHTML += `<\/div>`;\n }\n });\n \n if (currentGroupHTML) {\n container.innerHTML += `<div class=\"group\">${currentGroupHTML}<\/div>`;\n }\n totalQuestions = data.length - 1;\n setupAnswerColorChange();\n }\n \n function setupAnswerColorChange() {\n const allRadioButtons = document.querySelectorAll('input[type=\"radio\"]');\n allRadioButtons.forEach(radio => {\n radio.addEventListener('change', function() {\n const allLabelsInSameQuestion = this.closest('.question').querySelectorAll('label');\n allLabelsInSameQuestion.forEach(label => {\n label.classList.remove('selected-answer');\n });\n this.closest('label').classList.add('selected-answer');\n });\n });\n }\n \n function submitQuiz() {\n const userEmail = document.getElementById('userEmail').value;\n if (!validateEmail(userEmail)) {\n alert('Email kh\u00f4ng h\u1ee3p l\u1ec7. Vui l\u00f2ng nh\u1eadp l\u1ea1i.');\n return;\n }\n const userName = document.getElementById('userName').value;\n const classId = document.getElementById('classId').value;\n const careerId = document.getElementById('careerId').value;\n const testName = window.quizTestName;\n const userId = localStorage.getItem('userId');\n const deviceId = localStorage.getItem('deviceId');\n localStorage.setItem('userEmail', userEmail);\n localStorage.setItem('classId', classId);\n localStorage.setItem('careerId', careerId);\n const isConfirmed = confirm(\"B\u1ea1n c\u00f3 ch\u1eafc ch\u1eafn mu\u1ed1n g\u1eedi \u0111\u00e1p \u00e1n hi\u1ec7n t\u1ea1i hay kh\u00f4ng?\");\n \n if (isConfirmed) {\n clearInterval(timerInterval);\n \n const radioButtons = document.querySelectorAll('input[type=\"radio\"]');\n radioButtons.forEach(radio => {\n radio.disabled = true;\n });\n \n const submitButton = document.getElementById('equestion-button');\n submitButton.disabled = true;\n submitButton.style.display = 'none';\n \n let totalTime = 180*60; \n let timeSpent = totalTime - timeLeft; \/\/ Th\u1eddi gian l\u00e0m b\u00e0i th\u1ef1c t\u1ebf\n let minutes = Math.floor(timeSpent \/ 60);\n let seconds = timeSpent % 60;\n \n let totalScore = 0;\n let scoreG = 0;\n let scoreBP = 0;\n let scoreCK = 0;\n \n const correctCount = correctAnswers.reduce((count, correctAnswer, index) => {\n const userAnswer = document.querySelector(`input[name=\"question${index + 1}\"]:checked`);\n if (userAnswer && userAnswer.value === correctAnswer) {\n const score = questionScores[index];\n totalScore += score;\n switch (questionTypes[index]) {\n case 'G':\n scoreG += score;\n break;\n case 'BP':\n scoreBP += score;\n break;\n case 'CK':\n scoreCK += score;\n break;\n }\n return count + 1;\n } else {\n return count;\n }\n }, 0);\n \n let message;\n \u00a0 \u00a0if (totalScore >= 100) {\n \u00a0 \u00a0 \u00a0 \u00a0message = `Ch\u00fac m\u1eebng b\u1ea1n \u0111\u00e3 v\u01b0\u1ee3t qua b\u00e0i ki\u1ec3m tra ${testName}.\\nTh\u1eddi gian l\u00e0m b\u00e0i: ${minutes} ph\u00fat ${seconds} gi\u00e2y.\\nB\u1ea1n tr\u1ea3 l\u1eddi \u0111\u00fang ${correctCount} c\u00e2u. \\nB\u1ea1n \u0111\u1ea1t ${totalScore} \u0111i\u1ec3m.\\n\u0110i\u1ec3m \u8a9e\u5f59: ${scoreG}, \u0110i\u1ec3m \u6587\u6cd5: ${scoreBP}, \u0110i\u1ec3m \u8074\u89e3: ${scoreCK}, T\u1ed5ng \u0111i\u1ec3m: ${totalScore}.\\nT\u1eaft th\u00f4ng b\u00e1o \u0111\u1ec3 xem chi ti\u1ebft \u0111\u00e1p \u00e1n.`;\n } else {\n message = `R\u1ea5t ti\u1ebfc b\u1ea1n \u0111\u00e3 kh\u00f4ng v\u01b0\u1ee3t qua b\u00e0i ki\u1ec3m tra ${testName}.\\nTh\u1eddi gian l\u00e0m b\u00e0i: ${minutes} ph\u00fat ${seconds} gi\u00e2y.\\nB\u1ea1n tr\u1ea3 l\u1eddi \u0111\u00fang ${correctCount} c\u00e2u.\\nB\u1ea1n \u0111\u1ea1t ${totalScore} \u0111i\u1ec3m.\\n\u0110i\u1ec3m \u8a9e\u5f59: ${scoreG}, \u0110i\u1ec3m \u6587\u6cd5: ${scoreBP}, \u0110i\u1ec3m \u8074\u89e3: ${scoreCK}, T\u1ed5ng \u0111i\u1ec3m: ${totalScore}.\\nB\u1ea1n c\u1ea7n \u0111\u1ea1t t\u1eeb 100 \u0111i\u1ec3m \u0111\u1ec3 v\u01b0\u1ee3t qua b\u00e0i ki\u1ec3m tra n\u00e0y.\\nT\u1eaft th\u00f4ng b\u00e1o \u0111\u1ec3 xem chi ti\u1ebft \u0111\u00e1p \u00e1n.`;\n } \n \n const questions = document.querySelectorAll('.question');\n questions.forEach((question, index) => {\n const selectedAnswer = question.querySelector('input[type=\"radio\"]:checked');\n const explanationElement = document.getElementById(`explanation${index + 1}`);\n if (selectedAnswer && explanationElement) {\n explanationElement.style.display = 'block';\n }\n });\n fetch('https:\/\/script.google.com\/macros\/s\/AKfycbzhfArsWx4WJDzNATMYMWA7NlQTtaEktuTRYxq7meYmDcx_RX4U_IP1NiEmWnODJ0We\/exec', {\n method: 'POST',\n mode: 'no-cors',\n headers: {\n 'Content-Type': 'application\/json',\n },\n body: JSON.stringify({ action: 'submitQuiz', userId, userName, testName, userEmail, deviceId, classId, careerId, correctCount, minutes, totalQuestions,totalScore }),\n })\n .then(() => {\n alert(message);\n checkAnswers();\n const resetQuizbutton = document.getElementById('resetQuiz-button');\n if (resetQuizbutton) {\n resetQuizbutton.style.display = 'block';\n }\n })\n .catch(error => {\n console.error('Error:', error);\n alert('C\u00f3 l\u1ed7i x\u1ea3y ra khi g\u1eedi k\u1ebft qu\u1ea3.');\n });\n \n } else {\n \n return;\n }\n \n }\n \n \n function generateRandomID() {\n const array = new Uint32Array(1);\n window.crypto.getRandomValues(array);\n return array[0].toString(16);\n }\n \n function updateTimer() { \n const timerElement = document.getElementById('timer');\n let hours = Math.floor(timeLeft \/ 3600);\n let minutes = Math.floor((timeLeft % 3600) \/ 60);\n let seconds = timeLeft % 60;\n const formattedTime = `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;\n timerElement.innerText = formattedTime;\n timeLeft--; \n if (timeLeft < 0) {\n clearInterval(timerInterval);\n endQuiz();\n }\n }\n \n function endQuiz() {\n const radios = document.querySelectorAll('input[type=\"radio\"]');\n radios.forEach(radio => {\n radio.disabled = true; \n });\n alert(\"Th\u1eddi gian l\u00e0m b\u00e0i \u0111\u00e3 h\u1ebft!\");\n }\n \n function checkAnswers() {\n for (let i = 0; i < correctAnswers.length; i++) { \n const userAnswer = document.querySelector(`input[name=\"question${i + 1}\"]:checked`);\n const questionLabels = document.querySelectorAll(`input[name=\"question${i + 1}\"]`);\n \n let correctLabel = null;\n questionLabels.forEach(label => {\n if (label.value === correctAnswers[i]) {\n correctLabel = label.parentElement; \n }\n });\n \n if (userAnswer) {\n if (userAnswer.value === correctAnswers[i]) {\n correctLabel.style.color = 'green'; \n } else {\n const wrongLabel = userAnswer.parentElement;\n wrongLabel.style.color = 'red'; \n correctLabel.style.color = 'green'; \n }\n }\n }\n }\n \n function resetQuiz() {\n const confirmReset = confirm('B\u1ea1n c\u00f3 ch\u1eafc ch\u1eafn mu\u1ed1n l\u00e0m l\u1ea1i b\u00e0i ki\u1ec3m tra?');\n if (confirmReset) {\n const allRadioButtons = document.querySelectorAll('input[type=\"radio\"]');\n allRadioButtons.forEach(radio => {\n radio.checked = false;\n radio.disabled = false; \n \n const parentLabel = radio.closest('label');\n parentLabel.style.backgroundColor = '';\n parentLabel.style.color = '';\n });\n \n const selectedLabels = document.querySelectorAll('.selected-answer');\n selectedLabels.forEach(label => {\n label.classList.remove('selected-answer');\n });\n \n const submitButton = document.getElementById('equestion-button');\n submitButton.disabled = false;\n submitButton.style.display = 'block';\n \n clearInterval(timerInterval); \n timeLeft = 180 * 60; \n timerInterval = setInterval(updateTimer, 1000);\n \n const resetButton = document.getElementById('resetQuiz-button');\n resetButton.style.display = 'none';\n \n document.querySelectorAll('.explanation').forEach(el => el.style.display = 'none');\n document.getElementById('careerId').disabled = false;\n const resultDiv = document.querySelector('.result-message');\n if (resultDiv) {\n resultDiv.remove();\n }\n }\n }\n \n function validateEmail(userEmail) {\n const re = \/^(([^<>()\\[\\]\\\\.,;:\\s@\"]+(\\.[^<>()\\[\\]\\\\.,;:\\s@\"]+)*)|(\".+\"))@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,}))$\/;\n return re.test(String(userEmail).toLowerCase());\n }\n <\/script>\n \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-3903","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/pages\/3903","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/comments?post=3903"}],"version-history":[{"count":1,"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/pages\/3903\/revisions"}],"predecessor-version":[{"id":3904,"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/pages\/3903\/revisions\/3904"}],"wp:attachment":[{"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/media?parent=3903"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":3903,"date":"2025-03-20T09:47:25","date_gmt":"2025-03-20T09:47:25","guid":{"rendered":"https:\/\/luyenthitokutei.com\/?page_id=3903"},"modified":"2025-03-20T09:47:25","modified_gmt":"2025-03-20T09:47:25","slug":"tu-vung-tuan-1-2","status":"publish","type":"page","link":"https:\/\/luyenthitokutei.com\/ja\/tu-vung-tuan-1-2\/","title":{"rendered":"T\u1eeb v\u1ef1ng tu\u1ea7n 1-2"},"content":{"rendered":"\n \n \n \n Document<\/title>\n <\/head>\n <style>\n .title {\n font-family: 'Noto Sans JP', sans-serif;\n margin-bottom: 8px;\n text-align: center;\n font-size: 20px;\n color: white;\n background-color: #00448D;\n padding: 20px;\n border: 1px solid #00448D;\n font-weight: bold;\n }\n \n button#userInfo-button {\n font-size: 17px; \n text-transform: uppercase; \n background-color: #bd1e2d; \n color: black; \n color: white; \n font-weight: bold; \n padding: 5px 10px; \n border: none; \n border-radius: 15px; \n cursor: pointer; \n transition: 0.3s; \n }\n .group {\n border: 1px solid #f2f2f2;\n padding: 2px;\n margin-bottom: 8px;\n background-color: #00448D;\n }\n .title-group {\n font-family: 'Noto Sans JP', sans-serif;\n margin-bottom: 2px;\n align-items: center;\n text-align: left;\n font-size: 15px;\n padding-left: 10px;\n color: black;\n background-color: #f2f2f2;\n padding: 10px; \n font-weight: bold;\n }\n .sub-title {\n align-items: center;\n font-family: 'Noto Sans JP', sans-serif;\n font-weight: normal; \n padding: 10px;\n color: black;\n font-size: 15px; \n margin-bottom: 2px;\n }\n \n .question {\n font-family: 'Noto Sans JP', sans-serif;\n margin-bottom: 2px;\n text-align: left;\n font-size: 15px;\n color: black;\n background-color: #f2f2f2;\n padding: 8px;\n padding-left: 15px;\n padding-bottom: 15px;\n border: 1px solid white;\n font-weight: normal;\n }\n .question label { \n transition: background-color 0.3s, color 0.3s; \n display: block; \n padding: 2px;\n border-radius: 5px;\n font-weight: normal;\n font-size:15px;\n }\n .question label:hover {\n background-color: #99e6ff; \n color: #EA1019; \n }\n .selected-answer {\n background-color: #d3d3d3;\n }\n #questionContainer {\n user-select: none; \/* Standard syntax *\/\n }\n .jft-explanation {\n display: none; \n color: white; \n font-style: italic; \n margin-top: 1em; \n margin-bottom: 1em; \n margin-left: 1em; \n background-color: #008780; \n border-radius: 15px; \n padding: 15px 15px;\n }\n \n .submit-button-container {\n text-align: center;\n display: flex;\n justify-content: center;\n position: fixed;\n bottom: 8px;\n left: 0;\n right: 0;\n margin: auto;\n transition: transform 0.3s;\n }\n #submitButtonContainer:hover {\n transform: translateX(10px);\n }\n button#equestion-button {\n font-size: 17px; \n text-transform: uppercase; \n background-color: #bd1e2d; \n color: black; \n color: white; \n font-weight: bold; \n padding: 5px 10px; \n border: none; \n border-radius: 15px; \n cursor: pointer; \n transition: 0.3s; \n flex: 0 0 auto; \n }\n \n button#equestion-button:hover {\n background-color: #00a3cc; \n color: #bd1e2d; \n }\n \n .view-answers-button:hover {\n background-color: #bd1e2d; \n color: white; \n }\n \n .question-img {\n max-width: 100%; \n height: auto; \n }\n \n @media (min-width: 768px) {\n .question-img {\n max-width: 550px; \n }\n }\n \n button#equestion-button:disabled {\n background-color: #d3d3d3; \n color: #a8a8a8; \n cursor: not-allowed; \n }\n \n #timerContainer {\n position: fixed;\n top: 8%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: #00448D;\n color: white;\n padding: 5px 5px; \n border-radius: 15px;\n text-align: center;\n opacity: 0.5;\n transition: opacity 0.3s;\n }\n \n #timerContainer:hover {\n opacity: 0.9;\n }\n #timer {\n font-size: 17px; \n }\n #userInfo {\n background-color: #f2f2f2;\n padding: 10px;\n color: #00448D;\n border: 1px solid #f2f2f2;\n margin-bottom: 10px; \n text-align: center; \n }\n #login-alert {\n background-color: #f2f2f2;\n padding: 10px;\n color: #00a3cc ;\n border: 1px solid #f2f2f2;\n margin-bottom: 10px; \n }\n #classId, #userName, #careerId, #userEmail, #userId {\n border: 1px solid #00a3cc;\n background-color: white;\n border-radius: 6px;\n font-size: 15px;\n color: black;\n padding: 8px 22px;\n display: inline-block;\n text-align: left;\n }\n \n button#resetQuiz-button {\n font-size: 17px; \n text-transform: uppercase; \n background-color: #00448D; \n color: black; \n color: white; \n font-weight: bold; \n padding: 5px 10px; \n border: none; \n border-radius: 15px; \n cursor: pointer; \n transition: 0.3s; \n flex: 0 0 auto; \n }\n \n button#equestion-button:hover {\n background-color: #bd1e2d; \n color: whitesmoke; \n }\n \n body, input, button {\n font-family: 'Roboto', sans-serif;\n }\n \n .login-popup {\n position: fixed;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.5);\n display: none; \n justify-content: center;\n align-items: center;\n z-index: 1000; \n }\n \n .login-popup-content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n text-align: center; \n position: relative;\n background: black;\n color: white;\n font-size: 17px;\n padding: 35px 35px;\n border-radius: 10px;\n }\n .start-popup-content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n text-align: center; \n position: relative;\n background: black;\n color: white;\n font-size: 17px;\n padding: 20px 20px;\n border-radius: 10px;\n }\n \n #userIdSection {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 20px;\n border-radius: 10px;\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n background-color: #fff;\n }\n .popup {\n position: fixed;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.5);\n display: none;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n }\n .popup-content {\n background: white;\n padding: 20px;\n border-radius: 10px;\n width: 90%;\n max-width: 500px;\n text-align: center;\n }\n .popup-content input, .popup-content select {\n box-sizing: border-box;\n width: 100%;\n padding: 10px;\n margin: 10px 0;\n border: 1px solid #00a3cc; \n border-radius: 6px; \n font-size: 15px;\n color: black;\n background-color: white;\n display: inline-block;\n text-align: left;\n }\n .popup-content button {\n width: 100%;\n padding: 10px;\n margin: 10px 0;\n border: none;\n border-radius: 5px;\n background-color: #00448D;\n color: white;\n cursor: pointer;\n }\n <\/style> \n <body>\n <div id=\"userIdPopup\" class=\"popup\">\n <div class=\"popup-content\"> \n <h3>NH\u1eacP TH\u00d4NG TIN \u0110\u1ec2 TI\u1ebeP T\u1ee4C<\/h3>\n <input id=\"userName\" placeholder=\"H\u1ecd v\u00e0 t\u00ean\"\/>\n <input id=\"userId\" placeholder=\"M\u00e3 h\u1ecdc vi\u00ean\" \/>\n <input id=\"classId\" placeholder=\"L\u1edbp h\u1ecdc\" \/>\n <input id=\"careerId\" placeholder=\"M\u00e3 \u0111\u01a1n h\u00e0ng\" \/>\n <input id=\"userEmail\" placeholder=\"Email c\u1ee7a b\u1ea1n\"\/>\n <button id=\"userInfo-button\" onclick=\"checkUserId()\">X\u00e1c nh\u1eadn<\/button>\n <\/div>\n <\/div>\n <div id=\"userInfo\" style=\"display: block;\">\n <h2>T\u1eeb v\u1ef1ng tu\u1ea7n 1-2<\/h2>\n <div class=\"submit-button-container\">\n <button id=\"equestion-button\" onclick=\"submitQuiz()\">G\u1eedi k\u1ebft qu\u1ea3<\/button>\n <button id=\"resetQuiz-button\" onclick=\"resetQuiz()\" style=\"display:none;\">L\u00e0m l\u1ea1i b\u00e0i<\/button>\n <\/div>\n <\/div>\n <div id=\"questionContainer\"><\/div>\n <div id=\"timerContainer\">\n <span id=\"timer\"><\/span>\n <\/div>\n <div id=\"startQuizPopup\" class=\"login-popup\" style=\"display:none;\">\n <div class=\"start-popup-content\">\n <p>H\u00e3y ch\u1edd hi\u1ec7u l\u1ec7nh \u0111\u1ec3 b\u1eaft \u0111\u1ea7u!<\/p>\n <button onclick=\"startTimer()\" style=\"color:#0A7CFF;\">B\u1eaft \u0111\u1ea7u<\/button>\n <\/div>\n <\/div>\n <\/body>\n <script>\n document.addEventListener('DOMContentLoaded', () => { \n const savedUserId = localStorage.getItem('userId');\n const savedName = localStorage.getItem('userName');\n const savedClassId = localStorage.getItem('classId');\n const savedCareerId = localStorage.getItem('careerId');\n const savedEmail = localStorage.getItem('userEmail');\n\n if (savedUserId && savedName && savedClassInput && savedCareerInput && savedEmail) {\n document.getElementById('userIdPopup').style.display = 'none';\n loadQuestions();\n } else {\n document.getElementById('userIdPopup').style.display = 'flex';\n }\n });\n \n function checkUserId() {\n const userId = document.getElementById('userId').value.trim();\n const userName = document.getElementById('userName').value.trim();\n const classId = document.getElementById('classId').value.trim();\n const careerId = document.getElementById('careerId').value.trim();\n const userEmail = document.getElementById('userEmail').value.trim();\n if (!userId||!userName||!classId||!careerId||!userEmail) {\n alert('Vui l\u00f2ng nh\u1eadp \u0110\u1ea7y \u0111\u1ee7 th\u00f4ng tin!');\n return;\n }\n const url = `https:\/\/script.google.com\/macros\/s\/AKfycbzun9nk_UcN4EtT2mDJ1w2cgzMVy75VRsCD3czcMNIjpnFN-KdKTqNQ3piwtAR5Rndn\/exec?action=checkUserId&userId=${userId}`;\n fetch(url)\n .then(response => response.json())\n .then(result => {\n if (result.exists) {\n localStorage.setItem('userId', userId);\n if (!localStorage.getItem('deviceId')) {\n const deviceId = generateRandomID();\n localStorage.setItem('deviceId', deviceId);\n }\n document.getElementById('userIdPopup').style.display = 'none';\n loadQuestions();\n } else {\n alert('ID ng\u01b0\u1eddi d\u00f9ng kh\u00f4ng t\u1ed3n t\u1ea1i. Vui l\u00f2ng v\u00e0o Chat nh\u1eadp ch\u1eef ID \u0111\u1ec3 l\u1ea5y ID.');\n }\n })\n .catch(error => {\n console.error('Error:', error);\n alert('C\u00f3 l\u1ed7i x\u1ea3y ra khi ki\u1ec3m tra ID ng\u01b0\u1eddi d\u00f9ng.');\n });\n }\n \n let timeLeft = 180*60; \n let timerInterval; \n let correctAnswers = [];\n let totalQuestions = 0;\n const spreadsheetId = \"1QboxJvUgP-iV89NR3MwnLbFdCttFjb86K9ZMB2J1NoU\";\n window.quizTestName = \"Th\u1eed nghi\u1ec7m\";\n function loadQuestions() {\n \n document.getElementById('startQuizPopup').style.display = 'flex';\n const url = `https:\/\/script.google.com\/macros\/s\/AKfycbwpXEE0C9lLBCBR-GmDyeUgVqSvhz_enquTwV0k72RScp8g4SKZ7PK-KZJ-wOoeg6KV\/exec?action=fetchQuestions&spreadsheetId=${spreadsheetId}`;\n fetch(url)\n .then(response => response.json())\n .then(questions => {\n displayQuestions(questions); \n });\n document.getElementById('equestion-button').style.display = '';\n document.getElementById('timerContainer').style.display = '';\n \n }\n \n function startTimer() {\n document.getElementById('startQuizPopup').style.display = 'none';\n if (!timerInterval) {\n timerInterval = setInterval(updateTimer, 1000);\n }\n }\n \n \n function displayQuestions(data) {\n const container = document.getElementById('questionContainer');\n let currentGroupHTML = '';\n correctAnswers = data.slice(1).map(row => row[13]);\n questionTypes = data.slice(1).map(row => row[14]);\n questionScores = data.slice(1).map(row => parseFloat(row[15]));\n let currentTitle = null;\n data.forEach((row, index) => {\n if (index > 0) {\n if (row[1]) {\n container.innerHTML += `\n <div class=\"title\">\n <p>${row[1]}<\/p>\n <\/div>`;\n }\n if (row[2] && row[2] !== currentTitle) { \n if (currentGroupHTML) {\n container.innerHTML += `<div class=\"group\">${currentGroupHTML}<\/div>`;\n currentGroupHTML = '';\n }\n currentTitle = row[2];\n currentGroupHTML += `\n <div class=\"title-group\">\n <p><b>${currentTitle}<\/b><\/br> <span class=\"sub-title\">${row[3]}<\/span><\/p>\n ${row[4] ? `<img decoding=\"async\" class=\"question-img\" src=\"${row[4]}\" alt=\"Image for question ${index + 1}\"\/>` : \"\"}\n ${row[5] ? `<div class=\"embed-container\"><iframe loading=\"lazy\" width=\"560\" height=\"315\" src=\"${row[5]}\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" allowfullscreen><\/iframe><\/div>` : \"\"} \n <\/div>`;\n }\n var radioD = row[12] ? `<label><input type=\"radio\" name=\"question${index}\" value=\"D\">${row[12]}<\/label>` : '';\n currentGroupHTML += `\n <div class=\"question\">\n <p>${row[6]}<\/p>\n ${row[7] ? `<img decoding=\"async\" class=\"question-img\" src=\"${row[7]}\" alt=\"Image for question ${index + 1}\"\/>` : \"\"}\n ${row[8] ? `<div class=\"embed-container\"><iframe loading=\"lazy\" width=\"560\" height=\"315\" src=\"${row[8]}\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" allowfullscreen><\/iframe><\/div>` : \"\"} \n <label><input type=\"radio\" name=\"question${index}\" value=\"A\">${row[9]}<\/label>\n <label><input type=\"radio\" name=\"question${index}\" value=\"B\">${row[10]}<\/label>\n <label><input type=\"radio\" name=\"question${index}\" value=\"C\"${row[11] ? '' : 'disabled'}>${row[11]}<\/label>\n ${radioD}`;\n if (row[16]) {\n currentGroupHTML += `\n <div id=\"explanation${index}\" class=\"jft-explanation\">\n Gi\u1ea3i th\u00edch:<br> ${row[16]}\n <\/div>`;\n }\n currentGroupHTML += `<\/div>`;\n }\n });\n \n if (currentGroupHTML) {\n container.innerHTML += `<div class=\"group\">${currentGroupHTML}<\/div>`;\n }\n totalQuestions = data.length - 1;\n setupAnswerColorChange();\n }\n \n function setupAnswerColorChange() {\n const allRadioButtons = document.querySelectorAll('input[type=\"radio\"]');\n allRadioButtons.forEach(radio => {\n radio.addEventListener('change', function() {\n const allLabelsInSameQuestion = this.closest('.question').querySelectorAll('label');\n allLabelsInSameQuestion.forEach(label => {\n label.classList.remove('selected-answer');\n });\n this.closest('label').classList.add('selected-answer');\n });\n });\n }\n \n function submitQuiz() {\n const userEmail = document.getElementById('userEmail').value;\n if (!validateEmail(userEmail)) {\n alert('Email kh\u00f4ng h\u1ee3p l\u1ec7. Vui l\u00f2ng nh\u1eadp l\u1ea1i.');\n return;\n }\n const userName = document.getElementById('userName').value;\n const classId = document.getElementById('classId').value;\n const careerId = document.getElementById('careerId').value;\n const testName = window.quizTestName;\n const userId = localStorage.getItem('userId');\n const deviceId = localStorage.getItem('deviceId');\n localStorage.setItem('userEmail', userEmail);\n localStorage.setItem('classId', classId);\n localStorage.setItem('careerId', careerId);\n const isConfirmed = confirm(\"B\u1ea1n c\u00f3 ch\u1eafc ch\u1eafn mu\u1ed1n g\u1eedi \u0111\u00e1p \u00e1n hi\u1ec7n t\u1ea1i hay kh\u00f4ng?\");\n \n if (isConfirmed) {\n clearInterval(timerInterval);\n \n const radioButtons = document.querySelectorAll('input[type=\"radio\"]');\n radioButtons.forEach(radio => {\n radio.disabled = true;\n });\n \n const submitButton = document.getElementById('equestion-button');\n submitButton.disabled = true;\n submitButton.style.display = 'none';\n \n let totalTime = 180*60; \n let timeSpent = totalTime - timeLeft; \/\/ Th\u1eddi gian l\u00e0m b\u00e0i th\u1ef1c t\u1ebf\n let minutes = Math.floor(timeSpent \/ 60);\n let seconds = timeSpent % 60;\n \n let totalScore = 0;\n let scoreG = 0;\n let scoreBP = 0;\n let scoreCK = 0;\n \n const correctCount = correctAnswers.reduce((count, correctAnswer, index) => {\n const userAnswer = document.querySelector(`input[name=\"question${index + 1}\"]:checked`);\n if (userAnswer && userAnswer.value === correctAnswer) {\n const score = questionScores[index];\n totalScore += score;\n switch (questionTypes[index]) {\n case 'G':\n scoreG += score;\n break;\n case 'BP':\n scoreBP += score;\n break;\n case 'CK':\n scoreCK += score;\n break;\n }\n return count + 1;\n } else {\n return count;\n }\n }, 0);\n \n let message;\n \u00a0 \u00a0if (totalScore >= 100) {\n \u00a0 \u00a0 \u00a0 \u00a0message = `Ch\u00fac m\u1eebng b\u1ea1n \u0111\u00e3 v\u01b0\u1ee3t qua b\u00e0i ki\u1ec3m tra ${testName}.\\nTh\u1eddi gian l\u00e0m b\u00e0i: ${minutes} ph\u00fat ${seconds} gi\u00e2y.\\nB\u1ea1n tr\u1ea3 l\u1eddi \u0111\u00fang ${correctCount} c\u00e2u. \\nB\u1ea1n \u0111\u1ea1t ${totalScore} \u0111i\u1ec3m.\\n\u0110i\u1ec3m \u8a9e\u5f59: ${scoreG}, \u0110i\u1ec3m \u6587\u6cd5: ${scoreBP}, \u0110i\u1ec3m \u8074\u89e3: ${scoreCK}, T\u1ed5ng \u0111i\u1ec3m: ${totalScore}.\\nT\u1eaft th\u00f4ng b\u00e1o \u0111\u1ec3 xem chi ti\u1ebft \u0111\u00e1p \u00e1n.`;\n } else {\n message = `R\u1ea5t ti\u1ebfc b\u1ea1n \u0111\u00e3 kh\u00f4ng v\u01b0\u1ee3t qua b\u00e0i ki\u1ec3m tra ${testName}.\\nTh\u1eddi gian l\u00e0m b\u00e0i: ${minutes} ph\u00fat ${seconds} gi\u00e2y.\\nB\u1ea1n tr\u1ea3 l\u1eddi \u0111\u00fang ${correctCount} c\u00e2u.\\nB\u1ea1n \u0111\u1ea1t ${totalScore} \u0111i\u1ec3m.\\n\u0110i\u1ec3m \u8a9e\u5f59: ${scoreG}, \u0110i\u1ec3m \u6587\u6cd5: ${scoreBP}, \u0110i\u1ec3m \u8074\u89e3: ${scoreCK}, T\u1ed5ng \u0111i\u1ec3m: ${totalScore}.\\nB\u1ea1n c\u1ea7n \u0111\u1ea1t t\u1eeb 100 \u0111i\u1ec3m \u0111\u1ec3 v\u01b0\u1ee3t qua b\u00e0i ki\u1ec3m tra n\u00e0y.\\nT\u1eaft th\u00f4ng b\u00e1o \u0111\u1ec3 xem chi ti\u1ebft \u0111\u00e1p \u00e1n.`;\n } \n \n const questions = document.querySelectorAll('.question');\n questions.forEach((question, index) => {\n const selectedAnswer = question.querySelector('input[type=\"radio\"]:checked');\n const explanationElement = document.getElementById(`explanation${index + 1}`);\n if (selectedAnswer && explanationElement) {\n explanationElement.style.display = 'block';\n }\n });\n fetch('https:\/\/script.google.com\/macros\/s\/AKfycbzhfArsWx4WJDzNATMYMWA7NlQTtaEktuTRYxq7meYmDcx_RX4U_IP1NiEmWnODJ0We\/exec', {\n method: 'POST',\n mode: 'no-cors',\n headers: {\n 'Content-Type': 'application\/json',\n },\n body: JSON.stringify({ action: 'submitQuiz', userId, userName, testName, userEmail, deviceId, classId, careerId, correctCount, minutes, totalQuestions,totalScore }),\n })\n .then(() => {\n alert(message);\n checkAnswers();\n const resetQuizbutton = document.getElementById('resetQuiz-button');\n if (resetQuizbutton) {\n resetQuizbutton.style.display = 'block';\n }\n })\n .catch(error => {\n console.error('Error:', error);\n alert('C\u00f3 l\u1ed7i x\u1ea3y ra khi g\u1eedi k\u1ebft qu\u1ea3.');\n });\n \n } else {\n \n return;\n }\n \n }\n \n \n function generateRandomID() {\n const array = new Uint32Array(1);\n window.crypto.getRandomValues(array);\n return array[0].toString(16);\n }\n \n function updateTimer() { \n const timerElement = document.getElementById('timer');\n let hours = Math.floor(timeLeft \/ 3600);\n let minutes = Math.floor((timeLeft % 3600) \/ 60);\n let seconds = timeLeft % 60;\n const formattedTime = `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;\n timerElement.innerText = formattedTime;\n timeLeft--; \n if (timeLeft < 0) {\n clearInterval(timerInterval);\n endQuiz();\n }\n }\n \n function endQuiz() {\n const radios = document.querySelectorAll('input[type=\"radio\"]');\n radios.forEach(radio => {\n radio.disabled = true; \n });\n alert(\"Th\u1eddi gian l\u00e0m b\u00e0i \u0111\u00e3 h\u1ebft!\");\n }\n \n function checkAnswers() {\n for (let i = 0; i < correctAnswers.length; i++) { \n const userAnswer = document.querySelector(`input[name=\"question${i + 1}\"]:checked`);\n const questionLabels = document.querySelectorAll(`input[name=\"question${i + 1}\"]`);\n \n let correctLabel = null;\n questionLabels.forEach(label => {\n if (label.value === correctAnswers[i]) {\n correctLabel = label.parentElement; \n }\n });\n \n if (userAnswer) {\n if (userAnswer.value === correctAnswers[i]) {\n correctLabel.style.color = 'green'; \n } else {\n const wrongLabel = userAnswer.parentElement;\n wrongLabel.style.color = 'red'; \n correctLabel.style.color = 'green'; \n }\n }\n }\n }\n \n function resetQuiz() {\n const confirmReset = confirm('B\u1ea1n c\u00f3 ch\u1eafc ch\u1eafn mu\u1ed1n l\u00e0m l\u1ea1i b\u00e0i ki\u1ec3m tra?');\n if (confirmReset) {\n const allRadioButtons = document.querySelectorAll('input[type=\"radio\"]');\n allRadioButtons.forEach(radio => {\n radio.checked = false;\n radio.disabled = false; \n \n const parentLabel = radio.closest('label');\n parentLabel.style.backgroundColor = '';\n parentLabel.style.color = '';\n });\n \n const selectedLabels = document.querySelectorAll('.selected-answer');\n selectedLabels.forEach(label => {\n label.classList.remove('selected-answer');\n });\n \n const submitButton = document.getElementById('equestion-button');\n submitButton.disabled = false;\n submitButton.style.display = 'block';\n \n clearInterval(timerInterval); \n timeLeft = 180 * 60; \n timerInterval = setInterval(updateTimer, 1000);\n \n const resetButton = document.getElementById('resetQuiz-button');\n resetButton.style.display = 'none';\n \n document.querySelectorAll('.explanation').forEach(el => el.style.display = 'none');\n document.getElementById('careerId').disabled = false;\n const resultDiv = document.querySelector('.result-message');\n if (resultDiv) {\n resultDiv.remove();\n }\n }\n }\n \n function validateEmail(userEmail) {\n const re = \/^(([^<>()\\[\\]\\\\.,;:\\s@\"]+(\\.[^<>()\\[\\]\\\\.,;:\\s@\"]+)*)|(\".+\"))@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,}))$\/;\n return re.test(String(userEmail).toLowerCase());\n }\n <\/script>\n \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-3903","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/pages\/3903","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/comments?post=3903"}],"version-history":[{"count":1,"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/pages\/3903\/revisions"}],"predecessor-version":[{"id":3904,"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/pages\/3903\/revisions\/3904"}],"wp:attachment":[{"href":"https:\/\/luyenthitokutei.com\/ja\/wp-json\/wp\/v2\/media?parent=3903"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}