Skip to content

Commit

Permalink
Merge pull request #9 from spence-m/wotlk
Browse files Browse the repository at this point in the history
Add Wrath of the Lich King calendar.
  • Loading branch information
spence-m authored Oct 6, 2022
2 parents ab981aa + c1479b0 commit 55e69b7
Show file tree
Hide file tree
Showing 9 changed files with 9,123 additions and 797 deletions.
68 changes: 68 additions & 0 deletions __fixtures__/wotlk-dates.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,68 @@
export const wrathDates = [
[
{
key: "arathi",
date: new Date(2022, 8, 30), // sept
},
{
key: "strand",
date: new Date(2022, 9, 7), // oct
},
{
key: "alterac",
date: new Date(2022, 9, 14), // oct
},
{
key: "eye",
date: new Date(2022, 9, 21), // oct
},
{
key: "warsong",
date: new Date(2022, 9, 28), // oct
},
],
[
{
key: "arathi",
date: new Date(2022, 10, 4), // nov
},
{
key: "strand",
date: new Date(2022, 10, 11), // nov
},
{
key: "alterac",
date: new Date(2022, 10, 18), // nov
},
{
key: "eye",
date: new Date(2022, 10, 25), // nov
},
{
key: "warsong",
date: new Date(2022, 11, 2), // dec
},
],
[
{
key: "arathi",
date: new Date(2022, 11, 9), // dec
},
{
key: "strand",
date: new Date(2022, 11, 16), // dec
},
{
key: "alterac",
date: new Date(2022, 11, 23), // dec
},
{
key: "eye",
date: new Date(2022, 11, 30), // dec
},
{
key: "warsong",
date: "",
},
],
];
24 changes: 24 additions & 0 deletions __tests__/wotlk-dates.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
import { wrathDates } from "../__fixtures__/wotlk-dates.js";
import { getWOTLKHolidays } from "../helpers/date-helper.js";

it("should contain the correct WOTLK dates for 2022", () => {
const holidays = getWOTLKHolidays(2022);
for (let i = 0; i < holidays.length; i++) {
for (let j = 0; j < holidays[i].length; j++) {
const firstKey = wrathDates[i][j].key;
const secondKey = holidays[i][j].key;

const firstDateStr =
wrathDates[i][j].date === ""
? wrathDates[i][j].date
: wrathDates[i][j].date.toLocaleDateString();
const secondDateStr =
holidays[i][j].date === ""
? holidays[i][j].date
: holidays[i][j].date.toLocaleDateString();

expect(firstKey).toEqual(secondKey);
expect(firstDateStr).toEqual(secondDateStr);
}
}
});
12 changes: 12 additions & 0 deletions babel.config.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
{
"presets": [
[
"@babel/preset-env",
{
"targets": {
"node": "current"
}
}
]
]
}
83 changes: 83 additions & 0 deletions helpers/date-helper.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
export const getWOTLKHolidays = (year) => {
const arathiEpoch = new Date(2022, 8, 30);
const strandEpoch = new Date(2022, 9, 7);
const alteracEpoch = new Date(2022, 9, 14);
const eyeOfTheStormEpoch = new Date(2022, 9, 21);
const warsongEpoch = new Date(2022, 9, 28);
const start = new Date(arathiEpoch.getTime());

let i = 0;
const dates = [];
while (start.getFullYear() <= year) {
const row = [
{
key: "arathi",
date: "",
},
{
key: "strand",
date: "",
},
{
key: "alterac",
date: "",
},
{
key: "eye",
date: "",
},
{
key: "warsong",
date: "",
},
];

const fiveWeeksInDays = 35;
const arathiDate = new Date(arathiEpoch);
arathiDate.setDate(arathiDate.getDate() + fiveWeeksInDays * i);

const strandDate = new Date(strandEpoch);
strandDate.setDate(strandDate.getDate() + fiveWeeksInDays * i);

const alteracDate = new Date(alteracEpoch);
alteracDate.setDate(alteracDate.getDate() + fiveWeeksInDays * i);

const eyeOfTheStormDate = new Date(eyeOfTheStormEpoch);
eyeOfTheStormDate.setDate(
eyeOfTheStormDate.getDate() + fiveWeeksInDays * i
);

const warsongDate = new Date(warsongEpoch);
warsongDate.setDate(warsongDate.getDate() + fiveWeeksInDays * i);

let added = false;
if (arathiDate.getFullYear() === year) {
row[0].date = arathiDate;
added = true;
}
if (strandDate.getFullYear() === year) {
row[1].date = strandDate;
added = true;
}
if (alteracDate.getFullYear() === year) {
row[2].date = alteracDate;
added = true;
}
if (eyeOfTheStormDate.getFullYear() === year) {
row[3].date = eyeOfTheStormDate;
added = true;
}
if (warsongDate.getFullYear() === year) {
row[4].date = warsongDate;
added = true;
}

if (added) {
dates.push(row);
}
start.setDate(start.getDate() + fiveWeeksInDays);
i++;
}

return dates;
};
86 changes: 15 additions & 71 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta
name="description"
content="Battleground holiday schedule 2022 for Classic Era, Season of Mastery, and Burning Crusade Classic."
content="Battleground holiday schedule 2022 for Classic Era, Season of Mastery, and Wrath of the Lich King Classic."
/>
<title>WoW Classic Battleground Holidays 2022</title>
<link rel="stylesheet" href="style.css" />
Expand Down Expand Up @@ -33,9 +33,9 @@
<main role="main" class="main">
<h1 class="title">WoW Classic Battleground Holidays 2022</h1>
<div class="content-wrapper">
<article class="article" x-data="bccHolidays">
<h1 class="subtitle subtitle--bcc">
Burning Crusade Classic <b x-text="year"></b>
<article class="article" x-data="wotlkHolidays">
<h1 class="subtitle subtitle--wotlk">
Wrath of the Lich King Classic
</h1>
<button
class="button"
Expand All @@ -49,18 +49,19 @@ <h1 class="subtitle subtitle--bcc">
<table>
<thead>
<tr>
<th class="table-heading">Eye of the Storm</th>
<th class="table-heading">Warsong Gulch</th>
<th class="table-heading">Arathi Basin</th>
<th class="table-heading">Strand of the Ancients</th>
<th class="table-heading">Alterac Valley</th>
<th class="table-heading">Eye of the Storm</th>
<th class="table-heading">Warsong Gulch</th>
</tr>
</thead>
<tbody>
<template x-for="(date, index) in dates">
<tr>
<td class="table-cell">
<div
:class="isHoliday(date[0].date) === true ? 'triangle triangle--bcc' : ''"
:class="isHoliday(date[0].date) === true ? 'triangle triangle--wotlk' : ''"
></div>
<span
:class="isPast(date[0].date) === true ? 'table-cell--past' : ''"
Expand All @@ -69,7 +70,7 @@ <h1 class="subtitle subtitle--bcc">
</td>
<td class="table-cell">
<div
:class="isHoliday(date[1].date) === true ? 'triangle triangle--bcc' : ''"
:class="isHoliday(date[1].date) === true ? 'triangle triangle--wotlk' : ''"
></div>
<span
:class="isPast(date[1].date) === true ? 'table-cell--past' : ''"
Expand All @@ -78,7 +79,7 @@ <h1 class="subtitle subtitle--bcc">
</td>
<td class="table-cell">
<div
:class="isHoliday(date[2].date) === true ? 'triangle triangle--bcc' : ''"
:class="isHoliday(date[2].date) === true ? 'triangle triangle--wotlk' : ''"
></div>
<span
:class="isPast(date[2].date) === true ? 'table-cell--past' : ''"
Expand All @@ -87,73 +88,20 @@ <h1 class="subtitle subtitle--bcc">
</td>
<td class="table-cell">
<div
:class="isHoliday(date[3].date) === true ? 'triangle triangle--bcc' : ''"
:class="isHoliday(date[3].date) === true ? 'triangle triangle--wotlk' : ''"
></div>
<span
:class="isPast(date[3].date) === true ? 'table-cell--past' : ''"
x-text="formatDate(date[3].date)"
></span>
</td>
</tr>
</template>
</tbody>
</table>
</div>
</article>

<article class="article" x-data="somHolidays">
<h1 class="subtitle">Season of Mastery <b x-text="year"></b></h1>
<button
class="button"
:class="isDecrementDisabled() === true ? 'button--disabled' : ''"
@click="decrementYear"
>
Previous year
</button>
<button
class="button"
:class="isIncrementDisabled() === true ? 'button--disabled' : ''"
@click="incrementYear"
>
Next year
</button>
<div class="table-wrapper">
<table>
<thead>
<tr>
<th class="table-heading">Warsong Gulch</th>
<th class="table-heading">Arathi Basin</th>
<th class="table-heading">Alterac Valley</th>
</tr>
</thead>
<tbody>
<template x-for="(date, index) in dates">
<tr>
<td class="table-cell">
<div
:class="isHoliday(date[0].date) === true ? 'triangle' : ''"
:class="isHoliday(date[4].date) === true ? 'triangle triangle--wotlk' : ''"
></div>
<span
:class="isPast(date[0].date) === true ? 'table-cell--past' : ''"
x-text="formatDate(date[0].date)"
></span>
</td>
<td class="table-cell">
<div
:class="isHoliday(date[1].date) === true ? 'triangle' : ''"
></div>
<span
:class="isPast(date[1].date) === true ? 'table-cell--past' : ''"
x-text="formatDate(date[1].date)"
></span>
</td>
<td class="table-cell">
<div
:class="isHoliday(date[2].date) === true ? 'triangle' : ''"
></div>
<span
:class="isPast(date[2].date) === true ? 'table-cell--past' : ''"
x-text="formatDate(date[2].date)"
:class="isPast(date[4].date) === true ? 'table-cell--past' : ''"
x-text="formatDate(date[4].date)"
></span>
</td>
</tr>
Expand All @@ -164,7 +112,7 @@ <h1 class="subtitle">Season of Mastery <b x-text="year"></b></h1>
</article>

<article class="article" x-data="classicEraHolidays">
<h1 class="subtitle">Classic Era <b x-text="year"></b></h1>
<h1 class="subtitle">SoM / Classic Era <b x-text="year"></b></h1>
<button
class="button"
:class="isDecrementDisabled() === true ? 'button--disabled' : ''"
Expand Down Expand Up @@ -222,10 +170,6 @@ <h1 class="subtitle">Classic Era <b x-text="year"></b></h1>
</div>
</main>
<footer class="footer">
<h1 class="footer-title">Fancy a head start in Wrath of the Lich King Classic? Check out:</h1>
<a href="https://www.restedxp.com/ref/spencer.ma" target="_blank"><img
src="https://www.restedxp.com/wp-content/uploads/2021/05/rxp-medium-promo-panel.png"
alt="promotional banner for RestedXP guide" /></a>
<a href="/">
<img
class="logo"
Expand Down
Loading

0 comments on commit 55e69b7

Please sign in to comment.