import Conquer from '@burguillosinfo/conquer'
import MapState from '@burguillosinfo/conquer/map-state'

export default class CreateNode {
    private conquer: Conquer
    private createNodeSlide: HTMLElement

    constructor(conquer: Conquer) {
        this.conquer = conquer
        this.getCreateNodeCancel().addEventListener('click', () => {
            this.conquer.removeState(MapState.SELECT_WHERE_TO_CREATE_NODE)
            this.conquer.removeState(MapState.CREATE_NODE)
            this.conquer.addState(MapState.NORMAL)
        })
        this.getCreateNodeNewNodeElement().addEventListener('click', () => {
            const state = this.conquer.getState()
            if (state & MapState.SELECT_WHERE_TO_CREATE_NODE) {
                this.conquer.removeState(MapState.SELECT_WHERE_TO_CREATE_NODE)
                return
            }
            this.conquer.addState(MapState.SELECT_WHERE_TO_CREATE_NODE)
        })
    }

    private getCreateNodeCancel(): HTMLElement {
        const createNodeCancel = document.querySelector('#create-node-exit')
        if (createNodeCancel === null || !(createNodeCancel instanceof HTMLElement)) {
            Conquer.fail('Unable to find #create-node-exit.')
        }
        return createNodeCancel
    }

    private getCreateNodeNewNodeElement(): HTMLElement {
        const createNodeNewElement = document.querySelector('#create-node-new-node')
        if (createNodeNewElement === null || !(createNodeNewElement instanceof HTMLElement)) {
            Conquer.fail('Unable to find #create-node-slide.')
        }
        return createNodeNewElement
    }

    private getCreateNodeSlide(): HTMLElement {
        const createNodeSlide = document.querySelector('#create-node-slide')
        if (createNodeSlide === null || !(createNodeSlide instanceof HTMLElement)) {
            Conquer.fail('Unable to find #create-node-slide.')
        }
        return createNodeSlide
 
    }

    public refreshState() {
        if (!(this.conquer.getState() & MapState.CREATE_NODE)) {
            this.getCreateNodeSlide().classList.add('conquer-display-none')
            return
        }
        this.refreshCreateNodeNewNodeState()
        this.getCreateNodeSlide().classList.remove('conquer-display-none')

    }
    private refreshCreateNodeNewNodeState(): void {
        const createNodeNewNode = this.getCreateNodeNewNodeElement()
        if (this.conquer.getState() & MapState.SELECT_WHERE_TO_CREATE_NODE) {
            createNodeNewNode.innerText = 'Cancelar.'
        } else {
            createNodeNewNode.innerText = 'Crear nodo.'
        }
    }
}