Skip to content

Commit 8d062fa

Browse files
josegomez-devjosegomez-dev
committed
fix(games): improve level-up threshold detection in InfiniteRunner
1 parent 2e04a40 commit 8d062fa

File tree

1 file changed

+34
-38
lines changed

1 file changed

+34
-38
lines changed

‎components/games/InfiniteRunner.tsx‎

Lines changed: 34 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1011,7 +1011,11 @@ const InfiniteRunner: React.FC<InfiniteRunnerProps> = ({ gameId, gameTitle, embe
10111011
const newScore = shouldIncrement ? s + 1 : s;
10121012

10131013
// Level up at 1000, 2000, 3000, 4000, 5000, etc.
1014-
if (newScore > 0 && newScore % 1000 === 0 && newScore !== lastLevelUpScore) {
1014+
// Check if we've crossed a 1000-point threshold (handles cases where score jumps past exact multiples)
1015+
const currentThreshold = Math.floor(newScore / 1000);
1016+
const lastThreshold = Math.floor(lastLevelUpScore / 1000);
1017+
1018+
if (newScore > 0 && currentThreshold > lastThreshold) {
10151019
setLastLevelUpScore(newScore);
10161020

10171021
// Play level up sound
@@ -1267,7 +1271,34 @@ const InfiniteRunner: React.FC<InfiniteRunnerProps> = ({ gameId, gameTitle, embe
12671271
playerTop < coinBottom &&
12681272
playerBottom > coin.y
12691273
) {
1270-
setScore(s => s + 50);
1274+
setScore(s => {
1275+
const newScore = s + 50;
1276+
1277+
// Check if collecting this coin causes a level-up threshold crossing
1278+
const currentThreshold = Math.floor(newScore / 1000);
1279+
const lastThreshold = Math.floor(lastLevelUpScore / 1000);
1280+
1281+
if (newScore > 0 && currentThreshold > lastThreshold) {
1282+
setLastLevelUpScore(newScore);
1283+
1284+
// Play level up sound
1285+
if (levelUpSoundRef.current) {
1286+
levelUpSoundRef.current.currentTime = 0;
1287+
levelUpSoundRef.current.play().catch(() => {});
1288+
}
1289+
1290+
// Pause game and show quiz
1291+
setTimeout(() => {
1292+
setGameState('paused');
1293+
setShowQuiz(true);
1294+
setCurrentQuestion(Math.floor(Math.random() * quizQuestions.length));
1295+
setQuizAnswered(false);
1296+
setIsAnswerCorrect(false);
1297+
}, 100);
1298+
}
1299+
1300+
return newScore;
1301+
});
12711302

12721303
// Play grab coin sound
12731304
if (grabCoinSoundRef.current) {
@@ -1756,10 +1787,6 @@ const InfiniteRunner: React.FC<InfiniteRunnerProps> = ({ gameId, gameTitle, embe
17561787
<circle cx="15" cy="15" r="16" className="fill-blue-400" opacity="0.4">
17571788
<animate attributeName="r" values="16;18;16" dur="0.6s" repeatCount="indefinite" />
17581789
</circle>
1759-
{/* Core plasma ball */}
1760-
<circle cx="15" cy="15" r="12" className="fill-cyan-300" stroke="#00FFFF" strokeWidth="2" opacity="0.9" />
1761-
<circle cx="15" cy="15" r="10" className="fill-blue-500" opacity="0.7" />
1762-
<circle cx="15" cy="15" r="8" className="fill-white" opacity="0.8" />
17631790
{/* Electric arcs */}
17641791
<path d="M 15 3 Q 12 8 15 15" stroke="#00FFFF" strokeWidth="1.5" fill="none" opacity="0.8">
17651792
<animate attributeName="opacity" values="0.8;0.3;0.8" dur="0.3s" repeatCount="indefinite" />
@@ -2015,24 +2042,6 @@ const InfiniteRunner: React.FC<InfiniteRunnerProps> = ({ gameId, gameTitle, embe
20152042
{/* Sweat/Speed effect droplets around character - Rendered on top */}
20162043
{gameState === 'playing' && (
20172044
<g>
2018-
{/* Sweat droplet 1 */}
2019-
<ellipse cx="30" cy="-5" rx="2" ry="3" className="fill-cyan-300" opacity="0.7">
2020-
<animate attributeName="cx" values="30;35;40" dur="0.6s" repeatCount="indefinite" />
2021-
<animate attributeName="cy" values="-5;-10;-15" dur="0.6s" repeatCount="indefinite" />
2022-
<animate attributeName="opacity" values="0.7;0.5;0" dur="0.6s" repeatCount="indefinite" />
2023-
</ellipse>
2024-
{/* Sweat droplet 2 */}
2025-
<ellipse cx="20" cy="-2" rx="1.5" ry="2.5" className="fill-blue-300" opacity="0.6">
2026-
<animate attributeName="cx" values="20;24;28" dur="0.8s" repeatCount="indefinite" />
2027-
<animate attributeName="cy" values="-2;-6;-10" dur="0.8s" repeatCount="indefinite" />
2028-
<animate attributeName="opacity" values="0.6;0.4;0" dur="0.8s" repeatCount="indefinite" />
2029-
</ellipse>
2030-
{/* Sweat droplet 3 */}
2031-
<ellipse cx="25" cy="-7" rx="1.8" ry="2.8" className="fill-cyan-400" opacity="0.8">
2032-
<animate attributeName="cx" values="25;28;32" dur="0.7s" repeatCount="indefinite" begin="0.2s" />
2033-
<animate attributeName="cy" values="-7;-11;-15" dur="0.7s" repeatCount="indefinite" begin="0.2s" />
2034-
<animate attributeName="opacity" values="0.8;0.5;0" dur="0.7s" repeatCount="indefinite" begin="0.2s" />
2035-
</ellipse>
20362045
{/* Speed line 1 */}
20372046
<line x1="15" y1="0" x2="5" y2="2" stroke="#FFFFFF" strokeWidth="1.5" opacity="0.4">
20382047
<animate attributeName="opacity" values="0.4;0.6;0" dur="0.5s" repeatCount="indefinite" />
@@ -2043,20 +2052,7 @@ const InfiniteRunner: React.FC<InfiniteRunnerProps> = ({ gameId, gameTitle, embe
20432052
<animate attributeName="opacity" values="0.3;0.5;0" dur="0.6s" repeatCount="indefinite" begin="0.1s" />
20442053
<animate attributeName="x1" values="18;12;6" dur="0.6s" repeatCount="indefinite" begin="0.1s" />
20452054
</line>
2046-
{/* Energy spark 1 */}
2047-
<circle cx="32" cy="-2" r="1.5" className="fill-yellow-300" opacity="0.9">
2048-
<animate attributeName="cx" values="32;36;40" dur="0.4s" repeatCount="indefinite" />
2049-
<animate attributeName="cy" values="-2;-4;-6" dur="0.4s" repeatCount="indefinite" />
2050-
<animate attributeName="opacity" values="0.9;0.6;0" dur="0.4s" repeatCount="indefinite" />
2051-
<animate attributeName="r" values="1.5;2;0.5" dur="0.4s" repeatCount="indefinite" />
2052-
</circle>
2053-
{/* Energy spark 2 */}
2054-
<circle cx="22" cy="-5" r="1.2" className="fill-orange-300" opacity="0.8">
2055-
<animate attributeName="cx" values="22;26;30" dur="0.5s" repeatCount="indefinite" begin="0.15s" />
2056-
<animate attributeName="cy" values="-5;-7;-9" dur="0.5s" repeatCount="indefinite" begin="0.15s" />
2057-
<animate attributeName="opacity" values="0.8;0.5;0" dur="0.5s" repeatCount="indefinite" begin="0.15s" />
2058-
<animate attributeName="r" values="1.2;1.8;0.5" dur="0.5s" repeatCount="indefinite" begin="0.15s" />
2059-
</circle>
2055+
20602056
</g>
20612057
)}
20622058
</g>

0 commit comments

Comments
 (0)