@syncfusion/ej2-documenteditor
Version:
Feature-rich document editor control with built-in support for context menu, options pane and dialogs.
727 lines • 187 kB
JavaScript
import { L10n, createElement, isNullOrUndefined } from '@syncfusion/ej2-base';
//import { DocumentEditorRulerModel } from '../ruler-settings-model';
import { Ruler } from '../ruler/index';
import { HelperMethods, Point } from '../editor/editor-helper';
import { WTabStop } from '../format/paragraph-format';
import { Size } from './size';
/* eslint-disable */
/**
* defines the helper methods for the ruler
* @private
*/
var RulerHelper = /** @class */ (function () {
function RulerHelper() {
this.resizerEnabled = false;
this.isDraggingRender = false;
this.isDraggingIndents1 = false;
this.isDraggingIndents2 = false;
this.isDraggingIndents3 = false;
this.isDraggingIndents4 = false;
this.isDraggingForTab = false;
this.currentTabStop = undefined;
this.tabIndex = 0;
this.isLeftRulerMargin = undefined;
this.isLeftMultiColumn = false;
this.isRightMultiColumn = false;
//Event handler
this.onmarkIndicatorClickHandler = this.onMarkIndicatorClick.bind(this);
this.onHorizontalRulerMouseMoveHandler = this.onHorizontalRulerMouseMoved.bind(this);
this.onHRulerMouseEnterHandler = this.onHRulerMouseEnter.bind(this);
this.onHRulerMouseLeaveHandler = this.onHRulerMouseLeave.bind(this);
this.onHRulerMouseDownHandler = this.onHRulerMouseDown.bind(this);
this.onHRulerMouseUpHandler = this.onHRulerMouseUp.bind(this);
this.onRulerDblClickHandler = this.onRulerDblClick.bind(this);
this.onDoubleClickHandler = this.onDoubleClick.bind(this);
this.onRulerMouseUpHandler = this.onRularMouseUp.bind(this);
this.onVMouseMoveHandler = this.onVMouseMove.bind(this);
this.onVMouseDownHandler = this.onVMouseDown.bind(this);
this.onVMouseUpHandler = this.onVMouseUp.bind(this);
this.onDocumentIntentTrueChangeHandler = this.onDocumentIntentTrue.bind(this);
this.onDocumentIntentFalseChangeHandler = this.onDocumentIntentFalse.bind(this);
this.onFirstLineIndentMouseDownHandler = this.onFirstLineIndentMouseDown.bind(this);
this.onIndentMouseMoveHandler = this.onIndentMouseMove.bind(this);
this.onIndentMouseUpHandler = this.onIndentMouseUp.bind(this);
this.onHangIndentMouseDownHandler = this.onHangIndentMouseDown.bind(this);
this.onHangIndentMouseMoveHandler = this.onHangIndentMouseMove.bind(this);
this.onHangIndentMouseUpHandler = this.onHangIndentMouseUp.bind(this);
this.onLeftIndentMouseDownHandler = this.onLeftIndentMouseDown.bind(this);
this.onLeftIndentMouseMoveHandler = this.onLeftIndentMouseMove.bind(this);
this.onLeftIndentMouseUpHandler = this.onLeftIndentMouseUp.bind(this);
this.onRightIndentMouseDownHandler = this.onRightIndentMouseDown.bind(this);
this.onRightIndentMouseMoveHandler = this.onRightIndentMouseMove.bind(this);
this.onRightIndentMouseUpHandler = this.onRightIndentMouseUp.bind(this);
this.onTabStopMouseDownHandler = this.onTabStopMouseDown.bind(this);
this.onTabStopMouseUpHandler = this.onTabStopMouseUp.bind(this);
this.onTabStopMouseMoveHandler = this.onTabStopMouseMove.bind(this);
this.onRenderTabStopMouseUpHandler = this.onRenderTabStopMouseUp.bind(this);
this.onTabStopDblClickHandler = this.onTabStopDblClick.bind(this);
this.isTopRulerMargin = false;
}
//Event handler methods
RulerHelper.prototype.onMarkIndicatorClick = function () {
var divElements = document.querySelector('.e-de-ruler-markIndicator');
for (var i = 0; i < divElements.childNodes.length; i++) {
var currentDiv = divElements.childNodes[parseInt(i.toString(), 10)];
if (currentDiv.style.display === 'block') {
currentDiv.style.display = 'none';
var nextIndex = (i + 1) % divElements.childNodes.length;
divElements.childNodes[parseInt(nextIndex.toString(), 10)].style.display = 'block';
break;
}
}
};
// private onHorizontalRulerMouseMove(e: MouseEvent): void {
// if (this.documentEditor.isDestroyed || !this.documentEditor.documentEditorSettings.showRuler) {
// return;
// }
// const divRect: DOMRect = this.hRuler.getBoundingClientRect() as DOMRect;
// const leftMargin: number = this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin
// * this.documentEditor.zoomFactor;
// const rightMargin: number = (HelperMethods.convertPixelToPoint(divRect.width) -
// this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.rightMargin * this.documentEditor.zoomFactor);
// let pixelValue: number = Math.round(e.clientX - divRect.left);
// let mouseXRelativeToDiv: number = HelperMethods.convertPixelToPoint(pixelValue);
// if (!this.isDragging) {
// if (this.documentEditor.isOnIndent) {
// this.hRuler.style.cursor = 'default';
// if (this.hRuler.hasAttribute('title')) {
// this.hRuler.removeAttribute('title');
// }
// this.resizerEnabled = false;
// } else if (((leftMargin - 3) <= mouseXRelativeToDiv) && ((leftMargin + 3) >= mouseXRelativeToDiv)) {
// if (this.documentEditor.layoutType === 'Pages') {
// this.hRuler.style.cursor = 'e-resize';
// this.hRuler.setAttribute('title', this.locale.getConstant('Left Margin'));
// this.resizerEnabled = true;
// this.isLeftRulerMargin = true;
// }
// } else if ((((rightMargin - 3) <= mouseXRelativeToDiv) && ((rightMargin + 3) >= mouseXRelativeToDiv))) {
// if (this.documentEditor.layoutType === 'Pages') {
// this.hRuler.style.cursor = 'e-resize';
// this.hRuler.setAttribute('title', this.locale.getConstant('Right Margin'));
// this.resizerEnabled = true;
// this.isLeftRulerMargin = false;
// }
// } else if (this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.columns.length > 0) {
// const columns: WColumnFormat[] = this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.columns;
// if (this.documentEditor.layoutType === 'Pages') {
// for (let i: number = 1; i <= columns.length; i++) {
// const rulerMarginDiv: HTMLElement = document.getElementById(this.documentEditor.element.id + '_hRuler_Margin' + i);
// const maginLeft: number = rulerMarginDiv.getBoundingClientRect().left;
// const width: number = rulerMarginDiv.getBoundingClientRect().width;
// if (((maginLeft - 3) <= e.clientX) && ((maginLeft + 3) >= e.clientX)) {
// this.hRuler.style.cursor = 'e-resize';
// this.multiColumnElement = rulerMarginDiv;
// this.hRuler.setAttribute('title', this.locale.getConstant('Left Margin'));
// this.isLeftMultiColumn = true;
// this.resizerEnabled = true;
// break;
// } else if (((maginLeft + width - 3) <= e.clientX) && ((maginLeft + width + 3) >= e.clientX)) {
// this.hRuler.style.cursor = 'e-resize';
// this.multiColumnElement = rulerMarginDiv;
// this.hRuler.setAttribute('title', this.locale.getConstant('Right Margin'));
// this.isRightMultiColumn = true;
// this.resizerEnabled = true;
// break;
// } else {
// this.hRuler.style.cursor = 'default';
// if (this.hRuler.hasAttribute('title')) {
// this.hRuler.removeAttribute('title');
// }
// this.isLeftMultiColumn = false;
// this.isRightMultiColumn = false;
// this.resizerEnabled = false;
// }
// }
// }
// }
// else {
// this.hRuler.style.cursor = 'default';
// if (this.hRuler.hasAttribute('title')) {
// this.hRuler.removeAttribute('title');
// }
// this.resizerEnabled = false;
// }
// }
// if (this.isDragging) {
// const rulerZeroPoint: number = HelperMethods.convertPointToPixel(
// 1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin) * this.documentEditor.zoomFactor;
// const pageWidth: number = this.documentEditor.selectionModule.sectionFormat.pageWidth;
// const rightMarginValue: number = this.documentEditor.selectionModule.sectionFormat.rightMargin;
// let rightIndentValue: number = this.documentEditor.selectionModule.paragraphFormat.rightIndent;
// rightIndentValue = rightIndentValue > 0 ? rightIndentValue : 0;
// const minimumValue: number = 42;
// let firstLineIndent: number = this.documentEditor.selectionModule.paragraphFormat.firstLineIndent;
// const leftMarginValue: number = this.documentEditor.selectionModule.sectionFormat.leftMargin;
// firstLineIndent = firstLineIndent >= 0 ? firstLineIndent : 0;
// const leftIndent: number = this.documentEditor.selectionModule.paragraphFormat.leftIndent;
// if (this.isLeftRulerMargin) {
// const leftMaxLimit: number = rulerZeroPoint + (
// HelperMethods.convertPointToPixel(pageWidth - rightMarginValue -
// rightIndentValue - minimumValue - firstLineIndent - leftIndent) * this.documentEditor.zoomFactor);
// const leftMinLimit: number = rulerZeroPoint;
// if (pixelValue + rulerZeroPoint > leftMaxLimit) {
// pixelValue = leftMaxLimit - rulerZeroPoint;
// mouseXRelativeToDiv = HelperMethods.convertPixelToPoint(pixelValue);
// } else if (pixelValue + rulerZeroPoint < leftMinLimit) {
// pixelValue = leftMinLimit - rulerZeroPoint;
// mouseXRelativeToDiv = HelperMethods.convertPixelToPoint(pixelValue);
// }
// } else {
// const rightMinLimit: number = rulerZeroPoint + (HelperMethods.convertPointToPixel(
// leftMarginValue + leftIndent + firstLineIndent + minimumValue + rightIndentValue) * this.documentEditor.zoomFactor);
// const rightMaxLimit: number = rulerZeroPoint + (HelperMethods.convertPointToPixel(
// pageWidth) * this.documentEditor.zoomFactor);
// if (pixelValue + rulerZeroPoint > rightMaxLimit) {
// pixelValue = rightMaxLimit - rulerZeroPoint;
// mouseXRelativeToDiv = HelperMethods.convertPixelToPoint(pixelValue);
// } else if (pixelValue + rulerZeroPoint < rightMinLimit) {
// pixelValue = rightMinLimit - rulerZeroPoint;
// mouseXRelativeToDiv = HelperMethods.convertPixelToPoint(pixelValue);
// }
// }
// this.finalmouseXRelativeToDiv = mouseXRelativeToDiv;
// const currentRightMargin: number = (HelperMethods.convertPixelToPoint(divRect.width)
// - (this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.rightMargin * this.documentEditor.zoomFactor));
// if (this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.numberOfColumns <= 1) {
// this.resizeRulerMargins(this.isLeftRulerMargin, this.initialValue,
// this.currentScrollLeft, currentRightMargin, this.hRuler, mouseXRelativeToDiv, true, this.documentEditor);
// }
// const rightIndent: HTMLElement = document.getElementById(this.documentEditor.element.id + '_rightIndent');
// if (this.isLeftRulerMargin) {
// const difference: number = mouseXRelativeToDiv - this.initialValue;
// rightIndent.style.left = (this.initialRightMargin - HelperMethods.convertPointToPixel(difference)) + 'px';
// } else {
// const difference: number = mouseXRelativeToDiv - this.initialValue;
// rightIndent.style.left = (this.initialRightMargin + HelperMethods.convertPointToPixel(difference)) + 'px';
// }
// const startValue: number = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
// const indicatorLineValue: number = startValue + pixelValue;
// const lineSvg: HTMLElement = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
// lineSvg.style.left = indicatorLineValue + 'px';
// }
// }
RulerHelper.prototype.onHRulerMouseEnter = function () {
if (!isNullOrUndefined(this.currentTabStopElement)) {
this.currentTabStopElement.style.display = 'block';
}
};
RulerHelper.prototype.onHRulerMouseLeave = function () {
if (!isNullOrUndefined(this.currentTabStopElement)) {
this.currentTabStopElement.style.display = 'none';
//this.currentTabStopElement = undefined;
}
};
RulerHelper.prototype.onRulerDblClick = function () {
this.documentEditor.showDialog('PageSetup');
};
RulerHelper.prototype.onHRulerMouseDown = function (e) {
if (this.resizerEnabled && !this.documentEditor.isTableMarkerDragging) {
this.isDraggingRender = true;
if (this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.columns.length > 0) {
if (this.isLeftMultiColumn) {
this.columnInitialValue = this.multiColumnElement.getBoundingClientRect().left;
}
else if (this.isRightMultiColumn) {
this.columnInitialValue = this.multiColumnElement.getBoundingClientRect().left
+ this.multiColumnElement.getBoundingClientRect().width;
}
}
var divRect_1 = this.hRuler.getBoundingClientRect();
this.renderInitialValue = HelperMethods.convertPixelToPoint(Math.round(e.clientX - divRect_1.left));
this.currentScrollLeft = this.hRuler.scrollLeft;
var rightIndent = document.getElementById(this.documentEditor.element.id + '_rightIndent');
this.initialRightMargin = HelperMethods.getNumberFromString(rightIndent.style.left);
var pixelValue = Math.round(e.clientX - divRect_1.left);
var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
var indicatorLineValue = startValue + pixelValue;
var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
lineSvg.style.left = indicatorLineValue + 'px';
lineSvg.style.display = 'block';
}
var divRect = this.hRuler.getBoundingClientRect();
if (divRect.y + (divRect.height / 2) <= e.clientY) {
this.mouseDownTabValue = e.clientX - this.hRuler.getBoundingClientRect().left;
if (this.documentEditor.layoutType === 'Pages') {
this.mouseDownTabValue = HelperMethods.convertPixelToPoint(this.mouseDownTabValue - HelperMethods.convertPointToPixel(this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin) *
this.documentEditor.zoomFactor);
if (this.position.paragraph.paragraphFormat.bidi) {
var paraWidth = !isNullOrUndefined(this.position.paragraph['absoluteXPosition']) ? parseFloat(this.position.paragraph['absoluteXPosition']['width'].toString()) : this.position.paragraph.width;
paraWidth = HelperMethods.convertPixelToPoint(paraWidth * this.documentEditor.zoomFactor);
this.mouseDownTabValue = paraWidth - this.mouseDownTabValue;
}
}
else if (this.documentEditor.layoutType === 'Continuous') {
if (this.position.paragraph.paragraphFormat.bidi) {
this.mouseDownTabValue = HelperMethods.convertPixelToPoint((this.mouseDownTabValue) - 20);
var paraWidth = !isNullOrUndefined(this.position.paragraph['absoluteXPosition']) ? parseFloat(this.position.paragraph['absoluteXPosition']['width'].toString()) : this.position.paragraph.width;
paraWidth = HelperMethods.convertPixelToPoint(paraWidth * this.documentEditor.zoomFactor);
this.mouseDownTabValue = paraWidth - this.mouseDownTabValue;
}
else {
this.mouseDownTabValue = HelperMethods.convertPixelToPoint((this.mouseDownTabValue) - 20);
}
}
}
};
RulerHelper.prototype.onHRulerMouseUp = function (e) {
var container = document.getElementById(this.documentEditor.element.id + '_markIndicator');
var divRect = this.hRuler.getBoundingClientRect();
if (divRect.y + (divRect.height / 2) <= e.clientY) {
this.mouseUpTabValue = e.clientX - this.hRuler.getBoundingClientRect().left;
if (this.documentEditor.layoutType === 'Pages') {
this.mouseUpTabValue = HelperMethods.convertPixelToPoint(this.mouseUpTabValue -
HelperMethods.convertPointToPixel(this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin)
* this.documentEditor.zoomFactor);
if (this.position.paragraph.paragraphFormat.bidi) {
var paraWidth = !isNullOrUndefined(this.position.paragraph['absoluteXPosition']) ? parseFloat(this.position.paragraph['absoluteXPosition']['width'].toString()) : this.position.paragraph.width;
paraWidth = HelperMethods.convertPixelToPoint(paraWidth * this.documentEditor.zoomFactor);
this.mouseUpTabValue = paraWidth - this.mouseUpTabValue;
}
}
else if (this.documentEditor.layoutType === 'Continuous') {
if (this.position.paragraph.paragraphFormat.bidi) {
this.mouseUpTabValue = HelperMethods.convertPixelToPoint((this.mouseUpTabValue) - 20);
var paraWidth = !isNullOrUndefined(this.position.paragraph['absoluteXPosition']) ? parseFloat(this.position.paragraph['absoluteXPosition']['width'].toString()) : this.position.paragraph.width;
paraWidth = HelperMethods.convertPixelToPoint(paraWidth * this.documentEditor.zoomFactor);
this.mouseUpTabValue = paraWidth - this.mouseUpTabValue;
}
else {
this.mouseUpTabValue = HelperMethods.convertPixelToPoint((this.mouseUpTabValue) - 20);
}
}
var rightIndent = document.getElementById(this.documentEditor.element.id + '_rightIndent');
var rightIndentValue = HelperMethods.getNumberFromString(rightIndent.style.left);
var maxValue = rightIndentValue;
if (this.mouseUpTabValue > 0 && this.mouseUpTabValue < maxValue && this.mouseDownTabValue === this.mouseUpTabValue) {
if (!isNullOrUndefined(container)) {
var visibleElement = container.querySelector('.e-de-ruler-marker[style*="display: block;"]');
if (!isNullOrUndefined(visibleElement)) {
this.mouseUpTabValue /= this.documentEditor.zoomFactor;
var dataNameValue = visibleElement.getAttribute('data-name');
if (dataNameValue === 'LeftTab' || dataNameValue === 'CenterTab'
|| dataNameValue === 'RightTab' || dataNameValue === 'DecimalTab' || dataNameValue === 'BarTab') {
var tabStop = new WTabStop();
tabStop.position = this.mouseUpTabValue;
tabStop.tabJustification = this.getTabJustification(dataNameValue);
tabStop.deletePosition = 0;
tabStop.tabLeader = 'None';
this.documentEditor.editorModule.onApplyParagraphFormat('tabStop', [tabStop], false, false);
}
else if (dataNameValue === 'FirstLineIndent' || dataNameValue === 'HangingIndent') {
var property = 'firstLineIndent';
if (dataNameValue === 'HangingIndent') {
var initialValue = this.documentEditor.selectionModule.paragraphFormat.firstLineIndent;
var differenceValue = this.mouseUpTabValue + initialValue;
var currentValue = this.documentEditor.selectionModule.start.paragraph.paragraphFormat.firstLineIndent;
this.documentEditor.editorModule.onApplyParagraphFormat('firstLineIndent', currentValue - differenceValue, false, false);
var leftIndentCurrentValue = this.documentEditor.selectionModule.start.paragraph.paragraphFormat.leftIndent + currentValue;
currentValue = currentValue - differenceValue;
this.documentEditor.editorModule.onApplyParagraphFormat('leftIndent', leftIndentCurrentValue - currentValue, false, false, true);
}
else {
this.documentEditor.editorModule.onApplyParagraphFormat(property, this.mouseDownTabValue, false, false);
}
}
}
}
}
}
};
RulerHelper.prototype.onRularMouseUp = function (e) {
if (this.isDraggingRender && !this.documentEditor.isTableMarkerDragging) {
var divRect = this.hRuler.getBoundingClientRect();
var mouseXRelativeToDiv = this.finalmouseXRelativeToDiv; // HelperMethods.convertPixelToPoint(Math.round(e.clientX - divRect.left));
// const currentLeftMargin = documentEditor.hRuler.startMargin * documentEditor.zoomFactor;
// const currentScrollLeft = hRuler.scrollLeft;
// const currentRightMargin = (HelperMethods.convertPixelToPoint(divRect.width) - (documentEditor.selection.end.paragraph.bodyWidget.sectionFormat.rightMargin * documentEditor.zoomFactor));
// resizeRulerMargins(isLeftRulerMargin, currentLeftMargin, currentScrollLeft, currentRightMargin, hRuler, mouseXRelativeToDiv, true, documentEditor);
// if (hRuler) {
// rulerObj.scrollLeft = rulerObj.scrollLeft - HelperMethods.convertPointToPixel((documentEditor.hRuler.leftMargin < mouseXRelativeToDiv) ? (mouseXRelativeToDiv - documentEditor.hRuler.leftMargin) : (documentEditor.hRuler.leftMargin - mouseXRelativeToDiv));
// }
// updateRuler(documentEditor, documentEditor.hRuler, true);
if (this.isLeftMultiColumn || this.isRightMultiColumn) {
var finalvalue = 0;
finalvalue = e.clientX - this.columnInitialValue;
var secFormat = this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.cloneFormat();
var pageWidth = this.documentEditor.selectionModule.sectionFormat.pageWidth
- this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin -
this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.rightMargin;
var columnSpace = this.isLeftMultiColumn ? (secFormat.columns[0].space +
((HelperMethods.convertPixelToPoint(finalvalue))))
: (secFormat.columns[0].space - ((HelperMethods.convertPixelToPoint(finalvalue))));
for (var i = 0; i < secFormat.columns.length; i++) {
var col = secFormat.columns[parseInt(i.toString(), 10)];
if (columnSpace >= 0 && col.width >= 36) {
var widthCal = HelperMethods.convertPointToPixel((pageWidth - (HelperMethods.convertPixelToPoint(columnSpace) * (secFormat.numberOfColumns - 1))) / (secFormat.numberOfColumns));
col.width = widthCal;
if (i < secFormat.columns.length - 1) {
col.space = columnSpace;
}
}
else {
col[0].space = col[1].space;
}
}
this.documentEditor.editorModule.onApplySectionFormat(undefined, secFormat);
this.isLeftMultiColumn = false;
this.isRightMultiColumn = false;
}
else if (this.isLeftRulerMargin) {
this.documentEditor.hRuler.startMargin = (mouseXRelativeToDiv / this.documentEditor.zoomFactor);
this.documentEditor.selectionModule.sectionFormat.leftMargin = mouseXRelativeToDiv / this.documentEditor.zoomFactor;
}
else {
var rightMargin = HelperMethods.convertPixelToPoint(this.rulerGeometry.width) - (mouseXRelativeToDiv / this.documentEditor.zoomFactor);
// documentEditor.hRuler.endMargin = rightMargin;
this.documentEditor.selectionModule.sectionFormat.rightMargin = rightMargin;
}
this.resizerEnabled = false;
this.isDraggingRender = false;
this.isLeftRulerMargin = undefined;
var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
lineSvg.style.display = 'none';
}
};
RulerHelper.prototype.onVMouseMove = function (e) {
if (this.documentEditor.isDestroyed || !this.documentEditor.documentEditorSettings.showRuler) {
return;
}
var divRect = this.vRuler.getBoundingClientRect();
var topMargin = this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.topMargin
* this.documentEditor.zoomFactor;
var bottomMargin = (HelperMethods.convertPixelToPoint(divRect.height) - this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.bottomMargin
* this.documentEditor.zoomFactor);
var mouseXRelativeToDiv = HelperMethods.convertPixelToPoint(Math.round(e.clientY - divRect.top));
var pixelValue = Math.round(e.clientY - divRect.top);
if (!this.isDraggingRender) {
if (((topMargin - 3) <= mouseXRelativeToDiv) && ((topMargin + 3) >= mouseXRelativeToDiv)) {
this.vRuler.style.cursor = 'n-resize';
this.vRuler.setAttribute('title', this.locale.getConstant('Top Margin'));
this.resizerEnabled = true;
this.isTopRulerMargin = true;
}
else if ((((bottomMargin - 3) <= mouseXRelativeToDiv) && ((bottomMargin + 3) >= mouseXRelativeToDiv))) {
this.vRuler.style.cursor = 'n-resize';
this.vRuler.setAttribute('title', this.locale.getConstant('Bottom Margin'));
this.resizerEnabled = true;
this.isTopRulerMargin = false;
}
else {
this.vRuler.style.cursor = 'default';
if (this.vRuler.hasAttribute('title')) {
this.vRuler.removeAttribute('title');
}
this.resizerEnabled = false;
}
}
if (this.isDraggingRender) {
var mouseXRelativeToDiv_1 = HelperMethods.convertPixelToPoint(Math.round(e.clientY - divRect.top));
var rulerZeroPoint = HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.topMargin)
* this.documentEditor.zoomFactor;
var pageHeight = this.documentEditor.selectionModule.sectionFormat.pageHeight;
var minimumValue = 12;
var bottomMarginValue = this.documentEditor.selectionModule.sectionFormat.bottomMargin;
var topMarginValue = this.documentEditor.selectionModule.sectionFormat.topMargin;
if (this.isTopRulerMargin) {
var topMinLimit = rulerZeroPoint;
var topMaxLimit = rulerZeroPoint + (HelperMethods.convertPointToPixel(pageHeight - bottomMarginValue - minimumValue) * this.documentEditor.zoomFactor);
if (pixelValue + rulerZeroPoint > topMaxLimit) {
pixelValue = topMaxLimit - rulerZeroPoint;
mouseXRelativeToDiv_1 = HelperMethods.convertPixelToPoint(pixelValue);
}
else if (pixelValue + rulerZeroPoint < topMinLimit) {
pixelValue = topMinLimit - rulerZeroPoint;
mouseXRelativeToDiv_1 = HelperMethods.convertPixelToPoint(pixelValue);
}
}
else {
var bottomMinLimit = rulerZeroPoint + (HelperMethods.convertPointToPixel(topMarginValue + minimumValue) * this.documentEditor.zoomFactor);
var bottomMaxLimit = rulerZeroPoint + (HelperMethods.convertPointToPixel(pageHeight) * this.documentEditor.zoomFactor);
if (pixelValue + rulerZeroPoint > bottomMaxLimit) {
pixelValue = bottomMaxLimit - rulerZeroPoint;
mouseXRelativeToDiv_1 = HelperMethods.convertPixelToPoint(pixelValue);
}
else if (pixelValue + rulerZeroPoint < bottomMinLimit) {
pixelValue = bottomMinLimit - rulerZeroPoint;
mouseXRelativeToDiv_1 = HelperMethods.convertPixelToPoint(pixelValue);
}
}
var currentBottomMargin = (HelperMethods.convertPixelToPoint(divRect.height) -
(this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.bottomMargin * this.documentEditor.zoomFactor));
this.resizeVRulerMargins(this.isTopRulerMargin, this.initialYValue, this.currentScrollTop, currentBottomMargin, this.vRuler, mouseXRelativeToDiv_1, this.documentEditor);
var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.y * this.documentEditor.zoomFactor;
var indicatorLineValue = startValue + pixelValue; // + 15;
var lineSvg = document.getElementById(this.documentEditor.element.id + '_vRuler_indicator_svg');
lineSvg.style.top = indicatorLineValue + 'px';
}
};
RulerHelper.prototype.onVMouseDown = function (e) {
if (this.resizerEnabled) {
this.isDraggingRender = true;
var divRect = this.vRuler.getBoundingClientRect();
this.initialYValue = HelperMethods.convertPixelToPoint(Math.round(e.clientY - divRect.top));
this.currentScrollTop = this.vRuler.scrollTop;
var pixelValue = Math.round(e.clientY - divRect.top);
var lineSvg = document.getElementById(this.documentEditor.element.id + '_vRuler_indicator_svg');
var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.y * this.documentEditor.zoomFactor;
var indicatorLineValue = (startValue + pixelValue); // + 15;
lineSvg.style.top = indicatorLineValue + 'px';
lineSvg.style.display = 'block';
}
};
RulerHelper.prototype.onVMouseUp = function (e) {
if (this.isDraggingRender) {
var divRect = this.vRuler.getBoundingClientRect();
var mouseXRelativeToDiv = HelperMethods.convertPixelToPoint(Math.round(e.clientY - divRect.top));
// const currentTopMargin = documentEditor.hRuler.startMargin * documentEditor.zoomFactor;
// const currentScrollTop = vRuler.scrollTop;
// const currentBottomMargin = (HelperMethods.convertPixelToPoint(divRect.height) - (documentEditor.selection.end.paragraph.bodyWidget.sectionFormat.bottomMargin * documentEditor.zoomFactor));
// resizeVRulerMargins(isTopRulerMargin, currentTopMargin, currentScrollTop, currentBottomMargin, vRuler, mouseXRelativeToDiv, documentEditor);
// if (hRuler) {
// rulerObj.scrollLeft = rulerObj.scrollLeft - HelperMethods.convertPointToPixel((documentEditor.hRuler.leftMargin < mouseXRelativeToDiv) ? (mouseXRelativeToDiv - documentEditor.hRuler.leftMargin) : (documentEditor.hRuler.leftMargin - mouseXRelativeToDiv));
// }
// updateRuler(documentEditor, documentEditor.hRuler, true);
if (this.isTopRulerMargin) {
this.documentEditor.vRuler.startMargin = (mouseXRelativeToDiv / this.documentEditor.zoomFactor);
this.documentEditor.selectionModule.sectionFormat.topMargin = mouseXRelativeToDiv / this.documentEditor.zoomFactor;
}
else {
var bottomtMargin = HelperMethods.convertPixelToPoint(this.rulerGeometry.height) - (mouseXRelativeToDiv / this.documentEditor.zoomFactor);
this.documentEditor.vRuler.endMargin = bottomtMargin;
this.documentEditor.selectionModule.sectionFormat.bottomMargin = bottomtMargin;
}
this.resizerEnabled = false;
this.isDraggingRender = false;
var lineSvg = document.getElementById(this.documentEditor.element.id + '_vRuler_indicator_svg');
lineSvg.style.display = 'none';
this.isTopRulerMargin = undefined;
}
};
RulerHelper.prototype.onDocumentIntentTrue = function () {
this.documentEditor.isOnIndent = true;
};
RulerHelper.prototype.onDocumentIntentFalse = function () {
this.documentEditor.isOnIndent = false;
};
RulerHelper.prototype.onDoubleClick = function (event) {
this.documentEditor.showDialog('Paragraph');
event.stopPropagation();
};
RulerHelper.prototype.onFirstLineIndentMouseDown = function (e) {
this.isDraggingIndents1 = true;
this.firstLineOffset = e.clientX - this.firstLineIndent.getBoundingClientRect().left;
this.indentInitialValue = HelperMethods.getNumberFromString(this.firstLineIndent.style.left);
var rulerZeroPoint = HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin) * this.documentEditor.zoomFactor;
if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
rulerZeroPoint = HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin -
(this.documentEditor.selectionModule.sectionFormat.pageWidth -
this.documentEditor.selectionModule.sectionFormat.leftMargin -
this.documentEditor.selectionModule.sectionFormat.rightMargin)) * this.documentEditor.zoomFactor;
}
if (this.documentEditor.layoutType === 'Continuous') {
rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20;
if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) -
20 - (this.documentEditor.viewer.clientArea.width * this.documentEditor.zoomFactor);
}
}
var value = rulerZeroPoint + e.clientX - this.firstLineOffset - this.hRuler.getBoundingClientRect().left;
var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
startValue = this.documentEditor.layoutType === 'Continuous' ? 0 : startValue;
var indicatorLineValue = startValue + (value - rulerZeroPoint) + 6;
var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
lineSvg.style.left = indicatorLineValue + 'px';
lineSvg.style.display = 'block';
e.stopPropagation();
};
RulerHelper.prototype.onIndentMouseMove = function (e) {
if (this.isDraggingIndents1) {
var rulerZeroPoint = void 0;
var maxValue = void 0;
var minValue = void 0;
var rightIndent = document.getElementById(this.documentEditor.element.id + '_rightIndent');
var rightIndentValue = HelperMethods.getNumberFromString(rightIndent.style.left);
if (this.documentEditor.layoutType === 'Pages') {
if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
rulerZeroPoint = HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin -
(this.documentEditor.selectionModule.sectionFormat.pageWidth -
this.documentEditor.selectionModule.sectionFormat.leftMargin -
this.documentEditor.selectionModule.sectionFormat.rightMargin)) * this.documentEditor.zoomFactor;
maxValue = rulerZeroPoint - 6 + (HelperMethods.convertPointToPixel(this.documentEditor.selectionModule.sectionFormat.pageWidth) * this.documentEditor.zoomFactor);
minValue = rightIndentValue + HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor;
}
else {
rulerZeroPoint = HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin)
* this.documentEditor.zoomFactor;
minValue = rulerZeroPoint - 6;
maxValue = rightIndentValue - HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor;
}
}
else if (this.documentEditor.layoutType === 'Continuous') {
if (this.position.paragraph.paragraphFormat.bidi) {
rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) -
20 - (this.documentEditor.viewer.clientArea.width * this.documentEditor.zoomFactor);
maxValue = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20 + 40 - 6;
minValue = rightIndentValue + (HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
}
else {
rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20;
minValue = rulerZeroPoint - 6;
maxValue = rightIndentValue - (HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
}
}
var value = rulerZeroPoint + e.clientX - this.firstLineOffset - this.hRuler.getBoundingClientRect().left;
if (value < minValue) {
value = minValue;
}
else if (value > maxValue) {
value = maxValue;
}
this.firstLineIndent.style.left = value + 'px';
var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
startValue = this.documentEditor.layoutType === 'Continuous' ? 0 : startValue;
var indicatorLineValue = startValue + (value - rulerZeroPoint) + 6;
var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
lineSvg.style.left = indicatorLineValue + 'px';
}
};
RulerHelper.prototype.onIndentMouseUp = function (e) {
if (this.isDraggingIndents1) {
this.isDraggingIndents1 = false;
var finalValue = HelperMethods.getNumberFromString(this.firstLineIndent.style.left);
if (parseInt(this.firstLineIndent.style.left.replace('px', ''), 10) < 0) {
finalValue *= -1;
}
if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
this.documentEditor.editorModule.applyRulerMarkerValues('firstLineIndent', finalValue, this.indentInitialValue);
}
else {
this.documentEditor.editorModule.applyRulerMarkerValues('firstLineIndent', this.indentInitialValue, finalValue);
}
this.indentInitialValue = finalValue;
var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
lineSvg.style.display = 'none';
}
};
RulerHelper.prototype.onHangIndentMouseDown = function (e) {
this.isDraggingIndents2 = true;
this.hangingLineOffset = e.clientX - this.hangingIndent.getBoundingClientRect().left;
this.hangingIndentInitialValue = HelperMethods.getNumberFromString(this.hangingIndent.style.left);
var rightIndent = document.getElementById(this.documentEditor.element.id + '_rightIndent');
var rightPosition = HelperMethods.getNumberFromString(rightIndent.style.left);
var rulerZeroPoint;
if (this.documentEditor.layoutType === 'Pages') {
if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
rulerZeroPoint = HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin -
(this.documentEditor.selectionModule.sectionFormat.pageWidth -
this.documentEditor.selectionModule.sectionFormat.leftMargin -
this.documentEditor.selectionModule.sectionFormat.rightMargin)) * this.documentEditor.zoomFactor;
this.minLimit1 = rightPosition + (HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
this.maxLimit1 = rulerZeroPoint - 6 + (HelperMethods.convertPointToPixel(this.documentEditor.selectionModule.sectionFormat.pageWidth) * this.documentEditor.zoomFactor);
}
else {
rulerZeroPoint = HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin) * this.documentEditor.zoomFactor;
this.minLimit1 = rulerZeroPoint - 6;
this.maxLimit1 = (rightPosition - HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
}
}
else if (this.documentEditor.layoutType === 'Continuous') {
if (this.position.paragraph.paragraphFormat.bidi) {
rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) -
20 - (this.documentEditor.viewer.clientArea.width * this.documentEditor.zoomFactor);
this.maxLimit1 = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20 + 40 - 6;
this.minLimit1 = rightPosition + (HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
}
else {
rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20;
this.minLimit1 = rulerZeroPoint - 6;
this.maxLimit1 = (rightPosition - HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
}
}
this.leftIndent1 = document.getElementById(this.documentEditor.element.id + '_leftIndent');
var value = rulerZeroPoint + e.clientX - this.hangingLineOffset - this.hRuler.getBoundingClientRect().left;
var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
startValue = this.documentEditor.layoutType === 'Continuous' ? 0 : startValue;
var indicatorLineValue = startValue + (value - rulerZeroPoint) + 6;
var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
lineSvg.style.left = indicatorLineValue + 'px';
lineSvg.style.display = 'block';
e.stopPropagation();
};
RulerHelper.prototype.onHangIndentMouseMove = function (e) {
if (this.isDraggingIndents2) {
var rulerZeroPoint = void 0;
if (this.documentEditor.layoutType === 'Pages') {
if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
rulerZeroPoint = HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin -
(this.documentEditor.selectionModule.sectionFormat.pageWidth -
this.documentEditor.selectionModule.sectionFormat.leftMargin -
this.documentEditor.selectionModule.sectionFormat.rightMargin)) * this.documentEditor.zoomFactor;
}
else {
rulerZeroPoint = HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin) * this.documentEditor.zoomFactor;
}
}
else if (this.documentEditor.layoutType === 'Continuous') {
if (this.position.paragraph.paragraphFormat.bidi) {
rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) -
20 - (this.documentEditor.viewer.clientArea.width * this.documentEditor.zoomFactor);
}
else {
rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20;
}
}
var value = rulerZeroPoint + e.clientX - this.hangingLineOffset - this.hRuler.getBoundingClientRect().left;
if ((value) > this.maxLimit1) {
value = this.maxLimit1;
}
else if (value < this.minLimit1) {
value = this.minLimit1;
}
this.leftIndent1.style.left = value + 'px';
this.hangingIndent.style.left = value + 'px';
var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
startValue = this.documentEditor.layoutType === 'Continuous' ? 0 : startValue;
var indicatorLineValue = startValue + (value - rulerZeroPoint) + 6;
var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
lineSvg.style.left = indicatorLineValue + 'px';
}
};
RulerHelper.prototype.onHangIndentMouseUp = function (e) {
if (this.isDraggingIndents2) {
this.isDraggingIndents2 = false;
var finalValue = HelperMethods.getNumberFromString(this.hangingIndent.style.left);
if (parseInt(this.hangingIndent.style.left.replace('px', ''), 10) < 0) {
finalValue *= -1;
}
if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
this.documentEditor.editorModule.applyRulerMarkerValues('hangingIndent', finalValue, this.hangingIndentInitialValue);
}
else {
this.documentEditor.editorModule.applyRulerMarkerValues('hangingIndent', this.hangingIndentInitialValue, finalValue);
}
this.hangingIndentInitialValue = finalValue;
var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
lineSvg.style.display = 'none';
}
};
RulerHelper.prototype.onLeftIndentMouseDown = function (e) {
var rulerZeroPoint;
this.isDraggingIndents3 = true;
this.leftLineOffset = e.clientX - this.leftIndent.getBoundingClientRect().left;
this.indentInitialValue = HelperMethods.getNumberFromString(this.leftIndent.style.left);
this.firstIndentInitialValue = HelperMethods.getNumberFromString(this.firstLineIndent.style.left);
this.diff = this.firstIndentInitialValue - this.indentInitialValue;
this.firstLineIndent = document.getElementById(this.documentEditor.element.id + '_firstLineIndent');
var rightIndent = document.getElementById(this.documentEditor.element.id + '_rightIndent');
var rightPosition = HelperMethods.getNumberFromString(rightIndent.style.left);
if (this.documentEditor.layoutType === 'Pages') {
if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
rulerZeroPoint = HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin -
(this.documentEditor.selectionModule.sectionFormat.pageWidth -
this.documentEditor.selectionModule.sectionFormat.leftMargin -
this.documentEditor.selectionModule.sectionFormat.rightMargin)) * this.documentEditor.zoomFactor;
this.minLimit2 = (rightPosition + HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
this.maxLimit2 = rulerZeroPoint - 6 + (HelperMethods.convertPointToPixel(this.documentEditor.selectionModule.sectionFormat.pageWidth) * this.documentEditor.zoomFactor);
this.isHangingIndent = (HelperMethods.getNu