import { Controller } from 'stimulus';

/*
 * This is an example Stimulus controller!
 *
 * Any element with a data-controller="default" attribute will cause
 * this controller to be executed. The name "default" comes from the filename:
 * default_controller.js -> "default"
 *
 * Delete this file or adapt it for your use!
 */
export default class extends Controller {
    connect() {
        this.element.querySelector('.full-scren-modal').classList.add('d-none');

        var popup = this.element;
        popup.addEventListener('click', function (ev) {
            var closeBtn = ev.target.closest && ev.target.closest('[data-qa="close-button"]');
            if (!closeBtn || !popup.contains(closeBtn)) {
                return;
            }
            if (typeof $ !== 'undefined' && typeof $(popup).modal === 'function') {
                $(popup).modal('hide');
            }
            if (window.location.hash === '#pay-success') {
                history.replaceState(null, '', window.location.pathname + window.location.search);
            }
        }, true);
    }

    fullScreen() {
        var btn = this.element.querySelector('.full-scren-modal')
        if (btn.classList.contains('fa-window-maximize')) {
            btn.classList.add('fa-window-minimize');
            btn.classList.remove('fa-window-maximize');
            this.element.style.paddingRight = 0;
            this.element.querySelector('.modal-dialog').style.maxWidth = window.innerWidth + 'px';
            this.element.querySelector('.modal-dialog').style.height = window.innerHeight + 'px';
            this.element.querySelector('.modal-dialog').style.margin = 0;
        } else {
            btn.classList.remove('fa-window-minimize');
            btn.classList.add('fa-window-maximize');
            this.element.style.paddingRight = '';
            this.element.querySelector('.modal-dialog').style.maxWidth = '';
            this.element.querySelector('.modal-dialog').style.height = '';
            this.element.querySelector('.modal-dialog').style.margin = '';
        }
    }
}