mirror of
https://github.com/HugeFrog24/shakethefrog.git
synced 2026-03-02 00:14:33 +00:00
Bugfix
This commit is contained in:
HugeFrog24
@@ -13,65 +13,76 @@ interface SpeechBubbleProps {
|
||||
export function SpeechBubble({ isShaken, triggerCount }: SpeechBubbleProps) {
|
||||
const [message, setMessage] = useState('');
|
||||
const [isVisible, setIsVisible] = useState(false);
|
||||
const [messageQueue, setMessageQueue] = useState<string[]>([]);
|
||||
const lastTriggerTime = useRef(0);
|
||||
const showTimeRef = useRef<number>(0);
|
||||
const lastFadeTime = useRef(0);
|
||||
|
||||
const getRandomMessage = useCallback(() => {
|
||||
const randomIndex = Math.floor(Math.random() * frogMessages.length);
|
||||
return frogMessages[randomIndex];
|
||||
}, []);
|
||||
|
||||
// Handle showing new messages
|
||||
// Handle new trigger events
|
||||
useEffect(() => {
|
||||
if (triggerCount === 0) return; // Skip initial mount
|
||||
if (triggerCount === 0) return;
|
||||
|
||||
const now = Date.now();
|
||||
const timeSinceLastMessage = now - lastTriggerTime.current;
|
||||
const timeSinceLastFade = now - lastFadeTime.current;
|
||||
|
||||
// Show new message if cooldown has expired
|
||||
if (timeSinceLastMessage >= COOLDOWN_MS) {
|
||||
// If we're in cooldown, or a message is visible, queue the new message
|
||||
if (timeSinceLastFade < COOLDOWN_MS || isVisible) {
|
||||
const newMessage = getRandomMessage();
|
||||
setMessageQueue(prev => [...prev, newMessage]);
|
||||
return;
|
||||
}
|
||||
|
||||
// Otherwise, show the message immediately
|
||||
lastTriggerTime.current = now;
|
||||
showTimeRef.current = now;
|
||||
const newMessage = getRandomMessage();
|
||||
setMessage(newMessage);
|
||||
setIsVisible(true);
|
||||
}, [triggerCount, getRandomMessage, isVisible]);
|
||||
|
||||
// Handle message queue
|
||||
useEffect(() => {
|
||||
if (messageQueue.length === 0 || isVisible) return;
|
||||
|
||||
const now = Date.now();
|
||||
const timeSinceLastFade = now - lastFadeTime.current;
|
||||
|
||||
// Only show next message if cooldown has expired
|
||||
if (timeSinceLastFade >= COOLDOWN_MS) {
|
||||
const nextMessage = messageQueue[0];
|
||||
setMessageQueue(prev => prev.slice(1)); // Remove the message from queue
|
||||
lastTriggerTime.current = now;
|
||||
showTimeRef.current = now;
|
||||
const newMessage = getRandomMessage();
|
||||
setMessage(newMessage);
|
||||
setMessage(nextMessage);
|
||||
setIsVisible(true);
|
||||
}
|
||||
}, [triggerCount, getRandomMessage]);
|
||||
}, [messageQueue, isVisible]);
|
||||
|
||||
// Handle visibility duration
|
||||
useEffect(() => {
|
||||
if (!isVisible) return;
|
||||
|
||||
const checkVisibility = setInterval(() => {
|
||||
const now = Date.now();
|
||||
const timeVisible = now - showTimeRef.current;
|
||||
const hideTimer = setTimeout(() => {
|
||||
setIsVisible(false);
|
||||
lastFadeTime.current = Date.now();
|
||||
}, VISIBILITY_MS);
|
||||
|
||||
if (timeVisible >= VISIBILITY_MS) {
|
||||
setIsVisible(false);
|
||||
}
|
||||
}, 100); // Check every 100ms
|
||||
|
||||
return () => {
|
||||
clearInterval(checkVisibility);
|
||||
};
|
||||
return () => clearTimeout(hideTimer);
|
||||
}, [isVisible]);
|
||||
|
||||
// Uncomment and modify the useEffect to control visibility based on isShaken prop
|
||||
// This will make the speech bubble stay visible even after shaking stops
|
||||
useEffect(() => {
|
||||
if (!isShaken) {
|
||||
// Don't hide the speech bubble when shaking stops
|
||||
// The visibility duration timer will handle hiding it
|
||||
return;
|
||||
}
|
||||
}, [isShaken]);
|
||||
|
||||
if (!isVisible) return null;
|
||||
|
||||
return (
|
||||
<div className="absolute -top-24 left-1/2 -translate-x-1/2 bg-white dark:bg-slate-800 px-4 py-2 rounded-xl shadow-lg animate-float z-20">
|
||||
<div
|
||||
className={`absolute -top-24 left-1/2 -translate-x-1/2 bg-white dark:bg-slate-800
|
||||
px-4 py-2 rounded-xl shadow-lg z-20 transition-opacity duration-300
|
||||
${isVisible ? 'opacity-100 animate-float' : 'opacity-0 pointer-events-none'}`}
|
||||
>
|
||||
<div className="relative">
|
||||
{message}
|
||||
{/* Triangle pointer */}
|
||||
<div className="absolute -bottom-6 left-1/2 -translate-x-1/2 w-0 h-0
|
||||
border-l-[8px] border-l-transparent
|
||||
border-r-[8px] border-r-transparent
|
||||
|
||||
@@ -1,89 +1,135 @@
|
||||
export const frogMessages = [
|
||||
"You got me! 🐸",
|
||||
"Keep shaking! 💫",
|
||||
"I feel dizzy! 😵💫",
|
||||
"That was fun! ⭐",
|
||||
"Do it again! 🎉",
|
||||
"I'm having a blast! 🌟",
|
||||
"Wheeee! 🎢",
|
||||
"You're good at this! 🌈",
|
||||
"I love this game! 💚",
|
||||
"One more time! ✨",
|
||||
"That tickles! 😄",
|
||||
"You found me! 🌿",
|
||||
"I'm so happy! 🥳",
|
||||
"Let's party! 🎵",
|
||||
"You're making me bounce! 💫",
|
||||
"I'm yours! 💝",
|
||||
"Shake me harder! 💖",
|
||||
"Don't stop now! 💕",
|
||||
"You're amazing! 💗",
|
||||
"I'm getting hot! 🔥",
|
||||
"I want more! 💘",
|
||||
"You're so good! 💓",
|
||||
"I'm all yours! 💞",
|
||||
"You drive me wild! 💥",
|
||||
"I'm melting! 💦",
|
||||
"I can't resist you! 💋",
|
||||
"You know what I like! 🌹",
|
||||
"I'm trembling! ⚡",
|
||||
"You're irresistible! 💫",
|
||||
"Make me yours! 💝",
|
||||
"I'm burning up! 🔥",
|
||||
"You're making me crazy! 💘",
|
||||
"I need you! 💖",
|
||||
"You're perfect! 💕",
|
||||
"I'm yours forever! 💗",
|
||||
"Take me! 💫",
|
||||
"You're incredible! ✨",
|
||||
"I'm on fire! 🔥",
|
||||
"You're my everything! 💝",
|
||||
"I'm in heaven! 💫",
|
||||
"Your touch is electric! ⚡",
|
||||
"You make me feel alive! 💖",
|
||||
"I'm addicted to you! 💕",
|
||||
"You're my obsession! 💗",
|
||||
"I can't get enough! 🔥",
|
||||
"More, more, more! 💘",
|
||||
"You're my desire! 💓",
|
||||
"I'm yours to command! 💞",
|
||||
"Unleash me! 💥",
|
||||
"You're my fantasy! 💋",
|
||||
"I crave your touch! 🌹",
|
||||
"I'm shaking with anticipation! ⚡",
|
||||
"You're my weakness! 💫",
|
||||
"Claim me! 💝",
|
||||
"I'm on the edge! 🔥",
|
||||
"You're driving me wild! 💘",
|
||||
"I surrender to you! 💖",
|
||||
"You're my masterpiece! 💕",
|
||||
"I'm yours for the taking! 💗",
|
||||
"Show me what you've got! 💫",
|
||||
"You're my temptation! ✨",
|
||||
"I'm consumed by you! 🔥",
|
||||
"You're my everything and more! 💝",
|
||||
"I'm lost in you! 💫",
|
||||
"You're my dream! 💖",
|
||||
"I'm under your spell! 💕",
|
||||
"You're my addiction! 💗",
|
||||
"I'm hooked on you! 🔥",
|
||||
"Give me all you've got! 💘",
|
||||
"You're my ultimate fantasy! 💓",
|
||||
"I'm yours, body and soul! 💞",
|
||||
"Take me to the edge! 💥",
|
||||
"I'm overflowing! 💦",
|
||||
"I yearn for your touch! 🌹",
|
||||
"I'm quivering with desire! ⚡",
|
||||
"You're my obsession! 💫",
|
||||
"Make me yours, completely! 💝",
|
||||
"I'm a furnace for you! 🔥",
|
||||
"You're driving me insane! 💘",
|
||||
"I'm completely yours! 💖",
|
||||
"You're absolute perfection! 💕",
|
||||
"I'm yours, now and forever! 💗",
|
||||
"Take me, I'm yours! 💫",
|
||||
"You're beyond incredible! ✨",
|
||||
"I'm a raging inferno! 🔥",
|
||||
"You're my heart's desire! 💝",
|
||||
"I'm in paradise! 💫"
|
||||
"Again! Again! ",
|
||||
"Almost got me! ",
|
||||
"Can't catch your breath? ",
|
||||
"Catch me if you can! ",
|
||||
"Chase me! ",
|
||||
"Claim me! ",
|
||||
"Come closer! ",
|
||||
"Do it again! ",
|
||||
"Don't stop now! ",
|
||||
"Faster! Faster! ",
|
||||
"Give me all you've got! ",
|
||||
"Higher! Higher! ",
|
||||
"I can dance all day! ",
|
||||
"I can't get enough! ",
|
||||
"I can't resist you! ",
|
||||
"I crave your touch! ",
|
||||
"I feel dizzy! ",
|
||||
"I like your style! ",
|
||||
"I love this game! ",
|
||||
"I need you! ",
|
||||
"I surrender to you! ",
|
||||
"I want more! ",
|
||||
"I yearn for your touch! ",
|
||||
"I'm a furnace for you! ",
|
||||
"I'm a raging inferno! ",
|
||||
"I'm addicted to you! ",
|
||||
"I'm all yours! ",
|
||||
"I'm burning up! ",
|
||||
"I'm completely yours! ",
|
||||
"I'm consumed by you! ",
|
||||
"I'm floating on air! ",
|
||||
"I'm getting dizzy! ",
|
||||
"I'm getting excited! ",
|
||||
"I'm getting hot! ",
|
||||
"I'm having a blast! ",
|
||||
"I'm having a blast! ",
|
||||
"I'm hooked on you! ",
|
||||
"I'm in a tizzy! ",
|
||||
"I'm in heaven! ",
|
||||
"I'm in paradise! ",
|
||||
"I'm lost in you! ",
|
||||
"I'm melting! ",
|
||||
"I'm on fire! ",
|
||||
"I'm on the edge! ",
|
||||
"I'm overflowing! ",
|
||||
"I'm quivering with desire! ",
|
||||
"I'm seeing stars! ",
|
||||
"I'm shaking with anticipation! ",
|
||||
"I'm so happy! ",
|
||||
"I'm trembling! ",
|
||||
"I'm under your spell! ",
|
||||
"I'm yours for the taking! ",
|
||||
"I'm yours forever! ",
|
||||
"I'm yours to command! ",
|
||||
"I'm yours! ",
|
||||
"I'm yours, body and soul! ",
|
||||
"I'm yours, now and forever! ",
|
||||
"Is that all you've got? ",
|
||||
"Keep shaking! ",
|
||||
"Keep the rhythm going! ",
|
||||
"Let's party! ",
|
||||
"Let's play more! ",
|
||||
"Like a record baby! ",
|
||||
"Make me yours! ",
|
||||
"Make me yours, completely! ",
|
||||
"Missed me! ",
|
||||
"More, more, more! ",
|
||||
"My heart's racing! ",
|
||||
"Neither can I! ",
|
||||
"One more time! ",
|
||||
"Playing hard to get? ",
|
||||
"Round and round we go! ",
|
||||
"Shake me harder! ",
|
||||
"Show me what you've got! ",
|
||||
"Show me your moves! ",
|
||||
"So close! ",
|
||||
"Spin me right round! ",
|
||||
"Stop tickling! ",
|
||||
"Take me to the edge! ",
|
||||
"Take me! ",
|
||||
"Take me, I'm yours! ",
|
||||
"That tickles! ",
|
||||
"That was fun! ",
|
||||
"Too slow! ",
|
||||
"Unleash me! ",
|
||||
"Wait till I catch you! ",
|
||||
"What a rush! ",
|
||||
"Wheeee! ",
|
||||
"Wheeeeeee! ",
|
||||
"You drive me wild! ",
|
||||
"You found me! ",
|
||||
"You got me! ",
|
||||
"You know how to party! ",
|
||||
"You know what I like! ",
|
||||
"You make me feel alive! ",
|
||||
"You're absolute perfection! ",
|
||||
"You're amazing! ",
|
||||
"You're beyond incredible! ",
|
||||
"You're driving me insane! ",
|
||||
"You're driving me wild! ",
|
||||
"You're fun! ",
|
||||
"You're getting better! ",
|
||||
"You're good at this! ",
|
||||
"You're incredible! ",
|
||||
"You're irresistible! ",
|
||||
"You're making me blush! ",
|
||||
"You're making me bounce! ",
|
||||
"You're making me bounce! ",
|
||||
"You're making me crazy! ",
|
||||
"You're making me giddy! ",
|
||||
"You're making me spin! ",
|
||||
"You're making me swoon! ",
|
||||
"You're making me twirl! ",
|
||||
"You're my addiction! ",
|
||||
"You're my desire! ",
|
||||
"You're my dream! ",
|
||||
"You're my everything and more! ",
|
||||
"You're my everything! ",
|
||||
"You're my fantasy! ",
|
||||
"You're my heart's desire! ",
|
||||
"You're my masterpiece! ",
|
||||
"You're my obsession! ",
|
||||
"You're my obsession! ",
|
||||
"You're my temptation! ",
|
||||
"You're my ultimate fantasy! ",
|
||||
"You're my weakness! ",
|
||||
"You're perfect! ",
|
||||
"You're so good! ",
|
||||
"You're so playful! ",
|
||||
"You're such a tease! ",
|
||||
"You're unstoppable! ",
|
||||
"You've got the magic touch! ",
|
||||
"Your touch is electric! "
|
||||
];
|
||||
Reference in New Issue
Block a user