-
Notifications
You must be signed in to change notification settings - Fork 0
/
main.js
79 lines (52 loc) · 2.17 KB
/
main.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
function setTimer (min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min)) + min;
}
getMessage = async () => {
let response = await fetch('https://baconipsum.com/api/?type=all-meat&sentences=1&start-with-lorem=1');
if (response.ok) {
return response.json();
} else return new Error('Error');
}
createMessage = (user) => {
getMessage().then(resultMessages => {
const chat = document.querySelector('.chat-area');
let message = document.createElement('div');
message.innerHTML = `<img src="${user.avatar}"><span class="username">${user.firstName + ' ' + user.lastName}</span><span class="user-age">Age: ${user.age}</span><span class="user-text">${resultMessages}</span>`
message.classList.add('user-message');
chat.appendChild(message);
})
}
getUser = async () => {
let response = await fetch('https://randomuser.me/api');
if (response.ok) {
return response.json();
} else return new Error('Error');
}
createUser = (end) => {
getUser().then(resultUsers => {
let userInfo = {
'avatar': resultUsers.results[0].picture.medium,
'firstName': resultUsers.results[0].name.first,
'lastName': resultUsers.results[0].name.last,
'age': resultUsers.results[0].dob.age,
'city': resultUsers.results[0].location.city,
'phoneNumber': resultUsers.results[0].cell,
};
const users = document.querySelector('.user-area');
let user = document.createElement('div');
user.innerHTML = `<img src="${userInfo.avatar}"><span class="username">${userInfo.firstName + ' ' + userInfo.lastName}</span><span class="user-city">City: ${userInfo.city}</span><span class="user-phone">Phone: ${userInfo.phoneNumber}</span>`
user.classList.add('user');
users.appendChild(user);
end(userInfo);
});
}
sendMessage = (userInfo) => {
setInterval(() => {
createMessage(userInfo);
}, setTimer (5000, 10000));
}
document.querySelector('.user-area__button').addEventListener('click', () => {
createUser(sendMessage);
})