homework/js-11/js.js

// const startUrl = "http://swapi.dev/api/";
// const url = (str) => typeof str === "string" && str.startsWith(startUrl);

// table = (el, obj) => {
//   for (var [key, value] of Object.entries(obj)) {
//     const div = document.createElement("div");
//     div.style.border = "1px solid black";
//     div.style.margin = "5px 5px";
//     div.style.padding = "5px";
//     if (url(value)) {
//       value = [value];
//     }
//     if (value instanceof Array) {
//       div.innerHTML = `<b>${key}</b>: `;
//       for (var item of value)
//         if (url(item)) {
//           const button = document.createElement("button");
//           button.innerText = item.slice(startUrl.length);
//           div.appendChild(button);

//           button.onclick = () => {
//             const div1 = document.createElement("div");
//             div1.style.border = "2px solid green";
//             div1.style.margin = "5px 5px";
//             div.appendChild(div1);

//             fetch("https://swapi.dev/api/" + button.innerText)
//               .then((res) => res.json())
//               .then((luke) => table(div1, luke));
//           };
//         }
//     } else {
//       div.innerHTML = `<b>${key}</b>: ${value}`;
//     }
//     el.appendChild(div);
//   }
// };

// fetch("https://swapi.dev/api/people/1/")
//   .then((res) => res.json())
//   .then((luke) => table(films, luke));

// // myfetch
// function myfetch(url) {
//   return new Promise((resolve, reject) => {
//     const xhr = new XMLHttpRequest();
//     xhr.open("GET", url, true);
//     xhr.onload = () => {
//       xhr.status != 200
//         ? reject(xhr.response)
//         : resolve(JSON.parse(xhr.responseText));
//     };
//     xhr.onerror = () => reject(xhr.statusText);
//     xhr.send();
//   });
// }

// myfetch("https://swapi.dev/api/people/1/").then((luke) => console.log(luke));

// // race
// const API1 = new Promise((resolve, reject) =>
//   myfetch("https://swapi.dev/api/people/1/").then(() => resolve("API1"))
// );

// const API2 = (ms) => new Promise((ok) => setTimeout(() => ok("API2"), ms));

// Promise.race([API1, API2(115)]).then((value) => console.log(value));