// Светофор =======================================================================
const delay = ms => new Promise(ok => setTimeout(() => ok(ms), ms))
async function trafficLight(){
const trafficLights = document.createElement('div')
document.body.appendChild(trafficLights)
Object.assign(document.body.style, {display: 'flex', justifyContent: 'center'})
trafficLights.innerHTML = ``
await delay(1000)
while (true){
trafficLights.innerHTML = ``
await delay(3000)
trafficLights.innerHTML = ``
await delay(1250)
trafficLights.innerHTML = ``
await delay(3000)
for (let i = 0; i < 3; i ++) {
trafficLights.innerHTML = ``
await delay(500)
trafficLights.innerHTML = ``
await delay(500)
}
trafficLights.innerHTML = ``
await delay(1250)
}
}
trafficLight()
// Stage 2 =======================================================================
const delay = ms => new Promise(ok => setTimeout(() => ok(ms), ms))
async function trafficLight(parent, redTime, yellowTime, greenTime, prepare){
const trafficLights = document.createElement('div')
parent.appendChild(trafficLights)
Object.assign(document.body.style, {display: 'flex', justifyContent: 'center'})
trafficLights.innerHTML = ``
await delay(1000)
while (true){
trafficLights.innerHTML = ``
await delay(redTime)
trafficLights.innerHTML = ``
await delay(yellowTime)
trafficLights.innerHTML = ``
await delay(greenTime)
for (let i = 0; i < 3; i ++) {
trafficLights.innerHTML = ``
await delay(prepare)
trafficLights.innerHTML = ``
await delay(prepare)
}
trafficLights.innerHTML = ``
await delay(yellowTime)
}
}
trafficLight(document.body, 3000, 1250, 3000, 500)
// PedestrianTrafficLight =======================================================================
function domEventPromise (element, eventName) {
return new Promise ( (resolve) => {
const event = event => {
element.removeEventListener(eventName, event)
resolve(event)
}
element.addEventListener(eventName, event)
})
}
async function padestrianTrafficLight (parent, time, buttonTime) {
const trafficLights = document.createElement('div')
parent.appendChild(trafficLights)
Object.assign(document.body.style, {display: 'flex', justifyContent: 'center', flexDirection: 'column', alignItems: 'center'})
const goButton = document.createElement('button')
parent.appendChild(goButton)
goButton.innerText = 'Go!'
Object.assign(goButton.style, {backgroundColor: '#313131', borderRadius: '50%', width: '50px', height: '50px', color: 'white', cursor: 'pointer'})
trafficLights.innerHTML = ``
while (true) {
goButton.disabled = true
Object.assign(goButton.style, {borderColor:'#e50201', color: '#e50201'})
await delay(buttonTime)
goButton.disabled = false
Object.assign(goButton.style, {borderColor:'#bdd909', color: '#bdd909'})
await Promise.race([domEventPromise(goButton, 'click'), delay(time)])
trafficLights.innerHTML = ``
await delay (time)
trafficLights.innerHTML = ``
}
}
padestrianTrafficLight(document.body, 10000, 3000)
// speedtest =======================================================================
const delay = ms => new Promise(ok => setTimeout(() => ok(ms), ms))
async function speedtest(getPromise, count, parallel){
const start = performance.now()
for (let countRepeat = 0; countRepeat < count; countRepeat ++) {
const promiseArray = []
for (let countPromise = 0; countPromise < parallel; countPromise ++) {
promiseArray.push(getPromise())
}
const result = await Promise.all(promiseArray)
console.log(result)
}
const duration = performance.now() - start
return {
'duration': duration,
'parallelDuration': duration/(count*parallel),
'paralledSpeed': count*parallel/duration,
'queryDuration': duration/count,
'querySpeed': (count*parallel/duration)/count
}
}
speedtest(() => fetch('http://swapi.dev/api/people/1').then(res => res.json()), 10, 5).then(result => console.log(result))
speedtest(() => delay(1000), 10, 10 ).then(result => console.log(result))
// gql =======================================================================
async function gql (endpoint, query, variables) {
const querys = await fetch(endpoint,
{
method: 'POST',
headers:
{
'Content-Type': 'application/json',
'Accept': 'application/json',
},
body: JSON.stringify(
{
'query': query,
'variables': variables,
}
)
}
)
.then (data => data.json())
return querys
}
;(async () => {
const catQuery = `query cats($q: String){
CategoryFind(query: $q){
_id name
}
}`
const cats = await gql("http://shop-roles.node.ed.asmer.org.ua/graphql", catQuery, {q: "[{}]"})
console.log(cats) //список категорий с _id name и всем таким прочим
const loginQuery = `query login($login:String, $password:String){
login(login:$login, password:$password)
}`
const token = await gql("http://shop-roles.node.ed.asmer.org.ua/graphql", loginQuery ,{login: "test457", password: "123123"})
console.log(token)
})()
// jwtDecode =======================================================================
function jwtDecode (token) {
try {
const tokenArr = token.split('.')
const data = atob(tokenArr[1])
const dataObj = JSON.parse(data)
return dataObj
}
catch {
return undefined
}
}
const token = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOnsiaWQiOiI2MzIyMDVhZWI3NGUxZjVmMmVjMWEzMjAiLCJsb2dpbiI6InRlc3Q0NTciLCJhY2wiOlsiNjMyMjA1YWViNzRlMWY1ZjJlYzFhMzIwIiwidXNlciJdfSwiaWF0IjoxNjY4MjcyMTYzfQ.rxV1ki9G6LjT2IPWcqkMeTi_1K9sb3Si8vLB6UDAGdw"
console.log(jwtDecode(token))
//{
// "sub": {
// "id": "632205aeb74e1f5f2ec1a320",
// "login": "test457",
// "acl": [
// "632205aeb74e1f5f2ec1a320",
// "user"
// ]
// },
// "iat": 1668272163
//}
try {
console.log(jwtDecode()) //undefined
console.log(jwtDecode("дичь")) //undefined
console.log(jwtDecode("ey.ey.ey")) //undefined
console.log('до сюда доработало, а значит jwtDecode не матерился в консоль красным цветом')
}
finally{
console.log('ДЗ, видимо, окончено')
}