Parameterize site constants

- Implement src/constants
- Parameterize event details, event dates, and (most importantly) registration dates

src/constants/index.js

@@ -0,0 +1,43 @@
+import dayjs from "dayjs";
+
+export const event = {
+    iteration: '11.0',
+    year: '2024',
+    start: dayjs('2/24/2024 11:30'),
+    end: dayjs('2/25/2024 8:00'),
+    sponsorshipPacket: 'sponsorship11_0.pdf'
+}
+
+export const location = {
+    name: 'Cvent HQ',
+    address: '1765 Greensboro Station Pl 7th Floor, McLean, VA 22102',
+    mapsLink: 'https://goo.gl/maps/L23EwHCCucy7SjKf7'
+}
+
+export const registration = {
+    participant: {
+        open: dayjs('1/20/2024 19:00'),
+        close: dayjs('2/3/2024 23:59'),
+    },
+    other: {
+        open: dayjs('1/20/2024 19:00'),
+        close: event.start,
+    },
+}
+
+// Time-based properties (do not edit)
+registration.participant = {
+    ...registration.participant,
+    notOpenYet: dayjs() < registration.participant.open,
+    isOpen: registration.participant.open < dayjs() && dayjs() < registration.participant.close,
+    isClosed: registration.participant.close < dayjs()
+}
+
+registration.other = {
+    ...registration.other,
+    notOpenYet: dayjs() < registration.other.open,
+    isOpen: registration.other.open < dayjs() && dayjs() < registration.other.close,
+    isClosed: registration.other.close < dayjs()
+}
+
+registration.isOpen = registration.participant.isOpen || registration.other.isOpen

src/eventdata/FAQComponents/FAQDeadline.svelte

@@ -1,11 +1,14 @@
+<script>
+	import { registration } from "../../constants";
+</script>
+
 <p>
-	Registration for participants, judges, mentors, and volunteers opens on Saturday, January 20 at
-	7:00 PM.
+	Registration for participants, volunteers, mentors, judges, workshop hosts, and photographers opens on {registration.participant.open.format('dddd, MMMM D [at] h:mm a')}.
 </p>
 
 <p class="mt-2">
 	Registration for participants closes on <span class="font-bold"
-		>Saturday, February 3 at 11:59 PM</span
+		>{registration.participant.close.format('dddd, MMMM D [at] h:mm a')}</span
 	>—this is a hard deadline; we do not accept submissions after this time.
 </p>
 <p class="mt-2">

src/eventdata/FAQComponents/FAQPrizes.svelte

@@ -12,5 +12,5 @@
 
 <p>
 	Major League Hacking and some of our partners also host their own Sponsored Prizes, which you can
-	explore when the 11.0 Devpost goes live.
+	explore when the 11.0 Student Guide goes live.
 </p>

src/eventdata/FAQComponents/FAQRegister.svelte

@@ -1,6 +1,10 @@
+<script>
+	import { registration } from "../../constants";
+</script>
+
 <ol class="list-decimal">
 	<li>
-		On Saturday, January 20 at 7:00 PM, a button will appear at the top of this site. Click it.
+		On {registration.participant.open.format('dddd, MMMM D [at] h:mm a')}, a button will appear at the top of this site. Click it.
 	</li>
 	<li class="mt-2">You will be redirected to a page where you can click the appropriate form.</li>
 	<li class="mt-2">

src/eventdata/FAQComponents/FAQWhen.svelte

@@ -0,0 +1,7 @@
+<script>
+	import { event } from "../../constants";
+</script>
+
+<p>
+	HackTJ will start on {event.start.format('dddd, MMMM D')} and run until {event.end.format('dddd, MMMM D')}.
+</p>

src/eventdata/FAQComponents/index.js

@@ -1,6 +1,7 @@
 import FAQCodeOfConduct from './FAQCodeOfConduct.svelte';
-import FAQRegister from './FAQRegister.svelte';
-import FAQPrizes from './FAQPrizes.svelte';
 import FAQDeadline from './FAQDeadline.svelte';
+import FAQPrizes from './FAQPrizes.svelte';
+import FAQRegister from './FAQRegister.svelte';
+import FAQWhen from './FAQWhen.svelte';
 
-export { FAQCodeOfConduct, FAQRegister, FAQPrizes, FAQDeadline };
+export { FAQCodeOfConduct, FAQDeadline, FAQPrizes, FAQRegister, FAQWhen };

src/eventdata/faq.js

@@ -2,7 +2,7 @@
  * This File contains all information needed for the FAQ page
  */
 
-import { FAQCodeOfConduct, FAQPrizes, FAQRegister, FAQDeadline } from './FAQComponents';
+import { FAQCodeOfConduct, FAQDeadline, FAQPrizes, FAQRegister, FAQWhen } from './FAQComponents';
 
 /**
  * Each object should be in the format
@@ -19,7 +19,7 @@ export default [
 	},
 	{
 		question: 'When is HackTJ?',
-		answer: 'HackTJ will start on Saturday, February 24 and run until Sunday, February 25.'
+		answerComponent: FAQWhen,
 	},
 	{
 		question: 'Who can attend?',

src/routes/index.svelte

@@ -9,6 +9,7 @@
 	import CloseButton from '../components/Index/CloseButton.svelte';
 	// import AboutCard from '../components/Index/AboutCard.svelte';
 	import Modal from 'svelte-simple-modal';
+	import { event, location, registration } from "../constants";
 	import { sponsorData, teamMembers } from '../eventdata';
 	import { googleMapsKey } from '../keys/.';
 
@@ -62,19 +63,21 @@
 			<div class="text-white font-bold text-6xl md:text-8xl">
 				HackTJ
 				<!-- TODO: `Overpass Mono`: -->
-				<sup class="text-3xl md:text-4xl font-mono align-super text-theme-100">11.0</sup>
+				<sup class="text-3xl md:text-4xl font-mono align-super text-theme-100">{event.iteration}</sup>
 			</div>
 			<h3 class="text-white font-medium text-xl md:text-2xl w-3/4">
 				<!-- <span class="text-theme-100 font-bold">March 4-5, Cvent</span>
 				<br /> -->
 				Build the next greatest thing - oh, and bring your friends along too.
 			</h3>
 			<div class="flex flex-col md:flex-row mt-6 space-y-3 md:space-y-0 space-x-0 md:space-x-3">
-				<a
-					href="{base}/register"
-					class="block text-center py-3 bg-theme-100 hover:bg-theme-200 text-blueberry-800 text-xl font-bold rounded-2xl px-8"
-					>&emsp;Register&emsp;</a
-				>
+				{#if registration.isOpen}
+					<a
+						href="{base}/register"
+						class="block text-center py-3 bg-theme-100 hover:bg-theme-200 text-blueberry-800 text-xl font-bold rounded-2xl px-8"
+						>&emsp;Register&emsp;</a
+					>
+				{/if}
 				<a
 					href="{base}/schedule"
 					class="block text-center py-3 bg-spruce-100 hover:bg-spruce-200 text-blueberry-800 text-xl font-bold rounded-2xl px-8"
@@ -164,8 +167,8 @@
 		<h3 class="mt-2 text-xl md:text-2xl font-bold text-blueberry-200">
 			Interested in sponsoring? Check out our <a
 				class="underline text-theme-100 hover:text-theme-200"
-				href="{base}/sponsorship11_0.pdf"
-				target="_blank">11.0 sponsorship packet</a
+				href="{base}/{event.sponsorshipPacket}"
+				target="_blank">{event.iteration} sponsorship packet</a
 			>
 			or email us at
 			<a class="underline text-theme-100 hover:text-theme-200" href="mailto:[email protected]"
@@ -206,12 +209,12 @@
 	>
 		<div class="w-full lg:w-2/3">
 			<h1 class="text-5xl md:text-7xl font-black text-white">Location</h1>
-			<h3 class="text-xl font-black text-white mt-3">Cvent HQ</h3>
+			<h3 class="text-xl font-black text-white mt-3">{location.name}</h3>
 			<h3 class="font-medium text-white mt-1">
-				1765 Greensboro Station Pl 7th Floor, McLean, VA 22102
+				{location.address}
 			</h3>
 			<a
-				href="https://goo.gl/maps/L23EwHCCucy7SjKf7"
+				href="{location.mapsLink}"
 				target="_blank"
 				rel="noopener noreferred"
 				class="block mt-4 text-center py-3 bg-theme-100 hover:bg-theme-200 text-blueberry-800 text-xl font-bold rounded-2xl"

src/routes/register.svelte

@@ -4,20 +4,27 @@
 	import Home from '@svicons/ionicons-solid/home.svelte';
 	import RegistrationColumn from '../components/Registration/RegistrationColumn.svelte';
 	import Footer from '../components/Footer.svelte';
+
+	import {event, registration} from "../constants";
 </script>
 
 <section class="text-blueberry-200 flex flex-col justify-between min-h-screen">
 	<div class="p-8 md:p-12 flex flex-col grow">
 		<a href="{base}/"><Home width="32px" class="text-theme-100 hover:text-theme-200" /></a>
 		<h1 class="text-5xl font-black text-white mt-8 mb-2">Registration</h1>
 		<p>
-			<!-- Participant registration will open on January 20, 2024 at 7:00 pm EST and will close on
-			February 3, 2024 at 11:59 pm EST. All attendees must adhere to the -->
-			<!-- Registration opened on January 20, 2024 at 7:00 pm EST and will close on February 3, 2024 at 11:59
-			pm EST. All attendees must adhere to the -->
-			Registration for participants closed on February 3, 2024 at 11:59 pm EST. You may still register
-			to be a mentor, judge, volunteer, photographer, or workshop host. All attendees must adhere to
-			the
+			{#if registration.participant.notOpenYet}
+				Participant registration will open on {registration.participant.open.format('MMMM D, YYYY [at] h:mm a')} and will close on
+				{registration.participant.close.format('MMMM D, YYYY [at] h:mm a')}.
+			{:else if registration.participant.isClosed}
+				Registration for participants closed on {registration.participant.close.format('MMMM D, YYYY [at] h:mm a')}.
+				{#if registration.other.isOpen}
+					You may still register to be a mentor, judge, volunteer, photographer, or workshop host.
+				{/if}
+			{:else}
+				Registration opened on {registration.participant.open.format('MMMM D, YYYY [at] h:mm a')} and will close on {registration.participant.close.format('MMMM D, YYYY [at] h:mm a')}.
+			{/if}
+			All attendees must adhere to the
 			<a
 				class="text-theme-100 hover:text-theme-200 underline"
 				href="https://static.mlh.io/docs/mlh-code-of-conduct.pdf"
@@ -32,7 +39,7 @@
 				title="Participant"
 				link="https://forms.gle/8CZHKSg2csL9ufEh6"
 				linkText="Participant Registration"
-				closed
+				closed="{!registration.participant.isOpen}"
 			>
 				<p>
 					Participants must be current high school students attending Fairfax County Public Schools.
@@ -49,6 +56,7 @@
 				title="Volunteer"
 				link="https://www.signupgenius.com/go/70A0F49A8AD22AAF58-47414114-hacktj"
 				linkText="Volunteer Registration"
+				closed="{!registration.other.isOpen}"
 			>
 				<p>
 					Volunteers help with various tasks during the hackathon, such as checking in participants,
@@ -59,6 +67,7 @@
 				title="Mentor/Judge"
 				link="https://forms.gle/vCxvt3tuCYoptUF76"
 				linkText="Mentor/Judge Registration"
+				closed="{!registration.other.isOpen}"
 			>
 				<p>
 					Judges must be present during the entire judging process (8:00 a.m. to 12:00 a.m. on
@@ -75,23 +84,25 @@
 				title="Workshop Host"
 				link="https://forms.gle/YqTw3Ng21dxeiMk5A"
 				linkText="Workshop Host Registration"
+				closed="{!registration.other.isOpen}"
 			>
 				<p>
 					Workshop Hosts hold a session on a CS topic of their liking, providing participants a
 					lesson on the topic and resources to learn more. These workshops will be conducted on
-					Saturday, February 24 from 2pm to 6pm. Hosting a workshop comes with perks like free food
+					{event.start.format('dddd, MMMM D')} from 2pm to 6pm. Hosting a workshop comes with perks like free food
 					and service hours!
 				</p>
 				<br />
 				<p>
 					Because of county regulations, workshop hosts who are not HackTJ participants must leave
-					by 10pm on Saturday, February 24.
+					by 10pm on {event.start.format('dddd, MMMM D')}.
 				</p>
 			</RegistrationColumn>
 			<RegistrationColumn
 				title="Photographer"
 				link="https://forms.gle/BYahZGAbYFdveiU18"
 				linkText="Photographer Registration"
+				closed="{!registration.other.isOpen}"
 			>
 				<p>
 					Photographers are only needed for 2 hours at a time (aside from the 2.5 hr shift on
@@ -101,7 +112,7 @@
 				<p>
 					Because of county regulations, only photographers who are part of Fairfax County Public
 					Schools will be able to sign up. Additionally, only HackTJ participants can sign up for
-					shifts after 10pm on Saturday, February 24.
+					shifts after 10pm on {event.start.format('dddd, MMMM D')}.
 				</p>
 			</RegistrationColumn>
 		</div>