Padel-Tournaments-System/frontend/sandbox_api/myscript.js
Arek a4a9c1c640 feat: connected main page to api
On main page now we can see all of tournaments from api
2022-06-08 22:33:19 +02:00

81 lines
2.3 KiB
JavaScript

// function lodaDoc() {
// var xhttp = new XMLHttpRequest();
// xhttp.onreadystatechange = function () {
// if (this.readyState == 4 && this.status == 200) {
// document.getElementById("demo").innerHTML = this.responseText;
// }
// };
// xhttp.open("GET", "https://dragonmaster.pl/inz/tournaments");
// xhttp.send();
// }
// let response = fetch(URL);
// const ul = document.getElementById('tournaments');
// const list = document.createDocumentFragment();
// const url = 'https://dragonmaster.pl/inz/tournaments'
// let tablica;
// fetch(url).then(function (response) {
// return response.json();
// }).then(function (obj) {
// let id;
// let count;
// tablica = obj
// console.log(obj);
// for (id in tablica) {
// console.log(tablica.name);
// ++count;
// }
// }).catch(function (error) {
// console.error('Something went wrong!')
// console.error(error);
// });
// fetch(url)
// .then(response => response.json())
// .then((data) => {
// let tournaments = data;
// tournaments.map(function (tournament) {
// let li = document.createElement('li');
// let name = document.createElement('h2');
// let email = document.createElement('span');
// name.innerHTML = '${tournament.name}';
// id.innerHTML = '${tournament.id}';
// li.appendChild(name);
// li.appendChild(id);
// });
// })
// .catch(function (error) {
// console.log(error);
// });
// ul.appendChild(list);
// console.log(fetch('https://dragonmaster.pl/inz/tournaments'))
async function showTournaments() {
let url = 'https://dragonmaster.pl/inz/tournaments';
try {
let res = await fetch(url);
return await res.json();
} catch (error) {
console.log(error);
}
}
async function renderTournaments() {
let tournaments = await showTournaments();
let html = '';
tournaments.forEach(tournament => {
let htmlSegment = `<div class = "tournament"><p>${tournament.name}</p><p>${tournament.place}</p> <p>${tournament.from} do ${tournament.to}</p> </div > `;
html += htmlSegment;
});
let container = document.querySelector('.tournament-list');
container.innerHTML = html;
}