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

Improves rendering performance of annotation layers.

Browse Source 
This change does the following:
 * Address TODO to remove getEmptyContainer helper.
 * Not set container bg-color. The old code is incorrect, causing it to
   not have any effect. It sets color to an array (item.color) rather
   css string. Also in most cases it would set it to black background
   which is incorrect.
 * only add border instructions when there is actually a border
 * reduce memory consumption by not creating new 3 element arrays for
   annotation colors. In fact according to spec, this would be incorrect,
   as the default should be "transparent" for an empty array. Adobe
   Reader interprets a missing color array as black however.

Note that only Link annotations were actually setting a border style and
color. While Text annotations might have calculated a border they did
not color it. This behaviour is now controlled by the boolean flag.
This commit is contained in:
Fabian Lange 2014-08-19 22:05:59 +02:00
parent 01cf21955e
commit 979635138a
2 changed files with 47 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/core/annotation.js
View File

@ -79,12 +79,26 @@ var Annotation = (function AnnotationClosure() {
data.annotationFlags = dict.get('F');
var color = dict.get('C');
if (isArray(color) && color.length === 3) {
// TODO(mack): currently only supporting rgb; need support different
// colorspaces
data.color = color;
} else {
if (!color) {
// The PDF spec does not mention how a missing color array is interpreted.
// Adobe Reader seems to default to black in this case.
data.color = [0, 0, 0];
} else if (isArray(color)) {
switch (color.length) {
case 0:
// Empty array denotes transparent border.
data.color = null;
break;
case 1:
// TODO: implement DeviceGray
break;
case 3:
data.color = color;
break;
case 4:
// TODO: implement DeviceCMYK
break;
}
}
// Some types of annotations have border style dict which has more
@ -101,7 +115,7 @@ var Annotation = (function AnnotationClosure() {
if (data.borderWidth > 0 && dashArray) {
if (!isArray(dashArray)) {
// Ignore the border if dashArray is not actually an array,
// this is consistent with the behaviour in Adobe Reader.
// this is consistent with the behaviour in Adobe Reader.
data.borderWidth = 0;
} else {
var dashArrayLength = dashArray.length;

52
src/display/annotation_helper.js
View File

@ -45,26 +45,27 @@ var AnnotationUtils = (function AnnotationUtilsClosure() {
style.fontFamily = fontFamily + fallbackName;
}
// TODO(mack): Remove this, it's not really that helpful.
function getEmptyContainer(tagName, rect, borderWidth) {
var bWidth = borderWidth || 0;
var element = document.createElement(tagName);
element.style.borderWidth = bWidth + 'px';
var width = rect[2] - rect[0] - 2 * bWidth;
var height = rect[3] - rect[1] - 2 * bWidth;
element.style.width = width + 'px';
element.style.height = height + 'px';
return element;
}
function initContainer(item, drawBorder) {
var container = document.createElement('section');
var cstyle = container.style;
var width = item.rect[2] - item.rect[0];
var height = item.rect[3] - item.rect[1];
function initContainer(item) {
var container = getEmptyContainer('section', item.rect, item.borderWidth);
container.style.backgroundColor = item.color;
var color = item.color;
item.colorCssRgb = Util.makeCssRgb(Math.round(color[0] * 255),
Math.round(color[1] * 255),
Math.round(color[2] * 255));
var bWidth = item.borderWidth || 0;
if (bWidth) {
width = width - 2 * bWidth;
height = height - 2 * bWidth;
cstyle.borderWidth = bWidth + 'px';
var color = item.color;
if (drawBorder && color) {
cstyle.borderStyle = 'solid';
cstyle.borderColor = Util.makeCssRgb(Math.round(color[0] * 255),
Math.round(color[1] * 255),
Math.round(color[2] * 255));
}
}
cstyle.width = width + 'px';
cstyle.height = height + 'px';
var highlight = document.createElement('div');
highlight.className = 'annotationHighlight';
@ -79,7 +80,11 @@ var AnnotationUtils = (function AnnotationUtilsClosure() {
}
function getHtmlElementForTextWidgetAnnotation(item, commonObjs) {
var element = getEmptyContainer('div', item.rect, 0);
var element = document.createElement('div');
var width = item.rect[2] - item.rect[0];
var height = item.rect[3] - item.rect[1];
element.style.width = width + 'px';
element.style.height = height + 'px';
element.style.display = 'table';
var content = document.createElement('div');
@ -109,7 +114,7 @@ var AnnotationUtils = (function AnnotationUtilsClosure() {
rect[2] = rect[0] + (rect[3] - rect[1]); // make it square
}
var container = initContainer(item);
var container = initContainer(item, false);
container.className = 'annotText';
var image = document.createElement('img');
@ -218,12 +223,9 @@ var AnnotationUtils = (function AnnotationUtilsClosure() {
}
function getHtmlElementForLinkAnnotation(item) {
var container = initContainer(item);
var container = initContainer(item, true);
container.className = 'annotLink';
container.style.borderColor = item.colorCssRgb;
container.style.borderStyle = 'solid';
var link = document.createElement('a');
link.href = link.title = item.url || '';