feat: Add falling snowflake effect (in December and January)

2 files changed, 56 insertions, 0 deletions

diff --git a/src/scripts/snow-preload.js b/src/scripts/snow-preload.js
new file mode 100644
index 0000000..de13841
--- /dev/null
+++ b/src/scripts/snow-preload.js
@@ -0,0 +1,20 @@
+const today = new Date();
+
+// Enable snowflakes only in December and January
+const enableSnow = today.getMonth() == 11 || today.getMonth() == 0;
+
+const snowBtn = document.getElementById('snowBtn');
+const snowEnabledLabel = snowBtn.childNodes[0];
+const snowCont = document.createElement('div');
+
+if (enableSnow) {
+	snowBtn.classList.remove('nodisplay');
+
+	if (localStorage.getItem('snow') === 'off') {
+		snowCont.classList.add('noSnow');
+		snowEnabledLabel.innerText = 'Add';
+	}
+
+	snowCont.classList.add('snowContainer');
+	document.body.appendChild(snowCont);
+}
diff --git a/src/scripts/snow.js b/src/scripts/snow.js
new file mode 100644
index 0000000..a7eca9a
--- /dev/null
+++ b/src/scripts/snow.js
@@ -0,0 +1,36 @@
+if (enableSnow) {
+	// Parameters
+
+	const snowflakes = 80;
+
+	// Add snowflakes
+
+	function randInt(min, max) {
+		return Math.floor(Math.random() * (max - min + 1) ) + min;
+	}
+
+	for (let snowflakeI = 0; snowflakeI < snowflakes; snowflakeI++) {
+		const snowflake = document.createElement('div');
+		snowflake.classList.add(
+			'snowflake',
+			'snow-column-' + ((snowflakeI % 20) + 1),
+			'snow-start-'  + randInt(1, 20),
+			'snow-speed-'  + randInt(1, 9));
+		snowCont.appendChild(snowflake);
+	}
+
+	// Snowflake button
+
+	snowBtn.onclick = function() {
+		snowCont.classList.toggle('noSnow');
+
+		if (localStorage.getItem('snow') !== 'on') {
+			localStorage.setItem('snow', 'on');
+			snowEnabledLabel.innerText = 'Remove';
+		}
+		else {
+			snowEnabledLabel.innerText = 'Add';
+			localStorage.setItem('snow', 'off');
+		}
+	}
+}