mirror of
https://github.com/ExamAware/ExamSchedule.git
synced 2025-04-29 19:16:33 +00:00
提交所有文件
This commit is contained in:
MKStoler
GitHub
parent
9b30ee9c6d
commit
537e10d252
47
exam_config.json
Normal file
47
exam_config.json
Normal file
@ -0,0 +1,47 @@
|
|||||||
|
{
|
||||||
|
"examName": "周测",
|
||||||
|
"message": "诚信考试，作弊可耻",
|
||||||
|
"room": " ",
|
||||||
|
"examInfos": [
|
||||||
|
{
|
||||||
|
"name": "语文",
|
||||||
|
"start": "2025-01-04T07:20:00",
|
||||||
|
"end": "2025-01-04T09:50:00"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "物理",
|
||||||
|
"start": "2025-01-04T10:20:00",
|
||||||
|
"end": "2025-01-04T12:15:00"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "生物/政治",
|
||||||
|
"start": "2025-01-04T14:10:00",
|
||||||
|
"end": "2025-01-04T15:40:00"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "地理",
|
||||||
|
"start": "2025-01-04T16:10:00",
|
||||||
|
"end": "2025-01-04T17:40:00"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "数学",
|
||||||
|
"start": "2025-01-05T07:50:00",
|
||||||
|
"end": "2025-01-04T09:50:00"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "历史",
|
||||||
|
"start": "2025-01-05T10:20:00",
|
||||||
|
"end": "2025-01-05T11:50:00"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "英语",
|
||||||
|
"start": "2025-01-05T14:10:00",
|
||||||
|
"end": "2025-01-05T16:10:00"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "化学",
|
||||||
|
"start": "2025-01-05T16:30:00",
|
||||||
|
"end": "2025-01-05T18:00:00"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
41
index.html
Normal file
41
index.html
Normal file
@ -0,0 +1,41 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Exam Schedule</title>
|
||||||
|
<link rel="stylesheet" href="styles.css">
|
||||||
|
<link rel="icon" href="/favicon.ico" type="image/x-icon">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<button id="fullscreen-btn">全屏</button>
|
||||||
|
<div class="container">
|
||||||
|
<h1 id="examName"></h1>
|
||||||
|
<p id="message"></p>
|
||||||
|
<div class="content">
|
||||||
|
<div class="left-column">
|
||||||
|
<div id="current-time"></div>
|
||||||
|
<div id="current-subject"></div>
|
||||||
|
<div id="exam-timing"></div>
|
||||||
|
<div id="remaining-time"></div>
|
||||||
|
<div id="status"></div>
|
||||||
|
</div>
|
||||||
|
<div class="right-column">
|
||||||
|
<table>
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>科目</th>
|
||||||
|
<th>开始</th>
|
||||||
|
<th>结束</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody id="exam-table-body">
|
||||||
|
<!-- Dynamically filled by JavaScript -->
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<script src="script.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
130
script.js
Normal file
130
script.js
Normal file
@ -0,0 +1,130 @@
|
|||||||
|
document.addEventListener("DOMContentLoaded", () => {
|
||||||
|
const examNameElem = document.getElementById("examName");
|
||||||
|
const messageElem = document.getElementById("message");
|
||||||
|
const currentTimeElem = document.getElementById("current-time");
|
||||||
|
const currentSubjectElem = document.getElementById("current-subject");
|
||||||
|
const examTimingElem = document.getElementById("exam-timing");
|
||||||
|
const remainingTimeElem = document.getElementById("remaining-time");
|
||||||
|
const statusElem = document.getElementById("status");
|
||||||
|
const examTableBodyElem = document.getElementById("exam-table-body");
|
||||||
|
const fullscreenBtn = document.getElementById("fullscreen-btn");
|
||||||
|
|
||||||
|
function fetchData() {
|
||||||
|
fetch('exam_config.json')
|
||||||
|
.then(response => response.json())
|
||||||
|
.then(data => {
|
||||||
|
displayExamInfo(data);
|
||||||
|
updateCurrentTime();
|
||||||
|
updateExamInfo(data);
|
||||||
|
setInterval(() => updateCurrentTime(), 1000); // Update current time every second
|
||||||
|
setInterval(() => updateExamInfo(data), 1000); // Update exam info every second
|
||||||
|
})
|
||||||
|
.catch(error => console.error('Error fetching exam data:', error));
|
||||||
|
}
|
||||||
|
|
||||||
|
function displayExamInfo(data) {
|
||||||
|
// Display exam name
|
||||||
|
examNameElem.textContent = data.examName;
|
||||||
|
// Display message
|
||||||
|
messageElem.textContent = data.message;
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateCurrentTime() {
|
||||||
|
const now = new Date();
|
||||||
|
currentTimeElem.textContent = now.toLocaleTimeString('zh-CN', { hour12: false });
|
||||||
|
}
|
||||||
|
|
||||||
|
function formatTimeWithoutSeconds(time) {
|
||||||
|
// Convert time to string and remove seconds if present
|
||||||
|
return time.slice(0, -3);
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateExamInfo(data) {
|
||||||
|
const now = new Date();
|
||||||
|
let currentExam = null;
|
||||||
|
let nextExam = null;
|
||||||
|
|
||||||
|
data.examInfos.forEach(exam => {
|
||||||
|
const start = new Date(exam.start);
|
||||||
|
const end = new Date(exam.end);
|
||||||
|
if (now >= start && now <= end) {
|
||||||
|
currentExam = exam;
|
||||||
|
}
|
||||||
|
if (!currentExam && !nextExam && now < start) {
|
||||||
|
nextExam = exam;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
if (currentExam) {
|
||||||
|
currentSubjectElem.textContent = `当前科目: ${currentExam.name}`;
|
||||||
|
examTimingElem.textContent = `起止时间: ${formatTimeWithoutSeconds(new Date(currentExam.start).toLocaleTimeString('zh-CN', { hour12: false }))} - ${formatTimeWithoutSeconds(new Date(currentExam.end).toLocaleTimeString('zh-CN', { hour12: false }))}`;
|
||||||
|
const remainingTime = (new Date(currentExam.end) - now) / 1000;
|
||||||
|
const remainingHours = Math.floor(remainingTime / 3600);
|
||||||
|
const remainingMinutes = Math.floor((remainingTime % 3600) / 60);
|
||||||
|
const remainingSeconds = Math.floor(remainingTime % 60);
|
||||||
|
const remainingTimeText = `剩余时间: ${remainingHours}时 ${remainingMinutes}分 ${remainingSeconds}秒`;
|
||||||
|
|
||||||
|
if (remainingHours === 0 && remainingMinutes <= 15) {
|
||||||
|
remainingTimeElem.textContent = remainingTimeText;
|
||||||
|
remainingTimeElem.style.color = "red";
|
||||||
|
remainingTimeElem.style.fontWeight = "bold";
|
||||||
|
} else {
|
||||||
|
remainingTimeElem.textContent = remainingTimeText;
|
||||||
|
remainingTimeElem.style.color = "#93b4f7";
|
||||||
|
remainingTimeElem.style.fontWeight = "normal";
|
||||||
|
}
|
||||||
|
|
||||||
|
statusElem.textContent = "状态: 进行中";
|
||||||
|
statusElem.style.color = "green";
|
||||||
|
} else if (nextExam) {
|
||||||
|
currentSubjectElem.textContent = `下一场科目: ${nextExam.name}`;
|
||||||
|
examTimingElem.textContent = `起止时间: ${formatTimeWithoutSeconds(new Date(nextExam.start).toLocaleTimeString('zh-CN', { hour12: false }))} - ${formatTimeWithoutSeconds(new Date(nextExam.end).toLocaleTimeString('zh-CN', { hour12: false }))}`;
|
||||||
|
remainingTimeElem.textContent = "剩余时间: -";
|
||||||
|
statusElem.textContent = "状态: 即将开始";
|
||||||
|
statusElem.style.color = "orange";
|
||||||
|
} else {
|
||||||
|
currentSubjectElem.textContent = "当前无考试";
|
||||||
|
examTimingElem.textContent = "";
|
||||||
|
remainingTimeElem.textContent = "";
|
||||||
|
statusElem.textContent = "状态: 空闲";
|
||||||
|
statusElem.style.color = "blue";
|
||||||
|
}
|
||||||
|
|
||||||
|
// Update next exams table
|
||||||
|
examTableBodyElem.innerHTML = "";
|
||||||
|
data.examInfos.forEach(exam => {
|
||||||
|
const start = new Date(exam.start);
|
||||||
|
const end = new Date(exam.end);
|
||||||
|
let status = "";
|
||||||
|
if (now < start) {
|
||||||
|
status = "即将开始";
|
||||||
|
} else if (now > end) {
|
||||||
|
status = "已结束";
|
||||||
|
} else {
|
||||||
|
status = "进行中";
|
||||||
|
}
|
||||||
|
|
||||||
|
const row = document.createElement("tr");
|
||||||
|
row.className = `exam-status-${status}`;
|
||||||
|
row.innerHTML = `
|
||||||
|
<td>${exam.name}</td>
|
||||||
|
<td>${formatTimeWithoutSeconds(new Date(exam.start).toLocaleTimeString('zh-CN', { hour12: false }))}</td>
|
||||||
|
<td>${formatTimeWithoutSeconds(new Date(exam.end).toLocaleTimeString('zh-CN', { hour12: false }))}</td>
|
||||||
|
`;
|
||||||
|
examTableBodyElem.appendChild(row);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Fullscreen functionality
|
||||||
|
fullscreenBtn.addEventListener("click", () => {
|
||||||
|
if (!document.fullscreenElement) {
|
||||||
|
document.documentElement.requestFullscreen();
|
||||||
|
} else {
|
||||||
|
if (document.exitFullscreen) {
|
||||||
|
document.exitFullscreen();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
fetchData();
|
||||||
|
});
|
||||||
145
styles.css
Normal file
145
styles.css
Normal file
@ -0,0 +1,145 @@
|
|||||||
|
body {
|
||||||
|
font-family: 'HarmonyOS Sans SC Regular', Arial, sans-serif;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
background-color: #121212;
|
||||||
|
animation: fadeIn 1s;
|
||||||
|
color: #e0e0e0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fadeIn {
|
||||||
|
from { opacity: 0; }
|
||||||
|
to { opacity: 1; }
|
||||||
|
}
|
||||||
|
|
||||||
|
#fullscreen-btn {
|
||||||
|
position: absolute;
|
||||||
|
top: 20px;
|
||||||
|
right: 20px;
|
||||||
|
padding: 10px 20px;
|
||||||
|
font-size: 1.5rem;
|
||||||
|
cursor: pointer;
|
||||||
|
background-color: #1f1f1f;
|
||||||
|
color: #e0e0e0;
|
||||||
|
border: 1px solid #333;
|
||||||
|
border-radius: 5px;
|
||||||
|
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
|
||||||
|
transition: background-color 0.3s ease, transform 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
#fullscreen-btn:hover {
|
||||||
|
background-color: #333;
|
||||||
|
transform: scale(1.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
padding: 20px;
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: auto;
|
||||||
|
background-color: #1f1f1f;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 4rem;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: left;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
color: #e0e0e0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#message {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
color: #bb86fc;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left-column, .right-column {
|
||||||
|
width: 48%;
|
||||||
|
background-color: #1f1f1f;
|
||||||
|
padding: 20px;
|
||||||
|
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#current-time {
|
||||||
|
font-size: 8rem;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
color: #bb86fc;
|
||||||
|
}
|
||||||
|
|
||||||
|
#current-subject, #exam-timing, #remaining-time, #status {
|
||||||
|
font-size: 3rem;
|
||||||
|
margin: 10px 0;
|
||||||
|
text-align: left;
|
||||||
|
color: #e0e0e0;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
width: 100%;
|
||||||
|
border-collapse: collapse;
|
||||||
|
margin-top: 20px;
|
||||||
|
border: 1px solid #333;
|
||||||
|
background-color: #1f1f1f;
|
||||||
|
}
|
||||||
|
|
||||||
|
th, td {
|
||||||
|
border: 1px solid #333;
|
||||||
|
padding: 8px; /* 缩短行高 */
|
||||||
|
font-size: 2rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
th {
|
||||||
|
background-color: #333;
|
||||||
|
color: #bb86fc;
|
||||||
|
font-weight: bold;
|
||||||
|
border-bottom: 2px solid #bb86fc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.exam-status-进行中 td {
|
||||||
|
color: green !important; /* 绿色字体 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.exam-status-即将开始 td {
|
||||||
|
color: orange !important; /* 橙色字体 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.exam-status-已结束 td {
|
||||||
|
color: red !important; /* 红色字体 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.exam-status-空闲 td {
|
||||||
|
color: blue !important; /* 蓝色字体 */
|
||||||
|
}
|
||||||
|
|
||||||
|
tr:hover {
|
||||||
|
background-color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
border-radius: 8px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
td {
|
||||||
|
border-bottom: 1px solid #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
td:first-child {
|
||||||
|
border-top-left-radius: 8px;
|
||||||
|
border-bottom-left-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
td:last-child {
|
||||||
|
border-top-right-radius: 8px;
|
||||||
|
border-bottom-right-radius: 8px;
|
||||||
|
}
|
||||||
Loading…
x
Reference in New Issue
Block a user