From e6c729128417cc4333965e01581caa7693df7dfb Mon Sep 17 00:00:00 2001 From: MHShetty Date: Mon, 6 Jun 2022 19:21:50 +0530 Subject: [PATCH 1/3] Add loading bar as a div element to viewer.html --- app/src/main/assets/viewer.html | 3 +++ 1 file changed, 3 insertions(+) diff --git a/app/src/main/assets/viewer.html b/app/src/main/assets/viewer.html index c4f1125b5..c41db1193 100644 --- a/app/src/main/assets/viewer.html +++ b/app/src/main/assets/viewer.html @@ -7,6 +7,9 @@ +
+
+
From ae80f904316122313334b9c8014a0c5bc97a8302 Mon Sep 17 00:00:00 2001 From: MHShetty Date: Mon, 6 Jun 2022 19:22:04 +0530 Subject: [PATCH 2/3] Add styling for the loading bar in viewer.css --- app/src/main/assets/viewer.css | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/app/src/main/assets/viewer.css b/app/src/main/assets/viewer.css index 9f136d5aa..e975721f6 100644 --- a/app/src/main/assets/viewer.css +++ b/app/src/main/assets/viewer.css @@ -79,3 +79,14 @@ body { .textLayer .endOfContent.active { top: 0; } + +#loading-bar-container { + width: 100%; + background-color: #bbdefb; +} + +#loading-bar { + width: 0%; + height: 4px; + background-color: #106cc8; +} \ No newline at end of file From 352efa66ba10a8d0163194058f08218df4f4ccc3 Mon Sep 17 00:00:00 2001 From: MHShetty Date: Mon, 6 Jun 2022 19:22:35 +0530 Subject: [PATCH 3/3] Add required functionality for the loader (in viewer.js) --- app/src/main/assets/viewer.js | 29 +++++++++++++++++++++++++++++ 1 file changed, 29 insertions(+) diff --git a/app/src/main/assets/viewer.js b/app/src/main/assets/viewer.js index 0e04afa4f..2a747e0ad 100644 --- a/app/src/main/assets/viewer.js +++ b/app/src/main/assets/viewer.js @@ -19,6 +19,25 @@ let useRender; const cache = []; const maxCached = 6; +var loading_bar = document.getElementById("loading-bar"); +var loading_bar_container = document.getElementById("loading-bar-container"); + +function show_progress_bar() { + loading_bar.style.display = "block"; + loading_bar_container.style.display = "block"; +} + +function hide_progress_bar() { + loading_bar.style.display = "none"; + loading_bar_container.style.display = "none"; +} + +function set_progress(value) { + if(value==0) show_progress_bar(); + else if(value==100) hide_progress_bar(); + else loading_bar.style.width = value + "%"; +} + function maybeRenderNextPage() { if (renderPending) { pageRendering = false; @@ -209,6 +228,14 @@ function loadDocument() { } } + loadingTask.onProgress = function(data){ + var progress = Math.ceil((data.loaded/data.total)*100); + console.log("Progress: " + progress); + set_progress(progress); + } + + show_progress_bar(); + loadingTask.promise.then(function (newDoc) { pdfDoc = newDoc; channel.setNumPages(pdfDoc.numPages); @@ -218,7 +245,9 @@ function loadDocument() { console.log("getMetadata error: " + error); }); renderPage(channel.getPage(), false, false); + hide_progress_bar(); }, function (reason) { + hide_progress_bar(); console.error(reason.name + ": " + reason.message); }); }