diff --git a/PULL_REQUEST_TEMPLATE.md b/PULL_REQUEST_TEMPLATE.md
index ddfff263..ffdf1207 100644
--- a/PULL_REQUEST_TEMPLATE.md
+++ b/PULL_REQUEST_TEMPLATE.md
@@ -2,9 +2,9 @@
SoluciĆ³n al reto:
-Nombre:
-Usuario Platzi:
-Correo Electronico:
+Nombre:Roger David Alba Ortega
+Usuario Platzi: Roger David Alba Ortega
+Correo Electronico: rogerdavidalbaortega@gmail.com
## Reto:
diff --git a/public/index.html b/public/index.html
index 5f8fbe0d..cd590c65 100755
--- a/public/index.html
+++ b/public/index.html
@@ -5,7 +5,16 @@
-
+
+ PlatziStore
+
+
+
+
+
+
+
+
diff --git a/src/index.js b/src/index.js
index eb2631c2..6a82f5e9 100755
--- a/src/index.js
+++ b/src/index.js
@@ -2,30 +2,55 @@ const $app = document.getElementById('app');
const $observe = document.getElementById('observe');
const API = 'https://api.escuelajs.co/api/v1/products';
-const getData = api => {
- fetch(api)
+const getData = (api,limit = 10) => {
+ const offset= localStorage.getItem('pagination') ? parseInt(localStorage.getItem('pagination')) + 10 : 5-1;
+ localStorage.setItem('pagination', offset)
+ fetch(`${api}?offset=${offset}&limit=${limit}`)
.then(response => response.json())
.then(response => {
let products = response;
- let output = products.map(product => {
- // template
- });
+ let lengths =products.length;
+ console.log(products);
+ let output = products.map(product =>(
+
+ `
+
+
+ Producto: ${product.title}
+ $: ${product.price}
+
+ `
+
+ ));
let newItem = document.createElement('section');
newItem.classList.add('Item');
newItem.innerHTML = output;
$app.appendChild(newItem);
+ if (lengths < limit){
+ let message = document.createElement('span')
+ message.innerText = 'Todos los productos Obtenidos'
+ $app.appendChild(message)
+ intersectionObserver.unobserve($observe)
+ }
})
.catch(error => console.log(error));
}
-const loadData = () => {
- getData(API);
+const loadData = async() => {
+ const get = await getData(API);
}
const intersectionObserver = new IntersectionObserver(entries => {
- // logic...
-}, {
+ entries.forEach(entry => { if (entry.isIntersecting) loadData() })
+},
+{
rootMargin: '0px 0px 100% 0px',
});
intersectionObserver.observe($observe);
+
+window.addEventListener("beforeunload", (event) =>
+{
+ event.preventDefault()
+ localStorage.clear()
+})