@syncfusion/ej2-pdfviewer
Version:
Essential JS 2 PDF viewer Component
944 lines • 291 kB
JavaScript
import { createElement, Browser, isBlazor, isNullOrUndefined, closest, initializeCSPTemplate } from '@syncfusion/ej2-base';
import { Toolbar as Tool, Menu } from '@syncfusion/ej2-navigations';
import { DropDownButton } from '@syncfusion/ej2-splitbuttons';
import { ColorPicker, Slider } from '@syncfusion/ej2-inputs';
import { cloneObject } from '../drawing/drawing-util';
import { ComboBox } from '@syncfusion/ej2-dropdowns';
import { Query } from '@syncfusion/ej2-data';
import { DynamicStampItem, SignStampItem, StandardBusinessStampItem } from '../base/types';
/* eslint-disable valid-jsdoc */
/**
* @param {string} args - args
* @param {any} buttonElement - button element
* @param {any} colorElement - color element
* @returns {void}
* @hidden
*/
var AnnotationToolbar = /** @class */ (function () {
function AnnotationToolbar(viewer, viewerBase, toolbar) {
var _this = this;
this.toolbarBorderHeight = 1;
/**
* @private
*/
this.isToolbarHidden = false;
/**
* @private
*/
this.isMobileAnnotEnabled = false;
this.isHighlightEnabled = false;
this.isMobileHighlightEnabled = false;
this.isUnderlineEnabled = false;
this.isMobileUnderlineEnabled = false;
this.isStrikethroughEnabled = false;
this.isMobileStrikethroughEnabled = false;
this.isHighlightBtnVisible = true;
this.isCommentBtnVisible = true;
this.isUnderlineBtnVisible = true;
this.isStrikethroughBtnVisible = true;
this.isColorToolVisible = true;
this.isOpacityToolVisible = true;
this.isDeleteAnnotationToolVisible = true;
this.isCurrentAnnotationOpacitySet = false;
this.isStampBtnVisible = false;
this.isShapeBtnVisible = false;
this.isSignatureBtnVisible = false;
this.isInkBtnVisible = false;
this.isFontFamilyToolVisible = false;
this.isFontSizeToolVisible = false;
this.isFontAlignToolVisible = false;
this.isFontColorToolVisible = false;
this.isFontStylesToolVisible = false;
this.isCommentPanelBtnVisible = false;
this.isFreeTextBtnVisible = false;
this.isCalibrateBtnVisible = false;
this.isStrokeColorToolVisible = false;
this.isThicknessToolVisible = false;
this.stampMenu = [];
this.stampParentID = '';
/**
* @private
*/
this.inkAnnotationSelected = false;
/**
* @private
*/
this.openSignaturePopup = false;
this.isSavedSignatureClicked = false;
this.saveSignatureCount = 0;
this.saveInitialCount = 0;
/**
* @private
*/
this.isToolbarCreated = false;
this.addStampImage = function (args) {
// eslint-disable-next-line
var proxy = _this;
var upoadedFiles = args.target.files;
if (args.target.files[0] !== null) {
var uploadedFile = upoadedFiles[0];
_this.pdfViewer.annotationModule.stampAnnotationModule.customStampName = uploadedFile.name.split('.')[0];
if (uploadedFile.type.split('/')[0] === 'image') {
var reader = new FileReader();
reader.onload = function (e) {
var uploadedFileUrl = e.currentTarget.result;
proxy.pdfViewer.annotation.stampAnnotationModule.isStampAddMode = true;
proxy.pdfViewer.annotationModule.stampAnnotationModule.isStampAnnotSelected = true;
proxy.pdfViewerBase.stampAdded = true;
_this.pdfViewer.annotationModule.stampAnnotationModule.createCustomStampAnnotation(uploadedFileUrl);
proxy.pdfViewerBase.stampAdded = false;
};
reader.readAsDataURL(uploadedFile);
}
}
args.target.value = '';
args.currentTarget.value = '';
};
this.popupPosition = function (colorElement, buttonElement) {
if (colorElement && colorElement.element) {
var buttonBounds = buttonElement.getBoundingClientRect();
var elements = colorElement.element.getElementsByClassName('e-container e-color-palette')[0].getElementsByClassName('e-palette')[0].getBoundingClientRect();
var mainContainerBounds = this.pdfViewerBase.mainContainer.getBoundingClientRect();
if (elements.left + elements.width > mainContainerBounds.width) {
colorElement.element.parentElement.style.left = (elements.left - elements.width) + buttonBounds.width + 'px';
}
if (((elements.left - elements.width) + buttonBounds.width) < 0) {
colorElement.element.parentElement.style.left = mainContainerBounds.left + buttonBounds.width + 'px';
}
}
};
this.onShapeToolbarClicked = function (args) {
var elementId = _this.pdfViewer.element.id;
var shapeAnnotationModule = _this.pdfViewer.annotation.shapeAnnotationModule;
if (Browser.isDevice || !_this.pdfViewer.enableDesktopMode) {
if (_this.pdfViewerBase.action === 'Polygon') {
_this.pdfViewerBase.tool.mouseUp(args, true, true);
}
}
if (!Browser.isDevice) {
_this.deselectAllItems();
_this.resetFreeTextAnnot();
}
else {
var element = args.originalEvent.target;
_this.pdfViewer.toolbarModule.selectItem(element.parentElement);
_this.deselectAllItemsForMobile();
}
switch (args.originalEvent.target.id) {
case elementId + '_shape_line':
case elementId + '_shape_lineIcon':
shapeAnnotationModule.setAnnotationType('Line');
_this.onShapeDrawSelection(true);
_this.updateColorInIcon(_this.colorDropDownElement, shapeAnnotationModule.lineFillColor);
_this.updateColorInIcon(_this.strokeDropDownElement, shapeAnnotationModule.lineStrokeColor);
_this.handleShapeTool(elementId + '_shape_line');
break;
case elementId + '_shape_arrow':
case elementId + '_shape_arrowIcon':
shapeAnnotationModule.setAnnotationType('Arrow');
_this.onShapeDrawSelection(true);
_this.updateColorInIcon(_this.colorDropDownElement, shapeAnnotationModule.arrowFillColor);
_this.updateColorInIcon(_this.strokeDropDownElement, shapeAnnotationModule.arrowStrokeColor);
_this.handleShapeTool(elementId + '_shape_arrow');
break;
case elementId + '_shape_rectangle':
case elementId + '_shape_rectangleIcon':
shapeAnnotationModule.setAnnotationType('Rectangle');
_this.onShapeDrawSelection(true);
_this.updateColorInIcon(_this.colorDropDownElement, shapeAnnotationModule.rectangleFillColor);
_this.updateColorInIcon(_this.strokeDropDownElement, shapeAnnotationModule.rectangleStrokeColor);
_this.handleShapeTool(elementId + '_shape_rectangle');
break;
case elementId + '_shape_circle':
case elementId + '_shape_circleIcon':
shapeAnnotationModule.setAnnotationType('Circle');
_this.onShapeDrawSelection(true);
_this.updateColorInIcon(_this.colorDropDownElement, shapeAnnotationModule.circleFillColor);
_this.updateColorInIcon(_this.strokeDropDownElement, shapeAnnotationModule.circleStrokeColor);
_this.handleShapeTool(elementId + '_shape_circle');
break;
case elementId + '_shape_pentagon':
case elementId + '_shape_pentagonIcon':
shapeAnnotationModule.setAnnotationType('Polygon');
_this.onShapeDrawSelection(true);
_this.updateColorInIcon(_this.colorDropDownElement, shapeAnnotationModule.polygonFillColor);
_this.updateColorInIcon(_this.strokeDropDownElement, shapeAnnotationModule.polygonStrokeColor);
_this.handleShapeTool(elementId + '_shape_pentagon');
break;
}
// this.pdfViewer.clearSelection();
};
this.pdfViewer = viewer;
this.pdfViewerBase = viewerBase;
this.primaryToolbar = toolbar;
}
/**
* @private
* @returns {void}
*/
AnnotationToolbar.prototype.initializeAnnotationToolbar = function () {
var _this = this;
this.toolbarElement = createElement('div', { id: this.pdfViewer.element.id + '_annotation_toolbar', className: 'e-pv-annotation-toolbar' });
this.pdfViewerBase.viewerMainContainer.appendChild(this.toolbarElement);
this.toolbar = new Tool({
width: '', height: '', overflowMode: 'Popup', cssClass: 'e-pv-toolbar-scroll',
items: this.createToolbarItems(), clicked: this.onToolbarClicked.bind(this),
created: function () {
_this.createDropDowns();
}
});
this.toolbar.isStringTemplate = true;
if (this.pdfViewer.enableRtl) {
this.toolbar.enableRtl = true;
}
this.toolbar.appendTo(this.toolbarElement);
this.afterToolbarCreation();
this.createStampContainer();
this.createSignContainer();
this.applyAnnotationToolbarSettings();
this.updateToolbarItems();
this.showAnnotationToolbar(null, true);
this.toolbarElement.setAttribute('aria-label', 'Annotation Toolbar');
};
AnnotationToolbar.prototype.createMobileAnnotationToolbar = function (isEnable, isPath) {
var _this = this;
if (Browser.isDevice && !this.pdfViewer.enableDesktopMode) {
if (this.toolbarElement == null && isEnable) {
this.isMobileAnnotEnabled = true;
this.toolbarElement = createElement('div', { id: this.pdfViewer.element.id + '_annotation_toolbar', className: 'e-pv-annotation-toolbar' });
this.pdfViewerBase.viewerMainContainer.insertBefore(this.toolbarElement, this.pdfViewerBase.viewerContainer);
this.toolbar = new Tool({
width: '', height: '', overflowMode: 'Popup',
items: this.createMobileToolbarItems(isPath), clicked: this.onToolbarClicked.bind(this),
created: function () {
_this.createDropDowns(isPath);
}
});
this.toolbar.isStringTemplate = true;
if (this.pdfViewer.enableRtl) {
this.toolbar.enableRtl = true;
}
this.pdfViewerBase.navigationPane.goBackToToolbar();
this.pdfViewer.toolbarModule.showToolbar(false);
this.toolbar.appendTo(this.toolbarElement);
this.deleteItem = this.pdfViewerBase.getElement('_annotation_delete');
this.deleteItem.firstElementChild.id = this.pdfViewer.element.id + '_annotation_delete';
}
else if (this.toolbarElement != null) {
if (isEnable) {
this.isMobileAnnotEnabled = true;
this.pdfViewerBase.navigationPane.goBackToToolbar();
this.pdfViewer.toolbarModule.showToolbar(false);
this.toolbarElement.style.display = 'block';
}
else if (!isEnable) {
this.isMobileAnnotEnabled = false;
this.pdfViewer.toolbarModule.showToolbar(true);
this.hideMobileAnnotationToolbar();
}
}
}
else {
this.isMobileAnnotEnabled = true;
}
};
AnnotationToolbar.prototype.hideMobileAnnotationToolbar = function () {
if (this.toolbarElement != null) {
if (this.pdfViewer.selectedItems.annotations.length > 0 ||
(!isNullOrUndefined(this.pdfViewer.annotationModule.textMarkupAnnotationModule) &&
this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAnnotation)) {
if (this.propertyToolbar && this.propertyToolbar.element.children.length > 0) {
this.propertyToolbar.element.style.display = 'block';
this.toolbarCreated = true;
}
}
else {
if (this.toolbar.element.children.length > 0) {
this.toolbarCreated = true;
}
else {
this.toolbarCreated = false;
}
if (this.propertyToolbar && this.propertyToolbar.element.style.display !== 'none') {
this.propertyToolbar.element.style.display = 'none';
if (!this.toolbarCreated) {
var editIcon = document.getElementById(this.pdfViewer.element.id + '_annotationIcon');
if (editIcon && editIcon.parentElement.classList.contains('e-pv-select')) {
this.createAnnotationToolbarForMobile();
}
}
}
}
if (this.toolbarElement.children.length > 0) {
this.toolbarElement.style.display = 'block';
}
this.adjustMobileViewer();
}
else if (this.toolbarCreated && this.propertyToolbar && this.propertyToolbar.element.children.length > 0) {
this.propertyToolbar.element.style.display = 'none';
this.adjustMobileViewer();
this.toolbarCreated = false;
}
};
AnnotationToolbar.prototype.FreeTextForMobile = function () {
var _this = this;
this.hideExistingTool();
this.freetextToolbarElement = createElement('div', { id: this.pdfViewer.element.id + '_freeTextToolbar', className: 'e-pv-mobile-annotation-toolbar', styles: 'bottom: 0px; position: absolute; width: 100%; float: left' });
this.pdfViewerBase.viewerMainContainer.appendChild(this.freetextToolbarElement);
var colorTemplate = this.pdfViewer.toolbarModule.annotationToolbarModule.getTemplate('span', '_annotation_color', 'e-pv-annotation-color-container');
var strokeTemplate = this.pdfViewer.toolbarModule.annotationToolbarModule.getTemplate('span', '_annotation_stroke', 'e-pv-annotation-stroke-container');
var thicknessTemplate = this.getTemplate('span', '_annotation_thickness', 'e-pv-annotation-thickness-container');
var opacityTemplate = this.getTemplate('span', '_annotation_opacity', 'e-pv-annotation-opacity-container');
var fontFamilyTemplate = this.getTemplate('input', '_annotation_fontname', 'e-pv-annotation-fontname-container');
var fontSizeTemplate = this.getTemplate('input', '_annotation_fontsize', 'e-pv-annotation-fontsize-container');
var textColorTemplate = this.getTemplate('span', '_annotation_textcolor', 'e-pv-annotation-textcolor-container');
var alignmentTemplate = this.getTemplate('span', '_annotation_textalign', 'e-pv-annotation-textalign-container');
var textPropertiesTemplate = this.getTemplate('span', '_annotation_textproperties', 'e-pv-annotation-textprop-container');
var items = [
{ prefixIcon: 'e-pv-backward-icon e-pv-icon', tooltipText: this.pdfViewer.localeObj.getConstant('Go Back'), id: this.pdfViewer.element.id + '_backward', click: this.goBackToToolbar.bind(this) },
{ type: 'Separator', align: 'Left', cssClass: 'e-pv-hightlight-separator-container' },
{ template: fontFamilyTemplate },
{ template: fontSizeTemplate },
{ template: textColorTemplate },
{ template: alignmentTemplate },
{ template: textPropertiesTemplate },
{ template: colorTemplate },
{ template: strokeTemplate },
{ template: thicknessTemplate },
{ template: opacityTemplate }
];
this.toolbar = new Tool({
items: items, width: '', height: '', overflowMode: 'Scrollable', created: function () {
_this.pdfViewer.toolbarModule.annotationToolbarModule.mobileColorpicker(_this.pdfViewer.element.id + '_annotation_freeTextEdit');
}
});
this.toolbar.appendTo(this.freetextToolbarElement);
this.showFreeTextPropertiesTool();
};
/**
* @param {string} shapeType - It describes about the shape type
* @private
* @returns {void}
*/
AnnotationToolbar.prototype.createPropertyTools = function (shapeType) {
var _this = this;
if (shapeType !== '') {
if (this.propertyToolbar) {
this.propertyToolbar.destroy();
}
if (this.toolbar) {
this.toolbar.destroy();
}
var shapeToolbarElement = void 0;
shapeToolbarElement = document.getElementById(this.pdfViewer.element.id + '_propertyToolbar');
if (shapeToolbarElement) {
shapeToolbarElement.parentElement.removeChild(shapeToolbarElement);
}
shapeToolbarElement = createElement('div', { id: this.pdfViewer.element.id + '_propertyToolbar', className: 'e-pv-mobile-annotation-toolbar', styles: 'bottom: 0px; position: absolute; width: 100%; float: left' });
this.pdfViewerBase.viewerMainContainer.appendChild(shapeToolbarElement);
var id_1;
var propertyToolbar = new Tool({
items: this.createPropertyToolbarForMobile(shapeType), width: '', height: '', overflowMode: 'Scrollable',
created: function () {
if (!isNullOrUndefined(_this.pdfViewer.annotationModule.textMarkupAnnotationModule) &&
_this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAnnotation) {
id_1 = _this.pdfViewer.element.id + '_underlineIcon';
}
else if (!isNullOrUndefined(_this.pdfViewer.selectedItems.annotations[0])) {
if (_this.pdfViewer.selectedItems.annotations[0].shapeAnnotationType === 'FreeText') {
id_1 = _this.pdfViewer.element.id + '_annotation_freeTextEdit';
}
else if (_this.pdfViewer.selectedItems.annotations[0].shapeAnnotationType === 'Stamp' || _this.pdfViewer.selectedItems.annotations[0].shapeAnnotationType === 'StickyNotes' || _this.pdfViewer.selectedItems.annotations[0].shapeAnnotationType === 'Image') {
id_1 = _this.pdfViewer.element.id + '_annotation_stamp';
}
else if (_this.pdfViewer.selectedItems.annotations[0].shapeAnnotationType === 'HandWrittenSignature' || _this.pdfViewer.selectedItems.annotations[0].shapeAnnotationType === 'SignatureText') {
id_1 = _this.pdfViewer.element.id + '_annotation_handwrittenSign';
}
else if (_this.pdfViewer.selectedItems.annotations[0].shapeAnnotationType === 'SignatureImage') {
id_1 = _this.pdfViewer.element.id + '_annotation_handwrittenImage';
}
else if (_this.pdfViewer.selectedItems.annotations[0].shapeAnnotationType === 'Ink' || _this.pdfViewer.selectedItems.annotations[0].shapeAnnotationType === 'Path') {
id_1 = _this.pdfViewer.element.id + '_annotation_inkIcon';
}
else if (shapeType === 'Highlight' || shapeType === 'Underline' || shapeType === 'Strikethrough') {
id_1 = _this.pdfViewer.element.id + '_highlightIcon';
}
else {
id_1 = _this.pdfViewer.element.id + '_annotation_shapesIcon';
}
}
else if (shapeType === 'Highlight' || shapeType === 'Underline' || shapeType === 'Strikethrough') {
id_1 = _this.pdfViewer.element.id + '_highlightIcon';
}
else {
id_1 = _this.pdfViewer.element.id + '_annotation_shapesIcon';
}
_this.pdfViewer.toolbarModule.annotationToolbarModule.mobileColorpicker(id_1);
}
});
propertyToolbar.isStringTemplate = true;
propertyToolbar.appendTo(shapeToolbarElement);
if (!isNullOrUndefined(this.pdfViewer.annotationModule.textMarkupAnnotationModule) &&
!this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAnnotation) {
if (this.pdfViewer.selectedItems.annotations[0].shapeAnnotationType === 'Line') {
this.enableItems(this.colorDropDownElement.parentElement, false);
}
if (this.pdfViewer.selectedItems.annotations[0].shapeAnnotationType === 'HandWrittenSignature') {
var commentIcon = document.getElementById(this.pdfViewer.element.id + '_annotation_commentPanel');
this.enableItems(commentIcon.parentElement, false);
}
}
this.showPropertyTool(propertyToolbar, id_1);
}
};
AnnotationToolbar.prototype.showPropertyTool = function (existingTool, id) {
if (this.toolbar) {
this.toolbar.destroy();
}
this.propertyToolbar = existingTool;
this.applyProperiesToolSettings(id);
//this.propertyToolbar.element.style.display = 'block';
if (this.pdfViewer.selectedItems.annotations[0]) {
var selectedAnnotation = this.pdfViewer.selectedItems.annotations[0];
if (selectedAnnotation.shapeAnnotationType !== 'SignatureText' && selectedAnnotation.shapeAnnotationType !== 'HandWrittenSignature' && selectedAnnotation.shapeAnnotationType !== 'Stamp' && selectedAnnotation.shapeAnnotationType !== 'Image' && selectedAnnotation.shapeAnnotationType !== 'Ink' && selectedAnnotation.shapeAnnotationType !== 'Path' && selectedAnnotation.shapeAnnotationType !== 'StickyNotes') {
this.updateColorInIcon(this.colorDropDownElement, this.pdfViewer.selectedItems.annotations[0].fillColor);
this.updateColorInIcon(this.strokeDropDownElement, this.pdfViewer.selectedItems.annotations[0].strokeColor);
if (this.pdfViewer.selectedItems.annotations[0].shapeAnnotationType === 'FreeText') {
var fontFamily = this.fontFamilyElement;
fontFamily.ej2_instances[0].value = this.pdfViewer.selectedItems.annotations[0].fontFamily;
var fontColor = this.fontColorElement;
fontColor.children[0].style.borderBottomColor = this.pdfViewer.selectedItems.annotations[0].fontColor;
this.pdfViewer.annotation.modifyTextAlignment(this.pdfViewer.selectedItems.annotations[0].textAlign);
this.updateTextAlignInIcon(this.pdfViewer.selectedItems.annotations[0].textAlign);
}
}
else {
if (this.strokeDropDownElement) {
this.updateColorInIcon(this.strokeDropDownElement, this.pdfViewer.selectedItems.annotations[0].strokeColor);
}
}
}
this.toolbarCreated = true;
this.adjustMobileViewer();
};
AnnotationToolbar.prototype.stampToolMobileForMobile = function (args) {
var _this = this;
this.hideExistingTool();
if (this.stampToolbarElement) {
this.stampToolbarElement.parentElement.removeChild(this.stampToolbarElement);
}
this.stampToolbarElement = createElement('div', { id: this.pdfViewer.element.id + '_stampToolbar', className: 'e-pv-mobile-annotation-toolbar', styles: 'bottom: 0px; position: absolute; width: 100%; float: left' });
this.pdfViewerBase.viewerMainContainer.appendChild(this.stampToolbarElement);
this.toolbar = new Tool({
items: this.createStampToolbarItemsForMobile(), width: '', height: '', overflowMode: 'Scrollable', clicked: this.onShapeToolbarClicked.bind(this),
created: function () {
_this.pdfViewer.toolbarModule.annotationToolbarModule.mobileColorpicker(args);
}
});
this.toolbar.isStringTemplate = true;
this.toolbar.appendTo(this.stampToolbarElement);
this.showStampPropertiesTool();
//this.afterShapeToolbarCreationForMobile();
};
AnnotationToolbar.prototype.shapeToolMobile = function (args) {
var _this = this;
this.hideExistingTool();
if (this.shapeToolbarElement) {
this.shapeToolbarElement.parentElement.removeChild(this.shapeToolbarElement);
}
this.shapeToolbarElement = createElement('div', { id: this.pdfViewer.element.id + '_shapeToolbar', className: 'e-pv-mobile-annotation-toolbar', styles: 'bottom: 0px; position: absolute; width: 100%; float: left' });
this.pdfViewerBase.viewerMainContainer.appendChild(this.shapeToolbarElement);
this.toolbar = new Tool({
items: this.createShapeToolbarItemsForMobile(), width: '', height: '', overflowMode: 'Scrollable', clicked: this.onShapeToolbarClicked.bind(this),
created: function () {
_this.pdfViewer.toolbarModule.annotationToolbarModule.mobileColorpicker(args.originalEvent.target.id);
}
});
this.toolbar.isStringTemplate = true;
this.toolbar.appendTo(this.shapeToolbarElement);
this.afterShapeToolbarCreationForMobile();
this.showShapeTool();
};
AnnotationToolbar.prototype.calibrateToolMobile = function (args) {
var _this = this;
this.hideExistingTool();
if (this.calibrateToolbarElement) {
this.calibrateToolbarElement.parentElement.removeChild(this.calibrateToolbarElement);
}
this.calibrateToolbarElement = createElement('div', { id: this.pdfViewer.element.id + '_calibrateToolbar', className: 'e-pv-mobile-annotation-toolbar', styles: 'bottom: 0px; position: absolute; width: 100%; float: left' });
this.pdfViewerBase.viewerMainContainer.appendChild(this.calibrateToolbarElement);
this.toolbar = new Tool({
items: this.createCalibrateToolbarItemsForMobile(), width: '', height: '', overflowMode: 'Scrollable', clicked: this.onCalibrateToolbarClicked.bind(this),
created: function () {
_this.pdfViewer.toolbarModule.annotationToolbarModule.mobileColorpicker(args.originalEvent.target.id);
}
});
this.toolbar.isStringTemplate = true;
this.toolbar.appendTo(this.calibrateToolbarElement);
this.afterCalibrateToolbarCreationForMobile();
this.showShapeTool();
};
AnnotationToolbar.prototype.textMarkupForMobile = function (args) {
var _this = this;
this.hideExistingTool();
if (this.textMarkupToolbarElement) {
this.textMarkupToolbarElement.parentElement.removeChild(this.textMarkupToolbarElement);
}
this.textMarkupToolbarElement = createElement('div', { id: this.pdfViewer.element.id + '_mobileAnnotationToolbar', className: 'e-pv-mobile-annotation-toolbar', styles: 'bottom: 0px; position: absolute; width: 100%; float: left' });
this.pdfViewerBase.viewerMainContainer.appendChild(this.textMarkupToolbarElement);
var colorTemplate = this.pdfViewer.toolbarModule.annotationToolbarModule.getTemplate('span', '_annotation_color', 'e-pv-annotation-color-container');
var opacityTemplate = this.getTemplate('span', '_annotation_opacity', 'e-pv-annotation-opacity-container');
var items = [
{ prefixIcon: 'e-pv-backward-icon e-pv-icon', tooltipText: this.pdfViewer.localeObj.getConstant('Go Back'), id: this.pdfViewer.element.id + '_backward', click: this.goBackToToolbar.bind(this) },
{ type: 'Separator', align: 'Left', cssClass: 'e-pv-hightlight-separator-container' },
{ template: colorTemplate, align: 'left' },
{ template: opacityTemplate, align: 'left' }
];
this.propertyToolbar = new Tool({
items: items, width: '', height: '', overflowMode: 'Scrollable',
created: function () {
_this.pdfViewer.toolbarModule.annotationToolbarModule.mobileColorpicker(args.originalEvent.target.id);
}
});
this.propertyToolbar.isStringTemplate = true;
this.propertyToolbar.appendTo(this.textMarkupToolbarElement);
this.showTextMarkupPropertiesTool();
};
AnnotationToolbar.prototype.showShapeTool = function () {
var annotationToolbarItems = this.pdfViewer.toolbarSettings.annotationToolbarItems;
if (annotationToolbarItems) {
if (annotationToolbarItems.indexOf('ColorEditTool') !== -1) {
this.showColorEditTool(true, 7, 7);
}
else {
this.showColorEditTool(false, 7, 7);
}
if (annotationToolbarItems.indexOf('StrokeColorEditTool') !== -1) {
this.showStrokeColorEditTool(true, 8, 8);
}
else {
this.showStrokeColorEditTool(false, 8, 8);
}
if (annotationToolbarItems.indexOf('ThicknessEditTool') !== -1) {
this.showThicknessEditTool(true, 9, 9);
}
else {
this.showThicknessEditTool(false, 9, 9);
}
if (annotationToolbarItems.indexOf('OpacityEditTool') !== -1) {
this.showOpacityEditTool(true, 10, 10);
}
else {
this.showOpacityEditTool(false, 10, 10);
}
}
};
AnnotationToolbar.prototype.signatureInkForMobile = function () {
var _this = this;
this.hideExistingTool();
if (this.signatureInkToolbarElement) {
this.signatureInkToolbarElement.parentElement.removeChild(this.signatureInkToolbarElement);
}
this.signatureInkToolbarElement = createElement('div', { id: this.pdfViewer.element.id + '_mobileAnnotationToolbar', className: 'e-pv-mobile-annotation-toolbar', styles: 'bottom: 0px; position: absolute; width: 100%; float: left' });
this.pdfViewerBase.viewerMainContainer.appendChild(this.signatureInkToolbarElement);
var opacityTemplate = this.getTemplate('span', '_annotation_opacity', 'e-pv-annotation-opacity-container');
var strokeTemplate = this.pdfViewer.toolbarModule.annotationToolbarModule.getTemplate('span', '_annotation_stroke', 'e-pv-annotation-stroke-container');
var thicknessTemplate = this.getTemplate('span', '_annotation_thickness', 'e-pv-annotation-thickness-container');
var items = [
{ prefixIcon: 'e-pv-backward-icon e-pv-icon', tooltipText: this.pdfViewer.localeObj.getConstant('Go Back'), id: this.pdfViewer.element.id + '_backward', click: this.goBackToToolbar.bind(this) },
{ template: opacityTemplate, align: 'left' },
{ template: strokeTemplate, aign: 'left' },
{ template: thicknessTemplate, align: 'left' }
];
this.toolbar = new Tool({
items: items, width: '', height: '', overflowMode: 'Scrollable',
created: function () {
_this.pdfViewer.toolbarModule.annotationToolbarModule.mobileColorpicker(_this.pdfViewer.element.id + '_annotation_inkIcon');
}
});
this.toolbar.isStringTemplate = true;
this.toolbar.appendTo(this.signatureInkToolbarElement);
};
AnnotationToolbar.prototype.hideExistingTool = function () {
if (this.toolbar && !this.pdfViewer.enableDesktopMode) {
this.toolbar.destroy();
}
if (this.propertyToolbar && !this.pdfViewer.enableDesktopMode) {
this.propertyToolbar.destroy();
}
var mobileAnnotationToolbar = document.getElementById(this.pdfViewer.element.id + '_mobileAnnotationToolbar');
if (mobileAnnotationToolbar) {
mobileAnnotationToolbar.style.display = 'none';
}
};
AnnotationToolbar.prototype.applyProperiesToolSettings = function (type) {
switch (type) {
case this.pdfViewer.element.id + '_underlineIcon':
case this.pdfViewer.element.id + '_highlightIcon':
this.showTextMarkupPropertiesTool();
break;
case this.pdfViewer.element.id + '_annotation_freeTextEdit':
this.showFreeTextPropertiesTool();
break;
case this.pdfViewer.element.id + '_annotation_shapesIcon':
this.shapePropertiesTool();
break;
case 'stampTool':
case this.pdfViewer.element.id + '_annotation_stamp':
this.showStampPropertiesTool();
break;
case this.pdfViewer.element.id + '_annotation_handwrittenSign':
case this.pdfViewer.element.id + '_annotation_inkIcon':
this.showInkPropertiesTool();
break;
case this.pdfViewer.element.id + '_annotation_handwrittenImage':
this.showImagePropertyTool();
break;
}
};
AnnotationToolbar.prototype.showImagePropertyTool = function () {
var annotationToolbarItems = this.pdfViewer.toolbarSettings.annotationToolbarItems;
if (annotationToolbarItems) {
if (annotationToolbarItems.indexOf('OpacityEditTool') !== -1) {
this.showOpacityEditTool(true, 0, 0);
}
else {
this.showOpacityEditTool(false, 0, 0);
}
if (annotationToolbarItems.indexOf('CommentPanelTool') !== -1) {
this.showCommentPanelTool(true, 1, 1);
}
else {
this.showCommentPanelTool(false, 1, 1);
}
if (annotationToolbarItems.indexOf('AnnotationDeleteTool') !== -1) {
this.showAnnotationDeleteTool(true, 2, 2);
}
else {
this.showAnnotationDeleteTool(false, 2, 2);
}
}
};
AnnotationToolbar.prototype.showFreeTextPropertiesTool = function () {
var annotationToolbarItems = this.pdfViewer.toolbarSettings.annotationToolbarItems;
if (annotationToolbarItems) {
if (annotationToolbarItems.indexOf('FontFamilyAnnotationTool') !== -1) {
this.showFontFamilyAnnotationTool(true, 2, 2);
}
else {
this.showFontFamilyAnnotationTool(false, 2, 2);
}
if (annotationToolbarItems.indexOf('FontSizeAnnotationTool') !== -1) {
this.showFontSizeAnnotationTool(true, 3, 3);
}
else {
this.showFontSizeAnnotationTool(false, 3, 3);
}
if (annotationToolbarItems.indexOf('FontColorAnnotationTool') !== -1) {
this.showFontColorAnnotationTool(true, 4, 4);
}
else {
this.showFontColorAnnotationTool(false, 4, 4);
}
if (annotationToolbarItems.indexOf('FontAlignAnnotationTool') !== -1) {
this.showFontAlignAnnotationTool(true, 5, 5);
}
else {
this.showFontAlignAnnotationTool(false, 5, 5);
}
if (annotationToolbarItems.indexOf('FontStylesAnnotationTool') !== -1) {
this.showFontStylesAnnotationTool(true, 6, 6);
}
else {
this.showFontStylesAnnotationTool(false, 6, 6);
}
if (annotationToolbarItems.indexOf('ColorEditTool') !== -1) {
this.showColorEditTool(true, 7, 7);
}
else {
this.showColorEditTool(false, 7, 7);
}
if (annotationToolbarItems.indexOf('StrokeColorEditTool') !== -1) {
this.showStrokeColorEditTool(true, 8, 8);
}
else {
this.showStrokeColorEditTool(false, 8, 8);
}
if (annotationToolbarItems.indexOf('ThicknessEditTool') !== -1) {
this.showThicknessEditTool(true, 9, 9);
}
else {
this.showThicknessEditTool(false, 9, 9);
}
if (annotationToolbarItems.indexOf('OpacityEditTool') !== -1) {
this.showOpacityEditTool(true, 10, 10);
}
else {
this.showOpacityEditTool(false, 10, 10);
}
if (annotationToolbarItems.indexOf('CommentPanelTool') !== -1) {
this.showCommentPanelTool(true, 11, 11);
}
else {
this.showCommentPanelTool(false, 11, 11);
}
if (annotationToolbarItems.indexOf('AnnotationDeleteTool') !== -1) {
this.showAnnotationDeleteTool(true, 12, 12);
}
else {
this.showAnnotationDeleteTool(false, 12, 12);
}
if (annotationToolbarItems.indexOf('FreeTextAnnotationTool') !== -1) {
this.showFreeTextAnnotationTool(true, 0, 0);
}
else {
this.showFreeTextAnnotationTool(false, 0, 0);
this.applyHideToToolbar(false, 1, 1);
}
}
};
AnnotationToolbar.prototype.shapePropertiesTool = function () {
var annotationToolbarItems = this.pdfViewer.toolbarSettings.annotationToolbarItems;
if (annotationToolbarItems) {
if (annotationToolbarItems.indexOf('ColorEditTool') !== -1) {
this.showColorEditTool(true, 2, 2);
}
else {
this.showColorEditTool(false, 2, 2);
}
if (annotationToolbarItems.indexOf('StrokeColorEditTool') !== -1) {
this.showStrokeColorEditTool(true, 3, 3);
}
else {
this.showStrokeColorEditTool(false, 3, 3);
}
if (annotationToolbarItems.indexOf('ThicknessEditTool') !== -1) {
this.showThicknessEditTool(true, 4, 4);
}
else {
this.showThicknessEditTool(false, 4, 4);
}
if (annotationToolbarItems.indexOf('OpacityEditTool') !== -1) {
this.showOpacityEditTool(true, 5, 5);
}
else {
this.showOpacityEditTool(false, 5, 5);
}
if (annotationToolbarItems.indexOf('CommentPanelTool') !== -1) {
this.showCommentPanelTool(true, 6, 6);
}
else {
this.showCommentPanelTool(false, 6, 6);
}
if (annotationToolbarItems.indexOf('AnnotationDeleteTool') !== -1) {
this.showAnnotationDeleteTool(true, 7, 7);
}
else {
this.showAnnotationDeleteTool(false, 7, 7);
}
if (annotationToolbarItems.indexOf('ShapeTool') !== -1) {
this.showShapeAnnotationTool(true, 0, 0);
}
else {
this.showShapeAnnotationTool(false, 0, 0);
this.applyHideToToolbar(false, 1, 1);
}
}
};
AnnotationToolbar.prototype.showStampPropertiesTool = function () {
var annotationToolbarItems = this.pdfViewer.toolbarSettings.annotationToolbarItems;
if (annotationToolbarItems) {
if (annotationToolbarItems.indexOf('OpacityEditTool') !== -1) {
this.showOpacityEditTool(true, 2, 2);
}
else {
this.showOpacityEditTool(false, 2, 2);
}
if (annotationToolbarItems.indexOf('CommentPanelTool') !== -1) {
this.showCommentPanelTool(true, 3, 3);
}
else {
this.showCommentPanelTool(false, 3, 3);
}
if (annotationToolbarItems.indexOf('AnnotationDeleteTool') !== -1) {
this.showAnnotationDeleteTool(true, 4, 4);
}
else {
this.showAnnotationDeleteTool(false, 4, 4);
}
if (annotationToolbarItems.indexOf('StampAnnotationTool') !== -1) {
this.showStampAnnotationTool(true, 0, 0);
}
else {
this.showStampAnnotationTool(false, 0, 0);
this.applyHideToToolbar(false, 1, 1);
}
}
};
AnnotationToolbar.prototype.showTextMarkupPropertiesTool = function () {
var annotationToolbarItems = this.pdfViewer.toolbarSettings.annotationToolbarItems;
if (annotationToolbarItems) {
if (annotationToolbarItems.indexOf('ColorEditTool') !== -1) {
this.showColorEditTool(true, 2, 2);
}
else {
this.showColorEditTool(false, 2, 2);
}
if (annotationToolbarItems.indexOf('OpacityEditTool') !== -1) {
this.showOpacityEditTool(true, 3, 3);
}
else {
this.showOpacityEditTool(false, 3, 3);
}
if (annotationToolbarItems.indexOf('CommentPanelTool') !== -1) {
this.showCommentPanelTool(true, 4, 4);
}
else {
this.showCommentPanelTool(false, 4, 4);
}
if (annotationToolbarItems.indexOf('AnnotationDeleteTool') !== -1) {
this.showAnnotationDeleteTool(true, 5, 5);
}
else {
this.showAnnotationDeleteTool(false, 5, 5);
}
if (annotationToolbarItems.includes('HighlightTool') || annotationToolbarItems.includes('UnderlineTool') || annotationToolbarItems.includes('StrikethroughTool')) {
this.applyHideToToolbar(true, 0, 0);
}
else {
this.applyHideToToolbar(false, 0, 0);
this.applyHideToToolbar(false, 1, 1);
}
}
};
AnnotationToolbar.prototype.showInkPropertiesTool = function () {
var annotationToolbarItems = this.pdfViewer.toolbarSettings.annotationToolbarItems;
if (annotationToolbarItems) {
if (annotationToolbarItems.indexOf('StrokeColorEditTool') !== -1) {
this.showStrokeColorEditTool(true, 2, 2);
}
else {
this.showStrokeColorEditTool(false, 2, 2);
}
if (annotationToolbarItems.indexOf('ThicknessEditTool') !== -1) {
this.showThicknessEditTool(true, 3, 3);
}
else {
this.showThicknessEditTool(false, 3, 3);
}
if (annotationToolbarItems.indexOf('OpacityEditTool') !== -1) {
this.showOpacityEditTool(true, 4, 4);
}
else {
this.showOpacityEditTool(false, 4, 4);
}
if (annotationToolbarItems.indexOf('CommentPanelTool') !== -1) {
this.showCommentPanelTool(true, 5, 5);
}
else {
this.showCommentPanelTool(false, 5, 5);
}
if (annotationToolbarItems.indexOf('AnnotationDeleteTool') !== -1) {
this.showAnnotationDeleteTool(true, 6, 6);
}
else {
this.showAnnotationDeleteTool(false, 6, 6);
}
if (annotationToolbarItems.indexOf('HandWrittenSignatureTool') !== -1) {
this.showSignatureTool(true, 0, 0);
}
else {
this.showSignatureTool(false, 0, 0);
this.applyHideToToolbar(false, 1, 1);
}
}
};
/**
* @param {string} id - It describes about the id value
* @private
* @returns {any} - any
*/
AnnotationToolbar.prototype.createAnnotationToolbarForMobile = function (id) {
var hideToolbar;
if (id) {
var editIcon = document.getElementById(id);
if (editIcon.parentElement.classList.contains('e-pv-select')) {
hideToolbar = true;
editIcon.parentElement.classList.remove('e-pv-select');
}
else {
hideToolbar = false;
this.pdfViewer.toolbarModule.selectItem(editIcon.parentElement);
}
}
if (hideToolbar) {
this.toolbarCreated = false;
this.adjustMobileViewer();
if (this.toolbar) {
this.toolbar.destroy();
this.deselectAllItemsForMobile();
}
if (this.propertyToolbar) {
this.propertyToolbar.destroy();
}
var mobileAnnotationToolbar = document.getElementById(this.pdfViewer.element.id + '_mobileAnnotationToolbar');
if (mobileAnnotationToolbar) {
mobileAnnotationToolbar.style.display = 'none';
}
this.pdfViewer.isAnnotationToolbarVisible = !hideToolbar;
return [];
}
else {
this.isToolbarCreated = true;
if (this.propertyToolbar) {
this.propertyToolbar.destroy();
}
if (this.toolbarElement) {
this.toolbarElement.parentElement.removeChild(this.toolbarElement);
}
this.toolbarElement = createElement('div', { id: this.pdfViewer.element.id + '_mobileAnnotationToolbar', className: 'e-pv-mobile-annotation-toolbar', styles: 'bottom: 0px; position: absolute; width: 100%; float: left;' });
//this.toolbarElement.append(this.pdfViewerBase.viewerContainer);
this.pdfViewerBase.viewerMainContainer.appendChild(this.toolbarElement);
var stampTemplate = this.getTemplate('span', '_annotation_stamp', 'e-pv-annotation-stamp-container');
var signTemplate = this.getTemplate('span', '_annotation_signature', 'e-pv-annotation-handwritten-container');
var items = [
{ prefixIcon: 'e-pv-comment-icon e-pv-icon', className: 'e-pv-comment-container', id: this.pdfViewer.element.id + '_comment' },
{ type: 'Separator', align: 'Left' },
{ prefixIcon: 'e-pv-highlight-icon e-pv-icon', className: 'e-pv-highlight-container', id: this.pdfViewer.element.id + '_highlight' },
{ prefixIcon: 'e-pv-underline-icon e-pv-icon', className: 'e-pv-underline-container', id: this.pdfViewer.element.id + '_underline' },
{ prefixIcon: 'e-pv-strikethrough-icon e-pv-icon', className: 'e-pv-strikethrough-container', id: this.pdfViewer.element.id + '_strikethrough' },
{ type: 'Separator', align: 'Left' },
{ prefixIcon: 'e-pv-annotation-shape-icon e-pv-icon', className: 'e-pv-annotation-shapes-container', id: this.pdfViewer.element.id + '_annotation_shapes' },
{ type: 'Separator', align: 'Left' },
{ prefixIcon: 'e-pv-annotation-calibrate-icon e-pv-icon', className: 'e-pv-annotation-calibrate-container', id: this.pdfViewer.element.id + '_annotation_calibrate' },
{ type: 'Separator', align: 'Left' },
{ prefixIcon: 'e-pv-freetext-icon e-pv-icon', className: 'e-pv-annotation-freetextedit-container', id: this.pdfViewer.element.id + '_annotation_freeTextEdit' },
{ type: 'Separator', align: 'Left' },
{ template: stampTemplate },
{ type: 'Separator', align: 'Left' },
{ template: signTemplate, align: 'Left' },
{ type: 'Separator', align: 'Left' },
{ prefixIcon: 'e-pv-inkannotation-icon e-pv-icon', className: 'e-pv-annotation-ink-container', id: this.pdfViewer.element.id + '_annotation_ink', align: 'Left' },
{ type: 'Separator', align: 'Left' },
{ prefixIcon: 'e-pv-comment-panel-icon e-pv-icon', className: 'e-pv-comment-panel-icon-container', id: this.pdfViewer.element.id + '_annotation_commentPanel', align: 'Right' }
];
if (this.toolbarCreated && this.toolbar) {
this.toolbar.destroy();
this.toolbarCreated = false;
this.adjustMobileViewer();
}
else {
this.toolbar = new Tool({ items: items, width: '', height: '', overflowMode: 'Scrollable', clicked: this.onToolbarClicked.bind(this) });
if (this.pdfViewer.enableRtl) {
this.toolbar.enableRtl = true;
}
this.toolbar.isStringTemplate = true;
this.toolbar.appendTo(this.toolbarElement);
this.afterMobileToolbarCreation();
this.createStampContainer();
this.createSignContainer();
this.applyMobileAnnotationToolbarSettings();
this.toolbarCreated = true;
this.adjustMobileViewer();
}
i