let container = document.querySelector('.card-container')
const img = `https://source.unsplash.com/random/200x150?person`
const imgPost = `https://source.unsplash.com/random/600x400?nature`
async function principal(){
[textos, names] = await Promise.all([
fetch(`https://jsonplaceholder.typicode.com/posts`),
fetch(`https://jsonplaceholder.typicode.com/users`)
]);
let textObj = await textos.json()
let nameObj = await names.json()
let html = ''
let fotoPerfil = await distinto(img)
let fotoPost = await distinto(imgPost)
console.log(fotoPerfil)
console.log(fotoPost)
let foto1;
let foto2;
for (let i = 0; i < 10; i++) {
let texto = textObj[i].title;
let name = nameObj[i].name;
if (foto1 !== fotoPerfil[i]) {
html += `<div class="card">
<div class="card-header">
<img src="${fotoPerfil[i]}" class="fadeIn">
<h3 class="fadeIn">${name}</h3>
</div>
<div class="card-content">
<div class="card-text">
<p class="fadeIn">${texto}</p>
</div>
<div class="card-post">
<img src="${fotoPost[i]}" class="fadeIn">
</div>
</div>
</div>`
foto1 = fotoPerfil[i]
foto2 = fotoPost[i]
}else {
console.log('js = kk')
}
}
container.innerHTML = html
/* checkBoxes() */
}
principal()
async function distinto(dir){
let ArrFotos = await Promise.all([fetch(dir), fetch(dir), fetch(dir), fetch(dir), fetch(dir), fetch(dir), fetch(dir), fetch(dir), fetch(dir), fetch(dir), fetch(dir)])
let fotos = []
ArrFotos.forEach(obj =>{
fotos.push(obj.url)
})
let fotosUnicas = [...new Set(fotos)]
return fotosUnicas
}
Kingsman10
- 15
- 7