Sakurai/pdf.js
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #749 from notmasteryet/forms-1

Browse Source 
Simple AcroForms support
This commit is contained in:
Artur Adib 2011-12-21 06:16:30 -08:00
commit ca7d44c646
4 changed files with 312 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

141
examples/acroforms/forms.js Normal file
View File

@ -0,0 +1,141 @@
/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* vim: set shiftwidth=2 tabstop=2 autoindent cindent expandtab: */
//
// Basic AcroForms input controls rendering
//
'use strict';
var formFields = {};
function setupForm(div, content, scale) {
function bindInputItem(input, item) {
if (input.name in formFields) {
var value = formFields[input.name];
if (input.type == 'checkbox')
input.checked = value;
else if (!input.type || input.type == 'text')
input.value = value;
}
input.onchange = function pageViewSetupInputOnBlur() {
if (input.type == 'checkbox')
formFields[input.name] = input.checked;
else if (!input.type || input.type == 'text')
formFields[input.name] = input.value;
};
}
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';
return element;
}
function assignFontStyle(element, item) {
var fontStyles = '';
if ('fontSize' in item)
fontStyles += 'font-size: ' + Math.round(item.fontSize * scale) + 'px;';
switch (item.textAlignment) {
case 0:
fontStyles += 'text-align: left;';
break;
case 1:
fontStyles += 'text-align: center;';
break;
case 2:
fontStyles += 'text-align: right;';
break;
}
element.setAttribute('style', element.getAttribute('style') + fontStyles);
}
var items = content.getAnnotations();
for (var i = 0; i < items.length; i++) {
var item = items[i];
switch (item.type) {
case 'Widget':
if (item.fieldType != 'Tx' && item.fieldType != 'Btn' &&
item.fieldType != 'Ch')
break;
var inputDiv = createElementWithStyle('div', item);
inputDiv.className = 'inputHint';
div.appendChild(inputDiv);
var input;
if (item.fieldType == 'Tx') {
input = createElementWithStyle('input', item);
}
if (item.fieldType == 'Btn') {
input = createElementWithStyle('input', item);
if (item.flags & 32768) {
input.type = 'radio';
// radio button is not supported
} else if (item.flags & 65536) {
input.type = 'button';
// pushbutton is not supported
} else {
input.type = 'checkbox';
}
}
if (item.fieldType == 'Ch') {
input = createElementWithStyle('select', item);
// select box is not supported
}
input.className = 'inputControl';
input.name = item.fullName;
input.title = item.alternativeText;
assignFontStyle(input, item);
bindInputItem(input, item);
div.appendChild(input);
break;
}
}
}
function renderPage(div, pdf, pageNumber, callback) {
var page = pdf.getPage(pageNumber);
var scale = 1.5;
var pageDisplayWidth = page.width * scale;
var pageDisplayHeight = page.height * scale;
var pageDivHolder = document.createElement('div');
pageDivHolder.className = 'pdfpage';
pageDivHolder.style.width = pageDisplayWidth + 'px';
pageDivHolder.style.height = pageDisplayHeight + 'px';
div.appendChild(pageDivHolder);
// Prepare canvas using PDF page dimensions
var canvas = document.createElement('canvas');
var context = canvas.getContext('2d');
canvas.width = pageDisplayWidth;
canvas.height = pageDisplayHeight;
pageDivHolder.appendChild(canvas);
// Render PDF page into canvas context
page.startRendering(context, callback);
// Prepare and populate form elements layer
var formDiv = document.createElement('div');
pageDivHolder.appendChild(formDiv);
setupForm(formDiv, page, scale);
}
PDFJS.getPdf(pdfWithFormsPath, function getPdfForm(data) {
// Instantiate PDFDoc with PDF data
var pdf = new PDFJS.PDFDoc(data);
// Rendering all pages starting from first
var viewer = document.getElementById('viewer');
var pageNumber = 1;
renderPage(viewer, pdf, pageNumber++, function pageRenderingComplete() {
if (pageNumber > pdf.numPages)
return; // All pages rendered
// Continue rendering of the next page
renderPage(viewer, pdf, pageNumber++, pageRenderingComplete);
});
});

52
examples/acroforms/index.html Normal file
View File

@ -0,0 +1,52 @@
<!doctype html>
<html>
<head>
<!-- In production, only one script (pdf.js) is necessary -->
<!-- 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/canvas.js"></script>
<script type="text/javascript" src="../../src/obj.js"></script>
<script type="text/javascript" src="../../src/function.js"></script>
<script type="text/javascript" src="../../src/charsets.js"></script>
<script type="text/javascript" src="../../src/cidmaps.js"></script>
<script type="text/javascript" src="../../src/colorspace.js"></script>
<script type="text/javascript" src="../../src/crypto.js"></script>
<script type="text/javascript" src="../../src/evaluator.js"></script>
<script type="text/javascript" src="../../src/fonts.js"></script>
<script type="text/javascript" src="../../src/glyphlist.js"></script>
<script type="text/javascript" src="../../src/image.js"></script>
<script type="text/javascript" src="../../src/metrics.js"></script>
<script type="text/javascript" src="../../src/parser.js"></script>
<script type="text/javascript" src="../../src/pattern.js"></script>
<script type="text/javascript" src="../../src/stream.js"></script>
<script type="text/javascript" src="../../src/worker.js"></script>
<script type="text/javascript" src="../../external/jpgjs/jpg.js"></script>
<script type="text/javascript">
// Specify the main script used to create a new PDF.JS web worker.
// In production, change this to point to the combined `pdf.js` file.
PDFJS.workerSrc = '../../src/worker_loader.js';
// Specify the PDF with AcroForm here
var pdfWithFormsPath = '../../test/pdfs/f1040.pdf';
</script>
<style>
.pdfpage { position:relative; top: 0; left: 0; border: solid 1px black; margin: 10px; }
.pdfpage > canvas { position: absolute; top: 0; left: 0; }
.pdfpage > div { position: absolute; top: 0; left: 0; }
.inputControl { background: transparent; border: 0px none; position: absolute; margin: auto; }
.inputControl[type='checkbox'] { margin: 0px; }
.inputHint { opacity: 0.2; background: #ccc; position: absolute; }
</style>
<script type="text/javascript" src="forms.js"></script>
</head>
<body>
<div id="viewer"></div>
</body>
</html>

120
src/core.js
View File

@ -274,46 +274,115 @@ var Page = (function PageClosure() {
}
},
getLinks: function pageGetLinks() {
var links = [];
var annotations = pageGetAnnotations();
var i, n = annotations.length;
for (i = 0; i < n; ++i) {
if (annotations[i].type != 'Link')
continue;
links.push(annotations[i]);
}
return links;
},
getAnnotations: function pageGetAnnotations() {
var xref = this.xref;
function getInheritableProperty(annotation, name) {
var item = annotation;
while (item && !item.has(name)) {
item = xref.fetchIfRef(item.get('Parent'));
}
if (!item)
return null;
return item.get(name);
}
var annotations = xref.fetchIfRef(this.annotations) || [];
var i, n = annotations.length;
var links = [];
var items = [];
for (i = 0; i < n; ++i) {
var annotation = xref.fetch(annotations[i]);
var annotationRef = annotations[i];
var annotation = xref.fetch(annotationRef);
if (!isDict(annotation))
continue;
var subtype = annotation.get('Subtype');
if (!isName(subtype) || subtype.name != 'Link')
if (!isName(subtype))
continue;
var rect = annotation.get('Rect');
var topLeftCorner = this.rotatePoint(rect[0], rect[1]);
var bottomRightCorner = this.rotatePoint(rect[2], rect[3]);
var link = {};
link.x = Math.min(topLeftCorner.x, bottomRightCorner.x);
link.y = Math.min(topLeftCorner.y, bottomRightCorner.y);
link.width = Math.abs(topLeftCorner.x - bottomRightCorner.x);
link.height = Math.abs(topLeftCorner.y - bottomRightCorner.y);
var a = this.xref.fetchIfRef(annotation.get('A'));
if (a) {
switch (a.get('S').name) {
case 'URI':
link.url = a.get('URI');
var item = {};
item.type = subtype.name;
item.x = Math.min(topLeftCorner.x, bottomRightCorner.x);
item.y = Math.min(topLeftCorner.y, bottomRightCorner.y);
item.width = Math.abs(topLeftCorner.x - bottomRightCorner.x);
item.height = Math.abs(topLeftCorner.y - bottomRightCorner.y);
switch (subtype.name) {
case 'Link':
var a = this.xref.fetchIfRef(annotation.get('A'));
if (a) {
switch (a.get('S').name) {
case 'URI':
link.url = a.get('URI');
break;
case 'GoTo':
link.dest = a.get('D');
break;
default:
TODO('other link types');
}
} else if (annotation.has('Dest')) {
// simple destination link
var dest = annotation.get('Dest');
link.dest = isName(dest) ? dest.name : dest;
}
break;
case 'Widget':
var fieldType = getInheritableProperty(annotation, 'FT');
if (!isName(fieldType))
break;
case 'GoTo':
link.dest = a.get('D');
break;
default:
TODO('other link types');
}
} else if (annotation.has('Dest')) {
// simple destination link
var dest = annotation.get('Dest');
link.dest = isName(dest) ? dest.name : dest;
item.fieldType = fieldType.name;
// Building the full field name by collecting the field and
// its ancestors 'T' properties and joining them using '.'.
var fieldName = [];
var namedItem = annotation, ref = annotationRef;
while (namedItem) {
var parentRef = namedItem.get('Parent');
var parent = xref.fetchIfRef(parentRef);
var name = namedItem.get('T');
if (name)
fieldName.unshift(stringToPDFString(name));
else {
// The field name is absent, that means more than one field
// with the same name may exist. Replacing the empty name
// with the '`' plus index in the parent's 'Kids' array.
// This is not in the PDF spec but necessary to id the
// the input controls.
var kids = xref.fetchIfRef(parent.get('Kids'));
var j, jj;
for (j = 0, jj = kids.length; j < jj; j++) {
if (kids[j].num == ref.num && kids[j].gen == ref.gen)
break;
}
fieldName.unshift('`' + j);
}
namedItem = parent;
ref = parentRef;
}
item.fullName = fieldName.join('.');
var alternativeText = stringToPDFString(annotation.get('TU') || '');
item.alternativeText = alternativeText;
var da = getInheritableProperty(annotation, 'DA') || '';
var m = /([\d\.]+)\sTf/.exec(da);
if (m)
item.fontSize = parseFloat(m[1]);
item.textAlignment = getInheritableProperty(annotation, 'Q');
item.flags = getInheritableProperty(annotation, 'Ff') || 0;
break;
}
links.push(link);
items.push(item);
}
return links;
return items;
},
startRendering: function pageStartRendering(ctx, callback, textLayer) {
this.ctx = ctx;
@ -352,6 +421,7 @@ var PDFDocModel = (function PDFDocModelClosure() {
assertWellFormed(stream.length > 0, 'stream must have data');
this.stream = stream;
this.setup();
this.acroForm = this.xref.fetchIfRef(this.catalog.catDict.get('AcroForm'));
}
function find(stream, needle, limit, backwards) {

37
web/viewer.js
View File

@ -458,7 +458,7 @@ var PageView = function pageView(container, content, id, pageWidth, pageHeight,
delete this.canvas;
};
function setupLinks(content, scale) {
function setupAnnotations(content, scale) {
function bindLink(link, dest) {
link.href = PDFView.getDestinationHash(dest);
link.onclick = function pageViewSetupLinksOnclick() {
@ -467,18 +467,27 @@ var PageView = function pageView(container, content, id, pageWidth, pageHeight,
return false;
};
}
function createElementWithStyle(tagName, item) {
var element = document.createElement(tagName);
element.style.left = (Math.floor(item.x - view.x) * scale) + 'px';
element.style.top = (Math.floor(item.y - view.y) * scale) + 'px';
element.style.width = Math.ceil(item.width * scale) + 'px';
element.style.height = Math.ceil(item.height * scale) + 'px';
return element;
}
var links = content.getLinks();
for (var i = 0; i < links.length; i++) {
var link = document.createElement('a');
link.style.left = (Math.floor(links[i].x - view.x) * scale) + 'px';
link.style.top = (Math.floor(links[i].y - view.y) * scale) + 'px';
link.style.width = Math.ceil(links[i].width * scale) + 'px';
link.style.height = Math.ceil(links[i].height * scale) + 'px';
link.href = links[i].url || '';
if (!links[i].url)
bindLink(link, ('dest' in links[i]) ? links[i].dest : null);
div.appendChild(link);
var items = content.getAnnotations();
for (var i = 0; i < items.length; i++) {
var item = items[i];
switch (item.type) {
case 'Link':
var link = createElementWithStyle('a', item);
link.href = item.url || '';
if (!item.url)
bindLink(link, ('dest' in item) ? item.dest : null);
div.appendChild(link);
break;
}
}
}
@ -598,7 +607,7 @@ var PageView = function pageView(container, content, id, pageWidth, pageHeight,
}).bind(this), textLayer
);
setupLinks(this.content, this.scale);
setupAnnotations(this.content, this.scale);
div.setAttribute('data-loaded', true);
return true;
@ -889,6 +898,8 @@ window.addEventListener('pagechange', function pagechange(evt) {
window.addEventListener('keydown', function keydown(evt) {
var curElement = document.activeElement;
if (curElement && curElement.tagName == 'INPUT')
return;
var controlsElement = document.getElementById('controls');
while (curElement) {
if (curElement === controlsElement)