|
@@ -0,0 +1,110 @@
|
|
|
+// Chat Homework
|
|
|
+
|
|
|
+// 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'))
|
|
|
+// }
|
|
|
+// }
|
|
|
+// })
|
|
|
+// }
|
|
|
+
|
|
|
+// Stage 0
|
|
|
+
|
|
|
+// jsonPost("http://students.a-level.com.ua:10012", {func: 'addMessage', nick: 'Anon', message: 'Я не умею копипастить в консоль, зато умею жать красную кнопку.'})
|
|
|
+// в чате увидела изменения
|
|
|
+
|
|
|
+// Stage 1-4
|
|
|
+
|
|
|
+let btn = document.querySelector('#buttonBox')
|
|
|
+btn.innerText = 'Send'
|
|
|
+let nick = document.querySelector('#nicknameBox')
|
|
|
+let msg = document.querySelector('#messageBox')
|
|
|
+
|
|
|
+// btn.onclick = function sendMessage() {
|
|
|
+// let nick = document.querySelector('#nicknameBox').value
|
|
|
+// let msg = document.querySelector('#messageBox').value
|
|
|
+// jsonPost("http://students.a-level.com.ua:10012", {func: 'addMessage', nick: nick, message: msg})
|
|
|
+// document.querySelector('#nicknameBox').value = ''
|
|
|
+// document.querySelector('#messageBox').value = ''
|
|
|
+// }
|
|
|
+
|
|
|
+// function addMessage() {
|
|
|
+// setInterval(function() {
|
|
|
+// jsonPost("http://students.a-level.com.ua:10012", {func: 'getMessages', messageId: 0})
|
|
|
+// .then (post => {console.log(post.data)
|
|
|
+// for(messageId in post.data) {
|
|
|
+// let chat = document.querySelector('#chatBox')
|
|
|
+// let div = document.createElement('div')
|
|
|
+// let p = document.createElement('p')
|
|
|
+// p.innerHTML = post.data[messageId].nick + ':' + ' ' + post.data[messageId].message
|
|
|
+// let t = document.createElement('time')
|
|
|
+// t.innerHTML = `${new Date(post.data[messageId].timestamp).toLocaleString()}`
|
|
|
+// chat.prepend(div)
|
|
|
+// div.append(p)
|
|
|
+// div.append(t)
|
|
|
+// }
|
|
|
+// messageId = post.nextMessageId})
|
|
|
+// },3000)
|
|
|
+// }
|
|
|
+// addMessage()
|
|
|
+
|
|
|
+// Stage 5
|
|
|
+
|
|
|
+async function sendMessage(nick, msg) {
|
|
|
+ jsonPost('http://students.a-level.com.ua:10012', {func: 'addMessage', nick: nick, message: msg})
|
|
|
+ document.querySelector('#nicknameBox').value = ''
|
|
|
+ document.querySelector('#messageBox').value = ''
|
|
|
+}
|
|
|
+
|
|
|
+async function getMessages() {
|
|
|
+ jsonPost("http://students.a-level.com.ua:10012", {func: 'getMessages', messageId: 0})
|
|
|
+ .then (post => {console.log(post.data)
|
|
|
+ for(messageId in post.data) {
|
|
|
+ let chat = document.querySelector('#chatBox')
|
|
|
+ let div = document.createElement('div')
|
|
|
+ let p = document.createElement('p')
|
|
|
+ p.innerHTML = post.data[messageId].nick + ':' + ' ' + post.data[messageId].message
|
|
|
+ let t = document.createElement('time')
|
|
|
+ t.innerHTML = `${new Date(post.data[messageId].timestamp).toLocaleString()}`
|
|
|
+ chat.prepend(div)
|
|
|
+ div.append(p)
|
|
|
+ div.append(t)
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+async function sendAndCheck() {
|
|
|
+ await sendMessage(nick.value, msg.value)
|
|
|
+ await getMessages()
|
|
|
+}
|
|
|
+
|
|
|
+btn.onclick = () => sendAndCheck()
|
|
|
+
|
|
|
+async function checkLoop() {
|
|
|
+ while (true) {
|
|
|
+ getMessages()
|
|
|
+ delay(3000)
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+checkLoop()
|
|
|
+
|
|
|
+// Stage 6
|
|
|
+
|
|
|
+async function jsonPost(url, data) {
|
|
|
+ let response = await fetch(url, {method: 'POST', body: JSON.stringify(data)})
|
|
|
+ return await response.json()
|
|
|
+}
|
|
|
+
|
|
|
+let delay = ms => new Promise(ok => {setTimeout(() => ok(ms), ms)})
|