import React, { useEffect, useState } from "react"; import _ from "lodash"; import timerIcon from "../../../assets/icons/timer.svg"; import QuestionBox from "./Question"; import scroll from "../../../utils/scroll"; export default function Test({ title, duration, questions }) { const [translateY, setTranslateY] = useState(0); const [testPosition, setTestPosition] = useState(null); useEffect(() => { setTranslateY(() => scroll.linearFormula( window.scrollY > 5 * window.innerHeight ? 5 * window.innerHeight : window.scrollY, 0, -101, 4.5 * window.innerHeight, 5 * window.innerHeight ) ); window.addEventListener("scroll", () => { testTransformHandler(window.scrollY); if (window.scrollY > 1000) { localStorage.setItem( "testRect", JSON.stringify( document.getElementById("test").getBoundingClientRect() ) ); } }); }, []); const testTransformHandler = (scrollY) => { const height = window.innerHeight; if (scrollY <= 4.5 * height) { setTranslateY(() => 0); setTestPosition(() => null); } else if (scrollY > 4.5 * height && scrollY < 5 * height) { setTranslateY(() => scroll.linearFormula(scrollY, 0, -101, 4.5 * height, 5 * height) ); setTestPosition(() => null); } }; return (
e.stopPropagation()} id="test" className="w-full flex flex-col items-center justify-center bg-black bg-opacity-80 backdrop-filter backdrop-blur-2xl z-50" style={{ minHeight: window.innerHeight - 180, transform: `translateY(${translateY}%)`, position: testPosition ? "fixed" : "static", left: testPosition?.left ? testPosition?.left : "auto", top: testPosition?.top ? testPosition?.top : "auto", width: testPosition?.width ? testPosition?.width : "auto", height: testPosition?.height ? testPosition?.height : "auto", }} >

{title}

{_.join(["زمان باقیمانده", duration], " ")}
{questions.map((question, index) => ( ))}
); } Test.defaultProps = { title: "آزمون شیمی پایه دوازدهم متوسطه", duration: "48:29", questions: [ { text: "نظر شما نسبت به تحولات جنوب غرب آسیا به ویژه حوزه دریای عمان و خلیج فارس چیست؟", options: [ "امکان دارد شاید و یا یک چیز دیگر", "امکان دارد شاید و یا یک چیز دیگرر", "امکان دارد شاید و یا یک چیز دیگرر", "امکان دارد شاید و یا یک چیز دیگررر", ], }, ], };