Skip to content

Instantly share code, notes, and snippets.

@EmilStenstrom

EmilStenstrom/kundo-events.js

Last active December 1, 2016 09:59
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save EmilStenstrom/d1b5a958feb4e4cea60d75588bdd620b to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save EmilStenstrom/d1b5a958feb4e4cea60d75588bdd620b to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. EmilStenstrom revised this gist Dec 1, 2016. 1 changed file with 11 additions and 6 deletions.
    17 changes: 11 additions & 6 deletions kundo-events.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,15 +1,20 @@
    /*
    Documentation:
    DOCUMENTATION:
    This script can be embedded on any page with Kundo Chat, and will change the contents of an element on the page, depending on if the customer can start a new chat or not.
    This script can be embedded on any page with Kundo Chat, and will change the contents
    of an element on the page, depending on if the customer can start a new chat or not.
    To change what's shown, change CHAT_AVAILABLE_HTML and CHAT_UNAVAILABLE_HTML to anything you want. To add a button that starts the chat, add a call to window.$kundo_chat.start_chat()
    To change what's shown, change CHAT_AVAILABLE_HTML and CHAT_UNAVAILABLE_HTML to
    anything you want. To add a button that starts the chat, add a call to
    window.$kundo_chat.start_chat()
    CHAT_INFO_ELEMENT_ID should reference an ID somewhere on the page. It needs to exist before this script is loaded, so be sure to add this script to the botton of your page.
    CHAT_INFO_ELEMENT_ID should reference an ID somewhere on the page. It needs to exist
    before this script is loaded, so be sure to add this script to the botton of your page.
    SHOW_UNAVAILABLE_TIMEOUT is used to specify after how long the status of the chat should be set to unavailable, if the chat events for some reason are not triggered.
    SHOW_UNAVAILABLE_TIMEOUT is used to specify after how long the status of the chat
    should be set to unavailable, if the chat events for some reason are not triggered.
    Example HTML:
    EXAMPLE HTML:
    <div id="kundo_chat_id"></div>
  2. EmilStenstrom revised this gist Dec 1, 2016. No changes.
  3. EmilStenstrom created this gist Dec 1, 2016.
    47 changes: 47 additions & 0 deletions kundo-events.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,47 @@
    /*
    Documentation:
    This script can be embedded on any page with Kundo Chat, and will change the contents of an element on the page, depending on if the customer can start a new chat or not.
    To change what's shown, change CHAT_AVAILABLE_HTML and CHAT_UNAVAILABLE_HTML to anything you want. To add a button that starts the chat, add a call to window.$kundo_chat.start_chat()
    CHAT_INFO_ELEMENT_ID should reference an ID somewhere on the page. It needs to exist before this script is loaded, so be sure to add this script to the botton of your page.
    SHOW_UNAVAILABLE_TIMEOUT is used to specify after how long the status of the chat should be set to unavailable, if the chat events for some reason are not triggered.
    Example HTML:
    <div id="kundo_chat_id"></div>
    */

    (function(){
    var CHAT_AVAILABLE_HTML = "Our chat is now open, <a href='window.$kundo_chat.start_chat()'>start a chat right now</a>";
    var CHAT_UNAVAILABLE_HTML = "Our chat is closed right now. Contact us <a href='mailto:[email protected]'>via e-mail</a> instead.";
    var CHAT_INFO_ELEMENT_ID = "kundo_chat_id";
    var SHOW_UNAVAILABLE_TIMEOUT = 3 * 1000; // ms
    var timeoutID;

    var handleKundoChatStatus = function(event) {
    var chatInfoElement = document.getElementById(CHAT_INFO_ELEMENT_ID)

    if (event && event.type == 'kundo-chat:chat-available') {
    chatInfoElement.innerHTML = CHAT_AVAILABLE_HTML;
    } else {
    chatInfoElement.innerHTML = CHAT_UNAVAILABLE_HTML;
    }

    if (timeoutID) {
    window.clearTimeout(timeoutID);
    timeoutID = null;
    }
    };

    if (document.addEventListener) {
    document.addEventListener('kundo-chat:chat-available', handleKundoChatStatus);
    document.addEventListener('kundo-chat:chat-unavailable', handleKundoChatStatus);
    timeoutID = window.setTimeout(handleKundoChatStatus, SHOW_UNAVAILABLE_TIMEOUT);
    } else {
    handleKundoChatStatus()
    }
    })();