Homework/hw14/main.js

function jsonPost(url, data)
{
    return new Promise((resolve, reject) => {
        var x = new XMLHttpRequest();   
        x.onerror = () => reject(new Error('jsonPost failed'))
        //x.setRequestHeader('Content-Type', 'application/json');
        x.open("POST", url, true);
        x.send(JSON.stringify(data))

        x.onreadystatechange = () => {
            if (x.readyState == XMLHttpRequest.DONE && x.status == 200){
                resolve(JSON.parse(x.responseText))
            }
            else if (x.status != 200){
                reject(new Error('status is not 200'))
            }
        }
    })
}

let sendBtn = document.getElementById('sendButton')
sendBtn.onclick = function sendMsg () {
    let nick = document.getElementById('nickInput').value
    let msg = document.getElementById('msgInput').value
    jsonPost("http://students.a-level.com.ua:10012", {func: 'addMessage', nick: nick, message: msg })
}
sendBtn.innerHTML = "Send"
let nickInput = document.getElementById('nickInput')
let msgInput = document.getElementById('msgInput')
nickInput.style.width = '99.5%'
msgInput.style.width = '99.5%'
sendBtn.style.width = '100%'
nickInput.style.height = '40px'
msgInput.style.height = '40px'
msgInput.style.marginTop = '20px'
sendBtn.style.marginTop = '20px'
sendBtn.style.height = '40px'
nickInput.style.fontSize = '20px'
msgInput.style.fontSize = '20px'
sendBtn.style.fontSize = '20px'

function addMsg () {
    let startMsg = 0;
    setInterval(function(){
        jsonPost("http://students.a-level.com.ua:10012", {func: "getMessages", messageId: startMsg}).then (result => {console.log(result.data)
        for(startMsg in result.data) {
            let chat = document.getElementById('chat')
            let divMessage = document.createElement('div')
            divMessage.style.border = '1px solid black'
            divMessage.style.borderRadius = '10px'
            divMessage.style.marginTop = '10px'
            divMessage.style.backgroundColor = '#1E90FF'
            divMessage.style.color = 'white'
            let pMsg = document.createElement('p')
            pMsg.innerHTML = result.data[startMsg].nick + ':' + ' ' + result.data[startMsg].message
            pMsg.style.marginLeft = '20px'
            pMsg.style.fontSize = '30px'
            let time = document.createElement('p')
            time.innerHTML = `${new Date(result.data[startMsg].timestamp).toLocaleString()}`
            time.style.marginLeft = '20px'
            divMessage.append(pMsg)
            divMessage.append(time)
            chat.prepend(divMessage)
        }
        startMsg = result.nextMessageId})
    },2000)
}
addMsg()