/**
 * ------------------------------TeamBrain Class------------------------------
 * ----------------MAIN FUNCTION---------------
 * 1/ Constructor(idDiv, key): Create the firsts elements on the website, Add the css stylesheet, add eventlisteners.
 *    >> Called with new TeamBrain(idDiv, key)
 *
 * 2/ TeamBrain.openCloseTeamBrain(idDiv, index): Open or close the app.
 *    >> Called by eventlisteners on click on buttons or outside the app
 *
 * 3/ TeamBrain.askTeamBrain(idDiv, input): Launch a search with what is in the *input search*, make the REST call, and insert the response in the appropriate div
 *    >> Called by eventlisteners on submit search input
 *
 * 4/ TeamBrain.showQuestion(message, idDiv): make the REST call to get the question and answers using *message* , and insert the response in the appropriate div
 *    >> Called by click on <a> tags of the questions
 *
 * --------FUNCTION THAT MAKE REST CALL-------- ((The functions are at the END of this script))
 * 1/ TeamBrain.getTeamBrainData(message, secureKey): REST call to get suggestions of questions using the string *message*.
 *    Return an array *result* with key 'type' and 'content'.
 *    _Example_: result[0]['type'] = 'question', result[0]['content'] = "What is food?"
 *
 * 2/ TeamBrain.getQuestion(question): REST call to get the question and its answers using the string *question*.
 *    Return an array *result* with key 'type' and 'content'.
 *    _Example_: result[0]['type'] = 'answer', result[0]['content'] = "Food is something you eat"
 *
 * 3/ TeamBrain.sendFormQuestion(idDiv): REST call to send a new question. Information is optained selecting the question, name and email of the form using *idDiv*
 *    Remove the button and let the user know the question was send.
 */

var TeamBrain = class TeamBrain {
    constructor(idDiv, key){
        /**
         * Called by >> *var* = new TeamBrain(idDiv, key); <<
         *
         * 1/ Check if idDiv is an id in the HTML DOM.
         * 2/ Add the new TeamBrain element in the teamBrainArray. ((Which allow to access the Element and create multiple ones))
         * 3/ Create every HTML element needed from the start (like icons, div, input, form, buttons, etc)
         * 4/ Create the eventlistener that allow the opening and closing of the app
         * 5/ Create the an eventlistener onkeypress in the input search AND on click on the button of the input that allow a search
         *
         */
        var body = document.getElementsByTagName('body')[0];
        var teamBrainDiv = document.createElement('div');
        teamBrainDiv.style.display = "none";
        setTimeout(() => {
            teamBrainDiv.style.display = "";
        }, 2000);
        teamBrainDiv.id = "teambrain-box";
        teamBrainDiv.classList.add('teambrain-box');
        body.insertBefore(teamBrainDiv, body.firstChild);
        if (teamBrainDiv === null){
            console.log('No '+idDiv+' div was found');
        }else{
            console.log(idDiv+' was found');
            this.idDiv = idDiv;
            var tbArray = {};
            tbArray['statusBox'] = 'close';
            tbArray['idDiv'] = idDiv;
            tbArray['accessNumber'] = teamBrainIndex;
            teamBrainIndex++;
            tbArray['key'] = key;

            teamBrainArray.push(tbArray);

            teamBrainDiv.classList.add('teambrain-box');
            var stickerDiv = document.createElement('div');
            var stickerSpan = document.createElement('span');
            stickerDiv.classList.add('teambrain-stick-up-div');
            stickerSpan.classList.add('teambrain-stick-up-span');
            stickerSpan.classList.add('teambrain-chevron');
            stickerSpan.classList.add('teambrain-top');
            stickerSpan.addEventListener('click', TeamBrain.goUp);
            stickerDiv.appendChild(stickerSpan);
            teamBrainDiv.appendChild(stickerDiv);



            var teamBrainGreatDiv = document.createElement('div');
            teamBrainGreatDiv.classList.add('teambrain-great-div');
            teamBrainDiv.appendChild(teamBrainGreatDiv);

            var teamBrainBox = document.createElement("div");
            teamBrainBox.classList.add('teambrain-message-box');
            teamBrainBox.classList.add('teambrain-close');
            teamBrainGreatDiv.appendChild(teamBrainBox);

            var teamBrainHeader = document.createElement('div');
            teamBrainHeader.classList.add('teambrain-header');
            teamBrainHeader.innerHTML = "Posez-nous votre question";
            teamBrainBox.appendChild(teamBrainHeader);

            var teamBrainDivForm = document.createElement('div');
            teamBrainDivForm.classList.add('teambrain-form-search-div');

            var teamBrainForm = document.createElement("div");
            teamBrainForm.setAttribute('onsubmit', "return false;");
            teamBrainForm.classList.add('teambrain-form-form')
            teamBrainDivForm.appendChild(teamBrainForm);
            teamBrainBox.appendChild(teamBrainDivForm);

            var teamBrainCog = document.createElement("i");
            teamBrainCog.classList.add('teambrain-cog');
            teamBrainCog.classList.add('fa-teambrain-cog');
            teamBrainCog.classList.add('fa-teambrain');
            teamBrainForm.appendChild(teamBrainCog);

            var teamBrainInput = document.createElement("input");
            teamBrainInput.classList.add('teambrain-input');
            teamBrainInput.placeholder = "Posez-nous votre question";
            teamBrainInput.classList.add('teambrain-input-close');

            teamBrainInput.addEventListener('keypress', function(e){
                TeamBrain.teamBrainKeyPress(e, idDiv, this, "press");
            });
            teamBrainInput.addEventListener('keyup', function(e){
                TeamBrain.teamBrainKeyPress(e, idDiv, this, "up");
            });

            teamBrainForm.appendChild(teamBrainInput);
            var teamBrainButton = document.createElement("button");
            teamBrainButton.classList.add('teambrain-input-button');
            teamBrainButton.setAttribute('type', "button");
            teamBrainButton.classList.add('teambrain-input-close');
            teamBrainButton.addEventListener('click', function(e){
                TeamBrain.teamBrainButtonSearch(e, idDiv);
            });
            teamBrainForm.appendChild(teamBrainButton);

            var buttonImg = document.createElement("img");
            buttonImg.src = 'https://app2.kapitaliser.com/centralBrain/front/libApp2/widget/img/teamBrainLoupeInverted.php?color=E3014C';
            buttonImg.setAttribute("height", "15px");
            teamBrainButton.appendChild(buttonImg);

            var teamBrainAnswerBox = document.createElement("div");
            teamBrainAnswerBox.classList.add('teambrain-answer-box');
            teamBrainGreatDiv.appendChild(teamBrainAnswerBox);


            var teamBrainQuestionDiv = document.createElement('div');
            teamBrainQuestionDiv.classList.add('teambrain-question-div');
            teamBrainQuestionDiv.classList.add('teambrain-question-div-hidden');
            teamBrainGreatDiv.appendChild(teamBrainQuestionDiv);

            var teamBrainSubmitQuestionDiv = document.createElement('div');
            teamBrainSubmitQuestionDiv.classList.add('teambrain-submit-question-div');
            teamBrainSubmitQuestionDiv.classList.add('teambrain-submit-question-div-hidden');
            teamBrainGreatDiv.appendChild(teamBrainSubmitQuestionDiv);

            var teamBrainPowered = document.createElement('a');
            teamBrainPowered.classList.add('teambrain-powered');
            teamBrainPowered.href = "https://teambrain.fr";
            teamBrainPowered.target = "_blank";
            teamBrainPowered.innerHTML = "Propulsé par TeamBrain";
            teamBrainGreatDiv.appendChild(teamBrainPowered);

            var teamBrainPubLink = document.createElement('div');
            teamBrainPubLink.classList.add('teambrain-pubLink');
            teamBrainPubLink.innerHTML = '';
            teamBrainGreatDiv.appendChild(teamBrainPubLink);

            var teamBrainMaxDiv = document.createElement('div');
            teamBrainMaxDiv.classList.add('teambrain-max-div');

            var teamBrainMaxI = document.createElement('i');
            teamBrainMaxI.classList.add('fa-teambrain');
            teamBrainMaxI.setAttribute('title-maxmin', "Agrandir la fenêtre");
            teamBrainMaxI.classList.add('fa-teambrain-window-maximize');

            teamBrainMaxDiv.appendChild(teamBrainMaxI);
            teamBrainMaxDiv.setAttribute('onclick', 'TeamBrain.switchMaximize("'+idDiv+'");');
            teamBrainGreatDiv.appendChild(teamBrainMaxDiv);



            var imgDiv = document.createElement("div");
            imgDiv.classList.add('teambrain-icon-div');
            imgDiv.style.transform = "scale(1)";

            teamBrainDiv.appendChild(imgDiv);
            var imgDivText = document.createElement("div");
            imgDivText.classList.add('teambrain-icon-div-text');
            var imgDivTextSpan = document.createElement('span');
            imgDivTextSpan.innerHTML = "J'ai une question";
            imgDivText.appendChild(imgDivTextSpan);
            imgDiv.appendChild(imgDivText);
            TeamBrain.animateIconText(imgDivText);

            var elem = document.createElement("img");
                        elem.src = 'https://app2.kapitaliser.com/centralBrain/front/libApp2/widget/img/teambrain-question.php?color=E3014C';
                        elem.setAttribute("alt", "Team Brain Icon");
            elem.classList.add('teambrain-icon');
            imgDiv.addEventListener('click', function(e){
                TeamBrain.openCloseTeamBrain(idDiv, tbArray['accessNumber']);
            });

            imgDiv.appendChild(elem);


            document.addEventListener("click", function(event) {
                var isContext = false;
                for (var i = 0 ; i < event.path.length ; i++){
                    if (String(event.path[i].onclick).includes('TeamBrain.addContext')){
                        isContext = true;
                    }
                }
                if (isContext){

                }else{
                    if (event.target.closest("#"+idDiv)) return;
                    teamBrainArray[tbArray['accessNumber']]['statusBox'] = "open";
                    TeamBrain.openCloseTeamBrain(idDiv, tbArray['accessNumber']);
                }

            });

            var teamBrainStyleSheet = document.createElement('link');
            teamBrainStyleSheet.setAttribute('rel', "stylesheet");
            teamBrainStyleSheet.setAttribute('class', "widget-css");
            teamBrainStyleSheet.setAttribute('href', "https://app2.kapitaliser.com/centralBrain/front/libApp2/widget/teamBrainLightCss.php?color=E3014C&b=&r=&h=65&textLogoVertical=&textLogoDesactivated=&mb=25");
            document.querySelector('head').appendChild(teamBrainStyleSheet);

            var teamBrainStyleFont = document.createElement('link');
            teamBrainStyleFont.setAttribute('rel', "stylesheet");
            teamBrainStyleFont.setAttribute('class', "widget-fonts");
            teamBrainStyleFont.setAttribute('href', "https://fonts.googleapis.com/css?family=Quicksand");
            document.querySelector('head').appendChild(teamBrainStyleFont);
            /*
            var teamBrainStyleFontAwesome = document.createElement('link');
            teamBrainStyleFontAwesome.setAttribute('rel', "stylesheet");
            teamBrainStyleFontAwesome.setAttribute('class', "widget-css");
            teamBrainStyleFontAwesome.setAttribute('href', "https://use.fontawesome.com/releases/v5.8.1/css/all.css");
            document.querySelector('head').appendChild(teamBrainStyleFontAwesome); */

            var stickerDownDiv = document.createElement('div');
            var stickerDownSpan = document.createElement('span');
            stickerDownDiv.classList.add('teambrain-stick-down-div');
            stickerDownSpan.classList.add('teambrain-stick-down-span');
            stickerDownSpan.classList.add('teambrain-chevron');
            stickerDownSpan.classList.add('teambrain-bottom');
            stickerDownSpan.addEventListener('click', TeamBrain.goDown);
            stickerDownDiv.appendChild(stickerDownSpan);
            teamBrainDiv.appendChild(stickerDownDiv);

            document.querySelector('.teambrain-stick-up-div').style.height = "0";
            document.querySelector('.teambrain-stick-down-div').style.height = "0";

            console.log(idDiv+' is ready');
            adaptVarTeambrain = setInterval(() => {
                TeamBrain.adaptHeight(idDiv);
            }, 200);
                    }
    }
    static showHelloPopup(idDiv, tbArray){
        if (!tbLightOpen){
            document.querySelector('.teambrain-icon-div-text').style.display = "none";
            let popupBox = document.createElement('div');
            popupBox.classList.add('fa-teambrain-popupBox');
            let popupClose = document.createElement('span');
            popupClose.classList.add('fa-teambrain-popupClose');
            popupClose.innerHTML = "X";
            popupClose.addEventListener('click',function(e){
                popupBox.classList.add('tb-teambrain-hide');
                setTimeout(() => {
                    if (typeof(popupBox) != "undefined") { popupBox.parentNode.removeChild(popupBox); }                    
                    document.querySelector('.teambrain-icon-div-text').style.display = "";
                }, 1500);
            })
            popupBox.appendChild(popupClose);
            let popupContent = document.createElement('span');
            popupContent.innerHTML = `Bonjour,
        En quoi puis je vous aider ? Posez moi votre question ici !`.replace(/\n/g, '<br>');
            popupContent.addEventListener('click', function(e){
                popupBox.classList.add('tb-teambrain-hide');
                document.querySelector('.teambrain-icon-div-text').style.display = "";
                setTimeout(() => {
                    if (typeof(popupBox) != "undefined") { popupBox.parentNode.removeChild(popupBox); }                    
                    TeamBrain.openCloseTeamBrain(idDiv, tbArray['accessNumber']);
                }, 400);
            });
            popupBox.appendChild(popupContent);
            document.querySelector('body').appendChild(popupBox);
            setTimeout(() => {
                popupBox.classList.add('tb-teambrain-hide');
                setTimeout(() => {
                    if (typeof(popupBox) != "undefined") { popupBox.parentNode.removeChild(popupBox); }                    
                    document.querySelector('.teambrain-icon-div-text').style.display = "";
                }, 1500);
            }, 10000);
        }
    }
    static switchMaximize(idDiv){
        var greatDiv = document.querySelector('#'+idDiv+ ' .teambrain-great-div');
        if (greatDiv.style.width == "400px"){
            greatDiv.style.width = "85vw";
            document.querySelector('#'+idDiv+ ' .teambrain-max-div i').classList.remove('fa-teambrain-window-maximize');
            document.querySelector('#'+idDiv+ ' .teambrain-max-div i').classList.add('fa-teambrain-window-minimize');
            document.querySelector('#'+idDiv+ ' .teambrain-max-div i').setAttribute('title-maxmin', "Reduire la fenêtre");
        }else{
            greatDiv.style.width = "400px";
            document.querySelector('#'+idDiv+ ' .teambrain-max-div i').classList.add('fa-teambrain-window-maximize');
            document.querySelector('#'+idDiv+ ' .teambrain-max-div i').classList.remove('fa-teambrain-window-minimize');
            document.querySelector('#'+idDiv+ ' .teambrain-max-div i').setAttribute('title-maxmin', "Agrandir la fenêtre");
        }

    }
    static goUp(e){
        var objDiv = document.querySelector(".teambrain-great-div");
        objDiv.scrollTop = "";
    }
    static goDown(e){
        var objDiv = document.querySelector(".teambrain-great-div");
        objDiv.scrollTop = objDiv.scrollHeight;

    }
    static animateIconText(imgDivText){
        if(imgDivText.classList.contains('teambrain-icon-div-text-close')){
            setTimeout(() => {
                imgDivText.classList.remove('teambrain-icon-div-text-close');
                TeamBrain.animateIconText(imgDivText);
            }, 60000);
        }else{
            setTimeout(() => {
                imgDivText.classList.add('teambrain-icon-div-text-close');
                TeamBrain.animateIconText(imgDivText);
            }, 3000);
        }
    }
    static resizeTextarea (e) {
        var a = document.querySelector(".teambrain-form-send-question textarea");
        if (e.keyCode == 8){
            a.style.height = 'auto';
        }
        a.style.height = a.scrollHeight+'px';


    }
    static adaptHeight(idDiv){
        var messageBoxHeight = document.querySelector('#'+idDiv+' .teambrain-message-box').offsetHeight;
        var answerBoxHeight = document.querySelector('#'+idDiv+' .teambrain-answer-box').offsetHeight;
        var questionBoxHeight = document.querySelector('#'+idDiv+' .teambrain-question-div').offsetHeight;
        var submitBoxHeight = document.querySelector('#'+idDiv+' .teambrain-submit-question-div').offsetHeight;
        var height = messageBoxHeight + answerBoxHeight + questionBoxHeight + submitBoxHeight ;
        document.querySelector('.teambrain-great-div').style.height = height+"px";
        var max = (window.innerHeight/100*65);
        if (window.innerWidth < 425){
            document.querySelector('#' +idDiv+ ' .teambrain-max-div i').style.display = "none";
            document.querySelector('#' +idDiv+ ' .teambrain-max-div').style.padding = "0";
            document.querySelector('.teambrain-great-div').style.maxHeight = "40vh";
            //document.querySelector('.teambrain-great-div').style.minHeight = "30vh";
            max = (window.innerHeight/10)*4;
        }
        if (height > max){
            document.querySelector('.teambrain-great-div').style.overflowY = "scroll";
            if (window.innerWidth < 425){
                if (document.querySelector(".teambrain-great-div").scrollTop == 0){
                    document.querySelector('.teambrain-stick-up-div').style.height = "0";
                }else{
                    document.querySelector('.teambrain-stick-up-div').style.height = "40px";
                }
                if ((document.querySelector(".teambrain-great-div").offsetHeight + document.querySelector(".teambrain-great-div").scrollTop) > (document.querySelector(".teambrain-great-div").scrollHeight - 10)){
                    document.querySelector('.teambrain-stick-down-div').style.height = "0";
                    document.querySelector('.teambrain-stick-down-div').style.transform = "translate(0px, -50px)";
                    //document.querySelector('.teambrain-stick-down-div').style.overflow = "hidden";
                }else{
                    document.querySelector('.teambrain-stick-down-div').style.height = "40px";
                    document.querySelector('.teambrain-stick-down-div').style.transform = "translate(0px, 30px)";
                    document.querySelector('.teambrain-stick-down-div').style.overflow = "visible";
                }

            }
        }else{
            document.querySelector('.teambrain-great-div').style.overflow = "hidden";
            document.querySelector('.teambrain-stick-up-div').style.height = "0";
            document.querySelector('.teambrain-stick-down-div').style.height = "0";
            document.querySelector('.teambrain-stick-down-div').style.overflow = "hidden";

        }
        document.querySelector('.teambrain-powered').style.top = (height-18) + "px";
        if (document.querySelector('#'+idDiv+' .teambrain-great-div').style.width == "85vw"){
            document.querySelector('#'+idDiv+' .teambrain-great-div').style.height = "65vh";
            if (height < max){
                document.querySelector('.teambrain-powered').style.top = (document.querySelector('#'+idDiv+' .teambrain-great-div').offsetHeight-18) + "px";
            }
        }

        if (document.querySelector('#'+idDiv+' .teambrain-form-search-div').offsetWidth > 460){
            document.querySelector('#'+idDiv+' .teambrain-form-search-div').style.margin = "auto";
        }else{
            document.querySelector('#'+idDiv+' .teambrain-form-search-div').style.margin = "";
        }
        document.querySelector('#'+idDiv+' .teambrain-message-box').style.height = "";
        if (height == messageBoxHeight){
            if (document.querySelector('#'+idDiv+' .teambrain-great-div').style.width == "85vw"){
                document.querySelector('#'+idDiv+' .teambrain-form-search-div').style.marginTop = "25vh";
                document.querySelector('#'+idDiv+' .teambrain-message-box').style.height = "100%";
            }
            document.querySelector('#'+idDiv+' .teambrain-form-search-div').style.width = "87%";
            if (teambrainContext == ""){
                document.querySelector('#'+idDiv+' .teambrain-header').style.height = "0";
                document.querySelector('#'+idDiv+' .teambrain-cog').style.top = "33px";
                document.querySelector('#'+idDiv+' .teambrain-cog').style.left = (document.querySelector('#'+idDiv+' .teambrain-form-search-div').offsetLeft +20) +"px";
                document.querySelector('#'+idDiv+' .teambrain-cog').style.top = (document.querySelector('#'+idDiv+' .teambrain-form-search-div').offsetTop +12) +"px";
            } else{
                document.querySelector('#'+idDiv+' .teambrain-header').style.height = "";
                document.querySelector('#'+idDiv+' .teambrain-cog').style.top = "";
                document.querySelector('#'+idDiv+' .teambrain-cog').style.left = (document.querySelector('#'+idDiv+' .teambrain-form-search-div').offsetLeft+ 20)+"px";
            }
        }else{
            document.querySelector('#'+idDiv+' .teambrain-form-search-div').style.width = "";

            document.querySelector('#'+idDiv+' .teambrain-header').style.height = "";
            document.querySelector('#'+idDiv+' .teambrain-cog').style.top = "";
            document.querySelector('#'+idDiv+' .teambrain-cog').style.left = (document.querySelector('#'+idDiv+' .teambrain-form-search-div').offsetLeft+ 20)+"px";
        }

		if (document.querySelector(' .teambrain-back-button') != null && document.querySelector(' .teambrain-question') != null)
		{
		    document.querySelector(' .teambrain-back-button').style.position = "absolute";
		    document.querySelector(' .teambrain-back-button').style.top = "5px";
		    document.querySelector('.teambrain-back-button').style.left = "5px";
		}

		if (document.querySelector(' .teambrain-back-button') != null && document.querySelector(' .teambrain-info-bulle') != null)
		{
		    document.querySelector(' .teambrain-back-button').style.position = "absolute";
		    document.querySelector(' .teambrain-back-button').style.top = "5px";
		    document.querySelector('.teambrain-back-button').style.left = "5px";
		}

        var iconWidth = (document.querySelector('#'+idDiv+' .teambrain-icon-div-text span').innerText.length *6.5) + 68;
        document.querySelector('#'+idDiv+' .teambrain-icon-div-text').style.width = iconWidth +"px";
        document.querySelector('#'+idDiv+' .teambrain-icon-div-text').style.left = "-"+(iconWidth +20) +"px";
        

    }
    static sendConnexionLog(){
        var data = {space: "pldv", community: "6942861875d64e964ceb250.92970985", lang: ""};
            var xhttp = new XMLHttpRequest();
            xhttp.onreadystatechange = function() {
                if (this.readyState == 4 && this.status == 200) {
                    //Let the user know the question was send and remove button
                }
            };
            xhttp.open("POST", "https://app2.kapitaliser.com/centralBrain/front/page/teamBrainLight/statConnexion.php", true);
            var content = "content=" + JSON.stringify(data);
            xhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
            xhttp.send(content);
    }

    static openCloseTeamBrain(idDiv, index){
        var teamBrainDiv = document.querySelector('#'+idDiv + ' .teambrain-message-box');
        var teamBrainInput = document.querySelector('#'+idDiv + ' .teambrain-input');
        var teamBrainButton = document.querySelector('#'+idDiv + ' .teambrain-input-button');
        var teamBrainBox = document.querySelector('#'+idDiv + ' .teambrain-great-div');
        var questionSubmitBox = document.querySelector('#'+idDiv + ' .teambrain-submit-question-div');
        var iconBox = document.querySelector('#'+idDiv + ' .teambrain-icon-div');
        var iconText = document.querySelector('#'+idDiv + ' .teambrain-icon-div-text');

        if (teamBrainArray[index]['statusBox'] == 'close'){
            if (document.querySelector('.fa-teambrain-popupBox') != null){
                document.querySelector('.fa-teambrain-popupBox').parentNode.removeChild(document.querySelector('.fa-teambrain-popupBox'));
            }
            document.querySelector('.teambrain-icon-div-text').style.display = "";
            tbLightOpen = true;
            TeamBrain.sendConnexionLog();

            document.querySelector('.teambrain-icon-div').style.transform = "scale(1)";
            iconText.classList.add('teambrain-icon-div-text-teambrainIsOpen');

            iconBox.classList.remove('teambrain-icon-closed');
            teamBrainDiv.classList.remove('teambrain-close');
            teamBrainDiv.classList.add('teambrain-open');

            teamBrainBox.classList.remove('teambrainBox-close');
            teamBrainBox.classList.add('teambrainBox-open');

            document.querySelector('.teambrain-stick-down-div').style.display = "block";
            document.querySelector('.teambrain-stick-up-div').style.display = "block";


            teamBrainInput.classList.remove('teambrain-input-close');
            teamBrainInput.classList.add('teambrain-input-open');
            teamBrainButton.classList.remove('teambrain-input-close');
            teamBrainButton.classList.add('teambrain-input-open');
            teamBrainInput.focus();

            questionSubmitBox.classList.add('teambrain-submit-question-div-show');
            questionSubmitBox.classList.remove('teambrain-submit-question-div-hidden');
            if (window.innerWidth < 425){
                var width = window.innerWidth - 100;
                document.querySelector('.teambrain-great-div').style.width = String(width) + "px";
            }else{
                document.querySelector('.teambrain-great-div').style.width = "400px";
            }

            teamBrainArray[index]['statusBox'] = 'open';
        }else{
            setTimeout(() => {
                iconText.classList.remove('teambrain-icon-div-text-teambrainIsOpen');
            }, 300);
            iconBox.classList.add('teambrain-icon-closed');
            teamBrainDiv.classList.add('teambrain-close');
            teamBrainDiv.classList.remove('teambrain-open');

            teamBrainBox.classList.add('teambrainBox-close');
            teamBrainBox.classList.remove('teambrainBox-open');

            teamBrainInput.classList.add('teambrain-input-close');
            teamBrainInput.classList.remove('teambrain-input-open');

            teamBrainButton.classList.add('teambrain-input-close');
            teamBrainButton.classList.remove('teambrain-input-open');
            document.querySelector('.teambrain-icon-div').style.transform = "scale(1)";

            document.querySelector('.teambrain-stick-down-div').style.display = "none";
            document.querySelector('.teambrain-stick-up-div').style.display = "none";

            questionSubmitBox.classList.remove('teambrain-submit-question-div-show');
            questionSubmitBox.classList.add('teambrain-submit-question-div-hidden');

            document.querySelector('#'+idDiv+ ' .teambrain-max-div i').classList.add('fa-teambrain-window-maximize');
            document.querySelector('#'+idDiv+ ' .teambrain-max-div i').classList.remove('fa-teambrain-window-minimize');

            document.querySelector('#'+idDiv+ ' .teambrain-max-div i').classList.add('fa-teambrain-window-maximize');
            document.querySelector('#'+idDiv+ ' .teambrain-max-div i').classList.remove('fa-teambrain-window-minimize');
            document.querySelector('#'+idDiv+ ' .teambrain-max-div i').setAttribute('title-maxmin', "Agrandir la fenêtre");

            document.querySelector('.teambrain-great-div').style.width = "0px";

            TeamBrain.removeContext();
            TeamBrain.setDefaultState(idDiv);
            teamBrainArray[index]['statusBox'] = 'close';
        }


    }
    static setDefaultState(idDiv) {
        //var inputValue = document.querySelector('#'+idDiv+' .teambrain-input').value;
        document.querySelector('#'+idDiv+' .teambrain-input').value = "";
        //TeamBrain.getAutocompletion(inputValue, idDiv);
        //lastSearch = inputValue;
        //document.querySelector('#'+idDiv+' .teambrain-cog').classList.add('teambrain-cog-rotate');
        if (document.querySelector('#'+idDiv+' .teambrain-answer-message')){
            document.querySelector('#'+idDiv+' .teambrain-answer-message').innerHTML = "";
            document.querySelector('#'+idDiv+' .teambrain-answer-message').style.height = 0;
        }
        if (document.querySelector('#'+idDiv+' .teambrain-form-send-question')){
            document.querySelector('#'+idDiv+' .teambrain-form-send-question').style.margin = "0px";
        }
        var form = document.querySelector('.teambrain-message-box .teambrain-form-form');
        var header = document.querySelector('.teambrain-header');
        var box = document.querySelector('.teambrain-message-box');
        form.classList.remove('teambrain-message-box-form-hide');
        if (!teambrainContext){
            header.innerHTML = "Posez-nous votre question";
        }
        form.style.marginBottom = "0px";
        header.classList.remove('teambrain-header-return');
        box.classList.remove('teambrain-message-box-return');
        header.removeEventListener('mouseover', TeamBrain.backToSuggestionsHover);
        header.removeEventListener('mouseout', TeamBrain.backToSuggestionsHoverOut);
        box.removeAttribute('title-back');
        header.removeEventListener('click', TeamBrain.backToInputSearch);

        if (document.querySelector('#'+idDiv+' .teambrain-question-div')){
            document.querySelector('#'+idDiv+' .teambrain-question-div').innerHTML = "";
        }
        TeamBrain.removeAutocompletion(idDiv);
    }
    static askTeamBrain(idDiv, input){
        lastSearch = input.value;
        if (input.value != ""){
            TeamBrain.getTeamBrainData(input.value, teamBrainArray[idDiv], idDiv);
        }
    }
    static hideQuestionAnswer(idDiv){
        var questionBox = document.querySelector('#' + idDiv + " .teambrain-question-div");
        questionBox.classList.add('teambrain-question-div-hidden');
        questionBox.classList.remove('teambrain-question-div-show');

        var answerBox = document.querySelector('#' + idDiv + " .teambrain-answer-box");
        answerBox.classList.remove('teambrain-answer-box-hidden');

        var questionSubmitBox = document.querySelector('#'+idDiv + ' .teambrain-submit-question-div');
        questionSubmitBox.classList.remove('teambrain-submit-question-div-show');
        questionSubmitBox.classList.add('teambrain-submit-question-div-hidden');
        questionSubmitBox.innerHTML = "";

    }
    static teamBrainKeyPress(e, idDiv, input, type = ""){
        if (document.querySelector('#'+idDiv+' .teambrain-input').value == ""){
            potentialQuestion = "";
        }

         if (e.keyCode == 13){
            /*TeamBrain.insertQuestion(input.value, idDiv);
            TeamBrain.askTeamBrain(idDiv, input);
            TeamBrain.hideQuestionAnswer(idDiv); */
            let current = document.querySelector('.teambrain-autocompletion-box a.tb-focus');
            if (current == undefined){
                TeamBrain.teamBrainButtonSearch(e, idDiv);
            }else {
                if (type == "up"){
                    current.click();
                }
            }

        }else if (e.keyCode == 40){
            let current = document.querySelector('.teambrain-autocompletion-box a.tb-focus');
            if (current == undefined){
                document.querySelector('.teambrain-autocompletion-box a:first-of-type').classList.add('tb-focus');
            }else {
                if (document.querySelector('.teambrain-autocompletion-box a:last-of-type') != current){
                    current.classList.remove('tb-focus');
                    current.nextSibling.classList.add('tb-focus');
                }
            }
        }else if (e.keyCode == 38){
            let current = document.querySelector('.teambrain-autocompletion-box a.tb-focus');
            if (current == undefined){
                document.querySelector('.teambrain-autocompletion-box a:last-of-type').classList.add('tb-focus');
            }else {
                if (document.querySelector('.teambrain-autocompletion-box a:first-of-type') != current){
                    current.classList.remove('tb-focus');
                    current.previousSibling.classList.add('tb-focus');
                }else{
                    current.classList.remove('tb-focus');
                }
            }

        } else if (e.keyCode != 13 ){
            setTimeout(() => {
                if (autocompletionOn == false && lastSearch != input.value){
                    autocompletionOn = true;
                    var inputValue = document.querySelector('#'+idDiv+' .teambrain-input').value;
                        TeamBrain.getAutocompletion(inputValue, idDiv);
                        lastSearch = inputValue;
                        document.querySelector('#'+idDiv+' .teambrain-cog').classList.add('teambrain-cog-rotate');
                        if (document.querySelector('#'+idDiv+' .teambrain-answer-message')){
                            document.querySelector('#'+idDiv+' .teambrain-answer-message').innerHTML = "";
                            document.querySelector('#'+idDiv+' .teambrain-answer-message').style.height = 0;
                        }
                        var form = document.querySelector('.teambrain-message-box .teambrain-form-form');
                        var header = document.querySelector('.teambrain-header');
                        var box = document.querySelector('.teambrain-message-box');
                        form.classList.remove('teambrain-message-box-form-hide');
                        if (!teambrainContext){
                            header.innerHTML = "Posez-nous votre question";
                        }
                        form.style.margin = "";
                        header.classList.remove('teambrain-header-return');
                        box.classList.remove('teambrain-message-box-return');
                        header.removeEventListener('mouseover', TeamBrain.backToSuggestionsHover);
                        header.removeEventListener('mouseout', TeamBrain.backToSuggestionsHoverOut);
                        box.removeAttribute('title-back');
                        header.removeEventListener('click', TeamBrain.backToInputSearch);

                        if (document.querySelector('#'+idDiv+' .teambrain-question-div')){
                            document.querySelector('#'+idDiv+' .teambrain-question-div').innerHTML = "";
                        }
                }
            }, 1000);

        }

    }
    static removeAutocompletion(idDiv){
        var autocompletion = document.querySelector('#'+idDiv+ ' .teambrain-autocompletion-box');
        if (autocompletion){
            autocompletion.parentNode.removeChild(autocompletion);
        }

        document.querySelector('#'+idDiv+' .teambrain-message-box .teambrain-form-form input').classList.remove('teambrain-autocompletion-input');
        document.querySelector('#'+idDiv+' .teambrain-message-box .teambrain-form-form button').classList.remove('teambrain-autocompletion-button');
        if (document.querySelector('#'+idDiv+' .teambrain-form-send-question')){
            document.querySelector('#'+idDiv+' .teambrain-form-send-question').classList.add('teambrain-form-send-hide');
        }


    }
    static teamBrainButtonSearch(e, idDiv, inputValue = ""){
        if (!isSearch){
            autocompletionOn = false;
            isSearch = true;
            var input = document.querySelector('#'+idDiv+ ' .teambrain-input');
            if (inputValue != ""){
                input.value = inputValue;
            }
            TeamBrain.insertQuestion(input.value, idDiv);
            if (input.value != ""){
                TeamBrain.backToInputSearch();
                document.querySelector('#'+idDiv+' .teambrain-cog').classList.add('teambrain-cog-rotate');
                document.querySelector('#'+idDiv+' .teambrain-cog').style.color = "#E3014C";
                TeamBrain.askTeamBrain(idDiv, input);
                TeamBrain.hideQuestionAnswer(idDiv);
                TeamBrain.submitQuestion(input.value, idDiv);
                TeamBrain.removeAutocompletion(idDiv);
            }else{
                isSearch = false;
            }
            setTimeout(() => {
                autocompletionOn = false;
            }, 2000);
        }
        //input.value = "";

    }
    static insertQuestionAnswer(message, idDiv){
        document.querySelector('#'+ idDiv+' .teambrain-question-div').innerHTML = "";

        var questionBox = document.querySelector('#'+idDiv + ' .teambrain-question-div');
        var isLink = false;
        for (var i=0; i < message.length ; i++){

            if (message[i]['type'] == 'question'){
                var answer = document.createElement('p');
                answer.innerHTML = message[i]['content'];
                answer.classList.add('teambrain-question');
                answer.style.fontWeight = 'initial';
                questionBox.appendChild(answer);
            }else{
                var answer = document.createElement('p');
                answer.innerHTML = message[i]['content'];
                                answer.classList.add('teambrain-answer');
                questionBox.appendChild(answer);
                Array.from(answer.getElementsByTagName('img')).forEach(function (element) {
                    if ((element.parentNode.nodeName).toLowerCase() != "a") {
                        element.onclick = function () {
                            var htmlForClicOnImage = 
                                "<!DOCTYPE html>" +
                                "<html>" +
                                  
                                    "<head>" +
                                        "<title>TeamBrain zoom<\/title>" +
                                        "<style>" +

                                            "body { text-align:center; margin: 0px; background: #0e0e0e; height: 100%; }"+
                                            "button { background-color: #fff; margin: 15px 5px; border-radius: 50px; cursor: pointer; width: 30px; height: 30px; top: 10px; border: 1px solid #ff9800; border: 1px solid var(--primary-color); box-shadow: rgb(0 0 0 / 6%) 0px 1px 6px 0px, rgb(0 0 0 / 16%) 0px 2px 32px 0px; }" +

                                        "<\/style>" +
                                    "<\/head>" +

                                    "<body>" +

                                        "<button type='button' onclick='zoomin();'> " +
                                            "+" +
                                        "<\/button>" +

                                        "<button type='button' onclick='zoomout();'> " +
                                            "-" +
                                        "<\/button>" +

                                        "<div class='box'>" +
                                            "<img src='" + this.src + "' id='teambrainImg' GFG='250' alt='teambrainImg'>" +
                                        "<\/div>" +

                                        "<script type='text\/javascript'>" +
                                            
                                            "function zoomin() {" +
                                                "var GFG = document.getElementById('teambrainImg');" +
                                                "var currHeight = GFG.clientHeight;" +
                                                "GFG.style.height = (currHeight + 120) + 'px';" +
                                            "}" +

                                            "function zoomout() {" +
                                                "var GFG = document.getElementById('teambrainImg');" +
                                                "var currHeight = GFG.clientHeight;" +
                                                "GFG.style.height = (currHeight - 120) + 'px';" +
                                            "}" +

                                        "<\/script>" +

                                    "<\/body>" +

                                "<\/html>"
                            ;

                            var contentType = "text/html";
                            var byteCharacters = htmlForClicOnImage;
                            var byteArrays = [];

                            for (var offset = 0; offset < htmlForClicOnImage.length; offset += 1024) {
                                var slice = htmlForClicOnImage.slice(offset, offset + 1024);
                                var byteNumbers = new Array(slice.length);
                                for (var i = 0; i < slice.length; i++) {
                                    byteNumbers[i] = slice.charCodeAt(i);
                                }
                                var byteArray = new Uint8Array(byteNumbers);
                                byteArrays.push(byteArray);
                            }
                            var blob = new Blob(byteArrays, { type: contentType });

                            // Open image on new tab
                            window.open( URL.createObjectURL(blob), '_blank');
                        }
                    }
                });

            }

        }
        return true;

    }
        static hideInputSearch(idDiv){
        var form = document.querySelector('#'+idDiv+' .teambrain-message-box .teambrain-form-form');
        var header = document.querySelector('#'+idDiv+' .teambrain-header');
        var box = document.querySelector('.teambrain-message-box');
        form.classList.add('teambrain-message-box-form-hide');
        form.style.margin = 0;
        form.style.marginLeft = "10px";
        header.innerHTML = "<";
        header.classList.add('teambrain-header-return');
        //box.classList.add('teambrain-message-box-return');
        header.addEventListener('mouseover', TeamBrain.backToSuggestionsHover);
        header.addEventListener('mouseout', TeamBrain.backToSuggestionsHoverOut);
        box.setAttribute('title-back', "Retour aux suggestions");
        document.querySelector('#'+idDiv+' .teambrain-message-box .teambrain-form-form input').value = "";

        header.addEventListener('click', TeamBrain.backToInputSearch);
    }
    static backToSuggestionsHover(e){
        var box = document.querySelector('.teambrain-message-box');
        box.classList.add('teambrain-message-box-return');
    }
    static backToSuggestionsHoverOut(e){
        var box = document.querySelector('.teambrain-message-box');
        box.classList.remove('teambrain-message-box-return');
    }
    static backToInputSearch(e){
        var form = document.querySelector('.teambrain-message-box .teambrain-form-form');
        var header = document.querySelector('.teambrain-header');
        var box = document.querySelector('.teambrain-message-box');
        form.classList.remove('teambrain-message-box-form-hide');
        header.innerHTML = "Posez-nous votre question";
        form.style.margin = "";
        header.classList.remove('teambrain-header-return');
        box.classList.remove('teambrain-message-box-return');
        header.removeEventListener('mouseover', TeamBrain.backToSuggestionsHover);
        header.removeEventListener('mouseout', TeamBrain.backToSuggestionsHoverOut);
        box.removeAttribute('title-back');

        TeamBrain.teamBrainButtonSearch(e, teamBrainArray[0]['idDiv'], lastSearch);
        header.removeEventListener('click', TeamBrain.backToInputSearch);

    }
    static showQuestion(uid, idDiv, isAutoCompletion){
        lastQuestionLooked = uid;
        document.querySelector('#'+idDiv+' .teambrain-form-search-div').classList.add('teambrain-form-search-div-get-question');
        document.querySelector('#'+idDiv+' .teambrain-header').classList.add('teambrain-header-return-get-question');
        document.querySelector('#'+idDiv+' .teambrain-cog').classList.add('teambrain-cog-rotate');
        document.querySelector('#'+idDiv+' .teambrain-cog').classList.add('teambrain-cog-get-question');
        document.querySelector('#'+idDiv+' .teambrain-cog').style.color = "#E3014C";
        setTimeout(() => {
            TeamBrain.removeAutocompletion(idDiv);
            TeamBrain.hideInputSearch(idDiv);
            var answerBox = document.querySelector('#'+idDiv + ' .teambrain-answer-box');
            answerBox.classList.add('teambrain-answer-box-hidden');
        }, 300);
        TeamBrain.getQuestion(uid, idDiv, isAutoCompletion);
    }
    static prepareInsertQuestionAnswer(result, idDiv){
        var form = document.querySelector('#'+idDiv+' .teambrain-form-send-question');
        var infoQuestion = document.querySelector('#'+idDiv+' .teambrain-new-question-wording');
        if (form !== null){
            form.style.height = "0px"

            setTimeout(() => {
                form.parentNode.removeChild(form);
            }, 1200);
        }
        if (infoQuestion !== null){
            infoQuestion.style.height = "0px"

            setTimeout(() => {
                infoQuestion.parentNode.removeChild(infoQuestion);
            }, 1200);
        }



        TeamBrain.insertQuestionAnswer(result, idDiv);


        var questionBox = document.querySelector('#'+idDiv + ' .teambrain-question-div');
        questionBox.classList.add('teambrain-question-div-show');
        questionBox.classList.remove('teambrain-question-div-hidden');
        document.querySelector('#'+idDiv+' .teambrain-cog').classList.remove('teambrain-cog-rotate');
        document.querySelector('#'+idDiv+' .teambrain-form-search-div').classList.remove('teambrain-form-search-div-get-question');
        document.querySelector('#'+idDiv+' .teambrain-header').classList.remove('teambrain-header-return-get-question');
        document.querySelector('#'+idDiv+' .teambrain-cog').classList.remove('teambrain-cog-get-question');
        document.querySelector('#'+idDiv+' .teambrain-cog').style.color = "";
    }
    static submitQuestion(message, idDiv){
        var questionSubmitBox = document.querySelector('#'+idDiv + ' .teambrain-submit-question-div');
        questionSubmitBox.classList.add('teambrain-submit-question-div-show');
        questionSubmitBox.classList.remove('teambrain-submit-question-div-hidden');
        questionSubmitBox.innerHTML = "";

        var formSubmit = document.createElement('form');
        formSubmit.setAttribute('onsubmit', "return false;");
        formSubmit.classList.add('teambrain-form-send-question');
        formSubmit.classList.add('teambrain-form-send-hide');
        questionSubmitBox.appendChild(formSubmit);

        var contextQuestion = document.createElement('span');
        contextQuestion.classList.add('teambrain-input-context');
        if (teambrainContext != ""){
            contextQuestion.innerHTML = "Concernant "+ teambrainContext+ ", ";
            document.querySelector('.teambrain-header').innerHTML = "Concernant " + teambrainContext;
        }
        formSubmit.appendChild(contextQuestion);


        var inputQuestion = document.createElement('textarea');
        inputQuestion.setAttribute('value', message);
        inputQuestion.innerHTML = message;
        inputQuestion.setAttribute('placeholder', 'Votre Question');
        inputQuestion.setAttribute('name', 'question');
        inputQuestion.style.height = "auto"
        inputQuestion.classList.add('teambrain-input-form');
        formSubmit.appendChild(inputQuestion);

        var inputName = document.createElement('input');
        inputName.setAttribute('name', 'name');
        inputName.setAttribute('placeholder', 'Votre prénom et nom');
        inputName.classList.add('teambrain-input-form');
        formSubmit.appendChild(inputName);

        var inputMail = document.createElement('input');
        inputMail.setAttribute('name', 'mail');
        inputMail.setAttribute('placeholder', 'Votre E-mail');
        inputMail.classList.add('teambrain-input-form');
        formSubmit.appendChild(inputMail);

        var selectTopic = document.createElement('select');
        selectTopic.setAttribute('name', 'topic');
        selectTopic.setAttribute('required', '');
        selectTopic.classList.add('teambrain-input-form');

        var optionTopic = document.createElement('option');
        optionTopic.innerHTML = "Choisissez votre thématique";
        optionTopic.disabled = true;
        optionTopic.value = "";
        optionTopic.classList.add('teambrain-input-form');
        selectTopic.appendChild(optionTopic);

        for (var i = 0 ; i < topic.length ; i++){
            var optionTopic = document.createElement('option');
            optionTopic.innerHTML = topic[i]['name'];
            optionTopic.value = topic[i]['uid'];
            optionTopic.classList.add('teambrain-input-form');
            selectTopic.appendChild(optionTopic);
        }
        formSubmit.appendChild(selectTopic);
        selectTopic.value = "";
        var button = document.createElement('button');
        button.innerHTML = "Envoyer";
        button.setAttribute("type", "button");
        button.setAttribute("onclick", "TeamBrain.sendFormQuestion('"+idDiv+"')");
        button.classList.add('teambrain-button-send-form');
        formSubmit.appendChild(button);

        document.querySelector(".teambrain-form-send-question textarea").addEventListener('keyup', TeamBrain.resizeTextarea);

    }

    static checkCta(message, idDiv, input){

        var data = {space: "pldv", community: "6942861875d64e964ceb250.92970985", lang: ""};
        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
             if (this.readyState == 4 && this.status == 200) {
               TeamBrain.insertAnswer(message, idDiv, message, JSON.parse(this.responseText));
            }
        };
        xhttp.open("POST", "https://app2.kapitaliser.com/centralBrain/front/page/teamBrainLight/getCta.php", true);
        var content = "content=" + JSON.stringify(data);
        xhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        xhttp.send(content);
    }

    static insertAnswer(message, idDiv, input, infoCta){
        //autocompletionOn = true;
        infoCta['cta'] = 'cta' in infoCta ? infoCta['cta'] : [];
        infoCta['cta']['text_color'] = 'text_color' in infoCta['cta'] ? infoCta['cta']['text_color'] : 'black';

        var teambrainBox = document.getElementById(idDiv);
        var answerBox = document.querySelector('#'+idDiv + ' .teambrain-answer-box');
        var answerContener = document.createElement('div');
        answerContener.classList.add('teambrain-answer-message');
        answerBox.appendChild(answerContener);
        var isLink = false;
        var nbrIndexQuestion = 1;
        for (var i=0; i < message.length ; i++){
            if (message[i]['type'] == 'info'){
                var answer = document.createElement('p');
                answer.classList.add('teambrain-info-bulle');
                answer.innerHTML = message[i]['content'];
                answerContener.appendChild(answer);
            }else{
                var answer = document.createElement('a');
                answer.innerHTML = "<span class='teambrain-span-number-question'>"+ nbrIndexQuestion +"/ </span>" +message[i]['content'];
                answer.setAttribute("onclick", "TeamBrain.showQuestion('"+message[i]['uid']+"', '"+idDiv+"', 0)");
                answerContener.appendChild(answer);
                nbrIndexQuestion++;
            }
        }
        if (message.length == 0){
            var answer = document.createElement('p');
            answer.innerHTML = "<span class='teambrain-info-bulle'>Aucun résultat n'a été trouvé</span>";
            answerContener.appendChild(answer);

            var answer1 = document.createElement('p');
            answer1.style.margin = "0";
            if(infoCta['replace_default_button'] == 1){
                answer1.innerHTML =
                "<div></div>" +
                "<span class='teambrain-new-question-wording' style='background-color: transparent;' onmouseover='this.style.background=\"transparent\";'>"+
                    "<a onclick='return clickOnUrl(this);' class='button-url-answer-box' style='text-decoration: none; display: inline-table; cursor: pointer; background-color: "+infoCta['cta']['color']+"; color: #fff; padding: 12px; border-radius: 4px; width:100%' href='"+infoCta['cta']['url']+"' target='_blank'>"+
                        "<span class='label-clicktoaction' style='color: "+infoCta['cta']['text_color']+";'> "+escapeHTML(infoCta['cta']['base_label'])+"</span>"+
                        "<span class='name-clicktoaction' style='display: none;'>"+infoCta['cta']['name']+"</span>"+
                    "</a>"+
                "</span>";
                answerContener.appendChild(answer1);
            }
            else{
                answer1.innerHTML = "<div style='text-align:center; margin-top: 20px; color: #000 !important;'>Votre question est nouvelle</div><span onclick='TeamBrain.showFormToSendQuestion(\""+idDiv+"\");' class='teambrain-new-question-wording'>Cliquez ici</span>";
                answerContener.appendChild(answer1);
            }
        }else{
            var answer = document.createElement('p');
            answer.style.margin = "0";
            if(infoCta['replace_default_button'] == 1){
                answer.innerHTML =
                    "<div></div>" +
                    "<span class='teambrain-new-question-wording' style='background-color: transparent;' onmouseover='this.style.background=\"transparent\";'>"+
                        "<a onclick='return clickOnUrl(this);' class='button-url-answer-box' style='text-decoration: none; display: inline-table; cursor: pointer; background-color: "+infoCta['cta']['color']+"; color: #fff; padding: 12px; border-radius: 4px; width:100%' href='"+infoCta['cta']['url']+"' target='_blank'>"+
                            "<span class='label-clicktoaction' style='color: "+infoCta['cta']['text_color']+";'> "+escapeHTML(infoCta['cta']['base_label'])+"</span>"+
                            "<span class='name-clicktoaction' style='display: none;'>"+infoCta['cta']['name']+"</span>"+
                        "</a>"+
                    "</span>"
                ;
                answerContener.appendChild(answer);
            }
            else{
                answer.innerHTML = "<div style='text-align:center; margin-top: 20px; color: #000 !important;'>Votre question est nouvelle</div><span onclick='TeamBrain.showFormToSendQuestion(\""+idDiv+"\");' class='teambrain-new-question-wording'>Cliquez ici</span>";
                answerContener.appendChild(answer);
            }
        }

        var objDiv = document.querySelector(".teambrain-message-box");
        objDiv.scrollTop = objDiv.scrollHeight;
        isSearch = false;
        document.querySelector('#'+idDiv+' .teambrain-cog').classList.remove('teambrain-cog-rotate');
        document.querySelector('#'+idDiv+' .teambrain-cog').style.color = "";

    }
    static showFormToSendQuestion(idDiv){
        TeamBrain.hideSuggestions(idDiv);
        document.querySelector("#"+idDiv+" .teambrain-form-send-question").classList.remove("teambrain-form-send-hide");
        document.querySelector("#"+idDiv+" .teambrain-new-question-wording").classList.add("teambrain-new-question-wording-hide");
        setTimeout(() => {
            var objDiv = document.querySelector(".teambrain-great-div");
            objDiv.scrollTop = objDiv.scrollHeight;
        }, 1000);

    }
    static hideSuggestions(idDiv){
        var div = document.querySelector('#'+idDiv+' .teambrain-answer-message');
        var infoDiv = document.querySelector('#' + idDiv + ' .teambrain-info-bulle');
        div.style.height = div.offsetHeight + "px";

        //div.style.height = "30px";
        infoDiv.style.height = infoDiv.offsetHeight + "px";

        div.style.overflow = "hidden";

        infoDiv.innerHTML = "<span></span>";
        infoDiv.classList.add('teambrain-info-bulle-hover');

        var button = document.querySelector('#'+idDiv+' .teambrain-info-bulle-hover span');
        button.classList.add('tb-chev-left');
        button.classList.add('fa-teambrain-chev-left');
        button.classList.add('fa-teambrain');
        button.setAttribute('title-back', "Retour aux suggestions");
        button.addEventListener('click', TeamBrain.backToSuggestions);
        setTimeout(() => {
            div.style.height = "30px";
        }, 300);

    }
    static backToSuggestions(e){
        setTimeout(() => {
            TeamBrain.teamBrainButtonSearch(e, teamBrainArray[0]['idDiv']);
        }, 300);

        /*
        var form = document.querySelector('.teambrain-message-box .teambrain-form-form');
        var header = document.querySelector('.teambrain-header');
        var box = document.querySelector('.teambrain-message-box');
        form.classList.remove('teambrain-message-box-form-hide');
        header.innerHTML = "Posez-nous votre question";
        form.style.margin = "";
        header.classList.remove('teambrain-header-return');
        box.classList.remove('teambrain-message-box-return');
        box.removeAttribute('title-back');

        TeamBrain.teamBrainButtonSearch(e, teamBrainArray[0]['idDiv']);
        header.removeEventListener('click', TeamBrain.backToInputSearch); */

    }
    static insertQuestion(message, idDiv){
        document.querySelector('#'+ idDiv+' .teambrain-answer-box').innerHTML = "";
        document.querySelector('#'+ idDiv+' .teambrain-submit-question-div').innerHTML = "";


        var answerBox = document.querySelector('#'+idDiv + ' .teambrain-answer-box');
        var answerContener = document.createElement('div');
        answerContener.classList.add('teambrain-answer-contener');
        answerBox.appendChild(answerContener);
        /*
        var answer = document.createElement('p');
        answer.innerHTML = "Votre question : " +message;
        answerContener.appendChild(answer); */

        var objDiv = document.querySelector(".teambrain-message-box");
        objDiv.scrollTop = objDiv.scrollHeight;

    }

    static newQuestionWasSend(idDiv){
        var questionSubmitBox = document.querySelector('#'+idDiv + ' .teambrain-submit-question-div');
        var infoQuestion = document.createElement('p');
        infoQuestion.classList.add('teambrain-new-question-wording');
        infoQuestion.classList.add('teambrain-question-send');
        infoQuestion.innerHTML = "Votre question a été envoyée, vous recevrez une réponse par mail.";
        questionSubmitBox.appendChild(infoQuestion);

        var form = document.querySelector('#'+idDiv+' .teambrain-form-send-question');
        form.style.height = "0px";
        form.style.overflow = "hidden";
        form.style.paddingBottom = "0px";
        var newQuestionInfo = document.querySelector('#'+idDiv + ' .teambrain-new-question-wording');
        newQuestionInfo.parentNode.removeChild(newQuestionInfo);
        var button = document.querySelector('#'+idDiv+' .teambrain-button-send-form');
        button.style.height = "0px";
        button.style.transition = "0.5s";
        button.style.paddingTop = "0px";
        button.style.paddingBottom = "0px";
        button.style.overflow = "hidden";
        var infoWidth = infoQuestion.offsetWidth;
        var infoHeight = infoQuestion.offsetHeight;

        setTimeout(() => {
            button.parentNode.removeChild(button);
        }, 500);

        setTimeout(() => {
        }, 800);
        setTimeout(() => {
            form.parentNode.removeChild(form);
        }, 3000);
        document.querySelector('#'+idDiv+' .teambrain-answer-message').innerHTML = "";
        document.querySelector('#' + idDiv + ' .teambrain-answer-message').style.height = 0;

        setTimeout(() => {
            infoQuestion.style.opacity = 0;
            document.querySelector('#'+idDiv+' .teambrain-input').value = "";
        }, 3000);
        setTimeout(() => {
            infoQuestion.parentNode.removeChild(infoQuestion);
        }, 3000);


    }
    static autocompletionWasSend(response, idDiv){
        TeamBrain.insertAutocompletion(response['questions'], idDiv);
        potentialQuestion = response['potential'];
    }
    static insertAutocompletion(response, idDiv){
        TeamBrain.removeAutocompletion(idDiv);
        document.querySelector('#'+idDiv+' .teambrain-cog').classList.remove('teambrain-cog-rotate');
        if (autocompletionOn == true && response.length > 0){

            var messageBox = document.querySelector('#'+idDiv+' .teambrain-form-search-div');
            var autocompletionBox = document.createElement('div')
            autocompletionBox.classList.add('teambrain-autocompletion-box');

            document.querySelector('#'+idDiv+' .teambrain-message-box .teambrain-form-form input').classList.add('teambrain-autocompletion-input');
            document.querySelector('#'+idDiv+' .teambrain-message-box .teambrain-form-form button').classList.add('teambrain-autocompletion-button');

            messageBox.appendChild(autocompletionBox);
            let loopN = response.length;
            if (loopN > 3){
                loopN = 3;
            }
            for (var i = 0 ; i< loopN ; i++){
                var anchor = document.createElement('a');
                anchor.setAttribute("onclick", "TeamBrain.showQuestion('"+response[i]['uid']+"', '"+idDiv+"', 1)");
                anchor.innerHTML = '<i class="fa-teambrain-database fas-teambrain"></i>'+response[i]['content'];
                anchor.classList.add('teambrain-autocompletion-anchor');
                autocompletionBox.appendChild(anchor);
            }
            var anchor = document.createElement('a');
            anchor.addEventListener('click', function(e){
                setTimeout(() => {
                    TeamBrain.teamBrainButtonSearch(e, idDiv);
                }, 200);
            });
            //anchor.setAttribute("onclick", "TeamBrain.teamBrainButtonSearch('', '"+idDiv+"')");
            anchor.innerHTML = '<i class="fa-teambrain-database fas-teambrain"></i>Voir plus...';
            anchor.classList.add('teambrain-autocompletion-anchor');
            autocompletionBox.appendChild(anchor);

        }

        autocompletionOn = false;

    }
    static missingInput(idDiv){
        var button = document.querySelector('#'+idDiv + ' .teambrain-form-send-question button');
        var value = button.innerHTML
        button.innerHTML = "Des élements sont manquants.";
        setTimeout(() => {
            button.innerHTML = value;

        }, 1000);
    }
    static showOriginalAnswer(answerAnchor, anchorText, content){
        answerAnchor.setAttribute('onclick', 'TeamBrain.showTranslatedAnswer(this, "'+(answerAnchor.innerHTML + '').replace(/[\\"']/g, '\\$&').replace(/\u0000/g, '\\0')+'",  "'+ (answerAnchor.parentNode.childNodes[0].innerHTML + '').replace(/[\\"']/g, '\\$&').replace(/\u0000/g, '\\0') +'")');
        answerAnchor.innerHTML = anchorText;
        answerAnchor.parentNode.childNodes[0].innerHTML = content;
    }
    static showOriginalAnswer(answerAnchor, anchorText, content){
        answerAnchor.setAttribute('onclick', 'TeamBrain.showOriginalAnswer(this, "'+(answerAnchor.innerHTML + '').replace(/[\\"']/g, '\\$&').replace(/\u0000/g, '\\0')+'",  "'+  (answerAnchor.parentNode.childNodes[0].innerHTML + '').replace(/[\\"']/g, '\\$&').replace(/\u0000/g, '\\0')+'")');
        answerAnchor.innerHTML = anchorText;
        answerAnchor.parentNode.childNodes[0].innerHTML = content;
    }
    static addContext(string){
        setTimeout(() => {
            teamBrainArray[0]['statusBox'] = "close";
            TeamBrain.openCloseTeamBrain(teamBrainArray[0]['idDiv'], 0);
            var contextSpan = document.querySelector('.teambrain-input-context');
            teambrainContext = string;
            document.querySelector('.teambrain-header').innerHTML = "Concernant " + string;
            if (contextSpan){
                contextSpan.innerHTML = "Concernant " + string + ", ";
            }
        }, 300);
    }
    static removeContext(){
        setTimeout(() => {
            var contextSpan = document.querySelector('.teambrain-input-context');
            teambrainContext = "";
            if (contextSpan){
                document.querySelector('.teambrain-header').innerHTML = "Posez-nous votre question";
                contextSpan.innerHTML = "";
            }
        }, 300);

    }

    /**
     * ------------------------ FUNCTION THAT MAKE REST CALL ------------------------
     */
    static getTeamBrainData(message, secureKey, idDiv){
        var messageToSend = message;

        //Here the REST call to get the questions suggested of a question asked >> var: *message*
        var data = {potentialQuestion: potentialQuestion, question: messageToSend, tag: teambrainContext, space: "pldv", community: "6942861875d64e964ceb250.92970985", lang: ""};
        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
             if (this.readyState == 4 && this.status == 200) {
                TeamBrain.checkCta(JSON.parse(this.responseText), idDiv, message);
            }
        };
        xhttp.open("POST", "https://app2.kapitaliser.com/centralBrain/front/page/teamBrainLight/getSuggestions.php", true);
        var content = "content=" + JSON.stringify(data);
        xhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        xhttp.send(content);
    }
    static getQuestion(uid, idDiv,isAutoCompletion){
        //Here the REST call to get the answers of a question >> var: *question*
        var data = {potentialQuestion: potentialQuestion, uid: uid, space: "pldv", isAutoCompletion: isAutoCompletion, question: lastSearch, community: "6942861875d64e964ceb250.92970985", lang: ""};
        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
             if (this.readyState == 4 && this.status == 200) {
                TeamBrain.prepareInsertQuestionAnswer(JSON.parse(this.responseText), idDiv);
            }
        };
        xhttp.open("POST", "https://app2.kapitaliser.com/centralBrain/front/page/teamBrainLight/getQuestionAnswer.php", true);
        var content = "content=" + JSON.stringify(data);
        xhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        xhttp.send(content);
    }

    static sendFormQuestion(idDiv){

        var questionToSend = document.querySelector('#'+idDiv + ' .teambrain-form-send-question textarea').value;
        var nameToSend = document.querySelector('#'+idDiv + ' .teambrain-form-send-question input[name="name"]').value;
        var mailToSend = document.querySelector('#'+idDiv + ' .teambrain-form-send-question input[name="mail"]').value;
        var topicToSend = document.querySelector('#'+idDiv + ' .teambrain-form-send-question select').value;

        if (questionToSend != "" && nameToSend != "" && mailToSend != "" && topicToSend !== "" ){
            TeamBrain.newQuestionWasSend(idDiv);
            //Here the REST call to send a new question >> var: *questionToSend*, *nameToSend*, *mailToSend*
            var data = {potentialQuestion: potentialQuestion, question: questionToSend, tag: teambrainContext, name: nameToSend,mail: mailToSend,topic: topicToSend, space: "pldv", community: "6942861875d64e964ceb250.92970985", lang: ""};
            var xhttp = new XMLHttpRequest();
            xhttp.onreadystatechange = function() {
                if (this.readyState == 4 && this.status == 200) {
                    //Let the user know the question was send and remove button
                }
            };
            xhttp.open("POST", "https://app2.kapitaliser.com/centralBrain/front/page/teamBrainLight/postNewQuestion.php", true);
            var content = "content=" + JSON.stringify(data);
            xhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
            xhttp.send(content);
        }else{
            TeamBrain.missingInput(idDiv);
        }
    }
    static getAutocompletion(message, idDiv){
        var messageToSend = message;
        //Here the REST call to send a get autocompletion >> var: *message*
        var data = {potentialQuestion: potentialQuestion, question: messageToSend, tag: teambrainContext, space: "pldv", community: "6942861875d64e964ceb250.92970985", lang: ""};
        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
             if (this.readyState == 4 && this.status == 200) {
                //Let the user know the question was send and remove button
                TeamBrain.autocompletionWasSend(JSON.parse(this.responseText), idDiv);
            }
        };
        xhttp.open("POST", "https://app2.kapitaliser.com/centralBrain/front/page/teamBrainLight/getAutocompletion.php", true);
        var content = "content=" + JSON.stringify(data);
        xhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        xhttp.send(content);
    }
    static initIframeIACB(iframe){
        document.querySelector('.teambrain-great-div').classList.add('tb-hide-scrollbar');
        setTimeout(() => {
            if (iframe.contentDocument != null){
                document.querySelector('.iacb-iframe').style.height = (document.querySelector('.teambrain-great-div').offsetHeight-150)+"px";            }
        }, 1100);
    }
    static initIframeIAD(iframe){
        iadFrame = iframe;
        addEventListener("message", function(e){
            if (e.data.startsWith("iad-frame")){
                var height = parseInt(e.data.slice(9));
                iadFrame.style.height = (height+50)+"px";
            }
        }, false);

        /*setInterval(() => {
            if (iframe.contentDocument != null){
                iframe.style.height = (iframe.contentDocument.body.offsetHeight+50)+"px";
            }
        }, 1000);*/
    }

};

function escapeHTML( text ) {
    return text.replace( /&/g, "&amp;" )
        .replace( /</g, "&lt;" )
        .replace( />/g, "&gt;" )
        .replace( /"/g, "&quot;" )
        .replace( /'/g, "&#39;" )
    ;
}

/**
 * [clickOnUrl Calls the service which increments the click to action statistic, by seeing data in json via an ajax request]
 *
 * @param  {[type]} anchor [description]
 *
 * @return {[type]}        [description]
 */
function clickOnUrl(anchor){

    let name;
    let label = anchor.getElementsByClassName('label-clicktoaction')[0].innerHTML;

    // Raw text recovery (without html char)
    if (anchor.getElementsByClassName('name-clicktoaction').length > 0){
    
        name = anchor.getElementsByClassName('name-clicktoaction')[0].innerHTML;
    }else{

        name = label;
    }

    var data = {
        "content":{
            "href": anchor.href,
            "name": name,
            "label": label,
            "ref_user": "lightforwebsite",
            "ref_question": lastQuestionLooked,
            "ref_community": "6942861875d64e964ceb250.92970985",
            "login": "lightforwebsite",
            "space": "pldv"
        }
    };

    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            return true;
        }
    };
    xhttp.responseType = 'json';
    xhttp.open("POST", "https://app2.kapitaliser.com/centralBrain/front/page/statButton/statButton.php", true);

    xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
    xhttp.send( JSON.stringify(data) );
}

function openModalFormulaireLeads(button){
    TeamBrain.goUp("");
    document.querySelector('.teambrain-great-div').style.minHeight = "0px";
    var modal = document.getElementById("modal-formulaire-leads");
    button.parentNode.parentNode.querySelector("input[name=nomForm]").style.width = "220px";
    button.parentNode.parentNode.querySelector("input[name=prenomForm]").style.width = "220px";
    button.parentNode.parentNode.querySelector("input[name=emailForm]").style.width = "220px";
    button.parentNode.parentNode.querySelector("select[name=etudeForm]").style.width = "220px";
    modal.style.display = "block";
    document.querySelector('.teambrain-great-div').style.minHeight = "425px";
}

function closeModalFormulaireLeads(button){
    var modal = document.getElementById("modal-formulaire-leads");
    modal.style.display = 'none';
    document.querySelector('.teambrain-great-div').style.minHeight = "0px";
}

function validateFormulaireLeads(button){
    var data = {};
    data['nom'] = button.parentNode.querySelector("input[name=nomForm]").value;
    data['prenom'] = button.parentNode.querySelector('input[name=prenomForm]').value;
    data['email'] = button.parentNode.querySelector('input[name=emailForm]').value;
    data['etude'] = button.parentNode.querySelector('select[name=etudeForm]').value;
    data['ecole'] = "ESILV";

    if(data['ecole'] == "EMLV") data['ecole'] = "EMLVPGE";
    if(data['ecole'] == "ESILV") data['ecole'] = "ESILVCI";
    if(data['ecole'] == "IIM") data['ecole'] = "IIMAP";

    // verif champs vides
    if(data['nom'] === "") button.parentNode.querySelector("input[name=nomForm]").style.borderColor = "red";
    else button.parentNode.querySelector("input[name=nomForm]").style.borderColor = "";
    if(data['prenom'] === "") button.parentNode.querySelector("input[name=prenomForm]").style.borderColor = "red";
    else button.parentNode.querySelector("input[name=prenomForm]").style.borderColor = "";
    if(data['email'] === "") button.parentNode.querySelector("input[name=emailForm]").style.borderColor = "red";
    else button.parentNode.querySelector("input[name=emailForm]").style.borderColor = "";
    if(data['etude'] === "Votre niveau d'étude*") button.parentNode.querySelector("select[name=etudeForm]").style.borderColor = "red";
    else button.parentNode.querySelector("select[name=etudeForm]").style.borderColor = "";
    if(data['nom'] !== "" && data['prenom'] !== "" && data['email'] !== "" && data['etude'] !== "Votre niveau d'étude*"){
        button.disabled = true;
        button.innerHTML = "Envoyé";
        button.style.backgroundColor = "#d6b186";
        button.style.cursor = "not-allowed";
        setTimeout(() => {
            closeModalFormulaireLeads("");
        }, 1500);
        // Envoi REST
        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {

            }
        };
        xhttp.open("POST", "https://app2.kapitaliser.com/centralBrain/front/page/specific/pldv/formulaireLeads/externalPost.php", true);
        var content = "contact_nom="+data['nom']+"&contact_prenom="+data['prenom']+"&contact_email="+data['email']+"&niveau="+data['etude']+"&origine=teambrain&choix_prog="+data['ecole'];
        xhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        xhttp.send(content);
    }
}
function changeMultipleAnswer(objSelect){
    if (objSelect.value == "propose_choice"){

        openProposeForm(objSelect.id);
    //  document.querySelector('#'+objSelect.id).value = document.querySelector('#'+objSelect.id).childNodes[0].value;
    }else{
        for (var i = 0 ; i < document.querySelector('#'+objSelect.id).parentNode.childNodes[1].childNodes.length ; i++){
        document.querySelector('#'+objSelect.id).parentNode.childNodes[1].childNodes[i].style.display = "none";
    }
    document.querySelector('#'+objSelect.id).parentNode.childNodes[1].childNodes[document.querySelector('#'+objSelect.id).selectedIndex].style.display = "block";
    }
}
function IAD_changeUrl(href){
    var url = "https://app2.kapitaliser.com/app/public";
    href = href.split("?")[1];
    if (parent){
        parent.location.href = url+"?"+href;
    }else{
        location.href = url+"?"+href;
    }
}
var iadFrame;
var tbLightOpen = false;
var adaptVarTeambrain;
var teambrainContext = "";
var topic = JSON.parse('[{\"uid\":\"2976560885d8b67a96e4811.64444176\",\"name\":\"Admissions\"},{\"uid\":\"8650445265d64e964cf7c63.45000476\",\"name\":\"Autre\"}]');
var lastSearch = "";
var lastQuestionLooked = "";
var isSearch = false;
var autocompletionOn = false;
var teamBrainArray = [];
var teamBrainIndex = 0;
var potentialQuestion = "";
var browser = (function (agent) {
        switch (true) {
            case agent.indexOf("edge") > -1: return "edge";
            case agent.indexOf("edg") > -1: return "chromium based edge (dev or canary)";
            case agent.indexOf("opr") > -1 && !!window.opr: return "opera";
            case agent.indexOf("chrome") > -1 && !!window.chrome: return "chrome";
            case agent.indexOf("trident") > -1: return "ie";
            case agent.indexOf("firefox") > -1: return "firefox";
            case agent.indexOf("safari") > -1: return "safari";
            default: return "other";
        }
})(window.navigator.userAgent.toLowerCase());
if (browser != "edge"){
    teambrain = new TeamBrain("teambrain-box", 'theKey');
}else{
    console.log("TeamBrain detected the old version of Edge. Please update to the newer Chromium based.")
}