"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.VisualSelectionEventHandler = void 0;
const domUtils_1 = require("../../sharedUtils/domUtils");
const actionTypes_1 = require("../../sharedUtils/actionTypes");
class VisualSelectionEventHandler {
    constructor(store) {
        this.store = store;
        this.isSelecting = false;
        this.startX = 0;
        this.startY = 0;
        this.boundMouseDown = this.handleMouseDown.bind(this);
        this.boundMouseMove = this.handleMouseMove.bind(this);
        this.boundMouseUp = this.handleMouseUp.bind(this);
    }
    activate(stepId) {
        if (this.overlay) {
            return;
        }
        this.stepId = stepId;
        this.createOverlay();
        this.attachEventListeners();
    }
    deactivate() {
        this.removeEventListeners();
        (0, domUtils_1.removeOverlayById)(domUtils_1.MABL_VISUAL_SELECTION_OVERLAY_ID);
        this.overlay = undefined;
        this.resetSelection();
    }
    createOverlay() {
        (0, domUtils_1.renderSelectionOverlay)({
            innerTextDisplayed: '',
            overlayId: domUtils_1.MABL_VISUAL_SELECTION_OVERLAY_ID,
            addHighlightBox: false,
            overlayClassname: domUtils_1.MABL_VISUAL_SELECTION_OVERLAY_CLASS,
        });
        this.overlay = document.getElementById(domUtils_1.MABL_VISUAL_SELECTION_OVERLAY_ID);
        this.selectionRect = document.createElement('div');
        this.selectionRect.id = 'mabl-selection-rect';
        this.selectionRect.classList.add(domUtils_1.MABL_VISUAL_SELECTION_RECT_CLASS);
        this.overlay.appendChild(this.selectionRect);
    }
    attachEventListeners() {
        if (this.overlay) {
            this.overlay.addEventListener('mousedown', this.boundMouseDown);
            this.overlay.addEventListener('mousemove', this.boundMouseMove);
            this.overlay.addEventListener('mouseup', this.boundMouseUp);
        }
    }
    removeEventListeners() {
        if (this.overlay) {
            this.overlay.removeEventListener('mousedown', this.boundMouseDown);
            this.overlay.removeEventListener('mousemove', this.boundMouseMove);
            this.overlay.removeEventListener('mouseup', this.boundMouseUp);
        }
    }
    handleMouseDown(e) {
        this.isSelecting = true;
        this.startX = e.clientX;
        this.startY = e.clientY;
        if (this.selectionRect) {
            this.selectionRect.style.left = this.startX + 'px';
            this.selectionRect.style.top = this.startY + 'px';
            this.selectionRect.style.width = '0px';
            this.selectionRect.style.height = '0px';
            this.selectionRect.style.display = 'block';
        }
    }
    handleMouseMove(e) {
        if (!this.isSelecting || !this.selectionRect) {
            return;
        }
        const currentX = e.clientX;
        const currentY = e.clientY;
        const left = Math.min(this.startX, currentX);
        const top = Math.min(this.startY, currentY);
        const width = Math.abs(currentX - this.startX);
        const height = Math.abs(currentY - this.startY);
        this.selectionRect.style.left = left + 'px';
        this.selectionRect.style.top = top + 'px';
        this.selectionRect.style.width = width + 'px';
        this.selectionRect.style.height = height + 'px';
    }
    handleMouseUp(e) {
        if (!this.isSelecting) {
            return;
        }
        this.isSelecting = false;
        const currentX = e.clientX;
        const currentY = e.clientY;
        const left = Math.min(this.startX, currentX);
        const top = Math.min(this.startY, currentY);
        const width = Math.abs(currentX - this.startX);
        const height = Math.abs(currentY - this.startY);
        if (width > 10 && height > 10) {
            const viewportWidth = window.innerWidth;
            const viewportHeight = window.innerHeight;
            this.selectionData = {
                x: left / viewportWidth,
                y: top / viewportHeight,
                width: width / viewportWidth,
                height: height / viewportHeight,
            };
            this.onSelectionComplete(this.selectionData);
        }
    }
    onSelectionComplete(selection) {
        try {
            const stepId = this.stepId;
            this.deactivate();
            this.store.dispatch((0, actionTypes_1.selectAreaForVisualFind)(stepId, selection));
        }
        catch (error) {
            console.error('Error setting selection:', error);
        }
    }
    resetSelection() {
        this.isSelecting = false;
        this.startX = 0;
        this.startY = 0;
        this.selectionData = undefined;
        this.stepId = undefined;
    }
    getSelectionData() {
        return this.selectionData;
    }
}
exports.VisualSelectionEventHandler = VisualSelectionEventHandler;
