window.onload = function(){
const name = document.getElementById('api-1');
const tableItems = document.getElementById('item');
const cartContent = document.getElementsByClassName('table-cart');
fetch('https://us-central1-guitar-chord-de94e.cloudfunctions.net/products')
.then(response => response.json())
.then(items => {
let html = '';
items.forEach(item =>{
html += `
<div class="container">
<img src=${item.items.image} class="item">
<div class="overlay">
<p style="color:white">${item.items.name}</p>
<p style="color: white;font-weight: bold;font-size: 17px">price: ${item.items.price}</p>
<div style="margin-top:60px;">
<button onclick="addToCart()" style="background-color: gold;margin:0%;">add <img width="16px" src="./image/icons/shopping-cart.png" alt=""></button>
</div>
</div>
</div>
`;
name.innerHTML= html;
})
});
}
function addToCart(){
fetch('https://us-central1-guitar-chord-de94e.cloudfunctions.net/products')
.then(response => response.json())
.then(sys => {
sys.forEach(item =>{ console.log(item.sys);
});
});
}