HomeWork/js12/main.js

//Task fetch basic
// function receivInfoForLuck (dom, url) {
// fetch(url)
//   .then(res => res.json())
//   .then(luke => {
//     console.log(luke);
   
//     const table = document.createElement('table');
//     table.style.border = '1px solid';
//     table.style.borderCollapse = 'collapse';
//     dom.append(table);
       
//     for (let [key, value] of Object.entries(luke)) {
//       const tr = document.createElement('tr');
//       const th = document.createElement('th');
//       th.style.border = '1px solid #000';
//       const td = document.createElement('td');
//       td.style.border = '1px solid #000';
//       td.style.width = '300px'
//       table.append(tr);
//       tr.appendChild(th).innerHTML = `${key}`;
//       tr.append(td);

//       if (value.constructor == Array) {
//         for (let index of value) {
//           const p = document.createElement('p');
//           td.appendChild(p).innerHTML = `${index}\n `;
//         }
//       }

//       if (value.constructor!== Array) {
//         td.innerHTML = `${value}`     
//       }
//     }
//   })
// } 

// receivInfoForLuck(document.body, 'https://swapi.dev/api/people/1/')

// Task fetch improved

// function receivInfoForLuck (dom, url) {
//   fetch(url)
//     .then(res => res.json())
//     .then(luke => {
//       console.log(luke);
     
//       const table = document.createElement('table');
//       table.style.border = '1px solid';
//       table.style.borderCollapse = 'collapse';
//       dom.append(table);
         
//       for (let [key, value] of Object.entries(luke)) {
       
//         const tr = document.createElement('tr');
//         const th = document.createElement('th');
//         th.style.border = '1px solid #000';
//         const td = document.createElement('td');
//         td.style.border = '1px solid #000';
//         td.style.width = '300px'
//         table.append(tr);
//         tr.appendChild(th).innerHTML = `${key}`;
//         tr.append(td);

//         let numberForButton = 1;

//         function createInput (value, buttonNumber) {
          
//           const input = document.createElement('input');
//           input.type = 'button';
//           input.value = `${buttonNumber}`;
//           td.appendChild(input);
//           numberForButton ++; 
//           input.onclick = () => receivInfoForLuck(document.body, value);
//         }
       
//         if (value.constructor == Array) {
          
//           for (let index of value) {
            

//             if (typeof(index) !== 'string') {
//               const p = document.createElement('p');
//               td.appendChild(p).innerHTML = `${index}\n `;
//             }  
//               else if (index.includes('https://swapi.dev/api/')) {
//               createInput(index, numberForButton);
//             } 
//               else {  
//                 const p = document.createElement('p');
//                 td.appendChild(p).innerHTML = `${index}\n `;
//               }
//           }
//         }
//         if (value.constructor!== Array) {
          
//           if (typeof(value) !== 'string') {
//             td.innerHTML = `${value}`; 
//           }
//             else if (value.includes('https://swapi.dev/api/')) {
//               createInput(value, numberForButton);
//           } 
//               else {
//                 td.innerHTML = `${value}`;   
//               }
//         }
//       }
//     })
//   } 
  
// receivInfoForLuck(document.body, 'https://swapi.dev/api/people/1/');


//Task myfetch

function myfetch(url){
  return new Promise(function (resolve, reject){
    const xhr = new XMLHttpRequest();
    xhr.open('GET', url);
    xhr.send();
    xhr.onload = function() {

      if (xhr.status != 200) { 
        return reject(`Ошибка ${xhr.status}: ${xhr.statusText}`);
        
      } else { 
        let value = JSON.parse(xhr.response);
        return resolve(value);
        }
      xhr.onerror = function() {  
        return reject('Запрос не удался');
    };
    };
  })
}

// let a = myfetch('https://swapi.dev/api/people/1/');
// a.then(res => console.log(res));


//TASK race
const delay = ms => new Promise(ok => setTimeout(() => ok(ms*Math.random()), ms))

Promise.race([
  myfetch('https://swapi.dev/api/people/1/'),
  delay(600)
]).then(obj => console.log(obj));