import "./styles.css";

import { definePluginSettings } from "@api/Settings";
import { Devs } from "@utils/constants";
import definePlugin, { OptionType } from "@utils/types";
import { FluxDispatcher, ReactDOM, useEffect, useState } from "@webpack/common";
import { Root } from "react-dom/client";

let jumpscareRoot: Root | undefined;
let lastTriggerTime: number = 0; 

const settings = definePluginSettings({
    imageSource: {
        type: OptionType.STRING,
        description: "Sets the image url of the jumpscare",
        default: "https://github.com/surgedevs/VencordJumpscare/blob/main/defaultFiles/jumpscare-uhd.png?raw=true"
    },
    audioSource: {
        type: OptionType.STRING,
        description: "Sets the audio url of the jumpscare",
        default: "https://github.com/surgedevs/VencordJumpscare/blob/main/defaultFiles/jumpscareAudio.mp3?raw=true"
    },
    cooldown: {
        type: OptionType.NUMBER,
        description: "Cooldown time in milliseconds",
        default: 2000 
    }
});

function getJumpscareRoot(): Root {
    if (!jumpscareRoot) {
        const element = document.createElement("div");
        element.id = "jumpscare-root";
        element.classList.add("jumpscare-root");
        document.body.append(element);
        jumpscareRoot = ReactDOM.createRoot(element);
    }

    return jumpscareRoot;
}

export default definePlugin({
    name: "Jumpscare",
    description: "jumpscare effect when pressing F8. Inspired by Geometry Dash Mega Hack",
    authors: [Devs.surgedevs],
    settings,

    start() {
        getJumpscareRoot().render(
            <this.JumpscareComponent />
        );
    },

    stop() {
        jumpscareRoot?.unmount();
        jumpscareRoot = undefined;
    },

    JumpscareComponent() {
        const [isPlaying, setIsPlaying] = useState(false);
        const audio = new Audio(settings.store.audioSource);

        const jumpscare = () => {
            const now = Date.now();
            const cooldown = settings.store.cooldown;

            if (isPlaying || (now - lastTriggerTime) < cooldown) return;

            lastTriggerTime = now; 

            setIsPlaying(true);
            audio.play();

            setTimeout(() => {
                setIsPlaying(false);
            }, 1000);
        };

        useEffect(() => {
            const handleKeyDown = (event: KeyboardEvent) => {
                if (event.key === "F8") {
                    jumpscare();
                }
            };

            window.addEventListener("keydown", handleKeyDown);

            return () => {
                window.removeEventListener("keydown", handleKeyDown);
            };
        }, [isPlaying]);

        return <img className={`jumpscare-img ${isPlaying ? "jumpscare-animate" : ""}`} src={settings.store.imageSource} />;
    }
});