stagfe2/js-dev/stag-popup.js

window.stagPopupsQueue = [];
function showStagPopup(_key, _noAutoFocus) {
    /*$('html, body').addClass('no-scroll');
    $(window.top.document.body).find('#stag_mcp_lhs').addClass('no-scroll');*/
    let stagPopup = $('[stag-popup-key="' + _key + '"]');
    if(stagPopup.is('.show')) return false;
    else {
        let zIndex = $('.stag-popup.show[stag-popup-key]').last().css('z-index');
        if(zIndex) zIndex++; else zIndex = 100;
        stagPopup.css('z-index', zIndex);
    }
    stagPopup.addClass('show');
    stagPopup.find('[moe][initialized]').removeAttr('initialized');
    initMoes();
    initFileInputs();
    if(!_noAutoFocus) {
        window.setTimeout(function() {
            stagPopup.find('input[type="text"]:not([readonly]):visible,select:visible').first().focus();
        }, 150);
    }
    stagPopupsQueue.push(stagPopup);
    return false;
}
function submitStagPopup(_form) {
    if(!_form[0].checkValidity()) {
        _form[0].reportValidity();
        return false;
    }
    showMask();
    $.post(_form.attr('action'), _form.serialize(), function(_data) {
        stagPopupsQueue = [];
        fastReload();
    });
    return false;
}
function closeStagPopup(_noEvent = false) {
    hideMoeFormMask();
    if(!stagPopupsQueue.length) return false;
    let popup = stagPopupsQueue[stagPopupsQueue.length - 1];
    let closeAll = !!popup.attr('close-all-with-self');
    popup.removeClass('show');
    stagPopupsQueue.splice(stagPopupsQueue.length - 1, 1);
    if(closeAll) {
        while(stagPopupsQueue.length) {
            closeStagPopup(true);
        }
    }
    else {
        if(popup.is('[update-parent]') && !_noEvent) {
            let hook = popup.attr('update-parent');
            if(!!$.trim(hook) && hasMCHook(hook)) {
                runMCHook(hook)
            }
            else {
                if(stagPopupsQueue.length) {
                    refreshDynamicStagPopup();
                }
                else {
                    fastReload(popup.is('[update-target]') ? popup.attr('update-target') : '');
                    return;
                }
            }
        }
    }

    // remove from the DOM
    if(popup.is('.dynamic-popup')) popup.remove();

    // if all closed
    if(!stagPopupsQueue.length) {
        $('html, body').removeClass('no-scroll');
        $(window.top.document.body).find('#stag_mcp_lhs').removeClass('no-scroll');
        if(!_noEvent) {
            $('body').trigger('stag-popup-closed');
        }
    }
    return false;
}
function convertContentLinksForInPopupNavigation(popup) {
    popup.find('.stag-popup-content-inner').find('a').each(function() {
        let a = $(this);
        if(!(!a.attr('href') ||
            a.is('[open-in-stag-popup]') ||
            a.is('[native]') ||
            a.attr('href') === '#' ||
            a[0].onclick)) {
            a.attr('replace-in-stag-popup', 1);
        }
    });
}
function openDynamicStagPopup(_url, initer, title, updateParent, style = '', replace = false, updateTarget = null) {
    let url = _url;
    if(url.indexOf('popupmode') === -1) {
        url += (url.indexOf('?') !== -1 ? '&' : '?') + 'popupmode=1';
    }
    showMask();
    window.noMc = true;
    $.get(url, (_data) => {

        let popup = null;
        if(replace) {
            if(!stagPopupsQueue.length) {
                console.error('No stag-popup currently visible!');
                return false;
            }
            popup = stagPopupsQueue[stagPopupsQueue.length - 1];
            if(!popup.is('.dynamic-popup')) {
                console.error('Topmost stag-popup is not dynamic!');
                return false;
            }
            popup.attr('stag-popup-key', url);
        }
        else {
            popup = $('.dynamic-popup[stag-popup-key="' + url + '"]');
            if(!popup.length) {
                $('main.stag-content').append(
                    '<div class="stag-popup ' + (style ? style : 'stag-popup-lg') + ' dynamic-popup mcp-theme-1" stag-popup-key="' + url + '">' +
                    '<div class="stag-popup-content p-0">' +
                    '<h3 class="stag-popup-title mb-0 mt-3 mx-3 pb-0 border-bottom-0"><span></span>' +
                    '<a href="#" class="ml-auto text-secondary" onclick="return closeStagPopup()"><i class="fa fa-times-circle"></i></a>\n' +
                    '</h3>' +
                    '<div class="stag-popup-content-inner"></div>' +
                    '</div>' +
                    '</div>'
                );
                popup = $('.dynamic-popup[stag-popup-key="' + url + '"]');
            }
        }

        popup.attr('mc-initer', initer);
        popup.find('.stag-popup-title>span').html(title);
        popup.find('.stag-popup-content-inner').html(_data);

        convertContentLinksForInPopupNavigation(popup);

        if(!replace) {
            if(updateParent) {
                popup.attr('update-parent', updateParent);
            }
            else {
                popup.removeAttr('update-parent');
            }
            showStagPopup(url, true);

            if(updateTarget) {
                popup.attr('update-target', updateTarget);
            }
        }

        if(initer) runMCInitializer(initer);
        runMCInitializer('pro-suggest'); // not the place for this! Move to better place.
        initMoes();
        hideMask();
        initFileInputs();
    }).fail(() => {
        toastr.error('Unable to open ' + _url);
        hideMask();
    });
}
function isDynamicStagPopupPresent() {
    if(!stagPopupsQueue.length) return false;
    let popup = stagPopupsQueue[stagPopupsQueue.length - 1];
    if(popup.is('.dynamic-popup')) return true;
    return false;
}
function refreshDynamicStagPopup(_url = false, _target = null) {
    if(!stagPopupsQueue.length) return false;
    let popup = stagPopupsQueue[stagPopupsQueue.length - 1];
    if(popup.is('.dynamic-popup')) {
        showMask();
        window.noMc = true;
        if(_url) {
            popup.attr('stag-popup-key', _url);
        }
        let url = popup.attr('stag-popup-key'),
            initer = popup.attr('mc-initer');
        $.get(url, (_data) => {
            if(_target) {
                _data = '<div>' + _data + '</div>';
                _target = _target.split(',').map(_x => $.trim(_x));
                for (let i = 0; i < _target.length; i++) {
                    let t = _target[i];
                    let targetElement = $(t).first();
                    if(targetElement.length) {
                        let sourceElement = $(_data).find(t).first();
                        if (sourceElement && sourceElement.length) {
                            targetElement.html(sourceElement.html());
                            initFastLoad(targetElement);
                            console.log('Replaced ' + t);
                        }
                        else {
                            console.warn(t + ' not found in returned content');
                        }
                    }
                    else {
                        console.warn(t + ' not found in existing content');
                    }
                }
            }
            else {
                popup.find('.stag-popup-content-inner').html(_data);
            }
            convertContentLinksForInPopupNavigation(popup);
            if(initer) runMCInitializer(initer);
            runMCInitializer('pro-suggest');
            initMoes();
            hideMask();
            initFileInputs();
        });
    }
    return false;
}
function hasResponseError(_data) {
    let msg = 'Unknown error!';
    if (_data) {
        if (_data.success) return false;
        else if (_data.message) msg = _data.message;
    }
    toastr.error(msg);
    return true;
}
(function() {
    window.initStagPopupEvents = function () {
        $(document)
            .off('mousedown.stag-popup-discard', '.stag-popup')
            .on('mousedown.stag-popup-discard', '.stag-popup', function(_e) {
                if($(_e.target).is('.stag-popup') && !isEventConsumed(_e)) {
                    closeStagPopup();
                    return false;
                }
            });
        // catch ESC and discard any visible popups
        $(document)
            .off('keydown.stag-popup-escape')
            .on('keydown.stag-popup-escape', function (e) {
                if(e.which === 27) {
                    if(!isEventConsumed(e)) {
                        if(stagPopupsQueue.length) {
                            if($('.stag-popup.show [moe] [url]:not([show]):visible').length || $('.stag-popup.show [visit-moe] [url]:not([show]):visible').length) {
                                return;
                            }
                            closeStagPopup();
                            markEventAsConsumed(e);
                            return false;
                        }
                    }
                }
            });

        $(document)
            .off('click.open-in-stag-popup', '[open-in-stag-popup]')
            .on('click.open-in-stag-popup', '[open-in-stag-popup]', function() {
                let trig = $(this);
                let updateParent = trig.is('[update-parent]');
                if(updateParent) {
                    if(!!$.trim(trig.attr('update-parent'))) {
                        updateParent = trig.attr('update-parent');
                    }
                    else {
                        updateParent = true;
                    }
                }
                openDynamicStagPopup(
                    trig.attr('href'),
                    trig.attr('mc-initer'),
                    trig.attr('title'),
                    updateParent,
                    trig.attr('popup-style'),
                    false,
                    trig.is('[update-target]') ? trig.attr('update-target') : null
                );
                return false;
            });

        $(document)
            .off('click.replace-in-stag-popup', '[replace-in-stag-popup]')
            .on('click.replace-in-stag-popup', '[replace-in-stag-popup]', function() {
                let trig = $(this);
                openDynamicStagPopup(
                    trig.attr('href'),
                    trig.attr('mc-initer'),
                    trig.attr('title'),
                    null, // will be inherited when replacing
                    null, // will be inherited when replacing
                    true,
                    null
                );
                return false;
            });

        $(document)
            .off('click.close-stag-popup', '.btn-close-stag-popup')
            .on('click.close-stag-popup', '.btn-close-stag-popup', function() {
                closeStagPopup();
                return false;
            });
    }
    addMCInitializer('stag-popups', window.initStagPopupEvents);
})();