Fixes test driver and examples

examples/acroforms/forms.js

@@ -9,7 +9,7 @@
 
 var formFields = {};
 
-function setupForm(div, content, scale) {
+function setupForm(div, content, viewport) {
   function bindInputItem(input, item) {
     if (input.name in formFields) {
       var value = formFields[input.name];
@@ -27,16 +27,20 @@ function setupForm(div, content, scale) {
   }
   function createElementWithStyle(tagName, item) {
     var element = document.createElement(tagName);
-    element.style.left = (item.x * scale) + 'px';
-    element.style.top = (item.y * scale) + 'px';
-    element.style.width = Math.ceil(item.width * scale) + 'px';
-    element.style.height = Math.ceil(item.height * scale) + 'px';
+    var rect = Util.normalizeRect(
+      viewport.convertToViewportRectangle(item.rect));
+    element.style.left = Math.floor(rect[0]) + 'px';
+    element.style.top = Math.floor(rect[1]) + 'px';
+    element.style.width = Math.ceil(rect[2] - rect[0]) + 'px';
+    element.style.height = Math.ceil(rect[3] - rect[1]) + 'px';
     return element;
   }
   function assignFontStyle(element, item) {
     var fontStyles = '';
-    if ('fontSize' in item)
-      fontStyles += 'font-size: ' + Math.round(item.fontSize * scale) + 'px;';
+    if ('fontSize' in item) {
+      fontStyles += 'font-size: ' + Math.round(item.fontSize *
+        viewport.fontScale) + 'px;';
+    }
     switch (item.textAlignment) {
       case 0:
         fontStyles += 'text-align: left;';
@@ -51,7 +55,7 @@ function setupForm(div, content, scale) {
     element.setAttribute('style', element.getAttribute('style') + fontStyles);
   }
 
-  var items = content.getAnnotations();
+  content.getAnnotations().then(function(items) {
     for (var i = 0; i < items.length; i++) {
       var item = items[i];
       switch (item.type) {
@@ -91,14 +95,16 @@ function setupForm(div, content, scale) {
           break;
       }
     }
+  });
 }
 
 function renderPage(div, pdf, pageNumber, callback) {
-  var page = pdf.getPage(pageNumber);
+  pdf.getPage(pageNumber).then(function(page) {
     var scale = 1.5;
+    var viewport = page.getViewport(scale);
 
-  var pageDisplayWidth = page.width * scale;
-  var pageDisplayHeight = page.height * scale;
+    var pageDisplayWidth = viewport.width;
+    var pageDisplayHeight = viewport.height;
 
     var pageDivHolder = document.createElement('div');
     pageDivHolder.className = 'pdfpage';
@@ -115,19 +121,22 @@ function renderPage(div, pdf, pageNumber, callback) {
 
 
     // Render PDF page into canvas context
-  page.startRendering(context, callback);
+    var renderContext = {
+      canvasContext: context,
+      viewport: viewport
+    };
+    page.render(renderContext).then(callback);
 
     // Prepare and populate form elements layer
     var formDiv = document.createElement('div');
     pageDivHolder.appendChild(formDiv);
 
-  setupForm(formDiv, page, scale);
+    setupForm(formDiv, page, viewport);
+  });
 }
 
-PDFJS.getPdf(pdfWithFormsPath, function getPdfForm(data) {
-  // Instantiate PDFDoc with PDF data
-  var pdf = new PDFJS.PDFDoc(data);
-  
+// Fetch the PDF document from the URL using promices
+PDFJS.getDocument(pdfWithFormsPath).then(function getPdfForm(pdf) {
   // Rendering all pages starting from first
   var viewer = document.getElementById('viewer');
   var pageNumber = 1;

examples/acroforms/index.html

@@ -6,6 +6,7 @@
   <!-- In production, change the content of PDFJS.workerSrc below -->
   <script type="text/javascript" src="../../src/core.js"></script>
   <script type="text/javascript" src="../../src/util.js"></script>
+  <script type="text/javascript" src="../../src/api.js"></script>
   <script type="text/javascript" src="../../src/canvas.js"></script>
   <script type="text/javascript" src="../../src/obj.js"></script>
   <script type="text/javascript" src="../../src/function.js"></script>

examples/helloworld/hello.js

@@ -7,25 +7,31 @@
 
 'use strict';
 
-PDFJS.getPdf('helloworld.pdf', function getPdfHelloWorld(data) {
-  //
-  // Instantiate PDFDoc with PDF data
-  //
-  var pdf = new PDFJS.PDFDoc(data);
-  var page = pdf.getPage(1);
+//
+// Fetch the PDF document from the URL using promices
+//
+PDFJS.getDocument('helloworld.pdf').then(function(pdf) {
+  // Using promise to fetch the page
+  pdf.getPage(1).then(function(page) {
     var scale = 1.5;
+    var viewport = page.getViewport(scale);
 
     //
     // Prepare canvas using PDF page dimensions
     //
     var canvas = document.getElementById('the-canvas');
     var context = canvas.getContext('2d');
-  canvas.height = page.height * scale;
-  canvas.width = page.width * scale;
+    canvas.height = viewport.height;
+    canvas.width = viewport.width;
 
     //
     // Render PDF page into canvas context
     //
-  page.startRendering(context);
+    var renderContext = {
+      canvasContext: context,
+      viewport: viewport
+    };
+    page.render(renderContext);
+  });
 });
 

examples/helloworld/index.html

@@ -6,6 +6,7 @@
   <!-- In production, change the content of PDFJS.workerSrc below -->
   <script type="text/javascript" src="../../src/core.js"></script>
   <script type="text/javascript" src="../../src/util.js"></script>
+  <script type="text/javascript" src="../../src/api.js"></script>
   <script type="text/javascript" src="../../src/canvas.js"></script>
   <script type="text/javascript" src="../../src/obj.js"></script>
   <script type="text/javascript" src="../../src/function.js"></script>

src/util.js

@@ -242,6 +242,7 @@ var PageViewport = PDFJS.PageViewport = (function PageViewportClosure() {
     this.offsetY = offsetY;
     this.width = width;
     this.height = height;
+    this.fontScale = scale;
   }
   PageViewport.prototype = {
     convertToViewportPoint: function PageViewport_convertToViewportPoint(x, y) {

test/driver.js

@@ -176,11 +176,9 @@ function nextPage(task, loadError) {
       var ctx = canvas.getContext('2d');
       task.pdfDoc.getPage(task.pageNum).then(function(page) {
         var pdfToCssUnitsCoef = 96.0 / 72.0;
-        // using mediaBox for the canvas size
-        var pageWidth = page.width;
-        var pageHeight = page.height;
-        canvas.width = pageWidth * pdfToCssUnitsCoef;
-        canvas.height = pageHeight * pdfToCssUnitsCoef;
+        var viewport = page.getViewport(pdfToCssUnitsCoef);
+        canvas.width = viewport.width;
+        canvas.height = viewport.height;
         clear(ctx);
 
         // using the text layer builder that does nothing to test