Merge pull request #5137 from CodingFabian/optimize-textbuilder-renderLayer

Optimize TextLayerBuilder_renderLayer() for text heavy documents.
This commit is contained in:
Yury Delendik 2014-08-06 09:09:32 -05:00
commit 666cf02f91

View File

@ -56,20 +56,34 @@ var TextLayerBuilder = (function TextLayerBuilderClosure() {
return; return;
} }
var lastFontSize;
var lastFontFamily;
for (var i = 0; i < textDivsLength; i++) { for (var i = 0; i < textDivsLength; i++) {
var textDiv = textDivs[i]; var textDiv = textDivs[i];
if (textDiv.dataset.isWhitespace !== undefined) { if (textDiv.dataset.isWhitespace !== undefined) {
continue; continue;
} }
ctx.font = textDiv.style.fontSize + ' ' + textDiv.style.fontFamily; var fontSize = textDiv.style.fontSize;
var fontFamily = textDiv.style.fontFamily;
// Only build font string and set to context if different from last.
if (fontSize !== lastFontSize || fontFamily !== lastFontFamily) {
ctx.font = fontSize + ' ' + fontFamily;
lastFontSize = fontSize;
lastFontFamily = fontFamily;
}
var width = ctx.measureText(textDiv.textContent).width; var width = ctx.measureText(textDiv.textContent).width;
if (width > 0) { if (width > 0) {
textLayerFrag.appendChild(textDiv); textLayerFrag.appendChild(textDiv);
// Dataset values come of type string.
var textScale = textDiv.dataset.canvasWidth / width; var textScale = textDiv.dataset.canvasWidth / width;
var rotation = textDiv.dataset.angle; var rotation = textDiv.dataset.angle;
var transform = 'scale(' + textScale + ', 1)'; var transform = 'scale(' + textScale + ', 1)';
transform = 'rotate(' + rotation + 'deg) ' + transform; if (rotation) {
transform = 'rotate(' + rotation + 'deg) ' + transform;
}
CustomStyle.setProp('transform' , textDiv, transform); CustomStyle.setProp('transform' , textDiv, transform);
CustomStyle.setProp('transformOrigin' , textDiv, '0% 0%'); CustomStyle.setProp('transformOrigin' , textDiv, '0% 0%');
} }
@ -114,18 +128,34 @@ var TextLayerBuilder = (function TextLayerBuilderClosure() {
angle += Math.PI / 2; angle += Math.PI / 2;
} }
var fontHeight = Math.sqrt((tx[2] * tx[2]) + (tx[3] * tx[3])); var fontHeight = Math.sqrt((tx[2] * tx[2]) + (tx[3] * tx[3]));
var fontAscent = (style.ascent ? style.ascent * fontHeight : var fontAscent = fontHeight;
(style.descent ? (1 + style.descent) * fontHeight : fontHeight)); if (style.ascent) {
fontAscent = style.ascent * fontAscent;
} else if (style.descent) {
fontAscent = (1 + style.descent) * fontAscent;
}
var left;
var top;
if (angle === 0) {
left = tx[4];
top = tx[5] - fontAscent;
} else {
left = tx[4] + (fontAscent * Math.sin(angle));
top = tx[5] - (fontAscent * Math.cos(angle));
}
textDiv.style.position = 'absolute'; textDiv.style.position = 'absolute';
textDiv.style.left = (tx[4] + (fontAscent * Math.sin(angle))) + 'px'; textDiv.style.left = left + 'px';
textDiv.style.top = (tx[5] - (fontAscent * Math.cos(angle))) + 'px'; textDiv.style.top = top + 'px';
textDiv.style.fontSize = fontHeight + 'px'; textDiv.style.fontSize = fontHeight + 'px';
textDiv.style.fontFamily = style.fontFamily; textDiv.style.fontFamily = style.fontFamily;
textDiv.textContent = geom.str; textDiv.textContent = geom.str;
textDiv.dataset.fontName = geom.fontName; textDiv.dataset.fontName = geom.fontName;
textDiv.dataset.angle = angle * (180 / Math.PI); // Storing into dataset will convert number into string.
if (angle !== 0) {
textDiv.dataset.angle = angle * (180 / Math.PI);
}
if (style.vertical) { if (style.vertical) {
textDiv.dataset.canvasWidth = geom.height * this.viewport.scale; textDiv.dataset.canvasWidth = geom.height * this.viewport.scale;
} else { } else {
@ -249,7 +279,7 @@ var TextLayerBuilder = (function TextLayerBuilderClosure() {
var end = match.end; var end = match.end;
var isSelected = (isSelectedPage && i === selectedMatchIdx); var isSelected = (isSelectedPage && i === selectedMatchIdx);
var highlightSuffix = (isSelected ? ' selected' : ''); var highlightSuffix = (isSelected ? ' selected' : '');
if (isSelected && !this.isViewerInPresentationMode) { if (isSelected && !this.isViewerInPresentationMode) {
scrollIntoView(textDivs[begin.divIdx], scrollIntoView(textDivs[begin.divIdx],
{ top: FIND_SCROLL_OFFSET_TOP, { top: FIND_SCROLL_OFFSET_TOP,
@ -324,4 +354,3 @@ var TextLayerBuilder = (function TextLayerBuilderClosure() {
}; };
return TextLayerBuilder; return TextLayerBuilder;
})(); })();