revision

public/javascript/chapa_sigmoide.js

@@ -5,7 +5,7 @@ for (const card of cards)
 	card.addEventListener('click', handleCardClick);
 }
 
-const content = document.querySelector('div.ficha .easteregg');
+const eastereggContainers = document.querySelectorAll('div.ficha:has(.easteregg)');
 
 const messageBox = document.getElementById('message-box');
 
@@ -16,28 +16,30 @@ const expandDuration = 5000;
 
 let hideTimeoutId = null;
 
-function hideContent() {
-	content.classList.remove('easteregg-visible');
-	content.classList.add('easteregg-hidden');
-	messageBox.textContent = '';
+function hideEastereggs() {
+	for (const div of eastereggContainers)
+	{
+		div.classList.remove('easteregg-visible');
+		div.classList.add('easteregg-hidden');
+	}
 }
 
-function expandContent() {
-	// Show content
-	content.classList.remove('easteregg-hidden');
-	content.classList.add('easteregg-visible');
-	messageBox.textContent = 'Secret content unlocked!';
+function expandEastereggs() {
+	for (const div of eastereggContainers)
+	{
+		div.classList.add('easteregg-visible');
+		div.classList.remove('easteregg-hidden');
+	}
 
 	// Clear any existing timeout and set a new one
 	if (hideTimeoutId) {
 		clearTimeout(hideTimeoutId);
 	}
 
-	hideTimeoutId = setTimeout(() => {
-		hideContent();
-		// Optionally reset the count after the content hides, 
-		// but we already reset it immediately below.
-	}, expandDuration);
+	hideTimeoutId = setTimeout(
+		() => { hideEastereggs(); },
+		expandDuration
+	);
 
 	clickCount = 0;
 }
@@ -51,26 +53,27 @@ function handleCardClick(event) {
 	{ element = element.parentElement }
 
 	element.classList.add('animate-shake');
-	setTimeout(() => {
-			element.classList.remove('animate-shake');
-	}, 300); // Duration of the shake animation
+
+	setTimeout(
+		() => { element.classList.remove('animate-shake'); },
+		300
+	);
 
 	// Determine if the click is 'in a row'
-	if (now - lastClickTime < clickThreshold) {
-			clickCount++;
-	} else {
-			clickCount = 1;
-			if (content.classList.contains('easteregg-visible')) {
-					hideContent();
-			}
+	if (now - lastClickTime < clickThreshold)
+	{ clickCount++; }
+	else
+	{
+		clickCount = 1;
+		if (element.classList.contains('easteregg-visible'))
+		{ hideEastereggs(); }
 	}
 	
 	lastClickTime = now;
 
 	// Check for the 3-click trigger
-	if (clickCount >= 3) {
-			expandContent();
-	}
+	if (clickCount >= 3)
+	{ expandEastereggs(); }
 }
 
-window.onload = () => { hideContent(); }
+window.onload = () => { hideEastereggs(); }