import { useThree } from '@react-three/fiber'
import { useEffect } from 'react'
import { Object3D } from 'three';
import { useSubModuleStore } from '../../../../store/useModuleStore';
import { useLeftData, useTopData } from '../../../../store/visualization/useZone3DWidgetStore';
import { useEventsStore } from '../../../../store/simulation/useEventsStore';
import { useProductStore } from '../../../../store/simulation/useProductStore';
import { useSelectedProduct } from '../../../../store/simulation/useSimulationStore';
import { useSelectedAsset } from '../../../../store/simulation/useSimulationStore';

function AddOrRemoveEventsInProducts() {
    const { gl, raycaster, scene } = useThree();
    const { subModule } = useSubModuleStore();
    const { setTop } = useTopData();
    const { setLeft } = useLeftData();
    const { getIsEventInProduct } = useProductStore();
    const { getEventByModelUuid } = useEventsStore();
    const { selectedProduct } = useSelectedProduct();
    const { selectedAsset, setSelectedAsset, clearSelectedAsset } = useSelectedAsset();

    useEffect(() => {

        const canvasElement = gl.domElement;

        let drag = false;
        let isRightMouseDown = false;

        const onMouseDown = (evt: MouseEvent) => {
            if (selectedAsset) {
                clearSelectedAsset();
            }
            if (evt.button === 2) {
                isRightMouseDown = true;
                drag = false;
            }
        };

        const onMouseUp = (evt: MouseEvent) => {
            if (evt.button === 2) {
                isRightMouseDown = false;
            }
        }

        const onMouseMove = () => {
            if (isRightMouseDown) {
                drag = true;
            }
        };

        const handleRightClick = (evt: MouseEvent) => {
            if (drag) return;
            evt.preventDefault();
            const canvasElement = gl.domElement;
            if (!canvasElement) return;

            let intersects = raycaster.intersectObjects(scene.children, true);
            if (intersects.length > 0 && intersects[0]?.object?.parent?.parent?.position && intersects[0]?.object?.parent?.parent?.scale && intersects[0]?.object?.parent?.parent?.rotation) {
                let currentObject = intersects[0].object;

                while (currentObject) {
                    if (currentObject.name === "Scene") {
                        break;
                    }
                    currentObject = currentObject.parent as Object3D;
                }
                if (currentObject) {
                    const isInProduct = getIsEventInProduct(selectedProduct.productId, currentObject.uuid);

                    if (isInProduct) {
                        const event = getEventByModelUuid(currentObject.uuid);
                        if (event) {
                            setSelectedAsset(event)
                            const canvasRect = canvasElement.getBoundingClientRect();
                            const relativeX = evt.clientX - canvasRect.left;
                            const relativeY = evt.clientY - canvasRect.top;

                            setTop(relativeY);
                            setLeft(relativeX);
                        } else {
                            clearSelectedAsset()
                        }
                    } else {
                        const event = getEventByModelUuid(currentObject.uuid);
                        if (event) {
                            setSelectedAsset(event)
                            const canvasRect = canvasElement.getBoundingClientRect();
                            const relativeX = evt.clientX - canvasRect.left;
                            const relativeY = evt.clientY - canvasRect.top;

                            setTop(relativeY);
                            setLeft(relativeX);
                        } else {
                            clearSelectedAsset()
                        }
                    }

                }
            } else {
                clearSelectedAsset()
            }

        };

        if (subModule === 'simulations') {
            canvasElement.addEventListener("mousedown", onMouseDown);
            canvasElement.addEventListener("mouseup", onMouseUp);
            canvasElement.addEventListener("mousemove", onMouseMove);
            canvasElement.addEventListener('contextmenu', handleRightClick);
        }

        return () => {
            canvasElement.removeEventListener("mousedown", onMouseDown);
            canvasElement.removeEventListener("mouseup", onMouseUp);
            canvasElement.removeEventListener("mousemove", onMouseMove);
            canvasElement.removeEventListener('contextmenu', handleRightClick);
        };

    }, [gl, subModule, selectedProduct, selectedAsset]);
    return (
        <></>
    )
}

export default AddOrRemoveEventsInProducts