https://www.nbc.ca/etc.clientlibs/web-sites-toolkit/components/con…/site.c828c38dc49261de99d8453eb493867e.js

1(function (Granite, Websites) {
2    "use strict";
3
4    var device = Websites ? Websites.DeviceSpecificAction : null;
5
6    var NS = "cmp";
7    var IS = "chatbot";
8
9    var DEFAULT = {
10        PROTOCOL: "phoenix",
11        SOCKET_PATH: "/ws",
12        INIT_PAYLOAD: "/get_started",
13        LANGUAGE: "en",
14        HIDE_WHEN_NOT_CONNECTED: true,
15        DOC_VIEWER: false,
16        IMAGES_WIDTH: 300,
17        IMAGES_HEIGHT: 200,
18        STORAGE: "session"
19    };
20
21    var selectors = {
22        self: "[data-" + NS + '-is="' + IS + '"]',
23        reinit: ".cmp-chatbot"
24    };
25
26    /**
27     * Chatbot Component
28     *
29     * @class Chatbot
30     * @classdesc An instance of the BNC Rasa Webchat component.
31     * @param {ChatbotConfig} config A Chatbot configuration.
32     */
33    function Chatbot(config) {
34        if (config && config.element && !forceDisabled()) {
35            init(config.element, config.options);
36        }
37
38        /**
39         * Initializes a BNC Rasa Webchat component based on a given chatbot configuration.
40         *
41         * @private
42         * @param {HTMLElement} element The Chatbot element.
43         * @param {ChatbotOptions} options The Chatbot options.
44         */
45        function init(element, options) {
46            // prevents multiple initialization
47            element.removeAttribute("data-" + NS + "-is");
48
49            if (window.WebChat && options.enabled === "true") {
50                WebChat.default({
51
52                    locale: options.language || DEFAULT.LANGUAGE,
53                    agent: options.agent || null,
54                    authenticated: false,
55                    socketUrl: options.socketUrl || null,
56                    checkGatewayReadyness: false,
57                    enableMenu: true,
58                    widgetProps: {
59                        hideWhenNotConnected: false
60                    },
61                    customMessages: JSON.parse(options.customessage)
62                });
63            }
64        }
65
66        /**
67         * Checks if the device is using Internet Explorer and forces the chatbot to be disabled if so.
68         *
69         * @private
70         * @returns {boolean} true if the device is using IE; otherwise false.
71         */
72        function forceDisabled() {
73            return device != null ? device.isIE() : false;
74        }
75    }
76
77    /**
78     * Reads options data from the Chatbot wrapper element, defined via {@code data-cmp-*} data attributes.
79     *
80     * @private
81     * @param {HTMLElement} element The Chatbot element to read options data from.
82     * @returns {Object} The options read from the component data attributes.
83     */
84    function readData(element) {
85        var data = element.dataset;
86        var options = [];
87        var capitalized = IS;
88        capitalized = capitalized.charAt(0).toUpperCase() + capitalized.slice(1);
89        var reserved = ["is", "hook" + capitalized];
90
91        for (var key in data) {
92            if (data.hasOwnProperty(key)) {
93                var value = data[key];
94
95                if (key.indexOf(NS) === 0) {
96                    key = key.slice(NS.length);
97                    key = key.charAt(0).toLowerCase() + key.substring(1);
98
99                    if (reserved.indexOf(key) === -1) {
100                        options[key] = value;
101                    }
102                }
103            }
104        }
105
106        return options;
107    }
108
109    /**
110     * Document ready handler that initializes Chatbot components.
111     *
112     * @private
113     */
114    function onDocumentReady() {
115        createChatBot();
116        addListenersToChatBotLinks();
117    }
118
119    function createChatBot() {
120        let elements = document.querySelectorAll(selectors.self);
121        if(elements.length === 0 ) elements = document.querySelectorAll(selectors.reinit);
122
123        for (let i = 0; i < elements.length; i++) {
124            new Chatbot({ element: elements[i], options: readData(elements[i]) });
125        }
126    }
127
128    function addListenersToChatBotLinks() {
129        let chatBotLinks = document.querySelectorAll("a[href='#openChatbot']");
130        for (let j = 0; j < chatBotLinks.length; j++) {
131            chatBotLinks[j].addEventListener("click", openChatBot);
132        }
133    }
134
135    function openChatBot() {
136        let chatBotElement = getChatbotElement();
137        if (chatBotElement != null) {
138            displayChatBot(chatBotElement);
139            focusChatBot();
140        } else {
141            let bncWebchat = document.querySelector("#bncWebchat");
142            if (isChatbotConfigured(bncWebchat)){
143                chatBotElement = getChatbotElement();
144                displayChatBot(chatBotElement);
145                var observer = new MutationObserver(function () {
146                    focusChatBot();
147                    observer.disconnect();
148
149                });
150                // start observing
151                observer.observe(bncWebchat, {
152                    childList: true,
153                    subtree: true
154                });
155            }
156        }
157    }
158    function displayChatBot(chatBotElement){
159        let chatBotOpen = document.getElementsByClassName('rw-chat-open')[0];
160        if (chatBotOpen == null) eventFire(chatBotElement, 'click');
161    }
162    function focusChatBot(){
163        document.getElementsByClassName('rw-new-message')[0].focus();
164    }
165
166    function isChatbotConfigured(webchatElement){
167        if(!!webchatElement) {
168            createChatBot();
169            let element = getChatbotElement();
170            return Websites.Toolkit.Utils.isValidElement(element);
171        }
172        return false;

173    }
174
175    function getChatbotElement(){
176        return document.getElementsByClassName('rw-launcher')[0];
177    }
178
179    function eventFire(el, etype) {
180        let evObj = document.createEvent('Event');
181        evObj.initEvent(etype, true, false);
182        el.dispatchEvent(evObj);
183    }
184
185    if (document.readyState !== "loading") {
186        onDocumentReady();
187    } else {
188        document.addEventListener("DOMContentLoaded", onDocumentReady);
189    }
190
191}(window.Granite, window.Websites));