|
|
|
@ -20,8 +20,8 @@ if (typeof PDFJS === 'undefined') {
@@ -20,8 +20,8 @@ if (typeof PDFJS === 'undefined') {
|
|
|
|
|
(typeof window !== 'undefined' ? window : this).PDFJS = {}; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
PDFJS.version = '1.3.114'; |
|
|
|
|
PDFJS.build = '9228e1f'; |
|
|
|
|
PDFJS.version = '1.3.116'; |
|
|
|
|
PDFJS.build = 'cfc0cc8'; |
|
|
|
|
|
|
|
|
|
(function pdfjsWrapper() { |
|
|
|
|
// Use strict in our context only - users might not want it
|
|
|
|
@ -1811,341 +1811,531 @@ var CustomStyle = displayDOMUtils.CustomStyle;
@@ -1811,341 +1811,531 @@ var CustomStyle = displayDOMUtils.CustomStyle;
|
|
|
|
|
|
|
|
|
|
var ANNOT_MIN_SIZE = 10; // px
|
|
|
|
|
|
|
|
|
|
var AnnotationLayer = (function AnnotationLayerClosure() { |
|
|
|
|
// TODO(mack): This dupes some of the logic in CanvasGraphics.setFont()
|
|
|
|
|
function setTextStyles(element, item, fontObj) { |
|
|
|
|
var style = element.style; |
|
|
|
|
style.fontSize = item.fontSize + 'px'; |
|
|
|
|
style.direction = item.fontDirection < 0 ? 'rtl': 'ltr'; |
|
|
|
|
/** |
|
|
|
|
* @typedef {Object} AnnotationElementParameters |
|
|
|
|
* @property {Object} data |
|
|
|
|
* @property {PDFPage} page |
|
|
|
|
* @property {PageViewport} viewport |
|
|
|
|
* @property {IPDFLinkService} linkService |
|
|
|
|
*/ |
|
|
|
|
|
|
|
|
|
if (!fontObj) { |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
/** |
|
|
|
|
* @class |
|
|
|
|
* @alias AnnotationElementFactory |
|
|
|
|
*/ |
|
|
|
|
function AnnotationElementFactory() {} |
|
|
|
|
AnnotationElementFactory.prototype = |
|
|
|
|
/** @lends AnnotationElementFactory.prototype */ { |
|
|
|
|
/** |
|
|
|
|
* @param {AnnotationElementParameters} parameters |
|
|
|
|
* @returns {AnnotationElement} |
|
|
|
|
*/ |
|
|
|
|
create: function AnnotationElementFactory_create(parameters) { |
|
|
|
|
var subtype = parameters.data.annotationType; |
|
|
|
|
|
|
|
|
|
style.fontWeight = fontObj.black ? |
|
|
|
|
(fontObj.bold ? 'bolder' : 'bold') : |
|
|
|
|
(fontObj.bold ? 'bold' : 'normal'); |
|
|
|
|
style.fontStyle = fontObj.italic ? 'italic' : 'normal'; |
|
|
|
|
switch (subtype) { |
|
|
|
|
case AnnotationType.LINK: |
|
|
|
|
return new LinkAnnotationElement(parameters); |
|
|
|
|
|
|
|
|
|
case AnnotationType.TEXT: |
|
|
|
|
return new TextAnnotationElement(parameters); |
|
|
|
|
|
|
|
|
|
var fontName = fontObj.loadedName; |
|
|
|
|
var fontFamily = fontName ? '"' + fontName + '", ' : ''; |
|
|
|
|
// Use a reasonable default font if the font doesn't specify a fallback
|
|
|
|
|
var fallbackName = fontObj.fallbackName || 'Helvetica, sans-serif'; |
|
|
|
|
style.fontFamily = fontFamily + fallbackName; |
|
|
|
|
case AnnotationType.WIDGET: |
|
|
|
|
return new WidgetAnnotationElement(parameters); |
|
|
|
|
|
|
|
|
|
default: |
|
|
|
|
throw new Error('Unimplemented annotation type "' + subtype + '"'); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
function getContainer(data, page, viewport) { |
|
|
|
|
var container = document.createElement('section'); |
|
|
|
|
var width = data.rect[2] - data.rect[0]; |
|
|
|
|
var height = data.rect[3] - data.rect[1]; |
|
|
|
|
/** |
|
|
|
|
* @class |
|
|
|
|
* @alias AnnotationElement |
|
|
|
|
*/ |
|
|
|
|
var AnnotationElement = (function AnnotationElementClosure() { |
|
|
|
|
function AnnotationElement(parameters) { |
|
|
|
|
this.data = parameters.data; |
|
|
|
|
this.page = parameters.page; |
|
|
|
|
this.viewport = parameters.viewport; |
|
|
|
|
this.linkService = parameters.linkService; |
|
|
|
|
|
|
|
|
|
container.setAttribute('data-annotation-id', data.id); |
|
|
|
|
this.container = this._createContainer(); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
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] |
|
|
|
|
]); |
|
|
|
|
AnnotationElement.prototype = /** @lends AnnotationElement.prototype */ { |
|
|
|
|
/** |
|
|
|
|
* Create an empty container for the annotation's HTML element. |
|
|
|
|
* |
|
|
|
|
* @private |
|
|
|
|
* @memberof AnnotationElement |
|
|
|
|
* @returns {HTMLSectionElement} |
|
|
|
|
*/ |
|
|
|
|
_createContainer: function AnnotationElement_createContainer() { |
|
|
|
|
var data = this.data, page = this.page, viewport = this.viewport; |
|
|
|
|
var container = document.createElement('section'); |
|
|
|
|
var width = data.rect[2] - data.rect[0]; |
|
|
|
|
var height = data.rect[3] - data.rect[1]; |
|
|
|
|
|
|
|
|
|
container.setAttribute('data-annotation-id', data.id); |
|
|
|
|
|
|
|
|
|
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] |
|
|
|
|
]); |
|
|
|
|
|
|
|
|
|
CustomStyle.setProp('transform', container, |
|
|
|
|
'matrix(' + viewport.transform.join(',') + ')'); |
|
|
|
|
CustomStyle.setProp('transformOrigin', container, |
|
|
|
|
-data.rect[0] + 'px ' + -data.rect[1] + 'px'); |
|
|
|
|
CustomStyle.setProp('transform', container, |
|
|
|
|
'matrix(' + viewport.transform.join(',') + ')'); |
|
|
|
|
CustomStyle.setProp('transformOrigin', container, |
|
|
|
|
-data.rect[0] + 'px ' + -data.rect[1] + 'px'); |
|
|
|
|
|
|
|
|
|
if (data.borderStyle.width > 0) { |
|
|
|
|
container.style.borderWidth = data.borderStyle.width + 'px'; |
|
|
|
|
if (data.borderStyle.style !== AnnotationBorderStyleType.UNDERLINE) { |
|
|
|
|
// Underline styles only have a bottom border, so we do not need
|
|
|
|
|
// to adjust for all borders. This yields a similar result as
|
|
|
|
|
// Adobe Acrobat/Reader.
|
|
|
|
|
width = width - 2 * data.borderStyle.width; |
|
|
|
|
height = height - 2 * data.borderStyle.width; |
|
|
|
|
} |
|
|
|
|
if (data.borderStyle.width > 0) { |
|
|
|
|
container.style.borderWidth = data.borderStyle.width + 'px'; |
|
|
|
|
if (data.borderStyle.style !== AnnotationBorderStyleType.UNDERLINE) { |
|
|
|
|
// Underline styles only have a bottom border, so we do not need
|
|
|
|
|
// to adjust for all borders. This yields a similar result as
|
|
|
|
|
// Adobe Acrobat/Reader.
|
|
|
|
|
width = width - 2 * data.borderStyle.width; |
|
|
|
|
height = height - 2 * data.borderStyle.width; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
var horizontalRadius = data.borderStyle.horizontalCornerRadius; |
|
|
|
|
var verticalRadius = data.borderStyle.verticalCornerRadius; |
|
|
|
|
if (horizontalRadius > 0 || verticalRadius > 0) { |
|
|
|
|
var radius = horizontalRadius + 'px / ' + verticalRadius + 'px'; |
|
|
|
|
CustomStyle.setProp('borderRadius', container, radius); |
|
|
|
|
} |
|
|
|
|
var horizontalRadius = data.borderStyle.horizontalCornerRadius; |
|
|
|
|
var verticalRadius = data.borderStyle.verticalCornerRadius; |
|
|
|
|
if (horizontalRadius > 0 || verticalRadius > 0) { |
|
|
|
|
var radius = horizontalRadius + 'px / ' + verticalRadius + 'px'; |
|
|
|
|
CustomStyle.setProp('borderRadius', container, radius); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
switch (data.borderStyle.style) { |
|
|
|
|
case AnnotationBorderStyleType.SOLID: |
|
|
|
|
container.style.borderStyle = 'solid'; |
|
|
|
|
break; |
|
|
|
|
switch (data.borderStyle.style) { |
|
|
|
|
case AnnotationBorderStyleType.SOLID: |
|
|
|
|
container.style.borderStyle = 'solid'; |
|
|
|
|
break; |
|
|
|
|
|
|
|
|
|
case AnnotationBorderStyleType.DASHED: |
|
|
|
|
container.style.borderStyle = 'dashed'; |
|
|
|
|
break; |
|
|
|
|
case AnnotationBorderStyleType.DASHED: |
|
|
|
|
container.style.borderStyle = 'dashed'; |
|
|
|
|
break; |
|
|
|
|
|
|
|
|
|
case AnnotationBorderStyleType.BEVELED: |
|
|
|
|
warn('Unimplemented border style: beveled'); |
|
|
|
|
break; |
|
|
|
|
case AnnotationBorderStyleType.BEVELED: |
|
|
|
|
warn('Unimplemented border style: beveled'); |
|
|
|
|
break; |
|
|
|
|
|
|
|
|
|
case AnnotationBorderStyleType.INSET: |
|
|
|
|
warn('Unimplemented border style: inset'); |
|
|
|
|
break; |
|
|
|
|
case AnnotationBorderStyleType.INSET: |
|
|
|
|
warn('Unimplemented border style: inset'); |
|
|
|
|
break; |
|
|
|
|
|
|
|
|
|
case AnnotationBorderStyleType.UNDERLINE: |
|
|
|
|
container.style.borderBottomStyle = 'solid'; |
|
|
|
|
break; |
|
|
|
|
case AnnotationBorderStyleType.UNDERLINE: |
|
|
|
|
container.style.borderBottomStyle = 'solid'; |
|
|
|
|
break; |
|
|
|
|
|
|
|
|
|
default: |
|
|
|
|
break; |
|
|
|
|
} |
|
|
|
|
default: |
|
|
|
|
break; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
if (data.color) { |
|
|
|
|
container.style.borderColor = |
|
|
|
|
Util.makeCssRgb(data.color[0] | 0, |
|
|
|
|
data.color[1] | 0, |
|
|
|
|
data.color[2] | 0); |
|
|
|
|
} else { |
|
|
|
|
// Transparent (invisible) border, so do not draw it at all.
|
|
|
|
|
container.style.borderWidth = 0; |
|
|
|
|
if (data.color) { |
|
|
|
|
container.style.borderColor = |
|
|
|
|
Util.makeCssRgb(data.color[0] | 0, |
|
|
|
|
data.color[1] | 0, |
|
|
|
|
data.color[2] | 0); |
|
|
|
|
} else { |
|
|
|
|
// Transparent (invisible) border, so do not draw it at all.
|
|
|
|
|
container.style.borderWidth = 0; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
container.style.left = data.rect[0] + 'px'; |
|
|
|
|
container.style.top = data.rect[1] + 'px'; |
|
|
|
|
container.style.left = data.rect[0] + 'px'; |
|
|
|
|
container.style.top = data.rect[1] + 'px'; |
|
|
|
|
|
|
|
|
|
container.style.width = width + 'px'; |
|
|
|
|
container.style.height = height + 'px'; |
|
|
|
|
|
|
|
|
|
return container; |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
/** |
|
|
|
|
* Render the annotation's HTML element in the empty container. |
|
|
|
|
* |
|
|
|
|
* @public |
|
|
|
|
* @memberof AnnotationElement |
|
|
|
|
*/ |
|
|
|
|
render: function AnnotationElement_render() { |
|
|
|
|
throw new Error('Abstract method AnnotationElement.render called'); |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
container.style.width = width + 'px'; |
|
|
|
|
container.style.height = height + 'px'; |
|
|
|
|
return AnnotationElement; |
|
|
|
|
})(); |
|
|
|
|
|
|
|
|
|
return container; |
|
|
|
|
/** |
|
|
|
|
* @class |
|
|
|
|
* @alias LinkAnnotationElement |
|
|
|
|
*/ |
|
|
|
|
var LinkAnnotationElement = (function LinkAnnotationElementClosure() { |
|
|
|
|
function LinkAnnotationElement(parameters) { |
|
|
|
|
AnnotationElement.call(this, parameters); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
function getHtmlElementForTextWidgetAnnotation(item, page, viewport) { |
|
|
|
|
var container = getContainer(item, page, viewport); |
|
|
|
|
Util.inherit(LinkAnnotationElement, AnnotationElement, { |
|
|
|
|
/** |
|
|
|
|
* Render the link annotation's HTML element in the empty container. |
|
|
|
|
* |
|
|
|
|
* @public |
|
|
|
|
* @memberof LinkAnnotationElement |
|
|
|
|
* @returns {HTMLSectionElement} |
|
|
|
|
*/ |
|
|
|
|
render: function LinkAnnotationElement_render() { |
|
|
|
|
this.container.className = 'annotLink'; |
|
|
|
|
|
|
|
|
|
var content = document.createElement('div'); |
|
|
|
|
content.textContent = item.fieldValue; |
|
|
|
|
var textAlignment = item.textAlignment; |
|
|
|
|
content.style.textAlign = ['left', 'center', 'right'][textAlignment]; |
|
|
|
|
content.style.verticalAlign = 'middle'; |
|
|
|
|
content.style.display = 'table-cell'; |
|
|
|
|
var link = document.createElement('a'); |
|
|
|
|
link.href = link.title = this.data.url || ''; |
|
|
|
|
|
|
|
|
|
var fontObj = item.fontRefName ? |
|
|
|
|
page.commonObjs.getData(item.fontRefName) : null; |
|
|
|
|
setTextStyles(content, item, fontObj); |
|
|
|
|
if (this.data.url && isExternalLinkTargetSet()) { |
|
|
|
|
link.target = LinkTargetStringMap[PDFJS.externalLinkTarget]; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
container.appendChild(content); |
|
|
|
|
// Strip referrer from the URL.
|
|
|
|
|
if (this.data.url) { |
|
|
|
|
link.rel = PDFJS.externalLinkRel; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
return container; |
|
|
|
|
} |
|
|
|
|
if (!this.data.url) { |
|
|
|
|
if (this.data.action) { |
|
|
|
|
this._bindNamedAction(link, this.data.action); |
|
|
|
|
} else { |
|
|
|
|
this._bindLink(link, ('dest' in this.data) ? this.data.dest : null); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
function getHtmlElementForTextAnnotation(item, page, viewport) { |
|
|
|
|
var rect = item.rect; |
|
|
|
|
this.container.appendChild(link); |
|
|
|
|
return this.container; |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// sanity check because of OOo-generated PDFs
|
|
|
|
|
if ((rect[3] - rect[1]) < ANNOT_MIN_SIZE) { |
|
|
|
|
rect[3] = rect[1] + ANNOT_MIN_SIZE; |
|
|
|
|
} |
|
|
|
|
if ((rect[2] - rect[0]) < ANNOT_MIN_SIZE) { |
|
|
|
|
rect[2] = rect[0] + (rect[3] - rect[1]); // make it square
|
|
|
|
|
/** |
|
|
|
|
* Bind internal links to the link element. |
|
|
|
|
* |
|
|
|
|
* @private |
|
|
|
|
* @param {Object} link |
|
|
|
|
* @param {Object} destination |
|
|
|
|
* @memberof LinkAnnotationElement |
|
|
|
|
*/ |
|
|
|
|
_bindLink: function LinkAnnotationElement_bindLink(link, destination) { |
|
|
|
|
var self = this; |
|
|
|
|
|
|
|
|
|
link.href = this.linkService.getDestinationHash(destination); |
|
|
|
|
link.onclick = function() { |
|
|
|
|
if (destination) { |
|
|
|
|
self.linkService.navigateTo(destination); |
|
|
|
|
} |
|
|
|
|
return false; |
|
|
|
|
}; |
|
|
|
|
if (destination) { |
|
|
|
|
link.className = 'internalLink'; |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
/** |
|
|
|
|
* Bind named actions to the link element. |
|
|
|
|
* |
|
|
|
|
* @private |
|
|
|
|
* @param {Object} link |
|
|
|
|
* @param {Object} action |
|
|
|
|
* @memberof LinkAnnotationElement |
|
|
|
|
*/ |
|
|
|
|
_bindNamedAction: |
|
|
|
|
function LinkAnnotationElement_bindNamedAction(link, action) { |
|
|
|
|
var self = this; |
|
|
|
|
|
|
|
|
|
link.href = this.linkService.getAnchorUrl(''); |
|
|
|
|
link.onclick = function() { |
|
|
|
|
self.linkService.executeNamedAction(action); |
|
|
|
|
return false; |
|
|
|
|
}; |
|
|
|
|
link.className = 'internalLink'; |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
var container = getContainer(item, page, viewport); |
|
|
|
|
container.className = 'annotText'; |
|
|
|
|
return LinkAnnotationElement; |
|
|
|
|
})(); |
|
|
|
|
|
|
|
|
|
var image = document.createElement('img'); |
|
|
|
|
image.style.height = container.style.height; |
|
|
|
|
image.style.width = container.style.width; |
|
|
|
|
var iconName = item.name; |
|
|
|
|
image.src = PDFJS.imageResourcesPath + 'annotation-' + |
|
|
|
|
iconName.toLowerCase() + '.svg'; |
|
|
|
|
image.alt = '[{{type}} Annotation]'; |
|
|
|
|
image.dataset.l10nId = 'text_annotation_type'; |
|
|
|
|
image.dataset.l10nArgs = JSON.stringify({type: iconName}); |
|
|
|
|
/** |
|
|
|
|
* @class |
|
|
|
|
* @alias TextAnnotationElement |
|
|
|
|
*/ |
|
|
|
|
var TextAnnotationElement = (function TextAnnotationElementClosure() { |
|
|
|
|
function TextAnnotationElement(parameters) { |
|
|
|
|
AnnotationElement.call(this, parameters); |
|
|
|
|
|
|
|
|
|
var contentWrapper = document.createElement('div'); |
|
|
|
|
contentWrapper.className = 'annotTextContentWrapper'; |
|
|
|
|
contentWrapper.style.left = Math.floor(rect[2] - rect[0] + 5) + 'px'; |
|
|
|
|
contentWrapper.style.top = '-10px'; |
|
|
|
|
this.pinned = false; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
var content = document.createElement('div'); |
|
|
|
|
content.className = 'annotTextContent'; |
|
|
|
|
content.setAttribute('hidden', true); |
|
|
|
|
Util.inherit(TextAnnotationElement, AnnotationElement, { |
|
|
|
|
/** |
|
|
|
|
* Render the text annotation's HTML element in the empty container. |
|
|
|
|
* |
|
|
|
|
* @public |
|
|
|
|
* @memberof TextAnnotationElement |
|
|
|
|
* @returns {HTMLSectionElement} |
|
|
|
|
*/ |
|
|
|
|
render: function TextAnnotationElement_render() { |
|
|
|
|
var rect = this.data.rect, container = this.container; |
|
|
|
|
|
|
|
|
|
var i, ii; |
|
|
|
|
if (item.hasBgColor && item.color) { |
|
|
|
|
var color = item.color; |
|
|
|
|
// Sanity check because of OOo-generated PDFs.
|
|
|
|
|
if ((rect[3] - rect[1]) < ANNOT_MIN_SIZE) { |
|
|
|
|
rect[3] = rect[1] + ANNOT_MIN_SIZE; |
|
|
|
|
} |
|
|
|
|
if ((rect[2] - rect[0]) < ANNOT_MIN_SIZE) { |
|
|
|
|
rect[2] = rect[0] + (rect[3] - rect[1]); // make it square
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// Enlighten the color (70%)
|
|
|
|
|
var BACKGROUND_ENLIGHT = 0.7; |
|
|
|
|
var r = BACKGROUND_ENLIGHT * (255 - color[0]) + color[0]; |
|
|
|
|
var g = BACKGROUND_ENLIGHT * (255 - color[1]) + color[1]; |
|
|
|
|
var b = BACKGROUND_ENLIGHT * (255 - color[2]) + color[2]; |
|
|
|
|
content.style.backgroundColor = Util.makeCssRgb(r | 0, g | 0, b | 0); |
|
|
|
|
} |
|
|
|
|
container.className = 'annotText'; |
|
|
|
|
|
|
|
|
|
var title = document.createElement('h1'); |
|
|
|
|
var text = document.createElement('p'); |
|
|
|
|
title.textContent = item.title; |
|
|
|
|
var image = document.createElement('img'); |
|
|
|
|
image.style.height = container.style.height; |
|
|
|
|
image.style.width = container.style.width; |
|
|
|
|
var iconName = this.data.name; |
|
|
|
|
image.src = PDFJS.imageResourcesPath + 'annotation-' + |
|
|
|
|
iconName.toLowerCase() + '.svg'; |
|
|
|
|
image.alt = '[{{type}} Annotation]'; |
|
|
|
|
image.dataset.l10nId = 'text_annotation_type'; |
|
|
|
|
image.dataset.l10nArgs = JSON.stringify({type: iconName}); |
|
|
|
|
|
|
|
|
|
if (!item.content && !item.title) { |
|
|
|
|
var contentWrapper = document.createElement('div'); |
|
|
|
|
contentWrapper.className = 'annotTextContentWrapper'; |
|
|
|
|
contentWrapper.style.left = Math.floor(rect[2] - rect[0] + 5) + 'px'; |
|
|
|
|
contentWrapper.style.top = '-10px'; |
|
|
|
|
|
|
|
|
|
var content = this.content = document.createElement('div'); |
|
|
|
|
content.className = 'annotTextContent'; |
|
|
|
|
content.setAttribute('hidden', true); |
|
|
|
|
} else { |
|
|
|
|
var e = document.createElement('span'); |
|
|
|
|
var lines = item.content.split(/(?:\r\n?|\n)/); |
|
|
|
|
for (i = 0, ii = lines.length; i < ii; ++i) { |
|
|
|
|
var line = lines[i]; |
|
|
|
|
e.appendChild(document.createTextNode(line)); |
|
|
|
|
if (i < (ii - 1)) { |
|
|
|
|
e.appendChild(document.createElement('br')); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
text.appendChild(e); |
|
|
|
|
|
|
|
|
|
var pinned = false; |
|
|
|
|
var i, ii; |
|
|
|
|
if (this.data.hasBgColor && this.data.color) { |
|
|
|
|
var color = this.data.color; |
|
|
|
|
|
|
|
|
|
var showAnnotation = function showAnnotation(pin) { |
|
|
|
|
if (pin) { |
|
|
|
|
pinned = true; |
|
|
|
|
} |
|
|
|
|
if (content.hasAttribute('hidden')) { |
|
|
|
|
container.style.zIndex += 1; |
|
|
|
|
content.removeAttribute('hidden'); |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
// Enlighten the color (70%).
|
|
|
|
|
var BACKGROUND_ENLIGHT = 0.7; |
|
|
|
|
var r = BACKGROUND_ENLIGHT * (255 - color[0]) + color[0]; |
|
|
|
|
var g = BACKGROUND_ENLIGHT * (255 - color[1]) + color[1]; |
|
|
|
|
var b = BACKGROUND_ENLIGHT * (255 - color[2]) + color[2]; |
|
|
|
|
content.style.backgroundColor = Util.makeCssRgb(r | 0, g | 0, b | 0); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
var hideAnnotation = function hideAnnotation(unpin) { |
|
|
|
|
if (unpin) { |
|
|
|
|
pinned = false; |
|
|
|
|
} |
|
|
|
|
if (!content.hasAttribute('hidden') && !pinned) { |
|
|
|
|
container.style.zIndex -= 1; |
|
|
|
|
content.setAttribute('hidden', true); |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
var title = document.createElement('h1'); |
|
|
|
|
var text = document.createElement('p'); |
|
|
|
|
title.textContent = this.data.title; |
|
|
|
|
|
|
|
|
|
var toggleAnnotation = function toggleAnnotation() { |
|
|
|
|
if (pinned) { |
|
|
|
|
hideAnnotation(true); |
|
|
|
|
} else { |
|
|
|
|
showAnnotation(true); |
|
|
|
|
if (!this.data.content && !this.data.title) { |
|
|
|
|
content.setAttribute('hidden', true); |
|
|
|
|
} else { |
|
|
|
|
var e = document.createElement('span'); |
|
|
|
|
var lines = this.data.content.split(/(?:\r\n?|\n)/); |
|
|
|
|
for (i = 0, ii = lines.length; i < ii; ++i) { |
|
|
|
|
var line = lines[i]; |
|
|
|
|
e.appendChild(document.createTextNode(line)); |
|
|
|
|
if (i < (ii - 1)) { |
|
|
|
|
e.appendChild(document.createElement('br')); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
text.appendChild(e); |
|
|
|
|
|
|
|
|
|
image.addEventListener('click', function image_clickHandler() { |
|
|
|
|
toggleAnnotation(); |
|
|
|
|
}, false); |
|
|
|
|
image.addEventListener('mouseover', function image_mouseOverHandler() { |
|
|
|
|
showAnnotation(); |
|
|
|
|
}, false); |
|
|
|
|
image.addEventListener('mouseout', function image_mouseOutHandler() { |
|
|
|
|
hideAnnotation(); |
|
|
|
|
}, false); |
|
|
|
|
image.addEventListener('click', this._toggle.bind(this)); |
|
|
|
|
image.addEventListener('mouseover', this._show.bind(this, false)); |
|
|
|
|
image.addEventListener('mouseout', this._hide.bind(this, false)); |
|
|
|
|
content.addEventListener('click', this._hide.bind(this, true)); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
content.addEventListener('click', function content_clickHandler() { |
|
|
|
|
hideAnnotation(true); |
|
|
|
|
}, false); |
|
|
|
|
} |
|
|
|
|
content.appendChild(title); |
|
|
|
|
content.appendChild(text); |
|
|
|
|
contentWrapper.appendChild(content); |
|
|
|
|
container.appendChild(image); |
|
|
|
|
container.appendChild(contentWrapper); |
|
|
|
|
return container; |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
content.appendChild(title); |
|
|
|
|
content.appendChild(text); |
|
|
|
|
contentWrapper.appendChild(content); |
|
|
|
|
container.appendChild(image); |
|
|
|
|
container.appendChild(contentWrapper); |
|
|
|
|
/** |
|
|
|
|
* Toggle the visibility of the content box. |
|
|
|
|
* |
|
|
|
|
* @private |
|
|
|
|
* @memberof TextAnnotationElement |
|
|
|
|
*/ |
|
|
|
|
_toggle: function TextAnnotationElement_toggle() { |
|
|
|
|
if (this.pinned) { |
|
|
|
|
this._hide(true); |
|
|
|
|
} else { |
|
|
|
|
this._show(true); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
return container; |
|
|
|
|
} |
|
|
|
|
/** |
|
|
|
|
* Show the content box. |
|
|
|
|
* |
|
|
|
|
* @private |
|
|
|
|
* @param {boolean} pin |
|
|
|
|
* @memberof TextAnnotationElement |
|
|
|
|
*/ |
|
|
|
|
_show: function TextAnnotationElement_show(pin) { |
|
|
|
|
if (pin) { |
|
|
|
|
this.pinned = true; |
|
|
|
|
} |
|
|
|
|
if (this.content.hasAttribute('hidden')) { |
|
|
|
|
this.container.style.zIndex += 1; |
|
|
|
|
this.content.removeAttribute('hidden'); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
function getHtmlElementForLinkAnnotation(item, page, viewport, linkService) { |
|
|
|
|
function bindLink(link, dest) { |
|
|
|
|
link.href = linkService.getDestinationHash(dest); |
|
|
|
|
link.onclick = function annotationsLayerBuilderLinksOnclick() { |
|
|
|
|
if (dest) { |
|
|
|
|
linkService.navigateTo(dest); |
|
|
|
|
} |
|
|
|
|
return false; |
|
|
|
|
}; |
|
|
|
|
if (dest) { |
|
|
|
|
link.className = 'internalLink'; |
|
|
|
|
/** |
|
|
|
|
* Hide the content box. |
|
|
|
|
* |
|
|
|
|
* @private |
|
|
|
|
* @param {boolean} unpin |
|
|
|
|
* @memberof TextAnnotationElement |
|
|
|
|
*/ |
|
|
|
|
_hide: function TextAnnotationElement_hide(unpin) { |
|
|
|
|
if (unpin) { |
|
|
|
|
this.pinned = false; |
|
|
|
|
} |
|
|
|
|
if (!this.content.hasAttribute('hidden') && !this.pinned) { |
|
|
|
|
this.container.style.zIndex -= 1; |
|
|
|
|
this.content.setAttribute('hidden', true); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
function bindNamedAction(link, action) { |
|
|
|
|
link.href = linkService.getAnchorUrl(''); |
|
|
|
|
link.onclick = function annotationsLayerBuilderNamedActionOnClick() { |
|
|
|
|
linkService.executeNamedAction(action); |
|
|
|
|
return false; |
|
|
|
|
}; |
|
|
|
|
link.className = 'internalLink'; |
|
|
|
|
} |
|
|
|
|
return TextAnnotationElement; |
|
|
|
|
})(); |
|
|
|
|
|
|
|
|
|
var container = getContainer(item, page, viewport); |
|
|
|
|
container.className = 'annotLink'; |
|
|
|
|
/** |
|
|
|
|
* @class |
|
|
|
|
* @alias WidgetAnnotationElement |
|
|
|
|
*/ |
|
|
|
|
var WidgetAnnotationElement = (function WidgetAnnotationElementClosure() { |
|
|
|
|
function WidgetAnnotationElement(parameters) { |
|
|
|
|
AnnotationElement.call(this, parameters); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
var link = document.createElement('a'); |
|
|
|
|
link.href = link.title = item.url || ''; |
|
|
|
|
Util.inherit(WidgetAnnotationElement, AnnotationElement, { |
|
|
|
|
/** |
|
|
|
|
* Render the widget annotation's HTML element in the empty container. |
|
|
|
|
* |
|
|
|
|
* @public |
|
|
|
|
* @memberof WidgetAnnotationElement |
|
|
|
|
* @returns {HTMLSectionElement} |
|
|
|
|
*/ |
|
|
|
|
render: function WidgetAnnotationElement_render() { |
|
|
|
|
var content = document.createElement('div'); |
|
|
|
|
content.textContent = this.data.fieldValue; |
|
|
|
|
var textAlignment = this.data.textAlignment; |
|
|
|
|
content.style.textAlign = ['left', 'center', 'right'][textAlignment]; |
|
|
|
|
content.style.verticalAlign = 'middle'; |
|
|
|
|
content.style.display = 'table-cell'; |
|
|
|
|
|
|
|
|
|
if (item.url && isExternalLinkTargetSet()) { |
|
|
|
|
link.target = LinkTargetStringMap[PDFJS.externalLinkTarget]; |
|
|
|
|
} |
|
|
|
|
var font = (this.data.fontRefName ? |
|
|
|
|
this.page.commonObjs.getData(this.data.fontRefName) : null); |
|
|
|
|
this._setTextStyle(content, font); |
|
|
|
|
|
|
|
|
|
// Strip referrer
|
|
|
|
|
if (item.url) { |
|
|
|
|
link.rel = PDFJS.externalLinkRel; |
|
|
|
|
} |
|
|
|
|
this.container.appendChild(content); |
|
|
|
|
return this.container; |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
if (!item.url) { |
|
|
|
|
if (item.action) { |
|
|
|
|
bindNamedAction(link, item.action); |
|
|
|
|
} else { |
|
|
|
|
bindLink(link, ('dest' in item) ? item.dest : null); |
|
|
|
|
/** |
|
|
|
|
* Apply text styles to the text in the element. |
|
|
|
|
* |
|
|
|
|
* @private |
|
|
|
|
* @param {HTMLDivElement} element |
|
|
|
|
* @param {Object} font |
|
|
|
|
* @memberof WidgetAnnotationElement |
|
|
|
|
*/ |
|
|
|
|
_setTextStyle: |
|
|
|
|
function WidgetAnnotationElement_setTextStyle(element, font) { |
|
|
|
|
// TODO: This duplicates some of the logic in CanvasGraphics.setFont().
|
|
|
|
|
var style = element.style; |
|
|
|
|
style.fontSize = this.data.fontSize + 'px'; |
|
|
|
|
style.direction = (this.data.fontDirection < 0 ? 'rtl': 'ltr'); |
|
|
|
|
|
|
|
|
|
if (!font) { |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
style.fontWeight = (font.black ? |
|
|
|
|
(font.bold ? '900' : 'bold') : |
|
|
|
|
(font.bold ? 'bold' : 'normal')); |
|
|
|
|
style.fontStyle = (font.italic ? 'italic' : 'normal'); |
|
|
|
|
|
|
|
|
|
// Use a reasonable default font if the font doesn't specify a fallback.
|
|
|
|
|
var fontFamily = font.loadedName ? '"' + font.loadedName + '", ' : ''; |
|
|
|
|
var fallbackName = font.fallbackName || 'Helvetica, sans-serif'; |
|
|
|
|
style.fontFamily = fontFamily + fallbackName; |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
container.appendChild(link); |
|
|
|
|
return WidgetAnnotationElement; |
|
|
|
|
})(); |
|
|
|
|
|
|
|
|
|
return container; |
|
|
|
|
} |
|
|
|
|
/** |
|
|
|
|
* @typedef {Object} AnnotationLayerParameters |
|
|
|
|
* @property {PageViewport} viewport |
|
|
|
|
* @property {HTMLDivElement} div |
|
|
|
|
* @property {Array} annotations |
|
|
|
|
* @property {PDFPage} page |
|
|
|
|
* @property {IPDFLinkService} linkService |
|
|
|
|
*/ |
|
|
|
|
|
|
|
|
|
function getHtmlElement(data, page, viewport, linkService) { |
|
|
|
|
switch (data.annotationType) { |
|
|
|
|
case AnnotationType.WIDGET: |
|
|
|
|
return getHtmlElementForTextWidgetAnnotation(data, page, viewport); |
|
|
|
|
case AnnotationType.TEXT: |
|
|
|
|
return getHtmlElementForTextAnnotation(data, page, viewport); |
|
|
|
|
case AnnotationType.LINK: |
|
|
|
|
return getHtmlElementForLinkAnnotation(data, page, viewport, |
|
|
|
|
linkService); |
|
|
|
|
default: |
|
|
|
|
throw new Error('Unsupported annotationType: ' + data.annotationType); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
/** |
|
|
|
|
* @class |
|
|
|
|
* @alias AnnotationLayer |
|
|
|
|
*/ |
|
|
|
|
var AnnotationLayer = (function AnnotationLayerClosure() { |
|
|
|
|
return { |
|
|
|
|
/** |
|
|
|
|
* Render a new annotation layer with all annotation elements. |
|
|
|
|
* |
|
|
|
|
* @public |
|
|
|
|
* @param {AnnotationLayerParameters} parameters |
|
|
|
|
* @memberof AnnotationLayer |
|
|
|
|
*/ |
|
|
|
|
render: function AnnotationLayer_render(parameters) { |
|
|
|
|
var annotationElementFactory = new AnnotationElementFactory(); |
|
|
|
|
|
|
|
|
|
function render(viewport, div, annotations, page, linkService) { |
|
|
|
|
for (var i = 0, ii = annotations.length; i < ii; i++) { |
|
|
|
|
var data = annotations[i]; |
|
|
|
|
if (!data || !data.hasHtml) { |
|
|
|
|
continue; |
|
|
|
|
} |
|
|
|
|
for (var i = 0, ii = parameters.annotations.length; i < ii; i++) { |
|
|
|
|
var data = parameters.annotations[i]; |
|
|
|
|
if (!data || !data.hasHtml) { |
|
|
|
|
continue; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
var element = getHtmlElement(data, page, viewport, linkService); |
|
|
|
|
div.appendChild(element); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
var properties = { |
|
|
|
|
data: data, |
|
|
|
|
page: parameters.page, |
|
|
|
|
viewport: parameters.viewport, |
|
|
|
|
linkService: parameters.linkService |
|
|
|
|
}; |
|
|
|
|
var element = annotationElementFactory.create(properties); |
|
|
|
|
parameters.div.appendChild(element.render()); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
function update(viewport, div, annotations) { |
|
|
|
|
for (var i = 0, ii = annotations.length; i < ii; i++) { |
|
|
|
|
var data = annotations[i]; |
|
|
|
|
var element = div.querySelector( |
|
|
|
|
'[data-annotation-id="' + data.id + '"]'); |
|
|
|
|
if (element) { |
|
|
|
|
CustomStyle.setProp('transform', element, |
|
|
|
|
'matrix(' + viewport.transform.join(',') + ')'); |
|
|
|
|
/** |
|
|
|
|
* Update the annotation elements on existing annotation layer. |
|
|
|
|
* |
|
|
|
|
* @public |
|
|
|
|
* @param {AnnotationLayerParameters} parameters |
|
|
|
|
* @memberof AnnotationLayer |
|
|
|
|
*/ |
|
|
|
|
update: function AnnotationLayer_update(parameters) { |
|
|
|
|
for (var i = 0, ii = parameters.annotations.length; i < ii; i++) { |
|
|
|
|
var data = parameters.annotations[i]; |
|
|
|
|
var element = parameters.div.querySelector( |
|
|
|
|
'[data-annotation-id="' + data.id + '"]'); |
|
|
|
|
if (element) { |
|
|
|
|
CustomStyle.setProp('transform', element, |
|
|
|
|
'matrix(' + parameters.viewport.transform.join(',') + ')'); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
parameters.div.removeAttribute('hidden'); |
|
|
|
|
} |
|
|
|
|
div.removeAttribute('hidden'); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
return { |
|
|
|
|
render: render, |
|
|
|
|
update: update |
|
|
|
|
}; |
|
|
|
|
})(); |
|
|
|
|
|
|
|
|
|
PDFJS.AnnotationLayer = AnnotationLayer; |
|
|
|
|
|
|
|
|
|
exports.AnnotationLayer = AnnotationLayer; |
|
|
|
|