HomeWork_JS/Js_16_async_chat/js.js

//1. Chat

async function jsonPost(url, data){
    try {
        let response = await fetch(url, {
            method: 'POST',
            body: JSON.stringify(data)
        })
        if (response.ok) {
            let json = await response.json()
            return json}
    } catch (error) {
        console.log('ошибка: ' + error) //ловим ошибки
    }
}

send.onclick = sendAndCheck

async function sendAndCheck() {
    await sendMessage(userName.value, userMessage.value)
    getMessages (nextMessageId)
}

async function sendMessage(nick, message) {
    if (nick && message) {
        jsonPost("http://students.a-level.com.ua:10012", { func: 'addMessage', nick, message })
    }
}

async function getMessages (id) {
    const res = await jsonPost("http://students.a-level.com.ua:10012", { func: "getMessages", messageId: id}).then(res => res)

    nextMessageId = res.nextMessageId

    for(const msg of res.data){

        const chatBox = document.createElement('div')
        chat.prepend(chatBox)

        const chatName = document.createElement('div')
        chatBox.append(chatName)
        chatName.innerText = msg.nick + ': '
        chatName.classList.add('name')

        const chatMessage = document.createElement('div')
        chatBox.append(chatMessage)
        chatMessage.innerText = msg.message
        chatMessage.classList.add('text')

        const time = document.createElement('div');
        time.classList.add('time')
        const data = new Date(msg.timestamp)
        time.innerText = data.toLocaleDateString() + ' ' + data.toLocaleTimeString();
        chatBox.append(time)
    }
}

let nextMessageId = 0

function delay(ms){
    function executor(fulfill, reject){
        setTimeout(() => fulfill(ms), ms)
    }
    return new Promise(executor)
}

async function checkLoop() {
    while(true) {
        getMessages (nextMessageId)
        await delay(2000)
    }
}

checkLoop()

//2. SWAPI Links
// Напишите промисифицированную функцию, которая принимать параметром ссылку на swapi.dev
// (например, https://swapi.dev/api/people/20) и скачивать всю информацию по ссылке, включая вложенные ссылки. Все
// ссылки внутри скачанного объекта должны заменяться на скачанные объекты. Полученный общий объект должен стать
// результатом промиса, который возвращает функция.
// Например, ссылка, приведенная выше позволяет информацию о Йода Мастере скачать:


function fetchGet (url) {
    return fetch(url)
        .then((response) => {
            if (response.ok) {
                return response.json()
            } else {
                return Promise.reject(new Error(response.statusText))
            }
        } )
}

function swapiLinks (url) {
    let obj;
    return fetchGet(url)
        .then((response) => {
            console.log(response);
            obj = response;
            const linkPromises = [];
            Object.values(obj).forEach(value => {
                if (typeof value == 'string' && value.includes('https://swapi.dev/api/')) {
                    linkPromises.push(fetchGet(value));
                } else if (Array.isArray(value)) {
                    value.forEach((el) => {
                        if (typeof el == 'string' && el.includes('https://swapi.dev/api/')) {
                            linkPromises.push(fetchGet(el));
                        }
                    })
                }
            })
            return Promise.all(linkPromises)
        }).then(linkResponses => {
            Object.keys(obj).forEach(key => {
                if (typeof obj[key] == 'string' && obj[key].includes('https://swapi.dev/api/')) {
                    obj[key] = linkResponses.shift();
                } else if (Array.isArray(obj[key])) {
                    obj[key].forEach((el, i) => {
                        if (typeof el == 'string' && el.includes('https://swapi.dev/api/')) {
                            obj[key][i] = linkResponses.shift();
                        }
                    });
                }
            });
            return Promise.resolve(obj);
        })
        .catch((error) => {
            return Promise.reject(error);
        });
}

swapiLinks("https://swapi.dev/api/people/20/")
    .then(yodaWithLinks => {
        console.log(JSON.stringify(yodaWithLinks, null, 4));
    })
    .catch((error) => {
        console.log(error);
    });

//domEventPromise +
// Реализуйте промисифицированную функцию, которая резолвит промис по событию в DOM:
// Функция должна:
//
//     используя addEventListener повесить свой обработчик события на DOM element событие eventName
// по событию зарезолвить промис отдав в качестве результата объект события
// убрать обработчик с DOM-элемента, используя removeEventListener.
//
//     Убедитесь, что действительно убираете обработчик после резолва промиса. Он больше не нужен.

function domEventPromise(element, eventName) {
    function executor (resolve) {
        let myEvent = event => {
            resolve(event);
            element.removeEventListener(eventName, myEvent)
        }
        element.addEventListener(eventName, myEvent)
    }
    return new Promise(executor)
}
let button = document.createElement('button')
document.body.append(button)
button.innerText = "Click"
domEventPromise(button, 'click').then( e => console.log('event click happens', e))