diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx index 17fd2e6..814a2c6 100644 --- a/src/pages/Home.tsx +++ b/src/pages/Home.tsx @@ -33,6 +33,7 @@ const Home = () => { try { const stream = await navigator.mediaDevices.getUserMedia({ video: true, + }); if (videoRef.current) { diff --git a/src/pages/Kuis/MenyusunHuruf/Quiz.tsx b/src/pages/Kuis/MenyusunHuruf/Quiz.tsx index afb8942..eaa65a7 100644 --- a/src/pages/Kuis/MenyusunHuruf/Quiz.tsx +++ b/src/pages/Kuis/MenyusunHuruf/Quiz.tsx @@ -180,6 +180,8 @@ const Quiz = () => { answerTime = answerTime += elapsedTime; noSoal++; + tempAnswer = ""; + setAnswer(""); if (noSoal === quizStore.listSoal.length) { quizStore.setTime(answerTime); diff --git a/src/pages/Kuis/TebakHuruf/Quiz.tsx b/src/pages/Kuis/TebakHuruf/Quiz.tsx index 3343271..3e373dd 100644 --- a/src/pages/Kuis/TebakHuruf/Quiz.tsx +++ b/src/pages/Kuis/TebakHuruf/Quiz.tsx @@ -17,6 +17,15 @@ import Swal from "sweetalert2"; // acc: String; // }; +const imagesToPreload = ["/assets/gif/betul.gif", "/assets/gif/salah.gif"]; + +const preloadImages = () => { + imagesToPreload.forEach((src) => { + const img = new Image(); + img.src = src; + }); +}; + const Quiz = () => { const videoRef = useRef(null); const [loadCamera, setLoadCamera] = useState(false); @@ -150,8 +159,9 @@ const Quiz = () => { setShowAnswer(true); setTimeout(() => { - isLoading = false; setShowAnswer(false); + + isLoading = false; setProgress(0); noSoal++; previousResult = []; @@ -231,6 +241,7 @@ const Quiz = () => { useEffect(() => { store.setNavSelected("kuis"); + preloadImages(); loadModel(); startWebcam(); @@ -249,7 +260,7 @@ const Quiz = () => {
{ ? "betul" : "salah" }.gif`} + loading="eager" + fetchPriority="high" alt={`Jawaban ${ quizStore.jawaban[quizStore.soalIndex]?.isCorrect ? "Benar"