Skip to content

Commit

Permalink
add: script.js | modify: api, index, pre-csat.html
Browse files Browse the repository at this point in the history
  • Loading branch information
Z3r0c0k3 committed Jun 26, 2024
1 parent a67b9b6 commit 8d1731f
Show file tree
Hide file tree
Showing 5 changed files with 63 additions and 24 deletions.
22 changes: 11 additions & 11 deletions api.html
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@
<div class="row">
<div class="Vector-1"></div>
</div>
<div class="CSAT-2025-text">2025학년도 대학수학능력시험</div>
<div class="CSAT-text">2025학년도 대학수학능력시험</div>
<span class="D-Day-2025"> 000 : 00 : 00 : 00 . 00 </span>
</div>
<!-- 3mo -->
Expand All @@ -56,8 +56,8 @@
<div class="row">
<div class="Vector-1"></div>
</div>
<div class="CSAT-2025-text">2025학년도 3월 모의고사</div>
<span class="D-Day-2025"> 000 : 00 : 00 : 00 . 00 </span>
<div class="CSAT-text">2025학년도 3월 모의고사</div>
<span class="D-Day-3mo"> 000 : 00 : 00 : 00 . 00 </span>
</div>
</div>
<!-- 2026 -->
Expand All @@ -75,8 +75,8 @@
<div class="row">
<div class="Vector-1"></div>
</div>
<div class="CSAT-2025-text">2026학년도 대학수학능력시험</div>
<span class="D-Day-2025"> 000 : 00 : 00 : 00 . 00 </span>
<div class="CSAT-text">2026학년도 대학수학능력시험</div>
<span class="D-Day-2026"> 000 : 00 : 00 : 00 . 00 </span>
</div>
<!-- 6mo -->
<div class="Rectangle-1">
Expand All @@ -92,8 +92,8 @@
<div class="row">
<div class="Vector-1"></div>
</div>
<div class="CSAT-2025-text">2025학년도 6월 모의고사</div>
<span class="D-Day-2025"> 000 : 00 : 00 : 00 . 00 </span>
<div class="CSAT-text">2025학년도 6월 모의고사</div>
<span class="D-Day-6mo"> 000 : 00 : 00 : 00 . 00 </span>
</div>
</div>

Expand All @@ -112,8 +112,8 @@
<div class="row">
<div class="Vector-1"></div>
</div>
<div class="CSAT-2025-text">2027학년도 대학수학능력시험</div>
<span class="D-Day-2025"> 000 : 00 : 00 : 00 . 00 </span>
<div class="CSAT-text">2027학년도 대학수학능력시험</div>
<span class="D-Day-2027"> 000 : 00 : 00 : 00 . 00 </span>
</div>
<!-- 9mo -->
<div class="Rectangle-1">
Expand All @@ -129,8 +129,8 @@
<div class="row">
<div class="Vector-1"></div>
</div>
<div class="CSAT-2025-text">2025학년도 9월 모의고사</div>
<span class="D-Day-2025"> 000 : 00 : 00 : 00 . 00 </span>
<div class="CSAT-text">2025학년도 9월 모의고사</div>
<span class="D-Day-9mo"> 000 : 00 : 00 : 00 . 00 </span>
</div>
</div>
</main>
Expand Down
10 changes: 5 additions & 5 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@
<div class="row">
<div class="Vector-1"></div>
</div>
<div class="CSAT-2025-text">2025학년도 대학수학능력시험</div>
<div class="CSAT-text">2025학년도 대학수학능력시험</div>
<span class="D-Day-2025"> 000 : 00 : 00 : 00 . 00 </span>
</div>
<!-- 응원에 한마디..! -->
Expand All @@ -62,8 +62,8 @@ <h1 class="victory_message">괜찮아요. 다 할 수 있어요.</h1>
<div class="row">
<div class="Vector-1"></div>
</div>
<div class="CSAT-2025-text">2026학년도 대학수학능력시험</div>
<span class="D-Day-2025"> 000 : 00 : 00 : 00 . 00 </span>
<div class="CSAT-text">2026학년도 대학수학능력시험</div>
<span class="D-Day-2026"> 000 : 00 : 00 : 00 . 00 </span>
</div>
<div class="timer">
<a href="timer.html" target="_blank"><h1>수능 타이머</h1></a>
Expand All @@ -84,8 +84,8 @@ <h1 class="victory_message">괜찮아요. 다 할 수 있어요.</h1>
<div class="row">
<div class="Vector-1"></div>
</div>
<div class="CSAT-2025-text">2027학년도 대학수학능력시험</div>
<span class="D-Day-2025"> 000 : 00 : 00 : 00 . 00 </span>
<div class="CSAT-text">2027학년도 대학수학능력시험</div>
<span class="D-Day-2027"> 000 : 00 : 00 : 00 . 00 </span>
</div>
</main>
</body>
Expand Down
12 changes: 6 additions & 6 deletions pre-csat.html
Original file line number Diff line number Diff line change
Expand Up @@ -41,8 +41,8 @@
<div class="row">
<div class="Vector-1"></div>
</div>
<div class="CSAT-2025-text">2025학년도 3월 모의고사</div>
<span class="D-Day-2025"> 000 : 00 : 00 : 00 . 00 </span>
<div class="CSAT-text">2025학년도 3월 모의고사</div>
<span class="D-Day-3mo"> 000 : 00 : 00 : 00 . 00 </span>
</div>
<!-- 응원에 한마디..! -->
<h1 class="victory_message">괜찮아요. 다 잘 될거예요.</h1>
Expand All @@ -62,8 +62,8 @@ <h1 class="victory_message">괜찮아요. 다 잘 될거예요.</h1>
<div class="row">
<div class="Vector-1"></div>
</div>
<div class="CSAT-2025-text">2025학년도 6월 모의고사</div>
<span class="D-Day-2025"> 000 : 00 : 00 : 00 . 00 </span>
<div class="CSAT-text">2025학년도 6월 모의고사</div>
<span class="D-Day-6mo"> 000 : 00 : 00 : 00 . 00 </span>
</div>
<div class="timer">
<a href="timer.html" target="_blank"><h1>모의고사 타이머</h1></a>
Expand All @@ -84,8 +84,8 @@ <h1 class="victory_message">괜찮아요. 다 잘 될거예요.</h1>
<div class="row">
<div class="Vector-1"></div>
</div>
<div class="CSAT-2025-text">2025학년도 9월 모의고사</div>
<span class="D-Day-2025"> 000 : 00 : 00 : 00 . 00 </span>
<div class="CSAT-text">2025학년도 9월 모의고사</div>
<span class="D-Day-9mo"> 000 : 00 : 00 : 00 . 00 </span>
</div>
</main>
</body>
Expand Down
39 changes: 39 additions & 0 deletions script.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@

document.addEventListener('DOMContentLoaded', () => { // 문서 로드 후 실행
const targetDates = {
'D-Day-2025': new Date('2024-11-14T08:00:00').getTime(),
'D-Day-2026': new Date('2025-11-13T08:00:00').getTime(),
'D-Day-2027': new Date('2026-11-19T08:00:00').getTime(),
'D-Day-3mo': new Date('2024-03-28T08:00:00').getTime(),
'D-Day-6mo': new Date('2024-06-04T08:00:00').getTime(),
'D-Day-9mo': new Date('2024-09-04T08:00:00').getTime(),
};

function updateDday(className, targetDate) {
const ddaySpans = document.querySelectorAll(`.${className}`); // 여러 span 요소 선택

ddaySpans.forEach(ddaySpan => {
const now = new Date().getTime();
const timeDifference = targetDate - now;

if (timeDifference <= 0) {
console.log(`${className}: D-DAY!`);
}

const days = Math.max(0, Math.floor(timeDifference / (1000 * 60 * 60 * 24)));
const hours = Math.max(0, Math.floor((timeDifference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)));
const minutes = Math.max(0, Math.floor((timeDifference % (1000 * 60 * 60)) / (1000 * 60)));
const seconds = Math.max(0, Math.floor((timeDifference % (1000 * 60)) / 1000));
const milliseconds = Math.max(0, timeDifference % 1000);

const formattedDday = `${days.toString().padStart(3, '0')} : ${hours.toString().padStart(2, '0')} : ${minutes.toString().padStart(2, '0')} : ${seconds.toString().padStart(2, '0')} . ${milliseconds.toString().padStart(2, '0')}`;

ddaySpan.innerText = formattedDday;
});
}

for (const className in targetDates) {
updateDday(className, targetDates[className]);
setInterval(() => updateDday(className, targetDates[className]), 1);
}
});
4 changes: 2 additions & 2 deletions style.css
Original file line number Diff line number Diff line change
Expand Up @@ -249,7 +249,7 @@ main {
flex-grow: 0;
background-color: #000;
}
.CSAT-2025-text {
.CSAT-text {
width: 100%;
height: 15.6%;
flex-grow: 0;
Expand All @@ -264,7 +264,7 @@ main {
text-align: center;
color: #000;
}
.D-Day-2025 {
.D-Day-2025, .D-Day-2026, .D-Day-2027, .D-Day-3mo, .D-Day-6mo, .D-Day-9mo {
width: 88.2%;
height: 40%;
flex-grow: 0;
Expand Down

0 comments on commit 8d1731f

Please sign in to comment.