diff --git a/package.json b/package.json
index 42b81b0..9b61a70 100644
--- a/package.json
+++ b/package.json
@@ -20,4 +20,4 @@
"devDependencies": {
"live-server": "^1.2.1"
}
-}
\ No newline at end of file
+}
diff --git a/src/index.js b/src/index.js
index 7a07752..e77b07c 100644
--- a/src/index.js
+++ b/src/index.js
@@ -3,36 +3,61 @@ const $observe = document.getElementById('observe');
const API = 'https://rickandmortyapi.com/api/character/';
const getData = api => {
- fetch(api)
- .then(response => response.json())
- .then(response => {
- const characters = response.results;
- let output = characters.map(character => {
- return `
-
-
- ${character.name}${character.species}
-
- `
- }).join('');
- let newItem = document.createElement('section');
- newItem.classList.add('Items');
- newItem.innerHTML = output;
- $app.appendChild(newItem);
- })
- .catch(error => console.log(error));
-}
-const loadData = () => {
- getData(API);
+ return new Promise((resolve, reject) => {
+ fetch(api)
+ .then(response => resolve(response.json()))
+ .catch(error => reject(error));
+ });
+}
+const loadData = async () => {
+ let fetchUrl = localStorage.getItem('next_fetch')
+ if (!fetchUrl) {
+ fetchUrl = API
+ }
+ try {
+ const responseInfo = await getData(fetchUrl);
+ showNewData(responseInfo.results);
+ validateNetx(responseInfo.info.next);
+ } catch (error) {
+ console.error(error);
+ }
+}
+const showNewData = (characters) => {
+ let output = characters.map(character => {
+ return `
+
+
+ ${character.name}${character.species}
+
+ `
+ }).join('');
+ let newItem = document.createElement('section');
+ newItem.classList.add('Items');
+ newItem.innerHTML = output;
+ $app.appendChild(newItem);
}
-
const intersectionObserver = new IntersectionObserver(entries => {
if (entries[0].isIntersecting) {
- loadData();
+ loadData();
}
}, {
rootMargin: '0px 0px 100% 0px',
});
-intersectionObserver.observe($observe);
\ No newline at end of file
+
+const validateNetx = (next) => {
+ if (next) {
+ localStorage.setItem('netx_fetch', next);
+ } else {
+ const errorItem = document.createElement('section');
+ errorItem.innerHTML = '
ya no hay mas personajes...
';
+ errorItem.classlist = 'End';
+ $app.appendChild(errorItem);
+ intersectionObserver.observe($observe);
+ }
+}
+intersectionObserver.observe($observe);
+window.loadData = () => {
+ localStorage.clear();
+}
\ No newline at end of file