UNPKG

@syncfusion/ej2-pdfviewer

Version:
1,008 lines 263 kB
import { LineTool } from '../index'; import { ZOrderPageTable, PdfAnnotationBase, PdfFormFieldBase } from './pdf-annotation'; import { Rect, Point, identityMatrix, rotateMatrix, getDiagramElement, ThumbsConstraints, scaleMatrix, cornersPointsBeforeRotation, ImageElement } from '@syncfusion/ej2-drawings'; import { DrawingElement } from '@syncfusion/ej2-drawings'; import { PathElement } from '@syncfusion/ej2-drawings'; import { createMeasureElements } from '@syncfusion/ej2-drawings'; import { randomId } from '@syncfusion/ej2-drawings'; import { Size, transformPointByMatrix, RotateTransform, TextElement } from '@syncfusion/ej2-drawings'; import { Canvas, refreshDiagramElements, DrawingRenderer } from '@syncfusion/ej2-drawings'; import { Selector } from './selector'; import { SvgRenderer } from '@syncfusion/ej2-drawings'; import { isLineShapes, setElementStype, findPointsLength, getBaseShapeAttributes, isLeader, cloneObject } from './drawing-util'; import { getConnectorPoints, updateSegmentElement, getSegmentElement, updateDecoratorElement, getDecoratorElement, clipDecorators, initDistanceLabel, initLeaders, initLeader, getPolygonPath, initPerimeterLabel } from './connector-util'; import { isNullOrUndefined, isBlazor, Browser } from '@syncfusion/ej2-base'; import { DiagramHtmlElement } from './html-element'; /** * Renderer module is used to render basic diagram elements * * @hidden */ var Drawing = /** @class */ (function () { function Drawing(viewer) { this.isDynamicStamps = false; /** * @private */ this.copiedElementID = ''; /** * @private */ this.isPasted = false; this.pdfViewer = viewer; this.renderer = new DrawingRenderer('this.pdfViewer.element.id', false); this.svgRenderer = new SvgRenderer(); } /** * @private * @param {PdfViewer} viewer - Specified the pdfViewer element. * @returns {void} */ Drawing.prototype.renderLabels = function (viewer) { var annotations = viewer.annotations; if (annotations) { for (var i = 0; i < annotations.length; i++) { var annotation = annotations[parseInt(i.toString(), 10)]; this.initObject(annotation); } } }; Drawing.prototype.createNewZindexTable = function (pageId) { var zIndexTable = new ZOrderPageTable(); this.pdfViewer.zIndex++; zIndexTable.pageId = this.pdfViewer.zIndex; this.pdfViewer.zIndexTable.push(zIndexTable); return zIndexTable; }; /** * @private * @param {number} pageId - Specified the page Id. * @returns {ZOrderPageTable} - Returns the ZOrder page table. */ Drawing.prototype.getPageTable = function (pageId) { var zIndexTable; if (this.pdfViewer.zIndexTable.length !== undefined) { var notFound = true; for (var i = 0; i < this.pdfViewer.zIndexTable.length; i++) { if (this.pdfViewer.zIndexTable[parseInt(i.toString(), 10)].pageId === pageId) { notFound = false; zIndexTable = this.pdfViewer.zIndexTable[parseInt(i.toString(), 10)]; break; } } if (notFound) { zIndexTable = this.createNewZindexTable(pageId); zIndexTable.pageId = pageId; } } else { zIndexTable = this.createNewZindexTable(pageId); } return zIndexTable; }; /** * @private * @param {number} index - Specified the page index value. * @param {PdfAnnotationBaseModel} obj - Specified the annotation object. * @returns {void} */ Drawing.prototype.setZIndex = function (index, obj) { if (obj.pageIndex !== undefined) { var pageTable = this.getPageTable(obj.pageIndex); var ispageobject = false; if (obj.shapeAnnotationType !== 'Polygon') { for (var i = 0; i < pageTable.objects.length; i++) { if (obj.id === pageTable.objects[parseInt(i.toString(), 10)].id) { pageTable.objects.splice(parseInt(i.toString(), 10), 1); pageTable.objects.splice(parseInt(i.toString(), 10), 0, obj); ispageobject = true; break; } } } if (!ispageobject) { if (obj.zIndex === -1) { pageTable.zIndex++; obj.zIndex = pageTable.zIndex; pageTable.objects.push(obj); } else { var tabelLength = pageTable.objects.length; obj.zIndex = tabelLength++; pageTable.objects.push(obj); } } } }; /** * @private * @param {PdfAnnotationBaseModel | PdfFormFieldBaseModel} obj - Specified the annotation object. * @returns {PdfAnnotationBaseModel | PdfFormFieldBaseModel} - Returns the annotaion or form fields model. */ Drawing.prototype.initObject = function (obj) { //Move the common properties like zindex and id to an abstract class this.setZIndex(this.pdfViewer.zIndex, obj); createMeasureElements(); if (!isLineShapes(obj)) { this.initNode(obj); } else { this.initLine(obj); obj.wrapper.measure(new Size(undefined, undefined)); obj.wrapper.arrange(obj.wrapper.desiredSize); } if (obj.wrapper === null) { //Init default wrapper } this.pdfViewer.nameTable[obj.id] = obj; if (obj.formFieldAnnotationType) { this.nodePropertyChange(obj, { bounds: { width: obj.bounds.width, height: obj.bounds.height } }); } //Add some methodologies to add the children of group to name table return obj; }; /** * @private * @param {PdfAnnotationBaseModel} obj - Specified the annotation object. * @returns {void} */ Drawing.prototype.initNode = function (obj) { var canvas = this.initContainer(obj); var content; if (!canvas.children) { canvas.children = []; } if (!content) { content = this.init(obj, canvas); } //canvas.children.push(content); canvas.rotateAngle = obj.rotateAngle; canvas.measure(new Size(obj.wrapper.width, obj.wrapper.height)); canvas.arrange(canvas.desiredSize); if (this.isDynamicStamps) { this.pdfViewer.annotation.stampAnnotationModule.updateSessionStorage(obj, null, 'dynamicStamp'); this.isDynamicStamps = false; } }; /** * Allows to initialize the UI of a node */ /** * @private * @param {PdfAnnotationBaseModel | PdfFormFieldBaseModel} obj - Specified the annotation object. * @param {Container} canvas - Specified the canvas element. * @returns {DrawingElement} - Returns the drawing element. */ Drawing.prototype.init = function (obj, canvas) { var content; content = new DrawingElement(); var pathContent; var basicElement; var isStamp = false; var annotationSettings = this.pdfViewer.annotationModule ? this.pdfViewer.annotationModule.findAnnotationSettings(obj) : {}; var annotationMaxHeight = 0; var annotationMaxWidth = 0; var annotationMinHeight = 0; var annotationMinWidth = 0; if (annotationSettings.minWidth || annotationSettings.maxWidth || annotationSettings.minHeight || annotationSettings.maxHeight) { annotationMaxHeight = annotationSettings.maxHeight ? annotationSettings.maxHeight : 2000; annotationMaxWidth = annotationSettings.maxWidth ? annotationSettings.maxWidth : 2000; annotationMinHeight = annotationSettings.minHeight ? annotationSettings.minHeight : 0; annotationMinWidth = annotationSettings.minWidth ? annotationSettings.minWidth : 0; } var isAnnotationSet = false; if (annotationMinHeight || annotationMinWidth || annotationMaxHeight || annotationMaxWidth) { isAnnotationSet = true; } if (obj.formFieldAnnotationType) { content = this.initFormFields(obj, content, canvas); } else { content = this.initAnnotationObject(obj, pathContent, content, canvas, isStamp, basicElement, isAnnotationSet, annotationMaxHeight, annotationMaxWidth, annotationMinWidth, annotationMinHeight); } content.id = obj.id + '_content'; content.relativeMode = 'Object'; if (obj.shapeAnnotationType !== 'Stamp') { if (obj.bounds.width !== undefined) { content.width = obj.bounds.width; if (isAnnotationSet) { if ((content.width < annotationMinWidth) || (content.width > annotationMaxWidth)) { if (content.width < annotationMinWidth) { content.width = annotationMinWidth; } if (content.width > annotationMaxWidth) { content.width = annotationMaxWidth; } } } } content.horizontalAlignment = 'Stretch'; if (obj.bounds.height !== undefined) { content.height = obj.bounds.height; if (isAnnotationSet) { if ((content.height < annotationMinHeight) || (content.width > annotationMaxHeight)) { if (content.height < annotationMinHeight) { content.height = annotationMinHeight; } if (content.height > annotationMaxHeight) { content.height = annotationMaxHeight; } } } } setElementStype(obj, content); if (this.pdfViewer.viewerBase.drawSignatureWithTool && obj.shapeAnnotationType === 'SignatureText') { content.style.strokeWidth = 0; } } content.isRectElement = true; content.verticalAlignment = 'Stretch'; return content; }; Drawing.prototype.initFormFields = function (obj, content, canvas) { switch (obj.formFieldAnnotationType) { case 'Textbox': case 'PasswordField': case 'Checkbox': case 'RadioButton': case 'DropdownList': case 'ListBox': case 'SignatureField': case 'InitialField': { var htmlContent = new DiagramHtmlElement(); content = htmlContent; content.id = obj.id + '_content'; canvas.children.push(content); break; } } return content; }; Drawing.prototype.initAnnotationObject = function (obj, pathContent, content, canvas, isStamp, basicElement, isAnnotationSet, annotationMaxHeight, annotationMaxWidth, annotationMinWidth, annotationMinHeight) { switch (obj.shapeAnnotationType) { case 'Ellipse': pathContent = new PathElement(); pathContent.data = 'M80.5,12.5 C80.5,19.127417 62.59139,24.5 40.5,24.5 C18.40861,24.5 0.5,19.127417 0.5,12.5' + 'C0.5,5.872583 18.40861,0.5 40.5,0.5 C62.59139,0.5 80.5,5.872583 80.5,12.5 z'; content = pathContent; canvas.children.push(content); if (obj.enableShapeLabel) { var textLabel = this.textElement(obj); textLabel.content = obj.labelContent; textLabel.style.color = obj.fontColor; textLabel.style.strokeColor = obj.labelBorderColor; textLabel.style.fill = obj.labelFillColor; textLabel.style.fontSize = obj.fontSize; textLabel.style.fontFamily = obj.fontFamily; textLabel.style.opacity = obj.labelOpacity; canvas.children.push(textLabel); } break; case 'Path': pathContent = new PathElement(); pathContent.data = obj.data; content = pathContent; canvas.children.push(content); break; case 'HandWrittenSignature': case 'Ink': pathContent = new PathElement(); pathContent.data = obj.data; pathContent.style.strokeColor = obj.strokeColor; pathContent.style.strokeWidth = obj.thickness; pathContent.style.opacity = obj.opacity; content = pathContent; canvas.children.push(content); break; case 'Polygon': pathContent = new PathElement(); pathContent.data = getPolygonPath(obj.vertexPoints); content = pathContent; canvas.children.push(content); break; case 'Stamp': isStamp = true; this.isDynamicStamps = true; if (obj && obj.annotationAddMode && (obj.annotationAddMode === 'Existing Annotation' || obj.annotationAddMode === 'Imported Annotation')) { obj.bounds.width = obj.bounds.width - 20; obj.bounds.height = obj.bounds.height - 20; } if (obj.isDynamicStamp) { canvas.horizontalAlignment = 'Left'; basicElement = new DrawingElement(); content = basicElement; content.cornerRadius = 10; content.style.fill = obj.stampFillColor; content.style.strokeColor = obj.stampStrokeColor; canvas.children.push(content); var textele = this.textElement(obj); textele = new TextElement(); textele.style.fontFamily = 'Helvetica'; textele.style.fontSize = 14; textele.style.italic = true; textele.style.bold = true; textele.style.color = obj.fillColor; textele.rotateValue = undefined; textele.content = obj.dynamicText; textele.relativeMode = 'Point'; textele.margin.left = 10; textele.margin.bottom = -7; textele.setOffsetWithRespectToBounds(0, 0.57, null); textele.relativeMode = 'Point'; if (obj.annotationAddMode === 'Existing Annotation' || obj.annotationAddMode === 'Imported Annotation') { textele.style.fontSize = this.fontSizeCalculation(obj, textele, obj.bounds.width - 10); } canvas.children.push(textele); var pathContent1 = new PathElement(); pathContent1.id = randomId() + '_stamp'; pathContent1.data = obj.data; pathContent1.width = obj.bounds.width; if (isAnnotationSet && (obj.bounds.width > annotationMaxWidth)) { pathContent1.width = annotationMaxWidth; obj.bounds.width = annotationMaxWidth; } pathContent1.height = obj.bounds.height / 2; if (isAnnotationSet && (obj.bounds.height > annotationMaxHeight)) { pathContent1.height = annotationMaxHeight / 2; obj.bounds.height = annotationMaxHeight / 2; } pathContent1.rotateValue = undefined; pathContent1.margin.left = 10; pathContent1.margin.bottom = -5; pathContent1.relativeMode = 'Point'; pathContent1.setOffsetWithRespectToBounds(0, 0.1, null); var content1 = pathContent1; pathContent1.style.fill = obj.fillColor; pathContent1.style.strokeColor = obj.strokeColor; pathContent1.style.opacity = obj.opacity; content.width = obj.bounds.width + 20; content.height = obj.bounds.height + 20; content.style.opacity = obj.opacity; canvas.children.push(content1); } else { canvas.horizontalAlignment = 'Left'; basicElement = new DrawingElement(); content = basicElement; content.cornerRadius = 10; content.style.fill = obj.stampFillColor; content.style.strokeColor = obj.stampStrokeColor; canvas.children.push(content); var pathContent1 = new PathElement(); pathContent1.id = randomId() + '_stamp'; pathContent1.data = obj.data; pathContent1.width = obj.bounds.width; if (isAnnotationSet && (obj.bounds.width > annotationMaxWidth)) { pathContent1.width = annotationMaxWidth; obj.bounds.width = annotationMaxWidth; } pathContent1.height = obj.bounds.height; if (isAnnotationSet && (obj.bounds.height > annotationMaxHeight)) { pathContent1.height = annotationMaxHeight; obj.bounds.height = annotationMaxHeight; } pathContent1.minWidth = pathContent1.width / 2; pathContent1.minHeight = pathContent1.height / 2; var content1 = pathContent1; pathContent1.style.fill = obj.fillColor; pathContent1.style.strokeColor = obj.strokeColor; pathContent1.style.opacity = obj.opacity; content.width = obj.bounds.width + 20; content.height = obj.bounds.height + 20; content.minWidth = pathContent1.width / 2; content.minHeight = pathContent1.height / 2; content.style.opacity = obj.opacity; canvas.children.push(content1); canvas.minHeight = content.minHeight + 20; canvas.minWidth = content.minWidth + 20; } break; case 'Image': case 'SignatureImage': { var pathContent11 = new ImageElement(); pathContent11.source = obj.data; content = pathContent11; content.style.strokeWidth = 0; canvas.children.push(content); break; } case 'Rectangle': basicElement = new DrawingElement(); content = basicElement; canvas.children.push(content); if (obj.enableShapeLabel) { var textLabel = this.textElement(obj); textLabel.content = obj.labelContent; textLabel.style.color = obj.fontColor; textLabel.style.strokeColor = obj.labelBorderColor; textLabel.style.fill = obj.labelFillColor; textLabel.style.fontSize = obj.fontSize; textLabel.style.fontFamily = obj.fontFamily; textLabel.style.opacity = obj.labelOpacity; canvas.children.push(textLabel); } break; case 'Perimeter': { pathContent = new PathElement(); pathContent.data = 'M80.5,12.5 C80.5,19.127417 62.59139,24.5 40.5,24.5 C18.40861,24.5 0.5,19.127417 0.5,12.5' + 'C0.5,5.872583 18.40861,0.5 40.5,0.5 C62.59139,0.5 80.5,5.872583 80.5,12.5 z'; content = pathContent; setElementStype(obj, pathContent); canvas.children.push(content); basicElement = new DrawingElement(); basicElement.id = 'perimeter_' + randomId(); basicElement.height = .2; basicElement.width = .2; basicElement.transform = RotateTransform.Self; basicElement.horizontalAlignment = 'Stretch'; this.setNodePosition(basicElement, obj); basicElement.rotateAngle = obj.rotateAngle; setElementStype(obj, basicElement); canvas.children.push(basicElement); var textele = this.textElement(obj); textele = new TextElement(); textele.content = textele.content = findPointsLength([ { x: obj.bounds.x, y: obj.bounds.y }, { x: obj.bounds.x + obj.bounds.width, y: obj.bounds.y + obj.bounds.height } ]).toString(); textele.rotateValue = { y: -10, angle: obj.rotateAngle }; canvas.children.push(textele); break; } case 'Radius': { pathContent = new PathElement(); pathContent.data = 'M80.5,12.5 C80.5,19.127417 62.59139,24.5 40.5,24.5 C18.40861,24.5 0.5,19.127417 0.5,12.5' + 'C0.5,5.872583 18.40861,0.5 40.5,0.5 C62.59139,0.5 80.5,5.872583 80.5,12.5 z'; content = pathContent; setElementStype(obj, pathContent); canvas.children.push(content); basicElement = new DrawingElement(); basicElement.id = 'radius_' + randomId(); basicElement.height = .2; basicElement.width = obj.bounds.width / 2; basicElement.transform = RotateTransform.Self; this.setNodePosition(basicElement, obj); basicElement.rotateAngle = obj.rotateAngle; setElementStype(obj, basicElement); canvas.children.push(basicElement); var radiusTextEle = this.textElement(obj); if (obj.enableShapeLabel) { radiusTextEle.style.color = obj.fontColor; radiusTextEle.style.strokeColor = obj.labelBorderColor; radiusTextEle.style.fill = obj.labelFillColor; radiusTextEle.style.fontSize = obj.fontSize; radiusTextEle.style.fontFamily = obj.fontFamily; radiusTextEle.style.opacity = obj.labelOpacity; } var length_1 = findPointsLength([ { x: obj.bounds.x, y: obj.bounds.y }, { x: obj.bounds.x + obj.bounds.width, y: obj.bounds.y + obj.bounds.height } ]); if (!this.pdfViewer.enableImportAnnotationMeasurement && obj.notes && obj.notes !== '') { radiusTextEle.content = obj.notes; } else { radiusTextEle.content = this.pdfViewer.annotation.measureAnnotationModule.setConversion((obj.bounds.width / 2) * this.pdfViewer.annotation.measureAnnotationModule.pixelToPointFactor, obj); } radiusTextEle.rotateValue = { y: -10, x: obj.bounds.width / 4, angle: obj.rotateAngle }; canvas.children.push(radiusTextEle); break; } case 'StickyNotes': { var pathContent2 = new ImageElement(); pathContent2.source = obj.data; pathContent2.width = obj.bounds.width; pathContent2.height = obj.bounds.height; pathContent2.style.strokeColor = obj.strokeColor; pathContent2.style.strokeWidth = 0; content = pathContent2; canvas.children.push(content); break; } case 'SignatureText': { var rectElements = new DrawingElement(); rectElements.style.strokeWidth = 0; content = rectElements; content.style.strokeWidth = 0; canvas.style.strokeWidth = 0; canvas.children.push(content); var signatureText = this.textElement(obj); signatureText.style.fontFamily = obj.fontFamily; signatureText.style.fontSize = obj.fontSize; signatureText.style.textAlign = 'Left'; signatureText.rotateValue = undefined; signatureText.content = obj.data; signatureText.style.strokeWidth = 0; canvas.children.push(signatureText); break; } case 'FreeText': { var rectElement = new DrawingElement(); content = rectElement; canvas.children.push(content); var freeTextEle = this.textElement(obj); freeTextEle = new TextElement(); freeTextEle.style.fontFamily = obj.fontFamily; freeTextEle.style.fontSize = obj.fontSize; freeTextEle.style.textAlign = 'Left'; if (obj.textAlign.toLowerCase() === 'center') { freeTextEle.style.textAlign = 'Center'; } else if (obj.textAlign.toLowerCase() === 'right') { freeTextEle.style.textAlign = 'Right'; } else if (obj.textAlign.toLowerCase() === 'justify') { freeTextEle.style.textAlign = 'Justify'; } freeTextEle.style.color = obj.fontColor; freeTextEle.style.bold = obj.font.isBold; freeTextEle.style.italic = obj.font.isItalic; if (obj.font.isUnderline === true) { freeTextEle.style.textDecoration = 'Underline'; } else if (obj.font.isStrikeout === true) { freeTextEle.style.textDecoration = 'LineThrough'; } freeTextEle.rotateValue = undefined; freeTextEle.content = obj.dynamicText; freeTextEle.style.opacity = obj.opacity; freeTextEle.margin.left = 4; freeTextEle.margin.right = 5; freeTextEle.margin.top = 5 * (obj.fontSize / 16); if (this.pdfViewer.freeTextSettings.enableAutoFit) { freeTextEle.style.textWrapping = 'Wrap'; } else { freeTextEle.style.textWrapping = 'WrapWithOverflow'; } freeTextEle.relativeMode = 'Point'; freeTextEle.setOffsetWithRespectToBounds(0, 0, null); freeTextEle.relativeMode = 'Point'; canvas.children.push(freeTextEle); break; } } content.id = obj.id + '_content'; content.relativeMode = 'Object'; if (!isStamp) { if (obj.bounds.width !== undefined) { content.width = obj.bounds.width; if (isAnnotationSet) { if ((content.width < annotationMinWidth) || (content.width > annotationMaxWidth)) { if (content.width < annotationMinWidth) { content.width = annotationMinWidth; } if (content.width > annotationMaxWidth) { content.width = annotationMaxWidth; } } } } content.horizontalAlignment = 'Stretch'; if (obj.bounds.height !== undefined) { content.height = obj.bounds.height; if (isAnnotationSet) { if ((content.height < annotationMinHeight) || (content.width > annotationMaxHeight)) { if (content.height < annotationMinHeight) { content.height = annotationMinHeight; } if (content.height > annotationMaxHeight) { content.height = annotationMaxHeight; } } } } setElementStype(obj, content); } content.isRectElement = true; content.verticalAlignment = 'Stretch'; return content; }; Drawing.prototype.textElement = function (obj) { var textele = new TextElement(); setElementStype(obj, textele); textele.horizontalAlignment = 'Center'; textele.verticalAlignment = obj.shapeAnnotationType === 'SignatureText' ? 'Center' : 'Top'; textele.relativeMode = 'Object'; textele.setOffsetWithRespectToBounds(.5, .5, 'Absolute'); return textele; }; /** * @private * @param {DrawingElement} obj - Specified the drawing element. * @param {PdfAnnotationBaseModel} node - Specified the node element. * @returns {void} */ Drawing.prototype.setNodePosition = function (obj, node) { if (node.shapeAnnotationType === 'Perimeter') { obj.offsetX = node.bounds.x + node.bounds.width / 2; obj.offsetY = node.bounds.y + node.bounds.height / 2; } else if (node.shapeAnnotationType === 'Radius') { var trasPoint = { x: node.bounds.x + (node.bounds.width / 2) + (node.bounds.width / 4), y: node.bounds.y + (node.bounds.height / 2) }; var center = { x: (node.bounds.x + (node.bounds.width / 2)), y: (node.bounds.y + (node.bounds.height / 2)) }; var matrix = identityMatrix(); rotateMatrix(matrix, node.rotateAngle, center.x, center.y); var rotatedPoint = transformPointByMatrix(matrix, trasPoint); var newPoint1 = { x: rotatedPoint.x, y: rotatedPoint.y }; obj.offsetX = newPoint1.x; obj.offsetY = newPoint1.y; obj.width = node.bounds.width / 2; } }; /** * @private * @param {PdfAnnotationBaseModel} obj - Specified the annotation object. * @returns {Container} - Returns the container element. */ Drawing.prototype.initContainer = function (obj) { if (!obj.id) { obj.id = randomId(); } // Creates canvas element var canvas = new Canvas(); canvas.id = obj.id; canvas.offsetX = obj.bounds.x + (obj.bounds.width * 0.5); canvas.offsetY = obj.bounds.y + (obj.bounds.height * 0.5); canvas.style.fill = 'transparent'; canvas.style.strokeColor = 'transparent'; canvas.rotateAngle = obj.rotateAngle; obj.wrapper = canvas; return canvas; }; /** * @private * @param {PdfAnnotationBaseModel} obj - Specified the annotation object. * @returns {Canvas} - Returns the canvas element. */ Drawing.prototype.initLine = function (obj) { if (!obj.id) { obj.id = randomId(); } var container = new Canvas(); var segment = new PathElement(); segment.id = obj.id + '_path'; var srcDecorator = new PathElement(); var targetDecorator = new PathElement(); if (obj.vertexPoints.length) { obj.sourcePoint = obj.vertexPoints[0]; obj.targetPoint = obj.vertexPoints[obj.vertexPoints.length - 1]; for (var i = 0; i < obj.vertexPoints.length; i++) { if (i !== 0 && i !== obj.vertexPoints.length - 1) { obj.segments.push(obj.vertexPoints[parseInt(i.toString(), 10)]); } } } segment = getSegmentElement(obj, segment); var points = []; points = getConnectorPoints(obj); // points = this.clipDecorators(this, points); var leaders = []; var labels = []; if (obj.shapeAnnotationType === 'Distance') { leaders = initLeaders(obj, points); labels = initDistanceLabel(obj, points, this.pdfViewer.annotation.measureAnnotationModule, this.pdfViewer); } if ((obj.shapeAnnotationType === 'Line' || obj.shapeAnnotationType === 'LineWidthArrowHead') && obj.measureType === 'Perimeter') { labels = initPerimeterLabel(obj, points, this.pdfViewer.annotation.measureAnnotationModule, this.pdfViewer); } if (obj.enableShapeLabel === true && !(obj.shapeAnnotationType === 'Distance') && !(obj.measureType === 'Perimeter')) { var angle = Point.findAngle(points[0], points[1]); var textele = this.textElement(obj); textele.id = randomId(); if (!this.pdfViewer.enableImportAnnotationMeasurement && obj.notes && obj.notes !== '') { textele.content = obj.notes; } else { textele.content = obj.labelContent; } textele.style.strokeColor = obj.labelBorderColor; textele.style.fill = obj.labelFillColor; textele.style.fontSize = obj.fontSize; textele.style.color = obj.fontColor; textele.style.fontFamily = obj.fontFamily; textele.style.opacity = obj.labelOpacity; textele.rotateValue = { y: -10, angle: angle }; labels.push(textele); } points = clipDecorators(obj, points); var bounds = Rect.toBounds(points); container.width = bounds.width; container.height = bounds.height; container.offsetX = bounds.x + container.pivot.x * bounds.width; container.offsetY = bounds.y + container.pivot.y * bounds.height; var anglePoints = obj.vertexPoints; if (obj.shapeAnnotationType === 'Line' || obj.shapeAnnotationType === 'LineWidthArrowHead' || obj.shapeAnnotationType === 'Distance') { srcDecorator = getDecoratorElement(obj, points[0], anglePoints[1], true); targetDecorator = getDecoratorElement(obj, points[points.length - 1], anglePoints[anglePoints.length - 2], false); } srcDecorator.id = obj.id + '_srcDec'; targetDecorator.id = obj.id + '_tarDec'; segment.style['fill'] = 'transparent'; container.style.strokeColor = 'transparent'; container.style.fill = 'transparent'; container.style.strokeWidth = 0; container.children = []; setElementStype(obj, segment); container.children.push(segment); if (leaders.length > 0) { for (var i = 0; i < leaders.length; i++) { container.children.push(leaders[parseInt(i.toString(), 10)]); } } if (labels.length > 0) { for (var i = 0; i < labels.length; i++) { container.children.push(labels[parseInt(i.toString(), 10)]); } } container.children.push(srcDecorator); container.children.push(targetDecorator); if (obj.shapeAnnotationType === 'LineWidthArrowHead') { for (var i = 0; i < container.children.length; i++) { var child = container.children[parseInt(i.toString(), 10)]; if (child.id.includes('srcDec') || child.id.includes('tarDec')) { child.width = 12 * obj.thickness; child.height = 12 * obj.thickness; } } } container.id = obj.id; container.offsetX = segment.offsetX; container.offsetY = segment.offsetY; container.width = segment.width; container.height = segment.height; points = getConnectorPoints(obj); obj.wrapper = container; return container; }; /** * @private * @param {PdfAnnotationBaseModel} obj - Specified the annotation object. * @returns {PdfAnnotationBaseModel} - Returns the added annotaion object. */ Drawing.prototype.add = function (obj) { var allowServerDataBind = this.pdfViewer.allowServerDataBinding; this.pdfViewer.enableServerDataBinding(false); if (obj.formFieldAnnotationType && this.pdfViewer.formDesignerModule) { obj = new PdfFormFieldBase(this.pdfViewer, 'formFields', obj, true); obj = this.initObject(obj); this.pdfViewer.formFields.push(obj); } else { obj = new PdfAnnotationBase(this.pdfViewer, 'annotations', obj, true); obj = this.initObject(obj); this.pdfViewer.annotations.push(obj); } this.pdfViewer.enableServerDataBinding(allowServerDataBind, true); return obj; }; /** * @private * @param {PdfAnnotationBaseModel} obj - Specified the annotation object. * @returns {void} */ Drawing.prototype.remove = function (obj) { var allowServerDataBind = this.pdfViewer.allowServerDataBinding; this.pdfViewer.enableServerDataBinding(false); var index = obj.pageIndex; for (var i = 0; i < this.pdfViewer.annotations.length; i++) { var annotation = this.pdfViewer.annotations[parseInt(i.toString(), 10)]; if ((annotation.id && (annotation.id === obj.id || annotation.id.split('_')[0] === obj.id)) || (annotation.wrapper && annotation.wrapper.id === obj.id)) { this.pdfViewer.annotations.splice(i, 1); var objects = this.getPageObjects(obj.pageIndex); for (var j = 0; j < objects.length; j++) { if (objects[parseInt(j.toString(), 10)].id === obj.id) { objects.splice(j, 1); if (obj.shapeAnnotationType === 'Path' || obj.shapeAnnotationType === 'SignatureImage' || obj.shapeAnnotationType === 'SignatureText') { this.refreshCanvasDiagramLayer(undefined, index, obj.id); } else { this.pdfViewer.renderDrawing(undefined, index); } } } // need to add code snippet to remove from z index table } } for (var i = 0; i < this.pdfViewer.formFields.length; i++) { var element = this.pdfViewer.formFields[parseInt(i.toString(), 10)]; if (element.id === obj.id || element.wrapper.id === obj.id) { this.pdfViewer.formFields.splice(i, 1); if (this.pdfViewer.formDesignerModule && obj.formFieldAnnotationType) { this.pdfViewer.formFieldCollection.splice(i, 1); } var objects = this.getPageObjects(obj.pageIndex); for (var j = 0; j < objects.length; j++) { if (objects[parseInt(j.toString(), 10)].id === obj.id) { objects.splice(j, 1); break; } if (objects[parseInt(j.toString(), 10)] && objects[parseInt(j.toString(), 10)].id && objects[parseInt(j.toString(), 10)].id.indexOf(obj.id) !== -1) { objects.splice(j, 1); } } } } if (obj.formFieldAnnotationType === 'Textbox' || obj.formFieldAnnotationType === 'Checkbox' || obj.formFieldAnnotationType === 'RadioButton' || obj.formFieldAnnotationType === 'PasswordField' || obj.formFieldAnnotationType === 'DropdownList' || obj.formFieldAnnotationType === 'ListBox' || obj.formFieldAnnotationType === 'SignatureField' || obj.formFieldAnnotationType === 'InitialField') { var inputField = document.getElementById('form_field_' + obj.id + '_content_html_element'); if (inputField) { inputField.remove(); this.pdfViewer.renderDrawing(undefined, index); } for (var i = 0; i < this.pdfViewer.formFieldCollections.length; i++) { var element = this.pdfViewer.formFieldCollections[parseInt(i.toString(), 10)]; if (element.id === obj.id) { this.pdfViewer.formFieldCollections.splice(i, 1); } } for (var i = 0; i < this.pdfViewer.viewerBase.formFieldCollection.length; i++) { // eslint-disable-next-line if (obj.id == this.pdfViewer.viewerBase.formFieldCollection[parseInt(i.toString(), 10)]) { this.pdfViewer.viewerBase.formFieldCollection.splice(i, 1); } } var field = { // eslint-disable-next-line name: obj.name, id: obj.id, value: obj.value, fontFamily: obj.fontFamily, fontSize: obj.fontSize, fontStyle: obj.fontStyle, // eslint-disable-next-line color: obj.color, backgroundColor: obj.backgroundColor, alignment: obj.alignment, isReadonly: obj.isReadonly, visibility: obj.visibility, // eslint-disable-next-line maxLength: obj.maxLength, isRequired: obj.isRequired, isPrint: obj.isPrint, rotation: obj.rotateAngle, tooltip: obj.tooltip, // eslint-disable-next-line options: obj.options, isChecked: obj.isChecked, isSelected: obj.isSelected, // eslint-disable-next-line customData: obj.customData, lineBound: obj.bounds, // eslint-disable-next-line pageNumber: obj.pageIndex, insertSpaces: obj.insertSpaces, // eslint-disable-next-line formFieldAnnotationType: obj.formFieldAnnotationType, // eslint-disable-next-line borderColor: obj.borderColor, thickness: obj.thickness, isTransparent: obj.isTransparent }; if (!isNullOrUndefined(field) && field.id !== 'diagram_helper') { this.pdfViewer.fireFormFieldRemoveEvent('formFieldRemove', field, obj.pageIndex); this.pdfViewer.formDesignerModule.removeFieldsFromAnnotationCollections(obj.id, field.name); } } this.pdfViewer.enableServerDataBinding(allowServerDataBind, true); }; /** * @private * @param {number} pageIndex - Specified the page index. * @returns {PdfAnnotationBaseModel[]} - Returns the annotation base model collections. */ Drawing.prototype.getPageObjects = function (pageIndex) { var pageTable = this.getPageTable(pageIndex); return pageTable.objects; }; /** * @private * @param {HTMLCanvasElement} diagramLayer - Specified the diagram layer element. * @param {number} pageIndex - Specified the page index. * @param {string} objectId - Specified the object id. * @returns {void} */ Drawing.prototype.refreshCanvasDiagramLayer = function (diagramLayer, pageIndex, objectId) { var _this = this; if (!diagramLayer) { diagramLayer = this.pdfViewer.viewerBase.getAnnotationCanvas('_annotationCanvas_', pageIndex); } if (diagramLayer) { var zoom = void 0; if (diagramLayer.id === this.pdfViewer.element.id + '_print_annotation_layer_' + pageIndex) { zoom = 1; } else { zoom = this.pdfViewer.viewerBase.getZoomFactor(); } var width = diagramLayer.width / zoom; var height = diagramLayer.height / zoom; var ctx = diagramLayer.getContext('2d'); ctx.lineCap = 'round'; ctx.lineJoin = 'round'; if (zoom < 1) { ctx.lineWidth = ctx.lineWidth / zoom; } var devicePixelRatio_1 = this.pdfViewer.viewerBase.getWindowDevicePixelRatio(); var zoomRatio = zoom * devicePixelRatio_1; if (!Browser.isDevice || (Browser.isDevice && zoom <= 0.7)) { ctx.setTransform(zoomRatio, 0, 0, zoomRatio, 0, 0); } else { ctx.setTransform(zoom, 0, 0, zoom, 0, 0); } ctx.clearRect(0, 0, width, height); var objects = this.getPageObjects(pageIndex); var uniqueObjects = objects.filter(function (obj, index, self) { if (obj.id.split('_')[0] === 'free') { return true; } else if (!isNullOrUndefined(_this.pdfViewer.formDesignerModule)) { return index === self.findIndex(function (t) { return t.id.split('_')[0] === obj.id.split('_')[0]; }); } return index === self.findIndex(function (t) { return t.id === obj.id; }); }); for (var i = 0; i < uniqueObjects.length; i++) { var renderElement = void 0; if (diagramLayer.id === this.pdfViewer.element.id + '_print_annotation_layer_' + pageIndex) { if (uniqueObjects[parseInt(i.toString(), 10)].isPrint) { renderElement = this.pdfViewer.nameTable[uniqueObjects[parseInt(i.toString(), 10)].id].wrapper; if (!isNullOrUndefined(renderElement)) { refreshDiagramElements(diagramLayer, [renderElement], this.renderer); } } } else { renderElement = this.pdfViewer.nameTable[uniqueObjects[parseInt(i.toString(), 10)].id].wrapper; var uniqueObjectId = uniqueObjects[parseInt(i.toString(), 10)].id; var uniqueObject = this.pdfViewer.nameTable["" + uniqueObjectId]; if ((renderElement && this.shouldRefreshElement(uniqueObject)) || isNullOrUndefined(this.pdfViewer.formDesignerModule)) { if (!isNullOrUndefined(uniqueObject.properties.data) && uniqueObject.properties.data.includes('base64')) { var image = new Image(); image.src = uniqueObject.properties.data; if (window.customStampCollection == null && window.customStampCollection === undefined) { window.customStampCollection = new Map(); } if (window.customStampCollection && !window.customStampCollection.get(renderElement.id)) { window.customStampCollection.set(renderElement.id, image); } } else if (!isNullOrUndefined(uniqueObject.properties.value) && uniqueObject.properties.value.includes('base64')) { var image = new Image(); image.src = uniqueObject.properties.value; if (window.signatureCollection == null && window.signatureCollection === undefined) { window.signatureCollection = new Map(); } if (window.signatureCollection && !window.signatureCollection.get(renderElement.id)) { window.signatureCollection.set(renderElement.id, image); } } refreshDiagramElements(diagramLayer, [renderElement], this.renderer); } } } } }; Drawing.prototype.shouldRefreshElement = function (uniqueObject) { var parentObject = this.pdfViewer.nameTable[uniqueObject.id.split('_')[0]]; return ((!isNullOrUndefined(parentObject) && uniqueObject.visibility === 'visible') || (!isNullOrUndefined(uniqueObject.subject) && uniqueObject.annotName !== 'SignatureField' && isNullOrUndefined(uniqueObject.visibility)) || (uniqueObject.propName === 'annotations' && uniqueObject.shapeAnnotationType !== 'Path' && uniqueObject.shapeAnnotationType !== 'SignatureText' && uniqueObject.shapeAnnotationType !== 'SignatureImage') || (uniqueObject.shapeAnnotationType === 'SignatureImage' && uniqueObject.propName !== 'formFields') || (uniqueObject.shapeAnnotationType === 'SignatureText' && uniqueObject.propName !== 'formFields') || (isNullOrUndefined(parentObject) && uniqueObject.id === 'diagram_helper')); }; /** * @private * @param {number} index - Specified the page index. * @returns {void} */ Drawing.prototype.clearHighlighter = function (index) { var adornerSvg = this.getAdornerLayerSvg(this.pdfViewer.element.id + index + '_diagramAdornerLayer', index); if (adornerSvg) { var highlighter = adornerSvg.getElementById(adornerSvg.id + '_highlighter'); if (highlighter) { highlighter.parentNode.removeChild(highlighter); } } }; /** * @private * @param {string} diagramId - Specified the diagram id. * @param {number} index - Specified the page index. * @returns {SVGSVGElement} Return the svg element. */ Drawing.prototype.getSelectorElement = function (diagramId, index) { var adornerLayer = null; var adornerSvg = this.getAdornerLayerSvg(diagramId, index); if (adornerSvg) { adornerLayer = adornerSvg.getElementById(