Merge pull request #5214 from CodingFabian/optimize-annotation-layer

Improves rendering performance of annotation layers.
This commit is contained in:
Tim van der Meij 2014-12-21 16:50:36 +01:00
commit 6e994b15e2
2 changed files with 47 additions and 31 deletions

View File

@ -79,12 +79,26 @@ var Annotation = (function AnnotationClosure() {
data.annotationFlags = dict.get('F'); data.annotationFlags = dict.get('F');
var color = dict.get('C'); var color = dict.get('C');
if (isArray(color) && color.length === 3) { if (!color) {
// TODO(mack): currently only supporting rgb; need support different // The PDF spec does not mention how a missing color array is interpreted.
// colorspaces // Adobe Reader seems to default to black in this case.
data.color = color;
} else {
data.color = [0, 0, 0]; 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 // Some types of annotations have border style dict which has more

View File

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