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

Move text layer UI to viewer.js; fixes adding div with single char; replaces innerHTML to textContent

Browse Source
This commit is contained in:
notmasteryet 2011-12-18 12:53:30 -06:00
parent 0226405b86
commit 0f6291c7b9
2 changed files with 55 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
src/canvas.js
View File

@ -255,8 +255,9 @@ var CanvasGraphics = (function CanvasGraphicsClosure() {
} }
// Scale so that canvas units are the same as PDF user space units // Scale so that canvas units are the same as PDF user space units
this.ctx.scale(cw / mediaBox.width, ch / mediaBox.height); this.ctx.scale(cw / mediaBox.width, ch / mediaBox.height);
this.textDivs = [];
this.textLayerQueue = []; if (this.textLayer)
this.textLayer.beginLayout();
}, },
executeIRQueue: function canvasGraphicsExecuteIRQueue(codeIR, executeIRQueue: function canvasGraphicsExecuteIRQueue(codeIR,
@ -320,27 +321,8 @@ var CanvasGraphics = (function CanvasGraphicsClosure() {
endDrawing: function canvasGraphicsEndDrawing() { endDrawing: function canvasGraphicsEndDrawing() {
this.ctx.restore(); this.ctx.restore();
var textLayer = this.textLayer; if (this.textLayer)
if (!textLayer) this.textLayer.endLayout();
return;
var self = this;
var textDivs = this.textDivs;
this.textLayerTimer = setInterval(function renderTextLayer() {
if (textDivs.length === 0) {
clearInterval(self.textLayerTimer);
return;
}
var textDiv = textDivs.shift();
if (textDiv.dataset.textLength > 1) { // avoid div by zero
textLayer.appendChild(textDiv);
// Adjust div width (via letterSpacing) to match canvas text
// Due to the .offsetWidth calls, this is slow
textDiv.style.letterSpacing =
((textDiv.dataset.canvasWidth - textDiv.offsetWidth) /
(textDiv.dataset.textLength - 1)) + 'px';
}
}, 0);
}, },
// Graphics state // Graphics state
@ -630,24 +612,6 @@ var CanvasGraphics = (function CanvasGraphicsClosure() {
return geometry; return geometry;
}, },
pushTextDivs: function canvasGraphicsPushTextDivs(text) {
var div = document.createElement('div');
var fontSize = this.current.fontSize;
// vScale and hScale already contain the scaling to pixel units
// as mozCurrentTransform reflects ctx.scale() changes
// (see beginDrawing())
var fontHeight = fontSize * text.geom.vScale;
div.dataset.canvasWidth = text.canvasWidth * text.geom.hScale;
div.style.fontSize = fontHeight + 'px';
div.style.fontFamily = this.current.font.loadedName || 'sans-serif';
div.style.left = text.geom.x + 'px';
div.style.top = (text.geom.y - fontHeight) + 'px';
div.innerHTML = text.str;
div.dataset.textLength = text.length;
this.textDivs.push(div);
},
showText: function canvasGraphicsShowText(str, skipTextSelection) { showText: function canvasGraphicsShowText(str, skipTextSelection) {
var ctx = this.ctx; var ctx = this.ctx;
var current = this.current; var current = this.current;
@ -753,7 +717,7 @@ var CanvasGraphics = (function CanvasGraphicsClosure() {
} }
if (textSelection) if (textSelection)
this.pushTextDivs(text); this.textLayer.appendText(text, font.loadedName, fontSize);
return text; return text;
}, },
@ -819,7 +783,7 @@ var CanvasGraphics = (function CanvasGraphicsClosure() {
} }
if (textSelection) if (textSelection)
this.pushTextDivs(text); this.textLayer.appendText(text, font.loadedName, fontSize);
}, },
nextLineShowText: function canvasGraphicsNextLineShowText(text) { nextLineShowText: function canvasGraphicsNextLineShowText(text) {
this.nextLine(); this.nextLine();

49
web/viewer.js
View File

@ -595,7 +595,7 @@ var PageView = function pageView(container, content, id, pageWidth, pageHeight,
this.updateStats(); this.updateStats();
if (this.onAfterDraw) if (this.onAfterDraw)
this.onAfterDraw(); this.onAfterDraw();
}).bind(this), textLayer }).bind(this), new TextLayerBuilder(textLayer)
); );
setupLinks(this.content, this.scale); setupLinks(this.content, this.scale);
@ -726,6 +726,53 @@ var DocumentOutlineView = function documentOutlineView(outline) {
} }
}; };
var TextLayerBuilder = function textLayerBuilder(textLayerDiv) {
this.textLayerDiv = textLayerDiv;
this.beginLayout = function textLayerBuilderBeginLayout() {
this.textDivs = [];
this.textLayerQueue = [];
};
this.endLayout = function textLayerBuilderEndLayout() {
var self = this;
var textDivs = this.textDivs;
var textLayerDiv = this.textLayerDiv;
this.textLayerTimer = setInterval(function renderTextLayer() {
if (textDivs.length === 0) {
clearInterval(self.textLayerTimer);
return;
}
var textDiv = textDivs.shift();
if (textDiv.dataset.textLength >= 1) { // avoid div by zero
textLayerDiv.appendChild(textDiv);
// Adjust div width (via letterSpacing) to match canvas text
// Due to the .offsetWidth calls, this is slow
textDiv.style.letterSpacing =
((textDiv.dataset.canvasWidth - textDiv.offsetWidth) /
(textDiv.dataset.textLength - 1)) + 'px';
}
}, 0);
};
this.appendText = function textLayerBuilderAppendText(text,
fontName, fontSize) {
var textDiv = document.createElement('div');
// vScale and hScale already contain the scaling to pixel units
var fontHeight = fontSize * text.geom.vScale;
textDiv.dataset.canvasWidth = text.canvasWidth * text.geom.hScale;
textDiv.style.fontSize = fontHeight + 'px';
textDiv.style.fontFamily = fontName || 'sans-serif';
textDiv.style.left = text.geom.x + 'px';
textDiv.style.top = (text.geom.y - fontHeight) + 'px';
textDiv.textContent = text.str;
textDiv.dataset.textLength = text.length;
this.textDivs.push(textDiv);
};
};
window.addEventListener('load', function webViewerLoad(evt) { window.addEventListener('load', function webViewerLoad(evt) {
var params = document.location.search.substring(1).split('&'); var params = document.location.search.substring(1).split('&');
for (var i = 0; i < params.length; i++) { for (var i = 0; i < params.length; i++) {