Merge pull request #2 from Outfit8TSB/patch-2

Patch 2

index.html

@@ -1484,16 +1484,47 @@ <h2>What was that countdown thing though?</h2>
 								Play now!
 							</button>
 						</div>
-						<h2>Community content:</h2>
+                                                <div class="jan1-popup-content">
+						<div>
+							<h1>HAPPY GALACTIC NEW YEAR  ☄️ ☄️ ☄️ ☄️ ☄️ ☄️ ☄️</h1>
+							<em>A day of chaos and destruction, Reset and all things <strong> and send all of players to new canvas.</strong></em>
+							<a class="hidden-question" href="javascript:alert('Doesn\'t matter, The Canvas will reset...')">It's not New Years Eve! </a>
+						</div>
+						<h2>What is that countdown thing though?</h2>
+						<p>
+							you are currently playing on Darkplace.
+							i can say that you are going to experience comet.
+							Literally, there will be falling meteors, explosives on your canvas.
+							happy galactic new years eve on new canvas!
+
+						</p>
+							<h2>Storyboard</h2>						
+							<p>
+The year 1997 has arrived. 
+A herd of Outfit8TSB Related Characthers run to one place and it's rushing from the mainland.
+Outfit8TSB gave you this 32 color weapon!
+
+Use the 32 palette weapon to fill the 2000x2000 canvas!
+
+                                                        </p>
+						<div style="position: relative;">
+							<img src="images/august21-cover.png" style="width: 100%;height: 100%;flex-grow: 1;border-radius: 4px;">
+							<span id="august21PopupLabel" style="border-radius: 100px; height: 24px; background: var(--ui-panel-bg); display: flex; column-gap: 4px;position: absolute;left: 50%;top: 50%;transform: translate(-50%);padding: 5px;line-height: 15px;background: white;">
+								<img src="svg/lock.svg" height="16" width="16">
+								Coming soon!
+								<span id="august21PopupTimer"></span>
+							</span>
+						</div>
+						<h2>How to play:</h2>
 						<p>
-							Discover the lore, learn more, get involved, spread it everywhere. See what others have
-							made for August 21st...
+							1. after you experienced a galactic explosion, you will see a 32 color palette.
+							2. you may place wherever in 2kx2k canvas.
 						</p>
 						<iframe src="https://www.youtube-nocookie.com/embed/opk9bwZczS8?si=Pem-cNwy7YN-8tLY" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
 						<iframe src="https://www.youtube-nocookie.com/embed/92cLXnRCIZw?si=YRCyHUc08AxDFNK5" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
 						<h2>So what now?</h2>
 						<p>
-							You wait. You look. Turn your eye. Look to andromeda. Do you see it?
+							You experience comet and galactic explosions on your canvas you are playing on at jan 1 2025.
 						</p>
 					</div>
 				</div>

january1st.js

@@ -0,0 +1,15 @@
+// Show game popup
+const eventDate = 1735689600000
+const popup = document.getElementById("popup")
+popup.showModal()
+
+setInterval(() => {
+    august21PopupTimer.textContent = ` (${toCountdownString(eventDate)})`
+}, 1000)
+
+startCountDown(eventDate, false).then((async) => {
+    august21PopupTimer.style.display = "none"
+    // TODO: Reimplement on game release
+    august21PopupLabel.style.display = "none"
+    august21PopupButton.style.display = "flex"
+})