import {Controller} from '@hotwired/stimulus';

export default class extends Controller {
    static targets = ['map', 'placeholder', 'info'];

    declare readonly mapTarget: HTMLElement;
    declare readonly placeholderTarget: HTMLElement;
    declare readonly infoTarget: HTMLElement;

    connect() {
        if (localStorage.getItem('mapbox-consent') === 'true') {
            this.showMap();
        } else {
            this.showPlaceholder();
        }
    }

    giveConsent() {
        localStorage.setItem('mapbox-consent', 'true');
        this.showMap();
        window.dispatchEvent(new CustomEvent('mapbox-consent-given'));
    }

    toggleInfo() {
        this.infoTarget.classList.toggle('hidden');
    }

    private showMap() {
        this.mapTarget.classList.remove('hidden');
        this.placeholderTarget.classList.add('hidden');
    }

    private showPlaceholder() {
        this.mapTarget.classList.add('hidden');
        this.placeholderTarget.classList.remove('hidden');
    }
}
