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

Move most rendering logic to src/display/annotation_layer.js

Browse Source
This commit is contained in:
Tim van der Meij 2015-12-03 00:20:18 +01:00
parent 38567ac3a3
commit 2dc3ee38c0
3 changed files with 47 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
src/display/annotation_layer.js
View File

@ -42,12 +42,28 @@ var AnnotationLayer = (function AnnotationLayerClosure() {
style.fontFamily = fontFamily + fallbackName;
}
function getContainer(data) {
function getContainer(data, page, viewport) {
var container = document.createElement('section');
var cstyle = container.style;
var width = data.rect[2] - data.rect[0];
var height = data.rect[3] - data.rect[1];
// ID
container.setAttribute('data-annotation-id', data.id);
// Normalize rectangle
data.rect = Util.normalizeRect([
data.rect[0],
page.view[3] - data.rect[1] + page.view[1],
data.rect[2],
page.view[3] - data.rect[3] + page.view[1]
]);
// Transform
CustomStyle.setProp('transform', container,
'matrix(' + viewport.transform.join(',') + ')');
CustomStyle.setProp('transformOrigin', container,
-data.rect[0] + 'px ' + -data.rect[1] + 'px');
// Border
if (data.borderStyle.width > 0) {
// Border width
@ -106,12 +122,18 @@ var AnnotationLayer = (function AnnotationLayerClosure() {
}
}
cstyle.width = width + 'px';
cstyle.height = height + 'px';
// Position
container.style.left = data.rect[0] + 'px';
container.style.top = data.rect[1] + 'px';
// Size
container.style.width = width + 'px';
container.style.height = height + 'px';
return container;
}
function getHtmlElementForTextWidgetAnnotation(item, commonObjs) {
function getHtmlElementForTextWidgetAnnotation(item, page) {
var element = document.createElement('div');
var width = item.rect[2] - item.rect[0];
var height = item.rect[3] - item.rect[1];
@ -127,7 +149,7 @@ var AnnotationLayer = (function AnnotationLayerClosure() {
content.style.display = 'table-cell';
var fontObj = item.fontRefName ?
commonObjs.getData(item.fontRefName) : null;
page.commonObjs.getData(item.fontRefName) : null;
setTextStyles(content, item, fontObj);
element.appendChild(content);
@ -135,7 +157,7 @@ var AnnotationLayer = (function AnnotationLayerClosure() {
return element;
}
function getHtmlElementForTextAnnotation(item) {
function getHtmlElementForTextAnnotation(item, page, viewport) {
var rect = item.rect;
// sanity check because of OOo-generated PDFs
@ -146,7 +168,7 @@ var AnnotationLayer = (function AnnotationLayerClosure() {
rect[2] = rect[0] + (rect[3] - rect[1]); // make it square
}
var container = getContainer(item);
var container = getContainer(item, page, viewport);
container.className = 'annotText';
var image = document.createElement('img');
@ -252,8 +274,8 @@ var AnnotationLayer = (function AnnotationLayerClosure() {
return container;
}
function getHtmlElementForLinkAnnotation(item) {
var container = getContainer(item);
function getHtmlElementForLinkAnnotation(item, page, viewport) {
var container = getContainer(item, page, viewport);
container.className = 'annotLink';
var link = document.createElement('a');
@ -268,14 +290,14 @@ var AnnotationLayer = (function AnnotationLayerClosure() {
return container;
}
function getHtmlElement(data, objs) {
function getHtmlElement(data, page, viewport) {
switch (data.annotationType) {
case AnnotationType.WIDGET:
return getHtmlElementForTextWidgetAnnotation(data, objs);
return getHtmlElementForTextWidgetAnnotation(data, page);
case AnnotationType.TEXT:
return getHtmlElementForTextAnnotation(data);
return getHtmlElementForTextAnnotation(data, page, viewport);
case AnnotationType.LINK:
return getHtmlElementForLinkAnnotation(data);
return getHtmlElementForLinkAnnotation(data, page, viewport);
default:
throw new Error('Unsupported annotationType: ' + data.annotationType);
}

4
web/annotations_layer_builder.css
View File

@ -13,6 +13,10 @@
* limitations under the License.
*/
.annotationLayer section {
position: absolute;
}
.annotationLayer .annotLink > a:hover {
opacity: 0.2;
background: #ff0;

30
web/annotations_layer_builder.js
View File

@ -40,6 +40,7 @@ var AnnotationsLayerBuilder = (function AnnotationsLayerBuilderClosure() {
this.div = null;
}
AnnotationsLayerBuilder.prototype =
/** @lends AnnotationsLayerBuilder.prototype */ {
@ -81,8 +82,6 @@ var AnnotationsLayerBuilder = (function AnnotationsLayerBuilderClosure() {
pdfPage.getAnnotations(getAnnotationsParams).then(
function (annotationsData) {
viewport = viewport.clone({ dontFlip: true });
var transform = viewport.transform;
var transformStr = 'matrix(' + transform.join(',') + ')';
var data, element, i, ii;
if (self.div) {
@ -91,9 +90,10 @@ var AnnotationsLayerBuilder = (function AnnotationsLayerBuilderClosure() {
for (i = 0, ii = annotationsData.length; i < ii; i++) {
data = annotationsData[i];
element = self.div.querySelector(
'[data-annotation-id="' + data.id + '"]');
'[data-annotation-id="' + data.id + '"]');
if (element) {
CustomStyle.setProp('transform', element, transformStr);
CustomStyle.setProp('transform', element,
'matrix(' + viewport.transform.join(',') + ')');
}
}
// See PDFPageView.reset()
@ -105,29 +105,12 @@ var AnnotationsLayerBuilder = (function AnnotationsLayerBuilderClosure() {
continue;
}
element = PDFJS.AnnotationLayer.getHtmlElement(data,
pdfPage.commonObjs);
element.setAttribute('data-annotation-id', data.id);
element = PDFJS.AnnotationLayer.getHtmlElement(data, pdfPage,
viewport);
if (typeof mozL10n !== 'undefined') {
mozL10n.translate(element);
}
var rect = data.rect;
var view = pdfPage.view;
rect = PDFJS.Util.normalizeRect([
rect[0],
view[3] - rect[1] + view[1],
rect[2],
view[3] - rect[3] + view[1]
]);
element.style.left = rect[0] + 'px';
element.style.top = rect[1] + 'px';
element.style.position = 'absolute';
CustomStyle.setProp('transform', element, transformStr);
var transformOriginStr = -rect[0] + 'px ' + -rect[1] + 'px';
CustomStyle.setProp('transformOrigin', element, transformOriginStr);
if (data.subtype === 'Link' && !data.url) {
var link = element.getElementsByTagName('a')[0];
if (link) {
@ -159,6 +142,7 @@ var AnnotationsLayerBuilder = (function AnnotationsLayerBuilderClosure() {
this.div.setAttribute('hidden', 'true');
}
};
return AnnotationsLayerBuilder;
})();