diff --git a/Caecae/src/components/RacingGame/RacingGame.tsx b/Caecae/src/components/RacingGame/RacingGame.tsx index 6669840..153b1ca 100644 --- a/Caecae/src/components/RacingGame/RacingGame.tsx +++ b/Caecae/src/components/RacingGame/RacingGame.tsx @@ -99,16 +99,6 @@ const RacingGame: React.FC = () => { }, fadeInterval); }; - const handleSpacebar = (event: KeyboardEvent) => { - if (event.code === "Space" && state.gameStatus === "playing" && !animationCompletedRef.current) { - // animationCompletedRef.current = true - event.preventDefault(); - document.removeEventListener("keydown", handleSpacebar); - - handleSmoothlyStop(); - } - }; - const handlePlayGame = () => { stopingMusicReset(); playingMusicPlay(); @@ -160,25 +150,44 @@ const RacingGame: React.FC = () => { const baseShareUrl = "http://www.caecae.kro.kr/a/" const shareUrl = baseShareUrl + shortUrl; - navigator.clipboard.writeText(shareUrl) - .then(() => { - setShowMessage(true); - + let textArea = document.createElement("textarea"); + textArea.value = shareUrl; + + textArea.style.position = "fixed"; + textArea.style.left = "-9999px"; + textArea.style.top = "-9999px"; + + document.body.appendChild(textArea); + textArea.select(); + + return new Promise((res, rej) => { + if (document.execCommand('copy')) { + res(shareUrl) + }else { + rej(); + } + textArea.remove(); + }).then(() => { + setShowMessage(true); + + setTimeout(() => { + setAnimate(true); + setTimeout(() => { - setAnimate(true); - + setAnimate(false); + setTimeout(() => { - setAnimate(false); - - setTimeout(() => { - setShowMessage(false); - setIsAnimating(false); - }, 500); - - }, 3000); - - }, 10); - }); + setShowMessage(false); + setIsAnimating(false); + }, 500); + + }, 3000); + + }, 10); + }).catch((error) => { + console.error("클립보드 복사 실패:", error); + setIsAnimating(false); + }); }catch(error) { console.error("단축 Url api 호출 실패:", error); } @@ -187,6 +196,15 @@ const RacingGame: React.FC = () => { fetchData(); } + const handleSpacebar = (event: KeyboardEvent) => { + if (event.code === "Space" && state.gameStatus === "playing" && !animationCompletedRef.current) { + event.preventDefault(); + document.removeEventListener("keydown", handleSpacebar); + + handleSmoothlyStop(); + } + }; + useEffect(() => { const frontBackgroundImg = new Image(); frontBackgroundImg.src = frontBackground; diff --git a/Caecae/src/features/FindingGameLanding/LadingPageTitle.tsx b/Caecae/src/features/FindingGameLanding/LadingPageTitle.tsx index d6ffd0a..23b8d41 100644 --- a/Caecae/src/features/FindingGameLanding/LadingPageTitle.tsx +++ b/Caecae/src/features/FindingGameLanding/LadingPageTitle.tsx @@ -14,32 +14,48 @@ const LadingPageTitle = ({ onClick }: LadingPageTitleProps) => { setIsAnimating(true); const url: string = window.location.href; - navigator.clipboard - .writeText(url) - .then(() => { - setShowMessage(true); + let textArea = document.createElement("textarea"); + textArea.value = url; + + textArea.style.position = "fixed"; + textArea.style.left = "-9999px"; + textArea.style.top = "-9999px"; + + document.body.appendChild(textArea); + textArea.select(); + + return new Promise((res, rej) => { + if (document.execCommand('copy')) { + res(url) + }else { + rej(); + } + textArea.remove(); + }).then(() => { + setShowMessage(true); + + setTimeout(() => { + setAnimate(true); setTimeout(() => { - setAnimate(true); + setAnimate(false); setTimeout(() => { - setAnimate(false); + setShowMessage(false); + setIsAnimating(false); + }, 500); - setTimeout(() => { - setShowMessage(false); - setIsAnimating(false); - }, 500); - }, 3000); - }, 10); - }) - .catch((err: Error) => { - console.error("URL 복사에 실패했습니다.", err); - setIsAnimating(false); - }); + }, 3000); + + }, 10); + }).catch((err: Error) => { + console.error('URL 복사에 실패했습니다.', err); + setIsAnimating(false); + }); }; return ( <> -
+

CASPER Electric 신차 diff --git a/Caecae/src/features/RacingGameLanding/EventIntro.tsx b/Caecae/src/features/RacingGameLanding/EventIntro.tsx index 761a8c9..2f26321 100644 --- a/Caecae/src/features/RacingGameLanding/EventIntro.tsx +++ b/Caecae/src/features/RacingGameLanding/EventIntro.tsx @@ -15,29 +15,44 @@ const EventIntro: React.FC = ({isEventOpen}) => { setIsAnimating(true); const url: string = window.location.href; - navigator.clipboard.writeText(url) - .then(() => { - setShowMessage(true); + let textArea = document.createElement("textarea"); + textArea.value = url; + + textArea.style.position = "fixed"; + textArea.style.left = "-9999px"; + textArea.style.top = "-9999px"; + + document.body.appendChild(textArea); + textArea.select(); + + return new Promise((res, rej) => { + if (document.execCommand('copy')) { + res(url) + }else { + rej(); + } + textArea.remove(); + }).then(() => { + setShowMessage(true); + + setTimeout(() => { + setAnimate(true); setTimeout(() => { - setAnimate(true); + setAnimate(false); setTimeout(() => { - setAnimate(false); - - setTimeout(() => { - setShowMessage(false); - setIsAnimating(false); - }, 500); + setShowMessage(false); + setIsAnimating(false); + }, 500); - }, 3000); - - }, 10); - }) - .catch((err: Error) => { - console.error('URL 복사에 실패했습니다.', err); - setIsAnimating(false); - }); + }, 3000); + + }, 10); + }).catch((err: Error) => { + console.error('URL 복사에 실패했습니다.', err); + setIsAnimating(false); + }); }; const checkEventOpen = () => {