From de6c92a96dace1a47dbfda44c9fa7ab6370a7f5e Mon Sep 17 00:00:00 2001
From: Tim van der Meij <timvandermeij@gmail.com>
Date: Wed, 12 Oct 2016 21:13:37 +0200
Subject: [PATCH] Examples: improve SVG viewer
This patch:
- resolves a warning in the console about missing character encoding;
- makes the viewer use the same background color and PDF file as the
regular viewer;
- simplifies the example to bring it more in line with the other
examples.
---
examples/svgviewer/index.html | 17 ++++++++++-------
examples/svgviewer/viewer.js | 27 ++++++++-------------------
2 files changed, 18 insertions(+), 26 deletions(-)
diff --git a/examples/svgviewer/index.html b/examples/svgviewer/index.html
index 931b595a3..70bf357ed 100644
--- a/examples/svgviewer/index.html
+++ b/examples/svgviewer/index.html
@@ -2,21 +2,24 @@
<html>
<head>
+ <meta charset="utf-8">
+
+ <title>PDF.js SVG viewer example</title>
+
<script src="../../node_modules/requirejs/require.js"></script>
<script src="viewer.js"></script>
+
<style>
body {
- background-color: gray;
+ background-color: #404040;
}
.pageContainer {
- border : 1px solid black;
- margin : 5px auto;
- background-color : white;
+ border: 1px solid #000;
+ margin: 5px auto;
+ background-color: #FFF;
}
- </style>
-
- <title>SVG Viewer Example</title>
+ </style>
</head>
<body>
diff --git a/examples/svgviewer/viewer.js b/examples/svgviewer/viewer.js
index 51f5ad2dd..7d330419e 100644
--- a/examples/svgviewer/viewer.js
+++ b/examples/svgviewer/viewer.js
@@ -1,40 +1,29 @@
'use strict';
+var DEFAULT_SCALE = 1.5;
+
// Parse query string to extract some parameters (it can fail for some input)
var query = document.location.href.replace(/^[^?]*(\?([^#]*))?(#.*)?/, '$2');
var queryParams = query ? JSON.parse('{' + query.split('&').map(function (a) {
return a.split('=').map(decodeURIComponent).map(JSON.stringify).join(': ');
}).join(',') + '}') : {};
-var url = queryParams.file || '../../test/pdfs/liveprogramming.pdf';
-var scale = +queryParams.scale || 1.5;
+var url = queryParams.file || '../../web/compressed.tracemonkey-pldi-09.pdf';
function renderDocument(pdf, svgLib) {
- var numPages = pdf.numPages;
- // Using promise to fetch the page
-
- // For testing only.
- var MAX_NUM_PAGES = 50;
- var ii = Math.min(MAX_NUM_PAGES, numPages);
-
var promise = Promise.resolve();
- for (var i = 1; i <= ii; i++) {
- var anchor = document.createElement('a');
- anchor.setAttribute('name', 'page=' + i);
- anchor.setAttribute('title', 'Page ' + i);
- document.body.appendChild(anchor);
-
+ for (var i = 1; i <= pdf.numPages; i++) {
// Using promise to fetch and render the next page
- promise = promise.then(function (pageNum, anchor) {
+ promise = promise.then(function (pageNum) {
return pdf.getPage(pageNum).then(function (page) {
- var viewport = page.getViewport(scale);
+ var viewport = page.getViewport(DEFAULT_SCALE);
var container = document.createElement('div');
container.id = 'pageContainer' + pageNum;
container.className = 'pageContainer';
container.style.width = viewport.width + 'px';
container.style.height = viewport.height + 'px';
- anchor.appendChild(container);
+ document.body.appendChild(container);
return page.getOperatorList().then(function (opList) {
var svgGfx = new svgLib.SVGGraphics(page.commonObjs, page.objs);
@@ -43,7 +32,7 @@ function renderDocument(pdf, svgLib) {
});
});
});
- }.bind(null, i, anchor));
+ }.bind(null, i));
}
}