// Minimal template - we assume JQuery is loaded
// and script is included only once

/*jshint esversion: 6 */

console.log("starting sahil-style chat bot template");

// polyfill for URLSearchParams

(function (w) {
  w.URLSearchParams = w.URLSearchParams || function (searchString) {
      var self = this;
      self.searchString = searchString;
      self.get = function (name) {
          var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(self.searchString);
          if (results == null) {
              return null;
          }
          else {
              return decodeURI(results[1]) || 0;
          }
      };
  };
})(window);

// helper for inserting emojis

$.fn.insertIntoTextArea = function(textToInsert) {
  return this.each(function () {
    var txt = $(this);
    var cursorPosStart = txt.prop('selectionStart');
    var cursorPosEnd = txt.prop('selectionEnd');
    var v = txt.val();
    var textBefore = v.substring(0,  cursorPosStart);
    var textAfter  = v.substring(cursorPosEnd, v.length);
    txt.val(textBefore + textToInsert + textAfter);
    txt.prop('selectionStart', cursorPosStart + textToInsert.length);
    txt.prop('selectionEnd', cursorPosStart + textToInsert.length);
    txt.focus();
  });
};

// more helpers

function dynamicallyLoadScript(url, onload, asModule) {
  var script = document.createElement("script");
  script.src = url;
  script.onload = onload;
  if (asModule) script.type = "module";
  document.head.appendChild(script);
}

function dynamicallyLoadModule(code) {
  var script = document.createElement("script");
  script.type = "module";
  script.appendChild(document.createTextNode(code));
  document.head.appendChild(script);
}

function loadStyleSheet(url, onLoad) {
  var link = document.createElement('link');
  link.setAttribute("rel", "stylesheet");
  link.setAttribute("type", "text/css");
  link.onload = onLoad;
  link.setAttribute("href", url);
  document.head.appendChild(link);
}

class ChatBot {
  constructor() {
    this.n = $n;
    this.interval = 1000;
    this.nInitial = this.n;
    this.started = false;
    this.cookie = localStorage.getItem('chatbot-cookie');
    this.notificationsOn = true;
    this.pollURL = "$incrementalURL";

    this.sendTyping_sent = 0;
    this.sendTyping_interval = 5000;
    this.typingCounter = 0;
    this.showTyping_interval = 3000;

    this.allowEmptyMsg = false;
  
    this.urlParams = new URLSearchParams(window.location.search);
    this.botConfig = this.urlParams.get('_botConfig');
    this.started = false;
    this.justStarted = true;

    // allow cookie override in URL
    var cookie2 = this.urlParams.get('cookie');
    if (this.urlParams.get("_newBotCookie") == "1") {
      this.cookie = "conv-" + Math.random().toString(36).substr(2, 9);
      console.log("New cookie made >> " + this.cookie);
    }

    if (cookie2) {
      this.cookie = cookie2;
      console.log("Cookie override >> " + cookie2);
    }

    console.log("cookie 1: " + this.cookie);
    if (!this.cookie) {
      this.cookie = Math.random().toString(36).substr(2, 9);
      localStorage.setItem('chatbot-cookie', this.cookie);
      console.log("cookie 2: " + this.cookie);
    }

    /*
    // intTelInput.min.css
    loadStyleSheet("https://botcompany.de/serve/1029819?ct=text/css");
  
    // intlTelInput.min.js
    dynamicallyLoadScript("https://botcompany.de/serve/1029820?ct=text/javascript", function() {
      window.telInput = document.querySelector("#chat_telephone");
      console.log("telInput: " + telInput);
      window.telHandler = window.intlTelInput(window.telInput, {
        utilsScript: "https://botcompany.de/serve/1029822?ct=text/javascript", 
        preferredCountries: ["in", "gb"],
        separateDialCode: true,
        initialCountry: "$country"
      });
    });
  
    dynamicallyLoadScript("https://gazelle.rocks/emoji-picker/index.js", function() {
      console.log("emoji picker loaded");
      
      dynamicallyLoadModule(`
        import { EmojiButton } from "https://gazelle.rocks/emoji-picker/index.js";
    
        const picker = new EmojiButton();
        const trigger = document.querySelector('#bot-emoji-trigger');
    
        picker.on('emoji', selection => {
          console.log(selection.emoji);
          $("#chat_message").insertIntoTextArea(selection.emoji);
          setTimeout(function() {
            $("#chat_message").focus();
          }, 250);
        });
    
        trigger.addEventListener('click', () => picker.togglePicker(trigger));
      `);
    }, true);
    */
  }
    
  standardParams() {
    return "&cookie=" + this.cookie + "&rand=" + Math.random() + (!this.botConfig ? "" : "&_botConfig=" + encodeURIComponent(this.botConfig));
  }
  
  start() {
    if (this.started) return;
    this.started = true;
    this.poll();
  }

  poll() {  
    if (!this.pollURL) return;
    
    var url = this.pollURL + this.n + this.standardParams();
    
    // mandatory memory wipe on opening chat bot
    if (this.language) url += "&language_default=" + this.language;
    if (this.justStarted) {
      url += "&message=!new+dialog";
      this.justStarted = false;
    }
    
    var self = this;
    var again = function() { self.poll(); };
    
    console.log("Loading " + url);
    $.get(url, function(src) {
      console.log("Loaded " + src.length + " chars");
      var match = src.match(/\d+/);
      if (match != null) {
        var newN = parseInt(match[0]);
        if (src.match(/NEW DIALOG -->/)) {
          $(".chat-box .chat-live-content").html(src);
        } else {
          // hide old buttons and special input fields
          $(".chat_buttons, .chat-button-span, .chatbot-choice-button").hide();
          $("#chat_telephone, .iti").hide();
          $("#chat_message").show();
          // now append new stuff
          $(".chat-box .chat-live-content").append(src);
        }
        //var oldN = self.n;
        self.n = newN;
        console.log("newN=" + newN);
        $(".chat-box").scrollTop(1000000);
        console.log("Appended " + src.length);
        console.log(src);
      } else
        console.log("self.n=" + self.n + " (initial=" + self.nInitial + ")");
      var interval = self.interval;
      console.log("Rescheduling (" + interval + ")");
      //var interval = src == '' ? self.interval*10 : self.interval; // slowdown when bug
      setTimeout(again, interval);
      console.log("Rescheduled");
    }, 'text')
      .fail(function() {
        console.log("Rescheduling after fail");
        setTimeout(again, self.interval);
      });
  }

  // also focuses input field  
  setInput(text, placeholder) {
    if (placeholder == '') placeholder = "Type a message...";
    $('#chat_message')
      .attr('placeholder', placeholder);
    if (text)
      $('#chat_message').val(text).select().focus();
  }
  
  submitAMsg(msg) {
    if (!this.allowEmptyMsg && msg == "") return;
    $("#chat_message").val(msg);
    this.submitMsg();
  }
  
  submitMsg() {
    var msg = $("#chat_message").val();
    
    if ($("#chat_telephone").is(":visible") && !/^!/.test(msg))
      msg = window.telHandler.getNumber();

    var url = '$msgURL' + encodeURIComponent(msg) + this.standardParams();
    if (this.language) url += "&language_default=" + this.language;
    console.log('Submitting ' + url);
    $.get(url);
    $("#chat_message").val('');
  }  
  
  playChatNotification() {
    if (window.chatNotificationWav == null) {
      console.log("Loading notification wav");
      window.chatNotificationWav = new Audio("$notificationSound");
      if ("$workerMode" != "true")
        window.chatNotificationWav.volume = 0.5;
    }
    console.log("Playing notification mp3");
    window.chatNotificationWav.play();
  }
  
  /*var originalTitle;
  
  window.setTitleStatus = function(status) {
    if (originalTitle == null)
      originalTitle = document.title;
    if (!document.hasFocus() || document.activeElement !== document.getElementById('chat_message')) {
      if (status) status = status + " ";
    } else status = "";
    document.title = status + originalTitle;
  };
  
  resetTitle() {
    window.setTitleStatus("");
  }
  
  window.onfocus = resetTitle;
  $('#chat_message').on("focus", resetTitle);*/
  
  sendTyping() {
    var time = Date.now();
    if (time > this.sendTyping_sent+this.sendTyping_interval) {
      this.sendTyping_sent = time;
      var url = "$typingURL" + this.standardParams();
      console.log("Loading " + url);
      $.get(url);
    }
  }
  
  notiToggle() {
    this.submitAMsg('!toggle notifications');
    var text = $("#chatBot_notiToggleText");
    text.text("Turn " + (/Turn on/.test(text.text()) ? "off" : "on") + " notifications");
  }
  
  showTyping(botImg) {
    var self = this;
    console.log("showTyping " + self.typingCounter);
    self.typingCounter++;
    
    // set avatar image for typing wave
    if (botImg) {
      // old version: $('#otherSideTyping img').attr('src', botImg);
      $('#otherSideTyping div.bg-img').css("background-image", "url('" + botImg + "')");
    }

    if (self.typingCounter == 1)
      $('#otherSideTyping').css('display', 'block');
    setTimeout(function() {
      console.log("showTyping end " + self.typingCounter);
      if (--self.typingCounter <= 0)
        $('#otherSideTyping').css('display', 'none');
    }, self.showTyping_interval);
  }
  
  chat_keyDown(event) {
    if (event.keyCode == 13) { this.submitMsg(); return false; }   
    else if (event.keyCode >= 32 && event.keyCode < 128) this.sendTyping();
  }
} // end of class ChatBot

var chatBot = new ChatBot();

function chatBot_setInput(text, placeholder) {
  chatBot.setInput(text, placeholder);
}

function submitAMsg(msg) {
  chatBot.submitAMsg(msg);
}

function submitMsg() {
  chatBot.submitMsg();
}

function showTyping(botImg) { chatBot.showTyping(botImg); }

function playChatNotification() { chatBot.playChatNotification(); }

// change window title when bot says something

var originalTitle;

function setTitleStatus(status) {
  if (originalTitle == null)
    originalTitle = document.title;
  if (!document.hasFocus() || document.activeElement !== document.getElementById('chat_message')) {
    if (status) status = status + " ";
  } else status = "";
  document.title = status + originalTitle;
}

function resetTitle() {
  setTitleStatus("");
}