import ATransitionEffect from '/js/libs/js-ATransitionEffect.js'


export default class Dropdown extends window.AObject {
    constructor() {
        super();
        this.transition = new ATransitionEffect();
        this.isLock = false;
        if (window.dropdown == null) {
            this.initGlobalVar();
        }
    }
    initGlobalVar() {
        var f = function (ev) {
            this.document_onClick.call(this, ev);
        }.bind(this);
        document.body.addEventListener("mousedown", f, false);
        window.dropdown = {
            "numObj": 1,
            "callback": f,
            "currentE": null
        }
        

    }
    bindDropDowns(a, p = null) {
        if (a instanceof NodeList) {
            Array.from(a).forEach(e => {
                this.bindDropDown(e, p);
            });
        } else {
            this.bindDropDown(a, p);
        }

    }
    unBindDropDowns(p) {

    }
    bindDropDown(e, p = null) {
        var f = function (ev) {
            this.onClick.call(this, ev);
        }.bind(this);
        e.addEventListener("click", f, false);
        this.stackEvent.push({ "event": "click", "callback": f, "element": e, "parent": p });
    }
    document_onClick(e) {
        this.checkRelease(e);
    }
    onClick(e) {
        if (this.isLock) {
            return;
        }
        var t1 = e.currentTarget;
        var p = t1.closest('[data-dropdown]');
        var p1 = e.target.closest(".noopen");
        if (window.dropdown.currentE != null && (e.target.closest(".item") != null || p1 == null)) {
            var tmp = window.dropdown.currentE.con;
            if (window.dropdown.currentE.item.hasAttribute("stopCollapsed")) {
                window.dropdown.currentE.item.removeAttribute("stopCollapsed")
                window.dropdown.currentE = null;
            } else if (e.target.closest(".nonhide") != null) {
                return;
            } else {
            
                this.closeDropdown();
            }
            if (tmp.isEqualNode(p)) return;
        }
        if (p1 != null) {
            return;
        }
        p.classList.add("active");
        this.trigger("open", t1);
        var maxHeight = null;
        var t = p.getElementsByClassName("sub-item")[0];
        if (t1.hasAttribute("data-width")) {
            if (t1.getAttribute("data-width") == "auto") {
                t.style.width = t1.clientWidth + "px";
            } else {
                t.style.width = t1.getAttribute("data-width");
            }
        }
        if (t1.hasAttribute("data-zIndex")) {
            t.style.zIndex = t1.getAttribute("data-zIndex");
        }
        if (t1.hasAttribute("data-max-height")) {
            maxHeight = t1.getAttribute("data-max-height");
            t.style.maxHeight = maxHeight + "px";
        }
        window.dropdown.currentE = { "con": p, "sub": t, "item": e.currentTarget, "pClass": this, "maxHeight": maxHeight };
        this.transition.expandEffect(t, function () {
            this.trigger("opened", t1);
        }.bind(this), maxHeight);
    }

    checkRelease(e) {
        if (e.target.closest(".nonhide") != null) {
            return;
        } else if (e.target.closest(".scrollbar-track") != null) {
            return;
        } else if ((e.target.getAttribute("data-dropdown") == null && e.target.closest("[data-dropdown]") == null) || e.target.closest(".sub-item.show") != null) {
            this.checkCloseDropdown();
        }
    }
    closeDropdown() {
        var tm = window.dropdown.currentE;
        tm.con.classList.remove("active");
        tm.pClass.trigger("close", tm);
        this.transition.collapsedEffect(tm.sub, function () {
            tm.pClass.trigger("closed", tm);
        }, tm.maxHeight);
        window.dropdown.currentE = null;
    }
    checkCloseDropdown() {
        if (window.dropdown.currentE != null) {
            if (!window.dropdown.currentE.item.hasAttribute("stopCollapsed")) {
                this.closeDropdown();
            }
        }
    }
}