import { useNavigate } from "react-router-dom";
import { BackgroundImage, Image } from "@/components";
import { getStaticImage } from "@/utils";

export default function Home() {
  const navigate = useNavigate();

  const handleStartExperiment = () => {
    console.log("点击开启实验");
    // navigate("/experiment");
  };

  return (
    <BackgroundImage
      src={getStaticImage("menu/首页背景.png")}
      className="h-full w-full relative"
      backgroundSize="cover"
      backgroundPosition="center"
    >
      <Image
        src={getStaticImage("components/按钮-返回.png")}
        alt="返回"
        button
        className="absolute top-0 right-0"
        onClick={handleStartExperiment}
      />

      <BackgroundImage
        src={getStaticImage("menu/转盘合.png")}
        className="absolute w-full h-500 -bottom-1/5 left-0 pointer-events-none"
        backgroundSize="cover"
        backgroundPosition="center"
      ></BackgroundImage>
    </BackgroundImage>
  );
}