@syncfusion/ej2-spreadsheet
Version:
Feature-rich JavaScript Spreadsheet (Excel) control with built-in support for selection, editing, formatting, importing and exporting to Excel
1,100 lines • 117 kB
JavaScript
import { Browser, setStyleAttribute as setBaseStyleAttribute, getComponent, detach, isNullOrUndefined, removeClass, extend, isUndefined } from '@syncfusion/ej2-base';
import { completeAction } from './index';
import { invalidData, refreshFilterCellsOnResize } from './../common/index';
import { activeCellMergedRange, Cell, duplicateSheet, getSheetIndex, getSheetIndexFromAddress, getSheetIndexFromId, getSheetNameFromAddress, hideShow, moveSheet, protectsheetHandler, refreshChartSize, refreshRibbonIcons, replace, replaceAll, setLinkModel, setLockCells, updateSheetFromDataSource } from '../../workbook/index';
import { clearViewer, deleteImage, createImageElement, refreshImgCellObj, removeDataValidation } from './index';
import { removeSheetTab, rowHeightChanged, initiateFilterUI, deleteChart } from '../index';
import { getColumnsWidth, getSwapRange, isImported } from '../../workbook/index';
import { getRangeIndexes, wrap, setRowHeight, insertModel, getColumnWidth } from '../../workbook/index';
import { initiateSort, getIndexesFromAddress, getRowHeight, isLocked } from '../../workbook/index';
import { cellValidation, clearCFRule, getColumn, getRow, updateCell } from '../../workbook/index';
import { getCell, setChart, setVisibleMergeIndex, Row, Sheet, Column } from '../../workbook/index';
import { setCFRule, setMerge, setAutoFill, getautofillDDB, getRowsHeight, deleteModel } from '../../workbook/index';
import { workbookFormulaOperation, getAddressInfo, getSheet, setCellFormat, updateCFModel } from '../../workbook/index';
import { checkUniqueRange, applyCF, skipHiddenIdx, isFilterHidden } from '../../workbook/index';
import { applyProtect, chartDesignTab, copy, cut, getColIdxFromClientX, getRowIdxFromClientY, goToSheet, hideSheet, paste, performUndoRedo, refreshChartCellObj, removeHyperlink, removeWorkbookProtection, setProtectWorkbook, sheetNameUpdate, showSheet } from './event';
import { keyCodes } from './constant';
/**
* The function used to update Dom using requestAnimationFrame.
*
* @param {Function} fn - Function that contains the actual action
* @param {Spreadsheet} context - Specify the spreadsheet.
* @returns {void}
* @hidden
*/
export function getUpdateUsingRaf(fn, context) {
if (context) {
if (context.rafIds.length > 0) {
context.rafIds.forEach(function (id) { return cancelAnimationFrame(id); });
context.rafIds.length = 0;
}
var rafId_1 = requestAnimationFrame(function () {
fn();
var index = context.rafIds.indexOf(rafId_1);
if (index !== -1) {
context.rafIds.splice(index, 1);
}
});
context.rafIds.push(rafId_1);
}
else {
requestAnimationFrame(function () {
fn();
});
}
}
/**
* The function used to remove the dom element children.
*
* @param {Element} parent - Specify the parent
* @returns {void} - The function used to get colgroup width based on the row index.
* @hidden
*/
export function removeAllChildren(parent) {
while (parent.firstChild) {
parent.removeChild(parent.firstChild);
}
}
/**
* The function used to get colgroup width based on the row index.
*
* @param {number} index - Specify the index
* @returns {number} - The function used to get colgroup width based on the row index.
* @hidden
*/
export function getColGroupWidth(index) {
var width = 30;
if (index.toString().length > 3) {
width = index.toString().length * 10;
}
return width;
}
var scrollAreaWidth = null;
var textLineHeight = 1.24;
/**
* @hidden
* @returns {number} - To get scrollbar width
*/
export function getScrollBarWidth() {
if (scrollAreaWidth !== null) {
return scrollAreaWidth;
}
var htmlDivNode = document.createElement('div');
var result = 0;
htmlDivNode.style.cssText = 'width:100px;height: 100px;overflow: scroll;position: absolute;top: -9999px;';
document.body.appendChild(htmlDivNode);
result = (htmlDivNode.offsetWidth - htmlDivNode.clientWidth) | 0;
document.body.removeChild(htmlDivNode);
return scrollAreaWidth = result;
}
/**
* @hidden
* @param {HTMLElement} element - Specify the element.
* @param {string[]} classList - Specify the classList
* @param {number} scaleY - Specify the scaleY value.
* @returns {number} - get Siblings Height
*/
export function getSiblingsHeight(element, classList, scaleY) {
if (scaleY === void 0) { scaleY = 1; }
classList = classList || ['e-ribbon', 'e-formula-bar-panel', 'e-sheet-tab-panel', 'e-header-toolbar'];
var previous = getHeightFromDirection(element, 'previous', classList, scaleY);
var next = getHeightFromDirection(element, 'next', classList, scaleY);
return previous + next;
}
/**
* @param {HTMLElement} element - Specify the element.
* @param {string} direction - Specify the direction.
* @param {string[]} classList - Specify the classList.
* @param {number} scaleY - Specify the scaleY value.
* @returns {number} - get Height FromDirection
*/
function getHeightFromDirection(element, direction, classList, scaleY) {
var sibling = (element)[direction + 'ElementSibling'];
var result = 0;
while (sibling) {
if (classList.some(function (value) { return sibling.classList.contains(value); })) {
result += (sibling.getBoundingClientRect().height * scaleY);
}
sibling = (sibling)[direction + 'ElementSibling'];
}
return result;
}
/**
* @hidden
* @param {Spreadsheet} context - Specify the spreadsheet.
* @param {number[]} range - Specify the range.
* @param {boolean} isModify - Specify the boolean value.
* @returns {boolean} - Returns boolean value.
*/
export function inView(context, range, isModify) {
if (context.scrollSettings.enableVirtualization) {
var sheet = context.getActiveSheet();
var frozenRow = context.frozenRowCount(sheet);
var frozenCol = context.frozenColCount(sheet);
var topIdx = context.viewport.topIndex + frozenRow;
var leftIdx = context.viewport.leftIndex + frozenCol;
var bottomIdx = context.viewport.bottomIndex;
var rightIdx = context.viewport.rightIndex;
if (sheet.frozenRows || sheet.frozenColumns) {
if (context.insideViewport(range[0], range[1]) || context.insideViewport(range[2], range[3])) {
return true;
}
}
else if (topIdx <= range[0] && bottomIdx >= range[2] && leftIdx <= range[1] && rightIdx >= range[3]) {
return true;
}
var inView_1 = false;
if (isModify) {
if (range[0] < topIdx && range[2] < topIdx || range[0] > bottomIdx && range[2] > bottomIdx) {
return false;
}
else {
if (range[0] < topIdx && range[2] > topIdx && range[0] >= frozenRow) {
range[0] = topIdx;
inView_1 = true;
}
if (range[2] > bottomIdx) {
range[2] = bottomIdx;
inView_1 = true;
}
}
if (range[1] < leftIdx && range[3] < leftIdx || range[1] > rightIdx && range[3] > rightIdx) {
return false;
}
else {
if (range[1] < leftIdx && range[3] > leftIdx && range[1] >= frozenCol) {
range[1] = leftIdx;
inView_1 = true;
}
if (range[3] > rightIdx) {
range[3] = rightIdx;
inView_1 = true;
}
}
}
return inView_1;
}
else {
return true;
}
}
/**
* To get the top left cell position in viewport.
*
* @hidden
* @param {SheetModel} sheet - Specify the sheet.
* @param {number[]} indexes - Specify the indexes.
* @param {number} frozenRow - Specify the frozen row.
* @param {number} frozenColumn - Specify the frozen column
* @param {number} freezeScrollHeight - Specify the freeze scroll height
* @param {number} freezeScrollWidth - Specify the freeze scroll width
* @param {number} rowHdrWidth - Specify the row header width
* @param {boolean} isOverlay - Specify the overlay.
* @returns {number} - To get the top left cell position in viewport.
*/
export function getCellPosition(sheet, indexes, frozenRow, frozenColumn, freezeScrollHeight, freezeScrollWidth, rowHdrWidth, isOverlay) {
var i;
var offset = { left: { idx: 0, size: 0 }, top: { idx: 0, size: 0 } };
var top = offset.top.size;
var left = offset.left.size;
for (i = offset.top.idx; i < indexes[0]; i++) {
if (frozenRow) {
if (frozenRow - 1 < indexes[0] && i < frozenRow) {
continue;
}
}
top += getRowHeight(sheet, i, !isOverlay);
}
for (i = offset.left.idx; i < indexes[1]; i++) {
if (frozenColumn && frozenColumn - 1 < indexes[1] && i < frozenColumn) {
continue;
}
left += getColumnWidth(sheet, i, null, !isOverlay);
}
if (frozenRow && indexes[0] < frozenRow) {
if (sheet.showHeaders) {
top += 30;
}
if (freezeScrollHeight) {
top -= freezeScrollHeight;
}
}
if (frozenColumn && indexes[1] < frozenColumn) {
if (sheet.showHeaders) {
left += rowHdrWidth ? rowHdrWidth : 30;
}
if (freezeScrollWidth) {
left -= freezeScrollWidth;
}
}
return { top: top, left: left };
}
/**
* @param {Spreadsheet} parent - Specify the parent
* @param {HTMLElement} ele - Specify the element
* @param {number[]} range - Specify the range
* @param {string} cls - Specify the class name
* @param {boolean} preventAnimation - Specify the preventAnimation.
* @param {boolean} isMultiRange - Specify the multi range selection.
* @param {boolean} removeCls - Specify to remove the class from selection.
* @returns {void} - To set the position
* @hidden
*/
export function setPosition(parent, ele, range, cls, preventAnimation, isMultiRange, removeCls) {
if (cls === void 0) { cls = 'e-selection'; }
var sheet = parent.getActiveSheet();
if (sheet.frozenRows || sheet.frozenColumns) {
var content_1;
var frozenRow_1 = parent.frozenRowCount(sheet);
var frozenCol_1 = parent.frozenColCount(sheet);
if (cls === 'e-active-cell') {
if (range[0] < frozenRow_1 || range[1] < frozenCol_1) {
ele.style.display = 'none';
content_1 = range[0] < frozenRow_1 && range[1] < frozenCol_1 ? parent.getSelectAllContent() :
(range[0] < frozenRow_1 ? parent.getColumnHeaderContent() : parent.getRowHeaderContent());
var rangeEle = content_1.querySelector('.' + cls);
if (!rangeEle) {
rangeEle = ele.cloneNode(true);
content_1.appendChild(rangeEle);
}
ele = rangeEle;
locateElem(parent, ele, range, sheet, parent.enableRtl, frozenRow_1, frozenCol_1, preventAnimation, true, parent.viewport.beforeFreezeHeight, parent.viewport.beforeFreezeWidth, parent.sheetModule.colGroupWidth);
}
else {
locateElem(parent, ele, range, sheet, parent.enableRtl, frozenRow_1, frozenCol_1, preventAnimation);
}
if (ele.style.display) {
ele.style.display = '';
}
removeRangeEle(parent.getSelectAllContent(), content_1, 'e-active-cell');
removeRangeEle(parent.getColumnHeaderContent(), content_1, 'e-active-cell');
removeRangeEle(parent.getRowHeaderContent(), content_1, 'e-active-cell');
}
else if (cls === 'e-autofill') {
var contentElem = void 0;
var freezeRow = parent.frozenRowCount(sheet);
var freezeCol = parent.frozenColCount(sheet);
if (range[0] < freezeRow || range[1] < freezeCol) {
ele.style.display = 'none';
contentElem = range[0] < freezeRow && range[1] < freezeCol ? parent.getSelectAllContent() :
(range[0] < freezeRow ? parent.getColumnHeaderContent() : parent.getRowHeaderContent());
var rangeEle = contentElem.querySelector('.' + cls);
if (!rangeEle) {
rangeEle = ele.cloneNode(true);
contentElem.appendChild(rangeEle);
}
ele = rangeEle;
locateElem(parent, ele, range, sheet, parent.enableRtl, freezeRow, freezeCol, preventAnimation, true, parent.viewport.beforeFreezeHeight, parent.viewport.beforeFreezeWidth, parent.sheetModule.colGroupWidth, 'e-autofill');
}
else {
locateElem(parent, ele, range, sheet, parent.enableRtl, freezeRow, freezeCol, preventAnimation, false, 0, 0, 0, 'e-autofill');
}
if (ele.style.display) {
ele.style.display = '';
}
removeRangeEle(parent.getSelectAllContent(), contentElem, 'e-autofill');
removeRangeEle(parent.getColumnHeaderContent(), contentElem, 'e-autofill');
removeRangeEle(parent.getRowHeaderContent(), contentElem, 'e-autofill');
}
else if (cls === 'e-filloption') {
var contentElem = void 0;
var freezeRow = parent.frozenRowCount(sheet);
var freezeCol = parent.frozenColCount(sheet);
if ((range[0] < freezeRow || range[1] < freezeCol)) {
if (range[3] + 1 === freezeCol && range[2] + 1 > freezeRow) {
locateElem(parent, parent.getMainContent().querySelector('.e-filloption'), range, sheet, parent.enableRtl, freezeRow, freezeCol, preventAnimation, false, 0, 0, 0, 'e-filloption', true, { left: -4 });
}
else if (range[2] + 1 === freezeRow && range[3] + 1 > freezeCol) {
locateElem(parent, parent.getMainContent().querySelector('.e-filloption'), range, sheet, parent.enableRtl, freezeRow, freezeCol, preventAnimation, false, 0, 0, 0, 'e-filloption', true, { top: -4 });
}
else if (range[3] + 1 === freezeCol && range[2] + 1 < freezeRow) { // for upper side
contentElem = parent.getColumnHeaderContent();
var rangeElem = contentElem.querySelector('.' + cls);
if (!rangeElem) {
parent.notify(getautofillDDB, { id: parent.element.id + '_autofilloptionbtn', appendElem: contentElem });
}
ele = parent.autofillModule.autoFillDropDown.element;
locateElem(parent, ele, range, sheet, parent.enableRtl, freezeRow, freezeCol, preventAnimation, false, 0, 0, 0, 'e-filloption', true, { left: -4 });
}
else if (range[2] + 1 === freezeRow && range[3] + 1 === freezeCol) { // corner cell
locateElem(parent, parent.getMainContent().querySelector('.e-filloption'), range, sheet, parent.enableRtl, freezeRow, freezeCol, preventAnimation, false, 0, 0, 0, 'e-filloption', true, { top: -4, left: -4 });
}
else {
contentElem = range[0] < freezeRow && range[1] < freezeCol ? parent.getSelectAllContent() :
(range[0] < freezeRow ? parent.getColumnHeaderContent() : parent.getRowHeaderContent());
var rangeEle = contentElem.querySelector('.' + cls);
if (!rangeEle) {
parent.notify(getautofillDDB, { id: parent.element.id + '_autofilloptionbtn', appendElem: contentElem });
}
ele = parent.autofillModule.autoFillDropDown.element;
locateElem(parent, ele, range, sheet, parent.enableRtl, freezeRow, freezeCol, preventAnimation, true, parent.viewport.
beforeFreezeHeight, parent.viewport.beforeFreezeWidth, parent.sheetModule.colGroupWidth, 'e-filloption', true);
}
}
else {
locateElem(parent, parent.getMainContent().querySelector('.e-filloption'), range, sheet, parent.enableRtl, freezeRow, freezeCol, preventAnimation, false, 0, 0, 0, 'e-filloption', true);
}
if (ele.style.display) {
ele.style.display = '';
}
removeRangeEle(parent.getSelectAllContent(), contentElem, 'e-filloption');
removeRangeEle(parent.getColumnHeaderContent(), contentElem, 'e-filloption');
removeRangeEle(parent.getRowHeaderContent(), contentElem, 'e-filloption');
}
else {
var swapRange = getSwapRange(range);
if (swapRange[0] < frozenRow_1 || swapRange[1] < frozenCol_1) {
if (ele && !ele.classList.contains('e-multi-range')) {
ele.classList.add('e-hide');
}
var ranges_1 = [];
if (swapRange[0] < frozenRow_1 && swapRange[1] < frozenCol_1) {
if (swapRange[2] < frozenRow_1 && swapRange[3] < frozenCol_1) {
ranges_1.push(range);
if (!isMultiRange) {
removeRangeEle(parent.getColumnHeaderContent(), content_1, cls, true);
removeRangeEle(parent.getRowHeaderContent(), content_1, cls, true);
}
}
else if (swapRange[2] > frozenRow_1 - 1) {
if (swapRange[3] < frozenCol_1) {
if (!isMultiRange) {
removeRangeEle(parent.getColumnHeaderContent(), content_1, cls, true);
}
ranges_1.push([swapRange[0], swapRange[1], frozenRow_1 - 1, swapRange[3]]);
ranges_1.push([frozenRow_1, swapRange[1], swapRange[2], swapRange[3]]);
}
else {
ranges_1.push([swapRange[0], swapRange[1], frozenRow_1 - 1, frozenCol_1 - 1]);
ranges_1.push([frozenRow_1, swapRange[1], swapRange[2], frozenCol_1 - 1]);
ranges_1.push([swapRange[0], frozenCol_1, frozenRow_1 - 1, swapRange[3]]);
ranges_1.push([frozenRow_1, frozenCol_1, swapRange[2], swapRange[3]]);
}
}
else {
if (swapRange[2] < frozenRow_1) {
ranges_1.push([swapRange[0], swapRange[1], swapRange[2], frozenCol_1 - 1]);
ranges_1.push([swapRange[0], frozenCol_1, swapRange[2], swapRange[3]]);
if (!isMultiRange) {
removeRangeEle(parent.getRowHeaderContent(), content_1, cls, true);
}
}
else {
ranges_1.push([frozenRow_1, swapRange[1], swapRange[2], frozenCol_1 - 1]);
ranges_1.push([swapRange[0], swapRange[1], frozenRow_1 - 1, frozenCol_1 - 1]);
ranges_1.push([frozenRow_1, frozenCol_1, swapRange[2], swapRange[3]]);
ranges_1.push([swapRange[0], frozenCol_1, frozenRow_1 - 1, swapRange[3]]);
}
}
}
else if (swapRange[0] < frozenRow_1) {
if (swapRange[2] < frozenRow_1) {
ranges_1.push(range);
if (!isMultiRange) {
removeRangeEle(parent.getRowHeaderContent(), content_1, cls, true);
}
}
else {
ranges_1.push([swapRange[0], swapRange[1], frozenRow_1 - 1, swapRange[3]]);
ranges_1.push([frozenRow_1, swapRange[1], swapRange[2], swapRange[3]]);
if (!isMultiRange) {
removeRangeEle(parent.getSelectAllContent(), content_1, cls, true);
removeRangeEle(parent.getRowHeaderContent(), content_1, cls, true);
}
}
}
else {
if (swapRange[3] < frozenCol_1) {
ranges_1.push(range);
if (!isMultiRange) {
removeRangeEle(parent.getSelectAllContent(), content_1, cls, true);
}
}
else {
ranges_1.push([swapRange[0], swapRange[1], swapRange[2], frozenCol_1 - 1]);
ranges_1.push([swapRange[0], frozenCol_1, swapRange[2], swapRange[3]]);
if (!isMultiRange) {
removeRangeEle(parent.getSelectAllContent(), content_1, cls, true);
removeRangeEle(parent.getColumnHeaderContent(), content_1, cls, true);
}
}
}
var removeEle_1;
ranges_1.forEach(function (rng) {
var zIndex;
if (rng[2] < frozenRow_1 && rng[3] < frozenCol_1) {
content_1 = parent.getSelectAllContent();
}
else {
if (frozenRow_1 || frozenCol_1) {
var selectAllEle = parent.getSelectAllContent();
if (selectAllEle) {
zIndex = selectAllEle.style.zIndex;
}
}
if (rng[2] < frozenRow_1) {
content_1 = parent.getColumnHeaderContent();
}
else if (rng[3] < frozenCol_1) {
content_1 = parent.getRowHeaderContent();
}
else {
content_1 = parent.getMainContent();
if (frozenRow_1 && !zIndex) {
var colHdrEle = parent.getColumnHeaderContent();
if (colHdrEle) {
zIndex = colHdrEle.style.zIndex;
}
}
if (frozenCol_1 && !zIndex) {
var rowHdrEle = parent.getRowHeaderContent();
if (rowHdrEle) {
zIndex = rowHdrEle.style.zIndex;
}
}
}
}
var rangeEle;
if (cls === 'e-copy-indicator' || cls === 'e-range-indicator') {
rangeEle = ele.cloneNode(true);
content_1.appendChild(rangeEle);
if (frozenRow_1) {
if (rng[2] + 1 === frozenRow_1) {
ranges_1.forEach(function (subRng) {
if (subRng !== rng) {
removeEle_1 = rangeEle.getElementsByClassName('e-bottom')[0];
if (removeEle_1 && subRng[0] === frozenRow_1) {
detach(removeEle_1);
}
}
});
}
if (rng[0] === frozenRow_1 && content_1.parentElement.classList.contains('e-main-panel')) {
ranges_1.forEach(function (subRng) {
if (subRng !== rng) {
removeEle_1 = rangeEle.getElementsByClassName('e-top')[0];
if (removeEle_1 && subRng[2] + 1 === frozenRow_1) {
detach(removeEle_1);
}
}
});
}
}
if (frozenCol_1) {
if (rng[3] + 1 === frozenCol_1) {
ranges_1.forEach(function (subRng) {
if (subRng !== rng) {
removeEle_1 = rangeEle.getElementsByClassName('e-right')[0];
if (removeEle_1 && subRng[1] === frozenCol_1) {
detach(removeEle_1);
}
}
});
}
if (rng[1] === frozenCol_1 && (content_1.classList.contains('e-sheet-content') || content_1.classList.contains('e-column-header'))) {
ranges_1.forEach(function (subRng) {
if (subRng !== rng) {
removeEle_1 = rangeEle.getElementsByClassName('e-left')[0];
if (removeEle_1 && subRng[3] + 1 === frozenCol_1) {
detach(removeEle_1);
}
}
});
}
}
}
else {
rangeEle = content_1.querySelector('.' + cls);
if (!rangeEle) {
rangeEle = ele.cloneNode(true);
if (isMultiRange && !rangeEle.classList.contains('e-multi-range')) {
rangeEle.classList.add('e-multi-range');
}
content_1.appendChild(rangeEle);
}
if (removeCls) {
rangeEle.classList.remove(cls);
}
}
if (frozenRow_1 || frozenCol_1) {
if (zIndex) {
rangeEle.style.zIndex = zIndex;
}
else if (rangeEle.style.zIndex) {
rangeEle.style.zIndex = '';
}
}
locateElem(parent, rangeEle, rng, sheet, parent.enableRtl, frozenRow_1, frozenCol_1, preventAnimation, false, parent.viewport.beforeFreezeHeight, parent.viewport.beforeFreezeWidth, parent.sheetModule.colGroupWidth);
if (rangeEle.classList.contains('e-hide')) {
rangeEle.classList.remove('e-hide');
}
});
}
else {
if (!isMultiRange) {
removeRangeEle(parent.getSelectAllContent(), null, cls, true);
removeRangeEle(parent.getColumnHeaderContent(), null, cls, true);
removeRangeEle(parent.getRowHeaderContent(), null, cls, true);
}
locateElem(parent, ele, range, sheet, parent.enableRtl, frozenRow_1, frozenCol_1, preventAnimation);
if (cls === 'e-range-indicator' || !parent.getMainContent().querySelector('.' + cls)) {
parent.getMainContent().appendChild(ele);
}
if (ele.classList.contains('e-hide')) {
ele.classList.remove('e-hide');
}
if (removeCls) {
ele.classList.remove(cls);
}
}
}
}
else {
var promise = locateElem(parent, ele, range, sheet, parent.enableRtl, 0, 0, preventAnimation);
if (ele && !parent.getMainContent().querySelector('.' + cls)) {
parent.getMainContent().appendChild(ele);
}
return promise;
}
}
/**
* @param {Element} content - Specify the content element.
* @param {HTMLElement} checkEle - Specify the element.
* @param {string} cls - Specify the class name.
* @param {string} isSelection - Specify the selection element.
* @param {string} removeCls - Specify to remove class from element.
* @returns {void} - remove element with given range
*/
export function removeRangeEle(content, checkEle, cls, isSelection, removeCls) {
if (isSelection || content !== checkEle) {
if (removeCls) {
var collection = content.querySelectorAll('.' + cls);
var i = 0;
while (i < collection.length) {
collection[i].classList.remove(cls);
i++;
}
}
else {
var ele = content.querySelector('.' + cls);
if (ele && !ele.classList.contains('e-multi-range')) {
detach(ele);
}
}
}
}
/**
* Position element with given range
*
* @hidden
* @param {Spreadsheet} parent - Specify the parent.
* @param {HTMLElement} ele - Specify the element.
* @param {number[]} range - specify the range.
* @param {SheetModel} sheet - Specify the sheet.
* @param {boolean} isRtl - Specify the boolean value.
* @param {number} frozenRow - Specidy the frozen row.
* @param {number} frozenColumn - Specify the frozen column
* @param {boolean} preventAnimation - Specify the preventAnimation.
* @param {boolean} isActiveCell - Specidy the boolean value.
* @param {number} freezeScrollHeight - Specify the freeze scroll height
* @param {number} freezeScrollWidth - Specify the freeze scroll width
* @param {number} rowHdrWidth - Specify the row header width
* @param {number} cls - Specify the class
* @param {number} isFillOptShow - Specify the fill option
* @param {number} freezeFillOpt - Specifies the fill option
* @param {number} freezeFillOpt.top - Specifies the fill option
* @param {number} freezeFillOpt.left - Specifies the fill option
* @returns {void} - Position element with given range
*/
export function locateElem(parent, ele, range, sheet, isRtl, frozenRow, frozenColumn, preventAnimation, isActiveCell, freezeScrollHeight, freezeScrollWidth, rowHdrWidth, cls, isFillOptShow, freezeFillOpt) {
var swapRange = getSwapRange(range);
var cellPosition = getCellPosition(sheet, swapRange, frozenRow, frozenColumn, freezeScrollHeight, freezeScrollWidth, rowHdrWidth);
var startIndex = [skipHiddenIdx(sheet, 0, true), skipHiddenIdx(sheet, 0, true, 'columns')];
var height;
var width;
if (parent.scrollSettings.isFinite) {
height = swapRange[0] >= sheet.rowCount ? 0 : getRowsHeight(sheet, swapRange[0], swapRange[2] < sheet.rowCount ? swapRange[2] : sheet.rowCount - 1, true);
width = swapRange[1] >= sheet.colCount ? 0 : getColumnsWidth(sheet, swapRange[1], swapRange[3] < sheet.colCount ? swapRange[3] : sheet.colCount - 1, true);
}
else {
height = getRowsHeight(sheet, swapRange[0], swapRange[2], true);
width = getColumnsWidth(sheet, swapRange[1], swapRange[3], true);
}
var isRowSelected = (swapRange[1] === 0 && swapRange[3] === sheet.colCount - 1);
var isColSelected = (swapRange[0] === 0 && swapRange[2] === sheet.rowCount - 1);
var top = 0;
var tdiff = -5;
var ldiff = -5;
var left = 0;
var otdiff = 6;
var oldiff = 6;
if (isNullOrUndefined(cls)) {
var attrs = {
'top': (swapRange[0] === startIndex[0] ? cellPosition.top : cellPosition.top - getDPRValue(1)) + 'px',
'height': height && height + (swapRange[0] === startIndex[0] ? 0 : getDPRValue(1)) + 'px',
'width': width && width + (swapRange[1] === startIndex[1] ? 0 : getDPRValue(1)) + (isActiveCell
&& frozenColumn && swapRange[1] < frozenColumn && swapRange[3] >= frozenColumn ? 1 : 0) + 'px'
};
attrs[isRtl ? 'right' : 'left'] = (swapRange[1] === startIndex[1] ? cellPosition.left : cellPosition.left - 1) + 'px';
if (ele) {
var promise = setStyleAttribute([{ element: ele, attrs: attrs }], preventAnimation);
return promise;
}
}
else {
if (isRowSelected) {
tdiff = -5;
ldiff = -2;
otdiff = 6;
oldiff = 3;
}
if (isColSelected) {
ldiff = -5;
tdiff = 0;
otdiff = 1;
oldiff = 6;
}
if (!isColSelected) {
top += height;
}
if (!isRowSelected) {
left += width;
}
top += Math.round(cellPosition.top) + tdiff;
left += Math.round(cellPosition.left) + ldiff;
var attrs = {};
if (isFillOptShow) {
removeClass([ele], 'e-hide');
top = freezeFillOpt && freezeFillOpt.top ? freezeFillOpt.top : top;
left = freezeFillOpt && freezeFillOpt.left ? freezeFillOpt.left : left;
attrs = {
'top': top + otdiff + 'px'
};
attrs[isRtl ? 'right' : 'left'] = left + oldiff + 'px';
if (ele) {
setStyleAttribute([{ element: ele, attrs: attrs }], preventAnimation);
}
}
else {
attrs = {
'top': top + 'px'
};
attrs[isRtl ? 'right' : 'left'] = left + 'px';
if (ele) {
setStyleAttribute([{ element: ele, attrs: attrs }], preventAnimation);
}
}
}
}
/**
* To update element styles using request animation frame
*
* @hidden
* @param {StyleType[]} styles - Specify the styles
* @param {boolean} preventAnimation - Specify the preventAnimation.
* @returns {void} - To update element styles using request animation frame
*/
export function setStyleAttribute(styles, preventAnimation) {
var promise = new Promise(function (resolve) {
var setStyleFn = function () {
styles.forEach(function (style) {
setBaseStyleAttribute(style.element, style.attrs);
resolve();
});
};
if (preventAnimation) {
setStyleFn();
}
else {
requestAnimationFrame(function () { return setStyleFn(); });
}
});
return promise;
}
/**
* @hidden
* @returns {string} - to get Start Event
*/
export function getStartEvent() {
return (Browser.isPointer ? 'pointerdown' : 'mousedown touchstart');
}
/**
* @hidden
* @returns {string} - to get Move Event
*/
export function getMoveEvent() {
return (Browser.isPointer ? 'pointermove' : 'mousemove touchmove');
}
/**
* @hidden
* @returns {string} - Returns string value.
*/
export function getEndEvent() {
return (Browser.isPointer ? 'pointerup' : 'mouseup touchend');
}
/**
* @hidden
* @param {Event} e - To specify the event.
* @returns {boolean} - Returns boolean value.
*/
export function isTouchStart(e) {
return e.type === 'touchstart' || (e.type === 'pointerdown' && e.pointerType === 'touch');
}
/**
* @hidden
* @param {Event} e - To specify the event.
* @returns {boolean} - Returns boolean value.
*/
export function isTouchMove(e) {
return e.type === 'touchmove' || (e.type === 'pointermove' && e.pointerType === 'touch');
}
/**
* @hidden
* @param {Event} e - To specify the event.
* @returns {boolean} - Returns boolean value.
*/
export function isTouchEnd(e) {
return e.type === 'touchend' || (e.type === 'pointerup' && e.pointerType === 'touch');
}
/**
* @hidden
* @param {TouchEvent | MouseEvent} e - To specify the mouse and touch event.
* @returns {number} - To get client value
*/
export function isMouseDown(e) {
return e && (e.type === 'mousedown' || e.type === 'pointerdown');
}
/**
* @param {MouseEvent} e - Specify the event.
* @returns {boolean} - To get boolean value.
* @hidden
*/
export function isMouseMove(e) {
return e && (e.type === 'mousemove' || e.type === 'pointermove');
}
/**
* @param {MouseEvent} e - Specify the event.
* @returns {boolean} - To get boolean value
* @hidden
*/
export function isMouseUp(e) {
return e && (e.type === 'mouseup' || e.type === 'pointerup');
}
/**
* @param {number} keyCode - Specify the keycode.
* @returns {boolean} - to get boolean value.
* @hidden
*/
export function isNavigationKey(keyCode) {
return (keyCode === keyCodes.UP) || (keyCode === keyCodes.DOWN) || (keyCode === keyCodes.LEFT)
|| (keyCode === keyCodes.RIGHT);
}
/**
* @param {MouseEvent | TouchEvent} e - To specify the mouse or touch event.
* @returns {number} - To get client X value.
* @hidden
*/
export function getClientX(e) {
return e.changedTouches ? e.changedTouches[0].clientX : e.clientX;
}
/**
* @hidden
* @param {MouseEvent | TouchEvent} e - To specify the mouse and touch event.
* @returns {number} - To get client value
*/
export function getClientY(e) {
return e.changedTouches ? e.changedTouches[0].clientY : e.clientY;
}
/**
* To get the `pageX` value from the mouse or touch event.
*
* @param {MouseEvent | TouchEvent} e - Specifies the mouse or touch event.
* @returns {number} - Return the `pageX` value.
* @hidden
*/
export function getPageX(e) {
return e.changedTouches ? e.changedTouches[0].pageX : e.pageX;
}
/**
* To get the `pageY` value from the mouse or touch event.
*
* @param {MouseEvent | TouchEvent} e - Specifies the mouse or touch event.
* @returns {number} - Return the `pageY` value.
* @hidden
*/
export function getPageY(e) {
return e.changedTouches ? e.changedTouches[0].pageY : e.pageY;
}
/**
* Get even number based on device pixel ratio
*
* @param {number} value - Specify the number
* @param {boolean} preventDecrease - Specify the boolean value
* @returns {number} - To get DPR value
* @hidden
*/
export function getDPRValue(value, preventDecrease) {
if (window.devicePixelRatio % 1 > 0) {
var pointValue = (value * window.devicePixelRatio) % 1;
return value + (pointValue ? (((pointValue > 0.5 || preventDecrease) ? (1 - pointValue) : -1 * pointValue)
/ window.devicePixelRatio) : 0);
}
else {
return value;
}
}
var config = {
role: 'role',
selected: 'aria-selected',
multiselectable: 'aria-multiselectable',
busy: 'aria-busy',
colcount: 'aria-colcount'
};
/**
* @hidden
* @param {HTMLElement} target - specify the target.
* @param {IAriaOptions<boolean>} options - Specify the options.
* @returns {void} - to set Aria Options
*/
export function setAriaOptions(target, options) {
var props = Object.keys(options);
props.forEach(function (name) {
if (target) {
target.setAttribute(config["" + name], options["" + name]);
}
});
}
/**
* @hidden
* @param {HTMLElement} element - specify the element.
* @param {Object} component - Specify the component.
* @returns {void} - to destroy the component.
*/
export function destroyComponent(element, component) {
if (element) {
var compObj = getComponent(element, component);
if (compObj) {
compObj.destroy();
}
}
}
/**
* @hidden
* @param {number} idx - Specify the index
* @param {number} index - Specify the index
* @param {string} value - Specify the value.
* @param {boolean} isCol - Specify the boolean value.
* @param {Spreadsheet} parent - Specify the parent.
* @returns {void} - To set resize.
*/
export function setResize(idx, index, value, isCol, parent) {
var curEle;
var curEleH;
var curEleC;
var preEle;
var preEleH;
var preEleC;
var nxtEle;
var nxtEleH;
var nxtEleC;
var sheet = parent.getActiveSheet();
var frozenRow = parent.frozenRowCount(sheet);
var frozenCol = parent.frozenColCount(sheet);
var emptySelectAllEle;
var emptyRowHeaderEle;
if (isCol) {
var selectAllContent = parent.getSelectAllContent();
var rowHeaderContent = parent.getRowHeaderContent();
if (frozenCol && idx >= frozenCol) {
if (selectAllContent.style.zIndex) {
emptySelectAllEle = [].slice.call(selectAllContent.querySelectorAll('col.e-empty'))[index];
}
if (rowHeaderContent.style.zIndex) {
emptyRowHeaderEle = [].slice.call(rowHeaderContent.querySelectorAll('col.e-empty'))[index];
}
}
var header = idx < frozenCol ? selectAllContent : parent.getColumnHeaderContent();
curEle = header.getElementsByTagName('th')[index];
curEleH = header.getElementsByTagName('col')[index];
curEleC = (idx < frozenCol ? rowHeaderContent : parent.getMainContent()).getElementsByTagName('col')[index];
}
else {
curEle = curEleH = frozenRow || frozenCol ? parent.getRow(idx, null, frozenCol - 1) :
parent.getRow(idx, parent.getRowHeaderTable());
curEleH.style.height = parseInt(value, 10) > 0 ? getDPRValue(parseInt(value, 10)) + 'px' : '2px';
curEleC = parent.getRow(idx, null, frozenCol);
curEleC.style.height = parseInt(value, 10) > 0 ? getDPRValue(parseInt(value, 10)) + 'px' : '0px';
var hdrFntSize = void 0;
if (sheet.showHeaders) {
var hdrRow = parent.getRowHeaderContent().getElementsByClassName('e-row');
var hdrClone = [];
hdrClone[0] = hdrRow[index].getElementsByTagName('td')[0].cloneNode(true);
hdrFntSize = findMaxValue(parent.getRowHeaderTable(), hdrClone, false, parent) + 1;
}
var contentRow = parent.getMainContent().getElementsByClassName('e-row');
var contentClone = [];
var eleTextHeight = 0;
var eleMaxHeight = 0;
var rIdx = idx;
for (var idx_1 = 0; idx_1 < contentRow[index].getElementsByTagName('td').length; idx_1++) {
var td = contentRow[index].getElementsByTagName('td')[idx_1];
contentClone[idx_1] = td.cloneNode(true);
var colIndx = parseInt(td.getAttribute('aria-colindex'), 10) - 1;
var cell = getCell(rIdx, colIndx, sheet, false, true);
var mergeArgs = void 0;
if (cell.rowSpan < 1) {
mergeArgs = { range: [rIdx, colIndx, rIdx, colIndx] };
parent.notify(activeCellMergedRange, mergeArgs);
cell = getCell(mergeArgs.range[0], mergeArgs.range[1], sheet, false, true);
td = parent.getCell(mergeArgs.range[0], mergeArgs.range[1]);
}
eleTextHeight = cell.value ? getTextHeight(parent, cell.style) : eleTextHeight;
eleMaxHeight = eleMaxHeight < eleTextHeight ? eleTextHeight : eleMaxHeight;
if (td.getElementsByClassName('e-cf-databar')[0]) {
var rHeight = Number((curEleC.style.height).split('px')[0]);
parent.notify(applyCF, { indexes: [rIdx, colIndx], cell: cell, ele: td, isRender: true,
resizedRowHeight: rHeight, mergeArgs: mergeArgs });
}
}
var cntFntSize = eleMaxHeight + 1;
var fntSize = hdrFntSize >= cntFntSize ? hdrFntSize : cntFntSize;
if (parseInt(curEleC.style.height, 10) < fntSize ||
(curEle && curEle.classList.contains('e-reach-fntsize') && parseInt(curEleC.style.height, 10) === fntSize)) {
if (sheet.showHeaders) {
curEle.classList.add('e-reach-fntsize');
curEleH.style.lineHeight = parseInt(value, 10) >= 4 ? ((parseInt(value, 10)) - 4) + 'px' :
parseInt(value, 10) > 0 ? ((parseInt(value, 10)) - 1) + 'px' : '0px';
}
curEleC.style.lineHeight = parseInt(value, 10) > 0 ? ((parseInt(value, 10)) - 1) + 'px' : '0px';
}
else {
if (curEleH) {
curEleH.style.removeProperty('line-height');
}
curEleC.style.removeProperty('line-height');
if (curEle && curEle.classList.contains('e-reach-fntsize')) {
curEle.classList.remove('e-reach-fntsize');
}
}
}
preEleC = curEleC.previousElementSibling;
nxtEleC = curEleC.nextElementSibling;
if (preEleC) {
if (sheet.showHeaders) {
preEle = curEle.previousElementSibling;
preEleH = curEleH.previousElementSibling;
}
preEleC = curEleC.previousElementSibling;
}
if (nxtEleC) {
if (sheet.showHeaders) {
nxtEle = curEle.nextElementSibling;
nxtEleH = curEleH.nextElementSibling;
}
nxtEleC = curEleC.nextElementSibling;
}
if (parseInt(value, 10) <= 0 && !(curEleC.classList.contains('e-zero') || curEleC.classList.contains('e-zero-start'))) {
if (preEleC && nxtEleC) {
if (isCol) {
if (sheet.showHeaders) {
curEleH.style.width = '2px';
}
curEleC.style.width = '0px';
}
else {
if (sheet.showHeaders) {
curEleH.style.height = '2px';
}
curEleC.style.height = '0px';
}
if (preEleC.classList.contains('e-zero-start')) {
if (sheet.showHeaders) {
curEle.classList.add('e-zero-start');
}
curEleC.classList.add('e-zero-start');
}
else {
if (sheet.showHeaders) {
curEle.classList.add('e-zero');
}
curEleC.classList.add('e-zero');
}
if (nxtEle && !nxtEle.classList.contains('e-zero') && !nxtEle.classList.contains('e-zero-last')) {
if (sheet.showHeaders) {
curEle.classList.add('e-zero-last');
}
curEleC.classList.add('e-zero-last');
}
if (preEleC.classList.contains('e-zero-last')) {
if (sheet.showHeaders) {
preEle.classList.remove('e-zero-last');
}
preEleC.classList.remove('e-zero-last');
}
if (sheet.showHeaders && preEle.classList.contains('e-zero')) {
if (curEle.classList.contains('e-zero-end')) {
setWidthAndHeight(preEleH, -2, isCol);
}
else {
setWidthAndHeight(preEleH, -2, isCol);
}
}
else if (sheet.showHeaders) {
setWidthAndHeight(preEleH, -1, isCol);
}
if (sheet.showHeaders && preEle.classList.contains('e-zero-start')) {
setWidthAndHeight(curEleH, -1, isCol);
}
if (sheet.showHeaders && nxtEle.classList.contains('e-zero')) {
if (curEle.classList.contains('e-zero-start')) {
while (nxtEle) {
if (nxtEle.classList.contains('e-zero') && (parseInt(nxtEleH.style.height, 10) !== 0 && !isCol) ||
(parseInt(nxtEleH.style.width, 10) !== 0 && isCol)) {
if (isCol) {
curEleH.style.width = parseInt(curEleH.style.width, 10) - 1 + 'px';
nxtEleH.style.width = parseInt(nxtEleH.style.width, 10) - 1 + 'px';
}
else {
curEleH.style.height = parseInt(curEleH.style.height, 10) - 1 + 'px';
nxtEleH.style.height = parseInt(nxtEleH.style.height, 10) - 1 + 'px';
}
nxtEle.classList.remove('e-zero');
nxtEle.classList.add('e-zero-start');
break;
}
else {
var nxtIndex = void 0;
nxtEle.classList.remove('e-zero');
nxtEle.classList.add('e-zero-start');
if (isCol) {
nxtIndex = parseInt(nxtEle.getAttribute('aria-colindex'), 10) - 1;
nxtEle = parent.getColHeaderTable().getElementsByTagName('th')[nxtIndex + 1];
nxtEleH = parent.getColHeaderTable().getElementsByTagName('col')[nxtIndex + 1];
}
else {
nxtIndex = parseInt(nxtEle.getAttribute('aria-rowindex'), 10) - 1;
nxtEle = parent.getRowHeaderTable().getElementsByTagName('tr')[nxtIndex + 1];
nxtEleH = parent.getRowHeaderTable().getElementsByTagName('tr')[nxtIndex + 1];
}
}
}
}
else {
setWidthAndHeight(curEleH, -2, isCol);
}
}
else if (sheet.showHeaders) {
if (nxtEle.classList.contains('e-zero-end')) {
if (isCol) {
curEleH.style.width = '0px';
}
else {
curEleH.style.height = '0px';
}
}
else {
setWidthAndHeight(nxtEleH, -1, isCol);
}
}
}
el