show()

in static/src/javascripts/projects/common/modules/ui/message.js [42:143]


    show(message) {
        // don't let messages unknowingly overwrite each other
        if (
            !this.$siteMessageContainer.hasClass('is-hidden') &&
            !this.important
        ) {
            // if we're not showing a banner message, display it in the footer
            return false;
        }

        // Move the message to the top if needed
        if (this.position === 'top') {
            const bodyEl = document.body;
            if (!bodyEl) throw new Error('Missing <body>');
            const bodyElFirstChild = bodyEl.childNodes[0];
            if (!bodyElFirstChild) throw new Error('<body> is empty');

            bodyEl.insertBefore(
                this.$siteMessageContainer[0],
                bodyElFirstChild
            );
            this.$siteMessageContainer.addClass('site-message--on-top');
        }

        $('.js-site-message-copy').html(message);

        // Add a blocking overlay if needed
        if (this.blocking) {
            $('body, html').addClass('is-scroll-blocked');
            this.$siteMessageOverlay.removeClass('is-hidden');
            this.$siteMessageOverlay[0].addEventListener('click', () => {
                this.$siteMessageContainer[0].focus();
            });
            this.$siteMessageOverlay[0].addEventListener('focus', () => {
                this.$siteMessageContainer[0].focus();
            });
            this.trapFocus();
        }

        // Add site modifier message
        if (this.cssModifierClass) {
            this.$siteMessageContainer.addClass(
                `site-message--${this.cssModifierClass}`
            );
        }

        this.$siteMessage = $('.js-site-message__message');

        // Check and show the width based message
        this.updateMessageOnWidth();
        mediator.on(
            'window:throttledResize',
            this.updateMessageOnWidth.bind(this)
        );

        if (this.siteMessageComponentName) {
            this.$siteMessageContainer.attr(
                'data-component',
                this.siteMessageComponentName
            );
            if (this.trackDisplay) {
                begin(this.siteMessageComponentName);
            }
        }
        if (this.siteMessageLinkName) {
            this.$siteMessageContainer.attr(
                'data-link-name',
                this.siteMessageLinkName
            );
        }
        if (this.siteMessageCloseBtn) {
            $('.site-message__close-btn', '.js-site-message').attr(
                'data-link-name',
                this.siteMessageCloseBtn
            );
        }

        this.$siteMessageContainer
            .addClass(`site-message--${this.type}`)
            .addClass(`site-message--${this.id}`);
        this.$siteMessageContainer.removeClass('is-hidden');
        if (this.permanent) {
            this.$siteMessageContainer.addClass('site-message--permanent');
            $('.site-message__close').addClass('is-hidden');
        } else {
            bean.on(
                document,
                'click',
                '.js-site-message-close',
                this.acknowledge.bind(this)
            );
        }

        this.customJs(this.customOpts);

        if (this.type === 'modal') {
            this.bindModalListeners();
        }

        // Tell the calling function that our message is shown
        return true;
    }