-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathday-and-week-banner.html
120 lines (114 loc) · 5.6 KB
/
day-and-week-banner.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
<!DOCTYPE html>
<html>
<head>
<title>Semester Week</title>
</head>
<body>
<h1 style="border: 2px dashed black; padding: 10px; text-align: center; font-family: 'Tw Cen MT', sans-serif;" id="week-display"></h1>
<script> // [N.B: if you want to change how the box and text looks in terms of styling, do so in the line above]
const semesterStartDate = new Date("2023-07-31T00:00:00+10:00"); // enter the start date of the Semester in AEDT or AEST
const weekStartDates = [
new Date("2023-07-31T00:00:00+10:00"), // enter the start date of Week One
new Date("2023-08-07T00:00:00+10:00"), // enter the start date of Week Two
new Date("2023-08-14T00:00:00+10:00"), // enter the start date of Week Three
new Date("2023-08-21T00:00:00+10:00"), // enter the start date of Week Four
new Date("2023-08-28T00:00:00+10:00"), // enter the start date of Week Five
new Date("2023-09-04T00:00:00+10:00"), // enter the start date of Week Six
new Date("2023-09-11T00:00:00+10:00"), // enter the start date of Week Seven [N.B: the Semester Recess and/or AEDT/AEST may be here too]
new Date("2023-09-18T00:00:00+10:00"), // enter the start date of Week Eight [N.B: the Semester Recess and/or AEDT/AEST may be here too]
new Date("2023-09-25T00:00:00+10:00"), // enter the start date of the Semester Recess [N.B: the Semester Recess and/or AEDT/AEST may be here too]
new Date("2023-10-02T00:00:00+11:00"), // enter the start date of Week Nine [N.B: the Semester Recess and/or AEDT/AEST may be here too]
new Date("2023-10-09T00:00:00+11:00"), // enter the start date of Week Ten
new Date("2023-10-16T00:00:00+11:00"), // enter the start date of Week Eleven
new Date("2023-10-23T00:00:00+11:00"), // enter the start date of Week Twelve
new Date("2023-10-30T00:00:00+11:00"), // enter the start date of Week Thirteen
new Date("2023-11-06T00:00:00+11:00"), // enter the start date of STUVAC
new Date("2023-11-13T00:00:00+11:00"), // enter the start of Week One of the Exam Period
new Date("2023-11-20T00:00:00+11:00"), // enter the start of Week Two of the Exam Period
new Date("2023-11-27T00:00:00+11:00"), // enter the start of the following week (i.e. end of the Semester)
];
const getWeekNumber = (date) => {
let weekNumber;
const time = date.getTime() - semesterStartDate.getTime();
if(date < weekStartDates[0]) weekNumber = -1;
for(let i=0; i<18; i++){
if(date >= weekStartDates[i] && date < weekStartDates[i+1]) {
weekNumber = i+1;
}
}
if(date > weekStartDates[17]) weekNumber = 18;
return weekNumber;
};
const getDayName = (dayNumber) => { // [N.B: in HTML format, the first day in the array is Sunday, but the counter will still name it correctly]
switch (dayNumber) {
case 0:
return "Sunday";
case 1:
return "Monday";
case 2:
return "Tuesday";
case 3:
return "Wednesday";
case 4:
return "Thursday";
case 5:
return "Friday";
case 6:
return "Saturday";
}
}
const getWeekName = (weekNumber) => {
if (weekNumber < 0) {
return "it is before Semester Two has started.";
} else if (weekNumber >= 18) {
return "it is after Semester Two has finished.";
} else {
switch (weekNumber) {
case 1:
return "it is " + dayName + " of Week One.";
case 2:
return "it is " + dayName + " of Week Two.";
case 3:
return "it is " + dayName + " of Week Three.";
case 4:
return "it is " + dayName + " of Week Four.";
case 5:
return "it is " + dayName + " of Week Five.";
case 6:
return "it is " + dayName + " of Week Six.";
case 7:
return "it is " + dayName + " of Week Seven."; // depending on when the Semester Recess is, you may need to change the text in the quotation marks
case 8:
return "it is " + dayName + " of Week Eight."; // depending on when the Semester Recess is, you may need to change the text in the quotation marks
case 9:
return "it is " + dayName + " of the Semester Recess."; // depending on when the Semester Recess is, you may need to change the text in the quotation marks
case 10:
return "it is " + dayName + " of Week Nine."; // depending on when the Semester Recess is, you may need to change the text in the quotation marks
case 11:
return "it is " + dayName + " of Week Ten.";
case 12:
return "it is " + dayName + " of Week Eleven.";
case 13:
return "it is " + dayName + " of Week Twelve.";
case 14:
return "it is " + dayName + " of Week Thirteen.";
case 15:
return "it is " + dayName + " of STUVAC.";
case 16:
return "it is " + dayName + " of Week One of the Exam Period.";
case 17:
return "it is " + dayName + " of Week Two of the Exam Period.";
}
}
};
const options = {timeZone: "Australia/Sydney"};
const sydneyDate = new Intl.DateTimeFormat("en-US", options).format(new Date());
const currentDate = new Date(sydneyDate);
const dayNumber = currentDate.getDay();
const dayName = getDayName(dayNumber);
const weekNumber = getWeekNumber(currentDate);
const weekName = getWeekName(weekNumber);
document.getElementById("week-display").innerHTML = "When is it? Right now, " + weekName; // [N.B: if you want to change the text preceding the counter, do so here]
</script>
</body>
</html>