Skip to content

Commit

Permalink
Merge pull request #35 from ebenezerdon/connect-products-to-api-16186…
Browse files Browse the repository at this point in the history 
…1252

Connect products page to api
  • Loading branch information
@ebenezerdon
ebenezerdon committed Nov 10, 2018
2 parents a109399 + a27820a commit 3ae8a44
Show file tree
Hide file tree
Showing 2 changed files with 36 additions and 93 deletions.
33 changes: 33 additions & 0 deletions UI/assets/js/products.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
const getProducts = () => {
fetch('https://newstoremanager.herokuapp.com/api/v1/products', {
headers: {
'Content-Type': 'application/json',
accesstoken: localStorage.accesstoken,
},
})
.then(res => res.json())
.then((data) => {
let output;
data.forEach((user) => {
console.log(user.productimage);
output = `
<div class='product'>
<div class='product-item hover-effect'>
<a href="product-item.html">
<img src=${user.productimage} width='300'>
</a>
<a href='product-item.html'>
<p>${user.productname}</p>
<p>${user.price}</p>
</a>
<button>Add to cart</button>
<div>
</div>
`;
document.getElementById('products-list').innerHTML += output;
});
document.getElementById('products-list').innerHTML += '<div class="footer"></div>';
});
};

window.onload = getProducts();
96 changes: 3 additions & 93 deletions UI/pages/products.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,100 +44,10 @@
</div>
</div>
</header>
<div class='row'>
<div class='product'>
<div class='product-item hover-effect'> <a href="product-item.html"></a>
<a href="product-item.html">
<img src='https://ng.jumia.is/8OQU5DiXVftEqmGAcFd62dHs9T8=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/18/08299/1.jpg?3454'
width='300'>
</a>
<a href="product-item.html">
<p>Long Sleeve Hooded T Shirt- Wine & Grey</p>
<p>₦3,300</p>
</a>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<div class='product-item hover-effect'>
<a href="product-item.html"><img src='https://ng.jumia.is/c0tn9yqz_NVdz02I4xJnHEOjoGQ=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/36/800791/1.jpg?3368'
width='300'></a>
<a href="product-item.html">
<p>Fashion Quality Ankara Fabrics For Women-multi-colour</p>
<p>₦7,108</p>
</a>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<div class='product-item hover-effect'>
<a href="product-item.html"><img src='https://ng.jumia.is/gkBcaHMPWbyFDDINjGTtxNDp3Eo=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/48/643331/1.jpg?2411'
width='300'></a>
<a href="product-item.html">
<p>Breathable Sneakers For Men</p>
<p>₦4,995</p>
</a>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<div class='product-item hover-effect'>
<a href="product-item.html"><img src='https://ng.jumia.is/WF4k7gSwnJojumFJSjXWgaFhexU=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/90/01116/1.jpg?1536'
width='300'></a>
<a href="product-item.html">
<p>Luxe Linient Solution Towels</p>
</a>
<p>₦13,550</p>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<div class='product-item hover-effect'>
<a href="product-item.html"><img src='https://ng.jumia.is/7DGBgs3FfNyqFY8UnZqshKvMLRY=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/53/78896/1.jpg?0343'
width='300'></a>
<a href="product-item.html">
<p>Short Sleeve T-shirt - White</p>
<p>₦2,100</p>
</a>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<div class='product-item hover-effect'>
<a href="product-item.html"><img src='https://ng.jumia.is/qyqSl-UxNbxaRmJcSKlmA-4i_Vg=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/90/48948/1.jpg?1177'
width='300'></a>
<a href="product-item.html">
<p>Drapery Skirt - Green</p>
<p>₦3,422</p>
</a>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<div class='product-item hover-effect'>
<a href="product-item.html"><img src='https://ng.jumia.is/j4wvkDKLbS79Fz_JuwQR-on66q8=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/93/69749/1.jpg?4001'
width='300'></a>
<a href="product-item.html">
<p>Men's Casual Slim Fit Jeans - Blue</p>
<p>₦9,700</p>
</a>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<div class='product-item hover-effect'>
<a href="product-item.html"><img src='https://ng.jumia.is/qxwMx1cu74re-mnYWp7oKy5k_QI=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/66/961471/1.jpg?5807'
width='300'></a>
<a href="product-item.html">
<p>Duanxinyv Knee Boot</p>
<p>₦6,390</p>
</a>
<button>Add to cart</button>
</div>
</div>
<div class="footer"></div>
</div>

<div class='row' id="products-list"></div>

<script type="text/javascript" src="../assets/js/products.js"></script>

</body>

Expand Down

0 comments on commit 3ae8a44

Please sign in to comment.