const chat = document.getElementsByClassName("chat")[0];
const textInput = document.getElementsByTagName("input")[0];
const ROLLING_EYES = "&#x1F644";

function addMessage(text="", isUser=true){
    chat.innerHTML += `<div class="message ${((isUser)?'user':'system') + 'Message'}">${text}</div>`;
}


function deleteLastMessage() {
    var systemMessages = document.getElementsByClassName("systemMessage");

    chat.removeChild(systemMessages[systemMessages.length - 1]);

}
function sendMessage(){
    let inputValue = textInput.value;
    if (inputValue.length == 0) {
        return;
    }
    addMessage(inputValue);
    addMessage("...", false);
    setTimeout(() => { 
        deleteLastMessage();
    
        // reply
        let userMock = randomCap(inputValue);
        let mockMessage = randomLine();
        let urlStr = buildUrl(inputValue);
        addMessage(
            `"${userMock}"	${ROLLING_EYES} <br/><br/> ${mockMessage} <br/> 
            <a href="${urlStr}" target="none">${urlStr}</a>`,
            false
        );}
    , 2000);

    textInput.value = "";
        
}

function randomCap(text){
    let retText = "";
    for (let i = 0; i < text.length; i++){
        let shouldCap = Math.random();
        retText += (shouldCap > 0.5)?text[i].toUpperCase():text[i].toLowerCase();
    }
    return retText;
}

function randomLine(){
    var index = Math.floor(Math.random() * comebacks.length);
    return comebacks[index];
}


addEventListener("keypress", (event) => {
    if (document.activeElement == textInput && event.keyCode == 13) {
        sendMessage();
    }
});

function buildUrl(message) {
    const queryParams = message.trim().replaceAll(' ', '+');
    return "https://www.google.com/search?q=" + queryParams;
}