diff --git a/CHANGELOG.md b/CHANGELOG.md index be3195ecb..96a5a9865 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -11,7 +11,10 @@ --- -#### Version 3.39 +#### Version 3.39.1 +- **New**: The Hieroglyphs mode now has animation and vibration when toggled + +#### Version 3.39 (30.03.2025) - **New**: Prima Aprilis hieroglyphs joke #### Version 3.38 (11.03.2025) diff --git a/package.json b/package.json index d4cb70671..134fab931 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,7 @@ "slowoku" ], "private": true, - "version": "3.39", + "version": "3.39.1", "type": "module", "scripts": { "dev": "vite --port 3001", diff --git a/public/prima-aprilis/fake-hieroglyphs.css b/public/prima-aprilis/fake-hieroglyphs.css index 28c1e0704..ecd734771 100644 --- a/public/prima-aprilis/fake-hieroglyphs.css +++ b/public/prima-aprilis/fake-hieroglyphs.css @@ -25,8 +25,56 @@ body[data-prima-aprilis="egypt"] { .header-title, - .keyboard, .game { - font-family: "PrimaAprimaFont", "Adobe Blank", "Baloo 2", sans-serif !important; + animation: fakeHieroglyphs 0.5s ease-in-out forwards; + } + + .key > span:first-child { + transform: scale(1.5); + animation: fakeHieroglyphsKey 0.5s ease-in-out forwards; + } +} + +@keyframes fakeHieroglyphs { + 0% { + font-family: "PrimaAprimaFont", "Adobe Blank", "Baloo 2", sans-serif; + } + + 20% { + font-family: inherit; + } + + 45% { + font-family: "PrimaAprimaFont", "Adobe Blank", "Baloo 2", sans-serif; + } + + 75% { + font-family: inherit; + } + + 100% { + font-family: "PrimaAprimaFont", "Adobe Blank", "Baloo 2", sans-serif; + } +} + +@keyframes fakeHieroglyphsKey { + 0% { + scale: 1.2; + } + + 20% { + scale: 1; + } + + 45% { + scale: 1.5; + } + + 75% { + scale: 1; + } + + 100% { + scale: 1.2; } } diff --git a/src/features/primaAprilisHieroglyphs/hooks/useAprilFoolsJokeIfApplicable.ts b/src/features/primaAprilisHieroglyphs/hooks/useAprilFoolsJokeIfApplicable.ts index 512553e6b..f3b342b0a 100644 --- a/src/features/primaAprilisHieroglyphs/hooks/useAprilFoolsJokeIfApplicable.ts +++ b/src/features/primaAprilisHieroglyphs/hooks/useAprilFoolsJokeIfApplicable.ts @@ -40,10 +40,23 @@ export default function useAprilFoolsJokeIfApplicable() { if (shouldAddScript) { const moreThan0Guesses = guessesLenght > 0; const emptyWordToSubmit = wordToSubmit.length === 0; - const validStatus = [GameStatus.Guessing, GameStatus.Won, GameStatus.Lost].includes(status); + const validStatus = [ + GameStatus.Guessing, + GameStatus.Won, + GameStatus.Lost, + ].includes(status); const shouldUseJoke = moreThan0Guesses && emptyWordToSubmit && validStatus; - document.body.setAttribute('data-prima-aprilis', shouldUseJoke ? 'egypt' : ''); + const newValue = shouldUseJoke ? 'egypt' : ''; + const currentValue = document.body.getAttribute('data-prima-aprilis'); + + if (currentValue !== newValue) { + document.body.setAttribute('data-prima-aprilis', newValue); + + if (navigator.vibrate) { + navigator.vibrate(shouldUseJoke ? [50, 100, 50, 10, 50, 100] : 50); + } + } } }, [shouldAddScript, status, guessesLenght, wordToSubmit.length]); }