mirror of
https://github.com/mozilla/pdf.js.git
synced 2025-04-19 06:38:07 +02:00
[api-minor] Modernize and simplify the ProgressBar
class
The original `ProgressBar`-functionality is very old, and could thus do with some general clean-up. In particular, while it currently accepts various options those have never really been used in either the default viewer or in any examples. The sort of "styling" that these options provided are *much better*, not to mention simpler, done directly with CSS rules. As part of these changes, the "progress" is now updated using CSS variables rather than by directly modifying the `style` of DOM elements. This should hopefully simplify future changes to this code, see e.g. PR 14898. Finally, this also fixes a couple of other small things in the "mobile viewer" example.
This commit is contained in:
parent
b5f2bd8bfd
commit
1f3da032b4
4 changed files with 32 additions and 25 deletions
|
@ -13,6 +13,10 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
|
||||
:root {
|
||||
--progressBar-percent: 0%;
|
||||
}
|
||||
|
||||
* {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
@ -191,13 +195,12 @@ canvas {
|
|||
height: 0.6rem;
|
||||
background-color: rgba(51, 51, 51, 1);
|
||||
border-bottom: 1px solid rgba(51, 51, 51, 1);
|
||||
margin-top: 5rem;
|
||||
}
|
||||
|
||||
#loadingBar .progress {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 0;
|
||||
width: var(--progressBar-percent);
|
||||
height: 100%;
|
||||
background-color: rgba(221, 221, 221, 1);
|
||||
overflow: hidden;
|
||||
|
@ -217,6 +220,7 @@ canvas {
|
|||
}
|
||||
|
||||
#loadingBar .progress.indeterminate {
|
||||
width: 100%;
|
||||
background-color: rgba(153, 153, 153, 1);
|
||||
transition: none;
|
||||
}
|
||||
|
|
|
@ -82,7 +82,9 @@ const PDFViewerApplication = {
|
|||
self.pdfDocument = pdfDocument;
|
||||
self.pdfViewer.setDocument(pdfDocument);
|
||||
self.pdfLinkService.setDocument(pdfDocument);
|
||||
self.pdfHistory.initialize({ fingerprint: pdfDocument.fingerprint });
|
||||
self.pdfHistory.initialize({
|
||||
fingerprint: pdfDocument.fingerprints[0],
|
||||
});
|
||||
|
||||
self.loadingBar.hide();
|
||||
self.setTitleUsingMetadata(pdfDocument);
|
||||
|
@ -159,7 +161,7 @@ const PDFViewerApplication = {
|
|||
},
|
||||
|
||||
get loadingBar() {
|
||||
const bar = new pdfjsViewer.ProgressBar("#loadingBar", {});
|
||||
const bar = new pdfjsViewer.ProgressBar("#loadingBar");
|
||||
|
||||
return pdfjsLib.shadow(this, "loadingBar", bar);
|
||||
},
|
||||
|
@ -187,7 +189,7 @@ const PDFViewerApplication = {
|
|||
// Provides some basic debug information
|
||||
console.log(
|
||||
"PDF " +
|
||||
pdfDocument.fingerprint +
|
||||
pdfDocument.fingerprints[0] +
|
||||
" [" +
|
||||
info.PDFFormatVersion +
|
||||
" " +
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue