add error catch

adnanfajlur · Apr 6, 2018 · fefc535 · fefc535
1 parent 7680ce0
commit fefc535
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 9 deletions.
diff --git a/public/index.html b/public/index.html
@@ -37,6 +37,10 @@
       padding: 50px 20px 20px;
       min-height: 100vh;
     }
+    .divLoading {
+      text-align: center;
+      margin-top: 100px;
+    }
     </style>
   </head>
   <body>

diff --git a/public/js/app.js b/public/js/app.js
@@ -3,22 +3,25 @@ const content = document.getElementById('content')
 // change url
 function changeUrl(param) {
   deleteDom()
-  window.history.pushState({}, null, param)
+  window.history.pushState({}, null, param);
   const page = window.location.pathname.slice(1);
   const search = new URL(window.location.href).searchParams.get('page');
   loadingDom(true);
   fetchAsync(page, search)
     .then(data => window.renderList(data))
-    .catch(err => console.log(err))
+    .catch(err => isError())
+}
+
+function isError() {
+  deleteDom()
+  window.renderLoading('ERROR!!!')
 }
 
 function loadingDom(param) {
   if (param) {
-    window.renderLoading()
+    window.renderLoading('Loading...')
   } else {
-    while (content.firstChild) {
-      content.removeChild(content.firstChild)
-    }
+    deleteDom()
   }
 }
 
@@ -30,8 +33,8 @@ function deleteDom() {
 
 // get data function
 async function fetchAsync(page, search) {
-  loadingDom(false);
   let response = await fetch(`https://hnpwa.com/api/v0/${page === '' ? 'top' : page}.json?page=${search}`);
   let data = await response.json();
+  loadingDom(false)
   return data;
 }
diff --git a/public/js/renderDom.js b/public/js/renderDom.js
@@ -29,10 +29,10 @@ function renderList(data) {
   ))
 }
 
-function renderLoading() {
+function renderLoading(param) {
   const content = document.getElementById('content')
   content.appendChild(div({ className: 'divLoading' },
-    p('Loading...')
+    p(param)
   ))
 }