From 9a28b8a41291f92b972f9d27ca87b8a731388444 Mon Sep 17 00:00:00 2001 From: Yury Delendik Date: Thu, 19 Jun 2014 22:20:55 -0500 Subject: [PATCH 1/2] Misc UI improvements for the SVG Viewer --- examples/svgviewer/viewer.js | 39 +++++++++++++++++++++++------------- 1 file changed, 25 insertions(+), 14 deletions(-) diff --git a/examples/svgviewer/viewer.js b/examples/svgviewer/viewer.js index 54c9f7b2c..ceb1bb554 100644 --- a/examples/svgviewer/viewer.js +++ b/examples/svgviewer/viewer.js @@ -7,10 +7,19 @@ 'use strict'; +// 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; + // // Fetch the PDF document from the URL using promises // -PDFJS.getDocument('../../test/pdfs/liveprogramming.pdf').then(function(pdf) { +PDFJS.getDocument(url).then(function(pdf) { var numPages = pdf.numPages; // Using promise to fetch the page @@ -20,10 +29,14 @@ PDFJS.getDocument('../../test/pdfs/liveprogramming.pdf').then(function(pdf) { var promise = Promise.resolve(); for (var i = 1; i <= ii; i++) { - // Using promise to fetch the page - promise = promise.then(function (pageNum) { + var anchor = document.createElement('a'); + anchor.setAttribute('name', 'page=' + i); + anchor.setAttribute('title', 'Page ' + i); + document.body.appendChild(anchor); + + // Using promise to fetch and render the next page + promise = promise.then(function (pageNum, anchor) { return pdf.getPage(pageNum).then(function (page) { - var scale = 1.5; var viewport = page.getViewport(scale); var container = document.createElement('div'); @@ -31,25 +44,23 @@ PDFJS.getDocument('../../test/pdfs/liveprogramming.pdf').then(function(pdf) { container.className = 'pageContainer'; container.style.width = viewport.width + 'px'; container.style.height = viewport.height + 'px'; - document.body.appendChild(container); + anchor.appendChild(container); var renderContext = { viewport: viewport, pageNum: pageNum, container: container }; - // run rendering only when all pages are loaded - promise.then(function () { - page.getOperatorList().then(function (opList) { - var svgGfx = new SVGGraphics(page.commonObjs); - svgGfx.loadDependencies(opList).then(function (values) { - svgGfx.beginDrawing(renderContext.viewport, renderContext.pageNum, - renderContext.container, opList); - }); + // the next page fetch will start only after this page rendering is done + return page.getOperatorList().then(function (opList) { + var svgGfx = new SVGGraphics(page.commonObjs); + return svgGfx.loadDependencies(opList).then(function (values) { + return svgGfx.beginDrawing(renderContext.viewport, + renderContext.pageNum, renderContext.container, opList); }); }); }); - }.bind(null, i)); + }.bind(null, i, anchor)); } }); From 834f466c05b835c44a5fc2d3db33161040586539 Mon Sep 17 00:00:00 2001 From: Yury Delendik Date: Thu, 19 Jun 2014 23:18:04 -0500 Subject: [PATCH 2/2] Fixes SVG transforms on restore --- src/display/svg.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/display/svg.js b/src/display/svg.js index cf82dffc7..225bd11f9 100644 --- a/src/display/svg.js +++ b/src/display/svg.js @@ -132,6 +132,12 @@ var SVGGraphics = (function SVGGraphicsClosure(ctx) { restore: function SVGGraphics_restore() { this.transformMatrix = this.transformStack.pop(); this.current = this.extraStack.pop(); + + this.tgrp = document.createElementNS(NS, 'svg:g'); + this.tgrp.setAttributeNS(null, 'id', 'transform'); + this.tgrp.setAttributeNS(null, 'transform', + 'matrix(' + this.transformMatrix + ')'); + this.pgrp.appendChild(this.tgrp); }, group: function SVGGraphics_group(items) { @@ -669,7 +675,6 @@ var SVGGraphics = (function SVGGraphicsClosure(ctx) { }, rectangle: function SVGGraphics_rectangle(x, y, width, height) { - this.save(); var current = this.current; if (width < 0) { x = x + width;