const expandCollapseBtnUtils = {

    MIN_WIDTH_SHOW_BUTTON: 736, // viewport narrower than this we hide the column

    isExpandAllBtnVisible: function isExpandAllBtnVisible() {
        log('isExpandAllBtnVisible: enter');

        const visible = ($('#btnExpandAll').css('display') !== 'none');
        // is the button visible?

        log('isExpandAllBtnVisible: visible=' + visible);
        log('isExpandAllBtnVisible: leave');

        return visible;
    },

    isCollapseAllBtnVisible: function isCollapseAllBtnVisible() {
        log('isCollapseAllBtnVisible: enter');

        const visible = ($('#btnCollapseAll').css('display') !== 'none');
        // is the button visible?

        log('isCollapseAllBtnVisible: visible=' + visible);
        log('isCollapseAllBtnVisible: leave');

        return visible;
    },

    showHideExpandCollapseBtnsAndCol: function showHideExpandCollapseBtnsAndCol() {
        // as necessary, show or hide the expand all and collapse all buttons
        // if both buttons are hidden, hide their parent column

        log('showHideExpandCollapseBtnsAndCol: enter');

        // debugger;

        this.showExpandBtnIfNec();
        // show the expand all button if necessary

        this.showCollapseBtnIfNec();
        // show the collapse all button if necessary

        const expandVisible = this.isExpandAllBtnVisible();
        const collapseVisible = this.isCollapseAllBtnVisible();
        // which buttons are visible?

        if (expandVisible || collapseVisible) {
            // if either button is visible

            this.showColumn();
        }
        else {
            // otherwise

            this.hideColumn();
        }

        log('showHideExpandCollapseBtnsAndCol: leave');
    },

    showColumn: function showColumn() {
        log('showColumn: enter');

        const colJQ = $('#divColBtns2');

        colJQ.addClass('column');
        colJQ.addClass('col-auto');

        colJQ.css('display', '');

        log('showColumn: leave');
    },

    hideColumn: function hideColumn() {
        log('hideColumn: enter');

        const colJQ = $('#divColBtns2');

        colJQ.removeClass('column');
        colJQ.removeClass('col-auto');

        colJQ.css('display', 'none');

        log('hideColumn: leave');
    },

    showExpandBtnIfNec: function showExpandBtnIfNec() {
        log('showExpandBtnIfNec: enter');

        if (viewWidth < this.MIN_WIDTH_SHOW_BUTTON) {
            // if the view is too narrow

            log('showExpandBtnIfNec: the view is too narrow, so we will hide the button');

            this.hideExpandBtn();
            // hide the Expand All button

            log('showExpandBtnIfNec: leave');
            return;
        }

        const foundCount = lensesToFindStorageUtils.count();
        // how many lenses found?

        if (foundCount > 0) {
            // if the user found a lens

            log('showExpandBtnIfNec: the user found a lens, so we will hide the button');

            this.hideExpandBtn();
            // hide the Expand All button

            log('showExpandBtnIfNec: leave');
            return;
        }

        const lensCount = showHideLensUtils.lensesToShowCount();
        // get the number of lens cards that will be displayed
        
        const lensDTOs = lensUtils.getLensDTOsToDisplay();
        // get the DTOs of the lenses to display

        const dispCount = lensDTOs.length;

        for (var zIndex = 0; zIndex < dispCount; zIndex++) {
            var lensDTO = lensDTOs[zIndex];

            var lensId = lensDTO.LensId;

            var expanded = tabsCardExpStorageUtils.isCardExpanded(lensId);
            // is the lens card expanded?

            if (!expanded) {
                // if there is at least one card not expanded

                this.showExpandBtn();
                // show the Expand All button

                log('showExpandBtnIfNec: leave');
                return;
            }
        }

        // if all of the displayed lenses are already expanded

        this.hideExpandBtn();
        // hide the Expand All button

        log('showExpandBtnIfNec: leave');
    },

    showCollapseBtnIfNec: function showCollapseBtnIfNec() {
        log('showCollapseBtnIfNec: enter');

        if (viewWidth < this.MIN_WIDTH_SHOW_BUTTON) {
            // if the view is too narrow

            this.hideCollapseBtn();
            // hide the Collapse All button

            log('showCollapseBtnIfNec: leave');
            return;
        }

        const foundCount = lensesToFindStorageUtils.count();
        // how many lenses found?

        if (foundCount > 0) {
            // if the user found a lens

            this.hideCollapseBtn();
            // hide the Collapse All button

            log('showCollapseBtnIfNec: leave');
            return;
        }

        const lensDTOs = lensUtils.getLensDTOsToDisplay();
        // get the DTOs of the lenses to display

        const dispCount = lensDTOs.length;

        for (var zIndex = 0; zIndex < dispCount; zIndex++) {
            var lensDTO = lensDTOs[zIndex];

            var lensId = lensDTO.LensId;

            var expanded = tabsCardExpStorageUtils.isCardExpanded(lensId);
            // is the lens card expanded?

            if (expanded) {
                // if there is at least one card expanded

                this.showCollapseBtn();
                // show the Collapse All button

                log('showCollapseBtnIfNec: leave');
                return;
            }
        }

        // if all of the displayed lenses are collapsed

        this.hideCollapseBtn();
        // hide the Collapse All button

        log('showCollapseBtnIfNec: leave');
    },

    showExpandBtn: function showExpandBtn() {
        log('showExpandBtn: enter');

        $('#btnExpandAll').show();
        // show the button

        log('showExpandBtn: leave');
    },

    hideExpandBtn: function hideExpandBtn() {
        log('hideExpandBtn: enter');

        $('#btnExpandAll').hide();
        // hide the button

        log('hideExpandBtn: leave');
    },

    showCollapseBtn: function showCollapseBtn() {
        log('showCollapseBtn: enter');

        $('#btnCollapseAll').show();
        // show the button

        log('showCollapseBtn: leave');
    },

    hideCollapseBtn: function hideCollapseBtn() {
        log('hideCollapseBtn: enter');

        $('#btnCollapseAll').hide();
        // hide the button

        log('hideCollapseBtn: leave');
    }
};