@mobileaction/ui-modules/src/ui-modules/plugins/MaIntercom.js

Mobile Action common modules for Vue projects

import { injectPlugin, validateVueInstall } from '../PluginUtils.js';

class MaIntercomCls {
    /**
     * Initializes Intercom instance
     *
     */
    constructor(Vue, { appId, autoStart }) {
        this.Vue = Vue;
        Object.defineProperties(this, {
            autoStart: {
                value: autoStart || false,
                writable: false,
                enumerable: false,
            },
            appId: {
                value: appId,
                writable: false,
                enumerable: false,
            },
            loaded: {
                value: false,
                writable: true,
                enumerable: false,
            },
        });

        if (this.autoStart === true) {
            this.boot();
        }
    }

    // boot will be called explicitly to set user metadata with extra props like utm parameters
    boot(settings = {}) {
        MaIntercom.$log.debug('[MaIntercom] booted', settings);

        const loadScript = (onLoadCallback) => {
            const mode = !settings.isProduction ? 'Staging' : 'Production';
            MaIntercom.$log.info('[MaIntercom]', `Initializing Intercom in ${ mode } mode`);
            const w = window;
            const d = document;
            const ic = w.Intercom;
            if (typeof ic === 'function') {
                ic('reattach_activator');
                ic('update', settings);
            } else {
                const i = function () {
                    i.c(arguments);
                };
                i.q = [];
                i.c = function (args) {
                    i.q.push(args);
                };
                w.Intercom = i;

                // mount intercom script tag
                const s = d.createElement('script');
                s.type = 'text/javascript';
                s.async = true;
                s.src = 'https://widget.intercom.io/widget/' + this.appId;
                s.onload = onLoadCallback;
                const x = d.getElementsByTagName('script')[0];
                x && x.parentNode.insertBefore(s, x);
            }
        };

        // load intercom script
        loadScript(() => {
            MaIntercom.$log.info('[MaIntercom] Loaded!');
            this.loaded = true;

            const _settings = Object.assign({}, settings, {
                widget: {
                    activator: '#IntercomDefaultWidget',
                },
                app_id: this.appId,
            });
            this.callIntercom('boot', _settings);
        });
    }

    callIntercom(...args) {
        if (typeof window.Intercom === 'undefined') {
            MaIntercom.$log.warn('[MaIntercom] Intercom not loaded  yet;', ...args);
            return;
        }
        window.Intercom(...args);
    }

    track(eventName, metadata = {}) {
        MaIntercom.$log.debug('[MaIntercom] track event:', eventName, metadata);
        this.callIntercom('trackEvent', eventName, metadata);
    }

    showMessenger() {
        MaIntercom.$log.debug('[MaIntercom] show messenger');
        this.callIntercom('show');
    }

    showIntercomWithMessage(message) {
        MaIntercom.$log.debug('[MaIntercom] show intercom with special message');
        this.callIntercom('showNewMessage', message);
    }

    hideMessenger() {
        MaIntercom.$log.debug('[MaIntercom] hide messenger');
        this.callIntercom('hide');
    }

    update(metadata) {
        MaIntercom.$log.debug('[MaIntercom] update:', metadata);
        this.callIntercom('update', metadata);
    }

    showIntercomButton() {
        MaIntercom.$log.debug('[MaIntercom] show intercom button');
        this.callIntercom('update', {
            hide_default_launcher: false,
        });
    }

    hideIntercomButton() {
        MaIntercom.$log.debug('[MaIntercom] hide intercom button');
        this.callIntercom('update', {
            hide_default_launcher: true,
        });
    }
}

export function MaIntercom(app, options = {}) {
    if (!options.appId) {
        throw new Error('MaIntercom: Missing app id');
    }

    if (!validateVueInstall(app, MaIntercom, 'MaIntercom')) {
        return;
    }

    injectPlugin(app, new MaIntercomCls(app, options), '$maIntercom');
}

export default MaIntercom;