PB Livechat Javascript

pb.livechat.js

'use strict';

var pb = pb || {};

(function() {
  pb.namespace = function(nsString) {
    var parts = nsString.split('.'),
        parent = pb,
        i;
    if (parts[0] === 'pb') {
      parts = parts.slice(1);
    }
    for (i = 0; i < parts.length; i += 1) {
      if (typeof parent[parts[i]] === 'undefined') {
        parent[parts[i]] = {};
      }
      parent = parent[parts[i]];
    }
    return parent;
  };
}());

pb.namespace('livechat');

// global variables
var curTimeUTC = moment().utc();
//var curTimeUTC = moment("2017-06-23 21:30"); // For testing, add fake time

var curTimeUTCHours = curTimeUTC.hour();

var curTimeLocalHours = moment.tz(curTimeUTC, "America/New_York").hour();

//console.log( "current UTC Time:", curTimeUTC.format(), " hours: ", curTimeUTCHours );
var curTimeLocalHours = moment.tz(curTimeUTC, "America/New_York").hour();
//console.log( moment.tz(curTimeUTC, "America/New_York").format(), " hour:", curTimeLocalHours );

// matches data-chatid on chat selection buttons
var chatIdSales = "sales";
var chatIdSupply = "supply";
var chatIdClient = "client";

var validHours = {
  'sales': [8,20], //8,20 EST - 12,24
  'supply': [9,18], //9,18 EST - 13,22
  'client': [8,20] //8,20 EST - 12,24
}

//console.log('curTime:',curTime,' curTimeOffset:',curTimeOffset, ' curTimeHours:',curTimeHours, ' curTimeOffsetHours:', curTimeOffsetHours);

pb.livechat = (function(){

  var init = function(){
    // attach close behavior to X
    $('.chat-menu .chat-menu__close').click(function(e){
      e.preventDefault();
      pb.livechat.hideChatMenu();
    });

    // attache close behaior to x for proactive chat
    $('.proactive-chat .chat-menu__close').click(function(e){
      e.preventDefault();
      $(this).parent().parent().hide();
    })

    $('.chat-menu__form__label').click(function(e){
      e.preventDefault();
      var chatid = $(this).data("chatid")
      //console.log(chatid);
      $(".chat-menu__option").each( function(i) {
        if( $(this).hasClass("chat-" + chatid) ) {
          $(this).show();
          if(!timeCheck(chatid, curTimeLocalHours)) { //                          if outside of operating hours
            $(".chat-"+chatid+"-on").hide(); // hide on hours notification
            $(".chat-"+chatid+"-busy").hide().parent().hide(); // hide agents busy message
            $(".chat-"+chatid+"-off").show(); // display the hours notification
            //$(".chat-"+chatid+"-off").parent().show(); // enable parent
          } else { //                                          if within current chat hours
            $(".chat-"+chatid+"-on").show(); //  display the chat button
          }
        } else { // remove hide all other items
          $(this).hide();
        }
      });
      return false;
    });

    // opens the live chat selection menu
    $('.live-chat__trigger').click(function(e){
      e.preventDefault();
      var chatmenu = $('.chat-menu__contain');
      //console.log(chatmenu);
      chatmenu.fadeIn().addClass('is-opened');
    });

    // initialize chat cancel buttons
    $('.chat-menu__cancel-chat').click(function(e){
      e.preventDefault();
      hideCurrentMessage($(this));
    });


    liveagent.showWhenOnline('573c00000008OTN', document.getElementById('liveagent_button_online_573c00000008OTN'));
    liveagent.showWhenOffline('573c00000008OTN', document.getElementById('liveagent_button_offline_573c00000008OTN'));
    liveagent.showWhenOnline('573c00000008OT3', document.getElementById('liveagent_button_online_573c00000008OT3'));
    liveagent.showWhenOffline('573c00000008OT3', document.getElementById('liveagent_button_offline_573c00000008OT3'));
    liveagent.showWhenOnline('57380000000KzU8', document.getElementById('liveagent_button_online_57380000000KzU8'));
    liveagent.showWhenOffline('57380000000KzU8', document.getElementById('liveagent_button_offline_57380000000KzU8'));


    var orgOpen = window.open;
    window.open = function (url, windowName, windowFeatures) {

        /* Width of the chat window. Use your own value. */
        var chatWindowHeight=510;//850-510

        /* Height of the chat window. Use your own value. */
        var chatWindowWidth=385;//700-385

        /* Calculate the left position to keep the chatwindow in center */ 
        var left = parseInt((screen.availWidth/2) - (chatWindowWidth/2));

        /* Calculate the top position to keep the chatwindow in center */
        var top = parseInt((screen.availHeight/2) - (chatWindowHeight/2));

        /* Create the arguments for window.open method. */
        var windowFeatures = "width=" + chatWindowWidth + ",height=" + chatWindowHeight + ",status,resizable,left=" + left + ",top=" + top + "screenX=" + left + ",screenY=" + top +",resizable=no,location=no";

        return orgOpen(url, windowName, windowFeatures); 
    }

  }; //end init

  // checks current time against chatline valid hours and returns boolean
  // timeCheck('57380000000KzU8');
  //
  var timeCheck = function(type, hour){
    var curHour = hour;
    var isChatLive = ( (curHour >= validHours[type][0]) && (curHour < validHours[type][1]) ) ? true : false;
    return isChatLive;
  }

  // hides the chat message window overlay
  var hideChatMenu = function(){
    $('.chat-menu__contain').toggleClass("is-opened is-closed");
    hideAllMessages();
  }

  // hide all messages inside the window
  var hideAllMessages = function(){
    var allMessages = $('.chat-menu__option');
    allMessages.each( function(index) {
      $(this).removeClass("is-opened").attr("style","display:none");
      $('.chat-menu__form').attr("style","display:block");
    });
  }

  // shows specified message window
  var showMessage = function(msg){
    var messageNum = msg;
    var allMessages = $('.chat-menu__option');
    var messageSelectorSnip = "chat-menu__message";

    allMessages.each( function(index) {
      var itemClass = messageSelectorSnip + "-" + messageNum;
      var el = $(this);

      if( el.hasClass(itemClass) ) {
        pb.livechat.hideAllMessages();
        el.addClass("is-opened");
      }
    });
  };

  // hides current chat avail message
  var hideCurrentMessage = function(e){
    var current = e;
    current.parent().removeClass("is-opened").attr("style","display:none");
    current.parent().parent().removeClass("is-opened").attr("style","display:none");
  }

  return {
    init: init,
    timeCheck: timeCheck,
    hideChatMenu: hideChatMenu,
    hideAllMessages: hideAllMessages,
    showMessage: showMessage
  };

})();

$(function() {
    pb.livechat.init();
});