\n *
\n * ```\n * ```typescript\n * \n * ```\n */\nvar Popup = /** @class */ (function (_super) {\n __extends(Popup, _super);\n function Popup(element, options) {\n return _super.call(this, options, element) || this;\n }\n /**\n * Called internally if any of the property value changed.\n * @private\n */\n Popup.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'width':\n setStyleAttribute(this.element, { 'width': formatUnit(newProp.width) });\n break;\n case 'height':\n setStyleAttribute(this.element, { 'height': formatUnit(newProp.height) });\n break;\n case 'zIndex':\n setStyleAttribute(this.element, { 'zIndex': newProp.zIndex });\n break;\n case 'enableRtl':\n this.setEnableRtl();\n break;\n case 'position':\n case 'relateTo':\n this.refreshPosition();\n break;\n case 'offsetX':\n var x = newProp.offsetX - oldProp.offsetX;\n this.element.style.left = (parseInt(this.element.style.left, 10) + (x)).toString() + 'px';\n break;\n case 'offsetY':\n var y = newProp.offsetY - oldProp.offsetY;\n this.element.style.top = (parseInt(this.element.style.top, 10) + (y)).toString() + 'px';\n break;\n case 'content':\n this.setContent();\n break;\n case 'actionOnScroll':\n if (newProp.actionOnScroll !== 'none') {\n this.wireScrollEvents();\n }\n else {\n this.unwireScrollEvents();\n }\n break;\n }\n }\n };\n /**\n * gets the Component module name.\n * @private\n */\n Popup.prototype.getModuleName = function () {\n return 'popup';\n };\n /**\n * gets the persisted state properties of the Component.\n */\n Popup.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * To destroy the control.\n */\n Popup.prototype.destroy = function () {\n this.element.classList.remove(CLASSNAMES.ROOT, CLASSNAMES.RTL);\n this.unwireEvents();\n _super.prototype.destroy.call(this);\n };\n /**\n * To Initialize the control rendering\n * @private\n */\n Popup.prototype.render = function () {\n this.element.classList.add(CLASSNAMES.ROOT);\n var styles = {};\n if (this.zIndex !== 1000) {\n styles.zIndex = this.zIndex;\n }\n if (this.width !== 'auto') {\n styles.width = formatUnit(this.width);\n }\n if (this.height !== 'auto') {\n styles.height = formatUnit(this.height);\n }\n setStyleAttribute(this.element, styles);\n this.fixedParent = false;\n this.setEnableRtl();\n this.setContent();\n this.wireEvents();\n };\n Popup.prototype.wireEvents = function () {\n if (Browser.isDevice) {\n EventHandler.add(window, 'orientationchange', this.orientationOnChange, this);\n }\n if (this.actionOnScroll !== 'none') {\n this.wireScrollEvents();\n }\n };\n Popup.prototype.wireScrollEvents = function () {\n if (this.getRelateToElement()) {\n for (var _i = 0, _a = this.getScrollableParent(this.getRelateToElement()); _i < _a.length; _i++) {\n var parent_1 = _a[_i];\n EventHandler.add(parent_1, 'scroll', this.scrollRefresh, this);\n }\n }\n };\n Popup.prototype.unwireEvents = function () {\n if (Browser.isDevice) {\n EventHandler.remove(window, 'orientationchange', this.orientationOnChange);\n }\n if (this.actionOnScroll !== 'none') {\n this.unwireScrollEvents();\n }\n };\n Popup.prototype.unwireScrollEvents = function () {\n if (this.getRelateToElement()) {\n for (var _i = 0, _a = this.getScrollableParent(this.getRelateToElement()); _i < _a.length; _i++) {\n var parent_2 = _a[_i];\n EventHandler.remove(parent_2, 'scroll', this.scrollRefresh);\n }\n }\n };\n Popup.prototype.getRelateToElement = function () {\n var relateToElement = this.relateTo === '' || isNullOrUndefined(this.relateTo) ?\n document.body : this.relateTo;\n this.setProperties({ relateTo: relateToElement }, true);\n return ((typeof this.relateTo) === 'string') ?\n document.querySelector(this.relateTo) : this.relateTo;\n };\n Popup.prototype.scrollRefresh = function (e) {\n if (this.actionOnScroll === 'reposition') {\n if (!(this.element.offsetParent === e.target ||\n (this.element.offsetParent && this.element.offsetParent.tagName === 'BODY' &&\n e.target.parentElement == null))) {\n this.refreshPosition();\n }\n }\n else if (this.actionOnScroll === 'hide') {\n this.hide();\n }\n if (this.actionOnScroll !== 'none') {\n if (this.getRelateToElement()) {\n var targetVisible = this.isElementOnViewport(this.getRelateToElement(), e.target);\n if (!targetVisible && !this.targetInvisibleStatus) {\n this.trigger('targetExitViewport');\n this.targetInvisibleStatus = true;\n }\n else if (targetVisible) {\n this.targetInvisibleStatus = false;\n }\n }\n }\n };\n /**\n * This method is to get the element visibility on viewport when scroll\n * the page. This method will returns true even though 1 px of element\n * part is in visible.\n */\n Popup.prototype.isElementOnViewport = function (relateToElement, scrollElement) {\n var scrollParents = this.getScrollableParent(relateToElement);\n for (var parent_3 = 0; parent_3 < scrollParents.length; parent_3++) {\n if (this.isElementVisible(relateToElement, scrollParents[parent_3])) {\n continue;\n }\n else {\n return false;\n }\n }\n return true;\n };\n Popup.prototype.isElementVisible = function (relateToElement, scrollElement) {\n var rect = this.checkGetBoundingClientRect(relateToElement);\n if (!rect.height || !rect.width) {\n return false;\n }\n if (!isNullOrUndefined(this.checkGetBoundingClientRect(scrollElement))) {\n var parent_4 = scrollElement.getBoundingClientRect();\n return !(rect.bottom < parent_4.top) &&\n (!(rect.bottom > parent_4.bottom) &&\n (!(rect.right > parent_4.right) &&\n !(rect.left < parent_4.left)));\n }\n else {\n var win = window;\n var windowView = {\n top: win.scrollY,\n left: win.scrollX,\n right: win.scrollX + win.outerWidth,\n bottom: win.scrollY + win.outerHeight\n };\n var off = calculatePosition(relateToElement);\n var ele = {\n top: off.top,\n left: off.left,\n right: off.left + rect.width,\n bottom: off.top + rect.height\n };\n var elementView = {\n top: windowView.bottom - ele.top,\n left: windowView.right - ele.left,\n bottom: ele.bottom - windowView.top,\n right: ele.right - windowView.left\n };\n return elementView.top > 0\n && elementView.left > 0\n && elementView.right > 0\n && elementView.bottom > 0;\n }\n };\n /**\n * Initialize the event handler\n * @private\n */\n Popup.prototype.preRender = function () {\n //There is no event handler\n };\n Popup.prototype.setEnableRtl = function () {\n this.reposition();\n this.enableRtl ? this.element.classList.add(CLASSNAMES.RTL) : this.element.classList.remove(CLASSNAMES.RTL);\n };\n Popup.prototype.setContent = function () {\n if (!isNullOrUndefined(this.content)) {\n this.element.innerHTML = '';\n if (typeof (this.content) === 'string') {\n this.element.textContent = this.content;\n }\n else {\n this.element.appendChild(this.content);\n }\n }\n };\n Popup.prototype.orientationOnChange = function () {\n var _this = this;\n setTimeout(function () {\n _this.refreshPosition();\n }, 200);\n };\n /**\n * Based on the `relative` element and `offset` values, `Popup` element position will refreshed.\n */\n Popup.prototype.refreshPosition = function (target, collision) {\n if (!isNullOrUndefined(target)) {\n this.checkFixedParent(target);\n }\n this.reposition();\n if (!collision) {\n this.checkCollision();\n }\n };\n Popup.prototype.reposition = function () {\n var pos;\n var position;\n var relateToElement = this.getRelateToElement();\n if (typeof this.position.X === 'number' && typeof this.position.Y === 'number') {\n pos = { left: this.position.X, top: this.position.Y };\n }\n else if ((typeof this.position.X === 'string' && typeof this.position.Y === 'number') ||\n (typeof this.position.X === 'number' && typeof this.position.Y === 'string')) {\n var display = this.element.style.display;\n var parentDisplay = void 0;\n this.element.style.display = 'block';\n if (this.element.classList.contains('e-dlg-modal')) {\n parentDisplay = this.element.parentElement.style.display;\n this.element.parentElement.style.display = 'block';\n }\n position = this.getAnchorPosition(relateToElement, this.element, this.position, this.offsetX, this.offsetY);\n if (typeof this.position.X === 'string') {\n pos = { left: position.left, top: this.position.Y };\n }\n else {\n pos = { left: this.position.X, top: position.top };\n }\n this.element.style.display = display;\n if (this.element.classList.contains('e-dlg-modal')) {\n this.element.parentElement.style.display = parentDisplay;\n }\n }\n else if (relateToElement) {\n var display = this.element.style.display;\n this.element.style.display = 'block';\n pos = this.getAnchorPosition(relateToElement, this.element, this.position, this.offsetX, this.offsetY);\n this.element.style.display = display;\n }\n else {\n pos = { left: 0, top: 0 };\n }\n if (!isNullOrUndefined(pos)) {\n this.element.style.left = pos.left + 'px';\n this.element.style.top = pos.top + 'px';\n }\n };\n Popup.prototype.checkGetBoundingClientRect = function (ele) {\n var eleRect;\n try {\n eleRect = ele.getBoundingClientRect();\n return eleRect;\n }\n catch (error) {\n return null;\n }\n };\n Popup.prototype.getAnchorPosition = function (anchorEle, ele, position, offsetX, offsetY) {\n var eleRect = this.checkGetBoundingClientRect(ele);\n var anchorRect = this.checkGetBoundingClientRect(anchorEle);\n if (isNullOrUndefined(eleRect) || isNullOrUndefined(anchorRect)) {\n return null;\n }\n var anchor = anchorEle;\n var anchorPos = { left: 0, top: 0 };\n if (ele.offsetParent && ele.offsetParent.tagName === 'BODY' && anchorEle.tagName === 'BODY') {\n anchorPos = calculatePosition(anchorEle);\n }\n else {\n if ((ele.classList.contains('e-dlg-modal') && anchor.tagName !== 'BODY')) {\n ele = ele.parentElement;\n }\n anchorPos = calculateRelativeBasedPosition(anchor, ele);\n }\n switch (position.X) {\n default:\n case 'left':\n break;\n case 'center':\n if ((ele.classList.contains('e-dlg-modal') && anchor.tagName === 'BODY' && this.targetType === 'container')) {\n anchorPos.left += (window.innerWidth / 2 - eleRect.width / 2);\n }\n else if (this.targetType === 'container') {\n anchorPos.left += (anchorRect.width / 2 - eleRect.width / 2);\n }\n else {\n anchorPos.left += (anchorRect.width / 2);\n }\n break;\n case 'right':\n if ((ele.classList.contains('e-dlg-modal') && anchor.tagName === 'BODY' && this.targetType === 'container')) {\n anchorPos.left += (window.innerWidth - eleRect.width);\n }\n else if (this.targetType === 'container') {\n anchorPos.left += (anchorRect.width - eleRect.width);\n }\n else {\n anchorPos.left += (anchorRect.width);\n }\n break;\n }\n switch (position.Y) {\n default:\n case 'top':\n break;\n case 'center':\n if ((ele.classList.contains('e-dlg-modal') && anchor.tagName === 'BODY' && this.targetType === 'container')) {\n anchorPos.top += (window.innerHeight / 2 - eleRect.height / 2);\n }\n else if (this.targetType === 'container') {\n anchorPos.top += (anchorRect.height / 2 - eleRect.height / 2);\n }\n else {\n anchorPos.top += (anchorRect.height / 2);\n }\n break;\n case 'bottom':\n if ((ele.classList.contains('e-dlg-modal') && anchor.tagName === 'BODY' && this.targetType === 'container')) {\n anchorPos.top += (window.innerHeight - eleRect.height);\n }\n else if (this.targetType === 'container') {\n anchorPos.top += (anchorRect.height - eleRect.height);\n }\n else {\n anchorPos.top += (anchorRect.height);\n }\n break;\n }\n anchorPos.left += offsetX;\n anchorPos.top += offsetY;\n return anchorPos;\n };\n Popup.prototype.callFlip = function (param) {\n var relateToElement = this.getRelateToElement();\n flip(this.element, relateToElement, this.offsetX, this.offsetY, this.position.X, this.position.Y, this.viewPortElement, param, this.fixedParent);\n };\n Popup.prototype.callFit = function (param) {\n if (isCollide(this.element, this.viewPortElement).length !== 0) {\n if (isNullOrUndefined(this.viewPortElement)) {\n var data = fit(this.element, this.viewPortElement, param);\n if (param.X) {\n this.element.style.left = data.left + 'px';\n }\n if (param.Y) {\n this.element.style.top = data.top + 'px';\n }\n }\n else {\n var elementRect = this.checkGetBoundingClientRect(this.element);\n var viewPortRect = this.checkGetBoundingClientRect(this.viewPortElement);\n if (isNullOrUndefined(elementRect) || isNullOrUndefined(viewPortRect)) {\n return null;\n }\n if (param && param.Y === true) {\n if (viewPortRect.top > elementRect.top) {\n this.element.style.top = '0px';\n }\n else if (viewPortRect.bottom < elementRect.bottom) {\n this.element.style.top = parseInt(this.element.style.top, 10) - (elementRect.bottom - viewPortRect.bottom) + 'px';\n }\n }\n if (param && param.X === true) {\n if (viewPortRect.right < elementRect.right) {\n this.element.style.left = parseInt(this.element.style.left, 10) - (elementRect.right - viewPortRect.right) + 'px';\n }\n else if (viewPortRect.left > elementRect.left) {\n this.element.style.left = parseInt(this.element.style.left, 10) + (viewPortRect.left - elementRect.left) + 'px';\n }\n }\n }\n }\n };\n Popup.prototype.checkCollision = function () {\n var horz = this.collision.X;\n var vert = this.collision.Y;\n if (horz === 'none' && vert === 'none') {\n return;\n }\n if (horz === 'flip' && vert === 'flip') {\n this.callFlip({ X: true, Y: true });\n }\n else if (horz === 'fit' && vert === 'fit') {\n this.callFit({ X: true, Y: true });\n }\n else {\n if (horz === 'flip') {\n this.callFlip({ X: true, Y: false });\n }\n else if (vert === 'flip') {\n this.callFlip({ Y: true, X: false });\n }\n if (horz === 'fit') {\n this.callFit({ X: true, Y: false });\n }\n else if (vert === 'fit') {\n this.callFit({ X: false, Y: true });\n }\n }\n };\n /**\n * Shows the popup element from screen.\n * @param { AnimationModel | Function } collisionOrAnimationOptions? - To pass animation options or collision function.\n * @param { Function } collision? - To pass the collision function.\n * @param { HTMLElement } relativeElement? - To calculate the zIndex value dynamically.\n */\n Popup.prototype.show = function (animationOptions, relativeElement) {\n var _this = this;\n if (this.zIndex === 1000 || !isNullOrUndefined(relativeElement)) {\n var zIndexElement = (isNullOrUndefined(relativeElement)) ? this.element : relativeElement;\n this.zIndex = getZindexPartial(zIndexElement);\n setStyleAttribute(this.element, { 'zIndex': this.zIndex });\n }\n animationOptions = (!isNullOrUndefined(animationOptions) && typeof animationOptions === 'object') ?\n animationOptions : this.showAnimation;\n if (this.collision.X !== 'none' || this.collision.Y !== 'none') {\n removeClass([this.element], CLASSNAMES.CLOSE);\n addClass([this.element], CLASSNAMES.OPEN);\n this.checkCollision();\n removeClass([this.element], CLASSNAMES.OPEN);\n addClass([this.element], CLASSNAMES.CLOSE);\n }\n if (!isNullOrUndefined(animationOptions)) {\n animationOptions.begin = function () {\n if (!_this.isDestroyed) {\n removeClass([_this.element], CLASSNAMES.CLOSE);\n addClass([_this.element], CLASSNAMES.OPEN);\n }\n };\n animationOptions.end = function () {\n if (!_this.isDestroyed) {\n _this.trigger('open');\n }\n };\n new Animation(animationOptions).animate(this.element);\n }\n else {\n removeClass([this.element], CLASSNAMES.CLOSE);\n addClass([this.element], CLASSNAMES.OPEN);\n this.trigger('open');\n }\n };\n /**\n * Hides the popup element from screen.\n * @param { AnimationModel } animationOptions? - To give the animation options.\n */\n Popup.prototype.hide = function (animationOptions) {\n var _this = this;\n animationOptions = (!isNullOrUndefined(animationOptions) && typeof animationOptions === 'object') ?\n animationOptions : this.hideAnimation;\n if (!isNullOrUndefined(animationOptions)) {\n animationOptions.end = function () {\n if (!_this.isDestroyed) {\n removeClass([_this.element], CLASSNAMES.OPEN);\n addClass([_this.element], CLASSNAMES.CLOSE);\n _this.trigger('close');\n }\n };\n new Animation(animationOptions).animate(this.element);\n }\n else {\n removeClass([this.element], CLASSNAMES.OPEN);\n addClass([this.element], CLASSNAMES.CLOSE);\n this.trigger('close');\n }\n };\n /**\n * Gets scrollable parent elements for the given element.\n * @param { HTMLElement } element - Specify the element to get the scrollable parents of it.\n */\n Popup.prototype.getScrollableParent = function (element) {\n this.checkFixedParent(element);\n return getScrollableParent(element, this.fixedParent);\n };\n Popup.prototype.checkFixedParent = function (element) {\n var parent = element.parentElement;\n while (parent && parent.tagName !== 'HTML') {\n var parentStyle = getComputedStyle(parent);\n if (parentStyle.position === 'fixed' && this.element.offsetParent && this.element.offsetParent.tagName === 'BODY') {\n this.element.style.position = 'fixed';\n this.fixedParent = true;\n }\n parent = parent.parentElement;\n if (isNullOrUndefined(this.element.offsetParent) && parentStyle.position === 'fixed'\n && this.element.style.position === 'fixed') {\n this.fixedParent = true;\n }\n }\n };\n __decorate([\n Property('auto')\n ], Popup.prototype, \"height\", void 0);\n __decorate([\n Property('auto')\n ], Popup.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], Popup.prototype, \"content\", void 0);\n __decorate([\n Property('container')\n ], Popup.prototype, \"targetType\", void 0);\n __decorate([\n Property(null)\n ], Popup.prototype, \"viewPortElement\", void 0);\n __decorate([\n Property({ X: 'none', Y: 'none' })\n ], Popup.prototype, \"collision\", void 0);\n __decorate([\n Property('')\n ], Popup.prototype, \"relateTo\", void 0);\n __decorate([\n Complex({}, PositionData)\n ], Popup.prototype, \"position\", void 0);\n __decorate([\n Property(0)\n ], Popup.prototype, \"offsetX\", void 0);\n __decorate([\n Property(0)\n ], Popup.prototype, \"offsetY\", void 0);\n __decorate([\n Property(1000)\n ], Popup.prototype, \"zIndex\", void 0);\n __decorate([\n Property(false)\n ], Popup.prototype, \"enableRtl\", void 0);\n __decorate([\n Property('reposition')\n ], Popup.prototype, \"actionOnScroll\", void 0);\n __decorate([\n Property(null)\n ], Popup.prototype, \"showAnimation\", void 0);\n __decorate([\n Property(null)\n ], Popup.prototype, \"hideAnimation\", void 0);\n __decorate([\n Event()\n ], Popup.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], Popup.prototype, \"close\", void 0);\n __decorate([\n Event()\n ], Popup.prototype, \"targetExitViewport\", void 0);\n Popup = __decorate([\n NotifyPropertyChanges\n ], Popup);\n return Popup;\n}(Component));\nexport { Popup };\n/**\n * Gets scrollable parent elements for the given element.\n * @param { HTMLElement } element - Specify the element to get the scrollable parents of it.\n * @private\n */\nexport function getScrollableParent(element, fixedParent) {\n var eleStyle = getComputedStyle(element);\n var scrollParents = [];\n var overflowRegex = /(auto|scroll)/;\n var parent = element.parentElement;\n while (parent && parent.tagName !== 'HTML') {\n var parentStyle = getComputedStyle(parent);\n if (!(eleStyle.position === 'absolute' && parentStyle.position === 'static')\n && overflowRegex.test(parentStyle.overflow + parentStyle.overflowY + parentStyle.overflowX)) {\n scrollParents.push(parent);\n }\n parent = parent.parentElement;\n }\n if (!fixedParent) {\n scrollParents.push(document);\n }\n return scrollParents;\n}\n/**\n * Gets the maximum z-index of the given element.\n * @param { HTMLElement } element - Specify the element to get the maximum z-index of it.\n * @private\n */\nexport function getZindexPartial(element) {\n // upto body traversal\n var parent = element.parentElement;\n var parentZindex = [];\n while (parent) {\n if (parent.tagName !== 'BODY') {\n var index = document.defaultView.getComputedStyle(parent, null).getPropertyValue('z-index');\n var position = document.defaultView.getComputedStyle(parent, null).getPropertyValue('position');\n if (index !== 'auto' && position !== 'static') {\n parentZindex.push(index);\n }\n parent = parent.parentElement;\n }\n else {\n break;\n }\n }\n //Body direct children element traversal\n var childrenZindex = [];\n for (var i = 0; i < document.body.children.length; i++) {\n if (!element.isEqualNode(document.body.children[i])) {\n var index = document.defaultView.getComputedStyle(document.body.children[i], null).getPropertyValue('z-index');\n var position = document.defaultView.getComputedStyle(document.body.children[i], null).getPropertyValue('position');\n if (index !== 'auto' && position !== 'static') {\n childrenZindex.push(index);\n }\n }\n }\n childrenZindex.push('999');\n var siblingsZindex = [];\n if (!isNullOrUndefined(element.parentElement) && element.parentElement.tagName !== 'BODY') {\n var childNodes = [].slice.call(element.parentElement.children);\n for (var i = 0; i < childNodes.length; i++) {\n var index = document.defaultView.getComputedStyle(childNodes[i], null).getPropertyValue('z-index');\n var position = document.defaultView.getComputedStyle(childNodes[i], null).getPropertyValue('position');\n if (index !== 'auto' && position !== 'static') {\n siblingsZindex.push(index);\n }\n }\n }\n var finalValue = parentZindex.concat(childrenZindex, siblingsZindex);\n var currentZindexValue = Math.max.apply(Math, finalValue) + 1;\n // Checking the max-zindex value\n return currentZindexValue > 2147483647 ? 2147483647 : currentZindexValue;\n}\n/**\n * Gets the maximum z-index of the page.\n * @param { HTMLElement } tagName - Specify the tagName to get the maximum z-index of it.\n * @private\n */\nexport function getMaxZindex(tagName) {\n if (tagName === void 0) { tagName = ['*']; }\n var maxZindex = [];\n for (var i = 0; i < tagName.length; i++) {\n var elements = document.getElementsByTagName(tagName[i]);\n for (var i_1 = 0; i_1 < elements.length; i_1++) {\n var index = document.defaultView.getComputedStyle(elements[i_1], null).getPropertyValue('z-index');\n var position = document.defaultView.getComputedStyle(elements[i_1], null).getPropertyValue('position');\n if (index !== 'auto' && position !== 'static') {\n maxZindex.push(index);\n }\n }\n }\n var currentZindexValue = Math.max.apply(Math, maxZindex) + 1;\n return currentZindexValue > 2147483647 ? 2147483647 : currentZindexValue;\n}\n","/**\n * Resize library\n */\nimport { isNullOrUndefined, createElement, EventHandler, detach, Browser } from '@syncfusion/ej2-base';\nvar elementClass = ['north-west', 'north', 'north-east', 'west', 'east', 'south-west', 'south', 'south-east'];\nvar targetElement;\nvar selectedHandler;\nvar originalWidth = 0;\nvar originalHeight = 0;\nvar originalX = 0;\nvar originalY = 0;\nvar originalMouseX = 0;\nvar originalMouseY = 0;\nvar RESIZE_HANDLER = 'e-resize-handle';\nvar FOCUSED_HANDLER = 'e-focused-handle';\nvar RESTRICT_LEFT = ['e-restrict-left'];\nvar RESIZE_WITHIN_VIEWPORT = 'e-resize-viewport';\nvar minHeight;\nvar maxHeight;\nvar minWidth;\nvar maxWidth;\nvar containerElement;\nvar resizeStart = null;\nvar resize = null;\nvar resizeEnd = null;\nvar resizeWestWidth;\nvar setLeft = true;\nvar previousWidth = 0;\nvar setWidth = true;\nexport function createResize(args) {\n resizeStart = args.resizeBegin;\n resize = args.resizing;\n resizeEnd = args.resizeComplete;\n targetElement = getDOMElement(args.element);\n containerElement = getDOMElement(args.boundary);\n var directions = args.direction.split(' ');\n for (var i = 0; i < directions.length; i++) {\n var resizeHandler = createElement('div', { className: 'e-icons ' + RESIZE_HANDLER + ' ' + 'e-' + directions[i] });\n targetElement.appendChild(resizeHandler);\n }\n minHeight = args.minHeight;\n minWidth = args.minWidth;\n maxWidth = args.maxWidth;\n maxHeight = args.maxHeight;\n wireEvents();\n}\nfunction getDOMElement(element) {\n var domElement;\n if (!isNullOrUndefined(element)) {\n if (typeof (element) === 'string') {\n domElement = document.querySelector(element);\n }\n else {\n domElement = element;\n }\n }\n return domElement;\n}\nfunction wireEvents() {\n var resizers = targetElement.querySelectorAll('.' + RESIZE_HANDLER);\n for (var i = 0; i < resizers.length; i++) {\n selectedHandler = resizers[i];\n EventHandler.add(selectedHandler, 'mousedown', onMouseDown, this);\n var eventName = (Browser.info.name === 'msie') ? 'pointerdown' : 'touchstart';\n EventHandler.add(selectedHandler, eventName, onTouchStart, this);\n }\n}\n/* istanbul ignore next */\nfunction getEventType(e) {\n return (e.indexOf('mouse') > -1) ? 'mouse' : 'touch';\n}\n/* istanbul ignore next */\nfunction onMouseDown(e) {\n e.preventDefault();\n targetElement = e.target.parentElement;\n calculateValues();\n originalMouseX = e.pageX;\n originalMouseY = e.pageY;\n e.target.classList.add(FOCUSED_HANDLER);\n if (!isNullOrUndefined(resizeStart)) {\n resizeStart(e);\n }\n var target = (isNullOrUndefined(containerElement)) ? document : containerElement;\n EventHandler.add(target, 'mousemove', onMouseMove, this);\n EventHandler.add(document, 'mouseup', onMouseUp, this);\n for (var i = 0; i < RESTRICT_LEFT.length; i++) {\n if (targetElement.classList.contains(RESTRICT_LEFT[i])) {\n setLeft = false;\n }\n else {\n setLeft = true;\n }\n }\n}\n/* istanbul ignore next */\nfunction onMouseUp(e) {\n var touchMoveEvent = (Browser.info.name === 'msie') ? 'pointermove' : 'touchmove';\n var touchEndEvent = (Browser.info.name === 'msie') ? 'pointerup' : 'touchend';\n var target = (isNullOrUndefined(containerElement)) ? document : containerElement;\n EventHandler.remove(target, 'mousemove', onMouseMove);\n EventHandler.remove(target, touchMoveEvent, onMouseMove);\n var eventName = (Browser.info.name === 'msie') ? 'pointerdown' : 'touchstart';\n EventHandler.remove(target, eventName, onMouseMove);\n if (!isNullOrUndefined(document.body.querySelector('.' + FOCUSED_HANDLER))) {\n document.body.querySelector('.' + FOCUSED_HANDLER).classList.remove(FOCUSED_HANDLER);\n }\n if (!isNullOrUndefined(resizeEnd)) {\n resizeEnd(e);\n }\n EventHandler.remove(document, 'mouseup', onMouseUp);\n EventHandler.remove(document, touchEndEvent, onMouseUp);\n}\n/* istanbul ignore next */\nfunction calculateValues() {\n originalWidth = parseFloat(getComputedStyle(targetElement, null).getPropertyValue('width').replace('px', ''));\n originalHeight = parseFloat(getComputedStyle(targetElement, null).getPropertyValue('height').replace('px', ''));\n originalX = targetElement.getBoundingClientRect().left;\n originalY = targetElement.getBoundingClientRect().top;\n}\n/* istanbul ignore next */\nfunction onTouchStart(e) {\n targetElement = e.target.parentElement;\n calculateValues();\n originalMouseX = e.touches[0].pageX;\n originalMouseY = e.touches[0].pageY;\n if (!isNullOrUndefined(resizeStart)) {\n resizeStart(e);\n }\n var touchMoveEvent = (Browser.info.name === 'msie') ? 'pointermove' : 'touchmove';\n var touchEndEvent = (Browser.info.name === 'msie') ? 'pointerup' : 'touchend';\n var target = (isNullOrUndefined(containerElement)) ? document : containerElement;\n EventHandler.add(target, touchMoveEvent, onMouseMove, this);\n EventHandler.add(document, touchEndEvent, onMouseUp);\n}\n/* istanbul ignore next */\nfunction onMouseMove(e) {\n if (e.target.classList.contains(RESIZE_HANDLER) && e.target.classList.contains(FOCUSED_HANDLER)) {\n selectedHandler = e.target;\n }\n else if (!isNullOrUndefined(document.body.querySelector('.' + FOCUSED_HANDLER))) {\n selectedHandler = document.body.querySelector('.' + FOCUSED_HANDLER);\n }\n if (!isNullOrUndefined(selectedHandler)) {\n var resizeTowards = '';\n for (var i = 0; i < elementClass.length; i++) {\n if (selectedHandler.classList.contains('e-' + elementClass[i])) {\n resizeTowards = elementClass[i];\n }\n }\n if (!isNullOrUndefined(resize)) {\n resize(e);\n }\n switch (resizeTowards) {\n case 'south':\n resizeSouth(e);\n break;\n case 'north':\n resizeNorth(e);\n break;\n case 'west':\n resizeWest(e);\n break;\n case 'east':\n resizeEast(e);\n break;\n case 'south-east':\n resizeSouth(e);\n resizeEast(e);\n break;\n case 'south-west':\n resizeSouth(e);\n resizeWest(e);\n break;\n case 'north-east':\n resizeNorth(e);\n resizeEast(e);\n break;\n case 'north-west':\n resizeNorth(e);\n resizeWest(e);\n break;\n default: break;\n }\n }\n}\n/* istanbul ignore next */\nfunction getClientRectValues(element) {\n return element.getBoundingClientRect();\n}\n/* istanbul ignore next */\n// tslint:disable-next-line\nfunction resizeSouth(e) {\n var documentHeight = document.documentElement.clientHeight;\n var calculateValue = false;\n var containerRectValues;\n var currentpageY = (getEventType(e.type) === 'mouse') ? e.pageY : e.touches[0].pageY;\n var targetRectValues = getClientRectValues(targetElement);\n if (!isNullOrUndefined(containerElement)) {\n containerRectValues = getClientRectValues(containerElement);\n }\n if (!isNullOrUndefined(containerElement)) {\n calculateValue = true;\n }\n else if (isNullOrUndefined(containerElement) && ((documentHeight - currentpageY) >= 0 || (targetRectValues.top < 0))) {\n calculateValue = true;\n }\n var calculatedHeight = originalHeight + (currentpageY - originalMouseY);\n calculatedHeight = (calculatedHeight > minHeight) ? calculatedHeight : minHeight;\n var containerTop = 0;\n if (!isNullOrUndefined(containerElement)) {\n containerTop = containerRectValues.top;\n }\n var borderValue = isNullOrUndefined(containerElement) ? 0 : containerElement.offsetHeight - containerElement.clientHeight;\n var topWithoutborder = (targetRectValues.top - containerTop) - (borderValue / 2);\n topWithoutborder = (topWithoutborder < 0) ? 0 : topWithoutborder;\n if (targetRectValues.top > 0 && (topWithoutborder + calculatedHeight) > maxHeight) {\n calculateValue = false;\n if (targetElement.classList.contains(RESIZE_WITHIN_VIEWPORT)) {\n return;\n }\n targetElement.style.height = (maxHeight - parseInt(topWithoutborder.toString(), 10)) + 'px';\n return;\n }\n var targetTop = 0;\n if (calculateValue) {\n if (targetRectValues.top < 0 && (documentHeight + (targetRectValues.height + targetRectValues.top) > 0)) {\n targetTop = targetRectValues.top;\n if ((calculatedHeight + targetTop) <= 30) {\n calculatedHeight = (targetRectValues.height - (targetRectValues.height + targetRectValues.top)) + 30;\n }\n }\n if (((calculatedHeight + targetRectValues.top) >= maxHeight)) {\n targetElement.style.height = targetRectValues.height +\n (documentHeight - (targetRectValues.height + targetRectValues.top)) + 'px';\n }\n var calculatedTop = (isNullOrUndefined(containerElement)) ? targetTop : topWithoutborder;\n if (calculatedHeight >= minHeight && ((calculatedHeight + calculatedTop) <= maxHeight)) {\n targetElement.style.height = calculatedHeight + 'px';\n }\n }\n}\n/* istanbul ignore next */\n// tslint:disable-next-line\nfunction resizeNorth(e) {\n var calculateValue = false;\n var boundaryRectValues;\n var pageY = (getEventType(e.type) === 'mouse') ? e.pageY : e.touches[0].pageY;\n var targetRectValues = getClientRectValues(targetElement);\n if (!isNullOrUndefined(containerElement)) {\n boundaryRectValues = getClientRectValues(containerElement);\n }\n if (!isNullOrUndefined(containerElement) && (targetRectValues.top - boundaryRectValues.top) > 0) {\n calculateValue = true;\n }\n else if (isNullOrUndefined(containerElement) && pageY > 0) {\n calculateValue = true;\n }\n var currentHeight = originalHeight - (pageY - originalMouseY);\n if ((getClientRectValues(targetElement).bottom + currentHeight) > maxHeight) {\n calculateValue = false;\n targetElement.style.height = maxHeight - getClientRectValues(targetElement).bottom + 'px';\n }\n if (calculateValue) {\n if (currentHeight >= minHeight && currentHeight <= maxHeight) {\n var containerTop = 0;\n if (!isNullOrUndefined(containerElement)) {\n containerTop = boundaryRectValues.top;\n }\n var top_1 = (originalY - containerTop) + (pageY - originalMouseY);\n top_1 = top_1 > 0 ? top_1 : 1;\n targetElement.style.height = currentHeight + 'px';\n targetElement.style.top = top_1 + 'px';\n }\n }\n}\n/* istanbul ignore next */\n// tslint:disable-next-line\nfunction resizeWest(e) {\n var documentWidth = document.documentElement.clientWidth;\n var calculateValue = false;\n var rectValues;\n if (!isNullOrUndefined(containerElement)) {\n rectValues = getClientRectValues(containerElement);\n }\n var pageX = (getEventType(e.type) === 'mouse') ? e.pageX : e.touches[0].pageX;\n var targetRectValues = getClientRectValues(targetElement);\n var borderValue = isNullOrUndefined(containerElement) ? 0 : containerElement.offsetWidth - containerElement.clientWidth;\n var left = isNullOrUndefined(containerElement) ? 0 : rectValues.left;\n var containerWidth = isNullOrUndefined(containerElement) ? 0 : rectValues.width;\n if (isNullOrUndefined(resizeWestWidth)) {\n if (!isNullOrUndefined(containerElement)) {\n resizeWestWidth = (((targetRectValues.left - left) - borderValue / 2)) + targetRectValues.width;\n resizeWestWidth = resizeWestWidth + (containerWidth - borderValue - resizeWestWidth);\n }\n else {\n resizeWestWidth = documentWidth;\n }\n }\n if (!isNullOrUndefined(containerElement) &&\n (((targetRectValues.left - rectValues.left) + targetRectValues.width +\n (rectValues.right - targetRectValues.right)) - borderValue) <= maxWidth) {\n calculateValue = true;\n }\n else if (isNullOrUndefined(containerElement) && pageX >= 0) {\n calculateValue = true;\n }\n var calculatedWidth = originalWidth - (pageX - originalMouseX);\n if (setLeft) {\n calculatedWidth = (calculatedWidth > resizeWestWidth) ? resizeWestWidth : calculatedWidth;\n }\n if (calculateValue) {\n if (calculatedWidth >= minWidth && calculatedWidth <= maxWidth) {\n var containerLeft = 0;\n if (!isNullOrUndefined(containerElement)) {\n containerLeft = rectValues.left;\n }\n var left_1 = (originalX - containerLeft) + (pageX - originalMouseX);\n left_1 = (left_1 > 0) ? left_1 : 1;\n if (calculatedWidth !== previousWidth && setWidth) {\n targetElement.style.width = calculatedWidth + 'px';\n }\n if (setLeft) {\n targetElement.style.left = left_1 + 'px';\n if (left_1 === 1) {\n setWidth = false;\n }\n else {\n setWidth = true;\n }\n }\n }\n }\n previousWidth = calculatedWidth;\n}\n/* istanbul ignore next */\n// tslint:disable-next-line\nfunction resizeEast(e) {\n var documentWidth = document.documentElement.clientWidth;\n var calculateValue = false;\n var containerRectValues;\n if (!isNullOrUndefined(containerElement)) {\n containerRectValues = getClientRectValues(containerElement);\n }\n var pageX = (getEventType(e.type) === 'mouse') ? e.pageX : e.touches[0].pageX;\n var targetRectValues = getClientRectValues(targetElement);\n if (!isNullOrUndefined(containerElement) && (((targetRectValues.left - containerRectValues.left) + targetRectValues.width) < maxWidth\n || (targetRectValues.right - containerRectValues.left) > targetRectValues.width)) {\n calculateValue = true;\n }\n else if (isNullOrUndefined(containerElement) && (documentWidth - pageX) > 0) {\n calculateValue = true;\n }\n var calculatedWidth = originalWidth + (pageX - originalMouseX);\n var containerLeft = 0;\n if (!isNullOrUndefined(containerElement)) {\n containerLeft = containerRectValues.left;\n }\n if (((targetRectValues.left - containerLeft) + calculatedWidth) > maxWidth) {\n calculateValue = false;\n if (targetElement.classList.contains(RESIZE_WITHIN_VIEWPORT)) {\n return;\n }\n targetElement.style.width = maxWidth - (targetRectValues.left - containerLeft) + 'px';\n }\n if (calculateValue) {\n if (calculatedWidth >= minWidth && calculatedWidth <= maxWidth) {\n targetElement.style.width = calculatedWidth + 'px';\n }\n }\n}\n/* istanbul ignore next */\nexport function setMinHeight(minimumHeight) {\n minHeight = minimumHeight;\n}\nexport function removeResize() {\n var handlers = targetElement.querySelectorAll('.' + RESIZE_HANDLER);\n for (var i = 0; i < handlers.length; i++) {\n detach(handlers[i]);\n }\n}\n","import { isNullOrUndefined, classList, createElement } from '@syncfusion/ej2-base';\nvar globalTimeOut = {};\nvar spinTemplate = null;\nvar spinCSSClass = null;\nvar DEFT_MAT_WIDTH = 30;\nvar DEFT_FAB_WIDTH = 30;\nvar DEFT_BOOT_WIDTH = 30;\nvar DEFT_BOOT4_WIDTH = 36;\nvar CLS_SHOWSPIN = 'e-spin-show';\nvar CLS_HIDESPIN = 'e-spin-hide';\nvar CLS_MATERIALSPIN = 'e-spin-material';\nvar CLS_FABRICSPIN = 'e-spin-fabric';\nvar CLS_BOOTSPIN = 'e-spin-bootstrap';\nvar CLS_BOOT4SPIN = 'e-spin-bootstrap4';\nvar CLS_HIGHCONTRASTSPIN = 'e-spin-high-contrast';\nvar CLS_SPINWRAP = 'e-spinner-pane';\nvar CLS_SPININWRAP = 'e-spinner-inner';\nvar CLS_SPINCIRCLE = 'e-path-circle';\nvar CLS_SPINARC = 'e-path-arc';\nvar CLS_SPINLABEL = 'e-spin-label';\nvar CLS_SPINTEMPLATE = 'e-spin-template';\n/**\n * Create a spinner for the specified target element.\n * ```\n * E.g : createSpinner({ target: targetElement, width: '34px', label: 'Loading..' });\n * ```\n * @param args\n * @private\n */\nexport function createSpinner(args, internalCreateElement) {\n var radius;\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n var container = create_spinner_container(args.target, makeElement);\n if (!isNullOrUndefined(args.cssClass)) {\n container.wrap.classList.add(args.cssClass);\n }\n if (!isNullOrUndefined(args.template) || !isNullOrUndefined(spinTemplate)) {\n var template = !isNullOrUndefined(args.template) ? args.template : spinTemplate;\n container.wrap.classList.add(CLS_SPINTEMPLATE);\n replaceContent(container.wrap, template, spinCSSClass);\n }\n else {\n var theme = !isNullOrUndefined(args.type) ? args.type : getTheme(container.wrap);\n var width = !isNullOrUndefined(args.width) ? args.width : undefined;\n radius = calculateRadius(width, theme);\n setTheme(theme, container.wrap, radius, makeElement);\n if (!isNullOrUndefined(args.label)) {\n createLabel(container.inner_wrap, args.label, makeElement);\n }\n }\n container.wrap.classList.add(CLS_HIDESPIN);\n container = null;\n}\nfunction createLabel(container, label, makeElement) {\n var labelEle = makeElement('div', {});\n labelEle.classList.add(CLS_SPINLABEL);\n labelEle.textContent = label;\n container.appendChild(labelEle);\n return labelEle;\n}\nfunction createMaterialSpinner(container, radius, makeElement) {\n var uniqueID = random_generator();\n globalTimeOut[uniqueID] = { timeOut: 0, type: 'Material', radius: radius };\n create_material_element(container, uniqueID, makeElement, CLS_MATERIALSPIN);\n mat_calculate_attributes(radius, container, 'Material', CLS_MATERIALSPIN);\n}\nfunction createBootstrap4Spinner(container, radius, makeElement) {\n var uniqueID = random_generator();\n globalTimeOut[uniqueID] = { timeOut: 0, type: 'Bootstrap4', radius: radius };\n create_material_element(container, uniqueID, makeElement, CLS_BOOT4SPIN);\n mat_calculate_attributes(radius, container, 'Bootstrap4', CLS_BOOT4SPIN);\n}\nfunction startMatAnimate(container, uniqueID, radius) {\n var globalObject = {};\n var timeOutVar = 0;\n globalTimeOut[uniqueID].timeOut = 0;\n globalObject[uniqueID] = globalVariables(uniqueID, radius, 0, 0);\n var spinnerInfo = { uniqueID: uniqueID, container: container, globalInfo: globalObject, timeOutVar: timeOutVar };\n animateMaterial(spinnerInfo);\n}\nfunction createFabricSpinner(container, radius, makeElement) {\n var uniqueID = random_generator();\n globalTimeOut[uniqueID] = { timeOut: 0, type: 'Fabric', radius: radius };\n create_fabric_element(container, uniqueID, CLS_FABRICSPIN, makeElement);\n fb_calculate_attributes(radius, container, CLS_FABRICSPIN);\n}\nfunction createHighContrastSpinner(container, radius, makeElement) {\n var uniqueID = random_generator();\n globalTimeOut[uniqueID] = { timeOut: 0, type: 'HighContrast', radius: radius };\n create_fabric_element(container, uniqueID, CLS_HIGHCONTRASTSPIN, makeElement);\n fb_calculate_attributes(radius, container, CLS_HIGHCONTRASTSPIN);\n}\nfunction getTheme(container) {\n var theme = window.getComputedStyle(container, ':after').getPropertyValue('content');\n return theme.replace(/['\"]+/g, '');\n}\nfunction setTheme(theme, container, radius, makeElement) {\n var innerContainer = container.querySelector('.' + CLS_SPININWRAP);\n var svg = innerContainer.querySelector('svg');\n if (!isNullOrUndefined(svg)) {\n innerContainer.removeChild(svg);\n }\n switch (theme) {\n case 'Material':\n createMaterialSpinner(innerContainer, radius, makeElement);\n break;\n case 'Fabric':\n createFabricSpinner(innerContainer, radius, makeElement);\n break;\n case 'Bootstrap':\n createBootstrapSpinner(innerContainer, radius, makeElement);\n break;\n case 'HighContrast':\n createHighContrastSpinner(innerContainer, radius, makeElement);\n break;\n case 'Bootstrap4':\n createBootstrap4Spinner(innerContainer, radius, makeElement);\n break;\n }\n}\nfunction createBootstrapSpinner(innerContainer, radius, makeElement) {\n var uniqueID = random_generator();\n globalTimeOut[uniqueID] = { timeOut: 0, type: 'Bootstrap', radius: radius };\n create_bootstrap_element(innerContainer, uniqueID, makeElement);\n boot_calculate_attributes(innerContainer, radius);\n}\nfunction create_bootstrap_element(innerContainer, uniqueID, makeElement) {\n var svgBoot = document.createElementNS('http://www.w3.org/2000/svg', 'svg');\n var viewBoxValue = 64;\n var trans = 32;\n var defaultRadius = 2;\n svgBoot.setAttribute('id', uniqueID);\n svgBoot.setAttribute('class', CLS_BOOTSPIN);\n svgBoot.setAttribute('viewBox', '0 0 ' + viewBoxValue + ' ' + viewBoxValue);\n innerContainer.insertBefore(svgBoot, innerContainer.firstChild);\n for (var item = 0; item <= 7; item++) {\n var bootCircle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');\n bootCircle.setAttribute('class', CLS_SPINCIRCLE + '_' + item);\n bootCircle.setAttribute('r', defaultRadius + '');\n bootCircle.setAttribute('transform', 'translate(' + trans + ',' + trans + ')');\n svgBoot.appendChild(bootCircle);\n }\n}\nfunction boot_calculate_attributes(innerContainer, radius) {\n var svg = innerContainer.querySelector('svg.e-spin-bootstrap');\n svg.style.width = svg.style.height = radius + 'px';\n var x = 0;\n var y = 0;\n var rad = 24;\n var startArc = 90;\n for (var item = 0; item <= 7; item++) {\n var start = defineArcPoints(x, y, rad, startArc);\n var circleEle = svg.querySelector('.' + CLS_SPINCIRCLE + '_' + item);\n circleEle.setAttribute('cx', start.x + '');\n circleEle.setAttribute('cy', start.y + '');\n startArc = startArc >= 360 ? 0 : startArc;\n startArc = startArc + 45;\n }\n}\nfunction generateSeries(begin, stop) {\n var series = [];\n var start = begin;\n var end = stop;\n var increment = false;\n var count = 1;\n formSeries(start);\n function formSeries(i) {\n series.push(i);\n if (i !== end || count === 1) {\n if (i <= start && i > 1 && !increment) {\n i = parseFloat((i - 0.2).toFixed(2));\n }\n else if (i === 1) {\n i = 7;\n i = parseFloat((i + 0.2).toFixed(2));\n increment = true;\n }\n else if (i < 8 && increment) {\n i = parseFloat((i + 0.2).toFixed(2));\n if (i === 8) {\n increment = false;\n }\n }\n else if (i <= 8 && !increment) {\n i = parseFloat((i - 0.2).toFixed(2));\n }\n ++count;\n formSeries(i);\n }\n }\n return series;\n}\nfunction animateBootstrap(innerContainer) {\n var svg = innerContainer.querySelector('svg.e-spin-bootstrap');\n var id = svg.getAttribute('id');\n for (var i = 1; i <= 8; i++) {\n var circleEle = (innerContainer.getElementsByClassName('e-path-circle_' +\n (i === 8 ? 0 : i))[0]);\n rotation(circleEle, i, i, generateSeries(i, i), id);\n }\n function rotation(circle, start, end, series, id) {\n var count = 0;\n boot_animate(start);\n function boot_animate(radius) {\n if (globalTimeOut[id].isAnimate) {\n ++count;\n circle.setAttribute('r', radius + '');\n if (count >= series.length) {\n count = 0;\n }\n globalTimeOut[id].timeOut = setTimeout(boot_animate.bind(null, series[count]), 18);\n }\n }\n }\n}\nfunction replaceContent(container, template, cssClass) {\n if (!isNullOrUndefined(cssClass)) {\n container.classList.add(cssClass);\n }\n var inner = container.querySelector('.e-spinner-inner');\n inner.innerHTML = template;\n}\nfunction calculateRadius(width, theme) {\n var defaultSize;\n switch (theme) {\n case 'Material':\n defaultSize = DEFT_MAT_WIDTH;\n break;\n case 'Fabric':\n defaultSize = DEFT_FAB_WIDTH;\n break;\n case 'Bootstrap4':\n defaultSize = DEFT_BOOT4_WIDTH;\n break;\n default:\n defaultSize = DEFT_BOOT_WIDTH;\n }\n width = width ? parseFloat(width + '') : defaultSize;\n return theme === 'Bootstrap' ? width : width / 2;\n}\nfunction globalVariables(id, radius, count, previousId) {\n return {\n radius: radius,\n count: count,\n previousId: previousId\n };\n}\nfunction random_generator() {\n var random = '';\n var combine = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';\n for (var i = 0; i < 5; i++) {\n random += combine.charAt(Math.floor(Math.random() * combine.length));\n }\n return random;\n}\nfunction create_fabric_element(innerCon, uniqueID, themeClass, makeElement) {\n var svgFabric = document.createElementNS('http://www.w3.org/2000/svg', 'svg');\n svgFabric.setAttribute('id', uniqueID);\n svgFabric.setAttribute('class', themeClass);\n var fabricCirclePath = document.createElementNS('http://www.w3.org/2000/svg', 'path');\n fabricCirclePath.setAttribute('class', CLS_SPINCIRCLE);\n var fabricCircleArc = document.createElementNS('http://www.w3.org/2000/svg', 'path');\n fabricCircleArc.setAttribute('class', CLS_SPINARC);\n innerCon.insertBefore(svgFabric, innerCon.firstChild);\n svgFabric.appendChild(fabricCirclePath);\n svgFabric.appendChild(fabricCircleArc);\n}\nfunction create_material_element(innerContainer, uniqueID, makeElement, cls) {\n var svgMaterial = document.createElementNS('http://www.w3.org/2000/svg', 'svg');\n svgMaterial.setAttribute('class', cls);\n svgMaterial.setAttribute('id', uniqueID);\n var matCirclePath = document.createElementNS('http://www.w3.org/2000/svg', 'path');\n matCirclePath.setAttribute('class', CLS_SPINCIRCLE);\n innerContainer.insertBefore(svgMaterial, innerContainer.firstChild);\n svgMaterial.appendChild(matCirclePath);\n}\nfunction create_spinner_container(target, makeElement) {\n var spinnerContainer = makeElement('div', {});\n spinnerContainer.classList.add(CLS_SPINWRAP);\n var spinnerInnerContainer = makeElement('div', {});\n spinnerInnerContainer.classList.add(CLS_SPININWRAP);\n target.appendChild(spinnerContainer);\n spinnerContainer.appendChild(spinnerInnerContainer);\n return { wrap: spinnerContainer, inner_wrap: spinnerInnerContainer };\n}\nfunction animateMaterial(spinnerInfo) {\n var start = 1;\n var end = 149;\n var duration = 1333;\n var max = 75;\n createCircle(start, end, easeAnimation, duration, spinnerInfo.globalInfo[spinnerInfo.uniqueID].count, max, spinnerInfo);\n spinnerInfo.globalInfo[spinnerInfo.uniqueID].count = ++spinnerInfo.globalInfo[spinnerInfo.uniqueID].count % 4;\n}\nfunction createCircle(start, end, easing, duration, count, max, spinnerInfo) {\n var id = ++spinnerInfo.globalInfo[spinnerInfo.uniqueID].previousId;\n var startTime = new Date().getTime();\n var change = end - start;\n var diameter = getSize((spinnerInfo.globalInfo[spinnerInfo.uniqueID].radius * 2) + '');\n var strokeSize = getStrokeSize(diameter);\n var rotate = -90 * (spinnerInfo.globalInfo[spinnerInfo.uniqueID].count || 0);\n mat_animation(spinnerInfo);\n function mat_animation(spinnerInfo) {\n var currentTime = Math.max(0, Math.min(new Date().getTime() - startTime, duration));\n updatePath(easing(currentTime, start, change, duration), spinnerInfo.container);\n if (id === spinnerInfo.globalInfo[spinnerInfo.uniqueID].previousId && currentTime < duration) {\n globalTimeOut[spinnerInfo.uniqueID].timeOut = setTimeout(mat_animation.bind(null, spinnerInfo), 1);\n }\n else {\n animateMaterial(spinnerInfo);\n }\n }\n function updatePath(value, container) {\n if ((!isNullOrUndefined(container.querySelector('svg.e-spin-material')))\n && (!isNullOrUndefined(container.querySelector('svg.e-spin-material').querySelector('path.e-path-circle')))) {\n var svg = container.querySelector('svg.e-spin-material');\n var path = svg.querySelector('path.e-path-circle');\n path.setAttribute('stroke-dashoffset', getDashOffset(diameter, strokeSize, value, max) + '');\n path.setAttribute('transform', 'rotate(' + (rotate) + ' ' + diameter / 2 + ' ' + diameter / 2 + ')');\n }\n }\n}\nfunction mat_calculate_attributes(radius, container, type, cls) {\n var diameter = radius * 2;\n var svg = container.querySelector('svg.' + cls);\n var path = svg.querySelector('path.e-path-circle');\n var strokeSize = getStrokeSize(diameter);\n var transformOrigin = (diameter / 2) + 'px';\n svg.setAttribute('viewBox', '0 0 ' + diameter + ' ' + diameter);\n svg.style.width = svg.style.height = diameter + 'px';\n svg.style.transformOrigin = transformOrigin + ' ' + transformOrigin + ' ' + transformOrigin;\n path.setAttribute('d', drawArc(diameter, strokeSize));\n if (type === 'Material') {\n path.setAttribute('stroke-width', strokeSize + '');\n path.setAttribute('stroke-dasharray', ((diameter - strokeSize) * Math.PI * 0.75) + '');\n path.setAttribute('stroke-dashoffset', getDashOffset(diameter, strokeSize, 1, 75) + '');\n }\n}\nfunction getSize(value) {\n var parsed = parseFloat(value);\n return parsed;\n}\nfunction drawArc(diameter, strokeSize) {\n var radius = diameter / 2;\n var offset = strokeSize / 2;\n return 'M' + radius + ',' + offset\n + 'A' + (radius - offset) + ',' + (radius - offset) + ' 0 1 1 ' + offset + ',' + radius;\n}\nfunction getStrokeSize(diameter) {\n return 10 / 100 * diameter;\n}\nfunction getDashOffset(diameter, strokeSize, value, max) {\n return (diameter - strokeSize) * Math.PI * ((3 * (max) / 100) - (value / 100));\n}\nfunction easeAnimation(current, start, change, duration) {\n var timestamp = (current /= duration) * current;\n var timecount = timestamp * current;\n return start + change * (6 * timecount * timestamp + -15 * timestamp * timestamp + 10 * timecount);\n}\nfunction fb_calculate_attributes(radius, innerConainer, trgClass) {\n var centerX = radius;\n var centerY = radius;\n var diameter = radius * 2;\n var startArc = 315;\n var endArc = 45;\n var svg = innerConainer.querySelector('.' + trgClass);\n var circle = svg.querySelector('.e-path-circle');\n var path = svg.querySelector('.e-path-arc');\n var transformOrigin = (diameter / 2) + 'px';\n circle.setAttribute('d', defineCircle(centerX, centerY, radius));\n path.setAttribute('d', defineArc(centerX, centerY, radius, startArc, endArc));\n svg.setAttribute('viewBox', '0 0 ' + diameter + ' ' + diameter);\n svg.style.transformOrigin = transformOrigin + ' ' + transformOrigin + ' ' + transformOrigin;\n svg.style.width = svg.style.height = diameter + 'px';\n}\nfunction defineArcPoints(centerX, centerY, radius, angle) {\n var radians = (angle - 90) * Math.PI / 180.0;\n return {\n x: centerX + (radius * Math.cos(radians)),\n y: centerY + (radius * Math.sin(radians))\n };\n}\nfunction defineArc(x, y, radius, startArc, endArc) {\n var start = defineArcPoints(x, y, radius, endArc);\n var end = defineArcPoints(x, y, radius, startArc);\n var d = [\n 'M', start.x, start.y,\n 'A', radius, radius, 0, 0, 0, end.x, end.y\n ].join(' ');\n return d;\n}\nfunction defineCircle(x, y, radius) {\n var d = [\n 'M', x, y,\n 'm', -radius, 0,\n 'a', radius, radius, 0, 1, 0, radius * 2, 0,\n 'a', radius, radius, 0, 1, 0, -radius * 2, 0,\n ].join(' ');\n return d;\n}\n/**\n * Function to show the Spinner.\n * @param container - Specify the target of the Spinner.\n * @private\n */\nexport function showSpinner(container) {\n showHideSpinner(container, false);\n container = null;\n}\nfunction showHideSpinner(container, isHide) {\n var spinnerWrap = container.classList.contains(CLS_SPINWRAP) ? container :\n container.querySelector('.' + CLS_SPINWRAP);\n var inner = spinnerWrap.querySelector('.' + CLS_SPININWRAP);\n var spinCheck;\n spinCheck = isHide ? !spinnerWrap.classList.contains(CLS_SPINTEMPLATE) && !spinnerWrap.classList.contains(CLS_HIDESPIN) :\n !spinnerWrap.classList.contains(CLS_SPINTEMPLATE) && !spinnerWrap.classList.contains(CLS_SHOWSPIN);\n if (spinCheck) {\n var svgEle = spinnerWrap.querySelector('svg');\n if (isNullOrUndefined(svgEle)) {\n return;\n }\n var id = svgEle.getAttribute('id');\n globalTimeOut[id].isAnimate = !isHide;\n switch (globalTimeOut[id].type) {\n case 'Material':\n isHide ? clearTimeout(globalTimeOut[id].timeOut) : startMatAnimate(inner, id, globalTimeOut[id].radius);\n break;\n case 'Bootstrap':\n isHide ? clearTimeout(globalTimeOut[id].timeOut) : animateBootstrap(inner);\n break;\n }\n }\n isHide ? classList(spinnerWrap, [CLS_HIDESPIN], [CLS_SHOWSPIN]) : classList(spinnerWrap, [CLS_SHOWSPIN], [CLS_HIDESPIN]);\n container = null;\n}\n/**\n * Function to hide the Spinner.\n * @param container - Specify the target of the Spinner.\n * @private\n */\nexport function hideSpinner(container) {\n showHideSpinner(container, true);\n container = null;\n}\n/**\n * Function to change the Spinners in a page globally from application end.\n * ```\n * E.g : setSpinner({ cssClass: 'custom-css'; type: 'Material' });\n * ```\n * @param args\n * @private\n */\nexport function setSpinner(args, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n if (args.template !== undefined) {\n spinTemplate = args.template;\n if (args.template !== undefined) {\n spinCSSClass = args.cssClass;\n }\n }\n var container = document.querySelectorAll('.' + CLS_SPINWRAP);\n for (var index = 0; index < container.length; index++) {\n ensureTemplate(args.template, container[index], args.type, args.cssClass, makeElement);\n }\n}\nfunction ensureTemplate(template, container, theme, cssClass, makeEle) {\n if (isNullOrUndefined(template) && !container.classList.contains(CLS_SPINTEMPLATE)) {\n replaceTheme(container, theme, cssClass, makeEle);\n if (container.classList.contains(CLS_SHOWSPIN)) {\n container.classList.remove(CLS_SHOWSPIN);\n showSpinner(container);\n }\n else {\n container.classList.remove(CLS_HIDESPIN);\n hideSpinner(container);\n }\n }\n else {\n spinTemplate = template;\n if (!isNullOrUndefined(cssClass)) {\n spinCSSClass = cssClass;\n }\n }\n}\nfunction replaceTheme(container, theme, cssClass, makeEle) {\n if (!isNullOrUndefined(cssClass)) {\n container.classList.add(cssClass);\n }\n var svgElement = container.querySelector('svg');\n var radius = theme === 'Bootstrap' ? parseFloat(svgElement.style.height) : parseFloat(svgElement.style.height) / 2;\n var classNames = svgElement.getAttribute('class');\n var svgClassList = classNames.split(/\\s/);\n if (svgClassList.indexOf('e-spin-material') >= 0) {\n var id = svgElement.getAttribute('id');\n clearTimeout(globalTimeOut[id].timeOut);\n }\n setTheme(theme, container, radius, makeEle);\n}\n","/**\n * MaskedTextBox base module\n */\nimport { EventHandler, isNullOrUndefined, merge, attributes, addClass, removeClass, Browser, extend } from '@syncfusion/ej2-base';\nimport { Input } from '../../input/input';\nvar ERROR = 'e-error';\nvar INPUTGROUP = 'e-input-group';\nvar FLOATINPUT = 'e-float-input';\nvar UTILMASK = 'e-utility-mask';\nvar TOPLABEL = 'e-label-top';\nvar BOTTOMLABEL = 'e-label-bottom';\n/**\n * @hidden\n * Built-in masking elements collection.\n */\nexport var regularExpressions = {\n '0': '[0-9]',\n '9': '[0-9 ]',\n '#': '[0-9 +-]',\n 'L': '[A-Za-z]',\n '?': '[A-Za-z ]',\n '&': '[^\\x7f ]+',\n 'C': '[^\\x7f]+',\n 'A': '[A-Za-z0-9]',\n 'a': '[A-Za-z0-9 ]',\n};\n/**\n * @hidden\n * Generate required masking elements to the MaskedTextBox from user mask input.\n */\nexport function createMask() {\n attributes(this.element, {\n 'role': 'textbox', 'autocomplete': 'off', 'autocorrect': 'off', 'autocapitalize': 'off',\n 'spellcheck': 'false', 'aria-live': 'assertive', 'aria-valuenow': ''\n });\n if (this.mask) {\n var splitMask = this.mask.split(']');\n for (var i = 0; i < splitMask.length; i++) {\n if (splitMask[i][splitMask[i].length - 1] === '\\\\') {\n splitMask[i] = splitMask[i] + ']';\n var splitInnerMask = splitMask[i].split('[');\n for (var j = 0; j < splitInnerMask.length; j++) {\n if (splitInnerMask[j][splitInnerMask[j].length - 1] === '\\\\') {\n splitInnerMask[j] = splitInnerMask[j] + '[';\n }\n pushIntoRegExpCollec.call(this, splitInnerMask[j]);\n }\n }\n else {\n var splitInnerMask = splitMask[i].split('[');\n if (splitInnerMask.length > 1) {\n var chkSpace = false;\n for (var j = 0; j < splitInnerMask.length; j++) {\n if (splitInnerMask[j] === '\\\\') {\n this.customRegExpCollec.push('[');\n this.hiddenMask += splitInnerMask[j] + '[';\n }\n else if (splitInnerMask[j] === '') {\n chkSpace = true;\n }\n else if ((splitInnerMask[j] !== '' && chkSpace) || j === splitInnerMask.length - 1) {\n this.customRegExpCollec.push('[' + splitInnerMask[j] + ']');\n this.hiddenMask += this.promptChar;\n chkSpace = false;\n }\n else {\n pushIntoRegExpCollec.call(this, splitInnerMask[j]);\n }\n }\n }\n else {\n pushIntoRegExpCollec.call(this, splitInnerMask[0]);\n }\n }\n }\n this.escapeMaskValue = this.hiddenMask;\n this.promptMask = this.hiddenMask.replace(/[09?LCAa#&]/g, this.promptChar);\n if (!isNullOrUndefined(this.customCharacters)) {\n for (var i = 0; i < this.promptMask.length; i++) {\n if (!isNullOrUndefined(this.customCharacters[this.promptMask[i]])) {\n this.promptMask = this.promptMask.replace(new RegExp(this.promptMask[i], 'g'), this.promptChar);\n }\n }\n }\n var escapeNumber = 0;\n if (this.hiddenMask.match(new RegExp(/\\\\/))) {\n for (var i = 0; i < this.hiddenMask.length; i++) {\n var j = 0;\n if (i >= 2) {\n j = i;\n }\n escapeNumber = this.hiddenMask.length - this.promptMask.length;\n j = j - escapeNumber;\n if ((i > 0 && this.hiddenMask[i - 1] !== '\\\\') && (this.hiddenMask[i] === '>' ||\n this.hiddenMask[i] === '<' || this.hiddenMask[i] === '|')) {\n this.promptMask = this.promptMask.substring(0, j) +\n this.promptMask.substring((i + 1) - escapeNumber, this.promptMask.length);\n this.escapeMaskValue = this.escapeMaskValue.substring(0, j) +\n this.escapeMaskValue.substring((i + 1) - escapeNumber, this.escapeMaskValue.length);\n }\n if (this.hiddenMask[i] === '\\\\') {\n this.promptMask = this.promptMask.substring(0, j) + this.hiddenMask[i + 1] +\n this.promptMask.substring((i + 2) - escapeNumber, this.promptMask.length);\n this.escapeMaskValue = this.escapeMaskValue.substring(0, j) + this.escapeMaskValue[i + 1] +\n this.escapeMaskValue.substring((i + 2) - escapeNumber, this.escapeMaskValue.length);\n }\n }\n }\n else {\n this.promptMask = this.promptMask.replace(/[>|<]/g, '');\n this.escapeMaskValue = this.hiddenMask.replace(/[>|<]/g, '');\n }\n attributes(this.element, { 'aria-invalid': 'false' });\n }\n}\n/**\n * @hidden\n * Apply mask ability with masking elements to the MaskedTextBox.\n */\nexport function applyMask() {\n setElementValue.call(this, this.promptMask);\n setMaskValue.call(this, this.value);\n}\n/**\n * @hidden\n * To wire required events to the MaskedTextBox.\n */\nexport function wireEvents() {\n EventHandler.add(this.element, 'keydown', maskInputKeyDownHandler, this);\n EventHandler.add(this.element, 'keypress', maskInputKeyPressHandler, this);\n EventHandler.add(this.element, 'keyup', maskInputKeyUpHandler, this);\n EventHandler.add(this.element, 'input', maskInputHandler, this);\n EventHandler.add(this.element, 'focus', maskInputFocusHandler, this);\n EventHandler.add(this.element, 'blur', maskInputBlurHandler, this);\n EventHandler.add(this.element, 'paste', maskInputPasteHandler, this);\n EventHandler.add(this.element, 'cut', maskInputCutHandler, this);\n EventHandler.add(this.element, 'drop', maskInputDropHandler, this);\n if (this.enabled) {\n bindClearEvent.call(this);\n if (this.formElement) {\n EventHandler.add(this.formElement, 'reset', resetFormHandler, this);\n }\n }\n}\n/**\n * @hidden\n * To unwire events attached to the MaskedTextBox.\n */\nexport function unwireEvents() {\n EventHandler.remove(this.element, 'keydown', maskInputKeyDownHandler);\n EventHandler.remove(this.element, 'keypress', maskInputKeyPressHandler);\n EventHandler.remove(this.element, 'keyup', maskInputKeyUpHandler);\n EventHandler.remove(this.element, 'input', maskInputHandler);\n EventHandler.remove(this.element, 'focus', maskInputFocusHandler);\n EventHandler.remove(this.element, 'blur', maskInputBlurHandler);\n EventHandler.remove(this.element, 'paste', maskInputPasteHandler);\n EventHandler.remove(this.element, 'cut', maskInputCutHandler);\n if (this.formElement) {\n EventHandler.remove(this.formElement, 'reset', resetFormHandler);\n }\n}\n/**\n * @hidden\n * To bind required events to the MaskedTextBox clearButton.\n */\nexport function bindClearEvent() {\n if (this.showClearButton) {\n EventHandler.add(this.inputObj.clearButton, 'mousedown touchstart', resetHandler, this);\n }\n}\nfunction resetHandler(e) {\n e.preventDefault();\n if (!this.inputObj.clearButton.classList.contains('e-clear-icon-hide')) {\n clear.call(this, e);\n this.value = '';\n }\n}\nfunction clear(event) {\n var value = this.element.value;\n setElementValue.call(this, this.promptMask);\n this.redoCollec.unshift({\n value: this.promptMask, startIndex: this.element.selectionStart, endIndex: this.element.selectionEnd\n });\n triggerMaskChangeEvent.call(this, event, value);\n this.element.setSelectionRange(0, 0);\n}\nfunction resetFormHandler() {\n if (this.element.tagName === 'EJS-MASKEDTEXTBOX') {\n setElementValue.call(this, this.promptMask);\n }\n else {\n this.value = this.initInputValue;\n }\n}\n/**\n * @hidden\n * To get masked value from the MaskedTextBox.\n */\nexport function unstrippedValue(element) {\n return element.value;\n}\n/**\n * @hidden\n * To extract raw value from the MaskedTextBox.\n */\nexport function strippedValue(element, maskValues) {\n var value = '';\n var k = 0;\n var checkMask = false;\n var maskValue = (!isNullOrUndefined(maskValues)) ? maskValues : (!isNullOrUndefined(element) &&\n !isNullOrUndefined(this)) ? element.value : maskValues;\n if (maskValue !== this.promptMask) {\n for (var i = 0; i < this.customRegExpCollec.length; i++) {\n if (checkMask) {\n checkMask = false;\n }\n if (this.customRegExpCollec[k] === '>' || this.customRegExpCollec[k] === '<' ||\n this.customRegExpCollec[k] === '|' || this.customRegExpCollec[k] === '\\\\') {\n --i;\n checkMask = true;\n }\n if (!checkMask) {\n if ((maskValue[i] !== this.promptChar) && (!isNullOrUndefined(this.customRegExpCollec[k]) &&\n ((!isNullOrUndefined(this.regExpCollec[this.customRegExpCollec[k]])) ||\n (this.customRegExpCollec[k].length > 2 && this.customRegExpCollec[k][0] === '[' &&\n this.customRegExpCollec[k][this.customRegExpCollec[k].length - 1] === ']') ||\n (!isNullOrUndefined(this.customCharacters) &&\n (!isNullOrUndefined(this.customCharacters[this.customRegExpCollec[k]]))))) && (maskValue !== '')) {\n value += maskValue[i];\n }\n }\n ++k;\n }\n }\n if (this.mask === null || this.mask === '' && this.value !== undefined) {\n value = maskValue;\n }\n return value;\n}\nfunction pushIntoRegExpCollec(value) {\n for (var k = 0; k < value.length; k++) {\n this.hiddenMask += value[k];\n if (value[k] !== '\\\\') {\n this.customRegExpCollec.push(value[k]);\n }\n }\n}\nexport function maskInputFocusHandler(event) {\n var _this = this;\n this.focusEventArgs = {\n selectionStart: 0,\n event: event,\n value: this.value,\n maskedValue: this.element.value,\n container: this.inputObj.container,\n selectionEnd: (this.promptMask.length > 0) ? this.promptMask.length : this.element.value.length,\n };\n this.trigger('focus', this.focusEventArgs);\n if (this.mask) {\n this.isFocus = true;\n if (this.element.value === '') {\n setElementValue.call(this, this.promptMask);\n }\n else {\n setElementValue.call(this, this.element.value);\n }\n if (!Browser.isDevice && Browser.info.version === '11.0') {\n this.element.setSelectionRange(this.focusEventArgs.selectionStart, this.focusEventArgs.selectionEnd);\n }\n else {\n var delay = (Browser.isDevice && Browser.isIos) ? 450 : 0;\n setTimeout(function () {\n _this.element.setSelectionRange(_this.focusEventArgs.selectionStart, _this.focusEventArgs.selectionEnd);\n }, delay);\n }\n }\n}\nexport function maskInputBlurHandler(event) {\n this.blurEventArgs = {\n event: event,\n value: this.value,\n maskedValue: this.element.value,\n container: this.inputObj.container\n };\n this.trigger('blur', this.blurEventArgs);\n if (this.mask) {\n this.isFocus = false;\n if (this.placeholder && this.element.value === this.promptMask && this.floatLabelType !== 'Always') {\n setElementValue.call(this, '');\n var labelElement = this.element.parentNode.querySelector('.e-float-text');\n if (this.floatLabelType === 'Auto' && !isNullOrUndefined(labelElement) && labelElement.classList.contains(TOPLABEL)) {\n removeClass([labelElement], TOPLABEL);\n }\n }\n }\n}\nfunction maskInputPasteHandler(event) {\n var _this = this;\n if (this.mask) {\n var sIndex_1 = this.element.selectionStart;\n var eIndex_1 = this.element.selectionEnd;\n var oldValue_1 = this.element.value;\n setElementValue.call(this, '');\n this._callPasteHandler = true;\n setTimeout(function () {\n var value = _this.element.value.replace(/ /g, '');\n if (_this.redoCollec.length > 0 && _this.redoCollec[0].value === _this.element.value) {\n value = strippedValue.call(_this, _this.element);\n }\n setElementValue.call(_this, oldValue_1);\n _this.element.selectionStart = sIndex_1;\n _this.element.selectionEnd = eIndex_1;\n var i = 0;\n _this.maskKeyPress = true;\n do {\n validateValue.call(_this, value[i], false, null);\n ++i;\n } while (i < value.length);\n _this.maskKeyPress = false;\n _this._callPasteHandler = false;\n if (_this.element.value === oldValue_1) {\n var i_1 = 0;\n _this.maskKeyPress = true;\n do {\n validateValue.call(_this, value[i_1], false, null);\n ++i_1;\n } while (i_1 < value.length);\n _this.maskKeyPress = false;\n }\n else {\n triggerMaskChangeEvent.call(_this, event, oldValue_1);\n }\n }, 1);\n }\n}\nfunction maskInputCutHandler(event) {\n var _this = this;\n if (this.mask) {\n var preValue_1 = this.element.value;\n var sIndex_2 = this.element.selectionStart;\n var eIndex = this.element.selectionEnd;\n this.undoCollec.push({ value: this.element.value, startIndex: this.element.selectionStart, endIndex: this.element.selectionEnd });\n var value_1 = this.element.value.substring(0, sIndex_2) + this.promptMask.substring(sIndex_2, eIndex) +\n this.element.value.substring(eIndex);\n setTimeout(function () {\n setElementValue.call(_this, value_1);\n _this.element.selectionStart = _this.element.selectionEnd = sIndex_2;\n if (_this.element.value !== preValue_1) {\n triggerMaskChangeEvent.call(_this, event, null);\n }\n }, 0);\n }\n}\nexport function maskInputDropHandler(event) {\n event.preventDefault();\n}\nfunction maskInputHandler(event) {\n if (Browser.isIE === true && this.element.value === '' && this.floatLabelType === 'Never') {\n return;\n }\n var eventArgs = { ctrlKey: false, keyCode: 229 };\n // tslint:disable-next-line\n extend(event, eventArgs);\n if (this.mask) {\n if (this.element.value === '') {\n this.redoCollec.unshift({\n value: this.promptMask, startIndex: this.element.selectionStart, endIndex: this.element.selectionEnd\n });\n }\n if (this.element.value.length === 1) {\n this.element.value = this.element.value + this.promptMask;\n this.element.setSelectionRange(1, 1);\n }\n if (!this._callPasteHandler) {\n removeMaskInputValues.call(this, event);\n }\n if (this.element.value.length > this.promptMask.length) {\n var startIndex = this.element.selectionStart;\n var addedValues = this.element.value.length - this.promptMask.length;\n var value = this.element.value.substring(startIndex - addedValues, startIndex);\n this.maskKeyPress = false;\n var i = 0;\n do {\n validateValue.call(this, value[i], event.ctrlKey, event);\n ++i;\n } while (i < value.length);\n if (this.element.value !== this.preEleVal) {\n triggerMaskChangeEvent.call(this, event, null);\n }\n }\n var val = strippedValue.call(this, this.element);\n this.prevValue = val;\n this.value = val;\n if (val === '') {\n setElementValue.call(this, this.promptMask);\n this.element.setSelectionRange(0, 0);\n }\n }\n}\nfunction maskInputKeyDownHandler(event) {\n if (this.mask) {\n var value = this;\n if (event.keyCode !== 229) {\n if (event.ctrlKey && (event.keyCode === 89 || event.keyCode === 90)) {\n event.preventDefault();\n }\n removeMaskInputValues.call(this, event);\n }\n var startValue = this.element.value;\n if (event.ctrlKey && (event.keyCode === 89 || event.keyCode === 90)) {\n var collec = void 0;\n if (event.keyCode === 90 && this.undoCollec.length > 0 && startValue !== this.undoCollec[this.undoCollec.length - 1].value) {\n collec = this.undoCollec[this.undoCollec.length - 1];\n this.redoCollec.unshift({\n value: this.element.value, startIndex: this.element.selectionStart,\n endIndex: this.element.selectionEnd\n });\n setElementValue.call(this, collec.value);\n this.element.selectionStart = collec.startIndex;\n this.element.selectionEnd = collec.endIndex;\n this.undoCollec.splice(this.undoCollec.length - 1, 1);\n }\n else if (event.keyCode === 89 && this.redoCollec.length > 0 && startValue !== this.redoCollec[0].value) {\n collec = this.redoCollec[0];\n this.undoCollec.push({\n value: this.element.value, startIndex: this.element.selectionStart,\n endIndex: this.element.selectionEnd\n });\n setElementValue.call(this, collec.value);\n this.element.selectionStart = collec.startIndex;\n this.element.selectionEnd = collec.endIndex;\n this.redoCollec.splice(0, 1);\n }\n }\n }\n}\nexport function mobileRemoveFunction() {\n var collec;\n var sIndex = this.element.selectionStart;\n var eIndex = this.element.selectionEnd;\n if (this.redoCollec.length > 0) {\n collec = this.redoCollec[0];\n setElementValue.call(this, collec.value);\n if ((collec.startIndex - sIndex) === 1) {\n this.element.selectionStart = collec.startIndex;\n this.element.selectionEnd = collec.endIndex;\n }\n else {\n this.element.selectionStart = sIndex + 1;\n this.element.selectionEnd = eIndex + 1;\n }\n }\n else {\n setElementValue.call(this, this.promptMask);\n this.element.selectionStart = this.element.selectionEnd = sIndex;\n }\n}\nfunction autoFillMaskInputValues(isRemove, oldEventVal, event) {\n if (event.type === 'input') {\n isRemove = false;\n oldEventVal = this.element.value;\n setElementValue.call(this, this.promptMask);\n setMaskValue.call(this, oldEventVal);\n }\n return isRemove;\n}\nfunction removeMaskInputValues(event) {\n var isRemove = false;\n var oldEventVal;\n var isDeleted = false;\n if (this.element.value.length < this.promptMask.length) {\n isRemove = true;\n oldEventVal = this.element.value;\n isRemove = autoFillMaskInputValues.call(this, isRemove, oldEventVal, event);\n mobileRemoveFunction.call(this);\n }\n if (this.element.value.length >= this.promptMask.length && event.type === 'input') {\n isRemove = autoFillMaskInputValues.call(this, isRemove, oldEventVal, event);\n }\n var initStartIndex = this.element.selectionStart;\n var initEndIndex = this.element.selectionEnd;\n var startIndex = this.element.selectionStart;\n var endIndex = this.element.selectionEnd;\n var maskValue = this.hiddenMask.replace(/[>|\\\\<]/g, '');\n var curMask = maskValue[startIndex - 1];\n var parentElement = this.element.parentNode;\n if (isRemove || event.keyCode === 8 || event.keyCode === 46) {\n this.undoCollec.push({ value: this.element.value, startIndex: this.element.selectionStart, endIndex: endIndex });\n var multipleDel = false;\n var preValue = this.element.value;\n if (startIndex > 0 || ((event.keyCode === 8 || event.keyCode === 46) && startIndex < this.element.value.length\n && ((this.element.selectionEnd - startIndex) !== this.element.value.length))) {\n var index = startIndex;\n if (startIndex !== endIndex) {\n startIndex = endIndex;\n if (event.keyCode === 46) {\n multipleDel = true;\n }\n }\n else if (event.keyCode === 46) {\n ++index;\n }\n else {\n --index;\n }\n for (var k = startIndex; (event.keyCode === 8 || isRemove || multipleDel) ? k > index : k < index; (event.keyCode === 8 || isRemove || multipleDel) ? k-- : k++) {\n for (var i = startIndex; (event.keyCode === 8 || isRemove || multipleDel) ? i > 0 : i < this.element.value.length; (event.keyCode === 8 || isRemove || multipleDel) ? i-- : i++) {\n var sIndex = void 0;\n if (((event.keyCode === 8 || multipleDel) && ((initStartIndex !== initEndIndex && initStartIndex !== startIndex) ||\n (initStartIndex === initEndIndex))) || isRemove) {\n curMask = maskValue[i - 1];\n sIndex = startIndex - 1;\n }\n else {\n curMask = maskValue[i];\n sIndex = startIndex;\n ++startIndex;\n }\n var oldValue = this.element.value[sIndex];\n if ((isNullOrUndefined(this.regExpCollec[curMask]) && (!isNullOrUndefined(this.customCharacters)\n && isNullOrUndefined(this.customCharacters[curMask]))\n && ((this.hiddenMask[sIndex] !== this.promptChar && this.customRegExpCollec[sIndex][0] !== '['\n && this.customRegExpCollec[sIndex][this.customRegExpCollec[sIndex].length - 1] !== ']')))\n || (this.promptMask[sIndex] !== this.promptChar && isNullOrUndefined(this.customCharacters))) {\n this.element.selectionStart = this.element.selectionEnd = sIndex;\n event.preventDefault();\n if (event.keyCode === 46 && !multipleDel) {\n ++this.element.selectionStart;\n }\n }\n else {\n var value = this.element.value;\n var prompt_1 = this.promptChar;\n var elementValue = value.substring(0, sIndex) + prompt_1 + value.substring(startIndex, value.length);\n setElementValue.call(this, elementValue);\n event.preventDefault();\n this.element.selectionStart = this.element.selectionEnd = sIndex;\n isDeleted = true;\n }\n startIndex = this.element.selectionStart;\n if ((!isDeleted && event.keyCode === 8) || multipleDel || (!isDeleted && !(event.keyCode === 46))) {\n sIndex = startIndex - 1;\n }\n else {\n sIndex = startIndex;\n isDeleted = false;\n }\n oldValue = this.element.value[sIndex];\n if (((initStartIndex !== initEndIndex) && (this.element.selectionStart === initStartIndex))\n || (this.promptMask[sIndex] === this.promptChar) || ((oldValue !== this.promptMask[sIndex]) &&\n (this.promptMask[sIndex] !== this.promptChar) && !isNullOrUndefined(this.customCharacters))) {\n break;\n }\n }\n }\n }\n if (this.element.selectionStart === 0 && (this.element.selectionEnd === this.element.value.length)) {\n setElementValue.call(this, this.promptMask);\n event.preventDefault();\n this.element.selectionStart = this.element.selectionEnd = startIndex;\n }\n this.redoCollec.unshift({\n value: this.element.value, startIndex: this.element.selectionStart,\n endIndex: this.element.selectionEnd\n });\n if (this.element.value !== preValue) {\n triggerMaskChangeEvent.call(this, event, oldEventVal);\n }\n }\n}\nfunction maskInputKeyPressHandler(event) {\n if (this.mask) {\n var oldValue = this.element.value;\n if ((!event.ctrlKey) || (event.ctrlKey && event.code !== 'KeyA' && event.code !== 'KeyY'\n && event.code !== 'KeyZ' && event.code !== 'KeyX' && event.code !== 'KeyC' && event.code !== 'KeyV')) {\n this.maskKeyPress = true;\n var key = event.key;\n if (key === 'Spacebar') {\n key = String.fromCharCode(event.keyCode);\n }\n if (!key) {\n this.isIosInvalid = true;\n validateValue.call(this, String.fromCharCode(event.keyCode), event.ctrlKey, event);\n event.preventDefault();\n this.isIosInvalid = false;\n }\n else if (key && key.length === 1) {\n validateValue.call(this, key, event.ctrlKey, event);\n event.preventDefault();\n }\n if (event.keyCode === 32 && key === ' ' && this.promptChar === ' ') {\n this.element.selectionStart = this.element.selectionEnd = this.element.selectionStart - key.length;\n }\n }\n if (this.element.value !== oldValue) {\n triggerMaskChangeEvent.call(this, event, oldValue);\n }\n }\n}\nfunction triggerMaskChangeEvent(event, oldValue) {\n var prevOnChange = this.isProtectedOnChange;\n if (!isNullOrUndefined(this.changeEventArgs) && !this.isInitial) {\n var eventArgs = {};\n this.changeEventArgs = { value: this.element.value, maskedValue: this.element.value, isInteraction: false, isInteracted: false };\n if (this.mask) {\n this.changeEventArgs.value = strippedValue.call(this, this.element);\n }\n if (!isNullOrUndefined(event)) {\n this.changeEventArgs.isInteracted = true;\n this.changeEventArgs.isInteraction = true;\n this.changeEventArgs.event = event;\n }\n this.isProtectedOnChange = true;\n this.value = this.changeEventArgs.value;\n this.isProtectedOnChange = prevOnChange;\n merge(eventArgs, this.changeEventArgs);\n this.trigger('change', eventArgs);\n }\n this.preEleVal = this.element.value;\n this.prevValue = strippedValue.call(this, this.element);\n attributes(this.element, { 'aria-valuenow': this.element.value });\n}\nfunction maskInputKeyUpHandler(event) {\n if (this.mask) {\n var collec = void 0;\n var key = event.key;\n if (key && key.length === 1 && this.floatLabelType === 'Never' && this.undoCollec.length > 0) {\n if (this.undoCollec[this.undoCollec.length - 1].value === this.element.value) {\n validateValue.call(this, key, event.ctrlKey, event);\n }\n }\n if (!this.maskKeyPress && event.keyCode === 229) {\n var oldEventVal = void 0;\n if (this.element.value.length === 1) {\n this.element.value = this.element.value + this.promptMask;\n this.element.setSelectionRange(1, 1);\n }\n if (this.element.value.length > this.promptMask.length) {\n var startIndex = this.element.selectionStart;\n var addedValues = this.element.value.length - this.promptMask.length;\n var val_1 = this.element.value.substring(startIndex - addedValues, startIndex);\n if (this.undoCollec.length > 0) {\n collec = this.undoCollec[this.undoCollec.length - 1];\n var startIndex_1 = this.element.selectionStart;\n oldEventVal = collec.value;\n var oldVal = collec.value.substring(startIndex_1 - addedValues, startIndex_1);\n collec = this.redoCollec[0];\n val_1 = val_1.trim();\n var isSpace = Browser.isAndroid && val_1 === '';\n if (!isSpace && oldVal !== val_1 && collec.value.substring(startIndex_1 - addedValues, startIndex_1) !== val_1) {\n validateValue.call(this, val_1, event.ctrlKey, event);\n }\n else if (isSpace) {\n preventUnsupportedValues.call(this, event, startIndex_1 - 1, this.element.selectionEnd - 1, val_1, event.ctrlKey, false);\n }\n }\n else {\n oldEventVal = this.promptMask;\n validateValue.call(this, val_1, event.ctrlKey, event);\n }\n this.maskKeyPress = false;\n triggerMaskChangeEvent.call(this, event, oldEventVal);\n }\n }\n else {\n removeMaskError.call(this);\n }\n var val = strippedValue.call(this, this.element);\n if (!((this.element.selectionStart === 0) && (this.promptMask === this.element.value) && val === '')\n || (val === '' && this.value !== val)) {\n this.prevValue = val;\n this.value = val;\n }\n }\n else {\n triggerMaskChangeEvent.call(this, event);\n this.value = this.element.value;\n }\n if (this.element.selectionStart === 0 && this.element.selectionEnd === 0) {\n // tslint:disable-next-line\n var temp_1 = this.element;\n setTimeout(function () {\n temp_1.setSelectionRange(0, 0);\n }, 0);\n }\n}\nfunction mobileSwipeCheck(key) {\n if (key.length > 1 && ((this.promptMask.length + key.length) < this.element.value.length)) {\n var elementValue = this.redoCollec[0].value.substring(0, this.redoCollec[0].startIndex) + key +\n this.redoCollec[0].value.substring(this.redoCollec[0].startIndex, this.redoCollec[0].value.length);\n setElementValue.call(this, elementValue);\n this.element.selectionStart = this.element.selectionEnd = this.redoCollec[0].startIndex + key.length;\n }\n this.element.selectionStart = this.element.selectionStart - key.length;\n this.element.selectionEnd = this.element.selectionEnd - key.length;\n}\nfunction mobileValidation(key) {\n if (!this.maskKeyPress) {\n mobileSwipeCheck.call(this, key);\n }\n}\nfunction validateValue(key, isCtrlKey, event) {\n mobileValidation.call(this, key);\n if (isNullOrUndefined(this) || isNullOrUndefined(key)) {\n return;\n }\n var startIndex = this.element.selectionStart;\n var initStartIndex = startIndex;\n var endIndex = this.element.selectionEnd;\n var curMask;\n var allowText = false;\n var value = this.element.value;\n var eventOldVal;\n var prevSupport = false;\n var isEqualVal = false;\n for (var k = 0; k < key.length; k++) {\n var keyValue = key[k];\n startIndex = this.element.selectionStart;\n endIndex = this.element.selectionEnd;\n if (!this.maskKeyPress && initStartIndex === startIndex) {\n startIndex = startIndex + k;\n }\n if ((!this.maskKeyPress || startIndex < this.promptMask.length)) {\n for (var i = startIndex; i < this.promptMask.length; i++) {\n var maskValue = this.escapeMaskValue;\n curMask = maskValue[startIndex];\n if (this.hiddenMask[startIndex] === '\\\\' && this.hiddenMask[startIndex + 1] === key) {\n isEqualVal = true;\n }\n if ((isNullOrUndefined(this.regExpCollec[curMask]) && (isNullOrUndefined(this.customCharacters)\n || (!isNullOrUndefined(this.customCharacters) && isNullOrUndefined(this.customCharacters[curMask])))\n && ((this.hiddenMask[startIndex] !== this.promptChar && this.customRegExpCollec[startIndex][0] !== '['\n && this.customRegExpCollec[startIndex][this.customRegExpCollec[startIndex].length - 1] !== ']')))\n || ((this.promptMask[startIndex] !== this.promptChar) && isNullOrUndefined(this.customCharacters))\n || (this.promptChar === curMask && this.escapeMaskValue === this.mask)) {\n this.element.selectionStart = this.element.selectionEnd = startIndex + 1;\n startIndex = this.element.selectionStart;\n curMask = this.hiddenMask[startIndex];\n }\n }\n if (!isNullOrUndefined(this.customCharacters) && !isNullOrUndefined(this.customCharacters[curMask])) {\n var customValStr = this.customCharacters[curMask];\n var customValArr = customValStr.split(',');\n for (var i = 0; i < customValArr.length; i++) {\n if (keyValue.match(new RegExp('[' + customValArr[i] + ']'))) {\n allowText = true;\n break;\n }\n }\n }\n else if (!isNullOrUndefined(this.regExpCollec[curMask]) && keyValue.match(new RegExp(this.regExpCollec[curMask]))\n && this.promptMask[startIndex] === this.promptChar) {\n allowText = true;\n }\n else if (this.promptMask[startIndex] === this.promptChar && this.customRegExpCollec[startIndex][0] === '['\n && this.customRegExpCollec[startIndex][this.customRegExpCollec[startIndex].length - 1] === ']'\n && keyValue.match(new RegExp(this.customRegExpCollec[startIndex]))) {\n allowText = true;\n }\n if ((!this.maskKeyPress || startIndex < this.hiddenMask.length) && allowText) {\n if (k === 0) {\n if (this.maskKeyPress) {\n this.undoCollec.push({ value: value, startIndex: startIndex, endIndex: startIndex });\n }\n else {\n var sIndex = this.element.selectionStart;\n var eIndex = this.element.selectionEnd;\n if (this.redoCollec.length > 0) {\n eventOldVal = this.redoCollec[0].value;\n setElementValue.call(this, eventOldVal);\n this.undoCollec.push(this.redoCollec[0]);\n }\n else {\n this.undoCollec.push({ value: this.promptMask, startIndex: startIndex, endIndex: startIndex });\n eventOldVal = this.promptMask;\n setElementValue.call(this, eventOldVal);\n }\n this.element.selectionStart = sIndex;\n this.element.selectionEnd = eIndex;\n }\n }\n startIndex = this.element.selectionStart;\n applySupportedValues.call(this, event, startIndex, keyValue, eventOldVal, isEqualVal);\n prevSupport = true;\n if (k === key.length - 1) {\n this.redoCollec.unshift({\n value: this.element.value, startIndex: this.element.selectionStart, endIndex: this.element.selectionEnd\n });\n }\n allowText = false;\n }\n else {\n startIndex = this.element.selectionStart;\n preventUnsupportedValues.call(this, event, startIndex, initStartIndex, key, isCtrlKey, prevSupport);\n }\n if (k === key.length - 1 && !allowText) {\n if (!Browser.isAndroid || (Browser.isAndroid && startIndex < this.promptMask.length)) {\n this.redoCollec.unshift({\n value: this.element.value, startIndex: this.element.selectionStart, endIndex: this.element.selectionEnd\n });\n }\n }\n }\n else {\n if (key.length === 1 && !isCtrlKey && !isNullOrUndefined(event)) {\n addMaskErrorClass.call(this);\n }\n }\n }\n}\nfunction applySupportedValues(event, startIndex, keyValue, eventOldVal, isEqualVal) {\n if (this.hiddenMask.length > this.promptMask.length) {\n keyValue = changeToLowerUpperCase.call(this, keyValue, this.element.value);\n }\n if (!isEqualVal) {\n var value = this.element.value;\n var elementValue = value.substring(0, startIndex) + keyValue + value.substring(startIndex + 1, value.length);\n setElementValue.call(this, elementValue);\n this.element.selectionStart = this.element.selectionEnd = startIndex + 1;\n }\n}\nfunction preventUnsupportedValues(event, sIdx, idx, key, ctrl, chkSupport) {\n if (!this.maskKeyPress) {\n var eventOldVal = void 0;\n var value = this.element.value;\n if (sIdx >= this.promptMask.length) {\n setElementValue.call(this, value.substring(0, sIdx));\n }\n else {\n if (idx === sIdx) {\n setElementValue.call(this, value.substring(0, sIdx) + value.substring(sIdx + 1, value.length));\n }\n else {\n if (this.promptMask.length === this.element.value.length) {\n setElementValue.call(this, value.substring(0, sIdx) + value.substring(sIdx, value.length));\n }\n else {\n setElementValue.call(this, value.substring(0, idx) + value.substring(idx + 1, value.length));\n }\n }\n this.element.selectionStart = this.element.selectionEnd = (chkSupport ||\n this.element.value[idx] !== this.promptChar) ? sIdx : idx;\n }\n eventOldVal = this.element.value;\n addMaskErrorClass.call(this);\n }\n if (key.length === 1 && !ctrl && !isNullOrUndefined(event)) {\n addMaskErrorClass.call(this);\n }\n}\nfunction addMaskErrorClass() {\n var _this = this;\n var parentElement = this.element.parentNode;\n var timer = 200;\n if (parentElement.classList.contains(INPUTGROUP) || parentElement.classList.contains(FLOATINPUT)) {\n addClass([parentElement], ERROR);\n }\n else {\n addClass([this.element], ERROR);\n }\n if (this.isIosInvalid === true) {\n timer = 400;\n }\n attributes(this.element, { 'aria-invalid': 'true' });\n setTimeout(function () {\n if (!_this.maskKeyPress) {\n removeMaskError.call(_this);\n }\n }, timer);\n}\nfunction removeMaskError() {\n var parentElement = this.element.parentNode;\n removeClass([parentElement], ERROR);\n removeClass([this.element], ERROR);\n attributes(this.element, { 'aria-invalid': 'false' });\n}\n/**\n * @hidden\n * Validates user input using masking elements '<' , '>' and '|'.\n */\nfunction changeToLowerUpperCase(key, value) {\n var promptMask;\n var i;\n var j = 0;\n var curVal = value;\n var caseCount = 0;\n for (i = 0; i < this.hiddenMask.length; i++) {\n if (this.hiddenMask[i] === '\\\\') {\n promptMask = curVal.substring(0, i) + '\\\\' + curVal.substring(i, curVal.length);\n }\n if (this.hiddenMask[i] === '>' || this.hiddenMask[i] === '<' || this.hiddenMask[i] === '|') {\n if (this.hiddenMask[i] !== curVal[i]) {\n promptMask = curVal.substring(0, i) + this.hiddenMask[i] + curVal.substring(i, curVal.length);\n }\n ++caseCount;\n }\n if (promptMask) {\n if (((promptMask[i] === this.promptChar) && (i > this.element.selectionStart)) ||\n (this.element.value.indexOf(this.promptChar) < 0 && (this.element.selectionStart + caseCount) === i)) {\n caseCount = 0;\n break;\n }\n curVal = promptMask;\n }\n }\n while (i >= 0 && promptMask) {\n if (i === 0 || promptMask[i - 1] !== '\\\\') {\n var val = this.element.value;\n if (promptMask[i] === '>') {\n key = key.toUpperCase();\n break;\n }\n else if (promptMask[i] === '<') {\n key = key.toLowerCase();\n break;\n }\n else if (promptMask[i] === '|') {\n break;\n }\n }\n --i;\n }\n return key;\n}\n/**\n * @hidden\n * To set updated values in the MaskedTextBox.\n */\nexport function setMaskValue(val) {\n if (this.mask && val !== undefined && (this.prevValue === undefined || this.prevValue !== val)) {\n this.maskKeyPress = true;\n setElementValue.call(this, this.promptMask);\n if (val !== '' && !(val === null && this.floatLabelType === 'Never' && this.placeholder)) {\n this.element.selectionStart = 0;\n this.element.selectionEnd = 0;\n }\n if (val !== null) {\n for (var i = 0; i < val.length; i++) {\n validateValue.call(this, val[i], false, null);\n }\n }\n var newVal = strippedValue.call(this, this.element);\n this.prevValue = newVal;\n this.value = newVal;\n triggerMaskChangeEvent.call(this, null, null);\n this.maskKeyPress = false;\n var labelElement = this.element.parentNode.querySelector('.e-float-text');\n if (this.element.value === this.promptMask && this.floatLabelType === 'Auto' && this.placeholder &&\n !isNullOrUndefined(labelElement) && labelElement.classList.contains(TOPLABEL) && !this.isFocus) {\n removeClass([labelElement], TOPLABEL);\n addClass([labelElement], BOTTOMLABEL);\n setElementValue.call(this, '');\n }\n }\n if (this.mask === null || this.mask === '' && this.value !== undefined) {\n setElementValue.call(this, this.value);\n }\n}\n/**\n * @hidden\n * To set updated values in the input element.\n */\nexport function setElementValue(val, element) {\n if (!this.isFocus && this.floatLabelType === 'Auto' && this.placeholder && isNullOrUndefined(this.value)) {\n val = '';\n }\n var value = strippedValue.call(this, (element ? element : this.element), val);\n if (value === null || value === '') {\n Input.setValue(val, (element ? element : this.element), this.floatLabelType, false);\n if (this.showClearButton) {\n this.inputObj.clearButton.classList.add('e-clear-icon-hide');\n }\n }\n else {\n Input.setValue(val, (element ? element : this.element), this.floatLabelType, this.showClearButton);\n }\n}\n/**\n * @hidden\n * Provide mask support to input textbox through utility method.\n */\nexport function maskInput(args) {\n var inputEle = getMaskInput(args);\n applyMask.call(inputEle);\n var val = strippedValue.call(this, this.element);\n this.prevValue = val;\n this.value = val;\n if (args.mask) {\n unwireEvents.call(inputEle);\n wireEvents.call(inputEle);\n }\n}\nfunction getMaskInput(args) {\n addClass([args.element], UTILMASK);\n var inputEle = {\n element: args.element,\n mask: args.mask,\n promptMask: '',\n hiddenMask: '',\n escapeMaskValue: '',\n promptChar: args.promptChar ? (args.promptChar.length > 1) ? args.promptChar = args.promptChar[0]\n : args.promptChar : '_',\n value: args.value ? args.value : null,\n regExpCollec: regularExpressions,\n customRegExpCollec: [],\n customCharacters: args.customCharacters,\n undoCollec: [],\n redoCollec: [],\n maskKeyPress: false,\n prevValue: ''\n };\n createMask.call(inputEle);\n return inputEle;\n}\n/**\n * @hidden\n * Gets raw value of the textbox which has been masked through utility method.\n */\nexport function getVal(args) {\n return strippedValue.call(getUtilMaskEle(args), args.element);\n}\n/**\n * @hidden\n * Gets masked value of the textbox which has been masked through utility method.\n */\nexport function getMaskedVal(args) {\n return unstrippedValue.call(getUtilMaskEle(args), args.element);\n}\nfunction getUtilMaskEle(args) {\n var value = '';\n var inputEle;\n if (!isNullOrUndefined(args) && args.element.classList.contains(UTILMASK)) {\n inputEle = getMaskInput(args);\n }\n return inputEle;\n}\n/**\n * @hidden\n * Arguments to perform undo and redo functionalities.\n */\nvar MaskUndo = /** @class */ (function () {\n function MaskUndo() {\n }\n return MaskUndo;\n}());\nexport { MaskUndo };\nvar maskUndo = new MaskUndo();\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { ChildProperty, extend, deleteObject, Property } from '@syncfusion/ej2-base';\n/**\n * @param props\n * @param model\n */\nexport function getModel(props, model) {\n var obj = extend({}, props);\n for (var _i = 0, _a = Object.keys(obj); _i < _a.length; _i++) {\n var prop = _a[_i];\n if ((model).indexOf(prop) < 0) {\n deleteObject(obj, prop);\n }\n }\n return obj;\n}\nvar Item = /** @class */ (function (_super) {\n __extends(Item, _super);\n function Item() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], Item.prototype, \"iconCss\", void 0);\n __decorate([\n Property('')\n ], Item.prototype, \"id\", void 0);\n __decorate([\n Property(false)\n ], Item.prototype, \"separator\", void 0);\n __decorate([\n Property('')\n ], Item.prototype, \"text\", void 0);\n __decorate([\n Property('')\n ], Item.prototype, \"url\", void 0);\n return Item;\n}(ChildProperty));\nexport { Item };\n","import { addClass, createElement as internalCreateElement, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { Button } from '@syncfusion/ej2-buttons';\n/**\n * Initialize ButtonGroup CSS component with specified properties.\n * ```html\n * \n * ```\n * ```typescript\n * createButtonGroup('#buttongroup', {\n * cssClass: 'e-outline',\n * buttons: [\n * { content: 'Day' },\n * { content: 'Week' },\n * { content: 'Work Week'}\n * ]\n * });\n * ```\n * @param {string} selector\n * @param {CreateButtonGroupModel} options\n * @returns HTMLElement\n */\nexport function createButtonGroup(selector, options, createElement) {\n if (options === void 0) { options = {}; }\n var child;\n var btnElem;\n var nextChild;\n var btnModel;\n if (isNullOrUndefined(createElement)) {\n createElement = internalCreateElement;\n }\n var wrapper = document.querySelector(selector);\n addClass([wrapper], ['e-btn-group', 'e-css']);\n wrapper.setAttribute('role', 'group');\n var childs = wrapper.children;\n options.buttons = options.buttons || [];\n for (var i = 0, j = 0; j < childs.length; i++, j++) {\n child = childs[j];\n btnModel = options.buttons[i];\n if (btnModel !== null) {\n if (child.tagName === 'BUTTON') {\n btnElem = child;\n }\n else {\n btnElem = createElement('label');\n nextChild = childs[j + 1];\n if (nextChild) {\n wrapper.insertBefore(btnElem, nextChild);\n }\n else {\n wrapper.appendChild(btnElem);\n }\n if (child.id) {\n btnElem.setAttribute('for', child.id);\n }\n if (btnModel && btnModel.disabled) {\n child.disabled = true;\n }\n j++;\n }\n if (options.cssClass && btnModel && !btnModel.cssClass) {\n btnModel.cssClass = options.cssClass;\n }\n new Button(btnModel || {}, btnElem);\n }\n }\n return wrapper;\n}\n","import { extend, merge, isNullOrUndefined, getValue } from '@syncfusion/ej2-base';\nimport { attributes, prepend, isVisible, append, addClass } from '@syncfusion/ej2-base';\nimport { compile } from '@syncfusion/ej2-base';\nimport { DataManager, Query } from '@syncfusion/ej2-data';\nexport var cssClass = {\n li: 'e-list-item',\n ul: 'e-list-parent e-ul',\n group: 'e-list-group-item',\n icon: 'e-list-icon',\n text: 'e-list-text',\n check: 'e-list-check',\n checked: 'e-checked',\n selected: 'e-selected',\n expanded: 'e-expanded',\n textContent: 'e-text-content',\n hasChild: 'e-has-child',\n level: 'e-level',\n url: 'e-list-url',\n collapsible: 'e-icon-collapsible',\n disabled: 'e-disabled',\n image: 'e-list-img',\n iconWrapper: 'e-icon-wrapper'\n};\n/**\n * Base List Generator\n */\nexport var ListBase;\n(function (ListBase) {\n /**\n * Default mapped fields.\n */\n ListBase.defaultMappedFields = {\n id: 'id',\n text: 'text',\n url: 'url',\n value: 'value',\n isChecked: 'isChecked',\n enabled: 'enabled',\n expanded: 'expanded',\n selected: 'selected',\n iconCss: 'iconCss',\n child: 'child',\n isVisible: 'isVisible',\n hasChildren: 'hasChildren',\n tooltip: 'tooltip',\n htmlAttributes: 'htmlAttributes',\n urlAttributes: 'urlAttributes',\n imageAttributes: 'imageAttributes',\n imageUrl: 'imageUrl',\n groupBy: null\n };\n var defaultAriaAttributes = {\n level: 1,\n listRole: 'presentation',\n itemRole: 'presentation',\n groupItemRole: 'group',\n itemText: 'list-item',\n wrapperRole: 'presentation'\n };\n var defaultListBaseOptions = {\n showCheckBox: false,\n showIcon: false,\n expandCollapse: false,\n fields: ListBase.defaultMappedFields,\n ariaAttributes: defaultAriaAttributes,\n listClass: '',\n itemClass: '',\n processSubChild: false,\n sortOrder: 'None',\n template: null,\n groupTemplate: null,\n headerTemplate: null,\n expandIconClass: 'e-icon-collapsible',\n moduleName: 'list',\n expandIconPosition: 'Right'\n };\n /**\n * Function helps to created and return the UL Li element based on your data.\n * @param {{[key:string]:Object}[]|string[]} dataSource - Specifies an array of JSON or String data.\n * @param {ListBaseOptions} options? - Specifies the list options that need to provide.\n */\n function createList(createElement, dataSource, options, isSingleLevel) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n var ariaAttributes = extend({}, defaultAriaAttributes, curOpt.ariaAttributes);\n var type = typeofData(dataSource).typeof;\n if (type === 'string' || type === 'number') {\n return createListFromArray(createElement, dataSource, isSingleLevel, options);\n }\n else {\n return createListFromJson(createElement, dataSource, options, ariaAttributes.level, isSingleLevel);\n }\n }\n ListBase.createList = createList;\n /**\n * Function helps to created an element list based on string array input .\n * @param {string[]} dataSource - Specifies an array of string data\n */\n function createListFromArray(createElement, dataSource, isSingleLevel, options) {\n var subChild = createListItemFromArray(createElement, dataSource, isSingleLevel, options);\n return generateUL(createElement, subChild, null, options);\n }\n ListBase.createListFromArray = createListFromArray;\n /**\n * Function helps to created an element list based on string array input .\n * @param {string[]} dataSource - Specifies an array of string data\n */\n function createListItemFromArray(createElement, dataSource, isSingleLevel, options) {\n var subChild = [];\n var curOpt = extend({}, defaultListBaseOptions, options);\n cssClass = getModuleClass(curOpt.moduleName);\n var id = generateId(); // generate id for drop-down-list option.\n for (var i = 0; i < dataSource.length; i++) {\n if (isNullOrUndefined(dataSource[i])) {\n continue;\n }\n var li = void 0;\n if (curOpt.itemCreating && typeof curOpt.itemCreating === 'function') {\n var curData = {\n dataSource: dataSource,\n curData: dataSource[i],\n text: dataSource[i],\n options: curOpt\n };\n curOpt.itemCreating(curData);\n }\n if (isSingleLevel) {\n li = generateSingleLevelLI(createElement, dataSource[i], undefined, null, null, [], null, id, i, options);\n }\n else {\n li = generateLI(createElement, dataSource[i], undefined, null, null, options);\n }\n if (curOpt.itemCreated && typeof curOpt.itemCreated === 'function') {\n var curData = {\n dataSource: dataSource,\n curData: dataSource[i],\n text: dataSource[i],\n item: li,\n options: curOpt\n };\n curOpt.itemCreated(curData);\n }\n subChild.push(li);\n }\n return subChild;\n }\n ListBase.createListItemFromArray = createListItemFromArray;\n /**\n * Function helps to created an element list based on array of JSON input .\n * @param {{[key:string]:Object}[]} dataSource - Specifies an array of JSON data.\n * @param {ListBaseOptions} options? - Specifies the list options that need to provide.\n */\n // tslint:disable-next-line:max-func-body-length\n function createListItemFromJson(createElement, dataSource, options, level, isSingleLevel) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n cssClass = getModuleClass(curOpt.moduleName);\n var fields = extend({}, ListBase.defaultMappedFields, curOpt.fields);\n var ariaAttributes = extend({}, defaultAriaAttributes, curOpt.ariaAttributes);\n var id;\n if (level) {\n ariaAttributes.level = level;\n }\n var child = [];\n var li;\n if (dataSource && dataSource.length && !isNullOrUndefined(typeofData(dataSource).item) &&\n !typeofData(dataSource).item.hasOwnProperty(fields.id)) {\n id = generateId(); // generate id for drop-down-list option.\n }\n for (var i = 0; i < dataSource.length; i++) {\n var fieldData = getFieldValues(dataSource[i], fields);\n if (isNullOrUndefined(dataSource[i])) {\n continue;\n }\n if (curOpt.itemCreating && typeof curOpt.itemCreating === 'function') {\n var curData = {\n dataSource: dataSource,\n curData: dataSource[i],\n text: fieldData[fields.text],\n options: curOpt,\n fields: fields\n };\n curOpt.itemCreating(curData);\n }\n var curItem = dataSource[i];\n if (curOpt.itemCreating && typeof curOpt.itemCreating === 'function') {\n fieldData = getFieldValues(dataSource[i], fields);\n }\n if (fieldData.hasOwnProperty(fields.id) && !isNullOrUndefined(fieldData[fields.id])) {\n id = fieldData.id;\n }\n var innerEle = [];\n if (curOpt.showCheckBox) {\n innerEle.push(createElement('input', { className: cssClass.check, attrs: { type: 'checkbox' } }));\n }\n if (isSingleLevel === true) {\n if (curOpt.showIcon && fieldData.hasOwnProperty(fields.iconCss) && !isNullOrUndefined(fieldData[fields.iconCss])) {\n innerEle.push(createElement('span', { className: cssClass.icon + ' ' + fieldData[fields.iconCss] }));\n }\n li = generateSingleLevelLI(createElement, curItem, fieldData, fields, curOpt.itemClass, innerEle, (curItem.hasOwnProperty('isHeader') &&\n curItem.isHeader) ? true : false, id, i, options);\n }\n else {\n li = generateLI(createElement, curItem, fieldData, fields, curOpt.itemClass, options);\n li.classList.add(cssClass.level + '-' + ariaAttributes.level);\n li.setAttribute('aria-level', ariaAttributes.level.toString());\n if (fieldData.hasOwnProperty(fields.tooltip)) {\n li.setAttribute('title', fieldData[fields.tooltip]);\n }\n if (fieldData.hasOwnProperty(fields.htmlAttributes) && fieldData[fields.htmlAttributes]) {\n setAttribute(li, fieldData[fields.htmlAttributes]);\n }\n if (fieldData.hasOwnProperty(fields.enabled) && fieldData[fields.enabled] === false) {\n li.classList.add(cssClass.disabled);\n }\n if (fieldData.hasOwnProperty(fields.isVisible) && fieldData[fields.isVisible] === false) {\n li.style.display = 'none';\n }\n if (fieldData.hasOwnProperty(fields.imageUrl) && !isNullOrUndefined(fieldData[fields.imageUrl])\n && !curOpt.template) {\n var attr = { src: fieldData[fields.imageUrl] };\n merge(attr, fieldData[fields.imageAttributes]);\n prepend([createElement('img', { className: cssClass.image, attrs: attr })], li.firstElementChild);\n }\n if (curOpt.showIcon && fieldData.hasOwnProperty(fields.iconCss) &&\n !isNullOrUndefined(fieldData[fields.iconCss]) && !curOpt.template) {\n prepend([createElement('div', { className: cssClass.icon + ' ' + fieldData[fields.iconCss] })], li.firstElementChild);\n }\n if (innerEle.length) {\n prepend(innerEle, li.firstElementChild);\n }\n processSubChild(createElement, fieldData, fields, dataSource, curOpt, li, ariaAttributes.level);\n }\n if (curOpt.itemCreated && typeof curOpt.itemCreated === 'function') {\n var curData = {\n dataSource: dataSource,\n curData: dataSource[i],\n text: fieldData[fields.text],\n item: li,\n options: curOpt,\n fields: fields\n };\n curOpt.itemCreated(curData);\n }\n child.push(li);\n }\n return child;\n }\n ListBase.createListItemFromJson = createListItemFromJson;\n /**\n * Function helps to created an element list based on array of JSON input .\n * @param {{[key:string]:Object}[]} dataSource - Specifies an array of JSON data.\n * @param {ListBaseOptions} options? - Specifies the list options that need to provide.\n */\n function createListFromJson(createElement, dataSource, options, level, isSingleLevel) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n var li = createListItemFromJson(createElement, dataSource, options, level, isSingleLevel);\n return generateUL(createElement, li, curOpt.listClass, options);\n }\n ListBase.createListFromJson = createListFromJson;\n /**\n * Return the next or previous visible element.\n * @param {Element[]|NodeList} elementArray - An element array to find next or previous element.\n * @param {Element} li - An element to find next or previous after this element.\n * @param {boolean} isPrevious? - Specify when the need get previous element from array.\n */\n function getSiblingLI(elementArray, element, isPrevious) {\n cssClass = getModuleClass(defaultListBaseOptions.moduleName);\n if (!elementArray || !elementArray.length) {\n return void 0;\n }\n var siblingLI;\n var liIndex;\n var liCollections = Array.prototype.slice.call(elementArray);\n if (element) {\n liIndex = indexOf(element, liCollections);\n }\n else {\n liIndex = (isPrevious === true ? liCollections.length : -1);\n }\n siblingLI = liCollections[liIndex + (isPrevious === true ? -1 : 1)];\n while (siblingLI && (!isVisible(siblingLI) || siblingLI.classList.contains(cssClass.disabled))) {\n liIndex = liIndex + (isPrevious === true ? -1 : 1);\n siblingLI = liCollections[liIndex];\n }\n return siblingLI;\n }\n ListBase.getSiblingLI = getSiblingLI;\n /**\n * Return the index of the li element\n * @param {Element} item - An element to find next or previous after this element.\n * @param {Element[]|NodeList} elementArray - An element array to find index of given li.\n */\n function indexOf(item, elementArray) {\n if (!elementArray || !item) {\n return void 0;\n }\n else {\n var liCollections = elementArray;\n liCollections = Array.prototype.slice.call(elementArray);\n return liCollections.indexOf(item);\n }\n }\n ListBase.indexOf = indexOf;\n /**\n * Returns the grouped data from given dataSource.\n * @param {{[key:string]:Object}[]} dataSource - The JSON data which is necessary to process.\n * @param {FieldsMapping} fields - Fields that are mapped from the data source.\n * @param {SortOrder='None'} sortOrder- Specifies final result sort order.\n */\n function groupDataSource(dataSource, fields, sortOrder) {\n if (sortOrder === void 0) { sortOrder = 'None'; }\n var curFields = extend({}, ListBase.defaultMappedFields, fields);\n var cusQuery = new Query().group(curFields.groupBy);\n // need to remove once sorting issues fixed in DataManager\n cusQuery = addSorting(sortOrder, 'key', cusQuery);\n var ds = getDataSource(dataSource, cusQuery);\n dataSource = [];\n for (var j = 0; j < ds.length; j++) {\n var itemObj = ds[j].items;\n var grpItem = {};\n var hdr = 'isHeader';\n grpItem[curFields.text] = ds[j].key;\n grpItem[hdr] = true;\n grpItem.id = 'group-list-item-' + (ds[j].key ?\n ds[j].key.toString().trim() : 'undefined');\n grpItem.items = itemObj;\n dataSource.push(grpItem);\n for (var k = 0; k < itemObj.length; k++) {\n dataSource.push(itemObj[k]);\n }\n }\n return dataSource;\n }\n ListBase.groupDataSource = groupDataSource;\n /**\n * Returns a sorted query object.\n * @param {SortOrder} sortOrder - Specifies that sort order.\n * @param {string} sortBy - Specifies sortBy fields.\n * @param {Query=new Query()} query - Pass if any existing query.\n */\n function addSorting(sortOrder, sortBy, query) {\n if (query === void 0) { query = new Query(); }\n if (sortOrder === 'Ascending') {\n query.sortBy(sortBy, 'ascending', true);\n }\n else if (sortOrder === 'Descending') {\n query.sortBy(sortBy, 'descending', true);\n }\n else {\n for (var i = 0; i < query.queries.length; i++) {\n if (query.queries[i].fn === 'onSortBy') {\n query.queries.splice(i, 1);\n }\n }\n }\n return query;\n }\n ListBase.addSorting = addSorting;\n /**\n * Return an array of JSON Data that processed based on queries.\n * @param {{[key:string]:Object}[]} dataSource - Specifies local JSON data source.\n * @param {Query} query - Specifies query that need to process.\n */\n function getDataSource(dataSource, query) {\n // tslint:disable-next-line\n return new DataManager(dataSource)\n .executeLocal(query);\n }\n ListBase.getDataSource = getDataSource;\n /**\n * Created JSON data based the UL and LI element\n * @param {HTMLElement|Element} element - UL element that need to convert as a JSON\n * @param {ListBaseOptions} options? - Specifies listbase option for fields.\n */\n function createJsonFromElement(element, options) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n var fields = extend({}, ListBase.defaultMappedFields, curOpt.fields);\n var curEle = element.cloneNode(true);\n var jsonAr = [];\n curEle.classList.add('json-parent');\n var childs = curEle.querySelectorAll('.json-parent>li');\n curEle.classList.remove('json-parent');\n for (var i = 0; i < childs.length; i++) {\n var li = childs[i];\n var anchor = li.querySelector('a');\n var ul = li.querySelector('ul');\n var json = {};\n var childNodes = anchor ? anchor.childNodes : li.childNodes;\n var keys = Object.keys(childNodes);\n for (var i_1 = 0; i_1 < childNodes.length; i_1++) {\n if (!(childNodes[Number(keys[i_1])]).hasChildNodes()) {\n json[fields.text] = childNodes[Number(keys[i_1])].textContent;\n }\n }\n var attributes_1 = getAllAttributes(li);\n if (attributes_1.id) {\n json[fields.id] = attributes_1.id;\n delete attributes_1.id;\n }\n else {\n json[fields.id] = generateId();\n }\n if (Object.keys(attributes_1).length) {\n json[fields.htmlAttributes] = attributes_1;\n }\n if (anchor) {\n attributes_1 = getAllAttributes(anchor);\n if (Object.keys(attributes_1).length) {\n json[fields.urlAttributes] = attributes_1;\n }\n }\n if (ul) {\n json[fields.child] = createJsonFromElement(ul, options);\n }\n jsonAr.push(json);\n }\n return jsonAr;\n }\n ListBase.createJsonFromElement = createJsonFromElement;\n function typeofData(data) {\n var match = { typeof: null, item: null };\n for (var i = 0; i < data.length; i++) {\n if (!isNullOrUndefined(data[i])) {\n return match = { typeof: typeof data[i], item: data[i] };\n }\n }\n return match;\n }\n function setAttribute(element, elementAttributes) {\n var attr = {};\n merge(attr, elementAttributes);\n if (attr.class) {\n addClass([element], attr.class.split(' '));\n delete attr.class;\n }\n attributes(element, attr);\n }\n function getAllAttributes(element) {\n var attributes = {};\n var attr = element.attributes;\n for (var index = 0; index < attr.length; index++) {\n attributes[attr[index].nodeName] = attr[index].nodeValue;\n }\n return attributes;\n }\n /**\n * Created UL element from content template.\n * @param {string} template - that need to convert and generate li element.\n * @param {{[key:string]:Object}[]} dataSource - Specifies local JSON data source.\n * @param {ListBaseOptions} options? - Specifies listbase option for fields.\n */\n function renderContentTemplate(createElement, template, dataSource, fields, options) {\n cssClass = getModuleClass(defaultListBaseOptions.moduleName);\n var ulElement = createElement('ul', { className: cssClass.ul, attrs: { role: 'presentation' } });\n var curOpt = extend({}, defaultListBaseOptions, options);\n var curFields = extend({}, ListBase.defaultMappedFields, fields);\n var compiledString = compile(template);\n var liCollection = [];\n var id = generateId(); // generate id for drop-down-list option.\n for (var i = 0; i < dataSource.length; i++) {\n var fieldData = getFieldValues(dataSource[i], curFields);\n var curItem = dataSource[i];\n var isHeader = curItem.isHeader;\n var value = fieldData[curFields.value];\n if (curOpt.itemCreating && typeof curOpt.itemCreating === 'function') {\n var curData = {\n dataSource: dataSource,\n curData: curItem,\n text: value,\n options: curOpt,\n fields: curFields\n };\n curOpt.itemCreating(curData);\n }\n if (curOpt.itemCreating && typeof curOpt.itemCreating === 'function') {\n fieldData = getFieldValues(dataSource[i], curFields);\n value = fieldData[curFields.value];\n }\n var li = createElement('li', {\n id: id + '-' + i,\n className: isHeader ? cssClass.group : cssClass.li, attrs: { role: 'presentation' }\n });\n if (isHeader) {\n li.innerText = fieldData[curFields.text];\n }\n else {\n append(compiledString(curItem), li);\n li.setAttribute('data-value', value);\n li.setAttribute('role', 'option');\n }\n if (curOpt.itemCreated && typeof curOpt.itemCreated === 'function') {\n var curData = {\n dataSource: dataSource,\n curData: curItem,\n text: value,\n item: li,\n options: curOpt,\n fields: curFields\n };\n curOpt.itemCreated(curData);\n }\n liCollection.push(li);\n }\n append(liCollection, ulElement);\n return ulElement;\n }\n ListBase.renderContentTemplate = renderContentTemplate;\n /**\n * Created header items from group template.\n * @param {string} template - that need to convert and generate li element.\n * @param {{[key:string]:Object}[]} dataSource - Specifies local JSON data source.\n * @param {FieldsMapping} fields - Specifies fields for mapping the dataSource.\n * @param {Element[]} headerItems? - Specifies listbase header items.\n */\n function renderGroupTemplate(groupTemplate, groupDataSource, fields, headerItems) {\n var compiledString = compile(groupTemplate);\n var curFields = extend({}, ListBase.defaultMappedFields, fields);\n var category = curFields.groupBy;\n for (var _i = 0, headerItems_1 = headerItems; _i < headerItems_1.length; _i++) {\n var header = headerItems_1[_i];\n var headerData = {};\n headerData[category] = header.textContent;\n header.innerHTML = '';\n append(compiledString(headerData), header);\n }\n return headerItems;\n }\n ListBase.renderGroupTemplate = renderGroupTemplate;\n function generateId() {\n return Math.floor((1 + Math.random()) * 0x10000)\n .toString(16)\n .substring(1);\n }\n ListBase.generateId = generateId;\n function processSubChild(createElement, fieldData, fields, ds, options, element, level) {\n // Get SubList\n var subDS = fieldData[fields.child] || [];\n var hasChildren = fieldData[fields.hasChildren];\n //Create Sub child\n if (subDS.length) {\n hasChildren = true;\n element.classList.add(cssClass.hasChild);\n if (options.processSubChild) {\n var subLi = createListFromJson(createElement, subDS, options, ++level);\n element.appendChild(subLi);\n }\n }\n // Create expand and collapse node\n if (!!options.expandCollapse && hasChildren && !options.template) {\n element.firstElementChild.classList.add(cssClass.iconWrapper);\n var expandElement = options.expandIconPosition === 'Left' ? prepend : append;\n expandElement([createElement('div', { className: 'e-icons ' + options.expandIconClass })], element.querySelector('.' + cssClass.textContent));\n }\n }\n function generateSingleLevelLI(createElement, item, fieldData, fields, className, innerElements, grpLI, id, index, options) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n var ariaAttributes = extend({}, defaultAriaAttributes, curOpt.ariaAttributes);\n var text = item;\n var value = item;\n var dataSource;\n if (typeof item !== 'string' && typeof item !== 'number' && typeof item !== 'boolean') {\n dataSource = item;\n text = (typeof fieldData[fields.text] === 'boolean' || typeof fieldData[fields.text] === 'number') ?\n fieldData[fields.text] : (fieldData[fields.text] || '');\n value = fieldData[fields.value];\n }\n var elementID;\n if (!isNullOrUndefined(dataSource) && !isNullOrUndefined(fieldData[fields.id])\n && fieldData[fields.id] !== '') {\n elementID = id;\n }\n else {\n elementID = id + '-' + index;\n }\n var li = createElement('li', {\n className: (grpLI === true ? cssClass.group : cssClass.li) + ' ' + (isNullOrUndefined(className) ? '' : className),\n id: elementID, attrs: (ariaAttributes.groupItemRole !== '' && ariaAttributes.itemRole !== '' ?\n { role: (grpLI === true ? ariaAttributes.groupItemRole : ariaAttributes.itemRole) } : {})\n });\n if (dataSource && fieldData.hasOwnProperty(fields.enabled) && fieldData[fields.enabled].toString() === 'false') {\n li.classList.add(cssClass.disabled);\n }\n if (grpLI) {\n li.innerText = text;\n }\n else {\n if (!isNullOrUndefined(value)) {\n li.setAttribute('data-value', value);\n }\n li.setAttribute('role', 'option');\n if (dataSource && fieldData.hasOwnProperty(fields.htmlAttributes) && fieldData[fields.htmlAttributes]) {\n setAttribute(li, fieldData[fields.htmlAttributes]);\n }\n if (innerElements.length) {\n append(innerElements, li);\n }\n if (dataSource && (fieldData[fields.url] || (fieldData[fields.urlAttributes] &&\n fieldData[fields.urlAttributes].href))) {\n li.appendChild(anchorTag(createElement, dataSource, fields, text));\n }\n else {\n li.appendChild(document.createTextNode(text));\n }\n }\n return li;\n }\n function getModuleClass(moduleName) {\n var moduleClass;\n return moduleClass = {\n li: \"e-\" + moduleName + \"-item\",\n ul: \"e-\" + moduleName + \"-parent e-ul\",\n group: \"e-\" + moduleName + \"-group-item\",\n icon: \"e-\" + moduleName + \"-icon\",\n text: \"e-\" + moduleName + \"-text\",\n check: \"e-\" + moduleName + \"-check\",\n checked: 'e-checked',\n selected: 'e-selected',\n expanded: 'e-expanded',\n textContent: 'e-text-content',\n hasChild: 'e-has-child',\n level: 'e-level',\n url: \"e-\" + moduleName + \"-url\",\n collapsible: 'e-icon-collapsible',\n disabled: 'e-disabled',\n image: \"e-\" + moduleName + \"-img\",\n iconWrapper: 'e-icon-wrapper'\n };\n }\n function anchorTag(createElement, dataSource, fields, text) {\n var fieldData = getFieldValues(dataSource, fields);\n var attr = { href: fieldData[fields.url] };\n if (fieldData.hasOwnProperty(fields.urlAttributes) && fieldData[fields.urlAttributes]) {\n merge(attr, fieldData[fields.urlAttributes]);\n attr.href = fieldData[fields.url] ? fieldData[fields.url] :\n fieldData[fields.urlAttributes].href;\n }\n var anchorTag = createElement('a', { className: cssClass.text + ' ' + cssClass.url, innerHTML: text });\n setAttribute(anchorTag, attr);\n return anchorTag;\n }\n /* tslint:disable:align */\n function generateLI(createElement, item, fieldData, fields, className, options) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n var ariaAttributes = extend({}, defaultAriaAttributes, curOpt.ariaAttributes);\n var text = item;\n var uID;\n var grpLI;\n var dataSource;\n if (typeof item !== 'string' && typeof item !== 'number') {\n dataSource = item;\n text = fieldData[fields.text] || '';\n uID = fieldData[fields.id];\n grpLI = (item.hasOwnProperty('isHeader') && item.isHeader)\n ? true : false;\n }\n var li = createElement('li', {\n className: (grpLI === true ? cssClass.group : cssClass.li) + ' ' + (isNullOrUndefined(className) ? '' : className),\n attrs: (ariaAttributes.groupItemRole !== '' && ariaAttributes.itemRole !== '' ?\n { role: (grpLI === true ? ariaAttributes.groupItemRole : ariaAttributes.itemRole) } : {})\n });\n !isNullOrUndefined(uID) ? li.setAttribute('data-uid', uID) : li.setAttribute('data-uid', generateId());\n if (grpLI && options && options.groupTemplate) {\n var compiledString = compile(options.groupTemplate);\n append(compiledString(item), li);\n }\n else if (!grpLI && options && options.template) {\n var compiledString = compile(options.template);\n append(compiledString(item), li);\n }\n else {\n var innerDiv = createElement('div', {\n className: cssClass.textContent,\n attrs: (ariaAttributes.wrapperRole !== '' ? { role: ariaAttributes.wrapperRole } : {})\n });\n if (dataSource && (fieldData[fields.url] || (fieldData[fields.urlAttributes] &&\n fieldData[fields.urlAttributes].href))) {\n innerDiv.appendChild(anchorTag(createElement, dataSource, fields, text));\n }\n else {\n innerDiv.appendChild(createElement('span', {\n className: cssClass.text, innerHTML: text,\n attrs: (ariaAttributes.itemText !== '' ? { role: ariaAttributes.itemText } : {})\n }));\n }\n li.appendChild(innerDiv);\n }\n return li;\n }\n /**\n * Returns UL element based on the given LI element.\n * @param {HTMLElement[]} liElement - Specifies array of LI element.\n * @param {string} className? - Specifies class name that need to be added in UL element.\n * @param {ListBaseOptions} options? - Specifies ListBase options.\n */\n function generateUL(createElement, liElement, className, options) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n var ariaAttributes = extend({}, defaultAriaAttributes, curOpt.ariaAttributes);\n cssClass = getModuleClass(curOpt.moduleName);\n var ulElement = createElement('ul', {\n className: cssClass.ul + ' ' + (isNullOrUndefined(className) ? '' : className),\n attrs: (ariaAttributes.listRole !== '' ? { role: ariaAttributes.listRole } : {})\n });\n append(liElement, ulElement);\n return ulElement;\n }\n ListBase.generateUL = generateUL;\n /**\n * Returns LI element with additional DIV tag based on the given LI element.\n * @param {liElement} liElement - Specifies LI element.\n * @param {string} className? - Specifies class name that need to be added in created DIV element.\n * @param {ListBaseOptions} options? - Specifies ListBase options.\n */\n function generateIcon(createElement, liElement, className, options) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n cssClass = getModuleClass(curOpt.moduleName);\n var expandElement = curOpt.expandIconPosition === 'Left' ? prepend : append;\n expandElement([createElement('div', {\n className: 'e-icons ' + curOpt.expandIconClass + ' ' +\n (isNullOrUndefined(className) ? '' : className)\n })], liElement.querySelector('.' + cssClass.textContent));\n return liElement;\n }\n ListBase.generateIcon = generateIcon;\n})(ListBase || (ListBase = {}));\n/**\n * Used to get dataSource item from complex data using fields.\n * @param {{[key:string]:Object}|string[]|string} dataSource - Specifies an JSON or String data.\n * @param {FieldsMapping} fields - Fields that are mapped from the dataSource.\n */\nexport function getFieldValues(dataItem, fields) {\n var fieldData = {};\n if (isNullOrUndefined(dataItem) || typeof (dataItem) === 'string' || typeof (dataItem) === 'number'\n || !isNullOrUndefined(dataItem.isHeader)) {\n return dataItem;\n }\n else {\n for (var _i = 0, _a = Object.keys(fields); _i < _a.length; _i++) {\n var field = _a[_i];\n var dataField = fields[field];\n var value = !isNullOrUndefined(dataField) &&\n typeof (dataField) === 'string' ? getValue(dataField, dataItem) : undefined;\n if (!isNullOrUndefined(value)) {\n fieldData[dataField] = value;\n }\n }\n }\n return fieldData;\n}\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Base, Event, getUniqueID, NotifyPropertyChanges, Property } from '@syncfusion/ej2-base';\nimport { closest, Draggable, remove, compareElementParent } from '@syncfusion/ej2-base';\nimport { addClass, isNullOrUndefined, getComponent } from '@syncfusion/ej2-base';\n/**\n * Sortable Module provides support to enable sortable functionality in Dom Elements.\n * ```html\n * Popup Content
\n *
\n * ```\n * ```typescript\n * let ele: HTMLElement = document.getElementById('sortable');\n * let sortObj: Sortable = new Sortable(ele, {});\n * ```\n */\nvar Sortable = /** @class */ (function (_super) {\n __extends(Sortable, _super);\n function Sortable(element, options) {\n var _this = _super.call(this, options, element) || this;\n _this.getHelper = function (e) {\n var target = _this.getSortableElement(e.sender.target);\n if (!_this.isValidTarget(target, _this)) {\n return false;\n }\n var element;\n if (_this.helper) {\n element = _this.helper({ sender: target, element: e.element });\n }\n else {\n element = target.cloneNode(true);\n element.style.width = target.offsetWidth + \"px\";\n element.style.height = target.offsetHeight + \"px\";\n }\n addClass([element], ['e-sortableclone']);\n _this.element.appendChild(element);\n return element;\n };\n _this.onDrag = function (e) {\n _this.trigger('drag', { event: e.event, element: _this.element, target: e.target });\n var newInst = _this.getSortableInstance(e.target);\n var target = _this.getSortableElement(e.target, newInst);\n if (_this.isValidTarget(target, newInst) && _this.curTarget !== target &&\n (newInst.placeHolderElement ? newInst.placeHolderElement !== e.target : true)) {\n _this.curTarget = target;\n var oldIdx = _this.getIndex(newInst.placeHolderElement, newInst);\n var isPlaceHolder = isNullOrUndefined(oldIdx);\n oldIdx = isPlaceHolder ? _this.getIndex(_this.target) :\n _this.getIndex(target, newInst) < oldIdx || !oldIdx ? oldIdx : oldIdx - 1;\n newInst.placeHolderElement = _this.getPlaceHolder(target, newInst);\n var newIdx = _this.getIndex(target, newInst);\n var idx = newInst.element !== _this.element && isPlaceHolder ? newIdx : oldIdx < newIdx ? newIdx + 1 : newIdx;\n if (newInst.placeHolderElement) {\n var len = newInst.element.childElementCount;\n if (newInst.element !== _this.element && (idx === len - 1 || idx === len) && (isPlaceHolder || idx === len)) {\n newInst.element.appendChild(newInst.placeHolderElement);\n }\n else {\n newInst.element.insertBefore(newInst.placeHolderElement, newInst.element.children[idx]);\n }\n _this.refreshDisabled(oldIdx, newIdx, newInst);\n }\n else {\n _this.updateItemClass(newInst);\n newInst.element.insertBefore(_this.target, newInst.element.children[idx]);\n _this.refreshDisabled(oldIdx, newIdx, newInst);\n _this.curTarget = _this.target;\n _this.trigger('drop', { event: e.event, element: newInst.element, previousIndex: oldIdx, currentIndex: newIdx,\n target: e.target, helper: newInst.element.lastChild, droppedElement: _this.target, scope: _this.scope });\n }\n }\n if (newInst.element === e.target) {\n if (!_this.isPlaceHolderPresent(newInst)) {\n newInst.placeHolderElement = _this.getPlaceHolder(target, newInst);\n }\n if (newInst.placeHolderElement) {\n newInst.element.appendChild(newInst.placeHolderElement);\n }\n }\n newInst = _this.getSortableInstance(_this.curTarget);\n if (isNullOrUndefined(target) && newInst.element !== e.target && e.target !== newInst.placeHolderElement) {\n if (_this.isPlaceHolderPresent(newInst)) {\n _this.removePlaceHolder(newInst);\n }\n }\n else {\n var placeHolders = [].slice.call(document.getElementsByClassName('e-sortable-placeholder'));\n var inst_1;\n placeHolders.forEach(function (placeHolder) {\n inst_1 = _this.getSortableInstance(placeHolder);\n if (inst_1.element && inst_1 !== newInst) {\n _this.removePlaceHolder(inst_1);\n }\n });\n }\n };\n _this.onDragStart = function (e) {\n _this.element.style.touchAction = 'none';\n _this.target = _this.getSortableElement(e.target);\n _this.target.classList.add('e-grabbed');\n _this.curTarget = _this.target;\n _this.trigger('dragStart', { event: e.event, element: _this.element, target: _this.target });\n };\n _this.onDragStop = function (e) {\n var dropInst = _this.getSortableInstance(_this.curTarget);\n var prevIdx;\n if (_this.isPlaceHolderPresent(dropInst)) {\n prevIdx = _this.getIndex(_this.target);\n _this.updateItemClass(dropInst);\n dropInst.element.insertBefore(_this.target, dropInst.placeHolderElement);\n var curIdx = _this.getIndex(_this.target, dropInst);\n prevIdx = _this === dropInst && (prevIdx - curIdx) > 1 ? prevIdx - 1 : prevIdx;\n _this.trigger('drop', { event: e.event, element: dropInst.element, previousIndex: prevIdx, currentIndex: curIdx,\n target: e.target, helper: e.helper, droppedElement: _this.target, scopeName: _this.scope });\n remove(dropInst.placeHolderElement);\n }\n var newInst = _this.getSortableInstance(e.target);\n if (newInst.element === e.target && newInst !== dropInst && _this.isPlaceHolderPresent(newInst)) {\n prevIdx = _this.getIndex(_this.target);\n _this.updateItemClass(newInst);\n newInst.element.appendChild(_this.target);\n remove(newInst.placeHolderElement);\n _this.trigger('drop', { event: e.event, element: newInst.element, previousIndex: prevIdx,\n currentIndex: newInst.element.childElementCount, target: e.target, helper: e.helper,\n droppedElement: _this.target, scopeName: _this.scope });\n }\n _this.element.style.touchAction = '';\n _this.target.classList.remove('e-grabbed');\n _this.target = null;\n _this.curTarget = null;\n remove(e.helper);\n };\n _this.bind();\n return _this;\n }\n Sortable_1 = Sortable;\n Sortable.prototype.bind = function () {\n if (!this.element.id) {\n this.element.id = getUniqueID('sortable');\n }\n if (!this.itemClass) {\n this.itemClass = 'e-sort-item';\n this.dataBind();\n }\n this.initializeDraggable();\n };\n Sortable.prototype.initializeDraggable = function () {\n new Draggable(this.element, {\n helper: this.getHelper,\n dragStart: this.onDragStart,\n drag: this.onDrag,\n dragStop: this.onDragStop,\n dragTarget: \".\" + this.itemClass,\n enableTapHold: true,\n tapHoldThreshold: 200,\n queryPositionInfo: this.queryPositionInfo\n });\n };\n Sortable.prototype.getPlaceHolder = function (target, instance) {\n if (instance.placeHolder) {\n if (this.isPlaceHolderPresent(instance)) {\n remove(instance.placeHolderElement);\n }\n instance.placeHolderElement = instance.placeHolder({ element: instance.element, grabbedElement: this.target, target: target });\n instance.placeHolderElement.classList.add('e-sortable-placeholder');\n return instance.placeHolderElement;\n }\n return null;\n };\n Sortable.prototype.isValidTarget = function (target, instance) {\n return target && compareElementParent(target, instance.element) && target.classList.contains(instance.itemClass) &&\n !target.classList.contains('e-disabled');\n };\n Sortable.prototype.removePlaceHolder = function (instance) {\n remove(instance.placeHolderElement);\n instance.placeHolderElement = null;\n };\n Sortable.prototype.updateItemClass = function (instance) {\n if (this !== instance) {\n this.target.classList.remove(this.itemClass);\n this.target.classList.add(instance.itemClass);\n }\n };\n Sortable.prototype.getSortableInstance = function (element) {\n element = closest(element, \".e-\" + this.getModuleName());\n if (element) {\n var inst = getComponent(element, Sortable_1);\n return inst.scope && this.scope && inst.scope === this.scope ? inst : this;\n }\n else {\n return this;\n }\n };\n Sortable.prototype.refreshDisabled = function (oldIdx, newIdx, instance) {\n if (instance === this) {\n var element = void 0;\n var increased = oldIdx < newIdx;\n var disabledIdx = void 0;\n var start = increased ? oldIdx : newIdx;\n var end = increased ? newIdx : oldIdx;\n while (start <= end) {\n element = this.element.children[start];\n if (element.classList.contains('e-disabled')) {\n disabledIdx = this.getIndex(element);\n this.element.insertBefore(element, this.element.children[increased ? disabledIdx + 2 : disabledIdx - 1]);\n start = increased ? disabledIdx + 2 : disabledIdx + 1;\n }\n else {\n start++;\n }\n }\n }\n };\n Sortable.prototype.getIndex = function (target, instance) {\n if (instance === void 0) { instance = this; }\n var idx;\n [].slice.call(instance.element.children).forEach(function (element, index) {\n if (element === target) {\n idx = index;\n }\n });\n return idx;\n };\n Sortable.prototype.getSortableElement = function (element, instance) {\n if (instance === void 0) { instance = this; }\n return closest(element, \".\" + instance.itemClass);\n };\n Sortable.prototype.queryPositionInfo = function (value) {\n value.left = pageXOffset ? parseFloat(value.left) - pageXOffset + \"px\" : value.left;\n value.top = pageYOffset ? parseFloat(value.top) - pageYOffset + \"px\" : value.top;\n return value;\n };\n Sortable.prototype.isPlaceHolderPresent = function (instance) {\n return instance.placeHolderElement && !!closest(instance.placeHolderElement, \"#\" + instance.element.id);\n };\n /**\n * It is used to sort array of elements from source element to destination element.\n * @param destination - Defines the destination element to which the sortable elements needs to be appended.\n * If it is null, then the Sortable library element will be considered as destination.\n * @param targetIndexes - Specifies the sortable elements indexes which needs to be sorted.\n * @param insertBefore - Specifies the index before which the sortable elements needs to be appended.\n * If it is null, elements will be appended as last child.\n * @method moveTo\n * @return {void}\n */\n Sortable.prototype.moveTo = function (destination, targetIndexes, insertBefore) {\n moveTo(this.element, destination, targetIndexes, insertBefore);\n };\n /**\n * It is used to destroy the Sortable library.\n */\n Sortable.prototype.destroy = function () {\n if (this.itemClass === 'e-sort-item') {\n this.itemClass = null;\n this.dataBind();\n }\n getComponent(this.element, Draggable).destroy();\n _super.prototype.destroy.call(this);\n };\n Sortable.prototype.getModuleName = function () {\n return 'sortable';\n };\n Sortable.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'itemClass':\n [].slice.call(this.element.children).forEach(function (element) {\n if (element.classList.contains(oldProp.itemClass)) {\n element.classList.remove(oldProp.itemClass);\n }\n if (newProp.itemClass) {\n element.classList.add(newProp.itemClass);\n }\n });\n break;\n }\n }\n };\n var Sortable_1;\n __decorate([\n Property(false)\n ], Sortable.prototype, \"enableAnimation\", void 0);\n __decorate([\n Property(null)\n ], Sortable.prototype, \"itemClass\", void 0);\n __decorate([\n Property(null)\n ], Sortable.prototype, \"scope\", void 0);\n __decorate([\n Property()\n ], Sortable.prototype, \"helper\", void 0);\n __decorate([\n Property()\n ], Sortable.prototype, \"placeHolder\", void 0);\n __decorate([\n Event()\n ], Sortable.prototype, \"drag\", void 0);\n __decorate([\n Event()\n ], Sortable.prototype, \"dragStart\", void 0);\n __decorate([\n Event()\n ], Sortable.prototype, \"drop\", void 0);\n Sortable = Sortable_1 = __decorate([\n NotifyPropertyChanges\n ], Sortable);\n return Sortable;\n}(Base));\nexport { Sortable };\n/**\n * It is used to sort array of elements from source element to destination element.\n * @private\n */\nexport function moveTo(from, to, targetIndexes, insertBefore) {\n var targetElements = [];\n if (!to) {\n to = from;\n }\n if (targetIndexes && targetIndexes.length) {\n targetIndexes.forEach(function (index) {\n targetElements.push(from.children[index]);\n });\n }\n else {\n targetElements = [].slice.call(from.children);\n }\n if (isNullOrUndefined(insertBefore)) {\n targetElements.forEach(function (target) {\n to.appendChild(target);\n });\n }\n else {\n var insertElement_1 = to.children[insertBefore];\n targetElements.forEach(function (target) {\n to.insertBefore(target, insertElement_1);\n });\n }\n}\n","/**\n * Specifies Chart Themes\n */\nexport var Theme;\n(function (Theme) {\n /** @private */\n Theme.axisLabelFont = {\n size: '12px',\n fontWeight: 'Normal',\n color: null,\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n /** @private */\n Theme.axisTitleFont = {\n size: '14px',\n fontWeight: 'Normal',\n color: null,\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n /** @private */\n Theme.chartTitleFont = {\n size: '15px',\n fontWeight: '500',\n color: null,\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n /** @private */\n Theme.chartSubTitleFont = {\n size: '11px',\n fontWeight: '500',\n color: null,\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n /** @private */\n Theme.crosshairLabelFont = {\n size: '13px',\n fontWeight: 'Normal',\n color: null,\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n /** @private */\n Theme.tooltipLabelFont = {\n size: '13px',\n fontWeight: 'Normal',\n color: null,\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n /** @private */\n Theme.legendLabelFont = {\n size: '13px',\n fontWeight: 'Normal',\n color: null,\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n /** @private */\n Theme.stripLineLabelFont = {\n size: '12px',\n fontWeight: 'Regular',\n color: '#353535',\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n /** @private */\n Theme.stockEventFont = {\n size: '13px',\n fontWeight: 'Normal',\n color: null,\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n})(Theme || (Theme = {}));\n/** @private */\nexport function getSeriesColor(theme) {\n var palette;\n switch (theme) {\n case 'Fabric':\n palette = ['#4472c4', '#ed7d31', '#ffc000', '#70ad47', '#5b9bd5',\n '#c1c1c1', '#6f6fe2', '#e269ae', '#9e480e', '#997300'];\n break;\n case 'Bootstrap4':\n palette = ['#a16ee5', '#f7ce69', '#55a5c2', '#7ddf1e', '#ff6ea6',\n '#7953ac', '#b99b4f', '#407c92', '#5ea716', '#b91c52'];\n break;\n case 'Bootstrap':\n palette = ['#a16ee5', '#f7ce69', '#55a5c2', '#7ddf1e', '#ff6ea6',\n '#7953ac', '#b99b4f', '#407c92', '#5ea716', '#b91c52'];\n break;\n case 'HighContrastLight':\n case 'Highcontrast':\n case 'HighContrast':\n palette = ['#79ECE4', '#E98272', '#DFE6B6', '#C6E773', '#BA98FF',\n '#FA83C3', '#00C27A', '#43ACEF', '#D681EF', '#D8BC6E'];\n break;\n case 'MaterialDark':\n palette = ['#00bdae', '#404041', '#357cd2', '#e56590', '#f8b883',\n '#70ad47', '#dd8abd', '#7f84e8', '#7bb4eb', '#ea7a57'];\n break;\n case 'FabricDark':\n palette = ['#4472c4', '#ed7d31', '#ffc000', '#70ad47', '#5b9bd5',\n '#c1c1c1', '#6f6fe2', '#e269ae', '#9e480e', '#997300'];\n break;\n case 'BootstrapDark':\n palette = ['#a16ee5', '#f7ce69', '#55a5c2', '#7ddf1e', '#ff6ea6',\n '#7953ac', '#b99b4f', '#407c92', '#5ea716', '#b91c52'];\n break;\n // palette = ['#B586FF', '#71F9A3', '#FF9572', '#5BD5FF', '#F9F871',\n // '#B6F971', '#8D71F9', '#FF6F91', '#FFC75F', '#D55DB1'];\n // break;\n default:\n palette = ['#00bdae', '#404041', '#357cd2', '#e56590', '#f8b883',\n '#70ad47', '#dd8abd', '#7f84e8', '#7bb4eb', '#ea7a57'];\n break;\n }\n return palette;\n}\n/** @private */\nexport function getThemeColor(theme) {\n var style;\n var darkBackground = theme === 'MaterialDark' ? '#303030' : (theme === 'FabricDark' ? '#201F1F' : '1A1A1A');\n switch (theme) {\n case 'HighContrastLight':\n case 'Highcontrast':\n case 'HighContrast':\n style = {\n axisLabel: '#ffffff',\n axisTitle: '#ffffff',\n axisLine: '#ffffff',\n majorGridLine: '#BFBFBF',\n minorGridLine: '#969696',\n majorTickLine: '#BFBFBF',\n minorTickLine: '#969696',\n chartTitle: '#ffffff',\n legendLabel: '#ffffff',\n background: '#000000',\n areaBorder: '#ffffff',\n errorBar: '#ffffff',\n crosshairLine: '#ffffff',\n crosshairFill: '#ffffff',\n crosshairLabel: '#000000',\n tooltipFill: '#ffffff',\n tooltipBoldLabel: '#000000',\n tooltipLightLabel: '#000000',\n tooltipHeaderLine: '#969696',\n markerShadow: '#BFBFBF',\n selectionRectFill: 'rgba(255, 217, 57, 0.3)',\n selectionRectStroke: '#ffffff',\n selectionCircleStroke: '#FFD939'\n };\n break;\n case 'MaterialDark':\n case 'FabricDark':\n case 'BootstrapDark':\n style = {\n axisLabel: '#DADADA', axisTitle: '#ffffff',\n axisLine: ' #6F6C6C',\n majorGridLine: '#414040',\n minorGridLine: '#514F4F',\n majorTickLine: '#414040',\n minorTickLine: ' #4A4848',\n chartTitle: '#ffffff',\n legendLabel: '#DADADA',\n background: darkBackground,\n areaBorder: ' #9A9A9A',\n errorBar: '#ffffff',\n crosshairLine: '#F4F4F4',\n crosshairFill: '#F4F4F4',\n crosshairLabel: '#282727',\n tooltipFill: '#F4F4F4',\n tooltipBoldLabel: '#282727',\n tooltipLightLabel: '#333232',\n tooltipHeaderLine: '#9A9A9A',\n markerShadow: null,\n selectionRectFill: 'rgba(56,169,255, 0.1)',\n selectionRectStroke: '#38A9FF',\n selectionCircleStroke: '#282727'\n };\n break;\n case 'Bootstrap4':\n style = {\n axisLabel: '#212529', axisTitle: '#ffffff', axisLine: '#CED4DA', majorGridLine: '#CED4DA',\n minorGridLine: '#DEE2E6', majorTickLine: '#ADB5BD', minorTickLine: '#CED4DA', chartTitle: '#212529', legendLabel: '#212529',\n background: '#FFFFFF', areaBorder: '#DEE2E6', errorBar: '#000000', crosshairLine: '#6C757D', crosshairFill: '#495057',\n crosshairLabel: '#FFFFFF', tooltipFill: 'rgba(0, 0, 0, 0.9)', tooltipBoldLabel: 'rgba(255,255,255)',\n tooltipLightLabel: 'rgba(255,255,255, 0.9)', tooltipHeaderLine: 'rgba(255,255,255, 0.2)', markerShadow: null,\n selectionRectFill: 'rgba(255,255,255, 0.1)', selectionRectStroke: 'rgba(0, 123, 255)', selectionCircleStroke: '#495057'\n };\n break;\n default:\n style = {\n axisLabel: '#686868',\n axisTitle: '#424242',\n axisLine: '#b5b5b5',\n majorGridLine: '#dbdbdb',\n minorGridLine: '#eaeaea',\n majorTickLine: '#b5b5b5',\n minorTickLine: '#d6d6d6',\n chartTitle: '#424242',\n legendLabel: '#353535',\n background: '#FFFFFF',\n areaBorder: 'Gray',\n errorBar: '#000000',\n crosshairLine: '#4f4f4f',\n crosshairFill: '#4f4f4f',\n crosshairLabel: '#e5e5e5',\n tooltipFill: 'rgba(0, 8, 22, 0.75)',\n tooltipBoldLabel: '#ffffff',\n tooltipLightLabel: '#dbdbdb',\n tooltipHeaderLine: '#ffffff',\n markerShadow: null,\n selectionRectFill: 'rgba(41, 171, 226, 0.1)',\n selectionRectStroke: '#29abe2',\n selectionCircleStroke: '#29abe2'\n };\n break;\n }\n return style;\n}\n/** @private */\nexport function getScrollbarThemeColor(theme) {\n var scrollStyle;\n switch (theme) {\n case 'HighContrastLight':\n scrollStyle = {\n backRect: '#333',\n thumb: '#bfbfbf',\n circle: '#fff',\n circleHover: '#685708',\n arrow: '#333',\n grip: '#333',\n arrowHover: '#fff',\n backRectBorder: '#969696',\n };\n break;\n case 'Bootstrap':\n scrollStyle = {\n backRect: '#f5f5f5',\n thumb: '#e6e6e6',\n circle: '#fff',\n circleHover: '#eee',\n arrow: '#8c8c8c',\n grip: '#8c8c8c'\n };\n break;\n case 'Fabric':\n scrollStyle = {\n backRect: '#f8f8f8',\n thumb: '#eaeaea',\n circle: '#fff',\n circleHover: '#eaeaea',\n arrow: '#a6a6a6',\n grip: '#a6a6a6'\n };\n break;\n default:\n scrollStyle = {\n backRect: '#f5f5f5',\n thumb: '#e0e0e0',\n circle: '#fff',\n circleHover: '#eee',\n arrow: '#9e9e9e',\n grip: '#9e9e9e'\n };\n break;\n }\n return scrollStyle;\n}\n","/** @private */\nexport function getTooltipThemeColor(theme) {\n var style;\n switch (theme) {\n case 'Highcontrast':\n style = {\n tooltipFill: '#ffffff',\n tooltipBoldLabel: '#000000',\n tooltipLightLabel: '#000000',\n tooltipHeaderLine: '#969696'\n };\n break;\n case 'MaterialDark':\n case 'FabricDark':\n case 'BootstrapDark':\n style = {\n tooltipFill: '#F4F4F4',\n tooltipBoldLabel: '#282727',\n tooltipLightLabel: '#333232',\n tooltipHeaderLine: '#9A9A9A'\n };\n break;\n case 'Bootstrap4':\n style = {\n tooltipFill: 'rgba(0, 0, 0, 0.9)',\n tooltipBoldLabel: 'rgba(255, 255, 255)',\n tooltipLightLabel: 'rgba(255, 255, 255, 0.9)',\n tooltipHeaderLine: 'rgba(255, 255, 255, 0.2)'\n };\n break;\n default:\n style = {\n tooltipFill: 'rgba(0, 8, 22, 0.75)',\n tooltipBoldLabel: '#ffffff',\n tooltipLightLabel: '#dbdbdb',\n tooltipHeaderLine: '#ffffff'\n };\n break;\n }\n return style;\n}\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { SvgRenderer } from '../svg-render/index';\nimport { createElement, remove, merge } from '@syncfusion/ej2-base';\n/**\n * Function to measure the height and width of the text.\n * @param {string} text\n * @param {FontModel} font\n * @param {string} id\n * @returns no\n * @private\n */\nexport function measureText(text, font) {\n var htmlObject = document.getElementById('chartmeasuretext');\n if (htmlObject === null) {\n htmlObject = createElement('text', { id: 'chartmeasuretext' });\n document.body.appendChild(htmlObject);\n }\n htmlObject.innerHTML = text;\n htmlObject.style.position = 'absolute';\n htmlObject.style.fontSize = font.size;\n htmlObject.style.fontWeight = font.fontWeight;\n htmlObject.style.fontStyle = font.fontStyle;\n htmlObject.style.fontFamily = font.fontFamily;\n htmlObject.style.visibility = 'hidden';\n htmlObject.style.top = '-100';\n htmlObject.style.left = '0';\n htmlObject.style.whiteSpace = 'nowrap';\n // For bootstrap line height issue\n htmlObject.style.lineHeight = 'normal';\n return new Size(htmlObject.clientWidth, htmlObject.clientHeight);\n}\n/** @private */\nexport function findDirection(rX, rY, rect, arrowLocation, arrowPadding, top, bottom, left, tipX, tipY, tipRadius) {\n var direction = '';\n var startX = rect.x;\n var startY = rect.y;\n var width = rect.x + rect.width;\n var height = rect.y + rect.height;\n tipRadius = tipRadius ? tipRadius : 0;\n if (top) {\n direction = direction.concat('M' + ' ' + (startX) + ' ' + (startY + rY) + ' Q ' + startX + ' '\n + startY + ' ' + (startX + rX) + ' ' + startY + ' ' +\n ' L' + ' ' + (width - rX) + ' ' + (startY) + ' Q ' + width + ' '\n + startY + ' ' + (width) + ' ' + (startY + rY));\n direction = direction.concat(' L' + ' ' + (width) + ' ' + (height - rY) + ' Q ' + width + ' '\n + (height) + ' ' + (width - rX) + ' ' + (height));\n if (arrowPadding !== 0) {\n direction = direction.concat(' L' + ' ' + (arrowLocation.x + arrowPadding / 2) + ' ' + (height));\n direction = direction.concat(' L' + ' ' + (tipX + tipRadius) + ' ' + (height + arrowPadding - tipRadius));\n direction += ' Q' + ' ' + (tipX) + ' ' + (height + arrowPadding) + ' ' + (tipX - tipRadius) +\n ' ' + (height + arrowPadding - tipRadius);\n }\n if ((arrowLocation.x - arrowPadding / 2) > startX) {\n direction = direction.concat(' L' + ' ' + (arrowLocation.x - arrowPadding / 2) + ' ' + height +\n ' L' + ' ' + (startX + rX) + ' ' + height + ' Q ' + startX + ' '\n + height + ' ' + (startX) + ' ' + (height - rY) + ' z');\n }\n else {\n if (arrowPadding === 0) {\n direction = direction.concat(' L' + ' ' + (startX + rX) + ' ' + height + ' Q ' + startX + ' '\n + height + ' ' + (startX) + ' ' + (height - rY) + ' z');\n }\n else {\n direction = direction.concat(' L' + ' ' + (startX) + ' ' + (height + rY) + ' z');\n }\n }\n }\n else if (bottom) {\n direction = direction.concat('M' + ' ' + (startX) + ' ' + (startY + rY) + ' Q ' + startX + ' '\n + (startY) + ' ' + (startX + rX) + ' ' + (startY) + ' L' + ' ' + (arrowLocation.x - arrowPadding / 2) + ' ' + (startY));\n direction = direction.concat(' L' + ' ' + (tipX - tipRadius) + ' ' + (arrowLocation.y + tipRadius));\n direction += ' Q' + ' ' + (tipX) + ' ' + (arrowLocation.y) + ' ' + (tipX + tipRadius) + ' ' + (arrowLocation.y + tipRadius);\n direction = direction.concat(' L' + ' ' + (arrowLocation.x + arrowPadding / 2) + ' ' + (startY) + ' L' + ' '\n + (width - rX) + ' ' + (startY) + ' Q ' + (width) + ' ' + (startY) + ' ' + (width) + ' ' + (startY + rY));\n direction = direction.concat(' L' + ' ' + (width) + ' ' + (height - rY) + ' Q ' + (width) + ' '\n + (height) + ' ' + (width - rX) + ' ' + (height) +\n ' L' + ' ' + (startX + rX) + ' ' + (height) + ' Q ' + (startX) + ' '\n + (height) + ' ' + (startX) + ' ' + (height - rY) + ' z');\n }\n else if (left) {\n direction = direction.concat('M' + ' ' + (startX) + ' ' + (startY + rY) + ' Q ' + startX + ' '\n + (startY) + ' ' + (startX + rX) + ' ' + (startY));\n direction = direction.concat(' L' + ' ' + (width - rX) + ' ' + (startY) + ' Q ' + (width) + ' '\n + (startY) + ' ' + (width) + ' ' + (startY + rY) + ' L' + ' ' + (width) + ' ' + (arrowLocation.y - arrowPadding / 2));\n direction = direction.concat(' L' + ' ' + (width + arrowPadding - tipRadius) + ' ' + (tipY - tipRadius));\n direction += ' Q ' + (width + arrowPadding) + ' ' + (tipY) + ' ' + (width + arrowPadding - tipRadius) + ' ' + (tipY + tipRadius);\n direction = direction.concat(' L' + ' ' + (width) + ' ' + (arrowLocation.y + arrowPadding / 2) +\n ' L' + ' ' + (width) + ' ' + (height - rY) + ' Q ' + width + ' ' + (height) + ' ' + (width - rX) + ' ' + (height));\n direction = direction.concat(' L' + ' ' + (startX + rX) + ' ' + (height) + ' Q ' + startX + ' '\n + (height) + ' ' + (startX) + ' ' + (height - rY) + ' z');\n }\n else {\n direction = direction.concat('M' + ' ' + (startX + rX) + ' ' + (startY) + ' Q ' + (startX) + ' '\n + (startY) + ' ' + (startX) + ' ' + (startY + rY) + ' L' + ' ' + (startX) + ' ' + (arrowLocation.y - arrowPadding / 2));\n direction = direction.concat(' L' + ' ' + (startX - arrowPadding + tipRadius) + ' ' + (tipY - tipRadius));\n direction += ' Q ' + (startX - arrowPadding) + ' ' + (tipY) + ' ' + (startX - arrowPadding + tipRadius) + ' ' + (tipY + tipRadius);\n direction = direction.concat(' L' + ' ' + (startX) + ' ' + (arrowLocation.y + arrowPadding / 2) +\n ' L' + ' ' + (startX) + ' ' + (height - rY) + ' Q ' + startX + ' '\n + (height) + ' ' + (startX + rX) + ' ' + (height));\n direction = direction.concat(' L' + ' ' + (width - rX) + ' ' + (height) + ' Q ' + width + ' '\n + (height) + ' ' + (width) + ' ' + (height - rY) +\n ' L' + ' ' + (width) + ' ' + (startY + rY) + ' Q ' + width + ' '\n + (startY) + ' ' + (width - rX) + ' ' + (startY) + ' z');\n }\n return direction;\n}\n/** @private */\nvar Size = /** @class */ (function () {\n function Size(width, height) {\n this.width = width;\n this.height = height;\n }\n return Size;\n}());\nexport { Size };\n/** @private */\nvar Rect = /** @class */ (function () {\n function Rect(x, y, width, height) {\n this.x = x;\n this.y = y;\n this.width = width;\n this.height = height;\n }\n return Rect;\n}());\nexport { Rect };\nvar Side = /** @class */ (function () {\n function Side(bottom, right) {\n this.isRight = right;\n this.isBottom = bottom;\n }\n return Side;\n}());\nexport { Side };\n/** @private */\nvar CustomizeOption = /** @class */ (function () {\n function CustomizeOption(id) {\n this.id = id;\n }\n return CustomizeOption;\n}());\nexport { CustomizeOption };\n/** @private */\nvar TextOption = /** @class */ (function (_super) {\n __extends(TextOption, _super);\n function TextOption(id, x, y, anchor, text, transform, baseLine) {\n if (transform === void 0) { transform = ''; }\n var _this = _super.call(this, id) || this;\n _this.transform = '';\n _this.baseLine = 'auto';\n _this.x = x;\n _this.y = y;\n _this.anchor = anchor;\n _this.text = text;\n _this.transform = transform;\n _this.baseLine = baseLine;\n return _this;\n }\n return TextOption;\n}(CustomizeOption));\nexport { TextOption };\n/** @private */\nexport function getElement(id) {\n return document.getElementById(id);\n}\n/** @private */\nexport function removeElement(id) {\n var element = getElement(id);\n if (element) {\n remove(element);\n }\n}\n/** @private */\nexport function drawSymbol(location, shape, size, url, options, label) {\n var functionName = 'Path';\n var renderer = new SvgRenderer('');\n var temp = calculateShapes(location, size, shape, options, url);\n var htmlObject = renderer['draw' + temp.functionName](temp.renderOption);\n htmlObject.setAttribute('aria-label', label);\n return htmlObject;\n}\n/** @private */\nexport function calculateShapes(location, size, shape, options, url) {\n var path;\n var functionName = 'Path';\n var width = size.width;\n var height = size.height;\n var locX = location.x;\n var locY = location.y;\n var x = location.x + (-width / 2);\n var y = location.y + (-height / 2);\n switch (shape) {\n case 'Circle':\n case 'Bubble':\n functionName = 'Ellipse';\n merge(options, { 'rx': width / 2, 'ry': height / 2, 'cx': locX, 'cy': locY });\n break;\n case 'Cross':\n path = 'M' + ' ' + x + ' ' + locY + ' ' + 'L' + ' ' + (locX + (width / 2)) + ' ' + locY + ' ' +\n 'M' + ' ' + locX + ' ' + (locY + (height / 2)) + ' ' + 'L' + ' ' + locX + ' ' +\n (locY + (-height / 2));\n merge(options, { 'd': path });\n break;\n case 'HorizontalLine':\n path = 'M' + ' ' + x + ' ' + locY + ' ' + 'L' + ' ' + (locX + (width / 2)) + ' ' + locY;\n merge(options, { 'd': path });\n break;\n case 'VerticalLine':\n path = 'M' + ' ' + locX + ' ' + (locY + (height / 2)) + ' ' + 'L' + ' ' + locX + ' ' + (locY + (-height / 2));\n merge(options, { 'd': path });\n break;\n case 'Diamond':\n path = 'M' + ' ' + x + ' ' + locY + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + locY + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + locY + ' z';\n merge(options, { 'd': path });\n break;\n case 'Rectangle':\n path = 'M' + ' ' + x + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + (locY + (-height / 2)) + ' z';\n merge(options, { 'd': path });\n break;\n case 'Triangle':\n path = 'M' + ' ' + x + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + (locY + (height / 2)) + ' z';\n merge(options, { 'd': path });\n break;\n case 'InvertedTriangle':\n path = 'M' + ' ' + (locX + (width / 2)) + ' ' + (locY - (height / 2)) + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + (locX - (width / 2)) + ' ' + (locY - (height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY - (height / 2)) + ' z';\n merge(options, { 'd': path });\n break;\n case 'Pentagon':\n var eq = 72;\n var xValue = void 0;\n var yValue = void 0;\n for (var i = 0; i <= 5; i++) {\n xValue = (width / 2) * Math.cos((Math.PI / 180) * (i * eq));\n yValue = (height / 2) * Math.sin((Math.PI / 180) * (i * eq));\n if (i === 0) {\n path = 'M' + ' ' + (locX + xValue) + ' ' + (locY + yValue) + ' ';\n }\n else {\n path = path.concat('L' + ' ' + (locX + xValue) + ' ' + (locY + yValue) + ' ');\n }\n }\n path = path.concat('Z');\n merge(options, { 'd': path });\n break;\n case 'Image':\n functionName = 'Image';\n merge(options, { 'href': url, 'height': height, 'width': width, x: x, y: y });\n break;\n }\n return { renderOption: options, functionName: functionName };\n}\n/** @private */\nvar PathOption = /** @class */ (function (_super) {\n __extends(PathOption, _super);\n function PathOption(id, fill, width, color, opacity, dashArray, d) {\n var _this = _super.call(this, id) || this;\n _this.opacity = opacity;\n _this.fill = fill;\n _this.stroke = color;\n _this['stroke-width'] = width;\n _this['stroke-dasharray'] = dashArray;\n _this.d = d;\n return _this;\n }\n return PathOption;\n}(CustomizeOption));\nexport { PathOption };\n/** @private */\nexport function textElement(options, font, color, parent) {\n var renderOptions = {};\n var htmlObject;\n var tspanElement;\n var renderer = new SvgRenderer('');\n var text;\n var height;\n renderOptions = {\n 'id': options.id,\n 'x': options.x,\n 'y': options.y,\n 'fill': color,\n 'font-size': font.size,\n 'font-style': font.fontStyle,\n 'font-family': font.fontFamily,\n 'font-weight': font.fontWeight,\n 'text-anchor': options.anchor,\n 'transform': options.transform,\n 'opacity': font.opacity,\n 'dominant-baseline': options.baseLine\n };\n text = typeof options.text === 'string' ? options.text : options.text[0];\n htmlObject = renderer.createText(renderOptions, text);\n parent.appendChild(htmlObject);\n return htmlObject;\n}\nvar TooltipLocation = /** @class */ (function () {\n function TooltipLocation(x, y) {\n this.x = x;\n this.y = y;\n }\n return TooltipLocation;\n}());\nexport { TooltipLocation };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { Animation, compile as templateComplier, Browser } from '@syncfusion/ej2-base';\nimport { merge, extend, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { createElement, remove } from '@syncfusion/ej2-base';\nimport { Index } from '../../common/model/base';\nimport { VisibleLabels } from '../../chart/axis/axis';\nimport { axisLabelRender } from '../model/constants';\nimport { measureText, findDirection, Rect, TextOption, Size, PathOption, SvgRenderer } from '@syncfusion/ej2-svg-base';\n/**\n * Function to sort the dataSource, by default it sort the data in ascending order.\n * @param {Object} data\n * @param {string} fields\n * @param {boolean} isDescending\n * @returns Object\n */\nexport function sort(data, fields, isDescending) {\n var sortData = extend([], data, null);\n sortData.sort(function (a, b) {\n var first = 0;\n var second = 0;\n for (var i = 0; i < fields.length; i++) {\n first += a[fields[i]];\n second += b[fields[i]];\n }\n if ((!isDescending && first < second) || (isDescending && first > second)) {\n return -1;\n }\n else if (first === second) {\n return 0;\n }\n return 1;\n });\n return sortData;\n}\n/** @private */\nexport function rotateTextSize(font, text, angle, chart) {\n var renderer = new SvgRenderer(chart.element.id);\n var box;\n var options;\n var htmlObject;\n options = {\n 'font-size': font.size,\n 'font-style': font.fontStyle,\n 'font-family': font.fontFamily,\n 'font-weight': font.fontWeight,\n 'transform': 'rotate(' + angle + ', 0, 0)',\n 'text-anchor': 'middle'\n };\n htmlObject = renderer.createText(options, text);\n if (!chart.delayRedraw && !chart.redraw) {\n chart.element.appendChild(chart.svgObject);\n }\n chart.svgObject.appendChild(htmlObject);\n box = htmlObject.getBoundingClientRect();\n remove(htmlObject);\n if (!chart.delayRedraw && !chart.redraw) {\n remove(chart.svgObject);\n }\n return new Size((box.right - box.left), (box.bottom - box.top));\n}\n/** @private */\nexport function removeElement(id) {\n if (!id) {\n return null;\n }\n var element = typeof id === 'string' ? getElement(id) : id;\n if (element) {\n remove(element);\n }\n}\n/** @private */\nexport function logBase(value, base) {\n return Math.log(value) / Math.log(base);\n}\n/** @private */\nexport function showTooltip(text, x, y, areaWidth, id, element, isTouch) {\n //let id1: string = 'EJ2_legend_tooltip';\n var tooltip = document.getElementById(id);\n var width = measureText(text, {\n fontFamily: 'Segoe UI', size: '12px',\n fontStyle: 'Normal', fontWeight: 'Regular'\n }).width + 5;\n x = (x + width > areaWidth) ? x - width : x;\n if (!tooltip) {\n tooltip = createElement('div', {\n innerHTML: text,\n id: id,\n styles: 'top:' + (y + 15).toString() + 'px;left:' + (x + 15).toString() +\n 'px;background-color: rgb(255, 255, 255) !important; color:black !important; ' +\n 'position:absolute;border:1px solid rgb(112, 112, 112); padding-left : 3px; padding-right : 2px;' +\n 'padding-bottom : 2px; padding-top : 2px; font-size:12px; font-family: \"Segoe UI\"'\n });\n element.appendChild(tooltip);\n }\n else {\n tooltip.innerHTML = text;\n tooltip.style.top = (y + 15).toString() + 'px';\n tooltip.style.left = (x + 15).toString() + 'px';\n }\n if (isTouch) {\n setTimeout(function () { removeElement(id); }, 1500);\n }\n}\n/** @private */\nexport function inside(value, range) {\n return (value < range.max) && (value > range.min);\n}\n/** @private */\nexport function withIn(value, range) {\n return (value <= range.max) && (value >= range.min);\n}\n/** @private */\nexport function logWithIn(value, axis) {\n if (axis.valueType === 'Logarithmic') {\n value = logBase(value, axis.logBase);\n }\n else {\n value = value;\n }\n return value;\n}\n/** @private */\nexport function withInRange(previousPoint, currentPoint, nextPoint, series) {\n var mX2 = logWithIn(currentPoint.xValue, series.xAxis);\n var mX1 = previousPoint ? logWithIn(previousPoint.xValue, series.xAxis) : mX2;\n var mX3 = nextPoint ? logWithIn(nextPoint.xValue, series.xAxis) : mX2;\n var xStart = Math.floor(series.xAxis.visibleRange.min);\n var xEnd = Math.ceil(series.xAxis.visibleRange.max);\n return ((mX1 >= xStart && mX1 <= xEnd) || (mX2 >= xStart && mX2 <= xEnd) ||\n (mX3 >= xStart && mX3 <= xEnd) || (xStart >= mX1 && xStart <= mX3));\n}\n/** @private */\nexport function sum(values) {\n var sum = 0;\n for (var _i = 0, values_1 = values; _i < values_1.length; _i++) {\n var value = values_1[_i];\n sum += value;\n }\n return sum;\n}\n/** @private */\nexport function subArraySum(values, first, last, index, series) {\n var sum = 0;\n if (index !== null) {\n for (var i = (first + 1); i < last; i++) {\n if (index.indexOf(i) === -1) {\n sum += values[i][series.yName];\n }\n }\n }\n else {\n for (var i = (first + 1); i < last; i++) {\n if (!isNullOrUndefined(values[i][series.yName])) {\n sum += values[i][series.yName];\n }\n }\n }\n return sum;\n}\n/** @private */\nexport function subtractThickness(rect, thickness) {\n rect.x += thickness.left;\n rect.y += thickness.top;\n rect.width -= thickness.left + thickness.right;\n rect.height -= thickness.top + thickness.bottom;\n return rect;\n}\n/** @private */\nexport function subtractRect(rect, thickness) {\n rect.x += thickness.x;\n rect.y += thickness.y;\n rect.width -= thickness.x + thickness.width;\n rect.height -= thickness.y + thickness.height;\n return rect;\n}\n/** @private */\nexport function degreeToLocation(degree, radius, center) {\n var radian = (degree * Math.PI) / 180;\n return new ChartLocation(Math.cos(radian) * radius + center.x, Math.sin(radian) * radius + center.y);\n}\nfunction getAccumulationLegend(locX, locY, r, height, width, mode) {\n var cartesianlarge = degreeToLocation(270, r, new ChartLocation(locX, locY));\n var cartesiansmall = degreeToLocation(270, r, new ChartLocation(locX + (width / 10), locY));\n return 'M' + ' ' + locX + ' ' + locY + ' ' + 'L' + ' ' + (locX + r) + ' ' + (locY) + ' ' + 'A' + ' ' + (r) + ' ' + (r) +\n ' ' + 0 + ' ' + 1 + ' ' + 1 + ' ' + cartesianlarge.x + ' ' + cartesianlarge.y + ' ' + 'Z' + ' ' + 'M' + ' ' + (locX +\n (width / 10)) + ' ' + (locY - (height / 10)) + ' ' + 'L' + (locX + (r)) + ' ' + (locY - height / 10) + ' ' + 'A' + ' '\n + (r) + ' ' + (r) + ' ' + 0 + ' ' + 0 + ' ' + 0 + ' ' + cartesiansmall.x + ' ' + cartesiansmall.y + ' ' + 'Z';\n}\n/** @private */\nexport function getAngle(center, point) {\n var angle = Math.atan2((point.y - center.y), (point.x - center.x));\n angle = angle < 0 ? (6.283 + angle) : angle;\n return angle * (180 / Math.PI);\n}\n/** @private */\nexport function subArray(values, index) {\n var subArray = [];\n for (var i = 0; i <= index - 1; i++) {\n subArray.push(values[i]);\n }\n return subArray;\n}\n/** @private */\nexport function valueToCoefficient(value, axis) {\n var range = axis.visibleRange;\n var result = (value - range.min) / (range.delta);\n return axis.isInversed ? (1 - result) : result;\n}\n/** @private */\nexport function TransformToVisible(x, y, xAxis, yAxis, isInverted, series) {\n x = (xAxis.valueType === 'Logarithmic' ? logBase(x > 1 ? x : 1, xAxis.logBase) : x);\n y = (yAxis.valueType === 'Logarithmic' ?\n logBase(y > 1 ? y : 1, yAxis.logBase) : y);\n x += xAxis.valueType === 'Category' && xAxis.labelPlacement === 'BetweenTicks' && series.type !== 'Radar' ? 0.5 : 0;\n var radius = series.chart.radius * valueToCoefficient(y, yAxis);\n var point = CoefficientToVector(valueToPolarCoefficient(x, xAxis), series.chart.primaryXAxis.startAngle);\n return {\n x: (series.clipRect.width / 2 + series.clipRect.x) + radius * point.x,\n y: (series.clipRect.height / 2 + series.clipRect.y) + radius * point.y\n };\n}\n/**\n * method to find series, point index by element id\n * @private\n */\nexport function indexFinder(id, isPoint) {\n if (isPoint === void 0) { isPoint = false; }\n var ids = ['NaN', 'NaN'];\n if (id.indexOf('_Point_') > -1) {\n ids = id.split('_Series_')[1].split('_Point_');\n }\n else if (id.indexOf('_shape_') > -1 && (!isPoint || (isPoint && id.indexOf('_legend_') === -1))) {\n ids = id.split('_shape_');\n ids[0] = '0';\n }\n else if (id.indexOf('_text_') > -1 && (!isPoint || (isPoint && id.indexOf('_legend_') === -1))) {\n ids = id.split('_text_');\n ids[0] = '0';\n }\n return new Index(parseInt(ids[0], 10), parseInt(ids[1], 10));\n}\n/** @private */\nexport function CoefficientToVector(coefficient, startAngle) {\n startAngle = startAngle < 0 ? startAngle + 360 : startAngle;\n var angle = Math.PI * (1.5 - 2 * coefficient);\n angle = angle + (startAngle * Math.PI) / 180;\n return { x: Math.cos(angle), y: Math.sin(angle) };\n}\n/** @private */\nexport function valueToPolarCoefficient(value, axis) {\n var range = axis.visibleRange;\n var delta;\n var length;\n if (axis.valueType !== 'Category') {\n delta = (range.max - (axis.valueType === 'DateTime' ? axis.dateTimeInterval : range.interval)) - range.min;\n length = axis.visibleLabels.length - 1;\n delta = delta === 0 ? 1 : delta;\n }\n else {\n delta = range.delta;\n length = axis.visibleLabels.length;\n }\n return axis.isInversed ? ((value - range.min) / delta) * (1 - 1 / (length)) :\n 1 - ((value - range.min) / delta) * (1 - 1 / (length));\n}\n/** @private */\nvar Mean = /** @class */ (function () {\n function Mean(verticalStandardMean, verticalSquareRoot, horizontalStandardMean, horizontalSquareRoot, verticalMean, horizontalMean) {\n this.verticalStandardMean = verticalStandardMean;\n this.horizontalStandardMean = horizontalStandardMean;\n this.verticalSquareRoot = verticalSquareRoot;\n this.horizontalSquareRoot = horizontalSquareRoot;\n this.verticalMean = verticalMean;\n this.horizontalMean = horizontalMean;\n }\n return Mean;\n}());\nexport { Mean };\n/** @private */\nvar PolarArc = /** @class */ (function () {\n function PolarArc(startAngle, endAngle, innerRadius, radius, currentXPosition) {\n this.startAngle = startAngle;\n this.endAngle = endAngle;\n this.innerRadius = innerRadius;\n this.radius = radius;\n this.currentXPosition = currentXPosition;\n }\n return PolarArc;\n}());\nexport { PolarArc };\n/** @private */\nexport function createTooltip(id, text, top, left, fontSize) {\n var tooltip = getElement(id);\n var style = 'top:' + top.toString() + 'px;' +\n 'left:' + left.toString() + 'px;' +\n 'color:black !important; ' +\n 'background:#FFFFFF !important; ' +\n 'position:absolute;border:1px solid #707070;font-size:' + fontSize + ';border-radius:2px;';\n if (!tooltip) {\n tooltip = createElement('div', {\n id: id, innerHTML: ' ' + text + ' ', styles: style\n });\n document.body.appendChild(tooltip);\n }\n else {\n tooltip.setAttribute('innerHTML', ' ' + text + ' ');\n tooltip.setAttribute('styles', style);\n }\n}\n/** @private */\nexport function createZoomingLabels(chart, axis, parent, index, isVertical, rect) {\n var margin = 5;\n var opposedPosition = axis.opposedPosition;\n var anchor = isVertical ? 'start' : 'auto';\n var size;\n var chartRect = chart.availableSize.width;\n var x;\n var y;\n var rx = 3;\n var arrowLocation;\n var direction;\n var scrollBarHeight = axis.scrollbarSettings.enable || (axis.zoomingScrollBar && axis.zoomingScrollBar.svgObject)\n ? axis.scrollBarHeight : 0;\n for (var i = 0; i < 2; i++) {\n size = measureText(i ? axis.endLabel : axis.startLabel, axis.labelStyle);\n if (isVertical) {\n arrowLocation = i ? new ChartLocation(rect.x - scrollBarHeight, rect.y + rx) :\n new ChartLocation(axis.rect.x - scrollBarHeight, (rect.y + rect.height - rx));\n x = (rect.x + (opposedPosition ? (rect.width + margin + scrollBarHeight) : -(size.width + margin + margin + scrollBarHeight)));\n y = (rect.y + (i ? 0 : rect.height - size.height - margin));\n x += (x < 0 || ((chartRect) < (x + size.width + margin))) ? (opposedPosition ? -(size.width / 2) : size.width / 2) : 0;\n direction = findDirection(rx, rx, new Rect(x, y, size.width + margin, size.height + margin), arrowLocation, margin, false, false, !opposedPosition, arrowLocation.x, arrowLocation.y + (i ? -rx : rx));\n }\n else {\n arrowLocation = i ? new ChartLocation((rect.x + rect.width - rx), (rect.y + rect.height + scrollBarHeight)) :\n new ChartLocation(rect.x + rx, (rect.y + rect.height + scrollBarHeight));\n x = (rect.x + (i ? (rect.width - size.width - margin) : 0));\n y = (opposedPosition ? (rect.y - size.height - 10 - scrollBarHeight) : (rect.y + rect.height + margin + scrollBarHeight));\n direction = findDirection(rx, rx, new Rect(x, y, size.width + margin, size.height + margin), arrowLocation, margin, opposedPosition, !opposedPosition, false, arrowLocation.x + (i ? rx : -rx), arrowLocation.y);\n }\n x = x + (margin / 2);\n y = y + (3 * (size.height / 4)) + (margin / 2);\n parent.appendChild(chart.renderer.drawPath(new PathOption(chart.element.id + '_Zoom_' + index + '_AxisLabel_Shape_' + i, chart.themeStyle.crosshairFill, 2, chart.themeStyle.crosshairFill, 1, null, direction)));\n textElement(new TextOption(chart.element.id + '_Zoom_' + index + '_AxisLabel_' + i, x, y, anchor, i ? axis.endLabel : axis.startLabel), { color: chart.themeStyle.crosshairLabel, fontFamily: 'Segoe UI', fontWeight: 'Regular', size: '11px' }, chart.themeStyle.crosshairLabel, parent);\n }\n return parent;\n}\n//Within bounds\n/** @private */\nexport function withInBounds(x, y, bounds, width, height) {\n if (width === void 0) { width = 0; }\n if (height === void 0) { height = 0; }\n return (x >= bounds.x - width && x <= bounds.x + bounds.width + width && y >= bounds.y - height\n && y <= bounds.y + bounds.height + height);\n}\n/** @private */\nexport function getValueXByPoint(value, size, axis) {\n var actualValue = !axis.isInversed ? value / size : (1 - (value / size));\n return actualValue * (axis.visibleRange.delta) + axis.visibleRange.min;\n}\n/** @private */\nexport function getValueYByPoint(value, size, axis) {\n var actualValue = axis.isInversed ? value / size : (1 - (value / size));\n return actualValue * (axis.visibleRange.delta) + axis.visibleRange.min;\n}\n/** @private */\nexport function findClipRect(series) {\n var rect = series.clipRect;\n if (series.chart.requireInvertedAxis) {\n rect.x = series.yAxis.rect.x;\n rect.y = series.xAxis.rect.y;\n rect.width = series.yAxis.rect.width;\n rect.height = series.xAxis.rect.height;\n }\n else {\n rect.x = series.xAxis.rect.x;\n rect.y = series.yAxis.rect.y;\n rect.width = series.xAxis.rect.width;\n rect.height = series.yAxis.rect.height;\n }\n}\n/** @private */\nexport function firstToLowerCase(str) {\n return str.substr(0, 1).toLowerCase() + str.substr(1);\n}\n/** @private */\nexport function getMinPointsDelta(axis, seriesCollection) {\n var minDelta = Number.MAX_VALUE;\n var xValues;\n var minVal;\n var seriesMin;\n seriesCollection.forEach(function (series, index) {\n xValues = [];\n if (series.visible &&\n (axis.name === series.xAxisName || (axis.name === 'primaryXAxis' && series.xAxisName === null)\n || (axis.name === series.chart.primaryXAxis.name && !series.xAxisName))) {\n xValues = series.points.map(function (point, index) {\n return point.xValue;\n });\n xValues.sort(function (first, second) { return first - second; });\n if (xValues.length === 1) {\n seriesMin = (axis.valueType === 'DateTime' && series.xMin === series.xMax) ? (series.xMin - 2592000000) : series.xMin;\n minVal = xValues[0] - (!isNullOrUndefined(seriesMin) ?\n seriesMin : axis.visibleRange.min);\n if (minVal !== 0) {\n minDelta = Math.min(minDelta, minVal);\n }\n }\n else {\n xValues.forEach(function (value, index, xValues) {\n if (index > 0 && value) {\n minVal = value - xValues[index - 1];\n if (minVal !== 0) {\n minDelta = Math.min(minDelta, minVal);\n }\n }\n });\n }\n }\n });\n if (minDelta === Number.MAX_VALUE) {\n minDelta = 1;\n }\n return minDelta;\n}\n/** @private */\nexport function getAnimationFunction(effect) {\n var functionName;\n switch (effect) {\n case 'Linear':\n functionName = linear;\n break;\n }\n return functionName;\n}\n/**\n * Animation Effect Calculation Started Here\n * @param currentTime\n * @param startValue\n * @param endValue\n * @param duration\n * @private\n */\nexport function linear(currentTime, startValue, endValue, duration) {\n return -endValue * Math.cos(currentTime / duration * (Math.PI / 2)) + endValue + startValue;\n}\n/**\n * Animation Effect Calculation End\n * @private\n */\nexport function markerAnimate(element, delay, duration, series, pointIndex, point, isLabel) {\n var centerX = point.x;\n var centerY = point.y;\n var height = 0;\n element.style.visibility = 'hidden';\n new Animation({}).animate(element, {\n duration: duration,\n delay: delay,\n progress: function (args) {\n if (args.timeStamp > args.delay) {\n args.element.style.visibility = 'visible';\n height = ((args.timeStamp - args.delay) / args.duration);\n element.setAttribute('transform', 'translate(' + centerX\n + ' ' + centerY + ') scale(' + height + ') translate(' + (-centerX) + ' ' + (-centerY) + ')');\n }\n },\n end: function (model) {\n element.style.visibility = '';\n element.removeAttribute('transform');\n if ((series.type === 'Scatter' || series.type === 'Bubble') && !isLabel && (pointIndex === series.points.length - 1)) {\n series.chart.trigger('animationComplete', { series: series });\n }\n }\n });\n}\n/**\n * Animate the rect element\n */\nexport function animateRectElement(element, delay, duration, currentRect, previousRect) {\n var setStyle = function (rect) {\n element.setAttribute('x', rect.x + '');\n element.setAttribute('y', rect.y + '');\n element.setAttribute('width', rect.width + '');\n element.setAttribute('height', rect.height + '');\n };\n new Animation({}).animate(createElement('div'), {\n duration: duration,\n delay: delay,\n name: name,\n progress: function (args) {\n setStyle(new Rect(linear(args.timeStamp, previousRect.x, currentRect.x - previousRect.x, args.duration), linear(args.timeStamp, previousRect.y, currentRect.y - previousRect.y, args.duration), linear(args.timeStamp, previousRect.width, currentRect.width - previousRect.width, args.duration), linear(args.timeStamp, previousRect.height, currentRect.height - previousRect.height, args.duration)));\n },\n end: function () {\n setStyle(currentRect);\n },\n });\n}\n/**\n * Animation after legend click a path\n * @param element element to be animated\n * @param direction current direction of the path\n * @param previousDirection previous direction of the path\n */\nexport function pathAnimation(element, direction, redraw, previousDirection, animateduration) {\n if (!redraw || (!previousDirection && !element)) {\n return null;\n }\n var duration = 300;\n if (animateduration) {\n duration = animateduration;\n }\n var startDirections = previousDirection || element.getAttribute('d');\n var splitDirections = startDirections.split(/(?=[LMCZAQ])/);\n var endDirections = direction.split(/(?=[LMCZAQ])/);\n var currentDireciton;\n var startPath = [];\n var endPath = [];\n var c;\n var end;\n element.setAttribute('d', startDirections);\n new Animation({}).animate(createElement('div'), {\n duration: duration,\n progress: function (args) {\n currentDireciton = '';\n splitDirections.map(function (directions, index) {\n startPath = directions.split(' ');\n endPath = endDirections[index] ? endDirections[index].split(' ') : startPath;\n if (startPath[0] === 'Z') {\n currentDireciton += 'Z' + ' ';\n }\n else {\n currentDireciton += startPath[0] + ' ' +\n linear(args.timeStamp, +startPath[1], (+endPath[1] - +startPath[1]), args.duration) + ' ' +\n linear(args.timeStamp, +startPath[2], (+endPath[2] - +startPath[2]), args.duration) + ' ';\n }\n if (startPath[0] === 'C' || startPath[0] === 'Q') {\n c = 3;\n end = startPath[0] === 'Q' ? 4 : 6;\n while (c < end) {\n currentDireciton += linear(args.timeStamp, +startPath[c], (+endPath[c] - +startPath[c]), args.duration) + ' ' +\n linear(args.timeStamp, +startPath[++c], (+endPath[c] - +startPath[c]), args.duration) + ' ';\n ++c;\n }\n }\n if (startPath[0] === 'A') {\n currentDireciton += 0 + ' ' + 0 + ' ' + 1 + ' ' +\n linear(args.timeStamp, +startPath[6], (+endPath[6] - +startPath[6]), args.duration) + ' ' +\n linear(args.timeStamp, +startPath[7], (+endPath[7] - +startPath[7]), args.duration) + ' ';\n }\n });\n element.setAttribute('d', currentDireciton);\n },\n end: function () {\n element.setAttribute('d', direction);\n }\n });\n}\n/**\n * To append the clip rect element\n * @param redraw\n * @param options\n * @param renderer\n * @param clipPath\n */\nexport function appendClipElement(redraw, options, renderer, clipPath) {\n if (clipPath === void 0) { clipPath = 'drawClipPath'; }\n var clipElement = redrawElement(redraw, options.id, options, renderer);\n if (clipElement) {\n var def = renderer.createDefs();\n def.appendChild(clipElement);\n return def;\n }\n else {\n return renderer[clipPath](options);\n }\n}\n/**\n * Triggers the event.\n * @return {void}\n * @private\n */\nexport function triggerLabelRender(chart, tempInterval, text, labelStyle, axis) {\n var argsData;\n argsData = {\n cancel: false, name: axisLabelRender, axis: axis,\n text: text, value: tempInterval, labelStyle: labelStyle\n };\n chart.trigger(axisLabelRender, argsData);\n if (!argsData.cancel) {\n var isLineBreakLabels = argsData.text.indexOf('Item 1
\n * Item 2
\n * Item 3
\n * Item 4
\n * Item 5
\n * ') !== -1;\n var text_1 = (axis.enableTrim) ? (isLineBreakLabels ?\n lineBreakLabelTrim(axis.maximumLabelWidth, argsData.text, axis.labelStyle) :\n textTrim(axis.maximumLabelWidth, argsData.text, axis.labelStyle)) : argsData.text;\n axis.visibleLabels.push(new VisibleLabels(text_1, argsData.value, argsData.labelStyle, argsData.text));\n }\n}\n/**\n * The function used to find whether the range is set.\n * @return {boolean}\n * @private\n */\nexport function setRange(axis) {\n return (axis.minimum != null && axis.maximum != null);\n}\n/**\n * Calculate desired interval for the axis.\n * @return {void}\n * @private\n */\nexport function getActualDesiredIntervalsCount(availableSize, axis) {\n var size = axis.orientation === 'Horizontal' ? availableSize.width : availableSize.height;\n if (isNullOrUndefined(axis.desiredIntervals)) {\n var desiredIntervalsCount = (axis.orientation === 'Horizontal' ? 0.533 : 1) * axis.maximumLabels;\n desiredIntervalsCount = Math.max((size * (desiredIntervalsCount / 100)), 1);\n return desiredIntervalsCount;\n }\n else {\n return axis.desiredIntervals;\n }\n}\n/**\n * Animation for template\n * @private\n */\nexport function templateAnimate(element, delay, duration, name, isRemove) {\n new Animation({}).animate(element, {\n duration: duration,\n delay: delay,\n name: name,\n progress: function (args) {\n args.element.style.visibility = 'visible';\n },\n end: function (args) {\n if (isRemove) {\n remove(args.element);\n }\n else {\n args.element.style.visibility = 'visible';\n }\n },\n });\n}\n/** @private */\nexport function drawSymbol(location, shape, size, url, options, label) {\n var chartRenderer = new SvgRenderer('');\n var shapeOption = calculateShapes(location, size, shape, options, url);\n var drawElement = chartRenderer['draw' + shapeOption.functionName](shapeOption.renderOption);\n drawElement.setAttribute('aria-label', label);\n return drawElement;\n}\n/** @private */\nexport function calculateShapes(location, size, shape, options, url) {\n var dir;\n var functionName = 'Path';\n var width = size.width;\n var height = size.height;\n var lx = location.x;\n var ly = location.y;\n var y = location.y + (-height / 2);\n var x = location.x + (-width / 2);\n switch (shape) {\n case 'Bubble':\n case 'Circle':\n functionName = 'Ellipse';\n merge(options, { 'rx': width / 2, 'ry': height / 2, 'cx': lx, 'cy': ly });\n break;\n case 'Cross':\n dir = 'M' + ' ' + x + ' ' + ly + ' ' + 'L' + ' ' + (lx + (width / 2)) + ' ' + ly + ' ' +\n 'M' + ' ' + lx + ' ' + (ly + (height / 2)) + ' ' + 'L' + ' ' + lx + ' ' +\n (ly + (-height / 2));\n merge(options, { 'd': dir });\n break;\n case 'HorizontalLine':\n dir = 'M' + ' ' + x + ' ' + ly + ' ' + 'L' + ' ' + (lx + (width / 2)) + ' ' + ly;\n merge(options, { 'd': dir });\n break;\n case 'VerticalLine':\n dir = 'M' + ' ' + lx + ' ' + (ly + (height / 2)) + ' ' + 'L' + ' ' + lx + ' ' + (ly + (-height / 2));\n merge(options, { 'd': dir });\n break;\n case 'Diamond':\n dir = 'M' + ' ' + x + ' ' + ly + ' ' +\n 'L' + ' ' + lx + ' ' + (ly + (-height / 2)) + ' ' +\n 'L' + ' ' + (lx + (width / 2)) + ' ' + ly + ' ' +\n 'L' + ' ' + lx + ' ' + (ly + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + ly + ' z';\n merge(options, { 'd': dir });\n break;\n case 'Rectangle':\n case 'Hilo':\n case 'HiloOpenClose':\n case 'Candle':\n case 'Waterfall':\n case 'BoxAndWhisker':\n case 'StepArea':\n case 'Square':\n case 'Flag':\n dir = 'M' + ' ' + x + ' ' + (ly + (-height / 2)) + ' ' +\n 'L' + ' ' + (lx + (width / 2)) + ' ' + (ly + (-height / 2)) + ' ' +\n 'L' + ' ' + (lx + (width / 2)) + ' ' + (ly + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + (ly + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + (ly + (-height / 2)) + ' z';\n merge(options, { 'd': dir });\n break;\n case 'Pyramid':\n case 'Triangle':\n dir = 'M' + ' ' + x + ' ' + (ly + (height / 2)) + ' ' +\n 'L' + ' ' + lx + ' ' + (ly + (-height / 2)) + ' ' +\n 'L' + ' ' + (lx + (width / 2)) + ' ' + (ly + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + (ly + (height / 2)) + ' z';\n merge(options, { 'd': dir });\n break;\n case 'Funnel':\n case 'InvertedTriangle':\n dir = 'M' + ' ' + (lx + (width / 2)) + ' ' + (ly - (height / 2)) + ' ' +\n 'L' + ' ' + lx + ' ' + (ly + (height / 2)) + ' ' +\n 'L' + ' ' + (lx - (width / 2)) + ' ' + (ly - (height / 2)) + ' ' +\n 'L' + ' ' + (lx + (width / 2)) + ' ' + (ly - (height / 2)) + ' z';\n merge(options, { 'd': dir });\n break;\n case 'Pentagon':\n var eq = 72;\n var xVal = void 0;\n var yVal = void 0;\n for (var i = 0; i <= 5; i++) {\n xVal = (width / 2) * Math.cos((Math.PI / 180) * (i * eq));\n yVal = (height / 2) * Math.sin((Math.PI / 180) * (i * eq));\n if (i === 0) {\n dir = 'M' + ' ' + (lx + xVal) + ' ' + (ly + yVal) + ' ';\n }\n else {\n dir = dir.concat('L' + ' ' + (lx + xVal) + ' ' + (ly + yVal) + ' ');\n }\n }\n dir = dir.concat('Z');\n merge(options, { 'd': dir });\n break;\n case 'Image':\n functionName = 'Image';\n merge(options, { 'href': url, 'height': height, 'width': width, x: x, y: y });\n break;\n }\n options = calculateLegendShapes(location, new Size(width, height), shape, options).renderOption;\n return { renderOption: options, functionName: functionName };\n}\n/** @private */\nexport function getRectLocation(startLocation, endLocation, outerRect) {\n var x;\n var y;\n x = (endLocation.x < outerRect.x) ? outerRect.x :\n (endLocation.x > (outerRect.x + outerRect.width)) ? outerRect.x + outerRect.width : endLocation.x;\n y = (endLocation.y < outerRect.y) ? outerRect.y :\n (endLocation.y > (outerRect.y + outerRect.height)) ? outerRect.y + outerRect.height : endLocation.y;\n return new Rect((x > startLocation.x ? startLocation.x : x), (y > startLocation.y ? startLocation.y : y), Math.abs(x - startLocation.x), Math.abs(y - startLocation.y));\n}\n/** @private */\nexport function minMax(value, min, max) {\n return value > max ? max : (value < min ? min : value);\n}\n/** @private */\nexport function getElement(id) {\n return document.getElementById(id);\n}\n/** @private */\nexport function getTemplateFunction(template) {\n var templateFn = null;\n var e;\n try {\n if (document.querySelectorAll(template).length) {\n templateFn = templateComplier(document.querySelector(template).innerHTML.trim());\n }\n }\n catch (e) {\n templateFn = templateComplier(template);\n }\n return templateFn;\n}\n/** @private */\nexport function createTemplate(childElement, pointIndex, content, chart, point, series) {\n var templateFn;\n var templateElement;\n templateFn = getTemplateFunction(content);\n try {\n var elementData = templateFn ? templateFn({ chart: chart, series: series, point: point }) : [];\n if (elementData.length) {\n templateElement = Array.prototype.slice.call(elementData);\n var len = templateElement.length;\n for (var i = 0; i < len; i++) {\n childElement.appendChild(templateElement[i]);\n }\n }\n }\n catch (e) {\n return childElement;\n }\n return childElement;\n}\n/** @private */\nexport function getFontStyle(font) {\n var style = '';\n style = 'font-size:' + font.size +\n '; font-style:' + font.fontStyle + '; font-weight:' + font.fontWeight +\n '; font-family:' + font.fontFamily + ';opacity:' + font.opacity +\n '; color:' + font.color + ';';\n return style;\n}\n/** @private */\nexport function measureElementRect(element, redraw) {\n if (redraw === void 0) { redraw = false; }\n var bounds;\n document.body.appendChild(element);\n bounds = element.getBoundingClientRect();\n if (redraw) {\n remove(element);\n }\n else {\n removeElement(element.id);\n }\n return bounds;\n}\n/** @private */\nexport function findlElement(elements, id) {\n var element;\n for (var i = 0, length_1 = elements.length; i < length_1; i++) {\n if (elements[i].id.indexOf(id) > -1) {\n element = elements[i];\n continue;\n }\n }\n return element;\n}\n/** @private */\nexport function getPoint(x, y, xAxis, yAxis, isInverted, series) {\n x = ((xAxis.valueType === 'Logarithmic') ? logBase(((x > 1) ? x : 1), xAxis.logBase) : x);\n y = ((yAxis.valueType === 'Logarithmic') ? logBase(((y > 1) ? y : 1), yAxis.logBase) : y);\n x = valueToCoefficient(x, xAxis);\n y = valueToCoefficient(y, yAxis);\n var xLength = (isInverted ? xAxis.rect.height : xAxis.rect.width);\n var yLength = (isInverted ? yAxis.rect.width : yAxis.rect.height);\n var locationX = isInverted ? y * (yLength) : x * (xLength);\n var locationY = isInverted ? (1 - x) * (xLength) : (1 - y) * (yLength);\n return new ChartLocation(locationX, locationY);\n}\n/** @private */\nexport function appendElement(child, parent, redraw, animate, x, y) {\n if (redraw === void 0) { redraw = false; }\n if (animate === void 0) { animate = false; }\n if (x === void 0) { x = 'x'; }\n if (y === void 0) { y = 'y'; }\n if (child && child.hasChildNodes() && parent) {\n appendChildElement(parent, child, redraw, animate, x, y);\n }\n else {\n return null;\n }\n}\n/**\n * Method to append child element\n * @param parent\n * @param childElement\n * @param isReplace\n */\nexport function appendChildElement(parent, childElement, redraw, isAnimate, x, y, start, direction, forceAnimate, isRect, previousRect, animateduration) {\n if (isAnimate === void 0) { isAnimate = false; }\n if (x === void 0) { x = 'x'; }\n if (y === void 0) { y = 'y'; }\n if (forceAnimate === void 0) { forceAnimate = false; }\n if (isRect === void 0) { isRect = false; }\n if (previousRect === void 0) { previousRect = null; }\n var existChild = parent.querySelector('#' + childElement.id);\n var element = (existChild || getElement(childElement.id));\n var child = childElement;\n var duration = animateduration ? animateduration : 300;\n if (redraw && isAnimate && element) {\n start = start || (element.tagName === 'DIV' ?\n new ChartLocation(+(element.style[x].split('px')[0]), +(element.style[y].split('px')[0])) :\n new ChartLocation(+element.getAttribute(x), +element.getAttribute(y)));\n if (direction && direction !== 'undefined') {\n pathAnimation(childElement, childElement.getAttribute('d'), redraw, direction, duration);\n }\n else if (isRect && previousRect) {\n animateRectElement(child, 0, duration, new Rect(+element.getAttribute('x'), +element.getAttribute('y'), +element.getAttribute('width'), +element.getAttribute('height')), previousRect);\n }\n else {\n var end = child.tagName === 'DIV' ?\n new ChartLocation(+(child.style[x].split('px')[0]), +(child.style[y].split('px')[0])) :\n new ChartLocation(+child.getAttribute(x), +child.getAttribute(y));\n animateRedrawElement(child, duration, start, end, x, y);\n }\n }\n else if (redraw && isAnimate && !element && forceAnimate) {\n templateAnimate(child, 0, 600, 'FadeIn');\n }\n if (existChild) {\n parent.replaceChild(child, element);\n }\n else {\n parent.appendChild(child);\n }\n}\n/** @private */\nexport function getDraggedRectLocation(x1, y1, x2, y2, outerRect) {\n var width = Math.abs(x1 - x2);\n var height = Math.abs(y1 - y2);\n var x = Math.max(checkBounds(Math.min(x1, x2), width, outerRect.x, outerRect.width), outerRect.x);\n var y = Math.max(checkBounds(Math.min(y1, y2), height, outerRect.y, outerRect.height), outerRect.y);\n return new Rect(x, y, Math.min(width, outerRect.width), Math.min(height, outerRect.height));\n}\n/** @private */\nexport function checkBounds(start, size, min, max) {\n if (start < min) {\n start = min;\n }\n else if ((start + size) > (max + min)) {\n start = (max + min) - size;\n }\n return start;\n}\n/** @private */\nexport function getLabelText(currentPoint, series, chart) {\n var labelFormat = series.yAxis.labelFormat;\n var text = [];\n var customLabelFormat = labelFormat.match('{value}') !== null;\n switch (series.seriesType) {\n case 'XY':\n text.push(currentPoint.text || currentPoint.yValue.toString());\n break;\n case 'HighLow':\n text.push(currentPoint.text || Math.max(currentPoint.high, currentPoint.low).toString());\n text.push(currentPoint.text || Math.min(currentPoint.high, currentPoint.low).toString());\n break;\n case 'HighLowOpenClose':\n text.push(currentPoint.text || Math.max(currentPoint.high, currentPoint.low).toString());\n text.push(currentPoint.text || Math.min(currentPoint.high, currentPoint.low).toString());\n text.push(currentPoint.text || Math.max(currentPoint.open, currentPoint.close).toString());\n text.push(currentPoint.text || Math.min(currentPoint.open, currentPoint.close).toString());\n break;\n case 'BoxPlot':\n text.push(currentPoint.text || currentPoint.median.toString());\n text.push(currentPoint.text || currentPoint.maximum.toString());\n text.push(currentPoint.text || currentPoint.minimum.toString());\n text.push(currentPoint.text || currentPoint.upperQuartile.toString());\n text.push(currentPoint.text || currentPoint.lowerQuartile.toString());\n for (var _i = 0, _a = currentPoint.outliers; _i < _a.length; _i++) {\n var liers = _a[_i];\n text.push(currentPoint.text || liers.toString());\n }\n break;\n }\n if (labelFormat && !currentPoint.text) {\n for (var i = 0; i < text.length; i++) {\n text[i] = customLabelFormat ? labelFormat.replace('{value}', series.yAxis.format(parseFloat(text[i]))) :\n series.yAxis.format(parseFloat(text[i]));\n }\n }\n return text;\n}\n/** @private */\nexport function stopTimer(timer) {\n window.clearInterval(timer);\n}\n/** @private */\nexport function isCollide(rect, collections, clipRect) {\n var isCollide;\n var currentRect = new Rect(rect.x + clipRect.x, rect.y + clipRect.y, rect.width, rect.height);\n isCollide = collections.some(function (rect) {\n return (currentRect.x < rect.x + rect.width && currentRect.x + currentRect.width > rect.x &&\n currentRect.y < rect.y + rect.height && currentRect.height + currentRect.y > rect.y);\n });\n return isCollide;\n}\n/** @private */\nexport function isOverlap(currentRect, rect) {\n return (currentRect.x < rect.x + rect.width && currentRect.x + currentRect.width > rect.x &&\n currentRect.y < rect.y + rect.height && currentRect.height + currentRect.y > rect.y);\n}\n/** @private */\nexport function containsRect(currentRect, rect) {\n return (currentRect.x <= rect.x && currentRect.x + currentRect.width >= rect.x + rect.width &&\n currentRect.y <= rect.y && currentRect.height + currentRect.y >= rect.y + rect.height);\n}\n/** @private */\nexport function calculateRect(location, textSize, margin) {\n return new Rect((location.x - (textSize.width / 2) - margin.left), (location.y - (textSize.height / 2) - margin.top), textSize.width + margin.left + margin.right, textSize.height + margin.top + margin.bottom);\n}\n/** @private */\nexport function convertToHexCode(value) {\n return '#' + componentToHex(value.r) + componentToHex(value.g) + componentToHex(value.b);\n}\n/** @private */\nexport function componentToHex(value) {\n var hex = value.toString(16);\n return hex.length === 1 ? '0' + hex : hex;\n}\n/** @private */\nexport function convertHexToColor(hex) {\n var result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n return result ? new ColorValue(parseInt(result[1], 16), parseInt(result[2], 16), parseInt(result[3], 16)) :\n new ColorValue(255, 255, 255);\n}\n/** @private */\nexport function colorNameToHex(color) {\n var element;\n color = color === 'transparent' ? 'white' : color;\n document.body.appendChild(createElement('text', { id: 'chartmeasuretext' }));\n element = document.getElementById('chartmeasuretext');\n element.style.color = color;\n color = window.getComputedStyle(element).color;\n remove(element);\n var exp = /^(rgb|hsl)(a?)[(]\\s*([\\d.]+\\s*%?)\\s*,\\s*([\\d.]+\\s*%?)\\s*,\\s*([\\d.]+\\s*%?)\\s*(?:,\\s*([\\d.]+)\\s*)?[)]$/;\n var isRGBValue = exp.exec(color);\n return convertToHexCode(new ColorValue(parseInt(isRGBValue[3], 10), parseInt(isRGBValue[4], 10), parseInt(isRGBValue[5], 10)));\n}\n/** @private */\nexport function getSaturationColor(color, factor) {\n color = colorNameToHex(color);\n color = color.replace(/[^0-9a-f]/gi, '');\n if (color.length < 6) {\n color = color[0] + color[0] + color[1] + color[1] + color[2] + color[2];\n }\n factor = factor || 0;\n // convert to decimal and change luminosity\n var rgb = '#';\n var colorCode;\n for (var i = 0; i < 3; i++) {\n colorCode = parseInt(color.substr(i * 2, 2), 16);\n colorCode = Math.round(Math.min(Math.max(0, colorCode + (colorCode * factor)), 255));\n rgb += ('00' + colorCode.toString(16)).substr(colorCode.toString(16).length);\n }\n return rgb;\n}\n/** @private */\nexport function getMedian(values) {\n var half = Math.floor(values.length / 2);\n return values.length % 2 ? values[half] : ((values[half - 1] + values[half]) / 2.0);\n}\n/** @private */\n// tslint:disable-next-line:max-func-body-length\nexport function calculateLegendShapes(location, size, shape, options) {\n var padding = 10;\n var dir = '';\n var height = size.height;\n var width = size.width;\n var lx = location.x;\n var ly = location.y;\n switch (shape) {\n case 'MultiColoredLine':\n case 'Line':\n case 'StackingLine':\n case 'StackingLine100':\n dir = 'M' + ' ' + (lx + (-width / 2)) + ' ' + (ly) + ' ' +\n 'L' + ' ' + (lx + (width / 2)) + ' ' + (ly);\n merge(options, { 'd': dir });\n break;\n case 'StepLine':\n options.fill = 'transparent';\n dir = 'M' + ' ' + (lx + (-width / 2) - (padding / 4)) + ' ' + (ly + (height / 2)) + ' ' + 'L' + ' ' + (lx +\n (-width / 2) + (width / 10)) + ' ' + (ly + (height / 2)) + ' ' + 'L' + ' ' + (lx + (-width / 2) + (width / 10))\n + ' ' + (ly) + ' ' + 'L' + ' ' + (lx + (-width / 10)) + ' ' + (ly) + ' ' + 'L' + ' ' + (lx + (-width / 10))\n + ' ' + (ly + (height / 2)) + ' ' + 'L' + ' ' + (lx + (width / 5)) + ' ' + (ly + (height / 2)) + ' ' + 'L' +\n ' ' + (lx + (width / 5)) + ' ' + (ly + (-height / 2)) + ' ' + 'L' + ' ' + (lx + (width / 2)) + ' ' + (ly +\n (-height / 2)) + 'L' + ' ' + (lx + (width / 2)) + ' ' + (ly + (height / 2)) + ' ' + 'L' + '' + (lx + (width / 2)\n + (padding / 4)) + ' ' + (ly + (height / 2));\n merge(options, { 'd': dir });\n break;\n case 'RightArrow':\n var space = 2;\n dir = 'M' + ' ' + (lx + (-width / 2)) + ' ' + (ly - (height / 2)) + ' ' +\n 'L' + ' ' + (lx + (width / 2)) + ' ' + (ly) + ' ' + 'L' + ' ' +\n (lx + (-width / 2)) + ' ' + (ly + (height / 2)) + ' L' + ' ' + (lx + (-width / 2)) + ' ' +\n (ly + (height / 2) - space) + ' ' + 'L' + ' ' + (lx + (width / 2) - (2 * space)) + ' ' + (ly) +\n ' L' + (lx + (-width / 2)) + ' ' + (ly - (height / 2) + space) + ' Z';\n merge(options, { 'd': dir });\n break;\n case 'LeftArrow':\n options.fill = options.stroke;\n options.stroke = 'transparent';\n space = 2;\n dir = 'M' + ' ' + (lx + (width / 2)) + ' ' + (ly - (height / 2)) + ' ' +\n 'L' + ' ' + (lx + (-width / 2)) + ' ' + (ly) + ' ' + 'L' + ' ' +\n (lx + (width / 2)) + ' ' + (ly + (height / 2)) + ' ' + 'L' + ' ' +\n (lx + (width / 2)) + ' ' + (ly + (height / 2) - space) + ' L' + ' ' + (lx + (-width / 2) + (2 * space))\n + ' ' + (ly) + ' L' + (lx + (width / 2)) + ' ' + (ly - (height / 2) + space) + ' Z';\n merge(options, { 'd': dir });\n break;\n case 'Column':\n case 'Pareto':\n case 'StackingColumn':\n case 'StackingColumn100':\n case 'RangeColumn':\n case 'Histogram':\n dir = 'M' + ' ' + (lx - 3 * (width / 5)) + ' ' + (ly - (height / 5)) + ' ' + 'L' + ' ' +\n (lx + 3 * (-width / 10)) + ' ' + (ly - (height / 5)) + ' ' + 'L' + ' ' +\n (lx + 3 * (-width / 10)) + ' ' + (ly + (height / 2)) + ' ' + 'L' + ' ' + (lx - 3 *\n (width / 5)) + ' ' + (ly + (height / 2)) + ' ' + 'Z' + ' ' + 'M' + ' ' +\n (lx + (-width / 10) - (width / 20)) + ' ' + (ly - (height / 4) - (padding / 2))\n + ' ' + 'L' + ' ' + (lx + (width / 10) + (width / 20)) + ' ' + (ly - (height / 4) -\n (padding / 2)) + ' ' + 'L' + ' ' + (lx + (width / 10) + (width / 20)) + ' ' + (ly\n + (height / 2)) + ' ' + 'L' + ' ' + (lx + (-width / 10) - (width / 20)) + ' ' + (ly +\n (height / 2)) + ' ' + 'Z' + ' ' + 'M' + ' ' + (lx + 3 * (width / 10)) + ' ' + (ly) + ' ' +\n 'L' + ' ' + (lx + 3 * (width / 5)) + ' ' + (ly) + ' ' + 'L' + ' '\n + (lx + 3 * (width / 5)) + ' ' + (ly + (height / 2)) + ' ' + 'L' + ' '\n + (lx + 3 * (width / 10)) + ' ' + (ly + (height / 2)) + ' ' + 'Z';\n merge(options, { 'd': dir });\n break;\n case 'Bar':\n case 'StackingBar':\n case 'StackingBar100':\n dir = 'M' + ' ' + (lx + (-width / 2) + (-padding / 4)) + ' ' + (ly - 3 * (height / 5)) + ' '\n + 'L' + ' ' + (lx + 3 * (width / 10)) + ' ' + (ly - 3 * (height / 5)) + ' ' + 'L' + ' ' +\n (lx + 3 * (width / 10)) + ' ' + (ly - 3 * (height / 10)) + ' ' + 'L' + ' ' +\n (lx - (width / 2) + (-padding / 4)) + ' ' + (ly - 3 * (height / 10)) + ' ' + 'Z' + ' '\n + 'M' + ' ' + (lx + (-width / 2) + (-padding / 4)) + ' ' + (ly - (height / 5)\n + (padding / 20)) + ' ' + 'L' + ' ' + (lx + (width / 2) + (padding / 4)) + ' ' + (ly\n - (height / 5) + (padding / 20)) + ' ' + 'L' + ' ' + (lx + (width / 2) + (padding / 4))\n + ' ' + (ly + (height / 10) + (padding / 20)) + ' ' + 'L' + ' ' + (lx - (width / 2)\n + (-padding / 4)) + ' ' + (ly + (height / 10) + (padding / 20)) + ' ' + 'Z' + ' ' + 'M'\n + ' ' + (lx - (width / 2) + (-padding / 4)) + ' ' + (ly + (height / 5)\n + (padding / 10)) + ' ' + 'L' + ' ' + (lx + (-width / 4)) + ' ' + (ly + (height / 5)\n + (padding / 10)) + ' ' + 'L' + ' ' + (lx + (-width / 4)) + ' ' + (ly + (height / 2)\n + (padding / 10)) + ' ' + 'L' + ' ' + (lx - (width / 2) + (-padding / 4))\n + ' ' + (ly + (height / 2) + (padding / 10)) + ' ' + 'Z';\n merge(options, { 'd': dir });\n break;\n case 'Spline':\n options.fill = 'transparent';\n dir = 'M' + ' ' + (lx - (width / 2)) + ' ' + (ly + (height / 5)) + ' ' + 'Q' + ' '\n + lx + ' ' + (ly - height) + ' ' + lx + ' ' + (ly + (height / 5))\n + ' ' + 'M' + ' ' + lx + ' ' + (ly + (height / 5)) + ' ' + 'Q' + ' ' + (lx\n + (width / 2)) + ' ' + (ly + (height / 2)) + ' ' + (lx + (width / 2)) + ' '\n + (ly - (height / 2));\n merge(options, { 'd': dir });\n break;\n case 'Area':\n case 'MultiColoredArea':\n case 'RangeArea':\n case 'StackingArea':\n case 'StackingArea100':\n dir = 'M' + ' ' + (lx - (width / 2) - (padding / 4)) + ' ' + (ly + (height / 2))\n + ' ' + 'L' + ' ' + (lx + (-width / 4) + (-padding / 8)) + ' ' + (ly - (height / 2))\n + ' ' + 'L' + ' ' + (lx) + ' ' + (ly + (height / 4)) + ' ' + 'L' + ' ' + (lx\n + (width / 4) + (padding / 8)) + ' ' + (ly + (-height / 2) + (height / 4)) + ' '\n + 'L' + ' ' + (lx + (height / 2) + (padding / 4)) + ' ' + (ly + (height / 2)) + ' ' + 'Z';\n merge(options, { 'd': dir });\n break;\n case 'SplineArea':\n dir = 'M' + ' ' + (lx - (width / 2)) + ' ' + (ly + (height / 5)) + ' ' + 'Q' + ' ' + lx\n + ' ' + (ly - height) + ' ' + lx + ' ' + (ly + (height / 5)) + ' ' + 'Z' + ' ' + 'M'\n + ' ' + lx + ' ' + (ly + (height / 5)) + ' ' + 'Q' + ' ' + (lx + (width / 2)) + ' '\n + (ly + (height / 2)) + ' ' + (lx + (width / 2)) + ' '\n + (ly - (height / 2)) + ' ' + ' Z';\n merge(options, { 'd': dir });\n break;\n case 'Pie':\n case 'Doughnut':\n options.stroke = 'transparent';\n var r = Math.min(height, width) / 2;\n dir = getAccumulationLegend(lx, ly, r, height, width, shape);\n merge(options, { 'd': dir });\n break;\n }\n return { renderOption: options };\n}\n/** @private */\nexport function textTrim(maxWidth, text, font) {\n var label = text;\n var size = measureText(text, font).width;\n if (size > maxWidth) {\n var textLength = text.length;\n for (var i = textLength - 1; i >= 0; --i) {\n label = text.substring(0, i) + '...';\n size = measureText(label, font).width;\n if (size <= maxWidth) {\n return label;\n }\n }\n }\n return label;\n}\n/**\n * To trim the line break label\n * @param maxWidth\n * @param text\n * @param font\n */\nexport function lineBreakLabelTrim(maxWidth, text, font) {\n var labelCollection = [];\n var breakLabels = text.split('
');\n for (var i = 0; i < breakLabels.length; i++) {\n text = breakLabels[i];\n var size = measureText(text, font).width;\n if (size > maxWidth) {\n var textLength = text.length;\n for (var i_1 = textLength - 1; i_1 >= 0; --i_1) {\n text = text.substring(0, i_1) + '...';\n size = measureText(text, font).width;\n if (size <= maxWidth) {\n labelCollection.push(text);\n break;\n }\n }\n }\n else {\n labelCollection.push(text);\n }\n }\n return labelCollection;\n}\n/** @private */\nexport function stringToNumber(value, containerSize) {\n if (value !== null && value !== undefined) {\n return value.indexOf('%') !== -1 ? (containerSize / 100) * parseInt(value, 10) : parseInt(value, 10);\n }\n return null;\n}\n/** @private */\nexport function redrawElement(redraw, id, options, renderer) {\n if (!redraw) {\n return null;\n }\n var element = getElement(id);\n if (element && options) {\n renderer.setElementAttributes(options, element.tagName === 'clipPath' ? element.childNodes[0] : element);\n }\n return element;\n}\n/** @private */\nexport function animateRedrawElement(element, duration, start, end, x, y) {\n if (x === void 0) { x = 'x'; }\n if (y === void 0) { y = 'y'; }\n var isDiv = element.tagName === 'DIV';\n var setStyle = function (xValue, yValue) {\n if (isDiv) {\n element.style[x] = xValue + 'px';\n element.style[y] = yValue + 'px';\n }\n else {\n element.setAttribute(x, xValue + '');\n element.setAttribute(y, yValue + '');\n }\n };\n setStyle(start.x, start.y);\n new Animation({}).animate(createElement('div'), {\n duration: duration,\n progress: function (args) {\n setStyle(linear(args.timeStamp, start.x, end.x - start.x, args.duration), linear(args.timeStamp, start.y, end.y - start.y, args.duration));\n },\n end: function () {\n setStyle(end.x, end.y);\n }\n });\n}\n/** @private */\nexport function textElement(option, font, color, parent, isMinus, redraw, isAnimate, forceAnimate, animateduration) {\n if (isMinus === void 0) { isMinus = false; }\n if (forceAnimate === void 0) { forceAnimate = false; }\n var renderOptions = {};\n var htmlObject;\n var tspanElement;\n var renderer = new SvgRenderer('');\n var text;\n var height;\n renderOptions = {\n 'id': option.id,\n 'x': option.x,\n 'y': option.y,\n 'fill': color,\n 'font-size': font.size,\n 'font-style': font.fontStyle,\n 'font-family': font.fontFamily,\n 'font-weight': font.fontWeight,\n 'text-anchor': option.anchor,\n 'transform': option.transform,\n 'opacity': font.opacity,\n 'dominant-baseline': option.baseLine\n };\n text = typeof option.text === 'string' ? option.text : isMinus ? option.text[option.text.length - 1] : option.text[0];\n htmlObject = renderer.createText(renderOptions, text);\n if (typeof option.text !== 'string' && option.text.length > 1) {\n for (var i = 1, len = option.text.length; i < len; i++) {\n height = (measureText(option.text[i], font).height);\n tspanElement = renderer.createTSpan({\n 'x': option.x, 'id': option.id,\n 'y': (option.y) + ((isMinus) ? -(i * height) : (i * height))\n }, isMinus ? option.text[option.text.length - (i + 1)] : option.text[i]);\n htmlObject.appendChild(tspanElement);\n }\n }\n appendChildElement(parent, htmlObject, redraw, isAnimate, 'x', 'y', null, null, forceAnimate, false, null, animateduration);\n return htmlObject;\n}\n/**\n * Method to calculate the width and height of the chart\n */\nexport function calculateSize(chart) {\n var containerWidth = chart.element.clientWidth;\n var containerHeight = chart.element.clientHeight;\n if (chart.stockChart) {\n containerWidth = chart.stockChart.element.clientWidth;\n }\n var height = 450;\n var marginHeight;\n if (chart.getModuleName() === 'rangeNavigator') {\n var range = chart;\n var tooltipSpace = range.tooltip.enable ? 35 : 0;\n var periodHeight = range.periodSelectorSettings.periods.length ?\n range.periodSelectorSettings.height : 0;\n marginHeight = range.margin.top + range.margin.bottom + tooltipSpace;\n var labelSize = measureText('tempString', range.labelStyle).height;\n var labelPadding = 15;\n height = (chart.series.length ? (Browser.isDevice ? 80 : 120) : ((range.enableGrouping ? (40 + labelPadding + labelSize) : 40)\n + marginHeight)) + periodHeight;\n if (range.disableRangeSelector) {\n height = periodHeight;\n }\n }\n chart.availableSize = new Size(stringToNumber(chart.width, containerWidth) || containerWidth || 600, stringToNumber(chart.height, containerHeight) || containerHeight || height);\n}\nexport function createSvg(chart) {\n chart.renderer = new SvgRenderer(chart.element.id);\n calculateSize(chart);\n if (chart.stockChart && chart.getModuleName() === 'chart') {\n chart.svgObject = chart.stockChart.chartObject;\n }\n else if (chart.stockChart && chart.getModuleName() === 'rangeNavigator') {\n chart.svgObject = chart.stockChart.selectorObject;\n }\n else {\n chart.svgObject = chart.renderer.createSvg({\n id: chart.element.id + '_svg',\n width: chart.availableSize.width,\n height: chart.availableSize.height\n });\n }\n}\n/**\n * To calculate chart title and height\n * @param title\n * @param style\n * @param width\n */\nexport function getTitle(title, style, width) {\n var titleCollection = [];\n switch (style.textOverflow) {\n case 'Wrap':\n titleCollection = textWrap(title, width, style);\n break;\n case 'Trim':\n titleCollection.push(textTrim(width, title, style));\n break;\n default:\n titleCollection.push(title);\n break;\n }\n return titleCollection;\n}\n/**\n * Method to calculate x position of title\n */\nexport function titlePositionX(rect, titleStyle) {\n var positionX;\n if (titleStyle.textAlignment === 'Near') {\n positionX = rect.x;\n }\n else if (titleStyle.textAlignment === 'Center') {\n positionX = rect.x + rect.width / 2;\n }\n else {\n positionX = rect.x + rect.width;\n }\n return positionX;\n}\n/**\n * Method to find new text and element size based on textOverflow\n */\nexport function textWrap(currentLabel, maximumWidth, font) {\n var textCollection = currentLabel.split(' ');\n var label = '';\n var labelCollection = [];\n var text;\n for (var i = 0, len = textCollection.length; i < len; i++) {\n text = textCollection[i];\n if (measureText(label.concat(text), font).width < maximumWidth) {\n label = label.concat((label === '' ? '' : ' ') + text);\n }\n else {\n if (label !== '') {\n labelCollection.push(textTrim(maximumWidth, label, font));\n label = text;\n }\n else {\n labelCollection.push(textTrim(maximumWidth, text, font));\n text = '';\n }\n }\n if (label && i === len - 1) {\n labelCollection.push(textTrim(maximumWidth, label, font));\n }\n }\n return labelCollection;\n}\n/** @private */\nvar CustomizeOption = /** @class */ (function () {\n function CustomizeOption(id) {\n this.id = id;\n }\n return CustomizeOption;\n}());\nexport { CustomizeOption };\n/** @private */\nvar StackValues = /** @class */ (function () {\n function StackValues(startValue, endValue) {\n this.startValues = startValue;\n this.endValues = endValue;\n }\n return StackValues;\n}());\nexport { StackValues };\n/** @private */\nvar RectOption = /** @class */ (function (_super) {\n __extends(RectOption, _super);\n function RectOption(id, fill, border, opacity, rect, rx, ry, transform, dashArray) {\n var _this = _super.call(this, id, fill, border.width, border.color, opacity, dashArray) || this;\n _this.y = rect.y;\n _this.x = rect.x;\n _this.height = rect.height;\n _this.width = rect.width;\n _this.rx = rx ? rx : 0;\n _this.ry = ry ? ry : 0;\n _this.transform = transform ? transform : '';\n return _this;\n }\n return RectOption;\n}(PathOption));\nexport { RectOption };\n/** @private */\nvar CircleOption = /** @class */ (function (_super) {\n __extends(CircleOption, _super);\n function CircleOption(id, fill, border, opacity, cx, cy, r) {\n var _this = _super.call(this, id, fill, border.width, border.color, opacity) || this;\n _this.cy = cy;\n _this.cx = cx;\n _this.r = r;\n return _this;\n }\n return CircleOption;\n}(PathOption));\nexport { CircleOption };\n/** @private */\nvar PolygonOption = /** @class */ (function () {\n function PolygonOption(id, points, fill) {\n this.id = id;\n this.points = points;\n this.fill = fill;\n }\n return PolygonOption;\n}());\nexport { PolygonOption };\n/** @private */\nvar ChartLocation = /** @class */ (function () {\n function ChartLocation(x, y) {\n this.x = x;\n this.y = y;\n }\n return ChartLocation;\n}());\nexport { ChartLocation };\n/** @private */\nvar Thickness = /** @class */ (function () {\n function Thickness(left, right, top, bottom) {\n this.left = left;\n this.right = right;\n this.top = top;\n this.bottom = bottom;\n }\n return Thickness;\n}());\nexport { Thickness };\n/** @private */\nvar ColorValue = /** @class */ (function () {\n function ColorValue(r, g, b) {\n this.r = r;\n this.g = g;\n this.b = b;\n }\n return ColorValue;\n}());\nexport { ColorValue };\n/** @private */\nvar PointData = /** @class */ (function () {\n function PointData(point, series, index) {\n if (index === void 0) { index = 0; }\n this.point = point;\n this.series = series;\n this.lierIndex = index;\n }\n return PointData;\n}());\nexport { PointData };\n/** @private */\nvar AccPointData = /** @class */ (function () {\n function AccPointData(point, series, index) {\n if (index === void 0) { index = 0; }\n this.point = point;\n this.series = series;\n }\n return AccPointData;\n}());\nexport { AccPointData };\n/** @private */\nvar ControlPoints = /** @class */ (function () {\n function ControlPoints(controlPoint1, controlPoint2) {\n this.controlPoint1 = controlPoint1;\n this.controlPoint2 = controlPoint2;\n }\n return ControlPoints;\n}());\nexport { ControlPoints };\n","/**\n * @private\n * @hidden\n */\nexport function defaultToString(item) {\n // if (item === null) {\n // return 'COLLECTION_NULL';\n // } else if (typeof item === 'undefined') {\n // return 'COLLECTION_UNDEFINED';\n // } else if (Object.prototype.toString.call(item) === '[object String]') {\n if (Object.prototype.toString.call(item) === '[object String]') {\n return '$s' + item;\n }\n else {\n return '$o' + item.toString();\n }\n}\n","/**\n * Encoding class: Contains the details about encoding type, whether to write a Unicode byte order mark (BOM).\n * ```typescript\n * let encoding : Encoding = new Encoding();\n * encoding.type = 'Utf8';\n * encoding.getBytes('Encoding', 0, 5);\n * ```\n */\nvar Encoding = /** @class */ (function () {\n /**\n * Initializes a new instance of the Encoding class. A parameter specifies whether to write a Unicode byte order mark\n * @param {boolean} includeBom?-true to specify that a Unicode byte order mark is written; otherwise, false.\n */\n function Encoding(includeBom) {\n this.emitBOM = true;\n this.encodingType = 'Ansi';\n this.initBOM(includeBom);\n }\n Object.defineProperty(Encoding.prototype, \"includeBom\", {\n /**\n * Gets a value indicating whether to write a Unicode byte order mark\n * @returns boolean- true to specify that a Unicode byte order mark is written; otherwise, false\n */\n get: function () {\n return this.emitBOM;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Encoding.prototype, \"type\", {\n /**\n * Gets the encoding type.\n * @returns EncodingType\n */\n get: function () {\n return this.encodingType;\n },\n /**\n * Sets the encoding type.\n * @param {EncodingType} value\n */\n set: function (value) {\n this.encodingType = value;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * Initialize the includeBom to emit BOM or Not\n * @param {boolean} includeBom\n */\n Encoding.prototype.initBOM = function (includeBom) {\n if (includeBom === undefined || includeBom === null) {\n this.emitBOM = true;\n }\n else {\n this.emitBOM = includeBom;\n }\n };\n /**\n * Calculates the number of bytes produced by encoding the characters in the specified string\n * @param {string} chars - The string containing the set of characters to encode\n * @returns {number} - The number of bytes produced by encoding the specified characters\n */\n Encoding.prototype.getByteCount = function (chars) {\n var byteCount = 0;\n validateNullOrUndefined(chars, 'string');\n if (chars === '') {\n var byte = this.utf8Len(chars.charCodeAt(0));\n return byte;\n }\n if (this.type === null || this.type === undefined) {\n this.type = 'Ansi';\n }\n return this.getByteCountInternal(chars, 0, chars.length);\n };\n /**\n * Return the Byte of character\n * @param {number} codePoint\n * @returns {number}\n */\n Encoding.prototype.utf8Len = function (codePoint) {\n var bytes = codePoint <= 0x7F ? 1 :\n codePoint <= 0x7FF ? 2 :\n codePoint <= 0xFFFF ? 3 :\n codePoint <= 0x1FFFFF ? 4 : 0;\n return bytes;\n };\n /**\n * for 4 byte character return surrogate pair true, otherwise false\n * @param {number} codeUnit\n * @returns {boolean}\n */\n Encoding.prototype.isHighSurrogate = function (codeUnit) {\n return codeUnit >= 0xD800 && codeUnit <= 0xDBFF;\n };\n /**\n * for 4byte character generate the surrogate pair\n * @param {number} highCodeUnit\n * @param {number} lowCodeUnit\n */\n Encoding.prototype.toCodepoint = function (highCodeUnit, lowCodeUnit) {\n highCodeUnit = (0x3FF & highCodeUnit) << 10;\n var u = highCodeUnit | (0x3FF & lowCodeUnit);\n return u + 0x10000;\n };\n /**\n * private method to get the byte count for specific charindex and count\n * @param {string} chars\n * @param {number} charIndex\n * @param {number} charCount\n */\n Encoding.prototype.getByteCountInternal = function (chars, charIndex, charCount) {\n var byteCount = 0;\n if (this.encodingType === 'Utf8' || this.encodingType === 'Unicode') {\n var isUtf8 = this.encodingType === 'Utf8';\n for (var i = 0; i < charCount; i++) {\n var charCode = chars.charCodeAt(isUtf8 ? charIndex : charIndex++);\n if (this.isHighSurrogate(charCode)) {\n if (isUtf8) {\n var high = charCode;\n var low = chars.charCodeAt(++charIndex);\n byteCount += this.utf8Len(this.toCodepoint(high, low));\n }\n else {\n byteCount += 4;\n ++i;\n }\n }\n else {\n if (isUtf8) {\n byteCount += this.utf8Len(charCode);\n }\n else {\n byteCount += 2;\n }\n }\n if (isUtf8) {\n charIndex++;\n }\n }\n return byteCount;\n }\n else {\n byteCount = charCount;\n return byteCount;\n }\n };\n /**\n * Encodes a set of characters from the specified string into the ArrayBuffer.\n * @param {string} s- The string containing the set of characters to encode\n * @param {number} charIndex-The index of the first character to encode.\n * @param {number} charCount- The number of characters to encode.\n * @returns {ArrayBuffer} - The ArrayBuffer that contains the resulting sequence of bytes.\n */\n Encoding.prototype.getBytes = function (s, charIndex, charCount) {\n validateNullOrUndefined(s, 'string');\n validateNullOrUndefined(charIndex, 'charIndex');\n validateNullOrUndefined(charCount, 'charCount');\n if (charIndex < 0 || charCount < 0) {\n throw new RangeError('Argument Out Of Range Exception: charIndex or charCount is less than zero');\n }\n if (s.length - charIndex < charCount) {\n throw new RangeError('Argument Out Of Range Exception: charIndex and charCount do not denote a valid range in string');\n }\n var bytes;\n if (s === '') {\n bytes = new ArrayBuffer(0);\n return bytes;\n }\n if (this.type === null || this.type === undefined) {\n this.type = 'Ansi';\n }\n var byteCount = this.getByteCountInternal(s, charIndex, charCount);\n switch (this.type) {\n case 'Utf8':\n bytes = this.getBytesOfUtf8Encoding(byteCount, s, charIndex, charCount);\n return bytes;\n case 'Unicode':\n bytes = this.getBytesOfUnicodeEncoding(byteCount, s, charIndex, charCount);\n return bytes;\n default:\n bytes = this.getBytesOfAnsiEncoding(byteCount, s, charIndex, charCount);\n return bytes;\n }\n };\n /**\n * Decodes a sequence of bytes from the specified ArrayBuffer into the string.\n * @param {ArrayBuffer} bytes- The ArrayBuffer containing the sequence of bytes to decode.\n * @param {number} index- The index of the first byte to decode.\n * @param {number} count- The number of bytes to decode.\n * @returns {string} - The string that contains the resulting set of characters.\n */\n Encoding.prototype.getString = function (bytes, index, count) {\n validateNullOrUndefined(bytes, 'bytes');\n validateNullOrUndefined(index, 'index');\n validateNullOrUndefined(count, 'count');\n if (index < 0 || count < 0) {\n throw new RangeError('Argument Out Of Range Exception: index or count is less than zero');\n }\n if (bytes.byteLength - index < count) {\n throw new RangeError('Argument Out Of Range Exception: index and count do not denote a valid range in bytes');\n }\n if (bytes.byteLength === 0 || count === 0) {\n return '';\n }\n if (this.type === null || this.type === undefined) {\n this.type = 'Ansi';\n }\n var out = '';\n var byteCal = new Uint8Array(bytes);\n switch (this.type) {\n case 'Utf8':\n var s = this.getStringOfUtf8Encoding(byteCal, index, count);\n return s;\n case 'Unicode':\n var byteUnicode = new Uint16Array(bytes);\n out = this.getStringofUnicodeEncoding(byteUnicode, index, count);\n return out;\n default:\n var j = index;\n for (var i = 0; i < count; i++) {\n var c = byteCal[j];\n out += String.fromCharCode(c); // 1 byte(ASCII) character \n j++;\n }\n return out;\n }\n };\n Encoding.prototype.getBytesOfAnsiEncoding = function (byteCount, s, charIndex, charCount) {\n var bytes = new ArrayBuffer(byteCount);\n var bufview = new Uint8Array(bytes);\n var k = 0;\n for (var i = 0; i < charCount; i++) {\n var charcode = s.charCodeAt(charIndex++);\n if (charcode < 0x800) {\n bufview[k] = charcode;\n }\n else {\n bufview[k] = 63; //replacement character '?'\n }\n k++;\n }\n return bytes;\n };\n Encoding.prototype.getBytesOfUtf8Encoding = function (byteCount, s, charIndex, charCount) {\n var bytes = new ArrayBuffer(byteCount);\n var uint = new Uint8Array(bytes);\n var index = charIndex;\n var j = 0;\n for (var i = 0; i < charCount; i++) {\n var charcode = s.charCodeAt(index);\n if (charcode <= 0x7F) { // 1 byte character 2^7\n uint[j] = charcode;\n }\n else if (charcode < 0x800) { // 2 byte character 2^11\n uint[j] = 0xc0 | (charcode >> 6);\n uint[++j] = 0x80 | (charcode & 0x3f);\n }\n else if ((charcode < 0xd800 || charcode >= 0xe000)) { // 3 byte character 2^16 \n uint[j] = 0xe0 | (charcode >> 12);\n uint[++j] = 0x80 | ((charcode >> 6) & 0x3f);\n uint[++j] = 0x80 | (charcode & 0x3f);\n }\n else {\n uint[j] = 0xef;\n uint[++j] = 0xbf;\n uint[++j] = 0xbd; // U+FFFE \"replacement character\"\n }\n ++j;\n ++index;\n }\n return bytes;\n };\n Encoding.prototype.getBytesOfUnicodeEncoding = function (byteCount, s, charIndex, charCount) {\n var bytes = new ArrayBuffer(byteCount);\n var uint16 = new Uint16Array(bytes);\n for (var i = 0; i < charCount; i++) {\n var charcode = s.charCodeAt(i);\n uint16[i] = charcode;\n }\n return bytes;\n };\n Encoding.prototype.getStringOfUtf8Encoding = function (byteCal, index, count) {\n var j = 0;\n var i = index;\n var s = '';\n for (j; j < count; j++) {\n var c = byteCal[i++];\n while (i > byteCal.length) {\n return s;\n }\n if (c > 127) {\n if (c > 191 && c < 224 && i < count) {\n c = (c & 31) << 6 | byteCal[i] & 63;\n }\n else if (c > 223 && c < 240 && i < byteCal.byteLength) {\n c = (c & 15) << 12 | (byteCal[i] & 63) << 6 | byteCal[++i] & 63;\n }\n else if (c > 239 && c < 248 && i < byteCal.byteLength) {\n c = (c & 7) << 18 | (byteCal[i] & 63) << 12 | (byteCal[++i] & 63) << 6 | byteCal[++i] & 63;\n }\n ++i;\n }\n s += String.fromCharCode(c); // 1 byte(ASCII) character \n }\n return s;\n };\n Encoding.prototype.getStringofUnicodeEncoding = function (byteUni, index, count) {\n if (count > byteUni.length) {\n throw new RangeError('ArgumentOutOfRange_Count');\n }\n var byte16 = new Uint16Array(count);\n var out = '';\n for (var i = 0; i < count && i < byteUni.length; i++) {\n byte16[i] = byteUni[index++];\n }\n out = String.fromCharCode.apply(null, byte16);\n return out;\n };\n /**\n * To clear the encoding instance\n * @return {void}\n */\n Encoding.prototype.destroy = function () {\n this.emitBOM = undefined;\n this.encodingType = undefined;\n };\n return Encoding;\n}());\nexport { Encoding };\n/**\n * To check the object is null or undefined and throw error if it is null or undefined\n * @param {Object} value - object to check is null or undefined\n * @return {boolean}\n * @throws {ArgumentException} - if the value is null or undefined\n * @private\n */\nexport function validateNullOrUndefined(value, message) {\n if (value === null || value === undefined) {\n throw new Error('ArgumentException: ' + message + ' cannot be null or undefined');\n }\n}\n","import { RectOption, CircleOption } from '../utils/helper';\nimport { PathOption, Rect } from '@syncfusion/ej2-svg-base';\n/**\n * Create scrollbar svg.\n * @return {void}\n */\nexport function createScrollSvg(scrollbar, renderer) {\n var rect = scrollbar.axis.rect;\n var isHorizontalAxis = scrollbar.axis.orientation === 'Horizontal';\n scrollbar.svgObject = renderer.createSvg({\n id: scrollbar.component.element.id + '_' + 'scrollBar_svg' + scrollbar.axis.name,\n width: scrollbar.isVertical ? scrollbar.height : scrollbar.width,\n height: scrollbar.isVertical ? scrollbar.width : scrollbar.height,\n style: 'position: absolute;top: ' + ((scrollbar.axis.opposedPosition && isHorizontalAxis ? -16 : 0) + rect.y) + 'px;left: ' +\n (((scrollbar.axis.opposedPosition && !isHorizontalAxis ? 16 : 0) + rect.x) - (scrollbar.isVertical ? scrollbar.height : 0))\n + 'px;cursor:auto;'\n });\n scrollbar.elements.push(scrollbar.svgObject);\n}\n/**\n * Scrollbar elements renderer\n */\nvar ScrollElements = /** @class */ (function () {\n /**\n * Constructor for scroll elements\n * @param scrollObj\n */\n function ScrollElements(chart) {\n this.chartId = chart.element.id + '_';\n }\n /**\n * Render scrollbar elements.\n * @return {void}\n * @private\n */\n ScrollElements.prototype.renderElements = function (scroll, renderer) {\n var scrollGroup = renderer.createGroup({\n id: this.chartId + 'scrollBar_' + scroll.axis.name,\n transform: 'translate(' + ((scroll.isVertical && scroll.axis.isInversed) ? scroll.height : scroll.axis.isInversed ?\n scroll.width : '0') + ',' + (scroll.isVertical && scroll.axis.isInversed ? '0' : scroll.axis.isInversed ?\n scroll.height : scroll.isVertical ? scroll.width : '0') + ') rotate(' + (scroll.isVertical && scroll.axis.isInversed ?\n '90' : scroll.isVertical ? '270' : scroll.axis.isInversed ? '180' : '0') + ')'\n });\n var backRectGroup = renderer.createGroup({\n id: this.chartId + 'scrollBar_backRect_' + scroll.axis.name\n });\n var thumbGroup = renderer.createGroup({\n id: this.chartId + 'scrollBar_thumb_' + scroll.axis.name,\n transform: 'translate(0,0)'\n });\n this.backRect(scroll, renderer, backRectGroup);\n this.thumb(scroll, renderer, thumbGroup);\n this.renderCircle(scroll, renderer, thumbGroup);\n this.arrows(scroll, renderer, thumbGroup);\n this.thumbGrip(scroll, renderer, thumbGroup);\n scrollGroup.appendChild(backRectGroup);\n scrollGroup.appendChild(thumbGroup);\n return scrollGroup;\n };\n /**\n * Method to render back rectangle of scrollbar\n * @param scroll\n */\n ScrollElements.prototype.backRect = function (scroll, renderer, parent) {\n var style = scroll.scrollbarThemeStyle;\n var backRectEle = renderer.drawRectangle(new RectOption(this.chartId + 'scrollBarBackRect_' + scroll.axis.name, style.backRect, { width: 1, color: style.backRect }, 1, new Rect(0, 0, scroll.width, scroll.height), 0, 0));\n parent.appendChild(backRectEle);\n };\n /**\n * Method to render arrows\n * @param scroll\n */\n ScrollElements.prototype.arrows = function (scroll, renderer, parent) {\n var style = scroll.scrollbarThemeStyle;\n var option = new PathOption(this.chartId + 'scrollBar_leftArrow_' + scroll.axis.name, style.arrow, 1, style.arrow, 1, '', '');\n this.leftArrowEle = renderer.drawPath(option);\n option.id = this.chartId + 'scrollBar_rightArrow_' + scroll.axis.name;\n this.rightArrowEle = renderer.drawPath(option);\n this.setArrowDirection(this.thumbRectX, this.thumbRectWidth, scroll.height);\n parent.appendChild(this.leftArrowEle);\n parent.appendChild(this.rightArrowEle);\n };\n /**\n * Methods to set the arrow width\n * @param thumbRectX\n * @param thumbRectWidth\n * @param height\n */\n ScrollElements.prototype.setArrowDirection = function (thumbRectX, thumbRectWidth, height) {\n var circleRadius = 8;\n var leftDirection = 'M ' + ((thumbRectX - circleRadius / 2) + 1) + ' ' + (height / 2) + ' ' + 'L ' +\n (thumbRectX - circleRadius / 2 + 6) + ' ' + 11 + ' ' + 'L ' + (thumbRectX - circleRadius / 2 + 6) + ' ' + 5 + ' Z';\n var rightDirection = 'M ' + ((thumbRectX + thumbRectWidth + circleRadius / 2) - 0.5) + ' ' + (height / 2)\n + ' ' + 'L ' + (thumbRectX + thumbRectWidth + circleRadius / 2 - 6) + ' ' + 11.5 + ' ' + 'L ' + (thumbRectX +\n thumbRectWidth + circleRadius / 2 - 6) + ' ' + 4.5 + ' Z';\n this.leftArrowEle.setAttribute('d', leftDirection);\n this.rightArrowEle.setAttribute('d', rightDirection);\n };\n /**\n * Method to render thumb\n * @param scroll\n * @param renderer\n * @param parent\n */\n ScrollElements.prototype.thumb = function (scroll, renderer, parent) {\n scroll.startX = this.thumbRectX;\n var style = scroll.scrollbarThemeStyle;\n this.slider = renderer.drawRectangle(new RectOption(this.chartId + 'scrollBarThumb_' + scroll.axis.name, style.thumb, { width: 1, color: '' }, 1, new Rect(this.thumbRectX, 0, this.thumbRectWidth, scroll.height)));\n parent.appendChild(this.slider);\n };\n /**\n * Method to render circles\n * @param scroll\n * @param renderer\n * @param parent\n */\n ScrollElements.prototype.renderCircle = function (scroll, renderer, parent) {\n var style = scroll.scrollbarThemeStyle;\n var option = new CircleOption(this.chartId + 'scrollBar_leftCircle_' + scroll.axis.name, style.circle, { width: 1, color: style.circle }, 1, this.thumbRectX, scroll.height / 2, 8);\n var scrollShadowEle = '
' + getLocaleText(parent, 'Content-Multiple-Delete') + '
')\n .replace('{0}', parent.selectedItems.length.toString());\n options.header = getLocaleText(parent, 'Header-Multiple-Delete');\n }\n else {\n options.content = '' + getLocaleText(parent, 'Content-Delete') + '
';\n options.header = getLocaleText(parent, 'Header-Delete');\n }\n options.buttons = [\n {\n buttonModel: { isPrimary: true, content: getLocaleText(parent, 'Button-Yes') },\n click: function (e) {\n if (e.type === 'keydown') {\n return;\n }\n onDeleteSubmit(parent);\n },\n },\n {\n buttonModel: { content: getLocaleText(parent, 'Button-No') },\n click: function () {\n parent.dialogObj.hide();\n },\n }\n ];\n break;\n case 'Rename':\n options.header = getLocaleText(parent, 'Header-Rename');\n options.content = '';\n options.buttons = [\n {\n buttonModel: { isPrimary: true, content: getLocaleText(parent, 'Button-Save') },\n click: function (e) {\n if (e.type === 'keydown') {\n return;\n }\n onReSubmit(parent);\n },\n }\n ];\n options.open = onRenameDialogOpen.bind(this, parent);\n break;\n case 'DuplicateItems':\n parent.replaceItems = replaceItems;\n options.header = getLocaleText(parent, 'Header-Duplicate');\n // tslint:disable-next-line\n options.content = '' + parent.replaceItems[parent.fileLength].substring(parent.replaceItems[parent.fileLength].lastIndexOf('/') + 1) + getLocaleText(parent, 'Content-Duplicate') + '
';\n options.buttons = [\n {\n buttonModel: { isPrimary: true, content: getLocaleText(parent, 'Button-Yes') },\n click: function (e) {\n if (e.type === 'keydown') {\n return;\n }\n // tslint:disable-next-line\n var item = parent.replaceItems[parent.fileLength].substring(parent.replaceItems[parent.fileLength].lastIndexOf('/') + 1);\n parent.duplicateItems.push(item);\n parent.fileLength++;\n if (replaceItems[parent.fileLength]) {\n // tslint:disable-next-line\n parent.dialogObj.content = '' + parent.replaceItems[parent.fileLength].substring(parent.replaceItems[parent.fileLength].lastIndexOf('/') + 1) + getLocaleText(parent, 'Content-Duplicate') + '
';\n parent.dialogObj.show();\n }\n else {\n parent.dialogObj.hide();\n paste(\n // tslint:disable-next-line\n parent, parent.targetPath, parent.selectedNodes, parent.path, parent.fileAction, parent.navigationpaneModule, parent.duplicateItems);\n }\n },\n },\n {\n buttonModel: { content: getLocaleText(parent, 'Button-No') },\n click: function () {\n parent.fileLength++;\n if (replaceItems[parent.fileLength]) {\n // tslint:disable-next-line\n var item = parent.replaceItems[parent.fileLength].substring(parent.replaceItems[parent.fileLength].lastIndexOf('/') + 1);\n // tslint:disable-next-line\n parent.dialogObj.content = '' + item + ' already exists. Are you sure you want to replace it ?
';\n parent.dialogObj.show();\n }\n else {\n parent.dialogObj.hide();\n if (parent.duplicateItems.length !== 0) {\n paste(\n // tslint:disable-next-line\n parent, parent.targetPath, parent.duplicateItems, parent.path, parent.fileAction, parent.navigationpaneModule, parent.duplicateItems);\n }\n }\n },\n }\n ];\n break;\n case 'GetDetails':\n var intl = new Internationalization();\n var parseDate = intl.parseDate(details.modified, { format: 'MM/dd/yyy hh:mm:ss' });\n var formattedString = intl.formatDate(new Date(details.modified), { format: 'MMMM dd, yyyy HH:mm:ss' });\n options.header = details.name;\n options.content = '| ' + getLocaleText(parent, 'Type') + ' | ' + (details.isFile ? 'File' : 'Folder') + ' |
| ' + getLocaleText(parent, 'Size') + ' | ' + details.size + ' |
| ' + getLocaleText(parent, 'Location') + ' | ' + details.location + ' |
| ' + getLocaleText(parent, 'Modified') + ' | '\n + formattedString + ' |
| ' + getLocaleText(parent, 'Type')\n + ': | Multiple Types |
| ' + getLocaleText(parent, 'Size') + ': | ' +\n details.size + ' |
| ' + getLocaleText(parent, 'Location') +\n ': | '\n + location_1 + ' |
' + event_1.error.message + '
';\n options.buttons = [\n {\n buttonModel: { isPrimary: true, content: getLocaleText(parent, 'Button-Ok') },\n click: function (e) {\n if (e.type === 'keydown') {\n return;\n }\n parent.dialogObj.hide();\n },\n }\n ];\n break;\n }\n return options;\n}\n/* istanbul ignore next */\nfunction getFilesName(data) {\n var parent = createElement('div', { id: 'uploadDialog' });\n var ulElement = createElement('ul');\n var filesData = data.isModified ? data.modifiedFilesData : data.filesData;\n for (var fileCount = 0; fileCount < filesData.length; fileCount++) {\n var liElement = createElement('li', { className: 'dialogFiles' });\n liElement.innerHTML = filesData[fileCount].name;\n ulElement.appendChild(liElement);\n }\n parent.appendChild(ulElement);\n var errorTag = createElement('div', { className: 'e-fe-error' });\n parent.appendChild(errorTag);\n return parent;\n}\nfunction changeOptions(parent, options) {\n parent.dialogObj.header = options.header;\n parent.dialogObj.content = options.content;\n parent.dialogObj.buttons = options.buttons;\n parent.dialogObj.enableRtl = parent.enableRtl;\n parent.dialogObj.open = options.open;\n parent.dialogObj.dataBind();\n parent.dialogObj.show();\n}\nfunction onSubmit(parent) {\n var ele = select('#newname', parent.dialogObj.element);\n onSubmitValidate(parent, ele);\n if (ele.parentElement.nextElementSibling.innerHTML !== '') {\n return;\n }\n createFolder(parent, ele.value);\n}\n/* istanbul ignore next */\nfunction onReSubmit(parent) {\n var ele = select('#rename', parent.dialogObj.element);\n onSubmitValidate(parent, ele);\n if (ele.parentElement.nextElementSibling.innerHTML !== '') {\n return;\n }\n var text = ele.value;\n parent.renameText = ele.value;\n if (parent.currentItemText === text) {\n parent.dialogObj.hide();\n return;\n }\n if (parent.selectedItems.length === 0) {\n parent.parentPath = parent.path;\n var treePath = parent.path.split('/');\n var newPath = parent.path.replace(treePath[treePath.length - 2] + '/', '');\n parent.setProperties({ path: newPath }, true);\n }\n if (parent.isFile) {\n var oldExtension = parent.currentItemText.substr(parent.currentItemText.lastIndexOf('.'));\n var newExtension = text.substr(text.lastIndexOf('.'));\n if (oldExtension !== newExtension) {\n if (isNOU(parent.extDialogObj)) {\n parent.extDialogObj = new Dialog({\n header: getLocaleText(parent, 'Header-Rename-Confirmation'),\n content: '' + getLocaleText(parent, 'Content-Rename-Confirmation') + '
',\n animationSettings: { effect: 'None' },\n target: '#' + parent.element.id,\n showCloseIcon: true,\n closeOnEscape: true,\n isModal: true,\n width: 350,\n buttons: [{\n buttonModel: { isPrimary: true, content: getLocaleText(parent, 'Button-Yes') },\n click: function () {\n parent.extDialogObj.hide();\n rename(parent, parent.renameText);\n },\n },\n {\n buttonModel: { content: getLocaleText(parent, 'Button-No') },\n click: function () {\n parent.extDialogObj.hide();\n parent.dialogObj.hide();\n },\n }],\n });\n parent.extDialogObj.appendTo('#' + parent.element.id + CLS.EXTN_DIALOG_ID);\n }\n else {\n parent.extDialogObj.show();\n }\n }\n else {\n rename(parent, text);\n }\n }\n else {\n rename(parent, text);\n }\n}\nfunction onDeleteSubmit(parent) {\n parent.dialogObj.hide();\n var delItems = activeElement('Delete', null, parent);\n parent.deleteHandler(delItems);\n}\nfunction onValidate(parent, ele) {\n if (/[/\\\\|*?\"<>:]/.test(ele.value)) {\n addInvalid(parent, ele);\n }\n else if (ele.value === '') {\n ele.parentElement.nextElementSibling.innerHTML = getLocaleText(parent, 'Validation-Empty');\n }\n else {\n ele.parentElement.nextElementSibling.innerHTML = '';\n }\n}\nfunction onSubmitValidate(parent, ele) {\n onValidate(parent, ele);\n var len = ele.value.length - 1;\n if (ele.value !== '' && ((ele.value.lastIndexOf('.') === len) || (ele.value.lastIndexOf(' ') === len))) {\n addInvalid(parent, ele);\n }\n}\nfunction addInvalid(parent, ele) {\n var error = getLocaleText(parent, 'Validation-Invalid').replace('{0}', '\"' + ele.value + '\"');\n ele.parentElement.nextElementSibling.innerHTML = error;\n}\nfunction getKeyCode(e) {\n var code;\n if (e.keyCode) {\n code = e.keyCode;\n }\n else if (e.which) {\n code = e.which;\n }\n else {\n code = e.charCode;\n }\n return code;\n}\nexport function createImageDialog(parent, header, imageUrl) {\n var content = createElement('div', { className: 'e-image-wrap' });\n var image = createElement('img', { className: 'e-image', attrs: { src: imageUrl } });\n content.appendChild(image);\n if (isNOU(parent.viewerObj)) {\n parent.viewerObj = new Dialog({\n header: header,\n content: content,\n animationSettings: { effect: 'None' },\n showCloseIcon: true,\n closeOnEscape: true,\n visible: true,\n isModal: true,\n width: '350px',\n height: '350px',\n target: '#' + parent.element.id,\n locale: parent.locale,\n enableResize: true,\n allowDragging: true,\n position: { X: 'center', Y: 'center' },\n enableRtl: parent.enableRtl,\n open: openImage.bind(this, parent),\n resizing: updateImage.bind(this, parent),\n resizeStop: updateImage.bind(this, parent)\n });\n parent.viewerObj.appendTo('#' + parent.element.id + CLS.IMG_DIALOG_ID);\n }\n else {\n parent.viewerObj.refresh();\n parent.viewerObj.header = header;\n parent.viewerObj.content = content;\n parent.viewerObj.enableRtl = parent.enableRtl;\n parent.viewerObj.dataBind();\n parent.viewerObj.show();\n }\n}\nfunction openImage(parent) {\n setTimeout(function () {\n if (parent.viewerObj) {\n parent.viewerObj.element.focus();\n }\n });\n updateImage(parent);\n}\nfunction updateImage(parent) {\n var content = select('.e-dlg-content', parent.viewerObj.element);\n var imgWrap = select('.e-image-wrap', parent.viewerObj.element);\n var cssObj = window.getComputedStyle(content, null);\n var paddingWidth = cssObj ? (2 * parseFloat(cssObj.paddingRight)) : 36;\n var paddingHeight = cssObj ? (2 * parseFloat(cssObj.paddingBottom)) : 20;\n imgWrap.style.width = (content.offsetWidth - paddingWidth) + 'px';\n imgWrap.style.height = (content.offsetHeight - paddingHeight) + 'px';\n}\n","import { print as printWindow, createElement, detach, classList } from '@syncfusion/ej2-base';\nimport { getPrintGridModel } from '../base/util';\nimport { Grid } from '../base/grid';\nimport * as events from '../base/constant';\nimport { Deferred } from '@syncfusion/ej2-data';\n/**\n * @hidden\n */\nexport function getCloneProperties() {\n return ['aggregates', 'allowGrouping', 'allowFiltering', 'allowMultiSorting', 'allowReordering', 'allowSorting',\n 'allowTextWrap', 'childGrid', 'columns', 'currentViewData', 'dataSource', 'detailTemplate', 'enableAltRow',\n 'enableColumnVirtualization', 'filterSettings', 'gridLines',\n 'groupSettings', 'height', 'locale', 'pageSettings', 'printMode', 'query', 'queryString', 'enableRtl',\n 'rowHeight', 'rowTemplate', 'sortSettings', 'textWrapSettings', 'allowPaging', 'hierarchyPrintMode', 'searchSettings'];\n}\n/**\n *\n * The `Print` module is used to handle print action.\n */\nvar Print = /** @class */ (function () {\n /**\n * Constructor for the Grid print module\n * @hidden\n */\n function Print(parent, scrollModule) {\n this.isAsyncPrint = false;\n this.defered = new Deferred();\n this.parent = parent;\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.contentReady, this.isContentReady(), this);\n this.parent.addEventListener(events.actionBegin, this.actionBegin.bind(this));\n this.parent.on(events.onEmpty, this.onEmpty.bind(this));\n this.parent.on(events.hierarchyPrint, this.hierarchyPrint, this);\n this.scrollModule = scrollModule;\n }\n Print.prototype.isContentReady = function () {\n var _this = this;\n if (this.isPrintGrid() && (this.parent.hierarchyPrintMode === 'None' || !this.parent.childGrid)) {\n return this.contentReady;\n }\n return function () {\n _this.defered.promise.then(function () {\n _this.contentReady();\n });\n if (_this.isPrintGrid()) {\n _this.hierarchyPrint();\n }\n };\n };\n Print.prototype.hierarchyPrint = function () {\n this.removeColGroup(this.parent);\n var printGridObj = window.printGridObj;\n if (printGridObj && !printGridObj.element.querySelector('[aria-busy=true')) {\n printGridObj.printModule.defered.resolve();\n }\n };\n /**\n * By default, prints all the Grid pages and hides the pager.\n * > You can customize print options using the\n * [`printMode`](./api-grid.html#printmode-string).\n * @return {void}\n */\n Print.prototype.print = function () {\n this.renderPrintGrid();\n this.printWind = window.open('', 'print', 'height=' + window.outerHeight + ',width=' + window.outerWidth + ',tabbar=no');\n this.printWind.moveTo(0, 0);\n this.printWind.resizeTo(screen.availWidth, screen.availHeight);\n };\n Print.prototype.onEmpty = function () {\n if (this.isPrintGrid()) {\n this.contentReady();\n }\n };\n Print.prototype.actionBegin = function () {\n if (this.isPrintGrid()) {\n this.isAsyncPrint = true;\n }\n };\n Print.prototype.renderPrintGrid = function () {\n var gObj = this.parent;\n var element = createElement('div', {\n id: this.parent.element.id + '_print', className: gObj.element.className + ' e-print-grid'\n });\n document.body.appendChild(element);\n var printGrid = new Grid(getPrintGridModel(gObj, gObj.hierarchyPrintMode));\n printGrid.query = gObj.getQuery().clone();\n window.printGridObj = printGrid;\n printGrid.isPrinting = true;\n var modules = printGrid.getInjectedModules();\n var injectedModues = gObj.getInjectedModules();\n if (!modules || modules.length !== injectedModues.length) {\n printGrid.setInjectedModules(injectedModues);\n }\n gObj.notify(events.printGridInit, { element: element, printgrid: printGrid });\n this.parent.log('exporting_begin', this.getModuleName());\n printGrid.appendTo(element);\n printGrid.registeredTemplate = this.parent.registeredTemplate;\n printGrid.trigger = gObj.trigger;\n };\n Print.prototype.contentReady = function () {\n if (this.isPrintGrid()) {\n var gObj = this.parent;\n if (this.isAsyncPrint) {\n this.printGrid();\n return;\n }\n var args = {\n requestType: 'print',\n element: gObj.element,\n selectedRows: gObj.getContentTable().querySelectorAll('tr[aria-selected=\"true\"]'),\n cancel: false,\n hierarchyPrintMode: gObj.hierarchyPrintMode\n };\n if (!this.isAsyncPrint) {\n gObj.trigger(events.beforePrint, args);\n }\n if (args.cancel) {\n detach(gObj.element);\n return;\n }\n if (!this.isAsyncPrint) {\n this.printGrid();\n }\n }\n };\n Print.prototype.printGrid = function () {\n var gObj = this.parent;\n // Height adjustment on print grid\n if (gObj.height !== 'auto') { // if scroller enabled\n var cssProps = this.scrollModule.getCssProperties();\n var contentDiv = gObj.element.querySelector('.e-content');\n var headerDiv = gObj.element.querySelector('.e-gridheader');\n contentDiv.style.height = 'auto';\n contentDiv.style.overflowY = 'auto';\n headerDiv.style[cssProps.padding] = '';\n headerDiv.firstElementChild.style[cssProps.border] = '';\n }\n // Grid alignment adjustment on grouping\n if (gObj.allowGrouping) {\n if (!gObj.groupSettings.columns.length) {\n gObj.element.querySelector('.e-groupdroparea').style.display = 'none';\n }\n else {\n this.removeColGroup(gObj);\n }\n }\n // hide horizontal scroll\n for (var _i = 0, _a = [].slice.call(gObj.element.querySelectorAll('.e-content')); _i < _a.length; _i++) {\n var element = _a[_i];\n element.style.overflowX = 'hidden';\n }\n // Hide the waiting popup\n var waitingPop = gObj.element.querySelectorAll('.e-spin-show');\n for (var _b = 0, _c = [].slice.call(waitingPop); _b < _c.length; _b++) {\n var element = _c[_b];\n classList(element, ['e-spin-hide'], ['e-spin-show']);\n }\n this.printGridElement(gObj);\n gObj.isPrinting = false;\n delete window.printGridObj;\n var args = {\n element: gObj.element\n };\n gObj.trigger(events.printComplete, args);\n this.parent.log('exporting_complete', this.getModuleName());\n };\n Print.prototype.printGridElement = function (gObj) {\n classList(gObj.element, ['e-print-grid-layout'], ['e-print-grid']);\n if (gObj.isPrinting) {\n detach(gObj.element);\n }\n this.printWind = printWindow(gObj.element, this.printWind);\n };\n Print.prototype.removeColGroup = function (gObj) {\n var depth = gObj.groupSettings.columns.length;\n var element = gObj.element;\n var id = '#' + gObj.element.id;\n if (!depth) {\n return;\n }\n var groupCaption = element.querySelectorAll(id + \"captioncell.e-groupcaption\");\n var colSpan = groupCaption[depth - 1].getAttribute('colspan');\n for (var i = 0; i < groupCaption.length; i++) {\n groupCaption[i].setAttribute('colspan', colSpan);\n }\n var colGroups = element.querySelectorAll(\"colgroup\" + id + \"colGroup\");\n for (var i = 0; i < colGroups.length; i++) {\n for (var j = 0; j < depth; j++) {\n colGroups[i].childNodes[j].style.display = 'none';\n }\n }\n };\n Print.prototype.isPrintGrid = function () {\n return this.parent.element.id.indexOf('_print') > 0 && this.parent.isPrinting;\n };\n /**\n * To destroy the print\n * @return {void}\n * @hidden\n */\n Print.prototype.destroy = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.contentReady, this.contentReady.bind(this));\n this.parent.removeEventListener(events.actionBegin, this.actionBegin.bind(this));\n this.parent.off(events.onEmpty, this.onEmpty.bind(this));\n this.parent.off(events.hierarchyPrint, this.hierarchyPrint);\n };\n /**\n * For internal use only - Get the module name.\n * @private\n */\n Print.prototype.getModuleName = function () {\n return 'print';\n };\n Print.printGridProp = getCloneProperties().concat([events.beforePrint, events.printComplete]);\n return Print;\n}());\nexport { Print };\n","import { ChildProperty, compile as baseTemplateComplier, setValue, Internationalization } from '@syncfusion/ej2-base';\nimport { extend as baseExtend, isNullOrUndefined, getValue, classList } from '@syncfusion/ej2-base';\nimport { setStyleAttribute, addClass, attributes, remove, createElement, removeClass } from '@syncfusion/ej2-base';\nimport { isObject } from '@syncfusion/ej2-base';\nimport { DataUtil, Query, DataManager, Predicate } from '@syncfusion/ej2-data';\nimport { Column } from '../models/column';\nimport { calculateRelativeBasedPosition, calculatePosition } from '@syncfusion/ej2-popups';\nimport { Print } from '../actions/print';\n//https://typescript.codeplex.com/discussions/401501\n/**\n * Function to check whether target object implement specific interface\n * @param {Object} target\n * @param {string} checkFor\n * @returns no\n * @hidden\n */\nexport function doesImplementInterface(target, checkFor) {\n /* tslint:disable:no-any */\n return target.prototype && checkFor in target.prototype;\n}\n/**\n * Function to get value from provided data\n * @param {string} field\n * @param {Object} data\n * @param {IColumn} column\n * @hidden\n */\nexport function valueAccessor(field, data, column) {\n field = isNullOrUndefined(field) ? '' : field;\n return DataUtil.getObject(field, data);\n}\n/**\n * The function used to update Dom using requestAnimationFrame.\n * @param {Function} fn - Function that contains the actual action\n * @return {PromiseDraggable
\n * \n * ```\n */\nvar Draggable = /** @class */ (function (_super) {\n __extends(Draggable, _super);\n function Draggable(element, options) {\n var _this = _super.call(this, options, element) || this;\n _this.dragLimit = Draggable_1.getDefaultPosition();\n _this.borderWidth = Draggable_1.getDefaultPosition();\n _this.padding = Draggable_1.getDefaultPosition();\n _this.diffX = 0;\n _this.prevLeft = 0;\n _this.prevTop = 0;\n _this.dragProcessStarted = false;\n /* tslint:disable no-any */\n _this.tapHoldTimer = 0;\n _this.externalInitialize = false;\n _this.diffY = 0;\n _this.droppables = {};\n _this.bind();\n return _this;\n }\n Draggable_1 = Draggable;\n Draggable.prototype.bind = function () {\n this.toggleEvents();\n if (Browser.isIE) {\n addClass([this.element], 'e-block-touch');\n }\n this.droppables[this.scope] = {};\n };\n Draggable.getDefaultPosition = function () {\n return extend({}, defaultPosition);\n };\n Draggable.prototype.toggleEvents = function (isUnWire) {\n var ele;\n if (!isUndefined(this.handle)) {\n ele = select(this.handle, this.element);\n }\n var handler = (this.enableTapHold && Browser.isDevice && Browser.isTouch) ? this.mobileInitialize : this.initialize;\n if (isUnWire) {\n EventHandler.remove(ele || this.element, Browser.touchStartEvent, handler);\n }\n else {\n EventHandler.add(ele || this.element, Browser.touchStartEvent, handler, this);\n }\n };\n /* istanbul ignore next */\n Draggable.prototype.mobileInitialize = function (evt) {\n var _this = this;\n var target = evt.currentTarget;\n this.tapHoldTimer = setTimeout(function () {\n _this.externalInitialize = true;\n _this.removeTapholdTimer();\n _this.initialize(evt, target);\n }, this.tapHoldThreshold);\n EventHandler.add(document, Browser.touchMoveEvent, this.removeTapholdTimer, this);\n };\n /* istanbul ignore next */\n Draggable.prototype.removeTapholdTimer = function () {\n clearTimeout(this.tapHoldTimer);\n EventHandler.remove(document, Browser.touchMoveEvent, this.removeTapholdTimer);\n };\n Draggable.prototype.initialize = function (evt, curTarget) {\n this.target = (evt.currentTarget || curTarget);\n this.dragProcessStarted = false;\n if (this.abort) {\n if (!isNullOrUndefined(closest(evt.target, this.abort))) {\n return;\n }\n }\n if (this.preventDefault && !isUndefined(evt.changedTouches)) {\n evt.preventDefault();\n }\n this.element.setAttribute('aria-grabbed', 'true');\n var intCoord = this.getCoordinates(evt);\n this.initialPosition = { x: intCoord.pageX, y: intCoord.pageY };\n if (!this.clone) {\n var pos = this.element.getBoundingClientRect();\n this.relativeXPosition = intCoord.pageX - pos.left;\n this.relativeYPosition = intCoord.pageY - pos.top;\n }\n if (this.externalInitialize) {\n this.intDragStart(evt);\n }\n else {\n EventHandler.add(document, Browser.touchMoveEvent, this.intDragStart, this);\n EventHandler.add(document, Browser.touchEndEvent, this.intDestroy, this);\n }\n this.toggleEvents(true);\n document.body.classList.add('e-prevent-select');\n this.externalInitialize = false;\n EventHandler.trigger(document.documentElement, Browser.touchStartEvent, evt);\n };\n Draggable.prototype.intDragStart = function (evt) {\n this.removeTapholdTimer();\n var isChangeTouch = !isUndefined(evt.changedTouches);\n if (isChangeTouch && (evt.changedTouches.length !== 1)) {\n return;\n }\n if (isChangeTouch) {\n evt.preventDefault();\n }\n var intCordinate = this.getCoordinates(evt);\n var pos;\n var styleProp = getComputedStyle(this.element);\n this.margin = {\n left: parseInt(styleProp.marginLeft, 10),\n top: parseInt(styleProp.marginTop, 10),\n right: parseInt(styleProp.marginRight, 10),\n bottom: parseInt(styleProp.marginBottom, 10),\n };\n var element = this.element;\n if (this.clone && this.dragTarget) {\n var intClosest = closest(evt.target, this.dragTarget);\n if (!isNullOrUndefined(intClosest)) {\n element = intClosest;\n }\n }\n this.offset = this.calculateParentPosition(element);\n this.position = this.getMousePosition(evt);\n var x = this.initialPosition.x - intCordinate.pageX;\n var y = this.initialPosition.y - intCordinate.pageY;\n var distance = Math.sqrt((x * x) + (y * y));\n if ((distance >= this.distance || this.externalInitialize)) {\n var ele = this.getHelperElement(evt);\n if (!ele || isNullOrUndefined(ele)) {\n return;\n }\n var dragTargetElement = this.helperElement = ele;\n this.parentClientRect = this.calculateParentPosition(dragTargetElement.offsetParent);\n if (this.dragStart) {\n var curTarget = this.getProperTargetElement(evt);\n this.trigger('dragStart', { event: evt, element: element, target: curTarget });\n }\n if (this.dragArea) {\n this.setDragArea();\n }\n else {\n this.dragLimit = { left: 0, right: 0, bottom: 0, top: 0 };\n this.borderWidth = { top: 0, left: 0 };\n }\n pos = { left: this.position.left - this.parentClientRect.left, top: this.position.top - this.parentClientRect.top };\n if (this.clone && !this.enableTailMode) {\n this.diffX = this.position.left - this.offset.left;\n this.diffY = this.position.top - this.offset.top;\n }\n var posValue = this.getProcessedPositionValue({\n top: (pos.top - this.diffY) + 'px',\n left: (pos.left - this.diffX) + 'px'\n });\n setStyleAttribute(dragTargetElement, this.getDragPosition({ position: 'absolute', left: posValue.left, top: posValue.top }));\n EventHandler.remove(document, Browser.touchMoveEvent, this.intDragStart);\n EventHandler.remove(document, Browser.touchEndEvent, this.intDestroy);\n if (isVisible(dragTargetElement)) {\n EventHandler.add(document, Browser.touchMoveEvent, this.intDrag, this);\n EventHandler.add(document, Browser.touchEndEvent, this.intDragStop, this);\n this.setGlobalDroppables(false, this.element, dragTargetElement);\n }\n else {\n this.toggleEvents();\n document.body.classList.remove('e-prevent-select');\n }\n }\n };\n Draggable.prototype.elementInViewport = function (el) {\n this.top = el.offsetTop;\n this.left = el.offsetLeft;\n this.width = el.offsetWidth;\n this.height = el.offsetHeight;\n while (el.offsetParent) {\n el = el.offsetParent;\n this.top += el.offsetTop;\n this.left += el.offsetLeft;\n }\n return (this.top >= window.pageYOffset &&\n this.left >= window.pageXOffset &&\n (this.top + this.height) <= (window.pageYOffset + window.innerHeight) &&\n (this.left + this.width) <= (window.pageXOffset + window.innerWidth));\n };\n Draggable.prototype.getProcessedPositionValue = function (value) {\n if (this.queryPositionInfo) {\n return this.queryPositionInfo(value);\n }\n return value;\n };\n Draggable.prototype.calculateParentPosition = function (ele) {\n if (isNullOrUndefined(ele)) {\n return { left: 0, top: 0 };\n }\n var rect = ele.getBoundingClientRect();\n var style = getComputedStyle(ele);\n return {\n left: (rect.left + window.pageXOffset) - parseInt(style.marginLeft, 10),\n top: (rect.top + window.pageYOffset) - parseInt(style.marginTop, 10)\n };\n };\n Draggable.prototype.intDrag = function (evt) {\n if (!isUndefined(evt.changedTouches) && (evt.changedTouches.length !== 1)) {\n return;\n }\n var left;\n var top;\n this.position = this.getMousePosition(evt);\n var docHeight = this.getDocumentWidthHeight('Height');\n if (docHeight < this.position.top) {\n this.position.top = docHeight;\n }\n var docWidth = this.getDocumentWidthHeight('Width');\n if (docWidth < this.position.left) {\n this.position.left = docWidth;\n }\n if (this.drag) {\n var curTarget = this.getProperTargetElement(evt);\n this.trigger('drag', { event: evt, element: this.element, target: curTarget });\n }\n var eleObj = this.checkTargetElement(evt);\n if (eleObj.target && eleObj.instance) {\n /* tslint:disable no-any */\n eleObj.instance.dragData[this.scope] = this.droppables[this.scope];\n eleObj.instance.intOver(evt, eleObj.target);\n this.hoverObject = eleObj;\n }\n else if (this.hoverObject) {\n this.hoverObject.instance.intOut(evt, eleObj.target);\n this.hoverObject.instance.dragData[this.scope] = null;\n this.hoverObject = null;\n }\n var helperElement = this.droppables[this.scope].helper;\n this.parentClientRect = this.calculateParentPosition(this.helperElement.offsetParent);\n var tLeft = this.parentClientRect.left;\n var tTop = this.parentClientRect.top;\n var intCoord = this.getCoordinates(evt);\n var pagex = intCoord.pageX;\n var pagey = intCoord.pageY;\n var dLeft = this.position.left - this.diffX;\n var dTop = this.position.top - this.diffY;\n if (this.dragArea) {\n var styles = getComputedStyle(helperElement);\n if (this.pageX !== pagex || this.skipDistanceCheck) {\n var helperWidth = helperElement.offsetWidth + (parseFloat(styles.marginLeft)\n + parseFloat(styles.marginRight));\n if (this.dragLimit.left + window.scrollX > dLeft) {\n left = this.dragLimit.left;\n }\n else if (this.dragLimit.right + window.scrollX < dLeft + helperWidth) {\n left = this.dragLimit.right - helperWidth;\n }\n else {\n left = dLeft;\n }\n }\n if (this.pageY !== pagey || this.skipDistanceCheck) {\n var helperHeight = helperElement.offsetHeight + (parseFloat(styles.marginTop)\n + parseFloat(styles.marginBottom));\n if (this.dragLimit.top + window.scrollY > dTop) {\n top = this.dragLimit.top;\n }\n else if (this.dragLimit.bottom + window.scrollY < dTop + helperHeight) {\n top = this.dragLimit.bottom - helperHeight;\n }\n else {\n top = dTop;\n }\n }\n }\n else {\n left = dLeft;\n top = dTop;\n }\n var iTop = tTop + this.borderWidth.top;\n var iLeft = tLeft + this.borderWidth.left;\n if (this.dragProcessStarted) {\n if (isNullOrUndefined(top)) {\n top = this.prevTop;\n }\n if (isNullOrUndefined(left)) {\n left = this.prevLeft;\n }\n }\n var dragValue = this.getProcessedPositionValue({ top: (top - iTop) + 'px', left: (left - iLeft) + 'px' });\n setStyleAttribute(helperElement, this.getDragPosition(dragValue));\n if (!this.elementInViewport(helperElement) && this.enableAutoScroll) {\n this.helperElement.scrollIntoView();\n }\n this.dragProcessStarted = true;\n this.prevLeft = left;\n this.prevTop = top;\n this.position.left = left;\n this.position.top = top;\n this.pageX = pagex;\n this.pageY = pagey;\n };\n Draggable.prototype.getDragPosition = function (dragValue) {\n var temp = extend({}, dragValue);\n if (this.axis) {\n if (this.axis === 'x') {\n delete temp.top;\n }\n else if (this.axis === 'y') {\n delete temp.left;\n }\n }\n return temp;\n };\n Draggable.prototype.getDocumentWidthHeight = function (str) {\n var docBody = document.body;\n var docEle = document.documentElement;\n var returnValue = Math.max(docBody['scroll' + str], docEle['scroll' + str], docBody['offset' + str], docEle['offset' + str], docEle['client' + str]);\n return returnValue;\n };\n Draggable.prototype.intDragStop = function (evt) {\n this.dragProcessStarted = false;\n if (!isUndefined(evt.changedTouches) && (evt.changedTouches.length !== 1)) {\n return;\n }\n var type = ['touchend', 'pointerup', 'mouseup'];\n if (type.indexOf(evt.type) !== -1) {\n if (this.dragStop) {\n var curTarget = this.getProperTargetElement(evt);\n this.trigger('dragStop', { event: evt, element: this.element, target: curTarget, helper: this.helperElement });\n }\n this.intDestroy(evt);\n }\n else {\n this.element.setAttribute('aria-grabbed', 'false');\n }\n var eleObj = this.checkTargetElement(evt);\n if (eleObj.target && eleObj.instance) {\n eleObj.instance.dragStopCalled = true;\n eleObj.instance.dragData[this.scope] = this.droppables[this.scope];\n eleObj.instance.intDrop(evt, eleObj.target);\n }\n this.setGlobalDroppables(true);\n document.body.classList.remove('e-prevent-select');\n };\n Draggable.prototype.intDestroy = function (evt) {\n this.dragProcessStarted = false;\n this.toggleEvents();\n document.body.classList.remove('e-prevent-select');\n this.element.setAttribute('aria-grabbed', 'false');\n EventHandler.remove(document, Browser.touchMoveEvent, this.intDragStart);\n EventHandler.remove(document, Browser.touchEndEvent, this.intDragStop);\n EventHandler.remove(document, Browser.touchEndEvent, this.intDestroy);\n EventHandler.remove(document, Browser.touchMoveEvent, this.intDrag);\n };\n // triggers when property changed\n Draggable.prototype.onPropertyChanged = function (newProp, oldProp) {\n //No Code to handle\n };\n Draggable.prototype.getModuleName = function () {\n return 'draggable';\n };\n Draggable.prototype.setDragArea = function () {\n var eleWidthBound;\n var eleHeightBound;\n var top = 0;\n var left = 0;\n var ele;\n var type = typeof this.dragArea;\n if (type === 'string') {\n ele = select(this.dragArea);\n }\n else {\n ele = this.dragArea;\n }\n if (ele) {\n var elementArea = ele.getBoundingClientRect();\n eleWidthBound = elementArea.width ? elementArea.width : elementArea.right - elementArea.left;\n eleHeightBound = elementArea.height ? elementArea.height : elementArea.bottom - elementArea.top;\n var keys = ['Top', 'Left', 'Bottom', 'Right'];\n var styles = getComputedStyle(ele);\n for (var i = 0; i < keys.length; i++) {\n var key = keys[i];\n var tborder = styles['border' + key + 'Width'];\n var tpadding = styles['padding' + key];\n var lowerKey = key.toLowerCase();\n this.borderWidth[lowerKey] = isNaN(parseFloat(tborder)) ? 0 : parseFloat(tborder);\n this.padding[lowerKey] = isNaN(parseFloat(tpadding)) ? 0 : parseFloat(tpadding);\n }\n top = elementArea.top;\n left = elementArea.left;\n this.dragLimit.left = left + this.borderWidth.left + this.padding.left;\n this.dragLimit.top = top + this.borderWidth.top + this.padding.top;\n this.dragLimit.right = left + eleWidthBound - (this.borderWidth.right + this.padding.right);\n this.dragLimit.bottom = top + eleHeightBound - (this.borderWidth.bottom + this.padding.bottom);\n }\n };\n Draggable.prototype.getProperTargetElement = function (evt) {\n var intCoord = this.getCoordinates(evt);\n var ele;\n var prevStyle = this.helperElement.style.display || '';\n if (compareElementParent(evt.target, this.helperElement) || evt.type.indexOf('touch') !== -1) {\n this.helperElement.style.display = 'none';\n ele = document.elementFromPoint(intCoord.clientX, intCoord.clientY);\n this.helperElement.style.display = prevStyle;\n }\n else {\n ele = evt.target;\n }\n return ele;\n };\n Draggable.prototype.getMousePosition = function (evt) {\n var intCoord = this.getCoordinates(evt);\n var pageX = this.clone ? intCoord.pageX : (intCoord.pageX + window.scrollX) - this.relativeXPosition;\n var pageY = this.clone ? intCoord.pageY : (intCoord.pageY + window.scrollY) - this.relativeYPosition;\n return {\n left: pageX - (this.margin.left + this.cursorAt.left),\n top: pageY - (this.margin.top + this.cursorAt.top)\n };\n };\n Draggable.prototype.getCoordinates = function (evt) {\n if (evt.type.indexOf('touch') > -1) {\n return evt.changedTouches[0];\n }\n return evt;\n };\n Draggable.prototype.getHelperElement = function (evt) {\n var element;\n if (this.clone) {\n if (this.helper) {\n element = this.helper({ sender: evt, element: this.target });\n }\n else {\n element = createElement('div', { className: 'e-drag-helper e-block-touch', innerHTML: 'Draggable' });\n document.body.appendChild(element);\n }\n }\n else {\n element = this.element;\n }\n return element;\n };\n Draggable.prototype.setGlobalDroppables = function (reset, drag, helper) {\n this.droppables[this.scope] = reset ? null : {\n draggable: drag,\n helper: helper,\n draggedElement: this.element\n };\n };\n Draggable.prototype.checkTargetElement = function (evt) {\n var target = this.getProperTargetElement(evt);\n var dropIns = this.getDropInstance(target);\n if (!dropIns && target && !isNullOrUndefined(target.parentNode)) {\n var parent_1 = closest(target.parentNode, '.e-droppable') || target.parentElement;\n if (parent_1) {\n dropIns = this.getDropInstance(parent_1);\n }\n }\n return { target: target, instance: dropIns };\n };\n Draggable.prototype.getDropInstance = function (ele) {\n var name = 'getModuleName';\n var drop;\n var eleInst = ele && ele.ej2_instances;\n if (eleInst) {\n for (var _i = 0, eleInst_1 = eleInst; _i < eleInst_1.length; _i++) {\n var inst = eleInst_1[_i];\n if (inst[name]() === 'droppable') {\n drop = inst;\n break;\n }\n }\n }\n return drop;\n };\n Draggable.prototype.destroy = function () {\n this.toggleEvents(true);\n _super.prototype.destroy.call(this);\n };\n var Draggable_1;\n __decorate([\n Complex({}, Position)\n ], Draggable.prototype, \"cursorAt\", void 0);\n __decorate([\n Property(true)\n ], Draggable.prototype, \"clone\", void 0);\n __decorate([\n Property()\n ], Draggable.prototype, \"dragArea\", void 0);\n __decorate([\n Event()\n ], Draggable.prototype, \"drag\", void 0);\n __decorate([\n Event()\n ], Draggable.prototype, \"dragStart\", void 0);\n __decorate([\n Event()\n ], Draggable.prototype, \"dragStop\", void 0);\n __decorate([\n Property(1)\n ], Draggable.prototype, \"distance\", void 0);\n __decorate([\n Property()\n ], Draggable.prototype, \"handle\", void 0);\n __decorate([\n Property()\n ], Draggable.prototype, \"abort\", void 0);\n __decorate([\n Property()\n ], Draggable.prototype, \"helper\", void 0);\n __decorate([\n Property('default')\n ], Draggable.prototype, \"scope\", void 0);\n __decorate([\n Property('')\n ], Draggable.prototype, \"dragTarget\", void 0);\n __decorate([\n Property()\n ], Draggable.prototype, \"axis\", void 0);\n __decorate([\n Property()\n ], Draggable.prototype, \"queryPositionInfo\", void 0);\n __decorate([\n Property(false)\n ], Draggable.prototype, \"enableTailMode\", void 0);\n __decorate([\n Property(false)\n ], Draggable.prototype, \"skipDistanceCheck\", void 0);\n __decorate([\n Property(true)\n ], Draggable.prototype, \"preventDefault\", void 0);\n __decorate([\n Property(false)\n ], Draggable.prototype, \"enableAutoScroll\", void 0);\n __decorate([\n Property(false)\n ], Draggable.prototype, \"enableTapHold\", void 0);\n __decorate([\n Property(750)\n ], Draggable.prototype, \"tapHoldThreshold\", void 0);\n Draggable = Draggable_1 = __decorate([\n NotifyPropertyChanges\n ], Draggable);\n return Draggable;\n}(Base));\nexport { Draggable };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Base } from './base';\nimport { Browser } from './browser';\nimport { isVisible, matches } from './dom';\nimport { Property, NotifyPropertyChanges, Event } from './notify-property-change';\nimport { EventHandler } from './event-handler';\nimport { compareElementParent } from './util';\n/**\n * Droppable Module provides support to enable droppable functionality in Dom Elements.\n * ```html\n * Droppable
\n * \n * ```\n */\nvar Droppable = /** @class */ (function (_super) {\n __extends(Droppable, _super);\n function Droppable(element, options) {\n var _this = _super.call(this, options, element) || this;\n _this.mouseOver = false;\n _this.dragData = {};\n _this.dragStopCalled = false;\n _this.bind();\n return _this;\n }\n Droppable.prototype.bind = function () {\n this.wireEvents();\n };\n Droppable.prototype.wireEvents = function () {\n EventHandler.add(this.element, Browser.touchEndEvent, this.intDrop, this);\n };\n // triggers when property changed\n Droppable.prototype.onPropertyChanged = function (newProp, oldProp) {\n //No Code to handle\n };\n Droppable.prototype.getModuleName = function () {\n return 'droppable';\n };\n Droppable.prototype.intOver = function (event, element) {\n if (!this.mouseOver) {\n var drag = this.dragData[this.scope];\n this.trigger('over', { event: event, target: element, dragData: drag });\n this.mouseOver = true;\n }\n };\n Droppable.prototype.intOut = function (event, element) {\n if (this.mouseOver) {\n this.trigger('out', { evt: event, target: element });\n this.mouseOver = false;\n }\n };\n Droppable.prototype.intDrop = function (evt, element) {\n if (!this.dragStopCalled) {\n return;\n }\n else {\n this.dragStopCalled = false;\n }\n var accept = true;\n var drag = this.dragData[this.scope];\n var isDrag = drag ? (drag.helper && isVisible(drag.helper)) : false;\n var area;\n if (isDrag) {\n area = this.isDropArea(evt, drag.helper, element);\n if (this.accept) {\n accept = matches(drag.helper, this.accept);\n }\n }\n if (isDrag && this.drop && area.canDrop && accept) {\n this.trigger('drop', { event: evt, target: area.target, droppedElement: drag.helper, dragData: drag });\n }\n this.mouseOver = false;\n };\n Droppable.prototype.isDropArea = function (evt, helper, element) {\n var area = { canDrop: true, target: element || evt.target };\n var isTouch = evt.type === 'touchend';\n if (isTouch || area.target === helper) {\n helper.style.display = 'none';\n var coord = isTouch ? (evt.changedTouches[0]) : evt;\n var ele = document.elementFromPoint(coord.clientX, coord.clientY);\n area.canDrop = false;\n area.canDrop = compareElementParent(ele, this.element);\n if (area.canDrop) {\n area.target = ele;\n }\n helper.style.display = '';\n }\n return area;\n };\n Droppable.prototype.destroy = function () {\n EventHandler.remove(this.element, Browser.touchEndEvent, this.intDrop);\n _super.prototype.destroy.call(this);\n };\n __decorate([\n Property()\n ], Droppable.prototype, \"accept\", void 0);\n __decorate([\n Property('default')\n ], Droppable.prototype, \"scope\", void 0);\n __decorate([\n Event()\n ], Droppable.prototype, \"drop\", void 0);\n __decorate([\n Event()\n ], Droppable.prototype, \"over\", void 0);\n __decorate([\n Event()\n ], Droppable.prototype, \"out\", void 0);\n Droppable = __decorate([\n NotifyPropertyChanges\n ], Droppable);\n return Droppable;\n}(Base));\nexport { Droppable };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, NotifyPropertyChanges, Event } from './notify-property-change';\nimport { Base } from './base';\nvar keyCode = {\n 'backspace': 8,\n 'tab': 9,\n 'enter': 13,\n 'shift': 16,\n 'control': 17,\n 'alt': 18,\n 'pause': 19,\n 'capslock': 20,\n 'space': 32,\n 'escape': 27,\n 'pageup': 33,\n 'pagedown': 34,\n 'end': 35,\n 'home': 36,\n 'leftarrow': 37,\n 'uparrow': 38,\n 'rightarrow': 39,\n 'downarrow': 40,\n 'insert': 45,\n 'delete': 46,\n 'f1': 112,\n 'f2': 113,\n 'f3': 114,\n 'f4': 115,\n 'f5': 116,\n 'f6': 117,\n 'f7': 118,\n 'f8': 119,\n 'f9': 120,\n 'f10': 121,\n 'f11': 122,\n 'f12': 123,\n 'semicolon': 186,\n 'plus': 187,\n 'comma': 188,\n 'minus': 189,\n 'dot': 190,\n 'forwardslash': 191,\n 'graveaccent': 192,\n 'openbracket': 219,\n 'backslash': 220,\n 'closebracket': 221,\n 'singlequote': 222\n};\n/**\n * KeyboardEvents class enables you to bind key action desired key combinations for ex., Ctrl+A, Delete, Alt+Space etc.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar Calendar = /** @class */ (function (_super) {\n __extends(Calendar, _super);\n /**\n * Initialized new instance of Calendar Class.\n * Constructor for creating the widget\n * @param {CalendarModel} options?\n * @param {string|HTMLElement} element?\n */\n function Calendar(options, element) {\n return _super.call(this, options, element) || this;\n }\n /**\n * To Initialize the control rendering.\n * @returns void\n * @private\n */\n Calendar.prototype.render = function () {\n if (this.calendarMode === 'Islamic' && this.islamicModule === undefined) {\n throwError('Requires the injectable Islamic modules to render Calendar in Islamic mode');\n }\n if (this.isMultiSelection && typeof this.values === 'object' && !isNullOrUndefined(this.values) && this.values.length > 0) {\n var tempValues = [];\n var copyValues = [];\n for (var limit = 0; limit < this.values.length; limit++) {\n if (tempValues.indexOf(+this.values[limit]) === -1) {\n tempValues.push(+this.values[limit]);\n copyValues.push(this.values[limit]);\n }\n }\n this.setProperties({ values: copyValues }, true);\n for (var index = 0; index < this.values.length; index++) {\n if (!this.checkDateValue(this.values[index])) {\n if (typeof (this.values[index]) === 'string' && this.checkDateValue(new Date(this.checkValue(this.values[index])))) {\n var copyDate = new Date(this.checkValue(this.values[index]));\n this.values.splice(index, 1);\n this.values.splice(index, 0, copyDate);\n }\n else {\n this.values.splice(index, 1);\n }\n }\n }\n this.setProperties({ value: this.values[this.values.length - 1] }, true);\n this.previousValues = this.values.length;\n }\n this.validateDate();\n this.minMaxUpdate();\n _super.prototype.render.call(this);\n if (this.getModuleName() === 'calendar') {\n var form = closest(this.element, 'form');\n if (form) {\n EventHandler.add(form, 'reset', this.formResetHandler.bind(this));\n }\n }\n };\n Calendar.prototype.formResetHandler = function () {\n this.setProperties({ value: null }, true);\n };\n Calendar.prototype.validateDate = function () {\n if (typeof this.value === 'string') {\n this.setProperties({ value: this.checkDateValue(new Date(this.checkValue(this.value))) }, true); // persist the value property.\n }\n _super.prototype.validateDate.call(this, this.value);\n if (!isNullOrUndefined(this.value) && this.min <= this.max && this.value >= this.min && this.value <= this.max) {\n this.currentDate = new Date(this.checkValue(this.value));\n }\n if (isNaN(+this.value)) {\n this.setProperties({ value: null }, true);\n }\n };\n Calendar.prototype.minMaxUpdate = function () {\n if (this.getModuleName() === 'calendar') {\n if (!isNullOrUndefined(this.value) && this.value <= this.min && this.min <= this.max) {\n this.setProperties({ value: this.min }, true);\n this.changedArgs = { value: this.value };\n }\n else {\n if (!isNullOrUndefined(this.value) && this.value >= this.max && this.min <= this.max) {\n this.setProperties({ value: this.max }, true);\n this.changedArgs = { value: this.value };\n }\n }\n }\n if (this.getModuleName() !== 'calendar' && !isNullOrUndefined(this.value)) {\n if (!isNullOrUndefined(this.value) && this.value < this.min && this.min <= this.max) {\n _super.prototype.minMaxUpdate.call(this, this.min);\n }\n else {\n if (!isNullOrUndefined(this.value) && this.value > this.max && this.min <= this.max) {\n _super.prototype.minMaxUpdate.call(this, this.max);\n }\n }\n }\n else {\n _super.prototype.minMaxUpdate.call(this, this.value);\n }\n };\n Calendar.prototype.todayButtonClick = function () {\n if (this.showTodayButton) {\n var tempValue = new Date();\n if (this.value) {\n tempValue.setHours(this.value.getHours());\n tempValue.setMinutes(this.value.getMinutes());\n tempValue.setSeconds(this.value.getSeconds());\n tempValue.setMilliseconds(this.value.getMilliseconds());\n }\n else {\n tempValue = new Date(tempValue.getFullYear(), tempValue.getMonth(), tempValue.getDate(), 0, 0, 0, 0);\n }\n this.setProperties({ value: tempValue }, true);\n if (this.isMultiSelection) {\n var copyValues = this.copyValues(this.values);\n if (!_super.prototype.checkPresentDate.call(this, tempValue, this.values)) {\n copyValues.push(tempValue);\n this.setProperties({ values: copyValues });\n }\n }\n _super.prototype.todayButtonClick.call(this, new Date(+this.value));\n }\n };\n Calendar.prototype.keyActionHandle = function (e) {\n _super.prototype.keyActionHandle.call(this, e, this.value, this.isMultiSelection);\n };\n /**\n * Initialize the event handler\n * @private\n */\n Calendar.prototype.preRender = function () {\n var _this = this;\n this.changeHandler = function (e) {\n _this.triggerChange(e);\n };\n this.checkView();\n _super.prototype.preRender.call(this, this.value);\n };\n ;\n Calendar.prototype.createContent = function () {\n this.previousDate = this.value;\n _super.prototype.createContent.call(this);\n };\n Calendar.prototype.minMaxDate = function (localDate) {\n return _super.prototype.minMaxDate.call(this, localDate);\n };\n Calendar.prototype.renderMonths = function (e) {\n _super.prototype.renderMonths.call(this, e, this.value);\n };\n Calendar.prototype.renderDays = function (currentDate, e) {\n var tempDays = _super.prototype.renderDays.call(this, currentDate, e, this.value, this.isMultiSelection, this.values);\n if (this.isMultiSelection) {\n _super.prototype.validateValues.call(this, this.isMultiSelection, this.values);\n }\n return tempDays;\n };\n Calendar.prototype.renderYears = function (e) {\n if (this.calendarMode === 'Gregorian') {\n _super.prototype.renderYears.call(this, e, this.value);\n }\n else {\n this.islamicModule.islamicRenderYears(e, this.value);\n }\n };\n Calendar.prototype.renderDecades = function (e) {\n if (this.calendarMode === 'Gregorian') {\n _super.prototype.renderDecades.call(this, e, this.value);\n }\n else {\n this.islamicModule.islamicRenderDecade(e, this.value);\n }\n };\n Calendar.prototype.renderTemplate = function (elements, count, classNm, e) {\n if (this.calendarMode === 'Gregorian') {\n _super.prototype.renderTemplate.call(this, elements, count, classNm, e, this.value);\n }\n else {\n this.islamicModule.islamicRenderTemplate(elements, count, classNm, e, this.value);\n }\n this.changedArgs = { value: this.value, values: this.values };\n this.changeHandler();\n };\n Calendar.prototype.clickHandler = function (e) {\n var eve = e.currentTarget;\n if (eve.classList.contains(OTHERMONTH)) {\n if (this.isMultiSelection) {\n var copyValues = this.copyValues(this.values);\n copyValues.push(this.getIdValue(e, null));\n this.setProperties({ values: copyValues }, true);\n this.setProperties({ value: this.values[this.values.length - 1] }, true);\n }\n else {\n this.setProperties({ value: this.getIdValue(e, null) }, true);\n }\n }\n var storeView = this.currentView();\n _super.prototype.clickHandler.call(this, e, this.value);\n if (this.isMultiSelection && this.currentDate !== this.value &&\n !isNullOrUndefined(this.tableBodyElement.querySelectorAll('.' + FOCUSEDDATE)[0]) && storeView === 'Year') {\n this.tableBodyElement.querySelectorAll('.' + FOCUSEDDATE)[0].classList.remove(FOCUSEDDATE);\n }\n };\n Calendar.prototype.switchView = function (view, e) {\n _super.prototype.switchView.call(this, view, e, this.isMultiSelection);\n };\n /**\n * To get component name\n * @private\n */\n Calendar.prototype.getModuleName = function () {\n _super.prototype.getModuleName.call(this);\n return 'calendar';\n };\n /**\n * Gets the properties to be maintained upon browser refresh.\n * @returns string\n */\n Calendar.prototype.getPersistData = function () {\n _super.prototype.getPersistData.call(this);\n var keyEntity = ['value', 'values'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Called internally if any of the property value changed.\n * returns void\n * @private\n */\n Calendar.prototype.onPropertyChanged = function (newProp, oldProp) {\n this.effect = '';\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'value':\n if (typeof newProp.value === 'string') {\n this.setProperties({ value: new Date(this.checkValue(newProp.value)) }, true);\n }\n else {\n newProp.value = new Date(this.checkValue(newProp.value));\n }\n if (isNaN(+this.value)) {\n this.setProperties({ value: oldProp.value }, true);\n }\n this.update();\n break;\n case 'values':\n if (typeof newProp.values === 'string' || typeof newProp.values === 'number') {\n this.setProperties({ values: null }, true);\n }\n else {\n var copyValues = this.copyValues(this.values);\n for (var index = 0; index < copyValues.length; index++) {\n var tempDate = copyValues[index];\n if (this.checkDateValue(tempDate) && !_super.prototype.checkPresentDate.call(this, tempDate, copyValues)) {\n copyValues.push(tempDate);\n }\n }\n this.setProperties({ values: copyValues }, true);\n if (this.values.length > 0) {\n this.setProperties({ value: newProp.values[newProp.values.length - 1] }, true);\n }\n }\n this.validateValues(this.isMultiSelection, this.values);\n this.update();\n break;\n case 'isMultiSelection':\n this.setProperties({ isMultiSelection: newProp.isMultiSelection }, true);\n this.update();\n break;\n default:\n _super.prototype.onPropertyChanged.call(this, newProp, oldProp, this.isMultiSelection, this.values);\n }\n }\n };\n /**\n * Destroys the widget.\n * @returns void\n */\n Calendar.prototype.destroy = function () {\n _super.prototype.destroy.call(this);\n if (this.getModuleName() === 'calendar') {\n var form = closest(this.element, 'form');\n if (form) {\n EventHandler.remove(form, 'reset', this.formResetHandler.bind(this));\n }\n }\n };\n /**\n * This method is used to navigate to the month/year/decade view of the Calendar.\n * @param {string} view - Specifies the view of the Calendar.\n * @param {Date} date - Specifies the focused date in a view.\n * @returns void\n */\n Calendar.prototype.navigateTo = function (view, date) {\n this.minMaxUpdate();\n _super.prototype.navigateTo.call(this, view, date);\n };\n /**\n * Gets the current view of the Calendar.\n * @returns string\n */\n Calendar.prototype.currentView = function () {\n return _super.prototype.currentView.call(this);\n };\n /**\n * This method is used to add the single or multiple dates to the values property of the Calendar.\n * @param {Date || Date[]} dates - Specifies the date or dates to be added to the values property of the Calendar.\n * @returns void\n */\n Calendar.prototype.addDate = function (dates) {\n if (typeof dates !== 'string' && typeof dates !== 'number') {\n var copyValues = this.copyValues(this.values);\n if (typeof dates === 'object' && (dates).length > 0) {\n var tempDates = dates;\n for (var i = 0; i < tempDates.length; i++) {\n if (this.checkDateValue(tempDates[i]) && !_super.prototype.checkPresentDate.call(this, tempDates[i], copyValues)) {\n if (!isNullOrUndefined(copyValues) && copyValues.length > 0) {\n copyValues.push(tempDates[i]);\n }\n else {\n copyValues = [new Date(+tempDates[i])];\n }\n }\n }\n }\n else {\n if (this.checkDateValue(dates) && !_super.prototype.checkPresentDate.call(this, dates, copyValues)) {\n if (!isNullOrUndefined(copyValues) && copyValues.length > 0) {\n copyValues.push((dates));\n }\n else {\n copyValues = [new Date(+dates)];\n }\n }\n }\n this.setProperties({ values: copyValues }, true);\n if (this.isMultiSelection) {\n this.setProperties({ value: this.values[this.values.length - 1] }, true);\n }\n this.validateValues(this.isMultiSelection, copyValues);\n this.update();\n this.changedArgs = { value: this.value, values: this.values };\n this.changeHandler();\n }\n };\n /**\n * This method is used to remove the single or multiple dates from the values property of the Calendar.\n * @param {Date || Date[]} dates - Specifies the date or dates which need to be removed from the values property of the Calendar.\n * @returns void\n */\n Calendar.prototype.removeDate = function (dates) {\n if (typeof dates !== 'string' && typeof dates !== 'number' && !isNullOrUndefined(this.values) && this.values.length > 0) {\n var copyValues = this.copyValues(this.values);\n if (typeof dates === 'object' && ((dates).length > 0)) {\n var tempDates = dates;\n for (var index = 0; index < tempDates.length; index++) {\n for (var i = 0; i < copyValues.length; i++) {\n if (+copyValues[i] === +tempDates[index]) {\n copyValues.splice(i, 1);\n }\n }\n }\n }\n else {\n for (var i = 0; i < copyValues.length; i++) {\n if (+copyValues[i] === +dates) {\n copyValues.splice(i, 1);\n }\n }\n }\n this.setProperties({ values: copyValues }, false);\n this.update();\n if (this.isMultiSelection) {\n this.setProperties({ value: this.values[this.values.length - 1] }, true);\n }\n this.changedArgs = { value: this.value, values: this.values };\n this.changeHandler();\n }\n };\n Calendar.prototype.update = function () {\n this.validateDate();\n this.minMaxUpdate();\n _super.prototype.setValueUpdate.call(this);\n };\n Calendar.prototype.selectDate = function (e, date, element) {\n _super.prototype.selectDate.call(this, e, date, element, this.isMultiSelection, this.values);\n if (this.isMultiSelection && !isNullOrUndefined(this.values) && this.values.length > 0) {\n this.setProperties({ value: this.values[this.values.length - 1] }, true);\n }\n this.changedArgs = { value: this.value, values: this.values };\n this.changeHandler(e);\n };\n Calendar.prototype.changeEvent = function (e) {\n this.trigger('change', this.changedArgs);\n this.previousDate = new Date(+this.value);\n };\n Calendar.prototype.triggerChange = function (e) {\n this.changedArgs.event = e || null;\n this.changedArgs.isInteracted = !isNullOrUndefined(e);\n if (!isNullOrUndefined(this.value)) {\n this.setProperties({ value: this.value }, true);\n }\n if (!this.isMultiSelection && +this.value !== Number.NaN && +this.value !== +this.previousDate) {\n this.changeEvent(e);\n }\n else if (!isNullOrUndefined(this.values) && this.previousValues !== this.values.length) {\n this.changeEvent(e);\n this.previousValues = this.values.length;\n }\n };\n __decorate([\n Property(null)\n ], Calendar.prototype, \"value\", void 0);\n __decorate([\n Property(null)\n ], Calendar.prototype, \"values\", void 0);\n __decorate([\n Property(false)\n ], Calendar.prototype, \"isMultiSelection\", void 0);\n __decorate([\n Event()\n ], Calendar.prototype, \"change\", void 0);\n Calendar = __decorate([\n NotifyPropertyChanges\n ], Calendar);\n return Calendar;\n}(CalendarBase));\nexport { Calendar };\n","/**\n *\n */\nimport { EventHandler, Internationalization } from '@syncfusion/ej2-base';\nimport { rippleEffect } from '@syncfusion/ej2-base';\nimport { removeClass, addClass, attributes, HijriParser } from '@syncfusion/ej2-base';\nimport { getUniqueID } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\n//class constant defination.\nvar OTHERMONTH = 'e-other-month';\nvar YEAR = 'e-year';\nvar MONTH = 'e-month';\nvar DECADE = 'e-decade';\nvar DISABLED = 'e-disabled';\nvar OVERLAY = 'e-overlay';\nvar WEEKEND = 'e-weekend';\nvar WEEKNUMBER = 'e-week-number';\nvar SELECTED = 'e-selected';\nvar FOCUSEDDATE = 'e-focused-date';\nvar OTHERMONTHROW = 'e-month-hide';\nvar TODAY = 'e-today';\nvar LINK = 'e-day';\nvar CELL = 'e-cell';\nvar dayMilliSeconds = 86400000;\nvar minDecade = 2060;\nvar maxDecade = 2069;\nvar Islamic = /** @class */ (function () {\n function Islamic(instance) {\n this.calendarInstance = instance;\n }\n Islamic.prototype.getModuleName = function () {\n return 'islamic';\n };\n Islamic.prototype.islamicTitleUpdate = function (date, view) {\n var globalize = new Internationalization(this.calendarInstance.locale);\n switch (view) {\n case 'days':\n /* tslint:disable-next-line:max-line-length */\n this.calendarInstance.headerTitleElement.textContent = globalize.formatDate(date, { type: 'dateTime', format: 'MMMMyyyy', calendar: 'islamic' });\n break;\n case 'months':\n /* tslint:disable-next-line:max-line-length */\n this.calendarInstance.headerTitleElement.textContent = globalize.formatDate(date, { type: 'dateTime', format: 'yyyy', calendar: 'islamic' });\n }\n };\n /* tslint:disable-next-line:max-line-length */\n // tslint:disable-next-line:max-func-body-length\n Islamic.prototype.islamicRenderDays = function (currentDate, value, multiSelection, values) {\n var tdEles = [];\n var cellsCount = 42;\n var localDate = new Date(this.islamicInValue(currentDate));\n var minMaxDate;\n var numCells = this.calendarInstance.weekNumber ? 8 : 7;\n // 8 and 7 denotes the number of columns to be specified.\n this.islamicTitleUpdate(currentDate, 'days');\n /* tslint:disable-next-line:no-any */\n var islamicDate = this.getIslamicDate(localDate);\n var gregorianObject = this.toGregorian(islamicDate.year, islamicDate.month, 1);\n var currentMonth = islamicDate.month;\n localDate = gregorianObject;\n while (localDate.getDay() !== this.calendarInstance.firstDayOfWeek) {\n this.calendarInstance.setStartDate(localDate, -1 * dayMilliSeconds);\n }\n for (var day = 0; day < cellsCount; ++day) {\n var weekEle = this.calendarInstance.createElement('td', { className: CELL });\n var weekAnchor = this.calendarInstance.createElement('span');\n if (day % 7 === 0 && this.calendarInstance.weekNumber) {\n weekAnchor.textContent = '' + this.calendarInstance.getWeek(localDate);\n weekEle.appendChild(weekAnchor);\n addClass([weekEle], '' + WEEKNUMBER);\n tdEles.push(weekEle);\n }\n minMaxDate = new Date(+localDate);\n localDate = this.calendarInstance.minMaxDate(localDate);\n /* tslint:disable-next-line:max-line-length */\n var dateFormatOptions = { type: 'dateTime', skeleton: 'full', calendar: 'islamic' };\n var date = this.calendarInstance.globalize.parseDate(this.calendarInstance.globalize.formatDate(localDate, dateFormatOptions), dateFormatOptions);\n var tdEle = this.islamicDayCell(localDate);\n /* tslint:disable-next-line:max-line-length */\n var title = this.calendarInstance.globalize.formatDate(localDate, { type: 'date', skeleton: 'full', calendar: 'islamic' });\n var dayLink = this.calendarInstance.createElement('span');\n /* tslint:disable-next-line:max-line-length */\n dayLink.textContent = this.calendarInstance.globalize.formatDate(localDate, { type: 'date', skeleton: 'd', calendar: 'islamic' });\n var disabled = (this.calendarInstance.min > localDate) || (this.calendarInstance.max < localDate);\n if (disabled) {\n addClass([tdEle], DISABLED);\n addClass([tdEle], OVERLAY);\n }\n else {\n dayLink.setAttribute('title', '' + title);\n }\n /* tslint:disable-next-line:no-any */\n var hijriMonthObject = this.getIslamicDate(localDate);\n if (currentMonth !== hijriMonthObject.month) {\n addClass([tdEle], OTHERMONTH);\n }\n if (localDate.getDay() === 0 || localDate.getDay() === 6) {\n addClass([tdEle], WEEKEND);\n }\n tdEle.appendChild(dayLink);\n this.calendarInstance.renderDayCellArgs = {\n date: localDate,\n isDisabled: false,\n element: tdEle,\n isOutOfRange: disabled\n };\n var argument = this.calendarInstance.renderDayCellArgs;\n this.calendarInstance.renderDayCellEvent(argument);\n if (argument.isDisabled) {\n if (this.calendarInstance.isMultiSelection) {\n if (!isNullOrUndefined(this.calendarInstance.values) && this.calendarInstance.values.length > 0) {\n for (var index = 0; index < values.length; index++) {\n /* tslint:disable-next-line:max-line-length */\n var localDateString = +new Date(this.calendarInstance.globalize.formatDate(argument.date, { type: 'date', skeleton: 'yMd', calendar: 'islamic' }));\n /* tslint:disable-next-line:max-line-length */\n var tempDateString = +new Date(this.calendarInstance.globalize.formatDate(this.calendarInstance.values[index], { type: 'date', skeleton: 'yMd', calendar: 'islamic' }));\n if (localDateString === tempDateString) {\n this.calendarInstance.values.splice(index, 1);\n index = -1;\n }\n }\n }\n }\n else if (value && +value === +argument.date) {\n this.calendarInstance.setProperties({ value: null }, true);\n }\n }\n if (this.calendarInstance.renderDayCellArgs.isDisabled && !tdEle.classList.contains(SELECTED)) {\n addClass([tdEle], DISABLED);\n addClass([tdEle], OVERLAY);\n if (+this.calendarInstance.renderDayCellArgs.date === +this.calendarInstance.todayDate) {\n this.calendarInstance.todayDisabled = true;\n }\n }\n var otherMnthBool = tdEle.classList.contains(OTHERMONTH);\n var disabledCls = tdEle.classList.contains(DISABLED);\n if (!disabledCls) {\n EventHandler.add(tdEle, 'click', this.calendarInstance.clickHandler, this.calendarInstance);\n }\n if (this.calendarInstance.isMultiSelection && !isNullOrUndefined(this.calendarInstance.values) &&\n !otherMnthBool && !disabledCls) {\n for (var tempValue = 0; tempValue < this.calendarInstance.values.length; tempValue++) {\n /* tslint:disable-next-line:max-line-length */\n var localDateString = this.calendarInstance.globalize.formatDate(localDate, { type: 'date', skeleton: 'short', calendar: 'islamic' });\n var tempDateString = this.calendarInstance.globalize.formatDate(this.calendarInstance.values[tempValue], { type: 'date', skeleton: 'short', calendar: 'islamic' });\n if (localDateString === tempDateString &&\n this.calendarInstance.getDateVal(localDate, this.calendarInstance.values[tempValue])) {\n addClass([tdEle], SELECTED);\n }\n else {\n this.calendarInstance.updateFocus(otherMnthBool, disabledCls, localDate, tdEle, currentDate);\n }\n }\n if (this.calendarInstance.values.length <= 0) {\n this.calendarInstance.updateFocus(otherMnthBool, disabledCls, localDate, tdEle, currentDate);\n }\n }\n else if (!otherMnthBool && !disabledCls && this.calendarInstance.getDateVal(localDate, value)) {\n addClass([tdEle], SELECTED);\n }\n else {\n this.calendarInstance.updateFocus(otherMnthBool, disabledCls, localDate, tdEle, currentDate);\n }\n if (date.getDate() === new Date().getDate() && date.getMonth() === new Date().getMonth()) {\n if (date.getFullYear() === new Date().getFullYear()) {\n addClass([tdEle], TODAY);\n }\n }\n localDate = new Date(+minMaxDate);\n tdEles.push(this.calendarInstance.renderDayCellArgs.element);\n this.calendarInstance.addDay(localDate, 1, null, this.calendarInstance.max, this.calendarInstance.min);\n }\n return tdEles;\n };\n Islamic.prototype.islamicIconHandler = function () {\n new Date(this.islamicInValue(this.calendarInstance.currentDate)).setDate(1);\n var date = new Date(this.islamicInValue(this.calendarInstance.currentDate));\n switch (this.calendarInstance.currentView()) {\n case 'Month':\n var prevMonthCompare = this.islamicCompareMonth(date, this.calendarInstance.min) < 1;\n var nextMonthCompare = this.islamicCompareMonth(date, this.calendarInstance.max) > -1;\n this.calendarInstance.previousIconHandler(prevMonthCompare);\n this.calendarInstance.nextIconHandler(nextMonthCompare);\n break;\n case 'Year':\n var prevYearCompare = this.hijriCompareYear(date, this.calendarInstance.min) < 1;\n var nextYearCompare = this.hijriCompareYear(date, this.calendarInstance.max) > -1;\n this.calendarInstance.previousIconHandler(prevYearCompare);\n this.calendarInstance.nextIconHandler(nextYearCompare);\n break;\n case 'Decade':\n var prevDecadeCompare = this.hijriCompareDecade(date, this.calendarInstance.min) < 1;\n var nextDecadeCompare = this.hijriCompareDecade(date, this.calendarInstance.max) > -1;\n this.calendarInstance.previousIconHandler(prevDecadeCompare);\n this.calendarInstance.nextIconHandler(nextDecadeCompare);\n }\n };\n Islamic.prototype.islamicNext = function () {\n this.calendarInstance.effect = '';\n var view = this.calendarInstance.getViewNumber(this.calendarInstance.currentView());\n /* tslint:disable-next-line:no-any */\n var islamicDate = this.getIslamicDate(this.calendarInstance.currentDate);\n switch (this.calendarInstance.currentView()) {\n case 'Year':\n this.calendarInstance.currentDate = this.toGregorian(islamicDate.year + 1, islamicDate.month, 1);\n this.calendarInstance.switchView(view);\n break;\n case 'Month':\n this.calendarInstance.currentDate = this.toGregorian(islamicDate.year, islamicDate.month + 1, 1);\n this.calendarInstance.switchView(view);\n break;\n case 'Decade':\n this.calendarInstance.currentDate = this.toGregorian(islamicDate.year + 10, islamicDate.month, 1);\n this.calendarInstance.switchView(view);\n break;\n }\n };\n Islamic.prototype.islamicPrevious = function () {\n var currentView = this.calendarInstance.getViewNumber(this.calendarInstance.currentView());\n this.calendarInstance.effect = '';\n /* tslint:disable-next-line:no-any */\n var islamicDate = this.getIslamicDate(this.calendarInstance.currentDate);\n switch (this.calendarInstance.currentView()) {\n case 'Month':\n this.calendarInstance.currentDate = this.toGregorian(islamicDate.year, islamicDate.month - 1, 1);\n this.calendarInstance.switchView(currentView);\n break;\n case 'Year':\n this.calendarInstance.currentDate = this.toGregorian(islamicDate.year - 1, islamicDate.month, 1);\n this.calendarInstance.switchView(currentView);\n break;\n case 'Decade':\n this.calendarInstance.currentDate = this.toGregorian(islamicDate.year - 10, islamicDate.month - 1, 1);\n this.calendarInstance.switchView(currentView);\n break;\n }\n };\n Islamic.prototype.islamicRenderYears = function (e, value) {\n this.calendarInstance.removeTableHeadElement();\n var numCells = 4;\n var days;\n var tdEles = [];\n var valueUtil = isNullOrUndefined(value);\n var curDate = new Date(this.islamicInValue(this.calendarInstance.currentDate));\n var localDate = curDate;\n /* tslint:disable-next-line:no-any */\n var islamicDate = this.getIslamicDate(localDate);\n var gregorianObject = HijriParser.toGregorian(islamicDate.year, 1, 1);\n localDate = gregorianObject;\n var mon = islamicDate.month;\n var yr = islamicDate.year;\n var curYrs = islamicDate.year;\n /* tslint:disable-next-line:no-any */\n var minYr = (this.getIslamicDate(this.calendarInstance.min)).year;\n /* tslint:disable-next-line:no-any */\n var minMonth = (this.getIslamicDate(this.calendarInstance.min)).month;\n /* tslint:disable-next-line:no-any */\n var maxYr = (this.getIslamicDate(this.calendarInstance.max)).year;\n /* tslint:disable-next-line:no-any */\n var maxMonth = (this.getIslamicDate(this.calendarInstance.max)).month;\n this.islamicTitleUpdate(this.calendarInstance.currentDate, 'months');\n var disabled = (this.calendarInstance.min > localDate) || (this.calendarInstance.max < localDate);\n for (var month = 1; month <= 12; ++month) {\n /* tslint:disable-next-line:no-any */\n var islamicDate_1 = this.getIslamicDate(localDate);\n var gregorianObject_1 = HijriParser.toGregorian(islamicDate_1.year, month, 1);\n localDate = gregorianObject_1;\n var tdEle = this.islamicDayCell(localDate);\n var dayLink = this.calendarInstance.createElement('span');\n /* tslint:disable-next-line:max-line-length */\n /* tslint:disable-next-line:no-any */\n var localMonth = (value && (this.getIslamicDate(value)).month === (this.getIslamicDate(localDate)).month);\n /* tslint:disable-next-line:no-any tslint:disable-next-line:max-line-length */\n var select = (value && (this.getIslamicDate(value)).year === yr && localMonth);\n /* tslint:disable-next-line:max-line-length */\n dayLink.textContent = this.calendarInstance.globalize.formatDate(localDate, { type: 'dateTime', format: 'MMM', calendar: 'islamic' });\n if ((this.calendarInstance.min && (curYrs < minYr || (month < minMonth && curYrs === minYr))) || (this.calendarInstance.max && (curYrs > maxYr || (month > maxMonth && curYrs >= maxYr)))) {\n addClass([tdEle], DISABLED);\n }\n else if (!valueUtil && select) {\n addClass([tdEle], SELECTED);\n }\n else {\n /* tslint:disable-next-line:no-any */\n if ((this.getIslamicDate(localDate)).month === mon &&\n /* tslint:disable-next-line:no-any */\n (this.getIslamicDate(this.calendarInstance.currentDate)).month === mon) {\n addClass([tdEle], FOCUSEDDATE);\n }\n }\n if (!tdEle.classList.contains(DISABLED)) {\n EventHandler.add(tdEle, 'click', this.calendarInstance.clickHandler, this.calendarInstance);\n }\n tdEle.appendChild(dayLink);\n tdEles.push(tdEle);\n }\n this.islamicRenderTemplate(tdEles, numCells, YEAR, e, value);\n };\n Islamic.prototype.islamicRenderDecade = function (e, value) {\n this.calendarInstance.removeTableHeadElement();\n var numCells = 4;\n var yearCell = 12;\n var tdEles = [];\n var localDate = new Date(this.islamicInValue(this.calendarInstance.currentDate));\n /* tslint:disable-next-line:no-any */\n var islamicDate = this.getIslamicDate(localDate);\n var gregorianObject = HijriParser.toGregorian(islamicDate.year, 1, 1);\n localDate = gregorianObject;\n var localYr = localDate.getFullYear();\n var startYr = new Date(this.islamicInValue((localYr - localYr % 10)));\n var endYr = new Date(this.islamicInValue((localYr - localYr % 10 + (10 - 1))));\n var startFullYr = startYr.getFullYear();\n var endFullYr = endYr.getFullYear();\n /* tslint:disable-next-line:max-line-length */\n var startHdrYr = this.calendarInstance.globalize.formatDate(startYr, { type: 'dateTime', format: 'y', calendar: 'islamic' });\n var endHdrYr = this.calendarInstance.globalize.formatDate(endYr, { type: 'dateTime', format: 'y', calendar: 'islamic' });\n this.calendarInstance.headerTitleElement.textContent = startHdrYr + ' - ' + (endHdrYr);\n var start = new Date(localYr - (localYr % 10) - 2, 0, 1);\n var startYear = start.getFullYear();\n for (var rowCount = 1; rowCount <= yearCell; ++rowCount) {\n var year = startYear + rowCount;\n localDate.setFullYear(year);\n localDate.setDate(1);\n localDate.setMonth(0);\n /* tslint:disable-next-line:no-any */\n var islamicDate_2 = this.getIslamicDate(localDate);\n var gregorianObject_2 = HijriParser.toGregorian(islamicDate_2.year, 1, 1);\n localDate = gregorianObject_2;\n var tdEle = this.islamicDayCell(localDate);\n attributes(tdEle, { 'role': 'gridcell' });\n var dayLink = this.calendarInstance.createElement('span');\n /* tslint:disable-next-line:max-line-length */\n dayLink.textContent = this.calendarInstance.globalize.formatDate(localDate, { type: 'dateTime', format: 'y', calendar: 'islamic' });\n /* tslint:disable-next-line:no-any */\n if ((year < startFullYr) || (year > endFullYr)) {\n addClass([tdEle], OTHERMONTH);\n }\n else if (year < new Date(this.islamicInValue(this.calendarInstance.min)).getFullYear()\n || year > new Date(this.islamicInValue(this.calendarInstance.max)).getFullYear()) {\n addClass([tdEle], DISABLED);\n }\n else if (!isNullOrUndefined(value) &&\n /* tslint:disable-next-line:no-any */\n (this.getIslamicDate(localDate)).year ===\n /* tslint:disable-next-line:no-any */\n (this.getIslamicDate(value)).year) {\n addClass([tdEle], SELECTED);\n }\n else {\n if (localDate.getFullYear() === this.calendarInstance.currentDate.getFullYear() && !tdEle.classList.contains(DISABLED)) {\n addClass([tdEle], FOCUSEDDATE);\n }\n }\n if (!tdEle.classList.contains(DISABLED)) {\n EventHandler.add(tdEle, 'click', this.calendarInstance.clickHandler, this.calendarInstance);\n }\n tdEle.appendChild(dayLink);\n tdEles.push(tdEle);\n }\n this.islamicRenderTemplate(tdEles, numCells, 'e-decade', e, value);\n };\n Islamic.prototype.islamicDayCell = function (localDate) {\n var dateFormatOptions = { skeleton: 'full', type: 'dateTime', calendar: 'islamic' };\n var formatDate = this.calendarInstance.globalize.formatDate(localDate, dateFormatOptions);\n var date = this.calendarInstance.globalize.parseDate(formatDate, dateFormatOptions);\n var value = date.valueOf();\n var attrs = {\n className: CELL, attrs: { 'id': '' + getUniqueID('' + value), 'aria-selected': 'false', 'role': 'gridcell' }\n };\n return this.calendarInstance.createElement('td', attrs);\n };\n Islamic.prototype.islamicRenderTemplate = function (elements, count, classNm, e, value) {\n var view = this.calendarInstance.getViewNumber(this.calendarInstance.currentView());\n var trEle;\n this.calendarInstance.tableBodyElement = this.calendarInstance.createElement('tbody');\n this.calendarInstance.table.appendChild(this.calendarInstance.tableBodyElement);\n removeClass([this.calendarInstance.contentElement, this.calendarInstance.headerElement], [MONTH, DECADE, YEAR]);\n addClass([this.calendarInstance.contentElement, this.calendarInstance.headerElement], [classNm]);\n var weekNumCell = 41;\n var numberCell = 35;\n var otherMonthCell = 6;\n var row = count;\n var rowCount = 0;\n for (var dayCell = 0; dayCell < elements.length / count; ++dayCell) {\n trEle = this.calendarInstance.createElement('tr', { attrs: { 'role': 'row' } });\n for (rowCount = 0 + rowCount; rowCount < row; rowCount++) {\n if (!elements[rowCount].classList.contains('e-week-number') && !isNullOrUndefined(elements[rowCount].children[0])) {\n addClass([elements[rowCount].children[0]], [LINK]);\n rippleEffect(elements[rowCount].children[0], {\n duration: 600,\n isCenterRipple: true\n });\n }\n trEle.appendChild(elements[rowCount]);\n if (this.calendarInstance.weekNumber &&\n rowCount === otherMonthCell + 1 && elements[otherMonthCell + 1].classList.contains(OTHERMONTH)) {\n addClass([trEle], OTHERMONTHROW);\n }\n if (!this.calendarInstance.weekNumber\n && rowCount === otherMonthCell && elements[otherMonthCell].classList.contains(OTHERMONTH)) {\n addClass([trEle], OTHERMONTHROW);\n }\n if (this.calendarInstance.weekNumber) {\n if (rowCount === weekNumCell && elements[weekNumCell].classList.contains(OTHERMONTH)) {\n addClass([trEle], OTHERMONTHROW);\n }\n }\n else {\n if (rowCount === numberCell && elements[numberCell].classList.contains(OTHERMONTH)) {\n addClass([trEle], OTHERMONTHROW);\n }\n }\n }\n row = row + count;\n rowCount = rowCount + 0;\n this.calendarInstance.tableBodyElement.appendChild(trEle);\n }\n this.calendarInstance.table.querySelector('tbody').className = this.calendarInstance.effect;\n this.islamicIconHandler();\n if (view !== this.calendarInstance.getViewNumber(this.calendarInstance.currentView())\n || (view === 0 && view !== this.calendarInstance.getViewNumber(this.calendarInstance.currentView()))) {\n this.calendarInstance.navigateHandler(e);\n }\n this.calendarInstance.setAriaActiveDescendant();\n this.calendarInstance.changedArgs = { value: this.calendarInstance.value, values: this.calendarInstance.values };\n this.calendarInstance.changeHandler();\n };\n Islamic.prototype.islamicCompareMonth = function (start, end) {\n /* tslint:disable-next-line:no-any */\n var hijriStart = (this.getIslamicDate(start));\n /* tslint:disable-next-line:no-any */\n var hijriEnd = (this.getIslamicDate(end));\n var result;\n if (hijriStart.year > hijriEnd.year) {\n result = 1;\n }\n else if (hijriStart.year < hijriEnd.year) {\n result = -1;\n }\n else {\n result = hijriStart.month === hijriEnd.month ? 0 : hijriStart.month > hijriEnd.month ? 1 : -1;\n }\n return result;\n };\n ;\n Islamic.prototype.islamicCompare = function (startDate, endDate, modifier) {\n /* tslint:disable-next-line:no-any */\n var hijriStart = this.getIslamicDate(startDate);\n /* tslint:disable-next-line:no-any */\n var hijriEnd = this.getIslamicDate(endDate);\n var start = hijriEnd.year;\n var end;\n var result;\n end = start;\n result = 0;\n if (modifier) {\n start = start - start % modifier;\n end = start - start % modifier + modifier - 1;\n }\n if (hijriStart.year > end) {\n result = 1;\n }\n else if ((this.calendarInstance.currentView() === 'Decade') && hijriStart.year < start &&\n !((startDate.getFullYear() >= minDecade && startDate.getFullYear() <= maxDecade))) {\n result = -1;\n }\n else if (hijriStart.year < start && (this.calendarInstance.currentView() === 'Year')) {\n result = -1;\n }\n return result;\n };\n ;\n /* tslint:disable-next-line:no-any */\n Islamic.prototype.getIslamicDate = function (date) {\n /* tslint:disable-next-line:no-any */\n return (HijriParser.getHijriDate(date));\n };\n Islamic.prototype.toGregorian = function (year, month, date) {\n return HijriParser.toGregorian(year, month, date);\n };\n Islamic.prototype.hijriCompareYear = function (start, end) {\n return this.islamicCompare(start, end, 0);\n };\n Islamic.prototype.hijriCompareDecade = function (start, end) {\n return this.islamicCompare(start, end, 10);\n };\n ;\n Islamic.prototype.destroy = function () {\n this.calendarInstance = null;\n };\n Islamic.prototype.islamicInValue = function (inValue) {\n if (inValue instanceof Date) {\n return (inValue.toUTCString());\n }\n else {\n return ('' + inValue);\n }\n };\n return Islamic;\n}());\nexport { Islamic };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, Property, Event, Collection, L10n, Browser, Complex, compile, createElement } from '@syncfusion/ej2-base';\nimport { addClass, removeClass, detach, attributes, prepend, setStyleAttribute } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, ChildProperty } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, formatUnit, append } from '@syncfusion/ej2-base';\nimport { EventHandler } from '@syncfusion/ej2-base';\nimport { Draggable } from '@syncfusion/ej2-base';\nimport { Popup, PositionData, getZindexPartial } from '../popup/popup';\nimport { Button } from '@syncfusion/ej2-buttons';\nimport { createResize, removeResize, setMinHeight } from '../common/resize';\nvar ButtonProps = /** @class */ (function (_super) {\n __extends(ButtonProps, _super);\n function ButtonProps() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], ButtonProps.prototype, \"buttonModel\", void 0);\n __decorate([\n Property('Button')\n ], ButtonProps.prototype, \"type\", void 0);\n __decorate([\n Property()\n ], ButtonProps.prototype, \"click\", void 0);\n return ButtonProps;\n}(ChildProperty));\nexport { ButtonProps };\n/**\n * Configures the animation properties for both open and close the dialog.\n */\nvar AnimationSettings = /** @class */ (function (_super) {\n __extends(AnimationSettings, _super);\n function AnimationSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Fade')\n ], AnimationSettings.prototype, \"effect\", void 0);\n __decorate([\n Property(400)\n ], AnimationSettings.prototype, \"duration\", void 0);\n __decorate([\n Property(0)\n ], AnimationSettings.prototype, \"delay\", void 0);\n return AnimationSettings;\n}(ChildProperty));\nexport { AnimationSettings };\nvar ROOT = 'e-dialog';\nvar RTL = 'e-rtl';\nvar DLG_HEADER_CONTENT = 'e-dlg-header-content';\nvar DLG_HEADER = 'e-dlg-header';\nvar DLG_FOOTER_CONTENT = 'e-footer-content';\nvar MODAL_DLG = 'e-dlg-modal';\nvar DLG_CONTENT = 'e-dlg-content';\nvar DLG_CLOSE_ICON = 'e-icon-dlg-close';\nvar DLG_OVERLAY = 'e-dlg-overlay';\nvar DLG_CONTAINER = 'e-dlg-container';\nvar SCROLL_DISABLED = 'e-scroll-disabled';\nvar DLG_PRIMARY_BUTTON = 'e-primary';\nvar ICON = 'e-icons';\nvar POPUP_ROOT = 'e-popup';\nvar DEVICE = 'e-device';\nvar FULLSCREEN = 'e-dlg-fullscreen';\nvar DLG_CLOSE_ICON_BTN = 'e-dlg-closeicon-btn';\nvar DLG_HIDE = 'e-popup-close';\nvar DLG_SHOW = 'e-popup-open';\nvar DLG_UTIL_DEFAULT_TITLE = 'Information';\nvar DLG_UTIL_ROOT = 'e-scroll-disabled';\nvar DLG_UTIL_ALERT = 'e-alert-dialog';\nvar DLG_UTIL_CONFIRM = 'e-confirm-dialog';\nvar DLG_RESIZABLE = 'e-dlg-resizable';\nvar DLG_RESTRICT_LEFT_VALUE = 'e-restrict-left';\nvar DLG_RESTRICT_WIDTH_VALUE = 'e-resize-viewport';\n/**\n * Represents the dialog component that displays the information and get input from the user.\n * Two types of dialog components are `Modal and Modeless (non-modal)` depending on its interaction with parent application.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar Dialog = /** @class */ (function (_super) {\n __extends(Dialog, _super);\n /**\n * Constructor for creating the widget\n * @hidden\n */\n function Dialog(options, element) {\n return _super.call(this, options, element) || this;\n }\n /**\n * Initialize the control rendering\n * @private\n */\n Dialog.prototype.render = function () {\n this.initialize();\n this.initRender();\n this.wireEvents();\n if (this.width === '100%') {\n this.element.style.width = '';\n }\n if (this.enableResize) {\n this.setResize();\n if (this.animationSettings.effect === 'None') {\n this.getMinHeight();\n }\n }\n };\n /**\n * Initialize the event handler\n * @private\n */\n Dialog.prototype.preRender = function () {\n var _this = this;\n this.headerContent = null;\n this.allowMaxHeight = true;\n var classArray = [];\n for (var j = 0; j < this.element.classList.length; j++) {\n if (!isNullOrUndefined(this.element.classList[j].match('e-control')) ||\n !isNullOrUndefined(this.element.classList[j].match(ROOT))) {\n classArray.push(this.element.classList[j]);\n }\n }\n removeClass([this.element], classArray);\n this.clonedEle = this.element.cloneNode(true);\n this.closeIconClickEventHandler = function (event) {\n _this.hide(event);\n };\n this.dlgOverlayClickEventHandler = function (event) {\n _this.trigger('overlayClick', event);\n };\n var localeText = { close: 'Close' };\n this.l10n = new L10n('dialog', localeText, this.locale);\n this.checkPositionData();\n if (isNullOrUndefined(this.target)) {\n var prevOnChange = this.isProtectedOnChange;\n this.isProtectedOnChange = true;\n this.target = document.body;\n this.isProtectedOnChange = prevOnChange;\n }\n };\n ;\n Dialog.prototype.isNumberValue = function (value) {\n var isNumber = /^[-+]?\\d*\\.?\\d+$/.test(value);\n return isNumber;\n };\n Dialog.prototype.checkPositionData = function () {\n if (!isNullOrUndefined(this.position)) {\n if (!isNullOrUndefined(this.position.X) && (typeof (this.position.X) !== 'number')) {\n var isNumber = this.isNumberValue(this.position.X);\n if (isNumber) {\n var prevOnChange = this.isProtectedOnChange;\n this.isProtectedOnChange = true;\n this.position.X = parseFloat(this.position.X);\n this.isProtectedOnChange = prevOnChange;\n }\n }\n if (!isNullOrUndefined(this.position.Y) && (typeof (this.position.Y) !== 'number')) {\n var isNumber = this.isNumberValue(this.position.Y);\n if (isNumber) {\n var prevOnChange = this.isProtectedOnChange;\n this.isProtectedOnChange = true;\n this.position.Y = parseFloat(this.position.Y);\n this.isProtectedOnChange = prevOnChange;\n }\n }\n }\n };\n /* istanbul ignore next */\n Dialog.prototype.getMinHeight = function () {\n var computedHeaderHeight = '0px';\n var computedFooterHeight = '0px';\n if (!isNullOrUndefined(this.element.querySelector('.' + DLG_HEADER_CONTENT))) {\n computedHeaderHeight = getComputedStyle(this.headerContent).height;\n }\n if (!isNullOrUndefined(this.element.querySelector('.' + DLG_FOOTER_CONTENT))) {\n computedFooterHeight = getComputedStyle(this.element.querySelector('.' + DLG_FOOTER_CONTENT)).height;\n }\n var headerHeight = parseInt(computedHeaderHeight.slice(0, computedHeaderHeight.indexOf('p')), 10);\n var footerHeight = parseInt(computedFooterHeight.slice(0, computedFooterHeight.indexOf('p')), 10);\n setMinHeight(headerHeight + 30 + footerHeight);\n };\n Dialog.prototype.onResizeStart = function (args) {\n this.trigger('resizeStart', args);\n };\n Dialog.prototype.onResizing = function (args) {\n this.trigger('resizing', args);\n };\n Dialog.prototype.onResizeComplete = function (args) {\n this.trigger('resizeStop', args);\n };\n Dialog.prototype.setResize = function () {\n if (this.enableResize) {\n this.element.classList.add(DLG_RESIZABLE);\n var computedHeight = getComputedStyle(this.element).minHeight;\n var computedWidth = getComputedStyle(this.element).minWidth;\n var direction = this.enableRtl ? 'south-west' : 'south-east';\n if (this.isModal && this.enableRtl) {\n this.element.classList.add(DLG_RESTRICT_LEFT_VALUE);\n }\n else if (this.isModal && this.target === document.body) {\n this.element.classList.add(DLG_RESTRICT_WIDTH_VALUE);\n }\n createResize({\n element: this.element,\n direction: direction,\n minHeight: parseInt(computedHeight.slice(0, computedWidth.indexOf('p')), 10),\n maxHeight: this.targetEle.clientHeight,\n minWidth: parseInt(computedWidth.slice(0, computedWidth.indexOf('p')), 10),\n maxWidth: this.targetEle.clientWidth,\n boundary: this.target === document.body ? null : this.targetEle,\n resizeBegin: this.onResizeStart.bind(this),\n resizeComplete: this.onResizeComplete.bind(this),\n resizing: this.onResizing.bind(this)\n });\n }\n else {\n removeResize();\n if (this.isModal) {\n this.element.classList.remove(DLG_RESTRICT_LEFT_VALUE);\n }\n else {\n this.element.classList.remove(DLG_RESTRICT_WIDTH_VALUE);\n }\n this.element.classList.remove(DLG_RESIZABLE);\n }\n };\n /* istanbul ignore next */\n Dialog.prototype.keyDown = function (event) {\n var _this = this;\n if (event.keyCode === 9) {\n if (this.isModal) {\n var buttonObj = void 0;\n if (!isNullOrUndefined(this.btnObj)) {\n buttonObj = this.btnObj[this.btnObj.length - 1];\n }\n if (!isNullOrUndefined(buttonObj) && document.activeElement === buttonObj.element && !event.shiftKey) {\n event.preventDefault();\n this.focusableElements(this.element).focus();\n }\n if (document.activeElement === this.focusableElements(this.element) && event.shiftKey) {\n event.preventDefault();\n if (!isNullOrUndefined(buttonObj)) {\n buttonObj.element.focus();\n }\n }\n }\n }\n var element = document.activeElement;\n var isTagName = (['input', 'textarea'].indexOf(element.tagName.toLowerCase()) > -1);\n var isContentEdit = false;\n if (!isTagName) {\n isContentEdit = element.hasAttribute('contenteditable') && element.getAttribute('contenteditable') === 'true';\n }\n if (event.keyCode === 27 && this.closeOnEscape) {\n this.hide(event);\n }\n if ((event.keyCode === 13 && !event.ctrlKey && element.tagName.toLowerCase() !== 'textarea' &&\n isTagName && !isNullOrUndefined(this.primaryButtonEle)) ||\n (event.keyCode === 13 && event.ctrlKey && (element.tagName.toLowerCase() === 'textarea' ||\n isContentEdit)) && !isNullOrUndefined(this.primaryButtonEle)) {\n var buttonIndex_1;\n var firstPrimary = this.buttons.some(function (data, index) {\n buttonIndex_1 = index;\n var buttonModel = data.buttonModel;\n return !isNullOrUndefined(buttonModel) && buttonModel.isPrimary === true;\n });\n if (firstPrimary && typeof (this.buttons[buttonIndex_1].click) === 'function') {\n setTimeout(function () {\n _this.buttons[buttonIndex_1].click.call(_this, event);\n });\n }\n }\n };\n /**\n * Initialize the control rendering\n * @private\n */\n Dialog.prototype.initialize = function () {\n if (!isNullOrUndefined(this.target)) {\n this.targetEle = ((typeof this.target) === 'string') ?\n document.querySelector(this.target) : this.target;\n }\n addClass([this.element], ROOT);\n if (Browser.isDevice) {\n addClass([this.element], DEVICE);\n }\n this.setCSSClass();\n this.setMaxHeight();\n };\n /**\n * Initialize the rendering\n * @private\n */\n Dialog.prototype.initRender = function () {\n var _this = this;\n this.initialRender = true;\n attributes(this.element, { role: 'dialog' });\n if (this.zIndex === 1000) {\n this.setzIndex(this.element, false);\n this.calculatezIndex = true;\n }\n else {\n this.calculatezIndex = false;\n }\n this.setTargetContent();\n if (this.header !== '' && !isNullOrUndefined(this.header)) {\n this.setHeader();\n }\n if (this.showCloseIcon) {\n this.renderCloseIcon();\n }\n this.setContent();\n if (this.footerTemplate !== '' && !isNullOrUndefined(this.footerTemplate)) {\n this.setFooterTemplate();\n }\n else if (!isNullOrUndefined(this.buttons[0].buttonModel)) {\n this.setButton();\n }\n if (this.allowDragging && (!isNullOrUndefined(this.headerContent))) {\n this.setAllowDragging();\n }\n attributes(this.element, { 'aria-modal': (this.isModal ? 'true' : 'false') });\n if (this.isModal) {\n this.setIsModal();\n }\n if (!isNullOrUndefined(this.targetEle)) {\n this.isModal ? this.targetEle.appendChild(this.dlgContainer) : this.targetEle.appendChild(this.element);\n }\n this.popupObj = new Popup(this.element, {\n height: this.height,\n width: this.width,\n zIndex: this.zIndex,\n relateTo: this.target,\n actionOnScroll: 'none',\n open: function (event) {\n _this.focusContent();\n var eventArgs = {\n container: _this.isModal ? _this.dlgContainer : _this.element,\n element: _this.element,\n target: _this.target\n };\n if (_this.enableResize) {\n _this.getMinHeight();\n }\n _this.trigger('open', eventArgs);\n },\n close: function (event) {\n if (_this.isModal) {\n addClass([_this.dlgOverlay], 'e-fade');\n }\n _this.unBindEvent(_this.element);\n if (_this.isModal) {\n _this.dlgContainer.style.display = 'none';\n }\n _this.trigger('close', _this.closeArgs);\n if (!isNullOrUndefined(document.activeElement.blur)) {\n document.activeElement.blur();\n }\n if (!isNullOrUndefined(_this.storeActiveElement)) {\n document.activeElement.blur();\n _this.storeActiveElement.focus();\n }\n }\n });\n this.positionChange();\n this.setEnableRTL();\n addClass([this.element], DLG_HIDE);\n if (this.isModal) {\n this.setOverlayZindex();\n }\n if (this.visible) {\n this.show();\n }\n else {\n if (this.isModal) {\n this.dlgOverlay.style.display = 'none';\n }\n }\n this.initialRender = false;\n };\n Dialog.prototype.setOverlayZindex = function (zIndexValue) {\n var zIndex;\n if (isNullOrUndefined(zIndexValue)) {\n zIndex = parseInt(this.element.style.zIndex, 10) ? parseInt(this.element.style.zIndex, 10) : this.zIndex;\n }\n else {\n zIndex = zIndexValue;\n }\n this.dlgOverlay.style.zIndex = (zIndex - 1).toString();\n this.dlgContainer.style.zIndex = zIndex.toString();\n };\n Dialog.prototype.positionChange = function () {\n if (this.isModal) {\n if (typeof (this.position.X) === 'number' && typeof (this.position.Y) === 'number') {\n this.setPopupPosition();\n }\n else if ((typeof this.position.X === 'string' && typeof this.position.Y === 'number') ||\n (typeof this.position.X === 'number' && typeof this.position.Y === 'string')) {\n this.setPopupPosition();\n }\n else {\n this.element.style.top = '0px';\n this.element.style.left = '0px';\n this.dlgContainer.classList.add('e-dlg-' + this.position.X + '-' + this.position.Y);\n }\n }\n else {\n this.setPopupPosition();\n }\n };\n Dialog.prototype.setPopupPosition = function () {\n this.popupObj.setProperties({\n position: {\n X: this.position.X, Y: this.position.Y\n }\n });\n };\n Dialog.prototype.setAllowDragging = function () {\n var _this = this;\n var handleContent = '.' + DLG_HEADER_CONTENT;\n this.dragObj = new Draggable(this.element, {\n clone: false,\n abort: '.e-dlg-closeicon-btn',\n handle: handleContent,\n dragStart: function (event) {\n _this.trigger('dragStart', event);\n },\n dragStop: function (event) {\n if (_this.isModal) {\n if (!isNullOrUndefined(_this.position)) {\n _this.dlgContainer.classList.remove('e-dlg-' + _this.position.X + '-' + _this.position.Y);\n }\n // Reset the dialog position after drag completion.\n _this.element.style.position = 'relative';\n }\n _this.trigger('dragStop', event);\n _this.element.classList.remove(DLG_RESTRICT_LEFT_VALUE);\n },\n drag: function (event) {\n _this.trigger('drag', event);\n }\n });\n if (!isNullOrUndefined(this.targetEle)) {\n this.dragObj.dragArea = this.targetEle;\n }\n };\n Dialog.prototype.setButton = function () {\n this.buttonContent = [];\n this.btnObj = [];\n var primaryBtnFlag = true;\n for (var i = 0; i < this.buttons.length; i++) {\n var buttonType = !isNullOrUndefined(this.buttons[i].type) ? this.buttons[i].type.toLowerCase() : 'button';\n var btn = this.createElement('button', { attrs: { type: buttonType } });\n this.buttonContent.push(btn.outerHTML);\n }\n this.setFooterTemplate();\n for (var i = 0; i < this.buttons.length; i++) {\n this.btnObj[i] = new Button(this.buttons[i].buttonModel);\n if (typeof (this.buttons[i].click) === 'function') {\n EventHandler.add(this.ftrTemplateContent.children[i], 'click', this.buttons[i].click, this);\n }\n this.btnObj[i].appendTo(this.ftrTemplateContent.children[i]);\n this.btnObj[i].element.classList.add('e-flat');\n this.primaryButtonEle = this.element.getElementsByClassName('e-primary')[0];\n }\n };\n Dialog.prototype.setContent = function () {\n attributes(this.element, { 'aria-describedby': this.element.id + '_dialog-content' });\n this.contentEle = this.createElement('div', { className: DLG_CONTENT, id: this.element.id + '_dialog-content' });\n if (this.innerContentElement) {\n this.contentEle.appendChild(this.innerContentElement);\n }\n else if (!isNullOrUndefined(this.content) && this.content !== '' || !this.initialRender) {\n if (typeof (this.content) === 'string') {\n this.contentEle.innerHTML = this.content;\n }\n else if (this.content instanceof HTMLElement) {\n this.contentEle.appendChild(this.content);\n }\n else {\n this.setTemplate(this.content, this.contentEle);\n }\n }\n if (!isNullOrUndefined(this.headerContent)) {\n this.element.insertBefore(this.contentEle, this.element.children[1]);\n }\n else {\n this.element.insertBefore(this.contentEle, this.element.children[0]);\n }\n if (this.height === 'auto') {\n this.setMaxHeight();\n }\n };\n Dialog.prototype.setTemplate = function (template, toElement) {\n var templateFn = compile(template);\n var fromElements = [];\n for (var _i = 0, _a = templateFn({}); _i < _a.length; _i++) {\n var item = _a[_i];\n fromElements.push(item);\n }\n append([].slice.call(fromElements), toElement);\n };\n Dialog.prototype.setMaxHeight = function () {\n if (!this.allowMaxHeight) {\n return;\n }\n var display = this.element.style.display;\n this.element.style.display = 'none';\n this.element.style.maxHeight = (!isNullOrUndefined(this.target)) && (this.targetEle.offsetHeight < window.innerHeight) ?\n (this.targetEle.offsetHeight - 20) + 'px' : (window.innerHeight - 20) + 'px';\n this.element.style.display = display;\n };\n Dialog.prototype.setEnableRTL = function () {\n this.enableRtl ? addClass([this.element], RTL) : removeClass([this.element], RTL);\n if (!isNullOrUndefined(this.element.querySelector('.e-resize-handle'))) {\n removeResize();\n this.setResize();\n }\n };\n Dialog.prototype.setTargetContent = function () {\n if (isNullOrUndefined(this.content) || this.content === '') {\n var isContent = this.element.innerHTML.replace(/\\s/g, '') !== '';\n if (this.element.children.length > 0 || isContent) {\n this.innerContentElement = document.createDocumentFragment();\n while (this.element.childNodes.length !== 0) {\n this.innerContentElement.appendChild(this.element.childNodes[0]);\n }\n }\n }\n };\n Dialog.prototype.setHeader = function () {\n if (this.headerEle) {\n this.headerEle.innerHTML = '';\n }\n else {\n this.headerEle = this.createElement('div', { id: this.element.id + '_title', className: DLG_HEADER });\n }\n this.createHeaderContent();\n this.headerContent.appendChild(this.headerEle);\n this.setTemplate(this.header, this.headerEle);\n attributes(this.element, { 'aria-labelledby': this.element.id + '_title' });\n this.element.insertBefore(this.headerContent, this.element.children[0]);\n };\n Dialog.prototype.setFooterTemplate = function () {\n if (this.ftrTemplateContent) {\n this.ftrTemplateContent.innerHTML = '';\n }\n else {\n this.ftrTemplateContent = this.createElement('div', {\n className: DLG_FOOTER_CONTENT\n });\n }\n if (this.footerTemplate !== '' && !isNullOrUndefined(this.footerTemplate)) {\n this.setTemplate(this.footerTemplate, this.ftrTemplateContent);\n }\n else {\n this.ftrTemplateContent.innerHTML = this.buttonContent.join('');\n }\n this.element.appendChild(this.ftrTemplateContent);\n };\n Dialog.prototype.createHeaderContent = function () {\n if (isNullOrUndefined(this.headerContent)) {\n this.headerContent = this.createElement('div', { className: DLG_HEADER_CONTENT });\n }\n };\n Dialog.prototype.renderCloseIcon = function () {\n this.closeIcon = this.createElement('button', { className: DLG_CLOSE_ICON_BTN, attrs: { type: 'button' } });\n this.closeIconBtnObj = new Button({ cssClass: 'e-flat', iconCss: DLG_CLOSE_ICON + ' ' + ICON });\n this.closeIconTitle();\n if (!isNullOrUndefined(this.headerContent)) {\n prepend([this.closeIcon], this.headerContent);\n }\n else {\n this.createHeaderContent();\n prepend([this.closeIcon], this.headerContent);\n this.element.insertBefore(this.headerContent, this.element.children[0]);\n }\n this.closeIconBtnObj.appendTo(this.closeIcon);\n };\n Dialog.prototype.closeIconTitle = function () {\n this.l10n.setLocale(this.locale);\n var closeIconTitle = this.l10n.getConstant('close');\n this.closeIcon.setAttribute('title', closeIconTitle);\n };\n Dialog.prototype.setCSSClass = function (oldCSSClass) {\n if (this.cssClass) {\n addClass([this.element], this.cssClass.split(' '));\n }\n if (oldCSSClass) {\n removeClass([this.element], oldCSSClass.split(' '));\n }\n };\n Dialog.prototype.setIsModal = function () {\n this.dlgContainer = this.createElement('div', { className: DLG_CONTAINER });\n this.element.classList.remove(DLG_SHOW);\n this.element.parentNode.insertBefore(this.dlgContainer, this.element);\n this.dlgContainer.appendChild(this.element);\n addClass([this.element], MODAL_DLG);\n this.dlgOverlay = this.createElement('div', { className: DLG_OVERLAY });\n this.dlgOverlay.style.zIndex = (this.zIndex - 1).toString();\n this.dlgContainer.appendChild(this.dlgOverlay);\n };\n Dialog.prototype.getValidFocusNode = function (items) {\n var node;\n for (var u = 0; u < items.length; u++) {\n node = items[u];\n if ((node.clientHeight > 0 || (node.tagName.toLowerCase() === 'a' && node.hasAttribute('href'))) && node.tabIndex > -1 &&\n !node.disabled && !this.disableElement(node, '[disabled],[aria-disabled=\"true\"],[type=\"hidden\"]')) {\n return node;\n }\n }\n return node;\n };\n Dialog.prototype.focusableElements = function (content) {\n if (!isNullOrUndefined(content)) {\n var value = 'input,select,textarea,button,a,[contenteditable=\"true\"],[tabindex]';\n var items = content.querySelectorAll(value);\n return this.getValidFocusNode(items);\n }\n return null;\n };\n Dialog.prototype.getAutoFocusNode = function (container) {\n var node = container.querySelector('.' + DLG_CLOSE_ICON_BTN);\n var value = '[autofocus]';\n var items = container.querySelectorAll(value);\n var validNode = this.getValidFocusNode(items);\n if (!isNullOrUndefined(validNode)) {\n node = validNode;\n }\n else {\n validNode = this.focusableElements(this.contentEle);\n if (!isNullOrUndefined(validNode)) {\n return node = validNode;\n }\n else if (!isNullOrUndefined(this.primaryButtonEle)) {\n return this.element.querySelector('.' + DLG_PRIMARY_BUTTON);\n }\n }\n return node;\n };\n Dialog.prototype.disableElement = function (element, t) {\n var elementMatch = element ? element.matches || element.webkitMatchesSelector || element.msMatchesSelector : null;\n if (elementMatch) {\n for (; element; element = element.parentNode) {\n if (element instanceof Element && elementMatch.call(element, t)) {\n /* istanbul ignore next */\n return element;\n }\n }\n }\n return null;\n };\n Dialog.prototype.focusContent = function () {\n var element = this.getAutoFocusNode(this.element);\n var node = !isNullOrUndefined(element) ? element : this.element;\n node.focus();\n this.bindEvent(this.element);\n };\n Dialog.prototype.bindEvent = function (element) {\n EventHandler.add(element, 'keydown', this.keyDown, this);\n };\n Dialog.prototype.unBindEvent = function (element) {\n EventHandler.remove(element, 'keydown', this.keyDown);\n };\n /**\n * Module required function\n * @private\n */\n Dialog.prototype.getModuleName = function () {\n return 'dialog';\n };\n /**\n * Called internally if any of the property value changed\n * @private\n */\n Dialog.prototype.onPropertyChanged = function (newProp, oldProp) {\n if (!this.element.classList.contains(ROOT)) {\n return;\n }\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'content':\n if (!isNullOrUndefined(this.content) && this.content !== '') {\n if (!isNullOrUndefined(this.contentEle) && this.contentEle.getAttribute('role') !== 'dialog') {\n this.contentEle.innerHTML = '';\n typeof (this.content) === 'string' ?\n this.contentEle.innerHTML = this.content : this.contentEle.appendChild(this.content);\n this.setMaxHeight();\n }\n else {\n this.setContent();\n }\n }\n else if (!isNullOrUndefined(this.contentEle)) {\n detach(this.contentEle);\n this.contentEle = null;\n }\n break;\n case 'header':\n if (this.header === '' || isNullOrUndefined(this.header)) {\n if (this.headerEle) {\n detach(this.headerEle);\n this.headerEle = null;\n }\n }\n else {\n this.setHeader();\n }\n break;\n case 'footerTemplate':\n if (this.footerTemplate === '' || isNullOrUndefined(this.footerTemplate)) {\n if (!this.ftrTemplateContent) {\n return;\n }\n detach(this.ftrTemplateContent);\n this.ftrTemplateContent = null;\n this.buttons = [{}];\n }\n else {\n this.setFooterTemplate();\n this.buttons = [{}];\n }\n break;\n case 'showCloseIcon':\n if (this.element.getElementsByClassName(DLG_CLOSE_ICON).length > 0) {\n if (!this.showCloseIcon && (this.header === '' || isNullOrUndefined(this.header))) {\n detach(this.headerContent);\n this.headerContent = null;\n }\n else if (!this.showCloseIcon) {\n detach(this.closeIcon);\n }\n }\n else {\n this.renderCloseIcon();\n this.wireEvents();\n }\n break;\n case 'locale':\n if (this.showCloseIcon) {\n this.closeIconTitle();\n }\n break;\n case 'visible':\n this.visible ? this.show() : this.hide();\n break;\n case 'isModal':\n this.updateIsModal();\n break;\n case 'height':\n setStyleAttribute(this.element, { 'height': formatUnit(newProp.height) });\n break;\n case 'width':\n setStyleAttribute(this.element, { 'width': formatUnit(newProp.width) });\n break;\n case 'zIndex':\n this.popupObj.zIndex = this.zIndex;\n if (this.isModal) {\n this.setOverlayZindex(this.zIndex);\n }\n this.calculatezIndex = false;\n break;\n case 'cssClass':\n this.setCSSClass(oldProp.cssClass);\n break;\n case 'buttons':\n var buttonCount = this.buttons.length;\n if (!isNullOrUndefined(this.ftrTemplateContent)) {\n detach(this.ftrTemplateContent);\n this.ftrTemplateContent = null;\n }\n for (var i = 0; i < buttonCount; i++) {\n if (!isNullOrUndefined(this.buttons[i].buttonModel)) {\n this.footerTemplate = '';\n this.setButton();\n }\n }\n break;\n case 'allowDragging':\n if (this.allowDragging && (!isNullOrUndefined(this.headerContent))) {\n this.setAllowDragging();\n }\n else {\n this.dragObj.destroy();\n }\n break;\n case 'target':\n this.popupObj.relateTo = newProp.target;\n break;\n case 'position':\n this.checkPositionData();\n if (this.isModal) {\n var positionX = isNullOrUndefined(oldProp.position.X) ? this.position.X : oldProp.position.X;\n var positionY = isNullOrUndefined(oldProp.position.Y) ? this.position.Y : oldProp.position.Y;\n if (this.dlgContainer.classList.contains('e-dlg-' + positionX + '-' + positionY)) {\n this.dlgContainer.classList.remove('e-dlg-' + positionX + '-' + positionY);\n }\n }\n this.positionChange();\n break;\n case 'enableRtl':\n this.setEnableRTL();\n break;\n case 'enableResize':\n this.setResize();\n break;\n }\n }\n };\n Dialog.prototype.updateIsModal = function () {\n this.element.setAttribute('aria-modal', this.isModal ? 'true' : 'false');\n if (this.isModal) {\n this.setIsModal();\n this.element.style.top = '0px';\n this.element.style.left = '0px';\n if (!isNullOrUndefined(this.targetEle)) {\n this.targetEle.appendChild(this.dlgContainer);\n }\n }\n else {\n removeClass([this.element], MODAL_DLG);\n removeClass([document.body], SCROLL_DISABLED);\n detach(this.dlgOverlay);\n while (this.dlgContainer.firstChild) {\n this.dlgContainer.parentElement.insertBefore(this.dlgContainer.firstChild, this.dlgContainer);\n }\n this.dlgContainer.parentElement.removeChild(this.dlgContainer);\n }\n if (this.visible) {\n this.show();\n }\n this.positionChange();\n };\n Dialog.prototype.setzIndex = function (zIndexElement, setPopupZindex) {\n var prevOnChange = this.isProtectedOnChange;\n this.isProtectedOnChange = true;\n this.zIndex = getZindexPartial(zIndexElement);\n this.isProtectedOnChange = prevOnChange;\n if (setPopupZindex) {\n this.popupObj.zIndex = this.zIndex;\n }\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @private\n */\n Dialog.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * To destroy the widget\n * @method destroy\n * @return {void}\n * @memberof dialog\n */\n Dialog.prototype.destroy = function () {\n if (this.element.classList.contains(ROOT)) {\n this.unWireEvents();\n _super.prototype.destroy.call(this);\n var classArray = [\n ROOT, RTL, MODAL_DLG\n ];\n removeClass([this.element, this.element], classArray);\n if (this.popupObj.element.classList.contains(POPUP_ROOT)) {\n this.popupObj.destroy();\n }\n /* istanbul ignore next */\n if (!isNullOrUndefined(this.btnObj)) {\n for (var i = void 0; i < this.btnObj.length; i++) {\n this.btnObj[i].destroy();\n }\n }\n if (this.isModal) {\n detach(this.dlgOverlay);\n this.dlgContainer.parentNode.insertBefore(this.element, this.dlgContainer);\n detach(this.dlgContainer);\n }\n this.element.innerHTML = '';\n while (this.element.attributes.length > 0) {\n this.element.removeAttribute(this.element.attributes[0].name);\n }\n for (var k = 0; k < this.clonedEle.attributes.length; k++) {\n this.element.setAttribute(this.clonedEle.attributes[k].name, this.clonedEle.attributes[k].value);\n }\n }\n };\n /**\n * Binding event to the element while widget creation\n * @hidden\n */\n Dialog.prototype.wireEvents = function () {\n if (this.showCloseIcon) {\n EventHandler.add(this.closeIcon, 'click', this.closeIconClickEventHandler, this);\n }\n if (this.isModal) {\n EventHandler.add(this.dlgOverlay, 'click', this.dlgOverlayClickEventHandler, this);\n }\n };\n /**\n * Unbinding event to the element while widget destroy\n * @hidden\n */\n Dialog.prototype.unWireEvents = function () {\n if (this.showCloseIcon) {\n EventHandler.remove(this.closeIcon, 'click', this.closeIconClickEventHandler);\n }\n if (this.isModal) {\n EventHandler.remove(this.dlgOverlay, 'click', this.dlgOverlayClickEventHandler);\n }\n if (!isNullOrUndefined(this.buttons[0].buttonModel)) {\n for (var i = 0; i < this.buttons.length; i++) {\n if (typeof (this.buttons[i].click) === 'function') {\n EventHandler.remove(this.ftrTemplateContent.children[i], 'click', this.buttons[i].click);\n }\n }\n }\n };\n /**\n * Refreshes the dialog's position when the user changes its header and footer height/width dynamically.\n * @return {void}\n */\n Dialog.prototype.refreshPosition = function () {\n this.popupObj.refreshPosition();\n };\n /**\n * Opens the dialog if it is in hidden state.\n * To open the dialog with full screen width, set the parameter to true.\n * @param { boolean } isFullScreen - Enable the fullScreen Dialog.\n * @return {void}\n */\n Dialog.prototype.show = function (isFullScreen) {\n if (!this.element.classList.contains(ROOT)) {\n return;\n }\n if (!this.element.classList.contains(DLG_SHOW) || (!isNullOrUndefined(isFullScreen))) {\n if (!isNullOrUndefined(isFullScreen)) {\n this.fullScreen(isFullScreen);\n }\n var eventArgs = {\n cancel: false,\n element: this.element,\n container: this.isModal ? this.dlgContainer : this.element,\n target: this.target,\n maxHeight: this.element.style.maxHeight\n };\n this.trigger('beforeOpen', eventArgs);\n if (eventArgs.cancel) {\n return;\n }\n if (this.element.style.maxHeight !== eventArgs.maxHeight) {\n this.allowMaxHeight = false;\n this.element.style.maxHeight = eventArgs.maxHeight;\n }\n this.storeActiveElement = document.activeElement;\n this.element.tabIndex = -1;\n if (this.isModal && (!isNullOrUndefined(this.dlgOverlay))) {\n this.dlgOverlay.style.display = 'block';\n this.dlgContainer.style.display = 'flex';\n removeClass([this.dlgOverlay], 'e-fade');\n if (!isNullOrUndefined(this.targetEle)) {\n if (this.targetEle === document.body) {\n this.dlgContainer.style.position = 'fixed';\n }\n else {\n this.dlgContainer.style.position = 'absolute';\n }\n this.dlgOverlay.style.position = 'absolute';\n this.element.style.position = 'relative';\n addClass([this.targetEle], SCROLL_DISABLED);\n }\n else {\n addClass([document.body], SCROLL_DISABLED);\n }\n }\n var openAnimation = {\n name: this.animationSettings.effect + 'In',\n duration: this.animationSettings.duration,\n delay: this.animationSettings.delay\n };\n var zIndexElement = (this.isModal) ? this.element.parentElement : this.element;\n if (this.calculatezIndex) {\n this.setzIndex(zIndexElement, true);\n setStyleAttribute(this.element, { 'zIndex': this.zIndex });\n if (this.isModal) {\n this.setOverlayZindex(this.zIndex);\n }\n }\n this.animationSettings.effect === 'None' ? this.popupObj.show() : this.popupObj.show(openAnimation);\n this.dialogOpen = true;\n var prevOnChange = this.isProtectedOnChange;\n this.isProtectedOnChange = true;\n this.visible = true;\n this.isProtectedOnChange = prevOnChange;\n }\n };\n /**\n * Closes the dialog if it is in visible state.\n * @return {void}\n */\n Dialog.prototype.hide = function (event) {\n if (!this.element.classList.contains(ROOT)) {\n return;\n }\n var eventArgs = {\n cancel: false,\n isInteraction: event ? true : false,\n isInteracted: event ? true : false,\n element: this.element,\n target: this.target,\n container: this.isModal ? this.dlgContainer : this.element,\n event: event\n };\n this.trigger('beforeClose', eventArgs);\n this.closeArgs = eventArgs;\n if (eventArgs.cancel) {\n return;\n }\n if (this.isModal) {\n !isNullOrUndefined(this.targetEle) ? removeClass([this.targetEle], SCROLL_DISABLED) :\n removeClass([document.body], SCROLL_DISABLED);\n }\n var closeAnimation = {\n name: this.animationSettings.effect + 'Out',\n duration: this.animationSettings.duration,\n delay: this.animationSettings.delay\n };\n this.animationSettings.effect === 'None' ? this.popupObj.hide() : this.popupObj.hide(closeAnimation);\n this.dialogOpen = false;\n var prevOnChange = this.isProtectedOnChange;\n this.isProtectedOnChange = true;\n this.visible = false;\n this.isProtectedOnChange = prevOnChange;\n };\n /**\n * Specifies to view the Full screen Dialog.\n * @private\n */\n Dialog.prototype.fullScreen = function (args) {\n var top = this.element.offsetTop;\n var left = this.element.offsetLeft;\n if (args) {\n addClass([this.element], FULLSCREEN);\n var display = this.element.style.display;\n this.element.style.display = 'none';\n this.element.style.maxHeight = (!isNullOrUndefined(this.target)) ?\n (this.targetEle.offsetHeight) + 'px' : (window.innerHeight) + 'px';\n this.element.style.display = display;\n addClass([document.body], SCROLL_DISABLED);\n if (this.allowDragging && !isNullOrUndefined(this.dragObj)) {\n this.dragObj.destroy();\n }\n }\n else {\n removeClass([this.element], FULLSCREEN);\n removeClass([document.body], SCROLL_DISABLED);\n if (this.allowDragging && (!isNullOrUndefined(this.headerContent))) {\n this.setAllowDragging();\n }\n }\n return args;\n };\n /**\n * Returns the dialog button instances.\n * Based on that, you can dynamically change the button states.\n * @param { number } index - Index of the button.\n * @return {Button}\n */\n Dialog.prototype.getButtons = function (index) {\n if (!isNullOrUndefined(index)) {\n return this.btnObj[index];\n }\n return this.btnObj;\n };\n __decorate([\n Property('')\n ], Dialog.prototype, \"content\", void 0);\n __decorate([\n Property(false)\n ], Dialog.prototype, \"showCloseIcon\", void 0);\n __decorate([\n Property(false)\n ], Dialog.prototype, \"isModal\", void 0);\n __decorate([\n Property('')\n ], Dialog.prototype, \"header\", void 0);\n __decorate([\n Property(true)\n ], Dialog.prototype, \"visible\", void 0);\n __decorate([\n Property(false)\n ], Dialog.prototype, \"enableResize\", void 0);\n __decorate([\n Property('auto')\n ], Dialog.prototype, \"height\", void 0);\n __decorate([\n Property('100%')\n ], Dialog.prototype, \"width\", void 0);\n __decorate([\n Property('')\n ], Dialog.prototype, \"cssClass\", void 0);\n __decorate([\n Property(1000)\n ], Dialog.prototype, \"zIndex\", void 0);\n __decorate([\n Property(null)\n ], Dialog.prototype, \"target\", void 0);\n __decorate([\n Property('')\n ], Dialog.prototype, \"footerTemplate\", void 0);\n __decorate([\n Property(false)\n ], Dialog.prototype, \"allowDragging\", void 0);\n __decorate([\n Collection([{}], ButtonProps)\n ], Dialog.prototype, \"buttons\", void 0);\n __decorate([\n Property(true)\n ], Dialog.prototype, \"closeOnEscape\", void 0);\n __decorate([\n Complex({}, AnimationSettings)\n ], Dialog.prototype, \"animationSettings\", void 0);\n __decorate([\n Complex({ X: 'center', Y: 'center' }, PositionData)\n ], Dialog.prototype, \"position\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"beforeOpen\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"close\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"beforeClose\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"dragStart\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"dragStop\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"drag\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"overlayClick\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"resizeStart\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"resizing\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"resizeStop\", void 0);\n Dialog = __decorate([\n NotifyPropertyChanges\n ], Dialog);\n return Dialog;\n}(Component));\nexport { Dialog };\n/**\n * Base for creating Alert and Confirmation Dialog through util method.\n */\nexport var DialogUtility;\n(function (DialogUtility) {\n /**\n * An alert dialog box is used to display warning like messages to the users.\n * ```\n * Eg : DialogUtility.alert('Alert message');\n *\n * ```\n */\n /* istanbul ignore next */\n function alert(args) {\n var dialogComponent;\n var dialogElement = createElement('div', { 'className': DLG_UTIL_ALERT });\n document.body.appendChild(dialogElement);\n var alertDialogObj;\n var okButtonModel = [{\n buttonModel: { isPrimary: true, content: 'OK' },\n click: function () {\n this.hide();\n }\n }];\n if (typeof (args) === 'string') {\n alertDialogObj = createDialog({ content: args,\n position: { X: 'center', Y: 'top' },\n isModal: true, header: DLG_UTIL_DEFAULT_TITLE,\n buttons: okButtonModel }, dialogElement);\n }\n else {\n alertDialogObj = createDialog(alertOptions(args), dialogElement);\n }\n alertDialogObj.close = function () {\n if (args && args.close) {\n args.close.apply(alertDialogObj);\n }\n alertDialogObj.destroy();\n if (alertDialogObj.element.classList.contains('e-dlg-modal')) {\n alertDialogObj.element.parentElement.remove();\n alertDialogObj.target.classList.remove(DLG_UTIL_ROOT);\n }\n else {\n alertDialogObj.element.remove();\n }\n };\n return alertDialogObj;\n }\n DialogUtility.alert = alert;\n /**\n * A confirm dialog displays a specified message along with ‘OK’ and ‘Cancel’ button.\n * ```\n * Eg : DialogUtility.confirm('Confirm dialog message');\n *\n * ```\n */\n /* istanbul ignore next */\n function confirm(args) {\n var dialogComponent;\n var dialogElement = createElement('div', { 'className': DLG_UTIL_CONFIRM });\n document.body.appendChild(dialogElement);\n var confirmDialogObj;\n var okCancelButtonModel = [{\n buttonModel: { isPrimary: true, content: 'OK' },\n click: function () {\n this.hide();\n }\n }, {\n buttonModel: { content: 'Cancel' },\n click: function () {\n this.hide();\n }\n }];\n if (typeof (args) === 'string') {\n confirmDialogObj = createDialog({ position: { X: 'center', Y: 'top' }, content: args, isModal: true,\n header: DLG_UTIL_DEFAULT_TITLE, buttons: okCancelButtonModel\n }, dialogElement);\n }\n else {\n confirmDialogObj = createDialog(confirmOptions(args), dialogElement);\n }\n confirmDialogObj.close = function () {\n if (args && args.close) {\n args.close.apply(confirmDialogObj);\n }\n confirmDialogObj.destroy();\n if (confirmDialogObj.element.classList.contains('e-dlg-modal')) {\n confirmDialogObj.element.parentElement.remove();\n confirmDialogObj.target.classList.remove(DLG_UTIL_ROOT);\n }\n else {\n confirmDialogObj.element.remove();\n }\n };\n return confirmDialogObj;\n }\n DialogUtility.confirm = confirm;\n function createDialog(options, element) {\n var dialogObject = new Dialog(options);\n dialogObject.appendTo(element);\n return dialogObject;\n }\n function alertOptions(option) {\n var options = {};\n options.buttons = [];\n options = formOptions(options, option);\n options = setAlertButtonModel(options, option);\n return options;\n }\n function confirmOptions(option) {\n var options = {};\n options.buttons = [];\n options = formOptions(options, option);\n options = setConfirmButtonModel(options, option);\n return options;\n }\n function formOptions(options, option) {\n options.header = !isNullOrUndefined(option.title) ? option.title : DLG_UTIL_DEFAULT_TITLE;\n options.content = !isNullOrUndefined(option.content) ? option.content : '';\n options.isModal = !isNullOrUndefined(option.isModal) ? option.isModal : true;\n options.showCloseIcon = !isNullOrUndefined(option.showCloseIcon) ? option.showCloseIcon : false;\n options.allowDragging = !isNullOrUndefined(option.isDraggable) ? option.isDraggable : false;\n options.closeOnEscape = !isNullOrUndefined(option.closeOnEscape) ? option.closeOnEscape : false;\n options.position = !isNullOrUndefined(option.position) ? option.position : { X: 'center', Y: 'top' };\n options.animationSettings = !isNullOrUndefined(option.animationSettings) ? option.animationSettings :\n { effect: 'Fade', duration: 400, delay: 0 };\n options.cssClass = !isNullOrUndefined(option.cssClass) ? option.cssClass : '';\n options.zIndex = !isNullOrUndefined(option.zIndex) ? option.zIndex : 1000;\n options.open = !isNullOrUndefined(option.open) ? option.open : null;\n return options;\n }\n function setAlertButtonModel(options, option) {\n var alertButtonModel = [{\n buttonModel: { isPrimary: true, content: 'OK' },\n click: function () {\n this.hide();\n }\n }];\n if (!isNullOrUndefined(option.okButton)) {\n options.buttons[0] = formButtonModel(options.buttons[0], option.okButton, alertButtonModel[0]);\n }\n else {\n options.buttons = alertButtonModel;\n }\n return options;\n }\n function setConfirmButtonModel(options, option) {\n var okButtonModel = {\n buttonModel: { isPrimary: true, content: 'OK' },\n click: function () {\n this.hide();\n }\n };\n var cancelButtonModel = {\n buttonModel: { content: 'Cancel' },\n click: function () {\n this.hide();\n }\n };\n if (!isNullOrUndefined(option.okButton)) {\n options.buttons[0] = formButtonModel(options.buttons[0], option.okButton, okButtonModel);\n }\n else {\n options.buttons[0] = okButtonModel;\n }\n if (!isNullOrUndefined(option.cancelButton)) {\n options.buttons[1] = formButtonModel(options.buttons[1], option.cancelButton, cancelButtonModel);\n }\n else {\n options.buttons[1] = cancelButtonModel;\n }\n return options;\n }\n function formButtonModel(buttonModel, option, buttonPropModel) {\n var buttonProps = buttonPropModel;\n if (!isNullOrUndefined(option.text)) {\n buttonProps.buttonModel.content = option.text;\n }\n if (!isNullOrUndefined(option.icon)) {\n buttonProps.buttonModel.iconCss = option.icon;\n }\n if (!isNullOrUndefined(option.cssClass)) {\n buttonProps.buttonModel.cssClass = option.cssClass;\n }\n if (!isNullOrUndefined(option.click)) {\n buttonProps.click = option.click;\n }\n return buttonProps;\n }\n})(DialogUtility || (DialogUtility = {}));\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, Property, ChildProperty, Event, append, compile } from '@syncfusion/ej2-base';\nimport { EventHandler, Touch, Browser, Animation as PopupAnimation } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, getUniqueID, formatUnit } from '@syncfusion/ej2-base';\nimport { attributes, closest, removeClass, addClass, remove } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, Complex } from '@syncfusion/ej2-base';\nimport { Popup } from '../popup/popup';\nimport { calculatePosition } from '../common/position';\nimport { isCollide, fit } from '../common/collision';\nvar TOUCHEND_HIDE_DELAY = 1500;\nvar TAPHOLD_THRESHOLD = 500;\nvar SHOW_POINTER_TIP_GAP = 0;\nvar HIDE_POINTER_TIP_GAP = 8;\nvar MOUSE_TRAIL_GAP = 2;\nvar POINTER_ADJUST = 2;\nvar ROOT = 'e-tooltip';\nvar RTL = 'e-rtl';\nvar DEVICE = 'e-bigger';\nvar ICON = 'e-icons';\nvar CLOSE = 'e-tooltip-close';\nvar TOOLTIP_WRAP = 'e-tooltip-wrap';\nvar CONTENT = 'e-tip-content';\nvar ARROW_TIP = 'e-arrow-tip';\nvar ARROW_TIP_OUTER = 'e-arrow-tip-outer';\nvar ARROW_TIP_INNER = 'e-arrow-tip-inner';\nvar TIP_BOTTOM = 'e-tip-bottom';\nvar TIP_TOP = 'e-tip-top';\nvar TIP_LEFT = 'e-tip-left';\nvar TIP_RIGHT = 'e-tip-right';\nvar POPUP_ROOT = 'e-popup';\nvar POPUP_OPEN = 'e-popup-open';\nvar POPUP_CLOSE = 'e-popup-close';\nvar POPUP_LIB = 'e-lib';\nvar Animation = /** @class */ (function (_super) {\n __extends(Animation, _super);\n function Animation() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property({ effect: 'FadeIn', duration: 150, delay: 0 })\n ], Animation.prototype, \"open\", void 0);\n __decorate([\n Property({ effect: 'FadeOut', duration: 150, delay: 0 })\n ], Animation.prototype, \"close\", void 0);\n return Animation;\n}(ChildProperty));\nexport { Animation };\n/**\n * Represents the Tooltip component that displays a piece of information about the target element on mouse hover.\n * ```html\n *
';\n }\n if (this.getParentPosition(data) === 'FSType3') {\n div = div + 'left:' + (data.childLeft - 20) + 'px;top:' +\n ((data.childIndex * data.rowHeight) + this.getTaskbarMidpoint(isMilestoneParent) - (this.lineStroke - 1)) + 'px;' +\n 'width:1px;height:' + heightValue + 'px;position:absolute\" data-connectortype=\"FSType3\">';\n div = div + rightArrow;\n div = div + 'left:10px;' + this.getBorderStyles('left', 10) +\n 'border-bottom-width:' + (5 + this.lineStroke) + 'px;border-top-width:' + (5 + this.lineStroke) + 'px;' +\n 'top:' + (-6) + 'px;width:0;height:0;position:relative;\">';\n div = div + eLine;\n div = div + 'width:10px;' + this.getBorderStyles('top', this.lineStroke) +\n 'position:relative;top:' + (-(6 + (5 + this.lineStroke) + Math.round(this.lineStroke / 2))) + 'px;\">';\n div = div + eLine;\n div = div + 'width:' + this.lineStroke + 'px;' + this.getBorderStyles('top', (heightValue - this.getconnectorLineGap(data) - this.lineStroke + 1)) +\n 'position:relative;top:' + (-(13 + ((this.lineStroke - 1) * 2))) + 'px;\">';\n div = div + eLine;\n div = div + 'width:' + (((data.parentLeft + data.parentWidth) - data.childLeft) + 30) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;top:' +\n (-(13 + ((this.lineStroke - 1) * 2))) + 'px;\">';\n div = div + eLine;\n div = div + 'left:' + (((data.parentLeft + data.parentWidth) - data.childLeft) + (30 - this.lineStroke)) +\n 'px;width:0px;' + 'height:' + (this.getconnectorLineGap(data) - this.lineStroke) + 'px;' +\n this.getBorderStyles('left', this.lineStroke) + 'position:relative;' +\n 'top:' + (-(13 + ((this.lineStroke - 1) * 2))) + 'px;\">';\n div = div + eLine;\n div = div + (isMilestoneParent ? 'left:' + (((data.parentLeft +\n data.parentWidth) - data.childLeft) + (18 - this.lineStroke)) + 'px;width:' + (12 + this.lineStroke) + 'px;' : 'left:' +\n (((data.parentLeft + data.parentWidth) - data.childLeft) + 20) + 'px;width:10px;') +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;top:' +\n (-(13 + ((this.lineStroke - 1) * 2))) + 'px;\">';\n }\n if (this.getParentPosition(data) === 'FSType4') {\n div = div + 'left:' + (data.parentLeft + data.parentWidth) + 'px;top:' +\n ((data.childIndex * data.rowHeight) + this.getTaskbarMidpoint(isMilestone) - (this.lineStroke - 1)) + 'px;' +\n 'width:1px;height:' + heightValue + 'px;position:absolute\" data-connectortype=\"FSType4\">';\n div = div + rightArrow;\n div = div + 'left:' + (data.childLeft - (data.parentLeft + data.parentWidth + 10)) + 'px;' +\n this.getBorderStyles('left', 10) + 'top:' + (-6) + 'px;' +\n 'border-bottom-width:' + (5 + this.lineStroke) + 'px;border-top-width:' +\n (5 + this.lineStroke) + 'px;width:0;height:0;position:relative;\">';\n div = div + eLine;\n div = div + 'left:' + (data.childLeft - (data.parentLeft + data.parentWidth) - 20) +\n 'px;top:' + (-(6 + (5 + this.lineStroke) + Math.round(this.lineStroke / 2))) + 'px;width:10px;' +\n this.getBorderStyles('top', this.lineStroke) +\n 'position:relative;\">';\n div = div + eLine;\n div = div + 'top:' + (-(13 + ((this.lineStroke - 1) * 2))) + 'px;left:' +\n (data.childLeft - (data.parentLeft + data.parentWidth) - 20) + 'px;width:0px;' +\n this.getBorderStyles('left', this.lineStroke) +\n this.getBorderStyles('top', (heightValue - this.lineStroke + 1)) + 'position:relative;\">';\n div = div + eLine;\n div = div + (isMilestoneParent ? 'left:-1px;' : '') + 'top:' +\n (-(13 + ((this.lineStroke - 1) * 2))) + 'px;width:' +\n (isMilestoneParent ? ((data.childLeft - (data.parentLeft + data.parentWidth + 20) + 1) + this.lineStroke) :\n ((data.childLeft - (data.parentLeft + data.parentWidth + 20)) + this.lineStroke)) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n }\n if (this.getParentPosition(data) === 'SSType4') {\n div = div + 'left:' + (data.parentLeft - 10) + 'px;top:' +\n ((data.childIndex * data.rowHeight) + this.getTaskbarMidpoint(isMilestone) - (this.lineStroke - 1)) + 'px;' +\n 'width:1px;height:' + heightValue + 'px;position:absolute\" data-connectortype=\"SSType4\">';\n div = div + rightArrow;\n div = div + 'left:' + (data.childLeft - data.parentLeft) + 'px;' + duplicateStingTwo;\n div = div + eLine;\n div = div + 'top:' + (-(6 + (5 + this.lineStroke) + (this.lineStroke / 2))) + 'px;width:' +\n (data.childLeft - data.parentLeft) + 'px;' + duplicateStingThree;\n div = div + eLine;\n div = div + 'top:' + (-(13 + ((this.lineStroke - 1) * 2))) + 'px;width:10px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n }\n if (this.getParentPosition(data) === 'SSType3') {\n div = div + 'left:' + (data.childLeft - 20) + 'px;top:' +\n ((data.childIndex * data.rowHeight) + this.getTaskbarMidpoint(isMilestone) - (this.lineStroke - 1)) + 'px;' +\n 'width:1px;height:' + heightValue + 'px;position:absolute\" data-connectortype=\"SSType3\">';\n div = div + rightArrow;\n div = div + 'left:10px;' + duplicateStingTwo;\n div = div + eLine;\n div = div + 'top:' + (-(6 + (5 + this.lineStroke) + (this.lineStroke / 2))) + 'px;width:10px;' + duplicateStingThree;\n div = div + eLine;\n div = div + 'top:' + (-(13 + ((this.lineStroke - 1) * 2))) + 'px;width:' +\n (data.parentLeft - data.childLeft + 21) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n }\n if (this.getParentPosition(data) === 'SSType2') {\n div = div + 'left:' + setInnerElementLeftSSType2 + 'px;top:' +\n ((data.parentIndex * data.rowHeight) + this.getTaskbarMidpoint(isMilestoneParent) - (this.lineStroke - 1)) + 'px;' +\n 'width:1px;height:' + heightValue + 'px;position:absolute\" data-connectortype=\"SSType2\">';\n div = div + eLine;\n div = div + 'width:' + (setInnerChildWidthSSType2 + 1) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'width:0px;' + this.getBorderStyles('left', this.lineStroke) +\n this.getBorderStyles('top', (heightValue - this.lineStroke)) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'width:' + setInnerElementWidthSSType2 + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + rightArrow;\n div = div + 'left:' + setInnerElementWidthSSType2 + 'px;' +\n this.getBorderStyles('left', 10) + 'top:' + (-6 - this.lineStroke) + 'px;' +\n 'border-bottom-width:' + (5 + this.lineStroke) + 'px;border-top-width:' +\n (5 + this.lineStroke) + 'px;width:0;' +\n 'height:0;position:relative;\">';\n }\n if (this.getParentPosition(data) === 'SSType1') {\n div = div + 'left:' + (data.childLeft - 20) + 'px;top:' + ((data.parentIndex * data.rowHeight) +\n this.getTaskbarMidpoint(isMilestoneParent) - (this.lineStroke - 1)) + 'px;' +\n 'width:1px;height:' + heightValue + 'px;position:absolute\" data-connectortype=\"SSType1\">';\n div = div + eLine;\n div = div + 'width:' + (data.parentLeft - data.childLeft + 21) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'width:0px;' + this.getBorderStyles('left', this.lineStroke) +\n this.getBorderStyles('top', (heightValue - this.lineStroke)) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'width:10px;' + this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + rightArrow;\n div = div + 'left:10px;' + this.getBorderStyles('left', 10) +\n 'top:' + (-6 - this.lineStroke) + 'px;border-bottom-width:' + (5 + this.lineStroke) + 'px;' +\n 'border-top-width:' + (5 + this.lineStroke) + 'px;width:0;height:0;position:relative;\">';\n }\n if (this.getParentPosition(data) === 'FFType1') {\n div = div + 'left:' + (data.childLeft + data.childWidth) + 'px;top:' +\n ((data.parentIndex * data.rowHeight) + this.getTaskbarMidpoint(isMilestoneParent) - (this.lineStroke - 1)) + 'px;' +\n 'width:1px;height:' + heightValue + 'px;position:absolute\" data-connectortype=\"FFType1\">';\n div = div + eLine;\n div = div + 'left:' + (isMilestoneParent ? (((data.parentLeft + data.parentWidth) -\n (data.childLeft + data.childWidth)) - 1) : (((data.parentLeft + data.parentWidth) -\n (data.childLeft + data.childWidth)))) + 'px;' +\n 'width:' + (isMilestoneParent ? (21 + this.lineStroke) : (20 + this.lineStroke)) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'left:' + (isMilestoneParent ? (((data.parentLeft + data.parentWidth) -\n (data.childLeft + data.childWidth)) + 20) : (((data.parentLeft + data.parentWidth) -\n (data.childLeft + data.childWidth)) + 20)) + 'px;width:0px;' + this.getBorderStyles('left', this.lineStroke) +\n this.getBorderStyles('top', (heightValue - this.lineStroke)) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'left:' + (isMilestone ? 4 : 10) + 'px;width:' + (isMilestone ?\n (((data.parentLeft + data.parentWidth) - (data.childLeft + data.childWidth)) + (16 + this.lineStroke)) :\n (((data.parentLeft + data.parentWidth) - (data.childLeft + data.childWidth)) + (10 + this.lineStroke))) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + leftArrow;\n div = div + (isMilestone ? 'left:0px;' : '') + this.getBorderStyles('right', 10) +\n 'top:' + (-6 - this.lineStroke) + 'px;border-bottom-width:' + (5 + this.lineStroke) + 'px;' +\n 'border-top-width:' + (5 + this.lineStroke) + 'px;width:0;height:0;position:relative;\">';\n }\n if (this.getParentPosition(data) === 'FFType2') {\n div = div + 'left:' + (data.parentLeft + data.parentWidth) + 'px;top:' +\n ((data.parentIndex * data.rowHeight) + this.getTaskbarMidpoint(isMilestoneParent) - (this.lineStroke - 1)) + 'px;' +\n 'width:1px;height:' + heightValue + 'px;position:absolute\" data-connectortype=\"FFType2\">';\n div = div + eLine;\n div = div + (isMilestoneParent ? 'left:-1px;' : '') + 'width:' +\n (isMilestoneParent ? (((data.childLeft + data.childWidth) - (data.parentLeft + data.parentWidth)) +\n (21 + this.lineStroke)) : (((data.childLeft + data.childWidth) -\n (data.parentLeft + data.parentWidth)) + (20 + this.lineStroke))) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'left:' + (((data.childLeft + data.childWidth) - (data.parentLeft + data.parentWidth)) + 20) +\n 'px;width:0px;' + this.getBorderStyles('left', this.lineStroke) +\n this.getBorderStyles('top', (heightValue - this.lineStroke)) +\n 'position:relative;\">';\n div = div + eLine;\n div = div + 'left:' + (isMilestone ? (((data.childLeft + data.childWidth) - (data.parentLeft + data.parentWidth)) + 4) :\n (((data.childLeft + data.childWidth) - (data.parentLeft + data.parentWidth)) + 10)) + 'px;' +\n 'width:' + (isMilestone ? (16 + this.lineStroke) : (10 + this.lineStroke)) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + leftArrow;\n div = div + 'left:' + (isMilestone ? (((data.childLeft + data.childWidth) - (data.parentLeft + data.parentWidth))) :\n (((data.childLeft + data.childWidth) - (data.parentLeft + data.parentWidth)))) + 'px;' +\n this.getBorderStyles('right', 10) + 'top:' + (-6 - this.lineStroke) + 'px;' +\n 'border-bottom-width:' + (5 + this.lineStroke) + 'px;border-top-width:' + (5 + this.lineStroke) +\n 'px;width:0;height:0;position:relative;\">';\n }\n if (this.getParentPosition(data) === 'FFType3') {\n div = div + 'left:' + (data.childLeft + data.childWidth) + 'px;top:' +\n ((data.childIndex * data.rowHeight) + this.getTaskbarMidpoint(isMilestone) - (this.lineStroke - 1)) + 'px;' +\n 'width:1px;height:' + heightValue + 'px;position:absolute\" data-connectortype=\"FFType3\">';\n div = div + duplicateStingOne;\n div = div + eLine;\n div = div + (isMilestone ? ('left:4px;width:' +\n (((data.parentLeft + data.parentWidth) - (data.childLeft + data.childWidth)) + 16)) :\n ('left:10px;width:' + (((data.parentLeft + data.parentWidth) -\n (data.childLeft + data.childWidth)) + 10))) + 'px;top:' + (-(6 + (5 + this.lineStroke) +\n (this.lineStroke / 2))) + 'px;' + this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'left:' + (((data.parentLeft + data.parentWidth) - (data.childLeft + data.childWidth)) + 20) +\n 'px;top:' + (-(13 + ((this.lineStroke - 1) * 2))) + 'px;' +\n 'width:0px;' + this.getBorderStyles('left', this.lineStroke) +\n this.getBorderStyles('top', (heightValue - this.lineStroke + 1)) + 'position:relative;\">';\n div = div + eLine;\n div = div + (isMilestoneParent ? ('left:' + (((data.parentLeft + data.parentWidth) -\n (data.childLeft + data.childWidth)) - 1) + 'px;width:21') : ('left:' + (((data.parentLeft + data.parentWidth) -\n (data.childLeft + data.childWidth))) + 'px;width:20')) +\n 'px;top:' + (-(13 + ((this.lineStroke - 1) * 2))) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n }\n if (this.getParentPosition(data) === 'FFType4') {\n div = div + 'left:' + (data.parentLeft + data.parentWidth) + 'px;top:' +\n ((data.childIndex * data.rowHeight) + this.getTaskbarMidpoint(isMilestone) - (this.lineStroke - 1)) + 'px;' +\n 'width:1px;height:' + heightValue + 'px;position:absolute\" data-connectortype=\"FFType4\">';\n div = div + leftArrow;\n div = div + (isMilestone ? ('left:' + ((data.childLeft + data.childWidth) -\n (data.parentLeft + data.parentWidth))) :\n ('left:' + (((data.childLeft + data.childWidth) - (data.parentLeft + data.parentWidth))))) + 'px;' +\n this.getBorderStyles('right', 10) + 'top:' + (-5 - this.lineStroke + (this.lineStroke - 1)) + 'px;' +\n 'border-bottom-width:' + (5 + this.lineStroke) +\n 'px;border-top-width:' + (5 + this.lineStroke) + 'px;width:0;height:0;' +\n 'position:relative;\">';\n div = div + eLine;\n div = div + (isMilestone ? ('left:' + (((data.childLeft + data.childWidth) -\n (data.parentLeft + data.parentWidth)) + 4) +\n 'px;width:' + (16 + this.lineStroke)) : ('left:' + (((data.childLeft + data.childWidth) -\n (data.parentLeft + data.parentWidth)) + 10) + 'px;width:' + (10 + this.lineStroke))) +\n 'px;' + duplicateStingFive;\n div = div + eLine;\n div = div + 'left:' + (((data.childLeft + data.childWidth) -\n (data.parentLeft + data.parentWidth)) + 20) + 'px;top:' + (-(13 + ((this.lineStroke - 1) * 2))) +\n 'px;width:0px;' + this.getBorderStyles('left', this.lineStroke) +\n this.getBorderStyles('top', (heightValue - this.lineStroke + 1)) + 'position:relative;\">';\n div = div + eLine;\n div = div + (isMilestoneParent ? ('left:-1px;width:' + (((data.childLeft + data.childWidth) -\n (data.parentLeft + data.parentWidth)) + (21 + this.lineStroke))) : ('width:' + (((data.childLeft + data.childWidth) -\n (data.parentLeft + data.parentWidth)) + (20 + this.lineStroke)))) + 'px;top:' +\n (-(13 + ((this.lineStroke - 1) * 2))) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n }\n if (this.getParentPosition(data) === 'SFType4') {\n div = div + 'left:' + (data.parentLeft - 10) + 'px;top:' +\n ((data.childIndex * data.rowHeight) + this.getTaskbarMidpoint(isMilestone) - (this.lineStroke - 1)) + 'px;width:1px;' +\n 'height:' + heightValue + 'px;position:absolute\" data-connectortype=\"SFType4\">';\n div = div + duplicateStingFour + 'top:' + (-5 - this.lineStroke + (this.lineStroke - 1)) + 'px;' +\n 'border-bottom-width:' + (5 + this.lineStroke) +\n 'px;border-top-width:' + (5 + this.lineStroke) + 'px;width:0;height:0;' +\n 'position:relative;\">';\n div = div + eLine;\n div = div + 'left:' + (isMilestone ? ((((data.childLeft + data.childWidth) - (data.parentLeft)) + (14 + this.lineStroke)) +\n 'px;width:16') : ((((data.childLeft + data.childWidth) - (data.parentLeft)) + 20) + 'px;width:' +\n (10 + this.lineStroke))) + 'px;' + duplicateStingFive;\n div = div + eLine;\n div = div + 'left:' + (((data.childLeft + data.childWidth) - (data.parentLeft)) + 30) + 'px;top:' +\n (-(13 + ((this.lineStroke - 1) * 2))) + 'px;width:0px;' + this.getBorderStyles('left', this.lineStroke) +\n this.getBorderStyles('top', (heightValue - this.getconnectorLineGap(data) - (this.lineStroke - 1))) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'top:' + (-(13 + ((this.lineStroke - 1) * 2))) + 'px;width:' +\n (((data.childLeft + data.childWidth) - (data.parentLeft)) + (30 + this.lineStroke)) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'top:' + (-(13 + ((this.lineStroke - 1) * 2))) + 'px;width:0px;' +\n this.getBorderStyles('left', this.lineStroke) +\n this.getBorderStyles('top', (this.getconnectorLineGap(data) - this.lineStroke)) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'top:' + (-(13 + ((this.lineStroke - 1) * 2))) + 'px;width:11px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n }\n if (this.getParentPosition(data) === 'SFType3') {\n div = div + 'left:' + (data.childLeft + data.childWidth) + 'px;top:' +\n ((data.childIndex * data.rowHeight) + this.getTaskbarMidpoint(isMilestone) - (this.lineStroke - 1)) + 'px;' +\n 'width:1px;height:' + heightValue + 'px;position:absolute\" data-connectortype=\"SFType3\">';\n div = div + duplicateStingOne;\n div = div + eLine;\n div = div + (isMilestone ? 'left:4px;width:' + (16 + this.lineStroke) : 'left:10px;width:' +\n (10 + this.lineStroke)) + 'px;top:' + (-(13 + ((this.lineStroke - 1) * 2) - 1)) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'left:20px;top:' + (-(13 + ((this.lineStroke - 1) * 2))) + 'px;width:0px;' +\n this.getBorderStyles('left', this.lineStroke) +\n this.getBorderStyles('top', (heightValue - (this.lineStroke - 1))) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'left:20px;top:' + (-(13 + ((this.lineStroke - 1) * 2))) + 'px;width:' +\n ((data.parentLeft - (data.childLeft + data.childWidth + 20)) + this.lineStroke) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n }\n if (this.getParentPosition(data) === 'SFType1') {\n div = div + 'left:' + (data.parentLeft - 10) + 'px;top:' +\n ((data.parentIndex * data.rowHeight) + this.getTaskbarMidpoint(isMilestone) - (this.lineStroke - 1)) + 'px;' +\n 'width:1px;height:' + heightValue + 'px;position:absolute\" data-connectortype=\"SFType1\">';\n div = div + eLine;\n div = div + 'width:11px;' + this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'width:0px;' + this.getBorderStyles('left', this.lineStroke) +\n this.getBorderStyles('top', (heightValue - this.getconnectorLineGap(data) - this.lineStroke)) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'width:' + (((data.childLeft + data.childWidth) - (data.parentLeft)) + (30 + this.lineStroke)) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'left:' + (((data.childLeft + data.childWidth) - (data.parentLeft)) + 30) +\n 'px;width:0px;' + this.getBorderStyles('left', this.lineStroke) +\n this.getBorderStyles('top', (this.getconnectorLineGap(data) - this.lineStroke)) + 'position:relative;\">';\n div = div + eLine;\n div = div + (isMilestone ? ('left:' + (((data.childLeft + data.childWidth) -\n (data.parentLeft)) + 15) + 'px;width:' + (15 + this.lineStroke)) : ('left:' +\n (((data.childLeft + data.childWidth) - (data.parentLeft)) + 20) + 'px;width:' + (10 + this.lineStroke))) + 'px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + duplicateStingFour + 'top:' + (-6 - this.lineStroke) + 'px;' +\n 'border-bottom-width:' + (5 + this.lineStroke) + 'px;border-top-width:' +\n (5 + this.lineStroke) + 'px;position:relative;\">';\n }\n if (this.getParentPosition(data) === 'SFType2') {\n div = div + 'left:' + (data.childLeft + data.childWidth) + 'px;top:' +\n ((data.parentIndex * data.rowHeight) + this.getTaskbarMidpoint(isMilestoneParent) - (this.lineStroke - 1)) + 'px;' +\n 'width:1px;height:' + heightValue + 'px;position:absolute\" data-connectortype=\"SFType2\">';\n div = div + eLine;\n div = div + 'left:' + (((data.parentLeft) - (data.childLeft + data.childWidth)) - 10) +\n 'px;width:11px;' + this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + eLine;\n div = div + 'left:' + (((data.parentLeft) - (data.childLeft + data.childWidth)) - 10) +\n 'px;width:0px;' + this.getBorderStyles('left', this.lineStroke) +\n this.getBorderStyles('top', (heightValue - this.lineStroke)) + 'position:relative;\">';\n div = div + eLine;\n div = div + (isMilestone ? ('left:4px;width:' + (((data.parentLeft) - (data.childLeft + data.childWidth))\n - (14 - this.lineStroke))) : ('left:10px;width:' + (((data.parentLeft) -\n (data.childLeft + data.childWidth)) - (20 - this.lineStroke)))) +\n 'px;' + this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">';\n div = div + leftArrow;\n div = div + 'left:0px;' + this.getBorderStyles('right', 10) +\n 'top:' + (-6 - this.lineStroke) + 'px;border-bottom-width:' + (5 + this.lineStroke) +\n 'px;border-top-width:' + (5 + this.lineStroke) + 'px;width:0;height:0;position:relative;\">';\n }\n connectorContainer += div;\n connectorContainer += '';\n }\n return connectorContainer;\n };\n /**\n * @private\n */\n ConnectorLine.prototype.createConnectorLineTooltipTable = function () {\n this.tooltipTable = createElement('table', { className: '.e-tooltiptable', styles: 'margin-top:0px', attrs: { 'cellspacing': '2px', 'cellpadding': '2px' } });\n var tooltipBody = createElement('tbody');\n tooltipBody.innerHTML = '';\n this.tooltipTable.appendChild(tooltipBody);\n };\n /**\n * @param fromTaskName\n * @param fromPredecessorText\n * @param toTaskName\n * @param toPredecessorText\n * @private\n */\n ConnectorLine.prototype.getConnectorLineTooltipInnerTd = function (fromTaskName, fromPredecessorText, toTaskName, toPredecessorText) {\n var innerTd = 'Show Tooltip
\n * ```\n * ```typescript\n * \n * ```\n */\nvar Tooltip = /** @class */ (function (_super) {\n __extends(Tooltip, _super);\n /**\n * Constructor for creating the Tooltip Component\n */\n function Tooltip(options, element) {\n return _super.call(this, options, element) || this;\n }\n Tooltip.prototype.initialize = function () {\n this.formatPosition();\n addClass([this.element], ROOT);\n };\n Tooltip.prototype.formatPosition = function () {\n var _a, _b;\n if (this.position.indexOf('Top') === 0 || this.position.indexOf('Bottom') === 0) {\n _a = this.position.split(/(?=[A-Z])/), this.tooltipPositionY = _a[0], this.tooltipPositionX = _a[1];\n }\n else {\n _b = this.position.split(/(?=[A-Z])/), this.tooltipPositionX = _b[0], this.tooltipPositionY = _b[1];\n }\n };\n Tooltip.prototype.renderArrow = function () {\n this.setTipClass(this.position);\n var tip = this.createElement('div', { className: ARROW_TIP + ' ' + this.tipClass });\n tip.appendChild(this.createElement('div', { className: ARROW_TIP_OUTER + ' ' + this.tipClass }));\n tip.appendChild(this.createElement('div', { className: ARROW_TIP_INNER + ' ' + this.tipClass }));\n this.tooltipEle.appendChild(tip);\n };\n Tooltip.prototype.setTipClass = function (position) {\n if (position.indexOf('Right') === 0) {\n this.tipClass = TIP_LEFT;\n }\n else if (position.indexOf('Bottom') === 0) {\n this.tipClass = TIP_TOP;\n }\n else if (position.indexOf('Left') === 0) {\n this.tipClass = TIP_RIGHT;\n }\n else {\n this.tipClass = TIP_BOTTOM;\n }\n };\n Tooltip.prototype.renderPopup = function (target) {\n var elePos = this.mouseTrail ? { top: 0, left: 0 } : this.getTooltipPosition(target);\n this.tooltipEle.classList.remove(POPUP_LIB);\n this.popupObj = new Popup(this.tooltipEle, {\n height: this.height,\n width: this.width,\n position: {\n X: elePos.left,\n Y: elePos.top\n },\n enableRtl: this.enableRtl,\n open: this.openPopupHandler.bind(this),\n close: this.closePopupHandler.bind(this)\n });\n };\n Tooltip.prototype.getTooltipPosition = function (target) {\n this.tooltipEle.style.display = 'none';\n var pos = calculatePosition(target, this.tooltipPositionX, this.tooltipPositionY);\n this.tooltipEle.style.display = '';\n var offsetPos = this.calculateTooltipOffset(this.position);\n var elePos = this.collisionFlipFit(target, pos.left + offsetPos.left, pos.top + offsetPos.top);\n return elePos;\n };\n Tooltip.prototype.reposition = function (target) {\n var elePos = this.getTooltipPosition(target);\n this.popupObj.position = { X: elePos.left, Y: elePos.top };\n this.popupObj.dataBind();\n };\n Tooltip.prototype.openPopupHandler = function () {\n this.trigger('afterOpen', this.tooltipEventArgs);\n };\n Tooltip.prototype.closePopupHandler = function () {\n this.clear();\n this.trigger('afterClose', this.tooltipEventArgs);\n };\n Tooltip.prototype.calculateTooltipOffset = function (position) {\n var pos = { top: 0, left: 0 };\n var tooltipEleWidth = this.tooltipEle.offsetWidth;\n var tooltipEleHeight = this.tooltipEle.offsetHeight;\n var arrowEle = this.tooltipEle.querySelector('.' + ARROW_TIP);\n var tipWidth = arrowEle ? arrowEle.offsetWidth : 0;\n var tipHeight = arrowEle ? arrowEle.offsetHeight : 0;\n var tipAdjust = (this.showTipPointer ? SHOW_POINTER_TIP_GAP : HIDE_POINTER_TIP_GAP);\n var tipHeightAdjust = (tipHeight / 2) + POINTER_ADJUST + (this.tooltipEle.offsetHeight - this.tooltipEle.clientHeight);\n var tipWidthAdjust = (tipWidth / 2) + POINTER_ADJUST + (this.tooltipEle.offsetWidth - this.tooltipEle.clientWidth);\n if (this.mouseTrail) {\n tipAdjust += MOUSE_TRAIL_GAP;\n }\n switch (position) {\n case 'RightTop':\n pos.left += tipWidth + tipAdjust;\n pos.top -= tooltipEleHeight - tipHeightAdjust;\n break;\n case 'RightCenter':\n pos.left += tipWidth + tipAdjust;\n pos.top -= (tooltipEleHeight / 2);\n break;\n case 'RightBottom':\n pos.left += tipWidth + tipAdjust;\n pos.top -= (tipHeightAdjust);\n break;\n case 'BottomRight':\n pos.top += (tipHeight + tipAdjust);\n pos.left -= (tipWidthAdjust);\n break;\n case 'BottomCenter':\n pos.top += (tipHeight + tipAdjust);\n pos.left -= (tooltipEleWidth / 2);\n break;\n case 'BottomLeft':\n pos.top += (tipHeight + tipAdjust);\n pos.left -= (tooltipEleWidth - tipWidthAdjust);\n break;\n case 'LeftBottom':\n pos.left -= (tipWidth + tooltipEleWidth + tipAdjust);\n pos.top -= (tipHeightAdjust);\n break;\n case 'LeftCenter':\n pos.left -= (tipWidth + tooltipEleWidth + tipAdjust);\n pos.top -= (tooltipEleHeight / 2);\n break;\n case 'LeftTop':\n pos.left -= (tipWidth + tooltipEleWidth + tipAdjust);\n pos.top -= (tooltipEleHeight - tipHeightAdjust);\n break;\n case 'TopLeft':\n pos.top -= (tooltipEleHeight + tipHeight + tipAdjust);\n pos.left -= (tooltipEleWidth - tipWidthAdjust);\n break;\n case 'TopRight':\n pos.top -= (tooltipEleHeight + tipHeight + tipAdjust);\n pos.left -= (tipWidthAdjust);\n break;\n default:\n pos.top -= (tooltipEleHeight + tipHeight + tipAdjust);\n pos.left -= (tooltipEleWidth / 2);\n break;\n }\n pos.left += this.offsetX;\n pos.top += this.offsetY;\n return pos;\n };\n Tooltip.prototype.updateTipPosition = function (position) {\n var selEle = this.tooltipEle.querySelectorAll('.' + ARROW_TIP + ',.' + ARROW_TIP_OUTER + ',.' + ARROW_TIP_INNER);\n var removeList = [TIP_BOTTOM, TIP_TOP, TIP_LEFT, TIP_RIGHT];\n removeClass(selEle, removeList);\n this.setTipClass(position);\n addClass(selEle, this.tipClass);\n };\n Tooltip.prototype.adjustArrow = function (target, position, tooltipPositionX, tooltipPositionY) {\n if (this.showTipPointer === false) {\n return;\n }\n this.updateTipPosition(position);\n var leftValue;\n var topValue;\n var tooltipWidth = this.tooltipEle.clientWidth;\n var tooltipHeight = this.tooltipEle.clientHeight;\n var arrowEle = this.tooltipEle.querySelector('.' + ARROW_TIP);\n var arrowInnerELe = this.tooltipEle.querySelector('.' + ARROW_TIP_INNER);\n var tipWidth = arrowEle.offsetWidth;\n var tipHeight = arrowEle.offsetHeight;\n if (this.tipClass === TIP_BOTTOM || this.tipClass === TIP_TOP) {\n if (this.tipClass === TIP_BOTTOM) {\n topValue = '99.9%';\n // Arrow icon aligned -2px height from ArrowOuterTip div\n arrowInnerELe.style.top = '-' + (tipHeight - 2) + 'px';\n }\n else {\n topValue = -(tipHeight - 1) + 'px';\n // Arrow icon aligned -6px height from ArrowOuterTip div\n arrowInnerELe.style.top = '-' + (tipHeight - 6) + 'px';\n }\n var tipPosExclude = tooltipPositionX !== 'Center' || (tooltipWidth > target.offsetWidth) || this.mouseTrail;\n if ((tipPosExclude && tooltipPositionX === 'Left') || (!tipPosExclude && this.tipPointerPosition === 'End')) {\n leftValue = (tooltipWidth - tipWidth - POINTER_ADJUST) + 'px';\n }\n else if ((tipPosExclude && tooltipPositionX === 'Right') || (!tipPosExclude && this.tipPointerPosition === 'Start')) {\n leftValue = POINTER_ADJUST + 'px';\n }\n else {\n leftValue = ((tooltipWidth / 2) - (tipWidth / 2)) + 'px';\n }\n }\n else {\n if (this.tipClass === TIP_RIGHT) {\n leftValue = '99.9%';\n // Arrow icon aligned -2px left from ArrowOuterTip div\n arrowInnerELe.style.left = '-' + (tipWidth - 2) + 'px';\n }\n else {\n leftValue = -(tipWidth - 1) + 'px';\n // Arrow icon aligned -2px from ArrowOuterTip width\n arrowInnerELe.style.left = (-(tipWidth) + (tipWidth - 2)) + 'px';\n }\n var tipPosExclude = tooltipPositionY !== 'Center' || (tooltipHeight > target.offsetHeight) || this.mouseTrail;\n if ((tipPosExclude && tooltipPositionY === 'Top') || (!tipPosExclude && this.tipPointerPosition === 'End')) {\n topValue = (tooltipHeight - tipHeight - POINTER_ADJUST) + 'px';\n }\n else if ((tipPosExclude && tooltipPositionY === 'Bottom') || (!tipPosExclude && this.tipPointerPosition === 'Start')) {\n topValue = POINTER_ADJUST + 'px';\n }\n else {\n topValue = ((tooltipHeight / 2) - (tipHeight / 2)) + 'px';\n }\n }\n arrowEle.style.top = topValue;\n arrowEle.style.left = leftValue;\n };\n Tooltip.prototype.renderContent = function (target) {\n var tooltipContent = this.tooltipEle.querySelector('.' + CONTENT);\n if (target && !isNullOrUndefined(target.getAttribute('title'))) {\n target.setAttribute('data-content', target.getAttribute('title'));\n target.removeAttribute('title');\n }\n if (!isNullOrUndefined(this.content)) {\n tooltipContent.innerHTML = '';\n if (this.content instanceof HTMLElement) {\n tooltipContent.appendChild(this.content);\n }\n else if (typeof this.content === 'string') {\n tooltipContent.innerHTML = this.content;\n }\n else {\n var templateFunction = compile(this.content);\n append(templateFunction(), tooltipContent);\n }\n }\n else {\n if (target && !isNullOrUndefined(target.getAttribute('data-content'))) {\n tooltipContent.innerHTML = target.getAttribute('data-content');\n }\n }\n };\n Tooltip.prototype.renderCloseIcon = function () {\n if (!this.isSticky) {\n return;\n }\n var tipClose = this.createElement('div', { className: ICON + ' ' + CLOSE });\n this.tooltipEle.appendChild(tipClose);\n EventHandler.add(tipClose, Browser.touchStartEvent, this.onStickyClose, this);\n };\n Tooltip.prototype.addDescribedBy = function (target, id) {\n var describedby = (target.getAttribute('aria-describedby') || '').split(/\\s+/);\n if (describedby.indexOf(id) < 0) {\n describedby.push(id);\n }\n attributes(target, { 'aria-describedby': describedby.join(' ').trim(), 'data-tooltip-id': id });\n };\n Tooltip.prototype.removeDescribedBy = function (target) {\n var id = target.getAttribute('data-tooltip-id');\n var describedby = (target.getAttribute('aria-describedby') || '').split(/\\s+/);\n var index = describedby.indexOf(id);\n if (index !== -1) {\n describedby.splice(index, 1);\n }\n target.removeAttribute('data-tooltip-id');\n var orgdescribedby = describedby.join(' ').trim();\n if (orgdescribedby) {\n target.setAttribute('aria-describedby', orgdescribedby);\n }\n else {\n target.removeAttribute('aria-describedby');\n }\n };\n Tooltip.prototype.tapHoldHandler = function (evt) {\n clearTimeout(this.autoCloseTimer);\n this.targetHover(evt.originalEvent);\n };\n Tooltip.prototype.touchEndHandler = function (e) {\n var _this = this;\n if (this.isSticky) {\n return;\n }\n var close = function () {\n _this.close();\n };\n this.autoCloseTimer = setTimeout(close, TOUCHEND_HIDE_DELAY);\n };\n Tooltip.prototype.targetClick = function (e) {\n var target;\n if (this.target) {\n target = closest(e.target, this.target);\n }\n else {\n target = this.element;\n }\n if (isNullOrUndefined(target)) {\n return;\n }\n if (target.getAttribute('data-tooltip-id') === null) {\n this.targetHover(e);\n }\n else if (!this.isSticky) {\n this.hideTooltip(this.animation.close, e, target);\n }\n };\n Tooltip.prototype.targetHover = function (e) {\n var target;\n if (this.target) {\n target = closest(e.target, this.target);\n }\n else {\n target = this.element;\n }\n if (isNullOrUndefined(target) || target.getAttribute('data-tooltip-id') !== null) {\n return;\n }\n var targetList = [].slice.call(document.querySelectorAll('[data-tooltip-id= ' + this.ctrlId + '_content]'));\n for (var _i = 0, targetList_1 = targetList; _i < targetList_1.length; _i++) {\n var target_1 = targetList_1[_i];\n this.restoreElement(target_1);\n }\n this.showTooltip(target, this.animation.open, e);\n this.wireMouseEvents(e, target);\n };\n Tooltip.prototype.showTooltip = function (target, showAnimation, e) {\n var _this = this;\n clearTimeout(this.showTimer);\n clearTimeout(this.hideTimer);\n this.tooltipEventArgs = e ? { type: e.type, cancel: false, target: target, event: e, element: this.tooltipEle } :\n { type: null, cancel: false, target: target, event: null, element: this.tooltipEle };\n this.trigger('beforeRender', this.tooltipEventArgs);\n if (this.tooltipEventArgs.cancel) {\n this.isHidden = true;\n this.clear();\n return;\n }\n this.isHidden = false;\n if (isNullOrUndefined(this.tooltipEle)) {\n this.ctrlId = this.element.getAttribute('id') ? getUniqueID(this.element.getAttribute('id')) : getUniqueID('tooltip');\n this.tooltipEle = this.createElement('div', {\n className: TOOLTIP_WRAP + ' ' + POPUP_ROOT + ' ' + POPUP_LIB, attrs: {\n role: 'tooltip', 'aria-hidden': 'false', 'id': this.ctrlId + '_content'\n }, styles: 'width:' + formatUnit(this.width) + ';height:' + formatUnit(this.height) + ';position:absolute;'\n });\n if (this.cssClass) {\n addClass([this.tooltipEle], this.cssClass.split(' '));\n }\n if (Browser.isDevice) {\n addClass([this.tooltipEle], DEVICE);\n }\n if (this.width !== 'auto') {\n this.tooltipEle.style.maxWidth = formatUnit(this.width);\n }\n this.tooltipEle.appendChild(this.createElement('div', { className: CONTENT }));\n document.body.appendChild(this.tooltipEle);\n this.addDescribedBy(target, this.ctrlId + '_content');\n this.renderContent(target);\n addClass([this.tooltipEle], POPUP_OPEN);\n if (this.showTipPointer) {\n this.renderArrow();\n }\n this.renderCloseIcon();\n this.renderPopup(target);\n }\n else {\n this.adjustArrow(target, this.position, this.tooltipPositionX, this.tooltipPositionY);\n this.addDescribedBy(target, this.ctrlId + '_content');\n this.renderContent(target);\n PopupAnimation.stop(this.tooltipEle);\n this.reposition(target);\n }\n removeClass([this.tooltipEle], POPUP_OPEN);\n addClass([this.tooltipEle], POPUP_CLOSE);\n this.tooltipEventArgs = e ? { type: e.type, cancel: false, target: target, event: e, element: this.tooltipEle } :\n { type: null, cancel: false, target: target, event: null, element: this.tooltipEle };\n this.trigger('beforeOpen', this.tooltipEventArgs);\n if (this.tooltipEventArgs.cancel) {\n this.isHidden = true;\n this.clear();\n return;\n }\n var openAnimation = {\n name: showAnimation.effect, duration: showAnimation.duration, delay: showAnimation.delay, timingFunction: 'easeOut'\n };\n if (showAnimation.effect === 'None') {\n openAnimation = undefined;\n }\n if (this.openDelay > 0) {\n var show = function () {\n if (_this.popupObj) {\n _this.popupObj.show(openAnimation, target);\n }\n };\n this.showTimer = setTimeout(show, this.openDelay);\n }\n else {\n this.popupObj.show(openAnimation, target);\n }\n };\n Tooltip.prototype.checkCollision = function (target, x, y) {\n var elePos = {\n left: x, top: y, position: this.position,\n horizontal: this.tooltipPositionX, vertical: this.tooltipPositionY\n };\n var affectedPos = isCollide(this.tooltipEle, (this.target ? this.element : null), x, y);\n if (affectedPos.length > 0) {\n elePos.horizontal = affectedPos.indexOf('left') >= 0 ? 'Right' : affectedPos.indexOf('right') >= 0 ? 'Left' :\n this.tooltipPositionX;\n elePos.vertical = affectedPos.indexOf('top') >= 0 ? 'Bottom' : affectedPos.indexOf('bottom') >= 0 ? 'Top' :\n this.tooltipPositionY;\n }\n return elePos;\n };\n Tooltip.prototype.collisionFlipFit = function (target, x, y) {\n var elePos = this.checkCollision(target, x, y);\n var newpos = elePos.position;\n if (this.tooltipPositionY !== elePos.vertical) {\n newpos = ((this.position.indexOf('Bottom') === 0 || this.position.indexOf('Top') === 0) ?\n elePos.vertical + this.tooltipPositionX : this.tooltipPositionX + elePos.vertical);\n }\n if (this.tooltipPositionX !== elePos.horizontal) {\n if (newpos.indexOf('Left') === 0) {\n elePos.vertical = (newpos === 'LeftTop' || newpos === 'LeftCenter') ? 'Top' : 'Bottom';\n newpos = (elePos.vertical + 'Left');\n }\n if (newpos.indexOf('Right') === 0) {\n elePos.vertical = (newpos === 'RightTop' || newpos === 'RightCenter') ? 'Top' : 'Bottom';\n newpos = (elePos.vertical + 'Right');\n }\n elePos.horizontal = this.tooltipPositionX;\n }\n this.tooltipEventArgs = {\n type: null, cancel: false, target: target, event: null,\n element: this.tooltipEle, collidedPosition: newpos\n };\n this.trigger('beforeCollision', this.tooltipEventArgs);\n if (elePos.position !== newpos) {\n var pos = calculatePosition(target, elePos.horizontal, elePos.vertical);\n this.adjustArrow(target, newpos, elePos.horizontal, elePos.vertical);\n var offsetPos = this.calculateTooltipOffset(newpos);\n offsetPos.top -= (('TopBottom'.indexOf(this.position.split(/(?=[A-Z])/)[0]) !== -1) &&\n ('TopBottom'.indexOf(newpos.split(/(?=[A-Z])/)[0]) !== -1)) ? (2 * this.offsetY) : 0;\n offsetPos.left -= (('RightLeft'.indexOf(this.position.split(/(?=[A-Z])/)[0]) !== -1) &&\n ('RightLeft'.indexOf(newpos.split(/(?=[A-Z])/)[0]) !== -1)) ? (2 * this.offsetX) : 0;\n elePos.position = newpos;\n elePos.left = pos.left + offsetPos.left;\n elePos.top = pos.top + offsetPos.top;\n }\n else {\n this.adjustArrow(target, newpos, elePos.horizontal, elePos.vertical);\n }\n var eleOffset = { left: elePos.left, top: elePos.top };\n var left = fit(this.tooltipEle, (this.target ? this.element : null), { X: true, Y: false }, eleOffset).left;\n if (this.showTipPointer && (newpos.indexOf('Bottom') === 0 || newpos.indexOf('Top') === 0)) {\n var arrowEle = this.tooltipEle.querySelector('.' + ARROW_TIP);\n var arrowleft = parseInt(arrowEle.style.left, 10) - (left - elePos.left);\n if (arrowleft < 0) {\n arrowleft = 0;\n }\n else if ((arrowleft + arrowEle.offsetWidth) > this.tooltipEle.clientWidth) {\n arrowleft = this.tooltipEle.clientWidth - arrowEle.offsetWidth;\n }\n arrowEle.style.left = arrowleft.toString() + 'px';\n }\n eleOffset.left = left;\n return eleOffset;\n };\n Tooltip.prototype.hideTooltip = function (hideAnimation, e, targetElement) {\n var _this = this;\n var target;\n if (e) {\n target = this.target ? (targetElement || e.target) : this.element;\n this.tooltipEventArgs = {\n type: e.type, cancel: false, target: target, event: e, element: this.tooltipEle\n };\n }\n else {\n target = document.querySelector('[data-tooltip-id= ' + this.ctrlId + '_content]');\n this.tooltipEventArgs = {\n type: null, cancel: false, target: target, event: null, element: this.tooltipEle\n };\n }\n if (isNullOrUndefined(target)) {\n return;\n }\n this.trigger('beforeClose', this.tooltipEventArgs);\n if (!this.tooltipEventArgs.cancel) {\n this.restoreElement(target);\n this.isHidden = true;\n var closeAnimation_1 = {\n name: hideAnimation.effect, duration: hideAnimation.duration, delay: hideAnimation.delay, timingFunction: 'easeIn'\n };\n if (hideAnimation.effect === 'None') {\n closeAnimation_1 = undefined;\n }\n if (this.closeDelay > 0) {\n var hide = function () {\n if (_this.popupObj) {\n _this.popupObj.hide(closeAnimation_1);\n }\n };\n this.hideTimer = setTimeout(hide, this.closeDelay);\n }\n else {\n this.popupObj.hide(closeAnimation_1);\n }\n }\n else {\n this.isHidden = false;\n }\n };\n Tooltip.prototype.restoreElement = function (target) {\n this.unwireMouseEvents(target);\n if (!isNullOrUndefined(target.getAttribute('data-content'))) {\n target.setAttribute('title', target.getAttribute('data-content'));\n target.removeAttribute('data-content');\n }\n this.removeDescribedBy(target);\n };\n Tooltip.prototype.clear = function () {\n if (this.tooltipEle) {\n removeClass([this.tooltipEle], POPUP_CLOSE);\n addClass([this.tooltipEle], POPUP_OPEN);\n }\n if (this.isHidden) {\n if (this.popupObj) {\n this.popupObj.destroy();\n }\n if (this.tooltipEle) {\n remove(this.tooltipEle);\n }\n this.tooltipEle = null;\n this.popupObj = null;\n }\n };\n Tooltip.prototype.onMouseOut = function (e) {\n this.hideTooltip(this.animation.close, e);\n };\n Tooltip.prototype.onStickyClose = function (e) {\n this.close();\n };\n Tooltip.prototype.onMouseMove = function (event) {\n var eventPageX = 0;\n var eventPageY = 0;\n if (event.type.indexOf('touch') > -1) {\n event.preventDefault();\n eventPageX = event.touches[0].pageX;\n eventPageY = event.touches[0].pageY;\n }\n else {\n eventPageX = event.pageX;\n eventPageY = event.pageY;\n }\n PopupAnimation.stop(this.tooltipEle);\n removeClass([this.tooltipEle], POPUP_CLOSE);\n addClass([this.tooltipEle], POPUP_OPEN);\n this.adjustArrow(event.target, this.position, this.tooltipPositionX, this.tooltipPositionY);\n var pos = this.calculateTooltipOffset(this.position);\n var x = eventPageX + pos.left + this.offsetX;\n var y = eventPageY + pos.top + this.offsetY;\n var elePos = this.checkCollision(event.target, x, y);\n if (this.tooltipPositionX !== elePos.horizontal || this.tooltipPositionY !== elePos.vertical) {\n var newpos = (this.position.indexOf('Bottom') === 0 || this.position.indexOf('Top') === 0) ?\n elePos.vertical + elePos.horizontal : elePos.horizontal + elePos.vertical;\n elePos.position = newpos;\n this.adjustArrow(event.target, elePos.position, elePos.horizontal, elePos.vertical);\n var colpos = this.calculateTooltipOffset(elePos.position);\n elePos.left = eventPageX + colpos.left - this.offsetX;\n elePos.top = eventPageY + colpos.top - this.offsetY;\n }\n this.tooltipEle.style.left = elePos.left + 'px';\n this.tooltipEle.style.top = elePos.top + 'px';\n };\n Tooltip.prototype.keyDown = function (event) {\n if (this.tooltipEle && event.keyCode === 27) {\n this.close();\n }\n };\n Tooltip.prototype.touchEnd = function (e) {\n if (this.tooltipEle && closest(e.target, '.' + ROOT) === null) {\n this.close();\n }\n };\n Tooltip.prototype.scrollHandler = function (e) {\n if (this.tooltipEle) {\n this.close();\n }\n };\n /**\n * Core method that initializes the control rendering.\n * @private\n */\n Tooltip.prototype.render = function () {\n this.initialize();\n this.wireEvents(this.opensOn);\n };\n /**\n * Initializes the values of private members.\n * @private\n */\n Tooltip.prototype.preRender = function () {\n this.tipClass = TIP_BOTTOM;\n this.tooltipPositionX = 'Center';\n this.tooltipPositionY = 'Top';\n this.isHidden = true;\n };\n /**\n * Binding events to the Tooltip element.\n * @hidden\n */\n Tooltip.prototype.wireEvents = function (trigger) {\n var triggerList = this.getTriggerList(trigger);\n for (var _i = 0, triggerList_1 = triggerList; _i < triggerList_1.length; _i++) {\n var opensOn = triggerList_1[_i];\n if (opensOn === 'Custom') {\n return;\n }\n if (opensOn === 'Focus') {\n this.wireFocusEvents();\n }\n if (opensOn === 'Click') {\n EventHandler.add(this.element, Browser.touchStartEvent, this.targetClick, this);\n }\n if (opensOn === 'Hover') {\n if (Browser.isDevice) {\n this.touchModule = new Touch(this.element, {\n tapHoldThreshold: TAPHOLD_THRESHOLD,\n tapHold: this.tapHoldHandler.bind(this)\n });\n EventHandler.add(this.element, Browser.touchEndEvent, this.touchEndHandler, this);\n }\n else {\n EventHandler.add(this.element, 'mouseover', this.targetHover, this);\n }\n }\n }\n EventHandler.add(document, 'touchend', this.touchEnd, this);\n EventHandler.add(document, 'scroll', this.scrollHandler, this);\n EventHandler.add(document, 'keydown', this.keyDown, this);\n };\n Tooltip.prototype.getTriggerList = function (trigger) {\n if (trigger === 'Auto') {\n trigger = (Browser.isDevice) ? 'Hover' : 'Hover Focus';\n }\n return trigger.split(' ');\n };\n Tooltip.prototype.wireFocusEvents = function () {\n if (!isNullOrUndefined(this.target)) {\n var targetList = [].slice.call(this.element.querySelectorAll(this.target));\n for (var _i = 0, targetList_2 = targetList; _i < targetList_2.length; _i++) {\n var target = targetList_2[_i];\n EventHandler.add(target, 'focus', this.targetHover, this);\n }\n }\n else {\n EventHandler.add(this.element, 'focus', this.targetHover, this);\n }\n };\n Tooltip.prototype.wireMouseEvents = function (e, target) {\n if (this.tooltipEle) {\n if (!this.isSticky) {\n if (e.type === 'focus') {\n EventHandler.add(target, 'blur', this.onMouseOut, this);\n }\n if (e.type === 'mouseover') {\n EventHandler.add(target, 'mouseleave', this.onMouseOut, this);\n }\n }\n if (this.mouseTrail) {\n EventHandler.add(target, 'mousemove touchstart mouseenter', this.onMouseMove, this);\n }\n }\n };\n /**\n * Unbinding events from the element on widget destroy.\n * @hidden\n */\n Tooltip.prototype.unwireEvents = function (trigger) {\n var triggerList = this.getTriggerList(trigger);\n for (var _i = 0, triggerList_2 = triggerList; _i < triggerList_2.length; _i++) {\n var opensOn = triggerList_2[_i];\n if (opensOn === 'Custom') {\n return;\n }\n if (opensOn === 'Focus') {\n this.unwireFocusEvents();\n }\n if (opensOn === 'Click') {\n EventHandler.remove(this.element, Browser.touchStartEvent, this.targetClick);\n }\n if (opensOn === 'Hover') {\n if (Browser.isDevice) {\n if (this.touchModule) {\n this.touchModule.destroy();\n }\n EventHandler.remove(this.element, Browser.touchEndEvent, this.touchEndHandler);\n }\n else {\n EventHandler.remove(this.element, 'mouseover', this.targetHover);\n }\n }\n }\n EventHandler.remove(document, 'touchend', this.touchEnd);\n EventHandler.remove(document, 'scroll', this.scrollHandler);\n EventHandler.remove(document, 'keydown', this.keyDown);\n };\n Tooltip.prototype.unwireFocusEvents = function () {\n if (!isNullOrUndefined(this.target)) {\n var targetList = [].slice.call(this.element.querySelectorAll(this.target));\n for (var _i = 0, targetList_3 = targetList; _i < targetList_3.length; _i++) {\n var target = targetList_3[_i];\n EventHandler.remove(target, 'focus', this.targetHover);\n }\n }\n else {\n EventHandler.remove(this.element, 'focus', this.targetHover);\n }\n };\n Tooltip.prototype.unwireMouseEvents = function (target) {\n if (!this.isSticky) {\n var triggerList = this.getTriggerList(this.opensOn);\n for (var _i = 0, triggerList_3 = triggerList; _i < triggerList_3.length; _i++) {\n var opensOn = triggerList_3[_i];\n if (opensOn === 'Focus') {\n EventHandler.remove(target, 'blur', this.onMouseOut);\n }\n if (opensOn === 'Hover' && !Browser.isDevice) {\n EventHandler.remove(target, 'mouseleave', this.onMouseOut);\n }\n }\n }\n if (this.mouseTrail) {\n EventHandler.remove(target, 'mousemove touchstart mouseenter', this.onMouseMove);\n }\n };\n Tooltip.prototype.findTarget = function () {\n var target = document.querySelector('[data-tooltip-id= ' + this.ctrlId + '_content]');\n return target;\n };\n /**\n * Core method to return the component name.\n * @private\n */\n Tooltip.prototype.getModuleName = function () {\n return 'tooltip';\n };\n /**\n * Returns the properties to be maintained in the persisted state.\n * @private\n */\n Tooltip.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * Called internally, if any of the property value changed.\n * @private\n */\n Tooltip.prototype.onPropertyChanged = function (newProp, oldProp) {\n var targetElement = this.findTarget();\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'width':\n if (this.tooltipEle && targetElement) {\n this.tooltipEle.style.width = formatUnit(newProp.width);\n this.reposition(targetElement);\n }\n break;\n case 'height':\n if (this.tooltipEle && targetElement) {\n this.tooltipEle.style.height = formatUnit(newProp.height);\n this.reposition(targetElement);\n }\n break;\n case 'content':\n if (this.tooltipEle) {\n this.renderContent();\n }\n break;\n case 'opensOn':\n this.unwireEvents(oldProp.opensOn);\n this.wireEvents(newProp.opensOn);\n break;\n case 'position':\n this.formatPosition();\n if (this.tooltipEle && targetElement) {\n var arrowInnerELe = this.tooltipEle.querySelector('.' + ARROW_TIP_INNER);\n arrowInnerELe.style.top = arrowInnerELe.style.left = null;\n this.reposition(targetElement);\n }\n break;\n case 'tipPointerPosition':\n if (this.tooltipEle && targetElement) {\n this.reposition(targetElement);\n }\n break;\n case 'offsetX':\n if (this.tooltipEle) {\n var x = newProp.offsetX - oldProp.offsetX;\n this.tooltipEle.style.left = (parseInt(this.tooltipEle.style.left, 10) + (x)).toString() + 'px';\n }\n break;\n case 'offsetY':\n if (this.tooltipEle) {\n var y = newProp.offsetY - oldProp.offsetY;\n this.tooltipEle.style.top = (parseInt(this.tooltipEle.style.top, 10) + (y)).toString() + 'px';\n }\n break;\n case 'cssClass':\n if (this.tooltipEle) {\n if (oldProp.cssClass) {\n removeClass([this.tooltipEle], oldProp.cssClass.split(' '));\n }\n if (newProp.cssClass) {\n addClass([this.tooltipEle], newProp.cssClass.split(' '));\n }\n }\n break;\n case 'enableRtl':\n if (this.tooltipEle) {\n if (this.enableRtl) {\n addClass([this.tooltipEle], RTL);\n }\n else {\n removeClass([this.tooltipEle], RTL);\n }\n }\n break;\n }\n }\n };\n /**\n * It is used to show the Tooltip on the specified target with specific animation settings.\n * @param element Target element where the Tooltip is to be displayed.\n * @param animation Sets the specific animation, while showing the Tooltip on the screen.\n * @return {void}\n */\n Tooltip.prototype.open = function (element, animation) {\n if (animation === void 0) { animation = this.animation.open; }\n if (element.style.display === 'none') {\n return;\n }\n this.showTooltip(element, animation);\n };\n /**\n * It is used to hide the Tooltip with specific animation effect.\n * @param animation Sets the specific animation when hiding Tooltip from the screen.\n * @return {void}\n */\n Tooltip.prototype.close = function (animation) {\n if (animation === void 0) { animation = this.animation.close; }\n this.hideTooltip(animation);\n };\n /**\n * It is used to refresh the Tooltip content and its position.\n * @param target Target element where the Tooltip content or position needs to be refreshed.\n * @return {void}\n */\n Tooltip.prototype.refresh = function (target) {\n if (this.tooltipEle) {\n this.renderContent(target);\n }\n if (this.popupObj && target) {\n this.reposition(target);\n }\n };\n /**\n * It is used to destroy the Tooltip component.\n * @method destroy\n * @return {void}\n * @memberof Tooltip\n */\n Tooltip.prototype.destroy = function () {\n _super.prototype.destroy.call(this);\n removeClass([this.element], ROOT);\n this.unwireEvents(this.opensOn);\n this.unwireMouseEvents(this.element);\n if (this.popupObj) {\n this.popupObj.destroy();\n }\n if (this.tooltipEle) {\n remove(this.tooltipEle);\n }\n this.tooltipEle = null;\n this.popupObj = null;\n };\n __decorate([\n Property('auto')\n ], Tooltip.prototype, \"width\", void 0);\n __decorate([\n Property('auto')\n ], Tooltip.prototype, \"height\", void 0);\n __decorate([\n Property()\n ], Tooltip.prototype, \"content\", void 0);\n __decorate([\n Property()\n ], Tooltip.prototype, \"target\", void 0);\n __decorate([\n Property('TopCenter')\n ], Tooltip.prototype, \"position\", void 0);\n __decorate([\n Property(0)\n ], Tooltip.prototype, \"offsetX\", void 0);\n __decorate([\n Property(0)\n ], Tooltip.prototype, \"offsetY\", void 0);\n __decorate([\n Property(true)\n ], Tooltip.prototype, \"showTipPointer\", void 0);\n __decorate([\n Property('Auto')\n ], Tooltip.prototype, \"tipPointerPosition\", void 0);\n __decorate([\n Property('Auto')\n ], Tooltip.prototype, \"opensOn\", void 0);\n __decorate([\n Property(false)\n ], Tooltip.prototype, \"mouseTrail\", void 0);\n __decorate([\n Property(false)\n ], Tooltip.prototype, \"isSticky\", void 0);\n __decorate([\n Complex({}, Animation)\n ], Tooltip.prototype, \"animation\", void 0);\n __decorate([\n Property(0)\n ], Tooltip.prototype, \"openDelay\", void 0);\n __decorate([\n Property(0)\n ], Tooltip.prototype, \"closeDelay\", void 0);\n __decorate([\n Property()\n ], Tooltip.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], Tooltip.prototype, \"enableRtl\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"beforeRender\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"beforeOpen\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"afterOpen\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"beforeClose\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"afterClose\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"beforeCollision\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"destroyed\", void 0);\n Tooltip = __decorate([\n NotifyPropertyChanges\n ], Tooltip);\n return Tooltip;\n}(Component));\nexport { Tooltip };\n","import { createElement, attributes, addClass, removeClass, detach, classList, closest, isNullOrUndefined } from '@syncfusion/ej2-base';\nvar CLASSNAMES = {\n RTL: 'e-rtl',\n DISABLE: 'e-disabled',\n INPUT: 'e-input',\n INPUTGROUP: 'e-input-group',\n FLOATINPUT: 'e-float-input',\n FLOATLINE: 'e-float-line',\n FLOATTEXT: 'e-float-text',\n CLEARICON: 'e-clear-icon',\n CLEARICONHIDE: 'e-clear-icon-hide',\n LABELTOP: 'e-label-top',\n LABELBOTTOM: 'e-label-bottom',\n NOFLOATLABEL: 'e-no-float-label',\n INPUTCUSTOMTAG: 'e-input-custom-tag',\n FLOATCUSTOMTAG: 'e-float-custom-tag'\n};\n/**\n * Base for Input creation through util methods.\n */\nexport var Input;\n(function (Input) {\n var privateInputObj = {\n container: null,\n buttons: [],\n clearButton: null\n };\n /**\n * Create a wrapper to input element with multiple span elements and set the basic properties to input based components.\n * ```\n * E.g : Input.createInput({ element: element, floatLabelType : \"Auto\", properties: { placeholder: 'Search' } });\n * ```\n * @param args\n */\n function createInput(args, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n var inputObject = { container: null, buttons: [], clearButton: null };\n if (isNullOrUndefined(args.floatLabelType) || args.floatLabelType === 'Never') {\n inputObject.container = createInputContainer(args, CLASSNAMES.INPUTGROUP, CLASSNAMES.INPUTCUSTOMTAG, 'span', makeElement);\n args.element.parentNode.insertBefore(inputObject.container, args.element);\n addClass([args.element], CLASSNAMES.INPUT);\n inputObject.container.appendChild(args.element);\n }\n else {\n createFloatingInput(args, inputObject, makeElement);\n }\n args.element.addEventListener('focus', function () {\n var parent = getParentNode(this);\n if (parent.classList.contains('e-input-group')) {\n parent.classList.add('e-input-focus');\n }\n });\n args.element.addEventListener('blur', function () {\n var parent = getParentNode(this);\n if (parent.classList.contains('e-input-group')) {\n parent.classList.remove('e-input-focus');\n }\n });\n if (!isNullOrUndefined(args.properties) && !isNullOrUndefined(args.properties.showClearButton) &&\n args.properties.showClearButton && args.element.tagName !== 'TEXTAREA') {\n setClearButton(args.properties.showClearButton, args.element, inputObject, true, makeElement);\n if (inputObject.container.classList.contains(CLASSNAMES.FLOATINPUT)) {\n addClass([inputObject.container], CLASSNAMES.INPUTGROUP);\n }\n }\n if (!isNullOrUndefined(args.buttons) && args.element.tagName !== 'TEXTAREA') {\n for (var i = 0; i < args.buttons.length; i++) {\n inputObject.buttons.push(appendSpan(args.buttons[i], inputObject.container, makeElement));\n }\n }\n inputObject = setPropertyValue(args, inputObject);\n privateInputObj = inputObject;\n return inputObject;\n }\n Input.createInput = createInput;\n function _focusFn() {\n var label = getParentNode(this).getElementsByClassName('e-float-text')[0];\n addClass([label], CLASSNAMES.LABELTOP);\n if (label.classList.contains(CLASSNAMES.LABELBOTTOM)) {\n removeClass([label], CLASSNAMES.LABELBOTTOM);\n }\n }\n function _blurFn() {\n var parent = getParentNode(this);\n if ((parent.getElementsByTagName('textarea')[0]) ? parent.getElementsByTagName('textarea')[0].value === '' :\n parent.getElementsByTagName('input')[0].value === '') {\n var label = parent.getElementsByClassName('e-float-text')[0];\n if (label.classList.contains(CLASSNAMES.LABELTOP)) {\n removeClass([label], CLASSNAMES.LABELTOP);\n }\n addClass([label], CLASSNAMES.LABELBOTTOM);\n }\n }\n function wireFloatingEvents(element) {\n element.addEventListener('focus', _focusFn);\n element.addEventListener('blur', _blurFn);\n }\n function unwireFloatingEvents(element) {\n element.removeEventListener('focus', _focusFn);\n element.removeEventListener('blur', _blurFn);\n }\n function createFloatingInput(args, inputObject, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n var inputElement;\n var floatLinelement;\n var floatLabelElement;\n if (args.floatLabelType === 'Auto') {\n wireFloatingEvents(args.element);\n }\n if (isNullOrUndefined(inputObject.container)) {\n inputObject.container = createInputContainer(args, CLASSNAMES.FLOATINPUT, CLASSNAMES.FLOATCUSTOMTAG, 'div', makeElement);\n args.element.parentNode.insertBefore(inputObject.container, args.element);\n }\n else {\n if (!isNullOrUndefined(args.customTag)) {\n inputObject.container.classList.add(CLASSNAMES.FLOATCUSTOMTAG);\n }\n inputObject.container.classList.add(CLASSNAMES.FLOATINPUT);\n }\n floatLinelement = makeElement('span', { className: CLASSNAMES.FLOATLINE });\n floatLabelElement = makeElement('label', { className: CLASSNAMES.FLOATTEXT });\n if (!isNullOrUndefined(args.element.id) && args.element.id !== '') {\n floatLabelElement.id = 'label_' + args.element.id.replace(/ /g, '_');\n attributes(args.element, { 'aria-labelledby': floatLabelElement.id });\n }\n if (!isNullOrUndefined(args.element.placeholder) && args.element.placeholder !== '') {\n floatLabelElement.innerHTML = args.element.placeholder;\n args.element.removeAttribute('placeholder');\n }\n if (!isNullOrUndefined(args.properties) && !isNullOrUndefined(args.properties.placeholder) &&\n args.properties.placeholder !== '') {\n floatLabelElement.innerHTML = args.properties.placeholder;\n }\n if (!floatLabelElement.innerHTML) {\n inputObject.container.classList.add(CLASSNAMES.NOFLOATLABEL);\n }\n inputObject.container.appendChild(args.element);\n inputObject.container.appendChild(floatLinelement);\n inputObject.container.appendChild(floatLabelElement);\n updateLabelState(args.element.value, floatLabelElement);\n if (args.floatLabelType === 'Always') {\n if (floatLabelElement.classList.contains(CLASSNAMES.LABELBOTTOM)) {\n removeClass([floatLabelElement], CLASSNAMES.LABELBOTTOM);\n }\n addClass([floatLabelElement], CLASSNAMES.LABELTOP);\n }\n if (args.floatLabelType === 'Auto') {\n args.element.addEventListener('input', function (event) {\n updateLabelState(args.element.value, floatLabelElement);\n });\n args.element.addEventListener('blur', function (event) {\n updateLabelState(args.element.value, floatLabelElement);\n });\n }\n if (!isNullOrUndefined(args.element.getAttribute('id'))) {\n floatLabelElement.setAttribute('for', args.element.getAttribute('id'));\n }\n }\n function setPropertyValue(args, inputObject) {\n if (!isNullOrUndefined(args.properties)) {\n for (var _i = 0, _a = Object.keys(args.properties); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'cssClass':\n setCssClass(args.properties.cssClass, [inputObject.container]);\n break;\n case 'enabled':\n setEnabled(args.properties.enabled, args.element, args.floatLabelType, inputObject.container);\n break;\n case 'enableRtl':\n setEnableRtl(args.properties.enableRtl, [inputObject.container]);\n break;\n case 'placeholder':\n setPlaceholder(args.properties.placeholder, args.element);\n break;\n case 'readonly':\n setReadonly(args.properties.readonly, args.element);\n break;\n }\n }\n }\n return inputObject;\n }\n function updateIconState(value, button) {\n if (value) {\n removeClass([button], CLASSNAMES.CLEARICONHIDE);\n }\n else {\n addClass([button], CLASSNAMES.CLEARICONHIDE);\n }\n }\n function updateLabelState(value, label) {\n if (value) {\n addClass([label], CLASSNAMES.LABELTOP);\n if (label.classList.contains(CLASSNAMES.LABELBOTTOM)) {\n removeClass([label], CLASSNAMES.LABELBOTTOM);\n }\n }\n else {\n if (label.classList.contains(CLASSNAMES.LABELTOP)) {\n removeClass([label], CLASSNAMES.LABELTOP);\n }\n addClass([label], CLASSNAMES.LABELBOTTOM);\n }\n }\n function getParentNode(element) {\n var parentNode = element.parentNode;\n return parentNode;\n }\n /**\n * To create clear button.\n */\n function createClearButton(element, inputObject, initial, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n var button = makeElement('span', { className: CLASSNAMES.CLEARICON });\n var container = inputObject.container;\n if (!isNullOrUndefined(initial)) {\n container.appendChild(button);\n }\n else {\n var baseElement = inputObject.container.classList.contains(CLASSNAMES.FLOATINPUT) ?\n inputObject.container.querySelector('.' + CLASSNAMES.FLOATTEXT) : element;\n baseElement.insertAdjacentElement('afterend', button);\n }\n if (!isNullOrUndefined(container) &&\n container.classList.contains(CLASSNAMES.FLOATINPUT)) {\n addClass([container], CLASSNAMES.INPUTGROUP);\n }\n addClass([button], CLASSNAMES.CLEARICONHIDE);\n wireClearBtnEvents(element, button, container);\n button.setAttribute('aria-label', 'close');\n return button;\n }\n function wireClearBtnEvents(element, button, container) {\n button.addEventListener('click', function (event) {\n if (!(element.classList.contains(CLASSNAMES.DISABLE) || element.readOnly)) {\n event.preventDefault();\n if (element !== document.activeElement) {\n element.focus();\n }\n element.value = '';\n addClass([button], CLASSNAMES.CLEARICONHIDE);\n }\n });\n element.addEventListener('input', function (event) {\n updateIconState(element.value, button);\n });\n element.addEventListener('focus', function (event) {\n updateIconState(element.value, button);\n });\n element.addEventListener('blur', function (event) {\n setTimeout(function () { addClass([button], CLASSNAMES.CLEARICONHIDE); }, 200);\n });\n }\n function validateLabel(element, floatLabelType) {\n var parent = getParentNode(element);\n if (parent.classList.contains(CLASSNAMES.FLOATINPUT) && floatLabelType === 'Auto') {\n var label = getParentNode(element).getElementsByClassName('e-float-text')[0];\n updateLabelState(element.value, label);\n }\n }\n /**\n * To create input box contianer.\n */\n function createInputContainer(args, className, tagClass, tag, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n var container;\n if (!isNullOrUndefined(args.customTag)) {\n container = makeElement(args.customTag, { className: className });\n container.classList.add(tagClass);\n }\n else {\n container = makeElement(tag, { className: className });\n }\n container.classList.add('e-control-wrapper');\n return container;\n }\n function encodePlaceHolder(placeholder) {\n var result = '';\n if (!isNullOrUndefined(placeholder) && placeholder !== '') {\n var spanEle = document.createElement('span');\n spanEle.innerHTML = placeholder;\n result = spanEle.textContent;\n }\n return result;\n }\n /**\n * Sets the value to the input element.\n * ```\n * E.g : Input.setValue('content', element, \"Auto\", true );\n * ```\n * @param value - Specify the value of the input element.\n * @param element - The element on which the specified value is updated.\n * @param floatLabelType - Specify the float label type of the input element.\n * @param clearButton - Boolean value to specify whether the clear icon is enabled / disabled on the input.\n */\n function setValue(value, element, floatLabelType, clearButton) {\n element.value = value;\n if ((!isNullOrUndefined(floatLabelType)) && floatLabelType === 'Auto') {\n validateLabel(element, floatLabelType);\n }\n if (!isNullOrUndefined(clearButton) && clearButton) {\n var parentElement = getParentNode(element);\n var button = parentElement.getElementsByClassName(CLASSNAMES.CLEARICON)[0];\n if (element.value && parentElement.classList.contains('e-input-focus')) {\n removeClass([button], CLASSNAMES.CLEARICONHIDE);\n }\n else {\n addClass([button], CLASSNAMES.CLEARICONHIDE);\n }\n }\n }\n Input.setValue = setValue;\n /**\n * Sets the single or multiple cssClass to wrapper of input element.\n * ```\n * E.g : Input.setCssClass('e-custom-class', [element]);\n * ```\n * @param cssClass - Css class names which are needed to add.\n * @param elements - The elements which are needed to add / remove classes.\n * @param oldClass - Css class names which are needed to remove. If old classes are need to remove, can give this optional parameter.\n */\n function setCssClass(cssClass, elements, oldClass) {\n if (!isNullOrUndefined(oldClass) && oldClass !== '') {\n removeClass(elements, oldClass.split(' '));\n }\n if (!isNullOrUndefined(cssClass) && cssClass !== '') {\n addClass(elements, cssClass.split(' '));\n }\n }\n Input.setCssClass = setCssClass;\n /**\n * Set the placeholder attribute to the input element.\n * ```\n * E.g : Input.setPlaceholder('Search here', element);\n * ```\n * @param placeholder - Placeholder value which is need to add.\n * @param element - The element on which the placeholder is need to add.\n */\n function setPlaceholder(placeholder, element) {\n var parentElement;\n placeholder = encodePlaceHolder(placeholder);\n parentElement = getParentNode(element);\n if (parentElement.classList.contains(CLASSNAMES.FLOATINPUT)) {\n if (!isNullOrUndefined(placeholder) && placeholder !== '') {\n parentElement.getElementsByClassName(CLASSNAMES.FLOATTEXT)[0].textContent = placeholder;\n parentElement.classList.remove(CLASSNAMES.NOFLOATLABEL);\n }\n else {\n parentElement.classList.add(CLASSNAMES.NOFLOATLABEL);\n parentElement.getElementsByClassName(CLASSNAMES.FLOATTEXT)[0].textContent = '';\n }\n }\n else {\n if (!isNullOrUndefined(placeholder) && placeholder !== '') {\n attributes(element, { 'placeholder': placeholder, 'aria-placeholder': placeholder });\n }\n else {\n element.removeAttribute('placeholder');\n element.removeAttribute('aria-placeholder');\n }\n }\n }\n Input.setPlaceholder = setPlaceholder;\n /**\n * Set the read only attribute to the input element\n * ```\n * E.g : Input.setReadonly(true, element);\n * ```\n * @param isReadonly\n * - Boolean value to specify whether to set read only. Setting \"True\" value enables read only.\n * @param element\n * - The element which is need to enable read only.\n */\n function setReadonly(isReadonly, element, floatLabelType) {\n if (isReadonly) {\n attributes(element, { readonly: '' });\n }\n else {\n element.removeAttribute('readonly');\n }\n if (!isNullOrUndefined(floatLabelType)) {\n validateLabel(element, floatLabelType);\n }\n }\n Input.setReadonly = setReadonly;\n /**\n * Displays the element direction from right to left when its enabled.\n * ```\n * E.g : Input.setEnableRtl(true, [inputObj.container]);\n * ```\n * @param isRtl\n * - Boolean value to specify whether to set RTL. Setting \"True\" value enables the RTL mode.\n * @param elements\n * - The elements that are needed to enable/disable RTL.\n */\n function setEnableRtl(isRtl, elements) {\n if (isRtl) {\n addClass(elements, CLASSNAMES.RTL);\n }\n else {\n removeClass(elements, CLASSNAMES.RTL);\n }\n }\n Input.setEnableRtl = setEnableRtl;\n /**\n * Enables or disables the given input element.\n * ```\n * E.g : Input.setEnabled(false, element);\n * ```\n * @param isEnable\n * - Boolean value to specify whether to enable or disable.\n * @param element\n * - Element to be enabled or disabled.\n */\n function setEnabled(isEnable, element, floatLabelType, inputContainer) {\n var disabledAttrs = { 'disabled': 'disabled', 'aria-disabled': 'true' };\n var considerWrapper = isNullOrUndefined(inputContainer) ? false : true;\n if (isEnable) {\n element.classList.remove(CLASSNAMES.DISABLE);\n removeAttributes(disabledAttrs, element);\n if (considerWrapper) {\n removeClass([inputContainer], CLASSNAMES.DISABLE);\n }\n }\n else {\n element.classList.add(CLASSNAMES.DISABLE);\n addAttributes(disabledAttrs, element);\n if (considerWrapper) {\n addClass([inputContainer], CLASSNAMES.DISABLE);\n }\n }\n if (!isNullOrUndefined(floatLabelType)) {\n validateLabel(element, floatLabelType);\n }\n }\n Input.setEnabled = setEnabled;\n function setClearButton(isClear, element, inputObject, initial, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n if (isClear) {\n inputObject.clearButton = createClearButton(element, inputObject, initial, makeElement);\n }\n else {\n inputObject.clearButton.remove();\n inputObject.clearButton = null;\n }\n }\n Input.setClearButton = setClearButton;\n /**\n * Removing the multiple attributes from the given element such as \"disabled\",\"id\" , etc.\n * ```\n * E.g : Input.removeAttributes({ 'disabled': 'disabled', 'aria-disabled': 'true' }, element);\n * ```\n * @param attrs\n * - Array of attributes which are need to removed from the element.\n * @param element\n * - Element on which the attributes are needed to be removed.\n */\n function removeAttributes(attrs, element) {\n for (var _i = 0, _a = Object.keys(attrs); _i < _a.length; _i++) {\n var key = _a[_i];\n var parentElement = void 0;\n parentElement = getParentNode(element);\n if (key === 'disabled') {\n element.classList.remove(CLASSNAMES.DISABLE);\n }\n if (key === 'disabled' && parentElement.classList.contains(CLASSNAMES.INPUTGROUP)) {\n parentElement.classList.remove(CLASSNAMES.DISABLE);\n }\n if (key === 'placeholder' && parentElement.classList.contains(CLASSNAMES.FLOATINPUT)) {\n parentElement.getElementsByClassName(CLASSNAMES.FLOATTEXT)[0].textContent = '';\n }\n else {\n element.removeAttribute(key);\n }\n }\n }\n Input.removeAttributes = removeAttributes;\n /**\n * Adding the multiple attributes to the given element such as \"disabled\",\"id\" , etc.\n * ```\n * E.g : Input.addAttributes({ 'id': 'inputpopup' }, element);\n * ```\n * @param attrs\n * - Array of attributes which is added to element.\n * @param element\n * - Element on which the attributes are needed to be added.\n */\n function addAttributes(attrs, element) {\n for (var _i = 0, _a = Object.keys(attrs); _i < _a.length; _i++) {\n var key = _a[_i];\n var parentElement = void 0;\n parentElement = getParentNode(element);\n if (key === 'disabled') {\n element.classList.add(CLASSNAMES.DISABLE);\n }\n if (key === 'disabled' && parentElement.classList.contains(CLASSNAMES.INPUTGROUP)) {\n parentElement.classList.add(CLASSNAMES.DISABLE);\n }\n if (key === 'placeholder' && parentElement.classList.contains(CLASSNAMES.FLOATINPUT)) {\n parentElement.getElementsByClassName(CLASSNAMES.FLOATTEXT)[0].textContent = attrs[key];\n }\n else {\n element.setAttribute(key, attrs[key]);\n }\n }\n }\n Input.addAttributes = addAttributes;\n function removeFloating(input) {\n var container = input.container;\n if (!isNullOrUndefined(container) && container.classList.contains(CLASSNAMES.FLOATINPUT)) {\n var inputEle = container.querySelector('textarea') ? container.querySelector('textarea') :\n container.querySelector('input');\n var placeholder = container.querySelector('.' + CLASSNAMES.FLOATTEXT).textContent;\n var clearButton = container.querySelector('.e-clear-icon') !== null;\n detach(container.querySelector('.' + CLASSNAMES.FLOATLINE));\n detach(container.querySelector('.' + CLASSNAMES.FLOATTEXT));\n classList(container, [CLASSNAMES.INPUTGROUP], [CLASSNAMES.FLOATINPUT]);\n unwireFloatingEvents(inputEle);\n attributes(inputEle, { 'placeholder': placeholder });\n inputEle.classList.add(CLASSNAMES.INPUT);\n if (!clearButton && inputEle.tagName === 'INPUT') {\n inputEle.removeAttribute('required');\n }\n }\n }\n Input.removeFloating = removeFloating;\n function addFloating(input, type, placeholder, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n var container = closest(input, '.' + CLASSNAMES.INPUTGROUP);\n if (type !== 'Never') {\n var customTag = container.tagName;\n customTag = customTag !== 'DIV' && customTag !== 'SPAN' ? customTag : null;\n var args = { element: input, floatLabelType: type, customTag: customTag, properties: { placeholder: placeholder } };\n var iconEle = container.querySelector('.e-clear-icon');\n var inputObj = { container: container };\n input.classList.remove(CLASSNAMES.INPUT);\n createFloatingInput(args, inputObj, makeElement);\n if (isNullOrUndefined(iconEle)) {\n iconEle = container.querySelector('.e-input-group-icon');\n }\n if (isNullOrUndefined(iconEle)) {\n container.classList.remove(CLASSNAMES.INPUTGROUP);\n }\n else {\n var floatLine = container.querySelector('.' + CLASSNAMES.FLOATLINE);\n var floatText = container.querySelector('.' + CLASSNAMES.FLOATTEXT);\n container.insertBefore(input, iconEle);\n container.insertBefore(floatLine, iconEle);\n container.insertBefore(floatText, iconEle);\n }\n }\n }\n Input.addFloating = addFloating;\n /**\n * Enable or Disable the ripple effect on the icons inside the Input. Ripple effect is only applicable for material theme.\n * ```\n * E.g : Input.setRipple(true, [inputObjects]);\n * ```\n * @param isRipple\n * - Boolean value to specify whether to enable the ripple effect.\n * @param inputObject\n * - Specify the collection of input objects.\n */\n function setRipple(isRipple, inputObj) {\n for (var i = 0; i < inputObj.length; i++) {\n _internalRipple(isRipple, inputObj[i].container);\n }\n }\n Input.setRipple = setRipple;\n function _internalRipple(isRipple, container, button) {\n var argsButton = [];\n argsButton.push(button);\n var buttons = isNullOrUndefined(button) ?\n container.querySelectorAll('.e-input-group-icon') : argsButton;\n if (isRipple && buttons.length > 0) {\n for (var index = 0; index < buttons.length; index++) {\n buttons[index].addEventListener('mousedown', _onMouseDownRipple, false);\n buttons[index].addEventListener('mouseup', _onMouseUpRipple, false);\n }\n }\n else if (buttons.length > 0) {\n for (var index = 0; index < buttons.length; index++) {\n buttons[index].removeEventListener('mousedown', _onMouseDownRipple, this);\n buttons[index].removeEventListener('mouseup', _onMouseUpRipple, this);\n }\n }\n }\n function _onMouseRipple(container, button) {\n if (!container.classList.contains('e-disabled') && !container.querySelector('input').readOnly) {\n button.classList.add('e-input-btn-ripple');\n }\n }\n function _onMouseDownRipple() {\n var ele = this;\n var parentEle = this.parentElement;\n while (!parentEle.classList.contains('e-input-group')) {\n parentEle = parentEle.parentElement;\n }\n _onMouseRipple(parentEle, ele);\n }\n function _onMouseUpRipple() {\n var ele = this;\n setTimeout(function () { ele.classList.remove('e-input-btn-ripple'); }, 500);\n }\n /**\n * Creates a new span element with the given icons added and append it in container element.\n * ```\n * E.g : Input.appendSpan('e-icon-spin', inputObj.container);\n * ```\n * @param iconClass - Icon classes which are need to add to the span element which is going to created.\n * Span element acts as icon or button element for input.\n * @param container - The container on which created span element is going to append.\n */\n function appendSpan(iconClass, container, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n var button = makeElement('span', { className: iconClass });\n button.classList.add('e-input-group-icon');\n container.appendChild(button);\n if (!container.classList.contains(CLASSNAMES.INPUTGROUP)) {\n container.classList.add(CLASSNAMES.INPUTGROUP);\n }\n _internalRipple(true, container, button);\n return button;\n }\n Input.appendSpan = appendSpan;\n})(Input || (Input = {}));\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, EventHandler, Property, Event, Browser, L10n } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges } from '@syncfusion/ej2-base';\nimport { attributes, addClass, removeClass, setStyleAttribute, detach, closest } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, getValue, formatUnit, setValue, merge } from '@syncfusion/ej2-base';\nimport { Internationalization, getNumericObject } from '@syncfusion/ej2-base';\nimport { Input } from '../input/input';\nvar ROOT = 'e-control-wrapper e-numeric';\nvar SPINICON = 'e-input-group-icon';\nvar SPINUP = 'e-spin-up';\nvar SPINDOWN = 'e-spin-down';\nvar ERROR = 'e-error';\nvar INCREMENT = 'increment';\nvar DECREMENT = 'decrement';\nvar INTREGEXP = new RegExp('^(-)?(\\\\d*)$');\nvar DECIMALSEPARATOR = '.';\nvar COMPONENT = 'e-numerictextbox';\nvar CONTROL = 'e-control';\n/**\n * Represents the NumericTextBox component that allows the user to enter only numeric values.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar NumericTextBox = /** @class */ (function (_super) {\n __extends(NumericTextBox, _super);\n function NumericTextBox(options, element) {\n return _super.call(this, options, element) || this;\n }\n NumericTextBox.prototype.preRender = function () {\n this.isPrevFocused = false;\n this.decimalSeparator = '.';\n this.intRegExp = new RegExp('/^(-)?(\\d*)$/');\n this.isCalled = false;\n var ejInstance = getValue('ej2_instances', this.element);\n this.cloneElement = this.element.cloneNode(true);\n removeClass([this.cloneElement], [CONTROL, COMPONENT, 'e-lib']);\n this.angularTagName = null;\n this.formEle = closest(this.element, 'form');\n if (this.element.tagName === 'EJS-NUMERICTEXTBOX') {\n this.angularTagName = this.element.tagName;\n var input = this.createElement('input');\n var index = 0;\n for (index; index < this.element.attributes.length; index++) {\n input.setAttribute(this.element.attributes[index].nodeName, this.element.attributes[index].nodeValue);\n input.innerHTML = this.element.innerHTML;\n }\n if (this.element.hasAttribute('id')) {\n this.element.removeAttribute('id');\n }\n this.element.classList.remove('e-control', 'e-numerictextbox');\n this.element.appendChild(input);\n this.element = input;\n setValue('ej2_instances', ejInstance, this.element);\n }\n attributes(this.element, { 'role': 'spinbutton', 'tabindex': '0', 'autocomplete': 'off', 'aria-live': 'assertive' });\n var localeText = { incrementTitle: 'Increment value', decrementTitle: 'Decrement value', placeholder: '' };\n this.l10n = new L10n('numerictextbox', localeText, this.locale);\n this.isValidState = true;\n this.inputStyle = null;\n this.inputName = null;\n this.cultureInfo = {};\n this.initCultureInfo();\n this.initCultureFunc();\n this.checkAttributes();\n this.prevValue = this.value;\n if (this.formEle) {\n this.inputEleValue = this.value;\n }\n this.validateMinMax();\n this.validateStep();\n if (this.placeholder === null) {\n this.updatePlaceholder();\n }\n };\n /**\n * To Initialize the control rendering\n * @private\n */\n NumericTextBox.prototype.render = function () {\n if (this.element.tagName.toLowerCase() === 'input') {\n this.createWrapper();\n if (this.showSpinButton) {\n this.spinBtnCreation();\n }\n if (!isNullOrUndefined(this.width)) {\n setStyleAttribute(this.container, { 'width': formatUnit(this.width) });\n }\n if (!this.container.classList.contains('e-input-group')) {\n this.container.classList.add('e-input-group');\n }\n this.changeValue(this.value === null || isNaN(this.value) ? null : this.strictMode ? this.trimValue(this.value) : this.value);\n this.wireEvents();\n if (this.value !== null && !isNaN(this.value)) {\n if (this.decimals) {\n this.setProperties({ value: this.roundNumber(this.value, this.decimals) }, true);\n }\n }\n if (this.element.getAttribute('value') || this.value) {\n this.element.setAttribute('value', this.element.value);\n }\n }\n };\n NumericTextBox.prototype.checkAttributes = function () {\n var attributes = ['value', 'min', 'max', 'step', 'disabled', 'readonly', 'style', 'name'];\n for (var _i = 0, attributes_1 = attributes; _i < attributes_1.length; _i++) {\n var prop = attributes_1[_i];\n if (!isNullOrUndefined(this.element.getAttribute(prop))) {\n switch (prop) {\n case 'disabled':\n var enabled = this.element.getAttribute(prop) === 'disabled' || this.element.getAttribute(prop) === '' ||\n this.element.getAttribute(prop) === 'true' ? false : true;\n this.setProperties({ enabled: enabled }, true);\n break;\n case 'readonly':\n var readonly = this.element.getAttribute(prop) === 'readonly' || this.element.getAttribute(prop) === ''\n || this.element.getAttribute(prop) === 'true' ? true : false;\n this.setProperties({ readonly: readonly }, true);\n break;\n case 'style':\n this.inputStyle = this.element.getAttribute(prop);\n break;\n case 'name':\n this.inputName = this.element.getAttribute(prop);\n break;\n default:\n var value = this.instance.getNumberParser({ format: 'n' })(this.element.getAttribute(prop));\n if ((value !== null && !isNaN(value)) || (prop === 'value')) {\n this.setProperties(setValue(prop, value, {}), true);\n }\n break;\n }\n }\n }\n };\n NumericTextBox.prototype.updatePlaceholder = function () {\n this.setProperties({ placeholder: this.l10n.getConstant('placeholder') }, true);\n };\n NumericTextBox.prototype.initCultureFunc = function () {\n this.instance = new Internationalization(this.locale);\n };\n NumericTextBox.prototype.initCultureInfo = function () {\n this.cultureInfo.format = this.format;\n if (getValue('currency', this) !== null) {\n setValue('currency', this.currency, this.cultureInfo);\n this.setProperties({ currencyCode: this.currency }, true);\n }\n };\n /* Wrapper creation */\n NumericTextBox.prototype.createWrapper = function () {\n var inputObj = Input.createInput({\n element: this.element,\n floatLabelType: this.floatLabelType,\n properties: {\n readonly: this.readonly,\n placeholder: this.placeholder,\n cssClass: this.cssClass,\n enableRtl: this.enableRtl,\n showClearButton: this.showClearButton,\n enabled: this.enabled\n }\n }, this.createElement);\n this.inputWrapper = inputObj;\n this.container = inputObj.container;\n this.container.setAttribute('class', ROOT + ' ' + this.container.getAttribute('class'));\n if (this.readonly) {\n attributes(this.element, { 'aria-readonly': 'true' });\n }\n this.hiddenInput = (this.createElement('input', { attrs: { type: 'hidden', 'validateHidden': 'true' } }));\n this.inputName = this.inputName !== null ? this.inputName : this.element.id;\n this.element.removeAttribute('name');\n attributes(this.hiddenInput, { 'name': this.inputName });\n this.container.insertBefore(this.hiddenInput, this.container.childNodes[1]);\n if (this.inputStyle !== null) {\n attributes(this.container, { 'style': this.inputStyle });\n }\n };\n /* Spinner creation */\n NumericTextBox.prototype.spinBtnCreation = function () {\n this.spinDown = Input.appendSpan(SPINICON + ' ' + SPINDOWN, this.container, this.createElement);\n attributes(this.spinDown, {\n 'title': this.l10n.getConstant('decrementTitle'),\n 'aria-label': this.l10n.getConstant('decrementTitle')\n });\n this.spinUp = Input.appendSpan(SPINICON + ' ' + SPINUP, this.container, this.createElement);\n attributes(this.spinUp, {\n 'title': this.l10n.getConstant('incrementTitle'),\n 'aria-label': this.l10n.getConstant('incrementTitle')\n });\n this.wireSpinBtnEvents();\n };\n NumericTextBox.prototype.validateMinMax = function () {\n if (!(typeof (this.min) === 'number' && !isNaN(this.min))) {\n this.setProperties({ min: -(Number.MAX_VALUE) }, true);\n }\n if (!(typeof (this.max) === 'number' && !isNaN(this.max))) {\n this.setProperties({ max: Number.MAX_VALUE }, true);\n }\n if (this.decimals !== null) {\n if (this.min !== -(Number.MAX_VALUE)) {\n this.setProperties({ min: this.instance.getNumberParser({ format: 'n' })(this.formattedValue(this.decimals, this.min)) }, true);\n }\n if (this.max !== (Number.MAX_VALUE)) {\n this.setProperties({ max: this.instance.getNumberParser({ format: 'n' })(this.formattedValue(this.decimals, this.max)) }, true);\n }\n }\n this.setProperties({ min: this.min > this.max ? this.max : this.min }, true);\n attributes(this.element, { 'aria-valuemin': this.min.toString(), 'aria-valuemax': this.max.toString() });\n };\n NumericTextBox.prototype.formattedValue = function (decimals, value) {\n return this.instance.getNumberFormat({\n maximumFractionDigits: decimals,\n minimumFractionDigits: decimals, useGrouping: false\n })(value);\n };\n NumericTextBox.prototype.validateStep = function () {\n if (this.decimals !== null) {\n this.setProperties({ step: this.instance.getNumberParser({ format: 'n' })(this.formattedValue(this.decimals, this.step)) }, true);\n }\n };\n NumericTextBox.prototype.action = function (operation, event) {\n this.isInteract = true;\n var value = this.isFocused ? this.instance.getNumberParser({ format: 'n' })(this.element.value) : this.value;\n this.changeValue(this.performAction(value, this.step, operation));\n this.raiseChangeEvent(event);\n };\n NumericTextBox.prototype.checkErrorClass = function () {\n if (this.isValidState) {\n removeClass([this.container], ERROR);\n }\n else {\n addClass([this.container], ERROR);\n }\n attributes(this.element, { 'aria-invalid': this.isValidState ? 'false' : 'true' });\n };\n NumericTextBox.prototype.bindClearEvent = function () {\n if (this.showClearButton) {\n EventHandler.add(this.inputWrapper.clearButton, 'mousedown touchstart', this.resetHandler, this);\n }\n };\n NumericTextBox.prototype.resetHandler = function (e) {\n e.preventDefault();\n if (!(this.inputWrapper.clearButton.classList.contains('e-clear-icon-hide'))) {\n this.clear(e);\n }\n };\n NumericTextBox.prototype.clear = function (event) {\n this.setProperties({ value: null }, true);\n this.setElementValue('');\n };\n NumericTextBox.prototype.resetFormHandler = function () {\n if (this.element.tagName === 'EJS-NUMERICTEXTBOX') {\n this.updateValue(null);\n }\n else {\n this.updateValue(this.inputEleValue);\n }\n };\n NumericTextBox.prototype.wireEvents = function () {\n EventHandler.add(this.element, 'focus', this.focusIn, this);\n EventHandler.add(this.element, 'blur', this.focusOut, this);\n EventHandler.add(this.element, 'keydown', this.keyDownHandler, this);\n EventHandler.add(this.element, 'keyup', this.keyUpHandler, this);\n EventHandler.add(this.element, 'input', this.inputHandler, this);\n EventHandler.add(this.element, 'keypress', this.keyPressHandler, this);\n EventHandler.add(this.element, 'change', this.changeHandler, this);\n EventHandler.add(this.element, 'paste', this.pasteHandler, this);\n if (this.enabled) {\n this.bindClearEvent();\n if (this.formEle) {\n EventHandler.add(this.formEle, 'reset', this.resetFormHandler, this);\n }\n }\n };\n NumericTextBox.prototype.wireSpinBtnEvents = function () {\n /* bind spin button events */\n EventHandler.add(this.spinUp, Browser.touchStartEvent, this.mouseDownOnSpinner, this);\n EventHandler.add(this.spinDown, Browser.touchStartEvent, this.mouseDownOnSpinner, this);\n EventHandler.add(this.spinUp, Browser.touchEndEvent, this.mouseUpOnSpinner, this);\n EventHandler.add(this.spinDown, Browser.touchEndEvent, this.mouseUpOnSpinner, this);\n EventHandler.add(this.spinUp, Browser.touchMoveEvent, this.touchMoveOnSpinner, this);\n EventHandler.add(this.spinDown, Browser.touchMoveEvent, this.touchMoveOnSpinner, this);\n };\n NumericTextBox.prototype.unwireEvents = function () {\n EventHandler.remove(this.element, 'focus', this.focusIn);\n EventHandler.remove(this.element, 'blur', this.focusOut);\n EventHandler.remove(this.element, 'keyup', this.keyUpHandler);\n EventHandler.remove(this.element, 'input', this.inputHandler);\n EventHandler.remove(this.element, 'keydown', this.keyDownHandler);\n EventHandler.remove(this.element, 'keypress', this.keyPressHandler);\n EventHandler.remove(this.element, 'change', this.changeHandler);\n EventHandler.remove(this.element, 'paste', this.pasteHandler);\n if (this.formEle) {\n EventHandler.remove(this.formEle, 'reset', this.resetFormHandler);\n }\n };\n NumericTextBox.prototype.unwireSpinBtnEvents = function () {\n /* unbind spin button events */\n EventHandler.remove(this.spinUp, Browser.touchStartEvent, this.mouseDownOnSpinner);\n EventHandler.remove(this.spinDown, Browser.touchStartEvent, this.mouseDownOnSpinner);\n EventHandler.remove(this.spinUp, Browser.touchEndEvent, this.mouseUpOnSpinner);\n EventHandler.remove(this.spinDown, Browser.touchEndEvent, this.mouseUpOnSpinner);\n EventHandler.remove(this.spinUp, Browser.touchMoveEvent, this.touchMoveOnSpinner);\n EventHandler.remove(this.spinDown, Browser.touchMoveEvent, this.touchMoveOnSpinner);\n };\n NumericTextBox.prototype.changeHandler = function (event) {\n event.stopPropagation();\n if (!this.element.value.length) {\n this.setProperties({ value: null }, true);\n }\n var parsedInput = this.instance.getNumberParser({ format: 'n' })(this.element.value);\n this.updateValue(parsedInput, event);\n };\n NumericTextBox.prototype.raiseChangeEvent = function (event) {\n if (this.prevValue !== this.value) {\n var eventArgs = {};\n this.changeEventArgs = { value: this.value, previousValue: this.prevValue, isInteracted: this.isInteract,\n isInteraction: this.isInteract, event: event };\n if (event) {\n this.changeEventArgs.event = event;\n }\n if (this.changeEventArgs.event === undefined) {\n this.changeEventArgs.isInteracted = false;\n this.changeEventArgs.isInteraction = false;\n }\n merge(eventArgs, this.changeEventArgs);\n this.prevValue = this.value;\n this.isInteract = false;\n this.trigger('change', eventArgs);\n }\n };\n NumericTextBox.prototype.pasteHandler = function () {\n var _this = this;\n var beforeUpdate = this.element.value;\n setTimeout(function () {\n if (!_this.numericRegex().test(_this.element.value)) {\n _this.setElementValue(beforeUpdate);\n }\n });\n };\n NumericTextBox.prototype.preventHandler = function () {\n var _this = this;\n var iOS = !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);\n setTimeout(function () {\n if (_this.element.selectionStart > 0) {\n var currentPos = _this.element.selectionStart;\n var prevPos = _this.element.selectionStart - 1;\n var start = 0;\n var ignoreKeyCode = void 0;\n var valArray = _this.element.value.split('');\n var numericObject = getNumericObject(_this.locale);\n var decimalSeparator = getValue('decimal', numericObject);\n ignoreKeyCode = decimalSeparator.charCodeAt(0);\n if (_this.element.value[prevPos] === ' ' && _this.element.selectionStart > 0 && !iOS) {\n if (isNullOrUndefined(_this.prevVal)) {\n _this.element.value = _this.element.value.trim();\n }\n else if (prevPos !== 0) {\n _this.element.value = _this.prevVal;\n }\n else if (prevPos === 0) {\n _this.element.value = _this.element.value.trim();\n }\n _this.element.setSelectionRange(prevPos, prevPos);\n }\n else if (isNaN(parseFloat(_this.element.value[_this.element.selectionStart - 1])) &&\n _this.element.value[_this.element.selectionStart - 1].charCodeAt(0) !== 45) {\n if ((valArray.indexOf(_this.element.value[_this.element.selectionStart - 1]) !==\n valArray.lastIndexOf(_this.element.value[_this.element.selectionStart - 1]) &&\n _this.element.value[_this.element.selectionStart - 1].charCodeAt(0) === ignoreKeyCode) ||\n _this.element.value[_this.element.selectionStart - 1].charCodeAt(0) !== ignoreKeyCode) {\n _this.element.value = _this.element.value.substring(0, prevPos) +\n _this.element.value.substring(currentPos, _this.element.value.length);\n _this.element.setSelectionRange(prevPos, prevPos);\n if (isNaN(parseFloat(_this.element.value[_this.element.selectionStart - 1])) && _this.element.selectionStart > 0\n && _this.element.value.length) {\n _this.preventHandler();\n }\n }\n }\n else if (isNaN(parseFloat(_this.element.value[_this.element.selectionStart - 2])) && _this.element.selectionStart > 1 &&\n _this.element.value[_this.element.selectionStart - 2].charCodeAt(0) !== 45) {\n if ((valArray.indexOf(_this.element.value[_this.element.selectionStart - 2]) !==\n valArray.lastIndexOf(_this.element.value[_this.element.selectionStart - 2]) &&\n _this.element.value[_this.element.selectionStart - 2].charCodeAt(0) === ignoreKeyCode) ||\n _this.element.value[_this.element.selectionStart - 2].charCodeAt(0) !== ignoreKeyCode) {\n _this.element.setSelectionRange(prevPos, prevPos);\n _this.nextEle = _this.element.value[_this.element.selectionStart];\n _this.cursorPosChanged = true;\n _this.preventHandler();\n }\n }\n if (_this.cursorPosChanged === true && _this.element.value[_this.element.selectionStart] === _this.nextEle &&\n isNaN(parseFloat(_this.element.value[_this.element.selectionStart - 1]))) {\n _this.element.setSelectionRange(_this.element.selectionStart + 1, _this.element.selectionStart + 1);\n _this.cursorPosChanged = false;\n _this.nextEle = null;\n }\n if (_this.element.value.trim() === '') {\n _this.element.setSelectionRange(start, start);\n }\n if (_this.element.selectionStart > 0) {\n if ((_this.element.value[_this.element.selectionStart - 1].charCodeAt(0) === 45) && _this.element.selectionStart > 1) {\n if (isNullOrUndefined(_this.prevVal)) {\n _this.element.value = _this.element.value;\n }\n else {\n _this.element.value = _this.prevVal;\n }\n _this.element.setSelectionRange(_this.element.selectionStart, _this.element.selectionStart);\n }\n }\n _this.prevVal = _this.element.value;\n }\n });\n };\n NumericTextBox.prototype.keyUpHandler = function (event) {\n var iOS = !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);\n if (!iOS && Browser.isDevice) {\n this.preventHandler();\n }\n };\n ;\n NumericTextBox.prototype.inputHandler = function (event) {\n var iOS = !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);\n var fireFox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;\n if ((fireFox || iOS) && Browser.isDevice) {\n this.preventHandler();\n }\n };\n ;\n NumericTextBox.prototype.keyDownHandler = function (event) {\n if (!this.readonly) {\n switch (event.keyCode) {\n case 38:\n event.preventDefault();\n this.action(INCREMENT, event);\n break;\n case 40:\n event.preventDefault();\n this.action(DECREMENT, event);\n break;\n default: break;\n }\n }\n };\n ;\n NumericTextBox.prototype.performAction = function (value, step, operation) {\n if (value === null || isNaN(value)) {\n value = 0;\n }\n var updatedValue = operation === INCREMENT ? value + step : value - step;\n updatedValue = this.correctRounding(value, step, updatedValue);\n return this.strictMode ? this.trimValue(updatedValue) : updatedValue;\n };\n ;\n NumericTextBox.prototype.correctRounding = function (value, step, result) {\n var floatExp = new RegExp('[,.](.*)');\n var valueText = value.toString();\n var stepText = step.toString();\n var floatValue = floatExp.test(value.toString());\n var floatStep = floatExp.test(step.toString());\n if (floatValue || floatStep) {\n var valueCount = floatValue ? floatExp.exec(value.toString())[0].length : 0;\n var stepCount = floatStep ? floatExp.exec(step.toString())[0].length : 0;\n var max = Math.max(valueCount, stepCount);\n return value = this.roundValue(result, max);\n }\n return result;\n };\n ;\n NumericTextBox.prototype.roundValue = function (result, precision) {\n precision = precision || 0;\n var divide = Math.pow(10, precision);\n return result *= divide, result = Math.round(result) / divide;\n };\n ;\n NumericTextBox.prototype.updateValue = function (value, event) {\n if (event) {\n this.isInteract = true;\n }\n if (value !== null && !isNaN(value)) {\n if (this.decimals) {\n value = this.roundNumber(value, this.decimals);\n }\n }\n this.changeValue(value === null || isNaN(value) ? null : this.strictMode ? this.trimValue(value) : value);\n this.raiseChangeEvent(event);\n };\n NumericTextBox.prototype.updateCurrency = function (prop, propVal) {\n setValue(prop, propVal, this.cultureInfo);\n this.updateValue(this.value);\n };\n NumericTextBox.prototype.changeValue = function (value) {\n if (!(value || value === 0)) {\n value = null;\n this.setProperties({ value: value }, true);\n }\n else {\n var numberOfDecimals = void 0;\n var decimalPart = value.toString().split('.')[1];\n numberOfDecimals = !decimalPart || !decimalPart.length ? 0 : decimalPart.length;\n if (this.decimals !== null) {\n numberOfDecimals = numberOfDecimals < this.decimals ? numberOfDecimals : this.decimals;\n }\n this.setProperties({ value: this.roundNumber(value, numberOfDecimals) }, true);\n }\n this.modifyText();\n if (!this.strictMode) {\n this.validateState();\n }\n };\n ;\n NumericTextBox.prototype.modifyText = function () {\n if (this.value || this.value === 0) {\n var value = this.formatNumber();\n var elementValue = this.isFocused ? value : this.instance.getNumberFormat(this.cultureInfo)(this.value);\n this.setElementValue(elementValue);\n attributes(this.element, { 'aria-valuenow': value });\n this.hiddenInput.value = value;\n }\n else {\n this.setElementValue('');\n this.element.removeAttribute('aria-valuenow');\n this.hiddenInput.value = null;\n }\n };\n ;\n NumericTextBox.prototype.setElementValue = function (val, element) {\n Input.setValue(val, (element ? element : this.element), this.floatLabelType, this.showClearButton);\n };\n NumericTextBox.prototype.validateState = function () {\n this.isValidState = true;\n if (this.value || this.value === 0) {\n this.isValidState = !(this.value > this.max || this.value < this.min);\n }\n this.checkErrorClass();\n };\n NumericTextBox.prototype.formatNumber = function () {\n var numberOfDecimals;\n var currentValue = this.value;\n var decimalPart = currentValue.toString().split('.')[1];\n numberOfDecimals = !decimalPart || !decimalPart.length ? 0 : decimalPart.length;\n if (this.decimals !== null) {\n numberOfDecimals = numberOfDecimals < this.decimals ? numberOfDecimals : this.decimals;\n }\n return this.instance.getNumberFormat({\n maximumFractionDigits: numberOfDecimals,\n minimumFractionDigits: numberOfDecimals, useGrouping: false\n })(this.value);\n };\n ;\n NumericTextBox.prototype.trimValue = function (value) {\n if (value > this.max) {\n return this.max;\n }\n if (value < this.min) {\n return this.min;\n }\n return value;\n };\n ;\n NumericTextBox.prototype.roundNumber = function (value, precision) {\n var result = value;\n var decimals = precision || 0;\n var result1 = result.toString().split('e');\n result = Math.round(Number(result1[0] + 'e' + (result1[1] ? (Number(result1[1]) + decimals) : decimals)));\n var result2 = result.toString().split('e');\n result = Number(result2[0] + 'e' + (result2[1] ? (Number(result2[1]) - decimals) : -decimals));\n return Number(result.toFixed(decimals));\n };\n ;\n NumericTextBox.prototype.cancelEvent = function (event) {\n event.preventDefault();\n return false;\n };\n NumericTextBox.prototype.keyPressHandler = function (event) {\n if (!Browser.isDevice && Browser.info.version === '11.0' && event.keyCode === 13) {\n var parsedInput = this.instance.getNumberParser({ format: 'n' })(this.element.value);\n this.updateValue(parsedInput, event);\n return true;\n }\n if (event.which === 0 || event.metaKey || event.ctrlKey || event.keyCode === 8 || event.keyCode === 13) {\n return true;\n }\n var currentChar = String.fromCharCode(event.which);\n var text = this.element.value;\n text = text.substring(0, this.element.selectionStart) + currentChar + text.substring(this.element.selectionEnd);\n if (!this.numericRegex().test(text)) {\n event.preventDefault();\n event.stopPropagation();\n return false;\n }\n else {\n return true;\n }\n };\n ;\n NumericTextBox.prototype.numericRegex = function () {\n var numericObject = getNumericObject(this.locale);\n var decimalSeparator = getValue('decimal', numericObject);\n var fractionRule = '*';\n if (decimalSeparator === DECIMALSEPARATOR) {\n decimalSeparator = '\\\\' + decimalSeparator;\n }\n if (this.decimals === 0 && this.validateDecimalOnType) {\n return INTREGEXP;\n }\n if (this.decimals && this.validateDecimalOnType) {\n fractionRule = '{0,' + this.decimals + '}';\n }\n return new RegExp('^(-)?(((\\\\d+(' + decimalSeparator + '\\\\d' + fractionRule +\n ')?)|(' + decimalSeparator + '\\\\d' + fractionRule + ')))?$');\n };\n ;\n NumericTextBox.prototype.mouseWheel = function (event) {\n event.preventDefault();\n var delta;\n var rawEvent = event;\n if (rawEvent.wheelDelta) {\n delta = rawEvent.wheelDelta / 120;\n }\n else if (rawEvent.detail) {\n delta = -rawEvent.detail / 3;\n }\n if (delta > 0) {\n this.action(INCREMENT, event);\n }\n else if (delta < 0) {\n this.action(DECREMENT, event);\n }\n this.cancelEvent(event);\n };\n NumericTextBox.prototype.focusIn = function (event) {\n var _this = this;\n this.focusEventArgs = { event: event, value: this.value, container: this.container };\n this.trigger('focus', this.focusEventArgs);\n if (!this.enabled || this.readonly) {\n return;\n }\n this.isFocused = true;\n removeClass([this.container], ERROR);\n this.prevValue = this.value;\n if ((this.value || this.value === 0)) {\n var formatValue_1 = this.formatNumber();\n this.setElementValue(formatValue_1);\n if (!this.isPrevFocused) {\n var delay = (Browser.isDevice && Browser.isIos) ? 600 : 0;\n setTimeout(function () {\n _this.element.setSelectionRange(0, formatValue_1.length);\n }, delay);\n }\n }\n if (!Browser.isDevice) {\n EventHandler.add(this.element, 'mousewheel DOMMouseScroll', this.mouseWheel, this);\n }\n };\n ;\n NumericTextBox.prototype.focusOut = function (event) {\n var _this = this;\n this.blurEventArgs = { event: event, value: this.value, container: this.container };\n this.trigger('blur', this.blurEventArgs);\n if (this.isPrevFocused) {\n event.preventDefault();\n if (Browser.isDevice) {\n var value_1 = this.element.value;\n this.element.focus();\n this.isPrevFocused = false;\n var ele_1 = this.element;\n setTimeout(function () {\n _this.setElementValue(value_1, ele_1);\n }, 200);\n }\n }\n else {\n this.isFocused = false;\n if (!this.element.value.length) {\n this.setProperties({ value: null }, true);\n }\n var parsedInput = this.instance.getNumberParser({ format: 'n' })(this.element.value);\n this.updateValue(parsedInput);\n if (!Browser.isDevice) {\n EventHandler.remove(this.element, 'mousewheel DOMMouseScroll', this.mouseWheel);\n }\n }\n var formElement = closest(this.element, 'form');\n if (formElement) {\n var element = this.element.nextElementSibling;\n var focusEvent = document.createEvent('FocusEvent');\n focusEvent.initEvent('focusout', false, true);\n element.dispatchEvent(focusEvent);\n }\n };\n ;\n NumericTextBox.prototype.mouseDownOnSpinner = function (event) {\n var _this = this;\n if (this.isFocused) {\n this.isPrevFocused = true;\n event.preventDefault();\n }\n if (!this.getElementData(event)) {\n return;\n }\n var result = this.getElementData(event);\n var target = event.currentTarget;\n var action = (target.classList.contains(SPINUP)) ? INCREMENT : DECREMENT;\n EventHandler.add(target, 'mouseleave', this.mouseUpClick, this);\n this.timeOut = setInterval(function () { _this.isCalled = true; _this.action(action, event); }, 150);\n EventHandler.add(document, 'mouseup', this.mouseUpClick, this);\n };\n NumericTextBox.prototype.touchMoveOnSpinner = function (event) {\n var target = document.elementFromPoint(event.clientX, event.clientY);\n if (!(target.classList.contains(SPINICON))) {\n clearInterval(this.timeOut);\n }\n };\n NumericTextBox.prototype.mouseUpOnSpinner = function (event) {\n if (this.isPrevFocused) {\n this.element.focus();\n if (!Browser.isDevice) {\n this.isPrevFocused = false;\n }\n }\n if (!Browser.isDevice) {\n event.preventDefault();\n }\n if (!this.getElementData(event)) {\n return;\n }\n var target = event.currentTarget;\n var action = (target.classList.contains(SPINUP)) ? INCREMENT : DECREMENT;\n EventHandler.remove(target, 'mouseleave', this.mouseUpClick);\n if (!this.isCalled) {\n this.action(action, event);\n }\n this.isCalled = false;\n EventHandler.remove(document, 'mouseup', this.mouseUpClick);\n };\n NumericTextBox.prototype.getElementData = function (event) {\n if ((event.which && event.which === 3) || (event.button && event.button === 2)\n || !this.enabled || this.readonly) {\n return false;\n }\n clearInterval(this.timeOut);\n return true;\n };\n NumericTextBox.prototype.floatLabelTypeUpdate = function () {\n Input.removeFloating(this.inputWrapper);\n var hiddenInput = this.hiddenInput;\n this.hiddenInput.remove();\n Input.addFloating(this.element, this.floatLabelType, this.placeholder, this.createElement);\n this.container.insertBefore(hiddenInput, this.container.childNodes[1]);\n };\n NumericTextBox.prototype.mouseUpClick = function (event) {\n event.stopPropagation();\n clearInterval(this.timeOut);\n this.isCalled = false;\n EventHandler.remove(this.spinUp, 'mouseleave', this.mouseUpClick);\n EventHandler.remove(this.spinDown, 'mouseleave', this.mouseUpClick);\n };\n /**\n * Increments the NumericTextBox value with the specified step value.\n * @param {number} step - Specifies the value used to increment the NumericTextBox value.\n * if its not given then numeric value will be incremented based on the step property value.\n */\n NumericTextBox.prototype.increment = function (step) {\n if (step === void 0) { step = this.step; }\n this.isInteract = false;\n this.changeValue(this.performAction(this.value, step, INCREMENT));\n this.raiseChangeEvent();\n };\n /**\n * Decrements the NumericTextBox value with specified step value.\n * @param {number} step - Specifies the value used to decrement the NumericTextBox value.\n * if its not given then numeric value will be decremented based on the step property value.\n */\n NumericTextBox.prototype.decrement = function (step) {\n if (step === void 0) { step = this.step; }\n this.isInteract = false;\n this.changeValue(this.performAction(this.value, step, DECREMENT));\n this.raiseChangeEvent();\n };\n /**\n * Removes the component from the DOM and detaches all its related event handlers.\n * Also it maintains the initial input element from the DOM.\n * @method destroy\n * @return {void}\n */\n NumericTextBox.prototype.destroy = function () {\n this.unwireEvents();\n detach(this.hiddenInput);\n if (this.showSpinButton) {\n this.unwireSpinBtnEvents();\n detach(this.spinUp);\n detach(this.spinDown);\n }\n this.container.parentElement.appendChild(this.cloneElement);\n detach(this.container);\n _super.prototype.destroy.call(this);\n };\n /**\n * Returns the value of NumericTextBox with the format applied to the NumericTextBox.\n */\n NumericTextBox.prototype.getText = function () {\n return this.element.value;\n };\n /**\n * Gets the properties to be maintained in the persisted state.\n * @return {string}\n */\n NumericTextBox.prototype.getPersistData = function () {\n var keyEntity = ['value'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Calls internally if any of the property value is changed.\n * @private\n */\n NumericTextBox.prototype.onPropertyChanged = function (newProp, oldProp) {\n var elementVal;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'width':\n setStyleAttribute(this.container, { 'width': formatUnit(newProp.width) });\n break;\n case 'cssClass':\n Input.setCssClass(newProp.cssClass, [this.container], oldProp.cssClass);\n break;\n case 'enabled':\n Input.setEnabled(newProp.enabled, this.element);\n break;\n case 'enableRtl':\n Input.setEnableRtl(newProp.enableRtl, [this.container]);\n break;\n case 'readonly':\n Input.setReadonly(newProp.readonly, this.element);\n if (this.readonly) {\n attributes(this.element, { 'aria-readonly': 'true' });\n }\n else {\n this.element.removeAttribute('aria-readonly');\n }\n break;\n case 'placeholder':\n Input.setPlaceholder(newProp.placeholder, this.element);\n break;\n case 'step':\n this.step = newProp.step;\n this.validateStep();\n break;\n case 'showSpinButton':\n if (newProp.showSpinButton) {\n this.spinBtnCreation();\n }\n else {\n detach(this.spinUp);\n detach(this.spinDown);\n }\n break;\n case 'showClearButton':\n Input.setClearButton(newProp.showClearButton, this.element, this.inputWrapper, undefined, this.createElement);\n this.bindClearEvent();\n break;\n case 'floatLabelType':\n this.floatLabelType = newProp.floatLabelType;\n this.floatLabelTypeUpdate();\n break;\n case 'value':\n this.updateValue(newProp.value);\n break;\n case 'min':\n case 'max':\n setValue(prop, getValue(prop, newProp), this);\n this.validateMinMax();\n this.updateValue(this.value);\n break;\n case 'strictMode':\n this.strictMode = newProp.strictMode;\n this.updateValue(this.value);\n this.validateState();\n break;\n case 'locale':\n this.initCultureFunc();\n this.l10n.setLocale(this.locale);\n if (!isNullOrUndefined(this.spinDown)) {\n attributes(this.spinDown, {\n 'title': this.l10n.getConstant('decrementTitle'),\n 'aria-label': this.l10n.getConstant('decrementTitle')\n });\n }\n if (!isNullOrUndefined(this.spinUp)) {\n attributes(this.spinUp, {\n 'title': this.l10n.getConstant('incrementTitle'),\n 'aria-label': this.l10n.getConstant('incrementTitle')\n });\n }\n this.updatePlaceholder();\n Input.setPlaceholder(this.placeholder, this.element);\n this.updateValue(this.value);\n break;\n case 'currency':\n var propVal = getValue(prop, newProp);\n this.setProperties({ currencyCode: propVal }, true);\n this.updateCurrency(prop, propVal);\n break;\n case 'currencyCode':\n var propValue = getValue(prop, newProp);\n this.setProperties({ currency: propValue }, true);\n this.updateCurrency('currency', propValue);\n break;\n case 'format':\n setValue(prop, getValue(prop, newProp), this);\n this.initCultureInfo();\n this.updateValue(this.value);\n break;\n case 'decimals':\n this.decimals = newProp.decimals;\n this.updateValue(this.value);\n }\n }\n };\n /**\n * Gets the component name\n * @private\n */\n NumericTextBox.prototype.getModuleName = function () {\n return 'numerictextbox';\n };\n __decorate([\n Property('')\n ], NumericTextBox.prototype, \"cssClass\", void 0);\n __decorate([\n Property(null)\n ], NumericTextBox.prototype, \"value\", void 0);\n __decorate([\n Property(-(Number.MAX_VALUE))\n ], NumericTextBox.prototype, \"min\", void 0);\n __decorate([\n Property(Number.MAX_VALUE)\n ], NumericTextBox.prototype, \"max\", void 0);\n __decorate([\n Property(1)\n ], NumericTextBox.prototype, \"step\", void 0);\n __decorate([\n Property(null)\n ], NumericTextBox.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], NumericTextBox.prototype, \"placeholder\", void 0);\n __decorate([\n Property(true)\n ], NumericTextBox.prototype, \"showSpinButton\", void 0);\n __decorate([\n Property(false)\n ], NumericTextBox.prototype, \"readonly\", void 0);\n __decorate([\n Property(true)\n ], NumericTextBox.prototype, \"enabled\", void 0);\n __decorate([\n Property(false)\n ], NumericTextBox.prototype, \"enableRtl\", void 0);\n __decorate([\n Property(false)\n ], NumericTextBox.prototype, \"showClearButton\", void 0);\n __decorate([\n Property(false)\n ], NumericTextBox.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property('n2')\n ], NumericTextBox.prototype, \"format\", void 0);\n __decorate([\n Property(null)\n ], NumericTextBox.prototype, \"decimals\", void 0);\n __decorate([\n Property(null)\n ], NumericTextBox.prototype, \"currency\", void 0);\n __decorate([\n Property(null)\n ], NumericTextBox.prototype, \"currencyCode\", void 0);\n __decorate([\n Property(true)\n ], NumericTextBox.prototype, \"strictMode\", void 0);\n __decorate([\n Property(false)\n ], NumericTextBox.prototype, \"validateDecimalOnType\", void 0);\n __decorate([\n Property('Never')\n ], NumericTextBox.prototype, \"floatLabelType\", void 0);\n __decorate([\n Event()\n ], NumericTextBox.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], NumericTextBox.prototype, \"destroyed\", void 0);\n __decorate([\n Event()\n ], NumericTextBox.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], NumericTextBox.prototype, \"focus\", void 0);\n __decorate([\n Event()\n ], NumericTextBox.prototype, \"blur\", void 0);\n NumericTextBox = __decorate([\n NotifyPropertyChanges\n ], NumericTextBox);\n return NumericTextBox;\n}(Component));\nexport { NumericTextBox };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, Event, Property, NotifyPropertyChanges } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, formatUnit, getValue, setValue, addClass, detach } from '@syncfusion/ej2-base';\nimport { removeClass, Browser, closest } from '@syncfusion/ej2-base';\nimport { Input } from '../../input/input';\nimport { regularExpressions, createMask, applyMask, wireEvents, unwireEvents, unstrippedValue, strippedValue } from '../base/index';\nimport { setMaskValue, setElementValue, bindClearEvent } from '../base/index';\nimport { maskInputBlurHandler } from '../base/mask-base';\nvar ROOT = 'e-widget e-control-wrapper e-mask';\nvar INPUT = 'e-input';\nvar COMPONENT = 'e-maskedtextbox';\nvar CONTROL = 'e-control';\n/**\n * The MaskedTextBox allows the user to enter the valid input only based on the provided mask.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar MaskedTextBox = /** @class */ (function (_super) {\n __extends(MaskedTextBox, _super);\n function MaskedTextBox(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.initInputValue = '';\n return _this;\n }\n /**\n * Gets the component name\n * @private\n */\n MaskedTextBox.prototype.getModuleName = function () {\n return 'maskedtextbox';\n };\n /**\n * Initializes the event handler\n * @private\n */\n MaskedTextBox.prototype.preRender = function () {\n this.promptMask = '';\n this.hiddenMask = '';\n this.escapeMaskValue = '';\n this.regExpCollec = regularExpressions;\n this.customRegExpCollec = [];\n this.undoCollec = [];\n this.redoCollec = [];\n this.changeEventArgs = {};\n this.focusEventArgs = {};\n this.blurEventArgs = {};\n this.maskKeyPress = false;\n this.isFocus = false;\n this.isInitial = false;\n this.isIosInvalid = false;\n var ejInstance = getValue('ej2_instances', this.element);\n this.cloneElement = this.element.cloneNode(true);\n removeClass([this.cloneElement], [CONTROL, COMPONENT, 'e-lib']);\n this.angularTagName = null;\n this.formElement = closest(this.element, 'form');\n if (this.element.tagName === 'EJS-MASKEDTEXTBOX') {\n this.angularTagName = this.element.tagName;\n var input = this.createElement('input');\n for (var i = 0; i < this.element.attributes.length; i++) {\n input.setAttribute(this.element.attributes[i].nodeName, this.element.attributes[i].nodeValue);\n input.innerHTML = this.element.innerHTML;\n }\n if (this.element.hasAttribute('id')) {\n this.element.removeAttribute('id');\n }\n this.element.classList.remove('e-control', 'e-maskedtextbox');\n this.element.classList.add('e-mask-container');\n this.element.appendChild(input);\n this.element = input;\n setValue('ej2_instances', ejInstance, this.element);\n }\n if (this.formElement) {\n this.initInputValue = this.value;\n }\n };\n /**\n * Gets the properties to be maintained in the persisted state.\n * @return {string}\n */\n MaskedTextBox.prototype.getPersistData = function () {\n var keyEntity = ['value'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Initializes the component rendering.\n * @private\n */\n MaskedTextBox.prototype.render = function () {\n if (this.element.tagName.toLowerCase() === 'input') {\n if (this.floatLabelType === 'Never') {\n addClass([this.element], INPUT);\n }\n this.createWrapper();\n if (this.element.name === '') {\n this.element.setAttribute('name', this.element.id);\n }\n this.isInitial = true;\n this.resetMaskedTextBox();\n this.isInitial = false;\n this.setMaskPlaceholder(true, false);\n this.setWidth(this.width);\n this.preEleVal = this.element.value;\n if (!Browser.isDevice && (Browser.info.version === '11.0' || Browser.info.name === 'edge')) {\n this.element.blur();\n }\n if (this.element.getAttribute('value') || this.value) {\n this.element.setAttribute('value', this.element.value);\n }\n }\n };\n MaskedTextBox.prototype.resetMaskedTextBox = function () {\n this.promptMask = '';\n this.hiddenMask = '';\n this.escapeMaskValue = '';\n this.customRegExpCollec = [];\n this.undoCollec = [];\n this.redoCollec = [];\n if (this.promptChar.length > 1) {\n this.promptChar = this.promptChar[0];\n }\n createMask.call(this);\n applyMask.call(this);\n if (this.mask === null || this.mask === '' && this.value !== undefined) {\n setElementValue.call(this, this.value);\n }\n var val = strippedValue.call(this, this.element);\n this.prevValue = val;\n this.value = val;\n if (!this.isInitial) {\n unwireEvents.call(this);\n }\n wireEvents.call(this);\n };\n MaskedTextBox.prototype.setMaskPlaceholder = function (setVal, dynamicPlaceholder) {\n if (dynamicPlaceholder || this.placeholder) {\n Input.setPlaceholder(this.placeholder, this.element);\n if (this.element.value === this.promptMask && setVal && this.floatLabelType !== 'Always') {\n setElementValue.call(this, '');\n }\n if (this.floatLabelType === 'Never') {\n maskInputBlurHandler.call(this);\n }\n }\n };\n MaskedTextBox.prototype.setCssClass = function (cssClass, element) {\n if (cssClass) {\n addClass(element, cssClass);\n }\n };\n MaskedTextBox.prototype.setWidth = function (width) {\n if (!isNullOrUndefined(width)) {\n this.element.style.width = formatUnit(width);\n this.inputObj.container.style.width = formatUnit(width);\n }\n };\n MaskedTextBox.prototype.createWrapper = function () {\n this.inputObj = Input.createInput({\n element: this.element,\n floatLabelType: this.floatLabelType,\n properties: {\n enableRtl: this.enableRtl,\n cssClass: this.cssClass,\n enabled: this.enabled,\n placeholder: this.placeholder,\n showClearButton: this.showClearButton\n }\n }, this.createElement);\n this.inputObj.container.setAttribute('class', ROOT + ' ' + this.inputObj.container.getAttribute('class'));\n };\n /**\n * Calls internally if any of the property value is changed.\n * @hidden\n */\n MaskedTextBox.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'value':\n setMaskValue.call(this, this.value);\n if (this.placeholder) {\n this.setMaskPlaceholder(false, false);\n }\n break;\n case 'placeholder':\n this.setMaskPlaceholder(true, true);\n break;\n case 'width':\n this.setWidth(newProp.width);\n break;\n case 'cssClass':\n this.setCssClass(newProp.cssClass, [this.inputObj.container]);\n break;\n case 'enabled':\n Input.setEnabled(newProp.enabled, this.element);\n break;\n case 'enableRtl':\n Input.setEnableRtl(newProp.enableRtl, [this.inputObj.container]);\n break;\n case 'customCharacters':\n this.customCharacters = newProp.customCharacters;\n this.resetMaskedTextBox();\n break;\n case 'showClearButton':\n Input.setClearButton(newProp.showClearButton, this.element, this.inputObj, undefined, this.createElement);\n bindClearEvent.call(this);\n break;\n case 'floatLabelType':\n this.floatLabelType = newProp.floatLabelType;\n Input.removeFloating(this.inputObj);\n Input.addFloating(this.element, this.floatLabelType, this.placeholder, this.createElement);\n break;\n case 'mask':\n var strippedValue_1 = this.value;\n this.mask = newProp.mask;\n this.updateValue(strippedValue_1);\n break;\n case 'promptChar':\n if (newProp.promptChar.length > 1) {\n newProp.promptChar = newProp.promptChar[0];\n }\n if (newProp.promptChar) {\n this.promptChar = newProp.promptChar;\n }\n else {\n this.promptChar = '_';\n }\n var value = this.element.value.replace(new RegExp('[' + oldProp.promptChar + ']', 'g'), this.promptChar);\n if (this.promptMask === this.element.value) {\n value = this.promptMask.replace(new RegExp('[' + oldProp.promptChar + ']', 'g'), this.promptChar);\n }\n this.promptMask = this.promptMask.replace(new RegExp('[' + oldProp.promptChar + ']', 'g'), this.promptChar);\n this.undoCollec = this.redoCollec = [];\n setElementValue.call(this, value);\n break;\n }\n }\n };\n MaskedTextBox.prototype.updateValue = function (strippedVal) {\n this.resetMaskedTextBox();\n setMaskValue.call(this, strippedVal);\n };\n /**\n * Gets the value of the MaskedTextBox with the masked format.\n * By using `value` property, you can get the raw value of maskedtextbox without literals and prompt characters.\n * @return {string}\n */\n MaskedTextBox.prototype.getMaskedValue = function () {\n return unstrippedValue.call(this, this.element);\n };\n /**\n * Removes the component from the DOM and detaches all its related event handlers.\n * Also it maintains the initial input element from the DOM.\n * @method destroy\n * @return {void}\n */\n MaskedTextBox.prototype.destroy = function () {\n unwireEvents.call(this);\n this.inputObj.container.parentElement.appendChild(this.cloneElement);\n detach(this.inputObj.container);\n _super.prototype.destroy.call(this);\n };\n __decorate([\n Property(null)\n ], MaskedTextBox.prototype, \"cssClass\", void 0);\n __decorate([\n Property(null)\n ], MaskedTextBox.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], MaskedTextBox.prototype, \"placeholder\", void 0);\n __decorate([\n Property('Never')\n ], MaskedTextBox.prototype, \"floatLabelType\", void 0);\n __decorate([\n Property(true)\n ], MaskedTextBox.prototype, \"enabled\", void 0);\n __decorate([\n Property(false)\n ], MaskedTextBox.prototype, \"showClearButton\", void 0);\n __decorate([\n Property(false)\n ], MaskedTextBox.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property(false)\n ], MaskedTextBox.prototype, \"enableRtl\", void 0);\n __decorate([\n Property(null)\n ], MaskedTextBox.prototype, \"mask\", void 0);\n __decorate([\n Property('_')\n ], MaskedTextBox.prototype, \"promptChar\", void 0);\n __decorate([\n Property(null)\n ], MaskedTextBox.prototype, \"value\", void 0);\n __decorate([\n Property(null)\n ], MaskedTextBox.prototype, \"customCharacters\", void 0);\n __decorate([\n Event()\n ], MaskedTextBox.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], MaskedTextBox.prototype, \"destroyed\", void 0);\n __decorate([\n Event()\n ], MaskedTextBox.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], MaskedTextBox.prototype, \"focus\", void 0);\n __decorate([\n Event()\n ], MaskedTextBox.prototype, \"blur\", void 0);\n MaskedTextBox = __decorate([\n NotifyPropertyChanges\n ], MaskedTextBox);\n return MaskedTextBox;\n}(Component));\nexport { MaskedTextBox };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, EventHandler, Property, Event, Complex } from '@syncfusion/ej2-base';\nimport { L10n, Internationalization } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, ChildProperty } from '@syncfusion/ej2-base';\nimport { attributes, addClass, removeClass, setStyleAttribute, detach, closest } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, formatUnit, Browser } from '@syncfusion/ej2-base';\nimport { Tooltip } from '@syncfusion/ej2-popups';\n/**\n * Configures the ticks data of the Slider.\n */\nvar TicksData = /** @class */ (function (_super) {\n __extends(TicksData, _super);\n function TicksData() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('None')\n ], TicksData.prototype, \"placement\", void 0);\n __decorate([\n Property(10)\n ], TicksData.prototype, \"largeStep\", void 0);\n __decorate([\n Property(1)\n ], TicksData.prototype, \"smallStep\", void 0);\n __decorate([\n Property(false)\n ], TicksData.prototype, \"showSmallTicks\", void 0);\n __decorate([\n Property(null)\n ], TicksData.prototype, \"format\", void 0);\n return TicksData;\n}(ChildProperty));\nexport { TicksData };\n/**\n * It illustrates the limit data in slider.\n */\nvar LimitData = /** @class */ (function (_super) {\n __extends(LimitData, _super);\n function LimitData() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], LimitData.prototype, \"enabled\", void 0);\n __decorate([\n Property(null)\n ], LimitData.prototype, \"minStart\", void 0);\n __decorate([\n Property(null)\n ], LimitData.prototype, \"minEnd\", void 0);\n __decorate([\n Property(null)\n ], LimitData.prototype, \"maxStart\", void 0);\n __decorate([\n Property(null)\n ], LimitData.prototype, \"maxEnd\", void 0);\n __decorate([\n Property(false)\n ], LimitData.prototype, \"startHandleFixed\", void 0);\n __decorate([\n Property(false)\n ], LimitData.prototype, \"endHandleFixed\", void 0);\n return LimitData;\n}(ChildProperty));\nexport { LimitData };\n/**\n * It illustrates the tooltip data in slider.\n */\nvar TooltipData = /** @class */ (function (_super) {\n __extends(TooltipData, _super);\n function TooltipData() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], TooltipData.prototype, \"cssClass\", void 0);\n __decorate([\n Property('Before')\n ], TooltipData.prototype, \"placement\", void 0);\n __decorate([\n Property('Focus')\n ], TooltipData.prototype, \"showOn\", void 0);\n __decorate([\n Property(false)\n ], TooltipData.prototype, \"isVisible\", void 0);\n __decorate([\n Property(null)\n ], TooltipData.prototype, \"format\", void 0);\n return TooltipData;\n}(ChildProperty));\nexport { TooltipData };\nvar bootstrapTooltipOffset = 6;\nvar bootstrap4TooltipOffset = 3;\nvar classNames = {\n root: 'e-slider',\n rtl: 'e-rtl',\n sliderHiddenInput: 'e-slider-input',\n controlWrapper: 'e-control-wrapper',\n sliderHandle: 'e-handle',\n rangeBar: 'e-range',\n sliderButton: 'e-slider-button',\n firstButton: 'e-first-button',\n secondButton: 'e-second-button',\n scale: 'e-scale',\n tick: 'e-tick',\n large: 'e-large',\n tickValue: 'e-tick-value',\n sliderTooltip: 'e-slider-tooltip',\n sliderHover: 'e-slider-hover',\n sliderFirstHandle: 'e-handle-first',\n sliderSecondHandle: 'e-handle-second',\n sliderDisabled: 'e-disabled',\n sliderContainer: 'e-slider-container',\n horizontalTooltipBefore: 'e-slider-horizontal-before',\n horizontalTooltipAfter: 'e-slider-horizontal-after',\n verticalTooltipBefore: 'e-slider-vertical-before',\n verticalTooltipAfter: 'e-slider-vertical-after',\n materialTooltip: 'e-material-tooltip',\n materialTooltipOpen: 'e-material-tooltip-open',\n materialTooltipActive: 'e-tooltip-active',\n materialSlider: 'e-material-slider',\n sliderTrack: 'e-slider-track',\n sliderHandleFocused: 'e-handle-focused',\n verticalSlider: 'e-vertical',\n horizontalSlider: 'e-horizontal',\n sliderHandleStart: 'e-handle-start',\n sliderTooltipStart: 'e-material-tooltip-start',\n sliderTabHandle: 'e-tab-handle',\n sliderButtonIcon: 'e-button-icon',\n sliderSmallSize: 'e-small-size',\n sliderTickPosition: 'e-tick-pos',\n sliderFirstTick: 'e-first-tick',\n sliderLastTick: 'e-last-tick',\n sliderButtonClass: 'e-slider-btn',\n sliderTooltipWrapper: 'e-tooltip-wrap',\n sliderTabTrack: 'e-tab-track',\n sliderTabRange: 'e-tab-range',\n sliderActiveHandle: 'e-handle-active',\n sliderMaterialHandle: 'e-material-handle',\n sliderMaterialRange: 'e-material-range',\n sliderMaterialDefault: 'e-material-default',\n materialTooltipShow: 'e-material-tooltip-show',\n materialTooltipHide: 'e-material-tooltip-hide',\n readonly: 'e-read-only',\n limits: 'e-limits',\n limitBarDefault: 'e-limit-bar',\n limitBarFirst: 'e-limit-first',\n limitBarSecond: 'e-limit-second',\n dragHorizontal: 'e-drag-horizontal',\n dragVertical: 'e-drag-vertical'\n};\n/**\n * The Slider component allows the user to select a value or range\n * of values in-between a min and max range, by dragging the handle over the slider bar.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar Slider = /** @class */ (function (_super) {\n __extends(Slider, _super);\n function Slider(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.horDir = 'left';\n _this.verDir = 'bottom';\n _this.transition = {\n handle: 'left .4s cubic-bezier(.25, .8, .25, 1), right .4s cubic-bezier(.25, .8, .25, 1), ' +\n 'top .4s cubic-bezier(.25, .8, .25, 1) , bottom .4s cubic-bezier(.25, .8, .25, 1)',\n rangeBar: 'all .4s cubic-bezier(.25, .8, .25, 1)'\n };\n _this.transitionOnMaterialTooltip = {\n handle: 'left 1ms ease-out, right 1ms ease-out, bottom 1ms ease-out, top 1ms ease-out',\n rangeBar: 'left 1ms ease-out, right 1ms ease-out, bottom 1ms ease-out, width 1ms ease-out, height 1ms ease-out'\n };\n _this.scaleTransform = 'transform .4s cubic-bezier(.25, .8, .25, 1)';\n _this.customAriaText = null;\n _this.drag = true;\n return _this;\n }\n Slider.prototype.preRender = function () {\n var localeText = { incrementTitle: 'Increase', decrementTitle: 'Decrease' };\n this.l10n = new L10n('slider', localeText, this.locale);\n this.isElementFocused = false;\n this.tickElementCollection = [];\n this.tooltipFormatInfo = {};\n this.ticksFormatInfo = {};\n this.initCultureInfo();\n this.initCultureFunc();\n this.formChecker();\n };\n Slider.prototype.formChecker = function () {\n var formElement = closest(this.element, 'form');\n if (formElement) {\n this.isForm = true;\n // this condition needs to be checked, if the slider is going to be refreshed by `refresh()`\n // then we need to revert the slider `value` back to `formResetValue` to preserve the initial value\n if (!isNullOrUndefined(this.formResetValue)) {\n this.setProperties({ 'value': this.formResetValue }, true);\n }\n this.formResetValue = this.value;\n if (this.type === 'Range' &&\n (isNullOrUndefined(this.formResetValue) || typeof (this.formResetValue) !== 'object')) {\n this.formResetValue = [parseFloat(formatUnit(this.min)), parseFloat(formatUnit(this.max))];\n }\n else if (isNullOrUndefined(this.formResetValue)) {\n this.formResetValue = parseFloat(formatUnit(this.min));\n }\n this.formElement = formElement;\n }\n else {\n this.isForm = false;\n }\n };\n Slider.prototype.initCultureFunc = function () {\n this.internationalization = new Internationalization(this.locale);\n };\n Slider.prototype.initCultureInfo = function () {\n this.tooltipFormatInfo.format = (!isNullOrUndefined(this.tooltip.format)) ? this.tooltip.format : null;\n this.ticksFormatInfo.format = (!isNullOrUndefined(this.ticks.format)) ? this.ticks.format : null;\n };\n Slider.prototype.formatString = function (value, formatInfo) {\n var formatValue = null;\n var formatString = null;\n if ((value || value === 0)) {\n formatValue = this.formatNumber(value);\n var numberOfDecimals = this.numberOfDecimals(value);\n formatString = this.internationalization.getNumberFormat(formatInfo)(this.makeRoundNumber(value, numberOfDecimals));\n }\n return { elementVal: formatValue, formatString: formatString };\n };\n ;\n Slider.prototype.formatNumber = function (value) {\n var numberOfDecimals = this.numberOfDecimals(value);\n return this.internationalization.getNumberFormat({\n maximumFractionDigits: numberOfDecimals,\n minimumFractionDigits: numberOfDecimals, useGrouping: false\n })(value);\n };\n ;\n Slider.prototype.numberOfDecimals = function (value) {\n var decimalPart = value.toString().split('.')[1];\n var numberOfDecimals = !decimalPart || !decimalPart.length ? 0 : decimalPart.length;\n return numberOfDecimals;\n };\n Slider.prototype.makeRoundNumber = function (value, precision) {\n var decimals = precision || 0;\n return Number(value.toFixed(decimals));\n };\n ;\n Slider.prototype.fractionalToInteger = function (value) {\n value = (this.numberOfDecimals(value) === 0) ? Number(value).toFixed(this.noOfDecimals) : value;\n var tens = 1;\n for (var i = 0; i < this.noOfDecimals; i++) {\n tens *= 10;\n }\n value = Number((value * tens).toFixed(0));\n return value;\n };\n /**\n * To Initialize the control rendering\n * @private\n */\n Slider.prototype.render = function () {\n this.initialize();\n this.initRender();\n this.wireEvents();\n this.setZindex();\n };\n Slider.prototype.initialize = function () {\n addClass([this.element], classNames.root);\n this.setCSSClass();\n };\n Slider.prototype.setCSSClass = function (oldCSSClass) {\n if (oldCSSClass) {\n removeClass([this.element], oldCSSClass.split(' '));\n }\n if (this.cssClass) {\n addClass([this.element], this.cssClass.split(' '));\n }\n };\n Slider.prototype.setEnabled = function () {\n if (!this.enabled) {\n addClass([this.sliderContainer], [classNames.sliderDisabled]);\n if (this.tooltip.isVisible && this.tooltipElement && this.tooltip.showOn === 'Always') {\n this.tooltipElement.classList.add(classNames.sliderDisabled);\n }\n this.unwireEvents();\n }\n else {\n removeClass([this.sliderContainer], [classNames.sliderDisabled]);\n if (this.tooltip.isVisible && this.tooltipElement && this.tooltip.showOn === 'Always') {\n this.tooltipElement.classList.remove(classNames.sliderDisabled);\n }\n this.wireEvents();\n }\n };\n Slider.prototype.getTheme = function (container) {\n var theme = window.getComputedStyle(container, ':after').getPropertyValue('content');\n return theme.replace(/['\"]+/g, '');\n };\n /**\n * Initialize the rendering\n * @private\n */\n Slider.prototype.initRender = function () {\n this.sliderContainer = this.createElement('div', { className: classNames.sliderContainer + ' ' + classNames.controlWrapper });\n this.element.parentNode.insertBefore(this.sliderContainer, this.element);\n this.sliderContainer.appendChild(this.element);\n this.sliderTrack = this.createElement('div', { className: classNames.sliderTrack });\n this.element.appendChild(this.sliderTrack);\n this.element.tabIndex = -1;\n this.getThemeInitialization();\n this.setHandler();\n this.createRangeBar();\n if (this.limits.enabled) {\n this.createLimitBar();\n }\n this.setOrientClass();\n this.hiddenInput = (this.createElement('input', {\n attrs: {\n type: 'hidden', value: (isNullOrUndefined(this.value) ? this.min.toString() : this.value.toString()),\n name: this.element.getAttribute('name') || this.element.getAttribute('id') ||\n '_' + (Math.random() * 1000).toFixed(0) + 'slider', class: classNames.sliderHiddenInput\n }\n }));\n this.hiddenInput.tabIndex = -1;\n this.sliderContainer.appendChild(this.hiddenInput);\n if (this.showButtons) {\n this.setButtons();\n }\n this.setEnableRTL();\n if (this.type === 'Range') {\n this.rangeValueUpdate();\n }\n else {\n this.value = isNullOrUndefined(this.value) ? parseFloat(formatUnit(this.min.toString())) : this.value;\n }\n this.previousVal = this.type !== 'Range' ? this.checkHandleValue(parseFloat(formatUnit(this.value.toString()))) :\n [this.checkHandleValue(parseFloat(formatUnit(this.value[0].toString()))),\n this.checkHandleValue(parseFloat(formatUnit(this.value[1].toString())))];\n this.previousChanged = this.previousVal;\n if (!isNullOrUndefined(this.element.hasAttribute('name'))) {\n this.element.removeAttribute('name');\n }\n this.setValue();\n if (this.limits.enabled) {\n this.setLimitBar();\n }\n if (this.ticks.placement !== 'None') {\n this.renderScale();\n }\n if (this.tooltip.isVisible) {\n this.renderTooltip();\n }\n if (!this.enabled) {\n addClass([this.sliderContainer], [classNames.sliderDisabled]);\n }\n else {\n removeClass([this.sliderContainer], [classNames.sliderDisabled]);\n }\n if (this.readonly) {\n addClass([this.sliderContainer], [classNames.readonly]);\n }\n else {\n removeClass([this.sliderContainer], [classNames.readonly]);\n }\n };\n Slider.prototype.getThemeInitialization = function () {\n this.isMaterial = this.getTheme(this.sliderContainer) === 'material'\n || this.getTheme(this.sliderContainer) === 'material-dark';\n this.isBootstrap = this.getTheme(this.sliderContainer) === 'bootstrap'\n || this.getTheme(this.sliderContainer) === 'bootstrap-dark';\n this.isBootstrap4 = this.getTheme(this.sliderContainer) === 'bootstrap4';\n this.isMaterialTooltip = this.isMaterial && this.type !== 'Range' && this.tooltip.isVisible;\n };\n Slider.prototype.createRangeBar = function () {\n if (this.type !== 'Default') {\n this.rangeBar = (this.createElement('div', { attrs: { class: classNames.rangeBar } }));\n this.element.appendChild(this.rangeBar);\n if (this.drag && this.type === 'Range') {\n if (this.orientation === 'Horizontal') {\n this.rangeBar.classList.add(classNames.dragHorizontal);\n }\n else {\n this.rangeBar.classList.add(classNames.dragVertical);\n }\n }\n }\n };\n Slider.prototype.createLimitBar = function () {\n var firstElementClassName = this.type !== 'Range' ? classNames.limitBarDefault :\n classNames.limitBarFirst;\n firstElementClassName += ' ' + classNames.limits;\n this.limitBarFirst = (this.createElement('div', {\n attrs: { class: firstElementClassName }\n }));\n this.element.appendChild(this.limitBarFirst);\n if (this.type === 'Range') {\n this.limitBarSecond = (this.createElement('div', {\n attrs: {\n class: classNames.limitBarSecond + ' ' + classNames.limits\n }\n }));\n this.element.appendChild(this.limitBarSecond);\n }\n };\n Slider.prototype.setOrientClass = function () {\n if (this.orientation !== 'Vertical') {\n this.sliderContainer.classList.remove(classNames.verticalSlider);\n this.sliderContainer.classList.add(classNames.horizontalSlider);\n this.firstHandle.setAttribute('aria-orientation', 'horizontal');\n if (this.type === 'Range') {\n this.secondHandle.setAttribute('aria-orientation', 'horizontal');\n }\n }\n else {\n this.sliderContainer.classList.remove(classNames.horizontalSlider);\n this.sliderContainer.classList.add(classNames.verticalSlider);\n this.firstHandle.setAttribute('aria-orientation', 'vertical');\n if (this.type === 'Range') {\n this.secondHandle.setAttribute('aria-orientation', 'vertical');\n }\n }\n };\n Slider.prototype.setAriaAttributes = function (element) {\n var _this = this;\n var min = this.min;\n var max = this.max;\n if (!isNullOrUndefined(this.customValues) && this.customValues.length > 0) {\n min = this.customValues[0];\n max = this.customValues[this.customValues.length - 1];\n }\n if (this.type !== 'Range') {\n attributes(element, {\n 'aria-valuemin': min.toString(), 'aria-valuemax': max.toString()\n });\n }\n else {\n var range = !isNullOrUndefined(this.customValues) && this.customValues.length > 0 ?\n [[min.toString(), (this.customValues[this.value[1]]).toString()],\n [(this.customValues[this.value[0]]).toString(), max.toString()]] :\n [[min.toString(), this.value[1].toString()], [this.value[0].toString(), max.toString()]];\n range.forEach(function (range, index) {\n var element = index === 0 ? _this.firstHandle : _this.secondHandle;\n if (element) {\n attributes(element, {\n 'aria-valuemin': range[0], 'aria-valuemax': range[1]\n });\n }\n });\n }\n };\n Slider.prototype.createSecondHandle = function () {\n this.secondHandle = this.createElement('div', {\n attrs: {\n class: classNames.sliderHandle, 'role': 'slider', 'aria-labelledby': this.element.id + '_title', tabIndex: '0'\n }\n });\n this.secondHandle.classList.add(classNames.sliderSecondHandle);\n this.element.appendChild(this.secondHandle);\n };\n Slider.prototype.createFirstHandle = function () {\n this.firstHandle = this.createElement('div', {\n attrs: {\n class: classNames.sliderHandle, 'role': 'slider', 'aria-labelledby': this.element.id + '_title', tabIndex: '0'\n }\n });\n this.firstHandle.classList.add(classNames.sliderFirstHandle);\n this.element.appendChild(this.firstHandle);\n if (this.isMaterialTooltip) {\n this.materialHandle = this.createElement('div', {\n attrs: {\n class: classNames.sliderHandle + ' ' +\n classNames.sliderMaterialHandle\n }\n });\n this.element.appendChild(this.materialHandle);\n }\n };\n Slider.prototype.wireFirstHandleEvt = function (destroy) {\n if (!destroy) {\n EventHandler.add(this.firstHandle, 'mousedown touchstart', this.handleFocus, this);\n EventHandler.add(this.firstHandle, 'transitionend', this.transitionEnd, this);\n EventHandler.add(this.firstHandle, 'mouseenter touchenter', this.handleOver, this);\n EventHandler.add(this.firstHandle, 'mouseleave touchend', this.handleLeave, this);\n }\n else {\n EventHandler.remove(this.firstHandle, 'mousedown touchstart', this.handleFocus);\n EventHandler.remove(this.firstHandle, 'transitionend', this.transitionEnd);\n EventHandler.remove(this.firstHandle, 'mouseenter touchenter', this.handleOver);\n EventHandler.remove(this.firstHandle, 'mouseleave touchend', this.handleLeave);\n }\n };\n Slider.prototype.wireSecondHandleEvt = function (destroy) {\n if (!destroy) {\n EventHandler.add(this.secondHandle, 'mousedown touchstart', this.handleFocus, this);\n EventHandler.add(this.secondHandle, 'transitionend', this.transitionEnd, this);\n EventHandler.add(this.secondHandle, 'mouseenter touchenter', this.handleOver, this);\n EventHandler.add(this.secondHandle, 'mouseleave touchend', this.handleLeave, this);\n }\n else {\n EventHandler.remove(this.secondHandle, 'mousedown touchstart', this.handleFocus);\n EventHandler.remove(this.secondHandle, 'transitionend', this.transitionEnd);\n EventHandler.remove(this.secondHandle, 'mouseenter touchenter', this.handleOver);\n EventHandler.remove(this.secondHandle, 'mouseleave touchend', this.handleLeave);\n }\n };\n Slider.prototype.handleStart = function () {\n if (this.type !== 'Range') {\n this.firstHandle.classList[this.handlePos1 === 0 ? 'add' : 'remove'](classNames.sliderHandleStart);\n if (this.isMaterialTooltip) {\n this.materialHandle.classList[this.handlePos1 === 0 ? 'add' : 'remove'](classNames.sliderHandleStart);\n if (this.tooltipElement) {\n this.tooltipElement.classList[this.handlePos1 === 0 ? 'add' : 'remove'](classNames.sliderTooltipStart);\n }\n }\n }\n };\n Slider.prototype.transitionEnd = function (e) {\n if (e.propertyName !== 'transform') {\n this.handleStart();\n this.getHandle().style.transition = 'none';\n if (this.type !== 'Default') {\n this.rangeBar.style.transition = 'none';\n }\n if (this.isMaterial && this.tooltip.isVisible && this.type === 'Default') {\n this.tooltipElement.style.transition = this.transition.handle;\n }\n this.tooltipToggle(this.getHandle());\n this.closeTooltip();\n }\n };\n Slider.prototype.handleFocusOut = function () {\n if (this.firstHandle.classList.contains(classNames.sliderHandleFocused)) {\n this.firstHandle.classList.remove(classNames.sliderHandleFocused);\n }\n if (this.type === 'Range') {\n if (this.secondHandle.classList.contains(classNames.sliderHandleFocused)) {\n this.secondHandle.classList.remove(classNames.sliderHandleFocused);\n }\n }\n };\n Slider.prototype.handleFocus = function (e) {\n if (e.currentTarget === this.firstHandle) {\n this.firstHandle.classList.add(classNames.sliderHandleFocused);\n }\n else {\n this.secondHandle.classList.add(classNames.sliderHandleFocused);\n }\n };\n Slider.prototype.handleOver = function (e) {\n if (this.tooltip.isVisible && this.tooltip.showOn === 'Hover') {\n this.tooltipToggle(e.currentTarget);\n }\n };\n Slider.prototype.handleLeave = function (e) {\n if (this.tooltip.isVisible && this.tooltip.showOn === 'Hover' &&\n !e.currentTarget.classList.contains(classNames.sliderHandleFocused) &&\n !e.currentTarget.classList.contains(classNames.sliderTabHandle)) {\n this.closeTooltip();\n }\n };\n Slider.prototype.setHandler = function () {\n if (this.min > this.max) {\n this.min = this.max;\n }\n this.createFirstHandle();\n if (this.type === 'Range') {\n this.createSecondHandle();\n }\n };\n Slider.prototype.setEnableRTL = function () {\n this.enableRtl && this.orientation !== 'Vertical' ? addClass([this.sliderContainer], classNames.rtl) :\n removeClass([this.sliderContainer], classNames.rtl);\n var preDir = (this.orientation !== 'Vertical') ? this.horDir : this.verDir;\n if (this.enableRtl) {\n this.horDir = 'right';\n this.verDir = 'bottom';\n }\n else {\n this.horDir = 'left';\n this.verDir = 'bottom';\n }\n var currDir = (this.orientation !== 'Vertical') ? this.horDir : this.verDir;\n if (preDir !== currDir) {\n if (this.orientation === 'Horizontal') {\n setStyleAttribute(this.firstHandle, { 'right': '', 'left': 'auto' });\n if (this.type === 'Range') {\n setStyleAttribute(this.secondHandle, { 'top': '', 'left': 'auto' });\n }\n }\n }\n };\n Slider.prototype.tooltipValue = function () {\n var text;\n var args = {\n value: this.value,\n text: ''\n };\n this.setTooltipContent();\n args.text = text = this.tooltipObj.content;\n this.trigger('tooltipChange', args);\n this.addTooltipClass(args.text);\n if (text !== args.text) {\n this.customAriaText = args.text;\n this.tooltipObj.content = args.text;\n this.setAriaAttrValue(this.firstHandle);\n if (this.type === 'Range') {\n this.setAriaAttrValue(this.secondHandle);\n }\n }\n };\n Slider.prototype.setTooltipContent = function () {\n var content;\n content = this.formatContent(this.tooltipFormatInfo, false);\n this.tooltipObj.content = content;\n };\n Slider.prototype.formatContent = function (formatInfo, ariaContent) {\n var content = '';\n var handle1 = this.handleVal1;\n var handle2 = this.handleVal2;\n if (!isNullOrUndefined(this.customValues) && this.customValues.length > 0) {\n handle1 = this.customValues[this.handleVal1];\n handle2 = this.customValues[this.handleVal2];\n }\n if (!ariaContent) {\n if (this.type === 'Range') {\n if (this.enableRtl && this.orientation !== 'Vertical') {\n content = (!isNullOrUndefined(formatInfo.format)) ? (this.formatString(handle2, formatInfo)\n .formatString + ' - ' + this.formatString(handle1, formatInfo).formatString) :\n (handle2.toString() + ' - ' + handle1.toString());\n }\n else {\n content = (!isNullOrUndefined(formatInfo.format)) ? (this.formatString(handle1, formatInfo)\n .formatString + ' - ' + this.formatString(handle2, formatInfo).formatString) :\n (handle1.toString() + ' - ' + handle2.toString());\n }\n }\n else {\n if (!isNullOrUndefined(handle1)) {\n content = (!isNullOrUndefined(formatInfo.format)) ?\n this.formatString(handle1, formatInfo).formatString : handle1.toString();\n }\n }\n return content;\n }\n else {\n if (this.type === 'Range') {\n if (this.enableRtl && this.orientation !== 'Vertical') {\n content = (!isNullOrUndefined(this.tooltip) && !isNullOrUndefined(this.tooltip.format)) ?\n (this.formatString(handle2, formatInfo).elementVal + ' - ' +\n this.formatString(handle1, formatInfo).elementVal) :\n (handle2.toString() + ' - ' + handle1.toString());\n }\n else {\n content = (!isNullOrUndefined(this.tooltip) && !isNullOrUndefined(this.tooltip.format)) ?\n (this.formatString(handle1, formatInfo).elementVal + ' - ' +\n this.formatString(handle2, formatInfo).elementVal) :\n (handle1.toString() + ' - ' + handle2.toString());\n }\n }\n else {\n if (!isNullOrUndefined(handle1)) {\n content = (!isNullOrUndefined(this.tooltip) && !isNullOrUndefined(this.tooltip.format)) ?\n this.formatString(handle1, formatInfo).elementVal : handle1.toString();\n }\n }\n return content;\n }\n };\n Slider.prototype.addTooltipClass = function (content) {\n if (this.isMaterialTooltip) {\n var count = content.toString().length;\n if (!this.tooltipElement) {\n var cssClass = count > 4 ? classNames.sliderMaterialRange : classNames.sliderMaterialDefault;\n this.tooltipObj.cssClass = classNames.sliderTooltip + ' ' + cssClass;\n }\n else {\n var cssClass = count > 4 ?\n { oldCss: classNames.sliderMaterialDefault, newCss: classNames.sliderMaterialRange } :\n { oldCss: classNames.sliderMaterialRange, newCss: classNames.sliderMaterialDefault };\n this.tooltipElement.classList.remove(cssClass.oldCss);\n if (!this.tooltipElement.classList.contains(cssClass.newCss)) {\n this.tooltipElement.classList.add(cssClass.newCss);\n this.tooltipElement.style.transform = count > 4 ? 'scale(1)' :\n this.getTooltipTransformProperties(this.previousTooltipClass).rotate;\n }\n }\n }\n };\n Slider.prototype.tooltipPlacement = function () {\n return this.orientation === 'Horizontal' ? (this.tooltip.placement === 'Before' ? 'TopCenter' : 'BottomCenter') :\n (this.tooltip.placement === 'Before' ? 'LeftCenter' : 'RightCenter');\n };\n Slider.prototype.tooltipBeforeOpen = function (args) {\n this.tooltipElement = args.element;\n if (this.tooltip.cssClass) {\n addClass([this.tooltipElement], this.tooltip.cssClass.split(' ').filter(function (css) { return css; }));\n }\n args.target.removeAttribute('aria-describedby');\n if (this.isMaterialTooltip) {\n this.tooltipElement.firstElementChild.classList.add(classNames.materialTooltipHide);\n this.handleStart();\n this.setTooltipTransform();\n }\n };\n Slider.prototype.tooltipCollision = function (position) {\n if (this.isBootstrap || this.isBootstrap4 || (this.isMaterial && !this.isMaterialTooltip)) {\n var tooltipOffsetValue = this.isBootstrap4 ? bootstrap4TooltipOffset : bootstrapTooltipOffset;\n switch (position) {\n case 'TopCenter':\n this.tooltipObj.setProperties({ 'offsetY': -(tooltipOffsetValue) }, false);\n break;\n case 'BottomCenter':\n this.tooltipObj.setProperties({ 'offsetY': tooltipOffsetValue }, false);\n break;\n case 'LeftCenter':\n this.tooltipObj.setProperties({ 'offsetX': -(tooltipOffsetValue) }, false);\n break;\n case 'RightCenter':\n this.tooltipObj.setProperties({ 'offsetX': tooltipOffsetValue }, false);\n break;\n }\n }\n };\n Slider.prototype.wireMaterialTooltipEvent = function (destroy) {\n if (this.isMaterialTooltip) {\n if (!destroy) {\n EventHandler.add(this.tooltipElement, 'mousedown touchstart', this.sliderDown, this);\n }\n else {\n EventHandler.remove(this.tooltipElement, 'mousedown touchstart', this.sliderDown);\n }\n }\n };\n Slider.prototype.tooltipPositionCalculation = function (position) {\n var cssClass;\n switch (position) {\n case 'TopCenter':\n cssClass = classNames.horizontalTooltipBefore;\n break;\n case 'BottomCenter':\n cssClass = classNames.horizontalTooltipAfter;\n break;\n case 'LeftCenter':\n cssClass = classNames.verticalTooltipBefore;\n break;\n case 'RightCenter':\n cssClass = classNames.verticalTooltipAfter;\n break;\n }\n return cssClass;\n };\n Slider.prototype.getTooltipTransformProperties = function (className) {\n var transformProperties;\n if (this.tooltipElement) {\n var position = this.orientation === 'Horizontal' ?\n ((this.tooltipElement.clientHeight + 14) - (this.tooltipElement.clientHeight / 2)) :\n ((this.tooltipElement.clientWidth + 14) - (this.tooltipElement.clientWidth / 2));\n transformProperties = this.orientation === 'Horizontal' ?\n (className === classNames.horizontalTooltipBefore ? { rotate: 'rotate(45deg)', translate: \"translateY(\" + position + \"px)\" } :\n { rotate: 'rotate(225deg)', translate: \"translateY(\" + -(position) + \"px)\" }) :\n (className === classNames.verticalTooltipBefore ? { rotate: 'rotate(-45deg)', translate: \"translateX(\" + position + \"px)\" } :\n { rotate: 'rotate(-225deg)', translate: \"translateX(\" + (-position) + \"px)\" });\n }\n return transformProperties;\n };\n Slider.prototype.openMaterialTooltip = function () {\n var _this = this;\n if (this.isMaterialTooltip) {\n this.refreshTooltip(this.firstHandle);\n var tooltipContentElement = this.tooltipElement.firstElementChild;\n tooltipContentElement.classList.remove(classNames.materialTooltipHide);\n tooltipContentElement.classList.add(classNames.materialTooltipShow);\n this.firstHandle.style.cursor = 'default';\n this.tooltipElement.style.transition = this.scaleTransform;\n this.tooltipElement.classList.add(classNames.materialTooltipOpen);\n this.materialHandle.style.transform = 'scale(0)';\n if (tooltipContentElement.innerText.length > 4) {\n this.tooltipElement.style.transform = 'scale(1)';\n }\n else {\n this.tooltipElement.style.transform = this.getTooltipTransformProperties(this.previousTooltipClass).rotate;\n }\n if (this.type === 'Default') {\n setTimeout(function () { _this.tooltipElement.style.transition = _this.transition.handle; }, 2500);\n }\n else {\n setTimeout(function () { _this.tooltipElement.style.transition = 'none'; }, 2500);\n }\n }\n };\n Slider.prototype.closeMaterialTooltip = function () {\n var _this = this;\n if (this.isMaterialTooltip) {\n var tooltipContentElement = this.tooltipElement.firstElementChild;\n this.tooltipElement.style.transition = this.scaleTransform;\n tooltipContentElement.classList.remove(classNames.materialTooltipShow);\n tooltipContentElement.classList.add(classNames.materialTooltipHide);\n this.firstHandle.style.cursor = '-webkit-grab';\n this.firstHandle.style.cursor = 'grab';\n this.materialHandle.style.transform = 'scale(1)';\n this.tooltipElement.classList.remove(classNames.materialTooltipOpen);\n this.setTooltipTransform();\n this.tooltipTarget = undefined;\n setTimeout(function () { _this.tooltipElement.style.transition = 'none'; }, 2500);\n }\n };\n Slider.prototype.checkTooltipPosition = function (args) {\n if (this.tooltipCollidedPosition === undefined ||\n this.tooltipCollidedPosition !== args.collidedPosition) {\n if (this.isMaterialTooltip) {\n var tooltipClass = this.tooltipPositionCalculation(args.collidedPosition);\n args.element.classList.remove(this.previousTooltipClass);\n args.element.classList.add(tooltipClass);\n this.previousTooltipClass = tooltipClass;\n if (args.element.style.transform && args.element.classList.contains(classNames.materialTooltipOpen) &&\n args.element.firstElementChild.innerText.length <= 4) {\n args.element.style.transform = this.getTooltipTransformProperties(this.previousTooltipClass).rotate;\n }\n }\n this.tooltipCollidedPosition = args.collidedPosition;\n }\n if (this.isMaterialTooltip && this.tooltipElement && this.tooltipElement.style.transform.indexOf('translate') !== -1) {\n this.setTooltipTransform();\n }\n };\n Slider.prototype.setTooltipTransform = function () {\n var transformProperties = this.getTooltipTransformProperties(this.previousTooltipClass);\n if (this.tooltipElement.firstElementChild.innerText.length > 4) {\n this.tooltipElement.style.transform = transformProperties.translate + \" scale(0.01)\";\n }\n else {\n this.tooltipElement.style.transform = transformProperties.translate + \" \" + transformProperties.rotate + \" scale(0.01)\";\n }\n };\n Slider.prototype.renderTooltip = function () {\n this.tooltipObj = new Tooltip({\n showTipPointer: this.isBootstrap || this.isMaterial || this.isBootstrap4,\n cssClass: classNames.sliderTooltip,\n height: this.isMaterial ? 30 : 'auto',\n animation: { open: { effect: 'None' }, close: { effect: 'FadeOut', duration: 500 } },\n opensOn: 'Custom',\n beforeOpen: this.tooltipBeforeOpen.bind(this),\n beforeCollision: this.checkTooltipPosition.bind(this),\n beforeClose: this.tooltipBeforeClose.bind(this)\n });\n this.tooltipObj.appendTo(this.firstHandle);\n this.initializeTooltipProps();\n };\n Slider.prototype.initializeTooltipProps = function () {\n var tooltipShowOn = this.isMaterialTooltip ? 'Always' : (this.tooltip.showOn === 'Auto' ? 'Hover' : this.tooltip.showOn);\n this.setProperties({ tooltip: { showOn: tooltipShowOn } }, true);\n this.tooltipObj.position = this.tooltipPlacement();\n this.tooltipCollision(this.tooltipObj.position);\n [this.firstHandle, this.rangeBar, this.secondHandle].forEach(function (handle) {\n if (!isNullOrUndefined(handle)) {\n handle.style.transition = 'none';\n }\n });\n if (this.isMaterialTooltip) {\n this.sliderContainer.classList.add(classNames.materialSlider);\n this.tooltipValue();\n this.tooltipObj.animation.close.effect = 'None';\n this.tooltipObj.open(this.firstHandle);\n }\n };\n Slider.prototype.tooltipBeforeClose = function () {\n this.tooltipElement = undefined;\n this.tooltipCollidedPosition = undefined;\n };\n Slider.prototype.setButtons = function () {\n this.firstBtn = this.createElement('div', { className: classNames.sliderButton + ' ' + classNames.firstButton });\n this.firstBtn.appendChild(this.createElement('span', { className: classNames.sliderButtonIcon }));\n this.firstBtn.tabIndex = -1;\n this.secondBtn = this.createElement('div', { className: classNames.sliderButton + ' ' + classNames.secondButton });\n this.secondBtn.appendChild(this.createElement('span', { className: classNames.sliderButtonIcon }));\n this.secondBtn.tabIndex = -1;\n this.sliderContainer.classList.add(classNames.sliderButtonClass);\n this.sliderContainer.appendChild(this.firstBtn);\n this.sliderContainer.appendChild(this.secondBtn);\n this.sliderContainer.appendChild(this.element);\n this.buttonTitle();\n };\n Slider.prototype.buttonTitle = function () {\n var enabledRTL = this.enableRtl && this.orientation !== 'Vertical';\n this.l10n.setLocale(this.locale);\n var decrementTitle = this.l10n.getConstant('decrementTitle');\n var incrementTitle = this.l10n.getConstant('incrementTitle');\n attributes(enabledRTL ? this.secondBtn : this.firstBtn, { 'aria-label': decrementTitle, title: decrementTitle });\n attributes(enabledRTL ? this.firstBtn : this.secondBtn, { 'aria-label': incrementTitle, title: incrementTitle });\n };\n Slider.prototype.buttonFocusOut = function () {\n if (this.isMaterial) {\n this.getHandle().classList.remove('e-large-thumb-size');\n }\n };\n Slider.prototype.repeatButton = function (args) {\n var hVal = this.handleValueUpdate();\n var enabledRTL = this.enableRtl && this.orientation !== 'Vertical';\n var value;\n if (args.target.parentElement.classList.contains(classNames.firstButton)\n || args.target.classList.contains(classNames.firstButton)) {\n enabledRTL ? (value = this.add(hVal, parseFloat(this.step.toString()), true)) :\n (value = this.add(hVal, parseFloat(this.step.toString()), false));\n }\n else if (args.target.parentElement.classList.contains(classNames.secondButton)\n || (args.target.classList.contains(classNames.secondButton))) {\n enabledRTL ? (value = this.add(hVal, parseFloat(this.step.toString()), false)) :\n (value = this.add(hVal, parseFloat(this.step.toString()), true));\n }\n if (this.limits.enabled) {\n value = this.getLimitCorrectedValues(value);\n }\n if (value >= this.min && value <= this.max) {\n this.changeHandleValue(value);\n this.tooltipToggle(this.getHandle());\n }\n };\n Slider.prototype.repeatHandlerMouse = function (args) {\n args.preventDefault();\n if (args.type === ('mousedown') || args.type === ('touchstart')) {\n this.buttonClick(args);\n this.repeatInterval = setInterval(this.repeatButton.bind(this), 180, args);\n }\n };\n Slider.prototype.materialChange = function () {\n if (!this.getHandle().classList.contains('e-large-thumb-size')) {\n this.getHandle().classList.add('e-large-thumb-size');\n }\n };\n Slider.prototype.repeatHandlerUp = function (e) {\n this.changeEvent('changed');\n this.closeTooltip();\n clearInterval(this.repeatInterval);\n this.getHandle().focus();\n };\n Slider.prototype.customTickCounter = function (bigNum) {\n var tickCount = 4;\n if (!isNullOrUndefined(this.customValues) && this.customValues.length > 0) {\n if (bigNum > 4) {\n tickCount = 3;\n }\n if (bigNum > 7) {\n tickCount = 2;\n }\n if (bigNum > 14) {\n tickCount = 1;\n }\n if (bigNum > 28) {\n tickCount = 0;\n }\n }\n return tickCount;\n };\n Slider.prototype.renderScale = function () {\n var orien = this.orientation === 'Vertical' ? 'v' : 'h';\n var spanText;\n this.noOfDecimals = this.numberOfDecimals(this.step);\n this.ul = this.createElement('ul', {\n className: classNames.scale + ' ' + 'e-' + orien + '-scale ' + classNames.tick + '-' + this.ticks.placement.toLowerCase(),\n attrs: { role: 'presentation', tabIndex: '-1', 'aria-hidden': 'true' }\n });\n this.ul.style.zIndex = '-1';\n if (Browser.isAndroid && orien === 'h') {\n this.ul.classList.add(classNames.sliderTickPosition);\n }\n var smallStep = this.ticks.smallStep;\n if (!this.ticks.showSmallTicks) {\n this.ticks.largeStep > 0 ? (smallStep = this.ticks.largeStep) :\n (smallStep = (parseFloat(formatUnit(this.max))) - (parseFloat(formatUnit(this.min))));\n }\n else if (smallStep <= 0) {\n smallStep = parseFloat(formatUnit(this.step));\n }\n var min = this.fractionalToInteger(this.min);\n var max = this.fractionalToInteger(this.max);\n var steps = this.fractionalToInteger(smallStep);\n var bigNum = !isNullOrUndefined(this.customValues) && this.customValues.length > 0 && this.customValues.length - 1;\n var customStep = this.customTickCounter(bigNum);\n var count = !isNullOrUndefined(this.customValues) && this.customValues.length > 0 ?\n (bigNum * customStep) + bigNum : Math.abs((max - min) / steps);\n this.element.appendChild(this.ul);\n var li;\n var start = parseFloat(this.min.toString());\n if (orien === 'v') {\n start = parseFloat(this.max.toString());\n }\n var left = 0;\n var islargeTick;\n var tickWidth = 100 / count;\n if (tickWidth === Infinity) {\n tickWidth = 5;\n }\n for (var i = 0, y = !isNullOrUndefined(this.customValues) && this.customValues.length > 0 ?\n this.customValues.length - 1 : 0, k = 0; i <= count; i++) {\n li = (this.createElement('li', {\n attrs: {\n class: classNames.tick, role: 'presentation', tabIndex: '-1',\n 'aria-hidden': 'true'\n }\n }));\n if (!isNullOrUndefined(this.customValues) && this.customValues.length > 0) {\n islargeTick = i % (customStep + 1) === 0;\n if (islargeTick) {\n if (orien === 'h') {\n start = this.customValues[k];\n k++;\n }\n else {\n start = this.customValues[y];\n y--;\n }\n li.setAttribute('title', start.toString());\n }\n }\n else {\n li.setAttribute('title', start.toString());\n if (this.numberOfDecimals(this.max) === 0 && this.numberOfDecimals(this.min) === 0 &&\n this.numberOfDecimals(this.step) === 0) {\n if (orien === 'h') {\n islargeTick = ((start - parseFloat(this.min.toString())) % this.ticks.largeStep === 0) ? true : false;\n }\n else {\n islargeTick = (Math.abs(start - parseFloat(this.max.toString())) % this.ticks.largeStep === 0) ? true : false;\n }\n }\n else {\n var largestep = this.fractionalToInteger(this.ticks.largeStep);\n var startValue = this.fractionalToInteger(start);\n islargeTick = ((startValue - min) % largestep === 0) ? true : false;\n }\n }\n if (islargeTick) {\n li.classList.add(classNames.large);\n }\n (orien === 'h') ? (li.style.width = tickWidth + '%') : (li.style.height = tickWidth + '%');\n var repeat = islargeTick ? (this.ticks.placement === 'Both' ? 2 : 1) : 0;\n if (islargeTick) {\n for (var j = 0; j < repeat; j++) {\n this.createTick(li, start);\n }\n }\n else if (isNullOrUndefined(this.customValues)) {\n this.formatTicksValue(li, start);\n }\n this.ul.appendChild(li);\n this.tickElementCollection.push(li);\n var decimalPoints = void 0;\n if (isNullOrUndefined(this.customValues)) {\n if (this.numberOfDecimals(smallStep) > this.numberOfDecimals(start)) {\n decimalPoints = this.numberOfDecimals(smallStep);\n }\n else {\n decimalPoints = this.numberOfDecimals(start);\n }\n if (orien === 'h') {\n start = this.makeRoundNumber(start + smallStep, decimalPoints);\n }\n else {\n start = this.makeRoundNumber(start - smallStep, decimalPoints);\n }\n left = this.makeRoundNumber(left + smallStep, decimalPoints);\n }\n }\n this.tickesAlignment(orien, tickWidth);\n };\n Slider.prototype.tickesAlignment = function (orien, tickWidth) {\n this.firstChild = this.ul.firstElementChild;\n this.lastChild = this.ul.lastElementChild;\n this.firstChild.classList.add(classNames.sliderFirstTick);\n this.lastChild.classList.add(classNames.sliderLastTick);\n this.sliderContainer.classList.add(classNames.scale + '-' + this.ticks.placement.toLowerCase());\n if (orien === 'h') {\n this.firstChild.style.width = tickWidth / 2 + '%';\n this.lastChild.style.width = tickWidth / 2 + '%';\n }\n else {\n this.firstChild.style.height = tickWidth / 2 + '%';\n this.lastChild.style.height = tickWidth / 2 + '%';\n }\n var eventArgs = { ticksWrapper: this.ul, tickElements: this.tickElementCollection };\n this.trigger('renderedTicks', eventArgs);\n this.scaleAlignment();\n };\n Slider.prototype.createTick = function (li, start) {\n var span = this.createElement('span', {\n className: classNames.tickValue + ' ' + classNames.tick + '-' + this.ticks.placement.toLowerCase(),\n attrs: { role: 'presentation', tabIndex: '-1', 'aria-hidden': 'true' }\n });\n li.appendChild(span);\n span.innerHTML = isNullOrUndefined(this.customValues) ? this.formatTicksValue(li, start) : start;\n };\n Slider.prototype.formatTicksValue = function (li, start) {\n var tickText = this.formatNumber(start);\n var text = !isNullOrUndefined(this.ticks) && !isNullOrUndefined(this.ticks.format) ?\n this.formatString(start, this.ticksFormatInfo).formatString : tickText;\n var eventArgs = { value: start, text: text, tickElement: li };\n this.trigger('renderingTicks', eventArgs);\n li.setAttribute('title', eventArgs.text.toString());\n return eventArgs.text.toString();\n };\n Slider.prototype.scaleAlignment = function () {\n this.tickValuePosition();\n var smallTick = 12;\n var largeTick = 20;\n var half = largeTick / 2;\n var orien = this.orientation === 'Vertical' ? 'v' : 'h';\n if (this.orientation === 'Vertical') {\n (this.element.getBoundingClientRect().width <= 15) ?\n this.sliderContainer.classList.add(classNames.sliderSmallSize) :\n this.sliderContainer.classList.remove(classNames.sliderSmallSize);\n }\n else {\n (this.element.getBoundingClientRect().height <= 15) ?\n this.sliderContainer.classList.add(classNames.sliderSmallSize) :\n this.sliderContainer.classList.remove(classNames.sliderSmallSize);\n }\n };\n Slider.prototype.tickValuePosition = function () {\n var first = this.firstChild.getBoundingClientRect();\n var firstChild;\n var smallStep = this.ticks.smallStep;\n var count = Math.abs((parseFloat(formatUnit(this.max))) - (parseFloat(formatUnit(this.min)))) / smallStep;\n if (this.firstChild.children.length > 0) {\n firstChild = this.firstChild.children[0].getBoundingClientRect();\n }\n var tickElements = [this.sliderContainer.querySelectorAll('.' + classNames.tick + '.' +\n classNames.large + ' .' + classNames.tickValue)];\n var other;\n if (this.ticks.placement === 'Both') {\n other = [].slice.call(tickElements[0], 2);\n }\n else {\n other = [].slice.call(tickElements[0], 1);\n }\n var tickWidth = this.orientation === 'Vertical' ?\n (first.height * 2) : (first.width * 2);\n for (var i = 0; i < this.firstChild.children.length; i++) {\n if (this.orientation === 'Vertical') {\n this.firstChild.children[i].style.top = -(firstChild.height / 2) + 'px';\n }\n else {\n if (!this.enableRtl) {\n this.firstChild.children[i].style.left = -(firstChild.width / 2) + 'px';\n }\n else {\n this.firstChild.children[i].style.left = (tickWidth -\n this.firstChild.children[i].getBoundingClientRect().width) / 2 + 'px';\n }\n }\n }\n for (var i = 0; i < other.length; i++) {\n var otherChild = other[i].getBoundingClientRect();\n if (this.orientation === 'Vertical') {\n setStyleAttribute(other[i], { top: (tickWidth - otherChild.height) / 2 + 'px' });\n }\n else {\n setStyleAttribute(other[i], { left: (tickWidth - otherChild.width) / 2 + 'px' });\n }\n }\n if (this.enableRtl && this.lastChild.children.length && count !== 0) {\n this.lastChild.children[0].style.left = -(this.lastChild.getBoundingClientRect().width / 2) + 'px';\n if (this.ticks.placement === 'Both') {\n this.lastChild.children[1].style.left = -(this.lastChild.getBoundingClientRect().width / 2) + 'px';\n }\n }\n if (count === 0) {\n if (this.orientation === 'Horizontal') {\n if (!this.enableRtl) {\n this.firstChild.classList.remove(classNames.sliderLastTick);\n this.firstChild.style.left = this.firstHandle.style.left;\n }\n else {\n this.firstChild.classList.remove(classNames.sliderLastTick);\n this.firstChild.style.right = this.firstHandle.style.right;\n this.firstChild.children[0].style.left =\n (this.firstChild.getBoundingClientRect().width / 2) + 2 + 'px';\n if (this.ticks.placement === 'Both') {\n this.firstChild.children[1].style.left =\n (this.firstChild.getBoundingClientRect().width / 2) + 2 + 'px';\n }\n }\n }\n if (this.orientation === 'Vertical') {\n this.firstChild.classList.remove(classNames.sliderLastTick);\n }\n }\n };\n Slider.prototype.setAriaAttrValue = function (element) {\n var ariaValueText;\n var isTickFormatted = ((!isNullOrUndefined(this.ticks) && !isNullOrUndefined(this.ticks.format))) ? true : false;\n var text = !isTickFormatted ?\n this.formatContent(this.ticksFormatInfo, false) : this.formatContent(this.tooltipFormatInfo, false);\n var valuenow = isTickFormatted ? this.formatContent(this.ticksFormatInfo, true) :\n this.formatContent(this.tooltipFormatInfo, true);\n text = (!this.customAriaText) ? (text) : (this.customAriaText);\n if (text.split(' - ').length === 2) {\n ariaValueText = text.split(' - ');\n }\n else {\n ariaValueText = [text, text];\n }\n this.setAriaAttributes(element);\n if (this.type !== 'Range') {\n attributes(element, { 'aria-valuenow': valuenow, 'aria-valuetext': text });\n }\n else {\n (!this.enableRtl) ? ((element === this.firstHandle) ?\n attributes(element, { 'aria-valuenow': valuenow.split(' - ')[0], 'aria-valuetext': ariaValueText[0] }) :\n attributes(element, { 'aria-valuenow': valuenow.split(' - ')[1], 'aria-valuetext': ariaValueText[1] })) :\n ((element === this.firstHandle) ?\n attributes(element, { 'aria-valuenow': valuenow.split(' - ')[1], 'aria-valuetext': ariaValueText[1] }) :\n attributes(element, { 'aria-valuenow': valuenow.split(' - ')[0], 'aria-valuetext': ariaValueText[0] }));\n }\n };\n Slider.prototype.handleValueUpdate = function () {\n var hVal;\n if (this.type === 'Range') {\n if (this.activeHandle === 1) {\n hVal = this.handleVal1;\n }\n else {\n hVal = this.handleVal2;\n }\n }\n else {\n hVal = this.handleVal1;\n }\n return hVal;\n };\n Slider.prototype.getLimitCorrectedValues = function (value) {\n if (this.type === 'MinRange' || this.type === 'Default') {\n value = (this.getLimitValueAndPosition(value, this.limits.minStart, this.limits.minEnd))[0];\n }\n else {\n if (this.activeHandle === 1) {\n value = (this.getLimitValueAndPosition(value, this.limits.minStart, this.limits.minEnd))[0];\n }\n else {\n value = (this.getLimitValueAndPosition(value, this.limits.maxStart, this.limits.maxEnd))[0];\n }\n }\n return value;\n };\n Slider.prototype.focusSliderElement = function () {\n if (!this.isElementFocused) {\n this.element.focus();\n this.isElementFocused = true;\n }\n };\n Slider.prototype.buttonClick = function (args) {\n this.focusSliderElement();\n var value;\n var enabledRTL = this.enableRtl && this.orientation !== 'Vertical';\n var hVal = this.handleValueUpdate();\n if ((args.keyCode === 40) || (args.keyCode === 37)\n || args.currentTarget.classList.contains(classNames.firstButton)) {\n enabledRTL ? (value = this.add(hVal, parseFloat(this.step.toString()), true)) :\n (value = this.add(hVal, parseFloat(this.step.toString()), false));\n }\n else if ((args.keyCode === 38) || (args.keyCode === 39) ||\n args.currentTarget.classList.contains(classNames.secondButton)) {\n enabledRTL ? (value = this.add(hVal, parseFloat(this.step.toString()), false)) :\n (value = this.add(hVal, parseFloat(this.step.toString()), true));\n }\n else if ((args.keyCode === 33\n || args.currentTarget.classList.contains(classNames.firstButton))) {\n enabledRTL ? (value = this.add(hVal, parseFloat(this.ticks.largeStep.toString()), false)) :\n (value = this.add(hVal, parseFloat(this.ticks.largeStep.toString()), true));\n }\n else if ((args.keyCode === 34) ||\n args.currentTarget.classList.contains(classNames.secondButton)) {\n enabledRTL ? (value = this.add(hVal, parseFloat(this.ticks.largeStep.toString()), true)) :\n (value = this.add(hVal, parseFloat(this.ticks.largeStep.toString()), false));\n }\n else if ((args.keyCode === 36)) {\n value = parseFloat(this.min.toString());\n }\n else if ((args.keyCode === 35)) {\n value = parseFloat(this.max.toString());\n }\n if (this.limits.enabled) {\n value = this.getLimitCorrectedValues(value);\n }\n this.changeHandleValue(value);\n if (this.isMaterial && !this.tooltip.isVisible &&\n !this.getHandle().classList.contains(classNames.sliderTabHandle)) {\n this.materialChange();\n }\n this.tooltipToggle(this.getHandle());\n this.getHandle().focus();\n if (args.currentTarget.classList.contains(classNames.firstButton)) {\n EventHandler.add(this.firstBtn, 'mouseup touchend', this.buttonUp, this);\n }\n if (args.currentTarget.classList.contains(classNames.secondButton)) {\n EventHandler.add(this.secondBtn, 'mouseup touchend', this.buttonUp, this);\n }\n };\n Slider.prototype.tooltipToggle = function (target) {\n if (this.isMaterialTooltip) {\n !this.tooltipElement.classList.contains(classNames.materialTooltipOpen) ?\n this.openMaterialTooltip() : this.refreshTooltip(this.firstHandle);\n }\n else {\n !this.tooltipElement ? this.openTooltip(target) : this.refreshTooltip(target);\n }\n };\n Slider.prototype.buttonUp = function (args) {\n if (args.currentTarget.classList.contains(classNames.firstButton)) {\n EventHandler.remove(this.firstBtn, 'mouseup touchend', this.buttonUp);\n }\n if (args.currentTarget.classList.contains(classNames.secondButton)) {\n EventHandler.remove(this.secondBtn, 'mouseup touchend', this.buttonUp);\n }\n };\n Slider.prototype.setRangeBar = function () {\n if (this.orientation === 'Horizontal') {\n if (this.type === 'MinRange') {\n this.enableRtl ? (this.rangeBar.style.right = '0px') : (this.rangeBar.style.left = '0px');\n setStyleAttribute(this.rangeBar, { 'width': isNullOrUndefined(this.handlePos1) ? 0 : this.handlePos1 + 'px' });\n }\n else {\n this.enableRtl ? (this.rangeBar.style.right =\n this.handlePos1 + 'px') : (this.rangeBar.style.left = this.handlePos1 + 'px');\n setStyleAttribute(this.rangeBar, { 'width': this.handlePos2 - this.handlePos1 + 'px' });\n }\n }\n else {\n if (this.type === 'MinRange') {\n this.rangeBar.style.bottom = '0px';\n setStyleAttribute(this.rangeBar, { 'height': isNullOrUndefined(this.handlePos1) ? 0 : this.handlePos1 + 'px' });\n }\n else {\n this.rangeBar.style.bottom = this.handlePos1 + 'px';\n setStyleAttribute(this.rangeBar, { 'height': this.handlePos2 - this.handlePos1 + 'px' });\n }\n }\n };\n Slider.prototype.checkValidValueAndPos = function (value) {\n value = this.checkHandleValue(value);\n value = this.checkHandlePosition(value);\n return value;\n };\n Slider.prototype.setLimitBarPositions = function (fromMinPostion, fromMaxpostion, toMinPostion, toMaxpostion) {\n if (this.orientation === 'Horizontal') {\n if (!this.enableRtl) {\n this.limitBarFirst.style.left = fromMinPostion + 'px';\n this.limitBarFirst.style.width = (fromMaxpostion - fromMinPostion) + 'px';\n }\n else {\n this.limitBarFirst.style.right = fromMinPostion + 'px';\n this.limitBarFirst.style.width = (fromMaxpostion - fromMinPostion) + 'px';\n }\n }\n else {\n this.limitBarFirst.style.bottom = fromMinPostion + 'px';\n this.limitBarFirst.style.height = (fromMaxpostion - fromMinPostion) + 'px';\n }\n if (this.type === 'Range') {\n if (this.orientation === 'Horizontal') {\n if (!this.enableRtl) {\n this.limitBarSecond.style.left = toMinPostion + 'px';\n this.limitBarSecond.style.width = (toMaxpostion - toMinPostion) + 'px';\n }\n else {\n this.limitBarSecond.style.right = toMinPostion + 'px';\n this.limitBarSecond.style.width = (toMaxpostion - toMinPostion) + 'px';\n }\n }\n else {\n this.limitBarSecond.style.bottom = toMinPostion + 'px';\n this.limitBarSecond.style.height = (toMaxpostion - toMinPostion) + 'px';\n }\n }\n };\n Slider.prototype.setLimitBar = function () {\n if (this.type === 'Default' || this.type === 'MinRange') {\n var fromPosition = (this.getLimitValueAndPosition(this.limits.minStart, this.limits.minStart, this.limits.minEnd, true))[0];\n fromPosition = this.checkValidValueAndPos(fromPosition);\n var toPosition = (this.getLimitValueAndPosition(this.limits.minEnd, this.limits.minStart, this.limits.minEnd, true))[0];\n toPosition = this.checkValidValueAndPos(toPosition);\n this.setLimitBarPositions(fromPosition, toPosition);\n }\n else if (this.type === 'Range') {\n var fromMinPostion = (this.getLimitValueAndPosition(this.limits.minStart, this.limits.minStart, this.limits.minEnd, true))[0];\n fromMinPostion = this.checkValidValueAndPos(fromMinPostion);\n var fromMaxpostion = (this.getLimitValueAndPosition(this.limits.minEnd, this.limits.minStart, this.limits.minEnd, true))[0];\n fromMaxpostion = this.checkValidValueAndPos(fromMaxpostion);\n var toMinPostion = (this.getLimitValueAndPosition(this.limits.maxStart, this.limits.maxStart, this.limits.maxEnd, true))[0];\n toMinPostion = this.checkValidValueAndPos(toMinPostion);\n var toMaxpostion = (this.getLimitValueAndPosition(this.limits.maxEnd, this.limits.maxStart, this.limits.maxEnd, true))[0];\n toMaxpostion = this.checkValidValueAndPos(toMaxpostion);\n this.setLimitBarPositions(fromMinPostion, fromMaxpostion, toMinPostion, toMaxpostion);\n }\n };\n Slider.prototype.getLimitValueAndPosition = function (currentValue, minValue, maxValue, limitBar) {\n if (isNullOrUndefined(minValue)) {\n minValue = this.min;\n if (isNullOrUndefined(currentValue) && limitBar) {\n currentValue = minValue;\n }\n }\n if (isNullOrUndefined(maxValue)) {\n maxValue = this.max;\n if (isNullOrUndefined(currentValue) && limitBar) {\n currentValue = maxValue;\n }\n }\n if (currentValue < minValue) {\n currentValue = minValue;\n }\n if (currentValue > maxValue) {\n currentValue = maxValue;\n }\n return [currentValue, this.checkHandlePosition(currentValue)];\n };\n Slider.prototype.setValue = function () {\n if (!isNullOrUndefined(this.customValues) && this.customValues.length > 0) {\n this.min = 0;\n this.max = this.customValues.length - 1;\n }\n this.setAriaAttributes(this.firstHandle);\n this.handleVal1 = isNullOrUndefined(this.value) ? this.checkHandleValue(parseFloat(this.min.toString())) :\n this.checkHandleValue(parseFloat(this.value.toString()));\n this.handlePos1 = this.checkHandlePosition(this.handleVal1);\n this.preHandlePos1 = this.handlePos1;\n isNullOrUndefined(this.activeHandle) ? (this.type === 'Range' ? this.activeHandle = 2 : this.activeHandle = 1) :\n this.activeHandle = this.activeHandle;\n if (this.type === 'Default' || this.type === 'MinRange') {\n if (this.limits.enabled) {\n var values = this.getLimitValueAndPosition(this.handleVal1, this.limits.minStart, this.limits.minEnd);\n this.handleVal1 = values[0];\n this.handlePos1 = values[1];\n this.preHandlePos1 = this.handlePos1;\n }\n this.setHandlePosition();\n this.handleStart();\n this.value = this.handleVal1;\n this.setAriaAttrValue(this.firstHandle);\n this.changeEvent('changed');\n }\n else {\n this.validateRangeValue();\n }\n if (this.type !== 'Default') {\n this.setRangeBar();\n }\n if (this.limits.enabled) {\n this.setLimitBar();\n }\n };\n Slider.prototype.rangeValueUpdate = function () {\n if (this.value === null || typeof (this.value) !== 'object') {\n this.value = [parseFloat(formatUnit(this.min)), parseFloat(formatUnit(this.max))];\n }\n };\n Slider.prototype.validateRangeValue = function () {\n this.rangeValueUpdate();\n this.setRangeValue();\n };\n Slider.prototype.modifyZindex = function () {\n if (this.type === 'Range') {\n if (this.activeHandle === 1) {\n this.firstHandle.style.zIndex = (this.zIndex + 4) + '';\n this.secondHandle.style.zIndex = (this.zIndex + 3) + '';\n }\n else {\n this.firstHandle.style.zIndex = (this.zIndex + 3) + '';\n this.secondHandle.style.zIndex = (this.zIndex + 4) + '';\n }\n }\n else if (this.isMaterialTooltip && this.tooltipElement) {\n this.tooltipElement.style.zIndex = (this.zIndex + 4) + '';\n }\n };\n Slider.prototype.setHandlePosition = function () {\n var _this = this;\n var handle;\n var pos = (this.activeHandle === 1) ? this.handlePos1 : this.handlePos2;\n if (this.isMaterialTooltip) {\n handle = [this.firstHandle, this.materialHandle];\n }\n else {\n handle = [this.getHandle()];\n }\n this.handleStart();\n handle.forEach(function (handle) {\n if (_this.orientation === 'Horizontal') {\n _this.enableRtl ? (handle.style.right =\n pos + \"px\") : (handle.style.left = pos + \"px\");\n }\n else {\n handle.style.bottom = pos + \"px\";\n }\n });\n this.changeEvent('change');\n };\n Slider.prototype.getHandle = function () {\n return (this.activeHandle === 1) ? this.firstHandle : this.secondHandle;\n };\n Slider.prototype.setRangeValue = function () {\n this.updateRangeValue();\n this.activeHandle = 1;\n this.setHandlePosition();\n this.activeHandle = 2;\n this.setHandlePosition();\n this.activeHandle = 1;\n };\n Slider.prototype.changeEvent = function (eventName) {\n var previous = eventName === 'change' ? this.previousVal : this.previousChanged;\n if (this.type !== 'Range') {\n this.setProperties({ 'value': this.handleVal1 }, true);\n if (previous !== this.value) {\n this.trigger(eventName, this.changeEventArgs(eventName));\n this.setPreviousVal(eventName, this.value);\n }\n this.setAriaAttrValue(this.firstHandle);\n }\n else {\n var value = this.value = [this.handleVal1, this.handleVal2];\n this.setProperties({ 'value': value }, true);\n if (previous.length === this.value.length\n && this.value[0] !== previous[0] || this.value[1] !== previous[1]) {\n this.trigger(eventName, this.changeEventArgs(eventName));\n this.setPreviousVal(eventName, this.value);\n }\n this.setAriaAttrValue(this.getHandle());\n }\n this.hiddenInput.value = this.value.toString();\n };\n Slider.prototype.changeEventArgs = function (eventName) {\n var eventArgs;\n if (this.tooltip.isVisible && this.tooltipObj) {\n this.tooltipValue();\n eventArgs = {\n value: this.value,\n previousValue: eventName === 'change' ? this.previousVal : this.previousChanged,\n action: eventName, text: this.tooltipObj.content\n };\n }\n else {\n eventArgs = {\n value: this.value,\n previousValue: eventName === 'change' ? this.previousVal : this.previousChanged,\n action: eventName, text: isNullOrUndefined(this.ticksFormatInfo.format) ? this.value.toString() :\n (this.type !== 'Range' ? this.formatString(this.value, this.ticksFormatInfo).formatString :\n (this.formatString(this.value[0], this.ticksFormatInfo).formatString + ' - ' +\n this.formatString(this.value[1], this.ticksFormatInfo).formatString))\n };\n }\n return eventArgs;\n };\n Slider.prototype.setPreviousVal = function (eventName, value) {\n if (eventName === 'change') {\n this.previousVal = value;\n }\n else {\n this.previousChanged = value;\n }\n };\n Slider.prototype.updateRangeValue = function () {\n var values = this.value.toString().split(',').map(Number);\n if ((this.enableRtl && this.orientation !== 'Vertical') || this.rtl) {\n this.value = [values[1], values[0]];\n }\n else {\n this.value = [values[0], values[1]];\n }\n if (this.enableRtl && this.orientation !== 'Vertical') {\n this.handleVal1 = this.checkHandleValue(this.value[1]);\n this.handleVal2 = this.checkHandleValue(this.value[0]);\n }\n else {\n this.handleVal1 = this.checkHandleValue(this.value[0]);\n this.handleVal2 = this.checkHandleValue(this.value[1]);\n }\n this.handlePos1 = this.checkHandlePosition(this.handleVal1);\n this.handlePos2 = this.checkHandlePosition(this.handleVal2);\n if (this.handlePos1 > this.handlePos2) {\n this.handlePos1 = this.handlePos2;\n this.handleVal1 = this.handleVal2;\n }\n this.preHandlePos1 = this.handlePos1;\n this.preHandlePos2 = this.handlePos2;\n if (this.limits.enabled) {\n this.activeHandle = 1;\n var values_1 = this.getLimitValueAndPosition(this.handleVal1, this.limits.minStart, this.limits.minEnd);\n this.handleVal1 = values_1[0];\n this.handlePos1 = values_1[1];\n this.preHandlePos1 = this.handlePos1;\n this.activeHandle = 2;\n values_1 = this.getLimitValueAndPosition(this.handleVal2, this.limits.maxStart, this.limits.maxEnd);\n this.handleVal2 = values_1[0];\n this.handlePos2 = values_1[1];\n this.preHandlePos2 = this.handlePos2;\n }\n };\n Slider.prototype.checkHandlePosition = function (value) {\n var pos;\n value = (100 *\n (value - (parseFloat(formatUnit(this.min))))) / ((parseFloat(formatUnit(this.max))) - (parseFloat(formatUnit(this.min))));\n if (this.orientation === 'Horizontal') {\n pos = this.element.getBoundingClientRect().width * (value / 100);\n }\n else {\n pos = this.element.getBoundingClientRect().height * (value / 100);\n }\n if (((parseFloat(formatUnit(this.max))) === (parseFloat(formatUnit(this.min))))) {\n if (this.orientation === 'Horizontal') {\n pos = this.element.getBoundingClientRect().width;\n }\n else {\n pos = this.element.getBoundingClientRect().height;\n }\n }\n return pos;\n };\n Slider.prototype.checkHandleValue = function (value) {\n if (this.min > this.max) {\n this.min = this.max;\n }\n if (this.min === this.max) {\n return (parseFloat(formatUnit(this.max)));\n }\n var handle = this.tempStartEnd();\n if (value < handle.start) {\n value = handle.start;\n }\n else if (value > handle.end) {\n value = handle.end;\n }\n return value;\n };\n /**\n * It is used to reposition slider.\n * @returns void\n */\n Slider.prototype.reposition = function () {\n var _this = this;\n this.firstHandle.style.transition = 'none';\n if (this.type !== 'Default') {\n this.rangeBar.style.transition = 'none';\n }\n if (this.type === 'Range') {\n this.secondHandle.style.transition = 'none';\n }\n this.handlePos1 = this.checkHandlePosition(this.handleVal1);\n if (this.handleVal2) {\n this.handlePos2 = this.checkHandlePosition(this.handleVal2);\n }\n if (this.orientation === 'Horizontal') {\n this.enableRtl ? this.firstHandle.style.right =\n this.handlePos1 + \"px\" : this.firstHandle.style.left = this.handlePos1 + \"px\";\n if (this.isMaterialTooltip) {\n this.enableRtl ? this.materialHandle.style.right =\n this.handlePos1 + \"px\" : this.materialHandle.style.left = this.handlePos1 + \"px\";\n }\n if (this.type === 'MinRange') {\n this.enableRtl ? (this.rangeBar.style.right = '0px') : (this.rangeBar.style.left = '0px');\n setStyleAttribute(this.rangeBar, { 'width': isNullOrUndefined(this.handlePos1) ? 0 : this.handlePos1 + 'px' });\n }\n else if (this.type === 'Range') {\n this.enableRtl ? this.secondHandle.style.right =\n this.handlePos2 + \"px\" : this.secondHandle.style.left = this.handlePos2 + \"px\";\n this.enableRtl ? (this.rangeBar.style.right =\n this.handlePos1 + 'px') : (this.rangeBar.style.left = this.handlePos1 + 'px');\n setStyleAttribute(this.rangeBar, { 'width': this.handlePos2 - this.handlePos1 + 'px' });\n }\n }\n else {\n this.firstHandle.style.bottom = this.handlePos1 + \"px\";\n if (this.isMaterialTooltip) {\n this.materialHandle.style.bottom = this.handlePos1 + \"px\";\n }\n if (this.type === 'MinRange') {\n this.rangeBar.style.bottom = '0px';\n setStyleAttribute(this.rangeBar, { 'height': isNullOrUndefined(this.handlePos1) ? 0 : this.handlePos1 + 'px' });\n }\n else if (this.type === 'Range') {\n this.secondHandle.style.bottom = this.handlePos2 + \"px\";\n this.rangeBar.style.bottom = this.handlePos1 + 'px';\n setStyleAttribute(this.rangeBar, { 'height': this.handlePos2 - this.handlePos1 + 'px' });\n }\n }\n if (this.limits.enabled) {\n this.setLimitBar();\n }\n if (this.ticks.placement !== 'None' && this.ul) {\n this.removeElement(this.ul);\n this.ul = undefined;\n this.renderScale();\n }\n this.handleStart();\n if (!this.tooltip.isVisible) {\n setTimeout(function () {\n _this.firstHandle.style.transition = _this.scaleTransform;\n if (_this.type === 'Range') {\n _this.secondHandle.style.transition = _this.scaleTransform;\n }\n });\n }\n this.refreshTooltip(this.tooltipTarget);\n };\n Slider.prototype.changeHandleValue = function (value) {\n var position = null;\n if (this.activeHandle === 1) {\n if (!(this.limits.enabled && this.limits.startHandleFixed)) {\n this.handleVal1 = this.checkHandleValue(value);\n this.handlePos1 = this.checkHandlePosition(this.handleVal1);\n if (this.type === 'Range' && this.handlePos1 > this.handlePos2) {\n this.handlePos1 = this.handlePos2;\n this.handleVal1 = this.handleVal2;\n }\n if (this.handlePos1 !== this.preHandlePos1) {\n position = this.preHandlePos1 = this.handlePos1;\n }\n }\n this.modifyZindex();\n }\n else {\n if (!(this.limits.enabled && this.limits.endHandleFixed)) {\n this.handleVal2 = this.checkHandleValue(value);\n this.handlePos2 = this.checkHandlePosition(this.handleVal2);\n if (this.type === 'Range' && this.handlePos2 < this.handlePos1) {\n this.handlePos2 = this.handlePos1;\n this.handleVal2 = this.handleVal1;\n }\n if (this.handlePos2 !== this.preHandlePos2) {\n position = this.preHandlePos2 = this.handlePos2;\n }\n }\n this.modifyZindex();\n }\n if (position !== null) {\n if (this.type !== 'Default') {\n this.setRangeBar();\n }\n this.setHandlePosition();\n }\n };\n Slider.prototype.tempStartEnd = function () {\n if (this.min > this.max) {\n return {\n start: this.max,\n end: this.min\n };\n }\n else {\n return {\n start: this.min,\n end: this.max\n };\n }\n };\n Slider.prototype.xyToPosition = function (position) {\n var pos;\n if (this.min === this.max) {\n return 100;\n }\n if (this.orientation === 'Horizontal') {\n var left = position.x - this.element.getBoundingClientRect().left;\n var num = this.element.offsetWidth / 100;\n this.val = (left / num);\n }\n else {\n var top_1 = position.y - this.element.getBoundingClientRect().top;\n var num = this.element.offsetHeight / 100;\n this.val = 100 - (top_1 / num);\n }\n var val = this.stepValueCalculation(this.val);\n if (val < 0) {\n val = 0;\n }\n else if (val > 100) {\n val = 100;\n }\n if (this.enableRtl && this.orientation !== 'Vertical') {\n val = 100 - val;\n }\n if (this.orientation === 'Horizontal') {\n pos = this.element.getBoundingClientRect().width * (val / 100);\n }\n else {\n pos = this.element.getBoundingClientRect().height * (val / 100);\n }\n return pos;\n };\n Slider.prototype.stepValueCalculation = function (value) {\n if (this.step === 0) {\n this.step = 1;\n }\n var percentStep = (parseFloat(formatUnit(this.step))) / ((parseFloat(formatUnit(this.max)) - parseFloat(formatUnit(this.min))) / 100);\n var remain = value % Math.abs(percentStep);\n if (remain !== 0) {\n if ((percentStep / 2) > remain) {\n value -= remain;\n }\n else {\n value += Math.abs(percentStep) - remain;\n }\n }\n return value;\n };\n Slider.prototype.add = function (a, b, addition) {\n var precision;\n var x = Math.pow(10, precision || 3);\n var val;\n if (addition) {\n val = (Math.round(a * x) + Math.round(b * x)) / x;\n }\n else {\n val = (Math.round(a * x) - Math.round(b * x)) / x;\n }\n return val;\n };\n Slider.prototype.positionToValue = function (pos) {\n var val;\n var diff = parseFloat(formatUnit(this.max)) - parseFloat(formatUnit(this.min));\n if (this.orientation === 'Horizontal') {\n val = (pos / this.element.getBoundingClientRect().width) * diff;\n }\n else {\n val = (pos / this.element.getBoundingClientRect().height) * diff;\n }\n var total = this.add(val, parseFloat(this.min.toString()), true);\n return (total);\n };\n Slider.prototype.sliderBarClick = function (evt) {\n evt.preventDefault();\n var pos;\n if (evt.type === 'mousedown' || evt.type === 'click') {\n pos = { x: evt.clientX, y: evt.clientY };\n }\n else if (evt.type === 'touchstart') {\n pos = { x: evt.changedTouches[0].clientX, y: evt.changedTouches[0].clientY };\n }\n var handlepos = this.xyToPosition(pos);\n var handleVal = this.positionToValue(handlepos);\n if (this.type === 'Range' && (this.handlePos2 - handlepos) < (handlepos - this.handlePos1)) {\n this.activeHandle = 2;\n if (!(this.limits.enabled && this.limits.endHandleFixed)) {\n if (this.limits.enabled) {\n var value = this.getLimitValueAndPosition(handleVal, this.limits.maxStart, this.limits.maxEnd);\n handleVal = value[0];\n handlepos = value[1];\n }\n this.secondHandle.classList.add(classNames.sliderActiveHandle);\n this.handlePos2 = this.preHandlePos2 = handlepos;\n this.handleVal2 = handleVal;\n }\n this.modifyZindex();\n this.secondHandle.focus();\n }\n else {\n this.activeHandle = 1;\n if (!(this.limits.enabled && this.limits.startHandleFixed)) {\n if (this.limits.enabled) {\n var value = this.getLimitValueAndPosition(handleVal, this.limits.minStart, this.limits.minEnd);\n handleVal = value[0];\n handlepos = value[1];\n }\n this.firstHandle.classList.add(classNames.sliderActiveHandle);\n this.handlePos1 = this.preHandlePos1 = handlepos;\n this.handleVal1 = handleVal;\n }\n this.modifyZindex();\n this.firstHandle.focus();\n }\n if (this.isMaterialTooltip) {\n this.tooltipElement.classList.add(classNames.materialTooltipActive);\n }\n var focusedElement = this.element.querySelector('.' + classNames.sliderTabHandle);\n if (focusedElement && this.getHandle() !== focusedElement) {\n focusedElement.classList.remove(classNames.sliderTabHandle);\n }\n var handle = this.activeHandle === 1 ? this.firstHandle : this.secondHandle;\n if (evt.target === handle) {\n if (this.isMaterial && !this.tooltip.isVisible &&\n !this.getHandle().classList.contains(classNames.sliderTabHandle)) {\n this.materialChange();\n }\n this.tooltipToggle(this.getHandle());\n return;\n }\n if (!this.checkRepeatedValue(handleVal)) {\n return;\n }\n var transition = this.isMaterial && this.tooltip.isVisible ?\n this.transitionOnMaterialTooltip : this.transition;\n this.getHandle().style.transition = transition.handle;\n if (this.type !== 'Default') {\n this.rangeBar.style.transition = transition.rangeBar;\n }\n this.setHandlePosition();\n if (this.type !== 'Default') {\n this.setRangeBar();\n }\n };\n Slider.prototype.sliderDown = function (event) {\n var _a, _b;\n event.preventDefault();\n this.focusSliderElement();\n if (this.type === 'Range' && this.drag && event.target === this.rangeBar) {\n var xPostion = void 0;\n var yPostion = void 0;\n if (event.type === 'mousedown') {\n _a = [event.clientX, event.clientY], xPostion = _a[0], yPostion = _a[1];\n }\n else if (event.type === 'touchstart') {\n _b = [event.changedTouches[0].clientX, event.changedTouches[0].clientY], xPostion = _b[0], yPostion = _b[1];\n }\n if (this.orientation === 'Horizontal') {\n this.firstPartRemain = xPostion - this.rangeBar.getBoundingClientRect().left;\n this.secondPartRemain = this.rangeBar.getBoundingClientRect().right - xPostion;\n }\n else {\n this.firstPartRemain = yPostion - this.rangeBar.getBoundingClientRect().top;\n this.secondPartRemain = this.rangeBar.getBoundingClientRect().bottom - yPostion;\n }\n this.minDiff = this.handleVal2 - this.handleVal1;\n this.tooltipToggle(this.rangeBar);\n var focusedElement = this.element.querySelector('.' + classNames.sliderTabHandle);\n if (focusedElement) {\n focusedElement.classList.remove(classNames.sliderTabHandle);\n }\n EventHandler.add(document, 'mousemove touchmove', this.dragRangeBarMove, this);\n EventHandler.add(document, 'mouseup touchend', this.dragRangeBarUp, this);\n }\n else {\n this.sliderBarClick(event);\n EventHandler.add(document, 'mousemove touchmove', this.sliderBarMove, this);\n EventHandler.add(document, 'mouseup touchend', this.sliderBarUp, this);\n }\n };\n Slider.prototype.handleValueAdjust = function (handleValue, assignValue, handleNumber) {\n if (handleNumber === 1) {\n this.handleVal1 = assignValue;\n this.handleVal2 = this.handleVal1 + this.minDiff;\n }\n else if (handleNumber === 2) {\n this.handleVal2 = assignValue;\n this.handleVal1 = this.handleVal2 - this.minDiff;\n }\n this.handlePos1 = this.checkHandlePosition(this.handleVal1);\n this.handlePos2 = this.checkHandlePosition(this.handleVal2);\n };\n Slider.prototype.dragRangeBarMove = function (event) {\n var _a, _b;\n if (event.type !== 'touchmove') {\n event.preventDefault();\n }\n var pos;\n this.rangeBar.style.transition = 'none';\n this.firstHandle.style.transition = 'none';\n this.secondHandle.style.transition = 'none';\n var xPostion;\n var yPostion;\n if (event.type === 'mousemove') {\n _a = [event.clientX, event.clientY], xPostion = _a[0], yPostion = _a[1];\n }\n else {\n _b = [event.changedTouches[0].clientX, event.changedTouches[0].clientY], xPostion = _b[0], yPostion = _b[1];\n }\n if (!(this.limits.enabled && this.limits.startHandleFixed) && !(this.limits.enabled && this.limits.endHandleFixed)) {\n if (!this.enableRtl) {\n pos = { x: xPostion - this.firstPartRemain, y: yPostion + this.secondPartRemain };\n }\n else {\n pos = { x: xPostion + this.secondPartRemain, y: yPostion + this.secondPartRemain };\n }\n this.handlePos1 = this.xyToPosition(pos);\n this.handleVal1 = this.positionToValue(this.handlePos1);\n if (!this.enableRtl) {\n pos = { x: xPostion + this.secondPartRemain, y: yPostion - this.firstPartRemain };\n }\n else {\n pos = { x: xPostion - this.firstPartRemain, y: yPostion - this.firstPartRemain };\n }\n this.handlePos2 = this.xyToPosition(pos);\n this.handleVal2 = this.positionToValue(this.handlePos2);\n if (this.limits.enabled) {\n var value = this.getLimitValueAndPosition(this.handleVal1, this.limits.minStart, this.limits.minEnd);\n this.handleVal1 = value[0];\n this.handlePos1 = value[1];\n if (this.handleVal1 === this.limits.minEnd) {\n this.handleValueAdjust(this.handleVal1, this.limits.minEnd, 1);\n }\n if (this.handleVal1 === this.limits.minStart) {\n this.handleValueAdjust(this.handleVal1, this.limits.minStart, 1);\n }\n value = this.getLimitValueAndPosition(this.handleVal2, this.limits.maxStart, this.limits.maxEnd);\n this.handleVal2 = value[0];\n this.handlePos2 = value[1];\n if (this.handleVal2 === this.limits.maxStart) {\n this.handleValueAdjust(this.handleVal2, this.limits.maxStart, 2);\n }\n if (this.handleVal2 === this.limits.maxEnd) {\n this.handleValueAdjust(this.handleVal2, this.limits.maxEnd, 2);\n }\n }\n if (this.handleVal2 === this.max) {\n this.handleValueAdjust(this.handleVal2, this.max, 2);\n }\n if (this.handleVal1 === this.min) {\n this.handleValueAdjust(this.handleVal1, this.min, 1);\n }\n }\n this.activeHandle = 1;\n this.setHandlePosition();\n this.activeHandle = 2;\n this.setHandlePosition();\n this.tooltipToggle(this.rangeBar);\n this.setRangeBar();\n };\n Slider.prototype.sliderBarUp = function () {\n this.changeEvent('changed');\n this.handleFocusOut();\n this.firstHandle.classList.remove(classNames.sliderActiveHandle);\n if (this.type === 'Range') {\n this.secondHandle.classList.remove(classNames.sliderActiveHandle);\n }\n this.closeTooltip();\n if (this.isMaterial) {\n this.getHandle().classList.remove('e-large-thumb-size');\n if (this.isMaterialTooltip) {\n this.tooltipElement.classList.remove(classNames.materialTooltipActive);\n }\n }\n EventHandler.remove(document, 'mousemove touchmove', this.sliderBarMove);\n EventHandler.remove(document, 'mouseup touchend', this.sliderBarUp);\n };\n Slider.prototype.sliderBarMove = function (evt) {\n if (evt.type !== 'touchmove') {\n evt.preventDefault();\n }\n var pos;\n if (evt.type === 'mousemove') {\n pos = { x: evt.clientX, y: evt.clientY };\n }\n else {\n pos = { x: evt.changedTouches[0].clientX, y: evt.changedTouches[0].clientY };\n }\n var handlepos = this.xyToPosition(pos);\n var handleVal = this.positionToValue(handlepos);\n handlepos = Math.round(handlepos);\n if (this.type !== 'Range' && this.activeHandle === 1) {\n if (!(this.limits.enabled && this.limits.startHandleFixed)) {\n if (this.limits.enabled) {\n var valueAndPostion = this.getLimitValueAndPosition(handleVal, this.limits.minStart, this.limits.minEnd);\n handlepos = valueAndPostion[1];\n handleVal = valueAndPostion[0];\n }\n this.handlePos1 = handlepos;\n this.handleVal1 = handleVal;\n }\n this.firstHandle.classList.add(classNames.sliderActiveHandle);\n }\n if (this.type === 'Range') {\n if (this.activeHandle === 1) {\n this.firstHandle.classList.add(classNames.sliderActiveHandle);\n if (!(this.limits.enabled && this.limits.startHandleFixed)) {\n if (handlepos > this.handlePos2) {\n handlepos = this.handlePos2;\n handleVal = this.handleVal2;\n }\n if (handlepos !== this.preHandlePos1) {\n if (this.limits.enabled) {\n var value = this.getLimitValueAndPosition(handleVal, this.limits.minStart, this.limits.minEnd);\n handleVal = value[0];\n handlepos = value[1];\n }\n this.handlePos1 = this.preHandlePos1 = handlepos;\n this.handleVal1 = handleVal;\n this.activeHandle = 1;\n }\n }\n }\n else if (this.activeHandle === 2) {\n this.secondHandle.classList.add(classNames.sliderActiveHandle);\n if (!(this.limits.enabled && this.limits.endHandleFixed)) {\n if (handlepos < this.handlePos1) {\n handlepos = this.handlePos1;\n handleVal = this.handleVal1;\n }\n if (handlepos !== this.preHandlePos2) {\n if (this.limits.enabled) {\n var value = this.getLimitValueAndPosition(handleVal, this.limits.maxStart, this.limits.maxEnd);\n handleVal = value[0];\n handlepos = value[1];\n }\n this.handlePos2 = this.preHandlePos2 = handlepos;\n this.handleVal2 = handleVal;\n this.activeHandle = 2;\n }\n }\n }\n }\n if (!this.checkRepeatedValue(handleVal)) {\n return;\n }\n this.getHandle().style.transition = this.scaleTransform;\n if (this.type !== 'Default') {\n this.rangeBar.style.transition = 'none';\n }\n this.setHandlePosition();\n if (this.isMaterial && !this.tooltip.isVisible &&\n !this.getHandle().classList.contains(classNames.sliderTabHandle)) {\n this.materialChange();\n }\n this.tooltipToggle(this.getHandle());\n if (this.type !== 'Default') {\n this.setRangeBar();\n }\n };\n Slider.prototype.dragRangeBarUp = function (event) {\n this.changeEvent('changed');\n this.closeTooltip();\n EventHandler.remove(document, 'mousemove touchmove', this.dragRangeBarMove);\n EventHandler.remove(document, 'mouseup touchend', this.dragRangeBarUp);\n };\n Slider.prototype.checkRepeatedValue = function (currentValue) {\n if (this.type === 'Range') {\n var previousVal = this.enableRtl && this.orientation !== 'Vertical' ? (this.activeHandle === 1 ?\n this.previousVal[1] : this.previousVal[0]) :\n (this.activeHandle === 1 ? this.previousVal[0] : this.previousVal[1]);\n if (currentValue === previousVal) {\n return 0;\n }\n }\n else {\n if (currentValue === this.previousVal) {\n return 0;\n }\n }\n return 1;\n };\n Slider.prototype.refreshTooltip = function (target) {\n if (this.tooltip.isVisible && this.tooltipObj) {\n this.tooltipValue();\n if (target) {\n this.tooltipObj.refresh(target);\n this.tooltipTarget = target;\n }\n }\n };\n Slider.prototype.openTooltip = function (target) {\n if (this.tooltip.isVisible && this.tooltipObj && !this.isMaterialTooltip) {\n this.tooltipValue();\n this.tooltipObj.open(target);\n this.tooltipTarget = target;\n }\n };\n Slider.prototype.closeTooltip = function () {\n if (this.tooltip.isVisible && this.tooltipObj && this.tooltip.showOn !== 'Always' && !this.isMaterialTooltip) {\n this.tooltipValue();\n this.tooltipObj.close();\n this.tooltipTarget = undefined;\n }\n };\n Slider.prototype.keyDown = function (event) {\n switch (event.keyCode) {\n case 37:\n case 38:\n case 39:\n case 40:\n case 33:\n case 34:\n case 36:\n case 35:\n event.preventDefault();\n this.buttonClick(event);\n break;\n }\n };\n Slider.prototype.wireButtonEvt = function (destroy) {\n if (!destroy) {\n EventHandler.add(this.firstBtn, 'mouseleave touchleave', this.buttonFocusOut, this);\n EventHandler.add(this.secondBtn, 'mouseleave touchleave', this.buttonFocusOut, this);\n EventHandler.add(this.firstBtn, 'mousedown touchstart', this.repeatHandlerMouse, this);\n EventHandler.add(this.firstBtn, 'mouseup mouseleave touchup touchend', this.repeatHandlerUp, this);\n EventHandler.add(this.secondBtn, 'mousedown touchstart', this.repeatHandlerMouse, this);\n EventHandler.add(this.secondBtn, 'mouseup mouseleave touchup touchend', this.repeatHandlerUp, this);\n EventHandler.add(this.firstBtn, 'focusout', this.sliderFocusOut, this);\n EventHandler.add(this.secondBtn, 'focusout', this.sliderFocusOut, this);\n }\n else {\n EventHandler.remove(this.firstBtn, 'mouseleave touchleave', this.buttonFocusOut);\n EventHandler.remove(this.secondBtn, 'mouseleave touchleave', this.buttonFocusOut);\n EventHandler.remove(this.firstBtn, 'mousedown touchstart', this.repeatHandlerMouse);\n EventHandler.remove(this.firstBtn, 'mouseup mouseleave touchup touchend', this.repeatHandlerUp);\n EventHandler.remove(this.secondBtn, 'mousedown touchstart', this.repeatHandlerMouse);\n EventHandler.remove(this.secondBtn, 'mouseup mouseleave touchup touchend', this.repeatHandlerUp);\n EventHandler.remove(this.firstBtn, 'focusout', this.sliderFocusOut);\n EventHandler.remove(this.secondBtn, 'focusout', this.sliderFocusOut);\n }\n };\n Slider.prototype.wireEvents = function () {\n this.onresize = this.reposition.bind(this);\n window.addEventListener('resize', this.onresize);\n if (this.enabled && !this.readonly) {\n EventHandler.add(this.element, 'mousedown touchstart', this.sliderDown, this);\n EventHandler.add(this.sliderContainer, 'keydown', this.keyDown, this);\n EventHandler.add(this.sliderContainer, 'keyup', this.keyUp, this);\n EventHandler.add(this.element, 'focusout', this.sliderFocusOut, this);\n EventHandler.add(this.sliderContainer, 'mouseover mouseout touchstart touchend', this.hover, this);\n this.wireFirstHandleEvt(false);\n if (this.type === 'Range') {\n this.wireSecondHandleEvt(false);\n }\n if (this.showButtons) {\n this.wireButtonEvt(false);\n }\n this.wireMaterialTooltipEvent(false);\n if (this.isForm) {\n EventHandler.add(this.formElement, 'reset', this.formResetHandler, this);\n }\n }\n };\n Slider.prototype.unwireEvents = function () {\n EventHandler.remove(this.element, 'mousedown touchstart', this.sliderDown);\n EventHandler.remove(this.sliderContainer, 'keydown', this.keyDown);\n EventHandler.remove(this.sliderContainer, 'keyup', this.keyUp);\n EventHandler.remove(this.element, 'focusout', this.sliderFocusOut);\n EventHandler.remove(this.sliderContainer, 'mouseover mouseout touchstart touchend', this.hover);\n this.wireFirstHandleEvt(true);\n if (this.type === 'Range') {\n this.wireSecondHandleEvt(true);\n }\n if (this.showButtons) {\n this.wireButtonEvt(true);\n }\n this.wireMaterialTooltipEvent(true);\n EventHandler.remove(this.element, 'reset', this.formResetHandler);\n };\n Slider.prototype.formResetHandler = function () {\n this.setProperties({ 'value': this.formResetValue }, true);\n this.setValue();\n };\n Slider.prototype.keyUp = function (event) {\n if (event.keyCode === 9 && event.target.classList.contains(classNames.sliderHandle)) {\n this.focusSliderElement();\n if (!event.target.classList.contains(classNames.sliderTabHandle)) {\n if (this.element.querySelector('.' + classNames.sliderTabHandle)) {\n this.element.querySelector('.' + classNames.sliderTabHandle).classList.remove(classNames.sliderTabHandle);\n }\n event.target.classList.add(classNames.sliderTabHandle);\n var parentElement = event.target.parentElement;\n if (parentElement === this.element) {\n parentElement.querySelector('.' + classNames.sliderTrack).classList.add(classNames.sliderTabTrack);\n if (this.type === 'Range' || this.type === 'MinRange') {\n parentElement.querySelector('.' + classNames.rangeBar).classList.add(classNames.sliderTabRange);\n }\n }\n if (this.type === 'Range') {\n (event.target.previousSibling).classList.contains(classNames.sliderHandle) ?\n this.activeHandle = 2 : this.activeHandle = 1;\n }\n this.getHandle().focus();\n this.tooltipToggle(this.getHandle());\n }\n }\n this.closeTooltip();\n this.changeEvent('changed');\n };\n Slider.prototype.hover = function (event) {\n if (!isNullOrUndefined(event)) {\n if (event.type === 'mouseover' || event.type === 'touchmove' || event.type === 'mousemove' ||\n event.type === 'pointermove' || event.type === 'touchstart') {\n this.sliderContainer.classList.add(classNames.sliderHover);\n }\n else {\n this.sliderContainer.classList.remove(classNames.sliderHover);\n }\n }\n };\n Slider.prototype.sliderFocusOut = function (event) {\n if (event.relatedTarget !== this.secondHandle && event.relatedTarget !== this.firstHandle &&\n event.relatedTarget !== this.element && event.relatedTarget !== this.firstBtn && event.relatedTarget !== this.secondBtn) {\n this.closeMaterialTooltip();\n if (this.element.querySelector('.' + classNames.sliderTabHandle)) {\n this.element.querySelector('.' + classNames.sliderTabHandle).classList.remove(classNames.sliderTabHandle);\n }\n if (this.element.querySelector('.' + classNames.sliderTabTrack)) {\n this.element.querySelector('.' + classNames.sliderTabTrack).classList.remove(classNames.sliderTabTrack);\n if ((this.type === 'Range' || this.type === 'MinRange') &&\n this.element.querySelector('.' + classNames.sliderTabRange)) {\n this.element.querySelector('.' + classNames.sliderTabRange).classList.remove(classNames.sliderTabRange);\n }\n }\n this.hiddenInput.focus();\n this.hiddenInput.blur();\n this.isElementFocused = false;\n }\n };\n Slider.prototype.removeElement = function (element) {\n if (element.parentNode) {\n element.parentNode.removeChild(element);\n }\n };\n Slider.prototype.changeSliderType = function (type) {\n if (this.isMaterialTooltip && this.materialHandle) {\n this.sliderContainer.classList.remove(classNames.materialSlider);\n this.removeElement(this.materialHandle);\n this.materialHandle = undefined;\n }\n this.removeElement(this.firstHandle);\n this.firstHandle = undefined;\n if (type !== 'Default') {\n if (type === 'Range') {\n this.removeElement(this.secondHandle);\n this.secondHandle = undefined;\n }\n this.removeElement(this.rangeBar);\n this.rangeBar = undefined;\n }\n if (this.tooltip.isVisible && !isNullOrUndefined(this.tooltipObj)) {\n this.tooltipObj.destroy();\n this.tooltipElement = undefined;\n this.tooltipCollidedPosition = undefined;\n }\n if (this.limits.enabled) {\n if (type === 'MinRange' || type === 'Default') {\n if (!isNullOrUndefined(this.limitBarFirst)) {\n this.removeElement(this.limitBarFirst);\n this.limitBarFirst = undefined;\n }\n }\n else {\n if (!isNullOrUndefined(this.limitBarSecond)) {\n this.removeElement(this.limitBarSecond);\n this.limitBarSecond = undefined;\n }\n }\n }\n this.activeHandle = 1;\n this.getThemeInitialization();\n if (this.type === 'Range') {\n this.rangeValueUpdate();\n }\n this.createRangeBar();\n if (this.limits.enabled) {\n this.createLimitBar();\n }\n this.setHandler();\n this.setOrientClass();\n this.wireFirstHandleEvt(false);\n if (this.type === 'Range') {\n this.wireSecondHandleEvt(false);\n }\n this.setValue();\n if (this.tooltip.isVisible) {\n this.renderTooltip();\n this.wireMaterialTooltipEvent(false);\n }\n this.updateConfig();\n };\n Slider.prototype.changeRtl = function () {\n if (!this.enableRtl && this.type === 'Range') {\n this.value = [this.handleVal2, this.handleVal1];\n }\n this.updateConfig();\n if (this.tooltip.isVisible) {\n this.tooltipObj.refresh(this.firstHandle);\n }\n if (this.showButtons) {\n var enabledRTL = this.enableRtl && this.orientation !== 'Vertical';\n attributes(enabledRTL ? this.secondBtn : this.firstBtn, { 'aria-label': 'Decrease', title: 'Decrease' });\n attributes(enabledRTL ? this.firstBtn : this.secondBtn, { 'aria-label': 'Increase', title: 'Increase' });\n }\n };\n Slider.prototype.changeOrientation = function () {\n this.changeSliderType(this.type);\n };\n Slider.prototype.updateConfig = function () {\n this.setEnableRTL();\n this.setValue();\n if (this.tooltip.isVisible) {\n this.refreshTooltip(this.tooltipTarget);\n }\n if (this.ticks.placement !== 'None') {\n if (this.ul) {\n this.removeElement(this.ul);\n this.ul = undefined;\n this.renderScale();\n }\n }\n this.limitsPropertyChange();\n };\n Slider.prototype.limitsPropertyChange = function () {\n if (this.limits.enabled) {\n if (isNullOrUndefined(this.limitBarFirst) && this.type !== 'Range') {\n this.createLimitBar();\n }\n if (isNullOrUndefined(this.limitBarFirst) && isNullOrUndefined(this.limitBarSecond) && this.type === 'Range') {\n this.createLimitBar();\n }\n this.setLimitBar();\n this.setValue();\n }\n else {\n if (!isNullOrUndefined(this.limitBarFirst)) {\n detach(this.limitBarFirst);\n }\n if (!isNullOrUndefined(this.limitBarSecond)) {\n detach(this.limitBarSecond);\n }\n }\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @private\n */\n Slider.prototype.getPersistData = function () {\n var keyEntity = ['value'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Prepares the slider for safe removal from the DOM.\n * Detaches all event handlers, attributes, and classes to avoid memory leaks.\n * @method destroy\n * @return {void}\n */\n Slider.prototype.destroy = function () {\n _super.prototype.destroy.call(this);\n this.unwireEvents();\n window.removeEventListener('resize', this.onresize);\n removeClass([this.sliderContainer], [classNames.sliderDisabled]);\n this.firstHandle.removeAttribute('aria-orientation');\n if (this.type === 'Range') {\n this.secondHandle.removeAttribute('aria-orientation');\n }\n this.sliderContainer.parentNode.insertBefore(this.element, this.sliderContainer);\n detach(this.sliderContainer);\n if (this.tooltip.isVisible) {\n this.tooltipObj.destroy();\n }\n this.element.innerHTML = '';\n };\n /**\n * Calls internally if any of the property value is changed.\n * @private\n */\n Slider.prototype.onPropertyChanged = function (newProp, oldProp) {\n var _this = this;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'cssClass':\n this.setCSSClass(oldProp.cssClass);\n break;\n case 'value':\n if (newProp && oldProp) {\n var value = isNullOrUndefined(newProp.value) ?\n (this.type === 'Range' ? [this.min, this.max] : this.min) : newProp.value;\n this.setProperties({ 'value': value }, true);\n if (oldProp.value.toString() !== value.toString()) {\n this.setValue();\n this.refreshTooltip(this.tooltipTarget);\n if (this.type === 'Range') {\n if (isNullOrUndefined(newProp.value) || oldProp.value[1] === value[1]) {\n this.activeHandle = 1;\n }\n else {\n this.activeHandle = 2;\n }\n }\n }\n }\n break;\n case 'min':\n case 'step':\n case 'max':\n this.setMinMaxValue();\n break;\n case 'tooltip':\n if (!isNullOrUndefined(newProp.tooltip) && !isNullOrUndefined(oldProp.tooltip)) {\n this.setTooltip();\n }\n break;\n case 'type':\n this.changeSliderType(oldProp.type);\n this.setZindex();\n break;\n case 'enableRtl':\n if (oldProp.enableRtl !== newProp.enableRtl && this.orientation !== 'Vertical') {\n this.rtl = oldProp.enableRtl;\n this.changeRtl();\n }\n break;\n case 'limits':\n this.limitsPropertyChange();\n break;\n case 'orientation':\n this.changeOrientation();\n break;\n case 'ticks':\n if (!isNullOrUndefined(this.sliderContainer.querySelector('.' + classNames.scale))) {\n detach(this.ul);\n Array.prototype.forEach.call(this.sliderContainer.classList, function (className) {\n if (className.match(/e-scale-/)) {\n _this.sliderContainer.classList.remove(className);\n }\n });\n }\n if (this.ticks.placement !== 'None') {\n this.renderScale();\n this.setZindex();\n }\n break;\n case 'locale':\n if (this.showButtons) {\n this.buttonTitle();\n }\n break;\n case 'showButtons':\n if (newProp.showButtons) {\n this.setButtons();\n this.reposition();\n if (this.enabled && !this.readonly) {\n this.wireButtonEvt(false);\n }\n }\n else {\n if (this.firstBtn && this.secondBtn) {\n this.sliderContainer.removeChild(this.firstBtn);\n this.sliderContainer.removeChild(this.secondBtn);\n this.sliderContainer.classList.remove(classNames.sliderButtonClass);\n this.firstBtn = undefined;\n this.secondBtn = undefined;\n }\n }\n break;\n case 'enabled':\n this.setEnabled();\n break;\n case 'readonly':\n this.setReadOnly();\n break;\n case 'customValues':\n this.setValue();\n this.reposition();\n break;\n }\n }\n };\n Slider.prototype.setReadOnly = function () {\n if (this.readonly) {\n this.unwireEvents();\n this.sliderContainer.classList.add(classNames.readonly);\n }\n else {\n this.wireEvents();\n this.sliderContainer.classList.remove(classNames.readonly);\n }\n };\n Slider.prototype.setMinMaxValue = function () {\n var _this = this;\n this.setValue();\n this.refreshTooltip(this.tooltipTarget);\n if (!isNullOrUndefined(this.sliderContainer.querySelector('.' + classNames.scale))) {\n if (this.ul) {\n detach(this.ul);\n Array.prototype.forEach.call(this.sliderContainer.classList, function (className) {\n if (className.match(/e-scale-/)) {\n _this.sliderContainer.classList.remove(className);\n }\n });\n }\n }\n if (this.ticks.placement !== 'None') {\n this.renderScale();\n this.setZindex();\n }\n };\n Slider.prototype.setZindex = function () {\n this.zIndex = 6;\n if (!isNullOrUndefined(this.ticks) && this.ticks.placement !== 'None') {\n this.ul.style.zIndex = (this.zIndex + -7) + '';\n this.element.style.zIndex = (this.zIndex + 2) + '';\n }\n if (!this.isMaterial && !isNullOrUndefined(this.ticks) && this.ticks.placement === 'Both') {\n this.element.style.zIndex = (this.zIndex + 2) + '';\n }\n this.firstHandle.style.zIndex = (this.zIndex + 3) + '';\n if (this.type === 'Range') {\n this.secondHandle.style.zIndex = (this.zIndex + 4) + '';\n }\n };\n Slider.prototype.setTooltip = function () {\n this.changeSliderType(this.type);\n };\n /**\n * Gets the component name\n * @private\n */\n Slider.prototype.getModuleName = function () {\n return 'slider';\n };\n __decorate([\n Property(null)\n ], Slider.prototype, \"value\", void 0);\n __decorate([\n Property(null)\n ], Slider.prototype, \"customValues\", void 0);\n __decorate([\n Property(1)\n ], Slider.prototype, \"step\", void 0);\n __decorate([\n Property(0)\n ], Slider.prototype, \"min\", void 0);\n __decorate([\n Property(100)\n ], Slider.prototype, \"max\", void 0);\n __decorate([\n Property(false)\n ], Slider.prototype, \"readonly\", void 0);\n __decorate([\n Property('Default')\n ], Slider.prototype, \"type\", void 0);\n __decorate([\n Complex({}, TicksData)\n ], Slider.prototype, \"ticks\", void 0);\n __decorate([\n Complex({}, LimitData)\n ], Slider.prototype, \"limits\", void 0);\n __decorate([\n Property(true)\n ], Slider.prototype, \"enabled\", void 0);\n __decorate([\n Property(false)\n ], Slider.prototype, \"enableRtl\", void 0);\n __decorate([\n Complex({}, TooltipData)\n ], Slider.prototype, \"tooltip\", void 0);\n __decorate([\n Property(false)\n ], Slider.prototype, \"showButtons\", void 0);\n __decorate([\n Property(true)\n ], Slider.prototype, \"enableAnimation\", void 0);\n __decorate([\n Property('Horizontal')\n ], Slider.prototype, \"orientation\", void 0);\n __decorate([\n Property('')\n ], Slider.prototype, \"cssClass\", void 0);\n __decorate([\n Event()\n ], Slider.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Slider.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], Slider.prototype, \"changed\", void 0);\n __decorate([\n Event()\n ], Slider.prototype, \"renderingTicks\", void 0);\n __decorate([\n Event()\n ], Slider.prototype, \"renderedTicks\", void 0);\n __decorate([\n Event()\n ], Slider.prototype, \"tooltipChange\", void 0);\n Slider = __decorate([\n NotifyPropertyChanges\n ], Slider);\n return Slider;\n}(Component));\nexport { Slider };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { selectAll, select, createElement, Base } from '@syncfusion/ej2-base';\nimport { extend, isNullOrUndefined, EventHandler } from '@syncfusion/ej2-base';\nimport { Property, NotifyPropertyChanges, Event, onIntlChange } from '@syncfusion/ej2-base';\nimport { L10n } from '@syncfusion/ej2-base';\n/**\n * global declarations\n */\n// tslint:disable-next-line:no-any\nexport var regex = {\n EMAIL: new RegExp('^[A-Za-z0-9._%+-]{1,}@[A-Za-z0-9._%+-]{1,}([.]{1}[a-zA-Z0-9]{2,5}' +\n '|[.]{1}[a-zA-Z0-9]{2,4}[.]{1}[a-zA-Z0-9]{2,4})$'),\n URL: /^(?:http(s)?:\\/\\/)?[\\w.-]+(?:\\.[\\w\\.-]+)+[\\w\\-\\._~:/?#[\\]@!\\$&'\\(\\)\\*\\+,;=.]+$/m,\n DATE_ISO: new RegExp('^([0-9]{4})-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])$'),\n DIGITS: new RegExp('^[0-9]*$'),\n PHONE: new RegExp('^[+]?[0-9]{9,13}$'),\n CREDITCARD: new RegExp('^\\\\d{13,16}$')\n};\n/**\n * ErrorOption values\n * @private\n */\nexport var ErrorOption;\n(function (ErrorOption) {\n ErrorOption[ErrorOption[\"Message\"] = 0] = \"Message\";\n ErrorOption[ErrorOption[\"Label\"] = 1] = \"Label\";\n})(ErrorOption || (ErrorOption = {}));\n/**\n * FormValidator class enables you to validate the form fields based on your defined rules\n * ```html\n * \n * \n * ```\n */\nvar FormValidator = /** @class */ (function (_super) {\n __extends(FormValidator, _super);\n // Initializes the FormValidator \n function FormValidator(element, options) {\n var _this = _super.call(this, options, element) || this;\n _this.validated = [];\n _this.errorRules = [];\n _this.allowSubmit = false;\n _this.required = 'required';\n _this.infoElement = null;\n _this.inputElement = null;\n _this.selectQuery = 'input:not([type=reset]):not([type=button]), select, textarea';\n // tslint:disable-next-line:no-any\n _this.localyMessage = {};\n /**\n * Specifies the default messages for validation rules.\n * @default : { List of validation message };\n */\n _this.defaultMessages = {\n required: 'This field is required.',\n email: 'Please enter a valid email address.',\n url: 'Please enter a valid URL.',\n date: 'Please enter a valid date.',\n dateIso: 'Please enter a valid date ( ISO ).',\n creditcard: 'Please enter valid card number',\n number: 'Please enter a valid number.',\n digits: 'Please enter only digits.',\n maxLength: 'Please enter no more than {0} characters.',\n minLength: 'Please enter at least {0} characters.',\n rangeLength: 'Please enter a value between {0} and {1} characters long.',\n range: 'Please enter a value between {0} and {1}.',\n max: 'Please enter a value less than or equal to {0}.',\n min: 'Please enter a value greater than or equal to {0}.',\n regex: 'Please enter a correct value.',\n tel: 'Please enter a valid phone number.',\n pattern: 'Please enter a correct pattern value.',\n equalTo: 'Please enter the valid match text',\n };\n if (typeof _this.rules === 'undefined') {\n _this.rules = {};\n }\n _this.l10n = new L10n('formValidator', _this.defaultMessages, _this.locale);\n if (_this.locale) {\n _this.localeFunc();\n }\n onIntlChange.on('notifyExternalChange', _this.afterLocalization, _this);\n element = typeof element === 'string' ? select(element, document) : element;\n // Set novalidate to prevent default HTML5 form validation\n if (_this.element != null) {\n _this.element.setAttribute('novalidate', '');\n _this.inputElements = selectAll(_this.selectQuery, _this.element);\n _this.createHTML5Rules();\n _this.wireEvents();\n }\n else {\n return undefined;\n }\n return _this;\n }\n FormValidator_1 = FormValidator;\n // tslint:enable\n /**\n * Add validation rules to the corresponding input element based on `name` attribute.\n * @param {string} name `name` of form field.\n * @param {Object} rules Validation rules for the corresponding element.\n * @return {void}\n */\n FormValidator.prototype.addRules = function (name, rules) {\n if (name) {\n if (this.rules.hasOwnProperty(name)) {\n extend(this.rules[name], rules, {});\n }\n else {\n this.rules[name] = rules;\n }\n }\n };\n /**\n * Remove validation to the corresponding field based on name attribute.\n * When no parameter is passed, remove all the validations in the form.\n * @param {string} name Input name attribute value.\n * @param {string[]} rules List of validation rules need to be remove from the corresponding element.\n * @return {void}\n */\n FormValidator.prototype.removeRules = function (name, rules) {\n if (!name && !rules) {\n this.rules = {};\n }\n else if (this.rules[name] && !rules) {\n delete this.rules[name];\n }\n else if (!isNullOrUndefined(this.rules[name] && rules)) {\n for (var i = 0; i < rules.length; i++) {\n delete this.rules[name][rules[i]];\n }\n }\n else {\n return;\n }\n };\n /**\n * Validate the current form values using defined rules.\n * Returns `true` when the form is valid otherwise `false`\n * @param {string} selected - Optional parameter to validate specified element.\n * @return {boolean}\n */\n FormValidator.prototype.validate = function (selected) {\n var rules = Object.keys(this.rules);\n if (selected && rules.length) {\n this.validateRules(selected);\n //filter the selected element it don't have any valid input element\n return rules.indexOf(selected) !== -1 && this.errorRules.filter(function (data) {\n return data.name === selected;\n }).length === 0;\n }\n else {\n this.errorRules = [];\n for (var _i = 0, rules_1 = rules; _i < rules_1.length; _i++) {\n var name_1 = rules_1[_i];\n this.validateRules(name_1);\n }\n return this.errorRules.length === 0;\n }\n };\n /**\n * Reset the value of all the fields in form.\n * @return {void}\n */\n FormValidator.prototype.reset = function () {\n this.element.reset();\n this.clearForm();\n };\n /**\n * Get input element by name.\n * @param {string} name - Input element name attribute value.\n * @return {HTMLInputElement}\n */\n FormValidator.prototype.getInputElement = function (name) {\n this.inputElement = (select('[name=\"' + name + '\"]', this.element));\n return this.inputElement;\n };\n /**\n * Destroy the form validator object and error elements.\n * @return {void}\n */\n FormValidator.prototype.destroy = function () {\n this.reset();\n this.unwireEvents();\n this.rules = {};\n var elements = selectAll('.' + this.errorClass + ', .' + this.validClass, this.element);\n for (var _i = 0, elements_1 = elements; _i < elements_1.length; _i++) {\n var element = elements_1[_i];\n element.remove();\n }\n _super.prototype.destroy.call(this);\n onIntlChange.off('notifyExternalChange', this.afterLocalization);\n };\n /**\n * @private\n */\n FormValidator.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'locale':\n this.localeFunc();\n break;\n }\n }\n };\n ;\n /**\n * @private\n */\n FormValidator.prototype.localeFunc = function () {\n for (var _i = 0, _a = Object.keys(this.defaultMessages); _i < _a.length; _i++) {\n var key = _a[_i];\n this.l10n.setLocale(this.locale);\n var value = this.l10n.getConstant(key);\n this.localyMessage[key] = value;\n }\n };\n /**\n * @private\n */\n FormValidator.prototype.getModuleName = function () {\n return 'formValidator';\n };\n /**\n * @private\n */\n // tslint:disable-next-line:no-any\n FormValidator.prototype.afterLocalization = function (args) {\n this.locale = args.locale;\n this.localeFunc();\n };\n FormValidator.prototype.clearForm = function () {\n this.errorRules = [];\n this.validated = [];\n var elements = selectAll(this.selectQuery, this.element);\n for (var _i = 0, elements_2 = elements; _i < elements_2.length; _i++) {\n var element = elements_2[_i];\n var input = element;\n input.removeAttribute('aria-invalid');\n input.classList.remove(this.errorClass);\n if (input.name.length > 0) {\n this.getInputElement(input.name);\n this.getErrorElement(input.name);\n this.hideMessage(input.name);\n }\n input.classList.remove(this.validClass);\n }\n };\n FormValidator.prototype.createHTML5Rules = function () {\n var defRules = ['required', 'validateHidden', 'regex', 'rangeLength', 'maxLength', 'minLength', 'dateIso', 'digits',\n 'pattern', 'data-val-required', 'type', 'data-validation', 'min', 'max', 'range', 'equalTo', 'data-val-minlength-min',\n 'data-val-equalto-other', 'data-val-maxlength-max', 'data-val-range-min', 'data-val-regex-pattern', 'data-val-length-max',\n 'data-val-creditcard', 'data-val-phone'];\n var acceptedTypes = ['hidden', 'email', 'url', 'date', 'number', 'tel'];\n for (var _i = 0, _a = (this.inputElements); _i < _a.length; _i++) {\n var input = _a[_i];\n // Default attribute rules \n var allRule = {};\n for (var _b = 0, defRules_1 = defRules; _b < defRules_1.length; _b++) {\n var rule = defRules_1[_b];\n if (input.getAttribute(rule) !== null) {\n switch (rule) {\n case 'required':\n this.defRule(input, allRule, rule, input.required);\n break;\n case 'data-validation':\n rule = input.getAttribute(rule);\n this.defRule(input, allRule, rule, true);\n break;\n case 'type':\n if (acceptedTypes.indexOf(input.type) !== -1) {\n this.defRule(input, allRule, input.type, true);\n }\n break;\n case 'rangeLength':\n case 'range':\n this.defRule(input, allRule, rule, JSON.parse(input.getAttribute(rule)));\n break;\n case 'equalTo':\n var id = input.getAttribute(rule);\n this.defRule(input, allRule, rule, id);\n break;\n default:\n if (input.getAttribute('data-val') === 'true') {\n this.annotationRule(input, allRule, rule, input.getAttribute(rule));\n }\n else {\n this.defRule(input, allRule, rule, input.getAttribute(rule));\n }\n }\n }\n }\n //adding pattern type validation\n if (Object.keys(allRule).length !== 0) {\n this.addRules(input.name, allRule);\n }\n }\n };\n FormValidator.prototype.annotationRule = function (input, ruleCon, ruleName, value) {\n var annotationRule = ruleName.split('-');\n var rulesList = ['required', 'creditcard', 'phone', 'maxlength', 'minlength', 'range', 'regex', 'equalto'];\n var ruleFirstName = annotationRule[annotationRule.length - 1];\n var ruleSecondName = annotationRule[annotationRule.length - 2];\n if (rulesList.indexOf(ruleFirstName) !== -1) {\n switch (ruleFirstName) {\n case 'required':\n this.defRule(input, ruleCon, 'required', value);\n break;\n case 'creditcard':\n this.defRule(input, ruleCon, 'creditcard', value);\n break;\n case 'phone':\n this.defRule(input, ruleCon, 'tel', value);\n break;\n }\n }\n else if (rulesList.indexOf(ruleSecondName) !== -1) {\n switch (ruleSecondName) {\n case 'maxlength':\n this.defRule(input, ruleCon, 'maxLength', value);\n break;\n case 'minlength':\n this.defRule(input, ruleCon, 'minLength', value);\n break;\n case 'range':\n var minvalue = input.getAttribute('data-val-range-min');\n var maxvalue = input.getAttribute('data-val-range-max');\n this.defRule(input, ruleCon, 'range', [minvalue, maxvalue]);\n break;\n case 'equalto':\n var id = input.getAttribute(ruleName).split('.');\n this.defRule(input, ruleCon, 'equalTo', id[id.length - 1]);\n break;\n case 'regex':\n this.defRule(input, ruleCon, 'regex', value);\n break;\n }\n }\n };\n FormValidator.prototype.defRule = function (input, ruleCon, ruleName, value) {\n var message = input.getAttribute('data-' + ruleName + '-message');\n var annotationMessage = input.getAttribute('data-val-' + ruleName);\n var customMessage;\n if (this.rules[input.name] && ruleName !== 'validateHidden' && ruleName !== 'hidden') {\n this.getInputElement(input.name);\n customMessage = this.getErrorMessage(this.rules[input.name][ruleName], ruleName);\n }\n if (message) {\n value = [value, message];\n }\n else if (annotationMessage) {\n value = [value, annotationMessage];\n }\n else if (customMessage) {\n value = [value, customMessage];\n }\n ruleCon[ruleName] = value;\n };\n // Wire events to the form elements\n FormValidator.prototype.wireEvents = function () {\n for (var _i = 0, _a = (this.inputElements); _i < _a.length; _i++) {\n var input = _a[_i];\n if (FormValidator_1.isCheckable(input)) {\n EventHandler.add(input, 'click', this.clickHandler, this);\n }\n else if (input.tagName === 'SELECT') {\n EventHandler.add(input, 'change', this.changeHandler, this);\n }\n else {\n EventHandler.add(input, 'focusout', this.focusOutHandler, this);\n EventHandler.add(input, 'keyup', this.keyUpHandler, this);\n }\n }\n EventHandler.add(this.element, 'submit', this.submitHandler, this);\n EventHandler.add(this.element, 'reset', this.resetHandler, this);\n };\n // UnWire events to the form elements\n FormValidator.prototype.unwireEvents = function () {\n for (var _i = 0, _a = (this.inputElements); _i < _a.length; _i++) {\n var input = _a[_i];\n EventHandler.clearEvents(input);\n }\n EventHandler.remove(this.element, 'submit', this.submitHandler);\n EventHandler.remove(this.element, 'reset', this.resetHandler);\n };\n // Handle input element focusout event\n FormValidator.prototype.focusOutHandler = function (e) {\n this.trigger('focusout', e);\n //FormValidator.triggerCallback(this.focusout, e);\n var element = e.target;\n if (this.rules[element.name]) {\n if (this.rules[element.name][this.required] || element.value.length > 0) {\n this.validate(element.name);\n }\n else if (this.validated.indexOf(element.name) === -1) {\n this.validated.push(element.name);\n }\n }\n };\n // Handle input element keyup event\n FormValidator.prototype.keyUpHandler = function (e) {\n this.trigger('keyup', e);\n var element = e.target;\n // List of keys need to prevent while validation\n var excludeKeys = [16, 17, 18, 20, 35, 36, 37, 38, 39, 40, 45, 144, 225];\n if (e.which === 9 && (!this.rules[element.name] || (this.rules[element.name] && !this.rules[element.name][this.required]))) {\n return;\n }\n if (this.validated.indexOf(element.name) !== -1 && this.rules[element.name] && excludeKeys.indexOf(e.which) === -1) {\n this.validate(element.name);\n }\n };\n // Handle input click event\n FormValidator.prototype.clickHandler = function (e) {\n this.trigger('click', e);\n var element = e.target;\n // If element type is not submit allow validation\n if (element.type !== 'submit') {\n this.validate(element.name);\n }\n else if (element.getAttribute('formnovalidate') !== null) {\n // Prevent form validation, if submit button has formnovalidate attribute\n this.allowSubmit = true;\n }\n };\n // Handle input change event\n FormValidator.prototype.changeHandler = function (e) {\n this.trigger('change', e);\n var element = e.target;\n this.validate(element.name);\n };\n // Handle form submit event\n FormValidator.prototype.submitHandler = function (e) {\n this.trigger('submit', e);\n //FormValidator.triggerCallback(this.submit, e);\n // Prevent form submit if validation failed\n if (!this.allowSubmit && !this.validate()) {\n e.preventDefault();\n }\n else {\n this.allowSubmit = false;\n }\n };\n // Handle form reset\n FormValidator.prototype.resetHandler = function () {\n this.clearForm();\n };\n // Validate each rule based on input element name\n FormValidator.prototype.validateRules = function (name) {\n if (!this.rules[name]) {\n return;\n }\n var rules = Object.keys(this.rules[name]);\n var hiddenType = false;\n var validateHiddenType = false;\n var vhPos = rules.indexOf('validateHidden');\n var hPos = rules.indexOf('hidden');\n this.getInputElement(name);\n if (hPos !== -1) {\n hiddenType = true;\n }\n if (vhPos !== -1) {\n validateHiddenType = true;\n }\n if (!hiddenType || (hiddenType && validateHiddenType)) {\n if (vhPos !== -1) {\n rules.splice(vhPos, 1);\n }\n if (hPos !== -1) {\n rules.splice((hPos - 1), 1);\n }\n this.getErrorElement(name);\n for (var _i = 0, rules_2 = rules; _i < rules_2.length; _i++) {\n var rule = rules_2[_i];\n var errorMessage = this.getErrorMessage(this.rules[name][rule], rule);\n var errorRule = { name: name, message: errorMessage };\n var eventArgs = {\n inputName: name,\n element: this.inputElement,\n message: errorMessage\n };\n if (!this.isValid(name, rule) && !this.inputElement.classList.contains(this.ignore)) {\n this.removeErrorRules(name);\n this.errorRules.push(errorRule);\n // Set aria attributes to invalid elements\n this.inputElement.setAttribute('aria-invalid', 'true');\n this.inputElement.setAttribute('aria-describedby', this.inputElement.id + '-info');\n this.inputElement.classList.add(this.errorClass);\n this.inputElement.classList.remove(this.validClass);\n if (!this.infoElement) {\n this.createErrorElement(name, errorRule.message, this.inputElement);\n }\n else {\n this.showMessage(errorRule);\n }\n eventArgs.errorElement = this.infoElement;\n eventArgs.status = 'failure';\n this.inputElement.classList.add(this.errorClass);\n this.inputElement.classList.remove(this.validClass);\n this.optionalValidationStatus(name, eventArgs);\n this.trigger('validationComplete', eventArgs);\n // Set aria-required to required rule elements\n if (rule === 'required') {\n this.inputElement.setAttribute('aria-required', 'true');\n }\n break;\n }\n else {\n this.hideMessage(name);\n eventArgs.status = 'success';\n this.trigger('validationComplete', eventArgs);\n }\n }\n }\n else {\n return;\n }\n };\n // Update the optional validation status\n FormValidator.prototype.optionalValidationStatus = function (name, refer) {\n if (!this.rules[name][this.required] && !this.inputElement.value.length) {\n this.infoElement.innerHTML = this.inputElement.value;\n this.infoElement.setAttribute('aria-invalid', 'false');\n refer.status = '';\n this.hideMessage(name);\n }\n };\n // Check the input element whether it's value satisfy the validation rule or not\n FormValidator.prototype.isValid = function (name, rule) {\n var params = this.rules[name][rule];\n var param = (params instanceof Array && typeof params[1] === 'string') ? params[0] : params;\n var currentRule = this.rules[name][rule];\n var args = { value: this.inputElement.value, param: param, element: this.inputElement, formElement: this.element };\n this.trigger('validationBegin', args);\n if (currentRule && typeof currentRule[0] === 'function') {\n var fn = currentRule[0];\n return fn.call(this, { element: this.inputElement, value: this.inputElement.value });\n }\n else if (FormValidator_1.isCheckable(this.inputElement)) {\n if (rule !== 'required') {\n return true;\n }\n return selectAll('input[name=' + name + ']:checked', this.element).length > 0;\n }\n else {\n return FormValidator_1.checkValidator[rule](args);\n }\n };\n // Return default error message or custom error message \n FormValidator.prototype.getErrorMessage = function (ruleValue, rule) {\n var message = this.inputElement.getAttribute('data-' + rule + '-message') ?\n this.inputElement.getAttribute('data-' + rule + '-message') :\n (ruleValue instanceof Array && typeof ruleValue[1] === 'string') ? ruleValue[1] :\n (Object.keys(this.localyMessage).length !== 0) ? this.localyMessage[rule] : this.defaultMessages[rule];\n var formats = message.match(/{(\\d)}/g);\n if (!isNullOrUndefined(formats)) {\n for (var i = 0; i < formats.length; i++) {\n var value = ruleValue instanceof Array ? ruleValue[i] : ruleValue;\n message = message.replace(formats[i], value);\n }\n }\n return message;\n };\n // Create error element based on name and error message\n FormValidator.prototype.createErrorElement = function (name, message, input) {\n var errorElement = createElement(this.errorElement, {\n className: this.errorClass,\n innerHTML: message,\n attrs: { for: name }\n });\n // Create message design if errorOption is message\n if (this.errorOption === ErrorOption.Message) {\n errorElement.classList.remove(this.errorClass);\n errorElement.classList.add('e-message');\n errorElement = createElement(this.errorContainer, { className: this.errorClass, innerHTML: errorElement.outerHTML });\n }\n errorElement.id = this.inputElement.name + '-info';\n // Append error message into MVC error message element\n if (this.element.querySelector('[data-valmsg-for=\"' + input.id + '\"]')) {\n this.element.querySelector('[data-valmsg-for=\"' + input.id + '\"]').appendChild(errorElement);\n }\n else if (input.hasAttribute('data-msg-containerid') === true) {\n // Append error message into custom div element\n var containerId = input.getAttribute('data-msg-containerid');\n var divElement = this.element.querySelector('#' + containerId);\n divElement.appendChild(errorElement);\n }\n else if (this.customPlacement != null) {\n // Call custom placement function if customPlacement is not null\n this.customPlacement.call(this, this.inputElement, errorElement);\n }\n else {\n this.inputElement.parentNode.insertBefore(errorElement, this.inputElement.nextSibling);\n }\n errorElement.style.display = 'block';\n this.getErrorElement(name);\n this.validated.push(name);\n this.checkRequired(name);\n };\n // Get error element by name\n FormValidator.prototype.getErrorElement = function (name) {\n this.infoElement = select(this.errorElement + '.' + this.errorClass, this.inputElement.parentElement);\n if (!this.infoElement) {\n this.infoElement = (select(this.errorElement + '.' + this.errorClass + '[for=\"' + name + '\"]', this.element) ||\n select(this.errorElement + '.' + this.errorClass + '[for=\"' + name + '\"]'));\n }\n return this.infoElement;\n };\n // Remove existing rule from errorRules object\n FormValidator.prototype.removeErrorRules = function (name) {\n for (var i = 0; i < this.errorRules.length; i++) {\n var rule = this.errorRules[i];\n if (rule.name === name) {\n this.errorRules.splice(i, 1);\n }\n }\n };\n // Show error message to the input element\n FormValidator.prototype.showMessage = function (errorRule) {\n this.infoElement.style.display = 'block';\n this.infoElement.innerHTML = errorRule.message;\n this.checkRequired(errorRule.name);\n };\n // Hide error message based on input name\n FormValidator.prototype.hideMessage = function (name) {\n if (this.infoElement) {\n this.infoElement.style.display = 'none';\n this.removeErrorRules(name);\n this.inputElement.classList.add(this.validClass);\n this.inputElement.classList.remove(this.errorClass);\n this.inputElement.setAttribute('aria-invalid', 'false');\n }\n };\n // Check whether the input element have required rule and its value is not empty\n FormValidator.prototype.checkRequired = function (name) {\n if (!this.rules[name][this.required] && !this.inputElement.value.length) {\n this.infoElement.innerHTML = this.inputElement.value;\n this.infoElement.setAttribute('aria-invalid', 'false');\n this.hideMessage(name);\n }\n };\n // Return boolean result if the input have chekcable or submit types\n FormValidator.isCheckable = function (input) {\n var inputType = input.getAttribute('type');\n return inputType && (inputType === 'checkbox' || inputType === 'radio' || inputType === 'submit');\n };\n var FormValidator_1;\n // List of function to validate the rules\n FormValidator.checkValidator = {\n required: function (option) {\n return option.value.length > 0;\n },\n email: function (option) {\n return regex.EMAIL.test(option.value);\n },\n url: function (option) {\n return regex.URL.test(option.value);\n },\n dateIso: function (option) {\n return regex.DATE_ISO.test(option.value);\n },\n tel: function (option) {\n return regex.PHONE.test(option.value);\n },\n creditcard: function (option) {\n return regex.CREDITCARD.test(option.value);\n },\n number: function (option) {\n return !isNaN(Number(option.value)) && option.value.indexOf(' ') === -1;\n },\n digits: function (option) {\n return regex.DIGITS.test(option.value);\n },\n maxLength: function (option) {\n return option.value.length <= option.param;\n },\n minLength: function (option) {\n return option.value.length >= option.param;\n },\n rangeLength: function (option) {\n var param = option.param;\n return option.value.length >= param[0] && option.value.length <= param[1];\n },\n range: function (option) {\n var param = option.param;\n return !isNaN(Number(option.value)) && Number(option.value) >= param[0] && Number(option.value) <= param[1];\n },\n date: function (option) {\n return !isNaN(new Date(option.value).getTime());\n },\n max: function (option) {\n if (!isNaN(Number(option.value))) {\n // Maximum rule validation for number\n return +option.value <= option.param;\n }\n // Maximum rule validation for date\n return new Date(option.value).getTime() <= new Date(JSON.parse(JSON.stringify(option.param))).getTime();\n },\n min: function (option) {\n if (!isNaN(Number(option.value))) {\n // Minimum rule validation for number\n return +option.value >= option.param;\n }\n else if ((option.value).indexOf(',') !== -1) {\n var uNum = (option.value).replace(/,/g, '');\n return parseFloat(uNum) >= option.param;\n }\n else {\n // Minimum rule validation for date\n return new Date(option.value).getTime() >= new Date(JSON.parse(JSON.stringify(option.param))).getTime();\n }\n },\n regex: function (option) {\n return new RegExp(option.param).test(option.value);\n },\n equalTo: function (option) {\n var compareTo = option.formElement.querySelector('#' + option.param);\n option.param = compareTo.value;\n return option.param === option.value;\n },\n };\n __decorate([\n Property('')\n ], FormValidator.prototype, \"locale\", void 0);\n __decorate([\n Property('e-hidden')\n ], FormValidator.prototype, \"ignore\", void 0);\n __decorate([\n Property()\n ], FormValidator.prototype, \"rules\", void 0);\n __decorate([\n Property('e-error')\n ], FormValidator.prototype, \"errorClass\", void 0);\n __decorate([\n Property('e-valid')\n ], FormValidator.prototype, \"validClass\", void 0);\n __decorate([\n Property('label')\n ], FormValidator.prototype, \"errorElement\", void 0);\n __decorate([\n Property('div')\n ], FormValidator.prototype, \"errorContainer\", void 0);\n __decorate([\n Property(ErrorOption.Label)\n ], FormValidator.prototype, \"errorOption\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"focusout\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"keyup\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"click\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"submit\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"validationBegin\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"validationComplete\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"customPlacement\", void 0);\n FormValidator = FormValidator_1 = __decorate([\n NotifyPropertyChanges\n ], FormValidator);\n return FormValidator;\n}(Base));\nexport { FormValidator };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, Property, Event, EventHandler, L10n, compile, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, detach, append, Animation } from '@syncfusion/ej2-base';\nimport { addClass, removeClass, KeyboardEvents, setValue, getValue, ChildProperty } from '@syncfusion/ej2-base';\nimport { Collection, Complex, Browser, Ajax, getUniqueID, closest } from '@syncfusion/ej2-base';\nimport { createSpinner, showSpinner, hideSpinner } from '@syncfusion/ej2-popups';\nvar ROOT = 'e-uploader';\nvar CONTROL_WRAPPER = 'e-upload';\nvar INPUT_WRAPPER = 'e-file-select';\nvar DROP_AREA = 'e-file-drop';\nvar DROP_WRAPPER = 'e-file-select-wrap';\nvar LIST_PARENT = 'e-upload-files';\nvar FILE = 'e-upload-file-list';\nvar STATUS = 'e-file-status';\nvar ACTION_BUTTONS = 'e-upload-actions';\nvar UPLOAD_BUTTONS = 'e-file-upload-btn e-css e-btn e-flat e-primary';\nvar CLEAR_BUTTONS = 'e-file-clear-btn e-css e-btn e-flat';\nvar FILE_NAME = 'e-file-name';\nvar FILE_TYPE = 'e-file-type';\nvar FILE_SIZE = 'e-file-size';\nvar REMOVE_ICON = 'e-file-remove-btn';\nvar DELETE_ICON = 'e-file-delete-btn';\nvar ABORT_ICON = 'e-file-abort-btn';\nvar RETRY_ICON = 'e-file-reload-btn';\nvar DRAG_HOVER = 'e-upload-drag-hover';\nvar PROGRESS_WRAPPER = 'e-upload-progress-wrap';\nvar PROGRESSBAR = 'e-upload-progress-bar';\nvar PROGRESSBAR_TEXT = 'e-progress-bar-text';\nvar UPLOAD_INPROGRESS = 'e-upload-progress';\nvar UPLOAD_SUCCESS = 'e-upload-success';\nvar UPLOAD_FAILED = 'e-upload-fails';\nvar TEXT_CONTAINER = 'e-file-container';\nvar VALIDATION_FAILS = 'e-validation-fails';\nvar RTL = 'e-rtl';\nvar DISABLED = 'e-disabled';\nvar RTL_CONTAINER = 'e-rtl-container';\nvar ICON_FOCUSED = 'e-clear-icon-focus';\nvar PROGRESS_INNER_WRAPPER = 'e-progress-inner-wrap';\nvar PAUSE_UPLOAD = 'e-file-pause-btn';\nvar RESUME_UPLOAD = 'e-file-play-btn';\nvar RESTRICT_RETRY = 'e-restrict-retry';\nvar FilesProp = /** @class */ (function (_super) {\n __extends(FilesProp, _super);\n function FilesProp() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], FilesProp.prototype, \"name\", void 0);\n __decorate([\n Property(null)\n ], FilesProp.prototype, \"size\", void 0);\n __decorate([\n Property('')\n ], FilesProp.prototype, \"type\", void 0);\n return FilesProp;\n}(ChildProperty));\nexport { FilesProp };\nvar ButtonsProps = /** @class */ (function (_super) {\n __extends(ButtonsProps, _super);\n function ButtonsProps() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Browse...')\n ], ButtonsProps.prototype, \"browse\", void 0);\n __decorate([\n Property('Upload')\n ], ButtonsProps.prototype, \"upload\", void 0);\n __decorate([\n Property('Clear')\n ], ButtonsProps.prototype, \"clear\", void 0);\n return ButtonsProps;\n}(ChildProperty));\nexport { ButtonsProps };\nvar AsyncSettings = /** @class */ (function (_super) {\n __extends(AsyncSettings, _super);\n function AsyncSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], AsyncSettings.prototype, \"saveUrl\", void 0);\n __decorate([\n Property('')\n ], AsyncSettings.prototype, \"removeUrl\", void 0);\n __decorate([\n Property(0)\n ], AsyncSettings.prototype, \"chunkSize\", void 0);\n __decorate([\n Property(3)\n ], AsyncSettings.prototype, \"retryCount\", void 0);\n __decorate([\n Property(500)\n ], AsyncSettings.prototype, \"retryAfterDelay\", void 0);\n return AsyncSettings;\n}(ChildProperty));\nexport { AsyncSettings };\n/**\n * The uploader component allows to upload images, documents, and other files from local to server.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar Uploader = /** @class */ (function (_super) {\n __extends(Uploader, _super);\n /**\n * Triggers when change the Uploader value.\n */\n function Uploader(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.initialAttr = { accept: null, multiple: false, disabled: false };\n _this.fileList = [];\n _this.filesData = [];\n _this.uploadedFilesData = [];\n _this.isForm = false;\n _this.allTypes = false;\n _this.pausedData = [];\n _this.uploadMetaData = [];\n _this.tabIndex = '0';\n _this.btnTabIndex = '0';\n _this.disableKeyboardNavigation = false;\n _this.count = -1;\n _this.actionCompleteCount = 0;\n _this.flag = true;\n _this.selectedFiles = [];\n return _this;\n }\n /**\n * Calls internally if any of the property value is changed.\n * @private\n */\n Uploader.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'allowedExtensions':\n this.setExtensions(this.allowedExtensions);\n this.clearAll();\n break;\n case 'enabled':\n this.setControlStatus();\n break;\n case 'multiple':\n this.setMultipleSelection();\n break;\n case 'enableRtl':\n this.setRTL();\n this.reRenderFileList();\n break;\n case 'buttons':\n this.buttons.browse = isNullOrUndefined(this.buttons.browse) ? '' : this.buttons.browse;\n this.buttons.clear = isNullOrUndefined(this.buttons.clear) ? '' : this.buttons.clear;\n this.buttons.upload = isNullOrUndefined(this.buttons.upload) ? '' : this.buttons.upload;\n this.renderButtonTemplates();\n break;\n case 'dropArea':\n this.unBindDropEvents();\n this.setDropArea();\n break;\n case 'files':\n this.renderPreLoadFiles();\n break;\n case 'directoryUpload':\n this.updateDirectoryAttributes();\n break;\n case 'minFileSize':\n case 'maxFileSize':\n case 'template':\n case 'autoUpload':\n this.clearAll();\n break;\n case 'sequentialUpload':\n this.clearAll();\n break;\n case 'locale':\n this.l10n.setLocale(this.locale);\n this.setLocalizedTexts();\n this.preLocaleObj = getValue('currentLocale', this.l10n);\n break;\n case 'cssClass':\n this.setCSSClass(oldProp.cssClass);\n break;\n }\n }\n };\n Uploader.prototype.setLocalizedTexts = function () {\n if (isNullOrUndefined(this.template)) {\n if (typeof (this.buttons.browse) === 'string') {\n this.browseButton.innerText = (this.buttons.browse === 'Browse...') ?\n this.localizedTexts('Browse') : this.buttons.browse;\n this.browseButton.setAttribute('title', this.browseButton.innerText);\n this.uploadWrapper.querySelector('.' + DROP_AREA).innerHTML = this.localizedTexts('dropFilesHint');\n }\n this.updateFileList();\n }\n };\n Uploader.prototype.getKeyValue = function (val) {\n var keyValue;\n for (var _i = 0, _a = Object.keys(this.preLocaleObj); _i < _a.length; _i++) {\n var key = _a[_i];\n if (this.preLocaleObj[key] === val) {\n keyValue = key;\n }\n }\n return keyValue;\n };\n Uploader.prototype.updateFileList = function () {\n var element;\n /* istanbul ignore next */\n if (this.fileList.length > 0 && !isNullOrUndefined(this.uploadWrapper.querySelector('.' + LIST_PARENT))) {\n for (var i = 0; i < this.fileList.length; i++) {\n element = this.fileList[i].querySelector('.e-file-status');\n element.innerHTML = this.localizedTexts(this.getKeyValue(this.filesData[i].status));\n this.filesData[i].status = this.localizedTexts(this.getKeyValue(this.filesData[i].status));\n if (this.fileList[i].classList.contains(UPLOAD_SUCCESS)) {\n this.fileList[i].querySelector('.e-icons').setAttribute('title', this.localizedTexts('delete'));\n }\n if (this.fileList[i].querySelector('.e-file-play-btn')) {\n this.fileList[i].querySelector('.e-icons').setAttribute('title', this.localizedTexts('resume'));\n }\n if (this.fileList[i].querySelector('.e-file-remove-btn')) {\n this.fileList[i].querySelector('.e-icons').setAttribute('title', this.localizedTexts('remove'));\n }\n if (this.fileList[i].querySelector('.e-file-reload-btn')) {\n this.fileList[i].querySelector('.e-icons').setAttribute('title', this.localizedTexts('retry'));\n }\n if (!this.autoUpload) {\n this.uploadButton.innerText = (this.buttons.upload === 'Upload') ?\n this.localizedTexts('Upload') : this.buttons.upload;\n this.uploadButton.setAttribute('title', this.localizedTexts('Upload'));\n this.clearButton.innerText = (this.buttons.clear === 'Clear') ?\n this.localizedTexts('Clear') : this.buttons.clear;\n this.clearButton.setAttribute('title', this.localizedTexts('Clear'));\n }\n }\n }\n };\n Uploader.prototype.reRenderFileList = function () {\n if (this.listParent) {\n detach(this.listParent);\n this.listParent = null;\n this.fileList = [];\n this.createFileList(this.filesData);\n if (this.actionButtons) {\n this.removeActionButtons();\n this.renderActionButtons();\n this.checkActionButtonStatus();\n }\n }\n };\n Uploader.prototype.preRender = function () {\n this.cloneElement = this.element.cloneNode(true);\n this.localeText = { Browse: 'Browse...', Clear: 'Clear', Upload: 'Upload',\n dropFilesHint: 'Or drop files here', invalidMaxFileSize: 'File size is too large',\n invalidMinFileSize: 'File size is too small', invalidFileType: 'File type is not allowed',\n uploadFailedMessage: 'File failed to upload', uploadSuccessMessage: 'File uploaded successfully',\n removedSuccessMessage: 'File removed successfully', removedFailedMessage: 'Unable to remove file', inProgress: 'Uploading',\n readyToUploadMessage: 'Ready to upload', abort: 'Abort', remove: 'Remove', cancel: 'Cancel', delete: 'Delete file',\n pauseUpload: 'File upload paused', pause: 'Pause', resume: 'Resume', retry: 'Retry',\n fileUploadCancel: 'File upload canceled'\n };\n this.l10n = new L10n('uploader', this.localeText, this.locale);\n this.preLocaleObj = getValue('currentLocale', this.l10n);\n this.checkHTMLAttributes();\n var parentEle = closest(this.element, 'form');\n if (!isNullOrUndefined(parentEle)) {\n for (; parentEle && parentEle !== document.documentElement; parentEle = parentEle.parentElement) {\n if (parentEle.tagName === 'FORM') {\n this.isForm = true;\n this.formElement = parentEle;\n parentEle.setAttribute('enctype', 'multipart/form-data');\n parentEle.setAttribute('encoding', 'multipart/form-data');\n }\n }\n }\n // tslint:disable-next-line\n var ejInstance = getValue('ej2_instances', this.element);\n /* istanbul ignore next */\n if (this.element.tagName === 'EJS-UPLOADER') {\n var inputElement = this.createElement('input', { attrs: { type: 'file' } });\n var index = 0;\n for (index; index < this.element.attributes.length; index++) {\n inputElement.setAttribute(this.element.attributes[index].nodeName, this.element.attributes[index].nodeValue);\n inputElement.innerHTML = this.element.innerHTML;\n }\n if (!inputElement.hasAttribute('name')) {\n inputElement.setAttribute('name', 'UploadFiles');\n }\n this.element.appendChild(inputElement);\n this.element = inputElement;\n setValue('ej2_instances', ejInstance, this.element);\n }\n /* istanbul ignore next */\n if (ejInstance[0].isPureReactComponent) {\n if (!isNullOrUndefined(ejInstance[0].props.name)) {\n this.element.setAttribute('name', ejInstance[0].props.name);\n }\n else if (!isNullOrUndefined(ejInstance[0].props.id) && isNullOrUndefined(ejInstance[0].props.name)) {\n this.element.setAttribute('name', ejInstance[0].props.id);\n }\n else {\n this.element.setAttribute('name', 'UploadFiles');\n }\n }\n if (isNullOrUndefined(this.element.getAttribute('name'))) {\n this.element.setAttribute('name', this.element.getAttribute('id'));\n }\n if (!this.element.hasAttribute('type')) {\n this.element.setAttribute('type', 'file');\n }\n this.updateDirectoryAttributes();\n this.keyConfigs = {\n enter: 'enter'\n };\n if (this.element.hasAttribute('tabindex')) {\n this.tabIndex = this.element.getAttribute('tabindex');\n }\n this.browserName = Browser.info.name;\n };\n Uploader.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * Return the module name of the component.\n */\n Uploader.prototype.getModuleName = function () {\n return 'uploader';\n };\n Uploader.prototype.updateDirectoryAttributes = function () {\n if (this.directoryUpload) {\n this.element.setAttribute('directory', 'true');\n this.element.setAttribute('webkitdirectory', 'true');\n }\n else {\n this.element.removeAttribute('directory');\n this.element.removeAttribute('webkitdirectory');\n }\n };\n /**\n * To Initialize the control rendering\n * @private\n */\n Uploader.prototype.render = function () {\n this.renderBrowseButton();\n this.initializeUpload();\n this.wireEvents();\n this.setMultipleSelection();\n this.setExtensions(this.allowedExtensions);\n this.setRTL();\n this.renderPreLoadFiles();\n this.setControlStatus();\n this.setCSSClass();\n };\n Uploader.prototype.renderBrowseButton = function () {\n this.browseButton = this.createElement('button', { className: 'e-css e-btn', attrs: { 'type': 'button' } });\n this.browseButton.setAttribute('tabindex', this.tabIndex);\n if (typeof (this.buttons.browse) === 'string') {\n this.browseButton.textContent = (this.buttons.browse === 'Browse...') ?\n this.localizedTexts('Browse') : this.buttons.browse;\n this.browseButton.setAttribute('title', this.browseButton.innerText);\n }\n else {\n this.browseButton.appendChild(this.buttons.browse);\n }\n this.element.setAttribute('aria-label', 'Uploader');\n };\n Uploader.prototype.renderActionButtons = function () {\n this.element.setAttribute('tabindex', '-1');\n this.actionButtons = this.createElement('div', { className: ACTION_BUTTONS });\n this.uploadButton = this.createElement('button', { className: UPLOAD_BUTTONS,\n attrs: { 'type': 'button', 'tabindex': this.btnTabIndex } });\n this.clearButton = this.createElement('button', { className: CLEAR_BUTTONS,\n attrs: { 'type': 'button', 'tabindex': this.btnTabIndex } });\n this.actionButtons.appendChild(this.clearButton);\n this.actionButtons.appendChild(this.uploadButton);\n this.renderButtonTemplates();\n this.uploadWrapper.appendChild(this.actionButtons);\n this.browseButton.blur();\n this.uploadButton.focus();\n this.wireActionButtonEvents();\n };\n Uploader.prototype.wireActionButtonEvents = function () {\n EventHandler.add(this.uploadButton, 'click', this.uploadButtonClick, this);\n EventHandler.add(this.clearButton, 'click', this.clearButtonClick, this);\n };\n Uploader.prototype.unwireActionButtonEvents = function () {\n EventHandler.remove(this.uploadButton, 'click', this.uploadButtonClick);\n EventHandler.remove(this.clearButton, 'click', this.clearButtonClick);\n };\n Uploader.prototype.removeActionButtons = function () {\n if (this.actionButtons) {\n this.unwireActionButtonEvents();\n detach(this.actionButtons);\n this.actionButtons = null;\n }\n };\n Uploader.prototype.renderButtonTemplates = function () {\n if (typeof (this.buttons.browse) === 'string') {\n this.browseButton.textContent = (this.buttons.browse === 'Browse...') ?\n this.localizedTexts('Browse') : this.buttons.browse;\n this.browseButton.setAttribute('title', this.browseButton.textContent);\n }\n else {\n this.browseButton.innerHTML = '';\n this.browseButton.appendChild(this.buttons.browse);\n }\n if (this.uploadButton) {\n var uploadText = void 0;\n uploadText = isNullOrUndefined(this.buttons.upload) ? 'Upload' : this.buttons.upload;\n this.buttons.upload = uploadText;\n if (typeof (this.buttons.upload) === 'string') {\n this.uploadButton.textContent = (this.buttons.upload === 'Upload') ?\n this.localizedTexts('Upload') : this.buttons.upload;\n this.uploadButton.setAttribute('title', this.uploadButton.textContent);\n }\n else {\n this.uploadButton.innerHTML = '';\n this.uploadButton.appendChild(this.buttons.upload);\n }\n }\n if (this.clearButton) {\n var clearText = void 0;\n clearText = isNullOrUndefined(this.buttons.clear) ? 'Clear' : this.buttons.clear;\n this.buttons.clear = clearText;\n if (typeof (this.buttons.clear) === 'string') {\n this.clearButton.textContent = (this.buttons.clear === 'Clear') ?\n this.localizedTexts('Clear') : this.buttons.clear;\n this.clearButton.setAttribute('title', this.clearButton.textContent);\n }\n else {\n this.clearButton.innerHTML = '';\n this.clearButton.appendChild(this.buttons.clear);\n }\n }\n };\n Uploader.prototype.initializeUpload = function () {\n this.element.setAttribute('tabindex', '-1');\n var inputWrapper = this.createElement('span', { className: INPUT_WRAPPER });\n this.element.parentElement.insertBefore(inputWrapper, this.element);\n this.dropAreaWrapper = this.createElement('div', { className: DROP_WRAPPER });\n this.element.parentElement.insertBefore(this.dropAreaWrapper, this.element);\n inputWrapper.appendChild(this.element);\n this.dropAreaWrapper.appendChild(this.browseButton);\n this.dropAreaWrapper.appendChild(inputWrapper);\n var fileDropArea = this.createElement('span', { className: DROP_AREA });\n fileDropArea.innerHTML = this.localizedTexts('dropFilesHint');\n this.dropAreaWrapper.appendChild(fileDropArea);\n this.uploadWrapper = this.createElement('div', { className: CONTROL_WRAPPER });\n this.dropAreaWrapper.parentElement.insertBefore(this.uploadWrapper, this.dropAreaWrapper);\n this.uploadWrapper.appendChild(this.dropAreaWrapper);\n this.setDropArea();\n };\n Uploader.prototype.renderPreLoadFiles = function () {\n if (isNullOrUndefined(this.files[0].size)) {\n return;\n }\n var files = [].slice.call(this.files);\n var filesData = [];\n if (!this.multiple) {\n this.clearData();\n files = [files[0]];\n }\n for (var _i = 0, files_1 = files; _i < files_1.length; _i++) {\n var data = files_1[_i];\n var fileData = {\n name: data.name + '.' + data.type.split('.')[data.type.split('.').length - 1],\n rawFile: '',\n size: data.size,\n status: this.localizedTexts('uploadSuccessMessage'),\n type: data.type,\n validationMessages: { minSize: '', maxSize: '' },\n statusCode: '2'\n };\n filesData.push(fileData);\n this.filesData.push(fileData);\n }\n this.createFileList(filesData);\n if (!this.autoUpload && this.listParent && !this.actionButtons && (!this.isForm || this.allowUpload()) && this.showFileList) {\n this.renderActionButtons();\n }\n this.checkActionButtonStatus();\n };\n Uploader.prototype.checkActionButtonStatus = function () {\n if (this.actionButtons) {\n var length_1 = this.uploadWrapper.querySelectorAll('.' + VALIDATION_FAILS).length +\n this.uploadWrapper.querySelectorAll('.e-upload-fails:not(.e-upload-progress)').length +\n this.uploadWrapper.querySelectorAll('span.' + UPLOAD_SUCCESS).length +\n this.uploadWrapper.querySelectorAll('span.' + UPLOAD_INPROGRESS).length;\n if (length_1 > 0 && length_1 === this.uploadWrapper.querySelectorAll('li').length) {\n this.uploadButton.setAttribute('disabled', 'disabled');\n }\n else {\n this.uploadButton.removeAttribute('disabled');\n }\n }\n };\n Uploader.prototype.setDropArea = function () {\n var dropTextArea = this.dropAreaWrapper.querySelector('.e-file-drop');\n if (this.dropArea) {\n this.dropZoneElement = (typeof (this.dropArea) !== 'string') ? this.dropArea :\n document.querySelector(this.dropArea);\n var element = this.element;\n var enableDropText = false;\n while (element.parentNode) {\n element = element.parentNode;\n if (element === this.dropZoneElement) {\n enableDropText = true;\n dropTextArea.textContent = this.localizedTexts('dropFilesHint');\n }\n }\n if (!enableDropText) {\n dropTextArea.textContent = '';\n }\n }\n else {\n this.dropZoneElement = this.uploadWrapper;\n dropTextArea.textContent = this.localizedTexts('dropFilesHint');\n }\n this.bindDropEvents();\n };\n Uploader.prototype.setMultipleSelection = function () {\n if (this.multiple && !this.element.hasAttribute('multiple')) {\n var newAttr = document.createAttribute('multiple');\n newAttr.value = 'multiple';\n this.element.setAttributeNode(newAttr);\n }\n else if (!this.multiple) {\n this.element.removeAttribute('multiple');\n }\n };\n Uploader.prototype.checkAutoUpload = function (fileData) {\n if (this.autoUpload) {\n if (this.sequentialUpload) {\n /* istanbul ignore next */\n this.sequenceUpload(fileData);\n }\n else {\n this.upload(fileData);\n }\n this.removeActionButtons();\n }\n else if (!this.actionButtons) {\n this.renderActionButtons();\n }\n this.checkActionButtonStatus();\n };\n Uploader.prototype.sequenceUpload = function (fileData) {\n if (this.filesData.length - fileData.length === 0 ||\n this.filesData[(this.filesData.length - fileData.length - 1)].statusCode !== '1') {\n ++this.count;\n var isFileListCreated = this.showFileList ? false : true;\n if (typeof this.filesData[this.count] === 'object') {\n this.upload(this.filesData[this.count], isFileListCreated);\n if (this.filesData[this.count].statusCode === '0') {\n this.sequenceUpload(fileData);\n }\n }\n else {\n --this.count;\n }\n }\n };\n Uploader.prototype.setCSSClass = function (oldCSSClass) {\n if (this.cssClass) {\n addClass([this.uploadWrapper], this.cssClass.split(this.cssClass.indexOf(',') > -1 ? ',' : ' '));\n }\n if (oldCSSClass) {\n removeClass([this.uploadWrapper], oldCSSClass.split(' '));\n }\n };\n Uploader.prototype.wireEvents = function () {\n EventHandler.add(this.browseButton, 'click', this.browseButtonClick, this);\n EventHandler.add(this.element, 'change', this.onSelectFiles, this);\n EventHandler.add(document, 'click', this.removeFocus, this);\n this.keyboardModule = new KeyboardEvents(this.uploadWrapper, {\n keyAction: this.keyActionHandler.bind(this),\n keyConfigs: this.keyConfigs,\n eventName: 'keydown',\n });\n if (this.isForm) {\n EventHandler.add(this.formElement, 'reset', this.resetForm, this);\n }\n };\n Uploader.prototype.unWireEvents = function () {\n EventHandler.remove(this.browseButton, 'click', this.browseButtonClick);\n EventHandler.remove(this.element, 'change', this.onSelectFiles);\n EventHandler.remove(document, 'click', this.removeFocus);\n if (this.isForm) {\n EventHandler.remove(this.formElement, 'reset', this.resetForm);\n }\n this.keyboardModule.destroy();\n };\n Uploader.prototype.resetForm = function () {\n this.clearAll();\n };\n Uploader.prototype.keyActionHandler = function (e) {\n var targetElement = e.target;\n switch (e.action) {\n case 'enter':\n if (e.target === this.clearButton) {\n this.clearButtonClick();\n }\n else if (e.target === this.uploadButton) {\n this.uploadButtonClick();\n }\n else if (e.target === this.browseButton) {\n this.browseButtonClick();\n }\n else if (targetElement.classList.contains(PAUSE_UPLOAD)) {\n var metaData = this.getCurrentMetaData(null, e);\n metaData.file.statusCode = '4';\n metaData.file.status = this.localizedTexts('pauseUpload');\n this.abortUpload(metaData, false);\n }\n else if (targetElement.classList.contains(RESUME_UPLOAD)) {\n this.resumeUpload(this.getCurrentMetaData(null, e), e);\n }\n else if (targetElement.classList.contains(RETRY_ICON)) {\n var metaData = this.getCurrentMetaData(null, e);\n if (!isNullOrUndefined(metaData)) {\n metaData.file.statusCode = '1';\n metaData.file.status = this.localizedTexts('readyToUploadMessage');\n this.chunkUpload(metaData.file);\n }\n else {\n var target = e.target.parentElement;\n var fileData = this.filesData[this.fileList.indexOf(target)];\n this.retry(fileData);\n }\n }\n else {\n this.removeFiles(e);\n if (!targetElement.classList.contains(ABORT_ICON)) {\n this.browseButton.focus();\n }\n }\n e.preventDefault();\n e.stopPropagation();\n break;\n }\n };\n Uploader.prototype.getCurrentMetaData = function (fileInfo, e) {\n var fileData;\n var targetMetaData;\n if (isNullOrUndefined(fileInfo)) {\n var target = e.target.parentElement;\n fileData = this.filesData[this.fileList.indexOf(target)];\n }\n else {\n fileData = fileInfo;\n }\n for (var i = 0; i < this.uploadMetaData.length; i++) {\n if (this.uploadMetaData[i].file.name === fileData.name) {\n targetMetaData = this.uploadMetaData[i];\n }\n }\n return targetMetaData;\n };\n Uploader.prototype.removeFocus = function () {\n if (this.uploadWrapper && this.listParent && this.listParent.querySelector('.' + ICON_FOCUSED)) {\n document.activeElement.blur();\n this.listParent.querySelector('.' + ICON_FOCUSED).classList.remove(ICON_FOCUSED);\n }\n };\n Uploader.prototype.browseButtonClick = function () {\n this.element.click();\n };\n Uploader.prototype.uploadButtonClick = function () {\n if (this.sequentialUpload) {\n this.sequenceUpload(this.filesData);\n }\n else {\n this.upload(this.filesData);\n }\n };\n Uploader.prototype.clearButtonClick = function () {\n this.clearAll();\n /* istanbul ignore next */\n if (this.sequentialUpload) {\n this.count = -1;\n }\n this.actionCompleteCount = 0;\n };\n Uploader.prototype.bindDropEvents = function () {\n if (this.dropZoneElement) {\n EventHandler.add(this.dropZoneElement, 'drop', this.dropElement, this);\n EventHandler.add(this.dropZoneElement, 'dragover', this.dragHover, this);\n EventHandler.add(this.dropZoneElement, 'dragleave', this.onDragLeave, this);\n EventHandler.add(this.dropZoneElement, 'paste', this.onPasteFile, this);\n }\n };\n Uploader.prototype.unBindDropEvents = function () {\n if (this.dropZoneElement) {\n EventHandler.remove(this.dropZoneElement, 'drop', this.dropElement);\n EventHandler.remove(this.dropZoneElement, 'dragover', this.dragHover);\n EventHandler.remove(this.dropZoneElement, 'dragleave', this.onDragLeave);\n }\n };\n Uploader.prototype.onDragLeave = function (e) {\n this.dropZoneElement.classList.remove(DRAG_HOVER);\n };\n Uploader.prototype.dragHover = function (e) {\n if (!this.enabled) {\n return;\n }\n this.dropZoneElement.classList.add(DRAG_HOVER);\n e.preventDefault();\n e.stopPropagation();\n };\n /* istanbul ignore next */\n Uploader.prototype.dropElement = function (e) {\n this.dropZoneElement.classList.remove(DRAG_HOVER);\n if (this.browserName === 'chrome') {\n this.element.files = e.dataTransfer.files;\n }\n else {\n this.onSelectFiles(e);\n }\n e.preventDefault();\n e.stopPropagation();\n };\n /* istanbul ignore next */\n Uploader.prototype.onPasteFile = function (event) {\n var item = event.clipboardData.items;\n if (item.length !== 1) {\n return;\n }\n var pasteFile = [].slice.call(item)[0];\n if ((pasteFile.kind === 'file') && pasteFile.type.match('^image/')) {\n this.renderSelectedFiles(event, [pasteFile.getAsFile()], false, true);\n }\n };\n Uploader.prototype.removeFiles = function (args) {\n if (!this.enabled) {\n return;\n }\n var selectedElement = args.target.parentElement;\n var index = this.fileList.indexOf(selectedElement);\n var liElement = this.fileList[index];\n var fileData = this.filesData[index];\n if (isNullOrUndefined(fileData)) {\n return;\n }\n if (args.target.classList.contains(ABORT_ICON)) {\n fileData.statusCode = '5';\n if (!isNullOrUndefined(liElement)) {\n var spinnerTarget = liElement.querySelector('.' + ABORT_ICON);\n createSpinner({ target: spinnerTarget, width: '20px' });\n showSpinner(spinnerTarget);\n }\n if (this.sequentialUpload) {\n /* istanbul ignore next */\n this.uploadSequential();\n }\n if (!(liElement.classList.contains(RESTRICT_RETRY))) {\n this.checkActionComplete(true);\n }\n }\n else {\n this.remove(fileData, false, false, args);\n }\n this.element.value = '';\n this.checkActionButtonStatus();\n };\n Uploader.prototype.removeFilesData = function (file, customTemplate) {\n var index;\n if (customTemplate) {\n if (!this.showFileList) {\n index = this.filesData.indexOf(file);\n this.filesData.splice(index, 1);\n }\n return;\n }\n var selectedElement = this.getLiElement(file);\n if (isNullOrUndefined(selectedElement)) {\n return;\n }\n detach(selectedElement);\n index = this.fileList.indexOf(selectedElement);\n this.fileList.splice(index, 1);\n this.filesData.splice(index, 1);\n if (this.fileList.length === 0 && !isNullOrUndefined(this.listParent)) {\n detach(this.listParent);\n this.listParent = null;\n this.removeActionButtons();\n }\n if (this.sequentialUpload) {\n /* istanbul ignore next */\n if (index <= this.count) {\n --this.count;\n }\n }\n };\n Uploader.prototype.removeUploadedFile = function (file, eventArgs, removeDirectly, custom) {\n var _this = this;\n var selectedFiles = file;\n var name = this.element.getAttribute('name');\n var ajax = new Ajax(this.asyncSettings.removeUrl, 'POST', true, null);\n ajax.emitError = false;\n var formData = new FormData();\n var liElement = this.getLiElement(file);\n ajax.beforeSend = function (e) {\n eventArgs.currentRequest = ajax.httpRequest;\n if (!removeDirectly) {\n _this.trigger('removing', eventArgs);\n }\n /* istanbul ignore next */\n if (eventArgs.cancel) {\n e.cancel = true;\n return;\n }\n if (!isNullOrUndefined(liElement) && (!isNullOrUndefined(liElement.querySelector('.' + DELETE_ICON)) ||\n !isNullOrUndefined(liElement.querySelector('.' + REMOVE_ICON)))) {\n var spinnerTarget = void 0;\n spinnerTarget = liElement.querySelector('.' + DELETE_ICON) ? liElement.querySelector('.' + DELETE_ICON) :\n liElement.querySelector('.' + REMOVE_ICON);\n createSpinner({ target: spinnerTarget, width: '20px' });\n showSpinner(spinnerTarget);\n }\n if (eventArgs.postRawFile && !isNullOrUndefined(selectedFiles.rawFile) && selectedFiles.rawFile !== '') {\n formData.append(name, selectedFiles.rawFile);\n }\n else {\n formData.append(name, selectedFiles.name);\n }\n _this.updateFormData(formData, eventArgs.customFormData);\n };\n ajax.onLoad = function (e) { _this.removeCompleted(e, selectedFiles, custom); return {}; };\n /* istanbul ignore next */\n ajax.onError = function (e) { _this.removeFailed(e, selectedFiles, custom); return {}; };\n ajax.send(formData);\n };\n /* istanbul ignore next */\n Uploader.prototype.updateFormData = function (formData, customData) {\n if (customData.length > 0 && customData[0]) {\n var _loop_1 = function (i) {\n var data = customData[i];\n // tslint:disable-next-line\n var value = Object.keys(data).map(function (e) {\n return data[e];\n });\n formData.append(Object.keys(data)[0], value);\n };\n for (var i = 0; i < customData.length; i++) {\n _loop_1(i);\n }\n }\n };\n Uploader.prototype.removeCompleted = function (e, files, customTemplate) {\n var response = e && e.currentTarget ? this.getResponse(e) : null;\n var args = {\n e: e, response: response, operation: 'remove', file: this.updateStatus(files, this.localizedTexts('removedSuccessMessage'), '2')\n };\n this.trigger('success', args);\n this.removeFilesData(files, customTemplate);\n var index = this.uploadedFilesData.indexOf(files);\n this.uploadedFilesData.splice(index, 1);\n this.trigger('change', { files: this.uploadedFilesData });\n };\n Uploader.prototype.removeFailed = function (e, files, customTemplate) {\n var response = e && e.currentTarget ? this.getResponse(e) : null;\n var args = {\n e: e, response: response, operation: 'remove', file: this.updateStatus(files, this.localizedTexts('removedFailedMessage'), '0')\n };\n if (!customTemplate) {\n var index = this.filesData.indexOf(files);\n var rootElement = this.fileList[index];\n if (rootElement) {\n var statusElement = rootElement.querySelector('.' + STATUS);\n rootElement.classList.remove(UPLOAD_SUCCESS);\n statusElement.classList.remove(UPLOAD_SUCCESS);\n rootElement.classList.add(UPLOAD_FAILED);\n statusElement.classList.add(UPLOAD_FAILED);\n }\n this.checkActionButtonStatus();\n }\n this.trigger('failure', args);\n var liElement = this.getLiElement(files);\n /* istanbul ignore next */\n if (!isNullOrUndefined(liElement) && !isNullOrUndefined(liElement.querySelector('.' + DELETE_ICON))) {\n var spinnerTarget = liElement.querySelector('.' + DELETE_ICON);\n hideSpinner(spinnerTarget);\n detach(liElement.querySelector('.e-spinner-pane'));\n }\n };\n /* istanbul ignore next */\n Uploader.prototype.getFilesFromFolder = function (event) {\n this.filesEntries = [];\n var items;\n items = this.multiple ? event.dataTransfer.items : [event.dataTransfer.items[0]];\n var validDirectoryUpload = this.checkDirectoryUpload(items);\n if (!validDirectoryUpload) {\n return;\n }\n var _loop_2 = function (i) {\n // tslint:disable-next-line\n var item = items[i].webkitGetAsEntry();\n if (item.isFile) {\n var files_2 = [];\n // tslint:disable-next-line\n (item).file(function (fileObj) {\n var path = item.fullPath;\n files_2.push({ 'path': path, 'file': fileObj });\n });\n this_1.renderSelectedFiles(event, files_2, true);\n }\n else if (item.isDirectory) {\n this_1.traverseFileTree(item, event);\n }\n };\n var this_1 = this;\n for (var i = 0; i < items.length; i++) {\n _loop_2(i);\n }\n };\n /* istanbul ignore next */\n Uploader.prototype.checkDirectoryUpload = function (items) {\n for (var i = 0; i < items.length; i++) {\n // tslint:disable-next-line\n var item = items[i].webkitGetAsEntry();\n if (item.isDirectory) {\n return true;\n }\n }\n return false;\n };\n // tslint:disable\n /* istanbul ignore next */\n Uploader.prototype.traverseFileTree = function (item, event) {\n var _this = this;\n if (typeof (item) === 'boolean') {\n var files_3 = [];\n var _loop_3 = function (i) {\n this_2.filesEntries[i].file(function (fileObj) {\n var path = _this.filesEntries[i].fullPath;\n files_3.push({ 'path': path, 'file': fileObj });\n });\n };\n var this_2 = this;\n for (var i = 0; i < this.filesEntries.length; i++) {\n _loop_3(i);\n }\n this.renderSelectedFiles(event, files_3, true);\n }\n else if (item.isFile) {\n this.filesEntries.push(item);\n }\n else if (item.isDirectory) {\n // tslint:disable-next-line\n var directoryReader = item.createReader();\n // tslint:disable-next-line\n directoryReader.readEntries(function (entries) {\n for (var i = 0; i < entries.length; i++) {\n _this.traverseFileTree(entries[i]);\n // tslint:disable-next-line\n }\n ;\n _this.traverseFileTree(true);\n _this.filesEntries = [];\n });\n }\n };\n // tslint:enable\n Uploader.prototype.onSelectFiles = function (args) {\n if (!this.enabled) {\n return;\n }\n var targetFiles;\n /* istanbul ignore next */\n if (args.type === 'drop') {\n if (this.directoryUpload) {\n this.getFilesFromFolder(args);\n }\n else {\n var files = args.dataTransfer.files;\n targetFiles = this.multiple ? this.sortFileList(files) : [files[0]];\n this.renderSelectedFiles(args, targetFiles);\n }\n }\n else {\n targetFiles = [].slice.call(args.target.files);\n this.renderSelectedFiles(args, targetFiles);\n }\n };\n Uploader.prototype.renderSelectedFiles = function (args, \n // tslint:disable-next-line\n targetFiles, directory, paste) {\n var eventArgs = {\n event: args,\n cancel: false,\n filesData: [],\n isModified: false,\n modifiedFilesData: [],\n progressInterval: '',\n isCanceled: false\n };\n /* istanbul ignore next */\n if (targetFiles.length < 1) {\n eventArgs.isCanceled = true;\n this.trigger('selected', eventArgs);\n return;\n }\n this.flag = true;\n var fileData = [];\n if (!this.multiple) {\n this.clearData(true);\n targetFiles = [targetFiles[0]];\n }\n for (var i = 0; i < targetFiles.length; i++) {\n var file = directory ? targetFiles[i].file : targetFiles[i];\n var fileName = directory ? targetFiles[i].path.substring(1, targetFiles[i].path.length) : paste ?\n getUniqueID(file.name.substring(0, file.name.lastIndexOf('.'))) + '.' + this.getFileType(file.name) :\n this.directoryUpload ? targetFiles[i].webkitRelativePath : file.name;\n var fileDetails = {\n name: fileName,\n rawFile: file,\n size: file.size,\n status: this.localizedTexts('readyToUploadMessage'),\n type: this.getFileType(file.name),\n validationMessages: this.validatedFileSize(file.size),\n statusCode: '1'\n };\n /* istanbul ignore next */\n if (paste) {\n fileDetails.fileSource = 'paste';\n }\n fileDetails.status = fileDetails.validationMessages.minSize !== '' ? this.localizedTexts('invalidMinFileSize') :\n fileDetails.validationMessages.maxSize !== '' ? this.localizedTexts('invalidMaxFileSize') : fileDetails.status;\n if (fileDetails.validationMessages.minSize !== '' || fileDetails.validationMessages.maxSize !== '') {\n fileDetails.statusCode = '0';\n this.checkActionComplete(true);\n }\n fileData.push(fileDetails);\n }\n eventArgs.filesData = fileData;\n if (this.allowedExtensions.indexOf('*') > -1) {\n this.allTypes = true;\n }\n if (!this.allTypes) {\n fileData = this.checkExtension(fileData);\n }\n this.trigger('selected', eventArgs);\n this.selectedFiles = fileData;\n if (eventArgs.cancel) {\n return;\n }\n this.btnTabIndex = this.disableKeyboardNavigation ? '-1' : '0';\n if (this.showFileList) {\n if (eventArgs.isModified && eventArgs.modifiedFilesData.length > 0) {\n var dataFiles = this.allTypes ? eventArgs.modifiedFilesData :\n this.checkExtension(eventArgs.modifiedFilesData);\n this.updateSortedFileList(dataFiles);\n this.filesData = dataFiles;\n if (!this.isForm || this.allowUpload()) {\n this.checkAutoUpload(dataFiles);\n }\n }\n else {\n this.createFileList(fileData);\n this.filesData = this.filesData.concat(fileData);\n if (!this.isForm || this.allowUpload()) {\n this.checkAutoUpload(fileData);\n }\n }\n if (!isNullOrUndefined(eventArgs.progressInterval) && eventArgs.progressInterval !== '') {\n this.progressInterval = eventArgs.progressInterval;\n }\n }\n else {\n this.filesData = this.filesData.concat(fileData);\n if (this.autoUpload) {\n this.upload(this.filesData, true);\n }\n }\n this.raiseActionComplete();\n };\n Uploader.prototype.allowUpload = function () {\n var allowFormUpload = false;\n if (this.isForm && (!isNullOrUndefined(this.asyncSettings.saveUrl) && this.asyncSettings.saveUrl !== '')) {\n allowFormUpload = true;\n }\n return allowFormUpload;\n };\n Uploader.prototype.clearData = function (singleUpload) {\n if (!isNullOrUndefined(this.listParent)) {\n detach(this.listParent);\n this.listParent = null;\n }\n if (this.browserName !== 'msie' && !singleUpload) {\n this.element.value = '';\n }\n this.fileList = [];\n this.filesData = [];\n this.removeActionButtons();\n };\n Uploader.prototype.updateSortedFileList = function (filesData) {\n var previousListClone = this.createElement('div', { id: 'clonewrapper' });\n var added = -1;\n var removedList;\n if (this.listParent) {\n for (var i = 0; i < this.listParent.querySelectorAll('li').length; i++) {\n var liElement = this.listParent.querySelectorAll('li')[i];\n previousListClone.appendChild(liElement.cloneNode(true));\n }\n removedList = this.listParent.querySelectorAll('li');\n for (var _i = 0, removedList_1 = removedList; _i < removedList_1.length; _i++) {\n var item = removedList_1[_i];\n detach(item);\n }\n this.removeActionButtons();\n var oldList = [].slice.call(previousListClone.childNodes);\n detach(this.listParent);\n this.listParent = null;\n this.fileList = [];\n this.createParentUL();\n for (var index = 0; index < filesData.length; index++) {\n for (var j = 0; j < this.filesData.length; j++) {\n if (this.filesData[j].name === filesData[index].name) {\n this.listParent.appendChild(oldList[j]);\n EventHandler.add(oldList[j].querySelector('.e-icons'), 'click', this.removeFiles, this);\n this.fileList.push(oldList[j]);\n added = index;\n }\n }\n if (added !== index) {\n this.createFileList([filesData[index]]);\n }\n }\n }\n else {\n this.createFileList(filesData);\n }\n };\n Uploader.prototype.isBlank = function (str) {\n return (!str || /^\\s*$/.test(str));\n };\n Uploader.prototype.checkExtension = function (files) {\n var dropFiles = files;\n if (!this.isBlank(this.allowedExtensions)) {\n var allowedExtensions = [];\n var extensions = this.allowedExtensions.split(',');\n for (var _i = 0, extensions_1 = extensions; _i < extensions_1.length; _i++) {\n var extension = extensions_1[_i];\n allowedExtensions.push(extension.trim().toLocaleLowerCase());\n }\n for (var i = 0; i < files.length; i++) {\n if (allowedExtensions.indexOf(('.' + files[i].type).toLocaleLowerCase()) === -1) {\n files[i].status = this.localizedTexts('invalidFileType');\n files[i].statusCode = '0';\n }\n }\n }\n return dropFiles;\n };\n Uploader.prototype.validatedFileSize = function (fileSize) {\n var minSizeError = '';\n var maxSizeError = '';\n if (fileSize < this.minFileSize) {\n minSizeError = this.localizedTexts('invalidMinFileSize');\n }\n else if (fileSize > this.maxFileSize) {\n maxSizeError = this.localizedTexts('invalidMaxFileSize');\n }\n else {\n minSizeError = '';\n maxSizeError = '';\n }\n var errorMessage = { minSize: minSizeError, maxSize: maxSizeError };\n return errorMessage;\n };\n Uploader.prototype.isPreLoadFile = function (fileData) {\n var isPreload = false;\n for (var i = 0; i < this.files.length; i++) {\n if (this.files[i].name === fileData.name.slice(0, fileData.name.lastIndexOf('.')) && this.files[i].type === fileData.type) {\n isPreload = true;\n }\n }\n return isPreload;\n };\n Uploader.prototype.createCustomfileList = function (fileData) {\n this.createParentUL();\n for (var _i = 0, fileData_1 = fileData; _i < fileData_1.length; _i++) {\n var listItem = fileData_1[_i];\n var liElement = this.createElement('li', { className: FILE, attrs: { 'data-file-name': listItem.name } });\n this.uploadTemplateFn = this.templateComplier(this.template);\n var fromElements = [].slice.call(this.uploadTemplateFn(listItem));\n var index = fileData.indexOf(listItem);\n append(fromElements, liElement);\n var eventArgs = {\n element: liElement,\n fileInfo: listItem,\n index: index,\n isPreload: this.isPreLoadFile(listItem)\n };\n var eventsArgs = {\n element: liElement,\n fileInfo: listItem,\n index: index,\n isPreload: this.isPreLoadFile(listItem)\n };\n this.trigger('rendering', eventArgs);\n this.trigger('fileListRendering', eventsArgs);\n this.listParent.appendChild(liElement);\n this.fileList.push(liElement);\n }\n };\n Uploader.prototype.createParentUL = function () {\n if (isNullOrUndefined(this.listParent)) {\n this.listParent = this.createElement('ul', { className: LIST_PARENT });\n this.uploadWrapper.appendChild(this.listParent);\n }\n };\n Uploader.prototype.createFileList = function (fileData) {\n this.createParentUL();\n if (this.template !== '' && !isNullOrUndefined(this.template)) {\n this.createCustomfileList(fileData);\n }\n else {\n for (var _i = 0, fileData_2 = fileData; _i < fileData_2.length; _i++) {\n var listItem = fileData_2[_i];\n var liElement = this.createElement('li', { className: FILE, attrs: { 'data-file-name': listItem.name } });\n var textContainer = this.createElement('span', { className: TEXT_CONTAINER });\n var textElement = this.createElement('span', { className: FILE_NAME, attrs: { 'title': listItem.name } });\n textElement.innerHTML = this.getFileNameOnly(listItem.name);\n var fileExtension = this.createElement('span', { className: FILE_TYPE });\n fileExtension.innerHTML = '.' + this.getFileType(listItem.name);\n if (!this.enableRtl) {\n textContainer.appendChild(textElement);\n textContainer.appendChild(fileExtension);\n }\n else {\n var rtlContainer = this.createElement('span', { className: RTL_CONTAINER });\n rtlContainer.appendChild(fileExtension);\n rtlContainer.appendChild(textElement);\n textContainer.appendChild(rtlContainer);\n }\n var fileSize = this.createElement('span', { className: FILE_SIZE });\n fileSize.innerHTML = this.bytesToSize(listItem.size);\n textContainer.appendChild(fileSize);\n var statusElement = this.createElement('span', { className: STATUS });\n textContainer.appendChild(statusElement);\n statusElement.innerHTML = listItem.status;\n liElement.appendChild(textContainer);\n var iconElement = this.createElement('span', { className: ' e-icons', attrs: { 'tabindex': this.btnTabIndex } });\n /* istanbul ignore next */\n if (this.browserName === 'msie') {\n iconElement.classList.add('e-msie');\n }\n iconElement.setAttribute('title', this.localizedTexts('remove'));\n liElement.appendChild(iconElement);\n EventHandler.add(iconElement, 'click', this.removeFiles, this);\n if (listItem.statusCode === '2') {\n statusElement.classList.add(UPLOAD_SUCCESS);\n iconElement.classList.add(DELETE_ICON);\n iconElement.setAttribute('title', this.localizedTexts('delete'));\n }\n else if (listItem.statusCode !== '1') {\n statusElement.classList.remove(UPLOAD_SUCCESS);\n statusElement.classList.add(VALIDATION_FAILS);\n }\n if (this.autoUpload && listItem.statusCode === '1' && this.asyncSettings.saveUrl !== '') {\n statusElement.innerHTML = '';\n }\n if (!iconElement.classList.contains(DELETE_ICON)) {\n iconElement.classList.add(REMOVE_ICON);\n }\n var index = fileData.indexOf(listItem);\n var eventArgs = {\n element: liElement,\n fileInfo: listItem,\n index: index,\n isPreload: this.isPreLoadFile(listItem)\n };\n var eventsArgs = {\n element: liElement,\n fileInfo: listItem,\n index: index,\n isPreload: this.isPreLoadFile(listItem)\n };\n this.trigger('rendering', eventArgs);\n this.trigger('fileListRendering', eventsArgs);\n this.listParent.appendChild(liElement);\n this.fileList.push(liElement);\n this.truncateName(textElement);\n }\n }\n };\n Uploader.prototype.getSlicedName = function (nameElement) {\n var text;\n text = nameElement.textContent;\n nameElement.dataset.tail = text.slice(text.length - 10);\n };\n Uploader.prototype.truncateName = function (name) {\n var nameElement = name;\n if (this.browserName !== 'edge' && nameElement.offsetWidth < nameElement.scrollWidth) {\n this.getSlicedName(nameElement);\n /* istanbul ignore next */\n }\n else if (nameElement.offsetWidth + 1 < nameElement.scrollWidth) {\n this.getSlicedName(nameElement);\n }\n };\n Uploader.prototype.getFileType = function (name) {\n var extension;\n var index = name.lastIndexOf('.');\n if (index >= 0) {\n extension = name.substring(index + 1);\n }\n return extension ? extension : '';\n };\n Uploader.prototype.getFileNameOnly = function (name) {\n var type = this.getFileType(name);\n var names = name.split('.' + type);\n return type = names[0];\n };\n Uploader.prototype.setInitialAttributes = function () {\n if (this.initialAttr.accept) {\n this.element.setAttribute('accept', this.initialAttr.accept);\n }\n if (this.initialAttr.disabled) {\n this.element.setAttribute('disabled', 'disabled');\n }\n if (this.initialAttr.multiple) {\n var newAttr = document.createAttribute('multiple');\n this.element.setAttributeNode(newAttr);\n }\n };\n Uploader.prototype.filterfileList = function (files) {\n var filterFiles = [];\n var li;\n for (var i = 0; i < files.length; i++) {\n li = this.getLiElement(files[i]);\n if (!li.classList.contains(UPLOAD_SUCCESS)) {\n filterFiles.push(files[i]);\n }\n }\n return filterFiles;\n };\n Uploader.prototype.updateStatus = function (files, status, statusCode, updateLiStatus) {\n if (updateLiStatus === void 0) { updateLiStatus = true; }\n if (!(status === '' || isNullOrUndefined(status)) && !(statusCode === '' || isNullOrUndefined(statusCode))) {\n files.status = status;\n files.statusCode = statusCode;\n }\n if (updateLiStatus) {\n var li = this.getLiElement(files);\n if (!isNullOrUndefined(li)) {\n if (!isNullOrUndefined(li.querySelector('.' + STATUS)) && !((status === '' || isNullOrUndefined(status)))) {\n li.querySelector('.' + STATUS).textContent = status;\n }\n }\n }\n return files;\n };\n Uploader.prototype.getLiElement = function (files) {\n var index;\n for (var i = 0; i < this.filesData.length; i++) {\n if (this.filesData[i].name === files.name) {\n index = i;\n }\n }\n return this.fileList[index];\n };\n Uploader.prototype.createProgressBar = function (liElement) {\n var progressbarWrapper = this.createElement('span', { className: PROGRESS_WRAPPER });\n var progressBar = this.createElement('progressbar', { className: PROGRESSBAR, attrs: { value: '0', max: '100' } });\n var progressbarInnerWrapper = this.createElement('span', { className: PROGRESS_INNER_WRAPPER });\n progressBar.setAttribute('style', 'width: 0%');\n var progressbarText = this.createElement('span', { className: PROGRESSBAR_TEXT });\n progressbarText.textContent = '0%';\n progressbarInnerWrapper.appendChild(progressBar);\n progressbarWrapper.appendChild(progressbarInnerWrapper);\n progressbarWrapper.appendChild(progressbarText);\n liElement.querySelector('.' + TEXT_CONTAINER).appendChild(progressbarWrapper);\n };\n /* istanbul ignore next */\n Uploader.prototype.updateProgressbar = function (e, li) {\n if (!isNaN(Math.round((e.loaded / e.total) * 100)) && !isNullOrUndefined(li.querySelector('.' + PROGRESSBAR))) {\n if (!isNullOrUndefined(this.progressInterval) && this.progressInterval !== '') {\n var value = (Math.round((e.loaded / e.total) * 100)) % parseInt(this.progressInterval, 10);\n if (value === 0 || value === 100) {\n this.changeProgressValue(li, Math.round((e.loaded / e.total) * 100).toString() + '%');\n }\n }\n else {\n this.changeProgressValue(li, Math.round((e.loaded / e.total) * 100).toString() + '%');\n }\n }\n };\n Uploader.prototype.changeProgressValue = function (li, progressValue) {\n li.querySelector('.' + PROGRESSBAR).setAttribute('style', 'width:' + progressValue);\n li.querySelector('.' + PROGRESSBAR_TEXT).textContent = progressValue;\n };\n Uploader.prototype.uploadInProgress = function (e, files, customUI, request) {\n var li = this.getLiElement(files);\n if (isNullOrUndefined(li) && (!customUI)) {\n return;\n }\n if (!isNullOrUndefined(li)) {\n /* istanbul ignore next */\n if (files.statusCode === '5') {\n this.cancelUploadingFile(files, e, request, li);\n }\n if (!(li.querySelectorAll('.' + PROGRESS_WRAPPER).length > 0) && li.querySelector('.' + STATUS)) {\n li.querySelector('.' + STATUS).classList.add(UPLOAD_INPROGRESS);\n this.createProgressBar(li);\n this.updateProgressBarClasses(li, UPLOAD_INPROGRESS);\n li.querySelector('.' + STATUS).classList.remove(UPLOAD_FAILED);\n }\n this.updateProgressbar(e, li);\n var iconEle = li.querySelector('.' + REMOVE_ICON);\n if (!isNullOrUndefined(iconEle)) {\n iconEle.classList.add(ABORT_ICON, UPLOAD_INPROGRESS);\n iconEle.setAttribute('title', this.localizedTexts('abort'));\n iconEle.classList.remove(REMOVE_ICON);\n }\n }\n else {\n this.cancelUploadingFile(files, e, request);\n }\n var args = { e: e, operation: 'upload', file: this.updateStatus(files, this.localizedTexts('inProgress'), '3') };\n this.trigger('progress', args);\n };\n /* istanbul ignore next */\n Uploader.prototype.cancelUploadingFile = function (files, e, request, li) {\n var _this = this;\n if (files.statusCode === '5') {\n var eventArgs = {\n event: e,\n fileData: files,\n cancel: false\n };\n this.trigger('canceling', eventArgs);\n if (eventArgs.cancel) {\n files.statusCode = '3';\n if (!isNullOrUndefined(li)) {\n var spinnerTarget = li.querySelector('.' + ABORT_ICON);\n if (!isNullOrUndefined(spinnerTarget)) {\n hideSpinner(spinnerTarget);\n detach(li.querySelector('.e-spinner-pane'));\n }\n }\n return;\n }\n request.emitError = false;\n request.httpRequest.abort();\n var formData = new FormData();\n if (files.statusCode === '5') {\n var name_1 = this.element.getAttribute('name');\n formData.append(name_1, files.name);\n formData.append('cancel-uploading', files.name);\n var ajax = new Ajax(this.asyncSettings.removeUrl, 'POST', true, null);\n ajax.emitError = false;\n ajax.onLoad = function (e) { _this.removecanceledFile(e, files); return {}; };\n ajax.send(formData);\n }\n }\n };\n Uploader.prototype.removecanceledFile = function (e, file) {\n var liElement = this.getLiElement(file);\n if (liElement.querySelector('.' + RETRY_ICON) || isNullOrUndefined(liElement.querySelector('.' + ABORT_ICON))) {\n return;\n }\n this.updateStatus(file, this.localizedTexts('fileUploadCancel'), '5');\n this.renderFailureState(e, file, liElement);\n var spinnerTarget = liElement.querySelector('.' + REMOVE_ICON);\n if (!isNullOrUndefined(liElement)) {\n hideSpinner(spinnerTarget);\n detach(liElement.querySelector('.e-spinner-pane'));\n }\n var requestResponse = e && e.currentTarget ? this.getResponse(e) : null;\n var args = { event: e, response: requestResponse, operation: 'cancel', file: file };\n this.trigger('success', args);\n };\n Uploader.prototype.renderFailureState = function (e, file, liElement) {\n var _this = this;\n this.updateProgressBarClasses(liElement, UPLOAD_FAILED);\n this.removeProgressbar(liElement, 'failure');\n if (!isNullOrUndefined(liElement.querySelector('.e-file-status'))) {\n liElement.querySelector('.e-file-status').classList.add(UPLOAD_FAILED);\n }\n var deleteIcon = liElement.querySelector('.' + ABORT_ICON);\n if (isNullOrUndefined(deleteIcon)) {\n return;\n }\n deleteIcon.classList.remove(ABORT_ICON, UPLOAD_INPROGRESS);\n deleteIcon.classList.add(REMOVE_ICON);\n deleteIcon.setAttribute('title', this.localizedTexts('remove'));\n this.pauseButton = this.createElement('span', { className: 'e-icons e-file-reload-btn', attrs: { 'tabindex': this.btnTabIndex } });\n liElement.insertBefore(this.pauseButton, deleteIcon);\n this.pauseButton.setAttribute('title', this.localizedTexts('retry'));\n var retryElement = liElement.querySelector('.' + RETRY_ICON);\n /* istanbul ignore next */\n retryElement.addEventListener('click', function (e) { _this.reloadcanceledFile(e, file, liElement, false); }, false);\n };\n Uploader.prototype.reloadcanceledFile = function (e, file, liElement, custom) {\n file.statusCode = '1';\n file.status = this.localizedTexts('readyToUploadMessage');\n if (!custom) {\n liElement.querySelector('.' + STATUS).classList.remove(UPLOAD_FAILED);\n if (!isNullOrUndefined(liElement.querySelector('.' + RETRY_ICON))) {\n detach(liElement.querySelector('.' + RETRY_ICON));\n }\n this.pauseButton = null;\n }\n /* istanbul ignore next */\n liElement.classList.add(RESTRICT_RETRY);\n this.upload([file]);\n };\n /* istanbul ignore next */\n Uploader.prototype.uploadComplete = function (e, file, customUI) {\n var status = e.target;\n if (status.readyState === 4 && status.status >= 200 && status.status <= 299) {\n var li = this.getLiElement(file);\n if (isNullOrUndefined(li) && (!customUI || isNullOrUndefined(customUI))) {\n return;\n }\n if (!isNullOrUndefined(li)) {\n this.updateProgressBarClasses(li, UPLOAD_SUCCESS);\n this.removeProgressbar(li, 'success');\n var iconEle = li.querySelector('.' + ABORT_ICON);\n if (!isNullOrUndefined(iconEle)) {\n iconEle.classList.add(DELETE_ICON);\n iconEle.setAttribute('title', this.localizedTexts('delete'));\n iconEle.classList.remove(ABORT_ICON);\n iconEle.classList.remove(UPLOAD_INPROGRESS);\n }\n }\n this.raiseSuccessEvent(e, file);\n }\n else {\n this.uploadFailed(e, file);\n }\n };\n Uploader.prototype.getResponse = function (e) {\n // tslint:disable-next-line\n var target = e.currentTarget;\n var response = {\n readyState: target.readyState,\n statusCode: target.status,\n statusText: target.statusText,\n headers: target.getAllResponseHeaders(),\n withCredentials: target.withCredentials\n };\n return response;\n };\n Uploader.prototype.raiseSuccessEvent = function (e, file) {\n var response = e && e.currentTarget ? this.getResponse(e) : null;\n var statusMessage = this.localizedTexts('uploadSuccessMessage');\n var args = {\n e: e, response: response, operation: 'upload', file: this.updateStatus(file, statusMessage, '2', false), statusText: statusMessage\n };\n this.trigger('success', args);\n // tslint:disable-next-line\n this.updateStatus(file, args.statusText, '2');\n this.uploadedFilesData.push(file);\n this.trigger('change', { file: this.uploadedFilesData });\n this.checkActionButtonStatus();\n if (this.fileList.length > 0) {\n if ((!(this.getLiElement(file)).classList.contains(RESTRICT_RETRY))) {\n this.uploadSequential();\n this.checkActionComplete(true);\n }\n else {\n /* istanbul ignore next */\n (this.getLiElement(file)).classList.remove(RESTRICT_RETRY);\n }\n }\n };\n Uploader.prototype.uploadFailed = function (e, file) {\n var li = this.getLiElement(file);\n var response = e && e.currentTarget ? this.getResponse(e) : null;\n var statusMessage = this.localizedTexts('uploadFailedMessage');\n var args = {\n e: e, response: response, operation: 'upload', file: this.updateStatus(file, statusMessage, '0', false), statusText: statusMessage\n };\n if (!isNullOrUndefined(li)) {\n this.renderFailureState(e, file, li);\n }\n this.trigger('failure', args);\n // tslint:disable-next-line\n this.updateStatus(file, args.statusText, '0');\n this.checkActionButtonStatus();\n this.uploadSequential();\n this.checkActionComplete(true);\n };\n Uploader.prototype.uploadSequential = function () {\n if (this.sequentialUpload) {\n if (this.autoUpload) {\n /* istanbul ignore next */\n this.checkAutoUpload(this.filesData);\n }\n else {\n this.uploadButtonClick();\n }\n }\n };\n Uploader.prototype.checkActionComplete = function (increment) {\n increment ? ++this.actionCompleteCount : --this.actionCompleteCount;\n this.raiseActionComplete();\n };\n Uploader.prototype.raiseActionComplete = function () {\n if ((this.filesData.length === this.actionCompleteCount) && this.flag) {\n this.flag = false;\n var eventArgs = {\n fileData: []\n };\n eventArgs.fileData = this.getSelectedFileStatus(this.selectedFiles);\n this.trigger('actionComplete', eventArgs);\n }\n };\n Uploader.prototype.getSelectedFileStatus = function (selectedFiles) {\n var matchFiles = [];\n var matchFilesIndex = 0;\n for (var selectFileIndex = 0; selectFileIndex < selectedFiles.length; selectFileIndex++) {\n var selectedFileData = selectedFiles[selectFileIndex];\n for (var fileDataIndex = 0; fileDataIndex < this.filesData.length; fileDataIndex++) {\n if (this.filesData[fileDataIndex].name === selectedFileData.name) {\n matchFiles[matchFilesIndex] = this.filesData[fileDataIndex];\n ++matchFilesIndex;\n }\n }\n }\n return matchFiles;\n };\n Uploader.prototype.updateProgressBarClasses = function (li, className) {\n var progressBar = li.querySelector('.' + PROGRESSBAR);\n if (!isNullOrUndefined(progressBar)) {\n progressBar.classList.add(className);\n }\n };\n Uploader.prototype.removeProgressbar = function (li, callType) {\n var _this = this;\n if (!isNullOrUndefined(li.querySelector('.' + PROGRESS_WRAPPER))) {\n this.progressAnimation = new Animation({ duration: 1250 });\n this.progressAnimation.animate(li.querySelector('.' + PROGRESS_WRAPPER), { name: 'FadeOut' });\n this.progressAnimation.animate(li.querySelector('.' + PROGRESSBAR_TEXT), { name: 'FadeOut' });\n setTimeout(function () { _this.animateProgressBar(li, callType); }, 750);\n }\n };\n /* istanbul ignore next */\n Uploader.prototype.animateProgressBar = function (li, callType) {\n if (callType === 'success') {\n li.classList.add(UPLOAD_SUCCESS);\n if (!isNullOrUndefined(li.querySelector('.' + STATUS))) {\n li.querySelector('.' + STATUS).classList.remove(UPLOAD_INPROGRESS);\n this.progressAnimation.animate(li.querySelector('.' + STATUS), { name: 'FadeIn' });\n li.querySelector('.' + STATUS).classList.add(UPLOAD_SUCCESS);\n }\n }\n else {\n if (!isNullOrUndefined(li.querySelector('.' + STATUS))) {\n li.querySelector('.' + STATUS).classList.remove(UPLOAD_INPROGRESS);\n this.progressAnimation.animate(li.querySelector('.' + STATUS), { name: 'FadeIn' });\n li.querySelector('.' + STATUS).classList.add(UPLOAD_FAILED);\n }\n }\n if (li.querySelector('.' + PROGRESS_WRAPPER)) {\n detach(li.querySelector('.' + PROGRESS_WRAPPER));\n }\n };\n Uploader.prototype.setExtensions = function (extensions) {\n if (extensions !== '' && !isNullOrUndefined(extensions)) {\n this.element.setAttribute('accept', extensions);\n }\n else {\n this.element.removeAttribute('accept');\n }\n };\n Uploader.prototype.templateComplier = function (uploadTemplate) {\n if (uploadTemplate) {\n var exception = void 0;\n try {\n if (document.querySelectorAll(uploadTemplate).length) {\n return compile(document.querySelector(uploadTemplate).innerHTML.trim());\n }\n }\n catch (exception) {\n return compile(uploadTemplate);\n }\n }\n return undefined;\n };\n Uploader.prototype.setRTL = function () {\n this.enableRtl ? addClass([this.uploadWrapper], RTL) : removeClass([this.uploadWrapper], RTL);\n };\n Uploader.prototype.localizedTexts = function (localeText) {\n this.l10n.setLocale(this.locale);\n return this.l10n.getConstant(localeText);\n };\n Uploader.prototype.setControlStatus = function () {\n if (!this.enabled) {\n this.uploadWrapper.classList.add(DISABLED);\n this.element.setAttribute('disabled', 'disabled');\n this.browseButton.setAttribute('disabled', 'disabled');\n if (!isNullOrUndefined(this.clearButton)) {\n this.clearButton.setAttribute('disabled', 'disabled');\n }\n if (!isNullOrUndefined(this.uploadButton)) {\n this.uploadButton.setAttribute('disabled', 'disabled');\n }\n }\n else {\n if (this.uploadWrapper.classList.contains(DISABLED)) {\n this.uploadWrapper.classList.remove(DISABLED);\n }\n if (!isNullOrUndefined(this.browseButton) && this.element.hasAttribute('disabled')) {\n this.element.removeAttribute('disabled');\n this.browseButton.removeAttribute('disabled');\n }\n if (!isNullOrUndefined(this.clearButton) && this.clearButton.hasAttribute('disabled')) {\n this.clearButton.removeAttribute('disabled');\n }\n if (!isNullOrUndefined(this.uploadButton) && this.uploadButton.hasAttribute('disabled')) {\n this.uploadButton.hasAttribute('disabled');\n }\n }\n };\n Uploader.prototype.checkHTMLAttributes = function () {\n if (this.element.hasAttribute('accept')) {\n this.allowedExtensions = this.element.getAttribute('accept');\n this.initialAttr.accept = this.allowedExtensions;\n }\n if (this.element.hasAttribute('multiple')) {\n this.multiple = true;\n this.initialAttr.multiple = true;\n }\n if (this.element.hasAttribute('disabled')) {\n this.enabled = false;\n this.initialAttr.disabled = true;\n }\n };\n Uploader.prototype.chunkUpload = function (file, custom) {\n var start = 0;\n var end = Math.min(this.asyncSettings.chunkSize, file.size);\n var index = 0;\n var blob = file.rawFile.slice(start, end);\n var metaData = { chunkIndex: index, blob: blob, file: file, start: start, end: end, retryCount: 0, request: null };\n this.sendRequest(file, metaData, custom);\n };\n Uploader.prototype.sendRequest = function (file, metaData, custom) {\n var _this = this;\n var formData = new FormData();\n var blob = file.rawFile.slice(metaData.start, metaData.end);\n formData.append('chunkFile', blob, file.name);\n formData.append('chunk-index', metaData.chunkIndex.toString());\n formData.append('chunkIndex', metaData.chunkIndex.toString());\n var totalChunk = Math.max(Math.ceil(file.size / this.asyncSettings.chunkSize), 1);\n formData.append('total-chunk', totalChunk.toString());\n formData.append('totalChunk', totalChunk.toString());\n var ajax = new Ajax({ url: this.asyncSettings.saveUrl, type: 'POST', async: true, contentType: null });\n ajax.emitError = false;\n ajax.onLoad = function (e) { _this.chunkUploadComplete(e, metaData, custom); return {}; };\n ajax.onUploadProgress = function (e) {\n _this.chunkUploadInProgress(e, metaData, custom);\n return {};\n };\n var eventArgs = {\n fileData: file,\n customFormData: [],\n cancel: false,\n chunkSize: this.asyncSettings.chunkSize === 0 ? null : this.asyncSettings.chunkSize\n };\n ajax.beforeSend = function (e) {\n eventArgs.currentRequest = ajax.httpRequest;\n eventArgs.currentChunkIndex = metaData.chunkIndex;\n if (eventArgs.currentChunkIndex === 0) {\n // This event is currently not required but to avoid breaking changes for previous customer, we have included.\n _this.trigger('uploading', eventArgs);\n }\n _this.trigger('chunkUploading', eventArgs);\n if (eventArgs.cancel) {\n _this.eventCancelByArgs(e, eventArgs, file);\n }\n else {\n _this.updateFormData(formData, eventArgs.customFormData);\n }\n };\n /* istanbul ignore next */\n ajax.onError = function (e) { _this.chunkUploadFailed(e, metaData, custom); return {}; };\n ajax.send(formData);\n metaData.request = ajax;\n };\n Uploader.prototype.eventCancelByArgs = function (e, eventArgs, file) {\n var _this = this;\n e.cancel = true;\n if (eventArgs.fileData.statusCode === '5') {\n return;\n }\n var liElement = this.getLiElement(eventArgs.fileData);\n liElement.querySelector('.' + STATUS).innerHTML = this.localizedTexts('fileUploadCancel');\n liElement.querySelector('.' + STATUS).classList.add(UPLOAD_FAILED);\n eventArgs.fileData.statusCode = '5';\n eventArgs.fileData.status = this.localizedTexts('fileUploadCancel');\n this.pauseButton = this.createElement('span', { className: 'e-icons e-file-reload-btn', attrs: { 'tabindex': this.btnTabIndex } });\n liElement.insertBefore(this.pauseButton, liElement.querySelector('.' + REMOVE_ICON));\n this.pauseButton.setAttribute('title', this.localizedTexts('retry'));\n /* istanbul ignore next */\n this.pauseButton.addEventListener('click', function (e) { _this.reloadcanceledFile(e, file, liElement); }, false);\n this.checkActionButtonStatus();\n };\n Uploader.prototype.checkChunkUpload = function () {\n return (this.asyncSettings.chunkSize <= 0 || isNullOrUndefined(this.asyncSettings.chunkSize)) ? false : true;\n };\n Uploader.prototype.chunkUploadComplete = function (e, metaData, custom) {\n var _this = this;\n var response = e.target;\n var liElement;\n if (response.readyState === 4 && response.status >= 200 && response.status < 300) {\n var requestResponse = e && e.currentTarget ? this.getResponse(e) : null;\n var totalChunk = Math.max(Math.ceil(metaData.file.size / this.asyncSettings.chunkSize), 1);\n var eventArgs = {\n event: e,\n file: metaData.file,\n chunkIndex: metaData.chunkIndex,\n totalChunk: totalChunk,\n chunkSize: this.asyncSettings.chunkSize,\n response: requestResponse\n };\n this.trigger('chunkSuccess', eventArgs);\n if (isNullOrUndefined(custom) || !custom) {\n liElement = this.getLiElement(metaData.file);\n }\n this.updateMetaData(metaData);\n if (metaData.end === metaData.file.size) {\n metaData.file.statusCode = '3';\n }\n if (metaData.file.statusCode === '5') {\n var eventArgs_1 = { event: e, fileData: metaData.file, cancel: false };\n this.trigger('canceling', eventArgs_1);\n /* istanbul ignore next */\n if (eventArgs_1.cancel) {\n metaData.file.statusCode = '3';\n var spinnerTarget = liElement.querySelector('.' + ABORT_ICON);\n if (!isNullOrUndefined(liElement) && !isNullOrUndefined(spinnerTarget)) {\n hideSpinner(spinnerTarget);\n detach(liElement.querySelector('.e-spinner-pane'));\n }\n this.sendNextRequest(metaData);\n return;\n }\n metaData.request.emitError = false;\n response.abort();\n var formData = new FormData();\n var name_2 = this.element.getAttribute('name');\n formData.append(name_2, metaData.file.name);\n formData.append('cancel-uploading', metaData.file.name);\n formData.append('cancelUploading', metaData.file.name);\n var ajax = new Ajax(this.asyncSettings.removeUrl, 'POST', true, null);\n ajax.emitError = false;\n ajax.onLoad = function (e) { _this.removeChunkFile(e, metaData, custom); return {}; };\n ajax.send(formData);\n }\n else {\n if ((totalChunk - 1) === metaData.chunkIndex && totalChunk > metaData.chunkIndex) {\n var index = this.pausedData.indexOf(metaData);\n if (index >= 0) {\n this.pausedData.splice(index, 1);\n }\n if (isNullOrUndefined(this.template) && (isNullOrUndefined(custom) || !custom) && liElement) {\n if (liElement) {\n detach(liElement.querySelector('.' + PAUSE_UPLOAD));\n }\n this.removeChunkProgressBar(metaData);\n }\n this.raiseSuccessEvent(e, metaData.file);\n return;\n }\n this.sendNextRequest(metaData);\n }\n }\n else {\n this.chunkUploadFailed(e, metaData);\n }\n };\n Uploader.prototype.sendNextRequest = function (metaData) {\n metaData.start = metaData.end;\n metaData.end += this.asyncSettings.chunkSize;\n metaData.end = Math.min(metaData.end, metaData.file.size);\n metaData.chunkIndex += 1;\n this.sendRequest(metaData.file, metaData);\n };\n Uploader.prototype.removeChunkFile = function (e, metaData, custom) {\n if (isNullOrUndefined(this.template) && (isNullOrUndefined(custom) && !custom)) {\n var liElement = this.getLiElement(metaData.file);\n var deleteIcon = liElement.querySelector('.' + ABORT_ICON);\n var spinnerTarget = deleteIcon;\n this.updateStatus(metaData.file, this.localizedTexts('fileUploadCancel'), '5');\n this.updateProgressBarClasses(liElement, UPLOAD_FAILED);\n this.removeProgressbar(liElement, 'failure');\n deleteIcon.classList.remove(ABORT_ICON);\n deleteIcon.classList.add(REMOVE_ICON);\n deleteIcon.setAttribute('title', this.localizedTexts('remove'));\n var pauseIcon = liElement.querySelector('.' + PAUSE_UPLOAD);\n pauseIcon.classList.add(RETRY_ICON);\n pauseIcon.classList.remove(PAUSE_UPLOAD);\n pauseIcon.setAttribute('title', this.localizedTexts('retry'));\n if (!isNullOrUndefined(liElement) && !isNullOrUndefined(deleteIcon)) {\n hideSpinner(spinnerTarget);\n detach(liElement.querySelector('.e-spinner-pane'));\n }\n }\n };\n Uploader.prototype.pauseUpload = function (metaData, e, custom) {\n metaData.file.statusCode = '4';\n metaData.file.status = this.localizedTexts('pause');\n this.updateMetaData(metaData);\n var eventArgs = {\n event: e ? e : null,\n file: metaData.file,\n chunkIndex: metaData.chunkIndex,\n chunkCount: Math.round(metaData.file.size / this.asyncSettings.chunkSize),\n chunkSize: this.asyncSettings.chunkSize\n };\n this.abortUpload(metaData, custom, eventArgs);\n };\n Uploader.prototype.abortUpload = function (metaData, custom, eventArgs) {\n metaData.request.emitError = false;\n metaData.request.httpRequest.abort();\n var liElement = this.getLiElement(metaData.file);\n if (isNullOrUndefined(this.template) && (isNullOrUndefined(custom) || !custom)) {\n var targetElement = liElement.querySelector('.' + PAUSE_UPLOAD);\n targetElement.classList.remove(PAUSE_UPLOAD);\n targetElement.classList.add(RESUME_UPLOAD);\n targetElement.setAttribute('title', this.localizedTexts('resume'));\n targetElement.nextElementSibling.classList.add(REMOVE_ICON);\n targetElement.nextElementSibling.classList.remove(ABORT_ICON);\n targetElement.nextElementSibling.setAttribute('title', this.localizedTexts('remove'));\n }\n for (var i = 0; i < this.pausedData.length; i++) {\n if (this.pausedData[i].file.name === metaData.file.name) {\n this.pausedData.splice(i, 1);\n }\n }\n this.pausedData.push(metaData);\n this.trigger('pausing', eventArgs);\n };\n Uploader.prototype.resumeUpload = function (metaData, e, custom) {\n var liElement = this.getLiElement(metaData.file);\n var targetElement;\n if (!isNullOrUndefined(liElement)) {\n targetElement = liElement.querySelector('.' + RESUME_UPLOAD);\n }\n if (!isNullOrUndefined(targetElement) && (isNullOrUndefined(custom) || !custom)) {\n targetElement.classList.remove(RESUME_UPLOAD);\n targetElement.classList.add(PAUSE_UPLOAD);\n targetElement.setAttribute('title', this.localizedTexts('pause'));\n targetElement.nextElementSibling.classList.remove(REMOVE_ICON);\n targetElement.nextElementSibling.classList.add(ABORT_ICON);\n targetElement.nextElementSibling.setAttribute('title', this.localizedTexts('abort'));\n }\n metaData.file.status = this.localizedTexts('inProgress');\n metaData.file.statusCode = '3';\n this.updateMetaData(metaData);\n var eventArgs = {\n event: e ? e : null,\n file: metaData.file,\n chunkIndex: metaData.chunkIndex,\n chunkCount: Math.round(metaData.file.size / this.asyncSettings.chunkSize),\n chunkSize: this.asyncSettings.chunkSize\n };\n this.trigger('resuming', eventArgs);\n for (var i = 0; i < this.pausedData.length; i++) {\n if (this.pausedData[i].end === this.pausedData[i].file.size) {\n this.chunkUploadComplete(e, metaData, custom);\n }\n else {\n if (this.pausedData[i].file.name === metaData.file.name) {\n this.pausedData[i].start = this.pausedData[i].end;\n this.pausedData[i].end = this.pausedData[i].end + this.asyncSettings.chunkSize;\n this.pausedData[i].end = Math.min(this.pausedData[i].end, this.pausedData[i].file.size);\n this.pausedData[i].chunkIndex = this.pausedData[i].chunkIndex + 1;\n this.sendRequest(this.pausedData[i].file, this.pausedData[i], custom);\n }\n }\n }\n };\n Uploader.prototype.updateMetaData = function (metaData) {\n if (this.uploadMetaData.indexOf(metaData) === -1) {\n this.uploadMetaData.push(metaData);\n }\n else {\n this.uploadMetaData.splice(this.uploadMetaData.indexOf(metaData), 1);\n this.uploadMetaData.push(metaData);\n }\n };\n Uploader.prototype.removeChunkProgressBar = function (metaData) {\n var liElement = this.getLiElement(metaData.file);\n if (!isNullOrUndefined(liElement)) {\n this.updateProgressBarClasses(liElement, UPLOAD_SUCCESS);\n this.removeProgressbar(liElement, 'success');\n var cancelButton = liElement.querySelector('.' + ABORT_ICON);\n if (!isNullOrUndefined(cancelButton)) {\n cancelButton.classList.add(DELETE_ICON);\n cancelButton.setAttribute('title', this.localizedTexts('delete'));\n cancelButton.classList.remove(ABORT_ICON, UPLOAD_INPROGRESS);\n }\n }\n };\n Uploader.prototype.chunkUploadFailed = function (e, metaData, custom) {\n var _this = this;\n var chunkCount = Math.max(Math.ceil(metaData.file.size / this.asyncSettings.chunkSize), 1);\n var liElement;\n if (isNullOrUndefined(this.template) && (isNullOrUndefined(custom) || !custom)) {\n liElement = this.getLiElement(metaData.file);\n }\n var requestResponse = e && e.currentTarget ? this.getResponse(e) : null;\n var eventArgs = {\n event: e,\n file: metaData.file,\n chunkIndex: metaData.chunkIndex,\n totalChunk: chunkCount,\n chunkSize: this.asyncSettings.chunkSize,\n cancel: false,\n response: requestResponse\n };\n this.trigger('chunkFailure', eventArgs);\n // To prevent triggering of failure event\n // tslint:disable-next-line\n if (!eventArgs.cancel) {\n if (metaData.retryCount < this.asyncSettings.retryCount) {\n setTimeout(function () { _this.retryRequest(liElement, metaData, custom); }, this.asyncSettings.retryAfterDelay);\n }\n else {\n if (!isNullOrUndefined(liElement)) {\n var pauseButton = liElement.querySelector('.' + PAUSE_UPLOAD) ?\n liElement.querySelector('.' + PAUSE_UPLOAD) : liElement.querySelector('.' + RESUME_UPLOAD);\n if (!isNullOrUndefined(pauseButton)) {\n pauseButton.classList.add(RETRY_ICON);\n pauseButton.classList.remove(PAUSE_UPLOAD, RESUME_UPLOAD);\n }\n this.updateProgressBarClasses(liElement, UPLOAD_FAILED);\n this.removeProgressbar(liElement, 'failure');\n liElement.querySelector('.e-icons').classList.remove(UPLOAD_INPROGRESS);\n var iconElement = liElement.querySelector('.' + ABORT_ICON);\n iconElement.classList.remove(ABORT_ICON);\n if (!isNullOrUndefined(liElement.querySelector('.' + PAUSE_UPLOAD))) {\n detach(liElement.querySelector('.' + PAUSE_UPLOAD));\n }\n if (metaData.start > 0) {\n iconElement.classList.add(DELETE_ICON);\n iconElement.setAttribute('title', this.localizedTexts('delete'));\n }\n else {\n iconElement.classList.add(REMOVE_ICON);\n iconElement.setAttribute('title', this.localizedTexts('remove'));\n }\n }\n metaData.retryCount = 0;\n var file = metaData.file;\n var failureMessage = this.localizedTexts('uploadFailedMessage');\n var args = {\n e: e, response: requestResponse,\n operation: 'upload',\n file: this.updateStatus(file, failureMessage, '0', false),\n statusText: failureMessage\n };\n this.trigger('failure', args);\n // tslint:disable-next-line\n this.updateStatus(file, args.statusText, '0');\n this.uploadSequential();\n this.checkActionComplete(true);\n }\n }\n };\n Uploader.prototype.retryRequest = function (liElement, metaData, custom) {\n if (isNullOrUndefined(this.template) && (isNullOrUndefined(custom) || !custom) && liElement) {\n this.updateProgressBarClasses(liElement, UPLOAD_FAILED);\n }\n metaData.retryCount += 1;\n this.sendRequest(metaData.file, metaData);\n };\n Uploader.prototype.checkPausePlayAction = function (e) {\n var targetElement = e.target;\n var selectedElement = e.target.parentElement;\n var index = this.fileList.indexOf(selectedElement);\n var fileData = this.filesData[index];\n var metaData = this.getCurrentMetaData(fileData);\n if (targetElement.classList.contains(PAUSE_UPLOAD)) {\n /* istanbul ignore next */\n this.pauseUpload(metaData, e);\n }\n else if (targetElement.classList.contains(RESUME_UPLOAD)) {\n /* istanbul ignore next */\n this.resumeUpload(metaData, e);\n }\n else if (targetElement.classList.contains(RETRY_ICON)) {\n if (metaData.file.status === this.localizedTexts('fileUploadCancel')) {\n this.retryUpload(metaData, false);\n }\n else {\n this.retryUpload(metaData, true);\n }\n }\n };\n Uploader.prototype.retryUpload = function (metaData, fromcanceledStage) {\n if (fromcanceledStage) {\n metaData.end = metaData.end + this.asyncSettings.chunkSize;\n metaData.start = metaData.start + this.asyncSettings.chunkSize;\n this.sendRequest(metaData.file, metaData);\n }\n else {\n metaData.file.statusCode = '1';\n metaData.file.status = this.localizedTexts('readyToUploadMessage');\n this.chunkUpload(metaData.file);\n }\n /* istanbul ignore next */\n (this.getLiElement(metaData.file)).classList.add(RESTRICT_RETRY);\n };\n Uploader.prototype.chunkUploadInProgress = function (e, metaData, custom) {\n var _this = this;\n if (metaData.file.statusCode === '4') {\n return;\n }\n if (metaData.file.statusCode !== '4' && metaData.file.statusCode !== '5') {\n metaData.file.statusCode = '3';\n metaData.file.status = this.localizedTexts('inProgress');\n }\n this.updateMetaData(metaData);\n var liElement = this.getLiElement(metaData.file);\n if (isNullOrUndefined(liElement)) {\n return;\n }\n var target;\n var retryElement = liElement.querySelector('.' + RETRY_ICON);\n if (!isNullOrUndefined(retryElement)) {\n retryElement.classList.add(PAUSE_UPLOAD);\n retryElement.setAttribute('title', this.localizedTexts('pause'));\n retryElement.classList.remove(RETRY_ICON);\n }\n if (!isNullOrUndefined(liElement)) {\n if (!(liElement.querySelectorAll('.' + PROGRESS_WRAPPER).length > 0)) {\n var statusElement = liElement.querySelector('.' + STATUS);\n if (isNullOrUndefined(this.template)) {\n statusElement.classList.add(UPLOAD_INPROGRESS);\n statusElement.classList.remove(UPLOAD_FAILED);\n this.createProgressBar(liElement);\n this.updateProgressBarClasses(liElement, UPLOAD_INPROGRESS);\n }\n var clearIcon = liElement.querySelector('.' + REMOVE_ICON) ? liElement.querySelector('.' + REMOVE_ICON) :\n liElement.querySelector('.' + DELETE_ICON);\n if (!isNullOrUndefined(clearIcon)) {\n clearIcon.classList.add(ABORT_ICON);\n clearIcon.setAttribute('title', this.localizedTexts('abort'));\n clearIcon.classList.remove(REMOVE_ICON);\n }\n }\n if (!isNaN(Math.round((e.loaded / e.total) * 100)) && isNullOrUndefined(this.template) && metaData.file.statusCode !== '4') {\n var loadedSize = (metaData.chunkIndex * this.asyncSettings.chunkSize);\n var value = Math.min((((loadedSize + e.loaded) / metaData.file.size) * 100), 100);\n this.changeProgressValue(liElement, Math.round(value).toString() + '%');\n }\n if (metaData.chunkIndex === 0) {\n this.checkActionButtonStatus();\n }\n }\n if (isNullOrUndefined(liElement.querySelector('.' + PAUSE_UPLOAD)) && isNullOrUndefined(this.template)) {\n this.pauseButton = this.createElement('span', { className: 'e-icons e-file-pause-btn', attrs: { 'tabindex': this.btnTabIndex } });\n if (this.browserName === 'msie') {\n this.pauseButton.classList.add('e-msie');\n }\n liElement.insertBefore(this.pauseButton, liElement.querySelector('.' + ABORT_ICON));\n this.pauseButton.setAttribute('title', this.localizedTexts('pause'));\n this.pauseButton.addEventListener('click', function (e) { _this.checkPausePlayAction(e); }, false);\n }\n };\n /**\n * It is used to convert bytes value into kilobytes or megabytes depending on the size based\n * on [binary prefix](https://en.wikipedia.org/wiki/Binary_prefix).\n * @param { number } bytes - specifies the file size in bytes.\n * @returns string\n */\n Uploader.prototype.bytesToSize = function (bytes) {\n var i = -1;\n var size;\n if (!bytes) {\n return '0.0 KB';\n }\n do {\n bytes = bytes / 1024;\n i++;\n } while (bytes > 99);\n if (i >= 2) {\n bytes = bytes * 1024;\n i = 1;\n }\n return Math.max(bytes, 0).toFixed(1) + ' ' + ['KB', 'MB'][i];\n };\n /**\n * Allows you to sort the file data alphabetically based on its file name clearly.\n * @param { FileList } filesData - specifies the files data for upload.\n * @returns File[]\n */\n /* istanbul ignore next */\n Uploader.prototype.sortFileList = function (filesData) {\n var files = filesData;\n var fileNames = [];\n for (var i = 0; i < files.length; i++) {\n fileNames.push(files[i].name);\n }\n var sortedFileNames = fileNames.sort();\n var sortedFilesData = [];\n var index = 0;\n for (var _i = 0, sortedFileNames_1 = sortedFileNames; _i < sortedFileNames_1.length; _i++) {\n var name_3 = sortedFileNames_1[_i];\n for (var i = 0; i < files.length; i++) {\n if (name_3 === files[i].name) {\n sortedFilesData.push(files[i]);\n }\n }\n }\n return sortedFilesData;\n };\n /**\n * Removes the component from the DOM and detaches all its related event handlers. Also it removes the attributes and classes.\n * @method destroy\n * @return {void}.\n */\n Uploader.prototype.destroy = function () {\n this.element.value = null;\n this.clearAll();\n this.unWireEvents();\n this.unBindDropEvents();\n if (this.multiple) {\n this.element.removeAttribute('multiple');\n }\n if (!this.enabled) {\n this.element.removeAttribute('disabled');\n }\n this.element.removeAttribute('accept');\n this.setInitialAttributes();\n var attributes = ['aria-label', 'directory', 'webkitdirectory', 'tabindex'];\n for (var _i = 0, attributes_1 = attributes; _i < attributes_1.length; _i++) {\n var key = attributes_1[_i];\n this.element.removeAttribute(key);\n }\n this.uploadWrapper.parentElement.appendChild(this.element);\n detach(this.uploadWrapper);\n this.uploadWrapper = null;\n _super.prototype.destroy.call(this);\n };\n /**\n * Allows you to call the upload process manually by calling save URL action.\n * To process the selected files (added in upload queue), pass an empty argument otherwise\n * upload the specific file based on its argument.\n * @param { FileInfo | FileInfo[] } files - specifies the files data for upload.\n * @returns void\n */\n Uploader.prototype.upload = function (files, custom) {\n var uploadFiles = this.validateFileType(files);\n this.uploadFiles(uploadFiles, custom);\n };\n Uploader.prototype.validateFileType = function (files) {\n var uploadFiles = [];\n if (files instanceof Array) {\n uploadFiles = files;\n }\n else {\n uploadFiles.push(files);\n }\n return uploadFiles;\n };\n Uploader.prototype.uploadFiles = function (files, custom) {\n var _this = this;\n var selectedFiles = [];\n if (this.asyncSettings.saveUrl === '' || isNullOrUndefined(this.asyncSettings.saveUrl)) {\n return;\n }\n if (!custom || isNullOrUndefined(custom)) {\n if (!this.multiple) {\n var file = [];\n file.push(files[0]);\n selectedFiles = this.filterfileList(file);\n }\n else {\n selectedFiles = this.filterfileList(files);\n }\n }\n else {\n selectedFiles = files;\n }\n var chunkEnabled = this.checkChunkUpload();\n var _loop_4 = function (i) {\n var ajax = new Ajax(this_3.asyncSettings.saveUrl, 'POST', true, null);\n ajax.emitError = false;\n var eventArgs = {\n fileData: selectedFiles[i],\n customFormData: [],\n cancel: false\n };\n var formData = new FormData();\n ajax.beforeSend = function (e) {\n eventArgs.currentRequest = ajax.httpRequest;\n _this.trigger('uploading', eventArgs);\n if (eventArgs.cancel) {\n _this.eventCancelByArgs(e, eventArgs, selectedFiles[i]);\n }\n _this.updateFormData(formData, eventArgs.customFormData);\n };\n if (selectedFiles[i].statusCode === '1') {\n var name_4 = this_3.element.getAttribute('name');\n formData.append(name_4, selectedFiles[i].rawFile, selectedFiles[i].name);\n if (chunkEnabled && selectedFiles[i].size > this_3.asyncSettings.chunkSize) {\n this_3.chunkUpload(selectedFiles[i], custom);\n }\n else {\n ajax.onLoad = function (e) { _this.uploadComplete(e, selectedFiles[i], custom); return {}; };\n ajax.onUploadProgress = function (e) {\n _this.uploadInProgress(e, selectedFiles[i], custom, ajax);\n return {};\n };\n /* istanbul ignore next */\n ajax.onError = function (e) { _this.uploadFailed(e, selectedFiles[i]); return {}; };\n ajax.send(formData);\n }\n }\n };\n var this_3 = this;\n for (var i = 0; i < selectedFiles.length; i++) {\n _loop_4(i);\n }\n };\n /**\n * Remove the uploaded file from server manually by calling the remove URL action.\n * If you pass an empty argument to this method, the complete file list can be cleared,\n * otherwise remove the specific file based on its argument (“file_data”).\n * @param { FileInfo | FileInfo[] } fileData - specifies the files data to remove from file list/server.\n * @param { boolean } customTemplate - Set true if the component rendering with customize template.\n * @param { boolean } removeDirectly - Set true if files remove without removing event.\n * @returns void\n */\n Uploader.prototype.remove = function (fileData, customTemplate, removeDirectly, args) {\n var eventArgs = {\n event: args,\n cancel: false,\n filesData: [],\n customFormData: [],\n postRawFile: true\n };\n var index;\n if (this.isForm) {\n eventArgs.filesData = this.getFilesData();\n this.trigger('removing', eventArgs);\n if (!eventArgs.cancel) {\n this.clearAll();\n }\n return;\n }\n var removeFiles = [];\n fileData = !isNullOrUndefined(fileData) ? fileData : this.filesData;\n if (fileData instanceof Array) {\n removeFiles = fileData;\n }\n else {\n removeFiles.push(fileData);\n }\n eventArgs.filesData = removeFiles;\n var removeUrl = this.asyncSettings.removeUrl;\n var validUrl = (removeUrl === '' || isNullOrUndefined(removeUrl)) ? false : true;\n for (var _i = 0, removeFiles_1 = removeFiles; _i < removeFiles_1.length; _i++) {\n var files = removeFiles_1[_i];\n index = this.filesData.indexOf(files);\n if ((files.statusCode === '2' || files.statusCode === '4') && validUrl) {\n this.removeUploadedFile(files, eventArgs, removeDirectly, customTemplate);\n }\n else {\n if (!removeDirectly) {\n this.trigger('removing', eventArgs);\n }\n if (eventArgs.cancel) {\n return;\n }\n this.removeFilesData(files, customTemplate);\n }\n if (this.sequentialUpload) {\n /* istanbul ignore next */\n if (index <= this.actionCompleteCount) {\n this.checkActionComplete(false);\n }\n }\n else {\n this.checkActionComplete(false);\n }\n }\n };\n /**\n * Clear all the file entries from list that can be uploaded files or added in upload queue.\n * @returns void\n */\n Uploader.prototype.clearAll = function () {\n if (isNullOrUndefined(this.listParent)) {\n if (this.browserName !== 'msie') {\n this.element.value = '';\n }\n this.filesData = [];\n return;\n }\n var eventArgs = {\n cancel: false,\n filesData: this.filesData\n };\n this.trigger('clearing', eventArgs);\n if (eventArgs.cancel) {\n return;\n }\n this.clearData();\n this.actionCompleteCount = 0;\n this.count = -1;\n };\n /**\n * Get the data of files which are shown in file list.\n * @returns FileInfo[]\n */\n Uploader.prototype.getFilesData = function () {\n return this.filesData;\n };\n /**\n * Pauses the in-progress chunked upload based on the file data.\n * @param { FileInfo | FileInfo[] } fileData - specifies the files data to pause from uploading.\n * @param { boolean } custom - Set true if used custom UI.\n * @returns void\n */\n Uploader.prototype.pause = function (fileData, custom) {\n var fileDataFiles = this.validateFileType(fileData);\n this.pauseUploading(fileDataFiles, custom);\n };\n Uploader.prototype.pauseUploading = function (fileData, custom) {\n var files = this.getFiles(fileData);\n for (var i = 0; i < files.length; i++) {\n if (files[i].statusCode === '3') {\n this.pauseUpload(this.getCurrentMetaData(files[i], null), null, custom);\n }\n }\n };\n Uploader.prototype.getFiles = function (fileData) {\n var files = [];\n if (!isNullOrUndefined(fileData) && !(fileData instanceof Array)) {\n files.push(fileData);\n }\n else {\n files = fileData;\n }\n return files;\n };\n /**\n * Resumes the chunked upload that is previously paused based on the file data.\n * @param { FileInfo | FileInfo[] } fileData - specifies the files data to resume the paused file.\n * @param { boolean } custom - Set true if used custom UI.\n * @returns void\n */\n Uploader.prototype.resume = function (fileData, custom) {\n var fileDataFiles = this.validateFileType(fileData);\n this.resumeFiles(fileDataFiles, custom);\n };\n Uploader.prototype.resumeFiles = function (fileData, custom) {\n var files = this.getFiles(fileData);\n for (var i = 0; i < files.length; i++) {\n if (files[i].statusCode === '4') {\n this.resumeUpload(this.getCurrentMetaData(files[i], null), null, custom);\n }\n }\n };\n /**\n * Retries the canceled or failed file upload based on the file data.\n * @param { FileInfo | FileInfo[] } fileData - specifies the files data to retry the canceled or failed file.\n * @param { boolean } fromcanceledStage - Set true to retry from canceled stage and set false to retry from initial stage.\n * @returns void\n */\n Uploader.prototype.retry = function (fileData, fromcanceledStage, custom) {\n var fileDataFiles = this.validateFileType(fileData);\n this.retryFailedFiles(fileDataFiles, fromcanceledStage, custom);\n };\n Uploader.prototype.retryFailedFiles = function (fileData, fromcanceledStage, custom) {\n var files = this.getFiles(fileData);\n for (var i = 0; i < files.length; i++) {\n if (files[i].statusCode === '5' || files[i].statusCode === '0') {\n if (this.asyncSettings.chunkSize > 0) {\n this.retryUpload(this.getCurrentMetaData(files[i], null), fromcanceledStage);\n }\n else {\n var liElement = void 0;\n if (!custom) {\n liElement = this.fileList[this.filesData.indexOf(files[i])];\n }\n this.reloadcanceledFile(null, files[i], liElement, custom);\n }\n }\n }\n };\n /**\n * Stops the in-progress chunked upload based on the file data.\n * When the file upload is canceled, the partially uploaded file is removed from server.\n * @param { FileInfo | FileInfo[] } fileData - specifies the files data to cancel the progressing file.\n * @returns void\n */\n Uploader.prototype.cancel = function (fileData) {\n var cancelingFiles = this.validateFileType(fileData);\n this.cancelUpload(cancelingFiles);\n };\n Uploader.prototype.cancelUpload = function (fileData) {\n var files = this.getFiles(fileData);\n if (this.asyncSettings.chunkSize > 0) {\n for (var i = 0; i < files.length; i++) {\n if (files[i].statusCode === '3') {\n var metaData = this.getCurrentMetaData(files[i], null);\n metaData.file.statusCode = '5';\n metaData.file.status = this.localizedTexts('fileUploadCancel');\n this.updateMetaData(metaData);\n this.showHideUploadSpinner(files[i]);\n }\n }\n }\n else {\n for (var i = 0; i < files.length; i++) {\n if (files[i].statusCode === '3') {\n files[i].statusCode = '5';\n files[i].status = this.localizedTexts('fileUploadCancel');\n this.showHideUploadSpinner(files[i]);\n }\n }\n }\n };\n Uploader.prototype.showHideUploadSpinner = function (files) {\n var liElement = this.getLiElement(files);\n if (!isNullOrUndefined(liElement) && isNullOrUndefined(this.template)) {\n var spinnerTarget = liElement.querySelector('.' + ABORT_ICON);\n createSpinner({ target: spinnerTarget, width: '20px' });\n showSpinner(spinnerTarget);\n }\n };\n __decorate([\n Complex({ saveUrl: '', removeUrl: '' }, AsyncSettings)\n ], Uploader.prototype, \"asyncSettings\", void 0);\n __decorate([\n Property(false)\n ], Uploader.prototype, \"sequentialUpload\", void 0);\n __decorate([\n Property(false)\n ], Uploader.prototype, \"enableRtl\", void 0);\n __decorate([\n Property('')\n ], Uploader.prototype, \"cssClass\", void 0);\n __decorate([\n Property(true)\n ], Uploader.prototype, \"enabled\", void 0);\n __decorate([\n Property(null)\n ], Uploader.prototype, \"template\", void 0);\n __decorate([\n Property(true)\n ], Uploader.prototype, \"multiple\", void 0);\n __decorate([\n Property(true)\n ], Uploader.prototype, \"autoUpload\", void 0);\n __decorate([\n Complex({}, ButtonsProps)\n ], Uploader.prototype, \"buttons\", void 0);\n __decorate([\n Property('')\n ], Uploader.prototype, \"allowedExtensions\", void 0);\n __decorate([\n Property(0)\n ], Uploader.prototype, \"minFileSize\", void 0);\n __decorate([\n Property(30000000)\n ], Uploader.prototype, \"maxFileSize\", void 0);\n __decorate([\n Property(null)\n ], Uploader.prototype, \"dropArea\", void 0);\n __decorate([\n Collection([{}], FilesProp)\n ], Uploader.prototype, \"files\", void 0);\n __decorate([\n Property(true)\n ], Uploader.prototype, \"showFileList\", void 0);\n __decorate([\n Property(false)\n ], Uploader.prototype, \"directoryUpload\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"actionComplete\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"rendering\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"fileListRendering\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"selected\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"uploading\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"success\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"failure\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"removing\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"clearing\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"progress\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"chunkSuccess\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"chunkFailure\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"chunkUploading\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"canceling\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"pausing\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"resuming\", void 0);\n Uploader = __decorate([\n NotifyPropertyChanges\n ], Uploader);\n return Uploader;\n}(Component));\nexport { Uploader };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Collection, Event, NotifyPropertyChanges, detach, Property, EventHandler } from '@syncfusion/ej2-base';\nimport { addClass, getUniqueID, rippleEffect } from '@syncfusion/ej2-base';\nimport { attributes, Component, closest, select } from '@syncfusion/ej2-base';\nimport { classList, removeClass } from '@syncfusion/ej2-base';\nimport { Button } from '@syncfusion/ej2-buttons';\nimport { Popup } from '@syncfusion/ej2-popups';\nimport { getModel, Item } from './../common/common';\nvar classNames = {\n DISABLED: 'e-disabled',\n FOCUS: 'e-focused',\n ICON: 'e-menu-icon',\n ITEM: 'e-item',\n POPUP: 'e-dropdown-popup',\n RTL: 'e-rtl',\n SEPARATOR: 'e-separator',\n VERTICAL: 'e-vertical'\n};\n/**\n * DropDownButton component is used to toggle contextual overlays for displaying list of action items.\n * It can contain both text and images.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar DropDownButton = /** @class */ (function (_super) {\n __extends(DropDownButton, _super);\n /**\n * Constructor for creating the widget\n * @param {DropDownButtonModel} options?\n * @param {string|HTMLButtonElement} element?\n */\n function DropDownButton(options, element) {\n return _super.call(this, options, element) || this;\n }\n DropDownButton.prototype.preRender = function () {\n /** */\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @returns string\n */\n DropDownButton.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * To open/close DropDownButton popup based on current state of the DropDownButton.\n * @returns void\n */\n DropDownButton.prototype.toggle = function () {\n this.canOpen() ? this.openPopUp() : this.closePopup();\n };\n /**\n * Initialize the Component rendering\n * @returns void\n * @private\n */\n DropDownButton.prototype.render = function () {\n this.initialize();\n if (!this.disabled) {\n this.wireEvents();\n }\n };\n DropDownButton.prototype.createPopup = function () {\n var _a;\n var div = this.createElement('div', {\n className: classNames.POPUP,\n id: this.element.id + '-popup'\n });\n document.body.appendChild(div);\n this.dropDown = new Popup(div, {\n relateTo: this.element,\n collision: { X: 'fit', Y: 'flip' },\n position: { X: 'left', Y: 'bottom' },\n targetType: 'relative',\n content: this.target ? this.getTargetElement() : '',\n enableRtl: this.enableRtl\n });\n if (this.dropDown.element.style.position === 'fixed') {\n this.dropDown.refreshPosition(this.element);\n }\n this.dropDown.hide();\n attributes(this.element, (_a = {},\n _a['aria-haspopup'] = this.items.length || this.target ? 'true' : 'false',\n _a['aria-expanded'] = 'false',\n _a['aria-owns'] = this.getPopUpElement().id,\n _a['type'] = 'button',\n _a));\n if (this.cssClass) {\n addClass([div], this.cssClass.split(' '));\n }\n };\n DropDownButton.prototype.getTargetElement = function () {\n return typeof (this.target) === 'string' ? select(this.target) : this.target;\n };\n DropDownButton.prototype.createItems = function (items) {\n var showIcon = this.hasIcon(items, 'iconCss');\n var span;\n var item;\n var li;\n var eventArgs;\n var ul = this.createElement('ul', {\n attrs: { 'role': 'menu', 'tabindex': '0' }\n });\n for (var i = 0; i < items.length; i++) {\n item = items[i];\n li = this.createElement('li', {\n innerHTML: item.url ? '' : item.text,\n className: item.separator ? classNames.ITEM + ' ' + classNames.SEPARATOR : classNames.ITEM,\n attrs: { 'role': 'menuItem', 'tabindex': '-1' },\n id: item.id ? item.id : getUniqueID('e-' + this.getModuleName() + '-item')\n });\n if (item.iconCss) {\n span = this.createElement('span', { className: classNames.ICON + ' ' + item.iconCss });\n li.insertBefore(span, li.childNodes[0]);\n }\n else {\n if (showIcon && !item.separator) {\n li.classList.add('e-blank-icon');\n }\n }\n if (item.url) {\n li.appendChild(this.createAnchor(item));\n }\n eventArgs = { item: item, element: li };\n this.trigger('beforeItemRender', eventArgs);\n ul.appendChild(li);\n }\n return ul;\n };\n DropDownButton.prototype.hasIcon = function (items, field) {\n for (var i = 0, len = items.length; i < len; i++) {\n if (items[i][field]) {\n return true;\n }\n }\n return false;\n };\n DropDownButton.prototype.createAnchor = function (item) {\n return this.createElement('a', { className: 'e-menu-text e-menu-url', innerHTML: item.text, attrs: { 'href': item.url } });\n };\n DropDownButton.prototype.initialize = function () {\n this.button = new Button({\n iconCss: this.iconCss, iconPosition: this.iconPosition, cssClass: this.cssClass, content: this.content,\n disabled: this.disabled, enableRtl: this.enableRtl, enablePersistence: this.enablePersistence\n });\n this.button.createElement = this.createElement;\n this.button.appendTo(this.element);\n if (!this.element.id) {\n this.element.id = getUniqueID('e-' + this.getModuleName());\n }\n this.appendArrowSpan();\n this.createPopup();\n this.setActiveElem([this.element]);\n };\n DropDownButton.prototype.appendArrowSpan = function () {\n this.element.appendChild(this.createElement('span', {\n className: 'e-btn-icon e-icons ' + 'e-icon-' + (this.cssClass.indexOf(classNames.VERTICAL) > -1\n ? 'bottom' : 'right') + ' e-caret'\n }));\n };\n DropDownButton.prototype.setActiveElem = function (elem) {\n this.activeElem = elem;\n };\n /**\n * Get component name.\n * @returns string\n * @private\n */\n DropDownButton.prototype.getModuleName = function () {\n return 'dropdown-btn';\n };\n DropDownButton.prototype.canOpen = function () {\n return this.getPopUpElement().classList.contains('e-popup-close');\n };\n /**\n * Destroys the widget.\n * @returns void\n */\n DropDownButton.prototype.destroy = function () {\n var _this = this;\n _super.prototype.destroy.call(this);\n if (this.getModuleName() === 'dropdown-btn') {\n var attrList = void 0;\n var classList_1;\n if (this.element.querySelector('span.e-caret')) {\n detach(this.element.querySelector('span.e-caret'));\n }\n if (this.cssClass) {\n classList_1 = this.cssClass.split(' ');\n }\n this.button.destroy();\n if (classList_1) {\n removeClass([this.element], classList_1);\n }\n removeClass(this.activeElem, ['e-active']);\n attrList = this.element.getAttribute('class') ? ['aria-haspopup', 'aria-expanded', 'aria-owns', 'type']\n : ['aria-haspopup', 'aria-expanded', 'aria-owns', 'type', 'class'];\n attrList.forEach(function (key) {\n _this.element.removeAttribute(key);\n });\n this.dropDown.destroy();\n var popupEle = document.getElementById(this.getPopUpElement().id);\n if (popupEle) {\n removeClass([popupEle], ['e-popup-open', 'e-popup-close']);\n detach(popupEle);\n }\n if (!this.disabled) {\n this.unWireEvents();\n }\n }\n };\n DropDownButton.prototype.getPopUpElement = function () {\n return this.dropDown.element;\n };\n DropDownButton.prototype.getULElement = function () {\n return this.getPopUpElement().children[0];\n };\n DropDownButton.prototype.wireEvents = function () {\n var popupElement = this.getPopUpElement();\n this.delegateMousedownHandler = this.mousedownHandler.bind(this);\n EventHandler.add(document, 'mousedown touchstart', this.delegateMousedownHandler, this);\n EventHandler.add(this.element, 'click', this.clickHandler, this);\n EventHandler.add(popupElement, 'click', this.clickHandler, this);\n EventHandler.add(this.element, 'keydown', this.keyBoardHandler, this);\n EventHandler.add(popupElement, 'keydown', this.keyBoardHandler, this);\n this.rippleFn = rippleEffect(popupElement, { selector: '.' + classNames.ITEM });\n };\n DropDownButton.prototype.keyBoardHandler = function (e) {\n if (e.target === this.element && (e.keyCode === 9 || (!e.altKey && e.keyCode === 40) || e.keyCode === 38)) {\n return;\n }\n switch (e.keyCode) {\n case 38:\n case 40:\n if (e.altKey && (e.keyCode === 38 || e.keyCode === 40)) {\n this.keyEventHandler(e);\n }\n else {\n this.upDownKeyHandler(e);\n }\n break;\n case 9:\n case 13:\n case 27:\n case 32:\n this.keyEventHandler(e);\n break;\n }\n };\n DropDownButton.prototype.upDownKeyHandler = function (e) {\n if (this.target && (e.keyCode === 38 || e.keyCode === 40)) {\n return;\n }\n e.preventDefault();\n var ul = this.getULElement();\n var defaultIdx = e.keyCode === 40 ? 0 : ul.childElementCount - 1;\n var liIdx = defaultIdx;\n var li = null;\n this.removeCustomSelection();\n for (var i = 0, len = ul.children.length; i < len; i++) {\n if (ul.children[i].classList.contains(classNames.FOCUS)) {\n li = ul.children[i];\n liIdx = i;\n li.classList.remove(classNames.FOCUS);\n e.keyCode === 40 ? liIdx++ : liIdx--;\n if (liIdx === (e.keyCode === 40 ? ul.childElementCount : -1)) {\n liIdx = defaultIdx;\n }\n }\n }\n li = ul.children[liIdx];\n liIdx = this.isValidLI(li, liIdx, e.keyCode);\n if (liIdx !== -1) {\n addClass([ul.children[liIdx]], classNames.FOCUS);\n ul.children[liIdx].focus();\n }\n };\n DropDownButton.prototype.removeCustomSelection = function () {\n var selectedLi = this.getULElement().querySelector('.e-selected');\n if (selectedLi) {\n selectedLi.classList.remove('e-selected');\n }\n };\n DropDownButton.prototype.isValidLI = function (li, index, keyCode, count) {\n if (count === void 0) { count = 0; }\n if (li.classList.contains(classNames.SEPARATOR) || li.classList.contains(classNames.DISABLED)) {\n if (index === (keyCode === 40 ? this.items.length - 1 : 0)) {\n index = keyCode === 40 ? 0 : this.items.length - 1;\n }\n else {\n keyCode === 40 ? index++ : index--;\n }\n }\n li = this.getULElement().children[index];\n if (li.classList.contains(classNames.SEPARATOR) || li.classList.contains(classNames.DISABLED)) {\n count++;\n if (count === this.items.length) {\n return index = -1;\n }\n index = this.isValidLI(li, index, keyCode, count);\n }\n return index;\n };\n DropDownButton.prototype.keyEventHandler = function (e) {\n if (this.target && (e.keyCode === 13 || e.keyCode === 9)) {\n return;\n }\n if (e.keyCode !== 9) {\n e.preventDefault();\n }\n if (e.keyCode === 27 || e.keyCode === 38 || e.keyCode === 9) {\n if (!this.canOpen()) {\n this.closePopup(e, this.element);\n }\n }\n else {\n this.clickHandler(e);\n }\n };\n DropDownButton.prototype.getLI = function (elem) {\n return elem.tagName === 'LI' ? elem : closest(elem, 'li');\n };\n DropDownButton.prototype.mousedownHandler = function (e) {\n var trgt = e.target;\n if (!this.canOpen() && !(closest(trgt, '#' + this.getPopUpElement().id) || closest(trgt, '#' + this.element.id))) {\n this.closePopup(e);\n }\n };\n DropDownButton.prototype.clickHandler = function (e) {\n var trgt = e.target;\n var canOpen = this.canOpen();\n if (closest(trgt, '#' + this.element.id)) {\n if (canOpen) {\n this.openPopUp(e);\n }\n else {\n this.closePopup(e, this.activeElem[0]);\n }\n }\n else {\n if (closest(trgt, '#' + this.getPopUpElement().id)) {\n var eventArgs = void 0;\n var liIdx = void 0;\n var item = void 0;\n var li = this.getLI(trgt);\n if (li) {\n liIdx = Array.prototype.indexOf.call(this.getULElement().children, li);\n item = this.items[liIdx];\n if (item) {\n eventArgs = { element: li, item: item };\n this.trigger('select', eventArgs);\n }\n this.closePopup(e, this.activeElem[0]);\n }\n }\n }\n };\n DropDownButton.prototype.openPopUp = function (e) {\n if (e === void 0) { e = null; }\n if (!this.target) {\n this.getPopUpElement().appendChild(this.createItems(this.items));\n }\n var ul = this.getULElement();\n var beforeOpenArgs = { element: ul, items: this.items, event: e, cancel: false };\n this.trigger('beforeOpen', beforeOpenArgs);\n if (!beforeOpenArgs.cancel) {\n this.dropDown.show(null, this.element);\n addClass([this.element], 'e-active');\n this.element.setAttribute('aria-expanded', 'true');\n ul.focus();\n var openArgs = { element: ul, items: this.items };\n this.trigger('open', openArgs);\n }\n };\n DropDownButton.prototype.closePopup = function (e, focusEle) {\n if (e === void 0) { e = null; }\n var ul = this.getULElement();\n var beforeCloseArgs = { element: ul, items: this.items, event: e, cancel: false };\n this.trigger('beforeClose', beforeCloseArgs);\n if (!beforeCloseArgs.cancel) {\n this.removeCustomSelection();\n this.dropDown.hide();\n removeClass(this.activeElem, 'e-active');\n this.element.setAttribute('aria-expanded', 'false');\n if (focusEle) {\n focusEle.focus();\n }\n var closeArgs = { element: ul, items: this.items };\n this.trigger('close', closeArgs);\n if (!this.target && ul) {\n detach(ul);\n }\n }\n };\n DropDownButton.prototype.unWireEvents = function () {\n EventHandler.remove(document, 'mousedown touchstart', this.delegateMousedownHandler);\n EventHandler.remove(this.element, 'click', this.clickHandler);\n EventHandler.remove(this.getPopUpElement(), 'click', this.clickHandler);\n EventHandler.remove(this.element, 'keydown', this.keyBoardHandler);\n EventHandler.remove(this.getPopUpElement(), 'keydown', this.keyBoardHandler);\n this.rippleFn();\n };\n /**\n * Called internally if any of the property value changed.\n * @param {DropDownButtonModel} newProp\n * @param {DropDownButtonModel} oldProp\n * @returns void\n * @private\n */\n DropDownButton.prototype.onPropertyChanged = function (newProp, oldProp) {\n var btnModel = ['content', 'cssClass', 'iconCss', 'iconPosition', 'disabled', 'enableRtl'];\n this.button.setProperties(getModel(newProp, btnModel));\n this.dropDown.setProperties(getModel(newProp, ['enableRtl']));\n var popupElement = this.getPopUpElement();\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'content':\n if (!this.element.querySelector('span.e-caret')) {\n this.appendArrowSpan();\n }\n break;\n case 'disabled':\n if (newProp.disabled) {\n this.unWireEvents();\n if (!this.canOpen()) {\n this.closePopup();\n }\n }\n else {\n this.wireEvents();\n }\n break;\n case 'cssClass':\n if (newProp.cssClass.indexOf(classNames.VERTICAL) > -1) {\n var arrowSpan = this.element.querySelector('span.e-caret');\n classList(arrowSpan, ['e-icon-bottom'], ['e-icon-right']);\n }\n if (oldProp.cssClass) {\n removeClass([popupElement], oldProp.cssClass.split(' '));\n }\n if (newProp.cssClass) {\n addClass([popupElement], newProp.cssClass.split(' '));\n }\n break;\n case 'target':\n this.dropDown.content = this.getTargetElement();\n this.dropDown.dataBind();\n break;\n case 'items':\n this.dropDown.refresh();\n if (popupElement.classList.contains('e-popup-open')) {\n classList(popupElement, ['e-popup-close'], ['e-popup-open']);\n }\n break;\n }\n }\n };\n __decorate([\n Property('')\n ], DropDownButton.prototype, \"content\", void 0);\n __decorate([\n Property('')\n ], DropDownButton.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], DropDownButton.prototype, \"disabled\", void 0);\n __decorate([\n Property('')\n ], DropDownButton.prototype, \"iconCss\", void 0);\n __decorate([\n Property('Left')\n ], DropDownButton.prototype, \"iconPosition\", void 0);\n __decorate([\n Collection([], Item)\n ], DropDownButton.prototype, \"items\", void 0);\n __decorate([\n Property('')\n ], DropDownButton.prototype, \"target\", void 0);\n __decorate([\n Event()\n ], DropDownButton.prototype, \"beforeItemRender\", void 0);\n __decorate([\n Event()\n ], DropDownButton.prototype, \"beforeOpen\", void 0);\n __decorate([\n Event()\n ], DropDownButton.prototype, \"beforeClose\", void 0);\n __decorate([\n Event()\n ], DropDownButton.prototype, \"close\", void 0);\n __decorate([\n Event()\n ], DropDownButton.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], DropDownButton.prototype, \"select\", void 0);\n __decorate([\n Event()\n ], DropDownButton.prototype, \"created\", void 0);\n DropDownButton = __decorate([\n NotifyPropertyChanges\n ], DropDownButton);\n return DropDownButton;\n}(Component));\nexport { DropDownButton };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n/// \n * let dataManager: DataManager = new DataManager([{ ID: '10' }, { ID: '2' }, { ID: '1' }, { ID: '20' }]);\n * let query: Query = new Query();\n * query.sortBy('ID', (x: string, y: string): number => { return parseInt(x, 10) - parseInt(y, 10) });\n * let promise: Promise< Object > = query.execute(dataManager);\n * promise.then((e: { result: Object }) => { });\n * \n */\n Query.prototype.execute = function (dataManager, done, fail, always) {\n dataManager = dataManager || this.dataManager;\n if (dataManager) {\n return dataManager.executeQuery(this, done, fail, always);\n }\n return DataUtil.throwError('Query - execute() : dataManager needs to be is set using \"using\" function or should be passed as argument');\n };\n /**\n * Executes query with the local datasource.\n * @param {DataManager} dataManager - Defines the DataManager.\n */\n Query.prototype.executeLocal = function (dataManager) {\n dataManager = dataManager || this.dataManager;\n if (dataManager) {\n return dataManager.executeLocal(this);\n }\n return DataUtil.throwError('Query - executeLocal() : dataManager needs to be is set using \"using\" function or should be passed as argument');\n };\n /**\n * Creates deep copy of the Query object.\n */\n Query.prototype.clone = function () {\n var cloned = new Query();\n cloned.queries = this.queries.slice(0);\n cloned.key = this.key;\n cloned.isChild = this.isChild;\n cloned.dataManager = this.dataManager;\n cloned.fromTable = this.fromTable;\n cloned.params = this.params.slice(0);\n cloned.expands = this.expands.slice(0);\n cloned.sortedColumns = this.sortedColumns.slice(0);\n cloned.groupedColumns = this.groupedColumns.slice(0);\n cloned.subQuerySelector = this.subQuerySelector;\n cloned.subQuery = this.subQuery;\n cloned.fKey = this.fKey;\n cloned.isCountRequired = this.isCountRequired;\n cloned.distincts = this.distincts.slice(0);\n return cloned;\n };\n /**\n * Specifies the name of table to retrieve data in query execution.\n * @param {string} tableName - Defines the table name.\n */\n Query.prototype.from = function (tableName) {\n this.fromTable = tableName;\n return this;\n };\n /**\n * Adds additional parameter which will be sent along with the request which will be generated while DataManager execute.\n * @param {string} key - Defines the key of additional parameter.\n * @param {Function|string} value - Defines the value for the key.\n */\n Query.prototype.addParams = function (key, value) {\n if (typeof value === 'function') {\n this.params.push({ key: key, fn: value });\n }\n else {\n this.params.push({ key: key, value: value });\n }\n return this;\n };\n /**\n * @hidden\n */\n Query.prototype.distinct = function (fields) {\n if (typeof fields === 'string') {\n this.distincts = [].slice.call([fields], 0);\n }\n else {\n this.distincts = fields.slice(0);\n }\n return this;\n };\n /**\n * Expands the related table.\n * @param {string|Object[]} tables\n */\n Query.prototype.expand = function (tables) {\n if (typeof tables === 'string') {\n this.expands = [].slice.call([tables], 0);\n }\n else {\n this.expands = tables.slice(0);\n }\n return this;\n };\n /**\n * Filter data with given filter criteria.\n * @param {string|Predicate} fieldName - Defines the column field or Predicate.\n * @param {string} operator - Defines the operator how to filter data.\n * @param {string|number|boolean} value - Defines the values to match with data.\n * @param {boolean} ignoreCase - If ignore case set to false, then filter data with exact match or else\n * filter data with case insensitive.\n */\n Query.prototype.where = function (fieldName, operator, value, ignoreCase, ignoreAccent) {\n operator = operator ? (operator).toLowerCase() : null;\n var predicate = null;\n if (typeof fieldName === 'string') {\n predicate = new Predicate(fieldName, operator, value, ignoreCase, ignoreAccent);\n }\n else if (fieldName instanceof Predicate) {\n predicate = fieldName;\n }\n this.queries.push({\n fn: 'onWhere',\n e: predicate\n });\n return this;\n };\n /**\n * Search data with given search criteria.\n * @param {string|number|boolean} searchKey - Defines the search key.\n * @param {string|string[]} fieldNames - Defines the collection of column fields.\n * @param {string} operator - Defines the operator how to search data.\n * @param {boolean} ignoreCase - If ignore case set to false, then filter data with exact match or else\n * filter data with case insensitive.\n */\n Query.prototype.search = function (searchKey, fieldNames, operator, ignoreCase, ignoreAccent) {\n if (typeof fieldNames === 'string') {\n fieldNames = [fieldNames];\n }\n operator = operator || 'contains';\n var comparer = DataUtil.fnOperators[operator];\n this.queries.push({\n fn: 'onSearch',\n e: {\n fieldNames: fieldNames,\n operator: operator,\n searchKey: searchKey,\n ignoreCase: ignoreCase,\n ignoreAccent: ignoreAccent,\n comparer: comparer\n }\n });\n return this;\n };\n /**\n * Sort the data with given sort criteria.\n * By default, sort direction is ascending.\n * @param {string|string[]} fieldName - Defines the single or collection of column fields.\n * @param {string|Function} comparer - Defines the sort direction or custom sort comparer function.\n */\n Query.prototype.sortBy = function (fieldName, comparer, isFromGroup) {\n var order = 'ascending';\n var sorts;\n var temp;\n if (typeof fieldName === 'string' && DataUtil.endsWith(fieldName.toLowerCase(), ' desc')) {\n fieldName = fieldName.replace(/ desc$/i, '');\n comparer = 'descending';\n }\n if (!comparer || typeof comparer === 'string') {\n order = comparer ? comparer.toLowerCase() : 'ascending';\n comparer = DataUtil.fnSort(comparer);\n }\n if (isFromGroup) {\n sorts = Query.filterQueries(this.queries, 'onSortBy');\n for (var i = 0; i < sorts.length; i++) {\n temp = sorts[i].e.fieldName;\n if (typeof temp === 'string') {\n if (temp === fieldName) {\n return this;\n }\n }\n else if (temp instanceof Array) {\n for (var j = 0; j < temp.length; j++) {\n if (temp[j] === fieldName || fieldName.toLowerCase() === temp[j] + ' desc') {\n return this;\n }\n }\n }\n }\n }\n this.queries.push({\n fn: 'onSortBy',\n e: {\n fieldName: fieldName,\n comparer: comparer,\n direction: order\n }\n });\n return this;\n };\n /**\n * Sorts data in descending order.\n * @param {string} fieldName - Defines the column field.\n */\n Query.prototype.sortByDesc = function (fieldName) {\n return this.sortBy(fieldName, 'descending');\n };\n /**\n * Groups data with the given field name.\n * @param {string} fieldName - Defines the column field.\n */\n Query.prototype.group = function (fieldName, fn, format) {\n this.sortBy(fieldName, null, true);\n this.queries.push({\n fn: 'onGroup',\n e: {\n fieldName: fieldName,\n comparer: fn ? fn : null,\n format: format ? format : null\n }\n });\n return this;\n };\n /**\n * Gets data based on the given page index and size.\n * @param {number} pageIndex - Defines the current page index.\n * @param {number} pageSize - Defines the no of records per page.\n */\n Query.prototype.page = function (pageIndex, pageSize) {\n this.queries.push({\n fn: 'onPage',\n e: {\n pageIndex: pageIndex,\n pageSize: pageSize\n }\n });\n return this;\n };\n /**\n * Gets data based on the given start and end index.\n * @param {number} start - Defines the start index of the datasource.\n * @param {number} end - Defines the end index of the datasource.\n */\n Query.prototype.range = function (start, end) {\n this.queries.push({\n fn: 'onRange',\n e: {\n start: start,\n end: end\n }\n });\n return this;\n };\n /**\n * Gets data from the top of the data source based on given number of records count.\n * @param {number} nos - Defines the no of records to retrieve from datasource.\n */\n Query.prototype.take = function (nos) {\n this.queries.push({\n fn: 'onTake',\n e: {\n nos: nos\n }\n });\n return this;\n };\n /**\n * Skips data with given number of records count from the top of the data source.\n * @param {number} nos - Defines the no of records skip in the datasource.\n */\n Query.prototype.skip = function (nos) {\n this.queries.push({\n fn: 'onSkip',\n e: { nos: nos }\n });\n return this;\n };\n /**\n * Selects specified columns from the data source.\n * @param {string|string[]} fieldNames - Defines the collection of column fields.\n */\n Query.prototype.select = function (fieldNames) {\n if (typeof fieldNames === 'string') {\n fieldNames = [].slice.call([fieldNames], 0);\n }\n this.queries.push({\n fn: 'onSelect',\n e: { fieldNames: fieldNames }\n });\n return this;\n };\n /**\n * Gets the records in hierarchical relationship from two tables. It requires the foreign key to relate two tables.\n * @param {Query} query - Defines the query to relate two tables.\n * @param {Function} selectorFn - Defines the custom function to select records.\n */\n Query.prototype.hierarchy = function (query, selectorFn) {\n this.subQuerySelector = selectorFn;\n this.subQuery = query;\n return this;\n };\n /**\n * Sets the foreign key which is used to get data from the related table.\n * @param {string} key - Defines the foreign key.\n */\n Query.prototype.foreignKey = function (key) {\n this.fKey = key;\n return this;\n };\n /**\n * It is used to get total number of records in the DataManager execution result.\n */\n Query.prototype.requiresCount = function () {\n this.isCountRequired = true;\n return this;\n };\n //type - sum, avg, min, max\n /**\n * Aggregate the data with given type and field name.\n * @param {string} type - Defines the aggregate type.\n * @param {string} field - Defines the column field to aggregate.\n */\n Query.prototype.aggregate = function (type, field) {\n this.queries.push({\n fn: 'onAggregates',\n e: { field: field, type: type }\n });\n return this;\n };\n /**\n * Pass array of filterColumn query for performing filter operation.\n * @param {QueryOptions[]} queries\n * @param {string} name\n * @hidden\n */\n Query.filterQueries = function (queries, name) {\n return queries.filter(function (q) {\n return q.fn === name;\n });\n };\n /**\n * To get the list of queries which is already filtered in current data source.\n * @param {Object[]} queries\n * @param {string[]} singles\n * @hidden\n */\n Query.filterQueryLists = function (queries, singles) {\n var filtered = queries.filter(function (q) {\n return singles.indexOf(q.fn) !== -1;\n });\n var res = {};\n for (var i = 0; i < filtered.length; i++) {\n if (!res[filtered[i].fn]) {\n res[filtered[i].fn] = filtered[i].e;\n }\n }\n return res;\n };\n return Query;\n}());\nexport { Query };\n/**\n * Predicate class is used to generate complex filter criteria.\n * This will be used by DataManager to perform multiple filtering operation.\n */\nvar Predicate = /** @class */ (function () {\n /**\n * Constructor for Predicate class.\n * @param {string|Predicate} field\n * @param {string} operator\n * @param {string|number|boolean|Predicate|Predicate[]} value\n * @param {boolean=false} ignoreCase\n * @hidden\n */\n function Predicate(field, operator, value, ignoreCase, ignoreAccent) {\n if (ignoreCase === void 0) { ignoreCase = false; }\n /** @hidden */\n this.ignoreAccent = false;\n /** @hidden */\n this.isComplex = false;\n if (typeof field === 'string') {\n this.field = field;\n this.operator = operator.toLowerCase();\n this.value = value;\n this.ignoreCase = ignoreCase;\n this.ignoreAccent = ignoreAccent;\n this.isComplex = false;\n this.comparer = DataUtil.fnOperators.processOperator(this.operator);\n }\n else if (field instanceof Predicate && value instanceof Predicate || value instanceof Array) {\n this.isComplex = true;\n this.condition = operator.toLowerCase();\n this.predicates = [field];\n if (value instanceof Array) {\n [].push.apply(this.predicates, value);\n }\n else {\n this.predicates.push(value);\n }\n }\n return this;\n }\n /**\n * Adds n-number of new predicates on existing predicate with “and” condition.\n * @param {Object[]} args - Defines the collection of predicates.\n */\n Predicate.and = function () {\n var args = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n args[_i] = arguments[_i];\n }\n return Predicate.combinePredicates([].slice.call(args, 0), 'and');\n };\n /**\n * Adds new predicate on existing predicate with “and” condition.\n * @param {string} field - Defines the column field.\n * @param {string} operator - Defines the operator how to filter data.\n * @param {string} value - Defines the values to match with data.\n * @param {boolean} ignoreCase? - If ignore case set to false, then filter data with exact match or else\n * filter data with case insensitive.\n */\n Predicate.prototype.and = function (field, operator, value, ignoreCase, ignoreAccent) {\n return Predicate.combine(this, field, operator, value, 'and', ignoreCase, ignoreAccent);\n };\n /**\n * Adds n-number of new predicates on existing predicate with “or” condition.\n * @param {Object[]} args - Defines the collection of predicates.\n */\n Predicate.or = function () {\n var args = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n args[_i] = arguments[_i];\n }\n return Predicate.combinePredicates([].slice.call(args, 0), 'or');\n };\n /**\n * Adds new predicate on existing predicate with “or” condition.\n * @param {string} field - Defines the column field.\n * @param {string} operator - Defines the operator how to filter data.\n * @param {string} value - Defines the values to match with data.\n * @param {boolean} ignoreCase? - If ignore case set to false, then filter data with exact match or else\n * filter data with case insensitive.\n */\n Predicate.prototype.or = function (field, operator, value, ignoreCase, ignoreAccent) {\n return Predicate.combine(this, field, operator, value, 'or', ignoreCase, ignoreAccent);\n };\n /**\n * Converts plain JavaScript object to Predicate object.\n * @param {Predicate[]|Predicate} json - Defines single or collection of Predicate.\n */\n Predicate.fromJson = function (json) {\n if (json instanceof Array) {\n var res = [];\n for (var i = 0, len = json.length; i < len; i++) {\n res.push(this.fromJSONData(json[i]));\n }\n return res;\n }\n var pred = json;\n return this.fromJSONData(pred);\n };\n /**\n * Validate the record based on the predicates.\n * @param {Object} record - Defines the datasource record.\n */\n Predicate.prototype.validate = function (record) {\n var predicate = this.predicates ? this.predicates : [];\n var isAnd;\n var ret;\n if (!this.isComplex && this.comparer) {\n return this.comparer.call(this, DataUtil.getObject(this.field, record), this.value, this.ignoreCase, this.ignoreAccent);\n }\n isAnd = this.condition === 'and';\n for (var i = 0; i < predicate.length; i++) {\n ret = predicate[i].validate(record);\n if (isAnd) {\n if (!ret) {\n return false;\n }\n }\n else {\n if (ret) {\n return true;\n }\n }\n }\n return isAnd;\n };\n /**\n * Converts predicates to plain JavaScript.\n * This method is uses Json stringify when serializing Predicate object.\n */\n Predicate.prototype.toJson = function () {\n var predicates;\n var p;\n if (this.isComplex) {\n predicates = [];\n p = this.predicates;\n for (var i = 0; i < p.length; i++) {\n predicates.push(p[i].toJson());\n }\n }\n return {\n isComplex: this.isComplex,\n field: this.field,\n operator: this.operator,\n value: this.value,\n ignoreCase: this.ignoreCase,\n ignoreAccent: this.ignoreAccent,\n condition: this.condition,\n predicates: predicates\n };\n };\n Predicate.combinePredicates = function (predicates, operator) {\n if (predicates.length === 1) {\n if (!(predicates[0] instanceof Array)) {\n return predicates[0];\n }\n predicates = predicates[0];\n }\n return new Predicate(predicates[0], operator, predicates.slice(1));\n };\n Predicate.combine = function (pred, field, operator, value, condition, ignoreCase, ignoreAccent) {\n if (field instanceof Predicate) {\n return Predicate[condition](pred, field);\n }\n if (typeof field === 'string') {\n return Predicate[condition](pred, new Predicate(field, operator, value, ignoreCase, ignoreAccent));\n }\n return DataUtil.throwError('Predicate - ' + condition + ' : invalid arguments');\n };\n Predicate.fromJSONData = function (json) {\n var preds = json.predicates || [];\n var len = preds.length;\n var predicates = [];\n var result;\n for (var i = 0; i < len; i++) {\n predicates.push(this.fromJSONData(preds[i]));\n }\n if (!json.isComplex) {\n result = new Predicate(json.field, json.operator, json.value, json.ignoreCase, json.ignoreAccent);\n }\n else {\n result = new Predicate(predicates[0], json.condition, predicates.slice(1));\n }\n return result;\n };\n return Predicate;\n}());\nexport { Predicate };\n","import { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { DataManager } from './manager';\nimport { Query } from './query';\nvar consts = { GroupGuid: '{271bbba0-1ee7}' };\n/**\n * Data manager common utility methods.\n * @hidden\n */\nvar DataUtil = /** @class */ (function () {\n function DataUtil() {\n }\n /**\n * Returns the value by invoking the provided parameter function.\n * If the paramater is not of type function then it will be returned as it is.\n * @param {Function|string|string[]|number} value\n * @param {Object} inst?\n * @hidden\n */\n DataUtil.getValue = function (value, inst) {\n if (typeof value === 'function') {\n return value.call(inst || {});\n }\n return value;\n };\n /**\n * Returns true if the input string ends with given string.\n * @param {string} input\n * @param {string} substr\n */\n DataUtil.endsWith = function (input, substr) {\n return input.slice(-substr.length) === substr;\n };\n /**\n * Returns true if the input string starts with given string.\n * @param {string} str\n * @param {string} startstr\n */\n DataUtil.startsWith = function (input, start) {\n return input.slice(0, start.length) === start;\n };\n /**\n * To return the sorting function based on the string.\n * @param {string} order\n * @hidden\n */\n DataUtil.fnSort = function (order) {\n order = order ? DataUtil.toLowerCase(order) : 'ascending';\n if (order === 'ascending') {\n return this.fnAscending;\n }\n return this.fnDescending;\n };\n /**\n * Comparer function which is used to sort the data in ascending order.\n * @param {string|number} x\n * @param {string|number} y\n * @returns number\n */\n DataUtil.fnAscending = function (x, y) {\n if (y === null || y === undefined) {\n return -1;\n }\n if (typeof x === 'string') {\n return x.localeCompare(y);\n }\n if (x === null || x === undefined) {\n return 1;\n }\n return x - y;\n };\n /**\n * Comparer function which is used to sort the data in descending order.\n * @param {string|number} x\n * @param {string|number} y\n * @returns number\n */\n DataUtil.fnDescending = function (x, y) {\n if (y === null || y === undefined) {\n return 1;\n }\n if (typeof x === 'string') {\n return x.localeCompare(y) * -1;\n }\n if (x === null || x === undefined) {\n return -1;\n }\n return y - x;\n };\n DataUtil.extractFields = function (obj, fields) {\n var newObj = {};\n for (var i = 0; i < fields.length; i++) {\n newObj = this.setValue(fields[i], this.getObject(fields[i], obj), newObj);\n }\n return newObj;\n };\n /**\n * Select objects by given fields from jsonArray.\n * @param {Object[]} jsonArray\n * @param {string[]} fields\n */\n DataUtil.select = function (jsonArray, fields) {\n var newData = [];\n for (var i = 0; i < jsonArray.length; i++) {\n newData.push(this.extractFields(jsonArray[i], fields));\n }\n return newData;\n };\n /**\n * Group the input data based on the field name.\n * It also performs aggregation of the grouped records based on the aggregates paramater.\n * @param {Object[]} jsonArray\n * @param {string} field?\n * @param {Object[]} agg?\n * @param {number} level?\n * @param {Object[]} groupDs?\n */\n DataUtil.group = function (jsonArray, field, aggregates, level, groupDs, format) {\n level = level || 1;\n var jsonData = jsonArray;\n var guid = 'GroupGuid';\n if (jsonData.GroupGuid === consts[guid]) {\n var _loop_1 = function (j) {\n if (!isNullOrUndefined(groupDs)) {\n var indx = -1;\n var temp = groupDs.filter(function (e) { return e.key === jsonData[j].key; });\n indx = groupDs.indexOf(temp[0]);\n jsonData[j].items = this_1.group(jsonData[j].items, field, aggregates, jsonData.level + 1, groupDs[indx].items, format);\n jsonData[j].count = groupDs[indx].count;\n }\n else {\n jsonData[j].items = this_1.group(jsonData[j].items, field, aggregates, jsonData.level + 1, null, format);\n jsonData[j].count = jsonData[j].items.length;\n }\n };\n var this_1 = this;\n for (var j = 0; j < jsonData.length; j++) {\n _loop_1(j);\n }\n jsonData.childLevels += 1;\n return jsonData;\n }\n var grouped = {};\n var groupedArray = [];\n groupedArray.GroupGuid = consts[guid];\n groupedArray.level = level;\n groupedArray.childLevels = 0;\n groupedArray.records = jsonData;\n var _loop_2 = function (i) {\n var val = this_2.getVal(jsonData, i, field);\n if (!isNullOrUndefined(format)) {\n val = format(val, field);\n }\n if (!grouped[val]) {\n grouped[val] = {\n key: val,\n count: 0,\n items: [],\n aggregates: {},\n field: field\n };\n groupedArray.push(grouped[val]);\n if (!isNullOrUndefined(groupDs)) {\n var tempObj = groupDs.filter(function (e) { return e.key === grouped[val].key; });\n grouped[val].count = tempObj[0].count;\n }\n }\n grouped[val].count = !isNullOrUndefined(groupDs) ? grouped[val].count : grouped[val].count += 1;\n grouped[val].items.push(jsonData[i]);\n };\n var this_2 = this;\n for (var i = 0; i < jsonData.length; i++) {\n _loop_2(i);\n }\n if (aggregates && aggregates.length) {\n var _loop_3 = function (i) {\n var res = {};\n var fn = void 0;\n var aggs = aggregates;\n for (var j = 0; j < aggregates.length; j++) {\n fn = DataUtil.aggregates[aggregates[j].type];\n if (!isNullOrUndefined(groupDs)) {\n var temp = groupDs.filter(function (e) { return e.key === groupedArray[i].key; });\n if (fn) {\n res[aggs[j].field + ' - ' + aggs[j].type] = fn(temp[0].items, aggs[j].field);\n }\n }\n else {\n if (fn) {\n res[aggs[j].field + ' - ' + aggs[j].type] = fn(groupedArray[i].items, aggs[j].field);\n }\n }\n }\n groupedArray[i].aggregates = res;\n };\n for (var i = 0; i < groupedArray.length; i++) {\n _loop_3(i);\n }\n }\n return jsonData.length && groupedArray || jsonData;\n };\n /**\n * It is used to categorize the multiple items based on a specific field in jsonArray.\n * The hierarchical queries are commonly required when you use foreign key binding.\n * @param {string} fKey\n * @param {string} from\n * @param {Object[]} source\n * @param {Group} lookup?\n * @param {string} pKey?\n * @hidden\n */\n DataUtil.buildHierarchy = function (fKey, from, source, lookup, pKey) {\n var i;\n var grp = {};\n var temp;\n if (lookup.result) {\n lookup = lookup.result;\n }\n if (lookup.GroupGuid) {\n this.throwError('DataManager: Do not have support Grouping in hierarchy');\n }\n for (i = 0; i < lookup.length; i++) {\n var fKeyData = this.getObject(fKey, lookup[i]);\n temp = grp[fKeyData] || (grp[fKeyData] = []);\n temp.push(lookup[i]);\n }\n for (i = 0; i < source.length; i++) {\n var fKeyData = this.getObject(pKey || fKey, source[i]);\n source[i][from] = grp[fKeyData];\n }\n };\n /**\n * The method used to get the field names which started with specified characters.\n * @param {Object} obj\n * @param {string[]} fields?\n * @param {string} prefix?\n * @hidden\n */\n DataUtil.getFieldList = function (obj, fields, prefix) {\n if (prefix === undefined) {\n prefix = '';\n }\n if (fields === undefined || fields === null) {\n return this.getFieldList(obj, [], prefix);\n }\n var copyObj = obj;\n var keys = Object.keys(obj);\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var prop = keys_1[_i];\n if (typeof copyObj[prop] === 'object' && !(copyObj[prop] instanceof Array)) {\n this.getFieldList(copyObj[prop], fields, prefix + prop + '.');\n }\n else {\n fields.push(prefix + prop);\n }\n }\n return fields;\n };\n /**\n * Gets the value of the property in the given object.\n * The complex object can be accessed by providing the field names concatenated with dot(.).\n * @param {string} nameSpace - The name of the property to be accessed.\n * @param {Object} from - Defines the source object.\n */\n DataUtil.getObject = function (nameSpace, from) {\n if (!nameSpace) {\n return from;\n }\n if (!from) {\n return undefined;\n }\n if (nameSpace.indexOf('.') === -1) {\n return from[nameSpace];\n }\n var value = from;\n var splits = nameSpace.split('.');\n for (var i = 0; i < splits.length; i++) {\n if (value == null) {\n break;\n }\n value = value[splits[i]];\n }\n return value;\n };\n /**\n * To set value for the nameSpace in desired object.\n * @param {string} nameSpace - String value to the get the inner object.\n * @param {Object} value - Value that you need to set.\n * @param {Object} obj - Object to get the inner object value.\n * @return { [key: string]: Object; } | Object\n * @hidden\n */\n DataUtil.setValue = function (nameSpace, value, obj) {\n var keys = nameSpace.toString().split('.');\n var start = obj || {};\n var fromObj = start;\n var i;\n var length = keys.length;\n var key;\n for (i = 0; i < length; i++) {\n key = keys[i];\n if (i + 1 === length) {\n fromObj[key] = value === undefined ? undefined : value;\n }\n else if (isNullOrUndefined(fromObj[key])) {\n fromObj[key] = {};\n }\n fromObj = fromObj[key];\n }\n return start;\n };\n /**\n * Sort the given data based on the field and comparer.\n * @param {Object[]} ds - Defines the input data.\n * @param {string} field - Defines the field to be sorted.\n * @param {Function} comparer - Defines the comparer function used to sort the records.\n */\n DataUtil.sort = function (ds, field, comparer) {\n if (ds.length <= 1) {\n return ds;\n }\n var middle = parseInt((ds.length / 2).toString(), 10);\n var left = ds.slice(0, middle);\n var right = ds.slice(middle);\n left = this.sort(left, field, comparer);\n right = this.sort(right, field, comparer);\n return this.merge(left, right, field, comparer);\n };\n DataUtil.ignoreDiacritics = function (value) {\n if (typeof value !== 'string') {\n return value;\n }\n var result = value.split('');\n var newValue = result.map(function (temp) { return temp in DataUtil.diacritics ? DataUtil.diacritics[temp] : temp; });\n return newValue.join('');\n };\n DataUtil.merge = function (left, right, fieldName, comparer) {\n var result = [];\n var current;\n while (left.length > 0 || right.length > 0) {\n if (left.length > 0 && right.length > 0) {\n if (comparer) {\n current = comparer(this.getVal(left, 0, fieldName), this.getVal(right, 0, fieldName)) <= 0 ? left : right;\n }\n else {\n current = left[0][fieldName] < left[0][fieldName] ? left : right;\n }\n }\n else {\n current = left.length > 0 ? left : right;\n }\n result.push(current.shift());\n }\n return result;\n };\n DataUtil.getVal = function (array, index, field) {\n return field ? this.getObject(field, array[index]) : array[index];\n };\n DataUtil.toLowerCase = function (val) {\n return val ? typeof val === 'string' ? val.toLowerCase() : val.toString() : (val === 0 || val === false) ? val.toString() : '';\n };\n /**\n * To perform the filter operation with specified adaptor and returns the result.\n * @param {Object} adaptor\n * @param {string} fnName\n * @param {Object} param1?\n * @param {Object} param2?\n * @hidden\n */\n DataUtil.callAdaptorFunction = function (adaptor, fnName, param1, param2) {\n if (fnName in adaptor) {\n var res = adaptor[fnName](param1, param2);\n if (!isNullOrUndefined(res)) {\n param1 = res;\n }\n }\n return param1;\n };\n DataUtil.getAddParams = function (adp, dm, query) {\n var req = {};\n DataUtil.callAdaptorFunction(adp, 'addParams', {\n dm: dm,\n query: query,\n params: query.params,\n reqParams: req\n });\n return req;\n };\n /**\n * Checks wheather the given input is a plain object or not.\n * @param {Object|Object[]} obj\n */\n DataUtil.isPlainObject = function (obj) {\n return (!!obj) && (obj.constructor === Object);\n };\n /**\n * Returns true when the browser cross origin request.\n */\n DataUtil.isCors = function () {\n var xhr = null;\n var request = 'XMLHttpRequest';\n try {\n xhr = new window[request]();\n }\n catch (e) {\n // No exception handling\n }\n return !!xhr && ('withCredentials' in xhr);\n };\n /**\n * Generate random GUID value which will be prefixed with the given value.\n * @param {string} prefix\n */\n DataUtil.getGuid = function (prefix) {\n var hexs = '0123456789abcdef';\n var rand;\n return (prefix || '') + '00000000-0000-4000-0000-000000000000'.replace(/0/g, function (val, i) {\n if ('crypto' in window && 'getRandomValues' in crypto) {\n var arr = new Uint8Array(1);\n window.crypto.getRandomValues(arr);\n rand = arr[0] % 16 | 0;\n }\n else {\n rand = Math.random() * 16 | 0;\n }\n return hexs[i === 19 ? rand & 0x3 | 0x8 : rand];\n });\n };\n /**\n * Checks wheather the given value is null or not.\n * @param {string|Object} val\n * @returns boolean\n */\n DataUtil.isNull = function (val) {\n return val === undefined || val === null;\n };\n /**\n * To get the required items from collection of objects.\n * @param {Object[]} array\n * @param {string} field\n * @param {Function} comparer\n * @returns Object\n * @hidden\n */\n DataUtil.getItemFromComparer = function (array, field, comparer) {\n var keyVal;\n var current;\n var key;\n var i = 0;\n var castRequired = typeof DataUtil.getVal(array, 0, field) === 'string';\n if (array.length) {\n while (isNullOrUndefined(keyVal) && i < array.length) {\n keyVal = DataUtil.getVal(array, i, field);\n key = array[i++];\n }\n }\n for (; i < array.length; i++) {\n current = DataUtil.getVal(array, i, field);\n if (isNullOrUndefined(current)) {\n continue;\n }\n if (castRequired) {\n keyVal = +keyVal;\n current = +current;\n }\n if (comparer(keyVal, current) > 0) {\n keyVal = current;\n key = array[i];\n }\n }\n return key;\n };\n /**\n * To get distinct values of Array or Array of Objects.\n * @param {Object[]} json\n * @param {string} field\n * @param {boolean} requiresCompleteRecord\n * @returns Object[]\n * * distinct array of objects is return when requiresCompleteRecord set as true.\n * @hidden\n */\n DataUtil.distinct = function (json, fieldName, requiresCompleteRecord) {\n requiresCompleteRecord = isNullOrUndefined(requiresCompleteRecord) ? false : requiresCompleteRecord;\n var result = [];\n var val;\n var tmp = {};\n json.forEach(function (data, index) {\n val = DataUtil.getVal(json, index, fieldName);\n if (!(val in tmp)) {\n result.push(!requiresCompleteRecord ? val : json[index]);\n tmp[val] = 1;\n }\n });\n return result;\n };\n /**\n * Specifies the value which will be used to adjust the date value to server timezone.\n * @default null\n */\n DataUtil.serverTimezoneOffset = null;\n /**\n * Throw error with the given string as message.\n * @param {string} er\n */\n DataUtil.throwError = function (error) {\n try {\n throw new Error(error);\n }\n catch (e) {\n throw e.message + '\\n' + e.stack;\n }\n };\n DataUtil.aggregates = {\n /**\n * Calculate sum of the given field in the data.\n * @param {Object[]} ds\n * @param {string} field\n */\n sum: function (ds, field) {\n var result = 0;\n var val;\n var castRequired = typeof DataUtil.getVal(ds, 0, field) !== 'number';\n for (var i = 0; i < ds.length; i++) {\n val = DataUtil.getVal(ds, i, field);\n if (!isNaN(val) && val !== null) {\n if (castRequired) {\n val = +val;\n }\n result += val;\n }\n }\n return result;\n },\n /**\n * Calculate average value of the given field in the data.\n * @param {Object[]} ds\n * @param {string} field\n */\n average: function (ds, field) {\n return DataUtil.aggregates.sum(ds, field) / ds.length;\n },\n /**\n * Returns the min value of the data based on the field.\n * @param {Object[]} ds\n * @param {string|Function} field\n */\n min: function (ds, field) {\n var comparer;\n if (typeof field === 'function') {\n comparer = field;\n field = null;\n }\n return DataUtil.getObject(field, DataUtil.getItemFromComparer(ds, field, comparer || DataUtil.fnAscending));\n },\n /**\n * Returns the max value of the data based on the field.\n * @param {Object[]} ds\n * @param {string} field\n * @returns number\n */\n max: function (ds, field) {\n var comparer;\n if (typeof field === 'function') {\n comparer = field;\n field = null;\n }\n return DataUtil.getObject(field, DataUtil.getItemFromComparer(ds, field, comparer || DataUtil.fnDescending));\n },\n /**\n * Returns the total number of true value present in the data based on the given boolean field name.\n * @param {Object[]} ds\n * @param {string} field\n */\n truecount: function (ds, field) {\n return new DataManager(ds).executeLocal(new Query().where(field, 'equal', true, true)).length;\n },\n /**\n * Returns the total number of false value present in the data based on the given boolean field name.\n * @param {Object[]} ds\n * @param {string} field\n */\n falsecount: function (ds, field) {\n return new DataManager(ds).executeLocal(new Query().where(field, 'equal', false, true)).length;\n },\n /**\n * Returns the length of the given data.\n * @param {Object[]} ds\n * @param {string} field?\n * @returns number\n */\n count: function (ds, field) {\n return ds.length;\n }\n };\n /**\n * Specifies the Object with filter operators.\n */\n DataUtil.operatorSymbols = {\n '<': 'lessthan',\n '>': 'greaterthan',\n '<=': 'lessthanorequal',\n '>=': 'greaterthanorequal',\n '==': 'equal',\n '!=': 'notequal',\n '*=': 'contains',\n '$=': 'endswith',\n '^=': 'startswith'\n };\n /**\n * Specifies the Object with filter operators which will be used for OData filter query generation.\n * * It will be used for date/number type filter query.\n */\n DataUtil.odBiOperator = {\n '<': ' lt ',\n '>': ' gt ',\n '<=': ' le ',\n '>=': ' ge ',\n '==': ' eq ',\n '!=': ' ne ',\n 'lessthan': ' lt ',\n 'lessthanorequal': ' le ',\n 'greaterthan': ' gt ',\n 'greaterthanorequal': ' ge ',\n 'equal': ' eq ',\n 'notequal': ' ne '\n };\n /**\n * Specifies the Object with filter operators which will be used for OData filter query generation.\n * It will be used for string type filter query.\n */\n DataUtil.odUniOperator = {\n '$=': 'endswith',\n '^=': 'startswith',\n '*=': 'substringof',\n 'endswith': 'endswith',\n 'startswith': 'startswith',\n 'contains': 'substringof'\n };\n /**\n * Specifies the Object with filter operators which will be used for ODataV4 filter query generation.\n * It will be used for string type filter query.\n */\n DataUtil.odv4UniOperator = {\n '$=': 'endswith',\n '^=': 'startswith',\n '*=': 'contains',\n 'endswith': 'endswith',\n 'startswith': 'startswith',\n 'contains': 'contains'\n };\n DataUtil.diacritics = {\n '\\u24B6': 'A',\n '\\uFF21': 'A',\n '\\u00C0': 'A',\n '\\u00C1': 'A',\n '\\u00C2': 'A',\n '\\u1EA6': 'A',\n '\\u1EA4': 'A',\n '\\u1EAA': 'A',\n '\\u1EA8': 'A',\n '\\u00C3': 'A',\n '\\u0100': 'A',\n '\\u0102': 'A',\n '\\u1EB0': 'A',\n '\\u1EAE': 'A',\n '\\u1EB4': 'A',\n '\\u1EB2': 'A',\n '\\u0226': 'A',\n '\\u01E0': 'A',\n '\\u00C4': 'A',\n '\\u01DE': 'A',\n '\\u1EA2': 'A',\n '\\u00C5': 'A',\n '\\u01FA': 'A',\n '\\u01CD': 'A',\n '\\u0200': 'A',\n '\\u0202': 'A',\n '\\u1EA0': 'A',\n '\\u1EAC': 'A',\n '\\u1EB6': 'A',\n '\\u1E00': 'A',\n '\\u0104': 'A',\n '\\u023A': 'A',\n '\\u2C6F': 'A',\n '\\uA732': 'AA',\n '\\u00C6': 'AE',\n '\\u01FC': 'AE',\n '\\u01E2': 'AE',\n '\\uA734': 'AO',\n '\\uA736': 'AU',\n '\\uA738': 'AV',\n '\\uA73A': 'AV',\n '\\uA73C': 'AY',\n '\\u24B7': 'B',\n '\\uFF22': 'B',\n '\\u1E02': 'B',\n '\\u1E04': 'B',\n '\\u1E06': 'B',\n '\\u0243': 'B',\n '\\u0182': 'B',\n '\\u0181': 'B',\n '\\u24B8': 'C',\n '\\uFF23': 'C',\n '\\u0106': 'C',\n '\\u0108': 'C',\n '\\u010A': 'C',\n '\\u010C': 'C',\n '\\u00C7': 'C',\n '\\u1E08': 'C',\n '\\u0187': 'C',\n '\\u023B': 'C',\n '\\uA73E': 'C',\n '\\u24B9': 'D',\n '\\uFF24': 'D',\n '\\u1E0A': 'D',\n '\\u010E': 'D',\n '\\u1E0C': 'D',\n '\\u1E10': 'D',\n '\\u1E12': 'D',\n '\\u1E0E': 'D',\n '\\u0110': 'D',\n '\\u018B': 'D',\n '\\u018A': 'D',\n '\\u0189': 'D',\n '\\uA779': 'D',\n '\\u01F1': 'DZ',\n '\\u01C4': 'DZ',\n '\\u01F2': 'Dz',\n '\\u01C5': 'Dz',\n '\\u24BA': 'E',\n '\\uFF25': 'E',\n '\\u00C8': 'E',\n '\\u00C9': 'E',\n '\\u00CA': 'E',\n '\\u1EC0': 'E',\n '\\u1EBE': 'E',\n '\\u1EC4': 'E',\n '\\u1EC2': 'E',\n '\\u1EBC': 'E',\n '\\u0112': 'E',\n '\\u1E14': 'E',\n '\\u1E16': 'E',\n '\\u0114': 'E',\n '\\u0116': 'E',\n '\\u00CB': 'E',\n '\\u1EBA': 'E',\n '\\u011A': 'E',\n '\\u0204': 'E',\n '\\u0206': 'E',\n '\\u1EB8': 'E',\n '\\u1EC6': 'E',\n '\\u0228': 'E',\n '\\u1E1C': 'E',\n '\\u0118': 'E',\n '\\u1E18': 'E',\n '\\u1E1A': 'E',\n '\\u0190': 'E',\n '\\u018E': 'E',\n '\\u24BB': 'F',\n '\\uFF26': 'F',\n '\\u1E1E': 'F',\n '\\u0191': 'F',\n '\\uA77B': 'F',\n '\\u24BC': 'G',\n '\\uFF27': 'G',\n '\\u01F4': 'G',\n '\\u011C': 'G',\n '\\u1E20': 'G',\n '\\u011E': 'G',\n '\\u0120': 'G',\n '\\u01E6': 'G',\n '\\u0122': 'G',\n '\\u01E4': 'G',\n '\\u0193': 'G',\n '\\uA7A0': 'G',\n '\\uA77D': 'G',\n '\\uA77E': 'G',\n '\\u24BD': 'H',\n '\\uFF28': 'H',\n '\\u0124': 'H',\n '\\u1E22': 'H',\n '\\u1E26': 'H',\n '\\u021E': 'H',\n '\\u1E24': 'H',\n '\\u1E28': 'H',\n '\\u1E2A': 'H',\n '\\u0126': 'H',\n '\\u2C67': 'H',\n '\\u2C75': 'H',\n '\\uA78D': 'H',\n '\\u24BE': 'I',\n '\\uFF29': 'I',\n '\\u00CC': 'I',\n '\\u00CD': 'I',\n '\\u00CE': 'I',\n '\\u0128': 'I',\n '\\u012A': 'I',\n '\\u012C': 'I',\n '\\u0130': 'I',\n '\\u00CF': 'I',\n '\\u1E2E': 'I',\n '\\u1EC8': 'I',\n '\\u01CF': 'I',\n '\\u0208': 'I',\n '\\u020A': 'I',\n '\\u1ECA': 'I',\n '\\u012E': 'I',\n '\\u1E2C': 'I',\n '\\u0197': 'I',\n '\\u24BF': 'J',\n '\\uFF2A': 'J',\n '\\u0134': 'J',\n '\\u0248': 'J',\n '\\u24C0': 'K',\n '\\uFF2B': 'K',\n '\\u1E30': 'K',\n '\\u01E8': 'K',\n '\\u1E32': 'K',\n '\\u0136': 'K',\n '\\u1E34': 'K',\n '\\u0198': 'K',\n '\\u2C69': 'K',\n '\\uA740': 'K',\n '\\uA742': 'K',\n '\\uA744': 'K',\n '\\uA7A2': 'K',\n '\\u24C1': 'L',\n '\\uFF2C': 'L',\n '\\u013F': 'L',\n '\\u0139': 'L',\n '\\u013D': 'L',\n '\\u1E36': 'L',\n '\\u1E38': 'L',\n '\\u013B': 'L',\n '\\u1E3C': 'L',\n '\\u1E3A': 'L',\n '\\u0141': 'L',\n '\\u023D': 'L',\n '\\u2C62': 'L',\n '\\u2C60': 'L',\n '\\uA748': 'L',\n '\\uA746': 'L',\n '\\uA780': 'L',\n '\\u01C7': 'LJ',\n '\\u01C8': 'Lj',\n '\\u24C2': 'M',\n '\\uFF2D': 'M',\n '\\u1E3E': 'M',\n '\\u1E40': 'M',\n '\\u1E42': 'M',\n '\\u2C6E': 'M',\n '\\u019C': 'M',\n '\\u24C3': 'N',\n '\\uFF2E': 'N',\n '\\u01F8': 'N',\n '\\u0143': 'N',\n '\\u00D1': 'N',\n '\\u1E44': 'N',\n '\\u0147': 'N',\n '\\u1E46': 'N',\n '\\u0145': 'N',\n '\\u1E4A': 'N',\n '\\u1E48': 'N',\n '\\u0220': 'N',\n '\\u019D': 'N',\n '\\uA790': 'N',\n '\\uA7A4': 'N',\n '\\u01CA': 'NJ',\n '\\u01CB': 'Nj',\n '\\u24C4': 'O',\n '\\uFF2F': 'O',\n '\\u00D2': 'O',\n '\\u00D3': 'O',\n '\\u00D4': 'O',\n '\\u1ED2': 'O',\n '\\u1ED0': 'O',\n '\\u1ED6': 'O',\n '\\u1ED4': 'O',\n '\\u00D5': 'O',\n '\\u1E4C': 'O',\n '\\u022C': 'O',\n '\\u1E4E': 'O',\n '\\u014C': 'O',\n '\\u1E50': 'O',\n '\\u1E52': 'O',\n '\\u014E': 'O',\n '\\u022E': 'O',\n '\\u0230': 'O',\n '\\u00D6': 'O',\n '\\u022A': 'O',\n '\\u1ECE': 'O',\n '\\u0150': 'O',\n '\\u01D1': 'O',\n '\\u020C': 'O',\n '\\u020E': 'O',\n '\\u01A0': 'O',\n '\\u1EDC': 'O',\n '\\u1EDA': 'O',\n '\\u1EE0': 'O',\n '\\u1EDE': 'O',\n '\\u1EE2': 'O',\n '\\u1ECC': 'O',\n '\\u1ED8': 'O',\n '\\u01EA': 'O',\n '\\u01EC': 'O',\n '\\u00D8': 'O',\n '\\u01FE': 'O',\n '\\u0186': 'O',\n '\\u019F': 'O',\n '\\uA74A': 'O',\n '\\uA74C': 'O',\n '\\u01A2': 'OI',\n '\\uA74E': 'OO',\n '\\u0222': 'OU',\n '\\u24C5': 'P',\n '\\uFF30': 'P',\n '\\u1E54': 'P',\n '\\u1E56': 'P',\n '\\u01A4': 'P',\n '\\u2C63': 'P',\n '\\uA750': 'P',\n '\\uA752': 'P',\n '\\uA754': 'P',\n '\\u24C6': 'Q',\n '\\uFF31': 'Q',\n '\\uA756': 'Q',\n '\\uA758': 'Q',\n '\\u024A': 'Q',\n '\\u24C7': 'R',\n '\\uFF32': 'R',\n '\\u0154': 'R',\n '\\u1E58': 'R',\n '\\u0158': 'R',\n '\\u0210': 'R',\n '\\u0212': 'R',\n '\\u1E5A': 'R',\n '\\u1E5C': 'R',\n '\\u0156': 'R',\n '\\u1E5E': 'R',\n '\\u024C': 'R',\n '\\u2C64': 'R',\n '\\uA75A': 'R',\n '\\uA7A6': 'R',\n '\\uA782': 'R',\n '\\u24C8': 'S',\n '\\uFF33': 'S',\n '\\u1E9E': 'S',\n '\\u015A': 'S',\n '\\u1E64': 'S',\n '\\u015C': 'S',\n '\\u1E60': 'S',\n '\\u0160': 'S',\n '\\u1E66': 'S',\n '\\u1E62': 'S',\n '\\u1E68': 'S',\n '\\u0218': 'S',\n '\\u015E': 'S',\n '\\u2C7E': 'S',\n '\\uA7A8': 'S',\n '\\uA784': 'S',\n '\\u24C9': 'T',\n '\\uFF34': 'T',\n '\\u1E6A': 'T',\n '\\u0164': 'T',\n '\\u1E6C': 'T',\n '\\u021A': 'T',\n '\\u0162': 'T',\n '\\u1E70': 'T',\n '\\u1E6E': 'T',\n '\\u0166': 'T',\n '\\u01AC': 'T',\n '\\u01AE': 'T',\n '\\u023E': 'T',\n '\\uA786': 'T',\n '\\uA728': 'TZ',\n '\\u24CA': 'U',\n '\\uFF35': 'U',\n '\\u00D9': 'U',\n '\\u00DA': 'U',\n '\\u00DB': 'U',\n '\\u0168': 'U',\n '\\u1E78': 'U',\n '\\u016A': 'U',\n '\\u1E7A': 'U',\n '\\u016C': 'U',\n '\\u00DC': 'U',\n '\\u01DB': 'U',\n '\\u01D7': 'U',\n '\\u01D5': 'U',\n '\\u01D9': 'U',\n '\\u1EE6': 'U',\n '\\u016E': 'U',\n '\\u0170': 'U',\n '\\u01D3': 'U',\n '\\u0214': 'U',\n '\\u0216': 'U',\n '\\u01AF': 'U',\n '\\u1EEA': 'U',\n '\\u1EE8': 'U',\n '\\u1EEE': 'U',\n '\\u1EEC': 'U',\n '\\u1EF0': 'U',\n '\\u1EE4': 'U',\n '\\u1E72': 'U',\n '\\u0172': 'U',\n '\\u1E76': 'U',\n '\\u1E74': 'U',\n '\\u0244': 'U',\n '\\u24CB': 'V',\n '\\uFF36': 'V',\n '\\u1E7C': 'V',\n '\\u1E7E': 'V',\n '\\u01B2': 'V',\n '\\uA75E': 'V',\n '\\u0245': 'V',\n '\\uA760': 'VY',\n '\\u24CC': 'W',\n '\\uFF37': 'W',\n '\\u1E80': 'W',\n '\\u1E82': 'W',\n '\\u0174': 'W',\n '\\u1E86': 'W',\n '\\u1E84': 'W',\n '\\u1E88': 'W',\n '\\u2C72': 'W',\n '\\u24CD': 'X',\n '\\uFF38': 'X',\n '\\u1E8A': 'X',\n '\\u1E8C': 'X',\n '\\u24CE': 'Y',\n '\\uFF39': 'Y',\n '\\u1EF2': 'Y',\n '\\u00DD': 'Y',\n '\\u0176': 'Y',\n '\\u1EF8': 'Y',\n '\\u0232': 'Y',\n '\\u1E8E': 'Y',\n '\\u0178': 'Y',\n '\\u1EF6': 'Y',\n '\\u1EF4': 'Y',\n '\\u01B3': 'Y',\n '\\u024E': 'Y',\n '\\u1EFE': 'Y',\n '\\u24CF': 'Z',\n '\\uFF3A': 'Z',\n '\\u0179': 'Z',\n '\\u1E90': 'Z',\n '\\u017B': 'Z',\n '\\u017D': 'Z',\n '\\u1E92': 'Z',\n '\\u1E94': 'Z',\n '\\u01B5': 'Z',\n '\\u0224': 'Z',\n '\\u2C7F': 'Z',\n '\\u2C6B': 'Z',\n '\\uA762': 'Z',\n '\\u24D0': 'a',\n '\\uFF41': 'a',\n '\\u1E9A': 'a',\n '\\u00E0': 'a',\n '\\u00E1': 'a',\n '\\u00E2': 'a',\n '\\u1EA7': 'a',\n '\\u1EA5': 'a',\n '\\u1EAB': 'a',\n '\\u1EA9': 'a',\n '\\u00E3': 'a',\n '\\u0101': 'a',\n '\\u0103': 'a',\n '\\u1EB1': 'a',\n '\\u1EAF': 'a',\n '\\u1EB5': 'a',\n '\\u1EB3': 'a',\n '\\u0227': 'a',\n '\\u01E1': 'a',\n '\\u00E4': 'a',\n '\\u01DF': 'a',\n '\\u1EA3': 'a',\n '\\u00E5': 'a',\n '\\u01FB': 'a',\n '\\u01CE': 'a',\n '\\u0201': 'a',\n '\\u0203': 'a',\n '\\u1EA1': 'a',\n '\\u1EAD': 'a',\n '\\u1EB7': 'a',\n '\\u1E01': 'a',\n '\\u0105': 'a',\n '\\u2C65': 'a',\n '\\u0250': 'a',\n '\\uA733': 'aa',\n '\\u00E6': 'ae',\n '\\u01FD': 'ae',\n '\\u01E3': 'ae',\n '\\uA735': 'ao',\n '\\uA737': 'au',\n '\\uA739': 'av',\n '\\uA73B': 'av',\n '\\uA73D': 'ay',\n '\\u24D1': 'b',\n '\\uFF42': 'b',\n '\\u1E03': 'b',\n '\\u1E05': 'b',\n '\\u1E07': 'b',\n '\\u0180': 'b',\n '\\u0183': 'b',\n '\\u0253': 'b',\n '\\u24D2': 'c',\n '\\uFF43': 'c',\n '\\u0107': 'c',\n '\\u0109': 'c',\n '\\u010B': 'c',\n '\\u010D': 'c',\n '\\u00E7': 'c',\n '\\u1E09': 'c',\n '\\u0188': 'c',\n '\\u023C': 'c',\n '\\uA73F': 'c',\n '\\u2184': 'c',\n '\\u24D3': 'd',\n '\\uFF44': 'd',\n '\\u1E0B': 'd',\n '\\u010F': 'd',\n '\\u1E0D': 'd',\n '\\u1E11': 'd',\n '\\u1E13': 'd',\n '\\u1E0F': 'd',\n '\\u0111': 'd',\n '\\u018C': 'd',\n '\\u0256': 'd',\n '\\u0257': 'd',\n '\\uA77A': 'd',\n '\\u01F3': 'dz',\n '\\u01C6': 'dz',\n '\\u24D4': 'e',\n '\\uFF45': 'e',\n '\\u00E8': 'e',\n '\\u00E9': 'e',\n '\\u00EA': 'e',\n '\\u1EC1': 'e',\n '\\u1EBF': 'e',\n '\\u1EC5': 'e',\n '\\u1EC3': 'e',\n '\\u1EBD': 'e',\n '\\u0113': 'e',\n '\\u1E15': 'e',\n '\\u1E17': 'e',\n '\\u0115': 'e',\n '\\u0117': 'e',\n '\\u00EB': 'e',\n '\\u1EBB': 'e',\n '\\u011B': 'e',\n '\\u0205': 'e',\n '\\u0207': 'e',\n '\\u1EB9': 'e',\n '\\u1EC7': 'e',\n '\\u0229': 'e',\n '\\u1E1D': 'e',\n '\\u0119': 'e',\n '\\u1E19': 'e',\n '\\u1E1B': 'e',\n '\\u0247': 'e',\n '\\u025B': 'e',\n '\\u01DD': 'e',\n '\\u24D5': 'f',\n '\\uFF46': 'f',\n '\\u1E1F': 'f',\n '\\u0192': 'f',\n '\\uA77C': 'f',\n '\\u24D6': 'g',\n '\\uFF47': 'g',\n '\\u01F5': 'g',\n '\\u011D': 'g',\n '\\u1E21': 'g',\n '\\u011F': 'g',\n '\\u0121': 'g',\n '\\u01E7': 'g',\n '\\u0123': 'g',\n '\\u01E5': 'g',\n '\\u0260': 'g',\n '\\uA7A1': 'g',\n '\\u1D79': 'g',\n '\\uA77F': 'g',\n '\\u24D7': 'h',\n '\\uFF48': 'h',\n '\\u0125': 'h',\n '\\u1E23': 'h',\n '\\u1E27': 'h',\n '\\u021F': 'h',\n '\\u1E25': 'h',\n '\\u1E29': 'h',\n '\\u1E2B': 'h',\n '\\u1E96': 'h',\n '\\u0127': 'h',\n '\\u2C68': 'h',\n '\\u2C76': 'h',\n '\\u0265': 'h',\n '\\u0195': 'hv',\n '\\u24D8': 'i',\n '\\uFF49': 'i',\n '\\u00EC': 'i',\n '\\u00ED': 'i',\n '\\u00EE': 'i',\n '\\u0129': 'i',\n '\\u012B': 'i',\n '\\u012D': 'i',\n '\\u00EF': 'i',\n '\\u1E2F': 'i',\n '\\u1EC9': 'i',\n '\\u01D0': 'i',\n '\\u0209': 'i',\n '\\u020B': 'i',\n '\\u1ECB': 'i',\n '\\u012F': 'i',\n '\\u1E2D': 'i',\n '\\u0268': 'i',\n '\\u0131': 'i',\n '\\u24D9': 'j',\n '\\uFF4A': 'j',\n '\\u0135': 'j',\n '\\u01F0': 'j',\n '\\u0249': 'j',\n '\\u24DA': 'k',\n '\\uFF4B': 'k',\n '\\u1E31': 'k',\n '\\u01E9': 'k',\n '\\u1E33': 'k',\n '\\u0137': 'k',\n '\\u1E35': 'k',\n '\\u0199': 'k',\n '\\u2C6A': 'k',\n '\\uA741': 'k',\n '\\uA743': 'k',\n '\\uA745': 'k',\n '\\uA7A3': 'k',\n '\\u24DB': 'l',\n '\\uFF4C': 'l',\n '\\u0140': 'l',\n '\\u013A': 'l',\n '\\u013E': 'l',\n '\\u1E37': 'l',\n '\\u1E39': 'l',\n '\\u013C': 'l',\n '\\u1E3D': 'l',\n '\\u1E3B': 'l',\n '\\u017F': 'l',\n '\\u0142': 'l',\n '\\u019A': 'l',\n '\\u026B': 'l',\n '\\u2C61': 'l',\n '\\uA749': 'l',\n '\\uA781': 'l',\n '\\uA747': 'l',\n '\\u01C9': 'lj',\n '\\u24DC': 'm',\n '\\uFF4D': 'm',\n '\\u1E3F': 'm',\n '\\u1E41': 'm',\n '\\u1E43': 'm',\n '\\u0271': 'm',\n '\\u026F': 'm',\n '\\u24DD': 'n',\n '\\uFF4E': 'n',\n '\\u01F9': 'n',\n '\\u0144': 'n',\n '\\u00F1': 'n',\n '\\u1E45': 'n',\n '\\u0148': 'n',\n '\\u1E47': 'n',\n '\\u0146': 'n',\n '\\u1E4B': 'n',\n '\\u1E49': 'n',\n '\\u019E': 'n',\n '\\u0272': 'n',\n '\\u0149': 'n',\n '\\uA791': 'n',\n '\\uA7A5': 'n',\n '\\u01CC': 'nj',\n '\\u24DE': 'o',\n '\\uFF4F': 'o',\n '\\u00F2': 'o',\n '\\u00F3': 'o',\n '\\u00F4': 'o',\n '\\u1ED3': 'o',\n '\\u1ED1': 'o',\n '\\u1ED7': 'o',\n '\\u1ED5': 'o',\n '\\u00F5': 'o',\n '\\u1E4D': 'o',\n '\\u022D': 'o',\n '\\u1E4F': 'o',\n '\\u014D': 'o',\n '\\u1E51': 'o',\n '\\u1E53': 'o',\n '\\u014F': 'o',\n '\\u022F': 'o',\n '\\u0231': 'o',\n '\\u00F6': 'o',\n '\\u022B': 'o',\n '\\u1ECF': 'o',\n '\\u0151': 'o',\n '\\u01D2': 'o',\n '\\u020D': 'o',\n '\\u020F': 'o',\n '\\u01A1': 'o',\n '\\u1EDD': 'o',\n '\\u1EDB': 'o',\n '\\u1EE1': 'o',\n '\\u1EDF': 'o',\n '\\u1EE3': 'o',\n '\\u1ECD': 'o',\n '\\u1ED9': 'o',\n '\\u01EB': 'o',\n '\\u01ED': 'o',\n '\\u00F8': 'o',\n '\\u01FF': 'o',\n '\\u0254': 'o',\n '\\uA74B': 'o',\n '\\uA74D': 'o',\n '\\u0275': 'o',\n '\\u01A3': 'oi',\n '\\u0223': 'ou',\n '\\uA74F': 'oo',\n '\\u24DF': 'p',\n '\\uFF50': 'p',\n '\\u1E55': 'p',\n '\\u1E57': 'p',\n '\\u01A5': 'p',\n '\\u1D7D': 'p',\n '\\uA751': 'p',\n '\\uA753': 'p',\n '\\uA755': 'p',\n '\\u24E0': 'q',\n '\\uFF51': 'q',\n '\\u024B': 'q',\n '\\uA757': 'q',\n '\\uA759': 'q',\n '\\u24E1': 'r',\n '\\uFF52': 'r',\n '\\u0155': 'r',\n '\\u1E59': 'r',\n '\\u0159': 'r',\n '\\u0211': 'r',\n '\\u0213': 'r',\n '\\u1E5B': 'r',\n '\\u1E5D': 'r',\n '\\u0157': 'r',\n '\\u1E5F': 'r',\n '\\u024D': 'r',\n '\\u027D': 'r',\n '\\uA75B': 'r',\n '\\uA7A7': 'r',\n '\\uA783': 'r',\n '\\u24E2': 's',\n '\\uFF53': 's',\n '\\u00DF': 's',\n '\\u015B': 's',\n '\\u1E65': 's',\n '\\u015D': 's',\n '\\u1E61': 's',\n '\\u0161': 's',\n '\\u1E67': 's',\n '\\u1E63': 's',\n '\\u1E69': 's',\n '\\u0219': 's',\n '\\u015F': 's',\n '\\u023F': 's',\n '\\uA7A9': 's',\n '\\uA785': 's',\n '\\u1E9B': 's',\n '\\u24E3': 't',\n '\\uFF54': 't',\n '\\u1E6B': 't',\n '\\u1E97': 't',\n '\\u0165': 't',\n '\\u1E6D': 't',\n '\\u021B': 't',\n '\\u0163': 't',\n '\\u1E71': 't',\n '\\u1E6F': 't',\n '\\u0167': 't',\n '\\u01AD': 't',\n '\\u0288': 't',\n '\\u2C66': 't',\n '\\uA787': 't',\n '\\uA729': 'tz',\n '\\u24E4': 'u',\n '\\uFF55': 'u',\n '\\u00F9': 'u',\n '\\u00FA': 'u',\n '\\u00FB': 'u',\n '\\u0169': 'u',\n '\\u1E79': 'u',\n '\\u016B': 'u',\n '\\u1E7B': 'u',\n '\\u016D': 'u',\n '\\u00FC': 'u',\n '\\u01DC': 'u',\n '\\u01D8': 'u',\n '\\u01D6': 'u',\n '\\u01DA': 'u',\n '\\u1EE7': 'u',\n '\\u016F': 'u',\n '\\u0171': 'u',\n '\\u01D4': 'u',\n '\\u0215': 'u',\n '\\u0217': 'u',\n '\\u01B0': 'u',\n '\\u1EEB': 'u',\n '\\u1EE9': 'u',\n '\\u1EEF': 'u',\n '\\u1EED': 'u',\n '\\u1EF1': 'u',\n '\\u1EE5': 'u',\n '\\u1E73': 'u',\n '\\u0173': 'u',\n '\\u1E77': 'u',\n '\\u1E75': 'u',\n '\\u0289': 'u',\n '\\u24E5': 'v',\n '\\uFF56': 'v',\n '\\u1E7D': 'v',\n '\\u1E7F': 'v',\n '\\u028B': 'v',\n '\\uA75F': 'v',\n '\\u028C': 'v',\n '\\uA761': 'vy',\n '\\u24E6': 'w',\n '\\uFF57': 'w',\n '\\u1E81': 'w',\n '\\u1E83': 'w',\n '\\u0175': 'w',\n '\\u1E87': 'w',\n '\\u1E85': 'w',\n '\\u1E98': 'w',\n '\\u1E89': 'w',\n '\\u2C73': 'w',\n '\\u24E7': 'x',\n '\\uFF58': 'x',\n '\\u1E8B': 'x',\n '\\u1E8D': 'x',\n '\\u24E8': 'y',\n '\\uFF59': 'y',\n '\\u1EF3': 'y',\n '\\u00FD': 'y',\n '\\u0177': 'y',\n '\\u1EF9': 'y',\n '\\u0233': 'y',\n '\\u1E8F': 'y',\n '\\u00FF': 'y',\n '\\u1EF7': 'y',\n '\\u1E99': 'y',\n '\\u1EF5': 'y',\n '\\u01B4': 'y',\n '\\u024F': 'y',\n '\\u1EFF': 'y',\n '\\u24E9': 'z',\n '\\uFF5A': 'z',\n '\\u017A': 'z',\n '\\u1E91': 'z',\n '\\u017C': 'z',\n '\\u017E': 'z',\n '\\u1E93': 'z',\n '\\u1E95': 'z',\n '\\u01B6': 'z',\n '\\u0225': 'z',\n '\\u0240': 'z',\n '\\u2C6C': 'z',\n '\\uA763': 'z',\n '\\u0386': '\\u0391',\n '\\u0388': '\\u0395',\n '\\u0389': '\\u0397',\n '\\u038A': '\\u0399',\n '\\u03AA': '\\u0399',\n '\\u038C': '\\u039F',\n '\\u038E': '\\u03A5',\n '\\u03AB': '\\u03A5',\n '\\u038F': '\\u03A9',\n '\\u03AC': '\\u03B1',\n '\\u03AD': '\\u03B5',\n '\\u03AE': '\\u03B7',\n '\\u03AF': '\\u03B9',\n '\\u03CA': '\\u03B9',\n '\\u0390': '\\u03B9',\n '\\u03CC': '\\u03BF',\n '\\u03CD': '\\u03C5',\n '\\u03CB': '\\u03C5',\n '\\u03B0': '\\u03C5',\n '\\u03C9': '\\u03C9',\n '\\u03C2': '\\u03C3'\n };\n DataUtil.fnOperators = {\n /**\n * Returns true when the actual input is equal to the given input.\n * @param {string|number|boolean} actual\n * @param {string|number|boolean} expected\n * @param {boolean} ignoreCase?\n * @param {boolean} ignoreAccent?\n */\n equal: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n if (ignoreCase) {\n return DataUtil.toLowerCase(actual) === DataUtil.toLowerCase(expected);\n }\n return actual === expected;\n },\n /**\n * Returns true when the actual input is not equal to the given input.\n * @param {string|number|boolean} actual\n * @param {string|number|boolean} expected\n * @param {boolean} ignoreCase?\n */\n notequal: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n return !DataUtil.fnOperators.equal(actual, expected, ignoreCase);\n },\n /**\n * Returns true when the actual input is less than to the given input.\n * @param {string|number|boolean} actual\n * @param {string|number|boolean} expected\n * @param {boolean} ignoreCase?\n */\n lessthan: function (actual, expected, ignoreCase) {\n if (ignoreCase) {\n return DataUtil.toLowerCase(actual) < DataUtil.toLowerCase(expected);\n }\n return actual < expected;\n },\n /**\n * Returns true when the actual input is greater than to the given input.\n * @param {string|number|boolean} actual\n * @param {string|number|boolean} expected\n * @param {boolean} ignoreCase?\n */\n greaterthan: function (actual, expected, ignoreCase) {\n if (ignoreCase) {\n return DataUtil.toLowerCase(actual) > DataUtil.toLowerCase(expected);\n }\n return actual > expected;\n },\n /**\n * Returns true when the actual input is less than or equal to the given input.\n * @param {string|number|boolean} actual\n * @param {string|number|boolean} expected\n * @param {boolean} ignoreCase?\n */\n lessthanorequal: function (actual, expected, ignoreCase) {\n if (ignoreCase) {\n return DataUtil.toLowerCase(actual) <= DataUtil.toLowerCase(expected);\n }\n return actual <= expected;\n },\n /**\n * Returns true when the actual input is greater than or equal to the given input.\n * @param {string|number|boolean} actual\n * @param {string|number|boolean} expected\n * @param {boolean} ignoreCase?\n */\n greaterthanorequal: function (actual, expected, ignoreCase) {\n if (ignoreCase) {\n return DataUtil.toLowerCase(actual) >= DataUtil.toLowerCase(expected);\n }\n return actual >= expected;\n },\n /**\n * Returns true when the actual input contains the given string.\n * @param {string|number} actual\n * @param {string|number} expected\n * @param {boolean} ignoreCase?\n */\n contains: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n if (ignoreCase) {\n return !isNullOrUndefined(actual) && !isNullOrUndefined(expected) &&\n DataUtil.toLowerCase(actual).indexOf(DataUtil.toLowerCase(expected)) !== -1;\n }\n return !isNullOrUndefined(actual) && !isNullOrUndefined(expected) &&\n actual.toString().indexOf(expected) !== -1;\n },\n /**\n * Returns true when the given input value is not null.\n * @param {string|number} actual\n * @returns boolean\n */\n notnull: function (actual) {\n return actual !== null;\n },\n /**\n * Returns true when the given input value is null.\n * @param {string|number} actual\n * @returns boolean\n */\n isnull: function (actual) {\n return actual === null;\n },\n /**\n * Returns true when the actual input starts with the given string\n * @param {string} actual\n * @param {string} expected\n * @param {boolean} ignoreCase?\n */\n startswith: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n if (ignoreCase) {\n return actual && expected && DataUtil.startsWith(DataUtil.toLowerCase(actual), DataUtil.toLowerCase(expected));\n }\n return actual && expected && DataUtil.startsWith(actual, expected);\n },\n /**\n * Returns true when the actual input ends with the given string.\n * @param {string} actual\n * @param {string} expected\n * @param {boolean} ignoreCase?\n */\n endswith: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n if (ignoreCase) {\n return actual && expected && DataUtil.endsWith(DataUtil.toLowerCase(actual), DataUtil.toLowerCase(expected));\n }\n return actual && expected && DataUtil.endsWith(actual, expected);\n },\n /**\n * It will return the filter operator based on the filter symbol.\n * @param {string} operator\n * @hidden\n */\n processSymbols: function (operator) {\n var fnName = DataUtil.operatorSymbols[operator];\n if (fnName) {\n var fn = DataUtil.fnOperators[fnName];\n return fn;\n }\n return DataUtil.throwError('Query - Process Operator : Invalid operator');\n },\n /**\n * It will return the valid filter operator based on the specified operators.\n * @param {string} operator\n * @hidden\n */\n processOperator: function (operator) {\n var fn = DataUtil.fnOperators[operator];\n if (fn) {\n return fn;\n }\n return DataUtil.fnOperators.processSymbols(operator);\n }\n };\n /**\n * To perform the parse operation on JSON data, like convert to string from JSON or convert to JSON from string.\n */\n DataUtil.parse = {\n /**\n * Parse the given string to the plain JavaScript object.\n * @param {string|Object|Object[]} jsonText\n */\n parseJson: function (jsonText) {\n if (typeof jsonText === 'string') {\n jsonText = JSON.parse(jsonText, DataUtil.parse.jsonReviver);\n }\n else if (jsonText instanceof Array) {\n DataUtil.parse.iterateAndReviveArray(jsonText);\n }\n else if (typeof jsonText === 'object' && jsonText !== null) {\n DataUtil.parse.iterateAndReviveJson(jsonText);\n }\n return jsonText;\n },\n /**\n * It will perform on array of values.\n * @param {string[]|Object[]} array\n * @hidden\n */\n iterateAndReviveArray: function (array) {\n for (var i = 0; i < array.length; i++) {\n if (typeof array[i] === 'object' && array[i] !== null) {\n DataUtil.parse.iterateAndReviveJson(array[i]);\n }\n else if (typeof array[i] === 'string' && !/^[\\s]*\\[|^[\\s]*\\{(.)+:|\\\"/g.test(array[i])) {\n array[i] = DataUtil.parse.jsonReviver('', array[i]);\n }\n else {\n array[i] = DataUtil.parse.parseJson(array[i]);\n }\n }\n },\n /**\n * It will perform on JSON values\n * @param {JSON} json\n * @hidden\n */\n iterateAndReviveJson: function (json) {\n var value;\n var keys = Object.keys(json);\n for (var _i = 0, keys_2 = keys; _i < keys_2.length; _i++) {\n var prop = keys_2[_i];\n if (DataUtil.startsWith(prop, '__')) {\n continue;\n }\n value = json[prop];\n if (typeof value === 'object') {\n if (value instanceof Array) {\n DataUtil.parse.iterateAndReviveArray(value);\n }\n else if (value) {\n DataUtil.parse.iterateAndReviveJson(value);\n }\n }\n else {\n json[prop] = DataUtil.parse.jsonReviver(json[prop], value);\n }\n }\n },\n /**\n * It will perform on JSON values\n * @param {string} field\n * @param {string|Date} value\n * @hidden\n */\n jsonReviver: function (field, value) {\n var dupValue = value;\n if (typeof value === 'string') {\n var ms = /^\\/Date\\(([+-]?[0-9]+)([+-][0-9]{4})?\\)\\/$/.exec(value);\n if (ms) {\n return DataUtil.dateParse.toTimeZone(new Date(parseInt(ms[1], 10)), DataUtil.serverTimezoneOffset, true);\n }\n else if (/^(\\d{4}\\-\\d\\d\\-\\d\\d([tT][\\d:\\.]*){1})([zZ]|([+\\-])(\\d\\d):?(\\d\\d))?$/.test(value)) {\n var arr = dupValue.split(/[^0-9]/);\n value = DataUtil.dateParse\n .toTimeZone(new Date(parseInt(arr[0], 10), parseInt(arr[1], 10) - 1, parseInt(arr[2], 10), parseInt(arr[3], 10), parseInt(arr[4], 10), parseInt(arr[5], 10)), DataUtil.serverTimezoneOffset, true);\n }\n }\n return value;\n },\n /**\n * Check wheather the given value is JSON or not.\n * @param {Object[]} jsonData\n */\n isJson: function (jsonData) {\n if (typeof jsonData[0] === 'string') {\n return jsonData;\n }\n return DataUtil.parse.parseJson(jsonData);\n },\n /**\n * Checks wheather the given value is GUID or not.\n * @param {string} value\n */\n isGuid: function (value) {\n var regex = /[A-Fa-f0-9]{8}(?:-[A-Fa-f0-9]{4}){3}-[A-Fa-f0-9]{12}/i;\n var match = regex.exec(value);\n return match != null;\n },\n /**\n * The method used to replace the value based on the type.\n * @param {Object} value\n * @param {boolean} stringify\n * @hidden\n */\n replacer: function (value, stringify) {\n if (DataUtil.isPlainObject(value)) {\n return DataUtil.parse.jsonReplacer(value, stringify);\n }\n if (value instanceof Array) {\n return DataUtil.parse.arrayReplacer(value);\n }\n if (value instanceof Date) {\n return DataUtil.parse.jsonReplacer({ val: value }, stringify).val;\n }\n return value;\n },\n /**\n * It will replace the JSON value.\n * @param {string} key\n * @param {Object} val\n * @hidden\n */\n jsonReplacer: function (val, stringify) {\n var value;\n var keys = Object.keys(val);\n for (var _i = 0, keys_3 = keys; _i < keys_3.length; _i++) {\n var prop = keys_3[_i];\n value = val[prop];\n if (!(value instanceof Date)) {\n continue;\n }\n var d = value;\n val[prop] = DataUtil.dateParse.toTimeZone(DataUtil.dateParse.addSelfOffset(d), DataUtil.serverTimezoneOffset).toJSON();\n }\n return val;\n },\n /**\n * It will replace the Array of value.\n * @param {string} key\n * @param {Object[]} val\n * @hidden\n */\n arrayReplacer: function (val) {\n for (var i = 0; i < val.length; i++) {\n if (DataUtil.isPlainObject(val[i])) {\n val[i] = DataUtil.parse.jsonReplacer(val[i]);\n }\n else if (val[i] instanceof Date) {\n val[i] = DataUtil.parse.jsonReplacer({ date: val[i] }).date;\n }\n }\n return val;\n }\n };\n /**\n * @hidden\n */\n DataUtil.dateParse = {\n addSelfOffset: function (input) {\n return new Date(+input - (input.getTimezoneOffset() * 60000));\n },\n toUTC: function (input) {\n return new Date(+input + (input.getTimezoneOffset() * 60000));\n },\n toTimeZone: function (input, offset, utc) {\n if (offset === null) {\n return input;\n }\n var unix = utc ? DataUtil.dateParse.toUTC(input) : input;\n return new Date(+unix - (offset * 3600000));\n },\n toLocalTime: function (input) {\n var datefn = input;\n var timeZone = -datefn.getTimezoneOffset();\n var differenceString = timeZone >= 0 ? '+' : '-';\n var localtimefn = function (num) {\n var norm = Math.floor(Math.abs(num));\n return (norm < 10 ? '0' : '') + norm;\n };\n var val = datefn.getFullYear() + '-' + localtimefn(datefn.getMonth() + 1) + '-' + localtimefn(datefn.getDate()) +\n 'T' + localtimefn(datefn.getHours()) +\n ':' + localtimefn(datefn.getMinutes()) +\n ':' + localtimefn(datefn.getSeconds()) +\n differenceString + localtimefn(timeZone / 60) +\n ':' + localtimefn(timeZone % 60);\n return val;\n }\n };\n return DataUtil;\n}());\nexport { DataUtil };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { merge, extend, isNullOrUndefined, setValue } from '@syncfusion/ej2-base';\nimport { DataUtil } from './util';\nimport { Query, Predicate } from './query';\n/**\n * Adaptors are specific data source type aware interfaces that are used by DataManager to communicate with DataSource.\n * This is the base adaptor class that other adaptors can extend.\n * @hidden\n */\nvar Adaptor = /** @class */ (function () {\n /**\n * Constructor for Adaptor class\n * @param {DataOptions} ds?\n * @hidden\n * @returns aggregates\n */\n function Adaptor(ds) {\n // common options for all the adaptors \n this.options = {\n from: 'table',\n requestType: 'json',\n sortBy: 'sorted',\n select: 'select',\n skip: 'skip',\n group: 'group',\n take: 'take',\n search: 'search',\n count: 'requiresCounts',\n where: 'where',\n aggregates: 'aggregates'\n };\n /**\n * Specifies the type of adaptor.\n * @default Adaptor\n */\n this.type = Adaptor;\n this.dataSource = ds;\n this.pvt = {};\n }\n /**\n * Returns the data from the query processing.\n * @param {Object} data\n * @param {DataOptions} ds?\n * @param {Query} query?\n * @param {XMLHttpRequest} xhr?\n * @returns Object\n */\n Adaptor.prototype.processResponse = function (data, ds, query, xhr) {\n return data;\n };\n return Adaptor;\n}());\nexport { Adaptor };\n/**\n * JsonAdaptor is used to process JSON data. It contains methods to process the given JSON data based on the queries.\n * @hidden\n */\nvar JsonAdaptor = /** @class */ (function (_super) {\n __extends(JsonAdaptor, _super);\n function JsonAdaptor() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Process the JSON data based on the provided queries.\n * @param {DataManager} dataManager\n * @param {Query} query\n * @returns Object\n */\n JsonAdaptor.prototype.processQuery = function (dataManager, query) {\n var result = dataManager.dataSource.json.slice(0);\n var count = result.length;\n var countFlg = true;\n var ret;\n var key;\n var agg = {};\n for (var i = 0; i < query.queries.length; i++) {\n key = query.queries[i];\n ret = this[key.fn].call(this, result, key.e, query);\n if (key.fn === 'onAggregates') {\n agg[key.e.field + ' - ' + key.e.type] = ret;\n }\n else {\n result = ret !== undefined ? ret : result;\n }\n if (key.fn === 'onPage' || key.fn === 'onSkip' || key.fn === 'onTake' || key.fn === 'onRange') {\n countFlg = false;\n }\n if (countFlg) {\n count = result.length;\n }\n }\n if (query.isCountRequired) {\n result = {\n result: result,\n count: count,\n aggregates: agg\n };\n }\n return result;\n };\n /**\n * Performs batch update in the JSON array which add, remove and update records.\n * @param {DataManager} dm\n * @param {CrudOptions} changes\n * @param {RemoteArgs} e\n */\n JsonAdaptor.prototype.batchRequest = function (dm, changes, e) {\n var i;\n var deletedRecordsLen = changes.deletedRecords.length;\n for (i = 0; i < changes.addedRecords.length; i++) {\n this.insert(dm, changes.addedRecords[i]);\n }\n for (i = 0; i < changes.changedRecords.length; i++) {\n this.update(dm, e.key, changes.changedRecords[i]);\n }\n for (i = 0; i < deletedRecordsLen; i++) {\n this.remove(dm, e.key, changes.deletedRecords[i]);\n }\n return changes;\n };\n /**\n * Performs filter operation with the given data and where query.\n * @param {Object[]} ds\n * @param {{validate:Function}} e\n */\n JsonAdaptor.prototype.onWhere = function (ds, e) {\n if (!ds || !ds.length) {\n return ds;\n }\n return ds.filter(function (obj) {\n if (e) {\n return e.validate(obj);\n }\n });\n };\n /**\n * Returns aggregate function based on the aggregate type.\n * @param {Object[]} ds\n * @param {{field:string} e\n * @param {string}} type\n */\n JsonAdaptor.prototype.onAggregates = function (ds, e) {\n var fn = DataUtil.aggregates[e.type];\n if (!ds || !fn || ds.length === 0) {\n return null;\n }\n return fn(ds, e.field);\n };\n /**\n * Performs search operation based on the given query.\n * @param {Object[]} ds\n * @param {QueryOptions} e\n */\n JsonAdaptor.prototype.onSearch = function (ds, e) {\n if (!ds || !ds.length) {\n return ds;\n }\n if (e.fieldNames.length === 0) {\n DataUtil.getFieldList(ds[0], e.fieldNames);\n }\n return ds.filter(function (obj) {\n for (var j = 0; j < e.fieldNames.length; j++) {\n if (e.comparer.call(obj, DataUtil.getObject(e.fieldNames[j], obj), e.searchKey, e.ignoreCase, e.ignoreAccent)) {\n return true;\n }\n }\n return false;\n });\n };\n /**\n * Sort the data with given direction and field.\n * @param {Object[]} ds\n * @param {{comparer:(a:Object} e\n * @param {Object} b\n */\n JsonAdaptor.prototype.onSortBy = function (ds, e, query) {\n if (!ds || !ds.length) {\n return ds;\n }\n var fnCompare;\n var field = DataUtil.getValue(e.fieldName, query);\n if (!field) {\n return ds.sort(e.comparer);\n }\n if (field instanceof Array) {\n field = field.slice(0);\n for (var i = field.length - 1; i >= 0; i--) {\n if (!field[i]) {\n continue;\n }\n fnCompare = e.comparer;\n if (DataUtil.endsWith(field[i], ' desc')) {\n fnCompare = DataUtil.fnSort('descending');\n field[i] = field[i].replace(' desc', '');\n }\n ds = DataUtil.sort(ds, field[i], fnCompare);\n }\n return ds;\n }\n return DataUtil.sort(ds, field, e.comparer);\n };\n /**\n * Group the data based on the given query.\n * @param {Object[]} ds\n * @param {QueryOptions} e\n * @param {Query} query\n */\n JsonAdaptor.prototype.onGroup = function (ds, e, query) {\n if (!ds || !ds.length) {\n return ds;\n }\n var aggQuery = Query.filterQueries(query.queries, 'onAggregates');\n var agg = [];\n if (aggQuery.length) {\n var tmp = void 0;\n for (var i = 0; i < aggQuery.length; i++) {\n tmp = aggQuery[i].e;\n agg.push({ type: tmp.type, field: DataUtil.getValue(tmp.field, query) });\n }\n }\n return DataUtil.group(ds, DataUtil.getValue(e.fieldName, query), agg, null, null, e.comparer);\n };\n /**\n * Retrieves records based on the given page index and size.\n * @param {Object[]} ds\n * @param {{pageSize:number} e\n * @param {number}} pageIndex\n * @param {Query} query\n */\n JsonAdaptor.prototype.onPage = function (ds, e, query) {\n var size = DataUtil.getValue(e.pageSize, query);\n var start = (DataUtil.getValue(e.pageIndex, query) - 1) * size;\n var end = start + size;\n if (!ds || !ds.length) {\n return ds;\n }\n return ds.slice(start, end);\n };\n /**\n * Retrieves records based on the given start and end index from query.\n * @param {Object[]} ds\n * @param {{start:number} e\n * @param {number}} end\n */\n JsonAdaptor.prototype.onRange = function (ds, e) {\n if (!ds || !ds.length) {\n return ds;\n }\n return ds.slice(DataUtil.getValue(e.start), DataUtil.getValue(e.end));\n };\n /**\n * Picks the given count of records from the top of the datasource.\n * @param {Object[]} ds\n * @param {{nos:number}} e\n */\n JsonAdaptor.prototype.onTake = function (ds, e) {\n if (!ds || !ds.length) {\n return ds;\n }\n return ds.slice(0, DataUtil.getValue(e.nos));\n };\n /**\n * Skips the given count of records from the data source.\n * @param {Object[]} ds\n * @param {{nos:number}} e\n */\n JsonAdaptor.prototype.onSkip = function (ds, e) {\n if (!ds || !ds.length) {\n return ds;\n }\n return ds.slice(DataUtil.getValue(e.nos));\n };\n /**\n * Selects specified columns from the data source.\n * @param {Object[]} ds\n * @param {{fieldNames:string}} e\n */\n JsonAdaptor.prototype.onSelect = function (ds, e) {\n if (!ds || !ds.length) {\n return ds;\n }\n return DataUtil.select(ds, DataUtil.getValue(e.fieldNames));\n };\n /**\n * Inserts new record in the table.\n * @param {DataManager} dm\n * @param {Object} data\n * @param {number} position\n */\n JsonAdaptor.prototype.insert = function (dm, data, tableName, query, position) {\n if (isNullOrUndefined(position)) {\n return dm.dataSource.json.push(data);\n }\n else {\n return dm.dataSource.json.splice(position, 0, data);\n }\n };\n /**\n * Remove the data from the dataSource based on the key field value.\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {Object} value\n * @param {string} tableName?\n * @returns null\n */\n JsonAdaptor.prototype.remove = function (dm, keyField, value, tableName) {\n var ds = dm.dataSource.json;\n var i;\n if (typeof value === 'object') {\n value = value[keyField];\n }\n for (i = 0; i < ds.length; i++) {\n if (ds[i][keyField] === value) {\n break;\n }\n }\n return i !== ds.length ? ds.splice(i, 1) : null;\n };\n /**\n * Updates existing record and saves the changes to the table.\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {Object} value\n * @param {string} tableName?\n * @returns null\n */\n JsonAdaptor.prototype.update = function (dm, keyField, value, tableName) {\n var ds = dm.dataSource.json;\n var i;\n var key = value[keyField];\n for (i = 0; i < ds.length; i++) {\n if (ds[i][keyField] === key) {\n break;\n }\n }\n return i < ds.length ? merge(ds[i], value) : null;\n };\n return JsonAdaptor;\n}(Adaptor));\nexport { JsonAdaptor };\n/**\n * URL Adaptor of DataManager can be used when you are required to use remote service to retrieve data.\n * It interacts with server-side for all DataManager Queries and CRUD operations.\n * @hidden\n */\nvar UrlAdaptor = /** @class */ (function (_super) {\n __extends(UrlAdaptor, _super);\n function UrlAdaptor() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Process the query to generate request body.\n * @param {DataManager} dm\n * @param {Query} query\n * @param {Object[]} hierarchyFilters?\n * @returns p\n */\n UrlAdaptor.prototype.processQuery = function (dm, query, hierarchyFilters) {\n var queries = this.getQueryRequest(query);\n var singles = Query.filterQueryLists(query.queries, ['onSelect', 'onPage', 'onSkip', 'onTake', 'onRange']);\n var params = query.params;\n var url = dm.dataSource.url;\n var temp;\n var skip;\n var take = null;\n var options = this.options;\n var request = { sorts: [], groups: [], filters: [], searches: [], aggregates: [] };\n // calc Paging & Range\n if ('onPage' in singles) {\n temp = singles.onPage;\n skip = DataUtil.getValue(temp.pageIndex, query);\n take = DataUtil.getValue(temp.pageSize, query);\n skip = (skip - 1) * take;\n }\n else if ('onRange' in singles) {\n temp = singles.onRange;\n skip = temp.start;\n take = temp.end - temp.start;\n }\n // Sorting\n for (var i = 0; i < queries.sorts.length; i++) {\n temp = DataUtil.getValue(queries.sorts[i].e.fieldName, query);\n request.sorts.push(DataUtil.callAdaptorFunction(this, 'onEachSort', { name: temp, direction: queries.sorts[i].e.direction }, query));\n }\n // hierarchy\n if (hierarchyFilters) {\n temp = this.getFiltersFrom(hierarchyFilters, query);\n if (temp) {\n request.filters.push(DataUtil.callAdaptorFunction(this, 'onEachWhere', temp.toJson(), query));\n }\n }\n // Filters\n for (var i = 0; i < queries.filters.length; i++) {\n request.filters.push(DataUtil.callAdaptorFunction(this, 'onEachWhere', queries.filters[i].e.toJson(), query));\n var keys_3 = typeof request.filters[i] === 'object' ? Object.keys(request.filters[i]) : [];\n for (var _i = 0, keys_1 = keys_3; _i < keys_1.length; _i++) {\n var prop = keys_1[_i];\n if (DataUtil.isNull((request)[prop])) {\n delete request[prop];\n }\n }\n }\n // Searches\n for (var i = 0; i < queries.searches.length; i++) {\n temp = queries.searches[i].e;\n request.searches.push(DataUtil.callAdaptorFunction(this, 'onEachSearch', {\n fields: temp.fieldNames,\n operator: temp.operator,\n key: temp.searchKey,\n ignoreCase: temp.ignoreCase\n }, query));\n }\n // Grouping\n for (var i = 0; i < queries.groups.length; i++) {\n request.groups.push(DataUtil.getValue(queries.groups[i].e.fieldName, query));\n }\n // aggregates\n for (var i = 0; i < queries.aggregates.length; i++) {\n temp = queries.aggregates[i].e;\n request.aggregates.push({ type: temp.type, field: DataUtil.getValue(temp.field, query) });\n }\n var req = {};\n this.getRequestQuery(options, query, singles, request, req);\n // Params\n DataUtil.callAdaptorFunction(this, 'addParams', { dm: dm, query: query, params: params, reqParams: req });\n // cleanup\n var keys = Object.keys(req);\n for (var _a = 0, keys_2 = keys; _a < keys_2.length; _a++) {\n var prop = keys_2[_a];\n if (DataUtil.isNull(req[prop]) || req[prop] === '' || req[prop].length === 0) {\n delete req[prop];\n }\n }\n if (!(options.skip in req && options.take in req) && take !== null) {\n req[options.skip] = DataUtil.callAdaptorFunction(this, 'onSkip', skip, query);\n req[options.take] = DataUtil.callAdaptorFunction(this, 'onTake', take, query);\n }\n var p = this.pvt;\n this.pvt = {};\n if (this.options.requestType === 'json') {\n return {\n data: JSON.stringify(req),\n url: url,\n pvtData: p,\n type: 'POST',\n contentType: 'application/json; charset=utf-8'\n };\n }\n temp = this.convertToQueryString(req, query, dm);\n temp = (dm.dataSource.url.indexOf('?') !== -1 ? '&' : '/') + temp;\n return {\n type: 'GET', url: temp.length ? url.replace(/\\/*$/, temp) : url, pvtData: p\n };\n };\n UrlAdaptor.prototype.getRequestQuery = function (options, query, singles, request, request1) {\n var param = 'param';\n var req = request1;\n req[options.from] = query.fromTable;\n if (options.apply && query.distincts.length) {\n req[options.apply] = 'onDistinct' in this ? DataUtil.callAdaptorFunction(this, 'onDistinct', query.distincts) : '';\n }\n if (!query.distincts.length && options.expand) {\n req[options.expand] = 'onExpand' in this && 'onSelect' in singles ?\n DataUtil.callAdaptorFunction(this, 'onExpand', { selects: DataUtil.getValue(singles.onSelect.fieldNames, query), expands: query.expands }, query) : query.expands;\n }\n req[options.select] = 'onSelect' in singles && !query.distincts.length ?\n DataUtil.callAdaptorFunction(this, 'onSelect', DataUtil.getValue(singles.onSelect.fieldNames, query), query) : '';\n req[options.count] = query.isCountRequired ? DataUtil.callAdaptorFunction(this, 'onCount', query.isCountRequired, query) : '';\n req[options.search] = request.searches.length ? DataUtil.callAdaptorFunction(this, 'onSearch', request.searches, query) : '';\n req[options.skip] = 'onSkip' in singles ?\n DataUtil.callAdaptorFunction(this, 'onSkip', DataUtil.getValue(singles.onSkip.nos, query), query) : '';\n req[options.take] = 'onTake' in singles ?\n DataUtil.callAdaptorFunction(this, 'onTake', DataUtil.getValue(singles.onTake.nos, query), query) : '';\n req[options.where] = request.filters.length || request.searches.length ?\n DataUtil.callAdaptorFunction(this, 'onWhere', request.filters, query) : '';\n req[options.sortBy] = request.sorts.length ? DataUtil.callAdaptorFunction(this, 'onSortBy', request.sorts, query) : '';\n req[options.group] = request.groups.length ? DataUtil.callAdaptorFunction(this, 'onGroup', request.groups, query) : '';\n req[options.aggregates] = request.aggregates.length ?\n DataUtil.callAdaptorFunction(this, 'onAggregates', request.aggregates, query) : '';\n req[param] = [];\n };\n /**\n * Convert the object from processQuery to string which can be added query string.\n * @param {Object} req\n * @param {Query} query\n * @param {DataManager} dm\n */\n UrlAdaptor.prototype.convertToQueryString = function (request, query, dm) {\n return '';\n // this needs to be overridden\n };\n /**\n * Return the data from the data manager processing.\n * @param {DataResult} data\n * @param {DataOptions} ds?\n * @param {Query} query?\n * @param {XMLHttpRequest} xhr?\n * @param {Object} request?\n * @param {CrudOptions} changes?\n */\n UrlAdaptor.prototype.processResponse = function (data, ds, query, xhr, request, changes) {\n if (xhr && xhr.getResponseHeader('Content-Type') &&\n xhr.getResponseHeader('Content-Type').indexOf('application/json') !== -1) {\n data = DataUtil.parse.parseJson(data);\n }\n var requests = request;\n var pvt = requests.pvtData || {};\n var groupDs = data ? data.groupDs : [];\n if (xhr && xhr.getResponseHeader('Content-Type') &&\n xhr.getResponseHeader('Content-Type').indexOf('xml') !== -1) {\n return (query.isCountRequired ? { result: [], count: 0 } : []);\n }\n var d = JSON.parse(requests.data);\n if (d && d.action === 'batch' && data && data.addedRecords) {\n changes.addedRecords = data.addedRecords;\n return changes;\n }\n if (data && data.d) {\n data = data.d;\n }\n var args = {};\n if (data && 'count' in data) {\n args.count = data.count;\n }\n args.result = data && data.result ? data.result : data;\n this.getAggregateResult(pvt, data, args, groupDs, query);\n return DataUtil.isNull(args.count) ? args.result : { result: args.result, count: args.count, aggregates: args.aggregates };\n };\n /**\n * Add the group query to the adaptor`s option.\n * @param {Object[]} e\n * @returns void\n */\n UrlAdaptor.prototype.onGroup = function (e) {\n this.pvt.groups = e;\n return e;\n };\n /**\n * Add the aggregate query to the adaptor`s option.\n * @param {Aggregates[]} e\n * @returns void\n */\n UrlAdaptor.prototype.onAggregates = function (e) {\n this.pvt.aggregates = e;\n };\n /**\n * Prepare the request body based on the newly added, removed and updated records.\n * The result is used by the batch request.\n * @param {DataManager} dm\n * @param {CrudOptions} changes\n * @param {Object} e\n */\n UrlAdaptor.prototype.batchRequest = function (dm, changes, e, query, original) {\n var url;\n var key;\n return {\n type: 'POST',\n url: dm.dataSource.batchUrl || dm.dataSource.crudUrl || dm.dataSource.removeUrl || dm.dataSource.url,\n contentType: 'application/json; charset=utf-8',\n dataType: 'json',\n data: JSON.stringify(extend({}, {\n changed: changes.changedRecords,\n added: changes.addedRecords,\n deleted: changes.deletedRecords,\n action: 'batch',\n table: e[url],\n key: e[key]\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n /**\n * Method will trigger before send the request to server side.\n * Used to set the custom header or modify the request options.\n * @param {DataManager} dm\n * @param {XMLHttpRequest} request\n * @returns void\n */\n UrlAdaptor.prototype.beforeSend = function (dm, request) {\n // need to extend this method\n };\n /**\n * Prepare and returns request body which is used to insert a new record in the table.\n * @param {DataManager} dm\n * @param {Object} data\n * @param {string} tableName\n */\n UrlAdaptor.prototype.insert = function (dm, data, tableName, query) {\n return {\n url: dm.dataSource.insertUrl || dm.dataSource.crudUrl || dm.dataSource.url,\n data: JSON.stringify(extend({}, {\n value: data,\n table: tableName,\n action: 'insert'\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n /**\n * Prepare and return request body which is used to remove record from the table.\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {number|string} value\n * @param {string} tableName\n */\n UrlAdaptor.prototype.remove = function (dm, keyField, value, tableName, query) {\n return {\n type: 'POST',\n url: dm.dataSource.removeUrl || dm.dataSource.crudUrl || dm.dataSource.url,\n data: JSON.stringify(extend({}, {\n key: value,\n keyColumn: keyField,\n table: tableName,\n action: 'remove'\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n /**\n * Prepare and return request body which is used to update record.\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {Object} value\n * @param {string} tableName\n */\n UrlAdaptor.prototype.update = function (dm, keyField, value, tableName, query) {\n return {\n type: 'POST',\n url: dm.dataSource.updateUrl || dm.dataSource.crudUrl || dm.dataSource.url,\n data: JSON.stringify(extend({}, {\n value: value,\n action: 'update',\n keyColumn: keyField,\n key: value[keyField],\n table: tableName\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n /**\n * To generate the predicate based on the filtered query.\n * @param {Object[]|string[]|number[]} data\n * @param {Query} query\n * @hidden\n */\n UrlAdaptor.prototype.getFiltersFrom = function (data, query) {\n var key = query.fKey;\n var value;\n var prop = key;\n var pKey = query.key;\n var predicats = [];\n if (typeof data[0] !== 'object') {\n prop = null;\n }\n for (var i = 0; i < data.length; i++) {\n if (typeof data[0] === 'object') {\n value = DataUtil.getObject(pKey || prop, data[i]);\n }\n else {\n value = data[i];\n }\n predicats.push(new Predicate(key, 'equal', value));\n }\n return Predicate.or(predicats);\n };\n UrlAdaptor.prototype.getAggregateResult = function (pvt, data, args, groupDs, query) {\n var pData = data;\n if (data && data.result) {\n pData = data.result;\n }\n if (pvt && pvt.aggregates && pvt.aggregates.length) {\n var agg = pvt.aggregates;\n var fn = void 0;\n var aggregateData = pData;\n var res = {};\n if (data.aggregate) {\n aggregateData = data.aggregate;\n }\n for (var i = 0; i < agg.length; i++) {\n fn = DataUtil.aggregates[agg[i].type];\n if (fn) {\n res[agg[i].field + ' - ' + agg[i].type] = fn(aggregateData, agg[i].field);\n }\n }\n args.aggregates = res;\n }\n if (pvt && pvt.groups && pvt.groups.length) {\n var groups = pvt.groups;\n for (var i = 0; i < groups.length; i++) {\n var level = null;\n if (!isNullOrUndefined(groupDs)) {\n groupDs = DataUtil.group(groupDs, groups[i]);\n }\n var groupQuery = Query.filterQueries(query.queries, 'onGroup')[i].e;\n pData = DataUtil.group(pData, groups[i], pvt.aggregates, level, groupDs, groupQuery.comparer);\n }\n args.result = pData;\n }\n return args;\n };\n UrlAdaptor.prototype.getQueryRequest = function (query) {\n var req = { sorts: [], groups: [], filters: [], searches: [], aggregates: [] };\n req.sorts = Query.filterQueries(query.queries, 'onSortBy');\n req.groups = Query.filterQueries(query.queries, 'onGroup');\n req.filters = Query.filterQueries(query.queries, 'onWhere');\n req.searches = Query.filterQueries(query.queries, 'onSearch');\n req.aggregates = Query.filterQueries(query.queries, 'onAggregates');\n return req;\n };\n UrlAdaptor.prototype.addParams = function (options) {\n var req = options.reqParams;\n if (options.params.length) {\n req.params = {};\n }\n for (var _i = 0, _a = options.params; _i < _a.length; _i++) {\n var tmp = _a[_i];\n if (req[tmp.key]) {\n throw new Error('Query() - addParams: Custom Param is conflicting other request arguments');\n }\n req[tmp.key] = tmp.value;\n if (tmp.fn) {\n req[tmp.key] = tmp.fn.call(options.query, tmp.key, options.query, options.dm);\n }\n req.params[tmp.key] = req[tmp.key];\n }\n };\n return UrlAdaptor;\n}(Adaptor));\nexport { UrlAdaptor };\n/**\n * OData Adaptor that is extended from URL Adaptor, is used for consuming data through OData Service.\n * @hidden\n */\nvar ODataAdaptor = /** @class */ (function (_super) {\n __extends(ODataAdaptor, _super);\n function ODataAdaptor(props) {\n var _this = _super.call(this) || this;\n // options replaced the default adaptor options\n _this.options = extend({}, _this.options, {\n requestType: 'get',\n accept: 'application/json;odata=light;q=1,application/json;odata=verbose;q=0.5',\n multipartAccept: 'multipart/mixed',\n sortBy: '$orderby',\n select: '$select',\n skip: '$skip',\n take: '$top',\n count: '$inlinecount',\n where: '$filter',\n expand: '$expand',\n batch: '$batch',\n changeSet: '--changeset_',\n batchPre: 'batch_',\n contentId: 'Content-Id: ',\n batchContent: 'Content-Type: multipart/mixed; boundary=',\n changeSetContent: 'Content-Type: application/http\\nContent-Transfer-Encoding: binary ',\n batchChangeSetContentType: 'Content-Type: application/json; charset=utf-8 ',\n updateType: 'PUT'\n });\n extend(_this.options, props || {});\n return _this;\n }\n ODataAdaptor.prototype.getModuleName = function () {\n return 'ODataAdaptor';\n };\n /**\n * Generate request string based on the filter criteria from query.\n * @param {Predicate} pred\n * @param {boolean} requiresCast?\n */\n ODataAdaptor.prototype.onPredicate = function (predicate, query, requiresCast) {\n var returnValue = '';\n var operator;\n var guid;\n var val = predicate.value;\n var type = typeof val;\n var field = predicate.field ? ODataAdaptor.getField(predicate.field) : null;\n if (val instanceof Date) {\n val = 'datetime\\'' + DataUtil.parse.replacer(val) + '\\'';\n }\n if (type === 'string') {\n val = encodeURIComponent(val);\n val = '\\'' + val + '\\'';\n if (requiresCast) {\n field = 'cast(' + field + ', \\'Edm.String\\')';\n }\n if (DataUtil.parse.isGuid(val)) {\n guid = 'guid';\n }\n if (predicate.ignoreCase) {\n if (!guid) {\n field = 'tolower(' + field + ')';\n }\n val = val.toLowerCase();\n }\n }\n operator = DataUtil.odBiOperator[predicate.operator];\n if (operator) {\n returnValue += field;\n returnValue += operator;\n if (guid) {\n returnValue += guid;\n }\n return returnValue + val;\n }\n if (!isNullOrUndefined(this.getModuleName) && this.getModuleName() === 'ODataV4Adaptor') {\n operator = DataUtil.odv4UniOperator[predicate.operator];\n }\n else {\n operator = DataUtil.odUniOperator[predicate.operator];\n }\n if (operator === 'substringof') {\n var temp = val;\n val = field;\n field = temp;\n }\n returnValue += operator + '(';\n returnValue += field + ',';\n if (guid) {\n returnValue += guid;\n }\n returnValue += val + ')';\n return returnValue;\n };\n ODataAdaptor.prototype.addParams = function (options) {\n _super.prototype.addParams.call(this, options);\n delete options.reqParams.params;\n };\n /**\n * Generate request string based on the multiple filter criteria from query.\n * @param {Predicate} pred\n * @param {boolean} requiresCast?\n */\n ODataAdaptor.prototype.onComplexPredicate = function (predicate, query, requiresCast) {\n var res = [];\n for (var i = 0; i < predicate.predicates.length; i++) {\n res.push('(' + this.onEachWhere(predicate.predicates[i], query, requiresCast) + ')');\n }\n return res.join(' ' + predicate.condition + ' ');\n };\n /**\n * Generate query string based on the multiple filter criteria from query.\n * @param {Predicate} filter\n * @param {boolean} requiresCast?\n */\n ODataAdaptor.prototype.onEachWhere = function (filter, query, requiresCast) {\n return filter.isComplex ? this.onComplexPredicate(filter, query, requiresCast) : this.onPredicate(filter, query, requiresCast);\n };\n /**\n * Generate query string based on the multiple filter criteria from query.\n * @param {string[]} filters\n */\n ODataAdaptor.prototype.onWhere = function (filters) {\n if (this.pvt.search) {\n filters.push(this.onEachWhere(this.pvt.search, null, true));\n }\n return filters.join(' and ');\n };\n /**\n * Generate query string based on the multiple search criteria from query.\n * @param {{fields:string[]} e\n * @param {string} operator\n * @param {string} key\n * @param {boolean}} ignoreCase\n */\n ODataAdaptor.prototype.onEachSearch = function (e) {\n if (e.fields && e.fields.length === 0) {\n DataUtil.throwError('Query() - Search : oData search requires list of field names to search');\n }\n var filter = this.pvt.search || [];\n for (var i = 0; i < e.fields.length; i++) {\n filter.push(new Predicate(e.fields[i], e.operator, e.key, e.ignoreCase));\n }\n this.pvt.search = filter;\n };\n /**\n * Generate query string based on the search criteria from query.\n * @param {Object} e\n */\n ODataAdaptor.prototype.onSearch = function (e) {\n this.pvt.search = Predicate.or(this.pvt.search);\n return '';\n };\n /**\n * Generate query string based on multiple sort criteria from query.\n * @param {QueryOptions} e\n */\n ODataAdaptor.prototype.onEachSort = function (e) {\n var res = [];\n if (e.name instanceof Array) {\n for (var i = 0; i < e.name.length; i++) {\n res.push(ODataAdaptor.getField(e.name[i]) + (e.direction === 'descending' ? ' desc' : ''));\n }\n }\n else {\n res.push(ODataAdaptor.getField(e.name) + (e.direction === 'descending' ? ' desc' : ''));\n }\n return res.join(',');\n };\n /**\n * Returns sort query string.\n * @param {string[]} e\n */\n ODataAdaptor.prototype.onSortBy = function (e) {\n return e.reverse().join(',');\n };\n /**\n * Adds the group query to the adaptor option.\n * @param {Object[]} e\n * @returns string\n */\n ODataAdaptor.prototype.onGroup = function (e) {\n this.pvt.groups = e;\n return [];\n };\n /**\n * Returns the select query string.\n * @param {string[]} e\n */\n ODataAdaptor.prototype.onSelect = function (e) {\n for (var i = 0; i < e.length; i++) {\n e[i] = ODataAdaptor.getField(e[i]);\n }\n return e.join(',');\n };\n /**\n * Add the aggregate query to the adaptor option.\n * @param {Object[]} e\n * @returns string\n */\n ODataAdaptor.prototype.onAggregates = function (e) {\n this.pvt.aggregates = e;\n return '';\n };\n /**\n * Returns the query string which requests total count from the data source.\n * @param {boolean} e\n * @returns string\n */\n ODataAdaptor.prototype.onCount = function (e) {\n return e === true ? 'allpages' : '';\n };\n /**\n * Method will trigger before send the request to server side.\n * Used to set the custom header or modify the request options.\n * @param {DataManager} dm\n * @param {XMLHttpRequest} request\n * @param {Ajax} settings?\n */\n ODataAdaptor.prototype.beforeSend = function (dm, request, settings) {\n if (DataUtil.endsWith(settings.url, this.options.batch) && settings.type.toLowerCase() === 'post') {\n request.setRequestHeader('Accept', this.options.multipartAccept);\n request.setRequestHeader('DataServiceVersion', '2.0');\n request.overrideMimeType('text/plain; charset=x-user-defined');\n }\n else {\n request.setRequestHeader('Accept', this.options.accept);\n }\n request.setRequestHeader('DataServiceVersion', '2.0');\n request.setRequestHeader('MaxDataServiceVersion', '2.0');\n };\n /**\n * Returns the data from the query processing.\n * @param {DataResult} data\n * @param {DataOptions} ds?\n * @param {Query} query?\n * @param {XMLHttpRequest} xhr?\n * @param {Ajax} request?\n * @param {CrudOptions} changes?\n * @returns aggregateResult\n */\n ODataAdaptor.prototype.processResponse = function (data, ds, query, xhr, request, changes) {\n var pvtData = 'pvtData';\n if (!isNullOrUndefined(data.d)) {\n var dataCopy = ((query && query.isCountRequired) ? data.d.results : data.d);\n var metaData = '__metadata';\n if (!isNullOrUndefined(dataCopy)) {\n for (var i = 0; i < dataCopy.length; i++) {\n if (!isNullOrUndefined(dataCopy[i][metaData])) {\n delete dataCopy[i][metaData];\n }\n }\n }\n }\n var pvt = request && request[pvtData];\n var emptyAndBatch = this.processBatchResponse(data, query, xhr, request, changes);\n if (emptyAndBatch) {\n return emptyAndBatch;\n }\n var versionCheck = xhr && request.getResponseHeader('DataServiceVersion');\n var count = null;\n var version = (versionCheck && parseInt(versionCheck, 10)) || 2;\n if (query && query.isCountRequired) {\n var oDataCount = '__count';\n if (data[oDataCount] || data['odata.count']) {\n count = data[oDataCount] || data['odata.count'];\n }\n if (data.d) {\n data = data.d;\n }\n if (data[oDataCount] || data['odata.count']) {\n count = data[oDataCount] || data['odata.count'];\n }\n }\n if (version === 3 && data.value) {\n data = data.value;\n }\n if (data.d) {\n data = data.d;\n }\n if (version < 3 && data.results) {\n data = data.results;\n }\n var args = {};\n args.count = count;\n args.result = data;\n this.getAggregateResult(pvt, data, args, null, query);\n return DataUtil.isNull(count) ? args.result : { result: args.result, count: args.count, aggregates: args.aggregates };\n };\n /**\n * Converts the request object to query string.\n * @param {Object} req\n * @param {Query} query\n * @param {DataManager} dm\n * @returns tableName\n */\n ODataAdaptor.prototype.convertToQueryString = function (request, query, dm) {\n var res = [];\n var table = 'table';\n var tableName = request[table] || '';\n var format = '$format';\n delete request[table];\n if (dm.dataSource.requiresFormat) {\n request[format] = 'json';\n }\n var keys = Object.keys(request);\n for (var _i = 0, keys_4 = keys; _i < keys_4.length; _i++) {\n var prop = keys_4[_i];\n res.push(prop + '=' + request[prop]);\n }\n res = res.join('&');\n if (dm.dataSource.url && dm.dataSource.url.indexOf('?') !== -1 && !tableName) {\n return res;\n }\n return res.length ? tableName + '?' + res : tableName || '';\n };\n ODataAdaptor.prototype.localTimeReplacer = function (key, convertObj) {\n for (var _i = 0, _a = !isNullOrUndefined(convertObj) ? Object.keys(convertObj) : []; _i < _a.length; _i++) {\n var prop = _a[_i];\n if ((convertObj[prop] instanceof Date)) {\n convertObj[prop] = DataUtil.dateParse.toLocalTime(convertObj[prop]);\n }\n }\n return convertObj;\n };\n /**\n * Prepare and returns request body which is used to insert a new record in the table.\n * @param {DataManager} dm\n * @param {Object} data\n * @param {string} tableName?\n */\n ODataAdaptor.prototype.insert = function (dm, data, tableName) {\n return {\n url: (dm.dataSource.insertUrl || dm.dataSource.url).replace(/\\/*$/, tableName ? '/' + tableName : ''),\n data: JSON.stringify(data, this.options.localTime ? this.localTimeReplacer : null)\n };\n };\n /**\n * Prepare and return request body which is used to remove record from the table.\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {number} value\n * @param {string} tableName?\n */\n ODataAdaptor.prototype.remove = function (dm, keyField, value, tableName) {\n var url;\n if (typeof value === 'string' && !DataUtil.parse.isGuid(value)) {\n url = \"('\" + value + \"')\";\n }\n else {\n url = \"(\" + value + \")\";\n }\n return {\n type: 'DELETE',\n url: (dm.dataSource.removeUrl || dm.dataSource.url).replace(/\\/*$/, tableName ? '/' + tableName : '') + url\n };\n };\n /**\n * Updates existing record and saves the changes to the table.\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {Object} value\n * @param {string} tableName?\n * @returns this\n */\n ODataAdaptor.prototype.update = function (dm, keyField, value, tableName, query, original) {\n if (this.options.updateType === 'PATCH' && !isNullOrUndefined(original)) {\n value = this.compareAndRemove(value, original, keyField);\n }\n var url;\n if (typeof value[keyField] === 'string' && !DataUtil.parse.isGuid(value[keyField])) {\n url = \"('\" + value[keyField] + \"')\";\n }\n else {\n url = \"(\" + value[keyField] + \")\";\n }\n return {\n type: this.options.updateType,\n url: (dm.dataSource.updateUrl || dm.dataSource.url).replace(/\\/*$/, tableName ? '/' + tableName : '') + url,\n data: JSON.stringify(value, this.options.localTime ? this.localTimeReplacer : null),\n accept: this.options.accept\n };\n };\n /**\n * Prepare the request body based on the newly added, removed and updated records.\n * The result is used by the batch request.\n * @param {DataManager} dm\n * @param {CrudOptions} changes\n * @param {RemoteArgs} e\n * @returns {Object}\n */\n ODataAdaptor.prototype.batchRequest = function (dm, changes, e, query, original) {\n var initialGuid = e.guid = DataUtil.getGuid(this.options.batchPre);\n var url = dm.dataSource.url.replace(/\\/*$/, '/' + this.options.batch);\n var args = {\n url: e.url,\n key: e.key,\n cid: 1,\n cSet: DataUtil.getGuid(this.options.changeSet)\n };\n var req = '--' + initialGuid + '\\n';\n req += 'Content-Type: multipart/mixed; boundary=' + args.cSet.replace('--', '') + '\\n';\n this.pvt.changeSet = 0;\n req += this.generateInsertRequest(changes.addedRecords, args, dm);\n req += this.generateUpdateRequest(changes.changedRecords, args, dm, original ? original.changedRecords : []);\n req += this.generateDeleteRequest(changes.deletedRecords, args, dm);\n req += args.cSet + '--\\n';\n req += '--' + initialGuid + '--';\n return {\n type: 'POST',\n url: url,\n dataType: 'json',\n contentType: 'multipart/mixed; charset=UTF-8;boundary=' + initialGuid,\n data: req\n };\n };\n /**\n * Generate the string content from the removed records.\n * The result will be send during batch update.\n * @param {Object[]} arr\n * @param {RemoteArgs} e\n * @returns this\n */\n ODataAdaptor.prototype.generateDeleteRequest = function (arr, e, dm) {\n if (!arr) {\n return '';\n }\n var req = '';\n var stat = {\n 'method': 'DELETE ',\n 'url': function (data, i, key) { return '(' + data[i][key] + ')'; },\n 'data': function (data, i) { return ''; }\n };\n req = this.generateBodyContent(arr, e, stat, dm);\n return req + '\\n';\n };\n /**\n * Generate the string content from the inserted records.\n * The result will be send during batch update.\n * @param {Object[]} arr\n * @param {RemoteArgs} e\n */\n ODataAdaptor.prototype.generateInsertRequest = function (arr, e, dm) {\n if (!arr) {\n return '';\n }\n var req = '';\n var stat = {\n 'method': 'POST ',\n 'url': function (data, i, key) { return ''; },\n 'data': function (data, i) { return JSON.stringify(data[i]) + '\\n\\n'; }\n };\n req = this.generateBodyContent(arr, e, stat, dm);\n return req;\n };\n /**\n * Generate the string content from the updated records.\n * The result will be send during batch update.\n * @param {Object[]} arr\n * @param {RemoteArgs} e\n */\n ODataAdaptor.prototype.generateUpdateRequest = function (arr, e, dm, org) {\n var _this = this;\n if (!arr) {\n return '';\n }\n var req = '';\n arr.forEach(function (change) { return change = _this.compareAndRemove(change, org.filter(function (o) { return DataUtil.getObject(e.key, o) === DataUtil.getObject(e.key, change); })[0], e.key); });\n var stat = {\n 'method': this.options.updateType + ' ',\n 'url': function (data, i, key) { return '(' + data[i][key] + ')'; },\n 'data': function (data, i) { return JSON.stringify(data[i]) + '\\n\\n'; }\n };\n req = this.generateBodyContent(arr, e, stat, dm);\n return req;\n };\n ODataAdaptor.getField = function (prop) {\n return prop.replace(/\\./g, '/');\n };\n ODataAdaptor.prototype.generateBodyContent = function (arr, e, stat, dm) {\n var req = '';\n for (var i = 0; i < arr.length; i++) {\n req += '\\n' + e.cSet + '\\n';\n req += this.options.changeSetContent + '\\n\\n';\n req += stat.method;\n if (stat.method === 'POST ') {\n req += (dm.dataSource.insertUrl || dm.dataSource.crudUrl || e.url) + stat.url(arr, i, e.key) + ' HTTP/1.1\\n';\n }\n else if (stat.method === 'PUT ' || stat.method === 'PATCH ') {\n req += (dm.dataSource.updateUrl || dm.dataSource.crudUrl || e.url) + stat.url(arr, i, e.key) + ' HTTP/1.1\\n';\n }\n else if (stat.method === 'DELETE ') {\n req += (dm.dataSource.removeUrl || dm.dataSource.crudUrl || e.url) + stat.url(arr, i, e.key) + ' HTTP/1.1\\n';\n }\n req += 'Accept: ' + this.options.accept + '\\n';\n req += 'Content-Id: ' + this.pvt.changeSet++ + '\\n';\n req += this.options.batchChangeSetContentType + '\\n';\n if (!isNullOrUndefined(arr[i]['@odata.etag'])) {\n req += 'If-Match: ' + arr[i]['@odata.etag'] + '\\n\\n';\n delete arr[i]['@odata.etag'];\n }\n else {\n req += '\\n';\n }\n req += stat.data(arr, i);\n }\n return req;\n };\n ODataAdaptor.prototype.processBatchResponse = function (data, query, xhr, request, changes) {\n if (xhr && xhr.getResponseHeader('Content-Type') && xhr.getResponseHeader('Content-Type').indexOf('xml') !== -1) {\n return (query.isCountRequired ? { result: [], count: 0 } : []);\n }\n if (request && this.options.batch && DataUtil.endsWith(request.url, this.options.batch) && request.type.toLowerCase() === 'post') {\n var guid = xhr.getResponseHeader('Content-Type');\n var cIdx = void 0;\n var jsonObj = void 0;\n var d = data + '';\n guid = guid.substring(guid.indexOf('=batchresponse') + 1);\n d = d.split(guid);\n if (d.length < 2) {\n return {};\n }\n d = d[1];\n var exVal = /(?:\\bContent-Type.+boundary=)(changesetresponse.+)/i.exec(d);\n if (exVal) {\n d.replace(exVal[0], '');\n }\n var changeGuid = exVal ? exVal[1] : '';\n d = d.split(changeGuid);\n for (var i = d.length; i > -1; i--) {\n if (!/\\bContent-ID:/i.test(d[i]) || !/\\bHTTP.+201/.test(d[i])) {\n continue;\n }\n cIdx = parseInt(/\\bContent-ID: (\\d+)/i.exec(d[i])[1], 10);\n if (changes.addedRecords[cIdx]) {\n jsonObj = DataUtil.parse.parseJson(/^\\{.+\\}/m.exec(d[i])[0]);\n extend({}, changes.addedRecords[cIdx], this.processResponse(jsonObj));\n }\n }\n return changes;\n }\n return null;\n };\n ODataAdaptor.prototype.compareAndRemove = function (data, original, key) {\n var _this = this;\n if (isNullOrUndefined(original)) {\n return data;\n }\n Object.keys(data).forEach(function (prop) {\n if (prop !== key && prop !== '@odata.etag') {\n if (DataUtil.isPlainObject(data[prop])) {\n _this.compareAndRemove(data[prop], original[prop]);\n var final = Object.keys(data[prop]).filter(function (data) { return data !== '@odata.etag'; });\n if (final.length === 0) {\n delete data[prop];\n }\n }\n else if (data[prop] === original[prop]) {\n delete data[prop];\n }\n else if (data[prop] && original[prop] && data[prop].valueOf() === original[prop].valueOf()) {\n delete data[prop];\n }\n }\n });\n return data;\n };\n return ODataAdaptor;\n}(UrlAdaptor));\nexport { ODataAdaptor };\n/**\n * The OData v4 is an improved version of OData protocols.\n * The DataManager uses the ODataV4Adaptor to consume OData v4 services.\n * @hidden\n */\nvar ODataV4Adaptor = /** @class */ (function (_super) {\n __extends(ODataV4Adaptor, _super);\n function ODataV4Adaptor(props) {\n var _this = _super.call(this, props) || this;\n // options replaced the default adaptor options\n _this.options = extend({}, _this.options, {\n requestType: 'get',\n accept: 'application/json, text/javascript, */*; q=0.01',\n multipartAccept: 'multipart/mixed',\n sortBy: '$orderby',\n select: '$select',\n skip: '$skip',\n take: '$top',\n count: '$count',\n search: '$search',\n where: '$filter',\n expand: '$expand',\n batch: '$batch',\n changeSet: '--changeset_',\n batchPre: 'batch_',\n contentId: 'Content-Id: ',\n batchContent: 'Content-Type: multipart/mixed; boundary=',\n changeSetContent: 'Content-Type: application/http\\nContent-Transfer-Encoding: binary ',\n batchChangeSetContentType: 'Content-Type: application/json; charset=utf-8 ',\n updateType: 'PATCH',\n localTime: false,\n apply: '$apply'\n });\n extend(_this.options, props || {});\n return _this;\n }\n /**\n * @hidden\n */\n ODataV4Adaptor.prototype.getModuleName = function () {\n return 'ODataV4Adaptor';\n };\n /**\n * Returns the query string which requests total count from the data source.\n * @param {boolean} e\n * @returns string\n */\n ODataV4Adaptor.prototype.onCount = function (e) {\n return e === true ? 'true' : '';\n };\n /**\n * Generate request string based on the filter criteria from query.\n * @param {Predicate} pred\n * @param {boolean} requiresCast?\n */\n ODataV4Adaptor.prototype.onPredicate = function (predicate, query, requiresCast) {\n var returnValue = '';\n var val = predicate.value;\n var isDate = val instanceof Date;\n returnValue = _super.prototype.onPredicate.call(this, predicate, query, requiresCast);\n if (isDate) {\n returnValue = returnValue.replace(/datetime'(.*)'$/, '$1');\n }\n return returnValue;\n };\n /**\n * Generate query string based on the multiple search criteria from query.\n * @param {{fields:string[]} e\n * @param {string} operator\n * @param {string} key\n * @param {boolean}} ignoreCase\n */\n ODataV4Adaptor.prototype.onEachSearch = function (e) {\n var search = this.pvt.searches || [];\n search.push(e.key);\n this.pvt.searches = search;\n };\n /**\n * Generate query string based on the search criteria from query.\n * @param {Object} e\n */\n ODataV4Adaptor.prototype.onSearch = function (e) {\n return this.pvt.searches.join(' OR ');\n };\n /**\n * Returns the expand query string.\n * @param {string} e\n */\n ODataV4Adaptor.prototype.onExpand = function (e) {\n var _this = this;\n var selected = {};\n var expanded = {};\n var expands = e.expands.slice();\n var exArr = [];\n var selects = e.selects.filter(function (item) { return item.indexOf('.') > -1; });\n selects.forEach(function (select) {\n var splits = select.split('.');\n if (!(splits[0] in selected)) {\n selected[splits[0]] = [];\n }\n selected[splits[0]].push(splits[1]);\n });\n //Auto expand from select query\n Object.keys(selected).forEach(function (expand) {\n if ((expands.indexOf(expand) === -1)) {\n expands.push(expand);\n }\n });\n expands.forEach(function (expand) {\n expanded[expand] = expand in selected ? expand + \"(\" + _this.options.select + \"=\" + selected[expand].join(',') + \")\" : expand;\n });\n Object.keys(expanded).forEach(function (ex) { return exArr.push(expanded[ex]); });\n return exArr.join(',');\n };\n /**\n * Returns the groupby query string.\n * @param {string} e\n */\n ODataV4Adaptor.prototype.onDistinct = function (distinctFields) {\n var fields = distinctFields.map(function (field) { return ODataAdaptor.getField(field); }).join(',');\n return \"groupby((\" + fields + \"))\";\n };\n /**\n * Returns the select query string.\n * @param {string[]} e\n */\n ODataV4Adaptor.prototype.onSelect = function (e) {\n return _super.prototype.onSelect.call(this, e.filter(function (item) { return item.indexOf('.') === -1; }));\n };\n /**\n * Method will trigger before send the request to server side.\n * Used to set the custom header or modify the request options.\n * @param {DataManager} dm\n * @param {XMLHttpRequest} request\n * @param {Ajax} settings\n * @returns void\n */\n ODataV4Adaptor.prototype.beforeSend = function (dm, request, settings) {\n if (settings.type === 'POST' || settings.type === 'PUT' || settings.type === 'PATCH') {\n request.setRequestHeader('Prefer', 'return=representation');\n }\n request.setRequestHeader('Accept', this.options.accept);\n };\n /**\n * Returns the data from the query processing.\n * @param {DataResult} data\n * @param {DataOptions} ds?\n * @param {Query} query?\n * @param {XMLHttpRequest} xhr?\n * @param {Ajax} request?\n * @param {CrudOptions} changes?\n * @returns aggregateResult\n */\n ODataV4Adaptor.prototype.processResponse = function (data, ds, query, xhr, request, changes) {\n var pvtData = 'pvtData';\n var pvt = request && request[pvtData];\n var emptyAndBatch = _super.prototype.processBatchResponse.call(this, data, query, xhr, request, changes);\n if (emptyAndBatch) {\n return emptyAndBatch;\n }\n var count = null;\n var dataCount = '@odata.count';\n if (query && query.isCountRequired) {\n if (dataCount in data) {\n count = data[dataCount];\n }\n }\n data = !isNullOrUndefined(data.value) ? data.value : data;\n var args = {};\n args.count = count;\n args.result = data;\n this.getAggregateResult(pvt, data, args, null, query);\n return DataUtil.isNull(count) ? args.result : { result: args.result, count: count, aggregates: args.aggregates };\n };\n return ODataV4Adaptor;\n}(ODataAdaptor));\nexport { ODataV4Adaptor };\n/**\n * The Web API is a programmatic interface to define the request and response messages system that is mostly exposed in JSON or XML.\n * The DataManager uses the WebApiAdaptor to consume Web API.\n * Since this adaptor is targeted to interact with Web API created using OData endpoint, it is extended from ODataAdaptor\n * @hidden\n */\nvar WebApiAdaptor = /** @class */ (function (_super) {\n __extends(WebApiAdaptor, _super);\n function WebApiAdaptor() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n WebApiAdaptor.prototype.getModuleName = function () {\n return 'WebApiAdaptor';\n };\n /**\n * Prepare and returns request body which is used to insert a new record in the table.\n * @param {DataManager} dm\n * @param {Object} data\n * @param {string} tableName?\n */\n WebApiAdaptor.prototype.insert = function (dm, data, tableName) {\n return {\n type: 'POST',\n url: dm.dataSource.url,\n data: JSON.stringify(data)\n };\n };\n /**\n * Prepare and return request body which is used to remove record from the table.\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {number} value\n * @param {string} tableName?\n */\n WebApiAdaptor.prototype.remove = function (dm, keyField, value, tableName) {\n return {\n type: 'DELETE',\n url: dm.dataSource.url + '/' + value,\n data: JSON.stringify(value)\n };\n };\n /**\n * Prepare and return request body which is used to update record.\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {Object} value\n * @param {string} tableName?\n */\n WebApiAdaptor.prototype.update = function (dm, keyField, value, tableName) {\n return {\n type: 'PUT',\n url: dm.dataSource.url,\n data: JSON.stringify(value)\n };\n };\n /**\n * Method will trigger before send the request to server side.\n * Used to set the custom header or modify the request options.\n * @param {DataManager} dm\n * @param {XMLHttpRequest} request\n * @param {Ajax} settings\n * @returns void\n */\n WebApiAdaptor.prototype.beforeSend = function (dm, request, settings) {\n request.setRequestHeader('Accept', 'application/json, text/javascript, */*; q=0.01');\n };\n /**\n * Returns the data from the query processing.\n * @param {DataResult} data\n * @param {DataOptions} ds?\n * @param {Query} query?\n * @param {XMLHttpRequest} xhr?\n * @param {Ajax} request?\n * @param {CrudOptions} changes?\n * @returns aggregateResult\n */\n WebApiAdaptor.prototype.processResponse = function (data, ds, query, xhr, request, changes) {\n var pvtData = 'pvtData';\n var pvt = request && request[pvtData];\n var count = null;\n var args = {};\n if (request && request.type.toLowerCase() !== 'post') {\n var versionCheck = xhr && request.getResponseHeader('DataServiceVersion');\n var version = (versionCheck && parseInt(versionCheck, 10)) || 2;\n if (query && query.isCountRequired) {\n if (!DataUtil.isNull(data.Count)) {\n count = data.Count;\n }\n }\n if (version < 3 && data.Items) {\n data = data.Items;\n }\n args.count = count;\n args.result = data;\n this.getAggregateResult(pvt, data, args, null, query);\n }\n args.result = args.result || data;\n return DataUtil.isNull(count) ? args.result : { result: args.result, count: args.count, aggregates: args.aggregates };\n };\n return WebApiAdaptor;\n}(ODataAdaptor));\nexport { WebApiAdaptor };\n/**\n * WebMethodAdaptor can be used by DataManager to interact with web method.\n * @hidden\n */\nvar WebMethodAdaptor = /** @class */ (function (_super) {\n __extends(WebMethodAdaptor, _super);\n function WebMethodAdaptor() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Prepare the request body based on the query.\n * The query information can be accessed at the WebMethod using variable named `value`.\n * @param {DataManager} dm\n * @param {Query} query\n * @param {Object[]} hierarchyFilters?\n * @returns application\n */\n WebMethodAdaptor.prototype.processQuery = function (dm, query, hierarchyFilters) {\n var obj = new UrlAdaptor().processQuery(dm, query, hierarchyFilters);\n var getData = 'data';\n var data = DataUtil.parse.parseJson(obj[getData]);\n var result = {};\n var value = 'value';\n if (data.param) {\n for (var i = 0; i < data.param.length; i++) {\n var param = data.param[i];\n var key = Object.keys(param)[0];\n result[key] = param[key];\n }\n }\n result[value] = data;\n var pvtData = 'pvtData';\n var url = 'url';\n return {\n data: JSON.stringify(result),\n url: obj[url],\n pvtData: obj[pvtData],\n type: 'POST',\n contentType: 'application/json; charset=utf-8'\n };\n };\n return WebMethodAdaptor;\n}(UrlAdaptor));\nexport { WebMethodAdaptor };\n/**\n * RemoteSaveAdaptor, extended from JsonAdaptor and it is used for binding local data and performs all DataManager queries in client-side.\n * It interacts with server-side only for CRUD operations.\n * @hidden\n */\nvar RemoteSaveAdaptor = /** @class */ (function (_super) {\n __extends(RemoteSaveAdaptor, _super);\n /**\n * @hidden\n */\n function RemoteSaveAdaptor() {\n var _this = _super.call(this) || this;\n setValue('beforeSend', UrlAdaptor.prototype.beforeSend, _this);\n return _this;\n }\n RemoteSaveAdaptor.prototype.insert = function (dm, data, tableName, query) {\n this.updateType = 'add';\n return {\n url: dm.dataSource.insertUrl || dm.dataSource.crudUrl || dm.dataSource.url,\n data: JSON.stringify(extend({}, {\n value: data,\n table: tableName,\n action: 'insert'\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n RemoteSaveAdaptor.prototype.remove = function (dm, keyField, val, tableName, query) {\n _super.prototype.remove.call(this, dm, keyField, val);\n return {\n type: 'POST',\n url: dm.dataSource.removeUrl || dm.dataSource.crudUrl || dm.dataSource.url,\n data: JSON.stringify(extend({}, {\n key: val,\n keyColumn: keyField,\n table: tableName,\n action: 'remove'\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n RemoteSaveAdaptor.prototype.update = function (dm, keyField, val, tableName, query) {\n this.updateType = 'update';\n this.updateKey = keyField;\n return {\n type: 'POST',\n url: dm.dataSource.updateUrl || dm.dataSource.crudUrl || dm.dataSource.url,\n data: JSON.stringify(extend({}, {\n value: val,\n action: 'update',\n keyColumn: keyField,\n key: val[keyField],\n table: tableName\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n RemoteSaveAdaptor.prototype.processResponse = function (data, ds, query, xhr, request, changes, e) {\n var i;\n if (this.updateType === 'add') {\n _super.prototype.insert.call(this, ds, data);\n }\n if (this.updateType === 'update') {\n _super.prototype.update.call(this, ds, this.updateKey, data);\n }\n this.updateType = undefined;\n if (data.added) {\n for (i = 0; i < data.added.length; i++) {\n _super.prototype.insert.call(this, ds, data.added[i]);\n }\n }\n if (data.changed) {\n for (i = 0; i < data.changed.length; i++) {\n _super.prototype.update.call(this, ds, e.key, data.changed[i]);\n }\n }\n if (data.deleted) {\n for (i = 0; i < data.deleted.length; i++) {\n _super.prototype.remove.call(this, ds, e.key, data.deleted[i]);\n }\n }\n return data;\n };\n /**\n * Prepare the request body based on the newly added, removed and updated records.\n * Also perform the changes in the locally cached data to sync with the remote data.\n * The result is used by the batch request.\n * @param {DataManager} dm\n * @param {CrudOptions} changes\n * @param {RemoteArgs} e\n */\n RemoteSaveAdaptor.prototype.batchRequest = function (dm, changes, e) {\n return {\n type: 'POST',\n url: dm.dataSource.batchUrl || dm.dataSource.crudUrl || dm.dataSource.url,\n contentType: 'application/json; charset=utf-8',\n dataType: 'json',\n data: JSON.stringify({\n changed: changes.changedRecords,\n added: changes.addedRecords,\n deleted: changes.deletedRecords,\n action: 'batch',\n table: e.url,\n key: e.key\n })\n };\n };\n RemoteSaveAdaptor.prototype.addParams = function (options) {\n var urlParams = new UrlAdaptor();\n urlParams.addParams(options);\n };\n return RemoteSaveAdaptor;\n}(JsonAdaptor));\nexport { RemoteSaveAdaptor };\n/**\n * Cache Adaptor is used to cache the data of the visited pages. It prevents new requests for the previously visited pages.\n * You can configure cache page size and duration of caching by using cachingPageSize and timeTillExpiration properties of the DataManager\n * @hidden\n */\nvar CacheAdaptor = /** @class */ (function (_super) {\n __extends(CacheAdaptor, _super);\n /**\n * Constructor for CacheAdaptor class.\n * @param {CacheAdaptor} adaptor?\n * @param {number} timeStamp?\n * @param {number} pageSize?\n * @hidden\n */\n function CacheAdaptor(adaptor, timeStamp, pageSize) {\n var _this = _super.call(this) || this;\n _this.isCrudAction = false;\n _this.isInsertAction = false;\n if (!isNullOrUndefined(adaptor)) {\n _this.cacheAdaptor = adaptor;\n }\n _this.pageSize = pageSize;\n _this.guidId = DataUtil.getGuid('cacheAdaptor');\n var obj = { keys: [], results: [] };\n window.localStorage.setItem(_this.guidId, JSON.stringify(obj));\n var guid = _this.guidId;\n if (!isNullOrUndefined(timeStamp)) {\n setInterval(function () {\n var data;\n data = DataUtil.parse.parseJson(window.localStorage.getItem(guid));\n var forDel = [];\n for (var i = 0; i < data.results.length; i++) {\n var currentTime = +new Date();\n var requestTime = +new Date(data.results[i].timeStamp);\n data.results[i].timeStamp = currentTime - requestTime;\n if (currentTime - requestTime > timeStamp) {\n forDel.push(i);\n }\n }\n for (var i = 0; i < forDel.length; i++) {\n data.results.splice(forDel[i], 1);\n data.keys.splice(forDel[i], 1);\n }\n window.localStorage.removeItem(guid);\n window.localStorage.setItem(guid, JSON.stringify(data));\n }, timeStamp);\n }\n return _this;\n }\n /**\n * It will generate the key based on the URL when we send a request to server.\n * @param {string} url\n * @param {Query} query?\n * @hidden\n */\n CacheAdaptor.prototype.generateKey = function (url, query) {\n var queries = this.getQueryRequest(query);\n var singles = Query.filterQueryLists(query.queries, ['onSelect', 'onPage', 'onSkip', 'onTake', 'onRange']);\n var key = url;\n var page = 'onPage';\n if (page in singles) {\n key += singles[page].pageIndex;\n }\n queries.sorts.forEach(function (obj) {\n key += obj.e.direction + obj.e.fieldName;\n });\n queries.groups.forEach(function (obj) {\n key += obj.e.fieldName;\n });\n queries.searches.forEach(function (obj) {\n key += obj.e.searchKey;\n });\n for (var filter = 0; filter < queries.filters.length; filter++) {\n var currentFilter = queries.filters[filter];\n if (currentFilter.e.isComplex) {\n var newQuery = query.clone();\n newQuery.queries = [];\n for (var i = 0; i < currentFilter.e.predicates.length; i++) {\n newQuery.queries.push({ fn: 'onWhere', e: currentFilter.e.predicates[i], filter: query.queries.filter });\n }\n key += currentFilter.e.condition + this.generateKey(url, newQuery);\n }\n else {\n key += currentFilter.e.field + currentFilter.e.operator + currentFilter.e.value;\n }\n }\n return key;\n };\n /**\n * Process the query to generate request body.\n * If the data is already cached, it will return the cached data.\n * @param {DataManager} dm\n * @param {Query} query?\n * @param {Object[]} hierarchyFilters?\n */\n CacheAdaptor.prototype.processQuery = function (dm, query, hierarchyFilters) {\n var key = this.generateKey(dm.dataSource.url, query);\n var cachedItems;\n cachedItems = DataUtil.parse.parseJson(window.localStorage.getItem(this.guidId));\n var data = cachedItems ? cachedItems.results[cachedItems.keys.indexOf(key)] : null;\n if (data != null && !this.isCrudAction && !this.isInsertAction) {\n return data;\n }\n this.isCrudAction = null;\n this.isInsertAction = null;\n return this.cacheAdaptor.processQuery.apply(this.cacheAdaptor, [].slice.call(arguments, 0));\n };\n /**\n * Returns the data from the query processing.\n * It will also cache the data for later usage.\n * @param {DataResult} data\n * @param {DataManager} ds?\n * @param {Query} query?\n * @param {XMLHttpRequest} xhr?\n * @param {Ajax} request?\n * @param {CrudOptions} changes?\n */\n CacheAdaptor.prototype.processResponse = function (data, ds, query, xhr, request, changes) {\n if (this.isInsertAction || (request && this.cacheAdaptor.options.batch &&\n DataUtil.endsWith(request.url, this.cacheAdaptor.options.batch) && request.type.toLowerCase() === 'post')) {\n return this.cacheAdaptor.processResponse(data, ds, query, xhr, request, changes);\n }\n data = this.cacheAdaptor.processResponse.apply(this.cacheAdaptor, [].slice.call(arguments, 0));\n var key = query ? this.generateKey(ds.dataSource.url, query) : ds.dataSource.url;\n var obj = {};\n obj = DataUtil.parse.parseJson(window.localStorage.getItem(this.guidId));\n var index = obj.keys.indexOf(key);\n if (index !== -1) {\n obj.results.splice(index, 1);\n obj.keys.splice(index, 1);\n }\n obj.results[obj.keys.push(key) - 1] = { keys: key, result: data.result, timeStamp: new Date(), count: data.count };\n while (obj.results.length > this.pageSize) {\n obj.results.splice(0, 1);\n obj.keys.splice(0, 1);\n }\n window.localStorage.setItem(this.guidId, JSON.stringify(obj));\n return data;\n };\n /**\n * Method will trigger before send the request to server side. Used to set the custom header or modify the request options.\n * @param {DataManager} dm\n * @param {XMLHttpRequest} request\n * @param {Ajax} settings?\n */\n CacheAdaptor.prototype.beforeSend = function (dm, request, settings) {\n if (DataUtil.endsWith(settings.url, this.cacheAdaptor.options.batch) && settings.type.toLowerCase() === 'post') {\n request.setRequestHeader('Accept', this.cacheAdaptor.options.multipartAccept);\n }\n if (!dm.dataSource.crossDomain) {\n request.setRequestHeader('Accept', this.cacheAdaptor.options.accept);\n }\n };\n /**\n * Updates existing record and saves the changes to the table.\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {Object} value\n * @param {string} tableName\n */\n CacheAdaptor.prototype.update = function (dm, keyField, value, tableName) {\n this.isCrudAction = true;\n return this.cacheAdaptor.update(dm, keyField, value, tableName);\n };\n /**\n * Prepare and returns request body which is used to insert a new record in the table.\n * @param {DataManager} dm\n * @param {Object} data\n * @param {string} tableName?\n */\n CacheAdaptor.prototype.insert = function (dm, data, tableName) {\n this.isInsertAction = true;\n return this.cacheAdaptor.insert(dm, data, tableName);\n };\n /**\n * Prepare and return request body which is used to remove record from the table.\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {Object} value\n * @param {string} tableName?\n */\n CacheAdaptor.prototype.remove = function (dm, keyField, value, tableName) {\n this.isCrudAction = true;\n return this.cacheAdaptor.remove(dm, keyField, value, tableName);\n };\n /**\n * Prepare the request body based on the newly added, removed and updated records.\n * The result is used by the batch request.\n * @param {DataManager} dm\n * @param {CrudOptions} changes\n * @param {RemoteArgs} e\n */\n CacheAdaptor.prototype.batchRequest = function (dm, changes, e) {\n return this.cacheAdaptor.batchRequest(dm, changes, e);\n };\n return CacheAdaptor;\n}(UrlAdaptor));\nexport { CacheAdaptor };\n","import { Ajax } from '@syncfusion/ej2-base';\nimport { extend, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { DataUtil } from './util';\nimport { Query } from './query';\nimport { ODataAdaptor, JsonAdaptor, CacheAdaptor, RemoteSaveAdaptor } from './adaptors';\n/**\n * DataManager is used to manage and manipulate relational data.\n */\nvar DataManager = /** @class */ (function () {\n /**\n * Constructor for DataManager class\n * @param {DataOptions|JSON[]} dataSource?\n * @param {Query} query?\n * @param {AdaptorOptions|string} adaptor?\n * @hidden\n */\n function DataManager(dataSource, query, adaptor) {\n var _this = this;\n /** @hidden */\n this.dateParse = true;\n this.requests = [];\n if (!dataSource && !this.dataSource) {\n dataSource = [];\n }\n adaptor = adaptor || dataSource.adaptor;\n var data;\n if (dataSource instanceof Array) {\n data = {\n json: dataSource,\n offline: true\n };\n }\n else if (typeof dataSource === 'object') {\n if (!dataSource.json) {\n dataSource.json = [];\n }\n data = {\n url: dataSource.url,\n insertUrl: dataSource.insertUrl,\n removeUrl: dataSource.removeUrl,\n updateUrl: dataSource.updateUrl,\n crudUrl: dataSource.crudUrl,\n batchUrl: dataSource.batchUrl,\n json: dataSource.json,\n headers: dataSource.headers,\n accept: dataSource.accept,\n data: dataSource.data,\n timeTillExpiration: dataSource.timeTillExpiration,\n cachingPageSize: dataSource.cachingPageSize,\n enableCaching: dataSource.enableCaching,\n requestType: dataSource.requestType,\n key: dataSource.key,\n crossDomain: dataSource.crossDomain,\n jsonp: dataSource.jsonp,\n dataType: dataSource.dataType,\n offline: dataSource.offline !== undefined ? dataSource.offline\n : dataSource.adaptor instanceof RemoteSaveAdaptor ? false : dataSource.url ? false : true,\n requiresFormat: dataSource.requiresFormat\n };\n }\n else {\n DataUtil.throwError('DataManager: Invalid arguments');\n }\n if (data.requiresFormat === undefined && !DataUtil.isCors()) {\n data.requiresFormat = isNullOrUndefined(data.crossDomain) ? true : data.crossDomain;\n }\n if (data.dataType === undefined) {\n data.dataType = 'json';\n }\n this.dataSource = data;\n this.defaultQuery = query;\n if (data.url && data.offline && !data.json.length) {\n this.isDataAvailable = false;\n this.adaptor = adaptor || new ODataAdaptor();\n this.dataSource.offline = false;\n this.ready = this.executeQuery(query || new Query());\n this.ready.then(function (e) {\n _this.dataSource.offline = true;\n _this.isDataAvailable = true;\n data.json = e.result;\n _this.adaptor = new JsonAdaptor();\n });\n }\n else {\n this.adaptor = data.offline ? new JsonAdaptor() : new ODataAdaptor();\n }\n if (!data.jsonp && this.adaptor instanceof ODataAdaptor) {\n data.jsonp = 'callback';\n }\n this.adaptor = adaptor || this.adaptor;\n if (data.enableCaching) {\n this.adaptor = new CacheAdaptor(this.adaptor, data.timeTillExpiration, data.cachingPageSize);\n }\n return this;\n }\n /**\n * Overrides DataManager's default query with given query.\n * @param {Query} query - Defines the new default query.\n */\n DataManager.prototype.setDefaultQuery = function (query) {\n this.defaultQuery = query;\n return this;\n };\n /**\n * Executes the given query with local data source.\n * @param {Query} query - Defines the query to retrieve data.\n */\n DataManager.prototype.executeLocal = function (query) {\n if (!this.defaultQuery && !(query instanceof Query)) {\n DataUtil.throwError('DataManager - executeLocal() : A query is required to execute');\n }\n if (!this.dataSource.json) {\n DataUtil.throwError('DataManager - executeLocal() : Json data is required to execute');\n }\n query = query || this.defaultQuery;\n var result = this.adaptor.processQuery(this, query);\n if (query.subQuery) {\n var from = query.subQuery.fromTable;\n var lookup = query.subQuery.lookups;\n var res = query.isCountRequired ? result.result :\n result;\n if (lookup && lookup instanceof Array) {\n DataUtil.buildHierarchy(query.subQuery.fKey, from, res, lookup, query.subQuery.key);\n }\n for (var j = 0; j < res.length; j++) {\n if (res[j][from] instanceof Array) {\n res[j] = extend({}, {}, res[j]);\n res[j][from] = this.adaptor.processResponse(query.subQuery.using(new DataManager(res[j][from].slice(0))).executeLocal(), this, query);\n }\n }\n }\n return this.adaptor.processResponse(result, this, query);\n };\n /**\n * Executes the given query with either local or remote data source.\n * It will be executed as asynchronously and returns Promise object which will be resolved or rejected after action completed.\n * @param {Query|Function} query - Defines the query to retrieve data.\n * @param {Function} done - Defines the callback function and triggers when the Promise is resolved.\n * @param {Function} fail - Defines the callback function and triggers when the Promise is rejected.\n * @param {Function} always - Defines the callback function and triggers when the Promise is resolved or rejected.\n */\n DataManager.prototype.executeQuery = function (query, done, fail, always) {\n var _this = this;\n if (typeof query === 'function') {\n always = fail;\n fail = done;\n done = query;\n query = null;\n }\n if (!query) {\n query = this.defaultQuery;\n }\n if (!(query instanceof Query)) {\n DataUtil.throwError('DataManager - executeQuery() : A query is required to execute');\n }\n var deffered = new Deferred();\n var args = { query: query };\n if (!this.dataSource.offline && (this.dataSource.url !== undefined && this.dataSource.url !== '')) {\n var result = this.adaptor.processQuery(this, query);\n this.makeRequest(result, deffered, args, query);\n }\n else {\n DataManager.nextTick(function () {\n var res = _this.executeLocal(query);\n args = DataManager.getDeferedArgs(query, res, args);\n deffered.resolve(args);\n });\n }\n if (done || fail) {\n deffered.promise.then(done, fail);\n }\n if (always) {\n deffered.promise.then(always, always);\n }\n return deffered.promise;\n };\n DataManager.getDeferedArgs = function (query, result, args) {\n if (query.isCountRequired) {\n args.result = result.result;\n args.count = result.count;\n args.aggregates = result.aggregates;\n }\n else {\n args.result = result;\n }\n return args;\n };\n DataManager.nextTick = function (fn) {\n (window.setImmediate || window.setTimeout)(fn, 0);\n };\n DataManager.prototype.extendRequest = function (url, fnSuccess, fnFail) {\n return extend({}, {\n type: 'GET',\n dataType: this.dataSource.dataType,\n crossDomain: this.dataSource.crossDomain,\n jsonp: this.dataSource.jsonp,\n cache: true,\n processData: false,\n onSuccess: fnSuccess,\n onFailure: fnFail\n }, url);\n };\n DataManager.prototype.makeRequest = function (url, deffered, args, query) {\n var _this = this;\n var isSelector = !!query.subQuerySelector;\n var fnFail = function (e) {\n args.error = e;\n deffered.reject(args);\n };\n var process = function (data, count, xhr, request, actual, aggregates, virtualSelectRecords) {\n args.xhr = xhr;\n args.count = count ? parseInt(count.toString(), 10) : 0;\n args.result = data;\n args.request = request;\n args.aggregates = aggregates;\n args.actual = actual;\n args.virtualSelectRecords = virtualSelectRecords;\n deffered.resolve(args);\n };\n var fnQueryChild = function (data, selector) {\n var subDeffer = new Deferred();\n var childArgs = { parent: args };\n query.subQuery.isChild = true;\n var subUrl = _this.adaptor.processQuery(_this, query.subQuery, data ? _this.adaptor.processResponse(data) : selector);\n var childReq = _this.makeRequest(subUrl, subDeffer, childArgs, query.subQuery);\n if (!isSelector) {\n subDeffer.then(function (subData) {\n if (data) {\n DataUtil.buildHierarchy(query.subQuery.fKey, query.subQuery.fromTable, data, subData, query.subQuery.key);\n process(data, subData.count, subData.xhr);\n }\n }, fnFail);\n }\n return childReq;\n };\n var fnSuccess = function (data, request) {\n if (request.httpRequest.getResponseHeader('Content-Type').indexOf('xml') === -1 && _this.dateParse) {\n data = DataUtil.parse.parseJson(data);\n }\n var result = _this.adaptor.processResponse(data, _this, query, request.httpRequest, request);\n var count = 0;\n var aggregates = null;\n var virtualSelectRecords = 'virtualSelectRecords';\n var virtualRecords = data[virtualSelectRecords];\n if (query.isCountRequired) {\n count = result.count;\n aggregates = result.aggregates;\n result = result.result;\n }\n if (!query.subQuery) {\n process(result, count, request.httpRequest, request.type, data, aggregates, virtualRecords);\n return;\n }\n if (!isSelector) {\n fnQueryChild(result, request);\n }\n };\n var req = this.extendRequest(url, fnSuccess, fnFail);\n var ajax = new Ajax(req);\n ajax.beforeSend = function () {\n _this.beforeSend(ajax.httpRequest, ajax);\n };\n req = ajax.send();\n req.catch(function (e) { return true; }); // to handle failure remote requests. \n this.requests.push(ajax);\n if (isSelector) {\n var promise = void 0;\n var res = query.subQuerySelector.call(this, { query: query.subQuery, parent: query });\n if (res && res.length) {\n promise = Promise.all([req, fnQueryChild(null, res)]);\n promise.then(function () {\n var args = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n args[_i] = arguments[_i];\n }\n var result = args[0];\n var pResult = _this.adaptor.processResponse(result[0], _this, query, _this.requests[0].httpRequest, _this.requests[0]);\n var count = 0;\n if (query.isCountRequired) {\n count = pResult.count;\n pResult = pResult.result;\n }\n var cResult = _this.adaptor.processResponse(result[1], _this, query.subQuery, _this.requests[1].httpRequest, _this.requests[1]);\n count = 0;\n if (query.subQuery.isCountRequired) {\n count = cResult.count;\n cResult = cResult.result;\n }\n DataUtil.buildHierarchy(query.subQuery.fKey, query.subQuery.fromTable, pResult, cResult, query.subQuery.key);\n isSelector = false;\n process(pResult, count, _this.requests[0].httpRequest);\n });\n }\n else {\n isSelector = false;\n }\n }\n return req;\n };\n DataManager.prototype.beforeSend = function (request, settings) {\n this.adaptor.beforeSend(this, request, settings);\n var headers = this.dataSource.headers;\n var props;\n for (var i = 0; headers && i < headers.length; i++) {\n props = [];\n var keys = Object.keys(headers[i]);\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var prop = keys_1[_i];\n props.push(prop);\n request.setRequestHeader(prop, headers[i][prop]);\n }\n }\n };\n /**\n * Save bulk changes to the given table name.\n * User can add a new record, edit an existing record, and delete a record at the same time.\n * If the datasource from remote, then updated in a single post.\n * @param {Object} changes - Defines the CrudOptions.\n * @param {string} key - Defines the column field.\n * @param {string|Query} tableName - Defines the table name.\n * @param {Query} query - Sets default query for the DataManager.\n */\n DataManager.prototype.saveChanges = function (changes, key, tableName, query, original) {\n var _this = this;\n if (tableName instanceof Query) {\n query = tableName;\n tableName = null;\n }\n var args = {\n url: tableName,\n key: key || this.dataSource.key\n };\n var req = this.adaptor.batchRequest(this, changes, args, query, original);\n if (this.dataSource.offline) {\n return req;\n }\n var deff = new Deferred();\n var ajax = new Ajax(req);\n ajax.beforeSend = function () {\n _this.beforeSend(ajax.httpRequest, ajax);\n };\n ajax.onSuccess = function (data, request) {\n deff.resolve(_this.adaptor.processResponse(data, _this, null, request.httpRequest, request, changes, args));\n };\n ajax.onFailure = function (e) {\n deff.reject([{ error: e }]);\n };\n ajax.send().catch(function (e) { return true; }); // to handle the failure requests. \n return deff.promise;\n };\n /**\n * Inserts new record in the given table.\n * @param {Object} data - Defines the data to insert.\n * @param {string|Query} tableName - Defines the table name.\n * @param {Query} query - Sets default query for the DataManager.\n */\n DataManager.prototype.insert = function (data, tableName, query, position) {\n if (tableName instanceof Query) {\n query = tableName;\n tableName = null;\n }\n var req = this.adaptor.insert(this, data, tableName, query, position);\n if (this.dataSource.offline) {\n return req;\n }\n return this.doAjaxRequest(req);\n };\n /**\n * Removes data from the table with the given key.\n * @param {string} keyField - Defines the column field.\n * @param {Object} value - Defines the value to find the data in the specified column.\n * @param {string|Query} tableName - Defines the table name\n * @param {Query} query - Sets default query for the DataManager.\n */\n DataManager.prototype.remove = function (keyField, value, tableName, query) {\n if (typeof value === 'object') {\n value = value[keyField];\n }\n if (tableName instanceof Query) {\n query = tableName;\n tableName = null;\n }\n var res = this.adaptor.remove(this, keyField, value, tableName, query);\n if (this.dataSource.offline) {\n return res;\n }\n return this.doAjaxRequest(res);\n };\n /**\n * Updates existing record in the given table.\n * @param {string} keyField - Defines the column field.\n * @param {Object} value - Defines the value to find the data in the specified column.\n * @param {string|Query} tableName - Defines the table name\n * @param {Query} query - Sets default query for the DataManager.\n */\n DataManager.prototype.update = function (keyField, value, tableName, query, original) {\n if (tableName instanceof Query) {\n query = tableName;\n tableName = null;\n }\n var res = this.adaptor.update(this, keyField, value, tableName, query, original);\n if (this.dataSource.offline) {\n return res;\n }\n return this.doAjaxRequest(res);\n };\n DataManager.prototype.doAjaxRequest = function (res) {\n var _this = this;\n var defer = new Deferred();\n res = extend({}, {\n type: 'POST',\n contentType: 'application/json; charset=utf-8',\n processData: false\n }, res);\n var ajax = new Ajax(res);\n ajax.beforeSend = function () {\n _this.beforeSend(ajax.httpRequest, ajax);\n };\n ajax.onSuccess = function (record, request) {\n try {\n DataUtil.parse.parseJson(record);\n }\n catch (e) {\n record = [];\n }\n record = _this.adaptor.processResponse(DataUtil.parse.parseJson(record), _this, null, request.httpRequest, request);\n defer.resolve(record);\n };\n ajax.onFailure = function (e) {\n defer.reject([{ error: e }]);\n };\n ajax.send().catch(function (e) { return true; }); // to handle the failure requests.\n return defer.promise;\n };\n return DataManager;\n}());\nexport { DataManager };\n/**\n * Deferred is used to handle asynchronous operation.\n */\nvar Deferred = /** @class */ (function () {\n function Deferred() {\n var _this = this;\n /**\n * Promise is an object that represents a value that may not be available yet, but will be resolved at some point in the future.\n */\n this.promise = new Promise(function (resolve, reject) {\n _this.resolve = resolve;\n _this.reject = reject;\n });\n /**\n * Defines the callback function triggers when the Deferred object is resolved.\n */\n this.then = this.promise.then.bind(this.promise);\n /**\n * Defines the callback function triggers when the Deferred object is rejected.\n */\n this.catch = this.promise.catch.bind(this.promise);\n }\n return Deferred;\n}());\nexport { Deferred };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { merge, formatUnit, isNullOrUndefined, append, detach } from '@syncfusion/ej2-base';\nimport { attributes, addClass, removeClass, prepend, closest, remove } from '@syncfusion/ej2-base';\nimport { Component, EventHandler, Property, Complex, Event } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, ChildProperty } from '@syncfusion/ej2-base';\nimport { compile } from '@syncfusion/ej2-base';\nimport { Animation, rippleEffect, Touch } from '@syncfusion/ej2-base';\nimport { DataManager, Query } from '@syncfusion/ej2-data';\nimport { createCheckBox } from '@syncfusion/ej2-buttons';\nimport { ListBase, getFieldValues } from '../common/list-base';\n// Effect Configuration Effect[] = [fromViewBackward,fromViewForward,toViewBackward,toviewForward];\nvar effectsConfig = {\n 'None': [],\n 'SlideLeft': ['SlideRightOut', 'SlideLeftOut', 'SlideLeftIn', 'SlideRightIn'],\n 'SlideDown': ['SlideTopOut', 'SlideBottomOut', 'SlideBottomIn', 'SlideTopIn'],\n 'Zoom': ['FadeOut', 'FadeZoomOut', 'FadeZoomIn', 'FadeIn'],\n 'Fade': ['FadeOut', 'FadeOut', 'FadeIn', 'FadeIn']\n};\nvar effectsRTLConfig = {\n 'None': [],\n 'SlideLeft': ['SlideLeftOut', 'SlideRightOut', 'SlideRightIn', 'SlideLeftIn'],\n 'SlideDown': ['SlideBottomOut', 'SlideTopOut', 'SlideTopIn', 'SlideBottomIn'],\n 'Zoom': ['FadeZoomOut', 'FadeOut', 'FadeIn', 'FadeZoomIn'],\n 'Fade': ['FadeOut', 'FadeOut', 'FadeIn', 'FadeIn']\n};\n// don't use space in classnames.\nexport var classNames = {\n root: 'e-listview',\n hover: 'e-hover',\n selected: 'e-active',\n focused: 'e-focused',\n parentItem: 'e-list-parent',\n listItem: 'e-list-item',\n listIcon: 'e-list-icon',\n textContent: 'e-text-content',\n listItemText: 'e-list-text',\n groupListItem: 'e-list-group-item',\n hasChild: 'e-has-child',\n view: 'e-view',\n header: 'e-list-header',\n headerText: 'e-headertext',\n headerTemplateText: 'e-headertemplate-text',\n text: 'e-text',\n disable: 'e-disabled',\n content: 'e-content',\n icon: 'e-icons',\n backIcon: 'e-icon-back',\n checkboxWrapper: 'e-checkbox-wrapper',\n checkbox: 'e-checkbox',\n checked: 'e-check',\n checklist: 'e-checklist',\n checkboxIcon: 'e-frame',\n checkboxRight: 'e-checkbox-right',\n checkboxLeft: 'e-checkbox-left',\n listviewCheckbox: 'e-listview-checkbox',\n itemCheckList: 'e-checklist'\n};\nvar FieldSettings = /** @class */ (function (_super) {\n __extends(FieldSettings, _super);\n function FieldSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('id')\n ], FieldSettings.prototype, \"id\", void 0);\n __decorate([\n Property('text')\n ], FieldSettings.prototype, \"text\", void 0);\n __decorate([\n Property('isChecked')\n ], FieldSettings.prototype, \"isChecked\", void 0);\n __decorate([\n Property('isVisible')\n ], FieldSettings.prototype, \"isVisible\", void 0);\n __decorate([\n Property('enabled')\n ], FieldSettings.prototype, \"enabled\", void 0);\n __decorate([\n Property('iconCss')\n ], FieldSettings.prototype, \"iconCss\", void 0);\n __decorate([\n Property('child')\n ], FieldSettings.prototype, \"child\", void 0);\n __decorate([\n Property('tooltip')\n ], FieldSettings.prototype, \"tooltip\", void 0);\n __decorate([\n Property('groupBy')\n ], FieldSettings.prototype, \"groupBy\", void 0);\n __decorate([\n Property('text')\n ], FieldSettings.prototype, \"sortBy\", void 0);\n __decorate([\n Property('htmlAttributes')\n ], FieldSettings.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Property('tableName')\n ], FieldSettings.prototype, \"tableName\", void 0);\n return FieldSettings;\n}(ChildProperty));\nexport { FieldSettings };\n/**\n * Represents the EJ2 ListView control.\n * ```html\n * \n *
\n * ```\n * ```typescript\n * var lvObj = new ListView({});\n * lvObj.appendTo(\"#listview\");\n * ```\n */\nvar ListView = /** @class */ (function (_super) {\n __extends(ListView, _super);\n /**\n * Constructor for creating the widget\n */\n function ListView(options, element) {\n return _super.call(this, options, element) || this;\n }\n ListView.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'htmlAttributes':\n this.setHTMLAttribute();\n break;\n case 'cssClass':\n this.setCSSClass(oldProp.cssClass);\n break;\n case 'enable':\n this.setEnable();\n break;\n case 'width':\n case 'height':\n this.setSize();\n break;\n case 'enableRtl':\n this.setEnableRTL();\n break;\n case 'fields':\n this.listBaseOption.fields = this.fields.properties;\n if (this.enableVirtualization) {\n this.virtualizationModule.reRenderUiVirtualization();\n }\n else {\n this.reRender();\n }\n break;\n case 'headerTitle':\n if (!this.curDSLevel.length) {\n this.header(this.headerTitle, false);\n }\n break;\n case 'showHeader':\n this.header(this.headerTitle, false);\n break;\n case 'enableVirtualization':\n detach(this.contentContainer);\n this.refresh();\n break;\n case 'showCheckBox':\n case 'checkBoxPosition':\n if (this.enableVirtualization) {\n this.virtualizationModule.reRenderUiVirtualization();\n }\n else {\n this.setCheckbox();\n }\n break;\n case 'dataSource':\n if (this.enableVirtualization) {\n this.virtualizationModule.reRenderUiVirtualization();\n }\n else {\n this.reRender();\n }\n break;\n case 'sortOrder':\n case 'showIcon':\n if (this.enableVirtualization) {\n this.virtualizationModule.reRenderUiVirtualization();\n }\n else {\n this.listBaseOption.showIcon = this.showIcon;\n this.curViewDS = this.getSubDS();\n this.resetCurrentList();\n }\n break;\n default:\n break;\n }\n }\n };\n // Model Changes\n ListView.prototype.setHTMLAttribute = function () {\n if (Object.keys(this.htmlAttributes).length) {\n attributes(this.element, this.htmlAttributes);\n }\n };\n ListView.prototype.setCSSClass = function (oldCSSClass) {\n if (this.cssClass) {\n addClass([this.element], this.cssClass.split(' ').filter(function (css) { return css; }));\n }\n if (oldCSSClass) {\n removeClass([this.element], oldCSSClass.split(' ').filter(function (css) { return css; }));\n }\n };\n ListView.prototype.setSize = function () {\n this.element.style.height = formatUnit(this.height);\n this.element.style.width = formatUnit(this.width);\n this.isWindow = this.element.clientHeight ? false : true;\n };\n ListView.prototype.setEnable = function () {\n this.enableElement(this.element, this.enable);\n };\n ListView.prototype.setEnableRTL = function () {\n if (this.enableRtl) {\n this.element.classList.add('e-rtl');\n }\n else {\n this.element.classList.remove('e-rtl');\n }\n };\n ListView.prototype.enableElement = function (element, isEnabled) {\n if (isEnabled) {\n element.classList.remove(classNames.disable);\n }\n else {\n element.classList.add(classNames.disable);\n }\n };\n //Suport Component Functions\n ListView.prototype.header = function (text, showBack) {\n if (this.headerEle === undefined && this.showHeader) {\n this.headerEle = this.createElement('div', { className: classNames.header });\n var innerHeaderEle = this.createElement('span', { className: classNames.headerText, innerHTML: this.headerTitle });\n var textEle = this.createElement('div', { className: classNames.text, innerHTML: innerHeaderEle.outerHTML });\n var hedBackButton = this.createElement('div', {\n className: classNames.icon + ' ' + classNames.backIcon + ' e-but-back',\n attrs: { style: 'display:none;' }\n });\n this.headerEle.appendChild(hedBackButton);\n this.headerEle.appendChild(textEle);\n if (this.headerTemplate) {\n var compiledString = compile(this.headerTemplate);\n var headerTemplateEle = this.createElement('div', { className: classNames.headerTemplateText });\n append(compiledString({}), headerTemplateEle);\n append([headerTemplateEle], this.headerEle);\n }\n if (this.headerTemplate && this.headerTitle) {\n textEle.classList.add('header');\n }\n this.element.classList.add('e-has-header');\n prepend([this.headerEle], this.element);\n }\n else if (this.headerEle) {\n if (this.showHeader) {\n this.headerEle.style.display = '';\n var textEle = this.headerEle.querySelector('.' + classNames.headerText);\n var hedBackButton = this.headerEle.querySelector('.' + classNames.backIcon);\n textEle.innerHTML = text;\n if (this.headerTemplate && showBack) {\n textEle.parentElement.classList.remove('header');\n this.headerEle.querySelector('.' + classNames.headerTemplateText).classList.add('nested-header');\n }\n if (this.headerTemplate && !showBack) {\n textEle.parentElement.classList.add('header');\n this.headerEle.querySelector('.' + classNames.headerTemplateText).classList.remove('nested-header');\n this.headerEle.querySelector('.' + classNames.headerTemplateText).classList.add('header');\n }\n if (showBack === true) {\n hedBackButton.style.display = '';\n }\n else {\n hedBackButton.style.display = 'none';\n }\n }\n else {\n this.headerEle.style.display = 'none';\n }\n }\n };\n // Animation Related Functions\n ListView.prototype.switchView = function (fromView, toView, reverse) {\n var _this = this;\n if (fromView && toView) {\n var fPos_1 = fromView.style.position;\n var overflow_1 = (this.element.style.overflow !== 'hidden') ? this.element.style.overflow : '';\n fromView.style.position = 'absolute';\n fromView.classList.add('e-view');\n var anim = void 0;\n var duration = this.animation.duration;\n if (this.animation.effect) {\n anim = (this.enableRtl ? effectsRTLConfig[this.animation.effect] : effectsConfig[this.animation.effect]);\n }\n else {\n var slideLeft = 'SlideLeft';\n anim = effectsConfig[slideLeft];\n reverse = this.enableRtl;\n duration = 0;\n }\n this.element.style.overflow = 'hidden';\n this.aniObj.animate(fromView, {\n name: (reverse === true ? anim[0] : anim[1]),\n duration: duration,\n timingFunction: this.animation.easing,\n end: function (model) {\n fromView.style.display = 'none';\n _this.element.style.overflow = overflow_1;\n fromView.style.position = fPos_1;\n fromView.classList.remove('e-view');\n }\n });\n toView.style.display = '';\n this.aniObj.animate(toView, {\n name: (reverse === true ? anim[2] : anim[3]),\n duration: duration,\n timingFunction: this.animation.easing,\n end: function () {\n _this.trigger('actionComplete');\n }\n });\n this.curUL = toView;\n }\n };\n ListView.prototype.preRender = function () {\n this.listBaseOption = {\n template: this.template,\n headerTemplate: this.headerTemplate,\n groupTemplate: this.groupTemplate, expandCollapse: true, listClass: '',\n ariaAttributes: {\n itemRole: 'listitem', listRole: 'list', itemText: '',\n groupItemRole: 'group', wrapperRole: 'presentation'\n },\n fields: this.fields.properties, sortOrder: this.sortOrder, showIcon: this.showIcon,\n itemCreated: this.renderCheckbox.bind(this)\n };\n this.initialization();\n };\n ListView.prototype.initialization = function () {\n this.curDSLevel = [];\n this.animateOptions = {};\n this.curViewDS = [];\n this.currentLiElements = [];\n this.isNestedList = false;\n this.selectedData = [];\n this.selectedId = [];\n this.aniObj = new Animation(this.animateOptions);\n };\n ListView.prototype.renderCheckbox = function (args) {\n if (args.item.classList.contains(classNames.hasChild)) {\n this.isNestedList = true;\n }\n if (this.showCheckBox && this.isValidLI(args.item)) {\n var checkboxElement = void 0;\n var fieldData = void 0;\n checkboxElement = createCheckBox(this.createElement, false, {\n checked: false, enableRtl: this.enableRtl,\n cssClass: classNames.listviewCheckbox\n });\n checkboxElement.setAttribute('role', 'checkbox');\n var frameElement_1 = checkboxElement.querySelector('.' + classNames.checkboxIcon);\n args.item.classList.add(classNames.itemCheckList);\n args.item.firstElementChild.classList.add(classNames.checkbox);\n if (typeof this.dataSource[0] !== 'string' && typeof this.dataSource[0] !== 'number') {\n fieldData = getFieldValues(args.curData, this.listBaseOption.fields);\n if (fieldData[this.listBaseOption.fields.isChecked]) {\n this.checkInternally(args, checkboxElement);\n }\n }\n else if (((typeof this.dataSource[0] === 'string' ||\n typeof this.dataSource[0] === 'number') && this.selectedData.indexOf(args.text) !== -1)) {\n this.checkInternally(args, checkboxElement);\n }\n checkboxElement.setAttribute('aria-checked', frameElement_1.classList.contains(classNames.checked) ? 'true' : 'false');\n if (this.checkBoxPosition === 'Left') {\n checkboxElement.classList.add(classNames.checkboxLeft);\n args.item.firstElementChild.classList.add(classNames.checkboxLeft);\n args.item.firstElementChild.insertBefore(checkboxElement, args.item.firstElementChild.childNodes[0]);\n }\n else {\n checkboxElement.classList.add(classNames.checkboxRight);\n args.item.firstElementChild.classList.add(classNames.checkboxRight);\n args.item.firstElementChild.appendChild(checkboxElement);\n }\n this.currentLiElements.push(args.item);\n }\n };\n ListView.prototype.checkInternally = function (args, checkboxElement) {\n args.item.classList.add(classNames.selected);\n args.item.setAttribute('aria-selected', 'true');\n checkboxElement.querySelector('.' + classNames.checkboxIcon).classList.add(classNames.checked);\n checkboxElement.setAttribute('aria-checked', 'true');\n };\n /**\n * It is used to check the checkbox of an item.\n * @param {Fields | HTMLElement | Element} item - It accepts Fields or HTML list element as an argument.\n */\n ListView.prototype.checkItem = function (item) {\n this.toggleCheckBase(item, true);\n };\n ListView.prototype.toggleCheckBase = function (item, checked) {\n if (this.showCheckBox) {\n var liElement = item;\n if (item instanceof Object && item.constructor !== HTMLLIElement) {\n liElement = this.getLiFromObjOrElement(item);\n }\n if (!isNullOrUndefined(liElement)) {\n var checkboxIcon = liElement.querySelector('.' + classNames.checkboxIcon);\n checked ? liElement.classList.add(classNames.selected) : liElement.classList.remove(classNames.selected);\n liElement.setAttribute('aria-selected', checked ? 'true' : 'false');\n checked ? checkboxIcon.classList.add(classNames.checked) : checkboxIcon.classList.remove(classNames.checked);\n checkboxIcon.parentElement.setAttribute('aria-checked', checked ? 'true' : 'false');\n }\n this.setSelectedItemData(liElement);\n }\n };\n /**\n * It is used to uncheck the checkbox of an item.\n * @param {Fields | HTMLElement | Element} item - It accepts Fields or HTML list element as an argument.\n */\n ListView.prototype.uncheckItem = function (item) {\n this.toggleCheckBase(item, false);\n };\n /**\n * It is used to check all the items in ListView.\n */\n ListView.prototype.checkAllItems = function () {\n this.toggleAllCheckBase(true);\n };\n /**\n * It is used to un-check all the items in ListView.\n */\n ListView.prototype.uncheckAllItems = function () {\n this.toggleAllCheckBase(false);\n };\n ListView.prototype.toggleAllCheckBase = function (checked) {\n if (this.showCheckBox) {\n for (var i = 0; i < this.liCollection.length; i++) {\n var checkIcon = this.liCollection[i].querySelector('.' + classNames.checkboxIcon);\n if (checkIcon) {\n if (checked) {\n if (!checkIcon.classList.contains(classNames.checked)) {\n this.checkItem(this.liCollection[i]);\n }\n }\n else {\n if (checkIcon.classList.contains(classNames.checked)) {\n this.uncheckItem(this.liCollection[i]);\n }\n }\n }\n }\n if (this.enableVirtualization) {\n this.virtualizationModule.checkedItem(checked);\n }\n }\n };\n ListView.prototype.setCheckbox = function () {\n var _this = this;\n if (this.showCheckBox) {\n var liCollection = Array.prototype.slice.call(this.element.querySelectorAll('.' + classNames.listItem));\n var args_1 = {\n item: undefined, curData: undefined, dataSource: undefined, fields: undefined,\n options: undefined, text: ''\n };\n liCollection.forEach(function (element) {\n args_1.item = element;\n args_1.curData = _this.getItemData(element);\n if (element.querySelector('.' + classNames.checkboxWrapper)) {\n _this.removeElement(element.querySelector('.' + classNames.checkboxWrapper));\n }\n _this.renderCheckbox(args_1);\n if (args_1.item.classList.contains(classNames.selected)) {\n _this.checkInternally(args_1, args_1.item.querySelector('.' + classNames.checkboxWrapper));\n }\n });\n }\n else {\n var liCollection = Array.prototype.slice.call(this.element.querySelectorAll('.' + classNames.itemCheckList));\n liCollection.forEach(function (element) {\n element.classList.remove(classNames.selected);\n element.firstElementChild.classList.remove(classNames.checkbox);\n _this.removeElement(element.querySelector('.' + classNames.checkboxWrapper));\n });\n if (this.selectedItems) {\n this.selectedItems.item.classList.add(classNames.selected);\n }\n }\n };\n /**\n * It is used to refresh the UI list item height\n */\n ListView.prototype.refreshItemHeight = function () {\n this.virtualizationModule.refreshItemHeight();\n };\n ListView.prototype.clickHandler = function (e) {\n var target = e.target;\n var classList = target.classList;\n if (classList.contains(classNames.backIcon) || classList.contains(classNames.headerText)) {\n if (this.showCheckBox && this.curDSLevel[this.curDSLevel.length - 1]) {\n this.uncheckAllItems();\n }\n this.back();\n }\n else {\n var li = closest(target.parentNode, '.' + classNames.listItem);\n if (li === null) {\n li = target;\n }\n this.removeFocus();\n if (this.enable && this.showCheckBox && this.isValidLI(li)) {\n if (e.target.classList.contains(classNames.checkboxIcon)) {\n li.classList.add(classNames.focused);\n if (isNullOrUndefined(li.querySelector('.' + classNames.checked))) {\n var args = {\n curData: undefined, dataSource: undefined, fields: undefined, options: undefined,\n text: undefined, item: li\n };\n this.checkInternally(args, args.item.querySelector('.' + classNames.checkboxWrapper));\n }\n else {\n this.uncheckItem(li);\n li.classList.add(classNames.focused);\n }\n if (e) {\n var eventArgs = this.selectEventData(li, e);\n var checkIcon = li.querySelector('.' + classNames.checkboxIcon);\n merge(eventArgs, { isChecked: checkIcon.classList.contains(classNames.checked) });\n this.trigger('select', eventArgs);\n }\n }\n else if (li.classList.contains(classNames.hasChild)) {\n this.removeHover();\n this.removeSelect();\n this.removeSelect(li);\n this.setSelectLI(li, e);\n li.classList.remove(classNames.selected);\n }\n else {\n this.setCheckboxLI(li, e);\n }\n }\n else {\n this.setSelectLI(li, e);\n }\n }\n };\n ListView.prototype.removeElement = function (element) {\n return element && element.parentNode && element.parentNode.removeChild(element);\n };\n ListView.prototype.hoverHandler = function (e) {\n var curLi = closest(e.target.parentNode, '.' + classNames.listItem);\n this.setHoverLI(curLi);\n };\n ListView.prototype.leaveHandler = function (e) {\n this.removeHover();\n };\n ;\n ListView.prototype.homeKeyHandler = function (e, end) {\n if (Object.keys(this.dataSource).length && this.curUL) {\n var li = this.curUL.querySelectorAll('.' + classNames.listItem);\n var focusedElement = this.curUL.querySelector('.' + classNames.focused) ||\n this.curUL.querySelector('.' + classNames.selected);\n if (focusedElement) {\n focusedElement.classList.remove(classNames.focused);\n if (!this.showCheckBox) {\n focusedElement.classList.remove(classNames.selected);\n }\n }\n var index = !end ? 0 : li.length - 1;\n if (li[index].classList.contains(classNames.hasChild) || this.showCheckBox) {\n li[index].classList.add(classNames.focused);\n }\n else {\n this.setSelectLI(li[index], e);\n }\n }\n };\n ListView.prototype.onArrowKeyDown = function (e, prev) {\n var siblingLI;\n var li;\n var hasChild = !isNullOrUndefined(this.curUL.querySelector('.' + classNames.hasChild)) ? true : false;\n if (hasChild || this.showCheckBox) {\n li = this.curUL.querySelector('.' + classNames.focused) || this.curUL.querySelector('.' + classNames.selected);\n siblingLI = ListBase.getSiblingLI(this.curUL.querySelectorAll('.' + classNames.listItem), li, prev);\n if (!isNullOrUndefined(siblingLI)) {\n if (li) {\n li.classList.remove(classNames.focused);\n if (!this.showCheckBox) {\n li.classList.remove(classNames.selected);\n }\n }\n if (siblingLI.classList.contains(classNames.hasChild) || this.showCheckBox) {\n siblingLI.classList.add(classNames.focused);\n }\n else {\n this.setSelectLI(siblingLI, e);\n }\n }\n }\n else {\n li = this.curUL.querySelector('.' + classNames.selected);\n siblingLI = ListBase.getSiblingLI(this.curUL.querySelectorAll('.' + classNames.listItem), li, prev);\n this.setSelectLI(siblingLI, e);\n }\n return siblingLI;\n };\n ListView.prototype.arrowKeyHandler = function (e, prev) {\n var _this = this;\n if (Object.keys(this.dataSource).length && this.curUL) {\n var siblingLI = this.onArrowKeyDown(e, prev);\n var elementTop = this.element.getBoundingClientRect().top;\n var elementHeight = this.element.getBoundingClientRect().height;\n var firstItemBounds = this.curUL.querySelector('.' + classNames.listItem).getBoundingClientRect();\n var heightDiff = void 0;\n var groupItemBounds = void 0;\n if (this.fields.groupBy) {\n groupItemBounds = this.curUL.querySelector('.' + classNames.groupListItem).getBoundingClientRect();\n }\n if (siblingLI) {\n var siblingTop = siblingLI.getBoundingClientRect().top;\n var siblingHeight = siblingLI.getBoundingClientRect().height;\n if (!prev) {\n var height = this.isWindow ? window.innerHeight : elementHeight;\n heightDiff = this.isWindow ? (siblingTop + siblingHeight) :\n ((siblingTop - elementTop) + siblingHeight);\n if (heightDiff > height) {\n this.isWindow ? window.scrollTo(0, pageYOffset + (heightDiff - height)) :\n this.element.scrollTo(0, this.element.scrollTop + (heightDiff - height));\n }\n }\n else {\n heightDiff = this.isWindow ? siblingTop : (siblingTop - elementTop);\n if (heightDiff < 0) {\n this.isWindow ? window.scrollTo(0, pageYOffset + heightDiff) :\n this.element.scrollTo(0, this.element.scrollTop + heightDiff);\n }\n }\n }\n else if (this.enableVirtualization && prev && this.virtualizationModule.uiFirstIndex) {\n this.onUIScrolled = function () {\n _this.onArrowKeyDown(e, prev);\n _this.onUIScrolled = undefined;\n };\n heightDiff = this.virtualizationModule.listItemHeight;\n this.isWindow ? window.scrollTo(0, pageYOffset - heightDiff) :\n this.element.scrollTo(0, this.element.scrollTop - heightDiff);\n }\n else if (prev) {\n if (this.showHeader && this.headerEle) {\n var topHeight = groupItemBounds ? groupItemBounds.top : firstItemBounds.top;\n var headerBounds = this.headerEle.getBoundingClientRect();\n heightDiff = headerBounds.top < 0 ? (headerBounds.height - topHeight) : 0;\n this.isWindow ? window.scrollTo(0, pageYOffset - heightDiff)\n : this.element.scrollTo(0, 0);\n }\n else if (this.fields.groupBy) {\n heightDiff = this.isWindow ? (groupItemBounds.top < 0 ? groupItemBounds.top : 0) :\n (elementTop - firstItemBounds.top) + groupItemBounds.height;\n this.isWindow ? window.scrollTo(0, pageYOffset + heightDiff) :\n this.element.scrollTo(0, this.element.scrollTop - heightDiff);\n }\n }\n }\n };\n ListView.prototype.enterKeyHandler = function (e) {\n if (Object.keys(this.dataSource).length && this.curUL) {\n var hasChild = !isNullOrUndefined(this.curUL.querySelector('.' + classNames.hasChild)) ? true : false;\n var li = this.curUL.querySelector('.' + classNames.focused);\n if (hasChild && li) {\n li.classList.remove(classNames.focused);\n if (this.showCheckBox) {\n this.removeSelect();\n this.removeSelect(li);\n this.removeHover();\n }\n this.setSelectLI(li, e);\n }\n }\n };\n ListView.prototype.spaceKeyHandler = function (e) {\n if (this.enable && this.showCheckBox && Object.keys(this.dataSource).length && this.curUL) {\n var li = this.curUL.querySelector('.' + classNames.focused);\n if (!isNullOrUndefined(li) && isNullOrUndefined(li.querySelector('.' + classNames.checked))) {\n var args = {\n curData: undefined, dataSource: undefined, fields: undefined, options: undefined,\n text: undefined, item: li\n };\n this.checkInternally(args, args.item.querySelector('.' + classNames.checkboxWrapper));\n }\n else {\n this.uncheckItem(li);\n }\n }\n };\n ListView.prototype.keyActionHandler = function (e) {\n switch (e.keyCode) {\n case 36:\n this.homeKeyHandler(e);\n break;\n case 35:\n this.homeKeyHandler(e, true);\n break;\n case 40:\n this.arrowKeyHandler(e);\n break;\n case 38:\n this.arrowKeyHandler(e, true);\n break;\n case 13:\n this.enterKeyHandler(e);\n break;\n case 8:\n if (this.showCheckBox && this.curDSLevel[this.curDSLevel.length - 1]) {\n this.uncheckAllItems();\n }\n this.back();\n break;\n case 9:\n this.tabFocus(e);\n break;\n case 32:\n this.spaceKeyHandler(e);\n break;\n }\n };\n ListView.prototype.swipeActionHandler = function (e) {\n if (e.swipeDirection === 'Right') {\n if (this.showCheckBox && this.curDSLevel[this.curDSLevel.length - 1]) {\n this.uncheckAllItems();\n }\n this.back();\n }\n };\n ListView.prototype.focusout = function () {\n if (Object.keys(this.dataSource).length && this.curUL) {\n var focusedElement = this.curUL.querySelector('.' + classNames.focused);\n var activeElement = this.curUL.querySelector('[aria-selected = true]');\n if (focusedElement) {\n focusedElement.classList.remove(classNames.focused);\n if (activeElement && !this.showCheckBox) {\n activeElement.classList.add(classNames.selected);\n }\n }\n }\n };\n ListView.prototype.wireEvents = function () {\n EventHandler.add(this.element, 'keydown', this.keyActionHandler, this);\n EventHandler.add(this.element, 'click', this.clickHandler, this);\n if (!this.enableVirtualization) {\n EventHandler.add(this.element, 'mouseover', this.hoverHandler, this);\n EventHandler.add(this.element, 'mouseout', this.leaveHandler, this);\n }\n EventHandler.add(this.element, 'focusout', this.focusout, this);\n this.touchModule = new Touch(this.element, { swipe: this.swipeActionHandler.bind(this) });\n };\n ListView.prototype.unWireEvents = function () {\n EventHandler.remove(this.element, 'click', this.clickHandler);\n if (!this.enableVirtualization) {\n EventHandler.remove(this.element, 'mouseover', this.hoverHandler);\n EventHandler.remove(this.element, 'mouseout', this.leaveHandler);\n }\n EventHandler.remove(this.element, 'mouseover', this.hoverHandler);\n EventHandler.remove(this.element, 'mouseout', this.leaveHandler);\n this.touchModule.destroy();\n };\n ListView.prototype.tabFocus = function (e) {\n if (this.curUL && ((!this.curUL.querySelector('.' + classNames.focused) && this.showCheckBox) ||\n (!this.curUL.querySelector('.' + classNames.selected) && !this.showCheckBox &&\n !this.curUL.querySelector('.' + classNames.hasChild)) ||\n (this.curUL.querySelector('.' + classNames.hasChild) &&\n !this.curUL.querySelector('.' + classNames.focused) &&\n !this.curUL.querySelector('.' + classNames.selected)))) {\n e.preventDefault();\n }\n if (Object.keys(this.dataSource).length && this.curUL) {\n var selectedList = this.curUL.querySelector('.' + classNames.selected);\n if ((!selectedList && this.curUL) || this.showCheckBox) {\n var li = selectedList || this.curUL.querySelector('.' + classNames.listItem);\n if (li.classList.contains(classNames.hasChild) || this.showCheckBox) {\n var focusedElement = this.curUL.querySelector('.' + classNames.focused);\n if (isNullOrUndefined(focusedElement)) {\n li.classList.add(classNames.focused);\n }\n }\n else {\n this.setSelectLI(li, e);\n }\n }\n }\n };\n ListView.prototype.removeFocus = function () {\n var focusedLI = this.element.querySelectorAll('.' + classNames.focused);\n for (var _i = 0, focusedLI_1 = focusedLI; _i < focusedLI_1.length; _i++) {\n var ele = focusedLI_1[_i];\n ele.classList.remove(classNames.focused);\n }\n };\n ListView.prototype.removeHover = function () {\n var hoverLI = this.element.querySelector('.' + classNames.hover);\n if (hoverLI) {\n hoverLI.classList.remove(classNames.hover);\n }\n };\n ListView.prototype.removeSelect = function (li) {\n if (isNullOrUndefined(li)) {\n var selectedLI = this.element.querySelectorAll('.' + classNames.selected);\n for (var _i = 0, selectedLI_1 = selectedLI; _i < selectedLI_1.length; _i++) {\n var ele = selectedLI_1[_i];\n if (this.showCheckBox && ele.querySelector('.' + classNames.checked)) {\n continue;\n }\n else {\n ele.setAttribute('aria-selected', 'false');\n ele.classList.remove(classNames.selected);\n }\n }\n }\n else {\n li.classList.remove(classNames.selected);\n li.setAttribute('aria-selected', 'false');\n }\n };\n ListView.prototype.isValidLI = function (li) {\n return (li && li.classList.contains(classNames.listItem)\n && !li.classList.contains(classNames.groupListItem)\n && !li.classList.contains(classNames.disable));\n };\n ListView.prototype.setCheckboxLI = function (li, e) {\n if (this.isValidLI(li) && this.enable && this.showCheckBox) {\n if (this.curUL.querySelector('.' + classNames.focused)) {\n this.curUL.querySelector('.' + classNames.focused).classList.remove(classNames.focused);\n }\n li.classList.add(classNames.focused);\n var checkboxElement = li.querySelector('.' + classNames.checkboxWrapper);\n var checkIcon = checkboxElement.querySelector('.' + classNames.checkboxIcon + '.' + classNames.icon);\n this.removeHover();\n if (!checkIcon.classList.contains(classNames.checked)) {\n checkIcon.classList.add(classNames.checked);\n li.classList.add(classNames.selected);\n li.setAttribute('aria-selected', 'true');\n }\n else {\n checkIcon.classList.remove(classNames.checked);\n li.classList.remove(classNames.selected);\n li.setAttribute('aria-selected', 'false');\n }\n checkboxElement.setAttribute('aria-checked', checkIcon.classList.contains(classNames.checked) ?\n 'true' : 'false');\n var eventArgs = this.selectEventData(li, e);\n merge(eventArgs, { isChecked: checkIcon.classList.contains(classNames.checked) });\n if (this.enableVirtualization) {\n this.virtualizationModule.setCheckboxLI(li, e);\n }\n this.trigger('select', eventArgs);\n this.setSelectedItemData(li);\n this.renderSubList(li);\n }\n };\n ListView.prototype.selectEventData = function (li, e) {\n var data = this.getItemData(li);\n var fieldData = getFieldValues(data, this.listBaseOption.fields);\n var selectedItem;\n if (!isNullOrUndefined(data)\n && typeof this.dataSource[0] === 'string' || typeof this.dataSource[0] === 'number') {\n selectedItem = { item: li, text: li && li.innerText.trim(), data: this.dataSource };\n }\n else {\n selectedItem = { item: li, text: fieldData && fieldData[this.listBaseOption.fields.text], data: data };\n }\n var eventArgs = {};\n merge(eventArgs, selectedItem);\n if (e) {\n merge(eventArgs, { isInteracted: true, event: e, index: Array.prototype.indexOf.call(this.curUL.children, li) });\n }\n return eventArgs;\n };\n ListView.prototype.setSelectedItemData = function (li) {\n var data = this.getItemData(li);\n var fieldData = getFieldValues(data, this.listBaseOption.fields);\n if (!isNullOrUndefined(data) && ((typeof this.dataSource[0] === 'string') ||\n (typeof this.dataSource[0] === 'number'))) {\n this.selectedItems = {\n item: li,\n text: li && li.innerText.trim(),\n data: this.dataSource\n };\n }\n else {\n this.selectedItems = {\n item: li,\n text: fieldData && fieldData[this.listBaseOption.fields.text],\n data: data\n };\n }\n };\n ListView.prototype.setSelectLI = function (li, e) {\n if (this.isValidLI(li) && !li.classList.contains(classNames.selected) && this.enable) {\n if (!this.showCheckBox) {\n this.removeSelect();\n }\n li.classList.add(classNames.selected);\n li.setAttribute('aria-selected', 'true');\n this.removeHover();\n this.setSelectedItemData(li);\n if (this.enableVirtualization) {\n this.virtualizationModule.setSelectLI(li, e);\n }\n var eventArgs = this.selectEventData(li, e);\n this.trigger('select', eventArgs);\n this.selectedLI = li;\n this.renderSubList(li);\n }\n };\n ListView.prototype.setHoverLI = function (li) {\n if (this.isValidLI(li) && !li.classList.contains(classNames.hover) && this.enable) {\n var lastLi = this.element.querySelectorAll('.' + classNames.hover);\n if (lastLi && lastLi.length) {\n removeClass(lastLi, classNames.hover);\n }\n if (!li.classList.contains(classNames.selected) || this.showCheckBox) {\n li.classList.add(classNames.hover);\n }\n }\n };\n //Data Source Related Functions\n ListView.prototype.getSubDS = function () {\n var levelKeys = this.curDSLevel;\n if (levelKeys.length) {\n var ds = this.localData;\n for (var _i = 0, levelKeys_1 = levelKeys; _i < levelKeys_1.length; _i++) {\n var key = levelKeys_1[_i];\n var field = {};\n field[this.fields.id] = key;\n this.curDSJSON = this.findItemFromDS(ds, field);\n var fieldData = getFieldValues(this.curDSJSON, this.listBaseOption.fields);\n ds = this.curDSJSON ? fieldData[this.fields.child] : ds;\n }\n return ds;\n }\n return this.localData;\n };\n ListView.prototype.getItemData = function (li) {\n var dataSource = this.dataSource instanceof DataManager ?\n this.localData : this.dataSource;\n var fields = this.getElementUID(li);\n var curDS;\n if (isNullOrUndefined(this.element.querySelector('.' + classNames.hasChild)) && this.fields.groupBy) {\n curDS = this.curViewDS;\n }\n else {\n curDS = dataSource;\n }\n return this.findItemFromDS(curDS, fields);\n };\n ListView.prototype.findItemFromDS = function (dataSource, fields, parent) {\n var _this = this;\n var resultJSON;\n if (dataSource && dataSource.length && fields) {\n dataSource.some(function (data) {\n var fieldData = getFieldValues(data, _this.listBaseOption.fields);\n //(!(fid) || id === fid) && (!(ftext) || text === ftext) && (!!fid || !!ftext)\n if ((fields[_this.fields.id] || fields[_this.fields.text]) &&\n (!fields[_this.fields.id] || (!isNullOrUndefined(fieldData[_this.fields.id]) &&\n fieldData[_this.fields.id].toString()) === fields[_this.fields.id].toString()) &&\n (!fields[_this.fields.text] || fieldData[_this.fields.text] === fields[_this.fields.text])) {\n resultJSON = (parent ? dataSource : data);\n }\n else if (typeof data !== 'object' && dataSource.indexOf(data) !== -1) {\n resultJSON = (parent ? dataSource : data);\n }\n else if (!isNullOrUndefined(fields[_this.fields.id]) && isNullOrUndefined(fieldData[_this.fields.id])) {\n var li = _this.element.querySelector('[data-uid=\"'\n + fields[_this.fields.id] + '\"]');\n if (li && li.innerText.trim() === fieldData[_this.fields.text]) {\n resultJSON = data;\n }\n }\n else if (fieldData.hasOwnProperty(_this.fields.child) && fieldData[_this.fields.child].length) {\n resultJSON = _this.findItemFromDS(fieldData[_this.fields.child], fields, parent);\n }\n return !!resultJSON;\n });\n }\n else {\n resultJSON = dataSource;\n }\n return resultJSON;\n };\n ListView.prototype.getQuery = function () {\n var columns = [];\n var query = (this.query ? this.query : new Query());\n if (!this.query) {\n for (var _i = 0, _a = Object.keys(this.fields.properties); _i < _a.length; _i++) {\n var column = _a[_i];\n if (column !== 'tableName' && !!(this.fields[column]) &&\n this.fields[column] !==\n ListBase.defaultMappedFields[column]\n && columns.indexOf(this.fields[column]) === -1) {\n columns.push(this.fields[column]);\n }\n }\n query.select(columns);\n if (this.fields.properties.hasOwnProperty('tableName')) {\n query.from(this.fields.tableName);\n }\n }\n return query;\n };\n ListView.prototype.setViewDataSource = function (dataSource) {\n if (dataSource === void 0) { dataSource = this.localData; }\n if (dataSource && this.fields.groupBy) {\n if (this.sortOrder !== 'None') {\n this.curViewDS = ListBase.groupDataSource(ListBase.getDataSource(dataSource, ListBase.addSorting(this.sortOrder, this.fields.sortBy)), this.listBaseOption.fields, this.sortOrder);\n }\n else {\n this.curViewDS = ListBase.groupDataSource(dataSource, this.listBaseOption.fields, this.sortOrder);\n }\n }\n else if (dataSource && this.sortOrder !== 'None') {\n this.curViewDS = ListBase.getDataSource(dataSource, ListBase.addSorting(this.sortOrder, this.fields.sortBy));\n }\n else {\n this.curViewDS = dataSource;\n }\n };\n ListView.prototype.isInAnimation = function () {\n return this.curUL.classList.contains('.e-animate');\n };\n ListView.prototype.setLocalData = function () {\n var _this = this;\n this.trigger('actionBegin');\n if (this.dataSource instanceof DataManager) {\n this.dataSource.executeQuery(this.getQuery()).then(function (e) {\n if (_this.isDestroyed) {\n return;\n }\n _this.localData = e.result;\n _this.removeElement(_this.contentContainer);\n _this.renderList();\n _this.trigger('actionComplete', e);\n }).catch(function (e) {\n if (_this.isDestroyed) {\n return;\n }\n _this.trigger('actionFailure', e);\n });\n }\n else if (!this.dataSource || !this.dataSource.length) {\n var ul = this.element.querySelector('ul');\n if (ul) {\n remove(ul);\n this.setProperties({ dataSource: ListBase.createJsonFromElement(ul) }, true);\n this.localData = this.dataSource;\n this.renderList();\n this.trigger('actionComplete', { data: this.localData });\n }\n }\n else {\n this.localData = this.dataSource;\n this.renderList();\n this.trigger('actionComplete', { data: this.localData });\n }\n };\n ListView.prototype.reRender = function () {\n this.element.innerHTML = '';\n this.headerEle = this.ulElement = this.liCollection = undefined;\n this.setLocalData();\n this.header();\n };\n ListView.prototype.resetCurrentList = function () {\n this.setViewDataSource(this.curViewDS);\n this.contentContainer.innerHTML = '';\n this.createList();\n this.renderIntoDom(this.curUL);\n };\n ListView.prototype.createList = function () {\n this.currentLiElements = [];\n this.isNestedList = false;\n this.ulElement = this.curUL = ListBase.createList(this.createElement, this.curViewDS, this.listBaseOption);\n this.liCollection = this.curUL.querySelectorAll('.' + classNames.listItem);\n };\n ListView.prototype.renderSubList = function (li) {\n var uID = li.getAttribute('data-uid');\n if (li.classList.contains(classNames.hasChild) && uID) {\n var ul = closest(li.parentNode, '.' + classNames.parentItem);\n var ele = this.element.querySelector('[pid=\\'' + uID + '\\']');\n this.curDSLevel.push(uID);\n this.setViewDataSource(this.getSubDS());\n if (!ele) {\n var data = this.curViewDS;\n ele = ListBase.createListFromJson(this.createElement, data, this.listBaseOption, this.curDSLevel.length);\n ele.setAttribute('pID', uID);\n ele.style.display = 'none';\n this.renderIntoDom(ele);\n }\n this.switchView(ul, ele);\n this.liCollection = this.curUL.querySelectorAll('.' + classNames.listItem);\n if (this.selectedItems) {\n var fieldData = getFieldValues(this.selectedItems.data, this.listBaseOption.fields);\n this.header((fieldData[this.listBaseOption.fields.text]), true);\n }\n this.selectedLI = undefined;\n }\n };\n ListView.prototype.renderIntoDom = function (ele) {\n this.contentContainer.appendChild(ele);\n };\n ListView.prototype.renderList = function (data) {\n this.setViewDataSource(data);\n if (this.enableVirtualization && Object.keys(this.dataSource).length) {\n if ((this.template || this.groupTemplate) && !this.virtualizationModule.isNgTemplate()) {\n this.listBaseOption.template = null;\n this.listBaseOption.groupTemplate = null;\n this.listBaseOption.itemCreated = this.virtualizationModule.createUIItem.bind(this.virtualizationModule);\n }\n this.virtualizationModule.uiVirtualization();\n }\n else {\n this.createList();\n this.contentContainer = this.createElement('div', { className: classNames.content });\n this.element.appendChild(this.contentContainer);\n this.renderIntoDom(this.ulElement);\n }\n };\n ListView.prototype.getElementUID = function (obj) {\n var fields = {};\n if (obj instanceof Element) {\n fields[this.fields.id] = obj.getAttribute('data-uid');\n }\n else {\n fields = obj;\n }\n return fields;\n };\n /**\n * It is used to Initialize the control rendering.\n */\n ListView.prototype.render = function () {\n this.element.classList.add(classNames.root);\n attributes(this.element, { role: 'list', tabindex: '0' });\n this.setCSSClass();\n this.setEnableRTL();\n this.setEnable();\n this.setSize();\n this.wireEvents();\n this.header();\n this.setLocalData();\n this.setHTMLAttribute();\n this.rippleFn = rippleEffect(this.element, {\n selector: '.' + classNames.listItem\n });\n };\n /**\n * It is used to destroy the ListView component.\n */\n ListView.prototype.destroy = function () {\n this.unWireEvents();\n var classAr = [classNames.root, classNames.disable, 'e-rtl',\n 'e-has-header', 'e-lib'].concat(this.cssClass.split(' ').filter(function (css) { return css; }));\n removeClass([this.element], classAr);\n this.rippleFn();\n this.element.removeAttribute('role');\n this.element.removeAttribute('tabindex');\n this.element.innerHTML = '';\n this.curUL = this.ulElement = this.liCollection = this.headerEle = undefined;\n _super.prototype.destroy.call(this);\n };\n /**\n * It helps to switch back from navigated sub list.\n */\n ListView.prototype.back = function () {\n var pID = this.curDSLevel[this.curDSLevel.length - 1];\n if (pID === undefined || this.isInAnimation()) {\n return;\n }\n this.curDSLevel.pop();\n this.setViewDataSource(this.getSubDS());\n var toUL = this.element.querySelector('[data-uid=\\'' + pID + '\\']');\n var fromUL = this.curUL;\n if (!toUL) {\n this.createList();\n this.renderIntoDom(this.ulElement);\n toUL = this.curUL;\n }\n else {\n toUL = toUL.parentElement;\n }\n var fieldData = getFieldValues(this.curDSJSON, this.listBaseOption.fields);\n var text = fieldData[this.fields.text];\n this.switchView(fromUL, toUL, true);\n this.removeFocus();\n var li = this.element.querySelector('[data-uid=\\'' + pID + '\\']');\n li.classList.add(classNames.focused);\n if (this.showCheckBox && li.querySelector('.' + classNames.checkboxIcon).classList.contains(classNames.checked)) {\n li.setAttribute('aria-selected', 'true');\n }\n else {\n li.classList.remove(classNames.selected);\n li.setAttribute('aria-selected', 'false');\n }\n this.liCollection = this.curUL.querySelectorAll('.' + classNames.listItem);\n this.header((this.curDSLevel.length ? text : this.headerTitle), (this.curDSLevel.length ? true : false));\n };\n /**\n * It is used to select the list item from the ListView.\n * @param {Fields | HTMLElement | Element} obj - We can pass element Object or Fields as Object with ID and Text fields.\n */\n ListView.prototype.selectItem = function (obj) {\n if (this.enableVirtualization) {\n this.virtualizationModule.selectItem(obj);\n }\n else if (this.showCheckBox) {\n this.setCheckboxLI(this.getLiFromObjOrElement(obj));\n }\n else {\n isNullOrUndefined(obj) ? this.removeSelect() : this.setSelectLI(this.getLiFromObjOrElement(obj));\n }\n };\n ListView.prototype.getLiFromObjOrElement = function (obj) {\n var li;\n var dataSource = this.dataSource instanceof DataManager ?\n this.localData : this.dataSource;\n if (!isNullOrUndefined(obj)) {\n if (typeof dataSource[0] === 'string' || typeof dataSource[0] === 'number') {\n if (obj instanceof Element) {\n var uid = obj.getAttribute('data-uid').toString();\n for (var i = 0; i < this.liCollection.length; i++) {\n if (this.liCollection[i].getAttribute('data-uid').toString() === uid) {\n li = this.liCollection[i];\n break;\n }\n }\n }\n else {\n Array.prototype.some.call(this.curUL.querySelectorAll('.' + classNames.listItem), function (item) {\n if (item.innerText.trim() === obj.toString()) {\n li = item;\n return true;\n }\n else {\n return false;\n }\n });\n }\n }\n else {\n var resultJSON = this.getItemData(obj);\n var fieldData = getFieldValues(resultJSON, this.listBaseOption.fields);\n if (resultJSON) {\n li = this.element.querySelector('[data-uid=\"'\n + fieldData[this.fields.id] + '\"]');\n if (!this.enableVirtualization && isNullOrUndefined(li)) {\n var curLi = this.element.querySelectorAll('.' + classNames.listItem);\n for (var i = 0; i < curLi.length; i++) {\n if (curLi[i].innerText.trim() === fieldData[this.fields.text]) {\n li = curLi[i];\n }\n }\n }\n }\n }\n }\n return li;\n };\n /**\n * It is used to select multiple list item from the ListView.\n * @param {Fields[] | HTMLElement[] | Element[]} obj - We can pass array of elements or array of field Object with ID and Text fields.\n */\n ListView.prototype.selectMultipleItems = function (obj) {\n if (!isNullOrUndefined(obj)) {\n for (var i = 0; i < obj.length; i++) {\n if (!isNullOrUndefined(obj[i])) {\n this.selectItem(obj[i]);\n }\n }\n }\n };\n ListView.prototype.getParentId = function () {\n var parentId = [];\n if (this.isNestedList) {\n for (var i = this.curDSLevel.length - 1; i >= 0; i--) {\n parentId.push(this.curDSLevel[i]);\n }\n }\n return parentId;\n };\n /**\n * It is used to get the currently [here](./api-selectedItem)\n * item details from the list items.\n */\n ListView.prototype.getSelectedItems = function () {\n this.selectedId = [];\n var dataSource = this.dataSource instanceof DataManager ?\n this.localData : this.dataSource;\n if (this.enableVirtualization) {\n return this.virtualizationModule.getSelectedItems();\n }\n else if (this.showCheckBox) {\n var liCollection = this.curUL.getElementsByClassName(classNames.selected);\n var liTextCollection = [];\n var liDataCollection = [];\n this.selectedId = [];\n var dataParent = [];\n for (var i = 0; i < liCollection.length; i++) {\n if (typeof dataSource[0] === 'string' || typeof dataSource[0] === 'number') {\n liTextCollection.push(liCollection[i].innerText.trim());\n }\n else {\n var tempData = this.getItemData(liCollection[i]);\n var fieldData = getFieldValues(tempData, this.listBaseOption.fields);\n if (this.isNestedList) {\n dataParent.push({ data: tempData, parentId: this.getParentId() });\n }\n else {\n liDataCollection.push(tempData);\n }\n if (fieldData) {\n liTextCollection.push(fieldData[this.listBaseOption.fields.text]);\n this.selectedId.push(fieldData[this.listBaseOption.fields.id]);\n }\n else {\n liTextCollection.push(undefined);\n this.selectedId.push(undefined);\n }\n }\n }\n if (typeof dataSource[0] === 'string' || typeof dataSource[0] === 'number') {\n return { item: liCollection, data: dataSource, text: liTextCollection };\n }\n if (this.isNestedList) {\n return { item: liCollection, data: dataParent, text: liTextCollection };\n }\n else {\n return { item: liCollection, data: liDataCollection, text: liTextCollection };\n }\n }\n else {\n var liElement = this.element.getElementsByClassName(classNames.selected)[0];\n var fieldData = getFieldValues(this.getItemData(liElement), this.listBaseOption.fields);\n if (typeof dataSource[0] === 'string' || typeof dataSource[0] === 'number') {\n return (!isNullOrUndefined(liElement)) ? {\n item: liElement, data: dataSource,\n text: liElement.innerText.trim()\n } : undefined;\n }\n else {\n if (isNullOrUndefined(fieldData) || isNullOrUndefined(liElement)) {\n return undefined;\n }\n else {\n this.selectedId.push(fieldData[this.listBaseOption.fields.id]);\n return {\n text: fieldData[this.listBaseOption.fields.text], item: liElement,\n data: this.getItemData(liElement)\n };\n }\n }\n }\n };\n /**\n * It is used to find out an item details from the current list.\n * @param {Fields | HTMLElement | Element} obj - We can pass element Object or Fields as Object with ID and Text fields.\n */\n ListView.prototype.findItem = function (obj) {\n return this.getItemData(obj);\n };\n /**\n * A function that used to enable the disabled list items based on passed element.\n * @param {Fields | HTMLElement | Element} obj - We can pass element Object or Fields as Object with ID and Text fields.\n */\n ListView.prototype.enableItem = function (obj) {\n this.setItemState(obj, true);\n if (this.enableVirtualization) {\n this.virtualizationModule.enableItem(obj);\n }\n };\n /**\n * It is used to disable the list items based on passed element.\n * @param {Fields | HTMLElement | Element} obj - We can pass element Object or Fields as Object with ID and Text fields.\n */\n ListView.prototype.disableItem = function (obj) {\n this.setItemState(obj, false);\n if (this.enableVirtualization) {\n this.virtualizationModule.disableItem(obj);\n }\n };\n //A function that used to set state of the list item like enable, disable.\n ListView.prototype.setItemState = function (obj, isEnable) {\n var resultJSON = this.getItemData(obj);\n var fieldData = getFieldValues(resultJSON, this.listBaseOption.fields);\n if (resultJSON) {\n var li = this.element.querySelector('[data-uid=\"' + fieldData[this.fields.id] + '\"]');\n if (isEnable) {\n if (li) {\n li.classList.remove(classNames.disable);\n }\n delete resultJSON[this.fields.enabled];\n }\n else if (!isEnable) {\n if (li) {\n li.classList.add(classNames.disable);\n }\n resultJSON[this.fields.enabled] = false;\n }\n }\n };\n /**\n * It is used to show an list item from the ListView.\n * @param {Fields | HTMLElement | Element} obj - We can pass element Object or Fields as Object with ID and Text fields.\n */\n ListView.prototype.showItem = function (obj) {\n this.showHideItem(obj, false, '');\n if (this.enableVirtualization) {\n this.virtualizationModule.showItem(obj);\n }\n };\n /**\n * It is used to hide an item from the ListView.\n * @param {Fields | HTMLElement | Element} obj - We can pass element Object or Fields as Object with ID and Text fields.\n */\n ListView.prototype.hideItem = function (obj) {\n this.showHideItem(obj, true, 'none');\n if (this.enableVirtualization) {\n this.virtualizationModule.hideItem(obj);\n }\n };\n ListView.prototype.showHideItem = function (obj, isHide, display) {\n var resultJSON = this.getItemData(obj);\n var fieldData = getFieldValues(resultJSON, this.listBaseOption.fields);\n if (resultJSON) {\n var li = this.element.querySelector('[data-uid=\"' + fieldData[this.fields.id] + '\"]');\n if (li) {\n li.style.display = display;\n }\n if (isHide) {\n resultJSON[this.fields.isVisible] = false;\n }\n else {\n delete resultJSON[this.fields.isVisible];\n }\n }\n };\n /**\n * It adds new item to current ListView.\n * To add a new item in the list view, we need to pass ‘data’ as array or object and ‘fields’ as object.\n * For example fields: { text: 'Name', tooltip: 'Name', id:'id'}\n * @param {{[key:string]:Object}[]} data - Array JSON Data that need to add.\n * @param {Fields} fields - Fields as an Object with ID and Text fields.\n */\n ListView.prototype.addItem = function (data, fields) {\n var _this = this;\n if (fields === void 0) { fields = undefined; }\n if (!(this.dataSource instanceof DataManager)) {\n if (data instanceof Array) {\n if (this.enableVirtualization) {\n this.virtualizationModule.addItem(data, fields);\n }\n else {\n var ds = this.findItemFromDS(this.dataSource, fields);\n var fieldData = getFieldValues(ds, this.listBaseOption.fields);\n var child = fieldData[this.fields.child];\n if (!child) {\n child = [];\n }\n child = child.concat(data);\n if (ds instanceof Array) {\n data.forEach(function (dataSource) {\n _this.dataSource.push(dataSource);\n _this.setViewDataSource(_this.dataSource);\n if (_this.ulElement) {\n var index = _this.curViewDS.indexOf(dataSource);\n _this.addListItem(dataSource, index);\n var curViewDS = _this.curViewDS[index - 1];\n if (curViewDS && curViewDS.isHeader && curViewDS.items.length === 1) {\n _this.addListItem(curViewDS, (index - 1));\n }\n }\n else {\n _this.reRender();\n }\n });\n this.liCollection = this.curUL.querySelectorAll('.' + classNames.listItem);\n }\n else {\n ds[this.fields.child] = child;\n this.reRender();\n }\n }\n }\n }\n };\n ListView.prototype.addListItem = function (dataSource, index) {\n var target = this.getLiFromObjOrElement(this.curViewDS[index + 1]) ||\n this.getLiFromObjOrElement(this.curViewDS[index + 2]) || null;\n var li = ListBase.createListItemFromJson(this.createElement, [dataSource], this.listBaseOption);\n this.ulElement.insertBefore(li[0], target);\n };\n /**\n * A function that removes the item from data source based on passed element like fields: { text: 'Name', tooltip: 'Name', id:'id'}\n * @param {Fields | HTMLElement | Element} obj - We can pass element Object or Fields as Object with ID and Text fields.\n */\n ListView.prototype.removeItem = function (obj) {\n if (!(this.dataSource instanceof DataManager)) {\n if (this.enableVirtualization) {\n this.virtualizationModule.removeItem(obj);\n }\n else {\n this.removeItemFromList(obj);\n }\n }\n };\n ListView.prototype.removeItemFromList = function (obj) {\n var fields = obj instanceof Element ? this.getElementUID(obj) : obj;\n var dataSource;\n dataSource = this.findItemFromDS(this.dataSource, fields, true);\n if (dataSource) {\n var data = void 0;\n data = this.findItemFromDS(dataSource, fields);\n var index = this.curViewDS.indexOf(data);\n var li = this.getLiFromObjOrElement(obj);\n var groupLi = void 0;\n if (this.fields.groupBy && this.curViewDS[index - 1] &&\n this.curViewDS[index - 1].isHeader &&\n (this.curViewDS[index - 1])\n .items.length === 1) {\n if (li && li.previousElementSibling.classList.contains(classNames.groupListItem) &&\n (isNullOrUndefined(li.nextElementSibling) || (li.nextElementSibling &&\n li.nextElementSibling.classList.contains(classNames.groupListItem)))) {\n groupLi = li.previousElementSibling;\n }\n }\n if (li) {\n detach(li);\n }\n if (groupLi) {\n detach(groupLi);\n }\n var dsIndex = dataSource.indexOf(data);\n dataSource.splice(dsIndex, 1);\n this.setViewDataSource(this.dataSource);\n this.liCollection = Array.prototype.slice.call(this.element.querySelectorAll('.' + classNames.listItem));\n }\n };\n /**\n * A function that removes multiple item from list view based on given input.\n * @param {Fields[] | HTMLElement[] | Element[]} obj - We can pass array of elements or array of field Object with ID and Text fields.\n */\n ListView.prototype.removeMultipleItems = function (obj) {\n if (!(this.dataSource instanceof DataManager)) {\n if (obj.length) {\n for (var i = 0; i < obj.length; i++) {\n if (this.enableVirtualization) {\n this.removeItem(obj[i]);\n }\n else {\n this.removeItemFromList(obj[i]);\n }\n }\n }\n }\n };\n // Module Required function\n ListView.prototype.getModuleName = function () {\n return 'listview';\n };\n ListView.prototype.requiredModules = function () {\n var modules = [];\n if (this.enableVirtualization) {\n modules.push({ args: [this], member: 'virtualization' });\n }\n return modules;\n };\n /**\n * Get the properties to be maintained in the persisted state.\n */\n ListView.prototype.getPersistData = function () {\n return this.addOnPersist(['cssClass', 'enableRtl', 'htmlAttributes',\n 'enable', 'fields', 'animation', 'headerTitle',\n 'sortOrder', 'showIcon', 'height', 'width', 'showCheckBox', 'checkBoxPosition']);\n };\n __decorate([\n Property('')\n ], ListView.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], ListView.prototype, \"enableVirtualization\", void 0);\n __decorate([\n Property({})\n ], ListView.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Property(true)\n ], ListView.prototype, \"enable\", void 0);\n __decorate([\n Property([])\n ], ListView.prototype, \"dataSource\", void 0);\n __decorate([\n Property()\n ], ListView.prototype, \"query\", void 0);\n __decorate([\n Complex(ListBase.defaultMappedFields, FieldSettings)\n ], ListView.prototype, \"fields\", void 0);\n __decorate([\n Property({ effect: 'SlideLeft', duration: 400, easing: 'ease' })\n ], ListView.prototype, \"animation\", void 0);\n __decorate([\n Property('None')\n ], ListView.prototype, \"sortOrder\", void 0);\n __decorate([\n Property(false)\n ], ListView.prototype, \"showIcon\", void 0);\n __decorate([\n Property(false)\n ], ListView.prototype, \"showCheckBox\", void 0);\n __decorate([\n Property('Left')\n ], ListView.prototype, \"checkBoxPosition\", void 0);\n __decorate([\n Property('')\n ], ListView.prototype, \"headerTitle\", void 0);\n __decorate([\n Property(false)\n ], ListView.prototype, \"showHeader\", void 0);\n __decorate([\n Property('')\n ], ListView.prototype, \"height\", void 0);\n __decorate([\n Property('')\n ], ListView.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], ListView.prototype, \"template\", void 0);\n __decorate([\n Property(null)\n ], ListView.prototype, \"headerTemplate\", void 0);\n __decorate([\n Property(null)\n ], ListView.prototype, \"groupTemplate\", void 0);\n __decorate([\n Event()\n ], ListView.prototype, \"select\", void 0);\n __decorate([\n Event()\n ], ListView.prototype, \"actionBegin\", void 0);\n __decorate([\n Event()\n ], ListView.prototype, \"actionComplete\", void 0);\n __decorate([\n Event()\n ], ListView.prototype, \"actionFailure\", void 0);\n ListView = __decorate([\n NotifyPropertyChanges\n ], ListView);\n return ListView;\n}(Component));\nexport { ListView };\n","import { classNames } from './list-view';\nimport { EventHandler, append, isNullOrUndefined, detach, removeClass, addClass } from '@syncfusion/ej2-base';\nimport { ListBase } from '../common/list-base';\nvar Virtualization = /** @class */ (function () {\n function Virtualization(instance) {\n this.listViewInstance = instance;\n }\n /**\n * For internal use only.\n * @private\n */\n Virtualization.prototype.isNgTemplate = function () {\n return !isNullOrUndefined(this.listViewInstance.templateRef) && typeof this.listViewInstance.templateRef !== 'string'\n && isNullOrUndefined(this.listViewInstance.fields.groupBy);\n };\n /**\n * For internal use only.\n * @private\n */\n Virtualization.prototype.uiVirtualization = function () {\n var curViewDS = this.listViewInstance.curViewDS;\n var firstDs = curViewDS.slice(0, 1);\n this.listViewInstance.ulElement = this.listViewInstance.curUL = ListBase.createList(this.listViewInstance.createElement, firstDs, this.listViewInstance.listBaseOption);\n this.listViewInstance.contentContainer = this.listViewInstance.createElement('div', { className: classNames.content });\n this.listViewInstance.element.appendChild(this.listViewInstance.contentContainer);\n this.listViewInstance.contentContainer.appendChild(this.listViewInstance.ulElement);\n this.listItemHeight = this.listViewInstance.ulElement.firstElementChild.getBoundingClientRect().height;\n this.expectedDomItemCount = this.ValidateItemCount(10000);\n this.domItemCount = this.ValidateItemCount(Object.keys(this.listViewInstance.curViewDS).length);\n this.uiFirstIndex = 0;\n this.uiLastIndex = this.domItemCount - 1;\n this.wireScrollEvent(false);\n var otherDs = curViewDS.slice(1, this.domItemCount);\n var listItems = ListBase.createListItemFromJson(this.listViewInstance.createElement, otherDs, this.listViewInstance.listBaseOption);\n append(listItems, this.listViewInstance.ulElement);\n this.listViewInstance.liCollection = this.listViewInstance.curUL.querySelectorAll('li');\n this.topElement = this.listViewInstance.createElement('div');\n this.listViewInstance.ulElement.insertBefore(this.topElement, this.listViewInstance.ulElement.firstElementChild);\n this.bottomElement = this.listViewInstance.createElement('div');\n this.listViewInstance.ulElement.insertBefore(this.bottomElement, null);\n this.totalHeight = (Object.keys(curViewDS).length * this.listItemHeight) - (this.domItemCount * this.listItemHeight);\n this.topElement.style.height = 0 + 'px';\n this.bottomElement.style.height = this.totalHeight + 'px';\n this.topElementHeight = 0;\n this.bottomElementHeight = this.totalHeight;\n this.listDiff = 0;\n this.uiIndicesInitialization();\n };\n Virtualization.prototype.wireScrollEvent = function (destroy) {\n if (!destroy) {\n if (this.listViewInstance.isWindow) {\n this.onVirtualScroll = this.onVirtualUiScroll.bind(this);\n window.addEventListener('scroll', this.onVirtualScroll);\n }\n else {\n EventHandler.add(this.listViewInstance.element, 'scroll', this.onVirtualUiScroll, this);\n }\n }\n else {\n this.listViewInstance.isWindow ? window.removeEventListener('scroll', this.onVirtualScroll) :\n EventHandler.remove(this.listViewInstance.element, 'scroll', this.onVirtualUiScroll);\n }\n };\n Virtualization.prototype.ValidateItemCount = function (dataSourceLength) {\n var itemCount = this.listViewInstance.isWindow ? Math.round((window.innerHeight / this.listItemHeight) * 3) :\n Math.round((this.listViewInstance.height / this.listItemHeight) * 1.5);\n if (itemCount > dataSourceLength) {\n itemCount = dataSourceLength;\n }\n return itemCount;\n };\n Virtualization.prototype.uiIndicesInitialization = function () {\n var _this = this;\n this.uiIndices = { 'activeIndices': [], 'disabledItemIndices': [], 'hiddenItemIndices': [] };\n this.listViewInstance.curViewDS.forEach(function (ds, index) {\n if (_this.listViewInstance.showCheckBox && ds[_this.listViewInstance.fields.isChecked]) {\n _this.uiIndices.activeIndices.push(index);\n }\n if (!isNullOrUndefined(ds[_this.listViewInstance.fields.enabled]) && !ds[_this.listViewInstance.fields.enabled]) {\n _this.uiIndices.disabledItemIndices.push(index);\n }\n });\n if (this.isNgTemplate()) {\n Array.prototype.forEach.call(this.listViewInstance.element.querySelectorAll('.' + classNames.listItem), function (item, index) {\n item.context = _this.listViewInstance.viewContainerRef._embeddedViews[index].context;\n });\n }\n };\n Virtualization.prototype.refreshItemHeight = function () {\n if (this.listViewInstance.curViewDS.length) {\n var curViewDS = this.listViewInstance.curViewDS;\n this.listItemHeight = this.topElement.nextSibling.getBoundingClientRect().height;\n this.totalHeight = (Object.keys(curViewDS).length * this.listItemHeight) - (this.domItemCount * this.listItemHeight);\n this.bottomElementHeight = this.totalHeight;\n this.bottomElement.style.height = this.totalHeight + 'px';\n }\n };\n Virtualization.prototype.getscrollerHeight = function (startingHeight) {\n return this.listViewInstance.isWindow ? (((pageYOffset - startingHeight) <= 0) ? 0 :\n (pageYOffset - startingHeight)) : ((this.listViewInstance.element.scrollTop - startingHeight) <= 0) ? 0 :\n (this.listViewInstance.element.scrollTop - startingHeight);\n };\n Virtualization.prototype.onVirtualUiScroll = function () {\n var _a;\n var startingHeight;\n if (this.listViewInstance.isWindow) {\n startingHeight = this.listViewInstance.ulElement.getBoundingClientRect().top -\n document.documentElement.getBoundingClientRect().top;\n }\n else {\n startingHeight = this.listViewInstance.headerEle ? this.listViewInstance.headerEle.getBoundingClientRect().height : 0;\n }\n this.scrollPosition = isNullOrUndefined(this.scrollPosition) ? 0 : this.scrollPosition;\n var scroll = this.getscrollerHeight(startingHeight);\n this.topElementHeight = this.listItemHeight * Math.floor(scroll / this.listItemHeight);\n this.bottomElementHeight = this.totalHeight - this.topElementHeight;\n _a = scroll <= this.totalHeight ?\n [this.topElementHeight, this.bottomElementHeight] : [this.totalHeight, 0], this.topElementHeight = _a[0], this.bottomElementHeight = _a[1];\n if (this.topElementHeight !== parseFloat(this.topElement.style.height)) {\n this.topElement.style.height = this.topElementHeight + 'px';\n this.bottomElement.style.height = this.bottomElementHeight + 'px';\n if (scroll > this.scrollPosition) {\n var listDiff = ((this.topElementHeight / this.listItemHeight) - this.listDiff);\n if (listDiff > (this.expectedDomItemCount + 5)) {\n this.onLongScroll(listDiff, true);\n }\n else {\n this.onNormalScroll(listDiff, true);\n }\n }\n else {\n var listDiff = (this.listDiff - (this.topElementHeight / this.listItemHeight));\n if (listDiff > (this.expectedDomItemCount + 5)) {\n this.onLongScroll(listDiff, false);\n }\n else {\n this.onNormalScroll(listDiff, false);\n }\n }\n this.listDiff = this.topElementHeight / this.listItemHeight;\n if (typeof this.listViewInstance.onUIScrolled === 'function') {\n this.listViewInstance.onUIScrolled();\n }\n }\n this.scrollPosition = scroll;\n };\n Virtualization.prototype.onLongScroll = function (listDiff, isScrollingDown) {\n var _this = this;\n var index = isScrollingDown ? (this.uiFirstIndex + listDiff) : (this.uiFirstIndex - listDiff);\n Array.prototype.forEach.call(this.listViewInstance.ulElement.querySelectorAll('li'), function (element) {\n _this.updateUI(element, index);\n index++;\n });\n this.uiLastIndex = isScrollingDown ? (this.uiLastIndex + listDiff) : (this.uiLastIndex - listDiff);\n this.uiFirstIndex = isScrollingDown ? (this.uiFirstIndex + listDiff) : (this.uiFirstIndex - listDiff);\n };\n Virtualization.prototype.onNormalScroll = function (listDiff, isScrollingDown) {\n if (isScrollingDown) {\n for (var i = 0; i < listDiff; i++) {\n var index = ++this.uiLastIndex;\n this.updateUI(this.topElement.nextElementSibling, index, this.bottomElement);\n this.uiFirstIndex++;\n }\n }\n else {\n for (var i = 0; i < listDiff; i++) {\n var index = --this.uiFirstIndex;\n var target = this.topElement.nextSibling;\n this.updateUI(this.bottomElement.previousElementSibling, index, target);\n this.uiLastIndex--;\n }\n }\n };\n Virtualization.prototype.updateUiContent = function (element, index) {\n var curViewDs = this.listViewInstance.curViewDS;\n if (typeof this.listViewInstance.dataSource[0] === 'string' ||\n typeof this.listViewInstance.dataSource[0] === 'number') {\n element.dataset.uid = ListBase.generateId();\n element.getElementsByClassName(classNames.listItemText)[0].innerHTML =\n this.listViewInstance.curViewDS[index].toString();\n }\n else {\n element.dataset.uid = curViewDs[index][this.listViewInstance.fields.id] ?\n curViewDs[index][this.listViewInstance.fields.id].toString() : ListBase.generateId();\n element.getElementsByClassName(classNames.listItemText)[0].innerHTML =\n curViewDs[index][this.listViewInstance.fields.text].toString();\n }\n if (this.listViewInstance.showIcon) {\n if (element.querySelector('.' + classNames.listIcon)) {\n detach(element.querySelector('.' + classNames.listIcon));\n }\n if (this.listViewInstance.curViewDS[index][this.listViewInstance.fields.iconCss]) {\n var textContent = element.querySelector('.' + classNames.textContent);\n var target = this.listViewInstance.createElement('div', {\n className: classNames.listIcon + ' ' +\n this.listViewInstance.curViewDS[index][this.listViewInstance.fields.iconCss]\n });\n textContent.insertBefore(target, element.querySelector('.' + classNames.listItemText));\n }\n }\n if (this.listViewInstance.showCheckBox && this.listViewInstance.fields.groupBy) {\n if (!this.checkListWrapper) {\n this.checkListWrapper = this.listViewInstance.curUL.querySelector('.' + classNames.checkboxWrapper).cloneNode(true);\n }\n var textContent = element.querySelector('.' + classNames.textContent);\n if (this.listViewInstance.curViewDS[index].isHeader) {\n if (element.querySelector('.' + classNames.checkboxWrapper)) {\n element.classList.remove(classNames.checklist);\n textContent.classList.remove(classNames.checkbox);\n detach(element.querySelector('.' + classNames.checkboxWrapper));\n }\n }\n else {\n if (!element.querySelector('.' + classNames.checkboxWrapper)) {\n element.classList.add(classNames.checklist);\n textContent.classList.add(classNames.checkbox);\n textContent.insertBefore(this.checkListWrapper.cloneNode(true), element.querySelector('.' + classNames.listItemText));\n }\n }\n }\n };\n Virtualization.prototype.changeElementAttributes = function (element, index) {\n element.classList.remove(classNames.disable);\n if (this.uiIndices.disabledItemIndices.length && this.uiIndices.disabledItemIndices.indexOf(index) !== -1) {\n element.classList.add(classNames.disable);\n }\n element.style.display = '';\n if (this.uiIndices.hiddenItemIndices.length && this.uiIndices.hiddenItemIndices.indexOf(index) !== -1) {\n element.style.display = 'none';\n }\n if (this.listViewInstance.showCheckBox) {\n var checklistElement = element.querySelector('.' + classNames.checkboxWrapper);\n element.classList.remove(classNames.selected);\n element.classList.remove(classNames.focused);\n if (checklistElement) {\n checklistElement.removeAttribute('aria-checked');\n checklistElement.firstElementChild.classList.remove(classNames.checked);\n }\n if (this.uiIndices.activeIndices.length && this.uiIndices.activeIndices.indexOf(index) !== -1 &&\n !this.listViewInstance.curUL.querySelector(classNames.selected)) {\n element.classList.add(classNames.selected);\n checklistElement.firstElementChild.classList.add(classNames.checked);\n checklistElement.setAttribute('aria-checked', 'true');\n if (this.activeIndex === index) {\n element.classList.add(classNames.focused);\n }\n }\n }\n else {\n element.classList.remove(classNames.selected);\n element.removeAttribute('aria-selected');\n if (!isNullOrUndefined(this.activeIndex) && this.activeIndex === index &&\n !this.listViewInstance.curUL.querySelector(classNames.selected)) {\n element.classList.add(classNames.selected);\n element.setAttribute('aria-selected', 'true');\n }\n }\n if (this.listViewInstance.fields.groupBy) {\n if (this.listViewInstance.curViewDS[index].isHeader) {\n if (element.classList.contains(classNames.listItem)) {\n element.classList.remove(classNames.listItem);\n element.setAttribute('role', 'group');\n element.classList.add(classNames.groupListItem);\n }\n }\n else {\n if (element.classList.contains(classNames.groupListItem)) {\n element.classList.remove(classNames.groupListItem);\n element.setAttribute('role', 'listitem');\n element.classList.add(classNames.listItem);\n }\n }\n }\n };\n Virtualization.prototype.findDSAndIndexFromId = function (ds, fields) {\n var _this = this;\n var resultJSON = {};\n fields = this.listViewInstance.getElementUID(fields);\n if (!isNullOrUndefined(fields)) {\n ds.some(function (data, index) {\n if ((fields[_this.listViewInstance.fields.id] &&\n fields[_this.listViewInstance.fields.id].toString()\n === (data[_this.listViewInstance.fields.id] && data[_this.listViewInstance.fields.id].toString())) || fields === data) {\n resultJSON.index = index;\n resultJSON.data = data;\n return true;\n }\n else {\n return false;\n }\n });\n }\n return resultJSON;\n };\n Virtualization.prototype.getSelectedItems = function () {\n var _this = this;\n if (!isNullOrUndefined(this.activeIndex) || (this.listViewInstance.showCheckBox && this.uiIndices.activeIndices.length)) {\n var dataCollection_1 = [];\n var textCollection_1 = [];\n if (typeof this.listViewInstance.dataSource[0] === 'string' ||\n typeof this.listViewInstance.dataSource[0] === 'number') {\n var curViewDS_1 = this.listViewInstance.curViewDS;\n if (this.listViewInstance.showCheckBox) {\n this.uiIndices.activeIndices.forEach(function (index) {\n dataCollection_1.push(curViewDS_1[index]);\n });\n return {\n text: dataCollection_1,\n data: dataCollection_1,\n index: this.uiIndices.activeIndices.map(function (index) {\n return _this.listViewInstance.dataSource.indexOf(curViewDS_1[index]);\n })\n };\n }\n else {\n return {\n text: curViewDS_1[this.activeIndex],\n data: curViewDS_1[this.activeIndex],\n index: this.listViewInstance.dataSource.indexOf(curViewDS_1[this.activeIndex])\n };\n }\n }\n else {\n var curViewDS_2 = this.listViewInstance.curViewDS;\n var text_1 = this.listViewInstance.fields.text;\n if (this.listViewInstance.showCheckBox) {\n this.uiIndices.activeIndices.forEach(function (index) {\n textCollection_1.push(curViewDS_2[index][text_1]);\n dataCollection_1.push(curViewDS_2[index]);\n });\n return {\n text: textCollection_1,\n data: dataCollection_1,\n index: this.uiIndices.activeIndices.map(function (index) {\n return (_this.listViewInstance.dataSource).indexOf(curViewDS_2[index]);\n })\n };\n }\n else {\n return {\n text: curViewDS_2[this.activeIndex][this.listViewInstance.fields.text],\n data: curViewDS_2[this.activeIndex],\n index: this.listViewInstance.dataSource.indexOf(curViewDS_2[this.activeIndex])\n };\n }\n }\n }\n else {\n return undefined;\n }\n };\n Virtualization.prototype.selectItem = function (obj) {\n var resutJSON = this.findDSAndIndexFromId(this.listViewInstance.curViewDS, obj);\n if (Object.keys(resutJSON).length) {\n var isSelected = this.activeIndex === resutJSON.index;\n var isChecked = void 0;\n this.activeIndex = resutJSON.index;\n if (this.listViewInstance.showCheckBox) {\n if (this.uiIndices.activeIndices.indexOf(resutJSON.index) === -1) {\n isChecked = true;\n this.uiIndices.activeIndices.push(resutJSON.index);\n }\n else {\n isChecked = false;\n this.uiIndices.activeIndices.splice(this.uiIndices.activeIndices.indexOf(resutJSON.index), 1);\n }\n if (this.listViewInstance.curUL.querySelector('.' + classNames.focused)) {\n this.listViewInstance.curUL.querySelector('.' + classNames.focused).classList.remove(classNames.focused);\n }\n }\n if (this.listViewInstance.getLiFromObjOrElement(obj)) {\n if (this.listViewInstance.showCheckBox) {\n this.listViewInstance.setCheckboxLI(this.listViewInstance.getLiFromObjOrElement(obj));\n }\n else {\n this.listViewInstance.setSelectLI(this.listViewInstance.getLiFromObjOrElement(obj));\n }\n }\n else {\n var eventArgs = void 0;\n if (typeof this.listViewInstance.dataSource[0] === 'string' ||\n typeof this.listViewInstance.dataSource[0] === 'number') {\n eventArgs = {\n text: this.listViewInstance.curViewDS[this.activeIndex],\n data: this.listViewInstance.curViewDS[this.activeIndex],\n index: this.activeIndex\n };\n }\n else {\n var curViewDS = this.listViewInstance.curViewDS;\n eventArgs = {\n text: curViewDS[this.activeIndex][this.listViewInstance.fields.text],\n data: curViewDS[this.activeIndex],\n index: this.activeIndex\n };\n }\n if (this.listViewInstance.showCheckBox) {\n eventArgs.isChecked = isChecked;\n this.listViewInstance.trigger('select', eventArgs);\n }\n else if (!isSelected) {\n this.listViewInstance.removeSelect();\n this.listViewInstance.trigger('select', eventArgs);\n }\n }\n }\n else if (isNullOrUndefined(obj) && !this.listViewInstance.showCheckBox) {\n this.listViewInstance.removeSelect();\n this.activeIndex = undefined;\n }\n };\n Virtualization.prototype.enableItem = function (obj) {\n var resutJSON = this.findDSAndIndexFromId(this.listViewInstance.curViewDS, obj);\n if (Object.keys(resutJSON).length) {\n this.uiIndices.disabledItemIndices.splice(this.uiIndices.disabledItemIndices.indexOf(resutJSON.index), 1);\n }\n };\n Virtualization.prototype.disableItem = function (obj) {\n var resutJSON = this.findDSAndIndexFromId(this.listViewInstance.curViewDS, obj);\n if (Object.keys(resutJSON).length && this.uiIndices.disabledItemIndices.indexOf(resutJSON.index) === -1) {\n this.uiIndices.disabledItemIndices.push(resutJSON.index);\n }\n };\n Virtualization.prototype.showItem = function (obj) {\n var resutJSON = this.findDSAndIndexFromId(this.listViewInstance.curViewDS, obj);\n if (Object.keys(resutJSON).length) {\n this.uiIndices.hiddenItemIndices.splice(this.uiIndices.hiddenItemIndices.indexOf(resutJSON.index), 1);\n }\n };\n Virtualization.prototype.hideItem = function (obj) {\n var resutJSON = this.findDSAndIndexFromId(this.listViewInstance.curViewDS, obj);\n if (Object.keys(resutJSON).length && this.uiIndices.hiddenItemIndices.indexOf(resutJSON.index) === -1) {\n this.uiIndices.hiddenItemIndices.push(resutJSON.index);\n }\n };\n Virtualization.prototype.removeItem = function (obj) {\n var dataSource;\n var resutJSON = this.findDSAndIndexFromId(this.listViewInstance.curViewDS, obj);\n if (Object.keys(resutJSON).length) {\n dataSource = resutJSON.data;\n if (this.listViewInstance.curViewDS[resutJSON.index - 1] &&\n this.listViewInstance.curViewDS[resutJSON.index - 1].isHeader &&\n (this.listViewInstance.curViewDS[resutJSON.index - 1])\n .items.length === 1) {\n this.removeUiItem(resutJSON.index - 1);\n this.removeUiItem(resutJSON.index - 1);\n }\n else {\n this.removeUiItem(resutJSON.index);\n }\n }\n var index = this.listViewInstance.dataSource.indexOf(dataSource);\n if (index !== -1) {\n this.listViewInstance.dataSource.splice(index, 1);\n this.listViewInstance.setViewDataSource(this.listViewInstance.dataSource);\n }\n };\n Virtualization.prototype.setCheckboxLI = function (li, e) {\n var index = Array.prototype.indexOf.call(this.listViewInstance.curUL.querySelectorAll('li'), li) + this.uiFirstIndex;\n this.activeIndex = Array.prototype.indexOf.call(this.listViewInstance.curUL.querySelectorAll('li'), li) + this.uiFirstIndex;\n if (li.classList.contains(classNames.selected)) {\n if (this.uiIndices.activeIndices.indexOf(index) === -1) {\n this.uiIndices.activeIndices.push(index);\n }\n }\n else {\n this.uiIndices.activeIndices.splice(this.uiIndices.activeIndices.indexOf(index), 1);\n }\n };\n Virtualization.prototype.setSelectLI = function (li, e) {\n this.activeIndex = Array.prototype.indexOf.call(this.listViewInstance.curUL.querySelectorAll('li'), li) + this.uiFirstIndex;\n };\n Virtualization.prototype.checkedItem = function (checked) {\n var _this = this;\n if (checked) {\n this.uiIndices.activeIndices = [];\n this.activeIndex = undefined;\n this.listViewInstance.curViewDS.forEach(function (ds, index) {\n if (!ds.isHeader) {\n _this.uiIndices.activeIndices.push(index);\n }\n });\n }\n else {\n this.activeIndex = undefined;\n this.uiIndices.activeIndices = [];\n }\n };\n Virtualization.prototype.addUiItem = function (index) {\n var curViewDs = this.listViewInstance.curViewDS;\n this.changeUiIndices(index, true);\n if (this.activeIndex && this.activeIndex >= index) {\n this.activeIndex++;\n }\n if (this.listViewInstance.showCheckBox &&\n curViewDs[index][this.listViewInstance.fields.isChecked]) {\n this.uiIndices.activeIndices.push(index);\n }\n if (!parseFloat(this.bottomElement.style.height) && !parseFloat(this.topElement.style.height)) {\n this.bottomElement.style.height = parseFloat(this.bottomElement.style.height) + this.listItemHeight + 'px';\n }\n if (parseFloat(this.bottomElement.style.height)) {\n var liItem = this.listViewInstance.curUL.lastElementChild.previousSibling;\n var target = this.listViewInstance.getLiFromObjOrElement(curViewDs[index + 1]) ||\n this.listViewInstance.getLiFromObjOrElement(curViewDs[index + 2]);\n if (target) {\n this.bottomElement.style.height = parseFloat(this.bottomElement.style.height) + this.listItemHeight + 'px';\n this.updateUI(liItem, index, target);\n }\n }\n else {\n var liItem = this.listViewInstance.curUL.firstElementChild.nextSibling;\n var target = void 0;\n if ((Object.keys(this.listViewInstance.curViewDS).length - 1) === index) {\n target = this.listViewInstance.curUL.lastElementChild;\n }\n else {\n target = this.listViewInstance.getLiFromObjOrElement(curViewDs[index + 1]) ||\n this.listViewInstance.getLiFromObjOrElement(curViewDs[index + 2]);\n }\n this.topElement.style.height = parseFloat(this.topElement.style.height) + this.listItemHeight + 'px';\n this.uiFirstIndex++;\n this.uiLastIndex++;\n if (target) {\n this.updateUI(liItem, index, target);\n this.listViewInstance.isWindow ? window.scrollTo(0, (pageYOffset + this.listItemHeight)) :\n this.listViewInstance.element.scrollTop += this.listItemHeight;\n }\n }\n this.totalHeight += this.listItemHeight;\n this.listDiff = parseFloat(this.topElement.style.height) / this.listItemHeight;\n };\n Virtualization.prototype.removeUiItem = function (index) {\n this.totalHeight -= this.listItemHeight;\n var curViewDS = this.listViewInstance.curViewDS[index];\n var liItem = this.listViewInstance.getLiFromObjOrElement(curViewDS);\n this.listViewInstance.curViewDS.splice(index, 1);\n if (this.activeIndex && this.activeIndex >= index) {\n this.activeIndex--;\n }\n if (liItem) {\n if (this.domItemCount > Object.keys(this.listViewInstance.curViewDS).length) {\n detach(liItem);\n this.domItemCount--;\n this.uiLastIndex--;\n this.totalHeight = 0;\n }\n else {\n if (liItem.classList.contains(classNames.disable)) {\n liItem.classList.remove(classNames.disable);\n this.uiIndices.disabledItemIndices.splice(this.uiIndices.disabledItemIndices.indexOf(index), 1);\n }\n if (liItem.style.display === 'none') {\n liItem.style.display = '';\n this.uiIndices.hiddenItemIndices.splice(this.uiIndices.hiddenItemIndices.indexOf(index), 1);\n }\n if (this.listViewInstance.showCheckBox && liItem.classList.contains(classNames.selected)) {\n this.listViewInstance.removeSelect();\n this.uiIndices.activeIndices.splice(this.uiIndices.activeIndices.indexOf(index), 1);\n var checklistElement = liItem.querySelector('.' + classNames.checkboxWrapper);\n checklistElement.removeAttribute('aria-checked');\n checklistElement.firstElementChild.classList.remove(classNames.checked);\n if (liItem.classList.contains(classNames.focused)) {\n liItem.classList.remove(classNames.focused);\n this.activeIndex = undefined;\n }\n }\n else if (liItem.classList.contains(classNames.selected)) {\n this.listViewInstance.removeSelect();\n this.activeIndex = undefined;\n }\n if (!parseFloat(this.bottomElement.style.height) && !parseFloat(this.topElement.style.height)) {\n this.updateUI(liItem, this.uiLastIndex, this.bottomElement);\n }\n else if (parseFloat(this.bottomElement.style.height)) {\n this.bottomElement.style.height = parseFloat(this.bottomElement.style.height) - this.listItemHeight + 'px';\n this.updateUI(liItem, this.uiLastIndex, this.bottomElement);\n }\n else {\n this.topElement.style.height = parseFloat(this.topElement.style.height) - this.listItemHeight + 'px';\n this.updateUI(liItem, (this.uiFirstIndex - 1), this.topElement.nextSibling);\n this.uiLastIndex--;\n this.uiFirstIndex--;\n }\n }\n }\n this.changeUiIndices(index, false);\n this.listDiff = parseFloat(this.topElement.style.height) / this.listItemHeight;\n };\n Virtualization.prototype.changeUiIndices = function (index, increment) {\n var _this = this;\n Object.keys(this.uiIndices).forEach(function (key) {\n _this.uiIndices[key] = _this.uiIndices[key].map(function (i) {\n if (i >= index) {\n return increment ? ++i : --i;\n }\n else {\n return i;\n }\n });\n });\n };\n Virtualization.prototype.addItem = function (data, fields) {\n var _this = this;\n data.forEach(function (dataSource) {\n _this.listViewInstance.dataSource.push(dataSource);\n _this.listViewInstance.setViewDataSource(_this.listViewInstance.dataSource);\n if (!_this.domItemCount) {\n _this.uiVirtualization();\n }\n else if (_this.domItemCount < _this.expectedDomItemCount) {\n _this.wireScrollEvent(true);\n detach(_this.listViewInstance.contentContainer);\n _this.uiVirtualization();\n }\n else {\n var index = _this.listViewInstance.curViewDS.indexOf(dataSource);\n _this.addUiItem(index);\n var curViewDS = _this.listViewInstance.curViewDS[index - 1];\n if (curViewDS && curViewDS.isHeader && curViewDS.items.length === 1) {\n _this.addUiItem(index - 1);\n }\n }\n });\n };\n Virtualization.prototype.createUIItem = function (args) {\n var template = this.listViewInstance.createElement('div');\n var commonTemplate = '- \n *
- Favourite \n *
- Documents \n *
- Downloads \n *
' +\n ' ${' + this.listViewInstance.fields.text + '}
';\n template.innerHTML = this.listViewInstance.template || commonTemplate;\n var templateElements = template.getElementsByTagName('*');\n var groupTemplate = this.listViewInstance.createElement('div');\n if (this.listViewInstance.fields.groupBy) {\n groupTemplate.innerHTML = this.listViewInstance.groupTemplate || commonTemplate;\n }\n var groupTemplateElements = groupTemplate.getElementsByTagName('*');\n if (args.curData.isHeader) {\n this.headerData = args.curData;\n }\n this.templateData = args.curData.isHeader ? args.curData.items[0] :\n args.curData;\n args.item.innerHTML = '';\n args.item.context = { data: args.curData, nodes: { flatTemplateNodes: [], groupTemplateNodes: [] } };\n for (var i = 0; i < templateElements.length; i++) {\n this.compileTemplate(templateElements[i], args.item, false);\n }\n for (var i = 0; i < groupTemplateElements.length; i++) {\n this.compileTemplate(groupTemplateElements[i], args.item, true);\n }\n args.item.context.template = args.curData.isHeader ? template.firstElementChild :\n groupTemplate.firstElementChild;\n args.item.context.type = args.curData.isHeader ? 'flatList' : 'groupList';\n var element = args.curData.isHeader ? groupTemplate : template;\n args.item.insertBefore(element.firstElementChild, null);\n };\n Virtualization.prototype.compileTemplate = function (element, item, isHeader) {\n this.textProperty(element, item, isHeader);\n this.classProperty(element, item, isHeader);\n this.attributeProperty(element, item, isHeader);\n };\n Virtualization.prototype.onChange = function (newData, listElement) {\n listElement.context.data = newData;\n var groupTemplateNodes = listElement.context.nodes.groupTemplateNodes;\n var flatTemplateNodes = listElement.context.nodes.flatTemplateNodes;\n if (!isNullOrUndefined(newData.isHeader) && newData.isHeader && listElement.context.type === 'groupList') {\n var element = listElement.firstElementChild;\n detach(listElement.firstElementChild);\n listElement.insertBefore(listElement.context.template, null);\n listElement.context.template = element;\n listElement.context.type = 'flatList';\n groupTemplateNodes.forEach(function (node) { return node.onChange(newData); });\n }\n else if (!newData.isHeader && listElement.context.type === 'flatList') {\n var element = listElement.firstElementChild;\n detach(listElement.firstElementChild);\n listElement.insertBefore(listElement.context.template, null);\n listElement.context.template = element;\n listElement.context.type = 'groupList';\n flatTemplateNodes.forEach(function (node) { return node.onChange(newData); });\n }\n else if (!newData.isHeader) {\n flatTemplateNodes.forEach(function (node) { return node.onChange(newData); });\n }\n else {\n groupTemplateNodes.forEach(function (node) { return node.onChange(newData); });\n }\n };\n Virtualization.prototype.updateContextData = function (listElement, node, isHeader) {\n if (isHeader) {\n listElement.context.nodes.groupTemplateNodes.push(node);\n }\n else {\n listElement.context.nodes.flatTemplateNodes.push(node);\n }\n };\n Virtualization.prototype.classProperty = function (element, listElement, isHeader) {\n var _this = this;\n var regex = new RegExp('\\\\${([^}]*)}', 'g');\n var resultantOutput = [];\n var regexMatch;\n while (regexMatch !== null) {\n var match = regex.exec(element.className);\n resultantOutput.push(match);\n regexMatch = match;\n if (regexMatch === null) {\n resultantOutput.pop();\n }\n }\n if (resultantOutput && resultantOutput.length) {\n resultantOutput.forEach(function (classNameMatch) {\n var classFunction;\n if (classNameMatch[1].indexOf('?') !== -1 && classNameMatch[1].indexOf(':') !== -1) {\n // tslint:disable-next-line:no-function-constructor-with-string-args\n classFunction = new Function('data', 'return ' + classNameMatch[1].replace(/\\$/g, 'data.'));\n }\n else {\n // tslint:disable-next-line:no-function-constructor-with-string-args\n classFunction = new Function('data', 'return ' + 'data.' + classNameMatch[1]);\n }\n var subNode = {};\n if (isHeader) {\n subNode.bindedvalue = classFunction(_this.headerData);\n }\n else {\n subNode.bindedvalue = classFunction(_this.templateData);\n }\n subNode.onChange = function (value) {\n if (subNode.bindedvalue) {\n removeClass([element], subNode.bindedvalue.split(' ').filter(function (css) { return css; }));\n }\n var newCss = classFunction(value);\n if (newCss) {\n addClass([element], (newCss).split(' ').filter(function (css) { return css; }));\n }\n subNode.bindedvalue = newCss;\n };\n classNameMatch[0].split(' ').forEach(function (className) {\n element.classList.remove(className);\n });\n if (subNode.bindedvalue) {\n addClass([element], subNode.bindedvalue.split(' ').filter(function (css) { return css; }));\n }\n _this.updateContextData(listElement, subNode, isHeader);\n });\n }\n };\n Virtualization.prototype.attributeProperty = function (element, listElement, isHeader) {\n var _this = this;\n var attributeNames = [];\n for (var i = 0; i < element.attributes.length; i++) {\n attributeNames.push(element.attributes[i].nodeName);\n }\n if (attributeNames.indexOf('class') !== -1) {\n attributeNames.splice(attributeNames.indexOf('class'), 1);\n }\n attributeNames.forEach(function (attributeName) {\n var attrNameMatch = new RegExp('\\\\${([^}]*)}', 'g').exec(attributeName) || [];\n var attrValueMatch = new RegExp('\\\\${([^}]*)}', 'g').exec(element.getAttribute(attributeName))\n || [];\n var attributeNameFunction;\n var attributeValueFunction;\n if (attrNameMatch.length || attrValueMatch.length) {\n if (attrNameMatch[1]) {\n // tslint:disable-next-line:no-function-constructor-with-string-args\n attributeNameFunction = new Function('data', 'return ' + 'data.' + attrNameMatch[1]);\n }\n if (attrValueMatch[1]) {\n if (attrValueMatch[1].indexOf('?') !== -1 && attrValueMatch[1].indexOf(':') !== -1) {\n // tslint:disable-next-line:no-function-constructor-with-string-args\n attributeValueFunction = new Function('data', 'return ' + attrValueMatch[1].replace(/\\$/g, 'data.'));\n }\n else {\n // tslint:disable-next-line:no-function-constructor-with-string-args\n attributeValueFunction = new Function('data', 'return ' + 'data.' + attrValueMatch[1]);\n }\n }\n var subNode_1 = {};\n if (isHeader) {\n subNode_1.bindedvalue = [attrNameMatch[1] === undefined ? undefined : attributeNameFunction(_this.headerData),\n attrValueMatch[1] === undefined ? undefined : attributeValueFunction(_this.headerData)];\n }\n else {\n subNode_1.bindedvalue = [attrNameMatch[1] === undefined ? undefined : attributeNameFunction(_this.templateData),\n attrValueMatch[1] === undefined ? undefined : attributeValueFunction(_this.templateData)];\n }\n subNode_1.attrName = subNode_1.bindedvalue[0] === undefined ?\n attributeName : subNode_1.bindedvalue[0];\n subNode_1.onChange = function (value) {\n var bindedvalue = subNode_1.bindedvalue[1] === undefined ?\n element.getAttribute(subNode_1.attrName) : attributeValueFunction(value);\n element.removeAttribute(subNode_1.attrName);\n subNode_1.attrName = subNode_1.bindedvalue[0] === undefined ? subNode_1.attrName : attributeNameFunction(value);\n element.setAttribute(subNode_1.attrName, bindedvalue);\n subNode_1.bindedvalue = [subNode_1.bindedvalue[0] === undefined ? undefined : attributeNameFunction(value),\n subNode_1.bindedvalue[1] === undefined ? undefined : attributeValueFunction(value)];\n };\n var attributeValue = subNode_1.bindedvalue[1] === undefined ? element.getAttribute(attributeName) :\n subNode_1.bindedvalue[1];\n element.removeAttribute(attributeName);\n element.setAttribute(subNode_1.attrName, attributeValue);\n _this.updateContextData(listElement, subNode_1, isHeader);\n }\n });\n };\n Virtualization.prototype.textProperty = function (element, listElement, isHeader) {\n var _this = this;\n var regex = new RegExp('\\\\${([^}]*)}', 'g');\n var resultantOutput = [];\n var regexMatch;\n while (regexMatch !== null) {\n var match = regex.exec(element.innerText);\n resultantOutput.push(match);\n regexMatch = match;\n if (regexMatch === null) {\n resultantOutput.pop();\n }\n }\n var isChildHasTextContent = Array.prototype.some.call(element.children, function (element) {\n if (new RegExp('\\\\${([^}]*)}', 'g').exec(element.innerText)) {\n return true;\n }\n else {\n return false;\n }\n });\n if (resultantOutput && resultantOutput.length && !isChildHasTextContent) {\n resultantOutput.forEach(function (textPropertyMatch) {\n var subNode = {};\n var textFunction;\n if (textPropertyMatch[1].indexOf('?') !== -1 && textPropertyMatch[1].indexOf(':') !== -1) {\n // tslint:disable-next-line:no-function-constructor-with-string-args\n textFunction = new Function('data', 'return ' + textPropertyMatch[1].replace(/\\$/g, 'data.'));\n }\n else {\n // tslint:disable-next-line:no-function-constructor-with-string-args\n textFunction = new Function('data', 'return ' + 'data.' + textPropertyMatch[1]);\n }\n if (isHeader) {\n subNode.bindedvalue = textFunction(_this.headerData);\n }\n else {\n subNode.bindedvalue = textFunction(_this.templateData);\n }\n subNode.onChange = function (value) {\n element.innerText = element.innerText.replace(subNode.bindedvalue, textFunction(value));\n subNode.bindedvalue = textFunction(value);\n };\n element.innerText = element.innerText.replace(textPropertyMatch[0], subNode.bindedvalue);\n _this.updateContextData(listElement, subNode, isHeader);\n });\n }\n };\n Virtualization.prototype.reRenderUiVirtualization = function () {\n this.wireScrollEvent(true);\n if (this.listViewInstance.contentContainer) {\n detach(this.listViewInstance.contentContainer);\n }\n this.listViewInstance.preRender();\n this.listViewInstance.localData = this.listViewInstance.dataSource;\n this.listViewInstance.renderList();\n };\n Virtualization.prototype.updateUI = function (element, index, targetElement) {\n var onChange = this.isNgTemplate() ? this.onNgChange : this.onChange;\n if (this.listViewInstance.template || this.listViewInstance.groupTemplate) {\n var curViewDS = this.listViewInstance.curViewDS[index];\n element.dataset.uid = curViewDS[this.listViewInstance.fields.id] ?\n curViewDS[this.listViewInstance.fields.id].toString() : ListBase.generateId();\n onChange(curViewDS, element);\n }\n else {\n this.updateUiContent(element, index);\n }\n this.changeElementAttributes(element, index);\n if (targetElement) {\n this.listViewInstance.ulElement.insertBefore(element, targetElement);\n }\n };\n Virtualization.prototype.onNgChange = function (newData, listElement) {\n listElement.context.$implicit = newData;\n };\n Virtualization.prototype.getModuleName = function () {\n return 'virtualization';\n };\n Virtualization.prototype.destroy = function () {\n this.wireScrollEvent(true);\n };\n return Virtualization;\n}());\nexport { Virtualization };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n/// \n * \n * ```\n * @private\n */\nvar Tooltip = /** @class */ (function (_super) {\n __extends(Tooltip, _super);\n /**\n * Constructor for creating the widget\n * @hidden\n */\n function Tooltip(options, element) {\n return _super.call(this, options, element) || this;\n }\n /**\n * Initialize the event handler.\n * @private.\n */\n Tooltip.prototype.preRender = function () {\n this.initPrivateVariable();\n this.removeSVG();\n this.createTooltipElement();\n };\n Tooltip.prototype.initPrivateVariable = function () {\n this.renderer = new SvgRenderer(this.element.id);\n this.themeStyle = getTooltipThemeColor(this.theme);\n this.formattedText = [];\n this.padding = 5;\n this.isFirst = true;\n this.markerPoint = [];\n };\n Tooltip.prototype.removeSVG = function () {\n var svgObject = document.getElementById(this.element.id + '_svg');\n var templateObject = document.getElementById(this.element.id + 'parent_template');\n if (svgObject && svgObject.parentNode) {\n remove(svgObject);\n }\n if (templateObject && templateObject.parentNode) {\n remove(templateObject);\n }\n };\n /**\n * To Initialize the control rendering.\n */\n Tooltip.prototype.render = function () {\n this.fadeOuted = false;\n if (!this.template) {\n this.renderText(this.isFirst);\n var argsData = {\n cancel: false, name: 'tooltipRender', tooltip: this\n };\n this.trigger('tooltipRender', argsData);\n var markerSide = this.renderTooltipElement(this.areaBounds, this.location);\n this.drawMarker(markerSide.isBottom, markerSide.isRight, this.markerSize);\n }\n else {\n this.updateTemplateFn();\n this.createTemplate(this.areaBounds, this.location);\n }\n this.trigger('loaded', { tooltip: this });\n var element = document.getElementById('chartmeasuretext');\n if (element) {\n remove(element);\n }\n };\n Tooltip.prototype.createTooltipElement = function () {\n this.textElements = [];\n if (!this.template || this.shared) {\n // SVG element for tooltip\n var svgObject = this.renderer.createSvg({ id: this.element.id + '_svg' });\n this.element.appendChild(svgObject);\n // Group to hold text and path.\n var groupElement = this.renderer.createGroup({ id: this.element.id + '_group' });\n svgObject.appendChild(groupElement);\n var pathElement = this.renderer.drawPath({\n 'id': this.element.id + '_path', 'stroke-width': this.theme === 'Bootstrap4' ? 0 : this.border.width,\n 'fill': this.fill || this.themeStyle.tooltipFill, 'opacity': this.theme === 'Bootstrap4' ? 0.9 : this.opacity,\n 'stroke': this.border.color\n });\n groupElement.appendChild(pathElement);\n }\n };\n Tooltip.prototype.drawMarker = function (isBottom, isRight, size) {\n if (this.shapes.length <= 0) {\n return null;\n }\n var shapeOption;\n var count = 0;\n var markerGroup = this.renderer.createGroup({ id: this.element.id + '_trackball_group' });\n var groupElement = getElement(this.element.id + '_group');\n var x = (this.marginX * 2) + (size / 2) + (isRight ? this.arrowPadding : 0);\n for (var _i = 0, _a = this.shapes; _i < _a.length; _i++) {\n var shape = _a[_i];\n shapeOption = new PathOption(this.element.id + '_Trackball_' + count, this.palette[count], 1, '#cccccc', 1, null);\n if (this.markerPoint[count]) {\n markerGroup.appendChild(drawSymbol(new TooltipLocation(x, this.markerPoint[count] - this.padding + (isBottom ? this.arrowPadding : 0)), shape, new Size(size, size), '', shapeOption, null));\n }\n count++;\n }\n groupElement.appendChild(markerGroup);\n };\n Tooltip.prototype.renderTooltipElement = function (areaBounds, location) {\n var tooltipDiv = getElement(this.element.id);\n var arrowLocation = new TooltipLocation(0, 0);\n var tipLocation = new TooltipLocation(0, 0);\n var textHeights;\n var svgObject = getElement(this.element.id + '_svg');\n var groupElement = getElement(this.element.id + '_group');\n var pathElement = getElement(this.element.id + '_path');\n var rect;\n var isTop = false;\n var isLeft = false;\n var isBottom = false;\n var x = 0;\n var y = 0;\n this.tipRadius = 1;\n if (this.header !== '') {\n this.elementSize.height += this.marginY;\n }\n if (this.content.length > 1) {\n rect = this.sharedTooltipLocation(areaBounds, this.location.x, this.location.y);\n isTop = true;\n }\n else {\n rect = this.tooltipLocation(areaBounds, location, arrowLocation, tipLocation);\n if (!this.inverted) {\n isTop = (rect.y < (location.y + this.clipBounds.y));\n isBottom = !isTop;\n y = (isTop ? 0 : this.arrowPadding);\n }\n else {\n isLeft = (rect.x < (location.x + this.clipBounds.x));\n x = (isLeft ? 0 : this.arrowPadding);\n }\n }\n if (this.header !== '') {\n var headerSize = measureText(this.header, this.textStyle).height + (this.marginY * 2) +\n (isBottom ? this.arrowPadding : 0); //header padding;\n var xLength = (this.marginX * 3) + (!isLeft && !isTop && !isBottom ? this.arrowPadding : 0);\n var direction = 'M ' + xLength + ' ' + headerSize +\n 'L ' + (rect.width + (!isLeft && !isTop && !isBottom ? this.arrowPadding : 0) - (this.marginX * 2)) +\n ' ' + headerSize;\n var pathElement_1 = this.renderer.drawPath({\n 'id': this.element.id + '_header_path', 'stroke-width': 1,\n 'fill': null, 'opacity': 0.8, 'stroke': this.themeStyle.tooltipHeaderLine, 'd': direction\n });\n groupElement.appendChild(pathElement_1);\n }\n var start = this.border.width / 2;\n var pointRect = new Rect(start + x, start + y, rect.width - start, rect.height - start);\n groupElement.setAttribute('opacity', '1');\n if (this.enableAnimation && !this.shared && !this.isFirst) {\n this.animateTooltipDiv(tooltipDiv, rect);\n }\n else {\n this.updateDiv(tooltipDiv, rect.x, rect.y);\n }\n svgObject.setAttribute('height', (rect.height + this.border.width + (!((!this.inverted)) ? 0 : this.arrowPadding)).toString());\n svgObject.setAttribute('width', (rect.width + this.border.width + (((!this.inverted)) ? 0 : this.arrowPadding)).toString());\n svgObject.setAttribute('opacity', '1');\n pathElement.setAttribute('d', findDirection(this.rx, this.ry, pointRect, arrowLocation, this.arrowPadding, isTop, isBottom, isLeft, tipLocation.x, tipLocation.y, this.tipRadius));\n if (this.enableShadow && this.theme !== 'Bootstrap4') {\n // To fix next chart initial tooltip opacity issue in tab control\n var shadowId = this.element.id + '_shadow';\n pathElement.setAttribute('filter', Browser.isIE ? '' : 'url(#' + shadowId + ')');\n var shadow = '';\n shadow += '';\n shadow += ' /g);\n if (textCollection[0] === '') {\n continue;\n }\n size = measureText(this.formattedText[k], font);\n if ((k !== 0) || (headerContent === '')) {\n this.markerPoint.push((headerContent !== '' ? (this.marginY) : 0) + options.y + height);\n }\n for (var i = 0, len = textCollection.length; i < len; i++) { // string value of unicode for LTR is \\u200E\n lines = textCollection[i].replace(//g, '
').replace(/<\\/b>/g, '
').replace(/:/g, '
\\u200E:
')\n .split('
');\n subWidth = 0;\n isColumn = true;\n height += dy;\n for (var k_1 = 0, len_1 = lines.length; k_1 < len_1; k_1++) {\n line = lines[k_1];\n if (!/\\S/.test(line) && line !== '') {\n line = ' '; //to trim multiple white spaces to single white space\n }\n if ((!isColumn && line === ' ') || (line.replace(//g, '').replace(/<\\/b>/g, '').trim() !== '')) {\n subWidth += line !== ' ' ? spaceWidth : 0;\n if (isColumn && !isRow) {\n tspanOption = { x: (this.marginX * 2) + (markerSize + markerPadding),\n dy: dy + ((isColumn) ? headerSpace : 0), fill: '' };\n headerSpace = null;\n }\n else {\n if (isRow && isColumn) {\n tspanOption = { x: (headerContent === '') ? ((this.marginX * 2) + (markerSize + markerPadding))\n : (this.marginX * 2) };\n }\n else {\n tspanOption = {};\n }\n }\n isColumn = false;\n tspanElement = this.renderer.createTSpan(tspanOption, '');\n parentElement.appendChild(tspanElement);\n if (line.indexOf('') > -1) {\n fontWeight = 'bold';\n labelColor = this.themeStyle.tooltipBoldLabel;\n tspanStyle = 'font-weight:' + fontWeight;\n font.fontWeight = fontWeight;\n (tspanElement).setAttribute('fill', this.textStyle.color || labelColor);\n }\n else {\n tspanStyle = fontWeight === 'bold' ? 'font-weight:' + fontWeight : '';\n font.fontWeight = fontWeight;\n (tspanElement).setAttribute('fill', this.textStyle.color || labelColor);\n }\n if (line.indexOf('') > -1) {\n fontWeight = 'Normal';\n labelColor = this.themeStyle.tooltipLightLabel;\n }\n (tspanElement).textContent = line = line.replace(/<[a-zA-Z\\/](.|\\n)*?>/g, '');\n subWidth += measureText(line, font).width;\n if (tspanStyle !== '') {\n tspanElement.setAttribute('style', tspanStyle);\n }\n isRow = false;\n }\n }\n subWidth -= spaceWidth;\n width = Math.max(width, subWidth);\n }\n }\n this.elementSize = new Size(width + (width > 0 ? (2 * this.marginX) : 0), height);\n this.elementSize.width += (markerSize + markerPadding); // marker size + marker Spacing\n var element = (parentElement.childNodes[0]);\n if (headerContent !== '' && element) {\n font.fontWeight = 'bold';\n var width_1 = (this.elementSize.width + (2 * this.padding)) / 2 - measureText(headerContent, font).width / 2;\n element.setAttribute('x', width_1.toString());\n }\n };\n Tooltip.prototype.createTemplate = function (areaBounds, location) {\n var argsData = { cancel: false, name: 'tooltipRender', tooltip: this };\n this.trigger('tooltipRender', argsData);\n var parent = document.getElementById(this.element.id);\n var firstElement = parent.firstElementChild;\n if (firstElement) {\n remove(firstElement);\n }\n if (!argsData.cancel) {\n var templateElement = this.templateFn(this.data);\n var elem = createElement('div', { id: this.element.id + 'parent_template' });\n while (templateElement && templateElement.length > 0) {\n elem.appendChild(templateElement[0]);\n }\n parent.appendChild(elem);\n var rect = this.element.getBoundingClientRect();\n this.padding = 0;\n this.elementSize = new Size(rect.width, rect.height);\n var tooltipRect = this.tooltipLocation(areaBounds, location, new TooltipLocation(0, 0), new TooltipLocation(0, 0));\n if (this.enableAnimation && !this.shared && !this.isFirst) {\n this.animateTooltipDiv(this.element, tooltipRect);\n }\n else {\n this.updateDiv(this.element, tooltipRect.x, tooltipRect.y);\n }\n }\n else {\n remove(getElement(this.element.id + '_tooltip'));\n }\n };\n Tooltip.prototype.sharedTooltipLocation = function (bounds, x, y) {\n var width = this.elementSize.width + (2 * this.marginX);\n var height = this.elementSize.height + (2 * this.marginY);\n var tooltipRect = new Rect(x + 2 * this.padding, y - height - this.padding, width, height);\n if (tooltipRect.y < bounds.y) {\n tooltipRect.y += (tooltipRect.height + 2 * this.padding);\n }\n if (tooltipRect.x + tooltipRect.width > bounds.x + bounds.width) {\n tooltipRect.x -= (tooltipRect.width + 4 * this.padding);\n }\n return tooltipRect;\n };\n Tooltip.prototype.tooltipLocation = function (bounds, symbolLocation, arrowLocation, tipLocation) {\n var location = new TooltipLocation(symbolLocation.x, symbolLocation.y);\n var width = this.elementSize.width + (2 * this.marginX);\n var height = this.elementSize.height + (2 * this.marginY);\n var markerHeight = this.offset;\n var clipX = this.clipBounds.x;\n var clipY = this.clipBounds.y;\n var boundsX = bounds.x;\n var boundsY = bounds.y;\n if (!this.inverted) {\n location = new TooltipLocation(location.x + clipX - this.elementSize.width / 2 - this.padding, location.y + clipY - this.elementSize.height - (2 * this.padding) - this.arrowPadding - markerHeight);\n arrowLocation.x = tipLocation.x = width / 2;\n if (location.y < boundsY || (this.isNegative)) {\n location.y = (symbolLocation.y < 0 ? 0 : symbolLocation.y) + clipY + markerHeight;\n }\n if (location.y + height + this.arrowPadding > boundsY + bounds.height) {\n location.y = (symbolLocation.y > bounds.height ? bounds.height : symbolLocation.y)\n + clipY - this.elementSize.height - (2 * this.padding) - this.arrowPadding - markerHeight;\n }\n tipLocation.x = width / 2;\n if (location.x < boundsX) {\n arrowLocation.x -= (boundsX - location.x);\n tipLocation.x -= (boundsX - location.x);\n location.x = boundsX;\n }\n if (location.x + width > boundsX + bounds.width) {\n arrowLocation.x += ((location.x + width) - (boundsX + bounds.width));\n tipLocation.x += ((location.x + width) - (boundsX + bounds.width));\n location.x -= ((location.x + width) - (boundsX + bounds.width));\n }\n if (arrowLocation.x + this.arrowPadding / 2 > width - this.rx) {\n arrowLocation.x = width - this.rx - this.arrowPadding / 2;\n tipLocation.x = width;\n this.tipRadius = 0;\n }\n if (arrowLocation.x - this.arrowPadding / 2 < this.rx) {\n arrowLocation.x = this.rx + this.arrowPadding / 2;\n tipLocation.x = 0;\n this.tipRadius = 0;\n }\n }\n else {\n location = new TooltipLocation(location.x + clipX + markerHeight, location.y + clipY - this.elementSize.height / 2 - (this.padding));\n arrowLocation.y = tipLocation.y = height / 2;\n if ((location.x + width + this.arrowPadding > boundsX + bounds.width) || (this.isNegative)) {\n location.x = (symbolLocation.x > bounds.width ? bounds.width : symbolLocation.x)\n + clipX - markerHeight - (width + this.arrowPadding);\n }\n if (location.x < boundsX) {\n location.x = (symbolLocation.x < 0 ? 0 : symbolLocation.x) + clipX + markerHeight;\n }\n if (location.y <= boundsY) {\n arrowLocation.y -= (boundsY - location.y);\n tipLocation.y -= (boundsY - location.y);\n location.y = boundsY;\n }\n if (location.y + height >= boundsY + bounds.height) {\n arrowLocation.y += ((location.y + height) - (boundsY + bounds.height));\n tipLocation.y += ((location.y + height) - (boundsY + bounds.height));\n location.y -= ((location.y + height) - (boundsY + bounds.height));\n }\n if (arrowLocation.y + this.arrowPadding / 2 > height - this.ry) {\n arrowLocation.y = height - this.ry - this.arrowPadding / 2;\n tipLocation.y = height;\n this.tipRadius = 0;\n }\n if (arrowLocation.y - this.arrowPadding / 2 < this.ry) {\n arrowLocation.y = this.ry + this.arrowPadding / 2;\n tipLocation.y = 0;\n this.tipRadius = 0;\n }\n }\n return new Rect(location.x, location.y, width, height);\n };\n Tooltip.prototype.animateTooltipDiv = function (tooltipDiv, rect) {\n var _this = this;\n var x = parseFloat(tooltipDiv.style.left);\n var y = parseFloat(tooltipDiv.style.top);\n var currenDiff;\n new Animation({}).animate(tooltipDiv, {\n duration: 300,\n progress: function (args) {\n currenDiff = (args.timeStamp / args.duration);\n tooltipDiv.style.animation = null;\n tooltipDiv.style.left = (x + currenDiff * (rect.x - x)) + 'px';\n tooltipDiv.style.top = (y + currenDiff * (rect.y - y)) + 'px';\n },\n end: function (model) {\n _this.updateDiv(tooltipDiv, rect.x, rect.y);\n _this.trigger('animationComplete', { tooltip: _this });\n }\n });\n };\n Tooltip.prototype.updateDiv = function (tooltipDiv, x, y) {\n tooltipDiv.style.left = x + 'px';\n tooltipDiv.style.top = y + 'px';\n };\n Tooltip.prototype.updateTemplateFn = function () {\n if (this.template) {\n var e = void 0;\n try {\n if (document.querySelectorAll(this.template).length) {\n this.templateFn = templateComplier(document.querySelector(this.template).innerHTML.trim());\n }\n }\n catch (e) {\n this.templateFn = templateComplier(this.template);\n }\n }\n };\n /** @private */\n Tooltip.prototype.fadeOut = function () {\n var _this = this;\n var tooltipElement = getElement(this.element.id);\n if (tooltipElement) {\n var tooltipGroup_1 = tooltipElement.firstChild;\n var opacity_1 = parseFloat(tooltipGroup_1.getAttribute('opacity')) || 1;\n new Animation({}).animate(tooltipGroup_1, {\n duration: 200,\n progress: function (args) {\n // tooltipGroup.removeAttribute('e-animate');\n _this.progressAnimation(tooltipGroup_1, opacity_1, (args.timeStamp / args.duration));\n },\n end: function (model) {\n _this.fadeOuted = true;\n _this.endAnimation(tooltipGroup_1);\n }\n });\n }\n };\n Tooltip.prototype.progressAnimation = function (tooltipGroup, opacity, timeStamp) {\n tooltipGroup.style.animation = '';\n tooltipGroup.setAttribute('opacity', (opacity - timeStamp).toString());\n };\n /*\n * @hidden\n */\n Tooltip.prototype.endAnimation = function (tooltipGroup) {\n tooltipGroup.setAttribute('opacity', '0');\n if (this.template && !this.shared) {\n tooltipGroup.style.display = 'none';\n }\n this.trigger('animationComplete', { tooltip: this });\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @private\n */\n Tooltip.prototype.getPersistData = function () {\n var keyEntity = [];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Get component name\n * @private\n */\n Tooltip.prototype.getModuleName = function () {\n return 'tooltip';\n };\n /**\n * To destroy the accumulationcharts\n * @private\n */\n Tooltip.prototype.destroy = function () {\n _super.prototype.destroy.call(this);\n this.element.classList.remove('e-tooltip');\n };\n /**\n * Called internally if any of the property value changed.\n * @return {void}\n * @private\n */\n Tooltip.prototype.onPropertyChanged = function (newProp, oldProp) {\n this.isFirst = false;\n this.render();\n };\n __decorate([\n Property(false)\n ], Tooltip.prototype, \"enable\", void 0);\n __decorate([\n Property(false)\n ], Tooltip.prototype, \"shared\", void 0);\n __decorate([\n Property(true)\n ], Tooltip.prototype, \"enableShadow\", void 0);\n __decorate([\n Property(null)\n ], Tooltip.prototype, \"fill\", void 0);\n __decorate([\n Property('')\n ], Tooltip.prototype, \"header\", void 0);\n __decorate([\n Property(0.75)\n ], Tooltip.prototype, \"opacity\", void 0);\n __decorate([\n Complex({ size: '13px', fontWeight: 'Normal', color: null, fontStyle: 'Normal', fontFamily: 'Segoe UI' }, TextStyle)\n ], Tooltip.prototype, \"textStyle\", void 0);\n __decorate([\n Property(null)\n ], Tooltip.prototype, \"template\", void 0);\n __decorate([\n Property(true)\n ], Tooltip.prototype, \"enableAnimation\", void 0);\n __decorate([\n Property(false)\n ], Tooltip.prototype, \"inverted\", void 0);\n __decorate([\n Property(false)\n ], Tooltip.prototype, \"isNegative\", void 0);\n __decorate([\n Complex({ color: '#cccccc', width: 0.5 }, TooltipBorder)\n ], Tooltip.prototype, \"border\", void 0);\n __decorate([\n Property([])\n ], Tooltip.prototype, \"content\", void 0);\n __decorate([\n Property(10)\n ], Tooltip.prototype, \"markerSize\", void 0);\n __decorate([\n Complex({ x: 0, y: 0 }, ToolLocation)\n ], Tooltip.prototype, \"clipBounds\", void 0);\n __decorate([\n Property([])\n ], Tooltip.prototype, \"palette\", void 0);\n __decorate([\n Property([])\n ], Tooltip.prototype, \"shapes\", void 0);\n __decorate([\n Complex({ x: 0, y: 0 }, ToolLocation)\n ], Tooltip.prototype, \"location\", void 0);\n __decorate([\n Property(0)\n ], Tooltip.prototype, \"offset\", void 0);\n __decorate([\n Property(2)\n ], Tooltip.prototype, \"rx\", void 0);\n __decorate([\n Property(2)\n ], Tooltip.prototype, \"ry\", void 0);\n __decorate([\n Property(5)\n ], Tooltip.prototype, \"marginX\", void 0);\n __decorate([\n Property(5)\n ], Tooltip.prototype, \"marginY\", void 0);\n __decorate([\n Property(12)\n ], Tooltip.prototype, \"arrowPadding\", void 0);\n __decorate([\n Property(null)\n ], Tooltip.prototype, \"data\", void 0);\n __decorate([\n Property('Material')\n ], Tooltip.prototype, \"theme\", void 0);\n __decorate([\n Complex({ x: 0, y: 0, width: 0, height: 0 }, AreaBounds)\n ], Tooltip.prototype, \"areaBounds\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"tooltipRender\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"loaded\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"animationComplete\", void 0);\n Tooltip = __decorate([\n NotifyPropertyChanges\n ], Tooltip);\n return Tooltip;\n}(Component));\nexport { Tooltip };\n","/**\n * Numeric Range.\n * @private\n */\nvar DoubleRange = /** @class */ (function () {\n function DoubleRange(start, end) {\n /*\n if (!isNaN(start) && !isNaN(end)) {\n this.mIsEmpty = true;\n } else {\n this.mIsEmpty = false;\n }*/\n if (start < end) {\n this.mStart = start;\n this.mEnd = end;\n }\n else {\n this.mStart = end;\n this.mEnd = start;\n }\n }\n Object.defineProperty(DoubleRange.prototype, \"start\", {\n //private mIsEmpty: boolean;\n /** @private */\n get: function () {\n return this.mStart;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(DoubleRange.prototype, \"end\", {\n /** @private */\n get: function () {\n return this.mEnd;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(DoubleRange.prototype, \"delta\", {\n /*\n get isEmpty(): boolean {\n return this.mIsEmpty;\n }*/\n /** @private */\n get: function () {\n return (this.mEnd - this.mStart);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(DoubleRange.prototype, \"median\", {\n /** @private */\n get: function () {\n return this.mStart + (this.mEnd - this.mStart) / 2;\n },\n enumerable: true,\n configurable: true\n });\n return DoubleRange;\n}());\nexport { DoubleRange };\n","import { getMinPointsDelta, getActualDesiredIntervalsCount, setRange, triggerLabelRender } from '../../common/utils/helper';\nimport { DoubleRange } from '../utils/double-range';\nimport { withIn, logBase } from '../../common/utils/helper';\nimport { isNullOrUndefined, extend, getValue } from '@syncfusion/ej2-base';\n/**\n * Numeric module is used to render numeric axis.\n */\nvar Double = /** @class */ (function () {\n /**\n * Constructor for the dateTime module.\n * @private\n */\n function Double(chart) {\n this.chart = chart;\n }\n /**\n * Numeric Nice Interval for the axis.\n * @private\n */\n Double.prototype.calculateNumericNiceInterval = function (axis, delta, size) {\n var actualDesiredIntervalsCount = getActualDesiredIntervalsCount(size, axis);\n var niceInterval = delta / actualDesiredIntervalsCount;\n if (!isNullOrUndefined(axis.desiredIntervals)) {\n return niceInterval;\n }\n var minInterval = Math.pow(10, Math.floor(logBase(niceInterval, 10)));\n for (var _i = 0, _a = axis.intervalDivs; _i < _a.length; _i++) {\n var interval = _a[_i];\n var currentInterval = minInterval * interval;\n if (actualDesiredIntervalsCount < (delta / currentInterval)) {\n break;\n }\n niceInterval = currentInterval;\n }\n return niceInterval;\n };\n /**\n * Actual Range for the axis.\n * @private\n */\n Double.prototype.getActualRange = function (axis, size) {\n this.initializeDoubleRange(axis);\n axis.actualRange.interval = axis.interval || this.calculateNumericNiceInterval(axis, axis.doubleRange.delta, size);\n axis.actualRange.min = axis.doubleRange.start;\n axis.actualRange.max = axis.doubleRange.end;\n };\n /**\n * Range for the axis.\n * @private\n */\n Double.prototype.initializeDoubleRange = function (axis) {\n //Axis Min\n if (axis.minimum !== null) {\n this.min = axis.minimum;\n }\n else if (this.min === null || this.min === Number.POSITIVE_INFINITY) {\n this.min = 0;\n }\n // Axis Max\n if (axis.maximum !== null) {\n this.max = axis.maximum;\n }\n else if (this.max === null || this.max === Number.NEGATIVE_INFINITY) {\n this.max = 5;\n }\n if (this.min === this.max) {\n this.max = axis.valueType.indexOf('Category') > -1 ? this.max : this.min + 1;\n }\n axis.doubleRange = new DoubleRange(this.min, this.max);\n axis.actualRange = {};\n };\n /**\n * The function to calculate the range and labels for the axis.\n * @return {void}\n * @private\n */\n Double.prototype.calculateRangeAndInterval = function (size, axis) {\n this.calculateRange(axis, size);\n this.getActualRange(axis, size);\n this.applyRangePadding(axis, size);\n this.calculateVisibleLabels(axis, this.chart);\n };\n /**\n * Calculate Range for the axis.\n * @private\n */\n Double.prototype.calculateRange = function (axis, size) {\n /*! Generate axis range */\n var series;\n this.min = null;\n this.max = null;\n if (!setRange(axis)) {\n for (var _i = 0, _a = axis.series; _i < _a.length; _i++) {\n var series_1 = _a[_i];\n if (!series_1.visible) {\n continue;\n }\n this.paddingInterval = 0;\n axis.maxPointLength = series_1.points.length;\n if (((series_1.type.indexOf('Column') > -1 || series_1.type.indexOf('Histogram') > -1) && axis.orientation === 'Horizontal')\n || (series_1.type.indexOf('Bar') > -1 && axis.orientation === 'Vertical')) {\n if ((series_1.xAxis.valueType === 'Double' || series_1.xAxis.valueType === 'DateTime')\n && series_1.xAxis.rangePadding === 'Auto') {\n this.paddingInterval = getMinPointsDelta(series_1.xAxis, axis.series) / 2;\n }\n }\n //For xRange\n if (axis.orientation === 'Horizontal') {\n if (this.chart.requireInvertedAxis) {\n this.findMinMax(series_1.yMin, series_1.yMax);\n }\n else {\n this.findMinMax(series_1.xMin - this.paddingInterval, series_1.xMax + this.paddingInterval);\n }\n }\n // For yRange\n if (axis.orientation === 'Vertical') {\n if (this.chart.requireInvertedAxis) {\n this.findMinMax(series_1.xMin - this.paddingInterval, series_1.xMax + this.paddingInterval);\n }\n else {\n this.findMinMax(series_1.yMin, series_1.yMax);\n }\n }\n }\n }\n };\n Double.prototype.findMinMax = function (min, max) {\n if (this.min === null || this.min > min) {\n this.min = min;\n }\n if (this.max === null || this.max < max) {\n this.max = max;\n }\n };\n /**\n * Apply padding for the range.\n * @private\n */\n Double.prototype.applyRangePadding = function (axis, size) {\n var range;\n var start = axis.actualRange.min;\n var end = axis.actualRange.max;\n if (!setRange(axis)) {\n var interval = axis.actualRange.interval;\n var padding = axis.getRangePadding(this.chart);\n if (padding === 'Additional' || padding === 'Round') {\n this.findAdditional(axis, start, end, interval);\n }\n else if (padding === 'Normal') {\n this.findNormal(axis, start, end, interval, size);\n }\n else {\n this.updateActualRange(axis, start, end, interval);\n }\n }\n axis.actualRange.delta = axis.actualRange.max - axis.actualRange.min;\n this.calculateVisibleRange(size, axis);\n };\n Double.prototype.updateActualRange = function (axis, minimum, maximum, interval) {\n axis.actualRange.min = axis.minimum != null ? axis.minimum : minimum;\n axis.actualRange.max = axis.maximum != null ? axis.maximum : maximum;\n axis.actualRange.interval = axis.interval != null ? axis.interval : interval;\n };\n Double.prototype.findAdditional = function (axis, start, end, interval) {\n var minimum;\n var maximum;\n minimum = Math.floor(start / interval) * interval;\n maximum = Math.ceil(end / interval) * interval;\n if (axis.rangePadding === 'Additional') {\n minimum -= interval;\n maximum += interval;\n }\n this.updateActualRange(axis, minimum, maximum, interval);\n };\n Double.prototype.findNormal = function (axis, start, end, interval, size) {\n var remaining;\n var minimum;\n var maximum;\n var startValue = start;\n if (start < 0) {\n startValue = 0;\n minimum = start + (start / 20);\n remaining = interval + (minimum % interval);\n if ((0.365 * interval) >= remaining) {\n minimum -= interval;\n }\n if (minimum % interval < 0) {\n minimum = (minimum - interval) - (minimum % interval);\n }\n }\n else {\n minimum = start < ((5.0 / 6.0) * end) ? 0 : (start - (end - start) / 2);\n if (minimum % interval > 0) {\n minimum -= (minimum % interval);\n }\n }\n maximum = (end > 0) ? (end + (end - startValue) / 20) : (end - (end - startValue) / 20);\n remaining = interval - (maximum % interval);\n if ((0.365 * interval) >= remaining) {\n maximum += interval;\n }\n if (maximum % interval > 0) {\n maximum = (maximum + interval) - (maximum % interval);\n }\n axis.doubleRange = new DoubleRange(minimum, maximum);\n if (minimum === 0) {\n interval = this.calculateNumericNiceInterval(axis, axis.doubleRange.delta, size);\n maximum = Math.ceil(maximum / interval) * interval;\n }\n this.updateActualRange(axis, minimum, maximum, interval);\n };\n /**\n * Calculate visible range for axis.\n * @private\n */\n Double.prototype.calculateVisibleRange = function (size, axis) {\n axis.visibleRange = {\n max: axis.actualRange.max, min: axis.actualRange.min,\n delta: axis.actualRange.delta, interval: axis.actualRange.interval\n };\n var isLazyLoad = isNullOrUndefined(axis.zoomingScrollBar) ? false : axis.zoomingScrollBar.isLazyLoad;\n if ((axis.zoomFactor < 1 || axis.zoomPosition > 0) && !isLazyLoad) {\n axis.calculateVisibleRange(size);\n axis.visibleRange.interval = (axis.enableAutoIntervalOnZooming && axis.valueType !== 'Category') ?\n this.calculateNumericNiceInterval(axis, axis.doubleRange.delta, size)\n : axis.visibleRange.interval;\n }\n axis.triggerRangeRender(this.chart, axis.visibleRange.min, axis.visibleRange.max, axis.visibleRange.interval);\n };\n /**\n * Calculate label for the axis.\n * @private\n */\n Double.prototype.calculateVisibleLabels = function (axis, chart) {\n /*! Generate axis labels */\n axis.visibleLabels = [];\n var tempInterval = axis.visibleRange.min;\n var labelStyle;\n if (axis.zoomFactor < 1 || axis.zoomPosition > 0 || this.paddingInterval) {\n tempInterval = axis.visibleRange.min - (axis.visibleRange.min % axis.visibleRange.interval);\n }\n var format = this.getFormat(axis);\n var isCustom = format.match('{value}') !== null;\n var intervalDigits = 0;\n var formatDigits = 0;\n if (axis.labelFormat && axis.labelFormat.indexOf('n') > -1) {\n formatDigits = parseInt(axis.labelFormat.substring(1, axis.labelFormat.length), 10);\n }\n axis.format = chart.intl.getNumberFormat({\n format: isCustom ? '' : format,\n useGrouping: chart.useGroupingSeparator\n });\n axis.startLabel = axis.format(axis.visibleRange.min);\n axis.endLabel = axis.format(axis.visibleRange.max);\n if (axis.visibleRange.interval && (axis.visibleRange.interval + '').indexOf('.') >= 0) {\n intervalDigits = (axis.visibleRange.interval + '').split('.')[1].length;\n }\n labelStyle = (extend({}, getValue('properties', axis.labelStyle), null, true));\n for (; tempInterval <= axis.visibleRange.max; tempInterval += axis.visibleRange.interval) {\n if (withIn(tempInterval, axis.visibleRange)) {\n triggerLabelRender(chart, tempInterval, this.formatValue(axis, isCustom, format, tempInterval), labelStyle, axis);\n }\n }\n if (tempInterval && (tempInterval + '').indexOf('.') >= 0 && (tempInterval + '').split('.')[1].length > 10) {\n tempInterval = (tempInterval + '').split('.')[1].length > (formatDigits || intervalDigits) ?\n +tempInterval.toFixed(formatDigits || intervalDigits) : tempInterval;\n if (tempInterval <= axis.visibleRange.max) {\n triggerLabelRender(chart, tempInterval, this.formatValue(axis, isCustom, format, tempInterval), labelStyle, axis);\n }\n }\n if (axis.getMaxLabelWidth) {\n axis.getMaxLabelWidth(this.chart);\n }\n };\n /**\n * Format of the axis label.\n * @private\n */\n Double.prototype.getFormat = function (axis) {\n if (axis.labelFormat) {\n return axis.labelFormat;\n }\n return axis.isStack100 ? '{value}%' : '';\n };\n /**\n * Formatted the axis label.\n * @private\n */\n Double.prototype.formatValue = function (axis, isCustom, format, tempInterval) {\n return isCustom ? format.replace('{value}', axis.format(tempInterval))\n : axis.format(tempInterval);\n };\n return Double;\n}());\nexport { Double };\n","/**\n * Specifies the chart constant value\n */\n/** @private */\nexport var loaded = 'loaded';\n/** @private */\nexport var load = 'load';\n/** @private */\nexport var animationComplete = 'animationComplete';\n/** @private */\nexport var legendRender = 'legendRender';\n/** @private */\nexport var textRender = 'textRender';\n/** @private */\nexport var pointRender = 'pointRender';\n/** @private */\nexport var seriesRender = 'seriesRender';\n/** @private */\nexport var axisLabelRender = 'axisLabelRender';\n/** @private */\nexport var axisRangeCalculated = 'axisRangeCalculated';\n/** @private */\nexport var axisMultiLabelRender = 'axisMultiLabelRender';\n/** @private */\nexport var tooltipRender = 'tooltipRender';\n/** @private */\nexport var chartMouseMove = 'chartMouseMove';\n/** @private */\nexport var chartMouseClick = 'chartMouseClick';\n/** @private */\nexport var pointClick = 'pointClick';\n/** @private */\nexport var pointMove = 'pointMove';\n/** @private */\nexport var chartMouseLeave = 'chartMouseLeave';\n/** @private */\nexport var chartMouseDown = 'chartMouseDown';\n/** @private */\nexport var chartMouseUp = 'chartMouseUp';\n/** @private */\nexport var zoomComplete = 'zoomComplete';\n/** @private */\nexport var dragComplete = 'dragComplete';\n/** @private */\nexport var resized = 'resized';\n/** @private */\nexport var beforePrint = 'beforePrint';\n/** @private */\nexport var annotationRender = 'annotationRender';\n/** @private */\nexport var scrollStart = 'scrollStart';\n/** @private */\nexport var scrollEnd = 'scrollEnd';\n/** @private */\nexport var scrollChanged = 'scrollChanged';\n/** @private */\nexport var stockEventRender = 'stockEventRender';\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { ChildProperty, Property, Complex, Collection } from '@syncfusion/ej2-base';\nimport { Theme } from '../../common/model/theme';\nimport { Font, Border } from '../../common/model/base';\n/**\n * Configures the Annotation for chart.\n */\nvar ChartAnnotationSettings = /** @class */ (function (_super) {\n __extends(ChartAnnotationSettings, _super);\n function ChartAnnotationSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('0')\n ], ChartAnnotationSettings.prototype, \"x\", void 0);\n __decorate([\n Property('0')\n ], ChartAnnotationSettings.prototype, \"y\", void 0);\n __decorate([\n Property(null)\n ], ChartAnnotationSettings.prototype, \"content\", void 0);\n __decorate([\n Property('Center')\n ], ChartAnnotationSettings.prototype, \"horizontalAlignment\", void 0);\n __decorate([\n Property('Pixel')\n ], ChartAnnotationSettings.prototype, \"coordinateUnits\", void 0);\n __decorate([\n Property('Chart')\n ], ChartAnnotationSettings.prototype, \"region\", void 0);\n __decorate([\n Property('Middle')\n ], ChartAnnotationSettings.prototype, \"verticalAlignment\", void 0);\n __decorate([\n Property(null)\n ], ChartAnnotationSettings.prototype, \"xAxisName\", void 0);\n __decorate([\n Property(null)\n ], ChartAnnotationSettings.prototype, \"yAxisName\", void 0);\n __decorate([\n Property(null)\n ], ChartAnnotationSettings.prototype, \"description\", void 0);\n return ChartAnnotationSettings;\n}(ChildProperty));\nexport { ChartAnnotationSettings };\n/**\n * label border properties.\n */\nvar LabelBorder = /** @class */ (function (_super) {\n __extends(LabelBorder, _super);\n function LabelBorder() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], LabelBorder.prototype, \"color\", void 0);\n __decorate([\n Property(1)\n ], LabelBorder.prototype, \"width\", void 0);\n __decorate([\n Property('Rectangle')\n ], LabelBorder.prototype, \"type\", void 0);\n return LabelBorder;\n}(ChildProperty));\nexport { LabelBorder };\n/**\n * categories for multi level labels\n */\nvar MultiLevelCategories = /** @class */ (function (_super) {\n __extends(MultiLevelCategories, _super);\n function MultiLevelCategories() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], MultiLevelCategories.prototype, \"start\", void 0);\n __decorate([\n Property(null)\n ], MultiLevelCategories.prototype, \"end\", void 0);\n __decorate([\n Property('')\n ], MultiLevelCategories.prototype, \"text\", void 0);\n __decorate([\n Property(null)\n ], MultiLevelCategories.prototype, \"maximumTextWidth\", void 0);\n return MultiLevelCategories;\n}(ChildProperty));\nexport { MultiLevelCategories };\n/**\n * Strip line properties\n */\nvar StripLineSettings = /** @class */ (function (_super) {\n __extends(StripLineSettings, _super);\n function StripLineSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], StripLineSettings.prototype, \"visible\", void 0);\n __decorate([\n Property(false)\n ], StripLineSettings.prototype, \"startFromAxis\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"start\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"end\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"size\", void 0);\n __decorate([\n Property('#808080')\n ], StripLineSettings.prototype, \"color\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"dashArray\", void 0);\n __decorate([\n Property('Auto')\n ], StripLineSettings.prototype, \"sizeType\", void 0);\n __decorate([\n Property(false)\n ], StripLineSettings.prototype, \"isRepeat\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"repeatEvery\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"repeatUntil\", void 0);\n __decorate([\n Property(false)\n ], StripLineSettings.prototype, \"isSegmented\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"segmentStart\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"segmentEnd\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"segmentAxisName\", void 0);\n __decorate([\n Complex({ color: 'transparent', width: 1 }, Border)\n ], StripLineSettings.prototype, \"border\", void 0);\n __decorate([\n Property('')\n ], StripLineSettings.prototype, \"text\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"rotation\", void 0);\n __decorate([\n Property('Middle')\n ], StripLineSettings.prototype, \"horizontalAlignment\", void 0);\n __decorate([\n Property('Middle')\n ], StripLineSettings.prototype, \"verticalAlignment\", void 0);\n __decorate([\n Complex(Theme.stripLineLabelFont, Font)\n ], StripLineSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property('Behind')\n ], StripLineSettings.prototype, \"zIndex\", void 0);\n __decorate([\n Property(1)\n ], StripLineSettings.prototype, \"opacity\", void 0);\n return StripLineSettings;\n}(ChildProperty));\nexport { StripLineSettings };\n/**\n * MultiLevelLabels properties\n */\nvar MultiLevelLabels = /** @class */ (function (_super) {\n __extends(MultiLevelLabels, _super);\n function MultiLevelLabels() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Center')\n ], MultiLevelLabels.prototype, \"alignment\", void 0);\n __decorate([\n Property('Wrap')\n ], MultiLevelLabels.prototype, \"overflow\", void 0);\n __decorate([\n Complex(Theme.axisLabelFont, Font)\n ], MultiLevelLabels.prototype, \"textStyle\", void 0);\n __decorate([\n Complex({ color: null, width: 1, type: 'Rectangle' }, LabelBorder)\n ], MultiLevelLabels.prototype, \"border\", void 0);\n __decorate([\n Collection([], MultiLevelCategories)\n ], MultiLevelLabels.prototype, \"categories\", void 0);\n return MultiLevelLabels;\n}(ChildProperty));\nexport { MultiLevelLabels };\n/**\n * Specifies range for scrollbarSettings property\n */\nvar ScrollbarSettingsRange = /** @class */ (function (_super) {\n __extends(ScrollbarSettingsRange, _super);\n function ScrollbarSettingsRange() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], ScrollbarSettingsRange.prototype, \"minimum\", void 0);\n __decorate([\n Property(null)\n ], ScrollbarSettingsRange.prototype, \"maximum\", void 0);\n return ScrollbarSettingsRange;\n}(ChildProperty));\nexport { ScrollbarSettingsRange };\n/**\n * Scrollbar Settings Properties for Lazy Loading\n */\nvar ScrollbarSettings = /** @class */ (function (_super) {\n __extends(ScrollbarSettings, _super);\n function ScrollbarSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], ScrollbarSettings.prototype, \"enable\", void 0);\n __decorate([\n Property(null)\n ], ScrollbarSettings.prototype, \"pointsLength\", void 0);\n __decorate([\n Complex({}, ScrollbarSettingsRange)\n ], ScrollbarSettings.prototype, \"range\", void 0);\n return ScrollbarSettings;\n}(ChildProperty));\nexport { ScrollbarSettings };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, Complex, ChildProperty, Collection, extend } from '@syncfusion/ej2-base';\nimport { Font, Border } from '../../common/model/base';\nimport { rotateTextSize, firstToLowerCase, valueToCoefficient, inside } from '../../common/utils/helper';\nimport { Size, Rect, measureText } from '@syncfusion/ej2-svg-base';\nimport { DoubleRange } from '../utils/double-range';\nimport { Double } from '../axis/double-axis';\nimport { Theme } from '../../common/model/theme';\nimport { axisRangeCalculated } from '../../common/model/constants';\nimport { StripLineSettings, MultiLevelLabels, LabelBorder, ScrollbarSettings } from '../model/chart-base';\nimport { textWrap } from '../../common/utils/helper';\nvar axisPadding = 10;\n/**\n * Configures the `rows` of the chart.\n */\nvar Row = /** @class */ (function (_super) {\n __extends(Row, _super);\n function Row() {\n /**\n * The height of the row as a string accept input both as '100px' and '100%'.\n * If specified as '100%, row renders to the full height of its chart.\n * @default '100%'\n */\n var _this = _super !== null && _super.apply(this, arguments) || this;\n /** @private */\n _this.axes = [];\n /** @private */\n _this.nearSizes = [];\n /** @private */\n _this.farSizes = [];\n return _this;\n }\n /**\n * Measure the row size\n * @return {void}\n * @private\n */\n Row.prototype.computeSize = function (axis, clipRect, scrollBarHeight) {\n var width = 0;\n var innerPadding = 5;\n if (axis.visible) {\n width += (axis.findTickSize(axis.crossInAxis) + scrollBarHeight +\n axis.findLabelSize(axis.crossInAxis, innerPadding) + axis.lineStyle.width / 2);\n }\n if (axis.opposedPosition) {\n this.farSizes.push(width);\n }\n else {\n this.nearSizes.push(width);\n }\n };\n __decorate([\n Property('100%')\n ], Row.prototype, \"height\", void 0);\n __decorate([\n Complex({}, Border)\n ], Row.prototype, \"border\", void 0);\n return Row;\n}(ChildProperty));\nexport { Row };\n/**\n * Configures the `columns` of the chart.\n */\nvar Column = /** @class */ (function (_super) {\n __extends(Column, _super);\n function Column() {\n /**\n * The width of the column as a string accepts input both as like '100px' or '100%'.\n * If specified as '100%, column renders to the full width of its chart.\n * @default '100%'\n */\n var _this = _super !== null && _super.apply(this, arguments) || this;\n /** @private */\n _this.axes = [];\n /** @private */\n _this.nearSizes = [];\n /** @private */\n _this.farSizes = [];\n /** @private */\n _this.padding = 0;\n return _this;\n }\n /**\n * Measure the column size\n * @return {void}\n * @private\n */\n Column.prototype.computeSize = function (axis, clipRect, scrollBarHeight) {\n var height = 0;\n var innerPadding = 5;\n if (axis.visible) {\n height += (axis.findTickSize(axis.crossInAxis) + scrollBarHeight +\n axis.findLabelSize(axis.crossInAxis, innerPadding) + axis.lineStyle.width / 2);\n }\n if (axis.opposedPosition) {\n this.farSizes.push(height);\n }\n else {\n this.nearSizes.push(height);\n }\n };\n __decorate([\n Property('100%')\n ], Column.prototype, \"width\", void 0);\n __decorate([\n Complex({}, Border)\n ], Column.prototype, \"border\", void 0);\n return Column;\n}(ChildProperty));\nexport { Column };\n/**\n * Configures the major grid lines in the `axis`.\n */\nvar MajorGridLines = /** @class */ (function (_super) {\n __extends(MajorGridLines, _super);\n function MajorGridLines() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(1)\n ], MajorGridLines.prototype, \"width\", void 0);\n __decorate([\n Property('')\n ], MajorGridLines.prototype, \"dashArray\", void 0);\n __decorate([\n Property(null)\n ], MajorGridLines.prototype, \"color\", void 0);\n return MajorGridLines;\n}(ChildProperty));\nexport { MajorGridLines };\n/**\n * Configures the minor grid lines in the `axis`.\n */\nvar MinorGridLines = /** @class */ (function (_super) {\n __extends(MinorGridLines, _super);\n function MinorGridLines() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(0.7)\n ], MinorGridLines.prototype, \"width\", void 0);\n __decorate([\n Property('')\n ], MinorGridLines.prototype, \"dashArray\", void 0);\n __decorate([\n Property(null)\n ], MinorGridLines.prototype, \"color\", void 0);\n return MinorGridLines;\n}(ChildProperty));\nexport { MinorGridLines };\n/**\n * Configures the axis line of a chart.\n */\nvar AxisLine = /** @class */ (function (_super) {\n __extends(AxisLine, _super);\n function AxisLine() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(1)\n ], AxisLine.prototype, \"width\", void 0);\n __decorate([\n Property('')\n ], AxisLine.prototype, \"dashArray\", void 0);\n __decorate([\n Property(null)\n ], AxisLine.prototype, \"color\", void 0);\n return AxisLine;\n}(ChildProperty));\nexport { AxisLine };\n/**\n * Configures the major tick lines.\n */\nvar MajorTickLines = /** @class */ (function (_super) {\n __extends(MajorTickLines, _super);\n function MajorTickLines() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(1)\n ], MajorTickLines.prototype, \"width\", void 0);\n __decorate([\n Property(5)\n ], MajorTickLines.prototype, \"height\", void 0);\n __decorate([\n Property(null)\n ], MajorTickLines.prototype, \"color\", void 0);\n return MajorTickLines;\n}(ChildProperty));\nexport { MajorTickLines };\n/**\n * Configures the minor tick lines.\n */\nvar MinorTickLines = /** @class */ (function (_super) {\n __extends(MinorTickLines, _super);\n function MinorTickLines() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(0.7)\n ], MinorTickLines.prototype, \"width\", void 0);\n __decorate([\n Property(5)\n ], MinorTickLines.prototype, \"height\", void 0);\n __decorate([\n Property(null)\n ], MinorTickLines.prototype, \"color\", void 0);\n return MinorTickLines;\n}(ChildProperty));\nexport { MinorTickLines };\n/**\n * Configures the crosshair ToolTip.\n */\nvar CrosshairTooltip = /** @class */ (function (_super) {\n __extends(CrosshairTooltip, _super);\n function CrosshairTooltip() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], CrosshairTooltip.prototype, \"enable\", void 0);\n __decorate([\n Property(null)\n ], CrosshairTooltip.prototype, \"fill\", void 0);\n __decorate([\n Complex(Theme.crosshairLabelFont, Font)\n ], CrosshairTooltip.prototype, \"textStyle\", void 0);\n return CrosshairTooltip;\n}(ChildProperty));\nexport { CrosshairTooltip };\n/**\n * Configures the axes in the chart.\n */\nvar Axis = /** @class */ (function (_super) {\n __extends(Axis, _super);\n // tslint:disable-next-line:no-any\n function Axis(parent, propName, defaultValue, isArray) {\n var _this = _super.call(this, parent, propName, defaultValue, isArray) || this;\n /** @private */\n _this.visibleLabels = [];\n /** @private */\n _this.series = [];\n /** @private */\n _this.rect = new Rect(undefined, undefined, 0, 0);\n /** @private */\n _this.axisBottomLine = null;\n /** @private */\n _this.intervalDivs = [10, 5, 2, 1];\n /** @private */\n _this.angle = _this.labelRotation;\n /** @private */\n _this.isStack100 = false;\n /** @private */\n _this.crossAt = null;\n /** @private */\n _this.updatedRect = null;\n /** @private */\n _this.multiLevelLabelHeight = 0;\n /** @private */\n _this.isChart = true;\n return _this;\n }\n /**\n * The function used to find tick size.\n * @return {number}\n * @private\n */\n Axis.prototype.findTickSize = function (crossAxis) {\n if (this.tickPosition === 'Inside') {\n return 0;\n }\n if (crossAxis && (!crossAxis.visibleRange || this.isInside(crossAxis.visibleRange))) {\n return 0;\n }\n return this.majorTickLines.height;\n };\n /**\n * The function used to find axis position.\n * @return {number}\n * @private\n */\n Axis.prototype.isInside = function (range) {\n return (inside(this.crossAt, range) ||\n (!this.opposedPosition && this.crossAt >= range.max) || (this.opposedPosition && this.crossAt <= range.min));\n };\n /**\n * The function used to find label Size.\n * @return {number}\n * @private\n */\n Axis.prototype.findLabelSize = function (crossAxis, innerPadding) {\n var titleSize = 0;\n if (this.title) {\n titleSize = measureText(this.title, this.titleStyle).height + innerPadding;\n }\n if (this.labelPosition === 'Inside') {\n return titleSize + innerPadding;\n }\n var diff;\n var value;\n var labelSize = titleSize + innerPadding + axisPadding +\n ((this.orientation === 'Vertical') ? this.maxLabelSize.width : this.maxLabelSize.height) + this.multiLevelLabelHeight;\n if (crossAxis && this.placeNextToAxisLine) {\n var range = crossAxis.visibleRange;\n var size = (crossAxis.orientation === 'Horizontal') ? crossAxis.rect.width : crossAxis.rect.height;\n if (!range || !size) {\n return 0;\n }\n else if (this.isInside(range)) {\n value = this.findDifference(crossAxis);\n diff = (value) * (size / range.delta);\n diff = (value) * ((size - (diff < labelSize ? (labelSize - diff) : 0)) / range.delta);\n labelSize = (diff < labelSize) ? (labelSize - diff) : 0;\n }\n }\n return labelSize;\n };\n /**\n * The function used to find axis position.\n * @return {number}\n * @private\n */\n Axis.prototype.updateCrossValue = function (chart) {\n var value = this.crossAt;\n if (value === null || !this.isInside(this.crossInAxis.visibleRange)) {\n this.updatedRect = this.rect;\n return null;\n }\n var range = this.crossInAxis.visibleRange;\n if (!this.opposedPosition) {\n if (this.crossAt > range.max) {\n value = range.max;\n }\n }\n else {\n if (this.crossAt < range.min) {\n value = range.min;\n }\n }\n this.updatedRect = extend({}, this.rect, null, true);\n if (this.orientation === 'Horizontal') {\n value = this.crossInAxis.rect.height - (valueToCoefficient(value, this.crossInAxis) * this.crossInAxis.rect.height);\n this.updatedRect.y = this.crossInAxis.rect.y + value;\n }\n else {\n value = valueToCoefficient(value, this.crossInAxis) * this.crossInAxis.rect.width;\n this.updatedRect.x = this.crossInAxis.rect.x + value;\n }\n };\n Axis.prototype.findDifference = function (crossAxis) {\n var value = 0;\n if (this.opposedPosition) {\n value = crossAxis.isInversed ? crossAxis.visibleRange.min : crossAxis.visibleRange.max;\n }\n else {\n value = crossAxis.isInversed ? crossAxis.visibleRange.max : crossAxis.visibleRange.min;\n }\n return Math.abs(this.crossAt - value);\n };\n /**\n * Calculate visible range for axis.\n * @return {void}\n * @private\n */\n Axis.prototype.calculateVisibleRange = function (size) {\n if (this.zoomFactor < 1 || this.zoomPosition > 0) {\n var baseRange = this.actualRange;\n var start = void 0;\n var end = void 0;\n if (!this.isInversed) {\n start = this.actualRange.min + this.zoomPosition * this.actualRange.delta;\n end = start + this.zoomFactor * this.actualRange.delta;\n }\n else {\n start = this.actualRange.max - (this.zoomPosition * this.actualRange.delta);\n end = start - (this.zoomFactor * this.actualRange.delta);\n }\n if (start < baseRange.min) {\n end = end + (baseRange.min - start);\n start = baseRange.min;\n }\n if (end > baseRange.max) {\n start = start - (end - baseRange.max);\n end = baseRange.max;\n }\n this.doubleRange = new DoubleRange(start, end);\n this.visibleRange.min = this.doubleRange.start;\n this.visibleRange.max = this.doubleRange.end;\n this.visibleRange.delta = this.doubleRange.delta;\n }\n };\n /**\n * Triggers the event.\n * @return {void}\n * @private\n */\n Axis.prototype.triggerRangeRender = function (chart, minimum, maximum, interval) {\n var argsData;\n argsData = {\n cancel: false, name: axisRangeCalculated, axis: this,\n minimum: minimum, maximum: maximum, interval: interval\n };\n chart.trigger(axisRangeCalculated, argsData);\n if (!argsData.cancel) {\n this.visibleRange.min = argsData.minimum;\n this.visibleRange.max = argsData.maximum;\n this.visibleRange.interval = argsData.interval;\n this.visibleRange.delta = argsData.maximum - argsData.minimum;\n }\n };\n /**\n * Calculate padding for the axis.\n * @return {string}\n * @private\n */\n Axis.prototype.getRangePadding = function (chart) {\n var padding = this.rangePadding;\n if (padding !== 'Auto') {\n return padding;\n }\n switch (this.orientation) {\n case 'Horizontal':\n if (chart.requireInvertedAxis) {\n padding = (this.isStack100 || this.baseModule.chart.stockChart ? 'Round' : 'Normal');\n }\n else {\n padding = 'None';\n }\n break;\n case 'Vertical':\n if (!chart.requireInvertedAxis) {\n padding = (this.isStack100 || this.baseModule.chart.stockChart ? 'Round' : 'Normal');\n }\n else {\n padding = 'None';\n }\n break;\n }\n return padding;\n };\n /**\n * Calculate maximum label width for the axis.\n * @return {void}\n * @private\n */\n Axis.prototype.getMaxLabelWidth = function (chart) {\n var pointX;\n var previousEnd = 0;\n var isIntersect = false;\n this.angle = this.labelRotation;\n this.maxLabelSize = new Size(0, 0);\n var action = this.labelIntersectAction;\n var label;\n var breakLabels;\n for (var i = 0; i < this.visibleLabels.length; i++) {\n label = this.visibleLabels[i];\n breakLabels = label.originalText.indexOf('
') !== -1 ? label.originalText : label.text;\n if (breakLabels.indexOf('
') !== -1) {\n var labelText = this.enableTrim ? breakLabels : breakLabels.replace(/
/g, ' ');\n label.size = measureText(labelText, this.labelStyle);\n label.breakLabelSize = measureText(breakLabels, this.labelStyle);\n }\n else {\n label.size = measureText(label.text, this.labelStyle);\n }\n var width = (breakLabels.indexOf('
') !== -1) ? label.breakLabelSize.width : label.size.width;\n if (width > this.maxLabelSize.width) {\n this.maxLabelSize.width = width;\n this.rotatedLabel = label.text;\n }\n var height = (breakLabels.indexOf('
') !== -1) ? label.breakLabelSize.height : label.size.height;\n if (height > this.maxLabelSize.height) {\n this.maxLabelSize.height = height;\n }\n if (breakLabels.indexOf('
') !== -1) {\n label.text = this.enableTrim ? label.text : this.getLineBreakText(breakLabels);\n }\n if (action === 'None' || action === 'Hide' || action === 'Trim') {\n continue;\n }\n if ((action !== 'None' || this.angle % 360 === 0) && this.orientation === 'Horizontal' &&\n this.rect.width > 0 && !isIntersect) {\n pointX = (valueToCoefficient(label.value, this) * this.rect.width) + this.rect.x;\n pointX -= label.size.width / 2;\n if (this.edgeLabelPlacement === 'Shift') {\n if (i === 0 && pointX < this.rect.x) {\n pointX = this.rect.x;\n }\n if (i === this.visibleLabels.length - 1 && ((pointX + label.size.width) > (this.rect.x + this.rect.width))) {\n pointX = this.rect.x + this.rect.width - label.size.width;\n }\n }\n switch (action) {\n case 'MultipleRows':\n if (i > 0) {\n this.findMultiRows(i, pointX, label);\n }\n break;\n case 'Rotate45':\n case 'Rotate90':\n if (i > 0 && (!this.isInversed ? pointX <= previousEnd : pointX + label.size.width >= previousEnd)) {\n this.angle = (action === 'Rotate45') ? 45 : 90;\n isIntersect = true;\n }\n break;\n default:\n if (breakLabels.indexOf('
') !== -1) {\n var result = void 0;\n var result1 = [];\n var str = void 0;\n for (var index = 0; index < label.text.length; index++) {\n result = textWrap(label.text[index], this.rect.width / this.visibleLabels.length, this.labelStyle);\n if (result.length > 1) {\n for (var j = 0; j < result.length; j++) {\n str = result[j];\n result1.push(str);\n }\n }\n else {\n result1.push(result[0]);\n }\n }\n label.text = result1;\n }\n else {\n label.text = textWrap(label.text, this.rect.width / this.visibleLabels.length, this.labelStyle);\n }\n var height_1 = (label.size.height * label.text.length);\n if (height_1 > this.maxLabelSize.height) {\n this.maxLabelSize.height = height_1;\n }\n break;\n }\n previousEnd = this.isInversed ? pointX : pointX + label.size.width;\n }\n }\n if (this.angle !== 0 && this.orientation === 'Horizontal') {\n if (this.rotatedLabel.indexOf('
') !== -1) {\n this.maxLabelSize.height = measureText(this.rotatedLabel, this.labelStyle).width;\n this.maxLabelSize.width = measureText(this.rotatedLabel, this.labelStyle).height;\n }\n else {\n this.maxLabelSize = rotateTextSize(this.labelStyle, this.rotatedLabel, this.angle, chart);\n }\n }\n if (chart.multiLevelLabelModule && this.multiLevelLabels.length > 0) {\n chart.multiLevelLabelModule.getMultilevelLabelsHeight(this);\n }\n };\n /**\n * To get line break text collection\n * @param breakLabels\n */\n Axis.prototype.getLineBreakText = function (breakLabels) {\n var breakLabelCollection;\n var breakLabelCollection1 = [];\n breakLabelCollection = breakLabels.split('
');\n for (var i = 0, len = breakLabelCollection.length; i < len; i++) {\n breakLabelCollection1.push(breakLabelCollection[i]);\n //breakLabelCollection1.push(textTrim(220, breakLabelCollection[i], this.labelStyle));\n }\n return breakLabelCollection1;\n };\n /**\n * Finds the multiple rows for axis.\n * @return {void}\n */\n Axis.prototype.findMultiRows = function (length, currentX, currentLabel) {\n var label;\n var pointX;\n var store = [];\n var isMultiRows;\n for (var i = length - 1; i >= 0; i--) {\n label = this.visibleLabels[i];\n pointX = (valueToCoefficient(label.value, this) * this.rect.width) + this.rect.x;\n isMultiRows = !this.isInversed ? currentX < (pointX + label.size.width / 2) :\n currentX + currentLabel.size.width > (pointX - label.size.width / 2);\n if (isMultiRows) {\n store.push(label.index);\n currentLabel.index = (currentLabel.index > label.index) ? currentLabel.index : label.index + 1;\n }\n else {\n currentLabel.index = store.indexOf(label.index) > -1 ? currentLabel.index : label.index;\n }\n }\n var height = (currentLabel.size.height * currentLabel.index) + (5 * (currentLabel.index - 1));\n if (height > this.maxLabelSize.height) {\n this.maxLabelSize.height = height;\n }\n };\n /**\n * Finds the default module for axis.\n * @return {void}\n * @private\n */\n Axis.prototype.getModule = function (chart) {\n if (this.valueType === 'Double') {\n this.baseModule = new Double(chart);\n }\n else {\n this.baseModule = chart[firstToLowerCase(this.valueType) + 'Module'];\n }\n };\n __decorate([\n Complex(Theme.axisLabelFont, Font)\n ], Axis.prototype, \"labelStyle\", void 0);\n __decorate([\n Complex({}, CrosshairTooltip)\n ], Axis.prototype, \"crosshairTooltip\", void 0);\n __decorate([\n Property('')\n ], Axis.prototype, \"title\", void 0);\n __decorate([\n Complex(Theme.axisTitleFont, Font)\n ], Axis.prototype, \"titleStyle\", void 0);\n __decorate([\n Property('')\n ], Axis.prototype, \"labelFormat\", void 0);\n __decorate([\n Property('')\n ], Axis.prototype, \"skeleton\", void 0);\n __decorate([\n Property('DateTime')\n ], Axis.prototype, \"skeletonType\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"plotOffset\", void 0);\n __decorate([\n Property(false)\n ], Axis.prototype, \"isIndexed\", void 0);\n __decorate([\n Property(10)\n ], Axis.prototype, \"logBase\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"columnIndex\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"rowIndex\", void 0);\n __decorate([\n Property(1)\n ], Axis.prototype, \"span\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"desiredIntervals\", void 0);\n __decorate([\n Property(3)\n ], Axis.prototype, \"maximumLabels\", void 0);\n __decorate([\n Property(1)\n ], Axis.prototype, \"zoomFactor\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"zoomPosition\", void 0);\n __decorate([\n Property(false)\n ], Axis.prototype, \"opposedPosition\", void 0);\n __decorate([\n Property(true)\n ], Axis.prototype, \"enableAutoIntervalOnZooming\", void 0);\n __decorate([\n Property('Auto')\n ], Axis.prototype, \"rangePadding\", void 0);\n __decorate([\n Property('Double')\n ], Axis.prototype, \"valueType\", void 0);\n __decorate([\n Property('None')\n ], Axis.prototype, \"edgeLabelPlacement\", void 0);\n __decorate([\n Property('Auto')\n ], Axis.prototype, \"intervalType\", void 0);\n __decorate([\n Property('BetweenTicks')\n ], Axis.prototype, \"labelPlacement\", void 0);\n __decorate([\n Property('Outside')\n ], Axis.prototype, \"tickPosition\", void 0);\n __decorate([\n Property('Outside')\n ], Axis.prototype, \"labelPosition\", void 0);\n __decorate([\n Property('')\n ], Axis.prototype, \"name\", void 0);\n __decorate([\n Property(true)\n ], Axis.prototype, \"visible\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"minorTicksPerInterval\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"labelRotation\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"crossesAt\", void 0);\n __decorate([\n Property(true)\n ], Axis.prototype, \"placeNextToAxisLine\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"crossesInAxis\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"minimum\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"maximum\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"interval\", void 0);\n __decorate([\n Property(34)\n ], Axis.prototype, \"maximumLabelWidth\", void 0);\n __decorate([\n Property(false)\n ], Axis.prototype, \"enableTrim\", void 0);\n __decorate([\n Complex({}, MajorTickLines)\n ], Axis.prototype, \"majorTickLines\", void 0);\n __decorate([\n Complex({}, MinorTickLines)\n ], Axis.prototype, \"minorTickLines\", void 0);\n __decorate([\n Complex({}, MajorGridLines)\n ], Axis.prototype, \"majorGridLines\", void 0);\n __decorate([\n Complex({}, MinorGridLines)\n ], Axis.prototype, \"minorGridLines\", void 0);\n __decorate([\n Complex({}, AxisLine)\n ], Axis.prototype, \"lineStyle\", void 0);\n __decorate([\n Property('Trim')\n ], Axis.prototype, \"labelIntersectAction\", void 0);\n __decorate([\n Property(false)\n ], Axis.prototype, \"isInversed\", void 0);\n __decorate([\n Property(100)\n ], Axis.prototype, \"coefficient\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"startAngle\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"description\", void 0);\n __decorate([\n Property(2)\n ], Axis.prototype, \"tabIndex\", void 0);\n __decorate([\n Collection([], StripLineSettings)\n ], Axis.prototype, \"stripLines\", void 0);\n __decorate([\n Collection([], MultiLevelLabels)\n ], Axis.prototype, \"multiLevelLabels\", void 0);\n __decorate([\n Complex({ color: null, width: 0, type: 'Rectangle' }, LabelBorder)\n ], Axis.prototype, \"border\", void 0);\n __decorate([\n Complex({}, ScrollbarSettings)\n ], Axis.prototype, \"scrollbarSettings\", void 0);\n return Axis;\n}(ChildProperty));\nexport { Axis };\n/** @private */\nvar VisibleLabels = /** @class */ (function () {\n function VisibleLabels(text, value, labelStyle, originalText, size, breakLabelSize, index) {\n if (size === void 0) { size = new Size(0, 0); }\n if (breakLabelSize === void 0) { breakLabelSize = new Size(0, 0); }\n if (index === void 0) { index = 1; }\n this.text = text;\n this.originalText = originalText;\n this.value = value;\n this.labelStyle = labelStyle;\n this.size = size;\n this.breakLabelSize = breakLabelSize;\n this.index = 1;\n }\n return VisibleLabels;\n}());\nexport { VisibleLabels };\n","import { createElement, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { DataUtil } from '@syncfusion/ej2-data';\nimport { subtractThickness, valueToCoefficient, sum, redrawElement } from '../../common/utils/helper';\nimport { subArray, inside, appendChildElement } from '../../common/utils/helper';\nimport { Thickness, logBase, createZoomingLabels, getElement, rotateTextSize } from '../../common/utils/helper';\nimport { Size, Rect, measureText, TextOption, PathOption } from '@syncfusion/ej2-svg-base';\nimport { textElement, textTrim } from '../../common/utils/helper';\n/**\n * Specifies the Cartesian Axis Layout.\n */\nvar axisPadding = 10;\nvar CartesianAxisLayoutPanel = /** @class */ (function () {\n /** @private */\n function CartesianAxisLayoutPanel(chartModule) {\n this.chart = chartModule;\n this.padding = 5;\n }\n /**\n * Measure the axis size.\n * @return {void}\n * @private\n */\n CartesianAxisLayoutPanel.prototype.measureAxis = function (rect) {\n var chart = this.chart;\n this.crossAt(chart);\n this.seriesClipRect = new Rect(rect.x, rect.y, rect.width, rect.height);\n this.initialClipRect = rect;\n this.leftSize = 0;\n this.rightSize = 0;\n this.topSize = 0;\n this.bottomSize = 0;\n //Measure Axis size with initial Rect\n this.measureRowAxis(chart, this.initialClipRect);\n this.initialClipRect = subtractThickness(this.initialClipRect, new Thickness(this.leftSize, this.rightSize, 0, 0));\n this.measureColumnAxis(chart, this.initialClipRect);\n this.initialClipRect = subtractThickness(this.initialClipRect, new Thickness(0, 0, this.topSize, this.bottomSize));\n if (!this.chart.delayRedraw) {\n this.calculateAxisSize(this.initialClipRect);\n }\n this.leftSize = 0;\n this.rightSize = 0;\n this.topSize = 0;\n this.bottomSize = 0;\n //Measure Axis size with series Rect\n this.measureRowAxis(chart, this.initialClipRect);\n this.seriesClipRect = subtractThickness(this.seriesClipRect, new Thickness(this.leftSize, this.rightSize, 0, 0));\n this.measureColumnAxis(chart, this.initialClipRect);\n this.seriesClipRect = subtractThickness(this.seriesClipRect, new Thickness(0, 0, this.topSize, this.bottomSize));\n if (!this.chart.delayRedraw) {\n chart.refreshAxis();\n this.calculateAxisSize(this.seriesClipRect);\n }\n };\n CartesianAxisLayoutPanel.prototype.measureRowAxis = function (chart, rect) {\n var row;\n this.calculateRowSize(rect);\n for (var _i = 0, _a = chart.rows; _i < _a.length; _i++) {\n var item = _a[_i];\n row = item;\n row.nearSizes = [];\n row.farSizes = [];\n this.arrangeAxis(row);\n this.measureDefinition(row, chart, new Size(chart.availableSize.width, row.computedHeight), rect);\n if (this.leftSize < sum(row.nearSizes)) {\n this.leftSize = sum(row.nearSizes);\n }\n if (this.rightSize < sum(row.farSizes)) {\n this.rightSize = sum(row.farSizes);\n }\n }\n };\n CartesianAxisLayoutPanel.prototype.measureColumnAxis = function (chart, rect) {\n var column;\n this.calculateColumnSize(rect);\n for (var _i = 0, _a = chart.columns; _i < _a.length; _i++) {\n var item = _a[_i];\n column = item;\n column.farSizes = [];\n column.nearSizes = [];\n this.arrangeAxis(column);\n this.measureDefinition(column, chart, new Size(column.computedWidth, chart.availableSize.height), rect);\n if (this.bottomSize < sum(column.nearSizes)) {\n this.bottomSize = sum(column.nearSizes);\n }\n if (this.topSize < sum(column.farSizes)) {\n this.topSize = sum(column.farSizes);\n }\n }\n };\n /**\n * Measure the column and row in chart.\n * @return {void}\n * @private\n */\n CartesianAxisLayoutPanel.prototype.measureDefinition = function (definition, chart, size, clipRect) {\n var axis;\n var axisType;\n var ele = 16; // scrollbar element height is 16.\n for (var _i = 0, _a = definition.axes; _i < _a.length; _i++) {\n var axis_1 = _a[_i];\n axis_1.scrollBarHeight = chart.scrollBarModule && chart.zoomSettings.enableScrollbar && chart.zoomModule.isZoomed\n && (axis_1.zoomFactor < 1 || axis_1.zoomPosition > 0) ? ele : 0;\n axis_1.scrollBarHeight = chart.scrollBarModule && (chart.zoomModule && chart.zoomSettings.enableScrollbar &&\n chart.zoomModule.isZoomed && (axis_1.zoomFactor < 1 || axis_1.zoomPosition > 0) || axis_1.scrollbarSettings.enable) ? ele : 0;\n axis_1.getModule(chart);\n axis_1.baseModule.calculateRangeAndInterval(size, axis_1);\n definition.computeSize(axis_1, clipRect, axis_1.scrollBarHeight);\n }\n if (definition.farSizes.length > 0) {\n definition.farSizes[definition.farSizes.length - 1] -= axisPadding;\n }\n if (definition.nearSizes.length > 0) {\n definition.nearSizes[definition.nearSizes.length - 1] -= axisPadding;\n }\n };\n /**\n * Measure the axis.\n * @return {void}\n * @private\n */\n CartesianAxisLayoutPanel.prototype.calculateAxisSize = function (rect) {\n var chart = this.chart;\n var row;\n var column;\n var definition;\n var axis;\n var nearCount = 0;\n var farCount = 0;\n var size = 0;\n var x;\n var y;\n this.calculateRowSize(rect);\n for (var i = 0, len = chart.rows.length; i < len; i++) {\n row = chart.rows[i];\n nearCount = 0;\n farCount = 0;\n for (var j = 0, len_1 = row.axes.length; j < len_1; j++) {\n axis = row.axes[j];\n if (axis.rect.height === 0) {\n axis.rect.height = row.computedHeight;\n size = 0;\n for (var k = i + 1, len_2 = i + axis.span; k < len_2; k++) {\n definition = chart.rows[k];\n size += definition.computedHeight;\n }\n axis.rect.y = (row.computedTop - size) + axis.plotOffset;\n axis.rect.height = (axis.rect.height + size) - (2 * axis.plotOffset);\n axis.rect.width = 0;\n }\n if (axis.opposedPosition) {\n x = rect.x + rect.width + sum(subArray(row.farSizes, farCount));\n axis.rect.x = axis.rect.x >= x ? axis.rect.x : x;\n farCount++;\n }\n else {\n x = rect.x - sum(subArray(row.nearSizes, nearCount));\n axis.rect.x = axis.rect.x <= x ? axis.rect.x : x;\n nearCount++;\n }\n }\n }\n this.calculateColumnSize(rect);\n for (var i = 0, len = chart.columns.length; i < len; i++) {\n column = chart.columns[i];\n nearCount = 0;\n farCount = 0;\n for (var j = 0, len_3 = column.axes.length; j < len_3; j++) {\n axis = column.axes[j];\n if (axis.rect.width === 0) {\n for (var k = i, len_4 = (i + axis.span); k < len_4; k++) {\n definition = chart.columns[k];\n axis.rect.width += definition.computedWidth;\n }\n axis.rect.x = column.computedLeft + axis.plotOffset;\n axis.rect.width -= (2 * axis.plotOffset);\n axis.rect.height = 0;\n }\n if (axis.opposedPosition) {\n y = rect.y - sum(subArray(column.farSizes, farCount));\n axis.rect.y = axis.rect.y <= y ? axis.rect.y : y;\n farCount++;\n }\n else {\n y = rect.y + rect.height + sum(subArray(column.nearSizes, nearCount));\n axis.rect.y = axis.rect.y >= y ? axis.rect.y : y;\n nearCount++;\n }\n }\n }\n };\n /**\n * Measure the axis.\n * @return {void}\n * @private\n */\n CartesianAxisLayoutPanel.prototype.measure = function () {\n var chart = this.chart;\n var row;\n var column;\n var definition;\n var axis;\n var actualIndex;\n var span;\n var axisLength;\n for (var _i = 0, _a = chart.axisCollections; _i < _a.length; _i++) {\n var axis_2 = _a[_i];\n //definition.Axes = axis;\n if (axis_2.orientation === 'Vertical') {\n chart.verticalAxes.push(axis_2);\n actualIndex = this.getActualRow(axis_2);\n row = chart.rows[actualIndex];\n this.pushAxis(row, axis_2);\n span = ((actualIndex + axis_2.span) > chart.rows.length ? chart.rows.length : (actualIndex + axis_2.span));\n for (var j = actualIndex + 1; j < span; j++) {\n definition = chart.rows[j];\n definition.axes[row.axes.length - 1] = axis_2;\n chart.rows[j] = definition;\n }\n chart.rows[actualIndex] = row;\n }\n else {\n chart.horizontalAxes.push(axis_2);\n actualIndex = this.getActualColumn(axis_2);\n column = chart.columns[actualIndex];\n this.pushAxis(column, axis_2);\n span = ((actualIndex + axis_2.span) > chart.columns.length ? chart.columns.length : (actualIndex + axis_2.span));\n for (var j = actualIndex + 1; j < span; j++) {\n definition = chart.columns[j];\n definition.axes[column.axes.length - 1] = axis_2;\n chart.columns[j] = definition;\n }\n chart.columns[actualIndex] = column;\n }\n }\n };\n CartesianAxisLayoutPanel.prototype.crossAt = function (chart) {\n for (var _i = 0, _a = chart.axisCollections; _i < _a.length; _i++) {\n var axis = _a[_i];\n if (axis.crossesAt === null) {\n continue;\n }\n var isTransposed = chart.isTransposed;\n if (!axis.crossesInAxis) {\n if (chart.requireInvertedAxis) {\n axis.crossInAxis = ((axis.orientation === 'Horizontal')) ? chart.primaryXAxis : chart.primaryYAxis;\n }\n else {\n axis.crossInAxis = ((axis.orientation === 'Horizontal')) ? chart.primaryYAxis : chart.primaryXAxis;\n }\n axis.crossAt = this.updateCrossAt(axis.crossInAxis, axis.crossesAt);\n continue;\n }\n else {\n for (var i = 2, len = chart.axisCollections.length; i < len; i++) {\n if (axis.crossesInAxis === chart.axisCollections[i].name) {\n axis.crossInAxis = chart.axisCollections[i];\n axis.crossAt = this.updateCrossAt(axis.crossInAxis, axis.crossesAt);\n continue;\n }\n }\n }\n }\n };\n CartesianAxisLayoutPanel.prototype.updateCrossAt = function (axis, crossAt) {\n switch (axis.valueType) {\n case 'DateTime':\n var option = {\n skeleton: 'full',\n type: 'dateTime'\n };\n var dateParser = this.chart.intl.getDateParser(option);\n var dateFormatter = this.chart.intl.getDateFormat(option);\n return Date.parse(dateParser(dateFormatter(new Date(DataUtil.parse.parseJson({ val: crossAt }).val))));\n case 'Category':\n return parseFloat(crossAt) ? parseFloat(crossAt) : axis.labels.indexOf(crossAt);\n case 'Logarithmic':\n return logBase(crossAt, axis.logBase);\n default:\n return crossAt;\n }\n };\n CartesianAxisLayoutPanel.prototype.pushAxis = function (definition, axis) {\n for (var i = 0, len = definition.axes.length; i <= len; i++) {\n if (!definition.axes[i]) {\n definition.axes[i] = axis;\n break;\n }\n }\n };\n CartesianAxisLayoutPanel.prototype.arrangeAxis = function (definition) {\n var axisCollection = [];\n for (var i = 0, len = definition.axes.length; i <= len; i++) {\n if (definition.axes[i]) {\n axisCollection.push(definition.axes[i]);\n }\n }\n definition.axes = axisCollection;\n };\n CartesianAxisLayoutPanel.prototype.getActualColumn = function (axis) {\n var actualLength = this.chart.columns.length;\n var pos = axis.columnIndex;\n var result = pos >= actualLength ? actualLength - 1 : (pos < 0 ? 0 : pos);\n return result;\n };\n CartesianAxisLayoutPanel.prototype.getActualRow = function (axis) {\n var actualLength = this.chart.rows.length;\n var pos = axis.rowIndex;\n var result = pos >= actualLength ? actualLength - 1 : (pos < 0 ? 0 : pos);\n return result;\n };\n /**\n * Measure the row size.\n * @return {void}\n */\n CartesianAxisLayoutPanel.prototype.calculateRowSize = function (rect) {\n /*! Calculate row size */\n var chart = this.chart;\n var row;\n var rowTop = rect.y + rect.height;\n var height = 0;\n var remainingHeight = Math.max(0, rect.height);\n for (var i = 0, len = chart.rows.length; i < len; i++) {\n row = chart.rows[i];\n if (row.height.indexOf('%') !== -1) {\n height = Math.min(remainingHeight, (rect.height * parseInt(row.height, 10) / 100));\n }\n else {\n height = Math.min(remainingHeight, parseInt(row.height, 10));\n }\n height = (i !== (len - 1)) ? height : remainingHeight;\n row.computedHeight = height;\n rowTop -= height;\n row.computedTop = rowTop;\n remainingHeight -= height;\n }\n };\n /**\n * Measure the row size.\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.calculateColumnSize = function (rect) {\n /*! Calculate column size */\n var chart = this.chart;\n var column;\n var columnLeft = rect.x;\n var width = 0;\n var remainingWidth = Math.max(0, rect.width);\n for (var i = 0, len = chart.columns.length; i < len; i++) {\n column = chart.columns[i];\n if (column.width.indexOf('%') !== -1) {\n width = Math.min(remainingWidth, (rect.width * parseInt(column.width, 10) / 100));\n }\n else {\n width = Math.min(remainingWidth, parseInt(column.width, 10));\n }\n width = (i !== (len - 1)) ? width : remainingWidth;\n column.computedWidth = width;\n column.computedLeft = columnLeft;\n columnLeft += width;\n remainingWidth -= width;\n }\n };\n /**\n * To render the axis element.\n * @return {void}\n * @private\n */\n CartesianAxisLayoutPanel.prototype.renderAxes = function () {\n var chart = this.chart;\n var axis;\n var axisElement = chart.renderer.createGroup({ id: chart.element.id + 'AxisInsideCollection' });\n var axisLineElement = chart.renderer.createGroup({ id: chart.element.id + 'AxisOutsideCollection' });\n var outsideElement;\n var isInside;\n for (var i = 0, len = chart.axisCollections.length; i < len; i++) {\n axis = chart.axisCollections[i];\n this.element = chart.renderer.createGroup({ id: chart.element.id + 'AxisGroup' + i + 'Inside' });\n outsideElement = chart.renderer.createGroup({ id: chart.element.id + 'AxisGroup' + i + 'Outside' });\n isInside = this.findAxisPosition(axis);\n if (axis.orientation === 'Horizontal') {\n axis.updateCrossValue(chart);\n if (axis.visible && axis.lineStyle.width > 0) {\n this.drawAxisLine(axis, i, axis.plotOffset, 0, isInside ? outsideElement : this.element, axis.updatedRect);\n }\n if (axis.majorGridLines.width > 0 || axis.majorTickLines.width > 0) {\n this.drawXAxisGridLine(axis, i, (isInside || axis.tickPosition === 'Inside') ? outsideElement : this.element, axis.updatedRect);\n }\n if (axis.visible) {\n this.drawXAxisLabels(axis, i, (isInside || axis.labelPosition === 'Inside') ? outsideElement : this.element, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n this.drawXAxisBorder(axis, i, (isInside || axis.labelPosition === 'Inside') ? outsideElement : this.element, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n this.drawXAxisTitle(axis, i, isInside ? outsideElement : this.element, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n }\n }\n else {\n axis.updateCrossValue(chart);\n if (axis.visible && axis.lineStyle.width > 0) {\n this.drawAxisLine(axis, i, 0, axis.plotOffset, isInside ? outsideElement : this.element, axis.updatedRect);\n }\n if (axis.majorGridLines.width > 0 || axis.majorTickLines.width > 0) {\n this.drawYAxisGridLine(axis, i, (isInside || axis.tickPosition === 'Inside') ? outsideElement : this.element, axis.updatedRect);\n }\n if (axis.visible) {\n this.drawYAxisLabels(axis, i, (isInside || axis.labelPosition === 'Inside') ? outsideElement : this.element, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n this.drawYAxisBorder(axis, i, (isInside || axis.labelPosition === 'Inside') ? outsideElement : this.element, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n this.drawYAxisTitle(axis, i, isInside ? outsideElement : this.element, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n }\n }\n axisElement.appendChild(this.element);\n if (outsideElement && outsideElement.childNodes.length > 0) {\n axisLineElement.appendChild(outsideElement);\n }\n if (chart.scrollBarModule && (chart.zoomSettings.enableScrollbar || axis.scrollbarSettings.enable)) {\n this.renderScrollbar(chart, axis);\n }\n }\n this.element = chart.renderer.createGroup({ id: chart.element.id + 'DefinitionLine' });\n for (var j = 0, len = chart.rows.length; j < len; j++) {\n var row = chart.rows[j];\n if (row.border.color) {\n this.drawBottomLine(row, j, true);\n }\n }\n for (var j = 0, len = chart.columns.length; j < len; j++) {\n var column = chart.columns[j];\n if (column.border.color) {\n this.drawBottomLine(column, j, false);\n }\n }\n axisElement.appendChild(this.element);\n appendChildElement(chart.svgObject, axisElement, chart.redraw);\n return axisLineElement;\n };\n /**\n * To render the axis scrollbar\n * @param chart\n * @param axis\n */\n CartesianAxisLayoutPanel.prototype.renderScrollbar = function (chart, axis) {\n var isZoomed = isNullOrUndefined(chart.zoomModule) ? false : chart.zoomModule.isZoomed;\n if (((isZoomed && (axis.zoomFactor < 1 || axis.zoomPosition > 0)) || (axis.scrollbarSettings.enable &&\n (axis.zoomFactor <= 1 || axis.zoomPosition >= 0))) && !axis.zoomingScrollBar.isScrollUI) {\n if (!chart.scrollElement) {\n chart.scrollElement = redrawElement(chart.redraw, chart.element.id + '_scrollElement') || createElement('div', { id: chart.element.id + '_scrollElement' });\n }\n appendChildElement(chart.scrollElement, axis.zoomingScrollBar.render(true), true);\n }\n else if (axis.zoomFactor === 1 && axis.zoomPosition === 0 && axis.zoomingScrollBar.svgObject && !axis.scrollbarSettings.enable) {\n axis.zoomingScrollBar.destroy();\n }\n if (axis.zoomingScrollBar.isScrollUI) {\n axis.zoomingScrollBar.isScrollUI = false;\n }\n };\n /**\n * To find the axis position\n * @param axis\n */\n CartesianAxisLayoutPanel.prototype.findAxisPosition = function (axis) {\n return axis.crossAt !== null && axis.isInside(axis.crossInAxis.visibleRange);\n };\n /**\n * To render the bootom line of the columns and rows\n * @param definition\n * @param index\n * @param isRow\n */\n CartesianAxisLayoutPanel.prototype.drawBottomLine = function (definition, index, isRow) {\n var chart = this.chart;\n var optionsLine = {};\n var x1;\n var x2;\n var y1;\n var y2;\n var definitionName;\n if (isRow) {\n definition = definition;\n y1 = y2 = definition.computedTop + definition.computedHeight;\n x1 = this.seriesClipRect.x;\n x2 = x1 + this.seriesClipRect.width;\n definitionName = 'Row';\n }\n else {\n definition = definition;\n x1 = x2 = definition.computedLeft;\n y1 = this.seriesClipRect.y;\n y2 = y1 + this.seriesClipRect.height;\n definitionName = 'Column';\n }\n optionsLine = {\n 'id': chart.element.id + '_AxisBottom_' + definitionName + index,\n x1: x1,\n y1: y1,\n x2: x2,\n y2: y2,\n 'stroke-width': definition.border.width,\n 'stroke': definition.border.color,\n };\n this.htmlObject = chart.renderer.drawLine(optionsLine);\n this.element.appendChild(this.htmlObject);\n };\n /**\n * To render the axis line\n * @param axis\n * @param index\n * @param plotX\n * @param plotY\n * @param parent\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.drawAxisLine = function (axis, index, plotX, plotY, parent, rect) {\n var chart = this.chart;\n var optionsLine = {};\n var element = getElement(chart.element.id + 'AxisLine_' + index);\n var direction = element ? element.getAttribute('d') : '';\n optionsLine = {\n 'id': chart.element.id + 'AxisLine_' + index,\n 'd': 'M ' + (rect.x - plotX) + ' ' + (rect.y - plotY) +\n ' L ' + (rect.x + rect.width + plotX) + ' ' + (rect.y + rect.height + plotY),\n 'stroke-dasharray': axis.lineStyle.dashArray,\n 'stroke-width': axis.lineStyle.width,\n 'stroke': axis.lineStyle.color || chart.themeStyle.axisLine\n };\n this.htmlObject = chart.renderer.drawPath(optionsLine);\n appendChildElement(parent, this.htmlObject, chart.redraw, true, 'x', 'y', null, direction);\n };\n /**\n * To render the yAxis grid line\n * @param axis\n * @param index\n * @param parent\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.drawYAxisGridLine = function (axis, index, parent, rect) {\n var tempInterval;\n var pointY = 0;\n var majorGrid = '';\n var majorTick = '';\n var minorGridDirection;\n var tickSize = axis.opposedPosition ? axis.majorTickLines.height : -axis.majorTickLines.height;\n var axisLineSize = (axis.opposedPosition) ? axis.lineStyle.width / 2 : -axis.lineStyle.width / 2;\n var ticksbwtLabel = (axis.valueType === 'Category' && axis.labelPlacement === 'BetweenTicks') ?\n 0.5 : 0;\n var scrollBarHeight = isNullOrUndefined(axis.crossesAt) ? axis.opposedPosition ? axis.scrollBarHeight :\n -axis.scrollBarHeight : 0;\n var isTickInside = axis.tickPosition === 'Inside';\n var ticks = isTickInside ? (rect.x - tickSize - axisLineSize) : (rect.x + tickSize + axisLineSize + scrollBarHeight);\n var length = axis.visibleLabels.length;\n var chart = this.chart;\n if (axis.valueType.indexOf('Category') && axis.labelPlacement === 'BetweenTicks' && length > 0) {\n length += 1;\n }\n var minorGridLines = axis.minorGridLines;\n var minorTickLines = axis.minorTickLines;\n //Gridlines\n for (var i = 0; i < length; i++) {\n tempInterval = !axis.visibleLabels[i] ? (axis.visibleLabels[i - 1].value + axis.visibleRange.interval) - ticksbwtLabel\n : axis.visibleLabels[i].value - ticksbwtLabel;\n pointY = valueToCoefficient(tempInterval, axis) * rect.height;\n pointY = (pointY * -1) + (rect.y + rect.height);\n if (pointY >= rect.y && (rect.y + rect.height) >= pointY) {\n if ((inside(tempInterval, axis.visibleRange)) || this.isBorder(axis, i, pointY)) {\n majorGrid = 'M ' + this.seriesClipRect.x + ' ' + (pointY) +\n ' L ' + (this.seriesClipRect.x + this.seriesClipRect.width) + ' ' + pointY;\n this.renderGridLine(axis, index, majorGrid, axis.majorGridLines, '_MajorGridLine_', i, this.element, chart.themeStyle.majorGridLine, axis.majorGridLines.dashArray);\n }\n majorTick = 'M ' + (rect.x + axisLineSize + (isTickInside ? scrollBarHeight : 0)) + ' ' + pointY +\n ' L ' + (ticks) + ' ' + pointY;\n this.renderGridLine(axis, index, majorTick, axis.majorTickLines, '_MajorTickLine_', i, parent, chart.themeStyle.majorTickLine);\n if ((minorGridLines.width > 0 || minorTickLines.width > 0) && axis.minorTicksPerInterval > 0) {\n minorGridDirection = this.drawAxisMinorLine(axis, tempInterval, rect, i);\n this.renderGridLine(axis, index, minorGridDirection[0], minorGridLines, '_MinorGridLine_', i, this.element, chart.themeStyle.minorGridLine, minorGridLines.dashArray);\n this.renderGridLine(axis, index, minorGridDirection[1], minorTickLines, '_MinorTickLine_', i, parent, chart.themeStyle.minorTickLine);\n }\n }\n }\n };\n /**\n * To check the border of the axis\n * @param axis\n * @param index\n * @param value\n */\n CartesianAxisLayoutPanel.prototype.isBorder = function (axis, index, value) {\n var chart = this.chart;\n var border = chart.chartArea.border;\n var rect = this.seriesClipRect;\n var orientation = axis.orientation;\n var start = (orientation === 'Horizontal') ? rect.x : rect.y;\n var size = (orientation === 'Horizontal') ? rect.width : rect.height;\n var startIndex = (orientation === 'Horizontal') ? 0 : axis.visibleLabels.length - 1;\n var endIndex = (orientation === 'Horizontal') ? axis.visibleLabels.length - 1 : 0;\n if (axis.plotOffset > 0) {\n return true;\n }\n else if ((value === start || value === (start + size)) && (border.width <= 0 || border.color === 'transparent')) {\n return true;\n }\n else if ((value !== start && index === startIndex) || (value !== (start + size) && index === endIndex)) {\n return true;\n }\n return false;\n };\n /**\n * To render the yAxis label\n * @param axis\n * @param index\n * @param parent\n * @param rect\n * @private\n */\n CartesianAxisLayoutPanel.prototype.drawYAxisLabels = function (axis, index, parent, rect) {\n var chart = this.chart;\n var pointX = 0;\n var pointY = 0;\n var elementSize;\n var options;\n var isLabelInside = axis.labelPosition === 'Inside';\n var isOpposed = axis.opposedPosition;\n var tickSpace = axis.labelPosition === axis.tickPosition ? axis.majorTickLines.height : 0;\n var padding = tickSpace + this.padding + axis.lineStyle.width / 2;\n padding = (axis.opposedPosition) ? padding : -padding;\n var anchor = ((isOpposed && isLabelInside) || (!isOpposed && !isLabelInside)) ? 'end' : 'start';\n var labelElement = chart.renderer.createGroup({ id: chart.element.id + 'AxisLabels' + index });\n var scrollBarHeight = isNullOrUndefined(axis.crossesAt) ? axis.scrollBarHeight * (isOpposed ? 1 : -1) : 0;\n for (var i = 0, len = axis.visibleLabels.length; i < len; i++) {\n pointX = isLabelInside ? (rect.x - padding) : (rect.x + padding + scrollBarHeight);\n elementSize = axis.visibleLabels[i].size;\n pointY = (valueToCoefficient(axis.visibleLabels[i].value, axis) * rect.height) + (chart.stockChart ? 7 : 0);\n pointY = Math.floor((pointY * -1) + (rect.y + rect.height));\n if (typeof axis.visibleLabels[i].text !== 'string') {\n if (axis.isInversed) {\n pointY = i === 0 ? pointY + 5 : (i === axis.visibleLabels.length - 1 ? pointY - 5 : pointY);\n }\n else {\n pointY = i === 0 ? pointY - 5 : pointY - (elementSize.height / 4);\n }\n }\n else {\n pointY = pointY + (elementSize.height / 4);\n }\n options = new TextOption(chart.element.id + index + '_AxisLabel_' + i, pointX, pointY, anchor, axis.visibleLabels[i].text);\n if (axis.edgeLabelPlacement) {\n switch (axis.edgeLabelPlacement) {\n case 'None':\n break;\n case 'Hide':\n if (((i === 0 || (axis.isInversed && i === len - 1)) && options.y > rect.y + rect.height) ||\n (((i === len - 1) || (axis.isInversed && i === 0)) && options.y - elementSize.height / 2 < rect.y)) {\n options.text = '';\n }\n break;\n case 'Shift':\n if ((i === 0 || (axis.isInversed && i === len - 1)) && options.y > rect.y + rect.height) {\n options.y = pointY = rect.y + rect.height;\n }\n else if (((i === len - 1) || (axis.isInversed && i === 0)) && (options.y - elementSize.height / 2 < rect.y)) {\n options.y = pointY = rect.y + elementSize.height / 2;\n }\n break;\n }\n }\n textElement(options, axis.labelStyle, axis.labelStyle.color || chart.themeStyle.axisLabel, labelElement, false, chart.redraw, true, true).setAttribute('text-content', options.text);\n }\n if (!chart.delayRedraw) {\n appendChildElement(parent, labelElement, chart.redraw);\n }\n else if (axis.visible) {\n this.createZoomingLabel(this.chart, labelElement, axis, index, rect);\n }\n };\n /**\n * To render the yAxis label border.\n * @param axis\n * @param index\n * @param parent\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.drawYAxisBorder = function (axis, index, parent, rect) {\n if (axis.border.width > 0) {\n var startY = void 0;\n var pointY = void 0;\n var scrollBarHeight = axis.labelPosition === 'Outside' ? axis.scrollBarHeight : 0;\n scrollBarHeight = (axis.opposedPosition ? 1 : -1) * scrollBarHeight;\n var gap = (rect.height / axis.visibleRange.delta) * (axis.valueType === 'DateTime' ? axis.dateTimeInterval\n : axis.visibleRange.interval);\n var endY = void 0;\n var length_1 = axis.maxLabelSize.width + 10 + ((axis.tickPosition === axis.labelPosition) ?\n axis.majorTickLines.height : 0);\n var labelBorder = '';\n var ticksbwtLabel = (axis.valueType === 'Category' && axis.labelPlacement === 'BetweenTicks') ? -0.5 : 0;\n var endX = ((axis.opposedPosition && axis.labelPosition === 'Inside') || (!axis.opposedPosition\n && axis.labelPosition === 'Outside')) ? rect.x - length_1 + scrollBarHeight : rect.x + length_1 + scrollBarHeight;\n for (var i = 0; i < axis.visibleLabels.length; i++) {\n pointY = valueToCoefficient(axis.visibleLabels[i].value + ticksbwtLabel, axis);\n pointY = (axis.isInversed ? (1 - pointY) : pointY) * rect.height;\n if (axis.valueType === 'Category' && axis.labelPlacement === 'BetweenTicks') {\n startY = Math.floor((pointY * -1) + (rect.y + rect.height));\n endY = Math.floor((pointY * -1) - (gap) + (rect.y + rect.height));\n }\n else {\n startY = Math.floor((pointY * -1) + gap / 2 + (rect.y + rect.height));\n endY = Math.floor((pointY * -1) - gap / 2 + (rect.y + rect.height));\n }\n switch (axis.border.type) {\n case 'Rectangle':\n case 'WithoutTopBorder':\n if (startY > (rect.y + rect.height)) {\n labelBorder += ('M' + ' ' + endX + ' ' + (rect.y + rect.height) + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ');\n }\n else if (Math.floor(rect.y) > (endY)) {\n labelBorder += ('M' + ' ' + (rect.x + scrollBarHeight) + ' ' + startY + ' ' + 'L' + ' ' + endX\n + ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + (rect.y) + ' ');\n }\n else {\n labelBorder += ('M' + ' ' + (rect.x + scrollBarHeight) + ' ' + startY + ' ' + 'L' + ' ' + endX +\n ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ');\n if (i === axis.visibleLabels.length - 1) {\n labelBorder += ('M' + ' ' + (rect.x + scrollBarHeight) + ' ' + endY + ' ' + 'L' + ' ' +\n endX + ' ' + endY + ' ');\n }\n }\n break;\n case 'WithoutTopandBottomBorder':\n if (!(startY > rect.y + rect.height) && !((endY) < Math.floor(rect.y))) {\n labelBorder += ('M' + ' ' + (rect.x + scrollBarHeight) + ' ' + startY + ' ' + 'L' + ' ' + endX +\n ' ' + startY + ' ' + 'M' + ' ' + endX + ' ' + endY + ' ' +\n 'L' + ' ' + (rect.x + scrollBarHeight) + ' ' + endY);\n }\n break;\n }\n }\n labelBorder += (axis.border.type === 'Rectangle') ? ('M' + ' ' + (rect.x + scrollBarHeight) + ' ' + rect.y + ' ' + 'L' + ' ' +\n (rect.x + scrollBarHeight) + ' ' + (rect.y + rect.height) + ' ') : '';\n if (labelBorder !== '') {\n this.createAxisBorderElement(axis, index, labelBorder, parent);\n }\n }\n if (axis.multiLevelLabels.length > 0 && this.chart.multiLevelLabelModule) {\n this.chart.multiLevelLabelModule.renderYAxisMultiLevelLabels(axis, index, parent, rect);\n }\n };\n /**\n * To render the yAxis title\n * @param axis\n * @param index\n * @param parent\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.drawYAxisTitle = function (axis, index, parent, rect) {\n var chart = this.chart;\n var labelRotation = (axis.opposedPosition) ? 90 : -90;\n var elementSize = measureText(axis.title, axis.titleStyle);\n var padding = (axis.tickPosition === 'Inside' ? 0 : axis.majorTickLines.height + this.padding) +\n (axis.labelPosition === 'Inside' ? 0 :\n (axis.maxLabelSize.width + axis.multiLevelLabelHeight + this.padding));\n padding = axis.opposedPosition ? padding + axis.scrollBarHeight : -padding - axis.scrollBarHeight;\n var x = rect.x + padding;\n var y = rect.y + rect.height / 2;\n var options = new TextOption(chart.element.id + '_AxisTitle_' + index, x, y - this.padding, 'middle', axis.title, 'rotate(' + labelRotation + ',' + (x) + ',' + (y) + ')');\n var element = textElement(options, axis.titleStyle, axis.titleStyle.color || chart.themeStyle.axisTitle, parent);\n element.setAttribute('tabindex', axis.tabIndex.toString());\n element.setAttribute('aria-label', axis.description || axis.title);\n };\n /**\n * xAxis grid line calculation performed here\n * @param axis\n * @param index\n * @param parent\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.drawXAxisGridLine = function (axis, index, parent, rect) {\n var tempInterval;\n var pointX = 0;\n var majorGrid = '';\n var majorTick = '';\n var minorDirection;\n var tickSize = (axis.opposedPosition) ? -axis.majorTickLines.height : axis.majorTickLines.height;\n var axisLineSize = (axis.opposedPosition) ? -axis.lineStyle.width / 2 : axis.lineStyle.width / 2;\n var scrollBarHeight = isNullOrUndefined(axis.crossesAt) ? axis.opposedPosition ? -axis.scrollBarHeight :\n axis.scrollBarHeight : 0;\n var ticksbwtLabel = (axis.valueType.indexOf('Category') > -1 && axis.labelPlacement === 'BetweenTicks') ?\n 0.5 : 0;\n var length = axis.visibleLabels.length;\n var isTickInside = axis.tickPosition === 'Inside';\n var ticks = isTickInside ? (rect.y - tickSize - axisLineSize) : (rect.y + tickSize + axisLineSize + scrollBarHeight);\n var chart = this.chart;\n if (axis.valueType.indexOf('Category') > -1 && length > 0 && axis.labelPlacement === 'BetweenTicks') {\n length += 1;\n }\n //Gridlines\n for (var i = 0; i < length; i++) {\n if (axis.valueType !== 'DateTimeCategory') {\n tempInterval = axis.visibleLabels[i] ? axis.visibleLabels[i].value - ticksbwtLabel\n : (axis.visibleLabels[i - 1].value + axis.visibleRange.interval) - ticksbwtLabel;\n }\n else {\n tempInterval = axis.visibleLabels[i] ?\n axis.visibleLabels[i].value - ticksbwtLabel : axis.visibleRange.max;\n }\n pointX = (valueToCoefficient(tempInterval, axis) * rect.width) + rect.x;\n if (pointX >= rect.x && (rect.x + rect.width) >= pointX) {\n if (inside(tempInterval, axis.visibleRange) || this.isBorder(axis, i, pointX)) {\n majorGrid = 'M ' + pointX + ' ' + (this.seriesClipRect.y + this.seriesClipRect.height) +\n ' L ' + pointX + ' ' + this.seriesClipRect.y;\n this.renderGridLine(axis, index, majorGrid, axis.majorGridLines, '_MajorGridLine_', i, this.element, chart.themeStyle.majorGridLine, axis.majorGridLines.dashArray);\n }\n majorTick = 'M ' + (pointX) + ' ' + (rect.y + axisLineSize + (isTickInside ? scrollBarHeight : 0))\n + ' L ' + (pointX) + ' ' + ticks;\n this.renderGridLine(axis, index, majorTick, axis.majorTickLines, '_MajorTickLine_', i, parent, chart.themeStyle.majorTickLine);\n if (axis.minorTicksPerInterval > 0 && (axis.minorGridLines.width > 0 || axis.minorTickLines.width > 0)) {\n minorDirection = this.drawAxisMinorLine(axis, tempInterval, rect, i);\n this.renderGridLine(axis, index, minorDirection[0], axis.minorGridLines, '_MinorGridLine_', i, this.element, chart.themeStyle.minorGridLine, axis.minorGridLines.dashArray);\n this.renderGridLine(axis, index, minorDirection[1], axis.minorTickLines, '_MinorTickLine_', i, parent, chart.themeStyle.minorTickLine);\n }\n }\n }\n };\n /**\n * To calcualte the axis minor line\n * @param axis\n * @param tempInterval\n * @param rect\n * @param labelIndex\n */\n CartesianAxisLayoutPanel.prototype.drawAxisMinorLine = function (axis, tempInterval, rect, labelIndex) {\n var value = tempInterval;\n var coor = 0;\n var position = 0;\n var range = axis.visibleRange;\n var isTickInside = axis.tickPosition === 'Inside';\n var direction = [];\n var tickSize = axis.opposedPosition ? -axis.minorTickLines.height : axis.minorTickLines.height;\n var logStart;\n var logEnd;\n var logInterval = 1;\n var logPosition = 1;\n var ticksX = isTickInside ? (rect.y - tickSize) : (rect.y + tickSize);\n var ticksY = isTickInside ? (rect.x + tickSize) : (rect.x - tickSize);\n var minorGird = '';\n var minorTick = '';\n if (axis.valueType === 'Logarithmic') {\n logStart = Math.pow(axis.logBase, value - range.interval);\n logEnd = Math.pow(axis.logBase, value);\n logInterval = (logEnd - logStart) / (axis.minorTicksPerInterval + 1);\n logPosition = logStart + logInterval;\n }\n if (axis.orientation === 'Horizontal') {\n for (var j = 0; j < axis.minorTicksPerInterval; j++) {\n value = this.findLogNumeric(axis, logPosition, logInterval, value, labelIndex);\n logPosition += logInterval;\n if (inside(value, range)) {\n position = ((value - range.min) / (range.max - range.min));\n position = Math.ceil((axis.isInversed ? (1 - position) : position) * rect.width);\n coor = (Math.floor(position + rect.x));\n minorGird = minorGird.concat('M' + ' ' + coor + ' ' + (this.seriesClipRect.y)\n + 'L ' + coor + ' ' + (this.seriesClipRect.y + this.seriesClipRect.height));\n coor = (Math.floor(position + rect.x));\n minorTick = minorTick.concat('M' + ' ' + coor + ' ' + (rect.y)\n + 'L ' + coor + ' ' + (ticksX + axis.scrollBarHeight));\n }\n }\n }\n else {\n tickSize = axis.opposedPosition ? axis.minorTickLines.height : -axis.minorTickLines.height;\n for (var j = 0; j < axis.minorTicksPerInterval; j++) {\n value = this.findLogNumeric(axis, logPosition, logInterval, value, labelIndex);\n if (inside(value, range)) {\n position = Math.ceil(((value - range.min) / (range.max - range.min)) * rect.height) * -1;\n coor = (Math.floor(position + rect.y + rect.height));\n minorGird = minorGird.concat('M' + ' ' + (this.seriesClipRect.x) + ' ' + coor\n + 'L ' + (this.seriesClipRect.x + this.seriesClipRect.width) + ' ' + coor + ' ');\n coor = (Math.floor(position + rect.y + rect.height));\n minorTick = minorTick.concat('M' + ' ' + rect.x + ' ' + coor + 'L ' + (ticksY - axis.scrollBarHeight) +\n ' ' + coor + ' ');\n }\n logPosition += logInterval;\n }\n }\n direction.push(minorGird);\n direction.push(minorTick);\n return direction;\n };\n /**\n * To find the numeric value of the log\n * @param axis\n * @param logPosition\n * @param logInterval\n * @param value\n * @param labelIndex\n */\n CartesianAxisLayoutPanel.prototype.findLogNumeric = function (axis, logPosition, logInterval, value, labelIndex) {\n var range = axis.visibleRange;\n if (axis.valueType === 'Logarithmic') {\n value = logBase(logPosition, axis.logBase);\n }\n else if (axis.valueType === 'DateTime') {\n value += axis.dateTimeInterval / (axis.minorTicksPerInterval + 1);\n }\n else if (axis.valueType === 'DateTimeCategory') {\n var padding = axis.labelPlacement === 'BetweenTicks' ? 0.5 : 0;\n value += ((axis.visibleLabels[labelIndex + 1] ?\n axis.visibleLabels[labelIndex + 1].value - padding : axis.visibleRange.max) -\n (axis.visibleLabels[labelIndex] ?\n axis.visibleLabels[labelIndex].value - padding : axis.visibleRange.min)) /\n (axis.minorTicksPerInterval + 1);\n }\n else {\n value += range.interval / (axis.minorTicksPerInterval + 1);\n }\n return value;\n };\n /**\n * To render the xAxis Labels\n * @param axis\n * @param index\n * @param parent\n * @param rect\n * @private\n */\n CartesianAxisLayoutPanel.prototype.drawXAxisLabels = function (axis, index, parent, rect) {\n var chart = this.chart;\n var pointX = 0;\n var pointY = 0;\n var elementSize;\n var labelPadding;\n var xValue = 0;\n var labelElement = chart.renderer.createGroup({ id: chart.element.id + 'AxisLabels' + index });\n var islabelInside = axis.labelPosition === 'Inside';\n var isOpposed = axis.opposedPosition;\n var tickSpace = axis.labelPosition === axis.tickPosition ? axis.majorTickLines.height : 0;\n var padding = tickSpace + this.padding + axis.lineStyle.width / 2;\n var rotateSize;\n var diffHeight;\n var angle = axis.angle % 360;\n var anglePadding = ((angle === 90 || angle === -90)) ? -2 : 0;\n var options;\n var yLocation;\n var previousEnd = axis.isInversed ? (rect.x + rect.width) : rect.x;\n var width = 0;\n var length = axis.visibleLabels.length;\n var intervalLength;\n var label;\n var breakLabels;\n var scrollBarHeight = axis.scrollbarSettings.enable || (!islabelInside && isNullOrUndefined(axis.crossesAt)\n && (axis.zoomFactor < 1 || axis.zoomPosition > 0)) ? axis.scrollBarHeight : 0;\n for (var i = 0, len = length; i < len; i++) {\n label = axis.visibleLabels[i];\n breakLabels = label.originalText;\n pointX = xValue = (valueToCoefficient(label.value, axis) * rect.width) + rect.x;\n if (breakLabels.indexOf('
') !== -1) {\n elementSize = measureText(breakLabels.replace(/
/g, ' '), axis.labelStyle);\n }\n else {\n elementSize = label.size;\n }\n intervalLength = rect.width / length;\n width = ((axis.labelIntersectAction === 'Trim' || axis.labelIntersectAction === 'Wrap') && angle === 0\n && elementSize.width > intervalLength) ? intervalLength : elementSize.width;\n if (breakLabels.indexOf('
') !== -1 && label.breakLabelSize.width < axis.maxLabelSize.width) {\n pointX -= label.breakLabelSize.width / 2;\n }\n else {\n pointX -= width / 2;\n }\n pointX = axis.enableTrim && breakLabels.indexOf('
') !== -1 ? (xValue - (label.breakLabelSize.height / 4)) : pointX;\n if (islabelInside && angle) {\n pointY = isOpposed ? (rect.y + padding) : (rect.y - padding);\n }\n else {\n labelPadding = ((isOpposed && !islabelInside) || (!isOpposed && islabelInside)) ?\n -(padding + scrollBarHeight + (angle ? ((elementSize.height / 2) + (2 * axis.maxLabelSize.height / 5)) :\n (label.index > 1 ? (2 * (elementSize.height / 4)) : 0))) :\n padding + scrollBarHeight + (angle ? (axis.maxLabelSize.height / 2) : (3 * (elementSize.height / 4)));\n pointY = (rect.y + (labelPadding * label.index));\n }\n options = new TextOption(chart.element.id + index + '_AxisLabel_' + i, pointX, pointY, '');\n if (axis.edgeLabelPlacement) {\n switch (axis.edgeLabelPlacement) {\n case 'None':\n break;\n case 'Hide':\n if (((i === 0 || (axis.isInversed && i === len - 1)) && options.x < rect.x) ||\n ((i === len - 1 || (axis.isInversed && i === 0)) && (options.x + width > rect.x + rect.width))) {\n continue;\n }\n break;\n case 'Shift':\n if ((i === 0 || (axis.isInversed && i === len - 1)) && options.x < rect.x) {\n intervalLength -= (rect.x - options.x);\n options.x = pointX = rect.x;\n }\n else if ((i === len - 1 || (axis.isInversed && i === 0)) && ((options.x + width) > rect.x + rect.width)) {\n if (elementSize.width > intervalLength && axis.labelIntersectAction === 'Trim') {\n intervalLength -= (options.x + width - (rect.x + rect.width));\n }\n else {\n intervalLength = width;\n }\n options.x = pointX = rect.x + rect.width - intervalLength;\n }\n break;\n }\n }\n options.text = this.getLabelText(breakLabels, label, axis, intervalLength);\n if (angle === 0 && axis.labelIntersectAction === 'Hide' && i !== 0 &&\n (!axis.isInversed ? options.x <= previousEnd : options.x + width >= previousEnd)) {\n continue;\n }\n previousEnd = axis.isInversed ? options.x : options.x + width;\n if (angle !== 0) {\n rotateSize = rotateTextSize(axis.labelStyle, label.text, angle, chart);\n diffHeight = islabelInside ? rotateSize.height :\n axis.maxLabelSize.height - Math.ceil(rotateSize.height);\n yLocation = axis.opposedPosition ? diffHeight / 2 : -diffHeight / 2;\n options.transform = 'rotate(' + angle + ',' + (pointX + width / 2 + anglePadding) + ','\n + (pointY + yLocation) + ')';\n options.y += yLocation;\n }\n textElement(options, label.labelStyle, label.labelStyle.color || chart.themeStyle.axisLabel, labelElement, (axis.opposedPosition !== (axis.labelPosition === 'Inside')), chart.redraw, true).setAttribute('style', 'cursor: default');\n }\n if (!chart.delayRedraw) {\n parent.appendChild(labelElement);\n }\n else if (axis.visible) {\n this.createZoomingLabel(this.chart, labelElement, axis, index, rect);\n }\n };\n /**\n * To get axis label text\n * @param breakLabels\n * @param label\n * @param axis\n * @param intervalLength\n */\n CartesianAxisLayoutPanel.prototype.getLabelText = function (breakLabels, label, axis, intervalLength) {\n if (breakLabels.indexOf('
') !== -1) {\n var result1 = [];\n var str = void 0;\n var labelArray = breakLabels.split('
');\n if (axis.enableTrim) {\n for (var index = 0; index < labelArray.length; index++) {\n str = textTrim(axis.maximumLabelWidth, labelArray[index], axis.labelStyle);\n result1.push(str);\n }\n return result1;\n }\n else {\n for (var index = 0; index < label.text.length; index++) {\n str = this.findAxisLabel(axis, label.text[index], intervalLength);\n result1.push(str);\n }\n return result1;\n }\n }\n else {\n return this.findAxisLabel(axis, label.text, intervalLength);\n }\n };\n /**\n * To render the x-axis label border.\n * @param axis\n * @param index\n * @param parent\n * @param axisRect\n */\n CartesianAxisLayoutPanel.prototype.drawXAxisBorder = function (axis, index, parent, axisRect) {\n if (axis.border.width > 0) {\n var scrollBarHeight = axis.labelPosition === 'Outside' ? axis.scrollBarHeight : 0;\n var startX = void 0;\n var startY = axisRect.y + ((axis.opposedPosition ? -1 : 1) * scrollBarHeight);\n var padding = 10;\n var pointX = void 0;\n var gap = (axisRect.width / axis.visibleRange.delta) * (axis.valueType === 'DateTime' ? axis.dateTimeInterval\n : axis.visibleRange.interval);\n var endX = void 0;\n var length_2 = axis.maxLabelSize.height +\n ((axis.tickPosition === axis.labelPosition) ? axis.majorTickLines.height : 0);\n var labelBorder = '';\n var ticksbwtLabel = (axis.valueType === 'Category' && axis.labelPlacement === 'BetweenTicks') ? -0.5 : 0;\n var endY = ((axis.opposedPosition && axis.labelPosition === 'Inside') ||\n (!axis.opposedPosition && axis.labelPosition === 'Outside')) ?\n (axisRect.y + length_2 + padding + scrollBarHeight) : (axisRect.y - length_2 - padding - scrollBarHeight);\n for (var i = 0; i < axis.visibleLabels.length; i++) {\n pointX = valueToCoefficient(axis.visibleLabels[i].value + ticksbwtLabel, axis);\n pointX = (axis.isInversed ? (1 - pointX) : pointX) * axisRect.width;\n if (axis.valueType === 'Category' && axis.labelPlacement === 'BetweenTicks') {\n startX = pointX + axisRect.x;\n endX = pointX + (gap) + axisRect.x;\n }\n else {\n startX = pointX - gap / 2 + axisRect.x;\n endX = pointX + gap / 2 + axisRect.x;\n }\n switch (axis.border.type) {\n case 'Rectangle':\n case 'WithoutTopBorder':\n if (startX < axisRect.x) {\n labelBorder += ('M' + ' ' + axisRect.x + ' ' + endY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ');\n }\n else if (Math.floor(endX) > axisRect.width + axisRect.x) {\n labelBorder += ('M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ' +\n 'L' + ' ' + (axisRect.width + axisRect.x) + ' ' + endY + ' ');\n }\n else {\n labelBorder += ('M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' +\n endY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ');\n if (i === axis.visibleLabels.length - 1) {\n labelBorder += ('M' + ' ' + endX + ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ' +\n 'M ' + endX + ' ' + endY + ' L ' + (axisRect.width + axisRect.x) + ' ' + endY);\n }\n }\n break;\n case 'WithoutTopandBottomBorder':\n if (!(startX < axisRect.x) && !(Math.floor(endX) > axisRect.width + axisRect.x)) {\n labelBorder += ('M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ' +\n 'M ' + endX + ' ' + startY + ' L ' + endX + ' ' + endY);\n }\n break;\n }\n }\n labelBorder += (axis.border.type === 'Rectangle' ? ('M ' + ' ' + axisRect.x + ' ' + startY + 'L' + ' ' +\n (axisRect.x + axisRect.width) + ' ' + startY) : '');\n if (labelBorder !== '') {\n this.createAxisBorderElement(axis, index, labelBorder, parent);\n }\n }\n if (this.chart.multiLevelLabelModule && axis.multiLevelLabels.length > 0) {\n this.chart.multiLevelLabelModule.renderXAxisMultiLevelLabels(axis, index, parent, axisRect);\n }\n };\n /**\n * To create border element of the axis\n * @param axis\n * @param index\n * @param labelBorder\n * @param parent\n */\n CartesianAxisLayoutPanel.prototype.createAxisBorderElement = function (axis, index, labelBorder, parent) {\n var element = getElement(this.chart.element.id + '_BorderLine_' + index);\n var direction = element ? element.getAttribute('d') : '';\n var borderElement = this.chart.renderer.drawPath(new PathOption(this.chart.element.id + '_BorderLine_' + index, 'transparent', axis.border.width, axis.border.color || this.chart.themeStyle.axisLine, 1, '', labelBorder));\n borderElement.setAttribute('style', 'pointer-events: none');\n appendChildElement(parent, borderElement, this.chart.redraw, true, 'x', 'y', null, direction, true);\n };\n /**\n * To find the axis label of the intersect action\n * @param axis\n * @param label\n * @param width\n */\n CartesianAxisLayoutPanel.prototype.findAxisLabel = function (axis, label, width) {\n switch (axis.labelIntersectAction) {\n case 'Trim':\n return (axis.angle === 0 && !axis.enableTrim) ? textTrim(width, label, axis.labelStyle) : label;\n default:\n return label;\n }\n };\n /**\n * X-Axis Title function performed\n * @param axis\n * @param index\n * @param parent\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.drawXAxisTitle = function (axis, index, parent, rect) {\n var chart = this.chart;\n var elementSize = measureText(axis.title, axis.titleStyle);\n var scrollBarHeight = isNullOrUndefined(axis.crossesAt) ? axis.scrollBarHeight : 0;\n var padding = (axis.tickPosition === 'Inside' ? 0 : axis.majorTickLines.height + this.padding) +\n (axis.labelPosition === 'Inside' ? 0 :\n axis.maxLabelSize.height + axis.multiLevelLabelHeight + this.padding);\n padding = axis.opposedPosition ? -(padding + elementSize.height / 4 + scrollBarHeight) : (padding + (3 *\n elementSize.height / 4) + scrollBarHeight);\n var options = new TextOption(chart.element.id + '_AxisTitle_' + index, rect.x + rect.width / 2, rect.y + padding, 'middle', axis.title);\n var element = textElement(options, axis.titleStyle, axis.titleStyle.color || chart.themeStyle.axisTitle, parent);\n element.setAttribute('aria-label', axis.description || axis.title);\n element.setAttribute('tabindex', axis.tabIndex.toString());\n };\n /**\n * To render the axis grid and tick lines(Both Major and Minor)\n * @param axis\n * @param index\n * @param gridDirection\n * @param gridModel\n * @param gridId\n * @param gridIndex\n * @param parent\n * @param themeColor\n * @param dashArray\n */\n CartesianAxisLayoutPanel.prototype.renderGridLine = function (axis, index, gridDirection, gridModel, gridId, gridIndex, parent, themeColor, dashArray) {\n if (dashArray === void 0) { dashArray = null; }\n var options;\n var chart = this.chart;\n var direction;\n var element;\n if (gridModel.width > 0 && axis.visible && gridDirection) {\n element = getElement(chart.element.id + gridId + index + '_' + gridIndex);\n direction = element ? element.getAttribute('d') : null;\n this.htmlObject = chart.renderer.drawPath(new PathOption(chart.element.id + gridId + index + '_' + gridIndex, 'transparent', gridModel.width, gridModel.color || themeColor, null, dashArray, gridDirection));\n appendChildElement(parent, this.htmlObject, chart.redraw, true, 'x', 'y', null, direction, true);\n }\n };\n /**\n * To Find the parent node of the axis\n * @param chart\n * @param label\n * @param axis\n * @param index\n */\n CartesianAxisLayoutPanel.prototype.findParentNode = function (chart, label, axis, index) {\n if (axis.crossAt === null) {\n return document.getElementById(chart.element.id + 'AxisGroup' + index + 'Inside');\n }\n if (document.getElementById(chart.element.id + 'AxisGroup' + index + 'Inside').contains(document.getElementById(label.id))) {\n return document.getElementById(chart.element.id + 'AxisGroup' + index + 'Inside');\n }\n else {\n return document.getElementById(chart.element.id + 'AxisGroup' + index + 'Outside');\n }\n };\n /**\n * Create Zooming Labels Function Called here\n * @param chart\n * @param labelElement\n * @param axis\n * @param index\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.createZoomingLabel = function (chart, labelElement, axis, index, rect) {\n var parentNode = this.findParentNode(chart, labelElement, axis, index);\n labelElement.setAttribute('opacity', '0.3');\n var zoomElement = chart.renderer.createGroup({\n id: chart.element.id + 'AxisLabels_Zoom' + index\n });\n zoomElement = createZoomingLabels(chart, axis, zoomElement, index, axis.orientation === 'Vertical', rect);\n parentNode.replaceChild(labelElement, document.getElementById(labelElement.id));\n if (getElement(chart.element.id + 'AxisLabels_Zoom' + index)) {\n parentNode.replaceChild(zoomElement, document.getElementById(zoomElement.id));\n }\n else {\n parentNode.appendChild(zoomElement);\n }\n };\n return CartesianAxisLayoutPanel;\n}());\nexport { CartesianAxisLayoutPanel };\n","import { withInBounds, PointData, getValueXByPoint, getValueYByPoint } from '../../common/utils/helper';\nimport { Rect } from '@syncfusion/ej2-svg-base';\n/**\n * To get the data on mouse move.\n * @private\n */\nvar ChartData = /** @class */ (function () {\n /**\n * Constructor for the data.\n * @private\n */\n function ChartData(chart) {\n /** @private */\n this.currentPoints = [];\n /** @private */\n this.previousPoints = [];\n this.chart = chart;\n this.lierIndex = 0;\n }\n /**\n * Method to get the Data.\n * @private\n */\n ChartData.prototype.getData = function () {\n var chart = this.chart;\n var point = null;\n var series = null;\n var width;\n var height;\n for (var len = chart.visibleSeries.length, i = len - 1; i >= 0; i--) {\n series = chart.visibleSeries[i];\n width = (series.type === 'Scatter' || series.drawType === 'Scatter' || (!series.isRectSeries && series.marker.visible))\n ? (series.marker.height + 5) / 2 : 0;\n height = (series.type === 'Scatter' || series.drawType === 'Scatter' || (!series.isRectSeries && series.marker.visible))\n ? (series.marker.width + 5) / 2 : 0;\n if (series.visible && withInBounds(chart.mouseX, chart.mouseY, series.clipRect, width, height)) {\n point = this.getRectPoint(series, series.clipRect, chart.mouseX, chart.mouseY);\n }\n if (point) {\n return new PointData(point, series);\n }\n }\n return new PointData(point, series);\n };\n ChartData.prototype.isSelected = function (chart) {\n return (chart.selectionMode.indexOf('Drag') > -1 && chart.selectionModule && chart.selectionModule.rectPoints !== null);\n };\n ChartData.prototype.getRectPoint = function (series, rect, x, y) {\n var currentRect;\n var fromCenterX;\n var fromCenterY;\n var clickAngle;\n var arcAngle = 0;\n var startAngle;\n var endAngle;\n var distanceFromCenter;\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n if (!point.regionData) {\n if (!point.regions || !point.regions.length) {\n continue;\n }\n }\n if (point.regionData && this.chart.chartAreaType === 'PolarRadar' && series.drawType.indexOf('Column') > -1) {\n fromCenterX = x - (series.clipRect.width / 2 + series.clipRect.x);\n fromCenterY = y - (series.clipRect.height / 2 + series.clipRect.y);\n arcAngle = 2 * Math.PI * (point.regionData.currentXPosition < 0 ? 1 + point.regionData.currentXPosition\n : point.regionData.currentXPosition);\n clickAngle = (Math.atan2(fromCenterY, fromCenterX) + 0.5 * Math.PI - arcAngle) % (2 * Math.PI);\n clickAngle = clickAngle < 0 ? 2 * Math.PI + clickAngle : clickAngle;\n clickAngle = clickAngle + 2 * Math.PI * series.chart.primaryXAxis.startAngle;\n startAngle = point.regionData.startAngle;\n startAngle -= arcAngle;\n startAngle = startAngle < 0 ? 2 * Math.PI + startAngle : startAngle;\n endAngle = point.regionData.endAngle;\n endAngle -= arcAngle;\n endAngle = endAngle < 0 ? 2 * Math.PI + endAngle : endAngle;\n distanceFromCenter = Math.sqrt(Math.pow(Math.abs(fromCenterX), 2) + Math.pow(Math.abs(fromCenterY), 2));\n if (clickAngle >= startAngle && clickAngle <= endAngle &&\n (((distanceFromCenter >= point.regionData.innerRadius && distanceFromCenter <= point.regionData.radius) ||\n (distanceFromCenter <= point.regionData.innerRadius && distanceFromCenter >= point.regionData.radius))\n && distanceFromCenter <= series.chart.radius)) {\n return point;\n }\n }\n else if (this.checkRegionContainsPoint(point.regions, rect, x, y)) {\n return point;\n }\n }\n return null;\n };\n /**\n * Checks whether the region contains a point\n */\n ChartData.prototype.checkRegionContainsPoint = function (regionRect, rect, x, y) {\n var _this = this;\n return regionRect.some(function (region, index) {\n _this.lierIndex = index;\n return withInBounds(x, y, new Rect((_this.chart.chartAreaType === 'Cartesian' ? rect.x : 0) + region.x, (_this.chart.chartAreaType === 'Cartesian' ? rect.y : 0) + region.y, region.width, region.height));\n });\n };\n /**\n * @private\n */\n ChartData.prototype.getClosest = function (series, value) {\n var xData = series.xData;\n var closest;\n if (value >= series.xMin - 0.5 && value <= series.xMax + 0.5) {\n for (var _i = 0, xData_1 = xData; _i < xData_1.length; _i++) {\n var data = xData_1[_i];\n if (closest == null || Math.abs(data - value) < Math.abs(closest - value)) {\n closest = data;\n }\n }\n }\n return closest;\n };\n ChartData.prototype.getClosestX = function (chart, series) {\n var value;\n var rect = series.clipRect;\n if (!chart.requireInvertedAxis) {\n value = getValueXByPoint(chart.mouseX - rect.x, rect.width, series.xAxis);\n }\n else {\n value = getValueYByPoint(chart.mouseY - rect.y, rect.height, series.xAxis);\n }\n var closest = this.getClosest(series, value);\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n if (closest === point.xValue && point.visible) {\n return new PointData(point, series);\n }\n }\n return null;\n };\n return ChartData;\n}());\nexport { ChartData };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty, Complex, Collection, getValue } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, extend } from '@syncfusion/ej2-base';\nimport { StackValues, RectOption, appendChildElement, appendClipElement } from '../../common/utils/helper';\nimport { firstToLowerCase, CircleOption } from '../../common/utils/helper';\nimport { Rect } from '@syncfusion/ej2-svg-base';\nimport { Border, Font, Margin, Animation, EmptyPointSettings, CornerRadius, Connector } from '../../common/model/base';\nimport { DataManager, DataUtil } from '@syncfusion/ej2-data';\nimport { seriesRender } from '../../common/model/constants';\nimport { sort } from '../../common/utils/helper';\nimport { Browser } from '@syncfusion/ej2-base';\n/**\n * Configures the data label in the series.\n */\nvar DataLabelSettings = /** @class */ (function (_super) {\n __extends(DataLabelSettings, _super);\n function DataLabelSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], DataLabelSettings.prototype, \"visible\", void 0);\n __decorate([\n Property(null)\n ], DataLabelSettings.prototype, \"name\", void 0);\n __decorate([\n Property('transparent')\n ], DataLabelSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(1)\n ], DataLabelSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property('Auto')\n ], DataLabelSettings.prototype, \"position\", void 0);\n __decorate([\n Property(5)\n ], DataLabelSettings.prototype, \"rx\", void 0);\n __decorate([\n Property(5)\n ], DataLabelSettings.prototype, \"ry\", void 0);\n __decorate([\n Property('Center')\n ], DataLabelSettings.prototype, \"alignment\", void 0);\n __decorate([\n Complex({ width: null, color: null }, Border)\n ], DataLabelSettings.prototype, \"border\", void 0);\n __decorate([\n Complex({ left: 5, right: 5, top: 5, bottom: 5 }, Margin)\n ], DataLabelSettings.prototype, \"margin\", void 0);\n __decorate([\n Complex({ size: '11px', color: '', fontStyle: 'Normal', fontWeight: 'Normal', fontFamily: 'Segoe UI' }, Font)\n ], DataLabelSettings.prototype, \"font\", void 0);\n __decorate([\n Property(null)\n ], DataLabelSettings.prototype, \"template\", void 0);\n return DataLabelSettings;\n}(ChildProperty));\nexport { DataLabelSettings };\n/**\n * Configures the marker in the series.\n */\nvar MarkerSettings = /** @class */ (function (_super) {\n __extends(MarkerSettings, _super);\n function MarkerSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], MarkerSettings.prototype, \"visible\", void 0);\n __decorate([\n Property('Circle')\n ], MarkerSettings.prototype, \"shape\", void 0);\n __decorate([\n Property('')\n ], MarkerSettings.prototype, \"imageUrl\", void 0);\n __decorate([\n Property(5)\n ], MarkerSettings.prototype, \"height\", void 0);\n __decorate([\n Property(5)\n ], MarkerSettings.prototype, \"width\", void 0);\n __decorate([\n Complex({ width: 2, color: null }, Border)\n ], MarkerSettings.prototype, \"border\", void 0);\n __decorate([\n Property(null)\n ], MarkerSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(1)\n ], MarkerSettings.prototype, \"opacity\", void 0);\n __decorate([\n Complex({}, DataLabelSettings)\n ], MarkerSettings.prototype, \"dataLabel\", void 0);\n return MarkerSettings;\n}(ChildProperty));\nexport { MarkerSettings };\n/**\n * Points model for the series.\n * @private\n */\nvar Points = /** @class */ (function () {\n function Points() {\n this.symbolLocations = null;\n this.regions = null;\n this.percentage = null;\n this.regionData = null;\n this.marker = {\n visible: false\n };\n }\n return Points;\n}());\nexport { Points };\n/**\n * Defines the behavior of the Trendlines\n */\nvar Trendline = /** @class */ (function (_super) {\n __extends(Trendline, _super);\n function Trendline() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n /** @private */\n _this.clipRect = new Rect(0, 0, 0, 0);\n return _this;\n }\n /** @private */\n Trendline.prototype.setDataSource = function (series, chart) {\n if (series) {\n this.points = series.points;\n }\n var type = firstToLowerCase(this.type);\n chart.trendLineModule.initDataSource(this, chart);\n chart.visibleSeriesCount++;\n };\n __decorate([\n Property('')\n ], Trendline.prototype, \"name\", void 0);\n __decorate([\n Property('Linear')\n ], Trendline.prototype, \"type\", void 0);\n __decorate([\n Property(2)\n ], Trendline.prototype, \"period\", void 0);\n __decorate([\n Property(2)\n ], Trendline.prototype, \"polynomialOrder\", void 0);\n __decorate([\n Property(0)\n ], Trendline.prototype, \"backwardForecast\", void 0);\n __decorate([\n Property(0)\n ], Trendline.prototype, \"forwardForecast\", void 0);\n __decorate([\n Complex({}, Animation)\n ], Trendline.prototype, \"animation\", void 0);\n __decorate([\n Complex({}, MarkerSettings)\n ], Trendline.prototype, \"marker\", void 0);\n __decorate([\n Property(true)\n ], Trendline.prototype, \"enableTooltip\", void 0);\n __decorate([\n Property(null)\n ], Trendline.prototype, \"intercept\", void 0);\n __decorate([\n Property('')\n ], Trendline.prototype, \"fill\", void 0);\n __decorate([\n Property(1)\n ], Trendline.prototype, \"width\", void 0);\n __decorate([\n Property('SeriesType')\n ], Trendline.prototype, \"legendShape\", void 0);\n return Trendline;\n}(ChildProperty));\nexport { Trendline };\n/**\n * Configures Error bar in series.\n */\nvar ErrorBarCapSettings = /** @class */ (function (_super) {\n __extends(ErrorBarCapSettings, _super);\n function ErrorBarCapSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(1)\n ], ErrorBarCapSettings.prototype, \"width\", void 0);\n __decorate([\n Property(10)\n ], ErrorBarCapSettings.prototype, \"length\", void 0);\n __decorate([\n Property(null)\n ], ErrorBarCapSettings.prototype, \"color\", void 0);\n __decorate([\n Property(1)\n ], ErrorBarCapSettings.prototype, \"opacity\", void 0);\n return ErrorBarCapSettings;\n}(ChildProperty));\nexport { ErrorBarCapSettings };\nvar ChartSegment = /** @class */ (function (_super) {\n __extends(ChartSegment, _super);\n function ChartSegment() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], ChartSegment.prototype, \"value\", void 0);\n __decorate([\n Property(null)\n ], ChartSegment.prototype, \"color\", void 0);\n __decorate([\n Property('0')\n ], ChartSegment.prototype, \"dashArray\", void 0);\n return ChartSegment;\n}(ChildProperty));\nexport { ChartSegment };\nvar ErrorBarSettings = /** @class */ (function (_super) {\n __extends(ErrorBarSettings, _super);\n function ErrorBarSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], ErrorBarSettings.prototype, \"visible\", void 0);\n __decorate([\n Property('Fixed')\n ], ErrorBarSettings.prototype, \"type\", void 0);\n __decorate([\n Property('Both')\n ], ErrorBarSettings.prototype, \"direction\", void 0);\n __decorate([\n Property('Vertical')\n ], ErrorBarSettings.prototype, \"mode\", void 0);\n __decorate([\n Property(null)\n ], ErrorBarSettings.prototype, \"color\", void 0);\n __decorate([\n Property(1)\n ], ErrorBarSettings.prototype, \"verticalError\", void 0);\n __decorate([\n Property(1)\n ], ErrorBarSettings.prototype, \"width\", void 0);\n __decorate([\n Property(1)\n ], ErrorBarSettings.prototype, \"horizontalError\", void 0);\n __decorate([\n Property(3)\n ], ErrorBarSettings.prototype, \"verticalPositiveError\", void 0);\n __decorate([\n Property(3)\n ], ErrorBarSettings.prototype, \"verticalNegativeError\", void 0);\n __decorate([\n Property(1)\n ], ErrorBarSettings.prototype, \"horizontalPositiveError\", void 0);\n __decorate([\n Property(1)\n ], ErrorBarSettings.prototype, \"horizontalNegativeError\", void 0);\n __decorate([\n Complex(null, ErrorBarCapSettings)\n ], ErrorBarSettings.prototype, \"errorBarCap\", void 0);\n return ErrorBarSettings;\n}(ChildProperty));\nexport { ErrorBarSettings };\n/**\n * Defines the common behavior of Series and Technical Indicators\n */\nvar SeriesBase = /** @class */ (function (_super) {\n __extends(SeriesBase, _super);\n function SeriesBase() {\n /**\n * The DataSource field that contains the x value.\n * It is applicable for series and technical indicators\n * @default ''\n */\n var _this = _super !== null && _super.apply(this, arguments) || this;\n /** @private */\n _this.currentViewData = [];\n /** @private */\n _this.clipRect = new Rect(0, 0, 0, 0);\n /** @private */\n _this.seriesType = 'XY';\n return _this;\n }\n /**\n * Process data for the series.\n * @hidden\n */\n SeriesBase.prototype.processJsonData = function () {\n var i = 0;\n var point = new Points();\n var xName = (this instanceof Series && this.type === 'Histogram') ? 'x' : this.xName;\n var textMappingName = this instanceof Series && this.marker.dataLabel.name ?\n this.marker.dataLabel.name : '';\n if (this instanceof Series) {\n if ((this.type === 'Waterfall' || this.type === 'Histogram')) {\n this.currentViewData = this.chart[firstToLowerCase(this.type) + 'SeriesModule'].\n processInternalData(this.currentViewData, this);\n }\n if (this.category === 'Pareto') {\n this.currentViewData = sort(this.currentViewData, [this.yName], true);\n if (this.type === 'Line') {\n this.currentViewData = this.chart.paretoSeriesModule.performCumulativeCalculation(this.currentViewData, this);\n }\n }\n }\n var len = Object.keys(this.currentViewData).length;\n this.points = [];\n this.xMin = Infinity;\n this.xMax = -Infinity;\n this.yMin = Infinity;\n this.yMax = -Infinity;\n this.sizeMax = -Infinity;\n this.getSeriesType();\n if (this.xAxis.valueType === 'Category') {\n while (i < len) {\n point = this.dataPoint(i, textMappingName, xName);\n this.pushCategoryData(point, i, point.x);\n this.pushData(point, i);\n this.setEmptyPoint(point, i);\n i++;\n }\n }\n else if (this.xAxis.valueType.indexOf('DateTime') > -1) {\n var option = {\n skeleton: 'full',\n type: 'dateTime'\n };\n var dateParser = this.chart.intl.getDateParser(option);\n var dateFormatter = this.chart.intl.getDateFormat(option);\n while (i < len) {\n point = this.dataPoint(i, textMappingName, xName);\n point.x = new Date(DataUtil.parse.parseJson({ val: point.x }).val);\n if (this.xAxis.valueType === 'DateTime') {\n point.xValue = Date.parse(dateParser(dateFormatter(point.x)));\n }\n else {\n this.pushCategoryData(point, i, Date.parse(dateParser(dateFormatter(point.x))).toString());\n }\n this.pushData(point, i);\n this.setEmptyPoint(point, i);\n i++;\n }\n }\n else {\n while (i < len) {\n point = this.dataPoint(i, textMappingName, xName);\n point.xValue = point.x;\n this.pushData(point, i);\n this.setEmptyPoint(point, i);\n i++;\n }\n }\n if (this instanceof Series) {\n if (this.type.indexOf('Spline') > -1 || (this.drawType.indexOf('Spline') > -1 && this.chart.chartAreaType === 'PolarRadar')) {\n var isArea = (this.type.indexOf('Area') > -1 || this.drawType === 'Area');\n this.chart['spline' + (isArea ? 'Area' : '') + 'SeriesModule'].findSplinePoint(this);\n }\n }\n };\n SeriesBase.prototype.pushData = function (point, i) {\n point.index = i;\n point.yValue = point.y;\n // To find the min, max for the axis range.\n this.xMin = Math.min(this.xMin, point.xValue);\n this.xMax = Math.max(this.xMax, point.xValue);\n this.xData.push(point.xValue);\n };\n /** @private */\n SeriesBase.prototype.dataPoint = function (i, textMappingName, xName) {\n var point;\n this.points[i] = new Points();\n point = this.points[i];\n var currentViewData = this.currentViewData;\n var getObjectValueByMappingString = this.enableComplexProperty ? getValue : this.getObjectValue;\n point.x = getObjectValueByMappingString(xName, currentViewData[i]);\n point.high = getObjectValueByMappingString(this.high, currentViewData[i]);\n point.low = getObjectValueByMappingString(this.low, currentViewData[i]);\n point.open = getObjectValueByMappingString(this.open, currentViewData[i]);\n point.close = getObjectValueByMappingString(this.close, currentViewData[i]);\n point.volume = getObjectValueByMappingString(this.volume, currentViewData[i]);\n point.interior = getObjectValueByMappingString(this.pointColorMapping, currentViewData[i]);\n if (this instanceof Series) {\n point.y = getObjectValueByMappingString(this.yName, currentViewData[i]);\n point.size = getObjectValueByMappingString(this.size, currentViewData[i]);\n point.text = getObjectValueByMappingString(textMappingName, currentViewData[i]);\n point.tooltip = getObjectValueByMappingString(this.tooltipMappingName, currentViewData[i]);\n }\n return point;\n };\n SeriesBase.prototype.getObjectValue = function (mappingName, data) {\n return data[mappingName];\n };\n /**\n * To set empty point value based on empty point mode\n * @private\n */\n SeriesBase.prototype.setEmptyPoint = function (point, i) {\n if (!this.findVisibility(point)) {\n point.visible = true;\n return null;\n }\n point.isEmpty = true;\n var mode = this instanceof Series ? this.emptyPointSettings.mode : 'Drop';\n switch (mode) {\n case 'Zero':\n point.visible = true;\n if (this instanceof Series && this.seriesType.indexOf('HighLow') > -1) {\n point.high = point.low = 0;\n if (this.seriesType.indexOf('HighLowOpenClose') > -1) {\n point.open = point.close = 0;\n }\n }\n else {\n point.y = point.yValue = this.yData[i] = 0;\n }\n break;\n case 'Average':\n if (this instanceof Series) {\n if (this.seriesType.indexOf('HighLow') > -1) {\n point.high = (isNullOrUndefined(point.high) || isNaN(+point.high)) ? this.getAverage(this.high, i) : point.high;\n point.low = (isNullOrUndefined(point.low) || isNaN(+point.low)) ? this.getAverage(this.low, i) : point.low;\n if (this.seriesType.indexOf('HighLowOpenClose') > -1) {\n point.open = (isNullOrUndefined(point.open) || isNaN(+point.open)) ? this.getAverage(this.open, i) : point.open;\n point.close = (isNullOrUndefined(point.close) || isNaN(+point.close)) ? this.getAverage(this.close, i) :\n point.close;\n }\n }\n else {\n point.y = point.yValue = this.yData[i] = this.getAverage(this.yName, i);\n }\n }\n point.visible = true;\n break;\n case 'Drop':\n case 'Gap':\n this.yData[i] = null;\n point.visible = false;\n break;\n }\n };\n SeriesBase.prototype.findVisibility = function (point) {\n var type = this instanceof Series ? this.seriesType : 'HighLowOpenClose';\n var yValues;\n switch (type) {\n case 'XY':\n this.setXYMinMax(point.yValue);\n this.yData.push(point.yValue);\n if (this instanceof Series && this.type === 'Bubble') {\n this.sizeMax = Math.max(this.sizeMax, (isNullOrUndefined(point.size) || isNaN(+point.size)) ? this.sizeMax\n : point.size);\n }\n return isNullOrUndefined(point.x) || (isNullOrUndefined(point.y) || isNaN(+point.y));\n case 'HighLow':\n this.setHiloMinMax(point.high, point.low);\n return isNullOrUndefined(point.x) || (isNullOrUndefined(point.low) || isNaN(+point.low)) ||\n (isNullOrUndefined(point.high) || isNaN(+point.high));\n case 'HighLowOpenClose':\n this.setHiloMinMax(point.high, point.low);\n return isNullOrUndefined(point.x) || (isNullOrUndefined(point.low) || isNaN(+point.low)) ||\n (isNullOrUndefined(point.open) || isNaN(+point.open)) || (isNullOrUndefined(point.close) || isNaN(+point.close))\n || (isNullOrUndefined(point.high) || isNaN(+point.high));\n case 'BoxPlot':\n yValues = (point.y || [null]).filter(function (value) {\n return !isNullOrUndefined(value) && !isNaN(value);\n }).sort(function (a, b) {\n return a - b;\n });\n point.y = yValues;\n this.yMin = Math.min(this.yMin, Math.min.apply(Math, yValues));\n this.yMax = Math.max(this.yMax, Math.max.apply(Math, yValues));\n return !yValues.length;\n }\n };\n /**\n * To get Y min max for the provided point seriesType XY\n */\n SeriesBase.prototype.setXYMinMax = function (yValue) {\n this.yMin = Math.min(this.yMin, (isNullOrUndefined(yValue) || isNaN(yValue)) ? this.yMin : yValue);\n this.yMax = Math.max(this.yMax, (isNullOrUndefined(yValue) || isNaN(yValue)) ? this.yMax : yValue);\n };\n /**\n * To get Y min max for the provided point seriesType XY\n */\n SeriesBase.prototype.setHiloMinMax = function (high, low) {\n this.yMin = Math.min(this.yMin, Math.min((isNullOrUndefined(low) || isNaN(low)) ? this.yMin : low, (isNullOrUndefined(high) || isNaN(high)) ? this.yMin : high));\n this.yMax = Math.max(this.yMax, Math.max((isNullOrUndefined(low) || isNaN(low)) ? this.yMax : low, (isNullOrUndefined(high) || isNaN(high)) ? this.yMax : high));\n };\n /**\n * Finds the type of the series\n * @private\n */\n SeriesBase.prototype.getSeriesType = function () {\n var type;\n if (this instanceof Series) {\n var seriesType = this.chart.chartAreaType === 'PolarRadar' ? this.drawType : this.type;\n if (seriesType) {\n switch (seriesType) {\n case 'RangeColumn':\n case 'RangeArea':\n case 'Hilo':\n type = 'HighLow';\n break;\n case 'HiloOpenClose':\n case 'Candle':\n type = 'HighLowOpenClose';\n break;\n case 'BoxAndWhisker':\n type = 'BoxPlot';\n break;\n default:\n type = 'XY';\n }\n }\n }\n this.seriesType = type;\n };\n /** @private */\n SeriesBase.prototype.pushCategoryData = function (point, index, pointX) {\n if (!this.xAxis.isIndexed) {\n if (this.xAxis.labels.indexOf(pointX) < 0) {\n this.xAxis.labels.push(pointX);\n }\n point.xValue = this.xAxis.labels.indexOf(pointX);\n }\n else {\n this.xAxis.labels[index] ? this.xAxis.labels[index] += ', ' + pointX :\n this.xAxis.labels.push(pointX);\n point.xValue = index;\n }\n };\n /**\n * To find average of given property\n */\n SeriesBase.prototype.getAverage = function (member, i, data) {\n if (data === void 0) { data = this.currentViewData; }\n var previous = data[i - 1] ? (data[i - 1][member] || 0) : 0;\n var next = data[i + 1] ? (data[i + 1][member] || 0) : 0;\n return (previous + next) / 2;\n };\n /**\n * To find the control points for spline.\n * @return {void}\n * @private\n */\n SeriesBase.prototype.refreshDataManager = function (chart) {\n var _this = this;\n this.chart = chart;\n var dateSource = this.dataSource || chart.dataSource;\n if (!(dateSource instanceof DataManager) && isNullOrUndefined(this.query)) {\n this.dataManagerSuccess({ result: dateSource, count: dateSource.length }, chart, false);\n return;\n }\n var dataManager = this.dataModule.getData(this.dataModule.generateQuery().requiresCount());\n dataManager.then(function (e) { return _this.dataManagerSuccess(e, chart); });\n };\n SeriesBase.prototype.dataManagerSuccess = function (e, chart, isRemoteData) {\n if (isRemoteData === void 0) { isRemoteData = true; }\n this.currentViewData = e.result !== '' ? extend([], e.result, null, true) : [];\n if (this instanceof Series) {\n var argsData = {\n name: seriesRender, series: this, data: this.currentViewData, fill: this.interior\n };\n this.chart.trigger(seriesRender, argsData);\n this.interior = argsData.fill;\n this.currentViewData = argsData.data;\n }\n this.processJsonData();\n this.recordsCount = e.count;\n this.refreshChart(isRemoteData);\n };\n SeriesBase.prototype.refreshChart = function (isRemoteData) {\n var chart = this.chart;\n if (this instanceof Series) {\n chart.visibleSeriesCount += isRemoteData ? 1 : 0;\n }\n chart.refreshTechnicalIndicator(this);\n if (this instanceof Series && this.category !== 'TrendLine') {\n for (var _i = 0, _a = this.trendlines; _i < _a.length; _i++) {\n var trendline = _a[_i];\n trendline.setDataSource(this, chart);\n }\n }\n //if (chart.visibleSeries.length === (chart.visibleSeriesCount - chart.indicators.length)) {\n if (chart.visibleSeries.length === (chart.visibleSeriesCount)) {\n chart.refreshBound();\n chart.trigger('loaded', { chart: chart });\n }\n if (this instanceof Series) {\n chart.visibleSeriesCount += isRemoteData ? 0 : 1;\n }\n };\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"xName\", void 0);\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"high\", void 0);\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"low\", void 0);\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"open\", void 0);\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"close\", void 0);\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"volume\", void 0);\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"pointColorMapping\", void 0);\n __decorate([\n Property(null)\n ], SeriesBase.prototype, \"xAxisName\", void 0);\n __decorate([\n Property(null)\n ], SeriesBase.prototype, \"yAxisName\", void 0);\n __decorate([\n Complex(null, Animation)\n ], SeriesBase.prototype, \"animation\", void 0);\n __decorate([\n Property(null)\n ], SeriesBase.prototype, \"fill\", void 0);\n __decorate([\n Property(1)\n ], SeriesBase.prototype, \"width\", void 0);\n __decorate([\n Property('0')\n ], SeriesBase.prototype, \"dashArray\", void 0);\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"dataSource\", void 0);\n __decorate([\n Property()\n ], SeriesBase.prototype, \"query\", void 0);\n __decorate([\n Collection([], ChartSegment)\n ], SeriesBase.prototype, \"segments\", void 0);\n __decorate([\n Property('X')\n ], SeriesBase.prototype, \"segmentAxis\", void 0);\n __decorate([\n Property(false)\n ], SeriesBase.prototype, \"enableComplexProperty\", void 0);\n return SeriesBase;\n}(ChildProperty));\nexport { SeriesBase };\n/**\n * Configures the series in charts.\n */\nvar Series = /** @class */ (function (_super) {\n __extends(Series, _super);\n // tslint:disable-next-line:no-any\n function Series(parent, propName, defaultValue, isArray) {\n var _this = _super.call(this, parent, propName, defaultValue, isArray) || this;\n _this.visibleSeriesCount = 0;\n /** @private */\n _this.category = 'Series';\n /** @private */\n _this.isRectSeries = false;\n /** @private */\n _this.drawPoints = [];\n /** @private */\n _this.delayedAnimation = false;\n return _this;\n }\n /**\n * Refresh the axis label.\n * @return {boolean}\n * @private\n */\n Series.prototype.refreshAxisLabel = function () {\n if (this.xAxis.valueType !== 'Category') {\n return null;\n }\n this.xAxis.labels = [];\n for (var _i = 0, _a = this.xAxis.series; _i < _a.length; _i++) {\n var item = _a[_i];\n if (item.visible) {\n item.xMin = Infinity;\n item.xMax = -Infinity;\n for (var _b = 0, _c = item.points; _b < _c.length; _b++) {\n var point = _c[_b];\n item.pushCategoryData(point, point.index, point.x);\n item.xMin = Math.min(item.xMin, point.xValue);\n item.xMax = Math.max(item.xMax, point.xValue);\n }\n }\n }\n };\n /**\n * To get the series collection.\n * @return {void}\n * @private\n */\n Series.prototype.findSeriesCollection = function (column, row, isStack) {\n var seriesCollection = [];\n for (var _i = 0, _a = row.axes; _i < _a.length; _i++) {\n var rowAxis = _a[_i];\n for (var _b = 0, _c = rowAxis.series; _b < _c.length; _b++) {\n var rowSeries = _c[_b];\n for (var _d = 0, _e = column.axes; _d < _e.length; _d++) {\n var axis = _e[_d];\n for (var _f = 0, _g = axis.series; _f < _g.length; _f++) {\n var series = _g[_f];\n if (series === rowSeries && series.visible && this.rectSeriesInChart(series, isStack)) {\n seriesCollection.push(series);\n }\n }\n }\n }\n }\n return seriesCollection;\n };\n /**\n * To get the column type series.\n * @return {void}\n * @private\n */\n Series.prototype.rectSeriesInChart = function (series, isStack) {\n var type = (series.type).toLowerCase();\n return (type.indexOf('column') !== -1 || type.indexOf('bar') !== -1 || type.indexOf('histogram') !== -1 ||\n type.indexOf('hiloopenclose') !== -1 || type.indexOf('candle') !== -1 || type.indexOf('pareto') !== -1 ||\n type.indexOf('hilo') !== -1 || series.drawType.indexOf('Column') !== -1 ||\n type.indexOf('waterfall') !== -1 || type.indexOf('boxandwhisker') !== -1 || isStack);\n };\n /**\n * To calculate the stacked values.\n * @return {void}\n * @private\n */\n Series.prototype.calculateStackedValue = function (isStacking100, chart) {\n var axisSeries;\n for (var _i = 0, _a = chart.columns; _i < _a.length; _i++) {\n var columnItem = _a[_i];\n for (var _b = 0, _c = chart.rows; _b < _c.length; _b++) {\n var item = _c[_b];\n this.calculateStackingValues(this.findSeriesCollection(columnItem, item, true), isStacking100);\n }\n }\n };\n Series.prototype.calculateStackingValues = function (seriesCollection, isStacking100) {\n var startValues;\n var endValues;\n var yValues = [];\n var lastPositive = [];\n var lastNegative = [];\n var stackingGroup;\n var lastValue;\n var value;\n var frequencies = [];\n if (isStacking100) {\n frequencies = this.findFrequencies(seriesCollection);\n }\n var stackingSeies = [];\n var stackedValues = [];\n for (var _i = 0, seriesCollection_1 = seriesCollection; _i < seriesCollection_1.length; _i++) {\n var series = seriesCollection_1[_i];\n if (series.type.indexOf('Stacking') !== -1 || (series.drawType.indexOf('Stacking') !== -1 &&\n (series.chart.chartAreaType === 'PolarRadar'))) {\n stackingGroup = (series.type.indexOf('StackingArea') !== -1) ? 'StackingArea100' : series.stackingGroup;\n if (!lastPositive[stackingGroup]) {\n lastPositive[stackingGroup] = [];\n lastNegative[stackingGroup] = [];\n }\n yValues = series.yData;\n startValues = [];\n endValues = [];\n stackingSeies.push(series);\n for (var j = 0, pointsLength = series.points.length; j < pointsLength; j++) {\n lastValue = 0;\n value = yValues[j];\n if (lastPositive[stackingGroup][series.points[j].xValue] === undefined) {\n lastPositive[stackingGroup][series.points[j].xValue] = 0;\n }\n if (lastNegative[stackingGroup][series.points[j].xValue] === undefined) {\n lastNegative[stackingGroup][series.points[j].xValue] = 0;\n }\n if (isStacking100) {\n value = value / frequencies[stackingGroup][series.points[j].xValue] * 100;\n value = !isNaN(value) ? value : 0;\n series.points[j].percentage = +(value.toFixed(2));\n }\n else {\n stackedValues[j] = stackedValues[j] ? stackedValues[j] + Math.abs(value) : Math.abs(value);\n }\n if (value >= 0) {\n lastValue = lastPositive[stackingGroup][series.points[j].xValue];\n lastPositive[stackingGroup][series.points[j].xValue] += value;\n }\n else {\n lastValue = lastNegative[stackingGroup][series.points[j].xValue];\n lastNegative[stackingGroup][series.points[j].xValue] += value;\n }\n startValues.push(lastValue);\n endValues.push(value + lastValue);\n if (isStacking100 && (endValues[j] > 100)) {\n endValues[j] = 100;\n }\n }\n series.stackedValues = new StackValues(startValues, endValues);\n series.yMin = Math.min.apply(0, startValues);\n series.yMax = Math.max.apply(0, endValues);\n if (series.yMin > Math.min.apply(0, endValues)) {\n series.yMin = (isStacking100) ? -100 : Math.min.apply(0, endValues);\n }\n if (series.yMax < Math.max.apply(0, startValues)) {\n series.yMax = 0;\n }\n }\n }\n this.findPercentageOfStacking(stackingSeies, stackedValues, isStacking100);\n };\n Series.prototype.findPercentageOfStacking = function (stackingSeies, values, isStacking100) {\n for (var _i = 0, stackingSeies_1 = stackingSeies; _i < stackingSeies_1.length; _i++) {\n var item = stackingSeies_1[_i];\n if (isStacking100) {\n return null;\n }\n for (var _a = 0, _b = item.points; _a < _b.length; _a++) {\n var point = _b[_a];\n point.percentage = Math.abs(+(point.y / values[point.index] * 100).toFixed(2));\n }\n }\n };\n Series.prototype.findFrequencies = function (seriesCollection) {\n var frequencies = [];\n var stackingGroup;\n for (var _i = 0, seriesCollection_2 = seriesCollection; _i < seriesCollection_2.length; _i++) {\n var series = seriesCollection_2[_i];\n series.yAxis.isStack100 = series.type.indexOf('100') !== -1 ? true : false;\n if (series.type.indexOf('Stacking') !== -1) {\n stackingGroup = (series.type.indexOf('StackingArea') !== -1) ? 'StackingArea100' : series.stackingGroup;\n if (!frequencies[stackingGroup]) {\n frequencies[stackingGroup] = [];\n }\n for (var j = 0, pointsLength = series.points.length; j < pointsLength; j++) {\n if (frequencies[stackingGroup][series.points[j].xValue] === undefined) {\n frequencies[stackingGroup][series.points[j].xValue] = 0;\n }\n if (series.yData[j] > 0) {\n frequencies[stackingGroup][series.points[j].xValue] += series.yData[j];\n }\n else {\n frequencies[stackingGroup][series.points[j].xValue] -= series.yData[j];\n }\n }\n }\n }\n return frequencies;\n };\n /* private dataManagerFailure(e: { result: Object[] }): void {\n this.currentViewData = [];\n this.refreshChart();\n }*/\n /** @private */\n Series.prototype.renderSeries = function (chart) {\n var seriesType = firstToLowerCase(this.type);\n if (seriesType.indexOf('100') !== -1) {\n seriesType = seriesType.replace('100', '');\n }\n if (chart[seriesType + 'SeriesModule']) {\n if (this.category !== 'Indicator' && this.category !== 'TrendLine') {\n this.createSeriesElements(chart);\n }\n chart[seriesType + 'SeriesModule'].render(this, this.xAxis, this.yAxis, chart.requireInvertedAxis);\n if (this.category !== 'Indicator') {\n if (this.errorBar.visible) {\n this.chart.errorBarModule.render(this);\n }\n if (this.marker.dataLabel.visible) {\n chart.dataLabelModule.render(this, this.chart, this.marker.dataLabel);\n }\n this.appendSeriesElement(chart.seriesElements, chart);\n }\n this.performAnimation(chart, seriesType, this.errorBar, this.marker, this.marker.dataLabel);\n }\n };\n /**\n * To create seris element.\n * @return {void}\n * @private\n */\n Series.prototype.createSeriesElements = function (chart) {\n if (this.category !== 'Indicator') {\n var elementId = chart.element.id;\n var xAxisRect = this.xAxis.rect;\n // 8 for extend border value 5 for extend size value\n var explodeValue = this.marker.border.width + 8 + 5;\n var render = chart.renderer;\n var index = this.index === undefined ? this.category : this.index;\n var markerHeight = (this.type === 'Scatter') ? (this.marker.height + explodeValue) / 2 : 0;\n var markerWidth = (this.type === 'Scatter') ? (this.marker.width + explodeValue) / 2 : 0;\n var options = void 0;\n if (chart.chartAreaType === 'PolarRadar') {\n var markerMaxValue = (this.drawType === 'Scatter') ? Math.max(this.marker.width, this.marker.height) : 0;\n options = new CircleOption(elementId + '_ChartSeriesClipRect_' + index, 'transparent', { width: 1, color: 'Gray' }, 1, this.clipRect.width / 2 + this.clipRect.x, this.clipRect.height / 2 + this.clipRect.y, chart.radius + markerMaxValue);\n this.clipRectElement = appendClipElement(chart.redraw, options, render, 'drawCircularClipPath');\n }\n else {\n options = new RectOption(elementId + '_ChartSeriesClipRect_' + index, 'transparent', { width: 1, color: 'Gray' }, 1, {\n x: -markerWidth, y: -markerHeight,\n width: this.clipRect.width + markerWidth * 2,\n height: this.clipRect.height + markerHeight * 2\n });\n this.clipRectElement = appendClipElement(chart.redraw, options, render);\n }\n var transform = void 0;\n transform = chart.chartAreaType === 'Cartesian' ? 'translate(' + this.clipRect.x + ',' + (this.clipRect.y) + ')' : '';\n this.symbolElement = null;\n this.seriesElement = render.createGroup({\n 'id': elementId + 'SeriesGroup' + index,\n 'transform': transform,\n 'clip-path': 'url(#' + elementId + '_ChartSeriesClipRect_' + index + ')'\n });\n this.seriesElement.appendChild(this.clipRectElement);\n }\n };\n /**\n * To append the series.\n * @return {void}\n * @private\n */\n Series.prototype.appendSeriesElement = function (element, chart) {\n var marker = this.marker;\n var dataLabel = marker.dataLabel;\n var redraw = chart.redraw;\n if (this.category !== 'TrendLine') {\n appendChildElement(chart.seriesElements, this.seriesElement, redraw);\n var errorBar = this.errorBar;\n if (errorBar.visible) {\n if (chart.chartAreaType === 'PolarRadar') {\n appendChildElement(chart.seriesElements, this.seriesElement, redraw);\n }\n else {\n appendChildElement(chart.seriesElements, this.errorBarElement, redraw);\n }\n }\n if (this.type === 'Scatter' || this.type === 'Bubble') {\n appendChildElement(chart.seriesElements, this.seriesElement, redraw);\n }\n }\n if (marker.visible && (chart.chartAreaType === 'Cartesian' ||\n ((this.drawType !== 'Scatter') && chart.chartAreaType === 'PolarRadar')) && this.type !== 'Scatter' &&\n this.type !== 'Bubble' && this.type !== 'Candle' && this.type !== 'Hilo' && this.type !== 'HiloOpenClose') {\n appendChildElement(chart.seriesElements, this.symbolElement, redraw);\n }\n if (dataLabel.visible) {\n appendChildElement(chart.dataLabelElements, this.shapeElement, redraw);\n appendChildElement(chart.dataLabelElements, this.textElement, redraw);\n }\n if (chart.dataLabelElements.hasChildNodes()) {\n chart.seriesElements.appendChild(chart.dataLabelElements);\n }\n };\n /**\n * To perform animation for chart series.\n * @return {void}\n * @private\n */\n Series.prototype.performAnimation = function (chart, type, errorBar, marker, dataLabel) {\n if (this.animation.enable && chart.animateSeries) {\n chart[type + 'SeriesModule'].doAnimation(this);\n if (errorBar.visible) {\n chart.errorBarModule.doErrorBarAnimation(this);\n }\n if (marker.visible) {\n chart.markerRender.doMarkerAnimation(this);\n }\n //to datalabel animation disabled for edge and IE\n if (dataLabel.visible && Browser.info.name !== 'edge' && !Browser.isIE) {\n chart.dataLabelModule.doDataLabelAnimation(this);\n }\n }\n };\n /**\n * To set border color for empty point\n * @private\n */\n Series.prototype.setPointColor = function (point, color) {\n color = point.interior || color;\n return point.isEmpty ? (this.emptyPointSettings.fill || color) : color;\n };\n /**\n * To set border color for empty point\n * @private\n */\n Series.prototype.setBorderColor = function (point, border) {\n border.width = point.isEmpty ? (this.emptyPointSettings.border.width || border.width) : border.width;\n border.color = point.isEmpty ? (this.emptyPointSettings.border.color || border.color) : border.color;\n return border;\n };\n __decorate([\n Property('')\n ], Series.prototype, \"name\", void 0);\n __decorate([\n Property('')\n ], Series.prototype, \"yName\", void 0);\n __decorate([\n Property('Line')\n ], Series.prototype, \"drawType\", void 0);\n __decorate([\n Property(true)\n ], Series.prototype, \"isClosed\", void 0);\n __decorate([\n Property('#2ecd71')\n ], Series.prototype, \"bearFillColor\", void 0);\n __decorate([\n Property('#e74c3d')\n ], Series.prototype, \"bullFillColor\", void 0);\n __decorate([\n Property(false)\n ], Series.prototype, \"enableSolidCandles\", void 0);\n __decorate([\n Property('')\n ], Series.prototype, \"size\", void 0);\n __decorate([\n Property(null)\n ], Series.prototype, \"binInterval\", void 0);\n __decorate([\n Property(false)\n ], Series.prototype, \"showNormalDistribution\", void 0);\n __decorate([\n Property('')\n ], Series.prototype, \"stackingGroup\", void 0);\n __decorate([\n Property(true)\n ], Series.prototype, \"visible\", void 0);\n __decorate([\n Complex({ color: 'transparent', width: 0 }, Border)\n ], Series.prototype, \"border\", void 0);\n __decorate([\n Property(1)\n ], Series.prototype, \"opacity\", void 0);\n __decorate([\n Property('Line')\n ], Series.prototype, \"type\", void 0);\n __decorate([\n Complex(null, ErrorBarSettings)\n ], Series.prototype, \"errorBar\", void 0);\n __decorate([\n Complex(null, MarkerSettings)\n ], Series.prototype, \"marker\", void 0);\n __decorate([\n Collection([], Trendline)\n ], Series.prototype, \"trendlines\", void 0);\n __decorate([\n Property(true)\n ], Series.prototype, \"enableTooltip\", void 0);\n __decorate([\n Property('')\n ], Series.prototype, \"tooltipMappingName\", void 0);\n __decorate([\n Property('SeriesType')\n ], Series.prototype, \"legendShape\", void 0);\n __decorate([\n Property(null)\n ], Series.prototype, \"selectionStyle\", void 0);\n __decorate([\n Property(1)\n ], Series.prototype, \"minRadius\", void 0);\n __decorate([\n Property(3)\n ], Series.prototype, \"maxRadius\", void 0);\n __decorate([\n Property('Natural')\n ], Series.prototype, \"splineType\", void 0);\n __decorate([\n Property(0.5)\n ], Series.prototype, \"cardinalSplineTension\", void 0);\n __decorate([\n Complex(null, EmptyPointSettings)\n ], Series.prototype, \"emptyPointSettings\", void 0);\n __decorate([\n Property(true)\n ], Series.prototype, \"showMean\", void 0);\n __decorate([\n Property('Normal')\n ], Series.prototype, \"boxPlotMode\", void 0);\n __decorate([\n Property(null)\n ], Series.prototype, \"columnWidth\", void 0);\n __decorate([\n Property(0)\n ], Series.prototype, \"columnSpacing\", void 0);\n __decorate([\n Property('#C64E4A')\n ], Series.prototype, \"negativeFillColor\", void 0);\n __decorate([\n Property('#4E81BC')\n ], Series.prototype, \"summaryFillColor\", void 0);\n __decorate([\n Property()\n ], Series.prototype, \"intermediateSumIndexes\", void 0);\n __decorate([\n Property()\n ], Series.prototype, \"sumIndexes\", void 0);\n __decorate([\n Complex({ color: 'black', width: 2 }, Connector)\n ], Series.prototype, \"connector\", void 0);\n __decorate([\n Complex(null, CornerRadius)\n ], Series.prototype, \"cornerRadius\", void 0);\n return Series;\n}(SeriesBase));\nexport { Series };\n","import { Query, DataManager } from '@syncfusion/ej2-data';\n/**\n * data module is used to generate query and dataSource\n */\nvar Data = /** @class */ (function () {\n /**\n * Constructor for data module\n * @private\n */\n function Data(dataSource, query) {\n this.initDataManager(dataSource, query);\n }\n /**\n * The function used to initialize dataManager and query\n * @return {void}\n * @private\n */\n Data.prototype.initDataManager = function (dataSource, query) {\n this.dataManager = dataSource instanceof DataManager ? dataSource : new DataManager(dataSource);\n this.query = query instanceof Query ? query : new Query();\n };\n /**\n * The function used to generate updated Query from chart model\n * @return {void}\n * @private\n */\n Data.prototype.generateQuery = function () {\n var query = this.query.clone();\n return query;\n };\n /**\n * The function used to get dataSource by executing given Query\n * @param {Query} query - A Query that specifies to generate dataSource\n * @return {void}\n * @private\n */\n Data.prototype.getData = function (query) {\n return this.dataManager.executeQuery(query);\n };\n return Data;\n}());\nexport { Data };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { drawSymbol } from '../../common/utils/helper';\nimport { PathOption, Size } from '@syncfusion/ej2-svg-base';\nimport { Browser, extend, remove } from '@syncfusion/ej2-base';\nimport { ChartData } from '../../chart/utils/get-data';\nimport { withInBounds, PointData, stopTimer } from '../../common/utils/helper';\nimport { colorNameToHex, convertHexToColor } from '../../common/utils/helper';\n/**\n * Marker Module used to render the marker for line type series.\n */\nvar MarkerExplode = /** @class */ (function (_super) {\n __extends(MarkerExplode, _super);\n /**\n * Constructor for the marker module.\n * @private\n */\n function MarkerExplode(chart) {\n var _this = _super.call(this, chart) || this;\n _this.addEventListener();\n _this.elementId = chart.element.id;\n return _this;\n }\n /**\n * @hidden\n */\n MarkerExplode.prototype.addEventListener = function () {\n if (this.chart.isDestroyed) {\n return;\n }\n this.chart.on(Browser.touchMoveEvent, this.mouseMoveHandler, this);\n this.chart.on(Browser.touchEndEvent, this.mouseUpHandler, this);\n };\n /**\n * @hidden\n */\n /* public removeEventListener(): void {\n if (this.chart.isDestroyed) { return; }\n this.chart.off(Browser.touchMoveEvent, this.mouseMoveHandler);\n }*/\n /**\n * @hidden\n */\n MarkerExplode.prototype.mouseUpHandler = function () {\n var chart = this.chart;\n if (chart.isTouch && !chart.crosshair.enable && !this.isSelected(chart)) {\n this.markerMove(true);\n }\n };\n /**\n * @hidden\n */\n MarkerExplode.prototype.mouseMoveHandler = function () {\n var chart = this.chart;\n if ((!chart.crosshair.enable || (chart.tooltip.enable)) && (!chart.isTouch || chart.startMove) && !this.isSelected(chart)) {\n this.markerMove(false);\n }\n };\n MarkerExplode.prototype.markerMove = function (remove) {\n var _this = this;\n var chart = this.chart;\n this.currentPoints = [];\n var data;\n var previous;\n var explodeSeries;\n var series;\n if (!chart.tooltip.shared || !chart.tooltip.enable) {\n data = this.getData();\n series = data.series;\n previous = this.previousPoints[0];\n explodeSeries = series && ((series.type === 'Bubble' || series.drawType === 'Scatter' || series.type === 'Scatter') ||\n (((series.type !== 'Candle') && (series.type !== 'Hilo') && (series.type !== 'HiloOpenClose')) &&\n (series.marker.visible && series.marker.width !== 0 && series.marker.height !== 0)));\n data.lierIndex = this.lierIndex;\n if (data.point && explodeSeries && ((!previous || (previous.point !== data.point)) ||\n (previous && previous.lierIndex > 3 && previous.lierIndex !== this.lierIndex))) {\n this.currentPoints.push(data);\n }\n }\n else {\n if (!withInBounds(chart.mouseX, chart.mouseY, chart.chartAxisLayoutPanel.seriesClipRect)) {\n return null;\n }\n if (chart.tooltip.enable) {\n var pointData = chart.chartAreaType === 'PolarRadar' ? this.getData() : null;\n for (var _i = 0, _a = chart.visibleSeries; _i < _a.length; _i++) {\n var chartSeries = _a[_i];\n if (!chartSeries.enableTooltip || chartSeries.category === 'Indicator') {\n continue;\n }\n if (chart.chartAreaType === 'Cartesian' && chartSeries.visible) {\n data = this.getClosestX(chart, chartSeries);\n }\n else if (chart.chartAreaType === 'PolarRadar' && chartSeries.visible && pointData.point !== null) {\n data = new PointData(chartSeries.points[pointData.point.index], chartSeries);\n }\n if (data) {\n this.currentPoints.push(data);\n data = null;\n }\n }\n }\n }\n var length = this.previousPoints.length;\n if (this.currentPoints.length > 0) {\n if (length === 0 || (length > 0 && this.previousPoints[0].point !== this.currentPoints[0].point)) {\n if (this.previousPoints.length > 0) {\n this.removeHighlightedMarker();\n }\n var _loop_1 = function (data_1) {\n if ((data_1 && data_1.point) || ((series.type !== 'Candle') &&\n (series.type !== 'Hilo') && (series.type !== 'HiloOpenClose'))) {\n stopTimer(this_1.markerExplode);\n this_1.isRemove = true;\n data_1.point.symbolLocations.map(function (location, index) {\n if (!data_1.series.isRectSeries || data_1.point.marker.visible) {\n _this.drawTrackBall(data_1.series, data_1.point, location, index);\n }\n });\n }\n };\n var this_1 = this;\n for (var _b = 0, _c = this.currentPoints; _b < _c.length; _b++) {\n var data_1 = _c[_b];\n _loop_1(data_1);\n }\n this.previousPoints = extend([], this.currentPoints, null, true);\n }\n }\n if (!chart.tooltip.enable && ((this.currentPoints.length === 0 && this.isRemove) || (remove && this.isRemove) ||\n !withInBounds(chart.mouseX, chart.mouseY, chart.chartAxisLayoutPanel.seriesClipRect))) {\n this.isRemove = false;\n this.markerExplode = setTimeout(function () {\n _this.removeHighlightedMarker();\n }, 2000);\n }\n this.currentPoints = [];\n };\n MarkerExplode.prototype.drawTrackBall = function (series, point, location, index) {\n var marker = point.marker;\n var seriesMarker = series.marker;\n var shape = marker.shape || seriesMarker.shape;\n var element = series.symbolElement || series.seriesElement;\n var symbolId = this.elementId + '_Series_' + series.index + '_Point_' + point.index + '_Trackball' +\n (index ? index : '');\n var size = new Size((marker.width || seriesMarker.width) + 5, (marker.height || seriesMarker.height) + 5);\n var border = (marker.border || series.border);\n var explodeSeries = (series.type === 'BoxAndWhisker' || series.type === 'Bubble' || series.type === 'Scatter');\n var borderColor = (border.color && border.color !== 'transparent') ? border.color :\n marker.fill || point.interior || (explodeSeries ? point.color : series.interior);\n var colorValue = convertHexToColor(colorNameToHex(borderColor));\n var borderWidth = marker.border ? marker.border.width : seriesMarker.border.width;\n var markerShadow = series.chart.themeStyle.markerShadow ||\n 'rgba(' + colorValue.r + ',' + colorValue.g + ',' + colorValue.b + ',0.2)';\n for (var i = 0; i < 2; i++) {\n var options = new PathOption(symbolId + '_' + i, i ? (marker.fill || point.color || (explodeSeries ? series.interior : '#ffffff')) : 'transparent', borderWidth + (i ? 0 : 8), i ? borderColor : markerShadow, (marker.opacity || seriesMarker.opacity), null, null);\n var symbol = drawSymbol(location, shape, size, seriesMarker.imageUrl, options, '');\n symbol.setAttribute('style', 'pointer-events:none');\n symbol.setAttribute('class', 'EJ2-Trackball');\n element.appendChild(symbol);\n }\n };\n /**\n * @hidden\n */\n MarkerExplode.prototype.removeHighlightedMarker = function () {\n var elements = document.getElementsByClassName('EJ2-Trackball');\n for (var i = 0, len = elements.length; i < len; i++) {\n remove(elements[0]);\n }\n this.previousPoints = [];\n };\n return MarkerExplode;\n}(ChartData));\nexport { MarkerExplode };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { RectOption, appendChildElement, getElement, appendClipElement } from '../../common/utils/helper';\nimport { findlElement, drawSymbol, markerAnimate, CircleOption, } from '../../common/utils/helper';\nimport { PathOption, Size } from '@syncfusion/ej2-svg-base';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { pointRender } from '../../common/model/constants';\nimport { MarkerExplode } from './marker-explode';\nimport { getSaturationColor } from '../../common/utils/helper';\n/**\n * Marker module used to render the marker for line type series.\n */\nvar Marker = /** @class */ (function (_super) {\n __extends(Marker, _super);\n /**\n * Constructor for the marker module.\n * @private\n */\n function Marker(chart) {\n var _this = _super.call(this, chart) || this;\n _this.addEventListener();\n return _this;\n }\n /**\n * Render the marker for series.\n * @return {void}\n * @private\n */\n Marker.prototype.render = function (series) {\n var _this = this;\n var redraw = series.chart.redraw;\n this.createElement(series, redraw);\n var _loop_1 = function (point) {\n if (point.visible && point.symbolLocations.length) {\n point.symbolLocations.map(function (location, index) {\n _this.renderMarker(series, point, location, index, redraw);\n });\n }\n };\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n _loop_1(point);\n }\n };\n Marker.prototype.renderMarker = function (series, point, location, index, redraw) {\n var seriesIndex = series.index === undefined ? series.category : series.index;\n var marker = series.marker;\n var border = {\n color: marker.border.color,\n width: marker.border.width\n };\n var borderColor = marker.border.color;\n var symbolId;\n var previousLocation;\n var previousPath;\n var circlePath;\n var shapeOption;\n var isBoxPlot = series.type === 'BoxAndWhisker';\n var fill = marker.fill || (isBoxPlot ? point.interior || series.interior : '#ffffff');\n var argsData;\n var markerElement;\n var parentElement = isBoxPlot ?\n findlElement(series.seriesElement.childNodes, 'Series_' + series.index + '_Point_' + point.index)\n : series.symbolElement;\n border.color = borderColor || series.setPointColor(point, series.interior);\n symbolId = this.elementId + '_Series_' + seriesIndex + '_Point_' + point.index + '_Symbol' +\n (index ? index : '');\n argsData = {\n cancel: false, name: pointRender, series: series, point: point,\n fill: point.isEmpty ? (series.emptyPointSettings.fill || fill) : fill,\n border: {\n color: series.type === 'BoxAndWhisker' ?\n (!isNullOrUndefined(borderColor) && borderColor !== 'transparent') ? borderColor :\n getSaturationColor(fill, -0.6)\n : border.color,\n width: border.width\n },\n height: marker.height,\n width: marker.width,\n shape: marker.shape\n };\n argsData.border = series.setBorderColor(point, { width: argsData.border.width, color: argsData.border.color });\n if (!series.isRectSeries || series.type === 'BoxAndWhisker') {\n this.chart.trigger(pointRender, argsData);\n point.color = argsData.fill;\n }\n point.color = argsData.fill;\n if (!argsData.cancel) {\n var y = void 0;\n if (series.type === 'RangeArea' || series.type === 'RangeColumn') {\n y = index ? point.low : point.high;\n }\n else if (isBoxPlot) {\n y = point.outliers[index];\n }\n else {\n y = point.y;\n }\n shapeOption = new PathOption(symbolId, argsData.fill, argsData.border.width, argsData.border.color, marker.opacity, null);\n if (parentElement !== undefined && parentElement !== null) {\n if (redraw && getElement(shapeOption.id)) {\n markerElement = getElement(shapeOption.id);\n circlePath = argsData.shape === 'Circle' ? 'c' : '';\n previousLocation = {\n x: +markerElement.getAttribute(circlePath + 'x'), y: +markerElement.getAttribute(circlePath + 'y')\n };\n previousPath = markerElement.getAttribute('d');\n }\n markerElement = drawSymbol(location, argsData.shape, new Size(argsData.width, argsData.height), marker.imageUrl, shapeOption, point.x.toString() + ':' + y.toString());\n appendChildElement(parentElement, markerElement, redraw, true, circlePath + 'x', circlePath + 'y', previousLocation, previousPath, false, false, null, series.chart.duration);\n }\n point.marker = {\n border: argsData.border,\n fill: argsData.fill,\n height: argsData.height,\n visible: true,\n shape: argsData.shape,\n width: argsData.width\n };\n }\n else {\n location = null;\n point.marker = {\n visible: false\n };\n }\n };\n Marker.prototype.createElement = function (series, redraw) {\n var markerClipRect;\n var marker = series.marker;\n // 8 for extend border value 5 for extend size value\n var explodeValue = marker.border.width + 8 + 5;\n var render = series.chart.renderer;\n var transform;\n var index = series.index === undefined ? series.category : series.index;\n var options;\n transform = series.chart.chartAreaType === 'Cartesian' ? 'translate(' + series.clipRect.x + ',' + (series.clipRect.y) + ')' : '';\n if (marker.visible) {\n var markerHeight = (marker.height + explodeValue) / 2;\n var markerWidth = (marker.width + explodeValue) / 2;\n if (series.chart.chartAreaType === 'Cartesian') {\n options = new RectOption(this.elementId + '_ChartMarkerClipRect_' + index, 'transparent', { width: 1, color: 'Gray' }, 1, {\n x: -markerWidth, y: -markerHeight,\n width: series.clipRect.width + markerWidth * 2,\n height: series.clipRect.height + markerHeight * 2\n });\n markerClipRect = appendClipElement(redraw, options, render);\n }\n else {\n options = new CircleOption(this.elementId + '_ChartMarkerClipRect_' + index, 'transparent', { width: 1, color: 'Gray' }, 1, series.clipRect.width / 2 + series.clipRect.x, series.clipRect.height / 2 + series.clipRect.y, series.chart.radius + Math.max(markerHeight, markerWidth));\n markerClipRect = appendClipElement(redraw, options, render, 'drawCircularClipPath');\n }\n options = {\n 'id': this.elementId + 'SymbolGroup' + index,\n 'transform': transform,\n 'clip-path': 'url(#' + this.elementId + '_ChartMarkerClipRect_' + index + ')'\n };\n series.symbolElement = render.createGroup(options);\n series.symbolElement.appendChild(markerClipRect);\n }\n };\n Marker.prototype.getRangeLowPoint = function (region, series) {\n var x = region.x;\n var y = region.y;\n if (series.chart.requireInvertedAxis) {\n y += region.height / 2;\n x += series.yAxis.isInversed ? region.width : 0;\n }\n else {\n y += series.yAxis.isInversed ? 0 : region.height;\n x += region.width / 2;\n }\n return { x: x, y: y };\n };\n /**\n * Animates the marker.\n * @return {void}.\n * @private\n */\n Marker.prototype.doMarkerAnimation = function (series) {\n if (!(series.type === 'Scatter' || series.type === 'Bubble' || series.type === 'Candle' || series.type === 'Hilo' ||\n series.type === 'HiloOpenClose' || (series.chart.chartAreaType === 'PolarRadar' && (series.drawType === 'Scatter')))) {\n var markerElements = series.symbolElement.childNodes;\n var delay = series.animation.delay + series.animation.duration;\n var duration = series.chart.animated ? series.chart.duration : 200;\n var j = 1;\n var incFactor = (series.type === 'RangeArea' || series.type === 'RangeColumn') ? 2 : 1;\n for (var i = 0; i < series.points.length; i++) {\n if (!series.points[i].symbolLocations.length || !markerElements[j]) {\n continue;\n }\n markerAnimate(markerElements[j], delay, duration, series, i, series.points[i].symbolLocations[0], false);\n if (incFactor === 2) {\n var lowPoint = this.getRangeLowPoint(series.points[i].regions[0], series);\n markerAnimate(markerElements[j + 1], delay, duration, series, i, lowPoint, false);\n }\n j += incFactor;\n }\n }\n };\n return Marker;\n}(MarkerExplode));\nexport { Marker };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, Complex, ChildProperty } from '@syncfusion/ej2-base';\nimport { measureText, Rect, TextOption, Size, PathOption } from '@syncfusion/ej2-svg-base';\nimport { Font, Border, Margin } from '../model/base';\nimport { Theme } from '../model/theme';\nimport { subtractThickness, Thickness, drawSymbol, ChartLocation } from '../utils/helper';\nimport { RectOption, textElement, stringToNumber } from '../utils/helper';\nimport { removeElement, showTooltip, getElement, appendChildElement } from '../utils/helper';\n/**\n * Configures the location for the legend.\n */\nvar Location = /** @class */ (function (_super) {\n __extends(Location, _super);\n function Location() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(0)\n ], Location.prototype, \"x\", void 0);\n __decorate([\n Property(0)\n ], Location.prototype, \"y\", void 0);\n return Location;\n}(ChildProperty));\nexport { Location };\n/**\n * Configures the legends in charts.\n */\nvar LegendSettings = /** @class */ (function (_super) {\n __extends(LegendSettings, _super);\n function LegendSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], LegendSettings.prototype, \"visible\", void 0);\n __decorate([\n Property(null)\n ], LegendSettings.prototype, \"height\", void 0);\n __decorate([\n Property(null)\n ], LegendSettings.prototype, \"width\", void 0);\n __decorate([\n Complex({ x: 0, y: 0 }, Location)\n ], LegendSettings.prototype, \"location\", void 0);\n __decorate([\n Property('Auto')\n ], LegendSettings.prototype, \"position\", void 0);\n __decorate([\n Property(8)\n ], LegendSettings.prototype, \"padding\", void 0);\n __decorate([\n Property('Center')\n ], LegendSettings.prototype, \"alignment\", void 0);\n __decorate([\n Complex(Theme.legendLabelFont, Font)\n ], LegendSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property(10)\n ], LegendSettings.prototype, \"shapeHeight\", void 0);\n __decorate([\n Property(10)\n ], LegendSettings.prototype, \"shapeWidth\", void 0);\n __decorate([\n Complex({}, Border)\n ], LegendSettings.prototype, \"border\", void 0);\n __decorate([\n Complex({ left: 0, right: 0, top: 0, bottom: 0 }, Margin)\n ], LegendSettings.prototype, \"margin\", void 0);\n __decorate([\n Property(5)\n ], LegendSettings.prototype, \"shapePadding\", void 0);\n __decorate([\n Property('transparent')\n ], LegendSettings.prototype, \"background\", void 0);\n __decorate([\n Property(1)\n ], LegendSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property(true)\n ], LegendSettings.prototype, \"toggleVisibility\", void 0);\n __decorate([\n Property(null)\n ], LegendSettings.prototype, \"description\", void 0);\n __decorate([\n Property(3)\n ], LegendSettings.prototype, \"tabIndex\", void 0);\n return LegendSettings;\n}(ChildProperty));\nexport { LegendSettings };\n/**\n * Legend base class for Chart and Accumulation chart.\n * @private\n */\nvar BaseLegend = /** @class */ (function () {\n /**\n * Constructor for the dateTime module.\n * @private\n */\n function BaseLegend(chart) {\n this.rowCount = 0; // legend row counts per page \n this.columnCount = 0; // legend column counts per page \n this.pageButtonSize = 8;\n this.pageXCollections = []; // pages of x locations\n this.maxColumns = 0;\n this.isTrimmed = false;\n this.maxWidth = 0;\n this.currentPage = 1;\n this.chart = chart;\n this.legend = chart.legendSettings;\n this.legendID = chart.element.id + '_chart_legend';\n this.isChartControl = (chart.getModuleName() === 'chart');\n }\n /**\n * Calculate the bounds for the legends.\n * @return {void}\n * @private\n */\n BaseLegend.prototype.calculateLegendBounds = function (rect, availableSize) {\n var legend = this.legend;\n this.getPosition(legend.position, availableSize);\n this.legendBounds = new Rect(rect.x, rect.y, 0, 0);\n this.isVertical = (this.position === 'Left' || this.position === 'Right');\n if (this.isVertical) {\n this.legendBounds.height = stringToNumber(legend.height, availableSize.height - (rect.y - this.chart.margin.top)) || rect.height;\n this.legendBounds.width = stringToNumber(legend.width || '20%', availableSize.width);\n }\n else {\n this.legendBounds.width = stringToNumber(legend.width, availableSize.width) || rect.width;\n this.legendBounds.height = stringToNumber(legend.height || '20%', availableSize.height);\n }\n this.library.getLegendBounds(availableSize, this.legendBounds, legend);\n this.getLocation(this.position, legend.alignment, this.legendBounds, rect, availableSize);\n };\n /**\n * To find legend position based on available size for chart and accumulation chart\n */\n BaseLegend.prototype.getPosition = function (position, availableSize) {\n if (this.isChartControl) {\n this.position = (position !== 'Auto') ? position : 'Bottom';\n }\n else {\n if (position === 'Auto' && this.chart.visibleSeries &&\n (this.chart.visibleSeries[0].type === 'Funnel' || this.chart.visibleSeries[0].type === 'Pyramid')) {\n position = 'Top';\n }\n this.position = (position !== 'Auto') ? position :\n (availableSize.width > availableSize.height ? 'Right' : 'Bottom');\n }\n };\n /**\n * To set bounds for chart and accumulation chart\n */\n BaseLegend.prototype.setBounds = function (computedWidth, computedHeight, legend, legendBounds) {\n computedWidth = computedWidth < legendBounds.width ? computedWidth : legendBounds.width;\n computedHeight = computedHeight < legendBounds.height ? computedHeight : legendBounds.height;\n legendBounds.width = !legend.width ? computedWidth : legendBounds.width;\n legendBounds.height = !legend.height ? computedHeight : legendBounds.height;\n this.rowCount = Math.max(1, Math.ceil((legendBounds.height - legend.padding) / (this.maxItemHeight + legend.padding)));\n };\n /**\n * To find legend location based on position, alignment for chart and accumulation chart\n */\n BaseLegend.prototype.getLocation = function (position, alignment, legendBounds, rect, availableSize) {\n var padding = this.legend.border.width;\n var legendHeight = legendBounds.height + padding + this.legend.margin.top + this.legend.margin.bottom;\n var legendWidth = legendBounds.width + padding + this.legend.margin.left + this.legend.margin.right;\n var marginBottom = this.chart.margin.bottom;\n if (position === 'Bottom') {\n legendBounds.x = this.alignLegend(legendBounds.x, availableSize.width, legendBounds.width, alignment);\n legendBounds.y = rect.y + (rect.height - legendHeight) + padding + this.legend.margin.top;\n subtractThickness(rect, new Thickness(0, 0, 0, legendHeight));\n }\n else if (position === 'Top') {\n legendBounds.x = this.alignLegend(legendBounds.x, availableSize.width, legendBounds.width, alignment);\n legendBounds.y = rect.y + padding + this.legend.margin.top;\n subtractThickness(rect, new Thickness(0, 0, legendHeight, 0));\n }\n else if (position === 'Right') {\n legendBounds.x = rect.x + (rect.width - legendBounds.width) - this.legend.margin.right;\n legendBounds.y = rect.y + this.alignLegend(0, availableSize.height - (rect.y + marginBottom), legendBounds.height, alignment);\n subtractThickness(rect, new Thickness(0, legendWidth, 0, 0));\n }\n else if (position === 'Left') {\n legendBounds.x = legendBounds.x + this.legend.margin.left;\n legendBounds.y = rect.y + this.alignLegend(0, availableSize.height - (rect.y + marginBottom), legendBounds.height, alignment);\n subtractThickness(rect, new Thickness(legendWidth, 0, 0, 0));\n }\n else {\n legendBounds.x = this.legend.location.x;\n legendBounds.y = this.legend.location.y;\n subtractThickness(rect, new Thickness(0, 0, 0, 0));\n }\n };\n /**\n * To find legend alignment for chart and accumulation chart\n */\n BaseLegend.prototype.alignLegend = function (start, size, legendSize, alignment) {\n switch (alignment) {\n case 'Far':\n start = (size - legendSize) - start;\n break;\n case 'Center':\n start = ((size - legendSize) / 2);\n break;\n }\n return start;\n };\n /**\n * Renders the legend.\n * @return {void}\n * @private\n */\n BaseLegend.prototype.renderLegend = function (chart, legend, legendBounds, redraw) {\n var firstLegend = this.findFirstLegendPosition(this.legendCollections);\n var padding = legend.padding;\n this.maxItemHeight = Math.max(this.legendCollections[0].textSize.height, legend.shapeHeight);\n var legendGroup = chart.renderer.createGroup({ id: this.legendID + '_g' });\n var legendTranslateGroup = this.createLegendElements(chart, legendBounds, legendGroup, legend, this.legendID, redraw);\n if (firstLegend !== this.legendCollections.length) {\n var legendSeriesGroup = void 0; // legendItem group for each series group element\n var start = void 0; // starting shape center x,y position && to resolve lint error used new line for declaration\n start = new ChartLocation(legendBounds.x + padding + (legend.shapeWidth / 2), legendBounds.y + padding + this.maxItemHeight / 2);\n var textOptions = new TextOption('', start.x, start.y, 'start');\n // initialization for totalPages legend click totalpage again calculate\n this.totalPages = this.isChartControl ? this.totalPages : 0;\n var textPadding = legend.shapePadding + padding + legend.shapeWidth;\n var count = 0;\n this.pageXCollections = [];\n this.legendCollections[firstLegend].location = start;\n var previousLegend = this.legendCollections[firstLegend];\n for (var _i = 0, _a = this.legendCollections; _i < _a.length; _i++) {\n var legendOption = _a[_i];\n if (this.chart.getModuleName() === 'accumulationchart') {\n legendOption.fill = this.chart.visibleSeries[0].points[legendOption.pointIndex].color;\n }\n if (legendOption.render && legendOption.text !== '') {\n legendSeriesGroup = chart.renderer.createGroup({\n id: this.legendID + this.generateId(legendOption, '_g_', count)\n });\n legendSeriesGroup.setAttribute('tabindex', legend.tabIndex.toString());\n legendSeriesGroup.setAttribute('aria-label', legend.description || 'Click to show or hide the ' + legendOption.text + ' series');\n this.library.getRenderPoint(legendOption, start, textPadding, previousLegend, legendBounds, count, firstLegend);\n this.renderSymbol(legendOption, legendSeriesGroup, count);\n this.renderText(chart, legendOption, legendSeriesGroup, textOptions, count);\n legendSeriesGroup.setAttribute('style', 'cursor: ' + ((!legend.toggleVisibility && chart.selectionMode === 'None') ? 'auto' : 'pointer'));\n legendTranslateGroup.appendChild(legendSeriesGroup);\n previousLegend = legendOption;\n }\n count++;\n }\n if (this.isPaging) {\n this.renderPagingElements(chart, legendBounds, textOptions, legendGroup);\n }\n else {\n this.totalPages = 1;\n }\n }\n appendChildElement(chart.svgObject, legendGroup, redraw);\n };\n /**\n * To find first valid legend text index for chart and accumulation chart\n */\n BaseLegend.prototype.findFirstLegendPosition = function (legendCollection) {\n var count = 0;\n for (var _i = 0, legendCollection_1 = legendCollection; _i < legendCollection_1.length; _i++) {\n var legend = legendCollection_1[_i];\n if (legend.render && legend.text !== '') {\n break;\n }\n count++;\n }\n return count;\n };\n /**\n * To create legend rendering elements for chart and accumulation chart\n */\n BaseLegend.prototype.createLegendElements = function (chart, legendBounds, legendGroup, legend, id, redraw) {\n var padding = legend.padding;\n var options = new RectOption(id + '_element', legend.background, legend.border, legend.opacity, legendBounds);\n legendGroup.appendChild(chart.renderer.drawRectangle(options));\n var legendItemsGroup = chart.renderer.createGroup({ id: id + '_collections' });\n legendGroup.appendChild(legendItemsGroup);\n this.legendTranslateGroup = chart.renderer.createGroup({ id: id + '_translate_g' });\n legendItemsGroup.appendChild(this.legendTranslateGroup);\n var clippath = chart.renderer.createClipPath({ id: id + '_clipPath' });\n options.y += padding;\n options.id += '_clipPath_rect';\n options.width = (!this.isChartControl && this.isVertical) ? this.maxWidth - padding : legendBounds.width;\n this.clipRect = chart.renderer.drawRectangle(options);\n clippath.appendChild(this.clipRect);\n appendChildElement(chart.svgObject, clippath, redraw);\n legendItemsGroup.setAttribute('style', 'clip-path:url(#' + clippath.id + ')');\n return this.legendTranslateGroup;\n };\n /**\n * To render legend symbols for chart and accumulation chart\n */\n BaseLegend.prototype.renderSymbol = function (legendOption, group, i) {\n var symbolColor = legendOption.visible ? legendOption.fill : '#D3D3D3';\n var shape = (legendOption.shape === 'SeriesType') ? legendOption.type : legendOption.shape;\n shape = shape === 'Scatter' ? legendOption.markerShape : shape;\n var isStrokeWidth = (this.chart.getModuleName() === 'chart' && (legendOption.shape === 'SeriesType') &&\n (legendOption.type.toLowerCase().indexOf('line') > -1) && (legendOption.type.toLowerCase().indexOf('area') === -1));\n var strokewidth = isStrokeWidth ? this.chart.visibleSeries[i].width : 1;\n var symbolOption = new PathOption(this.legendID + this.generateId(legendOption, '_shape_', i), symbolColor, strokewidth, symbolColor, 1, '', '');\n group.appendChild(drawSymbol(legendOption.location, shape, new Size(this.legend.shapeWidth, this.legend.shapeHeight), '', symbolOption, 'Click to show or hide the ' + legendOption.text + ' series'));\n if (shape === 'Line' && legendOption.markerVisibility && legendOption.markerShape !== 'Image' ||\n legendOption.type === 'Doughnut') {\n symbolOption.id = this.legendID + this.generateId(legendOption, '_shape_marker_', i);\n shape = legendOption.type === 'Doughnut' ? 'Circle' : legendOption.markerShape;\n symbolOption.fill = legendOption.type === 'Doughnut' ? '#FFFFFF' : symbolOption.fill;\n group.appendChild(drawSymbol(legendOption.location, shape, new Size(this.legend.shapeWidth / 2, this.legend.shapeHeight / 2), '', symbolOption, 'Click to show or hide the ' + legendOption.text + ' series'));\n }\n };\n /**\n * To render legend text for chart and accumulation chart\n */\n BaseLegend.prototype.renderText = function (chart, legendOption, group, textOptions, i) {\n var legend = chart.legendSettings;\n var hiddenColor = '#D3D3D3';\n textOptions.id = this.legendID + this.generateId(legendOption, '_text_', i);\n var fontcolor = legendOption.visible ? legend.textStyle.color || chart.themeStyle.legendLabel : hiddenColor;\n textOptions.text = legendOption.text;\n textOptions.x = legendOption.location.x + (legend.shapeWidth / 2) + legend.shapePadding;\n textOptions.y = legendOption.location.y + this.maxItemHeight / 4;\n var element = textElement(textOptions, legend.textStyle, fontcolor, group);\n element.setAttribute('aria-label', legend.description || 'Click to show or hide the ' + legendOption.text + ' series');\n };\n /**\n * To render legend paging elements for chart and accumulation chart\n */\n BaseLegend.prototype.renderPagingElements = function (chart, bounds, textOption, legendGroup) {\n var paginggroup = chart.renderer.createGroup({ id: this.legendID + '_navigation' });\n legendGroup.appendChild(paginggroup);\n var grayColor = '#545454';\n var legend = chart.legendSettings; // to solve parameter lint error, legend declaration is here\n var padding = 8; // const padding for paging elements\n if (this.isChartControl || !this.isVertical) {\n this.totalPages = Math.ceil(this.totalPages / Math.max(1, this.rowCount - 1));\n }\n else {\n this.totalPages = Math.ceil(this.totalPages / this.maxColumns);\n }\n var symbolOption = new PathOption(this.legendID + '_pageup', 'transparent', 5, grayColor, 1, '', '');\n var iconSize = this.pageButtonSize;\n paginggroup.setAttribute('style', 'cursor: pointer');\n // Page left arrow drawing calculation started here\n this.clipPathHeight = (this.rowCount - 1) * (this.maxItemHeight + legend.padding);\n this.clipRect.setAttribute('height', this.clipPathHeight.toString());\n var x = bounds.x + iconSize / 2;\n var y = bounds.y + this.clipPathHeight + ((bounds.height - this.clipPathHeight) / 2);\n paginggroup.appendChild(drawSymbol({ x: x, y: y }, 'LeftArrow', new Size(iconSize, iconSize), '', symbolOption, 'LeftArrow'));\n // Page numbering rendering calculation started here\n textOption.x = x + (iconSize / 2) + padding;\n var size = measureText(this.totalPages + '/' + this.totalPages, legend.textStyle);\n textOption.y = y + (size.height / 4);\n textOption.id = this.legendID + '_pagenumber';\n textOption.text = '1/' + this.totalPages;\n var pageTextElement = textElement(textOption, legend.textStyle, legend.textStyle.color, paginggroup);\n // Page right arrow rendering calculation started here\n x = (textOption.x + padding + (iconSize / 2) + size.width);\n symbolOption.id = this.legendID + '_pagedown';\n paginggroup.appendChild(drawSymbol({ x: x, y: y }, 'RightArrow', new Size(iconSize, iconSize), '', symbolOption, 'RightArrow'));\n // placing the navigation buttons and page numbering in legend right corner\n paginggroup.setAttribute('transform', 'translate(' + (bounds.width - (2 * (iconSize + padding) +\n padding + size.width)) + ', ' + 0 + ')');\n this.translatePage(pageTextElement, this.currentPage - 1, this.currentPage);\n };\n /**\n * To translate legend pages for chart and accumulation chart\n */\n BaseLegend.prototype.translatePage = function (pagingText, page, pageNumber) {\n var size = (this.clipPathHeight) * page;\n var translate = 'translate(0,-' + size + ')';\n if (!this.isChartControl && this.isVertical) {\n var pageLength = page * this.maxColumns;\n size = this.pageXCollections[page * this.maxColumns] - this.legendBounds.x;\n size = size < 0 ? 0 : size; // to avoid small pixel variation\n translate = 'translate(-' + size + ',0)';\n }\n this.legendTranslateGroup.setAttribute('transform', translate);\n pagingText.textContent = (pageNumber) + '/' + this.totalPages;\n this.currentPage = pageNumber;\n };\n /**\n * To change legend pages for chart and accumulation chart\n */\n BaseLegend.prototype.changePage = function (event, pageUp) {\n var pageText = document.getElementById(this.legendID + '_pagenumber');\n var page = parseInt(pageText.textContent.split('/')[0], 10);\n if (pageUp && page > 1) {\n this.translatePage(pageText, (page - 2), (page - 1));\n }\n else if (!pageUp && page < this.totalPages) {\n this.translatePage(pageText, page, (page + 1));\n }\n };\n /**\n * To find legend elements id based on chart or accumulation chart\n * @private\n */\n BaseLegend.prototype.generateId = function (option, prefix, count) {\n if (this.isChartControl) {\n return prefix + count;\n }\n else {\n return prefix + option.pointIndex;\n }\n };\n /**\n * To show or hide trimmed text tooltip for legend.\n * @return {void}\n * @private\n */\n BaseLegend.prototype.move = function (event) {\n var _this = this;\n var x = this.chart.mouseX;\n var y = this.chart.mouseY;\n if (event.target.textContent.indexOf('...') > -1) {\n var targetId = event.target.id.split(this.legendID + '_text_');\n if (targetId.length === 2) {\n var index = parseInt(targetId[1], 10);\n var element = this.chart.element;\n if (!isNaN(index)) {\n if (this.chart.isTouch) {\n removeElement(this.chart.element.id + '_EJ2_Legend_Tooltip');\n }\n if (this.isChartControl) {\n showTooltip(this.chart.series[index].name, x, y, element.offsetWidth, element.id + '_EJ2_Legend_Tooltip', getElement(this.chart.element.id + '_Secondary_Element'));\n }\n else {\n showTooltip(this.chart.visibleSeries[0].points[index].x.toString(), x + 10, y + 10, element.offsetWidth, element.id + '_EJ2_Legend_Tooltip', getElement(this.chart.element.id + '_Secondary_Element'));\n }\n }\n }\n }\n else {\n removeElement(this.chart.element.id + '_EJ2_Legend_Tooltip');\n }\n if (this.chart.isTouch) {\n clearTimeout(this.clearTooltip);\n this.clearTooltip = setTimeout(function () { removeElement(_this.chart.element.id + '_EJ2_Legend_Tooltip'); }, 1000);\n }\n };\n return BaseLegend;\n}());\nexport { BaseLegend };\n/**\n * Class for legend options\n * @private\n */\nvar LegendOptions = /** @class */ (function () {\n function LegendOptions(text, fill, shape, visible, type, markerShape, markerVisibility, pointIndex, seriesIndex) {\n this.location = { x: 0, y: 0 };\n this.text = text;\n this.fill = fill;\n this.shape = shape;\n this.visible = visible;\n this.type = type;\n this.markerVisibility = markerVisibility;\n this.markerShape = markerShape;\n this.pointIndex = pointIndex;\n this.seriesIndex = seriesIndex;\n }\n return LegendOptions;\n}());\nexport { LegendOptions };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n///}\n */\n ZipArchive.prototype.save = function (fileName) {\n if (fileName === null || fileName === undefined || fileName.length === 0) {\n throw new Error('ArgumentException: fileName cannot be null or undefined');\n }\n if (this.files.length === 0) {\n throw new Error('InvalidOperation');\n }\n var zipArchive = this;\n var promise;\n return promise = new Promise(function (resolve, reject) {\n zipArchive.saveInternal(fileName, false).then(function () {\n resolve(zipArchive);\n });\n });\n };\n /**\n * Save archive as blob\n * @return {Promise}\n */\n ZipArchive.prototype.saveAsBlob = function () {\n var zipArchive = this;\n var promise;\n return promise = new Promise(function (resolve, reject) {\n zipArchive.saveInternal('', true).then(function (blob) {\n resolve(blob);\n });\n });\n };\n ZipArchive.prototype.saveInternal = function (fileName, skipFileSave) {\n var _this = this;\n var zipArchive = this;\n var promise;\n return promise = new Promise(function (resolve, reject) {\n var zipData = [];\n var dirLength = 0;\n for (var i = 0; i < zipArchive.files.length; i++) {\n var compressedObject = _this.getCompressedData(_this.files[i]);\n compressedObject.then(function (data) {\n dirLength = zipArchive.constructZippedObject(zipData, data, dirLength, data.isDirectory);\n if (zipData.length === zipArchive.files.length) {\n var blob = zipArchive.writeZippedContent(fileName, zipData, dirLength, skipFileSave);\n resolve(blob);\n }\n });\n }\n });\n };\n /**\n * release allocated un-managed resource\n * @returns {void}\n */\n ZipArchive.prototype.destroy = function () {\n if (this.files !== undefined && this.files.length > 0) {\n for (var i = 0; i < this.files.length; i++) {\n var file = this.files[i];\n if (file instanceof ZipArchiveItem) {\n file.destroy();\n }\n file = undefined;\n }\n this.files = [];\n }\n this.files = undefined;\n this.level = undefined;\n };\n ZipArchive.prototype.getCompressedData = function (item) {\n var zipArchive = this;\n var promise = new Promise(function (resolve, reject) {\n if (item instanceof ZipArchiveItem) {\n var reader_1 = new FileReader();\n reader_1.onload = function () {\n var input = new Uint8Array(reader_1.result);\n var data = {\n fileName: item.name, crc32Value: 0, compressedData: [],\n compressedSize: undefined, uncompressedDataSize: input.length, compressionType: undefined,\n isDirectory: false\n };\n if (zipArchive.level === 'Normal') {\n zipArchive.compressData(input, data, CRC32TABLE);\n var length_1 = 0;\n for (var i = 0; i < data.compressedData.length; i++) {\n length_1 += data.compressedData[i].length;\n }\n data.compressedSize = length_1;\n data.compressionType = '\\x08\\x00'; //Deflated = 8\n }\n else {\n data.compressedSize = input.length;\n data.crc32Value = zipArchive.calculateCrc32Value(0, input, CRC32TABLE);\n data.compressionType = '\\x00\\x00'; // Stored = 0\n data.compressedData.push(input);\n }\n resolve(data);\n };\n reader_1.readAsArrayBuffer(item.data);\n }\n else {\n var data = {\n fileName: item, crc32Value: 0, compressedData: '', compressedSize: 0, uncompressedDataSize: 0,\n compressionType: '\\x00\\x00', isDirectory: true\n };\n resolve(data);\n }\n });\n return promise;\n };\n ZipArchive.prototype.compressData = function (input, data, crc32Table) {\n var compressor = new CompressedStreamWriter(true);\n var currentIndex = 0;\n var nextIndex = 0;\n do {\n if (currentIndex >= input.length) {\n compressor.close();\n break;\n }\n nextIndex = Math.min(input.length, currentIndex + 16384);\n var subArray = input.subarray(currentIndex, nextIndex);\n data.crc32Value = this.calculateCrc32Value(data.crc32Value, subArray, crc32Table);\n compressor.write(subArray, 0, nextIndex - currentIndex);\n currentIndex = nextIndex;\n } while (currentIndex <= input.length);\n data.compressedData = compressor.compressedData;\n compressor.destroy();\n };\n ZipArchive.prototype.constructZippedObject = function (zipParts, data, dirLength, isDirectory) {\n var extFileAttr = 0;\n var date = new Date();\n if (isDirectory) {\n extFileAttr = extFileAttr | 0x00010; // directory flag\n }\n extFileAttr = extFileAttr | (0 & 0x3F);\n var header = this.writeHeader(data, date);\n var localHeader = 'PK\\x03\\x04' + header + data.fileName;\n var centralDir = this.writeCentralDirectory(data, header, dirLength, extFileAttr);\n zipParts.push({ localHeader: localHeader, centralDir: centralDir, compressedData: data });\n return dirLength + localHeader.length + data.compressedSize;\n };\n ZipArchive.prototype.writeHeader = function (data, date) {\n var zipHeader = '';\n zipHeader += '\\x0A\\x00' + '\\x00\\x00'; // version needed to extract & general purpose bit flag\n zipHeader += data.compressionType; // compression method Deflate=8,Stored=0\n zipHeader += this.getBytes(this.getModifiedTime(date), 2); // last modified Time\n zipHeader += this.getBytes(this.getModifiedDate(date), 2); // last modified date\n zipHeader += this.getBytes(data.crc32Value, 4); // crc-32 value\n zipHeader += this.getBytes(data.compressedSize, 4); // compressed file size\n zipHeader += this.getBytes(data.uncompressedDataSize, 4); // uncompressed file size\n zipHeader += this.getBytes(data.fileName.length, 2); // file name length\n zipHeader += this.getBytes(0, 2); // extra field length\n return zipHeader;\n };\n ZipArchive.prototype.writeZippedContent = function (fileName, zipData, localDirLen, skipFileSave) {\n var cenDirLen = 0;\n var buffer = [];\n for (var i = 0; i < zipData.length; i++) {\n var item = zipData[i];\n cenDirLen += item.centralDir.length;\n buffer.push(this.getArrayBuffer(item.localHeader));\n while (item.compressedData.compressedData.length) {\n buffer.push(item.compressedData.compressedData.shift().buffer);\n }\n }\n for (var i = 0; i < zipData.length; i++) {\n buffer.push(this.getArrayBuffer(zipData[i].centralDir));\n }\n buffer.push(this.getArrayBuffer(this.writeFooter(zipData, cenDirLen, localDirLen)));\n var blob = new Blob(buffer, { type: 'application/zip' });\n if (!skipFileSave) {\n Save.save(fileName, blob);\n }\n return blob;\n };\n ZipArchive.prototype.writeCentralDirectory = function (data, localHeader, offset, externalFileAttribute) {\n var directoryHeader = 'PK\\x01\\x02' +\n this.getBytes(0x0014, 2) + localHeader + // inherit from file header\n this.getBytes(0, 2) + // comment length\n '\\x00\\x00' + '\\x00\\x00' + // internal file attributes \n this.getBytes(externalFileAttribute, 4) + // external file attributes\n this.getBytes(offset, 4) + // local fileHeader relative offset\n data.fileName;\n return directoryHeader;\n };\n ZipArchive.prototype.writeFooter = function (zipData, centralLength, localLength) {\n var dirEnd = 'PK\\x05\\x06' + '\\x00\\x00' + '\\x00\\x00' +\n this.getBytes(zipData.length, 2) + this.getBytes(zipData.length, 2) +\n this.getBytes(centralLength, 4) + this.getBytes(localLength, 4) +\n this.getBytes(0, 2);\n return dirEnd;\n };\n ZipArchive.prototype.getArrayBuffer = function (input) {\n var a = new Uint8Array(input.length);\n for (var j = 0; j < input.length; ++j) {\n a[j] = input.charCodeAt(j) & 0xFF;\n }\n return a.buffer;\n };\n ZipArchive.prototype.getBytes = function (value, offset) {\n var bytes = '';\n for (var i = 0; i < offset; i++) {\n bytes += String.fromCharCode(value & 0xff);\n value = value >>> 8;\n }\n return bytes;\n };\n ZipArchive.prototype.getModifiedTime = function (date) {\n var modTime = date.getHours();\n modTime = modTime << 6;\n modTime = modTime | date.getMinutes();\n modTime = modTime << 5;\n return modTime = modTime | date.getSeconds() / 2;\n };\n ZipArchive.prototype.getModifiedDate = function (date) {\n var modiDate = date.getFullYear() - 1980;\n modiDate = modiDate << 4;\n modiDate = modiDate | (date.getMonth() + 1);\n modiDate = modiDate << 5;\n return modiDate = modiDate | date.getDate();\n };\n ZipArchive.prototype.calculateCrc32Value = function (crc32Value, input, crc32Table) {\n crc32Value ^= -1;\n for (var i = 0; i < input.length; i++) {\n crc32Value = (crc32Value >>> 8) ^ crc32Table[(crc32Value ^ input[i]) & 0xFF];\n }\n return (crc32Value ^ (-1));\n };\n /**\n * construct cyclic redundancy code table\n * @private\n */\n ZipArchive.initCrc32Table = function () {\n var i;\n for (var j = 0; j < 256; j++) {\n i = j;\n for (var k = 0; k < 8; k++) {\n i = ((i & 1) ? (0xEDB88320 ^ (i >>> 1)) : (i >>> 1));\n }\n CRC32TABLE[j] = i;\n }\n };\n return ZipArchive;\n}());\nexport { ZipArchive };\n/**\n * Class represent unique ZipArchive item\n * ```typescript\n * let archiveItem = new ZipArchiveItem(archive, 'directoryName\\fileName.txt');\n * ```\n */\nvar ZipArchiveItem = /** @class */ (function () {\n /**\n * constructor for creating {ZipArchiveItem} instance\n * @param {Blob|ArrayBuffer} data file data\n * @param {itemName} itemName absolute file path\n */\n function ZipArchiveItem(data, itemName) {\n if (data === null || data === undefined) {\n throw new Error('ArgumentException: data cannot be null or undefined');\n }\n if (itemName === null || itemName === undefined) {\n throw new Error('ArgumentException: string cannot be null or undefined');\n }\n if (itemName.length === 0) {\n throw new Error('string cannot be empty');\n }\n this.data = data;\n this.name = itemName;\n }\n Object.defineProperty(ZipArchiveItem.prototype, \"name\", {\n /**\n * Get the name of archive item\n * @returns string\n */\n get: function () {\n return this.fileName;\n },\n /**\n * Set the name of archive item\n * @param {string} value\n */\n set: function (value) {\n this.fileName = value;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * release allocated un-managed resource\n * @returns {void}\n */\n ZipArchiveItem.prototype.destroy = function () {\n this.fileName = undefined;\n this.data = undefined;\n };\n return ZipArchiveItem;\n}());\nexport { ZipArchiveItem };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfDictionary } from './pdf-dictionary';\nimport { PdfNumber } from './pdf-number';\nimport { Operators } from './../input-output/pdf-operators';\nimport { PdfName } from './pdf-name';\nimport { PdfArray } from './pdf-array';\nimport { PdfReferenceHolder } from './pdf-reference';\nimport { CompressedStreamWriter } from '@syncfusion/ej2-compression';\n/**\n * `PdfStream` class is used to perform stream related primitive operations.\n * @private\n */\nvar PdfStream = /** @class */ (function (_super) {\n __extends(PdfStream, _super);\n function PdfStream(dictionary, data) {\n var _this = _super.call(this, dictionary) || this;\n //Constants\n /**\n * @hidden\n * @private\n */\n _this.dicPrefix = 'stream';\n /**\n * @hidden\n * @private\n */\n _this.dicSuffix = 'endstream';\n /**\n * Internal variable to hold `cloned object`.\n * @private\n */\n _this.clonedObject2 = null;\n /**\n * @hidden\n * @private\n */\n _this.bCompress = true;\n /**\n * @hidden\n * @private\n */\n _this.isImageStream = false;\n /**\n * @hidden\n * @private\n */\n _this.isFontStream = false;\n if (typeof dictionary !== 'undefined' || typeof data !== 'undefined') {\n _this.dataStream2 = [];\n _this.dataStream2 = data;\n _this.bCompress2 = false;\n }\n else {\n _this.dataStream2 = [];\n _this.bCompress2 = true;\n //Pending\n }\n return _this;\n }\n Object.defineProperty(PdfStream.prototype, \"internalStream\", {\n /**\n * Gets the `internal` stream.\n * @private\n */\n get: function () {\n return this.dataStream2;\n },\n set: function (value) {\n this.dataStream2 = [];\n this.dataStream2 = value;\n this.modify();\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStream.prototype, \"isImage\", {\n /**\n * Gets or sets 'is image' flag.\n * @private\n */\n get: function () {\n return this.isImageStream;\n },\n set: function (value) {\n this.isImageStream = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStream.prototype, \"isFont\", {\n /**\n * Gets or sets 'is font' flag.\n * @private\n */\n get: function () {\n return this.isFontStream;\n },\n set: function (value) {\n this.isFontStream = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStream.prototype, \"compress\", {\n /**\n * Gets or sets `compression` flag.\n * @private\n */\n get: function () {\n return this.bCompress;\n },\n set: function (value) {\n this.bCompress = value;\n this.modify();\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStream.prototype, \"data\", {\n /**\n * Gets or sets the `data`.\n * @private\n */\n get: function () {\n return this.dataStream2;\n },\n set: function (value) {\n this.dataStream2 = [];\n this.dataStream2 = value;\n this.modify();\n },\n enumerable: true,\n configurable: true\n });\n /**\n * `Clear` the internal stream.\n * @private\n */\n PdfStream.prototype.clearStream = function () {\n this.internalStream = [];\n if (this.items.containsKey(this.dictionaryProperties.filter)) {\n this.remove(this.dictionaryProperties.filter);\n }\n this.bCompress = true;\n this.modify();\n };\n /**\n * `Writes` the specified string.\n * @private\n */\n PdfStream.prototype.write = function (text) {\n if (text == null) {\n throw new Error('ArgumentNullException:text');\n }\n if (text.length <= 0) {\n throw new Error('ArgumentException: Can not write an empty string, text');\n }\n this.dataStream2.push(text);\n this.modify();\n };\n /**\n * `Writes` the specified bytes.\n * @private\n */\n PdfStream.prototype.writeBytes = function (data) {\n if (data === null) {\n throw new Error('ArgumentNullException:data');\n }\n if (data.length <= 0) {\n throw new Error('ArgumentException: Can not write an empty bytes, data');\n }\n var text = '';\n for (var i = 0; i < data.length; i++) {\n text += String.fromCharCode(data[i]);\n }\n this.dataStream2.push(text);\n this.modify();\n };\n /**\n * Raises event `Cmap BeginSave`.\n * @private\n */\n PdfStream.prototype.onCmapBeginSave = function () {\n this.cmapBeginSave.sender.cmapBeginSave();\n };\n /**\n * Raises event `Font Program BeginSave`.\n * @private\n */\n PdfStream.prototype.onFontProgramBeginSave = function () {\n this.fontProgramBeginSave.sender.fontProgramBeginSave();\n };\n /**\n * `Compresses the content` if it's required.\n * @private\n */\n PdfStream.prototype.compressContent = function (data, writer) {\n if (this.bCompress) {\n var byteArray = [];\n for (var i = 0; i < data.length; i++) {\n byteArray.push(data.charCodeAt(i));\n }\n var dataArray = new Uint8Array(byteArray);\n var sw = new CompressedStreamWriter();\n // data = 'Hello World!!!';\n sw.write(dataArray, 0, dataArray.length);\n sw.close();\n data = sw.getCompressedString;\n this.addFilter(this.dictionaryProperties.flatedecode);\n }\n return data;\n };\n /**\n * `Adds a filter` to the filter array.\n * @private\n */\n PdfStream.prototype.addFilter = function (filterName) {\n var obj = this.items.getValue(this.dictionaryProperties.filter);\n if (obj instanceof PdfReferenceHolder) {\n var rh = obj;\n obj = rh.object;\n }\n var array = obj;\n var name = obj;\n if (name != null) {\n array = new PdfArray();\n array.insert(0, name);\n this.items.setValue(this.dictionaryProperties.filter, array);\n }\n name = new PdfName(filterName);\n if (array == null) {\n this.items.setValue(this.dictionaryProperties.filter, name);\n }\n else {\n array.insert(0, name);\n }\n };\n /**\n * `Saves` the object using the specified writer.\n * @private\n */\n PdfStream.prototype.save = function (writer) {\n if (typeof this.cmapBeginSave !== 'undefined') {\n this.onCmapBeginSave();\n }\n if (typeof this.fontProgramBeginSave !== 'undefined') {\n this.onFontProgramBeginSave();\n }\n var data = '';\n for (var i = 0; i < this.data.length; i++) {\n data = data + this.data[i];\n }\n if (data.length > 1 && !this.isImage && !this.isFont) {\n data = 'q\\r\\n' + data + 'Q\\r\\n';\n }\n data = this.compressContent(data, writer);\n var length = data.length;\n this.items.setValue(this.dictionaryProperties.length, new PdfNumber(length));\n _super.prototype.save.call(this, writer, false);\n writer.write(this.dicPrefix);\n writer.write(Operators.newLine);\n if (data.length > 0) {\n writer.write(data);\n }\n writer.write(Operators.newLine);\n writer.write(this.dicSuffix);\n writer.write(Operators.newLine);\n };\n /**\n * Converts `bytes to string`.\n * @private\n */\n PdfStream.bytesToString = function (byteArray) {\n var output = '';\n for (var i = 0; i < byteArray.length; i++) {\n output = output + String.fromCharCode(byteArray[i]);\n }\n return output;\n };\n return PdfStream;\n}(PdfDictionary));\nexport { PdfStream };\nvar SaveCmapEventHandler = /** @class */ (function () {\n /**\n * New instance for `save section collection event handler` class.\n * @private\n */\n function SaveCmapEventHandler(sender) {\n this.sender = sender;\n }\n return SaveCmapEventHandler;\n}());\nexport { SaveCmapEventHandler };\nvar SaveFontProgramEventHandler = /** @class */ (function () {\n /**\n * New instance for `save section collection event handler` class.\n * @private\n */\n function SaveFontProgramEventHandler(sender) {\n this.sender = sender;\n }\n return SaveFontProgramEventHandler;\n}());\nexport { SaveFontProgramEventHandler };\n","/**\n * `PdfString` class is used to perform string related primitive operations.\n * @private\n */\nexport var InternalEnum;\n(function (InternalEnum) {\n //Internals\n /**\n * public Enum for `ForceEncoding`.\n * @private\n */\n var ForceEncoding;\n (function (ForceEncoding) {\n /**\n * Specifies the type of `None`.\n * @private\n */\n ForceEncoding[ForceEncoding[\"None\"] = 0] = \"None\";\n /**\n * Specifies the type of `Ascii`.\n * @private\n */\n ForceEncoding[ForceEncoding[\"Ascii\"] = 1] = \"Ascii\";\n /**\n * Specifies the type of `Unicode`.\n * @private\n */\n ForceEncoding[ForceEncoding[\"Unicode\"] = 2] = \"Unicode\";\n })(ForceEncoding = InternalEnum.ForceEncoding || (InternalEnum.ForceEncoding = {}));\n /**\n * public Enum for `SourceType`.\n * @private\n */\n var SourceType;\n (function (SourceType) {\n /**\n * Specifies the type of `StringValue`.\n * @private\n */\n SourceType[SourceType[\"StringValue\"] = 0] = \"StringValue\";\n /**\n * Specifies the type of `ByteBuffer`.\n * @private\n */\n SourceType[SourceType[\"ByteBuffer\"] = 1] = \"ByteBuffer\";\n })(SourceType || (SourceType = {}));\n})(InternalEnum || (InternalEnum = {}));\nvar PdfString = /** @class */ (function () {\n function PdfString(value) {\n /**\n * Value indicating whether the string was converted to hex.\n * @default false\n * @private\n */\n this.bHex = false;\n /**\n * Internal variable to store the `position`.\n * @default -1\n * @private\n */\n this.position1 = -1;\n /**\n * Internal variable to hold `cloned object`.\n * @default null\n * @private\n */\n this.clonedObject1 = null;\n /**\n * `Shows` if the data of the stream was decrypted.\n * @default false\n * @private\n */\n this.bDecrypted = false;\n /**\n * Shows if the data of the stream `was decrypted`.\n * @default false\n * @private\n */\n this.isParentDecrypted = false;\n /**\n * Gets a value indicating whether the object is `packed or not`.\n * @default false\n * @private\n */\n this.isPacked = false;\n /**\n * @hidden\n * @private\n */\n this.isFormField = false;\n /**\n * @hidden\n * @private\n */\n this.isColorSpace = false;\n /**\n * @hidden\n * @private\n */\n this.isHexString = true;\n if (typeof value === 'undefined') {\n this.bHex = false;\n }\n else {\n if (!(value.length > 0 && value[0] === '0xfeff')) {\n this.stringValue = value;\n this.data = [];\n for (var i = 0; i < value.length; ++i) {\n this.data.push(value.charCodeAt(i));\n }\n }\n }\n }\n Object.defineProperty(PdfString.prototype, \"hex\", {\n //Property\n /**\n * Gets a value indicating whether string is in `hex`.\n * @private\n */\n get: function () {\n return this.bHex;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfString.prototype, \"value\", {\n /**\n * Gets or sets string `value` of the object.\n * @private\n */\n get: function () {\n return this.stringValue;\n },\n set: function (value) {\n this.stringValue = value;\n this.data = null;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfString.prototype, \"status\", {\n /**\n * Gets or sets the `Status` of the specified object.\n * @private\n */\n get: function () {\n return this.status1;\n },\n set: function (value) {\n this.status1 = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfString.prototype, \"isSaving\", {\n /**\n * Gets or sets a value indicating whether this document `is saving` or not.\n * @private\n */\n get: function () {\n return this.isSaving1;\n },\n set: function (value) {\n this.isSaving1 = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfString.prototype, \"objectCollectionIndex\", {\n /**\n * Gets or sets the `index` value of the specified object.\n * @private\n */\n get: function () {\n return this.index1;\n },\n set: function (value) {\n this.index1 = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfString.prototype, \"clonedObject\", {\n /**\n * Returns `cloned object`.\n * @private\n */\n get: function () {\n return this.clonedObject1;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfString.prototype, \"position\", {\n /**\n * Gets or sets the `position` of the object.\n * @private\n */\n get: function () {\n return this.position1;\n },\n set: function (value) {\n this.position1 = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfString.prototype, \"CrossTable\", {\n /**\n * Returns `PdfCrossTable` associated with the object.\n * @private\n */\n get: function () {\n return this.crossTable;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfString.prototype, \"converted\", {\n /**\n * Gets a value indicating whether to check if the value has unicode characters.\n * @private\n */\n get: function () {\n return this.bConverted;\n },\n /**\n * sets a value indicating whether to check if the value has unicode characters.\n * @private\n */\n set: function (value) {\n this.bConverted = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfString.prototype, \"encode\", {\n /**\n * Gets value indicating whether we should convert data to Unicode.\n */\n get: function () {\n return this.bForceEncoding;\n },\n set: function (value) {\n this.bForceEncoding = value;\n },\n enumerable: true,\n configurable: true\n });\n //Methods\n /**\n * Converts `bytes to string using hex format` for representing string.\n * @private\n */\n PdfString.bytesToHex = function (bytes) {\n if (bytes == null) {\n return '';\n }\n var builder = '';\n return builder;\n };\n /**\n * `Saves` the object using the specified writer.\n * @private\n */\n PdfString.prototype.save = function (writer) {\n if (writer === null) {\n throw new Error('ArgumentNullException : writer');\n }\n if (this.encode !== undefined && this.encode === InternalEnum.ForceEncoding.Ascii) {\n writer.write(this.pdfEncode());\n }\n else {\n writer.write(PdfString.stringMark[0] + this.value + PdfString.stringMark[1]);\n }\n };\n PdfString.prototype.pdfEncode = function () {\n var result = '';\n if (this.encode !== undefined && this.encode === InternalEnum.ForceEncoding.Ascii) {\n var data = this.escapeSymbols(this.value);\n for (var i = 0; i < data.length; i++) {\n result += String.fromCharCode(data[i]);\n }\n result = PdfString.stringMark[0] + result + PdfString.stringMark[1];\n }\n else {\n result = this.value;\n }\n return result;\n };\n PdfString.prototype.escapeSymbols = function (value) {\n var data = [];\n for (var i = 0; i < value.length; i++) {\n var currentData = value.charCodeAt(i);\n switch (currentData) {\n case 40:\n case 41:\n data.push(92);\n data.push(currentData);\n break;\n case 13:\n data.push(92);\n data.push(114);\n break;\n case 92:\n data.push(92);\n data.push(currentData);\n break;\n default:\n data.push(currentData);\n break;\n }\n }\n return data;\n };\n /**\n * Creates a `copy of PdfString`.\n * @private\n */\n PdfString.prototype.clone = function (crossTable) {\n if (this.clonedObject1 !== null && this.clonedObject1.CrossTable === crossTable) {\n return this.clonedObject1;\n }\n else {\n this.clonedObject1 = null;\n }\n var newString = new PdfString(this.stringValue);\n newString.bHex = this.bHex;\n newString.crossTable = crossTable;\n newString.isColorSpace = this.isColorSpace;\n this.clonedObject1 = newString;\n return newString;\n };\n /**\n * Converts string to array of unicode symbols.\n */\n PdfString.toUnicodeArray = function (value, bAddPrefix) {\n if (value == null) {\n throw new Error('Argument Null Exception : value');\n }\n var startIndex = 0;\n var output = [];\n for (var i = 0; i < value.length; i++) {\n var code = value.charCodeAt(i);\n output.push(code / 256 >>> 0);\n output.push(code & 0xff);\n }\n return output;\n };\n /**\n * Converts byte data to string.\n */\n PdfString.byteToString = function (data) {\n if (data == null) {\n throw new Error('Argument Null Exception : stream');\n }\n var result = '';\n for (var i = 0; i < data.length; ++i) {\n result += String.fromCharCode(data[i]);\n }\n return result;\n };\n //constants = ;\n /**\n * `General markers` for string.\n * @private\n */\n PdfString.stringMark = '()';\n /**\n * `Hex markers` for string.\n * @private\n */\n PdfString.hexStringMark = '<>';\n /**\n * Format of password data.\n * @private\n */\n PdfString.hexFormatPattern = '{0:X2}';\n return PdfString;\n}());\nexport { PdfString };\n","import { DictionaryProperties } from './../input-output/pdf-dictionary-properties';\nimport { PdfStream } from './../primitives/pdf-stream';\nimport { PdfArray } from './../primitives/pdf-array';\nimport { PdfNumber } from './../primitives/pdf-number';\nimport { PdfName } from './../primitives/pdf-name';\nimport { PdfDictionary } from './../primitives/pdf-dictionary';\nimport { PdfString } from './../primitives/pdf-string';\n/**\n * `PdfReference` class is used to perform reference related primitive operations.\n * @private\n */\nvar PdfReference = /** @class */ (function () {\n function PdfReference(objNumber, genNumber) {\n /**\n * Holds the `index` number of the object.\n * @default -1\n * @private\n */\n this.index3 = -1;\n /**\n * Internal variable to store the `position`.\n * @default -1\n * @private\n */\n this.position3 = -1;\n /**\n * Holds the `object number`.\n * @default 0\n * @private\n */\n this.objNumber = 0;\n /**\n * Holds the `generation number` of the object.\n * @default 0\n * @private\n */\n this.genNumber = 0;\n if (typeof objNumber === 'number' && typeof genNumber === 'number') {\n this.objNumber = objNumber;\n this.genNumber = genNumber;\n // } else if (typeof objNum === 'string' && typeof genNum === 'string') {\n }\n else {\n this.objNumber = Number(objNumber);\n this.genNumber = Number(genNumber);\n }\n }\n Object.defineProperty(PdfReference.prototype, \"status\", {\n //Property\n /**\n * Gets or sets the `Status` of the specified object.\n * @private\n */\n get: function () {\n return this.status3;\n },\n set: function (value) {\n this.status3 = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfReference.prototype, \"isSaving\", {\n /**\n * Gets or sets a value indicating whether this document `is saving` or not.\n * @private\n */\n get: function () {\n return this.isSaving3;\n },\n set: function (value) {\n this.isSaving3 = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfReference.prototype, \"objectCollectionIndex\", {\n /**\n * Gets or sets the `index` value of the specified object.\n * @private\n */\n get: function () {\n return this.index3;\n },\n set: function (value) {\n this.index3 = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfReference.prototype, \"position\", {\n /**\n * Gets or sets the `position` of the object.\n * @private\n */\n get: function () {\n return this.position3;\n },\n set: function (value) {\n this.position3 = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfReference.prototype, \"clonedObject\", {\n /**\n * Returns `cloned object`.\n * @private\n */\n get: function () {\n var returnObject3 = null;\n return returnObject3;\n },\n enumerable: true,\n configurable: true\n });\n //IPdfPrimitives methods\n /**\n * `Saves` the object.\n * @private\n */\n PdfReference.prototype.save = function (writer) {\n writer.write(this.toString());\n };\n /**\n * Returns a `string` representing the object.\n * @private\n */\n PdfReference.prototype.toString = function () {\n return this.objNumber.toString() + ' ' + this.genNumber.toString() + ' R';\n };\n /**\n * Creates a `deep copy` of the IPdfPrimitive object.\n * @private\n */\n PdfReference.prototype.clone = function (crossTable) {\n return null;\n };\n return PdfReference;\n}());\nexport { PdfReference };\n/**\n * `PdfReferenceHolder` class is used to perform reference holder related primitive operations.\n * @private\n */\nvar PdfReferenceHolder = /** @class */ (function () {\n function PdfReferenceHolder(obj1, obj2) {\n /**\n * Holds the `index` number of the object.\n * @default -1\n * @private\n */\n this.index4 = -1;\n /**\n * Internal variable to store the `position`.\n * @default -1\n * @private\n */\n this.position4 = -1;\n /**\n * The `index` of the object within the object collection.\n * @default -1\n * @private\n */\n this.objectIndex = -1;\n /**\n * @hidden\n * @private\n */\n this.dictionaryProperties = new DictionaryProperties();\n // if (typeof obj2 === 'undefined') {\n if (obj1 instanceof PdfArray\n || obj1 instanceof PdfDictionary\n || obj1 instanceof PdfName\n || obj1 instanceof PdfNumber\n || obj1 instanceof PdfStream\n || obj1 instanceof PdfReference\n || obj1 instanceof PdfString) {\n // if (obj1 === null) {\n // throw new Error('ArgumentNullException : obj');\n // }\n this.primitiveObject = obj1;\n // } else if (obj1 instanceof PdfPageBase\n // || obj1 instanceof PdfPage\n // || obj1 instanceof PdfSection\n // || obj1 instanceof PdfSectionCollection) {\n }\n else {\n var tempObj = obj1;\n this.constructor(tempObj.element);\n }\n // }\n // else {\n // if (obj2 === null) {\n // throw new Error('ArgumentNullException : crossTable');\n // }\n // if (obj1 === null) {\n // throw new Error('ArgumentNullException : reference');\n // }\n // this.crossTable = obj2;\n // let tempObj1 : PdfReference = obj1;\n // this.reference = tempObj1;\n // }\n }\n Object.defineProperty(PdfReferenceHolder.prototype, \"status\", {\n //Properties\n /**\n * Gets or sets the `Status` of the specified object.\n * @private\n */\n get: function () {\n return this.status4;\n },\n set: function (value) {\n this.status4 = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfReferenceHolder.prototype, \"isSaving\", {\n /**\n * Gets or sets a value indicating whether this document `is saving` or not.\n * @private\n */\n get: function () {\n return this.isSaving4;\n },\n set: function (value) {\n this.isSaving4 = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfReferenceHolder.prototype, \"objectCollectionIndex\", {\n /**\n * Gets or sets the `index` value of the specified object.\n * @private\n */\n get: function () {\n return this.index4;\n },\n set: function (value) {\n this.index4 = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfReferenceHolder.prototype, \"position\", {\n /**\n * Gets or sets the `position` of the object.\n * @private\n */\n get: function () {\n return this.position4;\n },\n set: function (value) {\n this.position4 = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfReferenceHolder.prototype, \"clonedObject\", {\n /**\n * Returns `cloned object`.\n * @private\n */\n get: function () {\n return null;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfReferenceHolder.prototype, \"object\", {\n /**\n * Gets the `object` the reference is of.\n * @private\n */\n get: function () {\n // if ((this.reference != null) || (this.object == null)) {\n // this.object = this.GetterObject();\n // }\n return this.primitiveObject;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfReferenceHolder.prototype, \"reference\", {\n /**\n * Gets the `reference`.\n * @private\n */\n get: function () {\n return this.pdfReference;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfReferenceHolder.prototype, \"index\", {\n /**\n * Gets the `index` of the object.\n * @private\n */\n get: function () {\n // let items : PdfMainObjectCollection = this.crossTable.PdfObjects;\n // this.objectIndex = items.GetObjectIndex(this.reference);\n // if (this.objectIndex < 0) {\n // let obj : IPdfPrimitive = this.crossTable.GetObject(this.reference);\n // this.objectIndex = items.Count - 1;\n // }\n return this.objectIndex;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfReferenceHolder.prototype, \"element\", {\n /**\n * Gets the `element`.\n * @private\n */\n get: function () {\n return this.primitiveObject;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * `Writes` a reference into a PDF document.\n * @private\n */\n PdfReferenceHolder.prototype.save = function (writer) {\n // if (writer == null) {\n // throw new Error('ArgumentNullException : writer');\n // }\n var position = writer.position;\n var cTable = writer.document.crossTable;\n // if (cTable.Document instanceof PdfDocument) {\n this.object.isSaving = true;\n // }\n var reference = null;\n // if (writer.Document.FileStructure.IncrementalUpdate === true && writer.Document.isStreamCopied === true) {\n // if (this.reference === null) {\n // reference = cTable.GetReference(this.Object);\n // } else {\n // reference = this.reference;\n // }\n // } else {\n // reference = cTable.GetReference(this.Object);\n // }\n // if (!(writer.Document.FileStructure.IncrementalUpdate === true && writer.Document.isStreamCopied === true)) {\n reference = cTable.getReference(this.object);\n // }\n // if (writer.Position !== position) {\n // writer.Position = position;\n // }\n reference.save(writer);\n };\n /**\n * Creates a `copy of PdfReferenceHolder`.\n * @private\n */\n PdfReferenceHolder.prototype.clone = function (crossTable) {\n var refHolder = null;\n var temp = null;\n var refNum = '';\n var reference = null;\n // Restricts addition of same object multiple time.\n /* if (this.Reference != null && this.crossTable != null && this.crossTable.PageCorrespondance.containsKey(this.Reference)) {\n refHolder = new PdfReferenceHolder(this.crossTable.PageCorrespondance.getValue(this.Reference) as PdfReference, crossTable);\n return refHolder;\n }\n if (Object instanceof PdfNumber) {\n return new PdfNumber((Object as PdfNumber).IntValue);\n }\n */\n // if (Object instanceof PdfDictionary) {\n // // Meaning the referenced page is not available for import.\n // let type : PdfName = new PdfName(this.dictionaryProperties.type);\n // let dict : PdfDictionary = Object as PdfDictionary;\n // if (dict.ContainsKey(type)) {\n // let pageName : PdfName = dict.Items.getValue(type.Value) as PdfName;\n // if (pageName !== null) {\n // if (pageName.Value === 'Page') {\n // return new PdfNull();\n // }\n // }\n // }\n // }\n /* if (Object instanceof PdfName) {\n return new PdfName ((Object as PdfName ).Value);\n }\n */\n // Resolves circular references.\n // if (crossTable.PrevReference !== null && (crossTable.PrevReference.indexOf(this.Reference) !== -1)) {\n // let obj : IPdfPrimitive = this.crossTable.GetObject(this.Reference).ClonedObject;\n // if (obj !== null) {\n // reference = crossTable.GetReference(obj);\n // return new PdfReferenceHolder(reference, crossTable);\n // } else {\n // return new PdfNull();\n // }\n // }\n /*if (this.Reference !== null) {\n crossTable.PrevReference.push(this.Reference);\n }\n reference = crossTable.GetReference(temp);\n refHolder = new PdfReferenceHolder(reference, crossTable);\n return refHolder;\n */\n return null;\n };\n return PdfReferenceHolder;\n}());\nexport { PdfReferenceHolder };\n","import { PdfDictionary } from './../primitives/pdf-dictionary';\nimport { PdfReferenceHolder } from './../primitives/pdf-reference';\nimport { PdfName } from './../primitives/pdf-name';\nimport { DictionaryProperties } from './../input-output/pdf-dictionary-properties';\n/**\n * `PdfAction` class represents base class for all action types.\n * @private\n */\nvar PdfAction = /** @class */ (function () {\n // Constructors\n /**\n * Initialize instance for `Action` class.\n * @private\n */\n function PdfAction() {\n /**\n * Specifies the Next `action` to perform.\n * @private\n */\n this.action = null;\n /**\n * Specifies the Internal variable to store `dictionary properties`.\n * @private\n */\n this.dictionaryProperties = new DictionaryProperties();\n // super(); -> Object()\n this.initialize();\n }\n Object.defineProperty(PdfAction.prototype, \"next\", {\n // Properties\n /**\n * Gets and Sets the `Next` action to perform.\n * @private\n */\n get: function () {\n return this.action;\n },\n set: function (value) {\n // if (this.action !== value) {\n this.action = value;\n this.dictionary.items.setValue(this.dictionaryProperties.next, new PdfReferenceHolder(this.action));\n // }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAction.prototype, \"dictionary\", {\n /**\n * Gets and Sets the instance of PdfDictionary class for `Dictionary`.\n * @private\n */\n get: function () {\n if (typeof this.pdfDictionary === 'undefined') {\n this.pdfDictionary = new PdfDictionary();\n }\n return this.pdfDictionary;\n },\n enumerable: true,\n configurable: true\n });\n // Implementation\n /**\n * `Initialize` the action type.\n * @private\n */\n PdfAction.prototype.initialize = function () {\n this.dictionary.items.setValue(this.dictionaryProperties.type, new PdfName(this.dictionaryProperties.action));\n };\n Object.defineProperty(PdfAction.prototype, \"element\", {\n // IPdfWrapper Members\n /**\n * Gets the `Element` as IPdfPrimitive class.\n * @private\n */\n get: function () {\n return this.dictionary;\n },\n enumerable: true,\n configurable: true\n });\n return PdfAction;\n}());\nexport { PdfAction };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfAction } from './action';\nimport { PdfString } from './../primitives/pdf-string';\nimport { PdfName } from './../primitives/pdf-name';\n/**\n * `PdfUriAction` class for initialize the uri related internals.\n * @private\n */\nvar PdfUriAction = /** @class */ (function (_super) {\n __extends(PdfUriAction, _super);\n function PdfUriAction(uri) {\n var _this = _super.call(this) || this;\n // Fields\n /**\n * Specifies the `uri` string.\n * @default ''.\n * @private\n */\n _this.uniformResourceIdentifier = '';\n return _this;\n }\n Object.defineProperty(PdfUriAction.prototype, \"uri\", {\n // Properties\n /**\n * Gets and Sets the value of `Uri`.\n * @private\n */\n get: function () {\n return this.uniformResourceIdentifier;\n },\n set: function (value) {\n this.uniformResourceIdentifier = value;\n this.dictionary.items.setValue(this.dictionaryProperties.uri, new PdfString(this.uniformResourceIdentifier));\n },\n enumerable: true,\n configurable: true\n });\n // Implementation\n /**\n * `Initialize` the internals.\n * @private\n */\n PdfUriAction.prototype.initialize = function () {\n _super.prototype.initialize.call(this);\n this.dictionary.items.setValue(this.dictionaryProperties.s, new PdfName(this.dictionaryProperties.uri));\n };\n return PdfUriAction;\n}(PdfAction));\nexport { PdfUriAction };\n","/**\n * public Enum for `PdfHorizontalAlignment`.\n * @private\n */\nexport var PdfHorizontalAlignment;\n(function (PdfHorizontalAlignment) {\n /**\n * Specifies the type of `Left`.\n * @private\n */\n PdfHorizontalAlignment[PdfHorizontalAlignment[\"Left\"] = 0] = \"Left\";\n /**\n * Specifies the type of `Center`.\n * @private\n */\n PdfHorizontalAlignment[PdfHorizontalAlignment[\"Center\"] = 1] = \"Center\";\n /**\n * Specifies the type of `Right`.\n * @private\n */\n PdfHorizontalAlignment[PdfHorizontalAlignment[\"Right\"] = 2] = \"Right\";\n})(PdfHorizontalAlignment || (PdfHorizontalAlignment = {}));\n/**\n * public Enum for `PdfVerticalAlignment`.\n * @private\n */\nexport var PdfVerticalAlignment;\n(function (PdfVerticalAlignment) {\n /**\n * Specifies the type of `Top`.\n * @private\n */\n PdfVerticalAlignment[PdfVerticalAlignment[\"Top\"] = 0] = \"Top\";\n /**\n * Specifies the type of `Middle`.\n * @private\n */\n PdfVerticalAlignment[PdfVerticalAlignment[\"Middle\"] = 1] = \"Middle\";\n /**\n * Specifies the type of `Bottom`.\n * @private\n */\n PdfVerticalAlignment[PdfVerticalAlignment[\"Bottom\"] = 2] = \"Bottom\";\n})(PdfVerticalAlignment || (PdfVerticalAlignment = {}));\n/**\n * public Enum for `public`.\n * @private\n */\nexport var PdfTextAlignment;\n(function (PdfTextAlignment) {\n /**\n * Specifies the type of `Left`.\n * @private\n */\n PdfTextAlignment[PdfTextAlignment[\"Left\"] = 0] = \"Left\";\n /**\n * Specifies the type of `Center`.\n * @private\n */\n PdfTextAlignment[PdfTextAlignment[\"Center\"] = 1] = \"Center\";\n /**\n * Specifies the type of `Right`.\n * @private\n */\n PdfTextAlignment[PdfTextAlignment[\"Right\"] = 2] = \"Right\";\n /**\n * Specifies the type of `Justify`.\n * @private\n */\n PdfTextAlignment[PdfTextAlignment[\"Justify\"] = 3] = \"Justify\";\n})(PdfTextAlignment || (PdfTextAlignment = {}));\n/**\n * public Enum for `TextRenderingMode`.\n * @private\n */\nexport var TextRenderingMode;\n(function (TextRenderingMode) {\n /**\n * Specifies the type of `Fill`.\n * @private\n */\n TextRenderingMode[TextRenderingMode[\"Fill\"] = 0] = \"Fill\";\n /**\n * Specifies the type of `Stroke`.\n * @private\n */\n TextRenderingMode[TextRenderingMode[\"Stroke\"] = 1] = \"Stroke\";\n /**\n * Specifies the type of `FillStroke`.\n * @private\n */\n TextRenderingMode[TextRenderingMode[\"FillStroke\"] = 2] = \"FillStroke\";\n /**\n * Specifies the type of `None`.\n * @private\n */\n TextRenderingMode[TextRenderingMode[\"None\"] = 3] = \"None\";\n /**\n * Specifies the type of `ClipFlag`.\n * @private\n */\n TextRenderingMode[TextRenderingMode[\"ClipFlag\"] = 4] = \"ClipFlag\";\n /**\n * Specifies the type of `ClipFill`.\n * @private\n */\n TextRenderingMode[TextRenderingMode[\"ClipFill\"] = 4] = \"ClipFill\";\n /**\n * Specifies the type of `ClipStroke`.\n * @private\n */\n TextRenderingMode[TextRenderingMode[\"ClipStroke\"] = 5] = \"ClipStroke\";\n /**\n * Specifies the type of `ClipFillStroke`.\n * @private\n */\n TextRenderingMode[TextRenderingMode[\"ClipFillStroke\"] = 6] = \"ClipFillStroke\";\n /**\n * Specifies the type of `Clip`.\n * @private\n */\n TextRenderingMode[TextRenderingMode[\"Clip\"] = 7] = \"Clip\";\n})(TextRenderingMode || (TextRenderingMode = {}));\n/**\n * public Enum for `PdfLineJoin`.\n * @private\n */\nexport var PdfLineJoin;\n(function (PdfLineJoin) {\n /**\n * Specifies the type of `Miter`.\n * @private\n */\n PdfLineJoin[PdfLineJoin[\"Miter\"] = 0] = \"Miter\";\n /**\n * Specifies the type of `Round`.\n * @private\n */\n PdfLineJoin[PdfLineJoin[\"Round\"] = 1] = \"Round\";\n /**\n * Specifies the type of `Bevel`.\n * @private\n */\n PdfLineJoin[PdfLineJoin[\"Bevel\"] = 2] = \"Bevel\";\n})(PdfLineJoin || (PdfLineJoin = {}));\n/**\n * public Enum for `PdfLineCap`.\n * @private\n */\nexport var PdfLineCap;\n(function (PdfLineCap) {\n /**\n * Specifies the type of `Flat`.\n * @private\n */\n PdfLineCap[PdfLineCap[\"Flat\"] = 0] = \"Flat\";\n /**\n * Specifies the type of `Round`.\n * @private\n */\n PdfLineCap[PdfLineCap[\"Round\"] = 1] = \"Round\";\n /**\n * Specifies the type of `Square`.\n * @private\n */\n PdfLineCap[PdfLineCap[\"Square\"] = 2] = \"Square\";\n})(PdfLineCap || (PdfLineCap = {}));\n/**\n * public Enum for `PdfDashStyle`.\n * @private\n */\nexport var PdfDashStyle;\n(function (PdfDashStyle) {\n /**\n * Specifies the type of `Solid`.\n * @private\n */\n PdfDashStyle[PdfDashStyle[\"Solid\"] = 0] = \"Solid\";\n /**\n * Specifies the type of `Dash`.\n * @private\n */\n PdfDashStyle[PdfDashStyle[\"Dash\"] = 1] = \"Dash\";\n /**\n * Specifies the type of `Dot`.\n * @private\n */\n PdfDashStyle[PdfDashStyle[\"Dot\"] = 2] = \"Dot\";\n /**\n * Specifies the type of `DashDot`.\n * @private\n */\n PdfDashStyle[PdfDashStyle[\"DashDot\"] = 3] = \"DashDot\";\n /**\n * Specifies the type of `DashDotDot`.\n * @private\n */\n PdfDashStyle[PdfDashStyle[\"DashDotDot\"] = 4] = \"DashDotDot\";\n /**\n * Specifies the type of `Custom`.\n * @private\n */\n PdfDashStyle[PdfDashStyle[\"Custom\"] = 5] = \"Custom\";\n})(PdfDashStyle || (PdfDashStyle = {}));\n/**\n * public Enum for `PdfFillMode`.\n * @private\n */\nexport var PdfFillMode;\n(function (PdfFillMode) {\n /**\n * Specifies the type of `Winding`.\n * @private\n */\n PdfFillMode[PdfFillMode[\"Winding\"] = 0] = \"Winding\";\n /**\n * Specifies the type of `Alternate`.\n * @private\n */\n PdfFillMode[PdfFillMode[\"Alternate\"] = 1] = \"Alternate\";\n})(PdfFillMode || (PdfFillMode = {}));\n/**\n * public Enum for `PdfColorSpace`.\n * @private\n */\nexport var PdfColorSpace;\n(function (PdfColorSpace) {\n /**\n * Specifies the type of `Rgb`.\n * @private\n */\n PdfColorSpace[PdfColorSpace[\"Rgb\"] = 0] = \"Rgb\";\n /**\n * Specifies the type of `Cmyk`.\n * @private\n */\n PdfColorSpace[PdfColorSpace[\"Cmyk\"] = 1] = \"Cmyk\";\n /**\n * Specifies the type of `GrayScale`.\n * @private\n */\n PdfColorSpace[PdfColorSpace[\"GrayScale\"] = 2] = \"GrayScale\";\n /**\n * Specifies the type of `Indexed`.\n * @private\n */\n PdfColorSpace[PdfColorSpace[\"Indexed\"] = 3] = \"Indexed\";\n})(PdfColorSpace || (PdfColorSpace = {}));\n/**\n * public Enum for `PdfBlendMode`.\n * @private\n */\nexport var PdfBlendMode;\n(function (PdfBlendMode) {\n /**\n * Specifies the type of `Normal`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"Normal\"] = 0] = \"Normal\";\n /**\n * Specifies the type of `Multiply`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"Multiply\"] = 1] = \"Multiply\";\n /**\n * Specifies the type of `Screen`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"Screen\"] = 2] = \"Screen\";\n /**\n * Specifies the type of `Overlay`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"Overlay\"] = 3] = \"Overlay\";\n /**\n * Specifies the type of `Darken`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"Darken\"] = 4] = \"Darken\";\n /**\n * Specifies the type of `Lighten`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"Lighten\"] = 5] = \"Lighten\";\n /**\n * Specifies the type of `ColorDodge`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"ColorDodge\"] = 6] = \"ColorDodge\";\n /**\n * Specifies the type of `ColorBurn`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"ColorBurn\"] = 7] = \"ColorBurn\";\n /**\n * Specifies the type of `HardLight`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"HardLight\"] = 8] = \"HardLight\";\n /**\n * Specifies the type of `SoftLight`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"SoftLight\"] = 9] = \"SoftLight\";\n /**\n * Specifies the type of `Difference`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"Difference\"] = 10] = \"Difference\";\n /**\n * Specifies the type of `Exclusion`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"Exclusion\"] = 11] = \"Exclusion\";\n /**\n * Specifies the type of `Hue`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"Hue\"] = 12] = \"Hue\";\n /**\n * Specifies the type of `Saturation`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"Saturation\"] = 13] = \"Saturation\";\n /**\n * Specifies the type of `Color`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"Color\"] = 14] = \"Color\";\n /**\n * Specifies the type of `Luminosity`.\n * @private\n */\n PdfBlendMode[PdfBlendMode[\"Luminosity\"] = 15] = \"Luminosity\";\n})(PdfBlendMode || (PdfBlendMode = {}));\n/**\n * public Enum for `PdfGraphicsUnit`.\n * @private\n */\nexport var PdfGraphicsUnit;\n(function (PdfGraphicsUnit) {\n /**\n * Specifies the type of `Centimeter`.\n * @private\n */\n PdfGraphicsUnit[PdfGraphicsUnit[\"Centimeter\"] = 0] = \"Centimeter\";\n /**\n * Specifies the type of `Pica`.\n * @private\n */\n PdfGraphicsUnit[PdfGraphicsUnit[\"Pica\"] = 1] = \"Pica\";\n /**\n * Specifies the type of `Pixel`.\n * @private\n */\n PdfGraphicsUnit[PdfGraphicsUnit[\"Pixel\"] = 2] = \"Pixel\";\n /**\n * Specifies the type of `Point`.\n * @private\n */\n PdfGraphicsUnit[PdfGraphicsUnit[\"Point\"] = 3] = \"Point\";\n /**\n * Specifies the type of `Inch`.\n * @private\n */\n PdfGraphicsUnit[PdfGraphicsUnit[\"Inch\"] = 4] = \"Inch\";\n /**\n * Specifies the type of `Document`.\n * @private\n */\n PdfGraphicsUnit[PdfGraphicsUnit[\"Document\"] = 5] = \"Document\";\n /**\n * Specifies the type of `Millimeter`.\n * @private\n */\n PdfGraphicsUnit[PdfGraphicsUnit[\"Millimeter\"] = 6] = \"Millimeter\";\n})(PdfGraphicsUnit || (PdfGraphicsUnit = {}));\n/**\n * public Enum for `PdfGridImagePosition`.\n * @private\n */\nexport var PdfGridImagePosition;\n(function (PdfGridImagePosition) {\n /**\n * Specifies the type of `Fit`.\n * @private\n */\n PdfGridImagePosition[PdfGridImagePosition[\"Fit\"] = 0] = \"Fit\";\n /**\n * Specifies the type of `Center`.\n * @private\n */\n PdfGridImagePosition[PdfGridImagePosition[\"Center\"] = 1] = \"Center\";\n /**\n * Specifies the type of `Stretch`.\n * @private\n */\n PdfGridImagePosition[PdfGridImagePosition[\"Stretch\"] = 2] = \"Stretch\";\n /**\n * Specifies the type of `Tile`.\n * @private\n */\n PdfGridImagePosition[PdfGridImagePosition[\"Tile\"] = 3] = \"Tile\";\n})(PdfGridImagePosition || (PdfGridImagePosition = {}));\n/**\n * public Enum for `the text rendering direction`.\n * @private\n */\nexport var PdfTextDirection;\n(function (PdfTextDirection) {\n /**\n * Specifies the type of `None`.\n * @private\n */\n PdfTextDirection[PdfTextDirection[\"None\"] = 0] = \"None\";\n /**\n * Specifies the type of `LeftToRight`.\n * @private\n */\n PdfTextDirection[PdfTextDirection[\"LeftToRight\"] = 1] = \"LeftToRight\";\n /**\n * Specifies the type of `RightToLeft`.\n * @private\n */\n PdfTextDirection[PdfTextDirection[\"RightToLeft\"] = 2] = \"RightToLeft\";\n})(PdfTextDirection || (PdfTextDirection = {}));\n","import { PdfColorSpace } from './enum';\nimport { Operators } from './../input-output/pdf-operators';\nimport { Dictionary } from './../collections/dictionary';\nimport { PdfNumber } from './../primitives/pdf-number';\nimport { PdfArray } from './../primitives/pdf-array';\n/**\n * Implements structures and routines working with `color`.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a new page to the document\n * let page1 : PdfPage = document.pages.add();\n * // set the font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * //\n * // set color\n * let brushColor : PdfColor = new PdfColor(0, 0, 0);\n * //\n * // create black brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(brushColor);\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, new PointF(0, 0));\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n * @default black color\n */\nvar PdfColor = /** @class */ (function () {\n function PdfColor(color1, color2, color3, color4) {\n if (color1 instanceof PdfColor) {\n this.redColor = color1.r;\n this.greenColor = color1.g;\n this.blueColor = color1.b;\n this.grayColor = color1.gray;\n this.alpha = color1.alpha;\n this.filled = (this.alpha !== 0);\n }\n else if (typeof color1 === 'number' && typeof color2 === 'number' && typeof color3 === 'number' &&\n typeof color4 === 'undefined') {\n this.constructor(PdfColor.maxColourChannelValue, color1, color2, color3); //doubt-byte/float\n }\n else if (typeof color1 === 'number' && typeof color2 === 'number' && typeof color3 === 'number' && typeof color4 === 'number') {\n this.redColor = color2;\n this.cyanColor = 0;\n this.greenColor = color3;\n this.magentaColor = 0;\n this.blueColor = color4;\n this.yellowColor = 0;\n this.blackColor = 0;\n this.grayColor = 0;\n this.alpha = color1;\n this.filled = true;\n this.assignCMYK(color2, color3, color4);\n }\n }\n /**\n * `Calculate and assign` cyan, megenta, yellow colors from rgb values..\n * @private\n */\n PdfColor.prototype.assignCMYK = function (r, g, b) {\n var red = r / PdfColor.maxColourChannelValue;\n var green = g / PdfColor.maxColourChannelValue;\n var blue = b / PdfColor.maxColourChannelValue;\n var black = PdfNumber.min(1 - red, 1 - green, 1 - blue);\n var cyan = (black === 1.0) ? 0 : (1 - red - black) / (1 - black);\n var magenta = (black === 1.0) ? 0 : (1 - green - black) / (1 - black);\n var yellow = (black === 1.0) ? 0 : (1 - blue - black) / (1 - black);\n this.blackColor = black;\n this.cyanColor = cyan;\n this.magentaColor = magenta;\n this.yellowColor = yellow;\n };\n Object.defineProperty(PdfColor.prototype, \"r\", {\n //Properties\n // public static get Empty():PdfColor\n // {\n // return this.s_emptyColor\n // }\n /**\n * Gets or sets `Red` channel value.\n * @private\n */\n get: function () {\n return this.redColor;\n },\n set: function (value) {\n this.redColor = value;\n this.assignCMYK(this.redColor, this.greenColor, this.blueColor);\n this.filled = true;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfColor.prototype, \"red\", {\n /**\n * Gets the `Red` color\n * @private\n */\n get: function () {\n return (this.r / PdfColor.maxColourChannelValue);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfColor.prototype, \"b\", {\n /**\n * Gets or sets `Blue` channel value.\n * @private\n */\n get: function () {\n return this.blueColor;\n },\n set: function (value) {\n this.blueColor = value;\n this.assignCMYK(this.redColor, this.greenColor, this.blueColor);\n this.filled = true;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfColor.prototype, \"blue\", {\n /**\n * Gets the `blue` color.\n * @private\n */\n get: function () {\n return (this.b / PdfColor.maxColourChannelValue);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfColor.prototype, \"g\", {\n /**\n * Gets or sets `Green` channel value.\n * @private\n */\n get: function () {\n return this.greenColor;\n },\n set: function (value) {\n this.greenColor = value;\n this.assignCMYK(this.redColor, this.greenColor, this.blueColor);\n this.filled = true;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfColor.prototype, \"green\", {\n /**\n * Gets the `Green` color.\n * @private\n */\n get: function () {\n return (this.g / PdfColor.maxColourChannelValue);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfColor.prototype, \"gray\", {\n /**\n * Gets or sets `Gray` channel value.\n * @private\n */\n get: function () {\n return ((((this.redColor + this.greenColor) + this.blueColor)) / (PdfColor.maxColourChannelValue * 3));\n },\n set: function (value) {\n if (value < 0) {\n this.grayColor = 0;\n }\n else if (value > 1) {\n this.grayColor = 1;\n }\n else {\n this.grayColor = value;\n }\n this.r = (this.grayColor * PdfColor.maxColourChannelValue);\n this.g = (this.grayColor * PdfColor.maxColourChannelValue);\n this.b = (this.grayColor * PdfColor.maxColourChannelValue);\n this.assignCMYK(this.redColor, this.greenColor, this.blueColor);\n this.filled = true;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfColor.prototype, \"isEmpty\", {\n /**\n * Gets whether the PDFColor `is Empty` or not.\n * @private\n */\n get: function () {\n return !this.filled;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfColor.prototype, \"a\", {\n /**\n * Gets or sets `Alpha` channel value.\n * @private\n */\n get: function () {\n return this.alpha;\n },\n set: function (value) {\n if (value < 0) {\n this.alpha = 0;\n }\n else {\n // if (this.alpha !== value) {\n this.alpha = value;\n // }\n }\n this.filled = true;\n },\n enumerable: true,\n configurable: true\n });\n //Public methods\n /**\n * Converts `PDFColor to PDF string` representation.\n * @private\n */\n PdfColor.prototype.toString = function (colorSpace, stroke) {\n if (this.isEmpty) {\n return '';\n }\n return this.rgbToString(stroke);\n };\n /**\n * Sets `RGB` color.\n * @private\n */\n PdfColor.prototype.rgbToString = function (ifStroking) {\n var r = this.r;\n var g = this.g;\n var b = this.b;\n var key = (r << 16) + (g << 8) + b;\n if (ifStroking) {\n key += 1 << 24;\n }\n var colour = '';\n var obj = null;\n if (PdfColor.rgbStrings.containsKey(key)) {\n obj = PdfColor.rgbStrings.getValue(key);\n }\n if (obj == null) {\n var red = r / PdfColor.maxColourChannelValue;\n var green = g / PdfColor.maxColourChannelValue;\n var blue = b / PdfColor.maxColourChannelValue;\n if (ifStroking) {\n colour = red.toString() + ' ' + green.toString() + ' ' + blue.toString() + ' RG';\n }\n else {\n colour = red.toString() + ' ' + green.toString() + ' ' + blue.toString() + ' rg';\n }\n PdfColor.rgbStrings.setValue(key, colour);\n }\n else {\n colour = obj.toString();\n }\n return colour + Operators.newLine;\n };\n /**\n * Converts `colour to a PDF array`.\n * @private\n */\n PdfColor.prototype.toArray = function (colorSpace) {\n var array = new PdfArray();\n switch (colorSpace) {\n case PdfColorSpace.Rgb:\n array.add(new PdfNumber(this.red));\n array.add(new PdfNumber(this.green));\n array.add(new PdfNumber(this.blue));\n break;\n default:\n throw new Error('NotSupportedException : Unsupported colour space.');\n }\n return array;\n };\n //Fields\n /**\n * Holds `RGB colors` converted into strings.\n * @private\n */\n PdfColor.rgbStrings = new Dictionary();\n /**\n * Holds Gray scale colors converted into strings for `stroking`.\n * @private\n */\n PdfColor.grayStringsSroke = new Dictionary();\n /**\n * Holds Gray scale colors converted into strings for `filling`.\n * @private\n */\n PdfColor.grayStringsFill = new Dictionary();\n /**\n * `Max value` of color channel.\n * @private\n */\n PdfColor.maxColourChannelValue = 255.0;\n return PdfColor;\n}());\nexport { PdfColor };\n","/**\n * Coordinates of Position for `PointF`.\n * @private\n */\nvar PointF = /** @class */ (function () {\n function PointF(x, y) {\n if (typeof x === 'undefined') {\n this.x = 0;\n this.y = 0;\n }\n else {\n if (x !== null) {\n this.x = x;\n }\n else {\n this.x = 0;\n }\n if (y !== null) {\n this.y = y;\n }\n else {\n this.y = 0;\n }\n }\n }\n return PointF;\n}());\nexport { PointF };\n/**\n * Width and Height as `Size`.\n * @private\n */\nvar SizeF = /** @class */ (function () {\n function SizeF(width, height) {\n if (typeof height === 'undefined') {\n this.height = 0;\n this.width = 0;\n }\n else {\n if (height !== null) {\n this.height = height;\n }\n else {\n this.height = 0;\n }\n if (width !== null) {\n this.width = width;\n }\n else {\n this.width = 0;\n }\n }\n }\n return SizeF;\n}());\nexport { SizeF };\n/**\n * `RectangleF` with Position and size.\n * @private\n */\nvar RectangleF = /** @class */ (function () {\n function RectangleF(arg1, arg2, arg3, arg4) {\n if (typeof arg1 === typeof arg1 && typeof arg1 === 'undefined') {\n this.x = 0;\n this.y = 0;\n this.height = 0;\n this.width = 0;\n }\n else {\n if (arg1 instanceof PointF && arg2 instanceof SizeF && typeof arg3 === 'undefined') {\n var pointf = arg1;\n this.x = pointf.x;\n this.y = pointf.y;\n var sizef = arg2;\n this.height = sizef.height;\n this.width = sizef.width;\n }\n else {\n var x = arg1;\n var y = arg2;\n var width = arg3;\n var height = arg4;\n this.x = x;\n this.y = y;\n this.height = height;\n this.width = width;\n }\n }\n }\n return RectangleF;\n}());\nexport { RectangleF };\n/**\n * `Rectangle` with left, right, top and bottom.\n * @private\n */\nvar Rectangle = /** @class */ (function () {\n /**\n * Instance of `RectangleF` class with X, Y, Width and Height.\n * @private\n */\n function Rectangle(left, top, right, bottom) {\n this.left = left;\n this.top = top;\n this.right = right;\n this.bottom = bottom;\n }\n Object.defineProperty(Rectangle.prototype, \"width\", {\n /**\n * Gets a value of width\n */\n get: function () {\n return this.right - this.left;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Rectangle.prototype, \"height\", {\n /**\n * Gets a value of height\n */\n get: function () {\n return this.bottom - this.top;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Rectangle.prototype, \"topLeft\", {\n /**\n * Gets a value of Top and Left\n */\n get: function () {\n return new PointF(this.left, this.top);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Rectangle.prototype, \"size\", {\n /**\n * Gets a value of size\n */\n get: function () {\n return new SizeF(this.width, this.height);\n },\n enumerable: true,\n configurable: true\n });\n Rectangle.prototype.toString = function () {\n return this.topLeft + 'x' + this.size;\n };\n return Rectangle;\n}());\nexport { Rectangle };\n","/**\n * `PdfBrush` class provides objects used to fill the interiors of graphical shapes such as rectangles,\n * ellipses, pies, polygons, and paths.\n * @private\n */\nvar PdfBrush = /** @class */ (function () {\n /**\n * Creates instanceof `PdfBrush` class.\n * @hidden\n * @private\n */\n function PdfBrush() {\n //\n }\n return PdfBrush;\n}());\nexport { PdfBrush };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfColor } from './../pdf-color';\nimport { PdfColorSpace } from './../enum';\nimport { PdfBrush } from './pdf-brush';\n/**\n * Represents a brush that fills any object with a solid color.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a pages to the document\n * let page1 : PdfPage = document.pages.add();\n * // set font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // set brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, new PointF(10, 10));\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\nvar PdfSolidBrush = /** @class */ (function (_super) {\n __extends(PdfSolidBrush, _super);\n //Constructors\n /**\n * Initializes a new instance of the `PdfSolidBrush` class.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a pages to the document\n * let page1 : PdfPage = document.pages.add();\n * // set font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // set brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, new PointF(10, 10));\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n * @param color color of the brush\n */\n function PdfSolidBrush(color) {\n var _this = _super.call(this) || this;\n _this.pdfColor = color;\n return _this;\n }\n Object.defineProperty(PdfSolidBrush.prototype, \"color\", {\n //Properties\n /**\n * Gets or sets the `color` of the brush.\n * @private\n */\n get: function () {\n return this.pdfColor;\n },\n set: function (value) {\n this.pdfColor = value;\n },\n enumerable: true,\n configurable: true\n });\n //Implementation\n /**\n * `Monitors` the changes of the brush and modify PDF state respectively.\n * @private\n */\n PdfSolidBrush.prototype.monitorChanges = function (brush, streamWriter, getResources, saveChanges, currentColorSpace) {\n if (streamWriter == null) {\n throw new Error('ArgumentNullException:streamWriter');\n }\n var diff = false;\n if (brush == null) {\n diff = true;\n streamWriter.setColorAndSpace(this.pdfColor, currentColorSpace, false);\n return diff;\n }\n else {\n var sBrush = brush;\n diff = true;\n streamWriter.setColorAndSpace(this.pdfColor, currentColorSpace, false);\n return diff;\n }\n };\n /**\n * `Resets` the changes, which were made by the brush.\n * @private\n */\n PdfSolidBrush.prototype.resetChanges = function (streamWriter) {\n streamWriter.setColorAndSpace(new PdfColor(0, 0, 0), PdfColorSpace.Rgb, false);\n };\n return PdfSolidBrush;\n}(PdfBrush));\nexport { PdfSolidBrush };\n","/**\n * public Enum for `PdfFontStyle`.\n * @private\n */\nexport var PdfFontStyle;\n(function (PdfFontStyle) {\n /**\n * Specifies the type of `Regular`.\n * @private\n */\n PdfFontStyle[PdfFontStyle[\"Regular\"] = 0] = \"Regular\";\n /**\n * Specifies the type of `Bold`.\n * @private\n */\n PdfFontStyle[PdfFontStyle[\"Bold\"] = 1] = \"Bold\";\n /**\n * Specifies the type of `Italic`.\n * @private\n */\n PdfFontStyle[PdfFontStyle[\"Italic\"] = 2] = \"Italic\";\n /**\n * Specifies the type of `Underline`.\n * @private\n */\n PdfFontStyle[PdfFontStyle[\"Underline\"] = 4] = \"Underline\";\n /**\n * Specifies the type of `Strikeout`.\n * @private\n */\n PdfFontStyle[PdfFontStyle[\"Strikeout\"] = 8] = \"Strikeout\";\n})(PdfFontStyle || (PdfFontStyle = {}));\n/**\n * Specifies the font family from the standard font.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a new page to the document\n * let page1 : PdfPage = document.pages.add();\n * // create new standard font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // create black brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, new PointF(0, 0));\n * // save the document\n * document.save('output.pdf');\n * ```\n */\nexport var PdfFontFamily;\n(function (PdfFontFamily) {\n /**\n * Specifies the `Helvetica` font.\n */\n PdfFontFamily[PdfFontFamily[\"Helvetica\"] = 0] = \"Helvetica\";\n /**\n * Specifies the `Courier` font.\n */\n PdfFontFamily[PdfFontFamily[\"Courier\"] = 1] = \"Courier\";\n /**\n * Specifies the `TimesRoman` font.\n */\n PdfFontFamily[PdfFontFamily[\"TimesRoman\"] = 2] = \"TimesRoman\";\n /**\n * Specifies the `Symbol` font.\n */\n PdfFontFamily[PdfFontFamily[\"Symbol\"] = 3] = \"Symbol\";\n /**\n * Specifies the `ZapfDingbats` font.\n */\n PdfFontFamily[PdfFontFamily[\"ZapfDingbats\"] = 4] = \"ZapfDingbats\";\n})(PdfFontFamily || (PdfFontFamily = {}));\n/**\n * public Enum for `PdfFontType`.\n * @private\n */\nexport var PdfFontType;\n(function (PdfFontType) {\n /**\n * Specifies the type of `Standard`.\n * @private\n */\n PdfFontType[PdfFontType[\"Standard\"] = 0] = \"Standard\";\n /**\n * Specifies the type of `TrueType`.\n * @private\n */\n PdfFontType[PdfFontType[\"TrueType\"] = 1] = \"TrueType\";\n /**\n * Specifies the type of `TrueTypeEmbedded`.\n * @private\n */\n PdfFontType[PdfFontType[\"TrueTypeEmbedded\"] = 2] = \"TrueTypeEmbedded\";\n})(PdfFontType || (PdfFontType = {}));\n/**\n * public Enum for `PdfWordWrapType`.\n * @private\n */\nexport var PdfWordWrapType;\n(function (PdfWordWrapType) {\n /**\n * Specifies the type of `None`.\n * @private\n */\n PdfWordWrapType[PdfWordWrapType[\"None\"] = 0] = \"None\";\n /**\n * Specifies the type of `Word`.\n * @private\n */\n PdfWordWrapType[PdfWordWrapType[\"Word\"] = 1] = \"Word\";\n /**\n * Specifies the type of `WordOnly`.\n * @private\n */\n PdfWordWrapType[PdfWordWrapType[\"WordOnly\"] = 2] = \"WordOnly\";\n /**\n * Specifies the type of `Character`.\n * @private\n */\n PdfWordWrapType[PdfWordWrapType[\"Character\"] = 3] = \"Character\";\n})(PdfWordWrapType || (PdfWordWrapType = {}));\n/**\n * public Enum for `PdfSubSuperScript`.\n * @private\n */\nexport var PdfSubSuperScript;\n(function (PdfSubSuperScript) {\n /**\n * Specifies the type of `None`.\n * @private\n */\n PdfSubSuperScript[PdfSubSuperScript[\"None\"] = 0] = \"None\";\n /**\n * Specifies the type of `SuperScript`.\n * @private\n */\n PdfSubSuperScript[PdfSubSuperScript[\"SuperScript\"] = 1] = \"SuperScript\";\n /**\n * Specifies the type of `SubScript`.\n * @private\n */\n PdfSubSuperScript[PdfSubSuperScript[\"SubScript\"] = 2] = \"SubScript\";\n})(PdfSubSuperScript || (PdfSubSuperScript = {}));\n/**\n * public Enum for `FontEncoding`.\n * @private\n */\nexport var FontEncoding;\n(function (FontEncoding) {\n /**\n * Specifies the type of `Unknown`.\n * @private\n */\n FontEncoding[FontEncoding[\"Unknown\"] = 0] = \"Unknown\";\n /**\n * Specifies the type of `StandardEncoding`.\n * @private\n */\n FontEncoding[FontEncoding[\"StandardEncoding\"] = 1] = \"StandardEncoding\";\n /**\n * Specifies the type of `MacRomanEncoding`.\n * @private\n */\n FontEncoding[FontEncoding[\"MacRomanEncoding\"] = 2] = \"MacRomanEncoding\";\n /**\n * Specifies the type of `MacExpertEncoding`.\n * @private\n */\n FontEncoding[FontEncoding[\"MacExpertEncoding\"] = 3] = \"MacExpertEncoding\";\n /**\n * Specifies the type of `WinAnsiEncoding`.\n * @private\n */\n FontEncoding[FontEncoding[\"WinAnsiEncoding\"] = 4] = \"WinAnsiEncoding\";\n /**\n * Specifies the type of `PdfDocEncoding`.\n * @private\n */\n FontEncoding[FontEncoding[\"PdfDocEncoding\"] = 5] = \"PdfDocEncoding\";\n /**\n * Specifies the type of `IdentityH`.\n * @private\n */\n FontEncoding[FontEncoding[\"IdentityH\"] = 6] = \"IdentityH\";\n})(FontEncoding || (FontEncoding = {}));\n/**\n * public Enum for `TtfCmapFormat`.\n * @private\n */\nexport var TtfCmapFormat;\n(function (TtfCmapFormat) {\n /**\n * This is the Apple standard character to glyph index mapping table.\n * @private\n */\n TtfCmapFormat[TtfCmapFormat[\"Apple\"] = 0] = \"Apple\";\n /**\n * This is the Microsoft standard character to glyph index mapping table.\n * @private\n */\n TtfCmapFormat[TtfCmapFormat[\"Microsoft\"] = 4] = \"Microsoft\";\n /**\n * Format 6: Trimmed table mapping.\n * @private\n */\n TtfCmapFormat[TtfCmapFormat[\"Trimmed\"] = 6] = \"Trimmed\";\n})(TtfCmapFormat || (TtfCmapFormat = {}));\n/**\n * Enumerator that implements CMAP encodings.\n * @private\n */\nexport var TtfCmapEncoding;\n(function (TtfCmapEncoding) {\n /**\n * Unknown encoding.\n * @private\n */\n TtfCmapEncoding[TtfCmapEncoding[\"Unknown\"] = 0] = \"Unknown\";\n /**\n * When building a symbol font for Windows.\n * @private\n */\n TtfCmapEncoding[TtfCmapEncoding[\"Symbol\"] = 1] = \"Symbol\";\n /**\n * When building a Unicode font for Windows.\n * @private\n */\n TtfCmapEncoding[TtfCmapEncoding[\"Unicode\"] = 2] = \"Unicode\";\n /**\n * For font that will be used on a Macintosh.\n * @private\n */\n TtfCmapEncoding[TtfCmapEncoding[\"Macintosh\"] = 3] = \"Macintosh\";\n})(TtfCmapEncoding || (TtfCmapEncoding = {}));\n/**\n * Ttf platform ID.\n * @private\n */\nexport var TtfPlatformID;\n(function (TtfPlatformID) {\n /**\n * Apple platform.\n * @private\n */\n TtfPlatformID[TtfPlatformID[\"AppleUnicode\"] = 0] = \"AppleUnicode\";\n /**\n * Macintosh platform.\n * @private\n */\n TtfPlatformID[TtfPlatformID[\"Macintosh\"] = 1] = \"Macintosh\";\n /**\n * Iso platform.\n * @private\n */\n TtfPlatformID[TtfPlatformID[\"Iso\"] = 2] = \"Iso\";\n /**\n * Microsoft platform.\n * @private\n */\n TtfPlatformID[TtfPlatformID[\"Microsoft\"] = 3] = \"Microsoft\";\n})(TtfPlatformID || (TtfPlatformID = {}));\n/**\n * Microsoft encoding ID.\n * @private\n */\nexport var TtfMicrosoftEncodingID;\n(function (TtfMicrosoftEncodingID) {\n /**\n * Undefined encoding.\n * @private\n */\n TtfMicrosoftEncodingID[TtfMicrosoftEncodingID[\"Undefined\"] = 0] = \"Undefined\";\n /**\n * Unicode encoding.\n * @private\n */\n TtfMicrosoftEncodingID[TtfMicrosoftEncodingID[\"Unicode\"] = 1] = \"Unicode\";\n})(TtfMicrosoftEncodingID || (TtfMicrosoftEncodingID = {}));\n/**\n * Macintosh encoding ID.\n * @private\n */\nexport var TtfMacintoshEncodingID;\n(function (TtfMacintoshEncodingID) {\n /**\n * Roman encoding.\n * @private\n */\n TtfMacintoshEncodingID[TtfMacintoshEncodingID[\"Roman\"] = 0] = \"Roman\";\n /**\n * Japanese encoding.\n * @private\n */\n TtfMacintoshEncodingID[TtfMacintoshEncodingID[\"Japanese\"] = 1] = \"Japanese\";\n /**\n * Chinese encoding.\n * @private\n */\n TtfMacintoshEncodingID[TtfMacintoshEncodingID[\"Chinese\"] = 2] = \"Chinese\";\n})(TtfMacintoshEncodingID || (TtfMacintoshEncodingID = {}));\n/**\n * Enumerator that implements font descriptor flags.\n * @private\n */\nexport var FontDescriptorFlags;\n(function (FontDescriptorFlags) {\n /**\n * All glyphs have the same width (as opposed to proportional or variable-pitch fonts, which have different widths).\n * @private\n */\n FontDescriptorFlags[FontDescriptorFlags[\"FixedPitch\"] = 1] = \"FixedPitch\";\n /**\n * Glyphs have serifs, which are short strokes drawn at an angle on the top and\n * bottom of glyph stems (as opposed to sans serif fonts, which do not).\n * @private\n */\n FontDescriptorFlags[FontDescriptorFlags[\"Serif\"] = 2] = \"Serif\";\n /**\n * Font contains glyphs outside the Adobe standard Latin character set. The\n * flag and the nonsymbolic flag cannot both be set or both be clear.\n * @private\n */\n FontDescriptorFlags[FontDescriptorFlags[\"Symbolic\"] = 4] = \"Symbolic\";\n /**\n * Glyphs resemble cursive handwriting.\n * @private\n */\n FontDescriptorFlags[FontDescriptorFlags[\"Script\"] = 8] = \"Script\";\n /**\n * Font uses the Adobe standard Latin character set or a subset of it.\n * @private\n */\n FontDescriptorFlags[FontDescriptorFlags[\"Nonsymbolic\"] = 32] = \"Nonsymbolic\";\n /**\n * Glyphs have dominant vertical strokes that are slanted.\n * @private\n */\n FontDescriptorFlags[FontDescriptorFlags[\"Italic\"] = 64] = \"Italic\";\n /**\n * Bold font.\n * @private\n */\n FontDescriptorFlags[FontDescriptorFlags[\"ForceBold\"] = 262144] = \"ForceBold\";\n})(FontDescriptorFlags || (FontDescriptorFlags = {}));\n/**\n * true type font composite glyph flags.\n * @private\n */\nexport var TtfCompositeGlyphFlags;\n(function (TtfCompositeGlyphFlags) {\n /**\n * The Arg1And2AreWords.\n * @private\n */\n TtfCompositeGlyphFlags[TtfCompositeGlyphFlags[\"Arg1And2AreWords\"] = 1] = \"Arg1And2AreWords\";\n /**\n * The ArgsAreXyValues.\n * @private\n */\n TtfCompositeGlyphFlags[TtfCompositeGlyphFlags[\"ArgsAreXyValues\"] = 2] = \"ArgsAreXyValues\";\n /**\n * The RoundXyToGrid.\n * @private\n */\n TtfCompositeGlyphFlags[TtfCompositeGlyphFlags[\"RoundXyToGrid\"] = 4] = \"RoundXyToGrid\";\n /**\n * The WeHaveScale.\n * @private\n */\n TtfCompositeGlyphFlags[TtfCompositeGlyphFlags[\"WeHaveScale\"] = 8] = \"WeHaveScale\";\n /**\n * The Reserved.\n * @private\n */\n TtfCompositeGlyphFlags[TtfCompositeGlyphFlags[\"Reserved\"] = 16] = \"Reserved\";\n /**\n * The MoreComponents.\n * @private\n */\n TtfCompositeGlyphFlags[TtfCompositeGlyphFlags[\"MoreComponents\"] = 32] = \"MoreComponents\";\n /**\n * The WeHaveAnXyScale.\n * @private\n */\n TtfCompositeGlyphFlags[TtfCompositeGlyphFlags[\"WeHaveAnXyScale\"] = 64] = \"WeHaveAnXyScale\";\n /**\n * The WeHaveTwoByTwo\n */\n TtfCompositeGlyphFlags[TtfCompositeGlyphFlags[\"WeHaveTwoByTwo\"] = 128] = \"WeHaveTwoByTwo\";\n /**\n * The WeHaveInstructions.\n */\n TtfCompositeGlyphFlags[TtfCompositeGlyphFlags[\"WeHaveInstructions\"] = 256] = \"WeHaveInstructions\";\n /**\n * The UseMyMetrics.\n */\n TtfCompositeGlyphFlags[TtfCompositeGlyphFlags[\"UseMyMetrics\"] = 512] = \"UseMyMetrics\";\n})(TtfCompositeGlyphFlags || (TtfCompositeGlyphFlags = {}));\n","/**\n * PdfStringFormat.ts class for EJ2-PDF\n */\nimport { PdfVerticalAlignment } from './../../graphics/enum';\nimport { PdfSubSuperScript, PdfWordWrapType } from './../../graphics/fonts/enum';\n/**\n * `PdfStringFormat` class represents the text layout information on PDF.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a pages to the document\n * let page1 : PdfPage = document.pages.add();\n * // set font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // set brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * //\n * // set the format for string\n * let stringFormat : PdfStringFormat = new PdfStringFormat();\n * // set the text alignment\n * stringFormat.alignment = PdfTextAlignment.Center;\n * // set the vertical alignment\n * stringFormat.lineAlignment = PdfVerticalAlignment.Middle;\n * //\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, new PointF(10, 10), stringFormat);\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\nvar PdfStringFormat = /** @class */ (function () {\n function PdfStringFormat(arg1, arg2) {\n /**\n * The `scaling factor` of the text being drawn.\n * @private\n */\n this.scalingFactor = 100.0;\n /**\n * Indicates text `wrapping` type.\n * @private\n */\n this.wordWrapType = PdfWordWrapType.Word;\n if (typeof arg1 === 'undefined') {\n this.internalLineLimit = true;\n this.wordWrapType = PdfWordWrapType.Word;\n }\n else if (typeof arg1 === 'string') {\n this.constructor();\n }\n else {\n if (typeof arg2 === 'undefined') {\n this.constructor();\n this.textAlignment = arg1;\n }\n else {\n this.constructor(arg1);\n this.verticalAlignment = arg2;\n }\n }\n }\n Object.defineProperty(PdfStringFormat.prototype, \"alignment\", {\n //Properties\n /**\n * Gets or sets the `horizontal` text alignment\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a pages to the document\n * let page1 : PdfPage = document.pages.add();\n * // set font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // set brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * //\n * // set the format for string\n * let stringFormat : PdfStringFormat = new PdfStringFormat();\n * // set the text alignment\n * stringFormat.alignment = PdfTextAlignment.Center;\n * //\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, new PointF(10, 10), stringFormat);\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n get: function () {\n return this.textAlignment;\n },\n set: function (value) {\n this.textAlignment = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"textDirection\", {\n get: function () {\n return this.direction;\n },\n set: function (value) {\n this.direction = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"lineAlignment\", {\n /**\n * Gets or sets the `vertical` text alignment.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a pages to the document\n * let page1 : PdfPage = document.pages.add();\n * // set font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // set brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * //\n * // set the format for string\n * let stringFormat : PdfStringFormat = new PdfStringFormat();\n * // set the vertical alignment\n * stringFormat.lineAlignment = PdfVerticalAlignment.Middle;\n * //\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, new PointF(10, 10), stringFormat);\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n get: function () {\n if (typeof this.verticalAlignment === 'undefined' || this.verticalAlignment == null) {\n return PdfVerticalAlignment.Top;\n }\n else {\n return this.verticalAlignment;\n }\n },\n set: function (value) {\n this.verticalAlignment = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"rightToLeft\", {\n /**\n * Gets or sets the value that indicates text `direction` mode.\n * @private\n */\n get: function () {\n if (typeof this.isRightToLeft === 'undefined' || this.isRightToLeft == null) {\n return false;\n }\n else {\n return this.isRightToLeft;\n }\n },\n set: function (value) {\n this.isRightToLeft = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"characterSpacing\", {\n /**\n * Gets or sets value that indicates a `size` among the characters in the text.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a pages to the document\n * let page1 : PdfPage = document.pages.add();\n * // set font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // set brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * //\n * // set the format for string\n * let stringFormat : PdfStringFormat = new PdfStringFormat();\n * // set character spacing\n * stringFormat.characterSpacing = 10;\n * //\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, new PointF(10, 10), stringFormat);\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n get: function () {\n if (typeof this.internalCharacterSpacing === 'undefined' || this.internalCharacterSpacing == null) {\n return 0;\n }\n else {\n return this.internalCharacterSpacing;\n }\n },\n set: function (value) {\n this.internalCharacterSpacing = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"wordSpacing\", {\n /**\n * Gets or sets value that indicates a `size` among the words in the text.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a pages to the document\n * let page1 : PdfPage = document.pages.add();\n * // set font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // set brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * //\n * // set the format for string\n * let stringFormat : PdfStringFormat = new PdfStringFormat();\n * // set word spacing\n * stringFormat.wordSpacing = 10;\n * //\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, new PointF(10, 10), stringFormat);\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n get: function () {\n if (typeof this.internalWordSpacing === 'undefined' || this.internalWordSpacing == null) {\n return 0;\n }\n else {\n return this.internalWordSpacing;\n }\n },\n set: function (value) {\n this.internalWordSpacing = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"lineSpacing\", {\n /**\n * Gets or sets value that indicates the `vertical distance` between the baselines of adjacent lines of text.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a pages to the document\n * let page1 : PdfPage = document.pages.add();\n * // set font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // set brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * // set string\n * let text : string = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor\n * incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitati';\n * // set rectangle bounds\n * let rectangle : RectangleF = new RectangleF({x : 0, y : 0}, {width : 300, height : 100})\n * //\n * // set the format for string\n * let stringFormat : PdfStringFormat = new PdfStringFormat();\n * // set line spacing\n * stringFormat.lineSpacing = 10;\n * //\n * // draw the text\n * page1.graphics.drawString(text, font, blackBrush, rectangle, stringFormat);\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n get: function () {\n if (typeof this.leading === 'undefined' || this.leading == null) {\n return 0;\n }\n else {\n return this.leading;\n }\n },\n set: function (value) {\n this.leading = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"clipPath\", {\n /**\n * Gets or sets a value indicating whether the text is `clipped` or not.\n * @private\n */\n get: function () {\n if (typeof this.clip === 'undefined' || this.clip == null) {\n return false;\n }\n else {\n return this.clip;\n }\n },\n set: function (value) {\n this.clip = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"subSuperScript\", {\n /**\n * Gets or sets value indicating whether the text is in `subscript or superscript` mode.\n * @private\n */\n get: function () {\n if (typeof this.pdfSubSuperScript === 'undefined' || this.pdfSubSuperScript == null) {\n return PdfSubSuperScript.None;\n }\n else {\n return this.pdfSubSuperScript;\n }\n },\n set: function (value) {\n this.pdfSubSuperScript = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"paragraphIndent\", {\n /**\n * Gets or sets the `indent` of the first line in the paragraph.\n * @private\n */\n get: function () {\n if (typeof this.internalParagraphIndent === 'undefined' || this.internalParagraphIndent == null) {\n return 0;\n }\n else {\n return this.internalParagraphIndent;\n }\n },\n set: function (value) {\n this.internalParagraphIndent = value;\n this.firstLineIndent = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"lineLimit\", {\n /**\n * Gets or sets a value indicating whether [`line limit`].\n * @private\n */\n get: function () {\n return this.internalLineLimit;\n },\n set: function (value) {\n this.internalLineLimit = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"measureTrailingSpaces\", {\n /**\n * Gets or sets a value indicating whether [`measure trailing spaces`].\n * @private\n */\n get: function () {\n if (typeof this.trailingSpaces === 'undefined' || this.trailingSpaces == null) {\n return false;\n }\n else {\n return this.trailingSpaces;\n }\n },\n set: function (value) {\n this.trailingSpaces = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"noClip\", {\n /**\n * Gets or sets a value indicating whether [`no clip`].\n * @private\n */\n get: function () {\n if (typeof this.isNoClip === 'undefined' || this.isNoClip == null) {\n return false;\n }\n else {\n return this.isNoClip;\n }\n },\n set: function (value) {\n this.isNoClip = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"wordWrap\", {\n /**\n * Gets or sets value indicating type of the text `wrapping`.\n * @private\n */\n get: function () {\n // if (typeof this.wrapType === 'undefined' || this.wrapType == null) {\n // return PdfWordWrapType.Word;\n // } else {\n return this.wordWrapType;\n // }\n },\n set: function (value) {\n this.wordWrapType = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"horizontalScalingFactor\", {\n /**\n * Gets or sets the `scaling factor`.\n * @private\n */\n get: function () {\n // if (typeof this.scalingFactor === 'undefined' || this.scalingFactor == null) {\n // return 100;\n // } else {\n return this.scalingFactor;\n // }\n },\n set: function (value) {\n if (value <= 0) {\n throw new Error('ArgumentOutOfRangeException:The scaling factor cant be less of equal to zero, ScalingFactor');\n }\n this.scalingFactor = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringFormat.prototype, \"firstLineIndent\", {\n /**\n * Gets or sets the `indent` of the first line in the text.\n * @private\n */\n get: function () {\n if (typeof this.initialLineIndent === 'undefined' || this.initialLineIndent == null) {\n return 0;\n }\n else {\n return this.initialLineIndent;\n }\n },\n set: function (value) {\n this.initialLineIndent = value;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * `Clones` the object.\n * @private\n */\n //IClonable implementation\n PdfStringFormat.prototype.clone = function () {\n var format = this;\n return format;\n };\n return PdfStringFormat;\n}());\nexport { PdfStringFormat };\n","/**\n * StringTokenizer.ts class for EJ2-PDF\n * Utility class for working with strings.\n * @private\n */\nvar StringTokenizer = /** @class */ (function () {\n // Constructors\n /**\n * Initializes a new instance of the `StringTokenizer` class.\n * @private\n */\n function StringTokenizer(textValue) {\n /**\n * Current `position`.\n * @private\n */\n this.currentPosition = 0;\n if (textValue == null) {\n throw new Error('ArgumentNullException:text');\n }\n this.text = textValue;\n }\n Object.defineProperty(StringTokenizer.prototype, \"length\", {\n // Properties\n /**\n * Gets text `length`.\n * @private\n */\n get: function () {\n return this.text.length;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(StringTokenizer.prototype, \"end\", {\n get: function () {\n return (this.currentPosition === this.text.length);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(StringTokenizer.prototype, \"position\", {\n /**\n * Gets or sets the position.\n * @private\n */\n get: function () {\n return this.currentPosition;\n },\n set: function (value) {\n this.currentPosition = value;\n },\n enumerable: true,\n configurable: true\n });\n StringTokenizer.getCharsCount = function (text, symbols) {\n if (typeof symbols === 'string') {\n if (text == null) {\n throw new Error('ArgumentNullException:wholeText');\n }\n var numSymbols = 0;\n var curIndex = 0;\n for (;;) {\n curIndex = text.indexOf(symbols, curIndex);\n if (curIndex === -1) {\n break;\n }\n else {\n numSymbols++;\n curIndex++;\n }\n }\n return numSymbols;\n }\n else {\n if (text == null) {\n throw new Error('ArgumentNullException:text');\n }\n if (symbols == null) {\n throw new Error('ArgumentNullException:symbols');\n }\n var count = 0;\n for (var i = 0, len = text.length; i < len; i++) {\n var ch = text[i];\n if (this.contains(symbols, ch)) {\n count++;\n }\n }\n return count;\n }\n };\n /**\n * Reads line of the text.\n * @private\n */\n StringTokenizer.prototype.readLine = function () {\n var pos = this.currentPosition;\n while (pos < this.length) {\n var ch = this.text[pos];\n switch (ch) {\n case '\\r':\n case '\\n': {\n var text = this.text.substring(this.currentPosition, pos - this.currentPosition);\n this.currentPosition = pos + 1;\n this.currentPosition++;\n return text;\n }\n }\n pos++;\n }\n // The remaining text.\n if (pos > this.currentPosition) {\n var text2 = this.text.substring(this.currentPosition, pos - this.currentPosition);\n this.currentPosition = pos;\n return text2;\n }\n return null;\n };\n /**\n * Reads line of the text.\n * @private\n */\n StringTokenizer.prototype.peekLine = function () {\n var pos = this.currentPosition;\n var line = this.readLine();\n this.currentPosition = pos;\n return line;\n };\n /**\n * Reads a word from the text.\n * @private\n */\n StringTokenizer.prototype.readWord = function () {\n var pos = this.currentPosition;\n while (pos < this.length) {\n var ch = this.text[pos];\n switch (ch) {\n case '\\r':\n case '\\n':\n var textValue = this.text.substr(this.currentPosition, pos - this.currentPosition);\n this.currentPosition = pos + 1;\n if (((ch === '\\r') && (this.currentPosition < this.length)) && (this.text[this.currentPosition] === '\\n')) {\n this.currentPosition++;\n }\n return textValue;\n case ' ':\n case '\\t': {\n if (pos === this.currentPosition) {\n pos++;\n }\n var text = this.text.substr(this.currentPosition, pos - this.currentPosition);\n this.currentPosition = pos;\n return text;\n }\n }\n pos++;\n }\n // The remaining text.\n if (pos > this.currentPosition) {\n var text2 = this.text.substr(this.currentPosition, pos - this.currentPosition);\n this.currentPosition = pos;\n return text2;\n }\n return null;\n };\n /**\n * Peeks a word from the text.\n * @private\n */\n StringTokenizer.prototype.peekWord = function () {\n var pos = this.currentPosition;\n var word = this.readWord();\n this.currentPosition = pos;\n return word;\n };\n StringTokenizer.prototype.read = function (count) {\n if (typeof count === 'undefined') {\n var ch = '0';\n if (!this.end) {\n ch = this.text[this.currentPosition];\n this.currentPosition++;\n }\n return ch;\n }\n else {\n var num = 0;\n var builder = '';\n while (!this.end && num < count) {\n var ch = this.read();\n builder = builder + ch;\n num++;\n }\n return builder;\n }\n };\n /**\n * Peeks char form the data.\n * @private\n */\n StringTokenizer.prototype.peek = function () {\n var ch = '0';\n if (!this.end) {\n ch = this.text[this.currentPosition];\n }\n return ch;\n };\n /**\n * Closes a reader.\n * @private\n */\n StringTokenizer.prototype.close = function () {\n this.text = null;\n };\n StringTokenizer.prototype.readToEnd = function () {\n var text;\n if (this.currentPosition === 0) {\n text = this.text;\n }\n else {\n text = this.text.substring(this.length, this.currentPosition);\n }\n this.currentPosition = this.length;\n return text;\n };\n //Implementation\n /**\n * Checks whether array contains a symbol.\n * @private\n */\n StringTokenizer.contains = function (array, symbol) {\n var contains = false;\n for (var i = 0; i < array.length; i++) {\n if (array[i] === symbol) {\n contains = true;\n break;\n }\n }\n return contains;\n };\n // Constants\n /**\n * `Whitespace` symbol.\n * @private\n */\n StringTokenizer.whiteSpace = ' ';\n /**\n * `tab` symbol.\n * @private\n */\n StringTokenizer.tab = '\\t';\n /**\n * Array of `spaces`.\n * @private\n */\n StringTokenizer.spaces = [StringTokenizer.whiteSpace, StringTokenizer.tab];\n /**\n * `Pattern` for WhiteSpace.\n * @private\n */\n StringTokenizer.whiteSpacePattern = '^[ \\t]+$';\n return StringTokenizer;\n}());\nexport { StringTokenizer };\n","import { SizeF, RectangleF, PointF } from './../../drawing/pdf-drawing';\nimport { PdfWordWrapType } from './enum';\nimport { StringTokenizer } from './string-tokenizer';\n/**\n * Class `lay outing the text`.\n */\nvar PdfStringLayouter = /** @class */ (function () {\n // Constructors\n /**\n * Initializes a new instance of the `StringLayouter` class.\n * @private\n */\n function PdfStringLayouter() {\n /**\n * Checks whether the x co-ordinate is need to set as client size or not.\n * @hidden\n * @private\n */\n this.isOverloadWithPosition = false;\n //\n }\n PdfStringLayouter.prototype.layout = function (arg1, arg2, arg3, arg4, arg5, arg6, arg7) {\n if (arg4 instanceof RectangleF) {\n this.initialize(arg1, arg2, arg3, arg4, arg5);\n this.isOverloadWithPosition = arg6;\n this.clientSize = arg7;\n var result = this.doLayout();\n this.clear();\n return result;\n }\n else {\n this.initialize(arg1, arg2, arg3, arg4);\n this.isOverloadWithPosition = arg5;\n this.clientSize = arg6;\n var result = this.doLayout();\n this.clear();\n return result;\n }\n };\n PdfStringLayouter.prototype.initialize = function (text, font, format, rectSize, pageHeight) {\n if (typeof pageHeight === 'number') {\n if (text == null) {\n throw new Error('ArgumentNullException:text');\n }\n if (font == null) {\n throw new Error('ArgumentNullException:font');\n }\n this.text = text;\n this.font = font;\n this.format = format;\n this.size = new SizeF(rectSize.width, rectSize.height);\n this.rectangle = rectSize;\n this.pageHeight = pageHeight;\n this.reader = new StringTokenizer(text);\n }\n else {\n this.initialize(text, font, format, new RectangleF(new PointF(0, 0), rectSize), 0);\n }\n };\n /**\n * `Clear` all resources.\n * @private\n */\n PdfStringLayouter.prototype.clear = function () {\n this.font = null;\n this.format = null;\n this.reader.close();\n this.reader = null;\n this.text = null;\n };\n /**\n * `Layouts` the text.\n * @private\n */\n PdfStringLayouter.prototype.doLayout = function () {\n var result = new PdfStringLayoutResult();\n var lineResult = new PdfStringLayoutResult();\n var lines = [];\n var line = this.reader.peekLine();\n var lineIndent = this.getLineIndent(true);\n while (line != null) {\n lineResult = this.layoutLine(line, lineIndent);\n if (lineResult !== null || typeof lineResult !== 'undefined') {\n var numSymbolsInserted = 0;\n /* tslint:disable */\n var returnedValue = this.copyToResult(result, lineResult, lines, /*out*/ numSymbolsInserted);\n /* tslint:enable */\n var success = returnedValue.success;\n numSymbolsInserted = returnedValue.numInserted;\n if (!success) {\n this.reader.read(numSymbolsInserted);\n break;\n }\n }\n // if (lineResult.textRemainder != null && lineResult.textRemainder.length > 0 ) {\n // break;\n // }\n this.reader.readLine();\n line = this.reader.peekLine();\n lineIndent = this.getLineIndent(false);\n }\n this.finalizeResult(result, lines);\n return result;\n };\n /**\n * Returns `line indent` for the line.\n * @private\n */\n PdfStringLayouter.prototype.getLineIndent = function (firstLine) {\n var lineIndent = 0;\n if (this.format != null) {\n lineIndent = (firstLine) ? this.format.firstLineIndent : this.format.paragraphIndent;\n lineIndent = (this.size.width > 0) ? Math.min(this.size.width, lineIndent) : lineIndent;\n }\n return lineIndent;\n };\n /**\n * Calculates `height` of the line.\n * @private\n */\n PdfStringLayouter.prototype.getLineHeight = function () {\n var height = this.font.height;\n if (this.format != null && this.format.lineSpacing !== 0) {\n height = this.format.lineSpacing + this.font.height;\n }\n return height;\n };\n /**\n * Calculates `width` of the line.\n * @private\n */\n PdfStringLayouter.prototype.getLineWidth = function (line) {\n var width = this.font.getLineWidth(line, this.format);\n return width;\n };\n // tslint:disable\n /**\n * `Layouts` line.\n * @private\n */\n PdfStringLayouter.prototype.layoutLine = function (line, lineIndent) {\n var lineResult = new PdfStringLayoutResult();\n lineResult.layoutLineHeight = this.getLineHeight();\n var lines = [];\n var maxWidth = this.size.width;\n var lineWidth = this.getLineWidth(line) + lineIndent;\n var lineType = LineType.FirstParagraphLine;\n var readWord = true;\n // line is in bounds.\n if (maxWidth <= 0 || Math.round(lineWidth) <= Math.round(maxWidth)) {\n this.addToLineResult(lineResult, lines, line, lineWidth, LineType.NewLineBreak | lineType);\n }\n else {\n var builder = '';\n var curLine = '';\n lineWidth = lineIndent;\n var curIndent = lineIndent;\n var reader = new StringTokenizer(line);\n var word = reader.peekWord();\n var isSingleWord = false;\n if (word.length !== reader.length) {\n if (word === ' ') {\n curLine = curLine + word;\n builder = builder + word;\n reader.position += 1;\n word = reader.peekWord();\n }\n }\n while (word != null) {\n curLine = curLine + word;\n var curLineWidth = this.getLineWidth(curLine.toString()) + curIndent /*)*/;\n if (curLine.toString() === ' ') {\n curLine = '';\n curLineWidth = 0;\n }\n if (curLineWidth > maxWidth) {\n if (this.getWrapType() === PdfWordWrapType.None) {\n break;\n }\n if (curLine.length === word.length) {\n // Character wrap is disabled or one symbol is greater than bounds.\n if (this.getWrapType() === PdfWordWrapType.WordOnly) {\n lineResult.textRemainder = line.substring(reader.position);\n break;\n }\n else if (curLine.length === 1) {\n builder = builder + word;\n break;\n }\n else {\n readWord = false;\n curLine = '';\n word = reader.peek().toString();\n continue;\n }\n }\n else {\n if (this.getLineWidth(word.toString()) > maxWidth) {\n this.format.wordWrap = PdfWordWrapType.Character;\n }\n else {\n if (typeof this.format !== 'undefined' && this.format !== null) {\n this.format.wordWrap = PdfWordWrapType.Word;\n }\n }\n if (this.getWrapType() !== PdfWordWrapType.Character || !readWord) {\n var ln = builder.toString();\n // if (ln.indexOf(' ') === -1) {\n // isSingleWord = true;\n // this.addToLineResult(lineResult, lines, curLine, lineWidth, LineType.LayoutBreak | lineType);\n // } else {\n // this.addToLineResult(lineResult, lines, ln, lineWidth, LineType.LayoutBreak | lineType);\n // } \n if (ln !== ' ') {\n this.addToLineResult(lineResult, lines, ln, lineWidth, LineType.LayoutBreak | lineType);\n }\n if (this.isOverloadWithPosition) {\n maxWidth = this.clientSize.width;\n }\n curLine = '';\n builder = '';\n lineWidth = 0;\n curIndent = 0;\n curLineWidth = 0;\n lineType = LineType.None;\n // if (isSingleWord) {\n // reader.readWord();\n // readWord = false;\n // }\n word = (readWord) ? word : reader.peekWord();\n //isSingleWord = false;\n readWord = true;\n }\n else {\n readWord = false;\n curLine = '';\n curLine = curLine + builder.toString();\n word = reader.peek().toString();\n }\n continue;\n }\n }\n /*tslint:disable:max-func-body-length */\n builder = builder + word;\n lineWidth = curLineWidth;\n if (readWord) {\n reader.readWord();\n word = reader.peekWord();\n //isSingleWord = false;\n }\n else {\n reader.read();\n word = reader.peek().toString();\n }\n }\n if (builder.length > 0) {\n var ln = builder.toString();\n this.addToLineResult(lineResult, lines, ln, lineWidth, LineType.NewLineBreak | LineType.LastParagraphLine);\n }\n reader.close();\n }\n lineResult.layoutLines = [];\n for (var index = 0; index < lines.length; index++) {\n lineResult.layoutLines.push(lines[index]);\n }\n lines = [];\n return lineResult;\n };\n /**\n * `Adds` line to line result.\n * @private\n */\n PdfStringLayouter.prototype.addToLineResult = function (lineResult, lines, line, lineWidth, breakType) {\n var info = new LineInfo();\n info.text = line;\n info.width = lineWidth;\n info.lineType = breakType;\n lines.push(info);\n var size = lineResult.actualSize;\n size.height += this.getLineHeight();\n size.width = Math.max(size.width, lineWidth);\n lineResult.size = size;\n };\n /**\n * `Copies` layout result from line result to entire result. Checks whether we can proceed lay outing or not.\n * @private\n */\n PdfStringLayouter.prototype.copyToResult = function (result, lineResult, lines, \n /*out*/ numInserted) {\n var success = true;\n var allowPartialLines = (this.format != null && !this.format.lineLimit);\n var height = result.actualSize.height;\n var maxHeight = this.size.height;\n if ((this.pageHeight > 0) && (maxHeight + this.rectangle.y > this.pageHeight)) {\n maxHeight = this.rectangle.y - this.pageHeight;\n maxHeight = Math.max(maxHeight, -maxHeight);\n }\n numInserted = 0;\n if (lineResult.lines != null) {\n for (var i = 0, len = lineResult.lines.length; i < len; i++) {\n var expHeight = height + lineResult.lineHeight;\n if (expHeight <= maxHeight || maxHeight <= 0 || allowPartialLines) {\n var info = lineResult.lines[i];\n numInserted += info.text.length;\n info = this.trimLine(info, (lines.length === 0));\n lines.push(info);\n // Update width.\n var size = result.actualSize;\n size.width = Math.max(size.width, info.width);\n result.size = size;\n // The part of the line fits only and it's allowed to use partial lines.\n // if (expHeight >= maxHeight && maxHeight > 0 && allowPartialLines)\n // {\n // let shouldClip : boolean = (this.format == null || !this.format.noClip);\n // if (shouldClip)\n // {\n // let exceededHeight : number = expHeight - maxHeight;\n // let fitHeight : number = /*Utils.Round(*/ lineResult.lineHeight - exceededHeight /*)*/;\n // height = /*Utils.Round(*/ height + fitHeight /*)*/;\n // }\n // else\n // {\n // height = expHeight;\n // }\n // success = false;\n // break;\n // } else {\n height = expHeight;\n // }\n }\n else {\n success = false;\n break;\n }\n }\n }\n if (height != result.size.height) {\n var size1 = result.actualSize;\n size1.height = height;\n result.size = size1;\n }\n return { success: success, numInserted: numInserted };\n };\n /**\n * `Finalizes` final result.\n * @private\n */\n PdfStringLayouter.prototype.finalizeResult = function (result, lines) {\n result.layoutLines = [];\n for (var index = 0; index < lines.length; index++) {\n result.layoutLines.push(lines[index]);\n }\n result.layoutLineHeight = this.getLineHeight();\n if (!this.reader.end) {\n result.textRemainder = this.reader.readToEnd();\n }\n lines = [];\n };\n /**\n * `Trims` whitespaces at the line.\n * @private\n */\n PdfStringLayouter.prototype.trimLine = function (info, firstLine) {\n var line = info.text;\n var lineWidth = info.width;\n // Trim start whitespaces if the line is not a start of the paragraph only.\n var trimStartSpaces = ((info.lineType & LineType.FirstParagraphLine) === 0);\n var start = (this.format == null || !this.format.rightToLeft);\n var spaces = StringTokenizer.spaces;\n line = (start) ? line.trim() : line.trim();\n // Recalculate line width.\n if (line.length !== info.text.length) {\n lineWidth = this.getLineWidth(line);\n if ((info.lineType & LineType.FirstParagraphLine) > 0) {\n lineWidth += this.getLineIndent(firstLine);\n }\n }\n info.text = line;\n info.width = lineWidth;\n return info;\n };\n /**\n * Returns `wrap` type.\n * @private\n */\n PdfStringLayouter.prototype.getWrapType = function () {\n var wrapType = (this.format != null) ? this.format.wordWrap : PdfWordWrapType.Word;\n return wrapType;\n };\n return PdfStringLayouter;\n}());\nexport { PdfStringLayouter };\n//Internal declaration\nvar PdfStringLayoutResult = /** @class */ (function () {\n function PdfStringLayoutResult() {\n }\n Object.defineProperty(PdfStringLayoutResult.prototype, \"remainder\", {\n // Properties\n /**\n * Gets the `text` which is not lay outed.\n * @private\n */\n get: function () {\n return this.textRemainder;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringLayoutResult.prototype, \"actualSize\", {\n /**\n * Gets the actual layout text `bounds`.\n * @private\n */\n get: function () {\n if (typeof this.size === 'undefined') {\n this.size = new SizeF(0, 0);\n }\n return this.size;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringLayoutResult.prototype, \"lines\", {\n /**\n * Gets layout `lines` information.\n * @private\n */\n get: function () {\n return this.layoutLines;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringLayoutResult.prototype, \"lineHeight\", {\n /**\n * Gets the `height` of the line.\n * @private\n */\n get: function () {\n return this.layoutLineHeight;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringLayoutResult.prototype, \"empty\", {\n /**\n * Gets value that indicates whether any layout text [`empty`].\n * @private\n */\n get: function () {\n return (this.layoutLines == null || this.layoutLines.length === 0);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStringLayoutResult.prototype, \"lineCount\", {\n /**\n * Gets `number of` the layout lines.\n * @private\n */\n get: function () {\n var count = (!this.empty) ? this.layoutLines.length : 0;\n return count;\n },\n enumerable: true,\n configurable: true\n });\n return PdfStringLayoutResult;\n}());\nexport { PdfStringLayoutResult };\nvar LineInfo = /** @class */ (function () {\n function LineInfo() {\n }\n Object.defineProperty(LineInfo.prototype, \"lineType\", {\n //Properties\n /**\n * Gets the `type` of the line text.\n * @private\n */\n get: function () {\n return this.type;\n },\n set: function (value) {\n this.type = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(LineInfo.prototype, \"text\", {\n /**\n * Gets the line `text`.\n * @private\n */\n get: function () {\n return this.content;\n },\n set: function (value) {\n this.content = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(LineInfo.prototype, \"width\", {\n /**\n * Gets `width` of the line text.\n * @private\n */\n get: function () {\n return this.lineWidth;\n },\n set: function (value) {\n this.lineWidth = value;\n },\n enumerable: true,\n configurable: true\n });\n return LineInfo;\n}());\nexport { LineInfo };\n/**\n* Break type of the `line`.\n* @private\n*/\nexport var LineType;\n(function (LineType) {\n /**\n * Specifies the type of `None`.\n * @private\n */\n LineType[LineType[\"None\"] = 0] = \"None\";\n /**\n * Specifies the type of `NewLineBreak`.\n * @private\n */\n LineType[LineType[\"NewLineBreak\"] = 1] = \"NewLineBreak\";\n /**\n * Specifies the type of `LayoutBreak`.\n * @private\n */\n LineType[LineType[\"LayoutBreak\"] = 2] = \"LayoutBreak\";\n /**\n * Specifies the type of `FirstParagraphLine`.\n * @private\n */\n LineType[LineType[\"FirstParagraphLine\"] = 4] = \"FirstParagraphLine\";\n /**\n * Specifies the type of `LastParagraphLine`.\n * @private\n */\n LineType[LineType[\"LastParagraphLine\"] = 8] = \"LastParagraphLine\";\n})(LineType || (LineType = {}));\n","/**\n * PdfFont.ts class for EJ2-PDF\n */\nimport { PdfFontStyle } from './enum';\nimport { SizeF } from './../../drawing/pdf-drawing';\nimport { PdfStringFormat } from './pdf-string-format';\nimport { PdfStringLayouter } from './string-layouter';\nimport { StringTokenizer } from './string-tokenizer';\n/**\n * Defines a particular format for text, including font face, size, and style attributes.\n * @private\n */\nvar PdfFont = /** @class */ (function () {\n function PdfFont(size, style) {\n /**\n * `Style` of the font.\n * @private\n */\n this.fontStyle = PdfFontStyle.Regular;\n if (typeof size === 'number' && typeof style === 'undefined') {\n this.fontSize = size;\n }\n else {\n this.fontSize = size;\n this.setStyle(style);\n }\n }\n Object.defineProperty(PdfFont.prototype, \"name\", {\n //Properties\n /**\n * Gets the face name of this Font.\n * @private\n */\n get: function () {\n return this.metrics.name;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfFont.prototype, \"size\", {\n /**\n * Gets the size of this font.\n * @private\n */\n get: function () {\n return this.fontSize;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfFont.prototype, \"height\", {\n /**\n * Gets the height of the font in points.\n * @private\n */\n get: function () {\n return this.metrics.getHeight(null);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfFont.prototype, \"style\", {\n /**\n * Gets the style information for this font.\n * @private\n */\n get: function () {\n return this.fontStyle;\n },\n set: function (value) {\n this.fontStyle = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfFont.prototype, \"bold\", {\n /**\n * Gets a value indicating whether this `PdfFont` is `bold`.\n * @private\n */\n get: function () {\n return ((this.style & PdfFontStyle.Bold) > 0);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfFont.prototype, \"italic\", {\n /**\n * Gets a value indicating whether this `PdfFont` has the `italic` style applied.\n * @private\n */\n get: function () {\n return ((this.style & PdfFontStyle.Italic) > 0);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfFont.prototype, \"strikeout\", {\n /**\n * Gets a value indicating whether this `PdfFont` is `strikeout`.\n * @private\n */\n get: function () {\n return ((this.style & PdfFontStyle.Strikeout) > 0);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfFont.prototype, \"underline\", {\n /**\n * Gets a value indicating whether this `PdfFont` is `underline`.\n * @private\n */\n get: function () {\n return ((this.style & PdfFontStyle.Underline) > 0);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfFont.prototype, \"metrics\", {\n /**\n * Gets or sets the `metrics` for this font.\n * @private\n */\n get: function () {\n return this.fontMetrics;\n },\n set: function (value) {\n this.fontMetrics = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfFont.prototype, \"element\", {\n // /**\n // * Gets and Sets the font `internals`.\n // * @private\n // */\n // public get fontInternal() : IPdfPrimitive {\n // return this.pdfFontInternals;\n // }\n // public set fontInternal(value : IPdfPrimitive) {\n // this.pdfFontInternals = value;\n // }\n //IPdfWrapper Members\n /**\n * Gets the `element` representing the font.\n * @private\n */\n get: function () {\n return this.pdfFontInternals;\n },\n enumerable: true,\n configurable: true\n });\n PdfFont.prototype.measureString = function (text, arg2, arg3, arg4, arg5) {\n if (typeof text === 'string' && typeof arg2 === 'undefined') {\n return this.measureString(text, null);\n }\n else if (typeof text === 'string' && (arg2 instanceof PdfStringFormat || arg2 == null) && typeof arg3 === 'undefined' && typeof arg4 === 'undefined') {\n var temparg2 = arg2;\n var charactersFitted = 0;\n var linesFilled = 0;\n return this.measureString(text, temparg2, charactersFitted, linesFilled);\n }\n else if (typeof text === 'string' && (arg2 instanceof PdfStringFormat || arg2 == null) && typeof arg3 === 'number' && typeof arg4 === 'number') {\n var temparg2 = arg2;\n return this.measureString(text, 0, temparg2, arg3, arg4);\n // } else if (typeof text === 'string' && typeof arg2 === 'number' && typeof arg3 === 'undefined') {\n // return this.measureString(text, arg2, null);\n // } else if (typeof text === 'string' && typeof arg2 === 'number' && (arg3 instanceof PdfStringFormat || arg3 == null) && typeof arg4 === 'undefined' && typeof arg5 === 'undefined') {\n // let temparg3 : PdfStringFormat = arg3 as PdfStringFormat;\n // let charactersFitted : number = 0;\n // let linesFilled : number = 0;\n // return this.measureString(text, arg2, temparg3, charactersFitted, linesFilled);\n }\n else if (typeof text === 'string' && typeof arg2 === 'number' && (arg3 instanceof PdfStringFormat || arg3 == null) && typeof arg4 === 'number' && typeof arg5 === 'number') {\n var layoutArea = new SizeF(arg2, 0);\n var temparg3 = arg3;\n return this.measureString(text, layoutArea, temparg3, arg4, arg5);\n // } else if (typeof text === 'string' && arg2 instanceof SizeF && typeof arg3 === 'undefined') {\n // return this.measureString(text, arg2, null);\n // } else if (typeof text === 'string' && arg2 instanceof SizeF && (arg3 instanceof PdfStringFormat || arg3 == null) && typeof arg4 === 'undefined' && typeof arg5 === 'undefined') {\n // let temparg3 : PdfStringFormat = arg3 as PdfStringFormat;\n // let charactersFitted : number = 0;\n // let linesFilled : number = 0;\n // return this.measureString(text, arg2, temparg3, charactersFitted, linesFilled);\n }\n else {\n if (text == null) {\n throw Error(\"ArgumentNullException(\\\"text\\\")\");\n }\n var temparg2 = arg2;\n var temparg3 = arg3;\n var layouter = new PdfStringLayouter();\n var result = layouter.layout(text, this, temparg3, temparg2, false, new SizeF(0, 0));\n // arg4 = (result.Remainder == null) ? text.length : text.length - result.Remainder.length;\n arg4 = text.length;\n arg5 = (result.empty) ? 0 : result.lines.length;\n return result.actualSize;\n }\n };\n /* tslint:enable */\n //IPdfCache Members\n /**\n * `Checks` whether the object is similar to another object.\n * @private\n */\n PdfFont.prototype.equalsTo = function (obj) {\n var result = this.equalsToFont(obj);\n return result;\n };\n /**\n * Returns `internals` of the object.\n * @private\n */\n PdfFont.prototype.getInternals = function () {\n return this.pdfFontInternals;\n };\n /**\n * Sets `internals` to the object.\n * @private\n */\n PdfFont.prototype.setInternals = function (internals) {\n if (internals == null) {\n throw new Error('ArgumentNullException:internals');\n }\n this.pdfFontInternals = internals;\n };\n /**\n * Sets the `style` of the font.\n * @private\n */\n PdfFont.prototype.setStyle = function (style) {\n this.fontStyle = style;\n };\n /**\n * Applies `settings` to the default line width.\n * @private\n */\n PdfFont.prototype.applyFormatSettings = function (line, format, width) {\n // if (line == null) {\n // throw new Error(`ArgumentNullException:line`);\n // }\n var realWidth = width;\n if (format != null && width > 0) {\n // Space among characters is not default.\n if (format.characterSpacing !== 0) {\n realWidth += (line.length - 1) * format.characterSpacing;\n }\n // Space among words is not default.\n if (format.wordSpacing !== 0) {\n var symbols = StringTokenizer.spaces;\n var whitespacesCount = StringTokenizer.getCharsCount(line, symbols);\n realWidth += whitespacesCount * format.wordSpacing;\n }\n }\n return realWidth;\n };\n //Constants\n /**\n * `Multiplier` of the symbol width.\n * @default 0.001\n * @private\n */\n PdfFont.charSizeMultiplier = 0.001;\n /**\n * `Synchronization` object.\n * @private\n */\n PdfFont.syncObject = new Object();\n return PdfFont;\n}());\nexport { PdfFont };\n","/**\n * Used to `write a string` into output file.\n * @private\n */\nvar PdfWriter = /** @class */ (function () {\n /**\n * Initialize an instance of `PdfWriter` class.\n * @private\n */\n function PdfWriter(stream) {\n this.streamWriter = stream;\n }\n Object.defineProperty(PdfWriter.prototype, \"document\", {\n //properties\n /**\n * Gets and Sets the `document`.\n * @private\n */\n get: function () {\n return this.pdfDocument;\n },\n set: function (value) {\n this.pdfDocument = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfWriter.prototype, \"position\", {\n /**\n * Gets the `position`.\n * @private\n */\n get: function () {\n return this.streamWriter.buffer.size;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfWriter.prototype, \"length\", {\n /**\n * Gets the `length` of the stream'.\n * @private\n */\n get: function () {\n return this.streamWriter.buffer.size;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfWriter.prototype, \"stream\", {\n /**\n * Gets the `stream`.\n * @private\n */\n get: function () {\n var result = this.streamWriter;\n return result;\n },\n enumerable: true,\n configurable: true\n });\n //public Methods\n /**\n * `Writes the specified data`.\n * @private\n */\n PdfWriter.prototype.write = function (overload) {\n var data = [];\n var tempOverload = overload;\n this.streamWriter.write(tempOverload);\n };\n return PdfWriter;\n}());\nexport { PdfWriter };\n","/**\n * public Enum for `CompositeFontType`.\n * @private\n */\nexport var ObjectStatus;\n(function (ObjectStatus) {\n /**\n * Specifies the type of `None`.\n * @private\n */\n ObjectStatus[ObjectStatus[\"None\"] = 0] = \"None\";\n /**\n * Specifies the type of `Registered`.\n * @private\n */\n ObjectStatus[ObjectStatus[\"Registered\"] = 1] = \"Registered\";\n})(ObjectStatus || (ObjectStatus = {}));\n","/**\n * PdfMainObjectCollection.ts class for EJ2-PDF\n */\nimport { Dictionary } from './../collections/dictionary';\nimport { ObjectStatus } from './enum';\n/**\n * The collection of all `objects` within a PDF document.\n * @private\n */\nvar PdfMainObjectCollection = /** @class */ (function () {\n function PdfMainObjectCollection() {\n //Fields\n /**\n * The collection of the `indirect objects`.\n * @default []\n * @private\n */\n this.objectCollections = [];\n /**\n * The collection of the `Indirect objects`.\n * @default new Dictionary()\n * @private\n */\n this.mainObjectCollection = new Dictionary();\n /**\n * The collection of `primitive objects`.\n * @private\n */\n this.primitiveObjectCollection = new Dictionary();\n }\n Object.defineProperty(PdfMainObjectCollection.prototype, \"count\", {\n //Properties\n /**\n * Gets the `count`.\n * @private\n */\n get: function () {\n return this.objectCollections.length;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * Gets the value of `ObjectInfo` from object collection.\n * @private\n */\n PdfMainObjectCollection.prototype.items = function (index) {\n return this.objectCollections[index];\n };\n Object.defineProperty(PdfMainObjectCollection.prototype, \"outIsNew\", {\n //Methods\n /**\n * Specifies the value of `IsNew`.\n * @private\n */\n get: function () {\n return this.isNew;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * `Adds` the specified element.\n * @private\n */\n PdfMainObjectCollection.prototype.add = function (element) {\n var objInfo = new ObjectInfo(element);\n this.objectCollections.push(objInfo);\n if (!this.primitiveObjectCollection.containsKey(element)) {\n this.primitiveObjectCollection.setValue(element, this.objectCollections.length - 1);\n }\n element.position = this.index = this.objectCollections.length - 1;\n element.status = ObjectStatus.Registered;\n };\n /**\n * `Looks` through the collection for the object specified.\n * @private\n */\n PdfMainObjectCollection.prototype.lookFor = function (obj) {\n var index = -1;\n if (obj.position !== -1) {\n return obj.position;\n }\n if (this.primitiveObjectCollection.containsKey(obj) && this.count === this.primitiveObjectCollection.size()) {\n index = this.primitiveObjectCollection.getValue(obj);\n }\n else {\n for (var i = this.count - 1; i >= 0; i--) {\n var oi = this.objectCollections[i];\n if (oi.object === obj) {\n index = i;\n break;\n }\n }\n }\n return index;\n };\n /**\n * Gets the `reference of the object`.\n * @private\n */\n PdfMainObjectCollection.prototype.getReference = function (index, isNew) {\n this.index = this.lookFor(index);\n var reference;\n this.isNew = false;\n var oi = this.objectCollections[this.index];\n reference = oi.reference;\n var obj = { reference: reference, wasNew: isNew };\n return obj;\n };\n /**\n * Tries to set the `reference to the object`.\n * @private\n */\n PdfMainObjectCollection.prototype.trySetReference = function (obj, reference, found) {\n var result = true;\n found = true;\n this.index = this.lookFor(obj);\n var oi = this.objectCollections[this.index];\n oi.setReference(reference);\n return result;\n };\n PdfMainObjectCollection.prototype.destroy = function () {\n for (var _i = 0, _a = this.objectCollections; _i < _a.length; _i++) {\n var obj = _a[_i];\n if (obj !== undefined) {\n obj.pdfObject.position = -1;\n obj.pdfObject.isSaving = undefined;\n obj.pdfObject.objectCollectionIndex = undefined;\n obj.pdfObject.position = undefined;\n }\n }\n this.objectCollections = [];\n this.mainObjectCollection = new Dictionary();\n this.primitiveObjectCollection = new Dictionary();\n };\n return PdfMainObjectCollection;\n}());\nexport { PdfMainObjectCollection };\nvar ObjectInfo = /** @class */ (function () {\n function ObjectInfo(obj, reference) {\n this.pdfObject = obj;\n this.pdfReference = reference;\n }\n Object.defineProperty(ObjectInfo.prototype, \"object\", {\n //Properties\n /**\n * Gets the `object`.\n * @private\n */\n get: function () {\n return this.pdfObject;\n },\n set: function (value) {\n this.pdfObject = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(ObjectInfo.prototype, \"reference\", {\n /**\n * Gets the `reference`.\n * @private\n */\n get: function () {\n return this.pdfReference;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * Sets the `reference`.\n * @private\n */\n ObjectInfo.prototype.setReference = function (reference) {\n this.pdfReference = reference;\n };\n return ObjectInfo;\n}());\nexport { ObjectInfo };\n","import { StreamWriter } from '@syncfusion/ej2-file-utils';\nimport { Encoding } from '@syncfusion/ej2-file-utils';\nimport { PdfDocument } from './pdf-document';\n/**\n * `PdfDocumentBase` class represent common properties of PdfDocument classes.\n * @private\n */\nvar PdfDocumentBase = /** @class */ (function () {\n function PdfDocumentBase(document) {\n /**\n * If the stream is copied, then it specifies true.\n * @private\n */\n this.isStreamCopied = false;\n if (document instanceof PdfDocument) {\n this.document = document;\n }\n }\n Object.defineProperty(PdfDocumentBase.prototype, \"pdfObjects\", {\n //Prpperties\n /**\n * Gets the `PDF objects` collection, which stores all objects and references to it..\n * @private\n */\n get: function () {\n return this.objects;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentBase.prototype, \"crossTable\", {\n /**\n * Gets the `cross-reference` table.\n * @private\n */\n get: function () {\n return this.pdfCrossTable;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentBase.prototype, \"currentSavingObj\", {\n /**\n * Gets or sets the current saving `object number`.\n * @private\n */\n get: function () {\n return this.currentSavingObject;\n },\n set: function (value) {\n this.currentSavingObject = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentBase.prototype, \"catalog\", {\n /**\n * Gets the PDF document `catalog`.\n * @private\n */\n get: function () {\n return this.pdfCatalog;\n },\n set: function (value) {\n this.pdfCatalog = value;\n },\n enumerable: true,\n configurable: true\n });\n //Public methods\n /**\n * Sets the `main object collection`.\n * @private\n */\n PdfDocumentBase.prototype.setMainObjectCollection = function (mainObjectCollection) {\n this.objects = mainObjectCollection;\n };\n /**\n * Sets the `cross table`.\n * @private\n */\n PdfDocumentBase.prototype.setCrossTable = function (cTable) {\n this.pdfCrossTable = cTable;\n };\n /**\n * Sets the `catalog`.\n * @private\n */\n PdfDocumentBase.prototype.setCatalog = function (catalog) {\n this.pdfCatalog = catalog;\n };\n PdfDocumentBase.prototype.save = function (filename) {\n var _this = this;\n var encoding = new Encoding(true);\n var SW = new StreamWriter(encoding);\n if (typeof filename === 'undefined') {\n var encoding_1 = new Encoding(true);\n var SW_1 = new StreamWriter(encoding_1);\n return new Promise(function (resolve, reject) {\n /* tslint:disable-next-line:no-any */\n var obj = {};\n obj.blobData = new Blob([_this.document.docSave(SW_1, true)], { type: 'application/pdf' });\n resolve(obj);\n });\n }\n else {\n this.document.docSave(SW, filename, true);\n }\n };\n /**\n * `Clone` of parent object - PdfDocument.\n * @private\n */\n PdfDocumentBase.prototype.clone = function () {\n return this.document;\n };\n return PdfDocumentBase;\n}());\nexport { PdfDocumentBase };\n","/**\n * public Enum for `ObjectType`.\n * @private\n */\nexport var ObjectType;\n(function (ObjectType) {\n /**\n * Specifies the type of `Free`.\n * @private\n */\n ObjectType[ObjectType[\"Free\"] = 0] = \"Free\";\n /**\n * Specifies the type of `Normal`.\n * @private\n */\n ObjectType[ObjectType[\"Normal\"] = 1] = \"Normal\";\n /**\n * Specifies the type of `Packed`.\n * @private\n */\n ObjectType[ObjectType[\"Packed\"] = 2] = \"Packed\";\n})(ObjectType || (ObjectType = {}));\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * PdfCatalog.ts class for EJ2-PDF\n */\nimport { PdfDictionary } from './../primitives/pdf-dictionary';\nimport { DictionaryProperties } from './../input-output/pdf-dictionary-properties';\nimport { PdfName } from './../primitives/pdf-name';\nimport { PdfReferenceHolder } from './../primitives/pdf-reference';\n/**\n * `PdfCatalog` class represents internal catalog of the Pdf document.\n * @private\n */\nvar PdfCatalog = /** @class */ (function (_super) {\n __extends(PdfCatalog, _super);\n //constructor\n /**\n * Initializes a new instance of the `PdfCatalog` class.\n * @private\n */\n function PdfCatalog() {\n var _this = _super.call(this) || this;\n //fields\n /**\n * Internal variable to store collection of `sections`.\n * @default null\n * @private\n */\n _this.sections = null;\n /**\n * Internal variable for accessing fields from `DictionryProperties` class.\n * @private\n */\n _this.tempDictionaryProperties = new DictionaryProperties();\n _this.items.setValue(new DictionaryProperties().type, new PdfName('Catalog'));\n return _this;\n }\n Object.defineProperty(PdfCatalog.prototype, \"pages\", {\n //Properties\n /**\n * Gets or sets the sections, which contain `pages`.\n * @private\n */\n get: function () {\n return this.sections;\n },\n set: function (value) {\n var dictionary = value.element;\n // if (this.sections !== value) {\n // this.sections = value;\n // this.Items.setValue(this.tempDictionaryProperties.pages, new PdfReferenceHolder(value));\n // }\n this.sections = value;\n this.items.setValue(this.tempDictionaryProperties.pages, new PdfReferenceHolder(value));\n },\n enumerable: true,\n configurable: true\n });\n return PdfCatalog;\n}(PdfDictionary));\nexport { PdfCatalog };\n","import { ObjectStatus } from './../input-output/enum';\nimport { PdfDictionary } from './../primitives/pdf-dictionary';\nimport { DictionaryProperties } from './pdf-dictionary-properties';\nimport { Operators } from './pdf-operators';\nimport { Dictionary } from './../collections/dictionary';\nimport { PdfReference } from './../primitives/pdf-reference';\nimport { ObjectType } from './cross-table';\nimport { PdfStream } from './../primitives/pdf-stream';\nimport { PdfNumber } from './../primitives/pdf-number';\nimport { PdfCatalog } from './../document/pdf-catalog';\n/**\n * `PdfCrossTable` is responsible for intermediate level parsing\n * and savingof a PDF document.\n * @private\n */\nvar PdfCrossTable = /** @class */ (function () {\n function PdfCrossTable() {\n /**\n * The modified `objects` that should be saved.\n * @private\n */\n this.objects = new Dictionary();\n /**\n * Holds `maximal generation number` or offset to object.\n * @default 0\n * @private\n */\n this.maxGenNumIndex = 0;\n /**\n * The `number of the objects`.\n * @default 0\n * @private\n */\n this.objectCount = 0;\n /**\n * Internal variable for accessing fields from `DictionryProperties` class.\n * @default new PdfDictionaryProperties()\n * @private\n */\n this.dictionaryProperties = new DictionaryProperties();\n }\n Object.defineProperty(PdfCrossTable.prototype, \"isMerging\", {\n //Properties\n /**\n * Gets or sets if the document `is merged`.\n * @private\n */\n get: function () {\n return this.merging;\n },\n set: function (value) {\n this.merging = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfCrossTable.prototype, \"trailer\", {\n /**\n * Gets the `trailer`.\n * @private\n */\n get: function () {\n if (this.internalTrailer == null) {\n this.internalTrailer = new PdfStream();\n }\n return this.internalTrailer;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfCrossTable.prototype, \"document\", {\n /**\n * Gets or sets the main `PdfDocument` class instance.\n * @private\n */\n get: function () {\n return this.pdfDocument;\n },\n set: function (value) {\n this.pdfDocument = value;\n this.items = this.pdfDocument.pdfObjects;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfCrossTable.prototype, \"pdfObjects\", {\n /**\n * Gets the catched `PDF object` main collection.\n * @private\n */\n get: function () {\n return this.items;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfCrossTable.prototype, \"objectCollection\", {\n /**\n * Gets the `object collection`.\n * @private\n */\n get: function () {\n return this.pdfDocument.pdfObjects;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfCrossTable.prototype, \"count\", {\n /**\n * Gets or sets the `number of the objects` within the document.\n * @private\n */\n get: function () {\n return this.objectCount;\n },\n set: function (value) {\n this.objectCount = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfCrossTable.prototype, \"nextObjNumber\", {\n /**\n * Returns `next available object number`.\n * @private\n */\n get: function () {\n this.count = this.count + 1;\n return this.count;\n },\n enumerable: true,\n configurable: true\n });\n PdfCrossTable.prototype.save = function (writer, filename) {\n this.saveHead(writer);\n var state = false;\n this.mappedReferences = null;\n this.objects.clear();\n this.markTrailerReferences();\n this.saveObjects(writer);\n var saveCount = this.count;\n var xrefPos = writer.position;\n this.registerObject(0, new PdfReference(0, -1), true);\n var prevXRef = 0;\n writer.write(Operators.xref);\n writer.write(Operators.newLine);\n this.saveSections(writer);\n this.saveTrailer(writer, this.count, prevXRef);\n this.saveTheEndess(writer, xrefPos);\n this.count = saveCount;\n for (var i = 0; i < this.objectCollection.count; ++i) {\n var oi = this.objectCollection.items(i);\n oi.object.isSaving = false;\n }\n if (typeof filename === 'undefined') {\n return writer.stream.buffer;\n }\n else {\n writer.stream.save(filename);\n }\n };\n /**\n * `Saves the endess` of the file.\n * @private\n */\n PdfCrossTable.prototype.saveTheEndess = function (writer, xrefPos) {\n writer.write(Operators.newLine + Operators.startxref + Operators.newLine);\n writer.write(xrefPos.toString() + Operators.newLine);\n writer.write(Operators.eof + Operators.newLine);\n };\n /**\n * `Saves the new trailer` dictionary.\n * @private\n */\n PdfCrossTable.prototype.saveTrailer = function (writer, count, prevXRef) {\n writer.write(Operators.trailer + Operators.newLine);\n // Save the dictionary.\n var trailer = this.trailer;\n trailer.items.setValue(this.dictionaryProperties.size, new PdfNumber(this.objectCount + 1));\n trailer = new PdfDictionary(trailer); // Make it real dictionary.\n trailer.setEncrypt(false);\n trailer.save(writer);\n };\n /**\n * `Saves the xref section`.\n * @private\n */\n PdfCrossTable.prototype.saveSections = function (writer) {\n var objectNum = 0;\n var count = 0;\n do {\n count = this.prepareSubsection(objectNum);\n this.saveSubsection(writer, objectNum, count);\n objectNum += count;\n } while (count !== 0);\n };\n /**\n * `Saves a subsection`.\n * @private\n */\n PdfCrossTable.prototype.saveSubsection = function (writer, objectNum, count) {\n if (count <= 0 || objectNum >= this.count) {\n return;\n }\n var subsectionHead = '{0} {1}{2}';\n writer.write(objectNum + ' ' + (count + 1) + Operators.newLine);\n for (var i = objectNum; i <= objectNum + count; ++i) {\n var obj = this.objects.getValue(i);\n var str = '';\n if (obj.type === ObjectType.Free) {\n str = this.getItem(obj.offset, 65535, true);\n }\n else {\n str = this.getItem(obj.offset, obj.generation, false);\n }\n writer.write(str);\n }\n };\n /**\n * Generates string for `xref table item`.\n * @private\n */\n PdfCrossTable.prototype.getItem = function (offset, genNumber, isFree) {\n var returnString = '';\n var addOffsetLength = 10 - offset.toString().length;\n if (genNumber <= 0) {\n genNumber = 0;\n }\n var addGenNumberLength = (5 - genNumber.toString().length) <= 0 ? 0 : (5 - genNumber.toString().length);\n for (var index = 0; index < addOffsetLength; index++) {\n returnString = returnString + '0';\n }\n returnString = returnString + offset.toString() + ' ';\n for (var index = 0; index < addGenNumberLength; index++) {\n returnString = returnString + '0';\n }\n returnString = returnString + genNumber.toString() + ' ';\n returnString = returnString + ((isFree) ? Operators.f : Operators.n) + Operators.newLine;\n return returnString;\n };\n /**\n * `Prepares a subsection` of the current section within the cross-reference table.\n * @private\n */\n PdfCrossTable.prototype.prepareSubsection = function (objectNum) {\n var count = 0;\n var i;\n var total = this.count;\n for (var k = 0; k < this.document.pdfObjects.count; k++) {\n var reference = this.document.pdfObjects.items(k).reference;\n var refString = reference.toString();\n var refArray = refString.split(' ');\n }\n if (objectNum >= total) {\n return count;\n }\n // search for first changed indirect object.\n for (i = objectNum; i < total; ++i) {\n break;\n }\n objectNum = i;\n // look up for all indirect objects in one subsection.\n for (; i < total; ++i) {\n ++count;\n }\n return count;\n };\n /**\n * `Marks the trailer references` being saved.\n * @private\n */\n PdfCrossTable.prototype.markTrailerReferences = function () {\n var tempArray;\n var keys = this.trailer.items.keys();\n var values = this.trailer.items.values();\n };\n /**\n * `Saves the head`.\n * @private\n */\n PdfCrossTable.prototype.saveHead = function (writer) {\n var version = this.generateFileVersion(writer.document);\n writer.write('%PDF-' + version);\n writer.write(Operators.newLine);\n };\n /**\n * Generates the `version` of the file.\n * @private\n */\n PdfCrossTable.prototype.generateFileVersion = function (document) {\n var iVersion = 4;\n var version = '1.' + iVersion.toString();\n return version;\n };\n PdfCrossTable.prototype.getReference = function (obj, bNew) {\n if (typeof bNew === 'undefined') {\n var wasNew = false;\n return this.getReference(obj, wasNew);\n }\n else {\n //code splitted for reducing lines of code exceeds 100.\n return this.getSubReference(obj, bNew);\n }\n };\n /**\n * Retrieves the `reference` of the object given.\n * @private\n */\n PdfCrossTable.prototype.getSubReference = function (obj, bNew) {\n var isNew = false;\n var wasNew;\n var reference = null;\n // if (obj.IsSaving) {\n if (this.items.count > 0 && obj.objectCollectionIndex > 0 && this.items.count > obj.objectCollectionIndex - 1) {\n var tempObj = this.document.pdfObjects.getReference(obj, wasNew);\n reference = tempObj.reference;\n wasNew = tempObj.wasNew;\n }\n if (reference == null) {\n if (obj.status === ObjectStatus.Registered) {\n wasNew = false;\n }\n else {\n wasNew = true;\n }\n }\n else {\n wasNew = false;\n }\n // need to add mapped reference code\n if (reference == null) {\n var objnumber = this.nextObjNumber;\n reference = new PdfReference(objnumber, 0);\n var found = void 0;\n if (wasNew) {\n this.document.pdfObjects.add(obj);\n this.document.pdfObjects.trySetReference(obj, reference, found);\n var tempIndex = this.document.pdfObjects.count - 1;\n var tempkey = this.document.pdfObjects.objectCollections[tempIndex].reference.objNumber;\n var tempvalue = this.document.pdfObjects.objectCollections[this.document.pdfObjects.count - 1];\n this.document.pdfObjects.mainObjectCollection.setValue(tempkey, tempvalue);\n obj.position = -1;\n }\n else {\n this.document.pdfObjects.trySetReference(obj, reference, found);\n }\n obj.objectCollectionIndex = reference.objNumber;\n obj.status = ObjectStatus.None;\n isNew = true;\n }\n bNew = isNew || this.bForceNew;\n return reference;\n };\n /**\n * `Saves all objects` in the collection.\n * @private\n */\n PdfCrossTable.prototype.saveObjects = function (writer) {\n var objectCollection = this.objectCollection;\n for (var i = 0; i < objectCollection.count; ++i) {\n var oi = objectCollection.items(i);\n var obj = oi.object;\n obj.isSaving = true;\n this.saveIndirectObject(obj, writer);\n }\n };\n /**\n * `Saves indirect object`.\n * @private\n */\n PdfCrossTable.prototype.saveIndirectObject = function (obj, writer) {\n var reference = this.getReference(obj);\n if (obj instanceof PdfCatalog) {\n this.trailer.items.setValue(this.dictionaryProperties.root, reference);\n }\n // NOTE : This is needed for correct string objects encryption.\n this.pdfDocument.currentSavingObj = reference;\n var tempArchive = false;\n tempArchive = obj.getArchive();\n var allowedType = !((obj instanceof PdfStream) || !tempArchive || (obj instanceof PdfCatalog));\n var sigFlag = false;\n this.registerObject(writer.position, reference);\n this.doSaveObject(obj, reference, writer);\n };\n /**\n * Performs `real saving` of the save object.\n * @private\n */\n PdfCrossTable.prototype.doSaveObject = function (obj, reference, writer) {\n var correctPosition = writer.length;\n writer.write(reference.objNumber.toString());\n writer.write(Operators.whiteSpace);\n writer.write(reference.genNumber.toString());\n writer.write(Operators.whiteSpace);\n writer.write(Operators.obj);\n writer.write(Operators.newLine);\n obj.save(writer);\n var stream = writer.stream;\n writer.write(Operators.endObj);\n writer.write(Operators.newLine);\n };\n PdfCrossTable.prototype.registerObject = function (offset, reference, free) {\n if (typeof free === 'boolean') {\n // Register the object by its number.\n this.objects.setValue(reference.objNumber, new RegisteredObject(offset, reference, free));\n this.maxGenNumIndex = Math.max(this.maxGenNumIndex, reference.genNumber);\n }\n else if (typeof free === 'undefined') {\n // Register the object by its number.\n this.objects.setValue(reference.objNumber, new RegisteredObject(offset, reference));\n this.maxGenNumIndex = Math.max(this.maxGenNumIndex, reference.genNumber);\n }\n };\n /**\n * `Dereferences` the specified primitive object.\n * @private\n */\n PdfCrossTable.dereference = function (obj) {\n var rh = obj;\n if (rh != null) {\n obj = rh.object;\n }\n return obj;\n };\n return PdfCrossTable;\n}());\nexport { PdfCrossTable };\nvar RegisteredObject = /** @class */ (function () {\n function RegisteredObject(offset, reference, free) {\n if (typeof free === 'undefined') {\n var tempOffset = offset;\n this.offsetNumber = tempOffset;\n var tempReference = reference;\n this.generation = tempReference.genNumber;\n this.object = tempReference.objNumber;\n this.type = ObjectType.Normal;\n }\n else {\n var tempOffset = offset;\n var tempReference = reference;\n this.constructor(tempOffset, tempReference);\n var tempFree = free;\n this.type = ObjectType.Free;\n }\n }\n Object.defineProperty(RegisteredObject.prototype, \"objectNumber\", {\n //Properties\n /**\n * Gets the `object number`.\n * @private\n */\n get: function () {\n return this.object;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(RegisteredObject.prototype, \"offset\", {\n /**\n * Gets the `offset`.\n * @private\n */\n get: function () {\n var result;\n result = this.offsetNumber;\n return result;\n },\n enumerable: true,\n configurable: true\n });\n return RegisteredObject;\n}());\nexport { RegisteredObject };\n","/**\n * PdfPageSize.ts class for EJ2-PDF\n */\nimport { SizeF } from './../drawing/pdf-drawing';\n/**\n * Represents information about various predefined `page sizes`.\n */\nvar PdfPageSize = /** @class */ (function () {\n //constructor\n /**\n * Initialize an instance for `PdfPageSize` class.\n * @private\n */\n function PdfPageSize() {\n // \n }\n /**\n * Specifies the size of `letter`.\n * @private\n */\n PdfPageSize.letter = new SizeF(612, 792);\n /**\n * Specifies the size of `note`.\n * @private\n */\n PdfPageSize.note = new SizeF(540, 720);\n /**\n * Specifies the size of `legal`.\n * @private\n */\n PdfPageSize.legal = new SizeF(612, 1008);\n /**\n * Specifies the size of `a0`.\n * @private\n */\n PdfPageSize.a0 = new SizeF(2380, 3368);\n /**\n * Specifies the size of `a1`.\n * @private\n */\n PdfPageSize.a1 = new SizeF(1684, 2380);\n /**\n * Specifies the size of `a2`.\n * @private\n */\n PdfPageSize.a2 = new SizeF(1190, 1684);\n /**\n * Specifies the size of `a3`.\n * @private\n */\n PdfPageSize.a3 = new SizeF(842, 1190);\n /**\n * Specifies the size of `a4`.\n * @private\n */\n PdfPageSize.a4 = new SizeF(595, 842);\n /**\n * Specifies the size of `a5`.\n * @private\n */\n PdfPageSize.a5 = new SizeF(421, 595);\n /**\n * Specifies the size of `a6`.\n * @private\n */\n PdfPageSize.a6 = new SizeF(297, 421);\n /**\n * Specifies the size of `a7`.\n * @private\n */\n PdfPageSize.a7 = new SizeF(210, 297);\n /**\n * Specifies the size of `a8`.\n * @private\n */\n PdfPageSize.a8 = new SizeF(148, 210);\n /**\n * Specifies the size of `a9`.\n * @private\n */\n PdfPageSize.a9 = new SizeF(105, 148);\n /**\n * Specifies the size of `a10`.\n * @private\n */\n PdfPageSize.a10 = new SizeF(74, 105);\n /**\n * Specifies the size of `b0`.\n * @private\n */\n PdfPageSize.b0 = new SizeF(2836, 4008);\n /**\n * Specifies the size of `b1`.\n * @private\n */\n PdfPageSize.b1 = new SizeF(2004, 2836);\n /**\n * Specifies the size of `b2`.\n * @private\n */\n PdfPageSize.b2 = new SizeF(1418, 2004);\n /**\n * Specifies the size of `b3`.\n * @private\n */\n PdfPageSize.b3 = new SizeF(1002, 1418);\n /**\n * Specifies the size of `b4`.\n * @private\n */\n PdfPageSize.b4 = new SizeF(709, 1002);\n /**\n * Specifies the size of `b5`.\n * @private\n */\n PdfPageSize.b5 = new SizeF(501, 709);\n /**\n * Specifies the size of `archE`.\n * @private\n */\n PdfPageSize.archE = new SizeF(2592, 3456);\n /**\n * Specifies the size of `archD`.\n * @private\n */\n PdfPageSize.archD = new SizeF(1728, 2592);\n /**\n * Specifies the size of `archC`.\n * @private\n */\n PdfPageSize.archC = new SizeF(1296, 1728);\n /**\n * Specifies the size of `archB`.\n * @private\n */\n PdfPageSize.archB = new SizeF(864, 1296);\n /**\n * Specifies the size of `archA`.\n * @private\n */\n PdfPageSize.archA = new SizeF(648, 864);\n /**\n * Specifies the size of `flsa`.\n * @private\n */\n PdfPageSize.flsa = new SizeF(612, 936);\n /**\n * Specifies the size of `halfLetter`.\n * @private\n */\n PdfPageSize.halfLetter = new SizeF(396, 612);\n /**\n * Specifies the size of `letter11x17`.\n * @private\n */\n PdfPageSize.letter11x17 = new SizeF(792, 1224);\n /**\n * Specifies the size of `ledger`.\n * @private\n */\n PdfPageSize.ledger = new SizeF(1224, 792);\n return PdfPageSize;\n}());\nexport { PdfPageSize };\n","/**\n * public Enum for `PdfPageOrientation`.\n * @private\n */\nexport var PdfPageOrientation;\n(function (PdfPageOrientation) {\n /**\n * Specifies the type of `Portrait`.\n * @private\n */\n PdfPageOrientation[PdfPageOrientation[\"Portrait\"] = 0] = \"Portrait\";\n /**\n * Specifies the type of `Landscape`.\n * @private\n */\n PdfPageOrientation[PdfPageOrientation[\"Landscape\"] = 1] = \"Landscape\";\n})(PdfPageOrientation || (PdfPageOrientation = {}));\n/**\n * public Enum for `PdfPageRotateAngle`.\n * @private\n */\nexport var PdfPageRotateAngle;\n(function (PdfPageRotateAngle) {\n /**\n * Specifies the type of `RotateAngle0`.\n * @private\n */\n PdfPageRotateAngle[PdfPageRotateAngle[\"RotateAngle0\"] = 0] = \"RotateAngle0\";\n /**\n * Specifies the type of `RotateAngle90`.\n * @private\n */\n PdfPageRotateAngle[PdfPageRotateAngle[\"RotateAngle90\"] = 1] = \"RotateAngle90\";\n /**\n * Specifies the type of `RotateAngle180`.\n * @private\n */\n PdfPageRotateAngle[PdfPageRotateAngle[\"RotateAngle180\"] = 2] = \"RotateAngle180\";\n /**\n * Specifies the type of `RotateAngle270`.\n * @private\n */\n PdfPageRotateAngle[PdfPageRotateAngle[\"RotateAngle270\"] = 3] = \"RotateAngle270\";\n})(PdfPageRotateAngle || (PdfPageRotateAngle = {}));\n/**\n * public Enum for `PdfNumberStyle`.\n * @private\n */\nexport var PdfNumberStyle;\n(function (PdfNumberStyle) {\n /**\n * Specifies the type of `None`.\n * @private\n */\n PdfNumberStyle[PdfNumberStyle[\"None\"] = 0] = \"None\";\n /**\n * Specifies the type of `Numeric`.\n * @private\n */\n PdfNumberStyle[PdfNumberStyle[\"Numeric\"] = 1] = \"Numeric\";\n /**\n * Specifies the type of `LowerLatin`.\n * @private\n */\n PdfNumberStyle[PdfNumberStyle[\"LowerLatin\"] = 2] = \"LowerLatin\";\n /**\n * Specifies the type of `LowerRoman`.\n * @private\n */\n PdfNumberStyle[PdfNumberStyle[\"LowerRoman\"] = 3] = \"LowerRoman\";\n /**\n * Specifies the type of `UpperLatin`.\n * @private\n */\n PdfNumberStyle[PdfNumberStyle[\"UpperLatin\"] = 4] = \"UpperLatin\";\n /**\n * Specifies the type of `UpperRoman`.\n * @private\n */\n PdfNumberStyle[PdfNumberStyle[\"UpperRoman\"] = 5] = \"UpperRoman\";\n})(PdfNumberStyle || (PdfNumberStyle = {}));\n/**\n * public Enum for `PdfDockStyle`.\n * @private\n */\nexport var PdfDockStyle;\n(function (PdfDockStyle) {\n /**\n * Specifies the type of `None`.\n * @private\n */\n PdfDockStyle[PdfDockStyle[\"None\"] = 0] = \"None\";\n /**\n * Specifies the type of `Bottom`.\n * @private\n */\n PdfDockStyle[PdfDockStyle[\"Bottom\"] = 1] = \"Bottom\";\n /**\n * Specifies the type of `Top`.\n * @private\n */\n PdfDockStyle[PdfDockStyle[\"Top\"] = 2] = \"Top\";\n /**\n * Specifies the type of `Left`.\n * @private\n */\n PdfDockStyle[PdfDockStyle[\"Left\"] = 3] = \"Left\";\n /**\n * Specifies the type of `Right`.\n * @private\n */\n PdfDockStyle[PdfDockStyle[\"Right\"] = 4] = \"Right\";\n /**\n * Specifies the type of `Fill`.\n * @private\n */\n PdfDockStyle[PdfDockStyle[\"Fill\"] = 5] = \"Fill\";\n})(PdfDockStyle || (PdfDockStyle = {}));\n/**\n * public Enum for `PdfAlignmentStyle`.\n * @private\n */\nexport var PdfAlignmentStyle;\n(function (PdfAlignmentStyle) {\n /**\n * Specifies the type of `None`.\n * @private\n */\n PdfAlignmentStyle[PdfAlignmentStyle[\"None\"] = 0] = \"None\";\n /**\n * Specifies the type of `TopLeft`.\n * @private\n */\n PdfAlignmentStyle[PdfAlignmentStyle[\"TopLeft\"] = 1] = \"TopLeft\";\n /**\n * Specifies the type of `TopCenter`.\n * @private\n */\n PdfAlignmentStyle[PdfAlignmentStyle[\"TopCenter\"] = 2] = \"TopCenter\";\n /**\n * Specifies the type of `TopRight`.\n * @private\n */\n PdfAlignmentStyle[PdfAlignmentStyle[\"TopRight\"] = 3] = \"TopRight\";\n /**\n * Specifies the type of `MiddleLeft`.\n * @private\n */\n PdfAlignmentStyle[PdfAlignmentStyle[\"MiddleLeft\"] = 4] = \"MiddleLeft\";\n /**\n * Specifies the type of `MiddleCenter`.\n * @private\n */\n PdfAlignmentStyle[PdfAlignmentStyle[\"MiddleCenter\"] = 5] = \"MiddleCenter\";\n /**\n * Specifies the type of `MiddleRight`.\n * @private\n */\n PdfAlignmentStyle[PdfAlignmentStyle[\"MiddleRight\"] = 6] = \"MiddleRight\";\n /**\n * Specifies the type of `BottomLeft`.\n * @private\n */\n PdfAlignmentStyle[PdfAlignmentStyle[\"BottomLeft\"] = 7] = \"BottomLeft\";\n /**\n * Specifies the type of `BottomCenter`.\n * @private\n */\n PdfAlignmentStyle[PdfAlignmentStyle[\"BottomCenter\"] = 8] = \"BottomCenter\";\n /**\n * Specifies the type of `BottomRight`.\n * @private\n */\n PdfAlignmentStyle[PdfAlignmentStyle[\"BottomRight\"] = 9] = \"BottomRight\";\n})(PdfAlignmentStyle || (PdfAlignmentStyle = {}));\n/**\n * public Enum for `TemplateType`.\n * @private\n */\nexport var TemplateType;\n(function (TemplateType) {\n /**\n * Specifies the type of `None`.\n * @private\n */\n TemplateType[TemplateType[\"None\"] = 0] = \"None\";\n /**\n * Specifies the type of `Top`.\n * @private\n */\n TemplateType[TemplateType[\"Top\"] = 1] = \"Top\";\n /**\n * Specifies the type of `Bottom`.\n * @private\n */\n TemplateType[TemplateType[\"Bottom\"] = 2] = \"Bottom\";\n /**\n * Specifies the type of `Left`.\n * @private\n */\n TemplateType[TemplateType[\"Left\"] = 3] = \"Left\";\n /**\n * Specifies the type of `Right`.\n * @private\n */\n TemplateType[TemplateType[\"Right\"] = 4] = \"Right\";\n})(TemplateType || (TemplateType = {}));\n","/**\n * PdfMargins.ts class for EJ2-PDF\n * A class representing PDF page margins.\n */\nvar PdfMargins = /** @class */ (function () {\n /**\n * Initializes a new instance of the `PdfMargins` class.\n * @private\n */\n function PdfMargins() {\n /**\n * Represents the `Default Page Margin` value.\n * @default 0.0\n * @private\n */\n this.pdfMargin = 40.0;\n this.setMargins(this.pdfMargin);\n }\n Object.defineProperty(PdfMargins.prototype, \"left\", {\n //Properties\n /**\n * Gets or sets the `left margin` size.\n * @private\n */\n get: function () {\n return this.leftMargin;\n },\n set: function (value) {\n this.leftMargin = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfMargins.prototype, \"top\", {\n /**\n * Gets or sets the `top margin` size.\n * @private\n */\n get: function () {\n return this.topMargin;\n },\n set: function (value) {\n this.topMargin = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfMargins.prototype, \"right\", {\n /**\n * Gets or sets the `right margin` size.\n * @private\n */\n get: function () {\n return this.rightMargin;\n },\n set: function (value) {\n this.rightMargin = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfMargins.prototype, \"bottom\", {\n /**\n * Gets or sets the `bottom margin` size.\n * @private\n */\n get: function () {\n return this.bottomMargin;\n },\n set: function (value) {\n this.bottomMargin = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfMargins.prototype, \"all\", {\n /**\n * Sets the `margins`.\n * @private\n */\n set: function (value) {\n this.setMargins(value);\n },\n enumerable: true,\n configurable: true\n });\n PdfMargins.prototype.setMargins = function (margin1, margin2, margin3, margin4) {\n if (typeof margin2 === 'undefined') {\n this.leftMargin = this.topMargin = this.rightMargin = this.bottomMargin = margin1;\n }\n else {\n if (typeof margin3 === 'undefined') {\n this.leftMargin = this.rightMargin = margin1;\n this.bottomMargin = this.topMargin = margin2;\n }\n else {\n this.leftMargin = margin1;\n this.topMargin = margin2;\n this.rightMargin = margin3;\n this.bottomMargin = margin4;\n }\n }\n };\n /**\n * `Clones` the object.\n * @private\n */\n PdfMargins.prototype.clone = function () {\n return this;\n };\n return PdfMargins;\n}());\nexport { PdfMargins };\n","/**\n * PdfPageSettings.ts class for EJ2-PDF\n */\nimport { SizeF, PointF } from './../drawing/pdf-drawing';\nimport { PdfPageSize } from './pdf-page-size';\nimport { PdfPageRotateAngle, PdfPageOrientation } from './enum';\nimport { PdfMargins } from './../graphics/pdf-margins';\n/**\n * The class provides various `setting` related with PDF pages.\n */\nvar PdfPageSettings = /** @class */ (function () {\n function PdfPageSettings(margins) {\n //Fields\n /**\n * The page `margins`.\n * @private\n */\n this.pageMargins = new PdfMargins();\n /**\n * The page `size`.\n * @default a4\n * @private\n */\n this.pageSize = PdfPageSize.a4;\n /**\n * The page `rotation angle`.\n * @default PdfPageRotateAngle.RotateAngle0\n * @private\n */\n this.rotateAngle = PdfPageRotateAngle.RotateAngle0;\n /**\n * The page `orientation`.\n * @default PdfPageOrientation.Portrait\n * @private\n */\n this.pageOrientation = PdfPageOrientation.Portrait;\n /**\n * The page `origin`.\n * @default 0,0\n * @private\n */\n this.pageOrigin = new PointF(0, 0);\n /**\n * Checks the Whether the `rotation` is applied or not.\n * @default false\n * @private\n */\n this.isRotation = false;\n if (typeof margins === 'number') {\n this.pageMargins.setMargins(margins);\n }\n }\n Object.defineProperty(PdfPageSettings.prototype, \"size\", {\n //Properties\n /**\n * Gets or sets the `size` of the page.\n * @private\n */\n get: function () {\n return this.pageSize;\n },\n set: function (value) {\n this.setSize(value);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageSettings.prototype, \"orientation\", {\n /**\n * Gets or sets the page `orientation`.\n * @private\n */\n get: function () {\n return this.pageOrientation;\n },\n set: function (orientation) {\n if (this.pageOrientation !== orientation) {\n this.pageOrientation = orientation;\n this.updateSize(orientation);\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageSettings.prototype, \"margins\", {\n /**\n * Gets or sets the `margins` of the page.\n * @private\n */\n get: function () {\n return this.pageMargins;\n },\n set: function (value) {\n this.pageMargins = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageSettings.prototype, \"width\", {\n /**\n * Gets or sets the `width` of the page.\n * @private\n */\n get: function () {\n return this.pageSize.width;\n },\n set: function (value) {\n this.pageSize.width = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageSettings.prototype, \"height\", {\n /**\n * Gets or sets the `height` of the page.\n * @private\n */\n get: function () {\n return this.pageSize.height;\n },\n set: function (value) {\n this.pageSize.height = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageSettings.prototype, \"origin\", {\n /**\n * Gets or sets the `origin` of the page.\n * @private\n */\n get: function () {\n return this.pageOrigin;\n },\n set: function (value) {\n this.pageOrigin = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageSettings.prototype, \"rotate\", {\n /**\n * Gets or sets the number of degrees by which the page should be `rotated` clockwise when displayed or printed.\n * @private\n */\n get: function () {\n return this.rotateAngle;\n },\n set: function (value) {\n this.rotateAngle = value;\n this.isRotation = true;\n },\n enumerable: true,\n configurable: true\n });\n //Methods\n /**\n * `Update page size` depending on orientation.\n * @private\n */\n PdfPageSettings.prototype.updateSize = function (orientation) {\n var min = Math.min(this.pageSize.width, this.pageSize.height);\n var max = Math.max(this.pageSize.width, this.pageSize.height);\n switch (orientation) {\n case PdfPageOrientation.Portrait:\n this.pageSize = new SizeF(min, max);\n break;\n case PdfPageOrientation.Landscape:\n this.pageSize = new SizeF(max, min);\n break;\n }\n };\n /**\n * Creates a `clone` of the object.\n * @private\n */\n PdfPageSettings.prototype.clone = function () {\n var settings = this;\n settings.pageMargins = this.pageMargins.clone();\n // if (GetTransition() != null)\n // {\n // settings.Transition = (PdfPageTransition)Transition.clone();\n // }\n return settings;\n };\n /**\n * Returns `size`, shrinked by the margins.\n * @private\n */\n PdfPageSettings.prototype.getActualSize = function () {\n var width = this.width - (this.margins.left + this.margins.right);\n var height = this.height - (this.margins.top + this.margins.bottom);\n var size = new SizeF(width, height);\n return size;\n };\n /**\n * Sets `size` to the page aaccording to the orientation.\n * @private\n */\n PdfPageSettings.prototype.setSize = function (size) {\n var min = Math.min(size.width, size.height);\n var max = Math.max(size.width, size.height);\n if (this.orientation === PdfPageOrientation.Portrait) {\n this.pageSize = new SizeF(min, max);\n }\n else {\n this.pageSize = new SizeF(max, min);\n }\n };\n return PdfPageSettings;\n}());\nexport { PdfPageSettings };\n","import { Operators } from './pdf-operators';\nimport { PdfNumber } from './../primitives/pdf-number';\nimport { PointF, RectangleF } from './../drawing/pdf-drawing';\nimport { PdfString } from './../primitives/pdf-string';\nimport { PdfName } from './../primitives/pdf-name';\n/**\n * Helper class to `write PDF graphic streams` easily.\n * @private\n */\nvar PdfStreamWriter = /** @class */ (function () {\n /**\n * Initialize an instance of `PdfStreamWriter` class.\n * @private\n */\n function PdfStreamWriter(stream) {\n if (stream == null) {\n throw new Error('ArgumentNullException:stream');\n }\n this.stream = stream;\n }\n //Implementation\n /**\n * `Clear` the stream.\n * @public\n */\n PdfStreamWriter.prototype.clear = function () {\n this.stream.clearStream();\n };\n PdfStreamWriter.prototype.setGraphicsState = function (dictionaryName) {\n if (dictionaryName instanceof PdfName) {\n this.stream.write(dictionaryName.toString());\n this.stream.write(Operators.whiteSpace);\n this.writeOperator(Operators.setGraphicsState);\n }\n else {\n this.stream.write(Operators.slash);\n this.stream.write(dictionaryName);\n this.stream.write(Operators.whiteSpace);\n this.writeOperator(Operators.setGraphicsState);\n }\n };\n /**\n * `Executes the XObject`.\n * @private\n */\n PdfStreamWriter.prototype.executeObject = function (name) {\n this.stream.write(name.toString());\n this.stream.write(Operators.whiteSpace);\n this.writeOperator(Operators.paintXObject);\n this.stream.write(Operators.newLine);\n };\n /**\n * `Closes path object`.\n * @private\n */\n PdfStreamWriter.prototype.closePath = function () {\n this.writeOperator(Operators.closePath);\n };\n /**\n * `Clips the path`.\n * @private\n */\n PdfStreamWriter.prototype.clipPath = function (useEvenOddRule) {\n this.stream.write(Operators.clipPath);\n if (useEvenOddRule) {\n this.stream.write(Operators.evenOdd);\n }\n this.stream.write(Operators.whiteSpace);\n this.stream.write(Operators.endPath);\n this.stream.write(Operators.newLine);\n };\n /**\n * `Closes, then fills and strokes the path`.\n * @private\n */\n PdfStreamWriter.prototype.closeFillStrokePath = function (useEvenOddRule) {\n this.stream.write(Operators.closeFillStrokePath);\n if (useEvenOddRule) {\n this.stream.write(Operators.evenOdd);\n this.stream.write(Operators.newLine);\n }\n else {\n this.stream.write(Operators.newLine);\n }\n };\n /**\n * `Fills and strokes path`.\n * @private\n */\n PdfStreamWriter.prototype.fillStrokePath = function (useEvenOddRule) {\n this.stream.write(Operators.fillStroke);\n if (useEvenOddRule) {\n this.stream.write(Operators.evenOdd);\n this.stream.write(Operators.newLine);\n }\n else {\n this.stream.write(Operators.newLine);\n }\n };\n /**\n * `Fills path`.\n * @private\n */\n PdfStreamWriter.prototype.fillPath = function (useEvenOddRule) {\n this.stream.write(Operators.fill);\n if (useEvenOddRule) {\n this.stream.write(Operators.evenOdd);\n this.stream.write(Operators.newLine);\n }\n else {\n this.stream.write(Operators.newLine);\n }\n };\n /**\n * `Ends the path`.\n * @private\n */\n PdfStreamWriter.prototype.endPath = function () {\n this.writeOperator(Operators.n);\n };\n /**\n * `Closes and fills the path`.\n * @private\n */\n PdfStreamWriter.prototype.closeFillPath = function (useEvenOddRule) {\n this.writeOperator(Operators.closePath);\n this.stream.write(Operators.fill);\n if (useEvenOddRule) {\n this.stream.write(Operators.evenOdd);\n this.stream.write(Operators.newLine);\n }\n else {\n this.stream.write(Operators.newLine);\n }\n };\n /**\n * `Closes and strokes the path`.\n * @private\n */\n PdfStreamWriter.prototype.closeStrokePath = function () {\n this.writeOperator(Operators.closeStrokePath);\n };\n /**\n * `Sets the text scaling`.\n * @private\n */\n PdfStreamWriter.prototype.setTextScaling = function (textScaling) {\n this.stream.write(PdfNumber.floatToString(textScaling));\n this.stream.write(Operators.whiteSpace);\n this.writeOperator(Operators.setTextScaling);\n };\n /**\n * `Strokes path`.\n * @private\n */\n PdfStreamWriter.prototype.strokePath = function () {\n this.writeOperator(Operators.stroke);\n };\n /**\n * `Restores` the graphics state.\n * @private\n */\n PdfStreamWriter.prototype.restoreGraphicsState = function () {\n this.writeOperator(Operators.restoreState);\n };\n /**\n * `Saves` the graphics state.\n * @private\n */\n PdfStreamWriter.prototype.saveGraphicsState = function () {\n this.writeOperator(Operators.saveState);\n };\n PdfStreamWriter.prototype.startNextLine = function (arg1, arg2) {\n if (typeof arg1 === 'undefined') {\n this.writeOperator(Operators.goToNextLine);\n }\n else if (arg1 instanceof PointF) {\n this.writePoint(arg1);\n this.writeOperator(Operators.setCoords);\n }\n else {\n this.writePoint(arg1, arg2);\n this.writeOperator(Operators.setCoords);\n }\n };\n /**\n * Shows the `text`.\n * @private\n */\n PdfStreamWriter.prototype.showText = function (text) {\n this.checkTextParam(text);\n this.writeText(text);\n this.writeOperator(Operators.setText);\n };\n /**\n * Sets `text leading`.\n * @private\n */\n PdfStreamWriter.prototype.setLeading = function (leading) {\n this.stream.write(PdfNumber.floatToString(leading));\n this.stream.write(Operators.whiteSpace);\n this.writeOperator(Operators.setTextLeading);\n };\n /**\n * `Begins the path`.\n * @private\n */\n PdfStreamWriter.prototype.beginPath = function (x, y) {\n this.writePoint(x, y);\n this.writeOperator(Operators.beginPath);\n };\n /**\n * `Begins text`.\n * @private\n */\n PdfStreamWriter.prototype.beginText = function () {\n this.writeOperator(Operators.beginText);\n };\n /**\n * `Ends text`.\n * @private\n */\n PdfStreamWriter.prototype.endText = function () {\n this.writeOperator(Operators.endText);\n };\n PdfStreamWriter.prototype.appendRectangle = function (arg1, arg2, arg3, arg4) {\n if (arg1 instanceof RectangleF) {\n this.appendRectangle(arg1.x, arg1.y, arg1.width, arg1.height);\n }\n else {\n this.writePoint(arg1, arg2);\n this.writePoint(arg3, arg4);\n this.writeOperator(Operators.appendRectangle);\n }\n };\n PdfStreamWriter.prototype.appendLineSegment = function (arg1, arg2) {\n if (arg1 instanceof PointF) {\n this.appendLineSegment(arg1.x, arg1.y);\n }\n else {\n this.writePoint(arg1, arg2);\n this.writeOperator(Operators.appendLineSegment);\n }\n };\n /**\n * Sets the `text rendering mode`.\n * @private\n */\n PdfStreamWriter.prototype.setTextRenderingMode = function (renderingMode) {\n this.stream.write(renderingMode.toString());\n this.stream.write(Operators.whiteSpace);\n this.writeOperator(Operators.setRenderingMode);\n };\n /**\n * Sets the `character spacing`.\n * @private\n */\n PdfStreamWriter.prototype.setCharacterSpacing = function (charSpacing) {\n this.stream.write(PdfNumber.floatToString(charSpacing));\n this.stream.write(Operators.whiteSpace);\n this.stream.write(Operators.setCharacterSpace);\n this.stream.write(Operators.newLine);\n };\n /**\n * Sets the `word spacing`.\n * @private\n */\n PdfStreamWriter.prototype.setWordSpacing = function (wordSpacing) {\n this.stream.write(PdfNumber.floatToString(wordSpacing));\n this.stream.write(Operators.whiteSpace);\n this.writeOperator(Operators.setWordSpace);\n };\n PdfStreamWriter.prototype.showNextLineText = function (arg1, arg2) {\n if (arg1 instanceof PdfString) {\n this.checkTextParam(arg1);\n this.writeText(arg1);\n this.writeOperator(Operators.setTextOnNewLine);\n }\n else {\n this.checkTextParam(arg1);\n this.writeText(arg1, arg2);\n this.writeOperator(Operators.setTextOnNewLine);\n }\n };\n PdfStreamWriter.prototype.setColorSpace = function (arg1, arg2) {\n if (arg1 instanceof PdfName && typeof arg2 === 'boolean') {\n var temparg1 = arg1;\n var temparg2 = arg2;\n // if (temparg1 == null) {\n // throw new Error('ArgumentNullException:name');\n // }\n var op = (temparg2) ? Operators.selectcolorspaceforstroking : Operators.selectcolorspacefornonstroking;\n this.stream.write(temparg1.toString());\n this.stream.write(Operators.whiteSpace);\n this.stream.write(op);\n this.stream.write(Operators.newLine);\n }\n else {\n var temparg1 = arg1;\n var temparg2 = arg2;\n this.setColorSpace(new PdfName(temparg1), temparg2);\n }\n };\n /**\n * Modifies current `transformation matrix`.\n * @private\n */\n PdfStreamWriter.prototype.modifyCtm = function (matrix) {\n if (matrix == null) {\n throw new Error('ArgumentNullException:matrix');\n }\n this.stream.write(matrix.toString());\n this.stream.write(Operators.whiteSpace);\n this.writeOperator(Operators.modifyCtm);\n };\n PdfStreamWriter.prototype.setFont = function (font, name, size) {\n if (typeof name === 'string') {\n this.setFont(font, new PdfName(name), size);\n }\n else {\n if (font == null) {\n throw new Error('ArgumentNullException:font');\n }\n this.stream.write(name.toString());\n this.stream.write(Operators.whiteSpace);\n this.stream.write(PdfNumber.floatToString(size));\n this.stream.write(Operators.whiteSpace);\n this.writeOperator(Operators.setFont);\n }\n };\n /**\n * `Writes the operator`.\n * @private\n */\n PdfStreamWriter.prototype.writeOperator = function (opcode) {\n this.stream.write(opcode);\n this.stream.write(Operators.newLine);\n };\n PdfStreamWriter.prototype.checkTextParam = function (text) {\n if (text == null) {\n throw new Error('ArgumentNullException:text');\n }\n if (typeof text === 'string' && text === '') {\n throw new Error('ArgumentException:The text can not be an empty string, text');\n }\n };\n PdfStreamWriter.prototype.writeText = function (arg1, arg2) {\n if ((arg1 instanceof PdfString) && (typeof arg2 === 'undefined')) {\n this.stream.write(arg1.pdfEncode());\n }\n else {\n var start = void 0;\n var end = void 0;\n if (arg2) {\n start = PdfString.hexStringMark[0];\n end = PdfString.hexStringMark[1];\n }\n else {\n start = PdfString.stringMark[0];\n end = PdfString.stringMark[1];\n }\n this.stream.write(start);\n this.stream.write(arg1);\n this.stream.write(end);\n }\n };\n PdfStreamWriter.prototype.writePoint = function (arg1, arg2) {\n if ((arg1 instanceof PointF) && (typeof arg2 === 'undefined')) {\n this.writePoint(arg1.x, arg1.y);\n }\n else {\n var temparg1 = arg1;\n this.stream.write(PdfNumber.floatToString(temparg1));\n this.stream.write(Operators.whiteSpace);\n // NOTE: Change Y co-ordinate because we shifted co-ordinate system only.\n arg2 = this.updateY(arg2);\n this.stream.write(PdfNumber.floatToString(arg2));\n this.stream.write(Operators.whiteSpace);\n }\n };\n /**\n * `Updates y` co-ordinate.\n * @private\n */\n PdfStreamWriter.prototype.updateY = function (arg) {\n return -arg;\n };\n /**\n * `Writes string` to the file.\n * @private\n */\n PdfStreamWriter.prototype.write = function (string) {\n var builder = '';\n builder += string;\n builder += Operators.newLine;\n this.writeOperator(builder);\n };\n /**\n * `Writes comment` to the file.\n * @private\n */\n PdfStreamWriter.prototype.writeComment = function (comment) {\n if (comment != null && comment.length > 0) {\n var builder = '';\n builder += Operators.comment;\n builder += Operators.whiteSpace;\n builder += comment;\n //builder.Append( Operators.NewLine );\n this.writeOperator(builder);\n }\n else {\n throw new Error('Invalid comment');\n }\n };\n /**\n * Sets the `color and space`.\n * @private\n */\n PdfStreamWriter.prototype.setColorAndSpace = function (color, colorSpace, forStroking) {\n if (!color.isEmpty) {\n // bool test = color is PdfExtendedColor;\n this.stream.write(color.toString(colorSpace, forStroking));\n this.stream.write(Operators.newLine);\n }\n };\n // public setLineDashPattern(pattern : number[], patternOffset : number) : void\n // {\n // let pat : PdfArray = new PdfArray(pattern);\n // let off : PdfNumber = new PdfNumber(patternOffset);\n // this.setLineDashPatternHelper(pat, off);\n // }\n // private setLineDashPatternHelper(pattern : PdfArray, patternOffset : PdfNumber) : void\n // {\n // pattern.Save(this);\n // this.m_stream.write(Operators.whiteSpace);\n // patternOffset.Save(this);\n // this.m_stream.write(Operators.whiteSpace);\n // this.writeOperator(Operators.setDashPattern);\n // }\n /**\n * Sets the `line dash pattern`.\n * @private\n */\n PdfStreamWriter.prototype.setLineDashPattern = function (pattern, patternOffset) {\n // let pat : PdfArray = new PdfArray(pattern);\n // let off : PdfNumber = new PdfNumber(patternOffset);\n // this.setLineDashPatternHelper(pat, off);\n this.setLineDashPatternHelper(pattern, patternOffset);\n };\n /**\n * Sets the `line dash pattern`.\n * @private\n */\n PdfStreamWriter.prototype.setLineDashPatternHelper = function (pattern, patternOffset) {\n var tempPattern = '[';\n if (pattern.length > 1) {\n for (var index = 0; index < pattern.length; index++) {\n if (index === pattern.length - 1) {\n tempPattern += pattern[index].toString();\n }\n else {\n tempPattern += pattern[index].toString() + ' ';\n }\n }\n }\n tempPattern += '] ';\n tempPattern += patternOffset.toString();\n tempPattern += ' ' + Operators.setDashPattern;\n this.stream.write(tempPattern);\n this.stream.write(Operators.newLine);\n };\n /**\n * Sets the `miter limit`.\n * @private\n */\n PdfStreamWriter.prototype.setMiterLimit = function (miterLimit) {\n this.stream.write(PdfNumber.floatToString(miterLimit));\n this.stream.write(Operators.whiteSpace);\n this.writeOperator(Operators.setMiterLimit);\n };\n /**\n * Sets the `width of the line`.\n * @private\n */\n PdfStreamWriter.prototype.setLineWidth = function (width) {\n this.stream.write(PdfNumber.floatToString(width));\n this.stream.write(Operators.whiteSpace);\n this.writeOperator(Operators.setLineWidth);\n };\n /**\n * Sets the `line cap`.\n * @private\n */\n PdfStreamWriter.prototype.setLineCap = function (lineCapStyle) {\n this.stream.write((lineCapStyle).toString());\n this.stream.write(Operators.whiteSpace);\n this.writeOperator(Operators.setLineCapStyle);\n };\n /**\n * Sets the `line join`.\n * @private\n */\n PdfStreamWriter.prototype.setLineJoin = function (lineJoinStyle) {\n this.stream.write((lineJoinStyle).toString());\n this.stream.write(Operators.whiteSpace);\n this.writeOperator(Operators.setLineJoinStyle);\n };\n Object.defineProperty(PdfStreamWriter.prototype, \"position\", {\n //IPdfWriter members\n /**\n * Gets or sets the current `position` within the stream.\n * @private\n */\n get: function () {\n return this.stream.position;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStreamWriter.prototype, \"length\", {\n /**\n * Gets `stream length`.\n * @private\n */\n get: function () {\n var returnValue = 0;\n if (this.stream.data.length !== 0 && this.stream.data.length !== -1) {\n for (var index = 0; index < this.stream.data.length; index++) {\n returnValue += this.stream.data[index].length;\n }\n }\n return returnValue;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfStreamWriter.prototype, \"document\", {\n /**\n * Gets and Sets the `current document`.\n * @private\n */\n get: function () {\n return null;\n },\n enumerable: true,\n configurable: true\n });\n return PdfStreamWriter;\n}());\nexport { PdfStreamWriter };\n","/**\n * PdfPen.ts class for EJ2-PDF\n */\nimport { PdfColor } from './pdf-color';\nimport { PdfDashStyle, PdfColorSpace } from './enum';\nimport { PdfBrush } from './brushes/pdf-brush';\n/**\n * `PdfPen` class defining settings for drawing operations, that determines the color,\n * width, and style of the drawing elements.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // create a new page\n * let page1 : PdfPage = document.pages.add();\n * // set pen\n * let pen : PdfPen = new PdfPen(new PdfColor(0, 0, 0));\n * // draw rectangle\n * page1.graphics.drawRectangle(pen, new RectangleF({x : 0, y : 0}, {width : 100, height : 50}));\n * // save the document.\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\nvar PdfPen = /** @class */ (function () {\n function PdfPen(arg1, arg2) {\n //Fields\n /**\n * Specifies the `color of the pen`.\n * @default new PdfColor()\n * @private\n */\n this.pdfColor = new PdfColor(0, 0, 0);\n /**\n * Specifies the `dash offset of the pen`.\n * @default 0\n * @private\n */\n this.dashOffsetValue = 0;\n /**\n * Specifies the `dash pattern of the pen`.\n * @default [0]\n * @private\n */\n this.penDashPattern = [0];\n /**\n * Specifies the `dash style of the pen`.\n * @default Solid\n * @private\n */\n this.pdfDashStyle = PdfDashStyle.Solid;\n /**\n * Specifies the `line cap of the pen`.\n * @default 0\n * @private\n */\n this.pdfLineCap = 0;\n /**\n * Specifies the `line join of the pen`.\n * @default 0\n * @private\n */\n this.pdfLineJoin = 0;\n /**\n * Specifies the `width of the pen`.\n * @default 1.0\n * @private\n */\n this.penWidth = 1.0;\n /**\n * Specifies the `mitter limit of the pen`.\n * @default 0.0\n * @private\n */\n this.internalMiterLimit = 0.0;\n /**\n * Stores the `colorspace` value.\n * @default Rgb\n * @private\n */\n this.colorSpace = PdfColorSpace.Rgb;\n if (typeof arg2 === 'number') {\n this.constructor(arg1);\n this.width = arg2;\n }\n else if (typeof arg2 === 'undefined' && arg1 instanceof PdfBrush) {\n this.setBrush(arg1);\n }\n else if (typeof arg2 === 'undefined' && arg1 instanceof PdfColor) {\n this.color = arg1;\n }\n }\n Object.defineProperty(PdfPen.prototype, \"color\", {\n //Properties\n /**\n * Gets or sets the `color of the pen`.\n * @private\n */\n get: function () {\n return this.pdfColor;\n },\n set: function (value) {\n this.pdfColor = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPen.prototype, \"dashOffset\", {\n /**\n * Gets or sets the `dash offset of the pen`.\n * @private\n */\n get: function () {\n if (typeof this.dashOffsetValue === 'undefined' || this.dashOffsetValue == null) {\n return 0;\n }\n else {\n return this.dashOffsetValue;\n }\n },\n set: function (value) {\n this.dashOffsetValue = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPen.prototype, \"dashPattern\", {\n /**\n * Gets or sets the `dash pattern of the pen`.\n * @private\n */\n get: function () {\n return this.penDashPattern;\n },\n set: function (value) {\n this.penDashPattern = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPen.prototype, \"dashStyle\", {\n /**\n * Gets or sets the `dash style of the pen`.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // create a new page\n * let page1 : PdfPage = document.pages.add();\n * // set pen\n * let pen : PdfPen = new PdfPen(new PdfColor(0, 0, 0));\n * //\n * // set pen style\n * pen.dashStyle = PdfDashStyle.DashDot;\n * // get pen style\n * let style : PdfDashStyle = pen.dashStyle;\n * //\n * // draw rectangle\n * page1.graphics.drawRectangle(pen, new RectangleF({x : 0, y : 0}, {width : 100, height : 50}));\n * // save the document.\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n get: function () {\n return this.pdfDashStyle;\n },\n set: function (value) {\n if (this.pdfDashStyle !== value) {\n this.pdfDashStyle = value;\n switch (this.pdfDashStyle) {\n case PdfDashStyle.Custom:\n break;\n case PdfDashStyle.Dash:\n this.penDashPattern = [3, 1];\n break;\n case PdfDashStyle.Dot:\n this.penDashPattern = [1, 1];\n break;\n case PdfDashStyle.DashDot:\n this.penDashPattern = [3, 1, 1, 1];\n break;\n case PdfDashStyle.DashDotDot:\n this.penDashPattern = [3, 1, 1, 1, 1, 1];\n break;\n case PdfDashStyle.Solid:\n break;\n default:\n this.pdfDashStyle = PdfDashStyle.Solid;\n this.penDashPattern = [0];\n break;\n }\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPen.prototype, \"lineCap\", {\n /**\n * Gets or sets the `line cap of the pen`.\n * @private\n */\n get: function () {\n return this.pdfLineCap;\n },\n set: function (value) {\n this.pdfLineCap = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPen.prototype, \"lineJoin\", {\n /**\n * Gets or sets the `line join style of the pen`.\n * @private\n */\n get: function () {\n return this.pdfLineJoin;\n },\n set: function (value) {\n this.pdfLineJoin = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPen.prototype, \"miterLimit\", {\n /**\n * Gets or sets the `miter limit`.\n * @private\n */\n get: function () {\n return this.internalMiterLimit;\n },\n set: function (value) {\n this.internalMiterLimit = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPen.prototype, \"width\", {\n /**\n * Gets or sets the `width of the pen`.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // create a new page\n * let page1 : PdfPage = document.pages.add();\n * // set pen\n * let pen : PdfPen = new PdfPen(new PdfColor(0, 0, 0));\n * //\n * // set pen width\n * pen.width = 2;\n * //\n * // draw rectangle\n * page1.graphics.drawRectangle(pen, new RectangleF({x : 0, y : 0}, {width : 100, height : 50}));\n * // save the document.\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n get: function () {\n return this.penWidth;\n },\n set: function (value) {\n this.penWidth = value;\n },\n enumerable: true,\n configurable: true\n });\n //Helper\n /**\n * `Clones` this instance of PdfPen class.\n * @private\n */\n PdfPen.prototype.clone = function () {\n var pen = this;\n return pen;\n };\n /**\n * `Sets the brush`.\n * @private\n */\n PdfPen.prototype.setBrush = function (brush) {\n var sBrush = brush;\n this.color = sBrush.color;\n this.pdfBrush = sBrush;\n };\n /**\n * `Monitors the changes`.\n * @private\n */\n PdfPen.prototype.monitorChanges = function (currentPen, streamWriter, getResources, saveState, currentColorSpace, matrix) {\n var diff = false;\n saveState = true;\n if (currentPen == null) {\n diff = true;\n }\n diff = this.dashControl(currentPen, saveState, streamWriter);\n streamWriter.setLineWidth(this.width);\n streamWriter.setLineJoin(this.lineJoin);\n streamWriter.setLineCap(this.lineCap);\n var miterLimit = this.miterLimit;\n if (miterLimit > 0) {\n streamWriter.setMiterLimit(miterLimit);\n diff = true;\n }\n var brush = this.pdfBrush;\n streamWriter.setColorAndSpace(this.color, currentColorSpace, true);\n diff = true;\n return diff;\n };\n /**\n * `Controls the dash style` and behaviour of each line.\n * @private\n */\n PdfPen.prototype.dashControl = function (pen, saveState, streamWriter) {\n saveState = true;\n var lineWidth = this.width;\n var pattern = this.getPattern();\n streamWriter.setLineDashPattern(pattern, this.dashOffset * lineWidth);\n return saveState;\n };\n /**\n * `Gets the pattern` of PdfPen.\n * @private\n */\n PdfPen.prototype.getPattern = function () {\n var pattern = this.dashPattern;\n for (var i = 0; i < pattern.length; ++i) {\n pattern[i] *= this.width;\n }\n return pattern;\n };\n return PdfPen;\n}());\nexport { PdfPen };\n","/**\n * PdfTransformationMatrix.ts class for EJ2-PDF\n */\nimport { PointF } from './../drawing/pdf-drawing';\nimport { PdfNumber } from './../primitives/pdf-number';\n/**\n * Class for representing Root `transformation matrix`.\n */\nvar PdfTransformationMatrix = /** @class */ (function () {\n function PdfTransformationMatrix(value) {\n /**\n * Value for `angle converting`.\n * @default 180.0 / Math.PI\n * @private\n */\n this.radDegFactor = 180.0 / Math.PI;\n if (typeof value === 'undefined') {\n this.transformationMatrix = new Matrix(1.00, 0.00, 0.00, 1.00, 0.00, 0.00);\n }\n else {\n this.transformationMatrix = new Matrix(1.00, 0.00, 0.00, -1.00, 0.00, 0.00);\n }\n }\n Object.defineProperty(PdfTransformationMatrix.prototype, \"matrix\", {\n // Properties\n /**\n * Gets or sets the `internal matrix object`.\n * @private\n */\n get: function () {\n return this.transformationMatrix;\n },\n set: function (value) {\n this.transformationMatrix = value;\n },\n enumerable: true,\n configurable: true\n });\n // Public methods\n /**\n * `Translates` coordinates by specified coordinates.\n * @private\n */\n PdfTransformationMatrix.prototype.translate = function (offsetX, offsetY) {\n this.transformationMatrix.translate(offsetX, offsetY);\n };\n /**\n * `Scales` coordinates by specified coordinates.\n * @private\n */\n PdfTransformationMatrix.prototype.scale = function (scaleX, scaleY) {\n this.transformationMatrix.elements[0] = scaleX;\n this.transformationMatrix.elements[3] = scaleY;\n };\n /**\n * `Rotates` coordinate system in counterclockwise direction.\n * @private\n */\n PdfTransformationMatrix.prototype.rotate = function (angle) {\n //Convert from degree to radian \n angle = (angle * Math.PI) / 180;\n //Rotation \n this.transformationMatrix.elements[0] = Math.cos(angle);\n this.transformationMatrix.elements[1] = Math.sin(angle);\n this.transformationMatrix.elements[2] = -Math.sin(angle);\n this.transformationMatrix.elements[3] = Math.cos(angle);\n };\n // Overrides\n /**\n * Gets `PDF representation`.\n * @private\n */\n PdfTransformationMatrix.prototype.toString = function () {\n var builder = '';\n var whitespace = ' ';\n for (var i = 0, len = this.transformationMatrix.elements.length; i < len; i++) {\n var temp = this.matrix.elements[i];\n builder += PdfNumber.floatToString(this.transformationMatrix.elements[i]);\n builder += whitespace;\n }\n return builder;\n };\n // Implementation\n /**\n * `Multiplies` matrices (changes coordinate system.)\n * @private\n */\n PdfTransformationMatrix.prototype.multiply = function (matrix) {\n this.transformationMatrix.multiply(matrix.matrix);\n };\n /**\n * Converts `degrees to radians`.\n * @private\n */\n PdfTransformationMatrix.degreesToRadians = function (degreesX) {\n return this.degRadFactor * degreesX;\n };\n /**\n * Converts `radians to degrees`.\n * @private\n */\n PdfTransformationMatrix.prototype.radiansToDegrees = function (radians) {\n return this.radDegFactor * radians;\n };\n /**\n * `Clones` this instance of PdfTransformationMatrix.\n * @private\n */\n PdfTransformationMatrix.prototype.clone = function () {\n return this;\n };\n // Constants\n /**\n * Value for `angle converting`.\n * @default Math.PI / 180.0\n * @private\n */\n PdfTransformationMatrix.degRadFactor = Math.PI / 180.0;\n return PdfTransformationMatrix;\n}());\nexport { PdfTransformationMatrix };\nvar Matrix = /** @class */ (function () {\n function Matrix(arg1, arg2, arg3, arg4, arg5, arg6) {\n if (typeof arg1 === 'undefined') {\n this.metrixElements = [];\n }\n else if (typeof arg1 === 'number') {\n this.constructor();\n this.metrixElements.push(arg1);\n this.metrixElements.push(arg2);\n this.metrixElements.push(arg3);\n this.metrixElements.push(arg4);\n this.metrixElements.push(arg5);\n this.metrixElements.push(arg6);\n }\n else {\n this.metrixElements = arg1;\n }\n }\n Object.defineProperty(Matrix.prototype, \"elements\", {\n // Properties\n /**\n * Gets the `elements`.\n * @private\n */\n get: function () {\n return this.metrixElements;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Matrix.prototype, \"offsetX\", {\n /**\n * Gets the off set `X`.\n * @private\n */\n get: function () {\n return this.metrixElements[4];\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Matrix.prototype, \"offsetY\", {\n /**\n * Gets the off set `Y`.\n * @private\n */\n get: function () {\n return this.metrixElements[5];\n },\n enumerable: true,\n configurable: true\n });\n // Implementation\n /**\n * `Translates` coordinates by specified coordinates.\n * @private\n */\n Matrix.prototype.translate = function (offsetX, offsetY) {\n this.metrixElements[4] = offsetX;\n this.metrixElements[5] = offsetY;\n };\n /**\n * `Translates` the specified offset X.\n * @private\n */\n Matrix.prototype.transform = function (point) {\n var x = point.x;\n var y = point.y;\n var x2 = x * this.elements[0] + y * this.elements[2] + this.offsetX;\n var y2 = x * this.elements[1] + y * this.elements[3] + this.offsetY;\n return new PointF(x2, y2);\n };\n /**\n * `Multiplies matrices` (changes coordinate system.)\n * @private\n */\n Matrix.prototype.multiply = function (matrix) {\n var tempMatrix = [];\n tempMatrix.push(this.elements[0] * matrix.elements[0] + this.elements[1] * matrix.elements[2]);\n tempMatrix[1] = (this.elements[0] * matrix.elements[1] + this.elements[1] * matrix.elements[3]);\n tempMatrix[2] = (this.elements[2] * matrix.elements[0] + this.elements[3] * matrix.elements[2]);\n tempMatrix[3] = (this.elements[2] * matrix.elements[1] + this.elements[3] * matrix.elements[3]);\n tempMatrix[4] = (this.offsetX * matrix.elements[0] + this.offsetY * matrix.elements[2] + matrix.offsetX);\n tempMatrix[5] = (this.offsetX * matrix.elements[1] + this.offsetY * matrix.elements[3] + matrix.offsetY);\n for (var i = 0; i < tempMatrix.length; i++) {\n this.elements[i] = tempMatrix[i];\n }\n };\n // IDisposable Members\n /**\n * `Dispose` this instance of PdfTransformationMatrix class.\n * @private\n */\n Matrix.prototype.dispose = function () {\n this.metrixElements = null;\n };\n // ICloneable Members\n /**\n * `Clones` this instance of PdfTransformationMatrix class.\n * @private\n */\n Matrix.prototype.clone = function () {\n var m = new Matrix(this.metrixElements);\n return m;\n };\n return Matrix;\n}());\nexport { Matrix };\n","/**\n * `constants.ts` class for EJ2-PDF\n * @private\n */\nvar ProcedureSets = /** @class */ (function () {\n function ProcedureSets() {\n /**\n * Specifies the `PDF` procedure set.\n * @private\n */\n this.pdf = 'PDF';\n /**\n * Specifies the `Text` procedure set.\n * @private\n */\n this.text = 'Text';\n /**\n * Specifies the `ImageB` procedure set.\n * @private\n */\n this.imageB = 'ImageB';\n /**\n * Specifies the `ImageC` procedure set.\n * @private\n */\n this.imageC = 'ImageC';\n /**\n * Specifies the `ImageI` procedure set.\n * @private\n */\n this.imageI = 'ImageI';\n }\n return ProcedureSets;\n}());\nexport { ProcedureSets };\n","/**\n * Dictionary class\n * @private\n * @hidden\n */\nvar TemporaryDictionary = /** @class */ (function () {\n function TemporaryDictionary() {\n /**\n * @hidden\n * @private\n */\n this.mKeys = [];\n /**\n * @hidden\n * @private\n */\n this.mValues = [];\n }\n /**\n * @hidden\n * @private\n */\n TemporaryDictionary.prototype.size = function () {\n return this.mKeys.length;\n };\n /**\n * @hidden\n * @private\n */\n TemporaryDictionary.prototype.add = function (key, value) {\n if (key === undefined || key === null || value === undefined || value === null) {\n throw new ReferenceError('Provided key or value is not valid.');\n }\n var index = this.mKeys.indexOf(key);\n if (index < 0) {\n this.mKeys.push(key);\n this.mValues.push(value);\n return 1;\n }\n else {\n throw new RangeError('An item with the same key has already been added.');\n }\n };\n /**\n * @hidden\n * @private\n */\n TemporaryDictionary.prototype.keys = function () {\n return this.mKeys;\n };\n /**\n * @hidden\n * @private\n */\n TemporaryDictionary.prototype.values = function () {\n return this.mValues;\n };\n /**\n * @hidden\n * @private\n */\n TemporaryDictionary.prototype.getValue = function (key) {\n if (key === undefined || key === null) {\n throw new ReferenceError('Provided key is not valid.');\n }\n var index = this.mKeys.indexOf(key);\n if (index < 0) {\n throw new RangeError('No item with the specified key has been added.');\n }\n else {\n return this.mValues[index];\n }\n };\n /**\n * @hidden\n * @private\n */\n TemporaryDictionary.prototype.setValue = function (key, value) {\n if (key === undefined || key === null) {\n throw new ReferenceError('Provided key is not valid.');\n }\n var index = this.mKeys.indexOf(key);\n if (index < 0) {\n this.mKeys.push(key);\n this.mValues.push(value);\n }\n else {\n this.mValues[index] = value;\n }\n };\n /**\n * @hidden\n * @private\n */\n TemporaryDictionary.prototype.remove = function (key) {\n if (key === undefined || key === null) {\n throw new ReferenceError('Provided key is not valid.');\n }\n var index = this.mKeys.indexOf(key);\n if (index < 0) {\n throw new RangeError('No item with the specified key has been added.');\n }\n else {\n this.mKeys.splice(index, 1);\n this.mValues.splice(index, 1);\n return true;\n }\n };\n /**\n * @hidden\n * @private\n */\n TemporaryDictionary.prototype.containsKey = function (key) {\n if (key === undefined || key === null) {\n throw new ReferenceError('Provided key is not valid.');\n }\n var index = this.mKeys.indexOf(key);\n if (index < 0) {\n return false;\n }\n return true;\n };\n /**\n * @hidden\n * @private\n */\n TemporaryDictionary.prototype.clear = function () {\n this.mKeys = [];\n this.mValues = [];\n };\n return TemporaryDictionary;\n}());\nexport { TemporaryDictionary };\n","import { PdfDictionary } from './../primitives/pdf-dictionary';\nimport { PdfNumber } from './../primitives/pdf-number';\nimport { PdfName } from './../primitives/pdf-name';\nimport { DictionaryProperties } from './../input-output/pdf-dictionary-properties';\n/**\n * Represents a simple `transparency`.\n * @private\n */\nvar PdfTransparency = /** @class */ (function () {\n // Properties\n // /**\n // * Gets the `stroke` operation alpha value.\n // * @private\n // */\n // public get stroke() : number {\n // let result : number = this.getNumber(this.dictionaryProperties.CA);\n // return result;\n // }\n // /**\n // * Gets the `fill` operation alpha value.\n // * @private\n // */\n // public get fill() : number {\n // let result : number = this.getNumber(this.dictionaryProperties.ca);\n // return result;\n // }\n // /**\n // * Gets the `blend mode`.\n // * @private\n // */\n // public get mode() : PdfBlendMode {\n // let result : string = this.getName(this.dictionaryProperties.ca);\n // return PdfBlendMode.Normal;\n // }\n // Constructors\n /**\n * Initializes a new instance of the `Transparency` class.\n * @private\n */\n function PdfTransparency(stroke, fill, mode) {\n // Fields\n /**\n * Internal variable to store `dictionary`.\n * @default new PdfDictionary()\n * @private\n */\n this.dictionary = new PdfDictionary();\n /**\n * Internal variable for accessing fields from `DictionryProperties` class.\n * @default new DictionaryProperties()\n * @private\n */\n this.dictionaryProperties = new DictionaryProperties();\n this.dictionary.items.setValue(this.dictionaryProperties.CA, new PdfNumber(stroke));\n this.dictionary.items.setValue(this.dictionaryProperties.ca, new PdfNumber(fill));\n this.dictionary.items.setValue(this.dictionaryProperties.BM, new PdfName(mode.toString()));\n }\n Object.defineProperty(PdfTransparency.prototype, \"element\", {\n // // Implementation\n // /**\n // * Gets the `number value`.\n // * @private\n // */\n // private getNumber(keyName : string) : number {\n // let result : number = 0.0;\n // let numb : PdfNumber = this.dictionary.items.getValue(keyName) as PdfNumber;\n // result = numb.intValue;\n // return result;\n // }\n // /**\n // * Gets the `name value`.\n // * @private\n // */\n // private getName(keyName : string) : string {\n // let result : string = null;\n // let name : PdfName = this.dictionary.items.getValue(keyName) as PdfName;\n // result = name.value;\n // return result;\n // }\n // IPdfWrapper Members\n /**\n * Gets the `element`.\n * @private\n */\n get: function () {\n return this.dictionary;\n },\n enumerable: true,\n configurable: true\n });\n return PdfTransparency;\n}());\nexport { PdfTransparency };\n","/**\n * Represent a `collection of automatic fields information`.\n * @private\n */\nvar PdfAutomaticFieldInfoCollection = /** @class */ (function () {\n /**\n * Initializes a new instance of the 'PdfPageNumberFieldInfoCollection' class.\n * @private\n */\n function PdfAutomaticFieldInfoCollection() {\n /**\n * Internal variable to store instance of `pageNumberFields` class.\n * @private\n */\n this.automaticFieldsInformation = [];\n //\n }\n Object.defineProperty(PdfAutomaticFieldInfoCollection.prototype, \"automaticFields\", {\n /**\n * Gets the `page number fields collection`.\n * @private\n */\n get: function () {\n return this.automaticFieldsInformation;\n },\n enumerable: true,\n configurable: true\n });\n // Public methods\n /// Adds the specified field info.\n /**\n * Add page number field into collection.\n * @private\n */\n PdfAutomaticFieldInfoCollection.prototype.add = function (fieldInfo) {\n return this.automaticFields.push(fieldInfo);\n };\n return PdfAutomaticFieldInfoCollection;\n}());\nexport { PdfAutomaticFieldInfoCollection };\n","/**\n * Represents a base class for all page graphics elements.\n */\nvar PdfGraphicsElement = /** @class */ (function () {\n // Constructors\n function PdfGraphicsElement() {\n //\n }\n /**\n * `Draws` the page number field.\n * @public\n */\n PdfGraphicsElement.prototype.drawHelper = function (graphics, x, y) {\n var bNeedSave = (x !== 0 || y !== 0);\n var gState = null;\n // Translate co-ordinates.\n if (bNeedSave) {\n // Save state.\n gState = graphics.save();\n graphics.translateTransform(x, y);\n }\n this.drawInternal(graphics);\n if (bNeedSave) {\n // Restore state.\n graphics.restore(gState);\n }\n };\n return PdfGraphicsElement;\n}());\nexport { PdfGraphicsElement };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * PdfAutomaticField.ts class for EJ2-PDF\n */\nimport { RectangleF, SizeF, PointF } from './../../drawing/pdf-drawing';\nimport { PdfSolidBrush } from './../../graphics/brushes/pdf-solid-brush';\nimport { PdfColor } from './../../graphics/pdf-color';\nimport { PdfDocument } from './../pdf-document';\nimport { PdfGraphicsElement } from './../../graphics/figures/base/graphics-element';\nimport { PdfAutomaticFieldInfo } from './automatic-field-info';\n/**\n * Represents a fields which is calculated before the document saves.\n */\nvar PdfAutomaticField = /** @class */ (function (_super) {\n __extends(PdfAutomaticField, _super);\n // Constructors\n function PdfAutomaticField() {\n var _this = _super.call(this) || this;\n // Fields\n _this.internalBounds = new RectangleF(0, 0, 0, 0);\n _this.internalTemplateSize = new SizeF(0, 0);\n return _this;\n }\n Object.defineProperty(PdfAutomaticField.prototype, \"bounds\", {\n // Properties\n get: function () {\n return this.internalBounds;\n },\n set: function (value) {\n this.internalBounds = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAutomaticField.prototype, \"size\", {\n get: function () {\n return new SizeF(this.bounds.width, this.bounds.height);\n },\n set: function (value) {\n this.bounds.width = value.width;\n this.bounds.height = value.height;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAutomaticField.prototype, \"location\", {\n get: function () {\n return new PointF(this.bounds.x, this.bounds.y);\n },\n set: function (value) {\n this.bounds.x = value.x;\n this.bounds.y = value.y;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAutomaticField.prototype, \"font\", {\n get: function () {\n return this.internalFont;\n },\n set: function (value) {\n this.internalFont = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAutomaticField.prototype, \"brush\", {\n get: function () {\n return this.internalBrush;\n },\n set: function (value) {\n this.internalBrush = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAutomaticField.prototype, \"pen\", {\n get: function () {\n return this.internalPen;\n },\n set: function (value) {\n this.internalPen = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAutomaticField.prototype, \"stringFormat\", {\n get: function () {\n return this.internalStringFormat;\n },\n set: function (value) {\n this.internalStringFormat = value;\n },\n enumerable: true,\n configurable: true\n });\n PdfAutomaticField.prototype.performDrawHelper = function (graphics, location, scalingX, scalingY) {\n if (this.bounds.height === 0 || this.bounds.width === 0) {\n var text = this.getValue(graphics);\n this.internalTemplateSize = this.getFont().measureString(text, this.size, this.stringFormat);\n }\n };\n PdfAutomaticField.prototype.draw = function (arg1, arg2, arg3) {\n if (typeof arg2 === 'undefined') {\n var location_1 = new PointF(0, 0);\n this.draw(arg1, location_1);\n }\n else if (arg2 instanceof PointF) {\n this.draw(arg1, arg2.x, arg2.y);\n }\n else {\n this.drawHelper(arg1, arg2, arg3);\n var info = new PdfAutomaticFieldInfo(this, new PointF(arg2, arg3));\n arg1.automaticFields.add(info);\n }\n };\n PdfAutomaticField.prototype.getSize = function () {\n if (this.bounds.height === 0 || this.bounds.width === 0) {\n return this.internalTemplateSize;\n }\n else {\n return this.size;\n }\n };\n PdfAutomaticField.prototype.drawInternal = function (graphics) {\n //\n };\n /* tslint:disable */\n PdfAutomaticField.prototype.getBrush = function () {\n return (typeof this.internalBrush === 'undefined' || this.internalBrush == null) ? new PdfSolidBrush(new PdfColor(0, 0, 0)) : this.internalBrush;\n };\n PdfAutomaticField.prototype.getFont = function () {\n return (typeof this.internalFont === 'undefined' || this.internalFont == null) ? PdfDocument.defaultFont : this.internalFont;\n };\n /* tslint:enable */\n PdfAutomaticField.prototype.getPageFromGraphics = function (graphics) {\n if (typeof graphics.page !== 'undefined' && graphics.page !== null) {\n var page = graphics.page;\n return page;\n }\n else {\n var page = graphics.currentPage;\n return page;\n }\n };\n return PdfAutomaticField;\n}(PdfGraphicsElement));\nexport { PdfAutomaticField };\n","/**\n * PdfAutomaticFieldInfo.ts class for EJ2-PDF\n * @private\n */\nimport { PointF } from './../../drawing/pdf-drawing';\nimport { PdfAutomaticField } from './automatic-field';\n/**\n * Represents information about the automatic field.\n * @private\n */\nvar PdfAutomaticFieldInfo = /** @class */ (function () {\n function PdfAutomaticFieldInfo(field, location, scaleX, scaleY) {\n // Fields\n /**\n * Internal variable to store location of the field.\n * @private\n */\n this.pageNumberFieldLocation = new PointF();\n /**\n * Internal variable to store field.\n * @private\n */\n this.pageNumberField = null;\n /**\n * Internal variable to store x scaling factor.\n * @private\n */\n this.scaleX = 1;\n /**\n * Internal variable to store y scaling factor.\n * @private\n */\n this.scaleY = 1;\n if (typeof location === 'undefined' && field instanceof PdfAutomaticFieldInfo) {\n this.pageNumberField = field.field;\n this.pageNumberFieldLocation = field.location;\n this.scaleX = field.scalingX;\n this.scaleY = field.scalingY;\n }\n else if (typeof scaleX === 'undefined' && location instanceof PointF && field instanceof PdfAutomaticField) {\n this.pageNumberField = field;\n this.pageNumberFieldLocation = location;\n }\n else {\n this.pageNumberField = field;\n this.pageNumberFieldLocation = location;\n this.scaleX = scaleX;\n this.scaleY = scaleY;\n }\n }\n Object.defineProperty(PdfAutomaticFieldInfo.prototype, \"location\", {\n /* tslint:enable */\n // Properties\n /**\n * Gets or sets the location.\n * @private\n */\n get: function () {\n return this.pageNumberFieldLocation;\n },\n set: function (value) {\n this.pageNumberFieldLocation = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAutomaticFieldInfo.prototype, \"field\", {\n /**\n * Gets or sets the field.\n * @private\n */\n get: function () {\n return this.pageNumberField;\n },\n set: function (value) {\n this.pageNumberField = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAutomaticFieldInfo.prototype, \"scalingX\", {\n /**\n * Gets or sets the scaling X factor.\n * @private\n */\n get: function () {\n return this.scaleX;\n },\n set: function (value) {\n this.scaleX = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAutomaticFieldInfo.prototype, \"scalingY\", {\n /**\n * Gets or sets the scaling Y factor.\n * @private\n */\n get: function () {\n return this.scaleY;\n },\n set: function (value) {\n this.scaleY = value;\n },\n enumerable: true,\n configurable: true\n });\n return PdfAutomaticFieldInfo;\n}());\nexport { PdfAutomaticFieldInfo };\n","/**\n * ByteArray class\n * Used to keep information about image stream as byte array.\n * @private\n */\nvar ByteArray = /** @class */ (function () {\n /**\n * Initialize the new instance for `byte-array` class\n * @hidden\n * @private\n */\n function ByteArray(length) {\n /**\n * Current stream `position`.\n * @default 0\n * @private\n */\n this.mPosition = 0;\n this.buffer = new Uint8Array(length);\n this.dataView = new DataView(this.buffer.buffer);\n }\n Object.defineProperty(ByteArray.prototype, \"position\", {\n /**\n * Gets and Sets a current `position` of byte array.\n * @hidden\n * @private\n */\n get: function () {\n return this.mPosition;\n },\n set: function (value) {\n this.mPosition = value;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * `Read` from current stream position.\n * @default 0\n * @hidden\n * @private\n */\n ByteArray.prototype.read = function (buffer, offset, count) {\n for (var index = offset; index < count; index++) {\n var position = this.position;\n buffer.buffer[index] = this.readByte(position);\n this.position++;\n }\n };\n /**\n * @hidden\n */\n ByteArray.prototype.getBuffer = function (index) {\n return this.buffer[index];\n };\n /**\n * @hidden\n */\n ByteArray.prototype.writeFromBase64String = function (base64) {\n var arr = this.encodedString(base64);\n this.buffer = arr;\n };\n /**\n * @hidden\n */\n ByteArray.prototype.encodedString = function (input) {\n var keyStr = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';\n var chr1;\n var chr2;\n var chr3;\n var enc1;\n var enc2;\n var enc3;\n var enc4;\n var i = 0;\n var resultIndex = 0;\n var dataUrlPrefix = 'data:';\n input = input.replace(/[^A-Za-z0-9\\+\\/\\=]/g, '');\n var totalLength = input.length * 3 / 4;\n if (input.charAt(input.length - 1) === keyStr.charAt(64)) {\n totalLength--;\n }\n var output = new Uint8Array(totalLength | 0);\n while (i < input.length) {\n enc1 = keyStr.indexOf(input.charAt(i++));\n enc2 = keyStr.indexOf(input.charAt(i++));\n enc3 = keyStr.indexOf(input.charAt(i++));\n enc4 = keyStr.indexOf(input.charAt(i++));\n chr1 = (enc1 << 2) | (enc2 >> 4);\n chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);\n chr3 = ((enc3 & 3) << 6) | enc4;\n output[resultIndex++] = chr1;\n output[resultIndex++] = chr2;\n output[resultIndex++] = chr3;\n }\n return output;\n };\n /**\n * @hidden\n */\n ByteArray.prototype.readByte = function (offset) {\n return (this.buffer[offset]);\n };\n Object.defineProperty(ByteArray.prototype, \"internalBuffer\", {\n /**\n * @hidden\n */\n get: function () {\n return this.buffer;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(ByteArray.prototype, \"count\", {\n /**\n * @hidden\n */\n get: function () {\n return this.buffer.byteLength;\n },\n enumerable: true,\n configurable: true\n });\n return ByteArray;\n}());\nexport { ByteArray };\n","/**\n * `PdfBoolean` class is used to perform boolean related primitive operations.\n * @private\n */\nvar PdfBoolean = /** @class */ (function () {\n //constructor\n /**\n * Initializes a new instance of the `PdfBoolean` class.\n * @private\n */\n function PdfBoolean(value) {\n /**\n * Internal variable to store the `position`.\n * @default -1\n * @private\n */\n this.currentPosition = -1;\n this.value = value;\n }\n Object.defineProperty(PdfBoolean.prototype, \"status\", {\n //Properties\n /**\n * Gets or sets the `Status` of the specified object.\n * @private\n */\n get: function () {\n return this.objectStatus;\n },\n set: function (value) {\n this.objectStatus = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfBoolean.prototype, \"isSaving\", {\n /**\n * Gets or sets a value indicating whether this document `is saving` or not.\n * @private\n */\n get: function () {\n return this.saving;\n },\n set: function (value) {\n this.saving = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfBoolean.prototype, \"objectCollectionIndex\", {\n /**\n * Gets or sets the `index` value of the specified object.\n * @private\n */\n get: function () {\n return this.index;\n },\n set: function (value) {\n this.index = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfBoolean.prototype, \"position\", {\n /**\n * Gets or sets the `position` of the object.\n * @private\n */\n get: function () {\n return this.currentPosition;\n },\n set: function (value) {\n this.currentPosition = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfBoolean.prototype, \"clonedObject\", {\n /**\n * Returns `cloned object`.\n * @private\n */\n get: function () {\n var rValue = null;\n return rValue;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * `Saves` the object using the specified writer.\n * @private\n */\n PdfBoolean.prototype.save = function (writer) {\n writer.write(this.boolToStr(this.value));\n };\n /**\n * Creates a `copy of PdfBoolean`.\n * @private\n */\n PdfBoolean.prototype.clone = function (crossTable) {\n var newNumber = new PdfBoolean(this.value);\n return newNumber;\n };\n // Implementation\n /**\n * Converts `boolean to string` - 0/1 'true'/'false'.\n * @private\n */\n PdfBoolean.prototype.boolToStr = function (value) {\n return value ? 'true' : 'false';\n };\n return PdfBoolean;\n}());\nexport { PdfBoolean };\n","/**\n * ImageDecoder class\n */\nimport { ByteArray } from './byte-array';\nimport { PdfStream } from './../../primitives/pdf-stream';\nimport { DictionaryProperties } from './../../input-output/pdf-dictionary-properties';\nimport { PdfName } from './../../primitives/pdf-name';\nimport { PdfNumber } from './../../primitives/pdf-number';\nimport { PdfBoolean } from './../../primitives/pdf-boolean';\nimport { PdfDictionary } from './../../primitives/pdf-dictionary';\n/**\n * Specifies the image `format`.\n * @private\n */\nexport var ImageFormat;\n(function (ImageFormat) {\n /**\n * Specifies the type of `Unknown`.\n * @hidden\n * @private\n */\n ImageFormat[ImageFormat[\"Unknown\"] = 0] = \"Unknown\";\n /**\n * Specifies the type of `Bmp`.\n * @hidden\n * @private\n */\n ImageFormat[ImageFormat[\"Bmp\"] = 1] = \"Bmp\";\n /**\n * Specifies the type of `Emf`.\n * @hidden\n * @private\n */\n ImageFormat[ImageFormat[\"Emf\"] = 2] = \"Emf\";\n /**\n * Specifies the type of `Gif`.\n * @hidden\n * @private\n */\n ImageFormat[ImageFormat[\"Gif\"] = 3] = \"Gif\";\n /**\n * Specifies the type of `Jpeg`.\n * @hidden\n * @private\n */\n ImageFormat[ImageFormat[\"Jpeg\"] = 4] = \"Jpeg\";\n /**\n * Specifies the type of `Png`.\n * @hidden\n * @private\n */\n ImageFormat[ImageFormat[\"Png\"] = 5] = \"Png\";\n /**\n * Specifies the type of `Wmf`.\n * @hidden\n * @private\n */\n ImageFormat[ImageFormat[\"Wmf\"] = 6] = \"Wmf\";\n /**\n * Specifies the type of `Icon`.\n * @hidden\n * @private\n */\n ImageFormat[ImageFormat[\"Icon\"] = 7] = \"Icon\";\n})(ImageFormat || (ImageFormat = {}));\n/**\n * `Decode the image stream`.\n * @private\n */\nvar ImageDecoder = /** @class */ (function () {\n /**\n * Initialize the new instance for `image-decoder` class.\n * @private\n */\n function ImageDecoder(stream) {\n /**\n * Specifies `format` of image.\n * @hidden\n * @private\n */\n this.mFormat = ImageFormat.Unknown;\n /**\n * `Bits per component`.\n * @default 8\n * @hidden\n * @private\n */\n this.mbitsPerComponent = 8;\n /**\n * Internal variable for accessing fields from `DictionryProperties` class.\n * @hidden\n * @private\n */\n this.dictionaryProperties = new DictionaryProperties();\n this.mStream = stream;\n this.initialize();\n }\n Object.defineProperty(ImageDecoder.prototype, \"height\", {\n /**\n * Gets the `height` of image.\n * @hidden\n * @private\n */\n get: function () {\n return this.mHeight;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(ImageDecoder.prototype, \"width\", {\n /**\n * Gets the `width` of image.\n * @hidden\n * @private\n */\n get: function () {\n return this.mWidth;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(ImageDecoder.prototype, \"bitsPerComponent\", {\n /**\n * Gets `bits per component`.\n * @hidden\n * @private\n */\n get: function () {\n return this.mbitsPerComponent;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(ImageDecoder.prototype, \"size\", {\n /**\n * Gets the `size` of an image data.\n * @hidden\n * @private\n */\n get: function () {\n return this.mImageData.count;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(ImageDecoder.prototype, \"imageData\", {\n /**\n * Gets the value of an `image data`.\n * @hidden\n * @private\n */\n get: function () {\n return this.mImageData;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(ImageDecoder.prototype, \"imageDataAsNumberArray\", {\n /**\n * Gets the value of an `image data as number array`.\n * @hidden\n * @private\n */\n get: function () {\n return this.mImageData.internalBuffer.buffer;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * `Initialize` image data and image stream.\n * @hidden\n * @private\n */\n ImageDecoder.prototype.initialize = function () {\n if (this.mFormat === ImageFormat.Unknown && this.checkIfJpeg()) {\n this.mFormat = ImageFormat.Jpeg;\n this.parseJpegImage();\n }\n this.reset();\n this.mImageData = new ByteArray(this.mStream.count);\n this.mStream.read(this.mImageData, 0, this.mImageData.count);\n };\n /**\n * `Reset` stream position into 0.\n * @hidden\n * @private\n */\n ImageDecoder.prototype.reset = function () {\n this.mStream.position = 0;\n };\n /**\n * `Parse` Jpeg image.\n * @hidden\n * @private\n */\n ImageDecoder.prototype.parseJpegImage = function () {\n this.reset();\n var imgData = new ByteArray(this.mStream.count);\n this.mStream.read(imgData, 0, imgData.count);\n var i = 4;\n /* tslint:disable */\n if (String.fromCharCode(imgData.getBuffer(i + 2)) === 'J' && String.fromCharCode(imgData.getBuffer(i + 3)) === 'F' && String.fromCharCode(imgData.getBuffer(i + 4)) === 'I' && String.fromCharCode(imgData.getBuffer(i + 5)) === 'F' && imgData.getBuffer(i + 6) === 0) {\n var length_1 = imgData.getBuffer(i) * 256 + imgData.getBuffer(i + 1);\n while (i + length_1 < imgData.count) {\n i += length_1;\n if (imgData.getBuffer(i + 1) === 192) {\n this.mHeight = imgData.getBuffer(i + 5) * 256 + imgData.getBuffer(i + 6);\n this.mWidth = imgData.getBuffer(i + 7) * 256 + imgData.getBuffer(i + 8);\n return;\n }\n else {\n i += 2;\n length_1 = imgData.getBuffer(i) * 256 + imgData.getBuffer(i + 1);\n }\n }\n }\n /* tslint:enable */\n };\n Object.defineProperty(ImageDecoder.prototype, \"format\", {\n /**\n * Gets the image `format`.\n * @private\n * @hidden\n */\n get: function () {\n return this.mFormat;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * `Checks if JPG`.\n * @private\n * @hidden\n */\n ImageDecoder.prototype.checkIfJpeg = function () {\n this.reset();\n for (var i = 0; i < ImageDecoder.mJpegHeader.length; i++) {\n if (ImageDecoder.mJpegHeader[i] !== this.mStream.readByte(i)) {\n return false;\n }\n this.mStream.position++;\n }\n return true;\n };\n /**\n * Return image `dictionary`.\n * @hidden\n * @private\n */\n ImageDecoder.prototype.getImageDictionary = function () {\n if (this.mFormat === ImageFormat.Jpeg) {\n var tempArrayBuffer = this.imageData.internalBuffer.length;\n this.imageStream = new PdfStream();\n this.imageStream.isImage = true;\n var tempString = '';\n var decodedString = '';\n for (var i = 0; i < this.imageDataAsNumberArray.byteLength; i++) {\n tempString += String.fromCharCode(null, this.mStream.readByte(i));\n }\n for (var i = 0; i < tempString.length; i++) {\n if (i % 2 !== 0) {\n decodedString += tempString[i];\n }\n }\n this.imageStream.data = [decodedString];\n this.imageStream.compress = false;\n this.imageStream.items.setValue(this.dictionaryProperties.type, new PdfName(this.dictionaryProperties.xObject));\n this.imageStream.items.setValue(this.dictionaryProperties.subtype, new PdfName(this.dictionaryProperties.image));\n this.imageStream.items.setValue(this.dictionaryProperties.width, new PdfNumber(this.width));\n this.imageStream.items.setValue(this.dictionaryProperties.height, new PdfNumber(this.height));\n this.imageStream.items.setValue(this.dictionaryProperties.bitsPerComponent, new PdfNumber(this.bitsPerComponent));\n this.imageStream.items.setValue(this.dictionaryProperties.filter, new PdfName(this.dictionaryProperties.dctdecode));\n this.imageStream.items.setValue(this.dictionaryProperties.colorSpace, new PdfName(this.getColorSpace()));\n this.imageStream.items.setValue(this.dictionaryProperties.decodeParms, this.getDecodeParams());\n return this.imageStream;\n }\n else {\n return this.imageStream;\n }\n };\n /**\n * Return `colorSpace` of an image.\n * @hidden\n * @private\n */\n ImageDecoder.prototype.getColorSpace = function () {\n return this.dictionaryProperties.deviceRgb;\n };\n /**\n * Return `decode parameters` of an image.\n * @hidden\n * @private\n */\n ImageDecoder.prototype.getDecodeParams = function () {\n var decodeParams = new PdfDictionary();\n decodeParams.items.setValue(this.dictionaryProperties.columns, new PdfNumber(this.width));\n decodeParams.items.setValue(this.dictionaryProperties.blackIs1, new PdfBoolean(true));\n decodeParams.items.setValue(this.dictionaryProperties.k, new PdfNumber(-1));\n decodeParams.items.setValue(this.dictionaryProperties.predictor, new PdfNumber(15));\n decodeParams.items.setValue(this.dictionaryProperties.bitsPerComponent, new PdfNumber(this.bitsPerComponent));\n return decodeParams;\n };\n /**\n * Number array for `png header`.\n * @hidden\n * @private\n */\n ImageDecoder.mPngHeader = [137, 80, 78, 71, 13, 10, 26, 10];\n /**\n * Number Array for `jpeg header`.\n * @hidden\n * @private\n */\n ImageDecoder.mJpegHeader = [255, 216];\n /**\n * Number array for `gif header`.\n * @hidden\n * @private\n */\n ImageDecoder.GIF_HEADER = 'G,I,F,8';\n /**\n * Number array for `bmp header.`\n * @hidden\n * @private\n */\n ImageDecoder.BMP_HEADER = 'B,M';\n return ImageDecoder;\n}());\nexport { ImageDecoder };\n","/**\n * Used to perform `convertion between pixels and points`.\n * @private\n */\nvar PdfUnitConverter = /** @class */ (function () {\n //constructors\n /**\n * Initializes a new instance of the `UnitConvertor` class with DPI value.\n * @private\n */\n function PdfUnitConverter(dpi) {\n this.updateProportionsHelper(dpi);\n }\n /**\n * `Converts` the value, from one graphics unit to another graphics unit.\n * @private\n */\n PdfUnitConverter.prototype.convertUnits = function (value, from, to) {\n return this.convertFromPixels(this.convertToPixels(value, from), to);\n };\n /**\n * Converts the value `to pixel` from specified graphics unit.\n * @private\n */\n PdfUnitConverter.prototype.convertToPixels = function (value, from) {\n var index = from;\n var result = (value * this.proportions[index]);\n return result;\n };\n /**\n * Converts value, to specified graphics unit `from Pixel`.\n * @private\n */\n PdfUnitConverter.prototype.convertFromPixels = function (value, to) {\n var index = to;\n var result = (value / this.proportions[index]);\n return result;\n };\n /**\n * `Update proportions` matrix according to Graphics settings.\n * @private\n */\n PdfUnitConverter.prototype.updateProportionsHelper = function (pixelPerInch) {\n this.proportions = [\n pixelPerInch / 2.54,\n pixelPerInch / 6.0,\n 1,\n pixelPerInch / 72.0,\n pixelPerInch,\n pixelPerInch / 300.0,\n pixelPerInch / 25.4 // Millimeter\n ];\n };\n //Fields\n /**\n * Indicates default `horizontal resolution`.\n * @default 96\n * @private\n */\n PdfUnitConverter.horizontalResolution = 96;\n /**\n * Indicates default `vertical resolution`.\n * @default 96\n * @private\n */\n PdfUnitConverter.verticalResolution = 96;\n return PdfUnitConverter;\n}());\nexport { PdfUnitConverter };\n","import { SizeF } from './../../drawing/pdf-drawing';\nimport { PdfGraphicsUnit } from './../enum';\nimport { PdfUnitConverter } from './../unit-convertor';\n/**\n * `PdfImage` class represents the base class for images and provides functionality for the 'PdfBitmap' class.\n * @private\n */\nvar PdfImage = /** @class */ (function () {\n function PdfImage() {\n }\n Object.defineProperty(PdfImage.prototype, \"width\", {\n /**\n * Gets and Sets the `width` of an image.\n * @private\n */\n get: function () {\n return this.imageWidth;\n },\n set: function (value) {\n this.imageWidth = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfImage.prototype, \"height\", {\n /**\n * Gets and Sets the `height` of an image.\n * @private\n */\n get: function () {\n return this.imageHeight;\n },\n set: function (value) {\n this.imageHeight = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfImage.prototype, \"size\", {\n /**\n * Gets or sets the size of the image.\n * @private\n */\n set: function (value) {\n this.width = value.width;\n this.height = value.height;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfImage.prototype, \"physicalDimension\", {\n /**\n * Gets the `physical dimension` of an image.\n * @private\n */\n get: function () {\n this.imagePhysicalDimension = this.getPointSize(this.width, this.height, this.horizontalResolution, this.verticalResolution);\n return new SizeF(this.width, this.height);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfImage.prototype, \"element\", {\n // /**\n // * Gets the `image stream as string`.\n // * @private\n // */\n // public static fromString(string : string) : PdfImage {\n // let image : PdfImage = new PdfBitmap(string);\n // return image;\n // }\n /**\n * Gets the `element` image stream.\n * @private\n */\n get: function () {\n return this.imageStream;\n },\n enumerable: true,\n configurable: true\n });\n PdfImage.prototype.getPointSize = function (width, height, horizontalResolution, verticalResolution) {\n if (typeof horizontalResolution === 'undefined') {\n var dpiX = PdfUnitConverter.horizontalResolution;\n var dpiY = PdfUnitConverter.verticalResolution;\n var size = this.getPointSize(width, height, dpiX, dpiY);\n return size;\n }\n else {\n var ucX = new PdfUnitConverter(horizontalResolution);\n var ucY = new PdfUnitConverter(verticalResolution);\n var ptWidth = ucX.convertUnits(width, PdfGraphicsUnit.Pixel, PdfGraphicsUnit.Point);\n var ptHeight = ucY.convertUnits(height, PdfGraphicsUnit.Pixel, PdfGraphicsUnit.Point);\n var size = new SizeF(ptWidth, ptHeight);\n return size;\n }\n };\n return PdfImage;\n}());\nexport { PdfImage };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * PdfBitmap.ts class for EJ2-PDF\n */\nimport { ImageDecoder } from './../../graphics/images/image-decoder';\nimport { ByteArray } from './../../graphics/images/byte-array';\nimport { DictionaryProperties } from './../../input-output/pdf-dictionary-properties';\nimport { PdfImage } from './pdf-image';\n/**\n * The 'PdfBitmap' contains methods and properties to handle the Bitmap images.\n * ```typescript\n * // create a new PDF document.\n * let document : PdfDocument = new PdfDocument();\n * // add a page to the document.\n * let page1 : PdfPage = document.pages.add();\n * // base64 string of an image\n * let imageString : string = '/9j/3+2w7em7HzY/KiijFw … 1OEYRUYrQ45yc5OUtz/9k=';\n * // load the image from the base64 string of original image.\n * let image : PdfBitmap = new PdfBitmap(imageString);\n * // draw the image\n * page1.graphics.drawImage(image, new RectangleF({x : 10, y : 10}, {width : 200, height : 200}));\n * // save the document.\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\nvar PdfBitmap = /** @class */ (function (_super) {\n __extends(PdfBitmap, _super);\n /**\n * Create an instance for `PdfBitmap` class.\n * @param encodedString Base64 string of an image.\n * ```typescript\n * // create a new PDF document.\n * let document : PdfDocument = new PdfDocument();\n * // add a page to the document.\n * let page1 : PdfPage = document.pages.add();\n * // base64 string of an image\n * let imageString : string = '/9j/3+2w7em7HzY/KiijFw … 1OEYRUYrQ45yc5OUtz/9k=';\n * //\n * // load the image from the base64 string of original image.\n * let image : PdfBitmap = new PdfBitmap(imageString);\n * //\n * // draw the image\n * page1.graphics.drawImage(image, new RectangleF({x : 10, y : 10}, {width : 200, height : 200}));\n * // save the document.\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n function PdfBitmap(encodedString) {\n var _this = _super.call(this) || this;\n //Fields\n /**\n * Specifies the `status` of an image.\n * @default true.\n * @hidden\n * @private\n */\n _this.imageStatus = true;\n /**\n * Internal variable for accessing fields from `DictionryProperties` class.\n * @hidden\n * @private\n */\n _this.dictionaryProperties = new DictionaryProperties();\n _this.loadImage(encodedString);\n return _this;\n }\n /**\n * `Load image`.\n * @hidden\n * @private\n */\n PdfBitmap.prototype.loadImage = function (encodedString) {\n var task = this.initializeAsync(encodedString);\n };\n /**\n * `Initialize` image parameters.\n * @private\n */\n PdfBitmap.prototype.initializeAsync = function (encodedString) {\n var byteArray = new ByteArray(encodedString.length);\n byteArray.writeFromBase64String(encodedString);\n this.decoder = new ImageDecoder(byteArray);\n this.height = this.decoder.height;\n this.width = this.decoder.width;\n // FrameCount = BitmapImageDecoder.FrameCount;\n this.bitsPerComponent = this.decoder.bitsPerComponent;\n };\n /**\n * `Saves` the image into stream.\n * @private\n */\n PdfBitmap.prototype.save = function () {\n this.imageStatus = true;\n this.imageStream = this.decoder.getImageDictionary();\n };\n return PdfBitmap;\n}(PdfImage));\nexport { PdfBitmap };\n","/**\n * TtfTableInfo.ts class for EJ2-PDF\n */\nvar TtfTableInfo = /** @class */ (function () {\n function TtfTableInfo() {\n }\n Object.defineProperty(TtfTableInfo.prototype, \"empty\", {\n //Properties\n /**\n * Gets a value indicating whether this table is empty.\n * @private\n */\n get: function () {\n var empty = (this.offset === this.length && this.length === this.checksum && this.checksum === 0);\n return empty;\n },\n enumerable: true,\n configurable: true\n });\n return TtfTableInfo;\n}());\nexport { TtfTableInfo };\n","var TtfNameTable = /** @class */ (function () {\n function TtfNameTable() {\n }\n return TtfNameTable;\n}());\nexport { TtfNameTable };\n","/**\n * TtfNameRecord.ts class for EJ2-PDF\n */\nvar TtfNameRecord = /** @class */ (function () {\n function TtfNameRecord() {\n }\n return TtfNameRecord;\n}());\nexport { TtfNameRecord };\n","/**\n * TtfHeadTable.ts class for EJ2-PDF\n */\nvar TtfHeadTable = /** @class */ (function () {\n function TtfHeadTable() {\n }\n return TtfHeadTable;\n}());\nexport { TtfHeadTable };\n","var TtfMetrics = /** @class */ (function () {\n function TtfMetrics() {\n }\n Object.defineProperty(TtfMetrics.prototype, \"isItalic\", {\n //Properties\n /**\n * Gets a value indicating whether this instance is italic.\n */\n get: function () {\n return ((this.macStyle & 2) !== 0);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(TtfMetrics.prototype, \"isBold\", {\n /**\n * Gets a value indicating whether this instance is bold.\n */\n get: function () {\n return ((this.macStyle & 1) !== 0);\n },\n enumerable: true,\n configurable: true\n });\n return TtfMetrics;\n}());\nexport { TtfMetrics };\n","/**\n * TtfHorizontalHeaderTable.ts class for EJ2-PDF\n */\nvar TtfHorizontalHeaderTable = /** @class */ (function () {\n function TtfHorizontalHeaderTable() {\n }\n return TtfHorizontalHeaderTable;\n}());\nexport { TtfHorizontalHeaderTable };\n","/**\n * TtfOS2Table.ts class for EJ2-PDF\n * The OS/2 table consists of a set of metrics that are required by Windows and OS/2.\n */\nvar TtfOS2Table = /** @class */ (function () {\n function TtfOS2Table() {\n }\n return TtfOS2Table;\n}());\nexport { TtfOS2Table };\n","/**\n * TtfPostTable.ts class for EJ2-PDF\n */\nvar TtfPostTable = /** @class */ (function () {\n function TtfPostTable() {\n }\n return TtfPostTable;\n}());\nexport { TtfPostTable };\n","/**\n * TtfLongHorMetric.ts class for EJ2-PDF\n */\nvar TtfLongHorMetric = /** @class */ (function () {\n function TtfLongHorMetric() {\n }\n return TtfLongHorMetric;\n}());\nexport { TtfLongHorMetric };\n","/**\n * TtfCmapSubTable.ts class for EJ2-PDF\n */\nvar TtfCmapSubTable = /** @class */ (function () {\n function TtfCmapSubTable() {\n }\n return TtfCmapSubTable;\n}());\nexport { TtfCmapSubTable };\n","/**\n * TtfCmapTable.ts class for EJ2-PDF\n */\nvar TtfCmapTable = /** @class */ (function () {\n function TtfCmapTable() {\n }\n return TtfCmapTable;\n}());\nexport { TtfCmapTable };\n","/**\n * TtfGlyphInfo.ts class for EJ2-PDF\n */\nvar TtfGlyphInfo = /** @class */ (function () {\n function TtfGlyphInfo() {\n }\n Object.defineProperty(TtfGlyphInfo.prototype, \"empty\", {\n //Properties\n /**\n * Gets a value indicating whether this TtfGlyphInfo is empty.\n */\n get: function () {\n var empty = (this.index === this.width && this.width === this.charCode && this.charCode === 0);\n return empty;\n },\n enumerable: true,\n configurable: true\n });\n //IComparable implementation\n /**\n * Compares two WidthDescriptor objects.\n */\n TtfGlyphInfo.prototype.compareTo = function (obj) {\n var glyph = obj;\n return this.index - glyph.index;\n };\n return TtfGlyphInfo;\n}());\nexport { TtfGlyphInfo };\n","/**\n * TtfLocaTable.ts class for EJ2-PDF\n */\nvar TtfLocaTable = /** @class */ (function () {\n function TtfLocaTable() {\n }\n return TtfLocaTable;\n}());\nexport { TtfLocaTable };\n","/**\n * TtfAppleCmapSubTable.ts class for EJ2-PDF\n */\nvar TtfAppleCmapSubTable = /** @class */ (function () {\n function TtfAppleCmapSubTable() {\n }\n return TtfAppleCmapSubTable;\n}());\nexport { TtfAppleCmapSubTable };\n","/**\n * TtfMicrosoftCmapSubTable.ts class for EJ2-PDF\n */\nvar TtfMicrosoftCmapSubTable = /** @class */ (function () {\n function TtfMicrosoftCmapSubTable() {\n }\n return TtfMicrosoftCmapSubTable;\n}());\nexport { TtfMicrosoftCmapSubTable };\n","/**\n * TtfTrimmedCmapSubTable.ts class for EJ2-PDF\n */\nvar TtfTrimmedCmapSubTable = /** @class */ (function () {\n function TtfTrimmedCmapSubTable() {\n }\n return TtfTrimmedCmapSubTable;\n}());\nexport { TtfTrimmedCmapSubTable };\n","/**\n * TtfLocaTable.ts class for EJ2-PDF\n */\nvar TtfGlyphHeader = /** @class */ (function () {\n function TtfGlyphHeader() {\n }\n return TtfGlyphHeader;\n}());\nexport { TtfGlyphHeader };\n","/**\n * Writes data in BigEndian order.\n */\nvar BigEndianWriter = /** @class */ (function () {\n //Constructors\n /**\n * Creates a new writer.\n */\n function BigEndianWriter(capacity) {\n //Constants\n /**\n * Size of Int32 type.\n */\n this.int32Size = 4;\n /**\n * Size of Int16 type.\n */\n this.int16Size = 2;\n /**\n * Size of long type.\n */\n this.int64Size = 8;\n this.bufferLength = capacity;\n this.buffer = [];\n }\n Object.defineProperty(BigEndianWriter.prototype, \"data\", {\n //Properties\n /**\n * Gets data written to the writer.\n */\n get: function () {\n if (this.buffer.length < this.bufferLength) {\n var length_1 = this.bufferLength - this.buffer.length;\n for (var i = 0; i < length_1; i++) {\n this.buffer.push(0);\n }\n }\n return this.buffer;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(BigEndianWriter.prototype, \"position\", {\n /// \n /// Gets position of the internal buffer.\n /// \n get: function () {\n if (this.internalPosition === undefined || this.internalPosition === null) {\n this.internalPosition = 0;\n }\n return this.internalPosition;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * Writes short value.\n */\n BigEndianWriter.prototype.writeShort = function (value) {\n var bytes = [((value & 0x0000ff00) >> 8), value & 0x000000ff];\n this.flush(bytes);\n };\n /**\n * Writes int value.\n */\n BigEndianWriter.prototype.writeInt = function (value) {\n var i1 = (value & 0xff000000) >> 24;\n i1 = i1 < 0 ? 256 + i1 : i1;\n var i2 = (value & 0x00ff0000) >> 16;\n i2 = i2 < 0 ? 256 + i2 : i2;\n var i3 = (value & 0x0000ff00) >> 8;\n i3 = i3 < 0 ? 256 + i3 : i3;\n var i4 = value & 0x000000ff;\n i4 = i4 < 0 ? 256 + i4 : i4;\n var bytes = [(value & 0xff000000) >> 24, (value & 0x00ff0000) >> 16, (value & 0x0000ff00) >> 8, value & 0x000000ff];\n this.flush(bytes);\n };\n /**\n * Writes u int value.\n */\n BigEndianWriter.prototype.writeUInt = function (value) {\n var buff = [(value & 0xff000000) >> 24, (value & 0x00ff0000) >> 16, (value & 0x0000ff00) >> 8, value & 0x000000ff];\n this.flush(buff);\n };\n /**\n * Writes string value.\n */\n BigEndianWriter.prototype.writeString = function (value) {\n if (value == null) {\n throw new Error('Argument Null Exception : value');\n }\n var bytes = [];\n for (var i = 0; i < value.length; i++) {\n bytes.push(value.charCodeAt(i));\n }\n this.flush(bytes);\n };\n /**\n * Writes byte[] value.\n */\n BigEndianWriter.prototype.writeBytes = function (value) {\n this.flush(value);\n };\n // //Implementation\n BigEndianWriter.prototype.flush = function (buff) {\n if (buff === null) {\n throw new Error('Argument Null Exception : buff');\n }\n var result = [];\n for (var i = 0; i < this.position; i++) {\n result.push(this.buffer[i]);\n }\n for (var i = 0; i < buff.length; i++) {\n result.push(buff[i]);\n }\n for (var i = this.position; i < this.buffer.length; i++) {\n result.push(this.buffer[i]);\n }\n this.buffer = result;\n this.internalPosition += buff.length;\n };\n return BigEndianWriter;\n}());\nexport { BigEndianWriter };\n","/**\n * TtfReader.ts class for EJ2-PDF\n */\nimport { TtfTableInfo } from './ttf-table-info';\nimport { Dictionary } from './../../collections/dictionary';\nimport { TtfNameTable } from './ttf-name-table';\nimport { TtfNameRecord } from './ttf-name-record';\nimport { TtfHeadTable } from './ttf-head-table';\nimport { TtfMetrics } from './ttf-metrics';\nimport { TtfHorizontalHeaderTable } from './ttf-horizontal-header-table';\nimport { TtfOS2Table } from './ttf-OS2-Table';\nimport { TtfPostTable } from './ttf-post-table';\nimport { TtfLongHorMetric } from './ttf-long-hor-metric';\nimport { TtfCmapSubTable } from './ttf-cmap-sub-table';\nimport { TtfCmapTable } from './ttf-cmap-table';\nimport { TtfGlyphInfo } from './ttf-glyph-info';\nimport { TtfLocaTable } from './ttf-loca-table';\nimport { TtfAppleCmapSubTable } from './ttf-apple-cmap-sub-table';\nimport { TtfMicrosoftCmapSubTable } from './ttf-microsoft-cmap-sub-table';\nimport { TtfTrimmedCmapSubTable } from './ttf-trimmed-cmap-sub-table';\nimport { TtfGlyphHeader } from './ttf-glyph-header';\nimport { Rectangle } from './../../drawing/pdf-drawing';\nimport { StringTokenizer } from './string-tokenizer';\nimport { TtfCmapFormat, TtfCmapEncoding, TtfPlatformID } from './enum';\nimport { TtfMicrosoftEncodingID, TtfMacintoshEncodingID, TtfCompositeGlyphFlags } from './enum';\nimport { BigEndianWriter } from './../../input-output/big-endian-writer';\nvar TtfReader = /** @class */ (function () {\n //Constructors\n function TtfReader(fontData) {\n this.int32Size = 4;\n this.isTtcFont = false;\n this.isMacTtf = false;\n this.metricsName = '';\n this.isMacTTF = false;\n this.missedGlyphs = 0;\n this.tableNames = ['cvt ', 'fpgm', 'glyf', 'head', 'hhea', 'hmtx', 'loca', 'maxp', 'prep'];\n this.entrySelectors = [0, 0, 1, 1, 2, 2, 2, 2, 3, 3, 3, 3, 3, 3, 3, 3, 4, 4, 4, 4, 4];\n this.fontData = fontData;\n this.initialize();\n }\n Object.defineProperty(TtfReader.prototype, \"macintosh\", {\n //Properties\n /**\n * Gets glyphs for Macintosh or Symbol fonts (char - key, glyph - value).\n */\n get: function () {\n if (this.macintoshDictionary === null || this.macintoshDictionary === undefined) {\n this.macintoshDictionary = new Dictionary();\n }\n return this.macintoshDictionary;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(TtfReader.prototype, \"microsoft\", {\n /**\n * Gets glyphs for Microsoft or Symbol fonts (char - key, glyph - value).\n */\n get: function () {\n if (this.microsoftDictionary === null || this.microsoftDictionary === undefined) {\n this.microsoftDictionary = new Dictionary();\n }\n return this.microsoftDictionary;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(TtfReader.prototype, \"macintoshGlyphs\", {\n /**\n * Gets glyphs for Macintosh or Symbol fonts (glyph index - key, glyph - value).\n */\n get: function () {\n if (this.internalMacintoshGlyphs === null || this.internalMacintoshGlyphs === undefined) {\n this.internalMacintoshGlyphs = new Dictionary();\n }\n return this.internalMacintoshGlyphs;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(TtfReader.prototype, \"microsoftGlyphs\", {\n /**\n * Gets glyphs for Microsoft Unicode fonts (glyph index - key, glyph - value).\n */\n get: function () {\n if (this.internalMicrosoftGlyphs === null || this.internalMicrosoftGlyphs === undefined) {\n this.internalMicrosoftGlyphs = new Dictionary();\n }\n return this.internalMicrosoftGlyphs;\n },\n enumerable: true,\n configurable: true\n });\n //Implementation\n TtfReader.prototype.initialize = function () {\n if (this.metrics === undefined) {\n this.metrics = new TtfMetrics();\n }\n this.readFontDictionary();\n var nameTable = this.readNameTable();\n var headTable = this.readHeadTable();\n this.initializeFontName(nameTable);\n this.metrics.macStyle = headTable.macStyle;\n };\n TtfReader.prototype.readFontDictionary = function () {\n this.offset = 0;\n var version = this.checkPreambula();\n //this.offset += 4;\n var numTables = this.readInt16(this.offset);\n var searchRange = this.readInt16(this.offset);\n var entrySelector = this.readInt16(this.offset);\n var rangeShift = this.readInt16(this.offset);\n if (this.tableDirectory === undefined) {\n this.tableDirectory = new Dictionary();\n }\n for (var i = 0; i < numTables; ++i) {\n var table = new TtfTableInfo();\n var tableKey = this.readString(this.int32Size);\n table.checksum = this.readInt32(this.offset);\n table.offset = this.readInt32(this.offset);\n table.length = this.readInt32(this.offset);\n this.tableDirectory.setValue(tableKey, table);\n }\n this.lowestPosition = this.offset;\n if (!this.isTtcFont) {\n this.fixOffsets();\n }\n };\n TtfReader.prototype.fixOffsets = function () {\n var minOffset = Number.MAX_VALUE;\n // Search for a smallest offset and compare it with the lowest position found.\n var tableKeys = this.tableDirectory.keys();\n for (var i = 0; i < tableKeys.length; i++) {\n var value = this.tableDirectory.getValue(tableKeys[i]);\n var offset = value.offset;\n if (minOffset > offset) {\n minOffset = offset;\n if (minOffset <= this.lowestPosition) {\n break;\n }\n }\n }\n var shift = minOffset - this.lowestPosition;\n if (shift !== 0) {\n var table = new Dictionary();\n for (var i = 0; i < tableKeys.length; i++) {\n var value = this.tableDirectory.getValue(tableKeys[i]);\n value.offset -= shift;\n table.setValue(tableKeys[i], value);\n }\n this.tableDirectory = table;\n }\n };\n TtfReader.prototype.checkPreambula = function () {\n var version = this.readInt32(this.offset);\n this.isMacTtf = (version === 0x74727565) ? true : false;\n if (version !== 0x10000 && version !== 0x74727565 && version !== 0x4f54544f) {\n this.isTtcFont = true;\n this.offset = 0;\n var fontTag = this.readString(4);\n if (fontTag !== 'ttcf') {\n throw new Error('Can not read TTF font data');\n }\n //skip 4\n this.offset += 4;\n var ttcIdentificationNumber = this.readInt32(this.offset);\n if (ttcIdentificationNumber < 0) {\n throw new Error('Can not read TTF font data');\n }\n this.offset = this.readInt32(this.offset);\n version = this.readInt32(this.offset);\n }\n return version;\n };\n TtfReader.prototype.readNameTable = function () {\n var tableInfo = this.getTable('name');\n this.offset = tableInfo.offset;\n var table = new TtfNameTable();\n table.formatSelector = this.readUInt16(this.offset);\n table.recordsCount = this.readUInt16(this.offset);\n table.offset = this.readUInt16(this.offset);\n table.nameRecords = [];\n var recordSize = 12;\n var position = this.offset;\n for (var i = 0; i < table.recordsCount; i++) {\n this.offset = position;\n var record = new TtfNameRecord();\n record.platformID = this.readUInt16(this.offset);\n record.encodingID = this.readUInt16(this.offset);\n record.languageID = this.readUInt16(this.offset);\n record.nameID = this.readUInt16(this.offset);\n record.length = this.readUInt16(this.offset);\n record.offset = this.readUInt16(this.offset);\n this.offset = tableInfo.offset + table.offset + record.offset;\n var unicode = (record.platformID === 0 || record.platformID === 3);\n record.name = this.readString(record.length, unicode);\n table.nameRecords[i] = record;\n position += recordSize;\n }\n return table;\n };\n TtfReader.prototype.readHeadTable = function () {\n var tableInfo = this.getTable('head');\n this.offset = tableInfo.offset;\n var table = new TtfHeadTable();\n table.version = this.readFixed(this.offset);\n table.fontRevision = this.readFixed(this.offset);\n table.checkSumAdjustment = this.readUInt32(this.offset);\n table.magicNumber = this.readUInt32(this.offset);\n table.flags = this.readUInt16(this.offset);\n table.unitsPerEm = this.readUInt16(this.offset);\n table.created = this.readInt64(this.offset);\n table.modified = this.readInt64(this.offset);\n table.xMin = this.readInt16(this.offset);\n table.yMin = this.readInt16(this.offset);\n table.xMax = this.readInt16(this.offset);\n table.yMax = this.readInt16(this.offset);\n table.macStyle = this.readUInt16(this.offset);\n table.lowestReadableSize = this.readUInt16(this.offset);\n table.fontDirectionHint = this.readInt16(this.offset);\n table.indexToLocalFormat = this.readInt16(this.offset);\n table.glyphDataFormat = this.readInt16(this.offset);\n return table;\n };\n TtfReader.prototype.readHorizontalHeaderTable = function () {\n var tableInfo = this.getTable('hhea');\n this.offset = tableInfo.offset;\n var table = new TtfHorizontalHeaderTable();\n table.version = this.readFixed(this.offset);\n table.ascender = this.readInt16(this.offset);\n table.descender = this.readInt16(this.offset);\n table.lineGap = this.readInt16(this.offset);\n table.advanceWidthMax = this.readUInt16(this.offset);\n table.minLeftSideBearing = this.readInt16(this.offset);\n table.minRightSideBearing = this.readInt16(this.offset);\n table.xMaxExtent = this.readInt16(this.offset);\n table.caretSlopeRise = this.readInt16(this.offset);\n table.caretSlopeRun = this.readInt16(this.offset);\n //skip 2 * 5\n this.offset += 10;\n table.metricDataFormat = this.readInt16(this.offset);\n table.numberOfHMetrics = this.readUInt16(this.offset);\n return table;\n };\n TtfReader.prototype.readOS2Table = function () {\n var tableInfo = this.getTable('OS/2');\n this.offset = tableInfo.offset;\n var table = new TtfOS2Table();\n table.version = this.readUInt16(this.offset);\n table.xAvgCharWidth = this.readInt16(this.offset);\n table.usWeightClass = this.readUInt16(this.offset);\n table.usWidthClass = this.readUInt16(this.offset);\n table.fsType = this.readInt16(this.offset);\n table.ySubscriptXSize = this.readInt16(this.offset);\n table.ySubscriptYSize = this.readInt16(this.offset);\n table.ySubscriptXOffset = this.readInt16(this.offset);\n table.ySubscriptYOffset = this.readInt16(this.offset);\n table.ySuperscriptXSize = this.readInt16(this.offset);\n table.ySuperscriptYSize = this.readInt16(this.offset);\n table.ySuperscriptXOffset = this.readInt16(this.offset);\n table.ySuperscriptYOffset = this.readInt16(this.offset);\n table.yStrikeoutSize = this.readInt16(this.offset);\n table.yStrikeoutPosition = this.readInt16(this.offset);\n table.sFamilyClass = this.readInt16(this.offset);\n table.panose = this.readBytes(10);\n table.ulUnicodeRange1 = this.readUInt32(this.offset);\n table.ulUnicodeRange2 = this.readUInt32(this.offset);\n table.ulUnicodeRange3 = this.readUInt32(this.offset);\n table.ulUnicodeRange4 = this.readUInt32(this.offset);\n table.vendorIdentifier = this.readBytes(4);\n table.fsSelection = this.readUInt16(this.offset);\n table.usFirstCharIndex = this.readUInt16(this.offset);\n table.usLastCharIndex = this.readUInt16(this.offset);\n table.sTypoAscender = this.readInt16(this.offset);\n table.sTypoDescender = this.readInt16(this.offset);\n table.sTypoLineGap = this.readInt16(this.offset);\n table.usWinAscent = this.readUInt16(this.offset);\n table.usWinDescent = this.readUInt16(this.offset);\n table.ulCodePageRange1 = this.readUInt32(this.offset);\n table.ulCodePageRange2 = this.readUInt32(this.offset);\n if (table.version > 1) {\n table.sxHeight = this.readInt16(this.offset);\n table.sCapHeight = this.readInt16(this.offset);\n table.usDefaultChar = this.readUInt16(this.offset);\n table.usBreakChar = this.readUInt16(this.offset);\n table.usMaxContext = this.readUInt16(this.offset);\n }\n else {\n table.sxHeight = 0;\n table.sCapHeight = 0;\n table.usDefaultChar = 0;\n table.usBreakChar = 0;\n table.usMaxContext = 0;\n }\n return table;\n };\n TtfReader.prototype.readPostTable = function () {\n var tableInfo = this.getTable('post');\n this.offset = tableInfo.offset;\n var table = new TtfPostTable();\n table.formatType = this.readFixed(this.offset);\n table.italicAngle = this.readFixed(this.offset);\n table.underlinePosition = this.readInt16(this.offset);\n table.underlineThickness = this.readInt16(this.offset);\n table.isFixedPitch = this.readUInt32(this.offset);\n table.minType42 = this.readUInt32(this.offset);\n table.maxType42 = this.readUInt32(this.offset);\n table.minType1 = this.readUInt32(this.offset);\n table.maxType1 = this.readUInt32(this.offset);\n return table;\n };\n /**\n * Reads Width of the glyphs.\n */\n TtfReader.prototype.readWidthTable = function (glyphCount, unitsPerEm) {\n var tableInfo = this.getTable('hmtx');\n this.offset = tableInfo.offset;\n var width = [];\n for (var i = 0; i < glyphCount; i++) {\n var glyph = new TtfLongHorMetric();\n glyph.advanceWidth = this.readUInt16(this.offset);\n glyph.lsb = this.readInt16(this.offset);\n var glyphWidth = glyph.advanceWidth * 1000 / unitsPerEm;\n width.push(Math.floor(glyphWidth));\n }\n return width;\n };\n /**\n * Reads the cmap table.\n */\n TtfReader.prototype.readCmapTable = function () {\n var tableInfo = this.getTable('cmap');\n this.offset = tableInfo.offset;\n var table = new TtfCmapTable();\n table.version = this.readUInt16(this.offset);\n table.tablesCount = this.readUInt16(this.offset);\n var position = this.offset;\n var subTables = [];\n for (var i = 0; i < table.tablesCount; i++) {\n this.offset = position;\n var subTable = new TtfCmapSubTable();\n subTable.platformID = this.readUInt16(this.offset);\n subTable.encodingID = this.readUInt16(this.offset);\n subTable.offset = this.readUInt32(this.offset);\n position = this.offset;\n this.readCmapSubTable(subTable);\n subTables[i] = subTable;\n }\n return subTables;\n };\n /**\n * Reads the cmap sub table.\n */\n TtfReader.prototype.readCmapSubTable = function (subTable) {\n var tableInfo = this.getTable('cmap');\n this.offset = tableInfo.offset + subTable.offset;\n var format = this.readUInt16(this.offset);\n var encoding = this.getCmapEncoding(subTable.platformID, subTable.encodingID);\n var platform = (encoding === TtfCmapEncoding.Macintosh) ? TtfPlatformID.Macintosh : TtfPlatformID.Microsoft;\n if (encoding !== TtfCmapEncoding.Unknown) {\n switch (format) {\n case TtfCmapFormat.Apple:\n this.readAppleCmapTable(subTable, encoding);\n break;\n case TtfCmapFormat.Microsoft:\n this.readMicrosoftCmapTable(subTable, encoding);\n break;\n case TtfCmapFormat.Trimmed:\n this.readTrimmedCmapTable(subTable, encoding);\n break;\n }\n }\n };\n /**\n * Reads Symbol cmap table.\n */\n TtfReader.prototype.readAppleCmapTable = function (subTable, encoding) {\n var tableInfo = this.getTable('cmap');\n this.offset = tableInfo.offset + subTable.offset;\n var table = new TtfAppleCmapSubTable();\n table.format = this.readUInt16(this.offset);\n table.length = this.readUInt16(this.offset);\n table.version = this.readUInt16(this.offset);\n if (this.maxMacIndex === null || this.maxMacIndex === undefined) {\n this.maxMacIndex = 0;\n }\n for (var i = 0; i < 256; ++i) {\n var glyphInfo = new TtfGlyphInfo();\n glyphInfo.index = this.readByte(this.offset);\n glyphInfo.width = this.getWidth(glyphInfo.index);\n glyphInfo.charCode = i;\n this.macintosh.setValue(i, glyphInfo);\n this.addGlyph(glyphInfo, encoding);\n // NOTE: this code fixes char codes that extends 0x100. However, it might corrupt something.\n this.maxMacIndex = Math.max(i, this.maxMacIndex);\n }\n };\n /**\n * Reads Symbol cmap table.\n */\n TtfReader.prototype.readMicrosoftCmapTable = function (subTable, encoding) {\n var tableInfo = this.getTable('cmap');\n this.offset = tableInfo.offset + subTable.offset;\n var collection = (encoding === TtfCmapEncoding.Unicode) ? this.microsoft : this.macintosh;\n var table = new TtfMicrosoftCmapSubTable();\n table.format = this.readUInt16(this.offset);\n table.length = this.readUInt16(this.offset);\n table.version = this.readUInt16(this.offset);\n table.segCountX2 = this.readUInt16(this.offset);\n table.searchRange = this.readUInt16(this.offset);\n table.entrySelector = this.readUInt16(this.offset);\n table.rangeShift = this.readUInt16(this.offset);\n var segCount = table.segCountX2 / 2;\n table.endCount = this.readUshortArray(segCount);\n table.reservedPad = this.readUInt16(this.offset);\n table.startCount = this.readUshortArray(segCount);\n table.idDelta = this.readUshortArray(segCount);\n table.idRangeOffset = this.readUshortArray(segCount);\n var length = (table.length / 2 - 8) - (segCount * 4);\n table.glyphID = this.readUshortArray(length);\n // Process glyphIdArray array.\n var codeOffset = 0;\n var index = 0;\n for (var j = 0; j < segCount; j++) {\n for (var k = table.startCount[j]; k <= table.endCount[j] && k !== 65535; k++) {\n if (table.idRangeOffset[j] === 0) {\n codeOffset = (k + table.idDelta[j]) & 65535;\n }\n else {\n index = j + table.idRangeOffset[j] / 2 - segCount + k - table.startCount[j];\n if (index >= table.glyphID.length) {\n continue;\n }\n codeOffset = (table.glyphID[index] + table.idDelta[j]) & 65535;\n }\n var glyph = new TtfGlyphInfo();\n glyph.index = codeOffset;\n glyph.width = this.getWidth(glyph.index);\n var id = (encoding === TtfCmapEncoding.Symbol) ? ((k & 0xff00) === 0xf000 ? k & 0xff : k) : k;\n glyph.charCode = id;\n collection.setValue(id, glyph);\n this.addGlyph(glyph, encoding);\n }\n }\n };\n /**\n * Reads Trimed cmap table.\n */\n TtfReader.prototype.readTrimmedCmapTable = function (subTable, encoding) {\n var tableInfo = this.getTable('cmap');\n this.offset = tableInfo.offset + subTable.offset;\n var table = new TtfTrimmedCmapSubTable();\n table.format = this.readUInt16(this.offset);\n table.length = this.readUInt16(this.offset);\n table.version = this.readUInt16(this.offset);\n table.firstCode = this.readUInt16(this.offset);\n table.entryCount = this.readUInt16(this.offset);\n for (var i = 0; i < table.entryCount; ++i) {\n var glyphInfo = new TtfGlyphInfo();\n glyphInfo.index = this.readUInt16(this.offset);\n glyphInfo.width = this.getWidth(glyphInfo.index);\n glyphInfo.charCode = i + table.firstCode;\n this.macintosh.setValue(i, glyphInfo);\n this.addGlyph(glyphInfo, encoding);\n // NOTE: this code fixes char codes that extends 0x100. However, it might corrupt something.\n this.maxMacIndex = Math.max(i, this.maxMacIndex);\n }\n };\n TtfReader.prototype.initializeFontName = function (nameTable) {\n for (var i = 0; i < nameTable.recordsCount; i++) {\n var record = nameTable.nameRecords[i];\n if (record.nameID === 1) {\n //font family\n this.metrics.fontFamily = record.name;\n }\n else if (record.nameID === 6) {\n //post script name\n this.metrics.postScriptName = record.name;\n }\n /* tslint:disable */\n if (this.metrics.fontFamily !== null && this.metrics.fontFamily !== undefined && this.metrics.postScriptName !== null && this.metrics.postScriptName !== undefined) {\n break;\n }\n /* tslint:disable */\n }\n };\n TtfReader.prototype.getTable = function (name) {\n // if (name === null) {\n // throw new Error('Argument Null Exception : name');\n // }\n var table = new TtfTableInfo();\n var obj;\n if (this.tableDirectory.containsKey(name)) {\n obj = this.tableDirectory.getValue(name);\n }\n if (obj !== null && obj !== undefined) {\n table = obj;\n }\n return table;\n };\n /**\n * Returns width of the glyph.\n */\n TtfReader.prototype.getWidth = function (glyphCode) {\n glyphCode = (glyphCode < this.width.length) ? glyphCode : this.width.length - 1;\n return this.width[glyphCode];\n };\n /**\n * Gets CMAP encoding based on platform ID and encoding ID.\n */\n /* tslint:disable */\n TtfReader.prototype.getCmapEncoding = function (platformID, encodingID) {\n var format = TtfCmapEncoding.Unknown;\n if (platformID == TtfPlatformID.Microsoft && encodingID == TtfMicrosoftEncodingID.Undefined) {\n // When building a symbol font for Windows,\n // the platform ID should be 3 and the encoding ID should be 0.\n format = TtfCmapEncoding.Symbol;\n }\n else if (platformID == TtfPlatformID.Microsoft && encodingID == TtfMicrosoftEncodingID.Unicode) {\n // When building a Unicode font for Windows,\n // the platform ID should be 3 and the encoding ID should be 1.\n format = TtfCmapEncoding.Unicode;\n }\n else if (platformID == TtfPlatformID.Macintosh && encodingID == TtfMacintoshEncodingID.Roman) {\n // When building a font that will be used on the Macintosh,\n // the platform ID should be 1 and the encoding ID should be 0.\n format = TtfCmapEncoding.Macintosh;\n }\n return format;\n };\n /* tslint:enable */\n /**\n * Adds glyph to the collection.\n */\n TtfReader.prototype.addGlyph = function (glyph, encoding) {\n var collection = null;\n switch (encoding) {\n case TtfCmapEncoding.Unicode:\n collection = this.microsoftGlyphs;\n break;\n case TtfCmapEncoding.Macintosh:\n case TtfCmapEncoding.Symbol:\n collection = this.macintoshGlyphs;\n break;\n }\n collection.setValue(glyph.index, glyph);\n };\n /**\n * Initializes metrics.\n */\n /* tslint:disable */\n TtfReader.prototype.initializeMetrics = function (nameTable, headTable, horizontalHeadTable, os2Table, postTable, cmapTables) {\n /* tslint:enable */\n // if (cmapTables === null) {\n // throw new Error('ArgumentNullException : cmapTables');\n // }\n this.initializeFontName(nameTable);\n // Get font encoding.\n var bSymbol = false;\n for (var i = 0; i < cmapTables.length; i++) {\n var subTable = cmapTables[i];\n var encoding = this.getCmapEncoding(subTable.platformID, subTable.encodingID);\n if (encoding === TtfCmapEncoding.Symbol) {\n bSymbol = true;\n break;\n }\n }\n this.metrics.isSymbol = bSymbol;\n this.metrics.macStyle = headTable.macStyle;\n this.metrics.isFixedPitch = (postTable.isFixedPitch !== 0);\n this.metrics.italicAngle = postTable.italicAngle;\n var factor = 1000 / headTable.unitsPerEm;\n this.metrics.winAscent = os2Table.sTypoAscender * factor;\n this.metrics.macAscent = horizontalHeadTable.ascender * factor;\n //m_metrics.MacAscent = os2Table.UsWinAscent * factor;\n // NOTE: This is stange workaround. The value is good if os2Table.SCapHeight != 0, otherwise it should be properly computed.\n this.metrics.capHeight = (os2Table.sCapHeight !== 0) ? os2Table.sCapHeight : 0.7 * headTable.unitsPerEm * factor;\n this.metrics.winDescent = os2Table.sTypoDescender * factor;\n this.metrics.macDescent = horizontalHeadTable.descender * factor;\n //m_metrics.MacDescent = -os2Table.UsWinDescent * factor;\n this.metrics.leading = (os2Table.sTypoAscender - os2Table.sTypoDescender + os2Table.sTypoLineGap) * factor;\n this.metrics.lineGap = Math.ceil(horizontalHeadTable.lineGap * factor);\n var left = headTable.xMin * factor;\n var top = Math.ceil(this.metrics.macAscent + this.metrics.lineGap);\n var right = headTable.xMax * factor;\n var bottom = this.metrics.macDescent;\n this.metrics.fontBox = new Rectangle(left, top, right, bottom);\n // NOTE: Strange!\n this.metrics.stemV = 80;\n this.metrics.widthTable = this.updateWidth();\n this.metrics.contains = this.tableDirectory.containsKey('CFF');\n this.metrics.subScriptSizeFactor = headTable.unitsPerEm / os2Table.ySubscriptYSize;\n this.metrics.superscriptSizeFactor = headTable.unitsPerEm / os2Table.ySuperscriptYSize;\n };\n /**\n * Updates chars structure which is used in the case of ansi encoding (256 bytes).\n */\n TtfReader.prototype.updateWidth = function () {\n var count = 256;\n var bytes = [];\n if (this.metrics.isSymbol) {\n for (var i = 0; i < count; i++) {\n var glyphInfo = this.getGlyph(String.fromCharCode(i));\n bytes[i] = (glyphInfo.empty) ? 0 : glyphInfo.width;\n }\n }\n else {\n var byteToProcess = [];\n var unknown = '?';\n var space = String.fromCharCode(32);\n for (var i = 0; i < count; i++) {\n byteToProcess[0] = i;\n var text = this.getString(byteToProcess, 0, byteToProcess.length);\n var ch = (text.length > 0) ? text[0] : unknown;\n var glyphInfo = this.getGlyph(ch);\n if (!glyphInfo.empty) {\n bytes[i] = glyphInfo.width;\n }\n else {\n glyphInfo = this.getGlyph(space);\n bytes[i] = (glyphInfo.empty) ? 0 : glyphInfo.width;\n }\n }\n }\n return bytes;\n };\n /**\n * Returns default glyph.\n */\n TtfReader.prototype.getDefaultGlyph = function () {\n var glyph = this.getGlyph(StringTokenizer.whiteSpace);\n return glyph;\n };\n /**\n * Reads unicode string from byte array.\n */\n TtfReader.prototype.getString = function (byteToProcess, start, length) {\n var result = '';\n for (var index = 0; index < length; index++) {\n result += String.fromCharCode(byteToProcess[index + start]);\n }\n return result;\n };\n /**\n * Reads loca table.\n */\n TtfReader.prototype.readLocaTable = function (bShort) {\n var tableInfo = this.getTable('loca');\n this.offset = tableInfo.offset;\n var table = new TtfLocaTable();\n var buffer = null;\n if (bShort) {\n var len = tableInfo.length / 2;\n buffer = [];\n for (var i = 0; i < len; i++) {\n buffer[i] = this.readUInt16(this.offset) * 2;\n }\n }\n else {\n var len = tableInfo.length / 4;\n buffer = [];\n for (var i = 0; i < len; i++) {\n buffer[i] = this.readUInt32(this.offset);\n }\n }\n table.offsets = buffer;\n return table;\n };\n /**\n * Updates hash table of used glyphs.\n */\n TtfReader.prototype.updateGlyphChars = function (glyphChars, locaTable) {\n // if (glyphChars === null) {\n // throw new Error('Argument Null Exception : glyphChars');\n // }\n // Add zero key.\n if (!glyphChars.containsKey(0)) {\n glyphChars.setValue(0, 0);\n }\n var clone = new Dictionary();\n var glyphCharKeys = glyphChars.keys();\n for (var i = 0; i < glyphCharKeys.length; i++) {\n clone.setValue(glyphCharKeys[i], glyphChars.getValue(glyphCharKeys[i]));\n }\n for (var i = 0; i < glyphCharKeys.length; i++) {\n var nextKey = glyphCharKeys[i];\n this.processCompositeGlyph(glyphChars, nextKey, locaTable);\n }\n };\n /**\n * Checks if glyph is composite or not.\n */\n TtfReader.prototype.processCompositeGlyph = function (glyphChars, glyph, locaTable) {\n // if (glyphChars === null) {\n // throw new Error('Argument Null Exception : glyphChars');\n // }\n // Is in range.\n if (glyph < locaTable.offsets.length - 1) {\n var glyphOffset = locaTable.offsets[glyph];\n if (glyphOffset !== locaTable.offsets[glyph + 1]) {\n var tableInfo = this.getTable('glyf');\n this.offset = tableInfo.offset + glyphOffset;\n var glyphHeader = new TtfGlyphHeader();\n glyphHeader.numberOfContours = this.readInt16(this.offset);\n glyphHeader.xMin = this.readInt16(this.offset);\n glyphHeader.yMin = this.readInt16(this.offset);\n glyphHeader.xMax = this.readInt16(this.offset);\n glyphHeader.yMax = this.readInt16(this.offset);\n // Glyph is composite.\n if (glyphHeader.numberOfContours < 0) {\n var skipBytes = 0;\n var entry = true;\n while (entry) {\n var flags = this.readUInt16(this.offset);\n var glyphIndex = this.readUInt16(this.offset);\n if (!glyphChars.containsKey(glyphIndex)) {\n glyphChars.setValue(glyphIndex, 0);\n }\n if ((flags & TtfCompositeGlyphFlags.MoreComponents) === 0) {\n break;\n }\n skipBytes = ((flags & TtfCompositeGlyphFlags.Arg1And2AreWords) !== 0) ? 4 : 2;\n if ((flags & TtfCompositeGlyphFlags.WeHaveScale) !== 0) {\n skipBytes += 2;\n }\n else if ((flags & TtfCompositeGlyphFlags.WeHaveAnXyScale) !== 0) {\n skipBytes += 4;\n }\n else if ((flags & TtfCompositeGlyphFlags.WeHaveTwoByTwo) !== 0) {\n skipBytes += 2 * 4;\n }\n this.offset += skipBytes;\n }\n }\n }\n }\n };\n /**\n * Creates new glyph tables based on chars that are used for output.\n */\n /* tslint:disable */\n TtfReader.prototype.generateGlyphTable = function (glyphChars, locaTable, newLocaTable, newGlyphTable) {\n /* tslint:enable */\n // if (glyphChars === null) {\n // throw new Error('Argument Null Exception : glyphChars');\n // }\n newLocaTable = [];\n // Sorting used glyphs keys.\n var activeGlyphs = glyphChars.keys();\n activeGlyphs.sort(function (a, b) { return a - b; });\n var glyphSize = 0;\n for (var i = 0; i < activeGlyphs.length; i++) {\n var glyphIndex = activeGlyphs[i];\n if (locaTable.offsets.length > 0) {\n glyphSize += locaTable.offsets[glyphIndex + 1] - locaTable.offsets[glyphIndex];\n }\n }\n var glyphSizeAligned = this.align(glyphSize);\n newGlyphTable = [];\n for (var i = 0; i < glyphSizeAligned; i++) {\n newGlyphTable.push(0);\n }\n var nextGlyphOffset = 0;\n var nextGlyphIndex = 0;\n var table = this.getTable('glyf');\n // Creating NewLocaTable - that would hold offsets for filtered glyphs.\n for (var i = 0; i < locaTable.offsets.length; i++) {\n newLocaTable.push(nextGlyphOffset);\n if (nextGlyphIndex < activeGlyphs.length && activeGlyphs[nextGlyphIndex] === i) {\n ++nextGlyphIndex;\n newLocaTable[i] = nextGlyphOffset;\n var oldGlyphOffset = locaTable.offsets[i];\n var oldNextGlyphOffset = locaTable.offsets[i + 1] - oldGlyphOffset;\n if (oldNextGlyphOffset > 0) {\n this.offset = table.offset + oldGlyphOffset;\n var result = this.read(newGlyphTable, nextGlyphOffset, oldNextGlyphOffset);\n newGlyphTable = result.buffer;\n nextGlyphOffset += oldNextGlyphOffset;\n }\n }\n }\n return { glyphTableSize: glyphSize, newLocaTable: newLocaTable, newGlyphTable: newGlyphTable };\n };\n /**\n * Updates new Loca table.\n */\n /* tslint:disable */\n TtfReader.prototype.updateLocaTable = function (newLocaTable, bLocaIsShort, newLocaTableOut) {\n /* tslint:enable */\n if (newLocaTable === null) {\n throw new Error('Argument Null Exception : newLocaTable');\n }\n var size = (bLocaIsShort) ? newLocaTable.length * 2 : newLocaTable.length * 4;\n var count = this.align(size);\n //BigEndianWiter\n var writer = new BigEndianWriter(count);\n for (var i = 0; i < newLocaTable.length; i++) {\n var value = newLocaTable[i];\n if (bLocaIsShort) {\n value /= 2;\n writer.writeShort(value);\n }\n else {\n writer.writeInt(value);\n }\n }\n return { newLocaUpdated: writer.data, newLocaSize: size };\n };\n /**\n * Aligns number to be divisible on 4.\n */\n TtfReader.prototype.align = function (value) {\n return (value + 3) & (~3);\n };\n /**\n * Returns font program data.\n */\n /* tslint:disable */\n TtfReader.prototype.getFontProgram = function (newLocaTableOut, newGlyphTable, glyphTableSize, locaTableSize) {\n /* tslint:enable */\n if (newLocaTableOut === null) {\n throw new Error('Argument Null Exception : newLocaTableOut');\n }\n if (newGlyphTable === null) {\n throw new Error('Argument Null Exception : newGlyphTable');\n }\n var tableNames = this.tableNames;\n var result = this.getFontProgramLength(newLocaTableOut, newGlyphTable, 0);\n var fontProgramLength = result.fontProgramLength;\n var numTables = result.numTables;\n var writer = new BigEndianWriter(fontProgramLength);\n writer.writeInt(0x10000);\n writer.writeShort(numTables);\n var entrySelector = this.entrySelectors[numTables];\n writer.writeShort((1 << (entrySelector & 31)) * 16);\n writer.writeShort(entrySelector);\n writer.writeShort((numTables - (1 << (entrySelector & 31))) * 16);\n // Writing to destination buffer - checksums && sizes of used tables.\n this.writeCheckSums(writer, numTables, newLocaTableOut, newGlyphTable, glyphTableSize, locaTableSize);\n // // Writing to destination buffer - used glyphs.\n this.writeGlyphs(writer, newLocaTableOut, newGlyphTable);\n return writer.data;\n };\n /* tslint:disable */\n TtfReader.prototype.getFontProgramLength = function (newLocaTableOut, newGlyphTable, numTables) {\n /* tslint:enable */\n if (newLocaTableOut === null) {\n throw new Error('Argument Null Exception : newLocaTableOut');\n }\n if (newGlyphTable === null) {\n throw new Error('Argument Null Exception : newGlyphTable');\n }\n // glyf and loca are used by default;\n numTables = 2;\n var tableNames = this.tableNames;\n var fontProgramLength = 0;\n for (var i = 0; i < tableNames.length; i++) {\n var tableName = tableNames[i];\n if (tableName !== 'glyf' && tableName !== 'loca') {\n var table = this.getTable(tableName);\n if (!table.empty) {\n ++numTables;\n fontProgramLength += this.align(table.length);\n }\n }\n }\n fontProgramLength += newLocaTableOut.length;\n fontProgramLength += newGlyphTable.length;\n var usedTablesSize = numTables * 16 + (3 * 4);\n fontProgramLength += usedTablesSize;\n return { fontProgramLength: fontProgramLength, numTables: numTables };\n };\n /**\n * Writing to destination buffer - checksums and sizes of used tables.\n */\n /* tslint:disable */\n TtfReader.prototype.writeCheckSums = function (writer, numTables, newLocaTableOut, newGlyphTable, glyphTableSize, locaTableSize) {\n /* tslint:enable */\n if (writer === null) {\n throw new Error('Argument Null Exception : writer');\n }\n if (newLocaTableOut === null) {\n throw new Error('Argument Null Exception : newLocaTableOut');\n }\n if (newGlyphTable === null) {\n throw new Error('Argument Null Exception : newGlyphTable');\n }\n var tableNames = this.tableNames;\n var usedTablesSize = numTables * 16 + (3 * 4);\n var nextTableSize = 0;\n for (var i = 0; i < tableNames.length; i++) {\n var tableName = tableNames[i];\n var tableInfo = this.getTable(tableName);\n if (tableInfo.empty) {\n continue;\n }\n writer.writeString(tableName);\n if (tableName === 'glyf') {\n var checksum = this.calculateCheckSum(newGlyphTable);\n writer.writeInt(checksum);\n nextTableSize = glyphTableSize;\n }\n else if (tableName === 'loca') {\n var checksum = this.calculateCheckSum(newLocaTableOut);\n writer.writeInt(checksum);\n nextTableSize = locaTableSize;\n }\n else {\n writer.writeInt(tableInfo.checksum);\n nextTableSize = tableInfo.length;\n }\n writer.writeUInt(usedTablesSize);\n writer.writeUInt(nextTableSize);\n usedTablesSize += this.align(nextTableSize);\n }\n };\n /**\n * Gets checksum from source buffer.\n */\n TtfReader.prototype.calculateCheckSum = function (bytes) {\n if (bytes === null) {\n throw new Error('Argument Null Exception : bytes');\n }\n var pos = 0;\n var byte1 = 0;\n var byte2 = 0;\n var byte3 = 0;\n var byte4 = 0;\n for (var i = 0; i < (bytes.length + 1) / 4; i++) {\n byte4 += (bytes[pos++] & 255);\n byte3 += (bytes[pos++] & 255);\n byte2 += (bytes[pos++] & 255);\n byte1 += (bytes[pos++] & 255);\n }\n var result = byte1;\n result += (byte2 << 8);\n result += (byte3 << 16);\n result += (byte4 << 24);\n return result;\n };\n /**\n * Writing to destination buffer - used glyphs.\n */\n TtfReader.prototype.writeGlyphs = function (writer, newLocaTable, newGlyphTable) {\n if (writer === null) {\n throw new Error('Argument Null Exception : writer');\n }\n if (newLocaTable === null) {\n throw new Error('Argument Null Exception : newLocaTableOut');\n }\n if (newGlyphTable === null) {\n throw new Error('Argument Null Exception : newGlyphTable');\n }\n var tableNames = this.tableNames;\n for (var i = 0; i < tableNames.length; i++) {\n var tableName = tableNames[i];\n var tableInfo = this.getTable(tableName);\n if (tableInfo.empty) {\n continue;\n }\n if (tableName === 'glyf') {\n writer.writeBytes(newGlyphTable);\n }\n else if (tableName === 'loca') {\n writer.writeBytes(newLocaTable);\n }\n else {\n var count = this.align(tableInfo.length);\n var buff = [];\n for (var i_1 = 0; i_1 < count; i_1++) {\n buff.push(0);\n }\n this.offset = tableInfo.offset;\n var result = this.read(buff, 0, tableInfo.length);\n writer.writeBytes(result.buffer);\n }\n }\n };\n //public methods\n /**\n * Sets position value of font data.\n */\n TtfReader.prototype.setOffset = function (offset) {\n this.offset = offset;\n };\n /**\n * Creates font Internals\n * @private\n */\n TtfReader.prototype.createInternals = function () {\n this.metrics = new TtfMetrics();\n var nameTable = this.readNameTable();\n var headTable = this.readHeadTable();\n this.bIsLocaShort = (headTable.indexToLocalFormat === 0);\n var horizontalHeadTable = this.readHorizontalHeaderTable();\n var os2Table = this.readOS2Table();\n var postTable = this.readPostTable();\n this.width = this.readWidthTable(horizontalHeadTable.numberOfHMetrics, headTable.unitsPerEm);\n var subTables = this.readCmapTable();\n this.initializeMetrics(nameTable, headTable, horizontalHeadTable, os2Table, postTable, subTables);\n };\n TtfReader.prototype.getGlyph = function (charCode) {\n if (typeof charCode === 'number') {\n var obj1 = null;\n if (!this.metrics.isSymbol && this.microsoftGlyphs != null) {\n if (this.microsoftGlyphs.containsKey(charCode)) {\n obj1 = this.microsoftGlyphs.getValue(charCode);\n }\n }\n else if (this.metrics.isSymbol && this.macintoshGlyphs != null) {\n if (this.macintoshGlyphs.containsKey(charCode)) {\n obj1 = this.macintoshGlyphs.getValue(charCode);\n }\n }\n var glyph = (obj1 != null) ? obj1 : this.getDefaultGlyph();\n return glyph;\n }\n else {\n var obj = null;\n var code = charCode.charCodeAt(0);\n if (!this.metrics.isSymbol && this.microsoft !== null) {\n if (this.microsoft.containsKey(code)) {\n obj = this.microsoft.getValue(code);\n if (code !== StringTokenizer.whiteSpace.charCodeAt(0)) {\n this.isFontPresent = true;\n }\n }\n else if (code !== StringTokenizer.whiteSpace.charCodeAt(0)) {\n this.isFontPresent = false;\n }\n }\n else if (this.metrics.isSymbol && this.macintosh !== null || this.isMacTTF) {\n // NOTE: this code fixes char codes that extends 0x100. However, it might corrupt something.\n if (this.maxMacIndex !== 0) {\n code %= this.maxMacIndex + 1;\n }\n else {\n code = ((code & 0xff00) === 0xf000 ? code & 0xff : code);\n }\n if (this.macintosh.containsKey(code)) {\n obj = this.macintosh.getValue(code);\n this.isFontPresent = true;\n }\n }\n // Fix for StackOverFlow exception in XPS to PDF converter\n if (charCode === StringTokenizer.whiteSpace && obj === null) {\n obj = new TtfGlyphInfo();\n }\n var glyph = (obj !== null) ? obj : this.getDefaultGlyph();\n return glyph;\n }\n };\n /**\n * Gets hash table with chars indexed by glyph index.\n */\n TtfReader.prototype.getGlyphChars = function (chars) {\n if (chars === null || chars === undefined) {\n throw new Error('Argument Null Exception : chars');\n }\n var dictionary = new Dictionary();\n var charKeys = chars.keys();\n for (var i = 0; i < charKeys.length; i++) {\n var ch = charKeys[i];\n var glyph = this.getGlyph(ch);\n if (!glyph.empty) {\n dictionary.setValue(glyph.index, ch.charCodeAt(0));\n }\n }\n return dictionary;\n };\n /**\n * Gets all glyphs.\n */\n TtfReader.prototype.getAllGlyphs = function () {\n var allGlyphInfo = [];\n var info = new TtfGlyphInfo();\n var index = 0;\n for (var i = 0; i < this.width.length; i++) {\n var width = this.width[i];\n info.index = index;\n info.width = width;\n allGlyphInfo.push(info);\n index++;\n }\n return allGlyphInfo;\n };\n /**\n * Reads a font's program.\n * @private\n */\n TtfReader.prototype.readFontProgram = function (chars) {\n var glyphChars = this.getGlyphChars(chars);\n var locaTable = this.readLocaTable(this.bIsLocaShort);\n if (glyphChars.size() < chars.size()) {\n this.missedGlyphs = chars.size() - glyphChars.size();\n }\n this.updateGlyphChars(glyphChars, locaTable);\n /* tslint:disable */\n var result1 = this.generateGlyphTable(glyphChars, locaTable, null, null);\n /* tslint:enable */\n var glyphTableSize = result1.glyphTableSize;\n var newLocaTable = result1.newLocaTable;\n var newGlyphTable = result1.newGlyphTable;\n var result2 = this.updateLocaTable(newLocaTable, this.bIsLocaShort, null);\n var newLocaSize = result2.newLocaSize;\n var newLocaUpdated = result2.newLocaUpdated;\n var fontProgram = this.getFontProgram(newLocaUpdated, newGlyphTable, glyphTableSize, newLocaSize);\n return fontProgram;\n };\n /**\n * Reconverts string to be in proper format saved into PDF file.\n */\n TtfReader.prototype.convertString = function (text) {\n if (text === null) {\n throw new Error('Argument Null Exception : text');\n }\n var glyph = '';\n var i = 0;\n for (var k = 0; k < text.length; k++) {\n var ch = text[k];\n var glyphInfo = this.getGlyph(ch);\n if (!glyphInfo.empty) {\n glyph += String.fromCharCode(glyphInfo.index);\n i++;\n }\n }\n return glyph;\n };\n /**\n * Gets char width.\n */\n TtfReader.prototype.getCharWidth = function (code) {\n var glyphInfo = this.getGlyph(code);\n glyphInfo = (!glyphInfo.empty) ? glyphInfo : this.getDefaultGlyph();\n var codeWidth = (!glyphInfo.empty) ? glyphInfo.width : 0;\n return codeWidth;\n };\n TtfReader.prototype.readString = function (length, isUnicode) {\n if (isUnicode === undefined) {\n return this.readString(length, false);\n }\n else {\n //let buffer : number[] = this.readBytes(length);\n var result = '';\n if (isUnicode) {\n for (var i = 0; i < length; i++) {\n if (i % 2 !== 0) {\n result += String.fromCharCode(this.fontData[this.offset]);\n }\n this.offset += 1;\n }\n }\n else {\n for (var i = 0; i < length; i++) {\n result += String.fromCharCode(this.fontData[this.offset]);\n this.offset += 1;\n }\n }\n return result;\n }\n };\n TtfReader.prototype.readFixed = function (offset) {\n var integer = this.readInt16(offset);\n var sFraction = this.readInt16(offset + 2);\n var fraction = sFraction / 16384;\n return integer + fraction;\n };\n TtfReader.prototype.readInt32 = function (offset) {\n var i1 = this.fontData[offset + 3];\n var i2 = this.fontData[offset + 2];\n var i3 = this.fontData[offset + 1];\n var i4 = this.fontData[offset];\n this.offset += 4;\n return i1 + (i2 << 8) + (i3 << 16) + (i4 << 24);\n };\n TtfReader.prototype.readUInt32 = function (offset) {\n var i1 = this.fontData[offset + 3];\n var i2 = this.fontData[offset + 2];\n var i3 = this.fontData[offset + 1];\n var i4 = this.fontData[offset];\n this.offset += 4;\n return (i1 | i2 << 8 | i3 << 16 | i4 << 24);\n };\n // private readInt16(offset : number) : number {\n // let result : number = (this.fontData[offset] << 8) + this.fontData[offset + 1];\n // this.offset += 2;\n // return result;\n // }\n TtfReader.prototype.readInt16 = function (offset) {\n var result = (this.fontData[offset] << 8) + this.fontData[offset + 1];\n result = result & (1 << 15) ? result - 0x10000 : result;\n this.offset += 2;\n return result;\n };\n TtfReader.prototype.readInt64 = function (offset) {\n var low = this.readInt32(offset + 4);\n var n = this.readInt32(offset) * 4294967296.0 + low;\n if (low < 0) {\n n += 4294967296;\n }\n return n;\n };\n TtfReader.prototype.readUInt16 = function (offset) {\n var result = (this.fontData[offset] << 8) | this.fontData[offset + 1];\n this.offset += 2;\n return result;\n };\n /**\n * Reads ushort array.\n */\n TtfReader.prototype.readUshortArray = function (length) {\n var buffer = [];\n for (var i = 0; i < length; i++) {\n buffer[i] = this.readUInt16(this.offset);\n }\n return buffer;\n };\n TtfReader.prototype.readBytes = function (length) {\n var result = [];\n for (var i = 0; i < length; i++) {\n result.push(this.fontData[this.offset]);\n this.offset += 1;\n }\n return result;\n };\n TtfReader.prototype.readByte = function (offset) {\n var result = this.fontData[offset];\n this.offset += 1;\n return result;\n };\n /**\n * Reads bytes to array in BigEndian order.\n * @private\n */\n TtfReader.prototype.read = function (buffer, index, count) {\n if (buffer === null) {\n throw new Error('Argument Null Exception : buffer');\n }\n var written = 0;\n var read = 0;\n do {\n for (var i = 0; (i < count - written) && (this.offset + i < this.fontData.length); i++) {\n buffer[index + i] = this.fontData[this.offset + i];\n }\n read = count - written;\n this.offset += read;\n written += read;\n } while (written < count);\n return { buffer: buffer, written: written };\n };\n return TtfReader;\n}());\nexport { TtfReader };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfFont } from './pdf-font';\nimport { PdfSubSuperScript } from './enum';\nimport { PdfArray } from './../../primitives/pdf-array';\n/**\n * `Metrics` of the font.\n * @private\n */\nvar PdfFontMetrics = /** @class */ (function () {\n function PdfFontMetrics() {\n /**\n * `Line gap`.\n * @private\n */\n this.lineGap = 0;\n }\n // Public methods\n /**\n * Returns `ascent` taking into consideration font`s size.\n * @private\n */\n PdfFontMetrics.prototype.getAscent = function (format) {\n var returnValue = this.ascent * PdfFont.charSizeMultiplier * this.getSize(format);\n return returnValue;\n };\n /**\n * Returns `descent` taking into consideration font`s size.\n * @private\n */\n PdfFontMetrics.prototype.getDescent = function (format) {\n var returnValue = this.descent * PdfFont.charSizeMultiplier * this.getSize(format);\n return returnValue;\n };\n /**\n * Returns `Line gap` taking into consideration font`s size.\n * @private\n */\n PdfFontMetrics.prototype.getLineGap = function (format) {\n var returnValue = this.lineGap * PdfFont.charSizeMultiplier * this.getSize(format);\n return returnValue;\n };\n /**\n * Returns `height` taking into consideration font`s size.\n * @private\n */\n PdfFontMetrics.prototype.getHeight = function (format) {\n var height;\n var clearTypeFonts = ['cambria', 'candara', 'constantia', 'corbel', 'cariadings'];\n var clearTypeFontCollection = [];\n for (var index = 0; index < clearTypeFonts.length; index++) {\n var font = clearTypeFonts[index];\n clearTypeFontCollection.push(font);\n }\n if (this.getDescent(format) < 0) {\n // if ((clearTypeFontCollection.indexOf(this.name.toLowerCase()) !== -1) && !this.isUnicodeFont) {\n // height = (this.GetAscent(format) - this.GetDescent(format) - this.GetLineGap(format));\n // } else {\n height = (this.getAscent(format) - this.getDescent(format) + this.getLineGap(format));\n // }\n }\n else {\n height = (this.getAscent(format) + this.getDescent(format) + this.getLineGap(format));\n }\n return height;\n };\n /**\n * Calculates `size` of the font depending on the subscript/superscript value.\n * @private\n */\n PdfFontMetrics.prototype.getSize = function (format) {\n var size = this.size;\n if (format != null) {\n switch (format.subSuperScript) {\n case PdfSubSuperScript.SubScript:\n size /= this.subScriptSizeFactor;\n break;\n case PdfSubSuperScript.SuperScript:\n size /= this.superscriptSizeFactor;\n break;\n }\n }\n return size;\n };\n /**\n * `Clones` the metrics.\n * @private\n */\n PdfFontMetrics.prototype.clone = function () {\n var metrics = this;\n metrics.widthTable = WidthTable.clone();\n return metrics;\n };\n Object.defineProperty(PdfFontMetrics.prototype, \"widthTable\", {\n // Properies\n /**\n * Gets or sets the `width table`.\n * @private\n */\n get: function () {\n return this.internalWidthTable;\n },\n set: function (value) {\n this.internalWidthTable = value;\n },\n enumerable: true,\n configurable: true\n });\n return PdfFontMetrics;\n}());\nexport { PdfFontMetrics };\nvar WidthTable = /** @class */ (function () {\n function WidthTable() {\n }\n /**\n * Static `clones` this instance of the WidthTable class.\n * @private\n */\n WidthTable.clone = function () {\n return null;\n };\n return WidthTable;\n}());\nexport { WidthTable };\nvar StandardWidthTable = /** @class */ (function (_super) {\n __extends(StandardWidthTable, _super);\n // Constructors\n /**\n * Initializes a new instance of the `StandardWidthTable` class.\n * @private\n */\n function StandardWidthTable(widths) {\n var _this = _super.call(this) || this;\n if (widths == null) {\n throw new Error('ArgumentNullException:widths');\n }\n _this.widths = widths;\n return _this;\n }\n //Properties\n /**\n * Gets the `32 bit number` at the specified index.\n * @private\n */\n StandardWidthTable.prototype.items = function (index) {\n if (index < 0 || index >= this.widths.length) {\n throw new Error('ArgumentOutOfRangeException:index, The character is not supported by the font.');\n }\n var result = this.widths[index];\n return result;\n };\n Object.defineProperty(StandardWidthTable.prototype, \"length\", {\n /**\n * Gets the `length` of the internal array.\n * @private\n */\n get: function () {\n return this.widths.length;\n },\n enumerable: true,\n configurable: true\n });\n //Overrides\n /**\n * `Clones` this instance of the WidthTable class.\n * @private\n */\n StandardWidthTable.prototype.clone = function () {\n var swt = this;\n swt.widths = this.widths;\n return swt;\n };\n /**\n * Converts width table to a `PDF array`.\n * @private\n */\n StandardWidthTable.prototype.toArray = function () {\n var arr = new PdfArray(this.widths);\n return arr;\n };\n return StandardWidthTable;\n}(WidthTable));\nexport { StandardWidthTable };\n","/**\n * TrueTypeFont.ts class for EJ2-PDF\n */\nimport { ByteArray } from './../../graphics/images/index';\nimport { TtfReader } from './ttf-reader';\nimport { PdfDictionary, SaveDescendantFontEventHandler, SaveFontDictionaryEventHandler } from './../../primitives/pdf-dictionary';\nimport { SaveFontProgramEventHandler, SaveCmapEventHandler } from './../../primitives/pdf-stream';\nimport { PdfStream } from './../../primitives/pdf-stream';\nimport { PdfArray } from './../../primitives/pdf-array';\nimport { PdfName } from './../../primitives/pdf-name';\nimport { PdfNumber } from './../../primitives/pdf-number';\nimport { PdfString } from './../../primitives/pdf-string';\nimport { PdfReferenceHolder } from './../../primitives/pdf-reference';\nimport { PdfFontMetrics } from './pdf-font-metrics';\nimport { StandardWidthTable } from './pdf-font-metrics';\nimport { DictionaryProperties } from './../../input-output/pdf-dictionary-properties';\nimport { Dictionary } from './../../collections/dictionary';\nimport { FontDescriptorFlags } from './enum';\nimport { RectangleF } from './../../drawing/pdf-drawing';\nimport { Operators } from './../../input-output/pdf-operators';\nvar UnicodeTrueTypeFont = /** @class */ (function () {\n /* tslint:enable */\n //Constructors\n /**\n * Initializes a new instance of the `PdfTrueTypeFont` class.\n * @private\n */\n function UnicodeTrueTypeFont(base64String, size) {\n // Fields\n this.nameString = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';\n /**\n * Specifies the Internal variable to store fields of `PdfDictionaryProperties`.\n * @private\n */\n this.dictionaryProperties = new DictionaryProperties();\n /**\n * Indicates whether the font program is compressed or not.\n * @private\n */\n this.isCompress = false;\n /**\n * Indicates whether the font is embedded or not.\n */\n this.isEmbedFont = false;\n /**\n * Cmap table's start prefix.\n */\n /* tslint:disable */\n this.cmapPrefix = '/CIDInit /ProcSet findresource begin\\n12 dict begin\\nbegincmap' + Operators.newLine + '/CIDSystemInfo << /Registry (Adobe)/Ordering (UCS)/Supplement 0>> def\\n/CMapName ' + '/Adobe-Identity-UCS def\\n/CMapType 2 def\\n1 begincodespacerange' + Operators.newLine;\n /* tslint:enable */\n /**\n * Cmap table's start suffix.\n */\n this.cmapEndCodespaceRange = 'endcodespacerange' + Operators.newLine;\n /**\n * Cmap's begin range marker.\n */\n this.cmapBeginRange = 'beginbfrange' + Operators.newLine;\n /**\n * Cmap's end range marker.\n */\n this.cmapEndRange = 'endbfrange' + Operators.newLine;\n /**\n * Cmap table's end\n */\n /* tslint:disable */\n this.cmapSuffix = 'endbfrange\\nendcmap\\nCMapName currentdict ' + '/CMap defineresource pop\\nend end' + Operators.newLine;\n if (base64String === null || base64String === undefined) {\n throw new Error('ArgumentNullException:base64String');\n }\n this.fontSize = size;\n this.fontString = base64String;\n this.Initialize();\n }\n //Implementation\n /**\n * Returns width of the char symbol.\n */\n UnicodeTrueTypeFont.prototype.getCharWidth = function (charCode) {\n var codeWidth = this.ttfReader.getCharWidth(charCode);\n return codeWidth;\n };\n /**\n * Returns width of the text line.\n */\n UnicodeTrueTypeFont.prototype.getLineWidth = function (line) {\n // if (line == null) {\n // throw new Error('ArgumentNullException : line');\n // }\n var width = 0;\n for (var i = 0, len = line.length; i < len; i++) {\n var ch = line[i];\n var charWidth = this.getCharWidth(ch);\n width += charWidth;\n }\n return width;\n };\n /**\n * Initializes a new instance of the `PdfTrueTypeFont` class.\n * @private\n */\n UnicodeTrueTypeFont.prototype.Initialize = function () {\n var byteArray = new ByteArray(this.fontString.length);\n byteArray.writeFromBase64String(this.fontString);\n this.fontData = byteArray.internalBuffer;\n this.ttfReader = new TtfReader(this.fontData);\n this.ttfMetrics = this.ttfReader.metrics;\n };\n UnicodeTrueTypeFont.prototype.createInternals = function () {\n this.fontDictionary = new PdfDictionary();\n this.fontProgram = new PdfStream();\n this.cmap = new PdfStream();\n this.descendantFont = new PdfDictionary();\n this.metrics = new PdfFontMetrics();\n this.ttfReader.createInternals();\n this.ttfMetrics = this.ttfReader.metrics;\n this.initializeMetrics();\n // Create all the dictionaries of the font.\n this.subsetName = this.getFontName();\n this.createDescendantFont();\n this.createCmap();\n this.createFontDictionary();\n this.createFontProgram();\n };\n UnicodeTrueTypeFont.prototype.getInternals = function () {\n return this.fontDictionary;\n };\n /**\n * Initializes metrics.\n */\n UnicodeTrueTypeFont.prototype.initializeMetrics = function () {\n var ttfMetrics = this.ttfReader.metrics;\n this.metrics.ascent = ttfMetrics.macAscent;\n this.metrics.descent = ttfMetrics.macDescent;\n this.metrics.height = ttfMetrics.macAscent - ttfMetrics.macDescent + ttfMetrics.lineGap;\n this.metrics.name = ttfMetrics.fontFamily;\n this.metrics.postScriptName = ttfMetrics.postScriptName;\n this.metrics.size = this.fontSize;\n this.metrics.widthTable = new StandardWidthTable(ttfMetrics.widthTable);\n this.metrics.lineGap = ttfMetrics.lineGap;\n this.metrics.subScriptSizeFactor = ttfMetrics.subScriptSizeFactor;\n this.metrics.superscriptSizeFactor = ttfMetrics.superscriptSizeFactor;\n this.metrics.isBold = ttfMetrics.isBold;\n };\n /**\n * Gets random string.\n */\n UnicodeTrueTypeFont.prototype.getFontName = function () {\n var builder = '';\n var name;\n // if (this.isEmbed === false) {\n for (var i = 0; i < 6; i++) {\n var index = Math.floor(Math.random() * (25 - 0 + 1)) + 0;\n builder += this.nameString[index];\n }\n builder += '+';\n // }\n builder += this.ttfReader.metrics.postScriptName;\n name = builder.toString();\n // if (name === '') {\n // name = this.ttfReader.metrics.fontFamily;\n // }\n name = this.formatName(name);\n return name;\n };\n /**\n * Generates name of the font.\n */\n UnicodeTrueTypeFont.prototype.formatName = function (fontName) {\n // if (fontName === null) {\n // throw new Error('ArgumentNullException : fontName');\n // }\n // if (fontName === '') {\n // throw new Error('ArgumentOutOfRangeException : fontName, Parameter can not be empty');\n // }\n var ret = fontName.replace('(', '#28');\n ret = ret.replace(')', '#29');\n ret = ret.replace('[', '#5B');\n ret = ret.replace(']', '#5D');\n ret = ret.replace('<', '#3C');\n ret = ret.replace('>', '#3E');\n ret = ret.replace('{', '#7B');\n ret = ret.replace('}', '#7D');\n ret = ret.replace('/', '#2F');\n ret = ret.replace('%', '#25');\n return ret.replace(' ', '#20');\n };\n /**\n * Creates descendant font.\n */\n UnicodeTrueTypeFont.prototype.createDescendantFont = function () {\n // Set property used to clone Font every time\n this.descendantFont.isFont = true;\n this.descendantFont.descendantFontBeginSave = new SaveDescendantFontEventHandler(this);\n this.descendantFont.items.setValue(this.dictionaryProperties.type, new PdfName(this.dictionaryProperties.font));\n this.descendantFont.items.setValue(this.dictionaryProperties.subtype, new PdfName(this.dictionaryProperties.cIDFontType2));\n this.descendantFont.items.setValue(this.dictionaryProperties.baseFont, new PdfName(this.subsetName));\n this.descendantFont.items.setValue(this.dictionaryProperties.cIDToGIDMap, new PdfName(this.dictionaryProperties.identity));\n this.descendantFont.items.setValue(this.dictionaryProperties.dw, new PdfNumber(1000));\n this.fontDescriptor = this.createFontDescriptor();\n this.descendantFont.items.setValue(this.dictionaryProperties.fontDescriptor, new PdfReferenceHolder(this.fontDescriptor));\n var systemInfo = this.createSystemInfo();\n this.descendantFont.items.setValue(this.dictionaryProperties.cIDSystemInfo, systemInfo);\n };\n /**\n * Creates font descriptor.\n */\n UnicodeTrueTypeFont.prototype.createFontDescriptor = function () {\n var descriptor = new PdfDictionary();\n var metrics = this.ttfReader.metrics;\n // Set property used to clone Font every time\n descriptor.isFont = true;\n descriptor.items.setValue(this.dictionaryProperties.type, new PdfName(this.dictionaryProperties.fontDescriptor));\n descriptor.items.setValue(this.dictionaryProperties.fontName, new PdfName(this.subsetName));\n descriptor.items.setValue(this.dictionaryProperties.flags, new PdfNumber(this.getDescriptorFlags()));\n descriptor.items.setValue(this.dictionaryProperties.fontBBox, PdfArray.fromRectangle(this.getBoundBox()));\n descriptor.items.setValue(this.dictionaryProperties.missingWidth, new PdfNumber(metrics.widthTable[32]));\n descriptor.items.setValue(this.dictionaryProperties.stemV, new PdfNumber(metrics.stemV));\n descriptor.items.setValue(this.dictionaryProperties.italicAngle, new PdfNumber(metrics.italicAngle));\n descriptor.items.setValue(this.dictionaryProperties.capHeight, new PdfNumber(metrics.capHeight));\n descriptor.items.setValue(this.dictionaryProperties.ascent, new PdfNumber(metrics.winAscent));\n descriptor.items.setValue(this.dictionaryProperties.descent, new PdfNumber(metrics.winDescent));\n descriptor.items.setValue(this.dictionaryProperties.leading, new PdfNumber(metrics.leading));\n descriptor.items.setValue(this.dictionaryProperties.avgWidth, new PdfNumber(metrics.widthTable[32]));\n descriptor.items.setValue(this.dictionaryProperties.fontFile2, new PdfReferenceHolder(this.fontProgram));\n descriptor.items.setValue(this.dictionaryProperties.maxWidth, new PdfNumber(metrics.widthTable[32]));\n descriptor.items.setValue(this.dictionaryProperties.xHeight, new PdfNumber(0));\n descriptor.items.setValue(this.dictionaryProperties.stemH, new PdfNumber(0));\n return descriptor;\n };\n /**\n * Generates cmap.\n * @private\n */\n UnicodeTrueTypeFont.prototype.createCmap = function () {\n this.cmap.cmapBeginSave = new SaveCmapEventHandler(this);\n };\n /**\n * Generates font dictionary.\n */\n UnicodeTrueTypeFont.prototype.createFontDictionary = function () {\n // Set property used to clone Font every time\n this.fontDictionary.isFont = true;\n this.fontDictionary.fontDictionaryBeginSave = new SaveFontDictionaryEventHandler(this);\n this.fontDictionary.items.setValue(this.dictionaryProperties.type, new PdfName(this.dictionaryProperties.font));\n this.fontDictionary.items.setValue(this.dictionaryProperties.baseFont, new PdfName(this.subsetName));\n this.fontDictionary.items.setValue(this.dictionaryProperties.subtype, new PdfName(this.dictionaryProperties.type0));\n this.fontDictionary.items.setValue(this.dictionaryProperties.encoding, new PdfName(this.dictionaryProperties.identityH));\n var descFonts = new PdfArray();\n var reference = new PdfReferenceHolder(this.descendantFont);\n // Set property used to clone Font every time\n descFonts.isFont = true;\n descFonts.add(reference);\n this.fontDictionary.items.setValue(this.dictionaryProperties.descendantFonts, descFonts);\n };\n /**\n * Creates font program.\n */\n UnicodeTrueTypeFont.prototype.createFontProgram = function () {\n this.fontProgram.fontProgramBeginSave = new SaveFontProgramEventHandler(this);\n };\n /**\n * Creates system info dictionary for CID font.\n * @private\n */\n UnicodeTrueTypeFont.prototype.createSystemInfo = function () {\n var systemInfo = new PdfDictionary();\n systemInfo.items.setValue(this.dictionaryProperties.registry, new PdfString('Adobe'));\n systemInfo.items.setValue(this.dictionaryProperties.ordering, new PdfString(this.dictionaryProperties.identity));\n systemInfo.items.setValue(this.dictionaryProperties.supplement, new PdfNumber(0));\n return systemInfo;\n };\n /**\n * Runs before font Dictionary will be saved.\n */\n UnicodeTrueTypeFont.prototype.descendantFontBeginSave = function () {\n if (this.usedChars !== null && this.usedChars !== undefined && this.usedChars.size() > 0) {\n var width = this.getDescendantWidth();\n if (width !== null) {\n this.descendantFont.items.setValue(this.dictionaryProperties.w, width);\n }\n }\n };\n /**\n * Runs before font Dictionary will be saved.\n */\n UnicodeTrueTypeFont.prototype.cmapBeginSave = function () {\n this.generateCmap();\n };\n /**\n * Runs before font Dictionary will be saved.\n */\n /* tslint:disable */\n UnicodeTrueTypeFont.prototype.fontDictionaryBeginSave = function () {\n if (this.usedChars !== null && this.usedChars !== undefined && this.usedChars.size() > 0 && !this.fontDictionary.containsKey(this.dictionaryProperties.toUnicode)) {\n this.fontDictionary.items.setValue(this.dictionaryProperties.toUnicode, new PdfReferenceHolder(this.cmap));\n }\n };\n /* tslint:enable */\n /**\n * Runs before font program stream save.\n */\n UnicodeTrueTypeFont.prototype.fontProgramBeginSave = function () {\n this.isCompress = true;\n this.generateFontProgram();\n };\n /**\n * Gets width description pad array for c i d font.\n */\n UnicodeTrueTypeFont.prototype.getDescendantWidth = function () {\n var array = new PdfArray();\n if (this.usedChars !== null && this.usedChars !== undefined && this.usedChars.size() > 0) {\n var glyphInfo = [];\n // if (!this.isEmbedFont) {\n var keys = this.usedChars.keys();\n for (var i = 0; i < keys.length; i++) {\n var chLen = keys[i];\n var glyph = this.ttfReader.getGlyph(chLen);\n if (glyph.empty) {\n continue;\n }\n glyphInfo.push(glyph);\n }\n // } else {\n // glyphInfo = this.ttfReader.getAllGlyphs();\n // }\n glyphInfo.sort(function (a, b) { return a.index - b.index; });\n var firstGlyphIndex = 0;\n var lastGlyphIndex = 0;\n var firstGlyphIndexWasSet = false;\n var widthDetails = new PdfArray();\n // if (!this.isEmbedFont) {\n for (var i = 0; i < glyphInfo.length; i++) {\n var glyph = glyphInfo[i];\n if (!firstGlyphIndexWasSet) {\n firstGlyphIndexWasSet = true;\n firstGlyphIndex = glyph.index;\n lastGlyphIndex = glyph.index - 1;\n }\n if ((lastGlyphIndex + 1 !== glyph.index || (i + 1 === glyphInfo.length)) && glyphInfo.length > 1) {\n // Add glyph index / width.\n array.add(new PdfNumber(firstGlyphIndex));\n if (i !== 0) {\n array.add(widthDetails);\n }\n firstGlyphIndex = glyph.index;\n widthDetails = new PdfArray();\n }\n widthDetails.add(new PdfNumber(glyph.width));\n if (i + 1 === glyphInfo.length) {\n array.add(new PdfNumber(firstGlyphIndex));\n array.add(widthDetails);\n }\n lastGlyphIndex = glyph.index;\n }\n // } else {\n // for (let i : number = 0; i < glyphInfo.length; i++) {\n // let glyph : TtfGlyphInfo = glyphInfo[i];\n // if (!firstGlyphIndexWasSet) {\n // firstGlyphIndexWasSet = true;\n // lastGlyphIndex = glyph.index - 1;\n // }\n // firstGlyphIndex = glyph.index;\n // if ((lastGlyphIndex + 1 === glyph.index || (i + 1 === glyphInfo.length)) && glyphInfo.length > 1) {\n // // Add glyph index / width.\n // widthDetails.add(new PdfNumber(glyph.width));\n // array.add(new PdfNumber(firstGlyphIndex));\n // array.add(widthDetails);\n // widthDetails = new PdfArray();\n // }\n // lastGlyphIndex = glyph.index;\n // }\n // }\n }\n return array;\n };\n /**\n * Creates cmap.\n */\n UnicodeTrueTypeFont.prototype.generateCmap = function () {\n if (this.usedChars !== null && this.usedChars !== undefined && this.usedChars.size() > 0) {\n var glyphChars = this.ttfReader.getGlyphChars(this.usedChars);\n if (glyphChars.size() > 0) {\n var keys = glyphChars.keys().sort();\n // add first and last glyph indexes\n var first = keys[0];\n var last = keys[keys.length - 1];\n var middlePart = this.toHexString(first, false) + this.toHexString(last, false) + Operators.newLine;\n var builder = '';\n builder += this.cmapPrefix;\n builder += middlePart;\n builder += this.cmapEndCodespaceRange;\n var nextRange = 0;\n for (var i = 0; i < keys.length; i++) {\n if (nextRange === 0) {\n if (i !== 0) {\n builder += this.cmapEndRange;\n }\n nextRange = Math.min(100, keys.length - i);\n builder += nextRange;\n builder += Operators.whiteSpace;\n builder += this.cmapBeginRange;\n }\n nextRange -= 1;\n var key = keys[i];\n /* tslint:disable */\n builder += this.toHexString(key, true) + this.toHexString(key, true) + this.toHexString(glyphChars.getValue(key), true) + '\\n';\n /* tslint:enable */\n }\n builder += this.cmapSuffix;\n this.cmap.clearStream();\n this.cmap.isFont = true;\n this.cmap.write(builder);\n }\n }\n };\n /**\n * Generates font program.\n */\n UnicodeTrueTypeFont.prototype.generateFontProgram = function () {\n var fontProgram = null;\n this.usedChars = (this.usedChars === null || this.usedChars === undefined) ? new Dictionary() : this.usedChars;\n this.ttfReader.setOffset(0);\n fontProgram = this.ttfReader.readFontProgram(this.usedChars);\n this.fontProgram.clearStream();\n this.fontProgram.isFont = true;\n this.fontProgram.writeBytes(fontProgram);\n };\n /**\n * Calculates flags for the font descriptor.\n * @private\n */\n UnicodeTrueTypeFont.prototype.getDescriptorFlags = function () {\n var flags = 0;\n var metrics = this.ttfReader.metrics;\n if (metrics.isFixedPitch) {\n flags |= FontDescriptorFlags.FixedPitch;\n }\n if (metrics.isSymbol) {\n flags |= FontDescriptorFlags.Symbolic;\n }\n else {\n flags |= FontDescriptorFlags.Nonsymbolic;\n }\n if (metrics.isItalic) {\n flags |= FontDescriptorFlags.Italic;\n }\n if (metrics.isBold) {\n flags |= FontDescriptorFlags.ForceBold;\n }\n return flags;\n };\n /**\n * Calculates BoundBox of the descriptor.\n * @private\n */\n UnicodeTrueTypeFont.prototype.getBoundBox = function () {\n var rect = this.ttfReader.metrics.fontBox;\n var width = Math.abs(rect.right - rect.left);\n var height = Math.abs(rect.top - rect.bottom);\n var rectangle = new RectangleF(rect.left, rect.bottom, width, height);\n return rectangle;\n };\n /**\n * Converts integer of decimal system to hex integer.\n */\n UnicodeTrueTypeFont.prototype.toHexString = function (n, isCaseChange) {\n var s = n.toString(16);\n if (isCaseChange) {\n s = s.toUpperCase();\n }\n return '<0000'.substring(0, 5 - s.length) + s + '>';\n };\n /**\n * Stores used symbols.\n */\n UnicodeTrueTypeFont.prototype.setSymbols = function (text) {\n if (text === null) {\n throw new Error('Argument Null Exception : text');\n }\n if (this.usedChars === null || this.usedChars === undefined) {\n this.usedChars = new Dictionary();\n }\n for (var i = 0; i < text.length; i++) {\n var ch = text[i];\n this.usedChars.setValue(ch, String.fromCharCode(0));\n }\n // else {\n // if (text === null) {\n // throw new Error('Argument Null Exception : glyphs');\n // }\n // if (this.usedChars === null || this.usedChars === undefined) {\n // this.usedChars = new Dictionary();\n // }\n // for (let i : number = 0; i < text.length; i++) {\n // let glyphIndex : number = text[i];\n // let glyph : TtfGlyphInfo = this.ttfReader.getGlyph(glyphIndex);\n // if (!glyph == null) {\n // let c : string = glyph.charCode.toLocaleString();\n // this.usedChars.setValue(c, String.fromCharCode(0));\n // }\n // }\n // }\n if (this.isEmbedFont === false) {\n this.getDescendantWidth();\n }\n };\n return UnicodeTrueTypeFont;\n}());\nexport { UnicodeTrueTypeFont };\n","/**\n * ArabicShapeRenderer.ts class for EJ2-PDF\n */\nimport { Dictionary } from './../../../collections/dictionary';\nvar ArabicShapeRenderer = /** @class */ (function () {\n //#endregion\n //#region Constructor\n function ArabicShapeRenderer() {\n //#region Constants\n this.arabicCharTable = [['\\u0621', '\\uFE80'], ['\\u0622', '\\uFE81', '\\uFE82'],\n ['\\u0623', '\\uFE83', '\\uFE84'],\n ['\\u0624', '\\uFE85', '\\uFE86'],\n ['\\u0625', '\\uFE87', '\\uFE88'],\n ['\\u0626', '\\uFE89', '\\uFE8A', '\\uFE8B', '\\uFE8C'],\n ['\\u0627', '\\uFE8D', '\\uFE8E'],\n ['\\u0628', '\\uFE8F', '\\uFE90', '\\uFE91', '\\uFE92'],\n ['\\u0629', '\\uFE93', '\\uFE94'],\n ['\\u062A', '\\uFE95', '\\uFE96', '\\uFE97', '\\uFE98'],\n ['\\u062B', '\\uFE99', '\\uFE9A', '\\uFE9B', '\\uFE9C'],\n ['\\u062C', '\\uFE9D', '\\uFE9E', '\\uFE9F', '\\uFEA0'],\n ['\\u062D', '\\uFEA1', '\\uFEA2', '\\uFEA3', '\\uFEA4'],\n ['\\u062E', '\\uFEA5', '\\uFEA6', '\\uFEA7', '\\uFEA8'],\n ['\\u062F', '\\uFEA9', '\\uFEAA'],\n ['\\u0630', '\\uFEAB', '\\uFEAC'],\n ['\\u0631', '\\uFEAD', '\\uFEAE'],\n ['\\u0632', '\\uFEAF', '\\uFEB0'],\n ['\\u0633', '\\uFEB1', '\\uFEB2', '\\uFEB3', '\\uFEB4'],\n ['\\u0634', '\\uFEB5', '\\uFEB6', '\\uFEB7', '\\uFEB8'],\n ['\\u0635', '\\uFEB9', '\\uFEBA', '\\uFEBB', '\\uFEBC'],\n ['\\u0636', '\\uFEBD', '\\uFEBE', '\\uFEBF', '\\uFEC0'],\n ['\\u0637', '\\uFEC1', '\\uFEC2', '\\uFEC3', '\\uFEC4'],\n ['\\u0638', '\\uFEC5', '\\uFEC6', '\\uFEC7', '\\uFEC8'],\n ['\\u0639', '\\uFEC9', '\\uFECA', '\\uFECB', '\\uFECC'],\n ['\\u063A', '\\uFECD', '\\uFECE', '\\uFECF', '\\uFED0'],\n ['\\u0640', '\\u0640', '\\u0640', '\\u0640', '\\u0640'],\n ['\\u0641', '\\uFED1', '\\uFED2', '\\uFED3', '\\uFED4'],\n ['\\u0642', '\\uFED5', '\\uFED6', '\\uFED7', '\\uFED8'],\n ['\\u0643', '\\uFED9', '\\uFEDA', '\\uFEDB', '\\uFEDC'],\n ['\\u0644', '\\uFEDD', '\\uFEDE', '\\uFEDF', '\\uFEE0'],\n ['\\u0645', '\\uFEE1', '\\uFEE2', '\\uFEE3', '\\uFEE4'],\n ['\\u0646', '\\uFEE5', '\\uFEE6', '\\uFEE7', '\\uFEE8'],\n ['\\u0647', '\\uFEE9', '\\uFEEA', '\\uFEEB', '\\uFEEC'],\n ['\\u0648', '\\uFEED', '\\uFEEE'],\n ['\\u0649', '\\uFEEF', '\\uFEF0', '\\uFBE8', '\\uFBE9'],\n ['\\u064A', '\\uFEF1', '\\uFEF2', '\\uFEF3', '\\uFEF4'],\n ['\\u0671', '\\uFB50', '\\uFB51'],\n ['\\u0679', '\\uFB66', '\\uFB67', '\\uFB68', '\\uFB69'],\n ['\\u067A', '\\uFB5E', '\\uFB5F', '\\uFB60', '\\uFB61'],\n ['\\u067B', '\\uFB52', '\\uFB53', '\\uFB54', '\\uFB55'],\n ['\\u067E', '\\uFB56', '\\uFB57', '\\uFB58', '\\uFB59'],\n ['\\u067F', '\\uFB62', '\\uFB63', '\\uFB64', '\\uFB65'],\n ['\\u0680', '\\uFB5A', '\\uFB5B', '\\uFB5C', '\\uFB5D'],\n ['\\u0683', '\\uFB76', '\\uFB77', '\\uFB78', '\\uFB79'],\n ['\\u0684', '\\uFB72', '\\uFB73', '\\uFB74', '\\uFB75'],\n ['\\u0686', '\\uFB7A', '\\uFB7B', '\\uFB7C', '\\uFB7D'],\n ['\\u0687', '\\uFB7E', '\\uFB7F', '\\uFB80', '\\uFB81'],\n ['\\u0688', '\\uFB88', '\\uFB89'],\n ['\\u068C', '\\uFB84', '\\uFB85'],\n ['\\u068D', '\\uFB82', '\\uFB83'],\n ['\\u068E', '\\uFB86', '\\uFB87'],\n ['\\u0691', '\\uFB8C', '\\uFB8D'],\n ['\\u0698', '\\uFB8A', '\\uFB8B'],\n ['\\u06A4', '\\uFB6A', '\\uFB6B', '\\uFB6C', '\\uFB6D'],\n ['\\u06A6', '\\uFB6E', '\\uFB6F', '\\uFB70', '\\uFB71'],\n ['\\u06A9', '\\uFB8E', '\\uFB8F', '\\uFB90', '\\uFB91'],\n ['\\u06AD', '\\uFBD3', '\\uFBD4', '\\uFBD5', '\\uFBD6'],\n ['\\u06AF', '\\uFB92', '\\uFB93', '\\uFB94', '\\uFB95'],\n ['\\u06B1', '\\uFB9A', '\\uFB9B', '\\uFB9C', '\\uFB9D'],\n ['\\u06B3', '\\uFB96', '\\uFB97', '\\uFB98', '\\uFB99'],\n ['\\u06BA', '\\uFB9E', '\\uFB9F'],\n ['\\u06BB', '\\uFBA0', '\\uFBA1', '\\uFBA2', '\\uFBA3'],\n ['\\u06BE', '\\uFBAA', '\\uFBAB', '\\uFBAC', '\\uFBAD'],\n ['\\u06C0', '\\uFBA4', '\\uFBA5'],\n ['\\u06C1', '\\uFBA6', '\\uFBA7', '\\uFBA8', '\\uFBA9'],\n ['\\u06C5', '\\uFBE0', '\\uFBE1'],\n ['\\u06C6', '\\uFBD9', '\\uFBDA'],\n ['\\u06C7', '\\uFBD7', '\\uFBD8'],\n ['\\u06C8', '\\uFBDB', '\\uFBDC'],\n ['\\u06C9', '\\uFBE2', '\\uFBE3'],\n ['\\u06CB', '\\uFBDE', '\\uFBDF'],\n ['\\u06CC', '\\uFBFC', '\\uFBFD', '\\uFBFE', '\\uFBFF'],\n ['\\u06D0', '\\uFBE4', '\\uFBE5', '\\uFBE6', '\\uFBE7'],\n ['\\u06D2', '\\uFBAE', '\\uFBAF'],\n ['\\u06D3', '\\uFBB0', '\\uFBB1']\n ];\n this.alef = '\\u0627';\n this.alefHamza = '\\u0623';\n this.alefHamzaBelow = '\\u0625';\n this.alefMadda = '\\u0622';\n this.lam = '\\u0644';\n this.hamza = '\\u0621';\n this.zeroWidthJoiner = '\\u200D';\n this.hamzaAbove = '\\u0654';\n this.hamzaBelow = '\\u0655';\n this.wawHamza = '\\u0624';\n this.yehHamza = '\\u0626';\n this.waw = '\\u0648';\n this.alefMaksura = '\\u0649';\n this.yeh = '\\u064A';\n this.farsiYeh = '\\u06CC';\n this.shadda = '\\u0651';\n this.madda = '\\u0653';\n this.lwa = '\\uFEFB';\n this.lwawh = '\\uFEF7';\n this.lwawhb = '\\uFEF9';\n this.lwawm = '\\uFEF5';\n this.bwhb = '\\u06D3';\n this.fathatan = '\\u064B';\n this.superScriptalef = '\\u0670';\n this.vowel = 0x1;\n // #endregion\n //#region Fields\n this.arabicMapTable = new Dictionary();\n for (var i = 0; i < this.arabicCharTable.length; i++) {\n this.arabicMapTable.setValue(this.arabicCharTable[i][0], this.arabicCharTable[i]);\n }\n }\n //#endregion\n //#region implementation\n ArabicShapeRenderer.prototype.getCharacterShape = function (input, index) {\n if ((input >= this.hamza) && (input <= this.bwhb)) {\n var value = [];\n if (this.arabicMapTable.getValue(input)) {\n value = this.arabicMapTable.getValue(input);\n return value[index + 1];\n }\n }\n else if (input >= this.lwawm && input <= this.lwa) {\n return (input);\n }\n return input;\n };\n ArabicShapeRenderer.prototype.shape = function (text, level) {\n var builder = '';\n var str2 = '';\n for (var i = 0; i < text.length; i++) {\n var c = text[i];\n if (c >= '' && c <= 'ۿ') {\n //if(c>= 0x0600.toString() && c<= 0x06FF.toString()) {\n str2 = str2 + c;\n }\n else {\n if (str2.length > 0) {\n var st = this.doShape(str2.toString(), 0);\n builder = builder + st;\n str2 = '';\n }\n builder = builder + c;\n }\n }\n if (str2.length > 0) {\n var st = this.doShape(str2.toString(), 0);\n builder = builder + st;\n }\n return builder.toString();\n };\n ArabicShapeRenderer.prototype.doShape = function (input, level) {\n var str = '';\n var ligature = 0;\n var len = 0;\n var i = 0;\n var next = '';\n var previous = new ArabicShape();\n var present = new ArabicShape();\n while (i < input.length) {\n next = input[i++];\n ligature = this.ligature(next, present);\n if (ligature === 0) {\n var shapeCount = this.getShapeCount(next);\n len = (shapeCount === 1) ? 0 : 2;\n if (previous.Shapes > 2) {\n len += 1;\n }\n len = len % (present.Shapes);\n present.Value = this.getCharacterShape(present.Value, len);\n str = this.append(str, previous, level);\n previous = present;\n present = new ArabicShape();\n present.Value = next;\n present.Shapes = shapeCount;\n present.Ligature++;\n }\n }\n len = (previous.Shapes > 2) ? 1 : 0;\n len = len % (present.Shapes);\n present.Value = this.getCharacterShape(present.Value, len);\n str = this.append(str, previous, level);\n str = this.append(str, present, level);\n return str.toString();\n };\n ArabicShapeRenderer.prototype.append = function (builder, shape, level) {\n if (shape.Value !== '') {\n builder = builder + shape.Value;\n shape.Ligature -= 1;\n if (shape.Type !== '') {\n if ((level & this.vowel) === 0) {\n builder = builder + shape.Type;\n shape.Ligature -= 1;\n }\n else {\n shape.Ligature -= 1;\n }\n }\n if (shape.vowel !== '') {\n if ((level & this.vowel) === 0) {\n builder = builder + shape.vowel;\n shape.Ligature -= 1;\n }\n else {\n shape.Ligature -= 1;\n }\n }\n }\n return builder;\n };\n ArabicShapeRenderer.prototype.ligature = function (value, shape) {\n if (shape.Value !== '') {\n var result = 0;\n if ((value >= this.fathatan && value <= this.hamzaBelow) || value === this.superScriptalef) {\n result = 1;\n if ((shape.vowel !== '') && (value !== this.shadda)) {\n result = 2;\n }\n if (value === this.shadda) {\n if (shape.Type == null) {\n shape.Type = this.shadda;\n }\n else {\n return 0;\n }\n }\n else if (value === this.hamzaBelow) {\n if (shape.Value === this.alef) {\n shape.Value = this.alefHamzaBelow;\n result = 2;\n }\n else if (value === this.lwa) {\n shape.Value = this.lwawhb;\n result = 2;\n }\n else {\n shape.Type = this.hamzaBelow;\n }\n }\n else if (value === this.hamzaAbove) {\n if (shape.Value === this.alef) {\n shape.Value = this.alefHamza;\n result = 2;\n }\n else if (shape.Value === this.lwa) {\n shape.Value = this.lwawh;\n result = 2;\n }\n else if (shape.Value === this.waw) {\n shape.Value = this.wawHamza;\n result = 2;\n }\n else if (shape.Value === this.yeh || shape.Value === this.alefMaksura || shape.Value === this.farsiYeh) {\n shape.Value = this.yehHamza;\n result = 2;\n }\n else {\n shape.Type = this.hamzaAbove;\n }\n }\n else if (value === this.madda) {\n if (shape.Value === this.alef) {\n shape.Value = this.alefMadda;\n result = 2;\n }\n }\n else {\n shape.vowel = value;\n }\n if (result === 1) {\n shape.Ligature++;\n }\n return result;\n }\n if (shape.vowel !== '') {\n return 0;\n }\n if (shape.Value === this.lam) {\n if (value === this.alef) {\n shape.Value = this.lwa;\n shape.Shapes = 2;\n result = 3;\n }\n else if (value === this.alefHamza) {\n shape.Value = this.lwawh;\n shape.Shapes = 2;\n result = 3;\n }\n else if (value === this.alefHamzaBelow) {\n shape.Value = this.lwawhb;\n shape.Shapes = 2;\n result = 3;\n }\n else if (value === this.alefMadda) {\n shape.Value = this.lwawm;\n shape.Shapes = 2;\n result = 3;\n }\n }\n // else if (shape.Value === '') {\n // shape.Value = value;\n // shape.Shapes = this.getShapeCount(value);\n // result = 1;\n // }\n return result;\n }\n else {\n return 0;\n }\n };\n ArabicShapeRenderer.prototype.getShapeCount = function (shape) {\n if ((shape >= this.hamza) && (shape <= this.bwhb) && !((shape >= this.fathatan && shape <= this.hamzaBelow)\n || shape === this.superScriptalef)) {\n var c = [];\n if (this.arabicMapTable.getValue(shape)) {\n c = this.arabicMapTable.getValue(shape);\n return c.length - 1;\n }\n }\n else if (shape === this.zeroWidthJoiner) {\n return 4;\n }\n return 1;\n };\n return ArabicShapeRenderer;\n}());\nexport { ArabicShapeRenderer };\n//#endregion\n//#region Internals\nvar ArabicShape = /** @class */ (function () {\n function ArabicShape() {\n //#region Fields\n this.shapeValue = '';\n this.shapeType = '';\n this.shapeVowel = '';\n this.shapeLigature = 0;\n this.shapeShapes = 1;\n //#endregion\n }\n Object.defineProperty(ArabicShape.prototype, \"Value\", {\n //#endregion\n //#region Properties \n /**\n * Gets or sets the values.\n * @private\n */\n get: function () {\n return this.shapeValue;\n },\n set: function (value) {\n this.shapeValue = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(ArabicShape.prototype, \"Type\", {\n /**\n * Gets or sets the values.\n * @private\n */\n get: function () {\n return this.shapeType;\n },\n set: function (value) {\n this.shapeType = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(ArabicShape.prototype, \"vowel\", {\n /**\n * Gets or sets the values.\n * @private\n */\n get: function () {\n return this.shapeVowel;\n },\n set: function (value) {\n this.shapeVowel = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(ArabicShape.prototype, \"Ligature\", {\n /**\n * Gets or sets the values.\n * @private\n */\n get: function () {\n return this.shapeLigature;\n },\n set: function (value) {\n this.shapeLigature = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(ArabicShape.prototype, \"Shapes\", {\n /**\n * Gets or sets the values.\n * @private\n */\n get: function () {\n return this.shapeShapes;\n },\n set: function (value) {\n this.shapeShapes = value;\n },\n enumerable: true,\n configurable: true\n });\n return ArabicShape;\n}());\nexport { ArabicShape };\n//#endregion\n","/**\n * Bidi.ts class for EJ2-PDF\n */\nimport { Dictionary } from './../../../collections/dictionary';\n/**\n * `Metrics` of the font.\n * @private\n */\nvar Bidi = /** @class */ (function () {\n //#endregion\n //#region Constructor\n function Bidi() {\n //#region Fields\n this.indexes = [];\n this.indexLevels = [];\n this.mirroringShapeCharacters = new Dictionary();\n this.update();\n }\n //#endregion\n //#region implementation\n Bidi.prototype.doMirrorShaping = function (text) {\n var result = [];\n for (var i = 0; i < text.length; i++) {\n if (((this.indexLevels[i] & 1) === 1) && this.mirroringShapeCharacters.containsKey(text[i].charCodeAt(0))) {\n result[i] = String.fromCharCode(this.mirroringShapeCharacters.getValue(text[i].charCodeAt(0)));\n }\n else {\n result[i] = text[i].toString();\n }\n }\n var res = '';\n for (var j = 0; j < result.length; j++) {\n res = res + result[j];\n }\n return res;\n };\n Bidi.prototype.getLogicalToVisualString = function (inputText, isRtl) {\n var rtlCharacters = new RtlCharacters();\n this.indexLevels = rtlCharacters.getVisualOrder(inputText, isRtl);\n this.setDefaultIndexLevel();\n this.doOrder(0, this.indexLevels.length - 1);\n var text = this.doMirrorShaping(inputText);\n //let text : string = inputText;\n var resultBuilder = '';\n for (var i = 0; i < this.indexes.length; i++) {\n var index = this.indexes[i];\n resultBuilder += text[index];\n }\n return resultBuilder.toString();\n };\n Bidi.prototype.setDefaultIndexLevel = function () {\n for (var i = 0; i < this.indexLevels.length; i++) {\n this.indexes[i] = i;\n }\n };\n Bidi.prototype.doOrder = function (sIndex, eIndex) {\n var max = this.indexLevels[sIndex];\n var min = max;\n var odd = max;\n var even = max;\n for (var i = sIndex + 1; i <= eIndex; ++i) {\n var data = this.indexLevels[i];\n if (data > max) {\n max = data;\n }\n else if (data < min) {\n min = data;\n }\n odd &= data;\n even |= data;\n }\n if ((even & 1) === 0) {\n return;\n }\n if ((odd & 1) === 1) {\n this.reArrange(sIndex, eIndex + 1);\n return;\n }\n min |= 1;\n while (max >= min) {\n var pstart = sIndex;\n /*tslint:disable:no-constant-condition */\n while (true) {\n while (pstart <= eIndex) {\n if (this.indexLevels[pstart] >= max) {\n break;\n }\n pstart += 1;\n }\n if (pstart > eIndex) {\n break;\n }\n var pend = pstart + 1;\n while (pend <= eIndex) {\n if (this.indexLevels[pend] < max) {\n break;\n }\n pend += 1;\n }\n this.reArrange(pstart, pend);\n pstart = pend + 1;\n }\n max -= 1;\n }\n };\n Bidi.prototype.reArrange = function (i, j) {\n var length = (i + j) / 2;\n --j;\n for (; i < length; ++i, --j) {\n var temp = this.indexes[i];\n this.indexes[i] = this.indexes[j];\n this.indexes[j] = temp;\n }\n };\n Bidi.prototype.update = function () {\n this.mirroringShapeCharacters.setValue(40, 41);\n this.mirroringShapeCharacters.setValue(41, 40);\n this.mirroringShapeCharacters.setValue(60, 62);\n this.mirroringShapeCharacters.setValue(62, 60);\n this.mirroringShapeCharacters.setValue(91, 93);\n this.mirroringShapeCharacters.setValue(93, 91);\n this.mirroringShapeCharacters.setValue(123, 125);\n this.mirroringShapeCharacters.setValue(125, 123);\n this.mirroringShapeCharacters.setValue(171, 187);\n this.mirroringShapeCharacters.setValue(187, 171);\n this.mirroringShapeCharacters.setValue(8249, 8250);\n this.mirroringShapeCharacters.setValue(8250, 8249);\n this.mirroringShapeCharacters.setValue(8261, 8262);\n this.mirroringShapeCharacters.setValue(8262, 8261);\n this.mirroringShapeCharacters.setValue(8317, 8318);\n this.mirroringShapeCharacters.setValue(8318, 8317);\n this.mirroringShapeCharacters.setValue(8333, 8334);\n this.mirroringShapeCharacters.setValue(8334, 8333);\n this.mirroringShapeCharacters.setValue(8712, 8715);\n this.mirroringShapeCharacters.setValue(8713, 8716);\n this.mirroringShapeCharacters.setValue(8714, 8717);\n this.mirroringShapeCharacters.setValue(8715, 8712);\n this.mirroringShapeCharacters.setValue(8716, 8713);\n this.mirroringShapeCharacters.setValue(8717, 8714);\n this.mirroringShapeCharacters.setValue(8725, 10741);\n this.mirroringShapeCharacters.setValue(8764, 8765);\n this.mirroringShapeCharacters.setValue(8765, 8764);\n this.mirroringShapeCharacters.setValue(8771, 8909);\n this.mirroringShapeCharacters.setValue(8786, 8787);\n this.mirroringShapeCharacters.setValue(8787, 8786);\n this.mirroringShapeCharacters.setValue(8788, 8789);\n this.mirroringShapeCharacters.setValue(8789, 8788);\n this.mirroringShapeCharacters.setValue(8804, 8805);\n this.mirroringShapeCharacters.setValue(8805, 8804);\n this.mirroringShapeCharacters.setValue(8806, 8807);\n this.mirroringShapeCharacters.setValue(8807, 8806);\n this.mirroringShapeCharacters.setValue(8808, 8809);\n this.mirroringShapeCharacters.setValue(8809, 8808);\n this.mirroringShapeCharacters.setValue(8810, 8811);\n this.mirroringShapeCharacters.setValue(8811, 8810);\n this.mirroringShapeCharacters.setValue(8814, 8815);\n this.mirroringShapeCharacters.setValue(8815, 8814);\n this.mirroringShapeCharacters.setValue(8816, 8817);\n this.mirroringShapeCharacters.setValue(8817, 8816);\n this.mirroringShapeCharacters.setValue(8818, 8819);\n this.mirroringShapeCharacters.setValue(8819, 8818);\n this.mirroringShapeCharacters.setValue(8820, 8821);\n this.mirroringShapeCharacters.setValue(8821, 8820);\n this.mirroringShapeCharacters.setValue(8822, 8823);\n this.mirroringShapeCharacters.setValue(8823, 8822);\n this.mirroringShapeCharacters.setValue(8824, 8825);\n this.mirroringShapeCharacters.setValue(8825, 8824);\n this.mirroringShapeCharacters.setValue(8826, 8827);\n this.mirroringShapeCharacters.setValue(8827, 8826);\n this.mirroringShapeCharacters.setValue(8828, 8829);\n this.mirroringShapeCharacters.setValue(8829, 8828);\n this.mirroringShapeCharacters.setValue(8830, 8831);\n this.mirroringShapeCharacters.setValue(8831, 8830);\n this.mirroringShapeCharacters.setValue(8832, 8833);\n this.mirroringShapeCharacters.setValue(8833, 8832);\n this.mirroringShapeCharacters.setValue(8834, 8835);\n this.mirroringShapeCharacters.setValue(8835, 8834);\n this.mirroringShapeCharacters.setValue(8836, 8837);\n this.mirroringShapeCharacters.setValue(8837, 8836);\n this.mirroringShapeCharacters.setValue(8838, 8839);\n this.mirroringShapeCharacters.setValue(8839, 8838);\n this.mirroringShapeCharacters.setValue(8840, 8841);\n this.mirroringShapeCharacters.setValue(8841, 8840);\n this.mirroringShapeCharacters.setValue(8842, 8843);\n this.mirroringShapeCharacters.setValue(8843, 8842);\n this.mirroringShapeCharacters.setValue(8847, 8848);\n this.mirroringShapeCharacters.setValue(8848, 8847);\n this.mirroringShapeCharacters.setValue(8849, 8850);\n this.mirroringShapeCharacters.setValue(8850, 8849);\n this.mirroringShapeCharacters.setValue(8856, 10680);\n this.mirroringShapeCharacters.setValue(8866, 8867);\n this.mirroringShapeCharacters.setValue(8867, 8866);\n this.mirroringShapeCharacters.setValue(8870, 10974);\n this.mirroringShapeCharacters.setValue(8872, 10980);\n this.mirroringShapeCharacters.setValue(8873, 10979);\n this.mirroringShapeCharacters.setValue(8875, 10981);\n this.mirroringShapeCharacters.setValue(8880, 8881);\n this.mirroringShapeCharacters.setValue(8881, 8880);\n this.mirroringShapeCharacters.setValue(8882, 8883);\n this.mirroringShapeCharacters.setValue(8883, 8882);\n this.mirroringShapeCharacters.setValue(8884, 8885);\n this.mirroringShapeCharacters.setValue(8885, 8884);\n /*tslint:disable:max-func-body-length */\n this.mirroringShapeCharacters.setValue(8886, 8887);\n this.mirroringShapeCharacters.setValue(8887, 8886);\n this.mirroringShapeCharacters.setValue(8905, 8906);\n this.mirroringShapeCharacters.setValue(8906, 8905);\n this.mirroringShapeCharacters.setValue(8907, 8908);\n this.mirroringShapeCharacters.setValue(8908, 8907);\n this.mirroringShapeCharacters.setValue(8909, 8771);\n this.mirroringShapeCharacters.setValue(8912, 8913);\n this.mirroringShapeCharacters.setValue(8913, 8912);\n this.mirroringShapeCharacters.setValue(8918, 8919);\n this.mirroringShapeCharacters.setValue(8919, 8918);\n this.mirroringShapeCharacters.setValue(8920, 8921);\n this.mirroringShapeCharacters.setValue(8921, 8920);\n this.mirroringShapeCharacters.setValue(8922, 8923);\n this.mirroringShapeCharacters.setValue(8923, 8922);\n this.mirroringShapeCharacters.setValue(8924, 8925);\n this.mirroringShapeCharacters.setValue(8925, 8924);\n this.mirroringShapeCharacters.setValue(8926, 8927);\n this.mirroringShapeCharacters.setValue(8927, 8926);\n this.mirroringShapeCharacters.setValue(8928, 8929);\n this.mirroringShapeCharacters.setValue(8929, 8928);\n this.mirroringShapeCharacters.setValue(8930, 8931);\n this.mirroringShapeCharacters.setValue(8931, 8930);\n this.mirroringShapeCharacters.setValue(8932, 8933);\n this.mirroringShapeCharacters.setValue(8933, 8932);\n this.mirroringShapeCharacters.setValue(8934, 8935);\n this.mirroringShapeCharacters.setValue(8935, 8934);\n this.mirroringShapeCharacters.setValue(8936, 8937);\n this.mirroringShapeCharacters.setValue(8937, 8936);\n this.mirroringShapeCharacters.setValue(8938, 8939);\n this.mirroringShapeCharacters.setValue(8939, 8938);\n this.mirroringShapeCharacters.setValue(8940, 8941);\n this.mirroringShapeCharacters.setValue(8941, 8940);\n this.mirroringShapeCharacters.setValue(8944, 8945);\n this.mirroringShapeCharacters.setValue(8945, 8944);\n this.mirroringShapeCharacters.setValue(8946, 8954);\n this.mirroringShapeCharacters.setValue(8947, 8955);\n this.mirroringShapeCharacters.setValue(8948, 8956);\n this.mirroringShapeCharacters.setValue(8950, 8957);\n this.mirroringShapeCharacters.setValue(8951, 8958);\n this.mirroringShapeCharacters.setValue(8954, 8946);\n this.mirroringShapeCharacters.setValue(8955, 8947);\n this.mirroringShapeCharacters.setValue(8956, 8948);\n this.mirroringShapeCharacters.setValue(8957, 8950);\n this.mirroringShapeCharacters.setValue(8958, 8951);\n this.mirroringShapeCharacters.setValue(8968, 8969);\n this.mirroringShapeCharacters.setValue(8969, 8968);\n this.mirroringShapeCharacters.setValue(8970, 8971);\n this.mirroringShapeCharacters.setValue(8971, 8970);\n this.mirroringShapeCharacters.setValue(9001, 9002);\n this.mirroringShapeCharacters.setValue(9002, 9001);\n this.mirroringShapeCharacters.setValue(10088, 10089);\n this.mirroringShapeCharacters.setValue(10089, 10088);\n this.mirroringShapeCharacters.setValue(10090, 10091);\n this.mirroringShapeCharacters.setValue(10091, 10090);\n this.mirroringShapeCharacters.setValue(10092, 10093);\n this.mirroringShapeCharacters.setValue(10093, 10092);\n this.mirroringShapeCharacters.setValue(10094, 10095);\n this.mirroringShapeCharacters.setValue(10095, 10094);\n this.mirroringShapeCharacters.setValue(10096, 10097);\n this.mirroringShapeCharacters.setValue(10097, 10096);\n this.mirroringShapeCharacters.setValue(10098, 10099);\n this.mirroringShapeCharacters.setValue(10099, 10098);\n this.mirroringShapeCharacters.setValue(10100, 10101);\n this.mirroringShapeCharacters.setValue(10101, 10100);\n this.mirroringShapeCharacters.setValue(10197, 10198);\n this.mirroringShapeCharacters.setValue(10198, 10197);\n this.mirroringShapeCharacters.setValue(10205, 10206);\n this.mirroringShapeCharacters.setValue(10206, 10205);\n this.mirroringShapeCharacters.setValue(10210, 10211);\n this.mirroringShapeCharacters.setValue(10211, 10210);\n this.mirroringShapeCharacters.setValue(10212, 10213);\n this.mirroringShapeCharacters.setValue(10213, 10212);\n this.mirroringShapeCharacters.setValue(10214, 10215);\n this.mirroringShapeCharacters.setValue(10215, 10214);\n this.mirroringShapeCharacters.setValue(10216, 10217);\n this.mirroringShapeCharacters.setValue(10217, 10216);\n this.mirroringShapeCharacters.setValue(10218, 10219);\n this.mirroringShapeCharacters.setValue(10219, 10218);\n this.mirroringShapeCharacters.setValue(10627, 10628);\n this.mirroringShapeCharacters.setValue(10628, 10627);\n this.mirroringShapeCharacters.setValue(10629, 10630);\n this.mirroringShapeCharacters.setValue(10630, 10629);\n this.mirroringShapeCharacters.setValue(10631, 10632);\n this.mirroringShapeCharacters.setValue(10632, 10631);\n this.mirroringShapeCharacters.setValue(10633, 10634);\n this.mirroringShapeCharacters.setValue(10634, 10633);\n this.mirroringShapeCharacters.setValue(10635, 10636);\n this.mirroringShapeCharacters.setValue(10636, 10635);\n this.mirroringShapeCharacters.setValue(10637, 10640);\n this.mirroringShapeCharacters.setValue(10638, 10639);\n this.mirroringShapeCharacters.setValue(10639, 10638);\n this.mirroringShapeCharacters.setValue(10640, 10637);\n this.mirroringShapeCharacters.setValue(10641, 10642);\n this.mirroringShapeCharacters.setValue(10642, 10641);\n this.mirroringShapeCharacters.setValue(10643, 10644);\n this.mirroringShapeCharacters.setValue(10644, 10643);\n this.mirroringShapeCharacters.setValue(10645, 10646);\n this.mirroringShapeCharacters.setValue(10646, 10645);\n this.mirroringShapeCharacters.setValue(10647, 10648);\n this.mirroringShapeCharacters.setValue(10648, 10647);\n this.mirroringShapeCharacters.setValue(10680, 8856);\n this.mirroringShapeCharacters.setValue(10688, 10689);\n this.mirroringShapeCharacters.setValue(10689, 10688);\n this.mirroringShapeCharacters.setValue(10692, 10693);\n this.mirroringShapeCharacters.setValue(10693, 10692);\n this.mirroringShapeCharacters.setValue(10703, 10704);\n this.mirroringShapeCharacters.setValue(10704, 10703);\n this.mirroringShapeCharacters.setValue(10705, 10706);\n this.mirroringShapeCharacters.setValue(10706, 10705);\n this.mirroringShapeCharacters.setValue(10708, 10709);\n this.mirroringShapeCharacters.setValue(10709, 10708);\n this.mirroringShapeCharacters.setValue(10712, 10713);\n this.mirroringShapeCharacters.setValue(10713, 10712);\n this.mirroringShapeCharacters.setValue(10714, 10715);\n this.mirroringShapeCharacters.setValue(10715, 10714);\n this.mirroringShapeCharacters.setValue(10741, 8725);\n this.mirroringShapeCharacters.setValue(10744, 10745);\n this.mirroringShapeCharacters.setValue(10745, 10744);\n this.mirroringShapeCharacters.setValue(10748, 10749);\n this.mirroringShapeCharacters.setValue(10749, 10748);\n this.mirroringShapeCharacters.setValue(10795, 10796);\n this.mirroringShapeCharacters.setValue(10796, 10795);\n this.mirroringShapeCharacters.setValue(10797, 10796);\n this.mirroringShapeCharacters.setValue(10798, 10797);\n this.mirroringShapeCharacters.setValue(10804, 10805);\n this.mirroringShapeCharacters.setValue(10805, 10804);\n this.mirroringShapeCharacters.setValue(10812, 10813);\n this.mirroringShapeCharacters.setValue(10813, 10812);\n this.mirroringShapeCharacters.setValue(10852, 10853);\n this.mirroringShapeCharacters.setValue(10853, 10852);\n this.mirroringShapeCharacters.setValue(10873, 10874);\n this.mirroringShapeCharacters.setValue(10874, 10873);\n this.mirroringShapeCharacters.setValue(10877, 10878);\n this.mirroringShapeCharacters.setValue(10878, 10877);\n this.mirroringShapeCharacters.setValue(10879, 10880);\n this.mirroringShapeCharacters.setValue(10880, 10879);\n this.mirroringShapeCharacters.setValue(10881, 10882);\n this.mirroringShapeCharacters.setValue(10882, 10881);\n this.mirroringShapeCharacters.setValue(10883, 10884);\n this.mirroringShapeCharacters.setValue(10884, 10883);\n this.mirroringShapeCharacters.setValue(10891, 10892);\n this.mirroringShapeCharacters.setValue(10892, 10891);\n this.mirroringShapeCharacters.setValue(10897, 10898);\n this.mirroringShapeCharacters.setValue(10898, 10897);\n this.mirroringShapeCharacters.setValue(10899, 10900);\n this.mirroringShapeCharacters.setValue(10900, 10899);\n this.mirroringShapeCharacters.setValue(10901, 10902);\n this.mirroringShapeCharacters.setValue(10902, 10901);\n this.mirroringShapeCharacters.setValue(10903, 10904);\n this.mirroringShapeCharacters.setValue(10904, 10903);\n this.mirroringShapeCharacters.setValue(10905, 10906);\n this.mirroringShapeCharacters.setValue(10906, 10905);\n this.mirroringShapeCharacters.setValue(10907, 10908);\n this.mirroringShapeCharacters.setValue(10908, 10907);\n this.mirroringShapeCharacters.setValue(10913, 10914);\n this.mirroringShapeCharacters.setValue(10914, 10913);\n this.mirroringShapeCharacters.setValue(10918, 10919);\n this.mirroringShapeCharacters.setValue(10919, 10918);\n this.mirroringShapeCharacters.setValue(10920, 10921);\n this.mirroringShapeCharacters.setValue(10921, 10920);\n this.mirroringShapeCharacters.setValue(10922, 10923);\n this.mirroringShapeCharacters.setValue(10923, 10922);\n this.mirroringShapeCharacters.setValue(10924, 10925);\n this.mirroringShapeCharacters.setValue(10925, 10924);\n this.mirroringShapeCharacters.setValue(10927, 10928);\n this.mirroringShapeCharacters.setValue(10928, 10927);\n this.mirroringShapeCharacters.setValue(10931, 10932);\n this.mirroringShapeCharacters.setValue(10932, 10931);\n this.mirroringShapeCharacters.setValue(10939, 10940);\n this.mirroringShapeCharacters.setValue(10940, 10939);\n this.mirroringShapeCharacters.setValue(10941, 10942);\n this.mirroringShapeCharacters.setValue(10942, 10941);\n this.mirroringShapeCharacters.setValue(10943, 10944);\n this.mirroringShapeCharacters.setValue(10944, 10943);\n this.mirroringShapeCharacters.setValue(10945, 10946);\n this.mirroringShapeCharacters.setValue(10946, 10945);\n this.mirroringShapeCharacters.setValue(10947, 10948);\n this.mirroringShapeCharacters.setValue(10948, 10947);\n this.mirroringShapeCharacters.setValue(10949, 10950);\n this.mirroringShapeCharacters.setValue(10950, 10949);\n this.mirroringShapeCharacters.setValue(10957, 10958);\n this.mirroringShapeCharacters.setValue(10958, 10957);\n this.mirroringShapeCharacters.setValue(10959, 10960);\n this.mirroringShapeCharacters.setValue(10960, 10959);\n this.mirroringShapeCharacters.setValue(10961, 10962);\n this.mirroringShapeCharacters.setValue(10962, 10961);\n this.mirroringShapeCharacters.setValue(10963, 10964);\n this.mirroringShapeCharacters.setValue(10964, 10963);\n this.mirroringShapeCharacters.setValue(10965, 10966);\n this.mirroringShapeCharacters.setValue(10966, 10965);\n this.mirroringShapeCharacters.setValue(10974, 8870);\n this.mirroringShapeCharacters.setValue(10979, 8873);\n this.mirroringShapeCharacters.setValue(10980, 8872);\n this.mirroringShapeCharacters.setValue(10981, 8875);\n this.mirroringShapeCharacters.setValue(10988, 10989);\n this.mirroringShapeCharacters.setValue(10989, 10988);\n this.mirroringShapeCharacters.setValue(10999, 11000);\n this.mirroringShapeCharacters.setValue(11000, 10999);\n this.mirroringShapeCharacters.setValue(11001, 11002);\n this.mirroringShapeCharacters.setValue(11002, 11001);\n this.mirroringShapeCharacters.setValue(12296, 12297);\n this.mirroringShapeCharacters.setValue(12297, 12296);\n this.mirroringShapeCharacters.setValue(12298, 12299);\n this.mirroringShapeCharacters.setValue(12299, 12298);\n this.mirroringShapeCharacters.setValue(12300, 12301);\n this.mirroringShapeCharacters.setValue(12301, 12300);\n this.mirroringShapeCharacters.setValue(12302, 12303);\n this.mirroringShapeCharacters.setValue(12303, 12302);\n this.mirroringShapeCharacters.setValue(12304, 12305);\n this.mirroringShapeCharacters.setValue(12305, 12304);\n this.mirroringShapeCharacters.setValue(12308, 12309);\n this.mirroringShapeCharacters.setValue(12309, 12308);\n this.mirroringShapeCharacters.setValue(12310, 12311);\n this.mirroringShapeCharacters.setValue(12311, 12310);\n this.mirroringShapeCharacters.setValue(12312, 12313);\n this.mirroringShapeCharacters.setValue(12313, 12312);\n this.mirroringShapeCharacters.setValue(12314, 12315);\n this.mirroringShapeCharacters.setValue(12315, 12314);\n this.mirroringShapeCharacters.setValue(65288, 65289);\n this.mirroringShapeCharacters.setValue(65289, 65288);\n this.mirroringShapeCharacters.setValue(65308, 65310);\n this.mirroringShapeCharacters.setValue(65310, 65308);\n this.mirroringShapeCharacters.setValue(65339, 65341);\n this.mirroringShapeCharacters.setValue(65341, 65339);\n this.mirroringShapeCharacters.setValue(65371, 65373);\n this.mirroringShapeCharacters.setValue(65373, 65371);\n this.mirroringShapeCharacters.setValue(65375, 65376);\n this.mirroringShapeCharacters.setValue(65376, 65375);\n this.mirroringShapeCharacters.setValue(65378, 65379);\n this.mirroringShapeCharacters.setValue(65379, 65378);\n };\n return Bidi;\n}());\nexport { Bidi };\nvar RtlCharacters = /** @class */ (function () {\n //#endregion\n //#region constructors\n function RtlCharacters() {\n //#region fields\n /// \n /// Specifies the character types.\n /// \n this.types = [];\n /// \n /// Specifies the text order (RTL or LTR).\n /// \n this.textOrder = -1;\n /// \n /// Specifies the RTL character types.\n /// \n /* tslint:disable-next-line:prefer-array-literal */\n this.rtlCharacterTypes = new Array(65536);\n //#endregion\n //#region constants\n /// \n /// Left-to-Right (Non-European or non-Arabic digits).\n /// \n this.L = 0;\n /// \n /// Left-to-Right Embedding\n /// \n this.LRE = 1;\n /// \n /// Left-to-Right Override\n /// \n this.LRO = 2;\n /// \n /// Right-to-Left (Hebrew alphabet, and related punctuation).\n /// \n this.R = 3;\n /// \n /// Right-to-Left Arabic \n /// \n this.AL = 4;\n /// \n /// Right-to-Left Embedding.\n /// \n this.RLE = 5;\n /// \n /// Right-to-Left Override\n /// \n this.RLO = 6;\n /// \n /// Pop Directional Format\n /// \n this.PDF = 7;\n /// \n /// European Number (European digits, Eastern Arabic-Indic digits).\n /// \n this.EN = 8;\n /// \n /// European Number Separator (Plus sign, Minus sign).\n /// \n this.ES = 9;\n /// \n /// European Number Terminator (Degree sign, currency symbols).\n /// \n this.ET = 10;\n /// \n /// Arabic Number (Arabic-Indic digits, Arabic decimal and thousands separators).\n /// \n this.AN = 11;\n /// \n /// Common Number Separator (Colon, Comma, Full Stop, No-Break Space.\n /// \n this.CS = 12;\n /// \n /// Nonspacing Mark (Characters with the General_Category values).\n /// \n this.NSM = 13;\n /// \n /// Boundary Neutral (Default ignorables, non-characters, and control characters, other than those explicitly given other types.)\n /// \n this.BN = 14;\n /// \n /// Paragraph Separator (Paragraph separator, appropriate Newline Functions, higher-level protocol paragraph determination).\n /// \n this.B = 15;\n /// \n /// \tSegment Separator (tab).\n /// \n this.S = 16;\n /// \n /// Whitespace (Space, Figure space, Line separator, Form feed, General Punctuation spaces).\n /// \n this.WS = 17;\n /// \n /// Other Neutrals (All other characters, including object replacement character).\n /// \n this.ON = 18;\n /// \n /// RTL character types.\n /// \n this.charTypes = [\n this.L, this.EN, this.BN, this.ES, this.ES, this.S, this.ET, this.ET, this.B, this.AN, this.AN, this.S, this.CS, this.CS,\n this.WS, this.NSM, this.NSM, this.B, this.BN, 27, this.BN, 28, 30, this.B, 31, 31, this.S, 32, 32, this.WS, 33, 34,\n this.ON, 35, 37, this.ET, 38, 42, this.ON, 43, 43, this.ET, 44, 44, this.CS, 45, 45, this.ET, 46, 46, this.CS,\n 47, 47, this.CS, 48, 57, this.EN, 58, 58, this.CS, 59, 64, this.ON, 65, 90, this.L, 91, 96, this.ON, 97, 122, this.L,\n 123, 126, this.ON, 127, 132, this.BN, 133, 133, this.B, 134, 159, this.BN, 160, 160, this.CS,\n 161, 161, this.ON, 162, 165, this.ET, 166, 169, this.ON, 170, 170, this.L, 171, 175, this.ON,\n 176, 177, this.ET, 178, 179, this.EN, 180, 180, this.ON, 181, 181, this.L, 182, 184, this.ON,\n 185, 185, this.EN, 186, 186, this.L, 187, 191, this.ON, 192, 214, this.L, 215, 215, this.ON,\n 216, 246, this.L, 247, 247, this.ON, 248, 696, this.L, 697, 698, this.ON, 699, 705, this.L,\n 706, 719, this.ON, 720, 721, this.L, 722, 735, this.ON, 736, 740, this.L, 741, 749, this.ON,\n 750, 750, this.L, 751, 767, this.ON, 768, 855, this.NSM, 856, 860, this.L, 861, 879, this.NSM,\n 880, 883, this.L, 884, 885, this.ON, 886, 893, this.L, 894, 894, this.ON, 895, 899, this.L,\n 900, 901, this.ON, 902, 902, this.L, 903, 903, this.ON, 904, 1013, this.L, 1014, 1014, this.ON,\n 1015, 1154, this.L, 1155, 1158, this.NSM, 1159, 1159, this.L, 1160, 1161, this.NSM,\n 1162, 1417, this.L, 1418, 1418, this.ON, 1419, 1424, this.L, 1425, 1441, this.NSM,\n 1442, 1442, this.L, 1443, 1465, this.NSM, 1466, 1466, this.L, 1467, 1469, this.NSM,\n 1470, 1470, this.R, 1471, 1471, this.NSM, 1472, 1472, this.R, 1473, 1474, this.NSM,\n 1475, 1475, this.R, 1476, 1476, this.NSM, 1477, 1487, this.L, 1488, 1514, this.R,\n 1515, 1519, this.L, 1520, 1524, this.R, 1525, 1535, this.L, 1536, 1539, this.AL,\n 1540, 1547, this.L, 1548, 1548, this.CS, 1549, 1549, this.AL, 1550, 1551, this.ON,\n 1552, 1557, this.NSM, 1558, 1562, this.L, 1563, 1563, this.AL, 1564, 1566, this.L,\n 1567, 1567, this.AL, 1568, 1568, this.L, 1569, 1594, this.AL, 1595, 1599, this.L,\n 1600, 1610, this.AL, 1611, 1624, this.NSM, 1625, 1631, this.L, 1632, 1641, this.AN,\n 1642, 1642, this.ET, 1643, 1644, this.AN, 1645, 1647, this.AL, 1648, 1648, this.NSM,\n 1649, 1749, this.AL, 1750, 1756, this.NSM, 1757, 1757, this.AL, 1758, 1764, this.NSM,\n 1765, 1766, this.AL, 1767, 1768, this.NSM, 1769, 1769, this.ON, 1770, 1773, this.NSM,\n 1774, 1775, this.AL, 1776, 1785, this.EN, 1786, 1805, this.AL, 1806, 1806, this.L,\n 1807, 1807, this.BN, 1808, 1808, this.AL, 1809, 1809, this.NSM, 1810, 1839, this.AL,\n 1840, 1866, this.NSM, 1867, 1868, this.L, 1869, 1871, this.AL, 1872, 1919, this.L,\n 1920, 1957, this.AL, 1958, 1968, this.NSM, 1969, 1969, this.AL, 1970, 2304, this.L,\n 2305, 2306, this.NSM, 2307, 2363, this.L, 2364, 2364, this.NSM, 2365, 2368, this.L,\n 2369, 2376, this.NSM, 2377, 2380, this.L, 2381, 2381, this.NSM, 2382, 2384, this.L,\n 2385, 2388, this.NSM, 2389, 2401, this.L, 2402, 2403, this.NSM, 2404, 2432, this.L,\n 2433, 2433, this.NSM, 2434, 2491, this.L, 2492, 2492, this.NSM, 2493, 2496, this.L,\n 2497, 2500, this.NSM, 2501, 2508, this.L, 2509, 2509, this.NSM, 2510, 2529, this.L,\n 2530, 2531, this.NSM, 2532, 2545, this.L, 2546, 2547, this.ET, 2548, 2560, this.L,\n 2561, 2562, this.NSM, 2563, 2619, this.L, 2620, 2620, this.NSM, 2621, 2624, this.L,\n 2625, 2626, this.NSM, 2627, 2630, this.L, 2631, 2632, this.NSM, 2633, 2634, this.L,\n 2635, 2637, this.NSM, 2638, 2671, this.L, 2672, 2673, this.NSM, 2674, 2688, this.L,\n 2689, 2690, this.NSM, 2691, 2747, this.L, 2748, 2748, this.NSM, 2749, 2752, this.L,\n 2753, 2757, this.NSM, 2758, 2758, this.L, 2759, 2760, this.NSM, 2761, 2764, this.L,\n 2765, 2765, this.NSM, 2766, 2785, this.L, 2786, 2787, this.NSM, 2788, 2800, this.L,\n 2801, 2801, this.ET, 2802, 2816, this.L, 2817, 2817, this.NSM, 2818, 2875, this.L,\n 2876, 2876, this.NSM, 2877, 2878, this.L, 2879, 2879, this.NSM, 2880, 2880, this.L,\n 2881, 2883, this.NSM, 2884, 2892, this.L, 2893, 2893, this.NSM, 2894, 2901, this.L,\n 2902, 2902, this.NSM, 2903, 2945, this.L, 2946, 2946, this.NSM, 2947, 3007, this.L,\n 3008, 3008, this.NSM, 3009, 3020, this.L, 3021, 3021, this.NSM, 3022, 3058, this.L,\n 3059, 3064, this.ON, 3065, 3065, this.ET, 3066, 3066, this.ON, 3067, 3133, this.L,\n 3134, 3136, this.NSM, 3137, 3141, this.L, 3142, 3144, this.NSM, 3145, 3145, this.L,\n 3146, 3149, this.NSM, 3150, 3156, this.L, 3157, 3158, this.NSM, 3159, 3259, this.L,\n 3260, 3260, this.NSM, 3261, 3275, this.L, 3276, 3277, this.NSM, 3278, 3392, this.L,\n 3393, 3395, this.NSM, 3396, 3404, this.L, 3405, 3405, this.NSM, 3406, 3529, this.L,\n 3530, 3530, this.NSM, 3531, 3537, this.L, 3538, 3540, this.NSM, 3541, 3541, this.L,\n 3542, 3542, this.NSM, 3543, 3632, this.L, 3633, 3633, this.NSM, 3634, 3635, this.L,\n 3636, 3642, this.NSM, 3643, 3646, this.L, 3647, 3647, this.ET, 3648, 3654, this.L,\n 3655, 3662, this.NSM, 3663, 3760, this.L, 3761, 3761, this.NSM, 3762, 3763, this.L,\n 3764, 3769, this.NSM, 3770, 3770, this.L, 3771, 3772, this.NSM, 3773, 3783, this.L,\n 3784, 3789, this.NSM, 3790, 3863, this.L, 3864, 3865, this.NSM, 3866, 3892, this.L,\n 3893, 3893, this.NSM, 3894, 3894, this.L, 3895, 3895, this.NSM, 3896, 3896, this.L,\n 3897, 3897, this.NSM, 3898, 3901, this.ON, 3902, 3952, this.L, 3953, 3966, this.NSM,\n 3967, 3967, this.L, 3968, 3972, this.NSM, 3973, 3973, this.L, 3974, 3975, this.NSM,\n 3976, 3983, this.L, 3984, 3991, this.NSM, 3992, 3992, this.L, 3993, 4028, this.NSM,\n 4029, 4037, this.L, 4038, 4038, this.NSM, 4039, 4140, this.L, 4141, 4144, this.NSM,\n 4145, 4145, this.L, 4146, 4146, this.NSM, 4147, 4149, this.L, 4150, 4151, this.NSM,\n 4152, 4152, this.L, 4153, 4153, this.NSM, 4154, 4183, this.L, 4184, 4185, this.NSM,\n 4186, 5759, this.L, 5760, 5760, this.WS, 5761, 5786, this.L, 5787, 5788, this.ON,\n 5789, 5905, this.L, 5906, 5908, this.NSM, 5909, 5937, this.L, 5938, 5940, this.NSM,\n 5941, 5969, this.L, 5970, 5971, this.NSM, 5972, 6001, this.L, 6002, 6003, this.NSM,\n 6004, 6070, this.L, 6071, 6077, this.NSM, 6078, 6085, this.L, 6086, 6086, this.NSM,\n 6087, 6088, this.L, 6089, 6099, this.NSM, 6100, 6106, this.L, 6107, 6107, this.ET,\n 6108, 6108, this.L, 6109, 6109, this.NSM, 6110, 6127, this.L, 6128, 6137, this.ON,\n 6138, 6143, this.L, 6144, 6154, this.ON, 6155, 6157, this.NSM, 6158, 6158, this.WS,\n 6159, 6312, this.L, 6313, 6313, this.NSM, 6314, 6431, this.L, 6432, 6434, this.NSM,\n 6435, 6438, this.L, 6439, 6443, this.NSM, 6444, 6449, this.L, 6450, 6450, this.NSM,\n 6451, 6456, this.L, 6457, 6459, this.NSM, 6460, 6463, this.L, 6464, 6464, this.ON,\n 6465, 6467, this.L, 6468, 6469, this.ON, 6470, 6623, this.L, 6624, 6655, this.ON,\n 6656, 8124, this.L, 8125, 8125, this.ON, 8126, 8126, this.L, 8127, 8129, this.ON,\n 8130, 8140, this.L, 8141, 8143, this.ON, 8144, 8156, this.L, 8157, 8159, this.ON,\n 8160, 8172, this.L, 8173, 8175, this.ON, 8176, 8188, this.L, 8189, 8190, this.ON,\n 8191, 8191, this.L, 8192, 8202, this.WS, 8203, 8205, this.BN, 8206, 8206, this.L,\n 8207, 8207, this.R, 8208, 8231, this.ON, 8232, 8232, this.WS, 8233, 8233, this.B,\n 8234, 8234, this.LRE, 8235, 8235, this.RLE, 8236, 8236, this.PDF, 8237, 8237, this.LRO,\n 8238, 8238, this.RLO, 8239, 8239, this.WS, 8240, 8244, this.ET, 8245, 8276, this.ON,\n 8277, 8278, this.L, 8279, 8279, this.ON, 8280, 8286, this.L, 8287, 8287, this.WS,\n 8288, 8291, this.BN, 8292, 8297, this.L, 8298, 8303, this.BN, 8304, 8304, this.EN,\n 8305, 8307, this.L, 8308, 8313, this.EN, 8314, 8315, this.ET, 8316, 8318, this.ON,\n 8319, 8319, this.L, 8320, 8329, this.EN, 8330, 8331, this.ET, 8332, 8334, this.ON,\n 8335, 8351, this.L, 8352, 8369, this.ET, 8370, 8399, this.L, 8400, 8426, this.NSM,\n 8427, 8447, this.L, 8448, 8449, this.ON, 8450, 8450, this.L, 8451, 8454, this.ON,\n 8455, 8455, this.L, 8456, 8457, this.ON, 8458, 8467, this.L, 8468, 8468, this.ON,\n 8469, 8469, this.L, 8470, 8472, this.ON, 8473, 8477, this.L, 8478, 8483, this.ON,\n 8484, 8484, this.L, 8485, 8485, this.ON, 8486, 8486, this.L, 8487, 8487, this.ON,\n 8488, 8488, this.L, 8489, 8489, this.ON, 8490, 8493, this.L, 8494, 8494, this.ET,\n 8495, 8497, this.L, 8498, 8498, this.ON, 8499, 8505, this.L, 8506, 8507, this.ON,\n 8508, 8511, this.L, 8512, 8516, this.ON, 8517, 8521, this.L, 8522, 8523, this.ON,\n 8524, 8530, this.L, 8531, 8543, this.ON, 8544, 8591, this.L, 8592, 8721, this.ON,\n 8722, 8723, this.ET, 8724, 9013, this.ON, 9014, 9082, this.L, 9083, 9108, this.ON,\n 9109, 9109, this.L, 9110, 9168, this.ON, 9169, 9215, this.L, 9216, 9254, this.ON,\n 9255, 9279, this.L, 9280, 9290, this.ON, 9291, 9311, this.L, 9312, 9371, this.EN,\n 9372, 9449, this.L, 9450, 9450, this.EN, 9451, 9751, this.ON, 9752, 9752, this.L,\n 9753, 9853, this.ON, 9854, 9855, this.L, 9856, 9873, this.ON, 9874, 9887, this.L,\n 9888, 9889, this.ON, 9890, 9984, this.L, 9985, 9988, this.ON, 9989, 9989, this.L,\n 9990, 9993, this.ON, 9994, 9995, this.L, 9996, 10023, this.ON, 10024, 10024, this.L,\n 10025, 10059, this.ON, 10060, 10060, this.L, 10061, 10061, this.ON, 10062, 10062, this.L,\n 10063, 10066, this.ON, 10067, 10069, this.L, 10070, 10070, this.ON, 10071, 10071, this.L,\n 10072, 10078, this.ON, 10079, 10080, this.L, 10081, 10132, this.ON, 10133, 10135, this.L,\n 10136, 10159, this.ON, 10160, 10160, this.L, 10161, 10174, this.ON, 10175, 10191, this.L,\n 10192, 10219, this.ON, 10220, 10223, this.L, 10224, 11021, this.ON, 11022, 11903, this.L,\n 11904, 11929, this.ON, 11930, 11930, this.L, 11931, 12019, this.ON, 12020, 12031, this.L,\n 12032, 12245, this.ON, 12246, 12271, this.L, 12272, 12283, this.ON, 12284, 12287, this.L,\n 12288, 12288, this.WS, 12289, 12292, this.ON, 12293, 12295, this.L, 12296, 12320, this.ON,\n 12321, 12329, this.L, 12330, 12335, this.NSM, 12336, 12336, this.ON, 12337, 12341, this.L,\n 12342, 12343, this.ON, 12344, 12348, this.L, 12349, 12351, this.ON, 12352, 12440, this.L,\n 12441, 12442, this.NSM, 12443, 12444, this.ON, 12445, 12447, this.L, 12448, 12448, this.ON,\n 12449, 12538, this.L, 12539, 12539, this.ON, 12540, 12828, this.L, 12829, 12830, this.ON,\n 12831, 12879, this.L, 12880, 12895, this.ON, 12896, 12923, this.L, 12924, 12925, this.ON,\n 12926, 12976, this.L, 12977, 12991, this.ON, 12992, 13003, this.L, 13004, 13007, this.ON,\n 13008, 13174, this.L, 13175, 13178, this.ON, 13179, 13277, this.L, 13278, 13279, this.ON,\n 13280, 13310, this.L, 13311, 13311, this.ON, 13312, 19903, this.L, 19904, 19967, this.ON,\n 19968, 42127, this.L, 42128, 42182, this.ON, 42183, 64284, this.L, 64285, 64285, this.R,\n 64286, 64286, this.NSM, 64287, 64296, this.R, 64297, 64297, this.ET, 64298, 64310, this.R,\n 64311, 64311, this.L, 64312, 64316, this.R, 64317, 64317, this.L, 64318, 64318, this.R,\n 64319, 64319, this.L, 64320, 64321, this.R, 64322, 64322, this.L, 64323, 64324, this.R,\n 64325, 64325, this.L, 64326, 64335, this.R, 64336, 64433, this.AL, 64434, 64466, this.L,\n 64467, 64829, this.AL, 64830, 64831, this.ON, 64832, 64847, this.L, 64848, 64911, this.AL,\n 64912, 64913, this.L, 64914, 64967, this.AL, 64968, 65007, this.L, 65008, 65020, this.AL,\n 65021, 65021, this.ON, 65022, 65023, this.L, 65024, 65039, this.NSM, 65040, 65055, this.L,\n 65056, 65059, this.NSM, 65060, 65071, this.L, 65072, 65103, this.ON, 65104, 65104, this.CS,\n 65105, 65105, this.ON, 65106, 65106, this.CS, 65107, 65107, this.L, 65108, 65108, this.ON,\n 65109, 65109, this.CS, 65110, 65118, this.ON, 65119, 65119, this.ET, 65120, 65121, this.ON,\n 65122, 65123, this.ET, 65124, 65126, this.ON, 65127, 65127, this.L, 65128, 65128, this.ON,\n 65129, 65130, this.ET, 65131, 65131, this.ON, 65132, 65135, this.L, 65136, 65140, this.AL,\n 65141, 65141, this.L, 65142, 65276, this.AL, 65277, 65278, this.L, 65279, 65279, this.BN,\n 65280, 65280, this.L, 65281, 65282, this.ON, 65283, 65285, this.ET, 65286, 65290, this.ON,\n 65291, 65291, this.ET, 65292, 65292, this.CS, 65293, 65293, this.ET, 65294, 65294, this.CS,\n 65295, 65295, this.ES, 65296, 65305, this.EN, 65306, 65306, this.CS, 65307, 65312, this.ON,\n 65313, 65338, this.L, 65339, 65344, this.ON, 65345, 65370, this.L, 65371, 65381, this.ON,\n 65382, 65503, this.L, 65504, 65505, this.ET, 65506, 65508, this.ON, 65509, 65510, this.ET,\n 65511, 65511, this.L, 65512, 65518, this.ON, 65519, 65528, this.L, 65529, 65531, this.BN,\n 65532, 65533, this.ON, 65534, 65535, this.L\n ];\n for (var i = 0; i < this.charTypes.length; ++i) {\n var start = this.charTypes[i];\n var end = this.charTypes[++i];\n var b = this.charTypes[++i];\n while (start <= end) {\n this.rtlCharacterTypes[start++] = b;\n }\n }\n }\n //#endregion\n //#region implementation\n RtlCharacters.prototype.getVisualOrder = function (inputText, isRtl) {\n this.types = this.getCharacterCode(inputText);\n this.textOrder = isRtl ? this.LRE : this.L;\n this.doVisualOrder();\n var result = [];\n for (var i = 0; i < this.levels.length; i++) {\n result[i] = this.levels[i];\n }\n return result;\n };\n RtlCharacters.prototype.getCharacterCode = function (text) {\n var characterCodes = [];\n for (var i = 0; i < text.length; i++) {\n characterCodes[i] = this.rtlCharacterTypes[text[i].charCodeAt(0)];\n }\n return characterCodes;\n };\n RtlCharacters.prototype.setDefaultLevels = function () {\n for (var i = 0; i < this.length; i++) {\n this.levels[i] = this.textOrder;\n }\n };\n RtlCharacters.prototype.setLevels = function () {\n this.setDefaultLevels();\n for (var n = 0; n < this.length; ++n) {\n var level = this.levels[n];\n if ((level & 0x80) !== 0) {\n level &= 0x7f;\n this.result[n] = ((level & 0x1) === 0) ? this.L : this.R;\n }\n this.levels[n] = level;\n }\n };\n RtlCharacters.prototype.updateLevels = function (index, level, length) {\n if ((level & 1) === 0) {\n for (var i = index; i < length; ++i) {\n if (this.result[i] === this.R) {\n this.levels[i] += 1;\n }\n else if (this.result[i] !== this.L) {\n this.levels[i] += 2;\n }\n }\n }\n else {\n for (var i = index; i < length; ++i) {\n if (this.result[i] !== this.R) {\n this.levels[i] += 1;\n }\n }\n }\n };\n RtlCharacters.prototype.doVisualOrder = function () {\n this.length = this.types.length;\n this.result = this.types;\n this.levels = [];\n this.setLevels();\n this.length = this.getEmbeddedCharactersLength();\n var preview = this.textOrder;\n var i = 0;\n while (i < this.length) {\n var level = this.levels[i];\n var preType = ((Math.max(preview, level) & 0x1) === 0) ? this.L : this.R;\n var length_1 = i + 1;\n while (length_1 < this.length && this.levels[length_1] === level) {\n ++length_1;\n }\n var success = length_1 < this.length ? this.levels[length_1] : this.textOrder;\n var type = ((Math.max(success, level) & 0x1) === 0) ? this.L : this.R;\n this.checkNSM(i, length_1, level, preType, type);\n this.updateLevels(i, level, length_1);\n preview = level;\n i = length_1;\n }\n this.checkEmbeddedCharacters(this.length);\n };\n RtlCharacters.prototype.getEmbeddedCharactersLength = function () {\n var index = 0;\n for (var i = 0; i < this.length; ++i) {\n if (!(this.types[i] === this.LRE || this.types[i] === this.RLE || this.types[i] === this.LRO ||\n this.types[i] === this.RLO || this.types[i] === this.PDF || this.types[i] === this.BN)) {\n this.result[index] = this.result[i];\n this.levels[index] = this.levels[i];\n index++;\n }\n }\n return index;\n };\n RtlCharacters.prototype.checkEmbeddedCharacters = function (length) {\n for (var i = this.types.length - 1; i >= 0; --i) {\n if (this.types[i] === this.LRE || this.types[i] === this.RLE || this.types[i] === this.LRO ||\n this.types[i] === this.RLO || this.types[i] === this.PDF || this.types[i] === this.BN) {\n this.result[i] = this.types[i];\n this.levels[i] = -1;\n }\n else {\n length -= 1;\n this.result[i] = this.result[length];\n this.levels[i] = this.levels[length];\n }\n }\n for (var i = 0; i < this.types.length; i++) {\n if (this.levels[i] === -1) {\n if (i === 0) {\n this.levels[i] = this.textOrder;\n }\n else {\n this.levels[i] = this.levels[i - 1];\n }\n }\n }\n };\n RtlCharacters.prototype.checkNSM = function (index, length, level, startType, endType) {\n var charType = startType;\n for (var i = index; i < length; ++i) {\n if (this.result[i] === this.NSM) {\n this.result[i] = charType;\n }\n else {\n charType = this.result[i];\n }\n }\n this.checkEuropeanDigits(index, length, level, startType, endType);\n };\n RtlCharacters.prototype.checkEuropeanDigits = function (index, length, level, startType, endType) {\n for (var i = index; i < length; ++i) {\n if (this.result[i] === this.EN) {\n for (var j = i - 1; j >= index; --j) {\n if (this.result[j] === this.L || this.result[j] === this.R || this.result[j] === this.AL) {\n if (this.result[j] === this.AL) {\n this.result[i] = this.AN;\n }\n break;\n }\n }\n }\n }\n this.checkArabicCharacters(index, length, level, startType, endType);\n };\n RtlCharacters.prototype.checkArabicCharacters = function (index, length, level, startType, endType) {\n for (var i = index; i < length; ++i) {\n if (this.result[i] === this.AL) {\n this.result[i] = this.R;\n }\n }\n this.checkEuropeanNumberSeparator(index, length, level, startType, endType);\n };\n RtlCharacters.prototype.checkEuropeanNumberSeparator = function (index, length, level, startType, endType) {\n for (var i = index + 1; i < length - 1; ++i) {\n if (this.result[i] === this.ES || this.result[i] === this.CS) {\n var preview = this.result[i - 1];\n var success = this.result[i + 1];\n if (preview === this.EN && success === this.EN) {\n this.result[i] = this.EN;\n }\n else if (this.result[i] === this.CS && preview === this.AN && success === this.AN) {\n this.result[i] = this.AN;\n }\n }\n }\n this.checkEuropeanNumberTerminator(index, length, level, startType, endType);\n };\n RtlCharacters.prototype.checkEuropeanNumberTerminator = function (index, length, level, startType, endType) {\n for (var i = index; i < length; ++i) {\n if (this.result[i] === this.ET) {\n var s = i;\n var b = [];\n b.push(this.ET);\n var l = this.getLength(s, length, b);\n var data = s === index ? startType : this.result[s - 1];\n if (data !== this.EN) {\n data = (l === length) ? endType : this.result[l];\n }\n if (data === this.EN) {\n for (var j = s; j < l; ++j) {\n this.result[j] = this.EN;\n }\n }\n i = l;\n }\n }\n this.checkOtherNeutrals(index, length, level, startType, endType);\n };\n RtlCharacters.prototype.checkOtherNeutrals = function (index, length, level, startType, endType) {\n for (var i = index; i < length; ++i) {\n if (this.result[i] === this.ES || this.result[i] === this.ET || this.result[i] === this.CS) {\n this.result[i] = this.ON;\n }\n }\n this.checkOtherCharacters(index, length, level, startType, endType);\n };\n RtlCharacters.prototype.checkOtherCharacters = function (index, length, level, startType, endType) {\n for (var i = index; i < length; ++i) {\n if (this.result[i] === this.EN) {\n var pst = startType;\n for (var j = i - 1; j >= index; --j) {\n if (this.result[j] === this.L || this.result[j] === this.R) {\n pst = this.result[j];\n break;\n }\n }\n if (pst === this.L) {\n this.result[i] = this.L;\n }\n }\n }\n this.checkCommanCharacters(index, length, level, startType, endType);\n };\n RtlCharacters.prototype.getLength = function (index, length, validSet) {\n --index;\n while (++index < length) {\n var t = this.result[index];\n for (var i = 0; i < validSet.length; ++i) {\n if (t === validSet[i]) {\n index = this.getLength(++index, length, validSet);\n }\n }\n return index;\n }\n return length;\n };\n RtlCharacters.prototype.checkCommanCharacters = function (index, length, level, startType, endType) {\n for (var i = index; i < length; ++i) {\n if (this.result[i] === this.WS || this.result[i] === this.ON || this.result[i] === this.B ||\n this.result[i] === this.S) {\n var s = i;\n var byte = [this.B, this.S, this.WS, this.ON];\n var l = this.getLength(s, length, byte);\n var lt = 0;\n var tt = 0;\n var rt = 0;\n if (s === index) {\n lt = startType;\n }\n else {\n lt = this.result[s - 1];\n if (lt === this.AN) {\n lt = this.R;\n }\n else if (lt === this.EN) {\n lt = this.R;\n }\n }\n if (l === length) {\n tt = endType;\n }\n else {\n tt = this.result[l];\n if (tt === this.AN) {\n tt = this.R;\n }\n else if (tt === this.EN) {\n tt = this.R;\n }\n }\n if (lt === tt) {\n rt = lt;\n }\n else {\n rt = ((level & 0x1) === 0) ? this.L : this.R;\n }\n for (var j = s; j < l; ++j) {\n this.result[j] = rt;\n }\n i = l;\n }\n }\n };\n return RtlCharacters;\n}());\nexport { RtlCharacters };\n","import { PdfString } from './../../primitives/pdf-string';\nimport { ArabicShapeRenderer } from './rtl/rtl-text-shape';\nimport { PdfTextDirection } from './../enum';\nimport { Bidi } from './rtl/rtl-bidirectional';\n/**\n * `Metrics` of the font.\n * @private\n */\nvar RtlRenderer = /** @class */ (function () {\n function RtlRenderer() {\n //region Constants\n /// Open bracket symbol.\n /// \n this.openBracket = '(';\n /// \n /// Close bracket symbol.\n /// \n this.closeBracket = ')';\n //#endregion\n }\n //#region Constructors\n /// \n /// Initializes a new instance of the class.\n /// \n // public constructor() {\n // }\n //#region Public Methods\n /// \n /// Layouts text. Changes blocks position in the RTL text.\n /// Ligates the text if needed.\n /// \n /// Line of the text.\n /// Font to be used for string printing.\n /// Font alignment.\n /// Indicates whether Word Spacing used or not.\n /// Layout string. \n RtlRenderer.prototype.layout = function (line, font, rtl, wordSpace, format) {\n if (line == null) {\n throw new Error('ArgumentNullException : line');\n }\n if (font == null) {\n throw new Error('ArgumentNullException : font');\n }\n var result = [];\n if (font.Unicode) {\n result = this.customLayout(line, rtl, format, font, wordSpace);\n }\n else {\n result = [];\n result[0] = line;\n }\n return result;\n };\n /// \n /// Layouts a string and splits it by the words and using correct lay outing.\n /// \n /// Text line.\n /// Font object.\n /// Indicates whether RTL should be applied.\n /// Indicates whether word spacing is used.\n /// Array of words if converted, null otherwise. \n RtlRenderer.prototype.splitLayout = function (line, font, rtl, wordSpace, format) {\n if (line == null) {\n throw new Error('ArgumentNullException : line');\n }\n if (font == null) {\n throw new Error('ArgumentNullException : font');\n }\n var words = [];\n var system = false;\n if (!system || words == null) {\n words = this.customSplitLayout(line, font, rtl, wordSpace, format);\n }\n return words;\n };\n //#endregion\n //#region Implementation\n // private isEnglish( word : string) : boolean\n // {\n // let c : string = (word.length > 0) ? word[0] : '';\n // return (c >= '0' && c < 'ÿ');\n // }\n // private keepOrder( words : string, startIndex : number, count: number, result : string[], resultIndex : number) : void\n // {\n // for (let i : number = 0, ri = resultIndex - count + 1; i < count; ++i, ++ri) {\n // result[ri] = words[i + startIndex];\n // }\n // }\n /// \n /// Uses system API to layout the text.\n /// \n /// Line of the text to be layouted.\n /// Font which is used for text printing.\n /// Indicates whether we use RTL or RTL lay outing of the text container.\n /// Layout string. \n /* tslint:disable-next-line:max-line-length */\n RtlRenderer.prototype.getGlyphIndex = function (line, font, rtl, /*out*/ glyphs, custom) {\n var success = true;\n var fail = false;\n if (line == null) {\n throw new Error('ArgumentNullException : line');\n }\n if (font == null) {\n throw new Error('ArgumentNullException : font');\n }\n glyphs = null;\n if (line.length === 0) {\n return { success: fail, glyphs: glyphs };\n }\n var renderer = new ArabicShapeRenderer();\n var text = renderer.shape(line, 0);\n var internalFont = font.fontInternal;\n var ttfReader = internalFont.ttfReader;\n glyphs = new Uint16Array(text.length);\n var i = 0;\n for (var k = 0, len = text.length; k < len; k++) {\n var ch = text[k];\n var glyphInfo = ttfReader.getGlyph(ch);\n if (glyphInfo !== null && typeof glyphInfo !== 'undefined') {\n glyphs[i++] = (glyphInfo).index;\n }\n }\n return { success: success, glyphs: glyphs };\n };\n /* tslint:disable-next-line:max-line-length */\n RtlRenderer.prototype.customLayout = function (line, rtl, format, font, wordSpace) {\n if (wordSpace === null || typeof wordSpace === 'undefined') {\n if (line == null) {\n throw new Error('ArgumentNullException : line');\n }\n var result = null;\n //bidirectional order.\n if (format !== null && format.textDirection !== PdfTextDirection.None) {\n var bidi = new Bidi();\n result = bidi.getLogicalToVisualString(line, rtl);\n }\n return result;\n }\n else {\n if (line == null) {\n throw new Error('ArgumentNullException : line');\n }\n if (font == null) {\n throw new Error('ArgumentNullException : font');\n }\n var layouted = null;\n if (format !== null && format.textDirection !== PdfTextDirection.None) {\n var renderer = new ArabicShapeRenderer();\n var txt = renderer.shape(line, 0);\n layouted = this.customLayout(txt, rtl, format);\n }\n // else {\n // layouted = this.customLayout(line, rtl, format);\n // }\n // We have unicode font, but from the file. \n var result = [];\n // Split the text by words if word spacing is not default.\n if (wordSpace) {\n var words = layouted.split('');\n var count = words.length;\n for (var i = 0; i < count; i++) {\n words[i] = this.addChars(font, words[i]);\n }\n result = words;\n }\n else {\n result = [];\n result[0] = this.addChars(font, layouted);\n }\n return result;\n }\n };\n /// \n /// Add information about used glyphs to the font.\n /// \n /// Font used for text rendering.\n /// Array of used glyphs.\n /// String in the form to be written to the file. \n RtlRenderer.prototype.addChars = function (font, glyphs) {\n var line = glyphs;\n if (font == null) {\n throw new Error('ArgumentNullException : font');\n }\n if (line == null) {\n throw new Error('ArgumentNullException : line');\n }\n var text = line;\n var internalFont = font.fontInternal;\n var ttfReader = internalFont.ttfReader;\n font.setSymbols(text);\n // Reconvert string according to unicode standard.\n text = ttfReader.convertString(text);\n var bytes = PdfString.toUnicodeArray(text, false);\n text = PdfString.byteToString(bytes);\n return text;\n // else {\n // if (font == null) {\n // throw new Error('ArgumentNullException : font');\n // }\n // if (glyphs == null) {\n // throw new Error('ArgumentNullException : glyphs');\n // }\n // // Mark the chars as used.\n // let text : string = '';\n // font.setSymbols(glyphs);\n // // Create string from the glyphs.\n // \n // let chars : string[] = [];\n // for (let i : number = 0; i < glyphs.length; i++) {\n // chars[i] = glyphs[i].toString();\n // }\n // for (let j : number = 0 ; j < chars.length; j++) {\n // text = text + chars[j];\n // }\n // let bytes : number[] = PdfString.toUnicodeArray(text, false);\n // text = PdfString.byteToString(bytes);\n // return text;\n // }\n };\n /// \n /// Layouts a string and splits it by the words by using custom lay outing.\n /// \n /// Text line.\n /// Font object.\n /// Indicates whether RTL should be applied.\n /// Indicates whether word spacing is used.\n /// Array of words if converted, null otherwise. \n /* tslint:disable-next-line:max-line-length */\n RtlRenderer.prototype.customSplitLayout = function (line, font, rtl, wordSpace, format) {\n if (line == null) {\n throw new Error('ArgumentNullException : line');\n }\n if (font == null) {\n throw new Error('ArgumentNullException : font');\n }\n var reversedLine = this.customLayout(line, rtl, format);\n var words = reversedLine.split('');\n return words;\n };\n return RtlRenderer;\n}());\nexport { RtlRenderer };\n","/**\n * PdfGraphics.ts class for EJ2-PDF\n */\nimport { PdfColorSpace, TextRenderingMode, PdfFillMode, PdfTextAlignment } from './enum';\nimport { PdfVerticalAlignment, PdfBlendMode } from './enum';\nimport { PdfSubSuperScript } from './fonts/enum';\nimport { PdfStreamWriter } from './../input-output/pdf-stream-writer';\nimport { PdfPen } from './pdf-pen';\nimport { PdfBrush } from './brushes/pdf-brush';\nimport { PdfSolidBrush } from './brushes/pdf-solid-brush';\nimport { PdfFont } from './fonts/pdf-font';\nimport { PdfTransformationMatrix } from './pdf-transformation-matrix';\nimport { PointF, SizeF, RectangleF } from './../drawing/pdf-drawing';\nimport { ProcedureSets } from './constants';\nimport { PdfString } from './../primitives/pdf-string';\nimport { PdfStringFormat } from './fonts/pdf-string-format';\nimport { TemporaryDictionary } from './../collections/object-object-pair/dictionary';\nimport { PdfTransparency } from './pdf-transparency';\nimport { PdfStringLayouter, LineType } from './fonts/string-layouter';\nimport { DictionaryProperties } from './../input-output/pdf-dictionary-properties';\nimport { StringTokenizer } from './fonts/string-tokenizer';\nimport { PdfAutomaticFieldInfoCollection } from './../document/automatic-fields/automatic-field-info-collection';\nimport { PdfAutomaticFieldInfo } from './../document/automatic-fields/automatic-field-info';\nimport { Operators } from './../input-output/pdf-operators';\nimport { UnicodeTrueTypeFont } from './fonts/unicode-true-type-font';\nimport { InternalEnum } from './../primitives/pdf-string';\nimport { RtlRenderer } from './fonts/rtl-renderer';\nimport { PdfTextDirection } from './enum';\n/**\n * `PdfGraphics` class represents a graphics context of the objects.\n * It's used for performing all the graphics operations.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a new page to the document\n * let page1 : PdfPage = document.pages.add();\n * // set the font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // create black brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * //\n * //graphics of the page\n * let page1Graphics : PdfGraphics = page1.graphics;\n * // draw the text on the page1 graphics\n * page1Graphics.drawString('Hello World', font, blackBrush, new PointF(0, 0));\n * //\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\nvar PdfGraphics = /** @class */ (function () {\n function PdfGraphics(arg1, arg2, arg3) {\n /**\n * Represents the `Current color space`.\n * @private\n */\n this.currentColorSpace = PdfColorSpace.Rgb;\n /**\n * Stores `previous rendering mode`.\n * @private\n */\n this.previousTextRenderingMode = TextRenderingMode.Fill;\n /**\n * Previous `character spacing` value or 0.\n * @private\n */\n this.previousCharacterSpacing = 0.0;\n /**\n * Previous `word spacing` value or 0.\n * @private\n */\n this.previousWordSpacing = 0.0;\n /**\n * The `previously used text scaling` value.\n * @private\n */\n this.previousTextScaling = 100.0;\n /**\n * Instance of `ProcedureSets` class.\n * @private\n */\n this.procedureSets = new ProcedureSets();\n /**\n * To check wihether it is a `direct text rendering`.\n * @default true\n * @private\n */\n this.isNormalRender = true;\n /**\n * check whether to `use font size` to calculate the shift.\n * @default false\n * @private\n */\n this.isUseFontSize = false;\n /**\n * check whether the font is in `italic type`.\n * @default false\n * @private\n */\n this.isItalic = false;\n /**\n * Check whether it is an `emf Text Matrix`.\n * @default false\n * @private\n */\n this.isEmfTextScaled = false;\n /**\n * Check whether it is an `emf` call.\n * @default false\n * @private\n */\n this.isEmf = false;\n /**\n * Check whether it is an `emf plus` call.\n * @default false\n * @private\n */\n this.isEmfPlus = false;\n /**\n * Check whether it is in `base line format`.\n * @default true\n * @private\n */\n this.isBaselineFormat = true;\n /**\n * Emf Text `Scaling Factor`.\n * @private\n */\n this.emfScalingFactor = new SizeF(0, 0);\n /**\n * To check whether the `last color space` of document and garphics is saved.\n * @private\n */\n this.colorSpaceChanged = false;\n /**\n * Stores an instance of `DictionaryProperties`.\n * @private\n */\n this.dictionaryProperties = new DictionaryProperties();\n /**\n * Checks whether the x co-ordinate is need to set as client size or not.\n * @hidden\n * @private\n */\n this.isOverloadWithPosition = false;\n /**\n * Checks whether the x co-ordinate is need to set as client size or not.\n * @hidden\n * @private\n */\n this.isPointOverload = false;\n /**\n * Current colorspaces.\n * @hidden\n * @private\n */\n this.currentColorSpaces = ['RGB', 'CMYK', 'GrayScale', 'Indexed'];\n /**\n * Checks the current image `is optimized` or not.\n * @default false.\n * @private\n */\n this.isImageOptimized = false;\n /**\n * Stores the `graphics states`.\n * @private\n */\n this.graphicsState = [];\n /**\n * Indicates whether the object `had trasparency`.\n * @default false\n * @private\n */\n this.istransparencySet = false;\n /**\n * Stores the instance of `PdfAutomaticFieldInfoCollection` class .\n * @default null\n * @private\n */\n this.internalAutomaticFields = null;\n /**\n * Stores the index of the start line that should draw with in the next page.\n * @private\n */\n this.startCutIndex = -1;\n if (arg3 instanceof PdfStreamWriter) {\n this.pdfStreamWriter = arg3;\n this.getResources = arg2;\n this.canvasSize = arg1;\n this.initialize();\n }\n else {\n this.constructor(arg1, arg2, new PdfStreamWriter(arg3));\n }\n }\n Object.defineProperty(PdfGraphics.prototype, \"stringLayoutResult\", {\n // Properties\n /**\n * Returns the `result` after drawing string.\n * @private\n */\n get: function () {\n return this.pdfStringLayoutResult;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphics.prototype, \"size\", {\n /**\n * Gets the `size` of the canvas.\n * @private\n */\n get: function () {\n return this.canvasSize;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphics.prototype, \"mediaBoxUpperRightBound\", {\n /**\n * Gets and Sets the value of `MediaBox upper right bound`.\n * @private\n */\n get: function () {\n if (typeof this.internalMediaBoxUpperRightBound === 'undefined') {\n this.internalMediaBoxUpperRightBound = 0;\n }\n return this.internalMediaBoxUpperRightBound;\n },\n set: function (value) {\n this.internalMediaBoxUpperRightBound = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphics.prototype, \"clientSize\", {\n /**\n * Gets the `size` of the canvas reduced by margins and page templates.\n * @private\n */\n get: function () {\n return new SizeF(this.clipBounds.width, this.clipBounds.height);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphics.prototype, \"colorSpace\", {\n /**\n * Gets or sets the current `color space` of the document\n * @private\n */\n get: function () {\n return this.currentColorSpace;\n },\n set: function (value) {\n this.currentColorSpace = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphics.prototype, \"streamWriter\", {\n /**\n * Gets the `stream writer`.\n * @private\n */\n get: function () {\n return this.pdfStreamWriter;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphics.prototype, \"matrix\", {\n /**\n * Gets the `transformation matrix` reflecting current transformation.\n * @private\n */\n get: function () {\n if (this.transformationMatrix == null) {\n this.transformationMatrix = new PdfTransformationMatrix();\n }\n return this.transformationMatrix;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphics.prototype, \"layer\", {\n /**\n * Gets the `layer` for the graphics, if exists.\n * @private\n */\n get: function () {\n return this.pageLayer;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphics.prototype, \"page\", {\n /**\n * Gets the `page` for this graphics, if exists.\n * @private\n */\n get: function () {\n return this.pageLayer.page;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphics.prototype, \"automaticFields\", {\n get: function () {\n if (this.internalAutomaticFields == null || typeof this.internalAutomaticFields === 'undefined') {\n this.internalAutomaticFields = new PdfAutomaticFieldInfoCollection();\n }\n return this.internalAutomaticFields;\n },\n enumerable: true,\n configurable: true\n });\n //Implementation\n /**\n * `Initializes` this instance.\n * @private\n */\n PdfGraphics.prototype.initialize = function () {\n this.bStateSaved = false;\n this.currentPen = null;\n this.currentBrush = null;\n this.currentFont = null;\n this.currentColorSpace = PdfColorSpace.Rgb;\n this.bCSInitialized = false;\n this.transformationMatrix = null;\n this.previousTextRenderingMode = (-1); //.Fill;\n this.previousCharacterSpacing = -1.0;\n this.previousWordSpacing = -1.0;\n this.previousTextScaling = -100.0;\n // this.m_trasparencies = null;\n this.currentStringFormat = null;\n this.clipBounds = new RectangleF(new PointF(0, 0), this.size);\n this.getResources.getResources().requireProcedureSet(this.procedureSets.pdf);\n };\n PdfGraphics.prototype.drawPdfTemplate = function (template, location, size) {\n if (typeof size === 'undefined') {\n if (template == null) {\n throw Error('ArgumentNullException-template');\n }\n this.drawPdfTemplate(template, location, template.size);\n }\n else {\n // let crossTable : PdfCrossTable = null;\n // if (this.pageLayer != null) {\n // crossTable = (this.page as PdfPage).section.parentDocument.crossTable;\n // }\n if (template == null) {\n throw Error('ArgumentNullException-template');\n }\n var scaleX = (template.width > 0) ? size.width / template.width : 1;\n var scaleY = (template.height > 0) ? size.height / template.height : 1;\n var bNeedScale = !(scaleX === 1 && scaleY === 1);\n // Save state.\n var state = this.save();\n // Take into consideration that rect location is bottom/left.\n var matrix = new PdfTransformationMatrix();\n if (this.pageLayer != null) {\n this.getTranslateTransform(location.x, location.y + size.height, matrix);\n }\n if (bNeedScale) {\n this.getScaleTransform(scaleX, scaleY, matrix);\n }\n this.pdfStreamWriter.modifyCtm(matrix);\n // Output template.\n var resources = this.getResources.getResources();\n var name_1 = resources.getName(template);\n this.pdfStreamWriter.executeObject(name_1);\n // Restore state.\n this.restore(state);\n //Transfer automatic fields from template.\n var g = template.graphics;\n if (g != null) {\n for (var index = 0; index < g.automaticFields.automaticFields.length; index++) {\n var fieldInfo = g.automaticFields.automaticFields[index];\n var newLocation = new PointF(fieldInfo.location.x + location.x, fieldInfo.location.y + location.y);\n var scalingX = template.size.width == 0 ? 0 : size.width / template.size.width;\n var scalingY = template.size.height == 0 ? 0 : size.height / template.size.height;\n this.automaticFields.add(new PdfAutomaticFieldInfo(fieldInfo.field, newLocation, scalingX, scalingY));\n this.page.dictionary.modify();\n }\n }\n this.getResources.getResources().requireProcedureSet(this.procedureSets.imageB);\n this.getResources.getResources().requireProcedureSet(this.procedureSets.imageC);\n this.getResources.getResources().requireProcedureSet(this.procedureSets.imageI);\n this.getResources.getResources().requireProcedureSet(this.procedureSets.text);\n }\n };\n /* tslint:disable */\n /**\n * @public\n */\n PdfGraphics.prototype.drawString = function (arg1, arg2, arg3, arg4, arg5, arg6, arg7, arg8, arg9) {\n if (typeof arg1 === 'string' && arg2 instanceof PdfFont && (arg3 instanceof PdfPen || arg3 === null) && (arg4 instanceof PdfBrush || arg4 === null) && typeof arg5 === 'number' && typeof arg6 === 'number' && (arg7 instanceof PdfStringFormat || arg7 === null) && typeof arg8 === 'undefined') {\n this.isOverloadWithPosition = true;\n this.drawString(arg1, arg2, arg3, arg4, arg5, arg6, (this.clientSize.width - arg5), 0, arg7);\n }\n else {\n var temparg3 = arg3;\n var temparg4 = arg4;\n var temparg5 = arg5;\n var temparg6 = arg6;\n var temparg7 = arg7;\n var temparg8 = arg8;\n var temparg9 = arg9;\n var layouter = new PdfStringLayouter();\n var result = layouter.layout(arg1, arg2, temparg9, new SizeF(temparg7, temparg8), this.isOverloadWithPosition, this.clientSize);\n if (!result.empty) {\n var rect = this.checkCorrectLayoutRectangle(result.actualSize, temparg5, temparg6, temparg9);\n if (temparg7 <= 0) {\n temparg5 = rect.x;\n temparg7 = rect.width;\n }\n if (temparg8 <= 0) {\n temparg6 = rect.y;\n temparg8 = rect.height;\n }\n this.drawStringLayoutResult(result, arg2, temparg3, temparg4, new RectangleF(temparg5, temparg6, temparg7, temparg8), temparg9);\n this.isEmfTextScaled = false;\n this.emfScalingFactor = new SizeF(0, 0);\n }\n this.getResources.getResources().requireProcedureSet(this.procedureSets.text);\n this.isNormalRender = true;\n this.pdfStringLayoutResult = result;\n this.isUseFontSize = false;\n }\n }; /* tslint:enable */\n PdfGraphics.prototype.drawLine = function (arg1, arg2, arg3, arg4, arg5) {\n if (arg2 instanceof PointF) {\n var temparg2 = arg2;\n var temparg3 = arg3;\n this.drawLine(arg1, temparg2.x, temparg2.y, temparg3.x, temparg3.y);\n }\n else {\n var temparg2 = arg2;\n var temparg3 = arg3;\n var temparg4 = arg4;\n var temparg5 = arg5;\n this.stateControl(arg1, null, null);\n var sw = this.streamWriter;\n sw.beginPath(temparg2, temparg3);\n sw.appendLineSegment(temparg4, temparg5);\n sw.strokePath();\n this.getResources.getResources().requireProcedureSet(this.procedureSets.pdf);\n }\n };\n /* tslint:disable */\n PdfGraphics.prototype.drawRectangle = function (arg1, arg2, arg3, arg4, arg5, arg6) {\n if (arg1 instanceof PdfPen && typeof arg2 === 'number') {\n var temparg3 = arg3;\n this.drawRectangle(arg1, null, arg2, temparg3, arg4, arg5);\n }\n else if (arg1 instanceof PdfBrush && typeof arg2 === 'number') {\n var temparg3 = arg3;\n this.drawRectangle(null, arg1, arg2, temparg3, arg4, arg5);\n }\n else {\n var temparg3 = arg3;\n var temparg4 = arg4;\n var temparg5 = arg5;\n var temparg6 = arg6;\n if (arg2 instanceof PdfSolidBrush && arg2.color.isEmpty) {\n arg2 = null;\n }\n var temparg1 = arg1;\n var temparg2 = arg2;\n this.stateControl(temparg1, temparg2, null);\n this.streamWriter.appendRectangle(temparg3, temparg4, temparg5, temparg6);\n this.drawPath(temparg1, temparg2, false);\n }\n };\n PdfGraphics.prototype.drawPath = function (arg1, arg2, arg3, arg4) {\n if (typeof arg3 === 'boolean') {\n var temparg3 = arg3;\n this.drawPath(arg1, arg2, PdfFillMode.Winding, temparg3);\n }\n else {\n var temparg3 = arg3;\n var temparg4 = arg4;\n var isPen = arg1 != null;\n var isBrush = arg2 != null;\n var isEvenOdd = (temparg3 === PdfFillMode.Alternate);\n if (isPen && isBrush) {\n this.streamWriter.fillStrokePath(isEvenOdd);\n }\n else if (!isPen && !isBrush) {\n this.streamWriter.endPath();\n }\n else if (isPen) {\n this.streamWriter.strokePath();\n }\n else {\n this.streamWriter.fillPath(isEvenOdd);\n }\n }\n };\n /* tslint:disable */\n PdfGraphics.prototype.drawImage = function (arg1, arg2, arg3, arg4, arg5) {\n if (typeof arg2 === 'number' && typeof arg3 === 'number' && typeof arg4 === 'undefined') {\n var size = arg1.physicalDimension;\n this.drawImage(arg1, arg2, arg3, size.width, size.height);\n }\n else {\n var temparg2 = arg2;\n var temparg3 = arg3;\n var temparg4 = arg4;\n var temparg5 = arg5;\n arg1.save();\n var matrix = new PdfTransformationMatrix();\n this.getTranslateTransform(temparg2, (temparg3 + temparg5), matrix);\n this.getScaleTransform(arg4, arg5, matrix);\n this.pdfStreamWriter.write('q');\n this.pdfStreamWriter.modifyCtm(matrix);\n // Output template.\n var resources = this.getResources.getResources();\n if (typeof this.pageLayer !== 'undefined' && this.page != null) {\n resources.document = this.page.document;\n }\n var name_2 = resources.getName(arg1);\n if (typeof this.pageLayer !== 'undefined') {\n this.page.setResources(resources);\n }\n this.pdfStreamWriter.executeObject(name_2);\n this.pdfStreamWriter.write(Operators.restoreState);\n this.pdfStreamWriter.write(Operators.newLine);\n var resource = this.getResources.getResources();\n resource.requireProcedureSet(this.procedureSets.imageB);\n resource.requireProcedureSet(this.procedureSets.imageC);\n resource.requireProcedureSet(this.procedureSets.imageI);\n resource.requireProcedureSet(this.procedureSets.text);\n }\n };\n //Implementation\n /* tslint:disable */\n /**\n * Returns `bounds` of the line info.\n * @private\n */\n PdfGraphics.prototype.getLineBounds = function (lineIndex, result, font, layoutRectangle, format) {\n var bounds;\n if (!result.empty && lineIndex < result.lineCount && lineIndex >= 0) {\n var line = result.lines[lineIndex];\n var vShift = this.getTextVerticalAlignShift(result.actualSize.height, layoutRectangle.height, format);\n var y = vShift + layoutRectangle.y + (result.lineHeight * lineIndex);\n var lineWidth = line.width;\n var hShift = this.getHorizontalAlignShift(lineWidth, layoutRectangle.width, format);\n var lineIndent = this.getLineIndent(line, format, layoutRectangle, (lineIndex === 0));\n hShift += (!this.rightToLeft(format)) ? lineIndent : 0;\n var x = layoutRectangle.x + hShift;\n /* tslint:disable */\n var width = (!this.shouldJustify(line, layoutRectangle.width, format)) ? lineWidth - lineIndent : layoutRectangle.width - lineIndent; /* tslint:enable */\n var height = result.lineHeight;\n bounds = new RectangleF(x, y, width, height);\n }\n else {\n bounds = new RectangleF(0, 0, 0, 0);\n }\n return bounds;\n };\n /**\n * Creates `lay outed rectangle` depending on the text settings.\n * @private\n */\n PdfGraphics.prototype.checkCorrectLayoutRectangle = function (textSize, x, y, format) {\n var layoutedRectangle = new RectangleF(x, y, textSize.width, textSize.width);\n if (format != null) {\n switch (format.alignment) {\n case PdfTextAlignment.Center:\n layoutedRectangle.x -= layoutedRectangle.width / 2;\n break;\n case PdfTextAlignment.Right:\n layoutedRectangle.x -= layoutedRectangle.width;\n break;\n }\n switch (format.lineAlignment) {\n case PdfVerticalAlignment.Middle:\n layoutedRectangle.y -= layoutedRectangle.height / 2;\n break;\n case PdfVerticalAlignment.Bottom:\n layoutedRectangle.y -= layoutedRectangle.height;\n break;\n }\n }\n return layoutedRectangle;\n };\n /**\n * Sets the `layer` for the graphics.\n * @private\n */\n PdfGraphics.prototype.setLayer = function (layer) {\n this.pageLayer = layer;\n var page = layer.page;\n if (page != null && typeof page !== 'undefined') {\n page.beginSave = this.pageSave;\n }\n };\n /**\n * Adding page number field before page saving.\n * @private\n */\n /* tslint:disable */\n PdfGraphics.prototype.pageSave = function (page) {\n if (page.graphics.automaticFields != null) {\n for (var i = 0; i < page.graphics.automaticFields.automaticFields.length; i++) {\n var fieldInfo = page.graphics.automaticFields.automaticFields[i];\n fieldInfo.field.performDraw(page.graphics, fieldInfo.location, fieldInfo.scalingX, fieldInfo.scalingY);\n }\n }\n };\n /**\n * `Draws a layout result`.\n * @private\n */\n PdfGraphics.prototype.drawStringLayoutResult = function (result, font, pen, brush, layoutRectangle, format) {\n if (!result.empty) {\n this.applyStringSettings(font, pen, brush, format, layoutRectangle);\n // Set text scaling\n var textScaling = (format != null) ? format.horizontalScalingFactor : 100.0;\n if (textScaling !== this.previousTextScaling && !this.isEmfTextScaled) {\n this.pdfStreamWriter.setTextScaling(textScaling);\n this.previousTextScaling = textScaling;\n }\n var height = (format == null || format.lineSpacing === 0) ? font.height : format.lineSpacing + font.height;\n var subScript = (format != null && format.subSuperScript === PdfSubSuperScript.SubScript);\n var shift = 0;\n shift = (subScript) ? height - (font.height + font.metrics.getDescent(format)) : (height - font.metrics.getAscent(format));\n this.shift = shift;\n this.pdfStreamWriter.startNextLine(layoutRectangle.x, layoutRectangle.y - shift);\n this.pdfStreamWriter.setLeading(+height);\n var resultHeight = 0;\n var remainingString = '';\n for (var i = 0; i < result.lines.length; i++) {\n resultHeight += result.lineHeight;\n if ((layoutRectangle.y + resultHeight) > this.clientSize.height) {\n this.startCutIndex = i;\n break;\n }\n }\n for (var j = this.startCutIndex; (j < result.lines.length && j >= 0); j++) {\n remainingString += result.lines[j].text;\n }\n var bounds = new RectangleF(layoutRectangle.x, layoutRectangle.y, layoutRectangle.width, layoutRectangle.height);\n this.drawLayoutResult(result, font, format, layoutRectangle);\n this.underlineStrikeoutText(pen, brush, result, font, bounds, format);\n this.isEmfPlus = false;\n this.isUseFontSize = false;\n if (this.startCutIndex !== -1) {\n var page = this.getNextPage();\n page.graphics.drawString(remainingString, font, pen, brush, layoutRectangle.x, 0, layoutRectangle.width, 0, format);\n }\n }\n else {\n throw new Error('ArgumentNullException:result');\n }\n };\n /**\n * Gets the `next page`.\n * @private\n */\n PdfGraphics.prototype.getNextPage = function () {\n var section = this.currentPage.section;\n var nextPage = null;\n var index = section.indexOf(this.currentPage);\n if (index === section.count - 1) {\n nextPage = section.add();\n }\n else {\n nextPage = section.getPages()[index + 1];\n }\n return nextPage;\n };\n PdfGraphics.prototype.setClip = function (rectangle, mode) {\n if (typeof mode === 'undefined') {\n this.setClip(rectangle, PdfFillMode.Winding);\n }\n else {\n this.pdfStreamWriter.appendRectangle(rectangle);\n this.pdfStreamWriter.clipPath((mode === PdfFillMode.Alternate));\n }\n };\n /**\n * Applies all the `text settings`.\n * @private\n */\n PdfGraphics.prototype.applyStringSettings = function (font, pen, brush, format, bounds) {\n var setLineWidth = false;\n var tm = this.getTextRenderingMode(pen, brush, format);\n this.stateControl(pen, brush, font, format);\n this.pdfStreamWriter.beginText();\n if ((tm) !== this.previousTextRenderingMode) {\n this.pdfStreamWriter.setTextRenderingMode(tm);\n this.previousTextRenderingMode = tm;\n }\n // Set character spacing.\n var cs = (format != null) ? format.characterSpacing : 0;\n if (cs !== this.previousCharacterSpacing && !this.isEmfTextScaled) {\n this.pdfStreamWriter.setCharacterSpacing(cs);\n this.previousCharacterSpacing = cs;\n }\n // Set word spacing.\n // NOTE: it works only if the space code is equal to 32 (0x20).\n var ws = (format != null) ? format.wordSpacing : 0;\n if (ws !== this.previousWordSpacing) {\n this.pdfStreamWriter.setWordSpacing(ws);\n this.previousWordSpacing = ws;\n }\n };\n /**\n * Calculates `shift value` if the text is vertically aligned.\n * @private\n */\n PdfGraphics.prototype.getTextVerticalAlignShift = function (textHeight, boundsHeight, format) {\n var shift = 0;\n if (boundsHeight >= 0 && format != null && format.lineAlignment !== PdfVerticalAlignment.Top) {\n switch (format.lineAlignment) {\n case PdfVerticalAlignment.Middle:\n shift = (boundsHeight - textHeight) / 2;\n break;\n case PdfVerticalAlignment.Bottom:\n shift = boundsHeight - textHeight;\n break;\n }\n }\n return shift;\n };\n /* tslint:disable */\n /**\n * `Draws layout result`.\n * @private\n */\n PdfGraphics.prototype.drawLayoutResult = function (result, font, format, layoutRectangle) {\n var vAlignShift = this.getTextVerticalAlignShift(result.actualSize.height, layoutRectangle.height, format);\n if (vAlignShift !== 0) {\n this.pdfStreamWriter.startNextLine(0, vAlignShift);\n }\n var ttfFont = font;\n var unicode = (ttfFont != null && ttfFont.isUnicode);\n var embed = (ttfFont != null && ttfFont.isEmbedFont);\n var lines = result.lines;\n for (var i = 0, len = lines.length; (i < len && i !== this.startCutIndex); i++) {\n var lineInfo = lines[i];\n var line = lineInfo.text;\n var lineWidth = lineInfo.width;\n var hAlignShift = this.getHorizontalAlignShift(lineWidth, layoutRectangle.width, format);\n var lineIndent = this.getLineIndent(lineInfo, format, layoutRectangle, (i === 0));\n hAlignShift += (!this.rightToLeft(format)) ? lineIndent : 0;\n if (hAlignShift !== 0 && !this.isEmfTextScaled) {\n this.pdfStreamWriter.startNextLine(hAlignShift, 0);\n }\n if (unicode) {\n this.drawUnicodeLine(lineInfo, layoutRectangle, font, format);\n }\n else {\n this.drawAsciiLine(lineInfo, layoutRectangle, font, format);\n }\n if (hAlignShift !== 0 && !this.isEmfTextScaled) {\n this.pdfStreamWriter.startNextLine(-hAlignShift, 0);\n }\n if (this.isOverloadWithPosition && lines.length > 1) {\n this.pdfStreamWriter.startNextLine(-(layoutRectangle.x), 0);\n layoutRectangle.x = 0;\n layoutRectangle.width = this.clientSize.width;\n this.isOverloadWithPosition = false;\n this.isPointOverload = true;\n }\n }\n this.getResources.getResources().requireProcedureSet(this.procedureSets.text);\n if (vAlignShift !== 0) {\n this.pdfStreamWriter.startNextLine(0, -(vAlignShift - result.lineHeight));\n }\n this.pdfStreamWriter.endText();\n };\n /**\n * `Draws Ascii line`.\n * @private\n */\n PdfGraphics.prototype.drawAsciiLine = function (lineInfo, layoutRectangle, font, format) {\n this.justifyLine(lineInfo, layoutRectangle.width, format);\n var value = '';\n if (lineInfo.text.indexOf('(') !== -1 || lineInfo.text.indexOf(')') !== -1) {\n for (var i = 0; i < lineInfo.text.length; i++) {\n if (lineInfo.text[i] === '(') {\n value += '\\\\\\(';\n }\n else if (lineInfo.text[i] === ')') {\n value += '\\\\\\)';\n }\n else {\n value += lineInfo.text[i];\n }\n }\n }\n if (value === '') {\n value = lineInfo.text;\n }\n var line = '(' + value + ')';\n this.pdfStreamWriter.showNextLineText(new PdfString(line));\n };\n /**\n * Draws unicode line.\n * @private\n */\n PdfGraphics.prototype.drawUnicodeLine = function (lineInfo, layoutRectangle, font, format) {\n var line = lineInfo.text;\n var lineWidth = lineInfo.width;\n var rtl = (format !== null && format.rightToLeft);\n var useWordSpace = (format !== null && (format.wordSpacing !== 0 || format.alignment === PdfTextAlignment.Justify));\n var ttfFont = font;\n var wordSpacing = this.justifyLine(lineInfo, layoutRectangle.width, format);\n var rtlRender = new RtlRenderer();\n if (rtl || (format !== null && format.textDirection !== PdfTextDirection.None)) {\n var blocks = null;\n var rightAlign = (format !== null && format.alignment === PdfTextAlignment.Right);\n if (format !== null && format.textDirection !== PdfTextDirection.None) {\n /* tslint:disable-next-line:max-line-length */\n blocks = rtlRender.layout(line, ttfFont, (format.textDirection === PdfTextDirection.RightToLeft) ? true : false, useWordSpace, format);\n }\n else {\n blocks = rtlRender.layout(line, ttfFont, rightAlign, useWordSpace, format);\n }\n var words = null;\n if (blocks.length > 1) {\n if (format !== null && format.textDirection !== PdfTextDirection.None) {\n /* tslint:disable-next-line:max-line-length */\n words = rtlRender.splitLayout(line, ttfFont, (format.textDirection === PdfTextDirection.RightToLeft) ? true : false, useWordSpace, format);\n }\n else {\n words = rtlRender.splitLayout(line, ttfFont, rightAlign, useWordSpace, format);\n }\n }\n else {\n words = [line];\n }\n this.drawUnicodeBlocks(blocks, words, ttfFont, format, wordSpacing);\n }\n else {\n if (useWordSpace) {\n var result = this.breakUnicodeLine(line, ttfFont, null);\n var blocks = result.tokens;\n var words = result.words;\n this.drawUnicodeBlocks(blocks, words, ttfFont, format, wordSpacing);\n }\n else {\n var token = this.convertToUnicode(line, ttfFont);\n var value = this.getUnicodeString(token);\n this.streamWriter.showNextLineText(value);\n }\n }\n };\n /**\n * Draws array of unicode tokens.\n */\n /* tslint:disable */\n PdfGraphics.prototype.drawUnicodeBlocks = function (blocks, words, font, format, wordSpacing) {\n /* tslint:enable */\n if (blocks == null) {\n throw new Error('Argument Null Exception : blocks');\n }\n if (words == null) {\n throw new Error('Argument Null Exception : words');\n }\n if (font == null) {\n throw new Error('Argument Null Exception : font');\n }\n this.streamWriter.startNextLine();\n var x = 0;\n var xShift = 0;\n var firstLineIndent = 0;\n var paragraphIndent = 0;\n try {\n if (format !== null) {\n firstLineIndent = format.firstLineIndent;\n paragraphIndent = format.paragraphIndent;\n format.firstLineIndent = 0;\n format.paragraphIndent = 0;\n }\n var spaceWidth = font.getCharWidth(StringTokenizer.whiteSpace, format) + wordSpacing;\n var characterSpacing = (format != null) ? format.characterSpacing : 0;\n var wordSpace = (format !== null && wordSpacing === 0) ? format.wordSpacing : 0;\n spaceWidth += characterSpacing + wordSpace;\n for (var i = 0; i < blocks.length; i++) {\n var token = blocks[i];\n var word = words[i];\n var tokenWidth = 0;\n if (x !== 0) {\n this.streamWriter.startNextLine(x, 0);\n }\n if (word.length > 0) {\n tokenWidth += /*Utils.Round(*/ font.measureString(word, format).width /*)*/;\n tokenWidth += characterSpacing;\n var val = this.getUnicodeString(token);\n this.streamWriter.showText(val);\n }\n if (i !== blocks.length - 1) {\n x = tokenWidth + spaceWidth;\n xShift += x;\n }\n }\n // Rolback current line position.\n if (xShift > 0) {\n this.streamWriter.startNextLine(-xShift, 0);\n }\n }\n finally {\n if (format !== null) {\n format.firstLineIndent = firstLineIndent;\n format.paragraphIndent = paragraphIndent;\n }\n }\n };\n /**\n * Breakes the unicode line to the words and converts symbols to glyphs.\n */\n PdfGraphics.prototype.breakUnicodeLine = function (line, ttfFont, words) {\n if (line === null) {\n throw new Error('Argument Null Exception : line');\n }\n words = line.split(null);\n var tokens = [];\n for (var i = 0; i < words.length; i++) {\n // Reconvert string according to unicode standard.\n var word = words[i];\n var token = this.convertToUnicode(word, ttfFont);\n tokens[i] = token;\n }\n return { tokens: tokens, words: words };\n };\n /**\n * Creates PdfString from the unicode text.\n */\n PdfGraphics.prototype.getUnicodeString = function (token) {\n if (token === null) {\n throw new Error('Argument Null Exception : token');\n }\n var val = new PdfString(token);\n val.converted = true;\n val.encode = InternalEnum.ForceEncoding.Ascii;\n return val;\n };\n /**\n * Converts to unicode format.\n */\n PdfGraphics.prototype.convertToUnicode = function (text, ttfFont) {\n var token = null;\n if (text == null) {\n throw new Error('Argument Null Exception : text');\n }\n if (ttfFont == null) {\n throw new Error('Argument Null Exception : ttfFont');\n }\n if (ttfFont.fontInternal instanceof UnicodeTrueTypeFont) {\n var ttfReader = ttfFont.fontInternal.ttfReader;\n ttfFont.setSymbols(text);\n token = ttfReader.convertString(text);\n var bytes = PdfString.toUnicodeArray(token, false);\n token = PdfString.byteToString(bytes);\n }\n return token;\n };\n /**\n * `Justifies` the line if needed.\n * @private\n */\n PdfGraphics.prototype.justifyLine = function (lineInfo, boundsWidth, format) {\n var line = lineInfo.text;\n var lineWidth = lineInfo.width;\n var shouldJustify = this.shouldJustify(lineInfo, boundsWidth, format);\n var hasWordSpacing = (format != null && format.wordSpacing !== 0);\n var symbols = StringTokenizer.spaces;\n var whitespacesCount = StringTokenizer.getCharsCount(line, symbols);\n var wordSpace = 0;\n if (shouldJustify) {\n // Correct line width.\n if (hasWordSpacing) {\n lineWidth -= (whitespacesCount * format.wordSpacing);\n }\n var difference = boundsWidth - lineWidth;\n wordSpace = difference / whitespacesCount;\n this.pdfStreamWriter.setWordSpacing(wordSpace);\n }\n else {\n // If there is justifying, but the line shouldn't be justified, restore default word spacing.\n if (hasWordSpacing) {\n this.pdfStreamWriter.setWordSpacing(format.wordSpacing);\n }\n else {\n this.pdfStreamWriter.setWordSpacing(0);\n }\n }\n return wordSpace;\n };\n /**\n * `Reset` or reinitialize the current graphic value.\n * @private\n */\n PdfGraphics.prototype.reset = function (size) {\n this.canvasSize = size;\n this.streamWriter.clear();\n this.initialize();\n this.initializeCoordinates();\n };\n /**\n * Checks whether the line should be `justified`.\n * @private\n */\n PdfGraphics.prototype.shouldJustify = function (lineInfo, boundsWidth, format) {\n var line = lineInfo.text;\n var lineWidth = lineInfo.width;\n var justifyStyle = (format != null && format.alignment === PdfTextAlignment.Justify);\n var goodWidth = (boundsWidth >= 0 && lineWidth < boundsWidth);\n var symbols = StringTokenizer.spaces;\n var whitespacesCount = StringTokenizer.getCharsCount(line, symbols);\n var hasSpaces = (whitespacesCount > 0 && line[0] !== StringTokenizer.whiteSpace);\n var goodLineBreakStyle = ((lineInfo.lineType & LineType.LayoutBreak) > 0);\n /* tslint:disable */\n var shouldJustify = (justifyStyle && goodWidth && hasSpaces && (goodLineBreakStyle || format.alignment === PdfTextAlignment.Justify)); /* tslint:enable */\n return shouldJustify;\n };\n /* tslint:disable */\n /**\n * Emulates `Underline, Strikeout` of the text if needed.\n * @private\n */\n PdfGraphics.prototype.underlineStrikeoutText = function (pen, brush, result, font, layoutRectangle, format) {\n if (font.underline || font.strikeout) {\n // Calculate line width.\n var linePen = this.createUnderlineStikeoutPen(pen, brush, font, format);\n if (linePen != null) {\n // Approximate line positions.\n var vShift = this.getTextVerticalAlignShift(result.actualSize.height, layoutRectangle.height, format);\n var underlineYOffset = 0;\n underlineYOffset = layoutRectangle.y + vShift + font.metrics.getAscent(format) + 1.5 * linePen.width;\n var strikeoutYOffset = layoutRectangle.y + vShift + font.metrics.getHeight(format) / 2 + 1.5 * linePen.width;\n var lines = result.lines;\n // Run through the text and draw lines.\n for (var i = 0, len = result.lineCount; i < len; i++) {\n var lineInfo = lines[i];\n var line = lineInfo.text;\n var lineWidth = lineInfo.width;\n var hShift = this.getHorizontalAlignShift(lineWidth, layoutRectangle.width, format);\n var lineIndent = this.getLineIndent(lineInfo, format, layoutRectangle, (i === 0));\n hShift += (!this.rightToLeft(format)) ? lineIndent : 0;\n var x1 = layoutRectangle.x + hShift;\n /* tslint:disable */\n var x2 = (!this.shouldJustify(lineInfo, layoutRectangle.width, format)) ? x1 + lineWidth - lineIndent : x1 + layoutRectangle.width - lineIndent;\n /* tslint:enable */\n if (font.underline) {\n var y = underlineYOffset;\n this.drawLine(linePen, x1, y, x2, y);\n underlineYOffset += result.lineHeight;\n }\n if (font.strikeout) {\n var y = strikeoutYOffset;\n this.drawLine(linePen, x1, y, x2, y);\n strikeoutYOffset += result.lineHeight;\n }\n if (this.isPointOverload && lines.length > 1) {\n layoutRectangle.x = 0;\n layoutRectangle.width = this.clientSize.width;\n }\n }\n this.isPointOverload = false;\n }\n }\n };\n /**\n * `Creates a pen` for drawing lines in the text.\n * @private\n */\n PdfGraphics.prototype.createUnderlineStikeoutPen = function (pen, brush, font, format) {\n // Calculate line width.\n var lineWidth = font.metrics.getSize(format) / 20;\n var linePen = null;\n // Create a pen fo the lines.\n if (pen != null) {\n linePen = new PdfPen(pen.color, lineWidth);\n }\n else if (brush != null) {\n linePen = new PdfPen(brush, lineWidth);\n }\n return linePen;\n };\n /**\n * Return `text rendering mode`.\n * @private\n */\n PdfGraphics.prototype.getTextRenderingMode = function (pen, brush, format) {\n var tm = TextRenderingMode.None;\n if (pen != null && brush != null) {\n tm = TextRenderingMode.FillStroke;\n }\n else if (pen != null) {\n tm = TextRenderingMode.Stroke;\n }\n else {\n tm = TextRenderingMode.Fill;\n }\n if (format != null && format.clipPath) {\n tm |= TextRenderingMode.ClipFlag;\n }\n return tm;\n };\n /**\n * Returns `line indent` for the line.\n * @private\n */\n PdfGraphics.prototype.getLineIndent = function (lineInfo, format, layoutBounds, firstLine) {\n var lineIndent = 0;\n var firstParagraphLine = ((lineInfo.lineType & LineType.FirstParagraphLine) > 0);\n if (format != null && firstParagraphLine) {\n lineIndent = (firstLine) ? format.firstLineIndent : format.paragraphIndent;\n lineIndent = (layoutBounds.width > 0) ? Math.min(layoutBounds.width, lineIndent) : lineIndent;\n }\n return lineIndent;\n };\n /**\n * Calculates shift value if the line is `horizontaly aligned`.\n * @private\n */\n PdfGraphics.prototype.getHorizontalAlignShift = function (lineWidth, boundsWidth, format) {\n var shift = 0;\n if (boundsWidth >= 0 && format != null && format.alignment !== PdfTextAlignment.Left) {\n switch (format.alignment) {\n case PdfTextAlignment.Center:\n shift = (boundsWidth - lineWidth) / 2;\n break;\n case PdfTextAlignment.Right:\n shift = boundsWidth - lineWidth;\n break;\n }\n }\n return shift;\n };\n /**\n * Gets or sets the value that indicates `text direction` mode.\n * @private\n */\n PdfGraphics.prototype.rightToLeft = function (format) {\n var rtl = (format != null && format.rightToLeft);\n if (format !== null && typeof format !== 'undefined') {\n if (format.textDirection !== PdfTextDirection.None && typeof format.textDirection !== 'undefined') {\n rtl = true;\n }\n }\n return rtl;\n };\n PdfGraphics.prototype.stateControl = function (pen, brush, font, format) {\n if (typeof format === 'undefined') {\n this.stateControl(pen, brush, font, null);\n }\n else {\n var saveState = false;\n if (brush !== null) {\n var solidBrush = brush;\n if (typeof this.pageLayer !== 'undefined' && this.pageLayer != null) {\n if (this.colorSpaceChanged === false) {\n this.lastDocumentCS = this.pageLayer.page.document.colorSpace;\n this.lastGraphicsCS = this.pageLayer.page.graphics.colorSpace;\n this.colorSpace = this.pageLayer.page.document.colorSpace;\n this.currentColorSpace = this.pageLayer.page.document.colorSpace;\n this.colorSpaceChanged = true;\n }\n }\n this.initCurrentColorSpace(this.currentColorSpace);\n }\n else if (pen != null) {\n var pdfPen = pen;\n if (typeof this.pageLayer !== 'undefined' && this.pageLayer != null) {\n /* tslint:disable */\n this.colorSpace = this.pageLayer.page.document.colorSpace;\n this.currentColorSpace = this.pageLayer.page.document.colorSpace;\n }\n this.initCurrentColorSpace(this.currentColorSpace);\n }\n this.penControl(pen, saveState);\n this.brushControl(brush, saveState);\n this.fontControl(font, format, saveState);\n }\n };\n /**\n * Initializes the `current color space`.\n * @private\n */\n PdfGraphics.prototype.initCurrentColorSpace = function (colorspace) {\n var re = this.getResources.getResources();\n if (!this.bCSInitialized) {\n this.pdfStreamWriter.setColorSpace('Device' + this.currentColorSpaces[this.currentColorSpace], true);\n this.pdfStreamWriter.setColorSpace('Device' + this.currentColorSpaces[this.currentColorSpace], false);\n this.bCSInitialized = true;\n }\n };\n /**\n * Controls the `pen state`.\n * @private\n */\n PdfGraphics.prototype.penControl = function (pen, saveState) {\n if (pen != null) {\n this.currentPen = pen;\n this.colorSpace = PdfColorSpace.Rgb;\n /* tslint:disable */\n pen.monitorChanges(this.currentPen, this.pdfStreamWriter, this.getResources, saveState, this.colorSpace, this.matrix.clone());\n /* tslint:enable */\n this.currentPen = pen.clone();\n }\n };\n /**\n * Controls the `brush state`.\n * @private\n */\n PdfGraphics.prototype.brushControl = function (brush, saveState) {\n if (brush != null) {\n this.currentBrush = brush;\n /* tslint:disable */\n brush.monitorChanges(this.currentBrush, this.pdfStreamWriter, this.getResources, saveState, this.colorSpace);\n /* tslint:enable */\n this.currentBrush = brush;\n brush = null;\n }\n };\n /**\n * Saves the font and other `font settings`.\n * @private\n */\n PdfGraphics.prototype.fontControl = function (font, format, saveState) {\n if (font != null) {\n var curSubSuper = (format != null) ? format.subSuperScript : PdfSubSuperScript.None;\n /* tslint:disable */\n var prevSubSuper = (this.currentStringFormat != null) ? this.currentStringFormat.subSuperScript : PdfSubSuperScript.None; /* tslint:enable */\n if (saveState || font !== this.currentFont || curSubSuper !== prevSubSuper) {\n var resources = this.getResources.getResources();\n this.currentFont = font;\n this.currentStringFormat = format;\n var size = font.metrics.getSize(format);\n /* tslint:disable */\n this.isEmfTextScaled = false;\n var fontName = resources.getName(font);\n this.pdfStreamWriter.setFont(font, fontName, size);\n }\n }\n };\n PdfGraphics.prototype.setTransparency = function (arg1, arg2, arg3) {\n if (typeof arg2 === 'undefined') {\n this.istransparencySet = true;\n this.setTransparency(arg1, arg1, PdfBlendMode.Normal);\n }\n else if (typeof arg2 === 'number' && typeof arg3 === 'undefined') {\n this.setTransparency(arg1, arg2, PdfBlendMode.Normal);\n }\n else {\n if (this.trasparencies == null) {\n this.trasparencies = new TemporaryDictionary();\n }\n var transp = null;\n var td = new TransparencyData(arg1, arg2, arg3);\n if (this.trasparencies.containsKey(td)) {\n transp = this.trasparencies.getValue(td);\n }\n if (transp == null) {\n transp = new PdfTransparency(arg1, arg2, arg3);\n this.trasparencies.setValue(td, transp);\n }\n var resources = this.getResources.getResources();\n var name_3 = resources.getName(transp);\n var sw = this.streamWriter;\n sw.setGraphicsState(name_3);\n }\n };\n PdfGraphics.prototype.clipTranslateMargins = function (x, y, left, top, right, bottom) {\n if (x instanceof RectangleF && typeof y === 'undefined') {\n this.clipBounds = x;\n this.pdfStreamWriter.writeComment('Clip margins.');\n this.pdfStreamWriter.appendRectangle(x);\n this.pdfStreamWriter.closePath();\n this.pdfStreamWriter.clipPath(false);\n this.pdfStreamWriter.writeComment('Translate co-ordinate system.');\n this.translateTransform(x.x, x.y);\n }\n else if (typeof x === 'number') {\n var clipArea = new RectangleF(left, top, this.size.width - left - right, this.size.height - top - bottom);\n this.clipBounds = clipArea;\n this.pdfStreamWriter.writeComment(\"Clip margins.\");\n this.pdfStreamWriter.appendRectangle(clipArea);\n this.pdfStreamWriter.closePath();\n this.pdfStreamWriter.clipPath(false);\n this.pdfStreamWriter.writeComment(\"Translate co-ordinate system.\");\n this.translateTransform(x, y);\n }\n };\n /**\n * `Updates y` co-ordinate.\n * @private\n */\n PdfGraphics.prototype.updateY = function (y) {\n return -y;\n };\n /**\n * Used to `translate the transformation`.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // create a new page\n * let page1 : PdfPage = document.pages.add();\n * // set pen\n * let pen : PdfPen = new PdfPen(new PdfColor(0, 0, 0));\n * //\n * // set translate transform\n * page1.graphics.translateTransform(100, 100);\n * //\n * // draw the rectangle after applying translate transform\n * page1.graphics.drawRectangle(pen, new RectangleF({x : 0, y : 0}, {width : 100, height : 50}));\n * // save the document.\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n * @param offsetX The x-coordinate of the translation.\n * @param offsetY The y-coordinate of the translation.\n */\n PdfGraphics.prototype.translateTransform = function (offsetX, offsetY) {\n var matrix = new PdfTransformationMatrix();\n this.getTranslateTransform(offsetX, offsetY, matrix);\n this.pdfStreamWriter.modifyCtm(matrix);\n this.matrix.multiply(matrix);\n };\n /**\n * `Translates` coordinates of the input matrix.\n * @private\n */\n PdfGraphics.prototype.getTranslateTransform = function (x, y, input) {\n input.translate(x, this.updateY(y));\n return input;\n };\n /* tslint:disable */\n /**\n * Applies the specified `scaling operation` to the transformation matrix of this Graphics by prepending it to the object's transformation matrix.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // create a new page\n * let page1 : PdfPage = document.pages.add();\n * // create pen\n * let pen : PdfPen = new PdfPen(new PdfColor(0, 0, 0));\n * //\n * // apply scaling trasformation\n * page1.graphics.scaleTransform(1.5, 2);\n * //\n * // draw the rectangle after applying scaling transform\n * page1.graphics.drawRectangle(pen, new RectangleF({x : 100, y : 100}, {width : 100, height : 50}));\n * // save the document.\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n * @param scaleX Scale factor in the x direction.\n * @param scaleY Scale factor in the y direction.\n */\n /* tslint:enable */\n PdfGraphics.prototype.scaleTransform = function (scaleX, scaleY) {\n var matrix = new PdfTransformationMatrix();\n this.getScaleTransform(scaleX, scaleY, matrix);\n this.pdfStreamWriter.modifyCtm(matrix);\n this.matrix.multiply(matrix);\n };\n /**\n * `Scales` coordinates of the input matrix.\n * @private\n */\n PdfGraphics.prototype.getScaleTransform = function (x, y, input) {\n if (input == null) {\n input = new PdfTransformationMatrix();\n }\n input.scale(x, y);\n return input;\n };\n /**\n * Applies the specified `rotation` to the transformation matrix of this Graphics.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // create a new page\n * let page1 : PdfPage = document.pages.add();\n * // create pen\n * let pen : PdfPen = new PdfPen(new PdfColor(0, 0, 0));\n * //\n * // set RotateTransform with 25 degree of angle\n * page1.graphics.rotateTransform(25);\n * //\n * // draw the rectangle after RotateTransformation\n * page1.graphics.drawRectangle(pen, new RectangleF({x : 100, y : 100}, {width : 100, height : 50}));\n * // save the document.\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n * @param angle Angle of rotation in degrees.\n */\n PdfGraphics.prototype.rotateTransform = function (angle) {\n var matrix = new PdfTransformationMatrix();\n this.getRotateTransform(angle, matrix);\n this.pdfStreamWriter.modifyCtm(matrix);\n this.matrix.multiply(matrix);\n };\n /**\n * `Initializes coordinate system`.\n * @private\n */\n PdfGraphics.prototype.initializeCoordinates = function () {\n // Matrix equation: TM(T-1)=M', where T=[1 0 0 -1 0 h]\n this.pdfStreamWriter.writeComment('Change co-ordinate system to left/top.');\n // Translate co-ordinates only, don't flip.\n if (this.mediaBoxUpperRightBound !== -(this.size.height)) {\n if (this.cropBox == null) {\n if (this.mediaBoxUpperRightBound === this.size.height || this.mediaBoxUpperRightBound === 0) {\n this.translateTransform(0, this.updateY(this.size.height));\n }\n else {\n this.translateTransform(0, this.updateY(this.mediaBoxUpperRightBound));\n }\n }\n }\n };\n /**\n * `Rotates` coordinates of the input matrix.\n * @private\n */\n PdfGraphics.prototype.getRotateTransform = function (angle, input) {\n if (input == null || typeof input === 'undefined') {\n input = new PdfTransformationMatrix();\n }\n input.rotate(this.updateY(angle));\n return input;\n };\n /**\n * `Saves` the current state of this Graphics and identifies the saved state with a GraphicsState.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // create a new page\n * let page1 : PdfPage = document.pages.add();\n * // create pen\n * let pen : PdfPen = new PdfPen(new PdfColor(0, 0, 0));\n * //\n * // save the graphics state\n * let state1 : PdfGraphicsState = page1.graphics.save();\n * //\n * page1.graphics.scaleTransform(1.5, 2);\n * // draw the rectangle\n * page1.graphics.drawRectangle(pen, new RectangleF({x : 100, y : 100}, {width : 100, height : 50}));\n * // restore the graphics state\n * page1.graphics.restore(state1);\n * // save the document.\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n PdfGraphics.prototype.save = function () {\n var state = new PdfGraphicsState(this, this.matrix.clone());\n state.brush = this.currentBrush;\n state.pen = this.currentPen;\n state.font = this.currentFont;\n state.colorSpace = this.currentColorSpace;\n state.characterSpacing = this.previousCharacterSpacing;\n state.wordSpacing = this.previousWordSpacing;\n state.textScaling = this.previousTextScaling;\n state.textRenderingMode = this.previousTextRenderingMode;\n this.graphicsState.push(state);\n this.pdfStreamWriter.saveGraphicsState();\n return state;\n };\n PdfGraphics.prototype.restore = function (state) {\n if (typeof state === 'undefined') {\n if (this.graphicsState.length > 0) {\n this.doRestoreState();\n }\n }\n else {\n if (this.graphicsState.indexOf(state) !== -1) {\n for (;;) {\n if (this.graphicsState.length === 0) {\n break;\n }\n var popState = this.doRestoreState();\n if (popState === state) {\n break;\n }\n }\n }\n }\n };\n /**\n * `Restores graphics state`.\n * @private\n */\n PdfGraphics.prototype.doRestoreState = function () {\n var state = this.graphicsState.pop();\n this.transformationMatrix = state.matrix;\n this.currentBrush = state.brush;\n this.currentPen = state.pen;\n this.currentFont = state.font;\n this.currentColorSpace = state.colorSpace;\n this.previousCharacterSpacing = state.characterSpacing;\n this.previousWordSpacing = state.wordSpacing;\n this.previousTextScaling = state.textScaling;\n this.previousTextRenderingMode = state.textRenderingMode;\n this.pdfStreamWriter.restoreGraphicsState();\n return state;\n };\n // Constants\n /**\n * Specifies the mask of `path type values`.\n * @private\n */\n PdfGraphics.pathTypesValuesMask = 0xf;\n /**\n * Checks whether the object is `transparencyObject`.\n * @hidden\n * @private\n */\n PdfGraphics.transparencyObject = false;\n return PdfGraphics;\n}());\nexport { PdfGraphics };\n/**\n * `GetResourceEventHandler` class is alternate for event handlers and delegates.\n * @private\n * @hidden\n */\nvar GetResourceEventHandler = /** @class */ (function () {\n /**\n * Initialize instance of `GetResourceEventHandler` class.\n * Alternate for event handlers and delegates.\n * @private\n */\n function GetResourceEventHandler(sender) {\n this.sender = sender;\n }\n /**\n * Return the instance of `PdfResources` class.\n * @private\n */\n GetResourceEventHandler.prototype.getResources = function () {\n return this.sender.getResources();\n };\n return GetResourceEventHandler;\n}());\nexport { GetResourceEventHandler };\nvar PdfGraphicsState = /** @class */ (function () {\n function PdfGraphicsState(graphics, matrix) {\n /**\n * Stores `previous rendering mode`.\n * @default TextRenderingMode.Fill\n * @private\n */\n this.internalTextRenderingMode = TextRenderingMode.Fill;\n /**\n * `Previous character spacing` value or 0.\n * @default 0.0\n * @private\n */\n this.internalCharacterSpacing = 0.0;\n /**\n * `Previous word spacing` value or 0.\n * @default 0.0\n * @private\n */\n this.internalWordSpacing = 0.0;\n /**\n * The previously used `text scaling value`.\n * @default 100.0\n * @private\n */\n this.internalTextScaling = 100.0;\n /**\n * `Current color space`.\n * @default PdfColorSpace.Rgb\n * @private\n */\n this.pdfColorSpace = PdfColorSpace.Rgb;\n if (typeof graphics !== 'undefined') {\n this.pdfGraphics = graphics;\n this.transformationMatrix = matrix;\n }\n }\n Object.defineProperty(PdfGraphicsState.prototype, \"graphics\", {\n // Properties\n /**\n * Gets the parent `graphics object`.\n * @private\n */\n get: function () {\n return this.pdfGraphics;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphicsState.prototype, \"matrix\", {\n /**\n * Gets the `current matrix`.\n * @private\n */\n get: function () {\n return this.transformationMatrix;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphicsState.prototype, \"characterSpacing\", {\n /**\n * Gets or sets the `current character spacing`.\n * @private\n */\n get: function () {\n return this.internalCharacterSpacing;\n },\n set: function (value) {\n this.internalCharacterSpacing = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphicsState.prototype, \"wordSpacing\", {\n /**\n * Gets or sets the `word spacing` value.\n * @private\n */\n get: function () {\n return this.internalWordSpacing;\n },\n set: function (value) {\n this.internalWordSpacing = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphicsState.prototype, \"textScaling\", {\n /**\n * Gets or sets the `text scaling` value.\n * @private\n */\n get: function () {\n return this.internalTextScaling;\n },\n set: function (value) {\n this.internalTextScaling = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphicsState.prototype, \"pen\", {\n /**\n * Gets or sets the `current pen` object.\n * @private\n */\n get: function () {\n return this.pdfPen;\n },\n set: function (value) {\n this.pdfPen = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphicsState.prototype, \"brush\", {\n /**\n * Gets or sets the `brush`.\n * @private\n */\n get: function () {\n return this.pdfBrush;\n },\n set: function (value) {\n this.pdfBrush = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphicsState.prototype, \"font\", {\n /**\n * Gets or sets the `current font` object.\n * @private\n */\n get: function () {\n return this.pdfFont;\n },\n set: function (value) {\n this.pdfFont = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphicsState.prototype, \"colorSpace\", {\n /**\n * Gets or sets the `current color space` value.\n * @private\n */\n get: function () {\n return this.pdfColorSpace;\n },\n set: function (value) {\n this.pdfColorSpace = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGraphicsState.prototype, \"textRenderingMode\", {\n /**\n * Gets or sets the `text rendering mode`.\n * @private\n */\n get: function () {\n return this.internalTextRenderingMode;\n },\n set: function (value) {\n this.internalTextRenderingMode = value;\n },\n enumerable: true,\n configurable: true\n });\n return PdfGraphicsState;\n}());\nexport { PdfGraphicsState };\nvar TransparencyData = /** @class */ (function () {\n // Constructors\n /**\n * Initializes a new instance of the `TransparencyData` class.\n * @private\n */\n function TransparencyData(alphaPen, alphaBrush, blendMode) {\n this.alphaPen = alphaPen;\n this.alphaBrush = alphaBrush;\n this.blendMode = blendMode;\n }\n return TransparencyData;\n}());\n","import { PdfStream } from './../primitives/pdf-stream';\nimport { PdfGraphics, GetResourceEventHandler } from './../graphics/pdf-graphics';\nimport { PdfPageLayerCollection } from './pdf-page-layer-collection';\nimport { DictionaryProperties } from './../input-output/pdf-dictionary-properties';\nimport { PdfColorSpace } from './../graphics/enum';\n/**\n * The `PdfPageLayer` used to create layers in PDF document.\n * @private\n */\nvar PdfPageLayer = /** @class */ (function () {\n function PdfPageLayer(page, streamClipPageTemplates) {\n // private bSaved : boolean;\n /**\n * Local Variable to store the `color space` of the document.\n * @private\n */\n this.pdfColorSpace = PdfColorSpace.Rgb;\n /**\n * Local Variable to set `visibility`.\n * @default true\n * @private\n */\n this.isVisible = true;\n /**\n * Indicates if `Sublayer` is present.\n * @default false\n * @private\n */\n this.sublayer = false;\n /**\n * Local variable to store `length` of the graphics.\n * @default 0\n * @private\n */\n this.contentLength = 0;\n /**\n * Instance for `PdfDictionaryProperties` Class.\n * @private\n */\n this.dictionaryProperties = new DictionaryProperties();\n if (typeof streamClipPageTemplates === 'undefined') {\n this.pdfPage = page;\n this.clipPageTemplates = true;\n this.content = new PdfStream();\n }\n else if (streamClipPageTemplates instanceof PdfStream || streamClipPageTemplates === null) {\n if (page == null) {\n throw new Error('ArgumentNullException:page');\n }\n if (streamClipPageTemplates == null) {\n throw new Error('ArgumentNullException:stream');\n }\n this.pdfPage = page;\n this.content = streamClipPageTemplates;\n }\n else {\n this.constructor(page);\n this.clipPageTemplates = streamClipPageTemplates;\n }\n }\n Object.defineProperty(PdfPageLayer.prototype, \"colorSpace\", {\n // Properties\n /**\n * Get or set the `color space`.\n * @private\n */\n get: function () {\n return this.pdfColorSpace;\n },\n set: function (value) {\n this.pdfColorSpace = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageLayer.prototype, \"page\", {\n /**\n * Gets parent `page` of the layer.\n * @private\n */\n get: function () {\n return this.pdfPage;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageLayer.prototype, \"layerId\", {\n /**\n * Gets and Sets the `id of the layer`.\n * @private\n */\n get: function () {\n return this.layerid;\n },\n set: function (value) {\n this.layerid = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageLayer.prototype, \"name\", {\n /**\n * Gets or sets the `name` of the layer.\n * @private\n */\n get: function () {\n return this.layerName;\n },\n set: function (value) {\n this.layerName = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageLayer.prototype, \"visible\", {\n /**\n * Gets or sets the `visibility` of the layer.\n * @private\n */\n get: function () {\n return this.isVisible;\n },\n set: function (value) {\n this.isVisible = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageLayer.prototype, \"graphics\", {\n /**\n * Gets `Graphics` context of the layer, used to draw various graphical content on layer.\n * @private\n */\n get: function () {\n if ((this.pdfGraphics == null)) {\n this.initializeGraphics(this.page);\n }\n return this.pdfGraphics;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageLayer.prototype, \"layers\", {\n /**\n * Gets the collection of `PdfPageLayer`, this collection handle by the class 'PdfPageLayerCollection'.\n * @private\n */\n get: function () {\n if (this.layer == null) {\n this.layer = new PdfPageLayerCollection(this.page);\n this.layer.sublayer = true;\n return this.layer;\n }\n else {\n return this.layer;\n }\n },\n enumerable: true,\n configurable: true\n });\n // Implementation\n /**\n * `Adds` a new PDF Page layer.\n * @private\n */\n PdfPageLayer.prototype.add = function () {\n var layer = new PdfPageLayer(this.pdfPage);\n layer.name = '';\n return layer;\n };\n /**\n * Returns a value indicating the `sign` of a single-precision floating-point number.\n * @private\n */\n PdfPageLayer.prototype.sign = function (number) {\n if (number === 0) {\n return 0;\n }\n else if (number > 0) {\n return 1;\n }\n else {\n return -1;\n }\n };\n /**\n * `Initializes Graphics context` of the layer.\n * @private\n */\n PdfPageLayer.prototype.initializeGraphics = function (page) {\n var oPage = page;\n var gr = new GetResourceEventHandler(this.page);\n var cropBox = null;\n this.pdfGraphics = new PdfGraphics(page.size, gr, this.content);\n this.pdfGraphics.mediaBoxUpperRightBound = 0;\n if (oPage != null) {\n var sc = oPage.section.parent;\n if (sc != null) {\n this.pdfGraphics.colorSpace = sc.document.colorSpace;\n this.colorSpace = sc.document.colorSpace;\n }\n }\n // Transform coordinates to the left/top and activate margins.\n var isSame = (this.sign(page.origin.y) === this.sign(page.origin.x));\n // if (page != null) {\n if (page.origin.x >= 0 && page.origin.y >= 0 || !(isSame)) {\n this.pdfGraphics.initializeCoordinates();\n }\n else {\n // this.m_graphics.InitializeCoordinates(page);\n }\n var clipRect = oPage.section.getActualBounds(oPage, true);\n var margins = oPage.section.pageSettings.margins;\n if (this.clipPageTemplates) {\n if (page.origin.x >= 0 && page.origin.y >= 0) {\n this.pdfGraphics.clipTranslateMargins(clipRect);\n }\n }\n else {\n this.graphics.clipTranslateMargins(clipRect.x, clipRect.y, margins.left, margins.top, margins.right, margins.bottom);\n }\n this.pdfGraphics.setLayer(this);\n // this.bSaved = false;\n };\n Object.defineProperty(PdfPageLayer.prototype, \"element\", {\n // IPdfWrapper Members\n /**\n * Gets the wrapped `element`.\n * @private\n */\n get: function () {\n return this.content;\n },\n enumerable: true,\n configurable: true\n });\n return PdfPageLayer;\n}());\nexport { PdfPageLayer };\n","/**\n * PdfCollection.ts class for EJ2-PDF\n * The class used to handle the collection of PdF objects.\n */\nvar PdfCollection = /** @class */ (function () {\n // Constructors\n /**\n * Initializes a new instance of the `Collection` class.\n * @private\n */\n function PdfCollection() {\n //\n }\n Object.defineProperty(PdfCollection.prototype, \"count\", {\n // Properties\n /**\n * Gets the `Count` of stored objects.\n * @private\n */\n get: function () {\n if (typeof this.collection === 'undefined') {\n this.collection = [];\n }\n return this.collection.length;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfCollection.prototype, \"list\", {\n /**\n * Gets the `list` of stored objects.\n * @private\n */\n get: function () {\n if (typeof this.collection === 'undefined') {\n this.collection = [];\n }\n return this.collection;\n },\n enumerable: true,\n configurable: true\n });\n return PdfCollection;\n}());\nexport { PdfCollection };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * PdfPageLayerCollection.ts class for EJ2-PDF\n */\nimport { PdfPageBase } from './pdf-page-base';\nimport { PdfDictionary } from './../primitives/pdf-dictionary';\nimport { PdfPageLayer } from './pdf-page-layer';\nimport { PdfCollection } from './../general/pdf-collection';\nimport { PdfReferenceHolder } from './../primitives/pdf-reference';\nimport { PdfStream } from './../primitives/pdf-stream';\n/**\n * The class provides methods and properties to handle the collections of `PdfPageLayer`.\n */\nvar PdfPageLayerCollection = /** @class */ (function (_super) {\n __extends(PdfPageLayerCollection, _super);\n function PdfPageLayerCollection(page) {\n var _this = _super.call(this) || this;\n /**\n * Stores the `number of first level layers` in the document.\n * @default 0\n * @private\n */\n _this.parentLayerCount = 0;\n /**\n * Indicates if `Sublayer` is present.\n * @default false\n * @private\n */\n _this.sublayer = false;\n /**\n * Stores the `optional content dictionary`.\n * @private\n */\n _this.optionalContent = new PdfDictionary();\n if (page instanceof PdfPageBase) {\n // if (page == null) {\n // throw new Error('ArgumentNullException:page');\n // }\n _this.page = page;\n var lPage = page;\n // if (lPage != null) {\n _this.parseLayers(lPage);\n // }\n }\n return _this;\n }\n PdfPageLayerCollection.prototype.items = function (index, value) {\n if (typeof index === 'number' && typeof value === 'undefined') {\n var obj = this.list[index];\n return obj;\n }\n else {\n if (value == null) {\n throw new Error('ArgumentNullException: layer');\n }\n if (value.page !== this.page) {\n throw new Error('ArgumentException: The layer belongs to another page');\n }\n // // Add/remove the layer.\n // let layer : PdfPageLayer = this.items(index);\n // if (layer != null) {\n // this.RemoveLayer(layer);\n // }\n // this.List[index] = value;\n // this.InsertLayer(index, value);\n }\n };\n PdfPageLayerCollection.prototype.add = function (firstArgument, secondArgument) {\n if (typeof firstArgument === 'undefined') {\n var layer = new PdfPageLayer(this.page);\n layer.name = '';\n this.add(layer);\n return layer;\n }\n else if (firstArgument instanceof PdfPageLayer) {\n // if (layer == null)\n // throw new ArgumentNullException(\"layer\");\n // if (layer.Page != m_page)\n // throw new ArgumentException(\"The layer belongs to another page\");\n var index = this.list.push(firstArgument);\n // Register layer.\n this.addLayer(index, firstArgument);\n return index;\n }\n else {\n return 0;\n }\n };\n /**\n * Registers `layer` at the page.\n * @private\n */\n PdfPageLayerCollection.prototype.addLayer = function (index, layer) {\n var reference = new PdfReferenceHolder(layer);\n this.page.contents.add(reference);\n };\n // private RemoveLayer(layer : PdfPageLayer) : void {\n // if (layer == null) {\n // throw new Error('ArgumentNullException:layer');\n // }\n // let reference : PdfReferenceHolder = new PdfReferenceHolder(layer);\n // if (this.page != null) {\n // this.page.Contents.Remove(reference);\n // }\n // }\n /**\n * Inserts `PdfPageLayer` into the collection at specified index.\n * @private\n */\n PdfPageLayerCollection.prototype.insert = function (index, layer) {\n // if (index < 0)\n // throw new ArgumentOutOfRangeException(\"index\", \"Value can not be less 0\");\n // if (layer == null)\n // throw new ArgumentNullException(\"layer\");\n // if (layer.Page != m_page)\n // throw new ArgumentException(\"The layer belongs to another page\");\n var list = [];\n var length = this.list.length;\n for (var i = index; i < length; i++) {\n list.push(this.list.pop());\n }\n this.list.push(layer);\n for (var i = 0; i < list.length; i++) {\n this.list.push(list[i]);\n }\n // Register layer.\n this.insertLayer(index, layer);\n };\n /**\n * Registers layer at the page.\n * @private\n */\n PdfPageLayerCollection.prototype.insertLayer = function (index, layer) {\n if (layer == null) {\n throw new Error('ArgumentNullException:layer');\n }\n var reference = new PdfReferenceHolder(layer);\n this.page.contents.insert(index, reference);\n };\n // tslint:disable\n /**\n * `Parses the layers`.\n * @private\n */\n PdfPageLayerCollection.prototype.parseLayers = function (loadedPage) {\n // if (loadedPage == null) {\n // throw new Error('ArgumentNullException:loadedPage');\n // }\n var contents = this.page.contents;\n var resource = this.page.getResources();\n var crossTable = null;\n var ocproperties = null;\n var propertie = null;\n var isLayerAdded = false;\n // if (loadedPage instanceof PdfPage) {\n crossTable = loadedPage.crossTable;\n // } else {\n // crossTable = (loadedPage as PdfLoadedPage).CrossTable;\n // Propertie = PdfCrossTable.Dereference(Resource[DictionaryProperties.Properties]) as PdfDictionary;\n // ocproperties = PdfCrossTable.Dereference((loadedPage as PdfLoadedPage).\n // Document.Catalog[DictionaryProperties.OCProperties]) as PdfDictionary;\n // }\n var saveStream = new PdfStream();\n var restoreStream = new PdfStream();\n var saveState = 'q';\n var newLine = '\\n';\n var restoreState = 'Q';\n // for (let index : number = 0; index < contents.Items.length; index++) {\n // let obj : IPdfPrimitive = contents[index];\n // let stream : PdfStream = crossTable.GetObject(obj) as PdfStream;\n // if (stream == null)\n // throw new PdfDocumentException(\"Invalid contents array.\");\n // // if (stream.Compress)\n // {\n // if (!loadedPage.Imported)\n // stream.Decompress();\n // }\n // byte[] contentId = stream.Data;\n // string str = PdfString.ByteToString(contentId);\n // if (!loadedPage.Imported && (contents.Count == 1) && ((stream.Data[stream.Data.Length - 2] ==\n // RestoreState) || (stream.Data[stream.Data.Length - 1] == RestoreState)))\n // {\n // byte[] content = stream.Data;\n // byte[] data = new byte[content.Length + 4];\n // data[0] = SaveState;\n // data[1] = NewLine;\n // content.CopyTo(data, 2);\n // data[data.Length - 2] = NewLine;\n // data[data.Length - 1] = RestoreState;\n // stream.Data = data;\n // }\n // if (ocproperties != null)\n // {\n // if (Propertie != null)\n // {\n // foreach (KeyValuePair prop in Propertie.Items)\n // {\n // String Key = prop.Key.ToString();\n // PdfReferenceHolder refh = prop.Value as PdfReferenceHolder;\n // PdfDictionary Dict = null;\n // if (refh != null)\n // {\n // Dict = refh.Object as PdfDictionary;\n // }\n // else\n // {\n // Dict = prop.Value as PdfDictionary;\n // }\n // PdfDictionary m_usage = PdfCrossTable.Dereference(Dict[DictionaryProperties.Usage]) as PdfDictionary;\n // if (m_usage != null)\n // {\n // if (str.Contains(Key))\n // {\n // PdfPageLayer layer = new PdfPageLayer(loadedPage, stream);\n // PdfDictionary printoption = PdfCrossTable.Dereference(m_usage[DictionaryProperties.Print])\n // as PdfDictionary;\n // if (printoption != null)\n // {\n // layer.m_printOption = printoption;\n // foreach (KeyValuePair value in printoption.Items)\n // {\n // if (value.Key.Value.Equals(DictionaryProperties.PrintState))\n // {\n // string printState = (value.Value as PdfName).Value;\n // if (printState.Equals(DictionaryProperties.OCGON))\n // {\n // layer.PrintState = PdfPrintState.AlwaysPrint;\n // break;\n // }\n // else\n // {\n // layer.PrintState = PdfPrintState.NeverPrint;\n // break;\n // }\n // }\n // }\n // }\n // PdfString layerName = PdfCrossTable.Dereference(Dict[DictionaryProperties.Name]) as PdfString;\n // layer.Name = layerName.Value;\n // List.add(layer);\n // isLayerAdded = true;\n // if(!str.Contains(\"EMC\"))\n // break;\n // }\n // }\n // else\n // {\n // if (str.Contains(Key))\n // {\n // PdfPageLayer layer = new PdfPageLayer(loadedPage, stream);\n // List.add(layer);\n // if(Dict.ContainsKey(DictionaryProperties.Name))\n // {\n // PdfString layerName = PdfCrossTable.Dereference(Dict[DictionaryProperties.Name]) as PdfString;\n // layer.Name = layerName.Value;\n // }\n // isLayerAdded = true;\n // break;\n // }\n // }\n // }\n // }\n // }\n // if (!isLayerAdded)\n // {\n // PdfPageLayer layer = new PdfPageLayer(loadedPage, stream);\n // List.add(layer);\n // }\n // else\n // isLayerAdded = false;\n // }\n var saveData = [];\n saveData.push(saveState);\n saveStream.data = saveData;\n contents.insert(0, new PdfReferenceHolder(saveStream));\n saveData = [];\n saveData.push(restoreState);\n restoreStream.data = saveData;\n contents.insert(contents.count, new PdfReferenceHolder(restoreStream));\n };\n /**\n * Returns `index of` the `PdfPageLayer` in the collection if exists, -1 otherwise.\n * @private\n */\n PdfPageLayerCollection.prototype.indexOf = function (layer) {\n if (layer == null) {\n throw new Error('ArgumentNullException: layer');\n }\n var index = this.list.indexOf(layer);\n return index;\n };\n return PdfPageLayerCollection;\n}(PdfCollection));\nexport { PdfPageLayerCollection };\n","/**\n * PdfTemplate.ts class for EJ2-PDF\n */\nimport { PdfStream } from './../../primitives/pdf-stream';\nimport { DictionaryProperties } from './../../input-output/pdf-dictionary-properties';\nimport { PdfArray } from './../../primitives/pdf-array';\nimport { PdfGraphics } from './../pdf-graphics';\nimport { PdfResources } from './../pdf-resources';\nimport { PdfName } from './../../primitives/pdf-name';\nimport { PointF, SizeF, RectangleF } from './../../drawing/pdf-drawing';\nimport { GetResourceEventHandler } from './../pdf-graphics';\n/**\n * Represents `Pdf Template` object.\n * @private\n */\nvar PdfTemplate = /** @class */ (function () {\n function PdfTemplate(arg1, arg2) {\n /**\n * Initialize an instance for `DictionaryProperties` class.\n * @private\n * @hidden\n */\n this.dictionaryProperties = new DictionaryProperties();\n /**\n * Checks whether the transformation 'is performed'.\n * @default true\n * @private\n */\n this.writeTransformation = true;\n if (typeof arg1 === 'undefined') {\n //\n }\n else if (arg1 instanceof SizeF && typeof arg2 === 'undefined') {\n this.content = new PdfStream();\n var tempSize = new SizeF(arg1.width, arg1.height);\n this.setSize(tempSize);\n this.initialize();\n }\n else {\n this.content = new PdfStream();\n this.setSize(new SizeF(arg1, arg2));\n this.initialize();\n }\n }\n Object.defineProperty(PdfTemplate.prototype, \"size\", {\n //Properties\n /**\n * Gets the size of the 'PdfTemplate'.\n */\n get: function () {\n return this.templateSize;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfTemplate.prototype, \"width\", {\n /**\n * Gets the width of the 'PdfTemplate'.\n */\n get: function () {\n return this.size.width;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfTemplate.prototype, \"height\", {\n /**\n * Gets the height of the 'PdfTemplate'.\n */\n get: function () {\n return this.size.height;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfTemplate.prototype, \"graphics\", {\n /**\n * Gets the `graphics` of the 'PdfTemplate'.\n */\n get: function () {\n if (this.pdfGraphics == null || typeof this.pdfGraphics === 'undefined') {\n var gr = new GetResourceEventHandler(this);\n var g = new PdfGraphics(this.size, gr, this.content);\n this.pdfGraphics = g;\n // if(this.writeTransformation) {\n // Transform co-ordinates to Top/Left.\n this.pdfGraphics.initializeCoordinates();\n // }\n }\n return this.pdfGraphics;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * Gets the resources and modifies the template dictionary.\n * @private\n */\n PdfTemplate.prototype.getResources = function () {\n if (this.resources == null) {\n this.resources = new PdfResources();\n this.content.items.setValue(this.dictionaryProperties.resources, this.resources);\n }\n return this.resources;\n };\n // Public methods\n /**\n * `Initialize` the type and subtype of the template.\n * @private\n */\n PdfTemplate.prototype.initialize = function () {\n this.addType();\n this.addSubType();\n };\n /**\n * `Adds type key`.\n * @private\n */\n PdfTemplate.prototype.addType = function () {\n var value = new PdfName(this.dictionaryProperties.xObject);\n this.content.items.setValue(this.dictionaryProperties.type, value);\n };\n /**\n * `Adds SubType key`.\n * @private\n */\n PdfTemplate.prototype.addSubType = function () {\n var value = new PdfName(this.dictionaryProperties.form);\n this.content.items.setValue(this.dictionaryProperties.subtype, value);\n };\n PdfTemplate.prototype.reset = function (size) {\n if (typeof size === 'undefined') {\n if (this.resources != null) {\n this.resources = null;\n this.content.remove(this.dictionaryProperties.resources);\n }\n if (this.graphics != null) {\n this.graphics.reset(this.size);\n }\n }\n else {\n this.setSize(size);\n this.reset();\n }\n };\n /**\n * `Set the size` of the 'PdfTemplate'.\n * @private\n */\n PdfTemplate.prototype.setSize = function (size) {\n var rect = new RectangleF(new PointF(0, 0), size);\n var val = PdfArray.fromRectangle(rect);\n this.content.items.setValue(this.dictionaryProperties.bBox, val);\n this.templateSize = size;\n };\n Object.defineProperty(PdfTemplate.prototype, \"element\", {\n // /**\n // * Returns the value of current graphics.\n // * @private\n // */\n // public GetGraphics(g : PdfGraphics) : PdfGraphics {\n // if (this.graphics == null || typeof this.graphics === 'undefined') {\n // this.graphics = g;\n // this.graphics.Size = this.Size;\n // this.graphics.StreamWriter = new PdfStreamWriter(this.content)\n // this.graphics.Initialize();\n // if(this.writeTransformation) {\n // this.graphics.InitializeCoordinates();\n // }\n // }\n // return this.graphics;\n // }\n // IPdfWrapper Members\n /**\n * Gets the `content stream` of 'PdfTemplate' class.\n * @private\n */\n get: function () {\n return this.content;\n },\n enumerable: true,\n configurable: true\n });\n return PdfTemplate;\n}());\nexport { PdfTemplate };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * PdfResources.ts class for EJ2-PDF\n */\nimport { PdfDictionary } from './../primitives/pdf-dictionary';\nimport { TemporaryDictionary } from './../collections/object-object-pair/dictionary';\nimport { PdfName } from './../primitives/pdf-name';\nimport { PdfArray } from './../primitives/pdf-array';\nimport { PdfReferenceHolder } from './../primitives/pdf-reference';\nimport { PdfCrossTable } from './../input-output/pdf-cross-table';\nimport { PdfFont } from './fonts/pdf-font';\nimport { PdfTemplate } from './figures/pdf-template';\nimport { PdfBrush } from './brushes/pdf-brush';\nimport { PdfTransparency } from './pdf-transparency';\nimport { PdfBitmap } from './../graphics/images/pdf-bitmap';\nimport { PdfImage } from './../graphics/images/pdf-image';\n/**\n * `PdfResources` class used to set resource contents like font, image.\n * @private\n */\nvar PdfResources = /** @class */ (function (_super) {\n __extends(PdfResources, _super);\n function PdfResources(baseDictionary) {\n var _this = _super.call(this) || this;\n /**\n * Dictionary for the `properties names`.\n * @private\n */\n _this.properties = new PdfDictionary();\n if (baseDictionary instanceof PdfDictionary) {\n _this = _super.call(this, baseDictionary) || this;\n }\n return _this;\n }\n Object.defineProperty(PdfResources.prototype, \"names\", {\n //Properties\n /**\n * Gets the `font names`.\n * @private\n */\n get: function () {\n return this.getNames();\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfResources.prototype, \"document\", {\n /**\n * Get or set the `page document`.\n * @private\n */\n get: function () {\n return this.pdfDocument;\n },\n set: function (value) {\n this.pdfDocument = value;\n },\n enumerable: true,\n configurable: true\n });\n //Public Methods\n /**\n * `Generates name` for the object and adds to the resource if the object is new.\n * @private\n */\n PdfResources.prototype.getName = function (obj) {\n var primitive = obj.element;\n var name = null;\n if (this.names.containsKey(primitive)) {\n name = this.names.getValue(primitive);\n }\n // Object is new.\n if (name == null) {\n var sName = this.generateName();\n name = new PdfName(sName);\n this.names.setValue(primitive, name);\n if (obj instanceof PdfFont) {\n this.add(obj, name);\n }\n else if (obj instanceof PdfTemplate) {\n this.add(obj, name);\n }\n else if (obj instanceof PdfTransparency) {\n this.add(obj, name);\n }\n else if (obj instanceof PdfImage || obj instanceof PdfBitmap) {\n this.add(obj, name);\n }\n }\n return name;\n };\n /**\n * Gets `resource names` to font dictionaries.\n * @private\n */\n PdfResources.prototype.getNames = function () {\n if (this.pdfNames == null) {\n this.pdfNames = new TemporaryDictionary();\n }\n var fonts = this.items.getValue(this.dictionaryProperties.font);\n if (fonts != null) {\n var reference = fonts;\n var dictionary = fonts;\n dictionary = PdfCrossTable.dereference(fonts);\n }\n return this.pdfNames;\n };\n /**\n * Add `RequireProcedureSet` into procset array.\n * @private\n */\n PdfResources.prototype.requireProcedureSet = function (procedureSetName) {\n if (procedureSetName == null) {\n throw new Error('ArgumentNullException:procedureSetName');\n }\n var procSets = this.items.getValue(this.dictionaryProperties.procset);\n if (procSets == null) {\n procSets = new PdfArray();\n this.items.setValue(this.dictionaryProperties.procset, procSets);\n }\n var name = new PdfName(procedureSetName);\n if (!procSets.contains(name)) {\n procSets.add(name);\n }\n };\n //Helper Methods\n /**\n * `Remove font` from array.\n * @private\n */\n PdfResources.prototype.removeFont = function (name) {\n var key = null;\n var keys = this.pdfNames.keys();\n for (var index = 0; index < this.pdfNames.size(); index++) {\n if (this.pdfNames.getValue(keys[index]) === new PdfName(name)) {\n key = keys[index];\n break;\n }\n }\n if (key != null) {\n this.pdfNames.remove(key);\n }\n };\n /**\n * Generates `Unique string name`.\n * @private\n */\n PdfResources.prototype.generateName = function () {\n var name = Guid.getNewGuidString();\n return name;\n };\n PdfResources.prototype.add = function (arg1, arg2) {\n if (arg1 instanceof PdfFont) {\n var dictionary = null;\n var fonts = this.items.getValue(this.dictionaryProperties.font);\n if (fonts != null) {\n var reference = fonts;\n dictionary = fonts;\n dictionary = fonts;\n }\n else {\n dictionary = new PdfDictionary();\n this.items.setValue(this.dictionaryProperties.font, dictionary);\n }\n dictionary.items.setValue(arg2.value, new PdfReferenceHolder(arg1.element));\n }\n else if (arg1 instanceof PdfTemplate) {\n var xobjects = void 0;\n xobjects = this.items.getValue(this.dictionaryProperties.xObject);\n // Create fonts dictionary.\n if (xobjects == null) {\n xobjects = new PdfDictionary();\n this.items.setValue(this.dictionaryProperties.xObject, xobjects);\n }\n xobjects.items.setValue(arg2.value, new PdfReferenceHolder(arg1.element));\n }\n else if (arg1 instanceof PdfBrush) {\n // let savable : IPdfPrimitive = (arg1 as IPdfWrapper).Element;\n // if (savable != null)\n // {\n // let pattern : PdfDictionary = this.Items.getValue(this.dictionaryProperties.pattern) as PdfDictionary;\n // // Create a new pattern dictionary.\n // if (pattern == null) {\n // pattern = new PdfDictionary();\n // this.Items.setValue(this.dictionaryProperties.pattern, pattern);\n // }\n // pattern.Items.setValue(name, new PdfReferenceHolder(savable));\n // }\n }\n else if (arg1 instanceof PdfTransparency) {\n var savable = arg1.element;\n var transDic = null;\n transDic = this.items.getValue(this.dictionaryProperties.extGState);\n // Create a new pattern dictionary.\n if (transDic == null) {\n transDic = new PdfDictionary();\n this.items.setValue(this.dictionaryProperties.extGState, transDic);\n }\n transDic.items.setValue(arg2.value, new PdfReferenceHolder(savable));\n }\n else {\n /* tslint:disable */\n var xobjects = this.Dictionary.items.getValue(this.dictionaryProperties.xObject);\n var parentXObjects = void 0;\n if (typeof this.pdfDocument !== 'undefined') {\n parentXObjects = this.pdfDocument.sections.element.items.getValue(this.dictionaryProperties.resources).items.getValue(this.dictionaryProperties.xObject);\n }\n var values = this.Dictionary.items.values();\n var hasSameImageStream = false;\n var oldReference = void 0;\n if (typeof this.pdfDocument !== 'undefined' && (typeof parentXObjects === undefined || parentXObjects == null)) {\n parentXObjects = new PdfDictionary();\n this.pdfDocument.sections.element.items.getValue(this.dictionaryProperties.resources).items.setValue(this.dictionaryProperties.xObject, parentXObjects);\n }\n else if (typeof this.pdfDocument !== 'undefined') {\n var values_1 = parentXObjects.items.values();\n for (var i = 0; i < values_1.length; i++) {\n if (typeof values_1[i] !== 'undefined' && typeof values_1[i].element !== 'undefined') {\n if (values_1[i].element.data[0] === arg1.element.data[0]) {\n oldReference = values_1[i];\n hasSameImageStream = true;\n }\n }\n }\n }\n if (xobjects == null) {\n xobjects = new PdfDictionary();\n this.Dictionary.items.setValue(this.dictionaryProperties.xObject, xobjects);\n }\n if (hasSameImageStream && typeof oldReference !== 'undefined') {\n xobjects.items.setValue(arg2.value, oldReference);\n }\n else {\n var reference = new PdfReferenceHolder(arg1.element);\n xobjects.items.setValue(arg2.value, reference);\n if (typeof this.pdfDocument !== 'undefined') {\n parentXObjects.items.setValue(arg2.value, reference);\n }\n }\n /* tslint:enable */\n }\n };\n return PdfResources;\n}(PdfDictionary));\nexport { PdfResources };\n/**\n * Used to create new guid for resources.\n * @private\n */\nvar Guid = /** @class */ (function () {\n /**\n * Initialize an `instance of GUID` class.\n * @private\n */\n function Guid(stringValue) {\n this.stringValue = stringValue || Guid.getNewGuidString();\n }\n Object.defineProperty(Guid, \"randomNumber\", {\n /**\n * Generate `Random number` for GUID.\n * @private\n */\n get: function () {\n Guid.guid = Guid.guid + 1;\n Guid.guid = Guid.guid > 999999999999 ? 0 : Guid.guid;\n return Guid.guid;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * Return the value of `GUID as string`.\n * @private\n */\n Guid.prototype.toString = function () {\n return this.stringValue;\n };\n /**\n * Generate `new GUID`.\n * @private\n */\n Guid.getNewGuidString = function () {\n var guid = 'abc7def4-ghi9-jkl2-m6n3-';\n var temproaryString = 'opqrstuvwxyz';\n var randomString = Guid.randomNumber.toString();\n randomString = guid + temproaryString.substr(0, (12 - randomString.length)) + randomString;\n return randomString;\n };\n /**\n * static field to store `endding value of current GUID`.\n * @private\n */\n Guid.guid = 0;\n return Guid;\n}());\nexport { Guid };\n","import { PdfArray } from './../primitives/pdf-array';\nimport { PdfPageLayerCollection } from './pdf-page-layer-collection';\nimport { DictionaryProperties } from './../input-output/pdf-dictionary-properties';\nimport { PdfResources } from './../graphics/pdf-resources';\n/**\n * The abstract base class for all pages,\n * `PdfPageBase` class provides methods and properties to create PDF pages and its elements.\n * @private\n */\nvar PdfPageBase = /** @class */ (function () {\n //constructors\n /**\n * Initializes a new instance of the `PdfPageBase` class.\n * @private\n */\n function PdfPageBase(dictionary) {\n /**\n * `Index` of the default layer.\n * @default -1.\n * @private\n */\n this.defLayerIndex = -1;\n /**\n * Local variable to store if page `updated`.\n * @default false.\n * @private\n */\n this.modified = false;\n /**\n * Instance of `DictionaryProperties` class.\n * @hidden\n * @private\n */\n this.dictionaryProperties = new DictionaryProperties();\n this.pageDictionary = dictionary;\n }\n Object.defineProperty(PdfPageBase.prototype, \"section\", {\n //Properties\n /**\n * Gets the `section` of a page.\n * @private\n */\n get: function () {\n // if (this.pdfSection === null) {\n // throw new Error('PdfException : Page must be added to some section before using.');\n // }\n return this.pdfSection;\n },\n set: function (value) {\n this.pdfSection = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageBase.prototype, \"dictionary\", {\n /**\n * Gets the page `dictionary`.\n * @private\n */\n get: function () {\n return this.pageDictionary;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageBase.prototype, \"element\", {\n /**\n * Gets the wrapped `element`.\n * @private\n */\n get: function () {\n return this.pageDictionary;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageBase.prototype, \"defaultLayer\", {\n /**\n * Gets the `default layer` of the page (Read only).\n * @private\n */\n get: function () {\n var layer = this.layers;\n var index = this.defaultLayerIndex;\n var returnlayer = layer.items(index);\n return returnlayer;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageBase.prototype, \"defaultLayerIndex\", {\n /**\n * Gets or sets `index of the default layer`.\n * @private\n */\n get: function () {\n if (this.layerCollection.count === 0 || this.defLayerIndex === -1) {\n var layer = this.layerCollection.add();\n this.defLayerIndex = this.layerCollection.indexOf(layer);\n }\n return this.defLayerIndex;\n },\n /**\n * Gets or sets` index of the default layer`.\n * @private\n */\n set: function (value) {\n if (value < 0 || value > this.layers.count - 1) {\n throw new Error('ArgumentOutOfRangeException : value, Index can not be less 0 and greater Layers.Count - 1');\n }\n else {\n this.defLayerIndex = value;\n this.modified = true;\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageBase.prototype, \"layers\", {\n /**\n * Gets the collection of the page's `layers` (Read only).\n * @private\n */\n get: function () {\n if (this.layerCollection == null || typeof this.layerCollection === 'undefined') {\n this.layerCollection = new PdfPageLayerCollection(this);\n }\n return this.layerCollection;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * Return an instance of `PdfResources` class.\n * @private\n */\n PdfPageBase.prototype.getResources = function () {\n if (this.resources == null) {\n this.resources = new PdfResources();\n this.dictionary.items.setValue(this.dictionaryProperties.resources, this.resources);\n }\n return this.resources;\n };\n Object.defineProperty(PdfPageBase.prototype, \"contents\", {\n /**\n * Gets `array of page's content`.\n * @private\n */\n get: function () {\n var obj = this.pageDictionary.items.getValue(this.dictionaryProperties.contents);\n var contents = obj;\n var rh = obj;\n if (contents == null) {\n contents = new PdfArray();\n this.pageDictionary.items.setValue(this.dictionaryProperties.contents, contents);\n }\n return contents;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * Sets the `resources`.\n * @private\n */\n PdfPageBase.prototype.setResources = function (res) {\n this.resources = res;\n this.dictionary.items.setValue(this.dictionaryProperties.resources, this.resources);\n this.modified = true;\n };\n return PdfPageBase;\n}());\nexport { PdfPageBase };\n","import { PdfArray } from './../primitives/pdf-array';\nimport { PdfReferenceHolder } from './../primitives/pdf-reference';\nimport { DictionaryProperties } from './../input-output/pdf-dictionary-properties';\nimport { SizeF, RectangleF, PointF } from './../drawing/pdf-drawing';\nimport { PdfStringLayouter } from './../graphics/fonts/string-layouter';\nimport { PdfColorSpace } from './../graphics/enum';\n/**\n * `PdfAnnotationCollection` class represents the collection of 'PdfAnnotation' objects.\n * @private\n */\nvar PdfAnnotationCollection = /** @class */ (function () {\n function PdfAnnotationCollection(page) {\n // Constants\n /**\n * `Error` constant message.\n * @private\n */\n this.alreadyExistsAnnotationError = 'This annotatation had been already added to page';\n /**\n * `Error` constant message.\n * @private\n */\n this.missingAnnotationException = 'Annotation is not contained in collection.';\n /**\n * Specifies the Internal variable to store fields of `PdfDictionaryProperties`.\n * @private\n */\n this.dictionaryProperties = new DictionaryProperties();\n /**\n * Array of the `annotations`.\n * @private\n */\n this.internalAnnotations = new PdfArray();\n /**\n * privte `list` for the annotations.\n * @private\n */\n this.lists = [];\n if (typeof page !== 'undefined') {\n this.page = page;\n }\n }\n Object.defineProperty(PdfAnnotationCollection.prototype, \"annotations\", {\n /**\n * Gets the `PdfAnnotation` object at the specified index. Read-Only.\n * @private\n */\n get: function () {\n return this.internalAnnotations;\n },\n set: function (value) {\n this.internalAnnotations = value;\n },\n enumerable: true,\n configurable: true\n });\n // Public methods\n /**\n * `Adds` a new annotation to the collection.\n * @private\n */\n PdfAnnotationCollection.prototype.add = function (annotation) {\n // this.SetPrint(annotation);\n this.doAdd(annotation);\n };\n /**\n * `Adds` a Annotation to collection.\n * @private\n */\n /* tslint:disable */\n PdfAnnotationCollection.prototype.doAdd = function (annotation) {\n if (typeof annotation.destination !== 'undefined') {\n var layout = new PdfStringLayouter();\n var layoutResult = layout.layout(annotation.text, annotation.font, annotation.stringFormat, new SizeF((annotation.bounds.width), 0), false, new SizeF(0, 0));\n var lastPosition = annotation.bounds.y;\n if (layoutResult.lines.length === 1) {\n var size = annotation.font.measureString(layoutResult.lines[0].text);\n annotation.bounds = new RectangleF(new PointF(annotation.bounds.x, lastPosition), size);\n annotation.text = layoutResult.lines[0].text;\n //Draw Annotation Text.\n this.page.graphics.drawString(annotation.text, annotation.font, null, annotation.brush, annotation.bounds.x, annotation.bounds.y, annotation.bounds.width, annotation.bounds.height, null);\n //Add annotation to dictionary.\n annotation.setPage(this.page);\n this.setColor(annotation);\n this.internalAnnotations.add(new PdfReferenceHolder(annotation));\n this.lists.push(annotation);\n }\n else {\n for (var i = 0; i < layoutResult.lines.length; i++) {\n var size = annotation.font.measureString(layoutResult.lines[i].text);\n if (i === 0) {\n annotation.bounds = new RectangleF(annotation.bounds.x, lastPosition, size.width, size.height);\n annotation.text = layoutResult.lines[i].text;\n //Draw Annotation Text.\n this.page.graphics.drawString(annotation.text, annotation.font, null, annotation.brush, annotation.bounds.x, lastPosition, size.width, size.height, null);\n //Add annotation to dictionary.\n annotation.setPage(this.page);\n this.setColor(annotation);\n this.internalAnnotations.add(new PdfReferenceHolder(annotation));\n this.lists.push(annotation);\n //Update y for drawing next line of the text.\n lastPosition += annotation.bounds.height;\n }\n else {\n var annot = annotation.clone();\n annot.bounds = new RectangleF(new PointF(annotation.bounds.x, lastPosition), size);\n annot.text = layoutResult.lines[i].text;\n //Draw Annotation Text.\n this.page.graphics.drawString(annot.text, annot.font, null, annot.brush, annot.bounds.x, annot.bounds.y, annot.bounds.width, annot.bounds.height, null);\n //Add annotation to dictionary.\n annot.setPage(this.page);\n this.setColor(annot);\n this.internalAnnotations.add(new PdfReferenceHolder(annot));\n this.lists.push(annot);\n //Update y for drawing next line of the text.\n lastPosition += annot.bounds.height;\n }\n }\n }\n }\n else {\n annotation.setPage(this.page);\n this.internalAnnotations.add(new PdfReferenceHolder(annotation));\n return this.lists.push(annotation);\n }\n };\n /* tslint:enable */\n /**\n * `Set a color of an annotation`.\n * @private\n */\n PdfAnnotationCollection.prototype.setColor = function (annotation) {\n var cs = PdfColorSpace.Rgb;\n var colours = annotation.color.toArray(cs);\n annotation.dictionary.items.setValue(this.dictionaryProperties.c, colours);\n };\n Object.defineProperty(PdfAnnotationCollection.prototype, \"element\", {\n // IPdfWrapper Members\n /**\n * Gets the `Element` representing this object.\n * @private\n */\n get: function () {\n return this.internalAnnotations;\n },\n enumerable: true,\n configurable: true\n });\n return PdfAnnotationCollection;\n}());\nexport { PdfAnnotationCollection };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfPageBase } from './pdf-page-base';\nimport { PdfDictionary, SaveTemplateEventHandler } from './../primitives/pdf-dictionary';\nimport { PdfName } from './../primitives/pdf-name';\nimport { PdfReferenceHolder } from './../primitives/pdf-reference';\nimport { SizeF } from './../drawing/pdf-drawing';\nimport { PdfAnnotationCollection } from './../annotations/annotation-collection';\nimport { PdfPageLayer } from './pdf-page-layer';\n/**\n * Provides methods and properties to create pages and its elements.\n * `PdfPage` class inherited from the `PdfPageBase` class.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * //\n * // add a new page to the document\n * let page1 : PdfPage = document.pages.add();\n * //\n * // set the font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // create black brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, new PointF(0, 0));\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\nvar PdfPage = /** @class */ (function (_super) {\n __extends(PdfPage, _super);\n //constructors\n /**\n * Initialize the new instance for `PdfPage` class.\n * @private\n */\n function PdfPage() {\n var _this = _super.call(this, new PdfDictionary()) || this;\n /**\n * Stores the instance of `PdfAnnotationCollection` class.\n * @hidden\n * @default null\n * @private\n */\n _this.annotationCollection = null;\n /**\n * Stores the instance of `PageBeginSave` event for Page Number Field.\n * @default null\n * @private\n */\n _this.beginSave = null;\n _this.initialize();\n return _this;\n }\n Object.defineProperty(PdfPage.prototype, \"document\", {\n //Properties\n /**\n * Gets current `document`.\n * @private\n */\n get: function () {\n if (this.section !== null && this.section.parent !== null) {\n return this.section.parent.document;\n }\n else {\n return null;\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPage.prototype, \"graphics\", {\n /**\n * Get the current `graphics`.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a new page to the document\n * let page1 : PdfPage = document.pages.add();\n * //\n * // get graphics\n * let graphics : PdfGraphics = page1.graphics;\n * //\n * // set the font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // create black brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * // draw the text\n * graphics.drawString('Hello World', font, blackBrush, new PointF(0, 0));\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n get: function () {\n var result = this.defaultLayer.graphics;\n result.currentPage = this;\n return result;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPage.prototype, \"crossTable\", {\n /**\n * Gets the `cross table`.\n * @private\n */\n get: function () {\n if (this.section === null) {\n throw new Error('PdfDocumentException : Page is not created');\n }\n return this.section.parent === null ? this.section.parentDocument.crossTable : this.section.parent.document.crossTable;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPage.prototype, \"size\", {\n /**\n * Gets the size of the PDF page- Read only.\n * @public\n */\n get: function () {\n return this.section.pageSettings.size;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPage.prototype, \"origin\", {\n /**\n * Gets the `origin` of the page.\n * @private\n */\n get: function () {\n return this.section.pageSettings.origin;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPage.prototype, \"annotations\", {\n /**\n * Gets a collection of the `annotations` of the page- Read only.\n * @private\n */\n get: function () {\n if (this.annotationCollection == null) {\n this.annotationCollection = new PdfAnnotationCollection(this);\n // if (!this.Dictionary.ContainsKey(this.dictionaryProperties.annots)) {\n this.dictionary.items.setValue(this.dictionaryProperties.annots, this.annotationCollection.element);\n // }\n this.annotationCollection.annotations = this.dictionary.items.getValue(this.dictionaryProperties.annots);\n }\n return this.annotationCollection;\n },\n enumerable: true,\n configurable: true\n });\n //Implementation\n /**\n * `Initializes` a page.\n * @private\n */\n PdfPage.prototype.initialize = function () {\n this.dictionary.items.setValue(this.dictionaryProperties.type, new PdfName('Page'));\n this.dictionary.pageBeginDrawTemplate = new SaveTemplateEventHandler(this);\n };\n /**\n * Sets parent `section` to the page.\n * @private\n */\n PdfPage.prototype.setSection = function (section) {\n this.section = section;\n this.dictionary.items.setValue(this.dictionaryProperties.parent, new PdfReferenceHolder(section));\n };\n /**\n * `Resets the progress`.\n * @private\n */\n PdfPage.prototype.resetProgress = function () {\n this.isProgressOn = false;\n };\n /**\n * Get the page size reduced by page margins and page template dimensions.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a pages to the document\n * let page1 : PdfPage = document.pages.add();\n * // create new standard font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // set brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * //\n * // set the specified point using `getClientSize` method\n * let point : PointF = new PointF(page1.getClientSize().width - 200, page1.getClientSize().height - 200);\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, point);\n * //\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n PdfPage.prototype.getClientSize = function () {\n var returnValue = this.section.getActualBounds(this, true);\n return new SizeF(returnValue.width, returnValue.height);\n };\n /**\n * Helper method to retrive the instance of `PageBeginSave` event for header and footer elements.\n * @private\n */\n PdfPage.prototype.pageBeginSave = function () {\n var doc = this.document;\n if (typeof doc !== undefined && doc != null) {\n this.drawPageTemplates(doc);\n }\n if (this.beginSave != null && typeof this.beginSave !== 'undefined') {\n this.beginSave(this);\n }\n };\n /**\n * Helper method to draw template elements.\n * @private\n */\n PdfPage.prototype.drawPageTemplates = function (document) {\n // Draw Background templates.\n var hasBackTemplates = this.section.containsTemplates(document, this, false);\n if (hasBackTemplates) {\n var backLayer = new PdfPageLayer(this, false);\n this.layers.insert(0, backLayer);\n this.section.drawTemplates(this, backLayer, document, false);\n if (backLayer.graphics !== null && typeof backLayer.graphics !== 'undefined') {\n for (var i = 0; i < backLayer.graphics.automaticFields.automaticFields.length; i++) {\n var fieldInfo = backLayer.graphics.automaticFields.automaticFields[i];\n fieldInfo.field.performDraw(backLayer.graphics, fieldInfo.location, fieldInfo.scalingX, fieldInfo.scalingY);\n }\n }\n }\n // Draw Foreground templates.\n var hasFrontTemplates = this.section.containsTemplates(document, this, true);\n if (hasFrontTemplates) {\n var frontLayer = new PdfPageLayer(this, false);\n this.layers.add(frontLayer);\n this.section.drawTemplates(this, frontLayer, document, true);\n }\n };\n return PdfPage;\n}(PdfPageBase));\nexport { PdfPage };\n","/**\n * Provides data for `PageAddedEventHandler` event.\n * This event raises when adding the new PDF page to the PDF document.\n */\nvar PageAddedEventArgs = /** @class */ (function () {\n function PageAddedEventArgs(page) {\n if (typeof page !== 'undefined') {\n this.pdfPage = page;\n }\n else {\n this.pdfPage = null;\n }\n }\n Object.defineProperty(PageAddedEventArgs.prototype, \"page\", {\n /**\n * Gets the `newly added page`.\n * @private\n */\n get: function () {\n return this.pdfPage;\n },\n enumerable: true,\n configurable: true\n });\n return PageAddedEventArgs;\n}());\nexport { PageAddedEventArgs };\n","/**\n * Represents the `collection of pages in a section`.\n * @private\n */\nvar PdfSectionPageCollection = /** @class */ (function () {\n // Constructors\n /**\n * Initializes a new instance of the `PdfSectionPageCollection` class.\n * @private\n */\n function PdfSectionPageCollection(section) {\n // Fields\n /**\n * @hidden\n * @private\n */\n this.pdfSection = null;\n if (section == null) {\n throw Error('ArgumentNullException(\"section\")');\n }\n this.section = section;\n }\n Object.defineProperty(PdfSectionPageCollection.prototype, \"section\", {\n // Properties\n /**\n * Gets the `PdfPage` at the specified index.\n * @private\n */\n get: function () {\n return this.pdfSection;\n },\n set: function (value) {\n this.pdfSection = value;\n },\n enumerable: true,\n configurable: true\n });\n // Public Methods\n /**\n * `Determines` whether the specified page is within the collection.\n * @private\n */\n PdfSectionPageCollection.prototype.contains = function (page) {\n return this.section.contains(page);\n };\n /**\n * `Removes` the specified page from collection.\n * @private\n */\n PdfSectionPageCollection.prototype.remove = function (page) {\n this.section.remove(page);\n };\n /**\n * `Adds` a new page from collection.\n * @private\n */\n PdfSectionPageCollection.prototype.add = function () {\n return this.section.add();\n };\n return PdfSectionPageCollection;\n}());\nexport { PdfSectionPageCollection };\n","import { TemplateType } from './../pages/enum';\n// import { PdfStampCollection } from `./../Pages/PdfStampCollection`;\n/**\n * `PdfDocumentTemplate` class encapsulates a page template for all the pages in the document.\n * @private\n */\nvar PdfDocumentTemplate = /** @class */ (function () {\n // Constructors\n /**\n * Initializes a new instance of the `PdfDocumentTemplate` class.\n * @public\n */\n function PdfDocumentTemplate() {\n //\n }\n Object.defineProperty(PdfDocumentTemplate.prototype, \"left\", {\n // private m_stamps : PdfStampCollection;\n // Properties\n /**\n * `Left` page template object.\n * @public\n */\n get: function () {\n return this.leftTemplate;\n },\n set: function (value) {\n this.leftTemplate = this.checkElement(value, TemplateType.Left);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentTemplate.prototype, \"top\", {\n /**\n * `Top` page template object.\n * @public\n */\n get: function () {\n return this.topTemplate;\n },\n set: function (value) {\n this.topTemplate = this.checkElement(value, TemplateType.Top);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentTemplate.prototype, \"right\", {\n /**\n * `Right` page template object.\n * @public\n */\n get: function () {\n return this.rightTemplate;\n },\n set: function (value) {\n this.rightTemplate = this.checkElement(value, TemplateType.Right);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentTemplate.prototype, \"bottom\", {\n /**\n * `Bottom` page template object.\n * @public\n */\n get: function () {\n return this.bottomTemplate;\n },\n set: function (value) {\n this.bottomTemplate = this.checkElement(value, TemplateType.Bottom);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentTemplate.prototype, \"EvenLeft\", {\n /**\n * `EvenLeft` page template object.\n * @public\n */\n get: function () {\n return this.evenLeft;\n },\n set: function (value) {\n this.evenLeft = this.checkElement(value, TemplateType.Left);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentTemplate.prototype, \"EvenTop\", {\n /**\n * `EvenTop` page template object.\n * @public\n */\n get: function () {\n return this.evenTop;\n },\n set: function (value) {\n this.evenTop = this.checkElement(value, TemplateType.Top);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentTemplate.prototype, \"EvenRight\", {\n /**\n * `EvenRight` page template object.\n * @public\n */\n get: function () {\n return this.evenRight;\n },\n set: function (value) {\n this.evenRight = this.checkElement(value, TemplateType.Right);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentTemplate.prototype, \"EvenBottom\", {\n /**\n * `EvenBottom` page template object.\n * @public\n */\n get: function () {\n return this.evenBottom;\n },\n set: function (value) {\n this.evenBottom = this.checkElement(value, TemplateType.Bottom);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentTemplate.prototype, \"OddLeft\", {\n /**\n * `OddLeft` page template object.\n * @public\n */\n get: function () {\n return this.oddLeft;\n },\n set: function (value) {\n this.oddLeft = this.checkElement(value, TemplateType.Left);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentTemplate.prototype, \"OddTop\", {\n /**\n * `OddTop` page template object.\n * @public\n */\n get: function () {\n return this.oddTop;\n },\n set: function (value) {\n this.oddTop = this.checkElement(value, TemplateType.Top);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentTemplate.prototype, \"OddRight\", {\n /**\n * `OddRight` page template object.\n * @public\n */\n get: function () {\n return this.oddRight;\n },\n set: function (value) {\n this.oddRight = this.checkElement(value, TemplateType.Right);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentTemplate.prototype, \"OddBottom\", {\n /**\n * `OddBottom` page template object.\n * @public\n */\n get: function () {\n return this.oddBottom;\n },\n set: function (value) {\n this.oddBottom = this.checkElement(value, TemplateType.Bottom);\n },\n enumerable: true,\n configurable: true\n });\n // Implementation\n /**\n * Returns `left` template.\n * @public\n */\n PdfDocumentTemplate.prototype.getLeft = function (page) {\n if (page == null) {\n throw new Error('ArgumentNullException:page');\n }\n var template = null;\n // if (page.Document.Pages != null) {\n var even = this.isEven(page);\n if (even) {\n template = (this.EvenLeft != null) ? this.EvenLeft : this.left;\n }\n else {\n template = (this.OddLeft != null) ? this.OddLeft : this.left;\n }\n // }\n return template;\n };\n /**\n * Returns `top` template.\n * @public\n */\n PdfDocumentTemplate.prototype.getTop = function (page) {\n if (page == null) {\n throw new Error('ArgumentNullException:page');\n }\n var template = null;\n // if (page.Document.Pages != null) {\n var even = this.isEven(page);\n if (even) {\n template = (this.EvenTop != null) ? this.EvenTop : this.top;\n }\n else {\n template = (this.OddTop != null) ? this.OddTop : this.top;\n }\n // }\n return template;\n };\n /**\n * Returns `right` template.\n * @public\n */\n PdfDocumentTemplate.prototype.getRight = function (page) {\n if (page == null) {\n throw new Error('ArgumentNullException:page');\n }\n var template = null;\n // if (page.Document.Pages != null) {\n var even = this.isEven(page);\n if (even) {\n template = (this.EvenRight != null) ? this.EvenRight : this.right;\n }\n else {\n template = (this.OddRight != null) ? this.OddRight : this.right;\n }\n // }\n return template;\n };\n /**\n * Returns `bottom` template.\n * @public\n */\n PdfDocumentTemplate.prototype.getBottom = function (page) {\n if (page == null) {\n throw new Error('ArgumentNullException:page');\n }\n var template = null;\n // if (page.Document.Pages != null) {\n var even = this.isEven(page);\n if (even) {\n template = (this.EvenBottom != null) ? this.EvenBottom : this.bottom;\n }\n else {\n template = (this.OddBottom != null) ? this.OddBottom : this.bottom;\n }\n // }\n return template;\n };\n /**\n * Checks whether the page `is even`.\n * @private\n */\n PdfDocumentTemplate.prototype.isEven = function (page) {\n var pages = page.section.document.pages;\n var index = 0;\n if (pages.pageCollectionIndex.containsKey(page)) {\n index = pages.pageCollectionIndex.getValue(page) + 1;\n }\n else {\n index = pages.indexOf(page) + 1;\n }\n var even = ((index % 2) === 0);\n return even;\n };\n /**\n * Checks a `template element`.\n * @private\n */\n PdfDocumentTemplate.prototype.checkElement = function (templateElement, type) {\n if (templateElement != null) {\n if ((typeof templateElement.type !== 'undefined') && (templateElement.type !== TemplateType.None)) {\n throw new Error('NotSupportedException:Can not reassign the template element. Please, create new one.');\n }\n templateElement.type = type;\n }\n return templateElement;\n };\n return PdfDocumentTemplate;\n}());\nexport { PdfDocumentTemplate };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * PdfSectionTemplate.ts class for EJ2-PDF\n */\nimport { PdfDocumentTemplate } from './../document/pdf-document-template';\n/**\n * Represents a `page template` for all the pages in the section.\n */\nvar PdfSectionTemplate = /** @class */ (function (_super) {\n __extends(PdfSectionTemplate, _super);\n // Constructors\n /**\n * `Creates a new object`.\n * @private\n */\n function PdfSectionTemplate() {\n var _this = _super.call(this) || this;\n _this.leftValue = _this.topValue = _this.rightValue = _this.bottomValue = _this.stampValue = true;\n return _this;\n }\n Object.defineProperty(PdfSectionTemplate.prototype, \"applyDocumentLeftTemplate\", {\n // Properties\n /**\n * Gets or sets value indicating whether parent `Left page template should be used or not`.\n * @private\n */\n get: function () {\n return this.leftValue;\n },\n set: function (value) {\n this.leftValue = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfSectionTemplate.prototype, \"applyDocumentTopTemplate\", {\n /**\n * Gets or sets value indicating whether parent `Top page template should be used or not`.\n * @private\n */\n get: function () {\n return this.topValue;\n },\n set: function (value) {\n this.topValue = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfSectionTemplate.prototype, \"applyDocumentRightTemplate\", {\n /**\n * Gets or sets value indicating whether parent `Right page template should be used or not`.\n * @private\n */\n get: function () {\n return this.rightValue;\n },\n set: function (value) {\n this.rightValue = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfSectionTemplate.prototype, \"applyDocumentBottomTemplate\", {\n /**\n * Gets or sets value indicating whether parent `Bottom page template should be used or not`.\n * @private\n */\n get: function () {\n return this.bottomValue;\n },\n set: function (value) {\n this.bottomValue = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfSectionTemplate.prototype, \"applyDocumentStamps\", {\n /**\n * Gets or sets value indicating whether the `stamp value` is true or not.\n * @private\n */\n get: function () {\n return this.stampValue;\n },\n set: function (value) {\n this.stampValue = value;\n },\n enumerable: true,\n configurable: true\n });\n return PdfSectionTemplate;\n}(PdfDocumentTemplate));\nexport { PdfSectionTemplate };\n","import { PdfPage } from './pdf-page';\nimport { PageAddedEventArgs } from './page-added-event-arguments';\nimport { PdfReferenceHolder } from './../primitives/pdf-reference';\nimport { PdfArray } from './../primitives/pdf-array';\nimport { PdfNumber } from './../primitives/pdf-number';\nimport { PdfName } from './../primitives/pdf-name';\nimport { PdfDictionary } from './../primitives/pdf-dictionary';\nimport { SaveSectionEventHandler } from './../primitives/pdf-dictionary';\nimport { DictionaryProperties } from './../input-output/pdf-dictionary-properties';\nimport { PdfSectionCollection } from './pdf-section-collection';\nimport { PdfSectionPageCollection } from './pdf-section-page-collection';\nimport { RectangleF } from './../drawing/pdf-drawing';\nimport { PdfSectionTemplate } from './pdf-section-templates';\n/**\n * Represents a `section` entity. A section it's a set of the pages with similar page settings.\n */\nvar PdfSection = /** @class */ (function () {\n function PdfSection(document, pageSettings) {\n //Fields\n //public PageAdded() : PageAddedEventArgs.PageAddedEventHandler = new PageAddedEventArgs.PageAddedEventHandler(Object,args)\n /**\n * @hidden\n * @private\n */\n this.pageAdded = new PageAddedEventArgs();\n /**\n * @hidden\n * @private\n */\n this.pdfPages = [];\n /**\n * @hidden\n * @private\n */\n this.dictionaryProperties = new DictionaryProperties();\n if (typeof pageSettings === 'undefined') {\n this.constructor(document, document.pageSettings);\n }\n else {\n this.pdfDocument = document;\n this.settings = pageSettings.clone();\n this.initialSettings = this.settings.clone();\n this.initialize();\n }\n }\n Object.defineProperty(PdfSection.prototype, \"parent\", {\n //Property\n /**\n * Gets or sets the `parent`.\n * @private\n */\n get: function () {\n return this.sectionCollection;\n },\n set: function (value) {\n this.sectionCollection = value;\n this.section.items.setValue(this.dictionaryProperties.parent, new PdfReferenceHolder(value));\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfSection.prototype, \"parentDocument\", {\n /**\n * Gets the `parent document`.\n * @private\n */\n get: function () {\n return this.pdfDocument;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfSection.prototype, \"pageSettings\", {\n /**\n * Gets or sets the `page settings` of the section.\n * @private\n */\n get: function () {\n return this.settings;\n },\n set: function (value) {\n if (value != null) {\n this.settings = value;\n }\n else {\n throw Error('Value can not be null.');\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfSection.prototype, \"element\", {\n /**\n * Gets the wrapped `element`.\n * @private\n */\n get: function () {\n return this.section;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfSection.prototype, \"count\", {\n /**\n * Gets the `count` of the pages in the section.\n * @private\n */\n get: function () {\n return this.pagesReferences.count;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfSection.prototype, \"template\", {\n /**\n * Gets or sets a `template` for the pages in the section.\n * @private\n */\n get: function () {\n if (this.pageTemplate == null) {\n this.pageTemplate = new PdfSectionTemplate();\n }\n return this.pageTemplate;\n },\n set: function (value) {\n this.pageTemplate = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfSection.prototype, \"document\", {\n /**\n * Gets the `document`.\n * @private\n */\n get: function () {\n return this.sectionCollection.document;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfSection.prototype, \"pages\", {\n /**\n * Gets the collection of `pages` in a section (Read only)\n * @private\n */\n get: function () {\n if (this.pagesCollection == null || typeof this.pagesCollection === 'undefined') {\n this.pagesCollection = new PdfSectionPageCollection(this);\n }\n return this.pagesCollection;\n },\n enumerable: true,\n configurable: true\n });\n //methods\n /**\n * `Return the page collection` of current section.\n * @private\n */\n PdfSection.prototype.getPages = function () {\n return this.pdfPages;\n };\n /**\n * `Translates` point into native coordinates of the page.\n * @private\n */\n PdfSection.prototype.pointToNativePdf = function (page, point) {\n var bounds = this.getActualBounds(page, true);\n point.x += bounds.x;\n point.y = this.pageSettings.height - (point.y);\n return point;\n };\n /**\n * Sets the page setting of the current section.\n * @public\n * @param settings Instance of `PdfPageSettings`\n */\n PdfSection.prototype.setPageSettings = function (settings) {\n this.settings = settings;\n this.state.orientation = settings.orientation;\n this.state.rotate = settings.rotate;\n this.state.size = settings.size;\n this.state.origin = settings.origin;\n };\n /**\n * `Initializes` the object.\n * @private\n */\n PdfSection.prototype.initialize = function () {\n this.pagesReferences = new PdfArray();\n this.section = new PdfDictionary();\n this.state = new PageSettingsState(this.pdfDocument);\n this.section.sectionBeginSave = new SaveSectionEventHandler(this, this.state);\n this.pageCount = new PdfNumber(0);\n this.section.items.setValue(this.dictionaryProperties.count, this.pageCount);\n this.section.items.setValue(this.dictionaryProperties.type, new PdfName(this.dictionaryProperties.pages));\n this.section.items.setValue(this.dictionaryProperties.kids, this.pagesReferences);\n };\n /**\n * Checks whether any template should be printed on this layer.\n * @private\n * @param document The parent document.\n * @param page The parent page.\n * @param foreground Layer z-order.\n * @returns True - if some content should be printed on the layer, False otherwise.\n */\n PdfSection.prototype.containsTemplates = function (document, page, foreground) {\n var documentHeaders = this.getDocumentTemplates(document, page, true, foreground);\n var documentTemplates = this.getDocumentTemplates(document, page, false, foreground);\n var contains = (documentHeaders.length > 0 || documentTemplates.length > 0);\n return contains;\n };\n /**\n * Returns array of the document templates.\n * @private\n * @param document The parent document.\n * @param page The parent page.\n * @param headers If true - return headers/footers, if false - return simple templates.\n * @param foreground If true - return foreground templates, if false - return background templates.\n * @returns Returns array of the document templates.\n */\n /* tslint:disable */\n PdfSection.prototype.getDocumentTemplates = function (document, page, headers, foreground) {\n var templates = [];\n if (headers) {\n if (this.template.applyDocumentTopTemplate && document.template.getTop(page) != null) {\n if ((!(document.template.getTop(page).foreground || foreground)) || (document.template.getTop(page).foreground && foreground)) {\n templates.push(document.template.getTop(page));\n }\n }\n if (this.template.applyDocumentBottomTemplate && document.template.getBottom(page) != null) {\n if ((!(document.template.getBottom(page).foreground || foreground)) || (document.template.getBottom(page).foreground && foreground)) {\n templates.push(document.template.getBottom(page));\n }\n }\n if (this.template.applyDocumentLeftTemplate && document.template.getLeft(page) != null) {\n if ((!(document.template.getLeft(page).foreground || foreground)) || (document.template.getLeft(page).foreground && foreground)) {\n templates.push(document.template.getLeft(page));\n }\n }\n if (this.template.applyDocumentRightTemplate && document.template.getRight(page) != null) {\n if ((!(document.template.getRight(page).foreground || foreground)) || (document.template.getRight(page).foreground && foreground)) {\n templates.push(document.template.getRight(page));\n }\n }\n }\n return templates;\n };\n /* tslint:enable */\n /**\n * `Adds` the specified page.\n * @private\n */\n PdfSection.prototype.add = function (page) {\n if (typeof page === 'undefined') {\n var page_1 = new PdfPage();\n this.add(page_1);\n return page_1;\n }\n else {\n var r = this.checkPresence(page);\n this.pdfPages.push(page);\n this.pagesReferences.add(r);\n page.setSection(this);\n page.resetProgress();\n this.pageAddedMethod(page);\n }\n };\n /**\n * `Checks the presence`.\n * @private\n */\n PdfSection.prototype.checkPresence = function (page) {\n var rh = new PdfReferenceHolder(page);\n var contains = false;\n var sc = this.parent;\n for (var index = 0; index < sc.section.length; index++) {\n var section = sc.section[index];\n contains = contains || section.contains(page);\n }\n return rh;\n };\n /**\n * `Determines` whether the page in within the section.\n * @private\n */\n PdfSection.prototype.contains = function (page) {\n var index = this.indexOf(page);\n return (0 <= index);\n };\n /**\n * Get the `index of` the page.\n * @private\n */\n PdfSection.prototype.indexOf = function (page) {\n for (var index = 0; index < this.pdfPages.length; index++) {\n if (this.pdfPages[index] === page) {\n return this.pdfPages.indexOf(page);\n }\n }\n var r = new PdfReferenceHolder(page);\n return this.pagesReferences.indexOf(r);\n };\n /**\n * Call two event's methods.\n * @hidden\n * @private\n */\n PdfSection.prototype.pageAddedMethod = function (page) {\n //Create event's arguments\n var args = new PageAddedEventArgs(page);\n this.onPageAdded(args);\n var parent = this.parent;\n parent.document.pages.onPageAdded(args);\n this.pageCount.intValue = this.count;\n };\n /**\n * Called when the page has been added.\n * @hidden\n * @private\n */\n PdfSection.prototype.onPageAdded = function (args) {\n //\n };\n PdfSection.prototype.getActualBounds = function (arg1, arg2, arg3) {\n if (arg1 instanceof PdfPage && typeof arg2 === 'boolean') {\n var result = void 0;\n var document_1 = this.parent.document;\n result = this.getActualBounds(document_1, arg1, arg2);\n return result;\n }\n else {\n arg1 = arg1;\n arg2 = arg2;\n arg3 = arg3;\n var bounds = new RectangleF(0, 0, 0, 0);\n bounds.height = (arg3) ? this.pageSettings.size.height : this.pageSettings.getActualSize().height;\n bounds.width = (arg3) ? this.pageSettings.size.width : this.pageSettings.getActualSize().width;\n var left = this.getLeftIndentWidth(arg1, arg2, arg3);\n var top_1 = this.getTopIndentHeight(arg1, arg2, arg3);\n var right = this.getRightIndentWidth(arg1, arg2, arg3);\n var bottom = this.getBottomIndentHeight(arg1, arg2, arg3);\n bounds.x += left;\n bounds.y += top_1;\n bounds.width -= (left + right);\n bounds.height -= (top_1 + bottom);\n return bounds;\n }\n };\n /**\n * Calculates width of the `left indent`.\n * @private\n */\n PdfSection.prototype.getLeftIndentWidth = function (document, page, includeMargins) {\n if (document == null) {\n throw new Error('ArgumentNullException:document');\n }\n if (page == null) {\n throw new Error('ArgumentNullException:page');\n }\n var value = (includeMargins) ? this.pageSettings.margins.left : 0;\n var templateWidth = (this.template.getLeft(page) != null) ? this.template.getLeft(page).width : 0;\n var docTemplateWidth = (document.template.getLeft(page) != null) ? document.template.getLeft(page).width : 0;\n value += (this.template.applyDocumentLeftTemplate) ? Math.max(templateWidth, docTemplateWidth) : templateWidth;\n return value;\n };\n /**\n * Calculates `Height` of the top indent.\n * @private\n */\n PdfSection.prototype.getTopIndentHeight = function (document, page, includeMargins) {\n if (document == null) {\n throw new Error('ArgumentNullException:document');\n }\n if (page == null) {\n throw new Error('ArgumentNullException:page');\n }\n var value = (includeMargins) ? this.pageSettings.margins.top : 0;\n var templateHeight = (this.template.getTop(page) != null) ? this.template.getTop(page).height : 0;\n var docTemplateHeight = (document.template.getTop(page) != null) ? document.template.getTop(page).height : 0;\n value += (this.template.applyDocumentTopTemplate) ? Math.max(templateHeight, docTemplateHeight) : templateHeight;\n return value;\n };\n /**\n * Calculates `width` of the right indent.\n * @private\n */\n PdfSection.prototype.getRightIndentWidth = function (document, page, includeMargins) {\n if (document == null) {\n throw new Error('ArgumentNullException:document');\n }\n if (page == null) {\n throw new Error('ArgumentNullException:page');\n }\n var value = (includeMargins) ? this.pageSettings.margins.right : 0;\n var templateWidth = (this.template.getRight(page) != null) ? this.template.getRight(page).width : 0;\n var docTemplateWidth = (document.template.getRight(page) != null) ? document.template.getRight(page).width : 0;\n value += (this.template.applyDocumentRightTemplate) ? Math.max(templateWidth, docTemplateWidth) : templateWidth;\n return value;\n };\n /**\n * Calculates `Height` of the bottom indent.\n * @private\n */\n PdfSection.prototype.getBottomIndentHeight = function (document, page, includeMargins) {\n if (document == null) {\n throw new Error('ArgumentNullException:document');\n }\n if (page == null) {\n throw new Error('ArgumentNullException:page');\n }\n var value = (includeMargins) ? this.pageSettings.margins.bottom : 0;\n var templateHeight = (this.template.getBottom(page) != null) ? this.template.getBottom(page).height : 0;\n var docTemplateHeight = (document.template.getBottom(page) != null) ? document.template.getBottom(page).height : 0;\n value += (this.template.applyDocumentBottomTemplate) ? Math.max(templateHeight, docTemplateHeight) : templateHeight;\n return value;\n };\n /**\n * `Removes` the page from the section.\n * @private\n */\n PdfSection.prototype.remove = function (page) {\n if (page == null) {\n throw Error('ArgumentNullException(\"page\")');\n }\n var index = this.pdfPages.indexOf(page);\n this.pagesReferences.removeAt(index);\n var temproaryPages = [];\n for (var j = 0; j < index; j++) {\n temproaryPages.push(this.pdfPages[j]);\n }\n for (var j = index + 1; j < this.pdfPages.length; j++) {\n temproaryPages.push(this.pdfPages[j]);\n }\n this.pdfPages = temproaryPages;\n };\n /**\n * In fills dictionary by the data from `Page settings`.\n * @private\n */\n PdfSection.prototype.applyPageSettings = function (container, parentSettings, state) {\n var bounds = new RectangleF(state.origin, state.size);\n container.items.setValue(this.dictionaryProperties.mediaBox, PdfArray.fromRectangle(bounds));\n var rotate = 0;\n rotate = PdfSectionCollection.rotateFactor * state.rotate;\n var angle = new PdfNumber(rotate);\n container.items.setValue(this.dictionaryProperties.rotate, angle);\n };\n /**\n * Catches the Save event of the dictionary.\n * @hidden\n * @private\n */\n PdfSection.prototype.beginSave = function (state, writer) {\n var doc = writer.document;\n this.applyPageSettings(this.section, doc.pageSettings, state);\n };\n /**\n * Draws page templates on the page.\n * @private\n */\n PdfSection.prototype.drawTemplates = function (page, layer, document, foreground) {\n var documentHeaders = this.getDocumentTemplates(document, page, true, foreground);\n var documentTemplates = this.getDocumentTemplates(document, page, false, foreground);\n if (foreground) {\n this.drawTemplatesHelper(layer, document, documentHeaders);\n this.drawTemplatesHelper(layer, document, documentTemplates);\n }\n else {\n this.drawTemplatesHelper(layer, document, documentHeaders);\n this.drawTemplatesHelper(layer, document, documentTemplates);\n }\n };\n /**\n * Draws page templates on the page.\n * @private\n */\n PdfSection.prototype.drawTemplatesHelper = function (layer, document, templates) {\n if (templates != null && templates.length > 0) {\n var len = templates.length;\n for (var i = 0; i < len; i++) {\n var template = templates[i];\n template.draw(layer, document);\n }\n }\n };\n return PdfSection;\n}());\nexport { PdfSection };\nvar PageSettingsState = /** @class */ (function () {\n //Public Constructor\n /**\n * New instance to store the `PageSettings`.\n * @private\n */\n function PageSettingsState(document) {\n this.pageOrientation = document.pageSettings.orientation;\n this.pageRotate = document.pageSettings.rotate;\n this.pageSize = document.pageSettings.size;\n this.pageOrigin = document.pageSettings.origin;\n }\n Object.defineProperty(PageSettingsState.prototype, \"orientation\", {\n //public Properties\n /**\n * @hidden\n * @private\n */\n get: function () {\n return this.pageOrientation;\n },\n set: function (value) {\n this.pageOrientation = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PageSettingsState.prototype, \"rotate\", {\n /**\n * @hidden\n * @private\n */\n get: function () {\n return this.pageRotate;\n },\n set: function (value) {\n this.pageRotate = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PageSettingsState.prototype, \"size\", {\n /**\n * @hidden\n * @private\n */\n get: function () {\n return this.pageSize;\n },\n set: function (value) {\n this.pageSize = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PageSettingsState.prototype, \"origin\", {\n /**\n * @hidden\n * @private\n */\n get: function () {\n return this.pageOrigin;\n },\n set: function (value) {\n this.pageOrigin = value;\n },\n enumerable: true,\n configurable: true\n });\n return PageSettingsState;\n}());\nexport { PageSettingsState };\n","import { PdfNumber } from './../primitives/pdf-number';\nimport { PdfName } from './../primitives/pdf-name';\nimport { PdfArray } from './../primitives/pdf-array';\nimport { PdfDictionary, SaveSectionCollectionEventHandler } from './../primitives/pdf-dictionary';\nimport { PdfReferenceHolder } from './../primitives/pdf-reference';\nimport { RectangleF, PointF } from './../drawing/pdf-drawing';\nimport { PdfSection } from './pdf-section';\nimport { DictionaryProperties } from './../input-output/pdf-dictionary-properties';\n/**\n * Represents the `collection of the sections`.\n * @private\n */\nvar PdfSectionCollection = /** @class */ (function () {\n //constructor\n /**\n * Initializes a new instance of the `PdfSectionCollection` class.\n * @private\n */\n function PdfSectionCollection(document) {\n /**\n * @hidden\n * @private\n */\n this.sections = [];\n /**\n * @hidden\n * @private\n */\n this.dictionaryProperties = new DictionaryProperties();\n // if (document === null) {\n // throw new Error('ArgumentNullException : document');\n // }\n this.pdfDocument = document.clone();\n this.initialize();\n }\n Object.defineProperty(PdfSectionCollection.prototype, \"section\", {\n //Properties\n /**\n * Gets the `Section` collection.\n */\n get: function () {\n return this.sections;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfSectionCollection.prototype, \"document\", {\n /**\n * Gets a parent `document`.\n * @private\n */\n get: function () {\n return this.pdfDocument;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfSectionCollection.prototype, \"count\", {\n /**\n * Gets the `number of sections` in a document.\n * @private\n */\n get: function () {\n return this.sections.length;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfSectionCollection.prototype, \"element\", {\n /**\n * Gets the wrapped `element`.\n * @private\n */\n get: function () {\n return this.pages;\n },\n enumerable: true,\n configurable: true\n });\n //Methods\n /**\n * `Initializes the object`.\n * @private\n */\n PdfSectionCollection.prototype.initialize = function () {\n this.sectionCount = new PdfNumber(0);\n this.sectionCollection = new PdfArray();\n this.pages = new PdfDictionary();\n this.pages.beginSave = new SaveSectionCollectionEventHandler(this);\n this.pages.items.setValue(this.dictionaryProperties.type, new PdfName('Pages'));\n this.pages.items.setValue(this.dictionaryProperties.kids, this.sectionCollection);\n this.pages.items.setValue(this.dictionaryProperties.count, this.sectionCount);\n this.pages.items.setValue(this.dictionaryProperties.resources, new PdfDictionary());\n this.setPageSettings(this.pages, this.pdfDocument.pageSettings);\n };\n /**\n * Initializes a new instance of the `PdfSectionCollection` class.\n * @private\n */\n PdfSectionCollection.prototype.pdfSectionCollection = function (index) {\n if (index < 0 || index >= this.count) {\n throw new Error('IndexOutOfRangeException()');\n }\n return this.sections[index];\n };\n /**\n * In fills dictionary by the data from `Page settings`.\n * @private\n */\n PdfSectionCollection.prototype.setPageSettings = function (container, pageSettings) {\n // if (container === null) {\n // throw new Error('ArgumentNullException : container');\n // }\n // if (pageSettings === null) {\n // throw new Error('ArgumentNullException : pageSettings');\n // }\n var bounds = new RectangleF(new PointF(), pageSettings.size);\n container.items.setValue(this.dictionaryProperties.mediaBox, PdfArray.fromRectangle(bounds));\n };\n /**\n * `Adds` the specified section.\n * @private\n */\n PdfSectionCollection.prototype.add = function (section) {\n if (typeof section === 'undefined') {\n var section_1 = new PdfSection(this.pdfDocument);\n this.add(section_1);\n return section_1;\n }\n else {\n // if (section === null) {\n // throw new Error('ArgumentNullException : section');\n // }\n var r = this.checkSection(section);\n this.sections.push(section);\n section.parent = this;\n this.sectionCollection.add(r);\n return this.sections.indexOf(section);\n }\n };\n /**\n * `Checks` if the section is within the collection.\n * @private\n */\n PdfSectionCollection.prototype.checkSection = function (section) {\n var r = new PdfReferenceHolder(section);\n var contains = this.sectionCollection.contains(r);\n // if (contains) {\n // throw new Error('ArgumentException : The object can not be added twice to the collection,section');\n // }\n return r;\n };\n /**\n * Catches the Save event of the dictionary to `count the pages`.\n * @private\n */\n PdfSectionCollection.prototype.countPages = function () {\n var count = 0;\n this.sections.forEach(function (n) { return (count += n.count); });\n return count;\n };\n /**\n * Catches the Save event of the dictionary to `count the pages`.\n * @hidden\n * @private\n */\n PdfSectionCollection.prototype.beginSave = function () {\n this.sectionCount.intValue = this.countPages();\n };\n //Fields\n /**\n * Rotate factor for page `rotation`.\n * @default 90\n * @private\n */\n PdfSectionCollection.rotateFactor = 90;\n return PdfSectionCollection;\n}());\nexport { PdfSectionCollection };\n","import { PdfPage } from './pdf-page';\nimport { Dictionary } from './../collections/dictionary';\nimport { PdfPageOrientation } from './enum';\n/**\n * Represents a virtual collection of all the pages in the document.\n * @private\n */\nvar PdfDocumentPageCollection = /** @class */ (function () {\n //constructor\n /**\n * Initializes a new instance of the `PdfPageCollection` class.\n * @private\n */\n function PdfDocumentPageCollection(document) {\n /**\n * It holds the page collection with the `index`.\n * @private\n */\n this.pdfPageCollectionIndex = new Dictionary();\n /**\n * Stores the previous pages's `orientation`.\n * @default PdfPageOrientation.Portrait\n * @private\n */\n this.previousPageOrientation = PdfPageOrientation.Portrait;\n this.document = document;\n }\n Object.defineProperty(PdfDocumentPageCollection.prototype, \"count\", {\n //Property\n /**\n * Gets the total `number of the pages`.\n * @private\n */\n get: function () {\n return this.countPages();\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocumentPageCollection.prototype, \"pageCollectionIndex\", {\n /**\n * Gets a `page index` from the document.\n * @private\n */\n get: function () {\n return this.pdfPageCollectionIndex;\n },\n enumerable: true,\n configurable: true\n });\n PdfDocumentPageCollection.prototype.add = function (page) {\n if (typeof page === 'undefined') {\n var page_1 = new PdfPage();\n this.add(page_1);\n return page_1;\n }\n else {\n var section = this.getLastSection();\n if (section.pageSettings.orientation !== this.previousPageOrientation) {\n section = this.document.sections.add();\n section.pageSettings.orientation = this.document.pageSettings.orientation;\n }\n section.add(page);\n }\n };\n /**\n * Returns `last section` in the document.\n * @private\n */\n PdfDocumentPageCollection.prototype.getLastSection = function () {\n var sc = this.document.sections;\n if (sc.section.length === 0) {\n sc.add();\n }\n var section = sc.section[sc.section.length - 1];\n return section;\n };\n /**\n * Called when `new page has been added`.\n * @private\n */\n PdfDocumentPageCollection.prototype.onPageAdded = function (args) {\n // if (PageAdded !== null)\n // {\n // PageAdded(this, args);\n // }\n };\n /**\n * Gets the `total number of pages`.\n * @private\n */\n PdfDocumentPageCollection.prototype.countPages = function () {\n var sc = this.document.sections;\n var count = 0;\n for (var index = 0; index < sc.section.length; index++) {\n count += sc.section[index].count;\n }\n return count;\n };\n /**\n * Gets the `page object` from page index.\n * @private\n */\n PdfDocumentPageCollection.prototype.getPageByIndex = function (index) {\n return this.getPage(index);\n };\n /**\n * Gets a page by its `index` in the document.\n * @private\n */\n PdfDocumentPageCollection.prototype.getPage = function (index) {\n if ((index < 0) || (index >= this.count)) {\n throw Error('ArgumentOutOfRangeException(\"index\", \"Value can not be less 0\")');\n }\n var page = null;\n var sectionStartIndex = 0;\n var sectionCount = 0;\n var pageIndex = 0;\n var length = this.document.sections.count;\n for (var i = 0; i < length; i++) {\n var section = this.document.sections.section[i];\n sectionCount = section.count;\n pageIndex = index - sectionStartIndex;\n // We found a section containing the page.\n if ((index >= sectionStartIndex && pageIndex < sectionCount)) {\n page = section.getPages()[pageIndex];\n break;\n }\n sectionStartIndex += sectionCount;\n }\n return page;\n };\n /**\n * Gets the `index of` the page in the document.\n * @private\n */\n PdfDocumentPageCollection.prototype.indexOf = function (page) {\n var index = -1;\n if (page == null) {\n throw new Error('ArgumentNullException: page');\n }\n else {\n var numPages = 0;\n for (var i = 0, len = this.document.sections.count; i < len; i++) {\n var section = this.document.sections.pdfSectionCollection(i);\n index = section.indexOf(page);\n if (index >= 0) {\n index += numPages;\n break;\n }\n else {\n index = -1;\n }\n numPages += section.count;\n }\n }\n return index;\n };\n /**\n * `Removes` the specified page.\n * @private\n */\n PdfDocumentPageCollection.prototype.remove = function (page) {\n if (page == null) {\n throw Error('ArgumentNullException(\"page\")');\n }\n var section = null;\n var len;\n for (var i = 0, len_1 = this.document.sections.count; i < len_1; i++) {\n section = this.document.sections.pdfSectionCollection(i);\n if (section.pages.contains(page)) {\n section.pages.remove(page);\n break;\n }\n }\n return section;\n };\n return PdfDocumentPageCollection;\n}());\nexport { PdfDocumentPageCollection };\n","/**\n * PdfCacheCollection.ts class for EJ2-PDF\n */\nimport { Dictionary } from './../collections/dictionary';\n/**\n * `Collection of the cached objects`.\n * @private\n */\nvar PdfCacheCollection = /** @class */ (function () {\n // Constructors\n /**\n * Initializes a new instance of the `PdfCacheCollection` class.\n * @private\n */\n function PdfCacheCollection() {\n this.referenceObjects = [];\n this.pdfFontCollection = new Dictionary();\n }\n // Public methods\n /**\n * `Searches` for the similar cached object. If is not found - adds the object to the cache.\n * @private\n */\n PdfCacheCollection.prototype.search = function (obj) {\n var result = null;\n var group = this.getGroup(obj);\n if (group == null) {\n group = this.createNewGroup();\n }\n else if (group.length > 0) {\n result = group[0];\n }\n group.push(obj);\n return result;\n };\n // Implementation\n /**\n * `Creates` a new group.\n * @private\n */\n PdfCacheCollection.prototype.createNewGroup = function () {\n var group = [];\n this.referenceObjects.push(group);\n return group;\n };\n /**\n * `Find and Return` a group.\n * @private\n */\n PdfCacheCollection.prototype.getGroup = function (result) {\n var group = null;\n if (result !== null) {\n var len = this.referenceObjects.length;\n for (var i = 0; i < len; i++) {\n if (this.referenceObjects.length > 0) {\n var tGroup = this.referenceObjects[i];\n if (tGroup.length > 0) {\n var representative = tGroup[0];\n if (result.equalsTo(representative)) {\n group = tGroup;\n break;\n }\n }\n else {\n this.removeGroup(tGroup);\n }\n }\n len = this.referenceObjects.length;\n }\n }\n return group;\n };\n /**\n * Remove a group from the storage.\n */\n PdfCacheCollection.prototype.removeGroup = function (group) {\n if (group !== null) {\n var index = this.referenceObjects.indexOf(group);\n this.referenceObjects.slice(index, index + 1);\n }\n };\n PdfCacheCollection.prototype.destroy = function () {\n this.pdfFontCollection = undefined;\n this.referenceObjects = undefined;\n };\n return PdfCacheCollection;\n}());\nexport { PdfCacheCollection };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfWriter } from './../input-output/pdf-writer';\nimport { PdfMainObjectCollection } from './../input-output/pdf-main-object-collection';\nimport { PdfDocumentBase } from './pdf-document-base';\nimport { PdfCrossTable } from './../input-output/pdf-cross-table';\nimport { PdfCatalog } from './pdf-catalog';\nimport { PdfPageSettings } from './../pages/pdf-page-settings';\nimport { PdfSectionCollection } from './../pages/pdf-section-collection';\nimport { PdfDocumentPageCollection } from './../pages/pdf-document-page-collection';\nimport { PdfCacheCollection } from './../general/pdf-cache-collection';\nimport { PdfColorSpace } from './../graphics/enum';\nimport { PdfDocumentTemplate } from './pdf-document-template';\nimport { PdfFontFamily } from './../graphics/fonts/enum';\nimport { PdfStandardFont } from './../graphics/fonts/pdf-standard-font';\n/**\n * Represents a PDF document and can be used to create a new PDF document from the scratch.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a new page to the document\n * let page1 : PdfPage = document.pages.add();\n * // set the font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // create black brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, new PointF(0, 0));\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\nvar PdfDocument = /** @class */ (function (_super) {\n __extends(PdfDocument, _super);\n function PdfDocument(isMerging) {\n var _this = _super.call(this) || this;\n /**\n * Default `margin` value.\n * @default 40.0\n * @private\n */\n _this.defaultMargin = 40.0;\n /**\n * Internal variable to store instance of `StreamWriter` classes..\n * @default null\n * @private\n */\n _this.streamWriter = null;\n _this = _super.call(this, _this) || this;\n if (isMerging === true || isMerging === false || typeof isMerging !== 'undefined') {\n var objects = new PdfMainObjectCollection();\n _this.setMainObjectCollection(objects);\n var crossTable = new PdfCrossTable();\n crossTable.isMerging = isMerging;\n crossTable.document = _this;\n _this.setCrossTable(crossTable);\n var catalog = new PdfCatalog();\n _this.setCatalog(catalog);\n objects.add(catalog);\n catalog.position = -1;\n _this.sectionCollection = new PdfSectionCollection(_this);\n _this.documentPageCollection = new PdfDocumentPageCollection(_this);\n catalog.pages = _this.sectionCollection;\n }\n else {\n PdfDocument.cacheCollection = new PdfCacheCollection();\n _this.constructor(false);\n }\n return _this;\n }\n Object.defineProperty(PdfDocument, \"defaultFont\", {\n //Properties\n /**\n * Gets the `default font`. It is used for complex objects when font is not explicitly defined.\n * @private\n */\n get: function () {\n if (this.defaultStandardFont == null) {\n this.defaultStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 8);\n }\n return this.defaultStandardFont;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocument.prototype, \"sections\", {\n /**\n * Gets the collection of the `sections` in the document.\n * @private\n */\n get: function () {\n return this.sectionCollection;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocument.prototype, \"pageSettings\", {\n /**\n * Gets the document's page setting.\n * @public\n */\n get: function () {\n if (this.settings == null) {\n this.settings = new PdfPageSettings(this.defaultMargin);\n }\n return this.settings;\n },\n /**\n * Sets the document's page setting.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n *\n * // sets the right margin of the page\n * document.pageSettings.margins.right = 0;\n * // set the page size.\n * document.pageSettings.size = new SizeF(500, 500);\n * // change the page orientation to landscape\n * document.pageSettings.orientation = PdfPageOrientation.Landscape;\n * // apply 90 degree rotation on the page\n * document.pageSettings.rotate = PdfPageRotateAngle.RotateAngle90;\n *\n * // add a pages to the document\n * let page1 : PdfPage = document.pages.add();\n * // set font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // set brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * // set the specified Point\n * let point : PointF = new PointF(page1.getClientSize().width - 200, page1.getClientSize().height - 200);\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, point);\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n set: function (value) {\n this.settings = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocument.prototype, \"pages\", {\n /**\n * Represents the collection of pages in the PDF document.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * //\n * // get the collection of pages in the document\n * let pageCollection : PdfDocumentPageCollection = document.pages;\n * //\n * // add pages\n * let page1 : PdfPage = pageCollection.add();\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n get: function () {\n return this.documentPageCollection;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocument, \"cache\", {\n /**\n * Gets collection of the `cached objects`.\n * @private\n */\n get: function () {\n if (typeof PdfDocument.cacheCollection === 'undefined' || PdfDocument.cacheCollection == null) {\n return new PdfCacheCollection();\n }\n return PdfDocument.cacheCollection;\n },\n /**\n * Sets collection of the `cached objects`.\n * @private\n */\n set: function (value) {\n this.cacheCollection = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocument, \"enableCache\", {\n /**\n * Gets the value of enable cache.\n * @private\n */\n get: function () {\n return this.isCacheEnabled;\n },\n /**\n * Sets thie value of enable cache.\n * @private\n */\n set: function (value) {\n this.isCacheEnabled = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocument.prototype, \"colorSpace\", {\n /* tslint:disable */\n /**\n * Gets or sets the `color space` of the document. This property can be used to create PDF document in RGB, Gray scale or CMYK color spaces.\n * @private\n */\n get: function () {\n if ((this.pdfColorSpace === PdfColorSpace.Rgb) || ((this.pdfColorSpace === PdfColorSpace.Cmyk)\n || (this.pdfColorSpace === PdfColorSpace.GrayScale))) {\n return this.pdfColorSpace;\n }\n else {\n return PdfColorSpace.Rgb;\n }\n },\n set: function (value) {\n if ((value === PdfColorSpace.Rgb) || ((value === PdfColorSpace.Cmyk) ||\n (value === PdfColorSpace.GrayScale))) {\n this.pdfColorSpace = value;\n }\n else {\n this.pdfColorSpace = PdfColorSpace.Rgb;\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDocument.prototype, \"template\", {\n /* tslint:enable */\n /**\n * Gets or sets a `template` to all pages in the document.\n * @private\n */\n get: function () {\n if (this.pageTemplate == null) {\n this.pageTemplate = new PdfDocumentTemplate();\n }\n return this.pageTemplate;\n },\n set: function (value) {\n this.pageTemplate = value;\n },\n enumerable: true,\n configurable: true\n });\n PdfDocument.prototype.docSave = function (stream, arg2, arg3) {\n this.checkPagesPresence();\n if (stream === null) {\n throw new Error('ArgumentNullException : stream');\n }\n this.streamWriter = stream;\n var writer = new PdfWriter(stream);\n writer.document = this;\n if (typeof arg2 === 'boolean' && typeof arg3 === 'undefined') {\n return this.crossTable.save(writer);\n }\n else {\n this.crossTable.save(writer, arg2);\n }\n };\n /**\n * Checks the pages `presence`.\n * @private\n */\n PdfDocument.prototype.checkPagesPresence = function () {\n if (this.pages.count === 0) {\n this.pages.add();\n }\n };\n /**\n * disposes the current instance of `PdfDocument` class.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a new page to the document\n * let page1 : PdfPage = document.pages.add();\n * // set the font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * // create black brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, new PointF(0, 0));\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n PdfDocument.prototype.destroy = function () {\n this.catalog = undefined;\n this.colorSpace = undefined;\n this.currentSavingObj = undefined;\n this.documentPageCollection = undefined;\n this.isStreamCopied = undefined;\n this.pageSettings = undefined;\n this.pageTemplate = undefined;\n this.pdfColorSpace = undefined;\n this.sectionCollection = undefined;\n PdfDocument.cache.destroy();\n this.crossTable.pdfObjects.destroy();\n PdfDocument.cache = undefined;\n this.streamWriter.destroy();\n };\n /**\n * `Font` used in complex objects to draw strings and text when it is not defined explicitly.\n * @default null\n * @private\n */\n PdfDocument.defaultStandardFont = null;\n /**\n * Indicates whether enable cache or not\n * @default true\n * @private\n */\n PdfDocument.isCacheEnabled = true;\n return PdfDocument;\n}(PdfDocumentBase));\nexport { PdfDocument };\n","/**\n * PdfStandardFontMetricsFactory.ts class for EJ2-PDF\n */\nimport { PdfFontStyle, PdfFontFamily } from './enum';\nimport { PdfFontMetrics, StandardWidthTable } from './pdf-font-metrics';\n/**\n * @private\n * `Factory of the standard fonts metrics`.\n */\nvar PdfStandardFontMetricsFactory = /** @class */ (function () {\n function PdfStandardFontMetricsFactory() {\n }\n /**\n * Returns `metrics` of the font.\n * @private\n */\n PdfStandardFontMetricsFactory.getMetrics = function (fontFamily, fontStyle, size) {\n var metrics = null;\n switch (fontFamily) {\n case PdfFontFamily.Helvetica:\n metrics = this.getHelveticaMetrics(fontFamily, fontStyle, size);\n break;\n case PdfFontFamily.Courier:\n metrics = this.getCourierMetrics(fontFamily, fontStyle, size);\n break;\n case PdfFontFamily.TimesRoman:\n metrics = this.getTimesMetrics(fontFamily, fontStyle, size);\n break;\n case PdfFontFamily.Symbol:\n metrics = this.getSymbolMetrics(fontFamily, fontStyle, size);\n break;\n case PdfFontFamily.ZapfDingbats:\n metrics = this.getZapfDingbatsMetrics(fontFamily, fontStyle, size);\n break;\n default:\n metrics = this.getHelveticaMetrics(PdfFontFamily.Helvetica, fontStyle, size);\n break;\n }\n metrics.name = fontFamily.toString();\n metrics.subScriptSizeFactor = this.subSuperScriptFactor;\n metrics.superscriptSizeFactor = this.subSuperScriptFactor;\n return metrics;\n };\n // Implementation\n /**\n * Creates `Helvetica font metrics`.\n * @private\n */\n PdfStandardFontMetricsFactory.getHelveticaMetrics = function (fontFamily, fontStyle, size) {\n var metrics = new PdfFontMetrics();\n if ((fontStyle & PdfFontStyle.Bold) > 0 && (fontStyle & PdfFontStyle.Italic) > 0) {\n metrics.ascent = this.helveticaBoldItalicAscent;\n metrics.descent = this.helveticaBoldItalicDescent;\n metrics.postScriptName = this.helveticaBoldItalicName;\n metrics.size = size;\n metrics.widthTable = new StandardWidthTable(this.arialBoldWidth);\n metrics.height = metrics.ascent - metrics.descent;\n }\n else if ((fontStyle & PdfFontStyle.Bold) > 0) {\n metrics.ascent = this.helveticaBoldAscent;\n metrics.descent = this.helveticaBoldDescent;\n metrics.postScriptName = this.helveticaBoldName;\n metrics.size = size;\n metrics.widthTable = new StandardWidthTable(this.arialBoldWidth);\n metrics.height = metrics.ascent - metrics.descent;\n }\n else if ((fontStyle & PdfFontStyle.Italic) > 0) {\n metrics.ascent = this.helveticaItalicAscent;\n metrics.descent = this.helveticaItalicDescent;\n metrics.postScriptName = this.helveticaItalicName;\n metrics.size = size;\n metrics.widthTable = new StandardWidthTable(this.arialWidth);\n metrics.height = metrics.ascent - metrics.descent;\n }\n else {\n metrics.ascent = this.helveticaAscent;\n metrics.descent = this.helveticaDescent;\n metrics.postScriptName = this.helveticaName;\n metrics.size = size;\n metrics.widthTable = new StandardWidthTable(this.arialWidth);\n metrics.height = metrics.ascent - metrics.descent;\n }\n return metrics;\n };\n /**\n * Creates `Courier font metrics`.\n * @private\n */\n PdfStandardFontMetricsFactory.getCourierMetrics = function (fontFamily, fontStyle, size) {\n var metrics = new PdfFontMetrics();\n if ((fontStyle & PdfFontStyle.Bold) > 0 && (fontStyle & PdfFontStyle.Italic) > 0) {\n metrics.ascent = this.courierBoldItalicAscent;\n metrics.descent = this.courierBoldItalicDescent;\n metrics.postScriptName = this.courierBoldItalicName;\n metrics.size = size;\n metrics.widthTable = new StandardWidthTable(this.fixedWidth);\n metrics.height = metrics.ascent - metrics.descent;\n }\n else if ((fontStyle & PdfFontStyle.Bold) > 0) {\n metrics.ascent = this.courierBoldAscent;\n metrics.descent = this.courierBoldDescent;\n metrics.postScriptName = this.courierBoldName;\n metrics.size = size;\n metrics.widthTable = new StandardWidthTable(this.fixedWidth);\n metrics.height = metrics.ascent - metrics.descent;\n }\n else if ((fontStyle & PdfFontStyle.Italic) > 0) {\n metrics.ascent = this.courierItalicAscent;\n metrics.descent = this.courierItalicDescent;\n metrics.postScriptName = this.courierItalicName;\n metrics.size = size;\n metrics.widthTable = new StandardWidthTable(this.fixedWidth);\n metrics.height = metrics.ascent - metrics.descent;\n }\n else {\n metrics.ascent = this.courierAscent;\n metrics.descent = this.courierDescent;\n metrics.postScriptName = this.courierName;\n metrics.size = size;\n metrics.widthTable = new StandardWidthTable(this.fixedWidth);\n metrics.height = metrics.ascent - metrics.descent;\n }\n return metrics;\n };\n /**\n * Creates `Times font metrics`.\n * @private\n */\n PdfStandardFontMetricsFactory.getTimesMetrics = function (fontFamily, fontStyle, size) {\n var metrics = new PdfFontMetrics();\n if ((fontStyle & PdfFontStyle.Bold) > 0 && (fontStyle & PdfFontStyle.Italic) > 0) {\n metrics.ascent = this.timesBoldItalicAscent;\n metrics.descent = this.timesBoldItalicDescent;\n metrics.postScriptName = this.timesBoldItalicName;\n metrics.size = size;\n metrics.widthTable = new StandardWidthTable(this.timesRomanBoldItalicWidths);\n metrics.height = metrics.ascent - metrics.descent;\n }\n else if ((fontStyle & PdfFontStyle.Bold) > 0) {\n metrics.ascent = this.timesBoldAscent;\n metrics.descent = this.timesBoldDescent;\n metrics.postScriptName = this.timesBoldName;\n metrics.size = size;\n metrics.widthTable = new StandardWidthTable(this.timesRomanBoldWidth);\n metrics.height = metrics.ascent - metrics.descent;\n }\n else if ((fontStyle & PdfFontStyle.Italic) > 0) {\n metrics.ascent = this.timesItalicAscent;\n metrics.descent = this.timesItalicDescent;\n metrics.postScriptName = this.timesItalicName;\n metrics.size = size;\n metrics.widthTable = new StandardWidthTable(this.timesRomanItalicWidth);\n metrics.height = metrics.ascent - metrics.descent;\n }\n else {\n metrics.ascent = this.timesAscent;\n metrics.descent = this.timesDescent;\n metrics.postScriptName = this.timesName;\n metrics.size = size;\n metrics.widthTable = new StandardWidthTable(this.timesRomanWidth);\n metrics.height = metrics.ascent - metrics.descent;\n }\n return metrics;\n };\n /**\n * Creates `Symbol font metrics`.\n * @private\n */\n PdfStandardFontMetricsFactory.getSymbolMetrics = function (fontFamily, fontStyle, size) {\n var metrics = new PdfFontMetrics();\n metrics.ascent = this.symbolAscent;\n metrics.descent = this.symbolDescent;\n metrics.postScriptName = this.symbolName;\n metrics.size = size;\n metrics.widthTable = new StandardWidthTable(this.symbolWidth);\n metrics.height = metrics.ascent - metrics.descent;\n return metrics;\n };\n /**\n * Creates `ZapfDingbats font metrics`.\n * @private\n */\n PdfStandardFontMetricsFactory.getZapfDingbatsMetrics = function (fontFamily, fontStyle, size) {\n var metrics = new PdfFontMetrics();\n metrics.ascent = this.zapfDingbatsAscent;\n metrics.descent = this.zapfDingbatsDescent;\n metrics.postScriptName = this.zapfDingbatsName;\n metrics.size = size;\n metrics.widthTable = new StandardWidthTable(this.zapfDingbatsWidth);\n metrics.height = metrics.ascent - metrics.descent;\n return metrics;\n };\n /**\n * `Multiplier` os subscript superscript.\n * @private\n */\n PdfStandardFontMetricsFactory.subSuperScriptFactor = 1.52;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.helveticaAscent = 931;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.helveticaDescent = -225;\n /**\n * `Font type`.\n * @private\n */\n PdfStandardFontMetricsFactory.helveticaName = 'Helvetica';\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.helveticaBoldAscent = 962;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.helveticaBoldDescent = -228;\n /**\n * `Font type`.\n * @private\n */\n PdfStandardFontMetricsFactory.helveticaBoldName = 'Helvetica-Bold';\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.helveticaItalicAscent = 931;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.helveticaItalicDescent = -225;\n /**\n * `Font type`.\n * @private\n */\n PdfStandardFontMetricsFactory.helveticaItalicName = 'Helvetica-Oblique';\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.helveticaBoldItalicAscent = 962;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.helveticaBoldItalicDescent = -228;\n /**\n * `Font type`.\n * @private\n */\n PdfStandardFontMetricsFactory.helveticaBoldItalicName = 'Helvetica-BoldOblique';\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.courierAscent = 805;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.courierDescent = -250;\n /**\n * `Font type`.\n * @private\n */\n PdfStandardFontMetricsFactory.courierName = 'Courier';\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.courierBoldAscent = 801;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.courierBoldDescent = -250;\n /**\n * `Font type`.\n * @private\n */\n PdfStandardFontMetricsFactory.courierBoldName = 'Courier-Bold';\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.courierItalicAscent = 805;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.courierItalicDescent = -250;\n /**\n * `Font type`.\n * @private\n */\n PdfStandardFontMetricsFactory.courierItalicName = 'Courier-Oblique';\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.courierBoldItalicAscent = 801;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.courierBoldItalicDescent = -250;\n /**\n * `Font type`.\n * @private\n */\n PdfStandardFontMetricsFactory.courierBoldItalicName = 'Courier-BoldOblique';\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.timesAscent = 898;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.timesDescent = -218;\n /**\n * `Font type`.\n * @private\n */\n PdfStandardFontMetricsFactory.timesName = 'Times-Roman';\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.timesBoldAscent = 935;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.timesBoldDescent = -218;\n /**\n * `Font type`.\n * @private\n */\n PdfStandardFontMetricsFactory.timesBoldName = 'Times-Bold';\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.timesItalicAscent = 883;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.timesItalicDescent = -217;\n /**\n * `Font type`.\n * @private\n */\n PdfStandardFontMetricsFactory.timesItalicName = 'Times-Italic';\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.timesBoldItalicAscent = 921;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.timesBoldItalicDescent = -218;\n /**\n * `Font type`.\n * @private\n */\n PdfStandardFontMetricsFactory.timesBoldItalicName = 'Times-BoldItalic';\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.symbolAscent = 1010;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.symbolDescent = -293;\n /**\n * `Font type`.\n * @private\n */\n PdfStandardFontMetricsFactory.symbolName = 'Symbol';\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.zapfDingbatsAscent = 820;\n /**\n * `Ascender` value for the font.\n * @private\n */\n PdfStandardFontMetricsFactory.zapfDingbatsDescent = -143;\n /**\n * `Font type`.\n * @private\n */\n PdfStandardFontMetricsFactory.zapfDingbatsName = 'ZapfDingbats';\n /**\n * `Arial` widths table.\n * @private\n */\n PdfStandardFontMetricsFactory.arialWidth = [\n 278, 278, 355, 556, 556, 889, 667, 191, 333, 333, 389, 584, 278, 333,\n 278, 278, 556, 556, 556, 556, 556, 556, 556, 556, 556, 556, 278, 278, 584, 584,\n 584, 556, 1015, 667, 667, 722, 722, 667, 611, 778, 722, 278, 500, 667, 556, 833,\n 722, 778, 667, 778, 722, 667, 611, 722, 667, 944, 667, 667, 611, 278, 278, 278,\n 469, 556, 333, 556, 556, 500, 556, 556, 278, 556, 556, 222, 222, 500, 222, 833,\n 556, 556, 556, 556, 333, 500, 278, 556, 500, 722, 500, 500, 500, 334, 260, 334,\n 584, 0, 556, 0, 222, 556, 333, 1000, 556, 556, 333, 1000, 667, 333, 1000, 0,\n 611, 0, 0, 222, 222, 333, 333, 350, 556, 1000, 333, 1000, 500, 333, 944, 0,\n 500, 667, 0, 333, 556, 556, 556, 556, 260, 556, 333, 737, 370, 556, 584, 0,\n 737, 333, 400, 584, 333, 333, 333, 556, 537, 278, 333, 333, 365, 556, 834, 834,\n 834, 611, 667, 667, 667, 667, 667, 667, 1000, 722, 667, 667, 667, 667, 278, 278,\n 278, 278, 722, 722, 778, 778, 778, 778, 778, 584, 778, 722, 722, 722, 722, 667,\n 667, 611, 556, 556, 556, 556, 556, 556, 889, 500, 556, 556, 556, 556, 278, 278,\n 278, 278, 556, 556, 556, 556, 556, 556, 556, 584, 611, 556, 556, 556, 556, 500,\n 556, 500\n ];\n /**\n * `Arial bold` widths table.\n * @private\n */\n PdfStandardFontMetricsFactory.arialBoldWidth = [\n 278, 333, 474, 556, 556, 889, 722, 238, 333, 333, 389, 584, 278, 333,\n 278, 278, 556, 556, 556, 556, 556, 556, 556, 556, 556, 556, 333, 333, 584, 584,\n 584, 611, 975, 722, 722, 722, 722, 667, 611, 778, 722, 278, 556, 722, 611, 833,\n 722, 778, 667, 778, 722, 667, 611, 722, 667, 944, 667, 667, 611, 333, 278, 333,\n 584, 556, 333, 556, 611, 556, 611, 556, 333, 611, 611, 278, 278, 556, 278, 889,\n 611, 611, 611, 611, 389, 556, 333, 611, 556, 778, 556, 556, 500, 389, 280, 389,\n 584, 0, 556, 0, 278, 556, 500, 1000, 556, 556, 333, 1000, 667, 333, 1000, 0,\n 611, 0, 0, 278, 278, 500, 500, 350, 556, 1000, 333, 1000, 556, 333, 944, 0,\n 500, 667, 0, 333, 556, 556, 556, 556, 280, 556, 333, 737, 370, 556, 584, 0,\n 737, 333, 400, 584, 333, 333, 333, 611, 556, 278, 333, 333, 365, 556, 834, 834,\n 834, 611, 722, 722, 722, 722, 722, 722, 1000, 722, 667, 667, 667, 667, 278, 278,\n 278, 278, 722, 722, 778, 778, 778, 778, 778, 584, 778, 722, 722, 722, 722, 667,\n 667, 611, 556, 556, 556, 556, 556, 556, 889, 556, 556, 556, 556, 556, 278, 278,\n 278, 278, 611, 611, 611, 611, 611, 611, 611, 584, 611, 611, 611, 611, 611, 556,\n 611, 556\n ];\n /**\n * `Fixed` widths table.\n * @private\n */\n PdfStandardFontMetricsFactory.fixedWidth = [\n 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600,\n 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600,\n 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600,\n 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600,\n 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600,\n 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600,\n 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600,\n 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600,\n 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600,\n 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600,\n 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600,\n 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600,\n 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600,\n 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600, 600\n ];\n /**\n * `Times` widths table.\n * @private\n */\n PdfStandardFontMetricsFactory.timesRomanWidth = [\n 250, 333, 408, 500, 500, 833, 778, 180, 333, 333, 500, 564, 250, 333,\n 250, 278, 500, 500, 500, 500, 500, 500, 500, 500, 500, 500, 278, 278, 564, 564,\n 564, 444, 921, 722, 667, 667, 722, 611, 556, 722, 722, 333, 389, 722, 611, 889,\n 722, 722, 556, 722, 667, 556, 611, 722, 722, 944, 722, 722, 611, 333, 278, 333,\n 469, 500, 333, 444, 500, 444, 500, 444, 333, 500, 500, 278, 278, 500, 278, 778,\n 500, 500, 500, 500, 333, 389, 278, 500, 500, 722, 500, 500, 444, 480, 200, 480,\n 541, 0, 500, 0, 333, 500, 444, 1000, 500, 500, 333, 1000, 556, 333, 889, 0,\n 611, 0, 0, 333, 333, 444, 444, 350, 500, 1000, 333, 980, 389, 333, 722, 0,\n 444, 722, 0, 333, 500, 500, 500, 500, 200, 500, 333, 760, 276, 500, 564, 0,\n 760, 333, 400, 564, 300, 300, 333, 500, 453, 250, 333, 300, 310, 500, 750, 750,\n 750, 444, 722, 722, 722, 722, 722, 722, 889, 667, 611, 611, 611, 611, 333, 333,\n 333, 333, 722, 722, 722, 722, 722, 722, 722, 564, 722, 722, 722, 722, 722, 722,\n 556, 500, 444, 444, 444, 444, 444, 444, 667, 444, 444, 444, 444, 444, 278, 278,\n 278, 278, 500, 500, 500, 500, 500, 500, 500, 564, 500, 500, 500, 500, 500, 500,\n 500, 500\n ];\n /**\n * `Times bold` widths table.\n * @private\n */\n PdfStandardFontMetricsFactory.timesRomanBoldWidth = [\n 250, 333, 555, 500, 500, 1000, 833, 278, 333, 333, 500, 570, 250, 333,\n 250, 278, 500, 500, 500, 500, 500, 500, 500, 500, 500, 500, 333, 333, 570, 570,\n 570, 500, 930, 722, 667, 722, 722, 667, 611, 778, 778, 389, 500, 778, 667, 944,\n 722, 778, 611, 778, 722, 556, 667, 722, 722, 1000, 722, 722, 667, 333, 278, 333,\n 581, 500, 333, 500, 556, 444, 556, 444, 333, 500, 556, 278, 333, 556, 278, 833,\n 556, 500, 556, 556, 444, 389, 333, 556, 500, 722, 500, 500, 444, 394, 220, 394,\n 520, 0, 500, 0, 333, 500, 500, 1000, 500, 500, 333, 1000, 556, 333, 1000, 0,\n 667, 0, 0, 333, 333, 500, 500, 350, 500, 1000, 333, 1000, 389, 333, 722, 0,\n 444, 722, 0, 333, 500, 500, 500, 500, 220, 500, 333, 747, 300, 500, 570, 0,\n 747, 333, 400, 570, 300, 300, 333, 556, 540, 250, 333, 300, 330, 500, 750, 750,\n 750, 500, 722, 722, 722, 722, 722, 722, 1000, 722, 667, 667, 667, 667, 389, 389,\n 389, 389, 722, 722, 778, 778, 778, 778, 778, 570, 778, 722, 722, 722, 722, 722,\n 611, 556, 500, 500, 500, 500, 500, 500, 722, 444, 444, 444, 444, 444, 278, 278,\n 278, 278, 500, 556, 500, 500, 500, 500, 500, 570, 500, 556, 556, 556, 556, 500,\n 556, 500\n ];\n /**\n * `Times italic` widths table.\n * @private\n */\n PdfStandardFontMetricsFactory.timesRomanItalicWidth = [\n 250, 333, 420, 500, 500, 833, 778, 214, 333, 333, 500, 675, 250, 333,\n 250, 278, 500, 500, 500, 500, 500, 500, 500, 500, 500, 500, 333, 333, 675, 675,\n 675, 500, 920, 611, 611, 667, 722, 611, 611, 722, 722, 333, 444, 667, 556, 833,\n 667, 722, 611, 722, 611, 500, 556, 722, 611, 833, 611, 556, 556, 389, 278, 389,\n 422, 500, 333, 500, 500, 444, 500, 444, 278, 500, 500, 278, 278, 444, 278, 722,\n 500, 500, 500, 500, 389, 389, 278, 500, 444, 667, 444, 444, 389, 400, 275, 400,\n 541, 0, 500, 0, 333, 500, 556, 889, 500, 500, 333, 1000, 500, 333, 944, 0,\n 556, 0, 0, 333, 333, 556, 556, 350, 500, 889, 333, 980, 389, 333, 667, 0,\n 389, 556, 0, 389, 500, 500, 500, 500, 275, 500, 333, 760, 276, 500, 675, 0,\n 760, 333, 400, 675, 300, 300, 333, 500, 523, 250, 333, 300, 310, 500, 750, 750,\n 750, 500, 611, 611, 611, 611, 611, 611, 889, 667, 611, 611, 611, 611, 333, 333,\n 333, 333, 722, 667, 722, 722, 722, 722, 722, 675, 722, 722, 722, 722, 722, 556,\n 611, 500, 500, 500, 500, 500, 500, 500, 667, 444, 444, 444, 444, 444, 278, 278,\n 278, 278, 500, 500, 500, 500, 500, 500, 500, 675, 500, 500, 500, 500, 500, 444,\n 500, 444\n ];\n /**\n * `Times bold italic` widths table.\n * @private\n */\n PdfStandardFontMetricsFactory.timesRomanBoldItalicWidths = [\n 250, 389, 555, 500, 500, 833, 778, 278, 333, 333, 500, 570, 250, 333,\n 250, 278, 500, 500, 500, 500, 500, 500, 500, 500, 500, 500, 333, 333, 570, 570,\n 570, 500, 832, 667, 667, 667, 722, 667, 667, 722, 778, 389, 500, 667, 611, 889,\n 722, 722, 611, 722, 667, 556, 611, 722, 667, 889, 667, 611, 611, 333, 278, 333,\n 570, 500, 333, 500, 500, 444, 500, 444, 333, 500, 556, 278, 278, 500, 278, 778,\n 556, 500, 500, 500, 389, 389, 278, 556, 444, 667, 500, 444, 389, 348, 220, 348,\n 570, 0, 500, 0, 333, 500, 500, 1000, 500, 500, 333, 1000, 556, 333, 944, 0,\n 611, 0, 0, 333, 333, 500, 500, 350, 500, 1000, 333, 1000, 389, 333, 722, 0,\n 389, 611, 0, 389, 500, 500, 500, 500, 220, 500, 333, 747, 266, 500, 606, 0,\n 747, 333, 400, 570, 300, 300, 333, 576, 500, 250, 333, 300, 300, 500, 750, 750,\n 750, 500, 667, 667, 667, 667, 667, 667, 944, 667, 667, 667, 667, 667, 389, 389,\n 389, 389, 722, 722, 722, 722, 722, 722, 722, 570, 722, 722, 722, 722, 722, 611,\n 611, 500, 500, 500, 500, 500, 500, 500, 722, 444, 444, 444, 444, 444, 278, 278,\n 278, 278, 500, 556, 500, 500, 500, 500, 500, 570, 500, 556, 556, 556, 556, 444,\n 500, 444\n ];\n /**\n * `Symbol` widths table.\n * @private\n */\n PdfStandardFontMetricsFactory.symbolWidth = [\n 250, 333, 713, 500, 549, 833, 778, 439, 333, 333, 500, 549, 250, 549,\n 250, 278, 500, 500, 500, 500, 500, 500, 500, 500, 500, 500, 278, 278,\n 549, 549, 549, 444, 549, 722, 667, 722, 612, 611, 763, 603, 722, 333,\n 631, 722, 686, 889, 722, 722, 768, 741, 556, 592, 611, 690, 439, 768,\n 645, 795, 611, 333, 863, 333, 658, 500, 500, 631, 549, 549, 494, 439,\n 521, 411, 603, 329, 603, 549, 549, 576, 521, 549, 549, 521, 549, 603,\n 439, 576, 713, 686, 493, 686, 494, 480, 200, 480, 549, 750, 620, 247,\n 549, 167, 713, 500, 753, 753, 753, 753, 1042, 987, 603, 987, 603, 400,\n 549, 411, 549, 549, 713, 494, 460, 549, 549, 549, 549, 1000, 603, 1000,\n 658, 823, 686, 795, 987, 768, 768, 823, 768, 768, 713, 713, 713, 713,\n 713, 713, 713, 768, 713, 790, 790, 890, 823, 549, 250, 713, 603, 603,\n 1042, 987, 603, 987, 603, 494, 329, 790, 790, 786, 713, 384, 384, 384,\n 384, 384, 384, 494, 494, 494, 494, 329, 274, 686, 686, 686, 384, 384,\n 384, 384, 384, 384, 494, 494, 494, -1\n ];\n /**\n * `Zip dingbats` widths table.\n * @private\n */\n PdfStandardFontMetricsFactory.zapfDingbatsWidth = [\n 278, 974, 961, 974, 980, 719, 789, 790, 791, 690, 960, 939, 549, 855,\n 911, 933, 911, 945, 974, 755, 846, 762, 761, 571, 677, 763, 760, 759,\n 754, 494, 552, 537, 577, 692, 786, 788, 788, 790, 793, 794, 816, 823,\n 789, 841, 823, 833, 816, 831, 923, 744, 723, 749, 790, 792, 695, 776,\n 768, 792, 759, 707, 708, 682, 701, 826, 815, 789, 789, 707, 687, 696,\n 689, 786, 787, 713, 791, 785, 791, 873, 761, 762, 762, 759, 759, 892,\n 892, 788, 784, 438, 138, 277, 415, 392, 392, 668, 668, 390, 390, 317,\n 317, 276, 276, 509, 509, 410, 410, 234, 234, 334, 334, 732, 544, 544,\n 910, 667, 760, 760, 776, 595, 694, 626, 788, 788, 788, 788, 788, 788,\n 788, 788, 788, 788, 788, 788, 788, 788, 788, 788, 788, 788, 788, 788,\n 788, 788, 788, 788, 788, 788, 788, 788, 788, 788, 788, 788, 788, 788,\n 788, 788, 788, 788, 788, 788, 894, 838, 1016, 458, 748, 924, 748, 918,\n 927, 928, 928, 834, 873, 828, 924, 924, 917, 930, 931, 463, 883, 836,\n 836, 867, 867, 696, 696, 874, 874, 760, 946, 771, 865, 771, 888, 967,\n 888, 831, 873, 927, 970, 918\n ];\n return PdfStandardFontMetricsFactory;\n}());\nexport { PdfStandardFontMetricsFactory };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfFontFamily, PdfFontStyle, FontEncoding } from './enum';\nimport { PdfFont } from './pdf-font';\nimport { PdfDocument } from './../../document/pdf-document';\nimport { PdfStandardFontMetricsFactory } from './pdf-standard-font-metrics-factory';\nimport { PdfDictionary } from './../../primitives/pdf-dictionary';\nimport { DictionaryProperties } from './../../input-output/pdf-dictionary-properties';\nimport { PdfName } from './../../primitives/pdf-name';\n/**\n * Represents one of the 14 standard fonts.\n * It's used to create a standard PDF font to draw the text in to the PDF.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // add a new page to the document\n * let page1 : PdfPage = document.pages.add();\n * //\n * // create new standard font\n * let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);\n * //\n * // create black brush\n * let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n * // draw the text\n * page1.graphics.drawString('Hello World', font, blackBrush, new PointF(0, 0));\n * // save the document\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\nvar PdfStandardFont = /** @class */ (function (_super) {\n __extends(PdfStandardFont, _super);\n function PdfStandardFont(fontFamilyPrototype, size, style) {\n var _this = _super.call(this, size, style) || this;\n /**\n * Gets `ascent` of the font.\n * @private\n */\n _this.dictionaryProperties = new DictionaryProperties();\n /**\n * Gets `encodings` for internal class use.\n * @hidden\n * @private\n */\n _this.encodings = ['Unknown', 'StandardEncoding', 'MacRomanEncoding', 'MacExpertEncoding',\n 'WinAnsiEncoding', 'PDFDocEncoding', 'IdentityH'];\n if ((typeof fontFamilyPrototype === 'number') && (typeof style === 'undefined')) {\n _this.constructor(fontFamilyPrototype, size, PdfFontStyle.Regular);\n }\n else if ((typeof fontFamilyPrototype === 'number') && (typeof style !== 'undefined')) {\n _this = _super.call(this, size, style) || this;\n _this.pdfFontFamily = fontFamilyPrototype;\n _this.checkStyle();\n _this.initializeInternals();\n }\n else if ((fontFamilyPrototype instanceof PdfStandardFont) && (typeof style === 'undefined')) {\n _this.constructor(fontFamilyPrototype.fontFamily, size, fontFamilyPrototype.style);\n }\n else if ((fontFamilyPrototype instanceof PdfStandardFont) && (typeof style !== 'undefined')) {\n _this.constructor(fontFamilyPrototype.fontFamily, size, style);\n }\n return _this;\n }\n Object.defineProperty(PdfStandardFont.prototype, \"fontFamily\", {\n //Properties\n /**\n * Gets the `FontFamily`.\n * @private\n */\n get: function () {\n return this.pdfFontFamily;\n },\n enumerable: true,\n configurable: true\n });\n //methods\n /**\n * Checks font `style` of the font.\n * @private\n */\n PdfStandardFont.prototype.checkStyle = function () {\n if (this.fontFamily === PdfFontFamily.Symbol || this.fontFamily === PdfFontFamily.ZapfDingbats) {\n var style = this.style;\n style &= ~(PdfFontStyle.Bold | PdfFontStyle.Italic);\n this.setStyle(style);\n }\n };\n /**\n * Returns `width` of the line.\n * @public\n */\n PdfStandardFont.prototype.getLineWidth = function (line, format) {\n if (line == null) {\n throw new Error('ArgumentNullException:line');\n }\n var width = 0;\n var name = this.name;\n line = PdfStandardFont.convert(line);\n for (var i = 0, len = line.length; i < len; i++) {\n var ch = line[i];\n var charWidth = this.getCharWidthInternal(ch, format);\n width += charWidth;\n }\n var size = this.metrics.getSize(format);\n width *= (PdfFont.charSizeMultiplier * size);\n width = this.applyFormatSettings(line, format, width);\n return width;\n };\n /**\n * Checks whether fonts are `equals`.\n * @private\n */\n PdfStandardFont.prototype.equalsToFont = function (font) {\n var equal = false;\n var stFont = font;\n if (stFont != null) {\n var fontFamilyEqual = (this.fontFamily === stFont.fontFamily);\n var lineReducer = (~(PdfFontStyle.Underline | PdfFontStyle.Strikeout));\n var styleEqual = (this.style & lineReducer) === (stFont.style & lineReducer);\n equal = (fontFamilyEqual && styleEqual);\n }\n return equal;\n };\n /**\n * `Initializes` font internals..\n * @private\n */\n PdfStandardFont.prototype.initializeInternals = function () {\n var equalFont = null;\n // if (PdfDocument.EnableCache) {\n equalFont = PdfDocument.cache.search(this);\n // }\n var internals = null;\n // if (equalFont == null) {\n // Create font metrics.\n var metrics = PdfStandardFontMetricsFactory.getMetrics(this.pdfFontFamily, this.style, this.size);\n this.metrics = metrics;\n internals = this.createInternals();\n this.setInternals(internals);\n };\n /**\n * `Creates` font`s dictionary.\n * @private\n */\n PdfStandardFont.prototype.createInternals = function () {\n var dictionary = new PdfDictionary();\n dictionary.items.setValue(this.dictionaryProperties.type, new PdfName(this.dictionaryProperties.font));\n dictionary.items.setValue(this.dictionaryProperties.subtype, new PdfName(this.dictionaryProperties.type1));\n dictionary.items.setValue(this.dictionaryProperties.baseFont, new PdfName(this.metrics.postScriptName));\n if (this.fontFamily !== PdfFontFamily.Symbol && this.fontFamily !== PdfFontFamily.ZapfDingbats) {\n var encoding = this.encodings[FontEncoding.WinAnsiEncoding];\n dictionary.items.setValue(this.dictionaryProperties.encoding, new PdfName(encoding));\n }\n return dictionary;\n };\n /**\n * Returns `width` of the char. This methods doesn`t takes into consideration font`s size.\n * @private\n */\n PdfStandardFont.prototype.getCharWidthInternal = function (charCode, format) {\n var width = 0;\n var code = 0;\n code = charCode.charCodeAt(0);\n if (this.name === '0' || this.name === '1' || this.name === '2' ||\n this.name === '3' || this.name === '4') {\n code = code - PdfStandardFont.charOffset;\n }\n code = (code >= 0 && code !== 128) ? code : 0;\n var metrics = this.metrics;\n var widthTable = metrics.widthTable;\n width = widthTable.items(code);\n return width;\n };\n /**\n * `Converts` the specified text.\n * @private\n */\n PdfStandardFont.convert = function (text) {\n return text;\n };\n //Constants\n /**\n * First character `position`.\n * @private\n */\n PdfStandardFont.charOffset = 32;\n return PdfStandardFont;\n}(PdfFont));\nexport { PdfStandardFont };\n","import { PdfColor } from './../graphics/pdf-color';\nimport { RectangleF, PointF } from './../drawing/pdf-drawing';\nimport { PdfDictionary, SaveAnnotationEventHandler } from './../primitives/pdf-dictionary';\nimport { PdfArray } from './../primitives/pdf-array';\nimport { PdfNumber } from './../primitives/pdf-number';\nimport { PdfReferenceHolder } from './../primitives/pdf-reference';\nimport { PdfString } from './../primitives/pdf-string';\nimport { DictionaryProperties } from './../input-output/pdf-dictionary-properties';\nimport { PdfName } from './../primitives/pdf-name';\nimport { PdfSolidBrush } from './../graphics/brushes/pdf-solid-brush';\nimport { PdfStandardFont } from './../graphics/fonts/pdf-standard-font';\nimport { PdfFontFamily } from './../graphics/fonts/enum';\nimport { PdfStringFormat } from './../graphics/fonts/pdf-string-format';\nimport { PdfTextAlignment } from './../graphics/enum';\n/**\n * `PdfAnnotation` class represents the base class for annotation objects.\n * @private\n */\nvar PdfAnnotation = /** @class */ (function () {\n function PdfAnnotation(arg1) {\n // Fields\n /**\n * Specifies the Internal variable to store fields of `PdfDictionaryProperties`.\n * @private\n */\n this.dictionaryProperties = new DictionaryProperties();\n /**\n * `Color` of the annotation\n * @private\n */\n this.pdfColor = new PdfColor(255, 255, 255);\n /**\n * `Bounds` of the annotation.\n * @private\n */\n this.rectangle = new RectangleF(0, 0, 0, 0);\n /**\n * Parent `page` of the annotation.\n * @private\n */\n this.pdfPage = null;\n /**\n * `Brush of the text` of the annotation.\n * @default new PdfSolidBrush(new PdfColor(0, 0, 0))\n * @private\n */\n this.textBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n /**\n * `Font of the text` of the annotation.\n * @default new PdfStandardFont(PdfFontFamily.TimesRoman, 10)\n * @private\n */\n this.textFont = new PdfStandardFont(PdfFontFamily.TimesRoman, 10);\n /**\n * `StringFormat of the text` of the annotation.\n * @default new PdfStringFormat(PdfTextAlignment.Left)\n * @private\n */\n this.format = new PdfStringFormat(PdfTextAlignment.Left);\n /**\n * `Text` of the annotation.\n * @private\n */\n this.content = '';\n /**\n * Internal variable to store `dictionary`.\n * @private\n */\n this.pdfDictionary = new PdfDictionary();\n /**\n * To specifying the `Inner color` with which to fill the annotation\n * @private\n */\n this.internalColor = new PdfColor();\n /**\n * `opacity or darkness` of the annotation.\n * @private\n * @default 1.0\n */\n this.darkness = 1.0;\n if (typeof arg1 === 'undefined') {\n this.initialize();\n }\n else {\n this.initialize();\n this.bounds = arg1;\n }\n }\n Object.defineProperty(PdfAnnotation.prototype, \"color\", {\n // Properties\n /**\n * `Color` of the annotation\n * @private\n */\n get: function () {\n return this.pdfColor;\n },\n set: function (value) {\n this.pdfColor = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAnnotation.prototype, \"innerColor\", {\n /**\n * To specifying the `Inner color` with which to fill the annotation\n * @private\n */\n get: function () {\n return this.internalColor;\n },\n set: function (value) {\n this.internalColor = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAnnotation.prototype, \"bounds\", {\n /**\n * `bounds` of the annotation.\n * @private\n */\n get: function () {\n return this.rectangle;\n },\n set: function (value) {\n this.rectangle = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAnnotation.prototype, \"page\", {\n /**\n * Parent `page` of the annotation.\n * @private\n */\n get: function () {\n return this.pdfPage;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAnnotation.prototype, \"font\", {\n /**\n * To specifying the `Font of the text` in the annotation.\n * @private\n */\n get: function () {\n return this.textFont;\n },\n set: function (value) {\n this.textFont = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAnnotation.prototype, \"stringFormat\", {\n /**\n * To specifying the `StringFormat of the text` in the annotation.\n * @private\n */\n get: function () {\n return this.format;\n },\n set: function (value) {\n this.format = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAnnotation.prototype, \"brush\", {\n /**\n * To specifying the `Brush of the text` in the annotation.\n * @private\n */\n get: function () {\n return this.textBrush;\n },\n set: function (value) {\n this.textBrush = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAnnotation.prototype, \"text\", {\n /**\n * `Text` of the annotation.\n * @private\n */\n get: function () {\n return this.content;\n },\n set: function (value) {\n this.content = value;\n this.dictionary.items.setValue(this.dictionaryProperties.contents, new PdfString(this.content));\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfAnnotation.prototype, \"dictionary\", {\n /**\n * Internal variable to store `dictionary`.\n * @hidden\n */\n get: function () {\n return this.pdfDictionary;\n },\n set: function (value) {\n this.pdfDictionary = value;\n },\n enumerable: true,\n configurable: true\n });\n // Implementation\n /**\n * `Initialize` the annotation event handler and specifies the type of the annotation.\n * @private\n */\n PdfAnnotation.prototype.initialize = function () {\n this.pdfDictionary.annotationBeginSave = new SaveAnnotationEventHandler(this);\n this.pdfDictionary.items.setValue(this.dictionaryProperties.type, new PdfName(this.dictionaryProperties.annot));\n };\n /**\n * Sets related `page` of the annotation.\n * @private\n */\n PdfAnnotation.prototype.setPage = function (page) {\n this.pdfPage = page;\n this.pdfDictionary.items.setValue(this.dictionaryProperties.p, new PdfReferenceHolder(this.pdfPage));\n };\n /**\n * Handles the `BeginSave` event of the Dictionary.\n * @private\n */\n PdfAnnotation.prototype.beginSave = function () {\n this.save();\n };\n /**\n * `Saves` an annotation.\n * @private\n */\n /* tslint:disable */\n PdfAnnotation.prototype.save = function () {\n var nativeRectangle = new RectangleF(this.rectangle.x, this.rectangle.y, this.rectangle.width, this.rectangle.height);\n var section = this.pdfPage.section;\n var initialHeight = nativeRectangle.height;\n var tempLoacation = section.pointToNativePdf(this.page, new PointF(nativeRectangle.x, nativeRectangle.y));\n nativeRectangle.x = tempLoacation.x;\n nativeRectangle.width = tempLoacation.x + nativeRectangle.width;\n nativeRectangle.y = (tempLoacation.y - this.page.document.pageSettings.margins.top);\n nativeRectangle.height = nativeRectangle.y - initialHeight;\n this.pdfDictionary.items.setValue(this.dictionaryProperties.rect, PdfArray.fromRectangle(nativeRectangle));\n this.dictionary.items.setValue(this.dictionaryProperties.ca, new PdfNumber(this.darkness));\n };\n Object.defineProperty(PdfAnnotation.prototype, \"element\", {\n /* tslint:enable */\n // IPdfWrapper Members\n /**\n * Gets the `element`.\n * @private\n */\n get: function () {\n return this.pdfDictionary;\n },\n enumerable: true,\n configurable: true\n });\n return PdfAnnotation;\n}());\nexport { PdfAnnotation };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfAnnotation } from './annotation';\nimport { PdfName } from './../primitives/pdf-name';\n/**\n * `PdfLinkAnnotation` class represents the ink annotation class.\n * @private\n */\nvar PdfLinkAnnotation = /** @class */ (function (_super) {\n __extends(PdfLinkAnnotation, _super);\n function PdfLinkAnnotation(rectangle) {\n var _this = this;\n if (typeof rectangle === 'undefined') {\n _this = _super.call(this) || this;\n }\n else {\n _this = _super.call(this, rectangle) || this;\n }\n return _this;\n }\n // Implementation\n /**\n * `Initializes` annotation object.\n * @private\n */\n PdfLinkAnnotation.prototype.initialize = function () {\n _super.prototype.initialize.call(this);\n this.dictionary.items.setValue(this.dictionaryProperties.subtype, new PdfName(this.dictionaryProperties.link));\n };\n return PdfLinkAnnotation;\n}(PdfAnnotation));\nexport { PdfLinkAnnotation };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfLinkAnnotation } from './link-annotation';\n/**\n * Represents base class for `link annotations` with associated action.\n * @private\n */\nvar PdfActionLinkAnnotation = /** @class */ (function (_super) {\n __extends(PdfActionLinkAnnotation, _super);\n // Constructors\n /**\n * Specifies the constructor for `ActionLinkAnnotation`.\n * @private\n */\n function PdfActionLinkAnnotation(rectangle) {\n var _this = _super.call(this, rectangle) || this;\n // Fields\n /**\n * Internal variable to store annotation's `action`.\n * @default null\n * @private\n */\n _this.pdfAction = null;\n return _this;\n }\n //Public method\n /**\n * get and set the `action`.\n * @hidden\n */\n PdfActionLinkAnnotation.prototype.getSetAction = function (value) {\n if (typeof value === 'undefined') {\n return this.pdfAction;\n }\n else {\n this.pdfAction = value;\n }\n };\n return PdfActionLinkAnnotation;\n}(PdfLinkAnnotation));\nexport { PdfActionLinkAnnotation };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfLinkAnnotation } from './link-annotation';\n/**\n * `PdfDocumentLinkAnnotation` class represents an annotation object with holds link on another location within a document.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // create new pages\n * let page1 : PdfPage = document.pages.add();\n * let page2 : PdfPage = document.pages.add();\n * // create a new rectangle\n * let bounds : RectangleF = new RectangleF({x : 10, y : 200}, {width : 300, height : 25});\n * //\n * // create a new document link annotation\n * let documentLinkAnnotation : PdfDocumentLinkAnnotation = new PdfDocumentLinkAnnotation(bounds);\n * // set the annotation text\n * documentLinkAnnotation.text = 'Document link annotation';\n * // set the destination\n * documentLinkAnnotation.destination = new PdfDestination(page2);\n * // set the documentlink annotation location\n * documentLinkAnnotation.destination.location = new PointF(10, 0);\n * // add this annotation to a new page\n * page1.annotations.add(documentLinkAnnotation);\n * //\n * // save the document to disk\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\nvar PdfDocumentLinkAnnotation = /** @class */ (function (_super) {\n __extends(PdfDocumentLinkAnnotation, _super);\n function PdfDocumentLinkAnnotation(rectangle, destination) {\n var _this = _super.call(this, rectangle) || this;\n // Fields\n /**\n * `Destination` of the annotation.\n * @default null\n * @private\n */\n _this.pdfDestination = null;\n if (typeof destination !== 'undefined') {\n _this.destination = destination;\n }\n return _this;\n }\n Object.defineProperty(PdfDocumentLinkAnnotation.prototype, \"destination\", {\n // Properties\n /**\n * Gets or sets the `destination` of the annotation.\n * ```typescript\n * // create a new PDF document\n * let document : PdfDocument = new PdfDocument();\n * // create new pages\n * let page1 : PdfPage = document.pages.add();\n * let page2 : PdfPage = document.pages.add();\n * // create a new rectangle\n * let bounds : RectangleF = new RectangleF({x : 10, y : 200}, {width : 300, height : 25});\n * //\n * // create a new document link annotation\n * let documentLinkAnnotation : PdfDocumentLinkAnnotation = new PdfDocumentLinkAnnotation(bounds);\n * // set the annotation text\n * documentLinkAnnotation.text = 'Document link annotation';\n * // set the destination\n * documentLinkAnnotation.destination = new PdfDestination(page2);\n * // set the documentlink annotation location\n * documentLinkAnnotation.destination.location = new PointF(10, 0);\n * // add this annotation to a new page\n * page1.annotations.add(documentLinkAnnotation);\n * //\n * // save the document to disk\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n * @default null\n */\n get: function () {\n return this.pdfDestination;\n },\n set: function (value) {\n // if (this.pdfDestination !== value) {\n this.pdfDestination = value;\n // }\n },\n enumerable: true,\n configurable: true\n });\n // Implementation\n /**\n * `Saves` annotation object.\n * @private\n */\n PdfDocumentLinkAnnotation.prototype.save = function () {\n _super.prototype.save.call(this);\n if (this.pdfDestination != null) {\n this.dictionary.items.setValue(this.dictionaryProperties.dest, this.pdfDestination.element);\n }\n };\n /**\n * `Clone` the document link annotation.\n * @private\n */\n PdfDocumentLinkAnnotation.prototype.clone = function () {\n var annot = new PdfDocumentLinkAnnotation(this.bounds, this.destination);\n annot.color = this.color;\n annot.brush = this.brush;\n annot.destination = this.destination;\n annot.font = this.font;\n return annot;\n };\n return PdfDocumentLinkAnnotation;\n}(PdfLinkAnnotation));\nexport { PdfDocumentLinkAnnotation };\n","/**\n * ElementLayouter.ts class for EJ2-PDF\n */\nimport { RectangleF } from './../../../drawing/pdf-drawing';\n/**\n * Base class for `elements lay outing`.\n * @private\n */\nvar ElementLayouter = /** @class */ (function () {\n // Constructor\n /**\n * Initializes a new instance of the `ElementLayouter` class.\n * @private\n */\n function ElementLayouter(element) {\n this.layoutElement = element;\n }\n Object.defineProperty(ElementLayouter.prototype, \"elements\", {\n // Properties\n /**\n * Gets the `element`.\n * @private\n */\n get: function () {\n return this.layoutElement;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * Gets the `element`.\n * @private\n */\n ElementLayouter.prototype.getElement = function () {\n return this.layoutElement;\n };\n // Implementation\n /**\n * `Layouts` the element.\n * @private\n */\n ElementLayouter.prototype.layout = function (param) {\n return this.layoutInternal(param);\n };\n ElementLayouter.prototype.Layouter = function (param) {\n return this.layoutInternal(param);\n };\n /**\n * Returns the `next page`.\n * @private\n */\n ElementLayouter.prototype.getNextPage = function (currentPage) {\n var section = currentPage.section;\n var nextPage = section.add();\n return nextPage;\n };\n return ElementLayouter;\n}());\nexport { ElementLayouter };\nvar PdfLayoutFormat = /** @class */ (function () {\n function PdfLayoutFormat(baseFormat) {\n if (typeof baseFormat === 'undefined') {\n //\n }\n else {\n this.break = baseFormat.break;\n this.layout = baseFormat.layout;\n this.paginateBounds = baseFormat.paginateBounds;\n this.boundsSet = baseFormat.usePaginateBounds;\n }\n }\n Object.defineProperty(PdfLayoutFormat.prototype, \"layout\", {\n // Properties\n /**\n * Gets or sets `layout` type of the element.\n * @private\n */\n get: function () {\n // if (typeof this.layoutType === 'undefined' || this.layoutType == null) {\n // this.layoutType = PdfLayoutType.Paginate;\n // }\n return this.layoutType;\n },\n set: function (value) {\n this.layoutType = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfLayoutFormat.prototype, \"break\", {\n /**\n * Gets or sets `break` type of the element.\n * @private\n */\n get: function () {\n // if (typeof this.breakType === 'undefined' || this.boundsSet == null) {\n // this.breakType = PdfLayoutBreakType.FitPage;\n // }\n return this.breakType;\n },\n set: function (value) {\n this.breakType = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfLayoutFormat.prototype, \"paginateBounds\", {\n /**\n * Gets or sets the `bounds` on the next page.\n * @private\n */\n get: function () {\n if (typeof this.layoutPaginateBounds === 'undefined' && this.layoutPaginateBounds == null) {\n this.layoutPaginateBounds = new RectangleF(0, 0, 0, 0);\n }\n return this.layoutPaginateBounds;\n },\n set: function (value) {\n this.layoutPaginateBounds = value;\n this.boundsSet = true;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfLayoutFormat.prototype, \"usePaginateBounds\", {\n /**\n * Gets a value indicating whether [`use paginate bounds`].\n * @private\n */\n get: function () {\n // if (typeof this.boundsSet === 'undefined' || this.boundsSet == null) {\n // this.boundsSet = false;\n // }\n return this.boundsSet;\n },\n enumerable: true,\n configurable: true\n });\n return PdfLayoutFormat;\n}());\nexport { PdfLayoutFormat };\nvar PdfLayoutParams = /** @class */ (function () {\n function PdfLayoutParams() {\n }\n Object.defineProperty(PdfLayoutParams.prototype, \"page\", {\n // Properties\n /**\n * Gets or sets the layout `page` for the element.\n * @private\n */\n get: function () {\n return this.pdfPage;\n },\n set: function (value) {\n this.pdfPage = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfLayoutParams.prototype, \"bounds\", {\n /**\n * Gets or sets layout `bounds` for the element.\n * @private\n */\n get: function () {\n return new RectangleF(this.layoutBounds.x, this.layoutBounds.y, this.layoutBounds.width, this.layoutBounds.height);\n },\n set: function (value) {\n this.layoutBounds = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfLayoutParams.prototype, \"format\", {\n /**\n * Gets or sets `layout settings` for the element.\n * @private\n */\n get: function () {\n return this.layoutFormat;\n },\n set: function (value) {\n this.layoutFormat = value;\n },\n enumerable: true,\n configurable: true\n });\n return PdfLayoutParams;\n}());\nexport { PdfLayoutParams };\nvar PdfLayoutResult = /** @class */ (function () {\n // Constructors\n /**\n * Initializes the new instance of `PdfLayoutResult` class.\n * @private\n */\n function PdfLayoutResult(page, bounds) {\n this.pdfPage = page;\n this.layoutBounds = bounds;\n }\n Object.defineProperty(PdfLayoutResult.prototype, \"page\", {\n // Properties\n /**\n * Gets the last `page` where the element was drawn.\n * @private\n */\n get: function () {\n return this.pdfPage;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfLayoutResult.prototype, \"bounds\", {\n /**\n * Gets the `bounds` of the element on the last page where it was drawn.\n * @private\n */\n get: function () {\n return this.layoutBounds;\n },\n enumerable: true,\n configurable: true\n });\n return PdfLayoutResult;\n}());\nexport { PdfLayoutResult };\n","import { RectangleF, PointF } from './../../drawing/pdf-drawing';\nimport { PdfLayoutParams, PdfLayoutFormat } from './base/element-layouter';\n/**\n * `PdfLayoutElement` class represents the base class for all elements that can be layout on the pages.\n * @private\n */\nvar PdfLayoutElement = /** @class */ (function () {\n function PdfLayoutElement() {\n }\n Object.defineProperty(PdfLayoutElement.prototype, \"raiseBeginPageLayout\", {\n // Property\n /**\n * Gets a value indicating whether the `start page layout event` should be raised.\n * @private\n */\n get: function () {\n return (typeof this.beginPageLayout !== 'undefined');\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfLayoutElement.prototype, \"raiseEndPageLayout\", {\n /**\n * Gets a value indicating whether the `ending page layout event` should be raised.\n * @private\n */\n get: function () {\n return (typeof this.endPageLayout !== 'undefined');\n },\n enumerable: true,\n configurable: true\n });\n //Event Handlers\n PdfLayoutElement.prototype.onBeginPageLayout = function (args) {\n if (this.beginPageLayout) {\n this.beginPageLayout(this, args);\n }\n };\n PdfLayoutElement.prototype.onEndPageLayout = function (args) {\n if (this.endPageLayout) {\n this.endPageLayout(this, args);\n }\n };\n PdfLayoutElement.prototype.drawHelper = function (arg2, arg3, arg4, arg5) {\n if (arg3 instanceof PointF && typeof arg3.width === 'undefined' && typeof arg4 === 'undefined') {\n return this.drawHelper(arg2, arg3.x, arg3.y);\n }\n else if (typeof arg3 === 'number' && typeof arg4 === 'number' && typeof arg5 === 'undefined') {\n return this.drawHelper(arg2, arg3, arg4, null);\n }\n else if (arg3 instanceof RectangleF && typeof arg3.width !== 'undefined' && typeof arg4 === 'undefined') {\n return this.drawHelper(arg2, arg3, null);\n }\n else if (arg3 instanceof PointF && typeof arg3.width === 'undefined' && arg4 instanceof PdfLayoutFormat) {\n return this.drawHelper(arg2, arg3.x, arg3.y, arg4);\n }\n else if (typeof arg3 === 'number' && typeof arg4 === 'number' && (arg5 instanceof PdfLayoutFormat || arg5 == null)) {\n var width = (arg2.graphics.clientSize.width - arg3);\n var layoutRectangle = new RectangleF(arg3, arg4, width, 0);\n return this.drawHelper(arg2, layoutRectangle, arg5);\n }\n else if (arg3 instanceof RectangleF && typeof arg3.width !== 'undefined' && typeof arg4 === 'boolean') {\n this.bEmbedFonts = arg4;\n return this.drawHelper(arg2, arg3, null);\n }\n else {\n var param = new PdfLayoutParams();\n var temparg3 = arg3;\n var temparg4 = arg4;\n param.page = arg2;\n param.bounds = temparg3;\n param.format = (temparg4 != null) ? temparg4 : new PdfLayoutFormat();\n var result = this.layout(param);\n return result;\n }\n };\n return PdfLayoutElement;\n}());\nexport { PdfLayoutElement };\n","/**\n * public Enum for `PdfLayoutType`.\n * @private\n */\nexport var PdfLayoutType;\n(function (PdfLayoutType) {\n /**\n * Specifies the type of `Paginate`.\n * @private\n */\n PdfLayoutType[PdfLayoutType[\"Paginate\"] = 0] = \"Paginate\";\n /**\n * Specifies the type of `OnePage`.\n * @private\n */\n PdfLayoutType[PdfLayoutType[\"OnePage\"] = 1] = \"OnePage\";\n})(PdfLayoutType || (PdfLayoutType = {}));\n/**\n * public Enum for `PdfLayoutBreakType`.\n * @private\n */\nexport var PdfLayoutBreakType;\n(function (PdfLayoutBreakType) {\n /**\n * Specifies the type of `FitPage`.\n * @private\n */\n PdfLayoutBreakType[PdfLayoutBreakType[\"FitPage\"] = 0] = \"FitPage\";\n /**\n * Specifies the type of `FitElement`.\n * @private\n */\n PdfLayoutBreakType[PdfLayoutBreakType[\"FitElement\"] = 1] = \"FitElement\";\n /**\n * Specifies the type of `FitColumnsToPage`.\n * @private\n */\n PdfLayoutBreakType[PdfLayoutBreakType[\"FitColumnsToPage\"] = 2] = \"FitColumnsToPage\";\n})(PdfLayoutBreakType || (PdfLayoutBreakType = {}));\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * TextLayouter.ts class for EJ2-PDF\n */\nimport { ElementLayouter, PdfLayoutResult } from './element-layouter';\nimport { RectangleF, SizeF } from './../../../drawing/pdf-drawing';\nimport { PdfStringLayouter } from './../../fonts/string-layouter';\nimport { PdfLayoutBreakType } from './../../figures/enum';\nimport { PdfColor } from './../../pdf-color';\nimport { PdfTextWebLink } from './../../../annotations/pdf-text-web-link';\n/**\n * Class that `layouts the text`.\n * @private\n */\nvar TextLayouter = /** @class */ (function (_super) {\n __extends(TextLayouter, _super);\n // Constructors\n /**\n * Initializes a new instance of the `TextLayouter` class.\n * @private\n */\n function TextLayouter(element) {\n return _super.call(this, element) || this;\n }\n Object.defineProperty(TextLayouter.prototype, \"element\", {\n /**\n * Gets the layout `element`.\n * @private\n */\n get: function () {\n return _super.prototype.getElement.call(this);\n },\n enumerable: true,\n configurable: true\n });\n // Implementation\n /**\n * `Layouts` the element.\n * @private\n */\n TextLayouter.prototype.layoutInternal = function (param) {\n /* tslint:disable */\n this.format = (this.element.stringFormat !== null && typeof this.element.stringFormat !== 'undefined') ? this.element.stringFormat : null;\n var currentPage = param.page;\n var currentBounds = param.bounds;\n var text = this.element.value;\n var result = null;\n var pageResult = new TextPageLayoutResult();\n pageResult.page = currentPage;\n pageResult.remainder = text;\n for (;;) {\n pageResult = this.layoutOnPage(text, currentPage, currentBounds, param);\n result = this.getLayoutResult(pageResult);\n break;\n }\n /* tslint:enable */\n return result;\n };\n /**\n * Raises `PageLayout` event if needed.\n * @private\n */\n TextLayouter.prototype.getLayoutResult = function (pageResult) {\n var result = new PdfTextLayoutResult(pageResult.page, pageResult.bounds, pageResult.remainder, pageResult.lastLineBounds);\n return result;\n };\n /* tslint:disable */\n /**\n * `Layouts` the text on the page.\n * @private\n */\n TextLayouter.prototype.layoutOnPage = function (text, currentPage, currentBounds, param) {\n var result = new TextPageLayoutResult();\n result.remainder = text;\n result.page = currentPage;\n currentBounds = this.checkCorrectBounds(currentPage, currentBounds);\n var layouter = new PdfStringLayouter();\n var stringResult = layouter.layout(text, this.element.font, this.format, currentBounds, currentPage.getClientSize().height, false, new SizeF(0, 0));\n var textFinished = (stringResult.remainder == null);\n var doesntFit = (param.format.break === PdfLayoutBreakType.FitElement);\n var canDraw = !(doesntFit || stringResult.empty);\n // Draw the text.\n var graphics = currentPage.graphics;\n var brush = this.element.getBrush();\n if (this.element instanceof PdfTextWebLink) {\n brush.color = new PdfColor(0, 0, 255);\n }\n graphics.drawStringLayoutResult(stringResult, this.element.font, this.element.pen, brush, currentBounds, this.format);\n var lineInfo = stringResult.lines[stringResult.lineCount - 1];\n result.lastLineBounds = graphics.getLineBounds(stringResult.lineCount - 1, stringResult, this.element.font, currentBounds, this.format);\n result.bounds = this.getTextPageBounds(currentPage, currentBounds, stringResult);\n result.remainder = stringResult.remainder;\n result.end = (textFinished);\n return result;\n };\n /* tslint:enable */\n /**\n * `Corrects current bounds` on the page.\n * @private\n */\n TextLayouter.prototype.checkCorrectBounds = function (currentPage, currentBounds) {\n var pageSize = currentPage.graphics.clientSize;\n currentBounds.height = (currentBounds.height > 0) ? currentBounds.height : pageSize.height - currentBounds.y;\n return currentBounds;\n };\n /**\n * Returns a `rectangle` where the text was printed on the page.\n * @private\n */\n /* tslint:disable */\n TextLayouter.prototype.getTextPageBounds = function (currentPage, currentBounds, stringResult) {\n var textSize = stringResult.actualSize;\n var x = currentBounds.x;\n var y = currentBounds.y;\n var width = (currentBounds.width > 0) ? currentBounds.width : textSize.width;\n var height = textSize.height;\n var shiftedRect = currentPage.graphics.checkCorrectLayoutRectangle(textSize, currentBounds.x, currentBounds.y, this.format);\n // if (currentBounds.width <= 0) {\n x = shiftedRect.x;\n // }\n var verticalShift = currentPage.graphics.getTextVerticalAlignShift(textSize.height, currentBounds.height, this.format);\n y += verticalShift;\n var bounds = new RectangleF(x, y, width, height);\n return bounds;\n };\n return TextLayouter;\n}(ElementLayouter));\nexport { TextLayouter };\nvar TextPageLayoutResult = /** @class */ (function () {\n function TextPageLayoutResult() {\n }\n return TextPageLayoutResult;\n}());\nexport { TextPageLayoutResult };\nvar PdfTextLayoutResult = /** @class */ (function (_super) {\n __extends(PdfTextLayoutResult, _super);\n // Constructors\n /**\n * Initializes the new instance of `PdfTextLayoutResult` class.\n * @private\n */\n function PdfTextLayoutResult(page, bounds, remainder, lastLineBounds) {\n var _this = _super.call(this, page, bounds) || this;\n _this.remainderText = remainder;\n _this.lastLineTextBounds = lastLineBounds;\n return _this;\n }\n Object.defineProperty(PdfTextLayoutResult.prototype, \"remainder\", {\n // Properties\n /**\n * Gets a value that contains the `text` that was not printed.\n * @private\n */\n get: function () {\n return this.remainderText;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfTextLayoutResult.prototype, \"lastLineBounds\", {\n /**\n * Gets a value that indicates the `bounds` of the last line that was printed on the page.\n * @private\n */\n get: function () {\n return this.lastLineTextBounds;\n },\n enumerable: true,\n configurable: true\n });\n return PdfTextLayoutResult;\n}(PdfLayoutResult));\nexport { PdfTextLayoutResult };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * PdfTextElement.ts class for EJ2-PDF\n */\nimport { PdfLayoutElement } from './../figures/layout-element';\nimport { PdfBrush } from './../brushes/pdf-brush';\nimport { PdfFont } from './../fonts/pdf-font';\nimport { PdfStandardFont } from './../fonts/pdf-standard-font';\nimport { PdfPen } from './../pdf-pen';\nimport { PdfLayoutParams } from './../figures/base/element-layouter';\nimport { TextLayouter } from './base/text-layouter';\nimport { PdfSolidBrush } from './../brushes/pdf-solid-brush';\nimport { PdfColor } from './../pdf-color';\nimport { RectangleF, SizeF, PointF } from './../../drawing/pdf-drawing';\nimport { PdfLayoutFormat } from './base/element-layouter';\nimport { PdfStringLayouter } from './../fonts/string-layouter';\nimport { PdfTextAlignment } from './../enum';\n/**\n * `PdfTextElement` class represents the text area with the ability to span several pages\n * and inherited from the 'PdfLayoutElement' class.\n * @private\n */\nvar PdfTextElement = /** @class */ (function (_super) {\n __extends(PdfTextElement, _super);\n function PdfTextElement(arg1, arg2, arg3, arg4, arg5) {\n var _this = _super.call(this) || this;\n // Fields\n /**\n * `Text` data.\n * @private\n */\n _this.content = '';\n /**\n * `Value` of text data.\n * @private\n */\n _this.elementValue = '';\n /**\n * indicate whether the drawText with PointF overload is called or not.\n * @default false\n * @private\n */\n _this.hasPointOverload = false;\n /**\n * indicate whether the PdfGridCell value is `PdfTextElement`\n * @default false\n * @private\n */\n _this.isPdfTextElement = false;\n if (typeof arg1 === 'undefined') {\n //\n }\n else if (typeof arg1 === 'string' && typeof arg2 === 'undefined') {\n _this = _super.call(this) || this;\n _this.content = arg1;\n _this.elementValue = arg1;\n }\n else if (typeof arg1 === 'string' && arg2 instanceof PdfFont && typeof arg3 === 'undefined') {\n _this = _super.call(this) || this;\n _this.content = arg1;\n _this.elementValue = arg1;\n _this.pdfFont = arg2;\n }\n else if (typeof arg1 === 'string' && arg2 instanceof PdfFont && arg3 instanceof PdfPen && typeof arg4 === 'undefined') {\n _this = _super.call(this) || this;\n _this.content = arg1;\n _this.elementValue = arg1;\n _this.pdfFont = arg2;\n _this.pdfPen = arg3;\n }\n else if (typeof arg1 === 'string' && arg2 instanceof PdfFont && arg3 instanceof PdfBrush && typeof arg4 === 'undefined') {\n _this = _super.call(this) || this;\n _this.content = arg1;\n _this.elementValue = arg1;\n _this.pdfFont = arg2;\n _this.pdfBrush = arg3;\n }\n else {\n _this = _super.call(this) || this;\n _this.content = arg1;\n _this.elementValue = arg1;\n _this.pdfFont = arg2;\n _this.pdfPen = arg3;\n _this.pdfBrush = arg4;\n _this.format = arg5;\n }\n return _this;\n }\n Object.defineProperty(PdfTextElement.prototype, \"text\", {\n // Properties\n /**\n * Gets or sets a value indicating the `text` that should be printed.\n * ```typescript\n * // create a new PDF document.\n * let document : PdfDocument = new PdfDocument();\n * // add a page to the document.\n * let page1 : PdfPage = document.pages.add();\n * // create the font\n * let font : PdfFont = new PdfStandardFont(PdfFontFamily.Helvetica, 12);\n * // create the Text Web Link\n * let textLink : PdfTextWebLink = new PdfTextWebLink();\n * // set the hyperlink\n * textLink.url = 'http://www.google.com';\n * //\n * // set the link text\n * textLink.text = 'Google';\n * //\n * // set the font\n * textLink.font = font;\n * // draw the hyperlink in PDF page\n * textLink.draw(page1, new PointF(10, 40));\n * // save the document.\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n get: function () {\n return this.content;\n },\n set: function (value) {\n this.elementValue = value;\n this.content = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfTextElement.prototype, \"value\", {\n //get value\n /**\n * Gets or sets a `value` indicating the text that should be printed.\n * @private\n */\n get: function () {\n return this.elementValue;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfTextElement.prototype, \"pen\", {\n //get pen\n /**\n * Gets or sets a `PdfPen` that determines the color, width, and style of the text\n * @private\n */\n get: function () {\n return this.pdfPen;\n },\n //Set pen value\n set: function (value) {\n this.pdfPen = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfTextElement.prototype, \"brush\", {\n //get brush\n /**\n * Gets or sets the `PdfBrush` that will be used to draw the text with color and texture.\n * @private\n */\n get: function () {\n return this.pdfBrush;\n },\n //Set brush value\n set: function (value) {\n this.pdfBrush = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfTextElement.prototype, \"font\", {\n //get font\n /**\n * Gets or sets a `PdfFont` that defines the text format.\n * ```typescript\n * // create a new PDF document.\n * let document : PdfDocument = new PdfDocument();\n * // add a page to the document.\n * let page1 : PdfPage = document.pages.add();\n * // create the font\n * let font : PdfFont = new PdfStandardFont(PdfFontFamily.Helvetica, 12);\n * // create the Text Web Link\n * let textLink : PdfTextWebLink = new PdfTextWebLink();\n * // set the hyperlink\n * textLink.url = 'http://www.google.com';\n * // set the link text\n * textLink.text = 'Google';\n * //\n * // set the font\n * textLink.font = font;\n * //\n * // draw the hyperlink in PDF page\n * textLink.draw(page1, new PointF(10, 40));\n * // save the document.\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n get: function () {\n return this.pdfFont;\n },\n set: function (value) {\n this.pdfFont = value;\n if (this.pdfFont instanceof PdfStandardFont && this.content != null) {\n this.elementValue = PdfStandardFont.convert(this.content);\n }\n else {\n this.elementValue = this.content;\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfTextElement.prototype, \"stringFormat\", {\n /**\n * Gets or sets the `PdfStringFormat` that will be used to set the string format\n * @private\n */\n get: function () {\n return this.format;\n },\n set: function (value) {\n this.format = value;\n },\n enumerable: true,\n configurable: true\n });\n // Implementation\n /**\n * Gets a `brush` for drawing.\n * @private\n */\n PdfTextElement.prototype.getBrush = function () {\n return (this.pdfBrush == null || typeof this.pdfBrush === 'undefined') ? new PdfSolidBrush(new PdfColor(0, 0, 0)) : this.pdfBrush;\n };\n // /**\n // * `Draws` an element on the Graphics.\n // * @private\n // */\n // public drawInternal(graphics : PdfGraphics) : void {\n // graphics.drawString(this.elementValue, this.pdfFont, this.pdfPen, this.getBrush(), 0, 0, this.stringFormat);\n // }\n /**\n * `Layouts` the element.\n * @private\n */\n PdfTextElement.prototype.layout = function (param) {\n var layouter = new TextLayouter(this);\n var result = layouter.layout(param);\n return result;\n };\n PdfTextElement.prototype.drawText = function (arg2, arg3, arg4, arg5) {\n if (arg3 instanceof PointF && typeof arg3.width === 'undefined' && typeof arg4 === 'undefined') {\n this.hasPointOverload = true;\n return this.drawText(arg2, arg3.x, arg3.y);\n }\n else if (typeof arg3 === 'number' && typeof arg4 === 'number' && typeof arg5 === 'undefined') {\n this.hasPointOverload = true;\n return this.drawText(arg2, arg3, arg4, null);\n }\n else if (arg3 instanceof RectangleF && typeof arg3.width !== 'undefined' && typeof arg4 === 'undefined') {\n return this.drawText(arg2, arg3, null);\n }\n else if (arg3 instanceof PointF && typeof arg3.width === 'undefined' && arg4 instanceof PdfLayoutFormat) {\n this.hasPointOverload = true;\n return this.drawText(arg2, arg3.x, arg3.y, arg4);\n }\n else if (typeof arg3 === 'number' && typeof arg4 === 'number' && (arg5 instanceof PdfLayoutFormat || arg5 == null)) {\n this.hasPointOverload = true;\n var width = (arg2.graphics.clientSize.width - arg3);\n var layoutRectangle = new RectangleF(arg3, arg4, width, 0);\n return this.drawText(arg2, layoutRectangle, arg5);\n }\n else if (arg3 instanceof RectangleF && typeof arg3.width !== 'undefined' && typeof arg4 === 'boolean') {\n return this.drawText(arg2, arg3, null);\n }\n else {\n var layout = new PdfStringLayouter();\n if (this.hasPointOverload) {\n var stringLayoutResult = layout.layout(this.value, this.font, this.stringFormat, new SizeF((arg2.graphics.clientSize.width - arg3.x), 0), true, arg2.graphics.clientSize);\n var layoutResult = void 0;\n var param = new PdfLayoutParams();\n var temparg3 = arg3;\n var temparg4 = arg4;\n param.page = arg2;\n var previousPage = arg2;\n param.bounds = temparg3;\n param.format = (temparg4 != null) ? temparg4 : new PdfLayoutFormat();\n if (stringLayoutResult.lines.length > 1) {\n this.text = stringLayoutResult.layoutLines[0].text;\n if (param.bounds.y <= param.page.graphics.clientSize.height) {\n var previousPosition = new PointF(param.bounds.x, param.bounds.y);\n layoutResult = this.layout(param);\n var bounds = new RectangleF(0, layoutResult.bounds.y + stringLayoutResult.lineHeight, arg2.graphics.clientSize.width, stringLayoutResult.lineHeight);\n var isPaginate = false;\n for (var i = 1; i < stringLayoutResult.lines.length; i++) {\n param.page = layoutResult.page;\n param.bounds = new RectangleF(new PointF(bounds.x, bounds.y), new SizeF(bounds.width, bounds.height));\n this.text = stringLayoutResult.layoutLines[i].text;\n if (bounds.y + stringLayoutResult.lineHeight > layoutResult.page.graphics.clientSize.height) {\n isPaginate = true;\n param.page = param.page.graphics.getNextPage();\n if (previousPosition.y > (layoutResult.page.graphics.clientSize.height - layoutResult.bounds.height)) {\n bounds = new RectangleF(0, layoutResult.bounds.height, layoutResult.page.graphics.clientSize.width, stringLayoutResult.lineHeight);\n }\n else {\n bounds = new RectangleF(0, 0, layoutResult.page.graphics.clientSize.width, stringLayoutResult.lineHeight);\n }\n param.bounds = bounds;\n }\n layoutResult = this.layout(param);\n if (i !== (stringLayoutResult.lines.length - 1)) {\n bounds = new RectangleF(0, layoutResult.bounds.y + stringLayoutResult.lineHeight, layoutResult.page.graphics.clientSize.width, stringLayoutResult.lineHeight);\n }\n else {\n var lineWidth = this.font.measureString(this.text, this.format).width;\n layoutResult = this.calculateResultBounds(layoutResult, lineWidth, layoutResult.page.graphics.clientSize.width, 0);\n }\n }\n }\n return layoutResult;\n }\n else {\n var lineSize = this.font.measureString(this.text, this.format);\n if (param.bounds.y <= param.page.graphics.clientSize.height) {\n layoutResult = this.layout(param);\n layoutResult = this.calculateResultBounds(layoutResult, lineSize.width, layoutResult.page.graphics.clientSize.width, 0);\n }\n return layoutResult;\n }\n }\n else {\n var layoutResult = layout.layout(this.value, this.font, this.stringFormat, new SizeF(arg3.width, 0), false, arg2.graphics.clientSize);\n var result = void 0;\n var param = new PdfLayoutParams();\n var temparg3 = arg3;\n var temparg4 = arg4;\n param.page = arg2;\n param.bounds = temparg3;\n param.format = (temparg4 != null) ? temparg4 : new PdfLayoutFormat();\n if (layoutResult.lines.length > 1) {\n this.text = layoutResult.layoutLines[0].text;\n if (param.bounds.y <= param.page.graphics.clientSize.height) {\n var previousPosition = new PointF(param.bounds.x, param.bounds.y);\n result = this.layout(param);\n var bounds = new RectangleF(temparg3.x, result.bounds.y + layoutResult.lineHeight, temparg3.width, layoutResult.lineHeight);\n var isPaginate = false;\n for (var i = 1; i < layoutResult.lines.length; i++) {\n param.page = result.page;\n param.bounds = new RectangleF(bounds.x, bounds.y, bounds.width, bounds.height);\n this.text = layoutResult.layoutLines[i].text;\n if (bounds.y + layoutResult.lineHeight > result.page.graphics.clientSize.height) {\n isPaginate = true;\n param.page = param.page.graphics.getNextPage();\n if (previousPosition.y > (result.page.graphics.clientSize.height - result.bounds.height)) {\n bounds = new RectangleF(temparg3.x, layoutResult.lineHeight, temparg3.width, layoutResult.lineHeight);\n }\n else {\n bounds = new RectangleF(temparg3.x, 0, temparg3.width, layoutResult.lineHeight);\n }\n param.bounds = bounds;\n }\n result = this.layout(param);\n if (i !== (layoutResult.lines.length - 1)) {\n bounds = new RectangleF(temparg3.x, result.bounds.y + layoutResult.lineHeight, temparg3.width, layoutResult.lineHeight);\n }\n else {\n var lineWidth = this.font.measureString(this.text, this.format).width;\n result = this.calculateResultBounds(result, lineWidth, temparg3.width, temparg3.x);\n }\n }\n }\n return result;\n }\n else {\n var lineSize = this.font.measureString(this.text, this.format);\n if (param.bounds.y <= param.page.graphics.clientSize.height) {\n result = this.layout(param);\n result = this.calculateResultBounds(result, lineSize.width, temparg3.width, temparg3.x);\n }\n return result;\n }\n }\n }\n };\n PdfTextElement.prototype.calculateResultBounds = function (result, lineWidth, maximumWidth, startPosition) {\n var shift = 0;\n if (this.stringFormat != null && typeof this.stringFormat !== 'undefined' && this.stringFormat.alignment === PdfTextAlignment.Center) {\n result.bounds.x = startPosition + (maximumWidth - lineWidth) / 2;\n result.bounds.width = lineWidth;\n }\n else if (this.stringFormat != null && typeof this.stringFormat !== 'undefined' && this.stringFormat.alignment === PdfTextAlignment.Right) {\n result.bounds.x = startPosition + (maximumWidth - lineWidth);\n result.bounds.width = lineWidth;\n }\n else if (this.stringFormat != null && typeof this.stringFormat !== 'undefined' && this.stringFormat.alignment === PdfTextAlignment.Justify) {\n result.bounds.x = startPosition;\n result.bounds.width = maximumWidth;\n }\n else {\n result.bounds.width = startPosition;\n result.bounds.width = lineWidth;\n }\n return result;\n };\n return PdfTextElement;\n}(PdfLayoutElement));\nexport { PdfTextElement };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfActionLinkAnnotation } from './action-link-annotation';\nimport { PdfName } from './../primitives/pdf-name';\nimport { PdfUriAction } from './../actions/uri-action';\n/**\n * `PdfUriAnnotation` class represents the Uri annotation.\n * @private\n */\nvar PdfUriAnnotation = /** @class */ (function (_super) {\n __extends(PdfUriAnnotation, _super);\n function PdfUriAnnotation(rectangle, uri) {\n var _this = _super.call(this, rectangle) || this;\n if (typeof uri !== 'undefined') {\n _this.uri = uri;\n }\n return _this;\n }\n Object.defineProperty(PdfUriAnnotation.prototype, \"uriAction\", {\n /**\n * Get `action` of the annotation.\n * @private\n */\n get: function () {\n if (typeof this.pdfUriAction === 'undefined') {\n this.pdfUriAction = new PdfUriAction();\n }\n return this.pdfUriAction;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfUriAnnotation.prototype, \"uri\", {\n // Properties\n /**\n * Gets or sets the `Uri` address.\n * @private\n */\n get: function () {\n return this.uriAction.uri;\n },\n set: function (value) {\n if (this.uriAction.uri !== value) {\n this.uriAction.uri = value;\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfUriAnnotation.prototype, \"action\", {\n /**\n * Gets or sets the `action`.\n * @private\n */\n get: function () {\n return this.getSetAction();\n },\n set: function (value) {\n this.getSetAction(value);\n this.uriAction.next = value;\n },\n enumerable: true,\n configurable: true\n });\n // Implementation\n /**\n * `Initializes` annotation object.\n * @private\n */\n PdfUriAnnotation.prototype.initialize = function () {\n _super.prototype.initialize.call(this);\n this.dictionary.items.setValue(this.dictionaryProperties.subtype, new PdfName(this.dictionaryProperties.link));\n var tempPrimitive = this.uriAction.element;\n this.dictionary.items.setValue(this.dictionaryProperties.a, this.uriAction.element);\n };\n return PdfUriAnnotation;\n}(PdfActionLinkAnnotation));\nexport { PdfUriAnnotation };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfPage } from './../pages/pdf-page';\nimport { PointF, RectangleF, SizeF } from './../drawing/pdf-drawing';\nimport { PdfTextElement } from './../graphics/figures/text-element';\nimport { PdfUriAnnotation } from './uri-annotation';\nimport { PdfStringLayouter } from './../graphics/fonts/string-layouter';\nimport { PdfFontStyle } from './../graphics/fonts/enum';\nimport { PdfTextAlignment } from './../graphics/enum';\nimport { PdfArray } from './../primitives/pdf-array';\nimport { PdfNumber } from './../primitives/pdf-number';\n/**\n * `PdfTextWebLink` class represents the class for text web link annotation.\n * ```typescript\n * // create a new PDF document.\n * let document : PdfDocument = new PdfDocument();\n * // add a page to the document.\n * let page1 : PdfPage = document.pages.add();\n * // create the font\n * let font : PdfFont = new PdfStandardFont(PdfFontFamily.Helvetica, 12);\n * //\n * // create the Text Web Link\n * let textLink : PdfTextWebLink = new PdfTextWebLink();\n * // set the hyperlink\n * textLink.url = 'http://www.google.com';\n * // set the link text\n * textLink.text = 'Google';\n * // set the font\n * textLink.font = font;\n * // draw the hyperlink in PDF page\n * textLink.draw(page1, new PointF(10, 40));\n * //\n * // save the document.\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\nvar PdfTextWebLink = /** @class */ (function (_super) {\n __extends(PdfTextWebLink, _super);\n // Constructors\n /**\n * Initializes a new instance of the `PdfTextWebLink` class.\n * @private\n */\n function PdfTextWebLink() {\n var _this = _super.call(this) || this;\n // Fields\n /**\n * Internal variable to store `Url`.\n * @default ''\n * @private\n */\n _this.uniformResourceLocator = '';\n /**\n * Internal variable to store `Uri Annotation` object.\n * @default null\n * @private\n */\n _this.uriAnnotation = null;\n /**\n * Checks whether the drawTextWebLink method with `PointF` overload is called or not.\n * If it set as true, then the start position of each lines excluding firest line is changed as (0, Y).\n * @private\n * @hidden\n */\n _this.recalculateBounds = false;\n _this.defaultBorder = new PdfArray();\n for (var i = 0; i < 3; i++) {\n _this.defaultBorder.add(new PdfNumber(0));\n }\n return _this;\n }\n Object.defineProperty(PdfTextWebLink.prototype, \"url\", {\n // Properties\n /**\n * Gets or sets the `Uri address`.\n * ```typescript\n * // create a new PDF document.\n * let document : PdfDocument = new PdfDocument();\n * // add a page to the document.\n * let page1 : PdfPage = document.pages.add();\n * // create the font\n * let font : PdfFont = new PdfStandardFont(PdfFontFamily.Helvetica, 12);\n * // create the Text Web Link\n * let textLink : PdfTextWebLink = new PdfTextWebLink();\n * //\n * // set the hyperlink\n * textLink.url = 'http://www.google.com';\n * //\n * // set the link text\n * textLink.text = 'Google';\n * // set the font\n * textLink.font = font;\n * // draw the hyperlink in PDF page\n * textLink.draw(page1, new PointF(10, 40));\n * // save the document.\n * document.save('output.pdf');\n * // destroy the document\n * document.destroy();\n * ```\n */\n get: function () {\n return this.uniformResourceLocator;\n },\n set: function (value) {\n if (value.length === 0) {\n throw new Error('ArgumentException : Url - string can not be empty');\n }\n this.uniformResourceLocator = value;\n },\n enumerable: true,\n configurable: true\n });\n PdfTextWebLink.prototype.draw = function (arg1, arg2) {\n if (arg1 instanceof PdfPage) {\n var layout = new PdfStringLayouter();\n var previousFontStyle = this.font.style;\n if (arg2 instanceof PointF) {\n this.recalculateBounds = true;\n this.font.style = PdfFontStyle.Underline;\n var layoutResult = layout.layout(this.value, this.font, this.stringFormat, new SizeF((arg1.graphics.clientSize.width - arg2.x), 0), true, arg1.graphics.clientSize);\n if (layoutResult.lines.length === 1) {\n var textSize = this.font.measureString(this.value);\n var rect = new RectangleF(arg2, textSize);\n rect = this.calculateBounds(rect, textSize.width, arg1.graphics.clientSize.width, arg2.x);\n this.uriAnnotation = new PdfUriAnnotation(rect, this.url);\n this.uriAnnotation.dictionary.items.setValue('Border', this.defaultBorder);\n arg1.annotations.add(this.uriAnnotation);\n var result = this.drawText(arg1, arg2);\n this.font.style = previousFontStyle;\n return result;\n }\n else {\n var result = this.drawMultipleLineWithPoint(layoutResult, arg1, arg2);\n this.font.style = previousFontStyle;\n return result;\n }\n }\n else {\n var layoutResult = layout.layout(this.value, this.font, this.stringFormat, new SizeF(arg2.width, 0), false, new SizeF(0, 0));\n this.font.style = PdfFontStyle.Underline;\n if (layoutResult.lines.length === 1) {\n var textSize = this.font.measureString(this.value);\n var rect = new RectangleF(new PointF(arg2.x, arg2.y), textSize);\n rect = this.calculateBounds(rect, textSize.width, arg2.width, arg2.x);\n this.uriAnnotation = new PdfUriAnnotation(rect, this.url);\n this.uriAnnotation.dictionary.items.setValue('Border', this.defaultBorder);\n arg1.annotations.add(this.uriAnnotation);\n var returnValue = this.drawText(arg1, arg2);\n this.font.style = previousFontStyle;\n return returnValue;\n }\n else {\n var returnValue = this.drawMultipleLineWithBounds(layoutResult, arg1, arg2);\n this.font.style = previousFontStyle;\n return returnValue;\n }\n }\n }\n else {\n var page = new PdfPage();\n page = arg1.page;\n return this.draw(page, arg2);\n }\n };\n /* tslint:enable */\n //Private methods\n /**\n * Helper method `Draw` a Multiple Line Text Web Link on the Graphics with the specified location.\n * @private\n */\n PdfTextWebLink.prototype.drawMultipleLineWithPoint = function (result, page, location) {\n var layoutResult;\n for (var i = 0; i < result.layoutLines.length; i++) {\n var size = this.font.measureString(result.lines[i].text);\n var bounds = new RectangleF(location, size);\n if (i !== 0) {\n bounds.x = 0;\n }\n this.text = result.lines[i].text;\n if (bounds.y + size.height > page.graphics.clientSize.height) {\n if (i !== 0) {\n page = page.graphics.getNextPage();\n bounds = new RectangleF(0, 0, page.graphics.clientSize.width, size.height);\n location.y = 0;\n }\n else {\n break;\n }\n }\n bounds = this.calculateBounds(bounds, size.width, page.graphics.clientSize.width, bounds.x);\n this.uriAnnotation = new PdfUriAnnotation(bounds, this.url);\n this.uriAnnotation.dictionary.items.setValue('Border', this.defaultBorder);\n page.annotations.add(this.uriAnnotation);\n if (i !== 0) {\n layoutResult = this.drawText(page, new PointF(0, bounds.y));\n }\n else {\n layoutResult = this.drawText(page, bounds.x, bounds.y);\n }\n location.y += size.height;\n }\n return layoutResult;\n };\n /**\n * Helper method `Draw` a Multiple Line Text Web Link on the Graphics with the specified bounds.\n * @private\n */\n PdfTextWebLink.prototype.drawMultipleLineWithBounds = function (result, page, bounds) {\n var layoutResult;\n for (var i = 0; i < result.layoutLines.length; i++) {\n var size = this.font.measureString(result.lines[i].text);\n var internalBounds = new RectangleF(new PointF(bounds.x, bounds.y), size);\n internalBounds = this.calculateBounds(internalBounds, size.width, bounds.width, bounds.x);\n this.text = result.lines[i].text;\n if (bounds.y + size.height > page.graphics.clientSize.height) {\n if (i !== 0) {\n page = page.graphics.getNextPage();\n bounds = new RectangleF(bounds.x, 0, bounds.width, size.height);\n internalBounds.y = 0;\n }\n else {\n break;\n }\n }\n this.uriAnnotation = new PdfUriAnnotation(internalBounds, this.url);\n this.uriAnnotation.dictionary.items.setValue('Border', this.defaultBorder);\n page.annotations.add(this.uriAnnotation);\n layoutResult = this.drawText(page, bounds);\n bounds.y += size.height;\n }\n return layoutResult;\n };\n /* tslint:disable */\n PdfTextWebLink.prototype.calculateBounds = function (currentBounds, lineWidth, maximumWidth, startPosition) {\n var shift = 0;\n if (this.stringFormat != null && typeof this.stringFormat !== 'undefined' && this.stringFormat.alignment === PdfTextAlignment.Center) {\n currentBounds.x = startPosition + (maximumWidth - lineWidth) / 2;\n currentBounds.width = lineWidth;\n }\n else if (this.stringFormat != null && typeof this.stringFormat !== 'undefined' && this.stringFormat.alignment === PdfTextAlignment.Right) {\n currentBounds.x = startPosition + (maximumWidth - lineWidth);\n currentBounds.width = lineWidth;\n }\n else if (this.stringFormat != null && typeof this.stringFormat !== 'undefined' && this.stringFormat.alignment === PdfTextAlignment.Justify) {\n currentBounds.x = startPosition;\n currentBounds.width = maximumWidth;\n }\n else {\n currentBounds.width = startPosition;\n currentBounds.width = lineWidth;\n }\n return currentBounds;\n };\n return PdfTextWebLink;\n}(PdfTextElement));\nexport { PdfTextWebLink };\n","/**\n * PdfNumbersConvertor.ts class for EJ2-PDF\n * @private\n */\nimport { PdfNumberStyle } from './../../pages/enum';\n/**\n * `PdfNumbersConvertor` for convert page number into numbers, roman letters, etc.,\n * @private\n */\nvar PdfNumbersConvertor = /** @class */ (function () {\n function PdfNumbersConvertor() {\n }\n // Static methods\n /**\n * Convert string value from page number with correct format.\n * @private\n */\n PdfNumbersConvertor.convert = function (intArabic, numberStyle) {\n var result = '';\n switch (numberStyle) {\n case PdfNumberStyle.None:\n result = '';\n break;\n case PdfNumberStyle.Numeric:\n result = intArabic.toString();\n break;\n case PdfNumberStyle.LowerLatin:\n result = this.arabicToLetter(intArabic).toLowerCase();\n break;\n case PdfNumberStyle.LowerRoman:\n result = this.arabicToRoman(intArabic).toLowerCase();\n break;\n case PdfNumberStyle.UpperLatin:\n result = this.arabicToLetter(intArabic);\n break;\n case PdfNumberStyle.UpperRoman:\n result = this.arabicToRoman(intArabic);\n break;\n }\n return result;\n };\n /**\n * Converts `arabic to roman` letters.\n * @private\n */\n PdfNumbersConvertor.arabicToRoman = function (intArabic) {\n var retval = '';\n retval += this.generateNumber(intArabic, 1000, 'M');\n retval += this.generateNumber(intArabic, 900, 'CM');\n retval += this.generateNumber(intArabic, 500, 'D');\n retval += this.generateNumber(intArabic, 400, 'CD');\n retval += this.generateNumber(intArabic, 100, 'C');\n retval += this.generateNumber(intArabic, 90, 'XC');\n retval += this.generateNumber(intArabic, 50, 'L');\n retval += this.generateNumber(intArabic, 40, 'XL');\n retval += this.generateNumber(intArabic, 10, 'X');\n retval += this.generateNumber(intArabic, 9, 'IX');\n retval += this.generateNumber(intArabic, 5, 'V');\n retval += this.generateNumber(intArabic, 4, 'IV');\n retval += this.generateNumber(intArabic, 1, 'I');\n return retval.toString();\n };\n /**\n * Converts `arabic to normal letters`.\n * @private\n */\n PdfNumbersConvertor.arabicToLetter = function (arabic) {\n var stack = this.convertToLetter(arabic);\n var result = '';\n while (stack.length > 0) {\n var num = stack.pop();\n result = this.appendChar(result, num);\n }\n return result.toString();\n };\n /**\n * Generate a string value of an input number.\n * @private\n */\n PdfNumbersConvertor.generateNumber = function (value, magnitude, letter) {\n var numberstring = '';\n while (value >= magnitude) {\n value -= magnitude;\n numberstring += letter;\n }\n return numberstring.toString();\n };\n /**\n * Convert a input number into letters.\n * @private\n */\n PdfNumbersConvertor.convertToLetter = function (arabic) {\n if (arabic <= 0) {\n throw Error('ArgumentOutOfRangeException-arabic, Value can not be less 0');\n }\n var stack = [];\n while (arabic > this.letterLimit) {\n var remainder = arabic % this.letterLimit;\n if (remainder === 0.0) {\n arabic = arabic / this.letterLimit - 1;\n remainder = this.letterLimit;\n }\n else {\n arabic /= this.letterLimit;\n }\n stack.push(remainder);\n }\n stack.push(arabic);\n return stack;\n };\n /**\n * Convert number to actual string value.\n * @private\n */\n PdfNumbersConvertor.appendChar = function (builder, value) {\n var letter = String.fromCharCode(PdfNumbersConvertor.acsiiStartIndex + value);\n builder += letter;\n return builder;\n };\n // Fields\n /**\n * numbers of letters in english [readonly].\n * @default = 26.0\n * @private\n */\n PdfNumbersConvertor.letterLimit = 26.0;\n /**\n * Resturns `acsii start index` value.\n * @default 64\n * @private\n */\n PdfNumbersConvertor.acsiiStartIndex = (65 - 1);\n return PdfNumbersConvertor;\n}());\nexport { PdfNumbersConvertor };\n","/**\n * Represent class to store information about `template and value pairs`.\n * @private\n */\nvar PdfTemplateValuePair = /** @class */ (function () {\n function PdfTemplateValuePair(template, value) {\n // Fields\n /**\n * Internal variable to store template.\n * @default null\n * @private\n */\n this.pdfTemplate = null;\n /**\n * Intenal variable to store value.\n * @private\n */\n this.content = '';\n if (typeof template === 'undefined') {\n //\n }\n else {\n this.template = template;\n this.value = value;\n }\n }\n Object.defineProperty(PdfTemplateValuePair.prototype, \"template\", {\n // Properties\n /**\n * Gets or sets the template.\n * @private\n */\n get: function () {\n return this.pdfTemplate;\n },\n set: function (value) {\n this.pdfTemplate = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfTemplateValuePair.prototype, \"value\", {\n /**\n * Gets or sets the value.\n * @private\n */\n get: function () {\n return this.content;\n },\n set: function (value) {\n this.content = value;\n },\n enumerable: true,\n configurable: true\n });\n return PdfTemplateValuePair;\n}());\nexport { PdfTemplateValuePair };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * PdfAutomaticField.ts class for EJ2-PDF\n */\nimport { PdfAutomaticField } from './automatic-field';\nimport { TemporaryDictionary } from './../../collections/object-object-pair/dictionary';\nimport { PdfTemplateValuePair } from './pdf-template-value-pair';\nimport { SizeF, PointF } from './../../drawing/pdf-drawing';\nimport { PdfTemplate } from './../../graphics/figures/pdf-template';\n/**\n * Represents automatic field which has the same value within the `PdfGraphics`.\n */\nvar PdfMultipleValueField = /** @class */ (function (_super) {\n __extends(PdfMultipleValueField, _super);\n function PdfMultipleValueField() {\n var _this = _super.call(this) || this;\n // Fields\n /**\n * Stores the instance of dictionary values of `graphics and template value pair`.\n * @private\n */\n _this.list = new TemporaryDictionary();\n return _this;\n }\n // Implementation\n /* tslint:disable */\n PdfMultipleValueField.prototype.performDraw = function (graphics, location, scalingX, scalingY) {\n _super.prototype.performDrawHelper.call(this, graphics, location, scalingX, scalingY);\n var value = this.getValue(graphics);\n var template = new PdfTemplate(this.getSize());\n this.list.setValue(graphics, new PdfTemplateValuePair(template, value));\n var g = template.graphics;\n var size = this.getSize();\n template.graphics.drawString(value, this.getFont(), this.pen, this.getBrush(), 0, 0, size.width, size.height, this.stringFormat);\n var drawLocation = new PointF(location.x + this.location.x, location.y + this.location.y);\n graphics.drawPdfTemplate(template, drawLocation, new SizeF(template.width * scalingX, template.height * scalingY));\n };\n return PdfMultipleValueField;\n}(PdfAutomaticField));\nexport { PdfMultipleValueField };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfBrush } from './../../graphics/brushes/pdf-brush';\nimport { PdfNumberStyle } from './../../pages/enum';\nimport { PdfNumbersConvertor } from './pdf-numbers-convertor';\nimport { PdfMultipleValueField } from './multiple-value-field';\n/**\n * Represents PDF document `page number field`.\n * @public\n */\nvar PdfPageNumberField = /** @class */ (function (_super) {\n __extends(PdfPageNumberField, _super);\n function PdfPageNumberField(font, arg2) {\n var _this = _super.call(this) || this;\n // Fields\n /**\n * Stores the number style of the page number field.\n * @private\n */\n _this.internalNumberStyle = PdfNumberStyle.Numeric;\n if (typeof arg2 === 'undefined') {\n _this.font = font;\n }\n else if (arg2 instanceof PdfBrush) {\n _this.font = font;\n _this.brush = arg2;\n }\n else {\n _this.font = font;\n _this.bounds = arg2;\n }\n return _this;\n }\n Object.defineProperty(PdfPageNumberField.prototype, \"numberStyle\", {\n // Properties\n /**\n * Gets and sets the number style of the page number field.\n * @private\n */\n get: function () {\n return this.internalNumberStyle;\n },\n set: function (value) {\n this.internalNumberStyle = value;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * Return the `string` value of page number field.\n * @public\n */\n PdfPageNumberField.prototype.getValue = function (graphics) {\n var result = null;\n var page = this.getPageFromGraphics(graphics);\n result = this.internalGetValue(page);\n return result;\n };\n /**\n * Internal method to `get actual value of page number`.\n * @private\n */\n PdfPageNumberField.prototype.internalGetValue = function (page) {\n var document = page.document;\n var pageIndex = document.pages.indexOf(page) + 1;\n return PdfNumbersConvertor.convert(pageIndex, this.numberStyle);\n };\n return PdfPageNumberField;\n}(PdfMultipleValueField));\nexport { PdfPageNumberField };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * PdfCompositeField.ts class for EJ2-PDF\n */\nimport { PdfMultipleValueField } from './multiple-value-field';\n/**\n * Represents class which can concatenate multiple automatic fields into single string.\n */\nvar PdfCompositeField = /** @class */ (function (_super) {\n __extends(PdfCompositeField, _super);\n // Constructor\n /**\n * Initialize a new instance of `PdfCompositeField` class.\n * @param font Font of the field.\n * @param brush Color of the field.\n * @param text Content of the field.\n * @param list List of the automatic fields in specific order based on the text content.\n */\n function PdfCompositeField(font, brush, text) {\n var list = [];\n for (var _i = 3; _i < arguments.length; _i++) {\n list[_i - 3] = arguments[_i];\n }\n var _this = _super.call(this) || this;\n // Fields\n /**\n * Stores the array of automatic fields.\n * @private\n */\n _this.internalAutomaticFields = null;\n /**\n * Stores the text value of the field.\n * @private\n */\n _this.internalText = '';\n _this.font = font;\n _this.brush = brush;\n _this.text = text;\n _this.automaticFields = list;\n return _this;\n }\n Object.defineProperty(PdfCompositeField.prototype, \"text\", {\n // Properties\n /**\n * Gets and sets the content of the field.\n * @public\n */\n get: function () {\n return this.internalText;\n },\n set: function (value) {\n this.internalText = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfCompositeField.prototype, \"automaticFields\", {\n /**\n * Gets and sets the list of the field to drawn.\n * @public\n */\n get: function () {\n return this.internalAutomaticFields;\n },\n set: function (value) {\n this.internalAutomaticFields = value;\n },\n enumerable: true,\n configurable: true\n });\n // Implementation\n /**\n * Return the actual value generated from the list of automatic fields.\n * @public\n */\n PdfCompositeField.prototype.getValue = function (graphics) {\n var values = [];\n var text = this.text.toString();\n if (typeof this.automaticFields !== 'undefined' && this.automaticFields != null && this.automaticFields.length > 0) {\n for (var i = 0; i < this.automaticFields.length; i++) {\n var automaticField = this.automaticFields[i];\n text = text.replace('{' + i + '}', automaticField.getValue(graphics));\n }\n }\n return text;\n };\n return PdfCompositeField;\n}(PdfMultipleValueField));\nexport { PdfCompositeField };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * PdfSingleValueField.ts class for EJ2-PDF\n */\nimport { PdfAutomaticField } from './automatic-field';\nimport { TemporaryDictionary } from './../../collections/object-object-pair/dictionary';\nimport { PdfTemplateValuePair } from './pdf-template-value-pair';\nimport { PointF, SizeF } from './../../drawing/pdf-drawing';\nimport { PdfTemplate } from './../../graphics/figures/pdf-template';\n/**\n * Represents automatic field which has the same value in the whole document.\n */\nvar PdfSingleValueField = /** @class */ (function (_super) {\n __extends(PdfSingleValueField, _super);\n // Constructors\n function PdfSingleValueField() {\n var _this = _super.call(this) || this;\n // Fields\n /* tslint:disable */\n _this.list = new TemporaryDictionary();\n /* tslint:enable */\n _this.painterGraphics = [];\n return _this;\n }\n PdfSingleValueField.prototype.performDraw = function (graphics, location, scalingX, scalingY) {\n _super.prototype.performDrawHelper.call(this, graphics, location, scalingX, scalingY);\n var page = this.getPageFromGraphics(graphics);\n var document = page.document;\n var textValue = this.getValue(graphics);\n /* tslint:disable */\n if (this.list.containsKey(document)) {\n var pair = this.list.getValue(document);\n var drawLocation = new PointF(location.x + this.location.x, location.y + this.location.y);\n graphics.drawPdfTemplate(pair.template, drawLocation, new SizeF(pair.template.width * scalingX, pair.template.height * scalingY));\n this.painterGraphics.push(graphics);\n }\n else {\n var size = this.getSize();\n var template = new PdfTemplate(size);\n this.list.setValue(document, new PdfTemplateValuePair(template, textValue));\n template.graphics.drawString(textValue, this.getFont(), this.pen, this.getBrush(), 0, 0, size.width, size.height, this.stringFormat);\n var drawLocation = new PointF(location.x + this.location.x, location.y + this.location.y);\n graphics.drawPdfTemplate(template, drawLocation, new SizeF(template.width * scalingX, template.height * scalingY));\n this.painterGraphics.push(graphics);\n }\n /* tslint:enable */\n };\n return PdfSingleValueField;\n}(PdfAutomaticField));\nexport { PdfSingleValueField };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * PdfPageCountField.ts class for EJ2-PDF\n */\nimport { PdfSingleValueField } from './single-value-field';\nimport { PdfNumberStyle } from './../../pages/enum';\nimport { PdfBrush } from './../../graphics/brushes/pdf-brush';\nimport { PdfNumbersConvertor } from './pdf-numbers-convertor';\n/**\n * Represents total PDF document page count automatic field.\n */\nvar PdfPageCountField = /** @class */ (function (_super) {\n __extends(PdfPageCountField, _super);\n function PdfPageCountField(font, arg2) {\n var _this = _super.call(this) || this;\n // Fields\n /**\n * Stores the number style of the field.\n * @private\n */\n _this.internalNumberStyle = PdfNumberStyle.Numeric;\n if (typeof arg2 === 'undefined') {\n _this.font = font;\n }\n else if (arg2 instanceof PdfBrush) {\n _this.font = font;\n _this.brush = arg2;\n }\n else {\n _this.font = font;\n _this.bounds = arg2;\n }\n return _this;\n }\n Object.defineProperty(PdfPageCountField.prototype, \"numberStyle\", {\n // Properties\n /**\n * Gets and sets the number style of the field.\n * @public\n */\n get: function () {\n return this.internalNumberStyle;\n },\n set: function (value) {\n this.internalNumberStyle = value;\n },\n enumerable: true,\n configurable: true\n });\n // Implementation\n /**\n * Return the actual value of the content to drawn.\n * @public\n */\n PdfPageCountField.prototype.getValue = function (graphics) {\n var result = null;\n var page = this.getPageFromGraphics(graphics);\n var document = page.section.parent.document;\n var count = document.pages.count;\n result = PdfNumbersConvertor.convert(count, this.numberStyle);\n return result;\n };\n return PdfPageCountField;\n}(PdfSingleValueField));\nexport { PdfPageCountField };\n","/**\n * public Enum for `PdfDestinationMode`.\n * @private\n */\nexport var PdfDestinationMode;\n(function (PdfDestinationMode) {\n /**\n * Specifies the type of `Location`.\n * @private\n */\n PdfDestinationMode[PdfDestinationMode[\"Location\"] = 0] = \"Location\";\n /**\n * Specifies the type of `FitToPage`.\n * @private\n */\n PdfDestinationMode[PdfDestinationMode[\"FitToPage\"] = 1] = \"FitToPage\";\n /**\n * Specifies the type of `FitR`.\n * @private\n */\n PdfDestinationMode[PdfDestinationMode[\"FitR\"] = 2] = \"FitR\";\n})(PdfDestinationMode || (PdfDestinationMode = {}));\n","import { PointF, RectangleF } from './../drawing/pdf-drawing';\nimport { PdfArray } from './../primitives/pdf-array';\nimport { PdfPageRotateAngle } from './../pages/enum';\nimport { PdfDestinationMode } from './../general/enum';\nimport { PdfReferenceHolder } from './../primitives/pdf-reference';\nimport { PdfName } from './../primitives/pdf-name';\nimport { PdfNumber } from './../primitives/pdf-number';\nimport { DictionaryProperties } from './../input-output/pdf-dictionary-properties';\n/**\n * `PdfDestination` class represents an anchor in the document\n * where bookmarks or annotations can direct when clicked.\n */\nvar PdfDestination = /** @class */ (function () {\n function PdfDestination(arg1, arg2) {\n // Fields\n /**\n * Internal variable for accessing fields from `DictionryProperties` class.\n * @private\n */\n this.dictionaryProperties = new DictionaryProperties();\n /**\n * Type of the `destination`.\n * @private\n */\n this.destinationMode = PdfDestinationMode.Location;\n /**\n * `Zoom` factor.\n * @private\n * @default 0\n */\n this.zoomFactor = 0;\n /**\n * `Location` of the destination.\n * @default new PointF() with 0 ,0 as co-ordinates\n * @private\n */\n this.destinationLocation = new PointF(0, 0);\n /**\n * `Bounds` of the destination as RectangleF.\n * @default RectangleF.Empty\n * @private\n */\n this.bounds = new RectangleF();\n /**\n * Pdf primitive representing `this` object.\n * @private\n */\n this.array = new PdfArray();\n if (typeof arg2 === 'undefined') {\n var angle = PdfPageRotateAngle.RotateAngle0;\n this.destinationLocation = new PointF(0, this.destinationLocation.y);\n this.pdfPage = arg1;\n }\n else if (arg2 instanceof PointF) {\n this.constructor(arg1);\n this.destinationLocation = arg2;\n }\n else {\n this.constructor(arg1);\n this.bounds = arg2;\n }\n }\n Object.defineProperty(PdfDestination.prototype, \"zoom\", {\n // Properties\n /**\n * Gets and Sets the `zoom` factor.\n * @private\n */\n get: function () {\n return this.zoomFactor;\n },\n set: function (value) {\n this.zoomFactor = value;\n this.initializePrimitive();\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDestination.prototype, \"page\", {\n /**\n * Gets and Sets the `page` object.\n * @private\n */\n get: function () {\n return this.pdfPage;\n },\n set: function (value) {\n this.pdfPage = value;\n this.initializePrimitive();\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDestination.prototype, \"mode\", {\n /**\n * Gets and Sets the destination `mode`.\n * @private\n */\n get: function () {\n return this.destinationMode;\n },\n set: function (value) {\n this.destinationMode = value;\n this.initializePrimitive();\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfDestination.prototype, \"location\", {\n /**\n * Gets and Sets the `location`.\n * @private\n */\n get: function () {\n return this.destinationLocation;\n },\n set: function (value) {\n this.destinationLocation = value;\n this.initializePrimitive();\n },\n enumerable: true,\n configurable: true\n });\n /**\n * `Translates` co-ordinates to PDF co-ordinate system (lower/left).\n * @private\n */\n PdfDestination.prototype.pointToNativePdf = function (page, point) {\n var section = page.section;\n return section.pointToNativePdf(page, point);\n };\n /**\n * `In fills` array by correct values.\n * @private\n */\n PdfDestination.prototype.initializePrimitive = function () {\n this.array.clear();\n this.array.add(new PdfReferenceHolder(this.pdfPage));\n switch (this.destinationMode) {\n case PdfDestinationMode.Location:\n var simplePage = this.pdfPage;\n var point = new PointF();\n point = this.pointToNativePdf(simplePage, this.destinationLocation);\n this.array.add(new PdfName(this.dictionaryProperties.xyz));\n this.array.add(new PdfNumber(point.x));\n this.array.add(new PdfNumber(point.y));\n this.array.add(new PdfNumber(this.zoomFactor));\n break;\n case PdfDestinationMode.FitToPage:\n this.array.add(new PdfName(this.dictionaryProperties.fit));\n break;\n }\n };\n Object.defineProperty(PdfDestination.prototype, \"element\", {\n /**\n * Gets the `element` representing this object.\n * @private\n */\n get: function () {\n this.initializePrimitive();\n return this.array;\n },\n enumerable: true,\n configurable: true\n });\n return PdfDestination;\n}());\nexport { PdfDestination };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * PdfTrueTypeFont.ts class for EJ2-PDF\n */\nimport { UnicodeTrueTypeFont } from './unicode-true-type-font';\nimport { PdfFont } from './pdf-font';\nimport { PdfFontStyle } from './enum';\nimport { PdfDocument } from './../../document/pdf-document';\nimport { PdfTextDirection } from './../enum';\nimport { RtlRenderer } from './rtl-renderer';\n//https://www.giftofspeed.com/base64-encoder/\nvar PdfTrueTypeFont = /** @class */ (function (_super) {\n __extends(PdfTrueTypeFont, _super);\n function PdfTrueTypeFont(base64String, size, style) {\n var _this = _super.call(this, size) || this;\n /**\n * Indicates whether the font is embedded or not.\n * @private\n */\n _this.isEmbedFont = false;\n /**\n * Indicates whether the font is unicoded or not.\n * @private\n */\n _this.isUnicode = true;\n if (style !== undefined) {\n _this.createFontInternal(base64String, style);\n }\n else {\n _this.createFontInternal(base64String, PdfFontStyle.Regular);\n }\n return _this;\n }\n PdfTrueTypeFont.prototype.equalsToFont = function (font) {\n var result = false;\n //let result : boolean = this.fontInternal.equalsToFont(font);\n return result;\n };\n PdfTrueTypeFont.prototype.getLineWidth = function (line, format) {\n var width = 0;\n if (format !== null && format.textDirection !== PdfTextDirection.None) {\n var returnValue = this.getUnicodeLineWidth(line, /*out*/ width, format);\n width = returnValue.width;\n }\n else {\n width = this.fontInternal.getLineWidth(line);\n }\n var size = this.metrics.getSize(format);\n width *= (PdfFont.charSizeMultiplier * size);\n width = this.applyFormatSettings(line, format, width);\n return width;\n };\n /**\n * Returns width of the char.\n */\n PdfTrueTypeFont.prototype.getCharWidth = function (charCode, format) {\n var codeWidth = this.fontInternal.getCharWidth(charCode);\n var size = this.metrics.getSize(format);\n codeWidth *= (0.001 * size);\n return codeWidth;\n };\n //Implementation\n PdfTrueTypeFont.prototype.createFontInternal = function (base64String, style) {\n this.fontInternal = new UnicodeTrueTypeFont(base64String, this.size);\n this.calculateStyle(style);\n this.initializeInternals();\n };\n PdfTrueTypeFont.prototype.calculateStyle = function (style) {\n var iStyle = this.fontInternal.ttfMetrics.macStyle;\n if ((style & PdfFontStyle.Underline) !== 0) {\n iStyle |= PdfFontStyle.Underline;\n }\n if ((style & PdfFontStyle.Strikeout) !== 0) {\n iStyle |= PdfFontStyle.Strikeout;\n }\n this.setStyle(iStyle);\n };\n PdfTrueTypeFont.prototype.initializeInternals = function () {\n var equalFont = null;\n if (PdfDocument.enableCache) {\n // Search for the similar fonts.\n equalFont = PdfDocument.cache.search(this);\n }\n var internals = null;\n // There is not equal font in the cache.\n if (equalFont !== null && equalFont !== undefined) {\n // Get the settings from the cached font.\n internals = equalFont.getInternals();\n var metrics = equalFont.metrics;\n metrics = metrics.clone();\n metrics.size = this.size;\n this.metrics = metrics;\n this.fontInternal = equalFont.fontInternal;\n }\n else {\n if (equalFont == null) {\n if (this.fontInternal instanceof UnicodeTrueTypeFont) {\n this.fontInternal.isEmbed = this.isEmbedFont;\n }\n this.fontInternal.createInternals();\n internals = this.fontInternal.getInternals();\n this.metrics = this.fontInternal.metrics;\n }\n }\n this.metrics.isUnicodeFont = true;\n this.setInternals(internals);\n //this.ttfReader = (this.fontInternal as UnicodeTrueTypeFont).ttfReader;\n };\n /**\n * Stores used symbols.\n */\n PdfTrueTypeFont.prototype.setSymbols = function (text) {\n var internalFont = this.fontInternal;\n if (internalFont != null) {\n internalFont.setSymbols(text);\n }\n };\n Object.defineProperty(PdfTrueTypeFont.prototype, \"Unicode\", {\n /**\n * Property\n *\n */\n get: function () {\n return this.isUnicode;\n },\n enumerable: true,\n configurable: true\n });\n // public get Font() : UnicodeTrueTypeFont {\n // return this.fontInternal as UnicodeTrueTypeFont;\n // }\n PdfTrueTypeFont.prototype.getUnicodeLineWidth = function (line, /*out*/ width, format) {\n // if (line == null) {\n // throw new Error('ArgumentNullException : line');\n // }\n width = 0;\n var glyphIndices = null;\n var rtlRender = new RtlRenderer();\n /* tslint:disable-next-line:max-line-length */\n var result = rtlRender.getGlyphIndex(line, this, (format.textDirection === PdfTextDirection.RightToLeft) ? true : false, /*out*/ glyphIndices, true);\n var resultGlyph = result.success;\n glyphIndices = result.glyphs;\n if (resultGlyph && glyphIndices !== null) {\n var ttfReader = this.fontInternal.ttfReader;\n for (var i = 0, len = glyphIndices.length; i < len; i++) {\n var glyphIndex = glyphIndices[i];\n var glyph = ttfReader.getGlyph(glyphIndex);\n if (glyph !== null && typeof glyph !== 'undefined') {\n width += glyph.width;\n }\n }\n }\n return { success: resultGlyph, width: width };\n };\n return PdfTrueTypeFont;\n}(PdfFont));\nexport { PdfTrueTypeFont };\n","/**\n * PdfPageTemplateElement.ts class for EJ2-Pdf\n */\nimport { PdfDockStyle, PdfAlignmentStyle, TemplateType } from './enum';\nimport { PointF, SizeF } from './../drawing/pdf-drawing';\nimport { PdfTemplate } from './../graphics/figures/pdf-template';\nimport { PdfPage } from './pdf-page';\nimport { RectangleF } from './../drawing/pdf-drawing';\n/**\n * Describes a `page template` object that can be used as header/footer, watermark or stamp.\n */\nvar PdfPageTemplateElement = /** @class */ (function () {\n /* tslint:disable */\n function PdfPageTemplateElement(arg1, arg2, arg3, arg4, arg5) {\n if (arg1 instanceof RectangleF && typeof arg2 === 'undefined') {\n this.constructor(arg1.x, arg1.y, arg1.width, arg1.height);\n }\n else if (arg1 instanceof RectangleF && arg2 instanceof PdfPage && typeof arg3 === 'undefined') {\n this.constructor(arg1.x, arg1.y, arg1.width, arg1.height, arg2);\n }\n else if (arg1 instanceof PointF && arg2 instanceof SizeF && typeof arg3 === 'undefined') {\n this.constructor(arg1.x, arg1.y, arg2.width, arg2.height);\n }\n else if (arg1 instanceof PointF && arg2 instanceof SizeF && arg3 instanceof PdfPage && typeof arg4 === 'undefined') {\n this.constructor(arg1.x, arg1.y, arg2.width, arg2.height, arg3);\n }\n else if (arg1 instanceof SizeF && typeof arg2 === 'undefined') {\n this.constructor(arg1.width, arg1.height);\n }\n else if (typeof arg1 === 'number' && typeof arg2 === 'number' && typeof arg3 === 'undefined') {\n this.constructor(0, 0, arg1, arg2);\n }\n else if (typeof arg1 === 'number' && typeof arg2 === 'number' && arg3 instanceof PdfPage && typeof arg4 === 'undefined') {\n this.constructor(0, 0, arg1, arg2, arg3);\n }\n else if (typeof arg1 === 'number' && typeof arg2 === 'number' && typeof arg3 === 'number' && typeof arg4 === 'number' && typeof arg5 === 'undefined') {\n this.x = arg1;\n this.y = arg2;\n this.pdfTemplate = new PdfTemplate(arg3, arg4);\n }\n else {\n this.x = arg1;\n this.y = arg2;\n this.pdfTemplate = new PdfTemplate(arg3, arg4);\n // this.graphics.colorSpace = this.page.document.colorSpace;\n }\n /* tslint:enable */\n }\n Object.defineProperty(PdfPageTemplateElement.prototype, \"dock\", {\n // Properties\n /**\n * Gets or sets the `dock style` of the page template element.\n * @private\n */\n get: function () {\n return this.dockStyle;\n },\n set: function (value) {\n // if (this.dockStyle !== value && this.Type === TemplateType.None) {\n this.dockStyle = value;\n // Reset alignment.\n this.resetAlignment();\n // }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageTemplateElement.prototype, \"alignment\", {\n /**\n * Gets or sets `alignment` of the page template element.\n * @private\n */\n get: function () {\n return this.alignmentStyle;\n },\n set: function (value) {\n // if (this.alignmentStyle !== value) {\n this.setAlignment(value);\n // }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageTemplateElement.prototype, \"foreground\", {\n /**\n * Indicates whether the page template is located `in front of the page layers or behind of it`.\n * @private\n */\n get: function () {\n return this.isForeground;\n },\n set: function (value) {\n // if (this.foreground !== value) {\n this.isForeground = value;\n // }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageTemplateElement.prototype, \"background\", {\n /**\n * Indicates whether the page template is located `behind of the page layers or in front of it`.\n * @private\n */\n get: function () {\n return !this.isForeground;\n },\n set: function (value) {\n this.isForeground = !value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageTemplateElement.prototype, \"location\", {\n /**\n * Gets or sets `location` of the page template element.\n * @private\n */\n get: function () {\n return this.currentLocation;\n },\n set: function (value) {\n if (this.type === TemplateType.None) {\n this.currentLocation = value;\n }\n else {\n //\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageTemplateElement.prototype, \"x\", {\n /**\n * Gets or sets `X` co-ordinate of the template element on the page.\n * @private\n */\n get: function () {\n var value = (typeof this.currentLocation !== 'undefined') ? this.currentLocation.x : 0;\n return value;\n },\n set: function (value) {\n if (this.type === TemplateType.None) {\n this.currentLocation.x = value;\n }\n else {\n //\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageTemplateElement.prototype, \"y\", {\n /**\n * Gets or sets `Y` co-ordinate of the template element on the page.\n * @private\n */\n get: function () {\n var value = (typeof this.currentLocation !== 'undefined') ? this.currentLocation.y : 0;\n return value;\n },\n set: function (value) {\n if (this.type === TemplateType.None) {\n this.currentLocation.y = value;\n }\n else {\n //\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageTemplateElement.prototype, \"size\", {\n /**\n * Gets or sets `size` of the page template element.\n * @private\n */\n get: function () {\n return this.template.size;\n },\n set: function (value) {\n if (this.type === TemplateType.None) {\n this.template.reset(value);\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageTemplateElement.prototype, \"width\", {\n /**\n * Gets or sets `width` of the page template element.\n * @private\n */\n get: function () {\n return this.template.width;\n },\n set: function (value) {\n if (this.template.width !== value && this.type === TemplateType.None) {\n var size = this.template.size;\n size.width = value;\n this.template.reset(size);\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageTemplateElement.prototype, \"height\", {\n /**\n * Gets or sets `height` of the page template element.\n * @private\n */\n get: function () {\n return this.template.height;\n },\n set: function (value) {\n if (this.template.height !== value && this.type === TemplateType.None) {\n var size = this.template.size;\n size.height = value;\n this.template.reset(size);\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageTemplateElement.prototype, \"graphics\", {\n /**\n * Gets `graphics` context of the page template element.\n * @private\n */\n get: function () {\n return this.template.graphics;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageTemplateElement.prototype, \"template\", {\n /**\n * Gets Pdf `template` object.\n * @private\n */\n get: function () {\n // if (typeof this.pdfTemplate === 'undefined' || this.pdfTemplate == null) {\n // this.pdfTemplate = new PdfTemplate(this.size);\n // }\n return this.pdfTemplate;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageTemplateElement.prototype, \"type\", {\n /**\n * Gets or sets `type` of the usage of this page template.\n * @private\n */\n get: function () {\n return this.templateType;\n },\n set: function (value) {\n this.updateDocking(value);\n this.templateType = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPageTemplateElement.prototype, \"bounds\", {\n /**\n * Gets or sets `bounds` of the page template.\n * @public\n */\n get: function () {\n return new RectangleF(new PointF(this.x, this.y), this.size);\n },\n set: function (value) {\n if (this.type === TemplateType.None) {\n this.location = new PointF(value.x, value.y);\n this.size = new SizeF(value.width, value.height);\n }\n },\n enumerable: true,\n configurable: true\n });\n /**\n * `Updates Dock` property if template is used as header/footer.\n * @private\n */\n PdfPageTemplateElement.prototype.updateDocking = function (type) {\n if (type !== TemplateType.None) {\n switch (type) {\n case TemplateType.Top:\n this.dock = PdfDockStyle.Top;\n break;\n case TemplateType.Bottom:\n this.dock = PdfDockStyle.Bottom;\n break;\n case TemplateType.Left:\n this.dock = PdfDockStyle.Left;\n break;\n case TemplateType.Right:\n this.dock = PdfDockStyle.Right;\n break;\n }\n this.resetAlignment();\n }\n };\n /**\n * `Resets alignment` of the template.\n * @private\n */\n PdfPageTemplateElement.prototype.resetAlignment = function () {\n this.alignment = PdfAlignmentStyle.None;\n };\n /**\n * `Sets alignment` of the template.\n * @private\n */\n PdfPageTemplateElement.prototype.setAlignment = function (alignment) {\n if (this.dock === PdfDockStyle.None) {\n this.alignmentStyle = alignment;\n }\n else {\n // Template is docked and alignment has been changed.\n var canBeSet = false;\n switch (this.dock) {\n case PdfDockStyle.Left:\n canBeSet = (alignment === PdfAlignmentStyle.TopLeft || alignment === PdfAlignmentStyle.MiddleLeft ||\n alignment === PdfAlignmentStyle.BottomLeft || alignment === PdfAlignmentStyle.None);\n break;\n case PdfDockStyle.Top:\n canBeSet = (alignment === PdfAlignmentStyle.TopLeft || alignment === PdfAlignmentStyle.TopCenter ||\n alignment === PdfAlignmentStyle.TopRight || alignment === PdfAlignmentStyle.None);\n break;\n case PdfDockStyle.Right:\n canBeSet = (alignment === PdfAlignmentStyle.TopRight || alignment === PdfAlignmentStyle.MiddleRight ||\n alignment === PdfAlignmentStyle.BottomRight || alignment === PdfAlignmentStyle.None);\n break;\n case PdfDockStyle.Bottom:\n canBeSet = (alignment === PdfAlignmentStyle.BottomLeft || alignment === PdfAlignmentStyle.BottomCenter\n || alignment === PdfAlignmentStyle.BottomRight || alignment === PdfAlignmentStyle.None);\n break;\n case PdfDockStyle.Fill:\n canBeSet = (alignment === PdfAlignmentStyle.MiddleCenter || alignment === PdfAlignmentStyle.None);\n break;\n }\n if (canBeSet) {\n this.alignmentStyle = alignment;\n }\n }\n };\n /**\n * Draws the template.\n * @private\n */\n PdfPageTemplateElement.prototype.draw = function (layer, document) {\n var page = layer.page;\n var bounds = this.calculateBounds(page, document);\n if (bounds.x === -0) {\n bounds.x = 0;\n }\n layer.graphics.drawPdfTemplate(this.template, new PointF(bounds.x, bounds.y), new SizeF(bounds.width, bounds.height));\n };\n /**\n * Calculates bounds of the page template.\n * @private\n */\n PdfPageTemplateElement.prototype.calculateBounds = function (page, document) {\n var result = this.bounds;\n if (this.alignmentStyle !== PdfAlignmentStyle.None) {\n result = this.getAlignmentBounds(page, document);\n }\n else if (this.dockStyle !== PdfDockStyle.None) {\n result = this.getDockBounds(page, document);\n }\n return result;\n };\n /**\n * Calculates bounds according to the alignment.\n * @private\n */\n PdfPageTemplateElement.prototype.getAlignmentBounds = function (page, document) {\n var result = this.bounds;\n if (this.type === TemplateType.None) {\n result = this.getSimpleAlignmentBounds(page, document);\n }\n else {\n result = this.getTemplateAlignmentBounds(page, document);\n }\n return result;\n };\n /**\n * Calculates bounds according to the alignment.\n * @private\n */\n PdfPageTemplateElement.prototype.getSimpleAlignmentBounds = function (page, document) {\n var bounds = this.bounds;\n var pdfSection = page.section;\n var actualBounds = pdfSection.getActualBounds(document, page, false);\n var x = this.x;\n var y = this.y;\n switch (this.alignmentStyle) {\n case PdfAlignmentStyle.TopLeft:\n x = 0;\n y = 0;\n break;\n case PdfAlignmentStyle.TopCenter:\n x = (actualBounds.width - this.width) / 2;\n y = 0;\n break;\n case PdfAlignmentStyle.TopRight:\n x = actualBounds.width - this.width;\n y = 0;\n break;\n case PdfAlignmentStyle.MiddleLeft:\n x = 0;\n y = (actualBounds.height - this.height) / 2;\n break;\n case PdfAlignmentStyle.MiddleCenter:\n x = (actualBounds.width - this.width) / 2;\n y = (actualBounds.height - this.height) / 2;\n break;\n case PdfAlignmentStyle.MiddleRight:\n x = actualBounds.width - this.width;\n y = (actualBounds.height - this.height) / 2;\n break;\n case PdfAlignmentStyle.BottomLeft:\n x = 0;\n y = actualBounds.height - this.height;\n break;\n case PdfAlignmentStyle.BottomCenter:\n x = (actualBounds.width - this.width) / 2;\n y = actualBounds.height - this.height;\n break;\n case PdfAlignmentStyle.BottomRight:\n x = actualBounds.width - this.width;\n y = actualBounds.height - this.height;\n break;\n }\n bounds.x = x;\n bounds.y = y;\n return bounds;\n };\n /**\n * Calculates bounds according to the alignment.\n * @private\n */\n PdfPageTemplateElement.prototype.getTemplateAlignmentBounds = function (page, document) {\n var result = this.bounds;\n var section = page.section;\n var actualBounds = section.getActualBounds(document, page, false);\n var x = this.x;\n var y = this.y;\n switch (this.alignmentStyle) {\n case PdfAlignmentStyle.TopLeft:\n if (this.type === TemplateType.Left) {\n x = -actualBounds.x;\n y = 0;\n }\n else if (this.type === TemplateType.Top) {\n x = -actualBounds.x;\n y = -actualBounds.y;\n }\n break;\n case PdfAlignmentStyle.TopCenter:\n x = (actualBounds.width - this.width) / 2;\n y = -actualBounds.y;\n break;\n case PdfAlignmentStyle.TopRight:\n if (this.type === TemplateType.Right) {\n x = actualBounds.width + section.getRightIndentWidth(document, page, false) - this.width;\n y = 0;\n }\n else if (this.type === TemplateType.Top) {\n x = actualBounds.width + section.getRightIndentWidth(document, page, false) - this.width;\n y = -actualBounds.y;\n }\n break;\n case PdfAlignmentStyle.MiddleLeft:\n x = -actualBounds.x;\n y = (actualBounds.height - this.height) / 2;\n break;\n case PdfAlignmentStyle.MiddleCenter:\n x = (actualBounds.width - this.width) / 2;\n y = (actualBounds.height - this.height) / 2;\n break;\n case PdfAlignmentStyle.MiddleRight:\n x = actualBounds.width + section.getRightIndentWidth(document, page, false) - this.width;\n y = (actualBounds.height - this.height) / 2;\n break;\n case PdfAlignmentStyle.BottomLeft:\n if (this.type === TemplateType.Left) {\n x = -actualBounds.x;\n y = actualBounds.height - this.height;\n }\n else if (this.type === TemplateType.Bottom) {\n x = -actualBounds.x;\n y = actualBounds.height + section.getBottomIndentHeight(document, page, false) - this.height;\n }\n break;\n case PdfAlignmentStyle.BottomCenter:\n x = (actualBounds.width - this.width) / 2;\n y = actualBounds.height + section.getBottomIndentHeight(document, page, false) - this.height;\n break;\n case PdfAlignmentStyle.BottomRight:\n if (this.type === TemplateType.Right) {\n x = actualBounds.width + section.getRightIndentWidth(document, page, false) - this.width;\n y = actualBounds.height - this.height;\n }\n else if (this.type === TemplateType.Bottom) {\n x = actualBounds.width + section.getRightIndentWidth(document, page, false) - this.width;\n y = actualBounds.height + section.getBottomIndentHeight(document, page, false) - this.height;\n }\n break;\n }\n result.x = x;\n result.y = y;\n return result;\n };\n /**\n * Calculates bounds according to the docking.\n * @private\n */\n PdfPageTemplateElement.prototype.getDockBounds = function (page, document) {\n var result = this.bounds;\n if (this.type === TemplateType.None) {\n result = this.getSimpleDockBounds(page, document);\n }\n else {\n result = this.getTemplateDockBounds(page, document);\n }\n return result;\n };\n /**\n * Calculates bounds according to the docking.\n * @private\n */\n PdfPageTemplateElement.prototype.getSimpleDockBounds = function (page, document) {\n var result = this.bounds;\n var section = page.section;\n var actualBounds = section.getActualBounds(document, page, false);\n var x = this.x;\n var y = this.y;\n var width = this.width;\n var height = this.height;\n switch (this.dockStyle) {\n case PdfDockStyle.Left:\n x = 0;\n y = 0;\n width = this.width;\n height = actualBounds.height;\n break;\n case PdfDockStyle.Top:\n x = 0;\n y = 0;\n width = actualBounds.width;\n height = this.height;\n break;\n case PdfDockStyle.Right:\n x = actualBounds.width - this.width;\n y = 0;\n width = this.width;\n height = actualBounds.height;\n break;\n case PdfDockStyle.Bottom:\n x = 0;\n y = actualBounds.height - this.height;\n width = actualBounds.width;\n height = this.height;\n break;\n case PdfDockStyle.Fill:\n x = 0;\n x = 0;\n width = actualBounds.width;\n height = actualBounds.height;\n break;\n }\n result = new RectangleF(x, y, width, height);\n return result;\n };\n /**\n * Calculates template bounds basing on docking if template is a page template.\n * @private\n */\n PdfPageTemplateElement.prototype.getTemplateDockBounds = function (page, document) {\n var result = this.bounds;\n var section = page.section;\n var actualBounds = section.getActualBounds(document, page, false);\n var actualSize = section.pageSettings.getActualSize();\n var x = this.x;\n var y = this.y;\n var width = this.width;\n var height = this.height;\n switch (this.dockStyle) {\n case PdfDockStyle.Left:\n x = -actualBounds.x;\n y = 0;\n width = this.width;\n height = actualBounds.height;\n break;\n case PdfDockStyle.Top:\n x = -actualBounds.x;\n y = -actualBounds.y;\n width = actualSize.width;\n height = this.height;\n if (actualBounds.height < 0) {\n y = -actualBounds.y + actualSize.height;\n }\n break;\n case PdfDockStyle.Right:\n x = actualBounds.width + section.getRightIndentWidth(document, page, false) - this.width;\n y = 0;\n width = this.width;\n height = actualBounds.height;\n break;\n case PdfDockStyle.Bottom:\n x = -actualBounds.x;\n y = actualBounds.height + section.getBottomIndentHeight(document, page, false) - this.height;\n width = actualSize.width;\n height = this.height;\n if (actualBounds.height < 0) {\n y -= actualSize.height;\n }\n break;\n case PdfDockStyle.Fill:\n x = 0;\n x = 0;\n width = actualBounds.width;\n height = actualBounds.height;\n break;\n }\n result = new RectangleF(x, y, width, height);\n return result;\n };\n return PdfPageTemplateElement;\n}());\nexport { PdfPageTemplateElement };\n","/**\n * PdfBorders.ts class for EJ2-PDF\n */\nimport { PdfPen } from './../../../graphics/pdf-pen';\nimport { PdfDashStyle } from './../../../graphics/enum';\nimport { PdfColor } from './../../../graphics/pdf-color';\n/**\n * `PdfBorders` class used represents the cell border of the PDF grid.\n */\nvar PdfBorders = /** @class */ (function () {\n // Constructor\n /**\n * Create a new instance for `PdfBorders` class.\n * @private\n */\n function PdfBorders() {\n var defaultBorderPenLeft = new PdfPen(new PdfColor(0, 0, 0));\n defaultBorderPenLeft.dashStyle = PdfDashStyle.Solid;\n var defaultBorderPenRight = new PdfPen(new PdfColor(0, 0, 0));\n defaultBorderPenRight.dashStyle = PdfDashStyle.Solid;\n var defaultBorderPenTop = new PdfPen(new PdfColor(0, 0, 0));\n defaultBorderPenTop.dashStyle = PdfDashStyle.Solid;\n var defaultBorderPenBottom = new PdfPen(new PdfColor(0, 0, 0));\n defaultBorderPenBottom.dashStyle = PdfDashStyle.Solid;\n this.leftPen = defaultBorderPenLeft;\n this.rightPen = defaultBorderPenRight;\n this.topPen = defaultBorderPenTop;\n this.bottomPen = defaultBorderPenBottom;\n }\n Object.defineProperty(PdfBorders.prototype, \"left\", {\n // Properties\n /**\n * Gets or sets the `Left`.\n * @private\n */\n get: function () {\n return this.leftPen;\n },\n set: function (value) {\n this.leftPen = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfBorders.prototype, \"right\", {\n /**\n * Gets or sets the `Right`.\n * @private\n */\n get: function () {\n return this.rightPen;\n },\n set: function (value) {\n this.rightPen = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfBorders.prototype, \"top\", {\n /**\n * Gets or sets the `Top`.\n * @private\n */\n get: function () {\n return this.topPen;\n },\n set: function (value) {\n this.topPen = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfBorders.prototype, \"bottom\", {\n /**\n * Gets or sets the `Bottom`.\n * @private\n */\n get: function () {\n return this.bottomPen;\n },\n set: function (value) {\n this.bottomPen = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfBorders.prototype, \"all\", {\n /**\n * sets the `All`.\n * @private\n */\n set: function (value) {\n this.leftPen = this.rightPen = this.topPen = this.bottomPen = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfBorders.prototype, \"isAll\", {\n /**\n * Gets a value indicating whether this instance `is all`.\n * @private\n */\n get: function () {\n return ((this.leftPen === this.rightPen) && (this.leftPen === this.topPen) && (this.leftPen === this.bottomPen));\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfBorders, \"default\", {\n /**\n * Gets the `default`.\n * @private\n */\n get: function () {\n return new PdfBorders();\n },\n enumerable: true,\n configurable: true\n });\n return PdfBorders;\n}());\nexport { PdfBorders };\nvar PdfPaddings = /** @class */ (function () {\n function PdfPaddings(left, right, top, bottom) {\n /**\n * The 'left' border padding set.\n * @private\n */\n this.hasLeftPad = false;\n /**\n * The 'right' border padding set.\n * @private\n */\n this.hasRightPad = false;\n /**\n * The 'top' border padding set.\n * @private\n */\n this.hasTopPad = false;\n /**\n * The 'bottom' border padding set.\n * @private\n */\n this.hasBottomPad = false;\n if (typeof left === 'undefined') {\n //5.76 and 0 are taken from ms-word default table margins.\n this.leftPad = this.rightPad = 5.76;\n //0.5 is set for top and bottom by default.\n this.bottomPad = this.topPad = 0.5;\n }\n else {\n this.leftPad = left;\n this.rightPad = right;\n this.topPad = top;\n this.bottomPad = bottom;\n this.hasLeftPad = true;\n this.hasRightPad = true;\n this.hasTopPad = true;\n this.hasBottomPad = true;\n }\n }\n Object.defineProperty(PdfPaddings.prototype, \"left\", {\n // Properties\n /**\n * Gets or sets the `left` value of the edge\n * @private\n */\n get: function () {\n return this.leftPad;\n },\n set: function (value) {\n this.leftPad = value;\n this.hasLeftPad = true;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPaddings.prototype, \"right\", {\n /**\n * Gets or sets the `right` value of the edge.\n * @private\n */\n get: function () {\n return this.rightPad;\n },\n set: function (value) {\n this.rightPad = value;\n this.hasRightPad = true;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPaddings.prototype, \"top\", {\n /**\n * Gets or sets the `top` value of the edge\n * @private\n */\n get: function () {\n return this.topPad;\n },\n set: function (value) {\n this.topPad = value;\n this.hasTopPad = true;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPaddings.prototype, \"bottom\", {\n /**\n * Gets or sets the `bottom` value of the edge.\n * @private\n */\n get: function () {\n return this.bottomPad;\n },\n set: function (value) {\n this.bottomPad = value;\n this.hasBottomPad = true;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfPaddings.prototype, \"all\", {\n /**\n * Sets value to all sides `left,right,top and bottom`.s\n * @private\n */\n set: function (value) {\n this.leftPad = this.rightPad = this.topPad = this.bottomPad = value;\n this.hasLeftPad = true;\n this.hasRightPad = true;\n this.hasTopPad = true;\n this.hasBottomPad = true;\n },\n enumerable: true,\n configurable: true\n });\n return PdfPaddings;\n}());\nexport { PdfPaddings };\n","/**\n * public Enum for `PdfBorderOverlapStyle`.\n * @private\n */\nexport var PdfBorderOverlapStyle;\n(function (PdfBorderOverlapStyle) {\n /**\n * Specifies the type of `Overlap`.\n * @private\n */\n PdfBorderOverlapStyle[PdfBorderOverlapStyle[\"Overlap\"] = 0] = \"Overlap\";\n /**\n * Specifies the type of `Inside`.\n * @private\n */\n PdfBorderOverlapStyle[PdfBorderOverlapStyle[\"Inside\"] = 1] = \"Inside\";\n})(PdfBorderOverlapStyle || (PdfBorderOverlapStyle = {}));\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfBorders, PdfPaddings } from './pdf-borders';\nimport { PdfBorderOverlapStyle } from './../../tables/light-tables/enum';\n/**\n * Base class for the `grid style`,\n */\nvar PdfGridStyleBase = /** @class */ (function () {\n function PdfGridStyleBase() {\n }\n Object.defineProperty(PdfGridStyleBase.prototype, \"backgroundBrush\", {\n // Properties\n /**\n * Gets or sets the `background brush`.\n * @private\n */\n get: function () {\n return this.gridBackgroundBrush;\n },\n set: function (value) {\n this.gridBackgroundBrush = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridStyleBase.prototype, \"textBrush\", {\n /**\n * Gets or sets the `text brush`.\n * @private\n */\n get: function () {\n return this.gridTextBrush;\n },\n set: function (value) {\n this.gridTextBrush = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridStyleBase.prototype, \"textPen\", {\n /**\n * Gets or sets the `text pen`.\n * @private\n */\n get: function () {\n return this.gridTextPen;\n },\n set: function (value) {\n this.gridTextPen = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridStyleBase.prototype, \"font\", {\n /**\n * Gets or sets the `font`.\n * @private\n */\n get: function () {\n return this.gridFont;\n },\n set: function (value) {\n this.gridFont = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridStyleBase.prototype, \"backgroundImage\", {\n /**\n * Gets or sets the `background Image`.\n * @private\n */\n get: function () {\n return this.gridBackgroundImage;\n },\n set: function (value) {\n this.gridBackgroundImage = value;\n },\n enumerable: true,\n configurable: true\n });\n return PdfGridStyleBase;\n}());\nexport { PdfGridStyleBase };\n/**\n * `PdfGridStyle` class provides customization of the appearance for the 'PdfGrid'.\n */\nvar PdfGridStyle = /** @class */ (function (_super) {\n __extends(PdfGridStyle, _super);\n //constructor\n /**\n * Initialize a new instance for `PdfGridStyle` class.\n * @private\n */\n function PdfGridStyle() {\n var _this = _super.call(this) || this;\n _this.gridBorderOverlapStyle = PdfBorderOverlapStyle.Overlap;\n _this.bAllowHorizontalOverflow = false;\n _this.gridHorizontalOverflowType = PdfHorizontalOverflowType.LastPage;\n return _this;\n }\n Object.defineProperty(PdfGridStyle.prototype, \"cellSpacing\", {\n //Properties\n /**\n * Gets or sets the `cell spacing` of the 'PdfGrid'.\n * @private\n */\n get: function () {\n if (typeof this.gridCellSpacing === 'undefined') {\n this.gridCellSpacing = 0;\n }\n return this.gridCellSpacing;\n },\n set: function (value) {\n this.gridCellSpacing = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridStyle.prototype, \"horizontalOverflowType\", {\n /**\n * Gets or sets the type of the `horizontal overflow` of the 'PdfGrid'.\n * @private\n */\n get: function () {\n return this.gridHorizontalOverflowType;\n },\n set: function (value) {\n this.gridHorizontalOverflowType = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridStyle.prototype, \"allowHorizontalOverflow\", {\n /**\n * Gets or sets a value indicating whether to `allow horizontal overflow`.\n * @private\n */\n get: function () {\n return this.bAllowHorizontalOverflow;\n },\n set: function (value) {\n this.bAllowHorizontalOverflow = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridStyle.prototype, \"cellPadding\", {\n /**\n * Gets or sets the `cell padding`.\n * @private\n */\n get: function () {\n if (typeof this.gridCellPadding === 'undefined') {\n this.gridCellPadding = new PdfPaddings();\n }\n return this.gridCellPadding;\n },\n set: function (value) {\n if (typeof this.gridCellPadding === 'undefined') {\n this.gridCellPadding = new PdfPaddings();\n this.gridCellPadding = value;\n }\n else {\n this.gridCellPadding = value;\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridStyle.prototype, \"borderOverlapStyle\", {\n /**\n * Gets or sets the `border overlap style` of the 'PdfGrid'.\n * @private\n */\n get: function () {\n return this.gridBorderOverlapStyle;\n },\n set: function (value) {\n this.gridBorderOverlapStyle = value;\n },\n enumerable: true,\n configurable: true\n });\n return PdfGridStyle;\n}(PdfGridStyleBase));\nexport { PdfGridStyle };\n/**\n * `PdfGridCellStyle` class provides customization of the appearance for the 'PdfGridCell'.\n */\nvar PdfGridCellStyle = /** @class */ (function (_super) {\n __extends(PdfGridCellStyle, _super);\n /**\n * Initializes a new instance of the `PdfGridCellStyle` class.\n * @private\n */\n function PdfGridCellStyle() {\n var _this = _super.call(this) || this;\n /**\n * @hidden\n * @private\n */\n _this.gridCellBorders = PdfBorders.default;\n return _this;\n }\n Object.defineProperty(PdfGridCellStyle.prototype, \"stringFormat\", {\n //Properties\n /**\n * Gets the `string format` of the 'PdfGridCell'.\n * @private\n */\n get: function () {\n return this.format;\n },\n set: function (value) {\n this.format = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCellStyle.prototype, \"borders\", {\n /**\n * Gets or sets the `border` of the 'PdfGridCell'.\n * @private\n */\n get: function () {\n return this.gridCellBorders;\n },\n set: function (value) {\n this.gridCellBorders = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCellStyle.prototype, \"cellPadding\", {\n /**\n * Gets or sets the `cell padding`.\n * @private\n */\n get: function () {\n return this.gridCellPadding;\n },\n set: function (value) {\n if (this.gridCellPadding == null || typeof this.gridCellPadding === 'undefined') {\n this.gridCellPadding = new PdfPaddings();\n }\n this.gridCellPadding = value;\n },\n enumerable: true,\n configurable: true\n });\n return PdfGridCellStyle;\n}(PdfGridStyleBase));\nexport { PdfGridCellStyle };\n/**\n * `PdfGridRowStyle` class provides customization of the appearance for the `PdfGridRow`.\n */\nvar PdfGridRowStyle = /** @class */ (function () {\n // public setBackgroundImage(value : PdfImage) : void {\n // this.gridRowBackgroundImage = value;\n // if (typeof this.parent !== 'undefined') {\n // for (let i : number = 0; i < this.parent.cells.count; i++) {\n // this.parent.cells.getCell(i).style.backgroundImage = value;\n // }\n // }\n // }\n // Constructor\n /**\n * Initializes a new instance of the `PdfGridRowStyle` class.\n * @private\n */\n function PdfGridRowStyle() {\n //\n }\n Object.defineProperty(PdfGridRowStyle.prototype, \"backgroundBrush\", {\n // Properties\n /**\n * Gets or sets the `background brush`.\n * @private\n */\n get: function () {\n return this.gridRowBackgroundBrush;\n },\n enumerable: true,\n configurable: true\n });\n PdfGridRowStyle.prototype.setBackgroundBrush = function (value) {\n this.gridRowBackgroundBrush = value;\n if (typeof this.parent !== 'undefined') {\n for (var i = 0; i < this.parent.cells.count; i++) {\n this.parent.cells.getCell(i).style.backgroundBrush = value;\n }\n }\n };\n Object.defineProperty(PdfGridRowStyle.prototype, \"textBrush\", {\n /**\n * Gets or sets the `text brush`.\n * @private\n */\n get: function () {\n return this.gridRowTextBrush;\n },\n enumerable: true,\n configurable: true\n });\n PdfGridRowStyle.prototype.setTextBrush = function (value) {\n this.gridRowTextBrush = value;\n if (typeof this.parent !== 'undefined') {\n for (var i = 0; i < this.parent.cells.count; i++) {\n this.parent.cells.getCell(i).style.textBrush = value;\n }\n }\n };\n Object.defineProperty(PdfGridRowStyle.prototype, \"textPen\", {\n /**\n * Gets or sets the `text pen`.\n * @private\n */\n get: function () {\n return this.gridRowTextPen;\n },\n enumerable: true,\n configurable: true\n });\n PdfGridRowStyle.prototype.setTextPen = function (value) {\n this.gridRowTextPen = value;\n if (typeof this.parent !== 'undefined') {\n for (var i = 0; i < this.parent.cells.count; i++) {\n this.parent.cells.getCell(i).style.textPen = value;\n }\n }\n };\n Object.defineProperty(PdfGridRowStyle.prototype, \"font\", {\n /**\n * Gets or sets the `font`.\n * @private\n */\n get: function () {\n return this.gridRowFont;\n },\n enumerable: true,\n configurable: true\n });\n PdfGridRowStyle.prototype.setFont = function (value) {\n this.gridRowFont = value;\n if (typeof this.parent !== 'undefined') {\n for (var i = 0; i < this.parent.cells.count; i++) {\n this.parent.cells.getCell(i).style.font = value;\n }\n }\n };\n Object.defineProperty(PdfGridRowStyle.prototype, \"border\", {\n /**\n * Gets or sets the `border` of the current row.\n * @private\n */\n get: function () {\n if (typeof this.gridRowBorder === 'undefined') {\n this.setBorder(new PdfBorders());\n }\n return this.gridRowBorder;\n },\n enumerable: true,\n configurable: true\n });\n PdfGridRowStyle.prototype.setBorder = function (value) {\n this.gridRowBorder = value;\n if (typeof this.parent !== 'undefined') {\n for (var i = 0; i < this.parent.cells.count; i++) {\n this.parent.cells.getCell(i).style.borders = value;\n }\n }\n };\n /**\n * sets the `parent row` of the current object.\n * @private\n */\n PdfGridRowStyle.prototype.setParent = function (parent) {\n this.parent = parent;\n };\n Object.defineProperty(PdfGridRowStyle.prototype, \"backgroundImage\", {\n /**\n * Gets or sets the `backgroundImage` of the 'PdfGridCell'.\n * @private\n */\n get: function () {\n return this.gridRowBackgroundImage;\n },\n enumerable: true,\n configurable: true\n });\n return PdfGridRowStyle;\n}());\nexport { PdfGridRowStyle };\n/**\n * public Enum for `PdfHorizontalOverflowType`.\n * @private\n */\nexport var PdfHorizontalOverflowType;\n(function (PdfHorizontalOverflowType) {\n /**\n * Specifies the type of `NextPage`.\n * @private\n */\n PdfHorizontalOverflowType[PdfHorizontalOverflowType[\"NextPage\"] = 0] = \"NextPage\";\n /**\n * Specifies the type of `LastPage`.\n * @private\n */\n PdfHorizontalOverflowType[PdfHorizontalOverflowType[\"LastPage\"] = 1] = \"LastPage\";\n})(PdfHorizontalOverflowType || (PdfHorizontalOverflowType = {}));\n","import { PdfGrid } from './pdf-grid';\nimport { PdfGridCellStyle } from './styles/style';\nimport { PdfStringLayouter } from './../../graphics/fonts/string-layouter';\nimport { PdfDocument } from './../../document/pdf-document';\nimport { PdfStringFormat } from './../../graphics/fonts/pdf-string-format';\nimport { RectangleF, PointF, SizeF } from './../../drawing/pdf-drawing';\nimport { PdfDashStyle, PdfLineCap } from './../../graphics/enum';\nimport { PdfBorderOverlapStyle } from './../tables/light-tables/enum';\nimport { PdfSolidBrush } from './../../graphics/brushes/pdf-solid-brush';\nimport { PdfColor } from './../../graphics/pdf-color';\nimport { PdfImage } from './../../graphics/images/pdf-image';\nimport { PdfBitmap } from './../../graphics/images/pdf-bitmap';\nimport { PdfTextWebLink } from './../../annotations/pdf-text-web-link';\nimport { PdfLayoutType } from './../../graphics/figures/enum';\nimport { PdfGridLayouter, PdfGridLayoutFormat } from './../../structured-elements/grid/layout/grid-layouter';\nimport { PdfLayoutParams } from '../../../implementation/graphics/figures/base/element-layouter';\n/**\n * `PdfGridCell` class represents the schema of a cell in a 'PdfGrid'.\n */\nvar PdfGridCell = /** @class */ (function () {\n function PdfGridCell(row) {\n /**\n * `Width` of the cell.\n * @default 0\n * @private\n */\n this.cellWidth = 0;\n /**\n * `Height` of the cell.\n * @default 0\n * @private\n */\n this.cellHeight = 0;\n /**\n * `tempval`to stores current width .\n * @default 0\n * @private\n */\n this.tempval = 0;\n this.fontSpilt = false;\n /**\n * Specifies weather the `cell is drawn`.\n * @default true\n * @private\n */\n this.finsh = true;\n /**\n * The `remaining height` of row span.\n * @default 0\n * @private\n */\n this.rowSpanRemainingHeight = 0;\n this.hasRowSpan = false;\n this.hasColSpan = false;\n /**\n * the 'isFinish' is set to page finish\n */\n this.isFinish = true;\n /**\n * The `present' to store the current cell.\n * @default false\n * @private\n */\n this.present = false;\n if (typeof row === 'undefined') {\n this.gridRowSpan = 1;\n this.colSpan = 1;\n }\n else {\n this.constructor();\n this.gridRow = row;\n }\n }\n Object.defineProperty(PdfGridCell.prototype, \"isCellMergeContinue\", {\n //Properties\n get: function () {\n return this.internalIsCellMergeContinue;\n },\n set: function (value) {\n this.internalIsCellMergeContinue = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCell.prototype, \"isRowMergeContinue\", {\n get: function () {\n return this.internalIsRowMergeContinue;\n },\n set: function (value) {\n this.internalIsRowMergeContinue = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCell.prototype, \"isCellMergeStart\", {\n get: function () {\n return this.internalIsCellMergeStart;\n },\n set: function (value) {\n this.internalIsCellMergeStart = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCell.prototype, \"isRowMergeStart\", {\n get: function () {\n return this.internalIsRowMergeStart;\n },\n set: function (value) {\n this.internalIsRowMergeStart = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCell.prototype, \"remainingString\", {\n /**\n * Gets or sets the `remaining string` after the row split between pages.\n * @private\n */\n get: function () {\n return this.remaining;\n },\n set: function (value) {\n this.remaining = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCell.prototype, \"FinishedDrawingCell\", {\n /**\n * Gets or sets the `FinishedDrawingCell` .\n * @private\n */\n get: function () {\n return this.isFinish;\n },\n set: function (value) {\n this.isFinish = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCell.prototype, \"stringFormat\", {\n /**\n * Gets or sets the `string format`.\n * @private\n */\n get: function () {\n if (this.format == null) {\n this.format = new PdfStringFormat();\n }\n return this.format;\n },\n set: function (value) {\n this.format = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCell.prototype, \"row\", {\n /**\n * Gets or sets the parent `row`.\n * @private\n */\n get: function () {\n return this.gridRow;\n },\n set: function (value) {\n this.gridRow = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCell.prototype, \"value\", {\n /**\n * Gets or sets the `value` of the cell.\n * @private\n */\n get: function () {\n return this.objectValue;\n },\n set: function (value) {\n this.objectValue = value;\n if (this.objectValue instanceof PdfGrid) {\n this.row.grid.isSingleGrid = false;\n var grid = this.objectValue;\n grid.ParentCell = this;\n this.objectValue.isChildGrid = true;\n var rowCount = this.row.grid.rows.count;\n for (var i = 0; i < rowCount; i++) {\n var row = this.row.grid.rows.getRow(i);\n var colCount = row.cells.count;\n for (var j = 0; j < colCount; j++) {\n var cell = row.cells.getCell(j);\n cell.parent = this;\n }\n }\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCell.prototype, \"rowSpan\", {\n /**\n * Gets or sets a value that indicates the total number of rows that cell `spans` within a PdfGrid.\n * @private\n */\n get: function () {\n return this.gridRowSpan;\n },\n set: function (value) {\n if (value < 1) {\n throw new Error('ArgumentException : Invalid span specified, must be greater than or equal to 1');\n }\n else {\n this.gridRowSpan = value;\n this.row.rowSpanExists = true;\n this.row.grid.hasRowSpanSpan = true;\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCell.prototype, \"style\", {\n /**\n * Gets or sets the cell `style`.\n * @private\n */\n get: function () {\n if (this.cellStyle == null) {\n this.cellStyle = new PdfGridCellStyle();\n }\n return this.cellStyle;\n },\n set: function (value) {\n this.cellStyle = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCell.prototype, \"height\", {\n /**\n * Gets the `height` of the PdfGrid cell.[Read-Only].\n * @private\n */\n get: function () {\n if (this.cellHeight === 0) {\n this.cellHeight = this.measureHeight();\n }\n return this.cellHeight;\n },\n set: function (value) {\n this.cellHeight = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCell.prototype, \"columnSpan\", {\n /**\n * Gets or sets a value that indicates the total number of columns that cell `spans` within a PdfGrid.\n * @private\n */\n get: function () {\n return this.colSpan;\n },\n set: function (value) {\n if (value < 1) {\n throw Error('Invalid span specified, must be greater than or equal to 1');\n }\n else {\n this.colSpan = value;\n this.row.columnSpanExists = true;\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridCell.prototype, \"width\", {\n /**\n * Gets the `width` of the PdfGrid cell.[Read-Only].\n * @private\n */\n get: function () {\n if (this.cellWidth === 0 || this.row.grid.isComplete) {\n this.cellWidth = this.measureWidth();\n }\n return Math.round(this.cellWidth);\n },\n set: function (value) {\n this.cellWidth = value;\n },\n enumerable: true,\n configurable: true\n });\n //Implementation\n /**\n * `Calculates the width`.\n * @private\n */\n PdfGridCell.prototype.measureWidth = function () {\n // .. Calculate the cell text width.\n // .....Add border widths, cell spacings and paddings to the width.\n var width = 0;\n var layouter = new PdfStringLayouter();\n if (typeof this.objectValue === 'string') {\n /* tslint:disable */\n var slr = layouter.layout(this.objectValue, this.getTextFont(), this.stringFormat, new SizeF(Number.MAX_VALUE, Number.MAX_VALUE), false, new SizeF(0, 0));\n width += slr.actualSize.width;\n width += (this.style.borders.left.width + this.style.borders.right.width) * 2;\n }\n else if (this.objectValue instanceof PdfGrid) {\n width = this.objectValue.size.width;\n //width += this.objectValue.style.cellSpacing;\n }\n else if (this.objectValue instanceof PdfImage || this.objectValue instanceof PdfBitmap) {\n width += this.objectValue.width;\n }\n else if (this.objectValue instanceof PdfTextWebLink) {\n var webLink = this.objectValue;\n var result = layouter.layout(webLink.text, webLink.font, webLink.stringFormat, new SizeF(0, 0), false, new SizeF(0, 0));\n /* tslint:enable */\n width += result.actualSize.width;\n width += (this.style.borders.left.width + this.style.borders.right.width) * 2;\n }\n if (!(this.objectValue instanceof PdfGrid)) {\n if (this.style.cellPadding != null) {\n width += (this.style.cellPadding.left + this.style.cellPadding.right);\n }\n else {\n width += (this.row.grid.style.cellPadding.left + this.row.grid.style.cellPadding.right);\n }\n }\n else {\n if (this.style.cellPadding != null || typeof this.style.cellPadding !== 'undefined') {\n if (typeof this.style.cellPadding.left !== 'undefined' && this.style.cellPadding.hasLeftPad) {\n width += this.style.cellPadding.left;\n }\n if (typeof this.style.cellPadding.right !== 'undefined' && this.style.cellPadding.hasRightPad) {\n width += this.style.cellPadding.right;\n }\n }\n else {\n if (typeof this.row.grid.style.cellPadding.left !== 'undefined' && this.row.grid.style.cellPadding.hasLeftPad) {\n width += this.row.grid.style.cellPadding.left;\n }\n if (typeof this.row.grid.style.cellPadding.right !== 'undefined' && this.row.grid.style.cellPadding.hasRightPad) {\n width += this.row.grid.style.cellPadding.right;\n }\n }\n }\n width += this.row.grid.style.cellSpacing;\n return width;\n };\n /**\n * Draw the `cell background`.\n * @private\n */\n PdfGridCell.prototype.drawCellBackground = function (graphics, bounds) {\n var backgroundBrush = this.getBackgroundBrush();\n //graphics.isTemplateGraphics = true;\n if (backgroundBrush != null) {\n graphics.save();\n graphics.drawRectangle(backgroundBrush, bounds.x, bounds.y, bounds.width, bounds.height);\n graphics.restore();\n }\n if (this.style.backgroundImage != null) {\n var image = this.getBackgroundImage();\n graphics.drawImage(this.style.backgroundImage, bounds.x, bounds.y, bounds.width, bounds.height);\n }\n };\n /**\n * `Adjusts the text layout area`.\n * @private\n */\n /* tslint:disable */\n PdfGridCell.prototype.adjustContentLayoutArea = function (bounds) {\n //Add Padding value to its Cell Bounds\n var returnBounds = new RectangleF(bounds.x, bounds.y, bounds.width, bounds.height);\n if (!(this.objectValue instanceof PdfGrid)) {\n if (typeof this.style.cellPadding === 'undefined' || this.style.cellPadding == null) {\n returnBounds.x += this.gridRow.grid.style.cellPadding.left + this.cellStyle.borders.left.width;\n returnBounds.y += this.gridRow.grid.style.cellPadding.top + this.cellStyle.borders.top.width;\n returnBounds.width -= (this.gridRow.grid.style.cellPadding.right + this.gridRow.grid.style.cellPadding.left);\n returnBounds.height -= (this.gridRow.grid.style.cellPadding.bottom + this.gridRow.grid.style.cellPadding.top);\n returnBounds.height -= (this.cellStyle.borders.top.width + this.cellStyle.borders.bottom.width);\n }\n else {\n returnBounds.x += this.style.cellPadding.left + this.cellStyle.borders.left.width;\n returnBounds.y += this.style.cellPadding.top + this.cellStyle.borders.top.width;\n returnBounds.width -= (this.style.cellPadding.right + this.style.cellPadding.left);\n returnBounds.width -= (this.cellStyle.borders.left.width + this.cellStyle.borders.right.width);\n returnBounds.height -= (this.style.cellPadding.bottom + this.style.cellPadding.top);\n returnBounds.height -= (this.cellStyle.borders.top.width + this.cellStyle.borders.bottom.width);\n if (this.rowSpan === 1) {\n returnBounds.width -= (this.style.borders.left.width);\n }\n }\n }\n else {\n if (this.style.cellPadding == null || typeof this.style.cellPadding === 'undefined') {\n if (typeof this.gridRow.grid.style.cellPadding.left !== 'undefined' && this.gridRow.grid.style.cellPadding.hasLeftPad) {\n returnBounds.x += this.gridRow.grid.style.cellPadding.left + this.cellStyle.borders.left.width;\n returnBounds.width -= this.gridRow.grid.style.cellPadding.left;\n }\n if (typeof this.gridRow.grid.style.cellPadding.top !== 'undefined' && this.gridRow.grid.style.cellPadding.hasTopPad) {\n returnBounds.y += this.gridRow.grid.style.cellPadding.top + this.cellStyle.borders.top.width;\n returnBounds.height -= this.gridRow.grid.style.cellPadding.top;\n }\n if (typeof this.gridRow.grid.style.cellPadding.right !== 'undefined' && this.gridRow.grid.style.cellPadding.hasRightPad) {\n returnBounds.width -= this.gridRow.grid.style.cellPadding.right;\n }\n if (typeof this.gridRow.grid.style.cellPadding.bottom !== 'undefined' && this.gridRow.grid.style.cellPadding.hasBottomPad) {\n returnBounds.height -= this.gridRow.grid.style.cellPadding.bottom;\n }\n }\n else {\n if (typeof this.style.cellPadding.left !== 'undefined' && this.style.cellPadding.hasLeftPad) {\n returnBounds.x += this.style.cellPadding.left + this.cellStyle.borders.left.width;\n returnBounds.width -= this.style.cellPadding.left;\n }\n if (typeof this.style.cellPadding.top !== 'undefined' && this.style.cellPadding.hasTopPad) {\n returnBounds.y += this.style.cellPadding.top + this.cellStyle.borders.top.width;\n returnBounds.height -= this.style.cellPadding.top;\n }\n if (typeof this.style.cellPadding.right !== 'undefined' && this.style.cellPadding.hasRightPad) {\n returnBounds.width -= this.style.cellPadding.right;\n }\n if (typeof this.style.cellPadding.bottom !== 'undefined' && this.style.cellPadding.hasBottomPad) {\n returnBounds.height -= this.style.cellPadding.bottom;\n }\n }\n returnBounds.width -= (this.cellStyle.borders.left.width + this.cellStyle.borders.right.width);\n returnBounds.height -= (this.cellStyle.borders.top.width + this.cellStyle.borders.bottom.width);\n }\n return returnBounds;\n };\n /**\n * `Draws` the specified graphics.\n * @private\n */\n PdfGridCell.prototype.draw = function (graphics, bounds, cancelSubsequentSpans) {\n var isrowbreak = false;\n /*if (!this.row.grid.isSingleGrid)\n {\n //Check whether the Grid Span to Nextpage\n if ((this.remainingString != null) || (PdfGridLayouter.repeatRowIndex != -1))\n {\n this.DrawParentCells(graphics, bounds, true);\n }\n else if (this.row.grid.rows.count > 1)\n {\n for (let i : number = 0; i < this.row.grid.rows.count; i++)\n {\n if (this.row == this.row.grid.rows.getRow(i))\n {\n if (this.row.grid.rows.getRow(i).rowBreakHeight > 0)\n isrowbreak = true;\n if ((i > 0) && (isrowbreak))\n this.DrawParentCells(graphics, bounds, false);\n }\n }\n }\n } */\n var result = null;\n /*if (cancelSubsequentSpans)\n {\n //..Cancel all subsequent cell spans, if no space exists.\n let currentCellIndex : number = this.row.cells.indexOf(this);\n for (let i : number = currentCellIndex + 1; i <= currentCellIndex + this.colSpan; i++)\n {\n this.row.cells.getCell(i).isCellMergeContinue = false;\n this.row.cells.getCell(i).isRowMergeContinue = false;\n }\n this.colSpan = 1;\n }*/\n //..Skip cells which were already covered by spanmap.\n if (this.internalIsCellMergeContinue || this.internalIsRowMergeContinue) {\n if (this.internalIsCellMergeContinue && this.row.grid.style.allowHorizontalOverflow) {\n if ((this.row.rowOverflowIndex > 0 && (this.row.cells.indexOf(this) != this.row.rowOverflowIndex + 1)) || (this.row.rowOverflowIndex == 0 && this.internalIsCellMergeContinue)) {\n return result;\n }\n }\n else {\n return result;\n }\n }\n //Adjust bounds with Row and Column Spacing\n bounds = this.adjustOuterLayoutArea(bounds, graphics);\n this.drawCellBackground(graphics, bounds);\n var textPen = this.getTextPen();\n var textBrush = this.getTextBrush();\n if (typeof textPen === 'undefined' && typeof textBrush === 'undefined') {\n textBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n }\n var font = this.getTextFont();\n var strFormat = this.getStringFormat();\n var innerLayoutArea = bounds;\n if (innerLayoutArea.height >= graphics.clientSize.height) {\n // If to break row to next page.\n if (this.row.grid.allowRowBreakAcrossPages) {\n innerLayoutArea.height -= innerLayoutArea.y;\n //bounds.height -= bounds.y;\n // if(this.row.grid.isChildGrid)\n // {\n // innerLayoutArea.height -= this.row.grid.ParentCell.row.grid.style.cellPadding.bottom;\n // }\n }\n // if user choose to cut the row whose height is more than page height.\n // else\n // {\n // innerLayoutArea.height = graphics.clientSize.height;\n // bounds.height = graphics.clientSize.height;\n // }\n }\n innerLayoutArea = this.adjustContentLayoutArea(innerLayoutArea);\n if (typeof this.objectValue === 'string' || typeof this.remaining === 'string') {\n var temp = void 0;\n var layoutRectangle = void 0;\n if (innerLayoutArea.height < font.height)\n layoutRectangle = new RectangleF(innerLayoutArea.x, innerLayoutArea.y, innerLayoutArea.width, font.height);\n else\n layoutRectangle = innerLayoutArea;\n if (innerLayoutArea.height < font.height && this.row.grid.isChildGrid && this.row.grid.ParentCell != null) {\n var height = layoutRectangle.height - this.row.grid.ParentCell.row.grid.style.cellPadding.bottom - this.row.grid.style.cellPadding.bottom;\n if (this.row.grid.splitChildRowIndex != -1) {\n this.fontSpilt = true;\n this.row.rowFontSplit = true;\n }\n if (height > 0 && height < font.height)\n layoutRectangle.height = height;\n // else if (height + this.row.grid.style.cellPadding.bottom > 0 && height + this.row.grid.style.cellPadding.bottom < font.height)\n // layoutRectangle.height = height + this.row.grid.style.cellPadding.bottom;\n // else if (bounds.height < font.height)\n // layoutRectangle.height = bounds.height;\n // else if (bounds.height - this.row.grid.ParentCell.row.grid.style.cellPadding.bottom < font.height)\n // layoutRectangle.height = bounds.height - this.row.grid.ParentCell.row.grid.style.cellPadding.bottom; \n }\n if (this.gridRow.grid.style.cellSpacing != 0) {\n layoutRectangle.width -= this.gridRow.grid.style.cellSpacing;\n bounds.width -= this.gridRow.grid.style.cellSpacing;\n }\n if (this.isFinish) {\n // if (this.row.grid.splitChildRowIndex != -1 && !this.row.grid.isChildGrid && typeof this.remaining === 'undefined'){\n // this.remaining = '';\n // graphics.drawString(this.remaining, font, textPen, textBrush, layoutRectangle.x, layoutRectangle.y, layoutRectangle.width, layoutRectangle.height, strFormat);\n // } else {\n temp = this.remaining === '' ? this.remaining : this.objectValue;\n graphics.drawString(temp, font, textPen, textBrush, layoutRectangle.x, layoutRectangle.y, layoutRectangle.width, layoutRectangle.height, strFormat);\n if (this.row.grid.splitChildRowIndex != -1 && !this.row.grid.isChildGrid && typeof this.remaining === 'undefined') {\n this.remaining = '';\n //graphics.drawString(this.remaining, font, textPen, textBrush, layoutRectangle.x, layoutRectangle.y, layoutRectangle.width, layoutRectangle.height, strFormat);\n }\n }\n else {\n if (typeof this.remaining == 'undefined' || this.remaining === null) {\n this.remaining = '';\n }\n if (this.row.repeatFlag) {\n graphics.drawString(this.remaining, font, textPen, textBrush, layoutRectangle.x, layoutRectangle.y, layoutRectangle.width, layoutRectangle.height, strFormat);\n }\n // else {\n // if(this.row.grid.ParentCell.row.repeatFlag) {\n // graphics.drawString((this.remaining as string), font, textPen, textBrush, layoutRectangle.x, layoutRectangle.y, layoutRectangle.width, layoutRectangle.height, strFormat); \n // } else {\n // layoutRectangle.height = this.row.height;\n // graphics.drawString((this.objectValue as string), font, textPen, textBrush, layoutRectangle.x, layoutRectangle.y, layoutRectangle.width, layoutRectangle.height, strFormat);\n // bounds.height = this.row.height;\n // }\n // }\n this.isFinish = true;\n //graphics.drawString((this.remaining as string), font, textPen, textBrush, layoutRectangle.x, layoutRectangle.y, layoutRectangle.width, layoutRectangle.height, strFormat);\n }\n result = graphics.stringLayoutResult;\n // if(this.row.grid.isChildGrid && this.row.rowBreakHeight > 0 && result !=null) {\n // bounds.height -= this.row.grid.ParentCell.row.grid.style.cellPadding.bottom;\n // }\n }\n else if (this.objectValue instanceof PdfGrid) {\n var childGrid = this.objectValue;\n childGrid.isChildGrid = true;\n childGrid.ParentCell = this;\n var layoutRect = void 0;\n layoutRect = innerLayoutArea;\n if (this.gridRow.grid.style.cellSpacing != 0) {\n bounds.width -= this.gridRow.grid.style.cellSpacing;\n }\n // layoutRect = bounds;\n // if (this.style.cellPadding != null){\n // layoutRect = bounds; \n // } else if((this.row.grid.style.cellPadding != null) && (childGrid.style.cellPadding.bottom === 0.5) && (childGrid.style.cellPadding.top === 0.5)\n // && (childGrid.style.cellPadding.left === 5.76) && (childGrid.style.cellPadding.right === 5.76)\n // && (this.gridRow.grid.style.cellSpacing === 0) && (childGrid.style.cellSpacing === 0)) {\n // layoutRect = innerLayoutArea;\n // }\n // if(this.objectValue.style.cellPadding != null && typeof this.objectValue.style.cellPadding !== 'undefined'){\n // layoutRect = bounds;\n // } \n var layouter = new PdfGridLayouter(childGrid);\n var format = new PdfGridLayoutFormat();\n if (this.row.grid.LayoutFormat != null)\n format = this.row.grid.LayoutFormat;\n else\n format.layout = PdfLayoutType.Paginate;\n var param = new PdfLayoutParams();\n if (graphics.layer != null) {\n // Define layout parameters.\n param.page = graphics.page;\n param.bounds = layoutRect;\n param.format = format;\n //Set the span \n childGrid.setSpan();\n childGrid.checkSpan();\n // Draw the child grid.\n var childGridResult = layouter.Layouter(param);\n //let childGridResult : PdfLayoutResult = layouter.innerLayout(param);\n this.value = childGrid;\n if (this.row.grid.splitChildRowIndex !== -1) {\n this.height = this.row.rowBreakHeightValue;\n }\n if (param.page != childGridResult.page) //&& (isWidthGreaterthanParent != true))\n {\n childGridResult.bounds.height = this.row.rowBreakHeightValue;\n if (this.row.rowBreakHeight == 0)\n this.row.NestedGridLayoutResult = childGridResult;\n else\n this.row.rowBreakHeight = this.row.rowBreakHeightValue;\n //bounds.height = this.row.rowBreakHeight;\n //After drawing paginated nested grid, the bounds of the parent grid in start page should be corrected for borders.\n //bounds.height = graphics.clientSize.height - bounds.y;\n }\n }\n }\n else if (this.objectValue instanceof PdfImage || this.objectValue instanceof PdfBitmap) {\n var imageBounds = void 0;\n if (this.objectValue.width <= innerLayoutArea.width) {\n imageBounds = new RectangleF(innerLayoutArea.x, innerLayoutArea.y, this.objectValue.width, innerLayoutArea.height);\n }\n else {\n imageBounds = innerLayoutArea;\n }\n graphics.drawImage(this.objectValue, imageBounds.x, imageBounds.y, imageBounds.width, imageBounds.height);\n }\n else if (this.objectValue instanceof PdfTextWebLink) {\n this.objectValue.draw(graphics.currentPage, innerLayoutArea);\n }\n else if (typeof this.objectValue === 'undefined') {\n this.objectValue = \"\";\n graphics.drawString(this.objectValue, font, textPen, textBrush, innerLayoutArea.x, innerLayoutArea.y, innerLayoutArea.width, innerLayoutArea.height, strFormat);\n if (this.style.cellPadding != null && this.style.cellPadding.bottom == 0 && this.style.cellPadding.left == 0 && this.style.cellPadding.right == 0 && this.style.cellPadding.top == 0) {\n bounds.width -= (this.style.borders.left.width + this.style.borders.right.width);\n }\n if (this.gridRow.grid.style.cellSpacing != 0) {\n bounds.width -= this.gridRow.grid.style.cellSpacing;\n }\n }\n if (this.style.borders != null) {\n if (!this.fontSpilt)\n this.drawCellBorders(graphics, bounds);\n else {\n if (this.row.grid.ParentCell.row.grid.splitChildRowIndex != -1) {\n this.row.rowFontSplit = false;\n this.drawCellBorders(graphics, bounds);\n }\n }\n }\n return result;\n };\n /* tslint:enable */\n /**\n * Draws the `cell border` constructed by drawing lines.\n * @private\n */\n PdfGridCell.prototype.drawCellBorders = function (graphics, bounds) {\n if (this.row.grid.style.borderOverlapStyle === PdfBorderOverlapStyle.Inside) {\n bounds.x += this.style.borders.left.width;\n bounds.y += this.style.borders.top.width;\n bounds.width -= this.style.borders.right.width;\n bounds.height -= this.style.borders.bottom.width;\n }\n var p1 = new PointF(bounds.x, bounds.y + bounds.height);\n var p2 = new PointF(bounds.x, bounds.y);\n var pen = this.cellStyle.borders.left;\n if (this.cellStyle.borders.left.dashStyle === PdfDashStyle.Solid) {\n pen.lineCap = PdfLineCap.Square;\n }\n // SetTransparency(ref graphics, pen);\n graphics.drawLine(pen, p1, p2);\n p1 = new PointF(bounds.x + bounds.width, bounds.y);\n p2 = new PointF(bounds.x + bounds.width, bounds.y + bounds.height);\n pen = this.cellStyle.borders.right;\n if ((bounds.x + bounds.width) > (graphics.clientSize.width - (pen.width / 2))) {\n p1 = new PointF(graphics.clientSize.width - (pen.width / 2), bounds.y);\n p2 = new PointF(graphics.clientSize.width - (pen.width / 2), bounds.y + bounds.height);\n }\n if (this.cellStyle.borders.right.dashStyle === PdfDashStyle.Solid) {\n pen.lineCap = PdfLineCap.Square;\n }\n graphics.drawLine(pen, p1, p2);\n p1 = new PointF(bounds.x, bounds.y);\n p2 = new PointF(bounds.x + bounds.width, bounds.y);\n pen = this.cellStyle.borders.top;\n if (this.cellStyle.borders.top.dashStyle === PdfDashStyle.Solid) {\n pen.lineCap = PdfLineCap.Square;\n }\n graphics.drawLine(pen, p1, p2);\n p1 = new PointF(bounds.x + bounds.width, bounds.y + bounds.height);\n p2 = new PointF(bounds.x, bounds.y + bounds.height);\n pen = this.cellStyle.borders.bottom;\n // if ((bounds.y + bounds.height) > (graphics.clientSize.height - (pen.width / 2))) {\n // p1 = new PointF((bounds.x + bounds.width), (graphics.clientSize.height - (pen.width / 2)));\n // p2 = new PointF(bounds.x, (graphics.clientSize.height - (pen.width / 2)));\n // }\n if (this.cellStyle.borders.bottom.dashStyle === PdfDashStyle.Solid) {\n pen.lineCap = PdfLineCap.Square;\n }\n graphics.drawLine(pen, p1, p2);\n };\n // private setTransparency(graphics : PdfGraphics, pen : PdfPen) : void {\n // let alpha : number = (pen.color.a / 255)as number;\n // graphics.save();\n // graphics.setTransparency(alpha);\n // }\n /**\n * `Adjusts the outer layout area`.\n * @private\n */\n /* tslint:disable */\n PdfGridCell.prototype.adjustOuterLayoutArea = function (bounds, g) {\n var isHeader = false;\n var cellSpacing = this.row.grid.style.cellSpacing;\n if (cellSpacing > 0) {\n bounds = new RectangleF(bounds.x + cellSpacing, bounds.y + cellSpacing, bounds.width - cellSpacing, bounds.height - cellSpacing);\n }\n var currentColIndex = this.row.cells.indexOf(this);\n if (this.columnSpan > 1 || (this.row.rowOverflowIndex > 0 && (currentColIndex == this.row.rowOverflowIndex + 1) && this.isCellMergeContinue)) {\n var span = this.columnSpan;\n if (span == 1 && this.isCellMergeContinue) {\n for (var j = currentColIndex + 1; j < this.row.grid.columns.count; j++) {\n if (this.row.cells.getCell(j).isCellMergeContinue)\n span++;\n else\n break;\n }\n }\n var totalWidth = 0;\n for (var i = currentColIndex; i < currentColIndex + span; i++) {\n if (this.row.grid.style.allowHorizontalOverflow) {\n var width = void 0;\n var compWidth = this.row.grid.size.width < g.clientSize.width ? this.row.grid.size.width : g.clientSize.width;\n if (this.row.grid.size.width > g.clientSize.width) {\n width = bounds.x + totalWidth + this.row.grid.columns.getColumn(i).width;\n }\n else {\n width = totalWidth + this.row.grid.columns.getColumn(i).width;\n }\n if (width > compWidth) {\n break;\n }\n }\n totalWidth += this.row.grid.columns.getColumn(i).width;\n }\n totalWidth -= this.row.grid.style.cellSpacing;\n bounds.width = totalWidth;\n }\n if (this.rowSpan > 1 || this.row.rowSpanExists) {\n var span = this.rowSpan;\n var currentRowIndex = this.row.grid.rows.rowCollection.indexOf(this.row);\n if (currentRowIndex == -1) {\n currentRowIndex = this.row.grid.headers.indexOf(this.row);\n if (currentRowIndex != -1) {\n isHeader = true;\n }\n }\n // if (span == 1 && this.isCellMergeContinue) {\n // for (let j : number = currentRowIndex + 1; j < this.row.grid.rows.count; j++)\n // {\n // let flag : boolean = (isHeader ? this.row.grid.headers.getHeader(j).cells.getCell(currentColIndex).isCellMergeContinue : this.row.grid.rows.getRow(j).cells.getCell(currentColIndex).isCellMergeContinue);\n // if (flag)\n // span++;\n // else\n // break;\n // }\n // }\n var totalHeight = 0;\n var max = 0;\n for (var i = currentRowIndex; i < currentRowIndex + span; i++) {\n totalHeight += (isHeader ? this.row.grid.headers.getHeader(i).height : this.row.grid.rows.getRow(i).height);\n var row = this.row.grid.rows.getRow(i);\n var rowIndex = this.row.grid.rows.rowCollection.indexOf(row);\n /*if (this.rowSpan > 1)\n {\n for (let k : number = 0; k < this.row.cells.count; k++) {\n let cell : PdfGridCell = this.row.cells.getCell(k);\n if(cell.rowSpan>1)\n {\n let tempHeight : number =0;\n \n for (let j :number = i; j < i +cell.rowSpan; j++)\n {\n if (!this.row.grid.rows.getRow(j).isRowSpanRowHeightSet)\n this.row.grid.rows.getRow(j).isRowHeightSet = false;\n tempHeight += this.row.grid.rows.getRow(j).height;\n if (!this.row.grid.rows.getRow(j).isRowSpanRowHeightSet)\n this.row.grid.rows.getRow(j).isRowHeightSet = true;\n }\n //To check the Row spanned cell height is greater than the total spanned row height.\n if(cell.height>tempHeight)\n {\n if (max < (cell.height - tempHeight))\n {\n max = cell.height - tempHeight;\n if (this.rowSpanRemainingHeight != 0 && max > this.rowSpanRemainingHeight)\n {\n max += this.rowSpanRemainingHeight;\n }\n let index :number = row.cells.indexOf(cell);\n //set the m_rowspanRemainingHeight to last rowspanned row.\n this.row.grid.rows.getRow((rowIndex +cell.rowSpan) - 1).cells.getCell(index).rowSpanRemainingHeight = max;\n this.rowSpanRemainingHeight = this.row.grid.rows.getRow((rowIndex + cell.rowSpan) - 1).cells.getCell(index).rowSpanRemainingHeight;\n }\n }\n }\n }\n }\n if (!this.row.grid.rows.getRow(i).isRowSpanRowHeightSet)\n this.row.grid.rows.getRow(i).isRowHeightSet = true;*/\n }\n var cellIndex = this.row.cells.indexOf(this);\n totalHeight -= this.row.grid.style.cellSpacing;\n // if (this.row.cells.getCell(cellIndex).height > totalHeight && (!this.row.grid.rows.getRow((currentRowIndex + span) - 1).isRowHeightSet)) {\n // this.row.grid.rows.getRow((currentRowIndex + span) - 1).cells.getCell(cellIndex).rowSpanRemainingHeight = this.row.cells.getCell(cellIndex).height - totalHeight;\n // totalHeight = this.row.cells.getCell(cellIndex).height;\n // bounds.height = totalHeight;\n // } else {\n bounds.height = totalHeight;\n // }\n if (!this.row.rowMergeComplete) {\n bounds.height = totalHeight;\n }\n }\n return bounds;\n };\n /* tslint:enable */\n /**\n * Gets the `text font`.\n * @private\n */\n PdfGridCell.prototype.getTextFont = function () {\n if (typeof this.style.font !== 'undefined' && this.style.font != null) {\n return this.style.font;\n }\n else if (typeof this.row.style.font !== 'undefined' && this.row.style.font != null) {\n return this.row.style.font;\n }\n else if (typeof this.row.grid.style.font !== 'undefined' && this.row.grid.style.font != null) {\n return this.row.grid.style.font;\n }\n else {\n return PdfDocument.defaultFont;\n }\n };\n /**\n * Gets the `text brush`.\n * @private\n */\n PdfGridCell.prototype.getTextBrush = function () {\n if (typeof this.style.textBrush !== 'undefined' && this.style.textBrush != null) {\n return this.style.textBrush;\n }\n else if (typeof this.row.style.textBrush !== 'undefined' && this.row.style.textBrush != null) {\n return this.row.style.textBrush;\n }\n else {\n return this.row.grid.style.textBrush;\n }\n };\n /**\n * Gets the `text pen`.\n * @private\n */\n PdfGridCell.prototype.getTextPen = function () {\n if (typeof this.style.textPen !== 'undefined' && this.style.textPen != null) {\n return this.style.textPen;\n }\n else if (typeof this.row.style.textPen !== 'undefined' && this.row.style.textPen != null) {\n return this.row.style.textPen;\n }\n else {\n return this.row.grid.style.textPen;\n }\n };\n /**\n * Gets the `background brush`.\n * @private\n */\n PdfGridCell.prototype.getBackgroundBrush = function () {\n if (typeof this.style.backgroundBrush !== 'undefined' && this.style.backgroundBrush != null) {\n return this.style.backgroundBrush;\n }\n else if (typeof this.row.style.backgroundBrush !== 'undefined' && this.row.style.backgroundBrush != null) {\n return this.row.style.backgroundBrush;\n }\n else {\n return this.row.grid.style.backgroundBrush;\n }\n };\n /**\n * Gets the `background image`.\n * @private\n */\n PdfGridCell.prototype.getBackgroundImage = function () {\n if (typeof this.style.backgroundImage !== 'undefined' && this.style.backgroundImage != null) {\n return this.style.backgroundImage;\n }\n else if (typeof this.row.style.backgroundImage !== 'undefined' && this.row.style.backgroundImage != null) {\n return this.row.style.backgroundImage;\n }\n else {\n return this.row.grid.style.backgroundImage;\n }\n };\n /**\n * Gets the current `StringFormat`.\n * @private\n */\n PdfGridCell.prototype.getStringFormat = function () {\n if (typeof this.style.stringFormat !== 'undefined' && this.style.stringFormat != null) {\n return this.style.stringFormat;\n }\n else {\n return this.stringFormat;\n }\n };\n /**\n * Calculates the `height`.\n * @private\n */\n PdfGridCell.prototype.measureHeight = function () {\n // .. Calculate the cell text height.\n // .....Add border widths, cell spacings and paddings to the height.\n var width = this.calculateWidth();\n // //check whether the Current PdfGridCell has padding\n if (this.style.cellPadding == null || typeof this.style.cellPadding === 'undefined') {\n width -= (this.gridRow.grid.style.cellPadding.right + this.gridRow.grid.style.cellPadding.left);\n //width -= (this.style.borders.left.width + this.style.borders.right.width);\n }\n else {\n width -= (this.style.cellPadding.right + this.style.cellPadding.left);\n width -= (this.style.borders.left.width + this.style.borders.right.width);\n }\n var height = 0;\n var layouter = new PdfStringLayouter();\n if (typeof this.objectValue === 'string' || typeof this.remaining === 'string') {\n var currentValue = this.objectValue;\n /* tslint:disable */\n if (!this.isFinish)\n currentValue = !(this.remaining === null || this.remaining === '' ||\n typeof this.remaining === 'undefined') ? this.remaining : this.objectValue;\n var slr = null;\n var cellIndex = this.row.cells.indexOf(this);\n if (this.gridRow.grid.style.cellSpacing != 0) {\n width -= this.gridRow.grid.style.cellSpacing * 2;\n }\n if (!this.row.cells.getCell(cellIndex).hasColSpan && !this.row.cells.getCell(cellIndex).hasRowSpan) {\n if (this.gridRow.grid.isChildGrid) {\n if (width < 0) {\n this.tempval = width;\n if (this.style.cellPadding == null || typeof this.style.cellPadding === 'undefined') {\n this.tempval += (this.gridRow.grid.style.cellPadding.right + this.gridRow.grid.style.cellPadding.left);\n }\n else {\n this.tempval += (this.style.cellPadding.right + this.style.cellPadding.left);\n this.tempval += (this.style.borders.left.width + this.style.borders.right.width);\n }\n }\n else {\n this.tempval = width;\n }\n slr = layouter.layout(currentValue, this.getTextFont(), this.stringFormat, new SizeF(this.tempval, 0), false, new SizeF(0, 0));\n height += slr.actualSize.height;\n }\n else {\n slr = layouter.layout(currentValue, this.getTextFont(), this.stringFormat, new SizeF(width, 0), false, new SizeF(0, 0));\n height += slr.actualSize.height;\n }\n }\n /* tslint:enable */\n height += (this.style.borders.top.width + this.style.borders.bottom.width) * 2;\n }\n else if (this.objectValue instanceof PdfGrid) {\n var cellIndex = this.row.cells.indexOf(this);\n var internalWidth = 0;\n if ((this.style.cellPadding != null || typeof this.style.cellPadding !== 'undefined')) {\n internalWidth = this.calculateWidth();\n if (typeof this.style.cellPadding.left !== 'undefined' && this.style.cellPadding.hasLeftPad) {\n internalWidth -= this.style.cellPadding.left;\n }\n if (typeof this.style.cellPadding.right !== 'undefined' && this.style.cellPadding.hasRightPad) {\n internalWidth -= this.style.cellPadding.right;\n }\n }\n else if ((this.row.grid.style.cellPadding != null || typeof this.row.grid.style.cellPadding !== 'undefined')) {\n internalWidth = this.calculateWidth();\n if (typeof this.row.grid.style.cellPadding.left !== 'undefined' && this.row.grid.style.cellPadding.hasLeftPad) {\n internalWidth -= this.row.grid.style.cellPadding.left;\n }\n if (typeof this.row.grid.style.cellPadding.right !== 'undefined' && this.row.grid.style.cellPadding.hasRightPad) {\n internalWidth -= this.row.grid.style.cellPadding.right;\n }\n }\n else {\n internalWidth = this.calculateWidth();\n }\n this.objectValue.tempWidth = internalWidth;\n if (!this.row.cells.getCell(cellIndex).hasColSpan && !this.row.cells.getCell(cellIndex).hasRowSpan) {\n height = this.objectValue.size.height;\n }\n else {\n height += (this.style.borders.top.width + this.style.borders.bottom.width) * 2;\n }\n if (this.gridRow.grid.style.cellSpacing !== 0) {\n width -= this.gridRow.grid.style.cellSpacing * 2;\n //height += (this.row.grid.style.cellPadding.top + this.row.grid.style.cellPadding.bottom);\n }\n if (this.style.cellPadding != null || typeof this.style.cellPadding !== 'undefined') {\n if (typeof this.row.grid.style.cellPadding.top !== 'undefined' && this.row.grid.style.cellPadding.hasTopPad) {\n height += this.row.grid.style.cellPadding.top;\n }\n if (this.row.grid.style.cellPadding.hasBottomPad && typeof this.row.grid.style.cellPadding.bottom !== 'undefined') {\n height += this.row.grid.style.cellPadding.bottom;\n }\n }\n height += this.objectValue.style.cellSpacing;\n }\n else if (this.objectValue instanceof PdfImage || this.objectValue instanceof PdfBitmap) {\n height += this.objectValue.height;\n }\n else if (this.objectValue instanceof PdfTextWebLink) {\n var webLink = this.objectValue;\n /* tslint:disable */\n var slr = layouter.layout(webLink.text, webLink.font, webLink.stringFormat, new SizeF(width, 0), false, new SizeF(0, 0));\n /* tslint:enable */\n height += slr.actualSize.height;\n height += (this.style.borders.top.width + this.style.borders.bottom.width) * 2;\n }\n else if (typeof this.objectValue === 'undefined') {\n if (this.style.cellPadding == null || typeof this.style.cellPadding === 'undefined') {\n width -= (this.gridRow.grid.style.cellPadding.right + this.gridRow.grid.style.cellPadding.left);\n }\n else {\n width -= (this.style.cellPadding.right + this.style.cellPadding.left);\n width -= (this.style.borders.left.width + this.style.borders.right.width);\n }\n height += (this.style.borders.top.width + this.style.borders.bottom.width) * 2;\n }\n //Add padding top and bottom value to height\n if (!(this.objectValue instanceof PdfGrid)) {\n if (this.style.cellPadding == null || typeof this.style.cellPadding === 'undefined') {\n height += (this.row.grid.style.cellPadding.top + this.row.grid.style.cellPadding.bottom);\n }\n else {\n height += (this.style.cellPadding.top + this.style.cellPadding.bottom);\n }\n }\n else {\n if (this.style.cellPadding == null || typeof this.style.cellPadding === 'undefined') {\n if (typeof this.row.grid.style.cellPadding.top !== 'undefined' && this.row.grid.style.cellPadding.hasTopPad) {\n height += this.row.grid.style.cellPadding.top;\n }\n if (typeof this.row.grid.style.cellPadding.bottom !== 'undefined' && this.row.grid.style.cellPadding.hasBottomPad) {\n height += this.row.grid.style.cellPadding.bottom;\n }\n }\n else {\n if (typeof this.style.cellPadding.top !== 'undefined' && this.style.cellPadding.hasTopPad) {\n height += this.style.cellPadding.top;\n }\n if (typeof this.style.cellPadding.bottom !== 'undefined' && this.style.cellPadding.hasBottomPad) {\n height += this.style.cellPadding.bottom;\n }\n }\n }\n height += this.row.grid.style.cellSpacing;\n return height;\n };\n /**\n * return the calculated `width` of the cell.\n * @private\n */\n PdfGridCell.prototype.calculateWidth = function () {\n var cellIndex = this.row.cells.indexOf(this);\n var rowindex = this.row.grid.rows.rowCollection.indexOf(this.row);\n var columnSpan = this.columnSpan;\n var width = 0;\n if (columnSpan === 1) {\n for (var i = 0; i < columnSpan; i++) {\n width += this.row.grid.columns.getColumn(cellIndex + i).width;\n }\n }\n else if (columnSpan > 1) {\n for (var i = 0; i < columnSpan; i++) {\n width += this.row.grid.columns.getColumn(cellIndex + i).width;\n if ((i + 1) < columnSpan) {\n this.row.cells.getCell(cellIndex + i + 1).hasColSpan = true;\n }\n }\n }\n if (this.parent != null && this.parent.row.width > 0) {\n if ((this.row.grid.isChildGrid) && this.parent != null && (this.row.width > this.parent.row.width)) {\n width = 0;\n for (var j = 0; j < this.parent.columnSpan; j++) {\n width += this.parent.row.grid.columns.getColumn(j).width;\n }\n width = width / this.row.cells.count;\n }\n }\n return width;\n };\n return PdfGridCell;\n}());\nexport { PdfGridCell };\n/**\n * `PdfGridCellCollection` class provides access to an ordered,\n * strongly typed collection of 'PdfGridCell' objects.\n * @private\n */\nvar PdfGridCellCollection = /** @class */ (function () {\n //Constructor\n /**\n * Initializes a new instance of the `PdfGridCellCollection` class with the row.\n * @private\n */\n function PdfGridCellCollection(row) {\n /**\n * @hidden\n * @private\n */\n this.cells = [];\n this.gridRow = row;\n }\n //Properties\n /**\n * Gets the current `cell`.\n * @private\n */\n PdfGridCellCollection.prototype.getCell = function (index) {\n if (index < 0 || index >= this.count) {\n throw new Error('IndexOutOfRangeException');\n }\n return this.cells[index];\n };\n Object.defineProperty(PdfGridCellCollection.prototype, \"count\", {\n /**\n * Gets the cells `count`.[Read-Only].\n * @private\n */\n get: function () {\n return this.cells.length;\n },\n enumerable: true,\n configurable: true\n });\n PdfGridCellCollection.prototype.add = function (cell) {\n if (typeof cell === 'undefined') {\n var tempcell = new PdfGridCell();\n this.add(tempcell);\n return cell;\n }\n else {\n cell.row = this.gridRow;\n this.cells.push(cell);\n }\n };\n /**\n * Returns the `index of` a particular cell in the collection.\n * @private\n */\n PdfGridCellCollection.prototype.indexOf = function (cell) {\n return this.cells.indexOf(cell);\n };\n return PdfGridCellCollection;\n}());\nexport { PdfGridCellCollection };\n","import { PdfGridCell } from './pdf-grid-cell';\nimport { PdfStringFormat } from './../../graphics/fonts/pdf-string-format';\n/**\n * `PdfGridColumn` class represents the schema of a column in a 'PdfGrid'.\n */\nvar PdfGridColumn = /** @class */ (function () {\n //Constructors\n /**\n * Initializes a new instance of the `PdfGridColumn` class with the parent grid.\n * @private\n */\n function PdfGridColumn(grid) {\n /**\n * The `width` of the column.\n * @default 0\n * @private\n */\n this.columnWidth = 0;\n this.grid = grid;\n }\n Object.defineProperty(PdfGridColumn.prototype, \"width\", {\n /**\n * Gets or sets the `width` of the 'PdfGridColumn'.\n * @private\n */\n get: function () {\n return this.columnWidth;\n },\n set: function (value) {\n this.isCustomWidth = true;\n this.columnWidth = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridColumn.prototype, \"format\", {\n /**\n * Gets or sets the information about the text `formatting`.\n * @private\n */\n get: function () {\n if (this.stringFormat == null) {\n this.stringFormat = new PdfStringFormat(); //GetDefaultFormat();\n }\n return this.stringFormat;\n },\n set: function (value) {\n this.stringFormat = value;\n },\n enumerable: true,\n configurable: true\n });\n return PdfGridColumn;\n}());\nexport { PdfGridColumn };\n/**\n * `PdfGridColumnCollection` class provides access to an ordered,\n * strongly typed collection of 'PdfGridColumn' objects.\n * @private\n */\nvar PdfGridColumnCollection = /** @class */ (function () {\n //properties\n //Constructors\n /**\n * Initializes a new instance of the `PdfGridColumnCollection` class with the parent grid.\n * @private\n */\n function PdfGridColumnCollection(grid) {\n /**\n * @hidden\n * @private\n */\n this.internalColumns = [];\n /**\n * @hidden\n * @private\n */\n this.columnWidth = 0;\n this.grid = grid;\n this.internalColumns = [];\n }\n //Iplementation\n /**\n * `Add` a new column to the 'PdfGrid'.\n * @private\n */\n PdfGridColumnCollection.prototype.add = function (count) {\n // public add(column : PdfGridColumn) : void\n // public add(arg : number|PdfGridColumn) : void {\n // if (typeof arg === 'number') {\n for (var i = 0; i < count; i++) {\n this.internalColumns.push(new PdfGridColumn(this.grid));\n for (var index = 0; index < this.grid.rows.count; index++) {\n var row = this.grid.rows.getRow(index);\n var cell = new PdfGridCell();\n cell.value = '';\n row.cells.add(cell);\n }\n }\n // } else {\n // let column : PdfGridColumn = new PdfGridColumn(this.grid);\n // this.columns.push(column);\n // return column;\n // }\n };\n Object.defineProperty(PdfGridColumnCollection.prototype, \"count\", {\n /**\n * Gets the `number of columns` in the 'PdfGrid'.[Read-Only].\n * @private\n */\n get: function () {\n return this.internalColumns.length;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridColumnCollection.prototype, \"width\", {\n /**\n * Gets the `widths`.\n * @private\n */\n get: function () {\n if (this.columnWidth === 0) {\n this.columnWidth = this.measureColumnsWidth();\n }\n if (this.grid.initialWidth !== 0 && this.columnWidth !== this.grid.initialWidth && !this.grid.style.allowHorizontalOverflow) {\n this.columnWidth = this.grid.initialWidth;\n this.grid.isPageWidth = true;\n }\n return this.columnWidth;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridColumnCollection.prototype, \"columns\", {\n /**\n * Gets the `array of PdfGridColumn`.[Read-Only]\n * @private\n */\n get: function () {\n return this.internalColumns;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * Gets the `PdfGridColumn` from the specified index.[Read-Only]\n * @private\n */\n PdfGridColumnCollection.prototype.getColumn = function (index) {\n if (index >= 0 && index <= this.columns.length) {\n return this.columns[index];\n }\n else {\n throw Error('can not get the column from the index: ' + index);\n }\n };\n //Implementation\n /**\n * `Calculates the column widths`.\n * @private\n */\n PdfGridColumnCollection.prototype.measureColumnsWidth = function () {\n var totalWidth = 0;\n this.grid.measureColumnsWidth();\n for (var i = 0, count = this.internalColumns.length; i < count; i++) {\n totalWidth += this.internalColumns[i].width;\n }\n return totalWidth;\n };\n /**\n * Gets the `widths of the columns`.\n * @private\n */\n PdfGridColumnCollection.prototype.getDefaultWidths = function (totalWidth) {\n var widths = [];\n var summ = 0.0;\n var subFactor = this.count;\n for (var i = 0; i < this.count; i++) {\n if (this.grid.isPageWidth && totalWidth >= 0 && !this.internalColumns[i].isCustomWidth) {\n this.internalColumns[i].width = 0;\n }\n else {\n widths[i] = this.internalColumns[i].width;\n if (this.internalColumns[i].width > 0 && this.internalColumns[i].isCustomWidth) {\n totalWidth -= this.internalColumns[i].width;\n subFactor--;\n }\n else {\n widths[i] = 0;\n }\n }\n }\n for (var i = 0; i < this.count; i++) {\n var width = totalWidth / subFactor;\n if (widths[i] <= 0) {\n widths[i] = width;\n }\n }\n return widths;\n };\n return PdfGridColumnCollection;\n}());\nexport { PdfGridColumnCollection };\n","import { PdfGridCell, PdfGridCellCollection } from './pdf-grid-cell';\nimport { PdfGridRowStyle } from './styles/style';\n/**\n * `PdfGridRow` class provides customization of the settings for the particular row.\n */\nvar PdfGridRow = /** @class */ (function () {\n //Constructor\n /**\n * Initializes a new instance of the `PdfGridRow` class with the parent grid.\n * @private\n */\n function PdfGridRow(grid) {\n /**\n * Stores the index of the overflowing row.\n * @private\n */\n this.gridRowOverflowIndex = 0;\n /**\n * The `height` of the row.\n * @private\n */\n this.rowHeight = 0;\n /**\n * The `width` of the row.\n * @private\n */\n this.rowWidth = 0;\n /**\n * The `isFinish` of the row.\n * @private\n */\n this.isrowFinish = false;\n /**\n * Check whether the Row span row height `is set explicitly`.\n * @default false\n * @public\n */\n this.isRowSpanRowHeightSet = false;\n /**\n * The `page count` of the row.\n * @public\n */\n this.noOfPageCount = 0;\n /**\n * Check whether the row height `is set explicitly`.\n * @default false\n * @private\n */\n this.isRowHeightSet = false;\n this.isPageBreakRowSpanApplied = false;\n /**\n * Check weather the row merge `is completed` or not.\n * @default true\n * @private\n */\n this.isRowMergeComplete = true;\n this.repeatFlag = false;\n this.rowFontSplit = false;\n this.pdfGrid = grid;\n }\n Object.defineProperty(PdfGridRow.prototype, \"rowSpanExists\", {\n //Properties\n /**\n * Gets or sets a value indicating [`row span exists`].\n * @private\n */\n get: function () {\n return this.bRowSpanExists;\n },\n set: function (value) {\n this.bRowSpanExists = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridRow.prototype, \"cells\", {\n /**\n * Gets the `cells` from the selected row.[Read-Only].\n * @private\n */\n get: function () {\n if (this.gridCells == null) {\n this.gridCells = new PdfGridCellCollection(this);\n }\n return this.gridCells;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridRow.prototype, \"grid\", {\n /**\n * Gets or sets the parent `grid`.\n * @private\n */\n get: function () {\n return this.pdfGrid;\n },\n set: function (value) {\n this.pdfGrid = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridRow.prototype, \"style\", {\n /**\n * Gets or sets the row `style`.\n * @private\n */\n get: function () {\n if (typeof this.rowStyle === 'undefined') {\n this.rowStyle = new PdfGridRowStyle();\n this.rowStyle.setParent(this);\n }\n return this.rowStyle;\n },\n set: function (value) {\n this.rowStyle = value;\n for (var i = 0; i < this.cells.count; i++) {\n this.cells.getCell(i).style.borders = value.border;\n if (typeof value.font !== 'undefined') {\n this.cells.getCell(i).style.font = value.font;\n }\n if (typeof value.backgroundBrush !== 'undefined') {\n this.cells.getCell(i).style.backgroundBrush = value.backgroundBrush;\n }\n if (typeof value.backgroundImage !== 'undefined') {\n this.cells.getCell(i).style.backgroundImage = value.backgroundImage;\n }\n if (typeof value.textBrush !== 'undefined') {\n this.cells.getCell(i).style.textBrush = value.textBrush;\n }\n if (typeof value.textPen !== 'undefined') {\n this.cells.getCell(i).style.textPen = value.textPen;\n }\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridRow.prototype, \"rowBreakHeight\", {\n /**\n * `Height` of the row yet to be drawn after split.\n * @private\n */\n get: function () {\n if (typeof this.gridRowBreakHeight === 'undefined') {\n this.gridRowBreakHeight = 0;\n }\n return this.gridRowBreakHeight;\n },\n set: function (value) {\n this.gridRowBreakHeight = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridRow.prototype, \"rowOverflowIndex\", {\n /**\n * `over flow index` of the row.\n * @private\n */\n get: function () {\n return this.gridRowOverflowIndex;\n },\n set: function (value) {\n this.gridRowOverflowIndex = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridRow.prototype, \"height\", {\n /**\n * Gets or sets the `height` of the row.\n * @private\n */\n get: function () {\n if (!this.isRowHeightSet) {\n this.rowHeight = this.measureHeight();\n }\n return this.rowHeight;\n },\n set: function (value) {\n this.rowHeight = value;\n this.isRowHeightSet = true;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridRow.prototype, \"width\", {\n /**\n * Gets or sets the `width` of the row.\n * @private\n */\n get: function () {\n if (this.rowWidth === 0 || typeof this.rowWidth === 'undefined') {\n this.rowWidth = this.measureWidth();\n }\n return this.rowWidth;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridRow.prototype, \"NestedGridLayoutResult\", {\n /**\n * Gets or sets the row `Nested grid Layout Result`.\n * @private\n */\n get: function () {\n return this.gridResult;\n },\n set: function (value) {\n this.gridResult = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridRow.prototype, \"columnSpanExists\", {\n /**\n * Gets or sets a value indicating [`column span exists`].\n * @private\n */\n get: function () {\n return this.bColumnSpanExists;\n },\n set: function (value) {\n this.bColumnSpanExists = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridRow.prototype, \"rowMergeComplete\", {\n /**\n * Check whether the Row `has row span or row merge continue`.\n * @private\n */\n get: function () {\n return this.isRowMergeComplete;\n },\n set: function (value) {\n this.isRowMergeComplete = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridRow.prototype, \"rowIndex\", {\n /**\n * Returns `index` of the row.\n * @private\n */\n get: function () {\n return this.grid.rows.rowCollection.indexOf(this);\n },\n enumerable: true,\n configurable: true\n });\n //Implementation\n /**\n * `Calculates the height`.\n * @private\n */\n PdfGridRow.prototype.measureHeight = function () {\n var rowSpanRemainingHeight = 0;\n var rowHeight;\n var maxHeight = 0;\n if (this.cells.getCell(0).rowSpan > 1) {\n rowHeight = 0;\n }\n else {\n rowHeight = this.cells.getCell(0).height;\n }\n for (var i = 0; i < this.cells.count; i++) {\n var cell = this.cells.getCell(i);\n //get the maximum rowspan remaining height.\n if (cell.rowSpanRemainingHeight > rowSpanRemainingHeight) {\n rowSpanRemainingHeight = cell.rowSpanRemainingHeight;\n }\n //skip the cell if row spanned.\n // if (cell.isRowMergeContinue) {\n // continue;\n // }\n // if (!cell.isRowMergeContinue) {\n // this.rowMergeComplete = false;\n // }\n this.rowMergeComplete = false;\n if (cell.rowSpan > 1) {\n var cellIn = i;\n var rowin = this.grid.rows.rowCollection.indexOf(this);\n for (var j = 0; j < cell.rowSpan; j++) {\n if ((j + 1) < cell.rowSpan) {\n this.grid.rows.getRow(rowin + j + 1).cells.getCell(cellIn).hasRowSpan = true;\n }\n }\n if (maxHeight < cell.height) {\n maxHeight = cell.height;\n }\n continue;\n }\n rowHeight = Math.max(rowHeight, cell.height);\n }\n if (maxHeight > rowHeight) {\n rowHeight = maxHeight;\n }\n if (rowHeight === 0) {\n rowHeight = maxHeight;\n }\n else if (rowSpanRemainingHeight > 0) {\n rowHeight += rowSpanRemainingHeight;\n }\n return rowHeight;\n };\n PdfGridRow.prototype.measureWidth = function () {\n var rowWid = 0;\n for (var i = 0; i < this.grid.columns.count; i++) {\n var column = this.grid.columns.getColumn(i);\n rowWid += column.width;\n }\n return rowWid;\n };\n return PdfGridRow;\n}());\nexport { PdfGridRow };\n/**\n * `PdfGridRowCollection` class provides access to an ordered, strongly typed collection of 'PdfGridRow' objects.\n * @private\n */\nvar PdfGridRowCollection = /** @class */ (function () {\n // Constructor\n /**\n * Initializes a new instance of the `PdfGridRowCollection` class with the parent grid.\n * @private\n */\n function PdfGridRowCollection(grid) {\n this.rows = [];\n this.grid = grid;\n }\n Object.defineProperty(PdfGridRowCollection.prototype, \"count\", {\n //Properties\n /**\n * Gets the number of header in the `PdfGrid`.[Read-Only].\n * @private\n */\n get: function () {\n return this.rows.length;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridRowCollection.prototype, \"rowCollection\", {\n //Implementation\n /**\n * Return the row collection of the `grid`.\n * @private\n */\n get: function () {\n return this.rows;\n },\n enumerable: true,\n configurable: true\n });\n PdfGridRowCollection.prototype.addRow = function (arg) {\n if (typeof arg === 'undefined') {\n var temprow = new PdfGridRow(this.grid);\n this.addRow(temprow);\n return temprow;\n }\n else {\n arg.style.setBackgroundBrush(this.grid.style.backgroundBrush);\n arg.style.setFont(this.grid.style.font);\n arg.style.setTextBrush(this.grid.style.textBrush);\n arg.style.setTextPen(this.grid.style.textPen);\n if (arg.cells.count === 0) {\n for (var i = 0; i < this.grid.columns.count; i++) {\n arg.cells.add(new PdfGridCell());\n }\n }\n this.rows.push(arg);\n }\n };\n /**\n * Return the row by index.\n * @private\n */\n PdfGridRowCollection.prototype.getRow = function (index) {\n return this.rows[index];\n };\n return PdfGridRowCollection;\n}());\nexport { PdfGridRowCollection };\n/**\n * `PdfGridHeaderCollection` class provides customization of the settings for the header.\n * @private\n */\nvar PdfGridHeaderCollection = /** @class */ (function () {\n //constructor\n /**\n * Initializes a new instance of the `PdfGridHeaderCollection` class with the parent grid.\n * @private\n */\n function PdfGridHeaderCollection(grid) {\n /**\n * The array to store the `rows` of the grid header.\n * @private\n */\n this.rows = [];\n this.grid = grid;\n this.rows = [];\n }\n //Properties\n /**\n * Gets a 'PdfGridRow' object that represents the `header` row in a 'PdfGridHeaderCollection' control.[Read-Only].\n * @private\n */\n PdfGridHeaderCollection.prototype.getHeader = function (index) {\n // if (index < 0 || index >= Count) {\n // throw new IndexOutOfRangeException();\n // }\n return (this.rows[index]);\n };\n Object.defineProperty(PdfGridHeaderCollection.prototype, \"count\", {\n /**\n * Gets the `number of header` in the 'PdfGrid'.[Read-Only]\n * @private\n */\n get: function () {\n return this.rows.length;\n },\n enumerable: true,\n configurable: true\n });\n PdfGridHeaderCollection.prototype.add = function (arg) {\n if (typeof arg === 'number') {\n var row = void 0;\n for (var i = 0; i < arg; i++) {\n row = new PdfGridRow(this.grid);\n for (var j = 0; j < this.grid.columns.count; j++) {\n row.cells.add(new PdfGridCell());\n }\n this.rows.push(row);\n }\n return this.rows;\n }\n else {\n this.rows.push(arg);\n }\n };\n PdfGridHeaderCollection.prototype.indexOf = function (row) {\n return this.rows.indexOf(row);\n };\n return PdfGridHeaderCollection;\n}());\nexport { PdfGridHeaderCollection };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * PdfGrid.ts class for EJ2-PDF\n */\nimport { PdfGridColumnCollection } from './pdf-grid-column';\nimport { PdfGridRowCollection, PdfGridHeaderCollection } from './pdf-grid-row';\nimport { RectangleF, SizeF, PointF } from './../../drawing/pdf-drawing';\nimport { PdfLayoutElement } from './../../graphics/figures/layout-element';\nimport { PdfLayoutFormat } from './../../graphics/figures/base/element-layouter';\nimport { PdfGridStyle } from './styles/style';\nimport { PdfGridLayouter } from './../../structured-elements/grid/layout/grid-layouter';\nvar PdfGrid = /** @class */ (function (_super) {\n __extends(PdfGrid, _super);\n //constructor\n /**\n * Initialize a new instance for `PdfGrid` class.\n * @private\n */\n function PdfGrid() {\n var _this = _super.call(this) || this;\n /**\n * @hidden\n * @private\n */\n _this.gridSize = new SizeF(0, 0);\n /**\n * Check the child grid is ' split or not'\n */\n _this.isGridSplit = false;\n /**\n * @hidden\n * @private\n */\n _this.isRearranged = false;\n /**\n * @hidden\n * @private\n */\n _this.pageBounds = new RectangleF();\n /**\n * @hidden\n * @private\n */\n _this.listOfNavigatePages = [];\n /**\n * @hidden\n * @private\n */\n _this.parentCellIndex = 0;\n _this.tempWidth = 0;\n /**\n * @hidden\n * @private\n */\n _this.breakRow = true;\n _this.splitChildRowIndex = -1;\n /**\n * The event raised on `begin cell lay outing`.\n * @event\n * @private\n */\n //public beginPageLayout : Function;\n /**\n * The event raised on `end cell lay outing`.\n * @event\n * @private\n */\n //public endPageLayout : Function;\n _this.hasRowSpanSpan = false;\n _this.hasColumnSpan = false;\n _this.isSingleGrid = true;\n return _this;\n }\n Object.defineProperty(PdfGrid.prototype, \"raiseBeginCellDraw\", {\n //Properties\n /**\n * Gets a value indicating whether the `start cell layout event` should be raised.\n * @private\n */\n get: function () {\n return (typeof this.beginCellDraw !== 'undefined' && typeof this.beginCellDraw !== null);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGrid.prototype, \"raiseEndCellDraw\", {\n /**\n * Gets a value indicating whether the `end cell layout event` should be raised.\n * @private\n */\n get: function () {\n return (typeof this.endCellDraw !== 'undefined' && typeof this.endCellDraw !== null);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGrid.prototype, \"repeatHeader\", {\n /**\n * Gets or sets a value indicating whether to `repeat header`.\n * @private\n */\n get: function () {\n if (this.bRepeatHeader == null || typeof this.bRepeatHeader === 'undefined') {\n this.bRepeatHeader = false;\n }\n return this.bRepeatHeader;\n },\n set: function (value) {\n this.bRepeatHeader = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGrid.prototype, \"allowRowBreakAcrossPages\", {\n /**\n * Gets or sets a value indicating whether to split or cut rows that `overflow a page`.\n * @private\n */\n get: function () {\n return this.breakRow;\n },\n set: function (value) {\n this.breakRow = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGrid.prototype, \"columns\", {\n /**\n * Gets the `column` collection of the PdfGrid.[Read-Only]\n * @private\n */\n get: function () {\n if (this.gridColumns == null || typeof this.gridColumns === 'undefined') {\n this.gridColumns = new PdfGridColumnCollection(this);\n }\n return this.gridColumns;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGrid.prototype, \"rows\", {\n /**\n * Gets the `row` collection from the PdfGrid.[Read-Only]\n * @private\n */\n get: function () {\n if (this.gridRows == null) {\n this.gridRows = new PdfGridRowCollection(this);\n }\n return this.gridRows;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGrid.prototype, \"headers\", {\n /**\n * Gets the `headers` collection from the PdfGrid.[Read-Only]\n * @private\n */\n get: function () {\n if (this.gridHeaders == null || typeof this.gridHeaders === 'undefined') {\n this.gridHeaders = new PdfGridHeaderCollection(this);\n }\n return this.gridHeaders;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGrid.prototype, \"initialWidth\", {\n /**\n * Indicating `initial width` of the page.\n * @private\n */\n get: function () {\n return this.gridInitialWidth;\n },\n set: function (value) {\n this.gridInitialWidth = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGrid.prototype, \"style\", {\n /**\n * Gets or sets the `grid style`.\n * @private\n */\n get: function () {\n if (this.gridStyle == null) {\n this.gridStyle = new PdfGridStyle();\n }\n return this.gridStyle;\n },\n set: function (value) {\n if (this.gridStyle == null) {\n this.gridStyle = value;\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGrid.prototype, \"isPageWidth\", {\n /**\n * Gets a value indicating whether the grid column width is considered to be `page width`.\n * @private\n */\n get: function () {\n return this.ispageWidth;\n },\n set: function (value) {\n this.ispageWidth = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGrid.prototype, \"isChildGrid\", {\n /**\n * Gets or set if grid `is nested grid`.\n * @private\n */\n get: function () {\n return this.ischildGrid;\n },\n set: function (value) {\n this.ischildGrid = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGrid.prototype, \"size\", {\n /**\n * Gets or set if grid ' is split or not'\n * @public\n */\n // public get isGridSplit() : boolean {\n // return this.isgridSplit;\n // }\n // public set isGridSplit(value : boolean) {\n // this.isgridSplit = value;\n // }public get isGridSplit() : boolean {\n // return this.isgridSplit;\n // }\n // public set isGridSplit(value : boolean) {\n // this.isgridSplit = value;\n // }\n /**\n * Gets the `size`.\n * @private\n */\n get: function () {\n if ((this.gridSize.width === 0 || typeof this.gridSize.width === 'undefined') && this.gridSize.height === 0) {\n this.gridSize = this.measure();\n }\n return this.gridSize;\n // } else {\n // return this.gridSize;\n // }\n },\n set: function (value) {\n this.gridSize = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGrid.prototype, \"ParentCell\", {\n get: function () {\n return this.parentCell;\n },\n set: function (value) {\n this.parentCell = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGrid.prototype, \"LayoutFormat\", {\n get: function () {\n return this.layoutFormat;\n },\n enumerable: true,\n configurable: true\n });\n PdfGrid.prototype.draw = function (arg1, arg2, arg3, arg4) {\n if (arg2 instanceof PointF && typeof arg2.width === 'undefined' && typeof arg3 === 'undefined') {\n return this.drawHelper(arg1, arg2.x, arg2.y);\n }\n else if (typeof arg2 === 'number' && typeof arg3 === 'number' && typeof arg4 === 'undefined') {\n return this.drawHelper(arg1, arg2, arg3, null);\n }\n else if (arg2 instanceof RectangleF && typeof arg2.width !== 'undefined' && typeof arg3 === 'undefined') {\n return this.drawHelper(arg1, arg2, null);\n }\n else if (arg2 instanceof PointF && typeof arg2.width === 'undefined' && arg3 instanceof PdfLayoutFormat) {\n return this.drawHelper(arg1, arg2.x, arg2.y, arg3);\n }\n else if (typeof arg2 === 'number' && typeof arg3 === 'number' && (arg4 instanceof PdfLayoutFormat || arg4 == null)) {\n var width = (arg1.graphics.clientSize.width - arg2);\n var layoutRectangle = new RectangleF(arg2, arg3, width, 0);\n return this.drawHelper(arg1, layoutRectangle, arg4);\n }\n else if (arg2 instanceof RectangleF && typeof arg2.width !== 'undefined' && typeof arg3 === 'boolean') {\n return this.drawHelper(arg1, arg2, null);\n }\n else {\n return this.drawHelper(arg1, arg2, arg3);\n }\n };\n /**\n * `measures` this instance.\n * @private\n */\n PdfGrid.prototype.measure = function () {\n var height = 0;\n var width = this.columns.width;\n for (var i = 0; i < this.headers.count; i++) {\n var row = this.headers.getHeader(i);\n height += row.height;\n }\n for (var i = 0; i < this.rows.count; i++) {\n var row = this.rows.getRow(i);\n height += row.height;\n }\n return new SizeF(width, height);\n };\n PdfGrid.prototype.onBeginCellDraw = function (args) {\n if (this.raiseBeginCellDraw) {\n this.beginCellDraw(this, args);\n }\n };\n PdfGrid.prototype.onEndCellDraw = function (args) {\n if (this.raiseEndCellDraw) {\n this.endCellDraw(this, args);\n }\n };\n /**\n * `Layouts` the specified graphics.\n * @private\n */\n PdfGrid.prototype.layout = function (param) {\n // if (this.rows.count !== 0) {\n // if (this.rows.getRow(0).cells.getCell(0).style.borders.left.width !== 1) {\n // let x : number = this.rows.getRow(0).cells.getCell(0).style.borders.left.width / 2;\n // let y : number = this.rows.getRow(0).cells.getCell(0).style.borders.top.width / 2;\n // if (param.bounds.x === PdfBorders.default.right.width / 2 && param.bounds.y === PdfBorders.default.right.width / 2) {\n // let newBound : RectangleF = new RectangleF(x, y, this.gridSize.width, this.gridSize.height);\n // param.bounds = newBound;\n // }\n // }\n // }\n this.setSpan();\n this.checkSpan();\n this.layoutFormat = param.format;\n this.gridLocation = param.bounds;\n var layouter = new PdfGridLayouter(this);\n var result = (layouter.Layouter(param));\n return result;\n };\n PdfGrid.prototype.setSpan = function () {\n var colSpan = 1;\n var rowSpan = 1;\n var currentCellIndex = 0;\n var currentRowIndex = 0;\n var maxSpan = 0;\n var rowCount = this.headers.count;\n for (var i = 0; i < rowCount; i++) {\n var row = this.headers.getHeader(i);\n maxSpan = 0;\n var colCount = row.cells.count;\n for (var j = 0; j < colCount; j++) {\n var cell = row.cells.getCell(j);\n maxSpan = Math.max(maxSpan, cell.rowSpan);\n //Skip setting span map for already coverted rows/columns.\n if (!cell.isCellMergeContinue && !cell.isRowMergeContinue && (cell.columnSpan > 1 || cell.rowSpan > 1)) {\n if (cell.columnSpan + j > row.cells.count) {\n throw new Error('Invalid span specified at row ' + j.toString() + ' column ' + i.toString());\n }\n if (cell.rowSpan + i > this.headers.count) {\n throw new Error('Invalid span specified at Header ' + j.toString() + ' column ' + i.toString());\n }\n // if (this.rows.count !== 0 && cell.rowSpan + i > this.rows.count) {\n // throw new Error('Invalid span specified at row ' + j.toString() + ' column ' + i.toString());\n // }\n if (cell.columnSpan > 1 && cell.rowSpan > 1) {\n colSpan = cell.columnSpan;\n rowSpan = cell.rowSpan;\n currentCellIndex = j;\n currentRowIndex = i;\n cell.isCellMergeStart = true;\n cell.isRowMergeStart = true;\n //Set Column merges for first row\n while (colSpan > 1) {\n currentCellIndex++;\n row.cells.getCell(currentCellIndex).isCellMergeContinue = true;\n row.cells.getCell(currentCellIndex).isRowMergeContinue = true;\n row.cells.getCell(currentCellIndex).rowSpan = rowSpan;\n colSpan--;\n }\n currentCellIndex = j;\n colSpan = cell.columnSpan;\n //Set Row Merges and column merges foreach subsequent rows.\n while (rowSpan > 1) {\n currentRowIndex++;\n this.headers.getHeader(currentRowIndex).cells.getCell(j).isRowMergeContinue = true;\n this.headers.getHeader(currentRowIndex).cells.getCell(currentCellIndex).isRowMergeContinue = true;\n rowSpan--;\n while (colSpan > 1) {\n currentCellIndex++;\n this.headers.getHeader(currentRowIndex).cells.getCell(currentCellIndex).isCellMergeContinue = true;\n this.headers.getHeader(currentRowIndex).cells.getCell(currentCellIndex).isRowMergeContinue = true;\n colSpan--;\n }\n colSpan = cell.columnSpan;\n currentCellIndex = j;\n }\n }\n else if (cell.columnSpan > 1 && cell.rowSpan === 1) {\n colSpan = cell.columnSpan;\n currentCellIndex = j;\n cell.isCellMergeStart = true;\n //Set Column merges.\n while (colSpan > 1) {\n currentCellIndex++;\n row.cells.getCell(currentCellIndex).isCellMergeContinue = true;\n colSpan--;\n }\n }\n else if (cell.columnSpan === 1 && cell.rowSpan > 1) {\n rowSpan = cell.rowSpan;\n currentRowIndex = i;\n //Set row Merges.\n while (rowSpan > 1) {\n currentRowIndex++;\n this.headers.getHeader(currentRowIndex).cells.getCell(j).isRowMergeContinue = true;\n rowSpan--;\n }\n }\n }\n }\n row.maximumRowSpan = maxSpan;\n }\n };\n PdfGrid.prototype.checkSpan = function () {\n var cellcolSpan;\n var cellrowSpan = 1;\n var cellmaxSpan = 0;\n var currentCellIndex;\n var currentRowIndex = 0;\n cellcolSpan = cellrowSpan = 1;\n currentCellIndex = currentRowIndex = 0;\n if (this.hasRowSpanSpan || this.hasColumnSpan) {\n var rowCount = this.rows.count;\n for (var i = 0; i < rowCount; i++) {\n var row = this.rows.getRow(i);\n cellmaxSpan = 0;\n var colCount = row.cells.count;\n for (var j = 0; j < colCount; j++) {\n var cell = row.cells.getCell(j);\n cellmaxSpan = Math.max(cellmaxSpan, cell.rowSpan);\n //Skip setting span map for already coverted rows/columns.\n if (!cell.isCellMergeContinue && !cell.isRowMergeContinue\n && (cell.columnSpan > 1 || cell.rowSpan > 1)) {\n if (cell.columnSpan + j > row.cells.count) {\n throw new Error('Invalid span specified at row ' + j.toString() + ' column ' + i.toString());\n }\n if (cell.rowSpan + i > this.rows.count) {\n throw new Error('Invalid span specified at row ' + j.toString() + ' column ' + i.toString());\n }\n if (cell.columnSpan > 1 && cell.rowSpan > 1) {\n cellcolSpan = cell.columnSpan;\n cellrowSpan = cell.rowSpan;\n currentCellIndex = j;\n currentRowIndex = i;\n cell.isCellMergeStart = true;\n cell.isRowMergeStart = true;\n //Set Column merges for first row\n while (cellcolSpan > 1) {\n currentCellIndex++;\n row.cells.getCell(currentCellIndex).isCellMergeContinue = true;\n row.cells.getCell(currentCellIndex).isRowMergeContinue = true;\n cellcolSpan--;\n }\n currentCellIndex = j;\n cellcolSpan = cell.columnSpan;\n //Set Row Merges and column merges foreach subsequent rows.\n while (cellrowSpan > 1) {\n currentRowIndex++;\n this.rows.getRow(currentRowIndex).cells.getCell(j).isRowMergeContinue = true;\n this.rows.getRow(currentRowIndex).cells.getCell(currentCellIndex).isRowMergeContinue = true;\n cellrowSpan--;\n while (cellcolSpan > 1) {\n currentCellIndex++;\n this.rows.getRow(currentRowIndex).cells.getCell(currentCellIndex).isCellMergeContinue = true;\n this.rows.getRow(currentRowIndex).cells.getCell(currentCellIndex).isRowMergeContinue = true;\n cellcolSpan--;\n }\n cellcolSpan = cell.columnSpan;\n currentCellIndex = j;\n }\n }\n else if (cell.columnSpan > 1 && cell.rowSpan === 1) {\n cellcolSpan = cell.columnSpan;\n currentCellIndex = j;\n cell.isCellMergeStart = true;\n //Set Column merges.\n while (cellcolSpan > 1) {\n currentCellIndex++;\n row.cells.getCell(currentCellIndex).isCellMergeContinue = true;\n cellcolSpan--;\n }\n }\n else if (cell.columnSpan === 1 && cell.rowSpan > 1) {\n cellrowSpan = cell.rowSpan;\n currentRowIndex = i;\n //Set row Merges.\n while (cellrowSpan > 1) {\n currentRowIndex++;\n this.rows.getRow(currentRowIndex).cells.getCell(j).isRowMergeContinue = true;\n cellrowSpan--;\n }\n }\n }\n }\n row.maximumRowSpan = cellmaxSpan;\n }\n }\n };\n PdfGrid.prototype.measureColumnsWidth = function (bounds) {\n if (typeof bounds !== 'undefined') {\n this.isPageWidth = false;\n var widths = this.columns.getDefaultWidths(bounds.width - bounds.x);\n //let tempWidth : number = this.columns.getColumn(0).width;\n for (var i = 0, count = this.columns.count; i < count; i++) {\n // if (this.columns.getColumn(i).width < 0)\n // this.columns.getColumn(i).columnWidth = widths[i];\n // else if (this.columns.getColumn(i).width > 0 && !this.columns.getColumn(i).isCustomWidth && widths[i]>0 && this.isComplete)\n this.columns.getColumn(i).columnWidth = widths[i];\n this.tempWidth = widths[i];\n }\n if (this.ParentCell != null && this.style.allowHorizontalOverflow == false && this.ParentCell.row.grid.style.allowHorizontalOverflow == false) {\n var padding = 0;\n var columnWidth = 0;\n var columnCount = this.columns.count;\n var childGridColumnWidth = 0;\n if (this.ParentCell.style.cellPadding != null || typeof this.ParentCell.style.cellPadding !== 'undefined') {\n if (typeof this.ParentCell.style.cellPadding.left != 'undefined' && this.ParentCell.style.cellPadding.hasLeftPad) {\n padding += this.ParentCell.style.cellPadding.left;\n }\n if (typeof this.ParentCell.style.cellPadding.right != 'undefined' && this.ParentCell.style.cellPadding.hasRightPad) {\n padding += this.ParentCell.style.cellPadding.right;\n }\n }\n for (var i = 0; i < this.ParentCell.columnSpan; i++) {\n columnWidth += this.ParentCell.row.grid.columns.getColumn(this.parentCellIndex + i).width;\n }\n for (var j = 0; j < this.columns.count; j++) {\n if (this.gridColumns.getColumn(j).width > 0 && this.gridColumns.getColumn(j).isCustomWidth) {\n columnWidth -= this.gridColumns.getColumn(j).width;\n columnCount--;\n }\n }\n if ((this.ParentCell.row.grid.style.cellPadding != null || typeof this.ParentCell.row.grid.style.cellPadding != 'undefined')) {\n if (typeof this.ParentCell.row.grid.style.cellPadding.top != 'undefined' && this.ParentCell.row.grid.style.cellPadding.hasTopPad) {\n padding += this.ParentCell.row.grid.style.cellPadding.top;\n }\n if (typeof this.ParentCell.row.grid.style.cellPadding.bottom != 'undefined' && this.ParentCell.row.grid.style.cellPadding.hasBottomPad) {\n padding += this.ParentCell.row.grid.style.cellPadding.bottom;\n }\n }\n if (this.ParentCell.row.grid.style.cellSpacing != 0) {\n columnWidth -= this.ParentCell.row.grid.style.cellSpacing * 2;\n }\n if (columnWidth > padding) {\n childGridColumnWidth = (columnWidth - padding) / columnCount;\n this.tempWidth = childGridColumnWidth;\n if (this.ParentCell != null) {\n for (var j = 0; j < this.columns.count; j++) {\n if (!this.columns.getColumn(j).isCustomWidth)\n this.columns.getColumn(j).columnWidth = childGridColumnWidth;\n }\n }\n }\n }\n // if (this.ParentCell != null && this.ParentCell.row.width > 0)\n // {\n // if (this.isChildGrid && this.gridSize.width > this.ParentCell.row.width)\n // {\n // widths = this.columns.getDefaultWidths(bounds.width);\n // for (let i : number = 0; i < this.columns.count; i++)\n // {\n // this.columns.getColumn(i).width = widths[i];\n // }\n // }\n // }\n }\n else {\n var widths = [this.columns.count];\n for (var n = 0; n < this.columns.count; n++) {\n widths[n] = 0;\n }\n var cellWidth = 0;\n var cellWidths = 0;\n if ((typeof this.isChildGrid === 'undefined' && typeof this.gridLocation !== 'undefined') || (this.isChildGrid === null && typeof this.gridLocation !== 'undefined')) {\n this.initialWidth = this.gridLocation.width;\n }\n if (this.headers.count > 0) {\n var colCount_1 = this.headers.getHeader(0).cells.count;\n var rowCount = this.headers.count;\n for (var i = 0; i < colCount_1; i++) {\n cellWidth = 0;\n for (var j = 0; j < rowCount; j++) {\n var rowWidth = Math.min(this.initialWidth, this.headers.getHeader(j).cells.getCell(i).width);\n cellWidth = Math.max(cellWidth, rowWidth);\n }\n widths[i] = cellWidth;\n }\n }\n // else {\n // let colCount : number = this.rows.getRow(0).cells.count;\n // let rowCount : number = this.rows.count;\n // for (let i : number = 0; i < colCount; i++) {\n // cellWidth = 0;\n // for (let j : number = 0; j < rowCount; j++) {\n // let rowWidth : number = Math.min(this.initialWidth, this.rows.getRow(j).cells.getCell(i).width);\n // cellWidth = Math.max(cellWidth, rowWidth);\n // }\n // widths[i] = cellWidth;\n // }\n // }\n cellWidth = 0;\n for (var i = 0, colCount_2 = this.columns.count; i < colCount_2; i++) {\n for (var j = 0, rowCount = this.rows.count; j < rowCount; j++) {\n if ((this.rows.getRow(j).cells.getCell(i).columnSpan == 1 && !this.rows.getRow(j).cells.getCell(i).isCellMergeContinue) || this.rows.getRow(j).cells.getCell(i).value != null) {\n if (this.rows.getRow(j).cells.getCell(i).value != null && !this.rows.getRow(j).grid.style.allowHorizontalOverflow) {\n var value = this.rows.getRow(j).grid.style.cellPadding.right +\n this.rows.getRow(j).grid.style.cellPadding.left\n + this.rows.getRow(j).cells.getCell(i).style.borders.left.width / 2;\n // if (this.initialWidth != 0 )\n // (this.rows.getRow(j).cells.getCell(i).value as PdfGrid).initialWidth = this.initialWidth - value;\n }\n var rowWidth = 0;\n rowWidth = this.initialWidth > 0.0 ? Math.min(this.initialWidth, this.rows.getRow(j).cells.getCell(i).width) : this.rows.getRow(j).cells.getCell(i).width;\n // let internalWidth : number = this.rows.getRow(j).cells.getCell(i).width;\n // internalWidth += this.rows.getRow(j).cells.getCell(i).style.borders.left.width;\n // internalWidth += this.rows.getRow(j).cells.getCell(i).style.borders.right.width;\n // let internalHeight : number = this.rows.getRow(j).cells.getCell(i).height;\n // internalHeight += (this.rows.getRow(j).cells.getCell(i).style.borders.top.width);\n // internalHeight += (this.rows.getRow(j).cells.getCell(i).style.borders.bottom.width);\n // let isCorrectWidth : boolean = (internalWidth + this.gridLocation.x) > this.currentGraphics.clientSize.width;\n // let isCorrectHeight : boolean = (internalHeight + this.gridLocation.y) > this.currentGraphics.clientSize.height;\n // if (isCorrectWidth || isCorrectHeight) {\n // throw Error('Image size exceeds client size of the page. Can not insert this image');\n // }\n // rowWidth = Math.min(this.initialWidth, this.rows.getRow(j).cells.getCell(i).width);\n cellWidth = Math.max(widths[i], Math.max(cellWidth, rowWidth));\n cellWidth = Math.max(this.columns.getColumn(i).width, cellWidth);\n }\n }\n if (this.rows.count != 0)\n widths[i] = cellWidth;\n cellWidth = 0;\n }\n for (var i = 0, RowCount = this.rows.count; i < RowCount; i++) {\n for (var j = 0, ColCount = this.columns.count; j < ColCount; j++) {\n if (this.rows.getRow(i).cells.getCell(j).columnSpan > 1) {\n var total = widths[j];\n for (var k = 1; k < this.rows.getRow(i).cells.getCell(j).columnSpan; k++) {\n total += widths[j + k];\n }\n // if (this.rows.getRow(i).cells.getCell(j).width > total)\n // {\n // let extendedWidth : number = this.rows.getRow(i).cells.getCell(j).width - total;\n // extendedWidth = extendedWidth / this.rows.getRow(i).cells.getCell(j).columnSpan;\n // for (let k : number = j; k < j + this.rows.getRow(i).cells.getCell(j).columnSpan; k++)\n // widths[k] += extendedWidth;\n // }\n }\n }\n }\n // if (this.isChildGrid && this.initialWidth != 0)\n // {\n // widths = this.columns.getDefaultWidths(this.initialWidth);\n // }\n for (var i = 0, count = this.columns.count; i < count; i++) {\n if (this.columns.getColumn(i).width <= 0)\n this.columns.getColumn(i).columnWidth = widths[i];\n else if (this.columns.getColumn(i).width > 0 && !this.columns.getColumn(i).isCustomWidth)\n this.columns.getColumn(i).columnWidth = widths[i];\n }\n var padding = 0;\n var colWidth = 0;\n var colCount = this.columns.count;\n var childGridColWidth = 0;\n colWidth = this.tempWidth;\n for (var j = 0; j < this.columns.count; j++) {\n if (this.gridColumns.getColumn(j).width > 0 && this.gridColumns.getColumn(j).isCustomWidth) {\n colWidth -= this.gridColumns.getColumn(j).width;\n colCount--;\n }\n }\n // if (this.style.cellSpacing != 0){\n // colWidth -= this.style.cellSpacing * 2;\n // }\n if (colWidth > 0) {\n if (this.ParentCell.row.grid.style.cellSpacing != 0) {\n colWidth -= this.ParentCell.row.grid.style.cellSpacing * 2;\n }\n }\n if (colWidth > padding) {\n childGridColWidth = (colWidth) / colCount;\n if (this.ParentCell != null) {\n for (var j = 0; j < this.columns.count; j++) {\n if (!this.columns.getColumn(j).isCustomWidth)\n this.columns.getColumn(j).columnWidth = childGridColWidth;\n }\n }\n }\n }\n };\n return PdfGrid;\n}(PdfLayoutElement));\nexport { PdfGrid };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { PdfGrid } from '../pdf-grid';\nimport { PdfStringFormat } from './../../../graphics/fonts/pdf-string-format';\nimport { SizeF, RectangleF, PointF } from './../../../drawing/pdf-drawing';\nimport { PdfBorders } from '../styles/pdf-borders';\nimport { PdfLayoutType, PdfLayoutBreakType } from './../../../graphics/figures/enum';\nimport { PdfLayoutResult, PdfLayoutFormat, ElementLayouter } from './../../../graphics/figures/base/element-layouter';\nimport { PdfHorizontalOverflowType } from '../styles/style';\nimport { TemporaryDictionary } from './../../../collections/object-object-pair/dictionary';\n/**\n * Class `lay outing the text`.\n *\n */\nvar PdfGridLayouter = /** @class */ (function (_super) {\n __extends(PdfGridLayouter, _super);\n //constructor\n /**\n * Initialize a new instance for `PdfGrid` class.\n * @private\n */\n function PdfGridLayouter(baseFormat) {\n var _this = _super.call(this, baseFormat) || this;\n /**\n * @hidden\n * @private\n */\n _this.gridInitialWidth = 0;\n /**\n * @hidden\n * @private\n */\n _this.gridSize = new SizeF(0, 0);\n _this.parentCellIndex = 0;\n _this.tempWidth = 0;\n _this.childheight = 0;\n /**\n * Check weather it is `child grid or not`.\n * @private\n */\n _this.isChildGrid = false;\n /**\n * @hidden\n * @private\n */\n _this.hasRowSpanSpan = false;\n /**\n * @hidden\n * @private\n */\n _this.isRearranged = false;\n /**\n * @hidden\n * @private\n */\n _this.pageBounds = new RectangleF();\n /**\n * @hidden\n * @private\n */\n _this.listOfNavigatePages = [];\n /**\n * @hidden\n * @private\n */\n _this.flag = true;\n /**\n * @hidden\n * @private\n */\n _this.columnRanges = [];\n /**\n * @hidden\n * @private\n */\n _this.currentLocation = new PointF(0, 0);\n /**\n * @hidden\n * @private\n */\n _this.breakRow = true;\n /**\n * Checks whether the x co-ordinate is need to set as client size or not.\n * @hidden\n * @private\n */\n _this.isOverloadWithPosition = false;\n return _this;\n }\n Object.defineProperty(PdfGridLayouter.prototype, \"Grid\", {\n //Properties\n get: function () {\n return this.elements;\n },\n enumerable: true,\n configurable: true\n });\n // Constructors\n /**\n * Initializes a new instance of the `StringLayouter` class.\n * @private\n */\n //Public methods\n /**\n * `Layouts` the text.\n * @private\n */\n /**\n * `Layouts` the specified graphics.\n * @private\n */\n /**\n * `Layouts` the specified graphics.\n * @private\n */\n /*public layout(graphics : PdfLayoutParams) : PdfLayoutResult\n public layout(graphics : PdfGraphics, bounds : RectangleF) : void\n public layout(graphics : PdfGraphics, bounds : PointF) : void\n public layout(graphics ?: PdfGraphics | PdfLayoutParams, bounds ?: PointF | RectangleF) : void | PdfLayoutResult {\n if (graphics instanceof PdfGraphics) {\n if (bounds instanceof PointF) {\n if (bounds.x === 0) {\n bounds.x = PdfBorders.default.right.width / 2;\n }\n if (bounds.y === 0) {\n bounds.y = PdfBorders.default.top.width / 2;\n }\n let boundaries : RectangleF = new RectangleF(bounds, new SizeF(0, 0));\n this.layout(graphics, boundaries);\n } else {\n let width : number = graphics.clientSize.width;\n let parameter : PdfLayoutParams = new PdfLayoutParams();\n parameter.bounds = bounds;\n this.currentGraphics = graphics;\n if (graphics.layer != null) {\n let index : number = 0;\n if (this.currentGraphics.page instanceof PdfPage) {\n index = (this.currentGraphics.page as PdfPage).section.indexOf(this.currentGraphics.page as PdfPage);\n } else {\n index = (this.currentGraphics.page as PdfPageBase).defaultLayerIndex;\n }\n } else {\n this.layoutInternal(parameter);\n }\n }\n }\n }*/\n /**\n * Gets the `format`.\n * @private\n */\n PdfGridLayouter.prototype.getFormat = function (format) {\n var f = format;\n return f;\n };\n /**\n * `Layouts` the element.\n * @private\n */\n PdfGridLayouter.prototype.layoutInternal = function (param) {\n var format = this.getFormat(param.format);\n this.gridLayoutFormat = this.getFormat(param.format);\n this.currentPage = param.page;\n if (this.currentPage !== null) {\n var pageHeight = this.currentPage.getClientSize().height;\n var pageWidth = this.currentPage.getClientSize().width;\n //if (pageHeight > pageWidth) {\n this.currentPageBounds = this.currentPage.getClientSize();\n //}\n }\n else {\n throw Error('Can not set page as null');\n //this.currentPageBounds = this.currentGraphics.clientSize;\n }\n this.currentGraphics = this.currentPage.graphics;\n //this.currentGraphics = (this.currentPage != null ) ? this.currentPage.graphics : this.currentGraphics;\n // if (this.currentGraphics.layer !== null) {\n // let index : number = 0;\n // if (this.currentGraphics.page instanceof PdfPage) {\n // index = (this.currentGraphics.page as PdfPage).section.indexOf(this.currentGraphics.page as PdfPage);\n // } else {\n // index = (this.currentGraphics.page as PdfPageBase).defaultLayerIndex;\n // }\n // this.listOfNavigatePages.push(index);\n // }\n var index = 0;\n index = this.currentGraphics.page.section.indexOf(this.currentGraphics.page);\n this.listOfNavigatePages.push(index);\n if (format != null && format.break === PdfLayoutBreakType.FitColumnsToPage) {\n this.currentBounds = new RectangleF(new PointF(param.bounds.x, param.bounds.y), new SizeF(this.Grid.columns.width, this.currentGraphics.clientSize.height));\n }\n else {\n this.currentBounds = new RectangleF(new PointF(param.bounds.x, param.bounds.y), this.currentGraphics.clientSize);\n }\n //this.currentBounds = new RectangleF(new PointF(param.bounds.x, param.bounds.y), this.currentGraphics.clientSize);\n if (this.Grid.rows.count !== 0) {\n this.currentBounds.width = (param.bounds.width > 0) ? param.bounds.width :\n (this.currentBounds.width - this.Grid.rows.getRow(0).cells.getCell(0).style.borders.left.width / 2);\n }\n else if (this.Grid.headers.count !== 0) {\n // this.currentBounds.width = (param.bounds.width > 0) ? param.bounds.width : (this.currentBounds.width -\n // this.Grid.headers.getHeader(0).cells.getCell(0).style.borders.left.width / 2);\n this.currentBounds.width = param.bounds.width;\n }\n else {\n throw Error('Please add row or header into grid');\n }\n this.startLocation = new PointF(param.bounds.x, param.bounds.y);\n // if (this.Grid.style.allowHorizontalOverflow && this.currentBounds.width > this.currentGraphics.clientSize.width) {\n // this.currentBounds.width = this.currentGraphics.clientSize.width;\n // this.currentBounds.width -= this.currentBounds.x;\n // }\n // if (this.Grid.isChildGrid) {\n // this.childheight = param.bounds.height;\n // }\n // if (param.format !== null && param.format.usePaginateBounds) {\n // if (param.format.paginateBounds.height > 0) {\n // this.currentBounds.height = param.format.paginateBounds.height;\n // }\n //} else \n if (param.bounds.height > 0 && !this.Grid.isChildGrid) {\n this.currentBounds.height = param.bounds.height;\n }\n if (!this.Grid.isChildGrid) {\n this.hType = this.Grid.style.horizontalOverflowType;\n }\n if (!this.Grid.style.allowHorizontalOverflow) {\n this.columnRanges = [];\n this.Grid.measureColumnsWidth(this.currentBounds);\n this.columnRanges.push([0, this.Grid.columns.count - 1]);\n }\n else {\n this.Grid.measureColumnsWidth();\n this.determineColumnDrawRanges();\n }\n if (this.Grid.hasRowSpanSpan) {\n for (var i = 0; i < this.Grid.rows.count; i++) {\n var height = this.Grid.rows.getRow(i).height;\n if (!this.Grid.rows.getRow(i).isRowHeightSet) {\n this.Grid.rows.getRow(i).isRowHeightSet = true;\n }\n }\n }\n var result = this.layoutOnPage(param);\n return result;\n };\n // /* tslint:enable */\n /**\n * `Determines the column draw ranges`.\n * @private\n */\n PdfGridLayouter.prototype.determineColumnDrawRanges = function () {\n var startColumn = 0;\n var endColumn = 0;\n var cellWidths = 0;\n var availableWidth = this.currentGraphics.clientSize.width - this.currentBounds.x;\n for (var i = 0; i < this.Grid.columns.count; i++) {\n cellWidths += this.Grid.columns.getColumn(i).width;\n if (cellWidths >= availableWidth) {\n var subWidths = 0;\n for (var j = startColumn; j <= i; j++) {\n subWidths += this.Grid.columns.getColumn(j).width;\n if (subWidths > availableWidth) {\n break;\n }\n endColumn = j;\n }\n this.columnRanges.push([startColumn, endColumn]);\n startColumn = endColumn + 1;\n endColumn = startColumn;\n cellWidths = (endColumn <= i) ? this.Grid.columns.getColumn(i).width : 0;\n }\n }\n // if (startColumn !== this.columns.Count) {\n this.columnRanges.push([startColumn, this.Grid.columns.count - 1]);\n // }\n };\n /**\n * `Layouts the on page`.\n * @private\n */\n PdfGridLayouter.prototype.layoutOnPage = function (param) {\n /* tslint:disable */\n this.pageBounds.x = param.bounds.x;\n this.pageBounds.y = param.bounds.y;\n this.pageBounds.height = param.bounds.height;\n var format = this.getFormat(param.format);\n var endArgs = null;\n var result = null;\n var layoutedPages = new TemporaryDictionary();\n var startPage = param.page;\n var isParentCell = false;\n var cellBounds = [];\n for (var index = 0; index < this.columnRanges.length; index++) {\n var range = this.columnRanges[index];\n this.cellStartIndex = range[0];\n this.cellEndIndex = range[1];\n var returnObject = this.raiseBeforePageLayout(this.currentPage, this.currentBounds, this.currentRowIndex);\n this.currentBounds = returnObject.currentBounds;\n this.currentRowIndex = returnObject.currentRowIndex;\n // if (returnObject.returnValue) {\n // result = new PdfGridLayoutResult(this.currentPage, this.currentBounds);\n // break;\n // }\n //Draw Headers.\n var drawHeader = void 0;\n for (var i_1 = 0; i_1 < this.Grid.headers.count; i_1++) {\n var row = this.Grid.headers.getHeader(i_1);\n var headerHeight = this.currentBounds.y;\n // RowLayoutResult\n var headerResult = this.drawRow(row);\n // if (headerHeight === this.currentBounds.y) {\n // drawHeader = true;\n // if (PdfGrid.repeatRowIndex === -1) {\n // PdfGrid.repeatRowIndex = this.rows.getRow.indexOf(row);\n // }\n // } else {\n drawHeader = false;\n // }\n }\n var i = 0;\n var length_1 = this.Grid.rows.count;\n var repeatRow = void 0;\n var startingHeight = 0;\n var flag = true;\n //Here is to draw parent Grid and Cells\n cellBounds = [];\n //Draw row by row with the specified cell range.\n for (var j = 0; j < this.Grid.rows.count; j++) {\n var row = this.Grid.rows.getRow(j);\n i++;\n this.currentRowIndex = i - 1;\n var originalHeight = this.currentBounds.y;\n startPage = this.currentPage;\n PdfGridLayouter.repeatRowIndex = -1;\n if (flag && row.grid.isChildGrid) {\n startingHeight = originalHeight;\n flag = false;\n }\n var rowResult = null;\n ///rowResult = this.drawRow(row);\n /*if(!row.isrowFinish) {\n if(!row.grid.isgridSplit){\n rowResult = this.drawRow(row);\n row.isrowFinish = true;\n row.isrowDraw = true;\n } else {\n if(!row.isrowDraw){\n rowResult = this.drawRow(row);\n row.isrowFinish = true;\n row.isrowDraw = true;\n row.grid.isgridSplit = false;\n } else {\n rowResult = null;\n break;\n }\n }\n }\n else {\n //row.isrowFinish = false;\n //rowResult = this.drawRow(row);\n rowResult = null;\n break;\n \n } */\n if (this.Grid.splitChildRowIndex == -1) {\n rowResult = this.drawRow(row);\n row.isrowFinish = true;\n }\n else {\n if (row.grid.ParentCell.row.grid.isGridSplit && this.Grid.splitChildRowIndex <= row.rowIndex) {\n rowResult = this.drawRow(row);\n row.isrowFinish = true;\n }\n else if (row.isrowFinish) {\n continue;\n }\n else {\n break;\n }\n }\n //rowResult = this.drawRow(row);\n cellBounds.push(rowResult.bounds.width);\n /*if (row.isRowBreaksNextPage)\n {\n let x : number = 0;\n for (let l : number = 0; l < row.cells.count; l++)\n {\n let isNestedRowBreak : boolean = false;\n if (row.height == row.cells.getCell(l).height)\n {\n let n : number;\n let grid : PdfGrid = row.cells.getCell(l).value as PdfGrid;\n for (let m : number = grid.rows.count; 0 < m; m--)\n {\n if ((grid.rows.getRow(m - 1).rowBreakHeight > 0))\n {\n isNestedRowBreak = true;\n break;\n }\n if (grid.rows.getRow(m - 1).isRowBreaksNextPage)\n {\n row.rowBreakHeightValue = grid.rows.getRow(m - 1).rowBreakHeightValue;\n break;\n }\n row.rowBreakHeightValue += grid.rows.getRow(m - 1).height;\n }\n }\n if (isNestedRowBreak)\n break;\n }\n for (let j : number = 0; j < row.cells.count; j++)\n {\n\n if (row.height > row.cells.getCell(j).height)\n {\n row.cells.getCell(j).value = \" \";\n let rect : RectangleF ;\n let page : PdfPage = this.getNextPage(this.currentPage);\n let section : PdfSection = this.currentPage.section;\n let index : number = section.indexOf(page);\n for (let k : number = 0; k < (section.count - 1) - index; k++)\n {\n rect = new RectangleF(x, 0, row.grid.columns.getColumn(j).width, page.getClientSize().height);\n PdfGridLayouter.repeatRowIndex = -1;\n row.cells.getCell(j).draw(page.graphics, rect, false);\n page = this.getNextPage(page);\n }\n rect = new RectangleF(x, 0, row.grid.columns.getColumn(j).width, row.rowBreakHeightValue);\n\n row.cells.getCell(j).draw(page.graphics, rect, false);\n }\n x += row.grid.columns.getColumn(j).width;\n }\n }*/\n //if height remains same, it is understood that row is not drawn in the page\n if (originalHeight === this.currentBounds.y) {\n repeatRow = true;\n PdfGridLayouter.repeatRowIndex = this.Grid.rows.rowCollection.indexOf(row);\n }\n else {\n repeatRow = false;\n PdfGridLayouter.repeatRowIndex = -1;\n }\n while (!rowResult.isFinish && startPage != null) {\n var tempResult = this.getLayoutResult();\n /*if (startPage != this.currentPage)\n {\n if (row.grid.isChildGrid && row.grid.ParentCell != null)\n {\n let bounds : RectangleF= new RectangleF(new PointF(format.paginateBounds.x,format.paginateBounds.y), new SizeF(param.bounds.width, tempResult.bounds.height));\n bounds.x += param.bounds.x;\n if (row.grid.ParentCell.row.grid.style.cellPadding != null)\n {\n bounds.y += row.grid.ParentCell.row.grid.style.cellPadding.top;\n if (bounds.height > this.currentPageBounds.height)\n {\n bounds.height = this.currentPageBounds.height - bounds.y;\n bounds.height -= (row.grid.ParentCell.row.grid.style.cellPadding.bottom);\n }\n }\n // Draw border for cells in the nested grid cell's row.\n for (let c : number = 0; c < row.cells.count; c++)\n {\n let cell : PdfGridCell = row.cells.getCell(c);\n let cellWidth : number= 0;\n if (cell.columnSpan > 1)\n {\n for (; c < cell.columnSpan; c++)\n cellWidth += row.grid.columns.getColumn(c).width;\n }\n else\n cellWidth = Math.max(cell.width, row.grid.columns.getColumn(c).width);\n cell.drawCellBorders(this.currentGraphics, new RectangleF(new PointF(bounds.x,bounds.y), new SizeF(cellWidth, bounds.height)));\n bounds.x += cellWidth;\n c += (cell.columnSpan - 1);\n }\n }\n }\n */\n endArgs = this.raisePageLayouted(tempResult);\n if (endArgs.cancel || repeatRow)\n break;\n else if (this.Grid.allowRowBreakAcrossPages) {\n //If there is no space in the current page, add new page and then draw the remaining row.\n this.currentPage = this.getNextPageformat(format);\n originalHeight = this.currentBounds.y;\n var location_1 = new PointF(PdfBorders.default.right.width / 2, PdfBorders.default.top.width / 2);\n // if (format.paginateBounds == new RectangleF(0,0,0,0) && this.startLocation == location)\n // {\n // this.currentBounds.x += this.startLocation.x;\n // this.currentBounds.y += this.startLocation.y;\n // }\n if (this.Grid.isChildGrid && row.grid.ParentCell != null) {\n if (this.Grid.ParentCell.row.grid.style.cellPadding != null) {\n if (row.rowBreakHeight + this.Grid.ParentCell.row.grid.style.cellPadding.top < this.currentBounds.height) {\n this.currentBounds.y = this.Grid.ParentCell.row.grid.style.cellPadding.top;\n }\n }\n }\n if (row.grid.ParentCell != null) {\n row.grid.ParentCell.row.isRowBreaksNextPage = true;\n row.grid.ParentCell.row.rowBreakHeightValue = row.rowBreakHeight + this.Grid.ParentCell.row.grid.style.cellPadding.top + this.Grid.ParentCell.row.grid.style.cellPadding.bottom;\n for (var i_2 = row.rowIndex + 1; i_2 < row.grid.rows.count; i_2++) {\n row.grid.ParentCell.row.rowBreakHeightValue += row.grid.rows.getRow(i_2).height;\n }\n //row.rowBreakHeight = row.grid.ParentCell.row.rowBreakHeightValue;\n }\n /*if (row.noOfPageCount > 1)\n {\n let temp : number = row.rowBreakHeightValue;\n for (let j : number = 1; j < row.noOfPageCount; j++)\n {\n row.rowBreakHeightValue = 0;\n row.height = ((row.noOfPageCount - 1) * this.currentPage.getClientSize().height);\n this.drawRow(row);\n this.currentPage = this.getNextPageformat(format);\n startPage = this.currentPage;\n }\n row.rowBreakHeightValue = temp;\n row.noOfPageCount = 1;\n rowResult = this.drawRow(row);\n } else {\n rowResult = this.drawRow(row);\n }\n /*if(row.grid.isChildGrid){\n row.isrowFinish = false;\n row.isrowDraw = false;\n row.grid.isgridSplit = true;\n row.grid.ParentCell.row.grid.isgridSplit = true;\n //rowResult.isFinish = false;\n break;\n }*/\n if (row.grid.isChildGrid) {\n //row.grid.isgridSplit = true;\n row.isrowFinish = false;\n //row.grid.ParentCell.row.grid.isgridSplit = true;\n row.grid.splitChildRowIndex = row.rowIndex;\n row.grid.ParentCell.row.grid.splitChildRowIndex = row.grid.ParentCell.row.rowIndex;\n if (row.grid.ParentCell.row.grid.isGridSplit) {\n row.grid.ParentCell.row.noOfPageCount += 1;\n row.grid.ParentCell.row.grid.isGridSplit = false;\n }\n break;\n }\n if (row.noOfPageCount < 1) {\n if (row.grid.splitChildRowIndex != -1) {\n row.grid.isGridSplit = true;\n }\n this.currentBounds.y = 0.50;\n if (this.Grid.repeatHeader) {\n for (var j_1 = 0; j_1 < this.Grid.headers.count; j_1++) {\n var headerRepeat = this.Grid.headers.getHeader(j_1);\n this.drawRow(headerRepeat);\n }\n }\n rowResult = this.drawRow(row);\n if (row.noOfPageCount >= 1) {\n var temp = row.rowBreakHeightValue;\n for (var j_2 = 0; j_2 < row.noOfPageCount; j_2++) {\n //this.currentPage.section.add();\n var tempResult1 = this.getLayoutResult();\n endArgs = this.raisePageLayouted(tempResult1);\n this.currentPage = this.getNextPageformat(format);\n originalHeight = this.currentBounds.y;\n //row.rowBreakHeightValue = 0;\n if (row.grid.splitChildRowIndex != -1) {\n row.grid.isGridSplit = true;\n }\n this.currentBounds.y = 0.5;\n if (this.Grid.repeatHeader) {\n for (var i_3 = 0; i_3 < this.Grid.headers.count; i_3++) {\n var header = this.Grid.headers.getHeader(i_3);\n this.drawRow(header);\n }\n }\n //row.height = ((row.noOfPageCount - 1) * this.currentPage.getClientSize().height);\n this.drawRow(row);\n }\n // row.rowBreakHeight = temp;\n // row.noOfPageCount = 1;\n // rowResult = this.drawRow(row);\n }\n row.grid.splitChildRowIndex = -1;\n row.grid.isGridSplit = false;\n rowResult.isFinish = true;\n //row.NestedGridLayoutResult.bounds.height = row.rowBreakHeightValue;\n //this.currentBounds.y = rowResult.bounds.y;\n for (var i_4 = 0; i_4 < row.cells.count; i_4++) {\n if (row.cells.getCell(i_4).value instanceof PdfGrid) {\n row.cells.getCell(i_4).value.splitChildRowIndex = -1;\n }\n }\n }\n }\n // else if (!this.Grid.allowRowBreakAcrossPages && i < length)\n // {\n // this.currentPage = this.getNextPageformat(format);\n // break;\n // }\n // else if (i >= length)\n // break;\n }\n if (!rowResult.isFinish && startPage !== null && format.layout !== PdfLayoutType.OnePage && repeatRow) {\n // During pagination, cell position is maintained here.\n this.startLocation.x = this.currentBounds.x;\n var isAddNextPage = false;\n this.currentPage = this.getNextPageformat(format);\n /*if (!this.Grid.isSingleGrid)\n {\n for ( let j : number= 0; j < this.Grid.rows.count; j++)\n {\n let isWidthGreaterthanParent : boolean = false;\n for (let k : number = 0; k < this.Grid.rows.getRow(j).cells.count; k++)\n {\n if (this.Grid.rows.getRow(j).cells.getCell(k).width > this.currentPageBounds.width)\n isWidthGreaterthanParent = true;\n }\n if (isWidthGreaterthanParent && this.Grid.rows.getRow(j).cells.getCell(this.rowBreakPageHeightCellIndex).pageCount > 0)\n {\n isAddNextPage = true;\n }\n }\n }\n if (!this.Grid.isRearranged && isAddNextPage)\n {\n let section : PdfSection = this.currentPage.section;\n \n //this.currentPage = section.add();\n \n this.currentGraphics = this.currentPage.graphics;\n this.currentBounds = new RectangleF(new PointF(0,0), this.currentPage.getClientSize());\n \n let pageindex : number = (this.currentGraphics.page as PdfPage).section.indexOf(this.currentGraphics.page as PdfPage);\n }\n else\n {\n this.currentPage = this.getNextPageformat(format);\n }\n if (format.paginateBounds.y == 0)\n this.currentBounds.y = PdfBorders.default.top.width/2;\n else\n {\n this.currentBounds.y = format == null ? 0 : format.paginateBounds.y;\n \n }\n if (this.raiseBeforePageLayout(this.currentPage, this.currentBounds, this.currentRowIndex))\n break;*/\n if ((param.format !== null) && !param.format.usePaginateBounds && param.bounds !== null &&\n param.bounds.height > 0 && !this.Grid.isChildGrid) {\n this.currentBounds.height = param.bounds.height;\n }\n if ((param.format !== null) && !param.format.usePaginateBounds && param.bounds !== null &&\n param.bounds.y > 0 && !this.Grid.isChildGrid) {\n this.currentBounds.y = param.bounds.y;\n }\n this.startLocation.y = this.currentBounds.y;\n if ((format.paginateBounds.x === format.paginateBounds.y) &&\n (format.paginateBounds.y === format.paginateBounds.height) &&\n (format.paginateBounds.height === format.paginateBounds.width) && (format.paginateBounds.width === 0)) {\n this.currentBounds.x += this.startLocation.x;\n }\n if (this.currentBounds.x === PdfBorders.default.left.width / 2) {\n this.currentBounds.y += this.startLocation.x;\n }\n if (this.Grid.repeatHeader) {\n for (var i_5 = 0; i_5 < this.Grid.headers.count; i_5++) {\n var header = this.Grid.headers.getHeader(i_5);\n this.drawRow(header);\n }\n }\n this.drawRow(row);\n if (this.currentPage !== null && !layoutedPages.containsKey(this.currentPage)) {\n layoutedPages.add(this.currentPage, range);\n }\n }\n if (row.NestedGridLayoutResult != null) {\n // Position for next row in the grid.\n this.currentPage = row.NestedGridLayoutResult.page;\n this.currentGraphics = this.currentPage.graphics; //If not, next row will not be drawn in the layouted page.\n this.startLocation = new PointF(row.NestedGridLayoutResult.bounds.x, row.NestedGridLayoutResult.bounds.y);\n var recalHeight = this.ReCalculateHeight(row, row.NestedGridLayoutResult.bounds.height);\n this.currentBounds.y = recalHeight;\n //this.currentBounds.y = row.NestedGridLayoutResult.bounds.height;\n if (startPage != this.currentPage) {\n var secion = this.currentPage.section;\n var startIndex = secion.indexOf(startPage) + 1;\n var endIndex = secion.indexOf(this.currentPage);\n for (var page = startIndex; page < endIndex + 1; page++) {\n var pageGraphics = this.currentPage.graphics;\n var location_2 = new PointF(format.paginateBounds.x, format.paginateBounds.y);\n var height = page == endIndex ? (row.NestedGridLayoutResult.bounds.height - param.bounds.y) :\n (this.currentBounds.height - location_2.y);\n if (height <= pageGraphics.clientSize.height)\n height += param.bounds.y;\n // if (row.grid.isChildGrid && row.grid.ParentCell != null)\n // location.x += param.bounds.x;\n location_2.y = format == null ? 0.5 : format.paginateBounds.y;\n // Draw border for last paginated row containing nested grid.\n for (var c = 0; c < row.cells.count; c++) {\n var cell = row.cells.getCell(c);\n var cellWidth = 0;\n var totalwidth = 0;\n if (cell.value instanceof PdfGrid) {\n for (var i_6 = 0; i_6 < cell.value.columns.count; i_6++) {\n totalwidth += cell.value.columns.getColumn(i_6).columnWidth;\n }\n }\n else {\n totalwidth = cell.width;\n }\n // if (cell.columnSpan > 1)\n // {\n // for (; c < cell.columnSpan; c++)\n // cellWidth += row.grid.columns.getColumn(c).width;\n // }\n // else\n cellWidth = Math.max(totalwidth, row.grid.columns.getColumn(c).width);\n cell.drawCellBorders(pageGraphics, new RectangleF(location_2, new SizeF(cellWidth, height)));\n location_2.x += cellWidth;\n c += (cell.columnSpan - 1);\n }\n }\n // So, nested grid drawing is completed for the current row. Update page.\n // Otherwise, the next nested grid of the parent will draw borders from start.\n startPage = this.currentPage;\n }\n }\n }\n var isPdfGrid = false;\n var maximumCellBoundsWidth = 0;\n if (cellBounds.length > 0) {\n maximumCellBoundsWidth = cellBounds[0];\n }\n var largeNavigatePage = [[1, 2]];\n for (var c = 0; c < this.Grid.rows.count; c++) {\n if (this.cellEndIndex != -1 && this.Grid.rows.getRow(c).cells.getCell(this.cellEndIndex).value instanceof PdfGrid) {\n var grid = this.Grid.rows.getRow(c).cells.getCell(this.cellEndIndex).value;\n this.rowLayoutBoundsWidth = grid.rowLayoutBoundsWidth;\n isPdfGrid = true;\n // if (largeNavigatePage[0][0] < grid.listOfNavigatePages.length)\n // {\n // largeNavigatePage[0][0] = grid.listOfNavigatePages.length;\n // largeNavigatePage[0][1] = cellBounds[c];\n // }\n // else if ((largeNavigatePage[0][0] == grid.listOfNavigatePages.length) && (largeNavigatePage[0][1] < cellBounds[c]))\n // {\n // largeNavigatePage[0][1] = cellBounds[c];\n // }\n }\n }\n if (!isPdfGrid && cellBounds.length > 0) {\n for (var c = 0; c < i - 1; c++) {\n if (maximumCellBoundsWidth < cellBounds[c]) {\n maximumCellBoundsWidth = cellBounds[c];\n }\n }\n this.rowLayoutBoundsWidth = maximumCellBoundsWidth;\n }\n else {\n this.rowLayoutBoundsWidth = largeNavigatePage[0][1];\n }\n if (this.columnRanges.indexOf(range) < this.columnRanges.length - 1\n && startPage != null && format.layout != PdfLayoutType.OnePage) {\n isParentCell = this.Grid.isChildGrid;\n if (largeNavigatePage[0][0] != 0) {\n var section = this.currentPage.section;\n var pageIndex = section.indexOf(this.currentPage);\n this.currentGraphics = this.currentPage.graphics;\n this.currentBounds = new RectangleF(new PointF(0, 0), this.currentPage.getClientSize());\n var pageindex = this.currentGraphics.page.section.indexOf(this.currentGraphics.page);\n }\n else {\n this.currentPage = this.getNextPageformat(format);\n }\n // let locationGrid : PointF= new PointF(PdfBorders.default.right.width / 2, PdfBorders.default.top.width / 2);\n // if (format.paginateBounds == new RectangleF(0,0,0,0) && this.startLocation == locationGrid)\n // {\n // this.currentBounds.x += this.startLocation.x;\n // this.currentBounds.y += this.startLocation.y;\n // }\n }\n if (this.columnRanges.length - 1 !== index && this.columnRanges.length > 1 && format.layout !== PdfLayoutType.OnePage) {\n this.currentPage = this.getNextPageformat(format);\n if ((format.paginateBounds.x === format.paginateBounds.y) && (format.paginateBounds.y === format.paginateBounds.height)\n && (format.paginateBounds.height === format.paginateBounds.width) && (format.paginateBounds.width === 0)) {\n this.currentBounds.x += this.startLocation.x;\n this.currentBounds.y += this.startLocation.y;\n //this.currentBounds.height = this.pageBounds.height;\n }\n }\n }\n result = this.getLayoutResult();\n if (this.Grid.style.allowHorizontalOverflow && this.Grid.style.horizontalOverflowType == PdfHorizontalOverflowType.NextPage) {\n this.reArrangePages(layoutedPages);\n }\n this.raisePageLayouted(result);\n return result;\n };\n /* tslint:enable */\n /**\n * Gets the `next page`.\n * @private\n */\n PdfGridLayouter.prototype.getNextPageformat = function (format) {\n var section = this.currentPage.section;\n var nextPage = null;\n var index = section.indexOf(this.currentPage);\n this.flag = false;\n if (index === section.count - 1) {\n nextPage = section.add();\n }\n else {\n nextPage = section.getPages()[index + 1];\n }\n this.currentGraphics = nextPage.graphics;\n var pageindex = this.currentGraphics.page.section.indexOf(this.currentGraphics.page);\n if (!(this.listOfNavigatePages.indexOf(pageindex) !== -1)) {\n this.listOfNavigatePages.push(pageindex);\n }\n this.currentBounds = new RectangleF(new PointF(0, 0), nextPage.getClientSize());\n // if ((format.paginateBounds.x !== format.paginateBounds.y) && (format.paginateBounds.y !== format.paginateBounds.height)\n // && (format.paginateBounds.height !== format.paginateBounds.width) && (format.paginateBounds.width !== 0)) {\n // this.currentBounds.x = format.paginateBounds.x;\n // this.currentBounds.y = format.paginateBounds.y;\n // this.currentBounds.height = format.paginateBounds.height;\n // }\n return nextPage;\n };\n PdfGridLayouter.prototype.CheckIfDefaultFormat = function (format) {\n var defaultFormat = new PdfStringFormat();\n return (format.alignment === defaultFormat.alignment && format.characterSpacing === defaultFormat.characterSpacing &&\n format.clipPath === defaultFormat.clipPath && format.firstLineIndent === defaultFormat.firstLineIndent &&\n format.horizontalScalingFactor === defaultFormat.horizontalScalingFactor &&\n format.lineAlignment === defaultFormat.lineAlignment\n && format.lineLimit === defaultFormat.lineLimit && format.lineSpacing === defaultFormat.lineSpacing &&\n format.measureTrailingSpaces === defaultFormat.measureTrailingSpaces && format.noClip === defaultFormat.noClip &&\n format.paragraphIndent === defaultFormat.paragraphIndent && format.rightToLeft === defaultFormat.rightToLeft &&\n format.subSuperScript === defaultFormat.subSuperScript && format.wordSpacing === defaultFormat.wordSpacing &&\n format.wordWrap === defaultFormat.wordWrap);\n };\n /**\n * `Raises BeforeCellDraw event`.\n * @private\n */\n PdfGridLayouter.prototype.RaiseBeforeCellDraw = function (graphics, rowIndex, cellIndex, bounds, value, style) {\n var args = null;\n if (this.Grid.raiseBeginCellDraw) {\n args = new PdfGridBeginCellDrawEventArgs(graphics, rowIndex, cellIndex, bounds, value, style);\n this.Grid.onBeginCellDraw(args);\n style = args.style;\n }\n return style;\n };\n /**\n * `Raises AfterCellDraw event`.\n * @private\n */\n PdfGridLayouter.prototype.raiseAfterCellDraw = function (graphics, rowIndex, cellIndex, bounds, value, cellstyle) {\n var args = null;\n if (this.Grid.raiseEndCellDraw) {\n args = new PdfGridEndCellDrawEventArgs(graphics, rowIndex, cellIndex, bounds, value, cellstyle);\n this.Grid.onEndCellDraw(args);\n }\n };\n PdfGridLayouter.prototype.reArrangePages = function (layoutedPages) {\n var document = this.currentPage.document;\n var pages = [];\n var keys = layoutedPages.keys();\n var values = layoutedPages.values();\n for (var i = 0; i < keys.length; i++) {\n var page = keys[i];\n page.section = null;\n pages.push(page);\n document.pages.remove(page);\n }\n /* tslint:disable */\n for (var i = 0; i < layoutedPages.size(); i++) {\n var count = 0;\n for (var j = i, count_1 = (layoutedPages.size() / this.columnRanges.length); j < layoutedPages.size(); j += count_1) {\n var page = pages[j];\n if (document.pages.indexOf(page) === -1) {\n document.pages.add(page);\n }\n }\n }\n /* tslint:enable */\n };\n /**\n * Gets the `layout result`.\n * @private\n */\n PdfGridLayouter.prototype.getLayoutResult = function () {\n if (this.Grid.isChildGrid && this.Grid.allowRowBreakAcrossPages) {\n for (var i = 0; i < this.Grid.rows.count; i++) {\n var row = this.Grid.rows.getRow(i);\n if (row.rowBreakHeight > 0 && row.repeatFlag) {\n this.startLocation.y = this.currentPage.origin.y;\n }\n }\n }\n var bounds;\n if (!this.isChanged) {\n bounds = new RectangleF(this.startLocation, new SizeF(this.currentBounds.width, this.currentBounds.y -\n this.startLocation.y));\n }\n // else {\n // bounds = new RectangleF(this.currentLocation, new SizeF(this.currentBounds.width, this.currentBounds.y -\n // this.currentLocation.y));\n // }\n /* tslint:enable */\n return new PdfGridLayoutResult(this.currentPage, bounds);\n };\n /**\n * `Recalculate row height` for the split cell to be drawn.\n * @private\n */\n PdfGridLayouter.prototype.ReCalculateHeight = function (row, height) {\n var newHeight = 0.0;\n for (var i = this.cellStartIndex; i <= this.cellEndIndex; i++) {\n if (!(row.cells.getCell(i).remainingString === null || row.cells.getCell(i).remainingString === '' ||\n typeof row.cells.getCell(i).remainingString === 'undefined')) {\n newHeight = Math.max(newHeight, row.cells.getCell(i).measureHeight());\n }\n }\n return Math.max(height, newHeight);\n };\n /**\n * `Raises BeforePageLayout event`.\n * @private\n */\n PdfGridLayouter.prototype.raiseBeforePageLayout = function (currentPage, currentBounds, currentRow) {\n var cancel = false;\n if (this.Grid.raiseBeginPageLayout) {\n var args = new PdfGridBeginPageLayoutEventArgs(currentBounds, currentPage, currentRow);\n this.Grid.onBeginPageLayout(args);\n // if (currentBounds !== args.Bounds) {\n // this.isChanged = true;\n // this.currentLocation = new PointF(args.Bounds.x, args.Bounds.y);\n // this.measureColumnsWidth(new RectangleF(new PointF(args.Bounds.x, args.Bounds.y) ,\n // new SizeF(args.Bounds.width + args.Bounds.x ,\n // args.Bounds.height)));\n // }\n cancel = args.cancel;\n currentBounds = args.bounds;\n currentRow = args.startRowIndex;\n }\n return { returnValue: cancel, currentBounds: currentBounds, currentRowIndex: currentRow };\n };\n /**\n * `Raises PageLayout event` if needed.\n * @private\n */\n PdfGridLayouter.prototype.raisePageLayouted = function (result) {\n var args = new PdfGridEndPageLayoutEventArgs(result);\n if (this.Grid.raiseEndPageLayout) {\n this.Grid.onEndPageLayout(args);\n }\n return args;\n };\n PdfGridLayouter.prototype.drawRow = function (row, result, height) {\n if (typeof result === 'undefined') {\n //.. Check if required space available.\n //.....If the row conains spans which falls through more than one page, then draw the row to next page. \n var result_1 = new RowLayoutResult();\n var rowHeightWithSpan = 0;\n var location_3 = new PointF(0, 0);\n var size = new SizeF(0, 0);\n var isHeader = false;\n if (row.rowSpanExists) {\n var maxSpan = 0;\n var currRowIndex = this.Grid.rows.rowCollection.indexOf(row);\n if (currRowIndex === -1) {\n currRowIndex = this.Grid.headers.indexOf(row);\n if (currRowIndex !== -1) {\n isHeader = true;\n }\n }\n for (var i = 0; i < row.cells.count; i++) {\n var cell = row.cells.getCell(i);\n maxSpan = Math.max(maxSpan, cell.rowSpan);\n }\n for (var i = currRowIndex; i < currRowIndex + maxSpan; i++) {\n rowHeightWithSpan += (isHeader ? this.Grid.headers.getHeader(i).height : this.Grid.rows.getRow(i).height);\n }\n // let rowMaxHeight : number = rowHeightWithSpan;\n // for (let i : number = 0; i < row.cells.count; i++ ) {\n // rowMaxHeight = rowMaxHeight > row.cells.getCell(i).height ? rowMaxHeight : row.cells.getCell(i).height;\n // }\n // let flag : boolean = true;\n // let nextRow : PdfGridRow = this.Grid.headers.getHeader(this.Grid.headers.indexOf(row) + 1);\n // for (let i : number = 0; i < nextRow.cells.count; i++ ) {\n // if (nextRow.cells.getCell(i).value !== '' && nextRow.cells.getCell(i).value !== undefined) {\n // flag = false;\n // break;\n // }\n // }\n // if ((rowMaxHeight > rowHeightWithSpan) && flag) {\n // row.height += (rowMaxHeight - rowHeightWithSpan);\n // } \n }\n var calculatedHeight = row.rowBreakHeight > 0.0 ? row.rowBreakHeight : row.height;\n if (this.Grid.isChildGrid && this.Grid.ParentCell != null) {\n //Split row only if row height exceeds page height and AllowRowBreakAcrossPages is true.\n // if (calculatedHeight + this.Grid.ParentCell.row.grid.style.cellPadding.bottom +\n // this.Grid.ParentCell.row.grid.style.cellPadding.top > this.currentPageBounds.height) {\n // if (this.Grid.allowRowBreakAcrossPages) {\n // result.isFinish = true;\n // if ( this.Grid.isChildGrid && row.rowBreakHeight > 0 ) {\n // if (this.Grid.ParentCell.row.grid.style.cellPadding !== null) {\n // this.currentBounds.y += this.Grid.ParentCell.row.grid.style.cellPadding.top;\n // }\n // this.currentBounds.x = this.startLocation.x;\n // }\n // result.bounds = this.currentBounds ;\n // this.drawRowWithBreak(result, row, calculatedHeight);\n // } else {\n // //If AllowRowBreakAcrossPages is not true, draw the row till it fits the page. \n // if (this.Grid.ParentCell.row.grid.style.cellPadding != null) {\n // this.currentBounds.y += this.Grid.ParentCell.row.grid.style.cellPadding.top;\n // calculatedHeight = this.currentBounds.height - this.currentBounds.y -\n // this.Grid.ParentCell.row.grid.style.cellPadding.bottom;\n // }\n // result.isFinish = false;\n // this.drawRow( row, result, calculatedHeight);\n // }\n // } else\n if (this.currentBounds.y + this.Grid.ParentCell.row.grid.style.cellPadding.bottom + calculatedHeight >\n this.currentPageBounds.height || this.currentBounds.y + this.Grid.ParentCell.row.grid.style.cellPadding.bottom\n + calculatedHeight > this.currentBounds.height || this.currentBounds.y +\n this.Grid.ParentCell.row.grid.style.cellPadding.bottom + rowHeightWithSpan > this.currentPageBounds.height) {\n //If a row is repeated and still cannot fit in page, proceed draw.\n if (this.Grid.ParentCell.row.grid.LayoutFormat.break === PdfLayoutBreakType.FitPage) {\n PdfGridLayouter.repeatRowIndex = this.Grid.rows.rowCollection.indexOf(row);\n this.Grid.splitChildRowIndex = this.Grid.rows.rowCollection.indexOf(row);\n }\n if (PdfGridLayouter.repeatRowIndex > -1 && PdfGridLayouter.repeatRowIndex === row.rowIndex) {\n if (this.Grid.allowRowBreakAcrossPages) {\n result_1.isFinish = true;\n // if (this.Grid.isChildGrid && row.rowBreakHeightValue > 0) {\n // // if (this.Grid.ParentCell.row.grid.style.cellPadding != null) {\n // // this.currentBounds.y += this.Grid.ParentCell.row.grid.style.cellPadding.top;\n // // }\n // this.currentBounds.x = this.startLocation.x;\n // }\n result_1.bounds = this.currentBounds;\n this.drawRowWithBreak(result_1, row, calculatedHeight);\n row.repeatFlag = true;\n row.repeatRowNumber = PdfGridLayouter.repeatRowIndex;\n }\n // else {\n // result.isFinish = false;\n // row.repeatFlag = false;\n // this.drawRow( row, result, calculatedHeight);\n // }\n }\n // else {\n // result.isFinish = false;\n // }\n }\n else {\n result_1.isFinish = true;\n if (row.grid.ParentCell.row.rowBreakHeightValue > 0) {\n row.repeatFlag = true;\n }\n else {\n row.repeatFlag = false;\n calculatedHeight = row.height;\n }\n if (this.Grid.isChildGrid && row.rowBreakHeight > 0) {\n if (this.Grid.ParentCell.row.grid.style.cellPadding != null) {\n calculatedHeight += this.Grid.ParentCell.row.grid.style.cellPadding.bottom;\n }\n }\n this.drawRow(row, result_1, calculatedHeight);\n }\n }\n else {\n //Split row only if row height exceeds page height and AllowRowBreakAcrossPages is true.\n if (calculatedHeight > this.currentPageBounds.height) {\n if (this.Grid.allowRowBreakAcrossPages) {\n result_1.isFinish = true;\n //result.bounds = this.currentBounds;\n this.drawRowWithBreak(result_1, row, calculatedHeight);\n row.isrowFinish = true;\n row.repeatFlag = true;\n if (row.grid.splitChildRowIndex !== -1) {\n result_1.isFinish = false;\n }\n }\n // else {\n // //If AllowRowBreakAcrossPages is not true, draw the row till it fits the page.\n // result.isFinish = false;\n // this.drawRow( row, result, calculatedHeight);\n // }\n }\n else if (this.currentBounds.y + calculatedHeight > this.currentPageBounds.height ||\n this.currentBounds.y + calculatedHeight > (this.currentBounds.height + this.startLocation.y) ||\n this.currentBounds.y + rowHeightWithSpan > this.currentPageBounds.height) {\n // If a row is repeated and still cannot fit in page, proceed draw.\n if (this.Grid.LayoutFormat.break === PdfLayoutBreakType.FitPage) {\n PdfGridLayouter.repeatRowIndex = this.Grid.rows.rowCollection.indexOf(row);\n }\n if (PdfGridLayouter.repeatRowIndex > -1 && PdfGridLayouter.repeatRowIndex === row.rowIndex) {\n if (this.Grid.allowRowBreakAcrossPages) {\n result_1.isFinish = true;\n this.drawRowWithBreak(result_1, row, calculatedHeight);\n row.repeatFlag = true;\n row.repeatRowNumber = PdfGridLayouter.repeatRowIndex;\n if (row.grid.splitChildRowIndex !== -1) {\n result_1.isFinish = false;\n }\n }\n // else {\n // result.isFinish = false;\n // this.drawRow(row, result, calculatedHeight);\n // }\n }\n else {\n result_1.isFinish = false;\n }\n }\n else {\n result_1.isFinish = true;\n this.drawRow(row, result_1, calculatedHeight);\n row.repeatFlag = false;\n }\n }\n return result_1;\n }\n else {\n var skipcell = false;\n var location_4 = new PointF(this.currentBounds.x, this.currentBounds.y);\n // if (row.grid.isChildGrid && row.grid.allowRowBreakAcrossPages && this.startLocation.x !== this.currentBounds.x && row.width <\n // this.currentPage.getClientSize().width) {\n // location.x = this.startLocation.x;\n // }\n result.bounds = new RectangleF(location_4, new SizeF(0, 0));\n height = this.ReCalculateHeight(row, height);\n for (var i = this.cellStartIndex; i <= this.cellEndIndex; i++) {\n var cancelSpans = ((i > this.cellEndIndex + 1) && (row.cells.getCell(i).columnSpan > 1));\n // let cancelSpans : boolean = false;\n if (!cancelSpans) {\n for (var j = 1; j < row.cells.getCell(i).columnSpan; j++) {\n row.cells.getCell(i + j).isCellMergeContinue = true;\n }\n }\n var size = new SizeF(this.Grid.columns.getColumn(i).width, height);\n // if (size.width > this.currentGraphics.clientSize.width) {\n // size.width = this.currentGraphics.clientSize.width;\n // }\n // if (this.Grid.isChildGrid && this.Grid.style.allowHorizontalOverflow) {\n // if (size.width >= this.currentGraphics.clientSize.width) {\n // size.width -= 2 * this.currentBounds.x;\n // }\n // }\n /* tslint:disable */\n if (!this.CheckIfDefaultFormat(this.Grid.columns.getColumn(i).format) &&\n this.CheckIfDefaultFormat(row.cells.getCell(i).stringFormat)) {\n row.cells.getCell(i).stringFormat = this.Grid.columns.getColumn(i).format;\n }\n var cellstyle = row.cells.getCell(i).style;\n var tempValue = ((typeof row.cells.getCell(i).value === 'string' &&\n row.cells.getCell(i).value !== null) ? row.cells.getCell(i).value : '');\n row.cells.getCell(i).style = this.RaiseBeforeCellDraw(this.currentGraphics, this.currentRowIndex, i, new RectangleF(location_4, size), tempValue, cellstyle);\n //row.cells.getCell(i).style = cellstyle;\n if (!skipcell) {\n if (row.cells.getCell(i).value instanceof PdfGrid) {\n var grid = row.cells.getCell(i).value;\n grid.parentCellIndex = i;\n }\n var stringResult = row.cells.getCell(i).draw(this.currentGraphics, new RectangleF(location_4, size), cancelSpans);\n if (row.grid.style.allowHorizontalOverflow && (row.cells.getCell(i).columnSpan > this.cellEndIndex ||\n i + row.cells.getCell(i).columnSpan > this.cellEndIndex + 1) && this.cellEndIndex < row.cells.count - 1) {\n row.rowOverflowIndex = this.cellEndIndex;\n }\n if (row.grid.style.allowHorizontalOverflow && (row.rowOverflowIndex > 0 && (row.cells.getCell(i).columnSpan >\n this.cellEndIndex || i + row.cells.getCell(i).columnSpan > this.cellEndIndex + 1)) &&\n row.cells.getCell(i).columnSpan - this.cellEndIndex + i - 1 > 0) {\n row.cells.getCell(row.rowOverflowIndex + 1).value = stringResult !== null ? (stringResult.remainder !== undefined) ?\n stringResult.remainder : '' : '';\n row.cells.getCell(row.rowOverflowIndex + 1).stringFormat = row.cells.getCell(i).stringFormat;\n row.cells.getCell(row.rowOverflowIndex + 1).style = row.cells.getCell(i).style;\n row.cells.getCell(row.rowOverflowIndex + 1).columnSpan = row.cells.getCell(i).columnSpan - this.cellEndIndex + i - 1;\n }\n }\n /* tslint:enable */\n tempValue = ((typeof row.cells.getCell(i).value === 'string' &&\n row.cells.getCell(i).value !== null) ? row.cells.getCell(i).value : '');\n if (!cancelSpans) {\n this.raiseAfterCellDraw(this.currentGraphics, this.currentRowIndex, i, new RectangleF(location_4, size), tempValue, row.cells.getCell(i).style);\n }\n if (row.cells.getCell(i).value instanceof PdfGrid) {\n var grid = row.cells.getCell(i).value;\n if (this.Grid.columns.getColumn(i).width >= this.currentGraphics.clientSize.width) {\n location_4.x = grid.rowLayoutBoundsWidth;\n location_4.x += grid.style.cellSpacing;\n }\n else {\n location_4.x += this.Grid.columns.getColumn(i).width;\n }\n }\n else {\n location_4.x += this.Grid.columns.getColumn(i).width;\n }\n }\n if (!row.rowMergeComplete || row.isRowHeightSet) {\n this.currentBounds.y += height;\n }\n result.bounds = new RectangleF(new PointF(result.bounds.x, result.bounds.y), new SizeF(location_4.x, location_4.y));\n }\n };\n PdfGridLayouter.prototype.drawRowWithBreak = function (result, row, calculateHeight) {\n var location = new PointF(this.currentBounds.x, this.currentBounds.y);\n if (row.grid.isChildGrid && row.grid.allowRowBreakAcrossPages && this.startLocation.x !== this.currentBounds.x) {\n location.x = this.startLocation.x;\n }\n result.bounds = new RectangleF(location, new SizeF(0, 0));\n this.gridHeight = row.rowBreakHeight > 0 ? this.currentPageBounds.height : 0;\n // Calculate the remaining height.\n if (row.grid.style.cellPadding.top + this.currentBounds.y + row.grid.style.cellPadding.bottom < this.currentPageBounds.height) {\n row.rowBreakHeight = this.currentBounds.y + calculateHeight - this.currentPageBounds.height;\n }\n // else {\n // row.rowBreakHeight = calculateHeight;\n // result.isFinish = false;\n // return;\n // }\n // No need to explicit break if the row height is equal to grid height.\n for (var i = 0; i < row.cells.count; i++) {\n var cell = row.cells.getCell(i);\n var cellHeight = cell.measureHeight();\n if (cellHeight === calculateHeight && cell.value instanceof PdfGrid) {\n row.rowBreakHeight = 0;\n }\n // else if (cellHeight === calculateHeight && (cell.value as PdfGrid) === null) {\n // row.rowBreakHeight = this.currentBounds.y + calculateHeight - this.currentPageBounds.height;\n // }\n }\n for (var i = this.cellStartIndex; i <= this.cellEndIndex; i++) {\n var cancelSpans = ((row.cells.getCell(i).columnSpan + i > this.cellEndIndex + 1) &&\n (row.cells.getCell(i).columnSpan > 1));\n // if (!cancelSpans) {\n // for (let k : number = 1; k < row.cells.getCell(i).columnSpan; k++) {\n // row.cells.getCell(i + k).isCellMergeContinue = true;\n // }\n //}\n var size = new SizeF(this.Grid.columns.getColumn(i).width, this.gridHeight > 0.0 ? this.gridHeight :\n this.currentPageBounds.height);\n // if (size.width === 0) {\n // size = new SizeF(row.cells.getCell(i).width, size.height);\n // }\n // if (!this.CheckIfDefaultFormat(this.Grid.columns.getColumn(i).format) &&\n // this.CheckIfDefaultFormat((row.cells.getCell(i).stringFormat))) {\n // row.cells.getCell(i).stringFormat = this.Grid.columns.getColumn(i).format;\n // }\n var cellstyle1 = row.cells.getCell(i).style;\n row.cells.getCell(i).style = cellstyle1;\n var skipcell = false;\n var stringResult = null;\n if (!skipcell) {\n stringResult = row.cells.getCell(i).draw(this.currentGraphics, new RectangleF(location, size), cancelSpans);\n }\n //If still row is to be drawn, set cell finished drawing cell as false and update the text to be drawn.\n if (row.rowBreakHeight > 0.0) {\n if (stringResult != null) {\n row.cells.getCell(i).FinishedDrawingCell = false;\n row.cells.getCell(i).remainingString = stringResult.remainder == null ? ' ' : stringResult.remainder;\n if (row.grid.isChildGrid) {\n row.rowBreakHeight = calculateHeight - stringResult.actualSize.height;\n }\n }\n }\n result.isFinish = (!result.isFinish) ? result.isFinish : row.cells.getCell(i).FinishedDrawingCell;\n // let tempValue : string = ((typeof row.cells.getCell(i).value === 'string' &&\n //row.cells.getCell(i).value !== null) ? row.cells.getCell(i).value : '') as string;\n // if (!cancelSpans) {\n // // this.raiseAfterCellDraw(this.currentGraphics, this.currentRowIndex, i,\n // // new RectangleF(location, size), tempValue, row.cells.getCell(i).style); \n // this.raiseAfterCellDraw(this.currentGraphics, this.currentRowIndex, i, new RectangleF(location, size),\n // (row.cells.getCell(i).value as string) ? row.cells.getCell(i).value.toString() : ' ',\n // row.cells.getCell(i).style);\n // } \n if (row.cells.getCell(i).value instanceof PdfGrid) {\n var grid = row.cells.getCell(i).value;\n this.rowBreakPageHeightCellIndex = i;\n // row.cells.getCell(i).pageCount = grid.listOfNavigatePages.length;\n // for (let j : number = 0;j= this.currentGraphics.clientSize.width) {\n location.x = this.rowLayoutBoundsWidth;\n location.x += grid.style.cellSpacing;\n }\n else {\n location.x += this.Grid.columns.getColumn(i).width;\n }\n }\n else {\n location.x += this.Grid.columns.getColumn(i).width;\n }\n }\n this.currentBounds.y += this.gridHeight > 0.0 ? this.gridHeight : calculateHeight;\n result.bounds = new RectangleF(new PointF(result.bounds.x, result.bounds.y), new SizeF(location.x, location.y));\n };\n /**\n * @hidden\n * @private\n */\n PdfGridLayouter.repeatRowIndex = -1;\n return PdfGridLayouter;\n}(ElementLayouter));\nexport { PdfGridLayouter };\n// recalculateBounds : boolean, clientSize : SizeF\n//Implementation\n/**\n * `Initializes` internal data.\n * @private\n */\n//Internal declaration\nvar PdfGridLayoutResult = /** @class */ (function (_super) {\n __extends(PdfGridLayoutResult, _super);\n /**\n * Constructor\n * @private\n */\n function PdfGridLayoutResult(page, bounds) {\n return _super.call(this, page, bounds) || this;\n }\n return PdfGridLayoutResult;\n}(PdfLayoutResult));\nexport { PdfGridLayoutResult };\n/**\n * `PdfGridLayoutFormat` class represents a flexible grid that consists of columns and rows.\n */\nvar PdfGridLayoutFormat = /** @class */ (function (_super) {\n __extends(PdfGridLayoutFormat, _super);\n /**\n * Initializes a new instance of the `PdfGridLayoutFormat` class.\n * @private\n */\n function PdfGridLayoutFormat(baseFormat) {\n var _this = this;\n if (typeof baseFormat === 'undefined') {\n _this = _super.call(this) || this;\n }\n else {\n _this = _super.call(this, baseFormat) || this;\n }\n return _this;\n }\n return PdfGridLayoutFormat;\n}(PdfLayoutFormat));\nexport { PdfGridLayoutFormat };\nvar GridCellEventArgs = /** @class */ (function () {\n // Constructors\n /**\n * Initialize a new instance for `GridCellEventArgs` class.\n * @private\n */\n function GridCellEventArgs(graphics, rowIndex, cellIndex, bounds, value) {\n this.gridRowIndex = rowIndex;\n this.gridCellIndex = cellIndex;\n this.internalValue = value;\n this.gridBounds = bounds;\n this.pdfGraphics = graphics;\n }\n Object.defineProperty(GridCellEventArgs.prototype, \"rowIndex\", {\n // Properties\n /**\n * Gets the value of current `row index`.\n * @private\n */\n get: function () {\n return this.gridRowIndex;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(GridCellEventArgs.prototype, \"cellIndex\", {\n /**\n * Gets the value of current `cell index`.\n * @private\n */\n get: function () {\n return this.gridCellIndex;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(GridCellEventArgs.prototype, \"value\", {\n /**\n * Gets the actual `value` of current cell.\n * @private\n */\n get: function () {\n return this.internalValue;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(GridCellEventArgs.prototype, \"bounds\", {\n /**\n * Gets the `bounds` of current cell.\n * @private\n */\n get: function () {\n return this.gridBounds;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(GridCellEventArgs.prototype, \"graphics\", {\n /**\n * Gets the instance of `current graphics`.\n * @private\n */\n get: function () {\n return this.pdfGraphics;\n },\n enumerable: true,\n configurable: true\n });\n return GridCellEventArgs;\n}());\nexport { GridCellEventArgs };\nvar PdfGridBeginCellDrawEventArgs = /** @class */ (function (_super) {\n __extends(PdfGridBeginCellDrawEventArgs, _super);\n // Constructors\n /**\n * Initializes a new instance of the `StartCellLayoutEventArgs` class.\n * @private\n */\n function PdfGridBeginCellDrawEventArgs(graphics, rowIndex, cellIndex, bounds, value, style) {\n var _this = _super.call(this, graphics, rowIndex, cellIndex, bounds, value) || this;\n _this.style = style;\n return _this;\n }\n Object.defineProperty(PdfGridBeginCellDrawEventArgs.prototype, \"skip\", {\n // Properties\n /**\n * Gets or sets a value indicating whether the value of this cell should be `skipped`.\n * @private\n */\n get: function () {\n return this.bSkip;\n },\n set: function (value) {\n this.bSkip = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfGridBeginCellDrawEventArgs.prototype, \"style\", {\n /**\n * Gets or sets a `style` value of the cell.\n * @private\n */\n get: function () {\n return this.cellStyle;\n },\n set: function (value) {\n this.cellStyle = value;\n },\n enumerable: true,\n configurable: true\n });\n return PdfGridBeginCellDrawEventArgs;\n}(GridCellEventArgs));\nexport { PdfGridBeginCellDrawEventArgs };\nvar PdfGridEndCellDrawEventArgs = /** @class */ (function (_super) {\n __extends(PdfGridEndCellDrawEventArgs, _super);\n // Constructors\n /**\n * Initializes a new instance of the `PdfGridEndCellLayoutEventArgs` class.\n * @private\n */\n function PdfGridEndCellDrawEventArgs(graphics, rowIndex, cellIndex, bounds, value, style) {\n var _this = _super.call(this, graphics, rowIndex, cellIndex, bounds, value) || this;\n _this.cellStyle = style;\n return _this;\n }\n Object.defineProperty(PdfGridEndCellDrawEventArgs.prototype, \"style\", {\n // Propertise\n /**\n * Get the `PdfGridCellStyle`.\n * @private\n */\n get: function () {\n return this.cellStyle;\n },\n enumerable: true,\n configurable: true\n });\n return PdfGridEndCellDrawEventArgs;\n}(GridCellEventArgs));\nexport { PdfGridEndCellDrawEventArgs };\nvar PdfCancelEventArgs = /** @class */ (function () {\n function PdfCancelEventArgs() {\n }\n Object.defineProperty(PdfCancelEventArgs.prototype, \"cancel\", {\n // Properties\n /**\n * Gets and Sets the value of `cancel`.\n * @private\n */\n get: function () {\n return this.isCancel;\n },\n set: function (value) {\n this.isCancel = value;\n },\n enumerable: true,\n configurable: true\n });\n return PdfCancelEventArgs;\n}());\nexport { PdfCancelEventArgs };\nvar BeginPageLayoutEventArgs = /** @class */ (function (_super) {\n __extends(BeginPageLayoutEventArgs, _super);\n // Constructors\n /**\n * Initializes a new instance of the `BeginPageLayoutEventArgs` class with the specified rectangle and page.\n * @private\n */\n function BeginPageLayoutEventArgs(bounds, page) {\n var _this = _super.call(this) || this;\n _this.bounds = bounds;\n _this.pdfPage = page;\n return _this;\n }\n Object.defineProperty(BeginPageLayoutEventArgs.prototype, \"bounds\", {\n // Properties\n /**\n * Gets or sets value that indicates the lay outing `bounds` on the page.\n * @private\n */\n get: function () {\n return this.cellBounds;\n },\n set: function (value) {\n this.cellBounds = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(BeginPageLayoutEventArgs.prototype, \"page\", {\n /**\n * Gets the `page` where the lay outing should start.\n * @private\n */\n get: function () {\n return this.pdfPage;\n },\n enumerable: true,\n configurable: true\n });\n return BeginPageLayoutEventArgs;\n}(PdfCancelEventArgs));\nexport { BeginPageLayoutEventArgs };\n/**\n * `EndPageLayoutEventArgs` class is alternate for end page layout events.\n */\nvar EndPageLayoutEventArgs = /** @class */ (function (_super) {\n __extends(EndPageLayoutEventArgs, _super);\n // Constructors\n /**\n * Initializes a new instance of the `EndPageLayoutEventArgs` class. with the specified 'PdfLayoutResult'.\n * @private\n */\n function EndPageLayoutEventArgs(result) {\n var _this = _super.call(this) || this;\n _this.layoutResult = result;\n return _this;\n }\n Object.defineProperty(EndPageLayoutEventArgs.prototype, \"result\", {\n // Properties\n /**\n * Gets the lay outing `result` of the page.\n * @private\n */\n get: function () {\n return this.layoutResult;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(EndPageLayoutEventArgs.prototype, \"nextPage\", {\n /**\n * Gets or sets a value indicating the `next page` where the element should be layout.\n * @private\n */\n get: function () {\n return this.nextPdfPage;\n },\n set: function (value) {\n this.nextPdfPage = value;\n },\n enumerable: true,\n configurable: true\n });\n return EndPageLayoutEventArgs;\n}(PdfCancelEventArgs));\nexport { EndPageLayoutEventArgs };\n/**\n * `PdfGridBeginPageLayoutEventArgs` class is alternate for begin page layout events.\n */\nvar PdfGridBeginPageLayoutEventArgs = /** @class */ (function (_super) {\n __extends(PdfGridBeginPageLayoutEventArgs, _super);\n // Constructors\n /**\n * Initialize a new instance of `PdfGridBeginPageLayoutEventArgs` class.\n * @private\n */\n function PdfGridBeginPageLayoutEventArgs(bounds, page, startRow) {\n var _this = _super.call(this, bounds, page) || this;\n _this.startRow = startRow;\n return _this;\n }\n Object.defineProperty(PdfGridBeginPageLayoutEventArgs.prototype, \"startRowIndex\", {\n // Properties\n /**\n * Gets the `start row index`.\n * @private\n */\n get: function () {\n return this.startRow;\n },\n enumerable: true,\n configurable: true\n });\n return PdfGridBeginPageLayoutEventArgs;\n}(BeginPageLayoutEventArgs));\nexport { PdfGridBeginPageLayoutEventArgs };\n/**\n * `PdfGridEndPageLayoutEventArgs` class is alternate for begin page layout events.\n */\nvar PdfGridEndPageLayoutEventArgs = /** @class */ (function (_super) {\n __extends(PdfGridEndPageLayoutEventArgs, _super);\n // Constructors\n /**\n * Initialize a new instance of `PdfGridEndPageLayoutEventArgs` class.\n * @private\n */\n function PdfGridEndPageLayoutEventArgs(result) {\n return _super.call(this, result) || this;\n }\n return PdfGridEndPageLayoutEventArgs;\n}(EndPageLayoutEventArgs));\nexport { PdfGridEndPageLayoutEventArgs };\nvar RowLayoutResult = /** @class */ (function () {\n //Constructors\n /**\n * Initializes a new instance of the `RowLayoutResult` class.\n * @private\n */\n function RowLayoutResult() {\n this.layoutedBounds = new RectangleF(0, 0, 0, 0);\n }\n Object.defineProperty(RowLayoutResult.prototype, \"isFinish\", {\n /**\n * Gets or sets a value indicating whether this instance `is finish`.\n * @private\n */\n get: function () {\n return this.bIsFinished;\n },\n set: function (value) {\n this.bIsFinished = value;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(RowLayoutResult.prototype, \"bounds\", {\n /**\n * Gets or sets the `bounds`.\n * @private\n */\n get: function () {\n return this.layoutedBounds;\n },\n set: function (value) {\n this.layoutedBounds = value;\n },\n enumerable: true,\n configurable: true\n });\n return RowLayoutResult;\n}());\nexport { RowLayoutResult };\n","import { print as printWindow, createElement, isNullOrUndefined, Browser } from '@syncfusion/ej2-base';\nimport { SvgRenderer } from '@syncfusion/ej2-svg-base';\nimport { getElement } from '../utils/helper';\nimport { beforePrint } from '../model/constants';\nimport { PdfPageOrientation, PdfDocument, PdfBitmap, SizeF } from '@syncfusion/ej2-pdf-export';\nvar ExportUtils = /** @class */ (function () {\n /**\n * Constructor for chart and accumulation annotation\n * @param control\n */\n function ExportUtils(control) {\n this.control = control;\n }\n /**\n * To print the accumulation and chart elements\n * @param elements\n */\n ExportUtils.prototype.print = function (elements) {\n this.printWindow = window.open('', 'print', 'height=' + window.outerHeight + ',width=' + window.outerWidth + ',tabbar=no');\n this.printWindow.moveTo(0, 0);\n this.printWindow.resizeTo(screen.availWidth, screen.availHeight);\n var argsData = {\n cancel: false, htmlContent: this.getHTMLContent(elements), name: beforePrint\n };\n this.control.trigger(beforePrint, argsData);\n if (!argsData.cancel) {\n printWindow(argsData.htmlContent, this.printWindow);\n }\n };\n /**\n * To get the html string of the chart and accumulation\n * @param elements\n * @private\n */\n ExportUtils.prototype.getHTMLContent = function (elements) {\n var div = createElement('div');\n if (elements) {\n if (elements instanceof Array) {\n elements.forEach(function (value) {\n div.appendChild(getElement(value).cloneNode(true));\n });\n }\n else if (elements instanceof Element) {\n div.appendChild(elements.cloneNode(true));\n }\n else {\n div.appendChild(getElement(elements).cloneNode(true));\n }\n }\n else {\n div.appendChild(this.control.element.cloneNode(true));\n }\n return div;\n };\n /**\n * To export the file as image/svg format\n * @param type\n * @param fileName\n */\n ExportUtils.prototype.export = function (type, fileName, orientation, controls, width, height) {\n var _this = this;\n var controlValue = this.getControlsValue(controls);\n width = width ? width : controlValue.width;\n height = height ? height : controlValue.height;\n var element = createElement('canvas', {\n id: 'ej2-canvas',\n attrs: {\n 'width': width.toString(),\n 'height': height.toString()\n }\n });\n var isDownload = !(Browser.userAgent.toString().indexOf('HeadlessChrome') > -1);\n orientation = isNullOrUndefined(orientation) ? PdfPageOrientation.Landscape : orientation;\n var svgData = '';\n var url = window.URL.createObjectURL(new Blob(type === 'SVG' ? [svgData] :\n [(new XMLSerializer()).serializeToString(controlValue.svg)], { type: 'image/svg+xml' }));\n if (type === 'SVG') {\n if (Browser.info.name === 'msie') {\n var svg = new Blob([(new XMLSerializer()).serializeToString(controlValue.svg)], { type: 'application/octet-stream' });\n window.navigator.msSaveOrOpenBlob(svg, fileName + '.' + type.toLocaleLowerCase());\n }\n else {\n this.triggerDownload(fileName, type, url, isDownload);\n }\n }\n else {\n var image_1 = new Image();\n var ctx_1 = element.getContext('2d');\n image_1.onload = (function () {\n ctx_1.drawImage(image_1, 0, 0);\n window.URL.revokeObjectURL(url);\n if (type === 'PDF') {\n var document_1 = new PdfDocument();\n var margin = document_1.pageSettings.margins;\n var pdfDefaultWidth = document_1.pageSettings.width;\n var pdfDefaultHeight = document_1.pageSettings.height;\n var exactWidth = void 0;\n var exactHeight = void 0;\n var imageString = element.toDataURL('image/jpeg').replace('image/jpeg', 'image/octet-stream');\n document_1.pageSettings.orientation = orientation;\n exactWidth = (pdfDefaultWidth < width) ? (width + margin.left + margin.right) : pdfDefaultWidth;\n exactHeight = (pdfDefaultHeight < height) ? (height + margin.top + margin.bottom) : pdfDefaultHeight;\n document_1.pageSettings.size = new SizeF(exactWidth, exactHeight);\n imageString = imageString.slice(imageString.indexOf(',') + 1);\n document_1.pages.add().graphics.drawImage(new PdfBitmap(imageString), 0, 0, width, height);\n if (isDownload) {\n document_1.save(fileName + '.pdf');\n document_1.destroy();\n }\n }\n else {\n if (window.navigator.msSaveOrOpenBlob) {\n window.navigator.msSaveOrOpenBlob(element.msToBlob(), fileName + '.' + type.toLocaleLowerCase());\n }\n else {\n _this.triggerDownload(fileName, type, element.toDataURL('image/png').replace('image/png', 'image/octet-stream'), isDownload);\n }\n }\n });\n image_1.src = url;\n }\n };\n /**\n * To trigger the download element\n * @param fileName\n * @param type\n * @param url\n */\n ExportUtils.prototype.triggerDownload = function (fileName, type, url, isDownload) {\n createElement('a', {\n attrs: {\n 'download': fileName + '.' + type.toLocaleLowerCase(),\n 'href': url\n }\n }).dispatchEvent(new MouseEvent(isDownload ? 'click' : 'move', {\n view: window,\n bubbles: false,\n cancelable: true\n }));\n };\n /**\n * To get the maximum size value\n * @param controls\n * @param name\n */\n ExportUtils.prototype.getControlsValue = function (controls) {\n var width = 0;\n var height = 0;\n var content = '';\n var svgObject = new SvgRenderer('').createSvg({\n id: 'Svg_Export_Element',\n width: 200, height: 200\n });\n controls.map(function (control) {\n var svg = control.svgObject.cloneNode(true);\n var groupEle = control.renderer.createGroup({\n style: 'transform: translateY(' + height + 'px)'\n });\n groupEle.appendChild(svg);\n width = Math.max(control.availableSize.width, width);\n height += control.availableSize.height;\n content += control.svgObject.outerHTML;\n svgObject.appendChild(groupEle);\n });\n svgObject.setAttribute('width', width + '');\n svgObject.setAttribute('height', height + '');\n return {\n 'width': width,\n 'height': height,\n 'svg': svgObject\n };\n };\n return ExportUtils;\n}());\nexport { ExportUtils };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, Property, NotifyPropertyChanges, Internationalization } from '@syncfusion/ej2-base';\nimport { L10n, setValue, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { ChildProperty } from '@syncfusion/ej2-base';\nimport { remove, extend } from '@syncfusion/ej2-base';\nimport { Browser, Touch } from '@syncfusion/ej2-base';\nimport { Event, EventHandler, Complex, Collection } from '@syncfusion/ej2-base';\nimport { findClipRect, showTooltip, removeElement, appendChildElement } from '../common/utils/helper';\nimport { textElement, RectOption, createSvg, firstToLowerCase, titlePositionX, redrawElement } from '../common/utils/helper';\nimport { appendClipElement } from '../common/utils/helper';\nimport { getSeriesColor, Theme, getThemeColor } from '../common/model/theme';\nimport { Margin, Border, ChartArea, Font, Indexes, TooltipSettings } from '../common/model/base';\nimport { Row, Column, Axis } from './axis/axis';\nimport { CartesianAxisLayoutPanel } from './axis/cartesian-panel';\nimport { Rect, measureText, TextOption, Size } from '@syncfusion/ej2-svg-base';\nimport { ChartData } from './utils/get-data';\nimport { Series } from './series/chart-series';\nimport { Data } from '../common/model/data';\nimport { Marker } from './series/marker';\nimport { LegendSettings } from '../common/legend/legend';\nimport { TechnicalIndicator } from './technical-indicators/technical-indicator';\nimport { chartMouseClick, pointClick, pointMove, chartMouseLeave, resized } from '../common/model/constants';\nimport { chartMouseDown, chartMouseMove, chartMouseUp, load } from '../common/model/constants';\nimport { ChartAnnotationSettings } from './model/chart-base';\nimport { getElement, getTitle } from '../common/utils/helper';\nimport { ExportUtils } from '../common/utils/export';\n/**\n * Configures the crosshair in the chart.\n */\nvar CrosshairSettings = /** @class */ (function (_super) {\n __extends(CrosshairSettings, _super);\n function CrosshairSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], CrosshairSettings.prototype, \"enable\", void 0);\n __decorate([\n Property('')\n ], CrosshairSettings.prototype, \"dashArray\", void 0);\n __decorate([\n Complex({ color: null, width: 1 }, Border)\n ], CrosshairSettings.prototype, \"line\", void 0);\n __decorate([\n Property('Both')\n ], CrosshairSettings.prototype, \"lineType\", void 0);\n return CrosshairSettings;\n}(ChildProperty));\nexport { CrosshairSettings };\n/**\n * Configures the zooming behavior for the chart.\n */\nvar ZoomSettings = /** @class */ (function (_super) {\n __extends(ZoomSettings, _super);\n function ZoomSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], ZoomSettings.prototype, \"enableSelectionZooming\", void 0);\n __decorate([\n Property(false)\n ], ZoomSettings.prototype, \"enablePinchZooming\", void 0);\n __decorate([\n Property(false)\n ], ZoomSettings.prototype, \"enableMouseWheelZooming\", void 0);\n __decorate([\n Property(true)\n ], ZoomSettings.prototype, \"enableDeferredZooming\", void 0);\n __decorate([\n Property('XY')\n ], ZoomSettings.prototype, \"mode\", void 0);\n __decorate([\n Property(['Zoom', 'ZoomIn', 'ZoomOut', 'Pan', 'Reset'])\n ], ZoomSettings.prototype, \"toolbarItems\", void 0);\n __decorate([\n Property(false)\n ], ZoomSettings.prototype, \"enablePan\", void 0);\n __decorate([\n Property(false)\n ], ZoomSettings.prototype, \"enableScrollbar\", void 0);\n return ZoomSettings;\n}(ChildProperty));\nexport { ZoomSettings };\n/**\n * Represents the Chart control.\n * ```html\n *
').replace(/<\\/b>/g, '
').replace(/:/g, '
\\u200E:
')\n .split('
');\n subWidth = 0;\n isColumn = true;\n height += dy;\n for (var k_1 = 0, len_1 = lines.length; k_1 < len_1; k_1++) {\n line = lines[k_1];\n if (!/\\S/.test(line) && line !== '') {\n line = ' '; //to trim multiple white spaces to single white space\n }\n if ((!isColumn && line === ' ') || (line.replace(//g, '').replace(/<\\/b>/g, '').trim() !== '')) {\n subWidth += line !== ' ' ? spaceWidth : 0;\n if (isColumn && !isRow) {\n tspanOption = { x: (this.marginX * 2) + (markerSize + markerPadding),\n dy: dy + ((isColumn) ? headerSpace : 0), fill: '' };\n headerSpace = null;\n }\n else {\n if (isRow && isColumn) {\n tspanOption = { x: (headerContent === '') ? ((this.marginX * 2) + (markerSize + markerPadding))\n : (this.marginX * 2) };\n }\n else {\n tspanOption = {};\n }\n }\n isColumn = false;\n tspanElement = this.renderer.createTSpan(tspanOption, '');\n parentElement.appendChild(tspanElement);\n if (line.indexOf('') > -1) {\n fontWeight = 'bold';\n labelColor = this.themeStyle.tooltipBoldLabel;\n tspanStyle = 'font-weight:' + fontWeight;\n font.fontWeight = fontWeight;\n (tspanElement).setAttribute('fill', this.textStyle.color || labelColor);\n }\n else {\n tspanStyle = fontWeight === 'bold' ? 'font-weight:' + fontWeight : '';\n font.fontWeight = fontWeight;\n (tspanElement).setAttribute('fill', this.textStyle.color || labelColor);\n }\n if (line.indexOf('') > -1) {\n fontWeight = 'Normal';\n labelColor = this.themeStyle.tooltipLightLabel;\n }\n (tspanElement).textContent = line = line.replace(/<[a-zA-Z\\/](.|\\n)*?>/g, '');\n subWidth += measureText(line, font).width;\n if (tspanStyle !== '') {\n tspanElement.setAttribute('style', tspanStyle);\n }\n isRow = false;\n }\n }\n subWidth -= spaceWidth;\n width = Math.max(width, subWidth);\n }\n }\n this.elementSize = new Size(width + (width > 0 ? (2 * this.marginX) : 0), height);\n this.elementSize.width += (markerSize + markerPadding); // marker size + marker Spacing\n var element = (parentElement.childNodes[0]);\n if (headerContent !== '' && element) {\n font.fontWeight = 'bold';\n var width_1 = (this.elementSize.width + (2 * this.padding)) / 2 - measureText(headerContent, font).width / 2;\n element.setAttribute('x', width_1.toString());\n }\n };\n Tooltip.prototype.createTemplate = function (areaBounds, location) {\n var argsData = { cancel: false, name: 'tooltipRender', tooltip: this };\n this.trigger('tooltipRender', argsData);\n var parent = document.getElementById(this.element.id);\n var firstElement = parent.firstElementChild;\n if (firstElement) {\n remove(firstElement);\n }\n if (!argsData.cancel) {\n var templateElement = this.templateFn(this.data);\n var elem = createElement('div', { id: this.element.id + 'parent_template' });\n while (templateElement && templateElement.length > 0) {\n elem.appendChild(templateElement[0]);\n }\n parent.appendChild(elem);\n var rect = this.element.getBoundingClientRect();\n this.padding = 0;\n this.elementSize = new Size(rect.width, rect.height);\n var tooltipRect = this.tooltipLocation(areaBounds, location, new TooltipLocation(0, 0), new TooltipLocation(0, 0));\n if (this.enableAnimation && !this.shared && !this.isFirst) {\n this.animateTooltipDiv(this.element, tooltipRect);\n }\n else {\n this.updateDiv(this.element, tooltipRect.x, tooltipRect.y);\n }\n }\n else {\n remove(getElement(this.element.id + '_tooltip'));\n }\n };\n Tooltip.prototype.sharedTooltipLocation = function (bounds, x, y) {\n var width = this.elementSize.width + (2 * this.marginX);\n var height = this.elementSize.height + (2 * this.marginY);\n var tooltipRect = new Rect(x + 2 * this.padding, y - height - this.padding, width, height);\n if (tooltipRect.y < bounds.y) {\n tooltipRect.y += (tooltipRect.height + 2 * this.padding);\n }\n if (tooltipRect.x + tooltipRect.width > bounds.x + bounds.width) {\n tooltipRect.x -= (tooltipRect.width + 4 * this.padding);\n }\n return tooltipRect;\n };\n Tooltip.prototype.tooltipLocation = function (bounds, symbolLocation, arrowLocation, tipLocation) {\n var location = new TooltipLocation(symbolLocation.x, symbolLocation.y);\n var width = this.elementSize.width + (2 * this.marginX);\n var height = this.elementSize.height + (2 * this.marginY);\n var markerHeight = this.offset;\n var clipX = this.clipBounds.x;\n var clipY = this.clipBounds.y;\n var boundsX = bounds.x;\n var boundsY = bounds.y;\n if (!this.inverted) {\n location = new TooltipLocation(location.x + clipX - this.elementSize.width / 2 - this.padding, location.y + clipY - this.elementSize.height - (2 * this.padding) - this.arrowPadding - markerHeight);\n arrowLocation.x = tipLocation.x = width / 2;\n if (location.y < boundsY || (this.isNegative)) {\n location.y = (symbolLocation.y < 0 ? 0 : symbolLocation.y) + clipY + markerHeight;\n }\n if (location.y + height + this.arrowPadding > boundsY + bounds.height) {\n location.y = (symbolLocation.y > bounds.height ? bounds.height : symbolLocation.y)\n + clipY - this.elementSize.height - (2 * this.padding) - this.arrowPadding - markerHeight;\n }\n tipLocation.x = width / 2;\n if (location.x < boundsX) {\n arrowLocation.x -= (boundsX - location.x);\n tipLocation.x -= (boundsX - location.x);\n location.x = boundsX;\n }\n if (location.x + width > boundsX + bounds.width) {\n arrowLocation.x += ((location.x + width) - (boundsX + bounds.width));\n tipLocation.x += ((location.x + width) - (boundsX + bounds.width));\n location.x -= ((location.x + width) - (boundsX + bounds.width));\n }\n if (arrowLocation.x + this.arrowPadding / 2 > width - this.rx) {\n arrowLocation.x = width - this.rx - this.arrowPadding / 2;\n tipLocation.x = width;\n this.tipRadius = 0;\n }\n if (arrowLocation.x - this.arrowPadding / 2 < this.rx) {\n arrowLocation.x = this.rx + this.arrowPadding / 2;\n tipLocation.x = 0;\n this.tipRadius = 0;\n }\n }\n else {\n location = new TooltipLocation(location.x + clipX + markerHeight, location.y + clipY - this.elementSize.height / 2 - (this.padding));\n arrowLocation.y = tipLocation.y = height / 2;\n if ((location.x + width + this.arrowPadding > boundsX + bounds.width) || (this.isNegative)) {\n location.x = (symbolLocation.x > bounds.width ? bounds.width : symbolLocation.x)\n + clipX - markerHeight - (width + this.arrowPadding);\n }\n if (location.x < boundsX) {\n location.x = (symbolLocation.x < 0 ? 0 : symbolLocation.x) + clipX + markerHeight;\n }\n if (location.y <= boundsY) {\n arrowLocation.y -= (boundsY - location.y);\n tipLocation.y -= (boundsY - location.y);\n location.y = boundsY;\n }\n if (location.y + height >= boundsY + bounds.height) {\n arrowLocation.y += ((location.y + height) - (boundsY + bounds.height));\n tipLocation.y += ((location.y + height) - (boundsY + bounds.height));\n location.y -= ((location.y + height) - (boundsY + bounds.height));\n }\n if (arrowLocation.y + this.arrowPadding / 2 > height - this.ry) {\n arrowLocation.y = height - this.ry - this.arrowPadding / 2;\n tipLocation.y = height;\n this.tipRadius = 0;\n }\n if (arrowLocation.y - this.arrowPadding / 2 < this.ry) {\n arrowLocation.y = this.ry + this.arrowPadding / 2;\n tipLocation.y = 0;\n this.tipRadius = 0;\n }\n }\n return new Rect(location.x, location.y, width, height);\n };\n Tooltip.prototype.animateTooltipDiv = function (tooltipDiv, rect) {\n var _this = this;\n var x = parseFloat(tooltipDiv.style.left);\n var y = parseFloat(tooltipDiv.style.top);\n var currenDiff;\n new Animation({}).animate(tooltipDiv, {\n duration: 300,\n progress: function (args) {\n currenDiff = (args.timeStamp / args.duration);\n tooltipDiv.style.animation = null;\n tooltipDiv.style.left = (x + currenDiff * (rect.x - x)) + 'px';\n tooltipDiv.style.top = (y + currenDiff * (rect.y - y)) + 'px';\n },\n end: function (model) {\n _this.updateDiv(tooltipDiv, rect.x, rect.y);\n _this.trigger('animationComplete', { tooltip: _this });\n }\n });\n };\n Tooltip.prototype.updateDiv = function (tooltipDiv, x, y) {\n tooltipDiv.style.left = x + 'px';\n tooltipDiv.style.top = y + 'px';\n };\n Tooltip.prototype.updateTemplateFn = function () {\n if (this.template) {\n var e = void 0;\n try {\n if (document.querySelectorAll(this.template).length) {\n this.templateFn = templateComplier(document.querySelector(this.template).innerHTML.trim());\n }\n }\n catch (e) {\n this.templateFn = templateComplier(this.template);\n }\n }\n };\n /** @private */\n Tooltip.prototype.fadeOut = function () {\n var _this = this;\n var tooltipElement = getElement(this.element.id);\n if (tooltipElement) {\n var tooltipGroup_1 = tooltipElement.firstChild;\n var opacity_1 = parseFloat(tooltipGroup_1.getAttribute('opacity')) || 1;\n new Animation({}).animate(tooltipGroup_1, {\n duration: 200,\n progress: function (args) {\n // tooltipGroup.removeAttribute('e-animate');\n _this.progressAnimation(tooltipGroup_1, opacity_1, (args.timeStamp / args.duration));\n },\n end: function (model) {\n _this.fadeOuted = true;\n _this.endAnimation(tooltipGroup_1);\n }\n });\n }\n };\n Tooltip.prototype.progressAnimation = function (tooltipGroup, opacity, timeStamp) {\n tooltipGroup.style.animation = '';\n tooltipGroup.setAttribute('opacity', (opacity - timeStamp).toString());\n };\n /*\n * @hidden\n */\n Tooltip.prototype.endAnimation = function (tooltipGroup) {\n tooltipGroup.setAttribute('opacity', '0');\n if (this.template && !this.shared) {\n tooltipGroup.style.display = 'none';\n }\n this.trigger('animationComplete', { tooltip: this });\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @private\n */\n Tooltip.prototype.getPersistData = function () {\n var keyEntity = [];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Get component name\n * @private\n */\n Tooltip.prototype.getModuleName = function () {\n return 'tooltip';\n };\n /**\n * To destroy the accumulationcharts\n * @private\n */\n Tooltip.prototype.destroy = function () {\n _super.prototype.destroy.call(this);\n this.element.classList.remove('e-tooltip');\n };\n /**\n * Called internally if any of the property value changed.\n * @return {void}\n * @private\n */\n Tooltip.prototype.onPropertyChanged = function (newProp, oldProp) {\n this.isFirst = false;\n this.render();\n };\n __decorate([\n Property(false)\n ], Tooltip.prototype, \"enable\", void 0);\n __decorate([\n Property(false)\n ], Tooltip.prototype, \"shared\", void 0);\n __decorate([\n Property(true)\n ], Tooltip.prototype, \"enableShadow\", void 0);\n __decorate([\n Property(null)\n ], Tooltip.prototype, \"fill\", void 0);\n __decorate([\n Property('')\n ], Tooltip.prototype, \"header\", void 0);\n __decorate([\n Property(0.75)\n ], Tooltip.prototype, \"opacity\", void 0);\n __decorate([\n Complex({ size: '13px', fontWeight: 'Normal', color: null, fontStyle: 'Normal', fontFamily: 'Segoe UI' }, TextStyle)\n ], Tooltip.prototype, \"textStyle\", void 0);\n __decorate([\n Property(null)\n ], Tooltip.prototype, \"template\", void 0);\n __decorate([\n Property(true)\n ], Tooltip.prototype, \"enableAnimation\", void 0);\n __decorate([\n Property(false)\n ], Tooltip.prototype, \"inverted\", void 0);\n __decorate([\n Property(false)\n ], Tooltip.prototype, \"isNegative\", void 0);\n __decorate([\n Complex({ color: '#cccccc', width: 0.5 }, TooltipBorder)\n ], Tooltip.prototype, \"border\", void 0);\n __decorate([\n Property([])\n ], Tooltip.prototype, \"content\", void 0);\n __decorate([\n Property(10)\n ], Tooltip.prototype, \"markerSize\", void 0);\n __decorate([\n Complex({ x: 0, y: 0 }, ToolLocation)\n ], Tooltip.prototype, \"clipBounds\", void 0);\n __decorate([\n Property([])\n ], Tooltip.prototype, \"palette\", void 0);\n __decorate([\n Property([])\n ], Tooltip.prototype, \"shapes\", void 0);\n __decorate([\n Complex({ x: 0, y: 0 }, ToolLocation)\n ], Tooltip.prototype, \"location\", void 0);\n __decorate([\n Property(0)\n ], Tooltip.prototype, \"offset\", void 0);\n __decorate([\n Property(2)\n ], Tooltip.prototype, \"rx\", void 0);\n __decorate([\n Property(2)\n ], Tooltip.prototype, \"ry\", void 0);\n __decorate([\n Property(5)\n ], Tooltip.prototype, \"marginX\", void 0);\n __decorate([\n Property(5)\n ], Tooltip.prototype, \"marginY\", void 0);\n __decorate([\n Property(12)\n ], Tooltip.prototype, \"arrowPadding\", void 0);\n __decorate([\n Property(null)\n ], Tooltip.prototype, \"data\", void 0);\n __decorate([\n Property('Material')\n ], Tooltip.prototype, \"theme\", void 0);\n __decorate([\n Complex({ x: 0, y: 0, width: 0, height: 0 }, AreaBounds)\n ], Tooltip.prototype, \"areaBounds\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"tooltipRender\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"loaded\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"animationComplete\", void 0);\n Tooltip = __decorate([\n NotifyPropertyChanges\n ], Tooltip);\n return Tooltip;\n}(Component));\nexport { Tooltip };\n","/**\n * Numeric Range.\n * @private\n */\nvar DoubleRange = /** @class */ (function () {\n function DoubleRange(start, end) {\n /*\n if (!isNaN(start) && !isNaN(end)) {\n this.mIsEmpty = true;\n } else {\n this.mIsEmpty = false;\n }*/\n if (start < end) {\n this.mStart = start;\n this.mEnd = end;\n }\n else {\n this.mStart = end;\n this.mEnd = start;\n }\n }\n Object.defineProperty(DoubleRange.prototype, \"start\", {\n //private mIsEmpty: boolean;\n /** @private */\n get: function () {\n return this.mStart;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(DoubleRange.prototype, \"end\", {\n /** @private */\n get: function () {\n return this.mEnd;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(DoubleRange.prototype, \"delta\", {\n /*\n get isEmpty(): boolean {\n return this.mIsEmpty;\n }*/\n /** @private */\n get: function () {\n return (this.mEnd - this.mStart);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(DoubleRange.prototype, \"median\", {\n /** @private */\n get: function () {\n return this.mStart + (this.mEnd - this.mStart) / 2;\n },\n enumerable: true,\n configurable: true\n });\n return DoubleRange;\n}());\nexport { DoubleRange };\n","import { getMinPointsDelta, getActualDesiredIntervalsCount, setRange, triggerLabelRender } from '../../common/utils/helper';\nimport { DoubleRange } from '../utils/double-range';\nimport { withIn, logBase } from '../../common/utils/helper';\nimport { isNullOrUndefined, extend, getValue } from '@syncfusion/ej2-base';\n/**\n * Numeric module is used to render numeric axis.\n */\nvar Double = /** @class */ (function () {\n /**\n * Constructor for the dateTime module.\n * @private\n */\n function Double(chart) {\n this.chart = chart;\n }\n /**\n * Numeric Nice Interval for the axis.\n * @private\n */\n Double.prototype.calculateNumericNiceInterval = function (axis, delta, size) {\n var actualDesiredIntervalsCount = getActualDesiredIntervalsCount(size, axis);\n var niceInterval = delta / actualDesiredIntervalsCount;\n if (!isNullOrUndefined(axis.desiredIntervals)) {\n return niceInterval;\n }\n var minInterval = Math.pow(10, Math.floor(logBase(niceInterval, 10)));\n for (var _i = 0, _a = axis.intervalDivs; _i < _a.length; _i++) {\n var interval = _a[_i];\n var currentInterval = minInterval * interval;\n if (actualDesiredIntervalsCount < (delta / currentInterval)) {\n break;\n }\n niceInterval = currentInterval;\n }\n return niceInterval;\n };\n /**\n * Actual Range for the axis.\n * @private\n */\n Double.prototype.getActualRange = function (axis, size) {\n this.initializeDoubleRange(axis);\n axis.actualRange.interval = axis.interval || this.calculateNumericNiceInterval(axis, axis.doubleRange.delta, size);\n axis.actualRange.min = axis.doubleRange.start;\n axis.actualRange.max = axis.doubleRange.end;\n };\n /**\n * Range for the axis.\n * @private\n */\n Double.prototype.initializeDoubleRange = function (axis) {\n //Axis Min\n if (axis.minimum !== null) {\n this.min = axis.minimum;\n }\n else if (this.min === null || this.min === Number.POSITIVE_INFINITY) {\n this.min = 0;\n }\n // Axis Max\n if (axis.maximum !== null) {\n this.max = axis.maximum;\n }\n else if (this.max === null || this.max === Number.NEGATIVE_INFINITY) {\n this.max = 5;\n }\n if (this.min === this.max) {\n this.max = axis.valueType.indexOf('Category') > -1 ? this.max : this.min + 1;\n }\n axis.doubleRange = new DoubleRange(this.min, this.max);\n axis.actualRange = {};\n };\n /**\n * The function to calculate the range and labels for the axis.\n * @return {void}\n * @private\n */\n Double.prototype.calculateRangeAndInterval = function (size, axis) {\n this.calculateRange(axis, size);\n this.getActualRange(axis, size);\n this.applyRangePadding(axis, size);\n this.calculateVisibleLabels(axis, this.chart);\n };\n /**\n * Calculate Range for the axis.\n * @private\n */\n Double.prototype.calculateRange = function (axis, size) {\n /*! Generate axis range */\n var series;\n this.min = null;\n this.max = null;\n if (!setRange(axis)) {\n for (var _i = 0, _a = axis.series; _i < _a.length; _i++) {\n var series_1 = _a[_i];\n if (!series_1.visible) {\n continue;\n }\n this.paddingInterval = 0;\n axis.maxPointLength = series_1.points.length;\n if (((series_1.type.indexOf('Column') > -1 || series_1.type.indexOf('Histogram') > -1) && axis.orientation === 'Horizontal')\n || (series_1.type.indexOf('Bar') > -1 && axis.orientation === 'Vertical')) {\n if ((series_1.xAxis.valueType === 'Double' || series_1.xAxis.valueType === 'DateTime')\n && series_1.xAxis.rangePadding === 'Auto') {\n this.paddingInterval = getMinPointsDelta(series_1.xAxis, axis.series) / 2;\n }\n }\n //For xRange\n if (axis.orientation === 'Horizontal') {\n if (this.chart.requireInvertedAxis) {\n this.findMinMax(series_1.yMin, series_1.yMax);\n }\n else {\n this.findMinMax(series_1.xMin - this.paddingInterval, series_1.xMax + this.paddingInterval);\n }\n }\n // For yRange\n if (axis.orientation === 'Vertical') {\n if (this.chart.requireInvertedAxis) {\n this.findMinMax(series_1.xMin - this.paddingInterval, series_1.xMax + this.paddingInterval);\n }\n else {\n this.findMinMax(series_1.yMin, series_1.yMax);\n }\n }\n }\n }\n };\n Double.prototype.findMinMax = function (min, max) {\n if (this.min === null || this.min > min) {\n this.min = min;\n }\n if (this.max === null || this.max < max) {\n this.max = max;\n }\n };\n /**\n * Apply padding for the range.\n * @private\n */\n Double.prototype.applyRangePadding = function (axis, size) {\n var range;\n var start = axis.actualRange.min;\n var end = axis.actualRange.max;\n if (!setRange(axis)) {\n var interval = axis.actualRange.interval;\n var padding = axis.getRangePadding(this.chart);\n if (padding === 'Additional' || padding === 'Round') {\n this.findAdditional(axis, start, end, interval);\n }\n else if (padding === 'Normal') {\n this.findNormal(axis, start, end, interval, size);\n }\n else {\n this.updateActualRange(axis, start, end, interval);\n }\n }\n axis.actualRange.delta = axis.actualRange.max - axis.actualRange.min;\n this.calculateVisibleRange(size, axis);\n };\n Double.prototype.updateActualRange = function (axis, minimum, maximum, interval) {\n axis.actualRange.min = axis.minimum != null ? axis.minimum : minimum;\n axis.actualRange.max = axis.maximum != null ? axis.maximum : maximum;\n axis.actualRange.interval = axis.interval != null ? axis.interval : interval;\n };\n Double.prototype.findAdditional = function (axis, start, end, interval) {\n var minimum;\n var maximum;\n minimum = Math.floor(start / interval) * interval;\n maximum = Math.ceil(end / interval) * interval;\n if (axis.rangePadding === 'Additional') {\n minimum -= interval;\n maximum += interval;\n }\n this.updateActualRange(axis, minimum, maximum, interval);\n };\n Double.prototype.findNormal = function (axis, start, end, interval, size) {\n var remaining;\n var minimum;\n var maximum;\n var startValue = start;\n if (start < 0) {\n startValue = 0;\n minimum = start + (start / 20);\n remaining = interval + (minimum % interval);\n if ((0.365 * interval) >= remaining) {\n minimum -= interval;\n }\n if (minimum % interval < 0) {\n minimum = (minimum - interval) - (minimum % interval);\n }\n }\n else {\n minimum = start < ((5.0 / 6.0) * end) ? 0 : (start - (end - start) / 2);\n if (minimum % interval > 0) {\n minimum -= (minimum % interval);\n }\n }\n maximum = (end > 0) ? (end + (end - startValue) / 20) : (end - (end - startValue) / 20);\n remaining = interval - (maximum % interval);\n if ((0.365 * interval) >= remaining) {\n maximum += interval;\n }\n if (maximum % interval > 0) {\n maximum = (maximum + interval) - (maximum % interval);\n }\n axis.doubleRange = new DoubleRange(minimum, maximum);\n if (minimum === 0) {\n interval = this.calculateNumericNiceInterval(axis, axis.doubleRange.delta, size);\n maximum = Math.ceil(maximum / interval) * interval;\n }\n this.updateActualRange(axis, minimum, maximum, interval);\n };\n /**\n * Calculate visible range for axis.\n * @private\n */\n Double.prototype.calculateVisibleRange = function (size, axis) {\n axis.visibleRange = {\n max: axis.actualRange.max, min: axis.actualRange.min,\n delta: axis.actualRange.delta, interval: axis.actualRange.interval\n };\n var isLazyLoad = isNullOrUndefined(axis.zoomingScrollBar) ? false : axis.zoomingScrollBar.isLazyLoad;\n if ((axis.zoomFactor < 1 || axis.zoomPosition > 0) && !isLazyLoad) {\n axis.calculateVisibleRange(size);\n axis.visibleRange.interval = (axis.enableAutoIntervalOnZooming && axis.valueType !== 'Category') ?\n this.calculateNumericNiceInterval(axis, axis.doubleRange.delta, size)\n : axis.visibleRange.interval;\n }\n axis.triggerRangeRender(this.chart, axis.visibleRange.min, axis.visibleRange.max, axis.visibleRange.interval);\n };\n /**\n * Calculate label for the axis.\n * @private\n */\n Double.prototype.calculateVisibleLabels = function (axis, chart) {\n /*! Generate axis labels */\n axis.visibleLabels = [];\n var tempInterval = axis.visibleRange.min;\n var labelStyle;\n if (axis.zoomFactor < 1 || axis.zoomPosition > 0 || this.paddingInterval) {\n tempInterval = axis.visibleRange.min - (axis.visibleRange.min % axis.visibleRange.interval);\n }\n var format = this.getFormat(axis);\n var isCustom = format.match('{value}') !== null;\n var intervalDigits = 0;\n var formatDigits = 0;\n if (axis.labelFormat && axis.labelFormat.indexOf('n') > -1) {\n formatDigits = parseInt(axis.labelFormat.substring(1, axis.labelFormat.length), 10);\n }\n axis.format = chart.intl.getNumberFormat({\n format: isCustom ? '' : format,\n useGrouping: chart.useGroupingSeparator\n });\n axis.startLabel = axis.format(axis.visibleRange.min);\n axis.endLabel = axis.format(axis.visibleRange.max);\n if (axis.visibleRange.interval && (axis.visibleRange.interval + '').indexOf('.') >= 0) {\n intervalDigits = (axis.visibleRange.interval + '').split('.')[1].length;\n }\n labelStyle = (extend({}, getValue('properties', axis.labelStyle), null, true));\n for (; tempInterval <= axis.visibleRange.max; tempInterval += axis.visibleRange.interval) {\n if (withIn(tempInterval, axis.visibleRange)) {\n triggerLabelRender(chart, tempInterval, this.formatValue(axis, isCustom, format, tempInterval), labelStyle, axis);\n }\n }\n if (tempInterval && (tempInterval + '').indexOf('.') >= 0 && (tempInterval + '').split('.')[1].length > 10) {\n tempInterval = (tempInterval + '').split('.')[1].length > (formatDigits || intervalDigits) ?\n +tempInterval.toFixed(formatDigits || intervalDigits) : tempInterval;\n if (tempInterval <= axis.visibleRange.max) {\n triggerLabelRender(chart, tempInterval, this.formatValue(axis, isCustom, format, tempInterval), labelStyle, axis);\n }\n }\n if (axis.getMaxLabelWidth) {\n axis.getMaxLabelWidth(this.chart);\n }\n };\n /**\n * Format of the axis label.\n * @private\n */\n Double.prototype.getFormat = function (axis) {\n if (axis.labelFormat) {\n return axis.labelFormat;\n }\n return axis.isStack100 ? '{value}%' : '';\n };\n /**\n * Formatted the axis label.\n * @private\n */\n Double.prototype.formatValue = function (axis, isCustom, format, tempInterval) {\n return isCustom ? format.replace('{value}', axis.format(tempInterval))\n : axis.format(tempInterval);\n };\n return Double;\n}());\nexport { Double };\n","/**\n * Specifies the chart constant value\n */\n/** @private */\nexport var loaded = 'loaded';\n/** @private */\nexport var load = 'load';\n/** @private */\nexport var animationComplete = 'animationComplete';\n/** @private */\nexport var legendRender = 'legendRender';\n/** @private */\nexport var textRender = 'textRender';\n/** @private */\nexport var pointRender = 'pointRender';\n/** @private */\nexport var seriesRender = 'seriesRender';\n/** @private */\nexport var axisLabelRender = 'axisLabelRender';\n/** @private */\nexport var axisRangeCalculated = 'axisRangeCalculated';\n/** @private */\nexport var axisMultiLabelRender = 'axisMultiLabelRender';\n/** @private */\nexport var tooltipRender = 'tooltipRender';\n/** @private */\nexport var chartMouseMove = 'chartMouseMove';\n/** @private */\nexport var chartMouseClick = 'chartMouseClick';\n/** @private */\nexport var pointClick = 'pointClick';\n/** @private */\nexport var pointMove = 'pointMove';\n/** @private */\nexport var chartMouseLeave = 'chartMouseLeave';\n/** @private */\nexport var chartMouseDown = 'chartMouseDown';\n/** @private */\nexport var chartMouseUp = 'chartMouseUp';\n/** @private */\nexport var zoomComplete = 'zoomComplete';\n/** @private */\nexport var dragComplete = 'dragComplete';\n/** @private */\nexport var resized = 'resized';\n/** @private */\nexport var beforePrint = 'beforePrint';\n/** @private */\nexport var annotationRender = 'annotationRender';\n/** @private */\nexport var scrollStart = 'scrollStart';\n/** @private */\nexport var scrollEnd = 'scrollEnd';\n/** @private */\nexport var scrollChanged = 'scrollChanged';\n/** @private */\nexport var stockEventRender = 'stockEventRender';\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { ChildProperty, Property, Complex, Collection } from '@syncfusion/ej2-base';\nimport { Theme } from '../../common/model/theme';\nimport { Font, Border } from '../../common/model/base';\n/**\n * Configures the Annotation for chart.\n */\nvar ChartAnnotationSettings = /** @class */ (function (_super) {\n __extends(ChartAnnotationSettings, _super);\n function ChartAnnotationSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('0')\n ], ChartAnnotationSettings.prototype, \"x\", void 0);\n __decorate([\n Property('0')\n ], ChartAnnotationSettings.prototype, \"y\", void 0);\n __decorate([\n Property(null)\n ], ChartAnnotationSettings.prototype, \"content\", void 0);\n __decorate([\n Property('Center')\n ], ChartAnnotationSettings.prototype, \"horizontalAlignment\", void 0);\n __decorate([\n Property('Pixel')\n ], ChartAnnotationSettings.prototype, \"coordinateUnits\", void 0);\n __decorate([\n Property('Chart')\n ], ChartAnnotationSettings.prototype, \"region\", void 0);\n __decorate([\n Property('Middle')\n ], ChartAnnotationSettings.prototype, \"verticalAlignment\", void 0);\n __decorate([\n Property(null)\n ], ChartAnnotationSettings.prototype, \"xAxisName\", void 0);\n __decorate([\n Property(null)\n ], ChartAnnotationSettings.prototype, \"yAxisName\", void 0);\n __decorate([\n Property(null)\n ], ChartAnnotationSettings.prototype, \"description\", void 0);\n return ChartAnnotationSettings;\n}(ChildProperty));\nexport { ChartAnnotationSettings };\n/**\n * label border properties.\n */\nvar LabelBorder = /** @class */ (function (_super) {\n __extends(LabelBorder, _super);\n function LabelBorder() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], LabelBorder.prototype, \"color\", void 0);\n __decorate([\n Property(1)\n ], LabelBorder.prototype, \"width\", void 0);\n __decorate([\n Property('Rectangle')\n ], LabelBorder.prototype, \"type\", void 0);\n return LabelBorder;\n}(ChildProperty));\nexport { LabelBorder };\n/**\n * categories for multi level labels\n */\nvar MultiLevelCategories = /** @class */ (function (_super) {\n __extends(MultiLevelCategories, _super);\n function MultiLevelCategories() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], MultiLevelCategories.prototype, \"start\", void 0);\n __decorate([\n Property(null)\n ], MultiLevelCategories.prototype, \"end\", void 0);\n __decorate([\n Property('')\n ], MultiLevelCategories.prototype, \"text\", void 0);\n __decorate([\n Property(null)\n ], MultiLevelCategories.prototype, \"maximumTextWidth\", void 0);\n return MultiLevelCategories;\n}(ChildProperty));\nexport { MultiLevelCategories };\n/**\n * Strip line properties\n */\nvar StripLineSettings = /** @class */ (function (_super) {\n __extends(StripLineSettings, _super);\n function StripLineSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], StripLineSettings.prototype, \"visible\", void 0);\n __decorate([\n Property(false)\n ], StripLineSettings.prototype, \"startFromAxis\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"start\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"end\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"size\", void 0);\n __decorate([\n Property('#808080')\n ], StripLineSettings.prototype, \"color\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"dashArray\", void 0);\n __decorate([\n Property('Auto')\n ], StripLineSettings.prototype, \"sizeType\", void 0);\n __decorate([\n Property(false)\n ], StripLineSettings.prototype, \"isRepeat\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"repeatEvery\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"repeatUntil\", void 0);\n __decorate([\n Property(false)\n ], StripLineSettings.prototype, \"isSegmented\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"segmentStart\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"segmentEnd\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"segmentAxisName\", void 0);\n __decorate([\n Complex({ color: 'transparent', width: 1 }, Border)\n ], StripLineSettings.prototype, \"border\", void 0);\n __decorate([\n Property('')\n ], StripLineSettings.prototype, \"text\", void 0);\n __decorate([\n Property(null)\n ], StripLineSettings.prototype, \"rotation\", void 0);\n __decorate([\n Property('Middle')\n ], StripLineSettings.prototype, \"horizontalAlignment\", void 0);\n __decorate([\n Property('Middle')\n ], StripLineSettings.prototype, \"verticalAlignment\", void 0);\n __decorate([\n Complex(Theme.stripLineLabelFont, Font)\n ], StripLineSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property('Behind')\n ], StripLineSettings.prototype, \"zIndex\", void 0);\n __decorate([\n Property(1)\n ], StripLineSettings.prototype, \"opacity\", void 0);\n return StripLineSettings;\n}(ChildProperty));\nexport { StripLineSettings };\n/**\n * MultiLevelLabels properties\n */\nvar MultiLevelLabels = /** @class */ (function (_super) {\n __extends(MultiLevelLabels, _super);\n function MultiLevelLabels() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Center')\n ], MultiLevelLabels.prototype, \"alignment\", void 0);\n __decorate([\n Property('Wrap')\n ], MultiLevelLabels.prototype, \"overflow\", void 0);\n __decorate([\n Complex(Theme.axisLabelFont, Font)\n ], MultiLevelLabels.prototype, \"textStyle\", void 0);\n __decorate([\n Complex({ color: null, width: 1, type: 'Rectangle' }, LabelBorder)\n ], MultiLevelLabels.prototype, \"border\", void 0);\n __decorate([\n Collection([], MultiLevelCategories)\n ], MultiLevelLabels.prototype, \"categories\", void 0);\n return MultiLevelLabels;\n}(ChildProperty));\nexport { MultiLevelLabels };\n/**\n * Specifies range for scrollbarSettings property\n */\nvar ScrollbarSettingsRange = /** @class */ (function (_super) {\n __extends(ScrollbarSettingsRange, _super);\n function ScrollbarSettingsRange() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], ScrollbarSettingsRange.prototype, \"minimum\", void 0);\n __decorate([\n Property(null)\n ], ScrollbarSettingsRange.prototype, \"maximum\", void 0);\n return ScrollbarSettingsRange;\n}(ChildProperty));\nexport { ScrollbarSettingsRange };\n/**\n * Scrollbar Settings Properties for Lazy Loading\n */\nvar ScrollbarSettings = /** @class */ (function (_super) {\n __extends(ScrollbarSettings, _super);\n function ScrollbarSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], ScrollbarSettings.prototype, \"enable\", void 0);\n __decorate([\n Property(null)\n ], ScrollbarSettings.prototype, \"pointsLength\", void 0);\n __decorate([\n Complex({}, ScrollbarSettingsRange)\n ], ScrollbarSettings.prototype, \"range\", void 0);\n return ScrollbarSettings;\n}(ChildProperty));\nexport { ScrollbarSettings };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, Complex, ChildProperty, Collection, extend } from '@syncfusion/ej2-base';\nimport { Font, Border } from '../../common/model/base';\nimport { rotateTextSize, firstToLowerCase, valueToCoefficient, inside } from '../../common/utils/helper';\nimport { Size, Rect, measureText } from '@syncfusion/ej2-svg-base';\nimport { DoubleRange } from '../utils/double-range';\nimport { Double } from '../axis/double-axis';\nimport { Theme } from '../../common/model/theme';\nimport { axisRangeCalculated } from '../../common/model/constants';\nimport { StripLineSettings, MultiLevelLabels, LabelBorder, ScrollbarSettings } from '../model/chart-base';\nimport { textWrap } from '../../common/utils/helper';\nvar axisPadding = 10;\n/**\n * Configures the `rows` of the chart.\n */\nvar Row = /** @class */ (function (_super) {\n __extends(Row, _super);\n function Row() {\n /**\n * The height of the row as a string accept input both as '100px' and '100%'.\n * If specified as '100%, row renders to the full height of its chart.\n * @default '100%'\n */\n var _this = _super !== null && _super.apply(this, arguments) || this;\n /** @private */\n _this.axes = [];\n /** @private */\n _this.nearSizes = [];\n /** @private */\n _this.farSizes = [];\n return _this;\n }\n /**\n * Measure the row size\n * @return {void}\n * @private\n */\n Row.prototype.computeSize = function (axis, clipRect, scrollBarHeight) {\n var width = 0;\n var innerPadding = 5;\n if (axis.visible) {\n width += (axis.findTickSize(axis.crossInAxis) + scrollBarHeight +\n axis.findLabelSize(axis.crossInAxis, innerPadding) + axis.lineStyle.width / 2);\n }\n if (axis.opposedPosition) {\n this.farSizes.push(width);\n }\n else {\n this.nearSizes.push(width);\n }\n };\n __decorate([\n Property('100%')\n ], Row.prototype, \"height\", void 0);\n __decorate([\n Complex({}, Border)\n ], Row.prototype, \"border\", void 0);\n return Row;\n}(ChildProperty));\nexport { Row };\n/**\n * Configures the `columns` of the chart.\n */\nvar Column = /** @class */ (function (_super) {\n __extends(Column, _super);\n function Column() {\n /**\n * The width of the column as a string accepts input both as like '100px' or '100%'.\n * If specified as '100%, column renders to the full width of its chart.\n * @default '100%'\n */\n var _this = _super !== null && _super.apply(this, arguments) || this;\n /** @private */\n _this.axes = [];\n /** @private */\n _this.nearSizes = [];\n /** @private */\n _this.farSizes = [];\n /** @private */\n _this.padding = 0;\n return _this;\n }\n /**\n * Measure the column size\n * @return {void}\n * @private\n */\n Column.prototype.computeSize = function (axis, clipRect, scrollBarHeight) {\n var height = 0;\n var innerPadding = 5;\n if (axis.visible) {\n height += (axis.findTickSize(axis.crossInAxis) + scrollBarHeight +\n axis.findLabelSize(axis.crossInAxis, innerPadding) + axis.lineStyle.width / 2);\n }\n if (axis.opposedPosition) {\n this.farSizes.push(height);\n }\n else {\n this.nearSizes.push(height);\n }\n };\n __decorate([\n Property('100%')\n ], Column.prototype, \"width\", void 0);\n __decorate([\n Complex({}, Border)\n ], Column.prototype, \"border\", void 0);\n return Column;\n}(ChildProperty));\nexport { Column };\n/**\n * Configures the major grid lines in the `axis`.\n */\nvar MajorGridLines = /** @class */ (function (_super) {\n __extends(MajorGridLines, _super);\n function MajorGridLines() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(1)\n ], MajorGridLines.prototype, \"width\", void 0);\n __decorate([\n Property('')\n ], MajorGridLines.prototype, \"dashArray\", void 0);\n __decorate([\n Property(null)\n ], MajorGridLines.prototype, \"color\", void 0);\n return MajorGridLines;\n}(ChildProperty));\nexport { MajorGridLines };\n/**\n * Configures the minor grid lines in the `axis`.\n */\nvar MinorGridLines = /** @class */ (function (_super) {\n __extends(MinorGridLines, _super);\n function MinorGridLines() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(0.7)\n ], MinorGridLines.prototype, \"width\", void 0);\n __decorate([\n Property('')\n ], MinorGridLines.prototype, \"dashArray\", void 0);\n __decorate([\n Property(null)\n ], MinorGridLines.prototype, \"color\", void 0);\n return MinorGridLines;\n}(ChildProperty));\nexport { MinorGridLines };\n/**\n * Configures the axis line of a chart.\n */\nvar AxisLine = /** @class */ (function (_super) {\n __extends(AxisLine, _super);\n function AxisLine() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(1)\n ], AxisLine.prototype, \"width\", void 0);\n __decorate([\n Property('')\n ], AxisLine.prototype, \"dashArray\", void 0);\n __decorate([\n Property(null)\n ], AxisLine.prototype, \"color\", void 0);\n return AxisLine;\n}(ChildProperty));\nexport { AxisLine };\n/**\n * Configures the major tick lines.\n */\nvar MajorTickLines = /** @class */ (function (_super) {\n __extends(MajorTickLines, _super);\n function MajorTickLines() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(1)\n ], MajorTickLines.prototype, \"width\", void 0);\n __decorate([\n Property(5)\n ], MajorTickLines.prototype, \"height\", void 0);\n __decorate([\n Property(null)\n ], MajorTickLines.prototype, \"color\", void 0);\n return MajorTickLines;\n}(ChildProperty));\nexport { MajorTickLines };\n/**\n * Configures the minor tick lines.\n */\nvar MinorTickLines = /** @class */ (function (_super) {\n __extends(MinorTickLines, _super);\n function MinorTickLines() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(0.7)\n ], MinorTickLines.prototype, \"width\", void 0);\n __decorate([\n Property(5)\n ], MinorTickLines.prototype, \"height\", void 0);\n __decorate([\n Property(null)\n ], MinorTickLines.prototype, \"color\", void 0);\n return MinorTickLines;\n}(ChildProperty));\nexport { MinorTickLines };\n/**\n * Configures the crosshair ToolTip.\n */\nvar CrosshairTooltip = /** @class */ (function (_super) {\n __extends(CrosshairTooltip, _super);\n function CrosshairTooltip() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], CrosshairTooltip.prototype, \"enable\", void 0);\n __decorate([\n Property(null)\n ], CrosshairTooltip.prototype, \"fill\", void 0);\n __decorate([\n Complex(Theme.crosshairLabelFont, Font)\n ], CrosshairTooltip.prototype, \"textStyle\", void 0);\n return CrosshairTooltip;\n}(ChildProperty));\nexport { CrosshairTooltip };\n/**\n * Configures the axes in the chart.\n */\nvar Axis = /** @class */ (function (_super) {\n __extends(Axis, _super);\n // tslint:disable-next-line:no-any\n function Axis(parent, propName, defaultValue, isArray) {\n var _this = _super.call(this, parent, propName, defaultValue, isArray) || this;\n /** @private */\n _this.visibleLabels = [];\n /** @private */\n _this.series = [];\n /** @private */\n _this.rect = new Rect(undefined, undefined, 0, 0);\n /** @private */\n _this.axisBottomLine = null;\n /** @private */\n _this.intervalDivs = [10, 5, 2, 1];\n /** @private */\n _this.angle = _this.labelRotation;\n /** @private */\n _this.isStack100 = false;\n /** @private */\n _this.crossAt = null;\n /** @private */\n _this.updatedRect = null;\n /** @private */\n _this.multiLevelLabelHeight = 0;\n /** @private */\n _this.isChart = true;\n return _this;\n }\n /**\n * The function used to find tick size.\n * @return {number}\n * @private\n */\n Axis.prototype.findTickSize = function (crossAxis) {\n if (this.tickPosition === 'Inside') {\n return 0;\n }\n if (crossAxis && (!crossAxis.visibleRange || this.isInside(crossAxis.visibleRange))) {\n return 0;\n }\n return this.majorTickLines.height;\n };\n /**\n * The function used to find axis position.\n * @return {number}\n * @private\n */\n Axis.prototype.isInside = function (range) {\n return (inside(this.crossAt, range) ||\n (!this.opposedPosition && this.crossAt >= range.max) || (this.opposedPosition && this.crossAt <= range.min));\n };\n /**\n * The function used to find label Size.\n * @return {number}\n * @private\n */\n Axis.prototype.findLabelSize = function (crossAxis, innerPadding) {\n var titleSize = 0;\n if (this.title) {\n titleSize = measureText(this.title, this.titleStyle).height + innerPadding;\n }\n if (this.labelPosition === 'Inside') {\n return titleSize + innerPadding;\n }\n var diff;\n var value;\n var labelSize = titleSize + innerPadding + axisPadding +\n ((this.orientation === 'Vertical') ? this.maxLabelSize.width : this.maxLabelSize.height) + this.multiLevelLabelHeight;\n if (crossAxis && this.placeNextToAxisLine) {\n var range = crossAxis.visibleRange;\n var size = (crossAxis.orientation === 'Horizontal') ? crossAxis.rect.width : crossAxis.rect.height;\n if (!range || !size) {\n return 0;\n }\n else if (this.isInside(range)) {\n value = this.findDifference(crossAxis);\n diff = (value) * (size / range.delta);\n diff = (value) * ((size - (diff < labelSize ? (labelSize - diff) : 0)) / range.delta);\n labelSize = (diff < labelSize) ? (labelSize - diff) : 0;\n }\n }\n return labelSize;\n };\n /**\n * The function used to find axis position.\n * @return {number}\n * @private\n */\n Axis.prototype.updateCrossValue = function (chart) {\n var value = this.crossAt;\n if (value === null || !this.isInside(this.crossInAxis.visibleRange)) {\n this.updatedRect = this.rect;\n return null;\n }\n var range = this.crossInAxis.visibleRange;\n if (!this.opposedPosition) {\n if (this.crossAt > range.max) {\n value = range.max;\n }\n }\n else {\n if (this.crossAt < range.min) {\n value = range.min;\n }\n }\n this.updatedRect = extend({}, this.rect, null, true);\n if (this.orientation === 'Horizontal') {\n value = this.crossInAxis.rect.height - (valueToCoefficient(value, this.crossInAxis) * this.crossInAxis.rect.height);\n this.updatedRect.y = this.crossInAxis.rect.y + value;\n }\n else {\n value = valueToCoefficient(value, this.crossInAxis) * this.crossInAxis.rect.width;\n this.updatedRect.x = this.crossInAxis.rect.x + value;\n }\n };\n Axis.prototype.findDifference = function (crossAxis) {\n var value = 0;\n if (this.opposedPosition) {\n value = crossAxis.isInversed ? crossAxis.visibleRange.min : crossAxis.visibleRange.max;\n }\n else {\n value = crossAxis.isInversed ? crossAxis.visibleRange.max : crossAxis.visibleRange.min;\n }\n return Math.abs(this.crossAt - value);\n };\n /**\n * Calculate visible range for axis.\n * @return {void}\n * @private\n */\n Axis.prototype.calculateVisibleRange = function (size) {\n if (this.zoomFactor < 1 || this.zoomPosition > 0) {\n var baseRange = this.actualRange;\n var start = void 0;\n var end = void 0;\n if (!this.isInversed) {\n start = this.actualRange.min + this.zoomPosition * this.actualRange.delta;\n end = start + this.zoomFactor * this.actualRange.delta;\n }\n else {\n start = this.actualRange.max - (this.zoomPosition * this.actualRange.delta);\n end = start - (this.zoomFactor * this.actualRange.delta);\n }\n if (start < baseRange.min) {\n end = end + (baseRange.min - start);\n start = baseRange.min;\n }\n if (end > baseRange.max) {\n start = start - (end - baseRange.max);\n end = baseRange.max;\n }\n this.doubleRange = new DoubleRange(start, end);\n this.visibleRange.min = this.doubleRange.start;\n this.visibleRange.max = this.doubleRange.end;\n this.visibleRange.delta = this.doubleRange.delta;\n }\n };\n /**\n * Triggers the event.\n * @return {void}\n * @private\n */\n Axis.prototype.triggerRangeRender = function (chart, minimum, maximum, interval) {\n var argsData;\n argsData = {\n cancel: false, name: axisRangeCalculated, axis: this,\n minimum: minimum, maximum: maximum, interval: interval\n };\n chart.trigger(axisRangeCalculated, argsData);\n if (!argsData.cancel) {\n this.visibleRange.min = argsData.minimum;\n this.visibleRange.max = argsData.maximum;\n this.visibleRange.interval = argsData.interval;\n this.visibleRange.delta = argsData.maximum - argsData.minimum;\n }\n };\n /**\n * Calculate padding for the axis.\n * @return {string}\n * @private\n */\n Axis.prototype.getRangePadding = function (chart) {\n var padding = this.rangePadding;\n if (padding !== 'Auto') {\n return padding;\n }\n switch (this.orientation) {\n case 'Horizontal':\n if (chart.requireInvertedAxis) {\n padding = (this.isStack100 || this.baseModule.chart.stockChart ? 'Round' : 'Normal');\n }\n else {\n padding = 'None';\n }\n break;\n case 'Vertical':\n if (!chart.requireInvertedAxis) {\n padding = (this.isStack100 || this.baseModule.chart.stockChart ? 'Round' : 'Normal');\n }\n else {\n padding = 'None';\n }\n break;\n }\n return padding;\n };\n /**\n * Calculate maximum label width for the axis.\n * @return {void}\n * @private\n */\n Axis.prototype.getMaxLabelWidth = function (chart) {\n var pointX;\n var previousEnd = 0;\n var isIntersect = false;\n this.angle = this.labelRotation;\n this.maxLabelSize = new Size(0, 0);\n var action = this.labelIntersectAction;\n var label;\n var breakLabels;\n for (var i = 0; i < this.visibleLabels.length; i++) {\n label = this.visibleLabels[i];\n breakLabels = label.originalText.indexOf('
') !== -1 ? label.originalText : label.text;\n if (breakLabels.indexOf('
') !== -1) {\n var labelText = this.enableTrim ? breakLabels : breakLabels.replace(/
/g, ' ');\n label.size = measureText(labelText, this.labelStyle);\n label.breakLabelSize = measureText(breakLabels, this.labelStyle);\n }\n else {\n label.size = measureText(label.text, this.labelStyle);\n }\n var width = (breakLabels.indexOf('
') !== -1) ? label.breakLabelSize.width : label.size.width;\n if (width > this.maxLabelSize.width) {\n this.maxLabelSize.width = width;\n this.rotatedLabel = label.text;\n }\n var height = (breakLabels.indexOf('
') !== -1) ? label.breakLabelSize.height : label.size.height;\n if (height > this.maxLabelSize.height) {\n this.maxLabelSize.height = height;\n }\n if (breakLabels.indexOf('
') !== -1) {\n label.text = this.enableTrim ? label.text : this.getLineBreakText(breakLabels);\n }\n if (action === 'None' || action === 'Hide' || action === 'Trim') {\n continue;\n }\n if ((action !== 'None' || this.angle % 360 === 0) && this.orientation === 'Horizontal' &&\n this.rect.width > 0 && !isIntersect) {\n pointX = (valueToCoefficient(label.value, this) * this.rect.width) + this.rect.x;\n pointX -= label.size.width / 2;\n if (this.edgeLabelPlacement === 'Shift') {\n if (i === 0 && pointX < this.rect.x) {\n pointX = this.rect.x;\n }\n if (i === this.visibleLabels.length - 1 && ((pointX + label.size.width) > (this.rect.x + this.rect.width))) {\n pointX = this.rect.x + this.rect.width - label.size.width;\n }\n }\n switch (action) {\n case 'MultipleRows':\n if (i > 0) {\n this.findMultiRows(i, pointX, label);\n }\n break;\n case 'Rotate45':\n case 'Rotate90':\n if (i > 0 && (!this.isInversed ? pointX <= previousEnd : pointX + label.size.width >= previousEnd)) {\n this.angle = (action === 'Rotate45') ? 45 : 90;\n isIntersect = true;\n }\n break;\n default:\n if (breakLabels.indexOf('
') !== -1) {\n var result = void 0;\n var result1 = [];\n var str = void 0;\n for (var index = 0; index < label.text.length; index++) {\n result = textWrap(label.text[index], this.rect.width / this.visibleLabels.length, this.labelStyle);\n if (result.length > 1) {\n for (var j = 0; j < result.length; j++) {\n str = result[j];\n result1.push(str);\n }\n }\n else {\n result1.push(result[0]);\n }\n }\n label.text = result1;\n }\n else {\n label.text = textWrap(label.text, this.rect.width / this.visibleLabels.length, this.labelStyle);\n }\n var height_1 = (label.size.height * label.text.length);\n if (height_1 > this.maxLabelSize.height) {\n this.maxLabelSize.height = height_1;\n }\n break;\n }\n previousEnd = this.isInversed ? pointX : pointX + label.size.width;\n }\n }\n if (this.angle !== 0 && this.orientation === 'Horizontal') {\n if (this.rotatedLabel.indexOf('
') !== -1) {\n this.maxLabelSize.height = measureText(this.rotatedLabel, this.labelStyle).width;\n this.maxLabelSize.width = measureText(this.rotatedLabel, this.labelStyle).height;\n }\n else {\n this.maxLabelSize = rotateTextSize(this.labelStyle, this.rotatedLabel, this.angle, chart);\n }\n }\n if (chart.multiLevelLabelModule && this.multiLevelLabels.length > 0) {\n chart.multiLevelLabelModule.getMultilevelLabelsHeight(this);\n }\n };\n /**\n * To get line break text collection\n * @param breakLabels\n */\n Axis.prototype.getLineBreakText = function (breakLabels) {\n var breakLabelCollection;\n var breakLabelCollection1 = [];\n breakLabelCollection = breakLabels.split('
');\n for (var i = 0, len = breakLabelCollection.length; i < len; i++) {\n breakLabelCollection1.push(breakLabelCollection[i]);\n //breakLabelCollection1.push(textTrim(220, breakLabelCollection[i], this.labelStyle));\n }\n return breakLabelCollection1;\n };\n /**\n * Finds the multiple rows for axis.\n * @return {void}\n */\n Axis.prototype.findMultiRows = function (length, currentX, currentLabel) {\n var label;\n var pointX;\n var store = [];\n var isMultiRows;\n for (var i = length - 1; i >= 0; i--) {\n label = this.visibleLabels[i];\n pointX = (valueToCoefficient(label.value, this) * this.rect.width) + this.rect.x;\n isMultiRows = !this.isInversed ? currentX < (pointX + label.size.width / 2) :\n currentX + currentLabel.size.width > (pointX - label.size.width / 2);\n if (isMultiRows) {\n store.push(label.index);\n currentLabel.index = (currentLabel.index > label.index) ? currentLabel.index : label.index + 1;\n }\n else {\n currentLabel.index = store.indexOf(label.index) > -1 ? currentLabel.index : label.index;\n }\n }\n var height = (currentLabel.size.height * currentLabel.index) + (5 * (currentLabel.index - 1));\n if (height > this.maxLabelSize.height) {\n this.maxLabelSize.height = height;\n }\n };\n /**\n * Finds the default module for axis.\n * @return {void}\n * @private\n */\n Axis.prototype.getModule = function (chart) {\n if (this.valueType === 'Double') {\n this.baseModule = new Double(chart);\n }\n else {\n this.baseModule = chart[firstToLowerCase(this.valueType) + 'Module'];\n }\n };\n __decorate([\n Complex(Theme.axisLabelFont, Font)\n ], Axis.prototype, \"labelStyle\", void 0);\n __decorate([\n Complex({}, CrosshairTooltip)\n ], Axis.prototype, \"crosshairTooltip\", void 0);\n __decorate([\n Property('')\n ], Axis.prototype, \"title\", void 0);\n __decorate([\n Complex(Theme.axisTitleFont, Font)\n ], Axis.prototype, \"titleStyle\", void 0);\n __decorate([\n Property('')\n ], Axis.prototype, \"labelFormat\", void 0);\n __decorate([\n Property('')\n ], Axis.prototype, \"skeleton\", void 0);\n __decorate([\n Property('DateTime')\n ], Axis.prototype, \"skeletonType\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"plotOffset\", void 0);\n __decorate([\n Property(false)\n ], Axis.prototype, \"isIndexed\", void 0);\n __decorate([\n Property(10)\n ], Axis.prototype, \"logBase\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"columnIndex\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"rowIndex\", void 0);\n __decorate([\n Property(1)\n ], Axis.prototype, \"span\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"desiredIntervals\", void 0);\n __decorate([\n Property(3)\n ], Axis.prototype, \"maximumLabels\", void 0);\n __decorate([\n Property(1)\n ], Axis.prototype, \"zoomFactor\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"zoomPosition\", void 0);\n __decorate([\n Property(false)\n ], Axis.prototype, \"opposedPosition\", void 0);\n __decorate([\n Property(true)\n ], Axis.prototype, \"enableAutoIntervalOnZooming\", void 0);\n __decorate([\n Property('Auto')\n ], Axis.prototype, \"rangePadding\", void 0);\n __decorate([\n Property('Double')\n ], Axis.prototype, \"valueType\", void 0);\n __decorate([\n Property('None')\n ], Axis.prototype, \"edgeLabelPlacement\", void 0);\n __decorate([\n Property('Auto')\n ], Axis.prototype, \"intervalType\", void 0);\n __decorate([\n Property('BetweenTicks')\n ], Axis.prototype, \"labelPlacement\", void 0);\n __decorate([\n Property('Outside')\n ], Axis.prototype, \"tickPosition\", void 0);\n __decorate([\n Property('Outside')\n ], Axis.prototype, \"labelPosition\", void 0);\n __decorate([\n Property('')\n ], Axis.prototype, \"name\", void 0);\n __decorate([\n Property(true)\n ], Axis.prototype, \"visible\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"minorTicksPerInterval\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"labelRotation\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"crossesAt\", void 0);\n __decorate([\n Property(true)\n ], Axis.prototype, \"placeNextToAxisLine\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"crossesInAxis\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"minimum\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"maximum\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"interval\", void 0);\n __decorate([\n Property(34)\n ], Axis.prototype, \"maximumLabelWidth\", void 0);\n __decorate([\n Property(false)\n ], Axis.prototype, \"enableTrim\", void 0);\n __decorate([\n Complex({}, MajorTickLines)\n ], Axis.prototype, \"majorTickLines\", void 0);\n __decorate([\n Complex({}, MinorTickLines)\n ], Axis.prototype, \"minorTickLines\", void 0);\n __decorate([\n Complex({}, MajorGridLines)\n ], Axis.prototype, \"majorGridLines\", void 0);\n __decorate([\n Complex({}, MinorGridLines)\n ], Axis.prototype, \"minorGridLines\", void 0);\n __decorate([\n Complex({}, AxisLine)\n ], Axis.prototype, \"lineStyle\", void 0);\n __decorate([\n Property('Trim')\n ], Axis.prototype, \"labelIntersectAction\", void 0);\n __decorate([\n Property(false)\n ], Axis.prototype, \"isInversed\", void 0);\n __decorate([\n Property(100)\n ], Axis.prototype, \"coefficient\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"startAngle\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"description\", void 0);\n __decorate([\n Property(2)\n ], Axis.prototype, \"tabIndex\", void 0);\n __decorate([\n Collection([], StripLineSettings)\n ], Axis.prototype, \"stripLines\", void 0);\n __decorate([\n Collection([], MultiLevelLabels)\n ], Axis.prototype, \"multiLevelLabels\", void 0);\n __decorate([\n Complex({ color: null, width: 0, type: 'Rectangle' }, LabelBorder)\n ], Axis.prototype, \"border\", void 0);\n __decorate([\n Complex({}, ScrollbarSettings)\n ], Axis.prototype, \"scrollbarSettings\", void 0);\n return Axis;\n}(ChildProperty));\nexport { Axis };\n/** @private */\nvar VisibleLabels = /** @class */ (function () {\n function VisibleLabels(text, value, labelStyle, originalText, size, breakLabelSize, index) {\n if (size === void 0) { size = new Size(0, 0); }\n if (breakLabelSize === void 0) { breakLabelSize = new Size(0, 0); }\n if (index === void 0) { index = 1; }\n this.text = text;\n this.originalText = originalText;\n this.value = value;\n this.labelStyle = labelStyle;\n this.size = size;\n this.breakLabelSize = breakLabelSize;\n this.index = 1;\n }\n return VisibleLabels;\n}());\nexport { VisibleLabels };\n","import { createElement, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { DataUtil } from '@syncfusion/ej2-data';\nimport { subtractThickness, valueToCoefficient, sum, redrawElement } from '../../common/utils/helper';\nimport { subArray, inside, appendChildElement } from '../../common/utils/helper';\nimport { Thickness, logBase, createZoomingLabels, getElement, rotateTextSize } from '../../common/utils/helper';\nimport { Size, Rect, measureText, TextOption, PathOption } from '@syncfusion/ej2-svg-base';\nimport { textElement, textTrim } from '../../common/utils/helper';\n/**\n * Specifies the Cartesian Axis Layout.\n */\nvar axisPadding = 10;\nvar CartesianAxisLayoutPanel = /** @class */ (function () {\n /** @private */\n function CartesianAxisLayoutPanel(chartModule) {\n this.chart = chartModule;\n this.padding = 5;\n }\n /**\n * Measure the axis size.\n * @return {void}\n * @private\n */\n CartesianAxisLayoutPanel.prototype.measureAxis = function (rect) {\n var chart = this.chart;\n this.crossAt(chart);\n this.seriesClipRect = new Rect(rect.x, rect.y, rect.width, rect.height);\n this.initialClipRect = rect;\n this.leftSize = 0;\n this.rightSize = 0;\n this.topSize = 0;\n this.bottomSize = 0;\n //Measure Axis size with initial Rect\n this.measureRowAxis(chart, this.initialClipRect);\n this.initialClipRect = subtractThickness(this.initialClipRect, new Thickness(this.leftSize, this.rightSize, 0, 0));\n this.measureColumnAxis(chart, this.initialClipRect);\n this.initialClipRect = subtractThickness(this.initialClipRect, new Thickness(0, 0, this.topSize, this.bottomSize));\n if (!this.chart.delayRedraw) {\n this.calculateAxisSize(this.initialClipRect);\n }\n this.leftSize = 0;\n this.rightSize = 0;\n this.topSize = 0;\n this.bottomSize = 0;\n //Measure Axis size with series Rect\n this.measureRowAxis(chart, this.initialClipRect);\n this.seriesClipRect = subtractThickness(this.seriesClipRect, new Thickness(this.leftSize, this.rightSize, 0, 0));\n this.measureColumnAxis(chart, this.initialClipRect);\n this.seriesClipRect = subtractThickness(this.seriesClipRect, new Thickness(0, 0, this.topSize, this.bottomSize));\n if (!this.chart.delayRedraw) {\n chart.refreshAxis();\n this.calculateAxisSize(this.seriesClipRect);\n }\n };\n CartesianAxisLayoutPanel.prototype.measureRowAxis = function (chart, rect) {\n var row;\n this.calculateRowSize(rect);\n for (var _i = 0, _a = chart.rows; _i < _a.length; _i++) {\n var item = _a[_i];\n row = item;\n row.nearSizes = [];\n row.farSizes = [];\n this.arrangeAxis(row);\n this.measureDefinition(row, chart, new Size(chart.availableSize.width, row.computedHeight), rect);\n if (this.leftSize < sum(row.nearSizes)) {\n this.leftSize = sum(row.nearSizes);\n }\n if (this.rightSize < sum(row.farSizes)) {\n this.rightSize = sum(row.farSizes);\n }\n }\n };\n CartesianAxisLayoutPanel.prototype.measureColumnAxis = function (chart, rect) {\n var column;\n this.calculateColumnSize(rect);\n for (var _i = 0, _a = chart.columns; _i < _a.length; _i++) {\n var item = _a[_i];\n column = item;\n column.farSizes = [];\n column.nearSizes = [];\n this.arrangeAxis(column);\n this.measureDefinition(column, chart, new Size(column.computedWidth, chart.availableSize.height), rect);\n if (this.bottomSize < sum(column.nearSizes)) {\n this.bottomSize = sum(column.nearSizes);\n }\n if (this.topSize < sum(column.farSizes)) {\n this.topSize = sum(column.farSizes);\n }\n }\n };\n /**\n * Measure the column and row in chart.\n * @return {void}\n * @private\n */\n CartesianAxisLayoutPanel.prototype.measureDefinition = function (definition, chart, size, clipRect) {\n var axis;\n var axisType;\n var ele = 16; // scrollbar element height is 16.\n for (var _i = 0, _a = definition.axes; _i < _a.length; _i++) {\n var axis_1 = _a[_i];\n axis_1.scrollBarHeight = chart.scrollBarModule && chart.zoomSettings.enableScrollbar && chart.zoomModule.isZoomed\n && (axis_1.zoomFactor < 1 || axis_1.zoomPosition > 0) ? ele : 0;\n axis_1.scrollBarHeight = chart.scrollBarModule && (chart.zoomModule && chart.zoomSettings.enableScrollbar &&\n chart.zoomModule.isZoomed && (axis_1.zoomFactor < 1 || axis_1.zoomPosition > 0) || axis_1.scrollbarSettings.enable) ? ele : 0;\n axis_1.getModule(chart);\n axis_1.baseModule.calculateRangeAndInterval(size, axis_1);\n definition.computeSize(axis_1, clipRect, axis_1.scrollBarHeight);\n }\n if (definition.farSizes.length > 0) {\n definition.farSizes[definition.farSizes.length - 1] -= axisPadding;\n }\n if (definition.nearSizes.length > 0) {\n definition.nearSizes[definition.nearSizes.length - 1] -= axisPadding;\n }\n };\n /**\n * Measure the axis.\n * @return {void}\n * @private\n */\n CartesianAxisLayoutPanel.prototype.calculateAxisSize = function (rect) {\n var chart = this.chart;\n var row;\n var column;\n var definition;\n var axis;\n var nearCount = 0;\n var farCount = 0;\n var size = 0;\n var x;\n var y;\n this.calculateRowSize(rect);\n for (var i = 0, len = chart.rows.length; i < len; i++) {\n row = chart.rows[i];\n nearCount = 0;\n farCount = 0;\n for (var j = 0, len_1 = row.axes.length; j < len_1; j++) {\n axis = row.axes[j];\n if (axis.rect.height === 0) {\n axis.rect.height = row.computedHeight;\n size = 0;\n for (var k = i + 1, len_2 = i + axis.span; k < len_2; k++) {\n definition = chart.rows[k];\n size += definition.computedHeight;\n }\n axis.rect.y = (row.computedTop - size) + axis.plotOffset;\n axis.rect.height = (axis.rect.height + size) - (2 * axis.plotOffset);\n axis.rect.width = 0;\n }\n if (axis.opposedPosition) {\n x = rect.x + rect.width + sum(subArray(row.farSizes, farCount));\n axis.rect.x = axis.rect.x >= x ? axis.rect.x : x;\n farCount++;\n }\n else {\n x = rect.x - sum(subArray(row.nearSizes, nearCount));\n axis.rect.x = axis.rect.x <= x ? axis.rect.x : x;\n nearCount++;\n }\n }\n }\n this.calculateColumnSize(rect);\n for (var i = 0, len = chart.columns.length; i < len; i++) {\n column = chart.columns[i];\n nearCount = 0;\n farCount = 0;\n for (var j = 0, len_3 = column.axes.length; j < len_3; j++) {\n axis = column.axes[j];\n if (axis.rect.width === 0) {\n for (var k = i, len_4 = (i + axis.span); k < len_4; k++) {\n definition = chart.columns[k];\n axis.rect.width += definition.computedWidth;\n }\n axis.rect.x = column.computedLeft + axis.plotOffset;\n axis.rect.width -= (2 * axis.plotOffset);\n axis.rect.height = 0;\n }\n if (axis.opposedPosition) {\n y = rect.y - sum(subArray(column.farSizes, farCount));\n axis.rect.y = axis.rect.y <= y ? axis.rect.y : y;\n farCount++;\n }\n else {\n y = rect.y + rect.height + sum(subArray(column.nearSizes, nearCount));\n axis.rect.y = axis.rect.y >= y ? axis.rect.y : y;\n nearCount++;\n }\n }\n }\n };\n /**\n * Measure the axis.\n * @return {void}\n * @private\n */\n CartesianAxisLayoutPanel.prototype.measure = function () {\n var chart = this.chart;\n var row;\n var column;\n var definition;\n var axis;\n var actualIndex;\n var span;\n var axisLength;\n for (var _i = 0, _a = chart.axisCollections; _i < _a.length; _i++) {\n var axis_2 = _a[_i];\n //definition.Axes = axis;\n if (axis_2.orientation === 'Vertical') {\n chart.verticalAxes.push(axis_2);\n actualIndex = this.getActualRow(axis_2);\n row = chart.rows[actualIndex];\n this.pushAxis(row, axis_2);\n span = ((actualIndex + axis_2.span) > chart.rows.length ? chart.rows.length : (actualIndex + axis_2.span));\n for (var j = actualIndex + 1; j < span; j++) {\n definition = chart.rows[j];\n definition.axes[row.axes.length - 1] = axis_2;\n chart.rows[j] = definition;\n }\n chart.rows[actualIndex] = row;\n }\n else {\n chart.horizontalAxes.push(axis_2);\n actualIndex = this.getActualColumn(axis_2);\n column = chart.columns[actualIndex];\n this.pushAxis(column, axis_2);\n span = ((actualIndex + axis_2.span) > chart.columns.length ? chart.columns.length : (actualIndex + axis_2.span));\n for (var j = actualIndex + 1; j < span; j++) {\n definition = chart.columns[j];\n definition.axes[column.axes.length - 1] = axis_2;\n chart.columns[j] = definition;\n }\n chart.columns[actualIndex] = column;\n }\n }\n };\n CartesianAxisLayoutPanel.prototype.crossAt = function (chart) {\n for (var _i = 0, _a = chart.axisCollections; _i < _a.length; _i++) {\n var axis = _a[_i];\n if (axis.crossesAt === null) {\n continue;\n }\n var isTransposed = chart.isTransposed;\n if (!axis.crossesInAxis) {\n if (chart.requireInvertedAxis) {\n axis.crossInAxis = ((axis.orientation === 'Horizontal')) ? chart.primaryXAxis : chart.primaryYAxis;\n }\n else {\n axis.crossInAxis = ((axis.orientation === 'Horizontal')) ? chart.primaryYAxis : chart.primaryXAxis;\n }\n axis.crossAt = this.updateCrossAt(axis.crossInAxis, axis.crossesAt);\n continue;\n }\n else {\n for (var i = 2, len = chart.axisCollections.length; i < len; i++) {\n if (axis.crossesInAxis === chart.axisCollections[i].name) {\n axis.crossInAxis = chart.axisCollections[i];\n axis.crossAt = this.updateCrossAt(axis.crossInAxis, axis.crossesAt);\n continue;\n }\n }\n }\n }\n };\n CartesianAxisLayoutPanel.prototype.updateCrossAt = function (axis, crossAt) {\n switch (axis.valueType) {\n case 'DateTime':\n var option = {\n skeleton: 'full',\n type: 'dateTime'\n };\n var dateParser = this.chart.intl.getDateParser(option);\n var dateFormatter = this.chart.intl.getDateFormat(option);\n return Date.parse(dateParser(dateFormatter(new Date(DataUtil.parse.parseJson({ val: crossAt }).val))));\n case 'Category':\n return parseFloat(crossAt) ? parseFloat(crossAt) : axis.labels.indexOf(crossAt);\n case 'Logarithmic':\n return logBase(crossAt, axis.logBase);\n default:\n return crossAt;\n }\n };\n CartesianAxisLayoutPanel.prototype.pushAxis = function (definition, axis) {\n for (var i = 0, len = definition.axes.length; i <= len; i++) {\n if (!definition.axes[i]) {\n definition.axes[i] = axis;\n break;\n }\n }\n };\n CartesianAxisLayoutPanel.prototype.arrangeAxis = function (definition) {\n var axisCollection = [];\n for (var i = 0, len = definition.axes.length; i <= len; i++) {\n if (definition.axes[i]) {\n axisCollection.push(definition.axes[i]);\n }\n }\n definition.axes = axisCollection;\n };\n CartesianAxisLayoutPanel.prototype.getActualColumn = function (axis) {\n var actualLength = this.chart.columns.length;\n var pos = axis.columnIndex;\n var result = pos >= actualLength ? actualLength - 1 : (pos < 0 ? 0 : pos);\n return result;\n };\n CartesianAxisLayoutPanel.prototype.getActualRow = function (axis) {\n var actualLength = this.chart.rows.length;\n var pos = axis.rowIndex;\n var result = pos >= actualLength ? actualLength - 1 : (pos < 0 ? 0 : pos);\n return result;\n };\n /**\n * Measure the row size.\n * @return {void}\n */\n CartesianAxisLayoutPanel.prototype.calculateRowSize = function (rect) {\n /*! Calculate row size */\n var chart = this.chart;\n var row;\n var rowTop = rect.y + rect.height;\n var height = 0;\n var remainingHeight = Math.max(0, rect.height);\n for (var i = 0, len = chart.rows.length; i < len; i++) {\n row = chart.rows[i];\n if (row.height.indexOf('%') !== -1) {\n height = Math.min(remainingHeight, (rect.height * parseInt(row.height, 10) / 100));\n }\n else {\n height = Math.min(remainingHeight, parseInt(row.height, 10));\n }\n height = (i !== (len - 1)) ? height : remainingHeight;\n row.computedHeight = height;\n rowTop -= height;\n row.computedTop = rowTop;\n remainingHeight -= height;\n }\n };\n /**\n * Measure the row size.\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.calculateColumnSize = function (rect) {\n /*! Calculate column size */\n var chart = this.chart;\n var column;\n var columnLeft = rect.x;\n var width = 0;\n var remainingWidth = Math.max(0, rect.width);\n for (var i = 0, len = chart.columns.length; i < len; i++) {\n column = chart.columns[i];\n if (column.width.indexOf('%') !== -1) {\n width = Math.min(remainingWidth, (rect.width * parseInt(column.width, 10) / 100));\n }\n else {\n width = Math.min(remainingWidth, parseInt(column.width, 10));\n }\n width = (i !== (len - 1)) ? width : remainingWidth;\n column.computedWidth = width;\n column.computedLeft = columnLeft;\n columnLeft += width;\n remainingWidth -= width;\n }\n };\n /**\n * To render the axis element.\n * @return {void}\n * @private\n */\n CartesianAxisLayoutPanel.prototype.renderAxes = function () {\n var chart = this.chart;\n var axis;\n var axisElement = chart.renderer.createGroup({ id: chart.element.id + 'AxisInsideCollection' });\n var axisLineElement = chart.renderer.createGroup({ id: chart.element.id + 'AxisOutsideCollection' });\n var outsideElement;\n var isInside;\n for (var i = 0, len = chart.axisCollections.length; i < len; i++) {\n axis = chart.axisCollections[i];\n this.element = chart.renderer.createGroup({ id: chart.element.id + 'AxisGroup' + i + 'Inside' });\n outsideElement = chart.renderer.createGroup({ id: chart.element.id + 'AxisGroup' + i + 'Outside' });\n isInside = this.findAxisPosition(axis);\n if (axis.orientation === 'Horizontal') {\n axis.updateCrossValue(chart);\n if (axis.visible && axis.lineStyle.width > 0) {\n this.drawAxisLine(axis, i, axis.plotOffset, 0, isInside ? outsideElement : this.element, axis.updatedRect);\n }\n if (axis.majorGridLines.width > 0 || axis.majorTickLines.width > 0) {\n this.drawXAxisGridLine(axis, i, (isInside || axis.tickPosition === 'Inside') ? outsideElement : this.element, axis.updatedRect);\n }\n if (axis.visible) {\n this.drawXAxisLabels(axis, i, (isInside || axis.labelPosition === 'Inside') ? outsideElement : this.element, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n this.drawXAxisBorder(axis, i, (isInside || axis.labelPosition === 'Inside') ? outsideElement : this.element, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n this.drawXAxisTitle(axis, i, isInside ? outsideElement : this.element, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n }\n }\n else {\n axis.updateCrossValue(chart);\n if (axis.visible && axis.lineStyle.width > 0) {\n this.drawAxisLine(axis, i, 0, axis.plotOffset, isInside ? outsideElement : this.element, axis.updatedRect);\n }\n if (axis.majorGridLines.width > 0 || axis.majorTickLines.width > 0) {\n this.drawYAxisGridLine(axis, i, (isInside || axis.tickPosition === 'Inside') ? outsideElement : this.element, axis.updatedRect);\n }\n if (axis.visible) {\n this.drawYAxisLabels(axis, i, (isInside || axis.labelPosition === 'Inside') ? outsideElement : this.element, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n this.drawYAxisBorder(axis, i, (isInside || axis.labelPosition === 'Inside') ? outsideElement : this.element, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n this.drawYAxisTitle(axis, i, isInside ? outsideElement : this.element, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n }\n }\n axisElement.appendChild(this.element);\n if (outsideElement && outsideElement.childNodes.length > 0) {\n axisLineElement.appendChild(outsideElement);\n }\n if (chart.scrollBarModule && (chart.zoomSettings.enableScrollbar || axis.scrollbarSettings.enable)) {\n this.renderScrollbar(chart, axis);\n }\n }\n this.element = chart.renderer.createGroup({ id: chart.element.id + 'DefinitionLine' });\n for (var j = 0, len = chart.rows.length; j < len; j++) {\n var row = chart.rows[j];\n if (row.border.color) {\n this.drawBottomLine(row, j, true);\n }\n }\n for (var j = 0, len = chart.columns.length; j < len; j++) {\n var column = chart.columns[j];\n if (column.border.color) {\n this.drawBottomLine(column, j, false);\n }\n }\n axisElement.appendChild(this.element);\n appendChildElement(chart.svgObject, axisElement, chart.redraw);\n return axisLineElement;\n };\n /**\n * To render the axis scrollbar\n * @param chart\n * @param axis\n */\n CartesianAxisLayoutPanel.prototype.renderScrollbar = function (chart, axis) {\n var isZoomed = isNullOrUndefined(chart.zoomModule) ? false : chart.zoomModule.isZoomed;\n if (((isZoomed && (axis.zoomFactor < 1 || axis.zoomPosition > 0)) || (axis.scrollbarSettings.enable &&\n (axis.zoomFactor <= 1 || axis.zoomPosition >= 0))) && !axis.zoomingScrollBar.isScrollUI) {\n if (!chart.scrollElement) {\n chart.scrollElement = redrawElement(chart.redraw, chart.element.id + '_scrollElement') || createElement('div', { id: chart.element.id + '_scrollElement' });\n }\n appendChildElement(chart.scrollElement, axis.zoomingScrollBar.render(true), true);\n }\n else if (axis.zoomFactor === 1 && axis.zoomPosition === 0 && axis.zoomingScrollBar.svgObject && !axis.scrollbarSettings.enable) {\n axis.zoomingScrollBar.destroy();\n }\n if (axis.zoomingScrollBar.isScrollUI) {\n axis.zoomingScrollBar.isScrollUI = false;\n }\n };\n /**\n * To find the axis position\n * @param axis\n */\n CartesianAxisLayoutPanel.prototype.findAxisPosition = function (axis) {\n return axis.crossAt !== null && axis.isInside(axis.crossInAxis.visibleRange);\n };\n /**\n * To render the bootom line of the columns and rows\n * @param definition\n * @param index\n * @param isRow\n */\n CartesianAxisLayoutPanel.prototype.drawBottomLine = function (definition, index, isRow) {\n var chart = this.chart;\n var optionsLine = {};\n var x1;\n var x2;\n var y1;\n var y2;\n var definitionName;\n if (isRow) {\n definition = definition;\n y1 = y2 = definition.computedTop + definition.computedHeight;\n x1 = this.seriesClipRect.x;\n x2 = x1 + this.seriesClipRect.width;\n definitionName = 'Row';\n }\n else {\n definition = definition;\n x1 = x2 = definition.computedLeft;\n y1 = this.seriesClipRect.y;\n y2 = y1 + this.seriesClipRect.height;\n definitionName = 'Column';\n }\n optionsLine = {\n 'id': chart.element.id + '_AxisBottom_' + definitionName + index,\n x1: x1,\n y1: y1,\n x2: x2,\n y2: y2,\n 'stroke-width': definition.border.width,\n 'stroke': definition.border.color,\n };\n this.htmlObject = chart.renderer.drawLine(optionsLine);\n this.element.appendChild(this.htmlObject);\n };\n /**\n * To render the axis line\n * @param axis\n * @param index\n * @param plotX\n * @param plotY\n * @param parent\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.drawAxisLine = function (axis, index, plotX, plotY, parent, rect) {\n var chart = this.chart;\n var optionsLine = {};\n var element = getElement(chart.element.id + 'AxisLine_' + index);\n var direction = element ? element.getAttribute('d') : '';\n optionsLine = {\n 'id': chart.element.id + 'AxisLine_' + index,\n 'd': 'M ' + (rect.x - plotX) + ' ' + (rect.y - plotY) +\n ' L ' + (rect.x + rect.width + plotX) + ' ' + (rect.y + rect.height + plotY),\n 'stroke-dasharray': axis.lineStyle.dashArray,\n 'stroke-width': axis.lineStyle.width,\n 'stroke': axis.lineStyle.color || chart.themeStyle.axisLine\n };\n this.htmlObject = chart.renderer.drawPath(optionsLine);\n appendChildElement(parent, this.htmlObject, chart.redraw, true, 'x', 'y', null, direction);\n };\n /**\n * To render the yAxis grid line\n * @param axis\n * @param index\n * @param parent\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.drawYAxisGridLine = function (axis, index, parent, rect) {\n var tempInterval;\n var pointY = 0;\n var majorGrid = '';\n var majorTick = '';\n var minorGridDirection;\n var tickSize = axis.opposedPosition ? axis.majorTickLines.height : -axis.majorTickLines.height;\n var axisLineSize = (axis.opposedPosition) ? axis.lineStyle.width / 2 : -axis.lineStyle.width / 2;\n var ticksbwtLabel = (axis.valueType === 'Category' && axis.labelPlacement === 'BetweenTicks') ?\n 0.5 : 0;\n var scrollBarHeight = isNullOrUndefined(axis.crossesAt) ? axis.opposedPosition ? axis.scrollBarHeight :\n -axis.scrollBarHeight : 0;\n var isTickInside = axis.tickPosition === 'Inside';\n var ticks = isTickInside ? (rect.x - tickSize - axisLineSize) : (rect.x + tickSize + axisLineSize + scrollBarHeight);\n var length = axis.visibleLabels.length;\n var chart = this.chart;\n if (axis.valueType.indexOf('Category') && axis.labelPlacement === 'BetweenTicks' && length > 0) {\n length += 1;\n }\n var minorGridLines = axis.minorGridLines;\n var minorTickLines = axis.minorTickLines;\n //Gridlines\n for (var i = 0; i < length; i++) {\n tempInterval = !axis.visibleLabels[i] ? (axis.visibleLabels[i - 1].value + axis.visibleRange.interval) - ticksbwtLabel\n : axis.visibleLabels[i].value - ticksbwtLabel;\n pointY = valueToCoefficient(tempInterval, axis) * rect.height;\n pointY = (pointY * -1) + (rect.y + rect.height);\n if (pointY >= rect.y && (rect.y + rect.height) >= pointY) {\n if ((inside(tempInterval, axis.visibleRange)) || this.isBorder(axis, i, pointY)) {\n majorGrid = 'M ' + this.seriesClipRect.x + ' ' + (pointY) +\n ' L ' + (this.seriesClipRect.x + this.seriesClipRect.width) + ' ' + pointY;\n this.renderGridLine(axis, index, majorGrid, axis.majorGridLines, '_MajorGridLine_', i, this.element, chart.themeStyle.majorGridLine, axis.majorGridLines.dashArray);\n }\n majorTick = 'M ' + (rect.x + axisLineSize + (isTickInside ? scrollBarHeight : 0)) + ' ' + pointY +\n ' L ' + (ticks) + ' ' + pointY;\n this.renderGridLine(axis, index, majorTick, axis.majorTickLines, '_MajorTickLine_', i, parent, chart.themeStyle.majorTickLine);\n if ((minorGridLines.width > 0 || minorTickLines.width > 0) && axis.minorTicksPerInterval > 0) {\n minorGridDirection = this.drawAxisMinorLine(axis, tempInterval, rect, i);\n this.renderGridLine(axis, index, minorGridDirection[0], minorGridLines, '_MinorGridLine_', i, this.element, chart.themeStyle.minorGridLine, minorGridLines.dashArray);\n this.renderGridLine(axis, index, minorGridDirection[1], minorTickLines, '_MinorTickLine_', i, parent, chart.themeStyle.minorTickLine);\n }\n }\n }\n };\n /**\n * To check the border of the axis\n * @param axis\n * @param index\n * @param value\n */\n CartesianAxisLayoutPanel.prototype.isBorder = function (axis, index, value) {\n var chart = this.chart;\n var border = chart.chartArea.border;\n var rect = this.seriesClipRect;\n var orientation = axis.orientation;\n var start = (orientation === 'Horizontal') ? rect.x : rect.y;\n var size = (orientation === 'Horizontal') ? rect.width : rect.height;\n var startIndex = (orientation === 'Horizontal') ? 0 : axis.visibleLabels.length - 1;\n var endIndex = (orientation === 'Horizontal') ? axis.visibleLabels.length - 1 : 0;\n if (axis.plotOffset > 0) {\n return true;\n }\n else if ((value === start || value === (start + size)) && (border.width <= 0 || border.color === 'transparent')) {\n return true;\n }\n else if ((value !== start && index === startIndex) || (value !== (start + size) && index === endIndex)) {\n return true;\n }\n return false;\n };\n /**\n * To render the yAxis label\n * @param axis\n * @param index\n * @param parent\n * @param rect\n * @private\n */\n CartesianAxisLayoutPanel.prototype.drawYAxisLabels = function (axis, index, parent, rect) {\n var chart = this.chart;\n var pointX = 0;\n var pointY = 0;\n var elementSize;\n var options;\n var isLabelInside = axis.labelPosition === 'Inside';\n var isOpposed = axis.opposedPosition;\n var tickSpace = axis.labelPosition === axis.tickPosition ? axis.majorTickLines.height : 0;\n var padding = tickSpace + this.padding + axis.lineStyle.width / 2;\n padding = (axis.opposedPosition) ? padding : -padding;\n var anchor = ((isOpposed && isLabelInside) || (!isOpposed && !isLabelInside)) ? 'end' : 'start';\n var labelElement = chart.renderer.createGroup({ id: chart.element.id + 'AxisLabels' + index });\n var scrollBarHeight = isNullOrUndefined(axis.crossesAt) ? axis.scrollBarHeight * (isOpposed ? 1 : -1) : 0;\n for (var i = 0, len = axis.visibleLabels.length; i < len; i++) {\n pointX = isLabelInside ? (rect.x - padding) : (rect.x + padding + scrollBarHeight);\n elementSize = axis.visibleLabels[i].size;\n pointY = (valueToCoefficient(axis.visibleLabels[i].value, axis) * rect.height) + (chart.stockChart ? 7 : 0);\n pointY = Math.floor((pointY * -1) + (rect.y + rect.height));\n if (typeof axis.visibleLabels[i].text !== 'string') {\n if (axis.isInversed) {\n pointY = i === 0 ? pointY + 5 : (i === axis.visibleLabels.length - 1 ? pointY - 5 : pointY);\n }\n else {\n pointY = i === 0 ? pointY - 5 : pointY - (elementSize.height / 4);\n }\n }\n else {\n pointY = pointY + (elementSize.height / 4);\n }\n options = new TextOption(chart.element.id + index + '_AxisLabel_' + i, pointX, pointY, anchor, axis.visibleLabels[i].text);\n if (axis.edgeLabelPlacement) {\n switch (axis.edgeLabelPlacement) {\n case 'None':\n break;\n case 'Hide':\n if (((i === 0 || (axis.isInversed && i === len - 1)) && options.y > rect.y + rect.height) ||\n (((i === len - 1) || (axis.isInversed && i === 0)) && options.y - elementSize.height / 2 < rect.y)) {\n options.text = '';\n }\n break;\n case 'Shift':\n if ((i === 0 || (axis.isInversed && i === len - 1)) && options.y > rect.y + rect.height) {\n options.y = pointY = rect.y + rect.height;\n }\n else if (((i === len - 1) || (axis.isInversed && i === 0)) && (options.y - elementSize.height / 2 < rect.y)) {\n options.y = pointY = rect.y + elementSize.height / 2;\n }\n break;\n }\n }\n textElement(options, axis.labelStyle, axis.labelStyle.color || chart.themeStyle.axisLabel, labelElement, false, chart.redraw, true, true).setAttribute('text-content', options.text);\n }\n if (!chart.delayRedraw) {\n appendChildElement(parent, labelElement, chart.redraw);\n }\n else if (axis.visible) {\n this.createZoomingLabel(this.chart, labelElement, axis, index, rect);\n }\n };\n /**\n * To render the yAxis label border.\n * @param axis\n * @param index\n * @param parent\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.drawYAxisBorder = function (axis, index, parent, rect) {\n if (axis.border.width > 0) {\n var startY = void 0;\n var pointY = void 0;\n var scrollBarHeight = axis.labelPosition === 'Outside' ? axis.scrollBarHeight : 0;\n scrollBarHeight = (axis.opposedPosition ? 1 : -1) * scrollBarHeight;\n var gap = (rect.height / axis.visibleRange.delta) * (axis.valueType === 'DateTime' ? axis.dateTimeInterval\n : axis.visibleRange.interval);\n var endY = void 0;\n var length_1 = axis.maxLabelSize.width + 10 + ((axis.tickPosition === axis.labelPosition) ?\n axis.majorTickLines.height : 0);\n var labelBorder = '';\n var ticksbwtLabel = (axis.valueType === 'Category' && axis.labelPlacement === 'BetweenTicks') ? -0.5 : 0;\n var endX = ((axis.opposedPosition && axis.labelPosition === 'Inside') || (!axis.opposedPosition\n && axis.labelPosition === 'Outside')) ? rect.x - length_1 + scrollBarHeight : rect.x + length_1 + scrollBarHeight;\n for (var i = 0; i < axis.visibleLabels.length; i++) {\n pointY = valueToCoefficient(axis.visibleLabels[i].value + ticksbwtLabel, axis);\n pointY = (axis.isInversed ? (1 - pointY) : pointY) * rect.height;\n if (axis.valueType === 'Category' && axis.labelPlacement === 'BetweenTicks') {\n startY = Math.floor((pointY * -1) + (rect.y + rect.height));\n endY = Math.floor((pointY * -1) - (gap) + (rect.y + rect.height));\n }\n else {\n startY = Math.floor((pointY * -1) + gap / 2 + (rect.y + rect.height));\n endY = Math.floor((pointY * -1) - gap / 2 + (rect.y + rect.height));\n }\n switch (axis.border.type) {\n case 'Rectangle':\n case 'WithoutTopBorder':\n if (startY > (rect.y + rect.height)) {\n labelBorder += ('M' + ' ' + endX + ' ' + (rect.y + rect.height) + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ');\n }\n else if (Math.floor(rect.y) > (endY)) {\n labelBorder += ('M' + ' ' + (rect.x + scrollBarHeight) + ' ' + startY + ' ' + 'L' + ' ' + endX\n + ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + (rect.y) + ' ');\n }\n else {\n labelBorder += ('M' + ' ' + (rect.x + scrollBarHeight) + ' ' + startY + ' ' + 'L' + ' ' + endX +\n ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ');\n if (i === axis.visibleLabels.length - 1) {\n labelBorder += ('M' + ' ' + (rect.x + scrollBarHeight) + ' ' + endY + ' ' + 'L' + ' ' +\n endX + ' ' + endY + ' ');\n }\n }\n break;\n case 'WithoutTopandBottomBorder':\n if (!(startY > rect.y + rect.height) && !((endY) < Math.floor(rect.y))) {\n labelBorder += ('M' + ' ' + (rect.x + scrollBarHeight) + ' ' + startY + ' ' + 'L' + ' ' + endX +\n ' ' + startY + ' ' + 'M' + ' ' + endX + ' ' + endY + ' ' +\n 'L' + ' ' + (rect.x + scrollBarHeight) + ' ' + endY);\n }\n break;\n }\n }\n labelBorder += (axis.border.type === 'Rectangle') ? ('M' + ' ' + (rect.x + scrollBarHeight) + ' ' + rect.y + ' ' + 'L' + ' ' +\n (rect.x + scrollBarHeight) + ' ' + (rect.y + rect.height) + ' ') : '';\n if (labelBorder !== '') {\n this.createAxisBorderElement(axis, index, labelBorder, parent);\n }\n }\n if (axis.multiLevelLabels.length > 0 && this.chart.multiLevelLabelModule) {\n this.chart.multiLevelLabelModule.renderYAxisMultiLevelLabels(axis, index, parent, rect);\n }\n };\n /**\n * To render the yAxis title\n * @param axis\n * @param index\n * @param parent\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.drawYAxisTitle = function (axis, index, parent, rect) {\n var chart = this.chart;\n var labelRotation = (axis.opposedPosition) ? 90 : -90;\n var elementSize = measureText(axis.title, axis.titleStyle);\n var padding = (axis.tickPosition === 'Inside' ? 0 : axis.majorTickLines.height + this.padding) +\n (axis.labelPosition === 'Inside' ? 0 :\n (axis.maxLabelSize.width + axis.multiLevelLabelHeight + this.padding));\n padding = axis.opposedPosition ? padding + axis.scrollBarHeight : -padding - axis.scrollBarHeight;\n var x = rect.x + padding;\n var y = rect.y + rect.height / 2;\n var options = new TextOption(chart.element.id + '_AxisTitle_' + index, x, y - this.padding, 'middle', axis.title, 'rotate(' + labelRotation + ',' + (x) + ',' + (y) + ')');\n var element = textElement(options, axis.titleStyle, axis.titleStyle.color || chart.themeStyle.axisTitle, parent);\n element.setAttribute('tabindex', axis.tabIndex.toString());\n element.setAttribute('aria-label', axis.description || axis.title);\n };\n /**\n * xAxis grid line calculation performed here\n * @param axis\n * @param index\n * @param parent\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.drawXAxisGridLine = function (axis, index, parent, rect) {\n var tempInterval;\n var pointX = 0;\n var majorGrid = '';\n var majorTick = '';\n var minorDirection;\n var tickSize = (axis.opposedPosition) ? -axis.majorTickLines.height : axis.majorTickLines.height;\n var axisLineSize = (axis.opposedPosition) ? -axis.lineStyle.width / 2 : axis.lineStyle.width / 2;\n var scrollBarHeight = isNullOrUndefined(axis.crossesAt) ? axis.opposedPosition ? -axis.scrollBarHeight :\n axis.scrollBarHeight : 0;\n var ticksbwtLabel = (axis.valueType.indexOf('Category') > -1 && axis.labelPlacement === 'BetweenTicks') ?\n 0.5 : 0;\n var length = axis.visibleLabels.length;\n var isTickInside = axis.tickPosition === 'Inside';\n var ticks = isTickInside ? (rect.y - tickSize - axisLineSize) : (rect.y + tickSize + axisLineSize + scrollBarHeight);\n var chart = this.chart;\n if (axis.valueType.indexOf('Category') > -1 && length > 0 && axis.labelPlacement === 'BetweenTicks') {\n length += 1;\n }\n //Gridlines\n for (var i = 0; i < length; i++) {\n if (axis.valueType !== 'DateTimeCategory') {\n tempInterval = axis.visibleLabels[i] ? axis.visibleLabels[i].value - ticksbwtLabel\n : (axis.visibleLabels[i - 1].value + axis.visibleRange.interval) - ticksbwtLabel;\n }\n else {\n tempInterval = axis.visibleLabels[i] ?\n axis.visibleLabels[i].value - ticksbwtLabel : axis.visibleRange.max;\n }\n pointX = (valueToCoefficient(tempInterval, axis) * rect.width) + rect.x;\n if (pointX >= rect.x && (rect.x + rect.width) >= pointX) {\n if (inside(tempInterval, axis.visibleRange) || this.isBorder(axis, i, pointX)) {\n majorGrid = 'M ' + pointX + ' ' + (this.seriesClipRect.y + this.seriesClipRect.height) +\n ' L ' + pointX + ' ' + this.seriesClipRect.y;\n this.renderGridLine(axis, index, majorGrid, axis.majorGridLines, '_MajorGridLine_', i, this.element, chart.themeStyle.majorGridLine, axis.majorGridLines.dashArray);\n }\n majorTick = 'M ' + (pointX) + ' ' + (rect.y + axisLineSize + (isTickInside ? scrollBarHeight : 0))\n + ' L ' + (pointX) + ' ' + ticks;\n this.renderGridLine(axis, index, majorTick, axis.majorTickLines, '_MajorTickLine_', i, parent, chart.themeStyle.majorTickLine);\n if (axis.minorTicksPerInterval > 0 && (axis.minorGridLines.width > 0 || axis.minorTickLines.width > 0)) {\n minorDirection = this.drawAxisMinorLine(axis, tempInterval, rect, i);\n this.renderGridLine(axis, index, minorDirection[0], axis.minorGridLines, '_MinorGridLine_', i, this.element, chart.themeStyle.minorGridLine, axis.minorGridLines.dashArray);\n this.renderGridLine(axis, index, minorDirection[1], axis.minorTickLines, '_MinorTickLine_', i, parent, chart.themeStyle.minorTickLine);\n }\n }\n }\n };\n /**\n * To calcualte the axis minor line\n * @param axis\n * @param tempInterval\n * @param rect\n * @param labelIndex\n */\n CartesianAxisLayoutPanel.prototype.drawAxisMinorLine = function (axis, tempInterval, rect, labelIndex) {\n var value = tempInterval;\n var coor = 0;\n var position = 0;\n var range = axis.visibleRange;\n var isTickInside = axis.tickPosition === 'Inside';\n var direction = [];\n var tickSize = axis.opposedPosition ? -axis.minorTickLines.height : axis.minorTickLines.height;\n var logStart;\n var logEnd;\n var logInterval = 1;\n var logPosition = 1;\n var ticksX = isTickInside ? (rect.y - tickSize) : (rect.y + tickSize);\n var ticksY = isTickInside ? (rect.x + tickSize) : (rect.x - tickSize);\n var minorGird = '';\n var minorTick = '';\n if (axis.valueType === 'Logarithmic') {\n logStart = Math.pow(axis.logBase, value - range.interval);\n logEnd = Math.pow(axis.logBase, value);\n logInterval = (logEnd - logStart) / (axis.minorTicksPerInterval + 1);\n logPosition = logStart + logInterval;\n }\n if (axis.orientation === 'Horizontal') {\n for (var j = 0; j < axis.minorTicksPerInterval; j++) {\n value = this.findLogNumeric(axis, logPosition, logInterval, value, labelIndex);\n logPosition += logInterval;\n if (inside(value, range)) {\n position = ((value - range.min) / (range.max - range.min));\n position = Math.ceil((axis.isInversed ? (1 - position) : position) * rect.width);\n coor = (Math.floor(position + rect.x));\n minorGird = minorGird.concat('M' + ' ' + coor + ' ' + (this.seriesClipRect.y)\n + 'L ' + coor + ' ' + (this.seriesClipRect.y + this.seriesClipRect.height));\n coor = (Math.floor(position + rect.x));\n minorTick = minorTick.concat('M' + ' ' + coor + ' ' + (rect.y)\n + 'L ' + coor + ' ' + (ticksX + axis.scrollBarHeight));\n }\n }\n }\n else {\n tickSize = axis.opposedPosition ? axis.minorTickLines.height : -axis.minorTickLines.height;\n for (var j = 0; j < axis.minorTicksPerInterval; j++) {\n value = this.findLogNumeric(axis, logPosition, logInterval, value, labelIndex);\n if (inside(value, range)) {\n position = Math.ceil(((value - range.min) / (range.max - range.min)) * rect.height) * -1;\n coor = (Math.floor(position + rect.y + rect.height));\n minorGird = minorGird.concat('M' + ' ' + (this.seriesClipRect.x) + ' ' + coor\n + 'L ' + (this.seriesClipRect.x + this.seriesClipRect.width) + ' ' + coor + ' ');\n coor = (Math.floor(position + rect.y + rect.height));\n minorTick = minorTick.concat('M' + ' ' + rect.x + ' ' + coor + 'L ' + (ticksY - axis.scrollBarHeight) +\n ' ' + coor + ' ');\n }\n logPosition += logInterval;\n }\n }\n direction.push(minorGird);\n direction.push(minorTick);\n return direction;\n };\n /**\n * To find the numeric value of the log\n * @param axis\n * @param logPosition\n * @param logInterval\n * @param value\n * @param labelIndex\n */\n CartesianAxisLayoutPanel.prototype.findLogNumeric = function (axis, logPosition, logInterval, value, labelIndex) {\n var range = axis.visibleRange;\n if (axis.valueType === 'Logarithmic') {\n value = logBase(logPosition, axis.logBase);\n }\n else if (axis.valueType === 'DateTime') {\n value += axis.dateTimeInterval / (axis.minorTicksPerInterval + 1);\n }\n else if (axis.valueType === 'DateTimeCategory') {\n var padding = axis.labelPlacement === 'BetweenTicks' ? 0.5 : 0;\n value += ((axis.visibleLabels[labelIndex + 1] ?\n axis.visibleLabels[labelIndex + 1].value - padding : axis.visibleRange.max) -\n (axis.visibleLabels[labelIndex] ?\n axis.visibleLabels[labelIndex].value - padding : axis.visibleRange.min)) /\n (axis.minorTicksPerInterval + 1);\n }\n else {\n value += range.interval / (axis.minorTicksPerInterval + 1);\n }\n return value;\n };\n /**\n * To render the xAxis Labels\n * @param axis\n * @param index\n * @param parent\n * @param rect\n * @private\n */\n CartesianAxisLayoutPanel.prototype.drawXAxisLabels = function (axis, index, parent, rect) {\n var chart = this.chart;\n var pointX = 0;\n var pointY = 0;\n var elementSize;\n var labelPadding;\n var xValue = 0;\n var labelElement = chart.renderer.createGroup({ id: chart.element.id + 'AxisLabels' + index });\n var islabelInside = axis.labelPosition === 'Inside';\n var isOpposed = axis.opposedPosition;\n var tickSpace = axis.labelPosition === axis.tickPosition ? axis.majorTickLines.height : 0;\n var padding = tickSpace + this.padding + axis.lineStyle.width / 2;\n var rotateSize;\n var diffHeight;\n var angle = axis.angle % 360;\n var anglePadding = ((angle === 90 || angle === -90)) ? -2 : 0;\n var options;\n var yLocation;\n var previousEnd = axis.isInversed ? (rect.x + rect.width) : rect.x;\n var width = 0;\n var length = axis.visibleLabels.length;\n var intervalLength;\n var label;\n var breakLabels;\n var scrollBarHeight = axis.scrollbarSettings.enable || (!islabelInside && isNullOrUndefined(axis.crossesAt)\n && (axis.zoomFactor < 1 || axis.zoomPosition > 0)) ? axis.scrollBarHeight : 0;\n for (var i = 0, len = length; i < len; i++) {\n label = axis.visibleLabels[i];\n breakLabels = label.originalText;\n pointX = xValue = (valueToCoefficient(label.value, axis) * rect.width) + rect.x;\n if (breakLabels.indexOf('
') !== -1) {\n elementSize = measureText(breakLabels.replace(/
/g, ' '), axis.labelStyle);\n }\n else {\n elementSize = label.size;\n }\n intervalLength = rect.width / length;\n width = ((axis.labelIntersectAction === 'Trim' || axis.labelIntersectAction === 'Wrap') && angle === 0\n && elementSize.width > intervalLength) ? intervalLength : elementSize.width;\n if (breakLabels.indexOf('
') !== -1 && label.breakLabelSize.width < axis.maxLabelSize.width) {\n pointX -= label.breakLabelSize.width / 2;\n }\n else {\n pointX -= width / 2;\n }\n pointX = axis.enableTrim && breakLabels.indexOf('
') !== -1 ? (xValue - (label.breakLabelSize.height / 4)) : pointX;\n if (islabelInside && angle) {\n pointY = isOpposed ? (rect.y + padding) : (rect.y - padding);\n }\n else {\n labelPadding = ((isOpposed && !islabelInside) || (!isOpposed && islabelInside)) ?\n -(padding + scrollBarHeight + (angle ? ((elementSize.height / 2) + (2 * axis.maxLabelSize.height / 5)) :\n (label.index > 1 ? (2 * (elementSize.height / 4)) : 0))) :\n padding + scrollBarHeight + (angle ? (axis.maxLabelSize.height / 2) : (3 * (elementSize.height / 4)));\n pointY = (rect.y + (labelPadding * label.index));\n }\n options = new TextOption(chart.element.id + index + '_AxisLabel_' + i, pointX, pointY, '');\n if (axis.edgeLabelPlacement) {\n switch (axis.edgeLabelPlacement) {\n case 'None':\n break;\n case 'Hide':\n if (((i === 0 || (axis.isInversed && i === len - 1)) && options.x < rect.x) ||\n ((i === len - 1 || (axis.isInversed && i === 0)) && (options.x + width > rect.x + rect.width))) {\n continue;\n }\n break;\n case 'Shift':\n if ((i === 0 || (axis.isInversed && i === len - 1)) && options.x < rect.x) {\n intervalLength -= (rect.x - options.x);\n options.x = pointX = rect.x;\n }\n else if ((i === len - 1 || (axis.isInversed && i === 0)) && ((options.x + width) > rect.x + rect.width)) {\n if (elementSize.width > intervalLength && axis.labelIntersectAction === 'Trim') {\n intervalLength -= (options.x + width - (rect.x + rect.width));\n }\n else {\n intervalLength = width;\n }\n options.x = pointX = rect.x + rect.width - intervalLength;\n }\n break;\n }\n }\n options.text = this.getLabelText(breakLabels, label, axis, intervalLength);\n if (angle === 0 && axis.labelIntersectAction === 'Hide' && i !== 0 &&\n (!axis.isInversed ? options.x <= previousEnd : options.x + width >= previousEnd)) {\n continue;\n }\n previousEnd = axis.isInversed ? options.x : options.x + width;\n if (angle !== 0) {\n rotateSize = rotateTextSize(axis.labelStyle, label.text, angle, chart);\n diffHeight = islabelInside ? rotateSize.height :\n axis.maxLabelSize.height - Math.ceil(rotateSize.height);\n yLocation = axis.opposedPosition ? diffHeight / 2 : -diffHeight / 2;\n options.transform = 'rotate(' + angle + ',' + (pointX + width / 2 + anglePadding) + ','\n + (pointY + yLocation) + ')';\n options.y += yLocation;\n }\n textElement(options, label.labelStyle, label.labelStyle.color || chart.themeStyle.axisLabel, labelElement, (axis.opposedPosition !== (axis.labelPosition === 'Inside')), chart.redraw, true).setAttribute('style', 'cursor: default');\n }\n if (!chart.delayRedraw) {\n parent.appendChild(labelElement);\n }\n else if (axis.visible) {\n this.createZoomingLabel(this.chart, labelElement, axis, index, rect);\n }\n };\n /**\n * To get axis label text\n * @param breakLabels\n * @param label\n * @param axis\n * @param intervalLength\n */\n CartesianAxisLayoutPanel.prototype.getLabelText = function (breakLabels, label, axis, intervalLength) {\n if (breakLabels.indexOf('
') !== -1) {\n var result1 = [];\n var str = void 0;\n var labelArray = breakLabels.split('
');\n if (axis.enableTrim) {\n for (var index = 0; index < labelArray.length; index++) {\n str = textTrim(axis.maximumLabelWidth, labelArray[index], axis.labelStyle);\n result1.push(str);\n }\n return result1;\n }\n else {\n for (var index = 0; index < label.text.length; index++) {\n str = this.findAxisLabel(axis, label.text[index], intervalLength);\n result1.push(str);\n }\n return result1;\n }\n }\n else {\n return this.findAxisLabel(axis, label.text, intervalLength);\n }\n };\n /**\n * To render the x-axis label border.\n * @param axis\n * @param index\n * @param parent\n * @param axisRect\n */\n CartesianAxisLayoutPanel.prototype.drawXAxisBorder = function (axis, index, parent, axisRect) {\n if (axis.border.width > 0) {\n var scrollBarHeight = axis.labelPosition === 'Outside' ? axis.scrollBarHeight : 0;\n var startX = void 0;\n var startY = axisRect.y + ((axis.opposedPosition ? -1 : 1) * scrollBarHeight);\n var padding = 10;\n var pointX = void 0;\n var gap = (axisRect.width / axis.visibleRange.delta) * (axis.valueType === 'DateTime' ? axis.dateTimeInterval\n : axis.visibleRange.interval);\n var endX = void 0;\n var length_2 = axis.maxLabelSize.height +\n ((axis.tickPosition === axis.labelPosition) ? axis.majorTickLines.height : 0);\n var labelBorder = '';\n var ticksbwtLabel = (axis.valueType === 'Category' && axis.labelPlacement === 'BetweenTicks') ? -0.5 : 0;\n var endY = ((axis.opposedPosition && axis.labelPosition === 'Inside') ||\n (!axis.opposedPosition && axis.labelPosition === 'Outside')) ?\n (axisRect.y + length_2 + padding + scrollBarHeight) : (axisRect.y - length_2 - padding - scrollBarHeight);\n for (var i = 0; i < axis.visibleLabels.length; i++) {\n pointX = valueToCoefficient(axis.visibleLabels[i].value + ticksbwtLabel, axis);\n pointX = (axis.isInversed ? (1 - pointX) : pointX) * axisRect.width;\n if (axis.valueType === 'Category' && axis.labelPlacement === 'BetweenTicks') {\n startX = pointX + axisRect.x;\n endX = pointX + (gap) + axisRect.x;\n }\n else {\n startX = pointX - gap / 2 + axisRect.x;\n endX = pointX + gap / 2 + axisRect.x;\n }\n switch (axis.border.type) {\n case 'Rectangle':\n case 'WithoutTopBorder':\n if (startX < axisRect.x) {\n labelBorder += ('M' + ' ' + axisRect.x + ' ' + endY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ');\n }\n else if (Math.floor(endX) > axisRect.width + axisRect.x) {\n labelBorder += ('M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ' +\n 'L' + ' ' + (axisRect.width + axisRect.x) + ' ' + endY + ' ');\n }\n else {\n labelBorder += ('M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' +\n endY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ');\n if (i === axis.visibleLabels.length - 1) {\n labelBorder += ('M' + ' ' + endX + ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ' +\n 'M ' + endX + ' ' + endY + ' L ' + (axisRect.width + axisRect.x) + ' ' + endY);\n }\n }\n break;\n case 'WithoutTopandBottomBorder':\n if (!(startX < axisRect.x) && !(Math.floor(endX) > axisRect.width + axisRect.x)) {\n labelBorder += ('M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ' +\n 'M ' + endX + ' ' + startY + ' L ' + endX + ' ' + endY);\n }\n break;\n }\n }\n labelBorder += (axis.border.type === 'Rectangle' ? ('M ' + ' ' + axisRect.x + ' ' + startY + 'L' + ' ' +\n (axisRect.x + axisRect.width) + ' ' + startY) : '');\n if (labelBorder !== '') {\n this.createAxisBorderElement(axis, index, labelBorder, parent);\n }\n }\n if (this.chart.multiLevelLabelModule && axis.multiLevelLabels.length > 0) {\n this.chart.multiLevelLabelModule.renderXAxisMultiLevelLabels(axis, index, parent, axisRect);\n }\n };\n /**\n * To create border element of the axis\n * @param axis\n * @param index\n * @param labelBorder\n * @param parent\n */\n CartesianAxisLayoutPanel.prototype.createAxisBorderElement = function (axis, index, labelBorder, parent) {\n var element = getElement(this.chart.element.id + '_BorderLine_' + index);\n var direction = element ? element.getAttribute('d') : '';\n var borderElement = this.chart.renderer.drawPath(new PathOption(this.chart.element.id + '_BorderLine_' + index, 'transparent', axis.border.width, axis.border.color || this.chart.themeStyle.axisLine, 1, '', labelBorder));\n borderElement.setAttribute('style', 'pointer-events: none');\n appendChildElement(parent, borderElement, this.chart.redraw, true, 'x', 'y', null, direction, true);\n };\n /**\n * To find the axis label of the intersect action\n * @param axis\n * @param label\n * @param width\n */\n CartesianAxisLayoutPanel.prototype.findAxisLabel = function (axis, label, width) {\n switch (axis.labelIntersectAction) {\n case 'Trim':\n return (axis.angle === 0 && !axis.enableTrim) ? textTrim(width, label, axis.labelStyle) : label;\n default:\n return label;\n }\n };\n /**\n * X-Axis Title function performed\n * @param axis\n * @param index\n * @param parent\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.drawXAxisTitle = function (axis, index, parent, rect) {\n var chart = this.chart;\n var elementSize = measureText(axis.title, axis.titleStyle);\n var scrollBarHeight = isNullOrUndefined(axis.crossesAt) ? axis.scrollBarHeight : 0;\n var padding = (axis.tickPosition === 'Inside' ? 0 : axis.majorTickLines.height + this.padding) +\n (axis.labelPosition === 'Inside' ? 0 :\n axis.maxLabelSize.height + axis.multiLevelLabelHeight + this.padding);\n padding = axis.opposedPosition ? -(padding + elementSize.height / 4 + scrollBarHeight) : (padding + (3 *\n elementSize.height / 4) + scrollBarHeight);\n var options = new TextOption(chart.element.id + '_AxisTitle_' + index, rect.x + rect.width / 2, rect.y + padding, 'middle', axis.title);\n var element = textElement(options, axis.titleStyle, axis.titleStyle.color || chart.themeStyle.axisTitle, parent);\n element.setAttribute('aria-label', axis.description || axis.title);\n element.setAttribute('tabindex', axis.tabIndex.toString());\n };\n /**\n * To render the axis grid and tick lines(Both Major and Minor)\n * @param axis\n * @param index\n * @param gridDirection\n * @param gridModel\n * @param gridId\n * @param gridIndex\n * @param parent\n * @param themeColor\n * @param dashArray\n */\n CartesianAxisLayoutPanel.prototype.renderGridLine = function (axis, index, gridDirection, gridModel, gridId, gridIndex, parent, themeColor, dashArray) {\n if (dashArray === void 0) { dashArray = null; }\n var options;\n var chart = this.chart;\n var direction;\n var element;\n if (gridModel.width > 0 && axis.visible && gridDirection) {\n element = getElement(chart.element.id + gridId + index + '_' + gridIndex);\n direction = element ? element.getAttribute('d') : null;\n this.htmlObject = chart.renderer.drawPath(new PathOption(chart.element.id + gridId + index + '_' + gridIndex, 'transparent', gridModel.width, gridModel.color || themeColor, null, dashArray, gridDirection));\n appendChildElement(parent, this.htmlObject, chart.redraw, true, 'x', 'y', null, direction, true);\n }\n };\n /**\n * To Find the parent node of the axis\n * @param chart\n * @param label\n * @param axis\n * @param index\n */\n CartesianAxisLayoutPanel.prototype.findParentNode = function (chart, label, axis, index) {\n if (axis.crossAt === null) {\n return document.getElementById(chart.element.id + 'AxisGroup' + index + 'Inside');\n }\n if (document.getElementById(chart.element.id + 'AxisGroup' + index + 'Inside').contains(document.getElementById(label.id))) {\n return document.getElementById(chart.element.id + 'AxisGroup' + index + 'Inside');\n }\n else {\n return document.getElementById(chart.element.id + 'AxisGroup' + index + 'Outside');\n }\n };\n /**\n * Create Zooming Labels Function Called here\n * @param chart\n * @param labelElement\n * @param axis\n * @param index\n * @param rect\n */\n CartesianAxisLayoutPanel.prototype.createZoomingLabel = function (chart, labelElement, axis, index, rect) {\n var parentNode = this.findParentNode(chart, labelElement, axis, index);\n labelElement.setAttribute('opacity', '0.3');\n var zoomElement = chart.renderer.createGroup({\n id: chart.element.id + 'AxisLabels_Zoom' + index\n });\n zoomElement = createZoomingLabels(chart, axis, zoomElement, index, axis.orientation === 'Vertical', rect);\n parentNode.replaceChild(labelElement, document.getElementById(labelElement.id));\n if (getElement(chart.element.id + 'AxisLabels_Zoom' + index)) {\n parentNode.replaceChild(zoomElement, document.getElementById(zoomElement.id));\n }\n else {\n parentNode.appendChild(zoomElement);\n }\n };\n return CartesianAxisLayoutPanel;\n}());\nexport { CartesianAxisLayoutPanel };\n","import { withInBounds, PointData, getValueXByPoint, getValueYByPoint } from '../../common/utils/helper';\nimport { Rect } from '@syncfusion/ej2-svg-base';\n/**\n * To get the data on mouse move.\n * @private\n */\nvar ChartData = /** @class */ (function () {\n /**\n * Constructor for the data.\n * @private\n */\n function ChartData(chart) {\n /** @private */\n this.currentPoints = [];\n /** @private */\n this.previousPoints = [];\n this.chart = chart;\n this.lierIndex = 0;\n }\n /**\n * Method to get the Data.\n * @private\n */\n ChartData.prototype.getData = function () {\n var chart = this.chart;\n var point = null;\n var series = null;\n var width;\n var height;\n for (var len = chart.visibleSeries.length, i = len - 1; i >= 0; i--) {\n series = chart.visibleSeries[i];\n width = (series.type === 'Scatter' || series.drawType === 'Scatter' || (!series.isRectSeries && series.marker.visible))\n ? (series.marker.height + 5) / 2 : 0;\n height = (series.type === 'Scatter' || series.drawType === 'Scatter' || (!series.isRectSeries && series.marker.visible))\n ? (series.marker.width + 5) / 2 : 0;\n if (series.visible && withInBounds(chart.mouseX, chart.mouseY, series.clipRect, width, height)) {\n point = this.getRectPoint(series, series.clipRect, chart.mouseX, chart.mouseY);\n }\n if (point) {\n return new PointData(point, series);\n }\n }\n return new PointData(point, series);\n };\n ChartData.prototype.isSelected = function (chart) {\n return (chart.selectionMode.indexOf('Drag') > -1 && chart.selectionModule && chart.selectionModule.rectPoints !== null);\n };\n ChartData.prototype.getRectPoint = function (series, rect, x, y) {\n var currentRect;\n var fromCenterX;\n var fromCenterY;\n var clickAngle;\n var arcAngle = 0;\n var startAngle;\n var endAngle;\n var distanceFromCenter;\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n if (!point.regionData) {\n if (!point.regions || !point.regions.length) {\n continue;\n }\n }\n if (point.regionData && this.chart.chartAreaType === 'PolarRadar' && series.drawType.indexOf('Column') > -1) {\n fromCenterX = x - (series.clipRect.width / 2 + series.clipRect.x);\n fromCenterY = y - (series.clipRect.height / 2 + series.clipRect.y);\n arcAngle = 2 * Math.PI * (point.regionData.currentXPosition < 0 ? 1 + point.regionData.currentXPosition\n : point.regionData.currentXPosition);\n clickAngle = (Math.atan2(fromCenterY, fromCenterX) + 0.5 * Math.PI - arcAngle) % (2 * Math.PI);\n clickAngle = clickAngle < 0 ? 2 * Math.PI + clickAngle : clickAngle;\n clickAngle = clickAngle + 2 * Math.PI * series.chart.primaryXAxis.startAngle;\n startAngle = point.regionData.startAngle;\n startAngle -= arcAngle;\n startAngle = startAngle < 0 ? 2 * Math.PI + startAngle : startAngle;\n endAngle = point.regionData.endAngle;\n endAngle -= arcAngle;\n endAngle = endAngle < 0 ? 2 * Math.PI + endAngle : endAngle;\n distanceFromCenter = Math.sqrt(Math.pow(Math.abs(fromCenterX), 2) + Math.pow(Math.abs(fromCenterY), 2));\n if (clickAngle >= startAngle && clickAngle <= endAngle &&\n (((distanceFromCenter >= point.regionData.innerRadius && distanceFromCenter <= point.regionData.radius) ||\n (distanceFromCenter <= point.regionData.innerRadius && distanceFromCenter >= point.regionData.radius))\n && distanceFromCenter <= series.chart.radius)) {\n return point;\n }\n }\n else if (this.checkRegionContainsPoint(point.regions, rect, x, y)) {\n return point;\n }\n }\n return null;\n };\n /**\n * Checks whether the region contains a point\n */\n ChartData.prototype.checkRegionContainsPoint = function (regionRect, rect, x, y) {\n var _this = this;\n return regionRect.some(function (region, index) {\n _this.lierIndex = index;\n return withInBounds(x, y, new Rect((_this.chart.chartAreaType === 'Cartesian' ? rect.x : 0) + region.x, (_this.chart.chartAreaType === 'Cartesian' ? rect.y : 0) + region.y, region.width, region.height));\n });\n };\n /**\n * @private\n */\n ChartData.prototype.getClosest = function (series, value) {\n var xData = series.xData;\n var closest;\n if (value >= series.xMin - 0.5 && value <= series.xMax + 0.5) {\n for (var _i = 0, xData_1 = xData; _i < xData_1.length; _i++) {\n var data = xData_1[_i];\n if (closest == null || Math.abs(data - value) < Math.abs(closest - value)) {\n closest = data;\n }\n }\n }\n return closest;\n };\n ChartData.prototype.getClosestX = function (chart, series) {\n var value;\n var rect = series.clipRect;\n if (!chart.requireInvertedAxis) {\n value = getValueXByPoint(chart.mouseX - rect.x, rect.width, series.xAxis);\n }\n else {\n value = getValueYByPoint(chart.mouseY - rect.y, rect.height, series.xAxis);\n }\n var closest = this.getClosest(series, value);\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n if (closest === point.xValue && point.visible) {\n return new PointData(point, series);\n }\n }\n return null;\n };\n return ChartData;\n}());\nexport { ChartData };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty, Complex, Collection, getValue } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, extend } from '@syncfusion/ej2-base';\nimport { StackValues, RectOption, appendChildElement, appendClipElement } from '../../common/utils/helper';\nimport { firstToLowerCase, CircleOption } from '../../common/utils/helper';\nimport { Rect } from '@syncfusion/ej2-svg-base';\nimport { Border, Font, Margin, Animation, EmptyPointSettings, CornerRadius, Connector } from '../../common/model/base';\nimport { DataManager, DataUtil } from '@syncfusion/ej2-data';\nimport { seriesRender } from '../../common/model/constants';\nimport { sort } from '../../common/utils/helper';\nimport { Browser } from '@syncfusion/ej2-base';\n/**\n * Configures the data label in the series.\n */\nvar DataLabelSettings = /** @class */ (function (_super) {\n __extends(DataLabelSettings, _super);\n function DataLabelSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], DataLabelSettings.prototype, \"visible\", void 0);\n __decorate([\n Property(null)\n ], DataLabelSettings.prototype, \"name\", void 0);\n __decorate([\n Property('transparent')\n ], DataLabelSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(1)\n ], DataLabelSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property('Auto')\n ], DataLabelSettings.prototype, \"position\", void 0);\n __decorate([\n Property(5)\n ], DataLabelSettings.prototype, \"rx\", void 0);\n __decorate([\n Property(5)\n ], DataLabelSettings.prototype, \"ry\", void 0);\n __decorate([\n Property('Center')\n ], DataLabelSettings.prototype, \"alignment\", void 0);\n __decorate([\n Complex({ width: null, color: null }, Border)\n ], DataLabelSettings.prototype, \"border\", void 0);\n __decorate([\n Complex({ left: 5, right: 5, top: 5, bottom: 5 }, Margin)\n ], DataLabelSettings.prototype, \"margin\", void 0);\n __decorate([\n Complex({ size: '11px', color: '', fontStyle: 'Normal', fontWeight: 'Normal', fontFamily: 'Segoe UI' }, Font)\n ], DataLabelSettings.prototype, \"font\", void 0);\n __decorate([\n Property(null)\n ], DataLabelSettings.prototype, \"template\", void 0);\n return DataLabelSettings;\n}(ChildProperty));\nexport { DataLabelSettings };\n/**\n * Configures the marker in the series.\n */\nvar MarkerSettings = /** @class */ (function (_super) {\n __extends(MarkerSettings, _super);\n function MarkerSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], MarkerSettings.prototype, \"visible\", void 0);\n __decorate([\n Property('Circle')\n ], MarkerSettings.prototype, \"shape\", void 0);\n __decorate([\n Property('')\n ], MarkerSettings.prototype, \"imageUrl\", void 0);\n __decorate([\n Property(5)\n ], MarkerSettings.prototype, \"height\", void 0);\n __decorate([\n Property(5)\n ], MarkerSettings.prototype, \"width\", void 0);\n __decorate([\n Complex({ width: 2, color: null }, Border)\n ], MarkerSettings.prototype, \"border\", void 0);\n __decorate([\n Property(null)\n ], MarkerSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(1)\n ], MarkerSettings.prototype, \"opacity\", void 0);\n __decorate([\n Complex({}, DataLabelSettings)\n ], MarkerSettings.prototype, \"dataLabel\", void 0);\n return MarkerSettings;\n}(ChildProperty));\nexport { MarkerSettings };\n/**\n * Points model for the series.\n * @private\n */\nvar Points = /** @class */ (function () {\n function Points() {\n this.symbolLocations = null;\n this.regions = null;\n this.percentage = null;\n this.regionData = null;\n this.marker = {\n visible: false\n };\n }\n return Points;\n}());\nexport { Points };\n/**\n * Defines the behavior of the Trendlines\n */\nvar Trendline = /** @class */ (function (_super) {\n __extends(Trendline, _super);\n function Trendline() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n /** @private */\n _this.clipRect = new Rect(0, 0, 0, 0);\n return _this;\n }\n /** @private */\n Trendline.prototype.setDataSource = function (series, chart) {\n if (series) {\n this.points = series.points;\n }\n var type = firstToLowerCase(this.type);\n chart.trendLineModule.initDataSource(this, chart);\n chart.visibleSeriesCount++;\n };\n __decorate([\n Property('')\n ], Trendline.prototype, \"name\", void 0);\n __decorate([\n Property('Linear')\n ], Trendline.prototype, \"type\", void 0);\n __decorate([\n Property(2)\n ], Trendline.prototype, \"period\", void 0);\n __decorate([\n Property(2)\n ], Trendline.prototype, \"polynomialOrder\", void 0);\n __decorate([\n Property(0)\n ], Trendline.prototype, \"backwardForecast\", void 0);\n __decorate([\n Property(0)\n ], Trendline.prototype, \"forwardForecast\", void 0);\n __decorate([\n Complex({}, Animation)\n ], Trendline.prototype, \"animation\", void 0);\n __decorate([\n Complex({}, MarkerSettings)\n ], Trendline.prototype, \"marker\", void 0);\n __decorate([\n Property(true)\n ], Trendline.prototype, \"enableTooltip\", void 0);\n __decorate([\n Property(null)\n ], Trendline.prototype, \"intercept\", void 0);\n __decorate([\n Property('')\n ], Trendline.prototype, \"fill\", void 0);\n __decorate([\n Property(1)\n ], Trendline.prototype, \"width\", void 0);\n __decorate([\n Property('SeriesType')\n ], Trendline.prototype, \"legendShape\", void 0);\n return Trendline;\n}(ChildProperty));\nexport { Trendline };\n/**\n * Configures Error bar in series.\n */\nvar ErrorBarCapSettings = /** @class */ (function (_super) {\n __extends(ErrorBarCapSettings, _super);\n function ErrorBarCapSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(1)\n ], ErrorBarCapSettings.prototype, \"width\", void 0);\n __decorate([\n Property(10)\n ], ErrorBarCapSettings.prototype, \"length\", void 0);\n __decorate([\n Property(null)\n ], ErrorBarCapSettings.prototype, \"color\", void 0);\n __decorate([\n Property(1)\n ], ErrorBarCapSettings.prototype, \"opacity\", void 0);\n return ErrorBarCapSettings;\n}(ChildProperty));\nexport { ErrorBarCapSettings };\nvar ChartSegment = /** @class */ (function (_super) {\n __extends(ChartSegment, _super);\n function ChartSegment() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], ChartSegment.prototype, \"value\", void 0);\n __decorate([\n Property(null)\n ], ChartSegment.prototype, \"color\", void 0);\n __decorate([\n Property('0')\n ], ChartSegment.prototype, \"dashArray\", void 0);\n return ChartSegment;\n}(ChildProperty));\nexport { ChartSegment };\nvar ErrorBarSettings = /** @class */ (function (_super) {\n __extends(ErrorBarSettings, _super);\n function ErrorBarSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], ErrorBarSettings.prototype, \"visible\", void 0);\n __decorate([\n Property('Fixed')\n ], ErrorBarSettings.prototype, \"type\", void 0);\n __decorate([\n Property('Both')\n ], ErrorBarSettings.prototype, \"direction\", void 0);\n __decorate([\n Property('Vertical')\n ], ErrorBarSettings.prototype, \"mode\", void 0);\n __decorate([\n Property(null)\n ], ErrorBarSettings.prototype, \"color\", void 0);\n __decorate([\n Property(1)\n ], ErrorBarSettings.prototype, \"verticalError\", void 0);\n __decorate([\n Property(1)\n ], ErrorBarSettings.prototype, \"width\", void 0);\n __decorate([\n Property(1)\n ], ErrorBarSettings.prototype, \"horizontalError\", void 0);\n __decorate([\n Property(3)\n ], ErrorBarSettings.prototype, \"verticalPositiveError\", void 0);\n __decorate([\n Property(3)\n ], ErrorBarSettings.prototype, \"verticalNegativeError\", void 0);\n __decorate([\n Property(1)\n ], ErrorBarSettings.prototype, \"horizontalPositiveError\", void 0);\n __decorate([\n Property(1)\n ], ErrorBarSettings.prototype, \"horizontalNegativeError\", void 0);\n __decorate([\n Complex(null, ErrorBarCapSettings)\n ], ErrorBarSettings.prototype, \"errorBarCap\", void 0);\n return ErrorBarSettings;\n}(ChildProperty));\nexport { ErrorBarSettings };\n/**\n * Defines the common behavior of Series and Technical Indicators\n */\nvar SeriesBase = /** @class */ (function (_super) {\n __extends(SeriesBase, _super);\n function SeriesBase() {\n /**\n * The DataSource field that contains the x value.\n * It is applicable for series and technical indicators\n * @default ''\n */\n var _this = _super !== null && _super.apply(this, arguments) || this;\n /** @private */\n _this.currentViewData = [];\n /** @private */\n _this.clipRect = new Rect(0, 0, 0, 0);\n /** @private */\n _this.seriesType = 'XY';\n return _this;\n }\n /**\n * Process data for the series.\n * @hidden\n */\n SeriesBase.prototype.processJsonData = function () {\n var i = 0;\n var point = new Points();\n var xName = (this instanceof Series && this.type === 'Histogram') ? 'x' : this.xName;\n var textMappingName = this instanceof Series && this.marker.dataLabel.name ?\n this.marker.dataLabel.name : '';\n if (this instanceof Series) {\n if ((this.type === 'Waterfall' || this.type === 'Histogram')) {\n this.currentViewData = this.chart[firstToLowerCase(this.type) + 'SeriesModule'].\n processInternalData(this.currentViewData, this);\n }\n if (this.category === 'Pareto') {\n this.currentViewData = sort(this.currentViewData, [this.yName], true);\n if (this.type === 'Line') {\n this.currentViewData = this.chart.paretoSeriesModule.performCumulativeCalculation(this.currentViewData, this);\n }\n }\n }\n var len = Object.keys(this.currentViewData).length;\n this.points = [];\n this.xMin = Infinity;\n this.xMax = -Infinity;\n this.yMin = Infinity;\n this.yMax = -Infinity;\n this.sizeMax = -Infinity;\n this.getSeriesType();\n if (this.xAxis.valueType === 'Category') {\n while (i < len) {\n point = this.dataPoint(i, textMappingName, xName);\n this.pushCategoryData(point, i, point.x);\n this.pushData(point, i);\n this.setEmptyPoint(point, i);\n i++;\n }\n }\n else if (this.xAxis.valueType.indexOf('DateTime') > -1) {\n var option = {\n skeleton: 'full',\n type: 'dateTime'\n };\n var dateParser = this.chart.intl.getDateParser(option);\n var dateFormatter = this.chart.intl.getDateFormat(option);\n while (i < len) {\n point = this.dataPoint(i, textMappingName, xName);\n point.x = new Date(DataUtil.parse.parseJson({ val: point.x }).val);\n if (this.xAxis.valueType === 'DateTime') {\n point.xValue = Date.parse(dateParser(dateFormatter(point.x)));\n }\n else {\n this.pushCategoryData(point, i, Date.parse(dateParser(dateFormatter(point.x))).toString());\n }\n this.pushData(point, i);\n this.setEmptyPoint(point, i);\n i++;\n }\n }\n else {\n while (i < len) {\n point = this.dataPoint(i, textMappingName, xName);\n point.xValue = point.x;\n this.pushData(point, i);\n this.setEmptyPoint(point, i);\n i++;\n }\n }\n if (this instanceof Series) {\n if (this.type.indexOf('Spline') > -1 || (this.drawType.indexOf('Spline') > -1 && this.chart.chartAreaType === 'PolarRadar')) {\n var isArea = (this.type.indexOf('Area') > -1 || this.drawType === 'Area');\n this.chart['spline' + (isArea ? 'Area' : '') + 'SeriesModule'].findSplinePoint(this);\n }\n }\n };\n SeriesBase.prototype.pushData = function (point, i) {\n point.index = i;\n point.yValue = point.y;\n // To find the min, max for the axis range.\n this.xMin = Math.min(this.xMin, point.xValue);\n this.xMax = Math.max(this.xMax, point.xValue);\n this.xData.push(point.xValue);\n };\n /** @private */\n SeriesBase.prototype.dataPoint = function (i, textMappingName, xName) {\n var point;\n this.points[i] = new Points();\n point = this.points[i];\n var currentViewData = this.currentViewData;\n var getObjectValueByMappingString = this.enableComplexProperty ? getValue : this.getObjectValue;\n point.x = getObjectValueByMappingString(xName, currentViewData[i]);\n point.high = getObjectValueByMappingString(this.high, currentViewData[i]);\n point.low = getObjectValueByMappingString(this.low, currentViewData[i]);\n point.open = getObjectValueByMappingString(this.open, currentViewData[i]);\n point.close = getObjectValueByMappingString(this.close, currentViewData[i]);\n point.volume = getObjectValueByMappingString(this.volume, currentViewData[i]);\n point.interior = getObjectValueByMappingString(this.pointColorMapping, currentViewData[i]);\n if (this instanceof Series) {\n point.y = getObjectValueByMappingString(this.yName, currentViewData[i]);\n point.size = getObjectValueByMappingString(this.size, currentViewData[i]);\n point.text = getObjectValueByMappingString(textMappingName, currentViewData[i]);\n point.tooltip = getObjectValueByMappingString(this.tooltipMappingName, currentViewData[i]);\n }\n return point;\n };\n SeriesBase.prototype.getObjectValue = function (mappingName, data) {\n return data[mappingName];\n };\n /**\n * To set empty point value based on empty point mode\n * @private\n */\n SeriesBase.prototype.setEmptyPoint = function (point, i) {\n if (!this.findVisibility(point)) {\n point.visible = true;\n return null;\n }\n point.isEmpty = true;\n var mode = this instanceof Series ? this.emptyPointSettings.mode : 'Drop';\n switch (mode) {\n case 'Zero':\n point.visible = true;\n if (this instanceof Series && this.seriesType.indexOf('HighLow') > -1) {\n point.high = point.low = 0;\n if (this.seriesType.indexOf('HighLowOpenClose') > -1) {\n point.open = point.close = 0;\n }\n }\n else {\n point.y = point.yValue = this.yData[i] = 0;\n }\n break;\n case 'Average':\n if (this instanceof Series) {\n if (this.seriesType.indexOf('HighLow') > -1) {\n point.high = (isNullOrUndefined(point.high) || isNaN(+point.high)) ? this.getAverage(this.high, i) : point.high;\n point.low = (isNullOrUndefined(point.low) || isNaN(+point.low)) ? this.getAverage(this.low, i) : point.low;\n if (this.seriesType.indexOf('HighLowOpenClose') > -1) {\n point.open = (isNullOrUndefined(point.open) || isNaN(+point.open)) ? this.getAverage(this.open, i) : point.open;\n point.close = (isNullOrUndefined(point.close) || isNaN(+point.close)) ? this.getAverage(this.close, i) :\n point.close;\n }\n }\n else {\n point.y = point.yValue = this.yData[i] = this.getAverage(this.yName, i);\n }\n }\n point.visible = true;\n break;\n case 'Drop':\n case 'Gap':\n this.yData[i] = null;\n point.visible = false;\n break;\n }\n };\n SeriesBase.prototype.findVisibility = function (point) {\n var type = this instanceof Series ? this.seriesType : 'HighLowOpenClose';\n var yValues;\n switch (type) {\n case 'XY':\n this.setXYMinMax(point.yValue);\n this.yData.push(point.yValue);\n if (this instanceof Series && this.type === 'Bubble') {\n this.sizeMax = Math.max(this.sizeMax, (isNullOrUndefined(point.size) || isNaN(+point.size)) ? this.sizeMax\n : point.size);\n }\n return isNullOrUndefined(point.x) || (isNullOrUndefined(point.y) || isNaN(+point.y));\n case 'HighLow':\n this.setHiloMinMax(point.high, point.low);\n return isNullOrUndefined(point.x) || (isNullOrUndefined(point.low) || isNaN(+point.low)) ||\n (isNullOrUndefined(point.high) || isNaN(+point.high));\n case 'HighLowOpenClose':\n this.setHiloMinMax(point.high, point.low);\n return isNullOrUndefined(point.x) || (isNullOrUndefined(point.low) || isNaN(+point.low)) ||\n (isNullOrUndefined(point.open) || isNaN(+point.open)) || (isNullOrUndefined(point.close) || isNaN(+point.close))\n || (isNullOrUndefined(point.high) || isNaN(+point.high));\n case 'BoxPlot':\n yValues = (point.y || [null]).filter(function (value) {\n return !isNullOrUndefined(value) && !isNaN(value);\n }).sort(function (a, b) {\n return a - b;\n });\n point.y = yValues;\n this.yMin = Math.min(this.yMin, Math.min.apply(Math, yValues));\n this.yMax = Math.max(this.yMax, Math.max.apply(Math, yValues));\n return !yValues.length;\n }\n };\n /**\n * To get Y min max for the provided point seriesType XY\n */\n SeriesBase.prototype.setXYMinMax = function (yValue) {\n this.yMin = Math.min(this.yMin, (isNullOrUndefined(yValue) || isNaN(yValue)) ? this.yMin : yValue);\n this.yMax = Math.max(this.yMax, (isNullOrUndefined(yValue) || isNaN(yValue)) ? this.yMax : yValue);\n };\n /**\n * To get Y min max for the provided point seriesType XY\n */\n SeriesBase.prototype.setHiloMinMax = function (high, low) {\n this.yMin = Math.min(this.yMin, Math.min((isNullOrUndefined(low) || isNaN(low)) ? this.yMin : low, (isNullOrUndefined(high) || isNaN(high)) ? this.yMin : high));\n this.yMax = Math.max(this.yMax, Math.max((isNullOrUndefined(low) || isNaN(low)) ? this.yMax : low, (isNullOrUndefined(high) || isNaN(high)) ? this.yMax : high));\n };\n /**\n * Finds the type of the series\n * @private\n */\n SeriesBase.prototype.getSeriesType = function () {\n var type;\n if (this instanceof Series) {\n var seriesType = this.chart.chartAreaType === 'PolarRadar' ? this.drawType : this.type;\n if (seriesType) {\n switch (seriesType) {\n case 'RangeColumn':\n case 'RangeArea':\n case 'Hilo':\n type = 'HighLow';\n break;\n case 'HiloOpenClose':\n case 'Candle':\n type = 'HighLowOpenClose';\n break;\n case 'BoxAndWhisker':\n type = 'BoxPlot';\n break;\n default:\n type = 'XY';\n }\n }\n }\n this.seriesType = type;\n };\n /** @private */\n SeriesBase.prototype.pushCategoryData = function (point, index, pointX) {\n if (!this.xAxis.isIndexed) {\n if (this.xAxis.labels.indexOf(pointX) < 0) {\n this.xAxis.labels.push(pointX);\n }\n point.xValue = this.xAxis.labels.indexOf(pointX);\n }\n else {\n this.xAxis.labels[index] ? this.xAxis.labels[index] += ', ' + pointX :\n this.xAxis.labels.push(pointX);\n point.xValue = index;\n }\n };\n /**\n * To find average of given property\n */\n SeriesBase.prototype.getAverage = function (member, i, data) {\n if (data === void 0) { data = this.currentViewData; }\n var previous = data[i - 1] ? (data[i - 1][member] || 0) : 0;\n var next = data[i + 1] ? (data[i + 1][member] || 0) : 0;\n return (previous + next) / 2;\n };\n /**\n * To find the control points for spline.\n * @return {void}\n * @private\n */\n SeriesBase.prototype.refreshDataManager = function (chart) {\n var _this = this;\n this.chart = chart;\n var dateSource = this.dataSource || chart.dataSource;\n if (!(dateSource instanceof DataManager) && isNullOrUndefined(this.query)) {\n this.dataManagerSuccess({ result: dateSource, count: dateSource.length }, chart, false);\n return;\n }\n var dataManager = this.dataModule.getData(this.dataModule.generateQuery().requiresCount());\n dataManager.then(function (e) { return _this.dataManagerSuccess(e, chart); });\n };\n SeriesBase.prototype.dataManagerSuccess = function (e, chart, isRemoteData) {\n if (isRemoteData === void 0) { isRemoteData = true; }\n this.currentViewData = e.result !== '' ? extend([], e.result, null, true) : [];\n if (this instanceof Series) {\n var argsData = {\n name: seriesRender, series: this, data: this.currentViewData, fill: this.interior\n };\n this.chart.trigger(seriesRender, argsData);\n this.interior = argsData.fill;\n this.currentViewData = argsData.data;\n }\n this.processJsonData();\n this.recordsCount = e.count;\n this.refreshChart(isRemoteData);\n };\n SeriesBase.prototype.refreshChart = function (isRemoteData) {\n var chart = this.chart;\n if (this instanceof Series) {\n chart.visibleSeriesCount += isRemoteData ? 1 : 0;\n }\n chart.refreshTechnicalIndicator(this);\n if (this instanceof Series && this.category !== 'TrendLine') {\n for (var _i = 0, _a = this.trendlines; _i < _a.length; _i++) {\n var trendline = _a[_i];\n trendline.setDataSource(this, chart);\n }\n }\n //if (chart.visibleSeries.length === (chart.visibleSeriesCount - chart.indicators.length)) {\n if (chart.visibleSeries.length === (chart.visibleSeriesCount)) {\n chart.refreshBound();\n chart.trigger('loaded', { chart: chart });\n }\n if (this instanceof Series) {\n chart.visibleSeriesCount += isRemoteData ? 0 : 1;\n }\n };\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"xName\", void 0);\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"high\", void 0);\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"low\", void 0);\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"open\", void 0);\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"close\", void 0);\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"volume\", void 0);\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"pointColorMapping\", void 0);\n __decorate([\n Property(null)\n ], SeriesBase.prototype, \"xAxisName\", void 0);\n __decorate([\n Property(null)\n ], SeriesBase.prototype, \"yAxisName\", void 0);\n __decorate([\n Complex(null, Animation)\n ], SeriesBase.prototype, \"animation\", void 0);\n __decorate([\n Property(null)\n ], SeriesBase.prototype, \"fill\", void 0);\n __decorate([\n Property(1)\n ], SeriesBase.prototype, \"width\", void 0);\n __decorate([\n Property('0')\n ], SeriesBase.prototype, \"dashArray\", void 0);\n __decorate([\n Property('')\n ], SeriesBase.prototype, \"dataSource\", void 0);\n __decorate([\n Property()\n ], SeriesBase.prototype, \"query\", void 0);\n __decorate([\n Collection([], ChartSegment)\n ], SeriesBase.prototype, \"segments\", void 0);\n __decorate([\n Property('X')\n ], SeriesBase.prototype, \"segmentAxis\", void 0);\n __decorate([\n Property(false)\n ], SeriesBase.prototype, \"enableComplexProperty\", void 0);\n return SeriesBase;\n}(ChildProperty));\nexport { SeriesBase };\n/**\n * Configures the series in charts.\n */\nvar Series = /** @class */ (function (_super) {\n __extends(Series, _super);\n // tslint:disable-next-line:no-any\n function Series(parent, propName, defaultValue, isArray) {\n var _this = _super.call(this, parent, propName, defaultValue, isArray) || this;\n _this.visibleSeriesCount = 0;\n /** @private */\n _this.category = 'Series';\n /** @private */\n _this.isRectSeries = false;\n /** @private */\n _this.drawPoints = [];\n /** @private */\n _this.delayedAnimation = false;\n return _this;\n }\n /**\n * Refresh the axis label.\n * @return {boolean}\n * @private\n */\n Series.prototype.refreshAxisLabel = function () {\n if (this.xAxis.valueType !== 'Category') {\n return null;\n }\n this.xAxis.labels = [];\n for (var _i = 0, _a = this.xAxis.series; _i < _a.length; _i++) {\n var item = _a[_i];\n if (item.visible) {\n item.xMin = Infinity;\n item.xMax = -Infinity;\n for (var _b = 0, _c = item.points; _b < _c.length; _b++) {\n var point = _c[_b];\n item.pushCategoryData(point, point.index, point.x);\n item.xMin = Math.min(item.xMin, point.xValue);\n item.xMax = Math.max(item.xMax, point.xValue);\n }\n }\n }\n };\n /**\n * To get the series collection.\n * @return {void}\n * @private\n */\n Series.prototype.findSeriesCollection = function (column, row, isStack) {\n var seriesCollection = [];\n for (var _i = 0, _a = row.axes; _i < _a.length; _i++) {\n var rowAxis = _a[_i];\n for (var _b = 0, _c = rowAxis.series; _b < _c.length; _b++) {\n var rowSeries = _c[_b];\n for (var _d = 0, _e = column.axes; _d < _e.length; _d++) {\n var axis = _e[_d];\n for (var _f = 0, _g = axis.series; _f < _g.length; _f++) {\n var series = _g[_f];\n if (series === rowSeries && series.visible && this.rectSeriesInChart(series, isStack)) {\n seriesCollection.push(series);\n }\n }\n }\n }\n }\n return seriesCollection;\n };\n /**\n * To get the column type series.\n * @return {void}\n * @private\n */\n Series.prototype.rectSeriesInChart = function (series, isStack) {\n var type = (series.type).toLowerCase();\n return (type.indexOf('column') !== -1 || type.indexOf('bar') !== -1 || type.indexOf('histogram') !== -1 ||\n type.indexOf('hiloopenclose') !== -1 || type.indexOf('candle') !== -1 || type.indexOf('pareto') !== -1 ||\n type.indexOf('hilo') !== -1 || series.drawType.indexOf('Column') !== -1 ||\n type.indexOf('waterfall') !== -1 || type.indexOf('boxandwhisker') !== -1 || isStack);\n };\n /**\n * To calculate the stacked values.\n * @return {void}\n * @private\n */\n Series.prototype.calculateStackedValue = function (isStacking100, chart) {\n var axisSeries;\n for (var _i = 0, _a = chart.columns; _i < _a.length; _i++) {\n var columnItem = _a[_i];\n for (var _b = 0, _c = chart.rows; _b < _c.length; _b++) {\n var item = _c[_b];\n this.calculateStackingValues(this.findSeriesCollection(columnItem, item, true), isStacking100);\n }\n }\n };\n Series.prototype.calculateStackingValues = function (seriesCollection, isStacking100) {\n var startValues;\n var endValues;\n var yValues = [];\n var lastPositive = [];\n var lastNegative = [];\n var stackingGroup;\n var lastValue;\n var value;\n var frequencies = [];\n if (isStacking100) {\n frequencies = this.findFrequencies(seriesCollection);\n }\n var stackingSeies = [];\n var stackedValues = [];\n for (var _i = 0, seriesCollection_1 = seriesCollection; _i < seriesCollection_1.length; _i++) {\n var series = seriesCollection_1[_i];\n if (series.type.indexOf('Stacking') !== -1 || (series.drawType.indexOf('Stacking') !== -1 &&\n (series.chart.chartAreaType === 'PolarRadar'))) {\n stackingGroup = (series.type.indexOf('StackingArea') !== -1) ? 'StackingArea100' : series.stackingGroup;\n if (!lastPositive[stackingGroup]) {\n lastPositive[stackingGroup] = [];\n lastNegative[stackingGroup] = [];\n }\n yValues = series.yData;\n startValues = [];\n endValues = [];\n stackingSeies.push(series);\n for (var j = 0, pointsLength = series.points.length; j < pointsLength; j++) {\n lastValue = 0;\n value = yValues[j];\n if (lastPositive[stackingGroup][series.points[j].xValue] === undefined) {\n lastPositive[stackingGroup][series.points[j].xValue] = 0;\n }\n if (lastNegative[stackingGroup][series.points[j].xValue] === undefined) {\n lastNegative[stackingGroup][series.points[j].xValue] = 0;\n }\n if (isStacking100) {\n value = value / frequencies[stackingGroup][series.points[j].xValue] * 100;\n value = !isNaN(value) ? value : 0;\n series.points[j].percentage = +(value.toFixed(2));\n }\n else {\n stackedValues[j] = stackedValues[j] ? stackedValues[j] + Math.abs(value) : Math.abs(value);\n }\n if (value >= 0) {\n lastValue = lastPositive[stackingGroup][series.points[j].xValue];\n lastPositive[stackingGroup][series.points[j].xValue] += value;\n }\n else {\n lastValue = lastNegative[stackingGroup][series.points[j].xValue];\n lastNegative[stackingGroup][series.points[j].xValue] += value;\n }\n startValues.push(lastValue);\n endValues.push(value + lastValue);\n if (isStacking100 && (endValues[j] > 100)) {\n endValues[j] = 100;\n }\n }\n series.stackedValues = new StackValues(startValues, endValues);\n series.yMin = Math.min.apply(0, startValues);\n series.yMax = Math.max.apply(0, endValues);\n if (series.yMin > Math.min.apply(0, endValues)) {\n series.yMin = (isStacking100) ? -100 : Math.min.apply(0, endValues);\n }\n if (series.yMax < Math.max.apply(0, startValues)) {\n series.yMax = 0;\n }\n }\n }\n this.findPercentageOfStacking(stackingSeies, stackedValues, isStacking100);\n };\n Series.prototype.findPercentageOfStacking = function (stackingSeies, values, isStacking100) {\n for (var _i = 0, stackingSeies_1 = stackingSeies; _i < stackingSeies_1.length; _i++) {\n var item = stackingSeies_1[_i];\n if (isStacking100) {\n return null;\n }\n for (var _a = 0, _b = item.points; _a < _b.length; _a++) {\n var point = _b[_a];\n point.percentage = Math.abs(+(point.y / values[point.index] * 100).toFixed(2));\n }\n }\n };\n Series.prototype.findFrequencies = function (seriesCollection) {\n var frequencies = [];\n var stackingGroup;\n for (var _i = 0, seriesCollection_2 = seriesCollection; _i < seriesCollection_2.length; _i++) {\n var series = seriesCollection_2[_i];\n series.yAxis.isStack100 = series.type.indexOf('100') !== -1 ? true : false;\n if (series.type.indexOf('Stacking') !== -1) {\n stackingGroup = (series.type.indexOf('StackingArea') !== -1) ? 'StackingArea100' : series.stackingGroup;\n if (!frequencies[stackingGroup]) {\n frequencies[stackingGroup] = [];\n }\n for (var j = 0, pointsLength = series.points.length; j < pointsLength; j++) {\n if (frequencies[stackingGroup][series.points[j].xValue] === undefined) {\n frequencies[stackingGroup][series.points[j].xValue] = 0;\n }\n if (series.yData[j] > 0) {\n frequencies[stackingGroup][series.points[j].xValue] += series.yData[j];\n }\n else {\n frequencies[stackingGroup][series.points[j].xValue] -= series.yData[j];\n }\n }\n }\n }\n return frequencies;\n };\n /* private dataManagerFailure(e: { result: Object[] }): void {\n this.currentViewData = [];\n this.refreshChart();\n }*/\n /** @private */\n Series.prototype.renderSeries = function (chart) {\n var seriesType = firstToLowerCase(this.type);\n if (seriesType.indexOf('100') !== -1) {\n seriesType = seriesType.replace('100', '');\n }\n if (chart[seriesType + 'SeriesModule']) {\n if (this.category !== 'Indicator' && this.category !== 'TrendLine') {\n this.createSeriesElements(chart);\n }\n chart[seriesType + 'SeriesModule'].render(this, this.xAxis, this.yAxis, chart.requireInvertedAxis);\n if (this.category !== 'Indicator') {\n if (this.errorBar.visible) {\n this.chart.errorBarModule.render(this);\n }\n if (this.marker.dataLabel.visible) {\n chart.dataLabelModule.render(this, this.chart, this.marker.dataLabel);\n }\n this.appendSeriesElement(chart.seriesElements, chart);\n }\n this.performAnimation(chart, seriesType, this.errorBar, this.marker, this.marker.dataLabel);\n }\n };\n /**\n * To create seris element.\n * @return {void}\n * @private\n */\n Series.prototype.createSeriesElements = function (chart) {\n if (this.category !== 'Indicator') {\n var elementId = chart.element.id;\n var xAxisRect = this.xAxis.rect;\n // 8 for extend border value 5 for extend size value\n var explodeValue = this.marker.border.width + 8 + 5;\n var render = chart.renderer;\n var index = this.index === undefined ? this.category : this.index;\n var markerHeight = (this.type === 'Scatter') ? (this.marker.height + explodeValue) / 2 : 0;\n var markerWidth = (this.type === 'Scatter') ? (this.marker.width + explodeValue) / 2 : 0;\n var options = void 0;\n if (chart.chartAreaType === 'PolarRadar') {\n var markerMaxValue = (this.drawType === 'Scatter') ? Math.max(this.marker.width, this.marker.height) : 0;\n options = new CircleOption(elementId + '_ChartSeriesClipRect_' + index, 'transparent', { width: 1, color: 'Gray' }, 1, this.clipRect.width / 2 + this.clipRect.x, this.clipRect.height / 2 + this.clipRect.y, chart.radius + markerMaxValue);\n this.clipRectElement = appendClipElement(chart.redraw, options, render, 'drawCircularClipPath');\n }\n else {\n options = new RectOption(elementId + '_ChartSeriesClipRect_' + index, 'transparent', { width: 1, color: 'Gray' }, 1, {\n x: -markerWidth, y: -markerHeight,\n width: this.clipRect.width + markerWidth * 2,\n height: this.clipRect.height + markerHeight * 2\n });\n this.clipRectElement = appendClipElement(chart.redraw, options, render);\n }\n var transform = void 0;\n transform = chart.chartAreaType === 'Cartesian' ? 'translate(' + this.clipRect.x + ',' + (this.clipRect.y) + ')' : '';\n this.symbolElement = null;\n this.seriesElement = render.createGroup({\n 'id': elementId + 'SeriesGroup' + index,\n 'transform': transform,\n 'clip-path': 'url(#' + elementId + '_ChartSeriesClipRect_' + index + ')'\n });\n this.seriesElement.appendChild(this.clipRectElement);\n }\n };\n /**\n * To append the series.\n * @return {void}\n * @private\n */\n Series.prototype.appendSeriesElement = function (element, chart) {\n var marker = this.marker;\n var dataLabel = marker.dataLabel;\n var redraw = chart.redraw;\n if (this.category !== 'TrendLine') {\n appendChildElement(chart.seriesElements, this.seriesElement, redraw);\n var errorBar = this.errorBar;\n if (errorBar.visible) {\n if (chart.chartAreaType === 'PolarRadar') {\n appendChildElement(chart.seriesElements, this.seriesElement, redraw);\n }\n else {\n appendChildElement(chart.seriesElements, this.errorBarElement, redraw);\n }\n }\n if (this.type === 'Scatter' || this.type === 'Bubble') {\n appendChildElement(chart.seriesElements, this.seriesElement, redraw);\n }\n }\n if (marker.visible && (chart.chartAreaType === 'Cartesian' ||\n ((this.drawType !== 'Scatter') && chart.chartAreaType === 'PolarRadar')) && this.type !== 'Scatter' &&\n this.type !== 'Bubble' && this.type !== 'Candle' && this.type !== 'Hilo' && this.type !== 'HiloOpenClose') {\n appendChildElement(chart.seriesElements, this.symbolElement, redraw);\n }\n if (dataLabel.visible) {\n appendChildElement(chart.dataLabelElements, this.shapeElement, redraw);\n appendChildElement(chart.dataLabelElements, this.textElement, redraw);\n }\n if (chart.dataLabelElements.hasChildNodes()) {\n chart.seriesElements.appendChild(chart.dataLabelElements);\n }\n };\n /**\n * To perform animation for chart series.\n * @return {void}\n * @private\n */\n Series.prototype.performAnimation = function (chart, type, errorBar, marker, dataLabel) {\n if (this.animation.enable && chart.animateSeries) {\n chart[type + 'SeriesModule'].doAnimation(this);\n if (errorBar.visible) {\n chart.errorBarModule.doErrorBarAnimation(this);\n }\n if (marker.visible) {\n chart.markerRender.doMarkerAnimation(this);\n }\n //to datalabel animation disabled for edge and IE\n if (dataLabel.visible && Browser.info.name !== 'edge' && !Browser.isIE) {\n chart.dataLabelModule.doDataLabelAnimation(this);\n }\n }\n };\n /**\n * To set border color for empty point\n * @private\n */\n Series.prototype.setPointColor = function (point, color) {\n color = point.interior || color;\n return point.isEmpty ? (this.emptyPointSettings.fill || color) : color;\n };\n /**\n * To set border color for empty point\n * @private\n */\n Series.prototype.setBorderColor = function (point, border) {\n border.width = point.isEmpty ? (this.emptyPointSettings.border.width || border.width) : border.width;\n border.color = point.isEmpty ? (this.emptyPointSettings.border.color || border.color) : border.color;\n return border;\n };\n __decorate([\n Property('')\n ], Series.prototype, \"name\", void 0);\n __decorate([\n Property('')\n ], Series.prototype, \"yName\", void 0);\n __decorate([\n Property('Line')\n ], Series.prototype, \"drawType\", void 0);\n __decorate([\n Property(true)\n ], Series.prototype, \"isClosed\", void 0);\n __decorate([\n Property('#2ecd71')\n ], Series.prototype, \"bearFillColor\", void 0);\n __decorate([\n Property('#e74c3d')\n ], Series.prototype, \"bullFillColor\", void 0);\n __decorate([\n Property(false)\n ], Series.prototype, \"enableSolidCandles\", void 0);\n __decorate([\n Property('')\n ], Series.prototype, \"size\", void 0);\n __decorate([\n Property(null)\n ], Series.prototype, \"binInterval\", void 0);\n __decorate([\n Property(false)\n ], Series.prototype, \"showNormalDistribution\", void 0);\n __decorate([\n Property('')\n ], Series.prototype, \"stackingGroup\", void 0);\n __decorate([\n Property(true)\n ], Series.prototype, \"visible\", void 0);\n __decorate([\n Complex({ color: 'transparent', width: 0 }, Border)\n ], Series.prototype, \"border\", void 0);\n __decorate([\n Property(1)\n ], Series.prototype, \"opacity\", void 0);\n __decorate([\n Property('Line')\n ], Series.prototype, \"type\", void 0);\n __decorate([\n Complex(null, ErrorBarSettings)\n ], Series.prototype, \"errorBar\", void 0);\n __decorate([\n Complex(null, MarkerSettings)\n ], Series.prototype, \"marker\", void 0);\n __decorate([\n Collection([], Trendline)\n ], Series.prototype, \"trendlines\", void 0);\n __decorate([\n Property(true)\n ], Series.prototype, \"enableTooltip\", void 0);\n __decorate([\n Property('')\n ], Series.prototype, \"tooltipMappingName\", void 0);\n __decorate([\n Property('SeriesType')\n ], Series.prototype, \"legendShape\", void 0);\n __decorate([\n Property(null)\n ], Series.prototype, \"selectionStyle\", void 0);\n __decorate([\n Property(1)\n ], Series.prototype, \"minRadius\", void 0);\n __decorate([\n Property(3)\n ], Series.prototype, \"maxRadius\", void 0);\n __decorate([\n Property('Natural')\n ], Series.prototype, \"splineType\", void 0);\n __decorate([\n Property(0.5)\n ], Series.prototype, \"cardinalSplineTension\", void 0);\n __decorate([\n Complex(null, EmptyPointSettings)\n ], Series.prototype, \"emptyPointSettings\", void 0);\n __decorate([\n Property(true)\n ], Series.prototype, \"showMean\", void 0);\n __decorate([\n Property('Normal')\n ], Series.prototype, \"boxPlotMode\", void 0);\n __decorate([\n Property(null)\n ], Series.prototype, \"columnWidth\", void 0);\n __decorate([\n Property(0)\n ], Series.prototype, \"columnSpacing\", void 0);\n __decorate([\n Property('#C64E4A')\n ], Series.prototype, \"negativeFillColor\", void 0);\n __decorate([\n Property('#4E81BC')\n ], Series.prototype, \"summaryFillColor\", void 0);\n __decorate([\n Property()\n ], Series.prototype, \"intermediateSumIndexes\", void 0);\n __decorate([\n Property()\n ], Series.prototype, \"sumIndexes\", void 0);\n __decorate([\n Complex({ color: 'black', width: 2 }, Connector)\n ], Series.prototype, \"connector\", void 0);\n __decorate([\n Complex(null, CornerRadius)\n ], Series.prototype, \"cornerRadius\", void 0);\n return Series;\n}(SeriesBase));\nexport { Series };\n","import { Query, DataManager } from '@syncfusion/ej2-data';\n/**\n * data module is used to generate query and dataSource\n */\nvar Data = /** @class */ (function () {\n /**\n * Constructor for data module\n * @private\n */\n function Data(dataSource, query) {\n this.initDataManager(dataSource, query);\n }\n /**\n * The function used to initialize dataManager and query\n * @return {void}\n * @private\n */\n Data.prototype.initDataManager = function (dataSource, query) {\n this.dataManager = dataSource instanceof DataManager ? dataSource : new DataManager(dataSource);\n this.query = query instanceof Query ? query : new Query();\n };\n /**\n * The function used to generate updated Query from chart model\n * @return {void}\n * @private\n */\n Data.prototype.generateQuery = function () {\n var query = this.query.clone();\n return query;\n };\n /**\n * The function used to get dataSource by executing given Query\n * @param {Query} query - A Query that specifies to generate dataSource\n * @return {void}\n * @private\n */\n Data.prototype.getData = function (query) {\n return this.dataManager.executeQuery(query);\n };\n return Data;\n}());\nexport { Data };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { drawSymbol } from '../../common/utils/helper';\nimport { PathOption, Size } from '@syncfusion/ej2-svg-base';\nimport { Browser, extend, remove } from '@syncfusion/ej2-base';\nimport { ChartData } from '../../chart/utils/get-data';\nimport { withInBounds, PointData, stopTimer } from '../../common/utils/helper';\nimport { colorNameToHex, convertHexToColor } from '../../common/utils/helper';\n/**\n * Marker Module used to render the marker for line type series.\n */\nvar MarkerExplode = /** @class */ (function (_super) {\n __extends(MarkerExplode, _super);\n /**\n * Constructor for the marker module.\n * @private\n */\n function MarkerExplode(chart) {\n var _this = _super.call(this, chart) || this;\n _this.addEventListener();\n _this.elementId = chart.element.id;\n return _this;\n }\n /**\n * @hidden\n */\n MarkerExplode.prototype.addEventListener = function () {\n if (this.chart.isDestroyed) {\n return;\n }\n this.chart.on(Browser.touchMoveEvent, this.mouseMoveHandler, this);\n this.chart.on(Browser.touchEndEvent, this.mouseUpHandler, this);\n };\n /**\n * @hidden\n */\n /* public removeEventListener(): void {\n if (this.chart.isDestroyed) { return; }\n this.chart.off(Browser.touchMoveEvent, this.mouseMoveHandler);\n }*/\n /**\n * @hidden\n */\n MarkerExplode.prototype.mouseUpHandler = function () {\n var chart = this.chart;\n if (chart.isTouch && !chart.crosshair.enable && !this.isSelected(chart)) {\n this.markerMove(true);\n }\n };\n /**\n * @hidden\n */\n MarkerExplode.prototype.mouseMoveHandler = function () {\n var chart = this.chart;\n if ((!chart.crosshair.enable || (chart.tooltip.enable)) && (!chart.isTouch || chart.startMove) && !this.isSelected(chart)) {\n this.markerMove(false);\n }\n };\n MarkerExplode.prototype.markerMove = function (remove) {\n var _this = this;\n var chart = this.chart;\n this.currentPoints = [];\n var data;\n var previous;\n var explodeSeries;\n var series;\n if (!chart.tooltip.shared || !chart.tooltip.enable) {\n data = this.getData();\n series = data.series;\n previous = this.previousPoints[0];\n explodeSeries = series && ((series.type === 'Bubble' || series.drawType === 'Scatter' || series.type === 'Scatter') ||\n (((series.type !== 'Candle') && (series.type !== 'Hilo') && (series.type !== 'HiloOpenClose')) &&\n (series.marker.visible && series.marker.width !== 0 && series.marker.height !== 0)));\n data.lierIndex = this.lierIndex;\n if (data.point && explodeSeries && ((!previous || (previous.point !== data.point)) ||\n (previous && previous.lierIndex > 3 && previous.lierIndex !== this.lierIndex))) {\n this.currentPoints.push(data);\n }\n }\n else {\n if (!withInBounds(chart.mouseX, chart.mouseY, chart.chartAxisLayoutPanel.seriesClipRect)) {\n return null;\n }\n if (chart.tooltip.enable) {\n var pointData = chart.chartAreaType === 'PolarRadar' ? this.getData() : null;\n for (var _i = 0, _a = chart.visibleSeries; _i < _a.length; _i++) {\n var chartSeries = _a[_i];\n if (!chartSeries.enableTooltip || chartSeries.category === 'Indicator') {\n continue;\n }\n if (chart.chartAreaType === 'Cartesian' && chartSeries.visible) {\n data = this.getClosestX(chart, chartSeries);\n }\n else if (chart.chartAreaType === 'PolarRadar' && chartSeries.visible && pointData.point !== null) {\n data = new PointData(chartSeries.points[pointData.point.index], chartSeries);\n }\n if (data) {\n this.currentPoints.push(data);\n data = null;\n }\n }\n }\n }\n var length = this.previousPoints.length;\n if (this.currentPoints.length > 0) {\n if (length === 0 || (length > 0 && this.previousPoints[0].point !== this.currentPoints[0].point)) {\n if (this.previousPoints.length > 0) {\n this.removeHighlightedMarker();\n }\n var _loop_1 = function (data_1) {\n if ((data_1 && data_1.point) || ((series.type !== 'Candle') &&\n (series.type !== 'Hilo') && (series.type !== 'HiloOpenClose'))) {\n stopTimer(this_1.markerExplode);\n this_1.isRemove = true;\n data_1.point.symbolLocations.map(function (location, index) {\n if (!data_1.series.isRectSeries || data_1.point.marker.visible) {\n _this.drawTrackBall(data_1.series, data_1.point, location, index);\n }\n });\n }\n };\n var this_1 = this;\n for (var _b = 0, _c = this.currentPoints; _b < _c.length; _b++) {\n var data_1 = _c[_b];\n _loop_1(data_1);\n }\n this.previousPoints = extend([], this.currentPoints, null, true);\n }\n }\n if (!chart.tooltip.enable && ((this.currentPoints.length === 0 && this.isRemove) || (remove && this.isRemove) ||\n !withInBounds(chart.mouseX, chart.mouseY, chart.chartAxisLayoutPanel.seriesClipRect))) {\n this.isRemove = false;\n this.markerExplode = setTimeout(function () {\n _this.removeHighlightedMarker();\n }, 2000);\n }\n this.currentPoints = [];\n };\n MarkerExplode.prototype.drawTrackBall = function (series, point, location, index) {\n var marker = point.marker;\n var seriesMarker = series.marker;\n var shape = marker.shape || seriesMarker.shape;\n var element = series.symbolElement || series.seriesElement;\n var symbolId = this.elementId + '_Series_' + series.index + '_Point_' + point.index + '_Trackball' +\n (index ? index : '');\n var size = new Size((marker.width || seriesMarker.width) + 5, (marker.height || seriesMarker.height) + 5);\n var border = (marker.border || series.border);\n var explodeSeries = (series.type === 'BoxAndWhisker' || series.type === 'Bubble' || series.type === 'Scatter');\n var borderColor = (border.color && border.color !== 'transparent') ? border.color :\n marker.fill || point.interior || (explodeSeries ? point.color : series.interior);\n var colorValue = convertHexToColor(colorNameToHex(borderColor));\n var borderWidth = marker.border ? marker.border.width : seriesMarker.border.width;\n var markerShadow = series.chart.themeStyle.markerShadow ||\n 'rgba(' + colorValue.r + ',' + colorValue.g + ',' + colorValue.b + ',0.2)';\n for (var i = 0; i < 2; i++) {\n var options = new PathOption(symbolId + '_' + i, i ? (marker.fill || point.color || (explodeSeries ? series.interior : '#ffffff')) : 'transparent', borderWidth + (i ? 0 : 8), i ? borderColor : markerShadow, (marker.opacity || seriesMarker.opacity), null, null);\n var symbol = drawSymbol(location, shape, size, seriesMarker.imageUrl, options, '');\n symbol.setAttribute('style', 'pointer-events:none');\n symbol.setAttribute('class', 'EJ2-Trackball');\n element.appendChild(symbol);\n }\n };\n /**\n * @hidden\n */\n MarkerExplode.prototype.removeHighlightedMarker = function () {\n var elements = document.getElementsByClassName('EJ2-Trackball');\n for (var i = 0, len = elements.length; i < len; i++) {\n remove(elements[0]);\n }\n this.previousPoints = [];\n };\n return MarkerExplode;\n}(ChartData));\nexport { MarkerExplode };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { RectOption, appendChildElement, getElement, appendClipElement } from '../../common/utils/helper';\nimport { findlElement, drawSymbol, markerAnimate, CircleOption, } from '../../common/utils/helper';\nimport { PathOption, Size } from '@syncfusion/ej2-svg-base';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { pointRender } from '../../common/model/constants';\nimport { MarkerExplode } from './marker-explode';\nimport { getSaturationColor } from '../../common/utils/helper';\n/**\n * Marker module used to render the marker for line type series.\n */\nvar Marker = /** @class */ (function (_super) {\n __extends(Marker, _super);\n /**\n * Constructor for the marker module.\n * @private\n */\n function Marker(chart) {\n var _this = _super.call(this, chart) || this;\n _this.addEventListener();\n return _this;\n }\n /**\n * Render the marker for series.\n * @return {void}\n * @private\n */\n Marker.prototype.render = function (series) {\n var _this = this;\n var redraw = series.chart.redraw;\n this.createElement(series, redraw);\n var _loop_1 = function (point) {\n if (point.visible && point.symbolLocations.length) {\n point.symbolLocations.map(function (location, index) {\n _this.renderMarker(series, point, location, index, redraw);\n });\n }\n };\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n _loop_1(point);\n }\n };\n Marker.prototype.renderMarker = function (series, point, location, index, redraw) {\n var seriesIndex = series.index === undefined ? series.category : series.index;\n var marker = series.marker;\n var border = {\n color: marker.border.color,\n width: marker.border.width\n };\n var borderColor = marker.border.color;\n var symbolId;\n var previousLocation;\n var previousPath;\n var circlePath;\n var shapeOption;\n var isBoxPlot = series.type === 'BoxAndWhisker';\n var fill = marker.fill || (isBoxPlot ? point.interior || series.interior : '#ffffff');\n var argsData;\n var markerElement;\n var parentElement = isBoxPlot ?\n findlElement(series.seriesElement.childNodes, 'Series_' + series.index + '_Point_' + point.index)\n : series.symbolElement;\n border.color = borderColor || series.setPointColor(point, series.interior);\n symbolId = this.elementId + '_Series_' + seriesIndex + '_Point_' + point.index + '_Symbol' +\n (index ? index : '');\n argsData = {\n cancel: false, name: pointRender, series: series, point: point,\n fill: point.isEmpty ? (series.emptyPointSettings.fill || fill) : fill,\n border: {\n color: series.type === 'BoxAndWhisker' ?\n (!isNullOrUndefined(borderColor) && borderColor !== 'transparent') ? borderColor :\n getSaturationColor(fill, -0.6)\n : border.color,\n width: border.width\n },\n height: marker.height,\n width: marker.width,\n shape: marker.shape\n };\n argsData.border = series.setBorderColor(point, { width: argsData.border.width, color: argsData.border.color });\n if (!series.isRectSeries || series.type === 'BoxAndWhisker') {\n this.chart.trigger(pointRender, argsData);\n point.color = argsData.fill;\n }\n point.color = argsData.fill;\n if (!argsData.cancel) {\n var y = void 0;\n if (series.type === 'RangeArea' || series.type === 'RangeColumn') {\n y = index ? point.low : point.high;\n }\n else if (isBoxPlot) {\n y = point.outliers[index];\n }\n else {\n y = point.y;\n }\n shapeOption = new PathOption(symbolId, argsData.fill, argsData.border.width, argsData.border.color, marker.opacity, null);\n if (parentElement !== undefined && parentElement !== null) {\n if (redraw && getElement(shapeOption.id)) {\n markerElement = getElement(shapeOption.id);\n circlePath = argsData.shape === 'Circle' ? 'c' : '';\n previousLocation = {\n x: +markerElement.getAttribute(circlePath + 'x'), y: +markerElement.getAttribute(circlePath + 'y')\n };\n previousPath = markerElement.getAttribute('d');\n }\n markerElement = drawSymbol(location, argsData.shape, new Size(argsData.width, argsData.height), marker.imageUrl, shapeOption, point.x.toString() + ':' + y.toString());\n appendChildElement(parentElement, markerElement, redraw, true, circlePath + 'x', circlePath + 'y', previousLocation, previousPath, false, false, null, series.chart.duration);\n }\n point.marker = {\n border: argsData.border,\n fill: argsData.fill,\n height: argsData.height,\n visible: true,\n shape: argsData.shape,\n width: argsData.width\n };\n }\n else {\n location = null;\n point.marker = {\n visible: false\n };\n }\n };\n Marker.prototype.createElement = function (series, redraw) {\n var markerClipRect;\n var marker = series.marker;\n // 8 for extend border value 5 for extend size value\n var explodeValue = marker.border.width + 8 + 5;\n var render = series.chart.renderer;\n var transform;\n var index = series.index === undefined ? series.category : series.index;\n var options;\n transform = series.chart.chartAreaType === 'Cartesian' ? 'translate(' + series.clipRect.x + ',' + (series.clipRect.y) + ')' : '';\n if (marker.visible) {\n var markerHeight = (marker.height + explodeValue) / 2;\n var markerWidth = (marker.width + explodeValue) / 2;\n if (series.chart.chartAreaType === 'Cartesian') {\n options = new RectOption(this.elementId + '_ChartMarkerClipRect_' + index, 'transparent', { width: 1, color: 'Gray' }, 1, {\n x: -markerWidth, y: -markerHeight,\n width: series.clipRect.width + markerWidth * 2,\n height: series.clipRect.height + markerHeight * 2\n });\n markerClipRect = appendClipElement(redraw, options, render);\n }\n else {\n options = new CircleOption(this.elementId + '_ChartMarkerClipRect_' + index, 'transparent', { width: 1, color: 'Gray' }, 1, series.clipRect.width / 2 + series.clipRect.x, series.clipRect.height / 2 + series.clipRect.y, series.chart.radius + Math.max(markerHeight, markerWidth));\n markerClipRect = appendClipElement(redraw, options, render, 'drawCircularClipPath');\n }\n options = {\n 'id': this.elementId + 'SymbolGroup' + index,\n 'transform': transform,\n 'clip-path': 'url(#' + this.elementId + '_ChartMarkerClipRect_' + index + ')'\n };\n series.symbolElement = render.createGroup(options);\n series.symbolElement.appendChild(markerClipRect);\n }\n };\n Marker.prototype.getRangeLowPoint = function (region, series) {\n var x = region.x;\n var y = region.y;\n if (series.chart.requireInvertedAxis) {\n y += region.height / 2;\n x += series.yAxis.isInversed ? region.width : 0;\n }\n else {\n y += series.yAxis.isInversed ? 0 : region.height;\n x += region.width / 2;\n }\n return { x: x, y: y };\n };\n /**\n * Animates the marker.\n * @return {void}.\n * @private\n */\n Marker.prototype.doMarkerAnimation = function (series) {\n if (!(series.type === 'Scatter' || series.type === 'Bubble' || series.type === 'Candle' || series.type === 'Hilo' ||\n series.type === 'HiloOpenClose' || (series.chart.chartAreaType === 'PolarRadar' && (series.drawType === 'Scatter')))) {\n var markerElements = series.symbolElement.childNodes;\n var delay = series.animation.delay + series.animation.duration;\n var duration = series.chart.animated ? series.chart.duration : 200;\n var j = 1;\n var incFactor = (series.type === 'RangeArea' || series.type === 'RangeColumn') ? 2 : 1;\n for (var i = 0; i < series.points.length; i++) {\n if (!series.points[i].symbolLocations.length || !markerElements[j]) {\n continue;\n }\n markerAnimate(markerElements[j], delay, duration, series, i, series.points[i].symbolLocations[0], false);\n if (incFactor === 2) {\n var lowPoint = this.getRangeLowPoint(series.points[i].regions[0], series);\n markerAnimate(markerElements[j + 1], delay, duration, series, i, lowPoint, false);\n }\n j += incFactor;\n }\n }\n };\n return Marker;\n}(MarkerExplode));\nexport { Marker };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, Complex, ChildProperty } from '@syncfusion/ej2-base';\nimport { measureText, Rect, TextOption, Size, PathOption } from '@syncfusion/ej2-svg-base';\nimport { Font, Border, Margin } from '../model/base';\nimport { Theme } from '../model/theme';\nimport { subtractThickness, Thickness, drawSymbol, ChartLocation } from '../utils/helper';\nimport { RectOption, textElement, stringToNumber } from '../utils/helper';\nimport { removeElement, showTooltip, getElement, appendChildElement } from '../utils/helper';\n/**\n * Configures the location for the legend.\n */\nvar Location = /** @class */ (function (_super) {\n __extends(Location, _super);\n function Location() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(0)\n ], Location.prototype, \"x\", void 0);\n __decorate([\n Property(0)\n ], Location.prototype, \"y\", void 0);\n return Location;\n}(ChildProperty));\nexport { Location };\n/**\n * Configures the legends in charts.\n */\nvar LegendSettings = /** @class */ (function (_super) {\n __extends(LegendSettings, _super);\n function LegendSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], LegendSettings.prototype, \"visible\", void 0);\n __decorate([\n Property(null)\n ], LegendSettings.prototype, \"height\", void 0);\n __decorate([\n Property(null)\n ], LegendSettings.prototype, \"width\", void 0);\n __decorate([\n Complex({ x: 0, y: 0 }, Location)\n ], LegendSettings.prototype, \"location\", void 0);\n __decorate([\n Property('Auto')\n ], LegendSettings.prototype, \"position\", void 0);\n __decorate([\n Property(8)\n ], LegendSettings.prototype, \"padding\", void 0);\n __decorate([\n Property('Center')\n ], LegendSettings.prototype, \"alignment\", void 0);\n __decorate([\n Complex(Theme.legendLabelFont, Font)\n ], LegendSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property(10)\n ], LegendSettings.prototype, \"shapeHeight\", void 0);\n __decorate([\n Property(10)\n ], LegendSettings.prototype, \"shapeWidth\", void 0);\n __decorate([\n Complex({}, Border)\n ], LegendSettings.prototype, \"border\", void 0);\n __decorate([\n Complex({ left: 0, right: 0, top: 0, bottom: 0 }, Margin)\n ], LegendSettings.prototype, \"margin\", void 0);\n __decorate([\n Property(5)\n ], LegendSettings.prototype, \"shapePadding\", void 0);\n __decorate([\n Property('transparent')\n ], LegendSettings.prototype, \"background\", void 0);\n __decorate([\n Property(1)\n ], LegendSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property(true)\n ], LegendSettings.prototype, \"toggleVisibility\", void 0);\n __decorate([\n Property(null)\n ], LegendSettings.prototype, \"description\", void 0);\n __decorate([\n Property(3)\n ], LegendSettings.prototype, \"tabIndex\", void 0);\n return LegendSettings;\n}(ChildProperty));\nexport { LegendSettings };\n/**\n * Legend base class for Chart and Accumulation chart.\n * @private\n */\nvar BaseLegend = /** @class */ (function () {\n /**\n * Constructor for the dateTime module.\n * @private\n */\n function BaseLegend(chart) {\n this.rowCount = 0; // legend row counts per page \n this.columnCount = 0; // legend column counts per page \n this.pageButtonSize = 8;\n this.pageXCollections = []; // pages of x locations\n this.maxColumns = 0;\n this.isTrimmed = false;\n this.maxWidth = 0;\n this.currentPage = 1;\n this.chart = chart;\n this.legend = chart.legendSettings;\n this.legendID = chart.element.id + '_chart_legend';\n this.isChartControl = (chart.getModuleName() === 'chart');\n }\n /**\n * Calculate the bounds for the legends.\n * @return {void}\n * @private\n */\n BaseLegend.prototype.calculateLegendBounds = function (rect, availableSize) {\n var legend = this.legend;\n this.getPosition(legend.position, availableSize);\n this.legendBounds = new Rect(rect.x, rect.y, 0, 0);\n this.isVertical = (this.position === 'Left' || this.position === 'Right');\n if (this.isVertical) {\n this.legendBounds.height = stringToNumber(legend.height, availableSize.height - (rect.y - this.chart.margin.top)) || rect.height;\n this.legendBounds.width = stringToNumber(legend.width || '20%', availableSize.width);\n }\n else {\n this.legendBounds.width = stringToNumber(legend.width, availableSize.width) || rect.width;\n this.legendBounds.height = stringToNumber(legend.height || '20%', availableSize.height);\n }\n this.library.getLegendBounds(availableSize, this.legendBounds, legend);\n this.getLocation(this.position, legend.alignment, this.legendBounds, rect, availableSize);\n };\n /**\n * To find legend position based on available size for chart and accumulation chart\n */\n BaseLegend.prototype.getPosition = function (position, availableSize) {\n if (this.isChartControl) {\n this.position = (position !== 'Auto') ? position : 'Bottom';\n }\n else {\n if (position === 'Auto' && this.chart.visibleSeries &&\n (this.chart.visibleSeries[0].type === 'Funnel' || this.chart.visibleSeries[0].type === 'Pyramid')) {\n position = 'Top';\n }\n this.position = (position !== 'Auto') ? position :\n (availableSize.width > availableSize.height ? 'Right' : 'Bottom');\n }\n };\n /**\n * To set bounds for chart and accumulation chart\n */\n BaseLegend.prototype.setBounds = function (computedWidth, computedHeight, legend, legendBounds) {\n computedWidth = computedWidth < legendBounds.width ? computedWidth : legendBounds.width;\n computedHeight = computedHeight < legendBounds.height ? computedHeight : legendBounds.height;\n legendBounds.width = !legend.width ? computedWidth : legendBounds.width;\n legendBounds.height = !legend.height ? computedHeight : legendBounds.height;\n this.rowCount = Math.max(1, Math.ceil((legendBounds.height - legend.padding) / (this.maxItemHeight + legend.padding)));\n };\n /**\n * To find legend location based on position, alignment for chart and accumulation chart\n */\n BaseLegend.prototype.getLocation = function (position, alignment, legendBounds, rect, availableSize) {\n var padding = this.legend.border.width;\n var legendHeight = legendBounds.height + padding + this.legend.margin.top + this.legend.margin.bottom;\n var legendWidth = legendBounds.width + padding + this.legend.margin.left + this.legend.margin.right;\n var marginBottom = this.chart.margin.bottom;\n if (position === 'Bottom') {\n legendBounds.x = this.alignLegend(legendBounds.x, availableSize.width, legendBounds.width, alignment);\n legendBounds.y = rect.y + (rect.height - legendHeight) + padding + this.legend.margin.top;\n subtractThickness(rect, new Thickness(0, 0, 0, legendHeight));\n }\n else if (position === 'Top') {\n legendBounds.x = this.alignLegend(legendBounds.x, availableSize.width, legendBounds.width, alignment);\n legendBounds.y = rect.y + padding + this.legend.margin.top;\n subtractThickness(rect, new Thickness(0, 0, legendHeight, 0));\n }\n else if (position === 'Right') {\n legendBounds.x = rect.x + (rect.width - legendBounds.width) - this.legend.margin.right;\n legendBounds.y = rect.y + this.alignLegend(0, availableSize.height - (rect.y + marginBottom), legendBounds.height, alignment);\n subtractThickness(rect, new Thickness(0, legendWidth, 0, 0));\n }\n else if (position === 'Left') {\n legendBounds.x = legendBounds.x + this.legend.margin.left;\n legendBounds.y = rect.y + this.alignLegend(0, availableSize.height - (rect.y + marginBottom), legendBounds.height, alignment);\n subtractThickness(rect, new Thickness(legendWidth, 0, 0, 0));\n }\n else {\n legendBounds.x = this.legend.location.x;\n legendBounds.y = this.legend.location.y;\n subtractThickness(rect, new Thickness(0, 0, 0, 0));\n }\n };\n /**\n * To find legend alignment for chart and accumulation chart\n */\n BaseLegend.prototype.alignLegend = function (start, size, legendSize, alignment) {\n switch (alignment) {\n case 'Far':\n start = (size - legendSize) - start;\n break;\n case 'Center':\n start = ((size - legendSize) / 2);\n break;\n }\n return start;\n };\n /**\n * Renders the legend.\n * @return {void}\n * @private\n */\n BaseLegend.prototype.renderLegend = function (chart, legend, legendBounds, redraw) {\n var firstLegend = this.findFirstLegendPosition(this.legendCollections);\n var padding = legend.padding;\n this.maxItemHeight = Math.max(this.legendCollections[0].textSize.height, legend.shapeHeight);\n var legendGroup = chart.renderer.createGroup({ id: this.legendID + '_g' });\n var legendTranslateGroup = this.createLegendElements(chart, legendBounds, legendGroup, legend, this.legendID, redraw);\n if (firstLegend !== this.legendCollections.length) {\n var legendSeriesGroup = void 0; // legendItem group for each series group element\n var start = void 0; // starting shape center x,y position && to resolve lint error used new line for declaration\n start = new ChartLocation(legendBounds.x + padding + (legend.shapeWidth / 2), legendBounds.y + padding + this.maxItemHeight / 2);\n var textOptions = new TextOption('', start.x, start.y, 'start');\n // initialization for totalPages legend click totalpage again calculate\n this.totalPages = this.isChartControl ? this.totalPages : 0;\n var textPadding = legend.shapePadding + padding + legend.shapeWidth;\n var count = 0;\n this.pageXCollections = [];\n this.legendCollections[firstLegend].location = start;\n var previousLegend = this.legendCollections[firstLegend];\n for (var _i = 0, _a = this.legendCollections; _i < _a.length; _i++) {\n var legendOption = _a[_i];\n if (this.chart.getModuleName() === 'accumulationchart') {\n legendOption.fill = this.chart.visibleSeries[0].points[legendOption.pointIndex].color;\n }\n if (legendOption.render && legendOption.text !== '') {\n legendSeriesGroup = chart.renderer.createGroup({\n id: this.legendID + this.generateId(legendOption, '_g_', count)\n });\n legendSeriesGroup.setAttribute('tabindex', legend.tabIndex.toString());\n legendSeriesGroup.setAttribute('aria-label', legend.description || 'Click to show or hide the ' + legendOption.text + ' series');\n this.library.getRenderPoint(legendOption, start, textPadding, previousLegend, legendBounds, count, firstLegend);\n this.renderSymbol(legendOption, legendSeriesGroup, count);\n this.renderText(chart, legendOption, legendSeriesGroup, textOptions, count);\n legendSeriesGroup.setAttribute('style', 'cursor: ' + ((!legend.toggleVisibility && chart.selectionMode === 'None') ? 'auto' : 'pointer'));\n legendTranslateGroup.appendChild(legendSeriesGroup);\n previousLegend = legendOption;\n }\n count++;\n }\n if (this.isPaging) {\n this.renderPagingElements(chart, legendBounds, textOptions, legendGroup);\n }\n else {\n this.totalPages = 1;\n }\n }\n appendChildElement(chart.svgObject, legendGroup, redraw);\n };\n /**\n * To find first valid legend text index for chart and accumulation chart\n */\n BaseLegend.prototype.findFirstLegendPosition = function (legendCollection) {\n var count = 0;\n for (var _i = 0, legendCollection_1 = legendCollection; _i < legendCollection_1.length; _i++) {\n var legend = legendCollection_1[_i];\n if (legend.render && legend.text !== '') {\n break;\n }\n count++;\n }\n return count;\n };\n /**\n * To create legend rendering elements for chart and accumulation chart\n */\n BaseLegend.prototype.createLegendElements = function (chart, legendBounds, legendGroup, legend, id, redraw) {\n var padding = legend.padding;\n var options = new RectOption(id + '_element', legend.background, legend.border, legend.opacity, legendBounds);\n legendGroup.appendChild(chart.renderer.drawRectangle(options));\n var legendItemsGroup = chart.renderer.createGroup({ id: id + '_collections' });\n legendGroup.appendChild(legendItemsGroup);\n this.legendTranslateGroup = chart.renderer.createGroup({ id: id + '_translate_g' });\n legendItemsGroup.appendChild(this.legendTranslateGroup);\n var clippath = chart.renderer.createClipPath({ id: id + '_clipPath' });\n options.y += padding;\n options.id += '_clipPath_rect';\n options.width = (!this.isChartControl && this.isVertical) ? this.maxWidth - padding : legendBounds.width;\n this.clipRect = chart.renderer.drawRectangle(options);\n clippath.appendChild(this.clipRect);\n appendChildElement(chart.svgObject, clippath, redraw);\n legendItemsGroup.setAttribute('style', 'clip-path:url(#' + clippath.id + ')');\n return this.legendTranslateGroup;\n };\n /**\n * To render legend symbols for chart and accumulation chart\n */\n BaseLegend.prototype.renderSymbol = function (legendOption, group, i) {\n var symbolColor = legendOption.visible ? legendOption.fill : '#D3D3D3';\n var shape = (legendOption.shape === 'SeriesType') ? legendOption.type : legendOption.shape;\n shape = shape === 'Scatter' ? legendOption.markerShape : shape;\n var isStrokeWidth = (this.chart.getModuleName() === 'chart' && (legendOption.shape === 'SeriesType') &&\n (legendOption.type.toLowerCase().indexOf('line') > -1) && (legendOption.type.toLowerCase().indexOf('area') === -1));\n var strokewidth = isStrokeWidth ? this.chart.visibleSeries[i].width : 1;\n var symbolOption = new PathOption(this.legendID + this.generateId(legendOption, '_shape_', i), symbolColor, strokewidth, symbolColor, 1, '', '');\n group.appendChild(drawSymbol(legendOption.location, shape, new Size(this.legend.shapeWidth, this.legend.shapeHeight), '', symbolOption, 'Click to show or hide the ' + legendOption.text + ' series'));\n if (shape === 'Line' && legendOption.markerVisibility && legendOption.markerShape !== 'Image' ||\n legendOption.type === 'Doughnut') {\n symbolOption.id = this.legendID + this.generateId(legendOption, '_shape_marker_', i);\n shape = legendOption.type === 'Doughnut' ? 'Circle' : legendOption.markerShape;\n symbolOption.fill = legendOption.type === 'Doughnut' ? '#FFFFFF' : symbolOption.fill;\n group.appendChild(drawSymbol(legendOption.location, shape, new Size(this.legend.shapeWidth / 2, this.legend.shapeHeight / 2), '', symbolOption, 'Click to show or hide the ' + legendOption.text + ' series'));\n }\n };\n /**\n * To render legend text for chart and accumulation chart\n */\n BaseLegend.prototype.renderText = function (chart, legendOption, group, textOptions, i) {\n var legend = chart.legendSettings;\n var hiddenColor = '#D3D3D3';\n textOptions.id = this.legendID + this.generateId(legendOption, '_text_', i);\n var fontcolor = legendOption.visible ? legend.textStyle.color || chart.themeStyle.legendLabel : hiddenColor;\n textOptions.text = legendOption.text;\n textOptions.x = legendOption.location.x + (legend.shapeWidth / 2) + legend.shapePadding;\n textOptions.y = legendOption.location.y + this.maxItemHeight / 4;\n var element = textElement(textOptions, legend.textStyle, fontcolor, group);\n element.setAttribute('aria-label', legend.description || 'Click to show or hide the ' + legendOption.text + ' series');\n };\n /**\n * To render legend paging elements for chart and accumulation chart\n */\n BaseLegend.prototype.renderPagingElements = function (chart, bounds, textOption, legendGroup) {\n var paginggroup = chart.renderer.createGroup({ id: this.legendID + '_navigation' });\n legendGroup.appendChild(paginggroup);\n var grayColor = '#545454';\n var legend = chart.legendSettings; // to solve parameter lint error, legend declaration is here\n var padding = 8; // const padding for paging elements\n if (this.isChartControl || !this.isVertical) {\n this.totalPages = Math.ceil(this.totalPages / Math.max(1, this.rowCount - 1));\n }\n else {\n this.totalPages = Math.ceil(this.totalPages / this.maxColumns);\n }\n var symbolOption = new PathOption(this.legendID + '_pageup', 'transparent', 5, grayColor, 1, '', '');\n var iconSize = this.pageButtonSize;\n paginggroup.setAttribute('style', 'cursor: pointer');\n // Page left arrow drawing calculation started here\n this.clipPathHeight = (this.rowCount - 1) * (this.maxItemHeight + legend.padding);\n this.clipRect.setAttribute('height', this.clipPathHeight.toString());\n var x = bounds.x + iconSize / 2;\n var y = bounds.y + this.clipPathHeight + ((bounds.height - this.clipPathHeight) / 2);\n paginggroup.appendChild(drawSymbol({ x: x, y: y }, 'LeftArrow', new Size(iconSize, iconSize), '', symbolOption, 'LeftArrow'));\n // Page numbering rendering calculation started here\n textOption.x = x + (iconSize / 2) + padding;\n var size = measureText(this.totalPages + '/' + this.totalPages, legend.textStyle);\n textOption.y = y + (size.height / 4);\n textOption.id = this.legendID + '_pagenumber';\n textOption.text = '1/' + this.totalPages;\n var pageTextElement = textElement(textOption, legend.textStyle, legend.textStyle.color, paginggroup);\n // Page right arrow rendering calculation started here\n x = (textOption.x + padding + (iconSize / 2) + size.width);\n symbolOption.id = this.legendID + '_pagedown';\n paginggroup.appendChild(drawSymbol({ x: x, y: y }, 'RightArrow', new Size(iconSize, iconSize), '', symbolOption, 'RightArrow'));\n // placing the navigation buttons and page numbering in legend right corner\n paginggroup.setAttribute('transform', 'translate(' + (bounds.width - (2 * (iconSize + padding) +\n padding + size.width)) + ', ' + 0 + ')');\n this.translatePage(pageTextElement, this.currentPage - 1, this.currentPage);\n };\n /**\n * To translate legend pages for chart and accumulation chart\n */\n BaseLegend.prototype.translatePage = function (pagingText, page, pageNumber) {\n var size = (this.clipPathHeight) * page;\n var translate = 'translate(0,-' + size + ')';\n if (!this.isChartControl && this.isVertical) {\n var pageLength = page * this.maxColumns;\n size = this.pageXCollections[page * this.maxColumns] - this.legendBounds.x;\n size = size < 0 ? 0 : size; // to avoid small pixel variation\n translate = 'translate(-' + size + ',0)';\n }\n this.legendTranslateGroup.setAttribute('transform', translate);\n pagingText.textContent = (pageNumber) + '/' + this.totalPages;\n this.currentPage = pageNumber;\n };\n /**\n * To change legend pages for chart and accumulation chart\n */\n BaseLegend.prototype.changePage = function (event, pageUp) {\n var pageText = document.getElementById(this.legendID + '_pagenumber');\n var page = parseInt(pageText.textContent.split('/')[0], 10);\n if (pageUp && page > 1) {\n this.translatePage(pageText, (page - 2), (page - 1));\n }\n else if (!pageUp && page < this.totalPages) {\n this.translatePage(pageText, page, (page + 1));\n }\n };\n /**\n * To find legend elements id based on chart or accumulation chart\n * @private\n */\n BaseLegend.prototype.generateId = function (option, prefix, count) {\n if (this.isChartControl) {\n return prefix + count;\n }\n else {\n return prefix + option.pointIndex;\n }\n };\n /**\n * To show or hide trimmed text tooltip for legend.\n * @return {void}\n * @private\n */\n BaseLegend.prototype.move = function (event) {\n var _this = this;\n var x = this.chart.mouseX;\n var y = this.chart.mouseY;\n if (event.target.textContent.indexOf('...') > -1) {\n var targetId = event.target.id.split(this.legendID + '_text_');\n if (targetId.length === 2) {\n var index = parseInt(targetId[1], 10);\n var element = this.chart.element;\n if (!isNaN(index)) {\n if (this.chart.isTouch) {\n removeElement(this.chart.element.id + '_EJ2_Legend_Tooltip');\n }\n if (this.isChartControl) {\n showTooltip(this.chart.series[index].name, x, y, element.offsetWidth, element.id + '_EJ2_Legend_Tooltip', getElement(this.chart.element.id + '_Secondary_Element'));\n }\n else {\n showTooltip(this.chart.visibleSeries[0].points[index].x.toString(), x + 10, y + 10, element.offsetWidth, element.id + '_EJ2_Legend_Tooltip', getElement(this.chart.element.id + '_Secondary_Element'));\n }\n }\n }\n }\n else {\n removeElement(this.chart.element.id + '_EJ2_Legend_Tooltip');\n }\n if (this.chart.isTouch) {\n clearTimeout(this.clearTooltip);\n this.clearTooltip = setTimeout(function () { removeElement(_this.chart.element.id + '_EJ2_Legend_Tooltip'); }, 1000);\n }\n };\n return BaseLegend;\n}());\nexport { BaseLegend };\n/**\n * Class for legend options\n * @private\n */\nvar LegendOptions = /** @class */ (function () {\n function LegendOptions(text, fill, shape, visible, type, markerShape, markerVisibility, pointIndex, seriesIndex) {\n this.location = { x: 0, y: 0 };\n this.text = text;\n this.fill = fill;\n this.shape = shape;\n this.visible = visible;\n this.type = type;\n this.markerVisibility = markerVisibility;\n this.markerShape = markerShape;\n this.pointIndex = pointIndex;\n this.seriesIndex = seriesIndex;\n }\n return LegendOptions;\n}());\nexport { LegendOptions };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n///
\n * \n * ```\n */\nvar Chart = /** @class */ (function (_super) {\n __extends(Chart, _super);\n /**\n * Constructor for creating the widget\n * @hidden\n */\n function Chart(options, element) {\n var _this = _super.call(this, options, element) || this;\n /** @public */\n _this.animated = false;\n /** @private */\n _this.chartAreaType = 'Cartesian';\n _this.chartid = 57723;\n setValue('mergePersistData', _this.mergePersistChartData, _this);\n return _this;\n }\n /**\n * To manage persist chart data\n */\n Chart.prototype.mergePersistChartData = function () {\n var data = window.localStorage.getItem(this.getModuleName() + this.element.id);\n if (!(isNullOrUndefined(data) || (data === ''))) {\n var dataObj = JSON.parse(data);\n var keys = Object.keys(dataObj);\n this.isProtectedOnChange = true;\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var key = keys_1[_i];\n if ((typeof this[key] === 'object') && !isNullOrUndefined(this[key])) {\n extend(this[key], dataObj[key]);\n }\n else {\n this[key] = dataObj[key];\n }\n }\n this.isProtectedOnChange = false;\n }\n };\n /**\n * Initialize the event handler.\n */\n Chart.prototype.preRender = function () {\n this.unWireEvents();\n this.initPrivateVariable();\n this.setCulture();\n this.wireEvents();\n };\n Chart.prototype.initPrivateVariable = function () {\n this.animateSeries = true;\n this.delayRedraw = false;\n this.horizontalAxes = [];\n this.verticalAxes = [];\n this.refreshAxis();\n this.refreshDefinition(this.rows);\n this.refreshDefinition(this.columns);\n if (this.tooltipModule) {\n this.tooltipModule.previousPoints = [];\n }\n if (this.element.id === '') {\n var collection = document.getElementsByClassName('e-chart').length;\n this.element.id = 'chart_' + this.chartid + '_' + collection;\n }\n //seperate ID to differentiate chart and stock chart\n this.svgId = this.stockChart ? this.stockChart.element.id + '_stockChart_chart' : this.element.id + '_svg';\n };\n /**\n * To Initialize the control rendering.\n */\n Chart.prototype.render = function () {\n this.trigger(load, { chart: this });\n this.createChartSvg();\n this.setTheme();\n this.markerRender = new Marker(this);\n this.calculateAreaType();\n this.calculateVisibleSeries();\n this.initTechnicalIndicators();\n this.initTrendLines();\n this.calculateVisibleAxis();\n this.processData();\n };\n /**\n * Gets the localized label by locale keyword.\n * @param {string} key\n * @return {string}\n */\n Chart.prototype.getLocalizedLabel = function (key) {\n return this.localeObject.getConstant(key);\n };\n /**\n * Animate the series bounds.\n * @private\n */\n Chart.prototype.animate = function (duration) {\n this.redraw = true;\n this.animated = true; //used to set duration as 1000 for animation at default 300\n this.duration = duration ? duration : 1000;\n };\n /**\n * Refresh the chart bounds.\n * @private\n */\n Chart.prototype.refreshBound = function () {\n if (this.legendModule && this.legendSettings.visible) {\n this.legendModule.getLegendOptions(this.visibleSeries, this);\n }\n this.calculateStackValues();\n this.calculateBounds();\n this.renderElements();\n removeElement('chartmeasuretext');\n };\n /**\n * To calcualte the stack values\n */\n Chart.prototype.calculateStackValues = function () {\n var series;\n var isCalculateStacking = false;\n for (var i = 0, len = this.visibleSeries.length; i < len; i++) {\n series = this.visibleSeries[i];\n series.position = series.rectCount = undefined;\n if (((series.type.indexOf('Stacking') !== -1) || (series.drawType.indexOf('Stacking') !== -1\n && this.chartAreaType === 'PolarRadar')) && !isCalculateStacking) {\n series.calculateStackedValue(series.type.indexOf('100') > -1, this);\n isCalculateStacking = true;\n }\n }\n };\n Chart.prototype.renderElements = function () {\n this.renderBorder();\n this.renderTitle();\n this.renderAreaBorder();\n this.renderSeriesElements(this.renderAxes());\n this.renderLegend();\n this.applyZoomkit();\n this.performSelection();\n this.setSecondaryElementPosition();\n this.renderAnnotation();\n };\n /**\n * To render the legend\n * @private\n */\n Chart.prototype.renderAxes = function () {\n this.yAxisElements = this.renderer.createGroup({ id: this.element.id + 'yAxisCollection' });\n var axisElement;\n if (this.rows.length > 0 && this.columns.length > 0) {\n axisElement = this.chartAxisLayoutPanel.renderAxes();\n }\n if (this.stripLineModule) {\n this.stripLineModule.renderStripLine(this, 'Behind', this.axisCollections);\n }\n return axisElement;\n };\n /**\n * To render the legend\n */\n Chart.prototype.renderLegend = function () {\n if (this.legendModule && this.legendModule.legendCollections.length) {\n this.legendModule.renderLegend(this, this.legendSettings, this.legendModule.legendBounds);\n }\n if (!this.redraw) {\n if (!this.stockChart) {\n this.element.appendChild(this.svgObject);\n }\n else {\n if (!getElement(this.stockChart.chartObject.id)) {\n this.stockChart.mainObject.appendChild(this.svgObject);\n }\n }\n }\n };\n /**\n * To set the left and top position for data label template for center aligned chart\n */\n Chart.prototype.setSecondaryElementPosition = function () {\n var element = getElement(this.element.id + '_Secondary_Element');\n if (!element) {\n return;\n }\n var rect = this.element.getBoundingClientRect();\n var svgRect = getElement(this.svgId).getBoundingClientRect();\n element.style.left = Math.max(svgRect.left - rect.left, 0) + 'px';\n element.style.top = Math.max(svgRect.top - rect.top, 0) + 'px';\n };\n Chart.prototype.initializeModuleElements = function () {\n this.dataLabelCollections = [];\n this.seriesElements = this.renderer.createGroup({ id: this.element.id + 'SeriesCollection' });\n if (this.indicators.length) {\n this.indicatorElements = this.renderer.createGroup({ id: this.element.id + 'IndicatorCollection' });\n }\n if (this.hasTrendlines()) {\n this.trendLineElements = this.renderer.createGroup({ id: this.element.id + 'TrendLineCollection' });\n }\n this.dataLabelElements = this.renderer.createGroup({ id: this.element.id + 'DataLabelCollection' });\n };\n Chart.prototype.hasTrendlines = function () {\n var isTrendline;\n for (var _i = 0, _a = this.series; _i < _a.length; _i++) {\n var series = _a[_i];\n isTrendline = series.trendlines.length ? true : false;\n if (isTrendline) {\n break;\n }\n }\n return isTrendline;\n };\n Chart.prototype.renderSeriesElements = function (axisElement) {\n // Initialize the series elements values\n this.initializeModuleElements();\n if (this.element.tagName !== 'g') {\n var tooltipDiv = redrawElement(this.redraw, this.element.id + '_Secondary_Element') ||\n this.createElement('div');\n tooltipDiv.id = this.element.id + '_Secondary_Element';\n tooltipDiv.setAttribute('style', 'position: relative');\n appendChildElement(this.element, tooltipDiv, this.redraw);\n }\n // For userInteraction\n if (this.tooltip.enable) {\n appendChildElement(this.svgObject, this.renderer.createGroup({ id: this.element.id + '_UserInteraction', style: 'pointer-events:none;' }), this.redraw);\n }\n if (this.rows.length > 0 && this.columns.length > 0) {\n this.initializeIndicator();\n this.initializeTrendLine();\n this.renderSeries();\n this.appendElementsAfterSeries(axisElement);\n }\n };\n /**\n * @private\n */\n Chart.prototype.renderSeries = function () {\n for (var _i = 0, _a = this.visibleSeries; _i < _a.length; _i++) {\n var item = _a[_i];\n if (item.visible) {\n findClipRect(item);\n item.renderSeries(this);\n }\n }\n var options = {\n 'id': this.element.id + '_ChartAreaClipRect_',\n 'x': this.chartAxisLayoutPanel.seriesClipRect.x,\n 'y': this.chartAxisLayoutPanel.seriesClipRect.y,\n 'width': this.chartAxisLayoutPanel.seriesClipRect.width,\n 'height': this.chartAxisLayoutPanel.seriesClipRect.height,\n 'fill': 'transparent',\n 'stroke-width': 1,\n 'stroke': 'Gray'\n };\n this.seriesElements.appendChild(appendClipElement(this.redraw, options, this.renderer));\n appendChildElement(this.svgObject, this.seriesElements, this.redraw);\n };\n Chart.prototype.initializeIndicator = function () {\n for (var _i = 0, _a = this.indicators; _i < _a.length; _i++) {\n var indicator = _a[_i];\n if (this[firstToLowerCase(indicator.type) + 'IndicatorModule']) {\n this[firstToLowerCase(indicator.type) + 'IndicatorModule'].createIndicatorElements(this, indicator, indicator.index);\n }\n }\n if (this.indicatorElements) {\n appendChildElement(this.svgObject, this.indicatorElements, this.redraw);\n }\n };\n Chart.prototype.initializeTrendLine = function () {\n for (var _i = 0, _a = this.visibleSeries; _i < _a.length; _i++) {\n var series = _a[_i];\n if (series.trendlines.length) {\n this.trendLineModule.getTrendLineElements(series, this);\n }\n }\n if (this.trendLineElements) {\n appendChildElement(this.svgObject, this.trendLineElements, this.redraw);\n }\n };\n Chart.prototype.appendElementsAfterSeries = function (axisElement) {\n if (this.chartAreaType === 'PolarRadar') {\n appendChildElement(this.svgObject, this.yAxisElements, this.redraw);\n }\n appendChildElement(this.svgObject, axisElement, this.redraw);\n if ((this.zoomModule && this.zoomSettings.enableScrollbar && this.scrollElement.childElementCount) ||\n (this.scrollElement && this.scrollElement.childElementCount)) {\n appendChildElement(getElement(this.element.id + '_Secondary_Element'), this.scrollElement, this.redraw);\n }\n if (this.stripLineModule) {\n this.stripLineModule.renderStripLine(this, 'Over', this.axisCollections);\n }\n if (!this.tooltip.enable) {\n appendChildElement(this.svgObject, this.renderer.createGroup({ id: this.element.id + '_UserInteraction', style: 'pointer-events:none;' }), this.redraw);\n }\n if (this.stockChart) {\n this.stockChart.calculateStockEvents();\n }\n };\n Chart.prototype.applyZoomkit = function () {\n /**\n * Issue: Zoomkit not visible after performing refresh()\n * Fix: this method called without checking `zoomModule.isZoomed`\n */\n if (!this.redraw && this.zoomModule && (!this.zoomSettings.enablePan || this.zoomModule.performedUI)) {\n this.zoomModule.applyZoomToolkit(this, this.axisCollections);\n }\n };\n /**\n * Render annotation perform here\n * @param redraw\n * @private\n */\n Chart.prototype.renderAnnotation = function () {\n if (this.annotationModule) {\n this.annotationModule.renderAnnotations(getElement(this.element.id + '_Secondary_Element'));\n }\n };\n Chart.prototype.performSelection = function () {\n var selectedDataIndexes = [];\n if (this.selectionModule) {\n selectedDataIndexes = extend([], this.selectionModule.selectedDataIndexes, null, true);\n this.selectionModule.invokeSelection(this);\n }\n if (selectedDataIndexes.length > 0) {\n this.selectionModule.selectedDataIndexes = selectedDataIndexes;\n this.selectionModule.redrawSelection(this, this.selectionMode);\n }\n };\n Chart.prototype.processData = function (render) {\n if (render === void 0) { render = true; }\n var series;\n this.visibleSeriesCount = 0;\n var check = true;\n for (var _i = 0, _a = this.visibleSeries; _i < _a.length; _i++) {\n var series_1 = _a[_i];\n if (!series_1.visible && !this.legendSettings.visible) {\n this.visibleSeriesCount++;\n continue;\n }\n if (series_1.category !== 'Indicator' && series_1.category !== 'TrendLine') {\n this.initializeDataModule(series_1);\n }\n }\n for (var _b = 0, _c = this.indicators; _b < _c.length; _b++) {\n var indicator = _c[_b];\n if (indicator.dataSource) {\n var techIndicator = indicator;\n this.initializeDataModule(techIndicator);\n check = false;\n }\n }\n if (render && (!this.visibleSeries.length || this.visibleSeriesCount === this.visibleSeries.length && check)) {\n this.refreshBound();\n this.trigger('loaded', { chart: this });\n }\n };\n Chart.prototype.initializeDataModule = function (series) {\n series.xData = [];\n series.yData = [];\n series.dataModule = new Data(series.dataSource || this.dataSource, series.query);\n series.points = [];\n series.refreshDataManager(this);\n };\n Chart.prototype.calculateBounds = function () {\n var margin = this.margin;\n // Title Height;\n var titleHeight = 0;\n var subTitleHeight = 0;\n var titleWidth = 0;\n var padding = 15;\n var left = margin.left;\n var width = this.availableSize.width - left - margin.right - this.border.width;\n this.titleCollection = [];\n this.subTitleCollection = [];\n if (this.title) {\n this.titleCollection = getTitle(this.title, this.titleStyle, width);\n titleHeight = (measureText(this.title, this.titleStyle).height * this.titleCollection.length) + padding;\n if (this.subTitle) {\n var maxWidth = 0;\n for (var _i = 0, _a = this.titleCollection; _i < _a.length; _i++) {\n var titleText = _a[_i];\n titleWidth = measureText(titleText, this.titleStyle).width;\n maxWidth = titleWidth > maxWidth ? titleWidth : maxWidth;\n }\n this.subTitleCollection = getTitle(this.subTitle, this.subTitleStyle, maxWidth);\n subTitleHeight = (measureText(this.subTitle, this.subTitleStyle).height * this.subTitleCollection.length) +\n padding;\n }\n }\n var top = margin.top + subTitleHeight + titleHeight + this.chartArea.border.width / 2;\n var height = this.availableSize.height - top - this.border.width - margin.bottom;\n this.initialClipRect = new Rect(left, top, width, height);\n if (this.legendModule) {\n this.legendModule.calculateLegendBounds(this.initialClipRect, this.availableSize);\n }\n this.chartAxisLayoutPanel.measureAxis(this.initialClipRect);\n };\n /**\n * Handles the print method for chart control.\n */\n Chart.prototype.print = function (id) {\n var exportChart = new ExportUtils(this);\n exportChart.print(id);\n };\n /**\n * Defines the trendline initialization\n */\n Chart.prototype.initTrendLines = function () {\n for (var _i = 0, _a = this.visibleSeries; _i < _a.length; _i++) {\n var series = _a[_i];\n var trendIndex = 0;\n for (var _b = 0, _c = series.trendlines; _b < _c.length; _b++) {\n var trendline = _c[_b];\n var trendLine = trendline;\n var type = firstToLowerCase(trendLine.type);\n if (this.trendLineModule) {\n trendLine.index = trendIndex;\n trendLine.sourceIndex = series.index;\n this.trendLineModule.initSeriesCollection(trendLine, this);\n if (trendLine.targetSeries) {\n trendLine.targetSeries.xAxisName = series.xAxisName;\n trendLine.targetSeries.yAxisName = series.yAxisName;\n this.visibleSeries.push(trendLine.targetSeries);\n }\n }\n trendIndex++;\n }\n }\n };\n Chart.prototype.calculateAreaType = function () {\n var series = this.series[0];\n this.chartArea.border.width = this.stockChart ? 0 : this.chartArea.border.width;\n if (series) {\n this.requireInvertedAxis = ((series.type.indexOf('Bar') !== -1) && !this.isTransposed) ||\n ((series.type.indexOf('Bar') === -1) && this.isTransposed && this.chartAreaType !== 'PolarRadar');\n }\n this.chartAxisLayoutPanel = this.chartAreaType === 'PolarRadar' ? (this.polarSeriesModule || this.radarSeriesModule)\n : new CartesianAxisLayoutPanel(this);\n };\n /**\n * Calculate the visible axis\n * @private\n */\n Chart.prototype.calculateVisibleAxis = function () {\n var axis;\n var series;\n var axes = [this.primaryXAxis, this.primaryYAxis];\n axes = this.chartAreaType === 'Cartesian' ? axes.concat(this.axes) : axes;\n if (this.paretoSeriesModule && this.series[0].type === 'Pareto') {\n axes = axes.concat(this.paretoSeriesModule.paretoAxes);\n }\n this.axisCollections = [];\n if (this.zoomModule) {\n this.zoomModule.isPanning = this.zoomModule.isAxisZoomed(axes) && this.zoomSettings.enablePan;\n this.svgObject.setAttribute('cursor', this.zoomModule.isPanning ? 'pointer' : 'auto');\n if (this.scrollBarModule) {\n this.scrollBarModule.axes = axes;\n }\n }\n if (this.scrollSettingEnabled) {\n if (this.scrollBarModule) {\n this.scrollBarModule.axes = axes;\n }\n }\n for (var i = 0, len = axes.length; i < len; i++) {\n axis = axes[i];\n axis.series = [];\n axis.labels = [];\n for (var _i = 0, _a = this.visibleSeries; _i < _a.length; _i++) {\n var series_2 = _a[_i];\n this.initAxis(series_2, axis, true);\n }\n for (var _b = 0, _c = this.indicators; _b < _c.length; _b++) {\n var indicator = _c[_b];\n this.initAxis(indicator, axis, false);\n }\n if (this.scrollBarModule && !axis.zoomingScrollBar) {\n this.scrollBarModule.injectTo(axis, this);\n }\n if (axis.orientation != null) {\n this.axisCollections.push(axis);\n }\n }\n if (this.rows.length > 0 && this.columns.length > 0) {\n this.chartAxisLayoutPanel.measure();\n }\n };\n Chart.prototype.initAxis = function (series, axis, isSeries) {\n if (series.xAxisName === axis.name || (series.xAxisName == null && axis.name === 'primaryXAxis')) {\n axis.orientation = this.requireInvertedAxis ? 'Vertical' : 'Horizontal';\n series.xAxis = axis;\n if (isSeries) {\n axis.series.push(series);\n }\n }\n else if (series.yAxisName === axis.name || (series.yAxisName == null && axis.name === 'primaryYAxis')) {\n axis.orientation = this.requireInvertedAxis ? 'Horizontal' : 'Vertical';\n series.yAxis = axis;\n if (isSeries) {\n axis.series.push(series);\n }\n }\n };\n Chart.prototype.initTechnicalIndicators = function () {\n var i = 0;\n for (var _i = 0, _a = this.indicators; _i < _a.length; _i++) {\n var indicator = _a[_i];\n var techIndicator = indicator;\n var type = firstToLowerCase(techIndicator.type);\n if (this[type + 'IndicatorModule']) {\n techIndicator.index = i;\n this[type + 'IndicatorModule'].initSeriesCollection(techIndicator, this);\n for (var _b = 0, _c = techIndicator.targetSeries; _b < _c.length; _b++) {\n var targetSeries = _c[_b];\n if (indicator.seriesName || indicator.dataSource) {\n this.visibleSeries.push(targetSeries);\n }\n }\n }\n i++;\n }\n };\n /** @private */\n Chart.prototype.refreshTechnicalIndicator = function (series) {\n if (this.indicators.length) {\n var targetIndicator = null;\n if (series instanceof Series && series.category !== 'Indicator') {\n for (var _i = 0, _a = this.indicators; _i < _a.length; _i++) {\n var indicator = _a[_i];\n if (indicator.seriesName === series.name && !indicator.dataSource) {\n targetIndicator = indicator;\n targetIndicator.setDataSource(series, this);\n }\n }\n }\n else if (series instanceof TechnicalIndicator) {\n targetIndicator = series;\n targetIndicator.setDataSource(series instanceof Series ? series : null, this);\n }\n }\n };\n Chart.prototype.calculateVisibleSeries = function () {\n var series;\n this.visibleSeries = [];\n var colors = this.palettes.length ? this.palettes : getSeriesColor(this.theme);\n var count = colors.length;\n for (var i = 0, len = this.series.length; i < len; i++) {\n series = this.series[i];\n // for y axis label issue during chart navigation\n series.category = this.series[0].type === 'Pareto' ? 'Pareto' : 'Series';\n series.index = i;\n series.interior = series.fill || colors[i % count];\n switch (series.type) {\n case 'Bar':\n case 'StackingBar':\n case 'StackingBar100':\n if (this.series[0].type.indexOf('Bar') === -1) {\n continue;\n }\n break;\n case 'Polar':\n case 'Radar':\n if (this.chartAreaType !== 'PolarRadar') {\n continue;\n }\n if (this.chartAreaType === 'PolarRadar' && ((series.xAxisName === null && series.yAxisName !== null) ||\n (series.xAxisName !== null && series.yAxisName === null) ||\n (series.xAxisName !== null && series.yAxisName !== null))) {\n continue;\n }\n break;\n case 'Pareto':\n this.visibleSeries.push(series);\n this.paretoSeriesModule.initSeries(series, this);\n continue;\n default:\n if (this.chartAreaType === 'PolarRadar' || this.series[0].type.indexOf('Bar') > -1) {\n continue;\n }\n break;\n }\n this.visibleSeries.push(series);\n this.series[i] = series;\n }\n };\n Chart.prototype.renderTitle = function () {\n var rect;\n var margin = this.margin;\n if (this.title) {\n var alignment = this.titleStyle.textAlignment;\n var getAnchor = alignment === 'Near' ? 'start' : alignment === 'Far' ? 'end' : 'middle';\n this.elementSize = measureText(this.title, this.titleStyle);\n rect = new Rect(margin.left, 0, this.availableSize.width - margin.left - margin.right, 0);\n var options = new TextOption(this.element.id + '_ChartTitle', titlePositionX(rect, this.titleStyle), this.margin.top + ((this.elementSize.height) * 3 / 4), getAnchor, this.titleCollection, '', 'auto');\n var element = redrawElement(this.redraw, this.element.id + '_ChartTitle', options, this.renderer) ||\n textElement(options, this.titleStyle, this.titleStyle.color || this.themeStyle.chartTitle, this.svgObject);\n element.setAttribute('aria-label', this.description || this.title);\n element.setAttribute('tabindex', this.tabIndex.toString());\n if (this.subTitle) {\n this.renderSubTitle(options);\n }\n }\n };\n Chart.prototype.renderSubTitle = function (options) {\n var maxWidth = 0;\n var titleWidth = 0;\n var padding = 10;\n var rect;\n var anchor = function (alignment) {\n return alignment === 'Near' ? 'start' : alignment === 'Far' ? 'end' : 'middle';\n };\n var alignment = this.titleStyle.textAlignment;\n for (var _i = 0, _a = this.titleCollection; _i < _a.length; _i++) {\n var titleText = _a[_i];\n titleWidth = measureText(titleText, this.titleStyle).width;\n maxWidth = titleWidth > maxWidth ? titleWidth : maxWidth;\n }\n var subTitleElementSize = measureText(this.subTitle, this.subTitleStyle);\n rect = new Rect(alignment === 'Center' ? (options.x - maxWidth / 2) : alignment === 'Far' ? options.x - maxWidth : options.x, 0, maxWidth, 0);\n var subTitleOptions = new TextOption(this.element.id + '_ChartSubTitle', titlePositionX(rect, this.subTitleStyle), options.y * options.text.length + ((subTitleElementSize.height) * 3 / 4) + padding, anchor(this.subTitleStyle.textAlignment), this.subTitleCollection, '', 'auto');\n var element = redrawElement(this.redraw, this.element.id + '_ChartSubTitle', subTitleOptions, this.renderer) ||\n textElement(subTitleOptions, this.subTitleStyle, this.subTitleStyle.color || this.themeStyle.chartTitle, this.svgObject);\n element.setAttribute('aria-label', this.description || this.subTitle);\n element.setAttribute('tabindex', this.tabIndex.toString());\n };\n Chart.prototype.renderBorder = function () {\n var width = this.border.width;\n var rect = new RectOption(this.element.id + '_ChartBorder', this.background || this.themeStyle.background, this.border, 1, new Rect(width / 2, width / 2, this.availableSize.width - width, this.availableSize.height - width));\n this.htmlObject = redrawElement(this.redraw, this.element.id + '_ChartBorder', rect, this.renderer)\n || this.renderer.drawRectangle(rect);\n appendChildElement(this.svgObject, this.htmlObject, this.redraw);\n };\n /**\n * @private\n */\n Chart.prototype.renderAreaBorder = function () {\n if (this.chartAreaType === 'PolarRadar') {\n return null;\n }\n else {\n var element = getElement(this.element.id + '_ChartAreaBorder');\n var previousRect = element ?\n new Rect(+element.getAttribute('x'), +element.getAttribute('y'), +element.getAttribute('width'), +element.getAttribute('height')) : null;\n var rect = new RectOption(this.element.id + '_ChartAreaBorder', this.chartArea.background, { width: this.chartArea.border.width, color: this.chartArea.border.color || this.themeStyle.areaBorder }, this.chartArea.opacity, this.chartAxisLayoutPanel.seriesClipRect);\n this.htmlObject = this.renderer.drawRectangle(rect);\n appendChildElement(this.svgObject, this.htmlObject, this.redraw, true, 'x', 'y', null, null, true, true, previousRect);\n }\n };\n /**\n * To add series for the chart\n * @param {SeriesModel[]} seriesCollection - Defines the series collection to be added in chart.\n * @return {void}.\n */\n Chart.prototype.addSeries = function (seriesCollection) {\n for (var _i = 0, seriesCollection_1 = seriesCollection; _i < seriesCollection_1.length; _i++) {\n var series = seriesCollection_1[_i];\n series = new Series(this, 'series', series);\n this.series.push(series);\n }\n this.refresh();\n };\n /**\n * To Remove series for the chart\n * @param index - Defines the series index to be remove in chart series\n * @return {void}\n */\n Chart.prototype.removeSeries = function (index) {\n this.series.splice(index, 1);\n this.refresh();\n };\n /**\n * To destroy the widget\n * @method destroy\n * @return {void}.\n * @member of Chart\n */\n Chart.prototype.destroy = function () {\n if (this.scrollBarModule) {\n this.scrollBarModule.destroy();\n }\n this.unWireEvents();\n _super.prototype.destroy.call(this);\n this.element.classList.remove('e-chart');\n };\n /**\n * Get component name\n */\n Chart.prototype.getModuleName = function () {\n return 'chart';\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @private\n */\n Chart.prototype.getPersistData = function () {\n var keyEntity = ['loaded', 'animationComplete', 'primaryXAxis', 'primaryYAxis'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Method to create SVG element.\n */\n Chart.prototype.createChartSvg = function () {\n this.removeSvg();\n createSvg(this);\n };\n /**\n * Method to bind events for chart\n */\n Chart.prototype.unWireEvents = function () {\n /*! Find the Events type */\n var startEvent = Browser.touchStartEvent;\n var moveEvent = Browser.touchMoveEvent;\n var stopEvent = Browser.touchEndEvent;\n var cancelEvent = Browser.isPointer ? 'pointerleave' : 'mouseleave';\n /*! UnBind the Event handler */\n EventHandler.remove(this.element, startEvent, this.chartOnMouseDown);\n EventHandler.remove(this.element, moveEvent, this.mouseMove);\n EventHandler.remove(this.element, stopEvent, this.mouseEnd);\n EventHandler.remove(this.element, 'click', this.chartOnMouseClick);\n EventHandler.remove(this.element, 'contextmenu', this.chartRightClick);\n EventHandler.remove(this.element, cancelEvent, this.mouseLeave);\n window.removeEventListener((Browser.isTouch && ('orientation' in window && 'onorientationchange' in window)) ? 'orientationchange' : 'resize', this.chartResize);\n /**\n * To fix memory issue\n */\n if (this.touchObject) {\n this.touchObject.destroy();\n }\n };\n Chart.prototype.wireEvents = function () {\n /*! Find the Events type */\n var cancelEvent = Browser.isPointer ? 'pointerleave' : 'mouseleave';\n /*! Bind the Event handler */\n EventHandler.add(this.element, Browser.touchStartEvent, this.chartOnMouseDown, this);\n EventHandler.add(this.element, Browser.touchMoveEvent, this.mouseMove, this);\n EventHandler.add(this.element, Browser.touchEndEvent, this.mouseEnd, this);\n EventHandler.add(this.element, 'click', this.chartOnMouseClick, this);\n EventHandler.add(this.element, 'contextmenu', this.chartRightClick, this);\n EventHandler.add(this.element, cancelEvent, this.mouseLeave, this);\n window.addEventListener((Browser.isTouch && ('orientation' in window && 'onorientationchange' in window)) ? 'orientationchange' : 'resize', this.chartResize.bind(this));\n this.longPress = this.longPress.bind(this);\n this.touchObject = new Touch(this.element, { tapHold: this.longPress, tapHoldThreshold: 500 });\n /*! Apply the style for chart */\n this.setStyle(this.element);\n };\n Chart.prototype.chartRightClick = function (event) {\n if (this.crosshair.enable && this.crosshairModule &&\n (event.buttons === 2 || event.which === 0 || event.pointerType === 'touch')) {\n event.preventDefault();\n event.stopPropagation();\n return false;\n }\n return true;\n };\n Chart.prototype.setStyle = function (element) {\n var zooming = this.zoomSettings;\n var disableScroll = zooming.enableSelectionZooming || zooming.enablePinchZooming ||\n this.selectionMode !== 'None' || this.crosshair.enable;\n element.style.touchAction = disableScroll ? 'none' : 'element';\n element.style.msTouchAction = disableScroll ? 'none' : 'element';\n element.style.msContentZooming = 'none';\n element.style.msUserSelect = 'none';\n element.style.webkitUserSelect = 'none';\n element.style.position = 'relative';\n element.style.display = 'block';\n };\n /**\n * Finds the orientation.\n * @return {boolean}\n * @private\n */\n Chart.prototype.isOrientation = function () {\n return ('orientation' in window && 'onorientationchange' in window);\n };\n /**\n * Handles the long press on chart.\n * @return {boolean}\n * @private\n */\n Chart.prototype.longPress = function (e) {\n this.mouseX = (e && e.originalEvent.changedTouches) ? (e.originalEvent.changedTouches[0].clientX) : 0;\n this.mouseY = (e && e.originalEvent.changedTouches) ? (e.originalEvent.changedTouches[0].clientY) : 0;\n this.startMove = true;\n this.setMouseXY(this.mouseX, this.mouseY);\n this.notify('tapHold', e);\n return false;\n };\n /**\n * To find mouse x, y for aligned chart element svg position\n */\n Chart.prototype.setMouseXY = function (pageX, pageY) {\n var svgRect = getElement(this.svgId).getBoundingClientRect();\n var rect = this.element.getBoundingClientRect();\n this.mouseY = (pageY - rect.top) - Math.max(svgRect.top - rect.top, 0);\n this.mouseX = (pageX - rect.left) - Math.max(svgRect.left - rect.left, 0);\n };\n /**\n * Export method for the chart.\n * @return {boolean}\n * @private\n */\n // tslint:disable-next-line\n Chart.prototype.export = function (type, fileName) { };\n /**\n * Handles the chart resize.\n * @return {boolean}\n * @private\n */\n Chart.prototype.chartResize = function (e) {\n var _this = this;\n this.animateSeries = false;\n var arg = {\n chart: this,\n name: resized,\n currentSize: new Size(0, 0),\n previousSize: new Size(this.availableSize.width, this.availableSize.height),\n };\n if (this.resizeTo) {\n clearTimeout(this.resizeTo);\n }\n this.resizeTo = setTimeout(function () {\n if (_this.isDestroyed || _this.stockChart) {\n clearTimeout(_this.resizeTo);\n return;\n }\n _this.createChartSvg();\n arg.currentSize = _this.availableSize;\n _this.trigger(resized, arg);\n _this.refreshAxis();\n _this.refreshBound();\n _this.trigger('loaded', { chart: _this });\n }, 500);\n return false;\n };\n /**\n * Handles the mouse move.\n * @return {boolean}\n * @private\n */\n Chart.prototype.mouseMove = function (e) {\n var pageX;\n var pageY;\n var touchArg;\n if (e.type === 'touchmove') {\n this.isTouch = true;\n touchArg = e;\n pageX = touchArg.changedTouches[0].clientX;\n pageY = touchArg.changedTouches[0].clientY;\n }\n else {\n this.isTouch = e.pointerType === 'touch' || e.pointerType === '2' || this.isTouch;\n pageX = e.clientX;\n pageY = e.clientY;\n }\n this.setMouseXY(pageX, pageY);\n this.chartOnMouseMove(e);\n return false;\n };\n /**\n * Handles the mouse leave.\n * @return {boolean}\n * @private\n */\n Chart.prototype.mouseLeave = function (e) {\n var pageX;\n var pageY;\n var touchArg;\n if (e.type === 'touchleave') {\n this.isTouch = true;\n touchArg = e;\n pageX = touchArg.changedTouches[0].clientX;\n pageY = touchArg.changedTouches[0].clientY;\n }\n else {\n this.isTouch = e.pointerType === 'touch' || e.pointerType === '2';\n pageX = e.clientX;\n pageY = e.clientY;\n }\n this.setMouseXY(pageX, pageY);\n this.chartOnMouseLeave(e);\n return false;\n };\n /**\n * Handles the mouse leave on chart.\n * @return {boolean}\n * @private\n */\n Chart.prototype.chartOnMouseLeave = function (e) {\n var element = e.target;\n var cancelEvent = Browser.isPointer ? 'pointerleave' : 'mouseleave';\n this.trigger(chartMouseLeave, { target: element.id, x: this.mouseX, y: this.mouseY });\n this.isChartDrag = false;\n this.notify(cancelEvent, e);\n return false;\n };\n /**\n * Handles the mouse click on chart.\n * @return {boolean}\n * @private\n */\n Chart.prototype.chartOnMouseClick = function (e) {\n var element = e.target;\n this.trigger(chartMouseClick, { target: element.id, x: this.mouseX, y: this.mouseY });\n if (this.pointClick) {\n this.triggerPointEvent(pointClick);\n }\n this.notify('click', e);\n return false;\n };\n Chart.prototype.triggerPointEvent = function (event) {\n var data = new ChartData(this);\n var pointData = data.getData();\n if (pointData.series && pointData.point) {\n this.trigger(event, {\n series: pointData.series,\n point: pointData.point,\n seriesIndex: pointData.series.index, pointIndex: pointData.point.index,\n x: this.mouseX, y: this.mouseY\n });\n }\n };\n /**\n * Handles the mouse move on chart.\n * @return {boolean}\n * @private\n */\n Chart.prototype.chartOnMouseMove = function (e) {\n var element = e.target;\n this.trigger(chartMouseMove, { target: element.id, x: this.mouseX, y: this.mouseY });\n if (this.pointMove) {\n this.triggerPointEvent(pointMove);\n }\n // Tooltip for chart series.\n if (!this.isTouch) {\n this.titleTooltip(e, this.mouseX, this.mouseY);\n this.axisTooltip(e, this.mouseX, this.mouseY);\n }\n this.notify(Browser.touchMoveEvent, e);\n this.isTouch = false;\n return false;\n };\n Chart.prototype.titleTooltip = function (event, x, y, isTouch) {\n var targetId = event.target.id;\n var id = (targetId === (this.element.id + '_ChartTitle') || targetId === (this.element.id + '_ChartSubTitle'));\n if (id && (event.target.textContent.indexOf('...') > -1)) {\n var title = (targetId === (this.element.id + '_ChartTitle')) ? this.title : this.subTitle;\n showTooltip(title, x, y, this.element.offsetWidth, this.element.id + '_EJ2_Title_Tooltip', getElement(this.element.id + '_Secondary_Element'), isTouch);\n }\n else {\n removeElement(this.element.id + '_EJ2_Title_Tooltip');\n }\n };\n Chart.prototype.axisTooltip = function (event, x, y, isTouch) {\n var targetId = event.target.id;\n if (((targetId.indexOf('AxisLabel') > -1) || targetId.indexOf('Axis_MultiLevelLabel') > -1) &&\n (event.target.textContent.indexOf('...') > -1)) {\n showTooltip(this.findAxisLabel(targetId), x, y, this.element.offsetWidth, this.element.id + '_EJ2_AxisLabel_Tooltip', getElement(this.element.id + '_Secondary_Element'), isTouch);\n }\n else {\n removeElement(this.element.id + '_EJ2_AxisLabel_Tooltip');\n }\n };\n Chart.prototype.findAxisLabel = function (text) {\n var texts;\n if (text.indexOf('AxisLabel') > -1) {\n texts = ((text.replace(this.element.id, '')).replace('AxisLabel_', '')).split('_');\n return this.axisCollections[parseInt(texts[0], 10)].visibleLabels[parseInt(texts[1], 10)].originalText;\n }\n else {\n texts = ((text.replace(this.element.id, '')).replace('Axis_MultiLevelLabel_Level_', '').replace('Text_', '')).split('_');\n return (this.axisCollections[parseInt(texts[0], 10)].multiLevelLabels[parseInt(texts[1], 10)]\n .categories[parseInt(texts[2], 10)].text);\n }\n };\n /**\n * Handles the mouse down on chart.\n * @return {boolean}\n * @private\n */\n Chart.prototype.chartOnMouseDown = function (e) {\n var pageX;\n var pageY;\n var target;\n var touchArg;\n var offset = Browser.isDevice ? 20 : 30;\n var rect = this.element.getBoundingClientRect();\n var element = e.target;\n this.trigger(chartMouseDown, { target: element.id, x: this.mouseX, y: this.mouseY });\n if (e.type === 'touchstart') {\n this.isTouch = true;\n touchArg = e;\n pageX = touchArg.changedTouches[0].clientX;\n pageY = touchArg.changedTouches[0].clientY;\n target = touchArg.target;\n }\n else {\n this.isTouch = e.pointerType === 'touch';\n pageX = e.clientX;\n pageY = e.clientY;\n target = e.target;\n }\n var svgRect = getElement(this.svgId).getBoundingClientRect();\n this.mouseDownX = this.previousMouseMoveX = (pageX - rect.left) - Math.max(svgRect.left - rect.left, 0);\n this.mouseDownY = this.previousMouseMoveY = (pageY - rect.top) - Math.max(svgRect.top - rect.top, 0);\n if (this.isTouch) {\n this.isDoubleTap = (new Date().getTime() < this.threshold && target.id.indexOf(this.element.id + '_Zooming_') === -1 &&\n (this.mouseDownX - offset >= this.mouseX || this.mouseDownX + offset >= this.mouseX) &&\n (this.mouseDownY - offset >= this.mouseY || this.mouseDownY + offset >= this.mouseY) &&\n (this.mouseX - offset >= this.mouseDownX || this.mouseX + offset >= this.mouseDownX) &&\n (this.mouseY - offset >= this.mouseDownY || this.mouseY + offset >= this.mouseDownY));\n }\n this.notify(Browser.touchStartEvent, e);\n return false;\n };\n /**\n * Handles the mouse up.\n * @return {boolean}\n * @private\n */\n Chart.prototype.mouseEnd = function (e) {\n var pageY;\n var pageX;\n var touchArg;\n if (e.type === 'touchend') {\n touchArg = e;\n pageX = touchArg.changedTouches[0].clientX;\n this.isTouch = true;\n pageY = touchArg.changedTouches[0].clientY;\n }\n else {\n pageY = e.clientY;\n pageX = e.clientX;\n this.isTouch = e.pointerType === 'touch' || e.pointerType === '2';\n }\n this.setMouseXY(pageX, pageY);\n this.chartOnMouseUp(e);\n return false;\n };\n /**\n * Handles the mouse up.\n * @return {boolean}\n * @private\n */\n Chart.prototype.chartOnMouseUp = function (e) {\n var element = e.target;\n this.trigger(chartMouseUp, { target: element.id, x: this.mouseX, y: this.mouseY });\n this.isChartDrag = false;\n if (this.isTouch) {\n this.titleTooltip(e, this.mouseX, this.mouseY, this.isTouch);\n this.axisTooltip(e, this.mouseX, this.mouseY, this.isTouch);\n this.threshold = new Date().getTime() + 300;\n }\n this.seriesElements.removeAttribute('clip-path');\n this.notify(Browser.touchEndEvent, e);\n return false;\n };\n /**\n * Method to set culture for chart\n */\n Chart.prototype.setCulture = function () {\n this.intl = new Internationalization();\n this.setLocaleConstants();\n this.localeObject = new L10n(this.getModuleName(), this.defaultLocalConstants, this.locale);\n };\n /**\n * Method to set the annotation content dynamically for chart.\n */\n Chart.prototype.setAnnotationValue = function (annotationIndex, content) {\n var parentNode = getElement(this.element.id + '_Annotation_Collections');\n var annotation = this.annotations[annotationIndex];\n var element;\n if (content !== null) {\n annotation.content = content;\n if (parentNode) {\n removeElement(this.element.id + '_Annotation_' + annotationIndex);\n element = this.createElement('div');\n this.annotationModule.processAnnotation(annotation, annotationIndex, element);\n parentNode.appendChild(element.children[0]);\n }\n else {\n this.annotationModule.renderAnnotations(getElement(this.element.id + '_Secondary_Element'));\n }\n }\n };\n /**\n * Method to set locale constants\n */\n Chart.prototype.setLocaleConstants = function () {\n this.defaultLocalConstants = {\n ZoomIn: 'ZoomIn',\n Zoom: 'Zoom',\n ZoomOut: 'ZoomOut',\n Pan: 'Pan',\n Reset: 'Reset',\n ResetZoom: 'Reset Zoom'\n };\n };\n /**\n * Theming for chart\n */\n Chart.prototype.setTheme = function () {\n /*! Set theme */\n this.themeStyle = getThemeColor(this.theme);\n };\n /**\n * To provide the array of modules needed for control rendering\n * @return {ModuleDeclaration[]}\n * @private\n */\n //tslint:disable:max-func-body-length\n Chart.prototype.requiredModules = function () {\n var _this = this;\n var modules = [];\n var series = this.series;\n var enableAnnotation = false;\n var moduleName;\n var errorBarVisible = false;\n var dataLabelEnable = false;\n var zooming = this.zoomSettings;\n this.chartAreaType = (series.length > 0 && (series[0].type === 'Polar' || series[0].type === 'Radar')) ? 'PolarRadar' : 'Cartesian';\n if (this.tooltip.enable) {\n modules.push({\n member: 'Tooltip',\n args: [this]\n });\n }\n series.map(function (value) {\n _this.isLegend = (_this.legendSettings.visible && ((value.name !== '') || !!_this.isLegend));\n moduleName = value.type.indexOf('100') !== -1 ? value.type.replace('100', '') + 'Series' : value.type + 'Series';\n errorBarVisible = value.errorBar.visible || errorBarVisible;\n dataLabelEnable = value.marker.dataLabel.visible || dataLabelEnable;\n if (!modules.some(function (currentModule) {\n return currentModule.member === moduleName;\n })) {\n modules.push({\n member: moduleName,\n args: [_this, series]\n });\n }\n if (_this.chartAreaType === 'PolarRadar') {\n modules.push({\n member: value.drawType + 'Series',\n args: [_this, series]\n });\n }\n if (value.type === 'Pareto') {\n modules.push({\n member: 'ColumnSeries',\n args: [_this, series]\n });\n modules.push({\n member: 'LineSeries',\n args: [_this, series]\n });\n }\n });\n this.findIndicatorModules(modules);\n this.findTrendLineModules(modules);\n modules = this.findAxisModule(modules);\n enableAnnotation = this.annotations.some(function (value) {\n return (value.content !== null);\n });\n if (errorBarVisible) {\n modules.push({\n member: 'ErrorBar',\n args: [this, series]\n });\n }\n if (this.isLegend) {\n modules.push({\n member: 'Legend',\n args: [this]\n });\n }\n if (this.enableExport) {\n modules.push({\n member: 'Export',\n args: [this]\n });\n }\n if (this.chartAreaType !== 'PolarRadar' && !this.scrollSettingEnabled && (zooming.enableSelectionZooming\n || zooming.enableMouseWheelZooming || zooming.enablePinchZooming || zooming.enablePan)) {\n modules.push({\n member: 'Zoom',\n args: [this, this.zoomSettings]\n });\n if (zooming.enableScrollbar) {\n modules.push({\n member: 'ScrollBar',\n args: [this]\n });\n }\n }\n if (this.selectionMode !== 'None' && !(this.chartAreaType === 'PolarRadar' &&\n this.selectionMode.indexOf('Drag') > -1)) {\n modules.push({\n member: 'Selection',\n args: [this]\n });\n }\n if (dataLabelEnable) {\n modules.push({\n member: 'DataLabel',\n args: [this, series]\n });\n }\n if (enableAnnotation) {\n modules.push({\n member: 'Annotation',\n args: [this]\n });\n }\n if (this.chartAreaType !== 'PolarRadar' && this.crosshair.enable) {\n modules.push({\n member: 'Crosshair',\n args: [this]\n });\n }\n return modules;\n };\n Chart.prototype.findAxisModule = function (modules) {\n var axisCollections = [];\n axisCollections.push(this.primaryXAxis);\n axisCollections.push(this.primaryYAxis);\n axisCollections = axisCollections.concat(this.axes);\n var datetimeEnabled = false;\n var categoryEnabled = false;\n var logarithmicEnabled = false;\n var striplineEnabled = false;\n var dateTimeCategoryEnabled = false;\n var multiLevelEnabled = false;\n for (var _i = 0, axisCollections_1 = axisCollections; _i < axisCollections_1.length; _i++) {\n var axis = axisCollections_1[_i];\n datetimeEnabled = axis.valueType === 'DateTime' || datetimeEnabled;\n categoryEnabled = axis.valueType === 'Category' || categoryEnabled;\n logarithmicEnabled = axis.valueType === 'Logarithmic' || logarithmicEnabled;\n dateTimeCategoryEnabled = axis.valueType === 'DateTimeCategory' || dateTimeCategoryEnabled;\n striplineEnabled = this.findStriplineVisibility(axis.stripLines) || striplineEnabled;\n multiLevelEnabled = axis.multiLevelLabels.length > 0 || multiLevelEnabled;\n this.scrollSettingEnabled = axis.scrollbarSettings.enable ? true : this.scrollSettingEnabled;\n }\n if (datetimeEnabled) {\n modules.push({\n member: 'DateTime',\n args: [this]\n });\n }\n if (categoryEnabled) {\n modules.push({\n member: 'Category',\n args: [this]\n });\n }\n if (logarithmicEnabled) {\n modules.push({\n member: 'Logarithmic',\n args: [this]\n });\n }\n if (striplineEnabled) {\n modules.push({\n member: 'StripLine',\n args: [this]\n });\n }\n if (multiLevelEnabled) {\n modules.push({\n member: 'MultiLevelLabel',\n args: [this]\n });\n }\n if (dateTimeCategoryEnabled) {\n modules.push({\n member: 'DateTimeCategory',\n args: [this]\n });\n }\n if (this.scrollSettingEnabled) {\n modules.push({\n member: 'ScrollBar',\n args: [this]\n });\n }\n return modules;\n };\n Chart.prototype.findIndicatorModules = function (modules) {\n var macdEnable;\n var bandEnable;\n var indicators = this.indicators;\n if (this.indicators.length) {\n modules.push({\n member: 'LineSeries',\n args: [this]\n });\n indicators.map(function (indicator) {\n macdEnable = macdEnable || indicator.type === 'Macd';\n bandEnable = bandEnable || indicator.type === 'BollingerBands';\n });\n if (macdEnable) {\n modules.push({\n member: 'ColumnSeries',\n args: [this]\n });\n }\n if (bandEnable) {\n modules.push({\n member: 'RangeAreaSeries',\n args: [this]\n });\n }\n for (var _i = 0, _a = this.indicators; _i < _a.length; _i++) {\n var indicator = _a[_i];\n modules.push({\n member: indicator.type + 'Indicator',\n args: [this]\n });\n }\n }\n };\n Chart.prototype.findTrendLineModules = function (modules) {\n var isLine;\n var isSpline;\n var _loop_1 = function (series) {\n var markerEnable;\n series.trendlines.map(function (trendline) {\n markerEnable = markerEnable || trendline.marker.visible;\n isLine = isLine || (trendline.type === 'Linear' || trendline.type === 'MovingAverage') ? true : false;\n isSpline = isSpline || !isLine ? true : false;\n });\n if (markerEnable) {\n modules.push({\n member: 'Marker',\n args: [this_1, series]\n });\n }\n };\n var this_1 = this;\n for (var _i = 0, _a = this.series; _i < _a.length; _i++) {\n var series = _a[_i];\n _loop_1(series);\n }\n if (isLine || isSpline) {\n modules.push({\n member: 'TrendLine',\n args: [this]\n });\n }\n if (isLine) {\n modules.push({\n member: 'LineSeries',\n args: [this]\n });\n }\n if (isSpline) {\n modules.push({\n member: 'SplineSeries',\n args: [this]\n });\n }\n };\n Chart.prototype.findStriplineVisibility = function (striplines) {\n var visible = false;\n for (var _i = 0, striplines_1 = striplines; _i < striplines_1.length; _i++) {\n var stripline = striplines_1[_i];\n if (stripline.visible) {\n visible = true;\n break;\n }\n }\n return visible;\n };\n /**\n * To Remove the SVG.\n * @return {boolean}\n * @private\n */\n Chart.prototype.removeSvg = function () {\n if (this.redraw) {\n return null;\n }\n if (document.getElementById(this.element.id + '_Secondary_Element')) {\n remove(document.getElementById(this.element.id + '_Secondary_Element'));\n }\n var removeLength = 0;\n if (this.zoomModule && this.zoomModule.pinchTarget) {\n this.zoomModule.pinchTarget.id = '';\n this.zoomModule.pinchTarget.setAttribute('opacity', '0');\n this.svgObject.appendChild(this.zoomModule.pinchTarget);\n removeLength = 1;\n }\n if (this.svgObject) {\n while (this.svgObject.childNodes.length > removeLength) {\n this.svgObject.removeChild(this.svgObject.firstChild);\n }\n if (!this.svgObject.hasChildNodes() && this.svgObject.parentNode && !(this.stockChart)) {\n remove(this.svgObject);\n }\n }\n };\n Chart.prototype.refreshDefinition = function (definitions) {\n for (var _i = 0, definitions_1 = definitions; _i < definitions_1.length; _i++) {\n var item = definitions_1[_i];\n item.axes = [];\n }\n };\n /**\n * Refresh the axis default value.\n * @return {boolean}\n * @private\n */\n Chart.prototype.refreshAxis = function () {\n var axis = this.primaryXAxis;\n axis.rect = new Rect(undefined, undefined, 0, 0);\n axis = this.primaryYAxis;\n axis.isStack100 = false;\n axis.rect = new Rect(undefined, undefined, 0, 0);\n for (var _i = 0, _a = this.axes; _i < _a.length; _i++) {\n var item = _a[_i];\n axis = item;\n axis.rect = new Rect(undefined, undefined, 0, 0);\n axis.isStack100 = false;\n }\n if (this.paretoSeriesModule && this.series[0].type === 'Pareto') {\n for (var _b = 0, _c = this.paretoSeriesModule.paretoAxes; _b < _c.length; _b++) {\n var item = _c[_b];\n axis = item;\n axis.rect = new Rect(undefined, undefined, 0, 0);\n axis.isStack100 = false;\n }\n }\n };\n Chart.prototype.axisChange = function (axis) {\n if (!axis.name && !axis.valueType) {\n return false;\n }\n this.refreshDefinition(this.columns);\n this.refreshDefinition(this.rows);\n this.calculateVisibleAxis();\n this.processData();\n return true;\n };\n /**\n * Get visible series by index\n */\n Chart.prototype.getVisibleSeries = function (visibleSeries, index) {\n for (var _i = 0, visibleSeries_1 = visibleSeries; _i < visibleSeries_1.length; _i++) {\n var series = visibleSeries_1[_i];\n if (index === series.index) {\n return series;\n }\n }\n return null;\n };\n /**\n * Clear visible Axis labels\n */\n Chart.prototype.clearVisibleAxisLabels = function () {\n var axes = [this.primaryXAxis, this.primaryYAxis];\n axes = this.chartAreaType === 'Cartesian' ? axes.concat(this.axes) : axes;\n for (var i = 0, len = axes.length; i < len; i++) {\n axes[i].labels = [];\n }\n };\n /**\n * Called internally if any of the property value changed.\n * @private\n */\n // tslint:disable-next-line:max-func-body-length\n Chart.prototype.onPropertyChanged = function (newProp, oldProp) {\n var renderer = false;\n var refreshBounds = false;\n if (Object.keys(newProp).length === 1 && Object.keys(newProp)[0] === 'indicators') {\n //add valid check,it should happen only when property change is triggered for target series\n return;\n }\n this.animateSeries = false;\n if (!this.delayRedraw) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'primaryXAxis':\n refreshBounds = this.axisChange(newProp.primaryXAxis);\n if (newProp.primaryXAxis.edgeLabelPlacement) {\n renderer = true;\n }\n if (!newProp.primaryXAxis.crosshairTooltip) {\n refreshBounds = true;\n }\n break;\n case 'primaryYAxis':\n refreshBounds = this.axisChange(newProp.primaryYAxis);\n if (newProp.primaryYAxis.edgeLabelPlacement) {\n renderer = true;\n }\n if (!newProp.primaryYAxis.crosshairTooltip) {\n refreshBounds = true;\n }\n break;\n case 'axes':\n for (var _b = 0, _c = Object.keys(newProp.axes); _b < _c.length; _b++) {\n var index = _c[_b];\n refreshBounds = refreshBounds || this.axisChange(newProp.axes[index]);\n if (!newProp.axes[index].crosshairTooltip) {\n refreshBounds = true;\n }\n }\n break;\n case 'height':\n case 'width':\n this.createChartSvg();\n refreshBounds = true;\n break;\n case 'subTitle':\n case 'title':\n refreshBounds = true;\n break;\n case 'titleStyle':\n if (newProp.titleStyle && (newProp.titleStyle.size || newProp.titleStyle.textOverflow)) {\n refreshBounds = true;\n }\n else {\n renderer = true;\n }\n break;\n case 'subTitleStyle':\n if (newProp.subTitleStyle && (newProp.subTitleStyle.size || newProp.subTitleStyle.textOverflow)) {\n refreshBounds = true;\n }\n else {\n renderer = true;\n }\n break;\n case 'border':\n renderer = true;\n break;\n case 'dataSource':\n this.processData(false);\n refreshBounds = true;\n break;\n case 'series':\n var len = this.series.length;\n var seriesRefresh = false;\n var series = void 0;\n for (var i = 0; i < len; i++) {\n series = newProp.series[i];\n if (series && (series.dataSource || series.xName || series.yName || series.size ||\n series.high || series.low || series.open || series.close || series.fill || series.name)) {\n extend(this.getVisibleSeries(this.visibleSeries, i), series, null, true);\n seriesRefresh = true;\n }\n }\n if (seriesRefresh) {\n this.calculateVisibleSeries();\n this.initTechnicalIndicators();\n this.initTrendLines();\n this.refreshDefinition(this.columns);\n this.refreshDefinition(this.rows);\n this.calculateVisibleAxis();\n this.processData(false);\n refreshBounds = true;\n }\n break;\n case 'zoomSettings':\n if (newProp.zoomSettings.enableScrollbar || oldProp.zoomSettings.enableScrollbar) {\n refreshBounds = true;\n }\n renderer = true;\n break;\n case 'background':\n renderer = true;\n break;\n case 'chartArea':\n if (newProp.chartArea.border && newProp.chartArea.border.width) {\n refreshBounds = true;\n }\n renderer = true;\n break;\n case 'legendSettings':\n if (!newProp.legendSettings.background || !newProp.legendSettings.opacity) {\n refreshBounds = true;\n }\n renderer = true;\n break;\n case 'palettes':\n this.calculateVisibleSeries();\n renderer = true;\n break;\n case 'selectedDataIndexes':\n case 'selectionMode':\n if (this.selectionModule && newProp.selectionMode && newProp.selectionMode.indexOf('Drag') === -1) {\n this.selectionModule.redrawSelection(this, oldProp.selectionMode);\n }\n break;\n case 'isMultiSelect':\n if (this.selectionModule && !newProp.isMultiSelect && this.selectionModule.selectedDataIndexes.length > 1) {\n this.selectionModule.redrawSelection(this, oldProp.selectionMode);\n }\n break;\n case 'theme':\n this.animateSeries = true;\n break;\n case 'locale':\n case 'currencyCode':\n _super.prototype.refresh.call(this);\n break;\n case 'tooltip':\n this.tooltipModule.previousPoints = [];\n break;\n }\n }\n if (!refreshBounds && renderer) {\n this.removeSvg();\n this.renderElements();\n this.trigger('loaded', { chart: this });\n }\n if (refreshBounds) {\n this.removeSvg();\n this.refreshAxis();\n this.refreshBound();\n this.trigger('loaded', { chart: this });\n this.redraw = false;\n this.animated = false;\n }\n }\n };\n __decorate([\n Property(null)\n ], Chart.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], Chart.prototype, \"height\", void 0);\n __decorate([\n Property('')\n ], Chart.prototype, \"title\", void 0);\n __decorate([\n Property('')\n ], Chart.prototype, \"dataSource\", void 0);\n __decorate([\n Complex(Theme.chartTitleFont, Font)\n ], Chart.prototype, \"titleStyle\", void 0);\n __decorate([\n Property('')\n ], Chart.prototype, \"subTitle\", void 0);\n __decorate([\n Complex(Theme.chartSubTitleFont, Font)\n ], Chart.prototype, \"subTitleStyle\", void 0);\n __decorate([\n Complex({}, Margin)\n ], Chart.prototype, \"margin\", void 0);\n __decorate([\n Complex({ color: '#DDDDDD', width: 0 }, Border)\n ], Chart.prototype, \"border\", void 0);\n __decorate([\n Property(null)\n ], Chart.prototype, \"background\", void 0);\n __decorate([\n Complex({ border: { color: null, width: 0.5 }, background: 'transparent' }, ChartArea)\n ], Chart.prototype, \"chartArea\", void 0);\n __decorate([\n Complex({ name: 'primaryXAxis' }, Axis)\n ], Chart.prototype, \"primaryXAxis\", void 0);\n __decorate([\n Complex({ name: 'primaryYAxis' }, Axis)\n ], Chart.prototype, \"primaryYAxis\", void 0);\n __decorate([\n Collection([{}], Row)\n ], Chart.prototype, \"rows\", void 0);\n __decorate([\n Collection([{}], Column)\n ], Chart.prototype, \"columns\", void 0);\n __decorate([\n Collection([{}], Axis)\n ], Chart.prototype, \"axes\", void 0);\n __decorate([\n Collection([{}], Series)\n ], Chart.prototype, \"series\", void 0);\n __decorate([\n Collection([{}], ChartAnnotationSettings)\n ], Chart.prototype, \"annotations\", void 0);\n __decorate([\n Property([])\n ], Chart.prototype, \"palettes\", void 0);\n __decorate([\n Property('Material')\n ], Chart.prototype, \"theme\", void 0);\n __decorate([\n Complex({}, TooltipSettings)\n ], Chart.prototype, \"tooltip\", void 0);\n __decorate([\n Complex({}, CrosshairSettings)\n ], Chart.prototype, \"crosshair\", void 0);\n __decorate([\n Complex({}, LegendSettings)\n ], Chart.prototype, \"legendSettings\", void 0);\n __decorate([\n Complex({}, ZoomSettings)\n ], Chart.prototype, \"zoomSettings\", void 0);\n __decorate([\n Property('None')\n ], Chart.prototype, \"selectionMode\", void 0);\n __decorate([\n Property(false)\n ], Chart.prototype, \"isMultiSelect\", void 0);\n __decorate([\n Property(true)\n ], Chart.prototype, \"enableExport\", void 0);\n __decorate([\n Collection([], Indexes)\n ], Chart.prototype, \"selectedDataIndexes\", void 0);\n __decorate([\n Property(false)\n ], Chart.prototype, \"useGroupingSeparator\", void 0);\n __decorate([\n Property(false)\n ], Chart.prototype, \"isTransposed\", void 0);\n __decorate([\n Collection([], TechnicalIndicator)\n ], Chart.prototype, \"indicators\", void 0);\n __decorate([\n Property(true)\n ], Chart.prototype, \"enableAnimation\", void 0);\n __decorate([\n Property(null)\n ], Chart.prototype, \"description\", void 0);\n __decorate([\n Property(1)\n ], Chart.prototype, \"tabIndex\", void 0);\n __decorate([\n Property(true)\n ], Chart.prototype, \"enableSideBySidePlacement\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"resized\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"annotationRender\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"beforePrint\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"loaded\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"load\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"animationComplete\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"legendRender\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"textRender\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"pointRender\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"seriesRender\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"axisLabelRender\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"axisRangeCalculated\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"axisMultiLabelRender\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"tooltipRender\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"chartMouseMove\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"chartMouseClick\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"pointClick\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"pointMove\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"chartMouseLeave\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"chartMouseDown\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"chartMouseUp\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"dragComplete\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"zoomComplete\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"scrollStart\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"scrollEnd\", void 0);\n __decorate([\n Event()\n ], Chart.prototype, \"scrollChanged\", void 0);\n __decorate([\n Property('USD')\n ], Chart.prototype, \"currencyCode\", void 0);\n Chart = __decorate([\n NotifyPropertyChanges\n ], Chart);\n return Chart;\n}(Component));\nexport { Chart };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { Double } from '../axis/double-axis';\n/**\n * Common axis classes\n * @private\n */\nvar NiceInterval = /** @class */ (function (_super) {\n __extends(NiceInterval, _super);\n function NiceInterval() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Method to calculate numeric datetime interval\n */\n NiceInterval.prototype.calculateDateTimeNiceInterval = function (axis, size, start, end, isChart) {\n if (isChart === void 0) { isChart = true; }\n var oneDay = 24 * 60 * 60 * 1000;\n var startDate = new Date(start);\n var endDate = new Date(end);\n //var axisInterval ;\n var totalDays = (Math.abs((startDate.getTime() - endDate.getTime()) / (oneDay)));\n var interval;\n axis.actualIntervalType = axis.intervalType;\n var type = axis.intervalType;\n switch (type) {\n case 'Years':\n interval = this.calculateNumericNiceInterval(axis, totalDays / 365, size);\n break;\n case 'Quarter':\n interval = this.calculateNumericNiceInterval(axis, (totalDays / 365) * 4, size);\n break;\n case 'Months':\n interval = this.calculateNumericNiceInterval(axis, totalDays / 30, size);\n break;\n case 'Weeks':\n interval = this.calculateNumericNiceInterval(axis, totalDays / 7, size);\n break;\n case 'Days':\n interval = this.calculateNumericNiceInterval(axis, totalDays, size);\n break;\n case 'Hours':\n interval = this.calculateNumericNiceInterval(axis, totalDays * 24, size);\n break;\n case 'Minutes':\n interval = this.calculateNumericNiceInterval(axis, totalDays * 24 * 60, size);\n break;\n case 'Seconds':\n interval = this.calculateNumericNiceInterval(axis, totalDays * 24 * 60 * 60, size);\n break;\n case 'Auto':\n interval = this.calculateNumericNiceInterval(axis, totalDays / 365, size);\n if (interval >= 1) {\n axis.actualIntervalType = 'Years';\n return interval;\n }\n interval = this.calculateNumericNiceInterval(axis, (totalDays / 365) * 4, size);\n if (interval >= 1 && !isChart) {\n axis.actualIntervalType = 'Quarter';\n return interval;\n }\n interval = this.calculateNumericNiceInterval(axis, totalDays / 30, size);\n if (interval >= 1) {\n axis.actualIntervalType = 'Months';\n return interval;\n }\n interval = this.calculateNumericNiceInterval(axis, totalDays / 7, size);\n if (interval >= 1 && !isChart) {\n axis.actualIntervalType = 'Weeks';\n return interval;\n }\n interval = this.calculateNumericNiceInterval(axis, totalDays, size);\n if (interval >= 1) {\n axis.actualIntervalType = 'Days';\n return interval;\n }\n interval = this.calculateNumericNiceInterval(axis, totalDays * 24, size);\n if (interval >= 1) {\n axis.actualIntervalType = 'Hours';\n return interval;\n }\n interval = this.calculateNumericNiceInterval(axis, totalDays * 24 * 60, size);\n if (interval >= 1) {\n axis.actualIntervalType = 'Minutes';\n return interval;\n }\n interval = this.calculateNumericNiceInterval(axis, totalDays * 24 * 60 * 60, size);\n axis.actualIntervalType = 'Seconds';\n return interval;\n }\n return interval;\n };\n /**\n * To get the skeleton for the DateTime axis.\n * @return {string}\n * @private\n */\n NiceInterval.prototype.getSkeleton = function (axis, currentValue, previousValue) {\n var skeleton;\n var intervalType = axis.actualIntervalType;\n if (axis.skeleton) {\n return axis.skeleton;\n }\n if (intervalType === 'Years') {\n skeleton = axis.isChart ? (axis.valueType === 'DateTime' ? 'y' : 'yMMM') : 'y';\n }\n else if (intervalType === 'Quarter') {\n skeleton = 'yMMM';\n }\n else if (intervalType === 'Months') {\n skeleton = axis.isChart ? 'MMMd' : 'MMM';\n }\n else if (intervalType === 'Weeks') {\n skeleton = 'MEd';\n }\n else if (intervalType === 'Days') {\n skeleton = axis.isChart ? this.getDayFormat(axis, currentValue, previousValue) : 'MMMd';\n }\n else if (intervalType === 'Hours') {\n skeleton = axis.isChart ? (axis.valueType === 'DateTime' ? 'Hm' : 'EHm') : 'h';\n }\n else if (intervalType === 'Minutes') {\n skeleton = axis.isChart ? 'Hms' : 'hm';\n }\n else {\n skeleton = axis.isChart ? 'Hms' : 'hms';\n }\n return skeleton;\n };\n /**\n * Get intervalType month format\n * @param currentValue\n * @param previousValue\n */\n NiceInterval.prototype.getMonthFormat = function (currentValue, previousValue) {\n return ((new Date(currentValue).getFullYear() === new Date(previousValue).getFullYear()) ? 'MMM' : 'y MMM');\n };\n /**\n * Get intervalType day label format for the axis\n * @param axis\n * @param currentValue\n * @param previousValue\n */\n NiceInterval.prototype.getDayFormat = function (axis, currentValue, previousValue) {\n return (axis.valueType === 'DateTime' ?\n ((new Date(currentValue).getMonth() !== new Date(previousValue).getMonth()) ? 'MMMd' : 'd') : 'yMd');\n };\n /**\n * Find label format for axis\n * @param axis\n * @param currentValue\n * @param previousValue\n * @private\n */\n NiceInterval.prototype.findCustomFormats = function (axis, currentValue, previousValue) {\n var labelFormat = axis.labelFormat ? axis.labelFormat : '';\n if (axis.isChart && !axis.skeleton && axis.actualIntervalType === 'Months' && !labelFormat) {\n labelFormat = axis.valueType === 'DateTime' ? this.getMonthFormat(currentValue, previousValue) : 'yMMM';\n }\n return labelFormat;\n };\n return NiceInterval;\n}(Double));\nexport { NiceInterval };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { setRange, triggerLabelRender } from '../../common/utils/helper';\nimport { DoubleRange } from '../utils/double-range';\nimport { withIn, firstToLowerCase } from '../../common/utils/helper';\nimport { DataUtil } from '@syncfusion/ej2-data';\nimport { NiceInterval } from '../axis/axis-helper';\nimport { extend, getValue, isNullOrUndefined } from '@syncfusion/ej2-base';\n/**\n * `DateTime` module is used to render datetime axis.\n */\nvar DateTime = /** @class */ (function (_super) {\n __extends(DateTime, _super);\n /**\n * Constructor for the dateTime module.\n * @private\n */\n function DateTime(chart) {\n return _super.call(this, chart) || this;\n }\n /**\n * The function to calculate the range and labels for the axis.\n * @return {void}\n */\n DateTime.prototype.calculateRangeAndInterval = function (size, axis) {\n this.calculateRange(axis, size);\n this.getActualRange(axis, size);\n this.applyRangePadding(axis, size);\n this.calculateVisibleLabels(axis, this.chart);\n };\n /**\n * Actual Range for the axis.\n * @private\n */\n DateTime.prototype.getActualRange = function (axis, size) {\n var option = {\n skeleton: 'full',\n type: 'dateTime'\n };\n var dateParser = this.chart.intl.getDateParser(option);\n var dateFormatter = this.chart.intl.getDateFormat(option);\n // Axis min\n if ((axis.minimum) !== null) {\n this.min = Date.parse(dateParser(dateFormatter(new Date(DataUtil.parse.parseJson({ val: axis.minimum }).val))));\n }\n else if (this.min === null || this.min === Number.POSITIVE_INFINITY) {\n this.min = Date.parse(dateParser(dateFormatter(new Date(1970, 1, 1))));\n }\n // Axis Max\n if ((axis.maximum) !== null) {\n this.max = Date.parse(dateParser(dateFormatter(new Date(DataUtil.parse.parseJson({ val: axis.maximum }).val))));\n }\n else if (this.max === null || this.max === Number.NEGATIVE_INFINITY) {\n this.max = Date.parse(dateParser(dateFormatter(new Date(1970, 5, 1))));\n }\n if (this.min === this.max) {\n this.max = this.max + 2592000000;\n this.min = this.min - 2592000000;\n }\n axis.actualRange = {};\n axis.doubleRange = new DoubleRange(this.min, this.max);\n var datetimeInterval = this.calculateDateTimeNiceInterval(axis, size, axis.doubleRange.start, axis.doubleRange.end);\n if (!axis.interval) {\n axis.actualRange.interval = datetimeInterval;\n }\n else {\n axis.actualRange.interval = axis.interval;\n }\n axis.actualRange.min = axis.doubleRange.start;\n axis.actualRange.max = axis.doubleRange.end;\n };\n /**\n * Apply padding for the range.\n * @private\n */\n DateTime.prototype.applyRangePadding = function (axis, size) {\n this.min = (axis.actualRange.min);\n this.max = (axis.actualRange.max);\n var minimum;\n var maximum;\n var interval = axis.actualRange.interval;\n if (!setRange(axis)) {\n var rangePadding = axis.getRangePadding(this.chart);\n minimum = new Date(this.min);\n maximum = new Date(this.max);\n var intervalType = axis.actualIntervalType;\n if (rangePadding === 'None') {\n this.min = minimum.getTime();\n this.max = maximum.getTime();\n }\n else if (rangePadding === 'Additional' || rangePadding === 'Round') {\n switch (intervalType) {\n case 'Years':\n this.getYear(minimum, maximum, rangePadding, interval);\n break;\n case 'Months':\n this.getMonth(minimum, maximum, rangePadding, interval);\n break;\n case 'Days':\n this.getDay(minimum, maximum, rangePadding, interval);\n break;\n case 'Hours':\n this.getHour(minimum, maximum, rangePadding, interval);\n break;\n case 'Minutes':\n var minute = (minimum.getMinutes() / interval) * interval;\n var endMinute = maximum.getMinutes() + (minimum.getMinutes() - minute);\n if (rangePadding === 'Round') {\n this.min = (new Date(minimum.getFullYear(), minimum.getMonth(), minimum.getDate(), minimum.getHours(), minute, 0)).getTime();\n this.max = (new Date(maximum.getFullYear(), maximum.getMonth(), maximum.getDate(), maximum.getHours(), endMinute, 59)).getTime();\n }\n else {\n this.min = (new Date(minimum.getFullYear(), maximum.getMonth(), minimum.getDate(), minimum.getHours(), minute + (-interval), 0)).getTime();\n this.max = (new Date(maximum.getFullYear(), maximum.getMonth(), maximum.getDate(), maximum.getHours(), endMinute + (interval), 0)).getTime();\n }\n break;\n case 'Seconds':\n var second = (minimum.getSeconds() / interval) * interval;\n var endSecond = maximum.getSeconds() + (minimum.getSeconds() - second);\n if (rangePadding === 'Round') {\n this.min = (new Date(minimum.getFullYear(), minimum.getMonth(), minimum.getDate(), minimum.getHours(), minimum.getMinutes(), second, 0)).getTime();\n this.max = (new Date(maximum.getFullYear(), maximum.getMonth(), maximum.getDate(), maximum.getHours(), maximum.getMinutes(), endSecond, 0)).getTime();\n }\n else {\n this.min = (new Date(minimum.getFullYear(), minimum.getMonth(), minimum.getDate(), minimum.getHours(), minimum.getMinutes(), second + (-interval), 0)).getTime();\n this.max = (new Date(maximum.getFullYear(), maximum.getMonth(), maximum.getDate(), maximum.getHours(), maximum.getMinutes(), endSecond + (interval), 0)).getTime();\n }\n break;\n }\n }\n }\n axis.actualRange.min = (axis.minimum != null) ? this.min : this.min;\n axis.actualRange.max = (axis.maximum != null) ? this.max : this.max;\n axis.actualRange.delta = (axis.actualRange.max - axis.actualRange.min);\n axis.doubleRange = new DoubleRange(axis.actualRange.min, axis.actualRange.max);\n this.calculateVisibleRange(size, axis);\n };\n DateTime.prototype.getYear = function (minimum, maximum, rangePadding, interval) {\n var startYear = minimum.getFullYear();\n var endYear = maximum.getFullYear();\n if (rangePadding === 'Additional') {\n this.min = (new Date(startYear - interval, 1, 1, 0, 0, 0)).getTime();\n this.max = (new Date(endYear + interval, 1, 1, 0, 0, 0)).getTime();\n }\n else {\n this.min = new Date(startYear, 0, 0, 0, 0, 0).getTime();\n this.max = new Date(endYear, 11, 30, 23, 59, 59).getTime();\n }\n };\n DateTime.prototype.getMonth = function (minimum, maximum, rangePadding, interval) {\n var month = minimum.getMonth();\n var endMonth = maximum.getMonth();\n if (rangePadding === 'Round') {\n this.min = (new Date(minimum.getFullYear(), month, 0, 0, 0, 0)).getTime();\n this.max = (new Date(maximum.getFullYear(), endMonth, new Date(maximum.getFullYear(), maximum.getMonth(), 0).getDate(), 23, 59, 59)).getTime();\n }\n else {\n this.min = (new Date(minimum.getFullYear(), month + (-interval), 1, 0, 0, 0)).getTime();\n this.max = (new Date(maximum.getFullYear(), endMonth + (interval), endMonth === 2 ? 28 : 30, 0, 0, 0)).getTime();\n }\n };\n DateTime.prototype.getDay = function (minimum, maximum, rangePadding, interval) {\n var day = minimum.getDate();\n var endDay = maximum.getDate();\n if (rangePadding === 'Round') {\n this.min = (new Date(minimum.getFullYear(), minimum.getMonth(), day, 0, 0, 0)).getTime();\n this.max = (new Date(maximum.getFullYear(), maximum.getMonth(), endDay, 23, 59, 59)).getTime();\n }\n else {\n this.min = (new Date(minimum.getFullYear(), minimum.getMonth(), day + (-interval), 0, 0, 0)).getTime();\n this.max = (new Date(maximum.getFullYear(), maximum.getMonth(), endDay + (interval), 0, 0, 0)).getTime();\n }\n };\n DateTime.prototype.getHour = function (minimum, maximum, rangePadding, interval) {\n var hour = (minimum.getHours() / interval) * interval;\n var endHour = maximum.getHours() + (minimum.getHours() - hour);\n if (rangePadding === 'Round') {\n this.min = (new Date(minimum.getFullYear(), minimum.getMonth(), minimum.getDate(), hour, 0, 0)).getTime();\n this.max = (new Date(maximum.getFullYear(), maximum.getMonth(), maximum.getDate(), endHour, 59, 59)).getTime();\n }\n else {\n this.min = (new Date(minimum.getFullYear(), minimum.getMonth(), minimum.getDate(), hour + (-interval), 0, 0)).getTime();\n this.max = (new Date(maximum.getFullYear(), maximum.getMonth(), maximum.getDate(), endHour + (interval), 0, 0)).getTime();\n }\n };\n /**\n * Calculate visible range for axis.\n * @private\n */\n DateTime.prototype.calculateVisibleRange = function (size, axis) {\n axis.visibleRange = {\n min: axis.actualRange.min,\n max: axis.actualRange.max,\n interval: axis.actualRange.interval,\n delta: axis.actualRange.delta,\n };\n var isLazyLoad = isNullOrUndefined(axis.zoomingScrollBar) ? false : axis.zoomingScrollBar.isLazyLoad;\n if ((axis.zoomFactor < 1 || axis.zoomPosition > 0) && !isLazyLoad) {\n axis.calculateVisibleRange(size);\n axis.visibleRange.interval = (axis.enableAutoIntervalOnZooming) ?\n this.calculateDateTimeNiceInterval(axis, size, axis.visibleRange.min, axis.visibleRange.max)\n : axis.visibleRange.interval;\n }\n axis.dateTimeInterval = this.increaseDateTimeInterval(axis, axis.visibleRange.min, axis.visibleRange.interval).getTime()\n - axis.visibleRange.min;\n axis.triggerRangeRender(this.chart, axis.visibleRange.min, axis.visibleRange.max, axis.visibleRange.interval);\n };\n /**\n * Calculate visible labels for the axis.\n * @param axis\n * @param chart\n * @private\n */\n DateTime.prototype.calculateVisibleLabels = function (axis, chart) {\n axis.visibleLabels = [];\n var tempInterval = axis.visibleRange.min;\n var labelStyle;\n var previousValue;\n var axisLabels = axis.visibleLabels;\n if (!setRange(axis)) {\n tempInterval = this.alignRangeStart(axis, tempInterval, axis.visibleRange.interval, axis.actualIntervalType).getTime();\n }\n while (tempInterval <= axis.visibleRange.max) {\n labelStyle = (extend({}, getValue('properties', axis.labelStyle), null, true));\n previousValue = axisLabels.length ? axis.visibleLabels[axisLabels.length - 1].value : tempInterval;\n axis.format = chart.intl.getDateFormat({\n format: this.findCustomFormats(axis, tempInterval, previousValue),\n type: firstToLowerCase(axis.skeletonType),\n skeleton: this.getSkeleton(axis, tempInterval, previousValue)\n });\n axis.startLabel = axis.format(new Date(axis.visibleRange.min));\n axis.endLabel = axis.format(new Date(axis.visibleRange.max));\n if (withIn(tempInterval, axis.visibleRange)) {\n triggerLabelRender(chart, tempInterval, axis.format(new Date(tempInterval)), labelStyle, axis);\n }\n tempInterval = this.increaseDateTimeInterval(axis, tempInterval, axis.visibleRange.interval).getTime();\n }\n //tooltip and crosshair formats for 'Months' and 'Days' interval types\n if ((axis.actualIntervalType === 'Months' || axis.actualIntervalType === 'Days') && axis.isChart) {\n axis.format = chart.intl.getDateFormat({\n format: axis.labelFormat || (axis.actualIntervalType === 'Months' && !axis.skeleton ? 'y MMM' : ''),\n type: firstToLowerCase(axis.skeletonType), skeleton: axis.skeleton || (axis.actualIntervalType === 'Days' ? 'MMMd' : '')\n });\n }\n if (axis.getMaxLabelWidth) {\n axis.getMaxLabelWidth(this.chart);\n }\n };\n /** @private */\n DateTime.prototype.increaseDateTimeInterval = function (axis, value, interval) {\n var result = new Date(value);\n interval = Math.ceil(interval);\n axis.visibleRange.interval = interval;\n var intervalType = axis.actualIntervalType;\n switch (intervalType) {\n case 'Years':\n result.setFullYear(result.getFullYear() + interval);\n return result;\n case 'Quarter':\n result.setMonth(result.getMonth() + (3 * interval));\n return result;\n case 'Months':\n result.setMonth(result.getMonth() + interval);\n return result;\n case 'Weeks':\n result.setDate(result.getDate() + (interval * 7));\n return result;\n case 'Days':\n result.setDate(result.getDate() + interval);\n return result;\n case 'Hours':\n result.setHours(result.getHours() + interval);\n return result;\n case 'Minutes':\n result.setMinutes(result.getMinutes() + interval);\n return result;\n case 'Seconds':\n result.setSeconds(result.getSeconds() + interval);\n return result;\n }\n return result;\n };\n DateTime.prototype.alignRangeStart = function (axis, sDate, intervalSize, intervalType) {\n var sResult = new Date(sDate);\n switch (axis.actualIntervalType) {\n case 'Years':\n var year = Math.floor(Math.floor(sResult.getFullYear() / intervalSize) * intervalSize);\n sResult = new Date(year, sResult.getMonth(), sResult.getDate(), 0, 0, 0);\n return sResult;\n case 'Months':\n var month = Math.floor(Math.floor((sResult.getMonth()) / intervalSize) * intervalSize);\n sResult = new Date(sResult.getFullYear(), month, sResult.getDate(), 0, 0, 0);\n return sResult;\n case 'Days':\n var day = Math.floor(Math.floor((sResult.getDate()) / intervalSize) * intervalSize);\n sResult = new Date(sResult.getFullYear(), sResult.getMonth(), day, 0, 0, 0);\n return sResult;\n case 'Hours':\n var hour = Math.floor(Math.floor((sResult.getHours()) / intervalSize) * intervalSize);\n sResult = new Date(sResult.getFullYear(), sResult.getMonth(), sResult.getDate(), hour, 0, 0);\n return sResult;\n case 'Minutes':\n var minutes = Math.floor(Math.floor((sResult.getMinutes()) / intervalSize) * intervalSize);\n sResult = new Date(sResult.getFullYear(), sResult.getMonth(), sResult.getDate(), sResult.getHours(), minutes, 0, 0);\n return sResult;\n case 'Seconds':\n var seconds = Math.floor(Math.floor((sResult.getSeconds()) / intervalSize) * intervalSize);\n sResult = new Date(sResult.getFullYear(), sResult.getMonth(), sResult.getDate(), sResult.getHours(), sResult.getMinutes(), seconds, 0);\n return sResult;\n }\n return sResult;\n };\n /**\n * Get module name\n */\n DateTime.prototype.getModuleName = function () {\n /**\n * Returns the module name\n */\n return 'DateTime';\n };\n /**\n * To destroy the category axis.\n * @return {void}\n * @private\n */\n DateTime.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n return DateTime;\n}(NiceInterval));\nexport { DateTime };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { getActualDesiredIntervalsCount, triggerLabelRender } from '../../common/utils/helper';\nimport { DoubleRange } from '../utils/double-range';\nimport { withIn } from '../../common/utils/helper';\nimport { extend, getValue } from '@syncfusion/ej2-base';\nimport { NiceInterval } from '../axis/axis-helper';\n/**\n * `Category` module is used to render category axis.\n */\nvar Category = /** @class */ (function (_super) {\n __extends(Category, _super);\n /**\n * Constructor for the category module.\n * @private\n */\n function Category(chart) {\n return _super.call(this, chart) || this;\n }\n /**\n * The function to calculate the range and labels for the axis.\n * @return {void}\n */\n Category.prototype.calculateRangeAndInterval = function (size, axis) {\n this.calculateRange(axis, size);\n this.getActualRange(axis, size);\n this.applyRangePadding(axis, size);\n this.calculateVisibleLabels(axis);\n };\n /**\n * Actual Range for the axis.\n * @private\n */\n Category.prototype.getActualRange = function (axis, size) {\n this.initializeDoubleRange(axis);\n // axis.doubleRange = new DoubleRange(this.min, this.max);\n axis.actualRange = {};\n if (!axis.interval) {\n axis.actualRange.interval = Math.max(1, Math.floor(axis.doubleRange.delta / getActualDesiredIntervalsCount(size, axis)));\n }\n else {\n axis.actualRange.interval = Math.ceil(axis.interval);\n }\n axis.actualRange.min = axis.doubleRange.start;\n axis.actualRange.max = axis.doubleRange.end;\n axis.actualRange.delta = axis.doubleRange.delta;\n };\n /**\n * Padding for the axis.\n * @private\n */\n Category.prototype.applyRangePadding = function (axis, size) {\n var ticks = (axis.labelPlacement === 'BetweenTicks' && this.chart.chartAreaType !== 'PolarRadar') ? 0.5 : 0;\n if (ticks > 0) {\n axis.actualRange.min -= ticks;\n axis.actualRange.max += ticks;\n }\n else {\n axis.actualRange.max += axis.actualRange.max ? 0 : 0.5;\n }\n axis.doubleRange = new DoubleRange(axis.actualRange.min, axis.actualRange.max);\n axis.actualRange.delta = axis.doubleRange.delta;\n this.calculateVisibleRange(size, axis);\n };\n /**\n * Calculate label for the axis.\n * @private\n */\n Category.prototype.calculateVisibleLabels = function (axis) {\n /*! Generate axis labels */\n axis.visibleLabels = [];\n var tempInterval = Math.ceil(axis.visibleRange.min);\n var labelStyle;\n if (axis.zoomFactor < 1 || axis.zoomPosition > 0) {\n tempInterval = axis.visibleRange.min - (axis.visibleRange.min % axis.visibleRange.interval);\n }\n var position;\n axis.startLabel = axis.labels[Math.round(axis.visibleRange.min)];\n axis.endLabel = axis.labels[Math.floor(axis.visibleRange.max)];\n for (; tempInterval <= axis.visibleRange.max; tempInterval += axis.visibleRange.interval) {\n labelStyle = (extend({}, getValue('properties', axis.labelStyle), null, true));\n if (withIn(tempInterval, axis.visibleRange) && axis.labels.length > 0) {\n position = Math.round(tempInterval);\n triggerLabelRender(this.chart, position, axis.labels[position] ? axis.labels[position].toString() : position.toString(), labelStyle, axis);\n }\n }\n if (axis.getMaxLabelWidth) {\n axis.getMaxLabelWidth(this.chart);\n }\n };\n /**\n * Get module name\n */\n Category.prototype.getModuleName = function () {\n /**\n * Returns the module name\n */\n return 'Category';\n };\n /**\n * To destroy the category axis.\n * @return {void}\n * @private\n */\n Category.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n return Category;\n}(NiceInterval));\nexport { Category };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { Double } from '../axis/double-axis';\nimport { getActualDesiredIntervalsCount, triggerLabelRender } from '../../common/utils/helper';\nimport { logBase, withIn } from '../../common/utils/helper';\nimport { extend, getValue, isNullOrUndefined } from '@syncfusion/ej2-base';\n/**\n * `Logarithmic` module is used to render log axis.\n */\nvar Logarithmic = /** @class */ (function (_super) {\n __extends(Logarithmic, _super);\n /**\n * Constructor for the logerithmic module.\n * @private\n */\n function Logarithmic(chart) {\n return _super.call(this, chart) || this;\n }\n /**\n * The method to calculate the range and labels for the axis.\n * @return {void}\n */\n Logarithmic.prototype.calculateRangeAndInterval = function (size, axis) {\n this.calculateRange(axis, size);\n this.getActualRange(axis, size);\n this.calculateVisibleRange(size, axis);\n this.calculateVisibleLabels(axis, this.chart);\n };\n /**\n * Calculates actual range for the axis.\n * @private\n */\n Logarithmic.prototype.getActualRange = function (axis, size) {\n this.initializeDoubleRange(axis);\n this.min = this.min < 0 ? 0 : this.min;\n var logStart = logBase(this.min, axis.logBase);\n logStart = isFinite(logStart) ? logStart : this.min;\n var logEnd = logBase(this.max, axis.logBase);\n logEnd = isFinite(logStart) ? logEnd : this.max;\n this.min = Math.floor(logStart / 1);\n this.max = Math.ceil(logEnd / 1);\n axis.actualRange.interval = axis.interval || this.calculateLogNiceInterval(this.max - this.min, size, axis);\n axis.actualRange.min = this.min;\n axis.actualRange.max = this.max;\n axis.actualRange.delta = this.max - this.min;\n };\n /**\n * Calculates visible range for the axis.\n * @private\n */\n Logarithmic.prototype.calculateVisibleRange = function (size, axis) {\n axis.visibleRange = {\n interval: axis.actualRange.interval, max: axis.actualRange.max,\n min: axis.actualRange.min, delta: axis.actualRange.delta\n };\n var isLazyLoad = isNullOrUndefined(axis.zoomingScrollBar) ? false : axis.zoomingScrollBar.isLazyLoad;\n if ((axis.zoomFactor < 1 || axis.zoomPosition > 0) && !isLazyLoad) {\n axis.calculateVisibleRange(size);\n axis.visibleRange.interval = (axis.enableAutoIntervalOnZooming) ?\n this.calculateLogNiceInterval(axis.doubleRange.delta, size, axis)\n : axis.visibleRange.interval;\n axis.visibleRange.interval = Math.floor(axis.visibleRange.interval) === 0 ? 1 : Math.floor(axis.visibleRange.interval);\n axis.triggerRangeRender(this.chart, axis.visibleRange.min, axis.visibleRange.max, axis.visibleRange.interval);\n }\n };\n /**\n * Calculates log iInteval for the axis.\n * @private\n */\n Logarithmic.prototype.calculateLogNiceInterval = function (delta, size, axis) {\n var actualDesiredIntervalsCount = getActualDesiredIntervalsCount(size, axis);\n var niceInterval = delta;\n var minInterval = Math.pow(10, Math.floor(logBase(niceInterval, 10)));\n for (var j = 0, len = axis.intervalDivs.length; j < len; j++) {\n var currentInterval = minInterval * axis.intervalDivs[j];\n if (actualDesiredIntervalsCount < (delta / currentInterval)) {\n break;\n }\n niceInterval = currentInterval;\n }\n return niceInterval;\n };\n /**\n * Calculates labels for the axis.\n * @private\n */\n Logarithmic.prototype.calculateVisibleLabels = function (axis, chart) {\n /*! Generate axis labels */\n var tempInterval = axis.visibleRange.min;\n axis.visibleLabels = [];\n var labelStyle;\n if (axis.zoomFactor < 1 || axis.zoomPosition > 0) {\n tempInterval = axis.visibleRange.min - (axis.visibleRange.min % axis.visibleRange.interval);\n }\n var axisFormat = this.getFormat(axis);\n var isCustomFormat = axisFormat.match('{value}') !== null;\n axis.format = chart.intl.getNumberFormat({\n format: isCustomFormat ? '' : axisFormat,\n useGrouping: chart.useGroupingSeparator\n });\n axis.startLabel = axis.format(Math.pow(axis.logBase, axis.visibleRange.min));\n axis.endLabel = axis.format(Math.pow(axis.logBase, axis.visibleRange.max));\n for (; tempInterval <= axis.visibleRange.max; tempInterval += axis.visibleRange.interval) {\n labelStyle = (extend({}, getValue('properties', axis.labelStyle), null, true));\n if (withIn(tempInterval, axis.visibleRange)) {\n triggerLabelRender(this.chart, tempInterval, this.formatValue(axis, isCustomFormat, axisFormat, Math.pow(axis.logBase, tempInterval)), labelStyle, axis);\n }\n }\n if (axis.getMaxLabelWidth) {\n axis.getMaxLabelWidth(this.chart);\n }\n };\n /**\n * Get module name\n */\n Logarithmic.prototype.getModuleName = function () {\n /**\n * Returns the module name\n */\n return 'Logarithmic';\n };\n /**\n * To destroy the category axis.\n * @return {void}\n * @private\n */\n Logarithmic.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n return Logarithmic;\n}(Double));\nexport { Logarithmic };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { Category } from '../axis/category-axis';\nimport { triggerLabelRender } from '../../common/utils/helper';\nimport { withIn, firstToLowerCase } from '../../common/utils/helper';\nimport { extend, getValue } from '@syncfusion/ej2-base';\n/**\n * Category module is used to render category axis.\n */\nvar DateTimeCategory = /** @class */ (function (_super) {\n __extends(DateTimeCategory, _super);\n /**\n * Constructor for the category module.\n * @private\n */\n function DateTimeCategory(chart) {\n return _super.call(this, chart) || this;\n }\n /**\n * The function to calculate the range and labels for the axis.\n * @return {void}\n * @private\n */\n DateTimeCategory.prototype.calculateRangeAndInterval = function (size, axis) {\n this.axisSize = size;\n this.calculateRange(axis, size);\n this.getActualRange(axis, size);\n this.applyRangePadding(axis, size);\n this.calculateVisibleLabels(axis);\n };\n /**\n * Calculate label for the axis.\n * @private\n */\n DateTimeCategory.prototype.calculateVisibleLabels = function (axis) {\n /*! Generate axis labels */\n axis.visibleLabels = [];\n var labelStyle;\n var padding = axis.labelPlacement === 'BetweenTicks' ? 0.5 : 0;\n if (axis.intervalType === 'Auto') {\n this.calculateDateTimeNiceInterval(axis, this.axisSize, parseInt(axis.labels[0], 10), parseInt(axis.labels[axis.labels.length - 1], 10));\n }\n else {\n axis.actualIntervalType = axis.intervalType;\n }\n axis.format = this.chart.intl.getDateFormat({\n format: axis.labelFormat, type: firstToLowerCase(axis.skeletonType), skeleton: this.getSkeleton(axis, null, null)\n });\n for (var i = 0; i < axis.labels.length; i++) {\n labelStyle = (extend({}, getValue('properties', axis.labelStyle), null, true));\n if (!this.sameInterval(axis.labels.map(Number)[i], axis.labels.map(Number)[i - 1], axis.actualIntervalType, i)) {\n if (withIn(i - padding, axis.visibleRange)) {\n triggerLabelRender(this.chart, i, axis.format(new Date(axis.labels.map(Number)[i])), labelStyle, axis);\n }\n }\n }\n if (axis.getMaxLabelWidth) {\n axis.getMaxLabelWidth(this.chart);\n }\n };\n /**\n * get same interval\n */\n DateTimeCategory.prototype.sameInterval = function (currentDate, previousDate, type, index) {\n var sameValue;\n if (index === 0) {\n sameValue = false;\n }\n else {\n switch (type) {\n case 'Years':\n sameValue = new Date(currentDate).getFullYear() === new Date(previousDate).getFullYear();\n break;\n case 'Months':\n sameValue = new Date(currentDate).getFullYear() === new Date(previousDate).getFullYear() &&\n new Date(currentDate).getMonth() === new Date(previousDate).getMonth();\n break;\n case 'Days':\n sameValue = (Math.abs(currentDate - previousDate) < 24 * 60 * 60 * 1000 &&\n new Date(currentDate).getDay() === new Date(previousDate).getDay());\n break;\n case 'Hours':\n sameValue = (Math.abs(currentDate - previousDate) < 60 * 60 * 1000 &&\n new Date(currentDate).getDay() === new Date(previousDate).getDay());\n break;\n case 'Minutes':\n sameValue = (Math.abs(currentDate - previousDate) < 60 * 1000 &&\n new Date(currentDate).getMinutes() === new Date(previousDate).getMinutes());\n break;\n case 'Seconds':\n sameValue = (Math.abs(currentDate - previousDate) < 1000 &&\n new Date(currentDate).getDay() === new Date(previousDate).getDay());\n break;\n }\n }\n return sameValue;\n };\n /**\n * Get module name\n */\n DateTimeCategory.prototype.getModuleName = function () {\n /**\n * Returns the module name\n */\n return 'DateTimeCategory';\n };\n /**\n * To destroy the category axis.\n * @return {void}\n * @private\n */\n DateTimeCategory.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n return DateTimeCategory;\n}(Category));\nexport { DateTimeCategory };\n","/**\n * StripLine src\n */\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { valueToCoefficient, textElement, RectOption, appendChildElement, appendClipElement, withIn, getElement } from '../../common/utils/helper';\nimport { measureText, TextOption, PathOption, Rect } from '@syncfusion/ej2-svg-base';\n/**\n * `StripLine` module is used to render the stripLine in chart.\n */\nvar StripLine = /** @class */ (function () {\n function StripLine() {\n }\n /**\n * Finding x, y, width and height of the strip line\n * @param axis\n * @param strip line\n * @param seriesClipRect\n * @param startValue\n * @param segmentAxis\n */\n StripLine.prototype.measureStripLine = function (axis, stripline, seriesClipRect, startValue, segmentAxis) {\n var actualStart;\n var actualEnd;\n var orientation = axis.orientation;\n if (stripline.isRepeat && stripline.size !== null) {\n actualStart = startValue;\n actualEnd = null;\n }\n else {\n if (axis.valueType === 'DateTimeCategory') {\n var start = stripline.start;\n var end = stripline.end;\n actualStart = (start != null && typeof start !== 'number') ? axis.labels.indexOf((start).getTime().toString()) :\n start;\n actualEnd = (end != null && typeof end !== 'number') ? axis.labels.indexOf((end).getTime().toString()) : end;\n }\n else {\n actualStart = stripline.start === null ? null : +stripline.start;\n actualEnd = stripline.end === null ? null : +stripline.end;\n }\n }\n var rect = this.getFromTovalue(actualStart, actualEnd, stripline.size, stripline.startFromAxis, axis, stripline);\n var height = (orientation === 'Vertical') ? (rect.to - rect.from) * axis.rect.height : seriesClipRect.height;\n var width = (orientation === 'Horizontal') ? (rect.to - rect.from) * axis.rect.width : seriesClipRect.width;\n var x = (orientation === 'Vertical') ? seriesClipRect.x : ((rect.from * axis.rect.width) + axis.rect.x);\n var y = (orientation === 'Horizontal') ? seriesClipRect.y : (axis.rect.y + axis.rect.height -\n ((stripline.sizeType === 'Pixel' ? rect.from : rect.to) * axis.rect.height));\n if (stripline.isSegmented && stripline.segmentStart != null && stripline.segmentEnd != null && stripline.sizeType !== 'Pixel') {\n var segRect = this.getFromTovalue(+stripline.segmentStart, +stripline.segmentEnd, null, null, segmentAxis, stripline);\n if (segmentAxis.orientation === 'Vertical') {\n y = (segmentAxis.rect.y + segmentAxis.rect.height -\n (segRect.to * segmentAxis.rect.height));\n height = (segRect.to - segRect.from) * segmentAxis.rect.height;\n }\n else {\n x = ((segRect.from * segmentAxis.rect.width) + segmentAxis.rect.x);\n width = (segRect.to - segRect.from) * segmentAxis.rect.width;\n }\n }\n if ((height !== 0 && width !== 0) || (stripline.sizeType === 'Pixel' && (stripline.start !== null || stripline.startFromAxis))) {\n return new Rect(x, y, width, height);\n }\n return new Rect(0, 0, 0, 0);\n };\n /**\n * To get from to value from start, end, size, start from axis\n * @param start\n * @param end\n * @param size\n * @param startFromAxis\n * @param axis\n * @param strip line\n */\n StripLine.prototype.getFromTovalue = function (start, end, size, startFromAxis, axis, stripline) {\n var from = (!stripline.isRepeat && startFromAxis) ? axis.visibleRange.min : start;\n var to = this.getToValue(Math.max(start, isNullOrUndefined(end) ? start : end), from, size, axis, end, stripline);\n from = this.findValue(from, axis);\n to = this.findValue(to, axis);\n return { from: valueToCoefficient(axis.isInversed ? to : from, axis), to: valueToCoefficient(axis.isInversed ? from : to, axis) };\n };\n /**\n * Finding end value of the strip line\n * @param to\n * @param from\n * @param size\n * @param axis\n * @param end\n * @param strip line\n */\n StripLine.prototype.getToValue = function (to, from, size, axis, end, stripline) {\n var sizeType = stripline.sizeType;\n var isEnd = (end === null);\n if (axis.valueType === 'DateTime') {\n var fromValue = new Date(from);\n if (sizeType === 'Auto') {\n sizeType = axis.actualIntervalType;\n size *= axis.visibleRange.interval;\n }\n switch (sizeType) {\n case 'Years':\n return (isEnd ? new Date(fromValue.setFullYear(fromValue.getFullYear() + size)) : to);\n case 'Months':\n return (isEnd ? new Date(fromValue.setMonth(fromValue.getMonth() + size)) : to);\n case 'Days':\n return (isEnd ? new Date(fromValue.setDate(fromValue.getDate() + size)) : to);\n case 'Hours':\n return (isEnd ? new Date(fromValue.setHours(fromValue.getHours() + size)) : to);\n case 'Minutes':\n return (isEnd ? new Date(fromValue.setMinutes(fromValue.getMinutes() + size)) : to);\n case 'Seconds':\n return (isEnd ? new Date(fromValue.setSeconds(fromValue.getSeconds() + size)) : to);\n default:\n return from;\n }\n }\n else {\n return stripline.sizeType === 'Pixel' ? from : (isEnd ? (from + size) : to);\n }\n };\n /**\n * To check the strip line values within range\n * @param value\n * @param axis\n */\n StripLine.prototype.findValue = function (value, axis) {\n if (value < axis.visibleRange.min) {\n value = axis.visibleRange.min;\n }\n else if (value > axis.visibleRange.max) {\n value = axis.visibleRange.max;\n }\n return value;\n };\n /**\n * To render strip lines based start and end.\n * @private\n * @param chart\n * @param position\n * @param axes\n */\n StripLine.prototype.renderStripLine = function (chart, position, axes) {\n var id = chart.element.id + '_stripline_' + position + '_';\n var seriesClipRect = chart.chartAxisLayoutPanel.seriesClipRect;\n var end = 0;\n var limit = 0;\n var startValue = 0;\n var segmentAxis = null;\n var range;\n var options = new RectOption(id + 'ClipRect', 'transparent', { width: 1, color: 'Gray' }, 1, {\n x: chart.initialClipRect.x, y: chart.initialClipRect.y,\n width: chart.initialClipRect.width,\n height: chart.initialClipRect.height\n });\n var striplineGroup = chart.renderer.createGroup({\n id: id + 'collections',\n 'clip-path': 'url(#' + id + 'ClipRect' + ')'\n });\n striplineGroup.appendChild(appendClipElement(chart.redraw, options, chart.renderer));\n for (var _i = 0, axes_1 = axes; _i < axes_1.length; _i++) {\n var axis = axes_1[_i];\n var count = 0;\n for (var _a = 0, _b = axis.stripLines; _a < _b.length; _a++) {\n var stripline = _b[_a];\n if (stripline.visible && stripline.zIndex === position) {\n if (stripline.isSegmented && stripline.segmentStart != null && stripline.segmentEnd != null &&\n stripline.sizeType !== 'Pixel') {\n segmentAxis = this.getSegmentAxis(axes, axis, stripline);\n }\n if (stripline.isRepeat && stripline.repeatEvery != null && stripline.size !== null && stripline.sizeType !== 'Pixel') {\n limit = (stripline.repeatUntil != null) ? ((axis.valueType === 'DateTime') ?\n stripline.repeatUntil.getTime() : +stripline.repeatUntil) : axis.actualRange.max;\n startValue = stripline.start;\n if ((stripline.startFromAxis && axis.valueType === 'DateTime' && stripline.sizeType === 'Auto') ||\n (stripline.start < axis.visibleRange.min)) {\n startValue = axis.visibleLabels[0].value === axis.visibleRange.min ? axis.visibleRange.min :\n axis.visibleLabels[0].value - (axis.valueType === 'DateTime' ? axis.dateTimeInterval :\n axis.visibleRange.interval);\n }\n startValue = stripline.startFromAxis && axis.valueType !== 'DateTime' ? axis.visibleRange.min : startValue;\n while (startValue < limit) {\n end = (startValue + (axis.valueType === 'DateTime' ? axis.dateTimeInterval * +stripline.size : stripline.size));\n range = withIn(end, axis.visibleRange);\n if ((startValue >= axis.visibleRange.min && startValue < axis.visibleRange.max) || range) {\n this.renderStripLineElement(axis, stripline, seriesClipRect, id, striplineGroup, chart, startValue, segmentAxis, count);\n }\n count++;\n startValue = this.getStartValue(axis, stripline, startValue);\n }\n }\n else {\n this.renderStripLineElement(axis, stripline, seriesClipRect, id, striplineGroup, chart, null, segmentAxis, count);\n count++;\n }\n }\n }\n }\n appendChildElement(chart.svgObject, striplineGroup, chart.redraw);\n };\n /**\n * To draw the single line strip line\n * @param strip line\n * @param rect\n * @param id\n * @param parent\n * @param chart\n * @param axis\n */\n StripLine.prototype.renderPath = function (stripline, rect, id, parent, chart, axis) {\n var element = getElement(id);\n var direction = element ? element.getAttribute('d') : '';\n var d = (axis.orientation === 'Vertical') ? ('M' + rect.x + ' ' + rect.y + ' ' + 'L' + (rect.x + rect.width)\n + ' ' + rect.y) :\n ('M' + rect.x + ' ' + rect.y + ' ' + 'L' + rect.x + ' ' + (rect.y + rect.height));\n appendChildElement(parent, chart.renderer.drawPath(new PathOption(id, '', stripline.size, stripline.color, stripline.opacity, stripline.dashArray, d)), chart.redraw, true, 'x', 'y', null, direction, true);\n };\n ;\n /**\n * To draw the rectangle\n * @param strip line\n * @param rect\n * @param id\n * @param parent\n * @param chart\n */\n StripLine.prototype.renderRectangle = function (stripline, rect, id, parent, chart) {\n var element = getElement(id);\n var previousRect = element ? new Rect(+element.getAttribute('x'), +element.getAttribute('y'), +element.getAttribute('width'), +element.getAttribute('height')) : null;\n appendChildElement(parent, chart.renderer.drawRectangle(new RectOption(id, stripline.color, stripline.border, stripline.opacity, rect, 0, 0, '', stripline.dashArray)), chart.redraw, true, 'x', 'y', null, null, true, true, previousRect);\n };\n /**\n * To create the text on strip line\n * @param strip line\n * @param rect\n * @param id\n * @param parent\n * @param chart\n * @param axis\n */\n StripLine.prototype.renderText = function (stripline, rect, id, parent, chart, axis) {\n var textSize = measureText(stripline.text, stripline.textStyle);\n var textMid = 3 * (textSize.height / 8);\n var ty = rect.y + (rect.height / 2) + textMid;\n var rotation = (stripline.rotation === null) ? ((axis.orientation === 'Vertical') ? 0 : -90) : stripline.rotation;\n var tx = rect.x + (rect.width / 2);\n var anchor;\n var padding = 5;\n if (axis.orientation === 'Horizontal') {\n tx = this.getTextStart(tx + (textMid * this.factor(stripline.horizontalAlignment)), rect.width, stripline.horizontalAlignment);\n ty = this.getTextStart(ty - textMid, rect.height, stripline.verticalAlignment);\n anchor = this.invertAlignment(stripline.verticalAlignment);\n }\n else {\n tx = this.getTextStart(tx, rect.width, stripline.horizontalAlignment);\n ty = this.getTextStart(ty + (textMid * this.factor(stripline.verticalAlignment)) - padding, rect.height, stripline.verticalAlignment);\n anchor = stripline.horizontalAlignment;\n }\n textElement(new TextOption(id, tx, ty, anchor, stripline.text, 'rotate(' + rotation + ' ' + tx + ',' + ty + ')', 'middle'), stripline.textStyle, stripline.textStyle.color, parent);\n };\n StripLine.prototype.invertAlignment = function (anchor) {\n switch (anchor) {\n case 'Start':\n anchor = 'End';\n break;\n case 'End':\n anchor = 'Start';\n break;\n }\n return anchor;\n };\n /**\n * To find the next value of the recurrence strip line\n * @param axis\n * @param stripline\n * @param startValue\n */\n StripLine.prototype.getStartValue = function (axis, stripline, startValue) {\n if (axis.valueType === 'DateTime') {\n return this.getToValue(null, startValue, +stripline.repeatEvery, axis, null, stripline);\n }\n else {\n return startValue + (+stripline.repeatEvery);\n }\n };\n /**\n * Finding segment axis for segmented strip line\n * @param axes\n * @param axis\n * @param strip line\n */\n StripLine.prototype.getSegmentAxis = function (axes, axis, stripline) {\n var segment;\n if (stripline.segmentAxisName == null) {\n return (axis.orientation === 'Horizontal') ? axes[1] : axes[0];\n }\n else {\n for (var i = 0; i < axes.length; i++) {\n if (stripline.segmentAxisName === axes[i].name) {\n segment = axes[i];\n }\n }\n return segment;\n }\n };\n /**\n * To render strip line on chart\n * @param axis\n * @param stripline\n * @param seriesClipRect\n * @param id\n * @param striplineGroup\n * @param chart\n * @param startValue\n * @param segmentAxis\n * @param count\n */\n StripLine.prototype.renderStripLineElement = function (axis, stripline, seriesClipRect, id, striplineGroup, chart, startValue, segmentAxis, count) {\n var rect = this.measureStripLine(axis, stripline, seriesClipRect, startValue, segmentAxis);\n if (stripline.sizeType === 'Pixel') {\n this.renderPath(stripline, rect, id + 'path_' + axis.name + '_' + count, striplineGroup, chart, axis);\n }\n else {\n if (rect.height !== 0 && rect.width !== 0) {\n this.renderRectangle(stripline, rect, id + 'rect_' + axis.name + '_' + count, striplineGroup, chart);\n }\n }\n if (stripline.text !== '') {\n this.renderText(stripline, rect, id + 'text_' + axis.name + '_' + count, striplineGroup, chart, axis);\n }\n };\n /**\n * To find the factor of the text\n * @param anchor\n */\n StripLine.prototype.factor = function (anchor) {\n var factor = 0;\n switch (anchor) {\n case 'Start':\n factor = 1;\n break;\n case 'End':\n factor = -1;\n break;\n }\n return factor;\n };\n /**\n * To find the start value of the text\n * @param xy\n * @param size\n * @param textAlignment\n */\n StripLine.prototype.getTextStart = function (xy, size, textAlignment) {\n var padding = 5;\n switch (textAlignment) {\n case 'Start':\n xy = xy - (size / 2) + padding;\n break;\n case 'End':\n xy = xy + (size / 2) - padding;\n break;\n }\n return xy;\n };\n /**\n * To get the module name for `StripLine`.\n * @private\n */\n StripLine.prototype.getModuleName = function () {\n return 'StripLine';\n };\n /**\n * To destroy the `StripLine` module.\n * @private\n */\n StripLine.prototype.destroy = function () {\n // destroy peform here\n };\n return StripLine;\n}());\nexport { StripLine };\n","import { getAnimationFunction, pathAnimation, getElement } from '../../common/utils/helper';\nimport { Rect } from '@syncfusion/ej2-svg-base';\nimport { Animation } from '@syncfusion/ej2-base';\n/**\n * Base for line type series.\n */\nvar LineBase = /** @class */ (function () {\n /** @private */\n function LineBase(chartModule) {\n this.chart = chartModule;\n this.padding = 5;\n }\n /**\n * To improve the chart performance.\n * @return {void}\n * @private\n */\n LineBase.prototype.enableComplexProperty = function (series) {\n var tempPoints = [];\n var xVisibleRange = series.xAxis.visibleRange;\n var yVisibleRange = series.yAxis.visibleRange;\n var seriesPoints = series.points;\n var areaBounds = series.clipRect;\n var xTolerance = Math.abs(xVisibleRange.delta / areaBounds.width);\n var yTolerance = Math.abs(yVisibleRange.delta / areaBounds.height);\n var prevXValue = (seriesPoints[0] && seriesPoints[0].x > xTolerance) ? 0 : xTolerance;\n var prevYValue = (seriesPoints[0] && seriesPoints[0].y > yTolerance) ? 0 : yTolerance;\n var xVal = 0;\n var yVal = 0;\n var currentPoint;\n for (var _i = 0, seriesPoints_1 = seriesPoints; _i < seriesPoints_1.length; _i++) {\n var currentPoint_1 = seriesPoints_1[_i];\n currentPoint_1.symbolLocations = [];\n xVal = currentPoint_1.xValue ? currentPoint_1.xValue : xVisibleRange.min;\n yVal = currentPoint_1.yValue ? currentPoint_1.yValue : yVisibleRange.min;\n if (Math.abs(prevXValue - xVal) >= xTolerance || Math.abs(prevYValue - yVal) >= yTolerance) {\n tempPoints.push(currentPoint_1);\n prevXValue = xVal;\n prevYValue = yVal;\n }\n }\n return tempPoints;\n };\n /**\n * To generate the line path direction\n * @param firstPoint\n * @param secondPoint\n * @param series\n * @param isInverted\n * @param getPointLocation\n * @param startPoint\n */\n LineBase.prototype.getLineDirection = function (firstPoint, secondPoint, series, isInverted, getPointLocation, startPoint) {\n var direction = '';\n if (firstPoint != null) {\n var point1 = getPointLocation(firstPoint.xValue, firstPoint.yValue, series.xAxis, series.yAxis, isInverted, series);\n var point2 = getPointLocation(secondPoint.xValue, secondPoint.yValue, series.xAxis, series.yAxis, isInverted, series);\n direction = startPoint + ' ' + (point1.x) + ' ' + (point1.y) + ' ' +\n 'L' + ' ' + (point2.x) + ' ' + (point2.y) + ' ';\n }\n return direction;\n };\n /**\n * To append the line path.\n * @return {void}\n * @private\n */\n LineBase.prototype.appendLinePath = function (options, series, clipRect) {\n var element = getElement(options.id);\n var chart = series.chart;\n var previousDirection = element ? element.getAttribute('d') : null;\n var htmlObject = series.chart.renderer.drawPath(options);\n htmlObject.setAttribute('clip-path', clipRect);\n series.pathElement = htmlObject;\n series.seriesElement.appendChild(htmlObject);\n series.isRectSeries = false;\n pathAnimation(element, options.d, series.chart.redraw, previousDirection, chart.duration);\n };\n /**\n * To render the marker for the series.\n * @return {void}\n * @private\n */\n LineBase.prototype.renderMarker = function (series) {\n if (series.marker && series.marker.visible) {\n series.chart.markerRender.render(series);\n }\n };\n /**\n * To do the progressive animation.\n * @return {void}\n * @private\n */\n LineBase.prototype.doProgressiveAnimation = function (series, option) {\n var animation = new Animation({});\n var path = series.pathElement;\n var strokeDashArray = path.getAttribute('stroke-dasharray');\n var pathLength = series.pathElement.getTotalLength();\n var currentTime;\n path.style.visibility = 'hidden';\n animation.animate(path, {\n duration: option.duration,\n delay: option.delay,\n progress: function (args) {\n if (args.timeStamp >= args.delay) {\n path.style.visibility = 'visible';\n currentTime = Math.abs(Math.round(((args.timeStamp - args.delay) * pathLength) / args.duration));\n path.setAttribute('stroke-dasharray', currentTime + ',' + pathLength);\n }\n },\n end: function (model) {\n path.setAttribute('stroke-dasharray', strokeDashArray);\n series.chart.trigger('animationComplete', { series: series });\n }\n });\n };\n /**\n * To store the symbol location and region\n * @param point\n * @param series\n * @param isInverted\n * @param getLocation\n */\n LineBase.prototype.storePointLocation = function (point, series, isInverted, getLocation) {\n var markerWidth = (series.marker && series.marker.width) ? series.marker.width : 0;\n var markerHeight = (series.marker && series.marker.height) ? series.marker.height : 0;\n point.symbolLocations.push(getLocation(point.xValue, point.yValue, series.xAxis, series.yAxis, isInverted, series));\n point.regions.push(new Rect(point.symbolLocations[0].x - markerWidth, point.symbolLocations[0].y - markerHeight, 2 * markerWidth, 2 * markerHeight));\n };\n /**\n * To do the linear animation.\n * @return {void}\n * @private\n */\n LineBase.prototype.doLinearAnimation = function (series, animation) {\n var clipRect = series.clipRectElement.childNodes[0].childNodes[0];\n var duration = series.chart.animated ? series.chart.duration : animation.duration;\n var effect = getAnimationFunction('Linear');\n var elementHeight = +clipRect.getAttribute('height');\n var elementWidth = +clipRect.getAttribute('width');\n var xCenter = +clipRect.getAttribute('x');\n var yCenter = series.chart.requireInvertedAxis ? +clipRect.getAttribute('height') + +clipRect.getAttribute('y') :\n +clipRect.getAttribute('y');\n var value;\n clipRect.style.visibility = 'hidden';\n new Animation({}).animate(clipRect, {\n duration: duration,\n delay: animation.delay,\n progress: function (args) {\n if (args.timeStamp >= args.delay) {\n clipRect.style.visibility = 'visible';\n if (series.chart.requireInvertedAxis) {\n value = effect(args.timeStamp - args.delay, 0, elementHeight, args.duration);\n clipRect.setAttribute('transform', 'translate(' + xCenter + ' ' + yCenter +\n ') scale(1,' + (value / elementHeight) + ') translate(' + (-xCenter) + ' ' + (-yCenter) + ')');\n }\n else {\n value = effect(args.timeStamp - args.delay, 0, elementWidth, args.duration);\n clipRect.setAttribute('transform', 'translate(' + xCenter + ' ' + yCenter +\n ') scale(' + (value / elementWidth) + ', 1) translate(' + (-xCenter) + ' ' + (-yCenter) + ')');\n }\n }\n },\n end: function (model) {\n clipRect.setAttribute('transform', 'translate(0,0)');\n series.chart.trigger('animationComplete', { series: series });\n }\n });\n };\n return LineBase;\n}());\nexport { LineBase };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { withInRange, getPoint, TransformToVisible } from '../../common/utils/helper';\nimport { PathOption } from '@syncfusion/ej2-svg-base';\nimport { LineBase } from './line-base';\n/**\n * `LineSeries` module used to render the line series.\n */\nvar LineSeries = /** @class */ (function (_super) {\n __extends(LineSeries, _super);\n function LineSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render Line Series.\n * @return {void}.\n * @private\n */\n LineSeries.prototype.render = function (series, xAxis, yAxis, isInverted) {\n var point1;\n var point2;\n var direction = '';\n var prevPoint = null;\n var startPoint = 'M';\n var options;\n var isPolar = (series.chart && series.chart.chartAreaType === 'PolarRadar');\n var isDrop = (series.emptyPointSettings && series.emptyPointSettings.mode === 'Drop');\n var getCoordinate = isPolar ? TransformToVisible : getPoint;\n var visiblePoints = this.enableComplexProperty(series);\n for (var _i = 0, visiblePoints_1 = visiblePoints; _i < visiblePoints_1.length; _i++) {\n var point = visiblePoints_1[_i];\n point.regions = [];\n if (point.visible && withInRange(visiblePoints[point.index - 1], point, visiblePoints[point.index + 1], series)) {\n direction += this.getLineDirection(prevPoint, point, series, isInverted, getCoordinate, startPoint);\n startPoint = prevPoint ? 'L' : startPoint;\n prevPoint = point;\n this.storePointLocation(point, series, isInverted, getCoordinate);\n }\n else {\n prevPoint = isDrop ? prevPoint : null;\n startPoint = isDrop ? startPoint : 'M';\n point.symbolLocations = [];\n }\n }\n if (isPolar) {\n if (series.isClosed) {\n point2 = getCoordinate(visiblePoints[visiblePoints.length - 1].xValue, visiblePoints[visiblePoints.length - 1].yValue, xAxis, yAxis, isInverted, series);\n point1 = getCoordinate(visiblePoints[0].xValue, visiblePoints[0].yValue, xAxis, yAxis, isInverted, series);\n direction = direction.concat(startPoint + ' ' + point2.x + ' ' + point2.y + ' ' + 'L' + ' ' + point1.x + ' ' + point1.y);\n }\n }\n var name = series.category === 'Indicator' ? series.chart.element.id + '_Indicator_' + series.index + '_' + series.name :\n series.category === 'TrendLine' ? series.chart.element.id + '_Series_' + series.sourceIndex + '_TrendLine_' + series.index :\n series.chart.element.id + '_Series_' + (series.index === undefined ? series.category : series.index);\n options = new PathOption(name, 'none', series.width, series.interior, series.opacity, series.dashArray, direction);\n this.appendLinePath(options, series, '');\n this.renderMarker(series);\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n LineSeries.prototype.doAnimation = function (series) {\n var option = series.animation;\n this.doProgressiveAnimation(series, option);\n };\n /**\n * Get module name.\n */\n LineSeries.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'LineSeries';\n };\n /**\n * To destroy the line series.\n * @return {void}\n * @private\n */\n LineSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n return LineSeries;\n}(LineBase));\nexport { LineSeries };\n","import { Animation } from '@syncfusion/ej2-base';\nimport { DoubleRange } from '../utils/double-range';\nimport { appendChildElement, redrawElement, pathAnimation, valueToCoefficient } from '../../common/utils/helper';\nimport { getAnimationFunction, getPoint, getMinPointsDelta } from '../../common/utils/helper';\nimport { PathOption, Rect } from '@syncfusion/ej2-svg-base';\nimport { pointRender } from '../../common/model/constants';\n/**\n * Column Series Base\n */\nvar ColumnBase = /** @class */ (function () {\n function ColumnBase() {\n }\n /**\n * To get the position of the column series.\n * @return {DoubleRange}\n * @private\n */\n ColumnBase.prototype.getSideBySideInfo = function (series) {\n if (series.chart.enableSideBySidePlacement && !series.position) {\n this.getSideBySidePositions(series);\n }\n var position = !series.chart.enableSideBySidePlacement ? 0 : series.position;\n var rectCount = !series.chart.enableSideBySidePlacement ? 1 : series.rectCount;\n series.isRectSeries = true;\n var visibleSeries = series.chart.visibleSeries;\n var seriesSpacing = series.chart.enableSideBySidePlacement ? series.columnSpacing : 0; // Column Spacing\n var pointSpacing = (series.columnWidth === null) ? ((series.type === 'Histogram') ? 1 : 0.7) :\n series.columnWidth; // Column width\n var minimumPointDelta = getMinPointsDelta(series.xAxis, visibleSeries);\n var width = minimumPointDelta * pointSpacing;\n var radius;\n var location = (position) / rectCount - 0.5;\n var doubleRange = new DoubleRange(location, location + (1 / rectCount));\n if (!(isNaN(doubleRange.start) || isNaN(doubleRange.end))) {\n doubleRange = new DoubleRange(doubleRange.start * width, doubleRange.end * width);\n radius = seriesSpacing * doubleRange.delta;\n doubleRange = new DoubleRange(doubleRange.start + radius / 2, doubleRange.end - radius / 2);\n }\n return doubleRange;\n };\n /**\n * To get the rect values.\n * @return {Rect}\n * @private\n */\n ColumnBase.prototype.getRectangle = function (x1, y1, x2, y2, series) {\n var point1 = getPoint(x1, y1, series.xAxis, series.yAxis, series.chart.requireInvertedAxis);\n var point2 = getPoint(x2, y2, series.xAxis, series.yAxis, series.chart.requireInvertedAxis);\n return new Rect(Math.min(point1.x, point2.x), Math.min(point1.y, point2.y), Math.abs(point2.x - point1.x), Math.abs(point2.y - point1.y));\n };\n /**\n * To get the position of each series.\n * @return {void}\n * @private\n */\n ColumnBase.prototype.getSideBySidePositions = function (series) {\n var chart = series.chart;\n for (var _i = 0, _a = chart.columns; _i < _a.length; _i++) {\n var columnItem = _a[_i];\n for (var _b = 0, _c = chart.rows; _b < _c.length; _b++) {\n var item = _c[_b];\n this.findRectPosition(series.findSeriesCollection(columnItem, item, false));\n }\n }\n };\n ColumnBase.prototype.findRectPosition = function (seriesCollection) {\n var stackingGroup = [];\n var vSeries = { rectCount: 0, position: null };\n seriesCollection.forEach(function (value) {\n if (value.type.indexOf('Stacking') !== -1) {\n if (value.stackingGroup) {\n if (stackingGroup[value.stackingGroup] === undefined) {\n value.position = vSeries.rectCount;\n stackingGroup[value.stackingGroup] = vSeries.rectCount++;\n }\n else {\n value.position = stackingGroup[value.stackingGroup];\n }\n }\n else {\n if (vSeries.position === null) {\n value.position = vSeries.rectCount;\n vSeries.position = vSeries.rectCount++;\n }\n else {\n value.position = vSeries.position;\n }\n }\n }\n else {\n value.position = vSeries.rectCount++;\n }\n });\n seriesCollection.forEach(function (value) {\n value.rectCount = vSeries.rectCount;\n });\n };\n /**\n * Updates the symbollocation for points\n * @return void\n * @private\n */\n ColumnBase.prototype.updateSymbolLocation = function (point, rect, series) {\n if (!series.chart.requireInvertedAxis) {\n this.updateXRegion(point, rect, series);\n }\n else {\n this.updateYRegion(point, rect, series);\n }\n if (series.type === 'Histogram') {\n point.minimum = +point.x - series.histogramValues.binWidth / 2;\n point.maximum = +point.x + series.histogramValues.binWidth / 2;\n }\n };\n /**\n * Update the region for the point.\n * @return {void}\n * @private\n */\n ColumnBase.prototype.updateXRegion = function (point, rect, series) {\n point.regions.push(rect);\n point.symbolLocations.push({\n x: rect.x + (rect.width) / 2,\n y: (series.seriesType === 'BoxPlot' || series.seriesType.indexOf('HighLow') !== -1 ||\n (point.yValue >= 0 === !series.yAxis.isInversed)) ? rect.y : (rect.y + rect.height)\n });\n if (series.type === 'RangeColumn') {\n point.symbolLocations.push({\n x: rect.x + (rect.width) / 2,\n y: rect.y + rect.height\n });\n }\n };\n /**\n * Update the region for the point in bar series.\n * @return {void}\n * @private\n */\n ColumnBase.prototype.updateYRegion = function (point, rect, series) {\n point.regions.push(rect);\n point.symbolLocations.push({\n x: (series.seriesType === 'BoxPlot' || series.seriesType.indexOf('HighLow') !== -1 ||\n (point.yValue >= 0 === !series.yAxis.isInversed)) ? rect.x + rect.width : rect.x,\n y: rect.y + rect.height / 2\n });\n if (series.type === 'RangeColumn') {\n point.symbolLocations.push({\n x: rect.x,\n y: rect.y + rect.height / 2\n });\n }\n };\n /**\n * To render the marker for the series.\n * @return {void}\n * @private\n */\n ColumnBase.prototype.renderMarker = function (series) {\n if (series.marker && series.marker.visible) {\n series.chart.markerRender.render(series);\n }\n };\n /**\n * To trigger the point rendering event.\n * @return {void}\n * @private\n */\n ColumnBase.prototype.triggerEvent = function (series, point, fill, border) {\n var argsData = {\n cancel: false, name: pointRender, series: series, point: point,\n fill: series.setPointColor(point, fill),\n border: series.setBorderColor(point, border)\n };\n series.chart.trigger(pointRender, argsData);\n point.color = argsData.fill;\n return argsData;\n };\n /**\n * To draw the rectangle for points.\n * @return {void}\n * @private\n */\n ColumnBase.prototype.drawRectangle = function (series, point, rect, argsData) {\n var chart = series.chart;\n var check = chart.requireInvertedAxis ? rect.height : rect.width;\n if (check <= 0) {\n return null;\n }\n var direction = this.calculateRoundedRectPath(rect, series.cornerRadius.topLeft, series.cornerRadius.topRight, series.cornerRadius.bottomLeft, series.cornerRadius.bottomRight);\n var name = series.category === 'Indicator' ? chart.element.id + '_Indicator_' + series.index + '_' + series.name +\n '_Point_' + point.index : chart.element.id + '_Series_' + series.index + '_Point_' + point.index;\n var previousElement = redrawElement(chart.redraw, name);\n var previousDirection = previousElement ? previousElement.getAttribute('d') : '';\n var options = new PathOption(name, argsData.fill, argsData.border.width, argsData.border.color, series.opacity, series.dashArray, direction);\n var element = chart.renderer.drawPath(options);\n switch (series.seriesType) {\n case 'XY':\n element.setAttribute('aria-label', point.x.toString() + ':' + point.yValue.toString());\n break;\n case 'HighLow':\n element.setAttribute('aria-label', point.x.toString() + ':' + point.high.toString() + ':' + point.low.toString());\n break;\n }\n appendChildElement(series.seriesElement, element, chart.redraw);\n pathAnimation(element, direction, chart.redraw, previousDirection, chart.duration);\n };\n /**\n * To animate the series.\n * @return {void}\n * @private\n */\n ColumnBase.prototype.animate = function (series) {\n var rectElements = series.seriesElement.childNodes;\n var count = series.category === 'Indicator' ? 0 : 1;\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n if (!point.symbolLocations.length && !(series.type === 'BoxAndWhisker' && point.regions.length)) {\n continue;\n }\n this.animateRect(rectElements[count], series, point);\n count++;\n }\n };\n /**\n * To animate the series.\n * @return {void}\n * @private\n */\n ColumnBase.prototype.animateRect = function (element, series, point) {\n var option = series.animation;\n var duration = series.chart.animated ? series.chart.duration : option.duration;\n var effect = getAnimationFunction('Linear');\n var isPlot = point.yValue < 0;\n var x;\n var y;\n var elementHeight = +point.regions[0].height;\n var elementWidth = +point.regions[0].width;\n var centerX;\n var centerY;\n if (!series.chart.requireInvertedAxis) {\n x = +point.regions[0].x;\n if (series.type.indexOf('Stacking') > -1) {\n y = (1 - valueToCoefficient(0, series.yAxis)) * (series.yAxis.rect.height);\n centerX = x;\n centerY = y;\n }\n else {\n y = +point.regions[0].y;\n centerY = (series.seriesType.indexOf('HighLow') !== -1 || series.type.indexOf('Waterfall') !== -1) ? y + elementHeight / 2 :\n (isPlot !== series.yAxis.isInversed) ? y : y + elementHeight;\n centerX = isPlot ? x : x + elementWidth;\n }\n }\n else {\n y = +point.regions[0].y;\n if (series.type.indexOf('Stacking') > -1) {\n x = (valueToCoefficient(0, series.yAxis)) * series.yAxis.rect.width;\n centerX = x;\n centerY = y;\n }\n else {\n x = +point.regions[0].x;\n centerY = isPlot ? y : y + elementHeight;\n centerX = (series.seriesType.indexOf('HighLow') !== -1 || series.type.indexOf('Waterfall') !== -1) ? x + elementWidth / 2 :\n (isPlot !== series.yAxis.isInversed) ? x + elementWidth : x;\n }\n }\n var value;\n element.style.visibility = 'hidden';\n new Animation({}).animate(element, {\n duration: duration,\n delay: option.delay,\n progress: function (args) {\n if (args.timeStamp >= args.delay) {\n element.style.visibility = 'visible';\n if (!series.chart.requireInvertedAxis) {\n elementHeight = elementHeight ? elementHeight : 1;\n value = effect(args.timeStamp - args.delay, 0, elementHeight, args.duration);\n element.setAttribute('transform', 'translate(' + centerX + ' ' + centerY +\n ') scale(1,' + (value / elementHeight) + ') translate(' + (-centerX) + ' ' + (-centerY) + ')');\n }\n else {\n elementWidth = elementWidth ? elementWidth : 1;\n value = effect(args.timeStamp - args.delay, 0, elementWidth, args.duration);\n element.setAttribute('transform', 'translate(' + centerX + ' ' + centerY +\n ') scale(' + (value / elementWidth) + ', 1) translate(' + (-centerX) + ' ' + (-centerY) + ')');\n }\n }\n },\n end: function (model) {\n element.setAttribute('transform', 'translate(0,0)');\n var seriesElement = series.seriesElement;\n if (element === seriesElement.lastElementChild || point.index === series.points.length - 1 ||\n (series.type === 'Waterfall' && element === seriesElement.children[seriesElement.childElementCount - 2])) {\n series.chart.trigger('animationComplete', { series: series });\n if (series.type === 'Waterfall') {\n var rectElements = seriesElement.childNodes;\n for (var i = 0; i < rectElements.length; i++) {\n if (rectElements[i].id.indexOf('Connector') !== -1) {\n rectElements[i].style.visibility = 'visible';\n rectElements[i].setAttribute('transform', 'translate(0,0)');\n }\n }\n }\n }\n }\n });\n };\n /**\n * To get rounded rect path direction\n */\n ColumnBase.prototype.calculateRoundedRectPath = function (rect, topLeft, topRight, bottomLeft, bottomRight) {\n return 'M' + ' ' + rect.x + ' ' + (topLeft + rect.y) +\n ' Q ' + rect.x + ' ' + rect.y + ' ' + (rect.x + topLeft) + ' ' +\n rect.y + ' ' + 'L' + ' ' + (rect.x + rect.width - topRight) + ' ' + rect.y +\n ' Q ' + (rect.x + rect.width) + ' ' + rect.y + ' ' +\n (rect.x + rect.width) + ' ' + (rect.y + topRight) + ' ' + 'L ' +\n (rect.x + rect.width) + ' ' + (rect.y + rect.height - bottomRight)\n + ' Q ' + (rect.x + rect.width) + ' ' + (rect.y + rect.height) + ' ' + (rect.x + rect.width - bottomRight) + ' ' +\n (rect.y + rect.height) + ' ' + 'L ' + (rect.x + bottomLeft) + ' ' + (rect.y + rect.height) + ' Q ' + rect.x + ' ' +\n (rect.y + rect.height) + ' ' + rect.x + ' ' + (rect.y + rect.height - bottomLeft) + ' ' + 'L' + ' ' + rect.x + ' ' +\n (topLeft + rect.y) + ' ' + 'Z';\n };\n return ColumnBase;\n}());\nexport { ColumnBase };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { withInRange } from '../../common/utils/helper';\nimport { ColumnBase } from './column-base';\n/**\n * `ColumnSeries` Module used to render the column series.\n */\nvar ColumnSeries = /** @class */ (function (_super) {\n __extends(ColumnSeries, _super);\n function ColumnSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render Column series.\n * @return {void}\n * @private\n */\n ColumnSeries.prototype.render = function (series) {\n var rect;\n var sideBySideInfo = this.getSideBySideInfo(series);\n var origin = Math.max(series.yAxis.visibleRange.min, 0);\n var argsData;\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var pointColumn = _a[_i];\n pointColumn.symbolLocations = [];\n pointColumn.regions = [];\n if (pointColumn.visible && withInRange(series.points[pointColumn.index - 1], pointColumn, series.points[pointColumn.index + 1], series)) {\n rect = this.getRectangle(pointColumn.xValue + sideBySideInfo.start, pointColumn.yValue, pointColumn.xValue + sideBySideInfo.end, origin, series);\n var color = series.category === 'Indicator' ? pointColumn.color : series.interior;\n argsData = this.triggerEvent(series, pointColumn, color, { width: series.border.width, color: series.border.color });\n if (!argsData.cancel) {\n this.updateSymbolLocation(pointColumn, rect, series);\n this.drawRectangle(series, pointColumn, rect, argsData);\n }\n }\n }\n this.renderMarker(series);\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n ColumnSeries.prototype.doAnimation = function (series) {\n this.animate(series);\n };\n /**\n * Get module name.\n */\n ColumnSeries.prototype.getModuleName = function () {\n return 'ColumnSeries';\n /**\n * return the module name\n */\n };\n /**\n * To destroy the column series.\n * @return {void}\n * @private\n */\n ColumnSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n return ColumnSeries;\n}(ColumnBase));\nexport { ColumnSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { getPoint, appendClipElement, pathAnimation } from '../../common/utils/helper';\nimport { LineBase } from './line-base';\nimport { RectOption, getElement } from '../../common/utils/helper';\nimport { DataUtil } from '@syncfusion/ej2-data';\n/**\n * Base class for multi colored series\n */\nvar MultiColoredSeries = /** @class */ (function (_super) {\n __extends(MultiColoredSeries, _super);\n function MultiColoredSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * To Generate the area path direction\n * @param xValue\n * @param yValue\n * @param series\n * @param isInverted\n * @param getPointLocation\n * @param startPoint\n * @param startPath\n */\n MultiColoredSeries.prototype.getAreaPathDirection = function (xValue, yValue, series, isInverted, getPointLocation, startPoint, startPath) {\n var direction = '';\n var firstPoint;\n if (startPoint === null) {\n firstPoint = getPointLocation(xValue, yValue, series.xAxis, series.yAxis, isInverted, series);\n direction += (startPath + ' ' + (firstPoint.x) + ' ' + (firstPoint.y) + ' ');\n }\n return direction;\n };\n /**\n * To Generate the empty point direction\n * @param firstPoint\n * @param secondPoint\n * @param series\n * @param isInverted\n * @param getPointLocation\n */\n MultiColoredSeries.prototype.getAreaEmptyDirection = function (firstPoint, secondPoint, series, isInverted, getPointLocation) {\n var direction = '';\n direction += this.getAreaPathDirection(firstPoint.x, firstPoint.y, series, isInverted, getPointLocation, null, 'L');\n direction += this.getAreaPathDirection(secondPoint.x, secondPoint.y, series, isInverted, getPointLocation, null, 'L');\n return direction;\n };\n /**\n * To set point color\n * @param points\n */\n MultiColoredSeries.prototype.setPointColor = function (currentPoint, previous, series, isXSegment, segments) {\n if (series.pointColorMapping === '') {\n var segment = void 0;\n var value = void 0;\n for (var i = 0; i < segments.length; i++) {\n segment = segments[i];\n value = isXSegment ? currentPoint.xValue : currentPoint.yValue;\n if (value <= this.getAxisValue(segment.value, isXSegment ? series.xAxis : series.yAxis, series.chart) || !segment.value) {\n currentPoint.interior = segment.color;\n break;\n }\n }\n if (currentPoint.interior == null) {\n currentPoint.interior = series.interior;\n }\n return false;\n }\n else {\n if (previous) {\n return series.setPointColor(currentPoint, series.interior) !== series.setPointColor(previous, series.interior);\n }\n else {\n return false;\n }\n }\n };\n MultiColoredSeries.prototype.sortSegments = function (series, chartSegments) {\n var axis = series.segmentAxis === 'X' ? series.xAxis : series.yAxis;\n var segments = [].concat(chartSegments);\n var access = this;\n return segments.sort(function (a, b) {\n return access.getAxisValue(a.value, axis, series.chart) - access.getAxisValue(b.value, axis, series.chart);\n });\n };\n /**\n * Segment calculation performed here\n * @param series\n * @param options\n * @param chartSegments\n */\n MultiColoredSeries.prototype.applySegmentAxis = function (series, options, segments) {\n var _this = this;\n if (series.pointColorMapping !== '') {\n options.map(function (option) {\n _this.appendLinePath(option, series, '');\n });\n return null;\n }\n var isXSegment = series.segmentAxis === 'X';\n var axis = isXSegment ? series.xAxis : series.yAxis;\n var chart = series.chart;\n var segment;\n this.includeSegment(segments, axis, series, segments.length);\n var length = segments.length;\n var value;\n var clipPath;\n var attributeOptions;\n var _loop_1 = function (index) {\n segment = segments[index];\n value = this_1.getAxisValue(segment.value, axis, series.chart);\n clipPath = this_1.createClipRect(index ? this_1.getAxisValue(segments[index - 1].value, axis, series.chart)\n : axis.visibleRange.min, value, series, index, isXSegment);\n if (clipPath) {\n options.map(function (option) {\n attributeOptions = {\n 'clip-path': clipPath,\n 'stroke-dasharray': segment.dashArray,\n 'opacity': option.opacity,\n 'stroke': series.type.indexOf('Line') > -1 ? segment.color || series.interior : series.border.color,\n 'stroke-width': option['stroke-width'],\n 'fill': series.type.indexOf('Line') > -1 ? 'none' : segment.color || series.interior,\n 'id': option.id + '_Segment_' + index,\n 'd': option.d\n };\n pathAnimation(getElement(attributeOptions.id), attributeOptions.d, chart.redraw);\n series.seriesElement.appendChild(chart.renderer.drawPath(attributeOptions));\n });\n }\n };\n var this_1 = this;\n for (var index = 0; index < length; index++) {\n _loop_1(index);\n }\n };\n MultiColoredSeries.prototype.includeSegment = function (segments, axis, series, length) {\n if (length <= 0) {\n segments.push({ value: axis.visibleRange.max, color: series.interior });\n return null;\n }\n if (this.getAxisValue(segments[length - 1].value, axis, series.chart) < axis.visibleRange.max) {\n segments.push({ value: axis.visibleRange.max, color: series.interior });\n }\n };\n /**\n * To create clip rect for segment axis\n * @param startValue\n * @param endValue\n * @param series\n * @param index\n * @param isX\n * @param chart\n */\n MultiColoredSeries.prototype.createClipRect = function (startValue, endValue, series, index, isX) {\n var isRequired = series.chart.requireInvertedAxis;\n var startPointLocation = getPoint(isX ? startValue : series.xAxis.visibleRange.min, isX ? series.yAxis.visibleRange.max : endValue, series.xAxis, series.yAxis, isRequired);\n var endPointLocation = getPoint(isX ? endValue : series.xAxis.visibleRange.max, isX ? series.yAxis.visibleRange.min : startValue, series.xAxis, series.yAxis, isRequired);\n endPointLocation = isRequired ?\n [startPointLocation, startPointLocation = endPointLocation][0] : endPointLocation;\n var options;\n if ((endPointLocation.x - startPointLocation.x > 0) && (endPointLocation.y - startPointLocation.y > 0)) {\n options = new RectOption(series.chart.element.id + '_ChartSegmentClipRect_' + index, 'transparent', { width: 1, color: 'Gray' }, 1, {\n x: startPointLocation.x,\n y: startPointLocation.y,\n width: endPointLocation.x - startPointLocation.x,\n height: endPointLocation.y - startPointLocation.y\n });\n series.seriesElement.appendChild(appendClipElement(series.chart.redraw, options, series.chart.renderer));\n return 'url(#' + series.chart.element.id + '_ChartSegmentClipRect_' + index + ')';\n }\n return null;\n };\n /**\n * To get exact value from segment value\n * @param segmentValue\n * @param axis\n * @param chart\n */\n MultiColoredSeries.prototype.getAxisValue = function (segmentValue, axis, chart) {\n if (segmentValue === null) {\n segmentValue = axis.visibleRange.max;\n }\n if (axis.valueType === 'DateTime') {\n var option = { skeleton: 'full', type: 'dateTime' };\n return Date.parse(chart.intl.getDateParser(option)(chart.intl.getDateFormat(option)(new Date(DataUtil.parse.parseJson({ val: segmentValue }).val))));\n }\n else if (axis.valueType.indexOf('Category') > -1) {\n var xValue = axis.valueType === 'DateTimeCategory' ?\n (segmentValue.getTime()).toString() :\n segmentValue;\n return (axis.labels.indexOf(xValue) < 0) ? +segmentValue : axis.labels.indexOf(xValue);\n }\n else {\n return +segmentValue;\n }\n };\n return MultiColoredSeries;\n}(LineBase));\nexport { MultiColoredSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { getPoint, withInRange, ChartLocation, TransformToVisible } from '../../common/utils/helper';\nimport { PathOption } from '@syncfusion/ej2-svg-base';\nimport { MultiColoredSeries } from './multi-colored-base';\n/**\n * `AreaSeries` module is used to render the area series.\n */\nvar AreaSeries = /** @class */ (function (_super) {\n __extends(AreaSeries, _super);\n function AreaSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render Area series.\n * @return {void}\n * @private\n */\n AreaSeries.prototype.render = function (series, xAxis, yAxis, isInverted) {\n var _this = this;\n var startPoint = null;\n var direction = '';\n var origin = series.chart.chartAreaType === 'PolarRadar' ? series.points[0].yValue :\n Math.max(series.yAxis.visibleRange.min, 0);\n var currentXValue;\n var isPolar = (series.chart && series.chart.chartAreaType === 'PolarRadar');\n var isDropMode = (series.emptyPointSettings && series.emptyPointSettings.mode === 'Drop');\n var borderWidth = series.border ? series.border.width : 0;\n var borderColor = series.border ? series.border.color : 'transparent';\n var getCoordinate = series.chart.chartAreaType === 'PolarRadar' ? TransformToVisible : getPoint;\n series.points.map(function (point, i, seriesPoints) {\n currentXValue = point.xValue;\n point.symbolLocations = [];\n point.regions = [];\n if (point.visible && withInRange(seriesPoints[i - 1], point, seriesPoints[i + 1], series)) {\n direction += _this.getAreaPathDirection(currentXValue, origin, series, isInverted, getCoordinate, startPoint, 'M');\n startPoint = startPoint || new ChartLocation(currentXValue, origin);\n // First Point to draw the area path\n direction += _this.getAreaPathDirection(currentXValue, point.yValue, series, isInverted, getCoordinate, null, 'L');\n if (seriesPoints[i + 1] && !seriesPoints[i + 1].visible && !isDropMode) {\n direction += _this.getAreaEmptyDirection({ 'x': currentXValue, 'y': origin }, startPoint, series, isInverted, getCoordinate);\n startPoint = null;\n }\n _this.storePointLocation(point, series, isInverted, getCoordinate);\n }\n });\n if (isPolar) {\n direction = direction.concat(direction + ' ' + 'Z');\n }\n this.appendLinePath(new PathOption(series.chart.element.id + '_Series_' + series.index, series.interior, borderWidth, borderColor, series.opacity, series.dashArray, (series.points.length > 1 ? (direction + this.getAreaPathDirection(series.points[series.points.length - 1].xValue, series.chart.chartAreaType === 'PolarRadar' ?\n series.points[series.points.length - 1].yValue : origin, series, isInverted, getCoordinate, null, 'L')) : '')), series, '');\n this.renderMarker(series);\n };\n /**\n * To destroy the area series.\n * @return {void}\n * @private\n */\n AreaSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method calling here\n */\n };\n /**\n * Get module name\n */\n AreaSeries.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'AreaSeries';\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n AreaSeries.prototype.doAnimation = function (series) {\n var option = series.animation;\n this.doLinearAnimation(series, option);\n };\n return AreaSeries;\n}(MultiColoredSeries));\nexport { AreaSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { withInRange } from '../../common/utils/helper';\nimport { ColumnBase } from './column-base';\n/**\n * `BarSeries` module is used to render the bar series.\n */\nvar BarSeries = /** @class */ (function (_super) {\n __extends(BarSeries, _super);\n function BarSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render Bar series.\n * @return {void}\n * @private\n */\n BarSeries.prototype.render = function (series) {\n var origin = Math.max(series.yAxis.visibleRange.min, 0);\n var sideBySideInfo = this.getSideBySideInfo(series);\n var rect;\n var argsData;\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var pointBar = _a[_i];\n pointBar.symbolLocations = [];\n pointBar.regions = [];\n if (pointBar.visible && withInRange(series.points[pointBar.index - 1], pointBar, series.points[pointBar.index + 1], series)) {\n rect = this.getRectangle(pointBar.xValue + sideBySideInfo.start, pointBar.yValue, pointBar.xValue + sideBySideInfo.end, origin, series);\n argsData = this.triggerEvent(series, pointBar, series.interior, { width: series.border.width, color: series.border.color });\n if (!argsData.cancel) {\n this.updateSymbolLocation(pointBar, rect, series);\n this.drawRectangle(series, pointBar, rect, argsData);\n }\n }\n }\n this.renderMarker(series);\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n BarSeries.prototype.doAnimation = function (series) {\n this.animate(series);\n };\n /**\n * To destroy the bar series.\n * @return {void}\n * @private\n */\n BarSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n /**\n * Get module name\n */\n BarSeries.prototype.getModuleName = function () {\n return 'BarSeries';\n };\n return BarSeries;\n}(ColumnBase));\nexport { BarSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { valueToCoefficient, inside } from '../../common/utils/helper';\nimport { appendChildElement } from '../../common/utils/helper';\nimport { CircleOption } from '../../common/utils/helper';\nimport { Size, measureText, TextOption, PathOption, Rect } from '@syncfusion/ej2-svg-base';\nimport { LineBase } from '../series/line-base';\nimport { textElement, ChartLocation, valueToPolarCoefficient, CoefficientToVector, getElement } from '../../common/utils/helper';\n/**\n * Specifies the Polar Axis Layout.\n */\nvar axisPadding = 10;\nvar PolarRadarPanel = /** @class */ (function (_super) {\n __extends(PolarRadarPanel, _super);\n function PolarRadarPanel() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Measure the polar radar axis size.\n * @return {void}\n * @private\n */\n PolarRadarPanel.prototype.measureAxis = function (rect) {\n var chart = this.chart;\n this.initialClipRect = rect;\n this.seriesClipRect = new Rect(rect.x, rect.y, rect.width, rect.height);\n //Measure axis size calculation\n this.measureRowAxis(chart, this.initialClipRect);\n this.measureColumnAxis(chart, this.initialClipRect);\n this.calculateAxisSize();\n };\n PolarRadarPanel.prototype.measureRowAxis = function (chart, rect) {\n this.calculateRowSize(rect);\n var row = chart.rows[0];\n this.measureDefinition(row, chart, new Size(chart.availableSize.width, row.computedHeight), rect);\n };\n PolarRadarPanel.prototype.measureColumnAxis = function (chart, rect) {\n this.calculateColumnSize(rect);\n var column = chart.columns[0];\n this.measureDefinition(column, chart, new Size(column.computedWidth, chart.availableSize.height), rect);\n };\n /**\n * Measure the column and row in chart.\n * @return {void}\n * @private\n */\n PolarRadarPanel.prototype.measureDefinition = function (definition, chart, size, clipRect) {\n for (var _i = 0, _a = definition.axes; _i < _a.length; _i++) {\n var axis = _a[_i];\n axis.getModule(chart);\n axis.baseModule.calculateRangeAndInterval(size, axis);\n }\n };\n /**\n * Measure the axis.\n * @return {void}\n * @private\n */\n PolarRadarPanel.prototype.calculateAxisSize = function () {\n var chart = this.chart;\n var axis;\n var padding = 5;\n this.centerX = this.initialClipRect.width * 0.5 + this.initialClipRect.x;\n this.centerY = this.initialClipRect.height * 0.5 + this.initialClipRect.y;\n chart.radius = Math.min(this.initialClipRect.width, this.initialClipRect.height) / 2 - padding -\n chart.primaryXAxis.majorTickLines.height - chart.primaryXAxis.maxLabelSize.height;\n chart.radius = (chart.primaryXAxis.coefficient * chart.radius) / 100;\n this.seriesClipRect.y = this.centerY - chart.radius;\n this.seriesClipRect.x = this.centerX - chart.radius;\n this.seriesClipRect.height = 2 * chart.radius;\n this.seriesClipRect.width = 2 * chart.radius;\n this.calculateRowSize(this.seriesClipRect);\n axis = chart.primaryYAxis;\n axis.rect = this.seriesClipRect;\n this.calculateColumnSize(this.seriesClipRect);\n axis = chart.primaryXAxis;\n axis.rect = this.seriesClipRect;\n };\n /**\n * Measure the axis.\n * @return {void}\n * @private\n */\n PolarRadarPanel.prototype.measure = function () {\n var chart = this.chart;\n chart.verticalAxes.push(chart.primaryYAxis);\n var row = chart.rows[0];\n row.axes[0] = chart.primaryYAxis;\n chart.rows[0] = row;\n chart.horizontalAxes.push(chart.primaryXAxis);\n var column = chart.columns[0];\n column.axes[0] = chart.primaryXAxis;\n chart.columns[0] = column;\n };\n /**\n * Measure the row size.\n * @return {void}\n */\n PolarRadarPanel.prototype.calculateRowSize = function (rect) {\n /*! Calculate row size */\n var chart = this.chart;\n var row = chart.rows[0];\n row.computedHeight = rect.height / 2;\n row.computedTop = rect.y;\n chart.rows[0] = row;\n };\n /**\n * Measure the row size.\n * @return {void}\n */\n PolarRadarPanel.prototype.calculateColumnSize = function (rect) {\n /*! Calculate column size */\n var chart = this.chart;\n var column = chart.columns[0];\n column.computedLeft = rect.x;\n column.computedWidth = rect.width;\n chart.columns[0] = column;\n };\n /**\n * To render the axis element.\n * @return {void}\n * @private\n */\n PolarRadarPanel.prototype.renderAxes = function () {\n var axis;\n var chart = this.chart;\n this.startAngle = chart.primaryXAxis.startAngle;\n var axisElement = chart.renderer.createGroup({ id: chart.element.id + 'AxisCollection' });\n var axisLineElement = chart.renderer.createGroup({ id: chart.element.id + 'AxisOutsideCollection' });\n for (var i = 0, len = chart.axisCollections.length; i < len; i++) {\n this.element = chart.renderer.createGroup({ id: chart.element.id + 'AxisGroup' + i });\n axis = chart.axisCollections[i];\n if (axis.orientation === 'Horizontal') {\n if (axis.majorGridLines.width > 0 || axis.majorTickLines.width > 0) {\n this.drawXAxisGridLine(axis, i);\n }\n if (axis.visible) {\n this.drawXAxisLabels(axis, i);\n }\n }\n else {\n this.drawYAxisGridLine(axis, i);\n if (axis.lineStyle.width > 0) {\n this.drawYAxisLine(axis, i, axis.plotOffset, 0);\n }\n if (axis.visible) {\n this.drawYAxisLabels(axis, i);\n }\n }\n axisElement.appendChild(this.element);\n }\n axisElement.appendChild(this.element);\n appendChildElement(chart.svgObject, axisElement, chart.redraw);\n return axisLineElement;\n };\n PolarRadarPanel.prototype.drawYAxisLine = function (axis, index, plotX, plotY) {\n var chart = this.chart;\n var optionsLine = {};\n var vector = CoefficientToVector(valueToPolarCoefficient(axis.visibleLabels[0].value, axis), this.startAngle);\n var axisLine = 'M ' + this.centerX + ' ' + this.centerY + 'L ' +\n (this.centerX + chart.radius * vector.x) + ' ' + (this.centerY + chart.radius * vector.y);\n optionsLine = {\n 'id': chart.element.id + 'AxisLine_' + index,\n 'd': axisLine,\n 'stroke-dasharray': axis.lineStyle.dashArray,\n 'stroke-width': axis.lineStyle.width,\n 'stroke': axis.lineStyle.color || chart.themeStyle.axisLine\n };\n chart.yAxisElements.appendChild(chart.renderer.drawPath(optionsLine));\n };\n PolarRadarPanel.prototype.drawYAxisLabels = function (axis, index) {\n var chart = this.chart;\n var elementSize;\n var options;\n var pointX = 0;\n var pointY = 0;\n var vector;\n var angle = this.startAngle < 0 ? this.startAngle + 360 : this.startAngle;\n var anchor = 'middle';\n var radius;\n var padding = 5;\n var labelElement = chart.renderer.createGroup({ id: chart.element.id + 'AxisLabels' + index });\n vector = CoefficientToVector(valueToPolarCoefficient(axis.visibleLabels[0].value, axis), this.startAngle);\n for (var i = 0, len = axis.visibleLabels.length; i < len; i++) {\n radius = chart.radius * valueToCoefficient(axis.visibleLabels[i].value, axis);\n elementSize = axis.visibleLabels[i].size;\n radius = chart.radius * valueToCoefficient(axis.visibleLabels[i].value, axis);\n pointX = (this.centerX + radius * vector.x) + ((axis.majorTickLines.height + elementSize.width / 2 + padding / 2)\n * (Math.cos(angle * Math.PI / 180)) * (axis.labelPosition === 'Inside' ? 1 : -1));\n pointY = (this.centerY + radius * vector.y) + ((axis.majorTickLines.height + elementSize.height / 2)\n * (Math.sin(angle * Math.PI / 180)) * (axis.labelPosition === 'Inside' ? 1 : -1));\n options = new TextOption(chart.element.id + index + '_AxisLabel_' + i, pointX, pointY + (elementSize.height / 4), anchor, axis.visibleLabels[i].text);\n textElement(options, axis.labelStyle, axis.labelStyle.color || chart.themeStyle.axisLabel, labelElement, false, chart.redraw, true, true);\n }\n chart.yAxisElements.appendChild(labelElement);\n };\n PolarRadarPanel.prototype.drawYAxisGridLine = function (axis, index) {\n var chart = this.chart;\n var options;\n var radius;\n var majorTick = '';\n var majorGrid = '';\n var vector;\n var vector2;\n var angle = this.startAngle < 0 ? this.startAngle + 360 : this.startAngle;\n var rect = axis.rect;\n var x1;\n var y1;\n var x2;\n var y2;\n var border = {\n color: axis.majorGridLines.color || chart.themeStyle.majorGridLine,\n width: axis.majorGridLines.width\n };\n var previousValue;\n var element;\n if (axis.majorGridLines.width > 0) {\n if (chart.visibleSeries[0].type === 'Polar') {\n for (var j = 0; j < axis.visibleLabels.length; j++) {\n element = getElement(chart.element.id + '_MajorGridLine_' + index + '_' + j);\n previousValue = element ? element.getAttribute('r') : null;\n radius = chart.radius * valueToCoefficient(axis.visibleLabels[j].value, axis);\n options = new CircleOption(chart.element.id + '_MajorGridLine_' + index + '_' + j, 'transparent', border, axis.majorGridLines.width, this.centerX, this.centerY, radius);\n appendChildElement(this.element, chart.renderer.drawCircle(options), chart.redraw, true, 'r', 'r', new ChartLocation(+previousValue, +previousValue), null, true);\n }\n }\n else {\n for (var j = 0; j < axis.visibleLabels.length; j++) {\n radius = chart.radius * valueToCoefficient(axis.visibleLabels[j].value, axis);\n majorGrid = '';\n for (var i = 0, len = chart.primaryXAxis.visibleLabels.length; i < len; i++) {\n vector = CoefficientToVector(valueToPolarCoefficient(chart.primaryXAxis.visibleLabels[i].value, chart.primaryXAxis), this.startAngle);\n if (i + 1 < len) {\n vector2 = CoefficientToVector(valueToPolarCoefficient(chart.primaryXAxis.visibleLabels[i + 1].value, chart.primaryXAxis), this.startAngle);\n }\n else {\n vector2 = CoefficientToVector(valueToPolarCoefficient(chart.primaryXAxis.visibleLabels[0].value, chart.primaryXAxis), this.startAngle);\n }\n x1 = this.centerX + radius * vector.x;\n y1 = this.centerY + radius * vector.y;\n x2 = this.centerX + radius * vector2.x;\n y2 = this.centerY + radius * vector2.y;\n majorGrid = majorGrid.concat((i ? 'L ' : 'M ') + ' ' + x1 + ' ' + y1 + ' ' + 'L ' + ' ' + x2 + ' ' + y2 + ' ');\n }\n element = getElement(chart.element.id + '_MajorGridLine_' + index + '_' + j);\n previousValue = element ? element.getAttribute('d') : null;\n options = new PathOption(chart.element.id + '_MajorGridLine_' + index + '_' + j, 'transparent', axis.majorGridLines.width, axis.majorGridLines.color || chart.themeStyle.majorGridLine, null, null, majorGrid);\n appendChildElement(this.element, chart.renderer.drawPath(options), chart.redraw, true, 'x', 'y', null, previousValue, true);\n }\n }\n }\n if (axis.majorTickLines.width > 0) {\n vector = CoefficientToVector(valueToPolarCoefficient(axis.visibleLabels[0].value, axis), this.startAngle);\n for (var i = 0; i < axis.visibleLabels.length; i++) {\n radius = chart.radius * valueToCoefficient(axis.visibleLabels[i].value, axis);\n x1 = this.centerX + radius * vector.x;\n y1 = this.centerY + radius * vector.y;\n x2 = x1 + (axis.majorTickLines.height * (Math.cos(angle * Math.PI / 180)) * (axis.tickPosition === 'Inside' ? 1 : -1));\n y2 = y1 + (axis.majorTickLines.height * (Math.sin(angle * Math.PI / 180)) * (axis.tickPosition === 'Inside' ? 1 : -1));\n majorTick = 'M ' + x1 + ' ' + y1 + ' L ' + x2 + ' ' + y2;\n this.renderTickLine(axis, index, majorTick, '', i);\n }\n }\n };\n PolarRadarPanel.prototype.drawXAxisGridLine = function (axis, index) {\n var chart = this.chart;\n var tempInterval;\n var vector;\n var majorGrid = '';\n var majorTick = '';\n var minorGirdLine = '';\n var minorTickLine = '';\n var x1 = this.centerX;\n var x2;\n var y1 = this.centerY;\n var y2;\n var minorDirection;\n var tickSize = axis.majorTickLines.height;\n var rect = axis.rect;\n var length = axis.visibleLabels.length;\n //Gridlines\n for (var i = 0; i < length; i++) {\n tempInterval = axis.visibleLabels[i].value;\n vector = CoefficientToVector(valueToPolarCoefficient(axis.visibleLabels[i].value, axis), this.startAngle);\n x2 = this.centerX + chart.radius * vector.x;\n y2 = this.centerY + chart.radius * vector.y;\n var xLoc = x2 + (axis.majorTickLines.height * vector.x * (axis.tickPosition === 'Inside' ? -1 : 1));\n var yLoc = y2 + (axis.majorTickLines.height * vector.y * (axis.tickPosition === 'Inside' ? -1 : 1));\n majorGrid = 'M ' + x1 + ' ' + y1 + ' ' + 'L ' + x2 + ' ' + y2;\n majorTick = 'M ' + x2 + ' ' + y2 + ' L ' + xLoc + ' ' + yLoc;\n if (axis.minorTicksPerInterval > 0 && (axis.minorGridLines.width > 0 || axis.minorTickLines.width > 0)\n && axis.valueType !== 'Category' && chart.visibleSeries[0].type !== 'Radar') {\n minorDirection = this.drawAxisMinorLine(axis, tempInterval, minorGirdLine, minorTickLine);\n minorGirdLine = minorDirection[0];\n minorTickLine = minorDirection[1];\n }\n this.renderTickLine(axis, index, majorTick, minorTickLine, i);\n this.renderGridLine(axis, index, majorGrid, minorGirdLine, i);\n }\n };\n PolarRadarPanel.prototype.drawAxisMinorLine = function (axis, tempInterval, minorGird, minorTick) {\n var value = tempInterval;\n var x;\n var y;\n var vector;\n var range = axis.visibleRange;\n var direction = [];\n for (var j = 0; j < axis.minorTicksPerInterval; j++) {\n value += (axis.valueType === 'DateTime' ? axis.dateTimeInterval : axis.visibleRange.interval) /\n (axis.minorTicksPerInterval + 1);\n if (inside(value, range)) {\n vector = CoefficientToVector(valueToPolarCoefficient(value, axis), this.startAngle);\n x = this.centerX + this.chart.radius * vector.x;\n y = this.centerY + this.chart.radius * vector.y;\n var tickXSize = x + (axis.minorTickLines.height * vector.x * (axis.tickPosition === 'Inside' ? -1 : 1));\n var tickYSize = y + (axis.minorTickLines.height * vector.y * (axis.tickPosition === 'Inside' ? -1 : 1));\n minorGird = minorGird.concat('M' + ' ' + this.centerX + ' ' + this.centerY\n + 'L ' + x + ' ' + y);\n minorTick = minorTick.concat('M' + ' ' + x + ' ' + y + 'L' + ' ' + (tickXSize) + ' ' +\n (tickYSize));\n }\n }\n direction.push(minorGird);\n direction.push(minorTick);\n return direction;\n };\n /**\n * To render the axis label.\n * @return {void}\n * @private\n */\n PolarRadarPanel.prototype.drawXAxisLabels = function (axis, index) {\n var chart = this.chart;\n var pointX = 0;\n var pointY = 0;\n var labelElement = chart.renderer.createGroup({ id: chart.element.id + 'AxisLabels' + index });\n var options;\n var vector;\n var labelText;\n var firstLabelX;\n var islabelInside = axis.labelPosition === 'Inside';\n var padding = 5;\n var lastLabelX;\n var textAnchor = '';\n var ticksbwtLabel = axis.valueType === 'Category' && axis.labelPlacement === 'BetweenTicks'\n && chart.visibleSeries[0].type !== 'Radar' ? 0.5 : 0;\n var radius = chart.radius + axis.majorTickLines.height;\n radius = (islabelInside) ? -radius : radius;\n for (var i = 0, len = axis.visibleLabels.length; i < len; i++) {\n vector = CoefficientToVector(valueToPolarCoefficient(axis.visibleLabels[i].value + ticksbwtLabel, axis), this.startAngle);\n if (!isNaN(vector.x) && !isNaN(vector.y)) {\n pointX = this.centerX + (radius + axis.majorTickLines.height + padding) * vector.x;\n pointY = this.centerY + (radius + axis.majorTickLines.height + padding) * vector.y;\n textAnchor = parseFloat(pointX.toFixed(1)) === parseFloat(this.centerX.toFixed(1)) ? 'middle' :\n ((pointX < this.centerX && !islabelInside) || (pointX > this.centerX && islabelInside)) ? 'end' : 'start';\n }\n labelText = axis.visibleLabels[i].text;\n if (i === 0) {\n firstLabelX = pointX;\n }\n else if (i === axis.visibleLabels.length - 1 && axis.valueType !== 'Category') {\n lastLabelX = measureText(labelText, axis.labelStyle).height;\n lastLabelX += pointX;\n labelText = (lastLabelX > firstLabelX) ? '' : labelText;\n }\n options = new TextOption(chart.element.id + index + '_AxisLabel_' + i, pointX, pointY, textAnchor, labelText, '', 'central');\n textElement(options, axis.labelStyle, axis.labelStyle.color || chart.themeStyle.axisLabel, labelElement, false, chart.redraw, true, true);\n }\n this.element.appendChild(labelElement);\n };\n PolarRadarPanel.prototype.renderTickLine = function (axis, index, majorTickLine, minorTickLine, gridIndex) {\n var tickOptions;\n var chart = this.chart;\n var direction;\n var element;\n if (axis.majorTickLines.width > 0) {\n element = getElement(chart.element.id + '_MajorTickLine_' + index + '_' + gridIndex);\n direction = element ? element.getAttribute('d') : null;\n tickOptions = new PathOption(chart.element.id + '_MajorTickLine_' + index + '_' + gridIndex, 'transparent', axis.majorTickLines.width, axis.majorTickLines.color || chart.themeStyle.majorTickLine, null, null, majorTickLine);\n appendChildElement(chart.yAxisElements, chart.renderer.drawPath(tickOptions), chart.redraw, true, 'x', 'y', null, direction);\n }\n if (axis.minorTickLines.width > 0) {\n element = getElement(chart.element.id + '_MinorTickLine_' + index + '_' + gridIndex);\n direction = element ? element.getAttribute('d') : null;\n tickOptions = new PathOption(chart.element.id + '_MinorTickLine_' + index + '_' + gridIndex, 'transparent', axis.minorTickLines.width, axis.minorTickLines.color || chart.themeStyle.minorTickLine, null, null, minorTickLine);\n appendChildElement(chart.yAxisElements, chart.renderer.drawPath(tickOptions), chart.redraw, true, 'x', 'y', null, direction);\n }\n };\n PolarRadarPanel.prototype.renderGridLine = function (axis, index, majorGrid, minorGird, gridIndex) {\n var chart = this.chart;\n var gridOptions;\n var direction;\n var element;\n if (axis.majorGridLines.width > 0) {\n element = getElement(chart.element.id + '_MajorGridLine_' + index + '_' + gridIndex);\n direction = element ? element.getAttribute('d') : null;\n gridOptions = new PathOption(chart.element.id + '_MajorGridLine_' + index + '_' + gridIndex, 'transparent', axis.majorGridLines.width, axis.majorGridLines.color || chart.themeStyle.majorGridLine, null, axis.majorGridLines.dashArray, majorGrid);\n appendChildElement(this.element, chart.renderer.drawPath(gridOptions), chart.redraw, true, 'x', 'y', null, direction);\n }\n if (axis.minorGridLines.width > 0) {\n element = getElement(chart.element.id + '_MinorGridLine_' + index + '_' + gridIndex);\n direction = element ? element.getAttribute('d') : null;\n gridOptions = new PathOption(chart.element.id + '_MinorGridLine_' + index + '_' + gridIndex, 'transparent', axis.minorGridLines.width, axis.minorGridLines.color || chart.themeStyle.minorGridLine, null, axis.minorGridLines.dashArray, minorGird);\n appendChildElement(this.element, chart.renderer.drawPath(gridOptions), chart.redraw, true, 'x', 'y', null, direction);\n }\n };\n return PolarRadarPanel;\n}(LineBase));\nexport { PolarRadarPanel };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { withInRange, logBase, markerAnimate, PolarArc, valueToCoefficient, firstToLowerCase } from '../../common/utils/helper';\nimport { PathOption } from '@syncfusion/ej2-svg-base';\nimport { PolarRadarPanel } from '../axis/polar-radar-panel';\nimport { pointRender } from '../../common/model/constants';\nimport { Animation } from '@syncfusion/ej2-base';\n/**\n * `PolarSeries` module is used to render the polar series.\n */\nvar PolarSeries = /** @class */ (function (_super) {\n __extends(PolarSeries, _super);\n function PolarSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render Polar Series.\n * @return {void}.\n * @private\n */\n PolarSeries.prototype.render = function (series, xAxis, yAxis, inverted) {\n var seriesType = firstToLowerCase(series.drawType);\n if (series.drawType.indexOf('Column') > -1) {\n this.columnDrawTypeRender(series, xAxis, yAxis);\n }\n else {\n series.chart[seriesType + 'SeriesModule'].render(series, xAxis, yAxis, inverted);\n }\n };\n /**\n * Render Column DrawType.\n * @return {void}.\n * @private\n */\n PolarSeries.prototype.columnDrawTypeRender = function (series, xAxis, yAxis) {\n var options;\n var argsData;\n var startAngle;\n var endAngle;\n var itemCurrentXPos;\n var radius;\n var inversedValue;\n var pointStartAngle;\n var pointEndAngle;\n var x1;\n var x2;\n var y1;\n var y2;\n var startValue;\n var endValue;\n var innerRadius;\n var min = xAxis.actualRange.min;\n var centerX = (series.clipRect.width / 2) + series.clipRect.x;\n var dStartX;\n var dStartY;\n var centerY = (series.clipRect.height / 2) + series.clipRect.y;\n var dEndX;\n var dEndY;\n var isRangeColumn = series.drawType === 'RangeColumn';\n var isPolar = series.type === 'Polar';\n var isLogAxis = yAxis.valueType === 'Logarithmic';\n var isStacking = series.drawType === 'StackingColumn';\n var direction = '';\n var sumofYValues = 0;\n var interval = (series.points[1] ? series.points[1].xValue : 2 * series.points[0].xValue) - series.points[0].xValue;\n var ticks = xAxis.valueType === 'Category' && xAxis.labelPlacement === 'BetweenTicks' ? 0 : interval / 2;\n var rangeInterval = xAxis.valueType === 'DateTime' ? xAxis.dateTimeInterval : 1;\n this.getSeriesPosition(series);\n var position = xAxis.isInversed ? (series.rectCount - 1 - series.position) : series.position;\n do {\n sumofYValues += rangeInterval;\n min += rangeInterval;\n } while (min <= xAxis.actualRange.max - (xAxis.valueType === 'Category' ? 0 : 1));\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n point.symbolLocations = [];\n point.regions = [];\n if (point.visible && withInRange(series.points[point.index - 1], point, series.points[point.index + 1], series)) {\n inversedValue = xAxis.isInversed ? (xAxis.visibleRange.max - point.xValue) :\n point.xValue - xAxis.visibleRange.min;\n itemCurrentXPos = (inversedValue) +\n ((interval / series.rectCount) * position - ticks) + (sumofYValues / 360 * xAxis.startAngle);\n itemCurrentXPos = (((itemCurrentXPos) / (sumofYValues)));\n startAngle = 2 * Math.PI * (itemCurrentXPos + xAxis.startAngle);\n endAngle = 2 * Math.PI * ((itemCurrentXPos + xAxis.startAngle) + (interval / series.rectCount) / (sumofYValues));\n pointStartAngle = startAngle;\n pointEndAngle = endAngle;\n startAngle = (startAngle - 0.5 * Math.PI);\n endAngle = (endAngle - 0.5 * Math.PI) - 0.000001;\n if (isStacking || isRangeColumn) {\n startValue = isRangeColumn ? point.low : series.stackedValues.startValues[point.index];\n endValue = isRangeColumn ? point.high : series.stackedValues.endValues[point.index];\n endValue = (isLogAxis ? logBase(endValue === 0 ? 1 : endValue, yAxis.logBase) : endValue);\n endValue = endValue > yAxis.actualRange.max ? yAxis.actualRange.max : endValue;\n radius = startValue === endValue ? 0 : series.chart.radius * valueToCoefficient(endValue, yAxis);\n x1 = centerX + radius * Math.cos(startAngle);\n x2 = centerX + radius * Math.cos(endAngle);\n y1 = centerY + radius * Math.sin(startAngle);\n y2 = centerY + radius * Math.sin(endAngle);\n innerRadius = series.chart.radius * valueToCoefficient((startValue === 0 && yAxis.visibleRange.min !== 0) ? yAxis.visibleRange.min : startValue, yAxis);\n dStartX = centerX + innerRadius * Math.cos(startAngle);\n dStartY = centerY + innerRadius * Math.sin(startAngle);\n dEndX = centerX + innerRadius * Math.cos(endAngle);\n dEndY = centerY + innerRadius * Math.sin(endAngle);\n if (isPolar) {\n direction = ('M' + ' ' + x1 + ' ' + y1 + ' ' + 'A' + ' ' + radius + ' ' + radius + ' ' + '0' + ' '\n + '0' + ' ' + 1 + ' ' + x2 + ' ' + y2 + ' ' + 'L' + ' ' + dEndX + ' ' + dEndY + ' ' +\n 'A' + ' ' + innerRadius + ' ' + innerRadius + ' ' + '1' + ' ' + '0' + ' ' + '0' + ' '\n + dStartX + ' ' + dStartY + ' ' + 'Z');\n }\n else {\n direction = ('M' + ' ' + x1 + ' ' + y1 + ' ' + 'L' + ' ' + x2 + ' ' + y2 + ' ' + 'L '\n + dEndX + ' ' + dEndY + ' ' + 'L' + ' ' + dStartX + ' ' + dStartY + ' ' + 'Z');\n }\n point.regionData = new PolarArc(pointStartAngle, pointEndAngle, innerRadius, radius, itemCurrentXPos);\n }\n else {\n endValue = point.yValue > yAxis.actualRange.max ? yAxis.actualRange.max : point.yValue;\n radius = series.chart.radius *\n valueToCoefficient((isLogAxis ? logBase(endValue, yAxis.logBase) : endValue), yAxis);\n x1 = centerX + radius * Math.cos(startAngle);\n x2 = centerX + radius * Math.cos(endAngle);\n y1 = centerY + radius * Math.sin(startAngle);\n y2 = centerY + radius * Math.sin(endAngle);\n if (isPolar) {\n direction = ('M' + ' ' + x1 + ' ' + y1 + ' ' + 'A' + ' ' + radius + ' ' + radius + ' ' + '0' + ' ' +\n '0' + ' ' + 1 + ' ' + x2 + ' ' + y2 + ' ' + 'L' + ' ' + centerX + ' ' +\n centerY + ' ' + 'Z');\n }\n else {\n direction = ('M' + ' ' + x1 + ' ' + y1 + ' ' + 'L' + ' ' + x2 + ' ' + y2 + ' ' + 'L' + ' '\n + centerX + ' ' + centerY + ' ' + 'Z');\n }\n point.regionData = new PolarArc(pointStartAngle, pointEndAngle, 0, radius, itemCurrentXPos);\n }\n argsData = this.triggerEvent(series.chart, series, point);\n options = new PathOption(series.chart.element.id + '_Series_' + series.index + '_Point_' + point.index, argsData.fill, argsData.border.width, argsData.border.color, series.opacity, series.dashArray, direction);\n if (!argsData.cancel) {\n this.appendLinePath(options, series, '');\n if (isPolar) {\n point.symbolLocations.push({\n x: centerX + radius * Math.cos((startAngle + (endAngle - startAngle) / 2)),\n y: centerY + radius * Math.sin((startAngle + (endAngle - startAngle) / 2))\n });\n if (isRangeColumn) {\n point.symbolLocations.push({\n x: centerX + innerRadius * Math.cos((startAngle + (endAngle - startAngle) / 2)),\n y: centerY + innerRadius * Math.sin((startAngle + (endAngle - startAngle) / 2))\n });\n }\n }\n else {\n point.symbolLocations.push({ x: (x1 + x2) / 2, y: (y1 + y2) / 2 });\n if (isRangeColumn) {\n point.symbolLocations.push({ x: (dEndX + dStartX) / 2, y: (dEndY + dStartY) / 2 });\n }\n }\n }\n }\n }\n this.renderMarker(series);\n series.isRectSeries = true;\n };\n /**\n * To trigger the point rendering event.\n * @return {void}\n * @private\n */\n PolarSeries.prototype.triggerEvent = function (chart, series, point) {\n var argsData = {\n cancel: false, name: pointRender, series: series, point: point,\n fill: series.setPointColor(point, series.interior),\n border: series.setBorderColor(point, { width: series.border.width, color: series.border.color })\n };\n chart.trigger(pointRender, argsData);\n point.color = argsData.fill;\n return argsData;\n };\n /** get position for column drawtypes\n * @return {void}.\n * @private\n */\n PolarSeries.prototype.getSeriesPosition = function (series) {\n var chart = series.chart;\n var seriesCollection = [];\n var stackingGroup = [];\n var vSeries = { rectCount: 0, position: null };\n for (var _i = 0, _a = chart.visibleSeries; _i < _a.length; _i++) {\n var series_1 = _a[_i];\n if (series_1.visible && (series_1.type === 'Polar' || series_1.type === 'Radar') && series_1.drawType.indexOf('Column') !== -1) {\n seriesCollection.push(series_1);\n }\n }\n seriesCollection.forEach(function (series) {\n if (series.drawType.indexOf('Stacking') !== -1) {\n if (series.stackingGroup) {\n if (stackingGroup[series.stackingGroup] === undefined) {\n series.position = vSeries.rectCount;\n stackingGroup[series.stackingGroup] = vSeries.rectCount++;\n }\n else {\n series.position = stackingGroup[series.stackingGroup];\n }\n }\n else {\n if (vSeries.position === null) {\n series.position = vSeries.rectCount;\n vSeries.position = vSeries.rectCount++;\n }\n else {\n series.position = vSeries.position;\n }\n }\n }\n else {\n series.position = vSeries.rectCount++;\n }\n });\n seriesCollection.forEach(function (value) {\n value.rectCount = vSeries.rectCount;\n });\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n PolarSeries.prototype.doAnimation = function (series) {\n var option = series.animation;\n var duration = series.animation.duration;\n var delay = series.animation.delay;\n var rectElements = series.seriesElement.childNodes;\n var count = 1;\n if (series.drawType === 'Scatter') {\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n if (!point.symbolLocations.length || !rectElements[count]) {\n continue;\n }\n markerAnimate(rectElements[count], delay, duration, series, point.index, point.symbolLocations[0], false);\n count++;\n }\n }\n else {\n for (count = 1; count < rectElements.length; count++) {\n this.doPolarRadarAnimation(rectElements[count], delay, duration, series);\n }\n }\n };\n /**\n * To do the Polar Radar draw type column animation.\n * @return {void}\n * @private\n */\n PolarSeries.prototype.doPolarRadarAnimation = function (animateElement, delay, duration, series) {\n var chartcenterX = series.clipRect.width / 2 + series.clipRect.x;\n var chartcenterY = series.clipRect.height / 2 + series.clipRect.y;\n var elementHeight = 0;\n animateElement.style.visibility = 'hidden';\n new Animation({}).animate(animateElement, {\n duration: duration,\n delay: delay,\n progress: function (args) {\n if (args.timeStamp > args.delay) {\n args.element.style.visibility = 'visible';\n elementHeight = ((args.timeStamp - args.delay) / args.duration);\n animateElement.setAttribute('transform', 'translate(' + chartcenterX\n + ' ' + chartcenterY + ') scale(' + elementHeight + ') translate(' + (-chartcenterX) + ' ' + (-chartcenterY) + ')');\n }\n },\n end: function (model) {\n animateElement.style.visibility = 'visible';\n animateElement.removeAttribute('transform');\n series.chart.trigger('animationComplete', { series: series });\n }\n });\n };\n /**\n * Get module name.\n */\n PolarSeries.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'PolarSeries';\n };\n /**\n * To destroy the polar series.\n * @return {void}\n * @private\n */\n PolarSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n return PolarSeries;\n}(PolarRadarPanel));\nexport { PolarSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { firstToLowerCase } from '../../common/utils/helper';\nimport { PolarSeries } from '../series/polar-series';\n/**\n * `RadarSeries` module is used to render the radar series.\n */\nvar RadarSeries = /** @class */ (function (_super) {\n __extends(RadarSeries, _super);\n function RadarSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render radar Series.\n * @return {void}.\n * @private\n */\n RadarSeries.prototype.render = function (series, xAxis, yAxis, inverted) {\n var seriesType = firstToLowerCase(series.drawType);\n if (series.drawType.indexOf('Column') === -1) {\n series.chart[seriesType + 'SeriesModule'].render(series, xAxis, yAxis, inverted);\n }\n else {\n this.columnDrawTypeRender(series, xAxis, yAxis);\n }\n };\n /**\n * Get module name.\n */\n RadarSeries.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'RadarSeries';\n };\n /**\n * To destroy the radar series.\n * @return {void}\n * @private\n */\n RadarSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n return RadarSeries;\n}(PolarSeries));\nexport { RadarSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { withInRange } from '../../common/utils/helper';\nimport { ColumnBase } from './column-base';\n/**\n * `StackingBarSeries` module is used to render the stacking bar series.\n */\nvar StackingBarSeries = /** @class */ (function (_super) {\n __extends(StackingBarSeries, _super);\n function StackingBarSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render the Stacking bar series.\n * @return {void}\n * @private\n */\n StackingBarSeries.prototype.render = function (series) {\n var sideBySideInfo = this.getSideBySideInfo(series);\n var stackedValue = series.stackedValues;\n var rect;\n var argsData;\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var pointStack = _a[_i];\n pointStack.symbolLocations = [];\n pointStack.regions = [];\n if (pointStack.visible && withInRange(series.points[pointStack.index - 1], pointStack, series.points[pointStack.index + 1], series)) {\n rect = this.getRectangle(pointStack.xValue + sideBySideInfo.start, stackedValue.endValues[pointStack.index], pointStack.xValue + sideBySideInfo.end, stackedValue.startValues[pointStack.index], series);\n argsData = this.triggerEvent(series, pointStack, series.interior, { width: series.border.width, color: series.border.color });\n if (!argsData.cancel) {\n this.drawRectangle(series, pointStack, rect, argsData);\n this.updateSymbolLocation(pointStack, rect, series);\n }\n }\n }\n this.renderMarker(series);\n };\n /**\n * To destroy the stacking bar.\n * @return {void}\n * @private\n */\n StackingBarSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n /**\n * Get module name.\n */\n StackingBarSeries.prototype.getModuleName = function () {\n return 'StackingBarSeries';\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n StackingBarSeries.prototype.doAnimation = function (series) {\n this.animate(series);\n };\n return StackingBarSeries;\n}(ColumnBase));\nexport { StackingBarSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { withInRange, pathAnimation, getElement } from '../../common/utils/helper';\nimport { PathOption } from '@syncfusion/ej2-svg-base';\nimport { ColumnBase } from './column-base';\n/**\n * `CandleSeries` module is used to render the candle series.\n */\nvar CandleSeries = /** @class */ (function (_super) {\n __extends(CandleSeries, _super);\n function CandleSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render Candle series.\n * @return {void}\n * @private\n */\n CandleSeries.prototype.render = function (series) {\n var sideBySideInfo = this.getSideBySideInfo(series);\n var argsData;\n var borderWidth = Math.max(series.border.width, 1);\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n var direction = '';\n var centerRegion = void 0;\n var tickRegion = void 0;\n var midPoint = void 0;\n midPoint = (sideBySideInfo.start + sideBySideInfo.end) / 2;\n //initializing after zooming and also normal initialization\n point.regions = [];\n point.symbolLocations = [];\n if (point.visible && withInRange(series.points[point.index - 1], point, series.points[point.index + 1], series)) {\n //region to cover the top and bottom ticks\n tickRegion = this.getRectangle((point.xValue + sideBySideInfo.median), Math.max(point.high, point.low), (point.xValue + sideBySideInfo.median), Math.min(point.high, point.low), series);\n if (!series.chart.requireInvertedAxis) {\n tickRegion.x -= borderWidth / 2;\n tickRegion.width = borderWidth;\n }\n else {\n tickRegion.y -= borderWidth / 2;\n tickRegion.height = borderWidth;\n }\n //get middleRect\n centerRegion = this.getRectangle((point.xValue + sideBySideInfo.start), Math.max(point.open, point.close), (point.xValue + sideBySideInfo.end), Math.min(point.open, point.close), series);\n direction = this.getPathString(tickRegion, centerRegion, series);\n argsData = this.triggerPointRenderEvent(series, point);\n if (!argsData.cancel) {\n this.drawCandle(series, point, centerRegion, argsData, direction);\n this.updateSymbolLocation(point, tickRegion, series);\n this.updateSymbolLocation(point, centerRegion, series);\n }\n }\n }\n };\n /**\n * Trigger point rendering event\n */\n CandleSeries.prototype.triggerPointRenderEvent = function (series, point) {\n var fill;\n fill = this.getCandleColor(point, series);\n var border = { color: series.border.color, width: Math.max(series.border.width, 1) };\n return this.triggerEvent(series, point, fill, border);\n };\n /**\n * Find the color of the candle\n * @param series\n * @private\n */\n CandleSeries.prototype.getCandleColor = function (point, series) {\n var currentPoint = point;\n var previousPoint = series.points[point.index - 1];\n if (series.enableSolidCandles === false) {\n if (!previousPoint) {\n return series.bearFillColor;\n }\n else {\n return previousPoint.close > point.close ? series.bullFillColor :\n series.bearFillColor;\n }\n }\n else {\n return point.open > point.close ? series.bullFillColor :\n series.bearFillColor;\n }\n };\n /**\n * Finds the path of the candle shape\n * @param Series\n * @private\n */\n CandleSeries.prototype.getPathString = function (topRect, midRect, series) {\n var direction = '';\n var width = series.chart.requireInvertedAxis ? topRect.height : topRect.width;\n var center = series.chart.requireInvertedAxis ? topRect.y + topRect.height / 2 :\n topRect.x + topRect.width / 2;\n //tick 1 segment\n direction += !series.chart.requireInvertedAxis ?\n 'M' + ' ' + (center) + ' ' + (topRect.y) + ' ' + 'L' + ' ' + (center) + ' ' + midRect.y :\n 'M' + ' ' + (topRect.x) + ' ' + (center) + ' ' + 'L' + ' ' + (midRect.x) + ' ' + center;\n direction = direction.concat(' M' + ' ' + (midRect.x) + ' ' + (midRect.y) + ' ' +\n 'L' + ' ' + (midRect.x + midRect.width) + ' ' + (midRect.y) + ' ' +\n 'L' + ' ' + (midRect.x + midRect.width) + ' ' +\n (midRect.y + midRect.height) + ' ' +\n 'L' + ' ' + (midRect.x) + ' ' + (midRect.y + midRect.height) +\n ' ' + 'Z');\n direction += !series.chart.requireInvertedAxis ?\n ' M' + ' ' + (center) + ' ' + (midRect.y + midRect.height) + ' ' + 'L' + ' ' + (center) + ' ' + (topRect.y +\n topRect.height) :\n ' M' + ' ' + (midRect.x + midRect.width) + ' ' + (center) + ' ' + 'L' + ' ' +\n (topRect.x + topRect.width) + ' ' + center;\n return direction;\n };\n /**\n * Draws the candle shape\n * @param series\n * @private\n */\n CandleSeries.prototype.drawCandle = function (series, point, rect, argsData, direction) {\n var check = series.chart.requireInvertedAxis ? rect.height : rect.width;\n if (check <= 0) {\n return null;\n }\n var fill = !series.enableSolidCandles ?\n (point.open > point.close ? argsData.fill : 'transparent') : argsData.fill;\n argsData.border.color = argsData.fill;\n var options = new PathOption(series.chart.element.id + '_Series_' + series.index + '_Point_' + point.index, fill, argsData.border.width, argsData.border.color, series.opacity, series.dashArray, direction);\n var element = getElement(options.id);\n var previousDirection = element ? element.getAttribute('d') : null;\n var candleElement = series.chart.renderer.drawPath(options);\n candleElement.setAttribute('aria-label', point.x.toString() + ':' + point.high.toString()\n + ':' + point.low.toString() + ':' + point.close.toString() + ':' + point.open.toString());\n series.seriesElement.appendChild(candleElement);\n pathAnimation(element, direction, series.chart.redraw, previousDirection);\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n CandleSeries.prototype.doAnimation = function (series) {\n this.animate(series);\n };\n /**\n * Get module name.\n */\n CandleSeries.prototype.getModuleName = function () {\n return 'CandleSeries';\n /**\n * return the module name\n */\n };\n /**\n * To destroy the candle series.\n * @return {void}\n * @private\n */\n CandleSeries.prototype.destroy = function (chart) {\n /**\n * Destroys the candle series.\n */\n };\n return CandleSeries;\n}(ColumnBase));\nexport { CandleSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { withInRange } from '../../common/utils/helper';\nimport { ColumnBase } from './column-base';\n/**\n * `StackingColumnSeries` module used to render the stacking column series.\n */\nvar StackingColumnSeries = /** @class */ (function (_super) {\n __extends(StackingColumnSeries, _super);\n function StackingColumnSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render the Stacking column series.\n * @return {void}\n * @private\n */\n StackingColumnSeries.prototype.render = function (series) {\n series.isRectSeries = true;\n var sideBySideInfo = this.getSideBySideInfo(series);\n var rect;\n var argsData;\n var stackedValue = series.stackedValues;\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n point.symbolLocations = [];\n point.regions = [];\n if (point.visible && withInRange(series.points[point.index - 1], point, series.points[point.index + 1], series)) {\n rect = this.getRectangle(point.xValue + sideBySideInfo.start, stackedValue.endValues[point.index], point.xValue + sideBySideInfo.end, stackedValue.startValues[point.index], series);\n argsData = this.triggerEvent(series, point, series.interior, { width: series.border.width, color: series.border.color });\n if (!argsData.cancel) {\n this.drawRectangle(series, point, rect, argsData);\n this.updateSymbolLocation(point, rect, series);\n }\n }\n }\n this.renderMarker(series);\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n StackingColumnSeries.prototype.doAnimation = function (series) {\n this.animate(series);\n };\n /**\n * To destroy the stacking column.\n * @return {void}\n * @private\n */\n StackingColumnSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n /**\n * Get module name.\n */\n StackingColumnSeries.prototype.getModuleName = function () {\n return 'StackingColumnSeries';\n };\n return StackingColumnSeries;\n}(ColumnBase));\nexport { StackingColumnSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { getPoint, withInRange } from '../../common/utils/helper';\nimport { PathOption } from '@syncfusion/ej2-svg-base';\nimport { LineBase } from './line-base';\n/**\n * `StepLineSeries` module is used to render the step line series.\n */\nvar StepLineSeries = /** @class */ (function (_super) {\n __extends(StepLineSeries, _super);\n function StepLineSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render the Step line series.\n * @return {void}\n * @private\n */\n StepLineSeries.prototype.render = function (series, xAxis, yAxis, isInverted) {\n var direction = '';\n var startPoint = 'M';\n var prevPoint = null;\n var pathOptions;\n var lineLength;\n var point1;\n var point2;\n var visiblePoints = this.enableComplexProperty(series);\n if (xAxis.valueType === 'Category' && xAxis.labelPlacement === 'BetweenTicks') {\n lineLength = 0.5;\n }\n else {\n lineLength = 0;\n }\n for (var _i = 0, visiblePoints_1 = visiblePoints; _i < visiblePoints_1.length; _i++) {\n var point = visiblePoints_1[_i];\n point.symbolLocations = [];\n point.regions = [];\n if (point.visible && withInRange(visiblePoints[point.index - 1], point, visiblePoints[point.index + 1], series)) {\n if (prevPoint != null) {\n point2 = getPoint(point.xValue, point.yValue, xAxis, yAxis, isInverted);\n point1 = getPoint(prevPoint.xValue, prevPoint.yValue, xAxis, yAxis, isInverted);\n direction = direction.concat(startPoint + ' ' + (point1.x) + ' ' + (point1.y) + ' ' + 'L' + ' ' +\n (point2.x) + ' ' + (point1.y) + 'L' + ' ' + (point2.x) + ' ' + (point2.y) + ' ');\n startPoint = 'L';\n }\n else {\n point1 = getPoint(point.xValue - lineLength, point.yValue, xAxis, yAxis, isInverted);\n direction = direction.concat(startPoint + ' ' + (point1.x) + ' ' + (point1.y) + ' ');\n startPoint = 'L';\n }\n this.storePointLocation(point, series, isInverted, getPoint);\n prevPoint = point;\n }\n else {\n prevPoint = series.emptyPointSettings.mode === 'Drop' ? prevPoint : null;\n startPoint = series.emptyPointSettings.mode === 'Drop' ? startPoint : 'M';\n }\n }\n point1 = getPoint(visiblePoints[visiblePoints.length - 1].xValue + lineLength, visiblePoints[visiblePoints.length - 1].yValue, xAxis, yAxis, isInverted);\n direction = direction.concat(startPoint + ' ' + (point1.x) + ' ' + (point1.y) + ' ');\n pathOptions = new PathOption(series.chart.element.id + '_Series_' + series.index, 'transparent', series.width, series.interior, series.opacity, series.dashArray, direction);\n this.appendLinePath(pathOptions, series, '');\n this.renderMarker(series);\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n StepLineSeries.prototype.doAnimation = function (series) {\n var option = series.animation;\n this.doLinearAnimation(series, option);\n };\n /**\n * To destroy the step line series.\n * @return {void}\n * @private\n */\n StepLineSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method calling here\n */\n };\n /**\n * Get module name.\n */\n StepLineSeries.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'StepLineSeries';\n };\n return StepLineSeries;\n}(LineBase));\nexport { StepLineSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { getPoint, withInRange, ChartLocation } from '../../common/utils/helper';\nimport { PathOption } from '@syncfusion/ej2-svg-base';\nimport { LineBase } from './line-base';\n/**\n * `StepAreaSeries` Module used to render the step area series.\n */\nvar StepAreaSeries = /** @class */ (function (_super) {\n __extends(StepAreaSeries, _super);\n function StepAreaSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render StepArea series.\n * @return {void}\n * @private\n */\n StepAreaSeries.prototype.render = function (series, xAxis, yAxis, isInverted) {\n var currentPoint;\n var secondPoint;\n var start = null;\n var direction = '';\n var pointsLength = series.points.length;\n var origin = Math.max(series.yAxis.visibleRange.min, 0);\n var options;\n var point;\n var xValue;\n var lineLength;\n var prevPoint = null;\n if (xAxis.valueType === 'Category' && xAxis.labelPlacement === 'BetweenTicks') {\n lineLength = 0.5;\n }\n else {\n lineLength = 0;\n }\n for (var i = 0; i < pointsLength; i++) {\n point = series.points[i];\n xValue = point.xValue;\n point.symbolLocations = [];\n point.regions = [];\n if (point.visible && withInRange(series.points[i - 1], point, series.points[i + 1], series)) {\n if (start === null) {\n start = new ChartLocation(xValue, 0);\n // Start point for the current path\n currentPoint = getPoint(xValue - lineLength, origin, xAxis, yAxis, isInverted);\n direction += ('M' + ' ' + (currentPoint.x) + ' ' + (currentPoint.y) + ' ');\n currentPoint = getPoint(xValue - lineLength, point.yValue, xAxis, yAxis, isInverted);\n direction += ('L' + ' ' + (currentPoint.x) + ' ' + (currentPoint.y) + ' ');\n }\n // First Point to draw the Steparea path\n if (prevPoint != null) {\n currentPoint = getPoint(point.xValue, point.yValue, xAxis, yAxis, isInverted);\n secondPoint = getPoint(prevPoint.xValue, prevPoint.yValue, xAxis, yAxis, isInverted);\n direction += ('L' + ' ' +\n (currentPoint.x) + ' ' + (secondPoint.y) + 'L' + ' ' + (currentPoint.x) + ' ' + (currentPoint.y) + ' ');\n }\n else if (series.emptyPointSettings.mode === 'Gap') {\n currentPoint = getPoint(point.xValue, point.yValue, xAxis, yAxis, isInverted);\n direction += 'L' + ' ' + (currentPoint.x) + ' ' + (currentPoint.y) + ' ';\n }\n this.storePointLocation(point, series, isInverted, getPoint);\n prevPoint = point;\n }\n if (series.points[i + 1] && !series.points[i + 1].visible && series.emptyPointSettings.mode !== 'Drop') {\n // current start point\n currentPoint = getPoint(xValue + lineLength, origin, xAxis, yAxis, isInverted);\n direction += ('L' + ' ' + (currentPoint.x) + ' ' + (currentPoint.y));\n start = null;\n prevPoint = null;\n }\n }\n if (pointsLength > 1) {\n start = { 'x': series.points[pointsLength - 1].xValue + lineLength, 'y': series.points[pointsLength - 1].yValue };\n secondPoint = getPoint(start.x, start.y, xAxis, yAxis, isInverted);\n direction += ('L' + ' ' + (secondPoint.x) + ' ' + (secondPoint.y) + ' ');\n start = { 'x': series.points[pointsLength - 1].xValue + lineLength, 'y': origin };\n secondPoint = getPoint(start.x, start.y, xAxis, yAxis, isInverted);\n direction += ('L' + ' ' + (secondPoint.x) + ' ' + (secondPoint.y) + ' ');\n }\n options = new PathOption(series.chart.element.id + '_Series_' + series.index, series.interior, series.border.width, series.border.color, series.opacity, series.dashArray, direction);\n this.appendLinePath(options, series, '');\n this.renderMarker(series);\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n StepAreaSeries.prototype.doAnimation = function (series) {\n var option = series.animation;\n this.doLinearAnimation(series, option);\n };\n /**\n * To destroy the step Area series.\n * @return {void}\n * @private\n */\n StepAreaSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method calling here\n */\n };\n /**\n * Get module name.\n */\n StepAreaSeries.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'StepAreaSeries';\n };\n return StepAreaSeries;\n}(LineBase));\nexport { StepAreaSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { getPoint, withInRange, TransformToVisible } from '../../common/utils/helper';\nimport { PathOption, Rect } from '@syncfusion/ej2-svg-base';\nimport { LineBase } from './line-base';\n/**\n * `StackingAreaSeries` module used to render the Stacking Area series.\n */\nvar StackingAreaSeries = /** @class */ (function (_super) {\n __extends(StackingAreaSeries, _super);\n function StackingAreaSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render the Stacking area series.\n * @return {void}\n * @private\n */\n StackingAreaSeries.prototype.render = function (series, xAxis, yAxis, isInverted) {\n var polarAreaType = series.chart.chartAreaType === 'PolarRadar';\n var getCoordinate = polarAreaType ? TransformToVisible : getPoint;\n var lineDirection = '';\n var visiblePoints = series.points;\n var pointsLength = visiblePoints.length;\n var stackedvalue = series.stackedValues;\n var origin = polarAreaType ?\n Math.max(series.yAxis.visibleRange.min, stackedvalue.endValues[0]) :\n Math.max(series.yAxis.visibleRange.min, stackedvalue.startValues[0]);\n var border = series.border;\n var options;\n var startPoint = 0;\n var point1 = getCoordinate(visiblePoints[0].xValue, origin, xAxis, yAxis, isInverted, series);\n var point2;\n lineDirection = lineDirection.concat('M' + ' ' + (point1.x) + ' ' + (point1.y) + ' ');\n for (var i = 0; i < pointsLength; i++) {\n visiblePoints[i].symbolLocations = [];\n visiblePoints[i].regions = [];\n if (visiblePoints[i].visible && withInRange(visiblePoints[i - 1], visiblePoints[i], visiblePoints[i + 1], series)) {\n point1 = getCoordinate(visiblePoints[i].xValue, stackedvalue.endValues[i], xAxis, yAxis, isInverted, series);\n lineDirection = lineDirection.concat('L' + ' ' + (point1.x) + ' ' + (point1.y) + ' ');\n visiblePoints[i].symbolLocations.push(getCoordinate(visiblePoints[i].xValue, stackedvalue.endValues[i], xAxis, yAxis, isInverted, series));\n visiblePoints[i].regions.push(new Rect(visiblePoints[i].symbolLocations[0].x - series.marker.width, visiblePoints[i].symbolLocations[0].y - series.marker.height, 2 * series.marker.width, 2 * series.marker.height));\n }\n else {\n if (series.emptyPointSettings.mode !== 'Drop') {\n for (var j = i - 1; j >= startPoint; j--) {\n point2 = getCoordinate(visiblePoints[j].xValue, stackedvalue.startValues[j], xAxis, yAxis, isInverted, series);\n lineDirection = lineDirection.concat('L' + ' ' + (point2.x) + ' ' + (point2.y) + ' ');\n }\n if (visiblePoints[i + 1] && visiblePoints[i + 1].visible) {\n point1 = getCoordinate(visiblePoints[i + 1].xValue, stackedvalue.startValues[i + 1], xAxis, yAxis, isInverted, series);\n lineDirection = lineDirection.concat('M' + ' ' + (point1.x) + ' ' + (point1.y) + ' ');\n }\n startPoint = i + 1;\n }\n }\n }\n if (series.chart.chartAreaType === 'PolarRadar' && visiblePoints.length > 1) {\n point1 = { 'x': series.points[0].xValue, 'y': stackedvalue.endValues[0] };\n point2 = getCoordinate(point1.x, point1.y, xAxis, yAxis, isInverted, series);\n lineDirection += ('L' + ' ' + (point2.x) + ' ' + (point2.y) + ' ');\n }\n for (var j = pointsLength - 1; j >= startPoint; j--) {\n var previousSeries = this.getPreviousSeries(series);\n if (previousSeries.emptyPointSettings.mode !== 'Drop' || !previousSeries.points[j].isEmpty) {\n point2 = getCoordinate(visiblePoints[j].xValue, stackedvalue.startValues[j], xAxis, yAxis, isInverted, series);\n lineDirection = lineDirection.concat(((j === (pointsLength - 1) && polarAreaType) ? 'M' : 'L')\n + ' ' + (point2.x) + ' ' + (point2.y) + ' ');\n }\n }\n options = new PathOption(series.chart.element.id + '_Series_' + series.index, series.interior, series.border.width, series.border.color, series.opacity, series.dashArray, lineDirection);\n this.appendLinePath(options, series, '');\n this.renderMarker(series);\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n StackingAreaSeries.prototype.doAnimation = function (series) {\n var option = series.animation;\n this.doLinearAnimation(series, option);\n };\n /**\n * To destroy the stacking area.\n * @return {void}\n * @private\n */\n StackingAreaSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method calling here\n */\n };\n /**\n * Get module name.\n */\n StackingAreaSeries.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'StackingAreaSeries';\n };\n /**\n * To find previous visible series\n */\n StackingAreaSeries.prototype.getPreviousSeries = function (series) {\n var seriesCollection = series.chart.visibleSeries;\n for (var i = 0, length_1 = seriesCollection.length; i < length_1; i++) {\n if (series.index === seriesCollection[i].index && i !== 0) {\n return seriesCollection[i - 1];\n }\n }\n return seriesCollection[0];\n };\n return StackingAreaSeries;\n}(LineBase));\nexport { StackingAreaSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { getPoint, withInRange, TransformToVisible } from '../../common/utils/helper';\nimport { PathOption, Rect } from '@syncfusion/ej2-svg-base';\nimport { LineBase } from './line-base';\n/**\n * `StackingLineSeries` module used to render the Stacking Line series.\n */\nvar StackingLineSeries = /** @class */ (function (_super) {\n __extends(StackingLineSeries, _super);\n function StackingLineSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render the Stacking line series.\n * @return {void}\n * @private\n */\n StackingLineSeries.prototype.render = function (series, xAxis, yAxis, isInverted) {\n var polarType = series.chart.chartAreaType === 'PolarRadar';\n var getCoordinate = polarType ? TransformToVisible : getPoint;\n var direction = '';\n var visiblePts = series.points;\n var pointsLength = visiblePts.length;\n var stackedvalue = series.stackedValues;\n var startPoint = 0;\n var origin = polarType ?\n Math.max(series.yAxis.visibleRange.min, stackedvalue.endValues[0]) :\n Math.max(series.yAxis.visibleRange.min, stackedvalue.startValues[0]);\n var options;\n var point1;\n var point2;\n for (var i = 0; i < pointsLength; i++) {\n visiblePts[i].regions = [];\n visiblePts[i].symbolLocations = [];\n if (visiblePts[i].visible && withInRange(visiblePts[i - 1], visiblePts[i], visiblePts[i + 1], series)) {\n point1 = getCoordinate(visiblePts[i].xValue, stackedvalue.endValues[i], xAxis, yAxis, isInverted, series);\n direction = direction.concat((i ? 'L' : 'M') + ' ' + (point1.x) + ' ' + (point1.y) + ' ');\n visiblePts[i].symbolLocations.push(getCoordinate(visiblePts[i].xValue, stackedvalue.endValues[i], xAxis, yAxis, isInverted, series));\n visiblePts[i].regions.push(new Rect(visiblePts[i].symbolLocations[0].x - series.marker.width, visiblePts[i].symbolLocations[0].y - series.marker.height, 2 * series.marker.width, 2 * series.marker.height));\n }\n else {\n if (series.emptyPointSettings.mode !== 'Drop') {\n if (visiblePts[i + 1] && visiblePts[i + 1].visible) {\n point1 = getCoordinate(visiblePts[i + 1].xValue, stackedvalue.endValues[i + 1], xAxis, yAxis, isInverted, series);\n direction = direction.concat('M' + ' ' + (point1.x) + ' ' + (point1.y) + ' ');\n }\n startPoint = i + 1;\n }\n }\n }\n if (series.chart.chartAreaType === 'PolarRadar' && visiblePts.length > 1) {\n point1 = { 'y': stackedvalue.endValues[0], 'x': series.points[0].xValue, };\n point2 = getCoordinate(point1.x, point1.y, xAxis, yAxis, isInverted, series);\n direction += ('L' + ' ' + (point2.x) + ' ' + (point2.y) + ' ');\n }\n options = new PathOption(series.chart.element.id + '_Series_' + series.index, 'none', series.width, series.interior, series.opacity, series.dashArray, direction);\n this.appendLinePath(options, series, '');\n this.renderMarker(series);\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n StackingLineSeries.prototype.doAnimation = function (series) {\n var option = series.animation;\n this.doLinearAnimation(series, option);\n };\n /**\n * To destroy the stacking line.\n * @return {void}\n * @private\n */\n StackingLineSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method calling here\n */\n };\n /**\n * Get module name.\n */\n StackingLineSeries.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'StackingLineSeries';\n };\n return StackingLineSeries;\n}(LineBase));\nexport { StackingLineSeries };\n","import { withInRange, getPoint, drawSymbol, getElement } from '../../common/utils/helper';\nimport { markerAnimate, TransformToVisible, appendChildElement } from '../../common/utils/helper';\nimport { PathOption, Rect, Size } from '@syncfusion/ej2-svg-base';\nimport { pointRender } from '../../common/model/constants';\n/**\n * `ScatterSeries` module is used to render the scatter series.\n */\nvar ScatterSeries = /** @class */ (function () {\n function ScatterSeries() {\n }\n /**\n * Render the scatter series.\n * @return {void}\n * @private\n */\n ScatterSeries.prototype.render = function (series, xAxis, yAxis, isInverted) {\n var marker = series.marker;\n var visiblePoints = series.points;\n var argsData;\n var getCoordinate = series.chart.chartAreaType === 'PolarRadar' ? TransformToVisible : getPoint;\n var startLocation;\n var redraw = series.chart.redraw;\n for (var _i = 0, visiblePoints_1 = visiblePoints; _i < visiblePoints_1.length; _i++) {\n var point = visiblePoints_1[_i];\n startLocation = (redraw && point.symbolLocations) ? point.symbolLocations[0] : null;\n point.symbolLocations = [];\n point.regions = [];\n if (point.visible && withInRange(visiblePoints[point.index - 1], point, visiblePoints[point.index + 1], series)) {\n argsData = {\n cancel: false, name: pointRender, series: series, point: point,\n fill: series.setPointColor(point, series.interior),\n border: series.setBorderColor(point, { width: series.border.width, color: series.border.color }),\n height: marker.height, width: marker.width, shape: marker.shape\n };\n series.chart.trigger(pointRender, argsData);\n if (!argsData.cancel) {\n point.symbolLocations.push(getCoordinate(point.xValue, point.yValue, xAxis, yAxis, isInverted, series));\n point.color = argsData.fill;\n this.refresh(series, point, argsData, startLocation);\n }\n else {\n point.marker = { visible: true };\n }\n }\n }\n };\n /**\n * To append scatter element\n * @param series\n * @param point\n * @param argsData\n * @param startLocation\n */\n ScatterSeries.prototype.refresh = function (series, point, argsData, startLocation) {\n var chart = series.chart;\n var circlePath;\n var previousPath;\n var marker = series.marker;\n var shapeOption = new PathOption(chart.element.id + '_Series_' + series.index + '_Point_' + point.index, argsData.fill, argsData.border.width, argsData.border.color, series.opacity, null);\n if (chart.redraw && getElement(shapeOption.id)) {\n circlePath = argsData.shape === 'Circle' ? 'c' : '';\n previousPath = getElement(shapeOption.id).getAttribute('d');\n }\n appendChildElement(series.seriesElement, drawSymbol(point.symbolLocations[0], argsData.shape, new Size(argsData.width, argsData.height), marker.imageUrl, shapeOption, point.x.toString() + ':' + point.yValue.toString()), chart.redraw, true, circlePath + 'x', circlePath + 'y', startLocation, previousPath);\n point.regions.push(new Rect(point.symbolLocations[0].x - marker.width, point.symbolLocations[0].y - marker.height, 2 * marker.width, 2 * marker.height));\n point.marker = {\n border: argsData.border, fill: argsData.fill,\n height: argsData.height, visible: true,\n width: argsData.width, shape: argsData.shape\n };\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n ScatterSeries.prototype.doAnimation = function (series) {\n var duration = series.animation.duration;\n var delay = series.animation.delay;\n var rectElements = series.seriesElement.childNodes;\n var count = 1;\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n if (!point.symbolLocations.length || !rectElements[count]) {\n continue;\n }\n markerAnimate(rectElements[count], delay, duration, series, point.index, point.symbolLocations[0], false);\n count++;\n }\n };\n /**\n * Get module name.\n */\n ScatterSeries.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'ScatterSeries';\n };\n /**\n * To destroy the scatter.\n * @return {void}\n */\n ScatterSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method calling here\n */\n };\n return ScatterSeries;\n}());\nexport { ScatterSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { withInRange } from '../../common/utils/helper';\nimport { ColumnBase } from './column-base';\n/**\n * `RangeColumnSeries` module is used to render the range column series.\n */\nvar RangeColumnSeries = /** @class */ (function (_super) {\n __extends(RangeColumnSeries, _super);\n function RangeColumnSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render Range Column series.\n * @return {void}\n * @private\n */\n RangeColumnSeries.prototype.render = function (series) {\n var rect;\n var sideBySideInfo = this.getSideBySideInfo(series);\n //let origin: number = Math.max(series.yAxis.visibleRange.min, 0);\n var argsData;\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var rangePoint = _a[_i];\n rangePoint.symbolLocations = [];\n rangePoint.regions = [];\n if (rangePoint.visible && withInRange(series.points[rangePoint.index - 1], rangePoint, series.points[rangePoint.index + 1], series)) {\n rect = this.getRectangle(rangePoint.xValue + sideBySideInfo.start, rangePoint.high, rangePoint.xValue + sideBySideInfo.end, rangePoint.low, series);\n argsData = this.triggerEvent(series, rangePoint, series.interior, { width: series.border.width, color: series.border.color });\n if (!argsData.cancel) {\n this.updateSymbolLocation(rangePoint, rect, series);\n this.drawRectangle(series, rangePoint, rect, argsData);\n }\n }\n }\n this.renderMarker(series);\n };\n /**\n * Get module name.\n */\n RangeColumnSeries.prototype.getModuleName = function () {\n return 'RangeColumnSeries';\n /**\n * return the module name\n */\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n RangeColumnSeries.prototype.doAnimation = function (series) {\n this.animate(series);\n };\n /**\n * To destroy the range column series.\n * @return {void}\n * @private\n */\n RangeColumnSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n return RangeColumnSeries;\n}(ColumnBase));\nexport { RangeColumnSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { withInRange } from '../../common/utils/helper';\nimport { PathOption } from '@syncfusion/ej2-svg-base';\nimport { subArraySum, getElement, appendChildElement, redrawElement } from '../../common/utils/helper';\nimport { ColumnBase } from './column-base';\n/**\n * `WaterfallSeries` module is used to render the waterfall series.\n */\nvar WaterfallSeries = /** @class */ (function (_super) {\n __extends(WaterfallSeries, _super);\n function WaterfallSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render waterfall series.\n * @return {void}\n * @private\n */\n WaterfallSeries.prototype.render = function (series) {\n var rect;\n var sideBySideInfo = this.getSideBySideInfo(series);\n var origin = Math.max(series.yAxis.visibleRange.min, 0);\n var argsData;\n var prevEndValue = 0;\n var direction = '';\n var currentEndValue = 0;\n var originValue;\n var prevRegion = null;\n var y;\n var isInversed = series.chart.requireInvertedAxis;\n var intermediateOrigin = 0;\n var redraw = series.chart.redraw;\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n point.symbolLocations = [];\n point.regions = [];\n if (point.visible && withInRange(series.points[point.index - 1], point, series.points[point.index + 1], series)) {\n //Calcute the current point value to render waterfall series.\n var isSum = this.isIntermediateSum(series, point.index);\n var totalSum = this.isSumIndex(series, point.index);\n currentEndValue += isSum || totalSum === true ? 0 : point.yValue;\n //Calcute the origin value for points\n originValue = (isSum === true ? intermediateOrigin : ((prevEndValue !== null && !totalSum) ? prevEndValue : origin));\n rect = this.getRectangle(point.xValue + sideBySideInfo.start, currentEndValue, point.xValue + sideBySideInfo.end, originValue, series);\n argsData = this.triggerPointRenderEvent(series, point);\n //intermediateOrigin is used only for imtermediate data \n if (isSum) {\n intermediateOrigin = currentEndValue;\n }\n prevEndValue = currentEndValue;\n if (!argsData.cancel) {\n this.updateSymbolLocation(point, rect, series);\n this.drawRectangle(series, point, rect, argsData);\n }\n var currentRegion = point.regions[0];\n if (prevRegion !== null) {\n var prevLeft = isInversed ? prevRegion.x : prevRegion.y;\n var currentLeft = isInversed ? currentRegion.x : currentRegion.y;\n var prevBottom = isInversed ? prevRegion.x + prevRegion.width : prevRegion.y + prevRegion.height;\n var currentBottom = isInversed ?\n currentRegion.x + currentRegion.width : currentRegion.y + currentRegion.height;\n if (Math.round(prevLeft) === Math.round(currentLeft) ||\n Math.round(prevBottom) === Math.round(currentLeft)) {\n y = isInversed ? currentRegion.x : currentRegion.y;\n }\n else {\n y = currentBottom;\n }\n if (isInversed) {\n direction = direction.concat('M' + ' ' + y + ' ' + (prevRegion.y + prevRegion.height) + ' ' +\n 'L' + ' ' + y + ' ' + currentRegion.y + ' ');\n }\n else {\n direction = direction.concat('M' + ' ' + prevRegion.x + ' ' + y + ' ' +\n 'L' + ' ' + (currentRegion.x + currentRegion.width) + ' ' + y + ' ');\n }\n }\n prevRegion = point.regions[0];\n }\n }\n var options = new PathOption(series.chart.element.id + '_Series_' + series.index + '_Connector_', 'none', series.connector.width, series.connector.color, series.opacity, series.connector.dashArray, direction);\n if (redraw && getElement(options.id)) {\n direction = getElement(options.id).getAttribute('d');\n }\n var element = (redrawElement(redraw, options.id, options, series.chart.renderer) ||\n series.chart.renderer.drawPath(options));\n element.style.visibility = (series.animation.enable && series.chart.animateSeries) ? 'hidden' : 'visible';\n appendChildElement(series.seriesElement, element, redraw, true, null, null, null, direction);\n this.renderMarker(series);\n };\n /**\n * To check intermediateSumIndex in waterfall series.\n * @return boolean\n * @private\n */\n WaterfallSeries.prototype.isIntermediateSum = function (series, index) {\n if (series.intermediateSumIndexes !== undefined && series.intermediateSumIndexes.indexOf(index) !== -1) {\n return true;\n }\n return false;\n };\n /**\n * To check sumIndex in waterfall series.\n * @return boolean\n * @private\n */\n WaterfallSeries.prototype.isSumIndex = function (series, index) {\n if (series.sumIndexes !== undefined && series.sumIndexes.indexOf(index) !== -1) {\n return true;\n }\n return false;\n };\n /**\n * To trigger the point rendering event for waterfall series.\n * @return IPointRenderEventArgs\n * @private\n */\n WaterfallSeries.prototype.triggerPointRenderEvent = function (series, point) {\n var color;\n var isSum = this.isIntermediateSum(series, point.index);\n var totalSum = this.isSumIndex(series, point.index);\n if (isSum || totalSum) {\n color = series.summaryFillColor;\n }\n else if (point.y < 0) {\n color = series.negativeFillColor;\n }\n else {\n color = series.interior;\n }\n return this.triggerEvent(series, point, color, { color: series.border.color, width: series.border.width });\n };\n /**\n * Add sumIndex and intermediateSumIndex data.\n * @return {object[]}\n * @private\n */\n WaterfallSeries.prototype.processInternalData = function (json, series) {\n var data = json;\n var length = json.length;\n var index;\n var intermediateSum = series.intermediateSumIndexes;\n var sumIndex = series.sumIndexes;\n if (intermediateSum !== undefined && intermediateSum.length > 0) {\n for (var i = 0; i < intermediateSum.length; i++) {\n for (var j = 0; j < data.length; j++) {\n if (j === intermediateSum[i]) {\n if (i === 0) {\n index = subArraySum(data, -1, intermediateSum[i], null, series);\n }\n else {\n index = subArraySum(data, intermediateSum[i - 1], intermediateSum[i], null, series);\n }\n data[j][series.yName] = index;\n }\n }\n }\n }\n if (sumIndex !== undefined && sumIndex.length > 0) {\n for (var k = 0; k < sumIndex.length; k++) {\n for (var j = 0; j < data.length; j++) {\n if (j === sumIndex[k]) {\n if (intermediateSum !== undefined) {\n index = subArraySum(data, -1, sumIndex[k], sumIndex, series);\n }\n else {\n index = subArraySum(data, -1, sumIndex[k], null, series);\n }\n data[j][series.yName] = index;\n }\n }\n }\n }\n return data;\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n WaterfallSeries.prototype.doAnimation = function (series) {\n this.animate(series);\n };\n /**\n * Get module name.\n */\n WaterfallSeries.prototype.getModuleName = function () {\n return 'WaterfallSeries';\n /**\n * return the module name\n */\n };\n /**\n * To destroy the waterfall series.\n * @return {void}\n * @private\n */\n WaterfallSeries.prototype.destroy = function (chart) {\n /**\n * Destroys the waterfall series.\n */\n };\n return WaterfallSeries;\n}(ColumnBase));\nexport { WaterfallSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { withInRange } from '../../common/utils/helper';\nimport { ColumnBase } from './column-base';\n/**\n * `HiloSeries` module is used to render the hilo series.\n */\nvar HiloSeries = /** @class */ (function (_super) {\n __extends(HiloSeries, _super);\n function HiloSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render Hiloseries.\n * @return {void}\n * @private\n */\n HiloSeries.prototype.render = function (series) {\n var region;\n var sideBySideInfo = this.getSideBySideInfo(series);\n var argsData;\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n point.symbolLocations = [];\n point.regions = [];\n if (point.visible &&\n withInRange(series.points[point.index - 1], point, series.points[point.index + 1], series)) {\n region = this.getRectangle(point.xValue + sideBySideInfo.median, point.high, point.xValue + sideBySideInfo.median, point.low, series);\n argsData = this.triggerPointRenderEvent(series, point);\n if (!argsData.cancel) {\n if (!series.chart.requireInvertedAxis) {\n region.width = argsData.border.width;\n region.x = region.x - (region.width / 2);\n }\n else {\n region.height = argsData.border.width;\n region.y = region.y - (region.height / 2);\n }\n argsData.border.width = 0;\n this.updateSymbolLocation(point, region, series);\n this.drawRectangle(series, point, region, argsData);\n }\n }\n }\n };\n /**\n * To trigger the point rendering event.\n * @return {void}\n * @private\n */\n HiloSeries.prototype.triggerPointRenderEvent = function (series, point) {\n var border = { color: series.fill, width: Math.max(series.border.width, 2) };\n return _super.prototype.triggerEvent.call(this, series, point, series.interior, border);\n };\n /**\n * Get module name.\n */\n HiloSeries.prototype.getModuleName = function () {\n return 'HiloSeries';\n /**\n * return the module name\n */\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n HiloSeries.prototype.doAnimation = function (series) {\n this.animate(series);\n };\n /**\n * To destroy the Hilo series.\n * @return {void}\n * @private\n */\n HiloSeries.prototype.destroy = function (chart) {\n /**\n * Destroys the Hilo Series\n */\n };\n return HiloSeries;\n}(ColumnBase));\nexport { HiloSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { withInRange, pathAnimation, getElement } from '../../common/utils/helper';\nimport { PathOption } from '@syncfusion/ej2-svg-base';\nimport { ColumnBase } from './column-base';\n/**\n * `HiloOpenCloseSeries` module is used to render the hiloOpenClose series.\n */\nvar HiloOpenCloseSeries = /** @class */ (function (_super) {\n __extends(HiloOpenCloseSeries, _super);\n function HiloOpenCloseSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render HiloOpenCloseSeries series.\n * @return {void}\n * @private\n */\n HiloOpenCloseSeries.prototype.render = function (series) {\n var highLowRect;\n var open;\n var close;\n var sideBySideInfo = this.getSideBySideInfo(series);\n var argsData;\n var borderWidth = Math.max(series.border.width, 2);\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var point = _a[_i];\n point.symbolLocations = [];\n point.regions = [];\n if (point.visible &&\n withInRange(series.points[point.index - 1], point, series.points[point.index + 1], series)) {\n //highlow\n highLowRect = this.getRectangle(point.xValue + sideBySideInfo.start, Math.max(point.high, point.low), point.xValue + sideBySideInfo.end, Math.min(point.high, point.low), series);\n point.regions.push(this.getRectangle(point.xValue + sideBySideInfo.median, Math.max(point.high, point.low), point.xValue + sideBySideInfo.median, Math.min(point.high, point.low), series));\n this.updateTickRegion(!series.chart.requireInvertedAxis, point.regions[0], borderWidth);\n //open\n point.regions.push(this.getRectangle(point.xValue + sideBySideInfo.start, Math.max(point.open, point.close), point.xValue + sideBySideInfo.median, Math.max(point.open, point.close), series));\n //close\n point.regions.push(this.getRectangle(point.xValue + sideBySideInfo.median, Math.min(point.open, point.close), point.xValue + sideBySideInfo.end, Math.min(point.open, point.close), series));\n argsData = this.triggerPointRenderEvent(series, point);\n if (!argsData.cancel) {\n this.updateSymbolLocation(point, point.regions[0], series);\n var open_1 = { x: point.regions[1].x, y: point.regions[1].y };\n var close_1 = { x: point.regions[2].x, y: point.regions[2].y };\n this.drawHiloOpenClosePath(series, point, open_1, close_1, highLowRect, argsData);\n }\n this.updateTickRegion(series.chart.requireInvertedAxis, point.regions[1], borderWidth);\n this.updateTickRegion(series.chart.requireInvertedAxis, point.regions[2], borderWidth);\n }\n }\n };\n /**\n * Updates the tick region\n */\n HiloOpenCloseSeries.prototype.updateTickRegion = function (horizontal, region, borderWidth) {\n if (horizontal) {\n region.x -= borderWidth / 2;\n region.width = borderWidth;\n }\n else {\n region.y -= borderWidth / 2;\n region.height = borderWidth;\n }\n };\n /**\n * Trigger point rendering event\n */\n HiloOpenCloseSeries.prototype.triggerPointRenderEvent = function (series, point) {\n var fill = (point.open <= point.close) ? series.bearFillColor : series.bullFillColor;\n var border = { color: series.border.color, width: Math.max(series.border.width, 1) };\n return this.triggerEvent(series, point, fill, border);\n };\n /**\n * To draw the rectangle for points.\n * @return {void}\n * @private\n */\n HiloOpenCloseSeries.prototype.drawHiloOpenClosePath = function (series, point, open, close, rect, argsData) {\n // region highlow\n var direction;\n var options;\n if (series.chart.requireInvertedAxis) {\n direction = ('M' + ' ' + (rect.x) + ' ' + (rect.y + rect.height / 2) + ' ' +\n 'L' + ' ' + (rect.x + rect.width) + ' ' + (rect.y + rect.height / 2) + ' ');\n direction += ('M' + ' ' + (open.x) + ' ' + (rect.y + rect.height / 2) + ' ' +\n 'L' + ' ' + (open.x) + ' ' + (rect.y + rect.height) + ' ');\n direction += ('M' + ' ' + (close.x) + ' ' + (rect.y + rect.height / 2) + ' ' +\n 'L' + ' ' + (close.x) + ' ' + (rect.y) + ' ');\n }\n else {\n direction = ('M' + ' ' + (rect.x + rect.width / 2) + ' ' + (rect.y + rect.height) + ' ' +\n 'L' + ' ' + (rect.x + rect.width / 2) + ' ' + (rect.y) + ' ');\n //region opentick\n direction += ('M' + ' ' + (rect.x) + ' ' + (open.y) + ' ' +\n 'L' + ' ' + (rect.x + rect.width / 2) + ' ' + (open.y) + ' ');\n //region closetick\n direction += ('M' + ' ' + (rect.x + rect.width / 2) + ' ' + (close.y) + ' ' +\n 'L' + ' ' + (rect.x + rect.width) + ' ' + (close.y) + ' ');\n }\n options = new PathOption(series.chart.element.id + '_Series_' + series.index + '_Point_' + point.index, argsData.fill, argsData.border.width, argsData.fill, series.opacity, series.dashArray, direction);\n pathAnimation(getElement(options.id), direction, series.chart.redraw);\n var element = series.chart.renderer.drawPath(options);\n element.setAttribute('aria-label', point.x.toString() + ':' + point.high.toString()\n + ':' + point.low.toString() + ':' + point.close.toString() + ':' + point.open.toString());\n series.seriesElement.appendChild(element);\n };\n /**\n * Get module name.\n */\n HiloOpenCloseSeries.prototype.getModuleName = function () {\n return 'HiloOpenCloseSeries';\n /**\n * return the module name\n */\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n HiloOpenCloseSeries.prototype.doAnimation = function (series) {\n this.animate(series);\n };\n /**\n * To destroy the column series.\n * @return {void}\n * @private\n */\n HiloOpenCloseSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n return HiloOpenCloseSeries;\n}(ColumnBase));\nexport { HiloOpenCloseSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { withInRange, getPoint } from '../../common/utils/helper';\nimport { PathOption, Rect } from '@syncfusion/ej2-svg-base';\nimport { LineBase } from './line-base';\n/**\n * `RangeAreaSeries` module is used to render the range area series.\n */\nvar RangeAreaSeries = /** @class */ (function (_super) {\n __extends(RangeAreaSeries, _super);\n function RangeAreaSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render RangeArea Series.\n * @return {void}.\n * @private\n */\n RangeAreaSeries.prototype.render = function (series, xAxis, yAxis, inverted) {\n var point;\n var direction = '';\n var command = 'M';\n var closed = undefined;\n var visiblePoints = this.enableComplexProperty(series);\n for (var i = 0, length_1 = visiblePoints.length; i < length_1; i++) {\n point = visiblePoints[i];\n point.symbolLocations = [];\n point.regions = [];\n var low = Math.min(point.low, point.high);\n var high = Math.max(point.low, point.high);\n if (yAxis.isInversed) {\n var temp = low;\n low = high;\n high = temp;\n }\n var lowPoint = getPoint(point.xValue, low, xAxis, yAxis, inverted);\n var highPoint = getPoint(point.xValue, high, xAxis, yAxis, inverted);\n point.symbolLocations.push(highPoint);\n point.symbolLocations.push(lowPoint);\n var rect = new Rect(Math.min(lowPoint.x, highPoint.x), Math.min(lowPoint.y, highPoint.y), Math.max(Math.abs(highPoint.x - lowPoint.x), series.marker.width), Math.max(Math.abs(highPoint.y - lowPoint.y), series.marker.width));\n if (!inverted) {\n rect.x -= series.marker.width / 2;\n }\n else {\n rect.y -= series.marker.width / 2;\n }\n point.regions.push(rect);\n //Path to connect the high points\n if (point.visible && withInRange(visiblePoints[point.index - 1], point, visiblePoints[point.index + 1], series)) {\n direction = direction.concat(command + ' ' + (lowPoint.x) + ' ' + (lowPoint.y) + ' ');\n closed = false;\n if ((i + 1 < visiblePoints.length && !visiblePoints[i + 1].visible)\n || i === visiblePoints.length - 1) {\n // Path to connect the low points\n direction = this.closeRangeAreaPath(visiblePoints, point, series, direction, i);\n command = 'M';\n direction = direction.concat(' ' + 'Z');\n closed = true;\n }\n command = 'L';\n }\n else {\n if (closed === false && i !== 0) {\n direction = this.closeRangeAreaPath(visiblePoints, point, series, direction, i);\n closed = true;\n }\n command = 'M';\n point.symbolLocations = [];\n }\n }\n var name = series.category === 'Indicator' ? series.chart.element.id + '_Indicator_' + series.index + '_' + series.name :\n series.chart.element.id + '_Series_' + series.index;\n var options = new PathOption(name, series.interior, series.border.width, series.border.color, series.opacity, series.dashArray, direction);\n this.appendLinePath(options, series, '');\n this.renderMarker(series);\n };\n /**\n * path for rendering the low points\n * @return {void}.\n * @private\n */\n RangeAreaSeries.prototype.closeRangeAreaPath = function (visiblePoints, point, series, direction, i) {\n for (var j = i; j >= 0; j--) {\n if (visiblePoints[j].visible && visiblePoints[j].symbolLocations[0]) {\n point = visiblePoints[j];\n direction += 'L' + ' ' + (point.symbolLocations[0].x) + ' ' + ((point.symbolLocations[0].y)) + ' ';\n }\n else {\n break;\n }\n }\n return direction;\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n RangeAreaSeries.prototype.doAnimation = function (series) {\n var option = series.animation;\n this.doLinearAnimation(series, option);\n };\n /**\n * Get module name.\n */\n RangeAreaSeries.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'RangeAreaSeries';\n };\n /**\n * To destroy the line series.\n * @return {void}\n * @private\n */\n RangeAreaSeries.prototype.destroy = function (chart) {\n /**\n * Destroys range area series\n */\n };\n return RangeAreaSeries;\n}(LineBase));\nexport { RangeAreaSeries };\n","import { withInRange, getPoint, drawSymbol } from '../../common/utils/helper';\nimport { Size, PathOption, Rect } from '@syncfusion/ej2-svg-base';\nimport { markerAnimate, appendChildElement, animateRedrawElement } from '../../common/utils/helper';\nimport { pointRender } from '../../common/model/constants';\n/**\n * `BubbleSeries` module is used to render the bubble series.\n */\nvar BubbleSeries = /** @class */ (function () {\n function BubbleSeries() {\n }\n /**\n * Render the Bubble series.\n * @return {void}\n * @private\n */\n BubbleSeries.prototype.render = function (series, xAxis, yAxis, isInverted) {\n var marker = series.marker;\n var visiblePoints = series.points;\n var shapeOption;\n var argsData;\n //let bubbleMode: RadiusMode = bubbleOptions.radiusMode;\n var segmentRadius;\n var radius;\n var value = Math.max(series.chart.initialClipRect.height, series.chart.initialClipRect.width);\n var percentChange = value / 100;\n var maxRadius = series.maxRadius * percentChange;\n var minRadius = series.minRadius * percentChange;\n var maximumSize = null;\n var maxValue = null;\n var element;\n var startLocation;\n var redraw = series.chart.redraw;\n if ((series.maxRadius === null || series.minRadius === null)) {\n for (var _i = 0, _a = series.chart.visibleSeries; _i < _a.length; _i++) {\n var value_1 = _a[_i];\n if (value_1.type === 'Bubble' && value_1.visible === true && (value_1.maxRadius === null || value_1.minRadius === null)) {\n maximumSize = value_1.sizeMax > maximumSize ? value_1.sizeMax : maximumSize;\n }\n }\n maxValue = (value / 5) / 2;\n minRadius = maxRadius = 1;\n radius = maxValue * maxRadius;\n }\n else {\n maximumSize = series.sizeMax;\n radius = maxRadius - minRadius;\n }\n for (var _b = 0, visiblePoints_1 = visiblePoints; _b < visiblePoints_1.length; _b++) {\n var bubblePoint = visiblePoints_1[_b];\n startLocation = redraw ? bubblePoint.symbolLocations[0] : null;\n bubblePoint.symbolLocations = [];\n bubblePoint.regions = [];\n if (bubblePoint.visible &&\n withInRange(visiblePoints[bubblePoint.index - 1], bubblePoint, visiblePoints[bubblePoint.index + 1], series)) {\n if ((series.maxRadius === null || series.minRadius === null)) {\n segmentRadius = radius * Math.abs(+bubblePoint.size / maximumSize);\n }\n else {\n segmentRadius = minRadius + radius * Math.abs(+bubblePoint.size / maximumSize);\n }\n segmentRadius = segmentRadius || minRadius;\n argsData = {\n cancel: false, name: pointRender, series: series, point: bubblePoint,\n fill: series.setPointColor(bubblePoint, series.interior),\n border: series.setBorderColor(bubblePoint, { width: series.border.width, color: series.border.color }),\n height: 2 * segmentRadius, width: 2 * segmentRadius\n };\n series.chart.trigger(pointRender, argsData);\n if (!argsData.cancel) {\n bubblePoint.symbolLocations.push(getPoint(bubblePoint.xValue, bubblePoint.yValue, xAxis, yAxis, isInverted));\n bubblePoint.color = argsData.fill;\n shapeOption = new PathOption(series.chart.element.id + '_Series_' + series.index + '_Point_' + bubblePoint.index, argsData.fill, argsData.border.width, argsData.border.color, series.opacity, null);\n element = drawSymbol(bubblePoint.symbolLocations[0], 'Circle', new Size(argsData.width, argsData.height), marker.imageUrl, shapeOption, bubblePoint.x.toString() + ':' + bubblePoint.yValue.toString());\n appendChildElement(series.seriesElement, element, redraw);\n bubblePoint.regions.push(new Rect(bubblePoint.symbolLocations[0].x - segmentRadius, bubblePoint.symbolLocations[0].y - segmentRadius, 2 * segmentRadius, 2 * segmentRadius));\n bubblePoint.marker = {\n border: argsData.border, fill: argsData.fill,\n height: argsData.height, visible: true,\n shape: 'Circle', width: argsData.width\n };\n if (redraw) {\n animateRedrawElement(element, 300, startLocation, bubblePoint.symbolLocations[0], 'cx', 'cy');\n }\n }\n else {\n bubblePoint.marker = { visible: false };\n }\n }\n }\n };\n /**\n * To destroy the Bubble.\n * @return {void}\n * @private\n */\n BubbleSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method calling here\n */\n };\n /**\n * Get module name.\n */\n BubbleSeries.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'BubbleSeries';\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n BubbleSeries.prototype.doAnimation = function (series) {\n var duration = series.animation.duration;\n var delay = series.animation.delay;\n var rectElements = series.seriesElement.childNodes;\n var count = 1;\n for (var _i = 0, _a = series.points; _i < _a.length; _i++) {\n var bubblePoint = _a[_i];\n if (!bubblePoint.symbolLocations.length) {\n continue;\n }\n markerAnimate(rectElements[count], delay, duration, series, bubblePoint.index, bubblePoint.symbolLocations[0], false);\n count++;\n }\n };\n return BubbleSeries;\n}());\nexport { BubbleSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { ChartLocation, ControlPoints } from '../../common/utils/helper';\nimport { extend, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { LineBase } from './line-base';\n/**\n * render Line series\n */\nvar SplineBase = /** @class */ (function (_super) {\n __extends(SplineBase, _super);\n /** @private */\n function SplineBase(chartModule) {\n var _this = _super.call(this, chartModule) || this;\n _this.splinePoints = [];\n return _this;\n }\n /**\n * To find the control points for spline.\n * @return {void}\n * @private\n */\n SplineBase.prototype.findSplinePoint = function (series) {\n var value;\n var points = this.filterEmptyPoints(series);\n this.splinePoints = this.findSplineCoefficients(points, series);\n if (points.length > 1) {\n series.drawPoints = [];\n for (var _i = 0, points_1 = points; _i < points_1.length; _i++) {\n var point = points_1[_i];\n if (point.index !== 0) {\n var previous = this.getPreviousIndex(points, point.index - 1, series);\n value = this.getControlPoints(points[previous], point, this.splinePoints[previous], this.splinePoints[point.index], series);\n series.drawPoints.push(value);\n if (point.yValue && value.controlPoint1.y && value.controlPoint2.y) {\n series.yMin = Math.floor(Math.min(series.yMin, point.yValue, value.controlPoint1.y, value.controlPoint2.y));\n series.yMax = Math.ceil(Math.max(series.yMax, point.yValue, value.controlPoint1.y, value.controlPoint2.y));\n }\n }\n }\n }\n };\n SplineBase.prototype.getPreviousIndex = function (points, i, series) {\n if (series.emptyPointSettings.mode !== 'Drop') {\n return i;\n }\n while (isNullOrUndefined(points[i]) && i > -1) {\n i = i - 1;\n }\n return i;\n };\n SplineBase.prototype.getNextIndex = function (points, i, series) {\n if (series.emptyPointSettings.mode !== 'Drop') {\n return i;\n }\n while (isNullOrUndefined(points[i]) && i < points.length) {\n i = i + 1;\n }\n return i;\n };\n SplineBase.prototype.filterEmptyPoints = function (series) {\n if (series.emptyPointSettings.mode !== 'Drop') {\n return series.points;\n }\n var points = extend([], series.points, null, true);\n for (var i = 0; i < points.length; i++) {\n points[i].index = i;\n if (points[i].isEmpty) {\n points[i].symbolLocations = [];\n points[i].regions = [];\n points.splice(i, 1);\n i--;\n }\n }\n return points;\n };\n /**\n * To find the natural spline.\n * @return {void}\n * @private\n */\n SplineBase.prototype.findSplineCoefficients = function (points, series) {\n var count = points.length;\n var ySpline = [];\n var ySplineDuplicate = [];\n var coefficient1;\n var coefficient2;\n var coefficient3;\n var dy1;\n var dy2;\n var dx = [];\n var dy = [];\n var slope = [];\n var interPoint;\n var slopeLength;\n var cardinalSplineTension = series.cardinalSplineTension ? series.cardinalSplineTension : 0.5;\n cardinalSplineTension = cardinalSplineTension < 0 ? 0 : cardinalSplineTension > 1 ? 1 : cardinalSplineTension;\n switch (series.splineType) {\n case 'Monotonic':\n for (var i = 0; i < count - 1; i++) {\n dx[i] = points[i + 1].xValue - points[i].xValue;\n dy[i] = points[i + 1].yValue - points[i].yValue;\n slope[i] = dy[i] / dx[i];\n }\n //interpolant points\n slopeLength = slope.length;\n // to find the first and last co-efficient value\n ySpline[0] = slope[0];\n ySpline[count - 1] = slope[slopeLength - 1];\n //to find the other co-efficient values\n for (var j = 0; j < dx.length; j++) {\n if (slopeLength > j + 1) {\n if (slope[j] * slope[j + 1] <= 0) {\n ySpline[j + 1] = 0;\n }\n else {\n interPoint = dx[j] + dx[j + 1];\n ySpline[j + 1] = 3 * interPoint / ((interPoint + dx[j + 1]) / slope[j] + (interPoint + dx[j]) / slope[j + 1]);\n }\n }\n }\n break;\n case 'Cardinal':\n for (var i = 0; i < count; i++) {\n if (i === 0) {\n ySpline[i] = (count > 2) ? (cardinalSplineTension * (points[i + 2].xValue - points[i].xValue)) : 0;\n }\n else if (i === (count - 1)) {\n ySpline[i] = (count > 2) ? (cardinalSplineTension * (points[count - 1].xValue - points[count - 3].xValue)) : 0;\n }\n else {\n ySpline[i] = (cardinalSplineTension * (points[i + 1].xValue - points[i - 1].xValue));\n }\n }\n break;\n default:\n if (series.splineType === 'Clamped') {\n var firstIndex = (points[1].yValue - points[0].yValue) / (points[1].xValue - points[0].xValue);\n var lastIndex = (points[count - 1].xValue - points[count - 2].xValue) /\n (points[count - 1].yValue - points[count - 2].yValue);\n ySpline[0] = (3 * (points[1].yValue - points[0].yValue)) / (points[1].xValue - points[0].xValue) - 3;\n ySplineDuplicate[0] = 0.5;\n ySpline[points.length - 1] = (3 * (points[points.length - 1].yValue - points[points.length - 2].yValue)) /\n (points[points.length - 1].xValue - points[points.length - 2].xValue);\n ySpline[0] = ySplineDuplicate[0] = Math.abs(ySpline[0]) === Infinity ? 0 : ySpline[0];\n ySpline[points.length - 1] = ySplineDuplicate[points.length - 1] = Math.abs(ySpline[points.length - 1]) === Infinity ?\n 0 : ySpline[points.length - 1];\n }\n else {\n // assigning the first and last value as zero\n ySpline[0] = ySplineDuplicate[0] = 0;\n ySpline[points.length - 1] = 0;\n }\n for (var i = 1; i < count - 1; i++) {\n coefficient1 = points[i].xValue - points[i - 1].xValue;\n coefficient2 = points[i + 1].xValue - points[i - 1].xValue;\n coefficient3 = points[i + 1].xValue - points[i].xValue;\n dy1 = points[i + 1].yValue - points[i].yValue || null;\n dy2 = points[i].yValue - points[i - 1].yValue || null;\n if (coefficient1 === 0 || coefficient2 === 0 || coefficient3 === 0) {\n ySpline[i] = 0;\n ySplineDuplicate[i] = 0;\n }\n else {\n var p = 1 / (coefficient1 * ySpline[i - 1] + 2 * coefficient2);\n ySpline[i] = -p * coefficient3;\n ySplineDuplicate[i] = p * (6 * (dy1 / coefficient3 - dy2 / coefficient1) - coefficient1 * ySplineDuplicate[i - 1]);\n }\n }\n for (var k = count - 2; k >= 0; k--) {\n ySpline[k] = ySpline[k] * ySpline[k + 1] + ySplineDuplicate[k];\n }\n break;\n }\n return ySpline;\n };\n /**\n * To find the control points for spline.\n * @return {void}\n * @private\n */\n SplineBase.prototype.getControlPoints = function (point1, point2, ySpline1, ySpline2, series) {\n var controlPoint1;\n var controlPoint2;\n var point;\n var ySplineDuplicate1 = ySpline1;\n var ySplineDuplicate2 = ySpline2;\n switch (series.splineType) {\n case 'Cardinal':\n if (series.xAxis.valueType === 'DateTime') {\n ySplineDuplicate1 = ySpline1 / this.dateTimeInterval(series);\n ySplineDuplicate2 = ySpline2 / this.dateTimeInterval(series);\n }\n controlPoint1 = new ChartLocation(point1.xValue + ySpline1 / 3, point1.yValue + ySplineDuplicate1 / 3);\n controlPoint2 = new ChartLocation(point2.xValue - ySpline2 / 3, point2.yValue - ySplineDuplicate2 / 3);\n point = new ControlPoints(controlPoint1, controlPoint2);\n break;\n case 'Monotonic':\n var value = (point2.xValue - point1.xValue) / 3;\n controlPoint1 = new ChartLocation(point1.xValue + value, point1.yValue + ySpline1 * value);\n controlPoint2 = new ChartLocation(point2.xValue - value, point2.yValue - ySpline2 * value);\n point = new ControlPoints(controlPoint1, controlPoint2);\n break;\n default:\n var one3 = 1 / 3.0;\n var deltaX2 = (point2.xValue - point1.xValue);\n deltaX2 = deltaX2 * deltaX2;\n var y1 = one3 * (((2 * point1.yValue) + point2.yValue) - one3 * deltaX2 * (ySpline1 + 0.5 * ySpline2));\n var y2 = one3 * ((point1.yValue + (2 * point2.yValue)) - one3 * deltaX2 * (0.5 * ySpline1 + ySpline2));\n controlPoint1 = new ChartLocation((2 * (point1.xValue) + (point2.xValue)) * one3, y1);\n controlPoint2 = new ChartLocation(((point1.xValue) + 2 * (point2.xValue)) * one3, y2);\n point = new ControlPoints(controlPoint1, controlPoint2);\n break;\n }\n return point;\n };\n /**\n * calculate datetime interval in hours\n *\n */\n SplineBase.prototype.dateTimeInterval = function (series) {\n var interval = series.xAxis.actualIntervalType;\n var intervalInMilliseconds;\n if (interval === 'Years') {\n intervalInMilliseconds = 365 * 24 * 60 * 60 * 1000;\n }\n else if (interval === 'Months') {\n intervalInMilliseconds = 30 * 24 * 60 * 60 * 1000;\n }\n else if (interval === 'Days') {\n intervalInMilliseconds = 24 * 60 * 60 * 1000;\n }\n else if (interval === 'Hours') {\n intervalInMilliseconds = 60 * 60 * 1000;\n }\n else if (interval === 'Minutes') {\n intervalInMilliseconds = 60 * 1000;\n }\n else if (interval === 'Seconds') {\n intervalInMilliseconds = 1000;\n }\n else {\n intervalInMilliseconds = 30 * 24 * 60 * 60 * 1000;\n }\n return intervalInMilliseconds;\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n SplineBase.prototype.doAnimation = function (series) {\n var option = series.animation;\n this.doLinearAnimation(series, option);\n };\n return SplineBase;\n}(LineBase));\nexport { SplineBase };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { getPoint, withInRange, TransformToVisible } from '../../common/utils/helper';\nimport { PathOption } from '@syncfusion/ej2-svg-base';\nimport { SplineBase } from './spline-base';\n/**\n * `SplineSeries` module is used to render the spline series.\n */\nvar SplineSeries = /** @class */ (function (_super) {\n __extends(SplineSeries, _super);\n function SplineSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render the spline series.\n * @return {void}\n * @private\n */\n SplineSeries.prototype.render = function (series, xAxis, yAxis, isInverted) {\n var chart = series.chart;\n var marker = series.marker;\n var ySpline;\n var options;\n var firstPoint = null;\n var secondPoint = null;\n var direction = '';\n var pt1;\n var pt2;\n var bpt1;\n var bpt2;\n var data;\n var controlPointCount = 0;\n var controlPoint1;\n var controlPoint2;\n var startPoint = 'M';\n var points = this.filterEmptyPoints(series);\n var previous;\n var getCoordinate = series.chart.chartAreaType === 'PolarRadar' ? TransformToVisible : getPoint;\n for (var _i = 0, points_1 = points; _i < points_1.length; _i++) {\n var point = points_1[_i];\n previous = this.getPreviousIndex(points, point.index - 1, series);\n point.symbolLocations = [];\n point.regions = [];\n if (point.visible && withInRange(points[previous], point, points[this.getNextIndex(points, point.index - 1, series)], series)) {\n if (firstPoint !== null) {\n data = series.drawPoints[previous];\n controlPoint1 = data.controlPoint1;\n controlPoint2 = data.controlPoint2;\n pt1 = getCoordinate(firstPoint.xValue, firstPoint.yValue, xAxis, yAxis, isInverted, series);\n pt2 = getCoordinate(point.xValue, point.yValue, xAxis, yAxis, isInverted, series);\n bpt1 = getCoordinate(controlPoint1.x, controlPoint1.y, xAxis, yAxis, isInverted, series);\n bpt2 = getCoordinate(controlPoint2.x, controlPoint2.y, xAxis, yAxis, isInverted, series);\n direction = direction.concat((startPoint + ' ' + (pt1.x) + ' ' + (pt1.y) + ' ' + 'C' + ' ' + (bpt1.x) + ' '\n + (bpt1.y) + ' ' + (bpt2.x) + ' ' + (bpt2.y) + ' ' + (pt2.x) + ' ' + (pt2.y) + ' '));\n startPoint = 'L';\n }\n firstPoint = point;\n this.storePointLocation(point, series, isInverted, getCoordinate);\n }\n else {\n startPoint = 'M';\n firstPoint = null;\n point.symbolLocations = [];\n }\n }\n var name = series.category === 'TrendLine' ? series.chart.element.id + '_Series_' + series.sourceIndex + '_TrendLine_' + series.index :\n series.chart.element.id + '_Series_' + series.index;\n options = new PathOption(name, 'transparent', series.width, series.interior, series.opacity, series.dashArray, direction);\n this.appendLinePath(options, series, '');\n this.renderMarker(series);\n };\n /**\n * Get module name.\n */\n SplineSeries.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'SplineSeries';\n };\n /**\n * To destroy the spline.\n * @return {void}\n * @private\n */\n SplineSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method calling here\n */\n };\n return SplineSeries;\n}(SplineBase));\nexport { SplineSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { sum, getPoint, templateAnimate } from '../../common/utils/helper';\nimport { PathOption } from '@syncfusion/ej2-svg-base';\nimport { ColumnSeries } from './column-series';\n/**\n * `HistogramSeries` Module used to render the histogram series.\n */\nvar HistogramSeries = /** @class */ (function (_super) {\n __extends(HistogramSeries, _super);\n function HistogramSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render Histogram series.\n * @return {void}\n * @private\n */\n HistogramSeries.prototype.render = function (series) {\n _super.prototype.render.call(this, series);\n if (series.showNormalDistribution) {\n this.renderNormalDistribution(series);\n }\n };\n /**\n * To calculate bin interval for Histogram series.\n * @return number\n * @private\n */\n HistogramSeries.prototype.calculateBinInterval = function (yValues, series) {\n var mean = sum(yValues) / yValues.length;\n var sumValue = 0;\n for (var _i = 0, yValues_1 = yValues; _i < yValues_1.length; _i++) {\n var value = yValues_1[_i];\n sumValue += (value - mean) * (value - mean);\n }\n series.histogramValues.mean = mean;\n series.histogramValues.sDValue = Math.round(Math.sqrt(sumValue / yValues.length - 1));\n series.histogramValues.binWidth = series.binInterval ||\n Math.round((3.5 * series.histogramValues.sDValue) / Math.pow(yValues.length, 1 / 3));\n };\n /**\n * Add data points for Histogram series.\n * @return {object[]}\n * @private\n */\n HistogramSeries.prototype.processInternalData = function (data, series) {\n var _a;\n var updatedData = [];\n var yValues = [];\n var binWidth;\n Object.keys(data).forEach(function (key) {\n yValues.push(data[key][series.yName]);\n });\n series.histogramValues = {\n yValues: yValues\n };\n var min = Math.min.apply(Math, series.histogramValues.yValues);\n this.calculateBinInterval(series.histogramValues.yValues, series);\n binWidth = series.histogramValues.binWidth;\n var yCount;\n for (var j = 0; j < data.length;) {\n yCount = yValues.filter(function (y) { return y >= min && y < (min + (binWidth)); }).length;\n updatedData.push((_a = {\n 'x': min + binWidth / 2\n },\n _a[series.yName] = yCount,\n _a));\n min = min + binWidth;\n j += yCount;\n }\n return updatedData;\n };\n /**\n * Render Normal Distribution for Histogram series.\n * @return {void}\n * @private\n */\n HistogramSeries.prototype.renderNormalDistribution = function (series) {\n var min = series.xAxis.actualRange.min;\n var max = series.xAxis.actualRange.max;\n var xValue;\n var pointLocation;\n var yValue;\n var direction = '';\n var startPoint = 'M';\n var yValuesCount = series.histogramValues.yValues.length;\n var binWidth = series.histogramValues.binWidth;\n var mean = series.histogramValues.mean;\n var sDValue = series.histogramValues.sDValue;\n var pointsCount = 500;\n var del = (max - min) / (pointsCount - 1);\n var distributionLine;\n for (var i = 0; i < pointsCount; i++) {\n xValue = min + i * del;\n yValue = Math.exp(-(xValue - mean) * (xValue - mean) / (2 * sDValue * sDValue)) /\n (sDValue * Math.sqrt(2 * Math.PI));\n pointLocation = getPoint(xValue, yValue * binWidth * yValuesCount, series.xAxis, series.yAxis, series.chart.requireInvertedAxis, series);\n direction += startPoint + ' ' + (pointLocation.x) + ' ' + (pointLocation.y) + ' ';\n startPoint = 'L';\n }\n distributionLine = series.chart.renderer.drawPath(new PathOption(series.chart.element.id + '_Series_' + series.index + '_NDLine', 'transparent', 2, series.chart.themeStyle.errorBar, series.opacity, series.dashArray, direction));\n distributionLine.style.visibility = (series.animation.enable && series.chart.animateSeries) ?\n 'hidden' : 'visible';\n series.seriesElement.appendChild(distributionLine);\n };\n /**\n * Animates the series.\n * @param {Series} series - Defines the series to animate.\n * @return {void}\n */\n HistogramSeries.prototype.doAnimation = function (series) {\n _super.prototype.doAnimation.call(this, series);\n if (series.showNormalDistribution) {\n templateAnimate(series.seriesElement.lastElementChild, series.animation.duration, 500, 'FadeIn');\n }\n };\n /**\n * Get module name.\n */\n HistogramSeries.prototype.getModuleName = function () {\n return 'HistogramSeries';\n /**\n * return the module name\n */\n };\n /**\n * To destroy the histogram series.\n * @return {void}\n * @private\n */\n HistogramSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n return HistogramSeries;\n}(ColumnSeries));\nexport { HistogramSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { getPoint, withInRange, TransformToVisible } from '../../common/utils/helper';\nimport { PathOption } from '@syncfusion/ej2-svg-base';\nimport { SplineBase } from './spline-base';\n/**\n * `SplineAreaSeries` module used to render the spline area series.\n */\nvar SplineAreaSeries = /** @class */ (function (_super) {\n __extends(SplineAreaSeries, _super);\n function SplineAreaSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Render the splineArea series.\n * @return {void}\n * @private\n */\n SplineAreaSeries.prototype.render = function (series, xAxis, yAxis, isInverted) {\n var firstPoint = null;\n var direction = '';\n var startPoint = null;\n var startPoint1 = null;\n var pt1;\n var pt2;\n var bpt1;\n var bpt2;\n var controlPt1;\n var controlPt2;\n var points = this.filterEmptyPoints(series);\n var pointsLength = series.points.length;\n var point;\n var previous;\n var getCoordinate = series.chart.chartAreaType === 'PolarRadar' ? TransformToVisible : getPoint;\n var origin = series.chart.chartAreaType === 'PolarRadar' ? series.points[0].yValue :\n Math.max(series.yAxis.visibleRange.min, 0);\n for (var i = 0; i < pointsLength; i++) {\n point = series.points[i];\n point.symbolLocations = [];\n point.regions = [];\n previous = this.getPreviousIndex(points, point.index - 1, series);\n if (point.visible &&\n withInRange(points[previous], point, points[this.getNextIndex(points, point.index - 1, series)], series)) {\n if (firstPoint) {\n controlPt1 = series.drawPoints[previous].controlPoint1;\n controlPt2 = series.drawPoints[previous].controlPoint2;\n pt1 = getCoordinate(firstPoint.xValue, firstPoint.yValue, xAxis, yAxis, isInverted, series);\n pt2 = getCoordinate(point.xValue, point.yValue, xAxis, yAxis, isInverted, series);\n bpt1 = getCoordinate(controlPt1.x, controlPt1.y, xAxis, yAxis, isInverted, series);\n bpt2 = getCoordinate(controlPt2.x, controlPt2.y, xAxis, yAxis, isInverted, series);\n direction = direction.concat(' C ' + bpt1.x + ' '\n + bpt1.y + ' ' + bpt2.x + ' ' + bpt2.y + ' ' + pt2.x + ' ' + pt2.y + ' ');\n }\n else {\n // Start point for the current path\n startPoint = getCoordinate(point.xValue, origin, xAxis, yAxis, isInverted, series);\n direction += ('M ' + startPoint.x + ' ' + startPoint.y + ' ');\n // First Point to draw the area path\n startPoint1 = getCoordinate(point.xValue, point.yValue, xAxis, yAxis, isInverted, series);\n direction += ('L ' + startPoint1.x + ' ' + startPoint1.y + ' ');\n }\n this.storePointLocation(point, series, isInverted, getCoordinate);\n firstPoint = point;\n }\n else {\n firstPoint = null;\n point.symbolLocations = [];\n }\n if (((i + 1 < pointsLength && !series.points[i + 1].visible) || i === pointsLength - 1)\n && pt2 && startPoint) {\n startPoint = getCoordinate(point.xValue, origin, xAxis, yAxis, isInverted, series);\n direction = direction.concat('L ' + (startPoint.x) + ' ' + (startPoint.y));\n }\n }\n this.appendLinePath(new PathOption(series.chart.element.id + '_Series_' + series.index, series.interior, series.border.width, series.border.color, series.opacity, series.dashArray, direction), series, '');\n this.renderMarker(series);\n };\n /**\n * Get module name.\n */\n SplineAreaSeries.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'SplineAreaSeries';\n };\n /**\n * To destroy the spline.\n * @return {void}\n * @private\n */\n SplineAreaSeries.prototype.destroy = function (chart) {\n /**\n * Destroy method calling here\n */\n };\n return SplineAreaSeries;\n}(SplineBase));\nexport { SplineAreaSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { LineBase } from '../series/line-base';\nimport { Series, Points } from '../series/chart-series';\nimport { RectOption, appendClipElement } from '../../common/utils/helper';\nimport { findClipRect } from '../../common/utils/helper';\nimport { Rect } from '@syncfusion/ej2-svg-base';\n/**\n * Technical Analysis module helps to predict the market trend\n */\nvar TechnicalAnalysis = /** @class */ (function (_super) {\n __extends(TechnicalAnalysis, _super);\n function TechnicalAnalysis() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Defines the collection of series, that are used to represent the given technical indicator\n * @private\n */\n TechnicalAnalysis.prototype.initSeriesCollection = function (indicator, chart) {\n indicator.targetSeries = [];\n var signalLine = new Series(indicator, 'targetSeries', {}, true);\n this.setSeriesProperties(signalLine, indicator, indicator.type, indicator.fill, indicator.width, chart);\n };\n /**\n * Initializes the properties of the given series\n * @private\n */\n TechnicalAnalysis.prototype.setSeriesProperties = function (series, indicator, name, fill, width, chart) {\n series.name = name.length <= 4 ? name.toLocaleUpperCase() : name;\n series.xName = 'x';\n series.yName = 'y';\n series.fill = fill || '#606eff';\n series.dashArray = indicator.dashArray;\n series.width = width;\n series.xAxisName = indicator.xAxisName;\n series.animation = indicator.animation;\n series.yAxisName = indicator.yAxisName;\n series.clipRectElement = indicator.clipRectElement;\n series.points = [];\n series.enableTooltip = true;\n series.interior = series.fill;\n series.category = 'Indicator';\n series.index = indicator.index;\n series.chart = chart;\n series.xMin = Infinity;\n series.xMax = -Infinity;\n series.yMin = Infinity;\n series.yMax = -Infinity;\n series.xData = [];\n series.yData = [];\n series.marker.visible = false;\n indicator.targetSeries.push(series);\n };\n /**\n * Creates the elements of a technical indicator\n * @private\n */\n TechnicalAnalysis.prototype.createIndicatorElements = function (chart, indicator, index) {\n if (indicator.seriesName || indicator.dataSource) {\n findClipRect(indicator.targetSeries[0]);\n }\n var clipRect = new Rect(0, 0, 0, 0);\n if (indicator.seriesName || indicator.dataSource) {\n clipRect = indicator.targetSeries[0].clipRect;\n }\n var options = new RectOption(chart.element.id + '_ChartIndicatorClipRect_' + index, 'transparent', { width: 1, color: 'Gray' }, 1, {\n x: 0, y: 0, width: clipRect.width,\n height: clipRect.height,\n });\n var clipRectElement = appendClipElement(chart.redraw, options, chart.renderer);\n //defines the clip rect element\n //creates the group for an indicator\n indicator.indicatorElement = chart.renderer.createGroup({\n 'id': chart.element.id + 'IndicatorGroup' + index,\n 'transform': 'translate(' + clipRect.x + ',' + clipRect.y + ')',\n 'clip-path': 'url(#' + chart.element.id + '_ChartIndicatorClipRect_' + index + ')'\n });\n indicator.indicatorElement.appendChild(clipRectElement);\n //Defines a group for each series in a technical indicator\n for (var _i = 0, _a = indicator.targetSeries; _i < _a.length; _i++) {\n var series = _a[_i];\n series.clipRectElement = clipRectElement;\n var element = series.chart.renderer.createGroup({\n 'id': series.chart.element.id + '_Indicator_' +\n indicator.index + '_' + series.name + '_Group'\n });\n indicator.indicatorElement.appendChild(element);\n series.seriesElement = element;\n }\n chart.indicatorElements.appendChild(indicator.indicatorElement);\n };\n TechnicalAnalysis.prototype.getDataPoint = function (x, y, sourcePoint, series, index, indicator) {\n if (indicator === void 0) { indicator = null; }\n var point = new Points();\n point.x = x;\n point.y = y;\n point.xValue = sourcePoint.xValue;\n point.color = series.fill;\n point.index = index;\n point.yValue = y;\n point.visible = true;\n series.xMin = Math.min(series.xMin, point.xValue);\n series.yMin = Math.min(series.yMin, point.yValue);\n series.xMax = Math.max(series.xMax, point.xValue);\n series.yMax = Math.max(series.yMax, point.yValue);\n series.xData.push(point.xValue);\n if (indicator && indicator.type === 'Macd' && series.type === 'Column') {\n if (point.y >= 0) {\n point.color = indicator.macdPositiveColor;\n }\n else {\n point.color = indicator.macdNegativeColor;\n }\n }\n return point;\n };\n TechnicalAnalysis.prototype.getRangePoint = function (x, high, low, sourcePoint, series, index, indicator) {\n if (indicator === void 0) { indicator = null; }\n var point = new Points();\n point.x = x;\n point.high = high;\n point.low = low;\n point.xValue = sourcePoint.xValue;\n point.color = series.fill;\n point.index = index;\n point.visible = true;\n series.xData.push(point.xValue);\n return point;\n };\n TechnicalAnalysis.prototype.setSeriesRange = function (points, indicator, series) {\n if (series === void 0) { series = null; }\n if (!series) {\n indicator.targetSeries[0].points = points;\n }\n else {\n series.points = points;\n }\n };\n return TechnicalAnalysis;\n}(LineBase));\nexport { TechnicalAnalysis };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { firstToLowerCase } from '../../common/utils/helper';\nimport { TechnicalAnalysis } from './indicator-base';\n/**\n * `SmaIndicator` module is used to render SMA indicator.\n */\nvar SmaIndicator = /** @class */ (function (_super) {\n __extends(SmaIndicator, _super);\n function SmaIndicator() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Defines the predictions based on SMA approach\n * @private\n */\n SmaIndicator.prototype.initDataSource = function (indicator, chart) {\n var smaPoints = [];\n var points = indicator.points;\n if (points && points.length) {\n //prepare data\n var validData = points;\n var field = firstToLowerCase(indicator.field);\n var xField = 'x';\n var signalSeries = indicator.targetSeries[0];\n if (validData && validData.length && validData.length >= indicator.period) {\n //find initial average\n var average = 0;\n var sum = 0;\n for (var i = 0; i < indicator.period; i++) {\n sum += validData[i][field];\n }\n average = sum / indicator.period;\n smaPoints.push(this.getDataPoint(validData[indicator.period - 1][xField], average, validData[indicator.period - 1], signalSeries, smaPoints.length));\n var index = indicator.period;\n while (index < validData.length) {\n sum -= validData[index - indicator.period][field];\n sum += validData[index][field];\n average = sum / indicator.period;\n smaPoints.push(this.getDataPoint(validData[index][xField], average, validData[index], signalSeries, smaPoints.length));\n index++;\n }\n }\n this.setSeriesRange(smaPoints, indicator);\n }\n };\n /**\n * To destroy the SMA indicator\n * @return {void}\n * @private\n */\n SmaIndicator.prototype.destroy = function (chart) {\n /**\n * Destroys the SMA indicator\n */\n };\n /**\n * Get module name.\n */\n SmaIndicator.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'SmaIndicator';\n };\n return SmaIndicator;\n}(TechnicalAnalysis));\nexport { SmaIndicator };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { firstToLowerCase } from '../../common/utils/helper';\nimport { TechnicalAnalysis } from './indicator-base';\n/**\n * `EmaIndicator` module is used to render EMA indicator.\n */\nvar EmaIndicator = /** @class */ (function (_super) {\n __extends(EmaIndicator, _super);\n function EmaIndicator() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Defines the predictions based on EMA approach\n * @private\n */\n EmaIndicator.prototype.initDataSource = function (indicator, chart) {\n var field = firstToLowerCase(indicator.field);\n var xField = 'x';\n var emaPoints = [];\n var signalSeries = indicator.targetSeries[0];\n //prepare data\n var validData = indicator.points;\n if (validData && validData.length && validData.length >= indicator.period) {\n //find initial average\n var sum = 0;\n var average = 0;\n //smoothing factor\n var k = (2 / (indicator.period + 1));\n for (var i = 0; i < indicator.period; i++) {\n sum += validData[i][field];\n }\n average = sum / indicator.period;\n emaPoints.push(this.getDataPoint(validData[indicator.period - 1][xField], average, validData[indicator.period - 1], signalSeries, emaPoints.length));\n var index = indicator.period;\n while (index < validData.length) {\n //previous average\n var prevAverage = emaPoints[index - indicator.period][signalSeries.yName];\n var yValue = (validData[index][field] - prevAverage) * k + prevAverage;\n emaPoints.push(this.getDataPoint(validData[index][xField], yValue, validData[index], signalSeries, emaPoints.length));\n index++;\n }\n }\n this.setSeriesRange(emaPoints, indicator);\n };\n /**\n * To destroy the EMA Indicator\n * @return {void}\n * @private\n */\n EmaIndicator.prototype.destroy = function (chart) {\n /**\n * Destroys the EMA Indicator\n */\n };\n /**\n * Get module name.\n */\n EmaIndicator.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'EmaIndicator';\n };\n return EmaIndicator;\n}(TechnicalAnalysis));\nexport { EmaIndicator };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { firstToLowerCase } from '../../common/utils/helper';\nimport { TechnicalAnalysis } from './indicator-base';\n/**\n * `TmaIndicator` module is used to render TMA indicator.\n */\nvar TmaIndicator = /** @class */ (function (_super) {\n __extends(TmaIndicator, _super);\n function TmaIndicator() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Defines the predictions based on TMA approach\n * @private\n */\n TmaIndicator.prototype.initDataSource = function (indicator, chart) {\n var tmaPoints = [];\n var field = firstToLowerCase(indicator.field);\n var xField = 'x';\n var signalSeries = indicator.targetSeries[0];\n //prepare data\n var validData = indicator.points;\n if (validData && validData.length && validData.length >= indicator.period) {\n var signalSeries_1 = indicator.targetSeries[0];\n //prepare data\n var validData_1 = indicator.points;\n if (validData_1.length && validData_1.length >= indicator.period) {\n //smoothing factor\n var k = (2 / (indicator.period + 1));\n //find initial average\n var average = 0;\n var sum = 0;\n var sumOfSMA = 0;\n var averageSMA = 0;\n var smaValues = [];\n //sma values\n var index = 0;\n var length_1 = validData_1.length;\n var period = indicator.period;\n while (length_1 >= period) {\n sum = 0;\n index = validData_1.length - length_1;\n for (var j = index; j < index + period; j++) {\n sum = sum + validData_1[j][field];\n }\n sum = sum / period;\n smaValues.push(sum);\n length_1--;\n }\n //initial values\n for (var k_1 = 0; k_1 < period - 1; k_1++) {\n sum = 0;\n for (var j = 0; j < k_1 + 1; j++) {\n sum = sum + validData_1[j][field];\n }\n sum = sum / (k_1 + 1);\n smaValues.splice(k_1, 0, sum);\n }\n index = indicator.period;\n while (index <= smaValues.length) {\n sum = 0;\n for (var j = index - indicator.period; j < index; j++) {\n sum = sum + smaValues[j];\n }\n sum = sum / indicator.period;\n tmaPoints.push(this.getDataPoint(validData_1[index - 1][xField], sum, validData_1[index - 1], signalSeries_1, tmaPoints.length));\n index++;\n }\n }\n }\n this.setSeriesRange(tmaPoints, indicator);\n };\n /**\n * To destroy the TMA indicator.\n * @return {void}\n * @private\n */\n TmaIndicator.prototype.destroy = function (chart) {\n /**\n * Destroys the TMA Indicator\n */\n };\n /**\n * Get module name.\n */\n TmaIndicator.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'TmaIndicator';\n };\n return TmaIndicator;\n}(TechnicalAnalysis));\nexport { TmaIndicator };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { TechnicalAnalysis } from './indicator-base';\n/**\n * `AccumulationDistributionIndicator` module is used to render accumulation distribution indicator.\n */\nvar AccumulationDistributionIndicator = /** @class */ (function (_super) {\n __extends(AccumulationDistributionIndicator, _super);\n function AccumulationDistributionIndicator() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Defines the predictions using accumulation distribution approach\n * @private\n */\n AccumulationDistributionIndicator.prototype.initDataSource = function (indicator, chart) {\n var sourceSeries = indicator.sourceSeries;\n var adPoints = [];\n var validData = indicator.points;\n if (validData.length > 0 && validData.length > indicator.period) {\n adPoints = this.calculateADPoints(indicator, validData);\n }\n this.setSeriesRange(adPoints, indicator);\n };\n /**\n * Calculates the Accumulation Distribution values\n * @private\n */\n AccumulationDistributionIndicator.prototype.calculateADPoints = function (indicator, validData) {\n var temp = [];\n var sum = 0;\n var i = 0;\n var value = 0;\n var high = 0;\n var low = 0;\n var close = 0;\n var signalSeries = indicator.targetSeries[0];\n for (i = 0; i < validData.length; i++) {\n high = Number(validData[i].high);\n low = Number(validData[i].low);\n close = Number(validData[i].close);\n /**\n * Money Flow Multiplier = [(Close - Low) - (High - Close)] /(High - Low)\n * Money Flow Volume = Money Flow Multiplier x Volume for the Period\n * ADL = Previous ADL + Current Period's Money Flow Volume\n */\n value = ((close - low) - (high - close)) / (high - low);\n /**\n * Sum is to calculate the Y values of the Accumulation distribution indicator\n */\n sum = sum + value * Number(validData[i].volume);\n /**\n * To calculate the x and y values for the Accumulation distribution indicator\n */\n temp[i] = this.getDataPoint(validData[i].x, sum, validData[i], signalSeries, temp.length);\n }\n return temp;\n };\n /**\n * To destroy the Accumulation Distribution Technical Indicator.\n * @return {void}\n * @private\n */\n AccumulationDistributionIndicator.prototype.destroy = function (chart) {\n /**\n * Destroys the Accumulation Distribution Technical indicator\n */\n };\n /**\n * Get module name.\n */\n AccumulationDistributionIndicator.prototype.getModuleName = function () {\n /**\n * Returns the module name of the Indicator\n */\n return 'AccumulationDistributionIndicator';\n };\n return AccumulationDistributionIndicator;\n}(TechnicalAnalysis));\nexport { AccumulationDistributionIndicator };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { TechnicalAnalysis } from './indicator-base';\n/**\n * `AtrIndicator` module is used to render ATR indicator.\n */\nvar AtrIndicator = /** @class */ (function (_super) {\n __extends(AtrIndicator, _super);\n function AtrIndicator() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Defines the predictions using Average True Range approach\n * @private\n */\n AtrIndicator.prototype.initDataSource = function (indicator, chart) {\n var validData = indicator.points;\n if (validData.length > 0 && validData.length > indicator.period) {\n this.calculateATRPoints(indicator, validData);\n }\n };\n /**\n * To calculate Average True Range indicator points\n * @private\n */\n AtrIndicator.prototype.calculateATRPoints = function (indicator, validData) {\n var average = 0;\n var highLow = 0;\n var highClose = 0;\n var lowClose = 0;\n var trueRange = 0;\n var points = [];\n var temp = [];\n var period = indicator.period;\n var sum = 0;\n var y = 'y';\n var signalSeries = indicator.targetSeries[0];\n for (var i = 0; i < validData.length; i++) {\n /**\n * Current High less the current Low\n * Current High less the previous Close (absolute value)\n * Current Low less the previous Close (absolute value)\n */\n highLow = Number(validData[i].high) - Number(validData[i].low);\n if (i > 0) {\n //\n highClose = Math.abs(Number(validData[i].high) - Number(validData[i - 1].close));\n lowClose = Math.abs(Number(validData[i].low) - Number(validData[i - 1].close));\n }\n /**\n * To find the maximum of highLow, highClose, lowClose\n */\n trueRange = Math.max(highLow, highClose, lowClose);\n sum = sum + trueRange;\n /**\n * Push the x and y values for the Average true range indicator\n */\n if (i >= period) {\n average = (Number(temp[i - 1][y]) * (period - 1) + trueRange) / period;\n points.push(this.getDataPoint(validData[i].x, average, validData[i], signalSeries, points.length));\n }\n else {\n average = sum / period;\n if (i === period - 1) {\n points.push(this.getDataPoint(validData[i].x, average, validData[i], signalSeries, points.length));\n }\n }\n temp[i] = { x: validData[i].x, y: average };\n }\n this.setSeriesRange(points, indicator);\n };\n /**\n * To destroy the Average true range indicator.\n * @return {void}\n * @private\n */\n AtrIndicator.prototype.destroy = function (chart) {\n /**\n * Destroy the Average true range indicator\n */\n };\n /**\n * Get module name.\n */\n AtrIndicator.prototype.getModuleName = function () {\n /**\n * Returns the module name of the Indicator\n */\n return 'AtrIndicator';\n };\n return AtrIndicator;\n}(TechnicalAnalysis));\nexport { AtrIndicator };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { Series } from '../series/chart-series';\nimport { TechnicalAnalysis } from './indicator-base';\n/**\n * `MomentumIndicator` module is used to render Momentum indicator.\n */\nvar MomentumIndicator = /** @class */ (function (_super) {\n __extends(MomentumIndicator, _super);\n function MomentumIndicator() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Defines the collection of series to represent a momentum indicator\n * @private\n */\n MomentumIndicator.prototype.initSeriesCollection = function (indicator, chart) {\n _super.prototype.initSeriesCollection.call(this, indicator, chart);\n var upperLine = new Series(indicator, 'targetSeries', {}, true);\n _super.prototype.setSeriesProperties.call(this, upperLine, indicator, 'UpperLine', indicator.upperLine.color, indicator.upperLine.width, chart);\n };\n /**\n * Defines the predictions using momentum approach\n * @private\n */\n MomentumIndicator.prototype.initDataSource = function (indicator, chart) {\n var upperCollection = [];\n var signalCollection = [];\n var validData = indicator.points;\n if (validData && validData.length) {\n var upperSeries = indicator.targetSeries[1];\n var signalSeries = indicator.targetSeries[0];\n var length_1 = indicator.period;\n if (validData.length >= indicator.period) {\n for (var i = 0; i < validData.length; i++) {\n upperCollection.push(this.getDataPoint(validData[i].x, 100, validData[i], upperSeries, upperCollection.length));\n if (!(i < length_1)) {\n signalCollection.push(this.getDataPoint(validData[i].x, (Number(validData[i].close) / Number(validData[i - length_1].close) * 100), validData[i], signalSeries, signalCollection.length));\n }\n }\n }\n this.setSeriesRange(signalCollection, indicator, indicator.targetSeries[0]);\n this.setSeriesRange(upperCollection, indicator, indicator.targetSeries[1]);\n }\n };\n /**\n * To destroy the momentum indicator\n * @return {void}\n * @private\n */\n MomentumIndicator.prototype.destroy = function (chart) {\n /**\n * Destroys the momentum indicator\n */\n };\n /**\n * Get module name.\n */\n MomentumIndicator.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'MomentumIndicator';\n };\n return MomentumIndicator;\n}(TechnicalAnalysis));\nexport { MomentumIndicator };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { Series } from '../series/chart-series';\nimport { TechnicalAnalysis } from './indicator-base';\n/**\n * `RsiIndicator` module is used to render RSI indicator.\n */\nvar RsiIndicator = /** @class */ (function (_super) {\n __extends(RsiIndicator, _super);\n function RsiIndicator() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Initializes the series collection to represent the RSI Indicator\n * @private\n */\n RsiIndicator.prototype.initSeriesCollection = function (indicator, chart) {\n _super.prototype.initSeriesCollection.call(this, indicator, chart);\n if (indicator.showZones) {\n var lowerLine = new Series(indicator, 'targetSeries', {}, true);\n _super.prototype.setSeriesProperties.call(this, lowerLine, indicator, 'LowerLine', indicator.lowerLine.color, indicator.lowerLine.width, chart);\n var upperLine = new Series(indicator, 'targetSeries', {}, true);\n _super.prototype.setSeriesProperties.call(this, upperLine, indicator, 'UpperLine', indicator.upperLine.color, indicator.upperLine.width, chart);\n }\n };\n /**\n * Defines the predictions using RSI approach\n * @private\n */\n RsiIndicator.prototype.initDataSource = function (indicator, chart) {\n var signalCollection = [];\n var lowerCollection = [];\n var upperCollection = [];\n var signalSeries = indicator.targetSeries[0];\n //prepare data\n var validData = indicator.points;\n if (validData.length && validData.length >= indicator.period) {\n //Find upper band and lower band values\n if (indicator.showZones) {\n for (var i = 0; i < validData.length; i++) {\n upperCollection.push(this.getDataPoint(validData[i].x, indicator.overBought, validData[i], indicator.targetSeries[1], upperCollection.length));\n lowerCollection.push(this.getDataPoint(validData[i].x, indicator.overSold, validData[i], indicator.targetSeries[2], lowerCollection.length));\n }\n }\n //Find signal line value\n var prevClose = Number(validData[0].close);\n var gain = 0;\n var loss = 0;\n for (var i = 1; i <= indicator.period; i++) {\n var close_1 = Number(validData[i].close);\n if (close_1 > prevClose) {\n gain += close_1 - prevClose;\n }\n else {\n loss += prevClose - close_1;\n }\n prevClose = close_1;\n }\n gain = gain / indicator.period;\n loss = loss / indicator.period;\n signalCollection.push(this.getDataPoint(validData[indicator.period].x, 100 - (100 / (1 + gain / loss)), validData[indicator.period], signalSeries, signalCollection.length));\n for (var j = indicator.period + 1; j < validData.length; j++) {\n var close_2 = Number(validData[j].close);\n if (close_2 > prevClose) {\n gain = (gain * (indicator.period - 1) + (close_2 - prevClose)) / indicator.period;\n loss = (loss * (indicator.period - 1)) / indicator.period;\n }\n else if (close_2 < prevClose) {\n loss = (loss * (indicator.period - 1) + (prevClose - close_2)) / indicator.period;\n gain = (gain * (indicator.period - 1)) / indicator.period;\n }\n prevClose = close_2;\n signalCollection.push(this.getDataPoint(validData[j].x, 100 - (100 / (1 + gain / loss)), validData[j], signalSeries, signalCollection.length));\n }\n }\n this.setSeriesRange(signalCollection, indicator, indicator.targetSeries[0]);\n if (indicator.showZones) {\n this.setSeriesRange(upperCollection, indicator, indicator.targetSeries[1]);\n this.setSeriesRange(lowerCollection, indicator, indicator.targetSeries[2]);\n }\n };\n /**\n * To destroy the RSI Indicator.\n * @return {void}\n * @private\n */\n RsiIndicator.prototype.destroy = function (chart) {\n /**\n * Destroys the RSI Indicator\n */\n };\n /**\n * Get module name.\n */\n RsiIndicator.prototype.getModuleName = function () {\n /**\n * Returns the module name of the indicator.\n */\n return 'RsiIndicator';\n };\n return RsiIndicator;\n}(TechnicalAnalysis));\nexport { RsiIndicator };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { Series } from '../series/chart-series';\nimport { TechnicalAnalysis } from './indicator-base';\n/**\n * `StochasticIndicator` module is used to render stochastic indicator.\n */\nvar StochasticIndicator = /** @class */ (function (_super) {\n __extends(StochasticIndicator, _super);\n function StochasticIndicator() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Defines the collection of series that represents the stochastic indicator\n * @private\n */\n StochasticIndicator.prototype.initSeriesCollection = function (indicator, chart) {\n _super.prototype.initSeriesCollection.call(this, indicator, chart);\n var periodLine = new Series(indicator, 'targetSeries', {}, true);\n this.setSeriesProperties(periodLine, indicator, 'PeriodLine', indicator.periodLine.color, indicator.periodLine.width, chart);\n if (indicator.showZones) {\n var upperSeries = new Series(indicator, 'targetSeries', {}, true);\n this.setSeriesProperties(upperSeries, indicator, 'UpperLine', indicator.upperLine.color, indicator.upperLine.width, chart);\n var lowerSeries = new Series(indicator, 'targetSeries', {}, true);\n this.setSeriesProperties(lowerSeries, indicator, 'LowerLine', indicator.lowerLine.color, indicator.lowerLine.width, chart);\n }\n };\n /**\n * Defines the predictions based on stochastic approach\n * @private\n */\n StochasticIndicator.prototype.initDataSource = function (indicator, chart) {\n var signalCollection = [];\n var upperCollection = [];\n var lowerCollection = [];\n var periodCollection = [];\n var source = [];\n var sourceSeries = indicator.sourceSeries;\n var point = {};\n //prepare data\n var validData = indicator.points;\n if (validData.length && validData.length >= indicator.period) {\n if (indicator.showZones) {\n for (var i = 0; i < validData.length; i++) {\n upperCollection.push(this.getDataPoint(validData[i].x, indicator.overBought, validData[i], indicator.targetSeries[2], upperCollection.length));\n lowerCollection.push(this.getDataPoint(validData[i].x, indicator.overSold, validData[i], indicator.targetSeries[3], lowerCollection.length));\n }\n }\n source = this.calculatePeriod(indicator.period, indicator.kPeriod, validData, indicator.targetSeries[1]);\n periodCollection = this.smaCalculation(indicator.period, indicator.kPeriod, source, indicator.targetSeries[1]);\n signalCollection = this.smaCalculation(indicator.period + indicator.kPeriod - 1, indicator.dPeriod, source, indicator.targetSeries[0]);\n }\n this.setSeriesRange(signalCollection, indicator, indicator.targetSeries[0]);\n this.setSeriesRange(periodCollection, indicator, indicator.targetSeries[1]);\n if (indicator.showZones) {\n this.setSeriesRange(upperCollection, indicator, indicator.targetSeries[2]);\n this.setSeriesRange(lowerCollection, indicator, indicator.targetSeries[3]);\n }\n };\n /**\n * Calculates the SMA Values\n * @private\n */\n StochasticIndicator.prototype.smaCalculation = function (period, kPeriod, data, sourceSeries) {\n var pointCollection = [];\n if (data.length >= period + kPeriod) {\n var count = period + (kPeriod - 1);\n var temp = [];\n var values = [];\n for (var i = 0; i < data.length; i++) {\n var value = Number(data[i].y);\n temp.push(value);\n }\n var length_1 = temp.length;\n while (length_1 >= count) {\n var sum = 0;\n for (var i = period - 1; i < (period + kPeriod - 1); i++) {\n sum = sum + temp[i];\n }\n sum = sum / kPeriod;\n values.push(sum.toFixed(2));\n temp.splice(0, 1);\n length_1 = temp.length;\n }\n var len = count - 1;\n for (var i = 0; i < data.length; i++) {\n if (!(i < len)) {\n pointCollection.push(this.getDataPoint(data[i].x, Number(values[i - len]), data[i], sourceSeries, pointCollection.length));\n data[i].y = Number((values[i - len]));\n }\n }\n }\n return pointCollection;\n };\n /**\n * Calculates the period line values.\n * @private\n */\n StochasticIndicator.prototype.calculatePeriod = function (period, kPeriod, data, series) {\n var lowValues = [];\n var highValues = [];\n var closeValues = [];\n var modifiedSource = [];\n for (var j = 0; j < data.length; j++) {\n lowValues[j] = data[j].low;\n highValues[j] = data[j].high;\n closeValues[j] = data[j].close;\n }\n if (data.length > period) {\n var totalPeriod = period + kPeriod;\n var mins = [];\n var maxs = [];\n for (var i = 0; i < period - 1; ++i) {\n maxs.push(0);\n mins.push(0);\n modifiedSource.push(this.getDataPoint(data[i].x, data[i].close, data[i], series, modifiedSource.length));\n }\n for (var i = period - 1; i < data.length; ++i) {\n var min = Number.MAX_VALUE;\n var max = Number.MIN_VALUE;\n for (var j = 0; j < period; ++j) {\n min = Math.min(min, lowValues[i - j]);\n max = Math.max(max, highValues[i - j]);\n }\n maxs.push(max);\n mins.push(min);\n }\n for (var i = period - 1; i < data.length; ++i) {\n var top_1 = 0;\n var bottom = 0;\n top_1 += closeValues[i] - mins[i];\n bottom += maxs[i] - mins[i];\n modifiedSource.push(this.getDataPoint(data[i].x, (top_1 / bottom) * 100, data[i], series, modifiedSource.length));\n }\n }\n return modifiedSource;\n };\n /**\n * To destroy the Stocastic Indicator.\n * @return {void}\n * @private\n */\n StochasticIndicator.prototype.destroy = function (chart) {\n /**\n * Destroys the stochastic indicator\n */\n };\n /**\n * Get module name.\n */\n StochasticIndicator.prototype.getModuleName = function () {\n /**\n * Returns the module name of the indicator.\n */\n return 'StochasticIndicator';\n };\n return StochasticIndicator;\n}(TechnicalAnalysis));\nexport { StochasticIndicator };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { Series } from '../series/chart-series';\nimport { TechnicalAnalysis } from './indicator-base';\n/**\n * `BollingerBands` module is used to render bollinger band indicator.\n */\nvar BollingerBands = /** @class */ (function (_super) {\n __extends(BollingerBands, _super);\n function BollingerBands() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Initializes the series collection to represent bollinger band\n */\n BollingerBands.prototype.initSeriesCollection = function (indicator, chart) {\n indicator.targetSeries = [];\n var rangeArea = new Series(indicator, 'targetSeries', {}, true);\n rangeArea.type = 'RangeArea';\n if (indicator.bandColor !== 'transparent' && indicator.bandColor !== 'none') {\n this.setSeriesProperties(rangeArea, indicator, 'BollingerBand', indicator.bandColor, 0, chart);\n }\n var signalLine = new Series(indicator, 'targetSeries', {}, true);\n this.setSeriesProperties(signalLine, indicator, 'BollingerBand', indicator.fill, indicator.width, chart);\n var upperLine = new Series(indicator, 'targetSeries', {}, true);\n this.setSeriesProperties(upperLine, indicator, 'UpperLine', indicator.upperLine.color, indicator.upperLine.width, chart);\n var lowerLine = new Series(indicator, 'targetSeries', {}, true);\n this.setSeriesProperties(lowerLine, indicator, 'LowerLine', indicator.lowerLine.color, indicator.lowerLine.width, chart);\n };\n /**\n * Defines the predictions using Bollinger Band Approach\n * @private\n */\n BollingerBands.prototype.initDataSource = function (indicator, chart) {\n var enableBand = indicator.bandColor !== 'transparent' && indicator.bandColor !== 'none';\n var start = enableBand ? 1 : 0;\n var signalCollection = [];\n var upperCollection = [];\n var lowerCollection = [];\n var bandCollection = [];\n var upperSeries = indicator.targetSeries[start + 1];\n var lowerSeries = indicator.targetSeries[start + 2];\n var signalSeries = indicator.targetSeries[start];\n var rangeAreaSeries = enableBand ? indicator.targetSeries[0] : null;\n //prepare data\n var validData = indicator.points;\n if (validData.length && validData.length >= indicator.period) {\n var sum = 0;\n var deviationSum = 0;\n var multiplier = indicator.standardDeviation;\n var limit = validData.length;\n var length_1 = Math.round(indicator.period);\n var smaPoints = [];\n var deviations = [];\n var bollingerPoints = [];\n for (var i_1 = 0; i_1 < length_1; i_1++) {\n sum += Number(validData[i_1].close);\n }\n var sma = sum / indicator.period;\n for (var i_2 = 0; i_2 < limit; i_2++) {\n var y = Number(validData[i_2].close);\n if (i_2 >= length_1 - 1 && i_2 < limit) {\n if (i_2 - indicator.period >= 0) {\n var diff = y - Number(validData[i_2 - length_1].close);\n sum = sum + diff;\n sma = sum / (indicator.period);\n smaPoints[i_2] = sma;\n deviations[i_2] = Math.pow(y - sma, 2);\n deviationSum += deviations[i_2] - deviations[i_2 - length_1];\n }\n else {\n smaPoints[i_2] = sma;\n deviations[i_2] = Math.pow(y - sma, 2);\n deviationSum += deviations[i_2];\n }\n var range = Math.sqrt(deviationSum / (indicator.period));\n var lowerBand = smaPoints[i_2] - (multiplier * range);\n var upperBand = smaPoints[i_2] + (multiplier * range);\n if (i_2 + 1 === length_1) {\n for (var j_1 = 0; j_1 < length_1 - 1; j_1++) {\n bollingerPoints[j_1] = {\n 'X': validData[j_1].x, 'mb': smaPoints[i_2],\n 'lb': lowerBand, 'ub': upperBand, visible: true\n };\n }\n }\n bollingerPoints[i_2] = {\n 'X': validData[i_2].x, 'mb': smaPoints[i_2],\n 'lb': lowerBand, 'ub': upperBand, visible: true\n };\n }\n else {\n if (i_2 < indicator.period - 1) {\n smaPoints[i_2] = sma;\n deviations[i_2] = Math.pow(y - sma, 2);\n deviationSum += deviations[i_2];\n }\n }\n }\n var i = -1;\n var j = -1;\n for (var k = 0; k < limit; k++) {\n if (k >= (length_1 - 1)) {\n var ub = 'ub';\n var lb = 'lb';\n var mb = 'mb';\n upperCollection.push(this.getDataPoint(validData[k].x, bollingerPoints[k][ub], validData[k], upperSeries, upperCollection.length));\n lowerCollection.push(this.getDataPoint(validData[k].x, bollingerPoints[k][lb], validData[k], lowerSeries, lowerCollection.length));\n signalCollection.push(this.getDataPoint(validData[k].x, bollingerPoints[k][mb], validData[k], signalSeries, signalCollection.length));\n if (enableBand) {\n bandCollection.push(this.getRangePoint(validData[k].x, upperCollection[++i].y, lowerCollection[++j].y, validData[k], rangeAreaSeries, bandCollection.length));\n }\n }\n }\n }\n if (enableBand) {\n this.setSeriesRange(bandCollection, indicator, indicator.targetSeries[0]);\n }\n this.setSeriesRange(signalCollection, indicator, indicator.targetSeries[start]);\n this.setSeriesRange(upperCollection, indicator, indicator.targetSeries[start + 1]);\n this.setSeriesRange(lowerCollection, indicator, indicator.targetSeries[start + 2]);\n };\n /**\n * To destroy the Bollinger Band.\n * @return {void}\n * @private\n */\n BollingerBands.prototype.destroy = function (chart) {\n /**\n * Destroys the bollinger band\n */\n };\n /**\n * Get module name.\n */\n BollingerBands.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'BollingerBandsIndicator';\n };\n return BollingerBands;\n}(TechnicalAnalysis));\nexport { BollingerBands };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { Series } from '../series/chart-series';\nimport { TechnicalAnalysis } from './indicator-base';\n/**\n * `MacdIndicator` module is used to render MACD indicator.\n */\nvar MacdIndicator = /** @class */ (function (_super) {\n __extends(MacdIndicator, _super);\n function MacdIndicator() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Defines the collection of series to represent the MACD indicator\n * @private\n */\n MacdIndicator.prototype.initSeriesCollection = function (indicator, chart) {\n _super.prototype.initSeriesCollection.call(this, indicator, chart);\n if (indicator.macdType === 'Line' || indicator.macdType === 'Both') {\n var macdSeries = new Series(indicator, 'targetSeries', {}, true);\n this.setSeriesProperties(macdSeries, indicator, 'MacdLine', indicator.macdLine.color, indicator.macdLine.width, chart);\n }\n if (indicator.macdType === 'Histogram' || indicator.macdType === 'Both') {\n var histogramSeries = new Series(indicator, 'targetSeries', {}, true);\n histogramSeries.type = 'Column';\n this.setSeriesProperties(histogramSeries, indicator, 'Histogram', indicator.macdPositiveColor, indicator.width, chart);\n }\n };\n /**\n * Defines the predictions using MACD approach\n * @private\n */\n MacdIndicator.prototype.initDataSource = function (indicator, chart) {\n var signalCollection = [];\n var fastPeriod = indicator.fastPeriod;\n var slowPeriod = indicator.slowPeriod;\n var trigger = indicator.period;\n var length = fastPeriod + trigger;\n var macdCollection = [];\n var histogramCollection = [];\n var validData = indicator.points;\n var signalSeries = indicator.targetSeries[0];\n var histogramSeries;\n var macdLineSeries;\n if (indicator.macdType === 'Histogram') {\n histogramSeries = indicator.targetSeries[1];\n }\n else {\n macdLineSeries = indicator.targetSeries[1];\n if (indicator.macdType === 'Both') {\n histogramSeries = indicator.targetSeries[2];\n }\n }\n if (validData && length < validData.length && slowPeriod <= fastPeriod &&\n slowPeriod > 0 && (length - 2) >= 0) {\n var shortEMA = this.calculateEMAValues(slowPeriod, validData, 'close');\n var longEMA = this.calculateEMAValues(fastPeriod, validData, 'close');\n var macdValues = this.getMACDVales(indicator, shortEMA, longEMA);\n macdCollection = this.getMACDPoints(indicator, macdValues, validData, macdLineSeries || signalSeries);\n var signalEMA = this.calculateEMAValues(trigger, macdCollection, 'y');\n signalCollection = this.getSignalPoints(indicator, signalEMA, validData, signalSeries);\n if (histogramSeries) {\n histogramCollection = this.getHistogramPoints(indicator, macdValues, signalEMA, validData, histogramSeries);\n }\n }\n this.setSeriesRange(signalCollection, indicator, indicator.targetSeries[0]);\n if (histogramSeries) {\n this.setSeriesRange(histogramCollection, indicator, histogramSeries);\n }\n if (macdLineSeries) {\n this.setSeriesRange(macdCollection, indicator, macdLineSeries);\n }\n };\n /**\n * Calculates the EMA values for the given period\n */\n MacdIndicator.prototype.calculateEMAValues = function (period, validData, field) {\n var sum = 0;\n var initialEMA = 0;\n var emaValues = [];\n var emaPercent = (2 / (period + 1));\n for (var i = 0; i < period; i++) {\n sum += Number(validData[i][field]);\n }\n initialEMA = (sum / period);\n emaValues.push(initialEMA);\n var emaAvg = initialEMA;\n for (var j = period; j < validData.length; j++) {\n emaAvg = (Number(validData[j][field]) - emaAvg) * emaPercent + emaAvg;\n emaValues.push(emaAvg);\n }\n return emaValues;\n };\n /**\n * Defines the MACD Points\n */\n MacdIndicator.prototype.getMACDPoints = function (indicator, macdPoints, validData, series) {\n var macdCollection = [];\n var dataMACDIndex = indicator.fastPeriod - 1;\n var macdIndex = 0;\n while (dataMACDIndex < validData.length) {\n macdCollection.push(this.getDataPoint(validData[dataMACDIndex].x, macdPoints[macdIndex], validData[dataMACDIndex], series, macdCollection.length));\n dataMACDIndex++;\n macdIndex++;\n }\n return macdCollection;\n };\n /**\n * Calculates the signal points\n */\n MacdIndicator.prototype.getSignalPoints = function (indicator, signalEma, validData, series) {\n var dataSignalIndex = indicator.fastPeriod + indicator.period - 2;\n var signalIndex = 0;\n var signalCollection = [];\n while (dataSignalIndex < validData.length) {\n signalCollection.push(this.getDataPoint(validData[dataSignalIndex].x, signalEma[signalIndex], validData[dataSignalIndex], series, signalCollection.length));\n dataSignalIndex++;\n signalIndex++;\n }\n return signalCollection;\n };\n /**\n * Calculates the MACD values\n */\n MacdIndicator.prototype.getMACDVales = function (indicator, shortEma, longEma) {\n var macdPoints = [];\n var diff = indicator.fastPeriod - indicator.slowPeriod;\n for (var i = 0; i < longEma.length; i++) {\n macdPoints.push((shortEma[i + diff] - longEma[i]));\n }\n return macdPoints;\n };\n /**\n * Calculates the Histogram Points\n */\n MacdIndicator.prototype.getHistogramPoints = function (indicator, macdPoints, signalEma, validData, series) {\n var dataHistogramIndex = indicator.fastPeriod + indicator.period - 2;\n var histogramIndex = 0;\n var histogramCollection = [];\n while (dataHistogramIndex < validData.length) {\n histogramCollection.push(this.getDataPoint(validData[dataHistogramIndex].x, macdPoints[histogramIndex + (indicator.period - 1)] - signalEma[histogramIndex], validData[dataHistogramIndex], series, histogramCollection.length, indicator));\n dataHistogramIndex++;\n histogramIndex++;\n }\n return histogramCollection;\n };\n /**\n * To destroy the MACD Indicator.\n * @return {void}\n * @private\n */\n MacdIndicator.prototype.destroy = function (chart) {\n /**\n * Destroys the MACD indicator\n */\n };\n /**\n * Get module name.\n */\n MacdIndicator.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'MacdIndicator';\n };\n return MacdIndicator;\n}(TechnicalAnalysis));\nexport { MacdIndicator };\n","import { Series, Points } from '../series/chart-series';\nimport { findClipRect, RectOption } from '../../common/utils/helper';\n/**\n * `Trendline` module is used to render 6 types of trendlines in chart.\n */\nvar Trendlines = /** @class */ (function () {\n function Trendlines() {\n }\n /**\n * Defines the collection of series, that are used to represent a trendline\n * @private\n */\n Trendlines.prototype.initSeriesCollection = function (trendline, chart) {\n var trendLineSeries = new Series(trendline, 'targetSeries', {}, true);\n if (trendline.type === 'Linear' || trendline.type === 'MovingAverage') {\n trendLineSeries.type = 'Line';\n }\n else {\n trendLineSeries.type = 'Spline';\n }\n this.setSeriesProperties(trendLineSeries, trendline, trendline.type, trendline.fill, trendline.width, chart);\n };\n /**\n * Initializes the properties of the trendline series\n */\n Trendlines.prototype.setSeriesProperties = function (series, trendline, name, fill, width, chart) {\n series.name = trendline.name;\n series.xName = 'x';\n series.yName = 'y';\n series.fill = fill || 'blue';\n series.width = width;\n series.clipRectElement = trendline.clipRectElement;\n series.points = [];\n series.enableTooltip = trendline.enableTooltip;\n series.index = trendline.index;\n series.sourceIndex = trendline.sourceIndex;\n series.interior = series.fill;\n series.animation = trendline.animation;\n series.legendShape = 'HorizontalLine';\n series.marker = trendline.marker;\n series.category = 'TrendLine';\n series.chart = chart;\n series.xMin = Infinity;\n series.xMax = -Infinity;\n series.yMin = Infinity;\n series.yMax = -Infinity;\n series.xData = [];\n series.yData = [];\n trendline.targetSeries = series;\n };\n /**\n * Creates the elements of a trendline\n */\n Trendlines.prototype.createTrendLineElements = function (chart, trendline, index, element, clipRectElement) {\n trendline.trendLineElement = element;\n trendline.targetSeries.clipRectElement = clipRectElement;\n trendline.targetSeries.seriesElement = element;\n chart.trendLineElements.appendChild(trendline.trendLineElement);\n };\n /**\n * Defines the data point of trendline\n */\n Trendlines.prototype.getDataPoint = function (x, y, sourcePoint, series, index) {\n var trendPoint = new Points();\n trendPoint.x = series.xAxis.valueType === 'DateTime' ? new Date(Number(x)) : x;\n trendPoint.y = y;\n trendPoint.xValue = Number(x);\n trendPoint.color = series.fill;\n trendPoint.index = index;\n trendPoint.yValue = Number(y);\n trendPoint.visible = true;\n series.xMin = Math.min(series.xMin, trendPoint.xValue);\n series.yMin = Math.min(series.yMin, trendPoint.yValue);\n series.xMax = Math.max(series.xMax, trendPoint.xValue);\n series.yMax = Math.max(series.yMax, trendPoint.yValue);\n series.xData.push(trendPoint.xValue);\n return trendPoint;\n };\n /**\n * Finds the slope and intercept of trendline\n */\n Trendlines.prototype.findSlopeIntercept = function (xValues, yValues, trendline, points) {\n var xAvg = 0;\n var yAvg = 0;\n var xyAvg = 0;\n var xxAvg = 0;\n var yyAvg = 0;\n var index = 0;\n var slope = 0;\n var intercept = 0;\n while (index < points.length) {\n // To fix trendline not rendered issue while Nan Value is provided for y values.\n if (isNaN(yValues[index])) {\n yValues[index] = ((yValues[index - 1] + yValues[index + 1]) / 2);\n }\n xAvg += xValues[index];\n yAvg += yValues[index];\n xyAvg += xValues[index] * yValues[index];\n xxAvg += xValues[index] * xValues[index];\n yyAvg += yValues[index] * yValues[index];\n index++;\n }\n var type = trendline.type;\n if (trendline.intercept && (type === 'Linear' || type === 'Exponential')) {\n intercept = trendline.intercept;\n switch (type) {\n case 'Linear':\n slope = ((xyAvg) - (trendline.intercept * xAvg)) / xxAvg;\n break;\n case 'Exponential':\n slope = ((xyAvg) - (Math.log(Math.abs(trendline.intercept)) * xAvg)) / xxAvg;\n break;\n }\n }\n else {\n slope = ((points.length * xyAvg) - (xAvg * yAvg)) / ((points.length * xxAvg) - (xAvg * xAvg));\n if (type === 'Exponential' || type === 'Power') {\n intercept = Math.exp((yAvg - (slope * xAvg)) / points.length);\n }\n else {\n intercept = (yAvg - (slope * xAvg)) / points.length;\n }\n }\n return { slope: slope, intercept: intercept };\n };\n /**\n * Defines the points to draw the trendlines\n */\n Trendlines.prototype.initDataSource = function (trendline, chart) {\n var points = trendline.points;\n if (points && points.length) {\n //prepare data\n var trendlineSeries = trendline.targetSeries;\n switch (trendline.type) {\n case 'Linear':\n this.setLinearRange(points, trendline, trendlineSeries);\n break;\n case 'Exponential':\n this.setExponentialRange(points, trendline, trendlineSeries);\n break;\n case 'MovingAverage':\n this.setMovingAverageRange(points, trendline, trendlineSeries);\n break;\n case 'Polynomial':\n this.setPolynomialRange(points, trendline, trendlineSeries);\n break;\n case 'Power':\n this.setPowerRange(points, trendline, trendlineSeries);\n break;\n case 'Logarithmic':\n this.setLogarithmicRange(points, trendline, trendlineSeries);\n break;\n }\n if (trendline.type !== 'Linear' && trendline.type !== 'MovingAverage') {\n trendlineSeries.chart.splineSeriesModule.findSplinePoint(trendlineSeries);\n }\n }\n };\n /**\n * Calculation of exponential points\n */\n Trendlines.prototype.setExponentialRange = function (points, trendline, series) {\n var xValue = [];\n var yValue = [];\n var index = 0;\n var slopeIntercept;\n while (index < points.length) {\n var point = points[index];\n xValue.push(point.xValue);\n yValue.push(Math.log(point.yValue));\n index++;\n }\n slopeIntercept = this.findSlopeIntercept(xValue, yValue, trendline, points);\n series.points = this.getExponentialPoints(trendline, points, xValue, yValue, series, slopeIntercept);\n };\n /**\n * Calculation of logarithmic points\n */\n Trendlines.prototype.setLogarithmicRange = function (points, trendline, series) {\n var xLogValue = [];\n var yLogValue = [];\n var xPointsLgr = [];\n var slopeIntercept;\n var index = 0;\n while (index < points.length) {\n var point = points[index];\n xPointsLgr.push(point.xValue);\n xLogValue.push(Math.log(point.xValue));\n yLogValue.push(point.yValue);\n index++;\n }\n slopeIntercept = this.findSlopeIntercept(xLogValue, yLogValue, trendline, points);\n series.points = this.getLogarithmicPoints(trendline, points, xPointsLgr, yLogValue, series, slopeIntercept);\n };\n /**\n * Calculation of polynomial points\n */\n Trendlines.prototype.setPolynomialRange = function (points, trendline, series) {\n var xPolyValues = [];\n var yPolyValues = [];\n var index = 0;\n while (index < points.length) {\n var point = points[index];\n xPolyValues.push(point.xValue);\n yPolyValues.push(point.yValue);\n index++;\n }\n series.points = this.getPolynomialPoints(trendline, points, xPolyValues, yPolyValues, series);\n };\n /**\n * Calculation of power points\n */\n Trendlines.prototype.setPowerRange = function (points, trendline, series) {\n var xValues = [];\n var yValues = [];\n var powerPoints = [];\n var slopeIntercept;\n var index = 0;\n while (index < points.length) {\n var point = points[index];\n powerPoints.push(point.xValue);\n xValues.push(Math.log(point.xValue));\n yValues.push(Math.log(point.yValue));\n index++;\n }\n slopeIntercept = this.findSlopeIntercept(xValues, yValues, trendline, points);\n series.points = this.getPowerPoints(trendline, points, powerPoints, yValues, series, slopeIntercept);\n };\n /**\n * Calculation of linear points\n */\n Trendlines.prototype.setLinearRange = function (points, trendline, series) {\n var xValues = [];\n var yValues = [];\n var slopeIntercept;\n var index = 0;\n while (index < points.length) {\n var point = points[index];\n xValues.push(point.xValue);\n yValues.push(point.yValue);\n index++;\n }\n slopeIntercept = this.findSlopeIntercept(xValues, yValues, trendline, points);\n series.points = this.getLinearPoints(trendline, points, xValues, yValues, series, slopeIntercept);\n };\n /**\n * Calculation of moving average points\n */\n Trendlines.prototype.setMovingAverageRange = function (points, trendline, series) {\n var xValues = [];\n var yValues = [];\n var xAvgValues = [];\n var index = 0;\n while (index < points.length) {\n var point = points[index];\n xAvgValues.push(point.xValue);\n xValues.push(index + 1);\n yValues.push(point.yValue);\n index++;\n }\n series.points = this.getMovingAveragePoints(trendline, points, xAvgValues, yValues, series);\n };\n /**\n * Calculation of logarithmic points\n */\n Trendlines.prototype.getLogarithmicPoints = function (trendline, points, xValues, yValues, series, slopeInterceptLog) {\n var midPoint = Math.round((points.length / 2));\n var pts = [];\n var x1Log = xValues[0] - trendline.backwardForecast;\n var y1Log = slopeInterceptLog.intercept + (slopeInterceptLog.slope * Math.log(x1Log));\n var x2Log = xValues[midPoint - 1];\n var y2Log = slopeInterceptLog.intercept + (slopeInterceptLog.slope * Math.log(x2Log));\n var x3Log = xValues[xValues.length - 1] + trendline.forwardForecast;\n var y3Log = slopeInterceptLog.intercept + (slopeInterceptLog.slope * Math.log(x3Log));\n pts.push(this.getDataPoint(x1Log, y1Log, points[0], series, pts.length));\n pts.push(this.getDataPoint(x2Log, y2Log, points[midPoint - 1], series, pts.length));\n pts.push(this.getDataPoint(x3Log, y3Log, points[points.length - 1], series, pts.length));\n return pts;\n };\n /**\n * Defines the points based on data point\n */\n Trendlines.prototype.getPowerPoints = function (trendline, points, xValues, yValues, series, slopeInterceptPower) {\n var midPoint = Math.round((points.length / 2));\n var pts = [];\n var x1 = xValues[0] - trendline.backwardForecast;\n x1 = x1 > -1 ? x1 : 0;\n var y1 = slopeInterceptPower.intercept * Math.pow(x1, slopeInterceptPower.slope);\n var x2 = xValues[midPoint - 1];\n var y2 = slopeInterceptPower.intercept * Math.pow(x2, slopeInterceptPower.slope);\n var x3 = xValues[xValues.length - 1] + trendline.forwardForecast;\n var y3 = slopeInterceptPower.intercept * Math.pow(x3, slopeInterceptPower.slope);\n pts.push(this.getDataPoint(x1, y1, points[0], series, pts.length));\n pts.push(this.getDataPoint(x2, y2, points[midPoint - 1], series, pts.length));\n pts.push(this.getDataPoint(x3, y3, points[points.length - 1], series, pts.length));\n return pts;\n };\n /**\n * Get the polynomial points based on polynomial slopes\n */\n Trendlines.prototype.getPolynomialPoints = function (trendline, points, xValues, yValues, series) {\n var midPoint = Math.round((points.length / 2));\n var pts = [];\n var polynomialOrder = points.length <= trendline.polynomialOrder ? points.length : trendline.polynomialOrder;\n polynomialOrder = Math.max(2, polynomialOrder);\n polynomialOrder = Math.min(6, polynomialOrder);\n trendline.polynomialOrder = polynomialOrder;\n trendline.polynomialSlopes = [];\n trendline.polynomialSlopes.length = trendline.polynomialOrder + 1;\n var index = 0;\n while (index < xValues.length) {\n var xVal = xValues[index];\n var yVal = yValues[index];\n var subIndex = 0;\n while (subIndex <= trendline.polynomialOrder) {\n if (!trendline.polynomialSlopes[subIndex]) {\n trendline.polynomialSlopes[subIndex] = 0;\n }\n trendline.polynomialSlopes[subIndex] += Math.pow(xVal, subIndex) * yVal;\n ++subIndex;\n }\n index++;\n }\n var numArray = [];\n numArray.length = 1 + 2 * trendline.polynomialOrder;\n var matrix = [];\n matrix.length = trendline.polynomialOrder + 1;\n var newIndex = 0;\n while (newIndex < (trendline.polynomialOrder + 1)) {\n matrix[newIndex] = [];\n matrix[newIndex].length = 3;\n newIndex++;\n }\n var nIndex = 0;\n var num1 = 0;\n while (nIndex < xValues.length) {\n var d = xValues[nIndex];\n var num2 = 1.0;\n var nIndex2 = 0;\n while (nIndex2 < numArray.length) {\n if (!numArray[nIndex2]) {\n numArray[nIndex2] = 0;\n }\n numArray[nIndex2] += num2;\n num2 *= d;\n ++num1;\n ++nIndex2;\n }\n ++nIndex;\n }\n var nnIndex = 0;\n while (nnIndex <= trendline.polynomialOrder) {\n var nnIndex2 = 0;\n while (nnIndex2 <= trendline.polynomialOrder) {\n matrix[nnIndex][nnIndex2] = numArray[nnIndex + nnIndex2];\n ++nnIndex2;\n }\n ++nnIndex;\n }\n if (!this.gaussJordanElimination(matrix, trendline.polynomialSlopes)) {\n trendline.polynomialSlopes = null;\n }\n pts = this.getPoints(trendline, points, xValues, yValues, series);\n return pts;\n };\n /**\n * Defines the moving average points\n */\n Trendlines.prototype.getMovingAveragePoints = function (trendline, points, xValues, yValues, series) {\n var pts = [];\n var period = trendline.period >= points.length ? points.length - 1 : trendline.period;\n period = Math.max(2, period);\n var index = 0;\n var y;\n var x;\n var count;\n var nullCount;\n while (index < points.length - 1) {\n y = count = nullCount = 0;\n for (var j = index; count < period; j++) {\n count++;\n if (!yValues[j]) {\n nullCount++;\n }\n y += yValues[j];\n }\n y = period - nullCount <= 0 ? null : y / (period - nullCount);\n if (y && !isNaN(y)) {\n x = xValues[period - 1 + index];\n pts.push(this.getDataPoint(x, y, points[period - 1 + index], series, pts.length));\n }\n index++;\n }\n return pts;\n };\n /**\n * Defines the linear points\n */\n Trendlines.prototype.getLinearPoints = function (trendline, points, xValues, yValues, series, slopeInterceptLinear) {\n var pts = [];\n var x1Linear = xValues[0] - trendline.backwardForecast;\n var y1Linear = slopeInterceptLinear.slope * x1Linear + slopeInterceptLinear.intercept;\n var x2Linear = xValues[xValues.length - 1] + trendline.forwardForecast;\n var y2Linear = slopeInterceptLinear.slope * x2Linear + slopeInterceptLinear.intercept;\n pts.push(this.getDataPoint(x1Linear, y1Linear, points[0], series, pts.length));\n pts.push(this.getDataPoint(x2Linear, y2Linear, points[points.length - 1], series, pts.length));\n return pts;\n };\n /**\n * Defines the exponential points\n */\n Trendlines.prototype.getExponentialPoints = function (trendline, points, xValues, yValues, series, slopeInterceptExp) {\n var midPoint = Math.round((points.length / 2));\n var ptsExp = [];\n var x1 = xValues[0] - trendline.backwardForecast;\n var y1 = slopeInterceptExp.intercept * Math.exp(slopeInterceptExp.slope * x1);\n var x2 = xValues[midPoint - 1];\n var y2 = slopeInterceptExp.intercept * Math.exp(slopeInterceptExp.slope * x2);\n var x3 = xValues[xValues.length - 1] + trendline.forwardForecast;\n var y3 = slopeInterceptExp.intercept * Math.exp(slopeInterceptExp.slope * x3);\n ptsExp.push(this.getDataPoint(x1, y1, points[0], series, ptsExp.length));\n ptsExp.push(this.getDataPoint(x2, y2, points[midPoint - 1], series, ptsExp.length));\n ptsExp.push(this.getDataPoint(x3, y3, points[points.length - 1], series, ptsExp.length));\n return ptsExp;\n };\n /**\n * Defines the points based on data point\n */\n Trendlines.prototype.getPoints = function (trendline, points, xValues, yValues, series) {\n var midPoint = Math.round((points.length / 2));\n var polynomialSlopes = trendline.polynomialSlopes;\n var pts = [];\n var x1 = 1;\n var index = 1;\n var xValue;\n var yValue;\n while (index <= polynomialSlopes.length) {\n if (index === 1) {\n xValue = xValues[0] - trendline.backwardForecast;\n yValue = this.getPolynomialYValue(polynomialSlopes, xValue);\n pts.push(this.getDataPoint(xValue, yValue, points[0], series, pts.length));\n }\n else if (index === polynomialSlopes.length) {\n xValue = xValues[points.length - 1] + trendline.forwardForecast;\n yValue = this.getPolynomialYValue(polynomialSlopes, xValue);\n pts.push(this.getDataPoint(xValue, yValue, points[points.length - 1], series, pts.length));\n }\n else {\n x1 += (points.length + trendline.forwardForecast) / polynomialSlopes.length;\n xValue = xValues[parseInt(x1.toString(), 10) - 1];\n yValue = this.getPolynomialYValue(polynomialSlopes, xValue);\n pts.push(this.getDataPoint(xValue, yValue, points[parseInt(x1.toString(), 10) - 1], series, pts.length));\n }\n index++;\n }\n return pts;\n };\n /**\n * Defines the polynomial value of y\n */\n Trendlines.prototype.getPolynomialYValue = function (slopes, x) {\n var sum = 0;\n var index = 0;\n while (index < slopes.length) {\n sum += slopes[index] * Math.pow(x, index);\n index++;\n }\n return sum;\n };\n /**\n * Defines the gauss jordan elimination\n */\n Trendlines.prototype.gaussJordanElimination = function (matrix, polynomialSlopes) {\n var length = matrix.length;\n var numArray1 = [];\n var numArray2 = [];\n var numArray3 = [];\n numArray1.length = length;\n numArray2.length = length;\n numArray3.length = length;\n var index = 0;\n while (index < length) {\n numArray3[index] = 0;\n ++index;\n }\n var index1 = 0;\n while (index1 < length) {\n var num1 = 0;\n var index2 = 0;\n var index3 = 0;\n var index4 = 0;\n while (index4 < length) {\n if (numArray3[index4] !== 1) {\n var index5 = 0;\n while (index5 < length) {\n if (numArray3[index5] === 0 && Math.abs(matrix[index4][index5]) >= num1) {\n num1 = Math.abs(matrix[index4][index5]);\n index2 = index4;\n index3 = index5;\n }\n ++index5;\n }\n }\n ++index4;\n }\n ++numArray3[index3];\n if (index2 !== index3) {\n var index4_1 = 0;\n while (index4_1 < length) {\n var num2 = matrix[index2][index4_1];\n matrix[index2][index4_1] = matrix[index3][index4_1];\n matrix[index3][index4_1] = num2;\n ++index4_1;\n }\n var num3 = polynomialSlopes[index2];\n polynomialSlopes[index2] = polynomialSlopes[index3];\n polynomialSlopes[index3] = num3;\n }\n numArray2[index1] = index2;\n numArray1[index1] = index3;\n if (matrix[index3][index3] === 0.0) {\n return false;\n }\n var num4 = 1.0 / matrix[index3][index3];\n matrix[index3][index3] = 1.0;\n var iindex4 = 0;\n while (iindex4 < length) {\n matrix[index3][iindex4] *= num4;\n ++iindex4;\n }\n polynomialSlopes[index3] *= num4;\n var iandex4 = 0;\n while (iandex4 < length) {\n if (iandex4 !== index3) {\n var num2 = matrix[iandex4][index3];\n matrix[iandex4][index3] = 0.0;\n var index5 = 0;\n while (index5 < length) {\n matrix[iandex4][index5] -= matrix[index3][index5] * num2;\n ++index5;\n }\n polynomialSlopes[iandex4] -= polynomialSlopes[index3] * num2;\n }\n ++iandex4;\n }\n ++index1;\n }\n var iindex1 = length - 1;\n while (iindex1 >= 0) {\n if (numArray2[iindex1] !== numArray1[iindex1]) {\n var iindex2 = 0;\n while (iindex2 < length) {\n var num = matrix[iindex2][numArray2[iindex1]];\n matrix[iindex2][numArray2[iindex1]] = matrix[iindex2][numArray1[iindex1]];\n matrix[iindex2][numArray1[iindex1]] = num;\n ++iindex2;\n }\n }\n --iindex1;\n }\n return true;\n };\n /**\n * Defines the trendline elements\n */\n Trendlines.prototype.getTrendLineElements = function (series, chart) {\n findClipRect(series);\n var clipRect = series.clipRect;\n var clipRectElement = chart.renderer.drawClipPath(new RectOption(chart.element.id + '_ChartTrendlineClipRect_' + series.index, 'transparent', { width: 1, color: 'Gray' }, 1, {\n x: 0, y: 0, width: clipRect.width,\n height: clipRect.height,\n }));\n var element;\n element = chart.renderer.createGroup({\n 'id': chart.element.id + 'TrendlineSeriesGroup' + series.index,\n 'transform': 'translate(' + clipRect.x + ',' + clipRect.y + ')',\n 'clip-path': 'url(#' + chart.element.id + '_ChartTrendlineClipRect_' + series.index + ')'\n });\n //defines the clip rect element\n element.appendChild(clipRectElement);\n for (var _i = 0, _a = series.trendlines; _i < _a.length; _i++) {\n var trendline = _a[_i];\n this.createTrendLineElements(chart, trendline, trendline.index, element, clipRectElement);\n }\n };\n /**\n * To destroy the trendline\n */\n Trendlines.prototype.destroy = function (chart) {\n /**\n * Destroys the Linear Trendline\n */\n };\n /**\n * Get module name\n */\n Trendlines.prototype.getModuleName = function () {\n /**\n * Returns the module name of the series\n */\n return 'TrendLine';\n };\n return Trendlines;\n}());\nexport { Trendlines };\n","import { Animation, Browser } from '@syncfusion/ej2-base';\nimport { textElement, getValueXByPoint, stopTimer, getValueYByPoint, ChartLocation, withInBounds, removeElement } from '../../common/utils/helper';\nimport { PathOption, Rect, TextOption, findDirection, measureText } from '@syncfusion/ej2-svg-base';\n/**\n * `Crosshair` module is used to render the crosshair for chart.\n */\nvar Crosshair = /** @class */ (function () {\n /**\n * Constructor for crosshair module.\n * @private\n */\n function Crosshair(chart) {\n this.arrowLocation = new ChartLocation(0, 0);\n this.rx = 2;\n this.ry = 2;\n this.chart = chart;\n this.elementID = this.chart.element.id;\n this.addEventListener();\n }\n /**\n * @hidden\n */\n Crosshair.prototype.addEventListener = function () {\n if (this.chart.isDestroyed) {\n return;\n }\n var cancelEvent = Browser.isPointer ? 'pointerleave' : 'mouseleave';\n this.chart.on(Browser.touchMoveEvent, this.mouseMoveHandler, this);\n this.chart.on(Browser.touchEndEvent, this.mouseUpHandler, this);\n this.chart.on(cancelEvent, this.mouseLeaveHandler, this);\n this.chart.on('tapHold', this.longPress, this);\n };\n Crosshair.prototype.mouseUpHandler = function () {\n if (this.chart.startMove) {\n this.removeCrosshair(2000);\n }\n };\n Crosshair.prototype.mouseLeaveHandler = function () {\n this.removeCrosshair(1000);\n };\n Crosshair.prototype.mouseMoveHandler = function (event) {\n var chart = this.chart;\n if (event.type === 'touchmove' && (Browser.isIos || Browser.isIos7) && chart.startMove && event.preventDefault) {\n event.preventDefault();\n }\n // Tooltip for chart series.\n if (!chart.disableTrackTooltip) {\n if (withInBounds(chart.mouseX, chart.mouseY, chart.chartAxisLayoutPanel.seriesClipRect)) {\n if (chart.startMove || !chart.isTouch) {\n this.crosshair();\n }\n }\n else {\n this.removeCrosshair(1000);\n }\n }\n };\n /**\n * Handles the long press on chart.\n * @return {boolean}\n * @private\n */\n Crosshair.prototype.longPress = function () {\n var chart = this.chart;\n if (withInBounds(chart.mouseX, chart.mouseY, chart.chartAxisLayoutPanel.seriesClipRect)) {\n this.crosshair();\n }\n return false;\n };\n /**\n * Renders the crosshair.\n * @return {void}\n */\n Crosshair.prototype.crosshair = function () {\n var chart = this.chart;\n var horizontalCross = '';\n var verticalCross = '';\n var options;\n var crosshair = chart.crosshair;\n var chartRect = chart.chartAxisLayoutPanel.seriesClipRect;\n var crossGroup = document.getElementById(this.elementID + '_UserInteraction');\n this.stopAnimation();\n if (chart.tooltip.enable && !withInBounds(chart.tooltipModule.valueX, chart.tooltipModule.valueY, chartRect)) {\n return null;\n }\n if (chart.stockChart && chart.stockChart.onPanning) {\n this.removeCrosshair(1000);\n return null;\n }\n this.valueX = chart.tooltip.enable ? chart.tooltipModule.valueX : chart.mouseX;\n this.valueY = chart.tooltip.enable ? chart.tooltipModule.valueY : chart.mouseY;\n crossGroup.setAttribute('opacity', '1');\n if (crosshair.lineType === 'Both' || crosshair.lineType === 'Horizontal') {\n horizontalCross += 'M ' + chartRect.x + ' ' + this.valueY +\n ' L ' + (chartRect.x + chartRect.width) + ' ' + this.valueY;\n }\n if (crosshair.lineType === 'Both' || crosshair.lineType === 'Vertical') {\n verticalCross += 'M ' + this.valueX + ' ' + chartRect.y +\n ' L ' + this.valueX + ' ' + (chartRect.y + chartRect.height);\n }\n if (crossGroup.childNodes.length === 0) {\n var axisTooltipGroup = chart.renderer.createGroup({ 'id': this.elementID + '_crosshair_axis' });\n options = new PathOption(this.elementID + '_HorizontalLine', 'none', crosshair.line.width, crosshair.line.color || chart.themeStyle.crosshairLine, 1, crosshair.dashArray, horizontalCross);\n this.renderCrosshairLine(options, crossGroup);\n options.d = verticalCross;\n options.id = this.elementID + '_VerticalLine';\n this.renderCrosshairLine(options, crossGroup);\n crossGroup.appendChild(axisTooltipGroup);\n this.renderAxisTooltip(chart, chartRect, crossGroup.lastChild);\n }\n else {\n document.getElementById(this.elementID + '_HorizontalLine').setAttribute('d', horizontalCross);\n document.getElementById(this.elementID + '_VerticalLine').setAttribute('d', verticalCross);\n this.renderAxisTooltip(chart, chartRect, crossGroup.lastChild);\n }\n };\n Crosshair.prototype.renderCrosshairLine = function (options, crossGroup) {\n var htmlObject = this.chart.renderer.drawPath(options);\n crossGroup.appendChild(htmlObject);\n };\n Crosshair.prototype.renderAxisTooltip = function (chart, chartRect, axisGroup) {\n var axis;\n var text;\n var rect;\n var pathElement;\n var textElem;\n var options;\n var padding = 5;\n var direction;\n var axisRect;\n for (var k = 0, length_1 = chart.axisCollections.length; k < length_1; k++) {\n axis = chart.axisCollections[k];\n axisRect = !axis.placeNextToAxisLine ? axis.rect : axis.updatedRect;\n if (axis.crosshairTooltip.enable) {\n if ((this.valueX <= (axisRect.x + axisRect.width) && axisRect.x <= this.valueX) ||\n (this.valueY <= (axisRect.y + axisRect.height) && axisRect.y <= this.valueY)) {\n pathElement = document.getElementById(this.elementID + '_axis_tooltip_' + k);\n textElem = document.getElementById(this.elementID + '_axis_tooltip_text_' + k);\n text = this.getAxisText(axis);\n if (!text) {\n continue;\n }\n rect = this.tooltipLocation(text, axis, chartRect, axisRect);\n if (pathElement === null) {\n pathElement = chart.renderer.drawPath({\n 'id': this.elementID + '_axis_tooltip_' + k,\n 'fill': axis.crosshairTooltip.fill || chart.themeStyle.crosshairFill\n });\n axisGroup.appendChild(pathElement);\n options = new TextOption(this.elementID + '_axis_tooltip_text_' + k, 0, 0, 'start', text);\n textElem = textElement(options, axis.crosshairTooltip.textStyle, axis.crosshairTooltip.textStyle.color || chart.themeStyle.crosshairLabel, axisGroup);\n }\n direction = findDirection(this.rx, this.ry, rect, this.arrowLocation, 10, this.isTop, this.isBottom, this.isLeft, this.valueX, this.valueY);\n pathElement.setAttribute('d', direction);\n textElem.textContent = text;\n textElem.setAttribute('x', (rect.x + padding).toString());\n textElem.setAttribute('y', (rect.y + padding + 3 * this.elementSize.height / 4).toString());\n }\n else {\n removeElement(this.elementID + '_axis_tooltip_' + k);\n removeElement(this.elementID + '_axis_tooltip_text_' + k);\n }\n }\n }\n };\n Crosshair.prototype.getAxisText = function (axis) {\n var value;\n this.isBottom = false;\n this.isTop = false;\n this.isLeft = false;\n this.isRight = false;\n var labelValue = (axis.valueType === 'Category' && axis.labelPlacement === 'BetweenTicks')\n ? 0.5 : 0;\n if (axis.orientation === 'Horizontal') {\n value = getValueXByPoint(Math.abs(this.valueX - axis.rect.x), axis.rect.width, axis) + labelValue;\n this.isBottom = !axis.opposedPosition;\n this.isTop = axis.opposedPosition;\n }\n else {\n value = getValueYByPoint(Math.abs(this.valueY - axis.rect.y), axis.rect.height, axis) + labelValue;\n this.isRight = axis.opposedPosition;\n this.isLeft = !axis.opposedPosition;\n }\n if (axis.valueType === 'DateTime') {\n return axis.format(new Date(value));\n }\n else if (axis.valueType === 'Category') {\n return axis.labels[Math.floor(value)];\n }\n else if (axis.valueType === 'Logarithmic') {\n return value = axis.format(Math.pow(axis.logBase, value));\n }\n else {\n var customLabelFormat = axis.labelFormat && axis.labelFormat.match('{value}') !== null;\n return customLabelFormat ? axis.labelFormat.replace('{value}', axis.format(value)) : axis.format(value);\n }\n };\n Crosshair.prototype.tooltipLocation = function (text, axis, bounds, axisRect) {\n var isBottom = false;\n var isLeft = false;\n var padding = 5;\n var arrowPadding = 10;\n var tooltipRect;\n var boundsX = bounds.x;\n var boundsY = bounds.y;\n var islabelInside = axis.labelPosition === 'Inside';\n var scrollBarHeight = axis.scrollbarSettings.enable || (axis.zoomingScrollBar && axis.zoomingScrollBar.svgObject)\n ? axis.scrollBarHeight : 0;\n this.elementSize = measureText(text, axis.crosshairTooltip.textStyle);\n if (axis.orientation === 'Horizontal') {\n var yLocation = islabelInside ? axisRect.y - this.elementSize.height - (padding * 2 + arrowPadding) :\n axisRect.y + scrollBarHeight;\n var height = islabelInside ? axisRect.y - this.elementSize.height - arrowPadding : axisRect.y + arrowPadding;\n this.arrowLocation = new ChartLocation(this.valueX, yLocation);\n tooltipRect = new Rect((this.valueX - (this.elementSize.width / 2) - padding), height + (!islabelInside ? scrollBarHeight : 0), this.elementSize.width + padding * 2, this.elementSize.height + padding * 2);\n if (axis.opposedPosition) {\n tooltipRect.y = islabelInside ? axisRect.y : axisRect.y -\n (this.elementSize.height + padding * 2 + arrowPadding) - scrollBarHeight;\n }\n if (tooltipRect.x < boundsX) {\n tooltipRect.x = boundsX;\n }\n if (tooltipRect.x + tooltipRect.width > boundsX + bounds.width) {\n tooltipRect.x -= ((tooltipRect.x + tooltipRect.width) - (boundsX + bounds.width));\n }\n if (this.arrowLocation.x + arrowPadding / 2 > tooltipRect.x + tooltipRect.width - this.rx) {\n this.arrowLocation.x = tooltipRect.x + tooltipRect.width - this.rx - arrowPadding / 2;\n }\n if (this.arrowLocation.x - arrowPadding / 2 < tooltipRect.x + this.rx) {\n this.arrowLocation.x = tooltipRect.x + this.rx + arrowPadding / 2;\n }\n }\n else {\n scrollBarHeight = scrollBarHeight * (axis.opposedPosition ? 1 : -1);\n this.arrowLocation = new ChartLocation(axisRect.x, this.valueY);\n var width = islabelInside ? axisRect.x - scrollBarHeight :\n axisRect.x - (this.elementSize.width) - (padding * 2 + arrowPadding);\n tooltipRect = new Rect(width + scrollBarHeight, this.valueY - (this.elementSize.height / 2) - padding, this.elementSize.width + (padding * 2), this.elementSize.height + padding * 2);\n if (axis.opposedPosition) {\n tooltipRect.x = islabelInside ? axisRect.x - this.elementSize.width - arrowPadding :\n axisRect.x + arrowPadding + scrollBarHeight;\n if ((tooltipRect.x + tooltipRect.width) > this.chart.availableSize.width) {\n this.arrowLocation.x -= ((tooltipRect.x + tooltipRect.width) - this.chart.availableSize.width);\n tooltipRect.x -= ((tooltipRect.x + tooltipRect.width) - this.chart.availableSize.width);\n }\n }\n else {\n if (tooltipRect.x < 0) {\n this.arrowLocation.x -= tooltipRect.x;\n tooltipRect.x = 0;\n }\n }\n if (tooltipRect.y < boundsY) {\n tooltipRect.y = boundsY;\n }\n if (tooltipRect.y + tooltipRect.height >= boundsY + bounds.height) {\n tooltipRect.y -= ((tooltipRect.y + tooltipRect.height) - (boundsY + bounds.height));\n }\n if (this.arrowLocation.y + arrowPadding / 2 > tooltipRect.y + tooltipRect.height - this.ry) {\n this.arrowLocation.y = tooltipRect.y + tooltipRect.height - this.ry - arrowPadding / 2;\n }\n if (this.arrowLocation.y - arrowPadding / 2 < tooltipRect.y + this.ry) {\n this.arrowLocation.y = tooltipRect.y + this.ry + arrowPadding / 2;\n }\n }\n return tooltipRect;\n };\n Crosshair.prototype.stopAnimation = function () {\n stopTimer(this.crosshairInterval);\n };\n /**\n * Removes the crosshair on mouse leave.\n * @return {void}\n * @private\n */\n Crosshair.prototype.removeCrosshair = function (duration) {\n var chart = this.chart;\n var crosshair = document.getElementById(this.elementID + '_UserInteraction');\n this.stopAnimation();\n if (crosshair && crosshair.getAttribute('opacity') !== '0') {\n this.crosshairInterval = setTimeout(function () {\n new Animation({}).animate(crosshair, {\n duration: 200,\n progress: function (args) {\n // crosshair.removeAttribute('e-animate');\n crosshair.style.animation = '';\n crosshair.setAttribute('opacity', (1 - (args.timeStamp / args.duration)).toString());\n },\n end: function (model) {\n crosshair.setAttribute('opacity', '0');\n chart.startMove = false;\n if (chart.tooltipModule) {\n chart.tooltipModule.valueX = null;\n chart.tooltipModule.valueY = null;\n }\n }\n });\n }, duration);\n }\n };\n /**\n * Get module name.\n */\n Crosshair.prototype.getModuleName = function () {\n /**\n * Returns the module name\n */\n return 'Crosshair';\n };\n /**\n * To destroy the crosshair.\n * @return {void}\n * @private\n */\n Crosshair.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n return Crosshair;\n}());\nexport { Crosshair };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { extend } from '@syncfusion/ej2-base';\nimport { ChartLocation } from '../../common/utils/helper';\nimport { stopTimer, removeElement } from '../../common/utils/helper';\nimport { ChartData } from '../../chart/utils/get-data';\nimport { tooltipRender } from '../../common/model/constants';\nimport { Tooltip as SVGTooltip } from '@syncfusion/ej2-svg-base';\n/**\n * Tooltip Module used to render the tooltip for series.\n */\nvar BaseTooltip = /** @class */ (function (_super) {\n __extends(BaseTooltip, _super);\n /**\n * Constructor for tooltip module.\n * @private.\n */\n function BaseTooltip(chart) {\n var _this = _super.call(this, chart) || this;\n _this.element = _this.chart.element;\n _this.textStyle = chart.tooltip.textStyle;\n _this.control = chart;\n return _this;\n }\n BaseTooltip.prototype.getElement = function (id) {\n return document.getElementById(id);\n };\n /**\n * Renders the tooltip.\n * @return {void}\n * @private\n */\n BaseTooltip.prototype.getTooltipElement = function (isTooltip) {\n this.inverted = this.chart.requireInvertedAxis;\n this.header = (this.control.tooltip.header === null) ?\n ((this.control.tooltip.shared) ? '${point.x}' : '${series.name}')\n : (this.control.tooltip.header);\n this.formattedText = [];\n if (!isTooltip) {\n return this.createElement();\n }\n return null;\n };\n BaseTooltip.prototype.createElement = function () {\n var tooltipDiv = document.createElement('div');\n tooltipDiv.id = this.element.id + '_tooltip';\n tooltipDiv.className = 'ejSVGTooltip';\n tooltipDiv.setAttribute('style', 'pointer-events:none; position:absolute;z-index: 1');\n return tooltipDiv;\n };\n BaseTooltip.prototype.pushData = function (data, isFirst, tooltipDiv, isChart) {\n if (data.series.enableTooltip) {\n if (isChart) {\n this.currentPoints.push(data);\n }\n else {\n this.currentPoints.push(data);\n }\n this.stopAnimation();\n if (tooltipDiv && !document.getElementById(tooltipDiv.id)) {\n if (!this.chart.stockChart) {\n document.getElementById(this.element.id + '_Secondary_Element').appendChild(tooltipDiv);\n }\n else {\n document.getElementById(this.chart.stockChart.element.id + '_Secondary_Element').appendChild(tooltipDiv);\n }\n }\n return true;\n }\n return false;\n };\n BaseTooltip.prototype.removeHighlight = function (chart) {\n var item;\n var series;\n for (var i = 0, len = this.previousPoints.length; i < len; i++) {\n item = this.previousPoints[i];\n if (item.series.isRectSeries) {\n if (item.series.visible) {\n this.highlightPoint(item.series, item.point.index, false);\n }\n continue;\n }\n series = item.series;\n if (!series.marker.visible && item.series.type !== 'Scatter' && item.series.type !== 'Bubble') {\n this.previousPoints.shift();\n len -= 1;\n }\n }\n };\n BaseTooltip.prototype.highlightPoint = function (series, pointIndex, highlight) {\n var element = this.getElement(this.element.id + '_Series_' + series.index + '_Point_' + pointIndex);\n if (element) {\n element.setAttribute('opacity', (highlight ? series.opacity / 2 : series.opacity).toString());\n }\n };\n BaseTooltip.prototype.highlightPoints = function () {\n for (var _i = 0, _a = this.currentPoints; _i < _a.length; _i++) {\n var item = _a[_i];\n if (item.series.isRectSeries && item.series.category === 'Series') {\n this.highlightPoint(item.series, item.point.index, true);\n }\n }\n };\n BaseTooltip.prototype.createTooltip = function (chart, isFirst, header, location, clipLocation, point, shapes, offset, bounds, extraPoints, templatePoint) {\n if (extraPoints === void 0) { extraPoints = null; }\n if (templatePoint === void 0) { templatePoint = null; }\n var series = this.currentPoints[0].series;\n var module = chart.tooltipModule || chart.accumulationTooltipModule;\n if (isFirst) {\n this.svgTooltip = new SVGTooltip({\n opacity: chart.tooltip.opacity,\n header: header, content: this.text, fill: chart.tooltip.fill, border: chart.tooltip.border,\n enableAnimation: chart.tooltip.enableAnimation, location: location, shared: chart.tooltip.shared,\n shapes: shapes, clipBounds: this.chart.chartAreaType === 'PolarRadar' ? new ChartLocation(0, 0) : clipLocation,\n areaBounds: bounds, palette: this.findPalette(), template: chart.tooltip.template, data: templatePoint,\n theme: chart.theme, offset: offset, textStyle: chart.tooltip.textStyle,\n isNegative: (series.isRectSeries && series.type !== 'Waterfall' && point && point.y < 0),\n inverted: this.chart.requireInvertedAxis && series.isRectSeries,\n arrowPadding: this.text.length > 1 || this.chart.stockChart ? 0 : 12,\n tooltipRender: function () {\n module.removeHighlight(module.control);\n module.highlightPoints();\n module.updatePreviousPoint(extraPoints);\n },\n animationComplete: function (args) {\n if (args.tooltip.fadeOuted) {\n module.fadeOut(module.previousPoints, chart);\n }\n }\n }, '#' + this.element.id + '_tooltip');\n }\n else {\n if (this.svgTooltip) {\n this.svgTooltip.location = location;\n this.svgTooltip.content = this.text;\n this.svgTooltip.header = header;\n this.svgTooltip.offset = offset;\n this.svgTooltip.palette = this.findPalette();\n this.svgTooltip.shapes = shapes;\n this.svgTooltip.data = templatePoint;\n this.svgTooltip.template = chart.tooltip.template;\n this.svgTooltip.textStyle = chart.tooltip.textStyle;\n this.svgTooltip.isNegative = (series.isRectSeries && series.type !== 'Waterfall' && point && point.y < 0);\n this.svgTooltip.clipBounds = this.chart.chartAreaType === 'PolarRadar' ? new ChartLocation(0, 0) : clipLocation;\n this.svgTooltip.arrowPadding = this.text.length > 1 || this.chart.stockChart ? 0 : 12;\n this.svgTooltip.dataBind();\n }\n }\n };\n BaseTooltip.prototype.findPalette = function () {\n var colors = [];\n for (var _i = 0, _a = this.currentPoints; _i < _a.length; _i++) {\n var data = _a[_i];\n colors.push(this.findColor(data, data.series));\n }\n return colors;\n };\n BaseTooltip.prototype.findColor = function (data, series) {\n if (series.isRectSeries && (series.type === 'Candle' || series.type === 'Hilo' || series.type === 'HiloOpenClose')) {\n return data.point.color;\n }\n else {\n return (data.point.color && data.point.color !== '#ffffff' ? data.point.color\n : data.point.interior) ||\n series.marker.fill || series.interior;\n }\n };\n BaseTooltip.prototype.updatePreviousPoint = function (extraPoints) {\n if (extraPoints) {\n this.currentPoints = this.currentPoints.concat(extraPoints);\n }\n this.previousPoints = extend([], this.currentPoints, null, true);\n };\n BaseTooltip.prototype.fadeOut = function (data, chart) {\n var svgElement = this.getElement(this.element.id + '_tooltip_svg');\n var isTooltip = (svgElement && parseInt(svgElement.getAttribute('opacity'), 10) > 0);\n if (!isTooltip) {\n this.valueX = null;\n this.valueY = null;\n this.currentPoints = [];\n this.removeHighlight(chart);\n this.removeHighlightedMarker(data);\n this.svgTooltip = null;\n this.control.trigger('animationComplete', {});\n }\n };\n /*\n * @hidden\n */\n BaseTooltip.prototype.removeHighlightedMarker = function (data) {\n if (this.chart.markerRender) {\n for (var _i = 0, data_1 = data; _i < data_1.length; _i++) {\n var item = data_1[_i];\n removeElement(this.element.id + '_Series_' + item.series.index +\n '_Point_' + item.point.index + '_Trackball');\n }\n this.chart.markerRender.removeHighlightedMarker();\n }\n this.previousPoints = [];\n };\n BaseTooltip.prototype.triggerEvent = function (point, isFirst, textCollection, firstText) {\n if (firstText === void 0) { firstText = true; }\n var argsData = {\n cancel: false, name: tooltipRender, text: textCollection,\n point: point.point, series: point.series, textStyle: this.textStyle\n };\n this.chart.trigger(tooltipRender, argsData);\n if (!argsData.cancel) {\n if (point.series.type === 'BoxAndWhisker') {\n this.removeText();\n isFirst = true;\n }\n this.formattedText = this.formattedText.concat(argsData.text);\n this.text = this.formattedText;\n }\n return !argsData.cancel;\n };\n BaseTooltip.prototype.removeText = function () {\n this.textElements = [];\n var element = this.getElement(this.element.id + '_tooltip_group');\n if (element && element.childNodes.length > 0) {\n while (element.lastChild && element.childNodes.length !== 1) {\n element.removeChild(element.lastChild);\n }\n }\n };\n BaseTooltip.prototype.stopAnimation = function () {\n stopTimer(this.toolTipInterval);\n };\n /**\n * Removes the tooltip on mouse leave.\n * @return {void}\n * @private\n */\n BaseTooltip.prototype.removeTooltip = function (duration) {\n var _this = this;\n var tooltipElement = this.getElement(this.element.id + '_tooltip');\n this.stopAnimation();\n if (tooltipElement && this.previousPoints.length > 0) {\n this.toolTipInterval = setTimeout(function () {\n if (_this.svgTooltip) {\n _this.svgTooltip.fadeOut();\n }\n }, duration);\n }\n };\n return BaseTooltip;\n}(ChartData));\nexport { BaseTooltip };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { extend, Browser, remove } from '@syncfusion/ej2-base';\nimport { PointData, ChartLocation } from '../../common/utils/helper';\nimport { valueToCoefficient, removeElement, valueToPolarCoefficient, withInBounds } from '../../common/utils/helper';\nimport { BaseTooltip } from '../../common/user-interaction/tooltip';\n/**\n * `Tooltip` module is used to render the tooltip for chart series.\n */\nvar Tooltip = /** @class */ (function (_super) {\n __extends(Tooltip, _super);\n /**\n * Constructor for tooltip module.\n * @private.\n */\n function Tooltip(chart) {\n var _this = _super.call(this, chart) || this;\n _this.addEventListener();\n return _this;\n }\n /**\n * @hidden\n */\n Tooltip.prototype.addEventListener = function () {\n if (this.chart.isDestroyed) {\n return;\n }\n var cancelEvent = Browser.isPointer ? 'pointerleave' : 'mouseleave';\n this.chart.on(cancelEvent, this.mouseLeaveHandler, this);\n this.chart.on('tapHold', this.longPress, this);\n this.chart.on(Browser.touchMoveEvent, this.mouseMoveHandler, this);\n this.chart.on(Browser.touchEndEvent, this.mouseUpHandler, this);\n };\n Tooltip.prototype.mouseUpHandler = function () {\n var chart = this.control;\n if (chart.isTouch && !this.isSelected(chart) &&\n ((withInBounds(chart.mouseX, chart.mouseY, chart.chartAxisLayoutPanel.seriesClipRect) && chart.tooltip.shared)\n || !chart.tooltip.shared)) {\n if (!chart.crosshair.enable) {\n this.tooltip();\n this.removeTooltip(2000);\n }\n else if (chart.startMove) {\n this.removeTooltip(2000);\n }\n }\n };\n Tooltip.prototype.mouseLeaveHandler = function () {\n this.removeTooltip(1000);\n };\n Tooltip.prototype.mouseMoveHandler = function () {\n var chart = this.chart;\n // Tooltip for chart series.\n if (!chart.disableTrackTooltip && !this.isSelected(chart)) {\n if (!chart.tooltip.shared && (!chart.isTouch || (chart.startMove))) {\n this.tooltip();\n }\n if (withInBounds(chart.mouseX, chart.mouseY, chart.chartAxisLayoutPanel.seriesClipRect)) {\n if (chart.tooltip.shared && (!chart.isTouch || (chart.startMove))) {\n this.tooltip();\n }\n }\n else {\n if (chart.tooltip.shared) {\n this.removeTooltip(1000);\n }\n }\n }\n };\n /**\n * Handles the long press on chart.\n * @return {boolean}\n * @private\n */\n Tooltip.prototype.longPress = function () {\n var chart = this.chart;\n if (chart.crosshair.enable && withInBounds(chart.mouseX, chart.mouseY, chart.chartAxisLayoutPanel.seriesClipRect)) {\n this.tooltip();\n }\n return false;\n };\n /**\n * Renders the tooltip.\n * @return {void}\n */\n Tooltip.prototype.tooltip = function () {\n if ((this.chart.stockChart && this.chart.stockChart.onPanning)) {\n this.removeTooltip(1000);\n return null;\n }\n var svgElement = this.getElement(this.element.id + '_tooltip_svg');\n var isTooltip = (svgElement && parseInt(svgElement.getAttribute('opacity'), 10) > 0);\n var tooltipDiv = this.getTooltipElement(isTooltip);\n if (!this.chart.tooltip.shared) {\n this.renderSeriesTooltip(this.chart, !isTooltip, tooltipDiv);\n }\n else {\n this.renderGroupedTooltip(this.chart, !isTooltip, tooltipDiv);\n }\n };\n Tooltip.prototype.findHeader = function (data) {\n if (this.header === '') {\n return '';\n }\n this.header = this.parseTemplate(data.point, data.series, this.header, data.series.xAxis, data.series.yAxis);\n if (this.header.replace(//g, '').replace(/<\\/b>/g, '').trim() !== '') {\n return this.header;\n }\n return '';\n };\n Tooltip.prototype.findShapes = function () {\n if (!this.chart.tooltip.enableMarker) {\n return [];\n }\n var marker = [];\n for (var _i = 0, _a = this.currentPoints; _i < _a.length; _i++) {\n var data = _a[_i];\n marker.push(data.point.marker.shape || data.series.marker.shape);\n }\n return marker;\n };\n Tooltip.prototype.renderSeriesTooltip = function (chart, isFirst, tooltipDiv) {\n var data = this.getData();\n data.lierIndex = this.lierIndex;\n var rect = chart.chartAxisLayoutPanel.seriesClipRect;\n this.currentPoints = [];\n var tool;\n if (this.findData(data, this.previousPoints[0])) {\n if (this.pushData(data, isFirst, tooltipDiv, true)) {\n if (this.triggerEvent(data, isFirst, this.getTooltipText(data))) {\n this.createTooltip(chart, isFirst, this.findHeader(data), this.getSymbolLocation(data), data.series.clipRect, data.point, this.findShapes(), this.findMarkerHeight(this.currentPoints[0]), chart.chartAxisLayoutPanel.seriesClipRect, null, this.getTemplateText(data));\n }\n else {\n this.removeHighlight(this.control);\n remove(this.getElement(this.element.id + '_tooltip'));\n }\n this.isRemove = true;\n }\n }\n else {\n if (!data.point && this.isRemove) {\n this.removeTooltip(1000);\n this.isRemove = false;\n }\n else {\n for (var _i = 0, _a = chart.visibleSeries; _i < _a.length; _i++) {\n var series = _a[_i];\n if (series.visible) {\n data = this.getClosestX(chart, series) || data;\n }\n }\n }\n }\n if (data && data.point) {\n this.findMouseValue(data, chart);\n }\n };\n Tooltip.prototype.findMarkerHeight = function (pointData) {\n if (!this.chart.tooltip.enableMarker) {\n return 0;\n }\n var markerHeight = 0;\n var series = pointData.series;\n markerHeight = ((series.marker.visible || (this.chart.tooltip.shared &&\n (!series.isRectSeries || series.marker.visible)) || series.type === 'Scatter' || series.drawType === 'Scatter')\n && !(series.type === 'Candle' || series.type === 'Hilo' || series.type === 'HiloOpenClose')) ?\n ((series.marker.height + 2) / 2 + (2 * series.marker.border.width)) : 0;\n return markerHeight;\n };\n Tooltip.prototype.findData = function (data, previous) {\n return data.point && ((!previous || (previous.point !== data.point)) ||\n (previous && previous.lierIndex > 3 && previous.lierIndex !== this.lierIndex));\n };\n Tooltip.prototype.getSymbolLocation = function (data) {\n var location;\n if (data.series.type !== 'BoxAndWhisker') {\n if (!data.point.symbolLocations[0]) {\n return null;\n }\n location = new ChartLocation(data.point.symbolLocations[0].x, data.point.symbolLocations[0].y);\n }\n switch (data.series.type) {\n case 'BoxAndWhisker':\n return this.getBoxLocation(data);\n case 'Waterfall':\n return this.getWaterfallRegion(data, location);\n case 'RangeArea':\n return this.getRangeArea(data, location);\n default:\n return location;\n }\n };\n Tooltip.prototype.getRangeArea = function (data, location) {\n if (data.point.regions[0]) {\n if (!this.inverted) {\n location.y = data.point.regions[0].y + data.point.regions[0].height / 2;\n }\n else {\n location.x = data.point.regions[0].x + data.point.regions[0].width / 2;\n }\n }\n return location;\n };\n Tooltip.prototype.getWaterfallRegion = function (data, location) {\n if (!this.inverted) {\n location.y = (data.point.y < 0) ?\n location.y - data.point.regions[0].height : location.y;\n }\n else {\n location.x = (data.point.y < 0) ?\n location.x + data.point.regions[0].width : location.x;\n }\n return location;\n };\n Tooltip.prototype.getTooltipText = function (pointData) {\n var series = pointData.series;\n return this.parseTemplate(pointData.point, series, this.getFormat(this.chart, series), series.xAxis, series.yAxis);\n };\n Tooltip.prototype.getTemplateText = function (data) {\n if (this.chart.tooltip.template) {\n var point = extend({}, data.point);\n point.x = this.formatPointValue(data.point, data.series.xAxis, 'x', true, false);\n if ((data.series.seriesType === 'XY')) {\n point.y = this.formatPointValue(data.point, data.series.yAxis, 'y', false, true);\n }\n else {\n point.low = this.formatPointValue(data.point, data.series.yAxis, 'low', false, true);\n point.high = this.formatPointValue(data.point, data.series.yAxis, 'high', false, true);\n }\n return point;\n }\n else {\n return data.point;\n }\n };\n Tooltip.prototype.findMouseValue = function (data, chart) {\n if (!chart.requireInvertedAxis) {\n if (chart.chartAreaType === 'PolarRadar') {\n this.valueX = valueToPolarCoefficient(data.point.xValue, data.series.xAxis) * data.series.xAxis.rect.width\n + data.series.xAxis.rect.x;\n }\n else {\n this.valueX = valueToCoefficient(data.point.xValue, data.series.xAxis) * data.series.xAxis.rect.width\n + data.series.xAxis.rect.x;\n }\n this.valueY = chart.mouseY;\n }\n else {\n this.valueY = (1 - valueToCoefficient(data.point.xValue, data.series.xAxis)) * data.series.xAxis.rect.height\n + data.series.xAxis.rect.y;\n this.valueX = chart.mouseX;\n }\n };\n Tooltip.prototype.renderGroupedTooltip = function (chart, isFirst, tooltipDiv) {\n var data;\n var height = 0;\n var width = 0;\n var pointData = chart.chartAreaType === 'PolarRadar' ? this.getData() : null;\n this.stopAnimation();\n this.removeHighlight(chart);\n this.currentPoints = [];\n var extraPoints = [];\n var headerContent = '';\n if (isFirst) {\n if (!chart.stockChart) {\n document.getElementById(this.element.id + '_Secondary_Element').appendChild(tooltipDiv);\n }\n else {\n document.getElementById(chart.stockChart.element.id + '_Secondary_Element').appendChild(tooltipDiv);\n }\n }\n this.removeText();\n for (var _i = 0, _a = chart.visibleSeries; _i < _a.length; _i++) {\n var series = _a[_i];\n if (!series.enableTooltip) {\n continue;\n }\n if (chart.chartAreaType === 'Cartesian' && series.visible) {\n data = this.getClosestX(chart, series);\n }\n else if (chart.chartAreaType === 'PolarRadar' && series.visible && pointData.point !== null) {\n data = new PointData(series.points[pointData.point.index], series);\n }\n if (data && this.header !== '' && this.currentPoints.length === 0) {\n headerContent = this.findHeader(data);\n }\n if (data && this.triggerEvent(data, isFirst, this.getTooltipText(data))) {\n this.findMouseValue(data, chart);\n this.currentPoints.push(data);\n data = null;\n }\n else if (data) {\n extraPoints.push(data);\n }\n }\n if (this.currentPoints.length > 0) {\n this.createTooltip(chart, isFirst, headerContent, this.findSharedLocation(), this.currentPoints.length === 1 ? this.currentPoints[0].series.clipRect : null, null, this.findShapes(), this.findMarkerHeight(this.currentPoints[0]), chart.chartAxisLayoutPanel.seriesClipRect, extraPoints);\n }\n else if (this.getElement(this.element.id + '_tooltip_path')) {\n this.getElement(this.element.id + '_tooltip_path').setAttribute('d', '');\n }\n };\n Tooltip.prototype.findSharedLocation = function () {\n var stockChart = this.chart.stockChart;\n if (stockChart) {\n if (this.text.length === 1) {\n this.text.push('');\n }\n var toolbarHeight = stockChart.enablePeriodSelector ? stockChart.toolbarHeight : 0;\n var element = document.getElementById(stockChart.element.id + '_ChartTitle');\n var titleHeight = stockChart.title !== '' ? element.getBoundingClientRect().height + 10 : 0;\n return new ChartLocation(this.chart.chartAxisLayoutPanel.seriesClipRect.x + 5, this.chart.chartAxisLayoutPanel.seriesClipRect.y + toolbarHeight + 5 + titleHeight);\n }\n else {\n if (this.currentPoints.length > 1) {\n return new ChartLocation(this.valueX, this.valueY);\n }\n else {\n return this.getSymbolLocation(this.currentPoints[0]);\n }\n }\n };\n Tooltip.prototype.getBoxLocation = function (data) {\n var location;\n location = this.lierIndex > 3 ? data.point.symbolLocations[this.lierIndex - 4] :\n {\n x: data.point.regions[0].x + (data.point.regions[0].width / 2),\n y: data.point.regions[0].y + (data.point.regions[0].height / 2)\n };\n return location;\n };\n Tooltip.prototype.parseTemplate = function (point, series, format, xAxis, yAxis) {\n var val;\n var textValue;\n var xFormat;\n var customLabelFormat;\n var chart = this.chart;\n for (var _i = 0, _a = Object.keys(point); _i < _a.length; _i++) {\n var dataValue = _a[_i];\n val = new RegExp('${point' + '.' + dataValue + '}', 'gm');\n format = format.replace(val.source, this.formatPointValue(point, val.source === '${point.x}' ? xAxis : yAxis, dataValue, val.source === '${point.x}', (val.source === '${point.high}' ||\n val.source === '${point.open}' ||\n val.source === '${point.close}' ||\n val.source === '${point.low}' ||\n val.source === '${point.y}' ||\n val.source === '${point.minimum}' ||\n val.source === '${point.maximum}' ||\n val.source === '${point.outliers}' ||\n val.source === '${point.upperQuartile}' ||\n val.source === '${point.lowerQuartile}' ||\n val.source === '${point.median}')));\n }\n for (var _b = 0, _c = Object.keys(Object.getPrototypeOf(series)); _b < _c.length; _b++) {\n var dataValue = _c[_b];\n val = new RegExp('${series' + '.' + dataValue + '}', 'gm');\n textValue = series[dataValue];\n format = format.replace(val.source, textValue);\n }\n return format;\n };\n Tooltip.prototype.formatPointValue = function (point, axis, dataValue, isXPoint, isYPoint) {\n var textValue;\n var customLabelFormat;\n var value;\n if (axis.valueType !== 'Category' && isXPoint) {\n customLabelFormat = axis.labelFormat && axis.labelFormat.match('{value}') !== null;\n textValue = customLabelFormat ? axis.labelFormat.replace('{value}', axis.format(point[dataValue])) :\n axis.format(point[dataValue]);\n }\n else if (isYPoint) {\n customLabelFormat = axis.labelFormat && axis.labelFormat.match('{value}') !== null;\n value = dataValue === 'outliers' ? axis.format(point[dataValue][this.lierIndex - 4]) :\n axis.format(point[dataValue]);\n textValue = customLabelFormat ? axis.labelFormat.replace('{value}', value) : value;\n }\n else {\n textValue = point[dataValue];\n }\n return textValue;\n };\n Tooltip.prototype.getFormat = function (chart, series) {\n if (chart.tooltip.format) {\n if (series.seriesType === 'XY' && series.category === 'Indicator') {\n return this.getIndicatorTooltipFormat(series, chart, chart.tooltip.format);\n }\n return chart.tooltip.format;\n }\n var textX = (series.type === 'Histogram') ? '${point.minimum}' + '-' + '${point.maximum}' : '${point.x}';\n var format = !chart.tooltip.shared ? textX : '${series.name}';\n switch (series.seriesType) {\n case 'XY':\n if (series.category === 'Indicator') {\n this.getIndicatorTooltipFormat(series, chart, chart.tooltip.format);\n }\n return format + ' : ' + ((series.type === 'Bubble') ? '${point.y} Size : ${point.size}'\n : '${point.y}');\n case 'HighLow':\n return format + ('
High : ${point.high}
Low : ${point.low}');\n case 'HighLowOpenClose':\n return format + ('
High : ${point.high}
Low : ${point.low}
' +\n 'Open : ${point.open}
Close : ${point.close}');\n case 'BoxPlot': {\n return format + '
' + (this.lierIndex > 3 ? 'Outliers : ${point.outliers}' :\n 'Maximum : ${point.maximum}
Q3 : ${point.upperQuartile}
' +\n 'Median : ${point.median}
Q1 : ${point.lowerQuartile}
Minimum : ${point.minimum}');\n }\n }\n return '';\n };\n Tooltip.prototype.getIndicatorTooltipFormat = function (series, chart, format) {\n var toolTip;\n var points = [];\n if (series.seriesType === 'XY') {\n toolTip = series.name + ' : ${point.y}';\n }\n else {\n toolTip = format;\n }\n return toolTip;\n };\n /*\n * @hidden\n */\n Tooltip.prototype.removeHighlightedMarker = function (data) {\n for (var _i = 0, data_1 = data; _i < data_1.length; _i++) {\n var item = data_1[_i];\n removeElement(this.element.id + '_Series_' + item.series.index +\n '_Point_' + item.point.index + '_Trackball');\n }\n if (this.chart.markerRender) {\n this.chart.markerRender.removeHighlightedMarker();\n }\n this.previousPoints = [];\n };\n /**\n * Get module name.\n */\n Tooltip.prototype.getModuleName = function () {\n /**\n * Returns the module name\n */\n return 'Tooltip';\n };\n /**\n * To destroy the tooltip.\n * @return {void}\n * @private\n */\n Tooltip.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n return Tooltip;\n}(BaseTooltip));\nexport { Tooltip };\n","import { EventHandler } from '@syncfusion/ej2-base';\nimport { remove } from '@syncfusion/ej2-base';\nimport { removeElement, RectOption, PolygonOption, createTooltip, minMax, getElement } from '../../common/utils/helper';\nimport { textElement, } from '../../common/utils/helper';\nimport { PathOption, Rect, measureText, TextOption } from '@syncfusion/ej2-svg-base';\nimport { zoomComplete } from '../../common/model/constants';\n/**\n * Zooming Toolkit created here\n * @private\n */\nvar Toolkit = /** @class */ (function () {\n /** @private */\n function Toolkit(chart) {\n this.iconRectOverFill = 'transparent';\n this.iconRectSelectionFill = 'transparent';\n this.chart = chart;\n this.elementId = chart.element.id;\n this.selectionColor = chart.theme === 'Bootstrap4' ? '#FFFFFF' : '#ff4081';\n this.fillColor = chart.theme === 'Bootstrap4' ? '#495057' : '#737373';\n this.iconRectOverFill = chart.theme === 'Bootstrap4' ? '#5A6268' : this.iconRectOverFill;\n this.iconRectSelectionFill = chart.theme === 'Bootstrap4' ? '#5B6269' : this.iconRectSelectionFill;\n this.iconRect = chart.theme === 'Bootstrap4' ? new Rect(-5, -5, 26, 26) : new Rect(0, 0, 16, 16);\n }\n /**\n * To create the pan button.\n * @return {void}\n * @private\n */\n Toolkit.prototype.createPanButton = function (childElement, parentElement, chart) {\n var render = this.chart.renderer;\n var fillColor = this.chart.zoomModule.isPanning ? this.selectionColor : this.fillColor;\n var direction = 'M5,3h2.3L7.275,5.875h1.4L8.65,3H11L8,0L5,3z M3,11V8.7l2.875,0.025v-1.4L3,7.35V5L0,8L3,';\n direction += '11z M11,13H8.7l0.025-2.875h-1.4L7.35,13H5l3,3L11,13z M13,5v2.3l-2.875-0.025v1.4L13,8.65V11l3-3L13,5z';\n childElement.id = this.elementId + '_Zooming_Pan';\n childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('Pan'));\n this.panElements = childElement;\n childElement.appendChild(render.drawRectangle(new RectOption(this.elementId + '_Zooming_Pan_1', 'transparent', {}, 1, this.iconRect)));\n childElement.appendChild(render.drawPath(new PathOption(this.elementId + '_Zooming_Pan_2', fillColor, null, null, 1, null, direction)));\n parentElement.appendChild(childElement);\n this.wireEvents(childElement, this.pan);\n };\n /**\n * To create the zoom button.\n * @return {void}\n * @private\n */\n Toolkit.prototype.createZoomButton = function (childElement, parentElement, chart) {\n var render = this.chart.renderer;\n var fillColor = this.chart.zoomModule.isPanning ? this.fillColor : this.selectionColor;\n var rectColor = this.chart.zoomModule.isPanning ? 'transparent' : this.iconRectSelectionFill;\n var direction = 'M0.001,14.629L1.372,16l4.571-4.571v-0.685l0.228-0.274c1.051,0.868,2.423,1.417,3.885,1.417c3.291,0,';\n direction += '5.943-2.651,5.943-5.943S13.395,0,10.103,0S4.16,2.651,4.16,5.943c0,1.508,0.503,2.834,1.417,3.885l-0.274,0.228H4.571';\n direction = direction + 'L0.001,14.629L0.001,14.629z M5.943,5.943c0-2.285,1.828-4.114,4.114-4.114s4.114,1.828,4.114,';\n childElement.id = this.elementId + '_Zooming_Zoom';\n childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('Zoom'));\n this.zoomElements = childElement;\n this.selectedID = this.chart.zoomModule.isPanning ? this.chart.element.id + '_Zooming_Pan_1' : this.elementId + '_Zooming_Zoom_1';\n childElement.appendChild(render.drawRectangle(new RectOption(this.elementId + '_Zooming_Zoom_1', rectColor, {}, 1, this.iconRect)));\n childElement.appendChild(render.drawPath(new PathOption(this.elementId + '_Zooming_Zoom_3', fillColor, null, null, 1, null, direction + '4.114s-1.828,4.114-4.114,4.114S5.943,8.229,5.943,5.943z')));\n parentElement.appendChild(childElement);\n this.wireEvents(childElement, this.zoom);\n };\n /**\n * To create the ZoomIn button.\n * @return {void}\n * @private\n */\n Toolkit.prototype.createZoomInButton = function (childElement, parentElement, chart) {\n var render = this.chart.renderer;\n var fillColor = this.fillColor;\n var direction = 'M10.103,0C6.812,0,4.16,2.651,4.16,5.943c0,1.509,0.503,2.834,1.417,3.885l-0.274,0.229H4.571L0,';\n direction += '14.628l0,0L1.372,16l4.571-4.572v-0.685l0.228-0.275c1.052,0.868,2.423,1.417,3.885,1.417c3.291,0,5.943-2.651,';\n direction += '5.943-5.943C16,2.651,13.395,0,10.103,0z M10.058,10.058c-2.286,0-4.114-1.828-4.114-4.114c0-2.286,1.828-4.114,';\n childElement.id = this.elementId + '_Zooming_ZoomIn';\n childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('ZoomIn'));\n var polygonDirection = '12.749,5.466 10.749,5.466 10.749,3.466 9.749,3.466 9.749,5.466 7.749,5.466 7.749,6.466';\n childElement.appendChild(render.drawRectangle(new RectOption(this.elementId + '_Zooming_ZoomIn_1', 'transparent', {}, 1, this.iconRect)));\n childElement.appendChild(render.drawPath(new PathOption(this.elementId + '_Zooming_ZoomIn_2', fillColor, null, null, 1, null, direction + '4.114-4.114c2.286,0,4.114,1.828,4.114,4.114C14.172,8.229,12.344,10.058,10.058,10.058z')));\n childElement.appendChild(render.drawPolygon(new PolygonOption(this.elementId + '_Zooming_ZoomIn_3', polygonDirection + ' 9.749,6.466 9.749,8.466 10.749,8.466 10.749,6.466 12.749,6.466', fillColor)));\n this.zoomInElements = childElement;\n this.elementOpacity = chart.zoomModule.isPanning ? '0.2' : '1';\n childElement.setAttribute('opacity', this.elementOpacity);\n parentElement.appendChild(childElement);\n this.wireEvents(childElement, this.zoomIn);\n };\n /**\n * To create the ZoomOut button.\n * @return {void}\n * @private\n */\n Toolkit.prototype.createZoomOutButton = function (childElement, parentElement, chart) {\n var render = this.chart.renderer;\n var fillColor = this.fillColor;\n var direction = 'M0,14.622L1.378,16l4.533-4.533v-0.711l0.266-0.266c1.022,0.889,2.4,1.422,3.866,';\n direction += '1.422c3.289,0,5.955-2.666,5.955-5.955S13.333,0,10.044,0S4.089,2.667,4.134,5.911c0,1.466,0.533,2.844,';\n direction += '1.422,3.866l-0.266,0.266H4.578L0,14.622L0,14.622z M5.911,5.911c0-2.311,1.822-4.133,4.133-4.133s4.133,1.822,4.133,';\n childElement.id = this.elementId + '_Zooming_ZoomOut';\n childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('ZoomOut'));\n childElement.appendChild(render.drawRectangle(new RectOption(this.elementId + '_Zooming_ZoomOut_1', 'transparent', {}, 1, this.iconRect)));\n childElement.appendChild(render.drawPath(new PathOption(this.elementId + '_Zooming_ZoomOut_2', fillColor, null, null, 1, null, direction + '4.133s-1.866,4.133-4.133,4.133S5.911,8.222,5.911,5.911z M12.567,6.466h-5v-1h5V6.466z')));\n this.zoomOutElements = childElement;\n this.elementOpacity = chart.zoomModule.isPanning ? '0.2' : '1';\n childElement.setAttribute('opacity', this.elementOpacity);\n parentElement.appendChild(childElement);\n this.wireEvents(childElement, this.zoomOut);\n };\n /**\n * To create the Reset button.\n * @return {void}\n * @private\n */\n Toolkit.prototype.createResetButton = function (childElement, parentElement, chart, isDevice) {\n var render = this.chart.renderer;\n var fillColor = this.fillColor;\n var size;\n var direction = 'M12.364,8h-2.182l2.909,3.25L16,8h-2.182c0-3.575-2.618-6.5-5.818-6.5c-1.128,0-2.218,0.366-3.091,';\n direction += '1.016l1.055,1.178C6.581,3.328,7.272,3.125,8,3.125C10.4,3.125,12.363,5.319,12.364,8L12.364,8z M11.091,';\n direction += '13.484l-1.055-1.178C9.419,12.672,8.728,12.875,8,12.875c-2.4,0-4.364-2.194-4.364-4.875h2.182L2.909,4.75L0,8h2.182c0,';\n childElement.id = this.elementId + '_Zooming_Reset';\n childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('Reset'));\n if (!isDevice) {\n childElement.appendChild(render.drawRectangle(new RectOption(this.elementId + '_Zooming_Reset_1', 'transparent', {}, 1, this.iconRect)));\n childElement.appendChild(render.drawPath(new PathOption(this.elementId + '_Zooming_Reset_2', fillColor, null, null, 1, null, direction + '3.575,2.618,6.5,5.818,6.5C9.128,14.5,10.219,14.134,11.091,13.484L11.091,13.484z')));\n }\n else {\n size = measureText(this.chart.getLocalizedLabel('ResetZoom'), { size: '12px' });\n childElement.appendChild(render.drawRectangle(new RectOption(this.elementId + '_Zooming_Reset_1', 'transparent', {}, 1, new Rect(0, 0, size.width, size.height))));\n textElement(new TextOption(this.elementId + '_Zooming_Reset_2', 0 + size.width / 2, 0 + size.height * 3 / 4, 'middle', this.chart.getLocalizedLabel('ResetZoom'), 'rotate(0,' + (0) + ',' + (0) + ')', 'auto'), { size: '12px' }, 'black', childElement);\n }\n parentElement.appendChild(childElement);\n this.wireEvents(childElement, this.reset);\n };\n /**\n * To bind events.\n * @return {void}\n * @private\n */\n Toolkit.prototype.wireEvents = function (element, process) {\n EventHandler.add(element, 'mousedown touchstart', process, this);\n EventHandler.add(element, 'mouseover', this.showTooltip, this);\n EventHandler.add(element, 'mouseout', this.removeTooltip, this);\n };\n /**\n * To show tooltip.\n * @return {void}\n * @private\n */\n Toolkit.prototype.showTooltip = function (event) {\n var text = event.currentTarget.id.split('_Zooming_')[1];\n var left = (event.pageX - (measureText(text, { size: '10px' }).width + 5));\n var rect = getElement(event.currentTarget.id + '_1');\n var icon2 = getElement(event.currentTarget.id + '_2');\n var icon3 = getElement(event.currentTarget.id + '_3');\n if (rect) {\n this.hoveredID = rect.id;\n rect.setAttribute('fill', this.iconRectOverFill);\n }\n if (icon2) {\n icon2.setAttribute('fill', this.selectionColor);\n }\n if (icon3) {\n icon3.setAttribute('fill', this.selectionColor);\n }\n if (!this.chart.isTouch) {\n createTooltip('EJ2_Chart_ZoomTip', this.chart.getLocalizedLabel(text), (event.pageY + 10), left, '10px');\n }\n };\n /** @private */\n // tslint:disable\n Toolkit.prototype.removeTooltip = function () {\n if (getElement(this.hoveredID)) {\n var rectColor = this.chart.zoomModule.isPanning ? (this.hoveredID.indexOf('_Pan_') > -1) ? this.iconRectSelectionFill : 'transparent' : (this.hoveredID.indexOf('_Zoom_') > -1) ? this.iconRectSelectionFill : 'transparent';\n getElement(this.hoveredID).setAttribute('fill', rectColor);\n }\n var icon2 = this.hoveredID ? getElement(this.hoveredID.replace('_1', '_2')) : null;\n var icon3 = this.hoveredID ? getElement(this.hoveredID.replace('_1', '_3')) : null;\n if (icon2) {\n var iconColor = this.chart.zoomModule.isPanning ? (this.hoveredID.indexOf('_Pan_') > -1) ? this.selectionColor : this.fillColor : (this.hoveredID.indexOf('_Zoom_') > -1) ? this.selectionColor : this.fillColor;\n icon2.setAttribute('fill', iconColor);\n }\n if (icon3) {\n var iconColor = this.chart.zoomModule.isPanning ? this.fillColor : (this.hoveredID.indexOf('_Zoom_') > -1) ? this.selectionColor : this.fillColor;\n icon3.setAttribute('fill', iconColor);\n }\n removeElement('EJ2_Chart_ZoomTip');\n };\n // Toolkit events function calculation here.\n /** @private */\n Toolkit.prototype.reset = function () {\n var chart = this.chart;\n if (!chart.zoomModule.isDevice) {\n remove(chart.zoomModule.toolkitElements);\n }\n var argsData;\n this.removeTooltip();\n chart.svgObject.setAttribute('cursor', 'auto');\n chart.axisCollections.forEach(function (axis) {\n argsData = {\n cancel: false, name: zoomComplete, axis: axis, previousZoomFactor: axis.zoomFactor, previousZoomPosition: axis.zoomPosition,\n currentZoomFactor: 1, currentZoomPosition: 0\n };\n axis.zoomFactor = 1;\n axis.zoomPosition = 0;\n if (axis.zoomingScrollBar) {\n axis.zoomingScrollBar.isScrollUI = false;\n }\n chart.trigger(zoomComplete, argsData);\n if (!argsData.cancel) {\n axis.zoomFactor = argsData.currentZoomFactor;\n axis.zoomPosition = argsData.currentZoomPosition;\n }\n });\n chart.disableTrackTooltip = false;\n chart.zoomModule.isZoomed = chart.zoomModule.isPanning = chart.isChartDrag = chart.delayRedraw = false;\n chart.zoomModule.touchMoveList = chart.zoomModule.touchStartList = [];\n chart.zoomModule.pinchTarget = null;\n chart.removeSvg();\n chart.refreshAxis();\n chart.refreshBound();\n this.elementOpacity = '1';\n return false;\n };\n Toolkit.prototype.zoomIn = function (e) {\n this.zoomInOutCalculation(1, this.chart, this.chart.axisCollections, this.chart.zoomSettings.mode);\n return false;\n };\n Toolkit.prototype.zoomOut = function (e) {\n this.zoomInOutCalculation(-1, this.chart, this.chart.axisCollections, this.chart.zoomSettings.mode);\n return false;\n };\n Toolkit.prototype.zoom = function (e) {\n this.chart.zoomModule.isPanning = false;\n var zoomModule = this.chart.zoomModule;\n this.elementOpacity = '1';\n this.chart.svgObject.setAttribute('cursor', 'auto');\n this.zoomInElements.setAttribute('opacity', this.elementOpacity);\n this.zoomOutElements.setAttribute('opacity', this.elementOpacity);\n this.applySelection(this.zoomElements.childNodes, this.selectionColor);\n this.applySelection(this.panElements.childNodes, '#737373');\n if (getElement(this.selectedID)) {\n getElement(this.selectedID).setAttribute('fill', 'transparent');\n }\n this.selectedID = this.chart.element.id + '_Zooming_Zoom_1';\n getElement(this.selectedID).setAttribute('fill', this.iconRectSelectionFill);\n return false;\n };\n /** @private */\n Toolkit.prototype.pan = function () {\n var element;\n this.chart.zoomModule.isPanning = true;\n this.chart.svgObject.setAttribute('cursor', 'pointer');\n this.elementOpacity = '0.2';\n element = this.zoomInElements ? this.zoomInElements.setAttribute('opacity', this.elementOpacity) : null;\n element = this.zoomOutElements ? this.zoomOutElements.setAttribute('opacity', this.elementOpacity) : null;\n element = this.panElements ? this.applySelection(this.panElements.childNodes, this.selectionColor) : null;\n element = this.zoomElements ? this.applySelection(this.zoomElements.childNodes, '#737373') : null;\n if (getElement(this.selectedID)) {\n getElement(this.selectedID).setAttribute('fill', 'transparent');\n }\n this.selectedID = this.chart.element.id + '_Zooming_Pan_1';\n getElement(this.selectedID).setAttribute('fill', this.iconRectSelectionFill);\n return false;\n };\n Toolkit.prototype.zoomInOutCalculation = function (scale, chart, axes, mode) {\n if (!chart.zoomModule.isPanning && this.elementOpacity !== '0.2') {\n var zoomFactor_1;\n var zoomPosition_1;\n var cumulative_1;\n chart.disableTrackTooltip = true;\n chart.delayRedraw = true;\n var argsData_1;\n axes.forEach(function (axis) {\n argsData_1 = {\n cancel: false, name: zoomComplete, axis: axis, previousZoomFactor: axis.zoomFactor,\n previousZoomPosition: axis.zoomPosition, currentZoomFactor: axis.zoomFactor, currentZoomPosition: axis.zoomPosition\n };\n if ((axis.orientation === 'Horizontal' && mode !== 'Y') ||\n (axis.orientation === 'Vertical' && mode !== 'X')) {\n cumulative_1 = Math.max(Math.max(1 / minMax(axis.zoomFactor, 0, 1), 1) + (0.25 * scale), 1);\n zoomFactor_1 = (cumulative_1 === 1) ? 1 : minMax(1 / cumulative_1, 0, 1);\n zoomPosition_1 = (cumulative_1 === 1) ? 0 : axis.zoomPosition + ((axis.zoomFactor - zoomFactor_1) * 0.5);\n if (axis.zoomPosition !== zoomPosition_1 || axis.zoomFactor !== zoomFactor_1) {\n zoomFactor_1 = (zoomPosition_1 + zoomFactor_1) > 1 ? (1 - zoomPosition_1) : zoomFactor_1;\n }\n argsData_1.currentZoomFactor = zoomFactor_1;\n argsData_1.currentZoomPosition = zoomPosition_1;\n chart.trigger(zoomComplete, argsData_1);\n if (!argsData_1.cancel) {\n axis.zoomFactor = argsData_1.currentZoomFactor;\n axis.zoomPosition = argsData_1.currentZoomPosition;\n }\n }\n });\n }\n };\n Toolkit.prototype.applySelection = function (elements, color) {\n for (var i = 1, length_1 = elements.length; i < length_1; i++) {\n elements[i].setAttribute('fill', color);\n }\n };\n return Toolkit;\n}());\nexport { Toolkit };\n","import { EventHandler, Browser, createElement } from '@syncfusion/ej2-base';\nimport { getRectLocation, minMax, getElement, ChartLocation, RectOption } from '../../common/utils/helper';\nimport { Rect, measureText } from '@syncfusion/ej2-svg-base';\nimport { Toolkit } from './zooming-toolkit';\nimport { zoomComplete } from '../../common/model/constants';\nimport { withInBounds } from '../../common/utils/helper';\n/**\n * `Zooming` module handles the zooming for chart.\n */\nvar Zoom = /** @class */ (function () {\n /**\n * Constructor for Zooming module.\n * @private.\n */\n function Zoom(chart) {\n this.chart = chart;\n this.isPointer = Browser.isPointer;\n this.browserName = Browser.info.name;\n this.wheelEvent = this.browserName === 'mozilla' ? (this.isPointer ? 'mousewheel' : 'DOMMouseScroll') : 'mousewheel';\n this.cancelEvent = this.isPointer ? 'pointerleave' : 'mouseleave';\n this.addEventListener();\n this.isDevice = Browser.isDevice;\n var zooming = chart.zoomSettings;\n this.toolkit = new Toolkit(chart);\n this.zooming = zooming;\n this.elementId = chart.element.id;\n this.zoomingRect = new Rect(0, 0, 0, 0);\n this.zoomAxes = [];\n this.zoomkitOpacity = 0.3;\n this.isIOS = Browser.isIos || Browser.isIos7;\n this.isZoomed = this.performedUI = this.zooming.enablePan && this.zooming.enableSelectionZooming;\n if (zooming.enableScrollbar) {\n chart.scrollElement = createElement('div', { id: chart.element.id + '_scrollElement' });\n }\n }\n /**\n * Function that handles the Rectangular zooming.\n * @return {void}\n */\n Zoom.prototype.renderZooming = function (e, chart, isTouch) {\n this.calculateZoomAxesRange(chart, chart.axisCollections);\n if (this.zooming.enableSelectionZooming && (!isTouch\n || (chart.isDoubleTap && this.touchStartList.length === 1)) && (!this.isPanning || chart.isDoubleTap)) {\n this.isPanning = this.isDevice ? true : this.isPanning;\n this.performedUI = true;\n this.drawZoomingRectangle(chart);\n }\n else if (this.isPanning && chart.isChartDrag) {\n if (!isTouch || (isTouch && this.touchStartList.length === 1)) {\n this.pinchTarget = isTouch ? e.target : null;\n this.doPan(chart, chart.axisCollections);\n }\n }\n };\n // Zooming rectangle drawn here\n Zoom.prototype.drawZoomingRectangle = function (chart) {\n var areaBounds = chart.chartAxisLayoutPanel.seriesClipRect;\n var startLocation = new ChartLocation(chart.previousMouseMoveX, chart.previousMouseMoveY);\n var endLocation = new ChartLocation(chart.mouseX, chart.mouseY);\n var rect = this.zoomingRect = getRectLocation(startLocation, endLocation, areaBounds);\n if (rect.width > 0 && rect.height > 0) {\n this.isZoomed = true;\n chart.disableTrackTooltip = true;\n chart.svgObject.setAttribute('cursor', 'crosshair');\n if (this.zooming.mode === 'X') {\n rect.height = areaBounds.height;\n rect.y = areaBounds.y;\n }\n else if (this.zooming.mode === 'Y') {\n rect.width = areaBounds.width;\n rect.x = areaBounds.x;\n }\n chart.svgObject.appendChild(chart.renderer.drawRectangle(new RectOption(this.elementId + '_ZoomArea', chart.themeStyle.selectionRectFill, { color: chart.themeStyle.selectionRectStroke, width: 1 }, 1, rect, 0, 0, '', '3')));\n }\n };\n // Panning performed here\n Zoom.prototype.doPan = function (chart, axes) {\n if (chart.startMove && chart.crosshair.enable) {\n return null;\n }\n var currentScale;\n var offset;\n this.isZoomed = true;\n var translateX;\n var translateY;\n this.offset = !chart.delayRedraw ? chart.chartAxisLayoutPanel.seriesClipRect : this.offset;\n chart.delayRedraw = true;\n chart.disableTrackTooltip = true;\n var argsData;\n axes.forEach(function (axis) {\n argsData = {\n cancel: false, name: zoomComplete, axis: axis, previousZoomFactor: axis.zoomFactor, previousZoomPosition: axis.zoomPosition,\n currentZoomFactor: axis.zoomFactor, currentZoomPosition: axis.zoomPosition\n };\n currentScale = Math.max(1 / minMax(axis.zoomFactor, 0, 1), 1);\n if (axis.orientation === 'Horizontal') {\n offset = (chart.previousMouseMoveX - chart.mouseX) / axis.rect.width / currentScale;\n argsData.currentZoomPosition = minMax(axis.zoomPosition + offset, 0, (1 - axis.zoomFactor));\n }\n else {\n offset = (chart.previousMouseMoveY - chart.mouseY) / axis.rect.height / currentScale;\n argsData.currentZoomPosition = minMax(axis.zoomPosition - offset, 0, (1 - axis.zoomFactor));\n }\n chart.trigger(zoomComplete, argsData);\n if (!argsData.cancel) {\n axis.zoomFactor = argsData.currentZoomFactor;\n axis.zoomPosition = argsData.currentZoomPosition;\n }\n });\n if (this.zooming.enableDeferredZooming) {\n translateX = chart.mouseX - chart.mouseDownX;\n translateY = chart.mouseY - chart.mouseDownY;\n switch (this.zooming.mode) {\n case 'X':\n translateY = 0;\n break;\n case 'Y':\n translateX = 0;\n break;\n }\n this.setTransform(translateX, translateY, null, null, chart, false);\n this.refreshAxis(chart.chartAxisLayoutPanel, chart, chart.axisCollections);\n }\n else {\n this.performZoomRedraw(chart);\n }\n chart.previousMouseMoveX = chart.mouseX;\n chart.previousMouseMoveY = chart.mouseY;\n };\n /**\n * Redraw the chart on zooming.\n * @return {void}\n * @private\n */\n Zoom.prototype.performZoomRedraw = function (chart) {\n var rect = this.zoomingRect;\n chart.animateSeries = false;\n if (this.isZoomed) {\n if (rect.width > 0 && rect.height > 0) {\n this.performedUI = true;\n chart.svgObject.setAttribute('cursor', 'auto');\n this.doZoom(chart, chart.axisCollections, chart.chartAxisLayoutPanel.seriesClipRect);\n chart.isDoubleTap = false;\n }\n else if (chart.disableTrackTooltip) {\n chart.disableTrackTooltip = false;\n chart.delayRedraw = false;\n chart.removeSvg();\n chart.refreshAxis();\n chart.refreshBound();\n }\n }\n };\n Zoom.prototype.refreshAxis = function (layout, chart, axes) {\n var mode = chart.zoomSettings.mode;\n layout.measureAxis(new Rect(chart.initialClipRect.x, chart.initialClipRect.y, chart.initialClipRect.width, chart.initialClipRect.height));\n axes.map(function (axis, index) {\n if (axis.orientation === 'Horizontal' && mode !== 'Y') {\n layout.drawXAxisLabels(axis, index, null, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n }\n if (axis.orientation === 'Vertical' && mode !== 'X') {\n layout.drawYAxisLabels(axis, index, null, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n }\n });\n };\n // Rectangular zoom calculated here performed here\n Zoom.prototype.doZoom = function (chart, axes, bounds) {\n var zoomRect = this.zoomingRect;\n var mode = this.zooming.mode;\n var argsData;\n this.isPanning = chart.zoomSettings.enablePan || this.isPanning;\n axes.forEach(function (axis) {\n argsData = {\n cancel: false, name: zoomComplete, axis: axis, previousZoomFactor: axis.zoomFactor, previousZoomPosition: axis.zoomPosition,\n currentZoomFactor: axis.zoomFactor, currentZoomPosition: axis.zoomPosition\n };\n if (axis.orientation === 'Horizontal') {\n if (mode !== 'Y') {\n argsData.currentZoomPosition += Math.abs((zoomRect.x - bounds.x) / (bounds.width)) * axis.zoomFactor;\n argsData.currentZoomFactor *= (zoomRect.width / bounds.width);\n chart.trigger(zoomComplete, argsData);\n }\n }\n else {\n if (mode !== 'X') {\n argsData.currentZoomPosition += (1 - Math.abs((zoomRect.height + (zoomRect.y - bounds.y)) / (bounds.height)))\n * axis.zoomFactor;\n argsData.currentZoomFactor *= (zoomRect.height / bounds.height);\n chart.trigger(zoomComplete, argsData);\n }\n }\n if (!argsData.cancel) {\n axis.zoomFactor = argsData.currentZoomFactor;\n axis.zoomPosition = argsData.currentZoomPosition;\n }\n });\n this.zoomingRect = new Rect(0, 0, 0, 0);\n this.performZoomRedraw(chart);\n };\n /**\n * Function that handles the Mouse wheel zooming.\n * @return {void}\n * @private\n */\n Zoom.prototype.performMouseWheelZooming = function (e, mouseX, mouseY, chart, axes) {\n var direction = (this.browserName === 'mozilla' && !this.isPointer) ?\n -(e.detail) / 3 > 0 ? 1 : -1 : (e.wheelDelta / 120) > 0 ? 1 : -1;\n var mode = this.zooming.mode;\n var origin = 0.5;\n var cumulative;\n var zoomFactor;\n var zoomPosition;\n this.isZoomed = true;\n this.calculateZoomAxesRange(chart, chart.axisCollections);\n chart.disableTrackTooltip = true;\n this.performedUI = true;\n this.isPanning = chart.zoomSettings.enablePan || this.isPanning;\n var argsData;\n axes.forEach(function (axis) {\n argsData = {\n cancel: false, name: zoomComplete, axis: axis, previousZoomFactor: axis.zoomFactor, previousZoomPosition: axis.zoomPosition,\n currentZoomFactor: axis.zoomFactor, currentZoomPosition: axis.zoomPosition\n };\n if ((axis.orientation === 'Vertical' && mode !== 'X') ||\n (axis.orientation === 'Horizontal' && mode !== 'Y')) {\n cumulative = Math.max(Math.max(1 / minMax(axis.zoomFactor, 0, 1), 1) + (0.25 * direction), 1);\n if (cumulative >= 1) {\n origin = axis.orientation === 'Horizontal' ? mouseX / axis.rect.width : 1 - (mouseY / axis.rect.height);\n origin = origin > 1 ? 1 : origin < 0 ? 0 : origin;\n zoomFactor = (cumulative === 1) ? 1 : minMax(1 / cumulative, 0, 1);\n zoomPosition = (cumulative === 1) ? 0 : axis.zoomPosition + ((axis.zoomFactor - zoomFactor) * origin);\n if (axis.zoomPosition !== zoomPosition || axis.zoomFactor !== zoomFactor) {\n zoomFactor = (zoomPosition + zoomFactor) > 1 ? (1 - zoomPosition) : zoomFactor;\n }\n argsData.currentZoomFactor = zoomFactor;\n argsData.currentZoomPosition = zoomPosition;\n chart.trigger(zoomComplete, argsData);\n }\n if (!argsData.cancel) {\n axis.zoomFactor = argsData.currentZoomFactor;\n axis.zoomPosition = argsData.currentZoomPosition;\n }\n }\n });\n this.performZoomRedraw(chart);\n };\n /**\n * Function that handles the Pinch zooming.\n * @return {void}\n * @private\n */\n Zoom.prototype.performPinchZooming = function (e, chart) {\n if ((this.zoomingRect.width > 0 && this.zoomingRect.height > 0) || (chart.startMove && chart.crosshair.enable)) {\n return false;\n }\n this.calculateZoomAxesRange(chart, chart.axisCollections);\n this.isZoomed = true;\n this.isPanning = true;\n this.performedUI = true;\n this.offset = !chart.delayRedraw ? chart.chartAxisLayoutPanel.seriesClipRect : this.offset;\n chart.delayRedraw = true;\n chart.disableTrackTooltip = true;\n var elementOffset = chart.element.getBoundingClientRect();\n var touchDown = this.touchStartList;\n var touchMove = this.touchMoveList;\n var touch0StartX = touchDown[0].pageX - elementOffset.left;\n var touch0StartY = touchDown[0].pageY - elementOffset.top;\n var touch0EndX = touchMove[0].pageX - elementOffset.left;\n var touch0EndY = touchMove[0].pageY - elementOffset.top;\n var touch1StartX = touchDown[1].pageX - elementOffset.left;\n var touch1StartY = touchDown[1].pageY - elementOffset.top;\n var touch1EndX = touchMove[1].pageX - elementOffset.left;\n var touch1EndY = touchMove[1].pageY - elementOffset.top;\n var scaleX;\n var scaleY;\n var translateXValue;\n var translateYValue;\n var pinchRect;\n var clipX;\n var clipY;\n scaleX = Math.abs(touch0EndX - touch1EndX) / Math.abs(touch0StartX - touch1StartX);\n scaleY = Math.abs(touch0EndY - touch1EndY) / Math.abs(touch0StartY - touch1StartY);\n clipX = ((this.offset.x - touch0EndX) / scaleX) + touch0StartX;\n clipY = ((this.offset.y - touch0EndY) / scaleY) + touch0StartY;\n pinchRect = new Rect(clipX, clipY, this.offset.width / scaleX, this.offset.height / scaleY);\n translateXValue = (touch0EndX - (scaleX * touch0StartX));\n translateYValue = (touch0EndY - (scaleY * touch0StartY));\n if (!isNaN(scaleX - scaleX) && !isNaN(scaleY - scaleY)) {\n switch (this.zooming.mode) {\n case 'XY':\n this.setTransform(translateXValue, translateYValue, scaleX, scaleY, chart, true);\n break;\n case 'X':\n this.setTransform(translateXValue, 0, scaleX, 1, chart, true);\n break;\n case 'Y':\n this.setTransform(0, translateYValue, 1, scaleY, chart, true);\n break;\n }\n }\n this.calculatePinchZoomFactor(chart, pinchRect);\n this.refreshAxis(chart.chartAxisLayoutPanel, chart, chart.axisCollections);\n return true;\n };\n Zoom.prototype.calculatePinchZoomFactor = function (chart, pinchRect) {\n var _this = this;\n var mode = this.zooming.mode;\n var selectionMin;\n var selectionMax;\n var rangeMin;\n var rangeMax;\n var value;\n var axisTrans;\n var argsData;\n var currentZF;\n var currentZP;\n chart.axisCollections.forEach(function (axis, index) {\n if ((axis.orientation === 'Horizontal' && mode !== 'Y') ||\n (axis.orientation === 'Vertical' && mode !== 'X')) {\n currentZF = axis.zoomFactor;\n currentZP = axis.zoomPosition;\n argsData = {\n cancel: false, name: zoomComplete, axis: axis, previousZoomFactor: axis.zoomFactor,\n previousZoomPosition: axis.zoomPosition, currentZoomFactor: currentZF, currentZoomPosition: currentZP\n };\n if (axis.orientation === 'Horizontal') {\n value = pinchRect.x - _this.offset.x;\n axisTrans = axis.rect.width / _this.zoomAxes[index].delta;\n rangeMin = value / axisTrans + _this.zoomAxes[index].min;\n value = pinchRect.x + pinchRect.width - _this.offset.x;\n rangeMax = value / axisTrans + _this.zoomAxes[index].min;\n }\n else {\n value = pinchRect.y - _this.offset.y;\n axisTrans = axis.rect.height / _this.zoomAxes[index].delta;\n rangeMin = (value * -1 + axis.rect.height) / axisTrans + _this.zoomAxes[index].min;\n value = pinchRect.y + pinchRect.height - _this.offset.y;\n rangeMax = (value * -1 + axis.rect.height) / axisTrans + _this.zoomAxes[index].min;\n }\n selectionMin = Math.min(rangeMin, rangeMax);\n selectionMax = Math.max(rangeMin, rangeMax);\n currentZP = (selectionMin - _this.zoomAxes[index].actualMin) / _this.zoomAxes[index].actualDelta;\n currentZF = (selectionMax - selectionMin) / _this.zoomAxes[index].actualDelta;\n argsData.currentZoomPosition = currentZP < 0 ? 0 : currentZP;\n argsData.currentZoomFactor = currentZF > 1 ? 1 : currentZF;\n chart.trigger(zoomComplete, argsData);\n if (!argsData.cancel) {\n axis.zoomFactor = argsData.currentZoomFactor;\n axis.zoomPosition = argsData.currentZoomPosition;\n }\n }\n });\n };\n // Series transformation style applied here.\n Zoom.prototype.setTransform = function (transX, transY, scaleX, scaleY, chart, isPinch) {\n chart.seriesElements.setAttribute('clip-path', 'url(#' + this.elementId + '_ChartAreaClipRect_)');\n if (chart.indicatorElements) {\n chart.indicatorElements.setAttribute('clip-path', 'url(#' + this.elementId + '_ChartAreaClipRect_)');\n }\n var translate;\n var xAxisLoc;\n var yAxisLoc;\n var element;\n if (transX !== null && transY !== null) {\n chart.visibleSeries.forEach(function (value) {\n xAxisLoc = chart.requireInvertedAxis ? value.yAxis.rect.x : value.xAxis.rect.x;\n yAxisLoc = chart.requireInvertedAxis ? value.xAxis.rect.y : value.yAxis.rect.y;\n translate = 'translate(' + (transX + (isPinch ? (scaleX * xAxisLoc) : xAxisLoc)) +\n ',' + (transY + (isPinch ? (scaleY * yAxisLoc) : yAxisLoc)) + ')';\n translate = (scaleX || scaleY) ? translate + ' scale(' + scaleX + ' ' + scaleY + ')' : translate;\n if (value.visible) {\n if (value.category === 'Indicator') {\n value.seriesElement.parentNode.setAttribute('transform', translate);\n }\n else {\n value.seriesElement.setAttribute('transform', translate);\n }\n element = getElement(chart.element.id + '_Series_' + value.index + '_DataLabelCollections');\n if (value.errorBarElement) {\n value.errorBarElement.setAttribute('transform', translate);\n }\n if (value.symbolElement) {\n value.symbolElement.setAttribute('transform', translate);\n }\n if (value.textElement) {\n value.textElement.setAttribute('visibility', 'hidden');\n value.shapeElement.setAttribute('visibility', 'hidden');\n }\n if (element) {\n element.style.visibility = 'hidden';\n }\n }\n });\n }\n };\n Zoom.prototype.calculateZoomAxesRange = function (chart, axes) {\n var _this = this;\n var range;\n var axisRange;\n chart.axisCollections.forEach(function (axis, index) {\n axisRange = axis.visibleRange;\n if (_this.zoomAxes[index]) {\n if (!chart.delayRedraw) {\n _this.zoomAxes[index].min = axisRange.min;\n _this.zoomAxes[index].delta = axisRange.delta;\n }\n }\n else {\n range = {\n actualMin: axis.actualRange.min,\n actualDelta: axis.actualRange.delta,\n min: axisRange.min,\n delta: axisRange.delta\n };\n _this.zoomAxes[index] = range;\n }\n });\n };\n // Zooming Toolkit created here\n Zoom.prototype.showZoomingToolkit = function (chart) {\n var toolboxItems = this.zooming.toolbarItems;\n var areaBounds = chart.chartAxisLayoutPanel.seriesClipRect;\n var spacing = 5;\n var render = chart.renderer;\n var length = this.isDevice ? 1 : toolboxItems.length;\n var iconSize = this.isDevice ? measureText('Reset Zoom', { size: '12px' }).width : 16;\n var height = this.isDevice ? measureText('Reset Zoom', { size: '12px' }).height : 22;\n var width = (length * iconSize) + ((length + 1) * spacing) + ((length - 1) * spacing);\n var transX = areaBounds.x + areaBounds.width - width - spacing;\n var transY = (areaBounds.y + spacing);\n var xPosition = spacing;\n var outerElement;\n var toolkit = this.toolkit;\n var element;\n var shadowElement = '';\n shadowElement += '';\n shadowElement += '
';\n div = div + rightArrow;\n div = div + 'left:' + (data.parentWidth - (((data.parentLeft + data.parentWidth) - data.childLeft) + 10)) + 'px;' +\n this.getBorderStyles('left', 10) + 'border-bottom-width:' + (5 + this.lineStroke) + 'px;' +\n 'border-top-width:' + (5 + this.lineStroke) + 'px;top:' + (-6 - this.lineStroke) +\n 'px;width:0;height:0;position:relative;\">High : ${point.high}
Low : ${point.low}');\n case 'HighLowOpenClose':\n return format + ('
High : ${point.high}
Low : ${point.low}
' +\n 'Open : ${point.open}
Close : ${point.close}');\n case 'BoxPlot': {\n return format + '
' + (this.lierIndex > 3 ? 'Outliers : ${point.outliers}' :\n 'Maximum : ${point.maximum}
Q3 : ${point.upperQuartile}
' +\n 'Median : ${point.median}
Q1 : ${point.lowerQuartile}
Minimum : ${point.minimum}');\n }\n }\n return '';\n };\n Tooltip.prototype.getIndicatorTooltipFormat = function (series, chart, format) {\n var toolTip;\n var points = [];\n if (series.seriesType === 'XY') {\n toolTip = series.name + ' : ${point.y}';\n }\n else {\n toolTip = format;\n }\n return toolTip;\n };\n /*\n * @hidden\n */\n Tooltip.prototype.removeHighlightedMarker = function (data) {\n for (var _i = 0, data_1 = data; _i < data_1.length; _i++) {\n var item = data_1[_i];\n removeElement(this.element.id + '_Series_' + item.series.index +\n '_Point_' + item.point.index + '_Trackball');\n }\n if (this.chart.markerRender) {\n this.chart.markerRender.removeHighlightedMarker();\n }\n this.previousPoints = [];\n };\n /**\n * Get module name.\n */\n Tooltip.prototype.getModuleName = function () {\n /**\n * Returns the module name\n */\n return 'Tooltip';\n };\n /**\n * To destroy the tooltip.\n * @return {void}\n * @private\n */\n Tooltip.prototype.destroy = function (chart) {\n /**\n * Destroy method performed here\n */\n };\n return Tooltip;\n}(BaseTooltip));\nexport { Tooltip };\n","import { EventHandler } from '@syncfusion/ej2-base';\nimport { remove } from '@syncfusion/ej2-base';\nimport { removeElement, RectOption, PolygonOption, createTooltip, minMax, getElement } from '../../common/utils/helper';\nimport { textElement, } from '../../common/utils/helper';\nimport { PathOption, Rect, measureText, TextOption } from '@syncfusion/ej2-svg-base';\nimport { zoomComplete } from '../../common/model/constants';\n/**\n * Zooming Toolkit created here\n * @private\n */\nvar Toolkit = /** @class */ (function () {\n /** @private */\n function Toolkit(chart) {\n this.iconRectOverFill = 'transparent';\n this.iconRectSelectionFill = 'transparent';\n this.chart = chart;\n this.elementId = chart.element.id;\n this.selectionColor = chart.theme === 'Bootstrap4' ? '#FFFFFF' : '#ff4081';\n this.fillColor = chart.theme === 'Bootstrap4' ? '#495057' : '#737373';\n this.iconRectOverFill = chart.theme === 'Bootstrap4' ? '#5A6268' : this.iconRectOverFill;\n this.iconRectSelectionFill = chart.theme === 'Bootstrap4' ? '#5B6269' : this.iconRectSelectionFill;\n this.iconRect = chart.theme === 'Bootstrap4' ? new Rect(-5, -5, 26, 26) : new Rect(0, 0, 16, 16);\n }\n /**\n * To create the pan button.\n * @return {void}\n * @private\n */\n Toolkit.prototype.createPanButton = function (childElement, parentElement, chart) {\n var render = this.chart.renderer;\n var fillColor = this.chart.zoomModule.isPanning ? this.selectionColor : this.fillColor;\n var direction = 'M5,3h2.3L7.275,5.875h1.4L8.65,3H11L8,0L5,3z M3,11V8.7l2.875,0.025v-1.4L3,7.35V5L0,8L3,';\n direction += '11z M11,13H8.7l0.025-2.875h-1.4L7.35,13H5l3,3L11,13z M13,5v2.3l-2.875-0.025v1.4L13,8.65V11l3-3L13,5z';\n childElement.id = this.elementId + '_Zooming_Pan';\n childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('Pan'));\n this.panElements = childElement;\n childElement.appendChild(render.drawRectangle(new RectOption(this.elementId + '_Zooming_Pan_1', 'transparent', {}, 1, this.iconRect)));\n childElement.appendChild(render.drawPath(new PathOption(this.elementId + '_Zooming_Pan_2', fillColor, null, null, 1, null, direction)));\n parentElement.appendChild(childElement);\n this.wireEvents(childElement, this.pan);\n };\n /**\n * To create the zoom button.\n * @return {void}\n * @private\n */\n Toolkit.prototype.createZoomButton = function (childElement, parentElement, chart) {\n var render = this.chart.renderer;\n var fillColor = this.chart.zoomModule.isPanning ? this.fillColor : this.selectionColor;\n var rectColor = this.chart.zoomModule.isPanning ? 'transparent' : this.iconRectSelectionFill;\n var direction = 'M0.001,14.629L1.372,16l4.571-4.571v-0.685l0.228-0.274c1.051,0.868,2.423,1.417,3.885,1.417c3.291,0,';\n direction += '5.943-2.651,5.943-5.943S13.395,0,10.103,0S4.16,2.651,4.16,5.943c0,1.508,0.503,2.834,1.417,3.885l-0.274,0.228H4.571';\n direction = direction + 'L0.001,14.629L0.001,14.629z M5.943,5.943c0-2.285,1.828-4.114,4.114-4.114s4.114,1.828,4.114,';\n childElement.id = this.elementId + '_Zooming_Zoom';\n childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('Zoom'));\n this.zoomElements = childElement;\n this.selectedID = this.chart.zoomModule.isPanning ? this.chart.element.id + '_Zooming_Pan_1' : this.elementId + '_Zooming_Zoom_1';\n childElement.appendChild(render.drawRectangle(new RectOption(this.elementId + '_Zooming_Zoom_1', rectColor, {}, 1, this.iconRect)));\n childElement.appendChild(render.drawPath(new PathOption(this.elementId + '_Zooming_Zoom_3', fillColor, null, null, 1, null, direction + '4.114s-1.828,4.114-4.114,4.114S5.943,8.229,5.943,5.943z')));\n parentElement.appendChild(childElement);\n this.wireEvents(childElement, this.zoom);\n };\n /**\n * To create the ZoomIn button.\n * @return {void}\n * @private\n */\n Toolkit.prototype.createZoomInButton = function (childElement, parentElement, chart) {\n var render = this.chart.renderer;\n var fillColor = this.fillColor;\n var direction = 'M10.103,0C6.812,0,4.16,2.651,4.16,5.943c0,1.509,0.503,2.834,1.417,3.885l-0.274,0.229H4.571L0,';\n direction += '14.628l0,0L1.372,16l4.571-4.572v-0.685l0.228-0.275c1.052,0.868,2.423,1.417,3.885,1.417c3.291,0,5.943-2.651,';\n direction += '5.943-5.943C16,2.651,13.395,0,10.103,0z M10.058,10.058c-2.286,0-4.114-1.828-4.114-4.114c0-2.286,1.828-4.114,';\n childElement.id = this.elementId + '_Zooming_ZoomIn';\n childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('ZoomIn'));\n var polygonDirection = '12.749,5.466 10.749,5.466 10.749,3.466 9.749,3.466 9.749,5.466 7.749,5.466 7.749,6.466';\n childElement.appendChild(render.drawRectangle(new RectOption(this.elementId + '_Zooming_ZoomIn_1', 'transparent', {}, 1, this.iconRect)));\n childElement.appendChild(render.drawPath(new PathOption(this.elementId + '_Zooming_ZoomIn_2', fillColor, null, null, 1, null, direction + '4.114-4.114c2.286,0,4.114,1.828,4.114,4.114C14.172,8.229,12.344,10.058,10.058,10.058z')));\n childElement.appendChild(render.drawPolygon(new PolygonOption(this.elementId + '_Zooming_ZoomIn_3', polygonDirection + ' 9.749,6.466 9.749,8.466 10.749,8.466 10.749,6.466 12.749,6.466', fillColor)));\n this.zoomInElements = childElement;\n this.elementOpacity = chart.zoomModule.isPanning ? '0.2' : '1';\n childElement.setAttribute('opacity', this.elementOpacity);\n parentElement.appendChild(childElement);\n this.wireEvents(childElement, this.zoomIn);\n };\n /**\n * To create the ZoomOut button.\n * @return {void}\n * @private\n */\n Toolkit.prototype.createZoomOutButton = function (childElement, parentElement, chart) {\n var render = this.chart.renderer;\n var fillColor = this.fillColor;\n var direction = 'M0,14.622L1.378,16l4.533-4.533v-0.711l0.266-0.266c1.022,0.889,2.4,1.422,3.866,';\n direction += '1.422c3.289,0,5.955-2.666,5.955-5.955S13.333,0,10.044,0S4.089,2.667,4.134,5.911c0,1.466,0.533,2.844,';\n direction += '1.422,3.866l-0.266,0.266H4.578L0,14.622L0,14.622z M5.911,5.911c0-2.311,1.822-4.133,4.133-4.133s4.133,1.822,4.133,';\n childElement.id = this.elementId + '_Zooming_ZoomOut';\n childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('ZoomOut'));\n childElement.appendChild(render.drawRectangle(new RectOption(this.elementId + '_Zooming_ZoomOut_1', 'transparent', {}, 1, this.iconRect)));\n childElement.appendChild(render.drawPath(new PathOption(this.elementId + '_Zooming_ZoomOut_2', fillColor, null, null, 1, null, direction + '4.133s-1.866,4.133-4.133,4.133S5.911,8.222,5.911,5.911z M12.567,6.466h-5v-1h5V6.466z')));\n this.zoomOutElements = childElement;\n this.elementOpacity = chart.zoomModule.isPanning ? '0.2' : '1';\n childElement.setAttribute('opacity', this.elementOpacity);\n parentElement.appendChild(childElement);\n this.wireEvents(childElement, this.zoomOut);\n };\n /**\n * To create the Reset button.\n * @return {void}\n * @private\n */\n Toolkit.prototype.createResetButton = function (childElement, parentElement, chart, isDevice) {\n var render = this.chart.renderer;\n var fillColor = this.fillColor;\n var size;\n var direction = 'M12.364,8h-2.182l2.909,3.25L16,8h-2.182c0-3.575-2.618-6.5-5.818-6.5c-1.128,0-2.218,0.366-3.091,';\n direction += '1.016l1.055,1.178C6.581,3.328,7.272,3.125,8,3.125C10.4,3.125,12.363,5.319,12.364,8L12.364,8z M11.091,';\n direction += '13.484l-1.055-1.178C9.419,12.672,8.728,12.875,8,12.875c-2.4,0-4.364-2.194-4.364-4.875h2.182L2.909,4.75L0,8h2.182c0,';\n childElement.id = this.elementId + '_Zooming_Reset';\n childElement.setAttribute('aria-label', this.chart.getLocalizedLabel('Reset'));\n if (!isDevice) {\n childElement.appendChild(render.drawRectangle(new RectOption(this.elementId + '_Zooming_Reset_1', 'transparent', {}, 1, this.iconRect)));\n childElement.appendChild(render.drawPath(new PathOption(this.elementId + '_Zooming_Reset_2', fillColor, null, null, 1, null, direction + '3.575,2.618,6.5,5.818,6.5C9.128,14.5,10.219,14.134,11.091,13.484L11.091,13.484z')));\n }\n else {\n size = measureText(this.chart.getLocalizedLabel('ResetZoom'), { size: '12px' });\n childElement.appendChild(render.drawRectangle(new RectOption(this.elementId + '_Zooming_Reset_1', 'transparent', {}, 1, new Rect(0, 0, size.width, size.height))));\n textElement(new TextOption(this.elementId + '_Zooming_Reset_2', 0 + size.width / 2, 0 + size.height * 3 / 4, 'middle', this.chart.getLocalizedLabel('ResetZoom'), 'rotate(0,' + (0) + ',' + (0) + ')', 'auto'), { size: '12px' }, 'black', childElement);\n }\n parentElement.appendChild(childElement);\n this.wireEvents(childElement, this.reset);\n };\n /**\n * To bind events.\n * @return {void}\n * @private\n */\n Toolkit.prototype.wireEvents = function (element, process) {\n EventHandler.add(element, 'mousedown touchstart', process, this);\n EventHandler.add(element, 'mouseover', this.showTooltip, this);\n EventHandler.add(element, 'mouseout', this.removeTooltip, this);\n };\n /**\n * To show tooltip.\n * @return {void}\n * @private\n */\n Toolkit.prototype.showTooltip = function (event) {\n var text = event.currentTarget.id.split('_Zooming_')[1];\n var left = (event.pageX - (measureText(text, { size: '10px' }).width + 5));\n var rect = getElement(event.currentTarget.id + '_1');\n var icon2 = getElement(event.currentTarget.id + '_2');\n var icon3 = getElement(event.currentTarget.id + '_3');\n if (rect) {\n this.hoveredID = rect.id;\n rect.setAttribute('fill', this.iconRectOverFill);\n }\n if (icon2) {\n icon2.setAttribute('fill', this.selectionColor);\n }\n if (icon3) {\n icon3.setAttribute('fill', this.selectionColor);\n }\n if (!this.chart.isTouch) {\n createTooltip('EJ2_Chart_ZoomTip', this.chart.getLocalizedLabel(text), (event.pageY + 10), left, '10px');\n }\n };\n /** @private */\n // tslint:disable\n Toolkit.prototype.removeTooltip = function () {\n if (getElement(this.hoveredID)) {\n var rectColor = this.chart.zoomModule.isPanning ? (this.hoveredID.indexOf('_Pan_') > -1) ? this.iconRectSelectionFill : 'transparent' : (this.hoveredID.indexOf('_Zoom_') > -1) ? this.iconRectSelectionFill : 'transparent';\n getElement(this.hoveredID).setAttribute('fill', rectColor);\n }\n var icon2 = this.hoveredID ? getElement(this.hoveredID.replace('_1', '_2')) : null;\n var icon3 = this.hoveredID ? getElement(this.hoveredID.replace('_1', '_3')) : null;\n if (icon2) {\n var iconColor = this.chart.zoomModule.isPanning ? (this.hoveredID.indexOf('_Pan_') > -1) ? this.selectionColor : this.fillColor : (this.hoveredID.indexOf('_Zoom_') > -1) ? this.selectionColor : this.fillColor;\n icon2.setAttribute('fill', iconColor);\n }\n if (icon3) {\n var iconColor = this.chart.zoomModule.isPanning ? this.fillColor : (this.hoveredID.indexOf('_Zoom_') > -1) ? this.selectionColor : this.fillColor;\n icon3.setAttribute('fill', iconColor);\n }\n removeElement('EJ2_Chart_ZoomTip');\n };\n // Toolkit events function calculation here.\n /** @private */\n Toolkit.prototype.reset = function () {\n var chart = this.chart;\n if (!chart.zoomModule.isDevice) {\n remove(chart.zoomModule.toolkitElements);\n }\n var argsData;\n this.removeTooltip();\n chart.svgObject.setAttribute('cursor', 'auto');\n chart.axisCollections.forEach(function (axis) {\n argsData = {\n cancel: false, name: zoomComplete, axis: axis, previousZoomFactor: axis.zoomFactor, previousZoomPosition: axis.zoomPosition,\n currentZoomFactor: 1, currentZoomPosition: 0\n };\n axis.zoomFactor = 1;\n axis.zoomPosition = 0;\n if (axis.zoomingScrollBar) {\n axis.zoomingScrollBar.isScrollUI = false;\n }\n chart.trigger(zoomComplete, argsData);\n if (!argsData.cancel) {\n axis.zoomFactor = argsData.currentZoomFactor;\n axis.zoomPosition = argsData.currentZoomPosition;\n }\n });\n chart.disableTrackTooltip = false;\n chart.zoomModule.isZoomed = chart.zoomModule.isPanning = chart.isChartDrag = chart.delayRedraw = false;\n chart.zoomModule.touchMoveList = chart.zoomModule.touchStartList = [];\n chart.zoomModule.pinchTarget = null;\n chart.removeSvg();\n chart.refreshAxis();\n chart.refreshBound();\n this.elementOpacity = '1';\n return false;\n };\n Toolkit.prototype.zoomIn = function (e) {\n this.zoomInOutCalculation(1, this.chart, this.chart.axisCollections, this.chart.zoomSettings.mode);\n return false;\n };\n Toolkit.prototype.zoomOut = function (e) {\n this.zoomInOutCalculation(-1, this.chart, this.chart.axisCollections, this.chart.zoomSettings.mode);\n return false;\n };\n Toolkit.prototype.zoom = function (e) {\n this.chart.zoomModule.isPanning = false;\n var zoomModule = this.chart.zoomModule;\n this.elementOpacity = '1';\n this.chart.svgObject.setAttribute('cursor', 'auto');\n this.zoomInElements.setAttribute('opacity', this.elementOpacity);\n this.zoomOutElements.setAttribute('opacity', this.elementOpacity);\n this.applySelection(this.zoomElements.childNodes, this.selectionColor);\n this.applySelection(this.panElements.childNodes, '#737373');\n if (getElement(this.selectedID)) {\n getElement(this.selectedID).setAttribute('fill', 'transparent');\n }\n this.selectedID = this.chart.element.id + '_Zooming_Zoom_1';\n getElement(this.selectedID).setAttribute('fill', this.iconRectSelectionFill);\n return false;\n };\n /** @private */\n Toolkit.prototype.pan = function () {\n var element;\n this.chart.zoomModule.isPanning = true;\n this.chart.svgObject.setAttribute('cursor', 'pointer');\n this.elementOpacity = '0.2';\n element = this.zoomInElements ? this.zoomInElements.setAttribute('opacity', this.elementOpacity) : null;\n element = this.zoomOutElements ? this.zoomOutElements.setAttribute('opacity', this.elementOpacity) : null;\n element = this.panElements ? this.applySelection(this.panElements.childNodes, this.selectionColor) : null;\n element = this.zoomElements ? this.applySelection(this.zoomElements.childNodes, '#737373') : null;\n if (getElement(this.selectedID)) {\n getElement(this.selectedID).setAttribute('fill', 'transparent');\n }\n this.selectedID = this.chart.element.id + '_Zooming_Pan_1';\n getElement(this.selectedID).setAttribute('fill', this.iconRectSelectionFill);\n return false;\n };\n Toolkit.prototype.zoomInOutCalculation = function (scale, chart, axes, mode) {\n if (!chart.zoomModule.isPanning && this.elementOpacity !== '0.2') {\n var zoomFactor_1;\n var zoomPosition_1;\n var cumulative_1;\n chart.disableTrackTooltip = true;\n chart.delayRedraw = true;\n var argsData_1;\n axes.forEach(function (axis) {\n argsData_1 = {\n cancel: false, name: zoomComplete, axis: axis, previousZoomFactor: axis.zoomFactor,\n previousZoomPosition: axis.zoomPosition, currentZoomFactor: axis.zoomFactor, currentZoomPosition: axis.zoomPosition\n };\n if ((axis.orientation === 'Horizontal' && mode !== 'Y') ||\n (axis.orientation === 'Vertical' && mode !== 'X')) {\n cumulative_1 = Math.max(Math.max(1 / minMax(axis.zoomFactor, 0, 1), 1) + (0.25 * scale), 1);\n zoomFactor_1 = (cumulative_1 === 1) ? 1 : minMax(1 / cumulative_1, 0, 1);\n zoomPosition_1 = (cumulative_1 === 1) ? 0 : axis.zoomPosition + ((axis.zoomFactor - zoomFactor_1) * 0.5);\n if (axis.zoomPosition !== zoomPosition_1 || axis.zoomFactor !== zoomFactor_1) {\n zoomFactor_1 = (zoomPosition_1 + zoomFactor_1) > 1 ? (1 - zoomPosition_1) : zoomFactor_1;\n }\n argsData_1.currentZoomFactor = zoomFactor_1;\n argsData_1.currentZoomPosition = zoomPosition_1;\n chart.trigger(zoomComplete, argsData_1);\n if (!argsData_1.cancel) {\n axis.zoomFactor = argsData_1.currentZoomFactor;\n axis.zoomPosition = argsData_1.currentZoomPosition;\n }\n }\n });\n }\n };\n Toolkit.prototype.applySelection = function (elements, color) {\n for (var i = 1, length_1 = elements.length; i < length_1; i++) {\n elements[i].setAttribute('fill', color);\n }\n };\n return Toolkit;\n}());\nexport { Toolkit };\n","import { EventHandler, Browser, createElement } from '@syncfusion/ej2-base';\nimport { getRectLocation, minMax, getElement, ChartLocation, RectOption } from '../../common/utils/helper';\nimport { Rect, measureText } from '@syncfusion/ej2-svg-base';\nimport { Toolkit } from './zooming-toolkit';\nimport { zoomComplete } from '../../common/model/constants';\nimport { withInBounds } from '../../common/utils/helper';\n/**\n * `Zooming` module handles the zooming for chart.\n */\nvar Zoom = /** @class */ (function () {\n /**\n * Constructor for Zooming module.\n * @private.\n */\n function Zoom(chart) {\n this.chart = chart;\n this.isPointer = Browser.isPointer;\n this.browserName = Browser.info.name;\n this.wheelEvent = this.browserName === 'mozilla' ? (this.isPointer ? 'mousewheel' : 'DOMMouseScroll') : 'mousewheel';\n this.cancelEvent = this.isPointer ? 'pointerleave' : 'mouseleave';\n this.addEventListener();\n this.isDevice = Browser.isDevice;\n var zooming = chart.zoomSettings;\n this.toolkit = new Toolkit(chart);\n this.zooming = zooming;\n this.elementId = chart.element.id;\n this.zoomingRect = new Rect(0, 0, 0, 0);\n this.zoomAxes = [];\n this.zoomkitOpacity = 0.3;\n this.isIOS = Browser.isIos || Browser.isIos7;\n this.isZoomed = this.performedUI = this.zooming.enablePan && this.zooming.enableSelectionZooming;\n if (zooming.enableScrollbar) {\n chart.scrollElement = createElement('div', { id: chart.element.id + '_scrollElement' });\n }\n }\n /**\n * Function that handles the Rectangular zooming.\n * @return {void}\n */\n Zoom.prototype.renderZooming = function (e, chart, isTouch) {\n this.calculateZoomAxesRange(chart, chart.axisCollections);\n if (this.zooming.enableSelectionZooming && (!isTouch\n || (chart.isDoubleTap && this.touchStartList.length === 1)) && (!this.isPanning || chart.isDoubleTap)) {\n this.isPanning = this.isDevice ? true : this.isPanning;\n this.performedUI = true;\n this.drawZoomingRectangle(chart);\n }\n else if (this.isPanning && chart.isChartDrag) {\n if (!isTouch || (isTouch && this.touchStartList.length === 1)) {\n this.pinchTarget = isTouch ? e.target : null;\n this.doPan(chart, chart.axisCollections);\n }\n }\n };\n // Zooming rectangle drawn here\n Zoom.prototype.drawZoomingRectangle = function (chart) {\n var areaBounds = chart.chartAxisLayoutPanel.seriesClipRect;\n var startLocation = new ChartLocation(chart.previousMouseMoveX, chart.previousMouseMoveY);\n var endLocation = new ChartLocation(chart.mouseX, chart.mouseY);\n var rect = this.zoomingRect = getRectLocation(startLocation, endLocation, areaBounds);\n if (rect.width > 0 && rect.height > 0) {\n this.isZoomed = true;\n chart.disableTrackTooltip = true;\n chart.svgObject.setAttribute('cursor', 'crosshair');\n if (this.zooming.mode === 'X') {\n rect.height = areaBounds.height;\n rect.y = areaBounds.y;\n }\n else if (this.zooming.mode === 'Y') {\n rect.width = areaBounds.width;\n rect.x = areaBounds.x;\n }\n chart.svgObject.appendChild(chart.renderer.drawRectangle(new RectOption(this.elementId + '_ZoomArea', chart.themeStyle.selectionRectFill, { color: chart.themeStyle.selectionRectStroke, width: 1 }, 1, rect, 0, 0, '', '3')));\n }\n };\n // Panning performed here\n Zoom.prototype.doPan = function (chart, axes) {\n if (chart.startMove && chart.crosshair.enable) {\n return null;\n }\n var currentScale;\n var offset;\n this.isZoomed = true;\n var translateX;\n var translateY;\n this.offset = !chart.delayRedraw ? chart.chartAxisLayoutPanel.seriesClipRect : this.offset;\n chart.delayRedraw = true;\n chart.disableTrackTooltip = true;\n var argsData;\n axes.forEach(function (axis) {\n argsData = {\n cancel: false, name: zoomComplete, axis: axis, previousZoomFactor: axis.zoomFactor, previousZoomPosition: axis.zoomPosition,\n currentZoomFactor: axis.zoomFactor, currentZoomPosition: axis.zoomPosition\n };\n currentScale = Math.max(1 / minMax(axis.zoomFactor, 0, 1), 1);\n if (axis.orientation === 'Horizontal') {\n offset = (chart.previousMouseMoveX - chart.mouseX) / axis.rect.width / currentScale;\n argsData.currentZoomPosition = minMax(axis.zoomPosition + offset, 0, (1 - axis.zoomFactor));\n }\n else {\n offset = (chart.previousMouseMoveY - chart.mouseY) / axis.rect.height / currentScale;\n argsData.currentZoomPosition = minMax(axis.zoomPosition - offset, 0, (1 - axis.zoomFactor));\n }\n chart.trigger(zoomComplete, argsData);\n if (!argsData.cancel) {\n axis.zoomFactor = argsData.currentZoomFactor;\n axis.zoomPosition = argsData.currentZoomPosition;\n }\n });\n if (this.zooming.enableDeferredZooming) {\n translateX = chart.mouseX - chart.mouseDownX;\n translateY = chart.mouseY - chart.mouseDownY;\n switch (this.zooming.mode) {\n case 'X':\n translateY = 0;\n break;\n case 'Y':\n translateX = 0;\n break;\n }\n this.setTransform(translateX, translateY, null, null, chart, false);\n this.refreshAxis(chart.chartAxisLayoutPanel, chart, chart.axisCollections);\n }\n else {\n this.performZoomRedraw(chart);\n }\n chart.previousMouseMoveX = chart.mouseX;\n chart.previousMouseMoveY = chart.mouseY;\n };\n /**\n * Redraw the chart on zooming.\n * @return {void}\n * @private\n */\n Zoom.prototype.performZoomRedraw = function (chart) {\n var rect = this.zoomingRect;\n chart.animateSeries = false;\n if (this.isZoomed) {\n if (rect.width > 0 && rect.height > 0) {\n this.performedUI = true;\n chart.svgObject.setAttribute('cursor', 'auto');\n this.doZoom(chart, chart.axisCollections, chart.chartAxisLayoutPanel.seriesClipRect);\n chart.isDoubleTap = false;\n }\n else if (chart.disableTrackTooltip) {\n chart.disableTrackTooltip = false;\n chart.delayRedraw = false;\n chart.removeSvg();\n chart.refreshAxis();\n chart.refreshBound();\n }\n }\n };\n Zoom.prototype.refreshAxis = function (layout, chart, axes) {\n var mode = chart.zoomSettings.mode;\n layout.measureAxis(new Rect(chart.initialClipRect.x, chart.initialClipRect.y, chart.initialClipRect.width, chart.initialClipRect.height));\n axes.map(function (axis, index) {\n if (axis.orientation === 'Horizontal' && mode !== 'Y') {\n layout.drawXAxisLabels(axis, index, null, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n }\n if (axis.orientation === 'Vertical' && mode !== 'X') {\n layout.drawYAxisLabels(axis, index, null, (axis.placeNextToAxisLine ? axis.updatedRect : axis.rect));\n }\n });\n };\n // Rectangular zoom calculated here performed here\n Zoom.prototype.doZoom = function (chart, axes, bounds) {\n var zoomRect = this.zoomingRect;\n var mode = this.zooming.mode;\n var argsData;\n this.isPanning = chart.zoomSettings.enablePan || this.isPanning;\n axes.forEach(function (axis) {\n argsData = {\n cancel: false, name: zoomComplete, axis: axis, previousZoomFactor: axis.zoomFactor, previousZoomPosition: axis.zoomPosition,\n currentZoomFactor: axis.zoomFactor, currentZoomPosition: axis.zoomPosition\n };\n if (axis.orientation === 'Horizontal') {\n if (mode !== 'Y') {\n argsData.currentZoomPosition += Math.abs((zoomRect.x - bounds.x) / (bounds.width)) * axis.zoomFactor;\n argsData.currentZoomFactor *= (zoomRect.width / bounds.width);\n chart.trigger(zoomComplete, argsData);\n }\n }\n else {\n if (mode !== 'X') {\n argsData.currentZoomPosition += (1 - Math.abs((zoomRect.height + (zoomRect.y - bounds.y)) / (bounds.height)))\n * axis.zoomFactor;\n argsData.currentZoomFactor *= (zoomRect.height / bounds.height);\n chart.trigger(zoomComplete, argsData);\n }\n }\n if (!argsData.cancel) {\n axis.zoomFactor = argsData.currentZoomFactor;\n axis.zoomPosition = argsData.currentZoomPosition;\n }\n });\n this.zoomingRect = new Rect(0, 0, 0, 0);\n this.performZoomRedraw(chart);\n };\n /**\n * Function that handles the Mouse wheel zooming.\n * @return {void}\n * @private\n */\n Zoom.prototype.performMouseWheelZooming = function (e, mouseX, mouseY, chart, axes) {\n var direction = (this.browserName === 'mozilla' && !this.isPointer) ?\n -(e.detail) / 3 > 0 ? 1 : -1 : (e.wheelDelta / 120) > 0 ? 1 : -1;\n var mode = this.zooming.mode;\n var origin = 0.5;\n var cumulative;\n var zoomFactor;\n var zoomPosition;\n this.isZoomed = true;\n this.calculateZoomAxesRange(chart, chart.axisCollections);\n chart.disableTrackTooltip = true;\n this.performedUI = true;\n this.isPanning = chart.zoomSettings.enablePan || this.isPanning;\n var argsData;\n axes.forEach(function (axis) {\n argsData = {\n cancel: false, name: zoomComplete, axis: axis, previousZoomFactor: axis.zoomFactor, previousZoomPosition: axis.zoomPosition,\n currentZoomFactor: axis.zoomFactor, currentZoomPosition: axis.zoomPosition\n };\n if ((axis.orientation === 'Vertical' && mode !== 'X') ||\n (axis.orientation === 'Horizontal' && mode !== 'Y')) {\n cumulative = Math.max(Math.max(1 / minMax(axis.zoomFactor, 0, 1), 1) + (0.25 * direction), 1);\n if (cumulative >= 1) {\n origin = axis.orientation === 'Horizontal' ? mouseX / axis.rect.width : 1 - (mouseY / axis.rect.height);\n origin = origin > 1 ? 1 : origin < 0 ? 0 : origin;\n zoomFactor = (cumulative === 1) ? 1 : minMax(1 / cumulative, 0, 1);\n zoomPosition = (cumulative === 1) ? 0 : axis.zoomPosition + ((axis.zoomFactor - zoomFactor) * origin);\n if (axis.zoomPosition !== zoomPosition || axis.zoomFactor !== zoomFactor) {\n zoomFactor = (zoomPosition + zoomFactor) > 1 ? (1 - zoomPosition) : zoomFactor;\n }\n argsData.currentZoomFactor = zoomFactor;\n argsData.currentZoomPosition = zoomPosition;\n chart.trigger(zoomComplete, argsData);\n }\n if (!argsData.cancel) {\n axis.zoomFactor = argsData.currentZoomFactor;\n axis.zoomPosition = argsData.currentZoomPosition;\n }\n }\n });\n this.performZoomRedraw(chart);\n };\n /**\n * Function that handles the Pinch zooming.\n * @return {void}\n * @private\n */\n Zoom.prototype.performPinchZooming = function (e, chart) {\n if ((this.zoomingRect.width > 0 && this.zoomingRect.height > 0) || (chart.startMove && chart.crosshair.enable)) {\n return false;\n }\n this.calculateZoomAxesRange(chart, chart.axisCollections);\n this.isZoomed = true;\n this.isPanning = true;\n this.performedUI = true;\n this.offset = !chart.delayRedraw ? chart.chartAxisLayoutPanel.seriesClipRect : this.offset;\n chart.delayRedraw = true;\n chart.disableTrackTooltip = true;\n var elementOffset = chart.element.getBoundingClientRect();\n var touchDown = this.touchStartList;\n var touchMove = this.touchMoveList;\n var touch0StartX = touchDown[0].pageX - elementOffset.left;\n var touch0StartY = touchDown[0].pageY - elementOffset.top;\n var touch0EndX = touchMove[0].pageX - elementOffset.left;\n var touch0EndY = touchMove[0].pageY - elementOffset.top;\n var touch1StartX = touchDown[1].pageX - elementOffset.left;\n var touch1StartY = touchDown[1].pageY - elementOffset.top;\n var touch1EndX = touchMove[1].pageX - elementOffset.left;\n var touch1EndY = touchMove[1].pageY - elementOffset.top;\n var scaleX;\n var scaleY;\n var translateXValue;\n var translateYValue;\n var pinchRect;\n var clipX;\n var clipY;\n scaleX = Math.abs(touch0EndX - touch1EndX) / Math.abs(touch0StartX - touch1StartX);\n scaleY = Math.abs(touch0EndY - touch1EndY) / Math.abs(touch0StartY - touch1StartY);\n clipX = ((this.offset.x - touch0EndX) / scaleX) + touch0StartX;\n clipY = ((this.offset.y - touch0EndY) / scaleY) + touch0StartY;\n pinchRect = new Rect(clipX, clipY, this.offset.width / scaleX, this.offset.height / scaleY);\n translateXValue = (touch0EndX - (scaleX * touch0StartX));\n translateYValue = (touch0EndY - (scaleY * touch0StartY));\n if (!isNaN(scaleX - scaleX) && !isNaN(scaleY - scaleY)) {\n switch (this.zooming.mode) {\n case 'XY':\n this.setTransform(translateXValue, translateYValue, scaleX, scaleY, chart, true);\n break;\n case 'X':\n this.setTransform(translateXValue, 0, scaleX, 1, chart, true);\n break;\n case 'Y':\n this.setTransform(0, translateYValue, 1, scaleY, chart, true);\n break;\n }\n }\n this.calculatePinchZoomFactor(chart, pinchRect);\n this.refreshAxis(chart.chartAxisLayoutPanel, chart, chart.axisCollections);\n return true;\n };\n Zoom.prototype.calculatePinchZoomFactor = function (chart, pinchRect) {\n var _this = this;\n var mode = this.zooming.mode;\n var selectionMin;\n var selectionMax;\n var rangeMin;\n var rangeMax;\n var value;\n var axisTrans;\n var argsData;\n var currentZF;\n var currentZP;\n chart.axisCollections.forEach(function (axis, index) {\n if ((axis.orientation === 'Horizontal' && mode !== 'Y') ||\n (axis.orientation === 'Vertical' && mode !== 'X')) {\n currentZF = axis.zoomFactor;\n currentZP = axis.zoomPosition;\n argsData = {\n cancel: false, name: zoomComplete, axis: axis, previousZoomFactor: axis.zoomFactor,\n previousZoomPosition: axis.zoomPosition, currentZoomFactor: currentZF, currentZoomPosition: currentZP\n };\n if (axis.orientation === 'Horizontal') {\n value = pinchRect.x - _this.offset.x;\n axisTrans = axis.rect.width / _this.zoomAxes[index].delta;\n rangeMin = value / axisTrans + _this.zoomAxes[index].min;\n value = pinchRect.x + pinchRect.width - _this.offset.x;\n rangeMax = value / axisTrans + _this.zoomAxes[index].min;\n }\n else {\n value = pinchRect.y - _this.offset.y;\n axisTrans = axis.rect.height / _this.zoomAxes[index].delta;\n rangeMin = (value * -1 + axis.rect.height) / axisTrans + _this.zoomAxes[index].min;\n value = pinchRect.y + pinchRect.height - _this.offset.y;\n rangeMax = (value * -1 + axis.rect.height) / axisTrans + _this.zoomAxes[index].min;\n }\n selectionMin = Math.min(rangeMin, rangeMax);\n selectionMax = Math.max(rangeMin, rangeMax);\n currentZP = (selectionMin - _this.zoomAxes[index].actualMin) / _this.zoomAxes[index].actualDelta;\n currentZF = (selectionMax - selectionMin) / _this.zoomAxes[index].actualDelta;\n argsData.currentZoomPosition = currentZP < 0 ? 0 : currentZP;\n argsData.currentZoomFactor = currentZF > 1 ? 1 : currentZF;\n chart.trigger(zoomComplete, argsData);\n if (!argsData.cancel) {\n axis.zoomFactor = argsData.currentZoomFactor;\n axis.zoomPosition = argsData.currentZoomPosition;\n }\n }\n });\n };\n // Series transformation style applied here.\n Zoom.prototype.setTransform = function (transX, transY, scaleX, scaleY, chart, isPinch) {\n chart.seriesElements.setAttribute('clip-path', 'url(#' + this.elementId + '_ChartAreaClipRect_)');\n if (chart.indicatorElements) {\n chart.indicatorElements.setAttribute('clip-path', 'url(#' + this.elementId + '_ChartAreaClipRect_)');\n }\n var translate;\n var xAxisLoc;\n var yAxisLoc;\n var element;\n if (transX !== null && transY !== null) {\n chart.visibleSeries.forEach(function (value) {\n xAxisLoc = chart.requireInvertedAxis ? value.yAxis.rect.x : value.xAxis.rect.x;\n yAxisLoc = chart.requireInvertedAxis ? value.xAxis.rect.y : value.yAxis.rect.y;\n translate = 'translate(' + (transX + (isPinch ? (scaleX * xAxisLoc) : xAxisLoc)) +\n ',' + (transY + (isPinch ? (scaleY * yAxisLoc) : yAxisLoc)) + ')';\n translate = (scaleX || scaleY) ? translate + ' scale(' + scaleX + ' ' + scaleY + ')' : translate;\n if (value.visible) {\n if (value.category === 'Indicator') {\n value.seriesElement.parentNode.setAttribute('transform', translate);\n }\n else {\n value.seriesElement.setAttribute('transform', translate);\n }\n element = getElement(chart.element.id + '_Series_' + value.index + '_DataLabelCollections');\n if (value.errorBarElement) {\n value.errorBarElement.setAttribute('transform', translate);\n }\n if (value.symbolElement) {\n value.symbolElement.setAttribute('transform', translate);\n }\n if (value.textElement) {\n value.textElement.setAttribute('visibility', 'hidden');\n value.shapeElement.setAttribute('visibility', 'hidden');\n }\n if (element) {\n element.style.visibility = 'hidden';\n }\n }\n });\n }\n };\n Zoom.prototype.calculateZoomAxesRange = function (chart, axes) {\n var _this = this;\n var range;\n var axisRange;\n chart.axisCollections.forEach(function (axis, index) {\n axisRange = axis.visibleRange;\n if (_this.zoomAxes[index]) {\n if (!chart.delayRedraw) {\n _this.zoomAxes[index].min = axisRange.min;\n _this.zoomAxes[index].delta = axisRange.delta;\n }\n }\n else {\n range = {\n actualMin: axis.actualRange.min,\n actualDelta: axis.actualRange.delta,\n min: axisRange.min,\n delta: axisRange.delta\n };\n _this.zoomAxes[index] = range;\n }\n });\n };\n // Zooming Toolkit created here\n Zoom.prototype.showZoomingToolkit = function (chart) {\n var toolboxItems = this.zooming.toolbarItems;\n var areaBounds = chart.chartAxisLayoutPanel.seriesClipRect;\n var spacing = 5;\n var render = chart.renderer;\n var length = this.isDevice ? 1 : toolboxItems.length;\n var iconSize = this.isDevice ? measureText('Reset Zoom', { size: '12px' }).width : 16;\n var height = this.isDevice ? measureText('Reset Zoom', { size: '12px' }).height : 22;\n var width = (length * iconSize) + ((length + 1) * spacing) + ((length - 1) * spacing);\n var transX = areaBounds.x + areaBounds.width - width - spacing;\n var transY = (areaBounds.y + spacing);\n var xPosition = spacing;\n var outerElement;\n var toolkit = this.toolkit;\n var element;\n var shadowElement = '
\n * \n * ```\n */\nvar AccumulationChart = /** @class */ (function (_super) {\n __extends(AccumulationChart, _super);\n /**\n * Constructor for creating the AccumulationChart widget\n * @private\n */\n function AccumulationChart(options, element) {\n var _this = _super.call(this, options, element) || this;\n /** @private */\n _this.animateselected = false;\n /** @private explode radius internal property */\n _this.explodeDistance = 0;\n _this.chartid = 57724;\n return _this;\n }\n /**\n * Animate the series bounds on data change.\n * @private\n */\n AccumulationChart.prototype.animate = function (duration) {\n this.duration = duration ? duration : 700;\n this.animateselected = true;\n this.animateSeries = false;\n var temIndex = 0;\n var tempcolor = [];\n var tempindex = [];\n var tempindex1 = [];\n var currentSeries = this.visibleSeries[0];\n var datasource = [];\n datasource = currentSeries.dataSource;\n currentSeries.sumOfPoints = 0;\n if (currentSeries.points.length < Object.keys(currentSeries.dataSource).length) {\n this.refresh();\n }\n else if (currentSeries.points.length > Object.keys(currentSeries.dataSource).length) {\n var currentSeries_1 = this.visibleSeries[0];\n currentSeries_1.points = currentSeries_1.points.filter(function (entry1) {\n entry1.visible = false;\n tempindex.push(entry1.index);\n tempcolor.push(entry1.color);\n return (datasource).some(function (entry2) {\n var accPoint = entry2;\n if (entry1.x === accPoint.x) {\n entry1.visible = true;\n tempindex1.push(entry1.index);\n entry1.index = temIndex;\n temIndex++;\n }\n return entry1.x === accPoint.x;\n });\n });\n var missing = tempindex.filter(function (item) { return tempindex1.indexOf(item) < 0; });\n var interval = tempindex.length - missing.length;\n for (var i = (tempindex.length - 1); i >= interval; i--) {\n removeElement('container_Series_0_Point_' + tempindex[i]);\n }\n for (var i = 0; i < currentSeries_1.points.length; i++) {\n currentSeries_1.points[i].y = currentSeries_1.dataSource[i].y;\n currentSeries_1.points[i].color = tempcolor[i];\n currentSeries_1.sumOfPoints += currentSeries_1.dataSource[i].y;\n }\n this.redraw = this.enableAnimation;\n this.animateSeries = false;\n this.calculateBounds();\n this.renderElements();\n }\n else {\n for (var i = 0; i < currentSeries.points.length; i++) {\n currentSeries.points[i].y = currentSeries.dataSource[i].y;\n currentSeries.sumOfPoints += currentSeries.dataSource[i].y;\n }\n this.redraw = this.enableAnimation;\n this.animateSeries = false;\n this.removeSvg();\n this.refreshPoints(currentSeries.points);\n this.renderElements();\n }\n };\n Object.defineProperty(AccumulationChart.prototype, \"type\", {\n /** @private */\n get: function () {\n if (this.series && this.series.length) {\n return this.series[0].type;\n }\n return 'Pie';\n },\n enumerable: true,\n configurable: true\n });\n // accumulation chart methods\n /**\n * To create svg object, renderer and binding events for the container.\n */\n AccumulationChart.prototype.preRender = function () {\n this.unWireEvents();\n this.setCulture();\n this.animateSeries = true;\n if (this.element.id === '') {\n var collection = document.getElementsByClassName('e-accumulationchart').length;\n this.element.id = 'acc_chart_' + this.chartid + '_' + collection;\n }\n calculateSize(this);\n this.wireEvents();\n };\n /**\n * Themeing for chart goes here\n */\n AccumulationChart.prototype.setTheme = function () {\n /*! Set theme for accumulation chart */\n this.themeStyle = getThemeColor(this.theme);\n };\n /**\n * To render the accumulation chart elements\n */\n AccumulationChart.prototype.render = function () {\n this.trigger(load, { accumulation: this, chart: this });\n this.setTheme();\n this.accBaseModule = new AccumulationBase(this);\n this.pieSeriesModule = new PieSeries(this);\n this.calculateVisibleSeries();\n this.processData();\n };\n /**\n * Method to unbind events for accumulation chart\n */\n AccumulationChart.prototype.unWireEvents = function () {\n /*! Find the Events type */\n var isIE11Pointer = Browser.isPointer;\n var start = Browser.touchStartEvent;\n var move = Browser.touchMoveEvent;\n var stop = Browser.touchEndEvent;\n var cancel = isIE11Pointer ? 'pointerleave' : 'mouseleave';\n /*! UnBind the Event handler */\n EventHandler.remove(this.element, move, this.accumulationMouseMove);\n EventHandler.remove(this.element, stop, this.accumulationMouseEnd);\n EventHandler.remove(this.element, start, this.accumulationMouseStart);\n EventHandler.remove(this.element, 'click', this.accumulationOnMouseClick);\n EventHandler.remove(this.element, 'contextmenu', this.accumulationRightClick);\n EventHandler.remove(this.element, cancel, this.accumulationMouseLeave);\n window.removeEventListener((Browser.isTouch && ('orientation' in window && 'onorientationchange' in window)) ? 'orientationchange' : 'resize', this.accumulationResize);\n };\n /**\n * Method to bind events for the accumulation chart\n */\n AccumulationChart.prototype.wireEvents = function () {\n /*! Find the Events type */\n var isIE11Pointer = Browser.isPointer;\n var start = Browser.touchStartEvent;\n var stop = Browser.touchEndEvent;\n var move = Browser.touchMoveEvent;\n var cancel = isIE11Pointer ? 'pointerleave' : 'mouseleave';\n /*! Bind the Event handler */\n EventHandler.add(this.element, move, this.accumulationMouseMove, this);\n EventHandler.add(this.element, stop, this.accumulationMouseEnd, this);\n EventHandler.add(this.element, start, this.accumulationMouseStart, this);\n EventHandler.add(this.element, 'click', this.accumulationOnMouseClick, this);\n EventHandler.add(this.element, 'contextmenu', this.accumulationRightClick, this);\n EventHandler.add(this.element, cancel, this.accumulationMouseLeave, this);\n window.addEventListener((Browser.isTouch && ('orientation' in window && 'onorientationchange' in window)) ? 'orientationchange' : 'resize', this.accumulationResize.bind(this));\n new Touch(this.element); // To avoid geasture blocking for browser\n /*! Apply the style for chart */\n this.setStyle(this.element);\n };\n /**\n * Method to set mouse x, y from events\n */\n AccumulationChart.prototype.setMouseXY = function (e) {\n var pageX;\n var pageY;\n var svgRect = getElement(this.element.id + '_svg').getBoundingClientRect();\n var rect = this.element.getBoundingClientRect();\n if (e.type.indexOf('touch') > -1) {\n this.isTouch = true;\n var touchArg = e;\n pageY = touchArg.changedTouches[0].clientY;\n pageX = touchArg.changedTouches[0].clientX;\n }\n else {\n this.isTouch = e.pointerType === 'touch' || e.pointerType === '2';\n pageX = e.clientX;\n pageY = e.clientY;\n }\n this.mouseY = (pageY - rect.top) - Math.max(svgRect.top - rect.top, 0);\n this.mouseX = (pageX - rect.left) - Math.max(svgRect.left - rect.left, 0);\n };\n /**\n * Handles the mouse end.\n * @return {boolean}\n * @private\n */\n AccumulationChart.prototype.accumulationMouseEnd = function (e) {\n this.setMouseXY(e);\n this.trigger(chartMouseUp, { target: e.target.id, x: this.mouseX, y: this.mouseY });\n if (this.isTouch) {\n this.titleTooltip(e, this.mouseX, this.mouseY, this.isTouch);\n if (this.accumulationDataLabelModule && this.visibleSeries[0].dataLabel.visible) {\n this.accumulationDataLabelModule.move(e, this.mouseX, this.mouseY, this.isTouch);\n }\n if (this.accumulationLegendModule && this.legendSettings.visible) {\n this.accumulationLegendModule.move(e);\n }\n }\n this.notify(Browser.touchEndEvent, e);\n return false;\n };\n /*public removeSvgOffset(x: number, y: number): ChartLocation {\n let rect: ClientRect = this.element.getBoundingClientRect();\n let svgRect: ClientRect = getElement(this.element.id + '_svg').getBoundingClientRect();\n return { x: (x - rect.left) - Math.max(svgRect.left - rect.left, 0), y: (y - rect.top) - Math.max(svgRect.top - rect.top, 0)};\n }*/\n /**\n * Handles the mouse start.\n * @return {boolean}\n * @private\n */\n AccumulationChart.prototype.accumulationMouseStart = function (e) {\n this.setMouseXY(e);\n this.trigger(chartMouseDown, { target: e.target.id, x: this.mouseX, y: this.mouseY });\n return false;\n };\n /**\n * Handles the accumulation chart resize.\n * @return {boolean}\n * @private\n */\n AccumulationChart.prototype.accumulationResize = function (e) {\n var _this = this;\n this.animateSeries = false;\n var args = {\n accumulation: this,\n previousSize: new Size(this.availableSize.width, this.availableSize.height),\n name: resized,\n currentSize: new Size(0, 0),\n chart: this,\n };\n if (this.resizeTo) {\n clearTimeout(this.resizeTo);\n }\n this.resizeTo = setTimeout(function () {\n if (_this.isDestroyed) {\n clearTimeout(_this.resizeTo);\n return;\n }\n calculateSize(_this);\n args.currentSize = _this.availableSize;\n _this.trigger(resized, args);\n _this.refreshSeries();\n _this.refreshChart();\n }, 500);\n return false;\n };\n /**\n * Handles the print method for accumulation chart control.\n */\n AccumulationChart.prototype.print = function (id) {\n var exportChart = new ExportUtils(this);\n exportChart.print(id);\n };\n /**\n * Applying styles for accumulation chart element\n */\n AccumulationChart.prototype.setStyle = function (element) {\n element.style.touchAction = 'element';\n element.style.msTouchAction = 'element';\n element.style.msContentZooming = 'none';\n element.style.msUserSelect = 'none';\n element.style.webkitUserSelect = 'none';\n element.style.position = 'relative';\n element.style.display = 'block';\n };\n /**\n * Method to set the annotation content dynamically for accumulation.\n */\n AccumulationChart.prototype.setAnnotationValue = function (annotationIndex, content) {\n var annotation = this.annotations[annotationIndex];\n var element;\n var parentNode = getElement(this.element.id + '_Annotation_Collections');\n if (content) {\n annotation.content = content;\n if (parentNode) {\n element = this.createElement('div');\n removeElement(this.element.id + '_Annotation_' + annotationIndex);\n this.annotationModule.processAnnotation(annotation, annotationIndex, element);\n parentNode.appendChild(element.children[0]);\n }\n else {\n this.annotationModule.renderAnnotations(getElement(this.element.id + '_Secondary_Element'));\n }\n }\n };\n /**\n * Handles the mouse move on accumulation chart.\n * @return {boolean}\n * @private\n */\n AccumulationChart.prototype.accumulationMouseMove = function (e) {\n this.setMouseXY(e);\n this.trigger(chartMouseMove, { target: e.target.id, x: this.mouseX, y: this.mouseY });\n if (this.pointMove) {\n this.triggerPointEvent(pointMove, e.target);\n }\n if (this.accumulationLegendModule && this.legendSettings.visible) {\n this.accumulationLegendModule.move(e);\n }\n if (this.accumulationDataLabelModule && this.visibleSeries[0] && this.visibleSeries[0].dataLabel.visible) {\n this.accumulationDataLabelModule.move(e, this.mouseX, this.mouseY);\n }\n if (!this.isTouch) {\n this.titleTooltip(e, this.mouseX, this.mouseY);\n }\n this.notify(Browser.touchMoveEvent, e);\n return false;\n };\n AccumulationChart.prototype.titleTooltip = function (event, x, y, isTouch) {\n var targetId = event.target.id;\n var id = (targetId === (this.element.id + '_title') || targetId === (this.element.id + '_subTitle'));\n if ((event.target.textContent.indexOf('...') > -1) && id) {\n var title = (targetId === (this.element.id + '_title')) ? this.title : this.subTitle;\n showTooltip(title, x, y, this.element.offsetWidth, this.element.id + '_EJ2_Title_Tooltip', getElement(this.element.id + '_Secondary_Element'), isTouch);\n }\n else {\n removeElement(this.element.id + '_EJ2_Title_Tooltip');\n }\n };\n /**\n * Handles the mouse click on accumulation chart.\n * @return {boolean}\n * @private\n */\n AccumulationChart.prototype.accumulationOnMouseClick = function (e) {\n this.setMouseXY(e);\n if (this.accumulationLegendModule && this.legendSettings.visible) {\n this.accumulationLegendModule.click(e);\n }\n if (this.selectionMode !== 'None' && this.accumulationSelectionModule) {\n this.accumulationSelectionModule.calculateSelectedElements(this, e);\n }\n if (this.visibleSeries[0].explode) {\n this.accBaseModule.processExplode(e);\n }\n this.trigger(chartMouseClick, { target: e.target.id, x: this.mouseX, y: this.mouseY });\n if (this.pointClick) {\n this.triggerPointEvent(pointClick, e.target);\n }\n return false;\n };\n AccumulationChart.prototype.triggerPointEvent = function (event, element) {\n var indexes = indexFinder(element.id, true);\n if (indexes.series >= 0 && indexes.point >= 0) {\n this.trigger(event, { series: this.series[indexes.series],\n point: this.series[indexes.series].points[indexes.point],\n seriesIndex: indexes.series, pointIndex: indexes.point,\n x: this.mouseX, y: this.mouseY });\n }\n };\n /**\n * Handles the mouse right click on accumulation chart.\n * @return {boolean}\n * @private\n */\n AccumulationChart.prototype.accumulationRightClick = function (event) {\n if (event.buttons === 2 || event.pointerType === 'touch') {\n event.preventDefault();\n event.stopPropagation();\n return false;\n }\n return true;\n };\n /**\n * Handles the mouse leave on accumulation chart.\n * @return {boolean}\n * @private\n */\n AccumulationChart.prototype.accumulationMouseLeave = function (e) {\n this.setMouseXY(e);\n this.trigger(chartMouseLeave, { target: e.target.id, x: this.mouseX, y: this.mouseY });\n this.notify(Browser.isPointer ? 'pointerleave' : 'mouseleave', e);\n return false;\n };\n /**\n * Method to set culture for chart\n */\n AccumulationChart.prototype.setCulture = function () {\n this.intl = new Internationalization();\n };\n /**\n * Method to create SVG element for accumulation chart.\n */\n AccumulationChart.prototype.createPieSvg = function () {\n this.removeSvg();\n createSvg(this);\n };\n /**\n * To Remove the SVG from accumulation chart.\n * @return {boolean}\n * @private\n */\n AccumulationChart.prototype.removeSvg = function () {\n if (this.redraw) {\n return null;\n }\n removeElement(this.element.id + '_Secondary_Element');\n if (this.svgObject) {\n while (this.svgObject.childNodes.length > 0) {\n this.svgObject.removeChild(this.svgObject.firstChild);\n }\n if (!this.svgObject.hasChildNodes() && this.svgObject.parentNode) {\n remove(this.svgObject);\n }\n }\n removeElement('EJ2_legend_tooltip');\n removeElement('EJ2_datalabel_tooltip');\n };\n /**\n * Method to create the secondary element for tooltip, datalabel and annotaitons.\n */\n AccumulationChart.prototype.createSecondaryElement = function () {\n var element = redrawElement(this.redraw, this.element.id + '_Secondary_Element') ||\n this.createElement('div', {\n id: this.element.id + '_Secondary_Element',\n styles: 'position: relative'\n });\n appendChildElement(this.element, element, this.redraw);\n };\n /**\n * Method to find visible series based on series types\n */\n AccumulationChart.prototype.calculateVisibleSeries = function () {\n this.visibleSeries = [];\n for (var i = 0, length_1 = this.series.length; i < length_1; i++) {\n this.series[i].index = i;\n if (this.series[i].type === this.type && this.visibleSeries.length === 0) {\n this.visibleSeries.push(this.series[i]);\n break;\n }\n }\n };\n /**\n * To find points from dataSource\n */\n AccumulationChart.prototype.processData = function (render) {\n if (render === void 0) { render = true; }\n this.seriesCounts = 0;\n for (var _i = 0, _a = this.visibleSeries; _i < _a.length; _i++) {\n var series = _a[_i];\n series.dataModule = new Data(series.dataSource || this.dataSource, series.query);\n series.refreshDataManager(this, render);\n }\n };\n /**\n * To refresh the accumulation chart\n * @private\n */\n AccumulationChart.prototype.refreshChart = function () {\n this.doGrouppingProcess();\n this.createPieSvg();\n this.calculateBounds();\n this.renderElements();\n removeElement('chartmeasuretext');\n };\n /**\n * Method to find groupped points\n */\n AccumulationChart.prototype.doGrouppingProcess = function () {\n var series = this.visibleSeries[0];\n if (!isNullOrUndefined(series.resultData) && ((!isNullOrUndefined(series.lastGroupTo) &&\n series.lastGroupTo !== series.groupTo))) {\n series.getPoints(series.resultData, this);\n }\n };\n /**\n * Method to calculate bounds for accumulation chart\n */\n AccumulationChart.prototype.calculateBounds = function () {\n this.initialClipRect = new Rect(this.margin.left, this.margin.top, this.availableSize.width, this.availableSize.height);\n this.titleCollection = [];\n this.subTitleCollection = [];\n var titleHeight = 0;\n var subTitleHeight = 0;\n var maxWidth = 0;\n var titleWidth = 0;\n this.titleCollection = getTitle(this.title, this.titleStyle, this.initialClipRect.width);\n titleHeight = measureText(this.title, this.titleStyle).height * this.titleCollection.length;\n if (this.subTitle) {\n for (var _i = 0, _a = this.titleCollection; _i < _a.length; _i++) {\n var titleText = _a[_i];\n titleWidth = measureText(titleText, this.titleStyle).width;\n maxWidth = titleWidth > maxWidth ? titleWidth : maxWidth;\n }\n this.subTitleCollection = getTitle(this.subTitle, this.subTitleStyle, maxWidth);\n subTitleHeight = (measureText(this.subTitle, this.subTitleStyle).height * this.subTitleCollection.length);\n }\n subtractRect(this.initialClipRect, new Rect(0, (subTitleHeight + titleHeight), this.margin.right + this.margin.left, this.margin.bottom + this.margin.top));\n this.calculateLegendBounds();\n };\n /*\n * Method to calculate legend bounds for accumulation chart\n */\n AccumulationChart.prototype.calculateLegendBounds = function () {\n if (!this.accumulationLegendModule || !this.legendSettings.visible) {\n return null;\n }\n this.accumulationLegendModule.getLegendOptions(this, this.visibleSeries);\n this.accumulationLegendModule.calculateLegendBounds(this.initialClipRect, this.availableSize);\n };\n /**\n * To render elements for accumulation chart\n * @private\n */\n AccumulationChart.prototype.renderElements = function () {\n this.renderBorder();\n this.createSecondaryElement();\n this.renderSeries();\n this.renderTitle();\n this.renderLegend();\n appendChildElement(this.element, this.svgObject, this.redraw);\n this.processSelection();\n this.processExplode();\n this.renderAnnotation();\n this.setSecondaryElementPosition();\n this.trigger('loaded', { accumulation: this, chart: this });\n this.animateSeries = false;\n };\n /**\n * To set the left and top position for data label template for center aligned chart\n * @private\n */\n AccumulationChart.prototype.setSecondaryElementPosition = function () {\n var tooltipParent = getElement(this.element.id + '_Secondary_Element');\n if (!tooltipParent) {\n return;\n }\n var rect = this.element.getBoundingClientRect();\n var svgRect = getElement(this.element.id + '_svg').getBoundingClientRect();\n tooltipParent.style.left = Math.max(svgRect.left - rect.left, 0) + 'px';\n tooltipParent.style.top = Math.max(svgRect.top - rect.top, 0) + 'px';\n };\n /**\n * To render the annotaitions for accumulation series.\n * @private\n */\n AccumulationChart.prototype.renderAnnotation = function () {\n if (this.annotationModule) {\n this.annotationModule.renderAnnotations(getElement(this.element.id + '_Secondary_Element'));\n }\n };\n /**\n * Method to process the explode in accumulation chart\n * @private\n */\n AccumulationChart.prototype.processExplode = function () {\n if (this.redraw) {\n return null;\n }\n if (!this.visibleSeries[0].explode) {\n return null;\n }\n this.accBaseModule.invokeExplode();\n };\n /**\n * Method to render series for accumulation chart\n */\n AccumulationChart.prototype.renderSeries = function () {\n if (!this.redraw) {\n this.svgObject.appendChild(this.renderer.createGroup({ id: this.element.id + '_SeriesCollection' }));\n }\n for (var _i = 0, _a = this.visibleSeries; _i < _a.length; _i++) {\n var series = _a[_i];\n if (series.visible && this[(firstToLowerCase(series.type) + 'SeriesModule')]) {\n this[(firstToLowerCase(series.type) + 'SeriesModule')].initProperties(this, series);\n series.renderSeries(this, this.redraw);\n }\n }\n };\n /**\n * Method to render border for accumulation chart\n */\n AccumulationChart.prototype.renderBorder = function () {\n var padding = this.border.width;\n appendChildElement(this.svgObject, this.renderer.drawRectangle(new RectOption(this.element.id + '_border', this.background || this.themeStyle.background, this.border, 1, new Rect(padding / 2, padding / 2, this.availableSize.width - padding, this.availableSize.height - padding))), this.redraw);\n };\n /**\n * Method to render legend for accumulation chart\n */\n AccumulationChart.prototype.renderLegend = function () {\n if (!this.accumulationLegendModule || !this.legendSettings.visible) {\n return null;\n }\n if (this.accumulationLegendModule.legendCollections.length) {\n if (this.visibleSeries[0].type === 'Pie') {\n this.accumulationLegendModule.getSmartLegendLocation(this.visibleSeries[0].labelBound, this.accumulationLegendModule.legendBounds, this.margin);\n }\n this.accumulationLegendModule.renderLegend(this, this.legendSettings, this.accumulationLegendModule.legendBounds, this.redraw);\n }\n };\n /**\n * To process the selection in accumulation chart\n * @private\n */\n AccumulationChart.prototype.processSelection = function () {\n if (!this.accumulationSelectionModule || this.selectionMode === 'None') {\n return null;\n }\n var selectedDataIndexes = extend([], this.accumulationSelectionModule.selectedDataIndexes, null, true);\n this.accumulationSelectionModule.invokeSelection(this);\n if (selectedDataIndexes.length > 0) {\n this.accumulationSelectionModule.selectedDataIndexes = selectedDataIndexes;\n this.accumulationSelectionModule.redrawSelection(this, this.selectionMode);\n }\n };\n /**\n * To render title for accumulation chart\n */\n AccumulationChart.prototype.renderTitle = function () {\n var rect;\n var margin = this.margin;\n if (!this.title) {\n return null;\n }\n var alignment = this.titleStyle.textAlignment;\n var getAnchor = alignment === 'Near' ? 'start' : alignment === 'Far' ? 'end' : 'middle';\n var titleSize = measureText(this.title, this.titleStyle);\n rect = new Rect(margin.left, 0, this.availableSize.width - margin.left - margin.right, 0);\n var options = new TextOption(this.element.id + '_title', titlePositionX(rect, this.titleStyle), this.margin.top + (titleSize.height * 3 / 4), getAnchor, this.titleCollection, '', 'auto');\n var element = textElement(options, this.titleStyle, this.titleStyle.color || this.themeStyle.chartTitle, this.svgObject, false, this.redraw);\n if (this.subTitle) {\n this.renderSubTitle(options);\n }\n };\n AccumulationChart.prototype.renderSubTitle = function (options) {\n var maxWidth = 0;\n var titleWidth = 0;\n var padding = 10;\n var rect;\n var alignment = this.titleStyle.textAlignment;\n var getAnchor = function (alignment) {\n return alignment === 'Near' ? 'start' : alignment === 'Far' ? 'end' : 'middle';\n };\n var subTitleElementSize = measureText(this.subTitle, this.subTitleStyle);\n for (var _i = 0, _a = this.titleCollection; _i < _a.length; _i++) {\n var titleText = _a[_i];\n titleWidth = measureText(titleText, this.titleStyle).width;\n maxWidth = titleWidth > maxWidth ? titleWidth : maxWidth;\n }\n rect = new Rect(alignment === 'Center' ? (options.x - maxWidth / 2) : alignment === 'Far' ? options.x - maxWidth : options.x, 0, maxWidth, 0);\n var subTitleOption = new TextOption(this.element.id + '_subTitle', titlePositionX(rect, this.subTitleStyle), options.y * options.text.length + ((subTitleElementSize.height) * 3 / 4) + padding, getAnchor(this.subTitleStyle.textAlignment), this.subTitleCollection, '', 'auto');\n var element = textElement(subTitleOption, this.subTitleStyle, this.subTitleStyle.color || this.themeStyle.chartTitle, this.svgObject, false, this.redraw);\n };\n /**\n * To get the series parent element\n * @private\n */\n AccumulationChart.prototype.getSeriesElement = function () {\n return this.svgObject.getElementsByTagName('g')[0];\n };\n /**\n * To refresh the all visible series points\n * @private\n */\n AccumulationChart.prototype.refreshSeries = function () {\n for (var _i = 0, _a = this.visibleSeries; _i < _a.length; _i++) {\n var series = _a[_i];\n this.refreshPoints(series.points);\n }\n };\n /**\n * To refresh points label region and visible\n * @private\n */\n AccumulationChart.prototype.refreshPoints = function (points) {\n for (var _i = 0, points_1 = points; _i < points_1.length; _i++) {\n var point = points_1[_i];\n point.labelPosition = null;\n point.labelRegion = null;\n point.labelVisible = true;\n }\n };\n /**\n * To get Module name\n * @private\n */\n AccumulationChart.prototype.getModuleName = function () {\n return 'accumulationchart';\n };\n /**\n * To destroy the accumulationcharts\n * @private\n */\n AccumulationChart.prototype.destroy = function () {\n this.unWireEvents();\n _super.prototype.destroy.call(this);\n this.element.classList.remove('e-accumulationchart');\n };\n /**\n * To provide the array of modules needed for control rendering\n * @return {ModuleDeclaration[]}\n * @private\n */\n AccumulationChart.prototype.requiredModules = function () {\n var modules = [];\n var enableAnnotation = false;\n modules.push({\n member: this.type + 'Series',\n args: [this]\n });\n if (this.legendSettings.visible) {\n modules.push({\n member: 'AccumulationLegend',\n args: [this]\n });\n }\n if (this.findDatalabelVisibility()) {\n modules.push({\n member: 'AccumulationDataLabel',\n args: [this]\n });\n }\n if (this.tooltip.enable) {\n modules.push({\n member: 'AccumulationTooltip',\n args: [this]\n });\n }\n if (this.selectionMode !== 'None') {\n modules.push({\n member: 'AccumulationSelection',\n args: [this]\n });\n }\n if (this.enableExport) {\n modules.push({\n member: 'Export',\n args: [this]\n });\n }\n enableAnnotation = this.annotations.some(function (value) {\n return (value.content !== null);\n });\n if (enableAnnotation) {\n modules.push({\n member: 'Annotation',\n args: [this]\n });\n }\n return modules;\n };\n /**\n * To find datalabel visibility in series\n */\n AccumulationChart.prototype.findDatalabelVisibility = function () {\n for (var _i = 0, _a = this.series; _i < _a.length; _i++) {\n var series = _a[_i];\n if (series.dataLabel.visible) {\n return true;\n }\n }\n return false;\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @private\n */\n AccumulationChart.prototype.getPersistData = function () {\n return '';\n };\n /**\n * Called internally if any of the property value changed.\n * @private\n */\n AccumulationChart.prototype.onPropertyChanged = function (newProp, oldProp) {\n var update = {\n refreshElements: false, refreshBounds: false\n };\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'theme':\n this.animateSeries = true;\n break;\n case 'title':\n case 'subTitle':\n case 'height':\n case 'width':\n case 'margin':\n update.refreshBounds = true;\n break;\n case 'titleStyle':\n if (newProp.titleStyle && (newProp.titleStyle.size || newProp.titleStyle.textOverflow)) {\n update.refreshBounds = true;\n }\n else {\n update.refreshElements = true;\n }\n break;\n case 'subTitleStyle':\n if (newProp.subTitleStyle && (newProp.subTitleStyle.size || newProp.subTitleStyle.textOverflow)) {\n update.refreshBounds = true;\n }\n else {\n update.refreshElements = true;\n }\n break;\n case 'legendSettings':\n update.refreshBounds = true;\n update.refreshElements = true;\n break;\n case 'dataSource':\n this.processData(false);\n update.refreshBounds = true;\n break;\n case 'series':\n if (!this.animateselected) {\n var len = this.series.length;\n var seriesRefresh = false;\n for (var i = 0; i < len; i++) {\n if (newProp.series[i] && (newProp.series[i].dataSource || newProp.series[i].yName || newProp.series[i].xName)) {\n seriesRefresh = true;\n }\n if (newProp.series[i] && newProp.series[i].explodeIndex !== oldProp.series[i].explodeIndex) {\n this.accBaseModule.explodePoints(newProp.series[i].explodeIndex, this);\n this.accBaseModule.deExplodeAll(newProp.series[i].explodeIndex, this.enableAnimation ? 300 : 0);\n }\n }\n if (seriesRefresh) {\n this.processData(false);\n update.refreshBounds = true;\n }\n }\n this.animateselected = false;\n this.redraw = false;\n break;\n case 'locale':\n case 'currencyCode':\n _super.prototype.refresh.call(this);\n break;\n case 'background':\n case 'border':\n case 'annotations':\n case 'enableSmartLabels':\n update.refreshElements = true;\n break;\n case 'isMultiSelect':\n case 'selectedDataIndexes':\n case 'selectionMode':\n if (this.accumulationSelectionModule) {\n if (isNullOrUndefined(this.accumulationSelectionModule.selectedDataIndexes)) {\n this.accumulationSelectionModule.invokeSelection(this);\n }\n else {\n this.accumulationSelectionModule.redrawSelection(this, oldProp.selectionMode);\n }\n }\n break;\n }\n }\n if (!update.refreshBounds && update.refreshElements) {\n this.createPieSvg();\n this.renderElements();\n }\n else if (update.refreshBounds) {\n this.refreshSeries();\n this.createPieSvg();\n this.calculateBounds();\n this.renderElements();\n }\n };\n __decorate([\n Property(null)\n ], AccumulationChart.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], AccumulationChart.prototype, \"height\", void 0);\n __decorate([\n Property(null)\n ], AccumulationChart.prototype, \"title\", void 0);\n __decorate([\n Complex({}, PieCenter)\n ], AccumulationChart.prototype, \"center\", void 0);\n __decorate([\n Property('')\n ], AccumulationChart.prototype, \"dataSource\", void 0);\n __decorate([\n Complex(Theme.chartTitleFont, Font)\n ], AccumulationChart.prototype, \"titleStyle\", void 0);\n __decorate([\n Property(null)\n ], AccumulationChart.prototype, \"subTitle\", void 0);\n __decorate([\n Complex(Theme.chartSubTitleFont, Font)\n ], AccumulationChart.prototype, \"subTitleStyle\", void 0);\n __decorate([\n Complex({}, LegendSettings)\n ], AccumulationChart.prototype, \"legendSettings\", void 0);\n __decorate([\n Complex({}, TooltipSettings)\n ], AccumulationChart.prototype, \"tooltip\", void 0);\n __decorate([\n Property('None')\n ], AccumulationChart.prototype, \"selectionMode\", void 0);\n __decorate([\n Property(false)\n ], AccumulationChart.prototype, \"isMultiSelect\", void 0);\n __decorate([\n Property(true)\n ], AccumulationChart.prototype, \"enableAnimation\", void 0);\n __decorate([\n Collection([], Indexes)\n ], AccumulationChart.prototype, \"selectedDataIndexes\", void 0);\n __decorate([\n Complex({}, Margin)\n ], AccumulationChart.prototype, \"margin\", void 0);\n __decorate([\n Property(true)\n ], AccumulationChart.prototype, \"enableSmartLabels\", void 0);\n __decorate([\n Complex({ color: '#DDDDDD', width: 0 }, Border)\n ], AccumulationChart.prototype, \"border\", void 0);\n __decorate([\n Property(null)\n ], AccumulationChart.prototype, \"background\", void 0);\n __decorate([\n Collection([{}], AccumulationSeries)\n ], AccumulationChart.prototype, \"series\", void 0);\n __decorate([\n Collection([{}], AccumulationAnnotationSettings)\n ], AccumulationChart.prototype, \"annotations\", void 0);\n __decorate([\n Property('Material')\n ], AccumulationChart.prototype, \"theme\", void 0);\n __decorate([\n Property(true)\n ], AccumulationChart.prototype, \"enableExport\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"loaded\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"load\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"seriesRender\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"legendRender\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"textRender\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"tooltipRender\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"pointRender\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"annotationRender\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"beforePrint\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"chartMouseMove\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"chartMouseClick\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"pointClick\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"pointMove\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"animationComplete\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"chartMouseDown\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"chartMouseLeave\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"chartMouseUp\", void 0);\n __decorate([\n Event()\n ], AccumulationChart.prototype, \"resized\", void 0);\n __decorate([\n Property('USD')\n ], AccumulationChart.prototype, \"currencyCode\", void 0);\n AccumulationChart = __decorate([\n NotifyPropertyChanges\n ], AccumulationChart);\n return AccumulationChart;\n}(Component));\nexport { AccumulationChart };\n","/**\n * Defines the common behavior of funnel and pyramid series\n */\nvar __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { Rect, Size } from '@syncfusion/ej2-svg-base';\nimport { stringToNumber } from '../../common/utils/helper';\nimport { AccumulationBase } from './accumulation-base';\n/**\n * TriangularBase is used to calculate base functions for funnel/pyramid series.\n */\nvar TriangularBase = /** @class */ (function (_super) {\n __extends(TriangularBase, _super);\n function TriangularBase() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Initializes the properties of funnel/pyramid series\n * @private\n */\n TriangularBase.prototype.initProperties = function (chart, series) {\n var actualChartArea = chart.initialClipRect;\n series.triangleSize = new Size(stringToNumber(series.width, actualChartArea.width), stringToNumber(series.height, actualChartArea.height));\n series.neckSize = new Size(stringToNumber(series.neckWidth, actualChartArea.width), stringToNumber(series.neckHeight, actualChartArea.height));\n this.defaultLabelBound(series, series.dataLabel.visible, series.dataLabel.position, chart);\n if (series.explodeOffset === '30%') {\n series.explodeOffset = '25px';\n }\n chart.explodeDistance = stringToNumber(series.explodeOffset, actualChartArea.width);\n var points = series.points;\n this.initializeSizeRatio(points, series);\n };\n /**\n * Initializes the size of the pyramid/funnel segments\n * @private\n */\n TriangularBase.prototype.initializeSizeRatio = function (points, series, reverse) {\n if (reverse === void 0) { reverse = false; }\n var sumOfPoints = series.sumOfPoints;\n //Limiting the ratio within the range of 0 to 1\n var gapRatio = Math.min(Math.max(series.gapRatio, 0), 1);\n //% equivalence of a value 1\n var coEff = 1 / (sumOfPoints * (1 + gapRatio / (1 - gapRatio)));\n var spacing = gapRatio / (points.length - 1);\n var y = 0;\n //starting from bottom\n for (var i = points.length - 1; i >= 0; i--) {\n var index = reverse ? points.length - 1 - i : i;\n if (points[index].visible) {\n var height = coEff * points[index].y;\n points[index].yRatio = y;\n points[index].heightRatio = height;\n y += height + spacing;\n }\n }\n };\n /**\n * Marks the label location from the set of points that forms a pyramid/funnel segment\n * @private\n */\n TriangularBase.prototype.setLabelLocation = function (series, point, points) {\n var last = points.length - 1;\n var bottom = series.type === 'Funnel' ? points.length - 2 : points.length - 1;\n var x = (points[0].x + points[bottom].x) / 2;\n var right = (points[1].x + points[bottom - 1].x) / 2;\n point.region = new Rect(x, points[0].y, right - x, points[bottom].y - points[0].y);\n point.symbolLocation = {\n x: point.region.x + point.region.width / 2,\n y: point.region.y + point.region.height / 2\n };\n point.labelOffset = {\n x: point.symbolLocation.x - (points[0].x + points[last].x) / 2,\n y: point.symbolLocation.y - (points[0].y + points[last].y) / 2\n };\n };\n /**\n * Finds the path to connect the list of points\n * @private\n */\n TriangularBase.prototype.findPath = function (locations) {\n var path = 'M';\n for (var i = 0; i < locations.length; i++) {\n path += locations[i].x + ' ' + locations[i].y;\n if (i !== locations.length - 1) {\n path += ' L';\n }\n }\n return path;\n };\n /**\n * To calculate data-label bounds\n * @private\n */\n TriangularBase.prototype.defaultLabelBound = function (series, visible, position, chart) {\n var x = (chart.initialClipRect.width - series.triangleSize.width) / 2;\n var y = (chart.initialClipRect.height - series.triangleSize.height) / 2;\n var accumulationBound = new Rect(x, y, series.triangleSize.width, series.triangleSize.height);\n series.labelBound = new Rect(accumulationBound.x, accumulationBound.y, accumulationBound.width + accumulationBound.x, accumulationBound.height + accumulationBound.y);\n series.accumulationBound = accumulationBound;\n if (visible && position === 'Outside') {\n series.labelBound = new Rect(Infinity, Infinity, -Infinity, -Infinity);\n }\n };\n return TriangularBase;\n}(AccumulationBase));\nexport { TriangularBase };\n","/**\n * Defines the behavior of a funnel series\n */\nvar __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { appendChildElement, removeElement } from '../../common/utils/helper';\nimport { TriangularBase } from './triangular-base';\n/**\n * FunnelSeries module used to render `Funnel` Series.\n */\nvar FunnelSeries = /** @class */ (function (_super) {\n __extends(FunnelSeries, _super);\n function FunnelSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Defines the path of a funnel segment\n */\n FunnelSeries.prototype.getSegmentData = function (point, series, chart) {\n var lineWidth;\n var topRadius;\n var bottomRadius;\n var endTop;\n var endBottom;\n var minRadius;\n var endMin;\n var bottomY;\n var area = series.triangleSize;\n var offset = 0;\n var extraSpace = (chart.initialClipRect.width - series.triangleSize.width) / 2;\n var emptySpaceAtLeft = extraSpace + chart.initialClipRect.x;\n var seriesTop = chart.initialClipRect.y + (chart.initialClipRect.height - area.height) / 2;\n //defines the top and bottom of a segment\n var top = point.yRatio * area.height;\n var bottom = top + point.heightRatio * area.height;\n var neckSize = series.neckSize;\n lineWidth = neckSize.width + (area.width - neckSize.width) * ((area.height - neckSize.height - top) /\n (area.height - neckSize.height));\n topRadius = (area.width / 2) - lineWidth / 2;\n //Calculating the middle slope change and bottom\n endTop = topRadius + lineWidth;\n if (bottom > area.height - neckSize.height || area.height === neckSize.height) {\n lineWidth = neckSize.width;\n }\n else {\n lineWidth = neckSize.width + (area.width - neckSize.width) *\n ((area.height - neckSize.height - bottom) / (area.height - neckSize.height));\n }\n bottomRadius = (area.width / 2) - (lineWidth / 2);\n endBottom = bottomRadius + lineWidth;\n if (top >= area.height - neckSize.height) {\n topRadius = bottomRadius = minRadius = (area.width / 2) - neckSize.width / 2;\n endTop = endBottom = endMin = (area.width / 2) + neckSize.width / 2;\n }\n else if (bottom > (area.height - neckSize.height)) {\n minRadius = bottomRadius = (area.width / 2) - lineWidth / 2;\n endMin = endBottom = minRadius + lineWidth;\n bottomY = area.height - neckSize.height;\n }\n top += seriesTop;\n bottom += seriesTop;\n bottomY += seriesTop;\n var line1 = { x: emptySpaceAtLeft + offset + topRadius, y: top };\n var line2 = { x: emptySpaceAtLeft + offset + endTop, y: top };\n var line4 = { x: emptySpaceAtLeft + offset + endBottom, y: bottom };\n var line5 = { x: emptySpaceAtLeft + offset + bottomRadius, y: bottom };\n var line3 = { x: emptySpaceAtLeft + offset + endBottom, y: bottom };\n var line6 = { x: emptySpaceAtLeft + offset + bottomRadius, y: bottom };\n if (bottomY) {\n line3 = { x: emptySpaceAtLeft + offset + endMin, y: bottomY };\n line6 = { x: emptySpaceAtLeft + offset + minRadius, y: bottomY };\n }\n var polygon = [line1, line2, line3, line4, line5, line6];\n this.setLabelLocation(series, point, polygon);\n var direction = this.findPath(polygon);\n return direction;\n };\n /**\n * Renders a funnel segment\n * @private\n */\n FunnelSeries.prototype.renderPoint = function (point, series, chart, options, seriesGroup, redraw) {\n if (!point.visible) {\n removeElement(options.id);\n return null;\n }\n var direction = this.getSegmentData(point, series, chart);\n point.midAngle = 0;\n options.d = direction;\n appendChildElement(seriesGroup, chart.renderer.drawPath(options), redraw);\n if (point.isExplode) {\n chart.accBaseModule.explodePoints(point.index, chart, true);\n }\n };\n /**\n * To get the module name of the funnel series.\n */\n FunnelSeries.prototype.getModuleName = function () {\n return 'FunnelSeries';\n };\n /**\n * To destroy the funnel series.\n * @return {void}\n * @private\n */\n FunnelSeries.prototype.destroy = function (accumulation) {\n /**\n * Destroys the funnel series\n */\n };\n return FunnelSeries;\n}(TriangularBase));\nexport { FunnelSeries };\n","/**\n * Defines the behavior of a pyramid series\n */\nvar __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { appendChildElement } from '../../common/utils/helper';\nimport { TriangularBase } from './triangular-base';\nimport { removeElement } from '../../sparkline/utils/helper';\n/**\n * PyramidSeries module used to render `Pyramid` Series.\n */\nvar PyramidSeries = /** @class */ (function (_super) {\n __extends(PyramidSeries, _super);\n function PyramidSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Defines the path of a pyramid segment\n */\n PyramidSeries.prototype.getSegmentData = function (point, series, chart) {\n var area = series.triangleSize;\n //top of th series\n var seriesTop = chart.initialClipRect.y + (chart.initialClipRect.height - area.height) / 2;\n var points = [];\n //consider, if the point is exploded\n var offset = 0;\n var extraSpace = (chart.initialClipRect.width - series.triangleSize.width) / 2;\n var emptySpaceAtLeft = extraSpace + chart.initialClipRect.x;\n //top and bottom\n var top = point.yRatio;\n var bottom = point.yRatio + point.heightRatio;\n //width of the top and bottom edge\n var topRadius = 0.5 * (1 - point.yRatio);\n var bottomRadius = 0.5 * (1 - bottom);\n top += seriesTop / area.height;\n bottom += seriesTop / area.height;\n var line1 = {\n x: emptySpaceAtLeft + offset + topRadius * area.width,\n y: top * area.height\n };\n var line2 = {\n x: emptySpaceAtLeft + offset + (1 - topRadius) * area.width,\n y: top * area.height\n };\n var line3 = {\n x: emptySpaceAtLeft + offset + (1 - bottomRadius) * area.width,\n y: bottom * area.height\n };\n var line4 = {\n x: emptySpaceAtLeft + offset + bottomRadius * area.width,\n y: bottom * area.height\n };\n var polygon = [line1, line2, line3, line4];\n this.setLabelLocation(series, point, polygon);\n var direction = this.findPath(polygon);\n return direction;\n };\n /**\n * Initializes the size of the pyramid segments\n * @private\n */\n PyramidSeries.prototype.initializeSizeRatio = function (points, series) {\n if (series.pyramidMode === 'Linear') {\n _super.prototype.initializeSizeRatio.call(this, points, series, true);\n }\n else {\n this.calculateSurfaceSegments(series);\n }\n };\n /**\n * Defines the size of the pyramid segments, the surface of that will reflect the values\n */\n PyramidSeries.prototype.calculateSurfaceSegments = function (series) {\n var count = series.points.length;\n var sumOfValues = series.sumOfPoints;\n var yRatio = 0;\n var y = [];\n var height = [];\n var gapRatio = Math.min(0, Math.max(series.gapRatio, 1));\n var gapHeight = gapRatio / (count - 1);\n var preSum = this.getSurfaceHeight(0, sumOfValues);\n var currY = 0;\n for (var i = 0; i < count; i++) {\n if (series.points[i].visible) {\n y[i] = currY;\n height[i] = this.getSurfaceHeight(currY, Math.abs(series.points[i].y));\n currY += height[i] + gapHeight * preSum;\n }\n }\n var coef = 1 / (currY - gapHeight * preSum);\n for (var i = 0; i < count; i++) {\n if (series.points[i].visible) {\n series.points[i].yRatio = coef * y[i];\n series.points[i].heightRatio = coef * height[i];\n }\n }\n };\n /**\n * Finds the height of pyramid segment\n */\n PyramidSeries.prototype.getSurfaceHeight = function (y, surface) {\n var result = this.solveQuadraticEquation(1, 2 * y, -surface);\n return result;\n };\n /**\n * Solves quadratic equation\n */\n PyramidSeries.prototype.solveQuadraticEquation = function (a, b, c) {\n var root1;\n var root2;\n var d = b * b - 4 * a * c;\n if (d >= 0) {\n var sd = Math.sqrt(d);\n root1 = (-b - sd) / (2 * a);\n root2 = (-b + sd) / (2 * a);\n return Math.max(root1, root2);\n }\n return 0;\n };\n /**\n * Renders a pyramid segment\n */\n PyramidSeries.prototype.renderPoint = function (point, series, chart, options, seriesGroup, redraw) {\n if (!point.visible) {\n removeElement(options.id);\n return null;\n }\n options.d = this.getSegmentData(point, series, chart);\n point.midAngle = 0;\n appendChildElement(seriesGroup, chart.renderer.drawPath(options), redraw);\n if (point.isExplode) {\n chart.accBaseModule.explodePoints(point.index, chart, true);\n }\n };\n /**\n * To get the module name of the Pyramid series.\n */\n PyramidSeries.prototype.getModuleName = function () {\n return 'PyramidSeries';\n };\n /**\n * To destroy the pyramid series\n * @return {void}\n * @private\n */\n PyramidSeries.prototype.destroy = function (accumulation) {\n /**\n * Destroys the pyramid series\n */\n };\n return PyramidSeries;\n}(TriangularBase));\nexport { PyramidSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * AccumulationChart legend\n */\nimport { extend, isNullOrUndefined, Animation } from '@syncfusion/ej2-base';\nimport { pointByIndex } from '../model/acc-base';\nimport { BaseLegend, LegendOptions } from '../../common/legend/legend';\nimport { Rect, measureText } from '@syncfusion/ej2-svg-base';\nimport { textTrim, getElement } from '../../common/utils/helper';\n/**\n * AccumulationLegend module used to render `Legend` for Accumulation chart.\n */\nvar AccumulationLegend = /** @class */ (function (_super) {\n __extends(AccumulationLegend, _super);\n /**\n * Constructor for Accumulation Legend.\n * @param chart\n */\n function AccumulationLegend(chart) {\n var _this = _super.call(this, chart) || this;\n _this.library = _this;\n _this.titleRect = new Rect(0, chart.margin.top, 0, 0);\n return _this;\n }\n /**\n * Get the legend options.\n * @return {void}\n * @private\n */\n AccumulationLegend.prototype.getLegendOptions = function (chart, series) {\n this.legendCollections = [];\n for (var i = 0; i < 1; i++) {\n var seriesType = series[i].type;\n if (seriesType === 'Pie' || seriesType === 'Doughnut') {\n seriesType = (series[i].innerRadius !== '0' && series[i].innerRadius !== '0%') ?\n 'Doughnut' : 'Pie';\n }\n for (var _i = 0, _a = series[i].points; _i < _a.length; _i++) {\n var point = _a[_i];\n if (!isNullOrUndefined(point.x) && !isNullOrUndefined(point.y)) {\n this.legendCollections.push(new LegendOptions(point.x.toString(), point.color, series[i].legendShape, point.visible, seriesType, null, null, point.index, series[i].index));\n }\n }\n }\n };\n /**\n * To find legend bounds for accumulation chart.\n * @private\n */\n AccumulationLegend.prototype.getLegendBounds = function (availableSize, legendBounds, legend) {\n var extraWidth = 0;\n var extraHeight = 0;\n var padding = legend.padding;\n if (!this.isVertical) {\n extraHeight = !legend.height ? ((availableSize.height / 100) * 5) : 0;\n }\n else {\n extraWidth = !legend.width ? ((availableSize.width / 100) * 5) : 0;\n }\n legendBounds.width += extraWidth;\n legendBounds.height += extraHeight;\n var shapePadding = legend.shapePadding;\n var maximumWidth = 0;\n var shapeWidth = legend.shapeWidth;\n var rowWidth = 0;\n var rowCount = 0;\n var columnWidth = [];\n var columnHeight = 0;\n var legendWidth = 0;\n this.maxItemHeight = Math.max(measureText('MeasureText', legend.textStyle).height, legend.shapeHeight);\n var legendEventArgs;\n var render = false;\n for (var _i = 0, _a = this.legendCollections; _i < _a.length; _i++) {\n var legendOption = _a[_i];\n legendEventArgs = { fill: legendOption.fill, text: legendOption.text, shape: legendOption.shape,\n name: 'legendRender', cancel: false };\n this.chart.trigger('legendRender', legendEventArgs);\n legendOption.render = !legendEventArgs.cancel;\n legendOption.text = legendEventArgs.text;\n legendOption.fill = legendEventArgs.fill;\n legendOption.shape = legendEventArgs.shape;\n legendOption.textSize = measureText(legendOption.text, legend.textStyle);\n if (legendOption.render && legendOption.text !== '') {\n render = true;\n legendWidth = shapeWidth + shapePadding + legendOption.textSize.width + padding;\n if (this.isVertical) {\n ++rowCount;\n columnHeight = (rowCount * (this.maxItemHeight + padding)) + padding;\n if ((rowCount * (this.maxItemHeight + padding)) + padding > legendBounds.height) {\n columnHeight = Math.max(columnHeight, (rowCount * (this.maxItemHeight + padding)) + padding);\n rowWidth = rowWidth + maximumWidth;\n columnWidth.push(maximumWidth);\n this.totalPages = Math.max(rowCount, this.totalPages || 1);\n maximumWidth = 0;\n rowCount = 1;\n }\n maximumWidth = Math.max(legendWidth, maximumWidth);\n }\n else {\n rowWidth = rowWidth + legendWidth;\n if (legendBounds.width < (padding + rowWidth)) {\n maximumWidth = Math.max(maximumWidth, (rowWidth + padding - legendWidth));\n if (rowCount === 0 && (legendWidth !== rowWidth)) {\n rowCount = 1;\n }\n rowWidth = legendWidth;\n rowCount++;\n columnHeight = (rowCount * (this.maxItemHeight + padding)) + padding;\n }\n }\n }\n }\n if (this.isVertical) {\n rowWidth = rowWidth + maximumWidth;\n this.isPaging = legendBounds.width < (rowWidth + padding);\n columnHeight = Math.max(columnHeight, ((this.totalPages || 1) * (this.maxItemHeight + padding)) + padding);\n this.isPaging = this.isPaging && (this.totalPages > 1);\n if (columnWidth[columnWidth.length - 1] !== maximumWidth) {\n columnWidth.push(maximumWidth);\n }\n }\n else {\n this.isPaging = legendBounds.height < columnHeight;\n this.totalPages = this.totalRowCount = rowCount;\n columnHeight = Math.max(columnHeight, (this.maxItemHeight + padding) + padding);\n }\n this.maxColumns = 0; // initialization for max columns\n var width = this.isVertical ? this.getMaxColumn(columnWidth, legendBounds.width, padding, rowWidth + padding) :\n Math.max(rowWidth + padding, maximumWidth);\n if (render) { // if any legends not skipped in event check\n this.setBounds(width, columnHeight, legend, legendBounds);\n }\n else {\n this.setBounds(0, 0, legend, legendBounds);\n }\n };\n /**\n * To find maximum column size for legend\n */\n AccumulationLegend.prototype.getMaxColumn = function (columns, width, padding, rowWidth) {\n var maxPageColumn = padding;\n this.maxColumnWidth = Math.max.apply(null, columns);\n for (var _i = 0, columns_1 = columns; _i < columns_1.length; _i++) {\n var column = columns_1[_i];\n maxPageColumn += this.maxColumnWidth;\n this.maxColumns++;\n if (maxPageColumn + padding > width) {\n maxPageColumn -= this.maxColumnWidth;\n this.maxColumns--;\n break;\n }\n }\n this.isPaging = (maxPageColumn < rowWidth) && (this.totalPages > 1);\n if (maxPageColumn === padding) {\n maxPageColumn = width;\n }\n this.maxColumns = Math.max(1, this.maxColumns);\n this.maxWidth = maxPageColumn;\n return maxPageColumn;\n };\n /**\n * To find available width from legend x position.\n */\n AccumulationLegend.prototype.getAvailWidth = function (tx, width, legendX) {\n if (this.isVertical) {\n width = this.maxWidth;\n }\n return width - ((this.legend.padding * 2) + this.legend.shapeWidth + this.legend.shapePadding);\n };\n /**\n * To find legend rendering locations from legend options.\n * @private\n */\n AccumulationLegend.prototype.getRenderPoint = function (legendOption, start, textPadding, prevLegend, rect, count, firstLegend) {\n var padding = this.legend.padding;\n if (this.isVertical) {\n if (count === firstLegend || (prevLegend.location.y + (this.maxItemHeight * 1.5) + (padding * 2) > rect.y + rect.height)) {\n legendOption.location.x = prevLegend.location.x + ((count === firstLegend) ? 0 : this.maxColumnWidth);\n legendOption.location.y = start.y;\n this.pageXCollections.push(legendOption.location.x - (this.legend.shapeWidth / 2) - padding);\n this.totalPages++;\n }\n else {\n legendOption.location.x = prevLegend.location.x;\n legendOption.location.y = prevLegend.location.y + this.maxItemHeight + padding;\n }\n }\n else {\n var previousBound = (prevLegend.location.x + textPadding + prevLegend.textSize.width);\n if ((previousBound + (legendOption.textSize.width + textPadding)) > (rect.x + rect.width + this.legend.shapeWidth / 2)) {\n legendOption.location.y = (count === firstLegend) ? prevLegend.location.y :\n prevLegend.location.y + this.maxItemHeight + padding;\n legendOption.location.x = start.x;\n }\n else {\n legendOption.location.y = prevLegend.location.y;\n legendOption.location.x = (count === firstLegend) ? prevLegend.location.x : previousBound;\n }\n this.totalPages = this.totalRowCount;\n }\n var availablewidth = this.getAvailWidth(legendOption.location.x, this.legendBounds.width, this.legendBounds.x);\n legendOption.text = textTrim(+availablewidth.toFixed(4), legendOption.text, this.legend.textStyle);\n };\n /**\n * finding the smart legend place according to positions.\n * @return {void}\n * @private\n */\n AccumulationLegend.prototype.getSmartLegendLocation = function (labelBound, legendBound, margin) {\n var space;\n switch (this.position) {\n case 'Left':\n space = ((labelBound.x - legendBound.width) - margin.left) / 2;\n legendBound.x = (labelBound.x - legendBound.width) < margin.left ? legendBound.x :\n (labelBound.x - legendBound.width) - space;\n break;\n case 'Right':\n space = ((this.chart.availableSize.width - margin.right) - (labelBound.x + labelBound.width + legendBound.width)) / 2;\n legendBound.x = (labelBound.x + labelBound.width + legendBound.width) > (this.chart.availableSize.width - margin.right) ?\n legendBound.x : (labelBound.x + labelBound.width + space);\n break;\n case 'Top':\n this.getTitleRect(this.chart);\n space = ((labelBound.y - legendBound.height) - (this.titleRect.y + this.titleRect.height)) / 2;\n legendBound.y = (labelBound.y - legendBound.height) < margin.top ? legendBound.y :\n (labelBound.y - legendBound.height) - space;\n break;\n case 'Bottom':\n space = ((this.chart.availableSize.height - margin.bottom) - (labelBound.y + labelBound.height + legendBound.height)) / 2;\n legendBound.y = labelBound.y + labelBound.height + legendBound.height > (this.chart.availableSize.height - margin.bottom) ?\n legendBound.y : (labelBound.y + labelBound.height) + space;\n break;\n }\n };\n /**\n * To get title rect.\n */\n AccumulationLegend.prototype.getTitleRect = function (accumulation) {\n if (!accumulation.title) {\n return null;\n }\n var titleSize = measureText(accumulation.title, accumulation.titleStyle);\n this.titleRect = new Rect(accumulation.availableSize.width / 2 - titleSize.width / 2, accumulation.margin.top, titleSize.width, titleSize.height);\n };\n /**\n * To get legend by index\n */\n AccumulationLegend.prototype.legendByIndex = function (index, legendCollections) {\n for (var _i = 0, legendCollections_1 = legendCollections; _i < legendCollections_1.length; _i++) {\n var legend = legendCollections_1[_i];\n if (legend.pointIndex === index) {\n return legend;\n }\n }\n return null;\n };\n /**\n * To show or hide the legend on clicking the legend.\n * @return {void}\n */\n AccumulationLegend.prototype.click = function (event) {\n var targetId = event.target.id;\n var chart = this.chart;\n var legendItemsId = [this.legendID + '_text_', this.legendID + '_shape_',\n this.legendID + '_shape_marker_'];\n var selectedDataIndexes = [];\n if (this.chart.accumulationSelectionModule) {\n selectedDataIndexes = extend([], this.chart.accumulationSelectionModule.selectedDataIndexes, null, true);\n }\n this.chart.animateSeries = false;\n for (var _i = 0, legendItemsId_1 = legendItemsId; _i < legendItemsId_1.length; _i++) {\n var id = legendItemsId_1[_i];\n if (targetId.indexOf(id) > -1) {\n var pointIndex = parseInt(targetId.split(id)[1], 10);\n if (this.chart.legendSettings.toggleVisibility) {\n var currentSeries = this.chart.visibleSeries[0];\n var point = pointByIndex(pointIndex, currentSeries.points);\n var legendOption = this.legendByIndex(pointIndex, this.legendCollections);\n point.visible = !point.visible;\n legendOption.visible = point.visible;\n currentSeries.sumOfPoints += point.visible ? point.y : -point.y;\n chart.redraw = chart.enableAnimation;\n this.sliceVisibility(pointIndex, point.visible);\n chart.removeSvg();\n this.chart.refreshPoints(currentSeries.points);\n this.chart.renderElements();\n }\n else if (this.chart.accumulationSelectionModule) {\n this.chart.accumulationSelectionModule.legendSelection(this.chart, 0, pointIndex);\n }\n }\n }\n if (targetId.indexOf(this.legendID + '_pageup') > -1) {\n this.changePage(event, true);\n }\n else if (targetId.indexOf(this.legendID + '_pagedown') > -1) {\n this.changePage(event, false);\n }\n chart.redraw = false;\n };\n /**\n * To translate the point elements by index and position\n */\n AccumulationLegend.prototype.sliceVisibility = function (index, isVisible) {\n var sliceId = this.chart.element.id + '_Series_0_Point_';\n if (this.chart.visibleSeries[0].dataLabel.visible) {\n sliceId = this.chart.element.id + '_datalabel_Series_0_';\n this.sliceAnimate(getElement(sliceId + 'g_' + index), isVisible);\n }\n };\n /**\n * Slice animation\n * @param element\n * @param name\n * @param isVisible\n */\n AccumulationLegend.prototype.sliceAnimate = function (element, isVisible) {\n if (!element) {\n return null;\n }\n new Animation({}).animate(element, {\n duration: 300,\n delay: 0,\n name: isVisible ? 'FadeIn' : 'FadeOut',\n end: function (args) {\n args.element.style.visibility = isVisible ? 'visible' : 'hidden';\n },\n });\n };\n /**\n * Get module name\n */\n AccumulationLegend.prototype.getModuleName = function () {\n return 'AccumulationLegend';\n };\n /**\n * To destroy the Legend.\n * @return {void}\n * @private\n */\n AccumulationLegend.prototype.destroy = function (chart) {\n /**\n * Destroy method calling here\n */\n };\n return AccumulationLegend;\n}(BaseLegend));\nexport { AccumulationLegend };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * AccumulationChart DataLabel module file\n */\nimport { extend, createElement, getValue } from '@syncfusion/ej2-base';\nimport { Rect, PathOption, measureText, TextOption } from '@syncfusion/ej2-svg-base';\nimport { ChartLocation, degreeToLocation, isOverlap, stringToNumber, getAngle, appendChildElement } from '../../common/utils/helper';\nimport { textTrim, subtractThickness, Thickness, getElement } from '../../common/utils/helper';\nimport { removeElement, RectOption, textElement, showTooltip } from '../../common/utils/helper';\nimport { colorNameToHex, convertHexToColor, containsRect } from '../../common/utils/helper';\nimport { getSeriesFromIndex } from '../model/acc-base';\nimport { textRender } from '../../common/model/constants';\nimport { getFontStyle, createTemplate, measureElementRect, templateAnimate } from '../../common/utils/helper';\nimport { AccumulationBase } from './accumulation-base';\n/**\n * AccumulationDataLabel module used to render `dataLabel`.\n */\nvar AccumulationDataLabel = /** @class */ (function (_super) {\n __extends(AccumulationDataLabel, _super);\n function AccumulationDataLabel(accumulation) {\n var _this = _super.call(this, accumulation) || this;\n _this.id = accumulation.element.id + '_datalabel_Series_';\n if (accumulation.title) {\n var titleSize = measureText(accumulation.title, accumulation.titleStyle);\n _this.titleRect = new Rect(accumulation.availableSize.width / 2 - titleSize.width / 2, accumulation.margin.top, titleSize.width, titleSize.height);\n }\n return _this;\n }\n /**\n * Method to get datalabel text location.\n * @private\n */\n AccumulationDataLabel.prototype.getDataLabelPosition = function (point, dataLabel, textSize, points, parent, id) {\n var radius = this.isCircular() ? (!this.isVariousRadius() ? this.accumulation.pieSeriesModule.labelRadius :\n this.accumulation.pieSeriesModule.getLabelRadius(this.accumulation.visibleSeries[0], point)) :\n this.getLabelDistance(point, dataLabel);\n //let radius: number = this.isCircular() ? this.labelRadius : this.getLabelDistance(point, dataLabel);\n this.getLabelRegion(point, dataLabel.position, textSize, radius, this.marginValue);\n point.labelAngle = point.midAngle;\n point.labelPosition = dataLabel.position;\n if (this.accumulation.enableSmartLabels) {\n this.getSmartLabel(point, dataLabel, textSize, points, parent, id);\n }\n };\n /**\n * Method to get datalabel bound.\n */\n AccumulationDataLabel.prototype.getLabelRegion = function (point, position, textSize, labelRadius, margin, endAngle) {\n if (endAngle === void 0) { endAngle = 0; }\n var labelAngle = endAngle || point.midAngle;\n var space = 10;\n var location = degreeToLocation(labelAngle, labelRadius, this.isCircular() ? this.center :\n this.getLabelLocation(point, position));\n location.y = (position === 'Inside') ? (location.y - textSize.height / 2) : location.y;\n location.x = (position === 'Inside') ? (location.x - textSize.width / 2) : location.x;\n point.labelRegion = new Rect(location.x, location.y, textSize.width + (margin * 2), textSize.height + (margin * 2));\n if (position === 'Outside') {\n point.labelRegion.y -= point.labelRegion.height / 2;\n if (labelAngle >= 90 && labelAngle <= 270) {\n point.labelRegion.x -= (point.labelRegion.width + space);\n }\n else {\n point.labelRegion.x += space;\n }\n }\n };\n /**\n * Method to get datalabel smart position.\n */\n AccumulationDataLabel.prototype.getSmartLabel = function (point, dataLabel, textSize, points, parent, id) {\n var circular = this.isCircular();\n var labelRadius = circular ? this.radius : this.getLabelDistance(point, dataLabel);\n var connectorLength = circular ? (dataLabel.connectorStyle.length || '4%') :\n '0px';\n labelRadius += stringToNumber(connectorLength, labelRadius);\n var previousPoint = this.findPreviousPoint(points, point.index, point.labelPosition);\n if (dataLabel.position === 'Inside') {\n if (previousPoint && previousPoint.labelRegion && (isOverlap(point.labelRegion, previousPoint.labelRegion)\n || this.isOverlapping(point, points)) || !circular && !containsRect(point.region, point.labelRegion)) {\n point.labelPosition = 'Outside';\n if (!circular) {\n labelRadius = this.getLabelDistance(point, dataLabel);\n }\n this.getLabelRegion(point, point.labelPosition, textSize, labelRadius, this.marginValue);\n previousPoint = this.findPreviousPoint(points, point.index, point.labelPosition);\n if (previousPoint && (isOverlap(point.labelRegion, previousPoint.labelRegion) ||\n this.isConnectorLineOverlapping(point, previousPoint))) {\n this.setOuterSmartLabel(previousPoint, point, dataLabel.border.width, labelRadius, textSize, this.marginValue);\n }\n }\n }\n else {\n if (previousPoint && previousPoint.labelRegion && (isOverlap(point.labelRegion, previousPoint.labelRegion)\n || this.isOverlapping(point, points) || this.isConnectorLineOverlapping(point, previousPoint))) {\n this.setOuterSmartLabel(previousPoint, point, dataLabel.border.width, labelRadius, textSize, this.marginValue);\n }\n }\n if (this.isOverlapping(point, points) || (this.titleRect && point.labelRegion && isOverlap(point.labelRegion, this.titleRect))) {\n this.setPointVisibileFalse(point);\n }\n if (this.accumulation.accumulationLegendModule && point.labelVisible && point.labelRegion) {\n var rect = this.accumulation.accumulationLegendModule.legendBounds;\n var padding = this.accumulation.legendSettings.border.width / 2;\n this.textTrimming(point, new Rect(rect.x - padding, rect.y - padding, rect.width + (2 * padding), rect.height + (2 * padding)), dataLabel.font, this.accumulation.accumulationLegendModule.position);\n }\n if (point.labelVisible && point.labelRegion) {\n var position = this.isCircular() ? (point.labelRegion.x >= this.center.x) ? 'InsideRight' : 'InsideLeft' :\n 'InsideRight';\n this.textTrimming(point, this.areaRect, dataLabel.font, position);\n }\n if (point.labelVisible && point.labelRegion && ((point.labelRegion.y + point.labelRegion.height >\n this.areaRect.y + this.areaRect.height || point.labelRegion.y < this.areaRect.y) || (point.labelRegion.x < this.areaRect.x ||\n point.labelRegion.x + point.labelRegion.width > this.areaRect.x + this.areaRect.width))) {\n this.setPointVisibileFalse(point);\n }\n };\n /**\n * To find trimmed datalabel tooltip needed.\n * @return {void}\n * @private\n */\n AccumulationDataLabel.prototype.move = function (e, x, y, isTouch) {\n var _this = this;\n if (e.target.textContent.indexOf('...') > -1) {\n var targetId = e.target.id.split(this.id);\n if (targetId.length === 2) {\n var seriesIndex = parseInt(targetId[1].split('_text_')[0], 10);\n var pointIndex = parseInt(targetId[1].split('_text_')[1], 10);\n if (!isNaN(seriesIndex) && !isNaN(pointIndex)) {\n if (isTouch) {\n removeElement(this.accumulation.element.id + '_EJ2_Datalabel_Tooltip');\n }\n var point = getSeriesFromIndex(seriesIndex, (this.accumulation).visibleSeries).points[pointIndex];\n showTooltip(point.text || point.y.toString(), x, y, this.areaRect.width, this.accumulation.element.id + '_EJ2_Datalabel_Tooltip', getElement(this.accumulation.element.id + '_Secondary_Element'));\n }\n }\n }\n else {\n removeElement(this.accumulation.element.id + '_EJ2_Datalabel_Tooltip');\n }\n if (isTouch) {\n clearTimeout(this.clearTooltip);\n this.clearTooltip = +setTimeout(function () { removeElement(_this.accumulation.element.id + '_EJ2_Datalabel_Tooltip'); }, 1000);\n }\n };\n /**\n * To find previous valid label point\n */\n AccumulationDataLabel.prototype.findPreviousPoint = function (points, index, position) {\n var point = points[0];\n for (var i = index - 1; i >= 0; i--) {\n point = points[i];\n if (point.visible && point.labelVisible && point.labelRegion && point.labelPosition === position) {\n return point;\n }\n }\n return null;\n };\n /**\n * To find current point datalabel is overlapping with other points\n */\n AccumulationDataLabel.prototype.isOverlapping = function (currentPoint, points) {\n for (var i = currentPoint.index - 1; i >= 0; i--) {\n if (points[i].visible && points[i].labelVisible && points[i].labelRegion && currentPoint.labelRegion &&\n currentPoint.labelVisible && isOverlap(currentPoint.labelRegion, points[i].labelRegion)) {\n return true;\n }\n }\n return false;\n };\n /**\n * To get text trimmed while exceeds the accumulation chart area.\n */\n AccumulationDataLabel.prototype.textTrimming = function (point, rect, font, position) {\n if (isOverlap(point.labelRegion, rect)) {\n var size = point.labelRegion.width;\n if (position === 'Right') {\n size = rect.x - point.labelRegion.x;\n }\n else if (position === 'Left') {\n size = point.labelRegion.x - (rect.x + rect.width);\n if (size < 0) {\n size += point.labelRegion.width;\n point.labelRegion.x = rect.x + rect.width;\n }\n }\n else if (position === 'InsideRight') {\n size = (rect.x + rect.width) - point.labelRegion.x;\n }\n else if (position === 'InsideLeft') {\n size = (point.labelRegion.x + point.labelRegion.width) - rect.x;\n if (size < point.labelRegion.width) {\n point.labelRegion.x = rect.x;\n }\n }\n else {\n this.setPointVisibileFalse(point);\n }\n if (point.labelVisible && point.labelRegion) {\n if (size < point.labelRegion.width) {\n point.label = textTrim(size - (this.marginValue * 2), point.label, font);\n point.labelRegion.width = size;\n }\n if (point.label.length === 3 && point.label.indexOf('...') > -1) {\n this.setPointVisibileFalse(point);\n }\n }\n }\n };\n /**\n * To set point label visible and region to disable.\n */\n AccumulationDataLabel.prototype.setPointVisibileFalse = function (point) {\n point.labelVisible = false;\n point.labelRegion = null;\n };\n /**\n * To set datalabel angle position for outside labels\n */\n AccumulationDataLabel.prototype.setOuterSmartLabel = function (previousPoint, point, border, labelRadius, textsize, margin) {\n if (!this.isCircular()) {\n this.setSmartLabelForSegments(point, previousPoint, labelRadius, textsize, margin);\n }\n else {\n var labelAngle = this.getOverlappedAngle(previousPoint.labelRegion, point.labelRegion, point.midAngle, border * 2);\n this.getLabelRegion(point, 'Outside', textsize, labelRadius, margin, labelAngle);\n if (labelAngle > point.endAngle) {\n this.setPointVisibileFalse(point);\n }\n point.labelAngle = labelAngle;\n while (point.labelVisible && (isOverlap(previousPoint.labelRegion, point.labelRegion) || labelAngle <= previousPoint.labelAngle\n || this.isConnectorLineOverlapping(point, previousPoint))) {\n if (labelAngle > point.endAngle) {\n this.setPointVisibileFalse(point);\n break;\n }\n point.labelAngle = labelAngle;\n this.getLabelRegion(point, 'Outside', textsize, labelRadius, margin, labelAngle);\n labelAngle += 0.1;\n }\n }\n };\n /**\n * Sets smart label positions for funnel and pyramid series\n */\n AccumulationDataLabel.prototype.setSmartLabelForSegments = function (point, prevPoint, distance, textSize, margin) {\n var textRegion = point.labelRegion;\n //let overlapWidth: number = prevPoint.labelRegion.x + prevPoint.labelRegion.width - textRegion.x;\n var overlapHeight = this.accumulation.type === 'Funnel' ?\n prevPoint.labelRegion.y - (textRegion.y + textRegion.height) :\n point.labelRegion.y - (prevPoint.labelRegion.y + prevPoint.labelRegion.height);\n if (overlapHeight < 0) {\n point.labelRegion.y += this.accumulation.type === 'Funnel' ? overlapHeight : -overlapHeight;\n }\n };\n /**\n * To find connector line overlapping.\n */\n AccumulationDataLabel.prototype.isConnectorLineOverlapping = function (point, previous) {\n var start = this.getLabelLocation(point);\n var end = new ChartLocation(0, 0);\n this.getEdgeOfLabel(point.labelRegion, point.labelAngle, end);\n var previousstart = this.getLabelLocation(previous);\n var previousend = new ChartLocation(0, 0);\n this.getEdgeOfLabel(previous.labelRegion, previous.labelAngle, previousend);\n return this.isLineRectangleIntersect(start, end, point.labelRegion) ||\n this.isLineRectangleIntersect(start, end, previous.labelRegion) ||\n this.isLineRectangleIntersect(previousstart, previousend, point.labelRegion);\n };\n /**\n * To find two rectangle intersect\n */\n AccumulationDataLabel.prototype.isLineRectangleIntersect = function (line1, line2, rect) {\n var rectPoints = [\n new ChartLocation(Math.round(rect.x), Math.round(rect.y)),\n new ChartLocation(Math.round((rect.x + rect.width)), Math.round(rect.y)),\n new ChartLocation(Math.round((rect.x + rect.width)), Math.round((rect.y + rect.height))),\n new ChartLocation(Math.round(rect.x), Math.round((rect.y + rect.height)))\n ];\n line1.x = Math.round(line1.x);\n line1.y = Math.round(line1.y);\n line2.x = Math.round(line2.x);\n line2.y = Math.round(line2.y);\n for (var i = 0; i < rectPoints.length; i++) {\n if (this.isLinesIntersect(line1, line2, rectPoints[i], rectPoints[(i + 1) % rectPoints.length])) {\n return true;\n }\n }\n return false;\n };\n /**\n * To find two line intersect\n */\n AccumulationDataLabel.prototype.isLinesIntersect = function (point1, point2, point11, point12) {\n var a1 = point2.y - point1.y;\n var b1 = point1.x - point2.x;\n var c1 = a1 * point1.x + b1 * point1.y;\n var a2 = point12.y - point11.y;\n var b2 = point11.x - point12.x;\n var c2 = a2 * point11.x + b2 * point11.y;\n var delta = a1 * b2 - a2 * b1;\n if (delta !== 0) {\n var x = (b2 * c1 - b1 * c2) / delta;\n var y = (a1 * c2 - a2 * c1) / delta;\n var lies = Math.min(point1.x, point2.x) <= x && x <= Math.max(point1.x, point2.x);\n lies = lies && Math.min(point1.y, point2.y) <= y && y <= Math.max(point1.y, point2.y);\n lies = lies && Math.min(point11.x, point12.x) <= x && x <= Math.max(point11.x, point12.x);\n lies = lies && Math.min(point11.y, point12.y) <= y && y <= Math.max(point11.y, point12.y);\n return lies;\n }\n return false;\n };\n /**\n * To get two rectangle overlapping angles.\n */\n AccumulationDataLabel.prototype.getOverlappedAngle = function (first, second, angle, padding) {\n var x = first.x;\n if (angle >= 90 && angle <= 270) {\n second.y = first.y - (padding + second.height / 2);\n x = first.x + first.width;\n }\n else {\n second.y = first.y + first.height + padding;\n }\n return getAngle(this.center, new ChartLocation(x, second.y));\n };\n /**\n * To get connector line path\n */\n AccumulationDataLabel.prototype.getConnectorPath = function (label, point, dataLabel, end) {\n if (end === void 0) { end = 0; }\n var connector = dataLabel.connectorStyle;\n var labelRadius = this.isCircular() ? (!this.isVariousRadius() ? this.labelRadius :\n this.accumulation.pieSeriesModule.getLabelRadius(this.accumulation.visibleSeries[0], point)) :\n this.getLabelDistance(point, dataLabel);\n //let labelRadius: number = this.isCircular() ? this.labelRadius : this.getLabelDistance(point, dataLabel);\n var start = this.getConnectorStartPoint(point, connector);\n var labelAngle = end || point.midAngle;\n var middle = new ChartLocation(0, 0);\n var endPoint = this.getEdgeOfLabel(label, labelAngle, middle, connector.width);\n if (connector.type === 'Curve') {\n if (this.isCircular()) {\n var r = labelRadius - (this.isVariousRadius() ? stringToNumber(point.sliceRadius, this.accumulation.pieSeriesModule.seriesRadius) :\n this.radius);\n //let r: number = labelRadius - this.radius;\n middle = degreeToLocation(labelAngle, labelRadius - (r / 2), this.center);\n return 'M ' + start.x + ' ' + start.y + ' Q ' + middle.x + ' ' + middle.y + ' ' + endPoint.x + ' ' + endPoint.y;\n }\n else {\n return this.getPolyLinePath(start, endPoint);\n }\n }\n else {\n return 'M ' + start.x + ' ' + start.y + ' L ' + middle.x + ' ' + middle.y + ' L ' + endPoint.x + ' ' + endPoint.y;\n }\n };\n /**\n * Finds the curved path for funnel/pyramid data label connectors\n */\n AccumulationDataLabel.prototype.getPolyLinePath = function (start, end) {\n var controlPoints = [start, end];\n if (start.y === end.y) {\n return 'M ' + start.x + ' ' + start.y + ' L ' + end.x + ' ' + end.y;\n }\n var path = 'M';\n for (var i = 0; i <= 16; i++) {\n var t = i / 16;\n var points = this.getBezierPoint(t, controlPoints, 0, 2);\n path += points.x + ',' + points.y;\n if (i !== 16) {\n path += ' L';\n }\n }\n return path;\n };\n /**\n * Finds the bezier point for funnel/pyramid data label connectors\n */\n AccumulationDataLabel.prototype.getBezierPoint = function (t, controlPoints, index, count) {\n if (count === 1) {\n return controlPoints[index];\n }\n var p0 = this.getBezierPoint(t, controlPoints, index, count - 1);\n var p1 = this.getBezierPoint(t, controlPoints, index + 1, count - 1);\n var x = (p0.x) ? p0.x : p0.x;\n var y = (p0.y) ? p0.y : p0.y;\n var x1 = (p1.x) ? p1.x : p1.x;\n var y1 = (p1.y) ? p1.y : p1.y;\n var x2 = (1 - t) * x + t * x1;\n var y2 = (1 - t) * y + t * y1;\n if (p0.x) {\n return { x: x2, y: y2 };\n }\n else {\n return { x: x2, y: y2 };\n }\n };\n /**\n * To get label edges based on the center and label rect position.\n */\n AccumulationDataLabel.prototype.getEdgeOfLabel = function (labelshape, angle, middle, border) {\n if (border === void 0) { border = 1; }\n var edge = new ChartLocation(labelshape.x, labelshape.y);\n if (angle >= 90 && angle <= 270) {\n edge.x += labelshape.width + border / 2;\n edge.y += labelshape.height / 2;\n middle.x = edge.x + 10;\n middle.y = edge.y;\n }\n else {\n edge.x -= border / 2;\n edge.y += labelshape.height / 2;\n middle.x = edge.x - 10;\n middle.y = edge.y;\n }\n return edge;\n };\n /**\n * Finds the distance between the label position and the edge/center of the funnel/pyramid\n */\n AccumulationDataLabel.prototype.getLabelDistance = function (point, dataLabel) {\n if (point.labelPosition && dataLabel.position !== point.labelPosition || dataLabel.connectorStyle.length) {\n var length_1 = stringToNumber(dataLabel.connectorStyle.length || '70px', this.accumulation.initialClipRect.width);\n if (length_1 < this.accumulation.initialClipRect.width) {\n return length_1;\n }\n }\n var position = point.labelPosition || dataLabel.position;\n var series = this.accumulation.visibleSeries[0];\n var extraSpace = (this.accumulation.initialClipRect.width - series.triangleSize.width) / 2;\n var labelLocation;\n switch (position) {\n case 'Inside':\n return 0;\n case 'Outside':\n labelLocation = point.symbolLocation.x + point.labelOffset.x;\n return this.accumulation.initialClipRect.width - labelLocation - extraSpace;\n }\n };\n /**\n * Finds the label position / beginning of the connector(ouside funnel labels)\n */\n AccumulationDataLabel.prototype.getLabelLocation = function (point, position) {\n if (position === void 0) { position = 'Outside'; }\n if (this.accumulation.type !== 'Pie') {\n position = point.labelPosition || position;\n var location_1 = {\n x: point.symbolLocation.x,\n y: point.symbolLocation.y - point.labelOffset.y\n };\n switch (position) {\n case 'Inside':\n location_1.y = point.region.y + point.region.height / 2;\n break;\n case 'Outside':\n location_1.x += point.labelOffset.x;\n }\n return location_1;\n }\n else {\n //return degreeToLocation(point.midAngle, this.radius, this.center);\n return degreeToLocation(point.midAngle, (this.isVariousRadius() ? stringToNumber(point.sliceRadius, this.accumulation.pieSeriesModule.seriesRadius) :\n this.radius), this.center);\n }\n };\n /**\n * Finds the beginning of connector line\n */\n AccumulationDataLabel.prototype.getConnectorStartPoint = function (point, connector) {\n // return this.isCircular() ? degreeToLocation(point.midAngle, this.radius - connector.width, this.center) :\n // this.getLabelLocation(point);\n return this.isCircular() ? degreeToLocation(point.midAngle, (this.isVariousRadius() ? stringToNumber(point.sliceRadius, this.accumulation.pieSeriesModule.seriesRadius) :\n this.radius) - connector.width, this.center) : this.getLabelLocation(point);\n };\n /**\n * To find area rect based on margin, available size.\n * @private\n */\n AccumulationDataLabel.prototype.findAreaRect = function () {\n this.areaRect = new Rect(0, 0, this.accumulation.availableSize.width, this.accumulation.availableSize.height);\n var margin = this.accumulation.margin;\n subtractThickness(this.areaRect, new Thickness(margin.left, margin.right, margin.top, margin.bottom));\n };\n /**\n * To render the data labels from series points.\n */\n AccumulationDataLabel.prototype.renderDataLabel = function (point, dataLabel, parent, points, series, templateElement, redraw) {\n var id = this.accumulation.element.id + '_datalabel_Series_' + series + '_';\n var datalabelGroup = this.accumulation.renderer.createGroup({ id: id + 'g_' + point.index });\n point.label = point.originalText || point.y.toString();\n var border = { width: dataLabel.border.width, color: dataLabel.border.color };\n var argsFont = (extend({}, getValue('properties', dataLabel.font), null, true));\n var argsData = {\n cancel: false, name: textRender, series: this.accumulation.visibleSeries[0], point: point,\n text: point.label, border: border, color: dataLabel.fill, template: dataLabel.template, font: argsFont\n };\n this.accumulation.trigger(textRender, argsData);\n var isTemplate = argsData.template !== null;\n point.labelVisible = !argsData.cancel;\n point.text = point.label = argsData.text;\n this.marginValue = argsData.border.width ? (5 + argsData.border.width) : 1;\n // Template element\n var childElement = createElement('div', {\n id: this.accumulation.element.id + '_Series_' + 0 + '_DataLabel_' + point.index,\n styles: 'position: absolute;background-color:' + argsData.color + ';' +\n getFontStyle(dataLabel.font) + ';border:' + argsData.border.width + 'px solid ' + argsData.border.color + ';'\n });\n var textSize = isTemplate ? this.getTemplateSize(childElement, point, argsData, redraw) :\n measureText(point.label, dataLabel.font);\n textSize.height += 4; // 4 for calculation with padding for smart label shape\n textSize.width += 4;\n this.getDataLabelPosition(point, dataLabel, textSize, points, datalabelGroup, id);\n var dataLabelElement;\n var location;\n var element;\n if (point.labelVisible) {\n this.correctLabelRegion(point.labelRegion, textSize);\n if (isTemplate) {\n this.setTemplateStyle(childElement, point, templateElement, dataLabel.font.color, argsData.color, redraw);\n }\n else {\n location = new ChartLocation(point.labelRegion.x + this.marginValue, point.labelRegion.y + (textSize.height * 3 / 4) + this.marginValue);\n element = getElement(id + 'shape_' + point.index);\n var startLocation = element ? new ChartLocation(+element.getAttribute('x'), +element.getAttribute('y')) : null;\n dataLabelElement = this.accumulation.renderer.drawRectangle(new RectOption(id + 'shape_' + point.index, argsData.color, argsData.border, 1, point.labelRegion, dataLabel.rx, dataLabel.ry));\n appendChildElement(datalabelGroup, dataLabelElement, redraw, true, 'x', 'y', startLocation, null, false, false, null, this.accumulation.duration);\n textElement(new TextOption(id + 'text_' + point.index, location.x, location.y, 'start', point.label, '', 'auto'), argsData.font, argsData.font.color || this.getSaturatedColor(point, argsData.color), datalabelGroup, false, redraw, true, false, this.accumulation.duration);\n element = null;\n }\n if (this.accumulation.accumulationLegendModule && (dataLabel.position === 'Outside' || this.accumulation.enableSmartLabels)) {\n this.accumulation.visibleSeries[0].findMaxBounds(this.accumulation.visibleSeries[0].labelBound, point.labelRegion);\n }\n if (point.labelPosition === 'Outside') {\n var element_1 = getElement(id + 'connector_' + point.index);\n var previousDirection = element_1 ? element_1.getAttribute('d') : '';\n var pathElement = this.accumulation.renderer.drawPath(new PathOption(id + 'connector_' + point.index, 'transparent', dataLabel.connectorStyle.width, dataLabel.connectorStyle.color || point.color, 1, dataLabel.connectorStyle.dashArray, this.getConnectorPath(extend({}, point.labelRegion, null, true), point, dataLabel, point.labelAngle)));\n appendChildElement(datalabelGroup, pathElement, redraw, true, null, null, null, previousDirection, false, false, null, this.accumulation.duration);\n }\n appendChildElement(parent, datalabelGroup, redraw);\n }\n };\n /**\n * To find the template element size\n * @param element\n * @param point\n * @param argsData\n */\n AccumulationDataLabel.prototype.getTemplateSize = function (element, point, argsData, redraw) {\n var clientRect;\n element = createTemplate(element, point.index, argsData.template, this.accumulation, point, this.accumulation.visibleSeries[0]);\n clientRect = measureElementRect(element, redraw);\n return { width: clientRect.width, height: clientRect.height };\n };\n /**\n * To set the template element style\n * @param childElement\n * @param point\n * @param parent\n * @param labelColor\n * @param fill\n */\n AccumulationDataLabel.prototype.setTemplateStyle = function (childElement, point, parent, labelColor, fill, redraw) {\n childElement.style.left = (point.labelRegion.x) + 'px';\n childElement.style.top = (point.labelRegion.y) + 'px';\n childElement.style.color = labelColor ||\n this.getSaturatedColor(point, fill);\n if (childElement.childElementCount) {\n appendChildElement(parent, childElement, redraw, true, 'left', 'top');\n this.doTemplateAnimation(this.accumulation, childElement);\n }\n };\n /**\n * To find saturated color for datalabel\n */\n AccumulationDataLabel.prototype.getSaturatedColor = function (point, color) {\n var saturatedColor;\n if (this.marginValue >= 1) {\n saturatedColor = color === 'transparent' ? this.getLabelBackground(point) : color;\n }\n else {\n saturatedColor = this.getLabelBackground(point);\n }\n saturatedColor = (saturatedColor === 'transparent') ? window.getComputedStyle(document.body, null).backgroundColor : saturatedColor;\n var rgbValue = convertHexToColor(colorNameToHex(saturatedColor));\n var contrast = Math.round((rgbValue.r * 299 + rgbValue.g * 587 + rgbValue.b * 114) / 1000);\n return contrast >= 128 ? 'black' : 'white';\n };\n /**\n * Animates the data label template.\n * @return {void}.\n * @private\n */\n AccumulationDataLabel.prototype.doTemplateAnimation = function (accumulation, element) {\n var series = accumulation.visibleSeries[0];\n var delay = series.animation.delay + series.animation.duration;\n if (series.animation.enable && accumulation.animateSeries) {\n element.style.visibility = 'hidden';\n templateAnimate(element, delay, 200, 'ZoomIn');\n }\n };\n /**\n * To find background color for the datalabel\n */\n AccumulationDataLabel.prototype.getLabelBackground = function (point) {\n return point.labelPosition === 'Outside' ?\n this.accumulation.background || this.accumulation.themeStyle.background : point.color;\n };\n /**\n * To correct the padding between datalabel regions.\n */\n AccumulationDataLabel.prototype.correctLabelRegion = function (labelRegion, textSize, padding) {\n if (padding === void 0) { padding = 4; }\n labelRegion.height -= padding;\n labelRegion.width -= padding;\n labelRegion.x += padding / 2;\n labelRegion.y += padding / 2;\n textSize.height -= padding;\n textSize.width -= padding;\n };\n /**\n * To get the dataLabel module name\n */\n AccumulationDataLabel.prototype.getModuleName = function () {\n return 'AccumulationDataLabel';\n };\n /**\n * To destroy the data label.\n * @return {void}\n * @private\n */\n AccumulationDataLabel.prototype.destroy = function (accumulation) {\n /**\n * Destroy method performed here\n */\n };\n return AccumulationDataLabel;\n}(AccumulationBase));\nexport { AccumulationDataLabel };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * AccumulationChart Tooltip file\n */\nimport { Browser, remove } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { AccPointData, withInBounds, indexFinder } from '../../common/utils/helper';\nimport { BaseTooltip } from '../../common/user-interaction/tooltip';\n/**\n * `AccumulationTooltip` module is used to render tooltip for accumulation chart.\n */\nvar AccumulationTooltip = /** @class */ (function (_super) {\n __extends(AccumulationTooltip, _super);\n function AccumulationTooltip(accumulation) {\n var _this = _super.call(this, accumulation) || this;\n _this.accumulation = accumulation;\n _this.addEventListener();\n return _this;\n }\n /**\n * @hidden\n */\n AccumulationTooltip.prototype.addEventListener = function () {\n if (this.accumulation.isDestroyed) {\n return;\n }\n this.accumulation.on(Browser.isPointer ? 'pointerleave' : 'mouseleave', this.mouseLeaveHandler, this);\n this.accumulation.on(Browser.touchMoveEvent, this.mouseMoveHandler, this);\n this.accumulation.on(Browser.touchEndEvent, this.mouseUpHandler, this);\n };\n AccumulationTooltip.prototype.mouseLeaveHandler = function (e) {\n this.removeTooltip(1000);\n };\n AccumulationTooltip.prototype.mouseUpHandler = function (e) {\n var control = this.accumulation;\n if (control.tooltip.enable && control.isTouch && withInBounds(control.mouseX, control.mouseY, control.initialClipRect)) {\n this.tooltip(e);\n this.removeTooltip(2000);\n }\n };\n AccumulationTooltip.prototype.mouseMoveHandler = function (e) {\n var control = this.accumulation;\n // Tooltip for chart series. \n if (control.tooltip.enable && withInBounds(control.mouseX, control.mouseY, control.initialClipRect)) {\n this.tooltip(e);\n }\n };\n /**\n * Renders the tooltip.\n * @param {PointerEvent} event - Mouse move event.\n * @return {void}\n */\n AccumulationTooltip.prototype.tooltip = function (event) {\n var svgElement = this.getElement(this.element.id + '_tooltip_svg');\n var isTooltip = svgElement && parseInt(svgElement.getAttribute('opacity'), 10) > 0;\n var tooltipDiv = this.getTooltipElement(isTooltip);\n this.renderSeriesTooltip(event, this.accumulation, !isTooltip, tooltipDiv);\n };\n AccumulationTooltip.prototype.renderSeriesTooltip = function (e, chart, isFirst, tooltipDiv) {\n var data = this.getPieData(e, chart, chart.mouseX, chart.mouseY);\n var rect = chart.initialClipRect;\n this.currentPoints = [];\n if (data.point && (!this.previousPoints[0] || (this.previousPoints[0].point !== data.point))) {\n if (this.pushData(data, isFirst, tooltipDiv, false)) {\n if (this.triggerEvent(data, isFirst, this.getTooltipText(data, chart.tooltip))) {\n this.createTooltip(chart, isFirst, this.findHeader(data), data.point.symbolLocation, data.series.clipRect, data.point, ['Circle'], 0, rect, null, data.point);\n }\n else {\n this.removeHighlight(this.control);\n remove(this.getElement(this.element.id + '_tooltip'));\n }\n this.isRemove = true;\n }\n }\n else {\n if (!data.point && this.isRemove) {\n this.removeTooltip(1000);\n this.isRemove = false;\n }\n }\n };\n AccumulationTooltip.prototype.getPieData = function (e, chart, x, y) {\n var target = e.target;\n var id = indexFinder(target.id, true);\n if (!isNaN(id.series)) {\n var seriesIndex = id.series;\n var pointIndex = id.point;\n if (!isNullOrUndefined(seriesIndex) && !isNaN(seriesIndex) && !isNullOrUndefined(pointIndex) && !isNaN(pointIndex)) {\n var series = this.getSeriesFromIndex(seriesIndex, chart.visibleSeries);\n if (series.enableTooltip) {\n return new AccPointData(series.points[pointIndex], series);\n }\n }\n }\n return new AccPointData(null, null);\n };\n /**\n * To get series from index\n */\n AccumulationTooltip.prototype.getSeriesFromIndex = function (index, visibleSeries) {\n return visibleSeries[0];\n };\n AccumulationTooltip.prototype.getTooltipText = function (data, tooltip) {\n var series = data.series;\n var format = tooltip.format ? tooltip.format : '${point.x} : ${point.y}';\n return this.parseTemplate(data.point, series, format);\n };\n AccumulationTooltip.prototype.findHeader = function (data) {\n if (this.header === '') {\n return '';\n }\n this.header = this.parseTemplate(data.point, data.series, this.header);\n if (this.header.replace(//g, '').replace(/<\\/b>/g, '').trim() !== '') {\n return this.header;\n }\n return '';\n };\n AccumulationTooltip.prototype.parseTemplate = function (point, series, format) {\n var value;\n var textValue;\n for (var _i = 0, _a = Object.keys(point); _i < _a.length; _i++) {\n var dataValue = _a[_i];\n value = new RegExp('${point' + '.' + dataValue + '}', 'gm');\n format = format.replace(value.source, point[dataValue]);\n }\n for (var _b = 0, _c = Object.keys(Object.getPrototypeOf(series)); _b < _c.length; _b++) {\n var dataValue = _c[_b];\n value = new RegExp('${series' + '.' + dataValue + '}', 'gm');\n textValue = series[dataValue];\n format = format.replace(value.source, textValue);\n }\n return format;\n };\n /**\n * Get module name\n */\n AccumulationTooltip.prototype.getModuleName = function () {\n return 'AccumulationTooltip';\n };\n /**\n * To destroy the Tooltip.\n * @return {void}\n * @private\n */\n AccumulationTooltip.prototype.destroy = function (chart) {\n /**\n * Destroy method calling here\n */\n };\n return AccumulationTooltip;\n}(BaseTooltip));\nexport { AccumulationTooltip };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * AccumulationChart Selection src file\n */\nimport { extend } from '@syncfusion/ej2-base';\nimport { indexFinder } from '../../common/utils/helper';\nimport { pointByIndex } from '../model/acc-base';\nimport { Index } from '../../common/model/base';\nimport { BaseSelection } from '../../common/user-interaction/selection';\n/**\n * `AccumulationSelection` module handles the selection for accumulation chart.\n */\nvar AccumulationSelection = /** @class */ (function (_super) {\n __extends(AccumulationSelection, _super);\n function AccumulationSelection(accumulation) {\n var _this = _super.call(this, accumulation) || this;\n _this.renderer = accumulation.renderer;\n return _this;\n }\n /**\n * To initialize the private variables\n */\n AccumulationSelection.prototype.initPrivateVariables = function (accumulation) {\n this.styleId = accumulation.element.id + '_ej2_chart_selection';\n this.unselected = accumulation.element.id + '_ej2_deselected';\n this.selectedDataIndexes = [];\n this.rectPoints = null;\n };\n /**\n * Invoke selection for rendered chart.\n * @param {AccumulationChart} chart - Define the chart to invoke the selection.\n * @return {void}\n */\n AccumulationSelection.prototype.invokeSelection = function (accumulation) {\n this.initPrivateVariables(accumulation);\n this.series = extend({}, accumulation.visibleSeries, null, true);\n this.seriesStyles();\n this.selectDataIndex(this.concatIndexes(accumulation.selectedDataIndexes, this.selectedDataIndexes), accumulation);\n };\n /**\n * To get series selection style by series.\n */\n AccumulationSelection.prototype.generateStyle = function (series) {\n return (series.selectionStyle || this.styleId + '_series_' + series.index);\n };\n /**\n * To get elements by index, series\n */\n AccumulationSelection.prototype.findElements = function (accumulation, series, index) {\n return [this.getElementByIndex(index)];\n };\n /**\n * To get series point element by index\n */\n AccumulationSelection.prototype.getElementByIndex = function (index) {\n var elementId = this.control.element.id + '_Series_' + index.series + '_Point_' + index.point;\n return document.getElementById(elementId);\n };\n /**\n * To calculate selected elements on mouse click or touch\n * @private\n */\n AccumulationSelection.prototype.calculateSelectedElements = function (accumulation, event) {\n if (event.target.id.indexOf(accumulation.element.id + '_') === -1) {\n return;\n }\n if (event.target.id.indexOf('_Series_') > -1 || event.target.id.indexOf('_datalabel_') > -1) {\n this.performSelection(indexFinder(event.target.id), accumulation, event.target);\n }\n };\n /**\n * To perform the selection process based on index and element.\n */\n AccumulationSelection.prototype.performSelection = function (index, accumulation, element) {\n element = element.id.indexOf('datalabel') > -1 ?\n accumulation.getSeriesElement().childNodes[index.series].childNodes[index.point]\n : element;\n switch (accumulation.selectionMode) {\n case 'Point':\n if (!isNaN(index.point)) {\n this.selection(accumulation, index, [element]);\n this.blurEffect(accumulation.element.id, accumulation.visibleSeries);\n }\n break;\n }\n };\n /**\n * To select the element by index. Adding or removing selection style class name.\n */\n AccumulationSelection.prototype.selection = function (accumulation, index, selectedElements) {\n if (!accumulation.isMultiSelect) {\n this.removeMultiSelectEelments(accumulation, this.selectedDataIndexes, index, accumulation.series);\n }\n var className = selectedElements[0] && (selectedElements[0].getAttribute('class') || '');\n if (selectedElements[0] && className.indexOf(this.getSelectionClass(selectedElements[0].id)) > -1) {\n this.removeStyles(selectedElements, index);\n this.addOrRemoveIndex(this.selectedDataIndexes, index);\n }\n else {\n this.applyStyles(selectedElements, index);\n this.addOrRemoveIndex(this.selectedDataIndexes, index, true);\n }\n };\n /**\n * To redraw the selection process on accumulation chart refresh.\n * @private\n */\n AccumulationSelection.prototype.redrawSelection = function (accumulation, oldMode) {\n var selectedDataIndexes = extend([], this.selectedDataIndexes, null, true);\n this.removeSelectedElements(accumulation, this.selectedDataIndexes);\n this.blurEffect(accumulation.element.id, accumulation.visibleSeries);\n this.selectDataIndex(selectedDataIndexes, accumulation);\n };\n /**\n * To remove the selected elements style classes by indexes.\n */\n AccumulationSelection.prototype.removeSelectedElements = function (accumulation, indexes) {\n var seriesgroup = accumulation.getSeriesElement();\n for (var _i = 0, indexes_1 = indexes; _i < indexes_1.length; _i++) {\n var index = indexes_1[_i];\n this.removeStyles([this.getElementByIndex(index)], index);\n }\n };\n /**\n * To perform the selection for legend elements.\n * @private\n */\n AccumulationSelection.prototype.legendSelection = function (accumulation, series, pointIndex) {\n var element = accumulation.getSeriesElement().childNodes[series].childNodes[pointIndex];\n var seriesStyle = this.generateStyle(accumulation.visibleSeries[series]);\n var seriesElements = accumulation.getSeriesElement().childNodes[series].childNodes[pointIndex];\n this.selection(accumulation, new Index(series, pointIndex), [seriesElements]);\n this.blurEffect(accumulation.element.id, accumulation.visibleSeries);\n };\n /**\n * To select the element by selected data indexes.\n */\n AccumulationSelection.prototype.selectDataIndex = function (indexes, accumulation) {\n var element;\n for (var _i = 0, indexes_2 = indexes; _i < indexes_2.length; _i++) {\n var index = indexes_2[_i];\n element = this.getElementByIndex(index);\n if (element) {\n this.performSelection(index, accumulation, element);\n }\n }\n };\n /**\n * To remove the selection styles for multi selection process.\n */\n AccumulationSelection.prototype.removeMultiSelectEelments = function (accumulation, index, currentIndex, seriesCollection) {\n var series;\n for (var i = 0; i < index.length; i++) {\n series = seriesCollection[index[i].series];\n if (!this.checkEquals(index[i], currentIndex)) {\n this.removeStyles(this.findElements(accumulation, series, index[i]), index[i]);\n index.splice(i, 1);\n i--;\n }\n }\n };\n /**\n * To apply the opacity effect for accumulation chart series elements.\n */\n AccumulationSelection.prototype.blurEffect = function (pieId, visibleSeries) {\n var visibility = this.checkPointVisibility(this.selectedDataIndexes); // legend click scenario\n for (var _i = 0, visibleSeries_1 = visibleSeries; _i < visibleSeries_1.length; _i++) {\n var series = visibleSeries_1[_i];\n if (series.visible) {\n this.checkSelectionElements(document.getElementById(pieId + '_SeriesCollection'), this.generateStyle(series), visibility);\n }\n }\n };\n /**\n * To check selection elements by style class name.\n */\n AccumulationSelection.prototype.checkSelectionElements = function (element, className, visibility) {\n var children = element.childNodes[0].childNodes;\n var legendShape;\n var elementClass;\n var parentClass;\n for (var i = 0; i < children.length; i++) {\n elementClass = children[i].getAttribute('class') || '';\n parentClass = children[i].parentNode.getAttribute('class') || '';\n if (elementClass.indexOf(className) === -1 && parentClass.indexOf(className) === -1 && visibility) {\n this.addSvgClass(children[i], this.unselected);\n }\n else {\n this.removeSvgClass(children[i], this.unselected);\n }\n if (this.control.accumulationLegendModule && this.control.legendSettings.visible) {\n legendShape = document.getElementById(this.control.element.id + '_chart_legend_shape_' + i);\n if (legendShape) {\n if (elementClass.indexOf(className) === -1 && parentClass.indexOf(className) === -1 && visibility) {\n this.addSvgClass(legendShape, this.unselected);\n }\n else {\n this.removeSvgClass(legendShape, this.unselected);\n }\n }\n }\n }\n };\n /**\n * To apply selection style for elements.\n */\n AccumulationSelection.prototype.applyStyles = function (elements, index) {\n for (var _i = 0, elements_1 = elements; _i < elements_1.length; _i++) {\n var element = elements_1[_i];\n var legendShape = void 0;\n if (element) {\n if (this.control.accumulationLegendModule && this.control.legendSettings.visible) {\n legendShape = document.getElementById(this.control.element.id + '_chart_legend_shape_' + index.point);\n this.removeSvgClass(legendShape, this.unselected);\n this.addSvgClass(legendShape, this.getSelectionClass(legendShape.id));\n }\n this.removeSvgClass(element.parentNode, this.unselected);\n this.removeSvgClass(element, this.unselected);\n this.addSvgClass(element, this.getSelectionClass(element.id));\n }\n }\n };\n /**\n * To get selection style class name by id\n */\n AccumulationSelection.prototype.getSelectionClass = function (id) {\n return this.generateStyle(this.control.series[indexFinder(id).series]);\n };\n /**\n * To remove selection style for elements.\n */\n AccumulationSelection.prototype.removeStyles = function (elements, index) {\n var legendShape;\n for (var _i = 0, elements_2 = elements; _i < elements_2.length; _i++) {\n var element = elements_2[_i];\n if (element) {\n if (this.control.accumulationLegendModule && this.control.legendSettings.visible) {\n legendShape = document.getElementById(this.control.element.id + '_chart_legend_shape_' + index.point);\n this.removeSvgClass(legendShape, this.getSelectionClass(legendShape.id));\n }\n this.removeSvgClass(element, this.getSelectionClass(element.id));\n }\n }\n };\n /**\n * To apply or remove selected elements index.\n */\n AccumulationSelection.prototype.addOrRemoveIndex = function (indexes, index, add) {\n for (var i = 0; i < indexes.length; i++) {\n if (this.checkEquals(indexes[i], index)) {\n indexes.splice(i, 1);\n i--;\n }\n }\n if (add) {\n indexes.push(index);\n }\n };\n /**\n * To check two index, point and series are equal\n */\n AccumulationSelection.prototype.checkEquals = function (first, second) {\n return ((first.point === second.point) && (first.series === second.series));\n };\n /**\n * To check selected points are visibility\n */\n AccumulationSelection.prototype.checkPointVisibility = function (selectedDataIndexes) {\n var visible = false;\n for (var _i = 0, selectedDataIndexes_1 = selectedDataIndexes; _i < selectedDataIndexes_1.length; _i++) {\n var data = selectedDataIndexes_1[_i];\n if (pointByIndex(data.point, this.control.visibleSeries[0].points).visible) {\n visible = true;\n break;\n }\n }\n return visible;\n };\n /**\n * Get module name.\n */\n AccumulationSelection.prototype.getModuleName = function () {\n return 'AccumulationSelection';\n };\n /**\n * To destroy the selection.\n * @return {void}\n * @private\n */\n AccumulationSelection.prototype.destroy = function (accumulation) {\n // Destroy method performed here\n };\n return AccumulationSelection;\n}(BaseSelection));\nexport { AccumulationSelection };\n","/**\n * AccumulationChart annotation properties\n */\nvar __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { AnnotationBase } from '../../common/annotation/annotation';\nimport { appendElement, redrawElement } from '../../common/utils/helper';\nimport { createElement } from '@syncfusion/ej2-base';\n/**\n * `AccumulationAnnotation` module handles the annotation for accumulation chart.\n */\nvar AccumulationAnnotation = /** @class */ (function (_super) {\n __extends(AccumulationAnnotation, _super);\n /**\n * Constructor for accumulation chart annotation.\n * @private.\n */\n function AccumulationAnnotation(control) {\n var _this = _super.call(this, control) || this;\n _this.pie = control;\n return _this;\n }\n /**\n * Method to render the annotation for accumulation chart\n * @param element\n */\n AccumulationAnnotation.prototype.renderAnnotations = function (element) {\n var _this = this;\n this.annotations = this.pie.annotations;\n var redraw = this.pie.redraw;\n this.parentElement = (redrawElement(redraw, this.pie.element.id + '_Annotation_Collections') ||\n createElement('div', {\n id: this.pie.element.id + '_Annotation_Collections'\n }));\n this.annotations.map(function (annotation, index) {\n _this.processAnnotation(annotation, index, _this.parentElement);\n });\n appendElement(this.parentElement, element, redraw);\n };\n /**\n * Get module name.\n */\n AccumulationAnnotation.prototype.getModuleName = function () {\n // Returns te module name\n return 'Annotation';\n };\n /**\n * To destroy the annotation.\n * @return {void}\n * @private\n */\n AccumulationAnnotation.prototype.destroy = function (control) {\n // Destroy method performed here\n };\n return AccumulationAnnotation;\n}(AnnotationBase));\nexport { AccumulationAnnotation };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { firstToLowerCase, RectOption } from '../../chart/index';\nimport { DataManager, DataUtil } from '@syncfusion/ej2-data';\nimport { DataPoint } from '../utils/helper';\nimport { getValue, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { getSeriesColor } from '../../common/model/theme';\nimport { NiceInterval } from '../../chart/index';\nimport { PathOption, Rect, measureText, Size } from '@syncfusion/ej2-svg-base';\nimport { Data } from '../../common/model/data';\n/**\n * To render Chart series\n */\nvar RangeSeries = /** @class */ (function (_super) {\n __extends(RangeSeries, _super);\n function RangeSeries(range) {\n var _this = _super.call(this) || this;\n _this.dataSource = range.dataSource;\n _this.xName = range.xName;\n _this.yName = range.yName;\n _this.query = range.query;\n _this.xMin = Infinity;\n _this.xMax = -Infinity;\n _this.yMin = Infinity;\n _this.yMax = -Infinity;\n return _this;\n }\n /**\n * To render light weight and data manager process\n * @param control\n */\n RangeSeries.prototype.renderChart = function (control) {\n var _this = this;\n var dataSource;\n var query;\n this.seriesLength = 0;\n control.rangeSlider.points = [];\n if (control.series.length) {\n control.series.map(function (series) {\n dataSource = series.dataSource || control.dataSource;\n query = series.query || control.query;\n series.points = [];\n _this.processDataSource(dataSource, query, control, series);\n });\n }\n else {\n this.processDataSource(control.dataSource, control.query, control);\n }\n };\n RangeSeries.prototype.processDataSource = function (dataSource, query, control, series) {\n var _this = this;\n if (!(dataSource instanceof DataManager) && !isNullOrUndefined(dataSource) && isNullOrUndefined(query)) {\n this.dataManagerSuccess({ result: dataSource, count: dataSource.length }, control, series);\n return;\n }\n control.dataModule = new Data(dataSource, query);\n var dataManager = control.dataModule.getData(control.dataModule.generateQuery().requiresCount());\n dataManager.then(function (e) { return _this.dataManagerSuccess(e, control, series); });\n };\n /**\n * data manager process calculated here\n * @param e\n */\n RangeSeries.prototype.dataManagerSuccess = function (e, control, series) {\n var viewData = e.result !== '' ? e.result : [];\n this.processJsonData(viewData, control, Object.keys(viewData).length, series);\n this.seriesLength += series ? 1 : this.seriesLength;\n if (!series || this.seriesLength === control.series.length) {\n this.processXAxis(control);\n this.calculateGroupingBounds(control);\n this.processYAxis(control);\n control.renderChart();\n }\n };\n /**\n * Process JSON data from data source\n * @param control\n * @param len\n */\n RangeSeries.prototype.processJsonData = function (viewData, control, len, series) {\n var i = 0;\n var point;\n var xName = (series && series.xName) || control.xName;\n var yName = (series && series.yName) || control.yName;\n while (i < len) {\n point = new DataPoint(getValue(xName, viewData[i]), getValue(yName, viewData[i]));\n point.yValue = +point.y;\n if (control.valueType === 'DateTime') {\n var dateParser = control.intl.getDateParser({ skeleton: 'full', type: 'dateTime' });\n var dateFormatter = control.intl.getDateFormat({ skeleton: 'full', type: 'dateTime' });\n point.x = new Date(DataUtil.parse.parseJson({ val: point.x }).val);\n point.xValue = Date.parse(dateParser(dateFormatter(point.x)));\n }\n else {\n point.xValue = +point.x;\n }\n if (series) {\n series.points.push(point);\n }\n this.xMin = Math.min(this.xMin, point.xValue);\n this.yMin = Math.min(this.yMin, point.yValue);\n this.xMax = Math.max(this.xMax, point.xValue);\n this.yMax = Math.max(this.yMax, point.yValue);\n control.rangeSlider.points.push(point);\n i++;\n }\n };\n RangeSeries.prototype.processXAxis = function (control) {\n var axisModule;\n var axis = {\n minimum: control.minimum, maximum: control.maximum,\n interval: control.interval, valueType: control.valueType,\n isInversed: control.enableRtl, labelFormat: control.labelFormat,\n logBase: control.logBase, skeleton: control.skeleton, skeletonType: control.skeletonType\n };\n this.xAxis = axis;\n this.xAxis.intervalType = control.intervalType;\n this.xAxis.maximumLabels = 3;\n this.xAxis.skeleton = control.skeleton;\n this.xAxis.intervalDivs = [10, 5, 2, 1];\n this.xAxis.rect = control.bounds;\n this.xAxis.visibleLabels = [];\n this.xAxis.orientation = 'Horizontal';\n axisModule = control[firstToLowerCase(control.valueType) + 'Module'];\n axisModule.min = this.xMin;\n axisModule.max = this.xMax;\n axisModule.getActualRange(this.xAxis, control.bounds);\n if (this.xAxis.valueType !== 'Logarithmic') {\n axisModule.updateActualRange(this.xAxis, this.xAxis.actualRange.min, this.xAxis.actualRange.max, this.xAxis.actualRange.interval);\n }\n this.xAxis.actualRange.delta = this.xAxis.actualRange.max - this.xAxis.actualRange.min;\n this.xAxis.visibleRange = this.xAxis.actualRange;\n axisModule.calculateVisibleLabels(this.xAxis, control);\n };\n /**\n * Process yAxis for range navigator\n * @param control\n */\n RangeSeries.prototype.processYAxis = function (control) {\n var axis = {\n majorGridLines: { width: 0 }, rangePadding: 'None',\n majorTickLines: { width: 0 }, labelStyle: { size: '0' },\n visible: false, valueType: 'Double', minimum: null, maximum: null,\n interval: null\n };\n this.yAxis = axis;\n this.yAxis.rect = control.bounds;\n this.yAxis.maximumLabels = 3;\n this.yAxis.intervalDivs = [10, 5, 2, 1];\n this.yAxis.orientation = 'Vertical';\n control.doubleModule.min = this.yMin;\n control.doubleModule.max = this.yMax;\n control.doubleModule.getActualRange(this.yAxis, control.bounds);\n control.doubleModule.updateActualRange(this.yAxis, this.yAxis.actualRange.min, this.yAxis.actualRange.max, this.yAxis.actualRange.interval);\n this.yAxis.actualRange.delta = this.yAxis.actualRange.max - this.yAxis.actualRange.min;\n this.yAxis.visibleRange = this.yAxis.actualRange;\n };\n /**\n * Process Light weight control\n * @param control\n * @private\n */\n RangeSeries.prototype.renderSeries = function (control) {\n var _this = this;\n this.chartGroup = control.renderer.createGroup({ id: control.element.id + '_chart' });\n var colors = getSeriesColor(control.theme);\n control.series.map(function (series, index) {\n series.xAxis = _this.xAxis;\n series.yAxis = _this.yAxis;\n series.chart = control;\n series.index = index;\n series.xAxis.isInversed = control.enableRtl;\n series.interior = series.fill || colors[index % colors.length];\n _this.createSeriesElement(control, series, index);\n if (control[firstToLowerCase(series.type) + 'SeriesModule']) {\n control[firstToLowerCase(series.type) + 'SeriesModule'].render(series, _this.xAxis, _this.yAxis, false);\n }\n else {\n control['line' + 'SeriesModule'].render(series, _this.xAxis, _this.yAxis, false);\n }\n _this.chartGroup.appendChild(series.seriesElement);\n if (series.animation.enable && control.animateSeries) {\n if (control[firstToLowerCase(series.type) + 'SeriesModule']) {\n control[firstToLowerCase(series.type) + 'SeriesModule'].doAnimation(series);\n }\n else {\n //control['line' + 'SeriesModule'].doAnimation(series);\n }\n }\n });\n };\n /**\n * Append series elements in element\n */\n RangeSeries.prototype.appendSeriesElements = function (control) {\n control.svgObject.appendChild(this.chartGroup);\n if (control.series.length) {\n this.drawSeriesBorder(control, this.chartGroup);\n }\n };\n RangeSeries.prototype.createSeriesElement = function (control, series, index) {\n var elementId = control.element.id;\n series.clipRect = new Rect(this.xAxis.rect.x, this.yAxis.rect.y, this.xAxis.rect.width, this.yAxis.rect.height);\n series.clipRectElement = control.renderer.drawClipPath(new RectOption(elementId + '_RangeSeriesClipRect_' + index, 'transparent', { width: 1, color: 'Gray' }, 1, {\n x: 0, y: 0,\n width: series.clipRect.width,\n height: series.clipRect.height\n }));\n series.seriesElement = control.renderer.createGroup({\n 'id': elementId + 'SeriesGroup' + index,\n 'transform': 'translate(' + series.clipRect.x + ',' + (series.clipRect.y) + ')',\n 'clip-path': 'url(#' + elementId + '_RangeSeriesClipRect_' + index + ')'\n });\n series.seriesElement.appendChild(series.clipRectElement);\n };\n RangeSeries.prototype.calculateGroupingBounds = function (control) {\n var padding = control.margin.bottom;\n var labelHeight = measureText('string', control.labelStyle).height;\n this.calculateDateTimeNiceInterval(this.xAxis, new Size(control.bounds.width, control.bounds.height), this.xMin, this.xMax, false);\n if (control.enableGrouping && control.valueType === 'DateTime'\n && (this.xAxis.actualIntervalType !== 'Years' || !control.series.length)) {\n control.bounds.height -= (control.labelPosition === 'Outside' || control.series.length === 0) ? padding + labelHeight :\n (labelHeight + 2 * padding);\n }\n if (!control.series.length) {\n control.bounds.y += control.bounds.height / 4;\n control.bounds.height = control.bounds.height / 2;\n }\n };\n RangeSeries.prototype.drawSeriesBorder = function (control, chartElement) {\n var start = control.stockChart ? 'M' : 'L';\n var close = control.stockChart ? '' : 'Z';\n var options = new PathOption(control.element.id + '_SeriesBorder', 'transparent', control.navigatorBorder.width, control.navigatorBorder.color, 1, '', ('M ' + (control.bounds.x) + ' ' + (control.bounds.y) +\n ' L ' + (control.bounds.x + control.bounds.width) + ' ' + control.bounds.y +\n start + (control.bounds.x + control.bounds.width) + ' ' + (control.bounds.y + control.bounds.height) +\n ' L ' + (control.bounds.x) + ' ' + (control.bounds.y + control.bounds.height) + close));\n var htmlObject = control.renderer.drawPath(options);\n control.svgObject.appendChild(htmlObject);\n };\n return RangeSeries;\n}(NiceInterval));\nexport { RangeSeries };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { valueToCoefficient, textElement, firstToLowerCase } from '../../common/utils/helper';\nimport { PathOption, Rect, measureText, TextOption } from '@syncfusion/ej2-svg-base';\nimport { DateTime } from '../../chart/index';\nimport { VisibleLabels } from '../../chart/index';\n/**\n * class for axis\n */\nvar RangeNavigatorAxis = /** @class */ (function (_super) {\n __extends(RangeNavigatorAxis, _super);\n function RangeNavigatorAxis(range) {\n var _this = _super.call(this) || this;\n _this.firstLevelLabels = [];\n _this.secondLevelLabels = [];\n _this.rangeNavigator = range;\n return _this;\n }\n /**\n * To render grid lines of axis\n */\n RangeNavigatorAxis.prototype.renderGridLines = function () {\n var pointX = 0;\n var control = this.rangeNavigator;\n var majorGridLines = control.majorGridLines;\n var majorTickLines = control.majorTickLines;\n var majorGrid = '';\n var majorTick = '';\n var rect = control.bounds;\n var chartAxis = control.chartSeries.xAxis;\n var labelLength;\n var range = chartAxis.visibleRange;\n var disabledColor = (control.disableRangeSelector) ? 'transparent' : null;\n this.gridLines = control.renderer.createGroup({ id: control.element.id + '_GridLines' });\n var tick = (control.tickPosition === 'Outside' || control.series.length === 0) ?\n rect.y + rect.height + majorTickLines.height : rect.y + rect.height - majorTickLines.height;\n //Gridlines\n this.firstLevelLabels = [];\n chartAxis.labelStyle = control.labelStyle;\n chartAxis.skeleton = control.skeleton;\n chartAxis.skeletonType = control.skeletonType;\n chartAxis.isChart = false;\n if (control.valueType === 'DateTime') {\n this.calculateDateTimeNiceInterval(chartAxis, rect, chartAxis.doubleRange.start, chartAxis.doubleRange.end, chartAxis.isChart);\n this.actualIntervalType = chartAxis.actualIntervalType;\n this.findAxisLabels(chartAxis);\n }\n this.firstLevelLabels = chartAxis.visibleLabels;\n this.lowerValues = [];\n labelLength = chartAxis.visibleLabels.length;\n for (var i = 0; i < labelLength; i++) {\n this.lowerValues.push(this.firstLevelLabels[i].value);\n pointX = (valueToCoefficient(this.firstLevelLabels[i].value, chartAxis) * rect.width) + rect.x;\n if (pointX >= rect.x && (rect.x + rect.width) >= pointX) {\n majorGrid = majorGrid.concat('M ' + pointX + ' ' + (control.bounds.y + control.bounds.height) +\n ' L ' + pointX + ' ' + control.bounds.y + ' ');\n majorTick = majorTick.concat('M ' + (pointX) + ' ' + (rect.y + rect.height) +\n ' L ' + (pointX) + ' ' + tick + ' ');\n }\n }\n var options = new PathOption(control.element.id + '_MajorGridLine', 'transparent', majorGridLines.width, control.series.length ? disabledColor || majorGridLines.color || control.themeStyle.gridLineColor : 'transparent', 1, majorGridLines.dashArray, majorGrid);\n this.gridLines.appendChild(control.renderer.drawPath(options));\n options = new PathOption(control.element.id + '_MajorTickLine', 'transparent', majorTickLines.width, disabledColor || majorTickLines.color || control.themeStyle.gridLineColor, 1, majorGridLines.dashArray, majorTick);\n this.gridLines.appendChild(control.renderer.drawPath(options));\n };\n /**\n * To render of axis labels\n */\n RangeNavigatorAxis.prototype.renderAxisLabels = function () {\n var axis = this.rangeNavigator.chartSeries.xAxis;\n var control = this.rangeNavigator;\n var pointY;\n var rect = control.bounds;\n var labelElement = control.renderer.createGroup({ id: control.element.id + '_AxisLabels' });\n var firstLevelElement = control.renderer.createGroup({ id: control.element.id + '_FirstLevelAxisLabels' });\n var secondLevelElement = control.renderer.createGroup({ id: control.element.id + '_SecondLevelAxisLabels' });\n var secondaryAxis = axis;\n pointY = this.findLabelY(control, false);\n this.placeAxisLabels(axis, pointY, '_AxisLabel_', control, firstLevelElement);\n secondaryAxis.intervalType = secondaryAxis.actualIntervalType = (control.groupBy ||\n this.getSecondaryLabelType(axis.actualIntervalType));\n if (control.enableGrouping && control.valueType === 'DateTime' && this.actualIntervalType !== 'Years') {\n secondaryAxis.visibleRange.interval = 1;\n secondaryAxis.visibleLabels = [];\n this.findAxisLabels(secondaryAxis);\n this.secondLevelLabels = secondaryAxis.visibleLabels;\n pointY = this.findLabelY(control, true);\n var border = this.placeAxisLabels(secondaryAxis, pointY, '_SecondaryLabel_', control, secondLevelElement);\n var path = new PathOption(control.element.id + '_SecondaryMajorLines', 'transparent', control.majorTickLines.width, control.majorTickLines.color || control.themeStyle.gridLineColor, 1, control.majorGridLines.dashArray, border);\n this.gridLines.appendChild(control.renderer.drawPath(path));\n }\n control.chartSeries.xAxis.visibleLabels = control.chartSeries.xAxis.visibleLabels.concat(secondaryAxis.visibleLabels);\n labelElement.appendChild(firstLevelElement);\n labelElement.appendChild(secondLevelElement);\n //gridlines and axis label append to element\n control.svgObject.appendChild(this.gridLines);\n control.svgObject.appendChild(labelElement);\n };\n /**\n * To find secondary level label type\n * @param type\n */\n RangeNavigatorAxis.prototype.getSecondaryLabelType = function (type) {\n var types = ['Years', 'Quarter', 'Months', 'Weeks', 'Days', 'Hours', 'Minutes', 'Seconds'];\n return (type === 'Years' ? 'Years' : types[types.indexOf(type) - 1]);\n };\n /**\n * To find labels for date time axis\n * @param axis\n */\n RangeNavigatorAxis.prototype.findAxisLabels = function (axis) {\n axis.visibleLabels = [];\n var start = new Date(axis.visibleRange.min);\n var nextInterval;\n var text;\n var interval = this.rangeNavigator.interval ? this.rangeNavigator.interval : 1;\n switch (axis.actualIntervalType) {\n case 'Years':\n start = new Date(start.getFullYear().toString());\n break;\n case 'Quarter':\n if (start.getMonth() <= 2) {\n start = new Date(start.getFullYear(), 0, 1);\n }\n else if (start.getMonth() <= 5) {\n start = new Date(start.getFullYear(), 3, 1);\n }\n else if (start.getMonth() <= 8) {\n start = new Date(start.getFullYear(), 6, 1);\n }\n else {\n start = new Date(start.getFullYear(), 9, 1);\n }\n break;\n case 'Months':\n start = new Date(start.getFullYear(), start.getMonth());\n break;\n case 'Weeks':\n start = new Date(start.getFullYear(), start.getMonth(), start.getDate() - start.getDay());\n break;\n case 'Days':\n start = new Date(start.getFullYear(), start.getMonth(), start.getDate());\n break;\n case 'Hours':\n start = new Date(start.getFullYear(), start.getMonth(), start.getDate(), start.getHours());\n break;\n case 'Minutes':\n start = new Date(start.getFullYear(), start.getMonth(), start.getDate(), start.getHours(), start.getMinutes());\n break;\n case 'Seconds':\n start = new Date(start.getFullYear(), start.getMonth(), start.getDate(), start.getHours(), start.getMinutes(), start.getSeconds());\n break;\n }\n nextInterval = start.getTime();\n this.rangeNavigator.format = this.rangeNavigator.intl.getDateFormat({\n format: axis.labelFormat, type: firstToLowerCase(axis.skeletonType), skeleton: this.getSkeleton(axis, null, null)\n });\n while (nextInterval < axis.visibleRange.max) {\n text = this.dateFormats(this.rangeNavigator.format(new Date(nextInterval)), axis, axis.visibleLabels.length);\n axis.visibleLabels.push(new VisibleLabels(text, nextInterval, this.rangeNavigator.labelStyle, text));\n nextInterval = this.increaseDateTimeInterval(axis, nextInterval, interval).getTime();\n }\n };\n /**\n * To find date time formats for Quarter and week interval type\n * @param text\n * @param axis\n * @param index\n */\n RangeNavigatorAxis.prototype.dateFormats = function (text, axis, index) {\n var changedText = text;\n var isFirstLevel = this.rangeNavigator.enableGrouping && this.firstLevelLabels.length === 0;\n switch (axis.actualIntervalType) {\n case 'Quarter':\n if (text.indexOf('Jan') > -1) {\n changedText = !isFirstLevel ? text.replace('Jan', 'Quarter1') : 'Quarter1';\n }\n else if (text.indexOf('Apr') > -1) {\n changedText = !isFirstLevel ? text.replace('Apr', 'Quarter2') : 'Quarter2';\n }\n else if (text.indexOf('Jul') > -1) {\n changedText = !isFirstLevel ? text.replace('Jul', 'Quarter3') : 'Quarter3';\n }\n else if (text.indexOf('Oct') > -1) {\n changedText = !isFirstLevel ? text.replace('Oct', 'Quarter4') : 'Quarter4';\n }\n break;\n case 'Weeks':\n changedText = 'Week' + ++index;\n break;\n default:\n changedText = text;\n break;\n }\n return changedText;\n };\n /**\n * To find the y co-ordinate for axis labels\n * @param control - rangeNavigator\n * @param isSecondary sets true if the axis is secondary axis\n */\n RangeNavigatorAxis.prototype.findLabelY = function (control, isSecondary) {\n var pointY;\n var reference = control.bounds.y + control.bounds.height;\n var tickHeight = control.majorTickLines.height;\n var textHeight = measureText('Quarter1 2011', control.labelStyle).height;\n var padding = 8;\n if ((control.labelPosition === 'Outside' && control.tickPosition === 'Outside') || control.series.length === 0) {\n pointY = reference + tickHeight + padding + textHeight * 0.75;\n }\n else if (control.labelPosition === 'Inside' && control.tickPosition === 'Inside') {\n pointY = reference - tickHeight - padding;\n }\n else if (control.labelPosition === 'Inside' && control.tickPosition === 'Outside') {\n pointY = reference - padding;\n }\n else {\n pointY = reference + padding + (textHeight * 0.75);\n }\n if (isSecondary) {\n padding = 15;\n if (control.labelPosition === 'Outside' || control.series.length === 0) {\n pointY += padding + textHeight * 0.75;\n }\n else {\n pointY = (control.tickPosition === 'Outside' || control.series.length === 0) ?\n reference + tickHeight + padding + textHeight * 0.75 : reference + padding + textHeight * 0.75;\n }\n }\n return pointY;\n };\n /**\n * It places the axis labels and returns border for secondary axis labels\n * @param axis axis for the lables placed\n * @param pointY y co-ordinate for axis labels\n * @param id id for the axis elements\n * @param control range navigator\n * @param labelElement parent element in which axis labels appended\n */\n RangeNavigatorAxis.prototype.placeAxisLabels = function (axis, pointY, id, control, labelElement) {\n var maxLabels = axis.visibleLabels.length;\n var label;\n var prevLabel;\n var pointX;\n var rect = control.bounds;\n var border = '';\n var pointXGrid;\n var disabledColor = (control.disableRangeSelector) ? 'transparent' : null;\n var prevX = control.enableRtl ? (rect.x + rect.width) : rect.x;\n var intervalType = axis.actualIntervalType;\n var intervalInTime = control.valueType === 'DateTime' ?\n maxLabels > 1 ? (axis.visibleLabels[1].value - axis.visibleLabels[0].value) :\n (axis.visibleRange.max - axis.visibleLabels[0].value) / 2 : 0;\n if (control.valueType === 'DateTime' && (intervalType === 'Quarter' || intervalType === 'Weeks')) {\n this.findSuitableFormat(axis, control);\n }\n for (var i = 0, len = maxLabels; i < len; i++) {\n label = axis.visibleLabels[i];\n label.size = measureText(label.text, axis.labelStyle);\n if (control.secondaryLabelAlignment === 'Middle') {\n pointX = (valueToCoefficient((label.value + intervalInTime / 2), axis) * rect.width) + rect.x;\n }\n else if ((id.indexOf('Secondary') > -1)) {\n pointX = this.findAlignment(axis, i);\n }\n pointXGrid = (valueToCoefficient((label.value), axis) * rect.width) + rect.x;\n //edgelabelPlacements\n if ((i === 0 || (i === axis.visibleLabels.length - 1 && control.enableRtl)) && pointX < rect.x) {\n pointX = rect.x + label.size.width / 2;\n }\n if ((i === axis.visibleLabels.length - 1 || (i === 0 && control.enableRtl)) &&\n ((pointX + label.size.width) > (rect.x + rect.width))) {\n pointX = rect.x + rect.width - label.size.width / 2;\n }\n //secondary axis grid lines\n if (id.indexOf('_SecondaryLabel_') > -1) {\n if (pointX >= rect.x && (rect.x + rect.width) >= pointX) {\n border = border.concat('M ' + pointXGrid + ' ' + pointY +\n ' L ' + pointXGrid + ' ' + (pointY - label.size.height));\n }\n }\n //smart axis label position,\n if (control.labelIntersectAction === 'Hide' &&\n i !== 0 && this.isIntersect(axis, pointX, label.size.width, prevX, prevLabel.size.width)) {\n continue;\n }\n //labelrender event\n var argsData = void 0;\n var labelStyle = control.labelStyle;\n var style = {\n size: labelStyle.size, color: disabledColor || labelStyle.color || control.themeStyle.labelFontColor,\n fontFamily: labelStyle.fontFamily,\n fontStyle: labelStyle.fontStyle || control.labelStyle.fontStyle,\n fontWeight: labelStyle.fontWeight || control.labelStyle.fontWeight,\n opacity: labelStyle.opacity || control.labelStyle.opacity,\n textAlignment: labelStyle.textAlignment || control.labelStyle.textAlignment,\n textOverflow: labelStyle.textOverflow || control.labelStyle.textOverflow\n };\n argsData = {\n cancel: false, name: 'labelRender',\n text: label.text, value: label.value, labelStyle: style,\n region: new Rect(pointX, pointY, label.size.width, label.size.height)\n };\n control.trigger('labelRender', argsData);\n if (!argsData.cancel) {\n control.labels.push(argsData);\n }\n else {\n continue;\n }\n textElement(new TextOption(this.rangeNavigator.element.id + id + i, pointX, pointY, 'middle', argsData.text), argsData.labelStyle, argsData.labelStyle.color || control.themeStyle.labelFontColor, labelElement).setAttribute('style', axis.valueType === 'DateTime' ? 'cursor: pointer' : 'cursor: default');\n prevX = pointX;\n prevLabel = label;\n }\n return border;\n };\n /**\n * To check label is intersected with successive label or not\n */\n RangeNavigatorAxis.prototype.isIntersect = function (axis, currentX, currentWidth, prevX, prevWidth) {\n return (axis.isInversed) ? (currentX + currentWidth / 2 > prevX - prevWidth / 2) :\n (currentX - currentWidth / 2 < prevX + prevWidth / 2);\n };\n /**\n * To find suitable label format for Quarter and week Interval types\n * @param axis\n * @param control\n */\n RangeNavigatorAxis.prototype.findSuitableFormat = function (axis, control) {\n var labels = axis.visibleLabels;\n var labelLength = labels.length;\n var bounds = control.bounds;\n var prevX;\n var currentX;\n var interval = control.valueType === 'DateTime' ?\n labelLength > 1 ? (labels[1].value - labels[0].value) : axis.visibleRange.interval\n : 0;\n for (var i = 0; i < labelLength; i++) {\n currentX = (valueToCoefficient((labels[i].value + interval / 2), axis) * bounds.width) + bounds.x;\n labels[i].size = measureText(labels[i].text, axis.labelStyle);\n //edgelabelPlacements\n if (i === 0 && currentX < bounds.x) {\n currentX = bounds.x + labels[i].size.width / 2;\n }\n if (axis.actualIntervalType === 'Quarter') {\n if (i !== 0) {\n if ((labels[i].text.indexOf('Quarter') > -1) &&\n (this.isIntersect(axis, currentX, labels[i].size.width, prevX, labels[i - 1].size.width))) {\n labels.every(function (label) {\n label.text = label.text.toString().replace('Quarter', 'QTR');\n return true;\n });\n axis.visibleLabels = labels;\n this.findSuitableFormat(axis, control);\n }\n else {\n if (this.isIntersect(axis, currentX, labels[i].size.width, prevX, labels[i - 1].size.width)) {\n labels.every(function (label) {\n label.text = label.text.toString().replace('QTR', 'Q');\n return true;\n });\n axis.visibleLabels = labels;\n }\n }\n }\n }\n else if (axis.actualIntervalType === 'Weeks') {\n if ((i !== 0) && ((labels[i].text.indexOf('Week') > -1) &&\n (this.isIntersect(axis, currentX, labels[i].size.width, prevX, labels[i - 1].size.width)))) {\n labels.every(function (label) {\n label.text = label.text.toString().replace('Week', 'W');\n return true;\n });\n axis.visibleLabels = labels;\n }\n }\n prevX = currentX;\n }\n };\n /**\n * Alignment position for secondary level labels in date time axis\n * @param axis\n * @param index\n */\n RangeNavigatorAxis.prototype.findAlignment = function (axis, index) {\n var label = axis.visibleLabels[index];\n var nextLabel = axis.visibleLabels[index + 1];\n var bounds = this.rangeNavigator.bounds;\n return (this.rangeNavigator.secondaryLabelAlignment === 'Near' ?\n (valueToCoefficient((label.value), axis) * bounds.width) + bounds.x + label.size.width / 2 :\n (valueToCoefficient((nextLabel ? nextLabel.value : axis.visibleRange.max), axis) * bounds.width) + bounds.x - label.size.width);\n };\n return RangeNavigatorAxis;\n}(DateTime));\nexport { RangeNavigatorAxis };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { ChildProperty, Property, Complex } from '@syncfusion/ej2-base';\nimport { Border, Animation, Font } from '../../common/model/base';\nimport { Rect } from '@syncfusion/ej2-svg-base';\nimport { RangeNavigatorTheme } from '../utils/theme';\n/**\n * Series class for the range navigator\n */\nvar RangeNavigatorSeries = /** @class */ (function (_super) {\n __extends(RangeNavigatorSeries, _super);\n function RangeNavigatorSeries() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n /** @private */\n _this.clipRect = new Rect(0, 0, 0, 0);\n return _this;\n }\n __decorate([\n Property(null)\n ], RangeNavigatorSeries.prototype, \"dataSource\", void 0);\n __decorate([\n Property(null)\n ], RangeNavigatorSeries.prototype, \"xName\", void 0);\n __decorate([\n Property(null)\n ], RangeNavigatorSeries.prototype, \"yName\", void 0);\n __decorate([\n Property()\n ], RangeNavigatorSeries.prototype, \"query\", void 0);\n __decorate([\n Property('Line')\n ], RangeNavigatorSeries.prototype, \"type\", void 0);\n __decorate([\n Complex({ enable: false }, Animation)\n ], RangeNavigatorSeries.prototype, \"animation\", void 0);\n __decorate([\n Complex({ color: 'transparent', width: 2 }, Border)\n ], RangeNavigatorSeries.prototype, \"border\", void 0);\n __decorate([\n Property(null)\n ], RangeNavigatorSeries.prototype, \"fill\", void 0);\n __decorate([\n Property(1)\n ], RangeNavigatorSeries.prototype, \"width\", void 0);\n __decorate([\n Property(1)\n ], RangeNavigatorSeries.prototype, \"opacity\", void 0);\n __decorate([\n Property('0')\n ], RangeNavigatorSeries.prototype, \"dashArray\", void 0);\n return RangeNavigatorSeries;\n}(ChildProperty));\nexport { RangeNavigatorSeries };\n/**\n * Thumb settings\n */\nvar ThumbSettings = /** @class */ (function (_super) {\n __extends(ThumbSettings, _super);\n function ThumbSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], ThumbSettings.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], ThumbSettings.prototype, \"height\", void 0);\n __decorate([\n Complex({ width: 1, color: null }, Border)\n ], ThumbSettings.prototype, \"border\", void 0);\n __decorate([\n Property(null)\n ], ThumbSettings.prototype, \"fill\", void 0);\n __decorate([\n Property('Circle')\n ], ThumbSettings.prototype, \"type\", void 0);\n return ThumbSettings;\n}(ChildProperty));\nexport { ThumbSettings };\n/**\n * Style settings\n */\nvar StyleSettings = /** @class */ (function (_super) {\n __extends(StyleSettings, _super);\n function StyleSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Complex({}, ThumbSettings)\n ], StyleSettings.prototype, \"thumb\", void 0);\n __decorate([\n Property(null)\n ], StyleSettings.prototype, \"selectedRegionColor\", void 0);\n __decorate([\n Property(null)\n ], StyleSettings.prototype, \"unselectedRegionColor\", void 0);\n return StyleSettings;\n}(ChildProperty));\nexport { StyleSettings };\n/*\n * Configures the ToolTips in the chart.\n */\nvar RangeTooltipSettings = /** @class */ (function (_super) {\n __extends(RangeTooltipSettings, _super);\n function RangeTooltipSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], RangeTooltipSettings.prototype, \"enable\", void 0);\n __decorate([\n Property(0.85)\n ], RangeTooltipSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property(null)\n ], RangeTooltipSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(null)\n ], RangeTooltipSettings.prototype, \"format\", void 0);\n __decorate([\n Complex(RangeNavigatorTheme.tooltipLabelFont, Font)\n ], RangeTooltipSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property(null)\n ], RangeTooltipSettings.prototype, \"template\", void 0);\n __decorate([\n Complex({ color: '#cccccc', width: 0.5 }, Border)\n ], RangeTooltipSettings.prototype, \"border\", void 0);\n __decorate([\n Property('OnDemand')\n ], RangeTooltipSettings.prototype, \"displayMode\", void 0);\n return RangeTooltipSettings;\n}(ChildProperty));\nexport { RangeTooltipSettings };\n","import { Browser, createElement, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { RectOption } from '../../common/utils/helper';\nimport { getXLocation, getExactData, getRangeValueXByPoint, getNearestValue } from '../utils/helper';\nimport { drawSymbol, linear } from '../../chart/index';\nimport { PathOption } from '@syncfusion/ej2-svg-base';\nimport { Animation } from '@syncfusion/ej2-base';\n/**\n * Class for slider\n */\nvar RangeSlider = /** @class */ (function () {\n function RangeSlider(range) {\n this.control = range;\n this.points = [];\n this.isIOS = Browser.isIos || Browser.isIos7;\n var thumb = range.navigatorStyleSettings.thumb;\n this.thumbVisible = (range.themeStyle.thumbWidth !== 0 && range.themeStyle.thumbHeight !== 0);\n this.elementId = range.element.id;\n this.thumpPadding = range.themeStyle.thumbWidth / 2;\n this.addEventListener();\n this.thumbColor = range.disableRangeSelector ? 'transparent' :\n (thumb.fill || range.themeStyle.thumbBackground);\n }\n /**\n * Render Slider elements for range navigator\n * @param range\n */\n RangeSlider.prototype.render = function (range) {\n var renderer = range.renderer;\n var style = range.navigatorStyleSettings;\n var disabledColor = (range.disableRangeSelector) ? 'transparent' : null;\n var sliderGroup = renderer.createGroup({\n 'id': this.elementId + '_sliders',\n style: (range.disableRangeSelector) ? 'pointer-events:none;' : ''\n });\n var option = new RectOption(this.elementId + '_leftUnSelectedArea', disabledColor || style.unselectedRegionColor || range.themeStyle.unselectedRectColor, { width: 0 }, 1, {\n x: range.bounds.x, y: range.bounds.y,\n width: range.bounds.width / 3,\n height: range.bounds.height\n });\n this.leftUnSelectedElement = renderer.drawRectangle(option);\n option.id = this.elementId + '_rightUnSelectedArea';\n this.rightUnSelectedElement = renderer.drawRectangle(option);\n option.id = this.elementId + '_SelectedArea';\n option.fill = disabledColor || style.selectedRegionColor || range.themeStyle.selectedRegionColor;\n this.selectedElement = renderer.drawRectangle(option);\n this.selectedElement.setAttribute('style', 'cursor: -webkit-grab');\n this.leftSlider = renderer.createGroup({\n 'id': this.elementId + '_LeftSlider', 'style': 'cursor: ew-resize'\n });\n this.rightSlider = renderer.createGroup({\n 'id': this.elementId + '_RightSlider', 'style': 'cursor: ew-resize'\n });\n this.createThump(renderer, range.bounds, this.leftSlider, this.elementId + '_LeftSlider', sliderGroup);\n this.createThump(renderer, range.bounds, this.rightSlider, this.elementId + '_RightSlider');\n sliderGroup.appendChild(this.leftUnSelectedElement);\n sliderGroup.appendChild(this.rightUnSelectedElement);\n sliderGroup.appendChild(this.selectedElement);\n sliderGroup.appendChild(this.leftSlider);\n sliderGroup.appendChild(this.rightSlider);\n range.svgObject.appendChild(sliderGroup);\n };\n /**\n * Thumb creation performed\n * @param render\n * @param bounds\n * @param parent\n * @param id\n */\n RangeSlider.prototype.createThump = function (render, bounds, parent, id, sliderGroup) {\n var control = this.control;\n var thump = control.navigatorStyleSettings.thumb;\n var style = control.themeStyle;\n var y = bounds.y + bounds.height / 2;\n var x = this.thumpPadding;\n var tickLength = (control.themeStyle.thumbHeight / 2) - 5;\n var disabledColor = control.disableRangeSelector ? 'transparent' : null;\n var lineColor = disabledColor || thump.border.color || style.thumpLineColor;\n var shadowElement;\n parent.appendChild(render.drawPath(new PathOption(id + '_ThumpLine', 'transparent', thump.border.width, control.series.length ? lineColor : 'transparent', 1, null, 'M' + ' ' + (x) + ' ' + (bounds.y) + ' ' + 'L' + ' ' + (x) + ' ' + (bounds.y + bounds.height) + ' ')));\n this.thumpY = y - (control.themeStyle.thumbHeight / 2);\n this.sliderY = bounds.y > this.thumpY ? this.thumpY : bounds.y;\n if (sliderGroup && !control.disableRangeSelector) {\n shadowElement = render.createDefs();\n shadowElement.innerHTML = '' +\n '' +\n '' +\n '
';\n div = div + eLine;\n div = div + 'left:' + (data.parentWidth - (((data.parentLeft +\n data.parentWidth) - data.childLeft) + 20)) + 'px;width:10px;' +\n this.getBorderStyles('top', this.lineStroke) + 'position:relative;\">| ' +\n data.taskName + ' | ||
| Date | : | ' +\n '' +\n this.parent.getFormatedDate(data.startDate, this.parent.dateFormat) + ' |
| ' +\n data.taskName + ' | ||
| ' + this.parent.localeObj.getConstant('progress') +\n ' | : | ' + data.progress + ' |
| ' +\n data.taskName + ' | ||
| ' +\n this.parent.localeObj.getConstant('baselineStartDate') + ' | : | ' + '' +\n this.parent.getFormatedDate(data.baselineStartDate, this.parent.dateFormat) + ' |
| ' + this.parent.localeObj.getConstant('baselineEndDate') +\n ' | : | ' +\n this.parent.getFormatedDate(data.baselineEndDate, this.parent.dateFormat) + ' |
| ' +\n this.parent.getFormatedDate(this.parent.dateValidationModule.getDateFromFormat(markerTooltipElement.day), this.parent.dateFormat) +\n ' |
| ' +\n markerLabel + ' |
| ' +\n this.parent.localeObj.getConstant('from') + ' | : | ' +\n '' + parent.tooltipModule.predecessorTooltipData.fromName + ' (' +\n parent.tooltipModule.predecessorTooltipData.fromId + ')' + ' |
| ' +\n this.parent.localeObj.getConstant('to') + ' | : | ' + '' +\n parent.tooltipModule.predecessorTooltipData.toName +\n ' (' + parent.tooltipModule.predecessorTooltipData.toId + ')' +\n ' |
| ' + this.parent.localeObj.getConstant('taskLink') +\n ' | : | ' + parent.tooltipModule.predecessorTooltipData.linkText +\n ' |
| ' + this.parent.localeObj.getConstant('lag') +\n ' | : | ' +\n parent.tooltipModule.predecessorTooltipData.offsetString + ' |
' + this.parent.localeObj.getConstant('duration') + ' : ' +\n this.parent.getDurationString(editRecord.duration, editRecord.durationUnit);\n break;\n case 'RightResizing':\n tooltipString = this.parent.localeObj.getConstant('endDate') + ' : ';\n tooltipString += instance.formatDate(editRecord.endDate, { format: this.parent.dateFormat });\n tooltipString += '
' + this.parent.localeObj.getConstant('duration') + ' : ' +\n this.parent.getDurationString(editRecord.duration, editRecord.durationUnit);\n break;\n case 'ChildDrag':\n case 'ParentDrag':\n case 'MilestoneDrag':\n if (!isNullOrUndefined(this.taskbarEdit.taskBarEditRecord.ganttProperties.startDate)) {\n tooltipString = this.parent.localeObj.getConstant('startDate') + ' : ';\n tooltipString += instance.formatDate(editRecord.startDate, { format: this.parent.dateFormat });\n }\n if (!isNullOrUndefined(this.taskbarEdit.taskBarEditRecord.ganttProperties.endDate)) {\n tooltipString += tooltipString === '' ? '' : '
';\n tooltipString += this.parent.localeObj.getConstant('endDate') + ' : ' + instance.formatDate(editRecord.endDate, { format: this.parent.dateFormat });\n }\n break;\n case 'ConnectorPointLeftDrag':\n case 'ConnectorPointRightDrag':\n tooltipString = this.parent.connectorLineModule.tooltipTable;\n if (isNullOrUndefined(this.toolTipObj)) {\n this.parent.connectorLineModule.tooltipTable.innerHTML =\n this.parent.connectorLineModule.getConnectorLineTooltipInnerTd(this.parent.editModule.taskbarEditModule.taskBarEditRecord.ganttProperties.taskName, this.parent.editModule.taskbarEditModule.fromPredecessorText, '', '');\n }\n break;\n }\n }\n return tooltipString;\n };\n return EditTooltip;\n}());\nexport { EditTooltip };\n","import { isNullOrUndefined, createElement, extend, addClass, remove, removeClass, closest } from '@syncfusion/ej2-base';\nimport { parentsUntil } from '../base/utils';\nimport * as cls from '../base/css-constants';\nimport { EditTooltip } from '../renderer/edit-tooltip';\n/**\n * File for handling taskbar editing operation in Gantt.\n */\nvar TaskbarEdit = /** @class */ (function () {\n function TaskbarEdit(ganttObj) {\n this.isMouseDragged = false;\n this.parent = ganttObj;\n this.initPublicProp();\n this.wireEvents();\n this.editTooltip = new EditTooltip(this.parent, this);\n }\n TaskbarEdit.prototype.wireEvents = function () {\n this.parent.on('chartMouseDown', this.mouseDownHandler, this);\n this.parent.on('chartMouseUp', this.mouseUpHandler, this);\n this.parent.on('chartMouseLeave', this.mouseLeaveHandler, this);\n this.parent.on('chartMouseMove', this.mouseMoveAction, this);\n };\n /**\n * To initialize the public property.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.initPublicProp = function () {\n this.taskBarEditElement = null;\n this.taskBarEditRecord = null;\n this.taskBarEditAction = null;\n this.connectorSecondElement = null;\n this.connectorSecondRecord = null;\n this.connectorSecondAction = null;\n this.highlightedSecondElement = null;\n this.fromPredecessorText = null;\n this.toPredecessorText = null;\n this.finalPredecessor = null;\n this.drawPredecessor = false;\n this.roundOffDuration = true;\n this.dragMouseLeave = false;\n this.isMouseDragged = false;\n this.previousItemProperty = ['left', 'progress', 'duration', 'startDate', 'endDate', 'width', 'progressWidth'];\n };\n TaskbarEdit.prototype.mouseDownHandler = function (e) {\n if (this.parent.editSettings.allowTaskbarEditing) {\n this.updateTaskBarEditElement(e);\n }\n };\n TaskbarEdit.prototype.mouseLeaveHandler = function (e) {\n this.dragMouseLeave = true;\n };\n /**\n * To update taskbar edited elements on mouse down action.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.updateTaskBarEditElement = function (e) {\n var element = parentsUntil(e.target, cls.taskBarMainContainer);\n if (this.parent.editSettings.allowTaskbarEditing) {\n this.showHideTaskBarEditingElements(element, this.taskBarEditElement);\n }\n this.taskBarEditElement = element;\n this.taskBarEditRecord = isNullOrUndefined(this.taskBarEditElement) ?\n null : this.parent.ganttChartModule.getRecordByTaskBar(this.taskBarEditElement);\n if (element && (e.type === 'mousedown' || e.type === 'pointerdown')) {\n this.roundOffDuration = true;\n this.taskBarEditAction = this.getTaskBarAction(e);\n if ((this.taskBarEditAction === 'ConnectorPointLeftDrag' || this.taskBarEditAction === 'ConnectorPointRightDrag') &&\n isNullOrUndefined(this.parent.taskFields.dependency)) {\n this.taskBarEditAction = null;\n }\n else {\n this.updateMouseDownProperties(e);\n this.isMouseDragged = false;\n }\n }\n };\n /**\n * To show/hide taskbar editing elements.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.showHideTaskBarEditingElements = function (element, secondElement, fadeConnectorLine) {\n if (element) {\n if (element.querySelector('.' + cls.taskBarLeftResizer)) {\n addClass([element.querySelector('.' + cls.taskBarLeftResizer)], [cls.leftResizeGripper]);\n addClass([element.querySelector('.' + cls.taskBarRightResizer)], [cls.rightResizeGripper]);\n addClass([element.querySelector('.' + cls.childProgressResizer)], [cls.progressResizeGripper]);\n }\n addClass(this.parent.ganttChartModule.scrollElement.querySelectorAll('.' + cls.connectorLineContainer), [cls.connectorLineZIndex]);\n if (!isNullOrUndefined(this.parent.taskFields.dependency) && element.querySelector('.' + cls.connectorPointLeft)) {\n addClass([element.querySelector('.' + cls.connectorPointLeft)], [cls.connectorPointLeftHover]);\n addClass([element.querySelector('.' + cls.connectorPointRight)], [cls.connectorPointRightHover]);\n }\n }\n else if (!fadeConnectorLine) {\n removeClass(this.parent.ganttChartModule.scrollElement.querySelectorAll('.' + cls.connectorLineContainer), [cls.connectorLineZIndex]);\n }\n if (secondElement && element !== secondElement) {\n if (secondElement.querySelector('.' + cls.taskBarLeftResizer)) {\n removeClass([secondElement.querySelector('.' + cls.taskBarLeftResizer)], [cls.leftResizeGripper]);\n removeClass([secondElement.querySelector('.' + cls.taskBarRightResizer)], [cls.rightResizeGripper]);\n if (secondElement.querySelector('.' + cls.childProgressResizer)) {\n removeClass([secondElement.querySelector('.' + cls.childProgressResizer)], [cls.progressResizeGripper]);\n }\n }\n if (!isNullOrUndefined(this.parent.taskFields.dependency) && secondElement.querySelector('.' + cls.connectorPointLeft)) {\n removeClass([secondElement.querySelector('.' + cls.connectorPointLeft)], [cls.connectorPointLeftHover]);\n removeClass([secondElement.querySelector('.' + cls.connectorPointRight)], [cls.connectorPointRightHover]);\n }\n }\n };\n /**\n * To get taskbar edit actions.\n * @return {string}\n * @private\n */\n TaskbarEdit.prototype.getTaskBarAction = function (e) {\n var mouseDownElement = e.target;\n return this.taskBarEditRecord.hasChildRecords ? 'ParentDrag' :\n mouseDownElement.classList.contains(cls.taskBarLeftResizer) ? 'LeftResizing' :\n mouseDownElement.classList.contains(cls.taskBarRightResizer) ? 'RightResizing' :\n mouseDownElement.classList.contains(cls.childProgressResizer) ? 'ProgressResizing' :\n closest(mouseDownElement, '.' + cls.childProgressResizer) ? 'ProgressResizing' :\n mouseDownElement.classList.contains(cls.connectorPointLeft) ? 'ConnectorPointLeftDrag' :\n mouseDownElement.classList.contains(cls.connectorPointRight) ? 'ConnectorPointRightDrag' :\n this.taskBarEditRecord.ganttProperties.isMilestone ? 'MilestoneDrag' : 'ChildDrag';\n };\n /**\n * To update property while perform mouse down.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.updateMouseDownProperties = function (e) {\n if (e.pageX || e.pageY) {\n var containerPosition = this.parent.getOffsetRect(this.parent.ganttChartModule.chartBodyContainer);\n this.mouseDownX = (e.pageX - containerPosition.left) +\n this.parent.ganttChartModule.scrollObject.previousScroll.left;\n this.tooltipPositionX = this.mouseDownX;\n this.mouseDownY = e.pageY - containerPosition.top +\n this.parent.ganttChartModule.scrollObject.previousScroll.top;\n }\n if (this.taskBarEditAction === 'ConnectorPointLeftDrag' || this.taskBarEditAction === 'ConnectorPointRightDrag') {\n this.fromPredecessorText = this.taskBarEditAction === 'ConnectorPointLeftDrag' ? 'Start' : 'Finish';\n this.parent.connectorLineModule.tooltipTable.innerHTML = this.parent.connectorLineModule.getConnectorLineTooltipInnerTd(this.taskBarEditRecord.ganttProperties.taskName, this.fromPredecessorText, '', '');\n }\n };\n TaskbarEdit.prototype.isMouseDragCheck = function () {\n if (!this.isMouseDragged && this.taskBarEditAction && ((this.mouseDownX !== this.mouseMoveX) &&\n ((this.mouseDownX + 3) < this.mouseMoveX || (this.mouseDownX - 3) > this.mouseMoveX)\n || (this.mouseDownY !== this.mouseMoveY) &&\n ((this.mouseDownY + 3) < this.mouseMoveY || (this.mouseDownY - 3) > this.mouseMoveY))) {\n this.isMouseDragged = true;\n this.parent.initiateEditAction(true);\n var item = this.taskBarEditRecord.ganttProperties;\n this.previousItem = this.parent.timelineModule.extendFunction(item, this.previousItemProperty);\n if (this.taskBarEditAction !== 'ConnectorPointLeftDrag' &&\n this.taskBarEditAction !== 'ConnectorPointRightDrag') {\n this.editTooltip.showHideTaskbarEditTooltip(true);\n }\n }\n };\n /**\n * To handle mouse move action in chart\n * @param e\n * @private\n */\n TaskbarEdit.prototype.mouseMoveAction = function (e) {\n var containerPosition = this.parent.getOffsetRect(this.parent.ganttChartModule.chartBodyContainer);\n this.mouseMoveX = e.pageX - containerPosition.left +\n this.parent.ganttChartModule.scrollObject.previousScroll.left;\n this.mouseMoveY = e.pageY - containerPosition.top +\n this.parent.ganttChartModule.scrollObject.previousScroll.top;\n this.dragMouseLeave = false;\n this.isMouseDragCheck();\n if (this.isMouseDragged && this.taskBarEditAction) {\n if (this.taskBarEditAction === 'ConnectorPointLeftDrag' ||\n this.taskBarEditAction === 'ConnectorPointRightDrag') {\n this.updateConnectorLineSecondProperties(e);\n }\n this.taskBarEditingAction(e);\n }\n else if (!this.taskBarEditAction) {\n this.updateTaskBarEditElement(e);\n }\n };\n /**\n * Method to update taskbar editing action on mous move.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.taskBarEditingAction = function (e) {\n var args = {};\n var recordIndex = this.parent.ganttChartModule.getIndexByTaskBar(this.taskBarEditElement);\n if (this.taskBarEditRecord !== null) {\n args.editingFields = this.taskBarEditRecord.ganttProperties;\n args.data = this.taskBarEditRecord;\n args.recordIndex = recordIndex;\n args.taskBarEditAction = this.taskBarEditAction;\n args.roundOffDuration = this.roundOffDuration;\n this.parent.trigger('taskbarEditing', args);\n }\n if (!args.cancel && this.taskBarEditRecord !== null) {\n this.roundOffDuration = args.roundOffDuration;\n this.updateMouseMoveProperties(e);\n if (this.taskBarEditAction === 'ProgressResizing') {\n this.performProgressResize(e);\n }\n else if (this.taskBarEditAction === 'LeftResizing') {\n this.enableLeftResizing(e);\n }\n else if (this.taskBarEditAction === 'RightResizing') {\n this.enableRightResizing(e);\n }\n else if (this.taskBarEditAction === 'ParentDrag' || this.taskBarEditAction === 'ChildDrag' ||\n this.taskBarEditAction === 'MilestoneDrag') {\n this.enableDragging(e);\n }\n else if (this.taskBarEditAction === 'ConnectorPointLeftDrag' ||\n this.taskBarEditAction === 'ConnectorPointRightDrag') {\n this.triggerDependencyEvent(e);\n this.drawFalseLine();\n }\n this.setItemPosition();\n this.updateEditedItem();\n this.editTooltip.updateTooltip();\n }\n else {\n this.editTooltip.showHideTaskbarEditTooltip(false);\n }\n };\n /**\n * To update property while perform mouse move.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.updateMouseMoveProperties = function (e) {\n var containerPosition = this.parent.getOffsetRect(this.parent.ganttChartModule.chartBodyContainer);\n if (e.pageX || e.pageY) {\n this.mouseMoveX = e.pageX - containerPosition.left +\n this.parent.ganttChartModule.scrollObject.previousScroll.left;\n this.tooltipPositionX = this.mouseMoveX;\n this.mouseMoveY = e.pageY - containerPosition.top +\n this.parent.ganttChartModule.scrollObject.previousScroll.top;\n }\n var isConnectorLineEdit = (this.taskBarEditAction === 'ConnectorPointLeftDrag' ||\n this.taskBarEditAction === 'ConnectorPointRightDrag') ?\n true : false;\n if ((this.taskBarEditRecord.ganttProperties.width > 3 && !((this.taskBarEditAction === 'ProgressResizing' &&\n (this.taskBarEditRecord.ganttProperties.progress === 0 || this.taskBarEditRecord.ganttProperties.progress === 100)))) ||\n isConnectorLineEdit) {\n var mouseX = this.mouseMoveX - this.parent.ganttChartModule.scrollObject.previousScroll.left +\n containerPosition.left;\n var mouseY = this.mouseMoveY - this.parent.ganttChartModule.scrollObject.previousScroll.top +\n containerPosition.top;\n if ((mouseX + 20) >\n containerPosition.left + this.parent.ganttChartModule.chartBodyContainer.offsetWidth) {\n this.timerCount = this.parent.ganttChartModule.scrollObject.previousScroll.left;\n this.startScrollTimer('right');\n }\n else if ((mouseX - 20) < containerPosition.left) {\n this.timerCount = this.parent.ganttChartModule.scrollObject.previousScroll.left;\n this.startScrollTimer('left');\n }\n else if (isConnectorLineEdit && ((mouseY + 20) >\n containerPosition.top + this.parent.ganttChartModule.chartBodyContainer.offsetHeight)) {\n this.timerCount = this.parent.ganttChartModule.scrollObject.previousScroll.top;\n this.startScrollTimer('bottom');\n }\n else if (isConnectorLineEdit && ((mouseY - 20) < containerPosition.top)) {\n this.timerCount = this.parent.ganttChartModule.scrollObject.previousScroll.top;\n this.startScrollTimer('top');\n }\n else {\n this.stopScrollTimer();\n }\n }\n else {\n this.stopScrollTimer();\n }\n };\n /**\n * To start the scroll timer.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.startScrollTimer = function (direction) {\n var _this = this;\n this.stopScrollTimer();\n this.scrollTimer = window.setInterval(function () {\n if (direction === 'right' || direction === 'bottom') {\n _this.timerCount = (_this.timerCount + 1) >= _this.parent.timelineModule.totalTimelineWidth ?\n _this.parent.timelineModule.totalTimelineWidth : (_this.timerCount + 1);\n }\n else {\n _this.timerCount = (_this.timerCount - 1) < 0 ? 0 : (_this.timerCount - 1);\n }\n if (direction === 'bottom' || direction === 'top') {\n _this.parent.ganttChartModule.scrollObject.setScrollTop(_this.timerCount);\n }\n else {\n _this.parent.ganttChartModule.scrollObject.setScrollLeft(_this.timerCount);\n }\n if (_this.taskBarEditAction === 'ConnectorPointLeftDrag'\n || _this.taskBarEditAction === 'ConnectorPointRightDrag') {\n _this.drawFalseLine();\n }\n }, 0);\n };\n /**\n * To stop the scroll timer.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.stopScrollTimer = function () {\n window.clearInterval(this.scrollTimer);\n this.scrollTimer = null;\n };\n /**\n * To update left and width while perform taskbar drag operation.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.enableDragging = function (e) {\n var item = this.taskBarEditRecord.ganttProperties;\n var diffrenceWidth = 0;\n if (this.mouseDownX > this.mouseMoveX) {\n diffrenceWidth = this.mouseDownX - this.mouseMoveX;\n if (diffrenceWidth > 0) {\n this.parent.setRecordValue('left', this.previousItem.left - diffrenceWidth, item, true);\n }\n }\n else {\n diffrenceWidth = this.mouseMoveX - this.mouseDownX;\n this.parent.setRecordValue('left', this.previousItem.left + diffrenceWidth, item, true);\n }\n var left = item.left < 0 ? 0 : (item.left + item.width) >= this.parent.timelineModule.totalTimelineWidth ?\n (this.parent.timelineModule.totalTimelineWidth - item.width) : item.left;\n this.parent.setRecordValue('left', left, item, true);\n };\n /**\n * To update left and width while perform progress resize operation.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.performProgressResize = function (e) {\n var item = this.taskBarEditRecord.ganttProperties;\n var diffrenceWidth = 0;\n if (this.mouseDownX > this.mouseMoveX) {\n if (this.mouseMoveX > item.left &&\n (this.mouseMoveX < (item.left + item.width)) && item.left > 0) {\n diffrenceWidth = this.mouseMoveX - item.left;\n this.parent.setRecordValue('progressWidth', diffrenceWidth, item, true);\n }\n else {\n if (this.mouseMoveX >= (item.left + item.width)) {\n this.parent.setRecordValue('progressWidth', item.width, item, true);\n }\n else {\n this.parent.setRecordValue('progressWidth', 0, item, true);\n }\n }\n }\n else {\n if (this.mouseMoveX > item.left &&\n (this.mouseMoveX < (item.left + item.width))) {\n diffrenceWidth = this.mouseMoveX - item.left;\n this.parent.setRecordValue('progressWidth', diffrenceWidth, item, true);\n }\n else {\n if (this.mouseMoveX <= item.left) {\n this.parent.setRecordValue('progressWidth', 0, item, true);\n }\n else {\n this.parent.setRecordValue('progressWidth', item.width, item, true);\n }\n }\n }\n var widthValue = item.progressWidth > item.width ?\n item.width : item.progressWidth;\n widthValue = item.progressWidth < 0 ? 0 : item.progressWidth;\n this.parent.setRecordValue('progressWidth', widthValue, item, true);\n var diff = item.width - item.progressWidth;\n if (diff <= 4) {\n this.progressBorderRadius = 4 - diff;\n }\n else {\n this.progressBorderRadius = 0;\n }\n };\n /**\n * To update left and width while perform taskbar left resize operation.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.enableLeftResizing = function (e) {\n var item = this.taskBarEditRecord.ganttProperties;\n var diffrenceWidth = 0;\n if (this.mouseDownX > this.mouseMoveX) {\n if (this.mouseMoveX < (item.left + item.width)) {\n diffrenceWidth = this.mouseDownX - this.mouseMoveX;\n if (item.left > 0) {\n this.parent.setRecordValue('left', this.previousItem.left - diffrenceWidth, item, true);\n this.parent.setRecordValue('width', this.previousItem.width + diffrenceWidth, item, true);\n }\n }\n else {\n if (this.mouseMoveX > (item.left + item.width)) {\n diffrenceWidth = this.mouseDownX - this.mouseMoveX;\n this.parent.setRecordValue('left', this.previousItem.left - diffrenceWidth, item, true);\n this.parent.setRecordValue('width', 3, item, true);\n }\n }\n }\n else {\n if (this.mouseMoveX < (item.left + item.width)) {\n diffrenceWidth = this.mouseMoveX - this.mouseDownX;\n if ((item.left) < (item.left + item.width) &&\n ((this.previousItem.left + diffrenceWidth) <= (this.previousItem.left + this.previousItem.width))) {\n this.parent.setRecordValue('left', this.previousItem.left + diffrenceWidth, item, true);\n this.parent.setRecordValue('width', this.previousItem.width - diffrenceWidth, item, true);\n }\n }\n else {\n diffrenceWidth = this.mouseMoveX - this.mouseDownX;\n this.parent.setRecordValue('left', this.previousItem.left + diffrenceWidth, item, true);\n this.parent.setRecordValue('width', 3, item, true);\n }\n }\n this.updateEditPosition(e, item);\n this.parent.setRecordValue('left', (this.previousItem.left + this.previousItem.width - item.width), item, true);\n };\n /**\n * Update mouse position and edited item value\n * @param e\n * @param item\n */\n TaskbarEdit.prototype.updateEditPosition = function (e, item) {\n this.updateIsMilestone(item);\n this.parent.setRecordValue('progressWidth', this.parent.dataOperation.getProgressWidth(item.width, item.progress), item, true);\n };\n /**\n * To update milestone property.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.updateIsMilestone = function (item) {\n if (item.width <= 3) {\n this.parent.setRecordValue('width', 3, item, true);\n this.parent.setRecordValue('isMilestone', true, item, true);\n }\n else {\n this.parent.setRecordValue('width', item.width, item, true);\n this.parent.setRecordValue('isMilestone', false, item, true);\n }\n };\n /**\n * To update left and width while perform taskbar right resize operation.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.enableRightResizing = function (e) {\n var item = this.taskBarEditRecord.ganttProperties;\n var diffrenceWidth = 0;\n if (this.mouseDownX > this.mouseMoveX) {\n if (this.mouseMoveX > item.left && (this.mouseDownX - this.mouseMoveX) > 3) {\n diffrenceWidth = this.mouseDownX - this.mouseMoveX;\n this.parent.setRecordValue('width', this.previousItem.width - diffrenceWidth, item, true);\n }\n else {\n if (this.mouseMoveX < item.left) {\n this.parent.setRecordValue('width', 3, item, true);\n }\n }\n }\n else {\n if (this.mouseMoveX > item.left) {\n diffrenceWidth = this.mouseMoveX - this.mouseDownX;\n this.parent.setRecordValue('width', this.previousItem.width + diffrenceWidth, item, true);\n }\n }\n this.updateEditPosition(e, item);\n };\n /**\n * To updated startDate and endDate while perform taskbar edit operation.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.updateEditedItem = function () {\n var item = this.taskBarEditRecord.ganttProperties;\n var left;\n switch (this.taskBarEditAction) {\n case 'ProgressResizing':\n this.parent.setRecordValue('progress', this.getProgressPercent(item.width, item.progressWidth), item, true);\n break;\n case 'LeftResizing':\n left = this.getRoundOffStartLeft(item, this.roundOffDuration);\n var projectStartDate = this.getDateByLeft(left);\n if (isNullOrUndefined(item.endDate)) {\n var endDate_1 = this.parent.dateValidationModule.getValidEndDate(item);\n this.parent.setRecordValue('endDate', endDate_1, item, true);\n }\n var startDate = this.parent.dateValidationModule.checkStartDate(projectStartDate, item, null);\n this.parent.setRecordValue('startDate', new Date(startDate.getTime()), item, true);\n if (this.parent.dateValidationModule.compareDates(item.startDate, item.endDate) === 0\n && isNullOrUndefined(item.isMilestone) && item.isMilestone === false && item.duration === 0) {\n this.parent.setRecordValue('duration', 1, item, true);\n }\n this.parent.dateValidationModule.calculateDuration(this.taskBarEditRecord);\n break;\n case 'RightResizing':\n left = this.getRoundOffEndLeft(item, this.roundOffDuration);\n var tempEndDate = this.getDateByLeft(left);\n if (isNullOrUndefined(item.startDate)) {\n startDate = this.parent.dateValidationModule.getValidStartDate(item);\n this.parent.setRecordValue('startDate', startDate, item, true);\n }\n var endDate = this.parent.dateValidationModule.checkEndDate(tempEndDate, this.taskBarEditRecord.ganttProperties);\n this.parent.setRecordValue('endDate', new Date(endDate.getTime()), item, true);\n this.parent.dateValidationModule.calculateDuration(this.taskBarEditRecord);\n break;\n case 'ParentDrag':\n case 'ChildDrag':\n case 'MilestoneDrag':\n left = this.getRoundOffStartLeft(item, this.roundOffDuration);\n projectStartDate = this.getDateByLeft(left);\n if (!isNullOrUndefined(item.endDate) && isNullOrUndefined(item.startDate)) {\n endDate = this.parent.dateValidationModule.checkStartDate(projectStartDate, item, null);\n endDate = this.parent.dateValidationModule.checkEndDate(endDate, this.taskBarEditRecord.ganttProperties);\n this.parent.setRecordValue('endDate', endDate, item, true);\n }\n else {\n this.parent.setRecordValue('startDate', this.parent.dateValidationModule.checkStartDate(projectStartDate, item, null), item, true);\n if (!isNullOrUndefined(item.duration)) {\n this.parent.dateValidationModule.calculateEndDate(this.taskBarEditRecord);\n }\n }\n break;\n }\n };\n /**\n * To get roundoff enddate.\n * @return {number}\n * @private\n */\n TaskbarEdit.prototype.getRoundOffEndLeft = function (ganttRecord, isRoundOff) {\n var tierMode = this.parent.timelineModule.bottomTier !== 'None' ? this.parent.timelineModule.bottomTier :\n this.parent.timelineModule.topTier;\n var totalLeft = ganttRecord.width + ganttRecord.left;\n var remainingContribution = (1 / (this.parent.timelineModule.getIncrement(this.getDateByLeft(totalLeft), 1, 'Day') / (1000 * 60 * 60 * 24)));\n var remainingLeft = this.parent.perDayWidth - (this.parent.perDayWidth / remainingContribution);\n var positionValue = remainingLeft / this.parent.perDayWidth;\n if (isRoundOff === undefined) {\n isRoundOff = false;\n }\n /*Rounding the decimal value for week-month-year schedule mode*/\n if (!isRoundOff) {\n if ((tierMode !== 'Hour' && tierMode !== 'Minutes')) {\n if (positionValue === 0) {\n totalLeft = totalLeft;\n }\n else if (positionValue > 0.5) {\n totalLeft = totalLeft - remainingLeft + this.parent.perDayWidth;\n }\n else if (positionValue < 0.5) {\n totalLeft = (totalLeft - remainingLeft) + (this.parent.perDayWidth / 2);\n }\n }\n }\n else if (isRoundOff) {\n if (tierMode === 'Hour') {\n var inHour = (this.parent.perDayWidth / 24);\n remainingContribution =\n (1 / (this.parent.timelineModule.getIncrement(this.getDateByLeft(totalLeft), 1, 'Hour') / (1000 * 60 * 60)));\n remainingLeft = (this.parent.perDayWidth / 24) - ((this.parent.perDayWidth / 24) / remainingContribution);\n if (remainingLeft !== 0) {\n totalLeft = (totalLeft - remainingLeft) + inHour;\n }\n }\n else if (tierMode === 'Minutes') {\n var inMinutes = (this.parent.perDayWidth / (24 * 60));\n remainingContribution =\n (1 / (this.parent.timelineModule.getIncrement(this.getDateByLeft(totalLeft), 1, 'Minutes') / (1000 * 60)));\n remainingLeft = (this.parent.perDayWidth / (24 * 60)) - ((this.parent.perDayWidth / (24 * 60)) / remainingContribution);\n if (remainingLeft !== 0) {\n totalLeft = (totalLeft - remainingLeft) + inMinutes;\n }\n }\n else {\n if (remainingLeft !== 0) {\n totalLeft = (totalLeft - remainingLeft) + this.parent.perDayWidth;\n }\n }\n }\n return totalLeft;\n };\n /**\n * To get roundoff startdate.\n * @return {number}\n * @private\n */\n TaskbarEdit.prototype.getRoundOffStartLeft = function (ganttRecord, isRoundOff) {\n var left = ganttRecord.left;\n var tierMode = this.parent.timelineModule.bottomTier !== 'None' ? this.parent.timelineModule.bottomTier :\n this.parent.timelineModule.topTier;\n var remainingContribution = (1 / (this.parent.timelineModule.getIncrement(this.getDateByLeft(left), 1, 'Day') / (1000 * 60 * 60 * 24)));\n var remainDays = this.parent.perDayWidth - (this.parent.perDayWidth / remainingContribution);\n var remainDaysInDecimal = remainDays / this.parent.perDayWidth;\n if (isRoundOff === undefined) {\n isRoundOff = false;\n }\n /*Rounding the decimal value for week-month-year schedule mode*/\n if (!isRoundOff) {\n if ((tierMode !== 'Hour' && tierMode !== 'Minutes')) {\n if (remainDaysInDecimal <= 0.5) {\n left = ganttRecord.left - remainDays;\n }\n else if (remainDaysInDecimal > 0.5) {\n left = (ganttRecord.left - remainDays) + this.parent.perDayWidth / 2;\n }\n }\n }\n else if (isRoundOff) {\n if (tierMode === 'Hour') {\n remainingContribution =\n (1 / (this.parent.timelineModule.getIncrement(this.getDateByLeft(left), 1, 'Hour') / (1000 * 60 * 60)));\n remainDays = (this.parent.perDayWidth / 24) - ((this.parent.perDayWidth / 24) / remainingContribution);\n left = ganttRecord.left - remainDays;\n }\n else if (tierMode === 'Minutes') {\n remainingContribution =\n (1 / (this.parent.timelineModule.getIncrement(this.getDateByLeft(left), 1, 'Minutes') / (1000 * 60)));\n remainDays = (this.parent.perDayWidth / (24 * 60)) - ((this.parent.perDayWidth / (24 * 60)) / remainingContribution);\n left = ganttRecord.left - remainDays;\n }\n else {\n left = ganttRecord.left - remainDays;\n }\n }\n return left;\n };\n /**\n * To get date by left value.\n * @return {Date}\n * @private\n */\n TaskbarEdit.prototype.getDateByLeft = function (left) {\n var pStartDate = new Date(this.parent.timelineModule.timelineStartDate.toString());\n var milliSecondsPerPixel = (24 * 60 * 60 * 1000) / this.parent.perDayWidth;\n pStartDate.setTime(pStartDate.getTime() + (left * milliSecondsPerPixel));\n var tierMode = this.parent.timelineModule.bottomTier !== 'None' ? this.parent.timelineModule.topTier :\n this.parent.timelineModule.bottomTier;\n if (tierMode !== 'Hour' && tierMode !== 'Minutes') {\n if (this.isInDst(new Date(this.parent.timelineModule.timelineStartDate.toString())) && !this.isInDst(pStartDate)) {\n pStartDate.setTime(pStartDate.getTime() + (60 * 60 * 1000));\n }\n else if (!this.isInDst(new Date(this.parent.timelineModule.timelineStartDate.toString())) && this.isInDst(pStartDate)) {\n pStartDate.setTime(pStartDate.getTime() - (60 * 60 * 1000));\n }\n }\n return pStartDate;\n };\n /**\n * To get timezone offset.\n * @return {number}\n * @private\n */\n TaskbarEdit.prototype.getDefaultTZOffset = function () {\n var janMonth = new Date(new Date().getFullYear(), 0, 1);\n var julMonth = new Date(new Date().getFullYear(), 6, 1); //Because there is no reagions DST inbetwwen this range\n return Math.max(janMonth.getTimezoneOffset(), julMonth.getTimezoneOffset());\n };\n /**\n * To check whether the date is in DST.\n * @return {boolean}\n * @private\n */\n TaskbarEdit.prototype.isInDst = function (date) {\n return date.getTimezoneOffset() < this.getDefaultTZOffset();\n };\n /**\n * To set item position.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.setItemPosition = function () {\n var item = this.taskBarEditRecord.ganttProperties;\n var width = this.taskBarEditAction === 'MilestoneDrag' ?\n this.parent.chartRowsModule.milestoneHeight : item.width;\n var taskBarMainContainer = closest(this.taskBarEditElement, 'tr.' + cls.chartRow)\n .querySelector('.' + cls.taskBarMainContainer);\n var leftLabelContainer = closest(this.taskBarEditElement, 'tr.' + cls.chartRow)\n .querySelector('.' + cls.leftLabelContainer);\n var rightLabelContainer = closest(this.taskBarEditElement, 'tr.' + cls.chartRow)\n .querySelector('.' + cls.rightLabelContainer);\n var traceChildProgressBar = this.taskBarEditElement.querySelector('.' + cls.traceChildProgressBar);\n var traceChildTaskBar = this.taskBarEditElement.querySelector('.' + cls.traceChildTaskBar);\n var childProgressResizer = this.taskBarEditElement.querySelector('.' + cls.childProgressResizer);\n var taskBarRightResizer = this.taskBarEditElement.querySelector('.' + cls.taskBarRightResizer);\n var traceParentTaskBar = this.taskBarEditElement.querySelector('.' + cls.traceParentTaskBar);\n var traceParentProgressBar = this.taskBarEditElement.querySelector('.' + cls.traceParentProgressBar);\n var traceConnectorPointRight = this.taskBarEditElement.querySelector('.' + cls.rightConnectorPointOuterDiv);\n if (this.taskBarEditAction !== 'ConnectorPointRightDrag' &&\n this.taskBarEditAction !== 'ConnectorPointLeftDrag') {\n taskBarMainContainer.style.width = (width) + 'px';\n taskBarMainContainer.style.left = (item.left) + 'px';\n leftLabelContainer.style.width = (item.left) + 'px';\n rightLabelContainer.style.left = (item.left + width) + 'px';\n if (traceConnectorPointRight) {\n traceConnectorPointRight.style.left = (width) + 'px';\n }\n if (this.taskBarEditAction === 'MilestoneDrag') {\n taskBarMainContainer.style.left = (item.left - (width / 2)) + 'px';\n leftLabelContainer.style.width = (item.left - (width / 2)) + 'px';\n rightLabelContainer.style.left = (item.left + (width / 2)) + 'px';\n }\n else if (this.taskBarEditAction === 'ProgressResizing') {\n traceChildProgressBar.style.width = item.progressWidth + 'px';\n traceChildProgressBar.style.borderBottomRightRadius = this.progressBorderRadius + 'px';\n traceChildProgressBar.style.borderTopRightRadius = this.progressBorderRadius + 'px';\n traceChildTaskBar.style.left = (item.left + item.progressWidth - 10) + 'px';\n childProgressResizer.style.left = item.progressWidth - 8 + 'px';\n }\n else if (this.taskBarEditAction === 'RightResizing') {\n traceChildTaskBar.style.width = (width) + 'px';\n traceChildProgressBar.style.width = (item.progressWidth) + 'px';\n taskBarRightResizer.style.left = (width - 10) + 'px';\n childProgressResizer.style.left = (item.progressWidth - 10) + 'px';\n }\n else if (this.taskBarEditAction === 'ParentDrag') {\n traceParentTaskBar.style.width = (width) + 'px';\n traceParentProgressBar.style.width = (item.progressWidth) + 'px';\n }\n else {\n traceChildTaskBar.style.width = (width) + 'px';\n if (!isNullOrUndefined(traceChildProgressBar)) {\n taskBarRightResizer.style.left = (width - 10) + 'px';\n traceChildProgressBar.style.width = (item.progressWidth) + 'px';\n childProgressResizer.style.left = item.progressWidth - 10 + 'px';\n }\n }\n }\n };\n /**\n * To handle mouse up event in chart\n * @param e\n * @private\n */\n TaskbarEdit.prototype.mouseUpHandler = function (e) {\n this.editTooltip.showHideTaskbarEditTooltip(false);\n if (this.taskBarEditAction && this.isMouseDragged) {\n if (!this.dragMouseLeave && this.taskBarEditedAction) {\n this.taskBarEditedAction(e);\n }\n else {\n this.cancelTaskbarEditActionInMouseLeave();\n }\n }\n this.initPublicProp();\n this.stopScrollTimer();\n };\n /**\n * To perform taskbar edit operation.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.taskBarEditedAction = function (e) {\n var args = {};\n var x1 = this.mouseDownX;\n var y1 = this.mouseDownY;\n var row;\n var item = this.taskBarEditRecord;\n var recordIndex = this.parent.ganttChartModule.getIndexByTaskBar(this.taskBarEditElement);\n var x2;\n var y2;\n var resMouseY;\n x2 = this.mouseMoveX;\n y2 = this.mouseMoveY;\n resMouseY = e.pageY - this.parent.ganttChartModule.chartBodyContainer.offsetTop;\n if ((this.taskBarEditAction === 'ConnectorPointLeftDrag' ||\n this.taskBarEditAction === 'ConnectorPointRightDrag') && this.drawPredecessor) {\n this.parent.connectorLineEditModule.updatePredecessor(this.connectorSecondRecord, this.finalPredecessor);\n }\n else {\n if (x1 !== x2 || (Math.abs(y1 - resMouseY) >= (this.parent.rowHeight - this.parent.taskbarHeight) / 2)) {\n if (item !== null) {\n args.editingFields = item.ganttProperties;\n args.data = item;\n args.recordIndex = recordIndex;\n args.previousData = this.previousItem;\n args.taskBarEditAction = this.taskBarEditAction;\n args.action = 'TaskbarEditing';\n args.roundOffDuration = this.roundOffDuration;\n this.taskbarEditedArgs = args;\n this.taskbarEdited(args);\n }\n }\n }\n };\n /**\n * To cancel the taskbar edt action.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.cancelTaskbarEditActionInMouseLeave = function () {\n this.parent.editModule.reUpdatePreviousRecords(true);\n };\n /**\n * To trigger taskbar edited event.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.taskbarEdited = function (arg) {\n var args = extend({}, arg);\n var ganttRecord = args.data;\n var taskData = ganttRecord.ganttProperties;\n if (args.taskBarEditAction === 'ProgressResizing') {\n if (args.previousData.progress !== taskData.progress) {\n this.parent.setRecordValue('progress', this.getProgressPercent(taskData.width, taskData.progressWidth), taskData, true);\n if (ganttRecord.parentItem) {\n this.parent.editModule.updateParentProgress(ganttRecord.parentItem);\n }\n }\n }\n else {\n this.parent.dataOperation.updateWidthLeft(args.data);\n }\n this.parent.dataOperation.updateTaskData(ganttRecord);\n this.parent.editModule.initiateUpdateAction(args);\n };\n /**\n * To get progress in percentage.\n * @return {number}\n * @private\n */\n TaskbarEdit.prototype.getProgressPercent = function (parentwidth, progresswidth) {\n return Math.ceil(((progresswidth / parentwidth) * 100));\n };\n /**\n * false line implementation.\n * @return {void}\n * @private\n */\n TaskbarEdit.prototype.drawFalseLine = function () {\n var x1 = this.mouseDownX;\n var y1 = this.mouseDownY;\n var x2 = this.mouseMoveX;\n var y2 = this.mouseMoveY;\n var length = Math.sqrt((x1 - x2) * (x1 - x2) + (y1 - y2) * (y1 - y2));\n var angle = Math.atan2(y2 - y1, x2 - x1) * 180 / Math.PI;\n var transform = 'rotate(' + angle + 'deg)';\n var left;\n var top;\n if (this.taskBarEditAction === 'ConnectorPointLeftDrag') {\n left = (this.taskBarEditElement.offsetLeft - (this.parent.chartRowsModule.connectorPointWidth / 2)) -\n this.parent.ganttChartModule.scrollObject.previousScroll.left;\n }\n if (this.taskBarEditAction === 'ConnectorPointRightDrag') {\n left = (this.taskBarEditElement.offsetLeft + this.taskBarEditElement.offsetWidth) +\n (this.parent.chartRowsModule.connectorPointWidth / 2) - this.parent.ganttChartModule.scrollObject.previousScroll.left;\n }\n top = ((this.taskBarEditElement.offsetTop) + (this.taskBarEditElement.offsetHeight / 2) +\n this.parent.ganttChartModule.chartBodyContainer.offsetTop) - this.parent.ganttChartModule.scrollObject.previousScroll.top;\n this.removeFalseLine(false);\n this.falseLine = createElement('div', {\n className: cls.falseLine, id: 'ganttfalseline' + this.parent.element.id,\n styles: 'transform-origin: 0% 100%;right: auto;position: absolute;transform:' + transform + ';' +\n 'border-top-width: 1px;border-top-style: dashed;z-index: 5;width:' + (length - 3) + 'px;' +\n 'left:' + left + 'px;top:' + top + 'px;'\n });\n this.parent.ganttChartModule.chartBodyContainer.appendChild(this.falseLine);\n };\n /**\n *\n * @param isRemoveConnectorPointDisplay\n * @private\n */\n TaskbarEdit.prototype.removeFalseLine = function (isRemoveConnectorPointDisplay) {\n if (this.falseLine) {\n remove(this.falseLine);\n this.falseLine = null;\n if (isRemoveConnectorPointDisplay) {\n removeClass(this.parent.ganttChartModule.scrollElement.querySelectorAll('.' + cls.connectorLineContainer), [cls.connectorLineZIndex]);\n }\n }\n };\n /**\n *\n * @param e\n * @private\n */\n TaskbarEdit.prototype.updateConnectorLineSecondProperties = function (e) {\n var element = parentsUntil(e.target, cls.taskBarMainContainer);\n this.connectorSecondAction = null;\n if (parentsUntil(e.target, cls.connectorPointLeft)) {\n this.connectorSecondAction = 'ConnectorPointLeftDrag';\n this.toPredecessorText = 'Start';\n }\n else if (parentsUntil(e.target, cls.connectorPointRight)) {\n this.connectorSecondAction = 'ConnectorPointRightDrag';\n this.toPredecessorText = 'Finish';\n }\n else {\n this.connectorSecondAction = null;\n this.toPredecessorText = null;\n }\n if (this.taskBarEditElement !== element && this.taskBarEditElement !== this.highlightedSecondElement) {\n this.showHideTaskBarEditingElements(element, this.highlightedSecondElement, true);\n }\n if (isNullOrUndefined(this.connectorSecondAction) && !isNullOrUndefined(this.connectorSecondElement)) {\n this.editTooltip.showHideTaskbarEditTooltip(false);\n removeClass([this.connectorSecondElement.querySelector('.' + cls.connectorPointLeft)], [cls.connectorPointAllowBlock]);\n removeClass([this.connectorSecondElement.querySelector('.' + cls.connectorPointRight)], [cls.connectorPointAllowBlock]);\n }\n this.connectorSecondElement = this.connectorSecondAction ? element : null;\n this.highlightedSecondElement = element;\n this.connectorSecondRecord = isNullOrUndefined(this.connectorSecondElement) ?\n null : this.parent.ganttChartModule.getRecordByTaskBar(this.connectorSecondElement);\n };\n TaskbarEdit.prototype.triggerDependencyEvent = function (e, mouseUp) {\n var fromItem = this.taskBarEditRecord.ganttProperties;\n var toItem = this.connectorSecondRecord ? this.connectorSecondRecord.ganttProperties : null;\n var predecessor;\n var currentTarget;\n var element = e.target;\n if (this.taskBarEditAction === 'ConnectorPointLeftDrag') {\n predecessor = fromItem.taskId + 'S';\n }\n else if (this.taskBarEditAction === 'ConnectorPointRightDrag') {\n predecessor = fromItem.taskId + 'F';\n }\n if (this.connectorSecondAction) {\n if (this.connectorSecondAction === 'ConnectorPointLeftDrag') {\n predecessor += 'S';\n currentTarget = 'Start';\n }\n else if (this.connectorSecondAction === 'ConnectorPointRightDrag') {\n predecessor += 'F';\n currentTarget = 'Finish';\n }\n }\n if (isNullOrUndefined(toItem)) {\n this.drawPredecessor = false;\n return;\n }\n if (toItem.predecessorsName) {\n this.finalPredecessor = toItem.predecessorsName + ',' + predecessor;\n }\n else {\n this.finalPredecessor = predecessor;\n }\n var isValidLink = this.parent.connectorLineEditModule.validatePredecessorRelation(this.connectorSecondRecord, this.finalPredecessor);\n var args = {};\n args.fromItem = fromItem;\n args.toItem = toItem;\n args.newPredecessorString = this.finalPredecessor;\n args.isValidLink = isValidLink;\n args.requestType = 'ValidateDependency';\n this.parent.trigger('actionBegin', args);\n args.isValidLink = !isValidLink && args.isValidLink ? false : args.isValidLink;\n if (args.isValidLink) {\n if (!this.editTooltip.toolTipObj) {\n this.editTooltip.showHideTaskbarEditTooltip(true);\n }\n if (this.editTooltip.toolTipObj) {\n this.parent.connectorLineModule.tooltipTable.innerHTML = this.parent.connectorLineModule.getConnectorLineTooltipInnerTd(this.parent.editModule.taskbarEditModule.taskBarEditRecord.ganttProperties.taskName, this.parent.editModule.taskbarEditModule.fromPredecessorText, '', '');\n var table = this.parent.connectorLineModule.tooltipTable.querySelector('#toPredecessor').querySelectorAll('td');\n table[1].innerText = toItem.taskName;\n table[2].innerText = currentTarget;\n }\n this.drawPredecessor = true;\n }\n else {\n addClass([element], [cls.connectorPointAllowBlock]);\n this.drawPredecessor = false;\n }\n };\n TaskbarEdit.prototype.unWireEvents = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off('chartMouseDown', this.mouseDownHandler);\n this.parent.off('chartMouseUp', this.mouseUpHandler);\n this.parent.off('chartMouseLeave', this.mouseLeaveHandler);\n this.parent.off('chartMouseMove', this.mouseMoveAction);\n };\n /**\n * @private\n */\n TaskbarEdit.prototype.destroy = function () {\n this.unWireEvents();\n this.stopScrollTimer();\n };\n return TaskbarEdit;\n}());\nexport { TaskbarEdit };\n","/** @hidden */\nexport var created = 'create';\n/** @hidden */\nexport var destroyed = 'destroy';\n/** @hidden */\nexport var load = 'load';\n/**\n * Specifies RichTextEditor internal events\n */\n/** @hidden */\nexport var initialLoad = 'initial-load';\n/** @hidden */\nexport var initialEnd = 'initial-end';\n/** @hidden */\nexport var iframeMouseDown = 'iframe-click';\n/** @hidden */\nexport var destroy = 'destroy';\n/** @hidden */\nexport var toolbarClick = 'toolbarClick';\n/** @hidden */\nexport var toolbarRefresh = 'toolbar-refresh';\n/** @hidden */\nexport var refreshBegin = 'refresh-begin';\n/** @hidden */\nexport var toolbarUpdated = 'toolbar-updated';\n/** @hidden */\nexport var bindOnEnd = 'bind-on-end';\n/** @hidden */\nexport var renderColorPicker = 'render-color-picker';\n/** @hidden */\nexport var htmlToolbarClick = 'html-toolbar-click';\n/** @hidden */\nexport var markdownToolbarClick = 'markdown-toolbar-click';\n/** @hidden */\nexport var destroyColorPicker = 'destroy-color-picker';\n/** @hidden */\nexport var modelChanged = 'model-changed';\n/** @hidden */\nexport var keyUp = 'keyUp';\n/** @hidden */\nexport var keyDown = 'keyDown';\n/** @hidden */\nexport var mouseUp = 'mouseUp';\n/** @hidden */\nexport var toolbarCreated = 'toolbarCreated';\n/** @hidden */\nexport var toolbarRenderComplete = 'toolbarRenderComplete';\n/** @hidden */\nexport var enableFullScreen = 'enableFullScreen';\n/** @hidden */\nexport var disableFullScreen = 'disableFullScreen';\n/** @hidden */\nexport var dropDownSelect = 'dropDownSelect';\n/** @hidden */\nexport var beforeDropDownItemRender = 'beforeDropDownItemRender';\n/** @hidden */\nexport var execCommandCallBack = 'execCommandCallBack';\n/** @hidden */\nexport var imageToolbarAction = 'image-toolbar-action';\n/** @hidden */\nexport var linkToolbarAction = 'link-toolbar-action';\n/** @hidden */\nexport var resizeStart = 'resizeStart';\n/** @hidden */\nexport var onResize = 'resizing';\n/** @hidden */\nexport var resizeStop = 'resizeStop';\n/** @hidden */\nexport var undo = 'undo';\n/** @hidden */\nexport var redo = 'redo';\n/** @hidden */\nexport var insertLink = 'insertLink';\n/** @hidden */\nexport var unLink = 'unLink';\n/** @hidden */\nexport var editLink = 'editLink';\n/** @hidden */\nexport var openLink = 'openLink';\n/** @hidden */\nexport var actionBegin = 'actionBegin';\n/** @hidden */\nexport var actionComplete = 'actionComplete';\n/** @hidden */\nexport var actionSuccess = 'actionSuccess';\n/** @hidden */\nexport var popupOpen = 'popupOpen';\n/** @hidden */\nexport var updateToolbarItem = 'updateToolbarItem';\n/** @hidden */\nexport var insertImage = 'insertImage';\n/** @hidden */\nexport var insertCompleted = 'insertCompleted';\n/** @hidden */\nexport var imageLeft = 'justifyLeft';\n/** @hidden */\nexport var imageRight = 'justifyRight';\n/** @hidden */\nexport var imageCenter = 'justifyCenter';\n/** @hidden */\nexport var imageBreak = 'break';\n/** @hidden */\nexport var imageInline = 'inline';\n/** @hidden */\nexport var imageLink = 'insertImgLink';\n/** @hidden */\nexport var imageAlt = 'imgAltText';\n/** @hidden */\nexport var imageDelete = 'delete';\n/** @hidden */\nexport var imageCaption = 'caption';\n/** @hidden */\nexport var imageSize = 'imageSize';\n/** @hidden */\nexport var sourceCode = 'sourceCode';\n/** @hidden */\nexport var updateSource = 'updateSource';\n/** @hidden */\nexport var toolbarOpen = 'toolbarOpen';\n/** @hidden */\nexport var beforeDropDownOpen = 'beforeDropDownOpen';\n/** @hidden */\nexport var selectionSave = 'selection-save';\n/** @hidden */\nexport var selectionRestore = 'selection-restore';\n/** @hidden */\nexport var expandPopupClick = 'expandPopupClick';\n/** @hidden */\nexport var count = 'count';\n/** @hidden */\nexport var contentFocus = 'contentFocus';\n/** @hidden */\nexport var contentBlur = 'contentBlur';\n/** @hidden */\nexport var mouseDown = 'mouseDown';\n/** @hidden */\nexport var sourceCodeMouseDown = 'sourceCodeMouseDown';\n/** @hidden */\nexport var editAreaClick = 'editAreaClick';\n/** @hidden */\nexport var scroll = 'scroll';\n/** @hidden */\nexport var colorPickerChanged = 'colorPickerChanged';\n/** @hidden */\nexport var tableColorPickerChanged = 'tableColorPickerChanged';\n/** @hidden */\nexport var focusChange = 'focusChange';\n/** @hidden */\nexport var selectAll = 'selectAll';\n/** @hidden */\nexport var selectRange = 'selectRange';\n/** @hidden */\nexport var getSelectedHtml = 'getSelectedHtml';\n/** @hidden */\nexport var renderInlineToolbar = 'renderInlineToolbar';\n/** @hidden */\nexport var paste = 'paste-content';\n/** @hidden */\nexport var imgModule = 'imageModule';\n/** @hidden */\nexport var rtlMode = 'rtl-mode';\n/** @hidden */\nexport var createTable = 'createTable';\n/** @hidden */\nexport var docClick = 'docClick';\n/** @hidden */\nexport var tableToolbarAction = 'table-toolbar-action';\n/** @hidden */\nexport var checkUndo = 'checkUndoStack';\n/** @hidden */\nexport var readOnlyMode = 'readOnlyMode';\n/** @hidden */\nexport var pasteClean = 'pasteClean';\n","/**\n * RichTextEditor classes defined here.\n */\n/** @hidden */\nexport var CLS_RTE = 'e-richtexteditor';\n/** @hidden */\nexport var CLS_RTL = 'e-rtl';\n/** @hidden */\nexport var CLS_CONTENT = 'e-content';\n/** @hidden */\nexport var CLS_DISABLED = 'e-disabled';\n/** @hidden */\nexport var CLS_SCRIPT_SHEET = 'rte-iframe-script-sheet';\n/** @hidden */\nexport var CLS_STYLE_SHEET = 'rte-iframe-style-sheet';\n/** @hidden */\nexport var CLS_TOOLBAR = 'e-rte-toolbar';\n/** @hidden */\nexport var CLS_TB_FIXED = 'e-rte-tb-fixed';\n/** @hidden */\nexport var CLS_TB_FLOAT = 'e-rte-tb-float';\n/** @hidden */\nexport var CLS_TB_ABS_FLOAT = 'e-rte-tb-abs-float';\n/** @hidden */\nexport var CLS_INLINE = 'e-rte-inline';\n/** @hidden */\nexport var CLS_TB_INLINE = 'e-rte-tb-inline';\n/** @hidden */\nexport var CLS_RTE_EXPAND_TB = 'e-rte-tb-expand';\n/** @hidden */\nexport var CLS_FULL_SCREEN = 'e-rte-full-screen';\n/** @hidden */\nexport var CLS_QUICK_TB = 'e-rte-quick-toolbar';\n/** @hidden */\nexport var CLS_POP = 'e-rte-pop';\n/** @hidden */\nexport var CLS_QUICK_POP = 'e-rte-quick-popup';\n/** @hidden */\nexport var CLS_QUICK_DROPDOWN = 'e-quick-dropdown';\n/** @hidden */\nexport var CLS_IMAGE_POP = 'e-rte-image-popup';\n/** @hidden */\nexport var CLS_INLINE_POP = 'e-rte-inline-popup';\n/** @hidden */\nexport var CLS_INLINE_DROPDOWN = 'e-rte-inline-dropdown';\n/** @hidden */\nexport var CLS_DROPDOWN_POPUP = 'e-rte-dropdown-popup';\n/** @hidden */\nexport var CLS_DROPDOWN_ICONS = 'e-rte-dropdown-icons';\n/** @hidden */\nexport var CLS_DROPDOWN_ITEMS = 'e-rte-dropdown-items';\n/** @hidden */\nexport var CLS_DROPDOWN_BTN = 'e-rte-dropdown-btn';\n/** @hidden */\nexport var CLS_RTE_CONTENT = 'e-rte-content';\n/** @hidden */\nexport var CLS_TB_ITEM = 'e-toolbar-item';\n/** @hidden */\nexport var CLS_TB_EXTENDED = 'e-toolbar-extended';\n/** @hidden */\nexport var CLS_TB_WRAP = 'e-toolbar-wrapper';\n/** @hidden */\nexport var CLS_POPUP = 'e-popup';\n/** @hidden */\nexport var CLS_SEPARATOR = 'e-separator';\n/** @hidden */\nexport var CLS_MINIMIZE = 'e-minimize';\n/** @hidden */\nexport var CLS_MAXIMIZE = 'e-maximize';\n/** @hidden */\nexport var CLS_BACK = 'e-back';\n/** @hidden */\nexport var CLS_SHOW = 'e-show';\n/** @hidden */\nexport var CLS_HIDE = 'e-hide';\n/** @hidden */\nexport var CLS_VISIBLE = 'e-visible';\n/** @hidden */\nexport var CLS_FOCUS = 'e-focused';\n/** @hidden */\nexport var CLS_RM_WHITE_SPACE = 'e-remove-white-space';\n/** @hidden */\nexport var CLS_IMGRIGHT = 'e-imgright';\n/** @hidden */\nexport var CLS_IMGLEFT = 'e-imgleft';\n/** @hidden */\nexport var CLS_IMGCENTER = 'e-imgcenter';\n/** @hidden */\nexport var CLS_IMGBREAK = 'e-imgbreak';\n/** @hidden */\nexport var CLS_CAPTION = 'e-img-caption';\n/** @hidden */\nexport var CLS_CAPINLINE = 'e-caption-inline';\n/** @hidden */\nexport var CLS_IMGINLINE = 'e-imginline';\n/** @hidden */\nexport var CLS_COUNT = 'e-rte-character-count';\n/** @hidden */\nexport var CLS_WARNING = 'e-warning';\n/** @hidden */\nexport var CLS_ERROR = 'e-error';\n/** @hidden */\nexport var CLS_ICONS = 'e-icons';\n/** @hidden */\nexport var CLS_ACTIVE = 'e-active';\n/** @hidden */\nexport var CLS_EXPAND_OPEN = 'e-expand-open';\n/** @hidden */\nexport var CLS_RTE_ELEMENTS = 'e-rte-elements';\n/** @hidden */\nexport var CLS_TB_BTN = 'e-tbar-btn';\n/** @hidden */\nexport var CLS_HR_SEPARATOR = 'e-rte-horizontal-separator';\n/** @hidden */\nexport var CLS_TB_IOS_FIX = 'e-tbar-ios-fixed';\n/** @hidden */\nexport var CLS_TB_STATIC = 'e-tb-static';\n/** @hidden */\nexport var CLS_FORMATS_TB_BTN = 'e-formats-tbar-btn';\n/** @hidden */\nexport var CLS_FONT_NAME_TB_BTN = 'e-font-name-tbar-btn';\n/** @hidden */\nexport var CLS_FONT_SIZE_TB_BTN = 'e-font-size-tbar-btn';\n/** @hidden */\nexport var CLS_FONT_COLOR_TARGET = 'e-rte-fontcolor-element';\n/** @hidden */\nexport var CLS_BACKGROUND_COLOR_TARGET = 'e-rte-backgroundcolor-element';\n/** @hidden */\nexport var CLS_COLOR_CONTENT = 'e-rte-color-content';\n/** @hidden */\nexport var CLS_FONT_COLOR_DROPDOWN = 'e-rte-fontcolor-dropdown';\n/** @hidden */\nexport var CLS_BACKGROUND_COLOR_DROPDOWN = 'e-rte-backgroundcolor-dropdown';\n/** @hidden */\nexport var CLS_COLOR_PALETTE = 'e-rte-square-palette';\n/** @hidden */\nexport var CLS_FONT_COLOR_PICKER = 'e-rte-fontcolor-colorpicker';\n/** @hidden */\nexport var CLS_BACKGROUND_COLOR_PICKER = 'e-rte-backgroundcolor-colorpicker';\n/** @hidden */\nexport var CLS_RTE_READONLY = 'e-rte-readonly';\n/** @hidden */\nexport var CLS_TABLE_SEL = 'e-cell-select';\n/** @hidden */\nexport var CLS_TB_DASH_BOR = 'e-dashed-border';\n/** @hidden */\nexport var CLS_TB_ALT_BOR = 'e-alternate-border';\n/** @hidden */\nexport var CLS_TB_COL_RES = 'e-column-resize';\n/** @hidden */\nexport var CLS_TB_ROW_RES = 'e-row-resize';\n/** @hidden */\nexport var CLS_TB_BOX_RES = 'e-table-box';\n/** @hidden */\nexport var CLS_RTE_HIDDEN = 'e-rte-hidden';\n/** @hidden */\nexport var CLS_RTE_PASTE_KEEP_FORMAT = 'e-rte-keepformat';\n/** @hidden */\nexport var CLS_RTE_PASTE_REMOVE_FORMAT = 'e-rte-removeformat';\n/** @hidden */\nexport var CLS_RTE_PASTE_PLAIN_FORMAT = 'e-rte-plainformat';\n/** @hidden */\nexport var CLS_RTE_PASTE_OK = 'e-rte-pasteok';\n/** @hidden */\nexport var CLS_RTE_PASTE_CANCEL = 'e-rte-pastecancel';\n/** @hidden */\nexport var CLS_RTE_DIALOG_MIN_HEIGHT = 'e-rte-dialog-minheight';\n","/**\n * Defines types of Render\n * @hidden\n */\nexport var RenderType;\n(function (RenderType) {\n /** Defines RenderType as Toolbar */\n RenderType[RenderType[\"Toolbar\"] = 0] = \"Toolbar\";\n /** Defines RenderType as Content */\n RenderType[RenderType[\"Content\"] = 1] = \"Content\";\n /** Defines RenderType as Content */\n RenderType[RenderType[\"Popup\"] = 2] = \"Popup\";\n /** Defines RenderType as LinkToolbar */\n RenderType[RenderType[\"LinkToolbar\"] = 3] = \"LinkToolbar\";\n /** Defines RenderType as TextToolbar */\n RenderType[RenderType[\"TextToolbar\"] = 4] = \"TextToolbar\";\n /** Defines RenderType as ImageToolbar */\n RenderType[RenderType[\"ImageToolbar\"] = 5] = \"ImageToolbar\";\n /** Defines RenderType as ImageToolbar */\n RenderType[RenderType[\"InlineToolbar\"] = 6] = \"InlineToolbar\";\n RenderType[RenderType[\"TableToolbar\"] = 7] = \"TableToolbar\";\n})(RenderType || (RenderType = {}));\nexport var ToolbarType;\n(function (ToolbarType) {\n /** Defines ToolbarType as Standard */\n ToolbarType[\"Expand\"] = \"Expand\";\n /** Defines ToolbarType as MultiRow */\n ToolbarType[\"MultiRow\"] = \"MultiRow\";\n})(ToolbarType || (ToolbarType = {}));\n","// tslint:disable\n/**\n * Export default locale\n */\nexport var defaultLocale = {\n 'alignments': 'Alignments',\n 'justifyLeft': 'Align Left',\n 'justifyCenter': 'Align Center',\n 'justifyRight': 'Align Right',\n 'justifyFull': 'Align Justify',\n 'fontName': 'Font Name',\n 'fontSize': 'Font Size',\n 'fontColor': 'Font Color',\n 'backgroundColor': 'Background Color',\n 'bold': 'Bold',\n 'italic': 'Italic',\n 'underline': 'Underline',\n 'strikethrough': 'Strikethrough',\n 'clearFormat': 'Clear Format',\n 'clearAll': 'Clear All',\n 'cut': 'Cut',\n 'copy': 'Copy',\n 'paste': 'Paste',\n 'unorderedList': 'Bulleted List',\n 'orderedList': 'Numbered List',\n 'indent': 'Increase Indent',\n 'outdent': 'Decrease Indent',\n 'undo': 'Undo',\n 'redo': 'Redo',\n 'superscript': 'Superscript',\n 'subscript': 'Subscript',\n 'createLink': 'Insert Hyperlink',\n 'openLink': 'Open Link',\n 'editLink': 'Edit Link',\n 'removeLink': 'Remove Link',\n 'image': 'Insert Image',\n 'replace': 'Replace',\n 'align': 'Align',\n 'caption': 'Image Caption',\n 'remove': 'Remove',\n 'insertLink': 'Insert Link',\n 'display': 'Display',\n 'altText': 'Alternative Text',\n 'dimension': 'Change Size',\n 'fullscreen': 'Maximize',\n 'maximize': 'Maximize',\n 'minimize': 'Minimize',\n 'lowerCase': 'Lower Case',\n 'upperCase': 'Upper Case',\n 'print': 'Print',\n 'formats': 'Formats',\n 'sourcecode': 'Code View',\n 'preview': 'Preview',\n 'viewside': 'ViewSide',\n 'insertCode': 'Insert Code',\n 'linkText': 'Display Text',\n 'linkTooltipLabel': 'Title',\n 'linkWebUrl': 'Web Address',\n 'linkTitle': 'Enter a title',\n 'linkurl': 'http://example.com',\n 'linkOpenInNewWindow': 'Open Link in New Window',\n 'linkHeader': 'Insert Link',\n 'dialogInsert': 'Insert',\n 'dialogCancel': 'Cancel',\n 'dialogUpdate': 'Update',\n 'imageHeader': 'Insert Image',\n 'imageLinkHeader': 'You can also provide a link from the web',\n 'mdimageLink': 'Please provide a URL for your image',\n 'imageUploadMessage': 'Drop image here or browse to upload',\n 'imageDeviceUploadMessage': 'Click here to upload',\n 'imageAlternateText': 'Alternate Text',\n 'alternateHeader': 'Alternative Text',\n 'browse': 'Browse',\n 'imageUrl': 'http://example.com/image.png',\n 'imageCaption': 'Caption',\n 'imageSizeHeader': 'Image Size',\n 'imageHeight': 'Height',\n 'imageWidth': 'Width',\n 'textPlaceholder': 'Enter Text',\n 'inserttablebtn': 'Insert Table',\n 'tabledialogHeader': 'Insert Table',\n 'tableWidth': 'Width',\n 'cellpadding': 'Cell Padding',\n 'cellspacing': 'Cell Spacing',\n 'columns': 'Number of columns',\n 'rows': 'Number of rows',\n 'tableRows': 'Table Rows',\n 'tableColumns': 'Table Columns',\n 'tableCellHorizontalAlign': 'Table Cell Horizontal Align',\n 'tableCellVerticalAlign': 'Table Cell Vertical Align',\n 'createTable': 'Create Table',\n 'removeTable': 'Remove Table',\n 'tableHeader': 'Table Header',\n 'tableRemove': 'Table Remove',\n 'tableCellBackground': 'Table Cell Background',\n 'tableEditProperties': 'Table Edit Properties',\n 'styles': 'Styles',\n 'insertColumnLeft': 'Insert Column Left',\n 'insertColumnRight': 'Insert Column Right',\n 'deleteColumn': 'Delete Column',\n 'insertRowBefore': 'Insert Row Before',\n 'insertRowAfter': 'Insert Row After',\n 'deleteRow': 'Delete Row',\n 'tableEditHeader': 'Edit Table',\n 'TableHeadingText': 'Heading',\n 'TableColText': 'Col',\n 'imageInsertLinkHeader': 'Insert Link',\n 'editImageHeader': 'Edit Image',\n \"alignmentsDropDownLeft\": 'Align Left',\n \"alignmentsDropDownCenter\": 'Align Center',\n \"alignmentsDropDownRight\": 'Align Right',\n \"alignmentsDropDownJustify\": 'Align Justify',\n \"imageDisplayDropDownInline\": 'Inline',\n \"imageDisplayDropDownBreak\": 'Break',\n \"tableInsertRowDropDownBefore\": 'Insert row before',\n \"tableInsertRowDropDownAfter\": 'Insert row after',\n \"tableInsertRowDropDownDelete\": 'Delete row',\n \"tableInsertColumnDropDownLeft\": 'Insert column left',\n \"tableInsertColumnDropDownRight\": 'Insert column right',\n \"tableInsertColumnDropDownDelete\": 'Delete column',\n \"tableVerticalAlignDropDownTop\": 'Align Top',\n \"tableVerticalAlignDropDownMiddle\": 'Align Middle',\n \"tableVerticalAlignDropDownBottom\": 'Align Bottom',\n \"tableStylesDropDownDashedBorder\": 'Dashed Borders',\n \"tableStylesDropDownAlternateRows\": 'Alternate Rows',\n 'pasteFormat': 'Paste Format',\n 'pasteFormatContent': 'Choose the formatting action',\n 'plainText': 'Plain Text',\n 'cleanFormat': 'Clean',\n 'keepFormat': 'Keep'\n};\nexport var toolsLocale = {\n 'alignments': 'alignments',\n 'justifyleft': 'justifyLeft',\n 'justifycenter': 'justifyCenter',\n 'justifyright': 'justifyRight',\n 'justifyfull': 'justifyFull',\n 'fontname': 'fontName',\n 'fontsize': 'fontSize',\n 'fontcolor': 'fontColor',\n 'backgroundcolor': 'backgroundColor',\n 'bold': 'bold',\n 'italic': 'italic',\n 'underline': 'underline',\n 'strikethrough': 'strikethrough',\n 'clearformat': 'clearFormat',\n 'clearall': 'clearAll',\n 'cut': 'cut',\n 'copy': 'copy',\n 'paste': 'paste',\n 'unorderedlist': 'unorderedList',\n 'orderedlist': 'orderedList',\n 'indent': 'indent',\n 'outdent': 'outdent',\n 'undo': 'undo',\n 'redo': 'redo',\n 'superscript': 'superscript',\n 'subscript': 'subscript',\n 'createlink': 'createLink',\n 'openlink': 'openLink',\n 'editlink': 'editLink',\n 'removelink': 'removeLink',\n 'openimagelink': 'openLink',\n 'editimagelink': 'editLink',\n 'removeimagelink': 'removeLink',\n 'image': 'image',\n 'replace': 'replace',\n 'align': 'align',\n 'caption': 'caption',\n 'remove': 'remove',\n 'insertlink': 'insertLink',\n 'display': 'display',\n 'alttext': 'altText',\n 'dimension': 'dimension',\n 'fullscreen': 'fullscreen',\n 'maximize': 'maximize',\n 'minimize': 'minimize',\n 'lowercase': 'lowerCase',\n 'uppercase': 'upperCase',\n 'print': 'print',\n 'formats': 'formats',\n 'sourcecode': 'sourcecode',\n 'preview': 'preview',\n 'viewside': 'viewside',\n 'insertcode': 'insertCode',\n 'tablerows': 'tableRows',\n 'tablecolumns': 'tableColumns',\n 'tablecellhorizontalalign': 'tableCellHorizontalAlign',\n 'tablecellverticalalign': 'tableCellVerticalAlign',\n 'createtable': 'createTable',\n 'removetable': 'removeTable',\n 'tableheader': 'tableHeader',\n 'tableremove': 'tableRemove',\n 'tablecellbackground': 'tableCellBackground',\n 'tableeditproperties': 'tableEditProperties',\n 'styles': 'styles',\n 'insertcolumnleft': 'insertColumnLeft',\n 'insertcolumnright': 'insertColumnRight',\n 'deletecolumn': 'deleteColumn',\n 'aligntop': 'AlignTop',\n 'alignmiddle': 'AlignMiddle',\n 'alignbottom': 'AlignBottom',\n 'insertrowbefore': 'insertRowBefore',\n 'insertrowafter': 'insertRowAfter',\n 'deleterow': 'deleteRow'\n};\n","import { addClass, Browser, removeClass, EventHandler, formatUnit, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { getInstance, closest, selectAll } from '@syncfusion/ej2-base';\nimport { Toolbar } from '@syncfusion/ej2-navigations';\nimport { DropDownButton } from '@syncfusion/ej2-splitbuttons';\nimport { Popup } from '@syncfusion/ej2-popups';\nimport * as classes from '../base/classes';\nimport * as events from '../base/constant';\nimport { CLS_TOOLBAR, CLS_DROPDOWN_BTN, CLS_RTE_ELEMENTS, CLS_TB_BTN, CLS_INLINE_DROPDOWN, CLS_COLOR_CONTENT, CLS_FONT_COLOR_DROPDOWN, CLS_BACKGROUND_COLOR_DROPDOWN, CLS_COLOR_PALETTE, CLS_FONT_COLOR_PICKER, CLS_BACKGROUND_COLOR_PICKER } from '../base/classes';\nimport { isIDevice } from '../base/util';\nimport { ColorPicker } from '@syncfusion/ej2-inputs';\n/**\n * `Toolbar renderer` module is used to render toolbar in RichTextEditor.\n * @hidden\n */\nvar ToolbarRenderer = /** @class */ (function () {\n /**\n * Constructor for toolbar renderer module\n */\n function ToolbarRenderer(parent) {\n this.parent = parent;\n this.wireEvent();\n }\n ToolbarRenderer.prototype.wireEvent = function () {\n this.parent.on(events.destroy, this.unWireEvent, this);\n };\n ToolbarRenderer.prototype.unWireEvent = function () {\n this.parent.off(events.destroy, this.unWireEvent);\n if (this.popupOverlay) {\n EventHandler.remove(this.popupOverlay, 'click touchmove', this.onPopupOverlay);\n }\n };\n ToolbarRenderer.prototype.toolbarBeforeCreate = function (e) {\n if (this.mode === 'Extended') {\n e.enableCollision = false;\n }\n };\n ToolbarRenderer.prototype.toolbarCreated = function () {\n this.parent.notify(events.toolbarCreated, this);\n };\n ToolbarRenderer.prototype.toolbarClicked = function (args) {\n if (this.parent.readonly || !this.parent.enabled) {\n return;\n }\n this.parent.notify(events.toolbarClick, args);\n this.parent.trigger('toolbarClick', args);\n };\n ToolbarRenderer.prototype.dropDownSelected = function (args) {\n this.parent.notify(events.dropDownSelect, args);\n this.onPopupOverlay();\n };\n ToolbarRenderer.prototype.beforeDropDownItemRender = function (args) {\n if (this.parent.readonly || !this.parent.enabled) {\n return;\n }\n this.parent.notify(events.beforeDropDownItemRender, args);\n };\n ToolbarRenderer.prototype.dropDownOpen = function (args) {\n if (Browser.isDevice && !args.element.parentElement.classList.contains(classes.CLS_QUICK_DROPDOWN)) {\n this.popupModal(args.element.parentElement);\n }\n this.parent.notify(events.selectionSave, args);\n };\n ToolbarRenderer.prototype.dropDownClose = function (args) {\n this.parent.notify(events.selectionRestore, args);\n };\n ToolbarRenderer.prototype.renderToolbar = function (args) {\n this.setPanel(args.target);\n this.renderPanel();\n this.mode = args.overflowMode;\n args.rteToolbarObj.toolbarObj = new Toolbar({\n items: args.items,\n width: '100%',\n overflowMode: args.overflowMode,\n beforeCreate: this.toolbarBeforeCreate.bind(this),\n created: this.toolbarCreated.bind(this),\n clicked: this.toolbarClicked.bind(this),\n enablePersistence: args.enablePersistence,\n enableRtl: args.enableRtl\n });\n args.rteToolbarObj.toolbarObj.createElement = this.parent.createElement;\n args.rteToolbarObj.toolbarObj.appendTo(args.target);\n };\n ToolbarRenderer.prototype.renderDropDownButton = function (args) {\n var _this = this;\n var css;\n args.element.classList.add(CLS_DROPDOWN_BTN);\n css = args.cssClass + ' ' + CLS_RTE_ELEMENTS + ' ' + CLS_TB_BTN;\n if (this.parent.inlineMode.enable && Browser.isDevice) {\n css = css + ' ' + CLS_INLINE_DROPDOWN;\n }\n var proxy = this;\n var dropDown = new DropDownButton({\n items: args.items,\n iconCss: args.iconCss,\n cssClass: css,\n content: args.content,\n enablePersistence: this.parent.enablePersistence,\n enableRtl: this.parent.enableRtl,\n select: this.dropDownSelected.bind(this),\n beforeOpen: function (args) {\n if (proxy.parent.readonly || !proxy.parent.enabled) {\n args.cancel = true;\n return;\n }\n for (var index = 0; index < args.element.childNodes.length; index++) {\n var divNode = _this.parent.createElement('div');\n divNode.innerHTML = dropDown.content.trim();\n if (divNode.textContent.trim() !== ''\n && args.element.childNodes[index].textContent.trim() === divNode.textContent.trim()) {\n if (!args.element.childNodes[index].classList.contains('e-active')) {\n addClass([args.element.childNodes[index]], 'e-active');\n }\n }\n else {\n removeClass([args.element.childNodes[index]], 'e-active');\n }\n }\n proxy.parent.notify(events.beforeDropDownOpen, args);\n },\n close: this.dropDownClose.bind(this),\n open: this.dropDownOpen.bind(this),\n beforeItemRender: this.beforeDropDownItemRender.bind(this)\n });\n dropDown.createElement = proxy.parent.createElement;\n dropDown.appendTo(args.element);\n args.element.tabIndex = -1;\n var popupElement = document.getElementById(dropDown.element.id + '-popup');\n popupElement.setAttribute('aria-owns', this.parent.getID());\n return dropDown;\n };\n ToolbarRenderer.prototype.onPopupOverlay = function (args) {\n if (!isNullOrUndefined(this.popupOverlay)) {\n closest(this.popupOverlay, '.e-popup-container').style.display = 'none';\n this.popupOverlay.style.display = 'none';\n removeClass([this.popupOverlay], 'e-popup-overlay');\n }\n };\n ToolbarRenderer.prototype.setIsModel = function (element) {\n if (!closest(element, '.e-popup-container')) {\n var popupContainer = this.parent.createElement('div', {\n className: 'e-rte-modal-popup e-popup-container e-center'\n });\n element.parentNode.insertBefore(popupContainer, element);\n popupContainer.appendChild(element);\n popupContainer.style.zIndex = element.style.zIndex;\n popupContainer.style.display = 'flex';\n element.style.position = 'relative';\n addClass([element], 'e-popup-modal');\n this.popupOverlay = this.parent.createElement('div', { className: 'e-popup-overlay' });\n this.popupOverlay.style.zIndex = (parseInt(element.style.zIndex, null) - 1).toString();\n this.popupOverlay.style.display = 'block';\n popupContainer.appendChild(this.popupOverlay);\n EventHandler.add(this.popupOverlay, 'click touchmove', this.onPopupOverlay, this);\n }\n else {\n element.parentElement.style.display = 'flex';\n this.popupOverlay = element.nextElementSibling;\n this.popupOverlay.style.display = 'block';\n addClass([this.popupOverlay], 'e-popup-overlay');\n }\n };\n ToolbarRenderer.prototype.paletteSelection = function (dropDownArgs, currentElement) {\n var ele = dropDownArgs.element.querySelector('.e-control.e-colorpicker');\n var colorbox = [].slice.call(selectAll('.e-tile', ele.parentElement));\n removeClass(colorbox, 'e-selected');\n var style = currentElement.querySelector('.' + CLS_RTE_ELEMENTS).style.borderBottomColor;\n (colorbox.filter(function (colorbox) {\n if (colorbox.style.backgroundColor === style) {\n addClass([colorbox], 'e-selected');\n }\n }));\n };\n ToolbarRenderer.prototype.renderColorPickerDropDown = function (args, item, colorPicker) {\n var _this = this;\n var proxy = this;\n var css = CLS_RTE_ELEMENTS + ' ' + CLS_TB_BTN + ((this.parent.inlineMode) ? (' ' + CLS_INLINE_DROPDOWN) : '');\n css += (' ' + ((item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_DROPDOWN : CLS_FONT_COLOR_DROPDOWN));\n var content = proxy.parent.createElement('span', { className: CLS_COLOR_CONTENT });\n var inlineEle = proxy.parent.createElement('span', { className: args.cssClass });\n var range;\n inlineEle.style.borderBottomColor = (item === 'backgroundcolor') ?\n proxy.parent.backgroundColor.default : proxy.parent.fontColor.default;\n content.appendChild(inlineEle);\n var dropDown = new DropDownButton({\n target: colorPicker.element.parentElement,\n cssClass: css,\n enablePersistence: this.parent.enablePersistence,\n enableRtl: this.parent.enableRtl,\n beforeOpen: function (dropDownArgs) {\n if (proxy.parent.readonly || !proxy.parent.enabled) {\n dropDownArgs.cancel = true;\n return;\n }\n var element = (dropDownArgs.event) ? dropDownArgs.event.target : null;\n proxy.currentElement = dropDown.element;\n proxy.currentDropdown = dropDown;\n proxy.paletteSelection(dropDownArgs, proxy.currentElement);\n if (dropDownArgs.event && dropDownArgs.event.type === 'click' && (element.classList.contains(CLS_COLOR_CONTENT)\n || element.parentElement.classList.contains(CLS_COLOR_CONTENT))) {\n dropDownArgs.cancel = true;\n var colorpickerValue = element.classList.contains(CLS_RTE_ELEMENTS) ? element.style.borderBottomColor :\n element.querySelector('.' + CLS_RTE_ELEMENTS).style.borderBottomColor;\n range = proxy.parent.formatter.editorManager.nodeSelection.getRange(proxy.parent.contentModule.getDocument());\n if ((range.startContainer.nodeName === 'TD' || range.startContainer.nodeName === 'TH' ||\n closest(range.startContainer.parentNode, 'td,th')) && range.collapsed) {\n proxy.parent.notify(events.tableColorPickerChanged, { item: { command: args.command, subCommand: args.subCommand,\n value: colorpickerValue }\n });\n }\n else {\n proxy.parent.notify(events.colorPickerChanged, { item: { command: args.command, subCommand: args.subCommand,\n value: colorpickerValue }\n });\n }\n return;\n }\n else {\n var ele = dropDownArgs.element.querySelector('.e-control.e-colorpicker');\n var inst = getInstance(ele, ColorPicker);\n inst.showButtons = (dropDownArgs.element.querySelector('.e-color-palette')) ? false : true;\n inst.dataBind();\n }\n dropDownArgs.element.onclick = function (args) {\n if (args.target.classList.contains('e-cancel')) {\n dropDown.toggle();\n }\n };\n },\n open: function (dropDownArgs) {\n _this.setColorPickerContentWidth(colorPicker);\n var ele = dropDownArgs.element.querySelector('.e-control.e-colorpicker');\n var focusEle;\n if (dropDownArgs.element.querySelector('.e-color-palette')) {\n focusEle = ele.parentElement.querySelector('.e-palette');\n }\n else {\n focusEle = ele.parentElement.querySelector('e-handler');\n }\n if (focusEle) {\n focusEle.focus();\n }\n if (Browser.isDevice) {\n _this.popupModal(dropDownArgs.element.parentElement);\n }\n },\n beforeClose: function (dropDownArgs) {\n var element = (dropDownArgs.event) ? dropDownArgs.event.target : null;\n if (dropDownArgs.event && dropDownArgs.event.type === 'click' && (element.classList.contains(CLS_COLOR_CONTENT)\n || element.parentElement.classList.contains(CLS_COLOR_CONTENT))) {\n var colorpickerValue = element.classList.contains(CLS_RTE_ELEMENTS) ? element.style.borderBottomColor :\n element.querySelector('.' + CLS_RTE_ELEMENTS).style.borderBottomColor;\n /* tslint:enable */\n range = proxy.parent.formatter.editorManager.nodeSelection.getRange(proxy.parent.contentModule.getDocument());\n if ((range.startContainer.nodeName === 'TD' || range.startContainer.nodeName === 'TH' ||\n closest(range.startContainer.parentNode, 'td,th')) && range.collapsed) {\n proxy.parent.notify(events.tableColorPickerChanged, { item: { command: args.command, subCommand: args.subCommand,\n value: colorpickerValue }\n });\n }\n else {\n proxy.parent.notify(events.colorPickerChanged, { item: { command: args.command, subCommand: args.subCommand,\n value: colorpickerValue }\n });\n }\n return;\n }\n },\n close: function (dropDownArgs) {\n proxy.parent.notify(events.selectionRestore, {});\n var dropElement = closest(dropDownArgs.element.parentElement, '.e-popup-container');\n if (dropElement) {\n dropElement.style.display = 'none';\n dropElement.lastElementChild.style.display = 'none';\n removeClass([dropElement.lastElementChild], 'e-popup-overlay');\n }\n }\n });\n dropDown.createElement = proxy.parent.createElement;\n dropDown.appendTo(args.element);\n var popupElement = document.getElementById(dropDown.element.id + '-popup');\n popupElement.setAttribute('aria-owns', this.parent.getID());\n dropDown.element.insertBefore(content, dropDown.element.querySelector('.e-caret'));\n args.element.tabIndex = -1;\n dropDown.element.removeAttribute('type');\n dropDown.element.onmousedown = function () { proxy.parent.notify(events.selectionSave, {}); };\n return dropDown;\n };\n ToolbarRenderer.prototype.popupModal = function (element) {\n var popupInst = getInstance(element, Popup);\n popupInst.relateTo = document.body;\n popupInst.position = { X: 0, Y: 0 };\n popupInst.targetType = 'container';\n popupInst.collision = { X: 'fit', Y: 'fit' };\n popupInst.offsetY = 4;\n popupInst.dataBind();\n this.setIsModel(element);\n };\n ToolbarRenderer.prototype.setColorPickerContentWidth = function (colorPicker) {\n var colorPickerContent = colorPicker.element.nextSibling;\n if (colorPickerContent.style.width === '0px') {\n colorPickerContent.style.width = '';\n var borderWidth = parseInt(getComputedStyle(colorPickerContent).borderBottomWidth, 10);\n colorPickerContent.style.width = formatUnit(colorPickerContent.children[0].offsetWidth\n + borderWidth + borderWidth);\n }\n };\n ToolbarRenderer.prototype.renderColorPicker = function (args, item) {\n var _this = this;\n var proxy = this;\n this.colorPicker = new ColorPicker({\n enablePersistence: this.parent.enablePersistence,\n enableRtl: this.parent.enableRtl,\n inline: true,\n created: function () {\n var value = (item === 'backgroundcolor') ? proxy.parent.backgroundColor.default : proxy.parent.fontColor.default;\n _this.colorPicker.setProperties({ value: value });\n },\n mode: ((item === 'backgroundcolor') ? proxy.parent.backgroundColor.mode : proxy.parent.fontColor.mode),\n modeSwitcher: ((item === 'backgroundcolor') ? proxy.parent.backgroundColor.modeSwitcher : proxy.parent.fontColor.modeSwitcher),\n beforeTileRender: function (args) {\n args.element.classList.add(CLS_COLOR_PALETTE);\n },\n change: function (colorPickerArgs) {\n /* tslint:disable */\n var colorpickerValue = Browser.info.name === 'msie' || Browser.info.name === 'edge' || isIDevice() ? colorPickerArgs.currentValue.rgba : colorPickerArgs.currentValue.hex;\n /* tslint:enable */\n colorPickerArgs.item = {\n command: args.command,\n subCommand: args.subCommand,\n value: colorpickerValue\n };\n proxy.currentElement.querySelector('.' + CLS_RTE_ELEMENTS).style.borderBottomColor = colorpickerValue;\n var range = proxy.parent.formatter.editorManager.nodeSelection.getRange(proxy.parent.contentModule.getDocument());\n if ((range.startContainer.nodeName === 'TD' || range.startContainer.nodeName === 'TH' ||\n closest(range.startContainer.parentNode, 'td,th')) && range.collapsed) {\n proxy.parent.notify(events.tableColorPickerChanged, colorPickerArgs);\n }\n else {\n proxy.parent.notify(events.colorPickerChanged, colorPickerArgs);\n }\n proxy.currentDropdown.toggle();\n },\n beforeModeSwitch: function (args) {\n _this.colorPicker.showButtons = args.mode === 'Palette' ? false : true;\n }\n });\n this.colorPicker.columns = (item === 'backgroundcolor') ? this.parent.backgroundColor.columns : this.parent.fontColor.columns;\n this.colorPicker.presetColors = (item === 'backgroundcolor') ? this.parent.backgroundColor.colorCode :\n this.parent.fontColor.colorCode;\n this.colorPicker.cssClass = (item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_PICKER : CLS_FONT_COLOR_PICKER;\n this.colorPicker.createElement = this.parent.createElement;\n this.colorPicker.appendTo(document.body.querySelector(args.target));\n return this.colorPicker;\n };\n /**\n * The function is used to render RichTextEditor toolbar\n */\n ToolbarRenderer.prototype.renderPanel = function () {\n this.getPanel().classList.add(CLS_TOOLBAR);\n };\n /**\n * Get the toolbar element of RichTextEditor\n * @return {Element}\n */\n ToolbarRenderer.prototype.getPanel = function () {\n return this.toolbarPanel;\n };\n /**\n * Set the toolbar element of RichTextEditor\n * @param {Element} panel\n */\n ToolbarRenderer.prototype.setPanel = function (panel) {\n this.toolbarPanel = panel;\n };\n return ToolbarRenderer;\n}());\nexport { ToolbarRenderer };\n","import { RenderType } from '../base/enum';\nimport { CLS_HR_SEPARATOR } from '../base/classes';\nimport * as events from '../base/constant';\nimport { getTooltipText, toObjectLowerCase } from '../base/util';\nimport { tools, templateItems } from '../models/items';\nimport { isNullOrUndefined, extend } from '@syncfusion/ej2-base';\n/**\n * `Toolbar` module is used to handle Toolbar actions.\n */\nvar BaseToolbar = /** @class */ (function () {\n function BaseToolbar(parent, serviceLocator) {\n this.tools = {};\n this.parent = parent;\n this.locator = serviceLocator;\n this.renderFactory = this.locator.getService('rendererFactory');\n this.addEventListener();\n if (this.parent.toolbarSettings && Object.keys(this.parent.toolbarSettings.itemConfigs).length > 0) {\n extend(this.tools, tools, toObjectLowerCase(this.parent.toolbarSettings.itemConfigs), true);\n }\n else {\n this.tools = tools;\n }\n }\n BaseToolbar.prototype.addEventListener = function () {\n this.parent.on(events.rtlMode, this.setRtl, this);\n this.parent.on(events.destroy, this.removeEventListener, this);\n };\n BaseToolbar.prototype.removeEventListener = function () {\n this.parent.off(events.rtlMode, this.setRtl);\n this.parent.off(events.destroy, this.removeEventListener);\n };\n BaseToolbar.prototype.setRtl = function (args) {\n if (!isNullOrUndefined(this.toolbarObj)) {\n this.toolbarObj.setProperties({ enableRtl: args.enableRtl });\n }\n };\n BaseToolbar.prototype.getTemplateObject = function (itemStr, container) {\n var tagName;\n switch (itemStr) {\n case 'fontcolor':\n case 'backgroundcolor':\n tagName = 'span';\n break;\n default:\n tagName = 'button';\n break;\n }\n return {\n command: this.tools[itemStr.toLocaleLowerCase()].command,\n subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand,\n template: this.parent.createElement(tagName, {\n id: this.parent.getID() + '_' + container\n + '_' + this.tools[itemStr.toLocaleLowerCase()].id\n }).outerHTML,\n tooltipText: getTooltipText(itemStr, this.locator)\n };\n };\n BaseToolbar.prototype.getObject = function (item, container) {\n var itemStr = item.toLowerCase();\n if (templateItems.indexOf(itemStr) !== -1) {\n return this.getTemplateObject(itemStr, container);\n }\n else {\n switch (itemStr) {\n case '|':\n return { type: 'Separator' };\n case '-':\n return { type: 'Separator', cssClass: CLS_HR_SEPARATOR };\n default:\n return {\n id: this.parent.getID() + '_' + container + '_' + this.tools[itemStr.toLocaleLowerCase()].id,\n prefixIcon: this.tools[itemStr.toLocaleLowerCase()].icon,\n tooltipText: getTooltipText(itemStr, this.locator),\n command: this.tools[itemStr.toLocaleLowerCase()].command,\n subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand\n };\n }\n }\n };\n /**\n * @hidden\n */\n BaseToolbar.prototype.getItems = function (tbItems, container) {\n if (this.parent.toolbarSettings.items.length < 1) {\n return [];\n }\n var items = [];\n for (var _i = 0, tbItems_1 = tbItems; _i < tbItems_1.length; _i++) {\n var item = tbItems_1[_i];\n switch (typeof item) {\n case 'string':\n items.push(this.getObject(item, container));\n break;\n default:\n items.push(item);\n }\n }\n return items;\n };\n BaseToolbar.prototype.getToolbarOptions = function (args) {\n return {\n target: args.target,\n rteToolbarObj: this,\n items: this.getItems(args.items, args.container),\n overflowMode: args.mode,\n enablePersistence: this.parent.enablePersistence,\n enableRtl: this.parent.enableRtl\n };\n };\n BaseToolbar.prototype.render = function (args) {\n this.toolbarRenderer = this.renderFactory.getRenderer(RenderType.Toolbar);\n this.toolbarRenderer.renderToolbar(this.getToolbarOptions(args));\n };\n return BaseToolbar;\n}());\nexport { BaseToolbar };\n","import { addClass, isNullOrUndefined, removeClass, select, closest } from '@syncfusion/ej2-base';\nimport { RenderType } from '../base/enum';\nimport { getIndex } from '../base/util';\nimport * as events from '../base/constant';\nimport * as classes from '../base/classes';\nimport { getDropDownValue, getFormattedFontSize, getTooltipText } from '../base/util';\nimport * as model from '../models/items';\nimport { dispatchEvent } from '../base/util';\n/**\n * `Toolbar` module is used to handle Toolbar actions.\n */\nvar DropDownButtons = /** @class */ (function () {\n function DropDownButtons(parent, serviceLocator) {\n this.parent = parent;\n this.locator = serviceLocator;\n this.renderFactory = this.locator.getService('rendererFactory');\n this.addEventListener();\n }\n DropDownButtons.prototype.initializeInstance = function () {\n this.toolbarRenderer = this.renderFactory.getRenderer(RenderType.Toolbar);\n };\n DropDownButtons.prototype.beforeRender = function (args) {\n var item = args.item;\n if (item.cssClass) {\n addClass([args.element], item.cssClass);\n }\n if (item.command === 'Alignments' || item.subCommand === 'JustifyLeft'\n || item.subCommand === 'JustifyRight' || item.subCommand === 'JustifyCenter') {\n args.element.setAttribute('title', getTooltipText(item.subCommand.toLocaleLowerCase(), this.locator));\n }\n };\n DropDownButtons.prototype.dropdownContent = function (width, type, content) {\n return ('' +\n '' + content + '');\n };\n DropDownButtons.prototype.renderDropDowns = function (args) {\n var _this = this;\n this.initializeInstance();\n var type = args.containerType;\n var tbElement = args.container;\n model.templateItems.forEach(function (item) {\n var targetElement = undefined;\n if (getIndex(item, args.items) !== -1) {\n switch (item) {\n case 'formats':\n targetElement = select('#' + _this.parent.getID() + '_' + type + '_Formats', tbElement);\n if (isNullOrUndefined(targetElement) || targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n var formatItem = _this.parent.format.types.slice();\n formatItem.forEach(function (item) {\n Object.defineProperties(item, {\n command: { value: 'Formats', enumerable: true }, subCommand: { value: item.value, enumerable: true }\n });\n });\n var formatContent = isNullOrUndefined(_this.parent.format.default) ? formatItem[0].text :\n _this.parent.format.default;\n _this.formatDropDown = _this.toolbarRenderer.renderDropDownButton({\n iconCss: ((type === 'quick') ? 'e-formats e-icons' : ''),\n content: _this.dropdownContent(_this.parent.format.width, type, ((type === 'quick') ? '' : getDropDownValue(formatItem, formatContent, 'text', 'text'))),\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_FORMATS_TB_BTN,\n itemName: 'Formats', items: formatItem, element: targetElement\n });\n break;\n case 'fontname':\n targetElement = select('#' + _this.parent.getID() + '_' + type + '_FontName', tbElement);\n if (isNullOrUndefined(targetElement) || targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n var fontItem = _this.parent.fontFamily.items.slice();\n fontItem.forEach(function (item) {\n Object.defineProperties(item, {\n command: { value: 'Font', enumerable: true }, subCommand: { value: 'FontName', enumerable: true }\n });\n });\n var fontNameContent = isNullOrUndefined(_this.parent.fontFamily.default) ? fontItem[0].text :\n _this.parent.fontFamily.default;\n _this.fontNameDropDown = _this.toolbarRenderer.renderDropDownButton({\n iconCss: ((type === 'quick') ? 'e-font-name e-icons' : ''),\n content: _this.dropdownContent(_this.parent.fontFamily.width, type, ((type === 'quick') ? '' : getDropDownValue(fontItem, fontNameContent, 'text', 'text'))),\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_FONT_NAME_TB_BTN,\n itemName: 'FontName', items: fontItem, element: targetElement\n });\n if (!isNullOrUndefined(_this.parent.fontFamily.default)) {\n _this.getEditNode().style.fontFamily = _this.parent.fontFamily.default;\n }\n break;\n case 'fontsize':\n targetElement = select('#' + _this.parent.getID() + '_' + type + '_FontSize', tbElement);\n if (isNullOrUndefined(targetElement) || targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n var fontsize = _this.parent.fontSize.items.slice();\n fontsize.forEach(function (item) {\n Object.defineProperties(item, {\n command: { value: 'Font', enumerable: true }, subCommand: { value: 'FontSize', enumerable: true }\n });\n });\n var fontSizeContent = isNullOrUndefined(_this.parent.fontSize.default) ? fontsize[1].text :\n _this.parent.fontSize.default;\n _this.fontSizeDropDown = _this.toolbarRenderer.renderDropDownButton({\n content: _this.dropdownContent(_this.parent.fontSize.width, type, getFormattedFontSize(getDropDownValue(fontsize, fontSizeContent.replace(/\\s/g, ''), 'value', 'text'))),\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_FONT_SIZE_TB_BTN,\n itemName: 'FontSize', items: fontsize, element: targetElement\n });\n if (!isNullOrUndefined(_this.parent.fontSize.default)) {\n _this.getEditNode().style.fontSize = _this.parent.fontSize.default;\n }\n break;\n case 'alignments':\n targetElement = select('#' + _this.parent.getID() + '_' + type + '_Alignments', tbElement);\n if (isNullOrUndefined(targetElement) || targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n _this.alignDropDown = _this.toolbarRenderer.renderDropDownButton({\n iconCss: 'e-justify-left e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS,\n itemName: 'Alignments', items: model.alignmentItems, element: targetElement\n });\n break;\n case 'align':\n _this.imageAlignmentDropDown(type, tbElement, targetElement);\n break;\n case 'display':\n _this.imageDisplayDropDown(type, tbElement, targetElement);\n break;\n case 'tablerows':\n _this.rowDropDown(type, tbElement, targetElement);\n break;\n case 'tablecolumns':\n _this.columnDropDown(type, tbElement, targetElement);\n break;\n case 'tablecellverticalalign':\n _this.verticalAlignDropDown(type, tbElement, targetElement);\n break;\n case 'styles':\n _this.tableStylesDropDown(type, tbElement, targetElement);\n break;\n }\n }\n });\n };\n DropDownButtons.prototype.getUpdateItems = function (items, value) {\n var dropDownItems = items.slice();\n dropDownItems.forEach(function (item) {\n Object.defineProperties(item, {\n command: { value: (value === 'Format' ? 'Formats' : 'Font'), enumerable: true },\n subCommand: { value: (value === 'Format' ? item.value : value), enumerable: true }\n });\n });\n return dropDownItems;\n };\n DropDownButtons.prototype.onPropertyChanged = function (model) {\n var newProp = model.newProp;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'fontFamily':\n if (this.fontNameDropDown) {\n for (var _b = 0, _c = Object.keys(newProp.fontFamily); _b < _c.length; _b++) {\n var fontFamily = _c[_b];\n switch (fontFamily) {\n case 'default':\n case 'width':\n var fontItems = this.fontNameDropDown.items;\n var type = !isNullOrUndefined(closest(this.fontNameDropDown.element, '.' + classes.CLS_QUICK_TB)) ?\n 'quick' : 'toolbar';\n var fontNameContent = isNullOrUndefined(this.parent.fontFamily.default) ? fontItems[0].text :\n this.parent.fontFamily.default;\n var content = this.dropdownContent(this.parent.fontFamily.width, type, ((type === 'quick') ? '' :\n getDropDownValue(fontItems, fontNameContent, 'text', 'text')));\n this.fontNameDropDown.setProperties({ content: content });\n if (!isNullOrUndefined(this.parent.fontFamily.default)) {\n this.getEditNode().style.fontFamily = this.parent.fontFamily.default;\n }\n else {\n this.getEditNode().style.removeProperty('font-family');\n }\n break;\n case 'items':\n this.fontNameDropDown.setProperties({\n items: this.getUpdateItems(newProp.fontFamily.items, 'FontSize')\n });\n break;\n }\n }\n }\n break;\n case 'fontSize':\n if (this.fontSizeDropDown) {\n for (var _d = 0, _e = Object.keys(newProp.fontSize); _d < _e.length; _d++) {\n var fontSize = _e[_d];\n switch (fontSize) {\n case 'default':\n case 'width':\n var fontsize = this.fontSizeDropDown.items;\n var type = !isNullOrUndefined(closest(this.fontSizeDropDown.element, '.' + classes.CLS_QUICK_TB)) ? 'quick' : 'toolbar';\n var fontSizeContent = isNullOrUndefined(this.parent.fontSize.default) ? fontsize[1].text :\n this.parent.fontSize.default;\n var content = this.dropdownContent(this.parent.fontSize.width, type, getFormattedFontSize(getDropDownValue(fontsize, fontSizeContent.replace(/\\s/g, ''), 'value', 'text')));\n this.fontSizeDropDown.setProperties({ content: content });\n if (!isNullOrUndefined(this.parent.fontSize.default)) {\n this.getEditNode().style.fontSize = this.parent.fontSize.default;\n }\n else {\n this.getEditNode().style.removeProperty('font-size');\n }\n break;\n case 'items':\n this.fontSizeDropDown.setProperties({\n items: this.getUpdateItems(newProp.fontSize.items, 'FontSize')\n });\n break;\n }\n }\n }\n break;\n case 'format':\n if (this.formatDropDown) {\n for (var _f = 0, _g = Object.keys(newProp.format); _f < _g.length; _f++) {\n var format = _g[_f];\n switch (format) {\n case 'default':\n case 'width':\n var formatItems = this.formatDropDown.items;\n var type = !isNullOrUndefined(closest(this.formatDropDown.element, '.' + classes.CLS_QUICK_TB)) ? 'quick' : 'toolbar';\n var formatContent = isNullOrUndefined(this.parent.format.default) ? formatItems[0].text :\n this.parent.format.default;\n var content = this.dropdownContent(this.parent.format.width, type, ((type === 'quick') ? '' :\n getDropDownValue(formatItems, formatContent, 'text', 'text')));\n this.formatDropDown.setProperties({ content: content });\n break;\n case 'types':\n this.formatDropDown.setProperties({\n items: this.getUpdateItems(newProp.format.types, 'Format')\n });\n break;\n }\n }\n }\n break;\n }\n }\n };\n DropDownButtons.prototype.getEditNode = function () {\n return this.parent.contentModule.getEditPanel();\n };\n DropDownButtons.prototype.rowDropDown = function (type, tbElement, targetElement) {\n targetElement = select('#' + this.parent.getID() + '_' + type + '_TableRows', tbElement);\n if (targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n this.tableRowsDropDown = this.toolbarRenderer.renderDropDownButton({\n iconCss: 'e-table-rows e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_QUICK_DROPDOWN,\n itemName: 'TableRows',\n items: model.tableRowsItems,\n element: targetElement\n });\n };\n DropDownButtons.prototype.columnDropDown = function (type, tbElement, targetElement) {\n targetElement = select('#' + this.parent.getID() + '_' + type + '_TableColumns', tbElement);\n if (targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n this.tableColumnsDropDown = this.toolbarRenderer.renderDropDownButton({\n iconCss: 'e-table-columns e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_QUICK_DROPDOWN,\n itemName: 'TableColumns',\n items: model.tableColumnsItems,\n element: targetElement\n });\n };\n DropDownButtons.prototype.verticalAlignDropDown = function (type, tbElement, targetElement) {\n targetElement = select('#' + this.parent.getID() + '_' + type + '_TableCellVerticalAlign', tbElement);\n if (targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n this.tableCellVerticalAlignDropDown = this.toolbarRenderer.renderDropDownButton({\n iconCss: 'e-table-cell-ver-align e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_QUICK_DROPDOWN,\n itemName: 'TableCellVerticalAlign',\n items: model.TableCellVerticalAlignItems,\n element: targetElement\n });\n };\n DropDownButtons.prototype.imageDisplayDropDown = function (type, tbElement, targetElement) {\n targetElement = select('#' + this.parent.getID() + '_' + type + '_Display', tbElement);\n if (targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n this.displayDropDown = this.toolbarRenderer.renderDropDownButton({\n iconCss: 'e-display e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_QUICK_DROPDOWN,\n itemName: 'Display',\n items: model.imageDisplayItems,\n element: targetElement\n });\n };\n DropDownButtons.prototype.imageAlignmentDropDown = function (type, tbElement, targetElement) {\n targetElement = select('#' + this.parent.getID() + '_' + type + '_Align', tbElement);\n if (targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n this.imageAlignDropDown = this.toolbarRenderer.renderDropDownButton({\n iconCss: 'e-justify-left e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ICONS + ' ' + classes.CLS_QUICK_DROPDOWN,\n itemName: 'Align',\n items: model.imageAlignItems,\n element: targetElement\n });\n };\n DropDownButtons.prototype.tableStylesDropDown = function (type, tbElement, targetElement) {\n targetElement = select('#' + this.parent.getID() + '_' + type + '_Styles', tbElement);\n if (targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n this.imageAlignDropDown = this.toolbarRenderer.renderDropDownButton({\n iconCss: 'e-style e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ICONS + ' ' + classes.CLS_QUICK_DROPDOWN,\n itemName: 'Styles',\n items: this.parent.tableSettings.styles,\n element: targetElement\n });\n };\n DropDownButtons.prototype.removeDropDownClasses = function (target) {\n removeClass([target], [\n classes.CLS_DROPDOWN_BTN,\n classes.CLS_DROPDOWN_POPUP,\n classes.CLS_DROPDOWN_ICONS,\n classes.CLS_DROPDOWN_ITEMS\n ]);\n };\n DropDownButtons.prototype.destroyDropDowns = function () {\n if (this.formatDropDown) {\n this.removeDropDownClasses(this.formatDropDown.element);\n this.formatDropDown.destroy();\n }\n if (this.fontNameDropDown) {\n this.removeDropDownClasses(this.fontNameDropDown.element);\n this.fontNameDropDown.destroy();\n }\n if (this.fontSizeDropDown) {\n this.removeDropDownClasses(this.fontSizeDropDown.element);\n this.fontSizeDropDown.destroy();\n }\n if (this.alignDropDown) {\n this.removeDropDownClasses(this.alignDropDown.element);\n this.alignDropDown.destroy();\n }\n if (this.imageAlignDropDown) {\n this.removeDropDownClasses(this.imageAlignDropDown.element);\n this.imageAlignDropDown.destroy();\n }\n if (this.displayDropDown) {\n this.removeDropDownClasses(this.displayDropDown.element);\n this.displayDropDown.destroy();\n }\n if (this.tableRowsDropDown) {\n this.removeDropDownClasses(this.tableRowsDropDown.element);\n this.tableRowsDropDown.destroy();\n }\n if (this.tableColumnsDropDown) {\n this.removeDropDownClasses(this.tableColumnsDropDown.element);\n this.tableColumnsDropDown.destroy();\n }\n if (this.tableCellVerticalAlignDropDown) {\n this.removeDropDownClasses(this.tableCellVerticalAlignDropDown.element);\n this.tableCellVerticalAlignDropDown.destroy();\n }\n };\n DropDownButtons.prototype.setRtl = function (args) {\n if (this.formatDropDown) {\n this.formatDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.fontNameDropDown) {\n this.fontNameDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.fontSizeDropDown) {\n this.fontSizeDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.alignDropDown) {\n this.alignDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.imageAlignDropDown) {\n this.imageAlignDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.displayDropDown) {\n this.displayDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n };\n DropDownButtons.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.beforeDropDownItemRender, this.beforeRender, this);\n this.parent.on(events.iframeMouseDown, this.onIframeMouseDown, this);\n this.parent.on(events.rtlMode, this.setRtl, this);\n this.parent.on(events.destroy, this.removeEventListener, this);\n this.parent.on(events.modelChanged, this.onPropertyChanged, this);\n };\n DropDownButtons.prototype.onIframeMouseDown = function () {\n dispatchEvent(document, 'mousedown');\n };\n DropDownButtons.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.iframeMouseDown, this.onIframeMouseDown);\n this.parent.off(events.rtlMode, this.setRtl);\n this.parent.off(events.beforeDropDownItemRender, this.beforeRender);\n this.parent.off(events.destroy, this.removeEventListener);\n this.parent.off(events.modelChanged, this.onPropertyChanged);\n };\n return DropDownButtons;\n}());\nexport { DropDownButtons };\n","import { isNullOrUndefined } from '@syncfusion/ej2-base';\n/**\n * ServiceLocator\n * @hidden\n */\nvar ServiceLocator = /** @class */ (function () {\n function ServiceLocator() {\n this.services = {};\n }\n ServiceLocator.prototype.register = function (name, type) {\n if (isNullOrUndefined(this.services[name])) {\n this.services[name] = type;\n }\n };\n ServiceLocator.prototype.getService = function (name) {\n if (isNullOrUndefined(this.services[name])) {\n throw \"The service \" + name + \" is not registered\";\n }\n return this.services[name];\n };\n return ServiceLocator;\n}());\nexport { ServiceLocator };\n","import { isNullOrUndefined, getEnumValue } from '@syncfusion/ej2-base';\nimport { RenderType } from '../base/enum';\n/**\n * RendererFactory\n * @hidden\n */\nvar RendererFactory = /** @class */ (function () {\n function RendererFactory() {\n this.rendererMap = {};\n }\n RendererFactory.prototype.addRenderer = function (name, type) {\n var rName = getEnumValue(RenderType, name);\n if (isNullOrUndefined(this.rendererMap[rName])) {\n this.rendererMap[rName] = type;\n }\n };\n RendererFactory.prototype.getRenderer = function (name) {\n var rName = getEnumValue(RenderType, name);\n if (isNullOrUndefined(this.rendererMap[rName])) {\n throw \"The renderer \" + rName + \" is not found\";\n }\n else {\n return this.rendererMap[rName];\n }\n };\n return RendererFactory;\n}());\nexport { RendererFactory };\n","import { isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';\nimport * as events from '../base/constant';\nimport { ServiceLocator } from '../services/service-locator';\nimport { RendererFactory } from '../services/renderer-factory';\n/**\n * `ToolbarAction` module is used to toolbar click action\n */\nvar ToolbarAction = /** @class */ (function () {\n function ToolbarAction(parent) {\n this.parent = parent;\n this.addEventListener();\n this.serviceLocator = new ServiceLocator;\n this.serviceLocator.register('rendererFactory', new RendererFactory);\n }\n ToolbarAction.prototype.addEventListener = function () {\n this.parent.on(events.toolbarClick, this.toolbarClick, this);\n this.parent.on(events.dropDownSelect, this.dropDownSelect, this);\n this.parent.on(events.colorPickerChanged, this.renderSelection, this);\n this.parent.on(events.destroy, this.removeEventListener, this);\n };\n ToolbarAction.prototype.toolbarClick = function (args) {\n if (isNOU(args.item)) {\n return;\n }\n if (!isNOU(args.item.controlParent)) {\n var activeEle = args.item.controlParent\n .activeEle;\n if (activeEle) {\n activeEle.tabIndex = -1;\n }\n }\n this.parent.notify(events.htmlToolbarClick, args);\n this.parent.notify(events.markdownToolbarClick, args);\n };\n ToolbarAction.prototype.dropDownSelect = function (e) {\n this.parent.notify(events.selectionRestore, {});\n if (!(document.body.contains(document.body.querySelector('.e-rte-quick-toolbar'))\n && e.item && (e.item.command === 'Images' || e.item.command === 'Display' || e.item.command === 'Table'))) {\n this.parent.formatter.process(this.parent, e, e.originalEvent, null);\n }\n this.parent.notify(events.selectionSave, {});\n };\n ToolbarAction.prototype.renderSelection = function (args) {\n this.parent.notify(events.selectionRestore, {});\n this.parent.formatter.process(this.parent, args, args.originalEvent, null);\n this.parent.notify(events.selectionSave, {});\n };\n ToolbarAction.prototype.removeEventListener = function () {\n this.parent.off(events.toolbarClick, this.toolbarClick);\n this.parent.off(events.dropDownSelect, this.dropDownSelect);\n this.parent.off(events.colorPickerChanged, this.renderSelection);\n this.parent.off(events.destroy, this.removeEventListener);\n };\n return ToolbarAction;\n}());\nexport { ToolbarAction };\n","import { addClass, Browser, EventHandler, detach, removeClass, select, selectAll, KeyboardEvents } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined as isNOU, closest, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { setStyleAttribute, extend } from '@syncfusion/ej2-base';\nimport * as events from '../base/constant';\nimport * as classes from '../base/classes';\nimport { RenderType, ToolbarType } from '../base/enum';\nimport { setToolbarStatus, updateUndoRedoStatus, getTBarItemsIndex, getCollection, toObjectLowerCase } from '../base/util';\nimport * as model from '../models/items';\nimport { ToolbarRenderer } from '../renderer/toolbar-renderer';\nimport { BaseToolbar } from './base-toolbar';\nimport { DropDownButtons } from './dropdown-buttons';\nimport { ToolbarAction } from './toolbar-action';\n/**\n * `Toolbar` module is used to handle Toolbar actions.\n */\nvar Toolbar = /** @class */ (function () {\n function Toolbar(parent, serviceLocator) {\n this.parent = parent;\n this.isToolbar = false;\n this.locator = serviceLocator;\n this.isTransformChild = false;\n this.renderFactory = this.locator.getService('rendererFactory');\n model.updateDropDownLocale(this.parent);\n this.renderFactory.addRenderer(RenderType.Toolbar, new ToolbarRenderer(this.parent));\n this.toolbarRenderer = this.renderFactory.getRenderer(RenderType.Toolbar);\n this.baseToolbar = new BaseToolbar(this.parent, this.locator);\n this.addEventListener();\n if (this.parent.toolbarSettings && Object.keys(this.parent.toolbarSettings.itemConfigs).length > 0) {\n extend(this.tools, model.tools, toObjectLowerCase(this.parent.toolbarSettings.itemConfigs), true);\n }\n else {\n this.tools = model.tools;\n }\n }\n Toolbar.prototype.initializeInstance = function () {\n this.contentRenderer = this.renderFactory.getRenderer(RenderType.Content);\n this.editableElement = this.contentRenderer.getEditPanel();\n this.editPanel = this.contentRenderer.getPanel();\n };\n Toolbar.prototype.toolbarBindEvent = function () {\n if (!this.parent.inlineMode.enable) {\n this.keyBoardModule = new KeyboardEvents(this.getToolbarElement(), {\n keyAction: this.toolBarKeyDown.bind(this), keyConfigs: this.parent.formatter.keyConfig, eventName: 'keydown'\n });\n }\n };\n Toolbar.prototype.toolBarKeyDown = function (e) {\n switch (e.action) {\n case 'escape':\n this.parent.contentModule.getEditPanel().focus();\n break;\n }\n };\n Toolbar.prototype.createToolbarElement = function () {\n this.tbElement = this.parent.createElement('div', { id: this.parent.getID() + '_toolbar' });\n if (!Browser.isDevice && this.parent.inlineMode.enable) {\n return;\n }\n else {\n if (this.parent.toolbarSettings.enableFloating && !this.parent.inlineMode.enable) {\n this.tbWrapper = this.parent.createElement('div', {\n id: this.parent.getID() + '_toolbar_wrapper',\n innerHTML: this.tbElement.outerHTML,\n className: classes.CLS_TB_WRAP\n });\n this.tbElement = this.tbWrapper.firstElementChild;\n this.parent.element.insertBefore(this.tbWrapper, this.editPanel);\n }\n else {\n this.parent.element.insertBefore(this.tbElement, this.editPanel);\n }\n }\n };\n Toolbar.prototype.getToolbarMode = function () {\n var tbMode;\n switch (this.parent.toolbarSettings.type) {\n case ToolbarType.Expand:\n tbMode = 'Extended';\n break;\n default:\n tbMode = 'MultiRow';\n }\n return tbMode;\n };\n Toolbar.prototype.checkToolbarResponsive = function (ele) {\n if (!Browser.isDevice) {\n return false;\n }\n this.baseToolbar.render({\n container: ((this.parent.inlineMode.enable) ? 'quick' : 'toolbar'),\n items: this.parent.toolbarSettings.items,\n mode: 'MultiRow',\n target: ele\n });\n addClass([ele], ['e-rte-tb-mobile']);\n if (this.parent.inlineMode.enable) {\n this.addFixedTBarClass();\n }\n else {\n addClass([ele], [classes.CLS_TB_STATIC]);\n }\n this.wireEvents();\n this.dropDownModule.renderDropDowns({\n container: ele,\n containerType: ((this.parent.inlineMode.enable) ? 'quick' : 'toolbar'),\n items: this.parent.toolbarSettings.items\n });\n this.parent.notify(events.renderColorPicker, {\n container: this.tbElement,\n containerType: ((this.parent.inlineMode.enable) ? 'quick' : 'toolbar'),\n items: this.parent.toolbarSettings.items\n });\n return true;\n };\n Toolbar.prototype.checkIsTransformChild = function () {\n this.isTransformChild = false;\n var transformElements = selectAll('[style*=\"transform\"]', document);\n for (var i = 0; i < transformElements.length; i++) {\n if (!isNullOrUndefined(transformElements[i].contains) && transformElements[i].contains(this.parent.element)) {\n this.isTransformChild = true;\n break;\n }\n }\n };\n Toolbar.prototype.toggleFloatClass = function (e) {\n var topValue;\n var isBody = false;\n var isFloat = false;\n var scrollParent;\n var floatOffset = this.parent.floatingToolbarOffset;\n if (e && e.target !== document) {\n scrollParent = e.target;\n }\n else {\n isBody = true;\n scrollParent = document.body;\n }\n var tbHeight = this.getToolbarHeight() + this.getExpandTBarPopHeight();\n if (this.isTransformChild) {\n topValue = 0;\n var scrollParentRelativeTop = 0;\n var trgHeight = this.parent.element.offsetHeight;\n if (isBody) {\n var bodyStyle = window.getComputedStyle(scrollParent);\n scrollParentRelativeTop = parseFloat(bodyStyle.marginTop.split('px')[0]) + parseFloat(bodyStyle.paddingTop.split('px')[0]);\n }\n var targetTop = this.parent.element.getBoundingClientRect().top;\n var scrollParentYOffset = (Browser.isMSPointer && isBody) ? window.pageYOffset : scrollParent.parentElement.scrollTop;\n var scrollParentRect = scrollParent.getBoundingClientRect();\n var scrollParentTop = (!isBody) ? scrollParentRect.top : (scrollParentRect.top + scrollParentYOffset);\n var outOfRange = ((targetTop - ((!isBody) ? scrollParentTop : 0)) + trgHeight > tbHeight + floatOffset) ? false : true;\n if (targetTop > (scrollParentTop + floatOffset) || targetTop < -trgHeight || ((targetTop < 0) ? outOfRange : false)) {\n isFloat = false;\n removeClass([this.tbElement], [classes.CLS_TB_ABS_FLOAT]);\n }\n else if (targetTop < (scrollParentTop + floatOffset)) {\n if (targetTop < 0) {\n topValue = (-targetTop) + scrollParentTop;\n }\n else {\n topValue = scrollParentTop - targetTop;\n }\n topValue = (isBody) ? topValue - scrollParentRelativeTop : topValue;\n addClass([this.tbElement], [classes.CLS_TB_ABS_FLOAT]);\n isFloat = true;\n }\n }\n else {\n var parent_1 = this.parent.element.getBoundingClientRect();\n if (window.innerHeight < parent_1.top) {\n return;\n }\n topValue = (e && e.target !== document) ? scrollParent.getBoundingClientRect().top : 0;\n if ((parent_1.bottom < (floatOffset + tbHeight + topValue)) || parent_1.bottom < 0 || parent_1.top > floatOffset + topValue) {\n isFloat = false;\n }\n else if (parent_1.top < floatOffset) {\n isFloat = true;\n }\n }\n if (!isFloat) {\n removeClass([this.tbElement], [classes.CLS_TB_FLOAT]);\n setStyleAttribute(this.tbElement, { top: 0 + 'px', width: '100%' });\n }\n else {\n addClass([this.tbElement], [classes.CLS_TB_FLOAT]);\n setStyleAttribute(this.tbElement, { width: this.parent.element.offsetWidth + 'px', top: (floatOffset + topValue) + 'px' });\n }\n };\n Toolbar.prototype.renderToolbar = function () {\n this.initializeInstance();\n this.createToolbarElement();\n if (this.checkToolbarResponsive(this.tbElement)) {\n return;\n }\n if (this.parent.inlineMode.enable) {\n this.parent.notify(events.renderInlineToolbar, {});\n }\n else {\n this.baseToolbar.render({\n container: 'toolbar',\n items: this.parent.toolbarSettings.items,\n mode: this.getToolbarMode(),\n target: this.tbElement\n });\n if (!this.parent.inlineMode.enable) {\n if (this.parent.toolbarSettings.enableFloating) {\n this.checkIsTransformChild();\n this.toggleFloatClass();\n }\n if (this.parent.toolbarSettings.type === ToolbarType.Expand) {\n addClass([this.parent.element], [classes.CLS_RTE_EXPAND_TB]);\n }\n }\n }\n this.wireEvents();\n if (this.parent.inlineMode.enable) {\n this.addFixedTBarClass();\n }\n if (!this.parent.inlineMode.enable) {\n this.dropDownModule.renderDropDowns({\n container: this.tbElement,\n containerType: 'toolbar',\n items: this.parent.toolbarSettings.items\n });\n this.parent.notify(events.renderColorPicker, {\n container: this.tbElement,\n containerType: 'toolbar',\n items: this.parent.toolbarSettings.items\n });\n this.refreshToolbarOverflow();\n }\n };\n Toolbar.prototype.addFixedTBarClass = function () {\n addClass([this.tbElement], [classes.CLS_TB_FIXED]);\n };\n Toolbar.prototype.removeFixedTBarClass = function () {\n removeClass([this.tbElement], [classes.CLS_TB_FIXED]);\n };\n Toolbar.prototype.showFixedTBar = function () {\n addClass([this.tbElement], [classes.CLS_SHOW]);\n if (Browser.isIos) {\n addClass([this.tbElement], [classes.CLS_TB_IOS_FIX]);\n }\n };\n Toolbar.prototype.hideFixedTBar = function () {\n (!this.isToolbar) ? removeClass([this.tbElement], [classes.CLS_SHOW, classes.CLS_TB_IOS_FIX]) : this.isToolbar = false;\n };\n Toolbar.prototype.updateItem = function (args) {\n var item = this.tools[args.updateItem.toLocaleLowerCase()];\n var trgItem = this.tools[args.targetItem.toLocaleLowerCase()];\n var index = getTBarItemsIndex(getCollection(trgItem.subCommand), args.baseToolbar.toolbarObj.items)[0];\n if (!isNOU(index)) {\n var prefixId = this.parent.inlineMode.enable ? '_quick_' : '_toolbar_';\n args.baseToolbar.toolbarObj.items[index].id = this.parent.getID() + prefixId + item.id;\n args.baseToolbar.toolbarObj.items[index].prefixIcon = item.icon;\n args.baseToolbar.toolbarObj.items[index].tooltipText = item.tooltip;\n args.baseToolbar.toolbarObj.items[index].subCommand = item.subCommand;\n args.baseToolbar.toolbarObj.dataBind();\n }\n else {\n this.addTBarItem(args, 0);\n }\n };\n Toolbar.prototype.updateToolbarStatus = function (args) {\n if (!this.parent.inlineMode.enable) {\n var options = {\n args: args,\n dropDownModule: this.dropDownModule,\n parent: this.parent,\n tbElements: selectAll('.' + classes.CLS_TB_ITEM, this.tbElement),\n tbItems: this.baseToolbar.toolbarObj.items\n };\n if (this.parent.inlineMode.enable) {\n setToolbarStatus(options, true);\n }\n else {\n setToolbarStatus(options, false);\n }\n }\n };\n Toolbar.prototype.fullScreen = function (e) {\n this.parent.fullScreenModule.showFullScreen(e);\n };\n Toolbar.prototype.hideScreen = function (e) {\n this.parent.fullScreenModule.hideFullScreen(e);\n };\n Toolbar.prototype.getBaseToolbar = function () {\n return this.baseToolbar;\n };\n Toolbar.prototype.addTBarItem = function (args, index) {\n args.baseToolbar.toolbarObj.addItems([args.baseToolbar.getObject(args.updateItem, 'toolbar')], index);\n };\n Toolbar.prototype.enableTBarItems = function (baseToolbar, items, isEnable) {\n var trgItems = getTBarItemsIndex(getCollection(items), baseToolbar.toolbarObj.items);\n this.tbItems = selectAll('.' + classes.CLS_TB_ITEM, baseToolbar.toolbarObj.element);\n for (var i = 0; i < trgItems.length; i++) {\n var item = this.tbItems[trgItems[i]];\n if (item) {\n baseToolbar.toolbarObj.enableItems(item, isEnable);\n }\n }\n if (!select('.e-rte-srctextarea', this.parent.element)) {\n updateUndoRedoStatus(baseToolbar, this.parent.formatter.editorManager.undoRedoManager.getUndoStatus());\n }\n };\n Toolbar.prototype.removeTBarItems = function (items) {\n if (isNullOrUndefined(this.baseToolbar.toolbarObj)) {\n this.baseToolbar = this.parent.getBaseToolbarObject();\n }\n var trgItems = getTBarItemsIndex(getCollection(items), this.baseToolbar.toolbarObj.items);\n this.tbItems = (this.parent.inlineMode.enable) ? selectAll('.' + classes.CLS_TB_ITEM, this.baseToolbar.toolbarObj.element)\n : selectAll('.' + classes.CLS_TB_ITEM, this.parent.element);\n for (var i = 0; i < trgItems.length; i++) {\n this.baseToolbar.toolbarObj.removeItems(this.tbItems[trgItems[i]]);\n }\n };\n Toolbar.prototype.getExpandTBarPopHeight = function () {\n var popHeight = 0;\n if (this.parent.toolbarSettings.type === ToolbarType.Expand && this.tbElement.classList.contains('e-extended-toolbar')) {\n var expandPopup = select('.e-toolbar-extended', this.tbElement);\n if (expandPopup && this.tbElement.classList.contains('e-expand-open')\n || expandPopup && expandPopup.classList.contains('e-popup-open')) {\n addClass([expandPopup], [classes.CLS_VISIBLE]);\n popHeight = popHeight + expandPopup.offsetHeight;\n removeClass([expandPopup], [classes.CLS_VISIBLE]);\n }\n else {\n removeClass([this.tbElement], [classes.CLS_EXPAND_OPEN]);\n }\n }\n return popHeight;\n };\n Toolbar.prototype.getToolbarHeight = function () {\n return this.tbElement.offsetHeight;\n };\n Toolbar.prototype.getToolbarElement = function () {\n return select('.' + classes.CLS_TOOLBAR, this.parent.element);\n };\n Toolbar.prototype.refreshToolbarOverflow = function () {\n this.baseToolbar.toolbarObj.refreshOverflow();\n };\n Toolbar.prototype.isToolbarDestroyed = function () {\n return this.baseToolbar.toolbarObj && !this.baseToolbar.toolbarObj.isDestroyed;\n };\n Toolbar.prototype.destroyToolbar = function () {\n if (this.isToolbarDestroyed()) {\n this.parent.unWireScrollElementsEvents();\n this.unWireEvents();\n this.parent.notify(events.destroyColorPicker, {});\n this.dropDownModule.destroyDropDowns();\n this.baseToolbar.toolbarObj.destroy();\n this.removeEventListener();\n removeClass([this.parent.element], [classes.CLS_RTE_EXPAND_TB]);\n var tbWrapper = select('.' + classes.CLS_TB_WRAP, this.parent.element);\n var tbElement = select('.' + classes.CLS_TOOLBAR, this.parent.element);\n if (!isNullOrUndefined(tbWrapper)) {\n detach(tbWrapper);\n }\n else if (!isNullOrUndefined(tbElement)) {\n detach(tbElement);\n }\n }\n };\n /**\n * Destroys the ToolBar.\n * @method destroy\n * @return {void}\n */\n Toolbar.prototype.destroy = function () {\n if (this.isToolbarDestroyed()) {\n this.destroyToolbar();\n if (this.keyBoardModule) {\n this.keyBoardModule.destroy();\n }\n }\n };\n Toolbar.prototype.scrollHandler = function (e) {\n if (!this.parent.inlineMode.enable) {\n if (this.parent.toolbarSettings.enableFloating) {\n this.toggleFloatClass(e.args);\n }\n }\n };\n Toolbar.prototype.mouseDownHandler = function () {\n if (Browser.isDevice && this.parent.inlineMode.enable) {\n this.showFixedTBar();\n }\n };\n Toolbar.prototype.focusChangeHandler = function () {\n if (Browser.isDevice && this.parent.inlineMode.enable) {\n this.isToolbar = false;\n this.hideFixedTBar();\n }\n };\n Toolbar.prototype.dropDownBeforeOpenHandler = function () {\n this.isToolbar = true;\n };\n Toolbar.prototype.toolbarMouseDownHandler = function (e) {\n var trg = closest(e.target, '.e-hor-nav');\n if (trg && this.parent.toolbarSettings.type === ToolbarType.Expand && !isNOU(trg)) {\n if (!trg.classList.contains('e-nav-active')) {\n removeClass([this.tbElement], [classes.CLS_EXPAND_OPEN]);\n this.parent.setContentHeight('toolbar', false);\n }\n else {\n addClass([this.tbElement], [classes.CLS_EXPAND_OPEN]);\n this.parent.setContentHeight('toolbar', true);\n }\n }\n else if (Browser.isDevice || this.parent.inlineMode.enable) {\n this.isToolbar = true;\n }\n if (isNOU(trg) && this.parent.toolbarSettings.type === ToolbarType.Expand) {\n removeClass([this.tbElement], [classes.CLS_EXPAND_OPEN]);\n }\n };\n Toolbar.prototype.wireEvents = function () {\n EventHandler.add(this.tbElement, 'click mousedown', this.toolbarMouseDownHandler, this);\n };\n Toolbar.prototype.unWireEvents = function () {\n EventHandler.remove(this.tbElement, 'click mousedown', this.toolbarMouseDownHandler);\n };\n Toolbar.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.dropDownModule = new DropDownButtons(this.parent, this.locator);\n this.toolbarActionModule = new ToolbarAction(this.parent);\n this.parent.on(events.initialEnd, this.renderToolbar, this);\n this.parent.on(events.scroll, this.scrollHandler, this);\n this.parent.on(events.bindOnEnd, this.toolbarBindEvent, this);\n this.parent.on(events.toolbarUpdated, this.updateToolbarStatus, this);\n this.parent.on(events.modelChanged, this.onPropertyChanged, this);\n this.parent.on(events.refreshBegin, this.onRefresh, this);\n this.parent.on(events.destroy, this.destroy, this);\n this.parent.on(events.enableFullScreen, this.fullScreen, this);\n this.parent.on(events.disableFullScreen, this.hideScreen, this);\n this.parent.on(events.updateToolbarItem, this.updateItem, this);\n this.parent.on(events.beforeDropDownOpen, this.dropDownBeforeOpenHandler, this);\n this.parent.on(events.expandPopupClick, this.parent.setContentHeight, this.parent);\n this.parent.on(events.focusChange, this.focusChangeHandler, this);\n this.parent.on(events.mouseDown, this.mouseDownHandler, this);\n this.parent.on(events.sourceCodeMouseDown, this.mouseDownHandler, this);\n };\n Toolbar.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.initialEnd, this.renderToolbar);\n this.parent.off(events.scroll, this.scrollHandler);\n this.parent.off(events.bindOnEnd, this.toolbarBindEvent);\n this.parent.off(events.toolbarUpdated, this.updateToolbarStatus);\n this.parent.off(events.modelChanged, this.onPropertyChanged);\n this.parent.off(events.destroy, this.destroy);\n this.parent.off(events.enableFullScreen, this.parent.fullScreenModule.showFullScreen);\n this.parent.off(events.disableFullScreen, this.parent.fullScreenModule.hideFullScreen);\n this.parent.off(events.updateToolbarItem, this.updateItem);\n this.parent.off(events.beforeDropDownOpen, this.dropDownBeforeOpenHandler);\n this.parent.off(events.expandPopupClick, this.parent.setContentHeight);\n this.parent.off(events.focusChange, this.focusChangeHandler);\n this.parent.off(events.mouseDown, this.mouseDownHandler);\n this.parent.off(events.sourceCodeMouseDown, this.mouseDownHandler);\n };\n Toolbar.prototype.onRefresh = function () {\n this.refreshToolbarOverflow();\n this.parent.setContentHeight();\n this.parent.formatter.undoRedoRefresh(this.parent);\n };\n /**\n * Called internally if any of the property value changed.\n * @hidden\n */\n Toolbar.prototype.onPropertyChanged = function (e) {\n if (!isNullOrUndefined(e.newProp.inlineMode)) {\n for (var _i = 0, _a = Object.keys(e.newProp.inlineMode); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'enable':\n this.refreshToolbar();\n break;\n }\n }\n }\n if (e.module !== this.getModuleName()) {\n return;\n }\n this.refreshToolbar();\n };\n Toolbar.prototype.refreshToolbar = function () {\n if (isNullOrUndefined(this.baseToolbar.toolbarObj)) {\n this.baseToolbar = this.parent.getBaseToolbarObject();\n }\n var tbWrapper = select('.' + classes.CLS_TB_WRAP, this.parent.element);\n var tbElement = select('.' + classes.CLS_TOOLBAR, this.parent.element);\n if (tbElement || tbWrapper) {\n this.destroyToolbar();\n }\n if (this.parent.toolbarSettings.enable) {\n this.addEventListener();\n this.renderToolbar();\n this.parent.wireScrollElementsEvents();\n if (!select('.e-rte-srctextarea', this.parent.element)) {\n updateUndoRedoStatus(this.baseToolbar, this.parent.formatter.editorManager.undoRedoManager.getUndoStatus());\n }\n }\n };\n /**\n * For internal use only - Get the module name.\n */\n Toolbar.prototype.getModuleName = function () {\n return 'toolbar';\n };\n return Toolbar;\n}());\nexport { Toolbar };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, NotifyPropertyChanges, Event } from '@syncfusion/ej2-base';\nimport { Base } from '@syncfusion/ej2-base';\nvar keyCode = {\n 'backspace': 8,\n 'tab': 9,\n 'enter': 13,\n 'shift': 16,\n 'control': 17,\n 'alt': 18,\n 'pause': 19,\n 'capslock': 20,\n 'space': 32,\n 'escape': 27,\n 'pageup': 33,\n 'pagedown': 34,\n 'end': 35,\n 'home': 36,\n 'leftarrow': 37,\n 'uparrow': 38,\n 'rightarrow': 39,\n 'downarrow': 40,\n 'insert': 45,\n 'delete': 46,\n 'f1': 112,\n 'f2': 113,\n 'f3': 114,\n 'f4': 115,\n 'f5': 116,\n 'f6': 117,\n 'f7': 118,\n 'f8': 119,\n 'f9': 120,\n 'f10': 121,\n 'f11': 122,\n 'f12': 123,\n 'semicolon': 186,\n 'plus': 187,\n 'comma': 188,\n 'minus': 189,\n 'dot': 190,\n 'forwardslash': 191,\n 'graveaccent': 192,\n 'openbracket': 219,\n 'backslash': 220,\n 'closebracket': 221,\n 'singlequote': 222,\n ']': 221,\n '[': 219,\n '=': 187\n};\n/**\n * KeyboardEvents class enables you to bind key action desired key combinations for ex., Ctrl+A, Delete, Alt+Space etc.\n * ```html\n *
' +\n '' +\n '
' +\n '' +\n '
' +\n '' + '' +\n '
' : '';\n var content = '' + '' +\n '
' +\n '' + '
' +\n '' +\n '
' + htmlTextbox;\n var contentElem = parseHtml(content);\n linkContent.appendChild(contentElem);\n var linkTarget = linkContent.querySelector('.e-rte-linkTarget');\n var linkUrl = linkContent.querySelector('.e-rte-linkurl');\n var linkText = linkContent.querySelector('.e-rte-linkText');\n var linkTitle = linkContent.querySelector('.e-rte-linkTitle');\n var linkOpenLabel = this.i10n.getConstant('linkOpenInNewWindow');\n this.checkBoxObj = new CheckBox({ label: linkOpenLabel, checked: true, enableRtl: this.parent.enableRtl });\n this.checkBoxObj.createElement = this.parent.createElement;\n this.checkBoxObj.appendTo(linkTarget);\n selectText = (this.parent.editorMode === 'HTML') ? e.selection.getRange(this.parent.contentModule.getDocument()).toString() :\n e.text;\n var linkInsert = this.i10n.getConstant('dialogInsert');\n var linkCancel = this.i10n.getConstant('dialogCancel');\n var selection = e.selection;\n var selectObj = { selfLink: this, selection: e.selection, selectParent: e.selectParent, args: e.args };\n this.dialogObj = new Dialog({\n header: this.i10n.getConstant('linkHeader'),\n content: linkContent,\n cssClass: CLS_RTE_ELEMENTS,\n enableRtl: this.parent.enableRtl,\n locale: this.parent.locale,\n showCloseIcon: true, closeOnEscape: true, width: (Browser.isDevice) ? '290px' : '310px', height: 'inherit',\n isModal: Browser.isDevice,\n buttons: [{\n click: this.insertlink.bind(selectObj),\n buttonModel: { content: linkInsert, cssClass: 'e-flat e-insertLink', isPrimary: true }\n },\n { click: function (e) { _this.cancelDialog(e); }, buttonModel: { cssClass: 'e-flat', content: linkCancel } }],\n target: (Browser.isDevice) ? document.body : this.parent.element,\n animationSettings: { effect: 'None' },\n close: function (event) {\n _this.parent.isBlur = false;\n if (event && event.event.returnValue) {\n if (_this.parent.editorMode === 'HTML') {\n selection.restore();\n }\n else {\n _this.parent.formatter.editorManager.markdownSelection.restore(_this.parent.contentModule.getEditPanel());\n }\n }\n _this.dialogObj.destroy();\n detach(_this.dialogObj.element);\n _this.dialogObj = null;\n },\n });\n this.dialogObj.createElement = this.parent.createElement;\n this.dialogObj.appendTo(linkDialogEle);\n linkDialogEle.style.maxHeight = 'inherit';\n if (!isNullOrUndefined(inputDetails)) {\n linkUrl.value = inputDetails.url;\n linkText.value = inputDetails.text;\n linkTitle.value = inputDetails.title;\n (inputDetails.target) ? this.checkBoxObj.checked = true : this.checkBoxObj.checked = false;\n this.dialogObj.header = inputDetails.header;\n this.dialogObj.element.querySelector('.e-insertLink').textContent = inputDetails.btnText;\n }\n this.checkUrl(false);\n if ((this.parent.editorMode === 'HTML' && ((!isNullOrUndefined(selectText) && selectText !== '') &&\n (e.selection.range.startOffset === 0) || e.selection.range.startOffset !== e.selection.range.endOffset))\n || e.module === 'Markdown') {\n linkText.value = selectText;\n }\n EventHandler.add(document, 'mousedown', this.onDocumentClick, this);\n if (this.quickToolObj) {\n this.hideLinkQuickToolbar();\n if (this.quickToolObj.inlineQTBar && document.body.contains(this.quickToolObj.inlineQTBar.element)) {\n this.quickToolObj.inlineQTBar.hidePopup();\n }\n }\n };\n Link.prototype.insertlink = function (e) {\n var linkEle = this.selfLink.dialogObj.element;\n var linkUrl = linkEle.querySelector('.e-rte-linkurl').value;\n var linkText = linkEle.querySelector('.e-rte-linkText').value;\n var linkTitle;\n if (this.selfLink.parent.editorMode === 'HTML') {\n linkTitle = linkEle.querySelector('.e-rte-linkTitle').value;\n }\n var target = (this.selfLink.checkBoxObj.checked) ? '_blank' : null;\n if (linkUrl === '') {\n this.selfLink.checkUrl(true);\n return;\n }\n if (!this.selfLink.isUrl(linkUrl)) {\n linkText = (linkText === '') ? linkUrl : linkText;\n linkUrl = 'http://' + linkUrl;\n }\n else {\n this.selfLink.checkUrl(false);\n }\n var proxy = this.selfLink;\n if (proxy.parent.editorMode === 'HTML' && isNullOrUndefined(closest(this.selection.range.startContainer.parentNode, '#' + proxy.parent.contentModule.getPanel().id))) {\n proxy.parent.contentModule.getEditPanel().focus();\n var range = proxy.parent.formatter.editorManager.nodeSelection.getRange(proxy.parent.contentModule.getDocument());\n this.selection = proxy.parent.formatter.editorManager.nodeSelection.save(range, proxy.parent.contentModule.getDocument());\n this.selectParent = proxy.parent.formatter.editorManager.nodeSelection.getParentNodeCollection(range);\n }\n var value = {\n url: linkUrl, text: linkText, title: linkTitle, target: target,\n selection: this.selection, selectParent: this.selectParent\n };\n if (proxy.parent.editorMode === 'HTML') {\n this.selection.restore();\n }\n if (proxy.parent.formatter.getUndoRedoStack().length === 0) {\n proxy.parent.formatter.saveData();\n }\n this.selfLink.parent.formatter.process(this.selfLink.parent, this.args, this.args.originalEvent, value);\n if (document.body.contains(proxy.dialogObj.element)) {\n this.selfLink.dialogObj.hide({ returnValue: false });\n }\n this.selfLink.parent.contentModule.getEditPanel().focus();\n };\n Link.prototype.isUrl = function (url) {\n var regexp = /(ftp|http|https):\\/\\/(\\w+:{0,1}\\w*@)?(\\S+)(:[0-9]+)?(\\/|\\/([\\w#!:.?+=&%@!\\-\\/]))?/gi;\n return regexp.test(url);\n };\n Link.prototype.checkUrl = function (e) {\n var linkEle = this.dialogObj.element;\n var linkUrl = linkEle.querySelector('.e-rte-linkurl');\n if (e) {\n addClass([linkUrl], 'e-error');\n linkUrl.setSelectionRange(0, linkUrl.value.length);\n linkUrl.focus();\n }\n else {\n removeClass([linkUrl], 'e-error');\n }\n };\n Link.prototype.removeLink = function (e) {\n if (this.parent.formatter.getUndoRedoStack().length === 0) {\n this.parent.formatter.saveData();\n }\n this.parent.formatter.process(this.parent, e.args, e.args, {\n selectNode: e.selectNode, selectParent: e.selectParent, selection: e.selection,\n subCommand: e.args.item.subCommand\n });\n this.contentModule.getEditPanel().focus();\n this.hideLinkQuickToolbar();\n };\n Link.prototype.openLink = function (e) {\n var selectParentEle = this.getAnchorNode(e.selectParent[0]);\n if (selectParentEle.classList.contains('e-rte-anchor') || selectParentEle.tagName === 'A') {\n this.parent.formatter.process(this.parent, e.args, e.args, {\n url: selectParentEle.href,\n target: selectParentEle.target === '' ? '_self' : '_blank', selectNode: e.selectNode,\n subCommand: e.args.item.subCommand\n });\n }\n };\n Link.prototype.getAnchorNode = function (element) {\n var selectParent = closest(element, 'a');\n return (selectParent ? selectParent : element);\n };\n Link.prototype.editLink = function (e) {\n var selectParentEle = this.getAnchorNode(e.selectParent[0]);\n if (selectParentEle.classList.contains('e-rte-anchor') || selectParentEle.tagName === 'A') {\n var linkUpdate = this.i10n.getConstant('dialogUpdate');\n var inputDetails = {\n url: selectParentEle.href, text: selectParentEle.innerText,\n title: selectParentEle.title, target: selectParentEle.target,\n header: this.i10n.getConstant('editLink'), btnText: linkUpdate\n };\n this.linkDialog(e, inputDetails);\n }\n };\n Link.prototype.cancelDialog = function (e) {\n this.parent.isBlur = false;\n this.dialogObj.hide({ returnValue: true });\n this.parent.contentModule.getEditPanel().focus();\n };\n Link.prototype.onDocumentClick = function (e) {\n var target = e.target;\n if (!isNullOrUndefined(this.dialogObj) && ((!closest(target, '#' + this.dialogObj.element.id) && this.parent.toolbarSettings.enable &&\n this.parent.getToolbarElement() && !this.parent.getToolbarElement().contains(e.target)) ||\n (this.parent.getToolbarElement() && this.parent.getToolbarElement().contains(e.target) &&\n !closest(target, '#' + this.parent.getID() + '_toolbar_CreateLink') &&\n !target.querySelector('#' + this.parent.getID() + '_toolbar_CreateLink')))) {\n this.dialogObj.hide({ returnValue: true });\n this.parent.isBlur = true;\n dispatchEvent(this.parent.element, 'focusout');\n }\n };\n /**\n * Destroys the ToolBar.\n * @method destroy\n * @return {void}\n */\n Link.prototype.destroy = function () {\n this.removeEventListener();\n };\n /**\n * For internal use only - Get the module name.\n */\n Link.prototype.getModuleName = function () {\n return 'link';\n };\n return Link;\n}());\nexport { Link };\n","import { addClass, detach, EventHandler, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { Browser, closest, removeClass } from '@syncfusion/ej2-base';\nimport * as events from '../base/constant';\nimport * as classes from '../base/classes';\nimport { Uploader, NumericTextBox } from '@syncfusion/ej2-inputs';\nimport { Dialog } from '@syncfusion/ej2-popups';\nimport { Button, CheckBox } from '@syncfusion/ej2-buttons';\nimport { RenderType } from '../base/enum';\nimport { dispatchEvent, parseHtml } from '../base/util';\n/**\n * `Image` module is used to handle image actions.\n */\nvar Image = /** @class */ (function () {\n function Image(parent, serviceLocator) {\n this.pageX = null;\n this.pageY = null;\n this.parent = parent;\n this.rteID = parent.element.id;\n this.i10n = serviceLocator.getService('rteLocale');\n this.rendererFactory = serviceLocator.getService('rendererFactory');\n this.addEventListener();\n }\n Image.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.keyDown, this.onKeyDown, this);\n this.parent.on(events.insertImage, this.insertImage, this);\n this.parent.on(events.insertCompleted, this.showImageQuickToolbar, this);\n this.parent.on(events.imageToolbarAction, this.onToolbarAction, this);\n this.parent.on(events.imageCaption, this.caption, this);\n this.parent.on(events.imageDelete, this.deleteImg, this);\n this.parent.on(events.imageLink, this.insertImgLink, this);\n this.parent.on(events.imageAlt, this.insertAltText, this);\n this.parent.on(events.editAreaClick, this.editAreaClickHandler, this);\n this.parent.on(events.iframeMouseDown, this.onIframeMouseDown, this);\n this.parent.on(events.imageSize, this.imageSize, this);\n this.parent.on(events.dropDownSelect, this.alignmentSelect, this);\n this.parent.on(events.initialEnd, this.afterRender, this);\n this.parent.on(events.paste, this.imagePaste, this);\n this.parent.on(events.destroy, this.removeEventListener, this);\n };\n Image.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.keyDown, this.onKeyDown);\n this.parent.off(events.insertImage, this.insertImage);\n this.parent.off(events.insertCompleted, this.showImageQuickToolbar);\n this.parent.off(events.imageCaption, this.caption);\n this.parent.off(events.imageToolbarAction, this.onToolbarAction);\n this.parent.off(events.imageDelete, this.deleteImg);\n this.parent.off(events.imageLink, this.insertImgLink);\n this.parent.off(events.imageAlt, this.insertAltText);\n this.parent.off(events.editAreaClick, this.editAreaClickHandler);\n this.parent.off(events.iframeMouseDown, this.onIframeMouseDown);\n this.parent.off(events.imageSize, this.imageSize);\n this.parent.off(events.dropDownSelect, this.alignmentSelect);\n this.parent.off(events.initialEnd, this.afterRender);\n this.parent.off(events.paste, this.imagePaste);\n this.parent.off(events.destroy, this.removeEventListener);\n if (!isNullOrUndefined(this.contentModule)) {\n EventHandler.remove(this.contentModule.getEditPanel(), Browser.touchEndEvent, this.imageClick);\n this.parent.formatter.editorManager.observer.off(events.checkUndo, this.undoStack);\n if (this.parent.insertImageSettings.resize) {\n EventHandler.remove(this.parent.contentModule.getEditPanel(), Browser.touchStartEvent, this.resizeStart);\n EventHandler.remove(this.contentModule.getDocument(), 'mousedown', this.onDocumentClick);\n }\n }\n };\n Image.prototype.onIframeMouseDown = function () {\n if (this.dialogObj) {\n this.dialogObj.hide({ returnValue: true });\n }\n };\n Image.prototype.afterRender = function () {\n this.contentModule = this.rendererFactory.getRenderer(RenderType.Content);\n EventHandler.add(this.contentModule.getEditPanel(), Browser.touchEndEvent, this.imageClick, this);\n if (this.parent.insertImageSettings.resize) {\n EventHandler.add(this.parent.contentModule.getEditPanel(), Browser.touchStartEvent, this.resizeStart, this);\n EventHandler.add(this.contentModule.getDocument(), 'mousedown', this.onDocumentClick, this);\n }\n };\n Image.prototype.undoStack = function (args) {\n if (args.subCommand.toLowerCase() === 'undo' || args.subCommand.toLowerCase() === 'redo') {\n for (var i = 0; i < this.parent.formatter.getUndoRedoStack().length; i++) {\n var temp = this.parent.createElement('div');\n var contentElem = parseHtml(this.parent.formatter.getUndoRedoStack()[i].text);\n temp.appendChild(contentElem);\n var img = temp.querySelectorAll('img');\n if (temp.querySelector('.e-img-resize') && img.length > 0) {\n for (var j = 0; j < img.length; j++) {\n img[j].style.outline = '';\n }\n detach(temp.querySelector('.e-img-resize'));\n this.parent.formatter.getUndoRedoStack()[i].text = temp.innerHTML;\n }\n }\n }\n };\n Image.prototype.resizeEnd = function (e) {\n this.resizeBtnInit();\n this.imgEle.parentElement.style.cursor = 'auto';\n if (Browser.isDevice) {\n removeClass([e.target.parentElement], 'e-mob-span');\n }\n var args = { event: e, requestType: 'images' };\n this.parent.trigger(events.resizeStop, args);\n var pageX = this.getPointX(e);\n var pageY = (this.parent.iframeSettings.enable) ? window.pageYOffset +\n this.parent.element.getBoundingClientRect().top + e.clientY : e.pageY;\n this.parent.formatter.editorManager.observer.on(events.checkUndo, this.undoStack, this);\n this.parent.formatter.saveData();\n };\n Image.prototype.resizeStart = function (e) {\n if (e.target.tagName === 'IMG') {\n this.parent.preventDefaultResize(e);\n var img = e.target;\n if (this.imgResizeDiv && this.contentModule.getEditPanel().contains(this.imgResizeDiv)) {\n detach(this.imgResizeDiv);\n }\n this.imageResize(img);\n }\n if (e.target.classList.contains('e-rte-imageboxmark')) {\n if (this.parent.formatter.getUndoRedoStack().length === 0) {\n this.parent.formatter.saveData();\n }\n this.pageX = this.getPointX(e);\n this.pageY = this.getPointY(e);\n e.preventDefault();\n e.stopImmediatePropagation();\n this.resizeBtnInit();\n if (this.quickToolObj) {\n this.quickToolObj.imageQTBar.hidePopup();\n }\n if (e.target.classList.contains('e-rte-topLeft')) {\n this.resizeBtnStat.topLeft = true;\n }\n if (e.target.classList.contains('e-rte-topRight')) {\n this.resizeBtnStat.topRight = true;\n }\n if (e.target.classList.contains('e-rte-botLeft')) {\n this.resizeBtnStat.botLeft = true;\n }\n if (e.target.classList.contains('e-rte-botRight')) {\n this.resizeBtnStat.botRight = true;\n }\n if (Browser.isDevice && this.contentModule.getEditPanel().contains(this.imgResizeDiv) &&\n !this.imgResizeDiv.classList.contains('e-mob-span')) {\n addClass([this.imgResizeDiv], 'e-mob-span');\n }\n else {\n var args = { event: e, requestType: 'images' };\n this.parent.trigger(events.resizeStart, args);\n if (args.cancel) {\n this.cancelResizeAction();\n return;\n }\n }\n EventHandler.add(this.contentModule.getDocument(), Browser.touchEndEvent, this.resizeEnd, this);\n }\n };\n Image.prototype.imageClick = function (e) {\n if (Browser.isDevice) {\n if ((e.target.tagName === 'IMG' &&\n e.target.parentElement.tagName === 'A') ||\n (e.target.tagName === 'IMG')) {\n this.contentModule.getEditPanel().setAttribute('contenteditable', 'false');\n e.target.focus();\n }\n else {\n this.contentModule.getEditPanel().setAttribute('contenteditable', 'true');\n }\n }\n if (e.target.tagName === 'IMG' &&\n e.target.parentElement.tagName === 'A') {\n e.preventDefault();\n }\n };\n Image.prototype.imageResize = function (e) {\n this.resizeBtnInit();\n this.imgEle = e;\n addClass([this.imgEle], 'e-resize');\n this.imgResizeDiv = this.parent.createElement('span', { className: 'e-img-resize', id: this.rteID + '_imgResize' });\n this.imgResizeDiv.appendChild(this.parent.createElement('span', {\n className: 'e-rte-imageboxmark e-rte-topLeft', styles: 'cursor: nwse-resize'\n }));\n this.imgResizeDiv.appendChild(this.parent.createElement('span', {\n className: 'e-rte-imageboxmark e-rte-topRight', styles: 'cursor: nesw-resize'\n }));\n this.imgResizeDiv.appendChild(this.parent.createElement('span', {\n className: 'e-rte-imageboxmark e-rte-botLeft', styles: 'cursor: nesw-resize'\n }));\n this.imgResizeDiv.appendChild(this.parent.createElement('span', {\n className: 'e-rte-imageboxmark e-rte-botRight', styles: 'cursor: nwse-resize'\n }));\n if (Browser.isDevice) {\n addClass([this.imgResizeDiv], 'e-mob-rte');\n }\n e.style.outline = '2px solid #4a90e2';\n this.imgResizePos(e, this.imgResizeDiv);\n this.resizeImgDupPos(e);\n this.contentModule.getEditPanel().appendChild(this.imgResizeDiv);\n EventHandler.add(this.contentModule.getDocument(), Browser.touchMoveEvent, this.resizing, this);\n };\n Image.prototype.getPointX = function (e) {\n if (e.touches && e.touches.length) {\n return e.touches[0].pageX;\n }\n else {\n return e.pageX;\n }\n };\n Image.prototype.getPointY = function (e) {\n if (e.touches && e.touches.length) {\n return e.touches[0].pageY;\n }\n else {\n return e.pageY;\n }\n };\n Image.prototype.imgResizePos = function (e, imgResizeDiv) {\n var pos = this.calcPos(e);\n var top = pos.top;\n var left = pos.left;\n var imgWid = e.width;\n var imgHgt = e.height;\n var borWid = (Browser.isDevice) ? (4 * parseInt((e.style.outline.slice(-3)), 10)) + 2 :\n (2 * parseInt((e.style.outline.slice(-3)), 10)) + 2; //span border width + image outline width\n var devWid = ((Browser.isDevice) ? 0 : 2); // span border width\n imgResizeDiv.querySelector('.e-rte-botLeft').style.left = (left - borWid) + 'px';\n imgResizeDiv.querySelector('.e-rte-botLeft').style.top = ((imgHgt - borWid) + top) + 'px';\n imgResizeDiv.querySelector('.e-rte-botRight').style.left = ((imgWid - (borWid - devWid)) + left) + 'px';\n imgResizeDiv.querySelector('.e-rte-botRight').style.top = ((imgHgt - borWid) + top) + 'px';\n imgResizeDiv.querySelector('.e-rte-topRight').style.left = ((imgWid - (borWid - devWid)) + left) + 'px';\n imgResizeDiv.querySelector('.e-rte-topRight').style.top = (top - (borWid)) + 'px';\n imgResizeDiv.querySelector('.e-rte-topLeft').style.left = (left - borWid) + 'px';\n imgResizeDiv.querySelector('.e-rte-topLeft').style.top = (top - borWid) + 'px';\n };\n Image.prototype.calcPos = function (elem) {\n var ignoreOffset = ['TD', 'TH', 'TABLE'];\n var parentOffset = { top: 0, left: 0 };\n var offset = elem.getBoundingClientRect();\n var doc = elem.ownerDocument;\n var offsetParent = ((elem.offsetParent && (elem.offsetParent.classList.contains('e-img-caption') ||\n ignoreOffset.indexOf(elem.offsetParent.tagName) > -1)) ?\n closest(elem, '#' + this.parent.getID() + '_rte-edit-view') : elem.offsetParent) || doc.documentElement;\n while (offsetParent &&\n (offsetParent === doc.body || offsetParent === doc.documentElement) &&\n offsetParent.style.position === 'static') {\n offsetParent = offsetParent.parentNode;\n }\n if (offsetParent && offsetParent !== elem && offsetParent.nodeType === 1) {\n parentOffset = offsetParent.getBoundingClientRect();\n }\n return {\n top: offset.top - parentOffset.top,\n left: offset.left - parentOffset.left\n };\n };\n Image.prototype.setAspectRatio = function (img, expectedX, expectedY) {\n if (isNullOrUndefined(img.width)) {\n return;\n }\n var width = img.style.width !== '' ? parseInt(img.style.width, 10) : img.width;\n var height = img.style.height !== '' ? parseInt(img.style.height, 10) : img.height;\n if (width > height) {\n if (this.parent.insertImageSettings.resizeByPercent) {\n img.style.width = this.pixToPerc((width / height * expectedY), (img.previousElementSibling || img.parentElement)) + '%';\n img.style.height = null;\n img.removeAttribute('height');\n }\n else if (img.style.width !== '') {\n img.style.width = (width / height * expectedY) + 'px';\n img.style.height = expectedY + 'px';\n }\n else {\n img.setAttribute('width', (width / height * expectedY).toString());\n img.setAttribute('height', expectedY.toString());\n }\n }\n else if (height > width) {\n if (this.parent.insertImageSettings.resizeByPercent) {\n img.style.width = this.pixToPerc(expectedX, (img.previousElementSibling || img.parentElement)) + '%';\n img.style.height = null;\n img.removeAttribute('height');\n }\n else if (img.style.width !== '') {\n img.style.width = expectedX + 'px';\n img.style.height = (height / width * expectedX) + 'px';\n }\n else {\n img.setAttribute('width', expectedX.toString());\n img.setAttribute('height', (height / width * expectedX).toString());\n }\n }\n else {\n if (this.parent.insertImageSettings.resizeByPercent) {\n img.style.width = this.pixToPerc(expectedX, (img.previousElementSibling || img.parentElement)) + '%';\n img.style.height = null;\n img.removeAttribute('height');\n }\n else if (img.style.width !== '') {\n img.style.width = expectedX + 'px';\n img.style.height = expectedX + 'px';\n }\n else {\n img.setAttribute('width', expectedX.toString());\n img.setAttribute('height', expectedX.toString());\n }\n }\n };\n Image.prototype.pixToPerc = function (expected, parentEle) {\n return expected / parseFloat(getComputedStyle(parentEle).width) * 100;\n };\n Image.prototype.imgDupMouseMove = function (width, height, e) {\n var args = { event: e, requestType: 'images' };\n this.parent.trigger(events.onResize, args);\n if (args.cancel) {\n this.cancelResizeAction();\n return;\n }\n if ((parseInt(this.parent.insertImageSettings.minWidth, 10) >= parseInt(width, 10) ||\n parseInt(this.parent.insertImageSettings.maxWidth, 10) <= parseInt(width, 10))) {\n return;\n }\n if (!this.parent.insertImageSettings.resizeByPercent &&\n (parseInt(this.parent.insertImageSettings.minHeight, 10) >= parseInt(height, 10) ||\n parseInt(this.parent.insertImageSettings.maxHeight, 10) <= parseInt(height, 10))) {\n return;\n }\n this.imgEle.parentElement.style.cursor = 'pointer';\n this.setAspectRatio(this.imgEle, parseInt(width, 10), parseInt(height, 10));\n this.resizeImgDupPos(this.imgEle);\n this.imgResizePos(this.imgEle, this.imgResizeDiv);\n this.parent.setContentHeight('', false);\n };\n Image.prototype.resizing = function (e) {\n var pageX = this.getPointX(e);\n var pageY = this.getPointY(e);\n var mouseX = (this.resizeBtnStat.botLeft || this.resizeBtnStat.topLeft) ? -(pageX - this.pageX) : (pageX - this.pageX);\n var mouseY = (this.resizeBtnStat.topLeft || this.resizeBtnStat.topRight) ? -(pageY - this.pageY) : (pageY - this.pageY);\n var width = parseInt(this.imgDupPos.width, 10) + mouseX;\n var height = parseInt(this.imgDupPos.height, 10) + mouseY;\n this.pageX = pageX;\n this.pageY = pageY;\n if (this.resizeBtnStat.botRight) {\n this.imgDupMouseMove(width + 'px', height + 'px', e);\n }\n else if (this.resizeBtnStat.botLeft) {\n this.imgDupMouseMove(width + 'px', height + 'px', e);\n }\n else if (this.resizeBtnStat.topRight) {\n this.imgDupMouseMove(width + 'px', height + 'px', e);\n }\n else if (this.resizeBtnStat.topLeft) {\n this.imgDupMouseMove(width + 'px', height + 'px', e);\n }\n };\n Image.prototype.cancelResizeAction = function () {\n EventHandler.remove(this.contentModule.getDocument(), Browser.touchMoveEvent, this.resizing);\n EventHandler.remove(this.contentModule.getDocument(), Browser.touchEndEvent, this.resizeEnd);\n if (this.imgEle && this.imgResizeDiv && this.contentModule.getEditPanel().contains(this.imgResizeDiv)) {\n detach(this.imgResizeDiv);\n this.imgEle.style.outline = '';\n this.imgResizeDiv = null;\n this.pageX = null;\n this.pageY = null;\n }\n };\n Image.prototype.resizeImgDupPos = function (e) {\n this.imgDupPos = {\n width: (e.style.height !== '') ? this.imgEle.style.width : e.width + 'px',\n height: (e.style.height !== '') ? this.imgEle.style.height : e.height + 'px'\n };\n };\n Image.prototype.resizeBtnInit = function () {\n return this.resizeBtnStat = { botLeft: false, botRight: false, topRight: false, topLeft: false };\n };\n Image.prototype.onToolbarAction = function (args) {\n var item = args.args.item;\n switch (item.subCommand) {\n case 'Replace':\n this.parent.notify(events.insertImage, args);\n break;\n case 'Caption':\n this.parent.notify(events.imageCaption, args);\n break;\n case 'InsertLink':\n this.parent.notify(events.imageLink, args);\n break;\n case 'AltText':\n this.parent.notify(events.imageAlt, args);\n break;\n case 'Remove':\n this.parent.notify(events.imageDelete, args);\n break;\n case 'Dimension':\n this.parent.notify(events.imageSize, args);\n break;\n case 'OpenImageLink':\n this.openImgLink(args);\n break;\n case 'EditImageLink':\n this.editImgLink(args);\n break;\n case 'RemoveImageLink':\n this.removeImgLink(args);\n break;\n }\n };\n Image.prototype.openImgLink = function (e) {\n var target = e.selectParent[0].parentNode.target === '' ? '_self' : '_blank';\n this.parent.formatter.process(this.parent, e.args, e.args, {\n url: e.selectParent[0].parentNode.href, target: target, selectNode: e.selectNode,\n subCommand: e.args.item.subCommand\n });\n };\n Image.prototype.editImgLink = function (e) {\n var selectParentEle = e.selectParent[0].parentNode;\n var linkUpdate = this.i10n.getConstant('dialogUpdate');\n var inputDetails = {\n url: selectParentEle.href, target: selectParentEle.target,\n header: 'Edit Link', btnText: linkUpdate\n };\n this.insertImgLink(e, inputDetails);\n };\n Image.prototype.removeImgLink = function (e) {\n e.selection.restore();\n var insertEle = (this.contentModule.getEditPanel().contains(this.captionEle) && closest(this.captionEle, 'a')) ?\n this.captionEle : e.selectNode[0];\n this.parent.formatter.process(this.parent, e.args, e.args, {\n insertElement: insertEle, selectParent: e.selectParent,\n subCommand: e.args.item.subCommand\n });\n if (this.quickToolObj && document.body.contains(this.quickToolObj.imageQTBar.element)) {\n this.quickToolObj.imageQTBar.hidePopup();\n if (!isNullOrUndefined(e.selectParent)) {\n removeClass([e.selectParent[0]], 'e-img-focus');\n }\n }\n };\n Image.prototype.onKeyDown = function (event) {\n var originalEvent = event.args;\n var range;\n var save;\n var selectNodeEle;\n var selectParentEle;\n if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection)) {\n range = this.parent.formatter.editorManager.nodeSelection.getRange(this.parent.contentModule.getDocument());\n save = this.parent.formatter.editorManager.nodeSelection.save(range, this.parent.contentModule.getDocument());\n selectNodeEle = this.parent.formatter.editorManager.nodeSelection.getNodeCollection(range);\n selectParentEle = this.parent.formatter.editorManager.nodeSelection.getParentNodeCollection(range);\n if (!originalEvent.ctrlKey && originalEvent.key && (originalEvent.key.length === 1 || originalEvent.action === 'enter') &&\n (selectParentEle[0].tagName === 'IMG') && selectParentEle[0].parentElement) {\n var prev = selectParentEle[0].parentElement.childNodes[0];\n if (this.contentModule.getEditPanel().querySelector('.e-img-resize')) {\n this.remvoeResizEle();\n }\n this.parent.formatter.editorManager.nodeSelection.setSelectionText(this.contentModule.getDocument(), prev, prev, prev.textContent.length, prev.textContent.length);\n removeClass([selectParentEle[0]], 'e-img-focus');\n this.quickToolObj.imageQTBar.hidePopup();\n }\n }\n if (originalEvent.ctrlKey && (originalEvent.keyCode === 89 || originalEvent.keyCode === 90)) {\n this.undoStack({ subCommand: (originalEvent.keyCode === 90 ? 'undo' : 'redo') });\n }\n if (originalEvent.keyCode === 8 || originalEvent.keyCode === 46) {\n if (selectNodeEle && selectNodeEle[0].nodeName === 'IMG') {\n originalEvent.preventDefault();\n var event_1 = {\n selectNode: selectNodeEle, selection: save, selectParent: selectParentEle,\n args: {\n item: { command: 'Images', subCommand: 'Remove' },\n originalEvent: originalEvent\n }\n };\n this.deleteImg(event_1);\n }\n if (this.contentModule.getEditPanel().querySelector('.e-img-resize')) {\n this.remvoeResizEle();\n }\n }\n switch (originalEvent.action) {\n case 'escape':\n if (!isNullOrUndefined(this.dialogObj)) {\n this.dialogObj.close();\n }\n break;\n case 'insert-image':\n if (this.parent.editorMode === 'HTML') {\n this.insertImage({\n args: {\n item: { command: 'Images', subCommand: 'Image' },\n originalEvent: originalEvent\n },\n selectNode: selectNodeEle,\n selection: save,\n selectParent: selectParentEle\n });\n }\n else {\n this.insertImage({\n args: {\n item: { command: 'Images', subCommand: 'Image' },\n originalEvent: originalEvent\n },\n member: 'image',\n text: this.parent.formatter.editorManager.markdownSelection.getSelectedText(this.parent.contentModule.getEditPanel()),\n module: 'Markdown',\n name: 'insertImage'\n });\n }\n originalEvent.preventDefault();\n break;\n }\n };\n Image.prototype.alignmentSelect = function (e) {\n var item = e.item;\n if (!document.body.contains(document.body.querySelector('.e-rte-quick-toolbar')) || item.command !== 'Images') {\n return;\n }\n var range = this.parent.formatter.editorManager.nodeSelection.getRange(this.parent.contentModule.getDocument());\n var selectNodeEle = this.parent.formatter.editorManager.nodeSelection.getNodeCollection(range);\n selectNodeEle = (selectNodeEle[0].nodeName === 'IMG') ? selectNodeEle : [this.imgEle];\n var args = { args: e, selectNode: selectNodeEle };\n if (this.parent.formatter.getUndoRedoStack().length === 0) {\n this.parent.formatter.saveData();\n }\n switch (item.subCommand) {\n case 'JustifyLeft':\n this.justifyImageLeft(args);\n break;\n case 'JustifyCenter':\n this.justifyImageCenter(args);\n break;\n case 'JustifyRight':\n this.justifyImageRight(args);\n break;\n case 'Inline':\n this.inline(args);\n break;\n case 'Break':\n this.break(args);\n break;\n }\n if (this.quickToolObj && document.body.contains(this.quickToolObj.imageQTBar.element)) {\n this.quickToolObj.imageQTBar.hidePopup();\n removeClass([selectNodeEle[0]], 'e-img-focus');\n }\n this.cancelResizeAction();\n };\n Image.prototype.imageWithLinkQTBarItemUpdate = function () {\n var separator;\n var items = this.quickToolObj.imageQTBar.toolbarElement.querySelectorAll('.e-toolbar-item');\n for (var i = 0; i < items.length; i++) {\n if (items[i].getAttribute('title') === this.i10n.getConstant('openLink') ||\n items[i].getAttribute('title') === this.i10n.getConstant('editLink') ||\n items[i].getAttribute('title') === this.i10n.getConstant('removeLink')) {\n addClass([items[i]], 'e-link-groups');\n items[i].style.display = 'none';\n }\n else if (items[i].getAttribute('title') === 'Insert Link') {\n items[i].style.display = '';\n }\n else if (items[i].classList.contains('e-rte-horizontal-separator')) {\n separator = items[i];\n detach(items[i]);\n }\n }\n var newItems = this.quickToolObj.imageQTBar.toolbarElement.querySelectorAll('.e-toolbar-item:not(.e-link-groups)');\n this.quickToolObj.imageQTBar.addQTBarItem(['-'], Math.round(newItems.length / 2));\n };\n Image.prototype.showImageQuickToolbar = function (e) {\n var _this = this;\n if (e.type !== 'Images' || isNullOrUndefined(this.parent.quickToolbarModule)\n || isNullOrUndefined(this.parent.quickToolbarModule.imageQTBar)) {\n return;\n }\n this.quickToolObj = this.parent.quickToolbarModule;\n var args = e.args;\n var target;\n [].forEach.call(e.elements, function (element, index) {\n if (index === 0) {\n target = element;\n }\n });\n if (target && !closest(target, 'a')) {\n this.imageWithLinkQTBarItemUpdate();\n }\n if (target.nodeName === 'IMG') {\n addClass([target], ['e-img-focus']);\n }\n var pageY = (this.parent.iframeSettings.enable) ? window.pageYOffset +\n this.parent.element.getBoundingClientRect().top + args.clientY : args.pageY;\n if (this.parent.quickToolbarModule.imageQTBar) {\n if (e.isNotify) {\n setTimeout(function () { _this.quickToolObj.imageQTBar.showPopup(args.pageX, pageY, target); }, 400);\n }\n else {\n this.quickToolObj.imageQTBar.showPopup(args.pageX, pageY, target);\n }\n }\n };\n Image.prototype.hideImageQuickToolbar = function () {\n if (!isNullOrUndefined(this.contentModule.getEditPanel().querySelector('.e-img-focus'))) {\n removeClass([this.contentModule.getEditPanel().querySelector('.e-img-focus')], 'e-img-focus');\n if (this.quickToolObj && this.quickToolObj.imageQTBar && document.body.contains(this.quickToolObj.imageQTBar.element)) {\n this.quickToolObj.imageQTBar.hidePopup();\n }\n }\n };\n Image.prototype.editAreaClickHandler = function (e) {\n var args = e.args;\n if (args.which === 2 || args.which === 3) {\n return;\n }\n if (this.parent.editorMode === 'HTML' && this.parent.quickToolbarModule && this.parent.quickToolbarModule.imageQTBar) {\n this.quickToolObj = this.parent.quickToolbarModule;\n var target = args.target;\n this.contentModule = this.rendererFactory.getRenderer(RenderType.Content);\n var isPopupOpen = this.quickToolObj.imageQTBar.element.classList.contains('e-rte-pop');\n if (target.nodeName === 'IMG' && this.parent.quickToolbarModule) {\n if (isPopupOpen) {\n return;\n }\n this.parent.formatter.editorManager.nodeSelection.Clear(this.contentModule.getDocument());\n this.parent.formatter.editorManager.nodeSelection.setSelectionContents(this.contentModule.getDocument(), target);\n addClass([target], 'e-img-focus');\n var items = this.quickToolObj.imageQTBar.toolbarElement.querySelectorAll('.e-toolbar-item');\n var separator = void 0;\n if (closest(target, 'a')) {\n for (var i = 0; i < items.length; i++) {\n if (items[i].getAttribute('title') === this.i10n.getConstant('openLink') ||\n items[i].getAttribute('title') === this.i10n.getConstant('editLink') ||\n items[i].getAttribute('title') === this.i10n.getConstant('removeLink')) {\n items[i].style.display = '';\n removeClass([items[i]], 'e-link-groups');\n }\n else if (items[i].getAttribute('title') === 'Insert Link') {\n items[i].style.display = 'none';\n }\n else if (items[i].classList.contains('e-rte-horizontal-separator')) {\n separator = items[i];\n detach(items[i]);\n }\n }\n var newItems = this.quickToolObj.imageQTBar.toolbarElement.querySelectorAll('.e-toolbar-item:not(.e-link-groups)');\n this.quickToolObj.imageQTBar.addQTBarItem(['-'], Math.round(newItems.length / 2));\n }\n else if (!closest(target, 'a')) {\n this.imageWithLinkQTBarItemUpdate();\n }\n this.showImageQuickToolbar({ args: args, type: 'Images', elements: [args.target] });\n }\n else {\n this.hideImageQuickToolbar();\n }\n }\n };\n Image.prototype.insertImgLink = function (e, inputDetails) {\n var _this = this;\n if (e.selectNode[0].nodeName !== 'IMG') {\n return;\n }\n this.imagDialog(e);\n if (!isNullOrUndefined(this.dialogObj)) {\n var linkWrap = this.parent.createElement('div', { className: 'e-img-linkwrap' });\n var linkUrl = this.i10n.getConstant('linkurl');\n var content = '
'\n },\n 'insertImage': {\n command: 'InsertHTML',\n subCommand: 'InsertHTML',\n value: '![]()
'\n },\n 'insertBrOnReturn': {\n command: 'InsertHTML',\n subCommand: 'InsertHTML',\n value: '
'\n },\n 'insertOrderedList': {\n command: 'Lists',\n value: 'OL'\n },\n 'insertUnorderedList': {\n command: 'Lists',\n value: 'UL'\n },\n 'insertParagraph': {\n command: 'Formats',\n value: 'P'\n },\n 'removeFormat': {\n command: 'Clear',\n subCommand: 'ClearFormat'\n }\n};\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty } from '@syncfusion/ej2-base';\nimport { ToolbarType } from '../base/enum';\nimport { TableStyleItems } from '../models/items';\nexport var predefinedItems = ['Bold', 'Italic', 'Underline', '|', 'Formats', 'Alignments',\n 'OrderedList', 'UnorderedList', '|', 'CreateLink', 'Image', '|', 'SourceCode', 'Undo', 'Redo'];\nexport var fontFamily = [\n { text: 'Segoe UI', value: 'Segoe UI', cssClass: 'e-segoe-ui' },\n { text: 'Arial', value: 'Arial,Helvetica,sans-serif', cssClass: 'e-arial' },\n { text: 'Georgia', value: 'Georgia,serif', cssClass: 'e-georgia' },\n { text: 'Impact', value: 'Impact,Charcoal,sans-serif', cssClass: 'e-impact' },\n { text: 'Tahoma', value: 'Tahoma,Geneva,sans-serif', cssClass: 'e-tahoma' },\n { text: 'Times New Roman', value: 'Times New Roman,Times,serif', cssClass: 'e-times-new-roman' },\n { text: 'Verdana', value: 'Verdana,Geneva,sans-serif', cssClass: 'e-verdana' }\n];\nexport var fontSize = [\n { text: '8 pt', value: '8pt' },\n { text: '10 pt', value: '10pt' },\n { text: '12 pt', value: '12pt' },\n { text: '14 pt', value: '14pt' },\n { text: '18 pt', value: '18pt' },\n { text: '24 pt', value: '24pt' },\n { text: '36 pt', value: '36pt' }\n];\nexport var formatItems = [\n { text: 'Paragraph', value: 'P', cssClass: 'e-paragraph' },\n { text: 'Code', value: 'Pre', cssClass: 'e-code' },\n { text: 'Quotation', value: 'BlockQuote', cssClass: 'e-quote' },\n { text: 'Heading 1', value: 'H1', cssClass: 'e-h1' },\n { text: 'Heading 2', value: 'H2', cssClass: 'e-h2' },\n { text: 'Heading 3', value: 'H3', cssClass: 'e-h3' },\n { text: 'Heading 4', value: 'H4', cssClass: 'e-h4' }\n];\nexport var fontColor = {\n 'Custom': [\n '', '#000000', '#e7e6e6', '#44546a', '#4472c4', '#ed7d31', '#a5a5a5', '#ffc000', '#70ad47', '#ff0000',\n '#f2f2f2', '#808080', '#cfcdcd', '#d5dce4', '#d9e2f3', '#fbe4d5', '#ededed', '#fff2cc', '#e2efd9', '#ffcccc',\n '#d9d9d9', '#595959', '#aeaaaa', '#acb9ca', '#b4c6e7', '#f7caac', '#dbdbdb', '#ffe599', '#c5e0b3', '#ff8080',\n '#bfbfbf', '#404040', '#747070', '#8496b0', '#8eaadb', '#f4b083', '#c9c9c9', '#ffd966', '#a8d08d', '#ff3333',\n '#a6a6a6', '#262626', '#3b3838', '#323e4f', '#2f5496', '#c45911', '#7b7b7b', '#bf8f00', '#538135', '#b30000',\n '#7f7f7f', '#0d0d0d', '#161616', '#212934', '#1f3763', '#823b0b', '#525252', '#7f5f00', '#375623', '#660000'\n ]\n};\nexport var backgroundColor = {\n 'Custom': [\n '', '#000000', '#ffff00', '#00ff00', '#00ffff', '#0000ff', '#ff0000', '#000080', '#800080', '#996633',\n '#f2f2f2', '#808080', '#ffffcc', '#b3ffb3', '#ccffff', '#ccccff', '#ffcccc', '#ccccff', '#ff80ff', '#f2e6d9',\n '#d9d9d9', '#595959', '#ffff80', '#80ff80', '#b3ffff', '#8080ff', '#ff8080', '#8080ff', '#ff00ff', '#dfbf9f',\n '#bfbfbf', '#404040', '#ffff33', '#33ff33', '#33ffff', '#3333ff', '#ff3333', '#0000b3', '#b300b3', '#c68c53',\n '#a6a6a6', '#262626', '#e6e600', '#00b300', '#009999', '#000099', '#b30000', '#000066', '#660066', '#86592d',\n '#7f7f7f', '#0d0d0d', '#999900', '#006600', '#006666', '#000066', '#660000', '#00004d', '#4d004d', '#734d26',\n ]\n};\n/**\n * Configures the toolbar settings of the RichTextEditor.\n */\nvar ToolbarSettings = /** @class */ (function (_super) {\n __extends(ToolbarSettings, _super);\n function ToolbarSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], ToolbarSettings.prototype, \"enable\", void 0);\n __decorate([\n Property(true)\n ], ToolbarSettings.prototype, \"enableFloating\", void 0);\n __decorate([\n Property(ToolbarType.Expand)\n ], ToolbarSettings.prototype, \"type\", void 0);\n __decorate([\n Property(predefinedItems)\n ], ToolbarSettings.prototype, \"items\", void 0);\n __decorate([\n Property({})\n ], ToolbarSettings.prototype, \"itemConfigs\", void 0);\n return ToolbarSettings;\n}(ChildProperty));\nexport { ToolbarSettings };\n/**\n * Configures the image settings of the RichTextEditor.\n */\nvar ImageSettings = /** @class */ (function (_super) {\n __extends(ImageSettings, _super);\n function ImageSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(['.jpeg', '.jpg', '.png'])\n ], ImageSettings.prototype, \"allowedTypes\", void 0);\n __decorate([\n Property('inline')\n ], ImageSettings.prototype, \"display\", void 0);\n __decorate([\n Property('auto')\n ], ImageSettings.prototype, \"width\", void 0);\n __decorate([\n Property('auto')\n ], ImageSettings.prototype, \"height\", void 0);\n __decorate([\n Property(null)\n ], ImageSettings.prototype, \"saveUrl\", void 0);\n __decorate([\n Property(null)\n ], ImageSettings.prototype, \"path\", void 0);\n __decorate([\n Property(true)\n ], ImageSettings.prototype, \"resize\", void 0);\n __decorate([\n Property(0)\n ], ImageSettings.prototype, \"minWidth\", void 0);\n __decorate([\n Property(null)\n ], ImageSettings.prototype, \"maxWidth\", void 0);\n __decorate([\n Property(0)\n ], ImageSettings.prototype, \"minHeight\", void 0);\n __decorate([\n Property(null)\n ], ImageSettings.prototype, \"maxHeight\", void 0);\n __decorate([\n Property(false)\n ], ImageSettings.prototype, \"resizeByPercent\", void 0);\n return ImageSettings;\n}(ChildProperty));\nexport { ImageSettings };\nvar TableSettings = /** @class */ (function (_super) {\n __extends(TableSettings, _super);\n function TableSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('100%')\n ], TableSettings.prototype, \"width\", void 0);\n __decorate([\n Property(TableStyleItems)\n ], TableSettings.prototype, \"styles\", void 0);\n __decorate([\n Property(true)\n ], TableSettings.prototype, \"resize\", void 0);\n __decorate([\n Property(0)\n ], TableSettings.prototype, \"minWidth\", void 0);\n __decorate([\n Property(null)\n ], TableSettings.prototype, \"maxWidth\", void 0);\n return TableSettings;\n}(ChildProperty));\nexport { TableSettings };\n/**\n * Configures the quick toolbar settings of the RichTextEditor.\n */\nvar QuickToolbarSettings = /** @class */ (function (_super) {\n __extends(QuickToolbarSettings, _super);\n function QuickToolbarSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], QuickToolbarSettings.prototype, \"enable\", void 0);\n __decorate([\n Property('hide')\n ], QuickToolbarSettings.prototype, \"actionOnScroll\", void 0);\n __decorate([\n Property(['Open', 'Edit', 'UnLink'])\n ], QuickToolbarSettings.prototype, \"link\", void 0);\n __decorate([\n Property(['Replace', 'Align', 'Caption', 'Remove', '-', 'InsertLink', 'OpenImageLink', 'EditImageLink', 'RemoveImageLink', 'Display', 'AltText', 'Dimension'])\n ], QuickToolbarSettings.prototype, \"image\", void 0);\n __decorate([\n Property(['Cut', 'Copy', 'Paste'])\n ], QuickToolbarSettings.prototype, \"text\", void 0);\n __decorate([\n Property(['TableHeader', 'TableRows', 'TableColumns', 'BackgroundColor', '-', 'TableRemove', 'Alignments', 'TableCellVerticalAlign', 'Styles'])\n ], QuickToolbarSettings.prototype, \"table\", void 0);\n return QuickToolbarSettings;\n}(ChildProperty));\nexport { QuickToolbarSettings };\n/**\n * Configures the Paste Cleanup settings of the RichTextEditor.\n */\nvar PasteCleanupSettings = /** @class */ (function (_super) {\n __extends(PasteCleanupSettings, _super);\n function PasteCleanupSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], PasteCleanupSettings.prototype, \"prompt\", void 0);\n __decorate([\n Property(null)\n ], PasteCleanupSettings.prototype, \"deniedAttrs\", void 0);\n __decorate([\n Property(null)\n ], PasteCleanupSettings.prototype, \"allowedStyleProps\", void 0);\n __decorate([\n Property(null)\n ], PasteCleanupSettings.prototype, \"deniedTags\", void 0);\n __decorate([\n Property(true)\n ], PasteCleanupSettings.prototype, \"keepFormat\", void 0);\n __decorate([\n Property(false)\n ], PasteCleanupSettings.prototype, \"plainText\", void 0);\n return PasteCleanupSettings;\n}(ChildProperty));\nexport { PasteCleanupSettings };\n/**\n * Configures the font family settings of the RichTextEditor.\n */\nvar FontFamily = /** @class */ (function (_super) {\n __extends(FontFamily, _super);\n function FontFamily() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], FontFamily.prototype, \"default\", void 0);\n __decorate([\n Property('65px')\n ], FontFamily.prototype, \"width\", void 0);\n __decorate([\n Property(fontFamily)\n ], FontFamily.prototype, \"items\", void 0);\n return FontFamily;\n}(ChildProperty));\nexport { FontFamily };\n/**\n * Configures the font size settings of the RichTextEditor.\n */\nvar FontSize = /** @class */ (function (_super) {\n __extends(FontSize, _super);\n function FontSize() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], FontSize.prototype, \"default\", void 0);\n __decorate([\n Property('35px')\n ], FontSize.prototype, \"width\", void 0);\n __decorate([\n Property(fontSize)\n ], FontSize.prototype, \"items\", void 0);\n return FontSize;\n}(ChildProperty));\nexport { FontSize };\n/**\n * Configures the format settings of the RichTextEditor.\n */\nvar Format = /** @class */ (function (_super) {\n __extends(Format, _super);\n function Format() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], Format.prototype, \"default\", void 0);\n __decorate([\n Property('65px')\n ], Format.prototype, \"width\", void 0);\n __decorate([\n Property(formatItems)\n ], Format.prototype, \"types\", void 0);\n return Format;\n}(ChildProperty));\nexport { Format };\n/**\n * Configures the font Color settings of the RichTextEditor.\n */\nvar FontColor = /** @class */ (function (_super) {\n __extends(FontColor, _super);\n function FontColor() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('#ff0000')\n ], FontColor.prototype, \"default\", void 0);\n __decorate([\n Property('Palette')\n ], FontColor.prototype, \"mode\", void 0);\n __decorate([\n Property(10)\n ], FontColor.prototype, \"columns\", void 0);\n __decorate([\n Property(fontColor)\n ], FontColor.prototype, \"colorCode\", void 0);\n __decorate([\n Property(false)\n ], FontColor.prototype, \"modeSwitcher\", void 0);\n return FontColor;\n}(ChildProperty));\nexport { FontColor };\n/**\n * Configures the background Color settings of the RichTextEditor.\n */\nvar BackgroundColor = /** @class */ (function (_super) {\n __extends(BackgroundColor, _super);\n function BackgroundColor() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('#ffff00')\n ], BackgroundColor.prototype, \"default\", void 0);\n __decorate([\n Property('Palette')\n ], BackgroundColor.prototype, \"mode\", void 0);\n __decorate([\n Property(10)\n ], BackgroundColor.prototype, \"columns\", void 0);\n __decorate([\n Property(backgroundColor)\n ], BackgroundColor.prototype, \"colorCode\", void 0);\n __decorate([\n Property(false)\n ], BackgroundColor.prototype, \"modeSwitcher\", void 0);\n return BackgroundColor;\n}(ChildProperty));\nexport { BackgroundColor };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty, Complex } from '@syncfusion/ej2-base';\n/**\n * Objects used for configuring the iframe resources properties.\n */\nvar Resources = /** @class */ (function (_super) {\n __extends(Resources, _super);\n function Resources() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property([])\n ], Resources.prototype, \"styles\", void 0);\n __decorate([\n Property([])\n ], Resources.prototype, \"scripts\", void 0);\n return Resources;\n}(ChildProperty));\nexport { Resources };\n/**\n * Configures the iframe settings of the RTE.\n */\nvar IFrameSettings = /** @class */ (function (_super) {\n __extends(IFrameSettings, _super);\n function IFrameSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], IFrameSettings.prototype, \"enable\", void 0);\n __decorate([\n Property(null)\n ], IFrameSettings.prototype, \"attributes\", void 0);\n __decorate([\n Complex({}, Resources)\n ], IFrameSettings.prototype, \"resources\", void 0);\n return IFrameSettings;\n}(ChildProperty));\nexport { IFrameSettings };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty } from '@syncfusion/ej2-base';\n/**\n * Configures the inlineMode property of the RTE.\n */\nvar InlineMode = /** @class */ (function (_super) {\n __extends(InlineMode, _super);\n function InlineMode() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], InlineMode.prototype, \"enable\", void 0);\n __decorate([\n Property(true)\n ], InlineMode.prototype, \"onSelection\", void 0);\n return InlineMode;\n}(ChildProperty));\nexport { InlineMode };\n","import { Browser, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { getScrollableParent } from '@syncfusion/ej2-popups';\nimport * as events from '../base/constant';\nimport * as classes from '../base/classes';\nimport { addClass, removeClass } from '@syncfusion/ej2-base';\n/**\n * `FullScreen` module is used to maximize and minimize screen\n */\nvar FullScreen = /** @class */ (function () {\n function FullScreen(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n FullScreen.prototype.showFullScreen = function (event) {\n this.scrollableParent = getScrollableParent(this.parent.element);\n if (!this.parent.element.classList.contains(classes.CLS_FULL_SCREEN)) {\n this.parent.trigger(events.actionBegin, { requestType: 'Maximize', targetItem: 'Maximize', args: event });\n if (this.parent.toolbarSettings.enableFloating &&\n !this.parent.inlineMode.enable && this.parent.toolbarSettings.enable) {\n this.parent.getToolbarElement().style.width = '100%';\n this.parent.getToolbarElement().style.top = '0px';\n }\n this.parent.element.classList.add(classes.CLS_FULL_SCREEN);\n this.toggleParentOverflow(true);\n this.parent.setContentHeight();\n if (this.parent.toolbarModule) {\n if (!this.parent.getBaseToolbarObject().toolbarObj.items[0].properties) {\n this.parent.getBaseToolbarObject().toolbarObj.removeItems(0);\n }\n if (Browser.isDevice) {\n this.parent.toolbarModule.removeFixedTBarClass();\n }\n this.parent.toolbarModule.updateItem({\n targetItem: 'Maximize',\n updateItem: 'Minimize',\n baseToolbar: this.parent.getBaseToolbarObject()\n });\n }\n this.parent.trigger(events.actionComplete, { requestType: 'Maximize', targetItem: 'Maximize', args: event });\n }\n };\n FullScreen.prototype.hideFullScreen = function (event) {\n if (this.parent.element.classList.contains(classes.CLS_FULL_SCREEN)) {\n this.parent.element.classList.remove(classes.CLS_FULL_SCREEN);\n var elem = document.querySelectorAll('.e-rte-overflow');\n for (var i = 0; i < elem.length; i++) {\n removeClass([elem[i]], ['e-rte-overflow']);\n }\n this.parent.trigger(events.actionBegin, { requestType: 'Minimize', targetItem: 'Minimize', args: event });\n this.parent.setContentHeight();\n if (this.parent.toolbarModule) {\n if (!this.parent.getBaseToolbarObject().toolbarObj.items[0].properties) {\n this.parent.getBaseToolbarObject().toolbarObj.removeItems(0);\n }\n this.parent.toolbarModule.updateItem({\n targetItem: 'Minimize',\n updateItem: 'Maximize',\n baseToolbar: this.parent.getBaseToolbarObject()\n });\n if (Browser.isDevice && this.parent.inlineMode.enable) {\n this.parent.toolbarModule.addFixedTBarClass();\n }\n }\n this.parent.trigger(events.actionComplete, { requestType: 'Minimize', targetItem: 'Minimize', args: event });\n }\n };\n FullScreen.prototype.toggleParentOverflow = function (isAdd) {\n if (isNullOrUndefined(this.scrollableParent)) {\n return;\n }\n for (var i = 0; i < this.scrollableParent.length; i++) {\n if (this.scrollableParent[i].nodeName === '#document') {\n var elem = document.querySelector('body');\n addClass([elem], ['e-rte-overflow']);\n }\n else {\n var elem = this.scrollableParent[i];\n addClass([elem], ['e-rte-overflow']);\n }\n }\n };\n FullScreen.prototype.onKeyDown = function (event) {\n var originalEvent = event.args;\n switch (originalEvent.action) {\n case 'full-screen':\n this.showFullScreen(event.args);\n originalEvent.preventDefault();\n break;\n case 'escape':\n this.hideFullScreen(event.args);\n originalEvent.preventDefault();\n break;\n }\n };\n FullScreen.prototype.addEventListener = function () {\n this.parent.on(events.keyDown, this.onKeyDown, this);\n this.parent.on(events.destroy, this.destroy, this);\n };\n FullScreen.prototype.removeEventListener = function () {\n this.parent.on(events.keyDown, this.onKeyDown, this);\n this.parent.off(events.destroy, this.removeEventListener);\n };\n FullScreen.prototype.destroy = function () {\n if (this.parent.element.classList.contains(classes.CLS_FULL_SCREEN)) {\n this.toggleParentOverflow(false);\n }\n this.removeEventListener();\n };\n return FullScreen;\n}());\nexport { FullScreen };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, EventHandler, Complex, Browser, addClass, select, detach } from '@syncfusion/ej2-base';\nimport { Property, NotifyPropertyChanges, formatUnit, L10n, closest } from '@syncfusion/ej2-base';\nimport { setStyleAttribute, Event, removeClass, print as printWindow, attributes } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined as isNOU, compile, append, extend, debounce, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { getScrollableParent } from '@syncfusion/ej2-popups';\nimport * as events from '../base/constant';\nimport * as classes from '../base/classes';\nimport { Render } from '../renderer/render';\nimport { ViewSource } from '../renderer/view-source';\nimport { executeGroup } from './interface';\nimport { ServiceLocator } from '../services/service-locator';\nimport { RendererFactory } from '../services/renderer-factory';\nimport { RenderType, ToolbarType } from './enum';\nimport { ExecCommandCallBack } from '../actions/execute-command-callback';\nimport { KeyboardEvents } from '../actions/keyboard';\nimport { ToolbarSettings, ImageSettings, QuickToolbarSettings, FontFamily, FontSize, Format } from '../models/toolbar-settings';\nimport { TableSettings, PasteCleanupSettings } from '../models/toolbar-settings';\nimport { FontColor, BackgroundColor } from '../models/toolbar-settings';\nimport { IFrameSettings } from '../models/iframe-settings';\nimport { InlineMode } from '../models/inline-mode';\nimport { defaultLocale } from '../models/default-locale';\nimport { setAttributes } from '../actions/html-attributes';\nimport { FullScreen } from '../actions/full-screen';\nimport * as CONSTANT from '../../common/constant';\nimport { dispatchEvent } from '../base/util';\n/**\n * Represents the RichTextEditor component.\n * ```html\n * \n * \n * ```\n */\nvar RichTextEditor = /** @class */ (function (_super) {\n __extends(RichTextEditor, _super);\n function RichTextEditor(options, element) {\n var _this = _super.call(this, options, element) || this;\n /**\n * @hidden\n */\n _this.isFocusOut = false;\n /**\n * @hidden\n */\n _this.isRTE = false;\n /**\n * @hidden\n */\n _this.isBlur = true;\n _this.needsID = true;\n _this.onBlurHandler = _this.blurHandler.bind(_this);\n _this.onFocusHandler = _this.focusHandler.bind(_this);\n _this.onResizeHandler = _this.resizeHandler.bind(_this);\n return _this;\n }\n /**\n * To provide the array of modules needed for component rendering\n * @return {ModuleDeclaration[]}\n * @hidden\n */\n RichTextEditor.prototype.requiredModules = function () {\n var modules = [];\n if (this.toolbarSettings.enable) {\n modules.push({ member: 'toolbar', args: [this, this.serviceLocator] });\n modules.push({\n member: 'link',\n args: [this, this.serviceLocator]\n });\n modules.push({\n member: 'table',\n args: [this, this.serviceLocator]\n });\n modules.push({\n member: 'image',\n args: [this, this.serviceLocator]\n });\n if (this.quickToolbarSettings.enable) {\n modules.push({ member: 'quickToolbar', args: [this, this.serviceLocator] });\n }\n }\n if (this.showCharCount) {\n modules.push({ member: 'count', args: [this, this.serviceLocator] });\n }\n if (this.editorMode === 'Markdown') {\n modules.push({ member: 'markdownEditor', args: [this, this.serviceLocator] });\n }\n if (this.editorMode === 'HTML') {\n modules.push({ member: 'htmlEditor', args: [this, this.serviceLocator] });\n modules.push({ member: 'pasteCleanup', args: [this, this.serviceLocator] });\n }\n return modules;\n };\n RichTextEditor.prototype.updateEnable = function () {\n if (this.enabled) {\n removeClass([this.element], classes.CLS_DISABLED);\n this.element.tabIndex = 0;\n this.element.setAttribute('aria-disabled', 'false');\n this.inputElement.setAttribute('tabindex', '0');\n }\n else {\n if (this.getToolbar()) {\n removeClass(this.getToolbar().querySelectorAll('.' + classes.CLS_ACTIVE), classes.CLS_ACTIVE);\n }\n addClass([this.element], classes.CLS_DISABLED);\n this.element.tabIndex = -1;\n this.element.setAttribute('aria-disabled', 'true');\n this.inputElement.setAttribute('tabindex', '-1');\n }\n };\n RichTextEditor.prototype.setEnable = function () {\n this.updateEnable();\n (this.enabled) ? this.eventInitializer() : this.unWireEvents();\n };\n /**\n * For internal use only - Initialize the event handler;\n * @private\n */\n RichTextEditor.prototype.preRender = function () {\n this.clickPoints = { clientX: 0, clientY: 0 };\n this.initialValue = this.value;\n this.serviceLocator = new ServiceLocator;\n this.initializeServices();\n this.setContainer();\n setStyleAttribute(this.element, { 'width': formatUnit(this.width) });\n attributes(this.element, { role: 'application' });\n };\n RichTextEditor.prototype.setContainer = function () {\n this.originalElement = this.element.cloneNode(true);\n if (this.value === null || this.valueTemplate !== null) {\n this.setValue();\n }\n this.element.innerHTML = '';\n var invalidAttr = ['class', 'style', 'id', 'ejs-for'];\n var htmlAttr = {};\n for (var a = 0; a < this.element.attributes.length; a++) {\n if (invalidAttr.indexOf(this.element.attributes[a].name) === -1 &&\n !(/^data-val/.test(this.element.attributes[a].name))) { // data-val for asp.net core data annotation validation.\n htmlAttr[this.element.attributes[a].name] = this.element.getAttribute(this.element.attributes[a].name);\n }\n }\n extend(htmlAttr, this.htmlAttributes, htmlAttr);\n this.setProperties({ htmlAttributes: htmlAttr }, true);\n if (!isNOU(this.htmlAttributes.id)) {\n this.element.id = this.htmlAttributes.id;\n }\n if (this.element.tagName === 'TEXTAREA') {\n var rteOuterWrapper = this.createElement('div', {\n className: this.element.getAttribute('class')\n });\n this.element.innerHTML = '';\n this.element.parentElement.insertBefore(rteOuterWrapper, this.element);\n this.valueContainer = this.element;\n removeClass([this.valueContainer], this.element.getAttribute('class').split(' '));\n this.element = rteOuterWrapper;\n }\n else {\n this.valueContainer = this.createElement('textarea', {\n id: this.getID() + '-value'\n });\n }\n this.valueContainer.name = this.getID();\n addClass([this.valueContainer], classes.CLS_RTE_HIDDEN);\n this.element.appendChild(this.valueContainer);\n };\n RichTextEditor.prototype.getPersistData = function () {\n return this.addOnPersist(['value']);\n };\n /**\n * Focuses the RichTextEditor component\n * @public\n */\n RichTextEditor.prototype.focusIn = function () {\n if (this.enabled) {\n this.inputElement.focus();\n this.focusHandler({});\n }\n };\n /**\n * Blurs the RichTextEditor component\n * @public\n */\n RichTextEditor.prototype.focusOut = function () {\n if (this.enabled) {\n this.inputElement.blur();\n this.blurHandler({});\n }\n };\n /**\n * Selects all the content in RichTextEditor\n * @public\n */\n RichTextEditor.prototype.selectAll = function () {\n this.notify(events.selectAll, {});\n };\n /**\n * Selects a content range or an element\n * @public\n */\n RichTextEditor.prototype.selectRange = function (range) {\n this.notify(events.selectRange, { range: range });\n };\n /**\n * Retrieves the HTML markup content from currently selected content of RichTextEditor.\n * @public\n */\n RichTextEditor.prototype.getSelection = function () {\n var str = '';\n this.notify(events.getSelectedHtml, {\n callBack: function (txt) {\n str = txt;\n }\n });\n return str;\n };\n /**\n * Executes the commands\n * CommandName - Specifies the name of the command to be executed.\n * value - Specifies the sub command.\n * @public\n */\n RichTextEditor.prototype.executeCommand = function (commandName, value) {\n var tool = executeGroup[commandName];\n this.formatter.editorManager.execCommand(tool.command, tool.subCommand ? tool.subCommand : (value ? value : tool.value), null, null, (value ? value : tool.value), (value ? value : tool.value));\n };\n RichTextEditor.prototype.encode = function (value) {\n var divNode = this.createElement('div');\n divNode.innerText = value.trim();\n return divNode.innerHTML.replace(//gi, '\\n');\n };\n RichTextEditor.prototype.decode = function (value) {\n return value.replace(/&/g, '&').replace(/</g, '<')\n .replace(/</g, '<').replace(/>/g, '>')\n .replace(/>/g, '>').replace(/ /g, ' ')\n .replace(/ /g, ' ').replace(/"/g, '');\n };\n /**\n * For internal use only - To Initialize the component rendering.\n * @private\n */\n RichTextEditor.prototype.render = function () {\n this.renderModule = new Render(this, this.serviceLocator);\n this.sourceCodeModule = new ViewSource(this, this.serviceLocator);\n this.notify(events.initialLoad, {});\n this.trigger(events.load);\n this.RTERender();\n var execCommandCallBack = new ExecCommandCallBack(this);\n this.notify(events.initialEnd, {});\n if (this.toolbarSettings.enable && this.toolbarSettings.type === 'Expand' && !isNOU(this.getToolbar()) &&\n (this.toolbarSettings.items.indexOf('Undo') > -1 && this.toolbarSettings.items.indexOf('Redo') > -1)) {\n this.disableToolbarItem(['Undo', 'Redo']);\n }\n this.setContentHeight();\n if (this.value !== null) {\n this.valueContainer.defaultValue = this.value;\n }\n (!this.enabled) ? this.unWireEvents() : this.eventInitializer();\n };\n /**\n * For internal use only - Initialize the event handler\n * @private\n */\n RichTextEditor.prototype.eventInitializer = function () {\n this.wireEvents();\n };\n /**\n * For internal use only - keydown the event handler;\n * @private\n */\n RichTextEditor.prototype.keyDown = function (e) {\n this.notify(events.keyDown, { member: 'keydown', args: e });\n if (this.formatter.getUndoRedoStack().length === 0) {\n this.formatter.saveData();\n }\n if (e.action && e.action !== 'paste' || e.which === 9) {\n this.formatter.process(this, null, e);\n switch (e.action) {\n case 'toolbar-focus':\n if (this.toolbarSettings.enable) {\n var selector = '.e-toolbar-item[aria-disabled=\"false\"][title] [tabindex]';\n this.toolbarModule.baseToolbar.toolbarObj.element.querySelector(selector).focus();\n }\n break;\n case 'escape':\n this.contentModule.getEditPanel().focus();\n break;\n }\n }\n if (!isNOU(this.placeholder)) {\n this.setPlaceHolder();\n }\n this.autoResize();\n };\n RichTextEditor.prototype.keyUp = function (e) {\n this.notify(events.keyUp, { member: 'keyup', args: e });\n var allowedKeys = e.which === 32 || e.which === 13 || e.which === 8 || e.which === 46;\n if (((e.key !== 'shift' && !e.ctrlKey) && e.key && e.key.length === 1 || allowedKeys) || (this.editorMode === 'Markdown'\n && ((e.key !== 'shift' && !e.ctrlKey) && e.key && e.key.length === 1 || allowedKeys)) && !this.inlineMode.enable) {\n this.formatter.onKeyHandler(this, e);\n }\n if (this.inputElement && this.inputElement.textContent.length !== 0) {\n this.notify(events.toolbarRefresh, { args: e });\n }\n if (!isNOU(this.placeholder)) {\n this.setPlaceHolder();\n }\n };\n RichTextEditor.prototype.updateValue = function (value) {\n if (isNOU(value)) {\n this.setProperties({ value: this.inputElement.innerHTML });\n }\n else {\n this.setProperties({ value: value });\n }\n };\n RichTextEditor.prototype.mouseUp = function (e) {\n var touch = (e.touches ? e.changedTouches[0] : e);\n this.notify(events.mouseUp, { member: 'mouseUp', args: e });\n if (this.inputElement && ((this.editorMode === 'HTML' && this.inputElement.textContent.length !== 0) ||\n (this.editorMode === 'Markdown' && this.inputElement.value.length !== 0))) {\n this.notify(events.toolbarRefresh, { args: e });\n }\n if (this.clickPoints.clientX === touch.clientX && this.clickPoints.clientY === touch.clientY) {\n this.notify(events.editAreaClick, { member: 'editAreaClick', args: e });\n }\n };\n /**\n * @hidden\n */\n RichTextEditor.prototype.ensureModuleInjected = function (module) {\n return this.getInjectedModules().indexOf(module) >= 0;\n };\n RichTextEditor.prototype.onCopy = function () {\n this.contentModule.getDocument().execCommand('copy', false, null);\n };\n RichTextEditor.prototype.onCut = function () {\n this.contentModule.getDocument().execCommand('cut', false, null);\n };\n RichTextEditor.prototype.onPaste = function (e) {\n var _this = this;\n var evenArgs = {\n originalEvent: e,\n cancel: false,\n requestType: 'Paste'\n };\n this.trigger(events.actionBegin, evenArgs);\n if (!evenArgs.cancel) {\n if (!isNOU(this.pasteCleanupModule)) {\n this.notify(events.pasteClean, { args: e });\n }\n else {\n var args_1 = { requestType: 'Paste', editorMode: this.editorMode, event: e };\n var value = null;\n if (e && !isNOU(e.clipboardData)) {\n value = e.clipboardData.getData('text/plain');\n }\n var file = e && e.clipboardData && e.clipboardData.items.length > 0 ?\n e.clipboardData.items[0].getAsFile() : null;\n if (value !== null) {\n this.notify(events.paste, {\n file: file,\n args: e,\n text: value\n });\n }\n setTimeout(function () { _this.formatter.onSuccess(_this, args_1); }, 0);\n }\n }\n };\n /**\n * @hidden\n */\n RichTextEditor.prototype.clipboardAction = function (action, event) {\n switch (action.toLowerCase()) {\n case 'cut':\n this.onCut();\n this.formatter.onSuccess(this, {\n requestType: 'Cut',\n editorMode: this.editorMode,\n event: event\n });\n break;\n case 'copy':\n this.onCopy();\n this.formatter.onSuccess(this, {\n requestType: 'Copy',\n editorMode: this.editorMode,\n event: event\n });\n break;\n case 'paste':\n this.onPaste(event);\n break;\n }\n };\n /**\n * Destroys the component (detaches/removes all event handlers, attributes, classes, and empties the component element).\n * @method destroy\n * @return {void}\n */\n RichTextEditor.prototype.destroy = function () {\n this.notify(events.destroy, {});\n this.destroyDependentModules();\n if (!isNOU(this.timeInterval)) {\n clearInterval(this.timeInterval);\n this.timeInterval = null;\n }\n this.unWireEvents();\n if (this.originalElement.tagName === 'TEXTAREA') {\n this.element.parentElement.insertBefore(this.valueContainer, this.element);\n this.valueContainer.id = this.getID();\n this.valueContainer.removeAttribute('name');\n detach(this.element);\n if (this.originalElement.innerHTML.trim() !== '') {\n this.valueContainer.value = this.originalElement.innerHTML.trim();\n this.setProperties({ value: (!isNullOrUndefined(this.initialValue) ? this.initialValue : null) }, true);\n }\n else {\n this.valueContainer.value = '';\n }\n this.element = this.valueContainer;\n }\n else {\n if (this.originalElement.innerHTML.trim() !== '') {\n this.element.innerHTML = this.originalElement.innerHTML.trim();\n this.setProperties({ value: (!isNullOrUndefined(this.initialValue) ? this.initialValue : null) }, true);\n }\n else {\n this.element.innerHTML = '';\n }\n }\n if (this.placeholder && this.placeHolderWrapper) {\n this.placeHolderWrapper = null;\n }\n if (!isNOU(this.cssClass)) {\n removeClass([this.element], this.cssClass);\n }\n this.removeHtmlAttributes();\n this.removeAttributes();\n _super.prototype.destroy.call(this);\n };\n RichTextEditor.prototype.removeHtmlAttributes = function () {\n if (this.htmlAttributes) {\n var keys = Object.keys(this.htmlAttributes);\n for (var i = 0; i < keys.length && this.element.hasAttribute(keys[i]); i++) {\n this.element.removeAttribute(keys[i]);\n }\n }\n };\n RichTextEditor.prototype.removeAttributes = function () {\n if (!this.enabled) {\n removeClass([this.element], classes.CLS_DISABLED);\n }\n if (this.enableRtl) {\n removeClass([this.element], classes.CLS_RTL);\n }\n if (this.readonly) {\n removeClass([this.element], classes.CLS_RTE_READONLY);\n }\n if (this.element.style.width !== '' && this.originalElement.style.width === '') {\n this.element.style.removeProperty('width');\n }\n if (this.element.style.height !== '' && this.originalElement.style.height === '') {\n this.element.style.removeProperty('height');\n }\n this.element.removeAttribute('aria-disabled');\n this.element.removeAttribute('role');\n this.element.removeAttribute('tabindex');\n };\n RichTextEditor.prototype.destroyDependentModules = function () {\n /* destroy dependent modules */\n this.renderModule.destroy();\n this.formatter.editorManager.undoRedoManager.destroy();\n this.sourceCodeModule.destroy();\n };\n /**\n * Returns the HTML or Text inside the RichTextEditor.\n * @return {Element}\n */\n RichTextEditor.prototype.getContent = function () {\n return this.contentModule.getPanel();\n };\n /**\n * Returns the text content as string.\n * @return {string}\n */\n RichTextEditor.prototype.getText = function () {\n return this.contentModule.getText();\n };\n /**\n * For internal use only - Get the module name.\n * @private\n */\n RichTextEditor.prototype.getModuleName = function () {\n return 'richtexteditor';\n };\n /**\n * Called internally if any of the property value changed.\n * @hidden\n */\n RichTextEditor.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'value':\n this.value = (this.enableHtmlEncode) ? this.encode(this.decode(newProp[prop])) : newProp[prop];\n this.updatePanelValue();\n this.setPlaceHolder();\n if (this.showCharCount) {\n this.countModule.refresh();\n }\n break;\n case 'valueTemplate':\n this.setValue();\n if (this.showCharCount) {\n this.countModule.refresh();\n }\n break;\n case 'width':\n this.setWidth(newProp[prop]);\n if (this.toolbarSettings.enable) {\n this.toolbarModule.refreshToolbarOverflow();\n this.resizeHandler();\n }\n break;\n case 'height':\n this.setHeight(newProp[prop]);\n this.setContentHeight();\n this.autoResize();\n break;\n case 'readonly':\n this.setReadOnly(false);\n break;\n case 'cssClass':\n this.element.classList.remove(oldProp[prop]);\n this.setCssClass(newProp[prop]);\n break;\n case 'enabled':\n this.setEnable();\n break;\n case 'enableRtl':\n this.updateRTL();\n break;\n case 'placeholder':\n this.placeholder = newProp[prop];\n this.setPlaceHolder();\n break;\n case 'htmlAttributes':\n setAttributes(this.htmlAttributes, this, false, false);\n break;\n case 'iframeSettings':\n var frameSetting = oldProp[prop];\n if (frameSetting.resources) {\n var iframe = this.contentModule.getDocument();\n var header = iframe.querySelector('head');\n var files = void 0;\n if (frameSetting.resources.scripts) {\n files = header.querySelectorAll('.' + classes.CLS_SCRIPT_SHEET);\n this.removeSheets(files);\n }\n if (frameSetting.resources.styles) {\n files = header.querySelectorAll('.' + classes.CLS_STYLE_SHEET);\n this.removeSheets(files);\n }\n }\n this.setIframeSettings();\n break;\n case 'locale':\n _super.prototype.refresh.call(this);\n break;\n case 'inlineMode':\n this.notify(events.modelChanged, { module: 'quickToolbar', newProp: newProp, oldProp: oldProp });\n this.setContentHeight();\n break;\n case 'toolbarSettings':\n this.notify(events.modelChanged, { module: 'toolbar', newProp: newProp, oldProp: oldProp });\n this.setContentHeight();\n break;\n case 'maxLength':\n if (this.showCharCount) {\n this.countModule.refresh();\n }\n break;\n case 'showCharCount':\n if (newProp[prop] && this.countModule) {\n this.countModule.renderCount();\n }\n else if (newProp[prop] === false && this.countModule) {\n this.countModule.destroy();\n }\n break;\n case 'enableHtmlEncode':\n this.updateValueData();\n break;\n case 'undoRedoSteps':\n case 'undoRedoTimer':\n this.formatter.editorManager.observer.notify(CONSTANT.MODEL_CHANGED, { newProp: newProp, oldProp: oldProp });\n break;\n default:\n this.notify(events.modelChanged, { newProp: newProp, oldProp: oldProp });\n break;\n }\n }\n };\n /**\n * @hidden\n */\n RichTextEditor.prototype.updateValueData = function () {\n if (this.enableHtmlEncode) {\n this.setProperties({ value: this.encode(this.decode(this.inputElement.innerHTML)) });\n }\n else {\n this.setProperties({\n value: /<[a-z][\\s\\S]*>/i.test(this.inputElement.innerHTML) ? this.inputElement.innerHTML :\n this.decode(this.inputElement.innerHTML)\n });\n }\n };\n RichTextEditor.prototype.removeSheets = function (srcList) {\n var i;\n for (i = 0; i < srcList.length; i++) {\n detach(srcList[i]);\n }\n };\n RichTextEditor.prototype.updatePanelValue = function () {\n var value;\n if (this.editorMode === 'HTML' && this.value) {\n value = this.value.replace(/>\\s+<');\n }\n else {\n value = this.value;\n }\n value = (this.enableHtmlEncode && this.value) ? this.decode(value) : value;\n if (value) {\n if (this.valueContainer) {\n this.valueContainer.value = (this.enableHtmlEncode) ? this.value : value;\n }\n if (this.editorMode === 'HTML' && this.inputElement && this.inputElement.innerHTML.trim() !== value.trim()) {\n this.inputElement.innerHTML = value;\n }\n else if (this.editorMode === 'Markdown' && this.inputElement\n && this.inputElement.value.trim() !== value.trim()) {\n this.inputElement.value = value;\n }\n }\n else {\n if (this.editorMode === 'HTML') {\n this.inputElement.innerHTML = '
'\n + yAxis + ' : ' + hetmapSeries.hoverYAxisLabel + '
'\n + value1 + ' : ' + value + '
'\n + value2 + ' : '\n + hetmapSeries.getFormatedText(currentRect.value[1].bubbleData, this.heatMap.cellSettings.format)];\n }\n else {\n value = currentRect.value;\n content = [hetmapSeries.hoverXAxisLabel + ' | ' + hetmapSeries.hoverYAxisLabel + ' : ' +\n hetmapSeries.getFormatedText(value, this.heatMap.cellSettings.format)];\n }\n return content;\n };\n /**\n * To render tooltip.\n * @private\n */\n Tooltip.prototype.renderTooltip = function (currentRect) {\n var hetmapSeries = this.heatMap.heatMapSeries;\n var tempTooltipText = [''];\n var showTooltip = this.heatMap.bubbleSizeWithColor ?\n !isNullOrUndefined(currentRect.value) && !isNullOrUndefined(currentRect.value[0].bubbleData)\n && currentRect.value[0].bubbleData.toString() !== '' ? true : false\n : isNullOrUndefined(currentRect.value) || (!isNullOrUndefined(currentRect.value) &&\n currentRect.value.toString() === '') ? false : true;\n if (!showTooltip) {\n this.showHideTooltip(false, false);\n }\n else {\n if (!isNullOrUndefined(this.heatMap.tooltipRender)) {\n // this.tooltipObject.header = '';\n // this.tooltipObject.content = this.getTemplateText(\n // currentRect, this.heatMap.tooltipTemplate, hetmapSeries.hoverXAxisLabel,\n // hetmapSeries.hoverYAxisLabel);\n var content = this.getTooltipContent(currentRect, hetmapSeries);\n var argData = {\n heatmap: this.heatMap,\n cancel: false,\n name: 'tooltipRender',\n value: currentRect.value,\n xValue: this.heatMap.heatMapSeries.hoverXAxisValue,\n yValue: this.heatMap.heatMapSeries.hoverYAxisValue,\n xLabel: this.heatMap.heatMapSeries.hoverXAxisLabel ?\n this.heatMap.heatMapSeries.hoverXAxisLabel.toString() : null,\n yLabel: this.heatMap.heatMapSeries.hoverYAxisLabel ?\n this.heatMap.heatMapSeries.hoverYAxisLabel.toString() : null,\n content: content\n };\n this.heatMap.trigger('tooltipRender', argData);\n if (!argData.cancel) {\n tempTooltipText = argData.content;\n }\n else {\n if (this.tooltipObject) {\n this.showHideTooltip(false);\n }\n return;\n }\n }\n else {\n // this.tooltipObject.header = hetmapSeries.hoverYAxisLabel.toString();\n tempTooltipText = this.getTooltipContent(currentRect, hetmapSeries);\n }\n if (!this.tooltipObject) {\n this.createTooltip(currentRect.x + (currentRect.width / 2), currentRect.y + (currentRect.height / 2), tempTooltipText);\n }\n else {\n this.tooltipObject.content = tempTooltipText;\n }\n this.showHideTooltip(true);\n this.tooltipObject.enableAnimation = (this.isFirst || this.isFadeout) ? false : true;\n this.isFirst = (this.isFirst) ? false : this.isFirst;\n this.isFadeout = (this.isFadeout) ? false : this.isFadeout;\n this.tooltipObject.location.x = currentRect.x + (currentRect.width / 2);\n this.tooltipObject.location.y = currentRect.y + (currentRect.height / 2);\n }\n if (!currentRect.visible) {\n this.showHideTooltip(false, false);\n }\n };\n return Tooltip;\n}());\nexport { Tooltip };\n","import { extend, isNullOrUndefined } from '@syncfusion/ej2-base';\nvar TwoDimensional = /** @class */ (function () {\n function TwoDimensional(heatMap) {\n this.heatMap = heatMap;\n }\n /**\n * To reconstruct proper two dimensional dataSource depends on min and max values.\n * @private\n */\n TwoDimensional.prototype.processDataSource = function (dataSource) {\n // tslint:disable-next-line:no-any\n var tempCloneData = extend([], dataSource, null, true);\n this.heatMap.clonedDataSource = [];\n this.completeDataSource = [];\n var axis = this.heatMap.axisCollections;\n var dataLength = axis[0].maxLength + 1;\n var labelLength = axis[0].axisLabelSize + (axis[0].min > 0 ? axis[0].min : 0);\n var xLength = dataLength > labelLength ? dataLength : labelLength;\n var minVal;\n var maxVal;\n dataLength = axis[1].maxLength + 1;\n labelLength = axis[1].axisLabelSize + (axis[1].min > 0 ? axis[1].min : 0);\n var yLength = dataLength > labelLength ? dataLength : labelLength;\n // tslint:disable-next-line:no-any \n var tempVariable;\n var cloneDataIndex = 0;\n var minMaxDatasource = [];\n this.tempSizeArray = [];\n this.tempColorArray = [];\n this.heatMap.minColorValue = null;\n this.heatMap.maxColorValue = null;\n for (var z = axis[1].valueType === 'Category' ? axis[1].min : 0; z < yLength; z++) {\n var tempIndex = axis[0].valueType === 'Category' ? axis[0].min : 0;\n this.completeDataSource.push([]);\n while (tempIndex < xLength) {\n if (tempIndex >= axis[0].min && tempIndex <= axis[0].max) {\n this.processDataArray(tempCloneData, tempIndex, z, cloneDataIndex);\n }\n tempIndex++;\n }\n tempVariable = extend([], this.completeDataSource[cloneDataIndex], null, true);\n var minMaxVal = this.getMinMaxValue(minVal, maxVal, tempVariable);\n minVal = minMaxVal[0];\n maxVal = minMaxVal[1];\n if (this.heatMap.xAxis.isInversed) {\n this.completeDataSource[cloneDataIndex] = this.completeDataSource[cloneDataIndex].reverse();\n }\n if (z >= this.heatMap.axisCollections[1].min && z <= this.heatMap.axisCollections[1].max) {\n minMaxDatasource.push(this.completeDataSource[cloneDataIndex]);\n }\n cloneDataIndex++;\n }\n if (!this.heatMap.yAxis.isInversed) {\n this.completeDataSource.reverse();\n minMaxDatasource.reverse();\n }\n this.heatMap.clonedDataSource = minMaxDatasource;\n this.heatMap.dataSourceMinValue = isNullOrUndefined(minVal) ? 0 : parseFloat(minVal.toString());\n this.heatMap.dataSourceMaxValue = isNullOrUndefined(maxVal) ? 0 : parseFloat(maxVal.toString());\n this.heatMap.isColorValueExist = isNullOrUndefined(this.heatMap.minColorValue) ? false : true;\n this.heatMap.minColorValue = isNullOrUndefined(this.heatMap.minColorValue) ?\n this.heatMap.dataSourceMinValue : parseFloat(this.heatMap.minColorValue.toString());\n this.heatMap.maxColorValue = isNullOrUndefined(this.heatMap.maxColorValue) ?\n this.heatMap.dataSourceMaxValue : parseFloat(this.heatMap.maxColorValue.toString());\n };\n /**\n * To process and create a proper data array.\n * @private\n */\n // tslint:disable-next-line:no-any\n TwoDimensional.prototype.processDataArray = function (tempCloneData, tempIndex, z, cloneDataIndex) {\n if (this.heatMap.bubbleSizeWithColor) {\n if (tempCloneData[tempIndex] && !isNullOrUndefined(tempCloneData[tempIndex][z])\n && typeof (tempCloneData[tempIndex][z]) === 'object') {\n // tslint:disable-next-line:no-any \n var internalArray = tempCloneData[tempIndex][z];\n for (var tempx = 0; tempx < internalArray.length; tempx++) {\n if (isNullOrUndefined(internalArray[tempx]) || isNaN(internalArray[tempx])) {\n internalArray[tempx] = '';\n }\n if (tempx === 0) {\n this.tempSizeArray.push(internalArray[tempx]);\n }\n else if (tempx === 1) {\n this.tempColorArray.push(internalArray[tempx]);\n break;\n }\n }\n this.completeDataSource[cloneDataIndex].push(internalArray);\n }\n else {\n if (!isNullOrUndefined(tempCloneData[tempIndex]) && (tempCloneData[tempIndex][z] ||\n (tempCloneData[tempIndex][z] === 0 &&\n tempCloneData[tempIndex][z].toString() !== ''))) {\n this.completeDataSource[cloneDataIndex].push([tempCloneData[tempIndex][z]]);\n this.tempSizeArray.push(tempCloneData[tempIndex][z]);\n }\n else {\n this.completeDataSource[cloneDataIndex].push('');\n }\n }\n }\n else {\n if (tempCloneData[tempIndex] && (tempCloneData[tempIndex][z] ||\n (tempCloneData[tempIndex][z] === 0 &&\n tempCloneData[tempIndex][z].toString() !== ''))) {\n if (typeof (tempCloneData[tempIndex][z]) === 'object') {\n if (tempCloneData[tempIndex][z].length > 0 && !isNullOrUndefined(tempCloneData[tempIndex][z][0])) {\n this.completeDataSource[cloneDataIndex].push(tempCloneData[tempIndex][z][0]);\n }\n else {\n this.completeDataSource[cloneDataIndex].push('');\n }\n }\n else {\n this.completeDataSource[cloneDataIndex].push(tempCloneData[tempIndex][z]);\n }\n }\n else {\n this.completeDataSource[cloneDataIndex].push('');\n }\n }\n };\n /**\n * To get minimum and maximum value\n * @private\n */\n TwoDimensional.prototype.getMinMaxValue = function (minVal, maxVal, tempVariable) {\n var minMaxValue = [];\n if (this.heatMap.bubbleSizeWithColor) {\n minMaxValue.push(this.getMinValue(minVal, this.tempSizeArray));\n minMaxValue.push(this.getMaxValue(maxVal, this.tempSizeArray));\n this.heatMap.minColorValue = this.getMinValue(this.heatMap.minColorValue, this.tempColorArray);\n this.heatMap.maxColorValue = this.getMaxValue(this.heatMap.maxColorValue, this.tempColorArray);\n }\n else {\n minMaxValue.push(this.getMinValue(minVal, tempVariable));\n minMaxValue.push(this.getMaxValue(maxVal, tempVariable));\n }\n return minMaxValue;\n };\n /**\n * To get minimum value\n * @private\n */\n TwoDimensional.prototype.getMinValue = function (minVal, tempVariable) {\n if (isNullOrUndefined(minVal)) {\n minVal = this.performSort(tempVariable);\n }\n else if (this.performSort(tempVariable) < minVal) {\n minVal = this.performSort(tempVariable);\n }\n return !isNullOrUndefined(minVal) ? parseFloat(minVal.toString()) : minVal;\n };\n /**\n * To get maximum value\n * @private\n */\n TwoDimensional.prototype.getMaxValue = function (maxVal, tempVariable) {\n if (isNullOrUndefined(maxVal) && tempVariable.length > 0) {\n maxVal = Math.max.apply(Math, tempVariable);\n }\n else if (Math.max.apply(Math, tempVariable) > maxVal) {\n maxVal = Math.max.apply(Math, tempVariable);\n }\n return !isNullOrUndefined(maxVal) ? parseFloat(maxVal.toString()) : maxVal;\n };\n /**\n * To perform sort operation.\n * @private\n */\n // tslint:disable-next-line:no-any\n TwoDimensional.prototype.performSort = function (tempVariable) {\n return tempVariable.sort(function (a, b) { return a - b; }).filter(this.checkmin)[0];\n };\n /**\n * To get minimum value\n * @private\n */\n TwoDimensional.prototype.checkmin = function (val) {\n return !isNullOrUndefined(val) && val.toString() !== '';\n };\n return TwoDimensional;\n}());\nexport { TwoDimensional };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty, Complex, Browser, createElement, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { DrawSvgCanvas, TextOption, TextBasic, PathOption, Line, LineOption, GradientPointer } from '../utils/helper';\nimport { Size, measureText, getTitle, getElement, CanvasTooltip, formatValue, LegendRange, ToggleVisibility, sum } from '../utils/helper';\nimport { Font } from '../model/base';\nimport { Rect, RectOption, Gradient, GradientColor, showTooltip, stringToNumber, CurrentLegendRect, removeElement } from '../utils/helper';\nimport { Theme } from '../model/theme';\nimport { Tooltip as tool } from '@syncfusion/ej2-svg-base';\n/**\n * Configures the Legend\n */\nvar LegendSettings = /** @class */ (function (_super) {\n __extends(LegendSettings, _super);\n function LegendSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], LegendSettings.prototype, \"height\", void 0);\n __decorate([\n Property('')\n ], LegendSettings.prototype, \"width\", void 0);\n __decorate([\n Property('Right')\n ], LegendSettings.prototype, \"position\", void 0);\n __decorate([\n Property(true)\n ], LegendSettings.prototype, \"visible\", void 0);\n __decorate([\n Property('Center')\n ], LegendSettings.prototype, \"alignment\", void 0);\n __decorate([\n Property(true)\n ], LegendSettings.prototype, \"showLabel\", void 0);\n __decorate([\n Property(true)\n ], LegendSettings.prototype, \"showGradientPointer\", void 0);\n __decorate([\n Property(false)\n ], LegendSettings.prototype, \"enableSmartLegend\", void 0);\n __decorate([\n Property('All')\n ], LegendSettings.prototype, \"labelDisplayType\", void 0);\n __decorate([\n Complex(Theme.legendLabelFont, Font)\n ], LegendSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property('')\n ], LegendSettings.prototype, \"labelFormat\", void 0);\n __decorate([\n Property(true)\n ], LegendSettings.prototype, \"toggleVisibility\", void 0);\n return LegendSettings;\n}(ChildProperty));\nexport { LegendSettings };\n/**\n *\n * The `Legend` module is used to render legend for the heatmap.\n */\nvar Legend = /** @class */ (function () {\n function Legend(heatMap) {\n this.maxLegendLabelSize = new Size(0, 0);\n this.gradientScaleSize = 10;\n this.segmentCollections = [];\n this.textWrapCollections = [];\n this.labelCollections = [];\n this.legendSize = 10;\n this.previousOptions = new GradientPointer(0, 0, 0, 0, 0, 0);\n this.listPerPage = 0;\n this.numberOfPages = 1;\n this.listWidth = 0;\n this.fillRect = new Rect(0, 0, 0, 0);\n this.legendRect = new Rect(0, 0, 0, 0);\n this.currentPage = 1;\n this.lastList = [];\n this.navigationCollections = [];\n this.pagingRect = new Rect(0, 0, 0, 0);\n this.listInterval = 10; // padding between two lists\n this.legendLabelTooltip = [];\n this.labelXCollections = [];\n this.labelYCollections = [];\n this.legendXCollections = [];\n this.legendYCollections = [];\n /** @private */\n this.legendRectPositionCollection = [];\n /** @private */\n this.legendRange = [];\n /** @private */\n this.legendTextRange = [];\n /** @private */\n this.visibilityCollections = [];\n this.heatMap = heatMap;\n this.drawSvgCanvas = new DrawSvgCanvas(heatMap);\n }\n ;\n /**\n * Get module name\n */\n Legend.prototype.getModuleName = function () {\n return 'Legend';\n };\n /**\n * To destroy the Legend.\n * @return {void}\n * @private\n */\n Legend.prototype.destroy = function (heatMap) {\n /**\n * destory code\n */\n };\n ;\n /**\n * @private\n */\n Legend.prototype.renderLegendItems = function () {\n var heatMap = this.heatMap;\n var tempBorder = {\n color: 'transparent',\n width: 0,\n };\n this.legend = heatMap.renderer.createGroup({ id: heatMap.element.id + '_Heatmap_Legend' });\n var rectItems = new RectOption(heatMap.element.id + '_LegendBound', 'none', tempBorder, 1, this.legendGroup);\n this.drawSvgCanvas.drawRectangle(rectItems, this.legend);\n var legendBound = this.legendRectScale;\n var rectItemsSvg = new Rect(legendBound.x, legendBound.y, legendBound.width, legendBound.height);\n if (heatMap.paletteSettings.type === 'Fixed') {\n var colorCollection = (!heatMap.legendSettings.enableSmartLegend) ?\n heatMap.colorCollection : heatMap.legendColorCollection;\n this.legendRange = (heatMap.resizing || (!heatMap.legendOnLoad && heatMap.rendering)) ? [] : this.legendRange;\n this.legendTextRange = (heatMap.resizing || (!heatMap.legendOnLoad && heatMap.rendering)) ? [] : this.legendTextRange;\n heatMap.toggleValue = [];\n for (var i = 0; i < colorCollection.length; i++) {\n var visibility = !isNullOrUndefined(this.visibilityCollections[i]) ? this.visibilityCollections[i] : true;\n heatMap.toggleValue.push(new ToggleVisibility(visibility, colorCollection[i].value));\n }\n }\n if (heatMap.paletteSettings.type === 'Gradient' || (heatMap.paletteSettings.type === 'Fixed' &&\n heatMap.legendSettings.enableSmartLegend === true)) {\n if (heatMap.paletteSettings.type === 'Gradient') {\n var fill = void 0;\n if (heatMap.enableCanvasRendering) {\n var grd = void 0;\n var ctx = heatMap.canvasRenderer.ctx;\n if (heatMap.horizontalGradient) {\n grd = ctx.createLinearGradient(legendBound.x, 0, legendBound.x + legendBound.width, 0);\n }\n else {\n grd = ctx.createLinearGradient(0, legendBound.y, 0, legendBound.y + legendBound.height);\n }\n for (var i = 0; i < heatMap.legendColorCollection.length; i++) {\n var value = ((heatMap.legendColorCollection[i].value - this.legendMinValue) /\n (this.legendMaxValue - this.legendMinValue));\n value = isNaN(value) ? 0 : value;\n grd.addColorStop(value, heatMap.legendColorCollection[i].color);\n }\n ctx.fillStyle = grd;\n fill = grd.toString();\n }\n else {\n var gradientOptions = void 0;\n var gradientColor = void 0;\n var cgradientColors = [];\n for (var i = 0; i < heatMap.legendColorCollection.length; i++) {\n var gradientPercentage = ((heatMap.legendColorCollection[i].value - this.legendMinValue) /\n (this.legendMaxValue - this.legendMinValue)) * 100;\n gradientPercentage = isNaN(gradientPercentage) ? 0 : gradientPercentage;\n gradientColor = new GradientColor(heatMap.legendColorCollection[i].color, gradientPercentage + '%');\n cgradientColors.push(gradientColor);\n if (this.legendMaxValue === this.legendMinValue) {\n break;\n }\n }\n if (heatMap.horizontalGradient) {\n gradientOptions = new Gradient(heatMap.element.id + '_lineargradient', '0%', '100%', '0%', '0%');\n }\n else {\n gradientOptions = new Gradient(heatMap.element.id + '_lineargradient', '0%', '0%', '0%', '100%');\n }\n var linearGradient = heatMap.renderer.drawGradient('linearGradient', gradientOptions, cgradientColors);\n this.legend.appendChild(linearGradient);\n fill = 'url(#' + heatMap.element.id + '_lineargradient)';\n }\n var rectItem = new RectOption(heatMap.element.id + '_Gradient_Legend', fill, tempBorder, 1, rectItemsSvg);\n this.drawSvgCanvas.drawRectangle(rectItem, this.legend);\n this.renderColorAxisGrid(rectItemsSvg);\n }\n else {\n this.renderSmartLegend();\n }\n if (!heatMap.enableCanvasRendering) {\n heatMap.svgObject.appendChild(this.legend);\n }\n this.renderLegendLabel(rectItemsSvg);\n }\n else {\n this.legendScale = heatMap.renderer.createGroup({ id: heatMap.element.id + 'Heatmap_GradientScale' });\n var listRect = new RectOption(heatMap.element.id + '_Gradient_Scale', 'none', tempBorder, 1, this.legendRectScale);\n this.drawSvgCanvas.drawRectangle(listRect, this.legendScale);\n if (!heatMap.enableCanvasRendering) {\n this.legend.appendChild(this.legendScale);\n }\n this.translategroup = heatMap.renderer.createGroup({ id: heatMap.element.id + '_translate' });\n this.calculateListPerPage(rectItemsSvg);\n if (this.numberOfPages > 1) {\n this.paginggroup = heatMap.renderer.createGroup({ id: heatMap.element.id + '_navigation' });\n }\n this.renderListLegendMode(rectItemsSvg, true);\n }\n };\n Legend.prototype.renderSmartLegend = function () {\n var heatMap = this.heatMap;\n var colorCollection = heatMap.colorCollection;\n var smartLegendRect;\n var tempBorder = {\n color: 'transparent',\n width: 0,\n };\n var legendBound = this.legendRectScale;\n var legendX;\n var legendY;\n var legendWidth;\n var legendHeight;\n var width = legendBound.width / colorCollection.length;\n var height = legendBound.height / colorCollection.length;\n this.legendRectPositionCollection = [];\n this.legendRange = [];\n for (var i = 0; i < heatMap.legendColorCollection.length; i++) {\n var rectPosition = new CurrentLegendRect(0, 0, 0, 0, '', '');\n if (heatMap.horizontalGradient) {\n legendX = legendBound.x + (i * width);\n legendY = legendBound.y;\n legendWidth = width;\n legendHeight = legendBound.height;\n this.segmentCollections.push((heatMap.legendSettings.labelDisplayType === 'Edge' &&\n i === heatMap.legendColorCollection.length - 1 && !heatMap.legendColorCollection[i].isHidden) ?\n legendX + width : legendX);\n }\n else {\n legendX = legendBound.x;\n legendY = legendBound.y + (i * height);\n legendWidth = legendBound.width;\n legendHeight = height;\n this.segmentCollections.push((heatMap.legendSettings.labelDisplayType === 'Edge' &&\n i === heatMap.legendColorCollection.length - 1 && !heatMap.legendColorCollection[i].isHidden) ?\n legendY + height : legendY);\n }\n smartLegendRect = new Rect(legendX, legendY, legendWidth, legendHeight);\n var legendRange = new LegendRange(0, 0, 0, 0, 0, true, 0);\n legendRange.x = legendX;\n legendRange.y = legendY;\n legendRange.width = legendWidth;\n legendRange.height = legendHeight;\n legendRange.value = heatMap.legendColorCollection[i].value;\n legendRange.currentPage = this.currentPage;\n if (colorCollection.length !== heatMap.legendColorCollection.length && i === heatMap.legendColorCollection.length - 1) {\n heatMap.horizontalGradient ? legendRange.width = 0 : legendRange.height = 0;\n this.visibilityCollections[i] = this.visibilityCollections[i - 1];\n }\n legendRange.visible = !isNullOrUndefined(this.visibilityCollections[i]) ? this.visibilityCollections[i] : true;\n this.legendRange.push(legendRange);\n if (!heatMap.legendColorCollection[i].isHidden) {\n var color = heatMap.legendOnLoad ? colorCollection[i].color :\n this.legendRange[i].visible ? colorCollection[i].color : '#D3D3D3';\n var rectItem = new RectOption(heatMap.element.id + '_Smart_Legend' + i, color, tempBorder, 1, smartLegendRect);\n this.drawSvgCanvas.drawRectangle(rectItem, this.legend);\n rectPosition.x = legendX;\n rectPosition.y = legendY;\n rectPosition.width = legendWidth;\n rectPosition.height = legendHeight;\n rectPosition.label = this.labelCollections[i];\n rectPosition.id = heatMap.element.id + '_Smart_Legend' + i;\n this.legendRectPositionCollection.push(rectPosition);\n var text = getTitle(this.labelCollections[i], heatMap.legendSettings.textStyle, this.textWrapCollections[i]);\n if (text.length !== 0 && heatMap.enableCanvasRendering) {\n var elementSize = measureText(this.labelCollections[i], heatMap.legendSettings.textStyle);\n this.legendLabelTooltip.push(new CanvasTooltip(this.labelCollections[i], new Rect(rectPosition.x, rectPosition.y, elementSize.width, elementSize.height)));\n }\n }\n }\n };\n Legend.prototype.renderLegendLabel = function (rect) {\n var heatMap = this.heatMap;\n this.legendTextRange = [];\n if (heatMap.legendSettings.showLabel && (heatMap.paletteSettings.type === 'Gradient' ||\n (heatMap.paletteSettings.type === 'Fixed' && heatMap.legendSettings.labelDisplayType !== 'None'))) {\n var anchor = void 0;\n var dominantBaseline = void 0;\n var legendLabel = void 0;\n var textWrapWidth = 0;\n var text = void 0;\n this.legendLabelTooltip = [];\n var elementSize = void 0;\n var colorCollection = heatMap.legendColorCollection;\n if (heatMap.enableCanvasRendering) {\n var ctx = heatMap.canvasRenderer.ctx;\n ctx.rect(this.legendGroup.x, this.legendGroup.y, this.legendGroup.width, this.legendGroup.height);\n ctx.save();\n ctx.clip();\n ctx.restore();\n }\n else {\n legendLabel = heatMap.renderer.createGroup({ id: heatMap.element.id + '_Heatmap_LegendLabel' });\n }\n var labelX = void 0;\n var labelY = void 0;\n for (var i = 0; i < colorCollection.length; i++) {\n var value = ((colorCollection[i].value - this.legendMinValue) /\n (this.legendMaxValue - this.legendMinValue)) * 100;\n if (heatMap.horizontalGradient) {\n labelX = this.segmentCollections[i];\n labelY = rect.y + rect.height + this.labelPadding;\n anchor = (value === 0 || (i === 0 && heatMap.paletteSettings.type === 'Fixed')) ? 'start' :\n (heatMap.dataSourceMaxValue === colorCollection[i].value) || (heatMap.legendSettings.enableSmartLegend &&\n heatMap.legendSettings.labelDisplayType === 'Edge') ? 'end' : 'middle';\n dominantBaseline = 'hanging';\n }\n else {\n labelX = rect.x + rect.width + this.labelPadding;\n labelY = this.segmentCollections[i];\n dominantBaseline = (value === 0 || (i === 0 && heatMap.paletteSettings.type === 'Fixed')) ? 'hanging' :\n (heatMap.dataSourceMaxValue === colorCollection[i].value) || (heatMap.legendSettings.enableSmartLegend &&\n heatMap.legendSettings.labelDisplayType === 'Edge') ? 'baseline' : 'middle';\n }\n textWrapWidth = heatMap.horizontalGradient ? this.textWrapCollections[i] : this.width - (this.legendRectScale.width +\n this.labelPadding + this.legendRectPadding);\n text = getTitle(this.labelCollections[i], heatMap.legendSettings.textStyle, textWrapWidth);\n elementSize = measureText(text[0], heatMap.legendSettings.textStyle);\n if (heatMap.paletteSettings.type === 'Fixed') {\n var rectY = dominantBaseline === 'hanging' ? labelY : dominantBaseline === 'middle' ?\n labelY - elementSize.height / 2 : labelY - elementSize.height;\n var rectX = anchor === 'end' ? labelX - elementSize.width : anchor === 'middle' ?\n labelX - elementSize.width / 2 : labelX;\n var textPosition = new LegendRange(rectX, rectY, elementSize.width, elementSize.height, colorCollection[i].value, true, this.currentPage);\n textPosition.visible = !isNullOrUndefined(this.visibilityCollections[i]) ? this.visibilityCollections[i] : true;\n this.legendTextRange.push(textPosition);\n }\n if (this.labelCollections[i] !== '') {\n if (text.length !== 0 && text[0].indexOf('...') !== -1 && heatMap.enableCanvasRendering) {\n this.legendLabelTooltip.push(new CanvasTooltip(this.labelCollections[i], new Rect(labelX, labelY, elementSize.width, elementSize.height)));\n }\n var textBasic = new TextBasic(labelX, labelY, anchor, text, 0, 'translate(0,0)', dominantBaseline);\n var options = new TextOption(heatMap.element.id + '_Legend_Label' + i, textBasic, heatMap.legendSettings.textStyle, heatMap.legendSettings.textStyle.color || heatMap.themeStyle.legendLabel);\n options.fill = heatMap.legendOnLoad ? options.fill :\n (heatMap.paletteSettings.type === 'Fixed' && !this.legendRange[i].visible) ? '#D3D3D3' : options.fill;\n if (text.length > 1) {\n this.drawSvgCanvas.createWrapText(options, heatMap.legendSettings.textStyle, legendLabel);\n }\n else {\n this.drawSvgCanvas.createText(options, legendLabel, text[0]);\n }\n if (Browser.isIE && !heatMap.enableCanvasRendering) {\n if (dominantBaseline === 'middle') {\n legendLabel.lastChild.setAttribute('dy', '0.6ex');\n }\n else if (dominantBaseline === 'hanging') {\n legendLabel.lastChild.setAttribute('dy', '1.5ex');\n }\n }\n }\n if (this.legendMaxValue === this.legendMinValue && heatMap.paletteSettings.type === 'Gradient') {\n break;\n }\n }\n if (!heatMap.enableCanvasRendering) {\n this.legendGroup.height = this.legendGroup.height > 0 ? this.legendGroup.height : 0;\n this.legendGroup.width = this.legendGroup.width > 0 ? this.legendGroup.width : 0;\n this.legend.appendChild(legendLabel);\n var clippath = heatMap.renderer.createClipPath({ id: heatMap.element.id + '_clipPath' });\n var clipRect = heatMap.renderer.drawRectangle(this.legendGroup);\n clippath.appendChild(clipRect);\n heatMap.svgObject.appendChild(clippath);\n this.legend.setAttribute('style', 'clip-path:url(#' + clippath.id + ')');\n }\n }\n };\n /**\n * @private\n */\n Legend.prototype.renderGradientPointer = function (e, pageX, pageY) {\n var heatMap = this.heatMap;\n var currentRect = heatMap.heatMapSeries.getCurrentRect(pageX, pageY);\n var cellValue = heatMap.bubbleSizeWithColor ? currentRect.value[0].bubbleData.toString() !== '' ?\n !this.heatMap.isColorValueExist ? currentRect.value[0].bubbleData.toString() :\n currentRect.value[1].bubbleData.toString() : '' : currentRect.value.toString();\n var rect = this.legendRectScale;\n var legendPart;\n var direction;\n var options;\n var legendPath;\n var pathX1;\n var pathY1;\n var pathX2;\n var pathY2;\n var pathX3;\n var pathY3;\n if (cellValue.toString() !== '') {\n if (!heatMap.horizontalGradient) {\n legendPart = rect.height / 100;\n legendPath = legendPart * ((Number(cellValue) - this.legendMinValue) /\n (this.legendMaxValue - this.legendMinValue)) * 100;\n legendPath = isNaN(legendPath) ? 0 : legendPath;\n pathX1 = rect.x - 1;\n pathY1 = rect.y + legendPath;\n pathX2 = pathX3 = rect.x - 8;\n pathY2 = rect.y - 5 + legendPath;\n pathY3 = rect.y + 5 + legendPath;\n }\n else {\n legendPart = rect.width / 100;\n legendPath = legendPart * ((Number(cellValue) - this.legendMinValue) /\n (this.legendMaxValue - this.legendMinValue)) * 100;\n legendPath = isNaN(legendPath) ? 0 : legendPath;\n pathX1 = rect.x + legendPath;\n pathY1 = rect.y + rect.height;\n pathX2 = rect.x - 5 + legendPath;\n pathY2 = pathY3 = rect.y + rect.height + 8;\n pathX3 = rect.x + 5 + legendPath;\n }\n direction = 'M' + ' ' + pathX1 + ' ' + pathY1 + ' ' +\n 'L' + ' ' + pathX2 + ' ' + pathY2 + ' ' + 'L' + ' ' + pathX3 + ' ' + pathY3 + ' ' + 'Z';\n options = new PathOption(heatMap.element.id + '_Gradient_Pointer', 'gray', 0.01, '#A0A0A0', 1, '0,0', direction);\n if (!heatMap.enableCanvasRendering) {\n this.gradientPointer = heatMap.renderer.drawPath(options);\n this.gradientPointer.style.visibility = 'visible';\n this.legend.appendChild(this.gradientPointer);\n }\n else {\n this.removeGradientPointer();\n var canvasTranslate = void 0;\n heatMap.canvasRenderer.drawPath(options, canvasTranslate);\n this.previousOptions.pathX1 = pathX1;\n this.previousOptions.pathY1 = pathY1;\n this.previousOptions.pathX2 = pathX2;\n this.previousOptions.pathY2 = pathY2;\n this.previousOptions.pathX3 = pathX3;\n this.previousOptions.pathY3 = pathY3;\n }\n }\n else {\n this.removeGradientPointer();\n }\n };\n /**\n * @private\n */\n Legend.prototype.removeGradientPointer = function () {\n var heatMap = this.heatMap;\n if (this.gradientPointer && !heatMap.enableCanvasRendering) {\n this.gradientPointer.style.visibility = 'hidden';\n }\n else if (heatMap.enableCanvasRendering) {\n if (Object.keys(this.previousOptions).length !== 0) {\n if (heatMap.horizontalGradient) {\n this.fillRect.x = this.previousOptions.pathX2 - 1;\n this.fillRect.y = this.previousOptions.pathY1;\n this.fillRect.width = this.previousOptions.pathX3 - this.previousOptions.pathX2 + 2;\n this.fillRect.height = this.previousOptions.pathY2 + 1 - this.previousOptions.pathY1;\n }\n else {\n this.fillRect.x = this.previousOptions.pathX2 - 1;\n this.fillRect.y = this.previousOptions.pathY2 - 1;\n this.fillRect.width = this.previousOptions.pathX1 - this.previousOptions.pathX2 + 1;\n this.fillRect.height = this.previousOptions.pathY3 - this.previousOptions.pathY2 + 2;\n }\n }\n heatMap.canvasRenderer.ctx.fillStyle = heatMap.themeStyle.background;\n heatMap.canvasRenderer.ctx.fillRect(this.fillRect.x, this.fillRect.y, this.fillRect.width, this.fillRect.height);\n }\n };\n /**\n * @private\n */\n Legend.prototype.calculateLegendBounds = function (rect) {\n var heatMap = this.heatMap;\n var legendSettings = heatMap.legendSettings;\n var colorCollection = heatMap.legendColorCollection;\n this.labelCollections = [];\n if (legendSettings.position !== 'Bottom' && legendSettings.position !== 'Top' &&\n legendSettings.position !== 'Right' && legendSettings.position !== 'Left') {\n legendSettings.position = 'Right';\n }\n heatMap.horizontalGradient = legendSettings.position === 'Bottom' || legendSettings.position === 'Top';\n this.legendRectPadding = heatMap.horizontalGradient ? 16 : 10; // padding between rect and legend\n this.labelPadding = legendSettings.showLabel ? this.heatMap.horizontalGradient ? 10 : 6 : 0; // padding between list and label\n this.legendHeight = legendSettings.height;\n this.legendWidth = legendSettings.width;\n var format = heatMap.legendSettings.labelFormat;\n var isCustom = format.match('{value}') !== null;\n this.format = heatMap.intl.getNumberFormat({\n format: isCustom ? '' : format\n });\n if (heatMap.paletteSettings.type === 'Fixed') {\n for (var i = 0; i < colorCollection.length; i++) {\n var label = colorCollection[i].label ? colorCollection[i].label :\n formatValue(isCustom, format, colorCollection[i].value, this.format).toString();\n if (heatMap.legendSettings.enableSmartLegend && heatMap.legendSettings.labelDisplayType === 'Edge'\n && i > 0 && i < colorCollection.length - 1) {\n this.labelCollections.push('');\n }\n else {\n this.labelCollections.push(label);\n }\n }\n }\n else {\n for (var i = 0; i < colorCollection.length; i++) {\n var label = colorCollection[i].isHidden ? '' : colorCollection[i].label ?\n colorCollection[i].label : formatValue(isCustom, format, colorCollection[i].value, this.format).toString();\n this.labelCollections.push(label);\n }\n }\n if (heatMap.paletteSettings.type === 'Gradient' || (heatMap.paletteSettings.type === 'Fixed' &&\n heatMap.legendSettings.enableSmartLegend)) {\n this.maxLegendLabelSize = this.getMaxLabelSize();\n if (heatMap.horizontalGradient && legendSettings.height === '') {\n this.legendHeight = ((2 * this.legendRectPadding) + this.legendSize + this.maxLegendLabelSize.height).toString();\n }\n else if (!heatMap.horizontalGradient && legendSettings.width === '' && (legendSettings.textStyle.textOverflow === 'None' ||\n (heatMap.paletteSettings.type === 'Fixed' && heatMap.legendSettings.enableSmartLegend &&\n heatMap.legendSettings.labelDisplayType === 'None'))) {\n this.legendWidth = ((2 * this.legendRectPadding) + this.legendSize + this.maxLegendLabelSize.width).toString();\n }\n }\n else {\n this.calculateListLegendBounds(rect);\n }\n this.legendHeight = this.legendHeight ? this.legendHeight : heatMap.horizontalGradient ? '50' : '100%';\n this.legendWidth = this.legendWidth ? this.legendWidth : heatMap.horizontalGradient ?\n '100%' : heatMap.paletteSettings.type === 'Fixed' && !heatMap.legendSettings.enableSmartLegend ? '70' : '50';\n this.height = stringToNumber(this.legendHeight, rect.height);\n this.width = stringToNumber(this.legendWidth, rect.width);\n if (heatMap.horizontalGradient) {\n this.height = heatMap.paletteSettings.type === 'Gradient' || heatMap.legendSettings.enableSmartLegend ?\n this.height < 50 ? 50 : this.height : this.height;\n if (legendSettings.position === 'Top') {\n rect.y += this.height;\n }\n rect.height -= this.height;\n }\n else {\n this.width = heatMap.paletteSettings.type === 'Gradient' || heatMap.legendSettings.enableSmartLegend ?\n this.width < 50 ? 50 : this.width : this.width;\n if (legendSettings.position === 'Left') {\n rect.x += this.width;\n }\n rect.width -= this.width;\n }\n };\n Legend.prototype.calculateListLegendBounds = function (rect) {\n var heatMap = this.heatMap;\n this.listWidth = 0;\n this.listHeight = 0;\n this.currentPage = 1;\n var padding = 10; // padding of paging elements\n if (heatMap.horizontalGradient) {\n for (var i = 0; i < heatMap.colorCollection.length; i++) {\n var size = 0;\n if (heatMap.legendSettings.showLabel) {\n var text = this.labelCollections[i];\n size = measureText(text, heatMap.legendSettings.textStyle).width;\n }\n var perListWidth = this.legendSize + this.labelPadding + size + this.listInterval;\n this.listWidth += perListWidth;\n }\n this.listWidth += this.listInterval + padding;\n if (this.legendWidth === '') {\n this.legendWidth = this.listWidth > rect.width ? rect.width.toString() : this.listWidth.toString();\n }\n if (this.legendHeight === '') {\n this.numberOfRows = Math.ceil(this.listWidth / stringToNumber(this.legendWidth, rect.width));\n this.numberOfRows = this.numberOfRows > 3 ? 3 : this.numberOfRows;\n this.legendHeight = (this.listWidth > rect.width || this.listWidth > stringToNumber(this.legendWidth, rect.width)) &&\n this.numberOfRows > 3 ? (((this.legendSize + this.listInterval) * this.numberOfRows) + this.legendRectPadding +\n parseInt(heatMap.legendSettings.textStyle.size, 10) + padding).toString() :\n (((this.legendSize + this.listInterval) * this.numberOfRows) + this.legendRectPadding).toString();\n }\n }\n else {\n this.listHeight = ((this.legendSize + this.listInterval) * heatMap.colorCollection.length) + this.listInterval;\n if (this.legendHeight === '') {\n this.legendHeight = this.listHeight > rect.height ? rect.height.toString() : this.listHeight.toString();\n }\n if (this.legendWidth === '' && heatMap.legendSettings.textStyle.textOverflow !== 'Trim') {\n this.maxLegendLabelSize = this.getMaxLabelSize();\n this.legendWidth = ((2 * this.legendRectPadding) + this.legendSize + this.labelPadding +\n this.maxLegendLabelSize.width).toString();\n }\n }\n if (stringToNumber(this.legendHeight, rect.height) < 50) {\n this.legendHeight = '50';\n }\n if (stringToNumber(this.legendWidth, rect.width) < 70) {\n this.legendWidth = '70';\n }\n };\n Legend.prototype.getMaxLabelSize = function () {\n var heatMap = this.heatMap;\n this.maxLegendLabelSize = new Size(0, 0);\n if (!heatMap.legendSettings.showLabel || (heatMap.horizontalGradient && heatMap.paletteSettings.type === 'Fixed' &&\n !heatMap.legendSettings.enableSmartLegend) || (heatMap.paletteSettings.type === 'Fixed' &&\n heatMap.legendSettings.labelDisplayType === 'None')) {\n return this.maxLegendLabelSize;\n }\n else {\n var labelSize = this.maxLegendLabelSize;\n for (var i = 0; i < heatMap.legendColorCollection.length; i++) {\n var size = measureText(this.labelCollections[i], heatMap.legendSettings.textStyle);\n labelSize.width = (labelSize.width > size.width) ? labelSize.width : size.width;\n labelSize.height = (labelSize.height > size.height) ? labelSize.height : size.height;\n }\n return labelSize;\n }\n };\n /**\n * @private\n */\n Legend.prototype.calculateLegendSize = function (rect, legendTop) {\n var heatMap = this.heatMap;\n var legendSettings = heatMap.legendSettings;\n var left;\n var top;\n var padding = 10; // inner padding for axis title and axil labels\n var alignment = legendSettings.alignment;\n var height = stringToNumber(this.legendHeight, rect.height);\n var width = stringToNumber(this.legendWidth, rect.width);\n var axis = heatMap.axisCollections;\n var axisTitlePadding = 0;\n if (heatMap.horizontalGradient) {\n width = width > rect.width ? rect.width : width;\n height = heatMap.paletteSettings.type === 'Gradient' || heatMap.legendSettings.enableSmartLegend ?\n height > 50 ? height : 50 : this.height;\n left = alignment === 'Near' ? rect.x : alignment === 'Far' ? rect.x + rect.width - width :\n rect.x + (rect.width / 2) - (width / 2);\n if (heatMap.xAxis.title.text !== '') {\n axisTitlePadding = measureText(heatMap.xAxis.title.text, heatMap.xAxis.textStyle).height + padding;\n }\n var axisHeight = axis[0].opposedPosition ? 0 : sum(axis[0].xAxisMultiLabelHeight) + axis[0].maxLabelSize.height +\n axisTitlePadding + padding;\n top = legendSettings.position === 'Top' ? heatMap.titleSettings.text ? legendTop :\n heatMap.margin.top : rect.y + rect.height + axisHeight;\n }\n else {\n height = height > rect.height ? rect.height : height;\n width = heatMap.paletteSettings.type === 'Gradient' || heatMap.legendSettings.enableSmartLegend ?\n width > 50 ? width : 50 : width;\n top = alignment === 'Near' ? rect.y : alignment === 'Far' ? rect.y + rect.height - height :\n rect.y + (rect.height / 2) - (height / 2);\n if (heatMap.yAxis.title.text !== '') {\n axisTitlePadding = measureText(heatMap.yAxis.title.text, heatMap.yAxis.textStyle).height + padding;\n }\n var axisWidth = axis[1].opposedPosition ? sum(axis[1].yAxisMultiLabelHeight) +\n axis[1].maxLabelSize.width + axisTitlePadding + 2 * padding : 0;\n left = legendSettings.position === 'Right' ? rect.x + rect.width + axisWidth : heatMap.margin.left;\n }\n this.legendGroup = new Rect(left, top, width, height);\n this.calculateGradientScale(this.legendGroup);\n };\n // calculating number of lists per page\n Legend.prototype.measureListLegendBound = function (rect) {\n var heatMap = this.heatMap;\n var padding = 15; // padding of paging element\n this.numberOfPages = 1;\n if (heatMap.horizontalGradient) {\n if (this.listWidth > this.width) {\n this.numberOfRows = Math.ceil(this.listWidth / this.width);\n this.listHeight = ((this.legendSize + this.listInterval) * this.numberOfRows);\n this.listPerPage = this.numberOfRows <= 3 ? this.numberOfRows : Math.ceil((this.height - padding -\n parseInt(heatMap.legendSettings.textStyle.size, 10) -\n this.legendRectPadding) / (this.legendSize + this.listInterval));\n this.numberOfPages = Math.ceil(this.numberOfRows / this.listPerPage);\n }\n else {\n this.listPerPage = 1;\n }\n }\n else {\n if (this.listHeight > rect.height || this.listHeight > this.height) {\n var maxHeight = stringToNumber(this.legendHeight, rect.height);\n maxHeight = maxHeight > rect.height ? rect.height : maxHeight;\n this.listPerPage = Math.floor(maxHeight / (this.legendSize + this.listInterval) - 1);\n this.numberOfPages = Math.max(1, Math.ceil(heatMap.colorCollection.length / this.listPerPage));\n }\n else {\n this.listPerPage = heatMap.colorCollection.length;\n this.legendHeight = this.listHeight.toString();\n }\n }\n };\n Legend.prototype.renderPagingElements = function () {\n var heatMap = this.heatMap;\n if (this.numberOfPages > 1) {\n this.navigationCollections = [];\n this.legend.appendChild(this.paginggroup);\n var iconSize = 10;\n var rightArrowX = this.legendGroup.x + this.legendGroup.width - iconSize;\n var rightArrowY = this.legendGroup.y + this.legendGroup.height - iconSize;\n var text = this.currentPage + '/' + this.numberOfPages;\n var textSize = measureText(text, heatMap.legendSettings.textStyle);\n var textX = rightArrowX - textSize.width - 15;\n var textBasic = new TextBasic(textX, rightArrowY, 'start', text, 0, 'translate(0,0)', 'middle');\n var options = new TextOption(heatMap.element.id + '_paging', textBasic, heatMap.legendSettings.textStyle, heatMap.legendSettings.textStyle.color || heatMap.themeStyle.legendLabel);\n this.drawSvgCanvas.createText(options, this.paginggroup, text);\n if (Browser.isIE && !heatMap.enableCanvasRendering) {\n this.paginggroup.lastChild.setAttribute('dy', '0.6ex');\n }\n this.pagingRect = new Rect(textX, rightArrowY - textSize.height / 2, textSize.width, textSize.height);\n var pagingTextRect = new RectOption(heatMap.element.id + '_pagingText', 'none', { color: 'transparent', width: 0 }, 1, this.pagingRect);\n this.drawSvgCanvas.drawRectangle(pagingTextRect, this.paginggroup);\n var rightArrowRect = new RectOption(heatMap.element.id + '_rightArrow', 'none', { color: 'transparent', width: 0 }, 1, new Rect(rightArrowX - iconSize, rightArrowY - iconSize / 2, iconSize, iconSize));\n this.drawSvgCanvas.drawRectangle(rightArrowRect, this.paginggroup);\n var rightArrow = 'M' + ' ' + (rightArrowX) + ' ' + rightArrowY + ' ' +\n 'L' + ' ' + (rightArrowX - iconSize) + ' ' + (rightArrowY - iconSize / 2) + ' ' + 'L' + ' ' +\n (rightArrowX - iconSize) + ' ' + (rightArrowY + (iconSize / 2)) + 'Z';\n var leftX = textX - 15;\n var leftArrow = 'M' + ' ' + leftX + ' ' + rightArrowY + ' ' +\n 'L' + ' ' + (leftX + iconSize) + ' ' + (rightArrowY - iconSize / 2) + ' ' + 'L' + ' ' +\n (leftX + iconSize) + ' ' + (rightArrowY + (iconSize / 2)) + 'Z';\n var leftArrowRect = new RectOption(heatMap.element.id + '_leftArrow', 'none', { color: 'transparent', width: 0 }, 1, new Rect(leftX, rightArrowY - iconSize / 2, iconSize, iconSize));\n this.drawSvgCanvas.drawRectangle(leftArrowRect, this.paginggroup);\n var leftOption = new PathOption(heatMap.element.id + '_Legend_leftarrow', 'gray', 0.01, '#A0A0A0', 1, '0,0', leftArrow);\n var rightOption = new PathOption(heatMap.element.id + '_Legend_rightarrow', 'gray', 0.01, '#A0A0A0', 1, '0,0', rightArrow);\n this.navigationCollections.push(rightArrowRect);\n this.navigationCollections.push(leftArrowRect);\n if (!heatMap.enableCanvasRendering) {\n var arrow = heatMap.renderer.drawPath(leftOption);\n var rightarrow = heatMap.renderer.drawPath(rightOption);\n this.paginggroup.appendChild(arrow);\n this.paginggroup.appendChild(rightarrow);\n }\n else {\n var canvasTranslate = void 0;\n heatMap.canvasRenderer.drawPath(leftOption, canvasTranslate);\n heatMap.canvasRenderer.drawPath(rightOption, canvasTranslate);\n }\n }\n };\n Legend.prototype.calculateGradientScale = function (scale) {\n var heatMap = this.heatMap;\n var padding = 10; // padding between legend bounds and gradient scale\n var left;\n var top;\n var height;\n var width;\n if (heatMap.paletteSettings.type === 'Fixed' && !heatMap.legendSettings.enableSmartLegend) {\n this.measureListLegendBound(heatMap.initialClipRect);\n }\n if (heatMap.horizontalGradient) {\n left = scale.x + padding;\n top = scale.y + this.legendRectPadding;\n width = heatMap.paletteSettings.type === 'Fixed' && !heatMap.legendSettings.enableSmartLegend ?\n scale.width - (2 * this.listInterval) : scale.width - 2 * padding;\n height = heatMap.paletteSettings.type === 'Fixed' && !heatMap.legendSettings.enableSmartLegend ?\n (this.legendSize + this.listInterval) * this.listPerPage - this.listInterval : this.gradientScaleSize;\n }\n else {\n left = scale.x + this.legendRectPadding;\n top = scale.y + padding;\n width = (heatMap.paletteSettings.type === 'Fixed' && !heatMap.legendSettings.enableSmartLegend) ?\n scale.width - padding : this.gradientScaleSize;\n height = heatMap.paletteSettings.type === 'Fixed' && !heatMap.legendSettings.enableSmartLegend ?\n (this.legendSize + this.listInterval) * this.listPerPage - this.listInterval : scale.height - 2 * padding;\n }\n this.legendRectScale = new Rect(left, top, width, height);\n if (heatMap.paletteSettings.type === 'Gradient' || heatMap.paletteSettings.type === 'Fixed' &&\n heatMap.legendSettings.enableSmartLegend) {\n this.calculateColorAxisGrid(this.legendRectScale);\n }\n };\n Legend.prototype.calculateColorAxisGrid = function (legendRect) {\n var heatMap = this.heatMap;\n var rect = this.legendRectScale;\n var legendPart;\n var text;\n var maxTextWrapLength = 0;\n this.segmentCollections = [];\n this.textWrapCollections = [];\n var pathX1;\n var pathY1;\n var colorCollection = heatMap.paletteSettings.type === 'Gradient' ?\n heatMap.legendColorCollection : heatMap.colorCollection;\n var minValue = heatMap.bubbleSizeWithColor ? heatMap.minColorValue : heatMap.dataSourceMinValue;\n var maxValue = heatMap.bubbleSizeWithColor ? heatMap.maxColorValue : heatMap.dataSourceMaxValue;\n this.legendMinValue = colorCollection[0].value > minValue ? minValue : colorCollection[0].value;\n this.legendMaxValue = colorCollection[colorCollection.length - 1].value < maxValue ? maxValue :\n colorCollection[colorCollection.length - 1].value;\n if (heatMap.paletteSettings.type === 'Gradient') {\n for (var index = 0; index < colorCollection.length; index++) {\n var value = ((colorCollection[index].value - this.legendMinValue) /\n (this.legendMaxValue - this.legendMinValue)) * 100;\n value = isNaN(value) ? 0 : value;\n if (!heatMap.horizontalGradient) {\n legendPart = rect.height / 100;\n pathY1 = legendRect.y + (legendPart * value);\n this.segmentCollections.push(pathY1);\n }\n else {\n legendPart = rect.width / 100;\n pathX1 = legendRect.x + (legendPart * value);\n this.segmentCollections.push(pathX1);\n }\n }\n }\n var textWrapWidth;\n if (heatMap.horizontalGradient) {\n for (var i = 0; i < colorCollection.length; i++) {\n if (heatMap.paletteSettings.type === 'Gradient') {\n var previousSegmentWidth = (this.segmentCollections[i] - this.segmentCollections[i - 1]) / 2;\n var nextSegmentWidth = (this.segmentCollections[i + 1] - this.segmentCollections[i]) / 2;\n if (i === colorCollection.length - 1) {\n textWrapWidth = previousSegmentWidth;\n }\n else if (i === 0) {\n textWrapWidth = nextSegmentWidth;\n }\n else {\n textWrapWidth = previousSegmentWidth < nextSegmentWidth ? previousSegmentWidth : nextSegmentWidth;\n }\n }\n else {\n var width = this.legendRectScale.width / heatMap.colorCollection.length;\n textWrapWidth = heatMap.legendSettings.labelDisplayType === 'Edge' ? width : width / 2;\n }\n this.textWrapCollections.push(textWrapWidth);\n text = getTitle(this.labelCollections[i], heatMap.legendSettings.textStyle, textWrapWidth);\n maxTextWrapLength = text.length > maxTextWrapLength ? text.length : maxTextWrapLength;\n }\n if (heatMap.legendSettings.position === 'Bottom') {\n heatMap.initialClipRect.height -= (this.maxLegendLabelSize.height * (maxTextWrapLength - 1));\n this.legendGroup.y -= (this.maxLegendLabelSize.height * (maxTextWrapLength - 1));\n this.legendRectScale.y = this.legendGroup.y + this.legendRectPadding;\n this.legendGroup.height = parseInt(this.legendHeight, 10) + (this.maxLegendLabelSize.height * (maxTextWrapLength - 1));\n }\n else {\n heatMap.initialClipRect.y += (this.maxLegendLabelSize.height * (maxTextWrapLength - 1));\n heatMap.initialClipRect.height -= (this.maxLegendLabelSize.height * (maxTextWrapLength - 1));\n this.legendRectScale.y = this.legendGroup.y + this.legendRectPadding;\n this.legendGroup.height = parseInt(this.legendHeight, 10) + (this.maxLegendLabelSize.height * (maxTextWrapLength - 1));\n }\n }\n };\n Legend.prototype.renderColorAxisGrid = function (legendRect) {\n var heatMap = this.heatMap;\n var legendElement;\n var pathX1;\n var pathY1;\n var pathX2;\n var pathY2;\n if (!heatMap.enableCanvasRendering) {\n legendElement = this.heatMap.renderer.createGroup({ id: heatMap.element.id + '_ColorAxis_Grid' });\n }\n for (var i = 0; i < heatMap.legendColorCollection.length; i++) {\n if (!heatMap.horizontalGradient) {\n pathX1 = legendRect.x;\n pathY1 = pathY2 = this.segmentCollections[i];\n pathX2 = legendRect.x + legendRect.width;\n }\n else {\n pathX1 = pathX2 = this.segmentCollections[i];\n pathY1 = legendRect.y;\n pathY2 = legendRect.y + legendRect.height;\n }\n var direction = new Line(pathX1, pathY1, pathX2, pathY2);\n var line = new LineOption(this.heatMap.element.id + '_ColorAxis_Grid' + i, direction, '#EEEEEE', 1);\n this.drawSvgCanvas.drawLine(line, legendElement);\n if (!heatMap.enableCanvasRendering) {\n this.legend.appendChild(legendElement);\n }\n }\n };\n /**\n * @private\n */\n Legend.prototype.renderLegendLabelTooltip = function (e) {\n var x = this.heatMap.mouseX;\n var y = this.heatMap.mouseY;\n if (e.target.id.indexOf('_Legend_Label') !== -1 && e.target.textContent.indexOf('...') > -1) {\n var targetId = e.target.id.split(this.heatMap.element.id + '_Legend_Label');\n if (targetId.length === 2) {\n var index = void 0;\n if (targetId[1].length === 1 || this.heatMap.legendSettings.textStyle.textOverflow === 'Trim') {\n index = parseInt(targetId[1], 10);\n }\n else {\n index = parseInt(targetId[1].substring(0, targetId[1].length - 1), 10);\n }\n showTooltip(this.labelCollections[index], x, y, this.heatMap.element.offsetWidth, this.heatMap.element.id + '_LegendLabel_Tooltip', getElement(this.heatMap.element.id + '_Secondary_Element'), null, this.heatMap);\n document.getElementById(this.heatMap.element.id + '_LegendLabel_Tooltip').style.visibility = 'visible';\n }\n }\n else {\n var element = document.getElementById(this.heatMap.element.id + '_LegendLabel_Tooltip');\n if (element) {\n element.style.visibility = 'hidden';\n }\n }\n };\n Legend.prototype.calculateListPerPage = function (rect) {\n var heatMap = this.heatMap;\n if (heatMap.horizontalGradient) {\n this.lastList = [];\n var legendX = rect.x;\n var legendY = rect.y;\n var size = 0;\n var division = 0;\n var labelX = 0;\n var labelY = 0;\n var interval = 20;\n var i = void 0;\n var legendSize = 10;\n var padding = 5;\n this.labelXCollections = [];\n this.labelYCollections = [];\n this.legendXCollections = [];\n this.legendYCollections = [];\n for (i = 0; i < heatMap.colorCollection.length; i++) {\n if (heatMap.legendSettings.showLabel) {\n var text = this.labelCollections[i];\n size = measureText(text, heatMap.legendSettings.textStyle).width;\n }\n labelX = legendX + legendSize + padding;\n labelY = legendY + padding;\n var maxWidth = heatMap.legendSettings.showLabel ? labelX + size : legendX + this.legendSize + this.listInterval;\n if (i !== 0 && maxWidth > this.legendGroup.width + this.legendGroup.x - this.listInterval) {\n division += 1;\n legendX = rect.x;\n legendY = rect.y + (division * interval);\n labelX = legendX + legendSize + padding;\n labelY = legendY + padding;\n if (division % (this.listPerPage) === 0) {\n this.lastList.push(i);\n legendY = rect.y;\n labelY = legendY + padding;\n division = 0;\n }\n }\n this.labelXCollections.push(labelX);\n this.labelYCollections.push(labelY);\n this.legendXCollections.push(legendX);\n this.legendYCollections.push(legendY);\n legendX = legendX + this.legendSize + this.labelPadding + size + this.listInterval;\n }\n this.lastList.push(i);\n this.numberOfPages = this.lastList.length;\n }\n };\n Legend.prototype.renderListLegendMode = function (rect, translate) {\n var heatMap = this.heatMap;\n var legendSize = 10;\n var tempBorder = {\n color: 'transparent',\n width: 0,\n };\n var padding = 5; // padding for legend label from top\n this.legendLabelTooltip = [];\n var listRect;\n var size = new Size(0, 0);\n var division = 0;\n var labelX = 0;\n var labelY = 0;\n var legendX = rect.x;\n var legendY = rect.y;\n if (translate) {\n this.renderPagingElements();\n }\n var x;\n var y;\n var textWrapWidth = this.legendGroup.width - (this.legendSize +\n this.legendRectPadding + this.labelPadding);\n if (!heatMap.horizontalGradient) {\n x = (this.currentPage * (this.listPerPage)) - (this.listPerPage);\n y = x + this.listPerPage;\n y = y < heatMap.colorCollection.length ? y : heatMap.colorCollection.length;\n }\n else {\n x = this.currentPage === 1 ? 0 : this.lastList[this.currentPage - 2];\n y = this.lastList[this.currentPage - 1];\n }\n for (var i = x; i < y; i++) {\n if (heatMap.legendSettings.showLabel) {\n var text = this.labelCollections[i];\n size = measureText(text, heatMap.legendSettings.textStyle);\n }\n if (heatMap.horizontalGradient) {\n legendX = this.legendXCollections[i];\n legendY = this.legendYCollections[i];\n labelX = this.labelXCollections[i];\n labelY = this.labelYCollections[i];\n }\n labelX = legendX + this.legendSize + this.labelPadding;\n labelY = legendY + padding;\n if (translate && heatMap.rendering && this.legendRange.length <= heatMap.colorCollection.length) {\n var rectPosition = new LegendRange(legendX, legendY, legendSize, legendSize, heatMap.colorCollection[i].value, true, this.currentPage);\n rectPosition.visible = !isNullOrUndefined(this.visibilityCollections[i]) ? this.visibilityCollections[i] : true;\n this.legendRange.push(rectPosition);\n if (heatMap.legendSettings.showLabel) {\n var textPosition = new LegendRange(labelX, (labelY - size.height / 2), size.width, size.height, heatMap.colorCollection[i].value, true, this.currentPage);\n textPosition.visible = !isNullOrUndefined(this.visibilityCollections[i]) ? this.visibilityCollections[i] : true;\n this.legendTextRange.push(textPosition);\n }\n }\n if (heatMap.legendSettings.showLabel) {\n var text = getTitle(this.labelCollections[i], heatMap.legendSettings.textStyle, textWrapWidth);\n if (text[0].indexOf('...') !== -1 && heatMap.enableCanvasRendering) {\n this.legendLabelTooltip.push(new CanvasTooltip(this.labelCollections[i], new Rect(labelX, labelY, size.width, size.height)));\n }\n var textBasic = new TextBasic(labelX, labelY, 'start', text, 0, 'translate(0,0)', 'middle');\n var options = new TextOption(heatMap.element.id + '_Legend_Label' + i, textBasic, heatMap.legendSettings.textStyle, heatMap.legendSettings.textStyle.color || heatMap.themeStyle.legendLabel);\n options.fill = heatMap.legendOnLoad ? options.fill : this.legendRange[i].visible ? options.fill : '#D3D3D3';\n this.drawSvgCanvas.createText(options, this.translategroup, text[0]);\n if (Browser.isIE && !heatMap.enableCanvasRendering) {\n this.translategroup.lastChild.setAttribute('dy', '0.6ex');\n }\n }\n listRect = new Rect(legendX, legendY, legendSize, legendSize);\n var listColor = heatMap.legendOnLoad ? heatMap.colorCollection[i].color :\n this.legendRange[i].visible ? heatMap.colorCollection[i].color : '#D3D3D3';\n var rectItems = new RectOption(heatMap.element.id + '_legend_list' + i, listColor, tempBorder, 1, listRect);\n this.drawSvgCanvas.drawRectangle(rectItems, this.translategroup);\n heatMap.horizontalGradient ? legendX = legendX + this.legendSize + this.labelPadding + size.width + this.listInterval :\n legendY += this.legendSize + this.listInterval;\n }\n if (!heatMap.enableCanvasRendering) {\n this.legendGroup.height = this.legendGroup.height > 0 ? this.legendGroup.height : 0;\n this.legendGroup.width = this.legendGroup.width > 0 ? this.legendGroup.width : 0;\n var clippath = heatMap.renderer.createClipPath({ id: heatMap.element.id + '_LegendScale_ClipPath' });\n var clipRect = heatMap.renderer.drawRectangle(this.legendGroup);\n clippath.appendChild(clipRect);\n this.translategroup.appendChild(clippath);\n this.translategroup.setAttribute('style', 'clip-path:url(#' + clippath.id + ')');\n this.legendScale.appendChild(this.translategroup);\n heatMap.svgObject.appendChild(this.legend);\n }\n };\n /**\n * @private\n */\n Legend.prototype.translatePage = function (heatMap, page, isNext) {\n var padding = 5;\n if ((isNext && page >= 1 && page < this.numberOfPages) || (!isNext && page > 1 && page <= this.numberOfPages)) {\n if (isNext) {\n this.currentPage += 1;\n this.legendRect.y += this.legendRect.height;\n }\n else {\n this.currentPage -= 1;\n this.legendRect.y -= this.legendRect.height;\n }\n if (!heatMap.enableCanvasRendering) {\n this.paginggroup.removeChild(this.paginggroup.firstChild);\n while (this.translategroup.childNodes.length) {\n this.translategroup.removeChild(this.translategroup.firstChild);\n }\n }\n else {\n var ctx = heatMap.canvasRenderer.ctx;\n ctx.fillRect(this.legendRectScale.x - padding, this.legendRectScale.y - padding, this.legendRectScale.width +\n padding, this.legendRectScale.height + (2 * padding));\n ctx.fillRect(this.pagingRect.x, this.pagingRect.y, this.pagingRect.width, this.pagingRect.height);\n }\n this.renderListLegendMode(this.legendRectScale, true);\n }\n if (heatMap.enableCanvasRendering && heatMap.allowSelection && heatMap.rectSelected) {\n var ctx = heatMap.secondaryCanvasRenderer.ctx;\n var position = heatMap.legendSettings.position;\n var initialRect = heatMap.initialClipRect;\n var rectX = position === 'Right' ? initialRect.x + initialRect.width : 0;\n var rectY = position === 'Bottom' ? initialRect.y + initialRect.height : 0;\n var rectWidth = position === 'Right' ? heatMap.availableSize.width - (initialRect.x +\n initialRect.width) : position === 'Left' ? initialRect.x : heatMap.availableSize.width;\n var rectHeight = position === 'Top' ? initialRect.y : position === 'Bottom' ?\n heatMap.availableSize.height - (initialRect.y + initialRect.height) : heatMap.availableSize.height;\n ctx.save();\n ctx.clearRect(rectX, rectY, rectWidth, rectHeight);\n ctx.restore();\n var oldCanvas = document.getElementById(heatMap.element.id + '_canvas');\n var newCanvas = document.getElementById(heatMap.element.id + '_secondary_canvas');\n var rectImage = oldCanvas.getContext('2d').getImageData(rectX, rectY, rectWidth, rectHeight);\n newCanvas.getContext('2d').putImageData(rectImage, rectX, rectY);\n oldCanvas.style.opacity = '0.3';\n }\n };\n /**\n * To create div container for tooltip which appears on hovering the smart legend.\n * @param heatmap\n * @private\n */\n Legend.prototype.createTooltipDiv = function (heatMap) {\n var element = createElement('div', {\n id: this.heatMap.element.id + 'legendLabelTooltipContainer',\n styles: 'position:absolute'\n });\n this.heatMap.element.appendChild(element);\n };\n /**\n * To render tooltip for smart legend.\n * @private\n */\n Legend.prototype.renderTooltip = function (currentLegendRect) {\n var heatMap = this.heatMap;\n var tempTooltipText = [currentLegendRect.label];\n var offset = null;\n offset = parseInt(heatMap.legendSettings.textStyle.size, 10) / 2;\n this.tooltipObject = new tool({\n offset: offset,\n theme: heatMap.theme,\n content: tempTooltipText,\n location: {\n x: currentLegendRect.x + (currentLegendRect.width / 2),\n y: currentLegendRect.y + (currentLegendRect.height / 2)\n },\n inverted: heatMap.horizontalGradient ? false : true,\n areaBounds: {\n height: this.legendGroup.height + this.legendGroup.y,\n width: this.legendGroup.width + this.legendGroup.x,\n x: heatMap.legendSettings.position === 'Right' ? 0 : this.legendGroup.x,\n y: heatMap.legendSettings.position === 'Top' ? heatMap.titleSettings.text === '' ? this.legendGroup.height -\n this.legendGroup.y : this.legendGroup.y : 0\n }\n }, '#' + this.heatMap.element.id + 'legendLabelTooltipContainer');\n this.tooltipObject.element.style.visibility = 'visible';\n };\n /**\n * To create tooltip for smart legend.\n * @private\n */\n Legend.prototype.createTooltip = function (pageX, pageY) {\n var currentLegendRect;\n for (var i = 0; i < this.heatMap.colorCollection.length; i++) {\n var position = this.legendRectPositionCollection[i];\n if (pageX > position.x && pageX < position.width + position.x &&\n pageY > position.y && pageY < position.height + position.y) {\n currentLegendRect = this.legendRectPositionCollection[i];\n break;\n }\n }\n var ele = document.getElementById(this.heatMap.element.id + 'legendLabelTooltipContainer');\n if (ele && ele.style.visibility === 'visible' && this.tooltipObject && !this.heatMap.isTouch) {\n this.tooltipObject.fadeOut();\n ele.style.visibility = 'hidden';\n }\n if (currentLegendRect) {\n this.renderTooltip(currentLegendRect);\n }\n };\n /**\n * Toggle the visibility of cells based on legend selection\n * @private\n */\n Legend.prototype.legendRangeSelection = function (index) {\n var heatMap = this.heatMap;\n var legendRange = this.legendRange;\n var padding = 5;\n var legendBound = this.legendRectScale;\n heatMap.rangeSelection = true;\n if (heatMap.enableCanvasRendering) {\n var ctx = heatMap.canvasRenderer.ctx;\n if (heatMap.legendSettings.enableSmartLegend) {\n ctx.fillRect(legendBound.x - padding, legendBound.y - padding, (legendBound.width + this.labelPadding + this.maxLegendLabelSize.width) + padding, legendBound.height + (2 * padding));\n }\n else {\n ctx.fillRect(legendBound.x - padding, legendBound.y - padding, legendBound.width +\n padding, legendBound.height + (2 * padding));\n }\n }\n else {\n if (heatMap.legendSettings.enableSmartLegend) {\n while (this.legend && this.legend.childNodes.length) {\n this.legend.removeChild(this.legend.firstChild);\n }\n }\n else {\n while (this.translategroup && this.translategroup.childNodes.length) {\n this.translategroup.removeChild(this.translategroup.firstChild);\n }\n }\n removeElement(heatMap.heatMapSeries.containerRectObject.id);\n if (heatMap.cellSettings.showLabel) {\n removeElement(heatMap.heatMapSeries.containerTextObject.id);\n }\n }\n if (heatMap.legendSettings.enableSmartLegend) {\n if (heatMap.colorCollection.length !== heatMap.legendColorCollection.length) {\n if (index === heatMap.legendColorCollection.length - 1) {\n heatMap.toggleValue[index - 1].visible = this.visibilityCollections[index - 1] =\n legendRange[index - 1].visible = !legendRange[index].visible;\n }\n else {\n if (index === heatMap.colorCollection.length - 1) {\n heatMap.toggleValue[index + 1].visible = this.visibilityCollections[index + 1] =\n legendRange[index + 1].visible = !legendRange[index].visible;\n }\n }\n }\n }\n heatMap.toggleValue[index].visible = this.visibilityCollections[index] = legendRange[index].visible = !legendRange[index].visible;\n heatMap.legendOnLoad = false;\n if (heatMap.legendSettings.enableSmartLegend) {\n this.renderSmartLegend();\n var rectItemsSvg = new Rect(legendBound.x, legendBound.y, legendBound.width, legendBound.height);\n this.renderLegendLabel(rectItemsSvg);\n }\n else {\n this.renderListLegendMode(this.legendRectScale, false);\n }\n heatMap.heatMapSeries.renderRectSeries();\n heatMap.clearSelection();\n if (heatMap.enableCanvasRendering && heatMap.allowSelection) {\n // heatMap.createSvg();\n // heatMap.refreshBound();\n // heatMap.createMultiCellDiv(false);\n }\n };\n /**\n * update visibility collections of legend and series\n * @private\n */\n Legend.prototype.updateLegendRangeCollections = function () {\n var heatMap = this.heatMap;\n heatMap.rangeSelection = !heatMap.legendOnLoad ? true : false;\n this.visibilityCollections = !heatMap.legendOnLoad ? this.visibilityCollections : [];\n heatMap.toggleValue = !heatMap.legendOnLoad ? heatMap.toggleValue : [];\n this.legendRange = !heatMap.legendOnLoad ? this.legendRange : [];\n this.legendTextRange = !heatMap.legendOnLoad ? this.legendTextRange : [];\n };\n return Legend;\n}());\nexport { Legend };\n","/**\n * Heat Map Component\n */\nvar __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, Property, NotifyPropertyChanges, Internationalization, Complex, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { remove, Event, EventHandler, Touch } from '@syncfusion/ej2-base';\nimport { Browser } from '@syncfusion/ej2-base';\nimport { SvgRenderer, CanvasRenderer } from '@syncfusion/ej2-svg-base';\nimport { Size, stringToNumber, RectOption, Rect, TextBasic, measureText } from './utils/helper';\nimport { DrawSvgCanvas, TextOption, titlePositionX, getTitle, showTooltip, getElement, SelectedCellDetails } from './utils/helper';\nimport { removeElement, CanvasTooltip, getTooltipText } from './utils/helper';\nimport { Margin, Title } from './model/base';\nimport { Theme, getThemeColor } from './model/theme';\nimport { Axis } from './axis/axis';\nimport { AxisHelper } from './axis/axis-helpers';\nimport { Series, CellSettings } from './series/series';\nimport { PaletteSettings, CellColor } from './utils/colorMapping';\nimport { TooltipSettings } from './utils/tooltip';\nimport { TwoDimensional } from './datasource/twodimensional';\nimport { LegendSettings } from '../heatmap/legend/legend';\nvar HeatMap = /** @class */ (function (_super) {\n __extends(HeatMap, _super);\n function HeatMap() {\n /**\n * The width of the heatmap as a string accepts input as both like '100px' or '100%'.\n * If specified as '100%, heatmap renders to the full width of its parent element.\n * @default null\n */\n var _this = _super !== null && _super.apply(this, arguments) || this;\n /** @private */\n _this.enableCanvasRendering = false;\n /** @private */\n _this.isCellTapHold = false;\n /** @private */\n _this.selectedCellCount = 0;\n /** @private */\n _this.toggleValue = [];\n /** @private */\n _this.legendOnLoad = true;\n /** @private */\n _this.resizing = false;\n /** @private */\n _this.rendering = true;\n /** @private */\n _this.horizontalGradient = _this.legendSettings.position === 'Bottom' || _this.legendSettings.position === 'Top';\n /** @private */\n _this.multiSelection = false;\n /** @private */\n _this.rectSelected = false;\n /** @private */\n _this.previousSelectedCellsRect = [];\n /** @private */\n _this.multiCellCollection = [];\n /** @private */\n _this.selectedMultiCellCollection = [];\n /** @private */\n _this.tempMultiCellCollection = [];\n /**\n * @private\n */\n _this.tooltipCollection = [];\n /**\n * @private\n */\n _this.isCellData = false;\n return _this;\n }\n HeatMap.prototype.preRender = function () {\n this.initPrivateVariable();\n this.unWireEvents();\n this.wireEvents();\n };\n HeatMap.prototype.initPrivateVariable = function () {\n this.renderer = new SvgRenderer(this.element.id);\n this.canvasRenderer = new CanvasRenderer(this.element.id);\n this.secondaryCanvasRenderer = new CanvasRenderer(this.element.id + '_secondary');\n this.heatMapAxis = new AxisHelper(this);\n this.heatMapSeries = new Series(this);\n this.drawSvgCanvas = new DrawSvgCanvas(this);\n this.twoDimensional = new TwoDimensional(this);\n this.cellColor = new CellColor(this);\n this.tempRectHoverClass = '';\n this.tempTooltipRectId = '';\n this.setCulture();\n };\n /**\n * Method to set culture for heatmap\n */\n HeatMap.prototype.setCulture = function () {\n this.intl = new Internationalization();\n };\n HeatMap.prototype.render = function () {\n this.updateBubbleHelperProperty();\n this.trigger('load', { heatmap: this });\n this.initAxis();\n this.processInitData();\n this.setTheme();\n this.calculateMaxLength();\n this.heatMapAxis.calculateVisibleLabels();\n this.twoDimensional.processDataSource(this.completeAdaptDataSource);\n this.createSvg();\n this.cellColor.getColorCollection();\n this.calculateBounds();\n this.renderElements();\n this.appendSvgObject();\n if (this.tooltipModule) {\n this.tooltipModule.showHideTooltip(false);\n }\n };\n /**\n * To re-calculate the datasource while changing datasource property dynamically.\n * @private\n */\n HeatMap.prototype.reRenderDatasource = function () {\n this.dataSourceMinValue = null;\n this.dataSourceMaxValue = null;\n this.processInitData();\n this.calculateMaxLength();\n this.heatMapAxis.calculateVisibleLabels();\n this.twoDimensional.processDataSource(this.completeAdaptDataSource);\n this.cellColor.getColorCollection();\n this.calculateBounds();\n };\n /**\n * To process datasource property.\n * @private\n */\n HeatMap.prototype.processInitData = function () {\n if (this.adaptorModule) {\n this.adaptorModule.constructDatasource(this.dataSource);\n }\n else {\n this.completeAdaptDataSource = this.dataSource;\n }\n };\n /**\n * To set render mode of heatmap as SVG or Canvas.\n * @private\n */\n HeatMap.prototype.setRenderMode = function () {\n if (this.renderingMode === 'Canvas') {\n this.enableCanvasRendering = true;\n }\n else if (this.renderingMode === 'Auto' &&\n (this.axisCollections[0].axisLabelSize * this.axisCollections[1].axisLabelSize) >= 10000) {\n this.enableCanvasRendering = true;\n }\n else {\n this.enableCanvasRendering = false;\n }\n };\n /**\n * To set bubble helper private property.\n * @private\n */\n HeatMap.prototype.updateBubbleHelperProperty = function () {\n if (this.cellSettings.tileType === 'Bubble' &&\n (this.cellSettings.bubbleType === 'Size' || this.cellSettings.bubbleType === 'Sector')) {\n this.legendVisibilityByCellType = false;\n }\n else if (this.legendModule && this.legendSettings.visible) {\n this.legendVisibilityByCellType = true;\n }\n if (this.cellSettings.tileType === 'Bubble' && this.cellSettings.bubbleType === 'SizeAndColor') {\n this.bubbleSizeWithColor = true;\n }\n else {\n this.bubbleSizeWithColor = false;\n }\n };\n HeatMap.prototype.renderElements = function () {\n this.tooltipCollection = [];\n this.renderSecondaryElement();\n this.renderBorder();\n this.renderTitle();\n this.heatMapAxis.renderAxes();\n if (this.tooltipModule && this.showTooltip) {\n this.tooltipModule.tooltipObject = null;\n this.tooltipModule.createTooltipDiv(this);\n }\n this.heatMapSeries.renderRectSeries();\n if (this.legendModule && this.legendSettings.visible\n && this.legendVisibilityByCellType) {\n this.legendModule.renderLegendItems();\n if (this.paletteSettings.type === 'Fixed' && this.legendSettings.enableSmartLegend &&\n this.legendSettings.labelDisplayType === 'None') {\n this.legendModule.createTooltipDiv(this);\n }\n }\n };\n /**\n * Get component name\n */\n HeatMap.prototype.getModuleName = function () {\n return 'heatmap';\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @private\n */\n HeatMap.prototype.getPersistData = function () {\n return '';\n };\n HeatMap.prototype.onPropertyChanged = function (newProp, oldProp) {\n var renderer = false;\n var refreshBounds = false;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'renderingMode':\n this.rendering = false;\n renderer = true;\n break;\n case 'cellSettings':\n this.updateBubbleHelperProperty();\n if (this.legendModule && ((newProp.cellSettings.tileType !==\n oldProp.cellSettings.tileType) || (newProp.cellSettings.bubbleType !== oldProp.cellSettings.bubbleType))) {\n this.legendOnLoad = true;\n this.legendModule.updateLegendRangeCollections();\n }\n this.reRenderDatasource();\n refreshBounds = true;\n break;\n case 'showTooltip':\n refreshBounds = true;\n break;\n case 'dataSource':\n this.isCellData = false;\n this.updateBubbleHelperProperty();\n if (this.legendVisibilityByCellType) {\n this.legendOnLoad = true;\n this.legendModule.updateLegendRangeCollections();\n }\n this.reRenderDatasource();\n renderer = true;\n break;\n case 'titleSettings':\n case 'width':\n case 'height':\n case 'margin':\n refreshBounds = true;\n break;\n case 'legendSettings':\n this.updateBubbleHelperProperty();\n if (this.legendVisibilityByCellType && (((newProp.legendSettings.visible !== oldProp.legendSettings.visible) ||\n (newProp.legendSettings.enableSmartLegend !== oldProp.legendSettings.enableSmartLegend)))) {\n this.legendOnLoad = true;\n this.legendModule.updateLegendRangeCollections();\n }\n else {\n this.legendOnLoad = false;\n }\n refreshBounds = true;\n break;\n case 'yAxis':\n case 'xAxis':\n this.updateBubbleHelperProperty();\n if (this.legendVisibilityByCellType) {\n this.legendOnLoad = true;\n this.legendModule.updateLegendRangeCollections();\n }\n this.reRenderDatasource();\n refreshBounds = true;\n break;\n case 'paletteSettings':\n this.updateBubbleHelperProperty();\n if (this.legendVisibilityByCellType) {\n this.legendOnLoad = true;\n this.legendModule.updateLegendRangeCollections();\n }\n this.cellColor.getColorCollection();\n this.calculateBounds();\n renderer = true;\n break;\n case 'theme':\n this.setTheme();\n renderer = true;\n break;\n case 'tooltipSettings':\n if (this.tooltipModule) {\n this.tooltipModule.tooltipObject.fill = this.tooltipSettings.fill;\n this.tooltipModule.tooltipObject.border = this.tooltipSettings.border;\n this.tooltipModule.tooltipObject.textStyle = this.tooltipSettings.textStyle;\n this.tooltipModule.tooltipObject.refresh();\n }\n break;\n }\n }\n if (!refreshBounds && renderer) {\n this.createSvg();\n this.renderElements();\n this.appendSvgObject();\n this.trigger('created');\n this.clearSelection();\n }\n else if (refreshBounds) {\n this.createSvg();\n this.refreshBound();\n this.appendSvgObject();\n this.trigger('created');\n }\n if (this.allowSelection && this.rectSelected) {\n this.clearSelection();\n }\n this.rendering = true;\n };\n /**\n * create svg or canvas element\n * @private\n */\n HeatMap.prototype.createSvg = function () {\n this.removeSvg();\n this.setRenderMode();\n this.calculateSize();\n if (!this.enableCanvasRendering) {\n this.svgObject = this.renderer.createSvg({\n id: this.element.id + '_svg',\n width: this.availableSize.width,\n height: this.availableSize.height\n });\n if (this.cellSettings.border.width.toString() === '0' && this.cellSettings.tileType === 'Rect') {\n this.svgObject.setAttribute('shape-rendering', 'crispEdges');\n }\n }\n else {\n this.svgObject = this.canvasRenderer.createCanvas({\n id: this.element.id + '_canvas',\n width: this.availableSize.width,\n height: this.availableSize.height\n });\n if (this.allowSelection) {\n this.createMultiCellDiv(true);\n }\n }\n };\n /**\n * To Remove the SVG.\n * @private\n */\n HeatMap.prototype.removeSvg = function () {\n if (document.getElementById(this.element.id + '_Secondary_Element')) {\n remove(document.getElementById(this.element.id + '_Secondary_Element'));\n }\n if (document.getElementById(this.element.id + 'Celltooltipcontainer')) {\n remove(document.getElementById(this.element.id + 'Celltooltipcontainer'));\n }\n if (document.getElementById(this.element.id + 'legendLabelTooltipContainer')) {\n remove(document.getElementById(this.element.id + 'legendLabelTooltipContainer'));\n }\n if (document.getElementById(this.element.id + '_Multi_CellSelection_Canvas')) {\n remove(document.getElementById(this.element.id + '_Multi_CellSelection_Canvas'));\n }\n if (document.getElementById(this.element.id + '_CellSelection_Container')) {\n remove(document.getElementById(this.element.id + '_CellSelection_Container'));\n }\n if (this.svgObject) {\n var svgElement = document.getElementById(this.svgObject.id);\n if (svgElement) {\n while (this.svgObject.childNodes.length) {\n this.svgObject.removeChild(this.svgObject.firstChild);\n }\n remove(this.svgObject);\n }\n }\n };\n HeatMap.prototype.renderSecondaryElement = function () {\n var tooltipDiv = this.createElement('div');\n tooltipDiv.id = this.element.id + '_Secondary_Element';\n this.element.appendChild(tooltipDiv);\n var divElement = this.createElement('div', {\n id: this.element.id + '_CellSelection_Container',\n styles: 'position:absolute; z-index: 2 ; top:' + this.initialClipRect.y + 'px' + '; left:' + this.initialClipRect.x + 'px',\n });\n this.element.appendChild(divElement);\n };\n /**\n * To provide the array of modules needed for control rendering\n * @return{ModuleDeclaration[]}\n * @private\n */\n HeatMap.prototype.requiredModules = function () {\n var modules = [];\n if (this.showTooltip) {\n modules.push({\n member: 'Tooltip',\n args: [this]\n });\n }\n if (this.legendSettings) {\n modules.push({\n member: 'Legend',\n args: [this]\n });\n }\n if (this.dataSource) {\n modules.push({\n member: 'Adaptor',\n args: [this]\n });\n }\n return modules;\n };\n /**\n * To destroy the widget\n * @method destroy\n * @return {void}.\n * @member of Heatmap\n */\n HeatMap.prototype.destroy = function () {\n this.unWireEvents();\n _super.prototype.destroy.call(this);\n this.element.innerHTML = '';\n this.element.classList.remove('e-heatmap');\n };\n /**\n * Applies all the pending property changes and render the component again.\n * @method destroy\n * @return {void}.\n */\n HeatMap.prototype.refresh = function () {\n _super.prototype.refresh.call(this);\n this.element.classList.add('e-heatmap');\n };\n /**\n * Appending svg object to the element\n * @private\n */\n HeatMap.prototype.appendSvgObject = function () {\n if (this.enableCanvasRendering && this.allowSelection) {\n this.createMultiCellDiv(false);\n }\n else {\n this.element.appendChild(this.svgObject);\n }\n };\n HeatMap.prototype.renderBorder = function () {\n this.border = {\n width: 0\n };\n var width = 0;\n var rect = new RectOption(this.element.id + '_HeatmapBorder', this.themeStyle.background, this.border, 1, new Rect(width / 2, width / 2, this.availableSize.width - width, this.availableSize.height - width));\n this.drawSvgCanvas.drawRectangle(rect, this.svgObject);\n };\n HeatMap.prototype.calculateSize = function () {\n var width = stringToNumber(this.width, this.element.offsetWidth) || this.element.offsetWidth || 600;\n var height = stringToNumber(this.height, this.element.offsetHeight) || this.element.offsetHeight || 450;\n this.availableSize = new Size(width, height);\n };\n HeatMap.prototype.renderTitle = function () {\n if (this.titleSettings.text) {\n var titleStyle = this.titleSettings.textStyle;\n var anchor = titleStyle.textAlignment === 'Near' ? 'start' :\n titleStyle.textAlignment === 'Far' ? 'end' : 'middle';\n this.elementSize = measureText(this.titleCollection[0], titleStyle);\n var options = new TextOption(this.element.id + '_HeatmapTitle', new TextBasic(titlePositionX(this.availableSize.width - this.margin.left - this.margin.right, this.margin.left, this.margin.right, titleStyle), this.margin.top + ((this.elementSize.height) * 3 / 4), anchor, this.titleCollection), titleStyle, titleStyle.color || this.themeStyle.heatMapTitle);\n if (this.titleCollection.length > 1) {\n this.drawSvgCanvas.createWrapText(options, titleStyle, this.svgObject);\n }\n else {\n this.drawSvgCanvas.createText(options, this.svgObject, this.titleCollection[0]);\n if (this.titleCollection[0].indexOf('...') !== -1 && this.enableCanvasRendering) {\n this.tooltipCollection.push(new CanvasTooltip(this.titleSettings.text, new Rect(this.margin.left, this.margin.top, this.elementSize.width, this.elementSize.height)));\n }\n }\n }\n };\n HeatMap.prototype.titleTooltip = function (event, x, y, isTouch) {\n var targetId = event.target.id;\n if ((targetId === (this.element.id + '_HeatmapTitle')) && (event.target.textContent.indexOf('...') > -1)) {\n showTooltip(this.titleSettings.text, x, y, this.element.offsetWidth, this.element.id + '_Title_Tooltip', getElement(this.element.id + '_Secondary_Element'), isTouch, this);\n }\n else {\n removeElement(this.element.id + '_Title_Tooltip');\n }\n };\n HeatMap.prototype.axisTooltip = function (event, x, y, isTouch) {\n var targetId = event.target.id;\n if ((targetId.indexOf(this.element.id + '_XAxis_Label') !== -1) ||\n (targetId.indexOf(this.element.id + '_XAxis_MultiLevel') !== -1) ||\n (targetId.indexOf(this.element.id + '_YAxis_MultiLevel') !== -1)) {\n var tooltipText = getTooltipText(this.tooltipCollection, x, y);\n if (tooltipText) {\n showTooltip(tooltipText, x, y, this.element.offsetWidth, this.element.id + '_axis_Tooltip', getElement(this.element.id + '_Secondary_Element'), this.isTouch, this);\n }\n else {\n removeElement(this.element.id + '_axis_Tooltip');\n }\n }\n else {\n removeElement(this.element.id + '_axis_Tooltip');\n }\n };\n HeatMap.prototype.isHeatmapRect = function (x, y) {\n var firstRectDetails = [];\n var lastRectDetails = [];\n var isRect;\n firstRectDetails.push(this.heatMapSeries.rectPositionCollection[0][0]);\n lastRectDetails.push(this.heatMapSeries.rectPositionCollection[this.yLength - 1][this.xLength - 1]);\n isRect = (x >= firstRectDetails[0].x && y >= firstRectDetails[0].y &&\n x <= (lastRectDetails[0].x + lastRectDetails[0].width) &&\n y <= (lastRectDetails[0].y + lastRectDetails[0].height)) ? true : false;\n return isRect;\n };\n HeatMap.prototype.setTheme = function () {\n /*! Set theme */\n this.themeStyle = getThemeColor(this.theme);\n };\n HeatMap.prototype.calculateBounds = function () {\n var margin = this.margin;\n // Title Height;\n var titleHeight = 0;\n var padding = (this.legendModule && this.legendSettings.position === 'Top'\n && this.legendVisibilityByCellType) || this.titleSettings.textStyle.size === '0px' ? 0 : 16; // title padding\n var left = margin.left;\n var width = this.availableSize.width - left - margin.right;\n if (this.titleSettings.text) {\n this.titleCollection = getTitle(this.titleSettings.text, this.titleSettings.textStyle, width);\n titleHeight = (measureText(this.titleSettings.text, this.titleSettings.textStyle).height * this.titleCollection.length) +\n padding;\n }\n var top = margin.top + titleHeight;\n this.titleRect = new Rect(margin.left, margin.top, this.availableSize.width - margin.left - margin.right, titleHeight);\n var height = this.availableSize.height - top - margin.bottom;\n this.initialClipRect = new Rect(left, top, width, height);\n var legendTop = this.initialClipRect.y;\n if (this.legendModule && this.legendSettings.visible && this.legendVisibilityByCellType) {\n this.legendModule.calculateLegendBounds(this.initialClipRect);\n }\n this.heatMapAxis.measureAxis(this.initialClipRect);\n if (this.legendModule && this.legendSettings.visible && this.legendVisibilityByCellType) {\n this.legendModule.calculateLegendSize(this.initialClipRect, legendTop);\n }\n this.heatMapAxis.calculateAxisSize(this.initialClipRect);\n };\n HeatMap.prototype.refreshBound = function () {\n this.updateBubbleHelperProperty();\n this.calculateBounds();\n this.renderElements();\n };\n HeatMap.prototype.initAxis = function () {\n var axis;\n var axes = [this.xAxis, this.yAxis];\n this.axisCollections = [];\n for (var i = 0, len = axes.length; i < len; i++) {\n axis = axes[i];\n axis.orientation = (i === 0) ? 'Horizontal' : 'Vertical';\n axis.jsonCellLabel = [];\n this.axisCollections.push(axis);\n }\n };\n /**\n * Method to bind events for HeatMap\n */\n HeatMap.prototype.wireEvents = function () {\n /*! Find the Events type */\n var isIE11Pointer = Browser.isPointer;\n var start = Browser.touchStartEvent;\n var stop = Browser.touchEndEvent;\n var move = Browser.touchMoveEvent;\n var cancel = isIE11Pointer ? 'pointerleave' : 'mouseleave';\n EventHandler.add(this.element, Browser.isDevice ? start : 'click', this.heatMapMouseClick, this);\n EventHandler.add(this.element, start, this.heatMapMouseMove, this);\n EventHandler.add(this.element, stop, this.heatMapMouseLeave, this);\n EventHandler.add(this.element, move, this.heatMapMouseMove, this);\n EventHandler.add(this.element, cancel, this.heatMapMouseLeave, this);\n window.addEventListener((Browser.isTouch && ('orientation' in window && 'onorientationchange' in window)) ? 'orientationchange' : 'resize', this.heatMapResize.bind(this));\n var heatmap = this;\n /**\n * Support for touch tapHold and tap for HeatMap\n */\n var touchObj = new Touch(this.element, {\n tapHold: function () {\n heatmap.isCellTapHold = true;\n heatmap.getDataCollection();\n heatmap.currentRect.allowCollection = false;\n heatmap.setCellOpacity();\n var argData = {\n heatmap: heatmap,\n cancel: false,\n name: 'cellSelected',\n data: heatmap.multiCellCollection\n };\n heatmap.trigger('cellSelected', argData);\n },\n tap: function () {\n var isCellTap = false;\n if (!heatmap.isCellTapHold) {\n isCellTap = true;\n }\n heatmap.tooltipOnMouseMove(null, heatmap.currentRect, isCellTap);\n }\n });\n this.setStyle(this.element);\n };\n /**\n * Applying styles for heatmap element\n */\n HeatMap.prototype.setStyle = function (element) {\n element.style.touchAction = 'element';\n element.style.msTouchAction = 'element';\n element.style.msContentZooming = 'none';\n element.style.msUserSelect = 'none';\n element.style.webkitUserSelect = 'none';\n element.style.position = 'relative';\n element.style.display = 'block';\n };\n /**\n * Method to unbind events for HeatMap\n */\n HeatMap.prototype.unWireEvents = function () {\n /*! Find the Events type */\n var isIE11Pointer = Browser.isPointer;\n var start = Browser.touchStartEvent;\n var stop = Browser.touchEndEvent;\n var move = Browser.touchMoveEvent;\n var cancel = isIE11Pointer ? 'pointerleave' : 'mouseleave';\n EventHandler.remove(this.element, Browser.isDevice ? start : 'click', this.heatMapMouseClick);\n EventHandler.remove(this.element, start, this.heatMapMouseMove);\n EventHandler.remove(this.element, move, this.heatMapMouseLeave);\n EventHandler.remove(this.element, move, this.heatMapMouseMove);\n EventHandler.remove(this.element, cancel, this.heatMapMouseLeave);\n window.removeEventListener((Browser.isTouch && ('orientation' in window && 'onorientationchange' in window)) ? 'orientationchange' : 'resize', this.heatMapResize);\n };\n /**\n * Handles the heatmap resize.\n * @return {boolean}\n * @private\n */\n HeatMap.prototype.heatMapResize = function (e) {\n var _this = this;\n this.resizing = true;\n var argData = {\n heatmap: this,\n cancel: false,\n name: 'resized',\n currentSize: new Size(0, 0),\n previousSize: new Size(this.availableSize.width, this.availableSize.height),\n };\n if (this.resizeTimer) {\n clearTimeout(this.resizeTimer);\n }\n this.resizeTimer = setTimeout(function () {\n if (_this.isDestroyed) {\n clearTimeout(_this.resizeTimer);\n return;\n }\n _this.createSvg();\n argData.currentSize = _this.availableSize;\n _this.trigger('resized', argData);\n _this.refreshBound();\n _this.appendSvgObject();\n if (_this.allowSelection) {\n _this.updateCellSelection();\n }\n _this.trigger('loaded', { heatmap: _this });\n _this.resizing = false;\n }, 500);\n return false;\n };\n /**\n * Method to bind selection after window resize for HeatMap\n */\n HeatMap.prototype.updateCellSelection = function () {\n var wSize = this.initialClipRect.width / this.axisCollections[0].axisLabelSize;\n var hSize = this.initialClipRect.height / this.axisCollections[1].axisLabelSize;\n var x = this.initialClipRect.x;\n var y = this.initialClipRect.y;\n if (!this.enableCanvasRendering) {\n if (this.multiCellCollection.length !== 0) {\n var containersRect = document.getElementById(this.element.id + '_Container_RectGroup');\n var containerText = document.getElementById(this.element.id + '_Container_TextGroup');\n for (var i = 0; i < containersRect.childNodes.length; i++) {\n containersRect.childNodes[i].setAttribute('opacity', '0.3');\n if (this.cellSettings.showLabel && containerText.childNodes[i]) {\n containerText.childNodes[i].setAttribute('opacity', '0.3');\n }\n }\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n var collectionClass = this.multiCellCollection[i].cellElement;\n var cellIndex = collectionClass.id.replace(this.element.id + '_HeatMapRect_', '');\n var index = parseInt(cellIndex, 10);\n containersRect.childNodes[index].setAttribute('opacity', '1');\n if (this.cellSettings.showLabel && containerText.childNodes[i]) {\n var getText = document.getElementById(this.element.id + '_HeatMapRectLabels_' + index);\n if (getText) {\n getText.setAttribute('opacity', '1');\n }\n this.addSvgClass(containersRect.childNodes[index]);\n }\n }\n }\n }\n else if (this.enableCanvasRendering) {\n var rect = this.multiCellCollection;\n var oldCanvas = document.getElementById(this.element.id + '_canvas');\n var newCanvas = document.getElementById(this.element.id + '_secondary_canvas');\n var initialRect = this.initialClipRect;\n var rectHeight = initialRect.y + initialRect.height;\n var rectWidth = initialRect.x + initialRect.width;\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n this.multiCellCollection[i].width = rect[i].width = wSize;\n this.multiCellCollection[i].height = rect[i].height = hSize;\n this.multiCellCollection[i].x = rect[i].x = x + wSize * this.multiCellCollection[i].xPosition;\n this.multiCellCollection[i].y = rect[i].y = y + hSize * this.multiCellCollection[i].yPosition;\n var rectImage = oldCanvas.getContext('2d').getImageData(rect[i].x, rect[i].y, rect[i].width, rect[i].height);\n newCanvas.getContext('2d').putImageData(rectImage, rect[i].x, rect[i].y);\n oldCanvas.style.opacity = '0.3';\n }\n var topPositions = oldCanvas.getContext('2d').getImageData(0, 0, this.availableSize.width, initialRect.y);\n newCanvas.getContext('2d').putImageData(topPositions, 0, 0);\n var bottomPositions = oldCanvas.getContext('2d').getImageData(0, rectHeight, this.availableSize.width, this.availableSize.height - rectHeight);\n newCanvas.getContext('2d').putImageData(bottomPositions, 0, initialRect.y + initialRect.height);\n var rightPosition = oldCanvas.getContext('2d').\n getImageData(rectWidth, 0, this.availableSize.width - rectWidth, this.availableSize.height);\n newCanvas.getContext('2d').putImageData(rightPosition, rectWidth, 0);\n var leftPosition = oldCanvas.getContext('2d').getImageData(0, 0, initialRect.x, this.availableSize.height);\n newCanvas.getContext('2d').putImageData(leftPosition, 0, 0);\n removeElement(this.element.id + '_selectedCells');\n }\n };\n HeatMap.prototype.clearSVGSelection = function () {\n var rect = document.getElementById(this.element.id + '_Container_RectGroup');\n var text = document.getElementById(this.element.id + '_Container_TextGroup');\n for (var i = 0; i < rect.childNodes.length; i++) {\n var elementClassName = rect.childNodes[i].getAttribute('class');\n if (elementClassName === this.element.id + '_selected') {\n this.removeSvgClass(rect.childNodes[i], elementClassName);\n }\n rect.childNodes[i].setAttribute('opacity', '1');\n if (this.cellSettings.showLabel && text.childNodes[i]) {\n text.childNodes[i].setAttribute('opacity', '1');\n }\n }\n };\n /**\n * Get the maximum length of data source for both horizontal and vertical\n * @private\n */\n HeatMap.prototype.calculateMaxLength = function () {\n var dataSource = this.completeAdaptDataSource;\n if (dataSource && dataSource.length > 0) {\n var xAxisMax = dataSource.length - 1;\n var yAxisMax = 0;\n for (var i = 0; i <= xAxisMax; i++) {\n var length_1 = dataSource[i].length;\n yAxisMax = yAxisMax > length_1 ? yAxisMax : length_1;\n }\n this.axisCollections[0].maxLength = xAxisMax;\n this.axisCollections[1].maxLength = yAxisMax - 1;\n }\n else {\n this.axisCollections[0].maxLength = 0;\n this.axisCollections[1].maxLength = 0;\n }\n };\n /**\n * To find mouse x, y for aligned heatmap element svg position\n */\n HeatMap.prototype.setMouseXY = function (pageX, pageY) {\n var rect = this.element.getBoundingClientRect();\n var svgCanvasRect;\n if (this.enableCanvasRendering) {\n svgCanvasRect = document.getElementById(this.element.id + '_canvas').getBoundingClientRect();\n }\n else {\n svgCanvasRect = document.getElementById(this.element.id + '_svg').getBoundingClientRect();\n }\n this.mouseX = (pageX - rect.left) - Math.max(svgCanvasRect.left - rect.left, 0);\n this.mouseY = (pageY - rect.top) - Math.max(svgCanvasRect.top - rect.top, 0);\n };\n HeatMap.prototype.heatMapMouseClick = function (e) {\n var pageX;\n var pageY;\n var tooltipText;\n var touchArg;\n var elementRect = this.element.getBoundingClientRect();\n if (e.type === 'touchstart') {\n this.isTouch = true;\n touchArg = e;\n pageY = touchArg.changedTouches[0].clientY;\n pageX = touchArg.changedTouches[0].clientX;\n }\n else {\n this.isTouch = false;\n pageY = e.clientY;\n pageX = e.clientX;\n }\n pageX -= elementRect.left;\n pageY -= elementRect.top;\n var isheatmapRect = this.isHeatmapRect(pageX, pageY);\n if (isheatmapRect) {\n var currentRect = this.heatMapSeries.getCurrentRect(pageX, pageY);\n this.trigger('cellClick', {\n heatmap: this,\n value: currentRect.value,\n x: currentRect.x,\n y: currentRect.y,\n xLabel: this.heatMapSeries.hoverXAxisLabel,\n yLabel: this.heatMapSeries.hoverYAxisLabel,\n xValue: this.heatMapSeries.hoverXAxisValue,\n yValue: this.heatMapSeries.hoverYAxisValue,\n cellElement: this.enableCanvasRendering ? null : document.getElementById(currentRect.id)\n });\n }\n this.notify('click', e);\n if (this.paletteSettings.type !== 'Gradient' && this.legendModule\n && this.legendSettings.visible && this.legendVisibilityByCellType) {\n var page = this.legendModule.navigationCollections;\n if (page.length && pageX > page[0].x && pageX < page[0].x + page[0].width &&\n pageY > page[0].y && pageY < page[0].y + page[0].height) {\n this.legendModule.translatePage(this, this.legendModule.currentPage, true);\n }\n else if (page.length && pageX > page[1].x && pageX < page[1].x + page[1].width &&\n pageY > page[1].y && pageY < page[1].y + page[1].height) {\n this.legendModule.translatePage(this, this.legendModule.currentPage, false);\n }\n var legendRange = this.legendModule.legendRange;\n var legendTextRange = this.legendModule.legendTextRange;\n var loop = true;\n for (var i = 0; i < legendRange.length; i++) {\n if (this.legendModule && this.legendSettings.toggleVisibility &&\n this.legendModule.currentPage === legendRange[i].currentPage) {\n if ((loop && (pageX >= legendRange[i].x && pageX <= legendRange[i].width + legendRange[i].x) &&\n (pageY >= legendRange[i].y && pageY <= legendRange[i].y + legendRange[i].height) ||\n ((this.legendSettings.showLabel && this.legendSettings.labelDisplayType !== 'None' &&\n pageX >= legendTextRange[i].x && pageX <= legendTextRange[i].width + legendTextRange[i].x) &&\n (pageY >= legendTextRange[i].y && pageY <= legendTextRange[i].y + legendTextRange[i].height)))) {\n this.legendModule.legendRangeSelection(i);\n loop = false;\n }\n }\n }\n }\n return false;\n };\n /**\n * Handles the mouse Move.\n * @return {boolean}\n * @private\n */\n HeatMap.prototype.heatMapMouseMove = function (e) {\n var pageX;\n var pageY;\n var tooltipText;\n var touchArg;\n var elementRect = this.element.getBoundingClientRect();\n if (e.type === 'touchmove' || e.type === 'touchstart') {\n this.isTouch = true;\n touchArg = e;\n pageX = touchArg.changedTouches[0].clientX;\n pageY = touchArg.changedTouches[0].clientY;\n }\n else {\n this.isTouch = false;\n pageX = e.clientX;\n pageY = e.clientY;\n }\n pageX -= elementRect.left;\n pageY -= elementRect.top;\n this.setMouseXY(pageX, pageY);\n if (e.target && e.target.id) {\n var isheatmapRect = this.isHeatmapRect(pageX, pageY);\n if (this.legendModule) {\n if (isheatmapRect) {\n if (this.paletteSettings.type === 'Gradient' &&\n this.legendSettings.showGradientPointer && this.legendSettings.visible && this.legendVisibilityByCellType) {\n this.legendModule.renderGradientPointer(e, pageX, pageY);\n }\n }\n else {\n this.legendModule.removeGradientPointer();\n }\n this.renderMousePointer(pageX, pageY);\n }\n var isshowTooltip = void 0;\n var currentRect = void 0;\n isshowTooltip = this.showTooltip && this.tooltipModule ? isheatmapRect : false;\n if (isheatmapRect) {\n currentRect = this.heatMapSeries.getCurrentRect(pageX, pageY);\n if (e.which !== 2 && e.which !== 3) {\n isshowTooltip = this.cellSelectionOnMouseMove(e, currentRect, pageX, pageY, isshowTooltip);\n }\n }\n this.tooltipOnMouseMove(e, currentRect, isshowTooltip);\n if (this.legendModule && this.legendSettings.visible && this.paletteSettings.type === 'Fixed' &&\n this.legendSettings.enableSmartLegend && this.legendSettings.labelDisplayType === 'None') {\n this.legendModule.createTooltip(pageX, pageY);\n }\n if (!this.enableCanvasRendering) {\n if (this.titleSettings.text && this.titleSettings.textStyle.textOverflow === 'Trim') {\n this.titleTooltip(e, pageX, pageY, this.isTouch);\n }\n this.axisTooltip(e, pageX, pageY, this.isTouch);\n if (this.legendModule && this.legendSettings.visible && this.legendSettings.showLabel && this.legendVisibilityByCellType) {\n this.legendModule.renderLegendLabelTooltip(e);\n }\n }\n else {\n elementRect = this.element.getBoundingClientRect();\n var tooltipRect = (this.paletteSettings.type === 'Fixed' && this.legendSettings.enableSmartLegend &&\n this.legendSettings.labelDisplayType === 'None') ? false : true;\n tooltipText = getTooltipText(this.tooltipCollection, pageX, pageY) ||\n (this.legendModule && tooltipRect && getTooltipText(this.legendModule.legendLabelTooltip, pageX, pageY));\n if (tooltipText) {\n showTooltip(tooltipText, pageX, pageY, this.element.offsetWidth, this.element.id + '_canvas_Tooltip', getElement(this.element.id + '_Secondary_Element'), this.isTouch, this);\n }\n else {\n removeElement(this.element.id + '_canvas_Tooltip');\n }\n }\n }\n return true;\n };\n /**\n * Triggering cell selection\n */\n HeatMap.prototype.cellSelectionOnMouseMove = function (e, currentRect, pageX, pageY, isshowTooltip) {\n if ((this.cellSettings.tileType === 'Rect' && e.type === 'mousedown' || e.type === 'touchstart'\n || e.type === 'pointerdown') && this.allowSelection) {\n this.previousRect = currentRect;\n this.multiSelection = true;\n this.rectSelected = true;\n this.initialCellX = pageX;\n this.initialCellY = pageY;\n e.preventDefault();\n }\n if (this.cellSettings.tileType === 'Rect' && this.multiSelection && currentRect) {\n isshowTooltip = false;\n this.highlightSelectedCells(this.previousRect, currentRect, pageX, pageY, e);\n }\n return isshowTooltip;\n };\n /**\n * Rendering tooltip on mouse move\n */\n HeatMap.prototype.tooltipOnMouseMove = function (e, currentRect, isshowTooltip) {\n var _this = this;\n if (isshowTooltip && currentRect) {\n if (this.tempTooltipRectId !== currentRect.id) {\n if (this.showTooltip) {\n if ((this.cellSettings.enableCellHighlighting || (this.tooltipModule && this.showTooltip))\n && !this.enableCanvasRendering) {\n this.heatMapSeries.highlightSvgRect(currentRect.id);\n }\n this.tooltipModule.renderTooltip(currentRect);\n if (this.isTouch) {\n if (this.tooltipTimer) {\n window.clearTimeout(this.tooltipTimer);\n }\n this.tooltipTimer = setTimeout(function () {\n _this.tooltipModule.tooltipObject.fadeOut();\n _this.tooltipModule.isFadeout = true;\n }, 1500);\n if (e) {\n if (e.type === 'touchmove') {\n e.preventDefault();\n }\n }\n }\n }\n this.tempTooltipRectId = currentRect.id;\n }\n }\n else {\n if (e !== null) {\n if (e.target.id.indexOf('Celltooltip') === -1) {\n if ((this.cellSettings.enableCellHighlighting || this.showTooltip) && !this.enableCanvasRendering) {\n this.heatMapSeries.highlightSvgRect(e.target.id);\n }\n if (this.tooltipModule && this.showTooltip) {\n this.tooltipModule.showHideTooltip(false, true);\n }\n }\n }\n this.tempTooltipRectId = '';\n }\n };\n /**\n * To select the multiple cells on mouse move action\n */\n HeatMap.prototype.highlightSelectedCells = function (previousRect, currentRect, pageX, pageY, e) {\n var pXIndex = previousRect.xIndex;\n var pYIndex = previousRect.yIndex;\n var cXIndex = currentRect.xIndex;\n var cYIndex = currentRect.yIndex;\n this.currentRect = currentRect;\n this.selectedCellsRect = new Rect(0, 0, 0, 0);\n this.selectedCellsRect.x = previousRect.x > currentRect.x ? currentRect.x : previousRect.x;\n this.selectedCellsRect.y = previousRect.y > currentRect.y ? currentRect.y : previousRect.y;\n this.selectedCellsRect.width = ((previousRect.x > currentRect.x ? (pXIndex - cXIndex) :\n (cXIndex - pXIndex)) + 1) * currentRect.width;\n this.selectedCellsRect.height = ((previousRect.y > currentRect.y ? (pYIndex - cYIndex) :\n (cYIndex - pYIndex)) + 1) * currentRect.height;\n if (e.type === 'touchstart') {\n this.isCellTapHold = true;\n }\n else {\n this.isCellTapHold = false;\n }\n e.preventDefault();\n if (e.ctrlKey === false && e.type !== 'touchstart' && e.type !== 'touchmove') {\n this.removeSelectedCellsBorder();\n }\n var x = this.initialCellX > pageX ? pageX : this.initialCellX;\n var y = this.initialCellY > pageY ? pageY : this.initialCellY;\n var parentDiv = document.getElementById(this.element.id + '_CellSelection_Container');\n var svgObject = this.renderer.createSvg({\n id: this.element.id + '_CellSelection_Container_svg',\n width: this.initialClipRect.width,\n height: this.initialClipRect.height,\n });\n parentDiv.appendChild(svgObject);\n var parent = document.getElementById(this.element.id + '_CellSelection_Container_svg');\n var rect = new Rect(x - this.initialClipRect.x, y - this.initialClipRect.y, Math.abs(pageX - this.initialCellX), Math.abs(pageY - this.initialCellY));\n var rectItems = new RectOption(this.element.id + '_selectedCells', '#87ceeb', { color: 'transparent', width: 1 }, 1, rect, '#0000ff');\n parent.appendChild(this.renderer.drawRectangle(rectItems));\n document.getElementById(this.element.id + '_selectedCells').style.opacity = '0.5';\n };\n /**\n * Method to get selected cell data collection for HeatMap\n */\n HeatMap.prototype.getDataCollection = function () {\n var pXIndex = this.previousRect.xIndex;\n var pYIndex = this.previousRect.yIndex;\n var cXIndex = this.currentRect.xIndex;\n var cYIndex = this.currentRect.yIndex;\n var minX = cXIndex > pXIndex ? pXIndex : cXIndex;\n var maxX = cXIndex > pXIndex ? cXIndex : pXIndex;\n var minY = cYIndex > pYIndex ? pYIndex : cYIndex;\n var maxY = cYIndex > pYIndex ? cYIndex : pYIndex;\n var tempX = minX;\n var tempY = minY;\n var cellX = this.previousRect.x;\n var cellY = this.previousRect.y;\n this.getCellCollection(this.currentRect, this.previousRect, true, tempX, tempY, maxX, maxY, minX, cellX, cellY);\n tempX = minX;\n tempY = minY;\n cellX = this.previousRect.x;\n cellY = this.previousRect.y;\n this.checkSelectedCells();\n this.getCellCollection(this.currentRect, this.previousRect, false, tempX, tempY, maxX, maxY, minX, cellX, cellY);\n this.selectedMultiCellCollection = [];\n this.canvasSelectedCells = new Rect(0, 0, 0, 0);\n this.selectedCellCount = 0;\n };\n /**\n * To get the selected datas.\n */\n HeatMap.prototype.getCellCollection = function (currentRect, previousRect, singleCellData, tempX, tempY, maxX, maxY, minX, cellX, cellY) {\n var xIndex = Math.abs((currentRect.xIndex === previousRect.xIndex ?\n 0 : currentRect.xIndex - previousRect.xIndex)) + 1;\n var yIndex = Math.abs((currentRect.yIndex === previousRect.yIndex ?\n 0 : currentRect.yIndex - previousRect.yIndex)) + 1;\n for (var i = 0; i < (xIndex * yIndex); i++) {\n if (singleCellData) {\n this.getSelectedCellData(cellX, cellY, true);\n }\n else {\n this.getSelectedCellData(cellX, cellY, false);\n }\n if (tempX < maxX) {\n cellX += currentRect.xIndex > previousRect.xIndex ? currentRect.width : -currentRect.width;\n tempX++;\n }\n else if (tempY < maxY) {\n cellY += currentRect.yIndex > previousRect.yIndex ? currentRect.height : -currentRect.height;\n cellX = previousRect.x;\n tempX = minX;\n }\n }\n };\n /**\n * To remove the selection on mouse click without ctrl key.\n */\n HeatMap.prototype.removeSelectedCellsBorder = function () {\n if (!this.enableCanvasRendering) {\n var containerRect = document.getElementById(this.element.id + '_Container_RectGroup');\n var containerText = document.getElementById(this.element.id + '_Container_TextGroup');\n for (var i = 0; i < containerRect.childNodes.length; i++) {\n var elementClassName = containerRect.childNodes[i].getAttribute('class');\n containerRect.childNodes[i].setAttribute('opacity', '0.3');\n if (this.cellSettings.showLabel && containerText.childNodes[i]) {\n containerText.childNodes[i].setAttribute('opacity', '0.3');\n this.removeSvgClass(containerRect.childNodes[i], elementClassName);\n }\n }\n }\n else {\n var ctx = this.secondaryCanvasRenderer.ctx;\n for (var i = 0; i < this.previousSelectedCellsRect.length; i++) {\n var rect = this.previousSelectedCellsRect[i];\n ctx.save();\n ctx.clearRect(rect.x - 1, rect.y - 1, rect.width + 2, rect.height + 2);\n ctx.restore();\n }\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n var rects = this.multiCellCollection[i];\n if (this.multiCellCollection.length > 0) {\n ctx.save();\n ctx.clearRect(rects.x - 1, rects.y - 1, rects.width + 2, rects.height + 2);\n }\n }\n }\n this.multiCellCollection = [];\n };\n /**\n * To highlight the selected multiple cells on mouse move action in canvas mode.\n */\n HeatMap.prototype.highlightSelectedAreaInCanvas = function (rect) {\n if (rect.x) {\n var oldCanvas = document.getElementById(this.element.id + '_canvas');\n var newCanvas = document.getElementById(this.element.id + '_secondary_canvas');\n var initialRect = this.initialClipRect;\n var rectImage = oldCanvas.getContext('2d').getImageData(rect.x, rect.y, rect.width, rect.height);\n newCanvas.getContext('2d').putImageData(rectImage, rect.x, rect.y);\n oldCanvas.style.opacity = '0.3';\n var topPosition = oldCanvas.getContext('2d').getImageData(0, 0, this.availableSize.width, initialRect.y);\n newCanvas.getContext('2d').putImageData(topPosition, 0, 0);\n var bottomPosition = oldCanvas.getContext('2d').getImageData(0, initialRect.y + initialRect.height, this.availableSize.width, this.availableSize.height - (initialRect.y + initialRect.height));\n newCanvas.getContext('2d').putImageData(bottomPosition, 0, initialRect.y + initialRect.height);\n var rightPosition = oldCanvas.getContext('2d').getImageData(initialRect.x + initialRect.width, 0, this.availableSize.width - (initialRect.x + initialRect.width), this.availableSize.height);\n newCanvas.getContext('2d').putImageData(rightPosition, initialRect.x + initialRect.width, 0);\n var leftPosition = oldCanvas.getContext('2d').getImageData(0, 0, initialRect.x, this.availableSize.height);\n newCanvas.getContext('2d').putImageData(leftPosition, 0, 0);\n }\n };\n /**\n * To get the collection of selected cells.\n */\n HeatMap.prototype.getSelectedCellData = function (cellX, cellY, cellCollection) {\n var xAxis = this.axisCollections[0];\n var yAxis = this.axisCollections[1];\n var xLabels = xAxis.tooltipLabels;\n var yLabels = yAxis.tooltipLabels.slice().reverse();\n var rectPosition = this.heatMapSeries.getCurrentRect(cellX + 1, cellY + 1);\n var currentRect = document.getElementById(rectPosition.id);\n var cellDetails = new SelectedCellDetails(null, '', '', 0, 0, null, 0, 0, 0, 0, 0, 0);\n cellDetails.value = rectPosition.value;\n cellDetails.xLabel = xLabels[rectPosition.xIndex].toString();\n cellDetails.yLabel = yLabels[rectPosition.yIndex].toString();\n cellDetails.xValue = xAxis.labelValue[rectPosition.xIndex];\n cellDetails.yValue = yAxis.labelValue.slice().reverse()[rectPosition.yIndex];\n cellDetails.cellElement = this.enableCanvasRendering ? null : currentRect;\n cellDetails.xPosition = rectPosition.xIndex;\n cellDetails.yPosition = rectPosition.yIndex;\n cellDetails.width = this.currentRect.width;\n cellDetails.height = this.currentRect.height;\n cellDetails.x = this.currentRect.x;\n cellDetails.y = this.currentRect.y;\n this.currentRect.allowCollection = true;\n this.addSvgClass(currentRect);\n if (cellCollection) {\n this.selectedMultiCellCollection.push(cellDetails);\n this.currentRect.allowCollection = false;\n }\n else {\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n if (this.multiCellCollection[i].xPosition === cellDetails.xPosition &&\n this.multiCellCollection[i].yPosition === cellDetails.yPosition) {\n this.currentRect.allowCollection = false;\n if (this.selectedCellCount === this.selectedMultiCellCollection.length) {\n this.currentRect.allowCollection = false;\n if (!this.enableCanvasRendering) {\n for (var j = 0; j < this.selectedMultiCellCollection.length; j++) {\n var rectElement = this.selectedMultiCellCollection[j].cellElement;\n if (rectElement) {\n var index = rectElement.id.replace(this.element.id + '_HeatMapRect_', '');\n var containerText = document.getElementById(this.element.id + '_Container_TextGroup');\n var elementClassName = rectElement.getAttribute('class');\n rectElement.setAttribute('opacity', '0.3');\n var getText = document.getElementById(this.element.id + '_HeatMapRectLabels_' + index);\n if (getText) {\n getText.setAttribute('opacity', '0.3');\n }\n this.removeSvgClass(rectElement, elementClassName);\n }\n }\n }\n else {\n var ctx = this.secondaryCanvasRenderer.ctx;\n var rect = this.canvasSelectedCells;\n ctx.save();\n ctx.clearRect(rect.x - 1, rect.y - 1, rect.width + 2, rect.height + 2);\n ctx.restore();\n this.selectedCellsRect = new Rect(0, 0, 0, 0);\n }\n this.multiCellCollection.splice(i, 1);\n }\n }\n }\n }\n if (rectPosition.visible && !isNullOrUndefined(rectPosition.value) && this.currentRect.allowCollection === true) {\n this.multiCellCollection.push(cellDetails);\n }\n };\n /**\n * To add class for selected cells\n * @private\n */\n HeatMap.prototype.addSvgClass = function (element) {\n if (!this.enableCanvasRendering) {\n var className = this.element.id + '_selected';\n element.setAttribute('class', className);\n }\n };\n /**\n * To remove class for unselected cells\n * @private\n */\n HeatMap.prototype.removeSvgClass = function (rectElement, className) {\n if (className) {\n rectElement.setAttribute('class', className.replace(className, ''));\n }\n };\n /**\n * To clear the multi cell selection\n */\n HeatMap.prototype.clearSelection = function () {\n if (!this.enableCanvasRendering && this.allowSelection) {\n this.clearSVGSelection();\n }\n if (this.enableCanvasRendering) {\n var ctx = this.secondaryCanvasRenderer.ctx;\n for (var i = 0; i < this.previousSelectedCellsRect.length; i++) {\n ctx.save();\n ctx.clearRect(this.previousSelectedCellsRect[i].x - 1, this.previousSelectedCellsRect[i].y - 1, this.previousSelectedCellsRect[i].width + 2, this.previousSelectedCellsRect[i].height + 2);\n ctx.restore();\n }\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n var rects = this.multiCellCollection[i];\n if (this.multiCellCollection.length > 0) {\n ctx.save();\n ctx.clearRect(rects.x - 1, rects.y - 1, rects.width + 2, rects.height + 2);\n }\n }\n var canvas = document.getElementById(this.element.id + '_canvas');\n canvas.style.opacity = '1';\n }\n this.tempMultiCellCollection = [];\n this.multiCellCollection = [];\n this.rectSelected = false;\n };\n HeatMap.prototype.renderMousePointer = function (pageX, pageY) {\n var legendRange = this.legendModule.legendRange;\n var legendTextRange = this.legendModule.legendTextRange;\n var loop = true;\n for (var i = 0; i < legendRange.length; i++) {\n if (this.legendSettings.toggleVisibility && this.legendModule.currentPage === legendRange[i].currentPage) {\n if ((loop && (pageX >= legendRange[i].x && pageX <= legendRange[i].width + legendRange[i].x) &&\n (pageY >= legendRange[i].y && pageY <= legendRange[i].y + legendRange[i].height) ||\n ((this.legendSettings.showLabel && this.legendSettings.labelDisplayType !== 'None' &&\n pageX >= legendTextRange[i].x && pageX <= legendTextRange[i].width + legendTextRange[i].x) &&\n (pageY >= legendTextRange[i].y && pageY <= legendTextRange[i].y + legendTextRange[i].height)))) {\n if (this.enableCanvasRendering) {\n document.getElementById(this.element.id + '_canvas').style.cursor = 'Pointer';\n }\n else {\n document.getElementById(this.element.id + '_svg').style.cursor = 'Pointer';\n }\n loop = false;\n }\n else if (loop) {\n if (this.enableCanvasRendering) {\n document.getElementById(this.element.id + '_canvas').style.cursor = '';\n }\n else {\n document.getElementById(this.element.id + '_svg').style.cursor = '';\n }\n }\n }\n }\n };\n /**\n * Handles the mouse end.\n * @return {boolean}\n * @private\n */\n HeatMap.prototype.heatMapMouseLeave = function (e) {\n var _this = this;\n if (e.target && e.target.id &&\n (this.cellSettings.enableCellHighlighting || (this.tooltipModule && this.showTooltip))\n && !this.enableCanvasRendering) {\n this.heatMapSeries.highlightSvgRect(this.tempTooltipRectId);\n }\n if (this.allowSelection && this.multiSelection) {\n this.multiSelection = false;\n if (e.type === 'mouseup' || e.type === 'touchend' || e.type === 'pointerup') {\n if (e.which !== 2 && e.which !== 3) {\n if (this.isCellTapHold === false) {\n this.getDataCollection();\n this.currentRect.allowCollection = false;\n this.setCellOpacity();\n var argData = {\n heatmap: this,\n cancel: false,\n name: 'cellSelected',\n data: this.multiCellCollection\n };\n this.trigger('cellSelected', argData);\n }\n else {\n this.isCellTapHold = false;\n }\n }\n }\n else if (e.type === 'mouseleave' && (this.element.id + '_selectedCells')) {\n removeElement(this.element.id + '_selectedCells');\n }\n }\n if (this.tooltipModule && this.showTooltip && e.type === 'mouseleave') {\n this.tooltipModule.showHideTooltip(false);\n }\n this.tempTooltipRectId = '';\n if (this.legendModule && this.legendSettings.visible && this.legendModule.tooltipObject &&\n this.legendModule.tooltipObject.element) {\n var tooltipElement_1 = this.legendModule.tooltipObject.element.firstChild;\n if (e.type === 'mouseleave') {\n tooltipElement_1.setAttribute('opacity', '0');\n }\n else {\n if (this.legendTooltipTimer) {\n window.clearTimeout(this.legendTooltipTimer);\n }\n this.legendTooltipTimer = setTimeout(function () {\n tooltipElement_1.setAttribute('opacity', '0');\n }, 1500);\n }\n }\n if (this.paletteSettings.type === 'Gradient' && this.legendModule && this.legendSettings.showGradientPointer &&\n this.legendSettings.visible && this.legendVisibilityByCellType) {\n if (e.type === 'mouseleave') {\n this.legendModule.removeGradientPointer();\n }\n else {\n if (this.gradientTimer) {\n window.clearTimeout(this.gradientTimer);\n }\n this.gradientTimer = setTimeout(function () { _this.legendModule.removeGradientPointer(); }, 1500);\n }\n }\n if (this.enableCanvasRendering) {\n var main = document.getElementById(this.element.id + '_hoverRect_canvas');\n if (main) {\n main.style.visibility = 'hidden';\n this.tempRectHoverClass = '';\n }\n }\n if (this.titleSettings.text && this.titleCollection[0].indexOf('...') !== -1) {\n if (!this.enableCanvasRendering) {\n removeElement(this.element.id + '_Title_Tooltip');\n }\n else {\n removeElement(this.element.id + '_canvas_Tooltip');\n }\n }\n return true;\n };\n /**\n * Method to Check for deselection of cell.\n */\n HeatMap.prototype.checkSelectedCells = function () {\n if (!this.enableCanvasRendering) {\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n for (var j = 0; j < this.selectedMultiCellCollection.length; j++) {\n if (this.selectedMultiCellCollection[j].cellElement.getAttribute('id')\n === this.multiCellCollection[i].cellElement.getAttribute('id')) {\n this.selectedCellCount++;\n }\n }\n }\n }\n else {\n this.canvasSelectedCells = new Rect(0, 0, 0, 0);\n this.canvasSelectedCells.x = this.selectedCellsRect.x;\n this.canvasSelectedCells.y = this.selectedCellsRect.y;\n this.canvasSelectedCells.width = this.selectedCellsRect.width;\n this.canvasSelectedCells.height = this.selectedCellsRect.height;\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n for (var j = 0; j < this.selectedMultiCellCollection.length; j++) {\n if (this.selectedMultiCellCollection[j].xPosition === this.multiCellCollection[i].xPosition &&\n this.selectedMultiCellCollection[j].yPosition === this.multiCellCollection[i].yPosition) {\n this.selectedCellCount++;\n }\n }\n }\n }\n };\n /**\n * Method to remove opacity for text of selected cell for HeatMap\n */\n HeatMap.prototype.removeOpacity = function (containersRect, containerText) {\n for (var i = 0; i < containersRect.childNodes.length; i++) {\n containersRect.childNodes[i].setAttribute('opacity', '0.3');\n if (this.cellSettings.showLabel && containerText.childNodes[i]) {\n containerText.childNodes[i].setAttribute('opacity', '0.3');\n }\n }\n };\n /**\n * Method to set opacity for selected cell for HeatMap\n */\n HeatMap.prototype.setCellOpacity = function () {\n if (!this.enableCanvasRendering) {\n if (this.multiCellCollection.length !== 0) {\n this.tempMultiCellCollection.push(this.multiCellCollection);\n var containersRect = document.getElementById(this.element.id + '_Container_RectGroup');\n var containerText = document.getElementById(this.element.id + '_Container_TextGroup');\n this.removeOpacity(containersRect, containerText);\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n var collectionClasss = this.multiCellCollection[i].cellElement;\n var index = parseInt(collectionClasss.id.replace(this.element.id + '_HeatMapRect_', ''), 10);\n containersRect.childNodes[index].setAttribute('opacity', '1');\n if (this.cellSettings.showLabel) {\n var getText = document.getElementById(this.element.id + '_HeatMapRectLabels_' + index);\n if (getText) {\n getText.setAttribute('opacity', '1');\n }\n }\n }\n }\n }\n else {\n this.previousSelectedCellsRect.push(this.selectedCellsRect);\n this.highlightSelectedAreaInCanvas(this.selectedCellsRect);\n }\n removeElement(this.element.id + '_selectedCells');\n };\n /**\n * To create div container for rendering two layers of canvas.\n * @return {void}\n * @private\n */\n HeatMap.prototype.createMultiCellDiv = function (onLoad) {\n if (onLoad) {\n var divElement = this.createElement('div', {\n id: this.element.id + '_Multi_CellSelection_Canvas',\n styles: 'position:relative'\n });\n this.element.appendChild(divElement);\n divElement.appendChild(this.svgObject);\n this.svgObject.style.position = 'absolute';\n this.svgObject.style.left = '0px';\n this.svgObject.style.top = '0px';\n this.svgObject.style.zIndex = '0';\n }\n else {\n var element = document.getElementById(this.element.id + '_Multi_CellSelection_Canvas');\n var secondaryCanvas = this.secondaryCanvasRenderer.createCanvas({\n width: this.availableSize.width,\n height: this.availableSize.height, x: 0, y: 0,\n style: 'position: absolute; z-index: 1'\n });\n element.appendChild(secondaryCanvas);\n }\n };\n __decorate([\n Property(null)\n ], HeatMap.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], HeatMap.prototype, \"height\", void 0);\n __decorate([\n Property(true)\n ], HeatMap.prototype, \"showTooltip\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"tooltipRender\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"resized\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"loaded\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"cellRender\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"cellSelected\", void 0);\n __decorate([\n Property('SVG')\n ], HeatMap.prototype, \"renderingMode\", void 0);\n __decorate([\n Property(null)\n ], HeatMap.prototype, \"dataSource\", void 0);\n __decorate([\n Property('Material')\n ], HeatMap.prototype, \"theme\", void 0);\n __decorate([\n Property(false)\n ], HeatMap.prototype, \"allowSelection\", void 0);\n __decorate([\n Complex({}, Margin)\n ], HeatMap.prototype, \"margin\", void 0);\n __decorate([\n Complex({ text: '', textStyle: Theme.heatMapTitleFont }, Title)\n ], HeatMap.prototype, \"titleSettings\", void 0);\n __decorate([\n Complex({}, Axis)\n ], HeatMap.prototype, \"xAxis\", void 0);\n __decorate([\n Complex({}, LegendSettings)\n ], HeatMap.prototype, \"legendSettings\", void 0);\n __decorate([\n Complex({}, PaletteSettings)\n ], HeatMap.prototype, \"paletteSettings\", void 0);\n __decorate([\n Complex({}, TooltipSettings)\n ], HeatMap.prototype, \"tooltipSettings\", void 0);\n __decorate([\n Complex({}, Axis)\n ], HeatMap.prototype, \"yAxis\", void 0);\n __decorate([\n Complex({}, CellSettings)\n ], HeatMap.prototype, \"cellSettings\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"load\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"cellClick\", void 0);\n HeatMap = __decorate([\n NotifyPropertyChanges\n ], HeatMap);\n return HeatMap;\n}(Component));\nexport { HeatMap };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { isNullOrUndefined, Complex } from '@syncfusion/ej2-base';\nimport { Property, ChildProperty } from '@syncfusion/ej2-base';\nimport { DataUtil } from '@syncfusion/ej2-data';\nimport { increaseDateTimeInterval } from '../utils/helper';\nimport { BubbleData } from '../model/base';\n/**\n * Configures the Adaptor Property in the Heatmap.\n */\nvar Data = /** @class */ (function (_super) {\n __extends(Data, _super);\n function Data() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], Data.prototype, \"data\", void 0);\n __decorate([\n Property(false)\n ], Data.prototype, \"isJsonData\", void 0);\n __decorate([\n Property('cell')\n ], Data.prototype, \"adaptorType\", void 0);\n __decorate([\n Property('')\n ], Data.prototype, \"xDataMapping\", void 0);\n __decorate([\n Property('')\n ], Data.prototype, \"yDataMapping\", void 0);\n __decorate([\n Property('')\n ], Data.prototype, \"valueMapping\", void 0);\n __decorate([\n Complex({}, BubbleData)\n ], Data.prototype, \"bubbleDataMapping\", void 0);\n return Data;\n}(ChildProperty));\nexport { Data };\nvar AdaptiveMinMax = /** @class */ (function () {\n function AdaptiveMinMax() {\n }\n return AdaptiveMinMax;\n}());\nexport { AdaptiveMinMax };\n/**\n *\n * The `Adaptor` module is used to handle JSON and Table data.\n */\nvar Adaptor = /** @class */ (function () {\n function Adaptor(heatMap) {\n this.reconstructedXAxis = [];\n this.reconstructedYAxis = [];\n this.adaptiveXMinMax = new AdaptiveMinMax();\n this.adaptiveYMinMax = new AdaptiveMinMax();\n this.heatMap = heatMap;\n }\n /**\n * Method to construct Two Dimentional Datasource.\n * @return {void}\n * @private\n */\n Adaptor.prototype.constructDatasource = function (adaptData) {\n if (adaptData.adaptorType === 'Cell') {\n var xAxis = this.heatMap.xAxis;\n var yAxis = this.heatMap.yAxis;\n this.adaptiveXMinMax.min = xAxis.minimum;\n this.adaptiveXMinMax.max = xAxis.maximum;\n this.adaptiveYMinMax.min = yAxis.minimum;\n this.adaptiveYMinMax.max = yAxis.maximum;\n if (((xAxis.valueType === 'Numeric' || xAxis.valueType === 'DateTime') &&\n (isNullOrUndefined(xAxis.minimum) || isNullOrUndefined(xAxis.maximum))) ||\n ((yAxis.valueType === 'Numeric' || yAxis.valueType === 'DateTime') &&\n (isNullOrUndefined(yAxis.minimum) || isNullOrUndefined(yAxis.maximum)))) {\n this.getMinMaxValue(adaptData, xAxis, yAxis);\n }\n this.heatMap.isCellData = true;\n }\n if (adaptData && adaptData.data === undefined) {\n this.heatMap.completeAdaptDataSource = adaptData;\n }\n else if (!adaptData.isJsonData && adaptData.adaptorType === 'Table' || adaptData.data === null) {\n this.heatMap.completeAdaptDataSource = adaptData.data;\n }\n else if (adaptData.isJsonData && adaptData.adaptorType === 'Table') {\n this.heatMap.completeAdaptDataSource = this.processJsonTableData(adaptData);\n }\n else if (adaptData.isJsonData && adaptData.adaptorType === 'Cell') {\n this.heatMap.completeAdaptDataSource = this.processJsonCellData(adaptData);\n }\n else if (!adaptData.isJsonData && adaptData.adaptorType === 'Cell') {\n this.constructAdaptiveAxis();\n this.heatMap.completeAdaptDataSource = this.processCellData(adaptData);\n this.heatMap.isCellData = true;\n }\n };\n /**\n * Method to construct Axis Collection.\n * @return {void}\n * @private\n */\n Adaptor.prototype.constructAdaptiveAxis = function () {\n var xAxis = this.heatMap.xAxis;\n var yAxis = this.heatMap.yAxis;\n var intervalType;\n if (xAxis.valueType === 'Numeric') {\n this.reconstructedXAxis = this.getNumericAxisCollection(this.adaptiveXMinMax.min, this.adaptiveXMinMax.max, xAxis.increment);\n }\n if (yAxis.valueType === 'Numeric') {\n this.reconstructedYAxis = this.getNumericAxisCollection(this.adaptiveYMinMax.min, this.adaptiveYMinMax.max, yAxis.increment);\n }\n if (xAxis.valueType === 'DateTime') {\n this.reconstructedXAxis = this.getDateAxisCollection(this.adaptiveXMinMax.min, this.adaptiveXMinMax.max, xAxis.intervalType, xAxis.increment);\n }\n if (yAxis.valueType === 'DateTime') {\n this.reconstructedYAxis = this.getDateAxisCollection(this.adaptiveYMinMax.min, this.adaptiveYMinMax.max, yAxis.intervalType, yAxis.increment);\n }\n };\n /**\n * Method to calculate Numeric Axis Collection.\n * @return {string[]}\n * @private\n */\n Adaptor.prototype.getNumericAxisCollection = function (min, max, increment) {\n var loopIndex = min;\n var tempAxisColl = [];\n while (loopIndex <= max) {\n tempAxisColl.push(loopIndex.toString());\n loopIndex = loopIndex + increment;\n }\n return tempAxisColl;\n };\n /**\n * Method to calculate DateTime Axis Collection.\n * @return {string[]}\n * @private\n */\n Adaptor.prototype.getDateAxisCollection = function (min, max, intervalType, increment) {\n var option = {\n skeleton: 'full',\n type: 'dateTime'\n };\n var dateParser = this.heatMap.intl.getDateParser(option);\n var dateFormatter = this.heatMap.intl.getDateFormat(option);\n min = Date.parse(dateParser(dateFormatter(new Date(DataUtil.parse.parseJson({ val: min }).val))));\n var tempInterval = min;\n var tempAxisColl = [];\n while (tempInterval <= max) {\n tempAxisColl.push(new Date(tempInterval).toString());\n tempInterval = increaseDateTimeInterval(tempInterval, 1, intervalType, increment).getTime();\n }\n return tempAxisColl;\n };\n /**\n * Method to calculate Maximum and Minimum Value from datasource.\n * @return {void}\n * @private\n */\n Adaptor.prototype.getMinMaxValue = function (adapData, xAxis, yAxis) {\n var data = adapData.data;\n var label = Object.keys(data[0]);\n if (data.length > 0) {\n this.adaptiveXMinMax.min = !isNullOrUndefined(xAxis.minimum) ? xAxis.minimum : adapData.isJsonData ?\n // tslint:disable-next-line:no-any\n data[0][label[0]] : data[0][0];\n this.adaptiveYMinMax.min = !isNullOrUndefined(yAxis.minimum) ? yAxis.minimum : adapData.isJsonData ?\n // tslint:disable-next-line:no-any\n data[0][label[1]] : data[0][1];\n this.adaptiveXMinMax.max = !isNullOrUndefined(xAxis.maximum) ? xAxis.maximum : adapData.isJsonData ?\n // tslint:disable-next-line:no-any\n data[0][label[0]] : data[0][0];\n this.adaptiveYMinMax.max = !isNullOrUndefined(yAxis.maximum) ? yAxis.maximum : adapData.isJsonData ?\n // tslint:disable-next-line:no-any\n data[0][label[1]] : data[0][1];\n }\n for (var dataIndex = 0; dataIndex < data.length; dataIndex++) {\n // tslint:disable-next-line:no-any\n var xDataIndex = adapData.isJsonData ? data[dataIndex][label[0]] : data[dataIndex][0];\n // tslint:disable-next-line:no-any\n var yDataIndex = adapData.isJsonData ? data[dataIndex][label[1]] : data[dataIndex][1];\n if (xDataIndex < this.adaptiveXMinMax.min && isNullOrUndefined(xAxis.minimum)) {\n this.adaptiveXMinMax.min = xDataIndex;\n }\n if (xDataIndex > this.adaptiveXMinMax.max && isNullOrUndefined(xAxis.maximum)) {\n this.adaptiveXMinMax.max = xDataIndex;\n }\n if (yDataIndex < this.adaptiveYMinMax.min && isNullOrUndefined(yAxis.minimum)) {\n this.adaptiveYMinMax.min = yDataIndex;\n }\n if (yDataIndex > this.adaptiveYMinMax.max && isNullOrUndefined(yAxis.maximum)) {\n this.adaptiveYMinMax.max = yDataIndex;\n }\n }\n };\n /**\n * Method to process Cell datasource.\n * @return {Object}\n * @private\n */\n Adaptor.prototype.processCellData = function (adaptordata) {\n // tslint:disable-next-line:no-any \n var tempDataCollection = adaptordata.data;\n var xLabels = this.reconstructedXAxis;\n var yLabels = this.reconstructedYAxis;\n var currentDataXIndex = 0;\n var currentDataYIndex = 0;\n if (tempDataCollection.length) {\n this.reconstructData = [];\n for (var xindex = 0; xindex < tempDataCollection.length; xindex++) {\n if (this.heatMap.xAxis.valueType === 'Category') {\n currentDataXIndex = tempDataCollection[xindex][0];\n }\n else {\n currentDataXIndex = xLabels.indexOf(tempDataCollection[xindex][0].toString());\n }\n if (currentDataXIndex > -1) {\n while (!this.reconstructData[currentDataXIndex]) {\n this.reconstructData.push([]);\n }\n if (this.heatMap.yAxis.valueType === 'Category') {\n currentDataYIndex = tempDataCollection[xindex][1];\n }\n else {\n currentDataYIndex = yLabels.indexOf(tempDataCollection[xindex][1].toString());\n }\n if (currentDataYIndex !== -1) {\n while (this.reconstructData[currentDataXIndex][currentDataYIndex] !== '') {\n this.reconstructData[currentDataXIndex].push('');\n }\n this.reconstructData[currentDataXIndex][currentDataYIndex] = isNullOrUndefined(tempDataCollection[xindex][2]) ?\n '' : tempDataCollection[xindex][2];\n }\n }\n }\n }\n return this.reconstructData;\n };\n /**\n * Method to process JSON Cell datasource.\n * @return {Object}\n * @private\n */\n Adaptor.prototype.processJsonCellData = function (adaptordata) {\n // tslint:disable-next-line:no-any \n var tempDataCollection = adaptordata.data;\n var xAxisLabels = this.heatMap.xAxis.labels ? this.heatMap.xAxis.labels : [];\n var yAxisLabels = this.heatMap.yAxis.labels ? this.heatMap.yAxis.labels : [];\n var axisCollections = this.heatMap.axisCollections;\n if (xAxisLabels.length === 0 || yAxisLabels.length === 0) {\n this.generateAxisLabels(adaptordata);\n }\n var xLabels = (this.heatMap.xAxis.valueType === 'Category') ? (xAxisLabels.length > 0 ?\n this.heatMap.xAxis.labels : axisCollections[0].jsonCellLabel) : axisCollections[0].labelValue;\n var yLabels = (this.heatMap.yAxis.valueType === 'Category') ? (yAxisLabels.length > 0 ?\n this.heatMap.yAxis.labels : axisCollections[1].jsonCellLabel) : axisCollections[1].labelValue;\n var currentDataXIndex = 0;\n var currentDataYIndex = 0;\n if (tempDataCollection.length) {\n this.reconstructData = [];\n for (var index = 0; index < tempDataCollection.length; index++) {\n currentDataXIndex = this.getSplitDataValue(tempDataCollection[index], adaptordata, xLabels, adaptordata.xDataMapping.split('.'), this.heatMap.xAxis.valueType);\n if (currentDataXIndex !== -1) {\n while (!this.reconstructData[currentDataXIndex]) {\n this.reconstructData.push([]);\n }\n currentDataYIndex = this.getSplitDataValue(tempDataCollection[index], adaptordata, yLabels, adaptordata.yDataMapping.split('.'), this.heatMap.yAxis.valueType);\n if (currentDataYIndex !== -1) {\n while (isNullOrUndefined(this.reconstructData[currentDataXIndex][currentDataYIndex])) {\n this.reconstructData[currentDataXIndex].push('');\n }\n if (this.heatMap.bubbleSizeWithColor) {\n this.reconstructData[currentDataXIndex][currentDataYIndex] = [\n this.getSplitDataValue(tempDataCollection[index], adaptordata, null, adaptordata.bubbleDataMapping.size.split('.'), ''),\n this.getSplitDataValue(tempDataCollection[index], adaptordata, null, adaptordata.bubbleDataMapping.color.split('.'), '')\n ];\n }\n else {\n this.reconstructData[currentDataXIndex][currentDataYIndex] = this.getSplitDataValue(tempDataCollection[index], adaptordata, null, adaptordata.valueMapping.split('.'), '');\n }\n }\n }\n }\n }\n return this.reconstructData;\n };\n /**\n * Method to generate axis labels when labels are not given.\n * @return {string}\n * @private\n */\n Adaptor.prototype.generateAxisLabels = function (adaptordata) {\n // tslint:disable-next-line:no-any \n var tempDataCollection = adaptordata.data;\n var xLabels = this.heatMap.xAxis.labels ? this.heatMap.xAxis.labels : [];\n var yLabels = this.heatMap.yAxis.labels ? this.heatMap.yAxis.labels : [];\n var hasXLabels = xLabels.length > 0 ? true : false;\n var hasYLabels = yLabels.length > 0 ? true : false;\n var axisCollection = this.heatMap.axisCollections;\n for (var index = 0; index < axisCollection.length; index++) {\n var valueType = axisCollection[index].valueType;\n var axis = axisCollection[index];\n if (valueType === 'Category') {\n var hasLabels = void 0;\n var dataMapping = void 0;\n var labels = void 0;\n if (axis.orientation === 'Horizontal') {\n hasLabels = hasXLabels;\n dataMapping = adaptordata.xDataMapping;\n axis.jsonCellLabel = labels = [];\n }\n else {\n hasLabels = hasYLabels;\n dataMapping = adaptordata.yDataMapping;\n axis.jsonCellLabel = labels = [];\n }\n if (!hasLabels) {\n for (var i = 0; i < tempDataCollection.length; i++) {\n if (dataMapping in tempDataCollection[i]) {\n var xValue = tempDataCollection[i][dataMapping].toString();\n if (labels.indexOf(xValue.toString()) === -1) {\n labels.push(xValue);\n }\n }\n }\n }\n }\n else if (valueType === 'DateTime') {\n axis.clearAxisLabel();\n axis.calculateDateTimeAxisLabel(this.heatMap);\n }\n else {\n axis.clearAxisLabel();\n axis.calculateNumericAxisLabels(this.heatMap);\n }\n }\n };\n /**\n * Method to get data from complex mapping.\n * @return {number|string}\n * @private\n */\n Adaptor.prototype.getSplitDataValue = function (\n // tslint:disable-next-line:no-any \n tempSplitDataCollection, adaptordata, labels, tempSplitData, valueType) {\n var value = -1;\n this.tempSplitDataCollection = tempSplitDataCollection;\n for (var splitIndex = 0; splitIndex < tempSplitData.length; splitIndex++) {\n value = !isNullOrUndefined(labels) ? (!(valueType === 'DateTime') ?\n labels.indexOf(this.tempSplitDataCollection[tempSplitData[splitIndex]]) :\n labels.map(Number).indexOf(+this.tempSplitDataCollection[tempSplitData[splitIndex]])) : null;\n if (!isNullOrUndefined(this.tempSplitDataCollection)) {\n this.tempSplitDataCollection = value !== -1 && !isNullOrUndefined(labels) ?\n this.tempSplitDataCollection : this.tempSplitDataCollection[tempSplitData[splitIndex]];\n }\n if (isNullOrUndefined(this.tempSplitDataCollection)) {\n break;\n }\n }\n value = !isNullOrUndefined(labels) ? value : isNullOrUndefined(this.tempSplitDataCollection) ||\n this.tempSplitDataCollection.toString() === '' ? '' : parseFloat(this.tempSplitDataCollection.toString());\n return value;\n };\n /**\n * Method to process JSON Table datasource.\n * @return {Object}\n * @private\n */\n Adaptor.prototype.processJsonTableData = function (adaptordata) {\n // tslint:disable-next-line:no-any \n var tempDataCollection = adaptordata.data;\n var currentDataXIndex = 0;\n var currentDataYIndex = 0;\n var xLabels = this.heatMap.xAxis.labels ? this.heatMap.xAxis.labels : [];\n var yLabels = this.heatMap.yAxis.labels ? this.heatMap.yAxis.labels : [];\n var key;\n if (tempDataCollection.length) {\n this.reconstructData = [];\n for (var xindex = 0; xindex < tempDataCollection.length; xindex++) {\n currentDataXIndex = this.getSplitDataValue(tempDataCollection[xindex], adaptordata, xLabels, adaptordata.xDataMapping.split('.'), this.heatMap.xAxis.valueType);\n if (currentDataXIndex !== -1) {\n while (!this.reconstructData[currentDataXIndex]) {\n this.reconstructData.push([]);\n }\n for (var index = 0; index < Object.keys(this.tempSplitDataCollection).length; index++) {\n key = Object.keys(this.tempSplitDataCollection)[index];\n currentDataYIndex = key !== adaptordata.xDataMapping ? yLabels.indexOf(key) : -1;\n if (currentDataYIndex !== -1) {\n while (isNullOrUndefined(this.reconstructData[currentDataXIndex][currentDataYIndex])) {\n this.reconstructData[currentDataXIndex].push('');\n }\n this.reconstructData[currentDataXIndex][currentDataYIndex] =\n isNullOrUndefined(this.tempSplitDataCollection[key]) ?\n '' : this.tempSplitDataCollection[key];\n }\n }\n }\n }\n }\n return this.reconstructData;\n };\n /**\n * To destroy the Adaptor.\n * @return {void}\n * @private\n */\n Adaptor.prototype.destroy = function (heatMap) {\n /**\n * No Lines\n */\n };\n ;\n /**\n * To get Module name\n */\n Adaptor.prototype.getModuleName = function () {\n return 'Adaptor';\n };\n return Adaptor;\n}());\nexport { Adaptor };\n","import * as index from '@syncfusion/ej2-heatmap';\nindex.HeatMap.Inject( index.Legend,index.Tooltip,index.Adaptor);\nexport * from '@syncfusion/ej2-heatmap';\n","/**\n * InPlace-Editor events defined here.\n */\n/** @hidden */\nexport var render = 'render';\n/** @hidden */\nexport var update = 'update';\n/** @hidden */\nexport var destroy = 'destroy';\n/** @hidden */\nexport var setFocus = 'set-focus';\n/** @hidden */\nexport var accessValue = 'access-value';\n/** @hidden */\nexport var destroyModules = 'destroy-modules';\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { ChildProperty, Property } from '@syncfusion/ej2-base';\n/**\n * Configures the popup settings of the In-place editor.\n */\nvar PopupSettings = /** @class */ (function (_super) {\n __extends(PopupSettings, _super);\n function PopupSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], PopupSettings.prototype, \"title\", void 0);\n __decorate([\n Property(null)\n ], PopupSettings.prototype, \"model\", void 0);\n return PopupSettings;\n}(ChildProperty));\nexport { PopupSettings };\n/**\n * @hidden\n */\nexport var modulesList = {\n 'AutoComplete': 'auto-complete',\n 'Color': 'color-picker',\n 'ComboBox': 'combo-box',\n 'DateRange': 'date-range-picker',\n 'MultiSelect': 'multi-select',\n 'RTE': 'rte',\n 'Slider': 'slider',\n 'Time': 'time-picker'\n};\n/**\n * @hidden\n */\nexport var localeConstant = {\n 'Click': { 'editAreaClick': 'Click to edit' },\n 'DblClick': { 'editAreaDoubleClick': 'Double click to edit' }\n};\n","/**\n * InPlace-Editor classes defined here.\n */\n/** @hidden */\nexport var ROOT = 'e-inplaceeditor';\n/** @hidden */\nexport var ROOT_TIP = 'e-inplaceeditor-tip';\n/** @hidden */\nexport var VALUE_WRAPPER = 'e-editable-value-wrapper';\n/** @hidden */\nexport var VALUE = 'e-editable-value';\n/** @hidden */\nexport var OVERLAY_ICON = 'e-editable-overlay-icon';\n/** @hidden */\nexport var TIP_TITLE = 'e-editable-tip-title';\n/** @hidden */\nexport var TITLE = 'e-editable-title';\n/** @hidden */\nexport var INLINE = 'e-editable-inline';\n/** @hidden */\nexport var POPUP = 'e-editable-popup';\n/** @hidden */\nexport var WRAPPER = 'e-editable-wrapper';\n/** @hidden */\nexport var LOADING = 'e-editable-loading';\n/** @hidden */\nexport var FORM = 'e-editable-form';\n/** @hidden */\nexport var CTRL_GROUP = 'e-component-group';\n/** @hidden */\nexport var INPUT = 'e-editable-component';\n/** @hidden */\nexport var BUTTONS = 'e-editable-action-buttons';\n/** @hidden */\nexport var EDITABLE_ERROR = 'e-editable-error';\n/** @hidden */\nexport var ELEMENTS = 'e-editable-elements';\n/** @hidden */\nexport var OPEN = 'e-editable-open';\n/** @hidden */\nexport var BTN_SAVE = 'e-btn-save';\n/** @hidden */\nexport var BTN_CANCEL = 'e-btn-cancel';\n/** @hidden */\nexport var RTE_SPIN_WRAP = 'e-rte-spin-wrap';\n/** @hidden */\nexport var CTRL_OVERLAY = 'e-control-overlay';\n/** @hidden */\nexport var DISABLE = 'e-disable';\n/** @hidden */\nexport var ICONS = 'e-icons';\n/** @hidden */\nexport var PRIMARY = 'e-primary';\n/** @hidden */\nexport var SHOW = 'e-show';\n/** @hidden */\nexport var HIDE = 'e-hide';\n/** @hidden */\nexport var RTL = 'e-rtl';\n/** @hidden */\nexport var ERROR = 'e-error';\n/** @hidden */\nexport var LOAD = 'e-loading';\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, NotifyPropertyChanges, Property, Event, select } from '@syncfusion/ej2-base';\nimport { detach, addClass, removeClass, EventHandler, setStyleAttribute, Complex } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined as isNOU, closest, extend, L10n, compile, Browser, Touch } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { DataManager, UrlAdaptor, Query, WebApiAdaptor, ODataV4Adaptor } from '@syncfusion/ej2-data';\nimport { Button } from '@syncfusion/ej2-buttons';\nimport { DatePicker, DateTimePicker } from '@syncfusion/ej2-calendars';\nimport { NumericTextBox, TextBox } from '@syncfusion/ej2-inputs';\nimport { createSpinner, hideSpinner, showSpinner } from '@syncfusion/ej2-popups';\nimport { Tooltip } from '@syncfusion/ej2-popups';\nimport { FormValidator, MaskedTextBox } from '@syncfusion/ej2-inputs';\nimport { DropDownList } from '@syncfusion/ej2-dropdowns';\n/* Helper modules */\nimport * as events from './events';\nimport * as classes from './classes';\n/* Models */\nimport { PopupSettings, modulesList, localeConstant } from './models';\n/* Interface */\nimport { parseValue, getCompValue } from './util';\n/**\n * ```html\n * * The In-place editor control is used to edit an element in a place and to update the value in server.\n * \n * \n * ```\n */\nvar InPlaceEditor = /** @class */ (function (_super) {\n __extends(InPlaceEditor, _super);\n /**\n * Initializes a new instance of the In-place editor class.\n * @param options - Specifies In-place editor model properties as options.\n * @param element - Specifies the element for which In-place editor applies.\n */\n function InPlaceEditor(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.initRender = true;\n _this.isTemplate = false;\n _this.isExtModule = false;\n _this.submitBtn = undefined;\n _this.cancelBtn = undefined;\n _this.isClearTarget = false;\n _this.btnElements = undefined;\n _this.dataManager = undefined;\n _this.divComponents = ['RTE', 'Slider'];\n _this.clearComponents = ['AutoComplete', 'Mask', 'Text'];\n _this.dateType = ['Date', 'DateTime', 'Time'];\n _this.inputDataEle = ['Date', 'DateTime', 'DateRange', 'Time', 'Numeric'];\n _this.dropDownEle = ['AutoComplete', 'ComboBox', 'DropDownList', 'MultiSelect'];\n _this.moduleList = ['AutoComplete', 'Color', 'ComboBox', 'DateRange', 'MultiSelect', 'RTE', 'Slider', 'Time'];\n /**\n * @hidden\n */\n _this.needsID = true;\n return _this;\n }\n /**\n * Initialize the event handler\n * @private\n */\n InPlaceEditor.prototype.preRender = function () {\n if (isNOU(this.model)) {\n this.setProperties({ model: {} }, true);\n }\n this.titleEle = this.createElement('div', { className: classes.TITLE });\n if (!isNullOrUndefined(this.popupSettings.model) && this.popupSettings.model.afterOpen) {\n this.afterOpenEvent = this.popupSettings.model.afterOpen;\n }\n };\n /**\n * To Initialize the In-place editor rendering\n * @private\n */\n InPlaceEditor.prototype.render = function () {\n this.element.setAttribute('tabindex', '0');\n this.checkIsTemplate();\n this.disable(this.disabled);\n this.updateAdaptor();\n this.appendValueElement();\n this.updateValue();\n this.renderValue(this.checkValue(parseValue(this.type, this.value)));\n this.wireEvents();\n this.setRtl(this.enableRtl);\n this.enableEditor(this.enableEditMode);\n this.setClass('add', this.cssClass);\n };\n InPlaceEditor.prototype.setClass = function (action, val) {\n if (!this.isEmpty(val)) {\n action === 'add' ? addClass([this.element], [val]) : removeClass([this.element], [val]);\n }\n };\n InPlaceEditor.prototype.appendValueElement = function () {\n this.valueWrap = this.createElement('div', { id: this.element.id + '_wrap', className: classes.VALUE_WRAPPER });\n this.element.innerHTML = '';\n this.valueEle = this.createElement('span', { className: classes.VALUE });\n this.editIcon = this.createElement('span', {\n className: classes.OVERLAY_ICON + ' ' + classes.ICONS,\n attrs: { 'title': this.getLocale({ editIcon: 'Click to edit' }, 'editIcon') }\n });\n this.valueWrap.appendChild(this.valueEle);\n this.valueWrap.appendChild(this.editIcon);\n this.element.appendChild(this.valueWrap);\n };\n InPlaceEditor.prototype.renderValue = function (val) {\n this.valueEle.innerHTML = val;\n if (this.type === 'Color') {\n setStyleAttribute(this.valueEle, { 'color': val });\n }\n if (this.mode === 'Inline') {\n removeClass([this.valueWrap], [classes.HIDE]);\n }\n };\n InPlaceEditor.prototype.renderEditor = function () {\n var tipOptions = undefined;\n var target = select('.' + classes.VALUE_WRAPPER, this.element);\n if (this.valueWrap.classList.contains(classes.OPEN)) {\n return;\n }\n if (this.mode === 'Inline') {\n this.loaderWidth = this.valueWrap.offsetWidth;\n addClass([this.valueWrap], [classes.HIDE]);\n this.inlineWrapper = this.createElement('div', { className: classes.INLINE });\n this.element.appendChild(this.inlineWrapper);\n this.renderControl(this.inlineWrapper);\n this.afterOpenHandler(null);\n }\n else {\n if (!isNullOrUndefined(this.popupSettings.model) && this.popupSettings.model.afterOpen) {\n this.popupSettings.model.afterOpen = this.afterOpenHandler.bind(this);\n }\n var content = this.createElement('div', { className: classes.POPUP });\n if (!this.isEmpty(this.popupSettings.title)) {\n this.titleEle.innerHTML = this.popupSettings.title;\n content.appendChild(this.titleEle);\n }\n tipOptions = {\n content: content, opensOn: 'Custom',\n enableRtl: this.enableRtl, cssClass: classes.ROOT_TIP,\n afterOpen: this.afterOpenHandler.bind(this)\n };\n content.appendChild(this.renderControl(document.body));\n extend(tipOptions, this.popupSettings.model, tipOptions, true);\n this.tipObj = new Tooltip(tipOptions);\n this.tipObj.appendTo(target);\n this.tipObj.open(target);\n }\n if (this.actionOnBlur !== 'Ignore') {\n this.wireDocEvent();\n }\n this.initRender = false;\n addClass([this.valueWrap], [classes.OPEN]);\n this.setProperties({ enableEditMode: true }, true);\n };\n InPlaceEditor.prototype.setAttribute = function (ele, attr) {\n var value = this.name && this.name.length !== 0 ? this.name : this.element.id;\n attr.forEach(function (val) {\n ele.setAttribute(val, ((val === 'id') ? (value + '_editor') : value));\n });\n };\n InPlaceEditor.prototype.renderControl = function (target) {\n var ele;\n this.containerEle = this.createElement('div', { className: classes.WRAPPER });\n this.loader = this.createElement('div', { className: classes.LOADING });\n this.formEle = this.createElement('form', { className: classes.FORM });\n var ctrlGroupEle = this.createElement('div', { className: classes.CTRL_GROUP });\n var inputWrap = this.createElement('div', { className: classes.INPUT });\n target.appendChild(this.containerEle);\n this.loadSpinner();\n this.containerEle.appendChild(this.formEle);\n this.formEle.appendChild(ctrlGroupEle);\n if (this.isTemplate) {\n this.appendTemplate(inputWrap, this.template);\n }\n else {\n if (Array.prototype.indexOf.call(this.divComponents, this.type) > -1) {\n ele = this.createElement('div');\n this.setAttribute(ele, ['id']);\n }\n else {\n ele = this.createElement('input');\n this.setAttribute(ele, ['id', 'name']);\n }\n this.componentRoot = ele;\n inputWrap.appendChild(ele);\n inputWrap.appendChild(this.loader);\n }\n ctrlGroupEle.appendChild(inputWrap);\n ctrlGroupEle.appendChild(this.createElement('div', { className: classes.EDITABLE_ERROR }));\n this.appendButtons(this.formEle);\n if (!this.isTemplate) {\n this.renderComponent(ele);\n }\n this.removeSpinner();\n if (this.submitOnEnter) {\n this.wireEditorKeyDownEvent(this.containerEle);\n }\n return this.containerEle;\n };\n InPlaceEditor.prototype.appendButtons = function (trg) {\n if (this.showButtons && trg) {\n this.btnElements = this.renderButtons();\n trg.appendChild(this.btnElements);\n this.wireBtnEvents();\n }\n };\n InPlaceEditor.prototype.renderButtons = function () {\n var btnWrap = this.createElement('div', { className: classes.BUTTONS });\n var primary = (!isNOU(this.saveButton.content) && this.saveButton.content.length !== 0) ? (' ' + classes.PRIMARY) : '';\n this.submitBtn = this.createButtons({\n constant: 'save', type: 'submit', container: btnWrap,\n title: { save: 'Save' }, model: this.saveButton,\n className: classes.BTN_SAVE + primary\n });\n this.cancelBtn = this.createButtons({\n type: 'button', constant: 'cancel', title: { cancel: 'Cancel' },\n container: btnWrap, model: this.cancelButton,\n className: classes.BTN_CANCEL\n });\n return btnWrap;\n };\n InPlaceEditor.prototype.createButtons = function (args) {\n var btnObj = undefined;\n if (Object.keys(args.model).length > 0) {\n var btnEle = this.createElement('button', {\n className: args.className,\n attrs: { 'type': args.type, 'title': this.getLocale(args.title, args.constant) }\n });\n args.container.appendChild(btnEle);\n btnObj = new Button(args.model, btnEle);\n }\n return btnObj;\n };\n InPlaceEditor.prototype.renderComponent = function (ele) {\n this.isExtModule = (Array.prototype.indexOf.call(this.moduleList, this.type) > -1) ? true : false;\n extend(this.model, this.model, { cssClass: classes.ELEMENTS });\n if (!isNOU(this.value)) {\n this.updateModelValue();\n }\n if (this.isExtModule) {\n this.notify(events.render, { module: modulesList[this.type], target: ele, type: this.type });\n }\n else {\n if (isNOU(this.model.showClearButton)) {\n this.model.showClearButton = true;\n }\n switch (this.type) {\n case 'Date':\n this.componentObj = new DatePicker(this.model, ele);\n break;\n case 'DateTime':\n this.componentObj = new DateTimePicker(this.model, ele);\n break;\n case 'DropDownList':\n this.componentObj = new DropDownList(this.model, ele);\n break;\n case 'Mask':\n this.componentObj = new MaskedTextBox(this.model, ele);\n break;\n case 'Numeric':\n if (this.model.value) {\n this.model.value = this.model.value.toString().replace(/[`~!@#$%^&*()_|\\=?;:'\",<>\\{\\}\\[\\]\\\\\\/]/gi, '');\n }\n this.componentObj = new NumericTextBox(this.model, ele);\n break;\n case 'Text':\n this.componentObj = new TextBox(this.model, ele);\n break;\n }\n }\n };\n InPlaceEditor.prototype.updateAdaptor = function () {\n switch (this.adaptor) {\n case 'UrlAdaptor':\n this.dataAdaptor = new UrlAdaptor;\n break;\n case 'WebApiAdaptor':\n this.dataAdaptor = new WebApiAdaptor;\n break;\n case 'ODataV4Adaptor':\n this.dataAdaptor = new ODataV4Adaptor;\n break;\n }\n };\n InPlaceEditor.prototype.loadSpinner = function (callType) {\n addClass([this.loader], [classes.SHOW]);\n if (callType === 'validate' && (this.type === 'RTE' || this.type === 'Color' || this.type === 'Slider')) {\n addClass([this.loader], [classes.RTE_SPIN_WRAP]);\n addClass([this.getEditElement()], [classes.CTRL_OVERLAY]);\n this.spinObj = { target: this.loader };\n }\n else {\n this.spinObj = { target: this.loader, width: Browser.isDevice ? '16px' : '14px' };\n }\n if (this.formEle) {\n addClass([this.formEle], [classes.LOAD]);\n }\n if (this.btnElements) {\n addClass([this.btnElements], [classes.HIDE]);\n }\n setStyleAttribute(this.loader, { 'width': '100%' });\n createSpinner(this.spinObj);\n showSpinner(this.spinObj.target);\n };\n InPlaceEditor.prototype.removeSpinner = function (callType) {\n this.loader.removeAttribute('style');\n hideSpinner(this.spinObj.target);\n detach(this.spinObj.target.firstChild);\n if (callType === 'submit' && (this.type === 'RTE' || this.type === 'Color' || this.type === 'Slider')) {\n removeClass([this.loader], [classes.RTE_SPIN_WRAP]);\n removeClass([this.getEditElement()], [classes.CTRL_OVERLAY]);\n }\n if (this.formEle) {\n removeClass([this.formEle], [classes.LOAD]);\n }\n if (this.btnElements) {\n removeClass([this.btnElements], [classes.HIDE]);\n }\n removeClass([this.loader], [classes.SHOW]);\n };\n InPlaceEditor.prototype.getEditElement = function () {\n return select('.' + classes.ELEMENTS, this.formEle);\n };\n InPlaceEditor.prototype.getLocale = function (prop, val) {\n return new L10n('inplace-editor', prop, this.locale).getConstant(val);\n };\n InPlaceEditor.prototype.checkValue = function (val) {\n return (!this.isEmpty(val)) ? val : this.emptyText;\n };\n InPlaceEditor.prototype.extendModelValue = function (val) {\n var model = this.model;\n extend(model, { value: val });\n this.setProperties({ model: model }, true);\n };\n InPlaceEditor.prototype.updateValue = function () {\n if (!isNOU(this.value)) {\n this.setProperties({ value: getCompValue(this.type, this.value) }, true);\n this.extendModelValue(getCompValue(this.type, this.value));\n }\n };\n InPlaceEditor.prototype.updateModelValue = function () {\n if (this.type === 'MultiSelect' && !this.isEmpty(this.value)) {\n this.model.value = this.value.slice();\n }\n else {\n this.model.value = this.value;\n }\n };\n InPlaceEditor.prototype.setValue = function () {\n if (this.isExtModule) {\n this.notify(events.update, { type: this.type });\n }\n else if (this.componentObj) {\n this.setProperties({ value: this.componentObj.value }, true);\n this.extendModelValue(this.componentObj.value);\n }\n };\n InPlaceEditor.prototype.getDropDownsValue = function () {\n var value;\n if (Array.prototype.indexOf.call(this.dropDownEle, this.type) > -1 && this.type !== 'MultiSelect') {\n value = select('.e-' + this.type.toLocaleLowerCase(), this.containerEle).value;\n }\n else if (this.type === 'MultiSelect') {\n this.notify(events.accessValue, { type: this.type });\n value = this.printValue;\n }\n return value;\n };\n InPlaceEditor.prototype.getSendValue = function () {\n if (this.isEmpty(this.value)) {\n return '';\n }\n if (Array.prototype.indexOf.call(this.dropDownEle, this.type) > -1) {\n return this.getDropDownsValue();\n }\n else if (Array.prototype.indexOf.call(this.dateType, this.type) > -1) {\n return this.value.toISOString();\n }\n else if (this.type === 'DateRange') {\n return this.value[0].toISOString() + ' - ' + this.value[1].toISOString();\n }\n else {\n return this.value.toString();\n }\n };\n InPlaceEditor.prototype.getRenderValue = function () {\n if (this.type === 'Mask' && this.componentObj.value.length !== 0) {\n return this.componentObj.getMaskedValue();\n }\n else if (Array.prototype.indexOf.call(this.inputDataEle, this.type) > -1) {\n return this.componentRoot.value;\n }\n else if (Array.prototype.indexOf.call(this.dropDownEle, this.type) > -1) {\n return this.getDropDownsValue();\n }\n else {\n return parseValue(this.type, this.value);\n }\n };\n InPlaceEditor.prototype.setRtl = function (value) {\n value ? addClass([this.element], [classes.RTL]) : removeClass([this.element], [classes.RTL]);\n };\n InPlaceEditor.prototype.setFocus = function () {\n if (this.isTemplate) {\n return;\n }\n this.isExtModule ? this.notify(events.setFocus, {}) : this.componentObj.element.focus();\n };\n InPlaceEditor.prototype.removeEditor = function () {\n var tipEle;\n if (this.tipObj && this.formEle) {\n tipEle = closest(this.formEle, '.' + classes.ROOT_TIP);\n tipEle.classList.add(classes.HIDE);\n }\n this.unWireDocEvent();\n this.destroyComponents();\n this.formEle = undefined;\n if (!isNOU(select('.' + classes.INLINE, this.element))) {\n detach(this.inlineWrapper);\n this.inlineWrapper = undefined;\n }\n else if (this.tipObj) {\n if (this.type === 'MultiSelect') {\n EventHandler.remove(this.containerEle, 'mousedown', this.popMouseDown);\n EventHandler.remove(this.containerEle, 'click', this.popClickHandler);\n }\n this.tipObj.close();\n this.tipObj.destroy();\n this.tipObj = undefined;\n }\n this.containerEle = undefined;\n removeClass([this.valueWrap], [classes.OPEN, classes.HIDE]);\n this.setProperties({ enableEditMode: false }, true);\n };\n InPlaceEditor.prototype.destroyComponents = function () {\n if (this.showButtons) {\n this.destroyButtons();\n }\n if (this.isExtModule) {\n this.notify(events.destroyModules, {});\n }\n else {\n if (this.templateEle) {\n document.body.appendChild(this.templateEle);\n this.templateEle.style.display = 'none';\n this.templateEle = undefined;\n }\n if (!isNOU(this.componentObj)) {\n this.componentObj.destroy();\n this.componentObj = undefined;\n }\n }\n if (this.formValidate) {\n this.formValidate = undefined;\n }\n if (this.submitOnEnter && this.containerEle) {\n this.unWireEditorKeyDownEvent(this.containerEle);\n }\n };\n InPlaceEditor.prototype.destroyButtons = function () {\n if (!isNOU(this.submitBtn)) {\n EventHandler.remove(this.submitBtn.element, 'mousedown', this.submitHandler);\n EventHandler.remove(this.submitBtn.element, 'click', this.submitPrevent);\n EventHandler.remove(this.submitBtn.element, 'keydown', this.btnKeyDownHandler);\n this.submitBtn.destroy();\n this.submitBtn = undefined;\n }\n if (!isNOU(this.cancelBtn)) {\n EventHandler.remove(this.cancelBtn.element, 'mousedown', this.cancelHandler);\n EventHandler.remove(this.cancelBtn.element, 'keydown', this.btnKeyDownHandler);\n this.cancelBtn.destroy();\n this.cancelBtn = undefined;\n }\n this.btnElements = undefined;\n };\n InPlaceEditor.prototype.getQuery = function (params) {\n var query = new Query();\n Object.keys(params).forEach(function (key) {\n query.addParams(key, params[key]);\n });\n return query;\n };\n InPlaceEditor.prototype.sendValue = function () {\n var _this = this;\n var eventArgs = { data: { name: this.name, primaryKey: this.primaryKey, value: this.getSendValue() } };\n this.trigger('actionBegin', eventArgs);\n if (!this.isEmpty(this.url) && !this.isEmpty(this.primaryKey)) {\n this.dataManager = new DataManager({ url: this.url, adaptor: this.dataAdaptor });\n if (this.adaptor === 'UrlAdaptor') {\n this.dataManager.executeQuery(this.getQuery(eventArgs.data), this.successHandler.bind(this), this.failureHandler.bind(this));\n }\n else {\n var crud = this.dataManager.insert(eventArgs.data);\n crud.then(function (e) { return _this.successHandler(e); }).catch(function (e) { return _this.failureHandler(e); });\n }\n }\n else {\n var eventArg = { data: {}, value: eventArgs.data.value };\n this.triggerSuccess(eventArg);\n }\n this.dataManager = undefined;\n };\n InPlaceEditor.prototype.isEmpty = function (value) {\n return (!isNOU(value) && value.length !== 0) ? false : true;\n };\n InPlaceEditor.prototype.checkIsTemplate = function () {\n this.isTemplate = (!isNOU(this.template) && this.template !== '') ? true : false;\n };\n InPlaceEditor.prototype.templateCompile = function (trgEle, tempStr) {\n var tempEle;\n if (typeof tempStr === 'string') {\n tempStr = tempStr.trim();\n }\n var compiler = compile(tempStr);\n if (!isNOU(compiler)) {\n tempEle = compiler({}, this, 'template');\n }\n if (!isNOU(compiler) && tempEle.length > 0) {\n [].slice.call(tempEle).forEach(function (el) {\n trgEle.appendChild(el);\n });\n }\n };\n InPlaceEditor.prototype.appendTemplate = function (trgEle, tempStr) {\n if (typeof tempStr === 'string' || isNOU(tempStr.innerHTML)) {\n if (tempStr[0] === '.' || tempStr[0] === '#') {\n if (document.querySelectorAll(tempStr).length) {\n this.templateEle = document.querySelector(tempStr);\n trgEle.appendChild(this.templateEle);\n this.templateEle.style.display = '';\n }\n else {\n this.templateCompile(trgEle, tempStr);\n }\n }\n else {\n this.templateCompile(trgEle, tempStr);\n }\n }\n else {\n this.templateEle = tempStr;\n trgEle.appendChild(this.templateEle);\n }\n };\n InPlaceEditor.prototype.disable = function (value) {\n value ? addClass([this.element], [classes.DISABLE]) : removeClass([this.element], [classes.DISABLE]);\n };\n InPlaceEditor.prototype.enableEditor = function (val) {\n (val) ? this.renderEditor() : this.cancelHandler();\n };\n InPlaceEditor.prototype.checkValidation = function () {\n var _this = this;\n var args;\n if (this.validationRules) {\n this.formValidate = new FormValidator(this.formEle, {\n rules: this.validationRules,\n validationComplete: function (e) {\n args = {\n errorMessage: e.message,\n data: { name: _this.name, primaryKey: _this.primaryKey, value: _this.checkValue(_this.getSendValue()) }\n };\n _this.trigger('validating', args);\n if (e.status === 'failure') {\n e.errorElement.innerText = args.errorMessage;\n _this.toggleErrorClass(true);\n }\n else {\n _this.toggleErrorClass(false);\n }\n },\n customPlacement: function (inputElement, errorElement) {\n select('.' + classes.EDITABLE_ERROR, _this.formEle).appendChild(errorElement);\n }\n });\n this.formValidate.validate();\n }\n else {\n args = {\n errorMessage: '',\n data: { name: this.name, primaryKey: this.primaryKey, value: this.checkValue(this.getSendValue()) }\n };\n this.trigger('validating', args);\n if (args.errorMessage) {\n select('.' + classes.EDITABLE_ERROR, this.formEle).innerHTML = args.errorMessage;\n this.toggleErrorClass(true);\n }\n else {\n this.toggleErrorClass(false);\n }\n }\n };\n InPlaceEditor.prototype.toggleErrorClass = function (value) {\n if (isNOU(this.formEle)) {\n return;\n }\n var inputEle = select('.e-input-group', this.formEle);\n var errorClass = function (element, val, action) {\n [].slice.call(element).forEach(function (ele) {\n if (ele) {\n action === 'add' ? addClass([ele], [val]) : removeClass([ele], [val]);\n }\n });\n };\n errorClass([this.formEle, inputEle], classes.ERROR, value ? 'add' : 'remove');\n };\n InPlaceEditor.prototype.updateArrow = function () {\n var pos = this.tipObj.tipPointerPosition;\n this.tipObj.tipPointerPosition = (pos === 'Middle') ? 'Auto' : 'Middle';\n this.tipObj.tipPointerPosition = pos;\n this.tipObj.dataBind();\n };\n InPlaceEditor.prototype.triggerSuccess = function (args) {\n var val = args.value;\n this.trigger('actionSuccess', args);\n this.removeSpinner('submit');\n this.renderValue(this.checkValue((args.value !== val) ? args.value : this.getRenderValue()));\n this.removeEditor();\n };\n InPlaceEditor.prototype.wireEvents = function () {\n this.wireEditEvent(this.editableOn);\n EventHandler.add(this.editIcon, 'click', this.clickHandler, this);\n EventHandler.add(this.element, 'keydown', this.valueKeyDownHandler, this);\n EventHandler.add(document, 'scroll', this.scrollResizeHandler, this);\n window.addEventListener('resize', this.scrollResizeHandler.bind(this));\n if (Array.prototype.indexOf.call(this.clearComponents, this.type) > -1) {\n EventHandler.add(this.element, 'mousedown', this.mouseDownHandler, this);\n }\n };\n InPlaceEditor.prototype.wireDocEvent = function () {\n EventHandler.add(document, 'mousedown', this.docClickHandler, this);\n };\n InPlaceEditor.prototype.wireEditEvent = function (event) {\n if (event === 'EditIconClick') {\n return;\n }\n var titleConstant = (event === 'Click') ? 'editAreaClick' : 'editAreaDoubleClick';\n this.element.setAttribute('title', this.getLocale(localeConstant[event], titleConstant));\n if (Browser.isDevice && Browser.isIos && event === 'DblClick') {\n this.touchModule = new Touch(this.valueWrap, { tap: this.doubleTapHandler.bind(this) });\n }\n else {\n EventHandler.add(this.valueWrap, event.toLowerCase(), this.clickHandler, this);\n }\n };\n InPlaceEditor.prototype.wireEditorKeyDownEvent = function (ele) {\n EventHandler.add(ele, 'keydown', this.enterKeyDownHandler, this);\n };\n InPlaceEditor.prototype.wireBtnEvents = function () {\n if (!isNOU(this.submitBtn)) {\n EventHandler.add(this.submitBtn.element, 'mousedown', this.submitHandler, this);\n EventHandler.add(this.submitBtn.element, 'click', this.submitPrevent, this);\n EventHandler.add(this.submitBtn.element, 'keydown', this.btnKeyDownHandler, this);\n }\n if (!isNOU(this.cancelBtn)) {\n EventHandler.add(this.cancelBtn.element, 'mousedown', this.cancelHandler, this);\n EventHandler.add(this.cancelBtn.element, 'keydown', this.btnKeyDownHandler, this);\n }\n };\n InPlaceEditor.prototype.unWireEvents = function () {\n this.unWireEditEvent(this.editableOn);\n EventHandler.remove(this.editIcon, 'click', this.clickHandler);\n EventHandler.remove(document, 'scroll', this.scrollResizeHandler);\n window.removeEventListener('resize', this.scrollResizeHandler.bind(this));\n EventHandler.remove(this.element, 'keydown', this.valueKeyDownHandler);\n if (Array.prototype.indexOf.call(this.clearComponents, this.type) > -1) {\n EventHandler.remove(this.element, 'mousedown', this.mouseDownHandler);\n }\n };\n InPlaceEditor.prototype.unWireDocEvent = function () {\n EventHandler.remove(document, 'mousedown', this.docClickHandler);\n };\n InPlaceEditor.prototype.unWireEditEvent = function (event) {\n if (event === 'EditIconClick') {\n return;\n }\n this.element.removeAttribute('title');\n if (Browser.isDevice && Browser.isIos && event === 'DblClick') {\n this.touchModule.destroy();\n this.touchModule = undefined;\n }\n else {\n EventHandler.remove(this.valueWrap, event.toLowerCase(), this.clickHandler);\n }\n };\n InPlaceEditor.prototype.unWireEditorKeyDownEvent = function (ele) {\n EventHandler.remove(ele, 'keydown', this.enterKeyDownHandler);\n };\n InPlaceEditor.prototype.submitPrevent = function (e) {\n e.preventDefault();\n };\n InPlaceEditor.prototype.btnKeyDownHandler = function (e) {\n var trg = e.target;\n if ((e.keyCode === 13 && e.which === 13) || (e.keyCode === 32 && e.which === 32)) {\n if (trg.classList.contains(classes.BTN_SAVE)) {\n this.save();\n }\n else if (trg.classList.contains(classes.BTN_CANCEL)) {\n this.cancelHandler();\n }\n }\n };\n InPlaceEditor.prototype.afterOpenHandler = function (e) {\n if (this.mode === 'Popup' && this.type === 'MultiSelect') {\n EventHandler.add(this.containerEle, 'mousedown', this.popMouseDown, this);\n EventHandler.add(this.containerEle, 'click', this.popClickHandler, this);\n }\n if (this.mode === 'Popup' && !this.isEmpty(this.titleEle.innerHTML)) {\n e.element.classList.add(classes.TIP_TITLE);\n }\n if (this.type === 'RTE') {\n this.rteModule.refresh();\n this.setAttribute(select('.e-richtexteditor textarea', this.containerEle), ['name']);\n }\n else if (this.type === 'Slider') {\n this.sliderModule.refresh();\n this.setAttribute(select('.e-slider-input', this.containerEle), ['name']);\n }\n this.setFocus();\n if (this.afterOpenEvent) {\n this.tipObj.setProperties({ afterOpen: this.afterOpenEvent }, true);\n this.tipObj.trigger('afterOpen', e);\n }\n };\n InPlaceEditor.prototype.popMouseDown = function (e) {\n var trgClass = e.target.classList;\n if (trgClass.contains('e-chips-close') && !trgClass.contains('e-close-hooker')) {\n this.updateArrow();\n }\n };\n InPlaceEditor.prototype.doubleTapHandler = function (e) {\n if (e.tapCount > 1) {\n this.clickHandler(e.originalEvent);\n }\n };\n InPlaceEditor.prototype.clickHandler = function (e) {\n if (this.editableOn !== 'EditIconClick') {\n e.stopPropagation();\n }\n this.renderEditor();\n };\n InPlaceEditor.prototype.submitHandler = function (e) {\n e.preventDefault();\n this.save();\n };\n InPlaceEditor.prototype.cancelHandler = function () {\n this.removeEditor();\n };\n InPlaceEditor.prototype.popClickHandler = function (e) {\n var tipTarget = select('.' + classes.VALUE_WRAPPER, this.element);\n if (e.target.classList.contains('e-chips-close')) {\n this.tipObj.refresh(tipTarget);\n }\n };\n InPlaceEditor.prototype.successHandler = function (e) {\n var eventArgs = { data: e, value: this.getSendValue() };\n this.triggerSuccess(eventArgs);\n };\n InPlaceEditor.prototype.failureHandler = function (e) {\n var eventArgs = { data: e, value: this.getSendValue() };\n this.trigger('actionFailure', eventArgs);\n this.removeSpinner('submit');\n if (this.mode === 'Popup') {\n this.updateArrow();\n }\n };\n InPlaceEditor.prototype.enterKeyDownHandler = function (e) {\n if (!closest(e.target, '.' + classes.INPUT + ' .e-richtexteditor')) {\n if ((e.keyCode === 13 && e.which === 13) && closest(e.target, '.' + classes.INPUT)) {\n this.save();\n }\n else if (e.keyCode === 27 && e.which === 27) {\n this.cancelHandler();\n }\n }\n };\n InPlaceEditor.prototype.valueKeyDownHandler = function (e) {\n if ((e.keyCode === 13 && e.which === 13) && e.target.classList.contains(classes.ROOT) &&\n !this.valueWrap.classList.contains(classes.OPEN) && !this.element.classList.contains(classes.DISABLE)) {\n e.preventDefault();\n this.renderEditor();\n }\n };\n InPlaceEditor.prototype.mouseDownHandler = function (e) {\n if (e.target.classList.contains('e-clear-icon')) {\n this.isClearTarget = true;\n }\n };\n InPlaceEditor.prototype.scrollResizeHandler = function () {\n if (this.mode === 'Popup' && this.tipObj && !(Browser.isDevice)) {\n this.removeEditor();\n }\n };\n InPlaceEditor.prototype.docClickHandler = function (e) {\n var trg = e.target;\n if (this.isClearTarget) {\n this.isClearTarget = false;\n return;\n }\n var relateRoot = closest(trg, '.' + classes.ROOT);\n var relateTipRoot = closest(trg, '.' + classes.ROOT_TIP);\n var relateElements = closest(trg, '.' + classes.ELEMENTS);\n var relateRTEElements = closest(trg, '.e-rte-elements');\n if ((!isNOU(relateRoot) && relateRoot.isEqualNode(this.element)) ||\n (!isNOU(relateTipRoot) && this.tipObj && (relateTipRoot.id.indexOf(this.valueWrap.id) > -1)) ||\n !isNOU(relateElements) || !isNOU(relateRTEElements) || trg.classList.contains('e-chips-close')) {\n return;\n }\n else {\n if (this.actionOnBlur === 'Submit') {\n this.save();\n }\n else if (this.actionOnBlur === 'Cancel') {\n this.cancelHandler();\n }\n }\n };\n /**\n * Validate current editor value.\n * @returns void\n */\n InPlaceEditor.prototype.validate = function () {\n this.checkValidation();\n };\n /**\n * Submit the edited input value to the server.\n * @returns void\n */\n InPlaceEditor.prototype.save = function () {\n if (!this.formEle) {\n return;\n }\n this.element.focus();\n this.editEle = select('.' + classes.INPUT, this.formEle);\n var errEle = null;\n errEle = select('.' + classes.ERROR, this.editEle);\n var type = this.type;\n var calendarComp = type === 'Date' || type === 'DateTime' || type === 'DateRange' || type === 'Time';\n if ((errEle && !isNOU(this.validationRules)) || (errEle && calendarComp)) {\n return;\n }\n if (!this.isTemplate) {\n this.setValue();\n }\n this.checkValidation();\n if (!this.formEle.classList.contains(classes.ERROR)) {\n this.loadSpinner('validate');\n if (this.mode === 'Popup') {\n this.updateArrow();\n }\n this.sendValue();\n }\n };\n /**\n * Removes the control from the DOM and also removes all its related events.\n * @returns void\n */\n InPlaceEditor.prototype.destroy = function () {\n var _this = this;\n this.removeEditor();\n if (this.isExtModule) {\n this.notify(events.destroy, {});\n }\n this.unWireEvents();\n var classList = [classes.DISABLE, classes.RTL];\n classList.forEach(function (val) {\n removeClass([_this.element], [val]);\n });\n while (this.element.firstChild) {\n this.element.removeChild(this.element.firstChild);\n }\n _super.prototype.destroy.call(this);\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @returns string\n */\n InPlaceEditor.prototype.getPersistData = function () {\n return this.addOnPersist(['value']);\n };\n /**\n * To provide the array of modules needed for component rendering\n * @return {ModuleDeclaration[]}\n * @hidden\n */\n InPlaceEditor.prototype.requiredModules = function () {\n var modules = [];\n modules.push({ member: modulesList[this.type], args: [this] });\n return modules;\n };\n /**\n * Returns the current module name.\n * @returns string\n * @private\n */\n InPlaceEditor.prototype.getModuleName = function () {\n return 'inplaceeditor';\n };\n /**\n * Gets called when the model property changes.The data that describes the old and new values of property that changed.\n * @param {InPlaceEditorModel} newProp\n * @param {InPlaceEditorModel} oldProp\n * @returns void\n * @private\n */\n InPlaceEditor.prototype.onPropertyChanged = function (newProp, oldProp) {\n this.removeEditor();\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'showButtons':\n (newProp.showButtons) ? this.appendButtons(this.formEle) : this.destroyButtons();\n break;\n case 'value':\n this.updateValue();\n this.renderValue(this.checkValue(parseValue(this.type, this.value)));\n break;\n case 'emptyText':\n this.renderValue(this.checkValue(parseValue(this.type, this.value)));\n break;\n case 'template':\n this.checkIsTemplate();\n break;\n case 'disabled':\n this.disable(newProp.disabled);\n break;\n case 'enableRtl':\n this.setRtl(newProp.enableRtl);\n break;\n case 'cssClass':\n this.setClass('remove', oldProp.cssClass);\n this.setClass('add', newProp.cssClass);\n break;\n case 'mode':\n this.enableEditor(this.enableEditMode);\n break;\n case 'enableEditMode':\n this.enableEditor(newProp.enableEditMode);\n break;\n case 'editableOn':\n this.unWireEditEvent(oldProp.editableOn);\n if (newProp.editableOn !== 'EditIconClick') {\n this.wireEditEvent(newProp.editableOn);\n }\n break;\n }\n }\n };\n __decorate([\n Property('')\n ], InPlaceEditor.prototype, \"name\", void 0);\n __decorate([\n Property(null)\n ], InPlaceEditor.prototype, \"value\", void 0);\n __decorate([\n Property('')\n ], InPlaceEditor.prototype, \"template\", void 0);\n __decorate([\n Property('')\n ], InPlaceEditor.prototype, \"cssClass\", void 0);\n __decorate([\n Property('')\n ], InPlaceEditor.prototype, \"primaryKey\", void 0);\n __decorate([\n Property('Empty')\n ], InPlaceEditor.prototype, \"emptyText\", void 0);\n __decorate([\n Property('')\n ], InPlaceEditor.prototype, \"url\", void 0);\n __decorate([\n Property('Popup')\n ], InPlaceEditor.prototype, \"mode\", void 0);\n __decorate([\n Property('UrlAdaptor')\n ], InPlaceEditor.prototype, \"adaptor\", void 0);\n __decorate([\n Property('Text')\n ], InPlaceEditor.prototype, \"type\", void 0);\n __decorate([\n Property('Click')\n ], InPlaceEditor.prototype, \"editableOn\", void 0);\n __decorate([\n Property('Submit')\n ], InPlaceEditor.prototype, \"actionOnBlur\", void 0);\n __decorate([\n Property(false)\n ], InPlaceEditor.prototype, \"enableRtl\", void 0);\n __decorate([\n Property(false)\n ], InPlaceEditor.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property(false)\n ], InPlaceEditor.prototype, \"disabled\", void 0);\n __decorate([\n Property(true)\n ], InPlaceEditor.prototype, \"showButtons\", void 0);\n __decorate([\n Property(false)\n ], InPlaceEditor.prototype, \"enableEditMode\", void 0);\n __decorate([\n Property(true)\n ], InPlaceEditor.prototype, \"submitOnEnter\", void 0);\n __decorate([\n Complex({}, PopupSettings)\n ], InPlaceEditor.prototype, \"popupSettings\", void 0);\n __decorate([\n Property(null)\n ], InPlaceEditor.prototype, \"model\", void 0);\n __decorate([\n Property({ iconCss: 'e-icons e-save-icon' })\n ], InPlaceEditor.prototype, \"saveButton\", void 0);\n __decorate([\n Property({ iconCss: 'e-icons e-cancel-icon' })\n ], InPlaceEditor.prototype, \"cancelButton\", void 0);\n __decorate([\n Property(null)\n ], InPlaceEditor.prototype, \"validationRules\", void 0);\n __decorate([\n Event()\n ], InPlaceEditor.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], InPlaceEditor.prototype, \"actionBegin\", void 0);\n __decorate([\n Event()\n ], InPlaceEditor.prototype, \"actionSuccess\", void 0);\n __decorate([\n Event()\n ], InPlaceEditor.prototype, \"actionFailure\", void 0);\n __decorate([\n Event()\n ], InPlaceEditor.prototype, \"validating\", void 0);\n __decorate([\n Event()\n ], InPlaceEditor.prototype, \"destroyed\", void 0);\n InPlaceEditor = __decorate([\n NotifyPropertyChanges\n ], InPlaceEditor);\n return InPlaceEditor;\n}(Component));\nexport { InPlaceEditor };\n","import { isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';\nimport * as events from '../base/events';\n/**\n * The `Base` module.\n */\nvar Base = /** @class */ (function () {\n function Base(parent, module) {\n this.parent = parent;\n this.module = module;\n this.addEventListener();\n }\n Base.prototype.render = function (e) {\n this.module.render(e);\n };\n Base.prototype.focus = function () {\n this.module.focus();\n };\n Base.prototype.update = function (e) {\n this.module.updateValue(e);\n };\n Base.prototype.getValue = function () {\n this.module.getRenderValue();\n };\n Base.prototype.destroyComponent = function () {\n if (isNOU(this.module.compObj)) {\n return;\n }\n this.module.compObj.destroy();\n this.module.compObj = undefined;\n };\n Base.prototype.destroy = function () {\n this.destroyComponent();\n this.removeEventListener();\n };\n Base.prototype.addEventListener = function () {\n this.parent.on(events.render, this.render, this);\n this.parent.on(events.setFocus, this.focus, this);\n this.parent.on(events.update, this.update, this);\n this.parent.on(events.accessValue, this.getValue, this);\n this.parent.on(events.destroyModules, this.destroyComponent, this);\n this.parent.on(events.destroy, this.destroy, this);\n };\n Base.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.render, this.render);\n this.parent.off(events.setFocus, this.focus);\n this.parent.off(events.update, this.update);\n this.parent.off(events.accessValue, this.getValue);\n this.parent.off(events.destroyModules, this.destroyComponent);\n this.parent.off(events.destroy, this.destroy);\n };\n return Base;\n}());\nexport { Base };\n","import { AutoComplete as EJ2AutoComplete } from '@syncfusion/ej2-dropdowns';\nimport { Base } from './base-module';\n/**\n * The `AutoComplete` module is used configure the properties of Auto complete type editor.\n */\nvar AutoComplete = /** @class */ (function () {\n function AutoComplete(parent) {\n this.compObj = undefined;\n this.parent = parent;\n this.parent.atcModule = this;\n this.base = new Base(this.parent, this);\n }\n AutoComplete.prototype.render = function (e) {\n this.compObj = new EJ2AutoComplete(this.parent.model, e.target);\n };\n AutoComplete.prototype.focus = function () {\n this.compObj.element.focus();\n };\n AutoComplete.prototype.updateValue = function (e) {\n if (this.compObj && e.type === 'AutoComplete') {\n this.parent.setProperties({ value: this.compObj.value }, true);\n this.parent.extendModelValue(this.compObj.value);\n }\n };\n /**\n * Destroys the module.\n * @method destroy\n * @return {void}\n */\n AutoComplete.prototype.destroy = function () {\n this.base.destroy();\n };\n /**\n * For internal use only - Get the module name.\n */\n AutoComplete.prototype.getModuleName = function () {\n return 'auto-complete';\n };\n return AutoComplete;\n}());\nexport { AutoComplete };\n","import { ColorPicker as EJ2ColorPicker } from '@syncfusion/ej2-inputs';\nimport { Base } from './base-module';\n/**\n * The `ColorPicker` module is used configure the properties of Color picker type editor.\n */\nvar ColorPicker = /** @class */ (function () {\n function ColorPicker(parent) {\n this.compObj = undefined;\n this.parent = parent;\n this.parent.colorModule = this;\n this.base = new Base(this.parent, this);\n }\n ColorPicker.prototype.render = function (e) {\n this.compObj = new EJ2ColorPicker(this.parent.model, e.target);\n };\n ColorPicker.prototype.focus = function () {\n this.compObj.element.focus();\n };\n ColorPicker.prototype.updateValue = function (e) {\n if (this.compObj && e.type === 'Color') {\n this.parent.setProperties({ value: this.compObj.value }, true);\n this.parent.extendModelValue(this.compObj.value);\n }\n };\n /**\n * Destroys the module.\n * @method destroy\n * @return {void}\n */\n ColorPicker.prototype.destroy = function () {\n this.base.destroy();\n };\n /**\n * For internal use only - Get the module name.\n */\n ColorPicker.prototype.getModuleName = function () {\n return 'color-picker';\n };\n return ColorPicker;\n}());\nexport { ColorPicker };\n","import { ComboBox as EJ2ComboBox } from '@syncfusion/ej2-dropdowns';\nimport { Base } from './base-module';\n/**\n * The `ComboBox` module is used configure the properties of Combo box type editor.\n */\nvar ComboBox = /** @class */ (function () {\n function ComboBox(parent) {\n this.compObj = undefined;\n this.parent = parent;\n this.parent.comboBoxModule = this;\n this.base = new Base(this.parent, this);\n }\n ComboBox.prototype.render = function (e) {\n this.compObj = new EJ2ComboBox(this.parent.model, e.target);\n };\n ComboBox.prototype.focus = function () {\n this.compObj.element.focus();\n };\n ComboBox.prototype.updateValue = function (e) {\n if (this.compObj && e.type === 'ComboBox') {\n this.parent.setProperties({ value: this.compObj.value }, true);\n this.parent.extendModelValue(this.compObj.value);\n }\n };\n /**\n * Destroys the module.\n * @method destroy\n * @return {void}\n */\n ComboBox.prototype.destroy = function () {\n this.base.destroy();\n };\n /**\n * For internal use only - Get the module name.\n */\n ComboBox.prototype.getModuleName = function () {\n return 'combo-box';\n };\n return ComboBox;\n}());\nexport { ComboBox };\n","import { DateRangePicker as EJ2DateRangePicker } from '@syncfusion/ej2-calendars';\nimport { Base } from './base-module';\n/**\n * The `DateRangePicker` module is used configure the properties of Date range picker type editor.\n */\nvar DateRangePicker = /** @class */ (function () {\n function DateRangePicker(parent) {\n this.compObj = undefined;\n this.parent = parent;\n this.parent.dateRangeModule = this;\n this.base = new Base(this.parent, this);\n }\n DateRangePicker.prototype.render = function (e) {\n this.compObj = new EJ2DateRangePicker(this.parent.model);\n this.compObj.appendTo(e.target);\n };\n DateRangePicker.prototype.focus = function () {\n this.compObj.element.focus();\n };\n DateRangePicker.prototype.updateValue = function (e) {\n if (this.compObj && e.type === 'DateRange') {\n this.parent.setProperties({ value: this.compObj.value }, true);\n this.parent.extendModelValue(this.compObj.value);\n }\n };\n /**\n * Destroys the module.\n * @method destroy\n * @return {void}\n */\n DateRangePicker.prototype.destroy = function () {\n this.base.destroy();\n };\n /**\n * For internal use only - Get the module name.\n */\n DateRangePicker.prototype.getModuleName = function () {\n return 'date-range-picker';\n };\n return DateRangePicker;\n}());\nexport { DateRangePicker };\n","import { closest } from '@syncfusion/ej2-base';\nimport { MultiSelect as EJ2MultiSelect } from '@syncfusion/ej2-dropdowns';\nimport { Base } from './base-module';\n/**\n * The `MultiSelect` module is used configure the properties of Multi select type editor.\n */\nvar MultiSelect = /** @class */ (function () {\n function MultiSelect(parent) {\n this.compObj = undefined;\n this.parent = parent;\n this.parent.multiSelectModule = this;\n this.base = new Base(this.parent, this);\n }\n MultiSelect.prototype.render = function (e) {\n this.compObj = new EJ2MultiSelect(this.parent.model, e.target);\n };\n MultiSelect.prototype.focus = function () {\n closest(this.compObj.element, '.e-multi-select-wrapper').dispatchEvent(new MouseEvent('mousedown'));\n };\n MultiSelect.prototype.updateValue = function (e) {\n if (this.compObj && e.type === 'MultiSelect') {\n this.parent.setProperties({ value: this.compObj.value }, true);\n this.parent.extendModelValue(this.compObj.value);\n }\n };\n MultiSelect.prototype.getRenderValue = function () {\n this.parent.printValue = this.compObj.text;\n };\n /**\n * Destroys the module.\n * @method destroy\n * @return {void}\n */\n MultiSelect.prototype.destroy = function () {\n this.base.destroy();\n };\n /**\n * For internal use only - Get the module name.\n */\n MultiSelect.prototype.getModuleName = function () {\n return 'multi-select';\n };\n return MultiSelect;\n}());\nexport { MultiSelect };\n","import { RichTextEditor, HtmlEditor } from '@syncfusion/ej2-richtexteditor';\nimport { MarkdownEditor, Toolbar, Link, Image, QuickToolbar, Table } from '@syncfusion/ej2-richtexteditor';\nimport { Base } from './base-module';\nRichTextEditor.Inject(HtmlEditor, MarkdownEditor, Toolbar, Link, Image, QuickToolbar, Table);\n/**\n * The `RTE` module is used configure the properties of RTE type editor.\n */\nvar Rte = /** @class */ (function () {\n function Rte(parent) {\n this.compObj = undefined;\n this.parent = parent;\n this.parent.rteModule = this;\n this.base = new Base(this.parent, this);\n }\n Rte.prototype.render = function (e) {\n this.compObj = new RichTextEditor(this.parent.model, e.target);\n };\n Rte.prototype.focus = function () {\n this.compObj.element.focus();\n };\n Rte.prototype.updateValue = function (e) {\n if (this.compObj && e.type === 'RTE') {\n var rteValue = this.compObj.contentModule.getEditPanel().innerHTML === '
' +\n '
' +\n '' + '' +\n '
';\n var contentElem = parseHtml(content);\n linkWrap.appendChild(contentElem);\n var linkTarget = linkWrap.querySelector('.e-rte-linkTarget');\n var inputLink = linkWrap.querySelector('.e-img-link');\n var linkOpenLabel = this.i10n.getConstant('linkOpenInNewWindow');\n this.checkBoxObj = new CheckBox({\n label: linkOpenLabel, checked: true, enableRtl: this.parent.enableRtl, change: function (e) {\n if (e.checked) {\n target_1 = '_blank';\n }\n else {\n target_1 = null;\n }\n }\n });\n this.checkBoxObj.createElement = this.parent.createElement;\n this.checkBoxObj.appendTo(linkTarget);\n var target_1 = this.checkBoxObj.checked ? '_blank' : null;\n var linkUpdate = this.i10n.getConstant('dialogUpdate');\n var linkargs_1 = {\n args: e.args,\n selfImage: this, selection: e.selection,\n selectNode: e.selectNode, selectParent: e.selectParent, link: inputLink, target: target_1\n };\n this.dialogObj.setProperties({\n height: 'inherit',\n width: '290px',\n header: this.parent.localeObj.getConstant('imageInsertLinkHeader'),\n content: linkWrap,\n position: { X: 'center', Y: 'center' },\n buttons: [{\n click: function (e) { _this.insertlink(linkargs_1); },\n buttonModel: {\n content: linkUpdate, cssClass: 'e-flat e-update-link', isPrimary: true\n }\n }]\n });\n if (!isNullOrUndefined(inputDetails)) {\n inputLink.value = inputDetails.url;\n (inputDetails.target) ? this.checkBoxObj.checked = true : this.checkBoxObj.checked = false;\n this.dialogObj.header = inputDetails.header;\n }\n this.dialogObj.element.style.maxHeight = 'inherit';\n this.dialogObj.content.querySelector('input').focus();\n }\n };\n Image.prototype.insertAltText = function (e) {\n var _this = this;\n if (e.selectNode[0].nodeName !== 'IMG') {\n return;\n }\n this.imagDialog(e);\n var altText = this.i10n.getConstant('altText');\n if (!isNullOrUndefined(this.dialogObj)) {\n var altWrap = this.parent.createElement('div', { className: 'e-img-altwrap' });\n var altHeader = this.i10n.getConstant('alternateHeader');\n var linkUpdate = this.i10n.getConstant('dialogUpdate');\n var getAlt = (e.selectNode[0].getAttribute('alt') === null) ? '' :\n e.selectNode[0].getAttribute('alt');\n var content = '' +\n '' +\n '
';\n var contentElem = parseHtml(content);\n altWrap.appendChild(contentElem);\n var inputAlt = altWrap.querySelector('.e-img-alt');\n var altArgs_1 = {\n args: e.args, selfImage: this, selection: e.selection, selectNode: e.selectNode,\n alt: inputAlt\n };\n this.dialogObj.setProperties({\n height: 'inherit', width: '290px', header: altHeader, content: altWrap, position: { X: 'center', Y: 'center' },\n buttons: [{\n click: function (e) { _this.insertAlt(altArgs_1); },\n buttonModel: {\n content: linkUpdate, cssClass: 'e-flat e-update-alt', isPrimary: true\n }\n }]\n });\n this.dialogObj.element.style.maxHeight = 'inherit';\n this.dialogObj.content.querySelector('input').focus();\n }\n };\n Image.prototype.insertAlt = function (e) {\n if (!isNullOrUndefined(e.alt)) {\n e.selection.restore();\n if (this.parent.formatter.getUndoRedoStack().length === 0) {\n this.parent.formatter.saveData();\n }\n var altText = e.alt.value;\n this.parent.formatter.process(this.parent, e.args, e.args, {\n altText: altText, selectNode: e.selectNode,\n subCommand: e.args.item.subCommand\n });\n this.dialogObj.hide({ returnValue: false });\n }\n };\n Image.prototype.insertlink = function (e) {\n if (e.selectNode[0].nodeName !== 'IMG') {\n return;\n }\n var url = e.link.value;\n if (url === '') {\n addClass([e.link], 'e-error');\n e.link.setSelectionRange(0, url.length);\n e.link.focus();\n return;\n }\n if (!this.isUrl(url)) {\n url = 'http://' + url;\n }\n else {\n removeClass([e.link], 'e-error');\n }\n var proxy = e.selfImage;\n if (proxy.parent.editorMode === 'HTML') {\n e.selection.restore();\n }\n if (proxy.parent.formatter.getUndoRedoStack().length === 0) {\n proxy.parent.formatter.saveData();\n }\n if (e.selectNode[0].parentElement.nodeName === 'A') {\n proxy.parent.formatter.process(proxy.parent, e.args, e.args, {\n url: url, target: proxy.checkBoxObj.checked ? '_blank' : null, selectNode: e.selectNode,\n subCommand: e.args.item.subCommand\n });\n proxy.dialogObj.hide({ returnValue: true });\n return;\n }\n proxy.parent.formatter.process(proxy.parent, e.args, e.args, {\n url: url, target: proxy.checkBoxObj.checked ? '_blank' : null, selectNode: e.selectNode,\n subCommand: e.args.item.subCommand\n });\n proxy.dialogObj.hide({ returnValue: false });\n };\n Image.prototype.isUrl = function (url) {\n var regexp = /(ftp|http|https):\\/\\/(\\w+:{0,1}\\w*@)?(\\S+)(:[0-9]+)?(\\/|\\/([\\w#!:.?+=&%@!\\-\\/]))?/gi;\n return regexp.test(url);\n };\n Image.prototype.deleteImg = function (e) {\n if (e.selectNode[0].nodeName !== 'IMG') {\n return;\n }\n if (this.parent.formatter.getUndoRedoStack().length === 0) {\n this.parent.formatter.saveData();\n }\n e.selection.restore();\n if (this.contentModule.getEditPanel().querySelector('.e-img-resize')) {\n this.remvoeResizEle();\n }\n this.parent.formatter.process(this.parent, e.args, e.args, {\n selectNode: e.selectNode,\n captionClass: classes.CLS_CAPTION,\n subCommand: e.args.item.subCommand\n });\n if (this.quickToolObj && document.body.contains(this.quickToolObj.imageQTBar.element)) {\n this.quickToolObj.imageQTBar.hidePopup();\n }\n this.cancelResizeAction();\n };\n Image.prototype.caption = function (e) {\n var selectNode = e.selectNode[0];\n if (selectNode.nodeName !== 'IMG') {\n return;\n }\n e.selection.restore();\n if (this.parent.formatter.getUndoRedoStack().length === 0) {\n this.parent.formatter.saveData();\n }\n this.cancelResizeAction();\n addClass([selectNode], 'e-rte-image');\n var subCommand = (e.args.item) ?\n e.args.item.subCommand : 'Caption';\n if (!isNullOrUndefined(closest(selectNode, '.' + classes.CLS_CAPTION))) {\n detach(closest(selectNode, '.' + classes.CLS_CAPTION));\n if (selectNode.parentElement.tagName === 'A') {\n this.parent.formatter.process(this.parent, e.args, e.args, { insertElement: selectNode.parentElement, selectNode: e.selectNode, subCommand: subCommand });\n }\n else {\n this.parent.formatter.process(this.parent, e.args, e.args, { insertElement: selectNode, selectNode: e.selectNode, subCommand: subCommand });\n }\n }\n else {\n this.captionEle = this.parent.createElement('span', {\n className: classes.CLS_CAPTION,\n attrs: { contenteditable: 'false', draggable: 'false' }\n });\n var imgWrap = this.parent.createElement('span', { className: 'e-img-wrap' });\n var imgInner = this.parent.createElement('span', { className: 'e-img-inner', attrs: { contenteditable: 'true' } });\n imgWrap.appendChild(e.selectNode[0]);\n imgWrap.appendChild(imgInner);\n var imgCaption = this.i10n.getConstant('imageCaption');\n imgInner.innerHTML = imgCaption;\n this.captionEle.appendChild(imgWrap);\n if (selectNode.classList.contains(classes.CLS_IMGINLINE)) {\n addClass([this.captionEle], classes.CLS_CAPINLINE);\n }\n if (selectNode.classList.contains(classes.CLS_IMGBREAK)) {\n addClass([this.captionEle], classes.CLS_IMGBREAK);\n }\n if (selectNode.classList.contains(classes.CLS_IMGLEFT)) {\n addClass([this.captionEle], classes.CLS_IMGLEFT);\n }\n if (selectNode.classList.contains(classes.CLS_IMGRIGHT)) {\n addClass([this.captionEle], classes.CLS_IMGRIGHT);\n }\n if (selectNode.classList.contains(classes.CLS_IMGCENTER)) {\n addClass([this.captionEle], classes.CLS_IMGCENTER);\n }\n this.parent.formatter.process(this.parent, e.args, e.args, { insertElement: this.captionEle, selectNode: e.selectNode, subCommand: subCommand });\n this.parent.formatter.editorManager.nodeSelection.setSelectionText(this.contentModule.getDocument(), imgInner.childNodes[0], imgInner.childNodes[0], 0, imgInner.childNodes[0].textContent.length);\n }\n if (this.quickToolObj && document.body.contains(this.quickToolObj.imageQTBar.element)) {\n this.quickToolObj.imageQTBar.hidePopup();\n removeClass([selectNode], 'e-img-focus');\n }\n };\n Image.prototype.imageSize = function (e) {\n var _this = this;\n if (e.selectNode[0].nodeName !== 'IMG') {\n return;\n }\n this.imagDialog(e);\n if (!isNullOrUndefined(this.dialogObj)) {\n var imgSizeHeader = this.i10n.getConstant('imageSizeHeader');\n var linkUpdate = this.i10n.getConstant('dialogUpdate');\n var dialogContent = this.imgsizeInput(e);\n var selectObj_1 = { args: e.args, selfImage: this, selection: e.selection, selectNode: e.selectNode };\n this.dialogObj.setProperties({\n height: 'inherit', width: '290px', header: imgSizeHeader, content: dialogContent, position: { X: 'center', Y: 'center' },\n buttons: [{\n click: function (e) { _this.insertSize(selectObj_1); },\n buttonModel: {\n content: linkUpdate, cssClass: 'e-flat e-update-size', isPrimary: true\n }\n }]\n });\n this.dialogObj.element.style.maxHeight = 'inherit';\n this.dialogObj.content.querySelector('input').focus();\n }\n };\n Image.prototype.break = function (e) {\n if (e.selectNode[0].nodeName !== 'IMG') {\n return;\n }\n var subCommand = (e.args.item) ?\n e.args.item.subCommand : 'Break';\n this.parent.formatter.process(this.parent, e.args, e.args, { selectNode: e.selectNode, subCommand: subCommand });\n };\n Image.prototype.inline = function (e) {\n if (e.selectNode[0].nodeName !== 'IMG') {\n return;\n }\n var subCommand = (e.args.item) ?\n e.args.item.subCommand : 'Inline';\n this.parent.formatter.process(this.parent, e.args, e.args, { selectNode: e.selectNode, subCommand: subCommand });\n };\n Image.prototype.justifyImageLeft = function (e) {\n var subCommand = (e.args.item) ?\n e.args.item.subCommand : 'JustifyLeft';\n this.parent.formatter.process(this.parent, e.args, e.args, { selectNode: e.selectNode, subCommand: subCommand });\n };\n Image.prototype.justifyImageRight = function (e) {\n var subCommand = (e.args.item) ?\n e.args.item.subCommand : 'JustifyRight';\n this.parent.formatter.process(this.parent, e.args, e.args, { selectNode: e.selectNode, subCommand: subCommand });\n };\n Image.prototype.justifyImageCenter = function (e) {\n var subCommand = (e.args.item) ?\n e.args.item.subCommand : 'JustifyCenter';\n this.parent.formatter.process(this.parent, e.args, e.args, { selectNode: e.selectNode, subCommand: subCommand });\n };\n Image.prototype.imagDialog = function (e) {\n var _this = this;\n if (this.dialogObj) {\n this.dialogObj.hide({ returnValue: true });\n return;\n }\n var imgDialog = this.parent.createElement('div', { className: 'e-rte-img-dialog', id: this.rteID + '_image' });\n this.parent.element.appendChild(imgDialog);\n var imgInsert = this.i10n.getConstant('dialogInsert');\n var imglinkCancel = this.i10n.getConstant('dialogCancel');\n var imgHeader = this.i10n.getConstant('imageHeader');\n var selection = e.selection;\n var selectObj = { selfImage: this, selection: e.selection, args: e.args, selectParent: e.selectParent };\n this.dialogObj = new Dialog({\n header: imgHeader,\n cssClass: classes.CLS_RTE_ELEMENTS,\n enableRtl: this.parent.enableRtl,\n locale: this.parent.locale,\n showCloseIcon: true, closeOnEscape: true, width: (Browser.isDevice) ? '290px' : '340px', height: 'inherit',\n position: { X: 'center', Y: (Browser.isDevice) ? 'center' : 'top' },\n isModal: Browser.isDevice,\n buttons: [{\n click: this.insertImageUrl.bind(selectObj),\n buttonModel: { content: imgInsert, cssClass: 'e-flat e-insertImage', isPrimary: true }\n },\n {\n click: function (e) { _this.cancelDialog(e); },\n buttonModel: { cssClass: 'e-flat e-cancel', content: imglinkCancel }\n }],\n target: (Browser.isDevice) ? document.body : this.parent.element,\n animationSettings: { effect: 'None' },\n close: function (event) {\n _this.parent.isBlur = false;\n if (event && event.event.returnValue) {\n if (_this.parent.editorMode === 'HTML') {\n selection.restore();\n }\n else {\n _this.parent.formatter.editorManager.markdownSelection.restore(_this.parent.contentModule.getEditPanel());\n }\n }\n _this.dialogObj.destroy();\n detach(_this.dialogObj.element);\n _this.dialogObj = null;\n },\n });\n this.dialogObj.createElement = this.parent.createElement;\n this.dialogObj.appendTo(imgDialog);\n imgDialog.style.maxHeight = 'inherit';\n if (this.quickToolObj) {\n if (this.quickToolObj.imageQTBar && document.body.contains(this.quickToolObj.imageQTBar.element)) {\n this.quickToolObj.imageQTBar.hidePopup();\n if (!isNullOrUndefined(e.selectParent)) {\n removeClass([e.selectParent[0]], 'e-img-focus');\n }\n }\n if (this.quickToolObj.inlineQTBar && document.body.contains(this.quickToolObj.inlineQTBar.element)) {\n this.quickToolObj.inlineQTBar.hidePopup();\n }\n }\n };\n Image.prototype.cancelDialog = function (e) {\n this.parent.isBlur = false;\n this.dialogObj.hide({ returnValue: true });\n };\n Image.prototype.onDocumentClick = function (e) {\n var target = e.target;\n if (target.nodeName === 'IMG') {\n this.imgEle = target;\n }\n if (!isNullOrUndefined(this.dialogObj) && ((!closest(target, '#' + this.dialogObj.element.id) && this.parent.toolbarSettings.enable && this.parent.getToolbarElement() &&\n !this.parent.getToolbarElement().contains(e.target)) ||\n (this.parent.getToolbarElement() && this.parent.getToolbarElement().contains(e.target) &&\n !closest(target, '#' + this.parent.getID() + '_toolbar_Image') &&\n !target.querySelector('#' + this.parent.getID() + '_toolbar_Image')))) {\n this.dialogObj.hide({ returnValue: true });\n this.parent.isBlur = true;\n dispatchEvent(this.parent.element, 'focusout');\n }\n if (e.target.tagName !== 'IMG' && this.imgResizeDiv && !(this.quickToolObj &&\n this.quickToolObj.imageQTBar && this.quickToolObj.imageQTBar.element.contains(e.target)) &&\n this.contentModule.getEditPanel().contains(this.imgResizeDiv)) {\n this.cancelResizeAction();\n }\n if (target.tagName !== 'IMG' && this.contentModule.getEditPanel().querySelector('.e-img-resize')) {\n this.remvoeResizEle();\n this.contentModule.getEditPanel().querySelector('img').style.outline = '';\n }\n };\n Image.prototype.remvoeResizEle = function () {\n EventHandler.remove(this.contentModule.getDocument(), Browser.touchMoveEvent, this.resizing);\n EventHandler.remove(this.contentModule.getDocument(), Browser.touchEndEvent, this.resizeEnd);\n detach(this.contentModule.getEditPanel().querySelector('.e-img-resize'));\n };\n Image.prototype.imageUrlPopup = function (e) {\n var imgUrl = this.parent.createElement('div', { className: 'imgUrl' });\n var placeUrl = this.i10n.getConstant('imageUrl');\n this.inputUrl = this.parent.createElement('input', {\n className: 'e-input e-img-url',\n attrs: { placeholder: placeUrl, spellcheck: 'false' }\n });\n imgUrl.appendChild(this.inputUrl);\n return imgUrl;\n };\n Image.prototype.insertImageUrl = function (e) {\n var proxy = this.selfImage;\n var url = proxy.inputUrl.value;\n if (proxy.parent.formatter.getUndoRedoStack().length === 0) {\n proxy.parent.formatter.saveData();\n }\n if (!isNullOrUndefined(proxy.uploadUrl) && proxy.uploadUrl.url !== '') {\n proxy.uploadUrl.cssClass = (proxy.parent.insertImageSettings.display === 'inline' ?\n classes.CLS_IMGINLINE : classes.CLS_IMGBREAK);\n proxy.parent.formatter.process(proxy.parent, this.args, this.args.originalEvent, proxy.uploadUrl);\n proxy.dialogObj.hide({ returnValue: false });\n proxy.uploadUrl.url = '';\n }\n else if (url !== '') {\n if (proxy.parent.editorMode === 'HTML' && isNullOrUndefined(closest(this.selection.range.startContainer.parentNode, '#' + proxy.contentModule.getPanel().id))) {\n proxy.contentModule.getEditPanel().focus();\n var range = proxy.parent.formatter.editorManager.nodeSelection.getRange(proxy.contentModule.getDocument());\n this.selection = proxy.parent.formatter.editorManager.nodeSelection.save(range, proxy.contentModule.getDocument());\n this.selectParent = proxy.parent.formatter.editorManager.nodeSelection.getParentNodeCollection(range);\n }\n var regex = /[\\w-]+.(jpg|png|jpeg|gif)/g;\n var matchUrl = (!isNullOrUndefined(url.match(regex)) && proxy.parent.editorMode === 'HTML') ? url.match(regex)[0] : '';\n var value = {\n cssClass: (proxy.parent.insertImageSettings.display === 'inline' ? classes.CLS_IMGINLINE : classes.CLS_IMGBREAK),\n url: url, selection: this.selection, altText: matchUrl,\n selectParent: this.selectParent, width: {\n width: proxy.parent.insertImageSettings.width, minWidth: proxy.parent.insertImageSettings.minWidth,\n maxWidth: proxy.parent.insertImageSettings.maxWidth\n },\n height: {\n height: proxy.parent.insertImageSettings.height, minHeight: proxy.parent.insertImageSettings.minHeight,\n maxHeight: proxy.parent.insertImageSettings.maxHeight\n }\n };\n proxy.parent.formatter.process(proxy.parent, this.args, this.args.originalEvent, value);\n proxy.dialogObj.hide({ returnValue: false });\n }\n };\n Image.prototype.imgsizeInput = function (e) {\n var selectNode = e.selectNode[0];\n var imgHeight = this.i10n.getConstant('imageHeight');\n var imgWidth = this.i10n.getConstant('imageWidth');\n var imgSizeWrap = this.parent.createElement('div', { className: 'e-img-sizewrap' });\n var widthVal = (selectNode.getAttribute('width') === 'auto' ||\n isNullOrUndefined(selectNode.getAttribute('width'))) ? selectNode.width : selectNode.getClientRects()[0].width;\n var heightVal = (selectNode.getAttribute('height') === 'auto' ||\n isNullOrUndefined(selectNode.getAttribute('height'))) ? selectNode.height : selectNode.getClientRects()[0].height;\n var content = '' +\n '' + '
' +\n '
';\n var contentElem = parseHtml(content);\n imgSizeWrap.appendChild(contentElem);\n var widthNum = new NumericTextBox({\n format: '###.### px', min: this.parent.insertImageSettings.minWidth,\n max: this.parent.insertImageSettings.maxWidth,\n enableRtl: this.parent.enableRtl, locale: this.parent.locale\n });\n widthNum.createElement = this.parent.createElement;\n widthNum.appendTo(imgSizeWrap.querySelector('#imgwidth'));\n var heightNum = new NumericTextBox({\n format: '###.### px', min: this.parent.insertImageSettings.minHeight,\n max: this.parent.insertImageSettings.maxHeight,\n enableRtl: this.parent.enableRtl, locale: this.parent.locale\n });\n heightNum.createElement = this.parent.createElement;\n heightNum.appendTo(imgSizeWrap.querySelector('#imgheight'));\n return imgSizeWrap;\n };\n Image.prototype.insertSize = function (e) {\n e.selection.restore();\n var proxy = e.selfImage;\n if (proxy.parent.formatter.getUndoRedoStack().length === 0) {\n proxy.parent.formatter.saveData();\n }\n var dialogEle = proxy.dialogObj.element;\n var width = parseFloat(dialogEle.querySelector('.e-img-width').value);\n var height = parseFloat(dialogEle.parentElement.querySelector('.e-img-height').value);\n proxy.parent.formatter.process(this.parent, e.args, e.args, {\n width: width, height: height, selectNode: e.selectNode,\n subCommand: e.args.item.subCommand\n });\n if (this.imgResizeDiv) {\n proxy.imgResizePos(e.selectNode[0], this.imgResizeDiv);\n }\n proxy.dialogObj.hide({ returnValue: true });\n };\n Image.prototype.insertImage = function (e) {\n this.imagDialog(e);\n if (!isNullOrUndefined(this.dialogObj)) {\n var dialogContent = this.parent.createElement('div', { className: 'e-img-content' });\n if ((!isNullOrUndefined(this.parent.insertImageSettings.path) && this.parent.editorMode === 'Markdown')\n || this.parent.editorMode === 'HTML') {\n dialogContent.appendChild(this.imgUpload(e));\n }\n var linkHeader = this.parent.createElement('div', { className: 'e-linkheader' });\n var linkHeaderText = this.i10n.getConstant('imageLinkHeader');\n if (this.parent.editorMode === 'HTML') {\n linkHeader.innerHTML = linkHeaderText;\n }\n else {\n linkHeader.innerHTML = this.i10n.getConstant('mdimageLink');\n }\n dialogContent.appendChild(linkHeader);\n dialogContent.appendChild(this.imageUrlPopup(e));\n if (e.selectNode && e.selectNode[0].nodeName === 'IMG') {\n this.dialogObj.setProperties({\n header: this.parent.localeObj.getConstant('editImageHeader'), content: dialogContent\n });\n this.dialogObj.element.querySelector('.e-insertImage').textContent = this.parent.localeObj.getConstant('dialogUpdate');\n }\n else {\n this.dialogObj.setProperties({ content: dialogContent }, false);\n }\n this.dialogObj.element.style.maxHeight = 'inherit';\n if ((!isNullOrUndefined(this.parent.insertImageSettings.path) && this.parent.editorMode === 'Markdown')\n || this.parent.editorMode === 'HTML') {\n dialogContent.querySelector('#' + this.rteID + '_insertImage').focus();\n }\n else {\n dialogContent.querySelector('.e-img-url').focus();\n }\n }\n };\n Image.prototype.imgUpload = function (e) {\n var _this = this;\n var save;\n var selectParent;\n var proxy = this;\n if (proxy.parent.editorMode === 'HTML' &&\n isNullOrUndefined(closest(e.selection.range.startContainer.parentNode, '#' + this.contentModule.getPanel().id))) {\n this.contentModule.getEditPanel().focus();\n var range = this.parent.formatter.editorManager.nodeSelection.getRange(this.parent.contentModule.getDocument());\n save = this.parent.formatter.editorManager.nodeSelection.save(range, this.parent.contentModule.getDocument());\n selectParent = this.parent.formatter.editorManager.nodeSelection.getParentNodeCollection(range);\n }\n else {\n save = e.selection;\n selectParent = e.selectParent;\n }\n var uploadParentEle = this.parent.createElement('div', { className: 'e-img-uploadwrap e-droparea' });\n var deviceImgUpMsg = this.i10n.getConstant('imageDeviceUploadMessage');\n var imgUpMsg = this.i10n.getConstant('imageUploadMessage');\n var span = this.parent.createElement('span', { className: 'e-droptext' });\n var spanMsg = this.parent.createElement('span', {\n className: 'e-rte-upload-text',\n innerHTML: ((Browser.isDevice) ? deviceImgUpMsg : imgUpMsg)\n });\n span.appendChild(spanMsg);\n var btnEle = this.parent.createElement('button', {\n className: 'e-browsebtn', id: this.rteID + '_insertImage',\n attrs: { autofocus: 'true', type: 'button' }\n });\n span.appendChild(btnEle);\n uploadParentEle.appendChild(span);\n var browserMsg = this.i10n.getConstant('browse');\n var button = new Button({ content: browserMsg, enableRtl: this.parent.enableRtl });\n button.createElement = this.parent.createElement;\n button.appendTo(btnEle);\n var btnClick = (Browser.isDevice) ? span : btnEle;\n EventHandler.add(btnClick, 'click', this.fileSelect, this);\n var uploadEle = this.parent.createElement('input', {\n id: this.rteID + '_upload', attrs: { type: 'File', name: 'UploadFiles' }\n });\n uploadParentEle.appendChild(uploadEle);\n var altText;\n this.uploadObj = new Uploader({\n asyncSettings: {\n saveUrl: this.parent.insertImageSettings.saveUrl,\n },\n dropArea: span,\n multiple: false,\n enableRtl: this.parent.enableRtl,\n allowedExtensions: this.parent.insertImageSettings.allowedTypes.toString(),\n selected: function (e) {\n altText = e.filesData[0].name;\n if (_this.parent.editorMode === 'HTML' && isNullOrUndefined(_this.parent.insertImageSettings.path)) {\n var reader_1 = new FileReader();\n reader_1.addEventListener('load', function (e) {\n var url = URL.createObjectURL(proxy.url(reader_1.result));\n proxy.uploadUrl = {\n url: url, selection: save, altText: altText, selectParent: selectParent,\n width: {\n width: proxy.parent.insertImageSettings.width, minWidth: proxy.parent.insertImageSettings.minWidth,\n maxWidth: proxy.parent.insertImageSettings.maxWidth\n },\n height: {\n height: proxy.parent.insertImageSettings.height, minHeight: proxy.parent.insertImageSettings.minHeight,\n maxHeight: proxy.parent.insertImageSettings.maxHeight\n }\n };\n proxy.inputUrl.setAttribute('disabled', 'true');\n });\n reader_1.readAsDataURL(e.filesData[0].rawFile);\n }\n },\n success: function (e) {\n if (!isNullOrUndefined(_this.parent.insertImageSettings.path)) {\n var url = _this.parent.insertImageSettings.path + e.file.name;\n var value = { url: url, selection: save };\n proxy.uploadUrl = {\n url: url, selection: save, altText: altText, selectParent: selectParent,\n width: {\n width: proxy.parent.insertImageSettings.width, minWidth: proxy.parent.insertImageSettings.minWidth,\n maxWidth: proxy.parent.insertImageSettings.maxWidth\n },\n height: {\n height: proxy.parent.insertImageSettings.height, minHeight: proxy.parent.insertImageSettings.minHeight,\n maxHeight: proxy.parent.insertImageSettings.maxHeight\n }\n };\n proxy.inputUrl.setAttribute('disabled', 'true');\n }\n },\n removing: function () {\n proxy.inputUrl.removeAttribute('disabled');\n proxy.uploadUrl.url = '';\n }\n });\n this.uploadObj.createElement = this.parent.createElement;\n this.uploadObj.appendTo(uploadEle);\n return uploadParentEle;\n };\n Image.prototype.fileSelect = function () {\n document.body.getElementsByClassName('e-file-select-wrap')[0].querySelector('button').click();\n return false;\n };\n Image.prototype.imagePaste = function (args) {\n if (args.text.length === 0) {\n var proxy_1 = this;\n var reader_2 = new FileReader();\n args.args.preventDefault();\n reader_2.addEventListener('load', function (e) {\n var url = {\n cssClass: (proxy_1.parent.insertImageSettings.display === 'inline' ? classes.CLS_IMGINLINE : classes.CLS_IMGBREAK),\n url: URL.createObjectURL(proxy_1.url(reader_2.result)),\n width: {\n width: proxy_1.parent.insertImageSettings.width, minWidth: proxy_1.parent.insertImageSettings.minWidth,\n maxWidth: proxy_1.parent.insertImageSettings.maxWidth\n },\n height: {\n height: proxy_1.parent.insertImageSettings.height, minHeight: proxy_1.parent.insertImageSettings.minHeight,\n maxHeight: proxy_1.parent.insertImageSettings.maxHeight\n }\n };\n proxy_1.parent.formatter.process(proxy_1.parent, { item: { command: 'Images', subCommand: 'Image' } }, args.args, url);\n });\n reader_2.readAsDataURL(args.file);\n }\n };\n Image.prototype.url = function (dataurl) {\n var arr = dataurl.split(',');\n var mime = arr[0].match(/:(.*?);/)[1];\n var bstr = atob(arr[1]);\n var n = bstr.length;\n var u8arr = new Uint8Array(n);\n while (n--) {\n u8arr[n] = bstr.charCodeAt(n);\n }\n return new Blob([u8arr], { type: mime });\n };\n /**\n * Destroys the ToolBar.\n * @method destroy\n * @return {void}\n */\n Image.prototype.destroy = function () {\n this.removeEventListener();\n };\n /**\n * For internal use only - Get the module name.\n */\n Image.prototype.getModuleName = function () {\n return 'image';\n };\n return Image;\n}());\nexport { Image };\n","import { removeClass, selectAll, isNullOrUndefined, EventHandler } from '@syncfusion/ej2-base';\nimport * as events from '../base/constant';\nimport { CLS_EXPAND_OPEN, CLS_TB_ITEM, CLS_ACTIVE } from '../base/classes';\nimport * as CONSTANT from '../../common/constant';\nimport { RenderType } from '../base/enum';\nimport { KeyboardEvents } from '../actions/keyboard';\n/**\n * Content module is used to render RichTextEditor content\n * @hidden\n */\nvar ViewSource = /** @class */ (function () {\n /**\n * Constructor for view source module\n */\n function ViewSource(parent, locator) {\n this.parent = parent;\n var serviceLocator = locator;\n this.rendererFactory = serviceLocator.getService('rendererFactory');\n this.addEventListener();\n }\n ViewSource.prototype.addEventListener = function () {\n this.parent.on(events.sourceCode, this.sourceCode, this);\n this.parent.on(events.initialEnd, this.onInitialEnd, this);\n this.parent.on(events.updateSource, this.updateSourceCode, this);\n };\n ViewSource.prototype.onInitialEnd = function () {\n this.parent.formatter.editorManager.observer.on(CONSTANT.KEY_DOWN_HANDLER, this.onKeyDown, this);\n };\n ViewSource.prototype.removeEventListener = function () {\n this.unWireEvent();\n this.parent.off(events.sourceCode, this.sourceCode);\n this.parent.off(events.updateSource, this.updateSourceCode);\n this.parent.off(events.initialEnd, this.onInitialEnd);\n this.parent.formatter.editorManager.observer.off(CONSTANT.KEY_DOWN_HANDLER, this.onKeyDown);\n };\n ViewSource.prototype.getSourceCode = function () {\n return this.parent.createElement('textarea', { className: 'e-rte-srctextarea' });\n };\n ViewSource.prototype.wireEvent = function (element) {\n this.keyboardModule = new KeyboardEvents(element, {\n keyAction: this.previewKeyDown.bind(this), keyConfigs: this.parent.formatter.keyConfig, eventName: 'keydown'\n });\n EventHandler.add(this.previewElement, 'mousedown', this.mouseDownHandler, this);\n };\n ViewSource.prototype.unWireEvent = function () {\n if (this.keyboardModule) {\n this.keyboardModule.destroy();\n }\n if (this.previewElement) {\n EventHandler.remove(this.previewElement, 'mousedown', this.mouseDownHandler);\n }\n };\n ViewSource.prototype.wireBaseKeyDown = function () {\n this.parent.keyboardModule = new KeyboardEvents(this.contentModule.getEditPanel(), {\n keyAction: this.parent.keyDown.bind(this.parent), keyConfigs: this.parent.formatter.keyConfig, eventName: 'keydown'\n });\n };\n ViewSource.prototype.unWireBaseKeyDown = function () {\n this.parent.keyboardModule.destroy();\n };\n ViewSource.prototype.mouseDownHandler = function (e) {\n this.parent.notify(events.sourceCodeMouseDown, { args: e });\n };\n ViewSource.prototype.previewKeyDown = function (event) {\n switch (event.action) {\n case 'html-source':\n this.updateSourceCode(event);\n event.preventDefault();\n break;\n }\n };\n ViewSource.prototype.onKeyDown = function (e) {\n switch (e.event.action) {\n case 'html-source':\n e.event.preventDefault();\n this.sourceCode(e);\n e.callBack({\n requestType: 'SourceCode',\n editorMode: 'HTML',\n event: e.event\n });\n break;\n }\n };\n ViewSource.prototype.sourceCode = function (args) {\n this.parent.isBlur = false;\n this.parent.trigger(events.actionBegin, { requestType: 'SourceCode', targetItem: 'SourceCode', args: args });\n var tbItems = selectAll('.' + CLS_TB_ITEM, this.parent.element);\n this.contentModule = this.rendererFactory.getRenderer(RenderType.Content);\n this.parent.notify(events.updateToolbarItem, {\n targetItem: 'SourceCode', updateItem: 'Preview',\n baseToolbar: this.parent.getBaseToolbarObject()\n });\n if (isNullOrUndefined(this.previewElement)) {\n this.previewElement = this.getSourceCode();\n }\n this.parent.updateValueData();\n if (this.parent.iframeSettings.enable) {\n var rteContent = void 0;\n if (isNullOrUndefined(this.parent.element.querySelector('#' + this.parent.element.id + '_source-view'))) {\n rteContent = this.parent.createElement('div', {\n className: 'e-source-content', id: this.parent.element.id + '_source-view'\n });\n }\n else {\n rteContent = this.parent.element.querySelector('#' + this.parent.element.id + '_source-view');\n }\n rteContent.appendChild(this.previewElement);\n this.parent.element.appendChild(rteContent);\n rteContent.style.height = this.contentModule.getPanel().style.height;\n rteContent.style.marginTop = this.contentModule.getPanel().style.marginTop;\n this.getPanel().value = this.parent.value;\n this.contentModule.getPanel().style.display = 'none';\n rteContent.style.display = 'block';\n }\n else {\n this.contentModule.getPanel().appendChild(this.previewElement);\n this.getPanel().value = (this.contentModule.getEditPanel().innerHTML === ''\n + '
';\n var contentElem = parseHtml(content);\n tableWrap.appendChild(contentElem);\n var widthNum = new NumericTextBox({\n format: 'n0',\n min: 0,\n value: widthVal,\n placeholder: tableWidth,\n floatLabelType: 'Auto',\n enableRtl: this.parent.enableRtl, locale: this.parent.locale\n });\n widthNum.appendTo(tableWrap.querySelector('#tableWidth'));\n var padding = new NumericTextBox({\n format: 'n0',\n min: 0,\n value: 0,\n placeholder: cellPadding,\n floatLabelType: 'Auto',\n enableRtl: this.parent.enableRtl, locale: this.parent.locale\n });\n padding.appendTo(tableWrap.querySelector('#cellPadding'));\n var spacing = new NumericTextBox({\n format: 'n0',\n min: 0,\n value: 0,\n placeholder: cellSpacing,\n floatLabelType: 'Auto',\n enableRtl: this.parent.enableRtl, locale: this.parent.locale\n });\n spacing.appendTo(tableWrap.querySelector('#cellSpacing'));\n return tableWrap;\n };\n /**\n * Destroys the ToolBar.\n * @method destroy\n * @return {void}\n */\n Table.prototype.destroy = function () {\n this.removeEventListener();\n };\n /**\n * For internal use only - Get the module name.\n */\n Table.prototype.getModuleName = function () {\n return 'table';\n };\n return Table;\n}());\nexport { Table };\n","/** @hidden */\nexport var executeGroup = {\n 'bold': {\n command: 'style',\n subCommand: 'bold',\n value: 'strong'\n },\n 'italic': {\n command: 'style',\n subCommand: 'italic',\n value: 'em'\n },\n 'underline': {\n command: 'style',\n subCommand: 'underline',\n value: 'span'\n },\n 'strikeThrough': {\n command: 'style',\n subCommand: 'strikeThrough',\n value: 'span'\n },\n 'superscript': {\n command: 'effects',\n subCommand: 'superscript',\n value: 'sup'\n },\n 'subscript': {\n command: 'effects',\n subCommand: 'subscript',\n value: 'sub'\n },\n 'uppercase': {\n command: 'casing',\n subCommand: 'uppercase'\n },\n 'lowercase': {\n command: 'casing',\n subCommand: 'lowercase'\n },\n 'fontColor': {\n command: 'font',\n subCommand: 'fontcolor',\n value: '#ff0000'\n },\n 'fontName': {\n command: 'font',\n subCommand: 'fontname',\n value: 'Segoe UI'\n },\n 'fontSize': {\n command: 'font',\n subCommand: 'fontsize',\n value: '10pt'\n },\n 'backColor': {\n command: 'font',\n subCommand: 'backgroundcolor',\n value: '#ffff00'\n },\n 'justifyCenter': {\n command: 'Alignments',\n subCommand: 'JustifyCenter'\n },\n 'justifyFull': {\n command: 'Alignments',\n subCommand: 'JustifyFull'\n },\n 'justifyLeft': {\n command: 'Alignments',\n subCommand: 'JustifyLeft'\n },\n 'justifyRight': {\n command: 'Alignments',\n subCommand: 'JustifyRight'\n },\n 'undo': {\n command: 'Actions',\n subCommand: 'Undo'\n },\n 'redo': {\n command: 'Actions',\n subCommand: 'Redo'\n },\n 'createLink': {\n command: 'Links',\n subCommand: 'Links'\n },\n 'createImage': {\n command: 'Images',\n subCommand: 'Images'\n },\n 'formatBlock': {\n command: 'Formats',\n value: 'P'\n },\n 'heading': {\n command: 'Formats',\n value: 'H1'\n },\n 'indent': {\n command: 'Indents',\n subCommand: 'Indent'\n },\n 'outdent': {\n command: 'Indents',\n subCommand: 'Outdent'\n },\n 'insertHTML': {\n command: 'InsertHTML',\n subCommand: 'InsertHTML',\n value: ''\n },\n 'insertText': {\n command: 'InsertText',\n subCommand: 'InsertText',\n value: ''\n },\n 'insertHorizontalRule': {\n command: 'InsertHTML',\n subCommand: 'InsertHTML',\n value: ''\n },\n 'insertImage': {\n command: 'InsertHTML',\n subCommand: 'InsertHTML',\n value: '
'\n },\n 'insertOrderedList': {\n command: 'Lists',\n value: 'OL'\n },\n 'insertUnorderedList': {\n command: 'Lists',\n value: 'UL'\n },\n 'insertParagraph': {\n command: 'Formats',\n value: 'P'\n },\n 'removeFormat': {\n command: 'Clear',\n subCommand: 'ClearFormat'\n }\n};\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty } from '@syncfusion/ej2-base';\nimport { ToolbarType } from '../base/enum';\nimport { TableStyleItems } from '../models/items';\nexport var predefinedItems = ['Bold', 'Italic', 'Underline', '|', 'Formats', 'Alignments',\n 'OrderedList', 'UnorderedList', '|', 'CreateLink', 'Image', '|', 'SourceCode', 'Undo', 'Redo'];\nexport var fontFamily = [\n { text: 'Segoe UI', value: 'Segoe UI', cssClass: 'e-segoe-ui' },\n { text: 'Arial', value: 'Arial,Helvetica,sans-serif', cssClass: 'e-arial' },\n { text: 'Georgia', value: 'Georgia,serif', cssClass: 'e-georgia' },\n { text: 'Impact', value: 'Impact,Charcoal,sans-serif', cssClass: 'e-impact' },\n { text: 'Tahoma', value: 'Tahoma,Geneva,sans-serif', cssClass: 'e-tahoma' },\n { text: 'Times New Roman', value: 'Times New Roman,Times,serif', cssClass: 'e-times-new-roman' },\n { text: 'Verdana', value: 'Verdana,Geneva,sans-serif', cssClass: 'e-verdana' }\n];\nexport var fontSize = [\n { text: '8 pt', value: '8pt' },\n { text: '10 pt', value: '10pt' },\n { text: '12 pt', value: '12pt' },\n { text: '14 pt', value: '14pt' },\n { text: '18 pt', value: '18pt' },\n { text: '24 pt', value: '24pt' },\n { text: '36 pt', value: '36pt' }\n];\nexport var formatItems = [\n { text: 'Paragraph', value: 'P', cssClass: 'e-paragraph' },\n { text: 'Code', value: 'Pre', cssClass: 'e-code' },\n { text: 'Quotation', value: 'BlockQuote', cssClass: 'e-quote' },\n { text: 'Heading 1', value: 'H1', cssClass: 'e-h1' },\n { text: 'Heading 2', value: 'H2', cssClass: 'e-h2' },\n { text: 'Heading 3', value: 'H3', cssClass: 'e-h3' },\n { text: 'Heading 4', value: 'H4', cssClass: 'e-h4' }\n];\nexport var fontColor = {\n 'Custom': [\n '', '#000000', '#e7e6e6', '#44546a', '#4472c4', '#ed7d31', '#a5a5a5', '#ffc000', '#70ad47', '#ff0000',\n '#f2f2f2', '#808080', '#cfcdcd', '#d5dce4', '#d9e2f3', '#fbe4d5', '#ededed', '#fff2cc', '#e2efd9', '#ffcccc',\n '#d9d9d9', '#595959', '#aeaaaa', '#acb9ca', '#b4c6e7', '#f7caac', '#dbdbdb', '#ffe599', '#c5e0b3', '#ff8080',\n '#bfbfbf', '#404040', '#747070', '#8496b0', '#8eaadb', '#f4b083', '#c9c9c9', '#ffd966', '#a8d08d', '#ff3333',\n '#a6a6a6', '#262626', '#3b3838', '#323e4f', '#2f5496', '#c45911', '#7b7b7b', '#bf8f00', '#538135', '#b30000',\n '#7f7f7f', '#0d0d0d', '#161616', '#212934', '#1f3763', '#823b0b', '#525252', '#7f5f00', '#375623', '#660000'\n ]\n};\nexport var backgroundColor = {\n 'Custom': [\n '', '#000000', '#ffff00', '#00ff00', '#00ffff', '#0000ff', '#ff0000', '#000080', '#800080', '#996633',\n '#f2f2f2', '#808080', '#ffffcc', '#b3ffb3', '#ccffff', '#ccccff', '#ffcccc', '#ccccff', '#ff80ff', '#f2e6d9',\n '#d9d9d9', '#595959', '#ffff80', '#80ff80', '#b3ffff', '#8080ff', '#ff8080', '#8080ff', '#ff00ff', '#dfbf9f',\n '#bfbfbf', '#404040', '#ffff33', '#33ff33', '#33ffff', '#3333ff', '#ff3333', '#0000b3', '#b300b3', '#c68c53',\n '#a6a6a6', '#262626', '#e6e600', '#00b300', '#009999', '#000099', '#b30000', '#000066', '#660066', '#86592d',\n '#7f7f7f', '#0d0d0d', '#999900', '#006600', '#006666', '#000066', '#660000', '#00004d', '#4d004d', '#734d26',\n ]\n};\n/**\n * Configures the toolbar settings of the RichTextEditor.\n */\nvar ToolbarSettings = /** @class */ (function (_super) {\n __extends(ToolbarSettings, _super);\n function ToolbarSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], ToolbarSettings.prototype, \"enable\", void 0);\n __decorate([\n Property(true)\n ], ToolbarSettings.prototype, \"enableFloating\", void 0);\n __decorate([\n Property(ToolbarType.Expand)\n ], ToolbarSettings.prototype, \"type\", void 0);\n __decorate([\n Property(predefinedItems)\n ], ToolbarSettings.prototype, \"items\", void 0);\n __decorate([\n Property({})\n ], ToolbarSettings.prototype, \"itemConfigs\", void 0);\n return ToolbarSettings;\n}(ChildProperty));\nexport { ToolbarSettings };\n/**\n * Configures the image settings of the RichTextEditor.\n */\nvar ImageSettings = /** @class */ (function (_super) {\n __extends(ImageSettings, _super);\n function ImageSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(['.jpeg', '.jpg', '.png'])\n ], ImageSettings.prototype, \"allowedTypes\", void 0);\n __decorate([\n Property('inline')\n ], ImageSettings.prototype, \"display\", void 0);\n __decorate([\n Property('auto')\n ], ImageSettings.prototype, \"width\", void 0);\n __decorate([\n Property('auto')\n ], ImageSettings.prototype, \"height\", void 0);\n __decorate([\n Property(null)\n ], ImageSettings.prototype, \"saveUrl\", void 0);\n __decorate([\n Property(null)\n ], ImageSettings.prototype, \"path\", void 0);\n __decorate([\n Property(true)\n ], ImageSettings.prototype, \"resize\", void 0);\n __decorate([\n Property(0)\n ], ImageSettings.prototype, \"minWidth\", void 0);\n __decorate([\n Property(null)\n ], ImageSettings.prototype, \"maxWidth\", void 0);\n __decorate([\n Property(0)\n ], ImageSettings.prototype, \"minHeight\", void 0);\n __decorate([\n Property(null)\n ], ImageSettings.prototype, \"maxHeight\", void 0);\n __decorate([\n Property(false)\n ], ImageSettings.prototype, \"resizeByPercent\", void 0);\n return ImageSettings;\n}(ChildProperty));\nexport { ImageSettings };\nvar TableSettings = /** @class */ (function (_super) {\n __extends(TableSettings, _super);\n function TableSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('100%')\n ], TableSettings.prototype, \"width\", void 0);\n __decorate([\n Property(TableStyleItems)\n ], TableSettings.prototype, \"styles\", void 0);\n __decorate([\n Property(true)\n ], TableSettings.prototype, \"resize\", void 0);\n __decorate([\n Property(0)\n ], TableSettings.prototype, \"minWidth\", void 0);\n __decorate([\n Property(null)\n ], TableSettings.prototype, \"maxWidth\", void 0);\n return TableSettings;\n}(ChildProperty));\nexport { TableSettings };\n/**\n * Configures the quick toolbar settings of the RichTextEditor.\n */\nvar QuickToolbarSettings = /** @class */ (function (_super) {\n __extends(QuickToolbarSettings, _super);\n function QuickToolbarSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], QuickToolbarSettings.prototype, \"enable\", void 0);\n __decorate([\n Property('hide')\n ], QuickToolbarSettings.prototype, \"actionOnScroll\", void 0);\n __decorate([\n Property(['Open', 'Edit', 'UnLink'])\n ], QuickToolbarSettings.prototype, \"link\", void 0);\n __decorate([\n Property(['Replace', 'Align', 'Caption', 'Remove', '-', 'InsertLink', 'OpenImageLink', 'EditImageLink', 'RemoveImageLink', 'Display', 'AltText', 'Dimension'])\n ], QuickToolbarSettings.prototype, \"image\", void 0);\n __decorate([\n Property(['Cut', 'Copy', 'Paste'])\n ], QuickToolbarSettings.prototype, \"text\", void 0);\n __decorate([\n Property(['TableHeader', 'TableRows', 'TableColumns', 'BackgroundColor', '-', 'TableRemove', 'Alignments', 'TableCellVerticalAlign', 'Styles'])\n ], QuickToolbarSettings.prototype, \"table\", void 0);\n return QuickToolbarSettings;\n}(ChildProperty));\nexport { QuickToolbarSettings };\n/**\n * Configures the Paste Cleanup settings of the RichTextEditor.\n */\nvar PasteCleanupSettings = /** @class */ (function (_super) {\n __extends(PasteCleanupSettings, _super);\n function PasteCleanupSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], PasteCleanupSettings.prototype, \"prompt\", void 0);\n __decorate([\n Property(null)\n ], PasteCleanupSettings.prototype, \"deniedAttrs\", void 0);\n __decorate([\n Property(null)\n ], PasteCleanupSettings.prototype, \"allowedStyleProps\", void 0);\n __decorate([\n Property(null)\n ], PasteCleanupSettings.prototype, \"deniedTags\", void 0);\n __decorate([\n Property(true)\n ], PasteCleanupSettings.prototype, \"keepFormat\", void 0);\n __decorate([\n Property(false)\n ], PasteCleanupSettings.prototype, \"plainText\", void 0);\n return PasteCleanupSettings;\n}(ChildProperty));\nexport { PasteCleanupSettings };\n/**\n * Configures the font family settings of the RichTextEditor.\n */\nvar FontFamily = /** @class */ (function (_super) {\n __extends(FontFamily, _super);\n function FontFamily() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], FontFamily.prototype, \"default\", void 0);\n __decorate([\n Property('65px')\n ], FontFamily.prototype, \"width\", void 0);\n __decorate([\n Property(fontFamily)\n ], FontFamily.prototype, \"items\", void 0);\n return FontFamily;\n}(ChildProperty));\nexport { FontFamily };\n/**\n * Configures the font size settings of the RichTextEditor.\n */\nvar FontSize = /** @class */ (function (_super) {\n __extends(FontSize, _super);\n function FontSize() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], FontSize.prototype, \"default\", void 0);\n __decorate([\n Property('35px')\n ], FontSize.prototype, \"width\", void 0);\n __decorate([\n Property(fontSize)\n ], FontSize.prototype, \"items\", void 0);\n return FontSize;\n}(ChildProperty));\nexport { FontSize };\n/**\n * Configures the format settings of the RichTextEditor.\n */\nvar Format = /** @class */ (function (_super) {\n __extends(Format, _super);\n function Format() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], Format.prototype, \"default\", void 0);\n __decorate([\n Property('65px')\n ], Format.prototype, \"width\", void 0);\n __decorate([\n Property(formatItems)\n ], Format.prototype, \"types\", void 0);\n return Format;\n}(ChildProperty));\nexport { Format };\n/**\n * Configures the font Color settings of the RichTextEditor.\n */\nvar FontColor = /** @class */ (function (_super) {\n __extends(FontColor, _super);\n function FontColor() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('#ff0000')\n ], FontColor.prototype, \"default\", void 0);\n __decorate([\n Property('Palette')\n ], FontColor.prototype, \"mode\", void 0);\n __decorate([\n Property(10)\n ], FontColor.prototype, \"columns\", void 0);\n __decorate([\n Property(fontColor)\n ], FontColor.prototype, \"colorCode\", void 0);\n __decorate([\n Property(false)\n ], FontColor.prototype, \"modeSwitcher\", void 0);\n return FontColor;\n}(ChildProperty));\nexport { FontColor };\n/**\n * Configures the background Color settings of the RichTextEditor.\n */\nvar BackgroundColor = /** @class */ (function (_super) {\n __extends(BackgroundColor, _super);\n function BackgroundColor() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('#ffff00')\n ], BackgroundColor.prototype, \"default\", void 0);\n __decorate([\n Property('Palette')\n ], BackgroundColor.prototype, \"mode\", void 0);\n __decorate([\n Property(10)\n ], BackgroundColor.prototype, \"columns\", void 0);\n __decorate([\n Property(backgroundColor)\n ], BackgroundColor.prototype, \"colorCode\", void 0);\n __decorate([\n Property(false)\n ], BackgroundColor.prototype, \"modeSwitcher\", void 0);\n return BackgroundColor;\n}(ChildProperty));\nexport { BackgroundColor };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty, Complex } from '@syncfusion/ej2-base';\n/**\n * Objects used for configuring the iframe resources properties.\n */\nvar Resources = /** @class */ (function (_super) {\n __extends(Resources, _super);\n function Resources() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property([])\n ], Resources.prototype, \"styles\", void 0);\n __decorate([\n Property([])\n ], Resources.prototype, \"scripts\", void 0);\n return Resources;\n}(ChildProperty));\nexport { Resources };\n/**\n * Configures the iframe settings of the RTE.\n */\nvar IFrameSettings = /** @class */ (function (_super) {\n __extends(IFrameSettings, _super);\n function IFrameSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], IFrameSettings.prototype, \"enable\", void 0);\n __decorate([\n Property(null)\n ], IFrameSettings.prototype, \"attributes\", void 0);\n __decorate([\n Complex({}, Resources)\n ], IFrameSettings.prototype, \"resources\", void 0);\n return IFrameSettings;\n}(ChildProperty));\nexport { IFrameSettings };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty } from '@syncfusion/ej2-base';\n/**\n * Configures the inlineMode property of the RTE.\n */\nvar InlineMode = /** @class */ (function (_super) {\n __extends(InlineMode, _super);\n function InlineMode() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], InlineMode.prototype, \"enable\", void 0);\n __decorate([\n Property(true)\n ], InlineMode.prototype, \"onSelection\", void 0);\n return InlineMode;\n}(ChildProperty));\nexport { InlineMode };\n","import { Browser, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { getScrollableParent } from '@syncfusion/ej2-popups';\nimport * as events from '../base/constant';\nimport * as classes from '../base/classes';\nimport { addClass, removeClass } from '@syncfusion/ej2-base';\n/**\n * `FullScreen` module is used to maximize and minimize screen\n */\nvar FullScreen = /** @class */ (function () {\n function FullScreen(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n FullScreen.prototype.showFullScreen = function (event) {\n this.scrollableParent = getScrollableParent(this.parent.element);\n if (!this.parent.element.classList.contains(classes.CLS_FULL_SCREEN)) {\n this.parent.trigger(events.actionBegin, { requestType: 'Maximize', targetItem: 'Maximize', args: event });\n if (this.parent.toolbarSettings.enableFloating &&\n !this.parent.inlineMode.enable && this.parent.toolbarSettings.enable) {\n this.parent.getToolbarElement().style.width = '100%';\n this.parent.getToolbarElement().style.top = '0px';\n }\n this.parent.element.classList.add(classes.CLS_FULL_SCREEN);\n this.toggleParentOverflow(true);\n this.parent.setContentHeight();\n if (this.parent.toolbarModule) {\n if (!this.parent.getBaseToolbarObject().toolbarObj.items[0].properties) {\n this.parent.getBaseToolbarObject().toolbarObj.removeItems(0);\n }\n if (Browser.isDevice) {\n this.parent.toolbarModule.removeFixedTBarClass();\n }\n this.parent.toolbarModule.updateItem({\n targetItem: 'Maximize',\n updateItem: 'Minimize',\n baseToolbar: this.parent.getBaseToolbarObject()\n });\n }\n this.parent.trigger(events.actionComplete, { requestType: 'Maximize', targetItem: 'Maximize', args: event });\n }\n };\n FullScreen.prototype.hideFullScreen = function (event) {\n if (this.parent.element.classList.contains(classes.CLS_FULL_SCREEN)) {\n this.parent.element.classList.remove(classes.CLS_FULL_SCREEN);\n var elem = document.querySelectorAll('.e-rte-overflow');\n for (var i = 0; i < elem.length; i++) {\n removeClass([elem[i]], ['e-rte-overflow']);\n }\n this.parent.trigger(events.actionBegin, { requestType: 'Minimize', targetItem: 'Minimize', args: event });\n this.parent.setContentHeight();\n if (this.parent.toolbarModule) {\n if (!this.parent.getBaseToolbarObject().toolbarObj.items[0].properties) {\n this.parent.getBaseToolbarObject().toolbarObj.removeItems(0);\n }\n this.parent.toolbarModule.updateItem({\n targetItem: 'Minimize',\n updateItem: 'Maximize',\n baseToolbar: this.parent.getBaseToolbarObject()\n });\n if (Browser.isDevice && this.parent.inlineMode.enable) {\n this.parent.toolbarModule.addFixedTBarClass();\n }\n }\n this.parent.trigger(events.actionComplete, { requestType: 'Minimize', targetItem: 'Minimize', args: event });\n }\n };\n FullScreen.prototype.toggleParentOverflow = function (isAdd) {\n if (isNullOrUndefined(this.scrollableParent)) {\n return;\n }\n for (var i = 0; i < this.scrollableParent.length; i++) {\n if (this.scrollableParent[i].nodeName === '#document') {\n var elem = document.querySelector('body');\n addClass([elem], ['e-rte-overflow']);\n }\n else {\n var elem = this.scrollableParent[i];\n addClass([elem], ['e-rte-overflow']);\n }\n }\n };\n FullScreen.prototype.onKeyDown = function (event) {\n var originalEvent = event.args;\n switch (originalEvent.action) {\n case 'full-screen':\n this.showFullScreen(event.args);\n originalEvent.preventDefault();\n break;\n case 'escape':\n this.hideFullScreen(event.args);\n originalEvent.preventDefault();\n break;\n }\n };\n FullScreen.prototype.addEventListener = function () {\n this.parent.on(events.keyDown, this.onKeyDown, this);\n this.parent.on(events.destroy, this.destroy, this);\n };\n FullScreen.prototype.removeEventListener = function () {\n this.parent.on(events.keyDown, this.onKeyDown, this);\n this.parent.off(events.destroy, this.removeEventListener);\n };\n FullScreen.prototype.destroy = function () {\n if (this.parent.element.classList.contains(classes.CLS_FULL_SCREEN)) {\n this.toggleParentOverflow(false);\n }\n this.removeEventListener();\n };\n return FullScreen;\n}());\nexport { FullScreen };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, EventHandler, Complex, Browser, addClass, select, detach } from '@syncfusion/ej2-base';\nimport { Property, NotifyPropertyChanges, formatUnit, L10n, closest } from '@syncfusion/ej2-base';\nimport { setStyleAttribute, Event, removeClass, print as printWindow, attributes } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined as isNOU, compile, append, extend, debounce, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { getScrollableParent } from '@syncfusion/ej2-popups';\nimport * as events from '../base/constant';\nimport * as classes from '../base/classes';\nimport { Render } from '../renderer/render';\nimport { ViewSource } from '../renderer/view-source';\nimport { executeGroup } from './interface';\nimport { ServiceLocator } from '../services/service-locator';\nimport { RendererFactory } from '../services/renderer-factory';\nimport { RenderType, ToolbarType } from './enum';\nimport { ExecCommandCallBack } from '../actions/execute-command-callback';\nimport { KeyboardEvents } from '../actions/keyboard';\nimport { ToolbarSettings, ImageSettings, QuickToolbarSettings, FontFamily, FontSize, Format } from '../models/toolbar-settings';\nimport { TableSettings, PasteCleanupSettings } from '../models/toolbar-settings';\nimport { FontColor, BackgroundColor } from '../models/toolbar-settings';\nimport { IFrameSettings } from '../models/iframe-settings';\nimport { InlineMode } from '../models/inline-mode';\nimport { defaultLocale } from '../models/default-locale';\nimport { setAttributes } from '../actions/html-attributes';\nimport { FullScreen } from '../actions/full-screen';\nimport * as CONSTANT from '../../common/constant';\nimport { dispatchEvent } from '../base/util';\n/**\n * Represents the RichTextEditor component.\n * ```html\n * \n * \n * ```\n */\nvar RichTextEditor = /** @class */ (function (_super) {\n __extends(RichTextEditor, _super);\n function RichTextEditor(options, element) {\n var _this = _super.call(this, options, element) || this;\n /**\n * @hidden\n */\n _this.isFocusOut = false;\n /**\n * @hidden\n */\n _this.isRTE = false;\n /**\n * @hidden\n */\n _this.isBlur = true;\n _this.needsID = true;\n _this.onBlurHandler = _this.blurHandler.bind(_this);\n _this.onFocusHandler = _this.focusHandler.bind(_this);\n _this.onResizeHandler = _this.resizeHandler.bind(_this);\n return _this;\n }\n /**\n * To provide the array of modules needed for component rendering\n * @return {ModuleDeclaration[]}\n * @hidden\n */\n RichTextEditor.prototype.requiredModules = function () {\n var modules = [];\n if (this.toolbarSettings.enable) {\n modules.push({ member: 'toolbar', args: [this, this.serviceLocator] });\n modules.push({\n member: 'link',\n args: [this, this.serviceLocator]\n });\n modules.push({\n member: 'table',\n args: [this, this.serviceLocator]\n });\n modules.push({\n member: 'image',\n args: [this, this.serviceLocator]\n });\n if (this.quickToolbarSettings.enable) {\n modules.push({ member: 'quickToolbar', args: [this, this.serviceLocator] });\n }\n }\n if (this.showCharCount) {\n modules.push({ member: 'count', args: [this, this.serviceLocator] });\n }\n if (this.editorMode === 'Markdown') {\n modules.push({ member: 'markdownEditor', args: [this, this.serviceLocator] });\n }\n if (this.editorMode === 'HTML') {\n modules.push({ member: 'htmlEditor', args: [this, this.serviceLocator] });\n modules.push({ member: 'pasteCleanup', args: [this, this.serviceLocator] });\n }\n return modules;\n };\n RichTextEditor.prototype.updateEnable = function () {\n if (this.enabled) {\n removeClass([this.element], classes.CLS_DISABLED);\n this.element.tabIndex = 0;\n this.element.setAttribute('aria-disabled', 'false');\n this.inputElement.setAttribute('tabindex', '0');\n }\n else {\n if (this.getToolbar()) {\n removeClass(this.getToolbar().querySelectorAll('.' + classes.CLS_ACTIVE), classes.CLS_ACTIVE);\n }\n addClass([this.element], classes.CLS_DISABLED);\n this.element.tabIndex = -1;\n this.element.setAttribute('aria-disabled', 'true');\n this.inputElement.setAttribute('tabindex', '-1');\n }\n };\n RichTextEditor.prototype.setEnable = function () {\n this.updateEnable();\n (this.enabled) ? this.eventInitializer() : this.unWireEvents();\n };\n /**\n * For internal use only - Initialize the event handler;\n * @private\n */\n RichTextEditor.prototype.preRender = function () {\n this.clickPoints = { clientX: 0, clientY: 0 };\n this.initialValue = this.value;\n this.serviceLocator = new ServiceLocator;\n this.initializeServices();\n this.setContainer();\n setStyleAttribute(this.element, { 'width': formatUnit(this.width) });\n attributes(this.element, { role: 'application' });\n };\n RichTextEditor.prototype.setContainer = function () {\n this.originalElement = this.element.cloneNode(true);\n if (this.value === null || this.valueTemplate !== null) {\n this.setValue();\n }\n this.element.innerHTML = '';\n var invalidAttr = ['class', 'style', 'id', 'ejs-for'];\n var htmlAttr = {};\n for (var a = 0; a < this.element.attributes.length; a++) {\n if (invalidAttr.indexOf(this.element.attributes[a].name) === -1 &&\n !(/^data-val/.test(this.element.attributes[a].name))) { // data-val for asp.net core data annotation validation.\n htmlAttr[this.element.attributes[a].name] = this.element.getAttribute(this.element.attributes[a].name);\n }\n }\n extend(htmlAttr, this.htmlAttributes, htmlAttr);\n this.setProperties({ htmlAttributes: htmlAttr }, true);\n if (!isNOU(this.htmlAttributes.id)) {\n this.element.id = this.htmlAttributes.id;\n }\n if (this.element.tagName === 'TEXTAREA') {\n var rteOuterWrapper = this.createElement('div', {\n className: this.element.getAttribute('class')\n });\n this.element.innerHTML = '';\n this.element.parentElement.insertBefore(rteOuterWrapper, this.element);\n this.valueContainer = this.element;\n removeClass([this.valueContainer], this.element.getAttribute('class').split(' '));\n this.element = rteOuterWrapper;\n }\n else {\n this.valueContainer = this.createElement('textarea', {\n id: this.getID() + '-value'\n });\n }\n this.valueContainer.name = this.getID();\n addClass([this.valueContainer], classes.CLS_RTE_HIDDEN);\n this.element.appendChild(this.valueContainer);\n };\n RichTextEditor.prototype.getPersistData = function () {\n return this.addOnPersist(['value']);\n };\n /**\n * Focuses the RichTextEditor component\n * @public\n */\n RichTextEditor.prototype.focusIn = function () {\n if (this.enabled) {\n this.inputElement.focus();\n this.focusHandler({});\n }\n };\n /**\n * Blurs the RichTextEditor component\n * @public\n */\n RichTextEditor.prototype.focusOut = function () {\n if (this.enabled) {\n this.inputElement.blur();\n this.blurHandler({});\n }\n };\n /**\n * Selects all the content in RichTextEditor\n * @public\n */\n RichTextEditor.prototype.selectAll = function () {\n this.notify(events.selectAll, {});\n };\n /**\n * Selects a content range or an element\n * @public\n */\n RichTextEditor.prototype.selectRange = function (range) {\n this.notify(events.selectRange, { range: range });\n };\n /**\n * Retrieves the HTML markup content from currently selected content of RichTextEditor.\n * @public\n */\n RichTextEditor.prototype.getSelection = function () {\n var str = '';\n this.notify(events.getSelectedHtml, {\n callBack: function (txt) {\n str = txt;\n }\n });\n return str;\n };\n /**\n * Executes the commands\n * CommandName - Specifies the name of the command to be executed.\n * value - Specifies the sub command.\n * @public\n */\n RichTextEditor.prototype.executeCommand = function (commandName, value) {\n var tool = executeGroup[commandName];\n this.formatter.editorManager.execCommand(tool.command, tool.subCommand ? tool.subCommand : (value ? value : tool.value), null, null, (value ? value : tool.value), (value ? value : tool.value));\n };\n RichTextEditor.prototype.encode = function (value) {\n var divNode = this.createElement('div');\n divNode.innerText = value.trim();\n return divNode.innerHTML.replace(/
\\\n \\\n \\\n
',\n tooltipText: searchLocalText,\n align: 'Right', cssClass: 'e-search-wrapper'\n };\n this.createToolbar();\n }\n };\n Toolbar.prototype.createToolbar = function () {\n var items = this.getItems();\n this.toolbar = new NavToolbar({\n items: items,\n clicked: this.toolbarClickHandler.bind(this)\n });\n this.toolbar.appendTo(this.element);\n this.searchElement = this.element.querySelector('#' + this.parent.element.id + '_searchbar');\n if (this.parent.filterModule) {\n this.wireEvent();\n if (this.parent.searchSettings) {\n this.updateSearchTextBox();\n }\n }\n };\n Toolbar.prototype.wireEvent = function () {\n if (this.searchElement) {\n EventHandler.add(this.searchElement, 'keyup', this.keyUpHandler, this);\n EventHandler.add(this.searchElement, 'focus', this.focusHandler, this);\n EventHandler.add(this.searchElement, 'blur', this.blurHandler, this);\n }\n };\n Toolbar.prototype.unWireEvent = function () {\n if (this.searchElement) {\n EventHandler.remove(this.searchElement, 'keyup', this.keyUpHandler);\n EventHandler.remove(this.searchElement, 'focus', this.focusHandler);\n EventHandler.remove(this.searchElement, 'blur', this.blurHandler);\n }\n };\n Toolbar.prototype.keyUpHandler = function (e) {\n if (e.keyCode === 13 && this.parent.searchSettings.key !== this.searchElement.value) {\n this.parent.searchSettings.key = this.searchElement.value;\n this.parent.dataBind();\n }\n };\n Toolbar.prototype.focusHandler = function (e) {\n e.target.parentElement.classList.add('e-input-focus');\n };\n Toolbar.prototype.blurHandler = function (e) {\n e.target.parentElement.classList.remove('e-input-focus');\n };\n /**\n * Method to set value for search input box\n * @hidden\n */\n Toolbar.prototype.updateSearchTextBox = function () {\n if (this.searchElement && this.searchElement.value !== this.parent.searchSettings.key) {\n this.searchElement.value = this.parent.searchSettings.key;\n }\n };\n Toolbar.prototype.getItems = function () {\n var items = [];\n var toolbarItems = this.parent.toolbar || [];\n if (typeof (this.parent.toolbar) === 'string') {\n return [];\n }\n for (var _i = 0, toolbarItems_1 = toolbarItems; _i < toolbarItems_1.length; _i++) {\n var item = toolbarItems_1[_i];\n switch (typeof item) {\n case 'number':\n items.push(this.getItemObject(this.items[item]));\n break;\n case 'string':\n items.push(this.getItemObject(item));\n break;\n default:\n items.push(this.getItem(item));\n }\n }\n return items;\n };\n Toolbar.prototype.getItem = function (itemObject) {\n var item = this.predefinedItems[itemObject.text];\n return item ? extend(item, item, itemObject) : itemObject;\n };\n Toolbar.prototype.getItemObject = function (itemName) {\n return this.predefinedItems[itemName] || { text: itemName, id: this.id + '_' + itemName };\n };\n Toolbar.prototype.toolbarClickHandler = function (args) {\n var gObj = this.parent;\n var gID = this.id;\n extend(args, { cancel: false });\n gObj.trigger(events.toolbarClick, args);\n if (args.cancel) {\n return;\n }\n switch (!isNullOrUndefined(args.item) && args.item.id) {\n case gID + '_edit':\n if (gObj.editModule && gObj.editSettings.allowEditing) {\n gObj.editModule.dialogModule.openToolbarEditDialog();\n }\n break;\n case gID + '_update':\n gObj.editModule.cellEditModule.isCellEdit = false;\n gObj.treeGrid.endEdit();\n break;\n case gID + '_cancel':\n gObj.editModule.cellEditModule.isCellEdit = false;\n gObj.treeGrid.closeEdit();\n // console.log('Cancel editing');\n break;\n case gID + '_add':\n if (gObj.editModule && gObj.editSettings.allowAdding) {\n gObj.editModule.dialogModule.openAddDialog();\n }\n break;\n case gID + '_delete':\n if (this.parent.selectionModule && this.parent.editModule) {\n if ((this.parent.selectionSettings.mode === 'Row' && this.parent.selectionModule.selectedRowIndexes.length)\n || (this.parent.selectionSettings.mode === 'Cell' &&\n this.parent.selectionModule.getSelectedRowCellIndexes().length)) {\n this.parent.editModule.startDeleteAction();\n }\n }\n break;\n case gID + '_search':\n var searchButtonId = getValue('originalEvent.target.id', args);\n if (searchButtonId === this.parent.element.id + '_searchbutton' && this.parent.filterModule) {\n var keyVal = this.element.querySelector('#' + this.parent.element.id + '_searchbar').value;\n if (this.parent.searchSettings.key !== keyVal) {\n this.parent.searchSettings.key = keyVal;\n this.parent.dataBind();\n }\n }\n break;\n case gID + '_expandall':\n this.parent.ganttChartModule.expandCollapseAll('expand');\n break;\n case gID + '_collapseall':\n this.parent.ganttChartModule.expandCollapseAll('collapse');\n break;\n case gID + '_prevtimespan':\n this.parent.previousTimeSpan();\n break;\n case gID + '_nexttimespan':\n this.parent.nextTimeSpan();\n break;\n }\n };\n /**\n * To refresh toolbar items bases current state of tasks\n */\n Toolbar.prototype.refreshToolbarItems = function () {\n var gObj = this.parent;\n var enableItems = [];\n var disableItems = [];\n var edit = gObj.editSettings;\n var gID = this.id;\n var isSelected = gObj.selectionModule ? gObj.selectionModule.selectedRowIndexes.length === 1 ||\n gObj.selectionModule.getSelectedRowCellIndexes().length === 1 ? true : false : false;\n var toolbarItems = this.toolbar.items;\n var toolbarDefaultItems = [gID + '_add', gID + '_edit', gID + '_delete',\n gID + '_update', gID + '_cancel'];\n if (!isNullOrUndefined(this.parent.editModule)) {\n var hasData = gObj.currentViewData && gObj.currentViewData.length;\n edit.allowAdding ? enableItems.push(gID + '_add') : disableItems.push(gID + '_add');\n edit.allowEditing && hasData && isSelected ? enableItems.push(gID + '_edit') : disableItems.push(gID + '_edit');\n var isDeleteSelected = gObj.selectionModule ? gObj.selectionModule.selectedRowIndexes.length > 0 ||\n gObj.selectionModule.getSelectedRowCellIndexes().length > 0 ? true : false : false;\n edit.allowDeleting && hasData && isDeleteSelected ? enableItems.push(gID + '_delete') : disableItems.push(gID + '_delete');\n if (gObj.editSettings.mode === 'Auto' && !isNullOrUndefined(gObj.editModule.cellEditModule)\n && gObj.editModule.cellEditModule.isCellEdit) {\n // New initialization for enableItems and disableItems during isCellEdit\n enableItems = [];\n enableItems.push(gID + '_update', gID + '_cancel');\n disableItems = [];\n for (var t = 0; t < toolbarItems.length; t++) {\n if (toolbarItems[t].id !== gID + '_update' && toolbarItems[t].id !== gID + '_cancel' &&\n toolbarDefaultItems.indexOf(toolbarItems[t].id) !== -1) {\n disableItems.push(toolbarItems[t].id);\n }\n }\n }\n else {\n disableItems.push(gID + '_update', gID + '_cancel');\n for (var t = 0; t < toolbarItems.length; t++) {\n if (enableItems.indexOf(toolbarItems[t].id) === -1 && disableItems.indexOf(toolbarItems[t].id) === -1) {\n enableItems.push(toolbarItems[t].id);\n }\n }\n }\n }\n else {\n disableItems.push(gID + '_delete');\n disableItems.push(gID + '_add');\n disableItems.push(gID + '_edit');\n disableItems.push(gID + '_update');\n disableItems.push(gID + '_cancel');\n }\n for (var e = 0; e < enableItems.length; e++) {\n var index = void 0;\n for (var t = 0; t < toolbarItems.length; t++) {\n if (toolbarItems[t].id === enableItems[e]) {\n index = t;\n break;\n }\n }\n this.toolbar.hideItem(index, false);\n }\n for (var d = 0; d < disableItems.length; d++) {\n var index = void 0;\n for (var t = 0; t < toolbarItems.length; t++) {\n if (toolbarItems[t].id === disableItems[d]) {\n index = t;\n break;\n }\n }\n this.toolbar.hideItem(index, true);\n }\n };\n /**\n * Enables or disables ToolBar items.\n * @param {string[]} items - Defines the collection of itemID of ToolBar items.\n * @param {boolean} isEnable - Defines the items to be enabled or disabled.\n * @return {void}\n * @hidden\n */\n Toolbar.prototype.enableItems = function (items, isEnable) {\n for (var _i = 0, items_1 = items; _i < items_1.length; _i++) {\n var item = items_1[_i];\n var element = this.element.querySelector('#' + item);\n if (element) {\n this.toolbar.enableItems(element.parentElement, isEnable);\n }\n }\n };\n /**\n * Destroys the Sorting of TreeGrid.\n * @method destroy\n * @return {void}\n * @private\n */\n Toolbar.prototype.destroy = function () {\n this.searchElement = null;\n if (this.parent.isDestroyed) {\n return;\n }\n this.toolbar.destroy();\n if (this.parent.filterModule) {\n this.unWireEvent();\n }\n remove(this.element);\n };\n return Toolbar;\n}());\nexport { Toolbar };\n","import { createElement, formatUnit, remove } from '@syncfusion/ej2-base';\nimport * as cls from '../base/css-constants';\nvar NonWorkingDay = /** @class */ (function () {\n function NonWorkingDay(gantt) {\n this.parent = gantt;\n this.nonworkingContainer = null;\n this.holidayContainer = null;\n this.weekendContainer = null;\n }\n /**\n * Method append nonworking container\n */\n NonWorkingDay.prototype.createNonworkingContainer = function () {\n if (!this.parent.ganttChartModule.chartBodyContent.contains(this.nonworkingContainer)) {\n this.nonworkingContainer = createElement('div', {\n className: cls.nonworkingContainer\n });\n this.parent.ganttChartModule.chartBodyContent.appendChild(this.nonworkingContainer);\n }\n };\n /**\n * calculation for holidays rendering.\n * @private\n */\n NonWorkingDay.prototype.renderHolidays = function () {\n if (this.parent.holidays && this.parent.holidays.length > 0) {\n this.createNonworkingContainer();\n if (!this.nonworkingContainer.contains(this.holidayContainer)) {\n this.holidayContainer = createElement('div', {\n className: cls.holidayContainer\n });\n this.nonworkingContainer.appendChild(this.holidayContainer);\n }\n this.holidayContainer.innerHTML = this.getHolidaysElement().innerHTML;\n }\n else if (this.holidayContainer) {\n remove(this.holidayContainer);\n if (this.nonworkingContainer && this.nonworkingContainer.childNodes.length === 0) {\n remove(this.nonworkingContainer);\n }\n }\n };\n /**\n * Method to return holidays as html string\n */\n NonWorkingDay.prototype.getHolidaysElement = function () {\n var fromDate;\n var toDate;\n var container = createElement('div');\n var height = this.parent.contentHeight;\n var scrollElement = this.parent.ganttChartModule.scrollElement;\n var viewportHeight = parseInt(scrollElement.style.height, 10);\n for (var i = 0; i < this.parent.holidays.length; i++) {\n if (this.parent.holidays[i].from && this.parent.holidays[i].to) {\n fromDate = this.parent.dateValidationModule.getDateFromFormat(this.parent.holidays[i].from);\n toDate = this.parent.dateValidationModule.getDateFromFormat(this.parent.holidays[i].to);\n toDate.setDate(toDate.getDate() + 1);\n fromDate.setHours(0, 0, 0, 0);\n toDate.setHours(0, 0, 0, 0);\n }\n else if (this.parent.holidays[i].from) {\n fromDate = this.parent.dateValidationModule.getDateFromFormat(this.parent.holidays[i].from);\n fromDate.setHours(0, 0, 0, 0);\n }\n else if (this.parent.holidays[i].to) {\n fromDate = this.parent.dateValidationModule.getDateFromFormat(this.parent.holidays[i].to);\n fromDate.setHours(0, 0, 0, 0);\n }\n var width = (this.parent.holidays[i].from && this.parent.holidays[i].to) ?\n this.parent.dataOperation.getTaskWidth(fromDate, toDate) : this.parent.perDayWidth;\n var left = this.parent.dataOperation.getTaskLeft(fromDate, false);\n var holidayDiv = createElement('div', {\n className: cls.holidayElement, styles: \"left:\" + left + \"px; width:\" + width + \"px; height:100%;\"\n });\n var spanTop = (viewportHeight < height) ? viewportHeight / 2 : height / 2;\n var spanElement = createElement('span', {\n className: cls.holidayLabel, innerHTML: this.parent.holidays[i].label ? \"\" + this.parent.holidays[i].label : '',\n styles: \"top:\" + spanTop + \"px;left:\" + (width / 2) + \"px;\"\n });\n holidayDiv.appendChild(spanElement);\n if (this.parent.holidays[i].cssClass) {\n holidayDiv.classList.add(this.parent.holidays[i].cssClass);\n }\n container.appendChild(holidayDiv);\n }\n return container;\n };\n /**\n * @private\n */\n NonWorkingDay.prototype.renderWeekends = function () {\n if (this.parent.highlightWeekends) {\n this.createNonworkingContainer();\n if (!this.nonworkingContainer.contains(this.weekendContainer)) {\n this.weekendContainer = createElement('div', {\n className: cls.weekendContainer\n });\n this.nonworkingContainer.appendChild(this.weekendContainer);\n }\n this.weekendContainer.innerHTML = this.getWeekendElements().innerHTML;\n }\n else if (this.weekendContainer) {\n remove(this.weekendContainer);\n if (this.nonworkingContainer && this.nonworkingContainer.childNodes.length === 0) {\n remove(this.nonworkingContainer);\n }\n }\n };\n /**\n * Method to get weekend html string\n */\n NonWorkingDay.prototype.getWeekendElements = function () {\n var container = createElement('div');\n var startDate = new Date(this.parent.timelineModule.timelineStartDate.getTime());\n var endDate = new Date(this.parent.timelineModule.timelineEndDate.getTime());\n var nonWorkingIndex = this.parent.nonWorkingDayIndex;\n var isFirstCell = true;\n do {\n if (nonWorkingIndex.indexOf(startDate.getDay()) !== -1) {\n var left = this.parent.dataOperation.getTaskLeft(startDate, false);\n var width = this.parent.perDayWidth;\n if (isFirstCell) {\n var start = new Date(startDate.getTime());\n var tempEnd = new Date(start.getTime());\n tempEnd.setDate(tempEnd.getDate() + 1);\n tempEnd.setHours(0, 0, 0, 0);\n width = this.parent.dataOperation.getTaskWidth(start, tempEnd);\n isFirstCell = false;\n }\n var weekendDiv = createElement('div', {\n className: cls.weekend, styles: \"left:\" + left + \"px;width:\" + width + \"px;height:100%;\"\n });\n container.appendChild(weekendDiv);\n }\n startDate.setDate(startDate.getDate() + 1);\n startDate.setHours(0, 0, 0, 0);\n } while (startDate < endDate);\n return container;\n };\n NonWorkingDay.prototype.updateHolidayLabelHeight = function () {\n var height = this.parent.contentHeight;\n var scrollElement = this.parent.ganttChartModule.scrollElement;\n var viewportHeight = parseInt(scrollElement.style.height, 10);\n var top = (viewportHeight < height) ? viewportHeight / 2 : height / 2;\n var labels = this.holidayContainer.querySelectorAll('.' + cls.holidayLabel);\n labels.forEach(function (element) {\n element.style.top = formatUnit(top);\n });\n };\n /**\n * Method to update height for all internal containers\n * @private\n */\n NonWorkingDay.prototype.updateContainerHeight = function () {\n if (this.holidayContainer) {\n this.holidayContainer.style.height = formatUnit(this.parent.contentHeight);\n this.updateHolidayLabelHeight();\n }\n if (this.weekendContainer) {\n this.weekendContainer.style.height = formatUnit(this.parent.contentHeight);\n }\n };\n /**\n * Method to remove containers of holiday and weekend\n */\n NonWorkingDay.prototype.removeContainers = function () {\n if (this.holidayContainer) {\n remove(this.holidayContainer);\n }\n if (this.weekendContainer) {\n remove(this.weekendContainer);\n }\n if (this.nonworkingContainer) {\n remove(this.nonworkingContainer);\n }\n };\n return NonWorkingDay;\n}());\nexport { NonWorkingDay };\n","import { createElement, formatUnit, remove } from '@syncfusion/ej2-base';\nimport * as cls from '../base/css-constants';\nvar EventMarker = /** @class */ (function () {\n function EventMarker(gantt) {\n this.parent = gantt;\n this.eventMarkersContainer = null;\n }\n /**\n * @private\n */\n EventMarker.prototype.renderEventMarkers = function () {\n if (this.parent.eventMarkers && this.parent.eventMarkers.length > 0) {\n if (!this.parent.ganttChartModule.chartBodyContent.contains(this.eventMarkersContainer)) {\n this.eventMarkersContainer = createElement('div', {\n className: cls.eventMarkersContainer\n });\n this.parent.ganttChartModule.chartBodyContent.appendChild(this.eventMarkersContainer);\n }\n this.eventMarkersContainer.innerHTML = '';\n this.getEventMarkersElements(this.eventMarkersContainer);\n }\n else if (this.eventMarkersContainer) {\n remove(this.eventMarkersContainer);\n }\n };\n /**\n * @private\n */\n EventMarker.prototype.removeContainer = function () {\n if (this.eventMarkersContainer) {\n remove(this.eventMarkersContainer);\n }\n };\n /**\n * Method to get event markers as html string\n */\n EventMarker.prototype.getEventMarkersElements = function (container) {\n var left;\n var eventMarkerElement;\n var spanElement;\n var rightArrow;\n for (var i = 0; i < this.parent.eventMarkers.length; i++) {\n left = this.parent.dataOperation.getTaskLeft(this.parent.dateValidationModule.getDateFromFormat(this.parent.eventMarkers[i].day), false);\n eventMarkerElement = createElement('div', {\n className: cls.eventMarkersChild, styles: \"left:\" + left + \"px; height:100%;\",\n id: 'stripline' + i\n });\n if (this.parent.eventMarkers[i].label) {\n spanElement = createElement('div', {\n className: cls.eventMarkersSpan, innerHTML: \"\" + this.parent.eventMarkers[i].label\n });\n eventMarkerElement.appendChild(spanElement);\n rightArrow = createElement('div', {\n className: 'e-gantt-right-arrow'\n });\n eventMarkerElement.appendChild(rightArrow);\n }\n if (this.parent.eventMarkers[i].cssClass) {\n eventMarkerElement.classList.add(this.parent.eventMarkers[i].cssClass);\n }\n container.appendChild(eventMarkerElement);\n }\n };\n /**\n * @private\n */\n EventMarker.prototype.updateContainerHeight = function () {\n if (this.eventMarkersContainer) {\n this.eventMarkersContainer.style.height = formatUnit(this.parent.contentHeight);\n }\n };\n return EventMarker;\n}());\nexport { EventMarker };\n","import { NonWorkingDay } from '../renderer/nonworking-day';\nimport { EventMarker } from '../renderer/event-marker';\nimport { getValue } from '@syncfusion/ej2-base';\n/**\n *\n */\nvar DayMarkers = /** @class */ (function () {\n function DayMarkers(parent) {\n this.parent = parent;\n this.nonworkingDayRender = new NonWorkingDay(this.parent);\n this.eventMarkerRender = new EventMarker(this.parent);\n this.wireEvents();\n }\n DayMarkers.prototype.wireEvents = function () {\n this.parent.on('refreshDayMarkers', this.refreshMarkers, this);\n this.parent.on('updateHeight', this.updateHeight, this);\n this.parent.on('ui-update', this.propertyChanged, this);\n };\n DayMarkers.prototype.propertyChanged = function (property) {\n var keys = Object.keys(getValue('properties', property));\n for (var i = 0; i < keys.length; i++) {\n var key = keys[i];\n switch (key) {\n case 'eventMarkers':\n this.eventMarkerRender.renderEventMarkers();\n break;\n case 'highlightWeekends':\n this.nonworkingDayRender.renderWeekends();\n break;\n case 'holidays':\n this.nonworkingDayRender.renderHolidays();\n break;\n }\n }\n };\n DayMarkers.prototype.refreshMarkers = function () {\n this.eventMarkerRender.renderEventMarkers();\n this.nonworkingDayRender.renderWeekends();\n this.nonworkingDayRender.renderHolidays();\n };\n DayMarkers.prototype.updateHeight = function () {\n this.nonworkingDayRender.updateContainerHeight();\n this.eventMarkerRender.updateContainerHeight();\n };\n /**\n * @private\n */\n DayMarkers.prototype.getModuleName = function () {\n return 'dayMarkers';\n };\n /**\n * @private\n */\n DayMarkers.prototype.destroy = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.nonworkingDayRender.removeContainers();\n this.eventMarkerRender.removeContainer();\n this.parent.off('refreshDayMarkers', this.refreshMarkers);\n this.parent.off('updateHeight', this.updateHeight);\n this.parent.off('ui-update', this.propertyChanged);\n };\n return DayMarkers;\n}());\nexport { DayMarkers };\n","import * as index from '@syncfusion/ej2-gantt';\nindex.Gantt.Inject( index.Filter,index.Selection,index.Sort,index.Reorder,index.Resize,index.Edit,index.DayMarkers,index.Toolbar);\nexport * from '@syncfusion/ej2-gantt';\n","import * as index from '@syncfusion/ej2-grids';\nindex.Grid.Inject( index.Filter,index.Page,index.Selection,index.Sort,index.Group,index.Reorder,index.RowDD,index.DetailRow,index.Toolbar,index.Aggregate,index.Search,index.VirtualScroll,index.Edit,index.Resize,index.ExcelExport,index.PdfExport,index.CommandColumn,index.ContextMenu,index.Freeze,index.ColumnMenu,index.ColumnChooser,index.ForeignKey);\nexport * from '@syncfusion/ej2-grids';\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty, Complex, Collection } from '@syncfusion/ej2-base';\nimport { Theme } from './theme';\n/**\n * Configures the fonts in heat map.\n */\nvar Font = /** @class */ (function (_super) {\n __extends(Font, _super);\n function Font() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('16px')\n ], Font.prototype, \"size\", void 0);\n __decorate([\n Property('')\n ], Font.prototype, \"color\", void 0);\n __decorate([\n Property('Segoe UI')\n ], Font.prototype, \"fontFamily\", void 0);\n __decorate([\n Property('Normal')\n ], Font.prototype, \"fontWeight\", void 0);\n __decorate([\n Property('Normal')\n ], Font.prototype, \"fontStyle\", void 0);\n __decorate([\n Property('Center')\n ], Font.prototype, \"textAlignment\", void 0);\n __decorate([\n Property('Trim')\n ], Font.prototype, \"textOverflow\", void 0);\n return Font;\n}(ChildProperty));\nexport { Font };\n/**\n * Configures the heat map margins.\n */\nvar Margin = /** @class */ (function (_super) {\n __extends(Margin, _super);\n function Margin() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(10)\n ], Margin.prototype, \"left\", void 0);\n __decorate([\n Property(10)\n ], Margin.prototype, \"right\", void 0);\n __decorate([\n Property(10)\n ], Margin.prototype, \"top\", void 0);\n __decorate([\n Property(10)\n ], Margin.prototype, \"bottom\", void 0);\n return Margin;\n}(ChildProperty));\nexport { Margin };\n/**\n * Configures the borders in the heat map.\n */\nvar Border = /** @class */ (function (_super) {\n __extends(Border, _super);\n function Border() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], Border.prototype, \"color\", void 0);\n __decorate([\n Property(1)\n ], Border.prototype, \"width\", void 0);\n __decorate([\n Property('')\n ], Border.prototype, \"radius\", void 0);\n return Border;\n}(ChildProperty));\nexport { Border };\n/**\n * Configures the tooltip borders in the heat map.\n */\nvar TooltipBorder = /** @class */ (function (_super) {\n __extends(TooltipBorder, _super);\n function TooltipBorder() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], TooltipBorder.prototype, \"color\", void 0);\n __decorate([\n Property(0)\n ], TooltipBorder.prototype, \"width\", void 0);\n return TooltipBorder;\n}(ChildProperty));\nexport { TooltipBorder };\n/**\n * Configures the mapping name for size and color in SizeAndColor type.\n */\nvar BubbleData = /** @class */ (function (_super) {\n __extends(BubbleData, _super);\n function BubbleData() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], BubbleData.prototype, \"size\", void 0);\n __decorate([\n Property(null)\n ], BubbleData.prototype, \"color\", void 0);\n return BubbleData;\n}(ChildProperty));\nexport { BubbleData };\n/**\n * class used to maintain Title styles.\n */\nvar Title = /** @class */ (function (_super) {\n __extends(Title, _super);\n function Title() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], Title.prototype, \"text\", void 0);\n __decorate([\n Complex({}, Font)\n ], Title.prototype, \"textStyle\", void 0);\n return Title;\n}(ChildProperty));\nexport { Title };\n/**\n * class used to maintain palette information.\n */\nvar PaletteCollection = /** @class */ (function (_super) {\n __extends(PaletteCollection, _super);\n function PaletteCollection() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], PaletteCollection.prototype, \"value\", void 0);\n __decorate([\n Property(null)\n ], PaletteCollection.prototype, \"color\", void 0);\n __decorate([\n Property(null)\n ], PaletteCollection.prototype, \"label\", void 0);\n return PaletteCollection;\n}(ChildProperty));\nexport { PaletteCollection };\n/**\n * label border properties.\n */\nvar AxisLabelBorder = /** @class */ (function (_super) {\n __extends(AxisLabelBorder, _super);\n function AxisLabelBorder() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('#b5b5b5')\n ], AxisLabelBorder.prototype, \"color\", void 0);\n __decorate([\n Property(1)\n ], AxisLabelBorder.prototype, \"width\", void 0);\n __decorate([\n Property('Rectangle')\n ], AxisLabelBorder.prototype, \"type\", void 0);\n return AxisLabelBorder;\n}(ChildProperty));\nexport { AxisLabelBorder };\nvar BubbleSize = /** @class */ (function (_super) {\n __extends(BubbleSize, _super);\n function BubbleSize() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('0%')\n ], BubbleSize.prototype, \"minimum\", void 0);\n __decorate([\n Property('100%')\n ], BubbleSize.prototype, \"maximum\", void 0);\n return BubbleSize;\n}(ChildProperty));\nexport { BubbleSize };\n/**\n * categories for multi level labels\n */\nvar MultiLevelCategories = /** @class */ (function (_super) {\n __extends(MultiLevelCategories, _super);\n function MultiLevelCategories() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], MultiLevelCategories.prototype, \"start\", void 0);\n __decorate([\n Property(null)\n ], MultiLevelCategories.prototype, \"end\", void 0);\n __decorate([\n Property('')\n ], MultiLevelCategories.prototype, \"text\", void 0);\n __decorate([\n Property(null)\n ], MultiLevelCategories.prototype, \"maximumTextWidth\", void 0);\n return MultiLevelCategories;\n}(ChildProperty));\nexport { MultiLevelCategories };\n/**\n * MultiLevelLabels properties\n */\nvar MultiLevelLabels = /** @class */ (function (_super) {\n __extends(MultiLevelLabels, _super);\n function MultiLevelLabels() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Center')\n ], MultiLevelLabels.prototype, \"alignment\", void 0);\n __decorate([\n Property('Wrap')\n ], MultiLevelLabels.prototype, \"overflow\", void 0);\n __decorate([\n Complex(Theme.axisLabelFont, Font)\n ], MultiLevelLabels.prototype, \"textStyle\", void 0);\n __decorate([\n Complex({ color: '#b5b5b5', width: 1, type: 'Rectangle' }, AxisLabelBorder)\n ], MultiLevelLabels.prototype, \"border\", void 0);\n __decorate([\n Collection([], MultiLevelCategories)\n ], MultiLevelLabels.prototype, \"categories\", void 0);\n return MultiLevelLabels;\n}(ChildProperty));\nexport { MultiLevelLabels };\n/**\n * Internal class used to maintain colorcollection.\n */\nvar ColorCollection = /** @class */ (function () {\n function ColorCollection(value, color, label) {\n this.value = value;\n this.color = color;\n this.label = label;\n }\n return ColorCollection;\n}());\nexport { ColorCollection };\n/**\n * class used to maintain color and value collection.\n */\nvar BubbleTooltipData = /** @class */ (function () {\n function BubbleTooltipData(mappingName, bubbleData, valueType) {\n this.mappingName = mappingName;\n this.bubbleData = bubbleData;\n this.valueType = valueType;\n }\n return BubbleTooltipData;\n}());\nexport { BubbleTooltipData };\n/**\n * Internal class used to maintain legend colorcollection.\n */\nvar LegendColorCollection = /** @class */ (function () {\n function LegendColorCollection(value, color, label, isHidden) {\n this.value = value;\n this.color = color;\n this.label = label;\n this.isHidden = isHidden;\n }\n return LegendColorCollection;\n}());\nexport { LegendColorCollection };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, extend, ChildProperty, Collection, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { ColorCollection, LegendColorCollection, PaletteCollection } from '../model/base';\nimport { PaletterColor } from './helper';\n/**\n * Configures the color property in Heatmap.\n */\nvar PaletteSettings = /** @class */ (function (_super) {\n __extends(PaletteSettings, _super);\n function PaletteSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Collection([{}], PaletteCollection)\n ], PaletteSettings.prototype, \"palette\", void 0);\n __decorate([\n Property('Gradient')\n ], PaletteSettings.prototype, \"type\", void 0);\n __decorate([\n Property('')\n ], PaletteSettings.prototype, \"emptyPointColor\", void 0);\n return PaletteSettings;\n}(ChildProperty));\nexport { PaletteSettings };\n/**\n * Helper class for colormapping\n */\nvar RgbColor = /** @class */ (function () {\n function RgbColor(r, g, b) {\n this.R = r;\n this.G = g;\n this.B = b;\n }\n return RgbColor;\n}());\nexport { RgbColor };\nvar CellColor = /** @class */ (function () {\n function CellColor(heatMap) {\n this.heatMap = heatMap;\n }\n /**\n * To convert hexa color to RGB.\n * @return {RGB}\n * @private\n */\n CellColor.prototype.convertToRGB = function (value, colorMapping) {\n var previousOffset = colorMapping[0].value;\n var nextOffset = 0;\n for (var i = 1; i < colorMapping.length; i++) {\n var offset = Number(colorMapping[i].value);\n if (value <= offset) {\n nextOffset = offset;\n break;\n }\n else {\n nextOffset = offset;\n previousOffset = offset;\n }\n }\n var percent = 0;\n var full = nextOffset - previousOffset;\n percent = (value - previousOffset) / full;\n percent = isNaN(percent) ? 0 : percent;\n var previousColor = this.getEqualColor(colorMapping, previousOffset);\n var nextColor = this.getEqualColor(colorMapping, nextOffset);\n return this.getPercentageColor(percent, previousColor, nextColor);\n };\n /**\n * To convert RGB to HEX.\n * @return {string}\n * @private\n */\n CellColor.prototype.rgbToHex = function (r, g, b) {\n return '#' + this.componentToHex(r) + this.componentToHex(g) + this.componentToHex(b);\n };\n /**\n * To convert Component to HEX.\n * @return {string}\n * @private\n */\n CellColor.prototype.componentToHex = function (c) {\n var hex = c.toString(16);\n return hex.length === 1 ? '0' + hex : hex;\n };\n /**\n * To get similar color.\n * @return {string}\n * @private\n */\n CellColor.prototype.getEqualColor = function (list, offset) {\n for (var i = 0; i < list.length; i++) {\n if (Number(list[i].value) === offset) {\n var color = list[i].color;\n if (color.indexOf('rgb') !== -1) {\n color = this.convertToHex(color);\n }\n else if (color.indexOf('#') === -1) {\n color = '#FFFFFF';\n }\n return color;\n }\n }\n return '#00000';\n };\n /**\n * To convert RGB to HEX.\n * @return {string}\n * @private\n */\n CellColor.prototype.convertToHex = function (color) {\n var itemColor = color.substr(3);\n itemColor = itemColor.split('(')[1].split(')')[0];\n var colorSplit = itemColor.split(',');\n itemColor = this.rgbToHex(parseInt(colorSplit[0], 10), parseInt(colorSplit[1], 10), parseInt(colorSplit[2], 10));\n return itemColor;\n };\n /**\n * To get RGB for percentage value.\n * @return {RGB}\n * @private\n */\n CellColor.prototype.getPercentageColor = function (percent, previous, next) {\n var nextColor = next.split('#')[1];\n var prevColor = previous.split('#')[1];\n var r = this.getPercentage(percent, parseInt(prevColor.substr(0, 2), 16), parseInt(nextColor.substr(0, 2), 16));\n var g = this.getPercentage(percent, parseInt(prevColor.substr(2, 2), 16), parseInt(nextColor.substr(2, 2), 16));\n var b = this.getPercentage(percent, parseInt(prevColor.substr(4, 2), 16), parseInt(nextColor.substr(4, 2), 16));\n return new RgbColor(r, g, b);\n };\n /**\n * To convert numbet to percentage.\n * @return {RGB}\n * @private\n */\n CellColor.prototype.getPercentage = function (percent, previous, next) {\n var full = next - previous;\n return Math.round((previous + (full * percent)));\n };\n /**\n * To get complete color Collection.\n * @private\n */\n CellColor.prototype.getColorCollection = function () {\n var heatMap = this.heatMap;\n heatMap.colorCollection = [];\n heatMap.legendColorCollection = [];\n var range;\n var minValue = heatMap.bubbleSizeWithColor ? heatMap.minColorValue : heatMap.dataSourceMinValue;\n var maxValue = heatMap.bubbleSizeWithColor ? heatMap.maxColorValue : heatMap.dataSourceMaxValue;\n heatMap.emptyPointColor = heatMap.paletteSettings.emptyPointColor ? heatMap.paletteSettings.emptyPointColor :\n heatMap.themeStyle.emptyCellColor;\n var tempcolorMapping = this.orderbyOffset(heatMap.paletteSettings.palette && heatMap.paletteSettings.palette.length > 1 ?\n heatMap.paletteSettings.palette : heatMap.themeStyle.palette);\n if (!tempcolorMapping.isCompact) {\n if (heatMap.paletteSettings.type === 'Gradient') {\n range = (maxValue - minValue) / (tempcolorMapping.offsets.length - 1);\n }\n else {\n range = (maxValue - minValue) / (tempcolorMapping.offsets.length);\n }\n if (tempcolorMapping.offsets.length >= 2) {\n for (var index = 0; index < tempcolorMapping.offsets.length; index++) {\n heatMap.colorCollection.push(new ColorCollection(Math.round(((minValue) + (index * range)) * 100) / 100, tempcolorMapping.offsets[index].color, tempcolorMapping.offsets[index].label));\n heatMap.legendColorCollection.push(new LegendColorCollection(Math.round(((minValue) + (index * range)) * 100) / 100, tempcolorMapping.offsets[index].color, tempcolorMapping.offsets[index].label, false));\n }\n }\n }\n else {\n heatMap.colorCollection = tempcolorMapping.offsets;\n heatMap.legendColorCollection = extend([], tempcolorMapping.offsets, null, true);\n }\n this.updateLegendColorCollection(minValue, maxValue, tempcolorMapping);\n };\n /**\n * To update legend color Collection.\n * @private\n */\n CellColor.prototype.updateLegendColorCollection = function (minValue, maxValue, tempcolorMapping) {\n if (this.heatMap.paletteSettings.type === 'Fixed' && (tempcolorMapping.isCompact || tempcolorMapping.isLabel)) {\n return;\n }\n if (minValue < this.heatMap.legendColorCollection[0].value) {\n this.heatMap.legendColorCollection.unshift(new LegendColorCollection(minValue, this.heatMap.legendColorCollection[0].color, this.heatMap.legendColorCollection[0].label, true));\n }\n if (maxValue > this.heatMap.legendColorCollection[this.heatMap.legendColorCollection.length - 1].value) {\n this.heatMap.legendColorCollection.push(new LegendColorCollection(maxValue, this.heatMap.legendColorCollection[this.heatMap.legendColorCollection.length - 1].color, this.heatMap.legendColorCollection[this.heatMap.legendColorCollection.length - 1].label, true));\n }\n };\n /**\n * To get ordered palette color collection.\n * @private\n */\n CellColor.prototype.orderbyOffset = function (offsets) {\n var returnCollection = new PaletterColor();\n var key = 'value';\n var label = 'label';\n returnCollection.isCompact = true;\n returnCollection.isLabel = true;\n // tslint:disable-next-line:no-any \n returnCollection.offsets = offsets.sort(function (a, b) {\n if (isNullOrUndefined(a[label]) && isNullOrUndefined(b[label])) {\n returnCollection.isLabel = false;\n }\n if (!isNullOrUndefined(a[key]) && !isNullOrUndefined(b[key])) {\n return a[key] - b[key];\n }\n else {\n returnCollection.isCompact = false;\n return a;\n }\n });\n if (!returnCollection.isCompact) {\n returnCollection.offsets = this.heatMap.paletteSettings.palette && this.heatMap.paletteSettings.palette.length > 1 ?\n this.heatMap.paletteSettings.palette : this.heatMap.themeStyle.palette;\n }\n return returnCollection;\n };\n /**\n * To get color depends to value.\n * @private\n */\n CellColor.prototype.getColorByValue = function (text) {\n var color = '';\n var rbg;\n var compareValue = 0;\n if (text.toString() !== '') {\n if (this.heatMap.cellSettings.tileType === 'Bubble' &&\n (this.heatMap.cellSettings.bubbleType === 'Size' || this.heatMap.cellSettings.bubbleType === 'Sector')) {\n color = this.heatMap.colorCollection[0].color;\n }\n else if (this.heatMap.paletteSettings.type === 'Fixed') {\n for (var y = 0; y < this.heatMap.colorCollection.length; y++) {\n compareValue = this.heatMap.colorCollection[y + 1] ? this.heatMap.colorCollection[y + 1].value :\n this.heatMap.colorCollection[y].value;\n var singleValue = this.heatMap.dataSourceMinValue === this.heatMap.dataSourceMaxValue;\n if ((text <= compareValue && y === 0 && singleValue) || text < compareValue ||\n (text >= compareValue && y === this.heatMap.colorCollection.length - 1)) {\n var legendRange = void 0;\n if (this.heatMap.legendVisibilityByCellType) {\n legendRange = this.heatMap.legendModule.legendRange;\n }\n color = (this.heatMap.legendVisibilityByCellType && legendRange[y] && !legendRange[y].visible) ?\n this.heatMap.themeStyle.toggledColor : this.heatMap.colorCollection[y].color;\n break;\n }\n }\n }\n else {\n if (text < this.heatMap.colorCollection[0].value) {\n color = this.heatMap.colorCollection[0].color;\n }\n else if (text > this.heatMap.colorCollection[this.heatMap.colorCollection.length - 1].value) {\n color = this.heatMap.colorCollection[this.heatMap.colorCollection.length - 1].color;\n }\n else {\n rbg = this.convertToRGB(text, this.heatMap.colorCollection);\n color = this.rgbToHex(rbg.R, rbg.G, rbg.B);\n }\n }\n }\n else {\n color = this.heatMap.emptyPointColor;\n }\n return color;\n };\n return CellColor;\n}());\nexport { CellColor };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n/**\n * HeatMap Axis file\n */\nimport { Property, Complex, ChildProperty, isNullOrUndefined, Collection } from '@syncfusion/ej2-base';\nimport { DataUtil } from '@syncfusion/ej2-data';\nimport { Font, Title, AxisLabelBorder, MultiLevelLabels } from '../model/base';\nimport { Theme } from '../model/theme';\nimport { Rect, measureText, Size, rotateTextSize, increaseDateTimeInterval, formatValue } from '../utils/helper';\nimport { MultiLevelPosition, textWrap } from '../utils/helper';\nvar Axis = /** @class */ (function (_super) {\n __extends(Axis, _super);\n function Axis() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n /** @private */\n _this.rect = new Rect(undefined, undefined, 0, 0);\n /** @private */\n _this.nearSizes = [];\n /** @private */\n _this.farSizes = [];\n /** @private */\n _this.maxLabelSize = new Size(0, 0);\n /** @private */\n _this.titleSize = new Size(0, 0);\n /** @private */\n _this.axisLabels = [];\n /** @private */\n _this.tooltipLabels = [];\n /** @private */\n _this.labelValue = [];\n /** @private */\n _this.axisLabelSize = 0;\n /** @private */\n _this.axisLabelInterval = 0;\n /** @private */\n _this.dateTimeAxisLabelInterval = [];\n /** @private */\n _this.maxLength = 0;\n /** @private */\n _this.min = 0;\n /** @private */\n _this.max = 0;\n /** @private */\n _this.isIntersect = false;\n /** @private */\n _this.jsonCellLabel = [];\n _this.multiLevelSize = [];\n /** @private */\n _this.xAxisMultiLabelHeight = [];\n /** @private */\n _this.yAxisMultiLabelHeight = [];\n /** @private */\n _this.multiLevelPosition = [];\n return _this;\n }\n /**\n * measure the axis title and label size\n * @param axis\n * @param heatmap\n * @private\n */\n Axis.prototype.computeSize = function (axis, heatmap, rect) {\n var size = new Size(0, 0);\n var innerPadding = 10;\n this.titleSize = axis.getTitleSize(axis, innerPadding);\n this.maxLabelSize = axis.getMaxLabelSize(axis, heatmap);\n this.getMultilevelLabelsHeight(axis, rect, heatmap);\n for (var i = 0; i < this.multiLevelLabels.length; i++) {\n size = axis.multiLevelLabelSize(innerPadding, i);\n this.multiLevelSize.push(size);\n }\n };\n /**\n * calculating x, y position of multi level labels\n * @private\n */\n Axis.prototype.multiPosition = function (axis, index) {\n var innerPadding = axis.orientation === 'Horizontal' ? 10 : 20;\n var multiPosition = new MultiLevelPosition(0, 0);\n if (axis.orientation === 'Horizontal') {\n var level0 = axis.maxLabelSize.height + innerPadding;\n var level1 = this.xAxisMultiLabelHeight[index - 1];\n multiPosition.x = (axis.isInversed ? axis.rect.x + axis.rect.width : axis.rect.x);\n multiPosition.y = index === 0 ? axis.rect.y + (axis.opposedPosition ? -level0 : level0) :\n axis.multiLevelPosition[index - 1].y + (axis.opposedPosition ? -level1 : level1);\n }\n else {\n var level0 = axis.maxLabelSize.width + innerPadding;\n var level1 = index !== 0 && (this.multiLevelSize[index - 1].width);\n multiPosition.x = index === 0 ? axis.rect.x - (axis.opposedPosition ? -level0 : level0) :\n axis.multiLevelPosition[index - 1].x - (axis.opposedPosition ? -(level1 + innerPadding) : level1 + innerPadding);\n multiPosition.y = axis.isInversed ? axis.rect.y : axis.rect.y + axis.rect.height;\n }\n return multiPosition;\n };\n Axis.prototype.multiLevelLabelSize = function (innerPadding, index) {\n var labelSize = new Size(0, 0);\n var multiLevel = this.multiLevelLabels;\n var categoryLabel = multiLevel[index].categories;\n for (var i = 0; i < categoryLabel.length; i++) {\n var size_1 = measureText(categoryLabel[i].text, multiLevel[index].textStyle);\n labelSize.width = (labelSize.width > size_1.width) ? labelSize.width : size_1.width;\n labelSize.height = (labelSize.height > size_1.height) ? labelSize.height : size_1.height;\n }\n var size = (this.orientation === 'Horizontal') ? this.xAxisMultiLabelHeight[index] : this.yAxisMultiLabelHeight[index];\n if (this.opposedPosition) {\n this.farSizes.push(size);\n }\n else {\n this.nearSizes.push(size);\n }\n return labelSize;\n };\n Axis.prototype.getMultilevelLabelsHeight = function (axis, rect, heatmap) {\n var labelSize;\n var gap;\n var height;\n var multiLevelLabelsHeight = [];\n var start;\n var end;\n var startPosition;\n var endPosition;\n var isVertical = axis.orientation === 'Vertical';\n var axisValue = (isVertical ? rect.height : rect.width) / axis.axisLabelSize;\n var padding = axis.orientation === 'Vertical' ? 20 : 10;\n this.multiLevelLabels.map(function (multiLevel, index) {\n multiLevel.categories.map(function (categoryLabel) {\n start = typeof categoryLabel.start === 'number' ? categoryLabel.start : Number(new Date(categoryLabel.start));\n end = typeof categoryLabel.end === 'number' ? categoryLabel.end : Number(new Date(categoryLabel.end));\n if (categoryLabel.text !== '' && categoryLabel.start !== null && categoryLabel.end !== null) {\n labelSize = measureText(categoryLabel.text, multiLevel.textStyle);\n height = isVertical ? labelSize.width : labelSize.height;\n startPosition = heatmap.heatMapAxis.calculateLeftPosition(axis, start, categoryLabel.start, rect);\n endPosition = heatmap.heatMapAxis.calculateWidth(axis, categoryLabel.end, end, rect);\n labelSize = measureText(categoryLabel.text, multiLevel.textStyle);\n gap = ((categoryLabel.maximumTextWidth === null) ? Math.abs(endPosition - startPosition) :\n categoryLabel.maximumTextWidth);\n if ((labelSize.width > gap - padding) && (multiLevel.overflow === 'Wrap') && !isVertical) {\n height = (height * (textWrap(categoryLabel.text, gap - padding, multiLevel.textStyle).length));\n }\n multiLevelLabelsHeight[index] = !multiLevelLabelsHeight[index] ? height + padding :\n ((multiLevelLabelsHeight[index] < height) ? height + padding : multiLevelLabelsHeight[index]);\n }\n });\n });\n if (isVertical) {\n this.yAxisMultiLabelHeight = multiLevelLabelsHeight;\n }\n else {\n this.xAxisMultiLabelHeight = multiLevelLabelsHeight;\n }\n };\n Axis.prototype.getTitleSize = function (axis, innerPadding) {\n var titleSize = new Size(0, 0);\n if (this.title.text) {\n titleSize = measureText(this.title.text, this.title.textStyle);\n titleSize.height += innerPadding;\n }\n if (axis.opposedPosition) {\n this.farSizes.push(titleSize.height);\n }\n else {\n this.nearSizes.push(titleSize.height);\n }\n return titleSize;\n };\n Axis.prototype.getMaxLabelSize = function (axis, heatmap) {\n var labelSize = new Size(0, 0);\n var labels = this.axisLabels;\n var padding = (axis.border.width > 0 || axis.multiLevelLabels.length > 0) ? 10 : 0;\n axis.angle = axis.labelRotation;\n axis.isIntersect = false;\n if (axis.orientation === 'Horizontal' && (axis.labelIntersectAction === 'Rotate45' ||\n (axis.labelRotation % 180 === 0 && axis.labelIntersectAction === 'Trim'))) {\n var interval = (axis.valueType === 'DateTime' && axis.showLabelOn !== 'None') ?\n heatmap.initialClipRect.width / axis.axisLabelSize : heatmap.initialClipRect.width / axis.axisLabels.length;\n var startX = heatmap.initialClipRect.x + ((!axis.isInversed) ? 0 : heatmap.initialClipRect.width);\n var previousEnd = void 0;\n var previousStart = void 0;\n for (var i = 0, len = labels.length; i < len; i++) {\n var label = labels[i];\n var elementSize = measureText(label, axis.textStyle);\n var axisInterval = (axis.valueType === 'DateTime' && axis.showLabelOn !== 'None') ?\n axis.dateTimeAxisLabelInterval[i] * interval : interval;\n var startPoint = startX + (!axis.isInversed ?\n ((interval - elementSize.width) / 2) : -((interval + elementSize.width) / 2));\n startPoint = startPoint < heatmap.initialClipRect.x ? heatmap.initialClipRect.x : startPoint;\n var endPoint = startPoint + elementSize.width;\n if (!axis.isInversed) {\n if (isNullOrUndefined(previousEnd)) {\n previousEnd = endPoint;\n }\n else if ((startPoint < previousEnd)) {\n if (axis.labelIntersectAction === 'Rotate45') {\n axis.angle = 45;\n }\n else {\n axis.isIntersect = true;\n }\n break;\n }\n previousEnd = endPoint;\n }\n else {\n if (isNullOrUndefined(previousStart)) {\n previousStart = startPoint;\n }\n else if ((previousStart < endPoint)) {\n if (axis.labelIntersectAction === 'Rotate45') {\n axis.angle = 45;\n }\n else {\n axis.isIntersect = true;\n }\n break;\n }\n previousStart = startPoint;\n }\n startX += axis.isInversed ? -axisInterval : axisInterval;\n }\n }\n for (var i = 0; i < labels.length; i++) {\n var size = (axis.angle % 180 === 0) ?\n measureText(labels[i], axis.textStyle) : rotateTextSize(axis.textStyle, labels[i], axis.angle);\n labelSize.width = (labelSize.width > size.width) ? labelSize.width : size.width;\n labelSize.height = (labelSize.height > size.height) ? labelSize.height : size.height;\n }\n if (axis.opposedPosition) {\n this.farSizes.push((axis.orientation === 'Horizontal') ? labelSize.height : labelSize.width + padding);\n }\n else {\n this.nearSizes.push((axis.orientation === 'Horizontal') ? labelSize.height : labelSize.width + padding);\n }\n return labelSize;\n };\n /**\n * Generate the axis lables for numeric axis\n * @param heatmap\n * @private\n */\n Axis.prototype.calculateNumericAxisLabels = function (heatmap) {\n //Axis Min\n var min = 0;\n var max = 0;\n var interval = this.interval ? this.interval : 1;\n var adaptorMin;\n var adaptorMax;\n if (heatmap.adaptorModule && heatmap.isCellData) {\n adaptorMin = this.orientation === 'Horizontal' ?\n heatmap.adaptorModule.adaptiveXMinMax.min : heatmap.adaptorModule.adaptiveYMinMax.min;\n adaptorMax = this.orientation === 'Horizontal' ?\n heatmap.adaptorModule.adaptiveXMinMax.max : heatmap.adaptorModule.adaptiveYMinMax.max;\n }\n min = !isNullOrUndefined(this.minimum) ? this.minimum : ((adaptorMin) ? adaptorMin : 0);\n max = !isNullOrUndefined(this.maximum) ? this.maximum :\n ((adaptorMax) ? adaptorMax : (this.maxLength * this.increment));\n var temp;\n if (this.minimum && this.maximum && min > max) {\n temp = min;\n min = max;\n max = temp;\n }\n max = !isNullOrUndefined(this.maximum) ? max : (adaptorMax ? adaptorMax : (max + min));\n var format = this.labelFormat;\n var isCustom = format.match('{value}') !== null;\n this.format = heatmap.intl.getNumberFormat({\n format: isCustom ? '' : format\n });\n for (var i = min; i <= max; i = i + (interval * this.increment)) {\n var value = formatValue(isCustom, format, i, this.format);\n this.axisLabels.push(value);\n }\n this.min = 0;\n this.axisLabelSize = Math.floor(((max - min) / this.increment) + 1);\n this.max = this.axisLabelSize - 1;\n this.axisLabelInterval = interval;\n for (var i = min; i <= max; i = i + this.increment) {\n var value = formatValue(isCustom, format, i, this.format);\n this.tooltipLabels.push(value);\n this.labelValue.push(i);\n }\n this.labelValue = this.isInversed ? this.labelValue.reverse() : this.labelValue;\n };\n /**\n * Generate the axis lables for category axis\n * @private\n */\n Axis.prototype.calculateCategoryAxisLabels = function () {\n var labels = this.labels ? this.labels : [];\n labels = (labels.length > 0) ? labels : this.jsonCellLabel;\n var min = !isNullOrUndefined(this.minimum) ? this.minimum : 0;\n var max = !isNullOrUndefined(this.maximum) ? this.maximum : this.maxLength;\n var interval = this.interval ? this.interval : 1;\n var temp;\n if (!isNullOrUndefined(this.minimum) && !isNullOrUndefined(this.maximum) && min > max) {\n temp = min;\n min = max;\n max = temp;\n }\n if (labels && labels.length > 0) {\n for (var i = min; i <= max; i = i + interval) {\n var value = labels[i] ? labels[i].toString() : i.toString();\n this.axisLabels.push(value);\n }\n }\n else {\n for (var i = min; i <= max; i = i + interval) {\n this.axisLabels.push(i.toString());\n }\n }\n for (var i = min; i <= max; i++) {\n this.tooltipLabels.push(labels[i] ? labels[i].toString() : i.toString());\n this.labelValue.push(labels[i] ? labels[i].toString() : i.toString());\n }\n this.min = min;\n this.max = max;\n this.axisLabelSize = max - min + 1;\n this.axisLabelInterval = interval;\n this.labelValue = this.isInversed ? this.labelValue.reverse() : this.labelValue;\n };\n /**\n * Generate the axis labels for date time axis.\n * @param heatmap\n * @private\n */\n Axis.prototype.calculateDateTimeAxisLabel = function (heatmap) {\n var interval = this.interval ? this.interval : 1;\n var option = {\n skeleton: 'full',\n type: 'dateTime'\n };\n var dateParser = heatmap.intl.getDateParser(option);\n var dateFormatter = heatmap.intl.getDateFormat(option);\n var min;\n var max;\n var adaptorMin = null;\n var adaptorMax = null;\n if (heatmap.adaptorModule && heatmap.isCellData) {\n adaptorMin = this.orientation === 'Horizontal' ? heatmap.adaptorModule.adaptiveXMinMax.min :\n heatmap.adaptorModule.adaptiveYMinMax.min;\n adaptorMax = this.orientation === 'Horizontal' ? heatmap.adaptorModule.adaptiveXMinMax.max :\n heatmap.adaptorModule.adaptiveYMinMax.max;\n }\n var minimum = this.minimum ? this.minimum : (adaptorMin ? adaptorMin : null);\n var maximum = this.maximum ? this.maximum : (adaptorMax ? adaptorMax : null);\n if (minimum === null && maximum === null) {\n min = 0;\n max = this.maxLength * this.increment;\n for (var i = min; i <= max; i = i + (interval * this.increment)) {\n this.axisLabels.push(i.toString());\n this.tooltipLabels.push(i.toString());\n this.labelValue.push(i.toString());\n }\n this.min = 0;\n this.max = this.maxLength;\n this.axisLabelSize = (max - min) / this.increment + 1;\n this.axisLabelInterval = interval;\n }\n else {\n if (minimum !== null && maximum === null) {\n min = Date.parse(dateParser(dateFormatter(new Date(DataUtil.parse.parseJson({ val: minimum }).val))));\n max = increaseDateTimeInterval(min, this.maxLength, this.intervalType, this.increment).getTime();\n }\n else if (minimum === null && maximum !== null) {\n max = Date.parse(dateParser(dateFormatter(new Date(DataUtil.parse.parseJson({ val: maximum }).val))));\n min = increaseDateTimeInterval(max, -this.maxLength, this.intervalType, this.increment).getTime();\n }\n else {\n min = Date.parse(dateParser(dateFormatter(new Date(DataUtil.parse.parseJson({ val: minimum }).val))));\n max = Date.parse(dateParser(dateFormatter(new Date(DataUtil.parse.parseJson({ val: maximum }).val))));\n }\n this.format = heatmap.intl.getDateFormat({\n format: this.labelFormat, skeleton: this.getSkeleton()\n });\n var tempInterval = min;\n while (tempInterval <= max) {\n var value = this.format(new Date(tempInterval));\n this.axisLabels.push(value);\n if (this.showLabelOn !== 'None') {\n interval = this.calculateLabelInterval(tempInterval);\n this.dateTimeAxisLabelInterval.push(interval);\n }\n tempInterval = increaseDateTimeInterval(tempInterval, interval, this.intervalType, this.increment).getTime();\n }\n this.min = 0;\n this.axisLabelInterval = interval;\n this.axisLabelSize = this.getTotalLabelLength(min, max); // this.tooltipLabels.length;\n this.max = this.axisLabelSize - 1;\n tempInterval = min;\n while (tempInterval <= max) {\n var value = this.format(new Date(tempInterval));\n this.tooltipLabels.push(value);\n this.labelValue.push(new Date(tempInterval));\n tempInterval = increaseDateTimeInterval(tempInterval, 1, this.intervalType, this.increment).getTime();\n }\n }\n this.labelValue = this.isInversed ? this.labelValue.reverse() : this.labelValue;\n };\n Axis.prototype.calculateLabelInterval = function (interval) {\n var year = new Date(interval).getFullYear();\n var month = new Date(interval).getMonth() + 1;\n var day = new Date(interval).getDate();\n var numberOfDays;\n var tempInterval;\n if (this.showLabelOn === 'Years' || this.showLabelOn === 'Months') {\n if (this.showLabelOn === 'Years' && this.intervalType === 'Months') {\n tempInterval = Math.ceil(12 / this.increment);\n }\n else {\n numberOfDays = this.showLabelOn === 'Years' ? year % 4 === 0 ? 366 : 365 : new Date(year, month, 0).getDate();\n numberOfDays += 1 - day;\n tempInterval = this.intervalType === 'Days' ? Math.ceil(numberOfDays / this.increment) : this.intervalType === 'Hours' ?\n Math.ceil((numberOfDays * 24) / this.increment) : this.intervalType === 'Minutes' ?\n Math.ceil((numberOfDays * 24 * 60) / this.increment) : 1;\n }\n }\n else if (this.showLabelOn === 'Days') {\n tempInterval = this.intervalType === 'Hours' ? Math.ceil(24 / this.increment) : this.intervalType === 'Minutes' ?\n Math.ceil((24 * 60) / this.increment) : 1;\n }\n else if (this.showLabelOn === 'Hours') {\n var minutes = new Date(interval).getMinutes();\n tempInterval = this.intervalType === 'Minutes' ? Math.ceil((60 - minutes) / this.increment) : 1;\n }\n else {\n tempInterval = 1;\n }\n return tempInterval;\n };\n /**\n * @private\n */\n Axis.prototype.getSkeleton = function () {\n var skeleton;\n if (this.intervalType === 'Years') {\n skeleton = 'yMMM';\n }\n else if (this.intervalType === 'Months') {\n skeleton = 'MMMd';\n }\n else if (this.intervalType === 'Days') {\n skeleton = 'yMd';\n }\n else if (this.intervalType === 'Hours') {\n skeleton = 'EHm';\n }\n else if (this.intervalType === 'Minutes') {\n skeleton = 'Hms';\n }\n else {\n skeleton = 'Hms';\n }\n return skeleton;\n };\n /** @private */\n Axis.prototype.getTotalLabelLength = function (min, max) {\n var length = 0;\n var minimum = new Date(min);\n var maximum = new Date(max);\n var difference;\n var days;\n switch (this.intervalType) {\n case 'Years':\n var years = ((maximum.getFullYear() - minimum.getFullYear()) / this.increment) + 1;\n length = Math.floor(years);\n break;\n case 'Months':\n var months = (maximum.getFullYear() - minimum.getFullYear()) * 12;\n months -= minimum.getMonth();\n months += maximum.getMonth();\n length = months <= 0 ? 1 : Math.floor((months / this.increment) + 1);\n break;\n case 'Days':\n difference = Math.abs(minimum.getTime() - maximum.getTime());\n days = Math.floor(difference / (1000 * 3600 * 24));\n length = Math.floor((days / this.increment) + 1);\n break;\n case 'Hours':\n difference = Math.abs(minimum.getTime() - maximum.getTime());\n var hours = Math.floor(difference / (1000 * 3600));\n length = Math.floor(hours / this.increment) + 1;\n break;\n case 'Minutes':\n difference = Math.abs(minimum.getTime() - maximum.getTime());\n var minutes = Math.floor(difference / (1000 * 60));\n length = Math.floor(minutes / this.increment) + 1;\n break;\n }\n return length;\n };\n /**\n * Clear the axis label collection\n * @private\n */\n Axis.prototype.clearAxisLabel = function () {\n this.axisLabels = [];\n this.tooltipLabels = [];\n this.dateTimeAxisLabelInterval = [];\n this.labelValue = [];\n };\n __decorate([\n Complex({ text: '', textStyle: Theme.axisTitleFont }, Title)\n ], Axis.prototype, \"title\", void 0);\n __decorate([\n Property(false)\n ], Axis.prototype, \"opposedPosition\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"labels\", void 0);\n __decorate([\n Complex(Theme.axisLabelFont, Font)\n ], Axis.prototype, \"textStyle\", void 0);\n __decorate([\n Property(0)\n ], Axis.prototype, \"labelRotation\", void 0);\n __decorate([\n Property(false)\n ], Axis.prototype, \"isInversed\", void 0);\n __decorate([\n Property('Category')\n ], Axis.prototype, \"valueType\", void 0);\n __decorate([\n Property(1)\n ], Axis.prototype, \"increment\", void 0);\n __decorate([\n Property('None')\n ], Axis.prototype, \"showLabelOn\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"minimum\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"maximum\", void 0);\n __decorate([\n Property(null)\n ], Axis.prototype, \"interval\", void 0);\n __decorate([\n Property('')\n ], Axis.prototype, \"labelFormat\", void 0);\n __decorate([\n Property('Days')\n ], Axis.prototype, \"intervalType\", void 0);\n __decorate([\n Property('Trim')\n ], Axis.prototype, \"labelIntersectAction\", void 0);\n __decorate([\n Complex({ color: '#b5b5b5', width: 0, type: 'Rectangle' }, AxisLabelBorder)\n ], Axis.prototype, \"border\", void 0);\n __decorate([\n Collection([], MultiLevelLabels)\n ], Axis.prototype, \"multiLevelLabels\", void 0);\n return Axis;\n}(ChildProperty));\nexport { Axis };\n","import { Rect, measureText, TextOption, rotateTextSize, textTrim, CanvasTooltip, PathOption, textWrap } from '../utils/helper';\nimport { sum, titlePositionX, LineOption, Line, DrawSvgCanvas, TextBasic, titlePositionY } from '../utils/helper';\nimport { extend, Browser } from '@syncfusion/ej2-base';\nvar AxisHelper = /** @class */ (function () {\n function AxisHelper(heatMap) {\n this.heatMap = heatMap;\n this.padding = 10;\n this.drawSvgCanvas = new DrawSvgCanvas(heatMap);\n }\n /**\n * To render the x and y axis.\n * @private\n */\n AxisHelper.prototype.renderAxes = function () {\n this.initialClipRect = this.heatMap.initialClipRect;\n var heatMap = this.heatMap;\n var axisElement;\n var element;\n if (!heatMap.enableCanvasRendering) {\n axisElement = this.heatMap.renderer.createGroup({ id: heatMap.element.id + 'AxisCollection' });\n }\n var axes = this.heatMap.axisCollections;\n for (var i = 0, len = axes.length; i < len; i++) {\n var axis = axes[i];\n var optionsLine = {};\n if (axis.orientation === 'Horizontal') {\n if (!heatMap.enableCanvasRendering) {\n element = this.heatMap.renderer.createGroup({ id: heatMap.element.id + 'XAxisGroup' });\n }\n this.drawXAxisLine(element, axis);\n this.drawXAxisTitle(axis, element, axis.rect);\n this.drawXAxisLabels(axis, element, axis.rect);\n }\n else {\n element = heatMap.renderer.createGroup({ id: heatMap.element.id + 'YAxisGroup' });\n this.drawYAxisLine(element, axis);\n this.drawYAxisTitle(axis, element, axis.rect);\n this.drawYAxisLabels(axis, element, axis.rect);\n }\n if (axis.multiLevelLabels.length > 0) {\n this.drawMultiLevels(element, axis);\n }\n if (!heatMap.enableCanvasRendering) {\n axisElement.appendChild(element);\n }\n }\n if (!heatMap.enableCanvasRendering) {\n this.heatMap.svgObject.appendChild(axisElement);\n }\n };\n AxisHelper.prototype.drawXAxisLine = function (parent, axis) {\n var y = this.initialClipRect.y + (!axis.opposedPosition ? this.initialClipRect.height : 0);\n var line = new LineOption(this.heatMap.element.id + '_XAxisLine', new Line(this.initialClipRect.x, y, this.initialClipRect.x + this.initialClipRect.width, y), 'transparent', 0);\n this.drawSvgCanvas.drawLine(line, parent);\n };\n AxisHelper.prototype.drawYAxisLine = function (parent, axis) {\n var x = this.initialClipRect.x + ((!axis.opposedPosition) ? 0 : this.initialClipRect.width);\n var line = new LineOption(this.heatMap.element.id + '_YAxisLine', new Line(x, this.initialClipRect.y, x, this.initialClipRect.height + this.initialClipRect.y), 'transparent', 0);\n this.drawSvgCanvas.drawLine(line, parent);\n };\n AxisHelper.prototype.drawXAxisTitle = function (axis, parent, rect) {\n var y = rect.y + (!axis.opposedPosition ? (axis.maxLabelSize.height + this.padding +\n sum(axis.xAxisMultiLabelHeight)) : -(axis.maxLabelSize.height + this.padding + sum(axis.xAxisMultiLabelHeight)));\n if (axis.title.text) {\n var heatMap = this.heatMap;\n var title = axis.title;\n var elementSize = measureText(title.text, title.textStyle);\n var padding = this.padding;\n var anchor = title.textStyle.textAlignment === 'Near' ? 'start' :\n title.textStyle.textAlignment === 'Far' ? 'end' : 'middle';\n padding = axis.opposedPosition ? -(padding + elementSize.height / 4) : (padding + (3 * elementSize.height / 4));\n var options = new TextOption(heatMap.element.id + '_XAxisTitle', new TextBasic(rect.x + titlePositionX(rect.width, 0, 0, title.textStyle), y + padding, anchor, title.text), title.textStyle, title.textStyle.color || heatMap.themeStyle.axisTitle);\n this.drawSvgCanvas.createText(options, parent, title.text);\n }\n };\n AxisHelper.prototype.drawYAxisTitle = function (axis, parent, rect) {\n if (axis.title.text) {\n var title = axis.title;\n var heatMap = this.heatMap;\n var labelRotation = (axis.opposedPosition) ? 90 : -90;\n var elementSize = measureText(title.text, title.textStyle);\n var anchor = title.textStyle.textAlignment === 'Near' ? 'start' :\n title.textStyle.textAlignment === 'Far' ? 'end' : 'middle';\n var padding = 10;\n padding = axis.opposedPosition ? padding : -padding;\n var x = rect.x + padding + ((axis.opposedPosition) ? axis.maxLabelSize.width + sum(axis.yAxisMultiLabelHeight) :\n -(axis.maxLabelSize.width + sum(axis.yAxisMultiLabelHeight)));\n var y = rect.y + titlePositionY(rect, 0, 0, title.textStyle) + (axis.opposedPosition ? this.padding : -this.padding);\n var options = new TextOption(heatMap.element.id + '_YAxisTitle', new TextBasic(x, y - this.padding, anchor, title.text, labelRotation, 'rotate(' + labelRotation + ',' + (x) + ',' + (y) + ')', 'auto'), title.textStyle, title.textStyle.color || heatMap.themeStyle.axisTitle);\n if (!this.heatMap.enableCanvasRendering) {\n this.drawSvgCanvas.createText(options, parent, title.text);\n }\n else {\n this.drawSvgCanvas.canvasDrawText(options, title.text, x, y);\n }\n }\n };\n /**\n * Get the visible labels for both x and y axis\n * @private\n */\n AxisHelper.prototype.calculateVisibleLabels = function () {\n var heatmap = this.heatMap;\n var axis;\n var axisCollection = heatmap.axisCollections;\n var data = this.heatMap.dataSource;\n var processLabels = !(data && data.isJsonData && data.adaptorType === 'Cell');\n for (var i = 0, len = axisCollection.length; i < len; i++) {\n axis = axisCollection[i];\n if (axis.valueType === 'Numeric' && processLabels) {\n axis.clearAxisLabel();\n axis.calculateNumericAxisLabels(this.heatMap);\n }\n else if (axis.valueType === 'DateTime' && processLabels) {\n axis.clearAxisLabel();\n axis.calculateDateTimeAxisLabel(this.heatMap);\n }\n else if (axis.valueType === 'Category') {\n axis.clearAxisLabel();\n axis.calculateCategoryAxisLabels();\n }\n axis.tooltipLabels = axis.isInversed ? axis.tooltipLabels.reverse() : axis.tooltipLabels;\n }\n };\n /**\n * Measure the title and labels rendering position for both X and Y axis.\n * @param rect\n * @private\n */\n AxisHelper.prototype.measureAxis = function (rect) {\n var heatmap = this.heatMap;\n var axis;\n var axisCollection = heatmap.axisCollections;\n for (var i = axisCollection.length - 1; i >= 0; i--) {\n axis = axisCollection[i];\n var padding = axis.textStyle.size === '0px' ? 0 : this.padding;\n axis.nearSizes = [];\n axis.farSizes = [];\n axis.computeSize(axis, heatmap, rect);\n if (!axis.opposedPosition) {\n if (axis.orientation === 'Horizontal') {\n rect.height -= (sum(axis.nearSizes) + padding);\n }\n else {\n rect.x += sum(axis.nearSizes) + padding;\n rect.width -= sum(axis.nearSizes) + padding;\n }\n }\n else {\n if (axis.orientation === 'Horizontal') {\n rect.y += sum(axis.farSizes) + padding;\n rect.height -= sum(axis.farSizes) + padding;\n }\n else {\n rect.width -= sum(axis.farSizes) + padding;\n }\n }\n }\n };\n /**\n * Calculate the X and Y axis line position\n * @param rect\n * @private\n */\n AxisHelper.prototype.calculateAxisSize = function (rect) {\n var heatmap = this.heatMap;\n var axis;\n var axisCollection = heatmap.axisCollections;\n for (var i = 0, len = axisCollection.length; i < len; i++) {\n var axis_1 = axisCollection[i];\n axis_1.rect = extend({}, rect, null, true);\n if (axis_1.orientation === 'Horizontal' && !axis_1.opposedPosition) {\n axis_1.rect.y = rect.y + rect.height;\n axis_1.rect.height = 0;\n }\n if (axis_1.orientation === 'Vertical' && axis_1.opposedPosition) {\n axis_1.rect.x = rect.x + rect.width;\n axis_1.rect.width = 0;\n }\n axis_1.multiLevelPosition = [];\n for (var i_1 = 0; i_1 < axis_1.multiLevelLabels.length; i_1++) {\n var multiPosition = axis_1.multiPosition(axis_1, i_1);\n axis_1.multiLevelPosition.push(multiPosition);\n }\n }\n };\n AxisHelper.prototype.drawXAxisLabels = function (axis, parent, rect) {\n var heatMap = this.heatMap;\n var labels = axis.axisLabels;\n var interval = rect.width / axis.axisLabelSize;\n var compactInterval = 0;\n var axisInterval = axis.interval ? axis.interval : 1;\n var tempintervel = rect.width / (axis.axisLabelSize / axis.axisLabelInterval);\n var temp = axis.axisLabelInterval;\n if (tempintervel > 0) {\n while (tempintervel < parseInt(axis.textStyle.size, 10)) {\n temp = temp + 1;\n tempintervel = rect.width / (axis.axisLabelSize / temp);\n }\n }\n else {\n temp = axis.tooltipLabels.length;\n }\n if (axis.axisLabelInterval < temp) {\n compactInterval = temp;\n labels = axis.tooltipLabels;\n axisInterval = temp;\n }\n var padding = 10;\n var lableStrtX = rect.x + (!axis.isInversed ? 0 : rect.width);\n var labelPadding;\n var angle = axis.angle;\n padding = this.padding;\n var anglePadding = ((angle === 90 || angle === -90)) ? -2 : 0;\n var labelElement;\n var borderElement;\n if (!heatMap.enableCanvasRendering) {\n labelElement = this.heatMap.renderer.createGroup({ id: heatMap.element.id + 'XAxisLabels' });\n borderElement = this.heatMap.renderer.createGroup({ id: heatMap.element.id + 'XAxisLabelBorder' });\n }\n for (var i = 0, len = labels.length; i < len; i++) {\n var lableRect = new Rect(lableStrtX, rect.y, interval, rect.height);\n var label = (axis.labelIntersectAction === 'Trim' && axis.isIntersect) ? axis.valueType !== 'DateTime' ||\n axis.showLabelOn === 'None' ? textTrim(interval * axisInterval, labels[i], axis.textStyle) :\n textTrim(axis.dateTimeAxisLabelInterval[i] * interval, labels[i], axis.textStyle) : labels[i];\n var elementSize = measureText(label, axis.textStyle);\n var transform = void 0;\n labelPadding = (axis.opposedPosition) ?\n -(padding)\n : (padding + ((angle % 360) === 0 ? (elementSize.height / 2) : 0));\n var x = lableRect.x + ((!axis.isInversed) ?\n (lableRect.width / 2) - (elementSize.width / 2) : -((lableRect.width / 2) + (elementSize.width / 2)));\n if (axis.labelIntersectAction === 'Trim') {\n x = (!axis.isInversed) ? (x >= lableRect.x ? x : lableRect.x) : (x > (lableStrtX - interval) ? x : (lableStrtX - interval));\n }\n else if (angle % 180 === 0) {\n x = x < rect.x ? rect.x : x;\n x = ((x + elementSize.width) > (rect.x + rect.width)) ? (rect.x + rect.width - elementSize.width) : x;\n }\n var y = rect.y + labelPadding;\n this.drawXAxisBorder(axis, borderElement, axis.rect, x, elementSize.width, i);\n if (angle % 360 !== 0) {\n angle = (angle > 360) ? angle % 360 : angle;\n var rotateSize = rotateTextSize(axis.textStyle, label, angle);\n var diffHeight = axis.maxLabelSize.height - Math.ceil(rotateSize.height - elementSize.height);\n var yLocation = axis.opposedPosition ? diffHeight / 2 : -diffHeight / 2;\n x = lableRect.x + (axis.isInversed ? -(lableRect.width / 2) : (lableRect.width / 2));\n y = y + (axis.opposedPosition ? -(rotateSize.height / 2) :\n (((angle % 360) === 180 || (angle % 360) === -180) ? 0 : (rotateSize.height) / 2));\n transform = 'rotate(' + angle + ',' + x + ','\n + y + ')';\n }\n var options = new TextOption(heatMap.element.id + '_XAxis_Label' + i, new TextBasic(x, y, (angle % 360 === 0) ? 'start' : 'middle', label, angle, transform), axis.textStyle, axis.textStyle.color || heatMap.themeStyle.axisLabel);\n if (angle !== 0 && this.heatMap.enableCanvasRendering) {\n this.drawSvgCanvas.canvasDrawText(options, label);\n }\n else {\n this.drawSvgCanvas.createText(options, labelElement, label);\n }\n if (compactInterval === 0) {\n var labelInterval = (axis.valueType === 'DateTime' && axis.showLabelOn !== 'None') ?\n axis.dateTimeAxisLabelInterval[i] : axis.axisLabelInterval;\n lableStrtX = lableStrtX + (!axis.isInversed ? (labelInterval * interval) :\n -(labelInterval * interval));\n }\n else {\n lableStrtX = lableStrtX + (!axis.isInversed ? (compactInterval * interval) : -(compactInterval * interval));\n }\n if (label.indexOf('...') !== -1) {\n this.heatMap.tooltipCollection.push(new CanvasTooltip(labels[i], new Rect(x, y - elementSize.height, elementSize.width, elementSize.height)));\n }\n if (compactInterval !== 0) {\n i = i + (compactInterval - 1);\n }\n }\n if (!heatMap.enableCanvasRendering) {\n parent.appendChild(labelElement);\n parent.appendChild(borderElement);\n }\n };\n AxisHelper.prototype.drawYAxisLabels = function (axis, parent, rect) {\n var heatMap = this.heatMap;\n var labels = axis.axisLabels;\n var interval = rect.height / axis.axisLabelSize;\n var compactInterval = 0;\n var tempintervel = rect.height / (axis.axisLabelSize / axis.axisLabelInterval);\n var temp = axis.axisLabelInterval;\n if (tempintervel > 0) {\n while (tempintervel < parseInt(axis.textStyle.size, 10)) {\n temp = temp + 1;\n tempintervel = rect.height / (axis.axisLabelSize / temp);\n }\n }\n else {\n temp = axis.tooltipLabels.length;\n }\n if (axis.axisLabelInterval < temp) {\n compactInterval = temp;\n labels = axis.tooltipLabels;\n }\n var padding = 10;\n var lableStartY = rect.y + (axis.isInversed ? 0 : rect.height);\n var anchor = axis.opposedPosition ? 'start' : 'end';\n padding = axis.opposedPosition ? padding : -padding;\n var labelElement;\n var borderElement;\n if (!heatMap.enableCanvasRendering) {\n labelElement = this.heatMap.renderer.createGroup({ id: heatMap.element.id + 'YAxisLabels' });\n borderElement = this.heatMap.renderer.createGroup({ id: heatMap.element.id + 'YAxisLabelBorder' });\n }\n for (var i = 0, len = labels.length; i < len; i++) {\n var labelRect = new Rect(rect.x, lableStartY, rect.width, interval);\n var position = labelRect.height / 2; //titlePositionY(lableRect, 0, 0, axis.textStyle);\n var x = labelRect.x + padding;\n var y = labelRect.y + (axis.isInversed ? position : -position);\n var options = new TextOption(heatMap.element.id + '_YAxis_Label' + i, new TextBasic(x, y, anchor, labels[i], 0, 'rotate(' + 0 + ',' + (x) + ',' + (y) + ')', 'middle'), axis.textStyle, axis.textStyle.color || heatMap.themeStyle.axisLabel);\n if (Browser.isIE && !heatMap.enableCanvasRendering) {\n options.dy = '1ex';\n }\n this.drawSvgCanvas.createText(options, labelElement, labels[i]);\n if (compactInterval === 0) {\n var labelInterval = (axis.valueType === 'DateTime' && axis.showLabelOn !== 'None') ?\n axis.dateTimeAxisLabelInterval[i] : axis.axisLabelInterval;\n lableStartY = lableStartY + (axis.isInversed ? (labelInterval * interval) :\n -(labelInterval * interval));\n }\n else {\n lableStartY = lableStartY + (axis.isInversed ? (compactInterval * interval) : -(compactInterval * interval));\n i = i + (compactInterval - 1);\n }\n var elementSize = measureText(labels[i], axis.textStyle);\n this.drawYAxisBorder(axis, borderElement, axis.rect, y, elementSize.height, i);\n }\n if (!heatMap.enableCanvasRendering) {\n parent.appendChild(labelElement);\n parent.appendChild(borderElement);\n }\n };\n AxisHelper.prototype.drawXAxisBorder = function (axis, parent, rect, lableX, width, index) {\n var interval = rect.width / axis.axisLabelSize;\n var path = '';\n var padding = 10;\n var axisInterval = axis.interval ? axis.interval : 1;\n var startX = axis.isInversed ? rect.x + rect.width - (interval * index * axisInterval) :\n rect.x + (interval * index * axisInterval);\n var startY = rect.y;\n var endX;\n var endY;\n endY = startY + (axis.opposedPosition ? -(axis.maxLabelSize.height + padding) : axis.maxLabelSize.height + padding);\n endX = axis.isInversed ? startX - interval : startX + interval;\n switch (axis.border.type) {\n case 'Rectangle':\n path = ('M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ' +\n 'L' + ' ' + endX + ' ' + endY + ' ' + 'L' + ' ' + endX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + startY);\n break;\n case 'WithoutTopBorder':\n path = 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ' +\n 'L' + ' ' + endX + ' ' + endY + ' ' + 'L' + ' ' + endX + ' ' + startY + ' ';\n break;\n case 'WithoutBottomBorder':\n path = 'M' + ' ' + startX + ' ' + endY + ' ' + 'L' + ' ' + startX + ' ' + startY + ' ' +\n 'L' + ' ' + endX + ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ';\n break;\n case 'WithoutTopandBottomBorder':\n path = 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ' +\n 'M' + ' ' + endX + ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ';\n break;\n case 'Brace':\n var padding_1 = 3;\n endY = startY + ((endY - startY) / 2) + (axis.opposedPosition ? 0 : 5);\n var endY1 = axis.isInversed ? (lableX + width + padding_1) : (lableX - padding_1);\n var endY2 = axis.isInversed ? (lableX - padding_1) : (lableX + width + padding_1);\n path = 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ' +\n 'L' + ' ' + endY1 + ' ' + endY + ' ' + 'M' + ' ' + endY2 +\n ' ' + endY + ' ' + 'L' +\n ' ' + endX + ' ' + endY + ' ' + 'L' + ' ' + endX + ' ' + startY + ' ';\n break;\n }\n if (axis.border.width > 0 && axis.border.type !== 'WithoutBorder') {\n this.createAxisBorderElement(axis, path, parent, index);\n }\n };\n AxisHelper.prototype.drawYAxisBorder = function (axis, parent, rect, lableY, height, index) {\n var interval = rect.height / axis.axisLabelSize;\n var path = '';\n var padding = 20;\n var axisInterval = axis.interval ? axis.interval : 1;\n var startX = rect.x;\n var startY = axis.isInversed ? rect.y + (interval * index * axisInterval) :\n rect.y + rect.height - (interval * index * axisInterval);\n var endX;\n var endY;\n endX = startX + (!axis.opposedPosition ? -(axis.maxLabelSize.width + padding) : axis.maxLabelSize.width + padding);\n endY = axis.isInversed ? startY + interval : startY - interval;\n switch (axis.border.type) {\n case 'Rectangle':\n path = 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ' +\n 'L' + ' ' + endX + ' ' + endY + ' ' + 'L' + ' ' + endX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + startY;\n break;\n case 'WithoutTopBorder':\n path = 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + startY + ' ' +\n 'L' + ' ' + endX + ' ' + endY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ';\n break;\n case 'WithoutBottomBorder':\n path = 'M' + ' ' + endX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + startY + ' ' +\n 'L' + ' ' + startX + ' ' + endY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ';\n break;\n case 'WithoutTopandBottomBorder':\n path = 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + startY + ' ' +\n 'M' + ' ' + endX + ' ' + endY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ';\n break;\n case 'Brace':\n endX = startX - (startX - endX) / 2;\n var endY1 = axis.isInversed ? lableY - height / 2 : lableY + height / 2;\n var endY2 = axis.isInversed ? lableY + height / 2 : lableY - height / 2;\n path = 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + startY + ' ' +\n 'L' + ' ' + endX + ' ' + endY1 + ' ' + 'M' + ' ' +\n endX + ' ' + endY2 + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ' +\n 'L' + ' ' + startX + ' ' + endY;\n break;\n }\n if (axis.border.width > 0 && axis.border.type !== 'WithoutBorder') {\n this.createAxisBorderElement(axis, path, parent, index);\n }\n };\n /**\n * To create border element for axis.\n * @return {void}\n * @private\n */\n AxisHelper.prototype.createAxisBorderElement = function (axis, labelBorder, parent, index) {\n var canvasTranslate;\n var id = axis.orientation === 'Horizontal' ? '_XAxis_Label_Border' : '_YAxis_Label_Border';\n var pathOptions = new PathOption(this.heatMap.element.id + id + index, 'transparent', axis.border.width, axis.border.color, 1, 'none', labelBorder);\n if (!this.heatMap.enableCanvasRendering) {\n var borderElement = this.heatMap.renderer.drawPath(pathOptions);\n parent.appendChild(borderElement);\n }\n else {\n this.heatMap.canvasRenderer.drawPath(pathOptions, canvasTranslate);\n }\n };\n AxisHelper.prototype.drawMultiLevels = function (parent, axis) {\n var element;\n if (!this.heatMap.enableCanvasRendering) {\n element = this.heatMap.renderer.createGroup({ id: this.heatMap.element.id + '_' + axis.orientation + '_MultiLevelLabel' });\n }\n axis.orientation === 'Horizontal' ? this.renderXAxisMultiLevelLabels(axis, element, axis.rect) :\n this.renderYAxisMultiLevelLabels(axis, element, axis.rect);\n if (!this.heatMap.enableCanvasRendering) {\n parent.appendChild(element);\n }\n };\n /**\n * render x axis multi level labels\n * @private\n * @return {void}\n */\n AxisHelper.prototype.renderXAxisMultiLevelLabels = function (axis, parent, rect) {\n var _this = this;\n var x = 0;\n var y;\n var padding = 10;\n var startX;\n var startY;\n var endX = 0;\n var tooltip;\n var start;\n var end;\n var labelSize;\n var anchor;\n var isInversed = axis.isInversed;\n var labelElement;\n var opposedPosition = axis.opposedPosition;\n var pathRect = '';\n var gap;\n var width;\n var textLength;\n var position = (isInversed ? axis.rect.width : 0) + axis.rect.x;\n axis.multiLevelLabels.map(function (multiLevel, level) {\n labelElement = _this.heatMap.renderer.createGroup({ id: _this.heatMap.element.id + '_XAxisMultiLevelLabel' + level });\n multiLevel.categories.map(function (categoryLabel, i) {\n tooltip = false;\n start = typeof categoryLabel.start === 'number' ? categoryLabel.start : Number(new Date(categoryLabel.start));\n end = typeof categoryLabel.end === 'number' ? categoryLabel.end : Number(new Date(categoryLabel.end));\n startX = position + _this.calculateLeftPosition(axis, start, categoryLabel.start, axis.rect);\n startY = axis.multiLevelPosition[level].y;\n endX = position + _this.calculateWidth(axis, categoryLabel.end, end, axis.rect);\n labelSize = measureText(categoryLabel.text, multiLevel.textStyle);\n gap = ((categoryLabel.maximumTextWidth === null) ? Math.abs(endX - startX) : categoryLabel.maximumTextWidth) - padding;\n y = startY + (opposedPosition ? -((axis.xAxisMultiLabelHeight[level] - labelSize.height)) : labelSize.height);\n width = categoryLabel.maximumTextWidth ? categoryLabel.maximumTextWidth : labelSize.width;\n x = !isInversed ? startX + padding : startX - gap;\n if (multiLevel.alignment === 'Center') {\n x = ((endX - startX) / 2) + startX;\n x -= (labelSize.width > gap ? gap : labelSize.width) / 2;\n }\n else if (multiLevel.alignment === 'Far') {\n x = !isInversed ? endX - padding : startX - padding;\n x -= (labelSize.width > gap ? gap : labelSize.width);\n }\n else {\n x = !isInversed ? startX + padding : endX + padding;\n }\n if (multiLevel.overflow === 'None' && labelSize.width > Math.abs(endX - startX)) {\n x = !isInversed ? startX + padding : startX - labelSize.width - padding;\n anchor = 'start';\n }\n var textBasic = new TextBasic(x, y, anchor, categoryLabel.text, 0, 'translate(0,0)');\n var options = new TextOption(_this.heatMap.element.id + '_XAxis_MultiLevel' + level + '_Text' + i, textBasic, multiLevel.textStyle, multiLevel.textStyle.color || _this.heatMap.themeStyle.axisLabel);\n if (multiLevel.overflow === 'Wrap') {\n options.text = textWrap(categoryLabel.text, gap, multiLevel.textStyle);\n textLength = options.text.length;\n }\n else if (multiLevel.overflow === 'Trim') {\n options.text = textTrim(gap, categoryLabel.text, multiLevel.textStyle);\n textLength = 1;\n }\n if (multiLevel.overflow === 'Wrap' && options.text.length > 1) {\n _this.drawSvgCanvas.createWrapText(options, multiLevel.textStyle, labelElement);\n for (var i_2 = 0; i_2 < options.text.length; i_2++) {\n if (options.text[i_2].indexOf('...') !== -1) {\n tooltip = true;\n break;\n }\n }\n }\n else {\n _this.drawSvgCanvas.createText(options, labelElement, options.text);\n }\n if (!_this.heatMap.enableCanvasRendering) {\n parent.appendChild(labelElement);\n }\n if (options.text.indexOf('...') !== -1 || options.text[0].indexOf('...') !== -1 || tooltip) {\n _this.heatMap.tooltipCollection.push(new CanvasTooltip(categoryLabel.text, new Rect(x, y - labelSize.height, gap, labelSize.height * textLength)));\n }\n if (multiLevel.border.width > 0 && multiLevel.border.type !== 'WithoutBorder') {\n pathRect = _this.renderXAxisLabelBorder(level, axis, startX, startY, endX, pathRect, level, labelSize, gap, x);\n }\n });\n if (pathRect !== '') {\n _this.createBorderElement(level, axis, pathRect, parent);\n pathRect = '';\n }\n });\n if (!this.heatMap.enableCanvasRendering) {\n parent.appendChild(labelElement);\n }\n };\n /**\n * render x axis multi level labels border\n * @private\n * @return {void}\n */\n AxisHelper.prototype.renderXAxisLabelBorder = function (labelIndex, axis, startX, startY, endX, path, level, labelSize, gap, x) {\n var path1;\n var path2;\n var endY = startY + (axis.opposedPosition ? -(axis.xAxisMultiLabelHeight[labelIndex]) :\n axis.xAxisMultiLabelHeight[labelIndex]);\n switch (axis.multiLevelLabels[level].border.type) {\n case 'Rectangle':\n path += 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ' +\n 'L' + ' ' + endX + ' ' + endY + ' ' + 'L' + ' ' + endX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + startY + ' ';\n break;\n case 'WithoutTopBorder':\n path += 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ' +\n 'L' + ' ' + endX + ' ' + endY + ' ' + 'L' + ' ' + endX + ' ' + startY + ' ';\n break;\n case 'WithoutBottomBorder':\n path += 'M' + ' ' + startX + ' ' + endY + ' ' + 'L' + ' ' + startX + ' ' + startY + ' ' +\n 'L' + ' ' + endX + ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ';\n break;\n case 'WithoutTopandBottomBorder':\n path += 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ' +\n 'M' + ' ' + endX + ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ';\n break;\n case 'Brace':\n var padding = 3;\n path1 = axis.isInversed ? (labelSize.width > gap ? gap : labelSize.width) + x + padding : x - padding;\n path2 = axis.isInversed ? x - padding : (labelSize.width > gap ? gap : labelSize.width) + x + padding;\n path += 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + (startY + (endY - startY) / 2) + ' ' +\n 'L' + ' ' + path1 + ' ' + (startY + (endY - startY) / 2) + ' ' + 'M' + ' ' + path2 + ' ' + (startY +\n (endY - startY) / 2) + ' ' + 'L' + ' ' + endX + ' ' + (startY + (endY - startY) / 2) +\n ' ' + 'L' + ' ' + endX + ' ' + startY + ' ';\n break;\n }\n return path;\n };\n /**\n * render y axis multi level labels\n * @private\n * @return {void}\n */\n AxisHelper.prototype.renderYAxisMultiLevelLabels = function (axis, parent, rect) {\n var _this = this;\n var x = 0;\n var y;\n var padding = 10;\n var startX;\n var startY;\n var startY2;\n var endY;\n var start;\n var end;\n var labelSize;\n var anchor;\n var isInversed = axis.isInversed;\n var labelElement;\n var opposedPosition = axis.opposedPosition;\n var pathRect = '';\n var gap;\n var interval = (axis.rect.height / axis.axisLabelSize) / axis.increment;\n var text;\n var position = (!isInversed ? axis.rect.height : 0) + axis.rect.y;\n axis.multiLevelLabels.map(function (multiLevel, level) {\n startY2 = axis.multiLevelPosition[level].y;\n labelElement = _this.heatMap.renderer.createGroup({ id: _this.heatMap.element.id + '_YAxisMultiLevelLabel' + level });\n multiLevel.categories.map(function (categoryLabel, i) {\n start = typeof categoryLabel.start === 'number' ? categoryLabel.start : Number(new Date(categoryLabel.start));\n end = typeof categoryLabel.end === 'number' ? categoryLabel.end : Number(new Date(categoryLabel.end));\n startY = position + _this.calculateLeftPosition(axis, start, categoryLabel.start, axis.rect);\n startX = axis.multiLevelPosition[level].x;\n endY = position + _this.calculateWidth(axis, categoryLabel.start, end, axis.rect);\n labelSize = measureText(categoryLabel.text, multiLevel.textStyle);\n gap = ((categoryLabel.maximumTextWidth === null) ? Math.abs(startX) : categoryLabel.maximumTextWidth) - padding;\n var maxWidth = Math.abs(startX - (startX - axis.multiLevelSize[level].width - 2 * padding)) / 2 -\n (labelSize.width / 2);\n x = (axis.opposedPosition ? startX : startX - axis.multiLevelSize[level].width - 2 * padding) + maxWidth;\n y = startY + padding;\n if (multiLevel.overflow !== 'None') {\n if (multiLevel.overflow === 'Wrap') {\n text = textWrap(categoryLabel.text, gap, multiLevel.textStyle);\n }\n else {\n text = textTrim(gap, categoryLabel.text, multiLevel.textStyle);\n }\n }\n if (multiLevel.alignment === 'Center') {\n y += ((endY - startY) / 2 - (text.length * labelSize.height) / 2);\n }\n else if (multiLevel.alignment === 'Far') {\n y = isInversed ? endY - labelSize.height / 2 : y - labelSize.height;\n }\n else {\n y = isInversed ? y + labelSize.height / 2 : endY + labelSize.height;\n }\n if (multiLevel.border.width > 0 && multiLevel.border.type !== 'WithoutBorder') {\n pathRect = _this.renderYAxisLabelBorder(level, axis, startX, startY, endY, pathRect, level, labelSize, gap, y);\n }\n var textBasic = new TextBasic(x, y, 'start', categoryLabel.text, 0, 'translate(0,0)');\n var options = new TextOption(_this.heatMap.element.id + '_YAxis_MultiLevel' + level + '_Text' + i, textBasic, multiLevel.textStyle, multiLevel.textStyle.color || _this.heatMap.themeStyle.axisLabel);\n options.text = text;\n _this.drawSvgCanvas.createText(options, labelElement, options.text);\n if (options.text.indexOf('...') !== -1) {\n _this.heatMap.tooltipCollection.push(new CanvasTooltip(categoryLabel.text, new Rect(x, y - labelSize.height, gap, labelSize.height)));\n }\n if (!_this.heatMap.enableCanvasRendering) {\n parent.appendChild(labelElement);\n }\n });\n if (pathRect !== '') {\n _this.createBorderElement(level, axis, pathRect, parent);\n pathRect = '';\n }\n });\n if (!this.heatMap.enableCanvasRendering) {\n parent.appendChild(labelElement);\n }\n };\n /**\n * render x axis multi level labels border\n * @private\n * @return {void}\n */\n AxisHelper.prototype.renderYAxisLabelBorder = function (labelIndex, axis, startX, startY, endY, path, level, labelSize, gap, y) {\n var padding = 20;\n var path1;\n var path2;\n var endX = startX - (axis.opposedPosition ? -(axis.multiLevelSize[labelIndex].width + padding) :\n (axis.multiLevelSize[labelIndex].width + padding));\n switch (axis.multiLevelLabels[level].border.type) {\n case 'Rectangle':\n path += 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + startY + ' ' +\n 'L' + ' ' + endX + ' ' + endY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ' + 'L' + ' ' + startX + ' ' + startY + ' ';\n break;\n case 'WithoutTopBorder':\n path += 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + startY + ' ' +\n 'L' + ' ' + endX + ' ' + endY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ';\n break;\n case 'WithoutBottomBorder':\n path += 'M' + ' ' + endX + ' ' + startY + ' ' + 'L' + ' ' + startX + ' ' + startY + ' ' +\n 'L' + ' ' + startX + ' ' + endY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ';\n break;\n case 'WithoutTopandBottomBorder':\n path += 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + endX + ' ' + startY + ' ' +\n 'M' + ' ' + startX + ' ' + endY + ' ' + 'L' + ' ' + endX + ' ' + endY + ' ';\n break;\n case 'Brace':\n var padding_2 = 10;\n path1 = axis.isInversed ? (y - padding_2 - 5) : (y + (labelSize.height) - padding_2);\n path2 = axis.isInversed ? (y + (labelSize.height) - padding_2) : (y - padding_2 - 5);\n path += 'M' + ' ' + startX + ' ' + startY + ' ' + 'L' + ' ' + (startX + (endX - startX) / 2) + ' ' + startY + ' ' +\n 'L' + ' ' + (startX + (endX - startX) / 2) + ' ' + path1 + ' ' + 'M' + ' ' + (startX + (endX - startX) / 2) +\n ' ' + path2 + ' ' + 'L' + ' ' + (startX + (endX - startX) / 2) + ' ' +\n endY + ' ' + 'L' + ' ' + startX + ' ' + endY + ' ';\n break;\n }\n return path;\n };\n /**\n * create borer element\n * @return {void}\n * @private\n */\n AxisHelper.prototype.createBorderElement = function (borderIndex, axis, path, parent) {\n var canvasTranslate;\n var id = axis.orientation === 'Horizontal' ? 'XAxis' : 'YAxis';\n var pathOptions = new PathOption(this.heatMap.element.id + '_' + id + '_MultiLevel_Rect_' + borderIndex, 'Transparent', axis.multiLevelLabels[borderIndex].border.width, axis.multiLevelLabels[borderIndex].border.color, 1, '', path);\n var borderElement = this.heatMap.renderer.drawPath(pathOptions);\n if (!this.heatMap.enableCanvasRendering) {\n parent.appendChild(borderElement);\n }\n else {\n this.heatMap.canvasRenderer.drawPath(pathOptions, canvasTranslate);\n }\n };\n /**\n * calculate left position of border element\n * @private\n */\n AxisHelper.prototype.calculateLeftPosition = function (axis, start, label, rect) {\n var value;\n var interval;\n if (typeof label === 'number') {\n if (axis.valueType === 'Numeric' && (axis.minimum || axis.maximum)) {\n var min = axis.minimum ? axis.minimum : 0;\n start -= min;\n }\n var size = axis.orientation === 'Horizontal' ? rect.width : rect.height;\n interval = size / (axis.axisLabelSize * axis.increment);\n value = (axis.isInversed ? -1 : 1) * start * interval;\n value = axis.orientation === 'Horizontal' ? value : -value;\n }\n else {\n interval = this.calculateNumberOfDays(start, axis, true, rect);\n value = axis.isInversed ? -interval : interval;\n value = axis.orientation === 'Horizontal' ? value : -value;\n }\n return value;\n };\n /**\n * calculate width of border element\n * @private\n */\n AxisHelper.prototype.calculateWidth = function (axis, label, end, rect) {\n var interval;\n var value;\n if (typeof label === 'number') {\n if (axis.valueType === 'Numeric' && (axis.minimum || axis.maximum)) {\n var min = axis.minimum ? axis.minimum : 0;\n end -= min;\n }\n var size = axis.orientation === 'Horizontal' ? rect.width : rect.height;\n interval = size / (axis.axisLabelSize * axis.increment);\n value = (axis.isInversed ? -1 : 1) * (end + 1) * interval;\n value = axis.orientation === 'Horizontal' ? value : -value;\n }\n else {\n interval = this.calculateNumberOfDays(end, axis, false, rect);\n value = interval;\n value = axis.isInversed ? -value : value;\n value = axis.orientation === 'Horizontal' ? value : -value;\n }\n return value;\n };\n AxisHelper.prototype.calculateNumberOfDays = function (date, axis, start, rect) {\n var oneDay = 24 * 60 * 60 * 1000; // hours*minutes*seconds*milliseconds\n var oneMinute = 60 * 1000;\n var oneHour = 60 * 60 * 1000;\n var firstDate;\n var secondDate;\n var labels = axis.labelValue;\n var position;\n var interval = (axis.orientation === 'Horizontal' ? rect.width : rect.height) / axis.axisLabelSize;\n var givenDate = new Date(Number(date));\n var days = 0;\n for (var index = 0; index < axis.axisLabelSize; index++) {\n firstDate = new Date(Number(labels[index]));\n secondDate = axis.isInversed ? new Date(Number(labels[index - 1])) : new Date(Number(labels[index + 1]));\n if (index === (axis.isInversed ? 0 : axis.axisLabelSize - 1)) {\n secondDate = new Date(Number(labels[index]));\n if (axis.intervalType === 'Hours') {\n secondDate = new Date(Number(secondDate.setHours(secondDate.getHours() + 1)));\n }\n else if ((axis.intervalType === 'Minutes')) {\n secondDate = new Date(Number(secondDate.setMinutes(secondDate.getMinutes() + 1)));\n }\n else if ((axis.intervalType === 'Days')) {\n secondDate = new Date(Number(secondDate.setDate(secondDate.getDate() + 1)));\n }\n else {\n var numberOfDays = axis.intervalType === 'Months' ?\n new Date(secondDate.getFullYear(), secondDate.getMonth() + 1, 0).getDate() :\n secondDate.getFullYear() % 4 === 0 ? 366 : 365;\n secondDate = new Date(Number(secondDate.setDate(secondDate.getDate() + numberOfDays)));\n }\n }\n if (Number(firstDate) <= date && Number(secondDate) >= date) {\n if (axis.intervalType === 'Minutes' || axis.intervalType === 'Hours') {\n var totalMinutes = Math.round(Math.abs((firstDate.getTime() - secondDate.getTime()) / (oneMinute)));\n var minutesInHours = Math.abs((firstDate.getTime() - givenDate.getTime()) / (oneMinute));\n days = (interval / totalMinutes) * minutesInHours;\n index = axis.isInversed ? axis.axisLabelSize - 1 - index : index;\n position = index * interval + days;\n break;\n }\n else {\n var numberOfDays = Math.round(Math.abs((firstDate.getTime() - secondDate.getTime()) / (oneDay)));\n start ? givenDate.getDate() : givenDate.setDate(givenDate.getDate() + 1);\n if (numberOfDays !== 0) {\n days = (interval / numberOfDays) * (Math.abs((firstDate.getTime() - givenDate.getTime()) / (oneDay)));\n }\n index = axis.isInversed ? axis.axisLabelSize - 1 - index : index;\n position = index * interval + days;\n break;\n }\n }\n }\n return position;\n };\n return AxisHelper;\n}());\nexport { AxisHelper };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty, extend, merge, Complex, Browser, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { Rect, TextBasic, Path, PathAttributes, RectOption, CircleOption, TextOption, CurrentRect, DrawSvgCanvas } from '../utils/helper';\nimport { convertHexToColor, colorNameToHex, formatValue } from '../utils/helper';\nimport { CellColor } from '../utils/colorMapping';\nimport { Border, Font, BubbleTooltipData, BubbleSize } from '../model/base';\nimport { Theme } from '../model/theme';\n/**\n * Configures the CellSettings property in the Heatmap.\n */\nvar CellSettings = /** @class */ (function (_super) {\n __extends(CellSettings, _super);\n function CellSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], CellSettings.prototype, \"showLabel\", void 0);\n __decorate([\n Property('')\n ], CellSettings.prototype, \"format\", void 0);\n __decorate([\n Property(true)\n ], CellSettings.prototype, \"enableCellHighlighting\", void 0);\n __decorate([\n Complex({}, BubbleSize)\n ], CellSettings.prototype, \"bubbleSize\", void 0);\n __decorate([\n Complex({}, Border)\n ], CellSettings.prototype, \"border\", void 0);\n __decorate([\n Complex(Theme.rectLabelFont, Font)\n ], CellSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property('Rect')\n ], CellSettings.prototype, \"tileType\", void 0);\n __decorate([\n Property('Color')\n ], CellSettings.prototype, \"bubbleType\", void 0);\n __decorate([\n Property(false)\n ], CellSettings.prototype, \"isInversedBubbleSize\", void 0);\n return CellSettings;\n}(ChildProperty));\nexport { CellSettings };\nvar Series = /** @class */ (function () {\n function Series(heatMap) {\n this.heatMap = heatMap;\n this.drawSvgCanvas = new DrawSvgCanvas(this.heatMap);\n this.cellColor = new CellColor(this.heatMap);\n }\n /**\n * To render rect series.\n * @return {void}\n * @private\n */\n // tslint:disable-next-line:max-func-body-length\n Series.prototype.renderRectSeries = function () {\n this.createSeriesGroup();\n var heatMap = this.heatMap;\n var isValueInRange = false;\n heatMap.xLength = heatMap.axisCollections[0].axisLabelSize;\n heatMap.yLength = heatMap.axisCollections[1].axisLabelSize; // Series Part\n var tempX = Math.round(heatMap.initialClipRect.x * 100) / 100;\n var tempY = Math.round(heatMap.initialClipRect.y * 100) / 100;\n var dataXIndex = 0;\n var dataYIndex = 0;\n var cellSetting = heatMap.cellSettings;\n var tempWidth = Math.round(((heatMap.initialClipRect.width -\n (cellSetting.border.width / 2)) / heatMap.xLength) * 100) / 100;\n var tempHeight = Math.round(((heatMap.initialClipRect.height -\n (cellSetting.border.width / 2)) / heatMap.yLength) * 100) / 100;\n var tempVal = 0;\n var themeStyle = heatMap.themeStyle;\n var tempBorder;\n var tempRectPosition = [];\n var circleRadius;\n tempBorder = cellSetting.border;\n var borderColor;\n var displayText;\n this.rectPositionCollection = [];\n this.color = '';\n this.bubbleColorValue = [];\n if (heatMap.yAxis.opposedPosition) {\n tempX = Math.round((heatMap.initialClipRect.x + (parseFloat(tempBorder.width.toString()) / 2)) * 100) / 100;\n }\n circleRadius = this.getBubbleRadius(tempWidth, tempHeight);\n for (var x = 0; x < (heatMap.xLength * heatMap.yLength); x++) {\n this.setTextAndColor(dataXIndex, dataYIndex);\n var rectPosition = new CurrentRect(0, 0, 0, 0, 0, '', 0, 0, 0, 0, true, '', '', true);\n borderColor = tempBorder.color;\n if ((heatMap.renderingMode === 'Canvas' && parseFloat(tempBorder.width.toString()) === 0) || (!borderColor &&\n cellSetting.tileType === 'Bubble' && cellSetting.bubbleType === 'Sector')) {\n borderColor = this.color;\n }\n if (this.heatMap.bubbleSizeWithColor) {\n this.updateRectDetails(rectPosition, tempX, tempY, tempWidth, tempHeight, extend('', this.bubbleColorValue, null, true), x, dataYIndex, dataXIndex);\n }\n else {\n this.updateRectDetails(rectPosition, tempX, tempY, tempWidth, tempHeight, this.text, x, dataYIndex, dataXIndex);\n }\n if (cellSetting.showLabel) {\n displayText = this.getFormatedText(this.text, cellSetting.format);\n rectPosition.displayText = displayText;\n if (!isNullOrUndefined(this.heatMap.cellRender)) {\n displayText = this.cellRendering(rectPosition, displayText);\n }\n }\n if (cellSetting.tileType === 'Rect') { // Rectangle/Tile Series\n this.renderTileCell(rectPosition, tempBorder, x, this.color, borderColor);\n this.updateLabelVisibleStatus(tempWidth, tempHeight, displayText);\n }\n else {\n if (cellSetting.bubbleType === 'Color') { // Bubble by same size and different color Series\n this.renderBubbleCell(rectPosition, tempBorder, x, this.color, borderColor, circleRadius);\n this.updateLabelVisibleStatus((circleRadius * 2) - 12, (circleRadius * 2) - 6, displayText); // 6, 12 - circle padding\n }\n else if (!isNullOrUndefined(this.text) && (cellSetting.bubbleType === 'Size' || cellSetting.bubbleType === 'SizeAndColor')\n && this.text.toString() !== '') { // Bubble by same color and different size Series\n var tempCircleRadius = this.getRadiusBypercentage(parseFloat(this.text.toString()), heatMap.dataSourceMinValue, heatMap.dataSourceMaxValue, circleRadius);\n this.renderBubbleCell(rectPosition, tempBorder, x, this.color, borderColor, tempCircleRadius);\n this.updateLabelVisibleStatus((tempCircleRadius * 2) - 12, (tempCircleRadius * 2) - 6, displayText);\n }\n else if (cellSetting.bubbleType === 'Sector' && !isNullOrUndefined(this.text) && this.text.toString() !== '') {\n this.renderSectorCell(rectPosition, tempBorder, x.toString(), this.color, borderColor, circleRadius, this.text);\n this.checkLabelXDisplay = false;\n this.checkLabelYDisplay = false;\n }\n }\n tempRectPosition.push(rectPosition);\n if (heatMap.rangeSelection && heatMap.paletteSettings.type === 'Fixed') {\n isValueInRange = this.isCellValueInRange(dataXIndex, dataYIndex);\n rectPosition.visible = isValueInRange;\n }\n if (cellSetting.showLabel && this.checkLabelYDisplay && this.checkLabelXDisplay) {\n var themeCellTextStyle = cellSetting.textStyle;\n var options = new TextOption(heatMap.element.id + '_HeatMapRectLabels_' + x, new TextBasic(Math.round((tempX + tempWidth / 2) * 100) / 100, Math.round((tempY + tempHeight / 2) * 100) / 100, 'middle', displayText, null, null, 'middle'), themeCellTextStyle, themeCellTextStyle.color || this.getSaturatedColor(this.color));\n rectPosition.textId = options.id;\n if (heatMap.rangeSelection && heatMap.paletteSettings.type === 'Fixed') {\n options.fill = isValueInRange ? options.fill : this.heatMap.themeStyle.toggledColor;\n }\n if (Browser.isIE && !heatMap.enableCanvasRendering) {\n options.dy = this.heatMap.cellSettings.tileType === 'Bubble' ? '0.5ex' : '1ex';\n }\n this.drawSvgCanvas.createText(options, this.containerTextObject, displayText);\n }\n if (tempVal === heatMap.xLength - 1) {\n tempY = Math.round((tempY + tempHeight) * 100) / 100;\n tempVal = 0;\n dataYIndex = 0;\n if (heatMap.yAxis.opposedPosition) {\n tempX = Math.round((heatMap.initialClipRect.x + (parseFloat(tempBorder.width.toString()) / 2)) * 100) / 100;\n }\n else {\n tempX = Math.round(heatMap.initialClipRect.x * 100) / 100;\n }\n this.rectPositionCollection.push(tempRectPosition);\n tempRectPosition = [];\n dataXIndex++;\n }\n else {\n tempX = Math.round((tempX + tempWidth) * 100) / 100;\n tempVal++;\n dataYIndex++;\n }\n }\n if (!heatMap.enableCanvasRendering) {\n heatMap.svgObject.appendChild(this.containerRectObject);\n if (cellSetting.showLabel && !(cellSetting.tileType === 'Bubble' && cellSetting.bubbleType === 'Sector')) {\n heatMap.svgObject.appendChild(this.containerTextObject);\n }\n }\n };\n /**\n * To toggle the cell text color based on legend selection.\n */\n Series.prototype.isCellValueInRange = function (dataXIndex, dataYIndex) {\n var isValueInRange = false;\n for (var i = 0; i < this.heatMap.toggleValue.length; i++) {\n var minValue = void 0;\n var maxValue = void 0;\n minValue = (i === 0) ? this.heatMap.dataSourceMinValue : this.heatMap.toggleValue[i].value;\n if (this.heatMap.cellSettings.tileType === 'Bubble' && this.heatMap.cellSettings.bubbleType === 'SizeAndColor') {\n maxValue = (i === this.heatMap.toggleValue.length - 1) ? this.heatMap.maxColorValue :\n this.heatMap.toggleValue[i + 1].value - 0.01;\n }\n else {\n maxValue = (i === this.heatMap.toggleValue.length - 1) ? this.heatMap.dataSourceMaxValue :\n this.heatMap.toggleValue[i + 1].value - 0.01;\n }\n // tslint:disable-next-line:no-any\n var clonedDataSource = this.heatMap.clonedDataSource;\n var bubbleText = !isNullOrUndefined(clonedDataSource[dataXIndex][dataYIndex][1]) &&\n clonedDataSource[dataXIndex][dataYIndex][1].toString() !== '' ? clonedDataSource[dataXIndex][dataYIndex][1] : '';\n var text = parseFloat(this.heatMap.cellSettings.tileType === 'Bubble' && this.heatMap.cellSettings.bubbleType === 'SizeAndColor' ?\n bubbleText.toString() : this.text.toString());\n if (isNaN(text)) {\n isValueInRange = true;\n }\n else if (!isNaN(text) && text >= minValue && text <= maxValue) {\n if (!this.heatMap.toggleValue[i].visible) {\n isValueInRange = false;\n break;\n }\n else {\n isValueInRange = true;\n break;\n }\n }\n }\n return isValueInRange;\n };\n /**\n * To customize the cell.\n * @return {void}\n * @private\n */\n Series.prototype.cellRendering = function (rectPosition, text) {\n var xAxis = this.heatMap.axisCollections[0];\n var yAxis = this.heatMap.axisCollections[1];\n var xLabels = xAxis.tooltipLabels;\n var yLabels = yAxis.tooltipLabels.slice().reverse();\n var yLabelValue = yAxis.labelValue.slice().reverse();\n var argData = {\n heatmap: this.heatMap,\n cancel: false,\n name: 'cellRender',\n value: rectPosition.value,\n xLabel: xLabels[rectPosition.xIndex].toString(),\n yLabel: yLabels[rectPosition.yIndex].toString(),\n displayText: text,\n xValue: xAxis.labelValue[rectPosition.xIndex],\n yValue: yLabelValue[rectPosition.yIndex]\n };\n this.heatMap.trigger('cellRender', argData);\n return argData.displayText;\n };\n /**\n * To set color and text details.\n * @private\n */\n Series.prototype.setTextAndColor = function (dataXIndex, dataYIndex) {\n var cellSetting = this.heatMap.cellSettings;\n this.bubbleColorValue = [];\n var adaptData = this.heatMap.dataSource;\n // tslint:disable-next-line:no-any\n var clonedDataSource = this.heatMap.clonedDataSource;\n if (this.heatMap.bubbleSizeWithColor) {\n this.text = !isNullOrUndefined(clonedDataSource[dataXIndex][dataYIndex][0]) &&\n clonedDataSource[dataXIndex][dataYIndex][0].toString() !== '' ? clonedDataSource[dataXIndex][dataYIndex][0] : '';\n this.color = !isNullOrUndefined(clonedDataSource[dataXIndex][dataYIndex][1]) &&\n clonedDataSource[dataXIndex][dataYIndex][1].toString() !== '' ?\n this.cellColor.getColorByValue(clonedDataSource[dataXIndex][dataYIndex][1])\n : this.heatMap.isColorValueExist ? this.heatMap.emptyPointColor : this.cellColor.getColorByValue(this.text);\n var tempBubbleCollection = new BubbleTooltipData(adaptData.isJsonData && adaptData.adaptorType === 'Cell' ? this.heatMap.dataSource.bubbleDataMapping.size : null, this.text, 'Size');\n this.bubbleColorValue.push(tempBubbleCollection);\n this.bubbleColorValue.push({\n mappingName: adaptData.isJsonData && adaptData.adaptorType === 'Cell' ?\n this.heatMap.dataSource.bubbleDataMapping.color : null,\n bubbleData: !isNullOrUndefined(clonedDataSource[dataXIndex][dataYIndex][1]) &&\n clonedDataSource[dataXIndex][dataYIndex][1].toString() !== '' ? clonedDataSource[dataXIndex][dataYIndex][1] : '',\n valueType: 'Color'\n });\n }\n else {\n this.text = clonedDataSource[dataXIndex][dataYIndex];\n this.color = this.cellColor.getColorByValue(this.text);\n }\n };\n /**\n * To update rect details.\n * @private\n */\n Series.prototype.createSeriesGroup = function () {\n if (!this.heatMap.enableCanvasRendering) {\n this.containerRectObject = this.heatMap.renderer.createGroup({\n id: this.heatMap.element.id + '_Container_RectGroup',\n x: this.heatMap.initialClipRect.x, y: this.heatMap.initialClipRect.y, transform: 'translate( 0, 0)'\n });\n if (this.heatMap.cellSettings.showLabel &&\n !(this.heatMap.cellSettings.tileType === 'Bubble' && this.heatMap.cellSettings.bubbleType === 'Sector')) {\n this.containerTextObject = this.heatMap.renderer.createGroup({ id: this.heatMap.element.id + '_Container_TextGroup', transform: 'translate( 0, 0)' });\n }\n }\n };\n /**\n * To update rect details.\n * @private\n */\n Series.prototype.updateRectDetails = function (rectPosition, tempX, tempY, tempWidth, tempHeight, text, x, dataXIndex, dataYIndex) {\n rectPosition.x = tempX;\n rectPosition.y = tempY;\n rectPosition.width = tempWidth;\n rectPosition.height = tempHeight;\n rectPosition.value = text;\n rectPosition.id = this.heatMap.element.id + '_HeatMapRect_' + x;\n rectPosition.xIndex = dataXIndex;\n rectPosition.yIndex = dataYIndex;\n };\n /**\n * To Render Tile Cell.\n * @private\n */\n Series.prototype.renderTileCell = function (rectPosition, tempBorder, x, color, borderColor) {\n var rect = new RectOption(this.heatMap.element.id + '_HeatMapRect_' + x, color, tempBorder, 1, new Rect(rectPosition.x, rectPosition.y, rectPosition.width, rectPosition.height), borderColor || this.heatMap.themeStyle.cellBorder, tempBorder.radius, tempBorder.radius);\n this.drawSvgCanvas.drawRectangle(rect, this.containerRectObject, true);\n };\n /**\n * To get bubble radius.\n * @private\n */\n Series.prototype.getBubbleRadius = function (width, height) {\n var radius = (width / 2) - 2;\n if (height / 2 < width / 2) {\n radius = (height / 2) - 2;\n }\n return radius < 0 ? 0 : radius;\n };\n /**\n * To Render Bubble Cell.\n * @private\n */\n Series.prototype.renderSectorCell = function (bubblePosition, tempBorder, x, color, borderColor, circleRadius, text) {\n var curve;\n var startAngle;\n var endAngle;\n var cX;\n var cY;\n var X1;\n var Y1;\n var tempcX;\n var tempcY;\n var pathBorderWidth;\n var centerX = Math.round((bubblePosition.x + (bubblePosition.width / 2)) * 100) / 100;\n var centerY = Math.round((bubblePosition.y + (bubblePosition.height / 2)) * 100) / 100;\n var tempColor = color;\n var sectorContibution = this.getRadiusBypercentage(text, this.heatMap.dataSourceMinValue, this.heatMap.dataSourceMaxValue, 360); // Circle total angle.\n for (var y = 0; y < 2; y++) {\n pathBorderWidth = parseFloat(tempBorder.width.toString());\n if (y === 0) {\n curve = sectorContibution >= 180 ? 1 : 0;\n startAngle = -90;\n if (sectorContibution === 0) {\n endAngle = 270; // (360 - 90) for zero position adjustment.\n }\n else {\n endAngle = (sectorContibution - 90);\n }\n cX = Math.round((centerX + circleRadius * Math.cos((sectorContibution - 90) * (Math.PI / 180))) * 100) / 100;\n cY = Math.round((centerY + circleRadius * Math.sin((sectorContibution - 90) * (Math.PI / 180))) * 100) / 100;\n X1 = Math.round(centerX * 100) / 100;\n Y1 = Math.round((centerY - circleRadius) * 100) / 100;\n if (sectorContibution === 0) {\n tempColor = this.heatMap.emptyPointColor;\n }\n }\n else {\n curve = sectorContibution >= 180 ? 0 : 1;\n startAngle = endAngle;\n endAngle = 270; // (360 - 90) for zero position adjustment.\n tempColor = this.heatMap.emptyPointColor;\n x = x + '_Unfilled';\n tempcX = cX;\n tempcY = cY;\n cX = X1;\n cY = Y1;\n X1 = tempcX;\n Y1 = tempcY;\n if (sectorContibution === 0) {\n pathBorderWidth = 1;\n borderColor = color;\n }\n }\n var path = new Path('', false, centerX, centerY, X1, Y1, cX, cY, startAngle, endAngle, circleRadius, true);\n var sector = new PathAttributes(this.heatMap.element.id + '_HeatMapRect_' + x, path, tempColor, tempBorder, pathBorderWidth, 1, borderColor);\n this.calculateShapes(sector, path, sectorContibution, curve);\n this.drawSvgCanvas.drawPath(sector, path, this.containerRectObject);\n if (sectorContibution === 360) {\n break;\n }\n }\n };\n /**\n * To Render sector Cell.\n * @private\n */\n Series.prototype.calculateShapes = function (options, path, sectorContibution, curve) {\n var pathString;\n var clockWise;\n switch (sectorContibution) {\n case 360:\n case 0:\n if (sectorContibution === 0 && path.start === path.end) {\n pathString = 'M' + ' ' + options.x + ' ' + options.y + ' ' + 'L' + ' ' + path.x + ' ' + (path.y - path.radius);\n }\n else {\n pathString = !this.heatMap.enableCanvasRendering ? 'M' + ' ' + options.x + ' ' + options.y + ' ' : '';\n pathString = pathString + 'm' + ' ' + (-path.radius) + ' ' + '0' + ' ' +\n 'a' + ' ' + path.radius + ' ' + path.radius + ' ' + '0' + ' ' + '1' + ' ' + '0' +\n ' ' + (path.radius * 2) + ' ' + '0' + ' ' + 'a' + ' ' + path.radius +\n ' ' + path.radius + ' ' + '0' + ' ' + '1' + ' ' + '0' +\n ' ' + (-(path.radius * 2)) + ' ' + '0' + ' ';\n }\n merge(options, { 'd': pathString });\n break;\n default:\n pathString = 'M' + ' ' + options.x + ' ' + options.y + ' ' + 'L' + ' ' + path.x1 + ' ' + path.y1 + ' ' +\n 'A' + ' ' + path.radius + ' ' + path.radius + ' ' + '0' + ' ' + curve + ' ' + '1' + ' ' +\n path.cx + ' ' + path.cy + ' ' + 'Z';\n merge(options, { 'd': pathString });\n break;\n }\n };\n /**\n * To Render Bubble Cell.\n * @private\n */\n Series.prototype.renderBubbleCell = function (bubblePosition, tempBorder, x, color, borderColor, circleRadius) {\n var circle = new CircleOption(this.heatMap.element.id + '_HeatMapRect_' + x, color, tempBorder, 1, borderColor || this.heatMap.themeStyle.cellBorder, Math.round((bubblePosition.x + (bubblePosition.width / 2)) * 100) / 100, Math.round((bubblePosition.y + (bubblePosition.height / 2)) * 100) / 100, circleRadius);\n this.drawSvgCanvas.drawCircle(circle, this.containerRectObject);\n };\n /**\n * To find whether the X,Y Label need to display or not.\n * @private\n */\n Series.prototype.updateLabelVisibleStatus = function (tempWidth, tempHeight, displayText) {\n if (this.heatMap.cellSettings.showLabel) {\n this.checkLabelYDisplay = tempHeight > parseInt(this.heatMap.cellSettings.textStyle.size, 10) ? true : false;\n this.checkLabelXDisplay = tempWidth > (displayText.length *\n (parseInt(this.heatMap.cellSettings.textStyle.size, 10) / 2)) ? true : false;\n }\n };\n /**\n * To find percentage value.\n * @private\n */\n Series.prototype.getRadiusBypercentage = function (text, min, max, radius) {\n var minimum = parseInt(this.heatMap.cellSettings.bubbleSize.minimum, 10);\n var maximum = parseInt(this.heatMap.cellSettings.bubbleSize.maximum, 10);\n if (minimum < 0 || minimum > 100 || isNaN(minimum)) {\n minimum = 0;\n }\n if (maximum < 0 || maximum > 100 || isNaN(maximum)) {\n maximum = 100;\n }\n var valueInPrecentage = ((text - min) /\n (max - min)) * 100;\n valueInPrecentage = isNaN(valueInPrecentage) ? 100 : valueInPrecentage;\n if ((this.heatMap.bubbleSizeWithColor ||\n (this.heatMap.cellSettings.tileType === 'Bubble' && this.heatMap.cellSettings.bubbleType === 'Size'))) {\n if (this.heatMap.cellSettings.isInversedBubbleSize) {\n valueInPrecentage = 100 - valueInPrecentage;\n }\n valueInPrecentage = ((valueInPrecentage * (maximum - minimum)) / 100) + minimum;\n }\n radius = radius * (valueInPrecentage / 100);\n return (Math.round(radius * 100) / 100) < 0 ? 0 : (Math.round(radius * 100) / 100);\n };\n /**\n * To find saturated color for datalabel.\n * @return {string}\n * @private\n */\n Series.prototype.getSaturatedColor = function (color) {\n var saturatedColor = color;\n saturatedColor = (saturatedColor === 'transparent') ? window.getComputedStyle(document.body, null).backgroundColor : saturatedColor;\n var rgbValue = convertHexToColor(colorNameToHex(saturatedColor));\n var contrast = Math.round((rgbValue.R * 299 + rgbValue.G * 587 + rgbValue.B * 114) / 1000);\n return contrast >= 128 ? 'black' : 'white';\n };\n /**\n * To highlight the mouse hovered rect cell.\n * @return {void}\n * @private\n */\n Series.prototype.highlightSvgRect = function (tempID) {\n if (tempID.indexOf('Celltooltip') === -1) {\n if (tempID.indexOf('_HeatMapRect') !== -1) {\n if (tempID.indexOf('_HeatMapRectLabels_') !== -1) {\n var tempIndex = tempID.indexOf('_HeatMapRectLabels_') + 19;\n tempID = this.heatMap.element.id + '_HeatMapRect_' + tempID.slice(tempIndex);\n }\n var element = document.getElementById(tempID);\n if (this.heatMap.tempRectHoverClass !== tempID) {\n if (this.heatMap.cellSettings.enableCellHighlighting) {\n var oldElement = document.getElementById(this.heatMap.tempRectHoverClass);\n if (oldElement && !this.heatMap.rectSelected) {\n oldElement.setAttribute('opacity', '1');\n }\n if (element && !this.heatMap.rectSelected) {\n element.setAttribute('opacity', '0.65');\n }\n }\n this.heatMap.tempRectHoverClass = tempID;\n }\n }\n else {\n if (this.heatMap.cellSettings.enableCellHighlighting) {\n var oldElement = document.getElementById(this.heatMap.tempRectHoverClass);\n if (oldElement && !this.heatMap.rectSelected) {\n oldElement.setAttribute('opacity', '1');\n this.heatMap.tempRectHoverClass = '';\n }\n }\n }\n }\n };\n /**\n * To get the value depends to format.\n * @return {string}\n * @private\n */\n Series.prototype.getFormatedText = function (val, getFormat) {\n var format = getFormat;\n var isCustom = format.match('{value}') !== null;\n this.format = this.heatMap.intl.getNumberFormat({\n format: isCustom ? '' : format\n });\n var value = '';\n if (val.toString() !== '') {\n value = formatValue(isCustom, format, val, this.format);\n }\n return value;\n };\n /**\n * To get mouse hovered cell details.\n * @return {CurrentRect}\n * @private\n */\n Series.prototype.getCurrentRect = function (x, y) {\n var currentRect;\n var firstRectDetails = [];\n firstRectDetails.push(this.heatMap.heatMapSeries.rectPositionCollection[0][0]);\n var rectX = Math.ceil((x - firstRectDetails[0].x) / firstRectDetails[0].width) <\n this.heatMap.axisCollections[0].axisLabelSize ?\n Math.ceil((x - firstRectDetails[0].x) / firstRectDetails[0].width) :\n this.heatMap.axisCollections[0].axisLabelSize;\n var rectY = Math.floor(((y - firstRectDetails[0].y) / firstRectDetails[0].height)) <\n this.heatMap.axisCollections[1].axisLabelSize ?\n Math.floor(((y - firstRectDetails[0].y) / firstRectDetails[0].height)) :\n this.heatMap.axisCollections[1].axisLabelSize - 1;\n rectX = rectX === 0 ? 1 : rectX;\n currentRect = this.heatMap.heatMapSeries.rectPositionCollection[rectY][rectX - 1];\n this.hoverXAxisLabel = this.heatMap.axisCollections[0].tooltipLabels[rectX - 1];\n this.hoverXAxisValue = this.heatMap.axisCollections[0].labelValue[rectX - 1];\n this.hoverYAxisLabel = this.heatMap.axisCollections[1].tooltipLabels[(this.heatMap.axisCollections[1].tooltipLabels.length - 1) - rectY];\n this.hoverYAxisValue = this.heatMap.axisCollections[1].labelValue[(this.heatMap.axisCollections[1].labelValue.length - 1) - rectY];\n return currentRect;\n };\n return Series;\n}());\nexport { Series };\n","/**\n * HeatMap tool tip file\n */\nvar __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { createElement, Property, Complex, ChildProperty, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { Tooltip as tool } from '@syncfusion/ej2-svg-base';\nimport { TooltipBorder, Font, } from '../model/base';\nimport { Theme } from '../model/theme';\n/**\n * Configures the color property in Heatmap.\n */\nvar TooltipSettings = /** @class */ (function (_super) {\n __extends(TooltipSettings, _super);\n function TooltipSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], TooltipSettings.prototype, \"fill\", void 0);\n __decorate([\n Complex({}, TooltipBorder)\n ], TooltipSettings.prototype, \"border\", void 0);\n __decorate([\n Complex(Theme.tooltipFont, Font)\n ], TooltipSettings.prototype, \"textStyle\", void 0);\n return TooltipSettings;\n}(ChildProperty));\nexport { TooltipSettings };\n/**\n *\n * The `Tooltip` module is used to render the tooltip for heatmap series.\n */\nvar Tooltip = /** @class */ (function () {\n function Tooltip(heatMap) {\n /* private */\n this.isFirst = true;\n /* private */\n this.isFadeout = false;\n this.heatMap = heatMap;\n }\n /**\n * Get module name\n */\n Tooltip.prototype.getModuleName = function () {\n return 'Tooltip';\n };\n /**\n * To show/hide Tooltip.\n * @private\n */\n Tooltip.prototype.showHideTooltip = function (isShow, isFadeout) {\n var ele = document.getElementById(this.heatMap.element.id + 'Celltooltipcontainer');\n if (!isShow) {\n if (ele && ele.style.visibility !== 'hidden') {\n if (this.tooltipObject && isFadeout) {\n this.tooltipObject.fadeOut();\n }\n else {\n if (this.tooltipObject && this.tooltipObject.element) {\n var tooltipElement = this.tooltipObject.element.firstChild;\n tooltipElement.setAttribute('opacity', '0');\n }\n }\n ele.style.visibility = 'hidden';\n }\n this.isFadeout = true;\n }\n else {\n ele.style.visibility = 'visible';\n }\n };\n /**\n * To destroy the Tooltip.\n * @return {void}\n * @private\n */\n Tooltip.prototype.destroy = function (heatMap) {\n /**\n * Destroy method performed here\n */\n };\n ;\n /**\n * To add Tooltip to the rect cell.\n * @return {void}\n * @private\n */\n Tooltip.prototype.createTooltip = function (x, y, tempTooltipText) {\n var offset = null;\n if (this.heatMap.cellSettings.showLabel && this.heatMap.heatMapSeries.checkLabelXDisplay &&\n this.heatMap.heatMapSeries.checkLabelYDisplay) {\n offset = parseInt(this.heatMap.cellSettings.textStyle.size, 10) / 2;\n }\n this.tooltipObject = new tool({\n enableAnimation: false,\n offset: offset,\n location: { x: x, y: y },\n theme: this.heatMap.theme,\n content: tempTooltipText,\n fill: this.heatMap.tooltipSettings.fill,\n border: {\n width: this.heatMap.tooltipSettings.border.width,\n color: this.heatMap.tooltipSettings.border.color\n },\n textStyle: {\n size: this.heatMap.tooltipSettings.textStyle.size,\n fontWeight: this.heatMap.tooltipSettings.textStyle.fontWeight,\n color: this.heatMap.tooltipSettings.textStyle.color,\n fontStyle: this.heatMap.tooltipSettings.textStyle.fontStyle,\n fontFamily: this.heatMap.tooltipSettings.textStyle.fontFamily\n },\n areaBounds: {\n height: this.heatMap.initialClipRect.height + this.heatMap.initialClipRect.y,\n width: this.heatMap.initialClipRect.width, x: this.heatMap.initialClipRect.x\n },\n }, '#' + this.heatMap.element.id + 'Celltooltipcontainer');\n };\n /**\n * To create div container for tooltip.\n * @return {void}\n * @private\n */\n Tooltip.prototype.createTooltipDiv = function (heatMap) {\n var element2 = createElement('div', {\n id: this.heatMap.element.id + 'Celltooltipcontainer',\n styles: 'position:absolute; z-index: 3'\n });\n this.heatMap.element.appendChild(createElement('div', {\n id: this.heatMap.element.id + 'Celltooltipparent',\n styles: 'position:relative'\n })\n .appendChild(element2));\n };\n /**\n * To get default tooltip content.\n * @private\n */\n Tooltip.prototype.getTooltipContent = function (currentRect, hetmapSeries) {\n var value;\n var content;\n var heatMap = this.heatMap;\n var adaptData = this.heatMap.dataSource;\n if (heatMap.bubbleSizeWithColor) {\n var xAxis = heatMap.xAxis.title && heatMap.xAxis.title.text !== '' ? heatMap.xAxis.title.text : 'X-Axis';\n var yAxis = heatMap.yAxis.title && heatMap.yAxis.title.text !== '' ? heatMap.yAxis.title.text : 'Y-Axis';\n var value1 = adaptData.isJsonData && adaptData.adaptorType === 'Cell' ?\n heatMap.dataSource.bubbleDataMapping.size : 'Value 1';\n var value2 = adaptData.isJsonData && adaptData.adaptorType === 'Cell' ?\n heatMap.dataSource.bubbleDataMapping.color : 'Value 2';\n value = hetmapSeries.getFormatedText(currentRect.value[0].bubbleData, this.heatMap.cellSettings.format);\n content = [xAxis + ' : ' + hetmapSeries.hoverXAxisLabel + ''\n + yAxis + ' : ' + hetmapSeries.hoverYAxisLabel + '
'\n + value1 + ' : ' + value + '
'\n + value2 + ' : '\n + hetmapSeries.getFormatedText(currentRect.value[1].bubbleData, this.heatMap.cellSettings.format)];\n }\n else {\n value = currentRect.value;\n content = [hetmapSeries.hoverXAxisLabel + ' | ' + hetmapSeries.hoverYAxisLabel + ' : ' +\n hetmapSeries.getFormatedText(value, this.heatMap.cellSettings.format)];\n }\n return content;\n };\n /**\n * To render tooltip.\n * @private\n */\n Tooltip.prototype.renderTooltip = function (currentRect) {\n var hetmapSeries = this.heatMap.heatMapSeries;\n var tempTooltipText = [''];\n var showTooltip = this.heatMap.bubbleSizeWithColor ?\n !isNullOrUndefined(currentRect.value) && !isNullOrUndefined(currentRect.value[0].bubbleData)\n && currentRect.value[0].bubbleData.toString() !== '' ? true : false\n : isNullOrUndefined(currentRect.value) || (!isNullOrUndefined(currentRect.value) &&\n currentRect.value.toString() === '') ? false : true;\n if (!showTooltip) {\n this.showHideTooltip(false, false);\n }\n else {\n if (!isNullOrUndefined(this.heatMap.tooltipRender)) {\n // this.tooltipObject.header = '';\n // this.tooltipObject.content = this.getTemplateText(\n // currentRect, this.heatMap.tooltipTemplate, hetmapSeries.hoverXAxisLabel,\n // hetmapSeries.hoverYAxisLabel);\n var content = this.getTooltipContent(currentRect, hetmapSeries);\n var argData = {\n heatmap: this.heatMap,\n cancel: false,\n name: 'tooltipRender',\n value: currentRect.value,\n xValue: this.heatMap.heatMapSeries.hoverXAxisValue,\n yValue: this.heatMap.heatMapSeries.hoverYAxisValue,\n xLabel: this.heatMap.heatMapSeries.hoverXAxisLabel ?\n this.heatMap.heatMapSeries.hoverXAxisLabel.toString() : null,\n yLabel: this.heatMap.heatMapSeries.hoverYAxisLabel ?\n this.heatMap.heatMapSeries.hoverYAxisLabel.toString() : null,\n content: content\n };\n this.heatMap.trigger('tooltipRender', argData);\n if (!argData.cancel) {\n tempTooltipText = argData.content;\n }\n else {\n if (this.tooltipObject) {\n this.showHideTooltip(false);\n }\n return;\n }\n }\n else {\n // this.tooltipObject.header = hetmapSeries.hoverYAxisLabel.toString();\n tempTooltipText = this.getTooltipContent(currentRect, hetmapSeries);\n }\n if (!this.tooltipObject) {\n this.createTooltip(currentRect.x + (currentRect.width / 2), currentRect.y + (currentRect.height / 2), tempTooltipText);\n }\n else {\n this.tooltipObject.content = tempTooltipText;\n }\n this.showHideTooltip(true);\n this.tooltipObject.enableAnimation = (this.isFirst || this.isFadeout) ? false : true;\n this.isFirst = (this.isFirst) ? false : this.isFirst;\n this.isFadeout = (this.isFadeout) ? false : this.isFadeout;\n this.tooltipObject.location.x = currentRect.x + (currentRect.width / 2);\n this.tooltipObject.location.y = currentRect.y + (currentRect.height / 2);\n }\n if (!currentRect.visible) {\n this.showHideTooltip(false, false);\n }\n };\n return Tooltip;\n}());\nexport { Tooltip };\n","import { extend, isNullOrUndefined } from '@syncfusion/ej2-base';\nvar TwoDimensional = /** @class */ (function () {\n function TwoDimensional(heatMap) {\n this.heatMap = heatMap;\n }\n /**\n * To reconstruct proper two dimensional dataSource depends on min and max values.\n * @private\n */\n TwoDimensional.prototype.processDataSource = function (dataSource) {\n // tslint:disable-next-line:no-any\n var tempCloneData = extend([], dataSource, null, true);\n this.heatMap.clonedDataSource = [];\n this.completeDataSource = [];\n var axis = this.heatMap.axisCollections;\n var dataLength = axis[0].maxLength + 1;\n var labelLength = axis[0].axisLabelSize + (axis[0].min > 0 ? axis[0].min : 0);\n var xLength = dataLength > labelLength ? dataLength : labelLength;\n var minVal;\n var maxVal;\n dataLength = axis[1].maxLength + 1;\n labelLength = axis[1].axisLabelSize + (axis[1].min > 0 ? axis[1].min : 0);\n var yLength = dataLength > labelLength ? dataLength : labelLength;\n // tslint:disable-next-line:no-any \n var tempVariable;\n var cloneDataIndex = 0;\n var minMaxDatasource = [];\n this.tempSizeArray = [];\n this.tempColorArray = [];\n this.heatMap.minColorValue = null;\n this.heatMap.maxColorValue = null;\n for (var z = axis[1].valueType === 'Category' ? axis[1].min : 0; z < yLength; z++) {\n var tempIndex = axis[0].valueType === 'Category' ? axis[0].min : 0;\n this.completeDataSource.push([]);\n while (tempIndex < xLength) {\n if (tempIndex >= axis[0].min && tempIndex <= axis[0].max) {\n this.processDataArray(tempCloneData, tempIndex, z, cloneDataIndex);\n }\n tempIndex++;\n }\n tempVariable = extend([], this.completeDataSource[cloneDataIndex], null, true);\n var minMaxVal = this.getMinMaxValue(minVal, maxVal, tempVariable);\n minVal = minMaxVal[0];\n maxVal = minMaxVal[1];\n if (this.heatMap.xAxis.isInversed) {\n this.completeDataSource[cloneDataIndex] = this.completeDataSource[cloneDataIndex].reverse();\n }\n if (z >= this.heatMap.axisCollections[1].min && z <= this.heatMap.axisCollections[1].max) {\n minMaxDatasource.push(this.completeDataSource[cloneDataIndex]);\n }\n cloneDataIndex++;\n }\n if (!this.heatMap.yAxis.isInversed) {\n this.completeDataSource.reverse();\n minMaxDatasource.reverse();\n }\n this.heatMap.clonedDataSource = minMaxDatasource;\n this.heatMap.dataSourceMinValue = isNullOrUndefined(minVal) ? 0 : parseFloat(minVal.toString());\n this.heatMap.dataSourceMaxValue = isNullOrUndefined(maxVal) ? 0 : parseFloat(maxVal.toString());\n this.heatMap.isColorValueExist = isNullOrUndefined(this.heatMap.minColorValue) ? false : true;\n this.heatMap.minColorValue = isNullOrUndefined(this.heatMap.minColorValue) ?\n this.heatMap.dataSourceMinValue : parseFloat(this.heatMap.minColorValue.toString());\n this.heatMap.maxColorValue = isNullOrUndefined(this.heatMap.maxColorValue) ?\n this.heatMap.dataSourceMaxValue : parseFloat(this.heatMap.maxColorValue.toString());\n };\n /**\n * To process and create a proper data array.\n * @private\n */\n // tslint:disable-next-line:no-any\n TwoDimensional.prototype.processDataArray = function (tempCloneData, tempIndex, z, cloneDataIndex) {\n if (this.heatMap.bubbleSizeWithColor) {\n if (tempCloneData[tempIndex] && !isNullOrUndefined(tempCloneData[tempIndex][z])\n && typeof (tempCloneData[tempIndex][z]) === 'object') {\n // tslint:disable-next-line:no-any \n var internalArray = tempCloneData[tempIndex][z];\n for (var tempx = 0; tempx < internalArray.length; tempx++) {\n if (isNullOrUndefined(internalArray[tempx]) || isNaN(internalArray[tempx])) {\n internalArray[tempx] = '';\n }\n if (tempx === 0) {\n this.tempSizeArray.push(internalArray[tempx]);\n }\n else if (tempx === 1) {\n this.tempColorArray.push(internalArray[tempx]);\n break;\n }\n }\n this.completeDataSource[cloneDataIndex].push(internalArray);\n }\n else {\n if (!isNullOrUndefined(tempCloneData[tempIndex]) && (tempCloneData[tempIndex][z] ||\n (tempCloneData[tempIndex][z] === 0 &&\n tempCloneData[tempIndex][z].toString() !== ''))) {\n this.completeDataSource[cloneDataIndex].push([tempCloneData[tempIndex][z]]);\n this.tempSizeArray.push(tempCloneData[tempIndex][z]);\n }\n else {\n this.completeDataSource[cloneDataIndex].push('');\n }\n }\n }\n else {\n if (tempCloneData[tempIndex] && (tempCloneData[tempIndex][z] ||\n (tempCloneData[tempIndex][z] === 0 &&\n tempCloneData[tempIndex][z].toString() !== ''))) {\n if (typeof (tempCloneData[tempIndex][z]) === 'object') {\n if (tempCloneData[tempIndex][z].length > 0 && !isNullOrUndefined(tempCloneData[tempIndex][z][0])) {\n this.completeDataSource[cloneDataIndex].push(tempCloneData[tempIndex][z][0]);\n }\n else {\n this.completeDataSource[cloneDataIndex].push('');\n }\n }\n else {\n this.completeDataSource[cloneDataIndex].push(tempCloneData[tempIndex][z]);\n }\n }\n else {\n this.completeDataSource[cloneDataIndex].push('');\n }\n }\n };\n /**\n * To get minimum and maximum value\n * @private\n */\n TwoDimensional.prototype.getMinMaxValue = function (minVal, maxVal, tempVariable) {\n var minMaxValue = [];\n if (this.heatMap.bubbleSizeWithColor) {\n minMaxValue.push(this.getMinValue(minVal, this.tempSizeArray));\n minMaxValue.push(this.getMaxValue(maxVal, this.tempSizeArray));\n this.heatMap.minColorValue = this.getMinValue(this.heatMap.minColorValue, this.tempColorArray);\n this.heatMap.maxColorValue = this.getMaxValue(this.heatMap.maxColorValue, this.tempColorArray);\n }\n else {\n minMaxValue.push(this.getMinValue(minVal, tempVariable));\n minMaxValue.push(this.getMaxValue(maxVal, tempVariable));\n }\n return minMaxValue;\n };\n /**\n * To get minimum value\n * @private\n */\n TwoDimensional.prototype.getMinValue = function (minVal, tempVariable) {\n if (isNullOrUndefined(minVal)) {\n minVal = this.performSort(tempVariable);\n }\n else if (this.performSort(tempVariable) < minVal) {\n minVal = this.performSort(tempVariable);\n }\n return !isNullOrUndefined(minVal) ? parseFloat(minVal.toString()) : minVal;\n };\n /**\n * To get maximum value\n * @private\n */\n TwoDimensional.prototype.getMaxValue = function (maxVal, tempVariable) {\n if (isNullOrUndefined(maxVal) && tempVariable.length > 0) {\n maxVal = Math.max.apply(Math, tempVariable);\n }\n else if (Math.max.apply(Math, tempVariable) > maxVal) {\n maxVal = Math.max.apply(Math, tempVariable);\n }\n return !isNullOrUndefined(maxVal) ? parseFloat(maxVal.toString()) : maxVal;\n };\n /**\n * To perform sort operation.\n * @private\n */\n // tslint:disable-next-line:no-any\n TwoDimensional.prototype.performSort = function (tempVariable) {\n return tempVariable.sort(function (a, b) { return a - b; }).filter(this.checkmin)[0];\n };\n /**\n * To get minimum value\n * @private\n */\n TwoDimensional.prototype.checkmin = function (val) {\n return !isNullOrUndefined(val) && val.toString() !== '';\n };\n return TwoDimensional;\n}());\nexport { TwoDimensional };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty, Complex, Browser, createElement, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { DrawSvgCanvas, TextOption, TextBasic, PathOption, Line, LineOption, GradientPointer } from '../utils/helper';\nimport { Size, measureText, getTitle, getElement, CanvasTooltip, formatValue, LegendRange, ToggleVisibility, sum } from '../utils/helper';\nimport { Font } from '../model/base';\nimport { Rect, RectOption, Gradient, GradientColor, showTooltip, stringToNumber, CurrentLegendRect, removeElement } from '../utils/helper';\nimport { Theme } from '../model/theme';\nimport { Tooltip as tool } from '@syncfusion/ej2-svg-base';\n/**\n * Configures the Legend\n */\nvar LegendSettings = /** @class */ (function (_super) {\n __extends(LegendSettings, _super);\n function LegendSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], LegendSettings.prototype, \"height\", void 0);\n __decorate([\n Property('')\n ], LegendSettings.prototype, \"width\", void 0);\n __decorate([\n Property('Right')\n ], LegendSettings.prototype, \"position\", void 0);\n __decorate([\n Property(true)\n ], LegendSettings.prototype, \"visible\", void 0);\n __decorate([\n Property('Center')\n ], LegendSettings.prototype, \"alignment\", void 0);\n __decorate([\n Property(true)\n ], LegendSettings.prototype, \"showLabel\", void 0);\n __decorate([\n Property(true)\n ], LegendSettings.prototype, \"showGradientPointer\", void 0);\n __decorate([\n Property(false)\n ], LegendSettings.prototype, \"enableSmartLegend\", void 0);\n __decorate([\n Property('All')\n ], LegendSettings.prototype, \"labelDisplayType\", void 0);\n __decorate([\n Complex(Theme.legendLabelFont, Font)\n ], LegendSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property('')\n ], LegendSettings.prototype, \"labelFormat\", void 0);\n __decorate([\n Property(true)\n ], LegendSettings.prototype, \"toggleVisibility\", void 0);\n return LegendSettings;\n}(ChildProperty));\nexport { LegendSettings };\n/**\n *\n * The `Legend` module is used to render legend for the heatmap.\n */\nvar Legend = /** @class */ (function () {\n function Legend(heatMap) {\n this.maxLegendLabelSize = new Size(0, 0);\n this.gradientScaleSize = 10;\n this.segmentCollections = [];\n this.textWrapCollections = [];\n this.labelCollections = [];\n this.legendSize = 10;\n this.previousOptions = new GradientPointer(0, 0, 0, 0, 0, 0);\n this.listPerPage = 0;\n this.numberOfPages = 1;\n this.listWidth = 0;\n this.fillRect = new Rect(0, 0, 0, 0);\n this.legendRect = new Rect(0, 0, 0, 0);\n this.currentPage = 1;\n this.lastList = [];\n this.navigationCollections = [];\n this.pagingRect = new Rect(0, 0, 0, 0);\n this.listInterval = 10; // padding between two lists\n this.legendLabelTooltip = [];\n this.labelXCollections = [];\n this.labelYCollections = [];\n this.legendXCollections = [];\n this.legendYCollections = [];\n /** @private */\n this.legendRectPositionCollection = [];\n /** @private */\n this.legendRange = [];\n /** @private */\n this.legendTextRange = [];\n /** @private */\n this.visibilityCollections = [];\n this.heatMap = heatMap;\n this.drawSvgCanvas = new DrawSvgCanvas(heatMap);\n }\n ;\n /**\n * Get module name\n */\n Legend.prototype.getModuleName = function () {\n return 'Legend';\n };\n /**\n * To destroy the Legend.\n * @return {void}\n * @private\n */\n Legend.prototype.destroy = function (heatMap) {\n /**\n * destory code\n */\n };\n ;\n /**\n * @private\n */\n Legend.prototype.renderLegendItems = function () {\n var heatMap = this.heatMap;\n var tempBorder = {\n color: 'transparent',\n width: 0,\n };\n this.legend = heatMap.renderer.createGroup({ id: heatMap.element.id + '_Heatmap_Legend' });\n var rectItems = new RectOption(heatMap.element.id + '_LegendBound', 'none', tempBorder, 1, this.legendGroup);\n this.drawSvgCanvas.drawRectangle(rectItems, this.legend);\n var legendBound = this.legendRectScale;\n var rectItemsSvg = new Rect(legendBound.x, legendBound.y, legendBound.width, legendBound.height);\n if (heatMap.paletteSettings.type === 'Fixed') {\n var colorCollection = (!heatMap.legendSettings.enableSmartLegend) ?\n heatMap.colorCollection : heatMap.legendColorCollection;\n this.legendRange = (heatMap.resizing || (!heatMap.legendOnLoad && heatMap.rendering)) ? [] : this.legendRange;\n this.legendTextRange = (heatMap.resizing || (!heatMap.legendOnLoad && heatMap.rendering)) ? [] : this.legendTextRange;\n heatMap.toggleValue = [];\n for (var i = 0; i < colorCollection.length; i++) {\n var visibility = !isNullOrUndefined(this.visibilityCollections[i]) ? this.visibilityCollections[i] : true;\n heatMap.toggleValue.push(new ToggleVisibility(visibility, colorCollection[i].value));\n }\n }\n if (heatMap.paletteSettings.type === 'Gradient' || (heatMap.paletteSettings.type === 'Fixed' &&\n heatMap.legendSettings.enableSmartLegend === true)) {\n if (heatMap.paletteSettings.type === 'Gradient') {\n var fill = void 0;\n if (heatMap.enableCanvasRendering) {\n var grd = void 0;\n var ctx = heatMap.canvasRenderer.ctx;\n if (heatMap.horizontalGradient) {\n grd = ctx.createLinearGradient(legendBound.x, 0, legendBound.x + legendBound.width, 0);\n }\n else {\n grd = ctx.createLinearGradient(0, legendBound.y, 0, legendBound.y + legendBound.height);\n }\n for (var i = 0; i < heatMap.legendColorCollection.length; i++) {\n var value = ((heatMap.legendColorCollection[i].value - this.legendMinValue) /\n (this.legendMaxValue - this.legendMinValue));\n value = isNaN(value) ? 0 : value;\n grd.addColorStop(value, heatMap.legendColorCollection[i].color);\n }\n ctx.fillStyle = grd;\n fill = grd.toString();\n }\n else {\n var gradientOptions = void 0;\n var gradientColor = void 0;\n var cgradientColors = [];\n for (var i = 0; i < heatMap.legendColorCollection.length; i++) {\n var gradientPercentage = ((heatMap.legendColorCollection[i].value - this.legendMinValue) /\n (this.legendMaxValue - this.legendMinValue)) * 100;\n gradientPercentage = isNaN(gradientPercentage) ? 0 : gradientPercentage;\n gradientColor = new GradientColor(heatMap.legendColorCollection[i].color, gradientPercentage + '%');\n cgradientColors.push(gradientColor);\n if (this.legendMaxValue === this.legendMinValue) {\n break;\n }\n }\n if (heatMap.horizontalGradient) {\n gradientOptions = new Gradient(heatMap.element.id + '_lineargradient', '0%', '100%', '0%', '0%');\n }\n else {\n gradientOptions = new Gradient(heatMap.element.id + '_lineargradient', '0%', '0%', '0%', '100%');\n }\n var linearGradient = heatMap.renderer.drawGradient('linearGradient', gradientOptions, cgradientColors);\n this.legend.appendChild(linearGradient);\n fill = 'url(#' + heatMap.element.id + '_lineargradient)';\n }\n var rectItem = new RectOption(heatMap.element.id + '_Gradient_Legend', fill, tempBorder, 1, rectItemsSvg);\n this.drawSvgCanvas.drawRectangle(rectItem, this.legend);\n this.renderColorAxisGrid(rectItemsSvg);\n }\n else {\n this.renderSmartLegend();\n }\n if (!heatMap.enableCanvasRendering) {\n heatMap.svgObject.appendChild(this.legend);\n }\n this.renderLegendLabel(rectItemsSvg);\n }\n else {\n this.legendScale = heatMap.renderer.createGroup({ id: heatMap.element.id + 'Heatmap_GradientScale' });\n var listRect = new RectOption(heatMap.element.id + '_Gradient_Scale', 'none', tempBorder, 1, this.legendRectScale);\n this.drawSvgCanvas.drawRectangle(listRect, this.legendScale);\n if (!heatMap.enableCanvasRendering) {\n this.legend.appendChild(this.legendScale);\n }\n this.translategroup = heatMap.renderer.createGroup({ id: heatMap.element.id + '_translate' });\n this.calculateListPerPage(rectItemsSvg);\n if (this.numberOfPages > 1) {\n this.paginggroup = heatMap.renderer.createGroup({ id: heatMap.element.id + '_navigation' });\n }\n this.renderListLegendMode(rectItemsSvg, true);\n }\n };\n Legend.prototype.renderSmartLegend = function () {\n var heatMap = this.heatMap;\n var colorCollection = heatMap.colorCollection;\n var smartLegendRect;\n var tempBorder = {\n color: 'transparent',\n width: 0,\n };\n var legendBound = this.legendRectScale;\n var legendX;\n var legendY;\n var legendWidth;\n var legendHeight;\n var width = legendBound.width / colorCollection.length;\n var height = legendBound.height / colorCollection.length;\n this.legendRectPositionCollection = [];\n this.legendRange = [];\n for (var i = 0; i < heatMap.legendColorCollection.length; i++) {\n var rectPosition = new CurrentLegendRect(0, 0, 0, 0, '', '');\n if (heatMap.horizontalGradient) {\n legendX = legendBound.x + (i * width);\n legendY = legendBound.y;\n legendWidth = width;\n legendHeight = legendBound.height;\n this.segmentCollections.push((heatMap.legendSettings.labelDisplayType === 'Edge' &&\n i === heatMap.legendColorCollection.length - 1 && !heatMap.legendColorCollection[i].isHidden) ?\n legendX + width : legendX);\n }\n else {\n legendX = legendBound.x;\n legendY = legendBound.y + (i * height);\n legendWidth = legendBound.width;\n legendHeight = height;\n this.segmentCollections.push((heatMap.legendSettings.labelDisplayType === 'Edge' &&\n i === heatMap.legendColorCollection.length - 1 && !heatMap.legendColorCollection[i].isHidden) ?\n legendY + height : legendY);\n }\n smartLegendRect = new Rect(legendX, legendY, legendWidth, legendHeight);\n var legendRange = new LegendRange(0, 0, 0, 0, 0, true, 0);\n legendRange.x = legendX;\n legendRange.y = legendY;\n legendRange.width = legendWidth;\n legendRange.height = legendHeight;\n legendRange.value = heatMap.legendColorCollection[i].value;\n legendRange.currentPage = this.currentPage;\n if (colorCollection.length !== heatMap.legendColorCollection.length && i === heatMap.legendColorCollection.length - 1) {\n heatMap.horizontalGradient ? legendRange.width = 0 : legendRange.height = 0;\n this.visibilityCollections[i] = this.visibilityCollections[i - 1];\n }\n legendRange.visible = !isNullOrUndefined(this.visibilityCollections[i]) ? this.visibilityCollections[i] : true;\n this.legendRange.push(legendRange);\n if (!heatMap.legendColorCollection[i].isHidden) {\n var color = heatMap.legendOnLoad ? colorCollection[i].color :\n this.legendRange[i].visible ? colorCollection[i].color : '#D3D3D3';\n var rectItem = new RectOption(heatMap.element.id + '_Smart_Legend' + i, color, tempBorder, 1, smartLegendRect);\n this.drawSvgCanvas.drawRectangle(rectItem, this.legend);\n rectPosition.x = legendX;\n rectPosition.y = legendY;\n rectPosition.width = legendWidth;\n rectPosition.height = legendHeight;\n rectPosition.label = this.labelCollections[i];\n rectPosition.id = heatMap.element.id + '_Smart_Legend' + i;\n this.legendRectPositionCollection.push(rectPosition);\n var text = getTitle(this.labelCollections[i], heatMap.legendSettings.textStyle, this.textWrapCollections[i]);\n if (text.length !== 0 && heatMap.enableCanvasRendering) {\n var elementSize = measureText(this.labelCollections[i], heatMap.legendSettings.textStyle);\n this.legendLabelTooltip.push(new CanvasTooltip(this.labelCollections[i], new Rect(rectPosition.x, rectPosition.y, elementSize.width, elementSize.height)));\n }\n }\n }\n };\n Legend.prototype.renderLegendLabel = function (rect) {\n var heatMap = this.heatMap;\n this.legendTextRange = [];\n if (heatMap.legendSettings.showLabel && (heatMap.paletteSettings.type === 'Gradient' ||\n (heatMap.paletteSettings.type === 'Fixed' && heatMap.legendSettings.labelDisplayType !== 'None'))) {\n var anchor = void 0;\n var dominantBaseline = void 0;\n var legendLabel = void 0;\n var textWrapWidth = 0;\n var text = void 0;\n this.legendLabelTooltip = [];\n var elementSize = void 0;\n var colorCollection = heatMap.legendColorCollection;\n if (heatMap.enableCanvasRendering) {\n var ctx = heatMap.canvasRenderer.ctx;\n ctx.rect(this.legendGroup.x, this.legendGroup.y, this.legendGroup.width, this.legendGroup.height);\n ctx.save();\n ctx.clip();\n ctx.restore();\n }\n else {\n legendLabel = heatMap.renderer.createGroup({ id: heatMap.element.id + '_Heatmap_LegendLabel' });\n }\n var labelX = void 0;\n var labelY = void 0;\n for (var i = 0; i < colorCollection.length; i++) {\n var value = ((colorCollection[i].value - this.legendMinValue) /\n (this.legendMaxValue - this.legendMinValue)) * 100;\n if (heatMap.horizontalGradient) {\n labelX = this.segmentCollections[i];\n labelY = rect.y + rect.height + this.labelPadding;\n anchor = (value === 0 || (i === 0 && heatMap.paletteSettings.type === 'Fixed')) ? 'start' :\n (heatMap.dataSourceMaxValue === colorCollection[i].value) || (heatMap.legendSettings.enableSmartLegend &&\n heatMap.legendSettings.labelDisplayType === 'Edge') ? 'end' : 'middle';\n dominantBaseline = 'hanging';\n }\n else {\n labelX = rect.x + rect.width + this.labelPadding;\n labelY = this.segmentCollections[i];\n dominantBaseline = (value === 0 || (i === 0 && heatMap.paletteSettings.type === 'Fixed')) ? 'hanging' :\n (heatMap.dataSourceMaxValue === colorCollection[i].value) || (heatMap.legendSettings.enableSmartLegend &&\n heatMap.legendSettings.labelDisplayType === 'Edge') ? 'baseline' : 'middle';\n }\n textWrapWidth = heatMap.horizontalGradient ? this.textWrapCollections[i] : this.width - (this.legendRectScale.width +\n this.labelPadding + this.legendRectPadding);\n text = getTitle(this.labelCollections[i], heatMap.legendSettings.textStyle, textWrapWidth);\n elementSize = measureText(text[0], heatMap.legendSettings.textStyle);\n if (heatMap.paletteSettings.type === 'Fixed') {\n var rectY = dominantBaseline === 'hanging' ? labelY : dominantBaseline === 'middle' ?\n labelY - elementSize.height / 2 : labelY - elementSize.height;\n var rectX = anchor === 'end' ? labelX - elementSize.width : anchor === 'middle' ?\n labelX - elementSize.width / 2 : labelX;\n var textPosition = new LegendRange(rectX, rectY, elementSize.width, elementSize.height, colorCollection[i].value, true, this.currentPage);\n textPosition.visible = !isNullOrUndefined(this.visibilityCollections[i]) ? this.visibilityCollections[i] : true;\n this.legendTextRange.push(textPosition);\n }\n if (this.labelCollections[i] !== '') {\n if (text.length !== 0 && text[0].indexOf('...') !== -1 && heatMap.enableCanvasRendering) {\n this.legendLabelTooltip.push(new CanvasTooltip(this.labelCollections[i], new Rect(labelX, labelY, elementSize.width, elementSize.height)));\n }\n var textBasic = new TextBasic(labelX, labelY, anchor, text, 0, 'translate(0,0)', dominantBaseline);\n var options = new TextOption(heatMap.element.id + '_Legend_Label' + i, textBasic, heatMap.legendSettings.textStyle, heatMap.legendSettings.textStyle.color || heatMap.themeStyle.legendLabel);\n options.fill = heatMap.legendOnLoad ? options.fill :\n (heatMap.paletteSettings.type === 'Fixed' && !this.legendRange[i].visible) ? '#D3D3D3' : options.fill;\n if (text.length > 1) {\n this.drawSvgCanvas.createWrapText(options, heatMap.legendSettings.textStyle, legendLabel);\n }\n else {\n this.drawSvgCanvas.createText(options, legendLabel, text[0]);\n }\n if (Browser.isIE && !heatMap.enableCanvasRendering) {\n if (dominantBaseline === 'middle') {\n legendLabel.lastChild.setAttribute('dy', '0.6ex');\n }\n else if (dominantBaseline === 'hanging') {\n legendLabel.lastChild.setAttribute('dy', '1.5ex');\n }\n }\n }\n if (this.legendMaxValue === this.legendMinValue && heatMap.paletteSettings.type === 'Gradient') {\n break;\n }\n }\n if (!heatMap.enableCanvasRendering) {\n this.legendGroup.height = this.legendGroup.height > 0 ? this.legendGroup.height : 0;\n this.legendGroup.width = this.legendGroup.width > 0 ? this.legendGroup.width : 0;\n this.legend.appendChild(legendLabel);\n var clippath = heatMap.renderer.createClipPath({ id: heatMap.element.id + '_clipPath' });\n var clipRect = heatMap.renderer.drawRectangle(this.legendGroup);\n clippath.appendChild(clipRect);\n heatMap.svgObject.appendChild(clippath);\n this.legend.setAttribute('style', 'clip-path:url(#' + clippath.id + ')');\n }\n }\n };\n /**\n * @private\n */\n Legend.prototype.renderGradientPointer = function (e, pageX, pageY) {\n var heatMap = this.heatMap;\n var currentRect = heatMap.heatMapSeries.getCurrentRect(pageX, pageY);\n var cellValue = heatMap.bubbleSizeWithColor ? currentRect.value[0].bubbleData.toString() !== '' ?\n !this.heatMap.isColorValueExist ? currentRect.value[0].bubbleData.toString() :\n currentRect.value[1].bubbleData.toString() : '' : currentRect.value.toString();\n var rect = this.legendRectScale;\n var legendPart;\n var direction;\n var options;\n var legendPath;\n var pathX1;\n var pathY1;\n var pathX2;\n var pathY2;\n var pathX3;\n var pathY3;\n if (cellValue.toString() !== '') {\n if (!heatMap.horizontalGradient) {\n legendPart = rect.height / 100;\n legendPath = legendPart * ((Number(cellValue) - this.legendMinValue) /\n (this.legendMaxValue - this.legendMinValue)) * 100;\n legendPath = isNaN(legendPath) ? 0 : legendPath;\n pathX1 = rect.x - 1;\n pathY1 = rect.y + legendPath;\n pathX2 = pathX3 = rect.x - 8;\n pathY2 = rect.y - 5 + legendPath;\n pathY3 = rect.y + 5 + legendPath;\n }\n else {\n legendPart = rect.width / 100;\n legendPath = legendPart * ((Number(cellValue) - this.legendMinValue) /\n (this.legendMaxValue - this.legendMinValue)) * 100;\n legendPath = isNaN(legendPath) ? 0 : legendPath;\n pathX1 = rect.x + legendPath;\n pathY1 = rect.y + rect.height;\n pathX2 = rect.x - 5 + legendPath;\n pathY2 = pathY3 = rect.y + rect.height + 8;\n pathX3 = rect.x + 5 + legendPath;\n }\n direction = 'M' + ' ' + pathX1 + ' ' + pathY1 + ' ' +\n 'L' + ' ' + pathX2 + ' ' + pathY2 + ' ' + 'L' + ' ' + pathX3 + ' ' + pathY3 + ' ' + 'Z';\n options = new PathOption(heatMap.element.id + '_Gradient_Pointer', 'gray', 0.01, '#A0A0A0', 1, '0,0', direction);\n if (!heatMap.enableCanvasRendering) {\n this.gradientPointer = heatMap.renderer.drawPath(options);\n this.gradientPointer.style.visibility = 'visible';\n this.legend.appendChild(this.gradientPointer);\n }\n else {\n this.removeGradientPointer();\n var canvasTranslate = void 0;\n heatMap.canvasRenderer.drawPath(options, canvasTranslate);\n this.previousOptions.pathX1 = pathX1;\n this.previousOptions.pathY1 = pathY1;\n this.previousOptions.pathX2 = pathX2;\n this.previousOptions.pathY2 = pathY2;\n this.previousOptions.pathX3 = pathX3;\n this.previousOptions.pathY3 = pathY3;\n }\n }\n else {\n this.removeGradientPointer();\n }\n };\n /**\n * @private\n */\n Legend.prototype.removeGradientPointer = function () {\n var heatMap = this.heatMap;\n if (this.gradientPointer && !heatMap.enableCanvasRendering) {\n this.gradientPointer.style.visibility = 'hidden';\n }\n else if (heatMap.enableCanvasRendering) {\n if (Object.keys(this.previousOptions).length !== 0) {\n if (heatMap.horizontalGradient) {\n this.fillRect.x = this.previousOptions.pathX2 - 1;\n this.fillRect.y = this.previousOptions.pathY1;\n this.fillRect.width = this.previousOptions.pathX3 - this.previousOptions.pathX2 + 2;\n this.fillRect.height = this.previousOptions.pathY2 + 1 - this.previousOptions.pathY1;\n }\n else {\n this.fillRect.x = this.previousOptions.pathX2 - 1;\n this.fillRect.y = this.previousOptions.pathY2 - 1;\n this.fillRect.width = this.previousOptions.pathX1 - this.previousOptions.pathX2 + 1;\n this.fillRect.height = this.previousOptions.pathY3 - this.previousOptions.pathY2 + 2;\n }\n }\n heatMap.canvasRenderer.ctx.fillStyle = heatMap.themeStyle.background;\n heatMap.canvasRenderer.ctx.fillRect(this.fillRect.x, this.fillRect.y, this.fillRect.width, this.fillRect.height);\n }\n };\n /**\n * @private\n */\n Legend.prototype.calculateLegendBounds = function (rect) {\n var heatMap = this.heatMap;\n var legendSettings = heatMap.legendSettings;\n var colorCollection = heatMap.legendColorCollection;\n this.labelCollections = [];\n if (legendSettings.position !== 'Bottom' && legendSettings.position !== 'Top' &&\n legendSettings.position !== 'Right' && legendSettings.position !== 'Left') {\n legendSettings.position = 'Right';\n }\n heatMap.horizontalGradient = legendSettings.position === 'Bottom' || legendSettings.position === 'Top';\n this.legendRectPadding = heatMap.horizontalGradient ? 16 : 10; // padding between rect and legend\n this.labelPadding = legendSettings.showLabel ? this.heatMap.horizontalGradient ? 10 : 6 : 0; // padding between list and label\n this.legendHeight = legendSettings.height;\n this.legendWidth = legendSettings.width;\n var format = heatMap.legendSettings.labelFormat;\n var isCustom = format.match('{value}') !== null;\n this.format = heatMap.intl.getNumberFormat({\n format: isCustom ? '' : format\n });\n if (heatMap.paletteSettings.type === 'Fixed') {\n for (var i = 0; i < colorCollection.length; i++) {\n var label = colorCollection[i].label ? colorCollection[i].label :\n formatValue(isCustom, format, colorCollection[i].value, this.format).toString();\n if (heatMap.legendSettings.enableSmartLegend && heatMap.legendSettings.labelDisplayType === 'Edge'\n && i > 0 && i < colorCollection.length - 1) {\n this.labelCollections.push('');\n }\n else {\n this.labelCollections.push(label);\n }\n }\n }\n else {\n for (var i = 0; i < colorCollection.length; i++) {\n var label = colorCollection[i].isHidden ? '' : colorCollection[i].label ?\n colorCollection[i].label : formatValue(isCustom, format, colorCollection[i].value, this.format).toString();\n this.labelCollections.push(label);\n }\n }\n if (heatMap.paletteSettings.type === 'Gradient' || (heatMap.paletteSettings.type === 'Fixed' &&\n heatMap.legendSettings.enableSmartLegend)) {\n this.maxLegendLabelSize = this.getMaxLabelSize();\n if (heatMap.horizontalGradient && legendSettings.height === '') {\n this.legendHeight = ((2 * this.legendRectPadding) + this.legendSize + this.maxLegendLabelSize.height).toString();\n }\n else if (!heatMap.horizontalGradient && legendSettings.width === '' && (legendSettings.textStyle.textOverflow === 'None' ||\n (heatMap.paletteSettings.type === 'Fixed' && heatMap.legendSettings.enableSmartLegend &&\n heatMap.legendSettings.labelDisplayType === 'None'))) {\n this.legendWidth = ((2 * this.legendRectPadding) + this.legendSize + this.maxLegendLabelSize.width).toString();\n }\n }\n else {\n this.calculateListLegendBounds(rect);\n }\n this.legendHeight = this.legendHeight ? this.legendHeight : heatMap.horizontalGradient ? '50' : '100%';\n this.legendWidth = this.legendWidth ? this.legendWidth : heatMap.horizontalGradient ?\n '100%' : heatMap.paletteSettings.type === 'Fixed' && !heatMap.legendSettings.enableSmartLegend ? '70' : '50';\n this.height = stringToNumber(this.legendHeight, rect.height);\n this.width = stringToNumber(this.legendWidth, rect.width);\n if (heatMap.horizontalGradient) {\n this.height = heatMap.paletteSettings.type === 'Gradient' || heatMap.legendSettings.enableSmartLegend ?\n this.height < 50 ? 50 : this.height : this.height;\n if (legendSettings.position === 'Top') {\n rect.y += this.height;\n }\n rect.height -= this.height;\n }\n else {\n this.width = heatMap.paletteSettings.type === 'Gradient' || heatMap.legendSettings.enableSmartLegend ?\n this.width < 50 ? 50 : this.width : this.width;\n if (legendSettings.position === 'Left') {\n rect.x += this.width;\n }\n rect.width -= this.width;\n }\n };\n Legend.prototype.calculateListLegendBounds = function (rect) {\n var heatMap = this.heatMap;\n this.listWidth = 0;\n this.listHeight = 0;\n this.currentPage = 1;\n var padding = 10; // padding of paging elements\n if (heatMap.horizontalGradient) {\n for (var i = 0; i < heatMap.colorCollection.length; i++) {\n var size = 0;\n if (heatMap.legendSettings.showLabel) {\n var text = this.labelCollections[i];\n size = measureText(text, heatMap.legendSettings.textStyle).width;\n }\n var perListWidth = this.legendSize + this.labelPadding + size + this.listInterval;\n this.listWidth += perListWidth;\n }\n this.listWidth += this.listInterval + padding;\n if (this.legendWidth === '') {\n this.legendWidth = this.listWidth > rect.width ? rect.width.toString() : this.listWidth.toString();\n }\n if (this.legendHeight === '') {\n this.numberOfRows = Math.ceil(this.listWidth / stringToNumber(this.legendWidth, rect.width));\n this.numberOfRows = this.numberOfRows > 3 ? 3 : this.numberOfRows;\n this.legendHeight = (this.listWidth > rect.width || this.listWidth > stringToNumber(this.legendWidth, rect.width)) &&\n this.numberOfRows > 3 ? (((this.legendSize + this.listInterval) * this.numberOfRows) + this.legendRectPadding +\n parseInt(heatMap.legendSettings.textStyle.size, 10) + padding).toString() :\n (((this.legendSize + this.listInterval) * this.numberOfRows) + this.legendRectPadding).toString();\n }\n }\n else {\n this.listHeight = ((this.legendSize + this.listInterval) * heatMap.colorCollection.length) + this.listInterval;\n if (this.legendHeight === '') {\n this.legendHeight = this.listHeight > rect.height ? rect.height.toString() : this.listHeight.toString();\n }\n if (this.legendWidth === '' && heatMap.legendSettings.textStyle.textOverflow !== 'Trim') {\n this.maxLegendLabelSize = this.getMaxLabelSize();\n this.legendWidth = ((2 * this.legendRectPadding) + this.legendSize + this.labelPadding +\n this.maxLegendLabelSize.width).toString();\n }\n }\n if (stringToNumber(this.legendHeight, rect.height) < 50) {\n this.legendHeight = '50';\n }\n if (stringToNumber(this.legendWidth, rect.width) < 70) {\n this.legendWidth = '70';\n }\n };\n Legend.prototype.getMaxLabelSize = function () {\n var heatMap = this.heatMap;\n this.maxLegendLabelSize = new Size(0, 0);\n if (!heatMap.legendSettings.showLabel || (heatMap.horizontalGradient && heatMap.paletteSettings.type === 'Fixed' &&\n !heatMap.legendSettings.enableSmartLegend) || (heatMap.paletteSettings.type === 'Fixed' &&\n heatMap.legendSettings.labelDisplayType === 'None')) {\n return this.maxLegendLabelSize;\n }\n else {\n var labelSize = this.maxLegendLabelSize;\n for (var i = 0; i < heatMap.legendColorCollection.length; i++) {\n var size = measureText(this.labelCollections[i], heatMap.legendSettings.textStyle);\n labelSize.width = (labelSize.width > size.width) ? labelSize.width : size.width;\n labelSize.height = (labelSize.height > size.height) ? labelSize.height : size.height;\n }\n return labelSize;\n }\n };\n /**\n * @private\n */\n Legend.prototype.calculateLegendSize = function (rect, legendTop) {\n var heatMap = this.heatMap;\n var legendSettings = heatMap.legendSettings;\n var left;\n var top;\n var padding = 10; // inner padding for axis title and axil labels\n var alignment = legendSettings.alignment;\n var height = stringToNumber(this.legendHeight, rect.height);\n var width = stringToNumber(this.legendWidth, rect.width);\n var axis = heatMap.axisCollections;\n var axisTitlePadding = 0;\n if (heatMap.horizontalGradient) {\n width = width > rect.width ? rect.width : width;\n height = heatMap.paletteSettings.type === 'Gradient' || heatMap.legendSettings.enableSmartLegend ?\n height > 50 ? height : 50 : this.height;\n left = alignment === 'Near' ? rect.x : alignment === 'Far' ? rect.x + rect.width - width :\n rect.x + (rect.width / 2) - (width / 2);\n if (heatMap.xAxis.title.text !== '') {\n axisTitlePadding = measureText(heatMap.xAxis.title.text, heatMap.xAxis.textStyle).height + padding;\n }\n var axisHeight = axis[0].opposedPosition ? 0 : sum(axis[0].xAxisMultiLabelHeight) + axis[0].maxLabelSize.height +\n axisTitlePadding + padding;\n top = legendSettings.position === 'Top' ? heatMap.titleSettings.text ? legendTop :\n heatMap.margin.top : rect.y + rect.height + axisHeight;\n }\n else {\n height = height > rect.height ? rect.height : height;\n width = heatMap.paletteSettings.type === 'Gradient' || heatMap.legendSettings.enableSmartLegend ?\n width > 50 ? width : 50 : width;\n top = alignment === 'Near' ? rect.y : alignment === 'Far' ? rect.y + rect.height - height :\n rect.y + (rect.height / 2) - (height / 2);\n if (heatMap.yAxis.title.text !== '') {\n axisTitlePadding = measureText(heatMap.yAxis.title.text, heatMap.yAxis.textStyle).height + padding;\n }\n var axisWidth = axis[1].opposedPosition ? sum(axis[1].yAxisMultiLabelHeight) +\n axis[1].maxLabelSize.width + axisTitlePadding + 2 * padding : 0;\n left = legendSettings.position === 'Right' ? rect.x + rect.width + axisWidth : heatMap.margin.left;\n }\n this.legendGroup = new Rect(left, top, width, height);\n this.calculateGradientScale(this.legendGroup);\n };\n // calculating number of lists per page\n Legend.prototype.measureListLegendBound = function (rect) {\n var heatMap = this.heatMap;\n var padding = 15; // padding of paging element\n this.numberOfPages = 1;\n if (heatMap.horizontalGradient) {\n if (this.listWidth > this.width) {\n this.numberOfRows = Math.ceil(this.listWidth / this.width);\n this.listHeight = ((this.legendSize + this.listInterval) * this.numberOfRows);\n this.listPerPage = this.numberOfRows <= 3 ? this.numberOfRows : Math.ceil((this.height - padding -\n parseInt(heatMap.legendSettings.textStyle.size, 10) -\n this.legendRectPadding) / (this.legendSize + this.listInterval));\n this.numberOfPages = Math.ceil(this.numberOfRows / this.listPerPage);\n }\n else {\n this.listPerPage = 1;\n }\n }\n else {\n if (this.listHeight > rect.height || this.listHeight > this.height) {\n var maxHeight = stringToNumber(this.legendHeight, rect.height);\n maxHeight = maxHeight > rect.height ? rect.height : maxHeight;\n this.listPerPage = Math.floor(maxHeight / (this.legendSize + this.listInterval) - 1);\n this.numberOfPages = Math.max(1, Math.ceil(heatMap.colorCollection.length / this.listPerPage));\n }\n else {\n this.listPerPage = heatMap.colorCollection.length;\n this.legendHeight = this.listHeight.toString();\n }\n }\n };\n Legend.prototype.renderPagingElements = function () {\n var heatMap = this.heatMap;\n if (this.numberOfPages > 1) {\n this.navigationCollections = [];\n this.legend.appendChild(this.paginggroup);\n var iconSize = 10;\n var rightArrowX = this.legendGroup.x + this.legendGroup.width - iconSize;\n var rightArrowY = this.legendGroup.y + this.legendGroup.height - iconSize;\n var text = this.currentPage + '/' + this.numberOfPages;\n var textSize = measureText(text, heatMap.legendSettings.textStyle);\n var textX = rightArrowX - textSize.width - 15;\n var textBasic = new TextBasic(textX, rightArrowY, 'start', text, 0, 'translate(0,0)', 'middle');\n var options = new TextOption(heatMap.element.id + '_paging', textBasic, heatMap.legendSettings.textStyle, heatMap.legendSettings.textStyle.color || heatMap.themeStyle.legendLabel);\n this.drawSvgCanvas.createText(options, this.paginggroup, text);\n if (Browser.isIE && !heatMap.enableCanvasRendering) {\n this.paginggroup.lastChild.setAttribute('dy', '0.6ex');\n }\n this.pagingRect = new Rect(textX, rightArrowY - textSize.height / 2, textSize.width, textSize.height);\n var pagingTextRect = new RectOption(heatMap.element.id + '_pagingText', 'none', { color: 'transparent', width: 0 }, 1, this.pagingRect);\n this.drawSvgCanvas.drawRectangle(pagingTextRect, this.paginggroup);\n var rightArrowRect = new RectOption(heatMap.element.id + '_rightArrow', 'none', { color: 'transparent', width: 0 }, 1, new Rect(rightArrowX - iconSize, rightArrowY - iconSize / 2, iconSize, iconSize));\n this.drawSvgCanvas.drawRectangle(rightArrowRect, this.paginggroup);\n var rightArrow = 'M' + ' ' + (rightArrowX) + ' ' + rightArrowY + ' ' +\n 'L' + ' ' + (rightArrowX - iconSize) + ' ' + (rightArrowY - iconSize / 2) + ' ' + 'L' + ' ' +\n (rightArrowX - iconSize) + ' ' + (rightArrowY + (iconSize / 2)) + 'Z';\n var leftX = textX - 15;\n var leftArrow = 'M' + ' ' + leftX + ' ' + rightArrowY + ' ' +\n 'L' + ' ' + (leftX + iconSize) + ' ' + (rightArrowY - iconSize / 2) + ' ' + 'L' + ' ' +\n (leftX + iconSize) + ' ' + (rightArrowY + (iconSize / 2)) + 'Z';\n var leftArrowRect = new RectOption(heatMap.element.id + '_leftArrow', 'none', { color: 'transparent', width: 0 }, 1, new Rect(leftX, rightArrowY - iconSize / 2, iconSize, iconSize));\n this.drawSvgCanvas.drawRectangle(leftArrowRect, this.paginggroup);\n var leftOption = new PathOption(heatMap.element.id + '_Legend_leftarrow', 'gray', 0.01, '#A0A0A0', 1, '0,0', leftArrow);\n var rightOption = new PathOption(heatMap.element.id + '_Legend_rightarrow', 'gray', 0.01, '#A0A0A0', 1, '0,0', rightArrow);\n this.navigationCollections.push(rightArrowRect);\n this.navigationCollections.push(leftArrowRect);\n if (!heatMap.enableCanvasRendering) {\n var arrow = heatMap.renderer.drawPath(leftOption);\n var rightarrow = heatMap.renderer.drawPath(rightOption);\n this.paginggroup.appendChild(arrow);\n this.paginggroup.appendChild(rightarrow);\n }\n else {\n var canvasTranslate = void 0;\n heatMap.canvasRenderer.drawPath(leftOption, canvasTranslate);\n heatMap.canvasRenderer.drawPath(rightOption, canvasTranslate);\n }\n }\n };\n Legend.prototype.calculateGradientScale = function (scale) {\n var heatMap = this.heatMap;\n var padding = 10; // padding between legend bounds and gradient scale\n var left;\n var top;\n var height;\n var width;\n if (heatMap.paletteSettings.type === 'Fixed' && !heatMap.legendSettings.enableSmartLegend) {\n this.measureListLegendBound(heatMap.initialClipRect);\n }\n if (heatMap.horizontalGradient) {\n left = scale.x + padding;\n top = scale.y + this.legendRectPadding;\n width = heatMap.paletteSettings.type === 'Fixed' && !heatMap.legendSettings.enableSmartLegend ?\n scale.width - (2 * this.listInterval) : scale.width - 2 * padding;\n height = heatMap.paletteSettings.type === 'Fixed' && !heatMap.legendSettings.enableSmartLegend ?\n (this.legendSize + this.listInterval) * this.listPerPage - this.listInterval : this.gradientScaleSize;\n }\n else {\n left = scale.x + this.legendRectPadding;\n top = scale.y + padding;\n width = (heatMap.paletteSettings.type === 'Fixed' && !heatMap.legendSettings.enableSmartLegend) ?\n scale.width - padding : this.gradientScaleSize;\n height = heatMap.paletteSettings.type === 'Fixed' && !heatMap.legendSettings.enableSmartLegend ?\n (this.legendSize + this.listInterval) * this.listPerPage - this.listInterval : scale.height - 2 * padding;\n }\n this.legendRectScale = new Rect(left, top, width, height);\n if (heatMap.paletteSettings.type === 'Gradient' || heatMap.paletteSettings.type === 'Fixed' &&\n heatMap.legendSettings.enableSmartLegend) {\n this.calculateColorAxisGrid(this.legendRectScale);\n }\n };\n Legend.prototype.calculateColorAxisGrid = function (legendRect) {\n var heatMap = this.heatMap;\n var rect = this.legendRectScale;\n var legendPart;\n var text;\n var maxTextWrapLength = 0;\n this.segmentCollections = [];\n this.textWrapCollections = [];\n var pathX1;\n var pathY1;\n var colorCollection = heatMap.paletteSettings.type === 'Gradient' ?\n heatMap.legendColorCollection : heatMap.colorCollection;\n var minValue = heatMap.bubbleSizeWithColor ? heatMap.minColorValue : heatMap.dataSourceMinValue;\n var maxValue = heatMap.bubbleSizeWithColor ? heatMap.maxColorValue : heatMap.dataSourceMaxValue;\n this.legendMinValue = colorCollection[0].value > minValue ? minValue : colorCollection[0].value;\n this.legendMaxValue = colorCollection[colorCollection.length - 1].value < maxValue ? maxValue :\n colorCollection[colorCollection.length - 1].value;\n if (heatMap.paletteSettings.type === 'Gradient') {\n for (var index = 0; index < colorCollection.length; index++) {\n var value = ((colorCollection[index].value - this.legendMinValue) /\n (this.legendMaxValue - this.legendMinValue)) * 100;\n value = isNaN(value) ? 0 : value;\n if (!heatMap.horizontalGradient) {\n legendPart = rect.height / 100;\n pathY1 = legendRect.y + (legendPart * value);\n this.segmentCollections.push(pathY1);\n }\n else {\n legendPart = rect.width / 100;\n pathX1 = legendRect.x + (legendPart * value);\n this.segmentCollections.push(pathX1);\n }\n }\n }\n var textWrapWidth;\n if (heatMap.horizontalGradient) {\n for (var i = 0; i < colorCollection.length; i++) {\n if (heatMap.paletteSettings.type === 'Gradient') {\n var previousSegmentWidth = (this.segmentCollections[i] - this.segmentCollections[i - 1]) / 2;\n var nextSegmentWidth = (this.segmentCollections[i + 1] - this.segmentCollections[i]) / 2;\n if (i === colorCollection.length - 1) {\n textWrapWidth = previousSegmentWidth;\n }\n else if (i === 0) {\n textWrapWidth = nextSegmentWidth;\n }\n else {\n textWrapWidth = previousSegmentWidth < nextSegmentWidth ? previousSegmentWidth : nextSegmentWidth;\n }\n }\n else {\n var width = this.legendRectScale.width / heatMap.colorCollection.length;\n textWrapWidth = heatMap.legendSettings.labelDisplayType === 'Edge' ? width : width / 2;\n }\n this.textWrapCollections.push(textWrapWidth);\n text = getTitle(this.labelCollections[i], heatMap.legendSettings.textStyle, textWrapWidth);\n maxTextWrapLength = text.length > maxTextWrapLength ? text.length : maxTextWrapLength;\n }\n if (heatMap.legendSettings.position === 'Bottom') {\n heatMap.initialClipRect.height -= (this.maxLegendLabelSize.height * (maxTextWrapLength - 1));\n this.legendGroup.y -= (this.maxLegendLabelSize.height * (maxTextWrapLength - 1));\n this.legendRectScale.y = this.legendGroup.y + this.legendRectPadding;\n this.legendGroup.height = parseInt(this.legendHeight, 10) + (this.maxLegendLabelSize.height * (maxTextWrapLength - 1));\n }\n else {\n heatMap.initialClipRect.y += (this.maxLegendLabelSize.height * (maxTextWrapLength - 1));\n heatMap.initialClipRect.height -= (this.maxLegendLabelSize.height * (maxTextWrapLength - 1));\n this.legendRectScale.y = this.legendGroup.y + this.legendRectPadding;\n this.legendGroup.height = parseInt(this.legendHeight, 10) + (this.maxLegendLabelSize.height * (maxTextWrapLength - 1));\n }\n }\n };\n Legend.prototype.renderColorAxisGrid = function (legendRect) {\n var heatMap = this.heatMap;\n var legendElement;\n var pathX1;\n var pathY1;\n var pathX2;\n var pathY2;\n if (!heatMap.enableCanvasRendering) {\n legendElement = this.heatMap.renderer.createGroup({ id: heatMap.element.id + '_ColorAxis_Grid' });\n }\n for (var i = 0; i < heatMap.legendColorCollection.length; i++) {\n if (!heatMap.horizontalGradient) {\n pathX1 = legendRect.x;\n pathY1 = pathY2 = this.segmentCollections[i];\n pathX2 = legendRect.x + legendRect.width;\n }\n else {\n pathX1 = pathX2 = this.segmentCollections[i];\n pathY1 = legendRect.y;\n pathY2 = legendRect.y + legendRect.height;\n }\n var direction = new Line(pathX1, pathY1, pathX2, pathY2);\n var line = new LineOption(this.heatMap.element.id + '_ColorAxis_Grid' + i, direction, '#EEEEEE', 1);\n this.drawSvgCanvas.drawLine(line, legendElement);\n if (!heatMap.enableCanvasRendering) {\n this.legend.appendChild(legendElement);\n }\n }\n };\n /**\n * @private\n */\n Legend.prototype.renderLegendLabelTooltip = function (e) {\n var x = this.heatMap.mouseX;\n var y = this.heatMap.mouseY;\n if (e.target.id.indexOf('_Legend_Label') !== -1 && e.target.textContent.indexOf('...') > -1) {\n var targetId = e.target.id.split(this.heatMap.element.id + '_Legend_Label');\n if (targetId.length === 2) {\n var index = void 0;\n if (targetId[1].length === 1 || this.heatMap.legendSettings.textStyle.textOverflow === 'Trim') {\n index = parseInt(targetId[1], 10);\n }\n else {\n index = parseInt(targetId[1].substring(0, targetId[1].length - 1), 10);\n }\n showTooltip(this.labelCollections[index], x, y, this.heatMap.element.offsetWidth, this.heatMap.element.id + '_LegendLabel_Tooltip', getElement(this.heatMap.element.id + '_Secondary_Element'), null, this.heatMap);\n document.getElementById(this.heatMap.element.id + '_LegendLabel_Tooltip').style.visibility = 'visible';\n }\n }\n else {\n var element = document.getElementById(this.heatMap.element.id + '_LegendLabel_Tooltip');\n if (element) {\n element.style.visibility = 'hidden';\n }\n }\n };\n Legend.prototype.calculateListPerPage = function (rect) {\n var heatMap = this.heatMap;\n if (heatMap.horizontalGradient) {\n this.lastList = [];\n var legendX = rect.x;\n var legendY = rect.y;\n var size = 0;\n var division = 0;\n var labelX = 0;\n var labelY = 0;\n var interval = 20;\n var i = void 0;\n var legendSize = 10;\n var padding = 5;\n this.labelXCollections = [];\n this.labelYCollections = [];\n this.legendXCollections = [];\n this.legendYCollections = [];\n for (i = 0; i < heatMap.colorCollection.length; i++) {\n if (heatMap.legendSettings.showLabel) {\n var text = this.labelCollections[i];\n size = measureText(text, heatMap.legendSettings.textStyle).width;\n }\n labelX = legendX + legendSize + padding;\n labelY = legendY + padding;\n var maxWidth = heatMap.legendSettings.showLabel ? labelX + size : legendX + this.legendSize + this.listInterval;\n if (i !== 0 && maxWidth > this.legendGroup.width + this.legendGroup.x - this.listInterval) {\n division += 1;\n legendX = rect.x;\n legendY = rect.y + (division * interval);\n labelX = legendX + legendSize + padding;\n labelY = legendY + padding;\n if (division % (this.listPerPage) === 0) {\n this.lastList.push(i);\n legendY = rect.y;\n labelY = legendY + padding;\n division = 0;\n }\n }\n this.labelXCollections.push(labelX);\n this.labelYCollections.push(labelY);\n this.legendXCollections.push(legendX);\n this.legendYCollections.push(legendY);\n legendX = legendX + this.legendSize + this.labelPadding + size + this.listInterval;\n }\n this.lastList.push(i);\n this.numberOfPages = this.lastList.length;\n }\n };\n Legend.prototype.renderListLegendMode = function (rect, translate) {\n var heatMap = this.heatMap;\n var legendSize = 10;\n var tempBorder = {\n color: 'transparent',\n width: 0,\n };\n var padding = 5; // padding for legend label from top\n this.legendLabelTooltip = [];\n var listRect;\n var size = new Size(0, 0);\n var division = 0;\n var labelX = 0;\n var labelY = 0;\n var legendX = rect.x;\n var legendY = rect.y;\n if (translate) {\n this.renderPagingElements();\n }\n var x;\n var y;\n var textWrapWidth = this.legendGroup.width - (this.legendSize +\n this.legendRectPadding + this.labelPadding);\n if (!heatMap.horizontalGradient) {\n x = (this.currentPage * (this.listPerPage)) - (this.listPerPage);\n y = x + this.listPerPage;\n y = y < heatMap.colorCollection.length ? y : heatMap.colorCollection.length;\n }\n else {\n x = this.currentPage === 1 ? 0 : this.lastList[this.currentPage - 2];\n y = this.lastList[this.currentPage - 1];\n }\n for (var i = x; i < y; i++) {\n if (heatMap.legendSettings.showLabel) {\n var text = this.labelCollections[i];\n size = measureText(text, heatMap.legendSettings.textStyle);\n }\n if (heatMap.horizontalGradient) {\n legendX = this.legendXCollections[i];\n legendY = this.legendYCollections[i];\n labelX = this.labelXCollections[i];\n labelY = this.labelYCollections[i];\n }\n labelX = legendX + this.legendSize + this.labelPadding;\n labelY = legendY + padding;\n if (translate && heatMap.rendering && this.legendRange.length <= heatMap.colorCollection.length) {\n var rectPosition = new LegendRange(legendX, legendY, legendSize, legendSize, heatMap.colorCollection[i].value, true, this.currentPage);\n rectPosition.visible = !isNullOrUndefined(this.visibilityCollections[i]) ? this.visibilityCollections[i] : true;\n this.legendRange.push(rectPosition);\n if (heatMap.legendSettings.showLabel) {\n var textPosition = new LegendRange(labelX, (labelY - size.height / 2), size.width, size.height, heatMap.colorCollection[i].value, true, this.currentPage);\n textPosition.visible = !isNullOrUndefined(this.visibilityCollections[i]) ? this.visibilityCollections[i] : true;\n this.legendTextRange.push(textPosition);\n }\n }\n if (heatMap.legendSettings.showLabel) {\n var text = getTitle(this.labelCollections[i], heatMap.legendSettings.textStyle, textWrapWidth);\n if (text[0].indexOf('...') !== -1 && heatMap.enableCanvasRendering) {\n this.legendLabelTooltip.push(new CanvasTooltip(this.labelCollections[i], new Rect(labelX, labelY, size.width, size.height)));\n }\n var textBasic = new TextBasic(labelX, labelY, 'start', text, 0, 'translate(0,0)', 'middle');\n var options = new TextOption(heatMap.element.id + '_Legend_Label' + i, textBasic, heatMap.legendSettings.textStyle, heatMap.legendSettings.textStyle.color || heatMap.themeStyle.legendLabel);\n options.fill = heatMap.legendOnLoad ? options.fill : this.legendRange[i].visible ? options.fill : '#D3D3D3';\n this.drawSvgCanvas.createText(options, this.translategroup, text[0]);\n if (Browser.isIE && !heatMap.enableCanvasRendering) {\n this.translategroup.lastChild.setAttribute('dy', '0.6ex');\n }\n }\n listRect = new Rect(legendX, legendY, legendSize, legendSize);\n var listColor = heatMap.legendOnLoad ? heatMap.colorCollection[i].color :\n this.legendRange[i].visible ? heatMap.colorCollection[i].color : '#D3D3D3';\n var rectItems = new RectOption(heatMap.element.id + '_legend_list' + i, listColor, tempBorder, 1, listRect);\n this.drawSvgCanvas.drawRectangle(rectItems, this.translategroup);\n heatMap.horizontalGradient ? legendX = legendX + this.legendSize + this.labelPadding + size.width + this.listInterval :\n legendY += this.legendSize + this.listInterval;\n }\n if (!heatMap.enableCanvasRendering) {\n this.legendGroup.height = this.legendGroup.height > 0 ? this.legendGroup.height : 0;\n this.legendGroup.width = this.legendGroup.width > 0 ? this.legendGroup.width : 0;\n var clippath = heatMap.renderer.createClipPath({ id: heatMap.element.id + '_LegendScale_ClipPath' });\n var clipRect = heatMap.renderer.drawRectangle(this.legendGroup);\n clippath.appendChild(clipRect);\n this.translategroup.appendChild(clippath);\n this.translategroup.setAttribute('style', 'clip-path:url(#' + clippath.id + ')');\n this.legendScale.appendChild(this.translategroup);\n heatMap.svgObject.appendChild(this.legend);\n }\n };\n /**\n * @private\n */\n Legend.prototype.translatePage = function (heatMap, page, isNext) {\n var padding = 5;\n if ((isNext && page >= 1 && page < this.numberOfPages) || (!isNext && page > 1 && page <= this.numberOfPages)) {\n if (isNext) {\n this.currentPage += 1;\n this.legendRect.y += this.legendRect.height;\n }\n else {\n this.currentPage -= 1;\n this.legendRect.y -= this.legendRect.height;\n }\n if (!heatMap.enableCanvasRendering) {\n this.paginggroup.removeChild(this.paginggroup.firstChild);\n while (this.translategroup.childNodes.length) {\n this.translategroup.removeChild(this.translategroup.firstChild);\n }\n }\n else {\n var ctx = heatMap.canvasRenderer.ctx;\n ctx.fillRect(this.legendRectScale.x - padding, this.legendRectScale.y - padding, this.legendRectScale.width +\n padding, this.legendRectScale.height + (2 * padding));\n ctx.fillRect(this.pagingRect.x, this.pagingRect.y, this.pagingRect.width, this.pagingRect.height);\n }\n this.renderListLegendMode(this.legendRectScale, true);\n }\n if (heatMap.enableCanvasRendering && heatMap.allowSelection && heatMap.rectSelected) {\n var ctx = heatMap.secondaryCanvasRenderer.ctx;\n var position = heatMap.legendSettings.position;\n var initialRect = heatMap.initialClipRect;\n var rectX = position === 'Right' ? initialRect.x + initialRect.width : 0;\n var rectY = position === 'Bottom' ? initialRect.y + initialRect.height : 0;\n var rectWidth = position === 'Right' ? heatMap.availableSize.width - (initialRect.x +\n initialRect.width) : position === 'Left' ? initialRect.x : heatMap.availableSize.width;\n var rectHeight = position === 'Top' ? initialRect.y : position === 'Bottom' ?\n heatMap.availableSize.height - (initialRect.y + initialRect.height) : heatMap.availableSize.height;\n ctx.save();\n ctx.clearRect(rectX, rectY, rectWidth, rectHeight);\n ctx.restore();\n var oldCanvas = document.getElementById(heatMap.element.id + '_canvas');\n var newCanvas = document.getElementById(heatMap.element.id + '_secondary_canvas');\n var rectImage = oldCanvas.getContext('2d').getImageData(rectX, rectY, rectWidth, rectHeight);\n newCanvas.getContext('2d').putImageData(rectImage, rectX, rectY);\n oldCanvas.style.opacity = '0.3';\n }\n };\n /**\n * To create div container for tooltip which appears on hovering the smart legend.\n * @param heatmap\n * @private\n */\n Legend.prototype.createTooltipDiv = function (heatMap) {\n var element = createElement('div', {\n id: this.heatMap.element.id + 'legendLabelTooltipContainer',\n styles: 'position:absolute'\n });\n this.heatMap.element.appendChild(element);\n };\n /**\n * To render tooltip for smart legend.\n * @private\n */\n Legend.prototype.renderTooltip = function (currentLegendRect) {\n var heatMap = this.heatMap;\n var tempTooltipText = [currentLegendRect.label];\n var offset = null;\n offset = parseInt(heatMap.legendSettings.textStyle.size, 10) / 2;\n this.tooltipObject = new tool({\n offset: offset,\n theme: heatMap.theme,\n content: tempTooltipText,\n location: {\n x: currentLegendRect.x + (currentLegendRect.width / 2),\n y: currentLegendRect.y + (currentLegendRect.height / 2)\n },\n inverted: heatMap.horizontalGradient ? false : true,\n areaBounds: {\n height: this.legendGroup.height + this.legendGroup.y,\n width: this.legendGroup.width + this.legendGroup.x,\n x: heatMap.legendSettings.position === 'Right' ? 0 : this.legendGroup.x,\n y: heatMap.legendSettings.position === 'Top' ? heatMap.titleSettings.text === '' ? this.legendGroup.height -\n this.legendGroup.y : this.legendGroup.y : 0\n }\n }, '#' + this.heatMap.element.id + 'legendLabelTooltipContainer');\n this.tooltipObject.element.style.visibility = 'visible';\n };\n /**\n * To create tooltip for smart legend.\n * @private\n */\n Legend.prototype.createTooltip = function (pageX, pageY) {\n var currentLegendRect;\n for (var i = 0; i < this.heatMap.colorCollection.length; i++) {\n var position = this.legendRectPositionCollection[i];\n if (pageX > position.x && pageX < position.width + position.x &&\n pageY > position.y && pageY < position.height + position.y) {\n currentLegendRect = this.legendRectPositionCollection[i];\n break;\n }\n }\n var ele = document.getElementById(this.heatMap.element.id + 'legendLabelTooltipContainer');\n if (ele && ele.style.visibility === 'visible' && this.tooltipObject && !this.heatMap.isTouch) {\n this.tooltipObject.fadeOut();\n ele.style.visibility = 'hidden';\n }\n if (currentLegendRect) {\n this.renderTooltip(currentLegendRect);\n }\n };\n /**\n * Toggle the visibility of cells based on legend selection\n * @private\n */\n Legend.prototype.legendRangeSelection = function (index) {\n var heatMap = this.heatMap;\n var legendRange = this.legendRange;\n var padding = 5;\n var legendBound = this.legendRectScale;\n heatMap.rangeSelection = true;\n if (heatMap.enableCanvasRendering) {\n var ctx = heatMap.canvasRenderer.ctx;\n if (heatMap.legendSettings.enableSmartLegend) {\n ctx.fillRect(legendBound.x - padding, legendBound.y - padding, (legendBound.width + this.labelPadding + this.maxLegendLabelSize.width) + padding, legendBound.height + (2 * padding));\n }\n else {\n ctx.fillRect(legendBound.x - padding, legendBound.y - padding, legendBound.width +\n padding, legendBound.height + (2 * padding));\n }\n }\n else {\n if (heatMap.legendSettings.enableSmartLegend) {\n while (this.legend && this.legend.childNodes.length) {\n this.legend.removeChild(this.legend.firstChild);\n }\n }\n else {\n while (this.translategroup && this.translategroup.childNodes.length) {\n this.translategroup.removeChild(this.translategroup.firstChild);\n }\n }\n removeElement(heatMap.heatMapSeries.containerRectObject.id);\n if (heatMap.cellSettings.showLabel) {\n removeElement(heatMap.heatMapSeries.containerTextObject.id);\n }\n }\n if (heatMap.legendSettings.enableSmartLegend) {\n if (heatMap.colorCollection.length !== heatMap.legendColorCollection.length) {\n if (index === heatMap.legendColorCollection.length - 1) {\n heatMap.toggleValue[index - 1].visible = this.visibilityCollections[index - 1] =\n legendRange[index - 1].visible = !legendRange[index].visible;\n }\n else {\n if (index === heatMap.colorCollection.length - 1) {\n heatMap.toggleValue[index + 1].visible = this.visibilityCollections[index + 1] =\n legendRange[index + 1].visible = !legendRange[index].visible;\n }\n }\n }\n }\n heatMap.toggleValue[index].visible = this.visibilityCollections[index] = legendRange[index].visible = !legendRange[index].visible;\n heatMap.legendOnLoad = false;\n if (heatMap.legendSettings.enableSmartLegend) {\n this.renderSmartLegend();\n var rectItemsSvg = new Rect(legendBound.x, legendBound.y, legendBound.width, legendBound.height);\n this.renderLegendLabel(rectItemsSvg);\n }\n else {\n this.renderListLegendMode(this.legendRectScale, false);\n }\n heatMap.heatMapSeries.renderRectSeries();\n heatMap.clearSelection();\n if (heatMap.enableCanvasRendering && heatMap.allowSelection) {\n // heatMap.createSvg();\n // heatMap.refreshBound();\n // heatMap.createMultiCellDiv(false);\n }\n };\n /**\n * update visibility collections of legend and series\n * @private\n */\n Legend.prototype.updateLegendRangeCollections = function () {\n var heatMap = this.heatMap;\n heatMap.rangeSelection = !heatMap.legendOnLoad ? true : false;\n this.visibilityCollections = !heatMap.legendOnLoad ? this.visibilityCollections : [];\n heatMap.toggleValue = !heatMap.legendOnLoad ? heatMap.toggleValue : [];\n this.legendRange = !heatMap.legendOnLoad ? this.legendRange : [];\n this.legendTextRange = !heatMap.legendOnLoad ? this.legendTextRange : [];\n };\n return Legend;\n}());\nexport { Legend };\n","/**\n * Heat Map Component\n */\nvar __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, Property, NotifyPropertyChanges, Internationalization, Complex, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { remove, Event, EventHandler, Touch } from '@syncfusion/ej2-base';\nimport { Browser } from '@syncfusion/ej2-base';\nimport { SvgRenderer, CanvasRenderer } from '@syncfusion/ej2-svg-base';\nimport { Size, stringToNumber, RectOption, Rect, TextBasic, measureText } from './utils/helper';\nimport { DrawSvgCanvas, TextOption, titlePositionX, getTitle, showTooltip, getElement, SelectedCellDetails } from './utils/helper';\nimport { removeElement, CanvasTooltip, getTooltipText } from './utils/helper';\nimport { Margin, Title } from './model/base';\nimport { Theme, getThemeColor } from './model/theme';\nimport { Axis } from './axis/axis';\nimport { AxisHelper } from './axis/axis-helpers';\nimport { Series, CellSettings } from './series/series';\nimport { PaletteSettings, CellColor } from './utils/colorMapping';\nimport { TooltipSettings } from './utils/tooltip';\nimport { TwoDimensional } from './datasource/twodimensional';\nimport { LegendSettings } from '../heatmap/legend/legend';\nvar HeatMap = /** @class */ (function (_super) {\n __extends(HeatMap, _super);\n function HeatMap() {\n /**\n * The width of the heatmap as a string accepts input as both like '100px' or '100%'.\n * If specified as '100%, heatmap renders to the full width of its parent element.\n * @default null\n */\n var _this = _super !== null && _super.apply(this, arguments) || this;\n /** @private */\n _this.enableCanvasRendering = false;\n /** @private */\n _this.isCellTapHold = false;\n /** @private */\n _this.selectedCellCount = 0;\n /** @private */\n _this.toggleValue = [];\n /** @private */\n _this.legendOnLoad = true;\n /** @private */\n _this.resizing = false;\n /** @private */\n _this.rendering = true;\n /** @private */\n _this.horizontalGradient = _this.legendSettings.position === 'Bottom' || _this.legendSettings.position === 'Top';\n /** @private */\n _this.multiSelection = false;\n /** @private */\n _this.rectSelected = false;\n /** @private */\n _this.previousSelectedCellsRect = [];\n /** @private */\n _this.multiCellCollection = [];\n /** @private */\n _this.selectedMultiCellCollection = [];\n /** @private */\n _this.tempMultiCellCollection = [];\n /**\n * @private\n */\n _this.tooltipCollection = [];\n /**\n * @private\n */\n _this.isCellData = false;\n return _this;\n }\n HeatMap.prototype.preRender = function () {\n this.initPrivateVariable();\n this.unWireEvents();\n this.wireEvents();\n };\n HeatMap.prototype.initPrivateVariable = function () {\n this.renderer = new SvgRenderer(this.element.id);\n this.canvasRenderer = new CanvasRenderer(this.element.id);\n this.secondaryCanvasRenderer = new CanvasRenderer(this.element.id + '_secondary');\n this.heatMapAxis = new AxisHelper(this);\n this.heatMapSeries = new Series(this);\n this.drawSvgCanvas = new DrawSvgCanvas(this);\n this.twoDimensional = new TwoDimensional(this);\n this.cellColor = new CellColor(this);\n this.tempRectHoverClass = '';\n this.tempTooltipRectId = '';\n this.setCulture();\n };\n /**\n * Method to set culture for heatmap\n */\n HeatMap.prototype.setCulture = function () {\n this.intl = new Internationalization();\n };\n HeatMap.prototype.render = function () {\n this.updateBubbleHelperProperty();\n this.trigger('load', { heatmap: this });\n this.initAxis();\n this.processInitData();\n this.setTheme();\n this.calculateMaxLength();\n this.heatMapAxis.calculateVisibleLabels();\n this.twoDimensional.processDataSource(this.completeAdaptDataSource);\n this.createSvg();\n this.cellColor.getColorCollection();\n this.calculateBounds();\n this.renderElements();\n this.appendSvgObject();\n if (this.tooltipModule) {\n this.tooltipModule.showHideTooltip(false);\n }\n };\n /**\n * To re-calculate the datasource while changing datasource property dynamically.\n * @private\n */\n HeatMap.prototype.reRenderDatasource = function () {\n this.dataSourceMinValue = null;\n this.dataSourceMaxValue = null;\n this.processInitData();\n this.calculateMaxLength();\n this.heatMapAxis.calculateVisibleLabels();\n this.twoDimensional.processDataSource(this.completeAdaptDataSource);\n this.cellColor.getColorCollection();\n this.calculateBounds();\n };\n /**\n * To process datasource property.\n * @private\n */\n HeatMap.prototype.processInitData = function () {\n if (this.adaptorModule) {\n this.adaptorModule.constructDatasource(this.dataSource);\n }\n else {\n this.completeAdaptDataSource = this.dataSource;\n }\n };\n /**\n * To set render mode of heatmap as SVG or Canvas.\n * @private\n */\n HeatMap.prototype.setRenderMode = function () {\n if (this.renderingMode === 'Canvas') {\n this.enableCanvasRendering = true;\n }\n else if (this.renderingMode === 'Auto' &&\n (this.axisCollections[0].axisLabelSize * this.axisCollections[1].axisLabelSize) >= 10000) {\n this.enableCanvasRendering = true;\n }\n else {\n this.enableCanvasRendering = false;\n }\n };\n /**\n * To set bubble helper private property.\n * @private\n */\n HeatMap.prototype.updateBubbleHelperProperty = function () {\n if (this.cellSettings.tileType === 'Bubble' &&\n (this.cellSettings.bubbleType === 'Size' || this.cellSettings.bubbleType === 'Sector')) {\n this.legendVisibilityByCellType = false;\n }\n else if (this.legendModule && this.legendSettings.visible) {\n this.legendVisibilityByCellType = true;\n }\n if (this.cellSettings.tileType === 'Bubble' && this.cellSettings.bubbleType === 'SizeAndColor') {\n this.bubbleSizeWithColor = true;\n }\n else {\n this.bubbleSizeWithColor = false;\n }\n };\n HeatMap.prototype.renderElements = function () {\n this.tooltipCollection = [];\n this.renderSecondaryElement();\n this.renderBorder();\n this.renderTitle();\n this.heatMapAxis.renderAxes();\n if (this.tooltipModule && this.showTooltip) {\n this.tooltipModule.tooltipObject = null;\n this.tooltipModule.createTooltipDiv(this);\n }\n this.heatMapSeries.renderRectSeries();\n if (this.legendModule && this.legendSettings.visible\n && this.legendVisibilityByCellType) {\n this.legendModule.renderLegendItems();\n if (this.paletteSettings.type === 'Fixed' && this.legendSettings.enableSmartLegend &&\n this.legendSettings.labelDisplayType === 'None') {\n this.legendModule.createTooltipDiv(this);\n }\n }\n };\n /**\n * Get component name\n */\n HeatMap.prototype.getModuleName = function () {\n return 'heatmap';\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @private\n */\n HeatMap.prototype.getPersistData = function () {\n return '';\n };\n HeatMap.prototype.onPropertyChanged = function (newProp, oldProp) {\n var renderer = false;\n var refreshBounds = false;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'renderingMode':\n this.rendering = false;\n renderer = true;\n break;\n case 'cellSettings':\n this.updateBubbleHelperProperty();\n if (this.legendModule && ((newProp.cellSettings.tileType !==\n oldProp.cellSettings.tileType) || (newProp.cellSettings.bubbleType !== oldProp.cellSettings.bubbleType))) {\n this.legendOnLoad = true;\n this.legendModule.updateLegendRangeCollections();\n }\n this.reRenderDatasource();\n refreshBounds = true;\n break;\n case 'showTooltip':\n refreshBounds = true;\n break;\n case 'dataSource':\n this.isCellData = false;\n this.updateBubbleHelperProperty();\n if (this.legendVisibilityByCellType) {\n this.legendOnLoad = true;\n this.legendModule.updateLegendRangeCollections();\n }\n this.reRenderDatasource();\n renderer = true;\n break;\n case 'titleSettings':\n case 'width':\n case 'height':\n case 'margin':\n refreshBounds = true;\n break;\n case 'legendSettings':\n this.updateBubbleHelperProperty();\n if (this.legendVisibilityByCellType && (((newProp.legendSettings.visible !== oldProp.legendSettings.visible) ||\n (newProp.legendSettings.enableSmartLegend !== oldProp.legendSettings.enableSmartLegend)))) {\n this.legendOnLoad = true;\n this.legendModule.updateLegendRangeCollections();\n }\n else {\n this.legendOnLoad = false;\n }\n refreshBounds = true;\n break;\n case 'yAxis':\n case 'xAxis':\n this.updateBubbleHelperProperty();\n if (this.legendVisibilityByCellType) {\n this.legendOnLoad = true;\n this.legendModule.updateLegendRangeCollections();\n }\n this.reRenderDatasource();\n refreshBounds = true;\n break;\n case 'paletteSettings':\n this.updateBubbleHelperProperty();\n if (this.legendVisibilityByCellType) {\n this.legendOnLoad = true;\n this.legendModule.updateLegendRangeCollections();\n }\n this.cellColor.getColorCollection();\n this.calculateBounds();\n renderer = true;\n break;\n case 'theme':\n this.setTheme();\n renderer = true;\n break;\n case 'tooltipSettings':\n if (this.tooltipModule) {\n this.tooltipModule.tooltipObject.fill = this.tooltipSettings.fill;\n this.tooltipModule.tooltipObject.border = this.tooltipSettings.border;\n this.tooltipModule.tooltipObject.textStyle = this.tooltipSettings.textStyle;\n this.tooltipModule.tooltipObject.refresh();\n }\n break;\n }\n }\n if (!refreshBounds && renderer) {\n this.createSvg();\n this.renderElements();\n this.appendSvgObject();\n this.trigger('created');\n this.clearSelection();\n }\n else if (refreshBounds) {\n this.createSvg();\n this.refreshBound();\n this.appendSvgObject();\n this.trigger('created');\n }\n if (this.allowSelection && this.rectSelected) {\n this.clearSelection();\n }\n this.rendering = true;\n };\n /**\n * create svg or canvas element\n * @private\n */\n HeatMap.prototype.createSvg = function () {\n this.removeSvg();\n this.setRenderMode();\n this.calculateSize();\n if (!this.enableCanvasRendering) {\n this.svgObject = this.renderer.createSvg({\n id: this.element.id + '_svg',\n width: this.availableSize.width,\n height: this.availableSize.height\n });\n if (this.cellSettings.border.width.toString() === '0' && this.cellSettings.tileType === 'Rect') {\n this.svgObject.setAttribute('shape-rendering', 'crispEdges');\n }\n }\n else {\n this.svgObject = this.canvasRenderer.createCanvas({\n id: this.element.id + '_canvas',\n width: this.availableSize.width,\n height: this.availableSize.height\n });\n if (this.allowSelection) {\n this.createMultiCellDiv(true);\n }\n }\n };\n /**\n * To Remove the SVG.\n * @private\n */\n HeatMap.prototype.removeSvg = function () {\n if (document.getElementById(this.element.id + '_Secondary_Element')) {\n remove(document.getElementById(this.element.id + '_Secondary_Element'));\n }\n if (document.getElementById(this.element.id + 'Celltooltipcontainer')) {\n remove(document.getElementById(this.element.id + 'Celltooltipcontainer'));\n }\n if (document.getElementById(this.element.id + 'legendLabelTooltipContainer')) {\n remove(document.getElementById(this.element.id + 'legendLabelTooltipContainer'));\n }\n if (document.getElementById(this.element.id + '_Multi_CellSelection_Canvas')) {\n remove(document.getElementById(this.element.id + '_Multi_CellSelection_Canvas'));\n }\n if (document.getElementById(this.element.id + '_CellSelection_Container')) {\n remove(document.getElementById(this.element.id + '_CellSelection_Container'));\n }\n if (this.svgObject) {\n var svgElement = document.getElementById(this.svgObject.id);\n if (svgElement) {\n while (this.svgObject.childNodes.length) {\n this.svgObject.removeChild(this.svgObject.firstChild);\n }\n remove(this.svgObject);\n }\n }\n };\n HeatMap.prototype.renderSecondaryElement = function () {\n var tooltipDiv = this.createElement('div');\n tooltipDiv.id = this.element.id + '_Secondary_Element';\n this.element.appendChild(tooltipDiv);\n var divElement = this.createElement('div', {\n id: this.element.id + '_CellSelection_Container',\n styles: 'position:absolute; z-index: 2 ; top:' + this.initialClipRect.y + 'px' + '; left:' + this.initialClipRect.x + 'px',\n });\n this.element.appendChild(divElement);\n };\n /**\n * To provide the array of modules needed for control rendering\n * @return{ModuleDeclaration[]}\n * @private\n */\n HeatMap.prototype.requiredModules = function () {\n var modules = [];\n if (this.showTooltip) {\n modules.push({\n member: 'Tooltip',\n args: [this]\n });\n }\n if (this.legendSettings) {\n modules.push({\n member: 'Legend',\n args: [this]\n });\n }\n if (this.dataSource) {\n modules.push({\n member: 'Adaptor',\n args: [this]\n });\n }\n return modules;\n };\n /**\n * To destroy the widget\n * @method destroy\n * @return {void}.\n * @member of Heatmap\n */\n HeatMap.prototype.destroy = function () {\n this.unWireEvents();\n _super.prototype.destroy.call(this);\n this.element.innerHTML = '';\n this.element.classList.remove('e-heatmap');\n };\n /**\n * Applies all the pending property changes and render the component again.\n * @method destroy\n * @return {void}.\n */\n HeatMap.prototype.refresh = function () {\n _super.prototype.refresh.call(this);\n this.element.classList.add('e-heatmap');\n };\n /**\n * Appending svg object to the element\n * @private\n */\n HeatMap.prototype.appendSvgObject = function () {\n if (this.enableCanvasRendering && this.allowSelection) {\n this.createMultiCellDiv(false);\n }\n else {\n this.element.appendChild(this.svgObject);\n }\n };\n HeatMap.prototype.renderBorder = function () {\n this.border = {\n width: 0\n };\n var width = 0;\n var rect = new RectOption(this.element.id + '_HeatmapBorder', this.themeStyle.background, this.border, 1, new Rect(width / 2, width / 2, this.availableSize.width - width, this.availableSize.height - width));\n this.drawSvgCanvas.drawRectangle(rect, this.svgObject);\n };\n HeatMap.prototype.calculateSize = function () {\n var width = stringToNumber(this.width, this.element.offsetWidth) || this.element.offsetWidth || 600;\n var height = stringToNumber(this.height, this.element.offsetHeight) || this.element.offsetHeight || 450;\n this.availableSize = new Size(width, height);\n };\n HeatMap.prototype.renderTitle = function () {\n if (this.titleSettings.text) {\n var titleStyle = this.titleSettings.textStyle;\n var anchor = titleStyle.textAlignment === 'Near' ? 'start' :\n titleStyle.textAlignment === 'Far' ? 'end' : 'middle';\n this.elementSize = measureText(this.titleCollection[0], titleStyle);\n var options = new TextOption(this.element.id + '_HeatmapTitle', new TextBasic(titlePositionX(this.availableSize.width - this.margin.left - this.margin.right, this.margin.left, this.margin.right, titleStyle), this.margin.top + ((this.elementSize.height) * 3 / 4), anchor, this.titleCollection), titleStyle, titleStyle.color || this.themeStyle.heatMapTitle);\n if (this.titleCollection.length > 1) {\n this.drawSvgCanvas.createWrapText(options, titleStyle, this.svgObject);\n }\n else {\n this.drawSvgCanvas.createText(options, this.svgObject, this.titleCollection[0]);\n if (this.titleCollection[0].indexOf('...') !== -1 && this.enableCanvasRendering) {\n this.tooltipCollection.push(new CanvasTooltip(this.titleSettings.text, new Rect(this.margin.left, this.margin.top, this.elementSize.width, this.elementSize.height)));\n }\n }\n }\n };\n HeatMap.prototype.titleTooltip = function (event, x, y, isTouch) {\n var targetId = event.target.id;\n if ((targetId === (this.element.id + '_HeatmapTitle')) && (event.target.textContent.indexOf('...') > -1)) {\n showTooltip(this.titleSettings.text, x, y, this.element.offsetWidth, this.element.id + '_Title_Tooltip', getElement(this.element.id + '_Secondary_Element'), isTouch, this);\n }\n else {\n removeElement(this.element.id + '_Title_Tooltip');\n }\n };\n HeatMap.prototype.axisTooltip = function (event, x, y, isTouch) {\n var targetId = event.target.id;\n if ((targetId.indexOf(this.element.id + '_XAxis_Label') !== -1) ||\n (targetId.indexOf(this.element.id + '_XAxis_MultiLevel') !== -1) ||\n (targetId.indexOf(this.element.id + '_YAxis_MultiLevel') !== -1)) {\n var tooltipText = getTooltipText(this.tooltipCollection, x, y);\n if (tooltipText) {\n showTooltip(tooltipText, x, y, this.element.offsetWidth, this.element.id + '_axis_Tooltip', getElement(this.element.id + '_Secondary_Element'), this.isTouch, this);\n }\n else {\n removeElement(this.element.id + '_axis_Tooltip');\n }\n }\n else {\n removeElement(this.element.id + '_axis_Tooltip');\n }\n };\n HeatMap.prototype.isHeatmapRect = function (x, y) {\n var firstRectDetails = [];\n var lastRectDetails = [];\n var isRect;\n firstRectDetails.push(this.heatMapSeries.rectPositionCollection[0][0]);\n lastRectDetails.push(this.heatMapSeries.rectPositionCollection[this.yLength - 1][this.xLength - 1]);\n isRect = (x >= firstRectDetails[0].x && y >= firstRectDetails[0].y &&\n x <= (lastRectDetails[0].x + lastRectDetails[0].width) &&\n y <= (lastRectDetails[0].y + lastRectDetails[0].height)) ? true : false;\n return isRect;\n };\n HeatMap.prototype.setTheme = function () {\n /*! Set theme */\n this.themeStyle = getThemeColor(this.theme);\n };\n HeatMap.prototype.calculateBounds = function () {\n var margin = this.margin;\n // Title Height;\n var titleHeight = 0;\n var padding = (this.legendModule && this.legendSettings.position === 'Top'\n && this.legendVisibilityByCellType) || this.titleSettings.textStyle.size === '0px' ? 0 : 16; // title padding\n var left = margin.left;\n var width = this.availableSize.width - left - margin.right;\n if (this.titleSettings.text) {\n this.titleCollection = getTitle(this.titleSettings.text, this.titleSettings.textStyle, width);\n titleHeight = (measureText(this.titleSettings.text, this.titleSettings.textStyle).height * this.titleCollection.length) +\n padding;\n }\n var top = margin.top + titleHeight;\n this.titleRect = new Rect(margin.left, margin.top, this.availableSize.width - margin.left - margin.right, titleHeight);\n var height = this.availableSize.height - top - margin.bottom;\n this.initialClipRect = new Rect(left, top, width, height);\n var legendTop = this.initialClipRect.y;\n if (this.legendModule && this.legendSettings.visible && this.legendVisibilityByCellType) {\n this.legendModule.calculateLegendBounds(this.initialClipRect);\n }\n this.heatMapAxis.measureAxis(this.initialClipRect);\n if (this.legendModule && this.legendSettings.visible && this.legendVisibilityByCellType) {\n this.legendModule.calculateLegendSize(this.initialClipRect, legendTop);\n }\n this.heatMapAxis.calculateAxisSize(this.initialClipRect);\n };\n HeatMap.prototype.refreshBound = function () {\n this.updateBubbleHelperProperty();\n this.calculateBounds();\n this.renderElements();\n };\n HeatMap.prototype.initAxis = function () {\n var axis;\n var axes = [this.xAxis, this.yAxis];\n this.axisCollections = [];\n for (var i = 0, len = axes.length; i < len; i++) {\n axis = axes[i];\n axis.orientation = (i === 0) ? 'Horizontal' : 'Vertical';\n axis.jsonCellLabel = [];\n this.axisCollections.push(axis);\n }\n };\n /**\n * Method to bind events for HeatMap\n */\n HeatMap.prototype.wireEvents = function () {\n /*! Find the Events type */\n var isIE11Pointer = Browser.isPointer;\n var start = Browser.touchStartEvent;\n var stop = Browser.touchEndEvent;\n var move = Browser.touchMoveEvent;\n var cancel = isIE11Pointer ? 'pointerleave' : 'mouseleave';\n EventHandler.add(this.element, Browser.isDevice ? start : 'click', this.heatMapMouseClick, this);\n EventHandler.add(this.element, start, this.heatMapMouseMove, this);\n EventHandler.add(this.element, stop, this.heatMapMouseLeave, this);\n EventHandler.add(this.element, move, this.heatMapMouseMove, this);\n EventHandler.add(this.element, cancel, this.heatMapMouseLeave, this);\n window.addEventListener((Browser.isTouch && ('orientation' in window && 'onorientationchange' in window)) ? 'orientationchange' : 'resize', this.heatMapResize.bind(this));\n var heatmap = this;\n /**\n * Support for touch tapHold and tap for HeatMap\n */\n var touchObj = new Touch(this.element, {\n tapHold: function () {\n heatmap.isCellTapHold = true;\n heatmap.getDataCollection();\n heatmap.currentRect.allowCollection = false;\n heatmap.setCellOpacity();\n var argData = {\n heatmap: heatmap,\n cancel: false,\n name: 'cellSelected',\n data: heatmap.multiCellCollection\n };\n heatmap.trigger('cellSelected', argData);\n },\n tap: function () {\n var isCellTap = false;\n if (!heatmap.isCellTapHold) {\n isCellTap = true;\n }\n heatmap.tooltipOnMouseMove(null, heatmap.currentRect, isCellTap);\n }\n });\n this.setStyle(this.element);\n };\n /**\n * Applying styles for heatmap element\n */\n HeatMap.prototype.setStyle = function (element) {\n element.style.touchAction = 'element';\n element.style.msTouchAction = 'element';\n element.style.msContentZooming = 'none';\n element.style.msUserSelect = 'none';\n element.style.webkitUserSelect = 'none';\n element.style.position = 'relative';\n element.style.display = 'block';\n };\n /**\n * Method to unbind events for HeatMap\n */\n HeatMap.prototype.unWireEvents = function () {\n /*! Find the Events type */\n var isIE11Pointer = Browser.isPointer;\n var start = Browser.touchStartEvent;\n var stop = Browser.touchEndEvent;\n var move = Browser.touchMoveEvent;\n var cancel = isIE11Pointer ? 'pointerleave' : 'mouseleave';\n EventHandler.remove(this.element, Browser.isDevice ? start : 'click', this.heatMapMouseClick);\n EventHandler.remove(this.element, start, this.heatMapMouseMove);\n EventHandler.remove(this.element, move, this.heatMapMouseLeave);\n EventHandler.remove(this.element, move, this.heatMapMouseMove);\n EventHandler.remove(this.element, cancel, this.heatMapMouseLeave);\n window.removeEventListener((Browser.isTouch && ('orientation' in window && 'onorientationchange' in window)) ? 'orientationchange' : 'resize', this.heatMapResize);\n };\n /**\n * Handles the heatmap resize.\n * @return {boolean}\n * @private\n */\n HeatMap.prototype.heatMapResize = function (e) {\n var _this = this;\n this.resizing = true;\n var argData = {\n heatmap: this,\n cancel: false,\n name: 'resized',\n currentSize: new Size(0, 0),\n previousSize: new Size(this.availableSize.width, this.availableSize.height),\n };\n if (this.resizeTimer) {\n clearTimeout(this.resizeTimer);\n }\n this.resizeTimer = setTimeout(function () {\n if (_this.isDestroyed) {\n clearTimeout(_this.resizeTimer);\n return;\n }\n _this.createSvg();\n argData.currentSize = _this.availableSize;\n _this.trigger('resized', argData);\n _this.refreshBound();\n _this.appendSvgObject();\n if (_this.allowSelection) {\n _this.updateCellSelection();\n }\n _this.trigger('loaded', { heatmap: _this });\n _this.resizing = false;\n }, 500);\n return false;\n };\n /**\n * Method to bind selection after window resize for HeatMap\n */\n HeatMap.prototype.updateCellSelection = function () {\n var wSize = this.initialClipRect.width / this.axisCollections[0].axisLabelSize;\n var hSize = this.initialClipRect.height / this.axisCollections[1].axisLabelSize;\n var x = this.initialClipRect.x;\n var y = this.initialClipRect.y;\n if (!this.enableCanvasRendering) {\n if (this.multiCellCollection.length !== 0) {\n var containersRect = document.getElementById(this.element.id + '_Container_RectGroup');\n var containerText = document.getElementById(this.element.id + '_Container_TextGroup');\n for (var i = 0; i < containersRect.childNodes.length; i++) {\n containersRect.childNodes[i].setAttribute('opacity', '0.3');\n if (this.cellSettings.showLabel && containerText.childNodes[i]) {\n containerText.childNodes[i].setAttribute('opacity', '0.3');\n }\n }\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n var collectionClass = this.multiCellCollection[i].cellElement;\n var cellIndex = collectionClass.id.replace(this.element.id + '_HeatMapRect_', '');\n var index = parseInt(cellIndex, 10);\n containersRect.childNodes[index].setAttribute('opacity', '1');\n if (this.cellSettings.showLabel && containerText.childNodes[i]) {\n var getText = document.getElementById(this.element.id + '_HeatMapRectLabels_' + index);\n if (getText) {\n getText.setAttribute('opacity', '1');\n }\n this.addSvgClass(containersRect.childNodes[index]);\n }\n }\n }\n }\n else if (this.enableCanvasRendering) {\n var rect = this.multiCellCollection;\n var oldCanvas = document.getElementById(this.element.id + '_canvas');\n var newCanvas = document.getElementById(this.element.id + '_secondary_canvas');\n var initialRect = this.initialClipRect;\n var rectHeight = initialRect.y + initialRect.height;\n var rectWidth = initialRect.x + initialRect.width;\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n this.multiCellCollection[i].width = rect[i].width = wSize;\n this.multiCellCollection[i].height = rect[i].height = hSize;\n this.multiCellCollection[i].x = rect[i].x = x + wSize * this.multiCellCollection[i].xPosition;\n this.multiCellCollection[i].y = rect[i].y = y + hSize * this.multiCellCollection[i].yPosition;\n var rectImage = oldCanvas.getContext('2d').getImageData(rect[i].x, rect[i].y, rect[i].width, rect[i].height);\n newCanvas.getContext('2d').putImageData(rectImage, rect[i].x, rect[i].y);\n oldCanvas.style.opacity = '0.3';\n }\n var topPositions = oldCanvas.getContext('2d').getImageData(0, 0, this.availableSize.width, initialRect.y);\n newCanvas.getContext('2d').putImageData(topPositions, 0, 0);\n var bottomPositions = oldCanvas.getContext('2d').getImageData(0, rectHeight, this.availableSize.width, this.availableSize.height - rectHeight);\n newCanvas.getContext('2d').putImageData(bottomPositions, 0, initialRect.y + initialRect.height);\n var rightPosition = oldCanvas.getContext('2d').\n getImageData(rectWidth, 0, this.availableSize.width - rectWidth, this.availableSize.height);\n newCanvas.getContext('2d').putImageData(rightPosition, rectWidth, 0);\n var leftPosition = oldCanvas.getContext('2d').getImageData(0, 0, initialRect.x, this.availableSize.height);\n newCanvas.getContext('2d').putImageData(leftPosition, 0, 0);\n removeElement(this.element.id + '_selectedCells');\n }\n };\n HeatMap.prototype.clearSVGSelection = function () {\n var rect = document.getElementById(this.element.id + '_Container_RectGroup');\n var text = document.getElementById(this.element.id + '_Container_TextGroup');\n for (var i = 0; i < rect.childNodes.length; i++) {\n var elementClassName = rect.childNodes[i].getAttribute('class');\n if (elementClassName === this.element.id + '_selected') {\n this.removeSvgClass(rect.childNodes[i], elementClassName);\n }\n rect.childNodes[i].setAttribute('opacity', '1');\n if (this.cellSettings.showLabel && text.childNodes[i]) {\n text.childNodes[i].setAttribute('opacity', '1');\n }\n }\n };\n /**\n * Get the maximum length of data source for both horizontal and vertical\n * @private\n */\n HeatMap.prototype.calculateMaxLength = function () {\n var dataSource = this.completeAdaptDataSource;\n if (dataSource && dataSource.length > 0) {\n var xAxisMax = dataSource.length - 1;\n var yAxisMax = 0;\n for (var i = 0; i <= xAxisMax; i++) {\n var length_1 = dataSource[i].length;\n yAxisMax = yAxisMax > length_1 ? yAxisMax : length_1;\n }\n this.axisCollections[0].maxLength = xAxisMax;\n this.axisCollections[1].maxLength = yAxisMax - 1;\n }\n else {\n this.axisCollections[0].maxLength = 0;\n this.axisCollections[1].maxLength = 0;\n }\n };\n /**\n * To find mouse x, y for aligned heatmap element svg position\n */\n HeatMap.prototype.setMouseXY = function (pageX, pageY) {\n var rect = this.element.getBoundingClientRect();\n var svgCanvasRect;\n if (this.enableCanvasRendering) {\n svgCanvasRect = document.getElementById(this.element.id + '_canvas').getBoundingClientRect();\n }\n else {\n svgCanvasRect = document.getElementById(this.element.id + '_svg').getBoundingClientRect();\n }\n this.mouseX = (pageX - rect.left) - Math.max(svgCanvasRect.left - rect.left, 0);\n this.mouseY = (pageY - rect.top) - Math.max(svgCanvasRect.top - rect.top, 0);\n };\n HeatMap.prototype.heatMapMouseClick = function (e) {\n var pageX;\n var pageY;\n var tooltipText;\n var touchArg;\n var elementRect = this.element.getBoundingClientRect();\n if (e.type === 'touchstart') {\n this.isTouch = true;\n touchArg = e;\n pageY = touchArg.changedTouches[0].clientY;\n pageX = touchArg.changedTouches[0].clientX;\n }\n else {\n this.isTouch = false;\n pageY = e.clientY;\n pageX = e.clientX;\n }\n pageX -= elementRect.left;\n pageY -= elementRect.top;\n var isheatmapRect = this.isHeatmapRect(pageX, pageY);\n if (isheatmapRect) {\n var currentRect = this.heatMapSeries.getCurrentRect(pageX, pageY);\n this.trigger('cellClick', {\n heatmap: this,\n value: currentRect.value,\n x: currentRect.x,\n y: currentRect.y,\n xLabel: this.heatMapSeries.hoverXAxisLabel,\n yLabel: this.heatMapSeries.hoverYAxisLabel,\n xValue: this.heatMapSeries.hoverXAxisValue,\n yValue: this.heatMapSeries.hoverYAxisValue,\n cellElement: this.enableCanvasRendering ? null : document.getElementById(currentRect.id)\n });\n }\n this.notify('click', e);\n if (this.paletteSettings.type !== 'Gradient' && this.legendModule\n && this.legendSettings.visible && this.legendVisibilityByCellType) {\n var page = this.legendModule.navigationCollections;\n if (page.length && pageX > page[0].x && pageX < page[0].x + page[0].width &&\n pageY > page[0].y && pageY < page[0].y + page[0].height) {\n this.legendModule.translatePage(this, this.legendModule.currentPage, true);\n }\n else if (page.length && pageX > page[1].x && pageX < page[1].x + page[1].width &&\n pageY > page[1].y && pageY < page[1].y + page[1].height) {\n this.legendModule.translatePage(this, this.legendModule.currentPage, false);\n }\n var legendRange = this.legendModule.legendRange;\n var legendTextRange = this.legendModule.legendTextRange;\n var loop = true;\n for (var i = 0; i < legendRange.length; i++) {\n if (this.legendModule && this.legendSettings.toggleVisibility &&\n this.legendModule.currentPage === legendRange[i].currentPage) {\n if ((loop && (pageX >= legendRange[i].x && pageX <= legendRange[i].width + legendRange[i].x) &&\n (pageY >= legendRange[i].y && pageY <= legendRange[i].y + legendRange[i].height) ||\n ((this.legendSettings.showLabel && this.legendSettings.labelDisplayType !== 'None' &&\n pageX >= legendTextRange[i].x && pageX <= legendTextRange[i].width + legendTextRange[i].x) &&\n (pageY >= legendTextRange[i].y && pageY <= legendTextRange[i].y + legendTextRange[i].height)))) {\n this.legendModule.legendRangeSelection(i);\n loop = false;\n }\n }\n }\n }\n return false;\n };\n /**\n * Handles the mouse Move.\n * @return {boolean}\n * @private\n */\n HeatMap.prototype.heatMapMouseMove = function (e) {\n var pageX;\n var pageY;\n var tooltipText;\n var touchArg;\n var elementRect = this.element.getBoundingClientRect();\n if (e.type === 'touchmove' || e.type === 'touchstart') {\n this.isTouch = true;\n touchArg = e;\n pageX = touchArg.changedTouches[0].clientX;\n pageY = touchArg.changedTouches[0].clientY;\n }\n else {\n this.isTouch = false;\n pageX = e.clientX;\n pageY = e.clientY;\n }\n pageX -= elementRect.left;\n pageY -= elementRect.top;\n this.setMouseXY(pageX, pageY);\n if (e.target && e.target.id) {\n var isheatmapRect = this.isHeatmapRect(pageX, pageY);\n if (this.legendModule) {\n if (isheatmapRect) {\n if (this.paletteSettings.type === 'Gradient' &&\n this.legendSettings.showGradientPointer && this.legendSettings.visible && this.legendVisibilityByCellType) {\n this.legendModule.renderGradientPointer(e, pageX, pageY);\n }\n }\n else {\n this.legendModule.removeGradientPointer();\n }\n this.renderMousePointer(pageX, pageY);\n }\n var isshowTooltip = void 0;\n var currentRect = void 0;\n isshowTooltip = this.showTooltip && this.tooltipModule ? isheatmapRect : false;\n if (isheatmapRect) {\n currentRect = this.heatMapSeries.getCurrentRect(pageX, pageY);\n if (e.which !== 2 && e.which !== 3) {\n isshowTooltip = this.cellSelectionOnMouseMove(e, currentRect, pageX, pageY, isshowTooltip);\n }\n }\n this.tooltipOnMouseMove(e, currentRect, isshowTooltip);\n if (this.legendModule && this.legendSettings.visible && this.paletteSettings.type === 'Fixed' &&\n this.legendSettings.enableSmartLegend && this.legendSettings.labelDisplayType === 'None') {\n this.legendModule.createTooltip(pageX, pageY);\n }\n if (!this.enableCanvasRendering) {\n if (this.titleSettings.text && this.titleSettings.textStyle.textOverflow === 'Trim') {\n this.titleTooltip(e, pageX, pageY, this.isTouch);\n }\n this.axisTooltip(e, pageX, pageY, this.isTouch);\n if (this.legendModule && this.legendSettings.visible && this.legendSettings.showLabel && this.legendVisibilityByCellType) {\n this.legendModule.renderLegendLabelTooltip(e);\n }\n }\n else {\n elementRect = this.element.getBoundingClientRect();\n var tooltipRect = (this.paletteSettings.type === 'Fixed' && this.legendSettings.enableSmartLegend &&\n this.legendSettings.labelDisplayType === 'None') ? false : true;\n tooltipText = getTooltipText(this.tooltipCollection, pageX, pageY) ||\n (this.legendModule && tooltipRect && getTooltipText(this.legendModule.legendLabelTooltip, pageX, pageY));\n if (tooltipText) {\n showTooltip(tooltipText, pageX, pageY, this.element.offsetWidth, this.element.id + '_canvas_Tooltip', getElement(this.element.id + '_Secondary_Element'), this.isTouch, this);\n }\n else {\n removeElement(this.element.id + '_canvas_Tooltip');\n }\n }\n }\n return true;\n };\n /**\n * Triggering cell selection\n */\n HeatMap.prototype.cellSelectionOnMouseMove = function (e, currentRect, pageX, pageY, isshowTooltip) {\n if ((this.cellSettings.tileType === 'Rect' && e.type === 'mousedown' || e.type === 'touchstart'\n || e.type === 'pointerdown') && this.allowSelection) {\n this.previousRect = currentRect;\n this.multiSelection = true;\n this.rectSelected = true;\n this.initialCellX = pageX;\n this.initialCellY = pageY;\n e.preventDefault();\n }\n if (this.cellSettings.tileType === 'Rect' && this.multiSelection && currentRect) {\n isshowTooltip = false;\n this.highlightSelectedCells(this.previousRect, currentRect, pageX, pageY, e);\n }\n return isshowTooltip;\n };\n /**\n * Rendering tooltip on mouse move\n */\n HeatMap.prototype.tooltipOnMouseMove = function (e, currentRect, isshowTooltip) {\n var _this = this;\n if (isshowTooltip && currentRect) {\n if (this.tempTooltipRectId !== currentRect.id) {\n if (this.showTooltip) {\n if ((this.cellSettings.enableCellHighlighting || (this.tooltipModule && this.showTooltip))\n && !this.enableCanvasRendering) {\n this.heatMapSeries.highlightSvgRect(currentRect.id);\n }\n this.tooltipModule.renderTooltip(currentRect);\n if (this.isTouch) {\n if (this.tooltipTimer) {\n window.clearTimeout(this.tooltipTimer);\n }\n this.tooltipTimer = setTimeout(function () {\n _this.tooltipModule.tooltipObject.fadeOut();\n _this.tooltipModule.isFadeout = true;\n }, 1500);\n if (e) {\n if (e.type === 'touchmove') {\n e.preventDefault();\n }\n }\n }\n }\n this.tempTooltipRectId = currentRect.id;\n }\n }\n else {\n if (e !== null) {\n if (e.target.id.indexOf('Celltooltip') === -1) {\n if ((this.cellSettings.enableCellHighlighting || this.showTooltip) && !this.enableCanvasRendering) {\n this.heatMapSeries.highlightSvgRect(e.target.id);\n }\n if (this.tooltipModule && this.showTooltip) {\n this.tooltipModule.showHideTooltip(false, true);\n }\n }\n }\n this.tempTooltipRectId = '';\n }\n };\n /**\n * To select the multiple cells on mouse move action\n */\n HeatMap.prototype.highlightSelectedCells = function (previousRect, currentRect, pageX, pageY, e) {\n var pXIndex = previousRect.xIndex;\n var pYIndex = previousRect.yIndex;\n var cXIndex = currentRect.xIndex;\n var cYIndex = currentRect.yIndex;\n this.currentRect = currentRect;\n this.selectedCellsRect = new Rect(0, 0, 0, 0);\n this.selectedCellsRect.x = previousRect.x > currentRect.x ? currentRect.x : previousRect.x;\n this.selectedCellsRect.y = previousRect.y > currentRect.y ? currentRect.y : previousRect.y;\n this.selectedCellsRect.width = ((previousRect.x > currentRect.x ? (pXIndex - cXIndex) :\n (cXIndex - pXIndex)) + 1) * currentRect.width;\n this.selectedCellsRect.height = ((previousRect.y > currentRect.y ? (pYIndex - cYIndex) :\n (cYIndex - pYIndex)) + 1) * currentRect.height;\n if (e.type === 'touchstart') {\n this.isCellTapHold = true;\n }\n else {\n this.isCellTapHold = false;\n }\n e.preventDefault();\n if (e.ctrlKey === false && e.type !== 'touchstart' && e.type !== 'touchmove') {\n this.removeSelectedCellsBorder();\n }\n var x = this.initialCellX > pageX ? pageX : this.initialCellX;\n var y = this.initialCellY > pageY ? pageY : this.initialCellY;\n var parentDiv = document.getElementById(this.element.id + '_CellSelection_Container');\n var svgObject = this.renderer.createSvg({\n id: this.element.id + '_CellSelection_Container_svg',\n width: this.initialClipRect.width,\n height: this.initialClipRect.height,\n });\n parentDiv.appendChild(svgObject);\n var parent = document.getElementById(this.element.id + '_CellSelection_Container_svg');\n var rect = new Rect(x - this.initialClipRect.x, y - this.initialClipRect.y, Math.abs(pageX - this.initialCellX), Math.abs(pageY - this.initialCellY));\n var rectItems = new RectOption(this.element.id + '_selectedCells', '#87ceeb', { color: 'transparent', width: 1 }, 1, rect, '#0000ff');\n parent.appendChild(this.renderer.drawRectangle(rectItems));\n document.getElementById(this.element.id + '_selectedCells').style.opacity = '0.5';\n };\n /**\n * Method to get selected cell data collection for HeatMap\n */\n HeatMap.prototype.getDataCollection = function () {\n var pXIndex = this.previousRect.xIndex;\n var pYIndex = this.previousRect.yIndex;\n var cXIndex = this.currentRect.xIndex;\n var cYIndex = this.currentRect.yIndex;\n var minX = cXIndex > pXIndex ? pXIndex : cXIndex;\n var maxX = cXIndex > pXIndex ? cXIndex : pXIndex;\n var minY = cYIndex > pYIndex ? pYIndex : cYIndex;\n var maxY = cYIndex > pYIndex ? cYIndex : pYIndex;\n var tempX = minX;\n var tempY = minY;\n var cellX = this.previousRect.x;\n var cellY = this.previousRect.y;\n this.getCellCollection(this.currentRect, this.previousRect, true, tempX, tempY, maxX, maxY, minX, cellX, cellY);\n tempX = minX;\n tempY = minY;\n cellX = this.previousRect.x;\n cellY = this.previousRect.y;\n this.checkSelectedCells();\n this.getCellCollection(this.currentRect, this.previousRect, false, tempX, tempY, maxX, maxY, minX, cellX, cellY);\n this.selectedMultiCellCollection = [];\n this.canvasSelectedCells = new Rect(0, 0, 0, 0);\n this.selectedCellCount = 0;\n };\n /**\n * To get the selected datas.\n */\n HeatMap.prototype.getCellCollection = function (currentRect, previousRect, singleCellData, tempX, tempY, maxX, maxY, minX, cellX, cellY) {\n var xIndex = Math.abs((currentRect.xIndex === previousRect.xIndex ?\n 0 : currentRect.xIndex - previousRect.xIndex)) + 1;\n var yIndex = Math.abs((currentRect.yIndex === previousRect.yIndex ?\n 0 : currentRect.yIndex - previousRect.yIndex)) + 1;\n for (var i = 0; i < (xIndex * yIndex); i++) {\n if (singleCellData) {\n this.getSelectedCellData(cellX, cellY, true);\n }\n else {\n this.getSelectedCellData(cellX, cellY, false);\n }\n if (tempX < maxX) {\n cellX += currentRect.xIndex > previousRect.xIndex ? currentRect.width : -currentRect.width;\n tempX++;\n }\n else if (tempY < maxY) {\n cellY += currentRect.yIndex > previousRect.yIndex ? currentRect.height : -currentRect.height;\n cellX = previousRect.x;\n tempX = minX;\n }\n }\n };\n /**\n * To remove the selection on mouse click without ctrl key.\n */\n HeatMap.prototype.removeSelectedCellsBorder = function () {\n if (!this.enableCanvasRendering) {\n var containerRect = document.getElementById(this.element.id + '_Container_RectGroup');\n var containerText = document.getElementById(this.element.id + '_Container_TextGroup');\n for (var i = 0; i < containerRect.childNodes.length; i++) {\n var elementClassName = containerRect.childNodes[i].getAttribute('class');\n containerRect.childNodes[i].setAttribute('opacity', '0.3');\n if (this.cellSettings.showLabel && containerText.childNodes[i]) {\n containerText.childNodes[i].setAttribute('opacity', '0.3');\n this.removeSvgClass(containerRect.childNodes[i], elementClassName);\n }\n }\n }\n else {\n var ctx = this.secondaryCanvasRenderer.ctx;\n for (var i = 0; i < this.previousSelectedCellsRect.length; i++) {\n var rect = this.previousSelectedCellsRect[i];\n ctx.save();\n ctx.clearRect(rect.x - 1, rect.y - 1, rect.width + 2, rect.height + 2);\n ctx.restore();\n }\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n var rects = this.multiCellCollection[i];\n if (this.multiCellCollection.length > 0) {\n ctx.save();\n ctx.clearRect(rects.x - 1, rects.y - 1, rects.width + 2, rects.height + 2);\n }\n }\n }\n this.multiCellCollection = [];\n };\n /**\n * To highlight the selected multiple cells on mouse move action in canvas mode.\n */\n HeatMap.prototype.highlightSelectedAreaInCanvas = function (rect) {\n if (rect.x) {\n var oldCanvas = document.getElementById(this.element.id + '_canvas');\n var newCanvas = document.getElementById(this.element.id + '_secondary_canvas');\n var initialRect = this.initialClipRect;\n var rectImage = oldCanvas.getContext('2d').getImageData(rect.x, rect.y, rect.width, rect.height);\n newCanvas.getContext('2d').putImageData(rectImage, rect.x, rect.y);\n oldCanvas.style.opacity = '0.3';\n var topPosition = oldCanvas.getContext('2d').getImageData(0, 0, this.availableSize.width, initialRect.y);\n newCanvas.getContext('2d').putImageData(topPosition, 0, 0);\n var bottomPosition = oldCanvas.getContext('2d').getImageData(0, initialRect.y + initialRect.height, this.availableSize.width, this.availableSize.height - (initialRect.y + initialRect.height));\n newCanvas.getContext('2d').putImageData(bottomPosition, 0, initialRect.y + initialRect.height);\n var rightPosition = oldCanvas.getContext('2d').getImageData(initialRect.x + initialRect.width, 0, this.availableSize.width - (initialRect.x + initialRect.width), this.availableSize.height);\n newCanvas.getContext('2d').putImageData(rightPosition, initialRect.x + initialRect.width, 0);\n var leftPosition = oldCanvas.getContext('2d').getImageData(0, 0, initialRect.x, this.availableSize.height);\n newCanvas.getContext('2d').putImageData(leftPosition, 0, 0);\n }\n };\n /**\n * To get the collection of selected cells.\n */\n HeatMap.prototype.getSelectedCellData = function (cellX, cellY, cellCollection) {\n var xAxis = this.axisCollections[0];\n var yAxis = this.axisCollections[1];\n var xLabels = xAxis.tooltipLabels;\n var yLabels = yAxis.tooltipLabels.slice().reverse();\n var rectPosition = this.heatMapSeries.getCurrentRect(cellX + 1, cellY + 1);\n var currentRect = document.getElementById(rectPosition.id);\n var cellDetails = new SelectedCellDetails(null, '', '', 0, 0, null, 0, 0, 0, 0, 0, 0);\n cellDetails.value = rectPosition.value;\n cellDetails.xLabel = xLabels[rectPosition.xIndex].toString();\n cellDetails.yLabel = yLabels[rectPosition.yIndex].toString();\n cellDetails.xValue = xAxis.labelValue[rectPosition.xIndex];\n cellDetails.yValue = yAxis.labelValue.slice().reverse()[rectPosition.yIndex];\n cellDetails.cellElement = this.enableCanvasRendering ? null : currentRect;\n cellDetails.xPosition = rectPosition.xIndex;\n cellDetails.yPosition = rectPosition.yIndex;\n cellDetails.width = this.currentRect.width;\n cellDetails.height = this.currentRect.height;\n cellDetails.x = this.currentRect.x;\n cellDetails.y = this.currentRect.y;\n this.currentRect.allowCollection = true;\n this.addSvgClass(currentRect);\n if (cellCollection) {\n this.selectedMultiCellCollection.push(cellDetails);\n this.currentRect.allowCollection = false;\n }\n else {\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n if (this.multiCellCollection[i].xPosition === cellDetails.xPosition &&\n this.multiCellCollection[i].yPosition === cellDetails.yPosition) {\n this.currentRect.allowCollection = false;\n if (this.selectedCellCount === this.selectedMultiCellCollection.length) {\n this.currentRect.allowCollection = false;\n if (!this.enableCanvasRendering) {\n for (var j = 0; j < this.selectedMultiCellCollection.length; j++) {\n var rectElement = this.selectedMultiCellCollection[j].cellElement;\n if (rectElement) {\n var index = rectElement.id.replace(this.element.id + '_HeatMapRect_', '');\n var containerText = document.getElementById(this.element.id + '_Container_TextGroup');\n var elementClassName = rectElement.getAttribute('class');\n rectElement.setAttribute('opacity', '0.3');\n var getText = document.getElementById(this.element.id + '_HeatMapRectLabels_' + index);\n if (getText) {\n getText.setAttribute('opacity', '0.3');\n }\n this.removeSvgClass(rectElement, elementClassName);\n }\n }\n }\n else {\n var ctx = this.secondaryCanvasRenderer.ctx;\n var rect = this.canvasSelectedCells;\n ctx.save();\n ctx.clearRect(rect.x - 1, rect.y - 1, rect.width + 2, rect.height + 2);\n ctx.restore();\n this.selectedCellsRect = new Rect(0, 0, 0, 0);\n }\n this.multiCellCollection.splice(i, 1);\n }\n }\n }\n }\n if (rectPosition.visible && !isNullOrUndefined(rectPosition.value) && this.currentRect.allowCollection === true) {\n this.multiCellCollection.push(cellDetails);\n }\n };\n /**\n * To add class for selected cells\n * @private\n */\n HeatMap.prototype.addSvgClass = function (element) {\n if (!this.enableCanvasRendering) {\n var className = this.element.id + '_selected';\n element.setAttribute('class', className);\n }\n };\n /**\n * To remove class for unselected cells\n * @private\n */\n HeatMap.prototype.removeSvgClass = function (rectElement, className) {\n if (className) {\n rectElement.setAttribute('class', className.replace(className, ''));\n }\n };\n /**\n * To clear the multi cell selection\n */\n HeatMap.prototype.clearSelection = function () {\n if (!this.enableCanvasRendering && this.allowSelection) {\n this.clearSVGSelection();\n }\n if (this.enableCanvasRendering) {\n var ctx = this.secondaryCanvasRenderer.ctx;\n for (var i = 0; i < this.previousSelectedCellsRect.length; i++) {\n ctx.save();\n ctx.clearRect(this.previousSelectedCellsRect[i].x - 1, this.previousSelectedCellsRect[i].y - 1, this.previousSelectedCellsRect[i].width + 2, this.previousSelectedCellsRect[i].height + 2);\n ctx.restore();\n }\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n var rects = this.multiCellCollection[i];\n if (this.multiCellCollection.length > 0) {\n ctx.save();\n ctx.clearRect(rects.x - 1, rects.y - 1, rects.width + 2, rects.height + 2);\n }\n }\n var canvas = document.getElementById(this.element.id + '_canvas');\n canvas.style.opacity = '1';\n }\n this.tempMultiCellCollection = [];\n this.multiCellCollection = [];\n this.rectSelected = false;\n };\n HeatMap.prototype.renderMousePointer = function (pageX, pageY) {\n var legendRange = this.legendModule.legendRange;\n var legendTextRange = this.legendModule.legendTextRange;\n var loop = true;\n for (var i = 0; i < legendRange.length; i++) {\n if (this.legendSettings.toggleVisibility && this.legendModule.currentPage === legendRange[i].currentPage) {\n if ((loop && (pageX >= legendRange[i].x && pageX <= legendRange[i].width + legendRange[i].x) &&\n (pageY >= legendRange[i].y && pageY <= legendRange[i].y + legendRange[i].height) ||\n ((this.legendSettings.showLabel && this.legendSettings.labelDisplayType !== 'None' &&\n pageX >= legendTextRange[i].x && pageX <= legendTextRange[i].width + legendTextRange[i].x) &&\n (pageY >= legendTextRange[i].y && pageY <= legendTextRange[i].y + legendTextRange[i].height)))) {\n if (this.enableCanvasRendering) {\n document.getElementById(this.element.id + '_canvas').style.cursor = 'Pointer';\n }\n else {\n document.getElementById(this.element.id + '_svg').style.cursor = 'Pointer';\n }\n loop = false;\n }\n else if (loop) {\n if (this.enableCanvasRendering) {\n document.getElementById(this.element.id + '_canvas').style.cursor = '';\n }\n else {\n document.getElementById(this.element.id + '_svg').style.cursor = '';\n }\n }\n }\n }\n };\n /**\n * Handles the mouse end.\n * @return {boolean}\n * @private\n */\n HeatMap.prototype.heatMapMouseLeave = function (e) {\n var _this = this;\n if (e.target && e.target.id &&\n (this.cellSettings.enableCellHighlighting || (this.tooltipModule && this.showTooltip))\n && !this.enableCanvasRendering) {\n this.heatMapSeries.highlightSvgRect(this.tempTooltipRectId);\n }\n if (this.allowSelection && this.multiSelection) {\n this.multiSelection = false;\n if (e.type === 'mouseup' || e.type === 'touchend' || e.type === 'pointerup') {\n if (e.which !== 2 && e.which !== 3) {\n if (this.isCellTapHold === false) {\n this.getDataCollection();\n this.currentRect.allowCollection = false;\n this.setCellOpacity();\n var argData = {\n heatmap: this,\n cancel: false,\n name: 'cellSelected',\n data: this.multiCellCollection\n };\n this.trigger('cellSelected', argData);\n }\n else {\n this.isCellTapHold = false;\n }\n }\n }\n else if (e.type === 'mouseleave' && (this.element.id + '_selectedCells')) {\n removeElement(this.element.id + '_selectedCells');\n }\n }\n if (this.tooltipModule && this.showTooltip && e.type === 'mouseleave') {\n this.tooltipModule.showHideTooltip(false);\n }\n this.tempTooltipRectId = '';\n if (this.legendModule && this.legendSettings.visible && this.legendModule.tooltipObject &&\n this.legendModule.tooltipObject.element) {\n var tooltipElement_1 = this.legendModule.tooltipObject.element.firstChild;\n if (e.type === 'mouseleave') {\n tooltipElement_1.setAttribute('opacity', '0');\n }\n else {\n if (this.legendTooltipTimer) {\n window.clearTimeout(this.legendTooltipTimer);\n }\n this.legendTooltipTimer = setTimeout(function () {\n tooltipElement_1.setAttribute('opacity', '0');\n }, 1500);\n }\n }\n if (this.paletteSettings.type === 'Gradient' && this.legendModule && this.legendSettings.showGradientPointer &&\n this.legendSettings.visible && this.legendVisibilityByCellType) {\n if (e.type === 'mouseleave') {\n this.legendModule.removeGradientPointer();\n }\n else {\n if (this.gradientTimer) {\n window.clearTimeout(this.gradientTimer);\n }\n this.gradientTimer = setTimeout(function () { _this.legendModule.removeGradientPointer(); }, 1500);\n }\n }\n if (this.enableCanvasRendering) {\n var main = document.getElementById(this.element.id + '_hoverRect_canvas');\n if (main) {\n main.style.visibility = 'hidden';\n this.tempRectHoverClass = '';\n }\n }\n if (this.titleSettings.text && this.titleCollection[0].indexOf('...') !== -1) {\n if (!this.enableCanvasRendering) {\n removeElement(this.element.id + '_Title_Tooltip');\n }\n else {\n removeElement(this.element.id + '_canvas_Tooltip');\n }\n }\n return true;\n };\n /**\n * Method to Check for deselection of cell.\n */\n HeatMap.prototype.checkSelectedCells = function () {\n if (!this.enableCanvasRendering) {\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n for (var j = 0; j < this.selectedMultiCellCollection.length; j++) {\n if (this.selectedMultiCellCollection[j].cellElement.getAttribute('id')\n === this.multiCellCollection[i].cellElement.getAttribute('id')) {\n this.selectedCellCount++;\n }\n }\n }\n }\n else {\n this.canvasSelectedCells = new Rect(0, 0, 0, 0);\n this.canvasSelectedCells.x = this.selectedCellsRect.x;\n this.canvasSelectedCells.y = this.selectedCellsRect.y;\n this.canvasSelectedCells.width = this.selectedCellsRect.width;\n this.canvasSelectedCells.height = this.selectedCellsRect.height;\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n for (var j = 0; j < this.selectedMultiCellCollection.length; j++) {\n if (this.selectedMultiCellCollection[j].xPosition === this.multiCellCollection[i].xPosition &&\n this.selectedMultiCellCollection[j].yPosition === this.multiCellCollection[i].yPosition) {\n this.selectedCellCount++;\n }\n }\n }\n }\n };\n /**\n * Method to remove opacity for text of selected cell for HeatMap\n */\n HeatMap.prototype.removeOpacity = function (containersRect, containerText) {\n for (var i = 0; i < containersRect.childNodes.length; i++) {\n containersRect.childNodes[i].setAttribute('opacity', '0.3');\n if (this.cellSettings.showLabel && containerText.childNodes[i]) {\n containerText.childNodes[i].setAttribute('opacity', '0.3');\n }\n }\n };\n /**\n * Method to set opacity for selected cell for HeatMap\n */\n HeatMap.prototype.setCellOpacity = function () {\n if (!this.enableCanvasRendering) {\n if (this.multiCellCollection.length !== 0) {\n this.tempMultiCellCollection.push(this.multiCellCollection);\n var containersRect = document.getElementById(this.element.id + '_Container_RectGroup');\n var containerText = document.getElementById(this.element.id + '_Container_TextGroup');\n this.removeOpacity(containersRect, containerText);\n for (var i = 0; i < this.multiCellCollection.length; i++) {\n var collectionClasss = this.multiCellCollection[i].cellElement;\n var index = parseInt(collectionClasss.id.replace(this.element.id + '_HeatMapRect_', ''), 10);\n containersRect.childNodes[index].setAttribute('opacity', '1');\n if (this.cellSettings.showLabel) {\n var getText = document.getElementById(this.element.id + '_HeatMapRectLabels_' + index);\n if (getText) {\n getText.setAttribute('opacity', '1');\n }\n }\n }\n }\n }\n else {\n this.previousSelectedCellsRect.push(this.selectedCellsRect);\n this.highlightSelectedAreaInCanvas(this.selectedCellsRect);\n }\n removeElement(this.element.id + '_selectedCells');\n };\n /**\n * To create div container for rendering two layers of canvas.\n * @return {void}\n * @private\n */\n HeatMap.prototype.createMultiCellDiv = function (onLoad) {\n if (onLoad) {\n var divElement = this.createElement('div', {\n id: this.element.id + '_Multi_CellSelection_Canvas',\n styles: 'position:relative'\n });\n this.element.appendChild(divElement);\n divElement.appendChild(this.svgObject);\n this.svgObject.style.position = 'absolute';\n this.svgObject.style.left = '0px';\n this.svgObject.style.top = '0px';\n this.svgObject.style.zIndex = '0';\n }\n else {\n var element = document.getElementById(this.element.id + '_Multi_CellSelection_Canvas');\n var secondaryCanvas = this.secondaryCanvasRenderer.createCanvas({\n width: this.availableSize.width,\n height: this.availableSize.height, x: 0, y: 0,\n style: 'position: absolute; z-index: 1'\n });\n element.appendChild(secondaryCanvas);\n }\n };\n __decorate([\n Property(null)\n ], HeatMap.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], HeatMap.prototype, \"height\", void 0);\n __decorate([\n Property(true)\n ], HeatMap.prototype, \"showTooltip\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"tooltipRender\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"resized\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"loaded\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"cellRender\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"cellSelected\", void 0);\n __decorate([\n Property('SVG')\n ], HeatMap.prototype, \"renderingMode\", void 0);\n __decorate([\n Property(null)\n ], HeatMap.prototype, \"dataSource\", void 0);\n __decorate([\n Property('Material')\n ], HeatMap.prototype, \"theme\", void 0);\n __decorate([\n Property(false)\n ], HeatMap.prototype, \"allowSelection\", void 0);\n __decorate([\n Complex({}, Margin)\n ], HeatMap.prototype, \"margin\", void 0);\n __decorate([\n Complex({ text: '', textStyle: Theme.heatMapTitleFont }, Title)\n ], HeatMap.prototype, \"titleSettings\", void 0);\n __decorate([\n Complex({}, Axis)\n ], HeatMap.prototype, \"xAxis\", void 0);\n __decorate([\n Complex({}, LegendSettings)\n ], HeatMap.prototype, \"legendSettings\", void 0);\n __decorate([\n Complex({}, PaletteSettings)\n ], HeatMap.prototype, \"paletteSettings\", void 0);\n __decorate([\n Complex({}, TooltipSettings)\n ], HeatMap.prototype, \"tooltipSettings\", void 0);\n __decorate([\n Complex({}, Axis)\n ], HeatMap.prototype, \"yAxis\", void 0);\n __decorate([\n Complex({}, CellSettings)\n ], HeatMap.prototype, \"cellSettings\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"load\", void 0);\n __decorate([\n Event()\n ], HeatMap.prototype, \"cellClick\", void 0);\n HeatMap = __decorate([\n NotifyPropertyChanges\n ], HeatMap);\n return HeatMap;\n}(Component));\nexport { HeatMap };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { isNullOrUndefined, Complex } from '@syncfusion/ej2-base';\nimport { Property, ChildProperty } from '@syncfusion/ej2-base';\nimport { DataUtil } from '@syncfusion/ej2-data';\nimport { increaseDateTimeInterval } from '../utils/helper';\nimport { BubbleData } from '../model/base';\n/**\n * Configures the Adaptor Property in the Heatmap.\n */\nvar Data = /** @class */ (function (_super) {\n __extends(Data, _super);\n function Data() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], Data.prototype, \"data\", void 0);\n __decorate([\n Property(false)\n ], Data.prototype, \"isJsonData\", void 0);\n __decorate([\n Property('cell')\n ], Data.prototype, \"adaptorType\", void 0);\n __decorate([\n Property('')\n ], Data.prototype, \"xDataMapping\", void 0);\n __decorate([\n Property('')\n ], Data.prototype, \"yDataMapping\", void 0);\n __decorate([\n Property('')\n ], Data.prototype, \"valueMapping\", void 0);\n __decorate([\n Complex({}, BubbleData)\n ], Data.prototype, \"bubbleDataMapping\", void 0);\n return Data;\n}(ChildProperty));\nexport { Data };\nvar AdaptiveMinMax = /** @class */ (function () {\n function AdaptiveMinMax() {\n }\n return AdaptiveMinMax;\n}());\nexport { AdaptiveMinMax };\n/**\n *\n * The `Adaptor` module is used to handle JSON and Table data.\n */\nvar Adaptor = /** @class */ (function () {\n function Adaptor(heatMap) {\n this.reconstructedXAxis = [];\n this.reconstructedYAxis = [];\n this.adaptiveXMinMax = new AdaptiveMinMax();\n this.adaptiveYMinMax = new AdaptiveMinMax();\n this.heatMap = heatMap;\n }\n /**\n * Method to construct Two Dimentional Datasource.\n * @return {void}\n * @private\n */\n Adaptor.prototype.constructDatasource = function (adaptData) {\n if (adaptData.adaptorType === 'Cell') {\n var xAxis = this.heatMap.xAxis;\n var yAxis = this.heatMap.yAxis;\n this.adaptiveXMinMax.min = xAxis.minimum;\n this.adaptiveXMinMax.max = xAxis.maximum;\n this.adaptiveYMinMax.min = yAxis.minimum;\n this.adaptiveYMinMax.max = yAxis.maximum;\n if (((xAxis.valueType === 'Numeric' || xAxis.valueType === 'DateTime') &&\n (isNullOrUndefined(xAxis.minimum) || isNullOrUndefined(xAxis.maximum))) ||\n ((yAxis.valueType === 'Numeric' || yAxis.valueType === 'DateTime') &&\n (isNullOrUndefined(yAxis.minimum) || isNullOrUndefined(yAxis.maximum)))) {\n this.getMinMaxValue(adaptData, xAxis, yAxis);\n }\n this.heatMap.isCellData = true;\n }\n if (adaptData && adaptData.data === undefined) {\n this.heatMap.completeAdaptDataSource = adaptData;\n }\n else if (!adaptData.isJsonData && adaptData.adaptorType === 'Table' || adaptData.data === null) {\n this.heatMap.completeAdaptDataSource = adaptData.data;\n }\n else if (adaptData.isJsonData && adaptData.adaptorType === 'Table') {\n this.heatMap.completeAdaptDataSource = this.processJsonTableData(adaptData);\n }\n else if (adaptData.isJsonData && adaptData.adaptorType === 'Cell') {\n this.heatMap.completeAdaptDataSource = this.processJsonCellData(adaptData);\n }\n else if (!adaptData.isJsonData && adaptData.adaptorType === 'Cell') {\n this.constructAdaptiveAxis();\n this.heatMap.completeAdaptDataSource = this.processCellData(adaptData);\n this.heatMap.isCellData = true;\n }\n };\n /**\n * Method to construct Axis Collection.\n * @return {void}\n * @private\n */\n Adaptor.prototype.constructAdaptiveAxis = function () {\n var xAxis = this.heatMap.xAxis;\n var yAxis = this.heatMap.yAxis;\n var intervalType;\n if (xAxis.valueType === 'Numeric') {\n this.reconstructedXAxis = this.getNumericAxisCollection(this.adaptiveXMinMax.min, this.adaptiveXMinMax.max, xAxis.increment);\n }\n if (yAxis.valueType === 'Numeric') {\n this.reconstructedYAxis = this.getNumericAxisCollection(this.adaptiveYMinMax.min, this.adaptiveYMinMax.max, yAxis.increment);\n }\n if (xAxis.valueType === 'DateTime') {\n this.reconstructedXAxis = this.getDateAxisCollection(this.adaptiveXMinMax.min, this.adaptiveXMinMax.max, xAxis.intervalType, xAxis.increment);\n }\n if (yAxis.valueType === 'DateTime') {\n this.reconstructedYAxis = this.getDateAxisCollection(this.adaptiveYMinMax.min, this.adaptiveYMinMax.max, yAxis.intervalType, yAxis.increment);\n }\n };\n /**\n * Method to calculate Numeric Axis Collection.\n * @return {string[]}\n * @private\n */\n Adaptor.prototype.getNumericAxisCollection = function (min, max, increment) {\n var loopIndex = min;\n var tempAxisColl = [];\n while (loopIndex <= max) {\n tempAxisColl.push(loopIndex.toString());\n loopIndex = loopIndex + increment;\n }\n return tempAxisColl;\n };\n /**\n * Method to calculate DateTime Axis Collection.\n * @return {string[]}\n * @private\n */\n Adaptor.prototype.getDateAxisCollection = function (min, max, intervalType, increment) {\n var option = {\n skeleton: 'full',\n type: 'dateTime'\n };\n var dateParser = this.heatMap.intl.getDateParser(option);\n var dateFormatter = this.heatMap.intl.getDateFormat(option);\n min = Date.parse(dateParser(dateFormatter(new Date(DataUtil.parse.parseJson({ val: min }).val))));\n var tempInterval = min;\n var tempAxisColl = [];\n while (tempInterval <= max) {\n tempAxisColl.push(new Date(tempInterval).toString());\n tempInterval = increaseDateTimeInterval(tempInterval, 1, intervalType, increment).getTime();\n }\n return tempAxisColl;\n };\n /**\n * Method to calculate Maximum and Minimum Value from datasource.\n * @return {void}\n * @private\n */\n Adaptor.prototype.getMinMaxValue = function (adapData, xAxis, yAxis) {\n var data = adapData.data;\n var label = Object.keys(data[0]);\n if (data.length > 0) {\n this.adaptiveXMinMax.min = !isNullOrUndefined(xAxis.minimum) ? xAxis.minimum : adapData.isJsonData ?\n // tslint:disable-next-line:no-any\n data[0][label[0]] : data[0][0];\n this.adaptiveYMinMax.min = !isNullOrUndefined(yAxis.minimum) ? yAxis.minimum : adapData.isJsonData ?\n // tslint:disable-next-line:no-any\n data[0][label[1]] : data[0][1];\n this.adaptiveXMinMax.max = !isNullOrUndefined(xAxis.maximum) ? xAxis.maximum : adapData.isJsonData ?\n // tslint:disable-next-line:no-any\n data[0][label[0]] : data[0][0];\n this.adaptiveYMinMax.max = !isNullOrUndefined(yAxis.maximum) ? yAxis.maximum : adapData.isJsonData ?\n // tslint:disable-next-line:no-any\n data[0][label[1]] : data[0][1];\n }\n for (var dataIndex = 0; dataIndex < data.length; dataIndex++) {\n // tslint:disable-next-line:no-any\n var xDataIndex = adapData.isJsonData ? data[dataIndex][label[0]] : data[dataIndex][0];\n // tslint:disable-next-line:no-any\n var yDataIndex = adapData.isJsonData ? data[dataIndex][label[1]] : data[dataIndex][1];\n if (xDataIndex < this.adaptiveXMinMax.min && isNullOrUndefined(xAxis.minimum)) {\n this.adaptiveXMinMax.min = xDataIndex;\n }\n if (xDataIndex > this.adaptiveXMinMax.max && isNullOrUndefined(xAxis.maximum)) {\n this.adaptiveXMinMax.max = xDataIndex;\n }\n if (yDataIndex < this.adaptiveYMinMax.min && isNullOrUndefined(yAxis.minimum)) {\n this.adaptiveYMinMax.min = yDataIndex;\n }\n if (yDataIndex > this.adaptiveYMinMax.max && isNullOrUndefined(yAxis.maximum)) {\n this.adaptiveYMinMax.max = yDataIndex;\n }\n }\n };\n /**\n * Method to process Cell datasource.\n * @return {Object}\n * @private\n */\n Adaptor.prototype.processCellData = function (adaptordata) {\n // tslint:disable-next-line:no-any \n var tempDataCollection = adaptordata.data;\n var xLabels = this.reconstructedXAxis;\n var yLabels = this.reconstructedYAxis;\n var currentDataXIndex = 0;\n var currentDataYIndex = 0;\n if (tempDataCollection.length) {\n this.reconstructData = [];\n for (var xindex = 0; xindex < tempDataCollection.length; xindex++) {\n if (this.heatMap.xAxis.valueType === 'Category') {\n currentDataXIndex = tempDataCollection[xindex][0];\n }\n else {\n currentDataXIndex = xLabels.indexOf(tempDataCollection[xindex][0].toString());\n }\n if (currentDataXIndex > -1) {\n while (!this.reconstructData[currentDataXIndex]) {\n this.reconstructData.push([]);\n }\n if (this.heatMap.yAxis.valueType === 'Category') {\n currentDataYIndex = tempDataCollection[xindex][1];\n }\n else {\n currentDataYIndex = yLabels.indexOf(tempDataCollection[xindex][1].toString());\n }\n if (currentDataYIndex !== -1) {\n while (this.reconstructData[currentDataXIndex][currentDataYIndex] !== '') {\n this.reconstructData[currentDataXIndex].push('');\n }\n this.reconstructData[currentDataXIndex][currentDataYIndex] = isNullOrUndefined(tempDataCollection[xindex][2]) ?\n '' : tempDataCollection[xindex][2];\n }\n }\n }\n }\n return this.reconstructData;\n };\n /**\n * Method to process JSON Cell datasource.\n * @return {Object}\n * @private\n */\n Adaptor.prototype.processJsonCellData = function (adaptordata) {\n // tslint:disable-next-line:no-any \n var tempDataCollection = adaptordata.data;\n var xAxisLabels = this.heatMap.xAxis.labels ? this.heatMap.xAxis.labels : [];\n var yAxisLabels = this.heatMap.yAxis.labels ? this.heatMap.yAxis.labels : [];\n var axisCollections = this.heatMap.axisCollections;\n if (xAxisLabels.length === 0 || yAxisLabels.length === 0) {\n this.generateAxisLabels(adaptordata);\n }\n var xLabels = (this.heatMap.xAxis.valueType === 'Category') ? (xAxisLabels.length > 0 ?\n this.heatMap.xAxis.labels : axisCollections[0].jsonCellLabel) : axisCollections[0].labelValue;\n var yLabels = (this.heatMap.yAxis.valueType === 'Category') ? (yAxisLabels.length > 0 ?\n this.heatMap.yAxis.labels : axisCollections[1].jsonCellLabel) : axisCollections[1].labelValue;\n var currentDataXIndex = 0;\n var currentDataYIndex = 0;\n if (tempDataCollection.length) {\n this.reconstructData = [];\n for (var index = 0; index < tempDataCollection.length; index++) {\n currentDataXIndex = this.getSplitDataValue(tempDataCollection[index], adaptordata, xLabels, adaptordata.xDataMapping.split('.'), this.heatMap.xAxis.valueType);\n if (currentDataXIndex !== -1) {\n while (!this.reconstructData[currentDataXIndex]) {\n this.reconstructData.push([]);\n }\n currentDataYIndex = this.getSplitDataValue(tempDataCollection[index], adaptordata, yLabels, adaptordata.yDataMapping.split('.'), this.heatMap.yAxis.valueType);\n if (currentDataYIndex !== -1) {\n while (isNullOrUndefined(this.reconstructData[currentDataXIndex][currentDataYIndex])) {\n this.reconstructData[currentDataXIndex].push('');\n }\n if (this.heatMap.bubbleSizeWithColor) {\n this.reconstructData[currentDataXIndex][currentDataYIndex] = [\n this.getSplitDataValue(tempDataCollection[index], adaptordata, null, adaptordata.bubbleDataMapping.size.split('.'), ''),\n this.getSplitDataValue(tempDataCollection[index], adaptordata, null, adaptordata.bubbleDataMapping.color.split('.'), '')\n ];\n }\n else {\n this.reconstructData[currentDataXIndex][currentDataYIndex] = this.getSplitDataValue(tempDataCollection[index], adaptordata, null, adaptordata.valueMapping.split('.'), '');\n }\n }\n }\n }\n }\n return this.reconstructData;\n };\n /**\n * Method to generate axis labels when labels are not given.\n * @return {string}\n * @private\n */\n Adaptor.prototype.generateAxisLabels = function (adaptordata) {\n // tslint:disable-next-line:no-any \n var tempDataCollection = adaptordata.data;\n var xLabels = this.heatMap.xAxis.labels ? this.heatMap.xAxis.labels : [];\n var yLabels = this.heatMap.yAxis.labels ? this.heatMap.yAxis.labels : [];\n var hasXLabels = xLabels.length > 0 ? true : false;\n var hasYLabels = yLabels.length > 0 ? true : false;\n var axisCollection = this.heatMap.axisCollections;\n for (var index = 0; index < axisCollection.length; index++) {\n var valueType = axisCollection[index].valueType;\n var axis = axisCollection[index];\n if (valueType === 'Category') {\n var hasLabels = void 0;\n var dataMapping = void 0;\n var labels = void 0;\n if (axis.orientation === 'Horizontal') {\n hasLabels = hasXLabels;\n dataMapping = adaptordata.xDataMapping;\n axis.jsonCellLabel = labels = [];\n }\n else {\n hasLabels = hasYLabels;\n dataMapping = adaptordata.yDataMapping;\n axis.jsonCellLabel = labels = [];\n }\n if (!hasLabels) {\n for (var i = 0; i < tempDataCollection.length; i++) {\n if (dataMapping in tempDataCollection[i]) {\n var xValue = tempDataCollection[i][dataMapping].toString();\n if (labels.indexOf(xValue.toString()) === -1) {\n labels.push(xValue);\n }\n }\n }\n }\n }\n else if (valueType === 'DateTime') {\n axis.clearAxisLabel();\n axis.calculateDateTimeAxisLabel(this.heatMap);\n }\n else {\n axis.clearAxisLabel();\n axis.calculateNumericAxisLabels(this.heatMap);\n }\n }\n };\n /**\n * Method to get data from complex mapping.\n * @return {number|string}\n * @private\n */\n Adaptor.prototype.getSplitDataValue = function (\n // tslint:disable-next-line:no-any \n tempSplitDataCollection, adaptordata, labels, tempSplitData, valueType) {\n var value = -1;\n this.tempSplitDataCollection = tempSplitDataCollection;\n for (var splitIndex = 0; splitIndex < tempSplitData.length; splitIndex++) {\n value = !isNullOrUndefined(labels) ? (!(valueType === 'DateTime') ?\n labels.indexOf(this.tempSplitDataCollection[tempSplitData[splitIndex]]) :\n labels.map(Number).indexOf(+this.tempSplitDataCollection[tempSplitData[splitIndex]])) : null;\n if (!isNullOrUndefined(this.tempSplitDataCollection)) {\n this.tempSplitDataCollection = value !== -1 && !isNullOrUndefined(labels) ?\n this.tempSplitDataCollection : this.tempSplitDataCollection[tempSplitData[splitIndex]];\n }\n if (isNullOrUndefined(this.tempSplitDataCollection)) {\n break;\n }\n }\n value = !isNullOrUndefined(labels) ? value : isNullOrUndefined(this.tempSplitDataCollection) ||\n this.tempSplitDataCollection.toString() === '' ? '' : parseFloat(this.tempSplitDataCollection.toString());\n return value;\n };\n /**\n * Method to process JSON Table datasource.\n * @return {Object}\n * @private\n */\n Adaptor.prototype.processJsonTableData = function (adaptordata) {\n // tslint:disable-next-line:no-any \n var tempDataCollection = adaptordata.data;\n var currentDataXIndex = 0;\n var currentDataYIndex = 0;\n var xLabels = this.heatMap.xAxis.labels ? this.heatMap.xAxis.labels : [];\n var yLabels = this.heatMap.yAxis.labels ? this.heatMap.yAxis.labels : [];\n var key;\n if (tempDataCollection.length) {\n this.reconstructData = [];\n for (var xindex = 0; xindex < tempDataCollection.length; xindex++) {\n currentDataXIndex = this.getSplitDataValue(tempDataCollection[xindex], adaptordata, xLabels, adaptordata.xDataMapping.split('.'), this.heatMap.xAxis.valueType);\n if (currentDataXIndex !== -1) {\n while (!this.reconstructData[currentDataXIndex]) {\n this.reconstructData.push([]);\n }\n for (var index = 0; index < Object.keys(this.tempSplitDataCollection).length; index++) {\n key = Object.keys(this.tempSplitDataCollection)[index];\n currentDataYIndex = key !== adaptordata.xDataMapping ? yLabels.indexOf(key) : -1;\n if (currentDataYIndex !== -1) {\n while (isNullOrUndefined(this.reconstructData[currentDataXIndex][currentDataYIndex])) {\n this.reconstructData[currentDataXIndex].push('');\n }\n this.reconstructData[currentDataXIndex][currentDataYIndex] =\n isNullOrUndefined(this.tempSplitDataCollection[key]) ?\n '' : this.tempSplitDataCollection[key];\n }\n }\n }\n }\n }\n return this.reconstructData;\n };\n /**\n * To destroy the Adaptor.\n * @return {void}\n * @private\n */\n Adaptor.prototype.destroy = function (heatMap) {\n /**\n * No Lines\n */\n };\n ;\n /**\n * To get Module name\n */\n Adaptor.prototype.getModuleName = function () {\n return 'Adaptor';\n };\n return Adaptor;\n}());\nexport { Adaptor };\n","import * as index from '@syncfusion/ej2-heatmap';\nindex.HeatMap.Inject( index.Legend,index.Tooltip,index.Adaptor);\nexport * from '@syncfusion/ej2-heatmap';\n","/**\n * InPlace-Editor events defined here.\n */\n/** @hidden */\nexport var render = 'render';\n/** @hidden */\nexport var update = 'update';\n/** @hidden */\nexport var destroy = 'destroy';\n/** @hidden */\nexport var setFocus = 'set-focus';\n/** @hidden */\nexport var accessValue = 'access-value';\n/** @hidden */\nexport var destroyModules = 'destroy-modules';\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { ChildProperty, Property } from '@syncfusion/ej2-base';\n/**\n * Configures the popup settings of the In-place editor.\n */\nvar PopupSettings = /** @class */ (function (_super) {\n __extends(PopupSettings, _super);\n function PopupSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], PopupSettings.prototype, \"title\", void 0);\n __decorate([\n Property(null)\n ], PopupSettings.prototype, \"model\", void 0);\n return PopupSettings;\n}(ChildProperty));\nexport { PopupSettings };\n/**\n * @hidden\n */\nexport var modulesList = {\n 'AutoComplete': 'auto-complete',\n 'Color': 'color-picker',\n 'ComboBox': 'combo-box',\n 'DateRange': 'date-range-picker',\n 'MultiSelect': 'multi-select',\n 'RTE': 'rte',\n 'Slider': 'slider',\n 'Time': 'time-picker'\n};\n/**\n * @hidden\n */\nexport var localeConstant = {\n 'Click': { 'editAreaClick': 'Click to edit' },\n 'DblClick': { 'editAreaDoubleClick': 'Double click to edit' }\n};\n","/**\n * InPlace-Editor classes defined here.\n */\n/** @hidden */\nexport var ROOT = 'e-inplaceeditor';\n/** @hidden */\nexport var ROOT_TIP = 'e-inplaceeditor-tip';\n/** @hidden */\nexport var VALUE_WRAPPER = 'e-editable-value-wrapper';\n/** @hidden */\nexport var VALUE = 'e-editable-value';\n/** @hidden */\nexport var OVERLAY_ICON = 'e-editable-overlay-icon';\n/** @hidden */\nexport var TIP_TITLE = 'e-editable-tip-title';\n/** @hidden */\nexport var TITLE = 'e-editable-title';\n/** @hidden */\nexport var INLINE = 'e-editable-inline';\n/** @hidden */\nexport var POPUP = 'e-editable-popup';\n/** @hidden */\nexport var WRAPPER = 'e-editable-wrapper';\n/** @hidden */\nexport var LOADING = 'e-editable-loading';\n/** @hidden */\nexport var FORM = 'e-editable-form';\n/** @hidden */\nexport var CTRL_GROUP = 'e-component-group';\n/** @hidden */\nexport var INPUT = 'e-editable-component';\n/** @hidden */\nexport var BUTTONS = 'e-editable-action-buttons';\n/** @hidden */\nexport var EDITABLE_ERROR = 'e-editable-error';\n/** @hidden */\nexport var ELEMENTS = 'e-editable-elements';\n/** @hidden */\nexport var OPEN = 'e-editable-open';\n/** @hidden */\nexport var BTN_SAVE = 'e-btn-save';\n/** @hidden */\nexport var BTN_CANCEL = 'e-btn-cancel';\n/** @hidden */\nexport var RTE_SPIN_WRAP = 'e-rte-spin-wrap';\n/** @hidden */\nexport var CTRL_OVERLAY = 'e-control-overlay';\n/** @hidden */\nexport var DISABLE = 'e-disable';\n/** @hidden */\nexport var ICONS = 'e-icons';\n/** @hidden */\nexport var PRIMARY = 'e-primary';\n/** @hidden */\nexport var SHOW = 'e-show';\n/** @hidden */\nexport var HIDE = 'e-hide';\n/** @hidden */\nexport var RTL = 'e-rtl';\n/** @hidden */\nexport var ERROR = 'e-error';\n/** @hidden */\nexport var LOAD = 'e-loading';\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, NotifyPropertyChanges, Property, Event, select } from '@syncfusion/ej2-base';\nimport { detach, addClass, removeClass, EventHandler, setStyleAttribute, Complex } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined as isNOU, closest, extend, L10n, compile, Browser, Touch } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { DataManager, UrlAdaptor, Query, WebApiAdaptor, ODataV4Adaptor } from '@syncfusion/ej2-data';\nimport { Button } from '@syncfusion/ej2-buttons';\nimport { DatePicker, DateTimePicker } from '@syncfusion/ej2-calendars';\nimport { NumericTextBox, TextBox } from '@syncfusion/ej2-inputs';\nimport { createSpinner, hideSpinner, showSpinner } from '@syncfusion/ej2-popups';\nimport { Tooltip } from '@syncfusion/ej2-popups';\nimport { FormValidator, MaskedTextBox } from '@syncfusion/ej2-inputs';\nimport { DropDownList } from '@syncfusion/ej2-dropdowns';\n/* Helper modules */\nimport * as events from './events';\nimport * as classes from './classes';\n/* Models */\nimport { PopupSettings, modulesList, localeConstant } from './models';\n/* Interface */\nimport { parseValue, getCompValue } from './util';\n/**\n * ```html\n * * The In-place editor control is used to edit an element in a place and to update the value in server.\n * \n * \n * ```\n */\nvar InPlaceEditor = /** @class */ (function (_super) {\n __extends(InPlaceEditor, _super);\n /**\n * Initializes a new instance of the In-place editor class.\n * @param options - Specifies In-place editor model properties as options.\n * @param element - Specifies the element for which In-place editor applies.\n */\n function InPlaceEditor(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.initRender = true;\n _this.isTemplate = false;\n _this.isExtModule = false;\n _this.submitBtn = undefined;\n _this.cancelBtn = undefined;\n _this.isClearTarget = false;\n _this.btnElements = undefined;\n _this.dataManager = undefined;\n _this.divComponents = ['RTE', 'Slider'];\n _this.clearComponents = ['AutoComplete', 'Mask', 'Text'];\n _this.dateType = ['Date', 'DateTime', 'Time'];\n _this.inputDataEle = ['Date', 'DateTime', 'DateRange', 'Time', 'Numeric'];\n _this.dropDownEle = ['AutoComplete', 'ComboBox', 'DropDownList', 'MultiSelect'];\n _this.moduleList = ['AutoComplete', 'Color', 'ComboBox', 'DateRange', 'MultiSelect', 'RTE', 'Slider', 'Time'];\n /**\n * @hidden\n */\n _this.needsID = true;\n return _this;\n }\n /**\n * Initialize the event handler\n * @private\n */\n InPlaceEditor.prototype.preRender = function () {\n if (isNOU(this.model)) {\n this.setProperties({ model: {} }, true);\n }\n this.titleEle = this.createElement('div', { className: classes.TITLE });\n if (!isNullOrUndefined(this.popupSettings.model) && this.popupSettings.model.afterOpen) {\n this.afterOpenEvent = this.popupSettings.model.afterOpen;\n }\n };\n /**\n * To Initialize the In-place editor rendering\n * @private\n */\n InPlaceEditor.prototype.render = function () {\n this.element.setAttribute('tabindex', '0');\n this.checkIsTemplate();\n this.disable(this.disabled);\n this.updateAdaptor();\n this.appendValueElement();\n this.updateValue();\n this.renderValue(this.checkValue(parseValue(this.type, this.value)));\n this.wireEvents();\n this.setRtl(this.enableRtl);\n this.enableEditor(this.enableEditMode);\n this.setClass('add', this.cssClass);\n };\n InPlaceEditor.prototype.setClass = function (action, val) {\n if (!this.isEmpty(val)) {\n action === 'add' ? addClass([this.element], [val]) : removeClass([this.element], [val]);\n }\n };\n InPlaceEditor.prototype.appendValueElement = function () {\n this.valueWrap = this.createElement('div', { id: this.element.id + '_wrap', className: classes.VALUE_WRAPPER });\n this.element.innerHTML = '';\n this.valueEle = this.createElement('span', { className: classes.VALUE });\n this.editIcon = this.createElement('span', {\n className: classes.OVERLAY_ICON + ' ' + classes.ICONS,\n attrs: { 'title': this.getLocale({ editIcon: 'Click to edit' }, 'editIcon') }\n });\n this.valueWrap.appendChild(this.valueEle);\n this.valueWrap.appendChild(this.editIcon);\n this.element.appendChild(this.valueWrap);\n };\n InPlaceEditor.prototype.renderValue = function (val) {\n this.valueEle.innerHTML = val;\n if (this.type === 'Color') {\n setStyleAttribute(this.valueEle, { 'color': val });\n }\n if (this.mode === 'Inline') {\n removeClass([this.valueWrap], [classes.HIDE]);\n }\n };\n InPlaceEditor.prototype.renderEditor = function () {\n var tipOptions = undefined;\n var target = select('.' + classes.VALUE_WRAPPER, this.element);\n if (this.valueWrap.classList.contains(classes.OPEN)) {\n return;\n }\n if (this.mode === 'Inline') {\n this.loaderWidth = this.valueWrap.offsetWidth;\n addClass([this.valueWrap], [classes.HIDE]);\n this.inlineWrapper = this.createElement('div', { className: classes.INLINE });\n this.element.appendChild(this.inlineWrapper);\n this.renderControl(this.inlineWrapper);\n this.afterOpenHandler(null);\n }\n else {\n if (!isNullOrUndefined(this.popupSettings.model) && this.popupSettings.model.afterOpen) {\n this.popupSettings.model.afterOpen = this.afterOpenHandler.bind(this);\n }\n var content = this.createElement('div', { className: classes.POPUP });\n if (!this.isEmpty(this.popupSettings.title)) {\n this.titleEle.innerHTML = this.popupSettings.title;\n content.appendChild(this.titleEle);\n }\n tipOptions = {\n content: content, opensOn: 'Custom',\n enableRtl: this.enableRtl, cssClass: classes.ROOT_TIP,\n afterOpen: this.afterOpenHandler.bind(this)\n };\n content.appendChild(this.renderControl(document.body));\n extend(tipOptions, this.popupSettings.model, tipOptions, true);\n this.tipObj = new Tooltip(tipOptions);\n this.tipObj.appendTo(target);\n this.tipObj.open(target);\n }\n if (this.actionOnBlur !== 'Ignore') {\n this.wireDocEvent();\n }\n this.initRender = false;\n addClass([this.valueWrap], [classes.OPEN]);\n this.setProperties({ enableEditMode: true }, true);\n };\n InPlaceEditor.prototype.setAttribute = function (ele, attr) {\n var value = this.name && this.name.length !== 0 ? this.name : this.element.id;\n attr.forEach(function (val) {\n ele.setAttribute(val, ((val === 'id') ? (value + '_editor') : value));\n });\n };\n InPlaceEditor.prototype.renderControl = function (target) {\n var ele;\n this.containerEle = this.createElement('div', { className: classes.WRAPPER });\n this.loader = this.createElement('div', { className: classes.LOADING });\n this.formEle = this.createElement('form', { className: classes.FORM });\n var ctrlGroupEle = this.createElement('div', { className: classes.CTRL_GROUP });\n var inputWrap = this.createElement('div', { className: classes.INPUT });\n target.appendChild(this.containerEle);\n this.loadSpinner();\n this.containerEle.appendChild(this.formEle);\n this.formEle.appendChild(ctrlGroupEle);\n if (this.isTemplate) {\n this.appendTemplate(inputWrap, this.template);\n }\n else {\n if (Array.prototype.indexOf.call(this.divComponents, this.type) > -1) {\n ele = this.createElement('div');\n this.setAttribute(ele, ['id']);\n }\n else {\n ele = this.createElement('input');\n this.setAttribute(ele, ['id', 'name']);\n }\n this.componentRoot = ele;\n inputWrap.appendChild(ele);\n inputWrap.appendChild(this.loader);\n }\n ctrlGroupEle.appendChild(inputWrap);\n ctrlGroupEle.appendChild(this.createElement('div', { className: classes.EDITABLE_ERROR }));\n this.appendButtons(this.formEle);\n if (!this.isTemplate) {\n this.renderComponent(ele);\n }\n this.removeSpinner();\n if (this.submitOnEnter) {\n this.wireEditorKeyDownEvent(this.containerEle);\n }\n return this.containerEle;\n };\n InPlaceEditor.prototype.appendButtons = function (trg) {\n if (this.showButtons && trg) {\n this.btnElements = this.renderButtons();\n trg.appendChild(this.btnElements);\n this.wireBtnEvents();\n }\n };\n InPlaceEditor.prototype.renderButtons = function () {\n var btnWrap = this.createElement('div', { className: classes.BUTTONS });\n var primary = (!isNOU(this.saveButton.content) && this.saveButton.content.length !== 0) ? (' ' + classes.PRIMARY) : '';\n this.submitBtn = this.createButtons({\n constant: 'save', type: 'submit', container: btnWrap,\n title: { save: 'Save' }, model: this.saveButton,\n className: classes.BTN_SAVE + primary\n });\n this.cancelBtn = this.createButtons({\n type: 'button', constant: 'cancel', title: { cancel: 'Cancel' },\n container: btnWrap, model: this.cancelButton,\n className: classes.BTN_CANCEL\n });\n return btnWrap;\n };\n InPlaceEditor.prototype.createButtons = function (args) {\n var btnObj = undefined;\n if (Object.keys(args.model).length > 0) {\n var btnEle = this.createElement('button', {\n className: args.className,\n attrs: { 'type': args.type, 'title': this.getLocale(args.title, args.constant) }\n });\n args.container.appendChild(btnEle);\n btnObj = new Button(args.model, btnEle);\n }\n return btnObj;\n };\n InPlaceEditor.prototype.renderComponent = function (ele) {\n this.isExtModule = (Array.prototype.indexOf.call(this.moduleList, this.type) > -1) ? true : false;\n extend(this.model, this.model, { cssClass: classes.ELEMENTS });\n if (!isNOU(this.value)) {\n this.updateModelValue();\n }\n if (this.isExtModule) {\n this.notify(events.render, { module: modulesList[this.type], target: ele, type: this.type });\n }\n else {\n if (isNOU(this.model.showClearButton)) {\n this.model.showClearButton = true;\n }\n switch (this.type) {\n case 'Date':\n this.componentObj = new DatePicker(this.model, ele);\n break;\n case 'DateTime':\n this.componentObj = new DateTimePicker(this.model, ele);\n break;\n case 'DropDownList':\n this.componentObj = new DropDownList(this.model, ele);\n break;\n case 'Mask':\n this.componentObj = new MaskedTextBox(this.model, ele);\n break;\n case 'Numeric':\n if (this.model.value) {\n this.model.value = this.model.value.toString().replace(/[`~!@#$%^&*()_|\\=?;:'\",<>\\{\\}\\[\\]\\\\\\/]/gi, '');\n }\n this.componentObj = new NumericTextBox(this.model, ele);\n break;\n case 'Text':\n this.componentObj = new TextBox(this.model, ele);\n break;\n }\n }\n };\n InPlaceEditor.prototype.updateAdaptor = function () {\n switch (this.adaptor) {\n case 'UrlAdaptor':\n this.dataAdaptor = new UrlAdaptor;\n break;\n case 'WebApiAdaptor':\n this.dataAdaptor = new WebApiAdaptor;\n break;\n case 'ODataV4Adaptor':\n this.dataAdaptor = new ODataV4Adaptor;\n break;\n }\n };\n InPlaceEditor.prototype.loadSpinner = function (callType) {\n addClass([this.loader], [classes.SHOW]);\n if (callType === 'validate' && (this.type === 'RTE' || this.type === 'Color' || this.type === 'Slider')) {\n addClass([this.loader], [classes.RTE_SPIN_WRAP]);\n addClass([this.getEditElement()], [classes.CTRL_OVERLAY]);\n this.spinObj = { target: this.loader };\n }\n else {\n this.spinObj = { target: this.loader, width: Browser.isDevice ? '16px' : '14px' };\n }\n if (this.formEle) {\n addClass([this.formEle], [classes.LOAD]);\n }\n if (this.btnElements) {\n addClass([this.btnElements], [classes.HIDE]);\n }\n setStyleAttribute(this.loader, { 'width': '100%' });\n createSpinner(this.spinObj);\n showSpinner(this.spinObj.target);\n };\n InPlaceEditor.prototype.removeSpinner = function (callType) {\n this.loader.removeAttribute('style');\n hideSpinner(this.spinObj.target);\n detach(this.spinObj.target.firstChild);\n if (callType === 'submit' && (this.type === 'RTE' || this.type === 'Color' || this.type === 'Slider')) {\n removeClass([this.loader], [classes.RTE_SPIN_WRAP]);\n removeClass([this.getEditElement()], [classes.CTRL_OVERLAY]);\n }\n if (this.formEle) {\n removeClass([this.formEle], [classes.LOAD]);\n }\n if (this.btnElements) {\n removeClass([this.btnElements], [classes.HIDE]);\n }\n removeClass([this.loader], [classes.SHOW]);\n };\n InPlaceEditor.prototype.getEditElement = function () {\n return select('.' + classes.ELEMENTS, this.formEle);\n };\n InPlaceEditor.prototype.getLocale = function (prop, val) {\n return new L10n('inplace-editor', prop, this.locale).getConstant(val);\n };\n InPlaceEditor.prototype.checkValue = function (val) {\n return (!this.isEmpty(val)) ? val : this.emptyText;\n };\n InPlaceEditor.prototype.extendModelValue = function (val) {\n var model = this.model;\n extend(model, { value: val });\n this.setProperties({ model: model }, true);\n };\n InPlaceEditor.prototype.updateValue = function () {\n if (!isNOU(this.value)) {\n this.setProperties({ value: getCompValue(this.type, this.value) }, true);\n this.extendModelValue(getCompValue(this.type, this.value));\n }\n };\n InPlaceEditor.prototype.updateModelValue = function () {\n if (this.type === 'MultiSelect' && !this.isEmpty(this.value)) {\n this.model.value = this.value.slice();\n }\n else {\n this.model.value = this.value;\n }\n };\n InPlaceEditor.prototype.setValue = function () {\n if (this.isExtModule) {\n this.notify(events.update, { type: this.type });\n }\n else if (this.componentObj) {\n this.setProperties({ value: this.componentObj.value }, true);\n this.extendModelValue(this.componentObj.value);\n }\n };\n InPlaceEditor.prototype.getDropDownsValue = function () {\n var value;\n if (Array.prototype.indexOf.call(this.dropDownEle, this.type) > -1 && this.type !== 'MultiSelect') {\n value = select('.e-' + this.type.toLocaleLowerCase(), this.containerEle).value;\n }\n else if (this.type === 'MultiSelect') {\n this.notify(events.accessValue, { type: this.type });\n value = this.printValue;\n }\n return value;\n };\n InPlaceEditor.prototype.getSendValue = function () {\n if (this.isEmpty(this.value)) {\n return '';\n }\n if (Array.prototype.indexOf.call(this.dropDownEle, this.type) > -1) {\n return this.getDropDownsValue();\n }\n else if (Array.prototype.indexOf.call(this.dateType, this.type) > -1) {\n return this.value.toISOString();\n }\n else if (this.type === 'DateRange') {\n return this.value[0].toISOString() + ' - ' + this.value[1].toISOString();\n }\n else {\n return this.value.toString();\n }\n };\n InPlaceEditor.prototype.getRenderValue = function () {\n if (this.type === 'Mask' && this.componentObj.value.length !== 0) {\n return this.componentObj.getMaskedValue();\n }\n else if (Array.prototype.indexOf.call(this.inputDataEle, this.type) > -1) {\n return this.componentRoot.value;\n }\n else if (Array.prototype.indexOf.call(this.dropDownEle, this.type) > -1) {\n return this.getDropDownsValue();\n }\n else {\n return parseValue(this.type, this.value);\n }\n };\n InPlaceEditor.prototype.setRtl = function (value) {\n value ? addClass([this.element], [classes.RTL]) : removeClass([this.element], [classes.RTL]);\n };\n InPlaceEditor.prototype.setFocus = function () {\n if (this.isTemplate) {\n return;\n }\n this.isExtModule ? this.notify(events.setFocus, {}) : this.componentObj.element.focus();\n };\n InPlaceEditor.prototype.removeEditor = function () {\n var tipEle;\n if (this.tipObj && this.formEle) {\n tipEle = closest(this.formEle, '.' + classes.ROOT_TIP);\n tipEle.classList.add(classes.HIDE);\n }\n this.unWireDocEvent();\n this.destroyComponents();\n this.formEle = undefined;\n if (!isNOU(select('.' + classes.INLINE, this.element))) {\n detach(this.inlineWrapper);\n this.inlineWrapper = undefined;\n }\n else if (this.tipObj) {\n if (this.type === 'MultiSelect') {\n EventHandler.remove(this.containerEle, 'mousedown', this.popMouseDown);\n EventHandler.remove(this.containerEle, 'click', this.popClickHandler);\n }\n this.tipObj.close();\n this.tipObj.destroy();\n this.tipObj = undefined;\n }\n this.containerEle = undefined;\n removeClass([this.valueWrap], [classes.OPEN, classes.HIDE]);\n this.setProperties({ enableEditMode: false }, true);\n };\n InPlaceEditor.prototype.destroyComponents = function () {\n if (this.showButtons) {\n this.destroyButtons();\n }\n if (this.isExtModule) {\n this.notify(events.destroyModules, {});\n }\n else {\n if (this.templateEle) {\n document.body.appendChild(this.templateEle);\n this.templateEle.style.display = 'none';\n this.templateEle = undefined;\n }\n if (!isNOU(this.componentObj)) {\n this.componentObj.destroy();\n this.componentObj = undefined;\n }\n }\n if (this.formValidate) {\n this.formValidate = undefined;\n }\n if (this.submitOnEnter && this.containerEle) {\n this.unWireEditorKeyDownEvent(this.containerEle);\n }\n };\n InPlaceEditor.prototype.destroyButtons = function () {\n if (!isNOU(this.submitBtn)) {\n EventHandler.remove(this.submitBtn.element, 'mousedown', this.submitHandler);\n EventHandler.remove(this.submitBtn.element, 'click', this.submitPrevent);\n EventHandler.remove(this.submitBtn.element, 'keydown', this.btnKeyDownHandler);\n this.submitBtn.destroy();\n this.submitBtn = undefined;\n }\n if (!isNOU(this.cancelBtn)) {\n EventHandler.remove(this.cancelBtn.element, 'mousedown', this.cancelHandler);\n EventHandler.remove(this.cancelBtn.element, 'keydown', this.btnKeyDownHandler);\n this.cancelBtn.destroy();\n this.cancelBtn = undefined;\n }\n this.btnElements = undefined;\n };\n InPlaceEditor.prototype.getQuery = function (params) {\n var query = new Query();\n Object.keys(params).forEach(function (key) {\n query.addParams(key, params[key]);\n });\n return query;\n };\n InPlaceEditor.prototype.sendValue = function () {\n var _this = this;\n var eventArgs = { data: { name: this.name, primaryKey: this.primaryKey, value: this.getSendValue() } };\n this.trigger('actionBegin', eventArgs);\n if (!this.isEmpty(this.url) && !this.isEmpty(this.primaryKey)) {\n this.dataManager = new DataManager({ url: this.url, adaptor: this.dataAdaptor });\n if (this.adaptor === 'UrlAdaptor') {\n this.dataManager.executeQuery(this.getQuery(eventArgs.data), this.successHandler.bind(this), this.failureHandler.bind(this));\n }\n else {\n var crud = this.dataManager.insert(eventArgs.data);\n crud.then(function (e) { return _this.successHandler(e); }).catch(function (e) { return _this.failureHandler(e); });\n }\n }\n else {\n var eventArg = { data: {}, value: eventArgs.data.value };\n this.triggerSuccess(eventArg);\n }\n this.dataManager = undefined;\n };\n InPlaceEditor.prototype.isEmpty = function (value) {\n return (!isNOU(value) && value.length !== 0) ? false : true;\n };\n InPlaceEditor.prototype.checkIsTemplate = function () {\n this.isTemplate = (!isNOU(this.template) && this.template !== '') ? true : false;\n };\n InPlaceEditor.prototype.templateCompile = function (trgEle, tempStr) {\n var tempEle;\n if (typeof tempStr === 'string') {\n tempStr = tempStr.trim();\n }\n var compiler = compile(tempStr);\n if (!isNOU(compiler)) {\n tempEle = compiler({}, this, 'template');\n }\n if (!isNOU(compiler) && tempEle.length > 0) {\n [].slice.call(tempEle).forEach(function (el) {\n trgEle.appendChild(el);\n });\n }\n };\n InPlaceEditor.prototype.appendTemplate = function (trgEle, tempStr) {\n if (typeof tempStr === 'string' || isNOU(tempStr.innerHTML)) {\n if (tempStr[0] === '.' || tempStr[0] === '#') {\n if (document.querySelectorAll(tempStr).length) {\n this.templateEle = document.querySelector(tempStr);\n trgEle.appendChild(this.templateEle);\n this.templateEle.style.display = '';\n }\n else {\n this.templateCompile(trgEle, tempStr);\n }\n }\n else {\n this.templateCompile(trgEle, tempStr);\n }\n }\n else {\n this.templateEle = tempStr;\n trgEle.appendChild(this.templateEle);\n }\n };\n InPlaceEditor.prototype.disable = function (value) {\n value ? addClass([this.element], [classes.DISABLE]) : removeClass([this.element], [classes.DISABLE]);\n };\n InPlaceEditor.prototype.enableEditor = function (val) {\n (val) ? this.renderEditor() : this.cancelHandler();\n };\n InPlaceEditor.prototype.checkValidation = function () {\n var _this = this;\n var args;\n if (this.validationRules) {\n this.formValidate = new FormValidator(this.formEle, {\n rules: this.validationRules,\n validationComplete: function (e) {\n args = {\n errorMessage: e.message,\n data: { name: _this.name, primaryKey: _this.primaryKey, value: _this.checkValue(_this.getSendValue()) }\n };\n _this.trigger('validating', args);\n if (e.status === 'failure') {\n e.errorElement.innerText = args.errorMessage;\n _this.toggleErrorClass(true);\n }\n else {\n _this.toggleErrorClass(false);\n }\n },\n customPlacement: function (inputElement, errorElement) {\n select('.' + classes.EDITABLE_ERROR, _this.formEle).appendChild(errorElement);\n }\n });\n this.formValidate.validate();\n }\n else {\n args = {\n errorMessage: '',\n data: { name: this.name, primaryKey: this.primaryKey, value: this.checkValue(this.getSendValue()) }\n };\n this.trigger('validating', args);\n if (args.errorMessage) {\n select('.' + classes.EDITABLE_ERROR, this.formEle).innerHTML = args.errorMessage;\n this.toggleErrorClass(true);\n }\n else {\n this.toggleErrorClass(false);\n }\n }\n };\n InPlaceEditor.prototype.toggleErrorClass = function (value) {\n if (isNOU(this.formEle)) {\n return;\n }\n var inputEle = select('.e-input-group', this.formEle);\n var errorClass = function (element, val, action) {\n [].slice.call(element).forEach(function (ele) {\n if (ele) {\n action === 'add' ? addClass([ele], [val]) : removeClass([ele], [val]);\n }\n });\n };\n errorClass([this.formEle, inputEle], classes.ERROR, value ? 'add' : 'remove');\n };\n InPlaceEditor.prototype.updateArrow = function () {\n var pos = this.tipObj.tipPointerPosition;\n this.tipObj.tipPointerPosition = (pos === 'Middle') ? 'Auto' : 'Middle';\n this.tipObj.tipPointerPosition = pos;\n this.tipObj.dataBind();\n };\n InPlaceEditor.prototype.triggerSuccess = function (args) {\n var val = args.value;\n this.trigger('actionSuccess', args);\n this.removeSpinner('submit');\n this.renderValue(this.checkValue((args.value !== val) ? args.value : this.getRenderValue()));\n this.removeEditor();\n };\n InPlaceEditor.prototype.wireEvents = function () {\n this.wireEditEvent(this.editableOn);\n EventHandler.add(this.editIcon, 'click', this.clickHandler, this);\n EventHandler.add(this.element, 'keydown', this.valueKeyDownHandler, this);\n EventHandler.add(document, 'scroll', this.scrollResizeHandler, this);\n window.addEventListener('resize', this.scrollResizeHandler.bind(this));\n if (Array.prototype.indexOf.call(this.clearComponents, this.type) > -1) {\n EventHandler.add(this.element, 'mousedown', this.mouseDownHandler, this);\n }\n };\n InPlaceEditor.prototype.wireDocEvent = function () {\n EventHandler.add(document, 'mousedown', this.docClickHandler, this);\n };\n InPlaceEditor.prototype.wireEditEvent = function (event) {\n if (event === 'EditIconClick') {\n return;\n }\n var titleConstant = (event === 'Click') ? 'editAreaClick' : 'editAreaDoubleClick';\n this.element.setAttribute('title', this.getLocale(localeConstant[event], titleConstant));\n if (Browser.isDevice && Browser.isIos && event === 'DblClick') {\n this.touchModule = new Touch(this.valueWrap, { tap: this.doubleTapHandler.bind(this) });\n }\n else {\n EventHandler.add(this.valueWrap, event.toLowerCase(), this.clickHandler, this);\n }\n };\n InPlaceEditor.prototype.wireEditorKeyDownEvent = function (ele) {\n EventHandler.add(ele, 'keydown', this.enterKeyDownHandler, this);\n };\n InPlaceEditor.prototype.wireBtnEvents = function () {\n if (!isNOU(this.submitBtn)) {\n EventHandler.add(this.submitBtn.element, 'mousedown', this.submitHandler, this);\n EventHandler.add(this.submitBtn.element, 'click', this.submitPrevent, this);\n EventHandler.add(this.submitBtn.element, 'keydown', this.btnKeyDownHandler, this);\n }\n if (!isNOU(this.cancelBtn)) {\n EventHandler.add(this.cancelBtn.element, 'mousedown', this.cancelHandler, this);\n EventHandler.add(this.cancelBtn.element, 'keydown', this.btnKeyDownHandler, this);\n }\n };\n InPlaceEditor.prototype.unWireEvents = function () {\n this.unWireEditEvent(this.editableOn);\n EventHandler.remove(this.editIcon, 'click', this.clickHandler);\n EventHandler.remove(document, 'scroll', this.scrollResizeHandler);\n window.removeEventListener('resize', this.scrollResizeHandler.bind(this));\n EventHandler.remove(this.element, 'keydown', this.valueKeyDownHandler);\n if (Array.prototype.indexOf.call(this.clearComponents, this.type) > -1) {\n EventHandler.remove(this.element, 'mousedown', this.mouseDownHandler);\n }\n };\n InPlaceEditor.prototype.unWireDocEvent = function () {\n EventHandler.remove(document, 'mousedown', this.docClickHandler);\n };\n InPlaceEditor.prototype.unWireEditEvent = function (event) {\n if (event === 'EditIconClick') {\n return;\n }\n this.element.removeAttribute('title');\n if (Browser.isDevice && Browser.isIos && event === 'DblClick') {\n this.touchModule.destroy();\n this.touchModule = undefined;\n }\n else {\n EventHandler.remove(this.valueWrap, event.toLowerCase(), this.clickHandler);\n }\n };\n InPlaceEditor.prototype.unWireEditorKeyDownEvent = function (ele) {\n EventHandler.remove(ele, 'keydown', this.enterKeyDownHandler);\n };\n InPlaceEditor.prototype.submitPrevent = function (e) {\n e.preventDefault();\n };\n InPlaceEditor.prototype.btnKeyDownHandler = function (e) {\n var trg = e.target;\n if ((e.keyCode === 13 && e.which === 13) || (e.keyCode === 32 && e.which === 32)) {\n if (trg.classList.contains(classes.BTN_SAVE)) {\n this.save();\n }\n else if (trg.classList.contains(classes.BTN_CANCEL)) {\n this.cancelHandler();\n }\n }\n };\n InPlaceEditor.prototype.afterOpenHandler = function (e) {\n if (this.mode === 'Popup' && this.type === 'MultiSelect') {\n EventHandler.add(this.containerEle, 'mousedown', this.popMouseDown, this);\n EventHandler.add(this.containerEle, 'click', this.popClickHandler, this);\n }\n if (this.mode === 'Popup' && !this.isEmpty(this.titleEle.innerHTML)) {\n e.element.classList.add(classes.TIP_TITLE);\n }\n if (this.type === 'RTE') {\n this.rteModule.refresh();\n this.setAttribute(select('.e-richtexteditor textarea', this.containerEle), ['name']);\n }\n else if (this.type === 'Slider') {\n this.sliderModule.refresh();\n this.setAttribute(select('.e-slider-input', this.containerEle), ['name']);\n }\n this.setFocus();\n if (this.afterOpenEvent) {\n this.tipObj.setProperties({ afterOpen: this.afterOpenEvent }, true);\n this.tipObj.trigger('afterOpen', e);\n }\n };\n InPlaceEditor.prototype.popMouseDown = function (e) {\n var trgClass = e.target.classList;\n if (trgClass.contains('e-chips-close') && !trgClass.contains('e-close-hooker')) {\n this.updateArrow();\n }\n };\n InPlaceEditor.prototype.doubleTapHandler = function (e) {\n if (e.tapCount > 1) {\n this.clickHandler(e.originalEvent);\n }\n };\n InPlaceEditor.prototype.clickHandler = function (e) {\n if (this.editableOn !== 'EditIconClick') {\n e.stopPropagation();\n }\n this.renderEditor();\n };\n InPlaceEditor.prototype.submitHandler = function (e) {\n e.preventDefault();\n this.save();\n };\n InPlaceEditor.prototype.cancelHandler = function () {\n this.removeEditor();\n };\n InPlaceEditor.prototype.popClickHandler = function (e) {\n var tipTarget = select('.' + classes.VALUE_WRAPPER, this.element);\n if (e.target.classList.contains('e-chips-close')) {\n this.tipObj.refresh(tipTarget);\n }\n };\n InPlaceEditor.prototype.successHandler = function (e) {\n var eventArgs = { data: e, value: this.getSendValue() };\n this.triggerSuccess(eventArgs);\n };\n InPlaceEditor.prototype.failureHandler = function (e) {\n var eventArgs = { data: e, value: this.getSendValue() };\n this.trigger('actionFailure', eventArgs);\n this.removeSpinner('submit');\n if (this.mode === 'Popup') {\n this.updateArrow();\n }\n };\n InPlaceEditor.prototype.enterKeyDownHandler = function (e) {\n if (!closest(e.target, '.' + classes.INPUT + ' .e-richtexteditor')) {\n if ((e.keyCode === 13 && e.which === 13) && closest(e.target, '.' + classes.INPUT)) {\n this.save();\n }\n else if (e.keyCode === 27 && e.which === 27) {\n this.cancelHandler();\n }\n }\n };\n InPlaceEditor.prototype.valueKeyDownHandler = function (e) {\n if ((e.keyCode === 13 && e.which === 13) && e.target.classList.contains(classes.ROOT) &&\n !this.valueWrap.classList.contains(classes.OPEN) && !this.element.classList.contains(classes.DISABLE)) {\n e.preventDefault();\n this.renderEditor();\n }\n };\n InPlaceEditor.prototype.mouseDownHandler = function (e) {\n if (e.target.classList.contains('e-clear-icon')) {\n this.isClearTarget = true;\n }\n };\n InPlaceEditor.prototype.scrollResizeHandler = function () {\n if (this.mode === 'Popup' && this.tipObj && !(Browser.isDevice)) {\n this.removeEditor();\n }\n };\n InPlaceEditor.prototype.docClickHandler = function (e) {\n var trg = e.target;\n if (this.isClearTarget) {\n this.isClearTarget = false;\n return;\n }\n var relateRoot = closest(trg, '.' + classes.ROOT);\n var relateTipRoot = closest(trg, '.' + classes.ROOT_TIP);\n var relateElements = closest(trg, '.' + classes.ELEMENTS);\n var relateRTEElements = closest(trg, '.e-rte-elements');\n if ((!isNOU(relateRoot) && relateRoot.isEqualNode(this.element)) ||\n (!isNOU(relateTipRoot) && this.tipObj && (relateTipRoot.id.indexOf(this.valueWrap.id) > -1)) ||\n !isNOU(relateElements) || !isNOU(relateRTEElements) || trg.classList.contains('e-chips-close')) {\n return;\n }\n else {\n if (this.actionOnBlur === 'Submit') {\n this.save();\n }\n else if (this.actionOnBlur === 'Cancel') {\n this.cancelHandler();\n }\n }\n };\n /**\n * Validate current editor value.\n * @returns void\n */\n InPlaceEditor.prototype.validate = function () {\n this.checkValidation();\n };\n /**\n * Submit the edited input value to the server.\n * @returns void\n */\n InPlaceEditor.prototype.save = function () {\n if (!this.formEle) {\n return;\n }\n this.element.focus();\n this.editEle = select('.' + classes.INPUT, this.formEle);\n var errEle = null;\n errEle = select('.' + classes.ERROR, this.editEle);\n var type = this.type;\n var calendarComp = type === 'Date' || type === 'DateTime' || type === 'DateRange' || type === 'Time';\n if ((errEle && !isNOU(this.validationRules)) || (errEle && calendarComp)) {\n return;\n }\n if (!this.isTemplate) {\n this.setValue();\n }\n this.checkValidation();\n if (!this.formEle.classList.contains(classes.ERROR)) {\n this.loadSpinner('validate');\n if (this.mode === 'Popup') {\n this.updateArrow();\n }\n this.sendValue();\n }\n };\n /**\n * Removes the control from the DOM and also removes all its related events.\n * @returns void\n */\n InPlaceEditor.prototype.destroy = function () {\n var _this = this;\n this.removeEditor();\n if (this.isExtModule) {\n this.notify(events.destroy, {});\n }\n this.unWireEvents();\n var classList = [classes.DISABLE, classes.RTL];\n classList.forEach(function (val) {\n removeClass([_this.element], [val]);\n });\n while (this.element.firstChild) {\n this.element.removeChild(this.element.firstChild);\n }\n _super.prototype.destroy.call(this);\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @returns string\n */\n InPlaceEditor.prototype.getPersistData = function () {\n return this.addOnPersist(['value']);\n };\n /**\n * To provide the array of modules needed for component rendering\n * @return {ModuleDeclaration[]}\n * @hidden\n */\n InPlaceEditor.prototype.requiredModules = function () {\n var modules = [];\n modules.push({ member: modulesList[this.type], args: [this] });\n return modules;\n };\n /**\n * Returns the current module name.\n * @returns string\n * @private\n */\n InPlaceEditor.prototype.getModuleName = function () {\n return 'inplaceeditor';\n };\n /**\n * Gets called when the model property changes.The data that describes the old and new values of property that changed.\n * @param {InPlaceEditorModel} newProp\n * @param {InPlaceEditorModel} oldProp\n * @returns void\n * @private\n */\n InPlaceEditor.prototype.onPropertyChanged = function (newProp, oldProp) {\n this.removeEditor();\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'showButtons':\n (newProp.showButtons) ? this.appendButtons(this.formEle) : this.destroyButtons();\n break;\n case 'value':\n this.updateValue();\n this.renderValue(this.checkValue(parseValue(this.type, this.value)));\n break;\n case 'emptyText':\n this.renderValue(this.checkValue(parseValue(this.type, this.value)));\n break;\n case 'template':\n this.checkIsTemplate();\n break;\n case 'disabled':\n this.disable(newProp.disabled);\n break;\n case 'enableRtl':\n this.setRtl(newProp.enableRtl);\n break;\n case 'cssClass':\n this.setClass('remove', oldProp.cssClass);\n this.setClass('add', newProp.cssClass);\n break;\n case 'mode':\n this.enableEditor(this.enableEditMode);\n break;\n case 'enableEditMode':\n this.enableEditor(newProp.enableEditMode);\n break;\n case 'editableOn':\n this.unWireEditEvent(oldProp.editableOn);\n if (newProp.editableOn !== 'EditIconClick') {\n this.wireEditEvent(newProp.editableOn);\n }\n break;\n }\n }\n };\n __decorate([\n Property('')\n ], InPlaceEditor.prototype, \"name\", void 0);\n __decorate([\n Property(null)\n ], InPlaceEditor.prototype, \"value\", void 0);\n __decorate([\n Property('')\n ], InPlaceEditor.prototype, \"template\", void 0);\n __decorate([\n Property('')\n ], InPlaceEditor.prototype, \"cssClass\", void 0);\n __decorate([\n Property('')\n ], InPlaceEditor.prototype, \"primaryKey\", void 0);\n __decorate([\n Property('Empty')\n ], InPlaceEditor.prototype, \"emptyText\", void 0);\n __decorate([\n Property('')\n ], InPlaceEditor.prototype, \"url\", void 0);\n __decorate([\n Property('Popup')\n ], InPlaceEditor.prototype, \"mode\", void 0);\n __decorate([\n Property('UrlAdaptor')\n ], InPlaceEditor.prototype, \"adaptor\", void 0);\n __decorate([\n Property('Text')\n ], InPlaceEditor.prototype, \"type\", void 0);\n __decorate([\n Property('Click')\n ], InPlaceEditor.prototype, \"editableOn\", void 0);\n __decorate([\n Property('Submit')\n ], InPlaceEditor.prototype, \"actionOnBlur\", void 0);\n __decorate([\n Property(false)\n ], InPlaceEditor.prototype, \"enableRtl\", void 0);\n __decorate([\n Property(false)\n ], InPlaceEditor.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property(false)\n ], InPlaceEditor.prototype, \"disabled\", void 0);\n __decorate([\n Property(true)\n ], InPlaceEditor.prototype, \"showButtons\", void 0);\n __decorate([\n Property(false)\n ], InPlaceEditor.prototype, \"enableEditMode\", void 0);\n __decorate([\n Property(true)\n ], InPlaceEditor.prototype, \"submitOnEnter\", void 0);\n __decorate([\n Complex({}, PopupSettings)\n ], InPlaceEditor.prototype, \"popupSettings\", void 0);\n __decorate([\n Property(null)\n ], InPlaceEditor.prototype, \"model\", void 0);\n __decorate([\n Property({ iconCss: 'e-icons e-save-icon' })\n ], InPlaceEditor.prototype, \"saveButton\", void 0);\n __decorate([\n Property({ iconCss: 'e-icons e-cancel-icon' })\n ], InPlaceEditor.prototype, \"cancelButton\", void 0);\n __decorate([\n Property(null)\n ], InPlaceEditor.prototype, \"validationRules\", void 0);\n __decorate([\n Event()\n ], InPlaceEditor.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], InPlaceEditor.prototype, \"actionBegin\", void 0);\n __decorate([\n Event()\n ], InPlaceEditor.prototype, \"actionSuccess\", void 0);\n __decorate([\n Event()\n ], InPlaceEditor.prototype, \"actionFailure\", void 0);\n __decorate([\n Event()\n ], InPlaceEditor.prototype, \"validating\", void 0);\n __decorate([\n Event()\n ], InPlaceEditor.prototype, \"destroyed\", void 0);\n InPlaceEditor = __decorate([\n NotifyPropertyChanges\n ], InPlaceEditor);\n return InPlaceEditor;\n}(Component));\nexport { InPlaceEditor };\n","import { isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';\nimport * as events from '../base/events';\n/**\n * The `Base` module.\n */\nvar Base = /** @class */ (function () {\n function Base(parent, module) {\n this.parent = parent;\n this.module = module;\n this.addEventListener();\n }\n Base.prototype.render = function (e) {\n this.module.render(e);\n };\n Base.prototype.focus = function () {\n this.module.focus();\n };\n Base.prototype.update = function (e) {\n this.module.updateValue(e);\n };\n Base.prototype.getValue = function () {\n this.module.getRenderValue();\n };\n Base.prototype.destroyComponent = function () {\n if (isNOU(this.module.compObj)) {\n return;\n }\n this.module.compObj.destroy();\n this.module.compObj = undefined;\n };\n Base.prototype.destroy = function () {\n this.destroyComponent();\n this.removeEventListener();\n };\n Base.prototype.addEventListener = function () {\n this.parent.on(events.render, this.render, this);\n this.parent.on(events.setFocus, this.focus, this);\n this.parent.on(events.update, this.update, this);\n this.parent.on(events.accessValue, this.getValue, this);\n this.parent.on(events.destroyModules, this.destroyComponent, this);\n this.parent.on(events.destroy, this.destroy, this);\n };\n Base.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.render, this.render);\n this.parent.off(events.setFocus, this.focus);\n this.parent.off(events.update, this.update);\n this.parent.off(events.accessValue, this.getValue);\n this.parent.off(events.destroyModules, this.destroyComponent);\n this.parent.off(events.destroy, this.destroy);\n };\n return Base;\n}());\nexport { Base };\n","import { AutoComplete as EJ2AutoComplete } from '@syncfusion/ej2-dropdowns';\nimport { Base } from './base-module';\n/**\n * The `AutoComplete` module is used configure the properties of Auto complete type editor.\n */\nvar AutoComplete = /** @class */ (function () {\n function AutoComplete(parent) {\n this.compObj = undefined;\n this.parent = parent;\n this.parent.atcModule = this;\n this.base = new Base(this.parent, this);\n }\n AutoComplete.prototype.render = function (e) {\n this.compObj = new EJ2AutoComplete(this.parent.model, e.target);\n };\n AutoComplete.prototype.focus = function () {\n this.compObj.element.focus();\n };\n AutoComplete.prototype.updateValue = function (e) {\n if (this.compObj && e.type === 'AutoComplete') {\n this.parent.setProperties({ value: this.compObj.value }, true);\n this.parent.extendModelValue(this.compObj.value);\n }\n };\n /**\n * Destroys the module.\n * @method destroy\n * @return {void}\n */\n AutoComplete.prototype.destroy = function () {\n this.base.destroy();\n };\n /**\n * For internal use only - Get the module name.\n */\n AutoComplete.prototype.getModuleName = function () {\n return 'auto-complete';\n };\n return AutoComplete;\n}());\nexport { AutoComplete };\n","import { ColorPicker as EJ2ColorPicker } from '@syncfusion/ej2-inputs';\nimport { Base } from './base-module';\n/**\n * The `ColorPicker` module is used configure the properties of Color picker type editor.\n */\nvar ColorPicker = /** @class */ (function () {\n function ColorPicker(parent) {\n this.compObj = undefined;\n this.parent = parent;\n this.parent.colorModule = this;\n this.base = new Base(this.parent, this);\n }\n ColorPicker.prototype.render = function (e) {\n this.compObj = new EJ2ColorPicker(this.parent.model, e.target);\n };\n ColorPicker.prototype.focus = function () {\n this.compObj.element.focus();\n };\n ColorPicker.prototype.updateValue = function (e) {\n if (this.compObj && e.type === 'Color') {\n this.parent.setProperties({ value: this.compObj.value }, true);\n this.parent.extendModelValue(this.compObj.value);\n }\n };\n /**\n * Destroys the module.\n * @method destroy\n * @return {void}\n */\n ColorPicker.prototype.destroy = function () {\n this.base.destroy();\n };\n /**\n * For internal use only - Get the module name.\n */\n ColorPicker.prototype.getModuleName = function () {\n return 'color-picker';\n };\n return ColorPicker;\n}());\nexport { ColorPicker };\n","import { ComboBox as EJ2ComboBox } from '@syncfusion/ej2-dropdowns';\nimport { Base } from './base-module';\n/**\n * The `ComboBox` module is used configure the properties of Combo box type editor.\n */\nvar ComboBox = /** @class */ (function () {\n function ComboBox(parent) {\n this.compObj = undefined;\n this.parent = parent;\n this.parent.comboBoxModule = this;\n this.base = new Base(this.parent, this);\n }\n ComboBox.prototype.render = function (e) {\n this.compObj = new EJ2ComboBox(this.parent.model, e.target);\n };\n ComboBox.prototype.focus = function () {\n this.compObj.element.focus();\n };\n ComboBox.prototype.updateValue = function (e) {\n if (this.compObj && e.type === 'ComboBox') {\n this.parent.setProperties({ value: this.compObj.value }, true);\n this.parent.extendModelValue(this.compObj.value);\n }\n };\n /**\n * Destroys the module.\n * @method destroy\n * @return {void}\n */\n ComboBox.prototype.destroy = function () {\n this.base.destroy();\n };\n /**\n * For internal use only - Get the module name.\n */\n ComboBox.prototype.getModuleName = function () {\n return 'combo-box';\n };\n return ComboBox;\n}());\nexport { ComboBox };\n","import { DateRangePicker as EJ2DateRangePicker } from '@syncfusion/ej2-calendars';\nimport { Base } from './base-module';\n/**\n * The `DateRangePicker` module is used configure the properties of Date range picker type editor.\n */\nvar DateRangePicker = /** @class */ (function () {\n function DateRangePicker(parent) {\n this.compObj = undefined;\n this.parent = parent;\n this.parent.dateRangeModule = this;\n this.base = new Base(this.parent, this);\n }\n DateRangePicker.prototype.render = function (e) {\n this.compObj = new EJ2DateRangePicker(this.parent.model);\n this.compObj.appendTo(e.target);\n };\n DateRangePicker.prototype.focus = function () {\n this.compObj.element.focus();\n };\n DateRangePicker.prototype.updateValue = function (e) {\n if (this.compObj && e.type === 'DateRange') {\n this.parent.setProperties({ value: this.compObj.value }, true);\n this.parent.extendModelValue(this.compObj.value);\n }\n };\n /**\n * Destroys the module.\n * @method destroy\n * @return {void}\n */\n DateRangePicker.prototype.destroy = function () {\n this.base.destroy();\n };\n /**\n * For internal use only - Get the module name.\n */\n DateRangePicker.prototype.getModuleName = function () {\n return 'date-range-picker';\n };\n return DateRangePicker;\n}());\nexport { DateRangePicker };\n","import { closest } from '@syncfusion/ej2-base';\nimport { MultiSelect as EJ2MultiSelect } from '@syncfusion/ej2-dropdowns';\nimport { Base } from './base-module';\n/**\n * The `MultiSelect` module is used configure the properties of Multi select type editor.\n */\nvar MultiSelect = /** @class */ (function () {\n function MultiSelect(parent) {\n this.compObj = undefined;\n this.parent = parent;\n this.parent.multiSelectModule = this;\n this.base = new Base(this.parent, this);\n }\n MultiSelect.prototype.render = function (e) {\n this.compObj = new EJ2MultiSelect(this.parent.model, e.target);\n };\n MultiSelect.prototype.focus = function () {\n closest(this.compObj.element, '.e-multi-select-wrapper').dispatchEvent(new MouseEvent('mousedown'));\n };\n MultiSelect.prototype.updateValue = function (e) {\n if (this.compObj && e.type === 'MultiSelect') {\n this.parent.setProperties({ value: this.compObj.value }, true);\n this.parent.extendModelValue(this.compObj.value);\n }\n };\n MultiSelect.prototype.getRenderValue = function () {\n this.parent.printValue = this.compObj.text;\n };\n /**\n * Destroys the module.\n * @method destroy\n * @return {void}\n */\n MultiSelect.prototype.destroy = function () {\n this.base.destroy();\n };\n /**\n * For internal use only - Get the module name.\n */\n MultiSelect.prototype.getModuleName = function () {\n return 'multi-select';\n };\n return MultiSelect;\n}());\nexport { MultiSelect };\n","import { RichTextEditor, HtmlEditor } from '@syncfusion/ej2-richtexteditor';\nimport { MarkdownEditor, Toolbar, Link, Image, QuickToolbar, Table } from '@syncfusion/ej2-richtexteditor';\nimport { Base } from './base-module';\nRichTextEditor.Inject(HtmlEditor, MarkdownEditor, Toolbar, Link, Image, QuickToolbar, Table);\n/**\n * The `RTE` module is used configure the properties of RTE type editor.\n */\nvar Rte = /** @class */ (function () {\n function Rte(parent) {\n this.compObj = undefined;\n this.parent = parent;\n this.parent.rteModule = this;\n this.base = new Base(this.parent, this);\n }\n Rte.prototype.render = function (e) {\n this.compObj = new RichTextEditor(this.parent.model, e.target);\n };\n Rte.prototype.focus = function () {\n this.compObj.element.focus();\n };\n Rte.prototype.updateValue = function (e) {\n if (this.compObj && e.type === 'RTE') {\n var rteValue = this.compObj.contentModule.getEditPanel().innerHTML === '
\n * \n * ```\n */\nvar LinearGauge = /** @class */ (function (_super) {\n __extends(LinearGauge, _super);\n /**\n * @private\n * Constructor for creating the widget\n * @hidden\n */\n function LinearGauge(options, element) {\n var _this = _super.call(this, options, element) || this;\n /** @private */\n _this.pointerDrag = false;\n /** @private */\n _this.mouseX = 0;\n /** @private */\n _this.mouseY = 0;\n /** @private */\n _this.gaugeResized = false;\n return _this;\n }\n /**\n * Initialize the preRender method.\n */\n LinearGauge.prototype.preRender = function () {\n this.unWireEvents();\n this.trigger(load, { gauge: this });\n this.initPrivateVariable();\n this.setCulture();\n this.createSvg();\n this.wireEvents();\n };\n LinearGauge.prototype.setTheme = function () {\n this.themeStyle = getThemeStyle(this.theme);\n };\n LinearGauge.prototype.initPrivateVariable = function () {\n if (this.element.id === '') {\n var collection = document.getElementsByClassName('e-lineargauge').length;\n this.element.id = 'lineargauge_' + 'control_' + collection;\n }\n this.renderer = new SvgRenderer(this.element.id);\n this.gaugeAxisLayoutPanel = new AxisLayoutPanel(this);\n this.axisRenderer = new AxisRenderer(this);\n };\n /**\n * Method to set culture for chart\n */\n LinearGauge.prototype.setCulture = function () {\n this.intl = new Internationalization();\n };\n /**\n * Methods to create svg element\n */\n LinearGauge.prototype.createSvg = function () {\n this.removeSvg();\n this.calculateSize();\n this.svgObject = this.renderer.createSvg({\n id: this.element.id + '_svg',\n width: this.availableSize.width,\n height: this.availableSize.height\n });\n };\n /**\n * To Remove the SVG.\n * @return {boolean}\n * @private\n */\n LinearGauge.prototype.removeSvg = function () {\n removeElement(this.element.id + '_Secondary_Element');\n if (!(isNullOrUndefined(this.svgObject)) && !isNullOrUndefined(this.svgObject.parentNode)) {\n remove(this.svgObject);\n }\n };\n /**\n * Method to calculate the size of the gauge\n */\n LinearGauge.prototype.calculateSize = function () {\n var width = stringToNumber(this.width, this.element.offsetWidth) || this.element.offsetWidth || 600;\n var height = stringToNumber(this.height, this.element.offsetHeight) || this.element.offsetHeight || 450;\n this.availableSize = new Size(width, height);\n };\n /**\n * To Initialize the control rendering\n */\n LinearGauge.prototype.render = function () {\n this.setTheme();\n this.renderGaugeElements();\n this.calculateBounds();\n this.renderAxisElements();\n this.trigger(loaded, { gauge: this });\n };\n /**\n * @private\n * To render the gauge elements\n */\n LinearGauge.prototype.renderGaugeElements = function () {\n this.appendSecondaryElement();\n this.renderBorder();\n this.renderTitle();\n this.renderContainer();\n };\n LinearGauge.prototype.appendSecondaryElement = function () {\n if (isNullOrUndefined(getElement(this.element.id + '_Secondary_Element'))) {\n var secondaryElement = createElement('div');\n secondaryElement.id = this.element.id + '_Secondary_Element';\n secondaryElement.setAttribute('style', 'position: relative');\n this.element.appendChild(secondaryElement);\n }\n };\n /**\n * Render the map area border\n */\n LinearGauge.prototype.renderArea = function () {\n var size = measureText(this.title, this.titleStyle);\n var rectSize = new Rect(this.actualRect.x, this.actualRect.y - (size.height / 2), this.actualRect.width, this.actualRect.height);\n var rect = new RectOption(this.element.id + 'LinearGaugeBorder', this.background || this.themeStyle.backgroundColor, this.border, 1, rectSize);\n this.svgObject.appendChild(this.renderer.drawRectangle(rect));\n };\n /**\n * @private\n * To calculate axes bounds\n */\n LinearGauge.prototype.calculateBounds = function () {\n this.gaugeAxisLayoutPanel.calculateAxesBounds();\n };\n /**\n * @private\n * To render axis elements\n */\n LinearGauge.prototype.renderAxisElements = function () {\n this.axisRenderer.renderAxes();\n this.element.appendChild(this.svgObject);\n if (this.annotationsModule) {\n this.annotationsModule.renderAnnotationElements();\n }\n };\n LinearGauge.prototype.renderBorder = function () {\n var width = this.border.width;\n if (width > 0) {\n var rect = new RectOption(this.element.id + '_LinearGaugeBorder', this.background || this.themeStyle.backgroundColor, this.border, 1, new Rect(width / 2, width / 2, this.availableSize.width - width, this.availableSize.height - width), null, null);\n this.svgObject.appendChild(this.renderer.drawRectangle(rect));\n }\n };\n LinearGauge.prototype.renderTitle = function () {\n var x;\n var y;\n var height;\n var width;\n var titleBounds;\n var size = measureText(this.title, this.titleStyle);\n var options = new TextOption(this.element.id + '_LinearGaugeTitle', this.availableSize.width / 2, this.margin.top + (size.height / 2), 'middle', this.title);\n titleBounds = {\n x: options.x - (size.width / 2),\n y: options.y,\n width: size.width,\n height: size.height\n };\n x = this.margin.left;\n y = (isNullOrUndefined(titleBounds)) ? this.margin.top : titleBounds.y;\n height = (this.availableSize.height - y - this.margin.bottom);\n width = (this.availableSize.width - this.margin.left - this.margin.right);\n this.actualRect = { x: x, y: y, width: width, height: height };\n this.renderArea();\n if (this.title) {\n this.titleStyle.fontFamily = this.themeStyle.fontFamily || this.titleStyle.fontFamily;\n this.titleStyle.size = this.themeStyle.fontSize || this.titleStyle.size;\n var element = textElement(options, this.titleStyle, this.titleStyle.color || this.themeStyle.titleFontColor, this.svgObject);\n element.setAttribute('aria-label', this.description || this.title);\n element.setAttribute('tabindex', this.tabIndex.toString());\n }\n };\n /*\n * Method to unbind the gauge events\n */\n LinearGauge.prototype.unWireEvents = function () {\n EventHandler.remove(this.element, Browser.touchStartEvent, this.gaugeOnMouseDown);\n EventHandler.remove(this.element, Browser.touchMoveEvent, this.mouseMove);\n EventHandler.remove(this.element, Browser.touchEndEvent, this.mouseEnd);\n EventHandler.remove(this.element, 'contextmenu', this.gaugeRightClick);\n EventHandler.remove(this.element, (Browser.isPointer ? 'pointerleave' : 'mouseleave'), this.mouseLeave);\n EventHandler.remove(window, (Browser.isTouch && ('orientation' in window && 'onorientationchange' in window)) ? 'orientationchange' : 'resize', this.gaugeResize.bind(this));\n };\n /*\n * Method to bind the gauge events\n */\n LinearGauge.prototype.wireEvents = function () {\n /*! Bind the Event handler */\n EventHandler.add(this.element, Browser.touchStartEvent, this.gaugeOnMouseDown, this);\n EventHandler.add(this.element, Browser.touchMoveEvent, this.mouseMove, this);\n EventHandler.add(this.element, Browser.touchEndEvent, this.mouseEnd, this);\n EventHandler.add(this.element, 'contextmenu', this.gaugeRightClick, this);\n EventHandler.add(this.element, (Browser.isPointer ? 'pointerleave' : 'mouseleave'), this.mouseLeave, this);\n EventHandler.add(window, (Browser.isTouch && ('orientation' in window && 'onorientationchange' in window)) ? 'orientationchange' : 'resize', this.gaugeResize, this);\n this.setStyle(this.element);\n };\n LinearGauge.prototype.setStyle = function (element) {\n element.style.touchAction = isPointerDrag(this.axes) ? 'none' : 'element';\n element.style.msTouchAction = isPointerDrag(this.axes) ? 'none' : 'element';\n element.style.msContentZooming = 'none';\n element.style.msUserSelect = 'none';\n element.style.webkitUserSelect = 'none';\n element.style.position = 'relative';\n };\n /**\n * Handles the gauge resize.\n * @return {boolean}\n * @private\n */\n LinearGauge.prototype.gaugeResize = function (e) {\n var _this = this;\n var args = {\n gauge: this,\n previousSize: new Size(this.availableSize.width, this.availableSize.height),\n name: resized,\n currentSize: new Size(0, 0)\n };\n if (this.resizeTo) {\n clearTimeout(this.resizeTo);\n }\n if (this.element.classList.contains('e-lineargauge')) {\n this.resizeTo = setTimeout(function () {\n _this.gaugeResized = true;\n _this.createSvg();\n _this.refreshing = true;\n args.currentSize = new Size(_this.availableSize.width, _this.availableSize.height);\n _this.trigger(resized, args);\n _this.render();\n }, 500);\n }\n return false;\n };\n /**\n * To destroy the gauge element from the DOM.\n */\n LinearGauge.prototype.destroy = function () {\n this.unWireEvents();\n this.removeSvg();\n _super.prototype.destroy.call(this);\n };\n /**\n * @private\n * To render the gauge container\n */\n LinearGauge.prototype.renderContainer = function () {\n var width;\n var height;\n var x;\n var y;\n var options;\n var path = '';\n var topRadius;\n var bottomRadius;\n var fill = (this.container.backgroundColor !== 'transparent'\n || (this.theme !== 'Bootstrap4' && this.theme !== 'Material'))\n ? this.container.backgroundColor : this.themeStyle.containerBackground;\n var rect;\n var radius = this.container.width;\n bottomRadius = radius + ((radius / 2) / Math.PI);\n topRadius = radius / 2;\n if (this.orientation === 'Vertical') {\n height = this.actualRect.height;\n height = (this.container.height > 0 ? this.container.height : ((height / 2) - ((height / 2) / 4)) * 2);\n width = this.container.width;\n height = (this.container.type === 'Thermometer') ? height - (bottomRadius * 2) - topRadius : height;\n x = (this.actualRect.x + ((this.actualRect.width / 2) - (this.container.width / 2))) + this.container.offset;\n y = this.actualRect.y + ((this.actualRect.height / 2) - ((this.container.type === 'Thermometer') ?\n ((height + (bottomRadius * 2) - topRadius)) / 2 : height / 2));\n height = height;\n }\n else {\n width = (this.container.height > 0) ? this.container.height :\n ((this.actualRect.width / 2) - ((this.actualRect.width / 2) / 4)) * 2;\n width = (this.container.type === 'Thermometer') ? width - (bottomRadius * 2) - topRadius : width;\n x = this.actualRect.x + ((this.actualRect.width / 2) - ((this.container.type === 'Thermometer') ?\n (width - (bottomRadius * 2) + topRadius) / 2 : width / 2));\n y = (this.actualRect.y + ((this.actualRect.height / 2) - (this.container.width / 2))) + this.container.offset;\n height = this.container.width;\n }\n this.containerBounds = { x: x, y: y, width: width, height: height };\n if (this.containerBounds.width > 0) {\n this.containerObject = this.renderer.createGroup({ id: this.element.id + '_Container_Group', transform: 'translate( 0, 0)' });\n if (this.container.type === 'Normal') {\n rect = new RectOption(this.element.id + '_' + this.container.type + '_Layout', fill, this.container.border, 1, new Rect(x, y, width, height));\n this.containerObject.appendChild(this.renderer.drawRectangle(rect));\n }\n else {\n path = getBox(this.containerBounds, this.container.type, this.orientation, new Size(this.container.height, this.container.width), 'container', null, null, this.container.roundedCornerRadius);\n options = new PathOption(this.element.id + '_' + this.container.type + '_Layout', fill, this.container.border.width, this.container.border.color, 1, '', path);\n this.containerObject.appendChild(this.renderer.drawPath(options));\n }\n this.svgObject.appendChild(this.containerObject);\n }\n };\n /**\n * Handles the mouse down on gauge.\n * @return {boolean}\n * @private\n */\n LinearGauge.prototype.gaugeOnMouseDown = function (e) {\n var pageX;\n var pageY;\n var target;\n var element = e.target;\n var split = [];\n var clientRect = this.element.getBoundingClientRect();\n var axis;\n var isPointer = false;\n var pointer;\n var current;\n var top;\n var left;\n var pointerElement;\n var svgPath;\n var dragProcess = false;\n var args = this.getMouseArgs(e, 'touchstart', gaugeMouseDown);\n this.trigger(gaugeMouseDown, args);\n this.mouseX = args.x;\n this.mouseY = args.y;\n if (args.target) {\n if (!args.cancel && ((args.target.id.indexOf('MarkerPointer') > -1) || (args.target.id.indexOf('BarPointer') > -1))) {\n current = this.moveOnPointer(args.target);\n if (!(isNullOrUndefined(current)) && current.pointer) {\n this.pointerDrag = true;\n this.mouseElement = args.target;\n }\n }\n }\n return true;\n };\n /**\n * Handles the mouse move.\n * @return {boolean}\n * @private\n */\n LinearGauge.prototype.mouseMove = function (e) {\n var current;\n var element;\n var args = this.getMouseArgs(e, 'touchmove', gaugeMouseMove);\n this.trigger(gaugeMouseMove, args);\n this.mouseX = args.x;\n this.mouseY = args.y;\n if (args.target && !args.cancel) {\n if ((args.target.id.indexOf('MarkerPointer') > -1) || (args.target.id.indexOf('BarPointer') > -1)) {\n current = this.moveOnPointer(args.target);\n if (!(isNullOrUndefined(current)) && current.pointer) {\n this.element.style.cursor = current.style;\n }\n }\n else {\n this.element.style.cursor = (this.pointerDrag) ? this.element.style.cursor : 'auto';\n }\n this.gaugeOnMouseMove(e);\n }\n this.notify(Browser.touchMoveEvent, e);\n return false;\n };\n /**\n * To find the mouse move on pointer.\n * @param element\n */\n LinearGauge.prototype.moveOnPointer = function (element) {\n var current;\n var clientRect = this.element.getBoundingClientRect();\n var axis;\n var isPointer = false;\n var pointer;\n var top;\n var left;\n var pointerElement = getElement(element.id);\n var svgPath = pointerElement;\n var cursorStyle;\n var process;\n current = getPointer(element, this);\n axis = current.axis;\n pointer = current.pointer;\n if (pointer.enableDrag) {\n if (pointer.type === 'Bar') {\n if (this.orientation === 'Vertical') {\n top = pointerElement.getBoundingClientRect().top - clientRect.top;\n top = (!axis.isInversed) ? top : top + svgPath.getBBox().height;\n isPointer = !axis.isInversed ? (this.mouseY < (top + 10) && this.mouseY >= top) :\n (this.mouseY <= top && this.mouseY > (top - 10));\n cursorStyle = 'n-resize';\n }\n else {\n left = pointerElement.getBoundingClientRect().left - clientRect.left;\n left = (!axis.isInversed) ? left + svgPath.getBBox().width : left;\n isPointer = !axis.isInversed ? (this.mouseX > (left - 10) && this.mouseX <= left) :\n (this.mouseX >= left && this.mouseX < (left + 10));\n cursorStyle = 'e-resize';\n }\n }\n else {\n isPointer = true;\n cursorStyle = 'pointer';\n }\n }\n if (isPointer) {\n process = { pointer: isPointer, style: cursorStyle };\n }\n return process;\n };\n /**\n * @private\n * Handle the right click\n * @param event\n */\n LinearGauge.prototype.gaugeRightClick = function (event) {\n if (event.buttons === 2 || event.pointerType === 'touch') {\n event.preventDefault();\n event.stopPropagation();\n return false;\n }\n return true;\n };\n /**\n * Handles the mouse leave.\n * @return {boolean}\n * @private\n */\n LinearGauge.prototype.mouseLeave = function (e) {\n var parentNode;\n var args = this.getMouseArgs(e, 'touchmove', gaugeMouseLeave);\n if (!isNullOrUndefined(this.mouseElement)) {\n parentNode = this.element;\n parentNode.style.cursor = '';\n this.mouseElement = null;\n this.pointerDrag = false;\n }\n return false;\n };\n /**\n * Handles the mouse move on gauge.\n * @return {boolean}\n * @private\n */\n LinearGauge.prototype.gaugeOnMouseMove = function (e) {\n var current;\n if (this.pointerDrag) {\n current = getPointer(this.mouseElement, this);\n if (current.pointer.enableDrag && current.pointer.animationComplete) {\n this[current.pointer.type.toLowerCase() + 'Drag'](current.axis, current.pointer);\n }\n }\n return true;\n };\n /**\n * Handles the mouse up.\n * @return {boolean}\n * @private\n */\n LinearGauge.prototype.mouseEnd = function (e) {\n var parentNode;\n var tooltipInterval;\n var isTouch = e.pointerType === 'touch' || e.pointerType === '2' || e.type === 'touchend';\n var args = this.getMouseArgs(e, 'touchend', gaugeMouseUp);\n this.trigger(gaugeMouseUp, args);\n if (!isNullOrUndefined(this.mouseElement)) {\n parentNode = this.element;\n parentNode.style.cursor = '';\n this.mouseElement = null;\n this.pointerDrag = false;\n }\n this.notify(Browser.touchEndEvent, e);\n return true;\n };\n /**\n * Handles the mouse event arguments.\n * @return {IMouseEventArgs}\n * @private\n */\n LinearGauge.prototype.getMouseArgs = function (e, type, name) {\n var rect = this.element.getBoundingClientRect();\n var location = new GaugeLocation(-rect.left, -rect.top);\n var isTouch = (e.type === type);\n location.x += isTouch ? e.changedTouches[0].clientX : e.clientX;\n location.y += isTouch ? e.changedTouches[0].clientY : e.clientY;\n return {\n cancel: false, name: name,\n model: this,\n x: location.x, y: location.y,\n target: isTouch ? e.target : e.target\n };\n };\n /**\n * @private\n * @param axis\n * @param pointer\n */\n LinearGauge.prototype.markerDrag = function (axis, pointer) {\n var options;\n var value = convertPixelToValue(this.element, this.mouseElement, this.orientation, axis, 'drag', new GaugeLocation(this.mouseX, this.mouseY));\n var process = withInRange(value, null, null, axis.visibleRange.max, axis.visibleRange.min, 'pointer');\n if (withInRange(value, null, null, axis.visibleRange.max, axis.visibleRange.min, 'pointer')) {\n this.triggerDragEvent(this.mouseElement);\n options = new PathOption('pointerID', pointer.color || this.themeStyle.pointerColor, pointer.border.width, pointer.border.color, pointer.opacity, null, null, '');\n if (this.orientation === 'Vertical') {\n pointer.bounds.y = this.mouseY;\n }\n else {\n pointer.bounds.x = this.mouseX;\n }\n pointer.currentValue = value;\n options = calculateShapes(pointer.bounds, pointer.markerType, new Size(pointer.width, pointer.height), pointer.imageUrl, options, this.orientation, axis, pointer);\n if (pointer.markerType === 'Image') {\n this.mouseElement.setAttribute('x', (pointer.bounds.x - (pointer.bounds.width / 2)).toString());\n this.mouseElement.setAttribute('y', (pointer.bounds.y - (pointer.bounds.height / 2)).toString());\n }\n else {\n this.mouseElement.setAttribute('d', options.d);\n }\n }\n };\n /**\n * @private\n * @param axis\n * @param pointer\n */\n LinearGauge.prototype.barDrag = function (axis, pointer) {\n var line = axis.lineBounds;\n var range = axis.visibleRange;\n var value1;\n var value2;\n var isDrag;\n var lineHeight = (this.orientation === 'Vertical') ? line.height : line.width;\n var lineY = (this.orientation === 'Vertical') ? line.y : line.x;\n var path;\n value1 = ((valueToCoefficient(range.min, axis, this.orientation, range) * lineHeight) + lineY);\n value2 = ((valueToCoefficient(range.max, axis, this.orientation, range) * lineHeight) + lineY);\n if (this.orientation === 'Vertical') {\n isDrag = (!axis.isInversed) ? (this.mouseY > value2 && this.mouseY < value1) : (this.mouseY > value1 && this.mouseY < value2);\n if (isDrag) {\n if (this.container.type === 'Normal') {\n if (!axis.isInversed) {\n this.mouseElement.setAttribute('y', this.mouseY.toString());\n }\n this.mouseElement.setAttribute('height', Math.abs(value1 - this.mouseY).toString());\n }\n else {\n if (!axis.isInversed) {\n pointer.bounds.y = this.mouseY;\n }\n pointer.bounds.height = Math.abs(value1 - this.mouseY);\n }\n }\n }\n else {\n isDrag = (!axis.isInversed) ? (this.mouseX > value1 && this.mouseX < value2) : (this.mouseX > value2 && this.mouseX < value1);\n if (isDrag) {\n if (this.container.type === 'Normal') {\n if (axis.isInversed) {\n this.mouseElement.setAttribute('x', this.mouseX.toString());\n }\n this.mouseElement.setAttribute('width', Math.abs(value1 - this.mouseX).toString());\n }\n else {\n if (axis.isInversed) {\n pointer.bounds.x = this.mouseX;\n }\n pointer.bounds.width = Math.abs(value1 - this.mouseX);\n }\n }\n }\n if (isDrag && this.mouseElement.tagName === 'path') {\n this.triggerDragEvent(this.mouseElement);\n path = getBox(pointer.bounds, this.container.type, this.orientation, new Size(pointer.bounds.width, pointer.bounds.height), 'bar', this.container.width, axis, pointer.roundedCornerRadius);\n this.mouseElement.setAttribute('d', path);\n }\n };\n /**\n * Triggers when drag the pointer\n * @param activeElement\n */\n LinearGauge.prototype.triggerDragEvent = function (activeElement) {\n var active = getPointer(this.mouseElement, this);\n var value = convertPixelToValue(this.element, this.mouseElement, this.orientation, active.axis, 'tooltip', null);\n var dragArgs = {\n name: 'valueChange',\n gauge: this,\n element: this.mouseElement,\n axisIndex: active.axisIndex,\n axis: active.axis,\n pointerIndex: active.pointerIndex,\n pointer: active.pointer,\n value: value\n };\n this.trigger(valueChange, dragArgs);\n };\n /**\n * To set the pointer value using this method\n * @param axisIndex\n * @param pointerIndex\n * @param value\n */\n LinearGauge.prototype.setPointerValue = function (axisIndex, pointerIndex, value) {\n var axis = this.axes[axisIndex];\n var pointer = axis.pointers[pointerIndex];\n var id = this.element.id + '_AxisIndex_' + axisIndex + '_' + pointer.type + 'Pointer_' + pointerIndex;\n var pointerElement = getElement(id);\n pointer.currentValue = value;\n if ((pointerElement !== null) && withInRange(pointer.currentValue, null, null, axis.visibleRange.max, axis.visibleRange.min, 'pointer')) {\n this.gaugeAxisLayoutPanel['calculate' + pointer.type + 'Bounds'](axisIndex, axis, pointerIndex, pointer);\n this.axisRenderer['draw' + pointer.type + 'Pointer'](axis, axisIndex, pointer, pointerIndex, pointerElement.parentElement);\n }\n };\n /**\n * To set the annotation value using this method.\n * @param annotationIndex\n * @param content\n */\n LinearGauge.prototype.setAnnotationValue = function (annotationIndex, content, axisValue) {\n var elementExist = getElement(this.element.id + '_Annotation_' + annotationIndex) === null;\n var element = getElement(this.element.id + '_AnnotationsGroup') ||\n createElement('div', {\n id: this.element.id + '_AnnotationsGroup'\n });\n var annotation = this.annotations[annotationIndex];\n if (content !== null) {\n removeElement(this.element.id + '_Annotation_' + annotationIndex);\n annotation.content = content;\n annotation.axisValue = axisValue ? axisValue : annotation.axisValue;\n this.annotationsModule.createAnnotationTemplate(element, annotationIndex);\n if (!elementExist) {\n element.appendChild(getElement(this.element.id + '_Annotation_' + annotationIndex));\n }\n }\n };\n /**\n * To provide the array of modules needed for control rendering\n * @return {ModuleDeclaration[]}\n * @private\n */\n LinearGauge.prototype.requiredModules = function () {\n var modules = [];\n var annotationEnable = false;\n var tooltipEnable = false;\n this.annotations.map(function (annotation, index) {\n annotationEnable = annotation.content != null;\n });\n if (annotationEnable) {\n modules.push({\n member: 'Annotations',\n args: [this, Annotations]\n });\n }\n if (this.tooltip.enable) {\n modules.push({\n member: 'Tooltip',\n args: [this, GaugeTooltip]\n });\n }\n return modules;\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @private\n */\n LinearGauge.prototype.getPersistData = function () {\n var keyEntity = ['loaded'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Get component name\n */\n LinearGauge.prototype.getModuleName = function () {\n return 'lineargauge';\n };\n /**\n * Called internally if any of the property value changed.\n * @private\n */\n LinearGauge.prototype.onPropertyChanged = function (newProp, oldProp) {\n var renderer = false;\n var refreshBounds = false;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'height':\n case 'width':\n case 'margin':\n this.createSvg();\n refreshBounds = true;\n break;\n case 'title':\n refreshBounds = (newProp.title === '' || oldProp.title === '');\n renderer = !(newProp.title === '' || oldProp.title === '');\n break;\n case 'titleStyle':\n if (newProp.titleStyle && newProp.titleStyle.size) {\n refreshBounds = true;\n }\n else {\n renderer = true;\n }\n break;\n case 'border':\n renderer = true;\n break;\n case 'background':\n renderer = true;\n break;\n case 'container':\n refreshBounds = true;\n break;\n case 'axes':\n refreshBounds = true;\n break;\n }\n }\n if (!refreshBounds && renderer) {\n this.removeSvg();\n this.renderGaugeElements();\n this.renderAxisElements();\n }\n if (refreshBounds) {\n this.createSvg();\n this.renderGaugeElements();\n this.calculateBounds();\n this.renderAxisElements();\n }\n };\n __decorate([\n Property(null)\n ], LinearGauge.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], LinearGauge.prototype, \"height\", void 0);\n __decorate([\n Property('Vertical')\n ], LinearGauge.prototype, \"orientation\", void 0);\n __decorate([\n Complex({}, Margin)\n ], LinearGauge.prototype, \"margin\", void 0);\n __decorate([\n Complex({ color: '', width: 0 }, Border)\n ], LinearGauge.prototype, \"border\", void 0);\n __decorate([\n Property(null)\n ], LinearGauge.prototype, \"background\", void 0);\n __decorate([\n Property('')\n ], LinearGauge.prototype, \"title\", void 0);\n __decorate([\n Complex({ size: '15px', color: null }, Font)\n ], LinearGauge.prototype, \"titleStyle\", void 0);\n __decorate([\n Complex({}, Container)\n ], LinearGauge.prototype, \"container\", void 0);\n __decorate([\n Collection([{}], Axis)\n ], LinearGauge.prototype, \"axes\", void 0);\n __decorate([\n Complex({}, TooltipSettings)\n ], LinearGauge.prototype, \"tooltip\", void 0);\n __decorate([\n Collection([{}], Annotation)\n ], LinearGauge.prototype, \"annotations\", void 0);\n __decorate([\n Property([])\n ], LinearGauge.prototype, \"rangePalettes\", void 0);\n __decorate([\n Property(false)\n ], LinearGauge.prototype, \"useGroupingSeparator\", void 0);\n __decorate([\n Property(null)\n ], LinearGauge.prototype, \"description\", void 0);\n __decorate([\n Property(1)\n ], LinearGauge.prototype, \"tabIndex\", void 0);\n __decorate([\n Property(null)\n ], LinearGauge.prototype, \"format\", void 0);\n __decorate([\n Property('Material')\n ], LinearGauge.prototype, \"theme\", void 0);\n __decorate([\n Event()\n ], LinearGauge.prototype, \"loaded\", void 0);\n __decorate([\n Event()\n ], LinearGauge.prototype, \"load\", void 0);\n __decorate([\n Event()\n ], LinearGauge.prototype, \"animationComplete\", void 0);\n __decorate([\n Event()\n ], LinearGauge.prototype, \"axisLabelRender\", void 0);\n __decorate([\n Event()\n ], LinearGauge.prototype, \"annotationRender\", void 0);\n __decorate([\n Event()\n ], LinearGauge.prototype, \"tooltipRender\", void 0);\n __decorate([\n Event()\n ], LinearGauge.prototype, \"gaugeMouseMove\", void 0);\n __decorate([\n Event()\n ], LinearGauge.prototype, \"gaugeMouseLeave\", void 0);\n __decorate([\n Event()\n ], LinearGauge.prototype, \"gaugeMouseDown\", void 0);\n __decorate([\n Event()\n ], LinearGauge.prototype, \"gaugeMouseUp\", void 0);\n __decorate([\n Event()\n ], LinearGauge.prototype, \"valueChange\", void 0);\n __decorate([\n Event()\n ], LinearGauge.prototype, \"resized\", void 0);\n LinearGauge = __decorate([\n NotifyPropertyChanges\n ], LinearGauge);\n return LinearGauge;\n}(Component));\nexport { LinearGauge };\n","import * as index from '@syncfusion/ej2-lineargauge';\nindex.LinearGauge.Inject( index.GaugeTooltip,index.Annotations);\nexport * from '@syncfusion/ej2-lineargauge';\n","import * as index from '@syncfusion/ej2-lists';\nindex.ListView.Inject( index.Virtualization);\nexport * from '@syncfusion/ej2-lists';\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n/**\n * Maps base document\n */\nimport { Property, ChildProperty, Complex, Collection } from '@syncfusion/ej2-base';\nimport { Theme } from './theme';\nimport { Point } from '../utils/helper';\n/**\n * Options for customizing the annotation.\n */\nvar Annotation = /** @class */ (function (_super) {\n __extends(Annotation, _super);\n function Annotation() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], Annotation.prototype, \"content\", void 0);\n __decorate([\n Property('0px')\n ], Annotation.prototype, \"x\", void 0);\n __decorate([\n Property('0px')\n ], Annotation.prototype, \"y\", void 0);\n __decorate([\n Property('None')\n ], Annotation.prototype, \"verticalAlignment\", void 0);\n __decorate([\n Property('None')\n ], Annotation.prototype, \"horizontalAlignment\", void 0);\n __decorate([\n Property('-1')\n ], Annotation.prototype, \"zIndex\", void 0);\n return Annotation;\n}(ChildProperty));\nexport { Annotation };\nvar Arrow = /** @class */ (function (_super) {\n __extends(Arrow, _super);\n function Arrow() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Start')\n ], Arrow.prototype, \"position\", void 0);\n __decorate([\n Property('false')\n ], Arrow.prototype, \"showArrow\", void 0);\n __decorate([\n Property(2)\n ], Arrow.prototype, \"size\", void 0);\n __decorate([\n Property('black')\n ], Arrow.prototype, \"color\", void 0);\n __decorate([\n Property(0)\n ], Arrow.prototype, \"offSet\", void 0);\n return Arrow;\n}(ChildProperty));\nexport { Arrow };\n/**\n * Configures the fonts in maps.\n */\nvar Font = /** @class */ (function (_super) {\n __extends(Font, _super);\n function Font() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('12px')\n ], Font.prototype, \"size\", void 0);\n __decorate([\n Property(null)\n ], Font.prototype, \"color\", void 0);\n __decorate([\n Property('Roboto, Noto, Sans-serif')\n ], Font.prototype, \"fontFamily\", void 0);\n __decorate([\n Property('Medium')\n ], Font.prototype, \"fontWeight\", void 0);\n __decorate([\n Property('Medium')\n ], Font.prototype, \"fontStyle\", void 0);\n __decorate([\n Property(1)\n ], Font.prototype, \"opacity\", void 0);\n return Font;\n}(ChildProperty));\nexport { Font };\n/**\n * Configures the borders in the maps.\n */\nvar Border = /** @class */ (function (_super) {\n __extends(Border, _super);\n function Border() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], Border.prototype, \"color\", void 0);\n __decorate([\n Property(0)\n ], Border.prototype, \"width\", void 0);\n return Border;\n}(ChildProperty));\nexport { Border };\n/**\n * To configure the tooltip settings of the maps.\n */\nvar TooltipSettings = /** @class */ (function (_super) {\n __extends(TooltipSettings, _super);\n function TooltipSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], TooltipSettings.prototype, \"visible\", void 0);\n __decorate([\n Property('')\n ], TooltipSettings.prototype, \"template\", void 0);\n __decorate([\n Property('')\n ], TooltipSettings.prototype, \"fill\", void 0);\n __decorate([\n Complex({ color: 'transparent', width: 1 }, Border)\n ], TooltipSettings.prototype, \"border\", void 0);\n __decorate([\n Complex(Theme.tooltipLabelFont, Font)\n ], TooltipSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property(null)\n ], TooltipSettings.prototype, \"format\", void 0);\n __decorate([\n Property(null)\n ], TooltipSettings.prototype, \"valuePath\", void 0);\n return TooltipSettings;\n}(ChildProperty));\nexport { TooltipSettings };\n/**\n * Configures the maps margins.\n */\nvar Margin = /** @class */ (function (_super) {\n __extends(Margin, _super);\n function Margin() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(10)\n ], Margin.prototype, \"left\", void 0);\n __decorate([\n Property(10)\n ], Margin.prototype, \"right\", void 0);\n __decorate([\n Property(10)\n ], Margin.prototype, \"top\", void 0);\n __decorate([\n Property(10)\n ], Margin.prototype, \"bottom\", void 0);\n return Margin;\n}(ChildProperty));\nexport { Margin };\n/**\n * To configure ColorMapping in Maps\n */\nvar ColorMappingSettings = /** @class */ (function (_super) {\n __extends(ColorMappingSettings, _super);\n function ColorMappingSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], ColorMappingSettings.prototype, \"from\", void 0);\n __decorate([\n Property(null)\n ], ColorMappingSettings.prototype, \"to\", void 0);\n __decorate([\n Property(null)\n ], ColorMappingSettings.prototype, \"value\", void 0);\n __decorate([\n Property(null)\n ], ColorMappingSettings.prototype, \"color\", void 0);\n __decorate([\n Property(null)\n ], ColorMappingSettings.prototype, \"minOpacity\", void 0);\n __decorate([\n Property(null)\n ], ColorMappingSettings.prototype, \"maxOpacity\", void 0);\n __decorate([\n Property(null)\n ], ColorMappingSettings.prototype, \"label\", void 0);\n __decorate([\n Property(true)\n ], ColorMappingSettings.prototype, \"showLegend\", void 0);\n return ColorMappingSettings;\n}(ChildProperty));\nexport { ColorMappingSettings };\n/**\n * To configure the selection settings\n */\nvar SelectionSettings = /** @class */ (function (_super) {\n __extends(SelectionSettings, _super);\n function SelectionSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], SelectionSettings.prototype, \"enable\", void 0);\n __decorate([\n Property('#D2691E')\n ], SelectionSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(1)\n ], SelectionSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property(false)\n ], SelectionSettings.prototype, \"enableMultiSelect\", void 0);\n __decorate([\n Complex({ color: 'transparent', width: 0 }, Border)\n ], SelectionSettings.prototype, \"border\", void 0);\n return SelectionSettings;\n}(ChildProperty));\nexport { SelectionSettings };\n/**\n * To configure the highlight settings\n */\nvar HighlightSettings = /** @class */ (function (_super) {\n __extends(HighlightSettings, _super);\n function HighlightSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('#6B8E23')\n ], HighlightSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(false)\n ], HighlightSettings.prototype, \"enable\", void 0);\n __decorate([\n Property(1)\n ], HighlightSettings.prototype, \"opacity\", void 0);\n __decorate([\n Complex({ color: 'transparent', width: 0 }, Border)\n ], HighlightSettings.prototype, \"border\", void 0);\n return HighlightSettings;\n}(ChildProperty));\nexport { HighlightSettings };\n/**\n * NavigationSelectedLine\n */\nvar NavigationLineSettings = /** @class */ (function (_super) {\n __extends(NavigationLineSettings, _super);\n function NavigationLineSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], NavigationLineSettings.prototype, \"visible\", void 0);\n __decorate([\n Property(1)\n ], NavigationLineSettings.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], NavigationLineSettings.prototype, \"longitude\", void 0);\n __decorate([\n Property(null)\n ], NavigationLineSettings.prototype, \"latitude\", void 0);\n __decorate([\n Property('')\n ], NavigationLineSettings.prototype, \"dashArray\", void 0);\n __decorate([\n Property('black')\n ], NavigationLineSettings.prototype, \"color\", void 0);\n __decorate([\n Property(0)\n ], NavigationLineSettings.prototype, \"angle\", void 0);\n __decorate([\n Complex({ showArrow: false, position: 'Start', size: 5, color: 'black' }, Arrow)\n ], NavigationLineSettings.prototype, \"arrowSettings\", void 0);\n __decorate([\n Complex({}, SelectionSettings)\n ], NavigationLineSettings.prototype, \"selectionSettings\", void 0);\n __decorate([\n Complex({}, HighlightSettings)\n ], NavigationLineSettings.prototype, \"highlightSettings\", void 0);\n return NavigationLineSettings;\n}(ChildProperty));\nexport { NavigationLineSettings };\n/**\n * Bubble settings model class\n */\nvar BubbleSettings = /** @class */ (function (_super) {\n __extends(BubbleSettings, _super);\n function BubbleSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Complex({}, Border)\n ], BubbleSettings.prototype, \"border\", void 0);\n __decorate([\n Property(false)\n ], BubbleSettings.prototype, \"visible\", void 0);\n __decorate([\n Property([])\n ], BubbleSettings.prototype, \"dataSource\", void 0);\n __decorate([\n Property(1000)\n ], BubbleSettings.prototype, \"animationDuration\", void 0);\n __decorate([\n Property(0)\n ], BubbleSettings.prototype, \"animationDelay\", void 0);\n __decorate([\n Property('')\n ], BubbleSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(10)\n ], BubbleSettings.prototype, \"minRadius\", void 0);\n __decorate([\n Property(20)\n ], BubbleSettings.prototype, \"maxRadius\", void 0);\n __decorate([\n Property(1)\n ], BubbleSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property(null)\n ], BubbleSettings.prototype, \"valuePath\", void 0);\n __decorate([\n Property('Circle')\n ], BubbleSettings.prototype, \"bubbleType\", void 0);\n __decorate([\n Property(null)\n ], BubbleSettings.prototype, \"colorValuePath\", void 0);\n __decorate([\n Collection([], ColorMappingSettings)\n ], BubbleSettings.prototype, \"colorMapping\", void 0);\n __decorate([\n Complex({}, TooltipSettings)\n ], BubbleSettings.prototype, \"tooltipSettings\", void 0);\n __decorate([\n Complex({}, SelectionSettings)\n ], BubbleSettings.prototype, \"selectionSettings\", void 0);\n __decorate([\n Complex({}, HighlightSettings)\n ], BubbleSettings.prototype, \"highlightSettings\", void 0);\n return BubbleSettings;\n}(ChildProperty));\nexport { BubbleSettings };\n/**\n * To configure title of the maps.\n */\nvar CommonTitleSettings = /** @class */ (function (_super) {\n __extends(CommonTitleSettings, _super);\n function CommonTitleSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], CommonTitleSettings.prototype, \"text\", void 0);\n __decorate([\n Property('')\n ], CommonTitleSettings.prototype, \"description\", void 0);\n return CommonTitleSettings;\n}(ChildProperty));\nexport { CommonTitleSettings };\n/**\n * To configure subtitle of the maps.\n */\nvar SubTitleSettings = /** @class */ (function (_super) {\n __extends(SubTitleSettings, _super);\n function SubTitleSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Complex({ size: Theme.mapsSubTitleFont.size }, Font)\n ], SubTitleSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property('Center')\n ], SubTitleSettings.prototype, \"alignment\", void 0);\n return SubTitleSettings;\n}(CommonTitleSettings));\nexport { SubTitleSettings };\n/**\n * To configure title of the maps.\n */\nvar TitleSettings = /** @class */ (function (_super) {\n __extends(TitleSettings, _super);\n function TitleSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Complex({ size: Theme.mapsTitleFont.size }, Font)\n ], TitleSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property('Center')\n ], TitleSettings.prototype, \"alignment\", void 0);\n __decorate([\n Complex({}, SubTitleSettings)\n ], TitleSettings.prototype, \"subtitleSettings\", void 0);\n return TitleSettings;\n}(CommonTitleSettings));\nexport { TitleSettings };\n/**\n * Options to configure maps Zooming Settings.\n */\nvar ZoomSettings = /** @class */ (function (_super) {\n __extends(ZoomSettings, _super);\n function ZoomSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], ZoomSettings.prototype, \"enable\", void 0);\n __decorate([\n Property('Horizontal')\n ], ZoomSettings.prototype, \"toolBarOrientation\", void 0);\n __decorate([\n Property(null)\n ], ZoomSettings.prototype, \"color\", void 0);\n __decorate([\n Property('#e61576')\n ], ZoomSettings.prototype, \"highlightColor\", void 0);\n __decorate([\n Property('#e61576')\n ], ZoomSettings.prototype, \"selectionColor\", void 0);\n __decorate([\n Property('Far')\n ], ZoomSettings.prototype, \"horizontalAlignment\", void 0);\n __decorate([\n Property('Near')\n ], ZoomSettings.prototype, \"verticalAlignment\", void 0);\n __decorate([\n Property(['ZoomIn', 'ZoomOut', 'Reset'])\n ], ZoomSettings.prototype, \"toolbars\", void 0);\n __decorate([\n Property(true)\n ], ZoomSettings.prototype, \"mouseWheelZoom\", void 0);\n __decorate([\n Property(false)\n ], ZoomSettings.prototype, \"doubleClickZoom\", void 0);\n __decorate([\n Property(false)\n ], ZoomSettings.prototype, \"pinchZooming\", void 0);\n __decorate([\n Property(false)\n ], ZoomSettings.prototype, \"zoomOnClick\", void 0);\n __decorate([\n Property(1)\n ], ZoomSettings.prototype, \"zoomFactor\", void 0);\n __decorate([\n Property(10)\n ], ZoomSettings.prototype, \"maxZoom\", void 0);\n __decorate([\n Property(1)\n ], ZoomSettings.prototype, \"minZoom\", void 0);\n return ZoomSettings;\n}(ChildProperty));\nexport { ZoomSettings };\n/**\n * Configures the legend settings.\n */\nvar LegendSettings = /** @class */ (function (_super) {\n __extends(LegendSettings, _super);\n function LegendSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], LegendSettings.prototype, \"toggleVisibility\", void 0);\n __decorate([\n Property(false)\n ], LegendSettings.prototype, \"visible\", void 0);\n __decorate([\n Property('transparent')\n ], LegendSettings.prototype, \"background\", void 0);\n __decorate([\n Property('Layers')\n ], LegendSettings.prototype, \"type\", void 0);\n __decorate([\n Property(false)\n ], LegendSettings.prototype, \"invertedPointer\", void 0);\n __decorate([\n Property('After')\n ], LegendSettings.prototype, \"labelPosition\", void 0);\n __decorate([\n Property('None')\n ], LegendSettings.prototype, \"labelDisplayMode\", void 0);\n __decorate([\n Property('Circle')\n ], LegendSettings.prototype, \"shape\", void 0);\n __decorate([\n Property('')\n ], LegendSettings.prototype, \"width\", void 0);\n __decorate([\n Property('')\n ], LegendSettings.prototype, \"height\", void 0);\n __decorate([\n Complex({}, Font)\n ], LegendSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property(15)\n ], LegendSettings.prototype, \"shapeWidth\", void 0);\n __decorate([\n Property(15)\n ], LegendSettings.prototype, \"shapeHeight\", void 0);\n __decorate([\n Property(10)\n ], LegendSettings.prototype, \"shapePadding\", void 0);\n __decorate([\n Complex({ color: '#000000', width: 0 }, Border)\n ], LegendSettings.prototype, \"border\", void 0);\n __decorate([\n Complex({ color: '#000000', width: 0 }, Border)\n ], LegendSettings.prototype, \"shapeBorder\", void 0);\n __decorate([\n Complex({}, CommonTitleSettings)\n ], LegendSettings.prototype, \"title\", void 0);\n __decorate([\n Complex({}, Font)\n ], LegendSettings.prototype, \"titleStyle\", void 0);\n __decorate([\n Property('Bottom')\n ], LegendSettings.prototype, \"position\", void 0);\n __decorate([\n Property('Center')\n ], LegendSettings.prototype, \"alignment\", void 0);\n __decorate([\n Property('None')\n ], LegendSettings.prototype, \"orientation\", void 0);\n __decorate([\n Property({ x: 0, y: 0 })\n ], LegendSettings.prototype, \"location\", void 0);\n __decorate([\n Property(null)\n ], LegendSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(1)\n ], LegendSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property('Default')\n ], LegendSettings.prototype, \"mode\", void 0);\n __decorate([\n Property(null)\n ], LegendSettings.prototype, \"showLegendPath\", void 0);\n __decorate([\n Property(null)\n ], LegendSettings.prototype, \"valuePath\", void 0);\n __decorate([\n Property(false)\n ], LegendSettings.prototype, \"removeDuplicateLegend\", void 0);\n return LegendSettings;\n}(ChildProperty));\nexport { LegendSettings };\n/**\n * Customization for Data label settings.\n */\nvar DataLabelSettings = /** @class */ (function (_super) {\n __extends(DataLabelSettings, _super);\n function DataLabelSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], DataLabelSettings.prototype, \"visible\", void 0);\n __decorate([\n Complex({ width: 0, color: 'transparent' }, Border)\n ], DataLabelSettings.prototype, \"border\", void 0);\n __decorate([\n Property('black')\n ], DataLabelSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(1)\n ], DataLabelSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property(5)\n ], DataLabelSettings.prototype, \"rx\", void 0);\n __decorate([\n Property(5)\n ], DataLabelSettings.prototype, \"ry\", void 0);\n __decorate([\n Complex({}, Font)\n ], DataLabelSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property('')\n ], DataLabelSettings.prototype, \"labelPath\", void 0);\n __decorate([\n Property('None')\n ], DataLabelSettings.prototype, \"smartLabelMode\", void 0);\n __decorate([\n Property('None')\n ], DataLabelSettings.prototype, \"intersectionAction\", void 0);\n __decorate([\n Property('')\n ], DataLabelSettings.prototype, \"template\", void 0);\n return DataLabelSettings;\n}(ChildProperty));\nexport { DataLabelSettings };\n/**\n * To configure the shapeSettings in the maps.\n */\nvar ShapeSettings = /** @class */ (function (_super) {\n __extends(ShapeSettings, _super);\n function ShapeSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('#A6A6A6')\n ], ShapeSettings.prototype, \"fill\", void 0);\n __decorate([\n Property([])\n ], ShapeSettings.prototype, \"palette\", void 0);\n __decorate([\n Property(5)\n ], ShapeSettings.prototype, \"circleRadius\", void 0);\n __decorate([\n Complex({ width: 0, color: '#000000' }, Border)\n ], ShapeSettings.prototype, \"border\", void 0);\n __decorate([\n Property('')\n ], ShapeSettings.prototype, \"dashArray\", void 0);\n __decorate([\n Property(1)\n ], ShapeSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property(null)\n ], ShapeSettings.prototype, \"colorValuePath\", void 0);\n __decorate([\n Property(null)\n ], ShapeSettings.prototype, \"valuePath\", void 0);\n __decorate([\n Collection([], ColorMappingSettings)\n ], ShapeSettings.prototype, \"colorMapping\", void 0);\n __decorate([\n Property(false)\n ], ShapeSettings.prototype, \"autofill\", void 0);\n return ShapeSettings;\n}(ChildProperty));\nexport { ShapeSettings };\n/**\n * To configure the marker settings for the maps.\n */\nvar MarkerBase = /** @class */ (function (_super) {\n __extends(MarkerBase, _super);\n function MarkerBase() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Complex({ color: 'transparent', width: 1 }, Border)\n ], MarkerBase.prototype, \"border\", void 0);\n __decorate([\n Property(null)\n ], MarkerBase.prototype, \"dashArray\", void 0);\n __decorate([\n Property(false)\n ], MarkerBase.prototype, \"visible\", void 0);\n __decorate([\n Property('#FF471A')\n ], MarkerBase.prototype, \"fill\", void 0);\n __decorate([\n Property(10)\n ], MarkerBase.prototype, \"height\", void 0);\n __decorate([\n Property(10)\n ], MarkerBase.prototype, \"width\", void 0);\n __decorate([\n Property(1)\n ], MarkerBase.prototype, \"opacity\", void 0);\n __decorate([\n Property('Balloon')\n ], MarkerBase.prototype, \"shape\", void 0);\n __decorate([\n Property('')\n ], MarkerBase.prototype, \"legendText\", void 0);\n __decorate([\n Property(new Point(0, 0))\n ], MarkerBase.prototype, \"offset\", void 0);\n __decorate([\n Property('')\n ], MarkerBase.prototype, \"imageUrl\", void 0);\n __decorate([\n Property(null)\n ], MarkerBase.prototype, \"template\", void 0);\n __decorate([\n Property([])\n ], MarkerBase.prototype, \"dataSource\", void 0);\n __decorate([\n Complex({}, TooltipSettings)\n ], MarkerBase.prototype, \"tooltipSettings\", void 0);\n __decorate([\n Property(1000)\n ], MarkerBase.prototype, \"animationDuration\", void 0);\n __decorate([\n Property(0)\n ], MarkerBase.prototype, \"animationDelay\", void 0);\n __decorate([\n Complex({}, SelectionSettings)\n ], MarkerBase.prototype, \"selectionSettings\", void 0);\n __decorate([\n Complex({}, HighlightSettings)\n ], MarkerBase.prototype, \"highlightSettings\", void 0);\n return MarkerBase;\n}(ChildProperty));\nexport { MarkerBase };\nvar MarkerSettings = /** @class */ (function (_super) {\n __extends(MarkerSettings, _super);\n // tslint:disable-next-line:no-any\n function MarkerSettings(parent, propName, defaultValue, isArray) {\n return _super.call(this, parent, propName, defaultValue, isArray) || this;\n }\n return MarkerSettings;\n}(MarkerBase));\nexport { MarkerSettings };\n/**\n * To configure the layers of the maps.\n */\nvar LayerSettings = /** @class */ (function (_super) {\n __extends(LayerSettings, _super);\n function LayerSettings() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n /**\n * @private\n */\n _this.isBaseLayer = false;\n return _this;\n }\n __decorate([\n Property(null)\n ], LayerSettings.prototype, \"shapeData\", void 0);\n __decorate([\n Property()\n ], LayerSettings.prototype, \"query\", void 0);\n __decorate([\n Complex({}, ShapeSettings)\n ], LayerSettings.prototype, \"shapeSettings\", void 0);\n __decorate([\n Property([])\n ], LayerSettings.prototype, \"dataSource\", void 0);\n __decorate([\n Property('Layer')\n ], LayerSettings.prototype, \"type\", void 0);\n __decorate([\n Property('Geographic')\n ], LayerSettings.prototype, \"geometryType\", void 0);\n __decorate([\n Property('Aerial')\n ], LayerSettings.prototype, \"bingMapType\", void 0);\n __decorate([\n Property('')\n ], LayerSettings.prototype, \"key\", void 0);\n __decorate([\n Property('Geometry')\n ], LayerSettings.prototype, \"layerType\", void 0);\n __decorate([\n Property('https://a.tile.openstreetmap.org/level/tileX/tileY.png')\n ], LayerSettings.prototype, \"urlTemplate\", void 0);\n __decorate([\n Property(true)\n ], LayerSettings.prototype, \"visible\", void 0);\n __decorate([\n Property('name')\n ], LayerSettings.prototype, \"shapeDataPath\", void 0);\n __decorate([\n Property('name')\n ], LayerSettings.prototype, \"shapePropertyPath\", void 0);\n __decorate([\n Property(0)\n ], LayerSettings.prototype, \"animationDuration\", void 0);\n __decorate([\n Collection([], MarkerSettings)\n ], LayerSettings.prototype, \"markerSettings\", void 0);\n __decorate([\n Complex({}, DataLabelSettings)\n ], LayerSettings.prototype, \"dataLabelSettings\", void 0);\n __decorate([\n Collection([], BubbleSettings)\n ], LayerSettings.prototype, \"bubbleSettings\", void 0);\n __decorate([\n Collection([], NavigationLineSettings)\n ], LayerSettings.prototype, \"navigationLineSettings\", void 0);\n __decorate([\n Complex({}, TooltipSettings)\n ], LayerSettings.prototype, \"tooltipSettings\", void 0);\n __decorate([\n Complex({}, SelectionSettings)\n ], LayerSettings.prototype, \"selectionSettings\", void 0);\n __decorate([\n Complex({}, HighlightSettings)\n ], LayerSettings.prototype, \"highlightSettings\", void 0);\n return LayerSettings;\n}(ChildProperty));\nexport { LayerSettings };\n/**\n * Internal use for bing type layer rendering\n */\nvar Tile = /** @class */ (function () {\n function Tile(x, y, height, width, top, left, src) {\n if (height === void 0) { height = 256; }\n if (width === void 0) { width = 256; }\n if (top === void 0) { top = 0; }\n if (left === void 0) { left = 0; }\n if (src === void 0) { src = null; }\n this.x = x;\n this.y = y;\n this.top = top;\n this.left = left;\n this.height = height;\n this.width = width;\n this.src = src;\n }\n return Tile;\n}());\nexport { Tile };\n/**\n * Maps area configuration\n */\nvar MapsAreaSettings = /** @class */ (function (_super) {\n __extends(MapsAreaSettings, _super);\n function MapsAreaSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], MapsAreaSettings.prototype, \"background\", void 0);\n __decorate([\n Complex({ color: 'transparent', width: 1 }, Border)\n ], MapsAreaSettings.prototype, \"border\", void 0);\n return MapsAreaSettings;\n}(ChildProperty));\nexport { MapsAreaSettings };\n","import { markerRendering, convertTileLatLongToPoint, MapLocation } from '../index';\nimport { markerClick, markerMouseMove } from '../index';\nimport { isNullOrUndefined, merge, createElement } from '@syncfusion/ej2-base';\nimport { CircleOption, PathOption, Point, getTranslate, convertGeoToPoint } from '../utils/helper';\nimport { getTemplateFunction, getElementByID, convertElement, calculateShapes, Size, RectOption, Rect, elementAnimate } from '../utils/helper';\n/**\n * Marker class\n */\nvar Marker = /** @class */ (function () {\n function Marker(maps) {\n this.maps = maps;\n this.trackElements = [];\n }\n /* tslint:disable:no-string-literal */\n Marker.prototype.markerRender = function (layerElement, layerIndex, factor, type) {\n var _this = this;\n var templateFn;\n var currentLayer = this.maps.layersCollection[layerIndex];\n this.markerSVGObject = this.maps.renderer.createGroup({\n id: this.maps.element.id + '_Markers_Group',\n style: 'pointer-events: auto;'\n });\n if (document.getElementById(this.markerSVGObject.id)) {\n document.getElementById(this.markerSVGObject.id).remove();\n }\n var markerTemplateEle = createElement('div', {\n id: this.maps.element.id + '_LayerIndex_' + layerIndex + '_Markers_Template_Group',\n className: 'template',\n styles: 'overflow: hidden; position: absolute;pointer-events: none;' +\n 'top:' + (this.maps.isTileMap ? 0 : this.maps.mapAreaRect.y) + 'px;' +\n 'left:' + (this.maps.isTileMap ? 0 : this.maps.mapAreaRect.x) + 'px;' +\n 'height:' + this.maps.mapAreaRect.height + 'px;' +\n 'width:' + this.maps.mapAreaRect.width + 'px;'\n });\n if (document.getElementById(markerTemplateEle.id)) {\n document.getElementById(markerTemplateEle.id).remove();\n }\n currentLayer.markerSettings.map(function (markerSettings, markerIndex) {\n var markerData = markerSettings.dataSource;\n markerData.forEach(function (data, dataIndex) {\n var eventArgs = {\n cancel: false, name: markerRendering, fill: markerSettings.fill, height: markerSettings.height,\n width: markerSettings.width, imageUrl: markerSettings.imageUrl, shape: markerSettings.shape,\n template: markerSettings.template, data: data, maps: _this.maps, marker: markerSettings,\n border: markerSettings.border\n };\n _this.maps.trigger(markerRendering, eventArgs);\n var lng = data['longitude'];\n var lat = data['latitude'];\n var offset = markerSettings.offset;\n if (!eventArgs.cancel && markerSettings.visible && !isNullOrUndefined(lng) && !isNullOrUndefined(lat)) {\n var markerID = _this.maps.element.id + '_LayerIndex_' + layerIndex + '_MarkerIndex_'\n + markerIndex + '_dataIndex_' + dataIndex;\n var location_1 = (_this.maps.isTileMap) ? convertTileLatLongToPoint(new MapLocation(lng, lat), factor, _this.maps.tileTranslatePoint, true) : convertGeoToPoint(lat, lng, factor, currentLayer, _this.maps);\n var animate = currentLayer.animationDuration !== 0 || isNullOrUndefined(_this.maps.zoomModule);\n var translate = (_this.maps.isTileMap) ? new Object() : getTranslate(_this.maps, currentLayer, animate);\n var scale = type === 'AddMarker' ? _this.maps.scale : translate['scale'];\n var transPoint = type === 'AddMarker' ? _this.maps.translatePoint : translate['location'];\n if (eventArgs.template) {\n templateFn = getTemplateFunction(eventArgs.template);\n if (templateFn && templateFn(_this.maps).length) {\n var templateElement = templateFn(_this.maps);\n var markerElement = convertElement(templateElement, markerID, data, markerIndex, _this.maps);\n for (var i = 0; i < markerElement.children.length; i++) {\n markerElement.children[i].style.pointerEvents = 'none';\n }\n markerElement.style.left = ((_this.maps.isTileMap ? location_1.x :\n ((Math.abs(_this.maps.baseMapRectBounds['min']['x'] - location_1.x)) * scale)) + offset.x) + 'px';\n markerElement.style.top = ((_this.maps.isTileMap ? location_1.y :\n ((Math.abs(_this.maps.baseMapRectBounds['min']['y'] - location_1.y)) * scale)) + offset.y) + 'px';\n markerTemplateEle.appendChild(markerElement);\n }\n }\n else {\n var shapeCustom = {\n size: new Size(eventArgs.width, eventArgs.height),\n fill: eventArgs.fill, borderColor: eventArgs.border.color,\n borderWidth: eventArgs.border.width, opacity: markerSettings.opacity,\n dashArray: markerSettings.dashArray\n };\n var ele = _this.drawSymbol(eventArgs.shape, eventArgs.imageUrl, { x: 0, y: 0 }, markerID, shapeCustom);\n var x = (_this.maps.isTileMap ? location_1.x : (location_1.x + transPoint.x) * scale) + offset.x;\n var y = (_this.maps.isTileMap ? location_1.y : (location_1.y + transPoint.y) * scale) + offset.y;\n ele.setAttribute('transform', 'translate( ' + x + ' ' + y + ' )');\n _this.markerSVGObject.appendChild(ele);\n var element = (markerData.length - 1) === dataIndex ? 'marker' : null;\n var markerPoint = new Point(x, y);\n if (markerSettings.animationDuration > 0) {\n elementAnimate(ele, markerSettings.animationDelay, markerSettings.animationDuration, markerPoint, _this.maps, element);\n }\n }\n }\n });\n });\n if (this.markerSVGObject.childElementCount > 0) {\n layerElement.appendChild(this.markerSVGObject);\n }\n if (markerTemplateEle.childElementCount > 0 && getElementByID(this.maps.element.id + '_Secondary_Element')) {\n getElementByID(this.maps.element.id + '_Secondary_Element').appendChild(markerTemplateEle);\n }\n };\n Marker.prototype.drawSymbol = function (shape, imageUrl, location, markerID, shapeCustom) {\n var markerEle;\n var x;\n var y;\n var size = shapeCustom['size'];\n var borderColor = shapeCustom['borderColor'];\n var borderWidth = parseFloat(shapeCustom['borderWidth']);\n var fill = shapeCustom['fill'];\n var dashArray = shapeCustom['dashArray'];\n var border = { color: borderColor, width: borderWidth };\n var opacity = shapeCustom['opacity'];\n var circleOptions;\n var pathOptions;\n var rectOptions;\n pathOptions = new PathOption(markerID, fill, borderWidth, borderColor, opacity, dashArray, '');\n if (shape === 'Circle') {\n var radius = (size.width + size.height) / 4;\n circleOptions = new CircleOption(markerID, fill, border, opacity, location.x, location.y, radius, dashArray);\n markerEle = this.maps.renderer.drawCircle(circleOptions);\n }\n else if (shape === 'Rectangle') {\n x = location.x - (size.width / 2);\n y = location.y - (size.height / 2);\n rectOptions = new RectOption(markerID, fill, border, opacity, new Rect(x, y, size.width, size.height), null, null, '', dashArray);\n markerEle = this.maps.renderer.drawRectangle(rectOptions);\n }\n else if (shape === 'Image') {\n x = location.x - (size.width / 2);\n y = location.y - (size.height / 2);\n merge(pathOptions, { 'href': imageUrl, 'height': size.height, 'width': size.width, x: x, y: y });\n markerEle = this.maps.renderer.drawImage(pathOptions);\n }\n else {\n markerEle = calculateShapes(this.maps, shape, pathOptions, size, location, this.markerSVGObject);\n }\n return markerEle;\n };\n /**\n * To check and trigger marker click event\n */\n Marker.prototype.markerClick = function (e) {\n var target = e.target.id;\n if (target.indexOf('_LayerIndex_') === -1) {\n return;\n }\n var options = this.getMarker(target);\n if (isNullOrUndefined(options)) {\n return;\n }\n var eventArgs = {\n cancel: false, name: markerClick, data: options.data, maps: this.maps, marker: options.marker,\n target: target, x: e.clientX, y: e.clientY\n };\n this.maps.trigger(markerClick, eventArgs);\n };\n /**\n * To get marker from target id\n */\n Marker.prototype.getMarker = function (target) {\n var id = target.split('_LayerIndex_');\n var index = parseInt(id[1].split('_')[0], 10);\n var layer = this.maps.layers[index];\n var data;\n var marker;\n if (target.indexOf('_MarkerIndex_') > -1) {\n var markerIndex = parseInt(id[1].split('_MarkerIndex_')[1].split('_')[0], 10);\n var dataIndex = parseInt(id[1].split('_dataIndex_')[1].split('_')[0], 10);\n marker = layer.markerSettings[markerIndex];\n if (!isNaN(markerIndex)) {\n data = marker.dataSource[dataIndex];\n return { marker: marker, data: data };\n }\n }\n return null;\n };\n /**\n * To check and trigger marker move event\n */\n Marker.prototype.markerMove = function (e) {\n var targetId = e.target.id;\n if (targetId.indexOf('_LayerIndex_') === -1) {\n return;\n }\n var options = this.getMarker(targetId);\n if (isNullOrUndefined(options)) {\n return;\n }\n var eventArgs = {\n cancel: false, name: markerMouseMove, data: options.data, maps: this.maps,\n target: targetId, x: e.clientX, y: e.clientY\n };\n this.maps.trigger(markerMouseMove, eventArgs);\n };\n /**\n * Get module name.\n */\n Marker.prototype.getModuleName = function () {\n return 'Marker';\n };\n /**\n * To destroy the layers.\n * @return {void}\n * @private\n */\n Marker.prototype.destroy = function (maps) {\n /**\n * Destroy method performed here\n */\n };\n return Marker;\n}());\nexport { Marker };\n","/**\n * Maps constants doc\n */\n/**\n * Specifies maps load event name.\n * @private\n */\nexport var load = 'load';\n/**\n * Specifies maps loaded event name.\n * @private\n */\nexport var loaded = 'loaded';\n/**\n * Specifies maps click event name.\n * @private\n */\nexport var click = 'click';\n/**\n * Specifies maps loaded event name.\n * @private\n */\nexport var rightClick = 'rightClick';\n/**\n * Specifies maps double click event name.\n * @private\n */\nexport var doubleClick = 'doubleClick';\n/**\n * Specifies maps resize event name.\n * @private\n */\nexport var resize = 'resize';\n/**\n * Specifies the map tooltip render event\n */\nexport var tooltipRender = 'tooltipRender';\n/**\n * Specifies the map shapeSelected event\n */\nexport var shapeSelected = 'shapeSelected';\n/**\n * Specifies the map shapeHighlight event\n */\nexport var shapeHighlight = 'shapeHighlight';\n/**\n * Specifies maps mousemove event name.\n * @private\n */\nexport var mousemove = 'mousemove';\n/**\n * Specifies maps mouseup event name.\n * @private\n */\nexport var mouseup = 'mouseup';\n/**\n * Specifies maps mousedown event name.\n * @private\n */\nexport var mousedown = 'mousedown';\n/**\n * Specifies maps layerRendering event name.\n * @private\n */\nexport var layerRendering = 'layerRendering';\n/**\n * Specifies maps shapeRendering event name.\n * @private\n */\nexport var shapeRendering = 'shapeRendering';\n/**\n * Specifies maps markerRendering event name.\n * @private\n */\nexport var markerRendering = 'markerRendering';\n/**\n * Specifies maps markerClick event name.\n * @private\n */\nexport var markerClick = 'markerClick';\n/**\n * Specifies maps markerMouseMove event name.\n * @private\n */\nexport var markerMouseMove = 'markerMouseMove';\n/**\n * Specifies maps dataLabelRendering event name.\n * @private\n */\nexport var dataLabelRendering = 'dataLabelRendering';\n/**\n * Specifies maps bubbleRendering event name.\n * @private\n */\nexport var bubbleRendering = 'bubbleRendering';\n/**\n * Specifies maps bubbleClick event name.\n * @private\n */\nexport var bubbleClick = 'bubbleClick';\n/**\n * Specifies maps bubbleMouseMove event name.\n * @private\n */\nexport var bubbleMouseMove = 'bubbleMouseMove';\n/**\n * Specifies maps animationComplete event name.\n * @private\n */\nexport var animationComplete = 'animationComplete';\n/**\n * Specifies maps legendRendering event name.\n * @private\n */\nexport var legendRendering = 'legendRendering';\n/**\n * Specifies maps annotationRendering event name.\n * @private\n */\nexport var annotationRendering = 'annotationRendering';\n/**\n * Specifies maps itemSelection event name\n * @private\n */\nexport var itemSelection = 'itemSelection';\n/**\n * Specifies maps itemHighlight event name\n */\nexport var itemHighlight = 'itemHighlight';\n/**\n * Specifies maps beforePrint event name\n */\nexport var beforePrint = 'beforePrint';\n/**\n * Specifies the map zoom in event name\n */\nexport var zoomIn = 'zoomIn';\n/**\n * Specifies the map zoom out event name\n */\nexport var zoomOut = 'zoomOut';\n/**\n * Specifies the map pan event name\n */\nexport var pan = 'pan';\n","/**\n * Bing map src doc\n */\nvar BingMap = /** @class */ (function () {\n function BingMap(maps) {\n this.maps = maps;\n }\n BingMap.prototype.getBingMap = function (tile, key, type, language, imageUrl, subDomains) {\n var quadKey = '';\n var subDomain;\n var maxZoom = Math.min(this.maps.tileZoomLevel, parseInt(this.maxZoom, 10));\n for (var i = maxZoom; i > 0; i--) {\n var digit = 0;\n var mask = 1 << (i - 1);\n if ((tile.x & mask) !== 0) {\n digit++;\n }\n if ((tile.y & mask) !== 0) {\n digit += 2;\n }\n quadKey = quadKey + '' + digit;\n }\n subDomain = subDomains[Math.min(parseInt(quadKey.substr(quadKey.length - 1, 1), 10), subDomains.length)];\n imageUrl = imageUrl.replace('{quadkey}', quadKey).replace('{subdomain}', subDomain);\n return imageUrl += '&mkt=' + language + '&ur=IN&Key=' + key;\n };\n return BingMap;\n}());\nexport { BingMap };\n","import { ColorValue } from '../index';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\n/**\n * ColorMapping class\n */\nvar ColorMapping = /** @class */ (function () {\n function ColorMapping(maps) {\n this.maps = maps;\n }\n /**\n * To get color based on shape settings.\n * @private\n */\n ColorMapping.prototype.getShapeColorMapping = function (shapeSettings, layerData, color) {\n var colorValuePath = shapeSettings.colorValuePath ? shapeSettings.colorValuePath : shapeSettings.valuePath;\n var equalValue = layerData[colorValuePath];\n var colorValue = Number(equalValue);\n var shapeColor = this.getColorByValue(shapeSettings.colorMapping, colorValue, equalValue);\n return shapeColor ? shapeColor : color;\n };\n /**\n * To color by value and color mapping\n */\n ColorMapping.prototype.getColorByValue = function (colorMapping, colorValue, equalValue) {\n if (isNaN(colorValue) && isNullOrUndefined(equalValue)) {\n return null;\n }\n var fill = '';\n var opacity;\n var gradientColor;\n var gradientFill;\n for (var _i = 0, colorMapping_1 = colorMapping; _i < colorMapping_1.length; _i++) {\n var colorMap = colorMapping_1[_i];\n if ((!isNullOrUndefined(colorMap.from) && !isNullOrUndefined(colorMap.to)\n && (colorValue >= colorMap.from && colorValue <= colorMap.to)) ||\n (colorMap.value === equalValue)) {\n if (Object.prototype.toString.call(colorMap.color) === '[object Array]') {\n if (!isNullOrUndefined(colorMap.value)) {\n fill = colorMap.color[0];\n }\n else {\n gradientFill = this.getColor(colorMap, colorValue);\n fill = gradientFill;\n }\n }\n else {\n fill = colorMap.color;\n }\n }\n if (((colorValue >= colorMap.from && colorValue <= colorMap.to) || (colorMap.value === equalValue))\n && (!isNullOrUndefined(colorMap.minOpacity) && !isNullOrUndefined(colorMap.maxOpacity) && fill)) {\n opacity = this.deSaturationColor(colorMap, fill, colorValue, equalValue);\n }\n if ((fill === '' || isNullOrUndefined(fill)) && isNullOrUndefined(colorMap.from) && isNullOrUndefined(colorMap.to)\n && isNullOrUndefined(colorMap.minOpacity) && isNullOrUndefined(colorMap.maxOpacity) && isNullOrUndefined(colorMap.value)) {\n fill = Object.prototype.toString.call(colorMap.color) === '[object Array]' ? colorMap.color[0] : colorMap.color;\n }\n }\n return { fill: fill || ((!colorMapping.length) ? equalValue : null), opacity: opacity };\n };\n ColorMapping.prototype.deSaturationColor = function (colorMapping, color, rangeValue, equalValue) {\n var opacity = 1;\n if (((rangeValue >= colorMapping.from && rangeValue <= colorMapping.to) || colorMapping.value === equalValue)) {\n var ratio = !isNaN(rangeValue) ? (rangeValue - colorMapping.from) / (colorMapping.to - colorMapping.from) :\n colorMapping.from / (colorMapping.to - colorMapping.from);\n opacity = (ratio * (colorMapping.maxOpacity - colorMapping.minOpacity)) + colorMapping.minOpacity;\n }\n return opacity;\n };\n ColorMapping.prototype.rgbToHex = function (r, g, b) {\n return '#' + this.componentToHex(r) + this.componentToHex(g) + this.componentToHex(b);\n };\n ColorMapping.prototype.componentToHex = function (value) {\n var hex = value.toString(16);\n return hex.length === 1 ? '0' + hex : hex;\n };\n ColorMapping.prototype.getColor = function (colorMap, value) {\n var color = '';\n var rbg;\n if (Number(value) === colorMap.from) {\n color = colorMap.color[0];\n }\n else if (Number(value) === colorMap.to) {\n color = colorMap.color[colorMap.color.length - 1];\n }\n else {\n rbg = this.getGradientColor(Number(value), colorMap);\n color = this.rgbToHex(rbg.r, rbg.g, rbg.b);\n }\n return color;\n };\n /* tslint:disable-next-line:max-func-body-length */\n /* tslint:disable:no-string-literal */\n ColorMapping.prototype.getGradientColor = function (value, colorMap) {\n var previousOffset = colorMap.from;\n var nextOffset = colorMap.to;\n var percent = 0;\n var prev1;\n var full = nextOffset - previousOffset;\n var midColor;\n var midreturn;\n percent = (value - previousOffset) / full;\n var previousColor;\n var nextColor;\n if (colorMap.color.length <= 2) {\n previousColor = colorMap.color[0].charAt(0) === '#' ? colorMap.color[0] : this._colorNameToHex(colorMap.color[0]);\n nextColor = colorMap.color[colorMap.color.length - 1].charAt(0) === '#' ?\n colorMap.color[colorMap.color.length - 1] : this._colorNameToHex(colorMap.color[colorMap.color.length - 1]);\n }\n else {\n previousColor = colorMap.color[0].charAt(0) === '#' ? colorMap.color[0] : this._colorNameToHex(colorMap.color[0]);\n nextColor = colorMap.color[colorMap.color.length - 1].charAt(0) === '#' ?\n colorMap.color[colorMap.color.length - 1] : this._colorNameToHex(colorMap.color[colorMap.color.length - 1]);\n var a = full / (colorMap.color.length - 1);\n var b = void 0;\n var c = void 0;\n var length_1 = colorMap.color.length - 1;\n var splitColorValueOffset = [];\n var splitColor = {};\n for (var j = 1; j < length_1; j++) {\n c = j * a;\n b = previousOffset + c;\n splitColor = { b: b, color: colorMap.color[j] };\n splitColorValueOffset.push(splitColor);\n }\n for (var i = 0; i < splitColorValueOffset.length; i++) {\n if (previousOffset <= value && value <= splitColorValueOffset[i]['b'] && i === 0) {\n midColor = splitColorValueOffset[i]['color'].charAt(0) === '#' ?\n splitColorValueOffset[i]['color'] : this._colorNameToHex(splitColorValueOffset[i]['color']);\n nextColor = midColor;\n percent = value < splitColorValueOffset[i]['b'] ? 1 - Math.abs((value - splitColorValueOffset[i]['b']) / a)\n : (value - splitColorValueOffset[i]['b']) / a;\n }\n else if (splitColorValueOffset[i]['b'] <= value && value <= nextOffset && i === (splitColorValueOffset.length - 1)) {\n midColor = splitColorValueOffset[i]['color'].charAt(0) === '#' ?\n splitColorValueOffset[i]['color'] : this._colorNameToHex(splitColorValueOffset[i]['color']);\n previousColor = midColor;\n percent = value < splitColorValueOffset[i]['b'] ?\n 1 - Math.abs((value - splitColorValueOffset[i]['b']) / a) : (value - splitColorValueOffset[i]['b']) / a;\n }\n if (i !== splitColorValueOffset.length - 1 && i < splitColorValueOffset.length) {\n if (splitColorValueOffset[i]['b'] <= value && value <= splitColorValueOffset[i + 1]['b']) {\n midColor = splitColorValueOffset[i]['color'].charAt(0) === '#' ?\n splitColorValueOffset[i]['color'] : this._colorNameToHex(splitColorValueOffset[i]['color']);\n previousColor = midColor;\n nextColor = splitColorValueOffset[i + 1]['color'].charAt(0) === '#' ?\n splitColorValueOffset[i + 1]['color'] : this._colorNameToHex(splitColorValueOffset[i + 1]['color']);\n percent = Math.abs((value - splitColorValueOffset[i + 1]['b'])) / a;\n }\n }\n }\n }\n return this.getPercentageColor(percent, previousColor, nextColor);\n };\n ColorMapping.prototype.getPercentageColor = function (percent, previous, next) {\n var nextColor = next.split('#')[1];\n var prevColor = previous.split('#')[1];\n var r = this.getPercentage(percent, parseInt(prevColor.substr(0, 2), 16), parseInt(nextColor.substr(0, 2), 16));\n var g = this.getPercentage(percent, parseInt(prevColor.substr(2, 2), 16), parseInt(nextColor.substr(2, 2), 16));\n var b = this.getPercentage(percent, parseInt(prevColor.substr(4, 2), 16), parseInt(nextColor.substr(4, 2), 16));\n return new ColorValue(r, g, b);\n };\n ColorMapping.prototype.getPercentage = function (percent, previous, next) {\n var full = next - previous;\n return Math.round((previous + (full * percent)));\n };\n ColorMapping.prototype._colorNameToHex = function (color) {\n var colors = {\n 'aliceblue': '#f0f8ff', 'antiquewhite': '#faebd7', 'aqua': '#00ffff', 'aquamarine': '#7fffd4', 'azure': '#f0ffff',\n 'beige': '#f5f5dc', 'bisque': '#ffe4c4', 'black': '#000000', 'blanchedalmond': '#ffebcd', 'blue': '#0000ff',\n 'blueviolet': '#8a2be2', 'brown': '#a52a2a', 'burlywood': '#deb887',\n 'cadetblue': '#5f9ea0', 'chartreuse': '#7fff00', 'chocolate': '#d2691e', 'coral': '#ff7f50',\n 'cornflowerblue': '#6495ed', 'cornsilk': '#fff8dc', 'crimson': '#dc143c', 'cyan': '#00ffff',\n 'darkblue': '#00008b', 'darkcyan': '#008b8b', 'darkgoldenrod': '#b8860b', 'darkgray': '#a9a9a9', 'darkgreen': '#006400',\n 'darkkhaki': '#bdb76b', 'darkmagenta': '#8b008b', 'darkolivegreen': '#556b2f',\n 'darkorange': '#ff8c00', 'darkorchid': '#9932cc', 'darkred': '#8b0000', 'darksalmon': '#e9967a', 'darkseagreen': '#8fbc8f',\n 'darkslateblue': '#483d8b', 'darkslategray': '#2f4f4f', 'darkturquoise': '#00ced1',\n 'darkviolet': '#9400d3', 'deeppink': '#ff1493', 'deepskyblue': '#00bfff', 'dimgray': '#696969', 'dodgerblue': '#1e90ff',\n 'firebrick': '#b22222', 'floralwhite': '#fffaf0', 'forestgreen': '#228b22', 'fuchsia': '#ff00ff',\n 'gainsboro': '#dcdcdc', 'ghostwhite': '#f8f8ff', 'gold': '#ffd700', 'goldenrod': '#daa520', 'gray': '#808080',\n 'green': '#008000', 'greenyellow': '#adff2f',\n 'honeydew': '#f0fff0', 'hotpink': '#ff69b4',\n 'indianred ': '#cd5c5c', 'indigo ': '#4b0082', 'ivory': '#fffff0', 'khaki': '#f0e68c',\n 'lavender': '#e6e6fa', 'lavenderblush': '#fff0f5', 'lawngreen': '#7cfc00', 'lemonchiffon': '#fffacd', 'lightblue': '#add8e6',\n 'lightcoral': '#f08080', 'lightcyan': '#e0ffff', 'lightgoldenrodyellow': '#fafad2',\n 'lightgrey': '#d3d3d3', 'lightgreen': '#90ee90', 'lightpink': '#ffb6c1', 'lightsalmon': '#ffa07a', 'lightseagreen': '#20b2aa',\n 'lightskyblue': '#87cefa', 'lightslategray': '#778899', 'lightsteelblue': '#b0c4de',\n 'lightyellow': '#ffffe0', 'lime': '#00ff00', 'limegreen': '#32cd32', 'linen': '#faf0e6',\n 'magenta': '#ff00ff', 'maroon': '#800000', 'mediumaquamarine': '#66cdaa', 'mediumblue': '#0000cd', 'mediumorchid': '#ba55d3',\n 'mediumpurple': '#9370d8', 'mediumseagreen': '#3cb371', 'mediumslateblue': '#7b68ee',\n 'mediumspringgreen': '#00fa9a', 'mediumturquoise': '#48d1cc', 'mediumvioletred': '#c71585', 'midnightblue': '#191970',\n 'mintcream': '#f5fffa', 'mistyrose': '#ffe4e1', 'moccasin': '#ffe4b5',\n 'navajowhite': '#ffdead', 'navy': '#000080', 'orchid': '#da70d6', 'papayawhip': '#ffefd5',\n 'oldlace': '#fdf5e6', 'olive': '#808000', 'olivedrab': '#6b8e23', 'orange': '#ffa500', 'orangered': '#ff4500',\n 'palegoldenrod': '#eee8aa', 'palegreen': '#98fb98', 'paleturquoise': '#afeeee', 'palevioletred': '#d87093',\n 'peachpuff': '#ffdab9', 'peru': '#cd853f', 'pink': '#ffc0cb', 'plum': '#dda0dd', 'powderblue': '#b0e0e6', 'purple': '#800080',\n 'red': '#ff0000', 'rosybrown': '#bc8f8f', 'royalblue': '#4169e1',\n 'saddlebrown': '#8b4513', 'salmon': '#fa8072', 'sandybrown': '#f4a460', 'seagreen': '#2e8b57', 'seashell': '#fff5ee',\n 'sienna': '#a0522d', 'silver': '#c0c0c0', 'skyblue': '#87ceeb', 'slateblue': '#6a5acd',\n 'slategray': '#708090', 'snow': '#fffafa', 'springgreen': '#00ff7f', 'steelblue': '#4682b4',\n 'tan': '#d2b48c', 'teal': '#008080', 'thistle': '#d8bfd8', 'tomato': '#ff6347', 'turquoise': '#40e0d0',\n 'violet': '#ee82ee',\n 'wheat': '#f5deb3', 'white': '#ffffff', 'whitesmoke': '#f5f5f5',\n 'yellow': '#ffff00', 'yellowgreen': '#9acd32'\n };\n if (Object.prototype.toString.call(color) === '[object Array]') {\n return color;\n }\n if (typeof colors[color.toLowerCase()] !== 'undefined') {\n return colors[color.toLowerCase()];\n }\n return color;\n };\n return ColorMapping;\n}());\nexport { ColorMapping };\n","import { isNullOrUndefined, extend, createElement, Ajax } from '@syncfusion/ej2-base';\nimport { getShapeColor } from '../model/theme';\nimport { GeoLocation, isCustomPath, convertGeoToPoint, Point, PathOption, Size, PolylineOption, getElementByID } from '../utils/helper';\nimport { MapLocation, RectOption, getTranslate, convertTileLatLongToPoint, checkShapeDataFields, CircleOption } from '../utils/helper';\nimport { Tile } from '../model/base';\nimport { BingMap } from './bing-map';\nimport { ColorMapping } from './color-mapping';\nimport { layerRendering, shapeRendering } from '../index';\n/**\n * To calculate and render the shape layer\n */\nvar LayerPanel = /** @class */ (function () {\n function LayerPanel(map) {\n this.tileTranslatePoint = new MapLocation(0, 0);\n this.isMapCoordinates = true;\n this.ajaxProcessCount = 0;\n this.mapObject = map;\n this.ajaxModule = new Ajax();\n this.ajaxResponse = [];\n }\n /* tslint:disable:no-string-literal */\n LayerPanel.prototype.measureLayerPanel = function () {\n var _this = this;\n var imageSize = 30;\n var layerCollection = this.mapObject.layersCollection;\n var areaRect = this.mapObject.mapAreaRect;\n var padding = 10;\n var secondaryEle = getElementByID(this.mapObject.element.id + '_Secondary_Element');\n if (this.mapObject.isTileMap && secondaryEle) {\n this.tileSvgObject = this.mapObject.renderer.createSvg({\n id: this.mapObject.element.id + '_Tile_SVG', width: areaRect.width,\n height: areaRect.height,\n style: 'pointer-events:none'\n });\n secondaryEle.appendChild(this.tileSvgObject);\n }\n this.layerGroup = (this.mapObject.renderer.createGroup({\n id: this.mapObject.element.id + '_Layer_Collections',\n 'clip-path': 'url(#' + this.mapObject.element.id + '_MapArea_ClipRect)'\n }));\n this.clipRectElement = this.mapObject.renderer.drawClipPath(new RectOption(this.mapObject.element.id + '_MapArea_ClipRect', 'transparent', { width: 1, color: 'Gray' }, 1, {\n x: this.mapObject.isTileMap ? 0 : areaRect.x, y: this.mapObject.isTileMap ? 0 : areaRect.y,\n width: areaRect.width, height: areaRect.height\n }));\n this.layerGroup.appendChild(this.clipRectElement);\n this.mapObject.baseMapBounds = null;\n this.mapObject.baseMapRectBounds = null;\n this.mapObject.baseSize = null;\n var layerCount = layerCollection.length - 1;\n layerCollection.forEach(function (layer, index) {\n _this.currentLayer = layer;\n _this.processLayers(layer, index);\n });\n };\n LayerPanel.prototype.renderTileLayer = function (panel, layer, layerIndex, bing) {\n var center = new Point(panel.mapObject.centerPosition.longitude, panel.mapObject.centerPosition.latitude);\n panel.currentFactor = panel.calculateFactor(layer);\n if (isNullOrUndefined(panel.mapObject.tileZoomLevel)) {\n panel.mapObject.tileZoomLevel = panel.mapObject.zoomSettings.zoomFactor;\n }\n panel.mapObject.tileTranslatePoint = panel.panTileMap(panel.mapObject.availableSize.width, panel.mapObject.availableSize.height, center);\n panel.generateTiles(panel.mapObject.tileZoomLevel, panel.mapObject.tileTranslatePoint, bing);\n if (panel.mapObject.navigationLineModule) {\n panel.layerObject.appendChild(panel.mapObject.navigationLineModule.renderNavigation(panel.currentLayer, panel.mapObject.tileZoomLevel, layerIndex));\n }\n if (panel.mapObject.markerModule) {\n panel.mapObject.markerModule.markerRender(panel.layerObject, layerIndex, panel.mapObject.tileZoomLevel, null);\n }\n panel.translateLayerElements(panel.layerObject, layerIndex);\n panel.layerGroup.appendChild(panel.layerObject);\n };\n LayerPanel.prototype.processLayers = function (layer, layerIndex) {\n this.layerObject = (this.mapObject.renderer.createGroup({\n id: this.mapObject.element.id + '_LayerIndex_' + layerIndex\n }));\n var eventArgs = {\n cancel: false, name: layerRendering, index: layerIndex,\n layer: layer, maps: this.mapObject\n };\n this.mapObject.trigger(layerRendering, eventArgs);\n if (!eventArgs.cancel) {\n if (layer.layerType !== 'Geometry') {\n if (layer.layerType !== 'Bing' || this.bing) {\n this.renderTileLayer(this, layer, layerIndex);\n }\n else if (layer.key && layer.key.length > 1) {\n var proxy_1 = this;\n var bing_1 = new BingMap(this.mapObject);\n var url = 'https://dev.virtualearth.net/REST/V1/Imagery/Metadata/' + layer.bingMapType;\n var ajax = new Ajax({\n url: url + '?output=json&include=ImageryProviders&key=' + layer.key\n });\n ajax.onSuccess = function (json) {\n var jsonObject = JSON.parse(json);\n var resource = jsonObject['resourceSets'][0]['resources'][0];\n var imageUrl = resource['imageUrl'];\n var subDomains = resource['imageUrlSubdomains'];\n var maxZoom = resource['zoomMax'];\n if (imageUrl !== null && imageUrl !== undefined && imageUrl !== bing_1.imageUrl) {\n bing_1.imageUrl = imageUrl;\n }\n if (subDomains !== null && subDomains !== undefined && subDomains !== bing_1.subDomains) {\n bing_1.subDomains = subDomains;\n }\n if (maxZoom !== null && maxZoom !== undefined && maxZoom !== bing_1.maxZoom) {\n bing_1.maxZoom = maxZoom;\n }\n proxy_1.mapObject['bingMap'] = bing_1;\n proxy_1.renderTileLayer(proxy_1, layer, layerIndex, bing_1);\n };\n ajax.send();\n }\n }\n else {\n if (!isNullOrUndefined(layer.shapeData) && (!isNullOrUndefined(layer.shapeData['geometries']) ||\n !isNullOrUndefined(layer.shapeData['features']))) {\n var featureData = (!isNullOrUndefined(layer.shapeData['geometries']) &&\n layer.shapeData['geometries'].length > 0 ? layer.shapeData['geometries'] :\n layer.shapeData['features']);\n layer.layerData = [];\n var bbox = layer.shapeData['bbox'];\n if (!isNullOrUndefined(bbox) && layer.isBaseLayer) {\n this.mapObject.baseMapBounds = new GeoLocation({ min: bbox[0][1], max: bbox[1][1] }, { min: bbox[0][0], max: bbox[1][0] });\n }\n else if (isNullOrUndefined(this.mapObject.baseMapBounds) && !isCustomPath(featureData)) {\n this.calculateRectBounds(featureData);\n // if (isNullOrUndefined(this.mapObject.baseSize)) {\n // let minSize: Point = convertGeoToPoint(\n // this.mapObject.baseMapBounds.latitude.min,\n // this.mapObject.baseMapBounds.longitude.min, this.calculateFactor(layer), layer, this.mapObject\n // );\n // let maxSize: Point = convertGeoToPoint(\n // this.mapObject.baseMapBounds.latitude.max,\n // this.mapObject.baseMapBounds.longitude.max, this.calculateFactor(layer), layer, this.mapObject\n // );\n // this.mapObject.baseSize = new Size(Math.abs(minSize.x - maxSize.x), Math.abs(minSize.y - maxSize.y));\n // }\n }\n this.calculatePathCollection(layerIndex, featureData);\n }\n }\n }\n if (!this.mapObject.isTileMap) {\n this.mapObject.svgObject.appendChild(this.layerGroup);\n }\n else if (this.tileSvgObject) {\n this.tileSvgObject.appendChild(this.layerGroup);\n }\n };\n //tslint:disable:max-func-body-length\n LayerPanel.prototype.bubbleCalculation = function (bubbleSettings, range) {\n if (bubbleSettings.dataSource != null && bubbleSettings != null) {\n if (bubbleSettings.colorValuePath == null) {\n return;\n }\n for (var i = 0; i < bubbleSettings.dataSource.length; i++) {\n var bubbledata = parseFloat(bubbleSettings.dataSource[i][bubbleSettings.valuePath]);\n if (i !== 0) {\n if (bubbledata > range.max) {\n range.max = bubbledata;\n }\n else if (bubbledata < range.min) {\n range.min = bubbledata;\n }\n }\n else {\n range.max = range.min = bubbledata;\n }\n }\n }\n };\n // tslint:disable-next-line:max-func-body-length\n LayerPanel.prototype.calculatePathCollection = function (layerIndex, renderData) {\n var _this = this;\n this.groupElements = [];\n if ((!isCustomPath(renderData))) {\n this.currentFactor = this.calculateFactor(this.currentLayer);\n }\n this.rectBounds = null;\n var shapeSettings = this.currentLayer.shapeSettings;\n renderData.forEach(function (geometryData, index) {\n if (!isNullOrUndefined(geometryData['geometry']) || !isNullOrUndefined(geometryData['coordinates'])) {\n var type = !isNullOrUndefined(geometryData['geometry']) ? geometryData['geometry']['type'] : geometryData['type'];\n var coords = !isNullOrUndefined(geometryData['geometry']) ? geometryData['geometry']['coordinates'] :\n geometryData['coordinates'];\n var data = geometryData['geometry'];\n var properties = geometryData['properties'];\n _this.generatePoints(type, coords, data, properties);\n }\n });\n this.currentLayer.rectBounds = this.rectBounds;\n if (isNullOrUndefined(this.mapObject.baseMapRectBounds) && this.currentLayer.isBaseLayer) {\n this.mapObject.baseMapRectBounds = this.rectBounds;\n }\n var colors = shapeSettings.palette.length > 1 ? shapeSettings.palette : getShapeColor(this.mapObject.theme);\n var labelTemplateEle = createElement('div', {\n id: this.mapObject.element.id + '_LayerIndex_' + layerIndex + '_Label_Template_Group',\n className: 'template',\n styles: 'pointer-events: none; overflow: hidden; position: absolute;' +\n 'top:' + this.mapObject.mapAreaRect.y + 'px;' +\n 'left:' + this.mapObject.mapAreaRect.x + 'px;' +\n 'height:' + this.mapObject.mapAreaRect.height + 'px;' +\n 'width:' + this.mapObject.mapAreaRect.width + 'px;'\n });\n var _loop_1 = function (i) {\n var k = void 0;\n var currentShapeData = this_1.currentLayer.layerData[i];\n var pathOptions = void 0;\n var polyLineOptions = void 0;\n var circleOptions = void 0;\n var groupElement = void 0;\n var drawObject = void 0;\n var path = '';\n var points = '';\n var getShapeColor_1 = void 0;\n var fill = (shapeSettings.autofill) ? colors[i % colors.length] : shapeSettings.fill;\n var opacity = void 0;\n if (shapeSettings.colorValuePath !== null && !isNullOrUndefined(currentShapeData['property'])) {\n k = checkShapeDataFields(this_1.currentLayer.dataSource, currentShapeData['property'], this_1.currentLayer.shapeDataPath, this_1.currentLayer.shapePropertyPath);\n if (k !== null && shapeSettings.colorMapping.length === 0) {\n fill = this_1.currentLayer.dataSource[k][shapeSettings.colorValuePath];\n }\n else if (currentShapeData['property'][shapeSettings.colorValuePath] &&\n this_1.currentLayer.dataSource.length === 0 && shapeSettings.colorMapping.length === 0) {\n fill = currentShapeData['property'][shapeSettings.colorValuePath];\n }\n }\n var shapeID = this_1.mapObject.element.id + '_LayerIndex_' + layerIndex + '_shapeIndex_' + i + '_dataIndex_' + k;\n getShapeColor_1 = this_1.getShapeColorMapping(this_1.currentLayer, currentShapeData['property'], fill);\n fill = Object.prototype.toString.call(getShapeColor_1) === '[object Object]' && !isNullOrUndefined(getShapeColor_1['fill'])\n ? getShapeColor_1['fill'] : fill;\n opacity = (Object.prototype.toString.call(getShapeColor_1) === '[object Object]'\n && !isNullOrUndefined(getShapeColor_1['opacity'])) ? getShapeColor_1['opacity'] : shapeSettings.opacity;\n var eventArgs = {\n cancel: false, name: shapeRendering, index: i,\n data: this_1.currentLayer.dataSource ? this_1.currentLayer.dataSource[k] : null, maps: this_1.mapObject,\n shape: shapeSettings, fill: fill, border: { width: shapeSettings.border.width, color: shapeSettings.border.color }\n };\n this_1.mapObject.trigger(shapeRendering, eventArgs);\n var drawingType = !isNullOrUndefined(currentShapeData['_isMultiPolygon'])\n ? 'MultiPolygon' : isNullOrUndefined(currentShapeData['type']) ? currentShapeData[0]['type'] : currentShapeData['type'];\n drawingType = (drawingType === 'Polygon' || drawingType === 'MultiPolygon') ? 'Polygon' : drawingType;\n if (this_1.groupElements.length < 1) {\n groupElement = this_1.mapObject.renderer.createGroup({\n id: this_1.mapObject.element.id + '_LayerIndex_' + layerIndex + '_' + drawingType + '_Group', transform: ''\n });\n this_1.groupElements.push(groupElement);\n }\n else {\n for (var i_1 = 0; i_1 < this_1.groupElements.length; i_1++) {\n var ele = this_1.groupElements[i_1];\n if (ele.id.indexOf(drawingType) > -1) {\n groupElement = ele;\n break;\n }\n else if (i_1 >= this_1.groupElements.length - 1) {\n groupElement = this_1.mapObject.renderer.createGroup({\n id: this_1.mapObject.element.id + '_LayerIndex_' + layerIndex + '_' + drawingType + '_Group'\n });\n this_1.groupElements.push(groupElement);\n break;\n }\n }\n }\n var pathEle = void 0;\n switch (drawingType) {\n case 'Polygon':\n if (!currentShapeData['_isMultiPolygon']) {\n path += 'M' + (currentShapeData[0]['point']['x']) + ' ' + (currentShapeData[0]['point']['y']);\n currentShapeData.map(function (shapeData) {\n path += ' L ' + (shapeData['point']['x']) + ' ' + (shapeData['point']['y']);\n });\n }\n else {\n path = this_1.generateMultiPolygonPath(currentShapeData);\n }\n path += ' z ';\n if (path.length > 3) {\n pathOptions = new PathOption(shapeID, eventArgs.fill, eventArgs.border.width, eventArgs.border.color, opacity, shapeSettings.dashArray, path);\n pathEle = this_1.mapObject.renderer.drawPath(pathOptions);\n }\n break;\n case 'LineString':\n currentShapeData.map(function (lineData) {\n points += lineData['point']['x'] + ' , ' + lineData['point']['y'] + ' ';\n });\n polyLineOptions = new PolylineOption(shapeID, points, eventArgs.fill, eventArgs.border.width, eventArgs.border.color, opacity, shapeSettings.dashArray);\n pathEle = this_1.mapObject.renderer.drawPolyline(polyLineOptions);\n break;\n case 'Point':\n var pointData = currentShapeData['point'];\n circleOptions = new CircleOption(shapeID, eventArgs.fill, eventArgs.border, opacity, pointData['x'], pointData['y'], shapeSettings.circleRadius, null);\n pathEle = this_1.mapObject.renderer.drawCircle(circleOptions);\n break;\n case 'Path':\n path = currentShapeData['point'];\n pathOptions = new PathOption(shapeID, eventArgs.fill, eventArgs.border.width, eventArgs.border.color, opacity, shapeSettings.dashArray, path);\n pathEle = this_1.mapObject.renderer.drawPath(pathOptions);\n break;\n }\n if (!isNullOrUndefined(pathEle)) {\n var property = (Object.prototype.toString.call(this_1.currentLayer.shapePropertyPath) === '[object Array]' ?\n this_1.currentLayer.shapePropertyPath : [this_1.currentLayer.shapePropertyPath]);\n // tslint:disable-next-line:align\n var properties = void 0;\n for (var j = 0; j < property.length; j++) {\n if (!isNullOrUndefined(currentShapeData['property'])) {\n properties = property[j];\n break;\n }\n }\n pathEle.setAttribute('aria-label', ((!isNullOrUndefined(currentShapeData['property'])) ?\n (currentShapeData['property'][properties]) : ''));\n pathEle.setAttribute('tabindex', (this_1.mapObject.tabIndex + i + 2).toString());\n groupElement.appendChild(pathEle);\n }\n };\n var this_1 = this;\n for (var i = 0; i < this.currentLayer.layerData.length; i++) {\n _loop_1(i);\n }\n var bubbleG;\n if (this.currentLayer.bubbleSettings.length && this.mapObject.bubbleModule) {\n var length_1 = this.currentLayer.bubbleSettings.length;\n var bubble_1;\n var _loop_2 = function (j) {\n bubble_1 = this_2.currentLayer.bubbleSettings[j];\n bubbleG = this_2.mapObject.renderer.createGroup({\n id: this_2.mapObject.element.id + '_LayerIndex_' + layerIndex + '_bubble_Group_' + j\n });\n var range = { min: 0, max: 0 };\n this_2.bubbleCalculation(bubble_1, range);\n bubble_1.dataSource.map(function (bubbleData, i) {\n _this.renderBubble(_this.currentLayer, bubbleData, colors[i % colors.length], range, j, i, bubbleG, layerIndex, bubble_1);\n });\n this_2.groupElements.push(bubbleG);\n };\n var this_2 = this;\n for (var j = 0; j < length_1; j++) {\n _loop_2(j);\n }\n }\n var group = (this.mapObject.renderer.createGroup({\n id: this.mapObject.element.id + '_LayerIndex_' + layerIndex + '_dataLableIndex_Group', style: 'pointer-events: none;'\n }));\n if (this.mapObject.dataLabelModule && this.currentLayer.dataLabelSettings.visible) {\n renderData.map(function (currentShapeData, i) {\n _this.renderLabel(_this.currentLayer, layerIndex, currentShapeData, group, i, labelTemplateEle);\n });\n this.groupElements.push(group);\n }\n if (this.mapObject.navigationLineModule) {\n this.groupElements.push(this.mapObject.navigationLineModule.renderNavigation(this.currentLayer, this.currentFactor, layerIndex));\n }\n this.groupElements.map(function (element) {\n _this.layerObject.appendChild(element);\n });\n if (this.mapObject.markerModule) {\n this.mapObject.markerModule.markerRender(this.layerObject, layerIndex, this.currentFactor, null);\n }\n this.translateLayerElements(this.layerObject, layerIndex);\n this.layerGroup.appendChild(this.layerObject);\n };\n /**\n * render datalabel\n */\n LayerPanel.prototype.renderLabel = function (layer, layerIndex, shape, group, shapeIndex, labelTemplateEle) {\n this.mapObject.dataLabelModule.renderLabel(layer, layerIndex, shape, layer.layerData, group, labelTemplateEle, shapeIndex);\n };\n /**\n * To render path for multipolygon\n */\n LayerPanel.prototype.generateMultiPolygonPath = function (currentShapeData) {\n var path = '';\n var shape;\n for (var j = 0; j < currentShapeData.length; j++) {\n path += 'M' + (currentShapeData[j][0]['point']['x']) + ' ' + (currentShapeData[j][0]['point']['y']);\n shape = currentShapeData[j];\n shape.map(function (shapeData) {\n path += ' L ' + (shapeData['point']['x']) + ' ' + (shapeData['point']['y']);\n });\n }\n return path;\n };\n /**\n * To render bubble\n */\n LayerPanel.prototype.renderBubble = function (layer, bubbleData, color, range, bubbleIndex, dataIndex, group, layerIndex, bubbleSettings) {\n if (isNullOrUndefined(this.mapObject.bubbleModule) || !bubbleSettings.visible) {\n return null;\n }\n color = bubbleSettings.fill ? bubbleSettings.fill : color;\n this.mapObject.bubbleModule.id = this.mapObject.element.id + '_LayerIndex_' + layerIndex + '_BubbleIndex_' +\n bubbleIndex + '_dataIndex_' + dataIndex;\n this.mapObject.bubbleModule.renderBubble(bubbleSettings, bubbleData, color, range, bubbleIndex, dataIndex, layerIndex, layer, group);\n };\n /**\n * To get the shape color from color mapping module\n */\n LayerPanel.prototype.getShapeColorMapping = function (layer, shape, color) {\n color = color ? color : layer.shapeSettings.fill;\n if (layer.shapeSettings.colorMapping.length === 0 && isNullOrUndefined(layer.dataSource)) {\n return color;\n }\n var index = checkShapeDataFields(layer.dataSource, shape, layer.shapeDataPath, layer.shapePropertyPath);\n var colorMapping = new ColorMapping(this.mapObject);\n if (isNullOrUndefined(layer.dataSource[index])) {\n return color;\n }\n return colorMapping.getShapeColorMapping(layer.shapeSettings, layer.dataSource[index], color);\n };\n LayerPanel.prototype.generatePoints = function (type, coordinates, data, properties) {\n var _this = this;\n var latitude;\n var longitude;\n var newData = [];\n switch (type.toLowerCase()) {\n case 'polygon':\n newData = this.calculatePolygonBox(coordinates[0], data, properties);\n if (newData.length > 0) {\n newData['property'] = properties;\n newData['type'] = type;\n newData['_isMultiPolygon'] = false;\n this.currentLayer.layerData.push(newData);\n }\n break;\n case 'multipolygon':\n var multiPolygonDatas = [];\n for (var i = 0; i < coordinates.length; i++) {\n newData = this.calculatePolygonBox(coordinates[i][0], data, properties);\n if (newData.length > 0) {\n multiPolygonDatas.push(newData);\n }\n }\n multiPolygonDatas['property'] = properties;\n multiPolygonDatas['type'] = type;\n multiPolygonDatas['_isMultiPolygon'] = true;\n this.currentLayer.layerData.push(multiPolygonDatas);\n break;\n case 'linestring':\n coordinates.map(function (points, index) {\n latitude = points[1];\n longitude = points[0];\n var point = convertGeoToPoint(latitude, longitude, _this.currentFactor, _this.currentLayer, _this.mapObject);\n newData.push({\n point: point, lat: latitude, lng: longitude\n });\n });\n newData['property'] = properties;\n newData['type'] = type;\n this.currentLayer.layerData.push(newData);\n break;\n case 'point':\n latitude = coordinates[1];\n longitude = coordinates[0];\n var point = convertGeoToPoint(latitude, longitude, this.currentFactor, this.currentLayer, this.mapObject);\n this.currentLayer.layerData.push({\n point: point, type: type, lat: latitude, lng: longitude, property: properties\n });\n break;\n case 'path':\n this.currentLayer.layerData.push({\n point: data['d'], type: type, property: properties\n });\n break;\n }\n };\n LayerPanel.prototype.calculateFactor = function (layer) {\n var horFactor;\n var verFactor = 1;\n var divide = 10;\n var exp = 'e+1';\n var bounds = this.mapObject.baseMapBounds;\n var mapSize = new Size(this.mapObject.mapAreaRect.width, this.mapObject.mapAreaRect.height - 5);\n var mapHeight;\n var mapWidth;\n if (bounds) {\n var start = convertGeoToPoint(bounds.latitude.min, bounds.longitude.min, null, layer, this.mapObject);\n var end = convertGeoToPoint(bounds.latitude.max, bounds.longitude.max, null, layer, this.mapObject);\n mapHeight = end.y - start.y;\n mapWidth = end.x - start.x;\n }\n else {\n mapHeight = mapWidth = 500;\n }\n if (mapHeight < mapSize.height) {\n horFactor = parseFloat(Math.abs(Number(mapSize.height / Number(mapHeight.toString() + exp)) * 100).toString().split('.')[0])\n / divide;\n }\n else {\n horFactor = mapSize.height / mapHeight;\n }\n if (mapWidth < mapSize.width) {\n verFactor = parseFloat(Math.abs(Number(mapSize.width / Number(mapWidth.toString() + exp)) * 100).toString().split('.')[0])\n / divide;\n }\n else {\n verFactor = mapSize.width / mapWidth;\n }\n return (Math.min(verFactor, horFactor));\n };\n LayerPanel.prototype.translateLayerElements = function (layerElement, index) {\n var childNode;\n if (!isNullOrUndefined(this.mapObject.baseMapRectBounds)) {\n var duration = this.currentLayer.animationDuration;\n var animate = duration !== 0 || isNullOrUndefined(this.mapObject.zoomModule);\n var translate = getTranslate(this.mapObject, this.currentLayer, animate);\n var scale = this.mapObject.previousScale = translate['scale'];\n var location_1 = this.mapObject.previousPoint = translate['location'];\n this.mapObject.baseTranslatePoint = this.mapObject.translatePoint = location_1;\n this.mapObject.baseScale = this.mapObject.scale = scale;\n for (var i = 0; i < layerElement.childElementCount; i++) {\n childNode = layerElement.childNodes[i];\n if (!(childNode.id.indexOf('_Markers_Group') > -1) &&\n (!(childNode.id.indexOf('_bubble_Group') > -1)) &&\n (!(childNode.id.indexOf('_dataLableIndex_Group') > -1))) {\n var transform = 'scale( ' + scale + ' ) '\n + 'translate( ' + location_1.x + ' ' + location_1.y + ' ) ';\n childNode.setAttribute('transform', transform);\n if (duration > 0 && !isNullOrUndefined(this.mapObject.zoomModule)) {\n translate = getTranslate(this.mapObject, this.currentLayer);\n this.mapObject.scale = translate['scale'];\n this.mapObject.translatePoint = translate['location'];\n }\n }\n }\n }\n else if (this.mapObject.isTileMap) {\n for (var j = 0; j < layerElement.childElementCount; j++) {\n childNode = layerElement.childNodes[j];\n if (!(childNode.id.indexOf('_Markers_Group') > -1) &&\n (!(childNode.id.indexOf('_bubble_Group') > -1)) &&\n (!(childNode.id.indexOf('_dataLableIndex_Group') > -1)) &&\n (!(childNode.id.indexOf('_line_Group') > -1))) {\n var transform = 'scale( ' + this.mapObject.scale + ' ) ' + 'translate( ' + this.mapObject.translatePoint.x\n + ' ' + this.mapObject.translatePoint.y + ' ) ';\n childNode.setAttribute('transform', transform);\n }\n }\n }\n };\n LayerPanel.prototype.calculateRectBounds = function (layerData) {\n var _this = this;\n layerData.forEach(function (obj, index) {\n if (!isNullOrUndefined(obj['geometry']) || !isNullOrUndefined(obj['coordinates'])) {\n var type = !isNullOrUndefined(obj['geometry']) ? obj['geometry']['type'] : obj['type'];\n var coordinates = !isNullOrUndefined(obj['geometry']) ? obj['geometry']['coordinates'] : obj['coordinates'];\n switch (type.toLowerCase()) {\n case 'polygon':\n _this.calculateRectBox(coordinates[0]);\n break;\n case 'multipolygon':\n coordinates.map(function (point, index) {\n _this.calculateRectBox(point[0]);\n });\n break;\n }\n }\n });\n };\n LayerPanel.prototype.calculatePolygonBox = function (coordinates, data, properties) {\n var _this = this;\n var newData = [];\n var bounds = this.mapObject.baseMapBounds;\n coordinates.map(function (currentPoint, index) {\n var latitude = currentPoint[1];\n var longitude = currentPoint[0];\n if ((longitude >= bounds.longitude.min && longitude <= bounds.longitude.max)\n && (latitude >= bounds.latitude.min && latitude <= bounds.latitude.max)) {\n var point = convertGeoToPoint(latitude, longitude, _this.currentFactor, _this.currentLayer, _this.mapObject);\n if (isNullOrUndefined(_this.rectBounds)) {\n _this.rectBounds = { min: { x: point.x, y: point.y }, max: { x: point.x, y: point.y } };\n }\n else {\n _this.rectBounds['min']['x'] = Math.min(_this.rectBounds['min']['x'], point.x);\n _this.rectBounds['min']['y'] = Math.min(_this.rectBounds['min']['y'], point.y);\n _this.rectBounds['max']['x'] = Math.max(_this.rectBounds['max']['x'], point.x);\n _this.rectBounds['max']['y'] = Math.max(_this.rectBounds['max']['y'], point.y);\n }\n newData.push({\n point: point,\n lat: latitude,\n lng: longitude\n });\n }\n });\n return newData;\n };\n LayerPanel.prototype.calculateRectBox = function (coordinates) {\n var _this = this;\n coordinates.forEach(function (currentCoords) {\n if (isNullOrUndefined(_this.mapObject.baseMapBounds)) {\n _this.mapObject.baseMapBounds = new GeoLocation({ min: currentCoords[1], max: currentCoords[1] }, { min: currentCoords[0], max: currentCoords[0] });\n }\n else {\n _this.mapObject.baseMapBounds.latitude.min = Math.min(_this.mapObject.baseMapBounds.latitude.min, currentCoords[1]);\n _this.mapObject.baseMapBounds.latitude.max = Math.max(_this.mapObject.baseMapBounds.latitude.max, currentCoords[1]);\n _this.mapObject.baseMapBounds.longitude.min = Math.min(_this.mapObject.baseMapBounds.longitude.min, currentCoords[0]);\n _this.mapObject.baseMapBounds.longitude.max = Math.max(_this.mapObject.baseMapBounds.longitude.max, currentCoords[0]);\n }\n });\n };\n LayerPanel.prototype.generateTiles = function (zoomLevel, tileTranslatePoint, bing) {\n var userLang = this.mapObject.locale;\n var size = this.mapObject.availableSize;\n this.tiles = [];\n var xcount;\n var ycount;\n xcount = ycount = Math.pow(2, zoomLevel);\n var width = size.width / 2;\n var height = size.height / 2;\n var baseLayer = this.mapObject.layers[this.mapObject.baseLayerIndex];\n this.urlTemplate = baseLayer.urlTemplate;\n var endY = Math.min(ycount, ((-tileTranslatePoint.y + size.height) / 256) + 1);\n var endX = Math.min(xcount, ((-tileTranslatePoint.x + size.width) / 256) + 1);\n var startX = (-(tileTranslatePoint.x + 256) / 256);\n var startY = (-(tileTranslatePoint.y + 256) / 256);\n bing = bing || this.bing || this.mapObject['bingMap'];\n for (var i = Math.round(startX); i < Math.round(endX); i++) {\n for (var j = Math.round(startY); j < Math.round(endY); j++) {\n var x = 256 * i + tileTranslatePoint.x;\n var y = 256 * j + tileTranslatePoint.y;\n if (x > -256 && x <= size.width && y > -256 && y < size.height) {\n if (i >= 0 && j >= 0) {\n var tile = new Tile(i, j);\n tile.left = x;\n tile.top = y;\n if (baseLayer.layerType === 'Bing') {\n var key = baseLayer.key;\n tile.src = bing.getBingMap(tile, key, baseLayer.bingMapType, userLang, bing.imageUrl, bing.subDomains);\n }\n else {\n tile.src = this.urlTemplate.replace('level', zoomLevel.toString()).replace('tileX', tile.x.toString())\n .replace('tileY', tile.y.toString());\n }\n this.tiles.push(tile);\n }\n }\n }\n }\n var proxTiles = extend([], this.tiles, [], true);\n for (var _i = 0, _a = this.mapObject.layers; _i < _a.length; _i++) {\n var layer = _a[_i];\n if (!(layer.type === 'SubLayer' && layer.visible)) {\n continue;\n }\n if (layer.layerType === 'OSM' || layer.layerType === 'Bing') {\n for (var _b = 0, proxTiles_1 = proxTiles; _b < proxTiles_1.length; _b++) {\n var baseTile = proxTiles_1[_b];\n var subtile = extend(baseTile, {}, {}, true);\n if (layer.layerType === 'Bing') {\n subtile.src = bing.getBingMap(subtile, layer.key, layer.bingMapType, userLang, bing.imageUrl, bing.subDomains);\n }\n else {\n subtile.src = layer.urlTemplate.replace('level', zoomLevel.toString()).replace('tileX', baseTile.x.toString())\n .replace('tileY', baseTile.y.toString());\n }\n this.tiles.push(subtile);\n }\n }\n }\n this.arrangeTiles();\n };\n LayerPanel.prototype.arrangeTiles = function () {\n var htmlString = this.templateCompiler(this.tiles);\n if (getElementByID(this.mapObject.element.id + '_tile_parent')) {\n document.getElementById(this.mapObject.element.id + '_tile_parent').innerHTML = htmlString;\n }\n };\n LayerPanel.prototype.templateCompiler = function (tiles) {\n var tileElment = '';\n for (var _i = 0, tiles_1 = tiles; _i < tiles_1.length; _i++) {\n var tile = tiles_1[_i];\n tileElment += '![](\"')
';\n }\n return tileElment;\n };\n LayerPanel.prototype.panTileMap = function (factorX, factorY, centerPosition) {\n var level = this.mapObject.tileZoomLevel;\n var padding = 20;\n var x;\n var y;\n var totalSize = Math.pow(2, level) * 256;\n x = (factorX / 2) - (totalSize / 2);\n y = (factorY / 2) - (totalSize / 2);\n var position = convertTileLatLongToPoint(centerPosition, level, { x: x, y: y }, this.isMapCoordinates);\n x -= position.x - (factorX / 2);\n y = (y - (position.y - (factorY / 2))) + padding;\n this.mapObject.scale = Math.pow(2, level - 1);\n this.mapObject.translatePoint = new Point(((x - (0.5 * this.mapObject.scale)) / this.mapObject.scale), ((y - (0.5 * this.mapObject.scale)) / this.mapObject.scale));\n return new Point(x, y);\n };\n return LayerPanel;\n}());\nexport { LayerPanel };\n","import { annotationRendering } from '../index';\nimport { createElement, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { getTemplateFunction, getElementOffset, getElementByID } from '../utils/helper';\n/**\n * Represent the annotation rendering for map\n */\nvar Annotations = /** @class */ (function () {\n function Annotations(map) {\n this.map = map;\n }\n Annotations.prototype.renderAnnotationElements = function () {\n var _this = this;\n var secondaryID = this.map.element.id + '_Secondary_Element';\n var annotationGroup = createElement('div', { id: this.map.element.id + '_Annotations_Group' });\n annotationGroup.style.position = 'absolute';\n annotationGroup.style.top = '0px';\n annotationGroup.style.left = '0px';\n this.map.annotations.map(function (annotation, index) {\n if (annotation.content !== null) {\n _this.createAnnotationTemplate(annotationGroup, annotation, index);\n }\n });\n if (annotationGroup.childElementCount > 0 && !(isNullOrUndefined(getElementByID(secondaryID)))) {\n getElementByID(secondaryID).appendChild(annotationGroup);\n }\n };\n /**\n * To create annotation elements\n */\n Annotations.prototype.createAnnotationTemplate = function (parentElement, annotation, annotationIndex) {\n var left;\n var top;\n var templateFn;\n var map = this.map;\n var templateElement;\n var availSize = map.availableSize;\n var id = map.element.id + '_Annotation_' + annotationIndex;\n var childElement = createElement('div', {\n id: map.element.id + '_Annotation_' + annotationIndex, styles: 'position: absolute; z-index:' + annotation.zIndex + ';'\n });\n var argsData = {\n cancel: false, name: annotationRendering, content: annotation.content,\n annotation: annotation\n };\n this.map.trigger(annotationRendering, argsData);\n templateFn = getTemplateFunction(argsData.content);\n if (templateFn && templateFn(this.map).length) {\n templateElement = Array.prototype.slice.call(templateFn(this.map));\n var length_1 = templateElement.length;\n for (var i = 0; i < length_1; i++) {\n childElement.appendChild(templateElement[i]);\n }\n }\n else {\n childElement.appendChild(createElement('div', {\n innerHTML: argsData.content\n }));\n }\n var offset = getElementOffset(childElement.cloneNode(true), map.element);\n var elementRect = map.element.getBoundingClientRect();\n var bounds = map.svgObject.getBoundingClientRect();\n left = Math.abs(bounds.left - elementRect.left);\n top = Math.abs(bounds.top - elementRect.top);\n var annotationXValue = (annotation.x.indexOf('%') > -1) ? (availSize.width / 100) * parseFloat(annotation.x) :\n parseFloat(annotation.x);\n var annotationYValue = (annotation.y.indexOf('%') > -1) ? (availSize.height / 100) * parseFloat(annotation.y) :\n parseFloat(annotation.y);\n left = (annotation.horizontalAlignment === 'None') ? (left + annotationXValue) : left;\n top = (annotation.verticalAlignment === 'None') ? (top + annotationYValue) : top;\n switch (annotation.verticalAlignment) {\n case 'Near':\n top = (top + annotationYValue);\n break;\n case 'Center':\n top = (top + annotationYValue) + ((bounds.height / 2) - (offset.height / 2));\n break;\n case 'Far':\n top = (top + bounds.height + annotationYValue) - offset.height;\n break;\n }\n switch (annotation.horizontalAlignment) {\n case 'Near':\n left = (left + annotationXValue);\n break;\n case 'Center':\n left = (left + annotationXValue) + ((bounds.width / 2) - (offset.width / 2));\n break;\n case 'Far':\n left = (left + bounds.width + annotationXValue) - offset.width;\n break;\n }\n childElement.style.left = left + 'px';\n childElement.style.top = top + 'px';\n parentElement.appendChild(childElement);\n };\n /*\n * Get module name.\n */\n Annotations.prototype.getModuleName = function () {\n return 'Annotations';\n };\n /**\n * To destroy the annotation.\n * @return {void}\n * @private\n */\n Annotations.prototype.destroy = function (map) {\n // Destroy method performed here\n };\n return Annotations;\n}());\nexport { Annotations };\n","import { print as printWindow, createElement, isNullOrUndefined, Browser } from '@syncfusion/ej2-base';\nimport { getElement } from '../utils/helper';\nimport { beforePrint } from '../model/constants';\nimport { PdfPageOrientation, PdfDocument, PdfBitmap } from '@syncfusion/ej2-pdf-export';\n/**\n * Annotation Module handles the Annotation for Maps\n */\nvar ExportUtils = /** @class */ (function () {\n /**\n * Constructor for Maps\n * @param control\n */\n function ExportUtils(control) {\n this.control = control;\n }\n /**\n * To print the Maps\n * @param elements\n */\n ExportUtils.prototype.print = function (elements) {\n this.printWindow = window.open('', 'print', 'height=' + window.outerHeight + ',width=' + window.outerWidth + ',tabbar=no');\n this.printWindow.moveTo(0, 0);\n this.printWindow.resizeTo(screen.availWidth, screen.availHeight);\n var argsData = {\n cancel: false, htmlContent: this.getHTMLContent(elements), name: beforePrint\n };\n this.control.trigger(beforePrint, argsData);\n if (!argsData.cancel) {\n printWindow(argsData.htmlContent, this.printWindow);\n }\n };\n /**\n * To get the html string of the Maps\n * @param elements\n * @private\n */\n ExportUtils.prototype.getHTMLContent = function (elements) {\n var div = createElement('div');\n if (elements) {\n if (elements instanceof Array) {\n elements.forEach(function (value) {\n div.appendChild(getElement(value).cloneNode(true));\n });\n }\n else if (elements instanceof Element) {\n div.appendChild(elements.cloneNode(true));\n }\n else {\n div.appendChild(getElement(elements).cloneNode(true));\n }\n }\n else {\n div.appendChild(this.control.element.cloneNode(true));\n }\n return div;\n };\n /**\n * To export the file as image/svg format\n * @param type\n * @param fileName\n */\n ExportUtils.prototype.export = function (type, fileName, orientation) {\n var _this = this;\n var element = createElement('canvas', {\n id: 'ej2-canvas',\n attrs: {\n 'width': this.control.availableSize.width.toString(),\n 'height': this.control.availableSize.height.toString()\n }\n });\n var isDownload = !(Browser.userAgent.toString().indexOf('HeadlessChrome') > -1);\n orientation = isNullOrUndefined(orientation) ? PdfPageOrientation.Landscape : orientation;\n var svgData = '';\n var url = window.URL.createObjectURL(new Blob(type === 'SVG' ? [svgData] :\n [(new XMLSerializer()).serializeToString(this.control.svgObject)], { type: 'image/svg+xml' }));\n if (type === 'SVG') {\n this.triggerDownload(fileName, type, url, isDownload);\n }\n else {\n var image_1 = new Image();\n var ctx_1 = element.getContext('2d');\n image_1.onload = (function () {\n ctx_1.drawImage(image_1, 0, 0);\n window.URL.revokeObjectURL(url);\n if (type === 'PDF') {\n var document_1 = new PdfDocument();\n var imageString = element.toDataURL('image/jpeg').replace('image/jpeg', 'image/octet-stream');\n document_1.pageSettings.orientation = orientation;\n imageString = imageString.slice(imageString.indexOf(',') + 1);\n document_1.pages.add().graphics.drawImage(new PdfBitmap(imageString), 0, 0, (_this.control.availableSize.width - 60), _this.control.availableSize.height);\n if (isDownload) {\n document_1.save(fileName + '.pdf');\n document_1.destroy();\n }\n }\n else {\n _this.triggerDownload(fileName, type, element.toDataURL('image/png').replace('image/png', 'image/octet-stream'), isDownload);\n }\n });\n image_1.src = url;\n }\n };\n /**\n * To trigger the download element\n * @param fileName\n * @param type\n * @param url\n */\n ExportUtils.prototype.triggerDownload = function (fileName, type, url, isDownload) {\n createElement('a', {\n attrs: {\n 'download': fileName + '.' + type.toLocaleLowerCase(),\n 'href': url\n }\n }).dispatchEvent(new MouseEvent(isDownload ? 'click' : 'move', {\n view: window,\n bubbles: false,\n cancelable: true\n }));\n };\n return ExportUtils;\n}());\nexport { ExportUtils };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n/**\n * Maps Component file\n */\nimport { Component, NotifyPropertyChanges, Property, Ajax } from '@syncfusion/ej2-base';\nimport { EventHandler, Browser, isNullOrUndefined, createElement } from '@syncfusion/ej2-base';\nimport { Event, remove, L10n, Collection, Internationalization, Complex } from '@syncfusion/ej2-base';\nimport { SvgRenderer } from '@syncfusion/ej2-svg-base';\nimport { Size, createSvg, Point, removeElement, triggerShapeEvent, showTooltip, getElement, removeClass } from './utils/helper';\nimport { ZoomSettings, LegendSettings } from './model/base';\nimport { LayerSettings, TitleSettings, Border, Margin, MapsAreaSettings, Annotation } from './model/base';\nimport { Marker } from './layers/marker';\nimport { load, click, loaded, resize, shapeSelected } from './model/constants';\nimport { getThemeStyle } from './model/theme';\nimport { BingMap } from './layers/bing-map';\nimport { LayerPanel } from './layers/layer-panel';\nimport { Rect, RectOption, measureText, getElementByID, MapAjax } from '../maps/utils/helper';\nimport { findPosition, textTrim, TextOption, renderTextElement, convertGeoToPoint } from '../maps/utils/helper';\nimport { Annotations } from '../maps/user-interaction/annotation';\nimport { MarkerSettings } from './index';\nimport { changeBorderWidth } from './index';\nimport { DataManager, Query } from '@syncfusion/ej2-data';\nimport { ExportUtils } from '../maps/utils/export';\n/**\n * Represents the Maps control.\n * ```html\n *
\n * \n * ```\n */\nvar Maps = /** @class */ (function (_super) {\n __extends(Maps, _super);\n /**\n * Constructor for creating the widget\n */\n function Maps(options, element) {\n var _this = _super.call(this, options, element) || this;\n /**\n * Check layer whether is normal or tile\n * @private\n */\n _this.isTileMap = false;\n /** @private */\n _this.baseSize = new Size(0, 0);\n /** @private */\n _this.translatePoint = new Point(0, 0);\n /** @private */\n _this.baseTranslatePoint = new Point(0, 0);\n /** @private */\n _this.tileTranslatePoint = new Point(0, 0);\n /** @private */\n _this.baseTileTranslatePoint = new Point(0, 0);\n /** @private */\n _this.isDevice = false;\n return _this;\n }\n /**\n * Gets the localized label by locale keyword.\n * @param {string} key\n * @return {string}\n */\n Maps.prototype.getLocalizedLabel = function (key) {\n return this.localeObject.getConstant(key);\n };\n /**\n * Initializing pre-required values.\n */\n Maps.prototype.preRender = function () {\n this.isDevice = Browser.isDevice;\n this.initPrivateVariable();\n this.trigger(load, { maps: this });\n this.unWireEVents();\n this.createSVG();\n this.wireEVents();\n this.setCulture();\n };\n /**\n * To Initialize the control rendering.\n */\n Maps.prototype.render = function () {\n this.findBaseAndSubLayers();\n this.createSecondaryElement();\n this.addTabIndex();\n this.themeStyle = getThemeStyle(this.theme);\n this.renderBorder();\n this.renderTitle(this.titleSettings, 'title', null, null);\n this.renderArea();\n this.processRequestJsonData();\n };\n /* tslint:disable:no-string-literal */\n Maps.prototype.processRequestJsonData = function () {\n var _this = this;\n var length = this.layersCollection.length - 1;\n this.serverProcess = { request: 0, response: 0 };\n var queryModule;\n var localAjax;\n var ajaxModule;\n var dataModule;\n this.layersCollection.forEach(function (layer, layerIndex) {\n if (layer.shapeData instanceof DataManager) {\n _this.serverProcess['request']++;\n dataModule = layer.shapeData;\n queryModule = layer.query instanceof Query ? layer.query : new Query();\n var dataManager = dataModule.executeQuery(queryModule);\n dataManager.then(function (e) {\n _this.processResponseJsonData('DataManager', e, layer, 'ShapeData');\n });\n }\n else if (layer.shapeData instanceof MapAjax || layer.shapeData) {\n if (!isNullOrUndefined(layer.shapeData['dataOptions'])) {\n _this.processAjaxRequest(layer, layer.shapeData, 'ShapeData');\n }\n }\n if (layer.dataSource instanceof MapAjax || !isNullOrUndefined(layer.dataSource['dataOptions'])) {\n _this.processAjaxRequest(layer, layer.dataSource, 'DataSource');\n }\n if (_this.serverProcess['request'] === _this.serverProcess['response'] && length === layerIndex) {\n _this.processResponseJsonData(null);\n }\n });\n };\n // tslint:disable:no-any\n Maps.prototype.processAjaxRequest = function (layer, localAjax, type) {\n var _this = this;\n var ajaxModule;\n this.serverProcess['request']++;\n ajaxModule = new Ajax(localAjax.dataOptions, localAjax.type, localAjax.async, localAjax.contentType);\n ajaxModule.onSuccess = function (args) {\n _this.processResponseJsonData('Ajax', args, layer, type);\n };\n ajaxModule.send(localAjax.sendData);\n };\n /* tslint:disable:no-eval */\n Maps.prototype.processResponseJsonData = function (processType, data, layer, dataType) {\n this.serverProcess['response']++;\n if (processType) {\n if (dataType === 'ShapeData') {\n layer.shapeData = (processType === 'DataManager') ? !isNullOrUndefined(data['result']) ? data['result'] : data['actual'] :\n JSON.parse(data);\n }\n else {\n layer.dataSource = (processType === 'DataManager') ? !isNullOrUndefined(data['result']) ? data['result'] : data['actual'] :\n JSON.parse('[' + data + ']')[0];\n }\n }\n if (!isNullOrUndefined(processType) && this.serverProcess['request'] === this.serverProcess['response']) {\n var collection = this.layersCollection;\n this.layersCollection = [];\n for (var i = 0; i < collection.length; i++) {\n if (collection[i].isBaseLayer) {\n this.layersCollection.push(collection[i]);\n }\n }\n for (var j = 0; j < collection.length; j++) {\n if (!collection[j].isBaseLayer) {\n this.layersCollection.push(collection[j]);\n }\n }\n this.renderMap();\n }\n else if (isNullOrUndefined(processType)) {\n this.renderMap();\n }\n };\n Maps.prototype.renderMap = function () {\n if (this.legendModule && this.legendSettings.visible) {\n this.legendModule.renderLegend();\n }\n this.createTile();\n if (this.zoomSettings.enable && this.zoomModule) {\n this.zoomModule.createZoomingToolbars();\n }\n this.mapLayerPanel.measureLayerPanel();\n this.element.appendChild(this.svgObject);\n if (!isNullOrUndefined(document.getElementById(this.element.id + '_tile_parent'))) {\n var svg = this.svgObject.getBoundingClientRect();\n var element = document.getElementById(this.element.id);\n var tile = document.getElementById(this.element.id + '_tile_parent').getBoundingClientRect();\n var bottom = svg.bottom - tile.bottom - element.offsetTop;\n var left = parseFloat(document.getElementById(this.element.id + '_tile_parent').style.left) + element.offsetTop;\n document.getElementById(this.element.id + '_tile_parent').style.left = (tile.left < this.element.getBoundingClientRect().left ?\n left + this.margin.right + Math.abs(tile.left - this.element.getBoundingClientRect().left) : left) + 'px';\n var top_1 = parseFloat(document.getElementById(this.element.id + '_tile_parent').style.top) + element.offsetTop;\n var value = (bottom <= 10) ? top_1 : (top_1 * 2);\n document.getElementById(this.element.id + '_tile_parent').style.top = value + 'px';\n }\n //this.setSecondaryElementPosition();\n this.arrangeTemplate();\n if (this.annotationsModule) {\n this.annotationsModule.renderAnnotationElements();\n }\n this.zoomingChange();\n this.trigger(loaded, { maps: this });\n };\n /**\n * Render the map area border\n */\n Maps.prototype.renderArea = function () {\n var width = this.mapsArea.border.width;\n var background = this.mapsArea.background;\n if (width > 0 || (background || this.themeStyle.areaBackgroundColor)) {\n var rect = new RectOption(this.element.id + '_MapAreaBorder', background || this.themeStyle.areaBackgroundColor, this.mapsArea.border, 1, this.mapAreaRect);\n this.svgObject.appendChild(this.renderer.drawRectangle(rect));\n }\n };\n /**\n * To add tab index for map element\n */\n Maps.prototype.addTabIndex = function () {\n this.element.setAttribute('aria-label', this.description || 'Maps Element');\n this.element.setAttribute('tabindex', this.tabIndex.toString());\n };\n // private setSecondaryElementPosition(): void {\n // if (!this.isTileMap) {\n // let element: HTMLDivElement = getElementByID(this.element.id + '_Secondary_Element') as HTMLDivElement;\n // let rect: ClientRect = this.element.getBoundingClientRect();\n // let svgRect: ClientRect = getElementByID(this.element.id + '_svg').getBoundingClientRect();\n // element.style.marginLeft = Math.max(svgRect.left - rect.left, 0) + 'px';\n // element.style.marginTop = Math.max(svgRect.top - rect.top, 0) + 'px';\n // }\n // }\n Maps.prototype.zoomingChange = function () {\n var left;\n var top;\n if (getElementByID(this.element.id + '_Layer_Collections') && this.zoomModule) {\n this.zoomModule.layerCollectionEle = getElementByID(this.element.id + '_Layer_Collections');\n }\n if (this.isTileMap && getElementByID(this.element.id + '_Tile_SVG') && getElementByID(this.element.id + '_tile_parent')) {\n var tileRect = getElementByID(this.element.id + '_tile_parent').getBoundingClientRect();\n var tileSvgRect = getElementByID(this.element.id + '_Tile_SVG').getBoundingClientRect();\n left = (tileRect.left - tileSvgRect.left);\n top = (tileRect.top - tileSvgRect.top);\n getElementByID(this.element.id + '_Tile_SVG').setAttribute('transform', 'translate(' + left + ' ' + top + ')');\n var markerTemplateElements = document.getElementsByClassName('template');\n if (!isNullOrUndefined(markerTemplateElements) && markerTemplateElements.length > 0) {\n for (var i = 0; i < markerTemplateElements.length; i++) {\n var templateGroupEle = markerTemplateElements[i];\n templateGroupEle.style.left = left + 'px';\n templateGroupEle.style.top = top + 'px';\n }\n }\n }\n if (this.zoomSettings.zoomFactor >= 1) {\n if (this.zoomModule && this.zoomModule.toolBarGroup && this.zoomSettings.enable) {\n this.zoomModule.alignToolBar();\n }\n var elements = document.getElementById(this.element.id + '_Layer_Collections');\n if (!isNullOrUndefined(elements) && elements.childElementCount > 0) {\n for (var i = 0; i < elements.childNodes.length; i++) {\n var childElement = elements.childNodes[i];\n if (childElement.tagName === 'g') {\n var layerIndex = parseFloat(childElement.id.split('_LayerIndex_')[1].split('_')[0]);\n for (var j = 0; j < childElement.childNodes.length; j++) {\n var childNode = childElement.childNodes[j];\n if (!(childNode.id.indexOf('_Markers_Group') > -1) &&\n (!(childNode.id.indexOf('_bubble_Group') > -1)) &&\n (!(childNode.id.indexOf('_dataLableIndex_Group') > -1))) {\n changeBorderWidth(childNode, layerIndex, this.scale, this);\n }\n }\n }\n }\n }\n if (this.zoomModule && (this.previousScale !== this.scale)) {\n this.zoomModule.applyTransform(true);\n }\n }\n };\n Maps.prototype.createSecondaryElement = function () {\n if (isNullOrUndefined(document.getElementById(this.element.id + '_Secondary_Element'))) {\n var secondaryElement = createElement('div', {\n id: this.element.id + '_Secondary_Element',\n styles: 'position: absolute;z-index:1;'\n });\n this.element.appendChild(secondaryElement);\n }\n };\n Maps.prototype.arrangeTemplate = function () {\n var secondaryEle = getElementByID(this.element.id + '_Secondary_Element');\n if (document.getElementById(this.element.id + '_Legend_Border')) {\n document.getElementById(this.element.id + '_Legend_Border').style.pointerEvents = 'none';\n }\n var templateElements = document.getElementsByClassName('template');\n if (!isNullOrUndefined(templateElements) && templateElements.length > 0 && getElementByID(this.element.id + '_Layer_Collections')) {\n for (var i = 0; i < templateElements.length; i++) {\n var templateGroupEle = templateElements[i];\n if (!isNullOrUndefined(templateGroupEle) && templateGroupEle.childElementCount > 0) {\n var layerOffset = getElementByID(this.element.id + '_Layer_Collections').getBoundingClientRect();\n var elementOffset = getElementByID(templateGroupEle.id).getBoundingClientRect();\n for (var j = 0; j < templateGroupEle.childElementCount; j++) {\n var currentTemplate = templateGroupEle.childNodes[j];\n var templateOffset = currentTemplate.getBoundingClientRect();\n currentTemplate.style.left = ((this.isTileMap ? parseFloat(currentTemplate.style.left) :\n ((layerOffset.left < elementOffset.left ? (parseFloat(currentTemplate.style.left) -\n Math.abs(elementOffset.left - layerOffset.left)) : (parseFloat(currentTemplate.style.left) +\n Math.abs(elementOffset.left - layerOffset.left))))) - (templateOffset.width / 2)) + 'px';\n currentTemplate.style.top = ((this.isTileMap ? parseFloat(currentTemplate.style.top) :\n ((layerOffset.top < elementOffset.top ? (parseFloat(currentTemplate.style.top) -\n Math.abs(elementOffset.top - layerOffset.top)) : (parseFloat(currentTemplate.style.top) +\n Math.abs(elementOffset.top - layerOffset.top))))) - (templateOffset.height / 2)) + 'px';\n }\n }\n }\n }\n };\n Maps.prototype.createTile = function () {\n var mainLayer = this.layersCollection[0];\n var padding = 0;\n if (mainLayer.isBaseLayer && (mainLayer.layerType === 'OSM' || mainLayer.layerType === 'Bing')) {\n removeElement(this.element.id + '_tile_parent');\n var elementRect = this.element.getBoundingClientRect();\n var parentRect = this.element.parentElement.getBoundingClientRect();\n var left = Math.abs(elementRect.left - parentRect.left);\n var top_2 = Math.abs(elementRect.top - parentRect.top);\n var ele = createElement('div', {\n id: this.element.id + '_tile_parent', styles: 'position: absolute; left: ' +\n (this.mapAreaRect.x + left) + 'px; top: ' + (this.mapAreaRect.y + top_2 + padding) + 'px; height: ' +\n (this.mapAreaRect.height) + 'px; width: '\n + (this.mapAreaRect.width) + 'px; overflow: hidden;'\n });\n this.element.appendChild(ele);\n }\n };\n /**\n * To initilize the private varibales of maps.\n */\n Maps.prototype.initPrivateVariable = function () {\n if (this.element.id === '') {\n var collection = document.getElementsByClassName('e-maps').length;\n this.element.id = 'maps_control_' + collection;\n }\n this.renderer = new SvgRenderer(this.element.id);\n this.mapLayerPanel = new LayerPanel(this);\n };\n Maps.prototype.findBaseAndSubLayers = function () {\n var _this = this;\n var baseIndex = this.baseLayerIndex;\n var mainLayers = [];\n var subLayers = [];\n this.layersCollection = [];\n this.layers.forEach(function (layer) {\n (layer.type === 'Layer') ? mainLayers.push(layer) : subLayers.push(layer);\n });\n for (var i = 0; i < mainLayers.length; i++) {\n var baseLayer = mainLayers[i];\n if (baseLayer.visible && baseIndex === i) {\n baseLayer.isBaseLayer = true;\n this.isTileMap = (baseLayer.layerType === 'Geometry') ? false : true;\n this.layersCollection.push(baseLayer);\n break;\n }\n else if (i === mainLayers.length - 1) {\n this.layersCollection.push(mainLayers[0]);\n break;\n }\n }\n subLayers.map(function (subLayer, subLayerIndex) {\n if (subLayer.visible) {\n _this.layersCollection.push(subLayer);\n }\n });\n };\n /**\n * @private\n * Render the map border\n */\n Maps.prototype.renderBorder = function () {\n var width = this.border.width;\n var borderElement = this.svgObject.querySelector('#' + this.element.id + '_MapBorder');\n if ((width > 0 || (this.background || this.themeStyle.backgroundColor)) && isNullOrUndefined(borderElement)) {\n var borderRect = new RectOption(this.element.id + '_MapBorder', this.background || this.themeStyle.backgroundColor, this.border, 1, new Rect(width / 2, width / 2, this.availableSize.width - width, this.availableSize.height - width));\n this.svgObject.appendChild(this.renderer.drawRectangle(borderRect));\n }\n else {\n borderElement.setAttribute('fill', this.background || this.themeStyle.backgroundColor);\n }\n };\n /**\n * @private\n * Render the title and subtitle\n */\n Maps.prototype.renderTitle = function (title, type, bounds, groupEle) {\n var style = title.textStyle;\n var height;\n var width = Math.abs((this.margin.left + this.margin.right) - this.availableSize.width);\n style.fontFamily = this.themeStyle.fontFamily || style.fontFamily;\n style.size = this.themeStyle.titleFontSize || style.size;\n if (title.text) {\n if (isNullOrUndefined(groupEle)) {\n groupEle = this.renderer.createGroup({ id: this.element.id + '_Title_Group' });\n }\n var trimmedTitle = textTrim(width, title.text, style);\n var elementSize = measureText(trimmedTitle, style);\n var rect = (isNullOrUndefined(bounds)) ? new Rect(this.margin.left, this.margin.top, this.availableSize.width, this.availableSize.height) : bounds;\n var location_1 = findPosition(rect, title.alignment, elementSize, type);\n var options = new TextOption(this.element.id + '_Map_' + type, location_1.x, location_1.y, 'start', trimmedTitle);\n var titleBounds = new Rect(location_1.x, location_1.y, elementSize.width, elementSize.height);\n var element = renderTextElement(options, style, style.color || (type === 'title' ? this.themeStyle.titleFontColor : this.themeStyle.subTitleFontColor), groupEle);\n element.setAttribute('aria-label', this.description || title.text);\n element.setAttribute('tabindex', (this.tabIndex + (type === 'title' ? 1 : 2)).toString());\n if ((type === 'title' && !title.subtitleSettings.text) || (type === 'subtitle')) {\n height = Math.abs((titleBounds.y + this.margin.bottom) - this.availableSize.height);\n this.mapAreaRect = new Rect(this.margin.left, titleBounds.y + 10, width, height - 10);\n }\n if (type !== 'subtitle' && title.subtitleSettings.text) {\n this.renderTitle(title.subtitleSettings, 'subtitle', titleBounds, groupEle);\n }\n else {\n this.svgObject.appendChild(groupEle);\n }\n }\n else {\n height = Math.abs((this.margin.top + this.margin.bottom) - this.availableSize.height);\n this.mapAreaRect = new Rect(this.margin.left, this.margin.top, width, height);\n }\n };\n /**\n * To create svg element for maps\n */\n Maps.prototype.createSVG = function () {\n this.removeSvg();\n createSvg(this);\n };\n /**\n * To Remove the SVG\n */\n Maps.prototype.removeSvg = function () {\n removeElement(this.element.id + '_Secondary_Element');\n removeElement(this.element.id + '_tile_parent');\n if (document.getElementsByClassName('e-tooltip-wrap')[0]) {\n remove(document.getElementsByClassName('e-tooltip-wrap')[0]);\n }\n if (this.svgObject) {\n while (this.svgObject.childNodes.length > 0) {\n this.svgObject.removeChild(this.svgObject.firstChild);\n }\n if (!this.svgObject.hasChildNodes() && this.svgObject.parentNode) {\n remove(this.svgObject);\n }\n }\n };\n /**\n * To bind event handlers for maps.\n */\n Maps.prototype.wireEVents = function () {\n //let cancelEvent: string = Browser.isPointer ? 'pointerleave' : 'mouseleave';\n EventHandler.add(this.element, 'click', this.mapsOnClick, this);\n // EventHandler.add(this.element, 'contextmenu', this.mapsOnRightClick, this);\n EventHandler.add(this.element, 'dblclick', this.mapsOnDoubleClick, this);\n EventHandler.add(this.element, Browser.touchStartEvent, this.mouseDownOnMap, this);\n EventHandler.add(this.element, Browser.touchMoveEvent, this.mouseMoveOnMap, this);\n EventHandler.add(this.element, Browser.touchEndEvent, this.mouseEndOnMap, this);\n EventHandler.add(this.element, 'pointerleave mouseleave', this.mouseLeaveOnMap, this);\n // EventHandler.add(this.element, cancelEvent, this.mouseLeaveOnMap, this);\n window.addEventListener((Browser.isTouch && ('orientation' in window && 'onorientationchange' in window)) ? 'orientationchange' : 'resize', this.mapsOnResize.bind(this));\n };\n /**\n * To unbind event handlers from maps.\n */\n Maps.prototype.unWireEVents = function () {\n //let cancelEvent: string = Browser.isPointer ? 'pointerleave' : 'mouseleave';\n EventHandler.remove(this.element, 'click', this.mapsOnClick);\n // EventHandler.remove(this.element, 'contextmenu', this.mapsOnRightClick);\n EventHandler.remove(this.element, 'dblclick', this.mapsOnDoubleClick);\n EventHandler.remove(this.element, Browser.touchStartEvent, this.mouseDownOnMap);\n EventHandler.remove(this.element, Browser.touchMoveEvent, this.mouseMoveOnMap);\n EventHandler.remove(this.element, Browser.touchEndEvent, this.mouseEndOnMap);\n EventHandler.remove(this.element, 'pointerleave mouseleave', this.mouseLeaveOnMap);\n //EventHandler.remove(this.element, cancelEvent, this.mouseLeaveOnMap);\n window.removeEventListener((Browser.isTouch && ('orientation' in window && 'onorientationchange' in window)) ? 'orientationchange' : 'resize', this.mapsOnResize);\n };\n Maps.prototype.mouseLeaveOnMap = function (e) {\n if (document.getElementsByClassName('highlightMapStyle').length > 0) {\n this.legendModule.removeShapeHighlightCollection();\n removeClass(document.getElementsByClassName('highlightMapStyle')[0]);\n }\n };\n /**\n * To handle the click event for the maps.\n */\n /* tslint:disable:no-string-literal */\n Maps.prototype.mapsOnClick = function (e) {\n var targetEle = e.target;\n var targetId = targetEle.id;\n var eventArgs = {\n cancel: false, name: click, target: targetId, x: e.clientX, y: e.clientY\n };\n this.trigger(click, eventArgs);\n if (targetEle.id.indexOf('shapeIndex') !== -1) {\n var layerIndex = parseInt(targetEle.id.split('_LayerIndex_')[1].split('_')[0], 10);\n triggerShapeEvent(targetId, this.layers[layerIndex].selectionSettings, this, shapeSelected);\n }\n if (this.markerModule) {\n this.markerModule.markerClick(e);\n }\n if (this.bubbleModule) {\n this.bubbleModule.bubbleClick(e);\n }\n if (!eventArgs.cancel) {\n this.notify(click, targetEle);\n }\n };\n /**\n *\n */\n Maps.prototype.mouseEndOnMap = function (e) {\n var targetEle = e.target;\n var targetId = targetEle.id;\n var pageX;\n var pageY;\n var target;\n var touchArg;\n var rect = this.element.getBoundingClientRect();\n var element = e.target;\n if (e.type.indexOf('touch') !== -1) {\n this.isTouch = true;\n touchArg = e;\n pageX = touchArg.changedTouches[0].pageX;\n pageY = touchArg.changedTouches[0].pageY;\n target = touchArg.target;\n }\n else {\n this.isTouch = e.pointerType === 'touch';\n pageX = e.pageX;\n pageY = e.pageY;\n target = e.target;\n }\n if (targetEle.id.indexOf('shapeIndex') !== -1) {\n var layerIndex = parseInt(targetEle.id.split('_LayerIndex_')[1].split('_')[0], 10);\n triggerShapeEvent(targetId, this.layers[layerIndex].selectionSettings, this, shapeSelected);\n }\n if (this.isTouch) {\n this.titleTooltip(e, pageX, pageY, true);\n }\n this.notify(Browser.touchEndEvent, e);\n e.preventDefault();\n return false;\n };\n /**\n *\n */\n Maps.prototype.mouseDownOnMap = function (e) {\n var pageX;\n var pageY;\n var target;\n var touchArg;\n var rect = this.element.getBoundingClientRect();\n var element = e.target;\n this.notify(Browser.touchStartEvent, e);\n };\n /**\n * To handle the double click event for the maps.\n */\n Maps.prototype.mapsOnDoubleClick = function (e) {\n this.notify('dblclick', e);\n };\n /**\n *\n */\n /* tslint:disable:no-string-literal */\n Maps.prototype.mouseMoveOnMap = function (e) {\n var pageX;\n var pageY;\n var touchArg;\n var target;\n var touches = null;\n target = (e.type === 'touchmove') ? e.target :\n target = e.target;\n // if (target.id.indexOf('shapeIndex') !== -1 && !this.highlightSettings.enable) {\n // triggerShapeEvent(target.id, this.highlightSettings, this, shapeHighlight);\n // }\n if (this.markerModule) {\n this.markerModule.markerMove(e);\n }\n if (this.bubbleModule) {\n this.bubbleModule.bubbleMove(e);\n }\n this.onMouseMove(e);\n this.notify(Browser.touchMoveEvent, e);\n };\n Maps.prototype.onMouseMove = function (e) {\n var element = e.target;\n var pageX;\n var pageY;\n var target;\n var touchArg;\n if (!this.isTouch) {\n this.titleTooltip(e, e.pageX, e.pageY);\n }\n return false;\n };\n Maps.prototype.titleTooltip = function (event, x, y, isTouch) {\n var targetId = event.target.id;\n if ((targetId === (this.element.id + '_Map_title')) && (event.target.textContent.indexOf('...') > -1)) {\n showTooltip(this.titleSettings.text, this.titleSettings.textStyle.size, x, y, this.element.offsetWidth, this.element.offsetHeight, this.element.id + '_EJ2_Title_Tooltip', getElement(this.element.id + '_Secondary_Element'), isTouch);\n }\n else {\n removeElement(this.element.id + '_EJ2_Title_Tooltip');\n }\n };\n /*\n\n /**\n * To handle the window resize event on maps.\n */\n Maps.prototype.mapsOnResize = function (e) {\n var _this = this;\n var args = {\n name: resize,\n previousSize: this.availableSize,\n currentSize: new Size(0, 0),\n maps: this\n };\n if (this.resizeTo) {\n clearTimeout(this.resizeTo);\n }\n if (this.element.classList.contains('e-maps')) {\n this.resizeTo = setTimeout(function () {\n _this.unWireEVents();\n _this.createSVG();\n _this.refreshing = true;\n _this.wireEVents();\n args.currentSize = _this.availableSize;\n _this.trigger(resize, args);\n _this.render();\n }, 500);\n }\n return false;\n };\n /**\n * To zoom the map by specifies the center position\n * @param centerPosition\n * @param zoomFactor\n */\n Maps.prototype.zoomByPosition = function (centerPosition, zoomFactor) {\n var factor = this.mapLayerPanel.calculateFactor(this.layersCollection[0]);\n var position;\n var size = this.mapAreaRect;\n if (!this.isTileMap && this.zoomModule) {\n if (!isNullOrUndefined(centerPosition)) {\n position = convertGeoToPoint(centerPosition.latitude, centerPosition.longitude, factor, this.layersCollection[0], this);\n var mapRect = document.getElementById(this.element.id + '_Layer_Collections').getBoundingClientRect();\n var svgRect = this.svgObject.getBoundingClientRect();\n var xDiff = Math.abs(mapRect.left - svgRect.left) / this.scale;\n var yDiff = Math.abs(mapRect.top - svgRect.top) / this.scale;\n var x = this.translatePoint.x + xDiff;\n var y = this.translatePoint.y + yDiff;\n this.scale = zoomFactor;\n this.translatePoint.x = ((mapRect.left < svgRect.left ? x : 0) + (size.width / 2) - (position.x * zoomFactor)) / zoomFactor;\n this.translatePoint.y = ((mapRect.top < svgRect.top ? y : 0) + (size.height / 2) - (position.y * zoomFactor)) / zoomFactor;\n this.zoomModule.applyTransform();\n }\n else {\n position = { x: size.width / 2, y: size.height / 2 };\n this.zoomModule.performZooming(position, zoomFactor, zoomFactor > this.scale ? 'ZoomIn' : 'ZoomOut');\n }\n }\n else if (this.zoomModule) {\n this.tileZoomLevel = zoomFactor;\n this.tileTranslatePoint = this.mapLayerPanel['panTileMap'](this.availableSize.width, this.availableSize.height, { x: centerPosition.longitude, y: centerPosition.latitude });\n this.mapLayerPanel.generateTiles(zoomFactor, this.tileTranslatePoint, new BingMap(this));\n }\n };\n /**\n * To pan the map by specifies the direction\n * @param direction\n */\n Maps.prototype.panByDirection = function (direction) {\n var xDiff = 0;\n var yDiff = 0;\n switch (direction) {\n case 'Left':\n xDiff = -(this.mapAreaRect.width / 7);\n break;\n case 'Right':\n xDiff = (this.mapAreaRect.width / 7);\n break;\n case 'Top':\n yDiff = -(this.mapAreaRect.height / 7);\n break;\n case 'Bottom':\n yDiff = (this.mapAreaRect.height / 7);\n break;\n }\n if (this.zoomModule) {\n this.zoomModule.panning(direction, xDiff, yDiff);\n }\n };\n /**\n * To add layer\n * @param layer\n */\n Maps.prototype.addLayer = function (layer) {\n this.layers.push(new LayerSettings(this.layers[0], 'layers', layer));\n this.refresh();\n };\n /**\n * To remove layer\n * @param index\n */\n Maps.prototype.removeLayer = function (index) {\n this.layers.splice(index, 1);\n this.refresh();\n };\n /**\n * To add marker\n * @param layerIndex\n * @param marker\n */\n Maps.prototype.addMarker = function (layerIndex, markerCollection) {\n var layerEle = document.getElementById(this.element.id + '_LayerIndex_' + layerIndex);\n if (markerCollection.length > 0 && layerEle) {\n for (var _i = 0, markerCollection_1 = markerCollection; _i < markerCollection_1.length; _i++) {\n var newMarker = markerCollection_1[_i];\n this.layersCollection[layerIndex].markerSettings.push(new MarkerSettings(this, 'markerSettings', newMarker));\n }\n var markerModule = new Marker(this);\n markerModule.markerRender(layerEle, layerIndex, this.mapLayerPanel['currentFactor'], 'AddMarker');\n this.arrangeTemplate();\n }\n };\n /**\n * Method to set culture for maps\n */\n Maps.prototype.setCulture = function () {\n this.intl = new Internationalization();\n this.setLocaleConstants();\n this.localeObject = new L10n(this.getModuleName(), this.defaultLocalConstants, this.locale);\n };\n /**\n * Method to set locale constants\n */\n Maps.prototype.setLocaleConstants = function () {\n // Need to modify after the api confirm\n this.defaultLocalConstants = {\n ZoomIn: 'Zoom In',\n Zoom: 'Zoom',\n ZoomOut: 'Zoom Out',\n Pan: 'Pan',\n Reset: 'Reset',\n };\n };\n /**\n * To destroy maps control.\n */\n Maps.prototype.destroy = function () {\n this.unWireEVents();\n _super.prototype.destroy.call(this);\n };\n /**\n * Get component name\n */\n Maps.prototype.getModuleName = function () {\n return 'maps';\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @private\n */\n Maps.prototype.getPersistData = function () {\n return '';\n };\n /**\n * Called internally if any of the property value changed.\n * @private\n */\n Maps.prototype.onPropertyChanged = function (newProp, oldProp) {\n var render = false;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'background':\n this.renderBorder();\n break;\n case 'height':\n case 'width':\n this.createSVG();\n render = true;\n break;\n }\n }\n if (render) {\n this.render();\n }\n };\n /**\n * To provide the array of modules needed for maps rendering\n * @return {ModuleDeclaration[]}\n * @private\n */\n Maps.prototype.requiredModules = function () {\n var modules = [];\n var isVisible = this.findVisibleLayers(this.layers);\n var annotationEnable = false;\n this.annotations.map(function (annotation, index) {\n annotationEnable = annotation.content != null;\n });\n if (this.isBubbleVisible()) {\n modules.push({\n member: 'Bubble',\n args: [this]\n });\n }\n if (isVisible.highlight) {\n modules.push({\n member: 'Highlight',\n args: [this]\n });\n }\n if (isVisible.selection) {\n modules.push({\n member: 'Selection',\n args: [this]\n });\n }\n if (this.legendSettings.visible) {\n modules.push({\n member: 'Legend',\n args: [this]\n });\n }\n if (this.zoomSettings.enable || this.zoomSettings.zoomFactor > this.zoomSettings.minZoom) {\n modules.push({\n member: 'Zoom',\n args: [this]\n });\n }\n if (this.isMarkersVisible()) {\n modules.push({\n member: 'Marker',\n args: [this]\n });\n }\n if (this.isDataLabelVisible()) {\n modules.push({\n member: 'DataLabel',\n args: [this]\n });\n }\n if (this.isNavigationVisible()) {\n modules.push({\n member: 'NavigationLine',\n args: [this]\n });\n }\n if (isVisible.tooltip) {\n modules.push({\n member: 'MapsTooltip',\n args: [this]\n });\n }\n if (annotationEnable) {\n modules.push({\n member: 'Annotations',\n args: [this, Annotations]\n });\n }\n return modules;\n };\n /**\n * To find marker visibility\n */\n Maps.prototype.isMarkersVisible = function () {\n var isVisible = false;\n this.layers.forEach(function (layer, layerIndex) {\n for (var i = 0; i < layer.markerSettings.length; i++) {\n if (layer.markerSettings[i].visible) {\n isVisible = true;\n break;\n }\n }\n });\n return isVisible;\n };\n /**\n * To find DataLabel visibility\n */\n Maps.prototype.isDataLabelVisible = function () {\n var isVisible = false;\n for (var i = 0; i < this.layers.length; i++) {\n if (this.layers[i].dataLabelSettings.visible) {\n isVisible = true;\n break;\n }\n }\n return isVisible;\n };\n /**\n * To find navigation line visibility\n */\n Maps.prototype.isNavigationVisible = function () {\n var isVisible = false;\n this.layers.forEach(function (layer, layerIndex) {\n for (var i = 0; i < layer.navigationLineSettings.length; i++) {\n if (layer.navigationLineSettings[i].visible) {\n isVisible = true;\n break;\n }\n }\n });\n return isVisible;\n };\n /**\n * To find marker visibility\n */\n Maps.prototype.isBubbleVisible = function () {\n var isVisible = false;\n for (var _i = 0, _a = this.layers; _i < _a.length; _i++) {\n var layer = _a[_i];\n if (this.getBubbleVisible(layer)) {\n isVisible = true;\n break;\n }\n }\n return isVisible;\n };\n /**\n * To find the bubble visibility from layer\n * @private\n */\n Maps.prototype.getBubbleVisible = function (layer) {\n var isVisible = false;\n for (var _i = 0, _a = layer.bubbleSettings; _i < _a.length; _i++) {\n var bubble = _a[_i];\n if (bubble.visible) {\n isVisible = true;\n break;\n }\n }\n return isVisible;\n };\n /**\n * Handles the print method for chart control.\n */\n Maps.prototype.print = function (id) {\n var exportChart = new ExportUtils(this);\n exportChart.print(id);\n };\n /**\n * Handles the export method for chart control.\n * @param type\n * @param fileName\n */\n Maps.prototype.export = function (type, fileName, orientation) {\n var exportMap = new ExportUtils(this);\n exportMap.export(type, fileName, orientation);\n };\n /**\n * To find visibility of layers and markers for required modules load.\n */\n Maps.prototype.findVisibleLayers = function (layers, isLayerVisible, isBubblevisible, istooltipVisible, isSelection, isHighlight) {\n if (isLayerVisible === void 0) { isLayerVisible = false; }\n if (isBubblevisible === void 0) { isBubblevisible = false; }\n if (istooltipVisible === void 0) { istooltipVisible = false; }\n if (isSelection === void 0) { isSelection = false; }\n if (isHighlight === void 0) { isHighlight = false; }\n var bubbles;\n var markers;\n var navigationLine;\n for (var _i = 0, layers_1 = layers; _i < layers_1.length; _i++) {\n var layer = layers_1[_i];\n isLayerVisible = layer.visible || isLayerVisible;\n if (layer.visible) {\n bubbles = layer.bubbleSettings;\n markers = layer.markerSettings;\n navigationLine = layer.navigationLineSettings;\n for (var _a = 0, navigationLine_1 = navigationLine; _a < navigationLine_1.length; _a++) {\n var navigation = navigationLine_1[_a];\n if (navigation.visible) {\n isSelection = navigation.highlightSettings.enable || isSelection;\n isHighlight = navigation.selectionSettings.enable || isHighlight;\n }\n }\n for (var _b = 0, markers_1 = markers; _b < markers_1.length; _b++) {\n var marker = markers_1[_b];\n if (marker.visible) {\n istooltipVisible = marker.tooltipSettings.visible || istooltipVisible;\n isSelection = marker.selectionSettings.enable || isSelection;\n isHighlight = marker.highlightSettings.enable || isHighlight;\n }\n if (istooltipVisible) {\n break;\n }\n }\n for (var _c = 0, bubbles_1 = bubbles; _c < bubbles_1.length; _c++) {\n var bubble = bubbles_1[_c];\n if (bubble.visible) {\n istooltipVisible = bubble.tooltipSettings.visible || istooltipVisible;\n isSelection = bubble.selectionSettings.enable || isSelection;\n isHighlight = bubble.highlightSettings.enable || isHighlight;\n }\n if (istooltipVisible) {\n break;\n }\n }\n istooltipVisible = layer.tooltipSettings.visible || istooltipVisible;\n isSelection = layer.selectionSettings.enable || isSelection;\n isHighlight = layer.highlightSettings.enable || isHighlight;\n }\n if (isLayerVisible && isBubblevisible && istooltipVisible) {\n break;\n }\n }\n return {\n layer: isLayerVisible, bubble: isBubblevisible, tooltip: istooltipVisible,\n selection: isSelection, highlight: isHighlight\n };\n };\n __decorate([\n Property(null)\n ], Maps.prototype, \"background\", void 0);\n __decorate([\n Property(false)\n ], Maps.prototype, \"useGroupingSeparator\", void 0);\n __decorate([\n Property(null)\n ], Maps.prototype, \"format\", void 0);\n __decorate([\n Property(null)\n ], Maps.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], Maps.prototype, \"height\", void 0);\n __decorate([\n Complex({}, TitleSettings)\n ], Maps.prototype, \"titleSettings\", void 0);\n __decorate([\n Complex({}, ZoomSettings)\n ], Maps.prototype, \"zoomSettings\", void 0);\n __decorate([\n Complex({}, LegendSettings)\n ], Maps.prototype, \"legendSettings\", void 0);\n __decorate([\n Collection([], LayerSettings)\n ], Maps.prototype, \"layers\", void 0);\n __decorate([\n Collection([], Annotation)\n ], Maps.prototype, \"annotations\", void 0);\n __decorate([\n Complex({}, Margin)\n ], Maps.prototype, \"margin\", void 0);\n __decorate([\n Complex({ color: '#DDDDDD', width: 0 }, Border)\n ], Maps.prototype, \"border\", void 0);\n __decorate([\n Property('Material')\n ], Maps.prototype, \"theme\", void 0);\n __decorate([\n Property('Mercator')\n ], Maps.prototype, \"projectionType\", void 0);\n __decorate([\n Property(0)\n ], Maps.prototype, \"baseLayerIndex\", void 0);\n __decorate([\n Property(null)\n ], Maps.prototype, \"description\", void 0);\n __decorate([\n Property(1)\n ], Maps.prototype, \"tabIndex\", void 0);\n __decorate([\n Property({ latitude: null, longitude: null })\n ], Maps.prototype, \"centerPosition\", void 0);\n __decorate([\n Complex({}, MapsAreaSettings)\n ], Maps.prototype, \"mapsArea\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"load\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"beforePrint\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"loaded\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"click\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"doubleClick\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"rightClick\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"resize\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"tooltipRender\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"shapeSelected\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"itemSelection\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"itemHighlight\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"shapeHighlight\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"layerRendering\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"shapeRendering\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"markerRendering\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"markerClick\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"markerMouseMove\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"dataLabelRendering\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"bubbleRendering\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"bubbleClick\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"bubbleMouseMove\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"animationComplete\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"annotationRendering\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"zoom\", void 0);\n __decorate([\n Event()\n ], Maps.prototype, \"pan\", void 0);\n Maps = __decorate([\n NotifyPropertyChanges\n ], Maps);\n return Maps;\n}(Component));\nexport { Maps };\n","import { ColorMapping, bubbleRendering } from '../index';\nimport { bubbleClick, bubbleMouseMove } from '../index';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { CircleOption, MapLocation, findMidPointOfPolygon, Point, drawCircle, elementAnimate, getTranslate } from '../utils/helper';\nimport { RectOption, Rect, drawRectangle, checkPropertyPath } from '../utils/helper';\n/**\n * Bubble module class\n */\nvar Bubble = /** @class */ (function () {\n function Bubble(maps) {\n /**\n * Bubble Id for current layer\n */\n this.id = '';\n this.maps = maps;\n this.bubbleCollection = [];\n }\n /**\n * To render bubble\n */\n /* tslint:disable:no-string-literal */\n Bubble.prototype.renderBubble = function (bubbleSettings, shapeData, color, range, bubbleIndex, dataIndex, layerIndex, layer, group) {\n var layerData = layer.layerData;\n var colorValuePath = bubbleSettings.colorValuePath;\n var equalValue = shapeData[colorValuePath];\n var colorValue = Number(shapeData[colorValuePath]);\n var bubbleValue = Number(shapeData[bubbleSettings.valuePath]);\n var opacity;\n var bubbleColor;\n if (isNaN(bubbleValue) && isNaN(colorValue) && isNullOrUndefined(equalValue)) {\n return null;\n }\n var radius = this.getRatioOfBubble(bubbleSettings.minRadius, bubbleSettings.maxRadius, bubbleValue, range.min, range.max);\n var colorMapping = new ColorMapping(this.maps);\n var shapeColor = colorMapping.getColorByValue(bubbleSettings.colorMapping, colorValue, equalValue);\n bubbleColor = (Object.prototype.toString.call(shapeColor) === '[object Object]' &&\n !isNullOrUndefined(shapeColor['fill'])) ? shapeColor['fill'] : color;\n opacity = (Object.prototype.toString.call(shapeColor) === '[object Object]' &&\n !isNullOrUndefined(shapeColor['opacity'])) ? shapeColor['opacity'] : bubbleSettings.opacity;\n var shapePoints = [[]];\n var midIndex = 0;\n var pointsLength = 0;\n var currentLength = 0;\n for (var i = 0, len = layerData.length; i < len; i++) {\n var shape = layerData[i];\n shape = shape['property'];\n var shapePath = checkPropertyPath(shapeData[layer.shapeDataPath], layer.shapePropertyPath, shape);\n if (shapeData[layer.shapeDataPath] === shape[shapePath]) {\n if (!layerData[i]['_isMultiPolygon']) {\n shapePoints.push(this.getPoints(layerData[i], []));\n currentLength = shapePoints[shapePoints.length - 1].length;\n if (pointsLength < currentLength) {\n pointsLength = currentLength;\n midIndex = shapePoints.length - 1;\n }\n }\n else {\n var layer_1 = layerData[i];\n for (var j = 0; j < layer_1.length; j++) {\n shapePoints.push(this.getPoints(layer_1[j], []));\n currentLength = shapePoints[shapePoints.length - 1].length;\n if (pointsLength < currentLength) {\n pointsLength = currentLength;\n midIndex = shapePoints.length - 1;\n }\n }\n }\n }\n }\n var center = findMidPointOfPolygon(shapePoints[midIndex]);\n if (!isNullOrUndefined(center)) {\n var centerY = this.maps.projectionType === 'Mercator' ? center['y'] : (-center['y']);\n var eventArgs = {\n cancel: false, name: bubbleRendering, border: bubbleSettings.border,\n cx: center['x'], cy: centerY, data: shapeData, fill: bubbleColor, maps: this.maps,\n radius: radius\n };\n this.maps.trigger(bubbleRendering, eventArgs);\n if (eventArgs.cancel) {\n return;\n }\n var bubbleElement = void 0;\n if (bubbleSettings.bubbleType === 'Circle') {\n var circle = new CircleOption(this.id, eventArgs.fill, eventArgs.border, opacity, 0, 0, eventArgs.radius, null);\n bubbleElement = drawCircle(this.maps, circle, group);\n }\n else {\n var y = this.maps.projectionType === 'Mercator' ? (eventArgs.cy - radius) : (eventArgs.cy + radius);\n var rectangle = new RectOption(this.id, eventArgs.fill, eventArgs.border, opacity, new Rect(0, 0, radius * 2, radius * 2), 2, 2);\n eventArgs.cx -= radius;\n eventArgs.cy = y;\n bubbleElement = drawRectangle(this.maps, rectangle, group);\n }\n this.bubbleCollection.push({\n LayerIndex: layerIndex,\n BubbleIndex: bubbleIndex,\n DataIndex: dataIndex,\n element: bubbleElement,\n center: { x: eventArgs.cx, y: eventArgs.cy }\n });\n var animate = layer.animationDuration !== 0 || isNullOrUndefined(this.maps.zoomModule);\n var translate = getTranslate(this.maps, layer, animate);\n var scale = translate['scale'];\n var transPoint = translate['location'];\n var position = new MapLocation((this.maps.isTileMap ? (eventArgs.cx) : ((eventArgs.cx + transPoint.x) * scale)), (this.maps.isTileMap ? (eventArgs.cy) : ((eventArgs.cy + transPoint.y) * scale)));\n bubbleElement.setAttribute('transform', 'translate( ' + (position.x) + ' ' + (position.y) + ' )');\n var bubble = (bubbleSettings.dataSource.length - 1) === dataIndex ? 'bubble' : null;\n if (bubbleSettings.bubbleType === 'Square') {\n position.x += radius;\n position.y += radius * (this.maps.projectionType === 'Mercator' ? 1 : -1);\n }\n else {\n radius = 0;\n }\n if (bubbleSettings.animationDuration > 0) {\n elementAnimate(bubbleElement, bubbleSettings.animationDelay, bubbleSettings.animationDuration, position, this.maps, bubble, radius);\n }\n }\n };\n Bubble.prototype.getPoints = function (shape, points) {\n shape.map(function (current, index) {\n points.push(new Point(current['point']['x'], current['point']['y']));\n });\n return points;\n };\n Bubble.prototype.getRatioOfBubble = function (min, max, value, minValue, maxValue) {\n var percent = (100 / (maxValue - minValue)) * (value - minValue);\n var bubbleRadius = (((max - min) / 100) * percent) + min;\n if (maxValue === minValue) {\n bubbleRadius = (((max - min) / 100)) + min;\n }\n return bubbleRadius;\n };\n /**\n * To check and trigger bubble click event\n */\n Bubble.prototype.bubbleClick = function (e) {\n var target = e.target.id;\n if (target.indexOf('_LayerIndex_') === -1) {\n return;\n }\n var data = this.getbubble(target);\n if (isNullOrUndefined(data)) {\n return;\n }\n var eventArgs = {\n cancel: false, name: bubbleClick, data: data, maps: this.maps,\n target: target, x: e.clientX, y: e.clientY\n };\n this.maps.trigger(bubbleClick, eventArgs);\n };\n /**\n * To get bubble from target id\n */\n Bubble.prototype.getbubble = function (target) {\n var id = target.split('_LayerIndex_');\n var index = parseInt(id[1].split('_')[0], 10);\n var layer = this.maps.layers[index];\n var data;\n if (target.indexOf('_BubbleIndex_') > -1) {\n var bubbleIndex = parseInt(id[1].split('_BubbleIndex_')[1], 10);\n if (!isNaN(bubbleIndex)) {\n data = layer.dataSource[bubbleIndex];\n return data;\n }\n }\n return null;\n };\n /**\n * To check and trigger bubble move event\n */\n Bubble.prototype.bubbleMove = function (e) {\n var target = e.target.id;\n if (target.indexOf('_LayerIndex_') === -1) {\n return;\n }\n var data = this.getbubble(target);\n if (isNullOrUndefined(data)) {\n return;\n }\n var eventArgs = {\n cancel: false, name: bubbleMouseMove, data: data, maps: this.maps,\n target: target, x: e.clientX, y: e.clientY\n };\n this.maps.trigger(bubbleMouseMove, eventArgs);\n };\n /**\n * Get module name.\n */\n Bubble.prototype.getModuleName = function () {\n return 'Bubble';\n };\n /**\n * To destroy the bubble.\n * @return {void}\n * @private\n */\n Bubble.prototype.destroy = function (maps) {\n /**\n * Destroy method performed here\n */\n };\n return Bubble;\n}());\nexport { Bubble };\n","import { findMidPointOfPolygon, Rect, filter, getTemplateFunction, getTranslate, RectOption, convertElementFromLabel, Point, TextOption, renderTextElement, textTrim, measureText, Internalize } from '../utils/helper';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { dataLabelRendering } from '../model/constants';\n/**\n * DataLabel Module used to render the maps datalabel\n */\nvar DataLabel = /** @class */ (function () {\n function DataLabel(maps) {\n this.intersect = [];\n this.value = { rightWidth: 0, leftWidth: 0, heightTop: 0, heightBottom: 0 };\n this.maps = maps;\n this.dataLabelCollections = [];\n }\n //tslint:disable:max-func-body-length\n DataLabel.prototype.getDataLabel = function (dataSource, labelPath, shapeName, shapeDataPath) {\n var text;\n for (var i = 0; i < dataSource.length; i++) {\n var data = dataSource[i];\n if ((data[shapeDataPath]) === shapeName) {\n text = data;\n break;\n }\n }\n return text;\n };\n /**\n * To render label for maps\n * @param layer\n * @param layerIndex\n * @param shape\n * @param layerData\n * @param group\n * @param labelTemplateElement\n * @param index\n */\n DataLabel.prototype.renderLabel = function (layer, layerIndex, shape, layerData, group, labelTemplateElement, index) {\n var dataLabel = layer.dataLabelSettings;\n var style = layer.dataLabelSettings.textStyle;\n var markerEle;\n var templateFn;\n var options;\n var dataLabelSettings = layer.dataLabelSettings;\n var labelpath = layer.dataLabelSettings.labelPath;\n var shapePoint = [[]];\n var midIndex = 0;\n var pointsLength = 0;\n var shapeData = shape;\n var element;\n var data;\n var text = '';\n var datasrcObj;\n var currentLength = 0;\n var location;\n var shapeProperties = shape['properties'];\n var labelId = this.maps.element.id + '_LayerIndex_' + layerIndex + '_shapeIndex_' + index + '_LabelIndex_' + index;\n var textLocation = new Point(0, 0);\n /* tslint:disable:no-string-literal */\n var shapes = layerData[index];\n style.fontFamily = this.maps.theme === 'Bootstrap4' ? 'HelveticaNeue-Medium' : style.fontFamily;\n shape = shapes['property'];\n var properties = (Object.prototype.toString.call(layer.shapePropertyPath) === '[object Array]' ?\n layer.shapePropertyPath : [layer.shapePropertyPath]);\n var propertyPath;\n for (var j = 0; j < properties.length; j++) {\n if (shapeProperties[properties[j]]) {\n propertyPath = properties[j];\n break;\n }\n }\n datasrcObj = this.getDataLabel(layer.dataSource, labelpath, shapeData['properties'][propertyPath], layer.shapeDataPath);\n if (!isNullOrUndefined(shapes['property']) && ((shapeProperties[labelpath]) || datasrcObj)) {\n shapePoint = [[]];\n if (!layerData[index]['_isMultiPolygon']) {\n shapePoint.push(this.getPoint(layerData[index], []));\n currentLength = shapePoint[shapePoint.length - 1].length;\n if (pointsLength < currentLength) {\n pointsLength = currentLength;\n midIndex = shapePoint.length - 1;\n }\n }\n else {\n var layer_1 = layerData[index];\n for (var j = 0; j < layer_1.length; j++) {\n shapePoint.push(this.getPoint(layer_1[j], []));\n currentLength = shapePoint[shapePoint.length - 1].length;\n if (pointsLength < currentLength) {\n pointsLength = currentLength;\n midIndex = shapePoint.length - 1;\n }\n }\n }\n }\n text = (!isNullOrUndefined(datasrcObj)) ? datasrcObj[labelpath].toString() : shapeData['properties'][labelpath];\n location = findMidPointOfPolygon(shapePoint[midIndex]);\n if (!isNullOrUndefined(text) && !isNullOrUndefined(location)) {\n location['y'] = (this.maps.projectionType === 'Mercator') ? location['y'] : (-location['y']);\n data = location;\n if (!isNullOrUndefined(this.maps.format) && !isNaN(parseFloat(text))) {\n if (this.maps.useGroupingSeparator) {\n text = Internalize(this.maps, parseFloat(text));\n if (!isNullOrUndefined(datasrcObj)) {\n datasrcObj[labelpath] = text;\n }\n }\n }\n var eventargs = {\n name: dataLabelRendering, maps: this.maps, cancel: false, border: dataLabel.border, datalabel: dataLabel,\n fill: dataLabel.fill, template: dataLabel.template, text: text\n };\n this.maps.trigger(dataLabelRendering, eventargs);\n var border = { color: 'yellow' };\n var position = [];\n var width = location['rightMax']['x'] - location['leftMax']['x'];\n var textSize = measureText(text, style);\n var trimmedLable = textTrim(width, text, style);\n var elementSize = measureText(trimmedLable, style);\n var startY = location['y'] - textSize['height'] / 4;\n var endY = location['y'] + textSize['height'] / 4;\n var start = location['y'] - textSize['height'] / 4;\n var end = location['y'] + textSize['height'] / 4;\n position = filter(shapePoint[midIndex], startY, endY);\n if (position.length > 5 && (shapeData['geometry']['type'] !== 'MultiPolygon') &&\n (shapeData['type'] !== 'MultiPolygon')) {\n var location1 = findMidPointOfPolygon(position);\n location['x'] = location1['x'];\n width = location1['rightMax']['x'] - location1['leftMax']['x'];\n }\n var xpositionEnds = location['x'] + textSize['width'] / 2;\n var xpositionStart = location['x'] - textSize['width'] / 2;\n trimmedLable = textTrim(width, text, style);\n elementSize = measureText(trimmedLable, style);\n this.value[index] = { rightWidth: xpositionEnds, leftWidth: xpositionStart, heightTop: start, heightBottom: end };\n var animate = layer.animationDuration !== 0 || isNullOrUndefined(this.maps.zoomModule);\n var translate = getTranslate(this.maps, layer, animate);\n var scale = translate['scale'];\n var transPoint = translate['location'];\n var labelElement = void 0;\n if (eventargs.template !== '') {\n templateFn = getTemplateFunction(eventargs.template);\n var templateElement = templateFn(this.maps);\n labelElement = convertElementFromLabel(templateElement, labelId, !isNullOrUndefined(datasrcObj) ? datasrcObj : shapeData['properties'], index, this.maps);\n labelElement.style.left = ((Math.abs(this.maps.baseMapRectBounds['min']['x'] - location['x'])) * scale) + 'px';\n labelElement.style.top = ((Math.abs(this.maps.baseMapRectBounds['min']['y'] - location['y'])) * scale) + 'px';\n labelTemplateElement.appendChild(labelElement);\n var labelWidth = labelElement.offsetWidth;\n var labelHeight = labelElement.offsetHeight;\n }\n else {\n if (dataLabelSettings.smartLabelMode === 'Trim') {\n options = new TextOption(labelId, textLocation.x, textLocation.y, 'middle', trimmedLable, '', '');\n }\n if (dataLabelSettings.smartLabelMode === 'None') {\n options = new TextOption(labelId, (textLocation.x), textLocation.y, 'middle', text, '', '');\n }\n if (dataLabelSettings.smartLabelMode === 'Hide') {\n text = (width >= textSize['width']) ? text : '';\n options = new TextOption(labelId, (textLocation.x), (textLocation.y), 'middle', text, '', '');\n }\n text = options['text'];\n if (dataLabelSettings.intersectionAction === 'Hide') {\n for (var i = 0; i < this.intersect.length; i++) {\n if (!isNullOrUndefined(this.intersect[i])) {\n if (this.value[index]['leftWidth'] > this.intersect[i]['rightWidth']\n || this.value[index]['rightWidth'] < this.intersect[i]['leftWidth']\n || this.value[index]['heightTop'] > this.intersect[i]['heightBottom']\n || this.value[index]['heightBottom'] < this.intersect[i]['heightTop']) {\n text = text;\n }\n else {\n text = '';\n break;\n }\n }\n }\n this.intersect.push(this.value[index]);\n options = new TextOption(labelId, textLocation.x, textLocation.y, 'middle', text, '', '');\n }\n var difference = void 0;\n if (dataLabelSettings.intersectionAction === 'Trim') {\n for (var j = 0; j < this.intersect.length; j++) {\n if (!isNullOrUndefined(this.intersect[j])) {\n if (this.intersect[j]['rightWidth'] < this.value[index]['leftWidth']\n || this.intersect[j]['leftWidth'] > this.value[index]['rightWidth']\n || this.intersect[j]['heightBottom'] < this.value[index]['heightTop']\n || this.intersect[j]['heightTop'] > this.value[index]['heightBottom']) {\n trimmedLable = text;\n difference = 0;\n }\n else {\n if (this.value[index]['leftWidth'] > this.intersect[j]['leftWidth']) {\n width = this.intersect[j]['rightWidth'] - this.value[index]['leftWidth'];\n difference = width - (this.value[index]['rightWidth'] - this.value[index]['leftWidth']);\n trimmedLable = textTrim(difference, text, style);\n break;\n }\n if (this.value[index]['leftWidth'] < this.intersect[j]['leftWidth']) {\n width = this.value[index]['rightWidth'] - this.intersect[j]['leftWidth'];\n difference = Math.abs(width - (this.value[index]['rightWidth'] - this.value[index]['leftWidth']));\n trimmedLable = textTrim(difference, text, style);\n break;\n }\n }\n }\n }\n this.intersect.push(this.value[index]);\n options = new TextOption(labelId, textLocation.x, (textLocation.y), 'middle', trimmedLable, '', '');\n }\n if (dataLabelSettings.intersectionAction === 'None') {\n options = new TextOption(labelId, (textLocation.x), (textLocation.y), 'middle', text, '', '');\n }\n if (trimmedLable.length > 1) {\n var border_1 = eventargs.border;\n if (border_1['width'] > 1) {\n var fill = eventargs.fill;\n var opacity = dataLabelSettings.opacity;\n var rx = dataLabelSettings.rx;\n var ry = dataLabelSettings.ry;\n var x = location['x'] - textSize['width'] / 2;\n var y = location['y'] - textSize['height'] / 2;\n var rectOptions = new RectOption(this.maps.element.id + '_LayerIndex_' + layerIndex + '_shapeIndex_' + index + '_rectIndex_' + index, fill, border_1, opacity, new Rect(x, y, textSize['width'], textSize['height']), rx, ry);\n var rect = this.maps.renderer.drawRectangle(rectOptions);\n group.appendChild(rect);\n }\n }\n element = renderTextElement(options, style, style.color || this.maps.themeStyle.dataLabelFontColor, group);\n element.setAttribute('transform', 'translate( ' + ((location['x'] + transPoint.x) * scale) + ' '\n + (((location['y'] + transPoint.y) * scale) + (elementSize.height / 4)) + ' )');\n group.appendChild(element);\n }\n this.dataLabelCollections.push({\n location: { x: location['x'], y: (location['y'] + elementSize.height / 4) },\n element: isNullOrUndefined(labelElement) ? element : labelElement,\n layerIndex: layerIndex,\n shapeIndex: index,\n labelIndex: index\n });\n if (labelTemplateElement.childElementCount > 0 && !this.maps.element.contains(labelTemplateElement)) {\n document.getElementById(this.maps.element.id + '_Secondary_Element').appendChild(labelTemplateElement);\n }\n }\n };\n DataLabel.prototype.getPoint = function (shapes, points) {\n shapes.map(function (current, index) {\n points.push(new Point(current['point']['x'], current['point']['y']));\n });\n return points;\n };\n /**\n * Get module name.\n */\n DataLabel.prototype.getModuleName = function () {\n return 'DataLabel';\n };\n /**\n * To destroy the layers.\n * @return {void}\n * @private\n */\n DataLabel.prototype.destroy = function (maps) {\n /**\n * Destroy method performed here\n */\n };\n return DataLabel;\n}());\nexport { DataLabel };\n","import { convertTileLatLongToPoint } from '../index';\nimport { convertGeoToPoint, Point, PathOption } from '../utils/helper';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\n/**\n * navigation-selected-line\n */\nvar NavigationLine = /** @class */ (function () {\n function NavigationLine(maps) {\n this.maps = maps;\n }\n /* tslint:disable:no-string-literal */\n //tslint:disable:max-func-body-length\n /**\n * To render navigation line for maps\n */\n NavigationLine.prototype.renderNavigation = function (layer, factor, layerIndex) {\n var navigationEle;\n var navigation;\n navigation = layer.navigationLineSettings;\n var longitude;\n var point = [];\n var latitude;\n var visible;\n var angle;\n var width;\n var color;\n var dashArray;\n var pathOption;\n var direction;\n var markerWidth;\n var arcId;\n var radius;\n var showArrow;\n var arrowColor;\n var arrowSize;\n var arrowSettings;\n var arrowPosition;\n var startArrow;\n var endArrow;\n var offSet;\n var offSetValue;\n var navigationGroup;\n var d;\n var group = (this.maps.renderer.createGroup({\n id: this.maps.element.id + '_LayerIndex_' + layerIndex + '_line_Group'\n }));\n for (var i = 0; i < navigation.length; i++) {\n latitude = navigation[i]['properties']['latitude'];\n longitude = navigation[i]['properties']['longitude'];\n visible = navigation[i]['properties']['visible'];\n angle = navigation[i]['properties']['angle'];\n width = navigation[i]['width'] || 1;\n color = navigation[i]['color'];\n dashArray = navigation[i]['properties']['dashArray'];\n arrowSettings = navigation[i]['properties']['arrowSettings'];\n showArrow = (isNullOrUndefined(arrowSettings)) ? false : arrowSettings['properties']['showArrow'];\n if (longitude['length'] === latitude['length'] && visible) {\n for (var i_1 = 0; i_1 < longitude['length']; i_1++) {\n var location_1 = (this.maps.isTileMap) ? convertTileLatLongToPoint(new Point(longitude[i_1], latitude[i_1]), factor, this.maps.tileTranslatePoint, true) : convertGeoToPoint(latitude[i_1], longitude[i_1], factor, layer, this.maps);\n point.push(location_1);\n }\n }\n navigationGroup = (this.maps.renderer.createGroup({\n id: this.maps.element.id + '_LayerIndex_' + layerIndex + '_NavigationGroup' + i + ''\n }));\n for (var j = 0; j < point['length'] - 1; j++) {\n angle = (-1 > angle) ? -1 : angle;\n angle = (1 < angle) ? 1 : angle;\n var arcId_1 = this.maps.element.id + '_LayerIndex_' + layerIndex + '_NavigationIndex_' + i + '_Line' + j + '';\n var radius_1 = this.convertRadius(point[j], point[j + 1]);\n if (angle <= 1 && angle > 0) {\n direction = 0;\n if (point[j]['x'] > point[j + 1]['x']) {\n direction = 1;\n }\n }\n if (angle >= -1 && angle < 0) {\n direction = 1;\n if (point[j]['x'] > point[j + 1]['x']) {\n direction = 0;\n }\n }\n if (point[j]['x'] !== point[j + 1]['x']) {\n if (showArrow) {\n arrowColor = arrowSettings['properties']['color'];\n arrowSize = arrowSettings['properties']['size'];\n offSetValue = (arrowSettings['properties']['offSet'] === undefined) ? 0 : arrowSettings['properties']['offSet'];\n var divide = (Math.round(arrowSize / 2));\n arrowPosition = arrowSettings['properties']['position'];\n startArrow = (arrowPosition === 'Start') ? 'url(#triangle' + i + ')' : null;\n endArrow = (arrowPosition === 'End') ? 'url(#triangle' + i + ')' : null;\n if (offSet !== 0 && angle === 0) {\n offSet = (arrowPosition === 'Start') ? offSetValue : -(offSetValue);\n }\n offSet = (isNullOrUndefined(offSet)) ? 0 : offSet;\n var triId = this.maps.element.id + '_triangle';\n var defElement = this.maps.renderer.createDefs();\n var xmlns = 'https://www.w3.org/2000/svg';\n var markerEle = document.createElementNS(xmlns, 'marker');\n markerEle.setAttribute('id', 'triangle' + i);\n markerEle.setAttribute('markerWidth', (arrowSize.toString()));\n markerEle.setAttribute('markerHeight', (arrowSize.toString()));\n markerEle.setAttribute('refX', (divide - offSet).toString());\n markerEle.setAttribute('refY', divide.toString());\n markerEle.setAttribute('orient', 'auto');\n var d2 = 'M 0,0 L 0,' + arrowSize + ' L ' + divide + ', ' + divide + ' Z';\n pathOption = new PathOption(triId, arrowColor, width, color, 1, dashArray, d2);\n navigationEle = this.maps.renderer.drawPath(pathOption);\n markerEle.appendChild(navigationEle);\n defElement.appendChild(markerEle);\n navigationGroup.appendChild(defElement);\n }\n angle = Math.abs(angle);\n d = (angle === 0) ? 'M ' + point[j]['x'] + ',' + point[j]['y'] + 'L ' + point[j + 1]['x']\n + ',' + point[j + 1]['y'] + ' ' :\n 'M ' + point[j]['x'] + ',' + point[j]['y'] + ' A ' + (radius_1 / 2 + (1 - angle) * radius_1 / (angle * 10)) +\n ' ' + (radius_1 / 2 + (1 - angle) * radius_1 / (angle * 10)) + ' ' + 0 + ',' + 0 + ','\n + direction + ' , ' + point[j + 1]['x'] + ',' + point[j + 1]['y'] + ' ';\n pathOption = new PathOption(arcId_1, 'none', width, color, 1, dashArray, d);\n navigationEle = this.maps.renderer.drawPath(pathOption);\n if (!isNullOrUndefined(arrowPosition)) {\n (arrowPosition === 'Start') ? navigationEle.setAttribute('marker-start', startArrow)\n : navigationEle.setAttribute('marker-end', endArrow);\n }\n navigationGroup.appendChild(navigationEle);\n group.appendChild(navigationGroup);\n }\n }\n point = [];\n }\n return group;\n };\n NavigationLine.prototype.convertRadius = function (point1, point2) {\n var value1 = point2['x'] - point1['x'];\n var value2 = point2['y'] - point1['y'];\n var value = Math.sqrt((Math.pow(value1, 2) + Math.pow(value2, 2)));\n return value;\n };\n /**\n * Get module name.\n */\n NavigationLine.prototype.getModuleName = function () {\n return 'NavigationLine';\n };\n /**\n * To destroy the layers.\n * @return {void}\n * @private\n */\n NavigationLine.prototype.destroy = function (maps) {\n /**\n * Destroy method performed here\n */\n };\n return NavigationLine;\n}());\nexport { NavigationLine };\n","import { legendRendering } from '../index';\nimport { Rect, measureText, PathOption, textTrim, removeClass, querySelector, getTemplateFunction } from '../utils/helper';\nimport { RectOption, Size, TextOption, Point, renderTextElement, drawSymbol, checkPropertyPath } from '../utils/helper';\nimport { isNullOrUndefined, Browser, EventHandler, remove } from '@syncfusion/ej2-base';\n/**\n * Legend module is used to render legend for the maps\n */\nvar Legend = /** @class */ (function () {\n function Legend(maps) {\n this.legendBorderRect = new Rect(0, 0, 0, 0);\n this.totalPages = [];\n this.page = 0;\n this.currentPage = 0;\n this.legendItemRect = new Rect(0, 0, 0, 0);\n this.heightIncrement = 0;\n this.widthIncrement = 0;\n this.textMaxWidth = 0;\n this.shapeHighlightCollection = [];\n this.shapeSelectionCollection = [];\n this.legendHighlightCollection = [];\n this.legendSelectionCollection = [];\n this.legendElement = null;\n this.shapeElement = null;\n this.shapeSelection = true;\n this.legendSelection = true;\n this.maps = maps;\n this.addEventListener();\n }\n /**\n * To calculate legend bounds and draw the legend shape and text.\n */\n Legend.prototype.renderLegend = function () {\n this.legendRenderingCollections = [];\n this.legendCollection = [];\n this.totalPages = [];\n this.widthIncrement = 0;\n this.heightIncrement = 0;\n this.defsElement = this.maps.renderer.createDefs();\n this.maps.svgObject.appendChild(this.defsElement);\n this.calculateLegendBounds();\n this.drawLegend();\n };\n /* tslint:disable-next-line:max-func-body-length */\n Legend.prototype.calculateLegendBounds = function () {\n var _this = this;\n var map = this.maps;\n var legend = map.legendSettings;\n this.legendCollection = [];\n var spacing = 10;\n var leftPadding = 10;\n var topPadding = map.mapAreaRect.y;\n this.legendRenderingCollections = [];\n map.layersCollection.forEach(function (layer, layerIndex) {\n if (!isNullOrUndefined(layer.shapeData)) {\n var layerData = layer.shapeData['features'];\n var dataPath = layer.shapeDataPath;\n var propertyPath = layer.shapePropertyPath;\n var dataSource = layer.dataSource;\n var colorValuePath = void 0;\n var colorMapping = void 0;\n if (legend.type === 'Layers' && layer.visible) {\n colorValuePath = layer.shapeSettings.colorValuePath;\n colorMapping = layer.shapeSettings.colorMapping;\n _this.getLegends(layerIndex, layerData, colorMapping, dataSource, dataPath, colorValuePath, propertyPath);\n }\n else if (legend.type === 'Bubbles') {\n for (var _i = 0, _a = layer.bubbleSettings; _i < _a.length; _i++) {\n var bubble = _a[_i];\n if (bubble.visible) {\n colorValuePath = bubble.colorValuePath;\n colorMapping = bubble.colorMapping;\n dataSource = bubble.dataSource;\n _this.getLegends(layerIndex, layerData, colorMapping, dataSource, dataPath, colorValuePath, propertyPath);\n }\n }\n }\n else {\n _this.getMarkersLegendCollections(layerIndex, layer.markerSettings);\n }\n }\n });\n var defaultSize = 25;\n var legendTitle = map.legendSettings.title.text;\n var titleTextStyle = map.legendSettings.titleStyle;\n if (this.legendCollection.length > 0) {\n var legendMode = legend.mode;\n var shapeX = 0;\n var shapeY = 0;\n var textX = 0;\n var textY = 0;\n var shapePadding = legend.shapePadding;\n var textPadding = 10;\n var shapeHeight = legend.shapeHeight;\n var shapeWidth = legend.shapeWidth;\n var shapeLocation = [];\n var textLocation = [];\n var legendRectCollection = [];\n var location_1;\n var position = legend.position;\n var labelAction = legend.labelDisplayMode;\n var arrangement = (legend.orientation === 'None') ? ((position === 'Top' || position === 'Bottom')\n ? 'Horizontal' : 'Vertical') : legend.orientation;\n var legendWidth = (legend.width.length > 1) ? (legend.width.indexOf('%') > -1) ? (map.availableSize.width / 100)\n * parseInt(legend.width, 10) : parseInt(legend.width, 10) : null;\n var legendHeight = (legend.height.length > 1) ? (legend.height.indexOf('%') > -1) ? (map.availableSize.height / 100) *\n parseInt(legend.height, 10) : parseInt(legend.height, 10) : null;\n var legendItemStartX_1;\n var legendItemStartY_1;\n var startX = 0;\n var startY = 0;\n var legendtitleSize = measureText(legendTitle, titleTextStyle);\n if (legendMode === 'Interactive') {\n var itemTextStyle = legend.textStyle;\n var rectWidth = void 0;\n var rectHeight = void 0;\n var legendLength = this.legendCollection.length;\n rectWidth = (arrangement === 'Horizontal') ? (isNullOrUndefined(legendWidth)) ? (map.mapAreaRect.width / legendLength) :\n (legendWidth / legendLength) : (isNullOrUndefined(legendWidth)) ? defaultSize : legendWidth;\n rectHeight = (arrangement === 'Horizontal') ? (isNullOrUndefined(legendHeight)) ? defaultSize : legendHeight :\n (isNullOrUndefined(legendHeight)) ? (map.mapAreaRect.height / legendLength) : (legendHeight / legendLength);\n startX = 0;\n startY = legendtitleSize.height + spacing;\n var position_1 = legend.labelPosition;\n var textX_1 = 0;\n var textY_1 = 0;\n var textPadding_1 = 10;\n var itemStartX = 0;\n var itemStartY = 0;\n var maxTextHeight = 0;\n var maxTextWidth = 0;\n for (var i = 0; i < this.legendCollection.length; i++) {\n startX = (arrangement === 'Horizontal') ? (startX + rectWidth) : startX;\n startY = (arrangement === 'Horizontal') ? startY : (startY + rectHeight);\n var legendText = this.legendCollection[i]['text'];\n var itemTextSize = new Size(0, 0);\n if (labelAction === 'None') {\n itemTextSize = measureText(legendText, itemTextStyle);\n }\n else if (labelAction === 'Trim') {\n legendText = textTrim((arrangement === 'Horizontal' ? rectWidth : rectHeight), legendText, itemTextStyle);\n itemTextSize = measureText(legendText, itemTextStyle);\n }\n else {\n legendText = '';\n }\n maxTextHeight = Math.max(maxTextHeight, itemTextSize.height);\n maxTextWidth = Math.max(maxTextWidth, itemTextSize.width);\n if (itemTextSize.width > 0 && itemTextSize.height > 0) {\n if (arrangement === 'Horizontal') {\n textX_1 = startX + (rectWidth / 2);\n textY_1 = (position_1 === 'After') ? (startY + rectHeight + (itemTextSize.height / 2)) + textPadding_1 :\n (startY - textPadding_1);\n }\n else {\n textX_1 = (position_1 === 'After') ? startX - (itemTextSize.width / 2) - textPadding_1\n : (startX + rectWidth + itemTextSize.width / 2) + textPadding_1;\n textY_1 = startY + (rectHeight / 2) + (itemTextSize.height / 4);\n }\n }\n if (i === 0) {\n itemStartX = (arrangement === 'Horizontal') ? startX : (position_1 === 'After') ?\n textX_1 - (itemTextSize.width / 2) : startX;\n itemStartY = (arrangement === 'Horizontal') ? (position_1 === 'After') ? startY :\n textY_1 - (itemTextSize.height / 2) : startY;\n }\n else if (i === this.legendCollection.length - 1) {\n legendWidth = (arrangement === 'Horizontal') ? Math.abs((startX + rectWidth) - itemStartX) :\n (rectWidth + maxTextWidth + textPadding_1);\n legendHeight = (arrangement === 'Horizontal') ? (rectHeight + (maxTextHeight / 2) + textPadding_1) :\n Math.abs((startY + rectHeight) - itemStartY);\n }\n this.legendRenderingCollections.push({\n fill: this.legendCollection[i]['fill'], x: startX, y: startY,\n width: rectWidth, height: rectHeight,\n text: legendText, textX: textX_1, textY: textY_1,\n textWidth: itemTextSize.width, textHeight: itemTextSize.height\n });\n }\n this.legendItemRect = { x: itemStartX, y: itemStartY, width: legendWidth, height: legendHeight };\n }\n else {\n legendWidth = (isNullOrUndefined(legendWidth)) ? map.mapAreaRect.width : legendWidth;\n legendHeight = (isNullOrUndefined(legendHeight)) ? map.mapAreaRect.height : legendHeight;\n var j = 0;\n for (var i = 0; i < this.legendCollection.length; i++) {\n var legendItem = this.legendCollection[i];\n if (isNullOrUndefined(this.totalPages[this.page])) {\n this.totalPages[this.page] = { Page: (this.page + 1), Collection: [] };\n }\n var legendTextSize = measureText(legendItem['text'], legend.textStyle);\n this.textMaxWidth = Math.max(this.textMaxWidth, legendTextSize.width);\n if (i === 0) {\n startX = shapeX = (leftPadding + (shapeWidth / 2));\n startY = shapeY = topPadding + legendtitleSize.height + (shapeHeight > legendTextSize.height ? shapeHeight / 2\n : (legendTextSize.height / 4));\n }\n else {\n var maxSize = (legendTextSize.height > shapeHeight) ? legendTextSize.height : shapeHeight;\n if (arrangement === 'Horizontal') {\n var prvePositionX = (textLocation[j - 1].x + textLocation[j - 1].width) + textPadding + shapeWidth;\n if ((prvePositionX + shapePadding + legendTextSize.width) > legendWidth) {\n var nextPositionY = (textLocation[j - 1].y > (shapeLocation[j - 1].y + (shapeHeight / 2)) ?\n textLocation[j - 1].y : (shapeLocation[j - 1].y + (shapeHeight / 2))) + topPadding;\n if ((nextPositionY + maxSize) > legendHeight) {\n this.getPageChanged();\n j = 0;\n shapeLocation = [];\n textLocation = [];\n legendRectCollection = [];\n shapeX = startX;\n shapeY = startY;\n }\n else {\n shapeX = (shapeLocation[0].x);\n shapeY = (nextPositionY + (maxSize / 2));\n }\n }\n else {\n shapeX = (prvePositionX - (shapeWidth / 2));\n shapeY = (shapeLocation[j - 1]).y;\n }\n }\n else {\n var prevPositionY = textLocation[j - 1].y > shapeLocation[j - 1].y + (shapeHeight / 2) ?\n textLocation[j - 1].y : shapeLocation[j - 1].y + (shapeHeight / 2);\n if ((prevPositionY + topPadding + maxSize) > legendHeight) {\n var nextPositionX = (textLocation[j - 1].x + this.textMaxWidth + textPadding);\n if ((nextPositionX + shapePadding + legendTextSize.width) > legendWidth) {\n shapeX = startX;\n shapeY = startY;\n legendRectCollection = [];\n textLocation = [];\n shapeLocation = [];\n this.getPageChanged();\n j = 0;\n }\n else {\n shapeX = nextPositionX + (shapeWidth / 2);\n shapeY = (shapeLocation[0].y);\n }\n }\n else {\n shapeX = shapeLocation[j - 1].x;\n shapeY = prevPositionY + topPadding + (shapeHeight / 2);\n }\n }\n }\n textX = shapeX + (shapeWidth / 2) + shapePadding;\n textY = shapeY + (legendTextSize.height / 4);\n shapeLocation.push({ x: shapeX, y: shapeY });\n textLocation.push({ x: textX, y: textY, width: legendTextSize.width, height: (legendTextSize.height / 2) });\n this.totalPages[this.page]['Collection'].push({\n DisplayText: legendItem['text'],\n ImageSrc: legendItem['imageSrc'],\n Shape: { x: shapeX, y: shapeY },\n Text: { x: textX, y: textY },\n Fill: legendItem['fill'],\n Rect: {\n x: shapeLocation[j].x - (shapeWidth / 2),\n y: (shapeLocation[j].y - (shapeHeight / 2)) < (textY - legendTextSize.height) ?\n (shapeLocation[j].y - (shapeHeight / 2)) : (textY - legendTextSize.height),\n width: Math.abs((shapeLocation[j].x - (shapeWidth / 2)) - (textX + legendTextSize.width)),\n height: ((shapeHeight > legendTextSize.height) ? shapeHeight : legendTextSize.height)\n }\n });\n j++;\n }\n var collection = this.totalPages[0]['Collection'];\n collection.forEach(function (legendObj, index) {\n var legendRect = new Rect(legendObj['Rect']['x'], legendObj['Rect']['y'], legendObj['Rect']['width'], legendObj['Rect']['height']);\n if (index === 0) {\n legendItemStartX_1 = legendRect.x;\n legendItemStartY_1 = legendRect.y;\n }\n _this.widthIncrement = Math.max(_this.widthIncrement, Math.abs(legendItemStartX_1 - (legendRect.x + legendRect.width)));\n _this.heightIncrement = Math.max(_this.heightIncrement, Math.abs(legendItemStartY_1 - (legendRect.y + legendRect.height)));\n });\n legendWidth = ((this.widthIncrement < legendWidth) ? this.widthIncrement : legendWidth);\n legendHeight = ((this.heightIncrement < legendHeight) ? this.heightIncrement : legendHeight);\n this.legendItemRect = {\n x: collection[0]['Rect']['x'], y: collection[0]['Rect']['y'],\n width: legendWidth, height: legendHeight\n };\n }\n }\n };\n /**\n *\n */\n Legend.prototype.getLegends = function (layerIndex, layerData, colorMapping, dataSource, dataPath, colorValuePath, propertyPath) {\n this.getRangeLegendCollection(layerIndex, layerData, colorMapping, dataSource, dataPath, colorValuePath, propertyPath);\n this.getEqualLegendCollection(layerIndex, layerData, colorMapping, dataSource, dataPath, colorValuePath, propertyPath);\n this.getDataLegendCollection(layerIndex, layerData, colorMapping, dataSource, dataPath, colorValuePath, propertyPath);\n };\n Legend.prototype.getPageChanged = function () {\n this.page++;\n if (isNullOrUndefined(this.totalPages[this.page])) {\n this.totalPages[this.page] = { Page: (this.page + 1), Collection: [] };\n }\n };\n /**\n * To draw the legend shape and text.\n */\n Legend.prototype.drawLegend = function () {\n var map = this.maps;\n var legend = map.legendSettings;\n var render = map.renderer;\n var textOptions;\n var textFont = legend.textStyle;\n this.legendGroup = render.createGroup({ id: map.element.id + '_Legend_Group' });\n var eventArgs = {\n name: legendRendering, cancel: false, fill: '', shape: legend.shape,\n shapeBorder: legend.shapeBorder\n };\n if (legend.mode === 'Interactive') {\n for (var i = 0; i < this.legendRenderingCollections.length; i++) {\n var itemId = map.element.id + '_Legend_Index_' + i;\n var textId = map.element.id + '_Legend_Index_' + i + '_Text';\n var item = this.legendRenderingCollections[i];\n var bounds = new Rect(item['x'], item['y'], item['width'], item['height']);\n var textLocation = new Point(item['textX'], item['textY']);\n eventArgs.fill = item['fill'];\n map.trigger(legendRendering, eventArgs);\n textFont.color = (textFont.color !== null) ? textFont.color : this.maps.themeStyle.legendTextColor;\n var rectOptions = new RectOption(itemId, eventArgs.fill, eventArgs.shapeBorder, legend.opacity, bounds);\n textOptions = new TextOption(textId, textLocation.x, textLocation.y, 'middle', item['text'], '', '');\n textFont.fontFamily = map.themeStyle.fontFamily || textFont.fontFamily;\n textFont.size = map.themeStyle.legendFontSize || textFont.size;\n renderTextElement(textOptions, textFont, textFont.color, this.legendGroup);\n this.legendGroup.appendChild(render.drawRectangle(rectOptions));\n }\n this.renderLegendBorder();\n }\n else {\n this.drawLegendItem(this.currentPage);\n }\n };\n Legend.prototype.drawLegendItem = function (page) {\n var map = this.maps;\n var legend = map.legendSettings;\n var spacing = 10;\n var shapeSize = new Size(legend.shapeWidth, legend.shapeHeight);\n var textOptions;\n var renderOptions;\n var render = map.renderer;\n var shapeBorder = legend.shapeBorder;\n var eventArgs = {\n name: legendRendering, cancel: false, fill: '', shape: legend.shape\n };\n if (page >= 0 && page < this.totalPages.length) {\n if (querySelector(this.legendGroup.id, this.maps.element.id)) {\n remove(querySelector(this.legendGroup.id, this.maps.element.id));\n }\n var strokeColor = (legend.shape === 'HorizontalLine' || legend.shape === 'VerticalLine'\n || legend.shape === 'Cross') ? isNullOrUndefined(legend.fill) ? '#000000' : legend.fill : shapeBorder.color;\n var strokeWidth = (legend.shape === 'HorizontalLine' || legend.shape === 'VerticalLine'\n || legend.shape === 'Cross') ? (shapeBorder.width === 0) ?\n 1 : shapeBorder.width : shapeBorder.width;\n eventArgs.shapeBorder = { width: strokeWidth, color: strokeColor };\n for (var i = 0; i < this.totalPages[page]['Collection'].length; i++) {\n var collection = this.totalPages[page]['Collection'][i];\n var legendElement = render.createGroup({ id: map.element.id + '_Legend_Index_' + i });\n var legendText = collection['DisplayText'];\n eventArgs.fill = collection['Fill'];\n eventArgs.shape = ((legend.type === 'Markers') ? ((isNullOrUndefined(collection['ImageSrc'])) ?\n legend.shape : 'Image') : legend.shape);\n map.trigger(legendRendering, eventArgs);\n var shapeId = map.element.id + '_Legend_Shape_Index_' + i;\n var textId = map.element.id + '_Legend_Text_Index_' + i;\n var shapeLocation = collection['Shape'];\n var textLocation = collection['Text'];\n var imageUrl = ((isNullOrUndefined(collection['ImageSrc'])) ? legend.shape : collection['ImageSrc']);\n var renderOptions_1 = new PathOption(shapeId, eventArgs.fill, eventArgs.shapeBorder.width, eventArgs.shapeBorder.color, legend.opacity, '');\n legend.textStyle.color = (legend.textStyle.color !== null) ? legend.textStyle.color : this.maps.themeStyle.legendTextColor;\n legend.textStyle.fontFamily = map.themeStyle.fontFamily || legend.textStyle.fontFamily;\n legend.textStyle.size = map.themeStyle.legendFontSize || legend.textStyle.size;\n legendElement.appendChild(drawSymbol(shapeLocation, eventArgs.shape, shapeSize, collection['ImageSrc'], renderOptions_1));\n textOptions = new TextOption(textId, textLocation.x, textLocation.y, 'start', legendText, '', '');\n renderTextElement(textOptions, legend.textStyle, legend.textStyle.color, legendElement);\n this.legendGroup.appendChild(legendElement);\n }\n var pagingGroup = void 0;\n var width = spacing;\n var height = (spacing / 2);\n if (this.page !== 0) {\n var pagingText = (page + 1) + '/' + this.totalPages.length;\n var pagingFont = legend.textStyle;\n var pagingTextSize = measureText(pagingText, pagingFont);\n var leftPageX = (this.legendItemRect.x + this.legendItemRect.width) - pagingTextSize.width -\n (width * 2) - spacing;\n var rightPageX = (this.legendItemRect.x + this.legendItemRect.width);\n var locY = (this.legendItemRect.y + this.legendItemRect.height) + (height / 2) + spacing;\n var pageTextX = rightPageX - width - (pagingTextSize.width / 2) - (spacing / 2);\n pagingGroup = render.createGroup({ id: map.element.id + '_Legend_Paging_Group' });\n var leftPageElement = render.createGroup({ id: map.element.id + '_Legend_Left_Paging_Group' });\n var rightPageElement = render.createGroup({ id: map.element.id + '_Legend_Right_Paging_Group' });\n var rightPath = ' M ' + rightPageX + ' ' + locY + ' L ' + (rightPageX - width) + ' ' + (locY - height) +\n ' L ' + (rightPageX - width) + ' ' + (locY + height) + ' z ';\n var leftPath = ' M ' + leftPageX + ' ' + locY + ' L ' + (leftPageX + width) + ' ' + (locY - height) +\n ' L ' + (leftPageX + width) + ' ' + (locY + height) + ' z ';\n var leftPageOptions = new PathOption(map.element.id + '_Left_Page', '#a6a6a6', 0, '#a6a6a6', 1, '', leftPath);\n leftPageElement.appendChild(render.drawPath(leftPageOptions));\n var leftRectPageOptions = new RectOption(map.element.id + '_Left_Page_Rect', 'transparent', {}, 1, new Rect(leftPageX - (width / 2), (locY - (height * 2)), width * 2, spacing * 2), null, null, '', '');\n leftPageElement.appendChild(render.drawRectangle(leftRectPageOptions));\n this.wireEvents(leftPageElement);\n var rightPageOptions = new PathOption(map.element.id + '_Right_Page', '#a6a6a6', 0, '#a6a6a6', 1, '', rightPath);\n rightPageElement.appendChild(render.drawPath(rightPageOptions));\n var rightRectPageOptions = new RectOption(map.element.id + '_Right_Page_Rect', 'transparent', {}, 1, new Rect((rightPageX - width), (locY - height), width, spacing), null, null, '', '');\n rightPageElement.appendChild(render.drawRectangle(rightRectPageOptions));\n this.wireEvents(rightPageElement);\n pagingGroup.appendChild(leftPageElement);\n pagingGroup.appendChild(rightPageElement);\n var pageTextOptions = {\n 'id': map.element.id + '_Paging_Text',\n 'x': pageTextX,\n 'y': locY + (pagingTextSize.height / 4),\n 'fill': '#a6a6a6',\n 'font-size': '14px',\n 'font-style': pagingFont.fontStyle,\n 'font-family': pagingFont.fontFamily,\n 'font-weight': pagingFont.fontWeight,\n 'text-anchor': 'middle',\n 'transform': '',\n 'opacity': 1,\n 'dominant-baseline': ''\n };\n pagingGroup.appendChild(render.createText(pageTextOptions, pagingText));\n this.legendGroup.appendChild(pagingGroup);\n }\n this.renderLegendBorder();\n }\n };\n // tslint:disable-next-line:max-func-body-length\n Legend.prototype.legendHighLightAndSelection = function (targetElement, value) {\n var shapeIndex;\n var layerIndex;\n var dataIndex;\n var textEle;\n var legend = this.maps.legendSettings;\n textEle = legend.mode === 'Default' ? document.getElementById(targetElement.id.replace('Shape', 'Text')) :\n document.getElementById(targetElement.id + '_Text');\n var collection = this.maps.legendModule.legendCollection;\n var length;\n var selectLength = 0;\n var interactProcess = true;\n if (value === 'selection') {\n this.shapeHighlightCollection = [];\n if (this.legendSelectionCollection.length > 0) {\n for (var k = 0; k < this.legendSelectionCollection.length; k++) {\n if (targetElement === this.legendSelectionCollection[k]['legendElement']) {\n interactProcess = false;\n this.removeLegendSelectionCollection();\n this.legendSelectionCollection.splice(k, 1);\n break;\n }\n else {\n this.removeLegendSelectionCollection();\n this.legendSelectionCollection.splice(k, 1);\n }\n }\n }\n }\n else {\n if (this.legendSelectionCollection.length > 0) {\n for (var k = 0; k < this.legendSelectionCollection.length; k++) {\n if ((targetElement.id.indexOf('_Legend_Shape') > -1 || targetElement.id.indexOf('_Legend_Index')) && targetElement ===\n this.legendSelectionCollection[k]['legendElement']) {\n interactProcess = false;\n break;\n }\n else {\n this.removeLegendHighlightCollection();\n }\n }\n }\n this.removeLegendHighlightCollection();\n }\n if (interactProcess) {\n for (var i = 0; i < collection.length; i++) {\n if (textEle.textContent === collection[i]['text'] && collection[i]['data'].length > 0) {\n var layer = this.maps.layers[collection[i]['data'][0]['layerIndex']];\n var enable = (value === 'selection') ? layer.selectionSettings.enable : layer.highlightSettings.enable;\n var module = void 0;\n module = (value === 'selection') ? layer.selectionSettings : layer.highlightSettings;\n var data = collection[i]['data'];\n if (enable) {\n for (var j = 0; j < data.length; j++) {\n shapeIndex = data[j]['shapeIndex'];\n layerIndex = data[j]['layerIndex'];\n dataIndex = data[j]['dataIndex'];\n var shapeEle = document.getElementById(this.maps.element.id + '_LayerIndex_' +\n layerIndex + '_shapeIndex_' + shapeIndex + '_dataIndex_' + dataIndex);\n if (shapeEle !== null) {\n if (value === 'highlight' && this.shapeElement !== targetElement) {\n this.setColor(shapeEle, module.fill, module.opacity.toString(), module.border.color, module.border.width.toString());\n this.setColor(targetElement, module.fill, module.opacity.toString(), module.border.color, module.border.width.toString());\n if (j === 0) {\n this.legendHighlightCollection = [];\n this.pushCollection(targetElement, this.legendHighlightCollection, collection[i]);\n }\n length = this.legendHighlightCollection.length;\n this.legendHighlightCollection[length - 1]['MapShapeCollection']['Elements'].push(shapeEle);\n }\n else if (value === 'selection' && this.shapeSelection) {\n this.setColor(targetElement, module.fill, module.opacity.toString(), module.border.color, module.border.width.toString());\n this.setColor(shapeEle, module.fill, module.opacity.toString(), module.border.color, module.border.width.toString());\n this.legendHighlightCollection = [];\n if (j === 0) {\n this.pushCollection(targetElement, this.legendSelectionCollection, collection[i]);\n }\n selectLength = this.legendSelectionCollection.length;\n this.legendSelectionCollection[selectLength - 1]['MapShapeCollection']['Elements'].push(shapeEle);\n this.legendElement = targetElement;\n if (j === data.length - 1) {\n this.legendSelection = false;\n }\n }\n }\n }\n }\n }\n }\n }\n };\n Legend.prototype.setColor = function (element, fill, opacity, borderColor, borderWidth) {\n element.setAttribute('fill', fill);\n element.setAttribute('opacity', opacity);\n element.setAttribute('stroke', borderColor);\n element.setAttribute('stroke-width', borderWidth);\n };\n Legend.prototype.pushCollection = function (targetElement, collection, oldElement) {\n collection.push({\n legendElement: targetElement, legendOldFill: oldElement['fill'], legendOldOpacity: oldElement['opacity'],\n legendOldBorderColor: oldElement['borderColor'], legendOldBorderWidth: oldElement['borderWidth']\n });\n length = collection.length;\n collection[length - 1]['MapShapeCollection'] = { Elements: [] };\n };\n Legend.prototype.removeLegend = function (collection) {\n for (var i = 0; i < collection.length; i++) {\n var item = collection[i];\n this.setColor(item['legendElement'], item['legendOldFill'], item['legendOldOpacity'], item['legendOldBorderColor'], item['legendOldBorderWidth']);\n var dataCount = item['MapShapeCollection']['Elements'].length;\n for (var j = 0; j < dataCount; j++) {\n this.setColor(item['MapShapeCollection']['Elements'][j], item['legendOldFill'], item['legendOldOpacity'], item['legendOldBorderColor'], item['legendOldBorderWidth']);\n }\n }\n };\n Legend.prototype.removeLegendHighlightCollection = function () {\n if (this.legendHighlightCollection.length > 0) {\n this.removeLegend(this.legendHighlightCollection);\n }\n };\n Legend.prototype.removeLegendSelectionCollection = function () {\n if (this.legendSelectionCollection.length > 0) {\n this.removeLegend(this.legendSelectionCollection);\n this.legendElement = null;\n this.legendSelection = true;\n }\n };\n Legend.prototype.removeShapeHighlightCollection = function () {\n if (this.shapeHighlightCollection.length > 0) {\n for (var i = 0; i < this.shapeHighlightCollection.length; i++) {\n var item = this.shapeHighlightCollection[i];\n var removeFill = true;\n for (var j = 0; j < this.shapeSelectionCollection.length; j++) {\n if (this.shapeSelectionCollection[j]['legendElement'] === item['legendElement']) {\n removeFill = false;\n }\n }\n if (removeFill) {\n this.setColor(item['legendElement'], item['legendOldFill'], item['legendOldOpacity'], item['legendOldBorderColor'], item['legendOldBorderWidth']);\n }\n }\n }\n };\n Legend.prototype.shapeHighLightAndSelection = function (targetElement, data, module, getValue, layerIndex) {\n if (data !== undefined) {\n var collection = this.maps.legendModule.legendCollection;\n var index = this.legendIndexOnShape(data, layerIndex);\n var text = collection[index]['text'];\n var content = void 0;\n var legendShape = void 0;\n if (this.maps.legendSettings.mode === 'Default') {\n content = document.getElementById(this.maps.element.id + '_Legend_Text_Index_' + index).textContent;\n legendShape = document.getElementById(this.maps.element.id + '_Legend_Shape_Index_' + index);\n }\n else {\n content = document.getElementById(this.maps.element.id + '_Legend_Index_' + index + '_Text').textContent;\n legendShape = document.getElementById(this.maps.element.id + '_Legend_Index_' + index);\n }\n var shapeElement = this.shapeDataOnLegend(targetElement);\n this.oldShapeElement = shapeElement['LegendEle'];\n var length_1 = this.shapeSelectionCollection.length;\n if (text === content) {\n if (getValue === 'highlight' && shapeElement['LegendEle'] !== this.legendElement) {\n var selectionEle = this.isTargetSelected(shapeElement, this.shapeHighlightCollection);\n if (selectionEle === undefined || (selectionEle && !selectionEle['IsSelected'])) {\n this.pushCollection(legendShape, this.shapeHighlightCollection, collection[index]);\n }\n if (length_1 > 0) {\n for (var j = 0; j < length_1; j++) {\n if (shapeElement['LegendEle'] === this.shapeSelectionCollection[j]['legendElement']) {\n break;\n }\n else if (j === length_1 - 1) {\n this.removeShapeHighlightCollection();\n this.setColor(legendShape, module.fill, module.opacity.toString(), module.border.color, module.border.width.toString());\n }\n }\n }\n else {\n this.removeShapeHighlightCollection();\n this.setColor(legendShape, module.fill, module.opacity.toString(), module.border.color, module.border.width.toString());\n }\n }\n else if (getValue === 'selection') {\n var selectionEle = this.isTargetSelected(shapeElement, this.shapeSelectionCollection);\n if (length_1 > 0) {\n for (var j = 0; j < length_1; j++) {\n if (shapeElement['LegendEle'] !== this.shapeSelectionCollection[j]['legendElement']) {\n var element = this.shapeSelectionCollection[j];\n this.setColor(element['legendElement'], element['legendOldFill'], element['legendOldOpacity'], element['legendOldBorderColor'], element['legendOldBorderWidth']);\n this.shapeSelection = true;\n this.shapeElement = null;\n }\n }\n }\n if (selectionEle && (selectionEle['IsSelected'] && targetElement.getAttribute('class') === 'ShapeselectionMapStyle')) {\n var element = this.shapeSelectionCollection[selectionEle['SelectionIndex']];\n this.setColor(shapeElement['LegendEle'], element['legendOldFill'], element['legendOldOpacity'], element['legendOldBorderColor'], element['legendOldBorderWidth']);\n this.shapeSelectionCollection.splice(selectionEle['SelectionIndex'], 1);\n this.shapeSelection = true;\n this.shapeElement = null;\n }\n if (targetElement.getAttribute('class') !== 'ShapeselectionMapStyle' && this.legendSelection) {\n if (selectionEle === undefined || (selectionEle && !selectionEle['IsSelected'])) {\n this.pushCollection(legendShape, this.shapeSelectionCollection, collection[index]);\n }\n this.setColor(legendShape, module.fill, module.opacity.toString(), module.border.color, module.border.width.toString());\n this.shapeElement = shapeElement['LegendEle'];\n this.shapeSelection = false;\n }\n }\n else if (document.getElementsByClassName('highlightMapStyle').length > 0) {\n this.removeShapeHighlightCollection();\n removeClass(document.getElementsByClassName('highlightMapStyle')[0]);\n }\n }\n }\n else {\n this.removeShapeHighlightCollection();\n }\n };\n Legend.prototype.isTargetSelected = function (target, collection) {\n var selectEle;\n for (var i = 0; i < collection.length; i++) {\n if (target['LegendEle'] === collection[i]['legendElement']) {\n selectEle = { IsSelected: true, SelectionIndex: i };\n }\n }\n return selectEle;\n };\n Legend.prototype.legendIndexOnShape = function (data, index) {\n var legendIndex;\n var path = this.maps.layers[index].shapeDataPath;\n var value = data[path];\n var collection = this.maps.legendModule.legendCollection;\n for (var i = 0; i < collection.length; i++) {\n var dataValue = collection[i]['data'];\n for (var j = 0; j < dataValue.length; j++) {\n if (value === dataValue[j]['name']) {\n legendIndex = i;\n }\n }\n }\n return legendIndex;\n };\n Legend.prototype.shapeDataOnLegend = function (targetElement) {\n var shapeIndex;\n var layerIndex;\n var dataIndex;\n var collection = this.maps.legendModule.legendCollection;\n var legend = this.maps.legendSettings;\n for (var i = 0; i < collection.length; i++) {\n var data = collection[i]['data'];\n var process = false;\n var elements = [];\n var currentElement = { Elements: [] };\n for (var j = 0; j < data.length; j++) {\n shapeIndex = data[j]['shapeIndex'];\n layerIndex = data[j]['layerIndex'];\n dataIndex = data[j]['dataIndex'];\n var shapeEle = document.getElementById(this.maps.element.id + '_LayerIndex_' +\n layerIndex + '_shapeIndex_' + shapeIndex + '_dataIndex_' + dataIndex);\n if (targetElement === shapeEle) {\n process = true;\n }\n elements.push(shapeEle);\n }\n if (process) {\n if (isNullOrUndefined(currentElement['LegendEle'])) {\n currentElement['LegendEle'] = legend.mode === 'Default' ?\n document.getElementById(this.maps.element.id + '_Legend_Shape_Index_' + i) :\n document.getElementById(this.maps.element.id + '_Legend_Index_' + i);\n }\n currentElement['Elements'] = elements;\n return currentElement;\n }\n }\n return null;\n };\n //tslint:disable\n Legend.prototype.renderLegendBorder = function () {\n var map = this.maps;\n var legend = map.legendSettings;\n var legendTitle = legend.title.text;\n var textStyle = legend.titleStyle;\n var textOptions;\n var spacing = 10;\n var trimTitle = textTrim((this.legendItemRect.width + (spacing * 2)), legendTitle, textStyle);\n var textSize = measureText(trimTitle, textStyle);\n this.legendBorderRect = new Rect((this.legendItemRect.x - spacing), (this.legendItemRect.y - spacing - textSize.height), (this.legendItemRect.width) + (spacing * 2), (this.legendItemRect.height) + (spacing * 2) + textSize.height +\n (legend.mode === 'Interactive' ? 0 : (this.page !== 0) ? spacing : 0));\n if (legendTitle) {\n textStyle.color = (textStyle.color !== null) ? textStyle.color : this.maps.themeStyle.legendTextColor;\n textOptions = new TextOption(map.element.id + '_LegendTitle', (this.legendItemRect.x) + (this.legendItemRect.width / 2), this.legendItemRect.y - (textSize.height / 2) - spacing / 2, 'middle', trimTitle, '');\n renderTextElement(textOptions, textStyle, textStyle.color, this.legendGroup);\n }\n var renderOptions = new RectOption(map.element.id + '_Legend_Border', legend.background, legend.border, 1, this.legendBorderRect, null, null, '', '');\n this.legendGroup.appendChild(map.renderer.drawRectangle(renderOptions));\n this.translate = (legend.position !== 'Float') ?\n this.getLegendAlignment(map, this.legendBorderRect.width, this.legendBorderRect.height, legend) : legend.location;\n this.legendGroup.setAttribute('transform', 'translate( ' + (this.translate.x + (-(this.legendBorderRect.x))) + ' ' +\n (this.translate.y + (-(this.legendBorderRect.y))) + ' )');\n map.svgObject.appendChild(this.legendGroup);\n };\n Legend.prototype.changeNextPage = function (e) {\n this.currentPage = (e.target.id.indexOf('_Left_Page_') > -1) ? (this.currentPage - 1) :\n (this.currentPage + 1);\n this.legendGroup = this.maps.renderer.createGroup({ id: this.maps.element.id + '_Legend_Group' });\n this.drawLegendItem(this.currentPage);\n if (querySelector(this.maps.element.id + '_Legend_Border', this.maps.element.id)) {\n querySelector(this.maps.element.id + '_Legend_Border', this.maps.element.id).style.pointerEvents = 'none';\n }\n };\n Legend.prototype.getLegendAlignment = function (map, width, height, legend) {\n var x;\n var y;\n var spacing = 10;\n var totalWidth = map.availableSize.width;\n var totalHeight = map.availableSize.height;\n switch (legend.position) {\n case 'Top':\n case 'Bottom':\n map.mapAreaRect.height = (map.mapAreaRect.height - height);\n x = (totalWidth / 2) - (width / 2);\n y = (legend.position === 'Top') ? map.mapAreaRect.y : (map.mapAreaRect.y + map.mapAreaRect.height);\n map.mapAreaRect.y = (legend.position === 'Top') ? map.mapAreaRect.y + height + spacing : map.mapAreaRect.y;\n break;\n case 'Left':\n case 'Right':\n map.mapAreaRect.width = (map.mapAreaRect.width - width);\n x = (legend.position === 'Left') ? map.mapAreaRect.x : map.mapAreaRect.x + map.mapAreaRect.width;\n y = (totalHeight / 2) - (height / 2);\n map.mapAreaRect.x = (legend.position === 'Left') ? map.mapAreaRect.x + width : map.mapAreaRect.x;\n break;\n }\n switch (legend.alignment) {\n case 'Near':\n if (legend.position === 'Top' || legend.position === 'Bottom') {\n x = map.mapAreaRect.x;\n }\n else {\n y = map.mapAreaRect.y;\n }\n break;\n case 'Far':\n if (legend.position === 'Top' || legend.position === 'Bottom') {\n x = totalWidth - width;\n }\n else {\n y = totalHeight - height;\n }\n break;\n }\n return new Point(x, y);\n };\n Legend.prototype.getMarkersLegendCollections = function (layerIndex, markers) {\n var _this = this;\n markers.forEach(function (marker, markerIndex) {\n var dataSource = marker.dataSource;\n var field = marker.legendText;\n var templateFn;\n var isDuplicate;\n dataSource.forEach(function (data, dataIndex) {\n var imageSrc = null;\n var showLegend = isNullOrUndefined(data[_this.maps.legendSettings.showLegendPath]) ? true :\n data[_this.maps.legendSettings.showLegendPath];\n if (marker.visible && showLegend && (!isNullOrUndefined(data['latitude'])) && (!isNullOrUndefined(data['longitude']))) {\n if (marker.template) {\n templateFn = getTemplateFunction(marker.template);\n var templateElement = templateFn(_this.maps);\n var markerEle = isNullOrUndefined(templateElement.childElementCount) ? templateElement[0] :\n templateElement;\n imageSrc = markerEle.querySelector('img').src;\n }\n var text = isNullOrUndefined(data[field]) ? '' : data[field];\n isDuplicate = _this.maps.legendSettings.removeDuplicateLegend ?\n _this.removeDuplicates(_this.legendCollection, text) : false;\n if (!isDuplicate) {\n _this.legendCollection.push({\n layerIndex: layerIndex, markerIndex: markerIndex, dataIndex: dataIndex,\n fill: marker.fill, text: text, imageSrc: imageSrc\n });\n }\n }\n });\n });\n };\n Legend.prototype.getRangeLegendCollection = function (layerIndex, layerData, colorMapping, dataSource, dataPath, colorValuePath, propertyPath) {\n var _this = this;\n var legendText;\n var legendIndex = 0;\n var fill = this.maps.legendSettings.fill;\n var rangeData = [];\n var _loop_1 = function (colorMap) {\n if (!isNullOrUndefined(colorMap.from) && !isNullOrUndefined(colorMap.to)) {\n legendText = !isNullOrUndefined(colorMap.label) ? colorMap.label : colorMap.from + ' - ' + colorMap.to;\n rangeData = [];\n var colorMapProcess_1 = false;\n dataSource.forEach(function (data, dataIndex) {\n var colorValue = parseFloat(data[colorValuePath]);\n if (colorValue >= colorMap.from && colorValue <= colorMap.to) {\n colorMapProcess_1 = true;\n rangeData.push(_this.getLegendData(layerIndex, dataIndex, data, dataPath, layerData, propertyPath, colorValue));\n }\n });\n if (!colorMapProcess_1) {\n rangeData.push({\n layerIndex: layerIndex, shapeIndex: null, dataIndex: null,\n name: null, value: null\n });\n }\n var legendFill = (isNullOrUndefined(fill)) ? Object.prototype.toString.call(colorMap.color) === '[object Array]' ?\n !isNullOrUndefined(colorMap.value) ? colorMap.color[0] : this_1.legendGradientColor(colorMap, legendIndex) :\n colorMap.color : fill;\n legendIndex++;\n this_1.getOverallLegendItemsCollection(legendText, legendFill, rangeData, colorMap.showLegend);\n }\n };\n var this_1 = this;\n for (var _i = 0, colorMapping_1 = colorMapping; _i < colorMapping_1.length; _i++) {\n var colorMap = colorMapping_1[_i];\n _loop_1(colorMap);\n }\n };\n Legend.prototype.getOverallLegendItemsCollection = function (legendText, legendFill, legendData, showLegend) {\n var newColllection = [];\n var legend = this.maps.legendSettings;\n if (legendData.length > 0 && showLegend) {\n for (var i = 0; i < legendData.length; i++) {\n var collection = legendData[i];\n if (collection.length > 0) {\n for (var j = 0; j < collection.length; j++) {\n newColllection.push(collection[j]);\n }\n }\n else {\n newColllection.push(legendData[i]);\n }\n newColllection['_isVisible'] = true;\n }\n var isDuplicate = this.maps.legendSettings.removeDuplicateLegend ?\n this.removeDuplicates(this.legendCollection, legendText) : false;\n if (!isDuplicate) {\n this.legendCollection.push({\n text: legendText, fill: legendFill, data: newColllection, opacity: legend.opacity,\n borderColor: legend.border.color, borderWidth: legend.border.width\n });\n }\n }\n };\n Legend.prototype.removeDuplicates = function (legendCollection, text) {\n var isDuplicate = false;\n for (var i = 0; i < legendCollection.length; i++) {\n if (legendCollection[i]['text'] === text) {\n isDuplicate = true;\n break;\n }\n else {\n continue;\n }\n }\n return isDuplicate;\n };\n Legend.prototype.getEqualLegendCollection = function (layerIndex, layerData, colorMapping, dataSource, dataPath, colorValuePath, propertyPath) {\n var _this = this;\n var fill = this.maps.legendSettings.fill;\n var equalValues = [];\n var legendText;\n var legendIndex = 0;\n var equalData = [];\n var outOfRangeValues = [];\n var outOfRange = [];\n var _loop_2 = function (colorMap) {\n if (!isNullOrUndefined(colorMap.value)) {\n legendText = !isNullOrUndefined(colorMap.label) ? colorMap.label : colorMap.value;\n equalData = [];\n var eqaulColorProcess_1 = false;\n dataSource.forEach(function (data, dataIndex) {\n var equalValue = data[colorValuePath];\n if (equalValue === colorMap.value) {\n eqaulColorProcess_1 = true;\n if (equalValues.indexOf(equalValue) === -1) {\n equalValues.push(equalValue);\n }\n equalData.push(_this.getLegendData(layerIndex, dataIndex, data, dataPath, layerData, propertyPath, equalValue));\n }\n else {\n if (outOfRangeValues.indexOf(equalValue) === -1) {\n outOfRangeValues.push(equalValue);\n }\n }\n });\n for (var x = 0; x < equalValues.length; x++) {\n for (var y = 0; y < outOfRangeValues.length; y++) {\n if (equalValues[x] === outOfRangeValues[y]) {\n var equalIndex = outOfRangeValues.indexOf(equalValues[x]);\n outOfRangeValues.splice(equalIndex, 1);\n }\n }\n }\n if (!eqaulColorProcess_1) {\n equalData.push({\n layerIndex: layerIndex, shapeIndex: null, dataIndex: null,\n name: null, value: null\n });\n }\n var legendFill = (isNullOrUndefined(fill)) ? Object.prototype.toString.call(colorMap.color) === '[object Array]'\n ? colorMap.color[0] : colorMap.color : fill;\n legendIndex++;\n this_2.getOverallLegendItemsCollection(legendText, legendFill, equalData, colorMap.showLegend);\n }\n else if (isNullOrUndefined(colorMap.minOpacity) && isNullOrUndefined(colorMap.maxOpacity) && isNullOrUndefined(colorMap.value)\n && isNullOrUndefined(colorMap.from) && isNullOrUndefined(colorMap.to) && !isNullOrUndefined(colorMap.color)) {\n dataSource.forEach(function (data, dataIndex) {\n var equalValue = data[colorValuePath];\n for (var k = 0; k < outOfRangeValues.length; k++) {\n if (equalValue === outOfRangeValues[k]) {\n outOfRange.push(_this.getLegendData(layerIndex, dataIndex, data, dataPath, layerData, propertyPath, equalValue));\n }\n }\n });\n if (outOfRangeValues.length === 0) {\n var range_1 = false;\n var outRange = [];\n dataSource.forEach(function (data, dataIndex) {\n range_1 = false;\n var rangeValue = data[colorValuePath];\n for (var z = 0; z < colorMapping.length; z++) {\n if (!isNullOrUndefined(rangeValue) && rangeValue !== 0) {\n if (rangeValue >= colorMapping[z].from && rangeValue <= colorMapping[z].to) {\n range_1 = true;\n }\n }\n else if (!range_1) {\n range_1 = false;\n }\n }\n if (!range_1) {\n outOfRange.push(_this.getLegendData(layerIndex, dataIndex, data, dataPath, layerData, propertyPath, rangeValue));\n }\n });\n }\n legendText = !isNullOrUndefined(colorMap.label) ? colorMap.label : 'Others';\n var outfill = ((Object.prototype.toString.call(colorMap.color) === '[object Array]'))\n ? colorMap.color[0] : colorMap.color;\n var legendOutFill = outfill;\n legendIndex++;\n this_2.getOverallLegendItemsCollection(legendText, legendOutFill, outOfRange, colorMap.showLegend);\n }\n };\n var this_2 = this;\n for (var _i = 0, colorMapping_2 = colorMapping; _i < colorMapping_2.length; _i++) {\n var colorMap = colorMapping_2[_i];\n _loop_2(colorMap);\n }\n };\n Legend.prototype.getDataLegendCollection = function (layerIndex, layerData, colorMapping, dataSource, dataPath, colorValuePath, propertyPath) {\n var _this = this;\n var legendText;\n var fill = this.maps.legendSettings.fill;\n var valuePath = this.maps.legendSettings.valuePath;\n if (!isNullOrUndefined(colorValuePath) && !isNullOrUndefined(dataSource)) {\n dataSource.forEach(function (data, dataIndex) {\n var showLegend = isNullOrUndefined(data[_this.maps.legendSettings.showLegendPath]) ?\n true : data[_this.maps.legendSettings.showLegendPath];\n var dataValue = data[colorValuePath];\n var newData = [];\n var legendFill = (isNullOrUndefined(fill)) ? dataValue : fill;\n if (!isNullOrUndefined(dataValue) && colorMapping.length === 0) {\n legendText = !isNullOrUndefined(data[valuePath]) ? data[valuePath] : data[dataPath];\n newData.push(_this.getLegendData(layerIndex, dataIndex, data, dataPath, layerData, propertyPath, dataValue));\n }\n _this.getOverallLegendItemsCollection(legendText, legendFill, newData, showLegend);\n });\n }\n };\n Legend.prototype.interactiveHandler = function (e) {\n var target = e.target;\n var legend = this.maps.legendSettings;\n var id = this.maps.element.id + '_Interactive_Legend';\n var hoverId = legend.type === 'Layers' ? '_shapeIndex_' : (legend.type === 'Markers') ? '_MarkerIndex_' :\n '_BubbleIndex_';\n if (target.id.indexOf(hoverId) > 1) {\n var layerIndex = parseFloat(target.id.split('_LayerIndex_')[1].split('_')[0]);\n var dataIndex = parseFloat(target.id.split(/_dataIndex_/i)[1].split('_')[0]);\n var fill = void 0;\n var stroke = void 0;\n var strokeWidth = void 0;\n if (!(isNullOrUndefined(querySelector(id, this.maps.element.id)))) {\n remove(querySelector(id, this.maps.element.id));\n }\n var layer = this.maps.layersCollection[layerIndex];\n var markerVisible = (legend.type === 'Layers' ? layer.visible :\n legend.type === 'Markers' ? layer.markerSettings[parseFloat(target.id.split('_MarkerIndex_')[1].split('_')[0])].visible :\n (this.maps.getBubbleVisible(this.maps.layersCollection[layerIndex])));\n if (legend.visible && this.legendRenderingCollections.length > 0\n && legend.mode === 'Interactive' && markerVisible) {\n var svgRect = this.maps.svgObject.getBoundingClientRect();\n for (var i = 0; i < this.legendCollection.length; i++) {\n var currentData = this.legendCollection[i];\n var legendElement = querySelector(this.maps.element.id + '_Legend_Index_' + i, this.maps.element.id);\n var legendRect = legendElement.getBoundingClientRect();\n var rect = new Rect(Math.abs(legendRect.left - svgRect.left), Math.abs(legendRect.top - svgRect.top), legendRect.width, legendRect.height);\n fill = legendElement.getAttribute('fill');\n stroke = legend.shapeBorder.color;\n strokeWidth = legend.shapeBorder.width;\n if (!isNullOrUndefined(currentData['data'])) {\n var data = currentData['data'];\n for (var j = 0; j < data.length; j++) {\n if (dataIndex === data[j]['dataIndex'] && layerIndex === data[j]['layerIndex']) {\n this.renderInteractivePointer(legend, fill, stroke, id, strokeWidth, rect);\n break;\n }\n }\n }\n }\n }\n }\n else {\n if (!(isNullOrUndefined(querySelector(id, this.maps.element.id)))) {\n remove(querySelector(id, this.maps.element.id));\n }\n }\n };\n Legend.prototype.renderInteractivePointer = function (legend, fill, stroke, id, strokeWidth, rect) {\n var path;\n var pathOptions;\n var locX;\n var locY;\n var height = 10;\n var width = 10;\n var direction = (legend.orientation === 'None') ? (legend.position === 'Top' || legend.position === 'Bottom')\n ? 'Horizontal' : 'Vertical' : legend.orientation;\n if (direction === 'Horizontal') {\n if (!legend.invertedPointer) {\n locX = rect.x + (rect.width / 2);\n locY = rect.y;\n path = ' M ' + locX + ' ' + locY + ' L ' + (locX - width) + ' ' + (locY - height) +\n ' L ' + (locX + width) + ' ' + (locY - height) + ' Z ';\n }\n else {\n locX = rect.x + (rect.width / 2);\n locY = rect.y + (rect.height);\n path = ' M ' + locX + ' ' + locY + ' L ' + (locX - width) + ' ' + (locY + height) +\n ' L ' + (locX + width) + ' ' + (locY + height) + ' Z ';\n }\n }\n else {\n if (!legend.invertedPointer) {\n locX = rect.x + (rect.width);\n locY = rect.y + (rect.height / 2);\n path = ' M ' + locX + ' ' + locY + ' L ' + (locX + width) + ' ' + (locY - height) +\n ' L ' + (locX + width) + ' ' + (locY + height) + ' z ';\n }\n else {\n locX = rect.x;\n locY = rect.y + (rect.height / 2);\n path = ' M ' + locX + ' ' + locY + ' L ' + (locX - width) + ' ' + (locY - height) +\n ' L ' + (locX - width) + ' ' + (locY + height) + ' z ';\n }\n }\n pathOptions = new PathOption(id, fill, strokeWidth, stroke, 1, '', path);\n this.maps.svgObject.appendChild(this.maps.renderer.drawPath(pathOptions));\n };\n Legend.prototype.wireEvents = function (element) {\n EventHandler.add(element, Browser.touchStartEvent, this.changeNextPage, this);\n };\n Legend.prototype.addEventListener = function () {\n if (this.maps.isDestroyed) {\n return;\n }\n this.maps.on(Browser.touchMoveEvent, this.interactiveHandler, this);\n this.maps.on(Browser.touchEndEvent, this.interactiveHandler, this);\n // this.maps.on(click, this.legendClick, this);\n };\n // private legendClick(targetEle: Element): void {\n // if (targetEle.parentElement.id.indexOf(this.maps.element.id + '_Legend_Index_') > -1) {\n // let mapElement: Element;\n // let data: object;\n // let legendIndex: number = parseFloat(targetEle.parentElement.id.substr((this.maps.element.id + '_Legend_Index_').length));\n // let selectedItem: object[] = this.legendCollection[legendIndex]['data'];\n // let childElement: Element;\n // let isVisible: boolean = selectedItem['_isVisible'];\n // if (this.maps.legendSettings.toggleVisibility) {\n // for (let i: number = 0; i < selectedItem.length; i++) {\n // data = this.legendCollection[legendIndex]['data'][i];\n // mapElement = querySelector(\n // this.maps.element.id + '_LayerIndex_' + data['layerIndex'] +\n // '_ShapeIndex_' + data['shapeIndex'] + '_dataIndex_' + data['dataIndex'],\n // this.maps.element.id);\n // if (isVisible) {\n // mapElement.setAttribute('opacity', '0');\n // } else {\n // mapElement.setAttribute('opacity', '1');\n // }\n // }\n // selectedItem['_isVisible'] = isVisible ? false : true;\n // } else if (this.maps.legendSettings.legendSelection && this.maps.selectionSettings.enable) {\n // this.selectShapes(targetEle, legendIndex);\n // }\n // }\n // }\n // private selectShapes(targetEle: Element, legendIndex: number): void {\n // let mapElement: Element;\n // let selectedElements: NodeListOf;\n // let selectedLength: number;\n // let childElement: HTMLElement = targetEle.parentElement.childNodes[0] as HTMLElement;\n // let legendSelected: boolean = targetEle.parentElement.id.indexOf('_Legend_Index_') &&\n // childElement.getAttribute('class') ? true : false;\n // if (!this.maps.selectionSettings.enableMultiSelect) {\n // selectedElements = querySelectorAll('selectionMapStyle', document.body);\n // selectedLength = selectedElements.length;\n // for (let i: number = 0; i < selectedLength; i++) {\n // removeClass(selectedElements[selectedElements.length - 1]);\n // }\n // if (!legendSelected) {\n // this.select(legendIndex, targetEle);\n // }\n // } else {\n // if (legendSelected) {\n // for (let data of this.legendCollection[legendIndex]['data']) {\n // mapElement = querySelector(\n // this.maps.element.id + '_LayerIndex_' + data['layerIndex'] +\n // '_ShapeIndex_' + data['shapeIndex'] + '_dataIndex_' + data['dataIndex'],\n // this.maps.element.id);\n // removeClass(mapElement);\n // }\n // removeClass(childElement);\n // } else {\n // this.select(legendIndex, targetEle);\n // }\n // }\n // }\n // private select(legendIndex: number, targetEle: Element): void {\n // let mapElement: Element;\n // let childElement: HTMLElement = targetEle.parentElement.childNodes[0] as HTMLElement;\n // for (let i: number = 0; i < this.legendCollection.length; i++) {\n // if (i === legendIndex && !childElement.getAttribute('class')) {\n // for (let data of this.legendCollection[i]['data']) {\n // mapElement = querySelector(\n // this.maps.element.id + '_LayerIndex_' + data['layerIndex'] +\n // '_ShapeIndex_' + data['shapeIndex'] + '_dataIndex_' + data['dataIndex'],\n // this.maps.element.id);\n // let eventArgs: IShapeSelectedEventArgs = {\n // cancel: false,\n // name: shapeSelected,\n // fill: this.maps.selectionSettings.fill,\n // opacity: this.maps.selectionSettings.opacity,\n // border: this.maps.selectionSettings.border\n // };\n // if (!document.getElementById('selectionMap')) {\n // document.body.appendChild(createStyle('selectionMap', 'selectionMapStyle', eventArgs));\n // }\n // mapElement.setAttribute('class', 'selectionMapStyle');\n // }\n // childElement.setAttribute('class', 'selectionMapStyle');\n // }\n // }\n // }\n Legend.prototype.removeEventListener = function () {\n if (this.maps.isDestroyed) {\n return;\n }\n this.maps.off(Browser.touchMoveEvent, this.interactiveHandler);\n this.maps.off(Browser.touchEndEvent, this.interactiveHandler);\n // this.maps.off(click, this.legendClick);\n };\n Legend.prototype.getLegendData = function (layerIndex, dataIndex, data, dataPath, layerData, shapePropertyPath, value) {\n var legendData = [];\n if (Object.prototype.toString.call(layerData) === '[object Array]') {\n for (var i = 0; i < layerData.length; i++) {\n var shapeData = layerData[i];\n var shapePath = checkPropertyPath(data[dataPath], shapePropertyPath, shapeData['properties']);\n if (shapeData['properties'][shapePath] === data[dataPath]) {\n legendData.push({\n layerIndex: layerIndex, shapeIndex: i, dataIndex: dataIndex,\n name: data[dataPath], value: value\n });\n }\n }\n }\n return legendData;\n };\n Legend.prototype.legendGradientColor = function (colorMap, legendIndex) {\n var legendFillColor;\n var xmlns = 'https://www.w3.org/2000/svg';\n if (!isNullOrUndefined(colorMap.color) && typeof (colorMap.color) === 'object') {\n var linerGradientEle = document.createElementNS(xmlns, 'linearGradient');\n var opacity = 1;\n var position = this.maps.legendSettings.position;\n var x2 = void 0;\n var y2 = void 0;\n x2 = position === 'Top' || position === 'Bottom' ? '100' : '0';\n y2 = position === 'Top' || position === 'Bottom' ? '0' : '100';\n linerGradientEle.setAttribute('id', 'linear_' + legendIndex);\n linerGradientEle.setAttribute('x1', 0 + '%');\n linerGradientEle.setAttribute('y1', 0 + '%');\n linerGradientEle.setAttribute('x2', x2 + '%');\n linerGradientEle.setAttribute('y2', y2 + '%');\n for (var b = 0; b < colorMap.color.length; b++) {\n var offsetColor = 100 / (colorMap.color.length - 1);\n var stopEle = document.createElementNS(xmlns, 'stop');\n stopEle.setAttribute('offset', b * offsetColor + '%');\n stopEle.setAttribute('stop-color', colorMap.color[b]);\n stopEle.setAttribute('stop-opacity', opacity.toString());\n linerGradientEle.appendChild(stopEle);\n }\n this.legendLinearGradient = linerGradientEle;\n var color = 'url(' + '#linear_' + legendIndex + ')';\n this.defsElement.appendChild(linerGradientEle);\n legendFillColor = color;\n }\n return legendFillColor;\n };\n /**\n * Get module name.\n */\n Legend.prototype.getModuleName = function () {\n return 'Legend';\n };\n /**\n * To destroy the legend.\n * @return {void}\n * @private\n */\n Legend.prototype.destroy = function (maps) {\n /**\n * Destroy method performed here\n */\n this.removeEventListener();\n };\n return Legend;\n}());\nexport { Legend };\n","import { itemHighlight } from '../index';\nimport { Browser, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { getElementsByClassName, getElement, removeClass, createStyle, customizeStyle, getTargetElement } from '../utils/helper';\n/**\n * Highlight module class\n */\n/* tslint:disable:no-string-literal */\nvar Highlight = /** @class */ (function () {\n function Highlight(maps) {\n this.maps = maps;\n this.addEventListener();\n }\n /**\n * To bind events for highlight module\n */\n Highlight.prototype.addEventListener = function () {\n if (this.maps.isDestroyed) {\n return;\n }\n this.maps.on(Browser.touchMoveEvent, this.mouseMove, this);\n this.maps.on(Browser.touchStartEvent, this.mouseMove, this);\n };\n /**\n * To unbind events for highlight module\n */\n Highlight.prototype.removeEventListener = function () {\n if (this.maps.isDestroyed) {\n return;\n }\n this.maps.off(Browser.touchMoveEvent, this.mouseMove);\n this.maps.off(Browser.touchStartEvent, this.mouseMove);\n };\n /**\n * Public method for highlight module\n */\n Highlight.prototype.addHighlight = function (layerIndex, name, enable) {\n var targetEle = getTargetElement(layerIndex, name, enable, this.maps);\n if (enable) {\n this.mapHighlight(targetEle, null, null);\n }\n else {\n removeClass(targetEle);\n }\n };\n Highlight.prototype.mouseMove = function (e) {\n var targetEle = e.target;\n var layerIndex;\n var isTouch = e.pointerType === 'touch' || e.pointerType === '2' || (e.type.indexOf('touch') > -1);\n if ((targetEle.id.indexOf('LayerIndex') !== -1 || targetEle.id.indexOf('NavigationIndex') > -1) &&\n targetEle.getAttribute('class') !== 'ShapeselectionMapStyle' && !isTouch) {\n layerIndex = parseInt(targetEle.id.split('_LayerIndex_')[1].split('_')[0], 10);\n var shapeData = void 0;\n var data = void 0;\n var shapeIn = void 0;\n var dataIndex = void 0;\n if (targetEle.id.indexOf('shapeIndex') > -1) {\n shapeIn = parseInt(targetEle.id.split('_shapeIndex_')[1].split('_')[0], 10);\n shapeData = this.maps.layers[layerIndex].shapeData['features'] ?\n this.maps.layers[layerIndex].shapeData['features'][shapeIn]['properties'] : null;\n dataIndex = parseInt(targetEle.id.split('_dataIndex_')[1].split('_')[0], 10);\n data = isNullOrUndefined(dataIndex) ? null : this.maps.layers[layerIndex].dataSource[dataIndex];\n this.highlightSettings = this.maps.layers[layerIndex].highlightSettings;\n }\n else if (targetEle.id.indexOf('BubbleIndex') > -1) {\n var bubble = parseInt(targetEle.id.split('_BubbleIndex_')[1].split('_')[0], 10);\n dataIndex = parseInt(targetEle.id.split('_dataIndex_')[1].split('_')[0], 10);\n data = this.maps.layers[layerIndex].bubbleSettings[bubble].dataSource[dataIndex];\n this.highlightSettings = this.maps.layers[layerIndex].bubbleSettings[bubble].highlightSettings;\n }\n else if (targetEle.id.indexOf('MarkerIndex') > -1) {\n var marker = parseInt(targetEle.id.split('_MarkerIndex_')[1].split('_')[0], 10);\n dataIndex = parseInt(targetEle.id.split('_dataIndex_')[1].split('_')[0], 10);\n data = this.maps.layers[layerIndex].markerSettings[marker].dataSource[dataIndex];\n this.highlightSettings = this.maps.layers[layerIndex].markerSettings[marker].highlightSettings;\n }\n else {\n var index = parseInt(targetEle.id.split('_NavigationIndex_')[1].split('_')[0], 10);\n layerIndex = parseInt(targetEle.id.split('_LayerIndex_')[1].split('_')[0], 10);\n shapeData = null;\n data = {\n latitude: this.maps.layers[layerIndex].navigationLineSettings[index].latitude,\n longitude: this.maps.layers[layerIndex].navigationLineSettings[index].longitude\n };\n this.highlightSettings = this.maps.layers[layerIndex].navigationLineSettings[index].highlightSettings;\n }\n if (this.highlightSettings.enable) {\n if (this.maps.legendSettings.visible) {\n this.maps.legendModule.shapeHighLightAndSelection(targetEle, data, this.highlightSettings, 'highlight', layerIndex);\n }\n this.mapHighlight(targetEle, shapeData, data);\n }\n else {\n var element = document.getElementsByClassName('highlightMapStyle')[0];\n if (!isNullOrUndefined(element)) {\n removeClass(element);\n if (element.id.indexOf('NavigationIndex') > -1) {\n var index = parseInt(element.id.split('_NavigationIndex_')[1].split('_')[0], 10);\n var layerIndex_1 = parseInt(element.parentElement.id.split('_LayerIndex_')[1].split('_')[0], 10);\n element.setAttribute('stroke-width', this.maps.layers[layerIndex_1].navigationLineSettings[index].width.toString());\n element.setAttribute('stroke', this.maps.layers[layerIndex_1].navigationLineSettings[index].color);\n }\n }\n }\n }\n else if (getElementsByClassName('highlightMapStyle').length > 0) {\n targetEle = getElementsByClassName('highlightMapStyle')[0];\n if (targetEle.id.indexOf('NavigationIndex') > -1) {\n var index = parseInt(targetEle.id.split('_NavigationIndex_')[1].split('_')[0], 10);\n layerIndex = parseInt(targetEle.parentElement.id.split('_LayerIndex_')[1].split('_')[0], 10);\n targetEle.setAttribute('stroke-width', this.maps.layers[layerIndex].navigationLineSettings[index].width.toString());\n targetEle.setAttribute('stroke', this.maps.layers[layerIndex].navigationLineSettings[index].color);\n }\n removeClass(targetEle);\n if (this.maps.legendSettings.visible) {\n this.maps.legendModule.removeShapeHighlightCollection();\n }\n }\n else if ((targetEle.id.indexOf(this.maps.element.id + '_Legend_Shape_Index') !== -1 ||\n targetEle.id.indexOf(this.maps.element.id + '_Legend_Index') !== -1) &&\n this.maps.legendSettings.visible && targetEle.id.indexOf('_Text') === -1) {\n this.maps.legendModule.legendHighLightAndSelection(targetEle, 'highlight');\n }\n else {\n if (this.maps.legendSettings.visible) {\n this.maps.legendModule.removeLegendHighlightCollection();\n }\n }\n };\n Highlight.prototype.mapHighlight = function (targetEle, shapeData, data) {\n if (this.maps.legendSettings.visible ? (this.maps.legendModule.legendElement !== this.maps.legendModule.oldShapeElement) : true) {\n var eventArgs = {\n opacity: this.highlightSettings.opacity,\n fill: targetEle.id.indexOf('NavigationIndex') === -1 ? this.highlightSettings.fill : 'none',\n border: { color: this.highlightSettings.border.color, width: this.highlightSettings.border.width },\n name: itemHighlight,\n target: targetEle.id,\n cancel: false,\n shapeData: shapeData,\n data: data\n };\n this.maps.trigger(itemHighlight, eventArgs);\n this.highlightMap(targetEle, eventArgs);\n }\n };\n Highlight.prototype.highlightMap = function (targetEle, eventArgs) {\n var parentElement;\n var children;\n if (targetEle.getAttribute('class') === 'highlightMapStyle') {\n return;\n }\n else {\n if (getElementsByClassName('highlightMapStyle').length > 0) {\n var elem = getElementsByClassName('highlightMapStyle')[0];\n removeClass(elem);\n if (elem.id.indexOf('NavigationIndex') > -1) {\n var index = parseInt(elem.id.split('_NavigationIndex_')[1].split('_')[0], 10);\n var layerIndex = parseInt(elem.parentElement.id.split('_LayerIndex_')[1].split('_')[0], 10);\n elem.setAttribute('stroke-width', this.maps.layers[layerIndex].navigationLineSettings[index].width.toString());\n elem.setAttribute('stroke', this.maps.layers[layerIndex].navigationLineSettings[index].color);\n }\n }\n if (!getElement('highlightMap')) {\n document.body.appendChild(createStyle('highlightMap', 'highlightMapStyle', eventArgs));\n }\n else {\n customizeStyle('highlightMap', 'highlightMapStyle', eventArgs);\n }\n targetEle.setAttribute('stroke-width', eventArgs.border.width.toString());\n targetEle.setAttribute('stroke', eventArgs.border.color);\n targetEle.setAttribute('class', 'highlightMapStyle');\n }\n };\n /**\n * Get module name.\n */\n Highlight.prototype.getModuleName = function () {\n return 'Highlight';\n };\n /**\n * To destroy the highlight.\n * @return {void}\n * @private\n */\n Highlight.prototype.destroy = function (maps) {\n /**\n * Destroy method performed here\n */\n this.removeEventListener();\n };\n return Highlight;\n}());\nexport { Highlight };\n","import { click, itemSelection } from '../index';\nimport { getElementsByClassName, getElement, createStyle, customizeStyle, removeClass, getTargetElement } from '../utils/helper';\nimport { isNullOrUndefined, Browser } from '@syncfusion/ej2-base';\n/**\n * Selection module class\n */\nvar Selection = /** @class */ (function () {\n /* tslint:disable:no-string-literal */\n function Selection(maps) {\n this.maps = maps;\n this.addEventListener();\n }\n /**\n * For binding events to selection module\n */\n Selection.prototype.addEventListener = function () {\n if (!this.maps.isDestroyed) {\n this.maps.on(click, this.mouseClick, this);\n this.maps.on(Browser.touchEndEvent, this.mouseClick, this);\n }\n };\n /**\n * For removing events from selection modue\n */\n Selection.prototype.removeEventListener = function () {\n if (this.maps.isDestroyed) {\n return;\n }\n this.maps.off(click, this.mouseClick);\n this.maps.off(Browser.touchEndEvent, this.mouseClick);\n };\n Selection.prototype.mouseClick = function (targetEle) {\n if (!isNullOrUndefined(targetEle['type']) && targetEle['type'].indexOf('touch') !== -1 && isNullOrUndefined(targetEle.id)) {\n targetEle = targetEle['target'];\n }\n if (!isNullOrUndefined(targetEle.id) && (targetEle.id.indexOf('LayerIndex') > -1 || targetEle.id.indexOf('NavigationIndex') > -1)) {\n var layerIndex = void 0;\n var shapeData = void 0;\n var data = void 0;\n var shapeIndex = void 0;\n var dataIndex = void 0;\n layerIndex = parseInt(targetEle.id.split('_LayerIndex_')[1].split('_')[0], 10);\n if (targetEle.id.indexOf('shapeIndex') > -1) {\n shapeIndex = parseInt(targetEle.id.split('_shapeIndex_')[1].split('_')[0], 10);\n shapeData = this.maps.layers[layerIndex].shapeData['features'] ?\n this.maps.layers[layerIndex].shapeData['features'][shapeIndex]['properties'] : null;\n dataIndex = parseInt(targetEle.id.split('_dataIndex_')[1].split('_')[0], 10);\n data = isNullOrUndefined(dataIndex) ? null : this.maps.layers[layerIndex].dataSource[dataIndex];\n this.selectionsettings = this.maps.layers[layerIndex].selectionSettings;\n this.selectionType = 'Shape';\n }\n else if (targetEle.id.indexOf('BubbleIndex') > -1) {\n var bubbleIndex = parseInt(targetEle.id.split('_BubbleIndex_')[1].split('_')[0], 10);\n dataIndex = parseInt(targetEle.id.split('_dataIndex_')[1].split('_')[0], 10);\n data = this.maps.layers[layerIndex].bubbleSettings[bubbleIndex].dataSource[dataIndex];\n this.selectionsettings = this.maps.layers[layerIndex].bubbleSettings[bubbleIndex].selectionSettings;\n this.selectionType = 'Bubble';\n }\n else if (targetEle.id.indexOf('MarkerIndex') > -1) {\n var markerIndex = parseInt(targetEle.id.split('_MarkerIndex_')[1].split('_')[0], 10);\n dataIndex = parseInt(targetEle.id.split('_dataIndex_')[1].split('_')[0], 10);\n data = this.maps.layers[layerIndex].markerSettings[markerIndex].dataSource[dataIndex];\n this.selectionsettings = this.maps.layers[layerIndex].markerSettings[markerIndex].selectionSettings;\n this.selectionType = 'Marker';\n }\n else {\n var index = parseInt(targetEle.id.split('_NavigationIndex_')[1].split('_')[0], 10);\n shapeData = null;\n data = {\n latitude: this.maps.layers[layerIndex].navigationLineSettings[index].latitude,\n longitude: this.maps.layers[layerIndex].navigationLineSettings[index].longitude\n };\n this.selectionsettings = this.maps.layers[layerIndex].navigationLineSettings[index].selectionSettings;\n this.selectionType = 'navigationline';\n }\n if (this.selectionsettings.enable) {\n if (this.maps.legendSettings.visible) {\n this.maps.legendModule.shapeHighLightAndSelection(targetEle, data, this.selectionsettings, 'selection', layerIndex);\n }\n if (this.maps.legendSettings.visible ? this.maps.legendModule.legendSelection : true) {\n this.selectMap(targetEle, shapeData, data);\n }\n }\n }\n else if (!isNullOrUndefined(targetEle.id) && (targetEle.id.indexOf(this.maps.element.id + '_Legend_Shape_Index') > -1 ||\n targetEle.id.indexOf(this.maps.element.id + '_Legend_Index') !== -1) && this.maps.legendSettings.visible &&\n targetEle.id.indexOf('_Text') === -1) {\n this.maps.legendModule.legendHighLightAndSelection(targetEle, 'selection');\n }\n };\n /**\n * Public method for selection\n */\n Selection.prototype.addSelection = function (layerIndex, name, enable) {\n var targetEle = getTargetElement(layerIndex, name, enable, this.maps);\n if (enable) {\n this.selectMap(targetEle, null, null);\n }\n else {\n removeClass(targetEle);\n }\n };\n /**\n * Method for selection\n */\n Selection.prototype.selectMap = function (targetEle, shapeData, data) {\n var parentElement;\n var children;\n var selectionsettings = this.selectionsettings;\n var eventArgs = {\n opacity: this.selectionsettings.opacity,\n fill: this.selectionType !== 'navigationline' ? this.selectionsettings.fill : 'none',\n border: { color: this.selectionsettings.border.color, width: this.selectionsettings.border.width },\n name: itemSelection,\n target: targetEle.id,\n cancel: false,\n shapeData: shapeData,\n data: data\n };\n this.maps.trigger(itemSelection, eventArgs);\n // if (this.maps.legendSettings.visible && !this.maps.legendSettings.toggleVisibility && this.maps.legendSettings.legendSelection) {\n // this.removeLegendSelection(this.maps.legendModule.legendCollection, targetEle);\n // }\n if (targetEle.getAttribute('class') === this.selectionType + 'selectionMapStyle') {\n removeClass(targetEle);\n if (targetEle.id.indexOf('NavigationIndex') > -1) {\n var index = parseInt(targetEle.id.split('_NavigationIndex_')[1].split('_')[0], 10);\n var layerIndex = parseInt(targetEle.parentElement.id.split('_LayerIndex_')[1].split('_')[0], 10);\n targetEle.setAttribute('stroke-width', this.maps.layers[layerIndex].navigationLineSettings[index].width.toString());\n targetEle.setAttribute('stroke', this.maps.layers[layerIndex].navigationLineSettings[index].color);\n }\n }\n else {\n if (!this.selectionsettings.enableMultiSelect && getElementsByClassName(this.selectionType + 'selectionMapStyle').length > 0) {\n var ele = getElementsByClassName(this.selectionType + 'selectionMapStyle')[0];\n removeClass(ele);\n if (ele.id.indexOf('NavigationIndex') > -1) {\n var index = parseInt(targetEle.id.split('_NavigationIndex_')[1].split('_')[0], 10);\n var layerIndex = parseInt(targetEle.parentElement.id.split('_LayerIndex_')[1].split('_')[0], 10);\n ele.setAttribute('stroke-width', this.maps.layers[layerIndex].navigationLineSettings[index].width.toString());\n ele.setAttribute('stroke', this.maps.layers[layerIndex].navigationLineSettings[index].color);\n }\n }\n if (!getElement(this.selectionType + 'selectionMap')) {\n document.body.appendChild(createStyle(this.selectionType + 'selectionMap', this.selectionType + 'selectionMapStyle', eventArgs));\n }\n else {\n customizeStyle(this.selectionType + 'selectionMap', this.selectionType + 'selectionMapStyle', eventArgs);\n }\n targetEle.setAttribute('stroke-width', eventArgs.border.width.toString());\n targetEle.setAttribute('stroke', eventArgs.border.color);\n targetEle.setAttribute('class', this.selectionType + 'selectionMapStyle');\n }\n };\n /**\n * Remove legend selection\n */\n // private removeLegendSelection(legendCollection: Object[], targetEle: Element): void {\n // let shape: Element;\n // if (!this.selectionsettings.enableMultiSelect) {\n // for (let i: number = 0; i < legendCollection.length; i++) {\n // for (let data of legendCollection[i]['data']) {\n // shape = getElement(this.maps.element.id + '_LayerIndex_' + data['layerIndex'] +\n // '_shapeIndex_' + data['shapeIndex'] + '_dataIndex_' + data['dataIndex']);\n // removeClass(shape);\n // }\n // }\n // }\n // }\n /**\n * Get module name.\n */\n Selection.prototype.getModuleName = function () {\n return 'Selection';\n };\n /**\n * To destroy the selection.\n * @return {void}\n * @private\n */\n Selection.prototype.destroy = function (maps) {\n /**\n * Destroy method performed here\n */\n this.removeEventListener();\n };\n return Selection;\n}());\nexport { Selection };\n","import { tooltipRender } from '../index';\nimport { Tooltip } from '@syncfusion/ej2-svg-base';\nimport { createElement, Browser, isNullOrUndefined, extend } from '@syncfusion/ej2-base';\nimport { checkShapeDataFields, getMousePosition, Internalize, checkPropertyPath } from '../utils/helper';\n/**\n * Map Tooltip\n */\nvar MapsTooltip = /** @class */ (function () {\n function MapsTooltip(maps) {\n this.maps = maps;\n this.tooltipId = this.maps.element.id + '_mapsTooltip';\n this.addEventListener();\n }\n /* tslint:disable:no-string-literal */\n //tslint:disable:max-func-body-length\n MapsTooltip.prototype.renderTooltip = function (e) {\n var pageX;\n var pageY;\n var target;\n var touchArg;\n var tootipArgs;\n if (e.type.indexOf('touch') !== -1) {\n this.isTouch = true;\n touchArg = e;\n pageX = touchArg.changedTouches[0].pageX;\n pageY = touchArg.changedTouches[0].pageY;\n target = touchArg.target;\n }\n else {\n this.isTouch = e.pointerType === 'touch';\n pageX = e.pageX;\n pageY = e.pageY;\n target = e.target;\n }\n var formatFunction;\n var value;\n var option;\n var currentData = '';\n var targetId = target.id;\n var item = {};\n var tooltipEle;\n var location;\n var toolTipData = {};\n var templateData = [];\n var index = targetId.indexOf('_LayerIndex_') > -1 && parseFloat(targetId.split('_LayerIndex_')[1].split('_')[0]);\n var layer = this.maps.layersCollection[index];\n var tooltipContent = [];\n var markerFill;\n location = getMousePosition(pageX, pageY, this.maps.svgObject);\n var istooltipRender = (targetId.indexOf('_shapeIndex_') > -1)\n || (targetId.indexOf('_MarkerIndex_') > -1) || (targetId.indexOf('_BubbleIndex_') > -1);\n if (istooltipRender) {\n if (targetId.indexOf('_shapeIndex_') > -1) {\n option = layer.tooltipSettings;\n option.textStyle.fontFamily = this.maps.themeStyle.fontFamily || option.textStyle.fontFamily;\n option.textStyle.opacity = this.maps.themeStyle.tooltipTextOpacity || option.textStyle.opacity;\n var shape = parseInt(targetId.split('_shapeIndex_')[1].split('_')[0], 10);\n if (isNullOrUndefined(layer.layerData) || isNullOrUndefined(layer.layerData[shape])) {\n return;\n }\n var value_1 = layer.layerData[shape]['property'];\n index = checkShapeDataFields(layer.dataSource, value_1, layer.shapeDataPath, layer.shapePropertyPath);\n templateData = layer.dataSource[index];\n if (option.visible && ((!isNullOrUndefined(index) && !isNaN(index)) || (!isNullOrUndefined(value_1)))) {\n if (layer.tooltipSettings.format) {\n currentData = this.formatter(layer.tooltipSettings.format, layer.dataSource[index]);\n }\n else {\n var shapePath = checkPropertyPath(layer.shapeDataPath, layer.shapePropertyPath, value_1);\n currentData = ((!isNullOrUndefined(layer.dataSource)) && ((!isNullOrUndefined(index)))) ?\n this.formatValue(layer.dataSource[index][option.valuePath], this.maps) : value_1[shapePath];\n if (isNullOrUndefined(currentData)) {\n currentData = value_1[option.valuePath];\n }\n }\n }\n //location.y = this.template(option, location);\n }\n else if (targetId.indexOf('_MarkerIndex_') > -1) {\n var markerIdex = parseInt(targetId.split('_MarkerIndex_')[1].split('_')[0], 10);\n var dataIndex = parseInt(targetId.split('_MarkerIndex_')[1].split('_')[2], 10);\n var marker = layer.markerSettings[markerIdex];\n option = marker.tooltipSettings;\n templateData = marker.dataSource[dataIndex];\n if (option.visible && !isNaN(markerIdex)) {\n if (marker.tooltipSettings.format) {\n currentData = this.formatter(marker.tooltipSettings.format, marker.dataSource[dataIndex]);\n }\n else {\n currentData = this.formatValue(marker.dataSource[dataIndex][marker.tooltipSettings.valuePath], this.maps);\n }\n }\n //location.y = this.template(option, location);\n }\n else if (targetId.indexOf('_BubbleIndex_') > -1) {\n var bubbleIndex = parseInt(targetId.split('_BubbleIndex_')[1].split('_')[0], 10);\n var dataIndex = parseInt(targetId.split('_BubbleIndex_')[1].split('_')[2], 10);\n var bubble = layer.bubbleSettings[bubbleIndex];\n option = bubble.tooltipSettings;\n templateData = bubble.dataSource[dataIndex];\n if (option.visible && !isNaN(dataIndex)) {\n if (bubble.tooltipSettings.format) {\n currentData = this.formatter(bubble.tooltipSettings.format, bubble.dataSource[dataIndex]);\n }\n else {\n currentData = this.formatValue(bubble.dataSource[dataIndex][bubble.tooltipSettings.valuePath], this.maps);\n }\n }\n //location.y = this.template(option, location);\n }\n if (document.getElementById(this.tooltipId)) {\n tooltipEle = document.getElementById(this.tooltipId);\n }\n else {\n tooltipEle = createElement('div', {\n id: this.maps.element.id + '_mapsTooltip',\n className: 'EJ2-maps-Tooltip',\n styles: 'position: absolute;pointer-events:none;'\n });\n document.getElementById(this.maps.element.id + '_Secondary_Element').appendChild(tooltipEle);\n }\n var content = void 0;\n if (option.template !== null && Object.keys(option.template).length === 1) {\n option.template = option.template[Object.keys(option.template)[0]];\n }\n templateData = this.setTooltipContent(option, templateData);\n tootipArgs = {\n cancel: false, name: tooltipRender,\n options: {\n location: location, text: tooltipContent, data: templateData,\n textStyle: option.textStyle,\n template: option.template\n },\n fill: option.fill,\n maps: this.maps,\n element: target, eventArgs: e\n };\n this.maps.trigger(tooltipRender, tootipArgs);\n if (!tootipArgs.cancel && option.visible && !isNullOrUndefined(currentData)) {\n tootipArgs.options['textStyle']['color'] = this.maps.themeStyle.tooltipFontColor\n || tootipArgs.options['textStyle']['color'];\n this.svgTooltip = new Tooltip({\n enable: true,\n header: '',\n data: tootipArgs.options['data'],\n template: tootipArgs.options['template'],\n content: [currentData.toString()],\n shapes: [],\n location: tootipArgs.options['location'],\n palette: [markerFill],\n areaBounds: this.maps.mapAreaRect,\n textStyle: tootipArgs.options['textStyle'],\n fill: tootipArgs.fill || this.maps.themeStyle.tooltipFillColor\n });\n this.svgTooltip.opacity = this.maps.themeStyle.tooltipFillOpacity || this.svgTooltip.opacity;\n this.svgTooltip.appendTo(tooltipEle);\n }\n else {\n this.removeTooltip();\n }\n }\n else {\n this.removeTooltip();\n }\n };\n /**\n * To get content for the current toolitp\n */\n MapsTooltip.prototype.setTooltipContent = function (options, templateData) {\n var localData = extend({}, templateData, null, true);\n if (this.maps.format && !isNaN(Number(localData[options.valuePath]))) {\n localData[options.valuePath] = Internalize(this.maps, Number(localData[options.valuePath]));\n }\n else {\n localData = Object.keys(localData).length ? localData : undefined;\n }\n return localData;\n };\n MapsTooltip.prototype.formatValue = function (value, maps) {\n var formatValue;\n var formatFunction;\n if (maps.format && !isNaN(Number(value))) {\n formatFunction = maps.intl.getNumberFormat({ format: maps.format, useGrouping: maps.useGroupingSeparator });\n formatValue = formatFunction(Number(value));\n }\n else {\n formatValue = value;\n }\n return formatValue;\n };\n /*private template(tooltip: TooltipSettingsModel, location: MapLocation): number {\n location.y = (tooltip.template) ? location.y + 10 : location.y;\n return location.y;\n }*/\n MapsTooltip.prototype.formatter = function (format, data) {\n if (data === void 0) { data = {}; }\n var keys = Object.keys(data);\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var key = keys_1[_i];\n format = format.split('${' + key + '}').join(this.formatValue(data[key], this.maps));\n }\n return format;\n };\n MapsTooltip.prototype.mouseUpHandler = function (e) {\n this.renderTooltip(e);\n clearTimeout(this.clearTimeout);\n this.clearTimeout = setTimeout(this.removeTooltip.bind(this), 2000);\n };\n MapsTooltip.prototype.removeTooltip = function () {\n if (document.getElementsByClassName('EJ2-maps-Tooltip').length > 0) {\n document.getElementsByClassName('EJ2-maps-Tooltip')[0].remove();\n }\n };\n /**\n * To bind events for tooltip module\n */\n MapsTooltip.prototype.addEventListener = function () {\n if (this.maps.isDestroyed) {\n return;\n }\n this.maps.on(Browser.touchMoveEvent, this.renderTooltip, this);\n this.maps.on(Browser.touchEndEvent, this.mouseUpHandler, this);\n this.maps.on(Browser.touchCancelEvent, this.removeTooltip, this);\n };\n MapsTooltip.prototype.removeEventListener = function () {\n if (this.maps.isDestroyed) {\n return;\n }\n this.maps.off(Browser.touchMoveEvent, this.renderTooltip);\n this.maps.off(Browser.touchEndEvent, this.mouseUpHandler);\n this.maps.off(Browser.touchCancelEvent, this.removeTooltip);\n };\n /**\n * Get module name.\n */\n MapsTooltip.prototype.getModuleName = function () {\n return 'MapsTooltip';\n };\n /**\n * To destroy the tooltip.\n * @return {void}\n * @private\n */\n MapsTooltip.prototype.destroy = function (maps) {\n this.removeEventListener();\n };\n return MapsTooltip;\n}());\nexport { MapsTooltip };\n","import { Point, getElementByID, PathOption, Rect, convertGeoToPoint, CircleOption, convertTileLatLongToPoint } from '../utils/helper';\nimport { RectOption, createTooltip, calculateScale, getTouchCenter, getTouches, targetTouches } from '../utils/helper';\nimport { MapLocation, zoomAnimate, smoothTranslate } from '../utils/helper';\nimport { isNullOrUndefined, EventHandler, Browser, remove, createElement } from '@syncfusion/ej2-base';\nimport { changeBorderWidth } from '../index';\nimport { zoomIn, zoomOut, pan } from '../model/constants';\n/**\n * Zoom module used to process the zoom for maps\n */\n/* tslint:disable:max-line-length */\nvar Zoom = /** @class */ (function () {\n function Zoom(maps) {\n this.isPanning = false;\n this.mouseEnter = false;\n this.isTouch = false;\n this.rectZoomingStart = false;\n this.pinchRect = new Rect(0, 0, 0, 0);\n this.browserName = Browser.info.name;\n this.isPointer = Browser.isPointer;\n this.handled = false;\n this.pinchFactor = 1;\n this.startTouches = [];\n this.maps = maps;\n this.wheelEvent = this.browserName === 'mozilla' ? (this.isPointer ? 'mousewheel' : 'DOMMouseScroll') : 'mousewheel';\n this.cancelEvent = this.isPointer ? 'pointerleave' : 'mouseleave';\n this.selectionColor = this.maps.zoomSettings.selectionColor;\n this.fillColor = this.maps.zoomSettings.color;\n this.addEventListener();\n this.groupElements = [];\n }\n /* tslint:disable:no-string-literal */\n /**\n * To perform zooming for maps\n * @param position\n * @param newZoomFactor\n * @param type\n */\n Zoom.prototype.performZooming = function (position, newZoomFactor, type) {\n var map = this.maps;\n var prevLevel = map.tileZoomLevel;\n var scale = map.previousScale = map.scale;\n var maxZoom = map.zoomSettings.maxZoom;\n var minZoom = map.zoomSettings.minZoom;\n var translatePoint = map.previousPoint = map.translatePoint;\n var prevTilePoint = map.tileTranslatePoint;\n if ((!map.isTileMap) && (type === 'ZoomIn' ? newZoomFactor >= minZoom && newZoomFactor <= maxZoom : newZoomFactor >= minZoom)) {\n var availSize = map.mapAreaRect;\n var minBounds = map.baseMapRectBounds['min'];\n var maxBounds = map.baseMapRectBounds['max'];\n var mapTotalWidth = Math.abs(minBounds['x'] - maxBounds['x']);\n var mapTotalHeight = Math.abs(minBounds['y'] - maxBounds['y']);\n var point = map.translatePoint;\n var translatePointX = point.x - (((availSize.width / scale) - (availSize.width / newZoomFactor)) / (availSize.width / position.x));\n var translatePointY = point.y - (((availSize.height / scale) - (availSize.height / newZoomFactor)) / (availSize.height / position.y));\n var currentHeight = Math.abs(map.baseMapRectBounds['max']['y'] - map.baseMapRectBounds['min']['y']) * newZoomFactor;\n translatePointX = (currentHeight < map.mapAreaRect.height) ? (availSize.x + ((-(minBounds['x'])) + ((availSize.width / 2) - (mapTotalWidth / 2)))) : translatePointX;\n translatePointY = (currentHeight < map.mapAreaRect.height) ? (availSize.y + ((-(minBounds['y'])) + ((availSize.height / 2) - (mapTotalHeight / 2)))) : translatePointY;\n map.translatePoint = new Point(translatePointX, translatePointY);\n map.scale = newZoomFactor;\n this.triggerZoomEvent(prevTilePoint, prevLevel);\n }\n else if ((map.isTileMap) && (newZoomFactor >= minZoom && newZoomFactor <= maxZoom)) {\n this.getTileTranslatePosition(prevLevel, newZoomFactor, position);\n map.tileZoomLevel = newZoomFactor;\n map.scale = Math.pow(2, newZoomFactor - 1);\n map.translatePoint.x = (map.tileTranslatePoint.x - (0.01 * map.scale)) / map.scale;\n map.translatePoint.y = (map.tileTranslatePoint.y - (0.01 * map.scale)) / map.scale;\n this.triggerZoomEvent(prevTilePoint, prevLevel);\n map.mapLayerPanel.generateTiles(newZoomFactor, map.tileTranslatePoint);\n }\n this.applyTransform();\n };\n Zoom.prototype.triggerZoomEvent = function (prevTilePoint, prevLevel) {\n var map = this.maps;\n var zoomArgs;\n if (!map.isTileMap) {\n zoomArgs = {\n cancel: false, name: 'zoom', type: map.scale > map.previousScale ? zoomIn : zoomOut, maps: map,\n tileTranslatePoint: {}, translatePoint: { previous: map.previousPoint, current: map.translatePoint },\n tileZoomLevel: {}, scale: { previous: map.previousScale, current: map.scale }\n };\n }\n else {\n zoomArgs = {\n cancel: false, name: 'zoom', type: map.tileZoomLevel > prevLevel ? zoomIn : zoomOut, maps: map,\n tileTranslatePoint: { previous: prevTilePoint, current: map.tileTranslatePoint }, translatePoint: { previous: map.previousPoint, current: map.translatePoint },\n tileZoomLevel: { previous: prevLevel, current: map.tileZoomLevel }, scale: { previous: map.previousScale, current: map.scale }\n };\n }\n map.trigger('zoom', zoomArgs);\n };\n Zoom.prototype.getTileTranslatePosition = function (prevLevel, currentLevel, position) {\n var map = this.maps;\n var tileDefaultSize = 256;\n var bounds = getElementByID(this.maps.element.id).getBoundingClientRect();\n var prevSize = Math.pow(2, prevLevel) * 256;\n var totalSize = Math.pow(2, currentLevel) * 256;\n var x = ((position.x - map.tileTranslatePoint.x) / prevSize) * 100;\n var y = ((position.y - map.tileTranslatePoint.y) / prevSize) * 100;\n map.tileTranslatePoint.x = (currentLevel === 1) ? (bounds.width / 2) - ((tileDefaultSize * 2) / 2) :\n position.x - ((x * totalSize) / 100);\n map.tileTranslatePoint.y = (currentLevel === 1) ? (bounds.height / 2) - ((tileDefaultSize * 2) / 2) :\n position.y - ((y * totalSize) / 100);\n };\n Zoom.prototype.performRectZooming = function () {\n var map = this.maps;\n var size = map.availableSize;\n var prevLevel = map.tileZoomLevel;\n var zoomRect = this.zoomingRect;\n if (zoomRect.height > 0 && zoomRect.width > 0) {\n var x = this.zoomingRect.x + (this.zoomingRect.width / 2);\n var y = this.zoomingRect.y + (this.zoomingRect.height / 2);\n var zoomCalculationFactor = void 0;\n if (!map.isTileMap) {\n var scale = map.previousScale = map.scale;\n zoomCalculationFactor = scale + Math.round((((size.width / zoomRect.width) + (size.height / zoomRect.height)) / 2));\n var translatePoint = map.previousPoint = map.translatePoint;\n var translatePointX = translatePoint.x - (((size.width / scale) - (size.width / zoomCalculationFactor)) / (size.width / x));\n var translatePointY = translatePoint.y - (((size.height / scale) - (size.height / zoomCalculationFactor)) / (size.height / y));\n map.translatePoint = new Point(translatePointX, translatePointY);\n map.scale = zoomCalculationFactor;\n }\n else {\n zoomCalculationFactor = prevLevel + (Math.round(prevLevel + (((size.width / zoomRect.width) + (size.height / zoomRect.height)) / 2)));\n this.getTileTranslatePosition(prevLevel, zoomCalculationFactor, { x: x, y: y });\n map.tileZoomLevel = zoomCalculationFactor;\n map.mapLayerPanel.generateTiles(zoomCalculationFactor, map.tileTranslatePoint);\n map.translatePoint.x = (map.tileTranslatePoint.x - (0.5 * Math.pow(2, zoomCalculationFactor))) /\n (Math.pow(2, zoomCalculationFactor));\n map.translatePoint.y = (map.tileTranslatePoint.y - (0.5 * Math.pow(2, zoomCalculationFactor))) /\n (Math.pow(2, zoomCalculationFactor));\n map.scale = (Math.pow(2, zoomCalculationFactor));\n }\n this.applyTransform(true);\n this.zoomingRect = null;\n }\n };\n Zoom.prototype.setInteraction = function (newInteraction) {\n this.lastScale = 1;\n this.interaction = newInteraction;\n };\n Zoom.prototype.updateInteraction = function () {\n if (this.fingers === 2) {\n this.setInteraction('zoom');\n }\n else {\n this.setInteraction(null);\n }\n };\n Zoom.prototype.performPinchZooming = function (e) {\n var map = this.maps;\n var prevLevel = map.tileZoomLevel;\n var availSize = map.mapAreaRect;\n map.previousScale = map.scale;\n map.previousPoint = map.translatePoint;\n var prevTilePoint = map.tileTranslatePoint;\n var scale = calculateScale(this.touchStartList, this.touchMoveList);\n var touchCenter = getTouchCenter(getTouches(this.touchMoveList, this.maps));\n var newScale = scale / this.lastScale;\n this.lastScale = scale;\n this.pinchFactor *= newScale;\n this.pinchFactor = Math.min(this.maps.zoomSettings.maxZoom, Math.max(this.pinchFactor, this.maps.zoomSettings.minZoom));\n var zoomCalculationFactor = this.pinchFactor;\n var zoomArgs;\n if (!map.isTileMap) {\n var minBounds = map.baseMapRectBounds['min'];\n var maxBounds = map.baseMapRectBounds['max'];\n var mapTotalWidth = Math.abs(minBounds['x'] - maxBounds['x']);\n var mapTotalHeight = Math.abs(minBounds['y'] - maxBounds['y']);\n var translatePoint = map.translatePoint;\n var currentHeight = Math.abs(map.baseMapRectBounds['max']['y'] - map.baseMapRectBounds['min']['y']) * zoomCalculationFactor;\n var translatePointX = translatePoint.x - (((availSize.width / map.scale) - (availSize.width / zoomCalculationFactor)) / (availSize.width / touchCenter.x));\n var translatePointY = translatePoint.y - (((availSize.height / map.scale) - (availSize.height / zoomCalculationFactor)) / (availSize.height / touchCenter.y));\n translatePointX = (currentHeight < map.mapAreaRect.height) ? (availSize.x + ((-(minBounds['x'])) + ((availSize.width / 2) - (mapTotalWidth / 2)))) : translatePointX;\n translatePointY = (currentHeight < map.mapAreaRect.height) ? (availSize.y + ((-(minBounds['y'])) + ((availSize.height / 2) - (mapTotalHeight / 2)))) : translatePointY;\n map.translatePoint = new Point(translatePointX, translatePointY);\n map.scale = zoomCalculationFactor;\n this.triggerZoomEvent(prevTilePoint, prevLevel);\n }\n else {\n var newTileFactor = zoomCalculationFactor;\n this.getTileTranslatePosition(prevLevel, newTileFactor, { x: touchCenter.x, y: touchCenter.y });\n map.tileZoomLevel = newTileFactor;\n map.translatePoint.x = (map.tileTranslatePoint.x - (0.5 * Math.pow(2, newTileFactor))) /\n (Math.pow(2, newTileFactor));\n map.translatePoint.y = (map.tileTranslatePoint.y - (0.5 * Math.pow(2, newTileFactor))) /\n (Math.pow(2, newTileFactor));\n map.scale = (Math.pow(2, newTileFactor));\n this.triggerZoomEvent(prevTilePoint, prevLevel);\n map.mapLayerPanel.generateTiles(newTileFactor, map.tileTranslatePoint);\n }\n this.applyTransform();\n };\n Zoom.prototype.drawZoomRectangle = function () {\n var map = this.maps;\n var down = this.mouseDownPoints;\n var move = this.mouseMovePoints;\n var x;\n var y;\n var width;\n var height;\n var border = { width: 1, color: '#009900' };\n width = Math.abs(move.x - down.x);\n height = Math.abs(move.y - down.y);\n x = ((move.x > down.x) ? down.x : down.x - width);\n y = ((move.y > down.y) ? down.y : down.y - height);\n var elementRect = getElementByID(map.element.id).getBoundingClientRect();\n if ((x > map.mapAreaRect.x && x < (map.mapAreaRect.x + map.mapAreaRect.width)) &&\n (y > map.mapAreaRect.y) && (y < map.mapAreaRect.y + map.mapAreaRect.height)) {\n this.zoomingRect = new Rect(x, y, width, height);\n var rectSVGObject = map.renderer.createSvg({\n id: map.element.id + '_Selection_Rect_Zooming',\n width: map.availableSize.width,\n height: map.availableSize.height,\n });\n var rectOption = new RectOption(map.element.id + '_ZoomRect', '#d3d3d3', border, 0.5, this.zoomingRect, 0, 0, '', '3');\n rectSVGObject.appendChild(map.renderer.drawRectangle(rectOption));\n getElementByID(map.element.id + '_Secondary_Element').appendChild(rectSVGObject);\n }\n };\n /**\n * To animate the zooming process\n */\n Zoom.prototype.animateTransform = function (element, animate, x, y, scale) {\n var duration = this.currentLayer.animationDuration;\n if (!animate || duration === 0) {\n element.setAttribute('transform', 'scale(' + (scale) + ') translate( ' + x + ' ' + y + ' )');\n return;\n }\n zoomAnimate(element, 0, duration, new MapLocation(x, y), scale, this.maps.mapAreaRect, this.maps);\n };\n Zoom.prototype.applyTransform = function (animate) {\n var layerIndex;\n this.templateCount = 0;\n var scale = this.maps.scale;\n var x = this.maps.translatePoint.x;\n var y = this.maps.translatePoint.y;\n var collection = [];\n if (this.layerCollectionEle) {\n for (var i = 0; i < this.layerCollectionEle.childElementCount; i++) {\n var layerElement = this.layerCollectionEle.childNodes[i];\n if (layerElement.tagName === 'g') {\n this.templateCount++;\n var index = layerElement.id.indexOf('_LayerIndex_') > -1 && parseFloat(layerElement.id.split('_LayerIndex_')[1].split('_')[0]);\n this.currentLayer = this.maps.layersCollection[index];\n var factor = this.maps.mapLayerPanel.calculateFactor(this.currentLayer);\n for (var j = 0; j < layerElement.childElementCount; j++) {\n var currentEle = layerElement.childNodes[j];\n if (!(currentEle.id.indexOf('_Markers_Group') > -1) && (!(currentEle.id.indexOf('_bubble_Group') > -1))\n && (!(currentEle.id.indexOf('_dataLableIndex_Group') > -1))) {\n if (this.maps.isTileMap && (currentEle.id.indexOf('_line_Group') > -1)) {\n currentEle.remove();\n if (layerElement.children.length > 0 && layerElement.children[0]) {\n layerElement.insertBefore(this.maps.navigationLineModule.renderNavigation(this.currentLayer, this.maps.tileZoomLevel, index), layerElement.children[0]);\n }\n else {\n layerElement.appendChild(this.maps.navigationLineModule.renderNavigation(this.currentLayer, this.maps.tileZoomLevel, index));\n }\n }\n else {\n changeBorderWidth(currentEle, index, scale, this.maps);\n this.animateTransform(currentEle, animate, x, y, scale);\n }\n }\n else if (currentEle.id.indexOf('_Markers_Group') > -1) {\n for (var k = 0; k < currentEle.childElementCount; k++) {\n this.markerTranslate(currentEle.childNodes[k], factor, x, y, scale, 'Marker', animate);\n }\n }\n else if (currentEle.id.indexOf('_bubble_Group') > -1) {\n var childElement = void 0;\n for (var k = 0; k < currentEle.childElementCount; k++) {\n childElement = currentEle.childNodes[k];\n var bubbleTransform = childElement.getAttribute('transform');\n layerIndex = parseFloat(childElement.id.split('_LayerIndex_')[1].split('_')[0]);\n var bubleIndex = parseFloat(childElement.id.split('_BubbleIndex_')[1].split('_')[0]);\n var dataIndex = parseFloat(childElement.id.split('_BubbleIndex_')[1].split('_')[2]);\n for (var l = 0; l < this.maps.bubbleModule.bubbleCollection.length; l++) {\n var bubbleCollection = this.maps.bubbleModule.bubbleCollection[l];\n if (bubbleCollection['LayerIndex'] === layerIndex && bubbleCollection['BubbleIndex'] === bubleIndex &&\n bubbleCollection['DataIndex'] === dataIndex) {\n var centerX = bubbleCollection['center']['x'];\n var centerY = bubbleCollection['center']['y'];\n var currentX = ((centerX + x) * scale);\n var currentY = ((centerY + y) * scale);\n var duration = this.currentLayer.animationDuration;\n if (!animate || duration === 0) {\n childElement.setAttribute('transform', 'translate( ' + currentX + ' ' + currentY + ' )');\n }\n else {\n smoothTranslate(childElement, 0, duration, new MapLocation(currentX, currentY));\n }\n break;\n }\n }\n }\n }\n else if (currentEle.id.indexOf('_dataLableIndex_Group') > -1) {\n for (var k = 0; k < currentEle.childElementCount; k++) {\n this.dataLabelTranslate(currentEle.childNodes[k], factor, x, y, scale, 'DataLabel', animate);\n }\n }\n }\n }\n }\n if (!animate || this.currentLayer.animationDuration === 0) {\n this.processTemplate(x, y, scale, this.maps);\n }\n }\n };\n /**\n * To translate the layer template elements\n * @private\n */\n Zoom.prototype.processTemplate = function (x, y, scale, maps) {\n for (var i = 0; i < this.templateCount; i++) {\n this.currentLayer = maps.layersCollection[i];\n var factor = maps.mapLayerPanel.calculateFactor(this.currentLayer);\n var markerTemplateElement = getElementByID(maps.element.id + '_LayerIndex_' +\n i + '_Markers_Template_Group');\n var datalabelTemplateElemement = getElementByID(maps.element.id + '_LayerIndex_'\n + i + '_Label_Template_Group');\n if ((!isNullOrUndefined(markerTemplateElement)) && markerTemplateElement.childElementCount > 0) {\n for (var k = 0; k < markerTemplateElement.childElementCount; k++) {\n this.markerTranslate(markerTemplateElement.childNodes[k], factor, x, y, scale, 'Template');\n }\n }\n if ((!isNullOrUndefined(datalabelTemplateElemement)) && datalabelTemplateElemement.childElementCount > 0) {\n for (var k = 0; k < datalabelTemplateElemement.childElementCount; k++) {\n this.dataLabelTranslate(datalabelTemplateElemement.childNodes[k], factor, x, y, scale, 'Template');\n }\n }\n }\n };\n Zoom.prototype.dataLabelTranslate = function (element, factor, x, y, scale, type, animate) {\n if (animate === void 0) { animate = false; }\n var labelCollection = this.maps.dataLabelModule.dataLabelCollections;\n var layerIndex = parseFloat(element.id.split('_LayerIndex_')[1].split('_')[0]);\n var shapeIndex = parseFloat(element.id.split('_shapeIndex_')[1].split('_')[0]);\n var labelIndex = parseFloat(element.id.split('_LabelIndex_')[1].split('_')[0]);\n var duration = this.currentLayer.animationDuration;\n for (var l = 0; l < labelCollection.length; l++) {\n var label = labelCollection[l];\n if (label['layerIndex'] === layerIndex && label['shapeIndex'] === shapeIndex\n && label['labelIndex'] === labelIndex) {\n var labelX = label['location']['x'];\n var labelY = label['location']['y'];\n if (type === 'Template') {\n var layerEle = getElementByID(this.maps.element.id + '_Layer_Collections');\n labelX = ((Math.abs(this.maps.baseMapRectBounds['min']['x'] - labelX)) * scale);\n labelY = ((Math.abs(this.maps.baseMapRectBounds['min']['y'] - labelY)) * scale);\n var templateOffset = element.getBoundingClientRect();\n var layerOffset = layerEle.getBoundingClientRect();\n var elementOffset = element.parentElement.getBoundingClientRect();\n var x_1 = ((labelX) + (layerOffset.left - elementOffset.left) - (templateOffset.width / 2));\n var y_1 = ((labelY) + (layerOffset.top - elementOffset.top) - (templateOffset.height / 2));\n element.style.left = x_1 + 'px';\n element.style.top = y_1 + 'px';\n }\n else {\n labelX = ((labelX + x) * scale);\n labelY = ((labelY + y) * scale);\n if (!animate || duration === 0) {\n element.setAttribute('transform', 'translate( ' + labelX + ' ' + labelY + ' )');\n }\n else {\n smoothTranslate(element, 0, duration, new MapLocation(labelX, labelY));\n }\n }\n }\n }\n };\n Zoom.prototype.markerTranslate = function (element, factor, x, y, scale, type, animate) {\n if (animate === void 0) { animate = false; }\n var layerIndex = parseInt(element.id.split('_LayerIndex_')[1].split('_')[0], 10);\n var markerIndex = parseInt(element.id.split('_MarkerIndex_')[1].split('_')[0], 10);\n var dataIndex = parseInt(element.id.split('_dataIndex_')[1].split('_')[0], 10);\n var layer = this.maps.layersCollection[layerIndex];\n var marker = layer.markerSettings[markerIndex];\n if (!isNullOrUndefined(marker) && !isNullOrUndefined(marker.dataSource) && !isNullOrUndefined(marker.dataSource[dataIndex])) {\n var lng = marker.dataSource[dataIndex]['longitude'];\n var lat = marker.dataSource[dataIndex]['latitude'];\n var duration = this.currentLayer.animationDuration;\n var location_1 = (this.maps.isTileMap) ? convertTileLatLongToPoint(new Point(lng, lat), this.maps.tileZoomLevel, this.maps.tileTranslatePoint, true) : convertGeoToPoint(lat, lng, factor, layer, this.maps);\n if (this.maps.isTileMap) {\n if (type === 'Template') {\n var templateOffset = element.getBoundingClientRect();\n element.style.left = (location_1.x - (templateOffset.width / 2)) + 'px';\n element.style.top = (location_1.y - (templateOffset.height / 2)) + 'px';\n }\n else {\n element.setAttribute('transform', 'translate( ' + location_1.x + ' ' + location_1.y + ' )');\n }\n }\n else {\n if (type === 'Template') {\n location_1.x = ((Math.abs(this.maps.baseMapRectBounds['min']['x'] - location_1.x)) * scale);\n location_1.y = ((Math.abs(this.maps.baseMapRectBounds['min']['y'] - location_1.y)) * scale);\n var templateOffset = element.getBoundingClientRect();\n var layerOffset = getElementByID(this.maps.element.id + '_Layer_Collections').getBoundingClientRect();\n var elementOffset = element.parentElement.getBoundingClientRect();\n element.style.left = (((location_1.x) + (layerOffset.left - elementOffset.left) -\n (templateOffset.width / 2)) + marker.offset.x) + 'px';\n element.style.top = (((location_1.y) + (layerOffset.top - elementOffset.top)\n - (templateOffset.height / 2)) + marker.offset.y) + 'px';\n }\n else {\n location_1.x = (((location_1.x + x) * scale) + marker.offset.x);\n location_1.y = (((location_1.y + y) * scale) + marker.offset.y);\n if (!animate || duration === 0) {\n element.setAttribute('transform', 'translate( ' + location_1.x + ' ' + location_1.y + ' )');\n }\n else {\n smoothTranslate(element, 0, duration, location_1);\n }\n }\n }\n }\n };\n Zoom.prototype.panning = function (direction, xDifference, yDifference) {\n var map = this.maps;\n var panArgs;\n var down = this.mouseDownPoints;\n var move = this.mouseMovePoints;\n var scale = map.scale;\n var translatePoint = map.translatePoint;\n var prevTilePoint = map.tileTranslatePoint;\n var x;\n var y;\n xDifference = !isNullOrUndefined(xDifference) ? xDifference : (down.x - move.x);\n yDifference = !isNullOrUndefined(yDifference) ? yDifference : (down.y - move.y);\n if (!map.isTileMap) {\n x = translatePoint.x - xDifference / scale;\n y = translatePoint.y - yDifference / scale;\n var layerRect = getElementByID(map.element.id + '_Layer_Collections').getBoundingClientRect();\n var elementRect = getElementByID(map.element.id + '_svg').getBoundingClientRect();\n var panningXDirection = ((xDifference < 0 ? layerRect.left <= (elementRect.left + map.mapAreaRect.x) :\n ((layerRect.left + layerRect.width) >= (elementRect.left + elementRect.width) + map.mapAreaRect.x + map.margin.left)));\n var panningYDirection = ((yDifference < 0 ? layerRect.top <= (elementRect.top + map.mapAreaRect.y) :\n ((layerRect.top + layerRect.height) >= (elementRect.top + elementRect.height) + map.mapAreaRect.y + map.margin.top)));\n panArgs = {\n cancel: false, name: pan, maps: map, tileTranslatePoint: {}, translatePoint: { previous: translatePoint, current: new Point(x, y) },\n scale: map.scale, tileZoomLevel: map.tileZoomLevel\n };\n map.trigger(pan, panArgs);\n if (panningXDirection && panningYDirection) {\n map.translatePoint = new Point(x, y);\n this.applyTransform();\n }\n else if (panningXDirection) {\n map.translatePoint = new Point(x, map.translatePoint.y);\n this.applyTransform();\n }\n else if (panningYDirection) {\n map.translatePoint = new Point(map.translatePoint.x, y);\n this.applyTransform();\n }\n }\n else if (this.maps.tileZoomLevel > 1) {\n x = map.tileTranslatePoint.x - xDifference;\n y = map.tileTranslatePoint.y - yDifference;\n this.distanceX = x - map.tileTranslatePoint.x;\n this.distanceY = y - map.tileTranslatePoint.y;\n map.tileTranslatePoint.x = x;\n map.tileTranslatePoint.y = y;\n map.translatePoint.x = (map.tileTranslatePoint.x - xDifference) / map.scale;\n map.translatePoint.y = (map.tileTranslatePoint.y - yDifference) / map.scale;\n panArgs = {\n cancel: false, name: pan, maps: map, tileTranslatePoint: { previous: prevTilePoint, current: map.tileTranslatePoint },\n translatePoint: { previous: translatePoint, current: map.translatePoint }, scale: map.scale,\n tileZoomLevel: map.tileZoomLevel\n };\n map.trigger(pan, panArgs);\n map.mapLayerPanel.generateTiles(map.tileZoomLevel, map.tileTranslatePoint);\n this.applyTransform();\n }\n this.mouseDownPoints = this.mouseMovePoints;\n };\n Zoom.prototype.toAlignSublayer = function () {\n this.maps.translatePoint.x = !isNullOrUndefined(this.distanceX) ? (this.maps.translatePoint.x -\n (this.distanceX / this.maps.scale)) : this.maps.translatePoint.x;\n this.maps.translatePoint.y = !isNullOrUndefined(this.distanceY) ? this.maps.translatePoint.y -\n (this.distanceY / this.maps.scale) : this.maps.translatePoint.y;\n this.applyTransform(false);\n };\n Zoom.prototype.toolBarZooming = function (zoomFactor, type) {\n var map = this.maps;\n var prevLevel = map.tileZoomLevel;\n var scale = map.previousScale = map.scale;\n var maxZoom = map.zoomSettings.maxZoom;\n var minZoom = map.zoomSettings.minZoom;\n var size = map.mapAreaRect;\n var translatePoint = map.previousPoint = map.translatePoint;\n var prevTilePoint = map.tileTranslatePoint;\n zoomFactor = (type === 'ZoomOut') ? (Math.round(zoomFactor) === 1 ? 1 : zoomFactor) : zoomFactor;\n var zoomArgs;\n if ((!map.isTileMap) && (type === 'ZoomIn' ? zoomFactor >= minZoom && zoomFactor <= maxZoom : zoomFactor >= minZoom)) {\n var min = map.baseMapRectBounds['min'];\n var max = map.baseMapRectBounds['max'];\n var mapWidth = Math.abs(max['x'] - min['x']);\n var mapHeight = Math.abs(min['y'] - max['y']);\n var translatePointX = translatePoint.x - (((size.width / scale) - (size.width / zoomFactor)) / 2);\n var translatePointY = translatePoint.y - (((size.height / scale) - (size.height / zoomFactor)) / 2);\n var currentHeight = Math.abs(map.baseMapRectBounds['max']['y'] - map.baseMapRectBounds['min']['y']) * zoomFactor;\n translatePointX = (currentHeight < map.mapAreaRect.height) ? (size.x + ((-(min['x'])) + ((size.width / 2) - (mapWidth / 2))))\n : translatePointX;\n translatePointY = (currentHeight < map.mapAreaRect.height) ? (size.y + ((-(min['y'])) + ((size.height / 2) - (mapHeight / 2))))\n : translatePointY;\n map.translatePoint = new Point(translatePointX, translatePointY);\n map.scale = zoomFactor;\n this.triggerZoomEvent(prevTilePoint, prevLevel);\n }\n else if ((map.isTileMap) && (zoomFactor >= minZoom && zoomFactor <= maxZoom)) {\n var tileZoomFactor = zoomFactor;\n map.scale = Math.pow(2, tileZoomFactor - 1);\n map.tileZoomLevel = tileZoomFactor;\n var position = { x: map.availableSize.width / 2, y: map.availableSize.height / 2 };\n this.getTileTranslatePosition(prevLevel, tileZoomFactor, position);\n map.translatePoint.x = (map.tileTranslatePoint.x - (0.01 * map.scale)) / map.scale;\n map.translatePoint.y = (map.tileTranslatePoint.y - (0.01 * map.scale)) / map.scale;\n this.triggerZoomEvent(prevTilePoint, prevLevel);\n map.mapLayerPanel.generateTiles(tileZoomFactor, map.tileTranslatePoint);\n }\n this.applyTransform(true);\n };\n /* tslint:disable:max-func-body-length */\n Zoom.prototype.createZoomingToolbars = function () {\n var map = this.maps;\n this.toolBarGroup = map.renderer.createGroup({\n id: map.element.id + '_Zooming_KitCollection',\n opacity: 0.3,\n });\n var kitHeight = 16;\n var kitWidth = 16;\n var xSpacing = 15;\n var ySpacing = 15;\n var padding = 20;\n var orientation = map.zoomSettings.toolBarOrientation;\n var toolbarsCollection = map.zoomSettings.toolbars;\n var shadowElement = '';\n shadowElement += '';\n shadowElement += '
')) !== -1) ? text.split('
') : null;\n customText = this.labelInterSectAction(rect, text, textStyle, interSectAction);\n textSize = measureText(textCollection && textCollection[0] || customText[0], textStyle);\n if (this.treemap.enableRtl) {\n var labelSize = measureText(text, textStyle);\n var drillSymbolCount = text.search('[+]') || text.search('[-]');\n if (rect.width < labelSize.width && drillSymbolCount > 0) {\n var label = text.substring(drillSymbolCount - 1, text.length);\n var drillSymbol = '[+]';\n var drillSymbolSize = measureText(drillSymbol, textStyle);\n customText['0'] = textTrim(rect.width - drillSymbolSize.width - padding, customText[0], textStyle) + label;\n }\n }\n textLocation = findLabelLocation(rect, position, textSize, 'Text', this.treemap);\n if (!isNullOrUndefined(textCollection)) {\n var collection = [];\n var texts = null;\n var maxNumber = [];\n for (var i = 0; i < textCollection.length; i++) {\n texts = textTrim((rect.width - 5), textCollection[i], textStyle);\n textSize = measureText(texts, textStyle);\n height += textSize.height;\n maxNumber.push(textSize.width);\n collection.push(texts);\n }\n customText = collection;\n textSize.width = Math.max.apply(null, maxNumber);\n textSize.height = height;\n }\n if (interSectAction === 'WrapByWord' || interSectAction === 'Wrap' || interSectAction === 'Trim') {\n for (var j = 0; j < customText.length; j++) {\n textSize = measureText(customText[j], textStyle);\n height += textSize.height;\n if ((rect.height - padding) > height) {\n tspanText.push(customText[j]);\n }\n }\n if (interSectAction === 'Wrap' && customText.length !== tspanText.length && tspanText.length) {\n var collectionLength = tspanText.length - 1;\n var stringText = tspanText[collectionLength];\n stringText = stringText.substring(0, (stringText.length - 1)) + '...';\n tspanText.splice(collectionLength);\n if (stringText !== '...') {\n tspanText.push(stringText);\n }\n }\n }\n else {\n textName = customText;\n tspanText.push(textName);\n }\n textOptions = new TextOption(groupId + '_Text', textLocation.x, textLocation.y, 'start', tspanText, '', '', connectorText);\n renderTextElement(textOptions, textStyle, textStyle.color || this.getSaturatedColor(fill), parentElement);\n };\n LayoutPanel.prototype.getItemColor = function (isLeafItem, item) {\n var treemap = this.treemap;\n var itemFill = isLeafItem ? treemap.leafItemSettings.fill : treemap.levels[item['groupIndex']].fill;\n var itemOpacity = isLeafItem ? treemap.leafItemSettings.opacity : treemap.levels[item['groupIndex']].opacity;\n if (!isNullOrUndefined(this.treemap.defaultLevelData)) {\n if (this.treemap.defaultLevelData.length > 0) {\n treemap.levelsOfData = this.treemap.defaultLevelData;\n }\n }\n var parentData = findChildren(treemap.levelsOfData[0])['values'];\n var colorMapping = isLeafItem ? treemap.leafItemSettings.colorMapping :\n treemap.levels[item['groupIndex']].colorMapping;\n if (colorMapping.length > 0) {\n var option = colorMap(colorMapping, item['data'][this.treemap.equalColorValuePath], item['data'][this.treemap.rangeColorValuePath], item['data'][this.treemap.weightValuePath]);\n itemFill = !isNullOrUndefined(option['fill']) ? option['fill'] : treemap.leafItemSettings.fill;\n itemOpacity = option['opacity'];\n }\n else {\n for (var i = 0; i < parentData.length; i++) {\n if (parentData[i]['levelOrderName'] === item['levelOrderName'].split('_')[0]) {\n itemFill = treemap.palette.length > 0 ? treemap.palette[i % treemap.palette.length] :\n !isNullOrUndefined(treemap.colorValuePath) ?\n parentData[i]['data'][treemap.colorValuePath] : itemFill;\n }\n }\n }\n return { fill: itemFill, opacity: itemOpacity };\n };\n /**\n * To find saturated color for datalabel\n */\n LayoutPanel.prototype.getSaturatedColor = function (color) {\n var saturatedColor = color;\n saturatedColor = (saturatedColor === 'transparent') ? window.getComputedStyle(document.body, null).backgroundColor : saturatedColor;\n var rgbValue = convertHexToColor(colorNameToHex(saturatedColor));\n var contrast = Math.round((rgbValue.r * 299 + rgbValue.g * 587 + rgbValue.b * 114) / 1000);\n return contrast >= 128 ? 'black' : 'white';\n };\n LayoutPanel.prototype.renderTemplate = function (secondaryEle, groupId, rect, position, template, item) {\n var templateElement;\n var labelEle;\n var templateSize;\n var templateFn;\n var templateLocation;\n if (isNullOrUndefined(template['prototype'])) {\n var keys = Object.keys(item['data']);\n for (var i = 0; i < keys.length; i++) {\n template = template.replace(new RegExp('{{:' + keys[i] + '}}', 'g'), item['data'][keys[i].toString()]);\n }\n }\n templateFn = getTemplateFunction(template);\n templateElement = templateFn(item['data'], this.treemap);\n labelEle = convertElement(templateElement, groupId + '_Template', item['data']);\n templateSize = measureElement(labelEle, secondaryEle);\n templateLocation = findLabelLocation(rect, position, templateSize, 'Template', this.treemap);\n labelEle.style.left = templateLocation.x + 'px';\n labelEle.style.top = templateLocation.y + 'px';\n return labelEle;\n };\n LayoutPanel.prototype.labelInterSectAction = function (rect, text, textStyle, alignment) {\n var textValue;\n var maxWidth = rect.width - 10;\n switch (alignment) {\n case 'Hide':\n textValue = [hide(maxWidth, rect.height, text, textStyle)];\n break;\n case 'Trim':\n textValue = [textTrim((maxWidth + 3), text, textStyle)];\n break;\n case 'WrapByWord':\n textValue = wordWrap(maxWidth, text, textStyle);\n break;\n case 'Wrap':\n textValue = textWrap(maxWidth, text, textStyle);\n break;\n }\n return textValue;\n };\n return LayoutPanel;\n}());\nexport { LayoutPanel };\n","import { print as printWindow, createElement, isNullOrUndefined, Browser } from '@syncfusion/ej2-base';\nimport { getElement } from '../utils/helper';\nimport { beforePrint } from '../model/constants';\nimport { PdfPageOrientation, PdfDocument, PdfBitmap } from '@syncfusion/ej2-pdf-export';\n/**\n * Annotation Module handles the Annotation for Maps\n */\nvar ExportUtils = /** @class */ (function () {\n /**\n * Constructor for Maps\n * @param control\n */\n function ExportUtils(control) {\n this.control = control;\n }\n /**\n * To print the Maps\n * @param elements\n */\n ExportUtils.prototype.print = function (elements) {\n this.printWindow = window.open('', 'print', 'height=' + window.outerHeight + ',width=' + window.outerWidth + ',tabbar=no');\n this.printWindow.moveTo(0, 0);\n this.printWindow.resizeTo(screen.availWidth, screen.availHeight);\n var argsData = {\n cancel: false, htmlContent: this.getHTMLContent(elements), name: beforePrint\n };\n this.control.trigger(beforePrint, argsData);\n if (!argsData.cancel) {\n printWindow(argsData.htmlContent, this.printWindow);\n }\n };\n /**\n * To get the html string of the Maps\n * @param elements\n * @private\n */\n ExportUtils.prototype.getHTMLContent = function (elements) {\n var div = createElement('div');\n if (elements) {\n if (elements instanceof Array) {\n elements.forEach(function (value) {\n div.appendChild(getElement(value).cloneNode(true));\n });\n }\n else if (elements instanceof Element) {\n div.appendChild(elements.cloneNode(true));\n }\n else {\n div.appendChild(getElement(elements).cloneNode(true));\n }\n }\n else {\n div.appendChild(this.control.element.cloneNode(true));\n }\n return div;\n };\n /**\n * To export the file as image/svg format\n * @param type\n * @param fileName\n */\n ExportUtils.prototype.export = function (type, fileName, orientation) {\n var _this = this;\n var element = createElement('canvas', {\n id: 'ej2-canvas',\n attrs: {\n 'width': this.control.availableSize.width.toString(),\n 'height': this.control.availableSize.height.toString()\n }\n });\n var isDownload = !(Browser.userAgent.toString().indexOf('HeadlessChrome') > -1);\n orientation = isNullOrUndefined(orientation) ? PdfPageOrientation.Landscape : orientation;\n var svgData = '';\n var url = window.URL.createObjectURL(new Blob(type === 'SVG' ? [svgData] :\n [(new XMLSerializer()).serializeToString(this.control.svgObject)], { type: 'image/svg+xml' }));\n if (type === 'SVG') {\n this.triggerDownload(fileName, type, url, isDownload);\n }\n else {\n var image_1 = new Image();\n var ctx_1 = element.getContext('2d');\n image_1.onload = (function () {\n ctx_1.drawImage(image_1, 0, 0);\n window.URL.revokeObjectURL(url);\n if (type === 'PDF') {\n var document_1 = new PdfDocument();\n var imageString = element.toDataURL('image/jpeg').replace('image/jpeg', 'image/octet-stream');\n document_1.pageSettings.orientation = orientation;\n imageString = imageString.slice(imageString.indexOf(',') + 1);\n document_1.pages.add().graphics.drawImage(new PdfBitmap(imageString), 0, 0, (_this.control.availableSize.width - 60), _this.control.availableSize.height);\n if (isDownload) {\n document_1.save(fileName + '.pdf');\n document_1.destroy();\n }\n }\n else {\n _this.triggerDownload(fileName, type, element.toDataURL('image/png').replace('image/png', 'image/octet-stream'), isDownload);\n }\n });\n image_1.src = url;\n }\n };\n /**\n * To trigger the download element\n * @param fileName\n * @param type\n * @param url\n */\n ExportUtils.prototype.triggerDownload = function (fileName, type, url, isDownload) {\n createElement('a', {\n attrs: {\n 'download': fileName + '.' + type.toLocaleLowerCase(),\n 'href': url\n }\n }).dispatchEvent(new MouseEvent(isDownload ? 'click' : 'move', {\n view: window,\n bubbles: false,\n cancelable: true\n }));\n };\n return ExportUtils;\n}());\nexport { ExportUtils };\n","/**\n * Tree Map Component\n */\nvar __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, NotifyPropertyChanges, Property, extend, Ajax } from '@syncfusion/ej2-base';\nimport { Complex, Collection } from '@syncfusion/ej2-base';\nimport { Event, Internationalization } from '@syncfusion/ej2-base';\nimport { SvgRenderer } from '@syncfusion/ej2-svg-base';\nimport { isNullOrUndefined, createElement, EventHandler, Browser, remove } from '@syncfusion/ej2-base';\nimport { Border, Margin, TitleSettings, LegendSettings, InitialDrillSettings } from './model/base';\nimport { SelectionSettings, TooltipSettings, LevelSettings, LeafItemSettings, HighlightSettings, } from './model/base';\nimport { Size, stringToNumber, RectOption, Rect, textTrim, measureText, findChildren } from '../treemap/utils/helper';\nimport { removeClassNames, removeShape } from '../treemap/utils/helper';\nimport { findPosition, TextOption, renderTextElement, isContainsData, TreeMapAjax } from '../treemap/utils/helper';\nimport { load, loaded, drillStart, drillEnd } from '../treemap/model/constants';\nimport { itemClick, itemMove, click, mouseMove, resize, doubleClick, rightClick } from '../treemap/model/constants';\nimport { LayoutPanel } from './layout/render-panel';\nimport { ExportUtils } from '../treemap/utils/export';\nimport { DataManager, Query } from '@syncfusion/ej2-data';\nimport { getThemeStyle } from './model/theme';\n/**\n * Represents the TreeMap control.\n * ```html\n *
\n * \n * ```\n */\nvar Toast = /** @class */ (function (_super) {\n __extends(Toast, _super);\n /**\n * Initializes a new instance of the Toast class.\n * @param options - Specifies Toast model properties as options.\n * @param element - Specifies the element that is rendered as a Toast.\n */\n function Toast(options, element) {\n return _super.call(this, options, element) || this;\n }\n /**\n * Gets the Component module name.\n * @private\n */\n Toast.prototype.getModuleName = function () {\n return 'toast';\n };\n /**\n * Gets the persisted state properties of the Component.\n */\n Toast.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * Removes the component from the DOM and detaches all its related event handlers, attributes and classes.\n */\n Toast.prototype.destroy = function () {\n this.hide('All');\n this.element.classList.remove(CONTAINER);\n setStyleAttribute(this.element, { 'position': '', 'z-index': '' });\n _super.prototype.destroy.call(this);\n };\n /**\n * Initialize the event handler\n * @private\n */\n Toast.prototype.preRender = function () {\n //There is no event handler\n this.isDevice = Browser.isDevice;\n if (this.width === '300px') {\n this.width = (this.isDevice && screen.width < 768) ? '100%' : '300px';\n }\n if (isNOU(this.target)) {\n this.target = document.body;\n }\n if (this.enableRtl) {\n this.element.classList.add(RTL);\n }\n };\n /**\n * Initialize the component rendering\n * @private\n */\n Toast.prototype.render = function () {\n this.progressObj = [];\n this.intervalId = [];\n this.titleTemplate = null;\n this.contentTemplate = null;\n this.toastTemplate = null;\n if (this.isDevice && screen.width < 768) {\n new Touch(this.element, { swipe: this.swipeHandler.bind(this) });\n }\n };\n /**\n * To show Toast element on a document with the relative position.\n * @param {ToastModel} toastObj? - To show Toast element on screen.\n * @returns void\n */\n Toast.prototype.show = function (toastObj) {\n if (!isNOU(toastObj)) {\n this.templateChanges(toastObj);\n extend(this, this, toastObj);\n }\n if (isNOU(this.toastContainer)) {\n this.toastContainer = this.getContainer();\n var target = typeof (this.target) === 'string' ? document.querySelector(this.target) : this.target;\n if (isNOU(target)) {\n return;\n }\n if (target.tagName === 'BODY') {\n this.toastContainer.style.position = 'fixed';\n }\n else {\n this.toastContainer.style.position = 'absolute';\n target.style.position = 'relative';\n }\n this.setPositioning(this.position);\n target.appendChild(this.toastContainer);\n }\n this.toastEle = this.createElement('div', { className: ROOT, id: getUniqueID('toast') });\n this.setWidthHeight();\n this.setCSSClass(this.cssClass);\n (isNOU(this.template) || this.template === '') ? this.personalizeToast() : this.templateRendering();\n this.setProgress();\n this.setCloseButton();\n this.setAria();\n this.appendToTarget();\n };\n Toast.prototype.swipeHandler = function (e) {\n var toastEle = closest(e.originalEvent.target, '.' + ROOT + ':not(.' + CONTAINER + ')');\n var hideAnimation = this.animation.hide.effect;\n if (!isNOU(toastEle)) {\n if (e.swipeDirection === 'Right') {\n this.animation.hide.effect = 'SlideRightOut';\n this.hide(toastEle);\n }\n else if (e.swipeDirection === 'Left') {\n this.animation.hide.effect = 'SlideLeftOut';\n this.hide(toastEle);\n }\n this.animation.hide.effect = hideAnimation;\n }\n };\n Toast.prototype.templateChanges = function (toastObj) {\n if (!isUndefined(toastObj.content) && !isNOU(this.contentTemplate) && this.content !== toastObj.content) {\n this.clearContentTemplate();\n }\n if (!isUndefined(toastObj.title) && !isNOU(this.titleTemplate) && this.title !== toastObj.title) {\n this.clearTitleTemplate();\n }\n if (!isUndefined(toastObj.template) && !isNOU(this.toastTemplate) && this.template !== toastObj.template) {\n this.clearToastTemplate();\n }\n };\n Toast.prototype.setCSSClass = function (cssClass) {\n if (!isNOU(cssClass)) {\n var split = cssClass.indexOf(',') !== -1 ? ',' : ' ';\n classList(this.toastEle, cssClass.split(split), []);\n }\n };\n Toast.prototype.setWidthHeight = function () {\n if (this.width === '300px') {\n this.toastEle.style.width = formatUnit(this.width);\n }\n else if (this.width === '100%') {\n this.toastContainer.classList.add(WIDTHFULL);\n }\n else {\n this.toastEle.style.width = formatUnit(this.width);\n this.toastContainer.classList.remove(WIDTHFULL);\n }\n this.toastEle.style.height = formatUnit(this.height);\n };\n Toast.prototype.templateRendering = function () {\n this.fetchEle(this.toastEle, this.template, 'template');\n };\n /**\n * To Hide Toast element on a document.\n * To Hide all toast element when passing 'All'.\n * @param {HTMLElement| Element| string} element? - To Hide Toast element on screen.\n * @returns void\n */\n Toast.prototype.hide = function (element) {\n if (isNOU(this.toastContainer) || this.toastContainer.childElementCount === 0) {\n return;\n }\n if (typeof element === 'string' && element === 'All') {\n for (var i = 0; i < this.toastContainer.childElementCount; i++) {\n this.destroyToast(this.toastContainer.children[i]);\n }\n return;\n }\n if (isNOU(element)) {\n element = (this.newestOnTop ? this.toastContainer.lastElementChild : this.toastContainer.firstElementChild);\n }\n this.destroyToast(element);\n };\n Toast.prototype.fetchEle = function (ele, value, prob) {\n var templateFn;\n var tempVar;\n var tmpArray;\n prob === 'title' ? tempVar = this.titleTemplate : prob === 'content' ? tempVar = this.contentTemplate : tempVar = this.toastTemplate;\n if (!isNOU(tempVar)) {\n ele.appendChild(tempVar.cloneNode(true));\n return ele;\n }\n try {\n if (document.querySelectorAll(value).length > 0) {\n var elem = document.querySelector(value);\n ele.appendChild(elem);\n elem.style.display = '';\n var clo = elem.cloneNode(true);\n prob === 'title' ? this.titleTemplate = clo : prob === 'content' ? this.contentTemplate = clo : this.toastTemplate = clo;\n }\n }\n catch (e) {\n templateFn = templateCompiler(value);\n }\n if (!isNOU(templateFn)) {\n tmpArray = templateFn({}, this, prob);\n }\n if (!isNOU(tmpArray) && tmpArray.length > 0 && !(isNOU(tmpArray[0].tagName) && tmpArray.length === 1)) {\n [].slice.call(tmpArray).forEach(function (el) {\n if (!isNOU(el.tagName)) {\n el.style.display = '';\n }\n ele.appendChild(el);\n });\n }\n else if (ele.childElementCount === 0) {\n ele.innerHTML = value;\n }\n return ele;\n };\n Toast.prototype.clearProgress = function (intervalId) {\n if (!isNOU(this.intervalId[intervalId])) {\n clearInterval(this.intervalId[intervalId]);\n delete this.intervalId[intervalId];\n }\n if (!isNOU(this.progressObj[intervalId])) {\n clearInterval(this.progressObj[intervalId].intervalId);\n delete this.progressObj[intervalId];\n }\n };\n Toast.prototype.clearContainerPos = function () {\n var _this = this;\n if (this.customPosition) {\n setStyleAttribute(this.toastContainer, { 'left': '', 'top': '' });\n this.toastContainer = null;\n this.customPosition = false;\n }\n else {\n [ROOT + '-top-left',\n ROOT + '-top-right',\n ROOT + '-bottom-left',\n ROOT + '-bottom-right',\n ROOT + '-bottom-center',\n ROOT + '-top-center',\n ROOT + '-full-width'].forEach(function (pos) {\n if (!isNOU(_this.toastContainer) && _this.toastContainer.classList.contains(pos)) {\n _this.toastContainer.classList.remove(pos);\n }\n });\n this.toastContainer = null;\n }\n if (!isNOU(this.titleTemplate)) {\n this.clearTitleTemplate();\n }\n if (!isNOU(this.contentTemplate)) {\n this.clearContentTemplate();\n }\n if (!isNOU(this.toastTemplate)) {\n this.clearToastTemplate();\n }\n };\n Toast.prototype.clearTitleTemplate = function () {\n this.titleTemplate.style.display = 'none';\n document.body.appendChild(this.titleTemplate);\n this.titleTemplate = null;\n };\n Toast.prototype.clearContentTemplate = function () {\n this.contentTemplate.style.display = 'none';\n document.body.appendChild(this.contentTemplate);\n this.contentTemplate = null;\n };\n Toast.prototype.clearToastTemplate = function () {\n this.toastTemplate.style.display = 'none';\n document.body.appendChild(this.toastTemplate);\n this.toastTemplate = null;\n };\n Toast.prototype.destroyToast = function (toastEle) {\n var _this = this;\n var hideAnimate = this.animation.hide;\n var animate = {\n duration: hideAnimate.duration, name: hideAnimate.effect, timingFunction: hideAnimate.easing\n };\n var intervalId = parseInt(toastEle.id.split('toast_')[1], 10);\n var toastClose = {\n toastContainer: this.toastContainer,\n toastObj: this,\n };\n if (!isNOU(this.progressObj[intervalId]) && !isNOU(toastEle.querySelector('.' + PROGRESS))) {\n this.progressObj[intervalId].progressEle.style.width = '0%';\n }\n animate.end = function () {\n _this.clearProgress(intervalId);\n detach(toastEle);\n _this.trigger('close', toastClose);\n if (_this.toastContainer.childElementCount === 0) {\n _this.clearContainerPos();\n }\n };\n new Animation({}).animate(toastEle, animate);\n };\n Toast.prototype.personalizeToast = function () {\n this.setIcon();\n this.setTitle();\n this.setContent();\n this.actionButtons();\n };\n Toast.prototype.setAria = function () {\n attributes(this.toastEle, { 'role': 'alert' });\n };\n Toast.prototype.setPositioning = function (pos) {\n if (typeof (pos.X) === 'number' || typeof (pos.Y) === 'number' || pos.X.indexOf('%') !== -1 || pos.Y.indexOf('%') !== -1) {\n setStyleAttribute(this.toastContainer, { 'left': formatUnit(pos.X), 'top': formatUnit(pos.Y) });\n this.customPosition = true;\n }\n else {\n this.toastContainer.classList.add(ROOT + '-' + pos.Y.toString().toLowerCase() + '-' + pos.X.toString().toLowerCase());\n }\n };\n Toast.prototype.setCloseButton = function () {\n if (!this.showCloseButton) {\n return;\n }\n var closeBtn = this.createElement('div', { className: CLOSEBTN + ' e-icons ' });\n this.toastEle.appendChild(closeBtn);\n };\n Toast.prototype.setProgress = function () {\n if (this.timeOut > 0) {\n var id = parseInt(this.toastEle.id.split('toast_')[1], 10);\n this.intervalId[id] = window.setTimeout(this.destroyToast.bind(this, this.toastEle), this.timeOut);\n this.progressObj[id] = { hideEta: null, intervalId: null, maxHideTime: null, element: null, timeOutId: null, progressEle: null };\n this.progressObj[id].maxHideTime = parseFloat(this.timeOut + '');\n this.progressObj[id].hideEta = new Date().getTime() + this.progressObj[id].maxHideTime;\n this.progressObj[id].element = this.toastEle;\n if (this.extendedTimeout > 0) {\n EventHandler.add(this.toastEle, 'mouseover', this.toastHoverAction.bind(this, id));\n EventHandler.add(this.toastEle, 'mouseleave', this.delayedToastProgress.bind(this, id));\n this.progressObj[id].timeOutId = this.intervalId[id];\n }\n if (this.showProgressBar) {\n this.progressBarEle = this.createElement('div', { className: PROGRESS });\n this.toastEle.insertBefore(this.progressBarEle, this.toastEle.children[0]);\n this.progressObj[id].intervalId = setInterval(this.updateProgressBar.bind(this, this.progressObj[id]), 10);\n this.progressObj[id].progressEle = this.progressBarEle;\n }\n }\n };\n Toast.prototype.toastHoverAction = function (id) {\n clearTimeout(this.progressObj[id].timeOutId);\n clearInterval(this.progressObj[id].intervalId);\n this.progressObj[id].hideEta = 0;\n var toastEle = this.progressObj[id].element;\n if (!isNOU(toastEle.querySelector('.' + PROGRESS))) {\n this.progressObj[id].progressEle.style.width = '0%';\n }\n };\n Toast.prototype.delayedToastProgress = function (id) {\n var progress = this.progressObj[id];\n var toastEle = progress.element;\n progress.timeOutId = window.setTimeout(this.destroyToast.bind(this, toastEle), this.extendedTimeout);\n progress.maxHideTime = parseFloat(this.extendedTimeout + '');\n progress.hideEta = new Date().getTime() + progress.maxHideTime;\n if (!isNOU(toastEle.querySelector('.' + PROGRESS))) {\n progress.intervalId = setInterval(this.updateProgressBar.bind(this, progress), 10);\n }\n };\n Toast.prototype.updateProgressBar = function (progressObj) {\n var percentage = ((progressObj.hideEta - (new Date().getTime())) / progressObj.maxHideTime) * 100;\n progressObj.progressEle.style.width = percentage + '%';\n };\n Toast.prototype.setIcon = function () {\n if (isNOU(this.icon) || this.icon.length === 0) {\n return;\n }\n var iconEle = this.createElement('div', { className: ICON + ' e-icons ' + this.icon });\n this.toastEle.appendChild(iconEle);\n };\n Toast.prototype.setTitle = function () {\n if (isNOU(this.title)) {\n return;\n }\n var titleEle = this.createElement('div', { className: TITLE });\n titleEle = this.fetchEle(titleEle, this.title, 'title');\n var msgContainer = this.createElement('div', { className: MESSAGE });\n msgContainer.appendChild(titleEle);\n this.toastEle.appendChild(msgContainer);\n };\n Toast.prototype.setContent = function () {\n var contentEle = this.createElement('div', { className: CONTENT });\n var ele = this.element;\n if (isNOU(this.content) || this.content === '') {\n var isContent = this.element.innerHTML.replace(/\\s/g, '') !== '';\n if ((ele.children.length > 0 || isContent) && !ele.firstElementChild.classList.contains(ROOT)) {\n this.innerEle = document.createDocumentFragment();\n var tempEle_1 = this.createElement('div');\n while (ele.childNodes.length !== 0) {\n this.innerEle.appendChild(this.element.childNodes[0]);\n }\n contentEle.appendChild(this.innerEle);\n [].slice.call(contentEle.children).forEach(function (ele) {\n tempEle_1.appendChild(ele.cloneNode(true));\n });\n this.content = tempEle_1;\n this.appendMessageContainer(contentEle);\n }\n }\n else {\n if (typeof (this.content) === 'object' && !isNOU(this.content.tagName)) {\n contentEle.appendChild(this.content);\n this.content = this.content.cloneNode(true);\n this.appendMessageContainer(contentEle);\n }\n else {\n contentEle = this.fetchEle(contentEle, this.content, 'content');\n this.appendMessageContainer(contentEle);\n }\n }\n };\n Toast.prototype.appendMessageContainer = function (element) {\n if (this.toastEle.querySelectorAll('.' + MESSAGE).length > 0) {\n this.toastEle.querySelector('.' + MESSAGE).appendChild(element);\n }\n else {\n var msgContainer = this.createElement('div', { className: MESSAGE });\n msgContainer.appendChild(element);\n this.toastEle.appendChild(msgContainer);\n }\n };\n Toast.prototype.actionButtons = function () {\n var _this = this;\n var actionBtnContainer = this.createElement('div', { className: ACTIOBUTTONS });\n [].slice.call(this.buttons).forEach(function (actionBtn) {\n if (isNOU(actionBtn.model)) {\n return;\n }\n var btnDom = _this.createElement('button');\n btnDom.setAttribute('type', 'button');\n if (isNOU(actionBtn.model.cssClass) || actionBtn.model.cssClass.length === 0) {\n actionBtn.model.cssClass = 'e-primary';\n }\n btnDom.classList.add('e-small');\n new Button(actionBtn.model, btnDom);\n if (!isNOU(actionBtn.click) && typeof (actionBtn.click) === 'function') {\n EventHandler.add(btnDom, 'click', actionBtn.click);\n }\n actionBtnContainer.appendChild(btnDom);\n });\n if (actionBtnContainer.childElementCount > 0) {\n this.appendMessageContainer(actionBtnContainer);\n }\n };\n Toast.prototype.appendToTarget = function () {\n var toastBeforeOpen = {\n toastObj: this,\n element: this.toastEle,\n cancel: false\n };\n this.trigger('beforeOpen', toastBeforeOpen);\n if (toastBeforeOpen.cancel) {\n return;\n }\n this.toastEle.style.display = 'none';\n if (this.newestOnTop && this.toastContainer.childElementCount !== 0) {\n this.toastContainer.insertBefore(this.toastEle, this.toastContainer.children[0]);\n }\n else {\n this.toastContainer.appendChild(this.toastEle);\n }\n EventHandler.add(this.toastEle, 'click', this.clickHandler, this);\n this.toastContainer.style.zIndex = getZindexPartial(this.toastContainer) + '';\n this.displayToast(this.toastEle);\n };\n Toast.prototype.clickHandler = function (e) {\n e.stopPropagation();\n var target = e.target;\n var toastEle = closest(target, '.' + ROOT);\n var clickArgs = {\n element: toastEle, cancel: false, clickToClose: false, originalEvent: e, toastObj: this\n };\n var isCloseIcon = target.classList.contains(CLOSEBTN);\n this.trigger('click', clickArgs);\n if ((isCloseIcon && !clickArgs.cancel) || clickArgs.clickToClose) {\n this.destroyToast(toastEle);\n }\n };\n Toast.prototype.displayToast = function (toastEle) {\n var _this = this;\n var showAnimate = this.animation.show;\n var animate = {\n duration: showAnimate.duration, name: showAnimate.effect, timingFunction: showAnimate.easing\n };\n var toastOpen = {\n toastObj: this,\n element: this.toastEle,\n };\n animate.begin = function () {\n toastEle.style.display = '';\n };\n animate.end = function () {\n _this.trigger('open', toastOpen);\n };\n new Animation(animate).animate(toastEle);\n };\n Toast.prototype.getContainer = function () {\n this.element.classList.add(CONTAINER);\n return this.element;\n };\n /**\n * Called internally if any of the property value changed.\n * @private\n */\n Toast.prototype.onPropertyChanged = function (newProp, oldProp) {\n var container = this.element;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'enableRtl':\n newProp.enableRtl ? container.classList.add(RTL) : container.classList.remove(RTL);\n break;\n }\n }\n };\n __decorate([\n Property('300px')\n ], Toast.prototype, \"width\", void 0);\n __decorate([\n Property('auto')\n ], Toast.prototype, \"height\", void 0);\n __decorate([\n Property(null)\n ], Toast.prototype, \"title\", void 0);\n __decorate([\n Property(null)\n ], Toast.prototype, \"content\", void 0);\n __decorate([\n Property(null)\n ], Toast.prototype, \"icon\", void 0);\n __decorate([\n Property(null)\n ], Toast.prototype, \"cssClass\", void 0);\n __decorate([\n Property(null)\n ], Toast.prototype, \"template\", void 0);\n __decorate([\n Property(true)\n ], Toast.prototype, \"newestOnTop\", void 0);\n __decorate([\n Property(false)\n ], Toast.prototype, \"showCloseButton\", void 0);\n __decorate([\n Property(false)\n ], Toast.prototype, \"showProgressBar\", void 0);\n __decorate([\n Property(5000)\n ], Toast.prototype, \"timeOut\", void 0);\n __decorate([\n Property(1000)\n ], Toast.prototype, \"extendedTimeout\", void 0);\n __decorate([\n Complex({}, ToastAnimationSettings)\n ], Toast.prototype, \"animation\", void 0);\n __decorate([\n Complex({}, ToastPosition)\n ], Toast.prototype, \"position\", void 0);\n __decorate([\n Collection([{}], ButtonModelProps)\n ], Toast.prototype, \"buttons\", void 0);\n __decorate([\n Property(null)\n ], Toast.prototype, \"target\", void 0);\n __decorate([\n Event()\n ], Toast.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Toast.prototype, \"destroyed\", void 0);\n __decorate([\n Event()\n ], Toast.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], Toast.prototype, \"beforeOpen\", void 0);\n __decorate([\n Event()\n ], Toast.prototype, \"close\", void 0);\n __decorate([\n Event()\n ], Toast.prototype, \"click\", void 0);\n Toast = __decorate([\n NotifyPropertyChanges\n ], Toast);\n return Toast;\n}(Component));\nexport { Toast };\n","import { TextMarkupAnnotation } from '../index';\nimport { createElement } from '@syncfusion/ej2-base';\n/**\n * The `Annotation` module is used to handle annotation actions of PDF viewer.\n */\nvar Annotation = /** @class */ (function () {\n /**\n * @private\n */\n function Annotation(pdfViewer, viewerBase) {\n /**\n * @private\n */\n this.actionCollection = [];\n /**\n * @private\n */\n this.redoCollection = [];\n /**\n * @private\n */\n this.isPopupNoteVisible = false;\n this.pdfViewer = pdfViewer;\n this.pdfViewerBase = viewerBase;\n if (this.pdfViewer.enableTextMarkupAnnotation) {\n this.textMarkupAnnotationModule = new TextMarkupAnnotation(this.pdfViewer, this.pdfViewerBase);\n }\n }\n /**\n * Set annotation type to be added in next user interaction in PDF Document.\n * @param type\n * @returns void\n */\n Annotation.prototype.setAnnotationMode = function (type) {\n if (type === 'None') {\n this.clearAnnotationMode();\n }\n else if (type === 'Highlight' || type === 'Strikethrough' || type === 'Underline') {\n if (this.textMarkupAnnotationModule) {\n this.textMarkupAnnotationModule.drawTextMarkupAnnotations(type.toString());\n }\n }\n };\n Annotation.prototype.clearAnnotationMode = function () {\n if (this.textMarkupAnnotationModule) {\n this.textMarkupAnnotationModule.isTextMarkupAnnotationMode = false;\n }\n };\n /**\n * @private\n */\n Annotation.prototype.deleteAnnotation = function () {\n if (this.textMarkupAnnotationModule) {\n this.textMarkupAnnotationModule.deleteTextMarkupAnnotation();\n if (this.pdfViewer.toolbarModule.annotationToolbarModule) {\n this.pdfViewer.toolbarModule.annotationToolbarModule.selectAnnotationDeleteItem(false);\n this.pdfViewer.toolbarModule.annotationToolbarModule.enableAnnotationPropertiesTools(false);\n }\n }\n };\n /**\n * @private\n */\n Annotation.prototype.initializeCollection = function () {\n this.actionCollection = [];\n this.redoCollection = [];\n if (!this.popupNote) {\n this.createNote();\n }\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n Annotation.prototype.addAction = function (pageNumber, index, annotation, actionString, property) {\n var action = { pageIndex: pageNumber, index: index, annotation: annotation, action: actionString, modifiedProperty: property };\n this.actionCollection.push(action);\n this.updateToolbar();\n };\n /**\n * @private\n */\n Annotation.prototype.undo = function () {\n var actionObject = this.actionCollection.pop();\n if (actionObject) {\n switch (actionObject.action) {\n case 'Text Markup Added':\n case 'Text Markup Deleted':\n if (this.textMarkupAnnotationModule) {\n // tslint:disable-next-line:max-line-length\n this.textMarkupAnnotationModule.undoTextMarkupAction(actionObject.annotation, actionObject.pageIndex, actionObject.index, actionObject.action);\n }\n break;\n case 'Text Markup Property modified':\n if (this.textMarkupAnnotationModule) {\n // tslint:disable-next-line:max-line-length\n actionObject.annotation = this.textMarkupAnnotationModule.undoRedoPropertyChange(actionObject.annotation, actionObject.pageIndex, actionObject.index, actionObject.modifiedProperty);\n }\n break;\n }\n this.redoCollection.push(actionObject);\n this.updateToolbar();\n }\n };\n /**\n * @private\n */\n Annotation.prototype.redo = function () {\n var actionObject = this.redoCollection.pop();\n if (actionObject) {\n switch (actionObject.action) {\n case 'Text Markup Added':\n case 'Text Markup Deleted':\n if (this.textMarkupAnnotationModule) {\n // tslint:disable-next-line:max-line-length\n this.textMarkupAnnotationModule.redoTextMarkupAction(actionObject.annotation, actionObject.pageIndex, actionObject.index, actionObject.action);\n }\n break;\n case 'Text Markup Property modified':\n if (this.textMarkupAnnotationModule) {\n // tslint:disable-next-line:max-line-length\n actionObject.annotation = this.textMarkupAnnotationModule.undoRedoPropertyChange(actionObject.annotation, actionObject.pageIndex, actionObject.index, actionObject.modifiedProperty);\n }\n break;\n }\n this.actionCollection.push(actionObject);\n this.updateToolbar();\n }\n };\n Annotation.prototype.updateToolbar = function () {\n if (this.pdfViewer.toolbarModule) {\n this.pdfViewer.toolbarModule.updateUndoRedoButtons();\n }\n };\n Annotation.prototype.createNote = function () {\n // tslint:disable-next-line:max-line-length\n this.popupNote = createElement('div', { id: this.pdfViewer.element.id + '_annotation_note', className: 'e-pv-annotation-note', styles: 'display:none' });\n this.popupNoteAuthor = createElement('div', { id: this.pdfViewer.element.id + '_annotation_note_author', className: 'e-pv-annotation-note-author' });\n this.popupNote.appendChild(this.popupNoteAuthor);\n // tslint:disable-next-line:max-line-length\n this.popupNoteContent = createElement('div', { id: this.pdfViewer.element.id + '_annotation_note_content', className: 'e-pv-annotation-note-content' });\n this.popupNote.appendChild(this.popupNoteContent);\n this.pdfViewerBase.mainContainer.appendChild(this.popupNote);\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n Annotation.prototype.showPopupNote = function (event, color, author, note, type) {\n var mainContainerPosition = this.pdfViewerBase.mainContainer.getBoundingClientRect();\n var popupNoteClientRect = this.popupNote.getBoundingClientRect();\n if (author) {\n this.popupNoteAuthor.textContent = author;\n }\n this.popupNoteContent.textContent = note;\n if (type === 'Highlight') {\n this.popupNote.style.backgroundColor = 'rgb(237, 232, 177)';\n }\n else if (type === 'Underline') {\n this.popupNote.style.backgroundColor = 'rgb(187, 241, 191)';\n }\n else if (type === 'Strikethrough') {\n this.popupNote.style.backgroundColor = 'rgb(242, 188, 207)';\n }\n this.popupNote.style.display = 'block';\n var topPosition = (event.pageY - mainContainerPosition.top + 5);\n var leftPosition = (event.pageX - mainContainerPosition.left + 5);\n if (leftPosition + popupNoteClientRect.width > mainContainerPosition.width) {\n leftPosition = leftPosition - popupNoteClientRect.width;\n }\n if (topPosition + popupNoteClientRect.height > mainContainerPosition.height) {\n topPosition = topPosition - popupNoteClientRect.height;\n }\n this.popupNote.style.top = topPosition + 'px';\n this.popupNote.style.left = leftPosition + 'px';\n };\n /**\n * @private\n */\n Annotation.prototype.hidePopupNote = function () {\n this.popupNote.style.display = 'none';\n };\n Annotation.prototype.createTextMarkupPopup = function () {\n var _this = this;\n var elementId = this.pdfViewer.element.id;\n // tslint:disable-next-line:max-line-length\n this.popupElement = createElement('div', { id: elementId + '_popup_annotation_note', className: 'e-pv-annotation-popup-menu', styles: 'display:none' });\n var headerElement = createElement('div', { id: elementId + '_popup_header', className: 'e-pv-annotation-popup-header' });\n // tslint:disable-next-line:max-line-length\n this.authorPopupElement = createElement('div', { id: elementId + '_popup_author', className: 'e-pv-annotation-popup-author' });\n headerElement.appendChild(this.authorPopupElement);\n // tslint:disable-next-line:max-line-length\n var closeBtn = createElement('span', { id: elementId + '_popup_close', className: 'e-pv-annotation-popup-close e-pv-icon' });\n headerElement.appendChild(closeBtn);\n this.popupElement.appendChild(headerElement);\n // tslint:disable-next-line:max-line-length\n this.modifiedDateElement = createElement('div', { id: elementId + '_popup_modified_time', className: 'e-pv-annotation-modified-time' });\n this.popupElement.appendChild(this.modifiedDateElement);\n // tslint:disable-next-line:max-line-length\n var contentContainer = createElement('div', { id: elementId + '_popup_content_container', className: 'e-pv-annotation-popup-note-container' });\n this.noteContentElement = createElement('div', { id: elementId + '_popup_content', className: 'e-pv-annotation-popup-content' });\n this.noteContentElement.contentEditable = 'true';\n contentContainer.appendChild(this.noteContentElement);\n this.popupElement.appendChild(contentContainer);\n this.pdfViewerBase.viewerContainer.appendChild(this.popupElement);\n closeBtn.addEventListener('click', this.saveClosePopupMenu.bind(this));\n closeBtn.addEventListener('touchend', this.saveClosePopupMenu.bind(this));\n this.popupElement.addEventListener('mousedown', this.onPopupElementMoveStart.bind(this));\n this.popupElement.addEventListener('mousemove', this.onPopupElementMove.bind(this));\n window.addEventListener('mouseup', this.onPopupElementMoveEnd.bind(this));\n this.popupElement.addEventListener('touchstart', this.onPopupElementMoveStart.bind(this));\n this.popupElement.addEventListener('touchmove', this.onPopupElementMove.bind(this));\n window.addEventListener('touchend', this.onPopupElementMoveEnd.bind(this));\n this.noteContentElement.addEventListener('mousedown', function () { _this.noteContentElement.focus(); });\n };\n // tslint:disable-next-line\n Annotation.prototype.onPopupElementMoveStart = function (event) {\n if (event.type === 'touchstart') {\n event = event.changedTouches[0];\n }\n if ((event.target.id !== (this.noteContentElement.id) || !(event.target.contains(this.noteContentElement.childNodes[0])))) {\n this.isPopupMenuMoved = true;\n var popupElementClientRect = this.popupElement.getBoundingClientRect();\n this.clientX = event.clientX - popupElementClientRect.left;\n // tslint:disable-next-line:max-line-length\n this.clientY = (event.clientY - popupElementClientRect.top) + (this.pdfViewerBase.pageSize[this.currentAnnotPageNumber].top * this.pdfViewerBase.getZoomFactor());\n }\n };\n // tslint:disable-next-line\n Annotation.prototype.onPopupElementMove = function (event) {\n if (event.type === 'touchmove') {\n event = event.changedTouches[0];\n }\n // tslint:disable-next-line:max-line-length\n if (this.isPopupMenuMoved && (event.target.id !== (this.noteContentElement.id) || !(event.target.contains(this.noteContentElement.childNodes[0])))) {\n var left = (event.clientX - this.clientX) + parseFloat(this.popupElement.style.left);\n var top_1 = ((event.clientY - this.clientY) + parseFloat(this.popupElement.style.top));\n this.clientX = event.clientX;\n this.clientY = event.clientY;\n var clientPosition = this.popupElement.getBoundingClientRect();\n var pageDiv = document.getElementById(this.pdfViewer.element.id + '_pageDiv_' + this.currentAnnotPageNumber);\n // tslint:disable-next-line:max-line-length\n if (left > parseFloat(pageDiv.style.left) && (left + clientPosition.width) < (parseFloat(pageDiv.style.left) + parseFloat(pageDiv.style.width))) {\n this.popupElement.style.left = (left) + 'px';\n }\n else {\n this.popupElement.style.left = parseFloat(this.popupElement.style.left) + 'px';\n }\n // tslint:disable-next-line:max-line-length\n if (top_1 > parseFloat(pageDiv.style.top) && (top_1 + clientPosition.height) < (parseFloat(pageDiv.style.top) + parseFloat(pageDiv.style.height))) {\n this.popupElement.style.top = (top_1) + 'px';\n }\n else {\n this.popupElement.style.top = parseFloat(this.popupElement.style.top) + 'px';\n }\n }\n };\n Annotation.prototype.onPopupElementMoveEnd = function () {\n this.isPopupMenuMoved = false;\n };\n Annotation.prototype.saveClosePopupMenu = function () {\n if (this.textMarkupAnnotationModule) {\n this.textMarkupAnnotationModule.saveNoteContent(this.currentAnnotPageNumber, this.noteContentElement.innerText);\n }\n this.closePopupMenu();\n };\n /**\n * @private\n */\n Annotation.prototype.closePopupMenu = function () {\n if (this.popupElement) {\n this.popupElement.parentElement.removeChild(this.popupElement);\n this.popupElement = null;\n this.isPopupNoteVisible = false;\n }\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n Annotation.prototype.showAnnotationPopup = function (event) {\n if (this.textMarkupAnnotationModule) {\n this.currentAnnotPageNumber = this.getEventPageNumber(event);\n // tslint:disable-next-line:max-line-length\n if (this.textMarkupAnnotationModule && (event.target !== (this.noteContentElement) || (event.target.contains(this.noteContentElement.childNodes[0])))) {\n this.hidePopupNote();\n if (!this.popupElement) {\n this.createTextMarkupPopup();\n this.popupElement.style.display = 'block';\n this.authorPopupElement.textContent = this.textMarkupAnnotationModule.currentTextMarkupAnnotation.author;\n // tslint:disable-next-line:max-line-length\n this.modifiedDateElement.textContent = this.getProperDate(this.textMarkupAnnotationModule.currentTextMarkupAnnotation.modifiedDate);\n this.noteContentElement.textContent = this.textMarkupAnnotationModule.currentTextMarkupAnnotation.note;\n var clientPosition = this.popupElement.getBoundingClientRect();\n // tslint:disable-next-line:max-line-length\n var pageDiv = document.getElementById(this.pdfViewer.element.id + '_pageDiv_' + this.currentAnnotPageNumber);\n var canvasPosition = pageDiv.getBoundingClientRect();\n var topPosition = ((event.clientY) - canvasPosition.top) + parseFloat(pageDiv.style.top);\n var leftPosition = (event.clientX);\n if ((leftPosition + clientPosition.width) > (parseFloat(pageDiv.style.left) + parseFloat(pageDiv.style.width))) {\n this.popupElement.style.left = (leftPosition - clientPosition.width) + 'px';\n }\n else {\n this.popupElement.style.left = leftPosition + 'px';\n }\n if ((topPosition + clientPosition.height) > (parseFloat(pageDiv.style.top) + parseFloat(pageDiv.style.height))) {\n this.popupElement.style.top = (topPosition - clientPosition.height) + 'px';\n }\n else {\n this.popupElement.style.top = topPosition + 'px';\n }\n this.isPopupNoteVisible = true;\n }\n }\n }\n };\n Annotation.prototype.getProperDate = function (date) {\n var dateObject = new Date(date.toString());\n if (isNaN(dateObject.getFullYear())) {\n var dateString = date.slice(2, 16);\n // tslint:disable-next-line:max-line-length\n dateString = dateString.slice(0, 4) + '/' + dateString.slice(4, 6) + '/' + dateString.slice(6, 8) + ' ' + dateString.slice(8, 10) + ':' + dateString.slice(10, 12) + ':' + dateString.slice(12, 14);\n dateObject = new Date(dateString);\n }\n // tslint:disable-next-line:max-line-length\n return (dateObject.getMonth() + 1) + '/' + dateObject.getDate() + '/' + dateObject.getFullYear() + ' ' + dateObject.getHours() + ':' + dateObject.getMinutes() + ':' + dateObject.getSeconds();\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n Annotation.prototype.getEventPageNumber = function (event) {\n var eventTarget = event.target;\n // tslint:disable-next-line:max-line-length\n var pageString = eventTarget.id.split('_text_')[1] || eventTarget.id.split('_textLayer_')[1] || eventTarget.id.split('_annotationCanvas_')[1];\n // tslint:disable-next-line\n return parseInt(pageString);\n };\n /**\n * private\n */\n Annotation.prototype.clear = function () {\n if (this.textMarkupAnnotationModule) {\n this.textMarkupAnnotationModule.clear();\n }\n };\n /**\n * @private\n */\n Annotation.prototype.destroy = function () {\n this.textMarkupAnnotationModule.clear();\n };\n /**\n * @private\n */\n Annotation.prototype.getModuleName = function () {\n return 'Annotation';\n };\n return Annotation;\n}());\nexport { Annotation };\n","import { createElement } from '@syncfusion/ej2-base';\n/**\n * The `LinkAnnotation` module is used to handle link annotation actions of PDF viewer.\n * @hidden\n */\nvar LinkAnnotation = /** @class */ (function () {\n /**\n * @private\n */\n function LinkAnnotation(pdfViewer, viewerBase) {\n this.pdfViewer = pdfViewer;\n this.pdfViewerBase = viewerBase;\n }\n /**\n * @private\n */\n // tslint:disable-next-line \n LinkAnnotation.prototype.renderHyperlinkContent = function (data, pageIndex) {\n if (this.pdfViewer.enableHyperlink) {\n var hyperlinks = data.hyperlinks;\n var hyperlinksBounds = data.hyperlinkBounds;\n var linkAnnotation = data.linkAnnotation;\n var linkPage = data.linkPage;\n var annotationY = data.annotationLocation;\n if (hyperlinks.length > 0 && hyperlinksBounds.length > 0) {\n this.renderWebLink(hyperlinks, hyperlinksBounds, pageIndex);\n }\n if (linkAnnotation.length > 0 && linkPage.length > 0) {\n this.renderDocumentLink(linkAnnotation, linkPage, annotationY, pageIndex);\n }\n }\n };\n LinkAnnotation.prototype.renderWebLink = function (hyperlinks, hyperlinksBounds, pageIndex) {\n var proxy = this;\n var _loop_1 = function (i) {\n var aTag = createElement('a', { id: 'weblinkdiv_' + i });\n // tslint:disable-next-line\n var rect = hyperlinksBounds[i];\n aTag = this_1.setHyperlinkProperties(aTag, rect);\n aTag.title = hyperlinks[i];\n aTag.setAttribute('href', hyperlinks[i]);\n if (this_1.pdfViewer.hyperlinkOpenState === 'CurrentTab') {\n aTag.target = '_self';\n aTag.onclick = function () {\n proxy.pdfViewer.fireHyperlinkClick(hyperlinks[i]);\n };\n }\n else if (this_1.pdfViewer.hyperlinkOpenState === 'NewTab') {\n aTag.target = '_blank';\n aTag.onclick = function () {\n proxy.pdfViewer.fireHyperlinkClick(hyperlinks[i]);\n };\n }\n else if (this_1.pdfViewer.hyperlinkOpenState === 'NewWindow') {\n aTag.onclick = function () {\n proxy.pdfViewer.fireHyperlinkClick(hyperlinks[i]);\n window.open(hyperlinks[i], '_blank', 'scrollbars=yes,resizable=yes');\n return false;\n };\n }\n var pageDiv = document.getElementById(this_1.pdfViewer.element.id + '_pageDiv_' + pageIndex);\n pageDiv.appendChild(aTag);\n };\n var this_1 = this;\n for (var i = 0; i < hyperlinks.length; i++) {\n _loop_1(i);\n }\n };\n LinkAnnotation.prototype.renderDocumentLink = function (linkAnnotation, linkPage, annotationY, pageIndex) {\n var proxy = this;\n var _loop_2 = function (i) {\n var aTag = createElement('a', { id: 'linkdiv_' + i });\n // tslint:disable-next-line\n var rect = linkAnnotation[i];\n aTag = this_2.setHyperlinkProperties(aTag, rect);\n aTag.setAttribute('href', '');\n if (linkPage[i] !== undefined && linkPage[i] > 0) {\n var destPageHeight = (this_2.pdfViewerBase.pageSize[pageIndex].height);\n var destLocation = void 0;\n var scrollValue = void 0;\n if (annotationY.length !== 0) {\n destLocation = (annotationY[i]);\n // tslint:disable-next-line:max-line-length\n scrollValue = this_2.pdfViewerBase.pageSize[linkPage[i]].top * this_2.pdfViewerBase.getZoomFactor() + ((destPageHeight - destLocation) * this_2.pdfViewerBase.getZoomFactor());\n }\n else {\n // tslint:disable-next-line:max-line-length\n scrollValue = this_2.pdfViewerBase.pageSize[linkPage[i]].top * this_2.pdfViewerBase.getZoomFactor();\n }\n if (scrollValue !== undefined) {\n aTag.name = scrollValue.toString();\n aTag.onclick = function () {\n // tslint:disable-next-line:radix\n proxy.pdfViewerBase.viewerContainer.scrollTop = parseInt(aTag.name);\n return false;\n };\n }\n }\n var pageDiv = document.getElementById(this_2.pdfViewer.element.id + '_pageDiv_' + pageIndex);\n pageDiv.appendChild(aTag);\n };\n var this_2 = this;\n for (var i = 0; i < linkAnnotation.length; i++) {\n _loop_2(i);\n }\n };\n // tslint:disable-next-line\n LinkAnnotation.prototype.setHyperlinkProperties = function (aTag, rect) {\n aTag.className = 'e-pv-hyperlink';\n aTag.style.background = 'transparent';\n aTag.style.position = 'absolute';\n aTag.style.left = (rect.Left * this.pdfViewerBase.getZoomFactor()) + 'px';\n aTag.style.top = (rect.Top * this.pdfViewerBase.getZoomFactor()) + 'px';\n aTag.style.width = (rect.Width * this.pdfViewerBase.getZoomFactor()) + 'px';\n if (rect.Height < 0) {\n aTag.style.height = (-rect.Height * this.pdfViewerBase.getZoomFactor()) + 'px';\n aTag.style.top = ((rect.Top + rect.Height) * this.pdfViewerBase.getZoomFactor()) + 'px';\n }\n else {\n aTag.style.height = ((rect.Height < 0 ? -rect.Height : rect.Height) * this.pdfViewerBase.getZoomFactor()) + 'px';\n }\n aTag.style.color = 'transparent';\n return aTag;\n };\n /**\n * @private\n */\n LinkAnnotation.prototype.modifyZindexForTextSelection = function (pageNumber, isAdd) {\n if (this.pdfViewerBase.pageCount > 0) {\n var pageDiv = this.pdfViewerBase.getElement('_pageDiv_' + pageNumber);\n if (pageDiv) {\n var pageChildNodes = pageDiv.childNodes;\n for (var i = 0; i < pageChildNodes.length; i++) {\n var childElement = pageChildNodes[i];\n if (childElement.tagName === 'A') {\n if (isAdd) {\n childElement.classList.add('e-pv-onselection');\n }\n else {\n childElement.classList.remove('e-pv-onselection');\n }\n }\n }\n }\n }\n };\n /**\n * @private\n */\n LinkAnnotation.prototype.modifyZindexForHyperlink = function (element, isAdd) {\n if (isAdd) {\n element.classList.add('e-pv-onselection');\n }\n else {\n element.classList.remove('e-pv-onselection');\n }\n };\n /**\n * @private\n */\n LinkAnnotation.prototype.destroy = function () {\n for (var i = 0; i < this.pdfViewerBase.pageCount - 1; i++) {\n var pageDiv = document.getElementById(this.pdfViewer.element.id + '_pageDiv_' + i);\n if (pageDiv) {\n var aElement = pageDiv.getElementsByTagName('a');\n if (aElement.length !== 0) {\n for (var index = aElement.length - 1; index >= 0; index--) {\n aElement[index].parentNode.removeChild(aElement[index]);\n }\n }\n }\n }\n };\n /**\n * @private\n */\n LinkAnnotation.prototype.getModuleName = function () {\n return 'LinkAnnotation';\n };\n return LinkAnnotation;\n}());\nexport { LinkAnnotation };\n","import { createElement, Browser, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { ColorPicker } from '@syncfusion/ej2-inputs';\n/**\n * The `TextMarkupAnnotation` module is used to handle text markup annotation actions of PDF viewer.\n * @hidden\n */\nvar TextMarkupAnnotation = /** @class */ (function () {\n /**\n * @private\n */\n function TextMarkupAnnotation(pdfViewer, viewerBase) {\n /**\n * @private\n */\n this.currentTextMarkupAddMode = '';\n /**\n * @private\n */\n this.selectTextMarkupCurrentPage = null;\n /**\n * @private\n */\n this.currentTextMarkupAnnotation = null;\n this.currentAnnotationIndex = null;\n this.pdfViewer = pdfViewer;\n this.pdfViewerBase = viewerBase;\n this.highlightColor = pdfViewer.highlightSettings.color;\n this.underlineColor = pdfViewer.underlineSettings.color;\n this.strikethroughColor = pdfViewer.strikethroughSettings.color;\n this.highlightOpacity = pdfViewer.highlightSettings.opacity;\n this.underlineOpacity = pdfViewer.underlineSettings.opacity;\n this.strikethroughOpacity = pdfViewer.strikethroughSettings.opacity;\n }\n /**\n * @private\n */\n // tslint:disable-next-line:max-line-length\n TextMarkupAnnotation.prototype.createAnnotationLayer = function (pageDiv, pageWidth, pageHeight, pageNumber, displayMode) {\n // tslint:disable-next-line:max-line-length\n var annotationCanvas = createElement('canvas', { id: this.pdfViewer.element.id + '_annotationCanvas_' + pageNumber, className: 'e-pv-annotation-canvas' });\n annotationCanvas.width = pageWidth;\n annotationCanvas.height = pageHeight;\n annotationCanvas.style.display = displayMode;\n pageDiv.appendChild(annotationCanvas);\n return annotationCanvas;\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n TextMarkupAnnotation.prototype.renderTextMarkupAnnotationsInPage = function (textMarkupAnnotations, pageNumber) {\n var canvas = this.pdfViewerBase.getElement('_annotationCanvas_' + pageNumber);\n this.renderTextMarkupAnnotations(textMarkupAnnotations, pageNumber, canvas, this.pdfViewerBase.getZoomFactor());\n };\n // tslint:disable-next-line\n TextMarkupAnnotation.prototype.renderTextMarkupAnnotations = function (textMarkupAnnotations, pageNumber, canvas, factor) {\n if (canvas) {\n canvas.width = this.getMagnifiedValue(this.pdfViewerBase.pageSize[pageNumber].width, factor);\n canvas.height = this.getMagnifiedValue(this.pdfViewerBase.pageSize[pageNumber].height, factor);\n var context = canvas.getContext('2d');\n context.setLineDash([]);\n // tslint:disable-next-line\n var annotations = this.getAnnotations(pageNumber, textMarkupAnnotations);\n if (annotations) {\n for (var i = 0; i < annotations.length; i++) {\n // tslint:disable-next-line\n var annotation = annotations[i];\n var annotationObject = null;\n if (annotation.TextMarkupAnnotationType) {\n // tslint:disable-next-line:max-line-length\n annotationObject = { textMarkupAnnotationType: annotation.TextMarkupAnnotationType, color: annotation.Color, opacity: annotation.Opacity, bounds: annotation.Bounds, author: annotation.Author, subject: annotation.Subject, modifiedDate: annotation.ModifiedDate, note: annotation.Note, rect: annotation.Rect };\n this.storeAnnotations(pageNumber, annotationObject);\n }\n // tslint:disable-next-line:max-line-length\n var type = annotation.TextMarkupAnnotationType ? annotation.TextMarkupAnnotationType : annotation.textMarkupAnnotationType;\n // tslint:disable-next-line\n var annotBounds = annotation.Bounds ? annotation.Bounds : annotation.bounds;\n var opacity = annotation.Opacity ? annotation.Opacity : annotation.opacity;\n var color = annotation.Color ? annotation.Color : annotation.color;\n switch (type) {\n case 'Highlight':\n this.renderHighlightAnnotation(annotBounds, opacity, color, context, factor);\n break;\n case 'Strikethrough':\n this.renderStrikeoutAnnotation(annotBounds, opacity, color, context, factor);\n break;\n case 'Underline':\n this.renderUnderlineAnnotation(annotBounds, opacity, color, context, factor);\n break;\n }\n }\n }\n if (pageNumber === this.selectTextMarkupCurrentPage) {\n this.maintainAnnotationSelection();\n }\n }\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.drawTextMarkupAnnotations = function (type) {\n this.isTextMarkupAnnotationMode = true;\n this.currentTextMarkupAddMode = type;\n var selectionObject = this.pdfViewer.textSelectionModule.selectionRangeArray;\n if (selectionObject.length > 0) {\n this.convertSelectionToTextMarkup(type, selectionObject, this.pdfViewerBase.getZoomFactor());\n }\n if (window.getSelection().toString()) {\n var pageBounds = this.getDrawnBounds();\n if (pageBounds.length > 0) {\n for (var i = 0; i < pageBounds.length; i++) {\n // tslint:disable-next-line:max-line-length\n this.drawTextMarkups(type, pageBounds[i].bounds, pageBounds[i].pageIndex, pageBounds[i].rect, this.pdfViewerBase.getZoomFactor());\n }\n }\n }\n // this.pdfViewerBase.annotationHelper.redoCollection = [];\n this.pdfViewer.textSelectionModule.clearTextSelection();\n };\n TextMarkupAnnotation.prototype.convertSelectionToTextMarkup = function (type, selectionObject, factor) {\n for (var i = 0; i < selectionObject.length; i++) {\n this.drawTextMarkups(type, selectionObject[i].rectangleBounds, selectionObject[i].pageNumber, selectionObject[i].bound, factor);\n }\n };\n // tslint:disable-next-line\n TextMarkupAnnotation.prototype.drawTextMarkups = function (type, bounds, pageNumber, rect, factor) {\n var annotation = null;\n var context = this.getPageContext(pageNumber);\n if (context) {\n context.setLineDash([]);\n switch (type) {\n case 'Highlight':\n // tslint:disable-next-line:max-line-length\n annotation = this.getAddedAnnotation(type, this.highlightColor, this.highlightOpacity, bounds, this.pdfViewer.highlightSettings.author, this.pdfViewer.highlightSettings.subject, this.pdfViewer.highlightSettings.modifiedDate, '', rect, pageNumber);\n this.renderHighlightAnnotation(annotation.bounds, annotation.opacity, annotation.color, context, factor);\n break;\n case 'Strikethrough':\n // tslint:disable-next-line:max-line-length\n annotation = this.getAddedAnnotation(type, this.strikethroughColor, this.strikethroughOpacity, bounds, this.pdfViewer.strikethroughSettings.author, this.pdfViewer.strikethroughSettings.subject, this.pdfViewer.strikethroughSettings.modifiedDate, '', rect, pageNumber);\n this.renderStrikeoutAnnotation(annotation.bounds, annotation.opacity, annotation.color, context, factor);\n break;\n case 'Underline':\n // tslint:disable-next-line:max-line-length\n annotation = this.getAddedAnnotation(type, this.underlineColor, this.underlineOpacity, bounds, this.pdfViewer.underlineSettings.author, this.pdfViewer.underlineSettings.subject, this.pdfViewer.underlineSettings.modifiedDate, '', rect, pageNumber);\n this.renderUnderlineAnnotation(annotation.bounds, annotation.opacity, annotation.color, context, factor);\n break;\n }\n this.pdfViewerBase.isDocumentEdited = true;\n // tslint:disable-next-line\n var settings = { opacity: annotation.opacity, color: annotation.color, author: annotation.author, subject: annotation.subject, modifiedDate: annotation.modifiedDate };\n var index = this.pdfViewer.annotationModule.actionCollection[this.pdfViewer.annotationModule.actionCollection.length - 1].index;\n this.pdfViewer.fireAnnotationAdd(pageNumber, index, type, annotation.rect, settings);\n }\n };\n // tslint:disable-next-line\n TextMarkupAnnotation.prototype.renderHighlightAnnotation = function (bounds, opacity, color, context, factor) {\n for (var i = 0; i < bounds.length; i++) {\n // tslint:disable-next-line\n var bound = bounds[i];\n context.beginPath();\n var x = bound.X ? bound.X : bound.left;\n var y = bound.Y ? bound.Y : bound.top;\n var width = bound.Width ? bound.Width : bound.width;\n var height = bound.Height ? bound.Height : bound.height;\n // tslint:disable-next-line:max-line-length\n context.rect((x * factor), (y * factor), (width * factor), (height * factor));\n context.globalAlpha = opacity * 0.5;\n context.closePath();\n context.fillStyle = color;\n context.msFillRule = 'nonzero';\n context.fill();\n }\n context.save();\n };\n // tslint:disable-next-line\n TextMarkupAnnotation.prototype.renderStrikeoutAnnotation = function (bounds, opacity, color, context, factor) {\n for (var i = 0; i < bounds.length; i++) {\n // tslint:disable-next-line\n var bound = this.getProperBounds(bounds[i]);\n this.drawLine(opacity, bound.x, bound.y, bound.width, (bound.height / 2), color, factor, context);\n }\n };\n // tslint:disable-next-line\n TextMarkupAnnotation.prototype.renderUnderlineAnnotation = function (bounds, opacity, color, context, factor) {\n for (var i = 0; i < bounds.length; i++) {\n // tslint:disable-next-line\n var boundValues = this.getProperBounds(bounds[i]);\n this.drawLine(opacity, boundValues.x, boundValues.y, boundValues.width, boundValues.height, color, factor, context);\n }\n };\n // tslint:disable-next-line\n TextMarkupAnnotation.prototype.getProperBounds = function (bound) {\n var x = bound.X ? bound.X : bound.left;\n var y = bound.Y ? bound.Y : bound.top;\n var width = bound.Width ? bound.Width : bound.width;\n var height = bound.Height ? bound.Height : bound.height;\n return { x: x, y: y, width: width, height: height };\n };\n // tslint:disable-next-line:max-line-length\n TextMarkupAnnotation.prototype.drawLine = function (opacity, x, y, width, height, color, factor, context) {\n context.globalAlpha = opacity;\n context.beginPath();\n context.moveTo((x * factor), (y + height) * factor);\n context.lineTo((width + x) * factor, (y + height) * factor);\n context.lineWidth = 1;\n context.strokeStyle = color;\n context.closePath();\n context.msFillRule = 'nonzero';\n context.stroke();\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n TextMarkupAnnotation.prototype.printTextMarkupAnnotations = function (textMarkupAnnotations, pageIndex) {\n var canvas = createElement('canvas', { id: this.pdfViewer.element.id + '_print_annotation_layer_' + pageIndex });\n // tslint:disable-next-line\n var annotations = this.getAnnotations(pageIndex, null);\n if (annotations) {\n this.renderTextMarkupAnnotations(null, pageIndex, canvas, 1);\n }\n else {\n this.renderTextMarkupAnnotations(textMarkupAnnotations, pageIndex, canvas, 1);\n }\n var imageSource = canvas.toDataURL();\n return imageSource;\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.saveTextMarkupAnnotations = function () {\n // tslint:disable-next-line\n var storeObject = window.sessionStorage.getItem(this.pdfViewerBase.documentId + '_annotations_textMarkup');\n // tslint:disable-next-line\n var annotations = new Array();\n var colorpick = new ColorPicker();\n for (var j = 0; j < this.pdfViewerBase.pageCount; j++) {\n annotations[j] = [];\n }\n if (storeObject) {\n var annotationCollection = JSON.parse(storeObject);\n for (var i = 0; i < annotationCollection.length; i++) {\n var newArray = [];\n var pageAnnotationObject = annotationCollection[i];\n if (pageAnnotationObject) {\n for (var z = 0; pageAnnotationObject.annotations.length > z; z++) {\n // tslint:disable-next-line:max-line-length\n pageAnnotationObject.annotations[z].bounds = JSON.stringify(this.getBoundsForSave(pageAnnotationObject.annotations[z].bounds));\n var colorString = colorpick.getValue(pageAnnotationObject.annotations[z].color, 'rgba');\n pageAnnotationObject.annotations[z].color = JSON.stringify(this.getRgbCode(colorString));\n pageAnnotationObject.annotations[z].rect = JSON.stringify(pageAnnotationObject.annotations[z].rect);\n }\n newArray = pageAnnotationObject.annotations;\n }\n annotations[pageAnnotationObject.pageIndex] = newArray;\n }\n }\n return JSON.stringify(annotations);\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.deleteTextMarkupAnnotation = function () {\n if (this.currentTextMarkupAnnotation) {\n var pageAnnotations = this.getAnnotations(this.selectTextMarkupCurrentPage, null);\n var deletedAnnotation = null;\n for (var i = 0; i < pageAnnotations.length; i++) {\n if (JSON.stringify(this.currentTextMarkupAnnotation) === JSON.stringify(pageAnnotations[i])) {\n deletedAnnotation = pageAnnotations.splice(i, 1)[0];\n // tslint:disable-next-line:max-line-length\n this.pdfViewer.annotationModule.addAction(this.selectTextMarkupCurrentPage, i, deletedAnnotation, 'Text Markup Deleted', null);\n this.currentAnnotationIndex = i;\n }\n }\n this.manageAnnotations(pageAnnotations, this.selectTextMarkupCurrentPage);\n this.currentTextMarkupAnnotation = null;\n this.renderTextMarkupAnnotationsInPage(null, this.selectTextMarkupCurrentPage);\n this.pdfViewerBase.isDocumentEdited = true;\n // tslint:disable-next-line:max-line-length\n this.pdfViewer.fireAnnotationRemove(this.selectTextMarkupCurrentPage, this.currentAnnotationIndex, deletedAnnotation.textMarkupAnnotationType);\n this.currentAnnotationIndex = null;\n this.selectTextMarkupCurrentPage = null;\n if (Browser.isDevice) {\n // tslint:disable-next-line:max-line-length\n this.pdfViewer.toolbarModule.annotationToolbarModule.hideMobileAnnotationToolbar();\n this.pdfViewer.toolbarModule.showToolbar(true);\n }\n }\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.modifyColorProperty = function (color) {\n if (this.currentTextMarkupAnnotation) {\n var pageAnnotations = this.modifyAnnotationProperty('Color', color, null);\n this.manageAnnotations(pageAnnotations, this.selectTextMarkupCurrentPage);\n this.renderTextMarkupAnnotationsInPage(null, this.selectTextMarkupCurrentPage);\n this.pdfViewerBase.isDocumentEdited = true;\n // tslint:disable-next-line:max-line-length\n this.pdfViewer.fireAnnotationPropertiesChange(this.selectTextMarkupCurrentPage, this.currentAnnotationIndex, this.currentTextMarkupAnnotation.textMarkupAnnotationType, true, false);\n this.currentAnnotationIndex = null;\n }\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.modifyOpacityProperty = function (args) {\n if (this.currentTextMarkupAnnotation) {\n var pageAnnotations = this.modifyAnnotationProperty('Opacity', args.value / 100, args.name);\n this.manageAnnotations(pageAnnotations, this.selectTextMarkupCurrentPage);\n this.renderTextMarkupAnnotationsInPage(null, this.selectTextMarkupCurrentPage);\n if (args.name === 'changed') {\n this.pdfViewerBase.isDocumentEdited = true;\n // tslint:disable-next-line:max-line-length\n this.pdfViewer.fireAnnotationPropertiesChange(this.selectTextMarkupCurrentPage, this.currentAnnotationIndex, this.currentTextMarkupAnnotation.textMarkupAnnotationType, false, true);\n this.currentAnnotationIndex = null;\n }\n }\n };\n // tslint:disable-next-line\n TextMarkupAnnotation.prototype.modifyAnnotationProperty = function (property, value, status) {\n var pageAnnotations = this.getAnnotations(this.selectTextMarkupCurrentPage, null);\n for (var i = 0; i < pageAnnotations.length; i++) {\n if (JSON.stringify(this.currentTextMarkupAnnotation) === JSON.stringify(pageAnnotations[i])) {\n if (property === 'Color') {\n pageAnnotations[i].color = value;\n }\n else if (property === 'Opacity') {\n pageAnnotations[i].opacity = value;\n }\n var date = new Date();\n pageAnnotations[i].modifiedDate = date.toLocaleString();\n this.currentAnnotationIndex = i;\n if (status === null || status === 'changed') {\n // tslint:disable-next-line:max-line-length\n this.pdfViewer.annotationModule.addAction(this.selectTextMarkupCurrentPage, i, this.currentTextMarkupAnnotation, 'Text Markup Property modified', property);\n }\n this.currentTextMarkupAnnotation = pageAnnotations[i];\n }\n }\n return pageAnnotations;\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.undoTextMarkupAction = function (annotation, pageNumber, index, action) {\n var pageAnnotations = this.getAnnotations(pageNumber, null);\n if (pageAnnotations) {\n if (action === 'Text Markup Added') {\n pageAnnotations.splice(index, 1);\n }\n else if (action === 'Text Markup Deleted') {\n pageAnnotations.splice(index, 0, annotation);\n }\n }\n this.clearCurrentAnnotation();\n this.pdfViewerBase.isDocumentEdited = true;\n this.manageAnnotations(pageAnnotations, pageNumber);\n this.renderTextMarkupAnnotationsInPage(null, pageNumber);\n };\n /**\n * @private\n */\n // tslint:disable-next-line:max-line-length\n TextMarkupAnnotation.prototype.undoRedoPropertyChange = function (annotation, pageNumber, index, property) {\n var pageAnnotations = this.getAnnotations(pageNumber, null);\n if (pageAnnotations) {\n if (property === 'Color') {\n var tempColor = pageAnnotations[index].color;\n pageAnnotations[index].color = annotation.color;\n annotation.color = tempColor;\n }\n else {\n var tempOpacity = pageAnnotations[index].opacity;\n pageAnnotations[index].opacity = annotation.opacity;\n annotation.opacity = tempOpacity;\n }\n }\n this.clearCurrentAnnotation();\n this.pdfViewerBase.isDocumentEdited = true;\n this.manageAnnotations(pageAnnotations, pageNumber);\n this.renderTextMarkupAnnotationsInPage(null, pageNumber);\n return annotation;\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.redoTextMarkupAction = function (annotation, pageNumber, index, action) {\n var pageAnnotations = this.getAnnotations(pageNumber, null);\n if (pageAnnotations) {\n if (action === 'Text Markup Added') {\n pageAnnotations.push(annotation);\n }\n else if (action === 'Text Markup Deleted') {\n pageAnnotations.splice(index, 1);\n }\n }\n this.clearCurrentAnnotation();\n this.pdfViewerBase.isDocumentEdited = true;\n this.manageAnnotations(pageAnnotations, pageNumber);\n this.renderTextMarkupAnnotationsInPage(null, pageNumber);\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.saveNoteContent = function (pageNumber, note) {\n var pageAnnotations = this.getAnnotations(pageNumber, null);\n if (pageAnnotations) {\n for (var i = 0; i < pageAnnotations.length; i++) {\n if (JSON.stringify(this.currentTextMarkupAnnotation) === JSON.stringify(pageAnnotations[i])) {\n pageAnnotations[i].note = note;\n }\n }\n }\n this.manageAnnotations(pageAnnotations, pageNumber);\n this.pdfViewerBase.isDocumentEdited = true;\n };\n TextMarkupAnnotation.prototype.clearCurrentAnnotation = function () {\n this.selectTextMarkupCurrentPage = null;\n this.currentTextMarkupAnnotation = null;\n this.enableAnnotationPropertiesTool(false);\n };\n TextMarkupAnnotation.prototype.clearCurrentAnnotationSelection = function (pageNumber) {\n var lowerPageIndex = (pageNumber - 2) >= 0 ? (pageNumber - 2) : 0;\n // tslint:disable-next-line:max-line-length\n var higherPageIndex = (pageNumber + 2) < this.pdfViewerBase.pageCount ? (pageNumber + 2) : this.pdfViewerBase.pageCount - 1;\n for (var k = lowerPageIndex; k <= higherPageIndex; k++) {\n this.clearAnnotationSelection(k);\n }\n };\n // tslint:disable-next-line\n TextMarkupAnnotation.prototype.getBoundsForSave = function (bounds) {\n // tslint:disable-next-line\n var newArray = [];\n for (var i = 0; i < bounds.length; i++) {\n var left = bounds[i].left ? bounds[i].left : bounds[i].Left;\n var top_1 = bounds[i].top ? bounds[i].top : bounds[i].Top;\n var height = bounds[i].height ? bounds[i].height : bounds[i].Height;\n var width = bounds[i].width ? bounds[i].width : bounds[i].Width;\n newArray.push({ left: left, top: top_1, width: width, height: height });\n }\n return newArray;\n };\n // tslint:disable-next-line\n TextMarkupAnnotation.prototype.getRgbCode = function (colorString) {\n var stringArray = colorString.split(',');\n // tslint:disable-next-line:radix\n var r = parseInt(stringArray[0].split('(')[1]);\n // tslint:disable-next-line:radix\n var g = parseInt(stringArray[1]);\n // tslint:disable-next-line:radix\n var b = parseInt(stringArray[2]);\n return { r: r, g: g, b: b };\n };\n TextMarkupAnnotation.prototype.getDrawnBounds = function () {\n var pageBounds = [];\n var selection = window.getSelection();\n if (selection.anchorNode !== null) {\n var range = document.createRange();\n var isBackWardSelection = this.pdfViewerBase.textLayer.isBackWardSelection(selection);\n if (selection.anchorNode === selection.focusNode) {\n var pageId = this.pdfViewerBase.textLayer.getPageIndex(selection.anchorNode);\n if (!isNaN(pageId)) {\n var pageRect = this.pdfViewerBase.getElement('_pageDiv_' + pageId).getBoundingClientRect();\n if (isBackWardSelection) {\n range.setStart(selection.focusNode, selection.focusOffset);\n range.setEnd(selection.anchorNode, selection.anchorOffset);\n }\n else {\n if (selection.anchorOffset < selection.focusOffset) {\n range.setStart(selection.anchorNode, selection.anchorOffset);\n range.setEnd(selection.focusNode, selection.focusOffset);\n }\n else {\n range.setStart(selection.focusNode, selection.focusOffset);\n range.setEnd(selection.anchorNode, selection.anchorOffset);\n }\n }\n var boundingRect = range.getBoundingClientRect();\n // tslint:disable-next-line:max-line-length\n var rectangle = { left: this.getDefaultValue(boundingRect.left - pageRect.left), top: this.getDefaultValue(boundingRect.top - pageRect.top), width: this.getDefaultValue(boundingRect.width), height: this.getDefaultValue(boundingRect.height), right: this.getDefaultValue(boundingRect.right - pageRect.left), bottom: this.getDefaultValue(boundingRect.bottom - pageRect.top) };\n var rectangleArray = [];\n rectangleArray.push(rectangle);\n // tslint:disable-next-line\n var rect = { left: rectangle.left, top: rectangle.top, right: rectangle.right, bottom: rectangle.bottom };\n pageBounds.push({ pageIndex: pageId, bounds: rectangleArray, rect: rect });\n }\n }\n else {\n var startNode = void 0;\n var endNode = void 0;\n var selectionStartOffset = void 0;\n var selectionEndOffset = void 0;\n if (isBackWardSelection) {\n startNode = selection.focusNode;\n selectionStartOffset = selection.focusOffset;\n endNode = selection.anchorNode;\n selectionEndOffset = selection.anchorOffset;\n }\n else {\n startNode = selection.anchorNode;\n selectionStartOffset = selection.anchorOffset;\n endNode = selection.focusNode;\n selectionEndOffset = selection.focusOffset;\n }\n var anchorPageId = this.pdfViewerBase.textLayer.getPageIndex(startNode);\n var anchorTextId = this.pdfViewerBase.textLayer.getTextIndex(startNode, anchorPageId);\n var focusPageId = this.pdfViewerBase.textLayer.getPageIndex(endNode);\n var focusTextId = this.pdfViewerBase.textLayer.getTextIndex(endNode, focusPageId);\n var startOffset = 0;\n var endOffset = 0;\n var currentId = 0;\n for (var i = anchorPageId; i <= focusPageId; i++) {\n var selectionRects = [];\n var pageStartId = void 0;\n var pageEndId = void 0;\n var pageStartOffset = void 0;\n var pageEndOffset = void 0;\n var textDivs = this.pdfViewerBase.getElement('_textLayer_' + i).childNodes;\n var pageRect = this.pdfViewerBase.getElement('_pageDiv_' + i).getBoundingClientRect();\n if (i === anchorPageId) {\n currentId = anchorTextId;\n }\n else {\n currentId = 0;\n }\n for (var j = currentId; j < textDivs.length; j++) {\n var textElement = textDivs[j];\n if (j === currentId) {\n pageStartId = currentId;\n pageStartOffset = (i === anchorPageId) ? selectionStartOffset : 0;\n }\n else {\n pageEndId = j;\n pageEndOffset = (i === focusPageId) ? selectionEndOffset : textElement.textContent.length;\n }\n if (j === anchorTextId && i === anchorPageId) {\n startOffset = selectionStartOffset;\n }\n else {\n startOffset = 0;\n }\n if (j === focusTextId && i === focusPageId) {\n endOffset = selectionEndOffset;\n }\n else {\n endOffset = textElement.textContent.length;\n }\n for (var k = 0; k < textElement.childNodes.length; k++) {\n var node = textElement.childNodes[k];\n range.setStart(node, startOffset);\n range.setEnd(node, endOffset);\n }\n var boundingRect = range.getBoundingClientRect();\n // tslint:disable-next-line:max-line-length\n var rectangle = { left: this.getDefaultValue(boundingRect.left - pageRect.left), top: this.getDefaultValue(boundingRect.top - pageRect.top), width: this.getDefaultValue(boundingRect.width), height: this.getDefaultValue(boundingRect.height), right: this.getDefaultValue(boundingRect.right - pageRect.left), bottom: this.getDefaultValue(boundingRect.bottom - pageRect.top) };\n selectionRects.push(rectangle);\n range.detach();\n if (i === focusPageId && j === focusTextId) {\n break;\n }\n }\n var startElementNode = this.pdfViewerBase.getElement('_text_' + i + '_' + pageStartId).childNodes[0];\n var endElementNode = this.pdfViewerBase.getElement('_text_' + i + '_' + pageEndId).childNodes[0];\n var pageRange = document.createRange();\n pageRange.setStart(startElementNode, pageStartOffset);\n pageRange.setEnd(endElementNode, pageEndOffset);\n var pageRectBounds = pageRange.getBoundingClientRect();\n // tslint:disable-next-line:max-line-length\n var pageRectangle = { left: this.getDefaultValue(pageRectBounds.left - pageRect.left), top: this.getDefaultValue(pageRectBounds.top - pageRect.top), width: this.getDefaultValue(pageRectBounds.width), height: this.getDefaultValue(pageRectBounds.height), right: this.getDefaultValue(pageRectBounds.right - pageRect.left), bottom: this.getDefaultValue(pageRectBounds.bottom - pageRect.top) };\n // tslint:disable-next-line\n var rect = { left: pageRectangle.left, top: pageRectangle.top, right: pageRectangle.right, bottom: pageRectangle.bottom };\n pageBounds.push({ pageIndex: i, bounds: selectionRects, rect: rect });\n }\n }\n }\n selection.removeAllRanges();\n return pageBounds;\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.rerenderAnnotationsPinch = function (pageNumber) {\n var annotCanvas = this.pdfViewerBase.getElement('_annotationCanvas_' + pageNumber);\n if (annotCanvas) {\n var oldAnnotCanvas = this.pdfViewerBase.getElement('_old_annotationCanvas_' + pageNumber);\n if (oldAnnotCanvas) {\n if (annotCanvas) {\n oldAnnotCanvas.id = annotCanvas.id;\n annotCanvas.parentElement.removeChild(annotCanvas);\n }\n else {\n oldAnnotCanvas.id = this.pdfViewer.element.id + '_annotationCanvas_' + pageNumber;\n }\n annotCanvas = oldAnnotCanvas;\n }\n annotCanvas.style.width = '';\n annotCanvas.style.height = '';\n annotCanvas.width = this.pdfViewerBase.pageSize[pageNumber].width * this.pdfViewerBase.getZoomFactor();\n annotCanvas.height = this.pdfViewerBase.pageSize[pageNumber].height * this.pdfViewerBase.getZoomFactor();\n this.renderTextMarkupAnnotations(null, pageNumber, annotCanvas, this.pdfViewerBase.getZoomFactor());\n }\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.rerenderAnnotations = function (pageNumber) {\n var oldCanvas = this.pdfViewerBase.getElement('_old_annotationCanvas_' + pageNumber);\n if (oldCanvas) {\n oldCanvas.parentElement.removeChild(oldCanvas);\n }\n var newCanvas = this.pdfViewerBase.getElement('_annotationCanvas_' + pageNumber);\n if (newCanvas) {\n newCanvas.style.display = 'block';\n }\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.resizeAnnotations = function (width, height, pageNumber) {\n var canvas = this.pdfViewerBase.getElement('_annotationCanvas_' + pageNumber);\n if (canvas) {\n canvas.style.width = width + 'px';\n canvas.style.height = height + 'px';\n }\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.onTextMarkupAnnotationMouseUp = function (event) {\n var pageNumber = this.pdfViewer.annotationModule.getEventPageNumber(event);\n if (!isNullOrUndefined(pageNumber) && !isNaN(pageNumber)) {\n var canvas = this.pdfViewerBase.getElement('_annotationCanvas_' + pageNumber);\n var currentAnnot = this.getCurrentMarkupAnnotation(event.clientX, event.clientY, pageNumber, canvas);\n if (currentAnnot) {\n this.selectAnnotation(currentAnnot, canvas);\n this.currentTextMarkupAnnotation = currentAnnot;\n this.selectTextMarkupCurrentPage = pageNumber;\n this.enableAnnotationPropertiesTool(true);\n if (this.pdfViewer.toolbarModule) {\n this.pdfViewer.toolbarModule.annotationToolbarModule.isToolbarHidden = true;\n this.pdfViewer.toolbarModule.annotationToolbarModule.showAnnotationToolbar(this.pdfViewer.toolbarModule.annotationItem);\n }\n }\n else {\n this.clearCurrentAnnotation();\n }\n this.clearCurrentAnnotationSelection(pageNumber);\n }\n else {\n if (!this.pdfViewerBase.isClickedOnScrollBar(event)) {\n this.clearCurrentAnnotation();\n this.clearCurrentAnnotationSelection(pageNumber);\n }\n }\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.onTextMarkupAnnotationTouchEnd = function (event) {\n var pageNumber = this.pdfViewer.annotationModule.getEventPageNumber(event);\n if (!isNullOrUndefined(pageNumber) && !isNaN(pageNumber)) {\n this.clearCurrentAnnotationSelection(pageNumber);\n var touchCanvas = this.pdfViewerBase.getElement('_annotationCanvas_' + pageNumber);\n // tslint:disable-next-line:max-line-length\n var currentAnnot = this.getCurrentMarkupAnnotation(event.touches[0].clientX, event.touches[0].clientY, pageNumber, touchCanvas);\n if (currentAnnot) {\n this.selectAnnotation(currentAnnot, touchCanvas);\n this.currentTextMarkupAnnotation = currentAnnot;\n this.selectTextMarkupCurrentPage = pageNumber;\n this.enableAnnotationPropertiesTool(true);\n }\n else {\n this.clearCurrentAnnotation();\n }\n this.clearCurrentAnnotationSelection(pageNumber);\n }\n else if (this.selectTextMarkupCurrentPage != null && Browser.isDevice) {\n var number = this.selectTextMarkupCurrentPage;\n this.selectTextMarkupCurrentPage = null;\n this.clearAnnotationSelection(number);\n }\n else {\n this.clearCurrentAnnotation();\n this.clearCurrentAnnotationSelection(pageNumber);\n }\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.onTextMarkupAnnotationMouseMove = function (event) {\n var eventTarget = event.target;\n // tslint:disable-next-line\n var pageIndex = parseInt(eventTarget.id.split('_text_')[1]) || parseInt(eventTarget.id.split('_textLayer_')[1]) || parseInt(eventTarget.id.split('_annotationCanvas_')[1]);\n if (pageIndex) {\n var canvas = this.pdfViewerBase.getElement('_annotationCanvas_' + pageIndex);\n var currentAnnot = this.getCurrentMarkupAnnotation(event.clientX, event.clientY, pageIndex, canvas);\n if (currentAnnot) {\n eventTarget.style.cursor = 'pointer';\n // this.showPopupNote(event, currentAnnot);\n }\n else {\n this.pdfViewer.annotationModule.hidePopupNote();\n if (this.pdfViewerBase.isPanMode && !this.pdfViewerBase.getAnnotationToolStatus()) {\n eventTarget.style.cursor = 'grab';\n }\n else {\n eventTarget.style.cursor = 'auto';\n }\n }\n }\n };\n // tslint:disable-next-line\n TextMarkupAnnotation.prototype.showPopupNote = function (event, annotation) {\n if (annotation.note) {\n // tslint:disable-next-line:max-line-length\n this.pdfViewer.annotationModule.showPopupNote(event, annotation.color, annotation.author, annotation.note, annotation.textMarkupAnnotationType);\n }\n };\n TextMarkupAnnotation.prototype.getCurrentMarkupAnnotation = function (clientX, clientY, pageNumber, canvas) {\n var currentTextMarkupAnnotations = [];\n var canvasParentPosition = canvas.parentElement.getBoundingClientRect();\n var leftClickPosition = clientX - canvasParentPosition.left;\n var topClickPosition = clientY - canvasParentPosition.top;\n var annotationList = this.getAnnotations(pageNumber, null);\n var isAnnotationGot = false;\n if (annotationList) {\n for (var i = 0; i < annotationList.length; i++) {\n var annotation = annotationList[i];\n for (var j = 0; j < annotation.bounds.length; j++) {\n // tslint:disable-next-line\n var bound = annotation.bounds[j];\n var left = bound.left ? bound.left : bound.Left;\n var top_2 = bound.top ? bound.top : bound.Top;\n var width = bound.width ? bound.width : bound.Width;\n var height = bound.height ? bound.height : bound.Height;\n // tslint:disable-next-line:max-line-length\n if (leftClickPosition >= this.getMagnifiedValue(left, this.pdfViewerBase.getZoomFactor()) && leftClickPosition <= this.getMagnifiedValue(left + width, this.pdfViewerBase.getZoomFactor()) && topClickPosition >= this.getMagnifiedValue(top_2, this.pdfViewerBase.getZoomFactor()) && topClickPosition <= this.getMagnifiedValue(top_2 + height, this.pdfViewerBase.getZoomFactor())) {\n currentTextMarkupAnnotations.push(annotation);\n isAnnotationGot = true;\n }\n else {\n if (isAnnotationGot) {\n isAnnotationGot = false;\n break;\n }\n }\n }\n }\n }\n var currentAnnot = null;\n if (currentTextMarkupAnnotations.length > 1) {\n currentAnnot = this.compareCurrentAnnotations(currentTextMarkupAnnotations);\n }\n else if (currentTextMarkupAnnotations.length === 1) {\n currentAnnot = currentTextMarkupAnnotations[0];\n }\n return currentAnnot;\n };\n TextMarkupAnnotation.prototype.compareCurrentAnnotations = function (annotations) {\n var previousX;\n var currentAnnotation = null;\n for (var i = 0; i < annotations.length; i++) {\n if (i === annotations.length - 1) {\n break;\n }\n // tslint:disable-next-line\n var firstAnnotBounds = annotations[i].bounds;\n var firstXposition = firstAnnotBounds[0].left ? firstAnnotBounds[0].left : firstAnnotBounds[0].Left;\n var firstYposition = firstAnnotBounds[0].top ? firstAnnotBounds[0].top : firstAnnotBounds[0].Top;\n // tslint:disable-next-line\n var secondAnnotBounds = annotations[i + 1].bounds;\n var secondXposition = secondAnnotBounds[0].left ? secondAnnotBounds[0].left : secondAnnotBounds[0].Left;\n var secondYposition = secondAnnotBounds[0].top ? secondAnnotBounds[0].top : secondAnnotBounds[0].Top;\n if ((firstXposition < secondXposition) || (firstYposition < secondYposition)) {\n previousX = secondXposition;\n currentAnnotation = annotations[i + 1];\n }\n else {\n previousX = firstXposition;\n currentAnnotation = annotations[i];\n }\n if (previousX && (i === (annotations.length - 2))) {\n if ((previousX === firstXposition) && (previousX === secondXposition)) {\n previousX = secondXposition;\n currentAnnotation = annotations[i + 1];\n }\n }\n }\n return currentAnnotation;\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.clearAnnotationSelection = function (pageNumber) {\n var canvas = this.pdfViewerBase.getElement('_annotationCanvas_' + pageNumber);\n if (canvas) {\n var context = canvas.getContext('2d');\n context.setLineDash([]);\n this.renderTextMarkupAnnotationsInPage(null, pageNumber);\n }\n };\n TextMarkupAnnotation.prototype.selectAnnotation = function (annotation, canvas) {\n for (var i = 0; i < annotation.bounds.length; i++) {\n // tslint:disable-next-line\n var bound = annotation.bounds[i];\n var x = bound.left ? bound.left : bound.Left;\n var y = bound.top ? bound.top : bound.Top;\n var width = bound.width ? bound.width : bound.Width;\n var height = bound.height ? bound.height : bound.Height;\n // tslint:disable-next-line:max-line-length\n this.drawAnnotationSelectRect(canvas, this.getMagnifiedValue(x - 0.5, this.pdfViewerBase.getZoomFactor()), this.getMagnifiedValue(y - 0.5, this.pdfViewerBase.getZoomFactor()), this.getMagnifiedValue(width + 0.5, this.pdfViewerBase.getZoomFactor()), this.getMagnifiedValue(height + 0.5, this.pdfViewerBase.getZoomFactor()));\n }\n };\n TextMarkupAnnotation.prototype.drawAnnotationSelectRect = function (canvas, x, y, width, height) {\n var context = canvas.getContext('2d');\n context.beginPath();\n context.setLineDash([4 * this.pdfViewerBase.getZoomFactor()]);\n context.globalAlpha = 1;\n context.rect(x, y, width, height);\n context.closePath();\n context.strokeStyle = '#0000ff';\n context.stroke();\n context.save();\n };\n TextMarkupAnnotation.prototype.enableAnnotationPropertiesTool = function (isEnable) {\n // tslint:disable-next-line:max-line-length\n if (this.pdfViewer.toolbarModule && this.pdfViewer.toolbarModule.annotationToolbarModule) {\n this.pdfViewer.toolbarModule.annotationToolbarModule.createMobileAnnotationToolbar(isEnable);\n }\n // tslint:disable-next-line:max-line-length\n if (this.pdfViewer.toolbarModule && this.pdfViewer.toolbarModule.annotationToolbarModule && this.pdfViewer.toolbarModule.annotationToolbarModule.isMobileAnnotEnabled) {\n if (this.pdfViewer.toolbarModule.annotationToolbarModule) {\n this.pdfViewer.toolbarModule.annotationToolbarModule.selectAnnotationDeleteItem(isEnable);\n var enable = isEnable;\n if (this.isTextMarkupAnnotationMode) {\n enable = true;\n }\n this.pdfViewer.toolbarModule.annotationToolbarModule.enableAnnotationPropertiesTools(enable);\n if (this.currentTextMarkupAnnotation) {\n // tslint:disable-next-line:max-line-length\n this.pdfViewer.toolbarModule.annotationToolbarModule.updateColorInIcon(this.pdfViewer.toolbarModule.annotationToolbarModule.colorDropDownElement, this.currentTextMarkupAnnotation.color);\n }\n else {\n if (!this.isTextMarkupAnnotationMode) {\n // tslint:disable-next-line:max-line-length\n this.pdfViewer.toolbarModule.annotationToolbarModule.updateColorInIcon(this.pdfViewer.toolbarModule.annotationToolbarModule.colorDropDownElement, '#000000');\n }\n else {\n this.pdfViewer.toolbarModule.annotationToolbarModule.setCurrentColorInPicker();\n }\n }\n }\n }\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.maintainAnnotationSelection = function () {\n if (this.currentTextMarkupAnnotation) {\n var canvas = this.pdfViewerBase.getElement('_annotationCanvas_' + this.selectTextMarkupCurrentPage);\n if (canvas) {\n this.selectAnnotation(this.currentTextMarkupAnnotation, canvas);\n }\n }\n };\n TextMarkupAnnotation.prototype.storeAnnotations = function (pageNumber, annotation) {\n // tslint:disable-next-line\n var storeObject = window.sessionStorage.getItem(this.pdfViewerBase.documentId + '_annotations_textMarkup');\n var index = 0;\n if (!storeObject) {\n var markupAnnotation = { pageIndex: pageNumber, annotations: [] };\n markupAnnotation.annotations.push(annotation);\n index = markupAnnotation.annotations.indexOf(annotation);\n var annotationCollection = [];\n annotationCollection.push(markupAnnotation);\n var annotationStringified = JSON.stringify(annotationCollection);\n window.sessionStorage.setItem(this.pdfViewerBase.documentId + '_annotations_textMarkup', annotationStringified);\n }\n else {\n var annotObject = JSON.parse(storeObject);\n window.sessionStorage.removeItem(this.pdfViewerBase.documentId + '_annotations_textMarkup');\n var pageIndex = this.getPageCollection(annotObject, pageNumber);\n if (annotObject[pageIndex]) {\n annotObject[pageIndex].annotations.push(annotation);\n index = annotObject[pageIndex].annotations.indexOf(annotation);\n }\n else {\n var markupAnnotation = { pageIndex: pageNumber, annotations: [] };\n markupAnnotation.annotations.push(annotation);\n index = markupAnnotation.annotations.indexOf(annotation);\n annotObject.push(markupAnnotation);\n }\n var annotationStringified = JSON.stringify(annotObject);\n window.sessionStorage.setItem(this.pdfViewerBase.documentId + '_annotations_textMarkup', annotationStringified);\n }\n return index;\n };\n TextMarkupAnnotation.prototype.manageAnnotations = function (pageAnnotations, pageNumber) {\n // tslint:disable-next-line\n var storeObject = window.sessionStorage.getItem(this.pdfViewerBase.documentId + '_annotations_textMarkup');\n if (storeObject) {\n var annotObject = JSON.parse(storeObject);\n window.sessionStorage.removeItem(this.pdfViewerBase.documentId + '_annotations_textMarkup');\n var index = this.getPageCollection(annotObject, pageNumber);\n if (annotObject[index]) {\n annotObject[index].annotations = pageAnnotations;\n }\n var annotationStringified = JSON.stringify(annotObject);\n window.sessionStorage.setItem(this.pdfViewerBase.documentId + '_annotations_textMarkup', annotationStringified);\n }\n };\n // tslint:disable-next-line\n TextMarkupAnnotation.prototype.getAnnotations = function (pageIndex, textMarkupAnnotations) {\n // tslint:disable-next-line\n var annotationCollection;\n // tslint:disable-next-line\n var storeObject = window.sessionStorage.getItem(this.pdfViewerBase.documentId + '_annotations_textMarkup');\n if (storeObject) {\n var annotObject = JSON.parse(storeObject);\n var index = this.getPageCollection(annotObject, pageIndex);\n if (annotObject[index]) {\n annotationCollection = annotObject[index].annotations;\n }\n else {\n annotationCollection = textMarkupAnnotations;\n }\n }\n else {\n annotationCollection = textMarkupAnnotations;\n }\n return annotationCollection;\n };\n TextMarkupAnnotation.prototype.getPageCollection = function (pageAnnotations, pageNumber) {\n var index = null;\n for (var i = 0; i < pageAnnotations.length; i++) {\n if (pageAnnotations[i].pageIndex === pageNumber) {\n index = i;\n break;\n }\n }\n return index;\n };\n // tslint:disable-next-line\n TextMarkupAnnotation.prototype.getAddedAnnotation = function (type, color, opacity, bounds, author, subject, predefinedDate, note, rect, pageNumber) {\n var date = new Date();\n // tslint:disable-next-line:max-line-length\n var modifiedDate = predefinedDate ? predefinedDate : date.toLocaleString();\n // tslint:disable-next-line\n var annotation = { textMarkupAnnotationType: type, color: color, opacity: opacity, bounds: bounds, author: author, subject: subject, modifiedDate: modifiedDate, note: note, rect: rect };\n var storedIndex = this.storeAnnotations(pageNumber, annotation);\n this.pdfViewer.annotationModule.addAction(pageNumber, storedIndex, annotation, 'Text Markup Added', null);\n return annotation;\n };\n TextMarkupAnnotation.prototype.getPageContext = function (pageNumber) {\n var canvas = this.pdfViewerBase.getElement('_annotationCanvas_' + pageNumber);\n var context = null;\n if (canvas) {\n context = canvas.getContext('2d');\n }\n return context;\n };\n TextMarkupAnnotation.prototype.getDefaultValue = function (value) {\n return value / this.pdfViewerBase.getZoomFactor();\n };\n TextMarkupAnnotation.prototype.getMagnifiedValue = function (value, factor) {\n return value * factor;\n };\n /**\n * @private\n */\n TextMarkupAnnotation.prototype.clear = function () {\n window.sessionStorage.removeItem(this.pdfViewerBase.documentId + '_annotations_textMarkup');\n };\n return TextMarkupAnnotation;\n}());\nexport { TextMarkupAnnotation };\n","import { createElement, Browser } from '@syncfusion/ej2-base';\nimport { Toolbar as Tool } from '@syncfusion/ej2-navigations';\nimport { Tooltip } from '@syncfusion/ej2-popups';\nimport { Toast } from '@syncfusion/ej2-notifications';\n/**\n * The `NavigationPane` module is used to handle navigation pane for thumbnail and bookmark navigation of PDF viewer.\n * @hidden\n */\nvar NavigationPane = /** @class */ (function () {\n function NavigationPane(viewer, base) {\n var _this = this;\n this.thumbnailWidthMin = 200;\n this.contentContainerScrollWidth = 33;\n this.closeButtonLeft = 170;\n this.isTooltipCreated = false;\n /**\n * @private\n */\n this.isNavigationToolbarVisible = false;\n /**\n * @private\n */\n this.isBookmarkListOpen = false;\n /**\n * @private\n */\n this.isNavigationPaneResized = false;\n /**\n * @private\n */\n this.isBookmarkOpen = false;\n /**\n * @private\n */\n this.isThumbnailOpen = false;\n this.resizeIconMouseOver = function (event) {\n event.srcElement.style.cursor = 'default';\n };\n this.resizePanelMouseDown = function (event) {\n var proxy = _this;\n proxy.offset = [\n proxy.sideBarResizer.offsetLeft - event.clientX,\n proxy.sideBarResizer.offsetTop - event.clientY,\n proxy.sideBarResizer.offsetParent.clientWidth\n ];\n _this.previousX = event.clientX;\n proxy.isDown = true;\n proxy.isNavigationPaneResized = true;\n proxy.pdfViewerBase.viewerContainer.style.cursor = 'e-resize';\n if (proxy.sideBarContentContainer) {\n proxy.sideBarContentContainer.style.cursor = 'e-resize';\n }\n };\n this.resizeViewerMouseLeave = function (event) {\n var proxy = _this;\n proxy.isDown = false;\n if (proxy.isNavigationPaneResized && proxy.sideBarContentContainer) {\n proxy.pdfViewerBase.viewerContainer.style.cursor = 'default';\n proxy.sideBarContentContainer.style.cursor = 'default';\n proxy.isNavigationPaneResized = false;\n }\n };\n this.resizePanelMouseMove = function (event) {\n var proxy = _this;\n if (!_this.pdfViewerBase.getPopupNoteVisibleStatus()) {\n event.preventDefault();\n if (proxy.isDown && _this.sideBarContentContainer) {\n // prevent the sidebar from becoming too narrow, or from occupying more\n // than half of the available viewer width.\n if (_this.pdfViewer.enableRtl) {\n var currentWidth = _this.previousX - event.clientX;\n var width = currentWidth + proxy.offset[2];\n var maxWidth = Math.floor(_this.outerContainerWidth / 2);\n if (width > maxWidth) {\n width = maxWidth;\n }\n if (width < _this.thumbnailWidthMin) {\n width = _this.thumbnailWidthMin;\n }\n proxy.sideBarResizer.style.right = width + 'px';\n proxy.sideBarContentContainer.style.width = width + 'px';\n proxy.sideBarContent.style.width = width + 'px';\n proxy.sideBarContentSplitter.style.width = width + 'px';\n proxy.sideBarTitleContainer.style.width = width + 'px';\n // tslint:disable-next-line:max-line-length\n proxy.pdfViewerBase.viewerContainer.style.right = proxy.getViewerContainerLeft() + 'px';\n }\n else {\n var width = event.clientX + proxy.offset[0];\n var maxWidth = Math.floor(_this.outerContainerWidth / 2);\n if (width > maxWidth) {\n width = maxWidth;\n }\n if (width < _this.thumbnailWidthMin) {\n width = _this.thumbnailWidthMin;\n }\n proxy.sideBarResizer.style.left = width + 'px';\n proxy.closeDiv.style.left = width - proxy.contentContainerScrollWidth + 'px';\n proxy.sideBarContentContainer.style.width = width + 'px';\n proxy.sideBarContent.style.width = width + 'px';\n proxy.sideBarContentSplitter.style.width = width + 'px';\n proxy.sideBarTitleContainer.style.width = width + 'px';\n // tslint:disable-next-line:max-line-length\n proxy.pdfViewerBase.viewerContainer.style.left = proxy.getViewerContainerLeft() + 'px';\n }\n // tslint:disable-next-line:max-line-length\n var viewerWidth = (proxy.pdfViewer.element.clientWidth - proxy.getViewerContainerLeft());\n proxy.pdfViewerBase.viewerContainer.style.width = viewerWidth + 'px';\n proxy.pdfViewerBase.pageContainer.style.width = proxy.pdfViewerBase.viewerContainer.clientWidth + 'px';\n proxy.pdfViewer.thumbnailViewModule.gotoThumbnailImage(proxy.pdfViewerBase.currentPageNumber - 1);\n proxy.pdfViewerBase.updateZoomValue();\n if (!proxy.bookmarkButton.children[0].classList.contains('e-pv-bookmark-disable-icon')) {\n proxy.pdfViewer.bookmarkViewModule.setBookmarkContentHeight();\n }\n }\n }\n };\n this.sideToolbarOnClose = function (event) {\n var proxy = _this;\n proxy.removeThumbnailSelectionIconTheme();\n proxy.removeBookmarkSelectionIconTheme();\n proxy.updateViewerContainerOnClose();\n };\n this.sideToolbarOnClick = function (event) {\n _this.sideBarTitle.textContent = _this.pdfViewer.localeObj.getConstant('Page Thumbnails');\n _this.sideBarContent.setAttribute('aria-label', 'Thumbnail View Panel');\n var proxy = _this;\n var bookmarkPane = document.getElementById(_this.pdfViewer.element.id + '_bookmark_view');\n if (bookmarkPane) {\n proxy.removeBookmarkSelectionIconTheme();\n bookmarkPane.style.display = 'none';\n }\n document.getElementById(_this.pdfViewer.element.id + '_thumbnail_view').style.display = 'flex';\n if (proxy.sideBarContentContainer) {\n if (proxy.sideBarContentContainer.style.display !== 'none') {\n if (proxy.isBookmarkOpen) {\n proxy.isThumbnailOpen = true;\n proxy.setThumbnailSelectionIconTheme();\n _this.updateViewerContainerOnExpand();\n }\n else {\n proxy.isThumbnailOpen = false;\n proxy.removeThumbnailSelectionIconTheme();\n _this.updateViewerContainerOnClose();\n }\n }\n else {\n _this.sideBarContent.focus();\n proxy.isThumbnailOpen = true;\n proxy.setThumbnailSelectionIconTheme();\n _this.updateViewerContainerOnExpand();\n }\n }\n proxy.isBookmarkOpen = false;\n };\n this.bookmarkButtonOnClick = function (event) {\n var proxy = _this;\n document.getElementById(_this.pdfViewer.element.id + '_thumbnail_view').style.display = 'none';\n _this.removeThumbnailSelectionIconTheme();\n _this.sideBarTitle.textContent = _this.pdfViewer.localeObj.getConstant('Bookmarks');\n _this.sideBarContent.setAttribute('aria-label', 'Bookmark View Panel');\n _this.pdfViewer.bookmarkViewModule.renderBookmarkcontent();\n if (_this.sideBarContentContainer) {\n if (proxy.sideBarContentContainer.style.display !== 'none') {\n if (_this.isThumbnailOpen) {\n _this.setBookmarkSelectionIconTheme();\n _this.isBookmarkOpen = true;\n _this.updateViewerContainerOnExpand();\n }\n else {\n _this.removeBookmarkSelectionIconTheme();\n _this.isBookmarkOpen = false;\n _this.updateViewerContainerOnClose();\n }\n }\n else {\n _this.sideBarContent.focus();\n _this.setBookmarkSelectionIconTheme();\n _this.isBookmarkOpen = true;\n _this.updateViewerContainerOnExpand();\n }\n }\n _this.isThumbnailOpen = false;\n };\n this.pdfViewer = viewer;\n this.pdfViewerBase = base;\n }\n /**\n * @private\n */\n NavigationPane.prototype.initializeNavigationPane = function () {\n if (!Browser.isDevice) {\n this.createNavigationPane();\n }\n };\n NavigationPane.prototype.createNavigationPane = function () {\n // tslint:disable-next-line:max-line-length\n this.sideBarToolbar = createElement('div', { id: this.pdfViewer.element.id + '_sideBarToolbar', className: 'e-pv-sidebar-toolbar', attrs: { 'role': 'toolbar', 'aria-orientation': 'vertical', 'tabindex': '-1' } });\n this.pdfViewerBase.mainContainer.appendChild(this.sideBarToolbar);\n if (this.pdfViewer.enableRtl) {\n this.sideBarToolbar.style.cssFloat = 'right';\n this.sideBarToolbar.style.right = 1 + 'px';\n this.sideBarToolbar.style.position = 'relative';\n }\n // tslint:disable-next-line:max-line-length\n this.sideBarToolbarSplitter = createElement('div', { id: this.pdfViewer.element.id + '_sideBarToolbarSplitter', className: 'e-pv-sidebar-toolbar-splitter' });\n this.pdfViewerBase.mainContainer.appendChild(this.sideBarToolbarSplitter);\n if (this.pdfViewer.enableRtl) {\n this.sideBarToolbarSplitter.classList.add('e-right');\n }\n else {\n this.sideBarToolbarSplitter.classList.add('e-left');\n }\n // tslint:disable-next-line:max-line-length\n this.sideBarContentContainer = createElement('div', { id: this.pdfViewer.element.id + '_sideBarContentContainer', className: 'e-pv-sidebar-content-container' });\n if (this.pdfViewer.enableRtl) {\n this.sideBarContentContainer.classList.add('e-right');\n }\n else {\n this.sideBarContentContainer.classList.add('e-left');\n }\n this.pdfViewerBase.mainContainer.appendChild(this.sideBarContentContainer);\n // tslint:disable-next-line:max-line-length\n this.sideBarContentSplitter = createElement('div', { id: this.pdfViewer.element.id + '_sideBarContentSplitter', className: 'e-pv-sidebar-content-splitter' });\n if (this.pdfViewer.enableRtl) {\n this.sideBarContentSplitter.style.right = 0 + 'px';\n }\n this.sideBarContentContainer.appendChild(this.sideBarContentSplitter);\n // tslint:disable-next-line:max-line-length\n this.sideBarContent = createElement('div', { id: this.pdfViewer.element.id + '_sideBarContent', className: 'e-pv-sidebar-content', attrs: { 'tabindex': '0' } });\n if (this.pdfViewer.enableRtl) {\n this.sideBarContent.style.right = 0 + 'px';\n this.sideBarContent.style.direction = 'rtl';\n }\n this.sideBarContentContainer.appendChild(this.sideBarContent);\n // tslint:disable-next-line:max-line-length\n this.sideBarTitleContainer = createElement('div', { id: this.pdfViewer.element.id + '_sideBarTitleContainer', className: 'e-pv-sidebar-title-container' });\n if (this.pdfViewer.enableRtl) {\n this.sideBarTitleContainer.style.right = 0 + 'px';\n }\n // tslint:disable-next-line:max-line-length\n this.sideBarTitle = createElement('div', { id: this.pdfViewer.element.id + '_sideBarTitle', className: 'e-pv-sidebar-title', attrs: { 'tabindex': '-1' } });\n if (this.pdfViewer.enableRtl) {\n this.sideBarTitle.classList.add('e-right');\n }\n else {\n this.sideBarTitle.classList.add('e-left');\n }\n this.sideBarTitleContainer.appendChild(this.sideBarTitle);\n this.sideBarContentContainer.appendChild(this.sideBarTitleContainer);\n // tslint:disable-next-line:max-line-length\n this.sideBarResizer = createElement('div', { id: this.pdfViewer.element.id + '_sideBarResizer', className: 'e-pv-sidebar-resizer' });\n this.sideBarResizer.addEventListener('mousedown', this.resizePanelMouseDown);\n this.pdfViewerBase.mainContainer.addEventListener('mousemove', this.resizePanelMouseMove);\n this.pdfViewerBase.mainContainer.addEventListener('mouseup', this.resizeViewerMouseLeave);\n if (this.pdfViewer.enableRtl) {\n this.sideBarResizer.classList.add('e-right');\n }\n else {\n this.sideBarResizer.classList.add('e-left');\n }\n this.sideBarContentContainer.appendChild(this.sideBarResizer);\n // tslint:disable-next-line:max-line-length\n var controlLeft = this.getViewerContainerLeft();\n if (!this.pdfViewer.enableRtl) {\n this.pdfViewerBase.viewerContainer.style.left = controlLeft + 'px';\n }\n this.pdfViewerBase.viewerContainer.style.width = (this.pdfViewer.element.clientWidth - controlLeft) + 'px';\n this.sideBarContentContainer.style.display = 'none';\n this.createSidebarToolBar();\n this.createSidebarTitleCloseButton();\n this.createResizeIcon();\n this.sideBarToolbar.addEventListener('mouseup', this.sideToolbarOnMouseup.bind(this));\n this.sideBarContentContainer.addEventListener('mouseup', this.sideBarTitleOnMouseup.bind(this));\n };\n /**\n * @private\n */\n NavigationPane.prototype.adjustPane = function () {\n var splitterElement = this.pdfViewerBase.getElement('_sideBarToolbarSplitter');\n var toolbarContainer = this.pdfViewerBase.getElement('_toolbarContainer');\n var toolbarHeight = toolbarContainer.getBoundingClientRect().height;\n if (toolbarHeight === 0) {\n // tslint:disable-next-line\n toolbarHeight = parseFloat(window.getComputedStyle(toolbarContainer)['height']) + 1;\n }\n // tslint:disable-next-line:max-line-length\n this.sideBarToolbar.style.top = toolbarHeight + 'px';\n this.sideBarContentContainer.style.top = toolbarHeight + 'px';\n splitterElement.style.top = toolbarHeight + 'px';\n };\n /**\n * @private\n */\n NavigationPane.prototype.createNavigationPaneMobile = function (option) {\n var _this = this;\n this.isNavigationToolbarVisible = true;\n this.toolbarElement = createElement('div', { id: this.pdfViewer.element.id + '_navigationToolbar', className: 'e-pv-nav-toolbar' });\n this.pdfViewerBase.viewerMainContainer.insertBefore(this.toolbarElement, this.pdfViewerBase.viewerContainer);\n var items;\n if (option === 'search') {\n var searchTemplate = '';\n items = [\n // tslint:disable-next-line:max-line-length\n { 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) },\n { template: searchTemplate },\n {\n prefixIcon: 'e-pv-search-icon e-pv-icon', id: this.pdfViewer.element.id + '_search_box-icon',\n click: function () {\n var iconElement = _this.pdfViewerBase.getElement('_search_box-icon').firstElementChild;\n if (iconElement.classList.contains('e-pv-search-close')) {\n _this.enableSearchItems(false);\n }\n _this.pdfViewer.textSearchModule.searchButtonClick(iconElement, _this.searchInput);\n }\n },\n {\n prefixIcon: 'e-pv-prev-search-icon e-pv-icon', id: this.pdfViewer.element.id + '_prev_occurrence',\n click: function (args) {\n _this.pdfViewer.textSearchModule.searchPrevious();\n }\n },\n {\n prefixIcon: 'e-pv-next-search-icon e-pv-icon', id: this.pdfViewer.element.id + '_next_occurrence',\n click: function (args) {\n _this.pdfViewer.textSearchModule.searchNext();\n }\n }\n ];\n }\n else {\n items = [\n // tslint:disable-next-line:max-line-length\n { prefixIcon: 'e-pv-backward-icon e-pv-icon', id: this.pdfViewer.element.id + '_backward', click: this.goBackToToolbar.bind(this) },\n { text: this.pdfViewer.localeObj.getConstant('Bookmarks') }\n ];\n }\n this.toolbar = new Tool({ items: items, width: '', height: '', overflowMode: 'Popup' });\n if (this.pdfViewer.enableRtl) {\n this.toolbar.enableRtl = true;\n }\n this.toolbar.appendTo(this.toolbarElement);\n if (option === 'search') {\n this.initiateSearchBox();\n }\n else {\n this.initiateBookmarks();\n }\n };\n NavigationPane.prototype.initiateSearchBox = function () {\n var _this = this;\n this.searchInput = this.pdfViewerBase.getElement('_search_input');\n this.pdfViewer.textSearchModule.searchBtn = this.pdfViewerBase.getElement('_search_box-icon').firstElementChild;\n this.searchInput.addEventListener('keyup', function (event) {\n _this.enableSearchItems(true);\n var searchString = _this.searchInput.value;\n if (event.which === 13) {\n _this.initiateTextSearch();\n }\n else {\n _this.pdfViewer.textSearchModule.resetVariables();\n }\n });\n this.pdfViewer.textSearchModule.searchInput = this.searchInput;\n this.setSearchInputWidth();\n this.enableSearchItems(false);\n this.searchInput.focus();\n };\n NavigationPane.prototype.enableSearchItems = function (isEnable) {\n this.toolbar.enableItems(this.pdfViewerBase.getElement('_prev_occurrence').parentElement, isEnable);\n this.toolbar.enableItems(this.pdfViewerBase.getElement('_next_occurrence').parentElement, isEnable);\n };\n NavigationPane.prototype.initiateBookmarks = function () {\n if (Browser.isDevice) {\n this.pdfViewerBase.mobileScrollerContainer.style.display = 'none';\n }\n // tslint:disable-next-line:max-line-length\n var bookmarkContainer = createElement('div', { id: this.pdfViewer.element.id + '_bookmarks_container', className: 'e-pv-bookmark-container' });\n bookmarkContainer.style.width = '100%';\n bookmarkContainer.style.height = this.pdfViewerBase.viewerContainer.style.height;\n this.pdfViewerBase.getElement('_viewerMainContainer').appendChild(bookmarkContainer);\n this.pdfViewerBase.viewerContainer.style.display = 'none';\n this.isBookmarkListOpen = true;\n this.pdfViewer.bookmarkViewModule.renderBookmarkContentMobile();\n };\n NavigationPane.prototype.initiateTextSearch = function () {\n var inputString = this.searchInput.value;\n this.pdfViewer.textSearchModule.initiateSearch(inputString);\n };\n /**\n * @private\n */\n NavigationPane.prototype.goBackToToolbar = function () {\n this.isNavigationToolbarVisible = false;\n this.pdfViewer.textSearchModule.cancelTextSearch();\n this.searchInput = null;\n if (this.pdfViewer.bookmarkViewModule.childNavigateCount !== 0) {\n this.pdfViewer.bookmarkViewModule.bookmarkList.back();\n this.pdfViewer.bookmarkViewModule.childNavigateCount--;\n }\n else {\n if (this.toolbar != null) {\n this.toolbar.destroy();\n this.toolbar = null;\n }\n var bookmarkContainer = this.pdfViewerBase.getElement('_bookmarks_container');\n if (bookmarkContainer) {\n bookmarkContainer.parentElement.removeChild(bookmarkContainer);\n if (Browser.isDevice) {\n this.pdfViewerBase.mobileScrollerContainer.style.display = '';\n }\n }\n if (this.toolbarElement && this.toolbarElement.parentElement != null) {\n this.toolbarElement.parentElement.removeChild(this.toolbarElement);\n }\n this.pdfViewerBase.viewerContainer.style.display = 'block';\n this.isBookmarkListOpen = false;\n if (!this.pdfViewer.toolbar.annotationToolbarModule.isMobileAnnotEnabled) {\n this.pdfViewer.toolbarModule.showToolbar(true);\n this.pdfViewerBase.onWindowResize();\n }\n }\n };\n NavigationPane.prototype.setSearchInputWidth = function () {\n var searchInputParent = this.searchInput.parentElement;\n var padding = window.getComputedStyle(searchInputParent.parentElement, null).getPropertyValue('padding-left');\n // tslint:disable-next-line:max-line-length\n var width = this.toolbarElement.clientWidth - this.getParentElementSearchBox('_backward').clientWidth\n - this.getParentElementSearchBox('_search_box-icon').clientWidth - this.getParentElementSearchBox('_prev_occurrence').clientWidth\n - this.getParentElementSearchBox('_next_occurrence').clientWidth - 6;\n if (padding !== '') {\n width = width - (parseFloat(padding) * 2);\n }\n searchInputParent.style.width = width + 'px';\n };\n NavigationPane.prototype.getParentElementSearchBox = function (idString) {\n return this.pdfViewerBase.getElement(idString).parentElement;\n };\n /**\n * @private\n */\n NavigationPane.prototype.createTooltipMobile = function (text) {\n if (!this.isTooltipCreated) { //boolean to prevent again toast creation.\n // tslint:disable-next-line:max-line-length\n var tooltipDiv = createElement('div', { className: 'e-pv-container-tooltip', id: this.pdfViewer.element.id + '_container_tooltip' });\n this.pdfViewer.element.appendChild(tooltipDiv);\n // tslint:disable-next-line:max-line-length\n this.toastObject = new Toast({ title: text, target: this.pdfViewer.element, close: this.onTooltipClose.bind(this), position: { X: 0, Y: 0 }, animation: { hide: { duration: 200, effect: 'FadeOut' } } });\n this.toastObject.appendTo(tooltipDiv);\n var y = this.pdfViewer.element.clientHeight * 0.65;\n var x = (this.pdfViewer.element.clientWidth - tooltipDiv.clientWidth) / 2;\n this.isTooltipCreated = true;\n this.toastObject.show({ position: { X: x, Y: y } });\n var tooltipChild = tooltipDiv.firstElementChild;\n if (tooltipChild) {\n tooltipChild.style.width = 'auto';\n }\n }\n else {\n if (this.toastObject) {\n this.toastObject.title = text;\n var tooltipElement = this.pdfViewerBase.getElement('_container_tooltip');\n var tooltipChild = tooltipElement.firstElementChild;\n if (tooltipChild) {\n tooltipChild.style.width = 'auto';\n tooltipChild.firstElementChild.firstElementChild.textContent = text;\n }\n }\n }\n };\n NavigationPane.prototype.onTooltipClose = function (args) {\n this.isTooltipCreated = false;\n var tooltipElement = this.pdfViewerBase.getElement('_container_tooltip');\n this.pdfViewer.textSearchModule.isMessagePopupOpened = false;\n this.toastObject.destroy();\n tooltipElement.parentElement.removeChild(tooltipElement);\n this.toastObject = null;\n };\n /**\n * @private\n */\n NavigationPane.prototype.toolbarResize = function () {\n if (this.searchInput) {\n this.searchInput.style.width = 'auto';\n this.setSearchInputWidth();\n }\n };\n NavigationPane.prototype.createSidebarToolBar = function () {\n // tslint:disable-next-line:max-line-length\n this.thumbnailButton = createElement('button', { id: this.pdfViewer.element.id + '_thumbnail-view', attrs: { 'disabled': 'disabled', 'aria-label': 'Page Thumbnails', 'tabindex': '-1' } });\n this.thumbnailButton.className = 'e-pv-tbar-btn e-pv-thumbnail-view-button e-btn';\n // tslint:disable-next-line:max-line-length\n var thumbnailButtonSpan = createElement('span', { id: this.pdfViewer.element.id + '_thumbnail-view' + '_icon', className: 'e-pv-thumbnail-view-disable-icon e-pv-icon' });\n this.thumbnailButton.appendChild(thumbnailButtonSpan);\n // tslint:disable-next-line:max-line-length\n var thumbnailTooltip = new Tooltip({ content: this.pdfViewer.localeObj.getConstant('Page Thumbnails'), opensOn: 'Hover', beforeOpen: this.onTooltipBeforeOpen.bind(this) });\n thumbnailTooltip.appendTo(this.thumbnailButton);\n // tslint:disable-next-line:max-line-length\n this.bookmarkButton = createElement('button', { id: this.pdfViewer.element.id + '_bookmark', attrs: { 'disabled': 'disabled', 'aria-label': 'Bookmarks', 'tabindex': '-1' } });\n this.bookmarkButton.className = 'e-pv-tbar-btn e-pv-bookmark-button e-btn';\n // tslint:disable-next-line:max-line-length\n var buttonSpan = createElement('span', { id: this.pdfViewer.element.id + '_bookmark' + '_icon', className: 'e-pv-bookmark-disable-icon e-pv-icon' });\n this.bookmarkButton.appendChild(buttonSpan);\n // tslint:disable-next-line:max-line-length\n var bookMarkTooltip = new Tooltip({ content: this.pdfViewer.localeObj.getConstant('Bookmarks'), opensOn: 'Hover', beforeOpen: this.onTooltipBeforeOpen.bind(this) });\n bookMarkTooltip.appendTo(this.bookmarkButton);\n this.sideBarToolbar.appendChild(this.thumbnailButton);\n this.sideBarToolbar.appendChild(this.bookmarkButton);\n this.thumbnailButton.addEventListener('click', this.sideToolbarOnClick);\n this.bookmarkButton.addEventListener('click', this.bookmarkButtonOnClick);\n };\n NavigationPane.prototype.onTooltipBeforeOpen = function (args) {\n if (!this.pdfViewer.toolbarSettings.showTooltip) {\n args.cancel = true;\n }\n };\n /**\n * @private\n */\n NavigationPane.prototype.enableThumbnailButton = function () {\n if (this.thumbnailButton) {\n this.thumbnailButton.removeAttribute('disabled');\n this.thumbnailButton.children[0].classList.remove('e-pv-thumbnail-view-disable-icon');\n this.thumbnailButton.children[0].classList.add('e-pv-thumbnail-view-icon');\n }\n };\n /**\n * @private\n */\n NavigationPane.prototype.enableBookmarkButton = function () {\n if (this.bookmarkButton) {\n this.bookmarkButton.removeAttribute('disabled');\n this.bookmarkButton.children[0].classList.remove('e-pv-bookmark-disable-icon');\n this.bookmarkButton.children[0].classList.add('e-pv-bookmark-icon');\n }\n };\n NavigationPane.prototype.createSidebarTitleCloseButton = function () {\n this.closeDiv = createElement('button', { id: this.pdfViewer.element.id + '_close_btn' });\n this.closeDiv.className = 'e-btn e-pv-tbar-btn e-pv-title-close-div e-btn';\n if (this.pdfViewer.enableRtl) {\n this.closeDiv.style.left = 8 + 'px';\n }\n else {\n this.closeDiv.style.left = this.closeButtonLeft + 'px';\n }\n // tslint:disable-next-line:max-line-length\n var buttonSpan = createElement('span', { id: this.pdfViewer.element.id + '_close' + '_icon', className: 'e-pv-title-close-icon e-pv-icon' });\n this.closeDiv.appendChild(buttonSpan);\n this.sideBarTitleContainer.appendChild(this.closeDiv);\n this.closeDiv.addEventListener('click', this.sideToolbarOnClose);\n };\n NavigationPane.prototype.createResizeIcon = function () {\n // tslint:disable-next-line:max-line-length\n this.resizeIcon = createElement('div', { id: this.pdfViewer.element.id + '_resize', className: 'e-pv-resize-icon e-pv-icon' });\n this.setResizeIconTop();\n this.resizeIcon.style.position = 'absolute';\n this.resizeIcon.addEventListener('click', this.sideToolbarOnClose);\n this.resizeIcon.addEventListener('mouseover', this.resizeIconMouseOver);\n this.sideBarResizer.appendChild(this.resizeIcon);\n };\n /**\n * @private\n */\n NavigationPane.prototype.setResizeIconTop = function () {\n // tslint:disable-next-line:max-line-length\n if (this.sideBarToolbar && this.sideBarToolbar.clientHeight && this.resizeIcon.style.top === '') {\n this.resizeIcon.style.top = (this.sideBarToolbar.clientHeight) / 2 + 'px';\n }\n };\n Object.defineProperty(NavigationPane.prototype, \"outerContainerWidth\", {\n /**\n * @private\n */\n get: function () {\n if (!this.mainContainerWidth) {\n this.mainContainerWidth = this.pdfViewerBase.mainContainer.clientWidth;\n }\n return this.mainContainerWidth;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(NavigationPane.prototype, \"sideToolbarWidth\", {\n /**\n * @private\n */\n get: function () {\n if (this.sideBarToolbar) {\n return this.sideBarToolbar.clientWidth;\n }\n else {\n return 0;\n }\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(NavigationPane.prototype, \"sideBarContentContainerWidth\", {\n /**\n * @private\n */\n get: function () {\n if (this.sideBarContentContainer) {\n return this.sideBarContentContainer.clientWidth;\n }\n else {\n return 0;\n }\n },\n enumerable: true,\n configurable: true\n });\n /**\n * @private\n */\n NavigationPane.prototype.updateViewerContainerOnClose = function () {\n var proxy = this;\n if (proxy.sideBarContentContainer) {\n proxy.sideBarContentContainer.style.display = 'none';\n if (this.pdfViewer.enableRtl) {\n proxy.pdfViewerBase.viewerContainer.style.right = (proxy.sideToolbarWidth) + 'px';\n }\n else {\n proxy.pdfViewerBase.viewerContainer.style.left = (proxy.sideToolbarWidth) + 'px';\n }\n proxy.pdfViewerBase.viewerContainer.style.width = (proxy.pdfViewer.element.clientWidth - proxy.sideToolbarWidth) + 'px';\n proxy.pdfViewerBase.pageContainer.style.width = proxy.pdfViewerBase.viewerContainer.clientWidth + 'px';\n proxy.pdfViewerBase.updateZoomValue();\n }\n };\n NavigationPane.prototype.updateViewerContainerOnExpand = function () {\n var proxy = this;\n if (proxy.sideBarContentContainer) {\n proxy.sideBarContentContainer.style.display = 'block';\n if (this.pdfViewer.enableRtl) {\n // tslint:disable-next-line:max-line-length\n proxy.pdfViewerBase.viewerContainer.style.right = proxy.getViewerContainerLeft() + 'px';\n }\n else {\n // tslint:disable-next-line:max-line-length\n proxy.pdfViewerBase.viewerContainer.style.left = proxy.getViewerContainerLeft() + 'px';\n }\n // tslint:disable-next-line:max-line-length\n proxy.pdfViewerBase.viewerContainer.style.width = (proxy.pdfViewer.element.clientWidth - this.getViewerContainerLeft()) + 'px';\n proxy.pdfViewerBase.pageContainer.style.width = proxy.pdfViewerBase.viewerContainer.clientWidth + 'px';\n proxy.pdfViewerBase.updateZoomValue();\n proxy.pdfViewer.thumbnailViewModule.gotoThumbnailImage(proxy.pdfViewerBase.currentPageNumber - 1);\n }\n };\n /**\n * @private\n */\n NavigationPane.prototype.getViewerContainerLeft = function () {\n return (this.sideToolbarWidth + this.sideBarContentContainerWidth);\n };\n /**\n * @private\n */\n NavigationPane.prototype.getViewerMainContainerWidth = function () {\n return this.pdfViewer.element.clientWidth - this.sideToolbarWidth;\n };\n NavigationPane.prototype.setThumbnailSelectionIconTheme = function () {\n if (this.thumbnailButton) {\n this.thumbnailButton.children[0].classList.remove('e-pv-thumbnail-view-icon');\n this.thumbnailButton.children[0].classList.add('e-pv-thumbnail-view-selection-icon');\n this.thumbnailButton.classList.add('e-pv-thumbnail-view-button-selection');\n }\n };\n NavigationPane.prototype.removeThumbnailSelectionIconTheme = function () {\n if (this.thumbnailButton) {\n this.thumbnailButton.children[0].classList.add('e-pv-thumbnail-view-icon');\n this.thumbnailButton.children[0].classList.remove('e-pv-thumbnail-view-selection-icon');\n this.thumbnailButton.classList.remove('e-pv-thumbnail-view-button-selection');\n }\n };\n NavigationPane.prototype.resetThumbnailIcon = function () {\n if (this.thumbnailButton) {\n this.thumbnailButton.children[0].classList.remove('e-pv-thumbnail-view-icon');\n this.thumbnailButton.children[0].classList.add('e-pv-thumbnail-view-disable-icon');\n }\n };\n /**\n * @private\n */\n NavigationPane.prototype.resetThumbnailView = function () {\n if (this.sideBarContentContainer) {\n this.sideBarContentContainer.style.display = 'none';\n if (this.pdfViewer.enableRtl) {\n this.pdfViewerBase.viewerContainer.style.left = 1 + 'px';\n }\n else {\n this.pdfViewerBase.viewerContainer.style.left = (this.sideToolbarWidth) + 'px';\n }\n this.pdfViewerBase.viewerContainer.style.width = (this.pdfViewer.element.clientWidth - this.sideToolbarWidth) + 'px';\n this.pdfViewerBase.pageContainer.style.width = this.pdfViewerBase.viewerContainer.clientWidth + 'px';\n this.thumbnailButton.setAttribute('disabled', 'disabled');\n this.removeThumbnailSelectionIconTheme();\n this.resetThumbnailIcon();\n }\n };\n NavigationPane.prototype.setBookmarkSelectionIconTheme = function () {\n if (this.bookmarkButton) {\n this.bookmarkButton.children[0].classList.remove('e-pv-bookmark-icon');\n this.bookmarkButton.children[0].classList.add('e-pv-bookmark-selection-icon');\n this.bookmarkButton.classList.add('e-pv-bookmark-button-selection');\n }\n };\n NavigationPane.prototype.removeBookmarkSelectionIconTheme = function () {\n if (this.bookmarkButton) {\n this.bookmarkButton.children[0].classList.add('e-pv-bookmark-icon');\n this.bookmarkButton.children[0].classList.remove('e-pv-bookmark-selection-icon');\n this.bookmarkButton.classList.remove('e-pv-bookmark-button-selection');\n }\n };\n NavigationPane.prototype.sideToolbarOnMouseup = function (event) {\n if (event.target === this.sideBarToolbar) {\n this.pdfViewerBase.focusViewerContainer();\n }\n };\n NavigationPane.prototype.sideBarTitleOnMouseup = function (event) {\n this.pdfViewerBase.focusViewerContainer();\n };\n /**\n * @private\n */\n NavigationPane.prototype.disableBookmarkButton = function () {\n if (this.sideBarContentContainer) {\n this.sideBarContentContainer.style.display = 'none';\n this.bookmarkButton.setAttribute('disabled', 'disabled');\n this.bookmarkButton.children[0].classList.add('e-pv-bookmark-disable-icon');\n }\n };\n /**\n * @private\n */\n NavigationPane.prototype.clear = function () {\n this.removeBookmarkSelectionIconTheme();\n this.removeThumbnailSelectionIconTheme();\n };\n NavigationPane.prototype.getModuleName = function () {\n return 'NavigationPane';\n };\n return NavigationPane;\n}());\nexport { NavigationPane };\n","var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nvar __generator = (this && this.__generator) || function (thisArg, body) {\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\n return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\n function verb(n) { return function (v) { return step([n, v]); }; }\n function step(op) {\n if (f) throw new TypeError(\"Generator is already executing.\");\n while (_) try {\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\n if (y = 0, t) op = [op[0] & 2, t.value];\n switch (op[0]) {\n case 0: case 1: t = op; break;\n case 4: _.label++; return { value: op[1], done: false };\n case 5: _.label++; y = op[1]; op = [0]; continue;\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\n default:\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\n if (t[2]) _.ops.pop();\n _.trys.pop(); continue;\n }\n op = body.call(thisArg, _);\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\n }\n};\nimport { createElement, Browser } from '@syncfusion/ej2-base';\nimport { Dialog, createSpinner, showSpinner, hideSpinner } from '@syncfusion/ej2-popups';\nimport { TextLayer, ContextMenu } from '../index';\nimport { NavigationPane } from './navigation-pane';\nimport { NumericTextBox } from '@syncfusion/ej2-inputs';\n/**\n * The `PdfViewerBase` module is used to handle base methods of PDF viewer.\n * @hidden\n */\nvar PdfViewerBase = /** @class */ (function () {\n function PdfViewerBase(viewer) {\n var _this = this;\n /**\n * @private\n */\n this.pageSize = [];\n /**\n * @private\n */\n this.pageCount = 0;\n /**\n * @private\n */\n this.currentPageNumber = 0;\n this.isDocumentLoaded = false;\n /**\n * @private\n */\n this.isDocumentEdited = false;\n /**\n * @private\n */\n this.renderedPagesList = [];\n /**\n * @private\n */\n this.pageGap = 8;\n this.pageLeft = 5;\n this.sessionLimit = 1000;\n this.pageStopValue = 300;\n /**\n * @private\n */\n this.toolbarHeight = 56;\n this.pageLimit = 0;\n this.previousPage = 0;\n this.isViewerMouseDown = false;\n this.isViewerMouseWheel = false;\n this.scrollPosition = 0;\n this.sessionStorage = [];\n this.pointerCount = 0;\n this.pointersForTouch = [];\n this.isPasswordAvailable = false;\n /**\n * @private\n */\n this.reRenderedCount = 0;\n this.mouseX = 0;\n this.mouseY = 0;\n this.touchClientX = 0;\n this.touchClientY = 0;\n this.previousTime = 0;\n this.currentTime = 0;\n this.isTouchScrolled = false;\n this.isLongTouchPropagated = false;\n // tslint:disable-next-line\n this.longTouchTimer = null;\n this.isViewerContainerDoubleClick = false;\n // tslint:disable-next-line\n this.dblClickTimer = null;\n /**\n * @private\n */\n this.pinchZoomStorage = [];\n /**\n * @private\n */\n this.isTextSelectionDisabled = false;\n /**\n * @private\n */\n this.isPanMode = false;\n this.dragX = 0;\n this.dragY = 0;\n this.isScrollbarMouseDown = false;\n this.scrollX = 0;\n this.scrollY = 0;\n this.ispageMoved = false;\n this.isThumb = false;\n this.isTapHidden = false;\n // tslint:disable-next-line\n this.singleTapTimer = null;\n this.tapCount = 0;\n /**\n * @private\n */\n this.onWindowResize = function () {\n var proxy = _this;\n if (_this.pdfViewer.enableRtl) {\n // tslint:disable-next-line:max-line-length\n proxy.viewerContainer.style.right = (proxy.navigationPane.sideBarToolbar ? proxy.navigationPane.getViewerContainerLeft() : 0) + 'px';\n }\n else {\n // tslint:disable-next-line:max-line-length\n proxy.viewerContainer.style.left = (proxy.navigationPane.sideBarToolbar ? proxy.navigationPane.getViewerContainerLeft() : 0) + 'px';\n }\n // tslint:disable-next-line:max-line-length\n var viewerWidth = (proxy.pdfViewer.element.clientWidth - (proxy.navigationPane.sideBarToolbar ? proxy.navigationPane.getViewerContainerLeft() : 0));\n proxy.viewerContainer.style.width = viewerWidth + 'px';\n if (proxy.pdfViewer.toolbarModule) {\n var toolbarHeight = proxy.getElement('_toolbarContainer').getBoundingClientRect().height;\n if (proxy.isAnnotationToolbarHidden() || Browser.isDevice) {\n // tslint:disable-next-line:max-line-length\n proxy.viewerContainer.style.height = proxy.updatePageHeight(proxy.pdfViewer.element.getBoundingClientRect().height, toolbarHeight);\n }\n else {\n var annotationToolbarHeight = proxy.getElement('_annotation_toolbar').getBoundingClientRect().height;\n // tslint:disable-next-line:max-line-length\n proxy.viewerContainer.style.height = proxy.updatePageHeight(proxy.pdfViewer.element.getBoundingClientRect().height, toolbarHeight + annotationToolbarHeight);\n }\n }\n else {\n proxy.viewerContainer.style.height = proxy.updatePageHeight(proxy.pdfViewer.element.getBoundingClientRect().height, 0);\n }\n if (proxy.pdfViewer.bookmarkViewModule && Browser.isDevice) {\n var bookmarkContainer = proxy.getElement('_bookmarks_container');\n if (bookmarkContainer) {\n bookmarkContainer.style.height = proxy.updatePageHeight(proxy.pdfViewer.element.getBoundingClientRect().height, 0);\n }\n }\n proxy.pageContainer.style.width = proxy.viewerContainer.clientWidth + 'px';\n if (proxy.pdfViewer.toolbarModule) {\n // tslint:disable-next-line:max-line-length\n proxy.pdfViewer.toolbarModule.onToolbarResize((proxy.navigationPane.sideBarToolbar ? proxy.navigationPane.getViewerMainContainerWidth() : proxy.pdfViewer.element.clientWidth));\n }\n if (_this.pdfViewer.enableToolbar && _this.pdfViewer.thumbnailViewModule) {\n proxy.pdfViewer.thumbnailViewModule.gotoThumbnailImage(proxy.currentPageNumber - 1);\n }\n if (proxy.pdfViewer.textSearchModule && !Browser.isDevice) {\n proxy.pdfViewer.textSearchModule.textSearchBoxOnResize();\n }\n if (!proxy.navigationPane.isBookmarkListOpen) {\n proxy.updateZoomValue();\n }\n if (Browser.isDevice) {\n proxy.mobileScrollerContainer.style.left = (viewerWidth - parseFloat(proxy.mobileScrollerContainer.style.width)) + 'px';\n proxy.mobilePageNoContainer.style.left = (viewerWidth / 2) - (parseFloat(proxy.mobilePageNoContainer.style.width) / 2) + 'px';\n proxy.mobilePageNoContainer.style.top = (proxy.pdfViewer.element.clientHeight / 2) + 'px';\n proxy.updateMobileScrollerPosition();\n }\n else {\n proxy.navigationPane.setResizeIconTop();\n }\n };\n this.viewerContainerOnMousedown = function (event) {\n if (event.button === 0 && !_this.getPopupNoteVisibleStatus()) {\n _this.isViewerMouseDown = true;\n if (event.detail === 1) {\n _this.focusViewerContainer();\n }\n _this.scrollPosition = _this.viewerContainer.scrollTop / _this.getZoomFactor();\n _this.mouseX = event.clientX;\n _this.mouseY = event.clientY;\n // tslint:disable-next-line\n var isIE = !!document.documentMode;\n if (_this.pdfViewer.textSelectionModule && !_this.isClickedOnScrollBar(event) && !_this.isTextSelectionDisabled) {\n if (!isIE) {\n event.preventDefault();\n }\n _this.pdfViewer.textSelectionModule.clearTextSelection();\n }\n }\n if (_this.isPanMode) {\n _this.dragX = event.pageX;\n _this.dragY = event.pageY;\n // tslint:disable-next-line:max-line-length\n if (_this.viewerContainer.contains(event.target) && (event.target !== _this.viewerContainer) && (event.target !== _this.pageContainer) && _this.isPanMode) {\n _this.viewerContainer.style.cursor = 'grabbing';\n }\n }\n };\n this.viewerContainerOnMouseup = function (event) {\n if (!_this.getPopupNoteVisibleStatus()) {\n if (_this.isViewerMouseDown) {\n if (_this.scrollHoldTimer) {\n clearTimeout(_this.scrollHoldTimer);\n _this.scrollHoldTimer = null;\n }\n if ((_this.scrollPosition * _this.getZoomFactor()) !== _this.viewerContainer.scrollTop) {\n _this.pageViewScrollChanged(_this.currentPageNumber);\n }\n }\n if (event.button === 0) {\n // 0 is for left button.\n var eventTarget = event.target;\n if (eventTarget.classList.contains('e-pv-page-canvas')) {\n var idStringArray = eventTarget.id.split('_');\n // tslint:disable-next-line\n _this.pdfViewer.firePageClick(event.offsetX, event.offsetY, parseInt(idStringArray[idStringArray.length - 1]) + 1);\n }\n if (_this.isTextMarkupAnnotationModule()) {\n _this.pdfViewer.annotationModule.textMarkupAnnotationModule.onTextMarkupAnnotationMouseUp(event);\n }\n // tslint:disable-next-line:max-line-length\n if (_this.viewerContainer.contains(event.target) && (event.target !== _this.viewerContainer) && (event.target !== _this.pageContainer) && _this.isPanMode) {\n _this.viewerContainer.style.cursor = 'move';\n _this.viewerContainer.style.cursor = '-webkit-grab';\n _this.viewerContainer.style.cursor = '-moz-grab';\n _this.viewerContainer.style.cursor = 'grab';\n }\n }\n _this.isViewerMouseDown = false;\n }\n };\n this.viewerContainerOnMouseWheel = function (event) {\n _this.isViewerMouseWheel = true;\n if (_this.getRerenderCanvasCreated()) {\n event.preventDefault();\n }\n if (_this.pdfViewer.magnificationModule) {\n _this.pdfViewer.magnificationModule.pageRerenderOnMouseWheel();\n if (event.ctrlKey) {\n event.preventDefault();\n }\n _this.pdfViewer.magnificationModule.fitPageScrollMouseWheel(event);\n }\n if (_this.pdfViewer.textSelectionModule && !_this.isTextSelectionDisabled) {\n if (_this.isViewerMouseDown) {\n if (!event.target.classList.contains('e-pv-text')) {\n _this.pdfViewer.textSelectionModule.textSelectionOnMouseWheel(_this.currentPageNumber - 1);\n }\n }\n }\n };\n this.viewerContainerOnKeyDown = function (event) {\n var isMac = navigator.platform.match(/(Mac|iPhone|iPod|iPad)/i) ? true : false;\n var isCommandKey = isMac ? event.metaKey : false;\n if (event.ctrlKey || isCommandKey) {\n // add keycodes if shift key is used.\n if ((event.shiftKey && !isMac) || (isMac && !event.shiftKey)) {\n switch (event.keyCode) {\n case 38: // up arrow\n case 33: // page up\n event.preventDefault();\n if (_this.currentPageNumber !== 1) {\n _this.updateScrollTop(0);\n }\n break;\n case 40: // down arrow\n case 34: // page down\n event.preventDefault();\n if (_this.currentPageNumber !== _this.pageCount) {\n _this.updateScrollTop(_this.pageCount - 1);\n }\n break;\n default:\n break;\n }\n }\n switch (event.keyCode) {\n case 79: // o key\n if (_this.pdfViewer.toolbarModule && _this.pdfViewer.enableToolbar) {\n _this.pdfViewer.toolbarModule.openFileDialogBox(event);\n }\n break;\n case 67: // c key\n if (_this.pdfViewer.textSelectionModule && _this.pdfViewer.enableTextSelection && !_this.isTextSelectionDisabled) {\n event.preventDefault();\n _this.pdfViewer.textSelectionModule.copyText();\n }\n break;\n case 70: // f key\n if (_this.pdfViewer.textSearchModule && _this.pdfViewer.enableTextSearch) {\n event.preventDefault();\n _this.pdfViewer.toolbarModule.textSearchButtonHandler();\n }\n break;\n case 90: //z key\n if (_this.pdfViewer.annotationModule) {\n _this.pdfViewer.annotationModule.undo();\n }\n break;\n case 89: //y key\n if (_this.pdfViewer.annotationModule) {\n _this.pdfViewer.annotationModule.redo();\n }\n break;\n default:\n break;\n }\n }\n else {\n switch (event.keyCode) {\n case 46:\n if (_this.isTextMarkupAnnotationModule() && !_this.getPopupNoteVisibleStatus()) {\n _this.pdfViewer.annotationModule.deleteAnnotation();\n }\n }\n }\n if (_this.pdfViewer.magnificationModule) {\n _this.pdfViewer.magnificationModule.magnifyBehaviorKeyDown(event);\n }\n };\n this.viewerContainerOnMousemove = function (event) {\n _this.mouseX = event.clientX;\n _this.mouseY = event.clientY;\n // tslint:disable-next-line\n var isIE = !!document.documentMode;\n if (_this.isViewerMouseDown) {\n // tslint:disable-next-line:max-line-length\n if (_this.pdfViewer.textSelectionModule && _this.pdfViewer.enableTextSelection && !_this.isTextSelectionDisabled && !_this.getPopupNoteVisibleStatus()) {\n // text selection won't perform if we start the selection from hyperlink content by commenting this line.\n // this region block the toc/hyperlink navigation on sometimes.\n // if ((event.target as HTMLElement).classList.contains('e-pv-hyperlink') && this.pdfViewer.linkAnnotationModule) {\n // this.pdfViewer.linkAnnotationModule.modifyZindexForHyperlink((event.target as HTMLElement), true);\n // }\n if (!isIE) {\n event.preventDefault();\n _this.pdfViewer.textSelectionModule.textSelectionOnMouseMove(event.target, _this.mouseX, _this.mouseY);\n }\n else {\n var selection = window.getSelection();\n if (!selection.type && !selection.isCollapsed && selection.anchorNode !== null) {\n _this.pdfViewer.textSelectionModule.isTextSelection = true;\n }\n }\n }\n else {\n event.preventDefault();\n }\n }\n if (_this.isTextMarkupAnnotationModule() && !_this.getPopupNoteVisibleStatus()) {\n _this.pdfViewer.annotationModule.textMarkupAnnotationModule.onTextMarkupAnnotationMouseMove(event);\n }\n if (_this.isPanMode) {\n _this.panOnMouseMove(event);\n }\n };\n this.panOnMouseMove = function (event) {\n // tslint:disable-next-line:max-line-length\n if (_this.viewerContainer.contains(event.target) && (event.target !== _this.viewerContainer) && (event.target !== _this.pageContainer)) {\n if (_this.isViewerMouseDown) {\n var deltaX = _this.dragX - event.pageX;\n var deltaY = _this.dragY - event.pageY;\n _this.viewerContainer.scrollTop = _this.viewerContainer.scrollTop + deltaY;\n _this.viewerContainer.scrollLeft = _this.viewerContainer.scrollLeft + deltaX;\n _this.viewerContainer.style.cursor = 'move';\n _this.viewerContainer.style.cursor = '-webkit-grabbing';\n _this.viewerContainer.style.cursor = '-moz-grabbing';\n _this.viewerContainer.style.cursor = 'grabbing';\n _this.dragX = event.pageX;\n _this.dragY = event.pageY;\n }\n else {\n if (!_this.navigationPane.isNavigationPaneResized) {\n _this.viewerContainer.style.cursor = 'move';\n _this.viewerContainer.style.cursor = '-webkit-grab';\n _this.viewerContainer.style.cursor = '-moz-grab';\n _this.viewerContainer.style.cursor = 'grab';\n }\n }\n }\n else {\n if (!_this.navigationPane.isNavigationPaneResized) {\n _this.viewerContainer.style.cursor = 'auto';\n }\n }\n };\n this.viewerContainerOnMouseLeave = function (event) {\n if (_this.isViewerMouseDown) {\n if (_this.pdfViewer.textSelectionModule && !_this.isTextSelectionDisabled && !_this.getTextMarkupAnnotationMode()) {\n _this.pdfViewer.textSelectionModule.textSelectionOnMouseLeave(event);\n }\n }\n };\n this.viewerContainerOnMouseEnter = function (event) {\n if (_this.pdfViewer.textSelectionModule && !_this.isTextSelectionDisabled) {\n _this.pdfViewer.textSelectionModule.clear();\n }\n };\n this.viewerContainerOnMouseOver = function (event) {\n // tslint:disable-next-line\n var isIE = !!document.documentMode;\n if (_this.isViewerMouseDown) {\n if (!isIE) {\n event.preventDefault();\n }\n }\n };\n this.viewerContainerOnClick = function (event) {\n if (event.type === 'dblclick') {\n if (_this.pdfViewer.textSelectionModule && !_this.isTextSelectionDisabled && !_this.getCurrentTextMarkupAnnotation()) {\n if (event.target.classList.contains('e-pv-text')) {\n _this.isViewerContainerDoubleClick = true;\n _this.pdfViewer.textSelectionModule.selectAWord(event.target, event.clientX, event.clientY, false);\n if (!_this.getTextMarkupAnnotationMode()) {\n _this.pdfViewer.textSelectionModule.maintainSelectionOnZoom(true, false);\n _this.dblClickTimer = setTimeout(function () { _this.applySelection(); }, 100);\n }\n else if (_this.isTextMarkupAnnotationModule() && _this.getTextMarkupAnnotationMode()) {\n // tslint:disable-next-line:max-line-length\n _this.pdfViewer.annotationModule.textMarkupAnnotationModule.drawTextMarkupAnnotations(_this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAddMode);\n }\n }\n }\n else if (_this.getCurrentTextMarkupAnnotation()) {\n // this.pdfViewer.annotationModule.showAnnotationPopup(event);\n }\n }\n else {\n if (event.detail === 3) {\n if (_this.isViewerContainerDoubleClick) {\n clearTimeout(_this.dblClickTimer);\n _this.isViewerContainerDoubleClick = false;\n }\n if (_this.pdfViewer.textSelectionModule && !_this.isTextSelectionDisabled && !_this.getTextMarkupAnnotationMode()) {\n _this.pdfViewer.textSelectionModule.selectEntireLine(event);\n _this.pdfViewer.textSelectionModule.maintainSelectionOnZoom(true, false);\n _this.applySelection();\n }\n }\n }\n };\n this.viewerContainerOnDragStart = function (event) {\n // tslint:disable-next-line\n var isIE = !!document.documentMode;\n if (!isIE) {\n event.preventDefault();\n }\n };\n // tslint:disable-next-line\n this.viewerContainerOnContextMenuClick = function (event) {\n _this.isViewerMouseDown = false;\n };\n // tslint:disable-next-line\n this.onWindowMouseUp = function (event) {\n if (!_this.getPopupNoteVisibleStatus()) {\n if (event.button === 0) {\n if (_this.pdfViewer.textSelectionModule && !_this.isTextSelectionDisabled && !_this.getTextMarkupAnnotationMode()) {\n // tslint:disable-next-line:max-line-length\n if (event.detail === 1 && !_this.viewerContainer.contains(event.target) && !_this.contextMenuModule.contextMenuElement.contains(event.target)) {\n if (window.getSelection().anchorNode !== null) {\n _this.pdfViewer.textSelectionModule.textSelectionOnMouseup();\n }\n }\n if (_this.viewerContainer.contains(event.target)) {\n if (!_this.isClickedOnScrollBar(event) && !_this.isScrollbarMouseDown) {\n _this.pdfViewer.textSelectionModule.textSelectionOnMouseup();\n }\n else {\n if (window.getSelection().anchorNode !== null) {\n _this.pdfViewer.textSelectionModule.applySpanForSelection();\n }\n }\n }\n }\n else if (_this.getTextMarkupAnnotationMode()) {\n // tslint:disable-next-line:max-line-length\n _this.pdfViewer.annotationModule.textMarkupAnnotationModule.drawTextMarkupAnnotations(_this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAddMode);\n }\n }\n else if (event.button === 2) {\n if (_this.viewerContainer.contains(event.target)) {\n window.getSelection().removeAllRanges();\n }\n }\n if (_this.isViewerMouseDown) {\n _this.isViewerMouseDown = false;\n if (_this.pdfViewer.textSelectionModule && !_this.isTextSelectionDisabled) {\n _this.pdfViewer.textSelectionModule.clear();\n _this.pdfViewer.textSelectionModule.selectionStartPage = null;\n }\n event.preventDefault();\n event.stopPropagation();\n return false;\n }\n else {\n return true;\n }\n }\n };\n this.onWindowTouchEnd = function (event) {\n // tslint:disable-next-line:max-line-length\n if (!_this.pdfViewer.element.contains(event.target) && !_this.contextMenuModule.contextMenuElement.contains(event.target)) {\n if (_this.pdfViewer.textSelectionModule && !_this.isTextSelectionDisabled) {\n _this.pdfViewer.textSelectionModule.clearTextSelection();\n }\n }\n };\n this.viewerContainerOnTouchStart = function (event) {\n var touchPoints = event.touches;\n if (_this.pdfViewer.magnificationModule) {\n _this.pdfViewer.magnificationModule.setTouchPoints(touchPoints[0].clientX, touchPoints[0].clientY);\n }\n if (touchPoints.length === 1 && !(event.target.classList.contains('e-pv-hyperlink'))) {\n _this.preventTouchEvent(event);\n }\n if (event.touches.length === 1 && _this.isTextMarkupAnnotationModule() && !_this.getPopupNoteVisibleStatus()) {\n _this.pdfViewer.annotationModule.textMarkupAnnotationModule.onTextMarkupAnnotationTouchEnd(event);\n }\n _this.touchClientX = touchPoints[0].clientX;\n _this.touchClientY = touchPoints[0].clientY;\n _this.scrollY = touchPoints[0].clientY;\n _this.previousTime = new Date().getTime();\n // tslint:disable-next-line:max-line-length\n if (touchPoints.length === 1 && !(event.target.classList.contains('e-pv-touch-select-drop') || event.target.classList.contains('e-pv-touch-ellipse'))) {\n if (Browser.isDevice && _this.pageCount > 0 && !_this.isThumb && !(event.target.classList.contains('e-pv-hyperlink'))) {\n _this.handleTaps(touchPoints);\n }\n if (_this.pdfViewer.textSelectionModule && !_this.isTextSelectionDisabled) {\n _this.pdfViewer.textSelectionModule.clearTextSelection();\n _this.contextMenuModule.contextMenuObj.close();\n // event.preventDefault();\n if (!_this.isLongTouchPropagated) {\n _this.longTouchTimer = setTimeout(function () { _this.viewerContainerOnLongTouch(event); }, 1000);\n }\n _this.isLongTouchPropagated = true;\n }\n }\n };\n this.viewerContainerOnLongTouch = function (event) {\n _this.touchClientX = event.touches[0].clientX;\n _this.touchClientY = event.touches[0].clientY;\n event.preventDefault();\n if (_this.pdfViewer.textSelectionModule) {\n _this.pdfViewer.textSelectionModule.initiateTouchSelection(event, _this.touchClientX, _this.touchClientY);\n if (Browser.isDevice) {\n clearTimeout(_this.singleTapTimer);\n _this.tapCount = 0;\n }\n }\n };\n this.viewerContainerOnPointerDown = function (event) {\n if (event.pointerType === 'touch') {\n _this.pointerCount++;\n if (_this.pointerCount <= 2) {\n event.preventDefault();\n _this.pointersForTouch.push(event);\n if (_this.pointerCount === 2) {\n _this.pointerCount = 0;\n }\n if (_this.pdfViewer.magnificationModule) {\n _this.pdfViewer.magnificationModule.setTouchPoints(event.clientX, event.clientY);\n }\n }\n }\n };\n this.viewerContainerOnTouchMove = function (event) {\n if (Browser.isDevice) {\n clearTimeout(_this.singleTapTimer);\n _this.tapCount = 0;\n }\n _this.preventTouchEvent(event);\n var touchPoints = event.touches;\n if (_this.pdfViewer.magnificationModule) {\n _this.isTouchScrolled = true;\n if (touchPoints.length > 1 && _this.pageCount > 0) {\n if (Browser.isDevice) {\n _this.isTouchScrolled = false;\n _this.mobileScrollerContainer.style.display = 'none';\n }\n // tslint:disable-next-line:max-line-length\n _this.pdfViewer.magnificationModule.initiatePinchMove(touchPoints[0].clientX, touchPoints[0].clientY, touchPoints[1].clientX, touchPoints[1].clientY);\n }\n else if (touchPoints.length === 1 && _this.getPagesPinchZoomed()) {\n if (Browser.isDevice) {\n _this.isTouchScrolled = false;\n _this.mobileScrollerContainer.style.display = 'none';\n }\n _this.pdfViewer.magnificationModule.pinchMoveScroll();\n }\n }\n touchPoints = null;\n };\n this.viewerContainerOnPointerMove = function (event) {\n if (event.pointerType === 'touch' && _this.pageCount > 0) {\n event.preventDefault();\n if (_this.pointersForTouch.length === 2) {\n for (var i = 0; i < _this.pointersForTouch.length; i++) {\n if (event.pointerId === _this.pointersForTouch[i].pointerId) {\n _this.pointersForTouch[i] = event;\n break;\n }\n }\n if (_this.pdfViewer.magnificationModule) {\n // tslint:disable-next-line:max-line-length\n _this.pdfViewer.magnificationModule.initiatePinchMove(_this.pointersForTouch[0].clientX, _this.pointersForTouch[0].clientY, _this.pointersForTouch[1].clientX, _this.pointersForTouch[1].clientY);\n }\n }\n }\n };\n this.viewerContainerOnTouchEnd = function (event) {\n if (_this.pdfViewer.magnificationModule) {\n _this.pdfViewer.magnificationModule.pinchMoveEnd();\n }\n _this.isLongTouchPropagated = false;\n clearInterval(_this.longTouchTimer);\n _this.longTouchTimer = null;\n if (Browser.isDevice && _this.isTouchScrolled) {\n _this.currentTime = new Date().getTime();\n var duration = _this.currentTime - _this.previousTime;\n // tslint:disable-next-line\n var difference = _this.scrollY - event.changedTouches[0].pageY;\n // tslint:disable-next-line\n var speed = (difference) / (duration);\n if (Math.abs(speed) > 1.5) {\n // tslint:disable-next-line\n var scrollTop = (difference) + ((duration) * speed);\n _this.viewerContainer.scrollTop += scrollTop;\n _this.updateMobileScrollerPosition();\n }\n }\n };\n this.viewerContainerOnPointerEnd = function (event) {\n if (event.pointerType === 'touch') {\n event.preventDefault();\n if (_this.pdfViewer.magnificationModule) {\n _this.pdfViewer.magnificationModule.pinchMoveEnd();\n }\n _this.pointersForTouch = [];\n _this.pointerCount = 0;\n }\n };\n // tslint:disable-next-line\n this.viewerContainerOnScroll = function (event) {\n var proxy = _this;\n var scrollposX = 0;\n var scrollposY = 0;\n if (event.touches && Browser.isDevice) {\n // tslint:disable-next-line\n var ratio = (_this.viewerContainer.scrollHeight - _this.viewerContainer.clientHeight) / (_this.viewerContainer.clientHeight - _this.toolbarHeight);\n if (_this.isThumb) {\n _this.ispageMoved = true;\n _this.mobilePageNoContainer.style.display = 'block';\n scrollposX = event.touches[0].pageX - _this.scrollX;\n scrollposY = event.touches[0].pageY - _this.viewerContainer.offsetTop;\n _this.viewerContainer.scrollTop = scrollposY * ratio;\n // tslint:disable-next-line\n var containerValue = event.touches[0].pageY;\n if (_this.viewerContainer.scrollTop !== 0 && ((containerValue) <= _this.viewerContainer.clientHeight)) {\n _this.mobileScrollerContainer.style.top = containerValue + 'px';\n }\n }\n else if (event.touches[0].target.className !== 'e-pv-touch-ellipse') {\n _this.mobilePageNoContainer.style.display = 'none';\n scrollposY = _this.touchClientY - event.touches[0].pageY;\n scrollposX = _this.touchClientX - event.touches[0].pageX;\n _this.viewerContainer.scrollTop = _this.viewerContainer.scrollTop + (scrollposY);\n _this.viewerContainer.scrollLeft = _this.viewerContainer.scrollLeft + (scrollposX);\n // tslint:disable-next-line\n _this.updateMobileScrollerPosition();\n _this.touchClientY = event.touches[0].pageY;\n _this.touchClientX = event.touches[0].pageX;\n }\n }\n if (_this.scrollHoldTimer) {\n clearTimeout(_this.scrollHoldTimer);\n }\n var pageIndex = _this.currentPageNumber;\n _this.scrollHoldTimer = null;\n _this.contextMenuModule.contextMenuObj.close();\n var verticalScrollValue = _this.viewerContainer.scrollTop;\n // tslint:disable-next-line:max-line-length\n for (var i = 0; i < _this.pageCount; i++) {\n if (_this.pageSize[i] != null) {\n var pageHeight = _this.getPageHeight(i);\n // tslint:disable-next-line:max-line-length\n if ((verticalScrollValue + _this.pageStopValue) <= (_this.getPageTop(i) + pageHeight)) {\n _this.currentPageNumber = i + 1;\n break;\n }\n }\n }\n // tslint:disable-next-line:max-line-length\n if (_this.pdfViewer.magnificationModule && _this.pdfViewer.magnificationModule.fitType === 'fitToPage' && _this.currentPageNumber > 0) {\n _this.viewerContainer.scrollTop = _this.pageSize[_this.currentPageNumber - 1].top * _this.getZoomFactor();\n }\n _this.renderElementsVirtualScroll(_this.currentPageNumber);\n // tslint:disable-next-line:max-line-length\n if (!_this.isViewerMouseDown && !_this.getPinchZoomed() && !_this.getPinchScrolled() && !_this.getPagesPinchZoomed() || _this.isViewerMouseWheel) {\n _this.pageViewScrollChanged(_this.currentPageNumber);\n _this.isViewerMouseWheel = false;\n }\n else {\n _this.showPageLoadingIndicator(_this.currentPageNumber - 1, false);\n }\n if (_this.pdfViewer.toolbarModule) {\n _this.pdfViewer.toolbarModule.updateCurrentPage(_this.currentPageNumber);\n _this.viewerContainer.setAttribute('aria-labelledby', _this.pdfViewer.element.id + '_pageDiv_' + (_this.currentPageNumber - 1));\n if (!Browser.isDevice) {\n _this.pdfViewer.toolbarModule.updateNavigationButtons();\n }\n }\n if (pageIndex !== _this.currentPageNumber) {\n if (proxy.pdfViewer.thumbnailViewModule && !Browser.isDevice) {\n proxy.pdfViewer.thumbnailViewModule.gotoThumbnailImage(proxy.currentPageNumber - 1);\n proxy.pdfViewer.thumbnailViewModule.isThumbnailClicked = false;\n }\n _this.pdfViewer.firePageChange(pageIndex);\n }\n if (_this.pdfViewer.magnificationModule) {\n _this.pdfViewer.magnificationModule.updatePagesForFitPage(_this.currentPageNumber - 1);\n }\n var currentPage = _this.getElement('_pageDiv_' + (_this.currentPageNumber - 1));\n if (currentPage) {\n currentPage.style.visibility = 'visible';\n }\n if (_this.isViewerMouseDown) {\n if (_this.getRerenderCanvasCreated()) {\n _this.pdfViewer.magnificationModule.clearIntervalTimer();\n }\n _this.scrollHoldTimer = setTimeout(function () { _this.initiatePageViewScrollChanged(); }, 100);\n }\n };\n this.pdfViewer = viewer;\n this.navigationPane = new NavigationPane(this.pdfViewer, this);\n this.textLayer = new TextLayer(this.pdfViewer, this);\n }\n /**\n * @private\n */\n PdfViewerBase.prototype.initializeComponent = function () {\n var element = document.getElementById(this.pdfViewer.element.id);\n if (element) {\n if (Browser.isDevice) {\n this.pdfViewer.element.classList.add('e-pv-mobile-view');\n }\n var controlWidth = '100%';\n var toolbarDiv = void 0;\n // tslint:disable-next-line:max-line-length\n this.viewerMainContainer = createElement('div', { id: this.pdfViewer.element.id + '_viewerMainContainer', className: 'e-pv-viewer-main-container' });\n // tslint:disable-next-line:max-line-length\n this.viewerContainer = createElement('div', { id: this.pdfViewer.element.id + '_viewerContainer', className: 'e-pv-viewer-container', attrs: { 'aria-label': 'pdfviewer scroll view' } });\n if (Browser.isDevice) {\n this.createMobilePageNumberContainer();\n }\n this.viewerContainer.tabIndex = 0;\n if (this.pdfViewer.enableRtl) {\n this.viewerContainer.style.direction = 'rtl';\n }\n element.style.touchAction = 'pan-x pan-y';\n this.setMaximumHeight(element);\n // tslint:disable-next-line:max-line-length\n this.mainContainer = createElement('div', { id: this.pdfViewer.element.id + '_mainContainer', className: 'e-pv-main-container' });\n this.mainContainer.appendChild(this.viewerMainContainer);\n element.appendChild(this.mainContainer);\n if (this.pdfViewer.toolbarModule) {\n this.navigationPane.initializeNavigationPane();\n toolbarDiv = this.pdfViewer.toolbarModule.intializeToolbar(controlWidth);\n }\n if (toolbarDiv) {\n // tslint:disable-next-line:max-line-length\n this.viewerContainer.style.height = this.updatePageHeight(this.pdfViewer.element.getBoundingClientRect().height, 56);\n }\n else {\n this.viewerContainer.style.height = this.updatePageHeight(this.pdfViewer.element.getBoundingClientRect().height, 0);\n }\n // tslint:disable-next-line:max-line-length\n var viewerWidth = this.pdfViewer.element.clientWidth;\n if (!Browser.isDevice) {\n viewerWidth = viewerWidth - (this.navigationPane.sideBarToolbar ? this.navigationPane.getViewerContainerLeft() : 0);\n }\n this.viewerContainer.style.width = viewerWidth + 'px';\n this.viewerMainContainer.appendChild(this.viewerContainer);\n if (Browser.isDevice) {\n this.mobileScrollerContainer.style.left = (viewerWidth - parseFloat(this.mobileScrollerContainer.style.width)) + 'px';\n this.mobilePageNoContainer.style.left = (viewerWidth / 2) - (parseFloat(this.mobilePageNoContainer.style.width) / 2) + 'px';\n this.mobilePageNoContainer.style.top = (this.pdfViewer.element.clientHeight / 2) + 'px';\n this.mobilePageNoContainer.style.display = 'none';\n this.mobilePageNoContainer.appendChild(this.mobilecurrentPageContainer);\n this.mobilePageNoContainer.appendChild(this.mobilenumberContainer);\n this.mobilePageNoContainer.appendChild(this.mobiletotalPageContainer);\n this.viewerContainer.appendChild(this.mobilePageNoContainer);\n this.viewerMainContainer.appendChild(this.mobileScrollerContainer);\n this.mobileScrollerContainer.appendChild(this.mobileSpanContainer);\n }\n // tslint:disable-next-line:max-line-length\n this.pageContainer = createElement('div', { id: this.pdfViewer.element.id + '_pageViewContainer', className: 'e-pv-page-container', attrs: { 'tabindex': '0', 'aria-label': 'pdfviewer Page View' } });\n if (this.pdfViewer.enableRtl) {\n this.pageContainer.style.direction = 'ltr';\n }\n this.viewerContainer.appendChild(this.pageContainer);\n this.pageContainer.style.width = this.viewerContainer.clientWidth + 'px';\n if (toolbarDiv && this.pdfViewer.thumbnailViewModule && !Browser.isDevice) {\n this.pdfViewer.thumbnailViewModule.createThumbnailContainer();\n }\n this.createPrintPopup();\n if (Browser.isDevice) {\n this.createGoToPagePopup();\n }\n this.waitingPopup = createElement('div', { id: this.pdfViewer.element.id + '_loadingIndicator' });\n this.viewerContainer.appendChild(this.waitingPopup);\n createSpinner({ target: this.waitingPopup, cssClass: 'e-spin-center' });\n this.setLoaderProperties(this.waitingPopup);\n this.contextMenuModule = new ContextMenu(this.pdfViewer, this);\n this.contextMenuModule.createContextMenu();\n this.wireEvents();\n if (this.pdfViewer.textSearchModule && !Browser.isDevice) {\n this.pdfViewer.textSearchModule.createTextSearchBox();\n }\n if (this.pdfViewer.documentPath) {\n this.pdfViewer.load(this.pdfViewer.documentPath, null);\n }\n if (this.pdfViewer.annotationModule) {\n this.pdfViewer.annotationModule.initializeCollection();\n }\n }\n };\n PdfViewerBase.prototype.createMobilePageNumberContainer = function () {\n // tslint:disable-next-line:max-line-length\n this.mobilePageNoContainer = createElement('div', { id: this.pdfViewer.element.id + '_mobilepagenoContainer', className: 'e-pv-mobilepagenoscroll-container' });\n // tslint:disable-next-line:max-line-length\n this.mobilecurrentPageContainer = createElement('span', { id: this.pdfViewer.element.id + '_mobilecurrentpageContainer', className: 'e-pv-mobilecurrentpage-container' });\n // tslint:disable-next-line:max-line-length\n this.mobilenumberContainer = createElement('span', { id: this.pdfViewer.element.id + '_mobiledashedlineContainer', className: 'e-pv-mobiledashedline-container' });\n // tslint:disable-next-line:max-line-length\n this.mobiletotalPageContainer = createElement('span', { id: this.pdfViewer.element.id + '_mobiletotalpageContainer', className: 'e-pv-mobiletotalpage-container' });\n this.mobileScrollerContainer = createElement('div', { id: this.pdfViewer.element.id + '_mobilescrollContainer', className: 'e-pv-mobilescroll-container' });\n // tslint:disable-next-line:max-line-length\n this.mobileSpanContainer = createElement('span', { id: this.pdfViewer.element.id + '_mobilespanContainer', className: 'e-pv-mobilespanscroll-container' });\n this.mobileSpanContainer.innerHTML = '1';\n this.mobilecurrentPageContainer.innerHTML = '1';\n this.mobilenumberContainer.innerHTML = '―――――';\n this.mobileScrollerContainer.style.cssFloat = 'right';\n this.mobileScrollerContainer.style.width = '40px';\n this.mobileScrollerContainer.style.height = '32px';\n this.mobileScrollerContainer.style.zIndex = '100';\n this.mobilePageNoContainer.style.width = '120px';\n this.mobilePageNoContainer.style.height = '100px';\n this.mobilePageNoContainer.style.zIndex = '100';\n this.mobilePageNoContainer.style.position = 'fixed';\n this.mobileScrollerContainer.addEventListener('touchstart', this.mobileScrollContainerDown.bind(this));\n this.mobileScrollerContainer.addEventListener('touchend', this.mobileScrollContainerEnd.bind(this));\n this.mobileScrollerContainer.style.display = 'none';\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.initiatePageRender = function (documentData, password) {\n this.documentId = this.createGUID();\n this.viewerContainer.scrollTop = 0;\n this.showLoadingIndicator(true);\n this.hashId = ' ';\n this.isFileName = false;\n this.saveDocumentInfo();\n documentData = this.checkDocumentData(documentData);\n this.setFileName();\n var jsonObject = this.constructJsonObject(documentData, password);\n this.createAjaxRequest(jsonObject, documentData, password);\n };\n // tslint:disable-next-line\n PdfViewerBase.prototype.mobileScrollContainerDown = function (event) {\n this.ispageMoved = false;\n this.isThumb = true;\n if (this.isTextMarkupAnnotationModule()) {\n if (this.pdfViewer.annotationModule.textMarkupAnnotationModule.selectTextMarkupCurrentPage != null && Browser.isDevice) {\n var pageNumber = this.pdfViewer.annotationModule.textMarkupAnnotationModule.selectTextMarkupCurrentPage;\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.selectTextMarkupCurrentPage = null;\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.clearAnnotationSelection(pageNumber);\n this.pdfViewer.toolbar.showToolbar(true);\n }\n }\n this.mobileScrollerContainer.addEventListener('touchmove', this.viewerContainerOnScroll.bind(this), true);\n };\n // tslint:disable-next-line\n PdfViewerBase.prototype.setMaximumHeight = function (element) {\n if (!Browser.isDevice) {\n element.style.minHeight = '500px';\n }\n };\n // tslint:disable-next-line\n PdfViewerBase.prototype.mobileScrollContainerEnd = function (event) {\n if (!this.ispageMoved) {\n this.goToPagePopup.show();\n }\n this.isThumb = false;\n this.ispageMoved = false;\n this.mobileScrollerContainer.removeEventListener('touchmove', this.viewerContainerOnScroll.bind(this), true);\n this.mobilePageNoContainer.style.display = 'none';\n };\n PdfViewerBase.prototype.createAjaxRequest = function (jsonObject, documentData, password) {\n var _this = this;\n var request = new XMLHttpRequest();\n request.open('POST', this.pdfViewer.serviceUrl + '/' + this.pdfViewer.serverActionSettings.load);\n request.setRequestHeader('Content-Type', 'application/json;charset=UTF-8'); // jshint ignore:line\n request.responseType = 'json';\n request.send(JSON.stringify(jsonObject)); // jshint ignore:line\n // tslint:disable-next-line\n request.onreadystatechange = function (event) {\n if (request.readyState === 4 && request.status === 200) {\n // tslint:disable-next-line\n var data = event.currentTarget.response; // jshint ignore:line\n // tslint:disable-next-line:max-line-length\n if (typeof data !== 'object') {\n data = JSON.parse(data);\n }\n _this.requestSuccess(data, documentData, password);\n }\n else if (request.readyState === 4 && request.status === 400) { // jshint ignore:line\n // error\n _this.pdfViewer.fireAjaxRequestFailed(request.status, request.statusText);\n }\n };\n // tslint:disable-next-line\n request.onerror = function (event) {\n _this.openNotificationPopup();\n _this.showLoadingIndicator(false);\n _this.pdfViewer.fireAjaxRequestFailed(request.status, request.statusText); // jshint ignore:line\n };\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.openNotificationPopup = function () {\n this.textLayer.createNotificationPopup(this.pdfViewer.localeObj.getConstant('Server error'));\n this.getElement('_notify').classList.add('e-pv-notification-large-content');\n };\n // tslint:disable-next-line\n PdfViewerBase.prototype.requestSuccess = function (data, documentData, password) {\n if (data && data.pageCount !== undefined) {\n this.pageCount = data.pageCount;\n this.hashId = data.hashId;\n this.documentLiveCount = data.documentLiveCount;\n this.saveDocumentHashData();\n this.pageRender(data);\n if (Browser.isDevice) {\n this.mobileScrollerContainer.style.display = '';\n this.mobileScrollerContainer.style.top = (this.toolbarHeight) + 'px';\n }\n }\n else {\n this.pageCount = 0;\n this.currentPageNumber = 0;\n if (Browser.isDevice) {\n this.mobileScrollerContainer.style.display = 'none';\n }\n if (data === 4) {\n // 4 is error code for encrypted document.\n this.renderPasswordPopup(documentData, password);\n }\n else if (data === 3) {\n // 3 is error code for corrupted document.\n this.renderCorruptPopup();\n }\n if (this.pdfViewer.toolbarModule) {\n this.pdfViewer.toolbarModule.updateToolbarItems();\n }\n }\n if (this.pdfViewer.thumbnailViewModule && !Browser.isDevice) {\n this.pdfViewer.thumbnailViewModule.createRequestForThumbnails();\n }\n if (this.pdfViewer.bookmarkViewModule) {\n this.pdfViewer.bookmarkViewModule.createRequestForBookmarks();\n }\n };\n // tslint:disable-next-line\n PdfViewerBase.prototype.pageRender = function (data) {\n this.document = null;\n this.passwordDialogReset();\n if (this.passwordPopup) {\n this.passwordPopup.hide();\n }\n var pageIndex = 0;\n this.initPageDiv(data);\n if (this.pdfViewer.magnificationModule) {\n this.pdfViewer.magnificationModule.isAutoZoom = true;\n this.pdfViewer.magnificationModule.isInitialLoading = true;\n this.onWindowResize();\n this.pdfViewer.magnificationModule.isInitialLoading = false;\n }\n this.isDocumentLoaded = true;\n if (this.renderedPagesList.indexOf(pageIndex) === -1) {\n this.createRequestForRender(pageIndex);\n var pageNumber = pageIndex + 1;\n if (this.pageSize[pageNumber]) {\n var pageTop = this.getPageTop(pageNumber);\n var viewerHeight = this.viewerContainer.clientHeight;\n while (viewerHeight > pageTop) {\n if (this.pageSize[pageNumber]) {\n this.renderPageElement(pageNumber);\n this.createRequestForRender(pageNumber);\n pageTop = this.getPageTop(pageNumber);\n pageNumber = pageNumber + 1;\n }\n else {\n break;\n }\n }\n }\n }\n this.showLoadingIndicator(false);\n this.currentPageNumber = pageIndex + 1;\n if (this.pdfViewer.toolbarModule) {\n this.pdfViewer.toolbarModule.uploadedDocumentName = null;\n this.pdfViewer.toolbarModule.updateCurrentPage(this.currentPageNumber);\n this.pdfViewer.toolbarModule.updateToolbarItems();\n this.viewerContainer.setAttribute('aria-labelledby', this.pdfViewer.element.id + '_pageDiv_' + (this.currentPageNumber - 1));\n }\n if (Browser.isDevice) {\n this.mobileSpanContainer.innerHTML = this.currentPageNumber.toString();\n this.mobilecurrentPageContainer.innerHTML = this.currentPageNumber.toString();\n }\n };\n PdfViewerBase.prototype.renderPasswordPopup = function (documentData, password) {\n if (!this.isPasswordAvailable) {\n if (this.isFileName) {\n this.document = documentData;\n }\n else {\n this.document = 'data:application/pdf;base64,' + documentData;\n }\n this.createPasswordPopup();\n this.pdfViewer.fireDocumentLoadFailed(true, null);\n this.passwordPopup.show();\n }\n else {\n this.pdfViewer.fireDocumentLoadFailed(true, password);\n this.promptElement.classList.add('e-pv-password-error');\n this.promptElement.textContent = this.pdfViewer.localeObj.getConstant('Invalid Password');\n this.promptElement.focus();\n if (this.isFileName) {\n this.document = documentData;\n }\n else {\n this.document = 'data:application/pdf;base64,' + documentData;\n }\n this.passwordPopup.show();\n }\n };\n PdfViewerBase.prototype.renderCorruptPopup = function () {\n this.pdfViewer.fireDocumentLoadFailed(false, null);\n this.createCorruptedPopup();\n this.documentId = null;\n this.corruptPopup.show();\n };\n PdfViewerBase.prototype.constructJsonObject = function (documentData, password) {\n var jsonObject;\n if (password) {\n this.isPasswordAvailable = true;\n // tslint:disable-next-line:max-line-length\n jsonObject = { document: documentData, password: password, zoomFactor: 1, isFileName: this.isFileName };\n }\n else {\n this.isPasswordAvailable = false;\n jsonObject = { document: documentData, zoomFactor: 1, isFileName: this.isFileName };\n }\n return jsonObject;\n };\n PdfViewerBase.prototype.checkDocumentData = function (documentData) {\n var base64String = documentData.split('base64,')[1];\n if (base64String === undefined) {\n this.isFileName = true;\n if (this.pdfViewer.fileName === null) {\n // tslint:disable-next-line:max-line-length\n var documentStringArray = (documentData.indexOf('\\\\') !== -1) ? documentData.split('\\\\') : documentData.split('/');\n this.pdfViewer.fileName = documentStringArray[documentStringArray.length - 1];\n base64String = documentData;\n }\n }\n return base64String;\n };\n PdfViewerBase.prototype.setFileName = function () {\n if (this.pdfViewer.fileName === null) {\n if (this.pdfViewer.toolbarModule && this.pdfViewer.toolbarModule.uploadedDocumentName !== null) {\n this.pdfViewer.fileName = this.pdfViewer.toolbarModule.uploadedDocumentName;\n }\n else {\n this.pdfViewer.fileName = 'undefined.pdf';\n }\n }\n };\n PdfViewerBase.prototype.saveDocumentInfo = function () {\n window.sessionStorage.setItem('currentDocument', this.documentId);\n window.sessionStorage.setItem('serviceURL', this.pdfViewer.serviceUrl);\n window.sessionStorage.setItem('unload', this.pdfViewer.serverActionSettings.unload);\n };\n PdfViewerBase.prototype.saveDocumentHashData = function () {\n window.sessionStorage.setItem('hashId', this.hashId);\n window.sessionStorage.setItem('documentLiveCount', this.documentLiveCount.toString());\n };\n PdfViewerBase.prototype.updateWaitingPopup = function (pageNumber) {\n if (this.pageSize[pageNumber].top != null) {\n // tslint:disable-next-line:max-line-length\n var pageCurrentRect = this.getElement('_pageDiv_' + pageNumber).getBoundingClientRect();\n var waitingPopup = this.getElement('_pageDiv_' + pageNumber).firstChild.firstChild;\n if (pageCurrentRect.top < 0) {\n if (this.toolbarHeight + (this.viewerContainer.clientHeight / 2) - pageCurrentRect.top < pageCurrentRect.height) {\n waitingPopup.style.top = ((this.viewerContainer.clientHeight / 2) - pageCurrentRect.top) - this.toolbarHeight + 'px';\n }\n else {\n if (this.toolbarHeight + (pageCurrentRect.bottom / 2) - pageCurrentRect.top < pageCurrentRect.height) {\n waitingPopup.style.top = ((pageCurrentRect.bottom / 2) - pageCurrentRect.top) - this.toolbarHeight + 'px';\n }\n }\n }\n else {\n waitingPopup.style.top = this.viewerContainer.clientHeight / 2 + 'px';\n }\n if (this.getZoomFactor() > 1.25 && pageCurrentRect.width > this.viewerContainer.clientWidth) {\n waitingPopup.style.left = this.viewerContainer.clientWidth / 2 + 'px';\n }\n else {\n waitingPopup.style.left = pageCurrentRect.width / 2 + 'px';\n }\n }\n };\n PdfViewerBase.prototype.createWaitingPopup = function (pageNumber) {\n // tslint:disable-next-line:max-line-length\n this.waitingPopup = document.getElementById(this.pdfViewer.element.id + '_pageDiv_' + pageNumber);\n if (this.waitingPopup) {\n createSpinner({ target: this.waitingPopup });\n this.setLoaderProperties(this.waitingPopup);\n }\n };\n PdfViewerBase.prototype.showLoadingIndicator = function (isShow) {\n this.waitingPopup = this.getElement('_loadingIndicator');\n if (this.waitingPopup != null) {\n if (isShow) {\n showSpinner(this.waitingPopup);\n }\n else {\n hideSpinner(this.waitingPopup);\n }\n }\n };\n PdfViewerBase.prototype.showPageLoadingIndicator = function (pageIndex, isShow) {\n this.waitingPopup = this.getElement('_pageDiv_' + pageIndex);\n if (this.waitingPopup != null) {\n if (isShow) {\n showSpinner(this.waitingPopup);\n }\n else {\n hideSpinner(this.waitingPopup);\n }\n this.updateWaitingPopup(pageIndex);\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.showPrintLoadingIndicator = function (isShow) {\n this.printWaitingPopup = this.getElement('_printLoadingIndicator');\n if (this.printWaitingPopup != null) {\n if (isShow) {\n this.printMainContainer.style.display = 'block';\n showSpinner(this.printWaitingPopup);\n }\n else {\n this.printMainContainer.style.display = 'none';\n hideSpinner(this.printWaitingPopup);\n }\n }\n };\n PdfViewerBase.prototype.setLoaderProperties = function (element) {\n var spinnerElement = element.firstChild.firstChild.firstChild;\n if (spinnerElement) {\n spinnerElement.style.height = '48px';\n spinnerElement.style.width = '48px';\n spinnerElement.style.transformOrigin = '24px 24px 24px';\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.updateScrollTop = function (pageNumber) {\n // tslint:disable-next-line\n if (this.pageSize[pageNumber] != null) {\n this.viewerContainer.scrollTop = this.getPageTop(pageNumber);\n this.renderElementsVirtualScroll(pageNumber);\n if (this.renderedPagesList.indexOf(pageNumber) === -1) {\n this.createRequestForRender(pageNumber);\n }\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.getZoomFactor = function () {\n if (this.pdfViewer.magnificationModule) {\n return this.pdfViewer.magnificationModule.zoomFactor;\n }\n else {\n // default value\n return 1;\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.getPinchZoomed = function () {\n if (this.pdfViewer.magnificationModule) {\n return this.pdfViewer.magnificationModule.isPinchZoomed;\n }\n else {\n // default value\n return false;\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.getMagnified = function () {\n if (this.pdfViewer.magnificationModule) {\n return this.pdfViewer.magnificationModule.isMagnified;\n }\n else {\n // default value\n return false;\n }\n };\n PdfViewerBase.prototype.getPinchScrolled = function () {\n if (this.pdfViewer.magnificationModule) {\n return this.pdfViewer.magnificationModule.isPinchScrolled;\n }\n else {\n // default value\n return false;\n }\n };\n PdfViewerBase.prototype.getPagesPinchZoomed = function () {\n if (this.pdfViewer.magnificationModule) {\n return this.pdfViewer.magnificationModule.isPagePinchZoomed;\n }\n else {\n // default value\n return false;\n }\n };\n PdfViewerBase.prototype.getPagesZoomed = function () {\n if (this.pdfViewer.magnificationModule) {\n return this.pdfViewer.magnificationModule.isPagesZoomed;\n }\n else {\n // default value\n return false;\n }\n };\n PdfViewerBase.prototype.getRerenderCanvasCreated = function () {\n if (this.pdfViewer.magnificationModule) {\n return this.pdfViewer.magnificationModule.isRerenderCanvasCreated;\n }\n else {\n // default value\n return false;\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.getDocumentId = function () {\n return this.documentId;\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.download = function () {\n if (this.pageCount > 0) {\n this.createRequestForDownload();\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.clear = function (isTriggerEvent) {\n this.isPasswordAvailable = false;\n this.isDocumentLoaded = false;\n this.initiateTextSelectMode();\n if (!Browser.isDevice) {\n if (this.navigationPane.sideBarToolbar) {\n this.navigationPane.clear();\n }\n }\n if (this.pdfViewer.thumbnailViewModule) {\n this.pdfViewer.thumbnailViewModule.clear();\n }\n if (this.pdfViewer.bookmarkViewModule) {\n this.pdfViewer.bookmarkViewModule.clear();\n }\n if (this.pdfViewer.magnificationModule) {\n this.pdfViewer.magnificationModule.clearIntervalTimer();\n }\n if (this.pdfViewer.textSelectionModule) {\n this.pdfViewer.textSelectionModule.clearTextSelection();\n }\n if (this.pdfViewer.textSearchModule) {\n this.pdfViewer.textSearchModule.resetTextSearch();\n }\n if (this.pdfViewer.annotationModule) {\n this.pdfViewer.annotationModule.clear();\n }\n if (this.pdfViewer.annotationModule) {\n this.pdfViewer.annotationModule.initializeCollection();\n }\n if (this.pageSize) {\n this.pageSize = [];\n }\n if (this.renderedPagesList) {\n this.renderedPagesList = [];\n }\n while (this.pageContainer.hasChildNodes()) {\n this.pageContainer.removeChild(this.pageContainer.lastChild);\n }\n if (this.pageCount > 0) {\n this.unloadDocument(null);\n }\n this.windowSessionStorageClear();\n if (this.pinchZoomStorage) {\n this.pinchZoomStorage = [];\n }\n if (isTriggerEvent && this.pageCount > 0) {\n this.pdfViewer.fireDocumentUnload(this.pdfViewer.fileName);\n }\n this.pdfViewer.fileName = null;\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.destroy = function () {\n if (Browser.isDevice) {\n this.pdfViewer.element.classList.remove('e-pv-mobile-view');\n }\n this.unWireEvents();\n this.clear(false);\n this.pageContainer.parentNode.removeChild(this.pageContainer);\n this.viewerContainer.parentNode.removeChild(this.viewerContainer);\n if (this.pdfViewer.thumbnailViewModule) {\n this.pdfViewer.thumbnailViewModule.clear();\n }\n if (this.pdfViewer.bookmarkViewModule) {\n this.pdfViewer.bookmarkViewModule.clear();\n }\n this.contextMenuModule.destroy();\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n PdfViewerBase.prototype.unloadDocument = function (e) {\n var _this = this;\n var documentId = window.sessionStorage.getItem('hashId');\n var documentLiveCount = window.sessionStorage.getItem('documentLiveCount');\n if (documentId !== null) {\n var jsonObject = { hashId: documentId, documentLiveCount: documentLiveCount };\n var request_1 = new XMLHttpRequest();\n request_1.open('POST', window.sessionStorage.getItem('serviceURL') + '/' + window.sessionStorage.getItem('unload'), false);\n request_1.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');\n request_1.send(JSON.stringify(jsonObject));\n // tslint:disable-next-line\n request_1.onreadystatechange = function (event) {\n if (request_1.readyState === 4 && request_1.status === 400) {\n // error message\n _this.pdfViewer.fireAjaxRequestFailed(request_1.status, request_1.statusText);\n }\n };\n // tslint:disable-next-line\n request_1.onerror = function (event) {\n _this.pdfViewer.fireAjaxRequestFailed(request_1.status, request_1.statusText);\n };\n }\n window.sessionStorage.removeItem('hashId');\n window.sessionStorage.removeItem('documentLiveCount');\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.windowSessionStorageClear = function () {\n window.sessionStorage.removeItem('currentDocument');\n window.sessionStorage.removeItem('serviceURL');\n window.sessionStorage.removeItem('unload');\n this.sessionStorage.forEach(function (element) {\n window.sessionStorage.removeItem(element);\n });\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.focusViewerContainer = function () {\n var scrollX = window.scrollX;\n var scrollY = window.scrollY;\n // tslint:disable-next-line\n var parentNode = this.getScrollParent(this.viewerContainer);\n var scrollNodeX = 0;\n var scrollNodeY = 0;\n if (parentNode !== null) {\n scrollNodeX = parentNode.scrollLeft;\n scrollNodeY = parentNode.scrollTop;\n }\n this.viewerContainer.focus();\n if (this.currentPageNumber > 0) {\n this.viewerContainer.setAttribute('aria-labelledby', this.pdfViewer.element.id + '_pageDiv_' + (this.currentPageNumber - 1));\n }\n // tslint:disable-next-line:max-line-length\n if (navigator.userAgent.indexOf('MSIE') !== -1 || navigator.appVersion.indexOf('Trident/') > -1 || navigator.userAgent.indexOf('Edge') !== -1 && parentNode != null) {\n parentNode.scrollLeft = scrollNodeX;\n parentNode.scrollTop = scrollNodeY;\n }\n else if (parentNode !== null) {\n parentNode.scrollTo(scrollNodeX, scrollNodeY);\n }\n window.scrollTo(scrollX, scrollY);\n };\n // tslint:disable-next-line\n PdfViewerBase.prototype.getScrollParent = function (node) {\n if (node === null || node.nodeName === 'HTML') {\n return null;\n }\n var style = getComputedStyle(node);\n if (this.viewerContainer.id !== node.id && (style.overflowY === 'scroll' || style.overflowY === 'auto')) {\n return node;\n }\n else {\n return this.getScrollParent(node.parentNode);\n }\n };\n PdfViewerBase.prototype.createCorruptedPopup = function () {\n var _this = this;\n // tslint:disable-next-line:max-line-length\n var popupElement = createElement('div', { id: this.pdfViewer.element.id + '_corrupted_popup', className: 'e-pv-corrupted-popup' });\n this.pageContainer.appendChild(popupElement);\n this.corruptPopup = new Dialog({\n showCloseIcon: true, closeOnEscape: true, isModal: true,\n // tslint:disable-next-line:max-line-length\n header: '');\n }\n else {\n //ie\n this.frameDoc.document.write('');\n // tslint: disable-next-line:max-line-length\n this.frameDoc.document.write(''\n + '');\n }\n for (var i = 0; i < this.printViewerContainer.children.length; i++) {\n // tslint:disable-next-line:max-line-length\n var canvasUrl = this.printViewerContainer.children[i].toDataURL();\n this.frameDoc.document.write('');\n }\n this.pdfViewerBase.showPrintLoadingIndicator(false);\n if (Browser.isIE || Browser.info.name === 'edge') {\n try {\n this.iframe.contentWindow.document.execCommand('print', false, null);\n }\n catch (e) {\n this.iframe.contentWindow.print();\n }\n }\n else {\n setTimeout(function () {\n _this.iframe.contentWindow.print();\n _this.iframe.contentWindow.focus();\n document.body.removeChild(_this.iframe);\n }, 200);\n }\n };\n /**\n * @private\n */\n Print.prototype.destroy = function () {\n this.printViewerContainer = undefined;\n this.frameDoc = undefined;\n };\n /**\n * @private\n */\n Print.prototype.getModuleName = function () {\n return 'Print';\n };\n return Print;\n}());\nexport { Print };\n","import * as index from '@syncfusion/ej2-pdfviewer';\nindex.PdfViewer.Inject( index.LinkAnnotation,index.BookmarkView,index.Magnification,index.ThumbnailView,index.Toolbar,index.Navigation,index.Print,index.TextSelection,index.TextSearch,index.Annotation);\nexport * from '@syncfusion/ej2-pdfviewer';\n","/**\n * This is a file to perform common utility for OLAP and Relational datasource\n * @hidden\n */\nvar PivotUtil = /** @class */ (function () {\n function PivotUtil() {\n }\n PivotUtil.getType = function (value) {\n var val;\n val = (value && value.getDay) ? (value.getHours() > 0 || value.getMinutes() > 0 ||\n value.getSeconds() > 0 || value.getMilliseconds() > 0 ? 'datetime' : 'date') : typeof (value);\n return val;\n };\n PivotUtil.resetTime = function (date) {\n date.setHours(0, 0, 0, 0);\n return date;\n };\n PivotUtil.getClonedData = function (data) {\n var clonedData = [];\n var fields = Object.keys(data[0]);\n for (var _i = 0, data_1 = data; _i < data_1.length; _i++) {\n var item = data_1[_i];\n var keyPos = 0;\n /* tslint:disable */\n var framedSet = {};\n /* tslint:enable */\n while (keyPos < fields.length) {\n framedSet[fields[keyPos]] = item[fields[keyPos]];\n keyPos++;\n }\n clonedData.push(framedSet);\n }\n return clonedData;\n };\n return PivotUtil;\n}());\nexport { PivotUtil };\n","import { extend, Internationalization, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { DataManager, Query } from '@syncfusion/ej2-data';\nimport { PivotUtil } from './util';\n/**\n * PivotEngine is used to manipulate the relational or Multi-Dimensional data as pivoting values.\n */\n/** @hidden */\nvar PivotEngine = /** @class */ (function () {\n function PivotEngine() {\n /** @hidden */\n this.valueContent = [];\n /** @hidden */\n this.formatFields = {};\n /** @hidden */\n this.calculatedFields = {};\n /** @hidden */\n this.calculatedFormulas = {};\n /** @hidden */\n this.valueAxis = 0;\n /** @hidden */\n this.saveDataHeaders = {};\n /** @hidden */\n this.columnCount = 0;\n /** @hidden */\n this.rowCount = 0;\n /** @hidden */\n this.colFirstLvl = 0;\n /** @hidden */\n this.rowFirstLvl = 0;\n /** @hidden */\n this.rowStartPos = 0;\n /** @hidden */\n this.colStartPos = 0;\n /** @hidden */\n this.enableValueSorting = false;\n /** @hidden */\n this.headerCollection = { rowHeaders: [], columnHeaders: [], rowHeadersCount: 0, columnHeadersCount: 0 };\n /** @hidden */\n this.rMembers = [];\n /** @hidden */\n this.cMembers = [];\n this.valueMatrix = [];\n this.indexMatrix = [];\n this.memberCnt = -1;\n this.pageInLimit = false;\n this.endPos = 0;\n this.removeCount = 0;\n this.colHdrBufferCalculated = false;\n this.colValuesLength = 1;\n this.rowValuesLength = 1;\n this.slicedHeaders = [];\n this.fieldFilterMem = {};\n this.filterPosObj = {};\n this.selectedHeaders = { selectedHeader: [], values: [] };\n this.rawIndexObject = {};\n this.isEditing = false;\n this.data = [];\n this.frameHeaderObjectsCollection = false;\n this.headerObjectsCollection = {};\n /* private makeMirrorObject(elements: number[], obj: NumberIndex): void {\n for (let lp: number = 0, end: number = elements.length; lp < end; lp++) {\n obj[elements[lp]] = elements[lp];\n }\n } */\n }\n PivotEngine.prototype.renderEngine = function (dataSource, customProperties) {\n this.formatFields = {};\n this.calculatedFields = {};\n this.calculatedFormulas = {};\n this.valueAxis = 0;\n this.saveDataHeaders = {};\n this.columnCount = 0;\n this.rowCount = 0;\n this.colFirstLvl = 0;\n this.rowFirstLvl = 0;\n this.rowStartPos = 0;\n this.colStartPos = 0;\n this.enableValueSorting = false;\n this.headerCollection = { rowHeaders: [], columnHeaders: [], rowHeadersCount: 0, columnHeadersCount: 0 };\n this.valueMatrix = [];\n this.indexMatrix = [];\n this.rMembers = [];\n this.cMembers = [];\n this.memberCnt = -1;\n this.pageInLimit = false;\n this.endPos = 0;\n this.removeCount = 0;\n this.colHdrBufferCalculated = false;\n this.colValuesLength = 1;\n this.rowValuesLength = 1;\n this.slicedHeaders = [];\n this.fieldFilterMem = {};\n this.filterPosObj = {};\n this.selectedHeaders = { selectedHeader: [], values: [] };\n this.rawIndexObject = {};\n this.isEditing = false;\n var fields;\n var val;\n var filterRw;\n this.globalize = new Internationalization();\n this.localeObj = customProperties ? customProperties.localeObj : undefined;\n this.enableSort = dataSource.enableSorting;\n this.alwaysShowValueHeader = dataSource.alwaysShowValueHeader;\n this.showSubTotals = isNullOrUndefined(dataSource.showSubTotals) ? true : dataSource.showSubTotals;\n this.showRowSubTotals = isNullOrUndefined(dataSource.showRowSubTotals) ? true : dataSource.showRowSubTotals;\n this.showColumnSubTotals = isNullOrUndefined(dataSource.showColumnSubTotals) ? true : dataSource.showColumnSubTotals;\n this.showGrandTotals = isNullOrUndefined(dataSource.showGrandTotals) ? true : dataSource.showGrandTotals;\n this.showRowGrandTotals = isNullOrUndefined(dataSource.showRowGrandTotals) ? true : dataSource.showRowGrandTotals;\n this.showColumnGrandTotals = isNullOrUndefined(dataSource.showColumnGrandTotals) ? true : dataSource.showColumnGrandTotals;\n this.allowValueFilter = dataSource.allowValueFilter;\n this.isValueFilterEnabled = false;\n this.enableValueSorting = customProperties ? customProperties.enableValueSorting : false;\n this.valueContent = [];\n if (dataSource.data && dataSource.data[0]) {\n this.fields = Object.keys(dataSource.data[0]);\n this.rows = dataSource.rows ? dataSource.rows : [];\n this.columns = dataSource.columns ? dataSource.columns : [];\n this.filters = dataSource.filters ? dataSource.filters : [];\n this.formats = dataSource.formatSettings ? dataSource.formatSettings : [];\n this.values = dataSource.values ? dataSource.values : [];\n this.groups = dataSource.groupSettings ? dataSource.groupSettings : [];\n this.calculatedFieldSettings = dataSource.calculatedFieldSettings ? dataSource.calculatedFieldSettings : [];\n this.enableSort = dataSource.enableSorting === undefined ? true : dataSource.enableSorting;\n fields = this.getGroupData(dataSource.data);\n this.data = dataSource.data;\n this.validateFilters(dataSource);\n this.isExpandAll = (this.isValueFiltersAvail && dataSource.allowValueFilter) ? true : dataSource.expandAll;\n this.drilledMembers =\n dataSource.drilledMembers ? (this.isValueFiltersAvail && dataSource.allowValueFilter) ? [] : dataSource.drilledMembers : [];\n this.isMutiMeasures = this.values.length > 1 ? true : false;\n this.valueAxis = dataSource.valueAxis === 'row' ? 1 : 0;\n this.emptyCellTextContent = dataSource.emptyCellsTextContent ? dataSource.emptyCellsTextContent : '';\n this.rowValuesLength = this.valueAxis === 1 ? this.values.length : 1;\n this.colValuesLength = this.valueAxis === 0 ? this.values.length : 1;\n this.valueSortSettings = dataSource.valueSortSettings ||\n { sortOrder: 'None', headerDelimiter: '.', headerText: '', columnIndex: undefined };\n this.valueSortData = [];\n this.pageSettings = customProperties ? (customProperties.pageSettings ? customProperties.pageSettings : this.pageSettings)\n : undefined;\n this.savedFieldList = customProperties ? customProperties.savedFieldList : undefined;\n this.isDrillThrough = customProperties ? (customProperties.isDrillThrough ? customProperties.isDrillThrough : false) : false;\n this.getFieldList(fields, this.enableSort, dataSource.allowValueFilter);\n this.fillFieldMembers(dataSource.data, this.indexMatrix);\n this.updateSortSettings(dataSource.sortSettings, this.enableSort);\n this.valueMatrix = this.generateValueMatrix(dataSource.data);\n this.filterMembers = [];\n this.updateFilterMembers(dataSource);\n this.generateGridData(dataSource);\n }\n };\n /* tslint:disable */\n PivotEngine.prototype.getGroupData = function (data) {\n var fieldkeySet = data[0];\n var _loop_1 = function (dategroup) {\n var fieldName = dategroup.name;\n if (this_1.fields.indexOf(fieldName) > -1) {\n var groupFields = {};\n if (dategroup.type === 'Number') {\n if (PivotUtil.getType(fieldkeySet[fieldName]) === 'number') {\n if (dategroup.rangeInterval) {\n data.sort(function (a, b) { return (a[fieldName] > b[fieldName]) ? 1 : ((b[fieldName] > a[fieldName]) ? -1 : 0); });\n }\n }\n else {\n return { value: fieldkeySet };\n }\n }\n var len = data.length;\n while (len--) {\n var item = data[len];\n if (item[fieldName] && dategroup.type === 'Date') {\n var date = new Date(item[fieldName].toString());\n if (!isNullOrUndefined(date) && dategroup.groupInterval.length > 0) {\n var isGrouped = false;\n for (var _i = 0, _a = dategroup.groupInterval; _i < _a.length; _i++) {\n var interval = _a[_i];\n isGrouped = true;\n var isInRangeAvail = this_1.getRange(dategroup, date.getTime());\n var newDate = PivotUtil.resetTime(new Date());\n switch (interval) {\n case 'Years':\n {\n var newFieldName = fieldName + '_years';\n groupFields[newFieldName] = interval;\n item[newFieldName] = (isInRangeAvail ? undefined : new Date(newDate.setFullYear(date.getFullYear())).toString());\n }\n break;\n case 'Quarters':\n {\n var newFieldName = fieldName + '_quarters';\n groupFields[newFieldName] = interval;\n var month = Math.ceil((date.getMonth() + 1) / 3);\n item[newFieldName] = (isInRangeAvail ? undefined : 'Qtr' + month.toString());\n }\n break;\n case 'Months':\n {\n var newFieldName = fieldName + '_months';\n groupFields[newFieldName] = interval;\n item[newFieldName] = (isInRangeAvail ? undefined : new Date(newDate.setMonth(date.getMonth(), newDate.getDate())).toString());\n }\n break;\n case 'Days':\n {\n var newFieldName = fieldName + '_days';\n groupFields[newFieldName] = interval;\n item[newFieldName] = (isInRangeAvail ? undefined : new Date(newDate.setMonth(date.getMonth(), date.getDate())).toString());\n }\n break;\n case 'Hours':\n {\n var newFieldName = fieldName + '_hours';\n groupFields[newFieldName] = interval;\n item[newFieldName] = (isInRangeAvail ? undefined : new Date(newDate.setHours(date.getHours())).toString());\n }\n break;\n case 'Minutes':\n {\n var newFieldName = fieldName + '_minutes';\n groupFields[newFieldName] = interval;\n item[newFieldName] = (isInRangeAvail ? undefined : new Date(newDate.setMinutes(date.getMinutes())).toString());\n }\n break;\n case 'Seconds':\n {\n var newFieldName = fieldName + '_seconds';\n groupFields[newFieldName] = interval;\n item[newFieldName] = (isInRangeAvail ? undefined : new Date(newDate.setSeconds(date.getSeconds())).toString());\n }\n break;\n }\n }\n if (isGrouped) {\n delete item[fieldName];\n }\n }\n }\n else {\n var isInRangeAvail = this_1.getRange(dategroup, item[fieldName]);\n item[fieldName] = isInRangeAvail ? undefined : item[fieldName];\n }\n var keys = Object.keys(item);\n var isCompleteSet = [];\n for (var _b = 0, keys_1 = keys; _b < keys_1.length; _b++) {\n var key = keys_1[_b];\n isCompleteSet.push((item[key]) ? true : false);\n }\n ;\n fieldkeySet = (((isCompleteSet.indexOf(false) === -1) && keys.length === Object.keys(data[0]).length) ? item : fieldkeySet);\n }\n if (dategroup.type === 'Date') {\n var isDataSource = false;\n var axisFields = [this_1.rows, this_1.columns, this_1.values, this_1.filters];\n var groupKeys = Object.keys(groupFields);\n var gCnt = Object.keys(groupKeys).length;\n var groupField = void 0;\n for (var _c = 0, axisFields_1 = axisFields; _c < axisFields_1.length; _c++) {\n var axis = axisFields_1[_c];\n if (!isDataSource && axis) {\n var cnt = axis.length;\n var i = 0;\n while (i < cnt) {\n if (axis[i].name === fieldName) {\n var actualField = axis[i];\n axis.splice(i, 1);\n while (gCnt--) {\n groupField = groupFields[groupKeys[gCnt]];\n var newField = {\n name: groupKeys[gCnt],\n caption: (this_1.localeObj ? this_1.localeObj.getConstant(groupField) : groupField) + ' (' + fieldName + ')',\n type: 'Count',\n showNoDataItems: actualField.showNoDataItems,\n baseField: actualField.baseField,\n baseItem: actualField.baseItem,\n };\n axis.splice(i, 0, newField);\n }\n break;\n }\n i++;\n }\n break;\n }\n }\n gCnt = Object.keys(groupKeys).length;\n while (gCnt--) {\n groupField = groupFields[groupKeys[gCnt]];\n var formatfield = new DataManager({ json: this_1.formats }).executeLocal(new Query().where('name', 'equal', groupKeys[gCnt]))[0];\n if (groupField !== 'Quarters' && !formatfield) {\n var formatSettings = {\n name: groupKeys[gCnt],\n type: ['Years', 'Months', 'Days'].indexOf(groupField) > -1 ? 'date' : 'time',\n format: ((groupField === 'Years') ? 'yyyy' : (groupField === 'Months') ? 'MMM' :\n (groupField === 'Days') ? 'd-MMM' : (groupField === 'Hours') ? 'hh a' :\n (groupField === 'Minutes') ? ':mm' : (groupField === 'Seconds') ? ':ss' : undefined)\n };\n this_1.formats.push(formatSettings);\n }\n }\n }\n else if (dategroup.type === 'Number' && dategroup.rangeInterval) {\n var startValue = void 0;\n var endValue = void 0;\n var cStartValue = void 0;\n var cEndValue = void 0;\n var framedSet = [];\n var unframedSet = [];\n var dataLength = data.length;\n var cnt = 0;\n while (cnt < dataLength) {\n unframedSet.push(data[cnt][fieldName]);\n if (data[cnt][fieldName] && framedSet.indexOf(data[cnt][fieldName]) === -1) {\n framedSet.push(data[cnt][fieldName]);\n }\n cnt++;\n }\n var framedSetLength = Math.max.apply(Math, framedSet);\n for (var i = framedSet[0], len_1 = framedSetLength; i < len_1; i++) {\n if (unframedSet.indexOf(i) < 0) {\n var duplicateData = this_1.frameData(data[0]);\n duplicateData[fieldName] = i;\n var index = unframedSet.lastIndexOf(i - 1);\n unframedSet.splice(index + 1, 0, i);\n data.splice(index + 1, 0, duplicateData);\n }\n }\n dataLength = data.length;\n cnt = 0;\n while (cnt < dataLength) {\n if (data[cnt] && data[cnt][fieldName]) {\n cStartValue = data[cnt][fieldName];\n cEndValue = cStartValue + (dategroup.rangeInterval - 1);\n startValue = (!startValue) ? cStartValue : startValue;\n endValue = ((!endValue) ? ((cEndValue > framedSetLength) ? framedSetLength : cEndValue) : ((endValue > framedSetLength) ? framedSetLength : endValue));\n if (cStartValue >= startValue && cStartValue <= endValue) {\n data[cnt][fieldName] = ((startValue === endValue) ? startValue.toString() : startValue.toString() + '-' + endValue.toString());\n }\n else if (cStartValue > endValue && cStartValue === endValue + 1) {\n startValue = endValue + 1;\n endValue = ((startValue + (dategroup.rangeInterval - 1) > framedSetLength) ? framedSetLength : startValue + (dategroup.rangeInterval - 1));\n data[cnt][fieldName] = ((startValue === endValue) ? startValue.toString() : startValue.toString() + '-' + endValue.toString());\n }\n var keys = Object.keys(data[cnt]);\n var isCompleteSet = [];\n for (var _d = 0, keys_2 = keys; _d < keys_2.length; _d++) {\n var key = keys_2[_d];\n isCompleteSet.push((data[cnt][key]) ? true : false);\n }\n ;\n fieldkeySet = (((isCompleteSet.indexOf(false) === -1) && keys.length === Object.keys(data[0]).length) ? data[cnt] : fieldkeySet);\n }\n cnt++;\n }\n var axisFields = [this_1.rows, this_1.columns, this_1.values, this_1.filters];\n for (var _e = 0, axisFields_2 = axisFields; _e < axisFields_2.length; _e++) {\n var fields = axisFields_2[_e];\n var field = new DataManager({ json: fields }).executeLocal(new Query().where('name', 'equal', fieldName))[0];\n if (field) {\n field = field.properties ? field.properties : field;\n field.type = 'Count';\n }\n }\n for (var i = 0, len_2 = this_1.formats.length; i < len_2; i++) {\n if (this_1.formats[i].name === fieldName) {\n this_1.formats.splice(i, 1);\n break;\n }\n }\n }\n }\n else {\n return { value: fieldkeySet };\n }\n };\n var this_1 = this;\n for (var _i = 0, _a = this.groups; _i < _a.length; _i++) {\n var dategroup = _a[_i];\n var state_1 = _loop_1(dategroup);\n if (typeof state_1 === \"object\")\n return state_1.value;\n }\n this.fields = Object.keys(fieldkeySet);\n return fieldkeySet;\n };\n PivotEngine.prototype.frameData = function (data) {\n var fields = Object.keys(data);\n var keyPos = 0;\n var framedSet = {};\n while (keyPos < fields.length) {\n framedSet[fields[keyPos]] = undefined;\n keyPos++;\n }\n return framedSet;\n };\n /* tslint:enable */\n PivotEngine.prototype.getRange = function (group, cValue) {\n var isRangeAvail;\n if (group.type === 'Date') {\n var cDate = new Date(cValue);\n if (group.startingAt && cDate.getTime() < group.startingAt.getTime() ||\n group.endingAt && cDate.getTime() > group.endingAt.getTime()) {\n isRangeAvail = true;\n }\n else {\n isRangeAvail = false;\n }\n }\n else {\n if (group.startingAt && cValue < group.startingAt ||\n group.endingAt && cValue > group.endingAt) {\n isRangeAvail = true;\n }\n else {\n isRangeAvail = false;\n }\n }\n return isRangeAvail;\n };\n PivotEngine.prototype.getFormattedFields = function (fields) {\n var cnt = this.formats.length;\n while (cnt--) {\n this.formatFields[this.formats[cnt].name] = this.formats[cnt];\n // for (let len: number = 0, lnt: number = fields.length; len < lnt; len++) {\n // if (fields[len] && fields[len].name === this.formats[cnt].name) {\n // this.formatFields[fields[len].name] = this.formats[cnt];\n // }\n // }\n }\n };\n PivotEngine.prototype.getFieldList = function (fields, isSort, isValueFilteringEnabled) {\n var type;\n var keys = this.fields;\n var dataFields = extend([], this.rows, null, true);\n dataFields = dataFields.concat(this.columns, this.values, this.filters);\n this.getFormattedFields(dataFields);\n this.getCalculatedField(keys);\n keys = this.fields;\n var len = keys.length;\n if (this.savedFieldList) {\n this.fieldList = this.savedFieldList;\n while (len--) { /** while is used for better performance than for */\n var key = keys[len];\n if (this.fieldList[key]) {\n this.fieldList[key].isSelected = false;\n this.fieldList[key].index = len;\n this.fieldList[key].filter = [];\n this.fieldList[key].isExcelFilter = false;\n this.fieldList[key].filterType = '';\n if (this.isValueFiltersAvail && isValueFilteringEnabled) {\n this.fieldList[key].dateMember = [];\n this.fieldList[key].formattedMembers = {};\n this.fieldList[key].members = {};\n }\n }\n else {\n this.fieldList[key] = {\n id: key,\n caption: key,\n type: (type === undefined || type === 'undefined') ? 'number' : type,\n filterType: '',\n index: len,\n filter: [],\n sort: isSort ? 'Ascending' : 'None',\n isSelected: false\n };\n }\n }\n }\n else {\n while (len--) { /** while is used for better performance than for */\n var key = keys[len];\n type = PivotUtil.getType(fields[key]);\n if (!this.fieldList) {\n this.fieldList = {};\n }\n this.fieldList[key] = {\n id: key,\n caption: key,\n type: (type === undefined || type === 'undefined') ? 'number' : type,\n filterType: '',\n index: len,\n filter: [],\n sort: isSort ? 'Ascending' : 'None',\n isSelected: false\n };\n }\n }\n this.updateTreeViewData(dataFields);\n };\n PivotEngine.prototype.updateFieldList = function (savedFieldList) {\n var keys = this.fields;\n var len = keys.length;\n while (len--) { /** while is used for better performance than for */\n this.fieldList[keys[len]].isExcelFilter = savedFieldList[keys[len]].isExcelFilter;\n }\n };\n PivotEngine.prototype.updateTreeViewData = function (fields) {\n var cnt = fields.length;\n var lnt = this.calculatedFieldSettings.length;\n while (cnt--) {\n if (this.fieldList[fields[cnt].name]) {\n var field = this.fieldList[fields[cnt].name];\n field.caption = fields[cnt].caption ? fields[cnt].caption : fields[cnt].name;\n field.isSelected = true;\n field.showNoDataItems = fields[cnt].showNoDataItems;\n field.aggregateType = fields[cnt].type;\n field.baseField = fields[cnt].baseField;\n field.baseItem = fields[cnt].baseItem;\n }\n }\n while (lnt--) {\n this.fieldList[this.calculatedFieldSettings[lnt].name].aggregateType = 'CalculatedField';\n this.fieldList[this.calculatedFieldSettings[lnt].name].formula = this.calculatedFieldSettings[lnt].formula;\n }\n };\n /* tslint:disable:typedef */\n PivotEngine.prototype.getCalculatedField = function (keys) {\n for (var _i = 0, _a = this.calculatedFieldSettings; _i < _a.length; _i++) {\n var field = _a[_i];\n this.calculatedFields[field.name] = extend({}, field, null, true);\n this.calculatedFields[field.name].actualFormula = field.formula;\n }\n var fieldKeys = Object.keys(this.calculatedFields);\n var _loop_2 = function (calc, cnt) {\n var field = this_2.calculatedFields[fieldKeys[calc]];\n var calcProperties = field.properties;\n var actualFormula = (calcProperties ? calcProperties.formula : field.formula).replace(/ +/g, '');\n var formula = actualFormula.replace(/\"/g, '');\n field.formula = formula.indexOf('^') > -1 ? this_2.powerFunction(formula) : formula;\n field.name = calcProperties ? calcProperties.name : field.name;\n keys = keys.filter(function (key) { return key !== field.name; });\n keys.push(field.name);\n var formulaType = actualFormula.split('\\\"');\n for (var len = 0, lmt = formulaType.length; len < lmt; len++) {\n var type = formulaType[len];\n var aggregateValue = type.split(/[ .:;?!~,`\"&|()<>{}\\[\\]\\r\\n/\\\\]+/);\n var selectedString = (aggregateValue[0] === 'DistinctCount' ?\n 'DistinctCount' : aggregateValue[0] === 'PopulationStDev' ?\n 'PopulationStDev' : aggregateValue[0] === 'SampleStDev' ? 'SampleStDev' : aggregateValue[0] === 'PopulationVar' ?\n 'PopulationVar' : aggregateValue[0] === 'SampleVar' ? 'SampleVar' : aggregateValue[0]);\n if (['Sum', 'Count', 'Min', 'Max', 'Avg', 'Product', 'DistinctCount',\n 'PopulationStDev', 'SampleStDev', 'PopulationVar', 'SampleVar'].indexOf(selectedString) !== -1) {\n var index = keys.indexOf(aggregateValue[1]);\n if (!this_2.calculatedFormulas[field.name]) {\n this_2.calculatedFormulas[field.name] = [{\n index: index,\n type: selectedString,\n formula: type,\n }];\n }\n else {\n this_2.calculatedFormulas[field.name].push({\n index: index,\n type: selectedString,\n formula: type,\n });\n }\n }\n }\n };\n var this_2 = this;\n for (var calc = 0, cnt = fieldKeys.length; calc < cnt; calc++) {\n _loop_2(calc, cnt);\n }\n this.fields = keys;\n };\n PivotEngine.prototype.validateFilters = function (data) {\n this.isValueFiltersAvail = false;\n var filterElements = data.filterSettings ? data.filterSettings : [];\n var dataFields = extend([], this.rows, null, true);\n dataFields = dataFields.concat(this.columns);\n for (var _i = 0, filterElements_1 = filterElements; _i < filterElements_1.length; _i++) {\n var filter = filterElements_1[_i];\n for (var _a = 0, dataFields_1 = dataFields; _a < dataFields_1.length; _a++) {\n var field = dataFields_1[_a];\n if (filter.name === field.name && filter.type === 'Value') {\n this.isValueFiltersAvail = true;\n break;\n }\n }\n if (this.isValueFiltersAvail) {\n break;\n }\n }\n };\n PivotEngine.prototype.fillFieldMembers = function (data, indMat) {\n var keys = this.fields;\n var dlen = data.length;\n var fList = this.fieldList;\n var kLn = keys.length;\n for (var kl = 0; kl < kLn; kl++) {\n var key = keys[kl];\n if (!fList[key].members) {\n fList[key].members = {};\n }\n if (!fList[key].formattedMembers) {\n fList[key].formattedMembers = {};\n }\n if (!fList[key].dateMember) {\n fList[key].dateMember = [];\n }\n var members = fList[key].members;\n var isDataAvail = Object.keys(members).length > 0 ? true : false;\n var formattedMembers = fList[key].formattedMembers;\n var dateMember = fList[key].dateMember;\n var membersCnt = 0;\n var fmembersCnt = 0;\n //let sort: string[] = [];\n for (var dl = 0; dl < dlen; dl++) {\n var mkey = data[dl][key];\n if (!isNullOrUndefined(mkey)) {\n if (!isDataAvail) {\n var fKey = mkey;\n var formattedValue = (this.pageSettings && !(this.formatFields[key] &&\n (['date', 'dateTime', 'time'].indexOf(this.formatFields[key].type) > -1))) ? ({\n formattedText: isNullOrUndefined(mkey) ? mkey : mkey.toString(),\n actualText: mkey\n }) : this.getFormattedValue(mkey, key);\n if (formattedValue.formattedText) {\n fKey = formattedValue.formattedText;\n }\n if (!members.hasOwnProperty(mkey)) {\n membersCnt++;\n members[mkey] = {\n index: [dl], ordinal: membersCnt,\n isDrilled: this.isExpandAll ? true : false\n };\n /* tslint:disable-next-line:max-line-length */\n dateMember.push({ formattedText: formattedValue.formattedText, actualText: (formattedValue.dateText ? formattedValue.dateText : formattedValue.actualText) });\n //sort.push(mkey);\n }\n else {\n members[mkey].index.push(dl);\n }\n if (!formattedMembers.hasOwnProperty(fKey)) {\n fmembersCnt++;\n formattedMembers[fKey] = {\n index: [dl], ordinal: fmembersCnt,\n isDrilled: this.isExpandAll ? true : false\n };\n }\n else {\n formattedMembers[fKey].index.push(dl);\n }\n }\n if (!(indMat[dl])) {\n indMat[dl] = [];\n indMat[dl][kl] = members[mkey].ordinal;\n }\n else {\n indMat[dl][kl] = members[mkey].ordinal;\n }\n }\n }\n /*sort = Object.keys(members).sort();\n let sortedMembers: Members = {};\n for (let sln: number = 0, slt: number = sort.length; sln < slt; sln++) {\n sortedMembers[sort[sln]] = members[sort[sln]];\n }\n fList[key].members = sortedMembers; */\n }\n this.fillDrilledInfo();\n };\n PivotEngine.prototype.fillDrilledInfo = function () {\n for (var key = 0; key < this.drilledMembers.length; key++) {\n var fieldName = this.drilledMembers[key].name;\n for (var mem = 0; mem < this.drilledMembers[key].items.length; mem++) {\n var memberName = this.drilledMembers[key].items[mem];\n var field = this.fieldList[fieldName];\n if (field && field.members[memberName]) {\n field.members[memberName].isDrilled = this.isExpandAll ? false : true;\n }\n }\n }\n };\n PivotEngine.prototype.generateValueMatrix = function (data) {\n var keys = this.fields;\n var len = data.length;\n var vMat = [];\n var keyLen = keys.length;\n var flList = this.fieldList;\n while (len--) {\n var record = data[len];\n var tkln = keyLen;\n //if (isNullOrUndefined(vMat[len])) {\n vMat[len] = [];\n //}\n while (tkln--) {\n var key = keys[tkln];\n vMat[len][tkln] = (flList[key].type === 'number') ? data[len][key] : 1;\n }\n }\n return vMat;\n };\n PivotEngine.prototype.updateSortSettings = function (sortSettings, isSort) {\n for (var sln = 0, slt = sortSettings ? sortSettings.length : 0; sln < slt && isSort; sln++) {\n this.fieldList[sortSettings[sln].name].sort = sortSettings[sln].order;\n }\n };\n PivotEngine.prototype.updateFilterMembers = function (source) {\n var filterRw = this.filterMembers;\n var list = {};\n //let eList: {[key: string] : number} = {};\n var isInclude = this.getFilters(source, list);\n //this.getFilterExcludeList(source.rows, flist);\n //this.getFilterExcludeList(source.columns, flist);\n //this.getFilterExcludeList(source.filters, flist);\n // let filters: Iterator = isInclude ? iList : eList;\n var dln = this.indexMatrix.length;\n if (isInclude) {\n var keys = list.include.index;\n for (var ln = 0; ln < keys.length; ln++) {\n if (list.exclude === undefined || list.exclude.indexObject[keys[ln]] === undefined) {\n filterRw.push(keys[ln]);\n }\n }\n }\n else {\n for (var ln = 0; ln < dln; ln++) {\n if (list.exclude === undefined || list.exclude.indexObject[ln] === undefined) {\n filterRw.push(ln);\n }\n }\n }\n };\n PivotEngine.prototype.getFilters = function (source, ilist) {\n var filterElements = source.filterSettings ? source.filterSettings : [];\n var filters = this.filters;\n var isInclude = false;\n var filter = [];\n //let type: string;\n for (var rln = 0, rlt = filterElements.length; rln < rlt; rln++) {\n var filterElement = filterElements[rln].properties ?\n filterElements[rln].properties : filterElements[rln];\n if (this.fieldList[filterElement.name].isSelected && this.isValidFilterField(filterElement, source.allowLabelFilter)) {\n this.applyLabelFilter(filterElement);\n if (filterElement) {\n filter = filterElement.items;\n }\n if (filterElement.type && filterElement.type === 'Include') {\n /* tslint:disable-next-line:max-line-length */\n this.frameFilterList(filter, filterElement.name, ilist, 'include', filterElement.showLabelFilter, isInclude);\n isInclude = true;\n }\n else {\n this.frameFilterList(filter, filterElement.name, ilist, 'exclude', filterElement.showLabelFilter);\n }\n if (filterElement.showLabelFilter) {\n filterElement.items = [];\n filterElement.type = filterElement.showDateFilter ? 'Date' : filterElement.showNumberFilter ? 'Number' : 'Label';\n }\n }\n }\n /* for (let cln: number = 0, clt: number = cols.length; cln < clt; cln ++) {\n filter = cols[cln].filter ? cols[cln].filter.items : [];\n if (filter.length && cols[cln].filter.type && cols[cln].filter.type === 'include') {\n //type = cols[cln].filter.type;\n this.frameFilterList(filter, cols[cln].name, ilist, 'include', isInclude);\n isInclude = true;\n } else {\n this.frameFilterList(filter, cols[cln].name, ilist, 'exclude');\n }\n }\n for (let vln: number = 0, vlt: number = filters.length; vln < vlt; vln ++) {\n filter = filters[vln].filter ? filters[vln].filter.items : [];\n if (filter.length && filters[vln].filter.type && filters[vln].filter.type === 'include') {\n this.frameFilterList(filter, filters[vln].name, ilist, 'include', isInclude);\n isInclude = true;\n } else {\n this.frameFilterList(filter, filters[vln].name, ilist, 'exclude');\n }\n } */\n return isInclude;\n };\n PivotEngine.prototype.isValidFilterField = function (filterElement, allowLabelFiltering) {\n var isValidFilterElement = false;\n var filterTypes = ['Include', 'Exclude'];\n var dataFields = extend([], this.rows, null, true);\n dataFields = dataFields.concat(this.columns);\n if (this.fieldList[filterElement.name].isSelected && filterTypes.indexOf(filterElement.type) >= 0) {\n var isNotValidFilterElement = false;\n for (var _i = 0, _a = this.values; _i < _a.length; _i++) {\n var field = _a[_i];\n if (filterElement.name === field.name) {\n isNotValidFilterElement = true;\n break;\n }\n }\n if (!isNotValidFilterElement) {\n isValidFilterElement = true;\n }\n }\n else {\n for (var _b = 0, dataFields_2 = dataFields; _b < dataFields_2.length; _b++) {\n var field = dataFields_2[_b];\n if (filterElement.name === field.name && allowLabelFiltering &&\n (['Label', 'Date', 'Number'].indexOf(filterElement.type) >= 0)) {\n isValidFilterElement = true;\n break;\n }\n }\n }\n return isValidFilterElement;\n };\n PivotEngine.prototype.applyLabelFilter = function (filterElement) {\n if (['Label', 'Date', 'Number'].indexOf(filterElement.type) >= 0) {\n var members = Object.keys(this.fieldList[filterElement.name].members);\n filterElement.showLabelFilter = true;\n if (filterElement.type === 'Label') {\n /* tslint:disable-next-line:max-line-length */\n filterElement.items = this.getLabelFilterMembers(members, filterElement.condition, filterElement.value1, filterElement.value2);\n }\n else if (filterElement.type === 'Date') {\n filterElement.showDateFilter = true;\n /* tslint:disable-next-line:max-line-length */\n filterElement.items = this.getDateFilterMembers(members, filterElement.name, filterElement.condition, filterElement.value1, filterElement.value2);\n }\n else {\n filterElement.showNumberFilter = true;\n filterElement.items = [];\n for (var _i = 0, members_1 = members; _i < members_1.length; _i++) {\n var member = members_1[_i];\n var operand1 = this.getParsedValue(filterElement.name, filterElement.value1);\n var operand2 = this.getParsedValue(filterElement.name, filterElement.value2);\n var cValue = this.getParsedValue(filterElement.name, member);\n /* tslint:disable-next-line:max-line-length */\n if (this.validateFilterValue(cValue, filterElement.condition, operand1, operand2)) {\n filterElement.items.push(member);\n }\n }\n }\n var excludeOperators = ['DoesNotBeginWith', 'DoesNotContains', 'DoesNotEndsWith', 'DoesNotEquals', 'NotBetween'];\n filterElement.type = (excludeOperators.indexOf(filterElement.condition) > -1 &&\n !filterElement.showNumberFilter) ? 'Exclude' : 'Include';\n }\n else {\n filterElement.showLabelFilter = false;\n }\n };\n PivotEngine.prototype.getLabelFilterMembers = function (members, operator, value1, value2) {\n var items = [];\n for (var _i = 0, members_2 = members; _i < members_2.length; _i++) {\n var member = members_2[_i];\n var filterValue = member.toLowerCase();\n if (value1.toString()) {\n switch (operator) {\n case 'Equals':\n case 'DoesNotEquals':\n if (filterValue === value1.toLowerCase()) {\n items.push(member);\n }\n break;\n case 'BeginWith':\n case 'DoesNotBeginWith':\n if (filterValue.indexOf(value1.toLowerCase()) === 0) {\n items.push(member);\n }\n break;\n case 'EndsWith':\n case 'DoesNotEndsWith':\n if (filterValue.match(value1.toLowerCase() + '$') !== null) {\n items.push(member);\n }\n break;\n case 'Contains':\n case 'DoesNotContains':\n if (filterValue.indexOf(value1.toLowerCase()) > -1) {\n items.push(member);\n }\n break;\n case 'GreaterThan':\n if (filterValue > value1.toLowerCase()) {\n items.push(member);\n }\n break;\n case 'GreaterThanOrEqualTo':\n if (filterValue >= value1.toLowerCase()) {\n items.push(member);\n }\n break;\n case 'LessThan':\n if (filterValue < value1.toLowerCase()) {\n items.push(member);\n }\n break;\n case 'LessThanOrEqualTo':\n if (filterValue <= value1.toLowerCase()) {\n items.push(member);\n }\n break;\n case 'Between':\n case 'NotBetween':\n if ((filterValue >= value1.toLowerCase()) && (filterValue <= value2.toLowerCase())) {\n items.push(member);\n }\n break;\n }\n }\n }\n return items;\n };\n /* tslint:disable */\n PivotEngine.prototype.getDateFilterMembers = function (members, name, operator, value1, value2) {\n var items = [];\n for (var _i = 0, members_3 = members; _i < members_3.length; _i++) {\n var member = members_3[_i];\n var filterValue = new Date(member);\n if (value1) {\n switch (operator) {\n case 'Equals':\n case 'DoesNotEquals':\n if (this.getFormattedValue(filterValue.toString(), name).formattedText === this.getFormattedValue(value1.toString(), name).formattedText) {\n items.push(this.getFormattedValue(member, name).formattedText);\n }\n break;\n case 'After':\n if (filterValue.getTime() > value1.getTime()) {\n items.push(this.getFormattedValue(member, name).formattedText);\n }\n break;\n case 'AfterOrEqualTo':\n if (filterValue.getTime() >= value1.getTime()) {\n items.push(this.getFormattedValue(member, name).formattedText);\n }\n break;\n case 'Before':\n if (filterValue.getTime() < value1.getTime()) {\n items.push(this.getFormattedValue(member, name).formattedText);\n }\n break;\n case 'BeforeOrEqualTo':\n if (filterValue.getTime() <= value1.getTime()) {\n items.push(this.getFormattedValue(member, name).formattedText);\n }\n break;\n case 'Between':\n case 'NotBetween':\n if ((filterValue.getTime() >= value1.getTime()) &&\n (filterValue.getTime() <= value2.getTime())) {\n items.push(this.getFormattedValue(member, name).formattedText);\n }\n break;\n }\n }\n }\n return items;\n };\n /* tslint:enable */\n PivotEngine.prototype.validateFilterValue = function (val, operator, value1, value2) {\n var isMemberInclude = false;\n if (typeof (value1) === 'number') {\n switch (operator) {\n case 'Equals':\n if (val === value1) {\n isMemberInclude = true;\n }\n break;\n case 'DoesNotEquals':\n if (val !== value1) {\n isMemberInclude = true;\n }\n break;\n case 'GreaterThan':\n if (val > value1) {\n isMemberInclude = true;\n }\n break;\n case 'GreaterThanOrEqualTo':\n if (val >= value1) {\n isMemberInclude = true;\n }\n break;\n case 'LessThan':\n if (val < value1) {\n isMemberInclude = true;\n }\n break;\n case 'LessThanOrEqualTo':\n if (val <= value1) {\n isMemberInclude = true;\n }\n break;\n case 'Between':\n if ((val >= value1) && (val <= value2)) {\n isMemberInclude = true;\n }\n break;\n case 'NotBetween':\n if (!((val >= value1) && (val <= value2))) {\n isMemberInclude = true;\n }\n break;\n }\n }\n return isMemberInclude;\n };\n /* tslint:disable-next-line:max-line-length */\n PivotEngine.prototype.frameFilterList = function (filter, name, list, type, isLabelFilter, isInclude) {\n if (!list[type]) {\n list[type] = { indexObject: {}, index: [] };\n this.updateFilter(filter, name, list, type, isLabelFilter, isInclude);\n }\n else {\n this.updateFilter(filter, name, list, type, isLabelFilter, isInclude);\n }\n // }\n };\n PivotEngine.prototype.updateFilter = function (filter, name, list, type, isLabelFilter, isInclude) {\n var fln = 0;\n var field = this.fieldList[name];\n field.filter = filter;\n field.filterType = type;\n field.isExcelFilter = isLabelFilter;\n var members = (this.formatFields[name] &&\n (['date', 'dateTime', 'time'].indexOf(this.formatFields[name].type) > -1)) ?\n field.formattedMembers : field.members;\n var allowFil = isInclude;\n var final = {};\n var filterObj = {};\n final[type] = { indexObject: {}, index: [] };\n this.fieldFilterMem[name] = { memberObj: {} };\n while (filter[fln]) {\n var indx = members[filter[fln]].index;\n if (type === 'include') {\n for (var iln = 0, ilt = indx.length; iln < ilt; iln++) {\n if (!allowFil || list[type].indexObject[indx[iln]] !== undefined) {\n final[type].indexObject[indx[iln]] = indx[iln];\n final[type].index.push(indx[iln]);\n }\n }\n }\n else {\n for (var iln = 0, ilt = indx.length; iln < ilt; iln++) {\n if (list[type].indexObject[indx[iln]] === undefined) {\n list[type].indexObject[indx[iln]] = indx[iln];\n list[type].index.push(indx[iln]);\n }\n }\n this.fieldFilterMem[name].memberObj[filter[fln]] = filter[fln];\n }\n fln++;\n }\n if (type === 'include') {\n list[type] = final[type];\n for (var iln = 0; iln < filter.length; iln++) {\n filterObj[filter[iln]] = filter[iln];\n }\n var items = Object.keys(members);\n for (var iln = 0, ilt = items.length; iln < ilt; iln++) {\n if (filterObj[items[iln]] === undefined) {\n this.fieldFilterMem[name].memberObj[items[iln]] = items[iln];\n }\n }\n }\n };\n /* tslint:disable-next-line:max-line-length */\n PivotEngine.prototype.applyValueFiltering = function (rowData, level, rows, columns, valueFilter, rowFilterData, type) {\n this.isValueFiltered = false;\n var allMember = extend({}, rows[rows.length - 1], null, true);\n this.getFilteredData(rows, columns, valueFilter, rowFilterData, level, rowData.name, allMember, type);\n if (this.isValueFiltered) {\n rowFilterData.push(allMember);\n rows = rowFilterData;\n }\n return rows;\n };\n /* tslint:disable-next-line:max-line-length */\n PivotEngine.prototype.getFilteredData = function (rows, columns, filterSettings, rowFilterData, level, fieldName, allMember, type) {\n var rLen = rows.length;\n for (var i = 0; i < rLen; i++) {\n if (filterSettings[fieldName]) {\n if (rows[i].level === level) {\n this.isValueFiltered = true;\n this.fieldList[fieldName].isExcelFilter = true;\n var value = 0;\n var measure = filterSettings[fieldName].measure;\n var mPos = this.fieldList[measure].index;\n var aggregate = this.fieldList[measure].aggregateType;\n value = (type === 'row' ? this.getAggregateValue(rows[i].index, columns.indexObject, mPos, aggregate) :\n this.getAggregateValue(columns.index, rows[i].indexObject, mPos, aggregate));\n var operand1 = this.getParsedValue(measure, filterSettings[fieldName].value1);\n var operand2 = this.getParsedValue(measure, filterSettings[fieldName].value2);\n /* tslint:disable-next-line:max-line-length */\n if (!this.validateFilterValue(value, filterSettings[fieldName].condition, operand1, operand2) && rows[i].type !== 'grand sum') {\n var data = this.removefilteredData(rows[i], this.valueFilteredData);\n var row = data ? data : rows[i];\n this.validateFilteredParentData(row, this.valueFilteredData, allMember, 0, level, type);\n }\n else if (rows[i].type !== 'grand sum') {\n rowFilterData.push(extend({}, rows[i], null, true));\n rowFilterData[rowFilterData.length - 1].isLevelFiltered = true;\n }\n }\n else if (rows[i].hasChild && rows[i].members.length > 0 && rows[i].type !== 'grand sum') {\n rowFilterData.push(extend({}, rows[i], null, true));\n rowFilterData[rowFilterData.length - 1].members = [];\n rowFilterData[rowFilterData.length - 1].isLevelFiltered = true;\n /* tslint:disable-next-line:max-line-length */\n this.getFilteredData(rows[i].members, columns, filterSettings, rowFilterData[rowFilterData.length - 1].members, level, fieldName, allMember, type);\n }\n }\n }\n };\n PivotEngine.prototype.getParsedValue = function (measure, value) {\n var cValue = value ? value.toString() : '';\n if (this.formatFields[measure] && value) {\n var formatSetting = extend({}, this.formatFields[measure], null, true);\n delete formatSetting.name;\n return this.globalize.parseNumber(cValue, formatSetting);\n }\n else {\n return this.globalize.parseNumber(cValue, { format: 'N' });\n }\n };\n PivotEngine.prototype.removefilteredData = function (row, rowFilterData) {\n var rows = extend([], rowFilterData, null, true);\n var filteredData;\n for (var i = 0; i < rows.length; i++) {\n if (row.isLevelFiltered && row.axis === rows[i].axis &&\n row.valueSort.levelName === rows[i].valueSort.levelName &&\n row.actualText === rows[i].actualText && row.axis === rows[i].axis &&\n row.level === rows[i].level && row.ordinal === rows[i].ordinal) {\n filteredData = rows[i];\n rowFilterData.splice(i, 1);\n break;\n }\n else if (rowFilterData[i].hasChild && rowFilterData[i].members.length > 0) {\n this.removefilteredData(row, rowFilterData[i].members);\n }\n }\n return filteredData;\n };\n /* tslint:disable-next-line:max-line-length */\n PivotEngine.prototype.validateFilteredParentData = function (row, rows, allMemberData, i, level, type) {\n if (rows.length > 0) {\n for (var _i = 0, rows_1 = rows; _i < rows_1.length; _i++) {\n var rowFilteredData = rows_1[_i];\n if (rowFilteredData.level === i) {\n if (type === 'row') {\n var index = row.index;\n for (var _a = 0, index_1 = index; _a < index_1.length; _a++) {\n var key = index_1[_a];\n if (allMemberData.index.indexOf(key) >= 0) {\n allMemberData.index.splice(allMemberData.index.indexOf(key), 1);\n }\n if (((row.valueSort.levelName.toString()).indexOf(rowFilteredData.valueSort.levelName.toString()) >= 0) &&\n rowFilteredData.level !== level && rowFilteredData.index.indexOf(key) >= 0) {\n rowFilteredData.index.splice(rowFilteredData.index.indexOf(key), 1);\n }\n }\n }\n else {\n var index = row.indexObject;\n for (var _b = 0, _c = Object.keys(index); _b < _c.length; _b++) {\n var key = _c[_b];\n if (index.hasOwnProperty(key)) {\n delete allMemberData.indexObject[key];\n if (((row.valueSort.levelName.toString()).indexOf(rowFilteredData.valueSort.levelName.toString()) >= 0) &&\n rowFilteredData.level !== level) {\n delete rowFilteredData.indexObject[key];\n }\n }\n }\n }\n if (rowFilteredData && rowFilteredData.members.length > 0 &&\n rowFilteredData.members[0].level === i + 1 && rowFilteredData.members[0].level !== level) {\n this.validateFilteredParentData(row, rowFilteredData.members, allMemberData, i + 1, level, type);\n }\n }\n }\n }\n else {\n if (type === 'row') {\n var index = row.index;\n for (var _d = 0, index_2 = index; _d < index_2.length; _d++) {\n var key = index_2[_d];\n if (allMemberData.index.indexOf(key) >= 0) {\n allMemberData.index.splice(allMemberData.index.indexOf(key), 1);\n }\n }\n }\n else {\n var index = row.indexObject;\n for (var _e = 0, _f = Object.keys(index); _e < _f.length; _e++) {\n var key = _f[_e];\n if (index.hasOwnProperty(key)) {\n delete allMemberData.indexObject[key];\n }\n }\n }\n }\n };\n /* tslint:disable-next-line:max-line-length */\n PivotEngine.prototype.updateFramedHeaders = function (framedHeaders, dataHeaders, filteredHeaders, headers, type) {\n for (var _i = 0, framedHeaders_1 = framedHeaders; _i < framedHeaders_1.length; _i++) {\n var dHeader = framedHeaders_1[_i];\n this.isHeaderAvail = false;\n if (this.validateFilteredHeaders(dHeader, filteredHeaders, type) || dHeader.type === 'grand sum') {\n if (type === 'row') {\n this.rowCount += this.rowValuesLength;\n }\n else {\n this.columnCount += this.colValuesLength;\n }\n headers.push(extend({}, dHeader, null, true));\n headers[headers.length - 1].members = [];\n if (dHeader.hasChild && dHeader.isDrilled && dHeader.members.length > 0) {\n this.updateFramedHeaders(dHeader.members, dataHeaders, filteredHeaders, headers[headers.length - 1].members, type);\n }\n }\n }\n return this.filterFramedHeaders;\n };\n PivotEngine.prototype.validateFilteredHeaders = function (dHeader, filteredHeaders, type) {\n for (var _i = 0, filteredHeaders_1 = filteredHeaders; _i < filteredHeaders_1.length; _i++) {\n var vHeader = filteredHeaders_1[_i];\n if (!this.isHeaderAvail) {\n if (dHeader.actualText === vHeader.actualText &&\n dHeader.level === vHeader.level &&\n dHeader.valueSort.levelName === vHeader.valueSort.levelName) {\n if (type === 'row') {\n if (vHeader.index.length > 0) {\n this.isHeaderAvail = true;\n dHeader.index = vHeader.index;\n return true;\n }\n else {\n this.isHeaderAvail = false;\n dHeader.index = vHeader.index;\n return false;\n }\n }\n else {\n if (Object.keys(vHeader.indexObject).length > 0) {\n this.isHeaderAvail = true;\n dHeader.indexObject = vHeader.indexObject;\n return true;\n }\n else {\n this.isHeaderAvail = false;\n dHeader.indexObject = vHeader.indexObject;\n return false;\n }\n }\n }\n else if (vHeader.hasChild && vHeader.members.length > 0 && vHeader.type !== 'grand sum') {\n this.validateFilteredHeaders(dHeader, vHeader.members, type);\n }\n }\n }\n return this.isHeaderAvail;\n };\n PivotEngine.prototype.isEmptyDataAvail = function (rowHeaders, columnHeaders) {\n this.isEmptyData = false;\n if (rowHeaders.length > 0 && rowHeaders[rowHeaders.length - 1].type === 'grand sum' &&\n rowHeaders[rowHeaders.length - 1].index.length === 0) {\n this.isEmptyData = true;\n }\n if (columnHeaders.length > 0 && columnHeaders[columnHeaders.length - 1].type === 'grand sum' &&\n Object.keys(columnHeaders[columnHeaders.length - 1].indexObject).length === 0) {\n this.isEmptyData = true;\n }\n };\n /** @hidden */\n PivotEngine.prototype.updateGridData = function (dataSource) {\n this.indexMatrix = [];\n for (var _i = 0, _a = this.fields; _i < _a.length; _i++) {\n var field = _a[_i];\n this.fieldList[field].members = {};\n this.fieldList[field].formattedMembers = {};\n this.fieldList[field].dateMember = [];\n }\n this.fillFieldMembers(dataSource.data, this.indexMatrix);\n this.valueMatrix = this.generateValueMatrix(dataSource.data);\n this.filterMembers = [];\n this.cMembers = [];\n this.rMembers = [];\n this.updateFilterMembers(dataSource);\n this.isEditing = true;\n this.isDrillThrough = true;\n this.generateGridData(dataSource);\n this.isEditing = false;\n };\n /* tslint:disable */\n PivotEngine.prototype.generateGridData = function (dataSource, headerCollection) {\n var keys = this.fields;\n var columns = dataSource.columns ? dataSource.columns : [];\n var data = dataSource.data;\n var rows = dataSource.rows ? dataSource.rows : [];\n var filterSettings = dataSource.filterSettings;\n var values = dataSource.values ? dataSource.values : [];\n var size = 1;\n this.removeCount = 0;\n this.isExpandAll = dataSource.expandAll;\n this.drilledMembers = dataSource.drilledMembers ? dataSource.drilledMembers : [];\n this.isEmptyData = false;\n var filterMembers = [];\n var showNoDataItems = (rows[0] && rows[0].showNoDataItems) || (columns[0] && columns[0].showNoDataItems);\n var dataFields = extend([], this.rows, null, true);\n dataFields = dataFields.concat(this.columns, this.values, this.filters);\n if (showNoDataItems) {\n for (var ln = 0; ln < this.indexMatrix.length; ln++) {\n filterMembers.push(ln);\n }\n }\n for (var ln = 0; ln < this.filterMembers.length; ln++) {\n this.filterPosObj[this.filterMembers[ln]] = this.filterMembers[ln];\n }\n //let childrens: Field = this.fieldList[rows[0].name + ''];\n this.valueSortSettings.columnIndex = undefined;\n var st1 = new Date().getTime();\n if (!this.isValueFilterEnabled || this.isEditing) {\n if (!headerCollection) {\n this.columnCount = 0;\n this.rowCount = 0;\n this.cMembers = [];\n this.rMembers = [];\n if (rows.length !== 0) {\n this.rMembers =\n this.getIndexedHeaders(rows, data, 0, rows[0].showNoDataItems ? filterMembers : this.filterMembers, 'row', '');\n }\n if (columns.length !== 0) {\n this.cMembers = this.getIndexedHeaders(columns, data, 0, columns[0].showNoDataItems ?\n filterMembers : this.filterMembers, 'column', '');\n }\n this.insertAllMembersCommon();\n this.saveDataHeaders = (this.isValueFiltersAvail && dataSource.allowValueFilter) ? {\n rowHeaders: extend([], this.rMembers, null, true),\n columnHeaders: extend([], this.cMembers, null, true)\n } : {};\n }\n }\n this.pivotValues = [];\n var gridData = [];\n this.headerContent = [];\n this.valueContent = [];\n this.valueFilteredData = [];\n this.filterFramedHeaders = [];\n var rowheads = [];\n var colheads = [];\n var rowFilteredData = [];\n var columnFilteredData = [];\n var valuesCount = (this.values.length);\n if (this.isValueFiltersAvail && dataSource.allowValueFilter && !headerCollection) {\n this.valueFilteredData = [];\n var rowHeaders = this.saveDataHeaders.rowHeaders;\n var columnHeaders = this.saveDataHeaders.columnHeaders;\n if (filterSettings.length > 0) {\n var valueFilters = {};\n var valueFields = {};\n for (var _i = 0, values_1 = values; _i < values_1.length; _i++) {\n var value = values_1[_i];\n valueFields[value.name] = value;\n }\n for (var _a = 0, filterSettings_1 = filterSettings; _a < filterSettings_1.length; _a++) {\n var filter = filterSettings_1[_a];\n rowHeaders = (rowFilteredData.length > 0 ? rowFilteredData : rowHeaders);\n columnHeaders = (columnFilteredData.length > 0 ? columnFilteredData : columnHeaders);\n this.valueFilteredData = [];\n var filterElement = filter.properties ?\n filter.properties : filter;\n if (filterElement.type === 'Value' && this.fieldList[filter.name].isSelected) {\n valueFilters[filter.name] = filter;\n filterElement.items = [];\n var isAvail = false;\n var rLen = rows.length;\n var cLen = columns.length;\n for (var i = 0; i < rLen; i++) {\n if (filterElement.name === rows[i].name && valueFields[filterElement.measure] && !isAvail) {\n isAvail = true;\n /* tslint:disable-next-line:max-line-length */\n rowFilteredData = this.applyValueFiltering(rows[i], i, rowHeaders, columnHeaders[columnHeaders.length - 1], valueFilters, this.valueFilteredData, 'row');\n break;\n }\n }\n for (var j = 0; j < cLen; j++) {\n if (filterElement.name === columns[j].name && valueFields[filterElement.measure] && !isAvail) {\n isAvail = true;\n /* tslint:disable-next-line:max-line-length */\n columnFilteredData = this.applyValueFiltering(columns[j], j, columnHeaders, rowHeaders[rowHeaders.length - 1], valueFilters, this.valueFilteredData, 'column');\n break;\n }\n }\n }\n }\n }\n rowFilteredData = (rowFilteredData.length > 0 ? rowFilteredData : rowHeaders);\n columnFilteredData = (columnFilteredData.length > 0 ? columnFilteredData : columnHeaders);\n this.isEmptyDataAvail(rowFilteredData, columnFilteredData);\n var savedFieldList = extend({}, this.fieldList, null, true);\n this.indexMatrix = [];\n var fields = dataSource.data[0];\n this.getFieldList(fields, this.enableSort, dataSource.allowValueFilter);\n this.fillFieldMembers(dataSource.data, this.indexMatrix);\n this.updateSortSettings(dataSource.sortSettings, this.enableSort);\n this.valueMatrix = this.generateValueMatrix(dataSource.data);\n this.filterMembers = [];\n var pageSize = 1;\n this.updateFilterMembers(dataSource);\n this.rMembers = rows.length !== 0 ?\n this.getIndexedHeaders(rows, data, 0, rows[0].showNoDataItems ?\n filterMembers : this.filterMembers, 'row', '') : [];\n this.cMembers = columns.length !== 0 ?\n this.getIndexedHeaders(columns, data, 0, columns[0].showNoDataItems ?\n filterMembers : this.filterMembers, 'column', '') : [];\n this.insertAllMembersCommon();\n this.updateFieldList(savedFieldList);\n this.rowCount = 0;\n this.columnCount = 0;\n this.rMembers = this.updateFramedHeaders(this.rMembers, this.rMembers, rowFilteredData, this.filterFramedHeaders, 'row');\n this.filterFramedHeaders = [];\n this.cMembers = this.updateFramedHeaders(this.cMembers, this.cMembers, columnFilteredData, this.filterFramedHeaders, 'column');\n this.isValueFilterEnabled = true;\n }\n if (!headerCollection) {\n this.applyValueSorting();\n }\n if (this.pageSettings) {\n if (!headerCollection) {\n this.headerCollection.rowHeaders = this.rMembers;\n this.headerCollection.columnHeaders = this.cMembers;\n this.headerCollection.rowHeadersCount = this.rowCount;\n this.headerCollection.columnHeadersCount = this.columnCount;\n }\n else {\n this.rMembers = headerCollection.rowHeaders;\n this.cMembers = headerCollection.columnHeaders;\n this.rowCount = headerCollection.rowHeadersCount;\n this.columnCount = headerCollection.columnHeadersCount;\n }\n this.calculatePagingValues();\n }\n this.getAggregatedHeaders(rows, columns, this.rMembers, this.cMembers, values);\n this.getHeaderData(this.cMembers, colheads, this.pivotValues, 0, this.valueAxis ? 1 : valuesCount);\n if (this.removeCount !== 0 && this.values.length > 0) {\n this.columnCount = this.columnCount - (this.removeCount * (this.valueAxis === 0 ? this.values.length : 1));\n }\n if ((!this.showGrandTotals || !this.showColumnGrandTotals) && this.columns.length > 0) {\n this.columnCount = this.columnCount - (1 * (this.valueAxis === 0 ? this.values.length : 1));\n }\n this.insertSubTotals();\n //this.getHeaderData(rmembers, rowheads, gridData, 0); \n /* tslint:disable-next-line:max-line-length */\n this.getTableData(this.rMembers, rowheads, colheads, 0, this.pivotValues, valuesCount, this.rMembers[this.rMembers.length - 1], this.cMembers[this.cMembers.length - 1]);\n this.applyAdvancedAggregate(rowheads, colheads, this.pivotValues);\n this.isEngineUpdated = true;\n var st2 = new Date().getTime();\n // console.log(st1 - st2);\n };\n /* tslint:enable */\n /* tslint:disable:no-string-literal */\n /* tslint:disable:typedef */\n /** @hidden */\n PivotEngine.prototype.onDrill = function (drilledItem) {\n var headersInfo = this.getHeadersInfo(drilledItem.fieldName, drilledItem.axis);\n this.performDrillOperation(headersInfo.headers, drilledItem, headersInfo.fields, headersInfo.position, 0);\n this.headerCollection.rowHeadersCount = this.rowCount;\n this.headerCollection.columnHeadersCount = this.columnCount;\n if (headersInfo.axis === 'row') {\n this.headerCollection.rowHeaders = headersInfo.headers;\n }\n else {\n this.headerCollection.columnHeaders = headersInfo.headers;\n }\n this.updateEngine();\n };\n /** @hidden */\n PivotEngine.prototype.onSort = function (sortItem) {\n var headersInfo = this.getHeadersInfo(sortItem.name, '');\n this.fieldList[sortItem.name].sort = sortItem.order;\n this.performSortOperation(headersInfo.headers, sortItem, headersInfo, 0);\n this.updateEngine();\n };\n /** @hidden */\n PivotEngine.prototype.onFilter = function (filterItem, dataSource) {\n var headersInfo = this.getHeadersInfo(filterItem.name, '');\n if (filterItem.type === 'Include' && filterItem.items.length === this.fieldList[filterItem.name].dateMember.length) {\n this.fieldList[filterItem.name].filter = [];\n this.fieldList[filterItem.name].filterType = '';\n }\n else {\n this.fieldList[filterItem.name].filter = filterItem.items;\n this.fieldList[filterItem.name].filterType = filterItem.type;\n }\n var posObj = {};\n for (var _i = 0, _a = this.filterMembers; _i < _a.length; _i++) {\n var pos = _a[_i];\n posObj[pos] = pos;\n }\n this.filterMembers = [];\n this.fieldFilterMem = {};\n this.updateFilterMembers(dataSource);\n var addPos = this.filterMembers.filter(function (pos) { return posObj[pos] === undefined; });\n var itemsObj = {};\n for (var _b = 0, _c = filterItem.items; _b < _c.length; _b++) {\n var item = _c[_b];\n itemsObj[item] = item;\n }\n var showNoDataItems = (this.rows[0] && this.rows[0].showNoDataItems) || (this.columns[0] && this.columns[0].showNoDataItems);\n if (showNoDataItems) {\n var filterMembers = [];\n this.filterPosObj = {};\n for (var ln = 0; ln < addPos.length; ln++) {\n this.filterPosObj[addPos[ln]] = addPos[ln];\n }\n for (var ln = 0; ln < this.indexMatrix.length; ln++) {\n filterMembers.push(ln);\n }\n addPos = filterMembers;\n }\n this.performFilterCommonUpdate(filterItem, headersInfo, addPos);\n this.frameHeaderObjectsCollection = false;\n this.headerObjectsCollection = {};\n this.updateEngine();\n };\n /** @hidden */\n PivotEngine.prototype.onAggregation = function (field) {\n this.fieldList[field.name].aggregateType = field.type;\n this.rMembers = this.headerCollection.rowHeaders;\n this.cMembers = this.headerCollection.columnHeaders;\n this.updateEngine();\n };\n /** @hidden */\n PivotEngine.prototype.onCalcOperation = function (field) {\n this.rMembers = this.headerCollection.rowHeaders;\n this.cMembers = this.headerCollection.columnHeaders;\n this.getCalculatedField(this.fields);\n if (this.fieldList[field.name]) {\n this.fieldList[field.name].formula = field.formula;\n }\n else {\n this.fieldList[field.name] = {\n id: field.name,\n caption: field.name,\n type: 'number',\n aggregateType: 'CalculatedField',\n filterType: '',\n index: this.fields.length - 1,\n filter: [],\n sort: this.enableSort ? 'Ascending' : 'None',\n isSelected: true,\n isExcelFilter: false,\n formula: field.formula\n };\n if (this.valueAxis === 1) {\n this.headerCollection.rowHeadersCount = this.rowCount = (this.rowCount / (this.values.length - 1)) * this.values.length;\n }\n else {\n this.headerCollection.columnHeadersCount = this.columnCount = (this.columnCount / (this.values.length - 1)) * this.values.length;\n }\n }\n this.updateEngine();\n };\n PivotEngine.prototype.performDrillOperation = function (headers, drilledItem, fields, position, currentPosition) {\n var count = 0;\n while (count < headers.length) {\n if (position === currentPosition) {\n if (drilledItem.memberName === headers[count].actualText) {\n if (drilledItem.action === 'down') {\n headers[count].isDrilled = true;\n headers[count].members = this.getIndexedHeaders(fields, this.data, position + 1, headers[count].index, drilledItem.axis, drilledItem.memberName);\n var sortedHeaders = void 0;\n if (drilledItem.axis === 'row') {\n sortedHeaders = this.applyValueSorting(headers[count].members, this.cMembers);\n headers[count].members = sortedHeaders.rMembers;\n }\n else {\n sortedHeaders = this.applyValueSorting(this.rMembers, headers[count].members);\n headers[count].members = sortedHeaders.cMembers;\n }\n }\n else {\n headers[count].isDrilled = false;\n this.updateHeadersCount(headers[count].members, drilledItem.axis, 'minus');\n headers[count].members = [];\n }\n break;\n }\n }\n else if (headers[count].members.length > 0) {\n headers[count].members = this.performDrillOperation(headers[count].members, drilledItem, fields, position, currentPosition + 1);\n }\n count++;\n }\n return headers;\n };\n PivotEngine.prototype.performSortOperation = function (headers, sortItem, headersInfo, currentPosition) {\n var count = 0;\n while (count < headers.length) {\n if (headersInfo.position === currentPosition) {\n headers = this.getSortedHeaders(headers, sortItem.order.toString());\n break;\n }\n else if (headers[count].members.length > 0) {\n headers[count].members = this.performSortOperation(headers[count].members, sortItem, headersInfo, currentPosition + 1);\n }\n count++;\n }\n return headers;\n };\n PivotEngine.prototype.performFilterDeletion = function (headers, filterItem, headersInfo, filterObjects, currentPosition) {\n var count = 0;\n var loopIn = true;\n var _loop_3 = function () {\n if (headersInfo.position === currentPosition) {\n var engine_1 = this_3;\n headers = headers.filter(function (item) {\n return !engine_1.fieldFilterMem[filterItem.name].memberObj[item.formattedText] || item.type === 'grand sum';\n });\n loopIn = false;\n }\n else if (headers[count].members.length > 0) {\n headers[count].members = this_3.performFilterDeletion(headers[count].members, filterItem, headersInfo, filterObjects, currentPosition + 1);\n }\n count++;\n };\n var this_3 = this;\n while (count < headers.length && loopIn) {\n _loop_3();\n }\n var engine = this;\n return headers.filter(function (item) {\n return item.isDrilled ? item.members.length > 0 : engine.matchIndexes(item.indexObject, filterObjects);\n });\n };\n PivotEngine.prototype.matchIndexes = function (index, filterObjects) {\n var keys = Object.keys(index);\n var len = keys.length;\n if (len === 0) {\n return true;\n }\n while (len > -1) {\n if (filterObjects[index[keys[len]]] !== undefined) {\n return true;\n }\n len--;\n }\n return false;\n };\n PivotEngine.prototype.performFilterAddition = function (headers, fields, headersInfo) {\n var count = 0;\n var _loop_4 = function () {\n var levelName = headers[count].valueSort.levelName;\n if (this_4.headerObjectsCollection[levelName]) {\n var memberNameObj_1 = {};\n for (var _i = 0, _a = headers[count].members; _i < _a.length; _i++) {\n var member = _a[_i];\n memberNameObj_1[member.valueSort.levelName.toString()] = member.valueSort.levelName.toString();\n }\n var excessHeaders = this_4.headerObjectsCollection[levelName].filter(function (member) {\n return !memberNameObj_1[member.valueSort.levelName.toString()];\n });\n headers[count].members = headers[count].members.concat(excessHeaders);\n headers[count].members = this_4.getSortedHeaders(headers[count].members, this_4.fieldList[headersInfo.fields[headers[count].members[0].level].name].sort);\n delete this_4.headerObjectsCollection[levelName];\n }\n if (headers[count].members.length > 0) {\n headers[count].members = this_4.performFilterAddition(headers[count].members, fields, headersInfo);\n }\n count++;\n };\n var this_4 = this;\n while (count < headers.length) {\n _loop_4();\n }\n return headers;\n };\n PivotEngine.prototype.performFilterCommonUpdate = function (filterItem, headersInfo, addPos) {\n var rawHeaders = headersInfo.axis === 'row' ? this.rMembers : this.cMembers;\n if (headersInfo.axis === 'row') {\n this.rowCount = 0;\n }\n else {\n this.columnCount = 0;\n }\n var filterObjects = {};\n for (var _i = 0, _a = this.filterMembers; _i < _a.length; _i++) {\n var item = _a[_i];\n filterObjects[item] = item;\n }\n if (this.fieldFilterMem[filterItem.name]) {\n rawHeaders = this.performFilterDeletion(headersInfo.headers, filterItem, headersInfo, filterObjects, 0);\n }\n if (addPos.length > 0) {\n this.frameHeaderObjectsCollection = true;\n if (headersInfo.fields.filter(function (item) { return item.showNoDataItems; }).length > 0) {\n addPos = this.data.map(function (item, pos) { return pos; });\n }\n this.headerObjectsCollection['parent'] = this.getIndexedHeaders(headersInfo.fields, this.data, 0, addPos, headersInfo.axis, '');\n rawHeaders = this.performFilterAddition(rawHeaders, headersInfo.fields, headersInfo);\n var headerNames_1 = {};\n for (var _b = 0, rawHeaders_1 = rawHeaders; _b < rawHeaders_1.length; _b++) {\n var header = rawHeaders_1[_b];\n headerNames_1[header.valueSort.levelName.toString()] = header.valueSort.levelName.toString();\n }\n var excessHeaders = this.headerObjectsCollection['parent'].filter(function (header) {\n return !headerNames_1[header.valueSort.levelName.toString()];\n });\n var grandHeader = rawHeaders.filter(function (item) { return item.type === 'grand sum'; });\n rawHeaders.pop();\n rawHeaders = this.getSortedHeaders(rawHeaders.concat(excessHeaders), this.fieldList[headersInfo.fields[0].name].sort).concat(grandHeader);\n }\n this.updateHeadersCount(rawHeaders, headersInfo.axis, 'plus');\n if (headersInfo.axis === 'row') {\n if (headersInfo.position > 0) {\n this.insertPosition(this.rows, this.data, 0, this.filterMembers, 'row', '', rawHeaders);\n }\n this.insertTotalPosition(rawHeaders);\n this.rMembers = this.headerCollection.rowHeaders = rawHeaders;\n this.headerCollection.rowHeadersCount = this.rowCount;\n }\n else {\n if (headersInfo.position > 0) {\n this.insertPosition(this.columns, this.data, 0, this.filterMembers, 'column', '', rawHeaders);\n }\n this.insertTotalPosition(rawHeaders);\n this.cMembers = this.headerCollection.columnHeaders = rawHeaders;\n this.headerCollection.columnHeadersCount = this.columnCount;\n }\n this.applyValueSorting();\n };\n PivotEngine.prototype.getHeadersInfo = function (fieldName, axis) {\n this.rMembers = this.headerCollection.rowHeaders;\n this.cMembers = this.headerCollection.columnHeaders;\n axis = axis === '' ? this.getAxisByFieldName(fieldName) : axis;\n var headers = axis === 'row' ? this.rMembers : this.cMembers;\n var fields = axis === 'row' ? this.rows : this.columns;\n var position = 0;\n for (var _i = 0, fields_1 = fields; _i < fields_1.length; _i++) {\n var field = fields_1[_i];\n if (field.name === fieldName) {\n break;\n }\n position++;\n }\n return { axis: axis, fields: fields, headers: headers, position: position };\n };\n /** @hidden */\n PivotEngine.prototype.updateEngine = function () {\n this.removeCount = 0;\n this.calculatePagingValues();\n this.pivotValues = [];\n this.headerContent = [];\n this.valueContent = [];\n var rowheads = [];\n var colheads = [];\n var valuesCount = (this.values.length);\n this.getAggregatedHeaders(this.rows, this.columns, this.rMembers, this.cMembers, this.values);\n this.getHeaderData(this.cMembers, colheads, this.pivotValues, 0, this.valueAxis ? 1 : valuesCount);\n this.insertSubTotals();\n this.getTableData(this.rMembers, rowheads, colheads, 0, this.pivotValues, valuesCount, this.rMembers[this.rMembers.length - 1], this.cMembers[this.cMembers.length - 1]);\n this.applyAdvancedAggregate(rowheads, colheads, this.pivotValues);\n this.isEngineUpdated = true;\n };\n PivotEngine.prototype.getAxisByFieldName = function (fieldName) {\n var axisCount = 0;\n var axis = '';\n while (axisCount < 4 && axis === '') {\n switch (axisCount) {\n case 0:\n axis = this.getFieldByName(fieldName, this.rows) ? 'row' : '';\n break;\n case 1:\n axis = this.getFieldByName(fieldName, this.columns) ? 'column' : '';\n break;\n }\n axisCount++;\n }\n return axis;\n };\n PivotEngine.prototype.getFieldByName = function (fieldName, fields) {\n return new DataManager({ json: fields }).executeLocal(new Query().where('name', 'equal', fieldName))[0];\n };\n /* tslint:disable:no-any */\n PivotEngine.prototype.updateHeadersCount = function (headers, axis, action) {\n var lenCnt = 0;\n while (lenCnt < headers.length) {\n if (axis === 'row') {\n this.rowCount = this.rowCount - (action === 'plus' ? -(this.valueAxis === 1 ? this.values.length : 1) :\n (this.valueAxis === 1 ? this.values.length : 1));\n }\n else {\n this.columnCount = this.columnCount - (action === 'plus' ? -(this.valueAxis === 1 ? 1 : this.values.length) :\n (this.valueAxis === 1 ? 1 : this.values.length));\n }\n if (headers[lenCnt].members.length > 0) {\n this.updateHeadersCount(headers[lenCnt].members, axis, action);\n }\n lenCnt++;\n }\n };\n PivotEngine.prototype.frameHeaderWithKeys = function (header) {\n var keys = Object.keys(header);\n var keyPos = 0;\n var framedHeader = {};\n while (keyPos < keys.length) {\n framedHeader[keys[keyPos]] = header[keys[keyPos]];\n keyPos++;\n }\n return framedHeader;\n };\n PivotEngine.prototype.getSortedHeaders = function (headers, sortOrder) {\n return this.enableSort ? (sortOrder === 'Ascending' ?\n (headers.sort(function (a, b) { return (a.actualText > b.actualText) ? 1 : ((b.actualText > a.actualText) ? -1 : 0); })) :\n (sortOrder === 'Descending' ?\n (headers.sort(function (a, b) { return (a.actualText < b.actualText) ? 1 : ((b.actualText < a.actualText) ? -1 : 0); })) : headers)) :\n headers;\n };\n /** @hidden */\n PivotEngine.prototype.applyValueSorting = function (rMembers, cMembers) {\n var isNullArgument = false;\n if (rMembers === undefined || cMembers === undefined) {\n rMembers = this.rMembers;\n cMembers = this.cMembers;\n isNullArgument = true;\n }\n if (this.valueSortSettings.headerText && this.valueSortSettings.headerText !== '' && this.values.length > 0) {\n var textArray = this.valueSortSettings.headerText.split(this.valueSortSettings.headerDelimiter);\n var hText = '';\n var mIndex = void 0;\n var mType = void 0;\n var caption = void 0;\n for (var i = 0; i < this.values.length; i++) {\n if (this.values[i].caption === textArray[textArray.length - 1]) {\n caption = this.values[i].name;\n break;\n }\n else {\n caption = textArray[textArray.length - 1];\n }\n }\n if (((this.values.length === 1 && this.columns.length === 0) || this.values.length > 1) && caption && this.fieldList[caption]) {\n for (var i = 0; i < textArray.length - 1; i++) {\n hText = hText === '' ? textArray[i] : (hText + this.valueSortSettings.headerDelimiter + textArray[i]);\n }\n mIndex = this.fieldList[caption].index;\n mType = this.fieldList[caption].aggregateType;\n }\n else {\n if (!this.alwaysShowValueHeader || textArray.length === 1) {\n hText = this.valueSortSettings.headerText;\n }\n else {\n for (var i = 0; i < textArray.length - 1; i++) {\n hText = hText === '' ? textArray[i] : (hText + this.valueSortSettings.headerDelimiter + textArray[i]);\n }\n }\n mIndex = this.fieldList[this.values[0].name].index;\n mType = this.fieldList[this.values[0].name].aggregateType;\n }\n var member = void 0;\n if (this.valueAxis === 0) {\n member = this.getMember(cMembers, hText);\n if (member) {\n rMembers = this.sortByValueRow(rMembers, member, this.valueSortSettings.sortOrder, mIndex, mType);\n }\n }\n else {\n member = this.getMember(rMembers, hText);\n if (member) {\n cMembers = this.sortByValueRow(cMembers, member, this.valueSortSettings.sortOrder, mIndex, mType);\n }\n }\n if (isNullArgument) {\n this.rMembers = rMembers;\n this.cMembers = cMembers;\n if (this.pageSettings) {\n this.headerCollection.rowHeaders = this.rMembers;\n this.headerCollection.columnHeaders = this.cMembers;\n }\n }\n }\n return { rMembers: rMembers, cMembers: cMembers };\n };\n PivotEngine.prototype.getMember = function (cMembers, headerText) {\n var vlen = cMembers.length;\n var member;\n for (var j = 0; j < vlen; j++) {\n if (cMembers[j].valueSort.levelName === headerText) {\n member = cMembers[j];\n break;\n }\n else if (cMembers[j].members.length > 0) {\n member = this.getMember(cMembers[j].members, headerText);\n }\n if (member) {\n return member;\n }\n }\n return member;\n };\n PivotEngine.prototype.sortByValueRow = function (rMembers, member, sortOrder, mIndex, mType) {\n var aggreColl = [];\n for (var _i = 0, rMembers_1 = rMembers; _i < rMembers_1.length; _i++) {\n var header = rMembers_1[_i];\n if (header.type === 'grand sum') {\n aggreColl.push({ 'header': header });\n }\n else {\n aggreColl.push({ 'header': header, 'value': this.getAggregateValue(header.index, member.indexObject, mIndex, mType) });\n }\n }\n aggreColl.sort(function (a, b) { return sortOrder === 'Descending' ? (b['value'] - a['value']) : (a['value'] - b['value']); });\n rMembers = aggreColl.map(function (item) { return item['header']; });\n for (var _a = 0, rMembers_2 = rMembers; _a < rMembers_2.length; _a++) {\n var header = rMembers_2[_a];\n if (header.members.length > 0) {\n header.members = this.sortByValueRow(header.members, member, sortOrder, mIndex, mType);\n }\n }\n return rMembers;\n };\n PivotEngine.prototype.insertAllMembersCommon = function () {\n /* inserting the row grant-total members */\n var rowFlag = (this.showGrandTotals && this.showRowGrandTotals) ? true : (this.rows.length > 0) ? false : true;\n if (rowFlag) {\n this.insertAllMember(this.rMembers, this.filterMembers, '', 'row');\n }\n /* inserting the column gran-total members */\n var columnFlag = (this.showGrandTotals && this.showColumnGrandTotals) ? true : (this.columns.length > 0) ? false : true;\n if (columnFlag) {\n this.insertAllMember(this.cMembers, this.filterMembers, '', 'column');\n }\n };\n PivotEngine.prototype.insertSubTotals = function () {\n var rowLength = this.pivotValues.length;\n for (var rowCnt = 0; rowCnt < rowLength; rowCnt++) {\n var rowCells = this.pivotValues[rowCnt];\n if (rowCells) {\n var savedCell = void 0;\n var spanCnt = 1;\n var colLength = rowCells.length;\n var indexObj = void 0;\n for (var colCnt = colLength - 1; colCnt > 0; colCnt--) {\n var cell = rowCells[colCnt];\n if (cell) {\n // if (cell.rowSpan > 1) {\n // cell.rowSpan = 1;\n // }\n if (savedCell) {\n savedCell.colSpan = spanCnt;\n savedCell.colIndex = savedCell.colIndex - (spanCnt - 1);\n }\n indexObj = { index: cell.index, indexObject: cell.indexObject };\n cell.index = [];\n cell.indexObject = {};\n savedCell = extend({}, cell, null, true);\n cell.index = indexObj.index;\n cell.indexObject = indexObj.indexObject;\n var rowPos = rowCnt + 1;\n while (this.pivotValues[rowPos] && !this.pivotValues[rowPos][colCnt]) {\n if (!this.pivotValues[rowCnt][colCnt].isDrilled) {\n this.pivotValues[rowCnt][colCnt].rowSpan = (rowPos - rowCnt) + 1;\n savedCell.rowSpan = (rowPos - rowCnt) + 1;\n }\n var cellType = (cell.type === 'sum' || cell.type === 'grand sum') ? cell.type : 'sum';\n this.pivotValues[rowPos][colCnt] = this.headerContent[rowPos][colCnt] = {\n type: cellType, formattedText: ((cell.type === 'sum' || cell.type === 'grand sum') ? cell.formattedText :\n (cell.formattedText + ' Total')),\n axis: 'column', level: -1, colIndex: colCnt, rowIndex: rowPos, valueSort: cell.valueSort\n };\n if (cell.valueSort && cell.valueSort[this.valueSortSettings.headerText]) {\n this.valueSortSettings.columnIndex = colCnt;\n }\n var isSpanned = false;\n if (cellType === 'grand sum') {\n this.pivotValues[rowCnt][colCnt].rowSpan = (rowPos - rowCnt) + 1;\n savedCell.rowSpan = (rowPos - rowCnt) + 1;\n }\n else if (this.pivotValues[rowCnt][colCnt].type !== 'sum' &&\n this.pivotValues[rowCnt][colCnt].isDrilled) {\n this.pivotValues[rowCnt + 1][colCnt].rowSpan = rowPos - rowCnt;\n isSpanned = true;\n }\n else {\n this.pivotValues[rowPos][colCnt].rowSpan = -1;\n }\n if (rowPos > (rowCnt + 1) && (this.pivotValues[rowCnt][colCnt].type === 'sum' ||\n isSpanned)) {\n this.pivotValues[rowPos][colCnt].rowSpan = -1;\n }\n rowPos++;\n }\n spanCnt = 1;\n }\n else {\n rowCells[colCnt] = this.headerContent[rowCnt][colCnt] = extend({}, savedCell, null, true);\n rowCells[colCnt].index = this.headerContent[rowCnt][colCnt].index = indexObj.index;\n rowCells[colCnt].indexObject = this.headerContent[rowCnt][colCnt].indexObject = indexObj.indexObject;\n spanCnt++;\n rowCells[colCnt].colSpan = spanCnt;\n rowCells[colCnt].colIndex = rowCells[colCnt].colIndex - (spanCnt - 1);\n }\n if (colCnt === 1 && savedCell) {\n savedCell.colSpan = spanCnt;\n savedCell.colIndex = savedCell.colIndex - (spanCnt - 1);\n }\n }\n }\n }\n };\n /* tslint:disable:max-func-body-length */\n PivotEngine.prototype.getIndexedHeaders = function (keys, data, keyInd, position, axis, parentMember) {\n var hierarchy = [];\n if (keys) {\n var rlen = keys.length;\n var decisionObj = {};\n var fieldName = keys[keyInd].name;\n var field = keys[keyInd];\n // let members: string[] = Object.keys(this.fieldList[field].members);\n var childrens = this.fieldList[fieldName];\n var isNoData = false;\n var isDateType = (this.formatFields[fieldName] &&\n (['date', 'dateTime', 'time'].indexOf(this.formatFields[fieldName].type) > -1));\n var showNoDataItems = (position.length < 1 && keyInd > 0) || field.showNoDataItems;\n var savedMembers = {};\n if (showNoDataItems) {\n var members = Object.keys(childrens.members);\n for (var pos = 0, lt = members.length; pos < lt; pos++) {\n savedMembers[members[pos]] = members[pos];\n }\n if (position.length < 1) {\n isNoData = true;\n position.length = members.length;\n }\n }\n for (var pos = 0, lt = position.length; pos < lt; pos++) {\n var member = {};\n if (!isNullOrUndefined(keys[keyInd].showSubTotals) && !keys[keyInd].showSubTotals) {\n member.showSubTotals = false;\n }\n member.hasChild = keyInd < rlen - 1;\n member.level = keyInd;\n member.axis = axis;\n member.colSpan = 1;\n var memInd = isNoData ? childrens.members[Object.keys(savedMembers)[0]].ordinal :\n this.indexMatrix[position[pos]][childrens.index];\n var headerValue = isNoData ? Object.keys(savedMembers)[0] :\n data[position[pos]][fieldName];\n if (isNullOrUndefined(headerValue)) {\n continue;\n }\n delete savedMembers[headerValue];\n if (showNoDataItems && this.fieldFilterMem[fieldName] &&\n this.fieldFilterMem[fieldName].memberObj[headerValue] === headerValue) {\n continue;\n }\n member.isDrilled = member.hasChild ? childrens.members[headerValue].isDrilled : false;\n var formattedValue = isDateType ?\n this.getFormattedValue(headerValue, fieldName) : { formattedText: headerValue.toString(), actualText: headerValue };\n member.actualText = formattedValue.actualText;\n member.formattedText = formattedValue.formattedText;\n if (isDateType) {\n member.dateText = formattedValue.dateText;\n }\n var availData = showNoDataItems ? (this.filterPosObj[position[pos]] !== undefined &&\n !isNoData ? true : false) : true;\n //member.name = members[memInd];\n // member.type = member.hasChild ? 'All' : 'Single';\n var pindx = void 0;\n if (!(decisionObj && decisionObj[memInd])) {\n decisionObj[memInd] = { index: [], indexObject: {} };\n member.index = decisionObj[memInd].index;\n member.indexObject = decisionObj[memInd].indexObject;\n if (availData) {\n member.index = decisionObj[memInd].index = [position[pos]];\n decisionObj[memInd].indexObject[position[pos]] = position[pos];\n member.indexObject = decisionObj[memInd].indexObject;\n }\n member.ordinal = memInd;\n member.valueSort = {};\n member.valueSort.axis = fieldName;\n if (keyInd !== 0) {\n member.valueSort.levelName = parentMember + this.valueSortSettings.headerDelimiter + member.formattedText;\n member.valueSort[parentMember + this.valueSortSettings.headerDelimiter + member.formattedText] = 1;\n }\n else {\n member.valueSort[member.formattedText] = 1;\n member.valueSort.levelName = member.formattedText;\n }\n //if (!member.members) {\n member.members = [];\n //}\n //let copyObj: AxisSet = Object.create(member);\n hierarchy.push(member);\n }\n else if (availData) {\n decisionObj[memInd].index.push(position[pos]);\n decisionObj[memInd].indexObject[position[pos]] = position[pos];\n }\n if (showNoDataItems && !isNoData && keyInd > 0 && pos + 1 === position.length &&\n Object.keys(savedMembers).length > 0) {\n isNoData = true;\n lt = Object.keys(savedMembers).length;\n pos = -1;\n }\n }\n for (var iln = 0, ilt = hierarchy.length; iln < ilt; iln++) {\n if (!this.frameHeaderObjectsCollection) {\n if (axis === 'row') {\n this.rowCount += this.rowValuesLength;\n }\n else {\n this.columnCount += this.colValuesLength;\n }\n }\n var level = null;\n if (hierarchy[iln].valueSort && hierarchy[iln].valueSort.levelName) {\n level = hierarchy[iln].valueSort.levelName;\n }\n parentMember = (level || hierarchy[iln].formattedText);\n if (rlen - 1 > keyInd && hierarchy[iln].isDrilled) {\n var filterPosition = hierarchy[iln].index;\n /* tslint:disable:align */\n hierarchy[iln].members = this.getIndexedHeaders(keys, data, keyInd + 1, (filterPosition === undefined ? [] : filterPosition), axis, parentMember);\n /* tslint:enable:align */\n if (this.frameHeaderObjectsCollection) {\n this.headerObjectsCollection[parentMember] = hierarchy[iln].members;\n }\n }\n }\n /* tslint:disable:typedef */\n if (this.enableSort) {\n // return new DataManager(hierarchy as JSON[]).executeLocal(new Query().sortBy('actualText', childrens.sort.toLowerCase()));\n if (isDateType) {\n return childrens.sort === 'Ascending' ?\n (hierarchy.sort(function (a, b) { return (a.dateText > b.dateText) ? 1 : ((b.dateText > a.dateText) ? -1 : 0); })) :\n childrens.sort === 'Descending' ?\n (hierarchy.sort(function (a, b) { return (a.dateText < b.dateText) ? 1 : ((b.dateText < a.dateText) ? -1 : 0); })) :\n hierarchy;\n }\n else {\n return childrens.sort === 'Ascending' ?\n (hierarchy.sort(function (a, b) { return (a.actualText > b.actualText) ? 1 : ((b.actualText > a.actualText) ? -1 : 0); })) :\n childrens.sort === 'Descending' ?\n (hierarchy.sort(function (a, b) { return (a.actualText < b.actualText) ? 1 : ((b.actualText < a.actualText) ? -1 : 0); })) :\n hierarchy;\n }\n }\n else {\n return hierarchy;\n }\n /* tslint:enable:typedef */\n }\n else {\n return hierarchy;\n }\n };\n PivotEngine.prototype.getOrderedIndex = function (headers) {\n var orderedIndex = {};\n for (var i = 0; i < headers.length; i++) {\n if (headers[i].type !== 'grand sum') {\n orderedIndex[headers[i].ordinal] = i;\n }\n }\n return orderedIndex;\n };\n PivotEngine.prototype.insertPosition = function (keys, data, keyInd, position, axis, parentMember, slicedHeaders) {\n var hierarchy = [];\n var orderedIndex = this.getOrderedIndex(slicedHeaders);\n if (keys) {\n var decisionObj = {};\n var field = keys[keyInd].name;\n var childrens = this.fieldList[field];\n for (var pos = 0, lt = position.length; pos < lt; pos++) {\n var member = {};\n var memInd = this.indexMatrix[position[pos]][childrens.index];\n var slicedHeader = slicedHeaders[orderedIndex[memInd]];\n var formattedValue = (this.formatFields[field] &&\n (['date', 'dateTime', 'time'].indexOf(this.formatFields[field].type) > -1)) ?\n this.getFormattedValue(data[position[pos]][field], field) :\n { formattedText: data[position[pos]][field].toString(), actualText: data[position[pos]][field].toString() };\n if (!(slicedHeader && slicedHeader.formattedText === formattedValue.formattedText)) {\n continue;\n }\n if (!(decisionObj && decisionObj[memInd])) {\n decisionObj[memInd] = { index: [], indexObject: {} };\n slicedHeader.index = decisionObj[memInd].index = [position[pos]];\n decisionObj[memInd].indexObject[position[pos]] = position[pos];\n slicedHeader.indexObject = decisionObj[memInd].indexObject;\n slicedHeader.valueSort = {};\n slicedHeader.valueSort.axis = field;\n if (keyInd !== 0) {\n slicedHeader.valueSort.levelName = parentMember + this.valueSortSettings.headerDelimiter +\n slicedHeader.formattedText;\n slicedHeader.valueSort[parentMember + this.valueSortSettings.headerDelimiter +\n slicedHeader.formattedText] = 1;\n }\n else {\n slicedHeader.valueSort[slicedHeader.formattedText] = 1;\n slicedHeader.valueSort.levelName = slicedHeader.formattedText;\n }\n member.members = [];\n hierarchy.push(member);\n }\n else {\n decisionObj[memInd].index.push(position[pos]);\n decisionObj[memInd].indexObject[position[pos]] = position[pos];\n }\n }\n var diff = slicedHeaders.length - hierarchy.length;\n while (diff > 0) {\n hierarchy.push({ members: [] });\n diff--;\n }\n for (var iln = 0, ilt = hierarchy.length; iln < ilt; iln++) {\n if (slicedHeaders[iln].members.length > 0) {\n var level = null;\n if (slicedHeaders[iln].valueSort && slicedHeaders[iln].valueSort.levelName) {\n level = slicedHeaders[iln].valueSort.levelName;\n }\n parentMember = (level || slicedHeaders[iln].formattedText);\n /* tslint:disable:align */\n hierarchy[iln].members =\n this.insertPosition(keys, data, keyInd + 1, slicedHeaders[iln].index, axis, parentMember, slicedHeaders[iln].members);\n /* tslint:enable:align */\n }\n }\n return hierarchy;\n }\n else {\n return hierarchy;\n }\n };\n PivotEngine.prototype.insertTotalPosition = function (headers) {\n var summCell = headers[headers.length - 1];\n if (summCell && summCell.type === 'grand sum') {\n summCell.index = this.filterMembers;\n /* tslint:disable:typedef */\n var lt = void 0;\n for (var ln = 0, lt_1 = this.filterMembers.length; ln < lt_1; ln++) {\n summCell.indexObject[this.filterMembers[ln]] = this.filterMembers[ln];\n }\n /* tslint:enable:typedef */\n }\n return headers;\n };\n PivotEngine.prototype.calculatePagingValues = function () {\n if (this.pageSettings) {\n if (this.valueAxis === 1) {\n this.rowValuesLength = this.values.length;\n }\n else {\n this.colValuesLength = this.values.length;\n }\n this.memberCnt = -this.rowValuesLength;\n this.rowStartPos = ((this.pageSettings.rowCurrentPage * this.pageSettings.rowSize) -\n (this.pageSettings.rowSize)) * this.rowValuesLength;\n var exactStartPos = (this.rowStartPos + (this.pageSettings.rowSize * 3 * this.rowValuesLength)) > this.rowCount ?\n (this.rowCount - (this.pageSettings.rowSize * 3 * this.rowValuesLength)) : this.rowStartPos;\n if (exactStartPos < 0) {\n exactStartPos = this.rowStartPos = 0;\n this.pageSettings.rowCurrentPage = 1;\n }\n this.rowFirstLvl = (this.rowStartPos - exactStartPos) % this.pageSettings.rowSize;\n this.rowStartPos = exactStartPos;\n this.endPos = this.rowStartPos + (this.pageSettings.rowSize * 3 * this.rowValuesLength);\n this.endPos = this.endPos > this.rowCount ? this.rowCount : this.endPos;\n this.rMembers = this.performSlicing(this.rMembers, [], this.rowStartPos, 'row');\n this.memberCnt = -this.colValuesLength;\n this.pageInLimit = false;\n this.colHdrBufferCalculated = false;\n this.colStartPos = ((this.pageSettings.columnCurrentPage * this.pageSettings.columnSize) -\n (this.pageSettings.columnSize)) * this.colValuesLength;\n exactStartPos = (this.colStartPos + (this.pageSettings.columnSize * 3 * this.colValuesLength)) >\n this.columnCount ?\n (this.columnCount - (this.pageSettings.columnSize * 3 * this.colValuesLength)) : this.colStartPos;\n if (exactStartPos < 0) {\n exactStartPos = this.colStartPos = 0;\n this.pageSettings.columnCurrentPage = 1;\n }\n this.colFirstLvl = (this.colStartPos - exactStartPos) % this.pageSettings.columnSize;\n this.colStartPos = exactStartPos;\n this.endPos = this.colStartPos + (this.pageSettings.columnSize * 3 * this.colValuesLength);\n this.endPos = this.endPos > this.columnCount ? this.columnCount : this.endPos;\n this.cMembers = this.performSlicing(this.cMembers, [], this.colStartPos, 'column');\n this.memberCnt = -1;\n this.pageInLimit = false;\n }\n };\n PivotEngine.prototype.performSlicing = function (headers, slicedHeaders, startPos, axis) {\n var pos = 0;\n while (headers[pos]) {\n this.memberCnt += axis === 'column' ? this.colValuesLength : this.rowValuesLength;\n if (startPos <= this.memberCnt && this.endPos >= this.memberCnt && !this.pageInLimit) {\n if (axis === 'column') {\n this.colFirstLvl = this.colFirstLvl + headers[pos].level;\n }\n else {\n this.rowFirstLvl = this.rowFirstLvl + headers[pos].level;\n }\n this.pageInLimit = true;\n }\n if (this.pageInLimit) {\n if (this.endPos <= this.memberCnt) {\n if (axis === 'column') {\n if (headers[pos].members.length === 0) {\n if (this.colHdrBufferCalculated) {\n break;\n }\n this.colHdrBufferCalculated = true;\n this.endPos += (headers[pos].level * this.colValuesLength);\n }\n else if (this.colHdrBufferCalculated) {\n break;\n }\n }\n else {\n break;\n }\n }\n }\n slicedHeaders.push(headers[pos].members.length > 0 ? this.removeChildMembers(headers[pos]) : headers[pos]);\n if (headers[pos].members.length > 0) {\n slicedHeaders[slicedHeaders.length - 1].members =\n this.performSlicing(headers[pos].members, [], startPos, axis);\n }\n if (!this.pageInLimit) {\n slicedHeaders.pop();\n }\n if (headers[pos].level === 0 && this.pageInLimit && this.endPos <= this.memberCnt) {\n break;\n }\n pos++;\n }\n return slicedHeaders;\n };\n PivotEngine.prototype.removeChildMembers = function (member) {\n var keys = Object.keys(member);\n var keyPos = 0;\n var framedMember = {};\n while (keyPos < keys.length) {\n framedMember[keys[keyPos]] = member[keys[keyPos]];\n if (keys[keyPos] === 'members') {\n framedMember['members'] = [];\n }\n keyPos++;\n }\n return framedMember;\n };\n PivotEngine.prototype.insertAllMember = function (set, filter, customText, axis) {\n var len = set.length;\n customText = ' Total';\n set[len] = {\n hasChild: false,\n index: filter,\n level: 0,\n axis: axis,\n isDrilled: false,\n indexObject: {},\n members: [],\n formattedText: 'Grand' + customText,\n ordinal: len,\n type: 'grand sum',\n valueSort: {}\n };\n set[len].valueSort[set[len].formattedText] = 1;\n set[len].valueSort.levelName = set[len].formattedText;\n for (var ln = 0, lt = filter.length; ln < lt; ln++) {\n set[len].indexObject[filter[ln]] = filter[ln];\n }\n if (axis === 'row') {\n this.rowCount += this.rowValuesLength;\n }\n else {\n this.columnCount += this.colValuesLength;\n }\n };\n /* tslint:disable-next-line:max-line-length */\n PivotEngine.prototype.getTableData = function (rows, reformAxis, columns, tnum, data, vlt, rTotal, cTotal) {\n for (var rlt = rows.length, rln = 0; rln < rlt; rln++) {\n tnum = data.length;\n reformAxis[tnum] = rows[rln];\n var actCnt = tnum - Number(Object.keys(reformAxis)[0]);\n //let rplus: number = rln + 1;\n //let lvl: number = rows[rln].level;\n var isLeastNode = !reformAxis[tnum].members.length;\n rows[rln].colIndex = 0;\n rows[rln].rowIndex = tnum;\n if (!data[tnum]) {\n data[tnum] = [];\n this.valueContent[actCnt] = {};\n //data[tnum][0] = rows[rln].name;\n data[tnum][0] = this.valueContent[actCnt][0] = this.frameHeaderWithKeys(rows[rln]);\n }\n else {\n // data[tnum][0] = rows[rln].name;\n data[tnum][0] = this.valueContent[actCnt][0] = this.frameHeaderWithKeys(rows[rln]);\n }\n if (this.valueAxis && (this.isMutiMeasures || this.alwaysShowValueHeader) && !(rows[rln].isDrilled &&\n ((!isNullOrUndefined(rows[rln].showSubTotals) && !rows[rln].showSubTotals) ||\n !this.showSubTotals || !this.showRowSubTotals))) {\n var hpos = tnum;\n var actpos = actCnt;\n for (var vln = 0; vln < vlt; vln++) {\n tnum++;\n actCnt++;\n var name_1 = this.values[vln].caption ? this.values[vln].caption : this.values[vln].name;\n var calObj = {\n axis: 'row',\n actualText: this.values[vln].name,\n formattedText: name_1,\n level: 0,\n valueSort: {},\n colIndex: 0,\n rowIndex: tnum,\n type: 'value'\n };\n if (!data[tnum]) {\n data[tnum] = [];\n this.valueContent[actCnt] = {};\n data[tnum][0] = this.valueContent[actCnt][0] = calObj;\n }\n var vData = data[tnum][0].valueSort;\n vData[data[tnum - vln - 1][0].valueSort.levelName + this.valueSortSettings.headerDelimiter + name_1] = 1;\n vData.levelName = data[tnum - vln - 1][0].valueSort.levelName + this.valueSortSettings.headerDelimiter\n + name_1;\n for (var cln = 0, dln = 1, clt = columns.length; cln < clt; ++cln) {\n //for (let vln: number = 0; (!this.valueAxis && vln < vlt); vln++) {\n this.updateRowData(rows, columns, tnum, data, vln, rln, cln, dln, actCnt, rTotal, cTotal);\n dln = data[tnum].length;\n data[hpos][dln - 1] = this.valueContent[actpos][dln - 1] = {\n axis: 'value', actualText: '', colSpan: 1,\n colIndex: dln, formattedText: '', hasChild: false\n };\n // }\n }\n }\n this.recursiveRowData(rows, reformAxis, columns, tnum, data, vlt, isLeastNode, rln, vlt, rTotal, cTotal);\n }\n else {\n for (var cln = 0, dln = 1, clt = columns.length; cln < clt; ++cln) {\n for (var vln = 0; vln < vlt; vln++) {\n this.updateRowData(rows, columns, tnum, data, vln, rln, cln, dln, actCnt, rTotal, cTotal);\n dln = data[tnum].length;\n }\n }\n this.recursiveRowData(rows, reformAxis, columns, tnum, data, vlt, isLeastNode, rln, 0, rTotal, cTotal);\n }\n }\n /* for (let rlt: number = rows.length, rln: number = 0; rln < rlt; rln++) {\n if (!data[rln]) {\n data[rln] = [];\n data[rln][0] = rows[rln].name;\n } else {\n data[rln][0] = rows[rln].name;\n }\n for (let cln: number = 0, dln: number = 1, clt: number = columns.length; cln < clt; dln = ++cln) {\n data[rln][dln] = this.getAggregateValue(rows[rln].index, columns[cln].index, 11);\n }\n } */\n };\n /* tslint:disable-next-line:max-line-length */\n PivotEngine.prototype.getAggregatedHeaders = function (rows, columns, rMembers, cMembers, values) {\n this.selectedHeaders = { selectedHeader: [], values: [] };\n for (var vlt = values.length, vln = 0; vln < vlt; vln++) {\n switch (values[vln].type) {\n case 'DifferenceFrom':\n case 'PercentageOfDifferenceFrom':\n {\n var baseField = void 0;\n var baseItem = void 0;\n this.selectedHeaders.values.push(values[vln].name);\n if (values[vln].baseField && values[vln].baseItem) {\n baseField = values[vln].baseField;\n baseItem = values[vln].baseItem;\n }\n else if (this.valueAxis && (this.isMutiMeasures || this.alwaysShowValueHeader) && columns.length > 0) {\n baseField = columns[0].name;\n baseItem = Object.keys(this.fieldList[columns[0].name].members)[0];\n }\n else if (rows.length > 0) {\n baseField = rows[0].name;\n baseItem = Object.keys(this.fieldList[rows[0].name].members)[0];\n }\n var isHeaderSelected = false;\n for (var _i = 0, rows_2 = rows; _i < rows_2.length; _i++) {\n var row = rows_2[_i];\n if (row.name === baseField) {\n /* tslint:disable-next-line:max-line-length */\n this.getAggregatedHeaderData(rMembers, values[vln].name, baseItem, false, 'row', values[vln].type, this.selectedHeaders.selectedHeader, vln);\n isHeaderSelected = true;\n break;\n }\n }\n if (!isHeaderSelected) {\n for (var _a = 0, columns_1 = columns; _a < columns_1.length; _a++) {\n var column = columns_1[_a];\n if (column.name === baseField) {\n /* tslint:disable-next-line:max-line-length */\n this.getAggregatedHeaderData(cMembers, values[vln].name, baseItem, false, 'column', values[vln].type, this.selectedHeaders.selectedHeader, vln);\n break;\n }\n }\n }\n }\n break;\n case 'PercentageOfParentRowTotal':\n case 'PercentageOfParentColumnTotal':\n {\n this.selectedHeaders.values.push(values[vln].name);\n /* tslint:disable-next-line:max-line-length */\n this.getAggregatedHeaderData((values[vln].type === 'PercentageOfParentRowTotal' ? rMembers : cMembers), values[vln].name, undefined, false, (values[vln].type === 'PercentageOfParentRowTotal' ? 'row' : 'column'), values[vln].type, this.selectedHeaders.selectedHeader, vln);\n }\n break;\n case 'RunningTotals':\n {\n this.selectedHeaders.values.push(values[vln].name);\n /* tslint:disable-next-line:max-line-length */\n this.getAggregatedHeaderData((this.valueAxis && (this.isMutiMeasures || this.alwaysShowValueHeader) ? cMembers : rMembers), values[vln].name, undefined, false, (this.valueAxis && (this.isMutiMeasures || this.alwaysShowValueHeader) ? 'column' : 'row'), values[vln].type, this.selectedHeaders.selectedHeader, vln);\n }\n break;\n case 'PercentageOfParentTotal':\n {\n var baseField = void 0;\n this.selectedHeaders.values.push(values[vln].name);\n if (values[vln].baseField) {\n baseField = values[vln].baseField;\n }\n else if (this.valueAxis && (this.isMutiMeasures || this.alwaysShowValueHeader) && columns.length > 0) {\n baseField = columns[0].name;\n }\n else if (rows.length > 0) {\n baseField = rows[0].name;\n }\n var isHeaderSelected = false;\n for (var len = rows.length, i = 0; i < len; i++) {\n if (rows[i].name === baseField) {\n /* tslint:disable-next-line:max-line-length */\n this.getAggregatedHeaderData(rMembers, values[vln].name, undefined, false, 'row', values[vln].type, this.selectedHeaders.selectedHeader, vln, i);\n isHeaderSelected = true;\n break;\n }\n }\n if (!isHeaderSelected) {\n for (var len = columns.length, i = 0; i < len; i++) {\n if (columns[i].name === baseField) {\n /* tslint:disable-next-line:max-line-length */\n this.getAggregatedHeaderData(cMembers, values[vln].name, undefined, false, 'column', values[vln].type, this.selectedHeaders.selectedHeader, vln, i);\n break;\n }\n }\n }\n }\n break;\n }\n }\n };\n /* tslint:disable-next-line:max-line-length */\n PivotEngine.prototype.getAggregatedHeaderData = function (headers, name, baseItem, isChildren, type, aggregateType, selectedHeaders, vln, level) {\n for (var _i = 0, headers_1 = headers; _i < headers_1.length; _i++) {\n var rln = headers_1[_i];\n switch (aggregateType) {\n case 'DifferenceFrom':\n case 'PercentageOfDifferenceFrom':\n {\n var levelName = rln.valueSort.levelName.toString().split('.');\n if (levelName.indexOf(baseItem) !== -1) {\n /* tslint:disable-next-line:max-line-length */\n selectedHeaders.push(this.updateSelectedHeaders(baseItem, rln.level, type, isChildren, name, aggregateType, rln.valueSort.levelName, (isChildren ? [rln] : headers), vln + 1));\n if (rln.members.length > 0) {\n /* tslint:disable-next-line:max-line-length */\n this.getAggregatedHeaderData(rln.members, name, baseItem, true, type, aggregateType, selectedHeaders[selectedHeaders.length - 1].childMembers, vln);\n }\n }\n else if (rln.members.length > 0) {\n this.getAggregatedHeaderData(rln.members, name, baseItem, false, type, aggregateType, selectedHeaders, vln);\n }\n }\n break;\n case 'RunningTotals':\n case 'PercentageOfParentRowTotal':\n case 'PercentageOfParentColumnTotal':\n {\n if (rln.type === 'grand sum') {\n /* tslint:disable-next-line:max-line-length */\n selectedHeaders.push(this.updateSelectedHeaders(undefined, rln.level, type, false, name, aggregateType, rln.valueSort.levelName, headers, vln + 1));\n }\n else {\n if (rln.members.length > 0) {\n /* tslint:disable-next-line:max-line-length */\n selectedHeaders.push(this.updateSelectedHeaders(undefined, rln.level, type, false, name, aggregateType, rln.valueSort.levelName, rln.members, vln + 1));\n /* tslint:disable-next-line:max-line-length */\n this.getAggregatedHeaderData(rln.members, name, undefined, false, type, aggregateType, selectedHeaders, vln);\n }\n }\n }\n break;\n case 'PercentageOfParentTotal':\n {\n if (rln.type !== 'grand sum') {\n if (rln.level === level) {\n if (rln.members.length > 0) {\n if (isChildren) {\n var aggregateHeaders = selectedHeaders[selectedHeaders.length - 1].aggregateHeaders;\n for (var _a = 0, _b = rln.members; _a < _b.length; _a++) {\n var member = _b[_a];\n aggregateHeaders.push(member);\n }\n }\n else {\n var children = extend([], rln.members, null, true);\n /* tslint:disable-next-line:max-line-length */\n selectedHeaders.push(this.updateSelectedHeaders(undefined, rln.level, type, false, name, aggregateType, rln.valueSort.levelName, children, vln + 1));\n var aggregateHeaders = selectedHeaders[selectedHeaders.length - 1].aggregateHeaders;\n aggregateHeaders.push(rln);\n }\n /* tslint:disable-next-line:max-line-length */\n this.getAggregatedHeaderData(rln.members, name, undefined, true, type, aggregateType, selectedHeaders, vln, level + 1);\n }\n else {\n if (!isChildren) {\n /* tslint:disable-next-line:max-line-length */\n selectedHeaders.push(this.updateSelectedHeaders(undefined, rln.level, type, false, name, aggregateType, rln.valueSort.levelName, [rln], vln + 1));\n }\n }\n }\n else if (rln.members.length > 0) {\n /* tslint:disable-next-line:max-line-length */\n this.getAggregatedHeaderData(rln.members, name, undefined, false, type, aggregateType, selectedHeaders, vln, level);\n }\n }\n }\n break;\n }\n }\n };\n /* tslint:disable-next-line:max-line-length */\n PivotEngine.prototype.updateSelectedHeaders = function (baseItem, level, type, isChildren, name, aggregateType, levelName, headers, vCount) {\n var headerData = {\n name: baseItem,\n level: level,\n axis: type,\n isChild: isChildren,\n value: name,\n type: aggregateType,\n uniqueName: levelName,\n aggregateHeaders: headers,\n childMembers: [],\n valueCount: vCount\n };\n return headerData;\n };\n PivotEngine.prototype.applyAdvancedAggregate = function (rowheads, colheads, data) {\n if (this.selectedHeaders.values.length > 0) {\n var pivotIndex = {};\n var colIndex = [];\n var isIndexFilled = false;\n for (var rlt = data.length, rln = 0; rln < rlt; rln++) {\n if (data[rln] !== undefined && data[rln][0] !== undefined) {\n if (!isIndexFilled) {\n for (var clt = data[rln].length, cln = 0; cln < clt; cln++) {\n if (data[rln][cln].axis === 'value' &&\n this.selectedHeaders.values.indexOf(data[rln][cln].actualText) !== -1) {\n colIndex.push(cln);\n isIndexFilled = true;\n }\n }\n }\n if (colIndex.length > 0 && data[rln][colIndex[0]].axis === 'value' &&\n this.selectedHeaders.values.indexOf(data[rln][colIndex[0]].actualText) !== -1) {\n for (var _i = 0, colIndex_1 = colIndex; _i < colIndex_1.length; _i++) {\n var index = colIndex_1[_i];\n pivotIndex[rln + ',' + index] = [rln, index];\n }\n }\n }\n }\n this.updateAggregates(rowheads, colheads, data, this.selectedHeaders.selectedHeader, colIndex, pivotIndex);\n var indexCollection = Object.keys(pivotIndex);\n for (var _a = 0, indexCollection_1 = indexCollection; _a < indexCollection_1.length; _a++) {\n var index = indexCollection_1[_a];\n var currentSet = data[pivotIndex[index][0]][pivotIndex[index][1]];\n // currentSet.formattedText = '0';\n currentSet.formattedText = (this.selectedHeaders.selectedHeader.length > 0 ? this.emptyCellTextContent : '#N/A');\n }\n }\n else {\n return;\n }\n };\n /* tslint:disable:all */\n PivotEngine.prototype.updateAggregates = function (rowheads, colheads, data, selectedHeaders, colIndex, pivotIndex) {\n for (var _i = 0, selectedHeaders_1 = selectedHeaders; _i < selectedHeaders_1.length; _i++) {\n var headers = selectedHeaders_1[_i];\n var selectedHeaderCollection = headers.aggregateHeaders;\n var name_2 = headers.value;\n var valueCount = (this.valueAxis && (this.isMutiMeasures || this.alwaysShowValueHeader) ? headers.valueCount : 0);\n var aggregateType = headers.type;\n var uniqueName = headers.uniqueName;\n var axis = headers.axis;\n var isRowBaseField = axis === 'row' ? true : false;\n var activeValues = void 0;\n var indexCollection = [];\n var activeColumn = [];\n var columnHeaders = [];\n var rowindexCollection = [];\n var selectedRowValues = [];\n var selectedColumnValues = [];\n if ((['DifferenceFrom', 'PercentageOfDifferenceFrom', 'PercentageOfParentRowTotal', 'PercentageOfParentColumnTotal', 'PercentageOfParentTotal', 'RunningTotals']).indexOf(headers.type) !== -1) {\n if (isRowBaseField) {\n if (headers.type !== 'RunningTotals') {\n for (var rlt = rowheads.length, rln = 0; rln < rlt; rln++) {\n if (rowheads[rln] !== undefined) {\n if (rowheads[rln].valueSort[uniqueName]) {\n activeValues = rowheads[rln];\n selectedRowValues = data[rln + valueCount];\n break;\n }\n }\n }\n }\n }\n else {\n for (var len_3 = data.length, i = 0; i < len_3; i++) {\n if (data[i] !== undefined && data[i][0] === undefined) {\n columnHeaders.push(data[i]);\n }\n else {\n break;\n }\n }\n var len = columnHeaders.length;\n while (len--) {\n var axisObj = columnHeaders[len][colIndex[0]];\n var cLevelName = axisObj.actualText;\n if (this.selectedHeaders.values.indexOf(cLevelName) === -1) {\n activeColumn = columnHeaders[len];\n len = 0;\n }\n }\n if (headers.type !== 'RunningTotals') {\n for (var clt = activeColumn.length, cln = 0; cln < clt; cln++) {\n var isSelectedColumn = false;\n if (activeColumn[cln] !== undefined && activeColumn[cln].valueSort[uniqueName]) {\n activeValues = activeColumn[cln];\n for (var len_4 = data.length, i = 0; i < len_4; i++) {\n var axisObj = data[i];\n if (axisObj !== undefined && axisObj[0] !== undefined &&\n axisObj[cln].axis === 'value' &&\n this.selectedHeaders.values.indexOf(axisObj[cln].actualText) !== -1) {\n isSelectedColumn = true;\n selectedColumnValues[i] = axisObj[cln];\n rowindexCollection.push(i);\n }\n }\n if (isSelectedColumn) {\n break;\n }\n }\n }\n }\n }\n }\n switch (headers.type) {\n case 'DifferenceFrom':\n case 'PercentageOfDifferenceFrom':\n {\n var isChildren = headers.isChild;\n if (isRowBaseField) {\n if (!isChildren) {\n for (var _a = 0, selectedHeaderCollection_1 = selectedHeaderCollection; _a < selectedHeaderCollection_1.length; _a++) {\n var item = selectedHeaderCollection_1[_a];\n for (var rlt = rowheads.length, rln = 0; rln < rlt; rln++) {\n if (rowheads[rln] !== undefined) {\n if (rowheads[rln].valueSort[item.valueSort.levelName] &&\n rowheads[rln].level === activeValues.level && rowheads[rln].type !== 'grand sum') {\n for (var _b = 0, colIndex_2 = colIndex; _b < colIndex_2.length; _b++) {\n var index = colIndex_2[_b];\n var currentSet = data[rln + valueCount][index];\n if (currentSet.axis === 'value' && currentSet.actualText === name_2) {\n indexCollection.push([rln + valueCount, index]);\n if (pivotIndex[rln + valueCount + ',' + index]) {\n delete pivotIndex[rln + valueCount + ',' + index];\n }\n }\n }\n }\n }\n }\n }\n }\n else {\n var uniqueLevelName = uniqueName.split('.');\n for (var rlt = rowheads.length, rlen = 0; rlen < rlt; rlen++) {\n if (rowheads[rlen] !== undefined) {\n var levelName = rowheads[rlen].valueSort.levelName.toString().split('.');\n if (levelName.indexOf(uniqueLevelName[uniqueLevelName.length - 1]) !== -1 &&\n rowheads[rlen].level === activeValues.level) {\n for (var _c = 0, colIndex_3 = colIndex; _c < colIndex_3.length; _c++) {\n var index = colIndex_3[_c];\n var currentSet = data[rlen + valueCount][index];\n if (currentSet.axis === 'value' && currentSet.actualText === name_2) {\n indexCollection.push([rlen + valueCount, index]);\n if (pivotIndex[rlen + valueCount + ',' + index]) {\n delete pivotIndex[rlen + valueCount + ',' + index];\n }\n }\n }\n }\n }\n }\n }\n for (var _d = 0, indexCollection_2 = indexCollection; _d < indexCollection_2.length; _d++) {\n var index = indexCollection_2[_d];\n var currentSet = data[index[0]][index[1]];\n var cVal = currentSet.value - selectedRowValues[index[1]].value;\n cVal = isNaN(cVal) ? 0 : cVal;\n if (aggregateType === 'DifferenceFrom') {\n currentSet.formattedText = cVal === 0 ? this.emptyCellTextContent : this.getFormattedValue(cVal, name_2).formattedText;\n }\n else {\n cVal = (selectedRowValues[index[1]].value === 0 ?\n 0 : (cVal / selectedRowValues[index[1]].value));\n currentSet.formattedText = (cVal !== 0 ? this.globalize.formatNumber(cVal, { format: 'P', maximumFractionDigits: 2 }) : this.emptyCellTextContent);\n }\n }\n }\n else {\n if (!isChildren) {\n for (var _e = 0, selectedHeaderCollection_2 = selectedHeaderCollection; _e < selectedHeaderCollection_2.length; _e++) {\n var item = selectedHeaderCollection_2[_e];\n for (var clt = activeColumn.length, cln = 0; cln < clt; cln++) {\n var isSelectedColumn = false;\n if (activeColumn[cln] !== undefined &&\n activeColumn[cln].valueSort[item.valueSort.levelName] &&\n activeColumn[cln].level === activeValues.level && activeColumn[cln].type !== 'grand sum') {\n for (var _f = 0, rowindexCollection_1 = rowindexCollection; _f < rowindexCollection_1.length; _f++) {\n var index = rowindexCollection_1[_f];\n var currentSet = data[index][cln];\n if (currentSet.axis === 'value' && currentSet.actualText === name_2) {\n isSelectedColumn = true;\n indexCollection.push([index, cln]);\n if (pivotIndex[index + ',' + cln]) {\n delete pivotIndex[index + ',' + cln];\n }\n }\n }\n if (isSelectedColumn) {\n break;\n }\n }\n }\n }\n }\n else {\n var uniqueLevelName = uniqueName.split('.');\n for (var clt = activeColumn.length, clen = 0; clen < clt; clen++) {\n var isSelectedColumn = false;\n if (activeColumn[clen] !== undefined) {\n var levelName = activeColumn[clen].valueSort.levelName.toString().split('.');\n if (levelName.indexOf(uniqueLevelName[uniqueLevelName.length - 1]) !== -1 &&\n activeColumn[clen].level === activeValues.level) {\n for (var _g = 0, rowindexCollection_2 = rowindexCollection; _g < rowindexCollection_2.length; _g++) {\n var index = rowindexCollection_2[_g];\n var currentSet = data[index][clen];\n if (currentSet.axis === 'value' && currentSet.actualText === name_2) {\n isSelectedColumn = true;\n indexCollection.push([index, clen]);\n if (pivotIndex[index + ',' + clen]) {\n delete pivotIndex[index + ',' + clen];\n }\n }\n }\n if (isSelectedColumn) {\n break;\n }\n }\n }\n }\n }\n for (var _h = 0, indexCollection_3 = indexCollection; _h < indexCollection_3.length; _h++) {\n var index = indexCollection_3[_h];\n var currentSet = data[index[0]][index[1]];\n var cVal = currentSet.value - selectedColumnValues[index[0]].value;\n cVal = isNaN(cVal) ? 0 : cVal;\n if (aggregateType === 'DifferenceFrom') {\n currentSet.formattedText = cVal === 0 ? this.emptyCellTextContent : this.getFormattedValue(cVal, name_2).formattedText;\n }\n else {\n cVal = (selectedColumnValues[index[0]].value === 0 ?\n 0 : (cVal / selectedColumnValues[index[0]].value));\n currentSet.formattedText = (cVal !== 0 ? this.globalize.formatNumber(cVal, { format: 'P', maximumFractionDigits: 2 }) : this.emptyCellTextContent);\n }\n }\n }\n if (headers.childMembers.length > 0) {\n this.updateAggregates(rowheads, colheads, data, headers.childMembers, colIndex, pivotIndex);\n }\n }\n break;\n case 'PercentageOfParentRowTotal':\n case 'PercentageOfParentColumnTotal':\n case 'PercentageOfParentTotal':\n {\n if (isRowBaseField) {\n for (var _j = 0, selectedHeaderCollection_3 = selectedHeaderCollection; _j < selectedHeaderCollection_3.length; _j++) {\n var item = selectedHeaderCollection_3[_j];\n for (var rlt = rowheads.length, i = 0; i < rlt; i++) {\n if (rowheads[i] !== undefined) {\n if (rowheads[i].valueSort[item.valueSort.levelName] &&\n rowheads[i].level === item.level) {\n for (var _k = 0, colIndex_4 = colIndex; _k < colIndex_4.length; _k++) {\n var index = colIndex_4[_k];\n var currentSet = data[i + valueCount][index];\n if (currentSet.axis === 'value' && currentSet.actualText === name_2) {\n indexCollection.push([i + valueCount, index]);\n if (pivotIndex[i + valueCount + ',' + index]) {\n delete pivotIndex[i + valueCount + ',' + index];\n }\n }\n }\n }\n }\n }\n }\n for (var _l = 0, indexCollection_4 = indexCollection; _l < indexCollection_4.length; _l++) {\n var i = indexCollection_4[_l];\n var currentSet = data[i[0]][i[1]];\n var cVal = currentSet.value / selectedRowValues[i[1]].value;\n cVal = isNaN(cVal) ? 0 : cVal;\n currentSet.formattedText = (cVal !== 0 ? this.globalize.formatNumber(cVal, { format: 'P', maximumFractionDigits: 2 }) : this.emptyCellTextContent);\n }\n }\n else {\n for (var _m = 0, selectedHeaderCollection_4 = selectedHeaderCollection; _m < selectedHeaderCollection_4.length; _m++) {\n var item = selectedHeaderCollection_4[_m];\n for (var clt = activeColumn.length, j = 0; j < clt; j++) {\n var isSelectedColumn = false;\n if (activeColumn[j] !== undefined &&\n activeColumn[j].valueSort[item.valueSort.levelName]) {\n for (var _o = 0, rowindexCollection_3 = rowindexCollection; _o < rowindexCollection_3.length; _o++) {\n var index = rowindexCollection_3[_o];\n var currentSet = data[index][j];\n if (currentSet.axis === 'value' && currentSet.actualText === name_2) {\n isSelectedColumn = true;\n indexCollection.push([index, j]);\n if (pivotIndex[index + ',' + j]) {\n delete pivotIndex[index + ',' + j];\n }\n }\n }\n if (isSelectedColumn) {\n break;\n }\n }\n }\n }\n for (var _p = 0, indexCollection_5 = indexCollection; _p < indexCollection_5.length; _p++) {\n var i = indexCollection_5[_p];\n var currentSet = data[i[0]][i[1]];\n var val = currentSet.value / selectedColumnValues[i[0]].value;\n val = isNaN(val) ? 0 : val;\n currentSet.formattedText = (val !== 0 ? this.globalize.formatNumber(val, { format: 'P', maximumFractionDigits: 2 }) : this.emptyCellTextContent);\n }\n }\n }\n break;\n case 'RunningTotals':\n {\n if (isRowBaseField) {\n for (var _q = 0, colIndex_5 = colIndex; _q < colIndex_5.length; _q++) {\n var index = colIndex_5[_q];\n var cVal = 0;\n for (var _r = 0, selectedHeaderCollection_5 = selectedHeaderCollection; _r < selectedHeaderCollection_5.length; _r++) {\n var item = selectedHeaderCollection_5[_r];\n for (var rlt = rowheads.length, rlen = 0; rlen < rlt; rlen++) {\n if (rowheads[rlen] !== undefined) {\n var currentSet = data[rlen + valueCount][index];\n if (rowheads[rlen] !== undefined && rowheads[rlen].valueSort[item.valueSort.levelName] &&\n rowheads[rlen].level === item.level && currentSet.axis === 'value' &&\n currentSet.actualText === name_2) {\n if (rowheads[rlen].type !== 'grand sum') {\n cVal += currentSet.value;\n currentSet.formattedText = this.getFormattedValue(cVal, name_2).formattedText;\n }\n if (pivotIndex[rlen + valueCount + ',' + index]) {\n delete pivotIndex[rlen + valueCount + ',' + index];\n }\n break;\n }\n }\n }\n }\n }\n }\n else {\n for (var rlt = rowheads.length, rln = 0; rln < rlt; rln++) {\n if (rowheads[rln] !== undefined) {\n var cVal = 0;\n for (var _s = 0, selectedHeaderCollection_6 = selectedHeaderCollection; _s < selectedHeaderCollection_6.length; _s++) {\n var item = selectedHeaderCollection_6[_s];\n for (var clt = activeColumn.length, cln = 0; cln < clt; cln++) {\n var currentSet = data[rln + valueCount][cln];\n if (activeColumn[cln] !== undefined &&\n activeColumn[cln].valueSort[item.valueSort.levelName] &&\n currentSet.axis === 'value' && currentSet.actualText === name_2) {\n if (activeColumn[cln].type !== 'grand sum') {\n cVal += currentSet.value;\n currentSet.formattedText = this.getFormattedValue(cVal, name_2).formattedText;\n }\n if (pivotIndex[rln + valueCount + ',' + cln]) {\n delete pivotIndex[rln + valueCount + ',' + cln];\n }\n break;\n }\n }\n }\n }\n }\n }\n }\n break;\n }\n }\n };\n /* tslint:enable:all */\n PivotEngine.prototype.recursiveRowData = function (rows, reformAxis, columns, tnum, data, vlt, isLeastNode, rln, vln, rTotal, cTotal) {\n if (!isLeastNode) {\n this.getTableData(reformAxis[tnum - vln].members, reformAxis, columns, tnum, data, vlt, rTotal, cTotal);\n }\n if (!this.pageSettings) {\n reformAxis[tnum - vln].members = [];\n }\n };\n PivotEngine.prototype.updateRowData = function (rows, columns, tnum, data, vln, rln, cln, dln, actCnt, rTotal, cTotal) {\n var mPos = this.fieldList[this.values[vln].name].index;\n var aggregate = this.fieldList[this.values[vln].name].aggregateType;\n var field = this.values[vln].name;\n var gTotalIndex = [];\n var totalValues = {};\n var value = 0;\n // let isLeast: boolean = isLeastNode && (vln === vlt - 1);\n switch (aggregate) {\n case 'Index':\n {\n gTotalIndex = [[rows[rln], columns[cln]], [rows[rln], cTotal], [rTotal, columns[cln]], [rTotal, cTotal]];\n var valueContent = ['cVal', 'rTotalVal', 'cTotalVal', 'gTotalVal'];\n var i = 0;\n for (var _i = 0, gTotalIndex_1 = gTotalIndex; _i < gTotalIndex_1.length; _i++) {\n var rIndex = gTotalIndex_1[_i];\n totalValues[valueContent[i]] = this.getAggregateValue((rIndex[0]).index, (rIndex[1]).indexObject, mPos, aggregate);\n i++;\n }\n var val = ((totalValues.cVal) * (totalValues.gTotalVal)) / ((totalValues.rTotalVal) * (totalValues.cTotalVal));\n value = (rows[rln].isDrilled && ((!isNullOrUndefined(rows[rln].showSubTotals) && !rows[rln].showSubTotals) ||\n !this.showSubTotals || !this.showRowSubTotals)) ? undefined :\n (isNaN(val) ? 0 : val);\n }\n break;\n case 'PercentageOfGrandTotal':\n case 'PercentageOfColumnTotal':\n case 'PercentageOfRowTotal':\n {\n gTotalIndex = [[rows[rln], columns[cln]]];\n gTotalIndex.push((aggregate === 'PercentageOfGrandTotal' ?\n [rTotal, cTotal] : (aggregate === 'PercentageOfColumnTotal' ? [rTotal, columns[cln]] : [rows[rln], cTotal])));\n var valueContent = ['cVal', 'gTotalVal'];\n var i = 0;\n for (var _a = 0, gTotalIndex_2 = gTotalIndex; _a < gTotalIndex_2.length; _a++) {\n var rIndex = gTotalIndex_2[_a];\n totalValues[valueContent[i]] = this.getAggregateValue((rIndex[0]).index, (rIndex[1]).indexObject, mPos, aggregate);\n i++;\n }\n var val = ((totalValues.cVal) / (totalValues.gTotalVal));\n value = (rows[rln].isDrilled && ((!isNullOrUndefined(rows[rln].showSubTotals) && !rows[rln].showSubTotals) ||\n !this.showSubTotals || !this.showRowSubTotals)) ? undefined :\n (isNaN(val) ? 0 : val);\n }\n break;\n default:\n value = (rows[rln].isDrilled && ((!isNullOrUndefined(rows[rln].showSubTotals) && !rows[rln].showSubTotals) ||\n !this.showSubTotals || !this.showRowSubTotals)) ? undefined :\n this.getAggregateValue(rows[rln].index, columns[cln].indexObject, mPos, aggregate);\n break;\n }\n var isSum = rows[rln].hasChild || columns[cln].hasChild ||\n rows[rln].type === 'grand sum' || columns[cln].type === 'grand sum';\n var subTotal = (rows[rln].isDrilled && ((!isNullOrUndefined(rows[rln].showSubTotals) && !rows[rln].showSubTotals) ||\n !this.showSubTotals || !this.showRowSubTotals));\n var formattedText = subTotal ?\n '' : (value === undefined) ? this.emptyCellTextContent :\n aggregate === 'Count' ? value.toLocaleString() : this.getFormattedValue(value, field).formattedText;\n if (!isNaN(value) && !isNullOrUndefined(value) &&\n (['PercentageOfGrandTotal', 'PercentageOfColumnTotal', 'PercentageOfRowTotal']).indexOf(aggregate) >= 0) {\n formattedText = this.globalize.formatNumber(value, { format: 'P', maximumFractionDigits: 2 });\n }\n else if (!subTotal &&\n isNaN(value) && !isNullOrUndefined(value) &&\n (['PopulationStDev', 'SampleStDev', 'PopulationVar', 'SampleVar']).indexOf(aggregate) !== -1) {\n formattedText = '#DIV/0!';\n }\n //dln = data[tnum].length;\n data[tnum][dln] = this.valueContent[actCnt][dln] = {\n axis: 'value', actualText: field, indexObject: this.isDrillThrough ? this.rawIndexObject : {},\n rowHeaders: rows[rln].type === 'grand sum' ? '' : rows[rln].valueSort.levelName,\n columnHeaders: columns[cln].type === 'grand sum' ? '' : columns[cln].valueSort.levelName,\n formattedText: formattedText, value: isNullOrUndefined(value) ? 0 : value, rowIndex: tnum, colIndex: dln, isSum: isSum\n };\n this.rawIndexObject = {};\n };\n PivotEngine.prototype.getHeaderData = function (axis, reformAxis, data, tnum, vcnt) {\n var rlt = axis.length;\n var colItmLn = this.columns.length;\n var sortText = this.valueSortSettings.headerText;\n //let valueLn: number = this.values.length;\n for (var rln = 0; rln < rlt; rln++) {\n if (axis[rln].members.length) {\n this.getHeaderData(axis[rln].members, reformAxis, data, tnum, vcnt);\n }\n if ((!isNullOrUndefined(axis[rln].showSubTotals) && !axis[rln].showSubTotals) ||\n !this.showSubTotals || !this.showColumnSubTotals) {\n if (!axis[rln].isDrilled) {\n reformAxis[reformAxis.length] = this.frameHeaderWithKeys(axis[rln]);\n }\n else {\n this.removeCount++;\n }\n tnum = reformAxis.length - 1;\n }\n else {\n tnum = reformAxis.length;\n reformAxis[tnum] = this.frameHeaderWithKeys(axis[rln]);\n }\n // let rplus: number = rln + 1;\n var lvl = axis[rln].level;\n axis[rln].rowIndex = lvl;\n axis[rln].colIndex = (tnum * vcnt) + vcnt;\n if (!data[lvl]) {\n data[lvl] = [];\n this.headerContent[lvl] = {};\n data[lvl][(tnum * vcnt) + vcnt] = this.headerContent[lvl][(tnum * vcnt) + vcnt] = this.frameHeaderWithKeys(axis[rln]);\n }\n else {\n data[lvl][(tnum * vcnt) + vcnt] = this.headerContent[lvl][(tnum * vcnt) + vcnt] = this.frameHeaderWithKeys(axis[rln]);\n }\n var isSingleMeasure = (this.columns.length === 0 && this.values.length === 1) ? true : false;\n if ((this.isMutiMeasures || this.alwaysShowValueHeader || isSingleMeasure) && !this.valueAxis) {\n for (var vln = 0; vln < vcnt; vln++) {\n var name_3 = this.values[vln].caption ? this.values[vln].caption : this.values[vln].name;\n var calObj = {\n axis: 'column',\n actualText: this.values[vln].name,\n formattedText: name_3,\n level: 0,\n valueSort: {},\n colIndex: (tnum * vcnt) + 1 + vln,\n rowIndex: colItmLn\n };\n if (!data[colItmLn]) {\n data[colItmLn] = [];\n this.headerContent[colItmLn] = {};\n data[colItmLn][(tnum * vcnt) + 1 + vln] = this.headerContent[colItmLn][(tnum * vcnt) + 1 + vln] = calObj;\n }\n else {\n data[colItmLn][(tnum * vcnt) + 1 + vln] = this.headerContent[colItmLn][(tnum * vcnt) + 1 + vln] = calObj;\n }\n var vData = data[colItmLn][(tnum * vcnt) + 1 + vln].valueSort;\n vData[axis[rln].valueSort.levelName + this.valueSortSettings.headerDelimiter + name_3] = 1;\n vData.levelName = axis[rln].valueSort.levelName + this.valueSortSettings.headerDelimiter + name_3;\n if (vData && vData[sortText]) {\n this.valueSortSettings.columnIndex = (tnum * vcnt) + 1 + vln;\n }\n }\n }\n else if (axis[rln].valueSort && axis[rln].valueSort[sortText]) {\n this.valueSortSettings.columnIndex = (tnum * vcnt) + 1;\n }\n if (!this.pageSettings) {\n reformAxis[tnum].members = [];\n }\n }\n };\n /* tslint:disable */\n PivotEngine.prototype.getAggregateValue = function (rowIndex, columnIndex, value, type) {\n //rowIndex = rowIndex.sort();\n //columnIndex = columnIndex.sort();\n var rlt = rowIndex.length;\n //let clt: number = columnIndex.length;\n var mirror = {};\n var ri = 0;\n var ci = 0;\n var cellValue = 0;\n var avgCnt = 0;\n var isInit = true;\n var isValueExist = false;\n if (type && type.toLowerCase() === 'count') {\n while (rowIndex[ri] !== undefined) {\n if (columnIndex[rowIndex[ri]] !== undefined) {\n isValueExist = true;\n this.rawIndexObject[rowIndex[ri]] = rowIndex[ri];\n cellValue += (this.valueMatrix[rowIndex[ri]][value] === undefined ? 0 : 1);\n }\n ri++;\n }\n }\n else if (type && type.toLowerCase() === 'distinctcount') {\n var duplicateValues = [];\n while (rowIndex[ri] !== undefined) {\n if (columnIndex[rowIndex[ri]] !== undefined) {\n isValueExist = true;\n this.rawIndexObject[rowIndex[ri]] = rowIndex[ri];\n var currentVal = this.valueMatrix[rowIndex[ri]][value];\n if (currentVal !== undefined) {\n if (duplicateValues.length === 0 || (duplicateValues.length > 0 && duplicateValues.indexOf(currentVal) === -1)) {\n cellValue += 1;\n duplicateValues.push(currentVal);\n }\n }\n }\n ri++;\n }\n }\n else if (type && type.toLowerCase() === 'product') {\n while (rowIndex[ri] !== undefined) {\n if (columnIndex[rowIndex[ri]] !== undefined) {\n this.rawIndexObject[rowIndex[ri]] = rowIndex[ri];\n isValueExist = true;\n var currentVal = this.valueMatrix[rowIndex[ri]][value];\n if (currentVal !== undefined) {\n cellValue = (isInit ? 1 : (cellValue === 0 ? 1 : cellValue));\n cellValue *= currentVal;\n }\n isInit = false;\n }\n ri++;\n }\n }\n else if (type && (['populationstdev', 'samplestdev', 'populationvar', 'samplevar']).indexOf(type.toLowerCase()) !== -1) {\n var i = 0;\n var val = 0;\n var indexVal = [];\n var avgVal = 0;\n var cVal = 0;\n var avgDifferenceVal = 0;\n while (rowIndex[ri] !== undefined) {\n if (columnIndex[rowIndex[ri]] !== undefined) {\n isValueExist = true;\n this.rawIndexObject[rowIndex[ri]] = rowIndex[ri];\n var currentVal = this.valueMatrix[rowIndex[ri]][value];\n if (currentVal !== undefined) {\n val += currentVal;\n indexVal.push(currentVal);\n i++;\n }\n }\n ri++;\n }\n if (i > 0) {\n avgVal = val / i;\n for (var _i = 0, indexVal_1 = indexVal; _i < indexVal_1.length; _i++) {\n var index = indexVal_1[_i];\n avgDifferenceVal += Math.pow((index - avgVal), 2);\n }\n if ((['populationstdev', 'samplestdev']).indexOf(type.toLowerCase()) !== -1) {\n cVal = Math.sqrt(avgDifferenceVal / (type.toLowerCase() === 'populationstdev' ? i : (i - 1)));\n }\n else {\n cVal = avgDifferenceVal / (type.toLowerCase() === 'populationvar' ? i : (i - 1));\n }\n cellValue = (cVal === 0 ? NaN : cVal);\n }\n else {\n cellValue = val;\n }\n }\n else if (type && type.toLowerCase() === 'min') {\n var isFirst = true;\n while (rowIndex[ri] !== undefined) {\n if (columnIndex[rowIndex[ri]] !== undefined) {\n isValueExist = true;\n this.rawIndexObject[rowIndex[ri]] = rowIndex[ri];\n if (isFirst) {\n cellValue = this.valueMatrix[rowIndex[ri]][value];\n isFirst = false;\n }\n else {\n cellValue = this.valueMatrix[rowIndex[ri]][value] < cellValue ? this.valueMatrix[rowIndex[ri]][value] : cellValue;\n }\n }\n ri++;\n }\n }\n else if (type && type.toLowerCase() === 'max') {\n var isMaxFirst = true;\n while (rowIndex[ri] !== undefined) {\n if (columnIndex[rowIndex[ri]] !== undefined) {\n isValueExist = true;\n this.rawIndexObject[rowIndex[ri]] = rowIndex[ri];\n if (isMaxFirst) {\n cellValue = this.valueMatrix[rowIndex[ri]][value];\n isMaxFirst = false;\n }\n else {\n cellValue = this.valueMatrix[rowIndex[ri]][value] > cellValue ? this.valueMatrix[rowIndex[ri]][value] : cellValue;\n }\n }\n ri++;\n }\n }\n else if (type && type.toLowerCase() === 'calculatedfield') {\n while (rowIndex[ri] !== undefined) {\n if (columnIndex[rowIndex[ri]] !== undefined) {\n isValueExist = true;\n this.rawIndexObject[rowIndex[ri]] = rowIndex[ri];\n var calcField = this.calculatedFields[this.fields[value]];\n var actualFormula = calcField.formula;\n var aggregateField = {};\n if (this.calculatedFormulas[calcField.name]) {\n var calculatedFormulas = this.calculatedFormulas[calcField.name];\n for (var len = 0, lmt = calculatedFormulas.length; len < lmt; len++) {\n var aggregatedValue = calculatedFormulas[len];\n var value_1 = aggregateField[aggregatedValue.formula];\n if (value_1 === undefined) {\n var type_1 = aggregatedValue.type;\n value_1 = this.getAggregateValue(rowIndex, columnIndex, aggregatedValue.index, type_1);\n aggregateField[aggregatedValue.formula] = value_1;\n }\n actualFormula = (actualFormula).replace(aggregatedValue.formula, value_1.toString());\n }\n }\n /* tslint:disable */\n cellValue = eval(actualFormula);\n (cellValue === Infinity ? Infinity : JSON.parse(cellValue.toString()));\n /* tslint:enable */\n }\n ri++;\n }\n }\n else {\n while (rowIndex[ri] !== undefined) {\n if (columnIndex[rowIndex[ri]] !== undefined) {\n isValueExist = true;\n this.rawIndexObject[rowIndex[ri]] = rowIndex[ri];\n //let cIndx: number = isLeastLevel ? columnIndex.splice(columnIndex.indexOf(rowIndex[ri]), 1)[0] : rowIndex[ri];\n var currentVal = this.valueMatrix[rowIndex[ri]][value];\n cellValue += (currentVal === undefined ? 0 : currentVal);\n avgCnt++;\n }\n ri++;\n }\n }\n /* if (rlt > clt) {\n this.makeMirrorObject(rowIndex, mirror);\n while (columnIndex[ci] !== undefined) {\n if (mirror[columnIndex[ci]]) {\n let cIndx: number = isLeastLevel ? columnIndex.splice(ci, 1)[0] : columnIndex[ci];\n //rowIndex.splice\n sum += this.valueMatrix[cIndx][value];\n }\n ci++;\n }\n } else {\n this.makeMirrorObject(columnIndex, mirror);\n while (rowIndex[ri] !== undefined) {\n if (mirror[rowIndex[ri]]) {\n let cIndx: number = isLeastLevel ? columnIndex.splice(columnIndex.indexOf(rowIndex[ri]), 1)[0] : rowIndex[ri];\n sum += this.valueMatrix[rowIndex[ri]][value];\n }\n ri++;\n }\n } */\n return ((type && type.toLowerCase() === 'avg' && cellValue !== 0) ? (cellValue / avgCnt) : isValueExist ? cellValue : undefined);\n };\n /* tslint:enable */\n /** hidden */\n PivotEngine.prototype.getFormattedValue = function (value, fieldName) {\n var formattedValue = {\n formattedText: value !== undefined ? value === null ? 'null' : value.toString() : undefined,\n actualText: value !== undefined ? value === null ? 'null' : value : undefined,\n dateText: value !== undefined ? value === null ? 'null' : value : undefined\n };\n if (this.formatFields[fieldName] && value) {\n var formatField = (this.formatFields[fieldName].properties ?\n this.formatFields[fieldName].properties : this.formatFields[fieldName]);\n var formatSetting = extend({}, formatField, null, true);\n delete formatSetting.name;\n if (!formatSetting.minimumSignificantDigits && formatSetting.minimumSignificantDigits < 1) {\n delete formatSetting.minimumSignificantDigits;\n }\n if (!formatSetting.maximumSignificantDigits && formatSetting.maximumSignificantDigits < 1) {\n delete formatSetting.maximumSignificantDigits;\n }\n if (formatSetting.type) {\n formattedValue.formattedText = this.globalize.formatDate(new Date(value), formatSetting);\n }\n else {\n formattedValue.formattedText = this.globalize.formatNumber(value, formatSetting);\n }\n formattedValue.actualText = value;\n if (formatSetting.type && ['date', 'dateTime', 'time'].indexOf(this.formatFields[fieldName].type) > -1) {\n formatSetting.format = 'yyyy/MM/dd/HH/mm/ss';\n formattedValue.dateText = this.globalize.formatDate(new Date(value), formatSetting);\n }\n }\n return formattedValue;\n };\n PivotEngine.prototype.powerFunction = function (formula) {\n if (formula.indexOf('^') > -1) {\n var items_1 = [];\n while (formula.indexOf('(') > -1) {\n formula = formula.replace(/(\\([^\\(\\)]*\\))/g, function (text, item) {\n items_1.push(item);\n return ('~' + (items_1.length - 1));\n });\n }\n items_1.push(formula);\n formula = '~' + (items_1.length - 1);\n while (formula.indexOf('~') > -1) {\n formula = formula.replace(new RegExp('~' + '(\\\\d+)', 'g'), function (text, index) {\n return items_1[index].replace(/(\\w*)\\^(\\w*)/g, 'Math.pow' + '($1,$2)');\n });\n }\n }\n return formula;\n };\n return PivotEngine;\n}());\nexport { PivotEngine };\n","/**\n * Specifies pivot external events\n * @hidden\n */\n/** @hidden */\nexport var load = 'load';\n/** @hidden */\nexport var enginePopulating = 'enginePopulating';\n/** @hidden */\nexport var enginePopulated = 'enginePopulated';\n/** @hidden */\nexport var onFieldDropped = 'onFieldDropped';\n/** @hidden */\nexport var beforePivotTableRender = 'beforePivotTableRender';\n/** @hidden */\nexport var afterPivotTableRender = 'afterPivotTableRender';\n/** @hidden */\nexport var beforeExport = 'beforeExport';\n/** @hidden */\nexport var excelHeaderQueryCellInfo = 'excelHeaderQueryCellInfo';\n/** @hidden */\nexport var pdfHeaderQueryCellInfo = 'pdfHeaderQueryCellInfo';\n/** @hidden */\nexport var excelQueryCellInfo = 'excelQueryCellInfo';\n/** @hidden */\nexport var pdfQueryCellInfo = 'pdfQueryCellInfo';\n/** @hidden */\nexport var onPdfCellRender = 'onPdfCellRender';\n/** @hidden */\nexport var dataBound = 'dataBound';\n/** @hidden */\nexport var queryCellInfo = 'queryCellInfo';\n/** @hidden */\nexport var headerCellInfo = 'headerCellInfo';\n/** @hidden */\nexport var hyperlinkCellClick = 'hyperlinkCellClick';\n/** @hidden */\nexport var resizing = 'resizing';\n/** @hidden */\nexport var resizeStop = 'resizeStop';\n/** @hidden */\nexport var cellClick = 'cellClick';\n/** @hidden */\nexport var drillThrough = 'drillThrough';\n/** @hidden */\nexport var beforeColumnsRender = 'beforeColumnsRender';\n/** @hidden */\nexport var selected = 'selected';\n/** @hidden */\nexport var cellSelected = 'cellSelected';\n/** @hidden */\nexport var cellDeselected = 'cellDeselected';\n/** @hidden */\nexport var rowSelected = 'rowSelected';\n/** @hidden */\nexport var rowDeselected = 'rowDeselected';\n/** @hidden */\nexport var beginDrillThrough = 'beginDrillThrough';\n/** @hidden */\nexport var saveReport = 'saveReport';\n/** @hidden */\nexport var fetchReport = 'fetchReport';\n/** @hidden */\nexport var loadReport = 'loadReport';\n/** @hidden */\nexport var renameReport = 'renameReport';\n/** @hidden */\nexport var removeReport = 'removeReport';\n/** @hidden */\nexport var newReport = 'newReport';\n/** @hidden */\nexport var toolbarRender = 'toolbarRender';\n/** @hidden */\nexport var toolbarClick = 'toolbarClick';\n/** @hidden */\nexport var chartTooltipRender = 'chartTooltipRender';\n/** @hidden */\nexport var chartLoaded = 'chartLoaded';\n/** @hidden */\nexport var chartLoad = 'chartLoad';\n/** @hidden */\nexport var chartResized = 'chartResized';\n/** @hidden */\nexport var chartAxisLabelRender = 'chartAxisLabelRender';\n/** @hidden */\nexport var chartSeriesCreated = 'chartSeriesCreated';\n/** @hidden */\nexport var aggregateCellInfo = 'aggregateCellInfo';\n/** @hidden */\nexport var contextMenuClick = 'contextMenuClick';\n/** @hidden */\nexport var contextMenuOpen = 'contextMenuOpen';\n/**\n * Specifies pivot internal events\n */\n/** @hidden */\nexport var initialLoad = 'initial-load';\n/** @hidden */\nexport var uiUpdate = 'ui-update';\n/** @hidden */\nexport var scroll = 'scroll';\n/** @hidden */\nexport var contentReady = 'content-ready';\n/** @hidden */\nexport var dataReady = 'data-ready';\n/** @hidden */\nexport var initSubComponent = 'init-groupingbar';\n/** @hidden */\nexport var treeViewUpdate = 'tree-view-update';\n/** @hidden */\nexport var pivotButtonUpdate = 'pivot-button-update';\n/** @hidden */\nexport var initCalculatedField = 'init-calculatedfield';\n/** @hidden */\nexport var click = 'click';\n/** @hidden */\nexport var initToolbar = 'init-toolbar';\n","/**\n * CSS Constants\n * @hidden\n */\n/** @hidden */\nexport var ROOT = 'e-pivotfieldlist';\n/** @hidden */\nexport var RTL = 'e-rtl';\n/** @hidden */\nexport var DEVICE = 'e-device';\n/** @hidden */\nexport var ICON = 'e-icons';\n/** @hidden */\nexport var ICON_DISABLE = 'e-disable';\n/** @hidden */\nexport var ICON_HIDDEN = 'e-hide';\n/** @hidden */\nexport var AXISFIELD_ICON_CLASS = 'e-dropdown-icon';\nexport var WRAPPER_CLASS = 'e-pivotfieldlist-wrapper';\n/** @hidden */\nexport var CONTAINER_CLASS = 'e-field-list-container';\n/** @hidden */\nexport var TOGGLE_FIELD_LIST_CLASS = 'e-toggle-field-list';\n/** @hidden */\nexport var STATIC_FIELD_LIST_CLASS = 'e-static';\n/** @hidden */\nexport var TOGGLE_SELECT_CLASS = 'e-select-table';\n/** @hidden */\nexport var FIELD_TABLE_CLASS = 'e-field-table';\n/** @hidden */\nexport var FIELD_LIST_CLASS = 'e-field-list';\n/** @hidden */\nexport var FIELD_LIST_TREE_CLASS = 'e-field-list-tree';\n/** @hidden */\nexport var FIELD_HEADER_CLASS = 'e-field-header';\n/** @hidden */\nexport var FIELD_LIST_TITLE_CLASS = 'e-field-list-title';\n/** @hidden */\nexport var FIELD_LIST_TITLE_CONTENT_CLASS = 'e-title-content';\n/** @hidden */\nexport var FIELD_LIST_FOOTER_CLASS = 'e-field-list-footer';\n/** @hidden */\nexport var CALCULATED_FIELD_CLASS = 'e-calculated-field';\n/** @hidden */\nexport var FLAT_CLASS = 'e-flat e-primary';\n/** @hidden */\nexport var OUTLINE_CLASS = 'e-outline';\n/** @hidden */\nexport var AXIS_TABLE_CLASS = 'e-axis-table';\n/** @hidden */\nexport var LEFT_AXIS_PANEL_CLASS = 'e-left-axis-fields';\n/** @hidden */\nexport var RIGHT_AXIS_PANEL_CLASS = 'e-right-axis-fields';\n/** @hidden */\nexport var AXIS_HEADER_CLASS = 'e-axis-header';\n/** @hidden */\nexport var AXIS_CONTENT_CLASS = 'e-axis-content';\n/** @hidden */\nexport var AXIS_PROMPT_CLASS = 'e-draggable-prompt';\n/** @hidden */\nexport var PIVOT_BUTTON_WRAPPER_CLASS = 'e-pvt-btn-div';\n/** @hidden */\nexport var PIVOT_BUTTON_CLASS = 'e-pivot-button';\n/** @hidden */\nexport var PIVOT_BUTTON_CONTENT_CLASS = 'e-content';\n/** @hidden */\nexport var DRAG_CLONE_CLASS = 'e-button-drag-clone';\n/** @hidden */\nexport var SORT_CLASS = 'e-sort';\n/** @hidden */\nexport var SORT_DESCEND_CLASS = 'e-descend';\n/** @hidden */\nexport var FILTER_COMMON_CLASS = 'e-btn-filter';\n/** @hidden */\nexport var FILTER_CLASS = 'e-pv-filter';\n/** @hidden */\nexport var FILTERED_CLASS = 'e-pv-filtered';\n/** @hidden */\nexport var REMOVE_CLASS = 'e-remove';\n/** @hidden */\nexport var DRAG_CLASS = 'e-drag';\n/** @hidden */\nexport var DROP_INDICATOR_CLASS = 'e-drop-indicator';\n/** @hidden */\nexport var INDICATOR_HOVER_CLASS = 'e-drop-hover';\n/** @hidden */\nexport var MEMBER_EDITOR_DIALOG_CLASS = 'e-member-editor-dialog';\n/** @hidden */\nexport var EDITOR_TREE_WRAPPER_CLASS = 'e-member-editor-wrapper';\n/** @hidden */\nexport var EDITOR_TREE_CONTAINER_CLASS = 'e-member-editor-container';\n/** @hidden */\nexport var DRILLTHROUGH_GRID_CLASS = 'e-drillthrough-grid';\n/** @hidden */\nexport var DRILLTHROUGH_BODY_CLASS = 'e-drillthrough-body';\n/** @hidden */\nexport var DRILLTHROUGH_BODY_HEADER_CONTAINER_CLASS = 'e-drillthrough-body-header-container';\n/** @hidden */\nexport var DRILLTHROUGH_BODY_HEADER_CLASS = 'e-drillthrough-body-header';\n/** @hidden */\nexport var DRILLTHROUGH_BODY_HEADER_COMMON_CLASS = 'e-drillthrough-body-header-common';\n/** @hidden */\nexport var DRILLTHROUGH_BODY_HEADER_VALUE_CLASS = 'e-drillthrough-body-header-value';\n/** @hidden */\nexport var DRILLTHROUGH_DIALOG = 'e-drillthrough-dialog';\n/** @hidden */\nexport var EDITOR_LABEL_WRAPPER_CLASS = 'e-editor-label-wrapper';\n/** @hidden */\nexport var EDITOR_LABEL_CLASS = 'e-editor-label';\n/** @hidden */\nexport var CHECK_BOX_FRAME_CLASS = 'e-frame';\n/** @hidden */\nexport var NODE_CHECK_CLASS = 'e-check';\n/** @hidden */\nexport var NODE_STOP_CLASS = 'e-stop';\n/** @hidden */\nexport var OK_BUTTON_CLASS = 'e-ok-btn';\n/** @hidden */\nexport var CANCEL_BUTTON_CLASS = 'e-cancel-btn';\n/** @hidden */\nexport var ERROR_DIALOG_CLASS = 'e-pivot-error-dialog';\n/** @hidden */\nexport var DROPPABLE_CLASS = 'e-droppable';\n/** @hidden */\nexport var ROW_AXIS_CLASS = 'e-rows';\n/** @hidden */\nexport var COLUMN_AXIS_CLASS = 'e-columns';\n/** @hidden */\nexport var VALUE_AXIS_CLASS = 'e-values';\n/** @hidden */\nexport var FILTER_AXIS_CLASS = 'e-filters';\n/** @hidden */\nexport var GROUPING_BAR_CLASS = 'e-grouping-bar';\n/** @hidden */\nexport var VALUE_COLUMN_CLASS = 'e-value-column';\n/** @hidden */\nexport var GROUP_ROW_CLASS = 'e-group-rows';\n/** @hidden */\nexport var GROUP_COLUMN_CLASS = 'e-group-columns';\n/** @hidden */\nexport var GROUP_FLEX_CLASS = 'e-group-flex';\n/** @hidden */\nexport var GROUP_VALUE_CLASS = 'e-group-values';\n/** @hidden */\nexport var GROUP_FILTER_CLASS = 'e-group-filters';\n/** @hidden */\nexport var DIALOG_CLOSE_ICON_CLASS = 'e-icon-btn';\n/** @hidden */\nexport var NO_DRAG_CLASS = 'e-drag-restrict';\n/** @hidden */\nexport var SELECTED_NODE_CLASS = 'e-list-selected';\n/** @hidden */\nexport var TITLE_HEADER_CLASS = 'e-title-header';\n/** @hidden */\nexport var TITLE_CONTENT_CLASS = 'e-title-content';\n/** @hidden */\nexport var TEXT_CONTENT_CLASS = 'e-text-content';\n/** @hidden */\nexport var FOOTER_CONTENT_CLASS = 'e-footer-content';\n/** @hidden */\nexport var ADAPTIVE_CONTAINER_CLASS = 'e-adaptive-container';\n/** @hidden */\nexport var ADAPTIVE_FIELD_LIST_BUTTON_CLASS = 'e-field-list-btn';\n/** @hidden */\nexport var ADAPTIVE_CALCULATED_FIELD_BUTTON_CLASS = 'e-calculated-field-btn';\n/** @hidden */\nexport var BUTTON_SMALL_CLASS = 'e-small';\n/** @hidden */\nexport var BUTTON_ROUND_CLASS = 'e-round';\n/** @hidden */\nexport var ADD_ICON_CLASS = 'e-add-icon';\n/** @hidden */\nexport var BUTTON_FLAT_CLASS = 'e-flat';\n/** @hidden */\nexport var STATIC_CENTER_DIV_CLASS = 'e-center-div';\n/** @hidden */\nexport var STATIC_CENTER_HEADER_CLASS = 'e-center-title';\n/** @hidden */\nexport var ADAPTIVE_FIELD_LIST_DIALOG_CLASS = 'e-adaptive-field-list-dialog';\n/** @hidden */\nexport var LIST_TEXT_CLASS = 'e-list-text';\n/** @hidden */\nexport var LIST_SELECT_CLASS = 'e-selected-node';\n/** @hidden */\nexport var LIST_FRAME_CLASS = 'e-frame';\n/** @hidden */\nexport var EXCEL_FILTER_ICON_CLASS = 'e-excl-filter-icon';\n/** @hidden */\nexport var SELECTED_MENU_ICON_CLASS = 'e-selected-menu-icon';\n/** @hidden */\nexport var EMPTY_ICON_CLASS = 'e-emptyicon';\n/** @hidden */\nexport var SUB_MENU_CLASS = 'e-submenu';\n/** @hidden */\nexport var FOCUSED_CLASS = 'e-focused';\n/** @hidden */\nexport var SELECTED_CLASS = 'e-selected';\n/** @hidden */\nexport var MENU_ITEM_CLASS = 'e-menu-item';\n/** @hidden */\nexport var FILTER_MENU_OPTIONS_CLASS = 'e-filtermenu-options';\n/** @hidden */\nexport var SELECTED_OPTION_ICON_CLASS = 'e-selected-option-icon';\n/** @hidden */\nexport var FILTER_DIV_CONTENT_CLASS = 'e-filter-div-content';\n/** @hidden */\nexport var FILTER_TEXT_DIV_CLASS = 'e-filter-text-div';\n/** @hidden */\nexport var BETWEEN_TEXT_DIV_CLASS = 'e-between-text-div';\n/** @hidden */\nexport var SEPARATOR_DIV_CLASS = 'e-separator-div';\n/** @hidden */\nexport var FILTER_OPTION_WRAPPER_1_CLASS = 'e-filter-option-wrapper-1';\n/** @hidden */\nexport var FILTER_OPTION_WRAPPER_2_CLASS = 'e-filter-option-wrapper-2';\n/** @hidden */\nexport var FILTER_INPUT_DIV_1_CLASS = 'e-filter-input-div-1';\n/** @hidden */\nexport var FILTER_INPUT_DIV_2_CLASS = 'e-filter-input-div-2';\n/** @hidden */\nexport var VALUE_OPTIONS_CLASS = 'e-value-options';\n/** @hidden */\nexport var FILTER_OPERATOR_CLASS = 'e-filter-operator';\n/** @hidden */\nexport var COLLAPSE = 'e-collapse';\n/** @hidden */\nexport var EXPAND = 'e-expand';\n/** @hidden */\nexport var TABLE = 'e-table';\n/** @hidden */\nexport var BODY = 'e-body';\n/** @hidden */\nexport var PIVOTBODY = 'e-pivotbody';\n/** @hidden */\nexport var COLUMNSHEADER = 'e-columnsheader';\n/** @hidden */\nexport var ROWSHEADER = 'e-rowsheader';\n/** @hidden */\nexport var VALUESCONTENT = 'e-valuescontent';\n/** @hidden */\nexport var VALUECELL = 'e-valuecell';\n/** @hidden */\nexport var PIVOTHEADER = 'e-pivotheader';\n/** @hidden */\nexport var PGHEADERS = 'e-pgheaders';\n/** @hidden */\nexport var TOPHEADER = 'e-topheader';\n/** @hidden */\nexport var HEADERCELL = 'e-headercell';\n/** @hidden */\nexport var SUMMARY = 'e-summary';\n/** @hidden */\nexport var CELLVALUE = 'e-cellvalue';\n/** @hidden */\nexport var ROW = 'e-row';\n/** @hidden */\nexport var PIVOTTOOLTIP = 'e-pivottooltip';\n/** @hidden */\nexport var TOOLTIP_HEADER = 'e-tooltipheader';\n/** @hidden */\nexport var TOOLTIP_CONTENT = 'e-tooltipcontent';\n/** @hidden */\nexport var NEXTSPAN = 'e-nextspan';\n/** @hidden */\nexport var LASTSPAN = 'e-lastspan';\n/** @hidden */\nexport var EDITOR_SEARCH_WRAPPER_CLASS = 'e-editor-search-wrapper';\n/** @hidden */\nexport var EDITOR_SEARCH_CLASS = 'e-editor-search';\n/** @hidden */\nexport var SELECT_ALL_WRAPPER_CLASS = 'e-select-all-wrapper';\n/** @hidden */\nexport var SELECT_ALL_CLASS = 'e-select-all';\n/** @hidden */\nexport var PIVOTCALC = 'e-pivot-calc';\n/** @hidden */\nexport var CALCDIALOG = 'e-pivot-calc-dialog-div';\n/** @hidden */\nexport var CALCRADIO = 'e-pivot-calc-radio';\n/** @hidden */\nexport var CALCCHECK = 'e-pivot-calc-check';\n/** @hidden */\nexport var CALCINPUT = 'e-pivot-calc-input';\n/** @hidden */\nexport var CALCINPUTDIV = 'e-pivot-calc-input-div';\n/** @hidden */\nexport var CALCOUTERDIV = 'e-pivot-calc-outer-div';\n/** @hidden */\nexport var FLAT = 'e-flat';\n/** @hidden */\nexport var FORMAT = 'e-format';\n/** @hidden */\nexport var FORMULA = 'e-pivot-formula';\n/** @hidden */\nexport var TREEVIEW = 'e-pivot-treeview';\n/** @hidden */\nexport var TREEVIEWOUTER = 'e-pivot-treeview-outer';\n/** @hidden */\nexport var CALCCANCELBTN = 'e-pivot-cancel-button';\n/** @hidden */\nexport var CALCADDBTN = 'e-pivot-add-button';\n/** @hidden */\nexport var CALCOKBTN = 'e-pivot-ok-button';\n/** @hidden */\nexport var CALCACCORD = 'e-pivot-accord';\n/** @hidden */\nexport var CALCBUTTONDIV = 'e-pivot-button-div';\n/** @hidden */\nexport var AXIS_ICON_CLASS = 'e-axis';\n/** @hidden */\nexport var AXIS_ROW_CLASS = 'e-axis-row';\n/** @hidden */\nexport var AXIS_COLUMN_CLASS = 'e-axis-column';\n/** @hidden */\nexport var AXIS_VALUE_CLASS = 'e-axis-value';\n/** @hidden */\nexport var AXIS_FILTER_CLASS = 'e-axis-filter';\n/** @hidden */\nexport var AXIS_NAVIGATE_WRAPPER_CLASS = 'e-axis-nav-div';\n/** @hidden */\nexport var LEFT_NAVIGATE_WRAPPER_CLASS = 'e-left-nav-wrapper';\n/** @hidden */\nexport var RIGHT_NAVIGATE_WRAPPER_CLASS = 'e-right-nav-wrapper';\n/** @hidden */\nexport var LEFT_NAVIGATE_CLASS = 'e-left-nav-icon';\n/** @hidden */\nexport var RIGHT_NAVIGATE_CLASS = 'e-right-nav-icon';\n/** @hidden */\nexport var GRID_CLASS = 'e-grid';\n/** @hidden */\nexport var PIVOT_VIEW_CLASS = 'e-pivotview';\n/** @hidden */\nexport var PIVOT_ALL_FIELD_TITLE_CLASS = 'e-pivot-all-field-title';\n/** @hidden */\nexport var PIVOT_FORMULA_TITLE_CLASS = 'e-pivot-formula-title';\n/** @hidden */\nexport var PIVOT_CONTEXT_MENU_CLASS = 'e-pivot-context-menu';\n/** @hidden */\nexport var MENU_DISABLE = 'e-disabled';\n/** @hidden */\nexport var MENU_HIDE = 'e-menu-hide';\n/** @hidden */\nexport var EMPTY_MEMBER_CLASS = 'e-member-prompt';\n/** @hidden */\nexport var CALC_EDIT = 'e-edit';\n/** @hidden */\nexport var CALC_EDITED = 'e-edited';\n/** @hidden */\nexport var EMPTY_FIELD = 'e-empty-field';\n/** @hidden */\nexport var FORMAT_DIALOG = 'e-pivot-formatting-dialog';\n/** @hidden */\nexport var FORMAT_CONDITION_BUTTON = 'e-format-condition-button';\n/** @hidden */\nexport var FORMAT_NEW = 'e-new-format';\n/** @hidden */\nexport var FORMAT_OUTER = 'e-format-outer-div';\n/** @hidden */\nexport var FORMAT_INNER = 'e-format-inner-div';\n/** @hidden */\nexport var FORMAT_TABLE = 'e-format-table';\n/** @hidden */\nexport var FORMAT_VALUE_LABEL = 'e-format-value-label';\n/** @hidden */\nexport var FORMAT_LABEL = 'e-format-label';\n/** @hidden */\nexport var INPUT = 'e-input';\n/** @hidden */\nexport var FORMAT_VALUE1 = 'e-format-value1';\n/** @hidden */\nexport var FORMAT_VALUE2 = 'e-format-value2';\n/** @hidden */\nexport var FORMAT_VALUE_SPAN = 'e-format-value-span';\n/** @hidden */\nexport var FORMAT_FONT_COLOR = 'e-format-font-color';\n/** @hidden */\nexport var FORMAT_BACK_COLOR = 'e-format-back-color';\n/** @hidden */\nexport var FORMAT_VALUE_PREVIEW = 'e-format-value-preview';\n/** @hidden */\nexport var FORMAT_COLOR_PICKER = 'e-format-color-picker';\n/** @hidden */\nexport var FORMAT_DELETE_ICON = 'e-format-delete-icon';\n/** @hidden */\nexport var FORMAT_DELETE_BUTTON = 'e-format-delete-button';\n/** @hidden */\nexport var SELECTED_COLOR = 'e-selected-color';\n/** @hidden */\nexport var DIALOG_HEADER = 'e-dlg-header';\n/** @hidden */\nexport var FORMAT_APPLY_BUTTON = 'e-format-apply-button';\n/** @hidden */\nexport var FORMAT_CANCEL_BUTTON = 'e-format-cancel-button';\n/** @hidden */\nexport var FORMAT_ROUND_BUTTON = 'e-small e-round';\n/** @hidden */\nexport var VIRTUALTRACK_DIV = 'e-virtualtrack';\n/** @hidden */\nexport var MOVABLECONTENT_DIV = 'e-movablecontent';\n/** @hidden */\nexport var FROZENCONTENT_DIV = 'e-frozencontent';\n/** @hidden */\nexport var MOVABLEHEADER_DIV = 'e-movableheader';\n/** @hidden */\nexport var FROZENHEADER_DIV = 'e-frozenheader';\n/** @hidden */\nexport var DEFER_APPLY_BUTTON = 'e-defer-apply-button';\n/** @hidden */\nexport var DEFER_CANCEL_BUTTON = 'e-defer-cancel-button';\n/** @hidden */\nexport var LAYOUT_FOOTER = 'e-layout-footer';\n/** @hidden */\nexport var CELL_SELECTED_BGCOLOR = 'e-cellselectionbackground';\n/** @hidden */\nexport var SELECTED_BGCOLOR = 'e-selectionbackground';\n/** @hidden */\nexport var BUTTON_LAYOUT = 'e-button-layout';\n/** @hidden */\nexport var CHECKBOX_LAYOUT = 'e-checkbox-layout';\n/** @hidden */\nexport var DEFER_UPDATE_BUTTON = 'e-defer-update-btn';\n/** @hidden */\nexport var HEADERCONTENT = 'e-headercontent';\n/** @hidden */\nexport var BACK_ICON = 'e-field-list-back-icon';\n/** @hidden */\nexport var TITLE_MOBILE_HEADER = 'e-title-mobile-header';\n/** @hidden */\nexport var TITLE_MOBILE_CONTENT = 'e-title-mobile-content';\n/** @hidden */\nexport var ROW_CELL_CLASS = 'e-rowcell';\n/** @hidden */\nexport var CELL_ACTIVE_BGCOLOR = 'e-active';\n/** @hidden */\nexport var SPAN_CLICKED = 'e-spanclicked';\n/** @hidden */\nexport var ROW_SELECT = 'e-rowselect';\n/** @hidden */\nexport var GRID_HEADER = 'e-gridheader';\n/** @hidden */\nexport var GRID_EXPORT = 'e-export';\n/** @hidden */\nexport var PIVOTVIEW_EXPORT = 'e-pivotview-export';\n/** @hidden */\nexport var PIVOTVIEW_GRID = 'e-pivotview-grid';\n/** @hidden */\nexport var PIVOTVIEW_EXPAND = 'e-pivotview-expand';\n/** @hidden */\nexport var PIVOTVIEW_COLLAPSE = 'e-pivotview-collapse';\n/** @hidden */\nexport var GRID_PDF_EXPORT = 'e-pivotview-pdf-export';\n/** @hidden */\nexport var GRID_EXCEL_EXPORT = 'e-pivotview-excel-export';\n/** @hidden */\nexport var GRID_CSV_EXPORT = 'e-pivotview-csv-export';\n/** @hidden */\nexport var GRID_LOAD = 'e-load-report';\n/** @hidden */\nexport var GRID_NEW = 'e-new-report';\n/** @hidden */\nexport var GRID_RENAME = 'e-rename-report';\n/** @hidden */\nexport var GRID_REMOVE = 'e-remove-report';\n/** @hidden */\nexport var GRID_SAVEAS = 'e-saveas-report';\n/** @hidden */\nexport var GRID_SAVE = 'e-save-report';\n/** @hidden */\nexport var GRID_SUB_TOTAL = 'e-sub-total';\n/** @hidden */\nexport var GRID_GRAND_TOTAL = 'e-grand-total';\n/** @hidden */\nexport var GRID_FORMATTING = 'e-toolbar-formatting';\n/** @hidden */\nexport var GRID_TOOLBAR = 'e-pivot-toolbar';\n/** @hidden */\nexport var GRID_REPORT_LABEL = 'e-pivotview-report-label';\n/** @hidden */\nexport var GRID_REPORT_INPUT = 'e-pivotview-report-input';\n/** @hidden */\nexport var GRID_REPORT_OUTER = 'e-report-outer';\n/** @hidden */\nexport var GRID_REPORT_DIALOG = 'e-pivotview-report-dialog';\n/** @hidden */\nexport var TOOLBAR_FIELDLIST = 'e-toolbar-fieldlist';\n/** @hidden */\nexport var TOOLBAR_GRID = 'e-toolbar-grid';\n/** @hidden */\nexport var TOOLBAR_CHART = 'e-toolbar-chart';\n/** @hidden */\nexport var REPORT_LIST_DROP = 'e-reportlist-drop';\n/** @hidden */\nexport var PIVOTCHART = 'e-pivotchart';\n/** @hidden */\nexport var GROUP_CHART_ROW = 'e-group-chart-rows';\n/** @hidden */\nexport var GROUP_CHART_COLUMN = 'e-group-chart-columns';\n/** @hidden */\nexport var GROUP_CHART_VALUE = 'e-group-chart-values';\n/** @hidden */\nexport var GROUP_CHART_MULTI_VALUE = 'e-group-chart-multi-values';\n/** @hidden */\nexport var GROUP_CHART_FILTER = 'e-group-chart-filters';\n/** @hidden */\nexport var GROUP_CHART_VALUE_DROPDOWN_DIV = 'e-group-chart-values-drodown-div';\n/** @hidden */\nexport var GROUP_CHART_VALUE_DROPDOWN = 'e-group-chart-values-drodown';\n/** @hidden */\nexport var CHART_GROUPING_BAR_CLASS = 'e-chart-grouping-bar';\n/** @hidden */\nexport var PIVOT_DISABLE_ICON = 'e-pivotview-disable-icon';\n/** @hidden */\nexport var PIVOT_SELECT_ICON = 'e-pivotview-select-icon';\n/** @hidden */\nexport var VALUESHEADER = 'e-valuesheader';\n/** @hidden */\nexport var ICON_ASC = 'e-icon-ascending';\n/** @hidden */\nexport var ICON_DESC = 'e-icon-descending';\n/** @hidden */\nexport var CONTEXT_EXPAND_ID = '#expand';\n/** @hidden */\nexport var CONTEXT_COLLAPSE_ID = '#collapse';\n/** @hidden */\nexport var CONTEXT_DRILLTHROUGH_ID = '#drillthrough';\n/** @hidden */\nexport var CONTEXT_SORT_ASC_ID = '#sortasc';\n/** @hidden */\nexport var CONTEXT_SORT_DESC_ID = '#sortdesc';\n/** @hidden */\nexport var CONTEXT_CALC_ID = '#CalculatedField';\n/** @hidden */\nexport var CONTEXT_PDF_ID = '#pdf';\n/** @hidden */\nexport var CONTEXT_EXCEL_ID = '#excel';\n/** @hidden */\nexport var CONTEXT_CSV_ID = '#csv';\n/** @hidden */\nexport var CONTEXT_EXPORT_ID = '#exporting';\n/** @hidden */\nexport var CONTEXT_AGGREGATE_ID = '#aggregate';\n","import { createElement, remove, extend, getInstance } from '@syncfusion/ej2-base';\nimport * as cls from '../../common/base/css-constant';\nimport { ContextMenu as Menu } from '@syncfusion/ej2-navigations';\nimport { Dialog } from '@syncfusion/ej2-popups';\nimport { MaskedTextBox } from '@syncfusion/ej2-inputs';\nimport { DropDownList } from '@syncfusion/ej2-dropdowns';\nimport * as events from '../../common/base/constant';\n/**\n * `AggregateMenu` module to create aggregate type popup.\n */\n/** @hidden */\nvar AggregateMenu = /** @class */ (function () {\n /**\n * Constructor for the rener action.\n * @hidden\n */\n function AggregateMenu(parent) {\n this.parent = parent;\n }\n /**\n * Initialize the pivot table rendering\n * @returns void\n * @private\n */\n AggregateMenu.prototype.render = function (args, parentElement) {\n this.parentElement = parentElement;\n this.openContextMenu(args);\n };\n AggregateMenu.prototype.openContextMenu = function (args) {\n if (this.menuInfo === undefined) {\n this.createContextMenu();\n }\n this.currentMenu = args.currentTarget;\n var pos = this.currentMenu.getBoundingClientRect();\n if (this.parent.enableRtl) {\n this.menuInfo.open(pos.top, pos.left - 105);\n }\n else {\n this.menuInfo.open(pos.top, pos.left);\n }\n };\n AggregateMenu.prototype.createContextMenu = function () {\n var menuItems = [\n { text: 'Sum', id: 'Sum' },\n { text: 'Count', id: 'Count' },\n { text: 'Distinct Count', id: 'DistinctCount' },\n { text: 'Product', id: 'Product' },\n { text: 'Avg', id: 'Avg' },\n { text: 'Min', id: 'Min' },\n { text: 'Max', id: 'Max' },\n { text: 'More...', id: 'MoreOption' }\n ];\n var menuOptions = {\n items: menuItems,\n enableRtl: this.parent.enableRtl,\n beforeOpen: this.beforeMenuOpen.bind(this),\n select: this.selectOptionInContextMenu.bind(this)\n };\n var removeContextMenu = document.getElementById(this.parent.element.id + 'valueFieldContextMenu');\n if (removeContextMenu !== null) {\n removeContextMenu.innerHTML = '';\n }\n var contextMenu = createElement('ul', {\n id: this.parent.element.id + 'valueFieldContextMenu'\n });\n this.parent.element.appendChild(contextMenu);\n this.menuInfo = new Menu(menuOptions);\n this.menuInfo.appendTo(contextMenu);\n };\n AggregateMenu.prototype.beforeMenuOpen = function (args) {\n args.element.style.zIndex = (this.menuInfo.element.style.zIndex + 3).toString();\n args.element.style.display = 'inline';\n };\n /** @hidden */\n AggregateMenu.prototype.createValueSettingsDialog = function (target, parentElement) {\n var _this = this;\n this.parentElement = parentElement;\n var valueDialog = createElement('div', {\n id: this.parentElement.id + '_ValueDialog',\n className: 'e-value-field-settings',\n attrs: { 'data-field': target.id }\n });\n this.parentElement.appendChild(valueDialog);\n this.valueDialog = new Dialog({\n animationSettings: { effect: 'Fade' },\n allowDragging: true,\n header: this.parent.localeObj.getConstant('valueFieldSettings'),\n content: this.createFieldOptions(target),\n isModal: true,\n visible: true,\n showCloseIcon: true,\n enableRtl: this.parent.enableRtl,\n width: 'auto',\n height: 'auto',\n position: { X: 'center', Y: 'center' },\n buttons: [\n {\n click: this.updateValueSettings.bind(this),\n buttonModel: { cssClass: cls.OK_BUTTON_CLASS, content: this.parent.localeObj.getConstant('ok'), isPrimary: true }\n },\n {\n click: function () { _this.valueDialog.hide(); },\n buttonModel: { cssClass: cls.CANCEL_BUTTON_CLASS, content: this.parent.localeObj.getConstant('cancel') }\n }\n ],\n closeOnEscape: true,\n target: this.parentElement,\n overlayClick: function () { _this.removeDialog(); },\n close: this.removeDialog.bind(this)\n });\n this.valueDialog.appendTo(valueDialog);\n };\n /* tslint:disable:all */\n AggregateMenu.prototype.createFieldOptions = function (buttonElement) {\n var fieldCaption = buttonElement.getAttribute('data-caption');\n var summaryType = buttonElement.getAttribute('data-type');\n var baseField = buttonElement.getAttribute('data-basefield');\n var baseItem = buttonElement.getAttribute('data-baseitem');\n summaryType = (summaryType.toString() !== 'undefined' ? summaryType : 'Sum');\n var summaryDataSource = [\n { value: 'Sum', text: 'Sum' },\n { value: 'Count', text: 'Count' },\n { value: 'DistinctCount', text: 'Distinct Count' },\n { value: 'Product', text: 'Product' },\n { value: 'Avg', text: 'Avg' },\n { value: 'Min', text: 'Min' },\n { value: 'Max', text: 'Max' },\n { value: 'Index', text: 'Index' },\n { value: 'SampleStDev', text: 'Sample StDev' },\n { value: 'PopulationStDev', text: 'Population StDev' },\n { value: 'SampleVar', text: 'Sample Var' },\n { value: 'PopulationVar', text: 'Population Var' },\n { value: 'RunningTotals', text: 'Running Totals' },\n { value: 'DifferenceFrom', text: 'Difference From' },\n { value: 'PercentageOfDifferenceFrom', text: '% of Difference From' },\n { value: 'PercentageOfGrandTotal', text: '% of Grand Total' },\n { value: 'PercentageOfColumnTotal', text: '% of Column Total' },\n { value: 'PercentageOfRowTotal', text: '% of Row Total' },\n { value: 'PercentageOfParentTotal', text: '% of Parent Total' },\n { value: 'PercentageOfParentColumnTotal', text: '% of Parent Column Total' },\n { value: 'PercentageOfParentRowTotal', text: '% of Parent Row Total' },\n ];\n var baseItemTypes = ['DifferenceFrom', 'PercentageOfDifferenceFrom'];\n var baseFieldTypes = ['DifferenceFrom', 'PercentageOfDifferenceFrom', 'PercentageOfParentTotal'];\n var dataFields = extend([], this.parent.dataSource.rows, null, true);\n dataFields = dataFields.concat(this.parent.dataSource.columns);\n var fieldDataSource = [];\n var fieldItemDataSource = [];\n // let summaryDataSource: { [key: string]: Object }[] = [];\n // for (let type of summaryTypes) {\n // summaryDataSource.push({ value: type, text: type });\n // }\n for (var _i = 0, dataFields_1 = dataFields; _i < dataFields_1.length; _i++) {\n var field = dataFields_1[_i];\n var value = field.name;\n var text = (field.caption ? field.caption : field.name);\n fieldDataSource.push({ value: value, text: text });\n }\n baseField = (baseField.toString() !== 'undefined' ? baseField : fieldDataSource[0].value);\n fieldItemDataSource = Object.keys(this.parent.engineModule.fieldList[(baseField.toString() !== 'undefined' ?\n baseField : fieldDataSource[0].value)].formattedMembers);\n baseItem = (baseItem.toString() !== 'undefined' ? baseItem : fieldItemDataSource[0]);\n var mainDiv = createElement('div', {\n className: 'e-value-field-div-content', id: this.parentElement.id + '_field_div_content',\n attrs: { 'data-type': summaryType, 'data-caption': fieldCaption, 'data-basefield': baseField, 'data-baseitem': baseItem }\n });\n var textWrappper = createElement('div', { className: 'e-field-name-text-wrapper', });\n var filterWrapperDiv1 = createElement('div', { className: 'e-field-option-wrapper' });\n var optionWrapperDiv1 = createElement('div', { className: 'e-type-option-wrapper' });\n var optionWrapperDiv2 = createElement('div', { className: 'e-base-field-option-wrapper' });\n var optionWrapperDiv3 = createElement('div', { className: 'e-base-item-option-wrapper' });\n var texttitle = createElement('div', { className: 'e-field-name-title', innerHTML: this.parent.localeObj.getConstant('sourceName') + ' ' });\n var textContent = createElement('div', { className: 'e-field-name-content', innerHTML: buttonElement.id.toString() });\n var inputTextDiv1 = createElement('div', {\n className: 'e-type-option-text', innerHTML: this.parent.localeObj.getConstant('sourceCaption')\n });\n var optionTextDiv1 = createElement('div', {\n className: 'e-base-field-option-text', innerHTML: this.parent.localeObj.getConstant('summarizeValuesBy')\n });\n var optionTextDiv2 = createElement('div', {\n className: 'e-base-item-option-text', innerHTML: this.parent.localeObj.getConstant('baseField')\n });\n var optionTextDiv3 = createElement('div', {\n className: 'e-type-option-text', innerHTML: this.parent.localeObj.getConstant('baseItem')\n });\n var inputDiv1 = createElement('div', { className: 'e-caption-input-wrapper' });\n var dropOptionDiv1 = createElement('div', { id: this.parentElement.id + '_type_option' });\n var dropOptionDiv2 = createElement('div', { id: this.parentElement.id + '_base_field_option' });\n var dropOptionDiv3 = createElement('div', { id: this.parentElement.id + '_base_item_option' });\n var inputField1 = createElement('input', {\n id: this.parentElement.id + 'type_input_option',\n className: 'e-caption-input-text',\n attrs: { 'type': 'text' }\n });\n textWrappper.appendChild(texttitle);\n textWrappper.appendChild(textContent);\n inputDiv1.appendChild(inputTextDiv1);\n inputDiv1.appendChild(inputField1);\n optionWrapperDiv1.appendChild(optionTextDiv1);\n optionWrapperDiv2.appendChild(optionTextDiv2);\n optionWrapperDiv3.appendChild(optionTextDiv3);\n optionWrapperDiv1.appendChild(dropOptionDiv1);\n optionWrapperDiv2.appendChild(dropOptionDiv2);\n optionWrapperDiv3.appendChild(dropOptionDiv3);\n filterWrapperDiv1.appendChild(textWrappper);\n filterWrapperDiv1.appendChild(inputDiv1);\n filterWrapperDiv1.appendChild(optionWrapperDiv1);\n filterWrapperDiv1.appendChild(optionWrapperDiv2);\n filterWrapperDiv1.appendChild(optionWrapperDiv3);\n mainDiv.appendChild(filterWrapperDiv1);\n var popupInstance = this;\n var optionWrapper1 = new DropDownList({\n dataSource: summaryDataSource,\n fields: { value: 'value', text: 'text' },\n value: summaryType,\n // popupWidth: 'auto',\n cssClass: cls.VALUE_OPTIONS_CLASS, width: '100%',\n change: function (args) {\n optionWrapper2.enabled = baseFieldTypes.indexOf(args.value) !== -1 ? true : false;\n optionWrapper3.enabled = baseItemTypes.indexOf(args.value) !== -1 ? true : false;\n if (optionWrapper3.enabled && optionWrapper3.dataSource.length === 1) {\n optionWrapper3.dataSource = fieldItemDataSource;\n optionWrapper3.dataBind();\n }\n }\n });\n optionWrapper1.appendTo(dropOptionDiv1);\n var optionWrapper2 = new DropDownList({\n dataSource: fieldDataSource, enableRtl: this.parent.enableRtl,\n fields: { value: 'value', text: 'text' },\n value: baseField,\n // popupWidth: 'auto',\n enabled: (baseFieldTypes.indexOf(summaryType) !== -1 ? true : false),\n cssClass: cls.VALUE_OPTIONS_CLASS, width: '100%',\n change: function (args) {\n fieldItemDataSource = Object.keys(popupInstance.parent.engineModule.fieldList[args.value].formattedMembers);\n optionWrapper3.dataSource = fieldItemDataSource;\n optionWrapper3.value = fieldItemDataSource[0];\n optionWrapper3.filterBarPlaceholder = popupInstance.parent.localeObj.getConstant('example') + ' ' + fieldItemDataSource[0];\n optionWrapper3.dataBind();\n }\n });\n optionWrapper2.appendTo(dropOptionDiv2);\n var optionWrapper3 = new DropDownList({\n dataSource: [fieldItemDataSource[0]], enableRtl: this.parent.enableRtl,\n value: baseItem,\n // popupWidth: 'auto',\n allowFiltering: true,\n filterBarPlaceholder: this.parent.localeObj.getConstant('example') + ' ' + fieldItemDataSource[0],\n enabled: (baseItemTypes.indexOf(summaryType) !== -1 ? true : false),\n cssClass: cls.FILTER_OPERATOR_CLASS, width: '100%',\n });\n optionWrapper3.appendTo(dropOptionDiv3);\n var inputObj1 = new MaskedTextBox({\n placeholder: 'Enter field caption',\n // floatLabelType: 'Auto',\n enableRtl: this.parent.enableRtl,\n value: fieldCaption, width: '100%'\n });\n inputObj1.appendTo(inputField1);\n return mainDiv;\n };\n /* tslint:enable:all */\n AggregateMenu.prototype.selectOptionInContextMenu = function (menu) {\n if (menu.item.text !== null) {\n var buttonElement = this.currentMenu.parentElement;\n if (menu.item.id === 'MoreOption') {\n this.createValueSettingsDialog(buttonElement, this.parentElement);\n }\n else {\n var field = buttonElement.getAttribute('data-uid');\n var valuefields = this.parent.dataSource.values;\n var contentElement = buttonElement.querySelector('.e-content');\n var captionName = menu.item.text + ' ' + 'of' + ' ' + this.parent.engineModule.fieldList[field].caption;\n contentElement.innerHTML = captionName;\n contentElement.setAttribute('title', captionName);\n buttonElement.setAttribute('data-type', menu.item.id);\n for (var vCnt = 0; vCnt < this.parent.dataSource.values.length; vCnt++) {\n if (this.parent.dataSource.values[vCnt].name === field) {\n var dataSourceItem = valuefields[vCnt].properties ?\n valuefields[vCnt].properties : valuefields[vCnt];\n dataSourceItem.type = menu.item.id;\n this.parent.lastAggregationInfo = dataSourceItem;\n /* tslint:disable-next-line:no-any */\n }\n }\n this.updateDataSource();\n }\n }\n };\n AggregateMenu.prototype.updateDataSource = function (isRefreshed) {\n if (!this.parent.allowDeferLayoutUpdate || this.parent.getModuleName() === 'pivotview') {\n this.parent.updateDataSource(isRefreshed);\n }\n else {\n if (this.parent.getModuleName() === 'pivotfieldlist' && this.parent.renderMode === 'Popup') {\n this.parent.pivotGridModule.\n setProperties({ dataSource: this.parent.dataSource.properties }, true);\n this.parent.pivotGridModule.notify(events.uiUpdate, this);\n this.parent.pivotGridModule.engineModule = this.parent.engineModule;\n }\n else {\n this.parent.triggerPopulateEvent();\n }\n }\n };\n AggregateMenu.prototype.updateValueSettings = function () {\n var dialogElement = this.valueDialog.element;\n var captionInstance = getInstance('#' + this.parentElement.id + 'type_input_option', MaskedTextBox);\n var summaryInstance = getInstance('#' + this.parentElement.id + '_type_option', DropDownList);\n var baseFieldInstance = getInstance('#' + this.parentElement.id + '_base_field_option', DropDownList);\n var baseItemInstance = getInstance('#' + this.parentElement.id + '_base_item_option', DropDownList);\n var fieldName = dialogElement.getAttribute('data-field');\n var buttonElement;\n if (this.parentElement.querySelector('.' + cls.PIVOT_BUTTON_CLASS)) {\n buttonElement = this.parentElement.querySelector('.' + cls.PIVOT_BUTTON_CLASS + '#' + fieldName);\n }\n if (buttonElement) {\n var contentElement = buttonElement.querySelector('.e-content');\n var captionName = this.parent.localeObj.getConstant(summaryInstance.value) + ' ' + 'of' + ' ' + captionInstance.value;\n contentElement.innerHTML = captionName;\n contentElement.setAttribute('title', captionName);\n buttonElement.setAttribute('data-type', summaryInstance.value);\n buttonElement.setAttribute('data-caption', captionInstance.value);\n buttonElement.setAttribute('data-basefield', baseFieldInstance.value);\n buttonElement.setAttribute('data-baseitem', baseItemInstance.value);\n }\n var selectedField = this.parent.pivotCommon.eventBase.getFieldByName(fieldName, this.parent.dataSource.values);\n selectedField = selectedField.properties ?\n selectedField.properties : selectedField;\n selectedField.caption = captionInstance.value;\n selectedField.type = summaryInstance.value;\n selectedField.baseField = baseFieldInstance.value;\n selectedField.baseItem = baseItemInstance.value;\n this.valueDialog.close();\n // this.parent.axisFieldModule.render();\n this.parent.lastAggregationInfo = selectedField;\n this.updateDataSource(true);\n };\n AggregateMenu.prototype.removeDialog = function () {\n if (this.valueDialog && !this.valueDialog.isDestroyed) {\n this.valueDialog.destroy();\n }\n if (document.getElementById(this.parentElement.id + '_ValueDialog')) {\n remove(document.getElementById(this.parentElement.id + '_ValueDialog'));\n }\n };\n /**\n * To destroy the pivot button event listener\n * @return {void}\n * @hidden\n */\n AggregateMenu.prototype.destroy = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n if (this.menuInfo && !this.menuInfo.isDestroyed) {\n this.menuInfo.destroy();\n }\n else {\n return;\n }\n };\n return AggregateMenu;\n}());\nexport { AggregateMenu };\n","import { Reorder, headerRefreshed } from '@syncfusion/ej2-grids';\nimport { Grid, Resize, ExcelExport, PdfExport, ContextMenu, Freeze } from '@syncfusion/ej2-grids';\nimport { Selection } from '@syncfusion/ej2-grids';\nimport { createElement, setStyleAttribute, remove, isNullOrUndefined, EventHandler, append } from '@syncfusion/ej2-base';\nimport * as cls from '../../common/base/css-constant';\nimport * as events from '../../common/base/constant';\nimport { AggregateMenu } from '../../common/popups/aggregate-menu';\n/**\n * Module to render PivotGrid control\n */\n/** @hidden */\nvar Render = /** @class */ (function () {\n /** Constructor for render module */\n function Render(parent) {\n this.colPos = 0;\n this.lastSpan = 0;\n this.parent = parent;\n this.resColWidth = (this.parent.showGroupingBar && this.parent.groupingBarModule) ? (this.parent.isAdaptive ? 180 : 249) :\n (this.parent.isAdaptive ? 140 : 200);\n this.engine = parent.engineModule;\n this.gridSettings = parent.gridSettings;\n this.formatList = this.getFormatList();\n this.aggMenu = new AggregateMenu(this.parent);\n }\n /** @hidden */\n /* tslint:disable */\n Render.prototype.render = function () {\n this.parent.gridHeaderCellInfo = [];\n var parent = this.parent;\n var engine = this.parent.engineModule;\n this.injectGridModules(parent);\n this.rowStartPos = this.getRowStartPos();\n if (this.parent.grid && this.parent.grid.element && this.parent.element.querySelector('.e-grid')) {\n if (!engine.isEngineUpdated) {\n engine.headerContent = this.frameDataSource('header');\n engine.valueContent = this.frameDataSource('value');\n }\n else {\n if (this.parent.enableValueSorting) {\n engine.valueContent = this.frameDataSource('value');\n }\n engine.isEngineUpdated = false;\n }\n /* tslint:disable */\n this.parent.grid.setProperties({\n columns: this.frameStackedHeaders(), dataSource: parent.dataSource.values.length > 0 && !this.engine.isEmptyData ? engine.valueContent :\n this.frameDataSource('value')\n }, true);\n /* tslint:enable */\n this.parent.grid.notify('datasource-modified', {});\n this.parent.grid.refreshColumns();\n var e = this.parent.element.querySelector('.e-movablecontent');\n e.querySelector('colGroup').innerHTML =\n this.parent.grid.getHeaderContent().querySelector('.e-movableheader').querySelector('colgroup').innerHTML;\n this.parent.grid.width = this.calculateGridWidth();\n if (this.parent.height > (this.engine.valueContent.length * this.gridSettings.rowHeight)) {\n this.parent.grid.height = 'auto';\n }\n else {\n this.parent.grid.height = this.parent.height;\n }\n }\n else {\n this.parent.element.innerHTML = '';\n this.bindGrid(this.parent, (this.engine.isEmptyData ? true : false));\n this.parent.element.appendChild(createElement('div', { id: this.parent.element.id + '_grid' }));\n this.parent.grid.appendTo('#' + this.parent.element.id + '_grid');\n }\n /* tslint:disable */\n this.parent.grid.on(headerRefreshed, this.refreshHeader, this);\n };\n Render.prototype.refreshHeader = function () {\n if (this.parent.enableVirtualization) {\n var mHdr = this.parent.element.querySelector('.' + cls.MOVABLEHEADER_DIV);\n var mCont = this.parent.element.querySelector('.' + cls.MOVABLECONTENT_DIV);\n var vtr = mCont.querySelector('.' + cls.VIRTUALTRACK_DIV);\n this.parent.virtualHeaderDiv = mHdr.querySelector('.' + cls.VIRTUALTRACK_DIV);\n if (mHdr.querySelector('.' + cls.VIRTUALTRACK_DIV)) {\n remove(mHdr.querySelector('.' + cls.VIRTUALTRACK_DIV));\n }\n else {\n this.parent.virtualHeaderDiv = createElement('div', { className: cls.VIRTUALTRACK_DIV });\n }\n mHdr.appendChild(this.parent.virtualHeaderDiv);\n if (vtr) {\n setStyleAttribute(this.parent.virtualHeaderDiv, { height: 0, width: vtr.style.width });\n }\n setStyleAttribute(mHdr.querySelector('.e-table'), {\n transform: (mCont.querySelector('.e-table').style.transform).split(',')[0] + ',' + 0 + 'px)'\n });\n mHdr.scrollLeft = mCont.scrollLeft;\n }\n };\n /** @hidden */\n Render.prototype.bindGrid = function (parent, isEmpty) {\n this.injectGridModules(parent);\n this.parent.grid = new Grid({\n frozenColumns: 1,\n frozenRows: 0,\n dataSource: isEmpty ? this.frameEmptyData() : this.frameDataSource('value'),\n columns: isEmpty ? this.frameEmptyColumns() : this.frameStackedHeaders(),\n height: ((this.engine && (parent.height > (this.engine.valueContent.length * this.gridSettings.rowHeight)))\n || isEmpty) ? 'auto' : parent.height,\n width: isEmpty ? this.parent.width : this.calculateGridWidth(),\n locale: parent.locale,\n enableRtl: parent.enableRtl,\n allowExcelExport: parent.allowExcelExport,\n allowPdfExport: parent.allowPdfExport,\n allowResizing: this.gridSettings.allowResizing,\n allowTextWrap: this.gridSettings.allowTextWrap,\n allowReordering: this.gridSettings.allowReordering,\n allowSelection: this.gridSettings.allowSelection,\n contextMenuItems: this.gridSettings.contextMenuItems,\n selectedRowIndex: this.gridSettings.selectedRowIndex,\n selectionSettings: this.gridSettings.selectionSettings,\n printMode: this.gridSettings.printMode,\n rowHeight: this.gridSettings.rowHeight,\n gridLines: this.gridSettings.gridLines,\n contextMenuClick: this.contextMenuClick.bind(this),\n contextMenuOpen: this.contextMenuOpen.bind(this),\n beforeCopy: this.gridSettings.beforeCopy ? this.gridSettings.beforeCopy.bind(this.parent) : undefined,\n beforePrint: this.gridSettings.beforePrint ? this.gridSettings.beforePrint.bind(this.parent) : undefined,\n printComplete: this.gridSettings.printComplete ? this.gridSettings.printComplete.bind(this.parent) : undefined,\n rowSelecting: this.gridSettings.rowSelecting ? this.gridSettings.rowSelecting.bind(this.parent) : undefined,\n rowSelected: this.rowSelected.bind(this),\n rowDeselecting: this.gridSettings.rowDeselecting ? this.gridSettings.rowDeselecting.bind(this.parent) : undefined,\n rowDeselected: this.rowDeselected.bind(this),\n cellSelecting: this.gridSettings.cellSelecting ? this.gridSettings.cellSelecting.bind(this.parent) : undefined,\n cellSelected: this.cellSelected.bind(this),\n cellDeselecting: this.gridSettings.cellDeselecting ? this.gridSettings.cellDeselecting.bind(this.parent) : undefined,\n cellDeselected: this.cellDeselected.bind(this),\n resizeStart: this.gridSettings.resizeStart ? this.gridSettings.resizeStart.bind(this.parent) : undefined,\n columnDragStart: this.gridSettings.columnDragStart ? this.gridSettings.columnDragStart.bind(this) : undefined,\n columnDrag: this.gridSettings.columnDrag ? this.gridSettings.columnDrag.bind(this) : undefined,\n columnDrop: this.gridSettings.columnDrop ? this.gridSettings.columnDrop.bind(this) : undefined,\n resizing: this.setGroupWidth.bind(this),\n resizeStop: this.onResizeStop.bind(this),\n queryCellInfo: this.queryCellInfo.bind(this),\n dataBound: this.dataBound.bind(this),\n headerCellInfo: this.headerCellInfo.bind(this),\n excelHeaderQueryCellInfo: this.excelHeaderQueryCellInfo.bind(this),\n pdfHeaderQueryCellInfo: this.pdfHeaderQueryCellInfo.bind(this),\n excelQueryCellInfo: this.excelQueryCellInfo.bind(this),\n pdfQueryCellInfo: this.pdfQueryCellInfo.bind(this)\n });\n };\n Render.prototype.rowSelected = function (args) {\n this.parent.renderModule.selected();\n this.parent.trigger(events.rowSelected, args);\n };\n Render.prototype.rowDeselected = function (args) {\n this.parent.renderModule.selected();\n this.parent.trigger(events.rowDeselected, args);\n };\n Render.prototype.cellSelected = function (args) {\n if (this.parent.rowRangeSelection.enable) {\n this.parent.grid.selectionModule.selectRowsByRange(this.parent.rowRangeSelection.startIndex, this.parent.rowRangeSelection.endIndex);\n this.parent.rowRangeSelection.enable = false;\n }\n else {\n this.parent.renderModule.selected();\n this.parent.trigger(events.selected, args);\n }\n };\n Render.prototype.cellDeselected = function (args) {\n this.parent.renderModule.selected();\n this.parent.trigger(events.cellDeselected, args);\n };\n Render.prototype.queryCellInfo = function (args) {\n this.parent.renderModule.rowCellBoundEvent(args);\n };\n Render.prototype.headerCellInfo = function (args) {\n this.parent.renderModule.columnCellBoundEvent(args);\n };\n Render.prototype.excelHeaderQueryCellInfo = function (args) {\n this.parent.renderModule.excelColumnEvent(args);\n };\n Render.prototype.pdfQueryCellInfo = function (args) {\n this.parent.renderModule.pdfRowEvent(args);\n };\n Render.prototype.excelQueryCellInfo = function (args) {\n this.parent.renderModule.excelRowEvent(args);\n };\n Render.prototype.pdfHeaderQueryCellInfo = function (args) {\n this.parent.renderModule.pdfColumnEvent(args);\n };\n Render.prototype.dataBound = function (args) {\n if (this.parent.cellTemplate) {\n for (var _i = 0, _a = this.parent.gridHeaderCellInfo; _i < _a.length; _i++) {\n var cell = _a[_i];\n if (this.parent.cellTemplate) {\n append([].slice.call(this.parent.getCellTemplate()(cell, this.parent, 'cellTemplate')), cell.targetCell);\n }\n }\n this.parent.gridHeaderCellInfo = [];\n }\n if (this.parent.element.querySelector('.e-firstcell')) {\n if (this.parent.enableRtl) {\n this.parent.element.querySelector('.e-firstcell').style.borderRight = 'none';\n }\n else {\n this.parent.element.querySelector('.e-firstcell').style.borderLeft = 'none';\n }\n }\n this.parent.grid.widthService.setWidthToTable();\n this.parent.notify(events.contentReady, {});\n };\n Render.prototype.contextMenuOpen = function (args) {\n for (var _i = 0, _a = args.items; _i < _a.length; _i++) {\n var item = _a[_i];\n var cellTarget = this.parent.lastCellClicked;\n var elem = null;\n var bool = void 0;\n if (cellTarget.classList.contains('e-stackedheadercelldiv') || cellTarget.classList.contains('e-cellvalue') ||\n cellTarget.classList.contains('e-headercelldiv') || cellTarget.classList.contains('e-icons') || cellTarget.classList.contains('e-rhandler')) {\n elem = cellTarget.parentElement;\n }\n else if (cellTarget.classList.contains('e-headercell') || cellTarget.classList.contains('e-rowcell') || cellTarget.classList.contains('e-columnsheader') ||\n cellTarget.classList.contains('e-rowsheader') || cellTarget.classList.contains('e-valuescontent') || cellTarget.classList.contains('e-valuesheader')) {\n elem = cellTarget;\n }\n else if (cellTarget.classList.contains('e-headertext')) {\n elem = cellTarget.parentElement.parentElement;\n }\n if (elem.classList.contains('e-valuesheader') || elem.classList.contains('e-stot')) {\n bool = true;\n }\n var rowIndex = Number(elem.getAttribute('index'));\n var colIndex = Number(elem.getAttribute('aria-colindex'));\n var pivotValue1 = this.parent.pivotValues[rowIndex][colIndex];\n var select = item.id;\n switch (select) {\n case 'expand':\n if (elem.querySelectorAll('.' + cls.EXPAND).length > 0) {\n if (args.element.querySelectorAll(cls.CONTEXT_COLLAPSE_ID)) {\n args.element.querySelector(cls.CONTEXT_COLLAPSE_ID).classList.add(cls.MENU_DISABLE);\n }\n if (args.element.querySelector(cls.CONTEXT_EXPAND_ID).classList.contains(cls.MENU_DISABLE)) {\n args.element.querySelector(cls.CONTEXT_EXPAND_ID).classList.remove(cls.MENU_DISABLE);\n }\n if (args.element.querySelector(cls.CONTEXT_EXPAND_ID).classList.contains(cls.MENU_HIDE)) {\n args.element.querySelector(cls.CONTEXT_EXPAND_ID).classList.remove(cls.MENU_HIDE);\n args.element.querySelector(cls.CONTEXT_COLLAPSE_ID).classList.remove(cls.MENU_HIDE);\n }\n }\n else {\n if (bool) {\n args.element.querySelector(cls.CONTEXT_EXPAND_ID).classList.add(cls.MENU_HIDE);\n }\n else {\n args.element.querySelector(cls.CONTEXT_EXPAND_ID).classList.add(cls.MENU_DISABLE);\n }\n }\n break;\n case 'collapse':\n if (elem.querySelectorAll('.' + cls.COLLAPSE).length > 0) {\n if (args.element.querySelector(cls.CONTEXT_EXPAND_ID)) {\n args.element.querySelector(cls.CONTEXT_EXPAND_ID).classList.add(cls.MENU_DISABLE);\n }\n if (args.element.querySelector(cls.CONTEXT_COLLAPSE_ID).classList.contains(cls.MENU_DISABLE)) {\n args.element.querySelector(cls.CONTEXT_COLLAPSE_ID).classList.remove(cls.MENU_DISABLE);\n }\n if (args.element.querySelector(cls.CONTEXT_COLLAPSE_ID).classList.contains(cls.MENU_HIDE)) {\n args.element.querySelector(cls.CONTEXT_COLLAPSE_ID).classList.remove(cls.MENU_HIDE);\n args.element.querySelector(cls.CONTEXT_EXPAND_ID).classList.remove(cls.MENU_HIDE);\n }\n }\n else {\n if (bool) {\n args.element.querySelector(cls.CONTEXT_COLLAPSE_ID).classList.add(cls.MENU_HIDE);\n }\n else {\n args.element.querySelector(cls.CONTEXT_COLLAPSE_ID).classList.add(cls.MENU_DISABLE);\n }\n }\n break;\n case 'drillthrough':\n if (!this.parent.allowDrillThrough) {\n if (args.element.querySelector(cls.CONTEXT_DRILLTHROUGH_ID)) {\n args.element.querySelector(cls.CONTEXT_DRILLTHROUGH_ID).classList.add(cls.MENU_DISABLE);\n }\n }\n else if (!(elem.classList.contains('e-summary'))) {\n if (elem.innerText === \"\") {\n if (args.element.querySelector(cls.CONTEXT_DRILLTHROUGH_ID)) {\n args.element.querySelector(cls.CONTEXT_DRILLTHROUGH_ID).classList.add(cls.MENU_DISABLE);\n }\n }\n }\n else {\n if (args.element.querySelector(cls.CONTEXT_DRILLTHROUGH_ID).classList.contains(cls.MENU_DISABLE)) {\n args.element.querySelector(cls.CONTEXT_DRILLTHROUGH_ID).classList.remove(cls.MENU_DISABLE);\n }\n }\n break;\n case 'sortasc':\n if (!this.parent.enableValueSorting) {\n if (args.element.querySelector(cls.CONTEXT_SORT_ASC_ID)) {\n args.element.querySelector(cls.CONTEXT_SORT_ASC_ID).classList.add(cls.MENU_DISABLE);\n }\n }\n else if (elem.querySelectorAll('.e-icon-descending').length > 0) {\n if (args.element.querySelector(cls.CONTEXT_SORT_DESC_ID)) {\n args.element.querySelector(cls.CONTEXT_SORT_DESC_ID).classList.add(cls.MENU_DISABLE);\n }\n else {\n args.element.querySelector(cls.CONTEXT_SORT_DESC_ID).classList.remove(cls.MENU_DISABLE);\n }\n if (args.element.querySelector(cls.CONTEXT_SORT_ASC_ID).classList.contains(cls.MENU_DISABLE)) {\n args.element.querySelector(cls.CONTEXT_SORT_ASC_ID).classList.remove(cls.MENU_DISABLE);\n }\n }\n else if (args.element.querySelector(cls.CONTEXT_SORT_DESC_ID).classList.contains(cls.MENU_DISABLE)) {\n args.element.querySelector(cls.CONTEXT_SORT_DESC_ID).classList.remove(cls.MENU_DISABLE);\n }\n break;\n case 'sortdesc':\n if (!this.parent.enableValueSorting) {\n if (args.element.querySelector(cls.CONTEXT_SORT_DESC_ID)) {\n args.element.querySelector(cls.CONTEXT_SORT_DESC_ID).classList.add(cls.MENU_DISABLE);\n }\n }\n else if (elem.querySelectorAll('.e-icon-ascending').length > 0) {\n if (args.element.querySelector(cls.CONTEXT_SORT_ASC_ID)) {\n args.element.querySelector(cls.CONTEXT_SORT_ASC_ID).classList.add(cls.MENU_DISABLE);\n }\n else {\n args.element.querySelector(cls.CONTEXT_SORT_ASC_ID).classList.remove(cls.MENU_DISABLE);\n }\n if (args.element.querySelector(cls.CONTEXT_SORT_DESC_ID).classList.contains(cls.MENU_DISABLE)) {\n args.element.querySelector(cls.CONTEXT_SORT_DESC_ID).classList.remove(cls.MENU_DISABLE);\n }\n }\n else if (args.element.querySelector(cls.CONTEXT_SORT_ASC_ID).classList.contains(cls.MENU_DISABLE)) {\n args.element.querySelector(cls.CONTEXT_SORT_ASC_ID).classList.remove(cls.MENU_DISABLE);\n }\n break;\n case 'CalculatedField':\n if (!this.parent.allowCalculatedField) {\n args.element.querySelector(cls.CONTEXT_CALC_ID).classList.add(cls.MENU_DISABLE);\n }\n break;\n case 'pdf':\n if (!this.parent.allowPdfExport) {\n args.element.querySelector(cls.CONTEXT_PDF_ID).classList.add(cls.MENU_DISABLE);\n }\n break;\n case 'excel':\n if (!this.parent.allowExcelExport) {\n args.element.querySelector(cls.CONTEXT_EXCEL_ID).classList.add(cls.MENU_DISABLE);\n }\n break;\n case 'csv':\n if (!this.parent.allowExcelExport) {\n args.element.querySelector(cls.CONTEXT_CSV_ID).classList.add(cls.MENU_DISABLE);\n }\n break;\n case 'exporting':\n if ((!this.parent.allowExcelExport) && (!this.parent.allowPdfExport)) {\n args.element.querySelector(cls.CONTEXT_EXPORT_ID).classList.add(cls.MENU_DISABLE);\n }\n break;\n case 'aggregate':\n if (elem.innerText === \"\") {\n if (args.element.querySelector(cls.CONTEXT_AGGREGATE_ID)) {\n args.element.querySelector(cls.CONTEXT_AGGREGATE_ID).classList.add(cls.MENU_DISABLE);\n }\n }\n else {\n if (args.element.querySelector(cls.CONTEXT_AGGREGATE_ID).classList.contains(cls.MENU_DISABLE)) {\n args.element.querySelector(cls.CONTEXT_AGGREGATE_ID).classList.remove(cls.MENU_DISABLE);\n }\n }\n break;\n }\n }\n this.parent.trigger(events.contextMenuOpen, args);\n };\n Render.prototype.contextMenuClick = function (args) {\n // this.parent.gridSettings.contextMenuClick();\n var target = this.parent.lastCellClicked;\n var selected = args.item.id;\n var event = new MouseEvent('dblclick', {\n 'view': window,\n 'bubbles': true,\n 'cancelable': true\n });\n var ele = null;\n if (target.classList.contains('e-stackedheadercelldiv') || target.classList.contains('e-cellvalue') ||\n target.classList.contains('e-headercelldiv') || target.classList.contains('e-icons') || target.classList.contains('e-rhandler')) {\n ele = target.parentElement;\n }\n else if (target.classList.contains('e-headercell') || target.classList.contains('e-rowcell')) {\n ele = target;\n }\n else if (target.classList.contains('e-headertext')) {\n ele = target.parentElement.parentElement;\n }\n var rowIndx = Number(ele.getAttribute('index'));\n var colIndx = Number(ele.getAttribute('aria-colindex'));\n var pivotValue = this.parent.pivotValues[rowIndx][colIndx];\n if (args.item.id === 'AggSum' || args.item.id === 'AggProduct' || args.item.id === 'AggCount' ||\n args.item.id === 'AggDistinctCount' || args.item.id === 'AggAvg' || args.item.id === 'AggMin' ||\n args.item.id === 'AggMax' || args.item.id === 'AggMoreOption') {\n this.field = this.parent.engineModule.fieldList[pivotValue.actualText.toString()].caption;\n }\n switch (selected) {\n case 'pdf':\n this.parent.pdfExport();\n break;\n case 'excel':\n this.parent.excelExport();\n break;\n case 'csv':\n this.parent.csvExport();\n break;\n case 'drillthrough':\n ele.dispatchEvent(event);\n break;\n case 'sortasc':\n this.parent.setProperties({\n dataSource: {\n valueSortSettings: {\n headerText: pivotValue.valueSort.levelName,\n headerDelimiter: this.parent.dataSource.valueSortSettings.headerDelimiter\n }\n }\n });\n this.parent.dataSource.valueSortSettings.sortOrder = 'Ascending';\n break;\n case 'sortdesc':\n this.parent.setProperties({\n dataSource: {\n valueSortSettings: {\n headerText: pivotValue.valueSort.levelName,\n headerDelimiter: this.parent.dataSource.valueSortSettings.headerDelimiter\n }\n }\n });\n this.parent.dataSource.valueSortSettings.sortOrder = 'Descending';\n break;\n case 'expand':\n if (ele.querySelectorAll('.' + cls.EXPAND)) {\n var exp = ele.querySelectorAll('.' + cls.EXPAND)[0];\n this.parent.onDrill(exp);\n }\n break;\n case 'collapse':\n if (ele.querySelectorAll('.' + cls.COLLAPSE)) {\n var colp = ele.querySelectorAll('.' + cls.COLLAPSE)[0];\n this.parent.onDrill(colp);\n }\n break;\n case 'CalculatedField':\n this.parent.calculatedFieldModule.createCalculatedFieldDialog();\n break;\n case 'AggSum':\n this.updateAggregate('Sum');\n break;\n case 'AggProduct':\n this.updateAggregate('Product');\n break;\n case 'AggCount':\n this.updateAggregate('Count');\n break;\n case 'AggDistinctCount':\n this.updateAggregate('DistinctCount');\n break;\n case 'AggAvg':\n this.updateAggregate('Avg');\n break;\n case 'AggMin':\n this.updateAggregate('Min');\n break;\n case 'AggMax':\n this.updateAggregate('Max');\n break;\n case 'AggMoreOption':\n ele.setAttribute('id', this.field);\n ele.setAttribute('data-caption', this.field);\n ele.setAttribute('data-field', this.field);\n ele.setAttribute('data-type', this.parent.engineModule.fieldList[pivotValue.actualText.toString()].aggregateType);\n ele.setAttribute('data-basefield', this.parent.engineModule.fieldList[pivotValue.actualText.toString()].baseField);\n ele.setAttribute('data-baseItem', this.parent.engineModule.fieldList[pivotValue.actualText.toString()].baseItem);\n this.aggMenu.createValueSettingsDialog(ele, this.parent.element);\n break;\n }\n this.parent.trigger(events.contextMenuClick, args);\n };\n Render.prototype.updateAggregate = function (aggregate) {\n var valuefields = this.parent.dataSource.values;\n for (var valueCnt = 0; valueCnt < this.parent.dataSource.values.length; valueCnt++) {\n if (this.parent.dataSource.values[valueCnt].name === this.field) {\n var dataSourceItem = valuefields[valueCnt];\n dataSourceItem.type = aggregate;\n }\n }\n };\n Render.prototype.injectGridModules = function (parent) {\n Grid.Inject(Freeze);\n if (parent.allowExcelExport) {\n Grid.Inject(ExcelExport);\n }\n if (parent.allowPdfExport) {\n Grid.Inject(PdfExport);\n }\n if (this.gridSettings.allowSelection) {\n Grid.Inject(Selection);\n }\n if (this.gridSettings.allowReordering) {\n Grid.Inject(Reorder);\n }\n if (this.gridSettings.allowResizing) {\n Grid.Inject(Resize);\n }\n if (this.gridSettings.contextMenuItems) {\n Grid.Inject(ContextMenu);\n }\n };\n /** @hidden */\n Render.prototype.updateGridSettings = function () {\n this.injectGridModules(this.parent);\n this.parent.grid.allowResizing = this.gridSettings.allowResizing;\n this.parent.grid.allowTextWrap = this.gridSettings.allowTextWrap;\n this.parent.grid.allowReordering = this.gridSettings.allowReordering;\n this.parent.grid.allowSelection = this.gridSettings.allowSelection;\n this.parent.grid.contextMenuItems = this.gridSettings.contextMenuItems;\n this.parent.grid.selectedRowIndex = this.gridSettings.selectedRowIndex;\n this.parent.grid.selectionSettings = this.gridSettings.selectionSettings;\n this.parent.grid.printMode = this.gridSettings.printMode;\n this.parent.grid.rowHeight = this.gridSettings.rowHeight;\n this.parent.grid.gridLines = this.gridSettings.gridLines;\n this.clearColumnSelection();\n };\n Render.prototype.clearColumnSelection = function () {\n this.parent.element.querySelectorAll('.' + cls.CELL_ACTIVE_BGCOLOR).forEach(function (ele) {\n ele.classList.remove(cls.CELL_ACTIVE_BGCOLOR);\n ele.classList.remove(cls.SELECTED_BGCOLOR);\n });\n };\n Render.prototype.appendValueSortIcon = function (cell, tCell, rCnt, cCnt) {\n var vSort = this.parent.dataSource.valueSortSettings;\n var len = (cell.type === 'grand sum' && this.parent.dataSource.values.length === 1 && !this.parent.dataSource.alwaysShowValueHeader) ? 0 :\n (this.parent.dataSource.values.length > 1 || this.parent.dataSource.alwaysShowValueHeader) ? (this.parent.engineModule.headerContent.length - 1) :\n this.parent.dataSource.columns.length === 0 ? 0 : (this.parent.engineModule.headerContent.length - 1);\n var lock = (vSort && vSort.headerText) ? cell.valueSort.levelName === vSort.headerText : cCnt === vSort.columnIndex;\n if (vSort !== undefined && lock && rCnt === len && this.parent.dataSource.valueAxis === 'column') {\n if (tCell.querySelector('.e-sortfilterdiv')) {\n tCell.querySelector('.e-sortfilterdiv').classList.add(vSort.sortOrder === 'Descending' ? 'e-descending' : 'e-ascending');\n tCell.querySelector('.e-sortfilterdiv').classList.add(vSort.sortOrder === 'Descending' ?\n 'e-icon-descending' : 'e-icon-ascending');\n }\n else {\n tCell.appendChild(createElement('div', {\n className: (vSort.sortOrder === 'Descending' ?\n 'e-icon-descending e-icons e-descending e-sortfilterdiv' : 'e-icon-ascending e-icons e-ascending e-sortfilterdiv'),\n }));\n }\n if (!isNullOrUndefined(cell.hasChild) && cell.type !== 'grand sum' && tCell.querySelector('.e-expand') &&\n (tCell.querySelector('.e-icon-descending') || tCell.querySelector('.e-icon-ascending'))) {\n var element = (tCell.querySelector('.e-icon-descending') || tCell.querySelector('.e-icon-ascending'));\n setStyleAttribute(element, { 'padding-top': '12px' });\n }\n }\n return tCell;\n };\n Render.prototype.onResizeStop = function (args) {\n var column = args.column.field === '0.formattedText' ? '0.formattedText' :\n args.column.customAttributes.cell.valueSort.levelName;\n this.parent.resizeInfo[column] =\n Number(args.column.width.toString().split('px')[0]);\n this.setGroupWidth(args);\n };\n Render.prototype.setGroupWidth = function (args) {\n if (this.parent.showGroupingBar && this.parent.groupingBarModule && this.parent.element.querySelector('.' + cls.GROUPING_BAR_CLASS)) {\n this.parent.groupingBarModule.refreshUI();\n if (this.parent.element.querySelector('.e-group-row').offsetWidth < 245 && !this.parent.firstColWidth) {\n args.cancel = true;\n var gridColumn = this.parent.grid.columns;\n if (gridColumn && gridColumn.length > 0) {\n gridColumn[0].width = this.resColWidth;\n }\n this.parent.element.querySelector('.e-frozenheader').querySelector('col').style.width = (this.resColWidth + 'px');\n this.parent.element.querySelector('.e-frozencontent').querySelector('col').style.width = (this.resColWidth + 'px');\n }\n this.parent.element.querySelector('.e-group-values').style.width =\n this.parent.element.querySelector('.e-group-row').offsetWidth + 'px';\n this.parent.element.querySelector('.e-group-row').style.height =\n this.parent.element.querySelector('.e-headercontent').offsetHeight + 'px';\n }\n this.parent.trigger(args.e.type === 'touchend' || args.e.type === 'mouseup' ? events.resizeStop : events.resizing, args);\n };\n /* tslint:disable */\n /** @hidden */\n Render.prototype.selected = function () {\n clearTimeout(this.timeOutObj);\n this.timeOutObj = setTimeout(this.onSelect.bind(this), 300);\n };\n Render.prototype.onSelect = function () {\n var pivotArgs = { selectedCellsInfo: [], pivotValues: this.parent.pivotValues };\n var selectedElements = this.parent.element.querySelectorAll('.' + cls.CELL_SELECTED_BGCOLOR + ',.' + cls.SELECTED_BGCOLOR);\n for (var _i = 0, selectedElements_1 = selectedElements; _i < selectedElements_1.length; _i++) {\n var element = selectedElements_1[_i];\n var colIndex = Number(element.getAttribute('aria-colindex'));\n var rowIndex = Number(element.getAttribute('index'));\n var cell = this.engine.pivotValues[rowIndex][colIndex];\n if (cell) {\n if (cell.axis === 'value') {\n pivotArgs.selectedCellsInfo.push({\n currentCell: cell,\n value: cell.value,\n columnHeaders: cell.columnHeaders,\n rowHeaders: cell.rowHeaders,\n measure: cell.actualText.toString()\n });\n }\n else if (cell.axis === 'column') {\n pivotArgs.selectedCellsInfo.push({\n currentCell: cell,\n value: cell.formattedText,\n columnHeaders: cell.valueSort.levelName,\n rowHeaders: '',\n measure: ''\n });\n }\n else {\n pivotArgs.selectedCellsInfo.push({\n currentCell: cell,\n value: cell.formattedText,\n columnHeaders: '',\n rowHeaders: cell.valueSort.levelName,\n measure: ''\n });\n }\n }\n }\n this.parent.trigger(events.cellSelected, pivotArgs);\n };\n Render.prototype.rowCellBoundEvent = function (args) {\n var tCell = args.cell;\n if (tCell && !this.parent.isEmptyGrid) {\n var customClass = this.parent.hyperlinkSettings.cssClass;\n tCell.setAttribute('index', (Number(tCell.getAttribute('index')) + this.engine.headerContent.length).toString());\n var cell = args.data[0];\n if (tCell.getAttribute('aria-colindex') === '0') {\n var isValueCell = cell.type && cell.type === 'value';\n tCell.innerText = '';\n var level = cell.level ? cell.level : (isValueCell ? (this.lastSpan + 1) : 0);\n do {\n if (level > 0) {\n tCell.appendChild(createElement('span', {\n className: level === 0 ? '' : cls.NEXTSPAN,\n }));\n }\n level--;\n } while (level > -1);\n level = cell.level ? cell.level : 0;\n this.lastSpan = !isValueCell ? level : this.lastSpan;\n if (!cell.hasChild && level > 0) {\n tCell.appendChild(createElement('span', {\n className: cls.LASTSPAN,\n }));\n }\n var fieldName = void 0;\n if ((this.parent.dataSource.rows.length > 0 &&\n (cell.valueSort ? Object.keys(cell.valueSort).length > 0 : true))) {\n fieldName = level > -1 ? this.parent.dataSource.rows[level].name : '';\n tCell.setAttribute('fieldname', fieldName);\n }\n var localizedText = cell.formattedText;\n if (cell.type) {\n if (cell.type === 'grand sum') {\n tCell.classList.add('e-gtot');\n localizedText = this.parent.localeObj.getConstant('grandTotal');\n }\n else {\n tCell.classList.add('e-stot');\n }\n }\n tCell.classList.add(cls.ROWSHEADER);\n if (cell.hasChild === true) {\n tCell.appendChild(createElement('div', {\n className: (cell.isDrilled === true ? cls.COLLAPSE : cls.EXPAND) + ' ' + cls.ICON,\n attrs: {\n 'title': cell.isDrilled === true ? this.parent.localeObj.getConstant('collapse') :\n this.parent.localeObj.getConstant('expand')\n }\n }));\n }\n tCell.appendChild(createElement('span', {\n className: cls.CELLVALUE,\n innerHTML: (this.parent.isRowCellHyperlink || cell.enableHyperlink ? '' + localizedText + '' : localizedText)\n }));\n var vSort = this.parent.pivotView.dataSource.valueSortSettings;\n if (vSort && vSort.headerText && this.parent.dataSource.valueAxis === 'row'\n && this.parent.pivotValues[Number(tCell.getAttribute('index'))][0].valueSort.levelName) {\n if (this.parent.pivotValues[Number(tCell.getAttribute('index'))][0].valueSort.levelName\n === vSort.headerText) {\n var style = (tCell.querySelector('.e-expand') || tCell.querySelector('.e-collapse')) ? 'padding-top: 18px' :\n 'padding-top: 12px';\n tCell.appendChild(createElement('div', {\n className: (vSort.sortOrder === 'Descending' ?\n 'e-icon-descending e-icons e-descending e-sortfilterdiv' : 'e-icon-ascending e-icons e-ascending e-sortfilterdiv'),\n styles: style\n }));\n }\n }\n }\n else {\n var innerText = tCell.innerText;\n tCell.innerText = '';\n tCell.classList.add(cls.VALUESCONTENT);\n cell = args.data[Number(tCell.getAttribute('aria-colindex'))];\n if (cell.isSum) {\n tCell.classList.add(cls.SUMMARY);\n }\n if (cell.cssClass) {\n tCell.classList.add(cell.cssClass);\n }\n tCell.appendChild(createElement('span', {\n className: cls.CELLVALUE,\n innerHTML: ((tCell.className.indexOf('e-summary') !== -1 && this.parent.isSummaryCellHyperlink) ||\n (tCell.className.indexOf('e-summary') === -1 && this.parent.isValueCellHyperlink) ||\n cell.enableHyperlink ? '' + innerText + '' : innerText)\n }));\n }\n if (this.parent.cellTemplate) {\n append([].slice.call(this.parent.getCellTemplate()({ targetCell: tCell }, this.parent, 'cellTemplate')), tCell);\n }\n this.unWireEvents(tCell);\n this.wireEvents(tCell);\n }\n this.parent.trigger(events.queryCellInfo, args);\n };\n Render.prototype.columnCellBoundEvent = function (args) {\n if (args.cell.column && args.cell.column.customAttributes) {\n var cell = args.cell.column.customAttributes.cell;\n var tCell = args.node;\n if (cell) {\n var customClass = this.parent.hyperlinkSettings.cssClass;\n var level = cell.level ? cell.level : 0;\n if ((cell.level === -1 && !cell.rowSpan && cell.rowIndex !== this.engine.headerContent.length - 1)\n || cell.rowSpan === -1) {\n args.node.style.display = 'none';\n }\n else if (cell.rowSpan > 1) {\n args.node.setAttribute('rowspan', cell.rowSpan.toString());\n args.node.setAttribute('aria-rowspan', cell.rowSpan.toString());\n if ((cell.rowIndex + cell.rowSpan) === this.engine.headerContent.length) {\n args.node.style.borderBottomWidth = '0px';\n }\n }\n args.node.setAttribute('aria-colindex', cell.colIndex.toString());\n args.node.setAttribute('index', cell.rowIndex.toString());\n var fieldName = void 0;\n if (!(this.parent.dataSource.values && this.parent.dataSource.valueAxis === 'column' && this.parent.dataSource.values.length > 1 &&\n (cell.rowIndex === this.engine.headerContent.length - 1)) && this.parent.dataSource.columns &&\n this.parent.dataSource.columns.length > 0) {\n fieldName = level > -1 ? this.parent.dataSource.columns[level].name : '';\n tCell.setAttribute('fieldname', fieldName);\n }\n if (cell.type) {\n tCell.classList.add(cell.type === 'grand sum' ? 'e-gtot' : 'e-stot');\n var localizedText = cell.type === 'grand sum' ? this.parent.localeObj.getConstant('grandTotal') :\n cell.formattedText.split('Total')[0] + this.parent.localeObj.getConstant('total');\n if (tCell.querySelector('.e-headertext') !== null) {\n tCell.querySelector('.e-headertext').innerText = localizedText;\n }\n else {\n tCell.querySelector('.e-stackedheadercelldiv').innerText = localizedText;\n }\n }\n tCell.classList.add(cls.COLUMNSHEADER);\n if (this.parent.isColumnCellHyperlink || cell.enableHyperlink) {\n if (tCell.querySelector('.e-stackedheadercelldiv')) {\n var innerText = tCell.querySelector('.e-stackedheadercelldiv').innerText;\n tCell.querySelector('.e-stackedheadercelldiv').innerHTML = '' + innerText + '';\n }\n else if (tCell.querySelector('.e-headertext')) {\n var innerText = tCell.querySelector('.e-headertext').innerText;\n tCell.querySelector('.e-headertext').innerHTML = '' + innerText + '';\n }\n }\n if (cell.hasChild === true) {\n var hdrdiv = tCell.querySelector('.e-headercelldiv');\n if (hdrdiv) {\n hdrdiv.style.height = 'auto';\n hdrdiv.style.lineHeight = 'normal';\n }\n var div = createElement('div', {\n className: (cell.isDrilled === true ? cls.COLLAPSE : cls.EXPAND) + ' ' + cls.ICON,\n attrs: {\n 'title': cell.isDrilled === true ? this.parent.localeObj.getConstant('collapse') :\n this.parent.localeObj.getConstant('expand')\n }\n });\n tCell.children[0].classList.add(cls.CELLVALUE);\n if (window.navigator.userAgent.indexOf('Edge') > -1 || window.navigator.userAgent.indexOf('Trident') > -1) {\n tCell.children[0].style.display = 'table';\n }\n else {\n tCell.children[0].style.display = 'block';\n }\n tCell.insertBefore(div, tCell.children[0]);\n }\n tCell = this.appendValueSortIcon(cell, tCell, cell.rowIndex, cell.colIndex);\n if (this.parent.cellTemplate) {\n try {\n if (this.parent.getCellTemplate()()) {\n this.parent.gridHeaderCellInfo = [];\n append([].slice.call(this.parent.getCellTemplate()({ targetCell: tCell }, this.parent, 'cellTemplate')), tCell);\n }\n }\n catch (error) {\n this.parent.gridHeaderCellInfo.push({ targetCell: tCell });\n }\n }\n var field = void 0;\n var len = this.parent.dataSource.values.length;\n for (var vCnt = 0; vCnt < len; vCnt++) {\n if (this.parent.dataSource.values[vCnt].name === cell.actualText) {\n tCell.classList.add(cls.VALUESHEADER);\n }\n }\n this.unWireEvents(tCell);\n this.wireEvents(tCell);\n }\n }\n this.parent.trigger(events.headerCellInfo, args);\n };\n Render.prototype.onHyperCellClick = function (e) {\n var cell = e.target.parentElement.parentElement;\n cell = (cell.className.indexOf('e-headercelldiv') > -1 ? cell.parentElement : cell);\n var args = {\n currentCell: cell,\n data: this.engine.pivotValues[Number(cell.getAttribute('index'))][Number(cell.getAttribute('aria-colindex'))],\n cancel: true\n };\n this.parent.trigger(events.hyperlinkCellClick, args);\n if (!args.cancel) {\n window.open(e.target.getAttribute('data-url'));\n }\n };\n Render.prototype.getRowStartPos = function () {\n var pivotValues = this.parent.pivotValues;\n var rowPos;\n for (var rCnt = 0; rCnt < pivotValues.length; rCnt++) {\n if (pivotValues[rCnt] && pivotValues[rCnt][0] && pivotValues[rCnt][0].axis === 'row') {\n rowPos = rCnt;\n break;\n }\n }\n return rowPos;\n };\n Render.prototype.frameDataSource = function (type) {\n var dataContent = [];\n if (this.parent.dataSource.values.length > 0 && !this.engine.isEmptyData) {\n if ((this.parent.enableValueSorting) || !this.engine.isEngineUpdated) {\n var rowCnt = 0;\n var pivotValues = this.parent.pivotValues;\n var start = type === 'value' ? this.rowStartPos : 0;\n var end = type === 'value' ? pivotValues.length : this.rowStartPos;\n for (var rCnt = start; rCnt < end; rCnt++) {\n if (pivotValues[rCnt]) {\n rowCnt = type === 'header' ? rCnt : rowCnt;\n dataContent[rowCnt] = {};\n for (var cCnt = 0; cCnt < pivotValues[rCnt].length; cCnt++) {\n if (pivotValues[rCnt][cCnt]) {\n dataContent[rowCnt][cCnt] = pivotValues[rCnt][cCnt];\n }\n }\n rowCnt++;\n }\n }\n }\n else {\n dataContent = type === 'value' ? this.engine.valueContent : this.engine.headerContent;\n }\n }\n else {\n dataContent = this.frameEmptyData();\n }\n return dataContent;\n };\n /** @hidden */\n Render.prototype.frameEmptyData = function () {\n var dataContent = [{\n 0: { formattedText: this.parent.localeObj.getConstant('grandTotal') },\n 1: { formattedText: this.parent.localeObj.getConstant('emptyData') }\n }];\n return dataContent;\n };\n Render.prototype.calculateColWidth = function (colCount) {\n var parWidth = isNaN(this.parent.width) ? (this.parent.width.toString().indexOf('%') > -1 ?\n ((parseFloat(this.parent.width.toString()) / 100) * this.parent.element.offsetWidth) : this.parent.element.offsetWidth) :\n Number(this.parent.width);\n parWidth = parWidth - (this.gridSettings.columnWidth > this.resColWidth ? this.gridSettings.columnWidth : this.resColWidth);\n colCount = colCount - 1;\n var colWidth = (colCount * this.gridSettings.columnWidth + 78) < parWidth ? (parWidth / colCount) : this.gridSettings.columnWidth;\n return colWidth;\n };\n Render.prototype.resizeColWidth = function (colCount) {\n var parWidth = isNaN(this.parent.width) ? (this.parent.width.toString().indexOf('%') > -1 ?\n ((parseFloat(this.parent.width.toString()) / 100) * this.parent.element.offsetWidth) : this.parent.element.offsetWidth) :\n Number(this.parent.width);\n var colWidth = (colCount * this.gridSettings.columnWidth + 78) < parWidth ? (parWidth / colCount) : this.gridSettings.columnWidth;\n return colWidth;\n };\n Render.prototype.calculateGridWidth = function () {\n var parWidth = this.parent.width;\n if (this.parent.width === 'auto' && this.parent.element.offsetWidth < this.parent.totColWidth) {\n parWidth = this.parent.element.offsetWidth;\n }\n return parWidth;\n };\n Render.prototype.frameStackedHeaders = function () {\n var integrateModel = [];\n if (this.parent.dataSource.values.length > 0 && !this.engine.isEmptyData) {\n var headerCnt = this.engine.headerContent.length;\n var headerSplit = [];\n var splitPos = [];\n var colWidth = this.calculateColWidth(this.engine.pivotValues[0].length);\n do {\n var columnModel = [];\n var actualCnt = 0;\n headerCnt--;\n var colField = this.engine.headerContent[headerCnt];\n if (colField) {\n for (var cCnt = 0; cCnt < Object.keys(colField).length + (colField[0] ? 0 : 1); cCnt++) {\n var colSpan = (colField[cCnt] && colField[cCnt].colSpan) ? colField[cCnt].colSpan : 1;\n var rowSpan = (colField[cCnt] && colField[cCnt].rowSpan) ? colField[cCnt].rowSpan : 1;\n var formattedText = colField[cCnt] ? (colField[cCnt].type === 'grand sum' ? this.parent.localeObj.getConstant('grandTotal') :\n (colField[cCnt].type === 'sum' ? colField[cCnt].formattedText.split('Total')[0] + this.parent.localeObj.getConstant('total') :\n colField[cCnt].formattedText)) : '';\n if (headerCnt === this.engine.headerContent.length - 1) {\n columnModel[actualCnt] = {\n field: (cCnt + '.formattedText'),\n headerText: formattedText,\n customAttributes: { 'cell': colField[cCnt] },\n width: colField[cCnt] ?\n this.setSavedWidth(colField[cCnt].valueSort.levelName, colWidth) : this.resColWidth,\n minWidth: 30,\n format: cCnt === 0 ? '' : this.formatList[(cCnt - 1) % this.parent.dataSource.values.length],\n allowReordering: this.parent.gridSettings.allowReordering,\n allowResizing: this.parent.gridSettings.allowResizing,\n visible: true\n };\n }\n else if (headerSplit[cCnt]) {\n var tmpSpan = colSpan;\n var innerModel = [];\n var innerPos = cCnt;\n while (tmpSpan > 0) {\n if (columnModel[actualCnt]) {\n if (!integrateModel[splitPos[innerPos]]) {\n break;\n }\n innerModel.push(integrateModel[splitPos[innerPos]]);\n }\n else {\n columnModel[actualCnt] = {\n headerText: formattedText,\n customAttributes: { 'cell': colField[cCnt] },\n width: colField[cCnt] ?\n this.setSavedWidth(colField[cCnt].valueSort.levelName, colWidth) : this.resColWidth,\n minWidth: 30,\n allowReordering: this.parent.gridSettings.allowReordering,\n allowResizing: this.parent.gridSettings.allowResizing,\n visible: true\n };\n innerModel = [integrateModel[splitPos[innerPos]]];\n }\n tmpSpan = tmpSpan - headerSplit[innerPos];\n innerPos = innerPos + headerSplit[innerPos];\n }\n columnModel[actualCnt].columns = innerModel;\n }\n if (columnModel[actualCnt]) {\n columnModel[actualCnt].clipMode = this.gridSettings.clipMode;\n }\n headerSplit[cCnt] = colSpan;\n splitPos[cCnt] = actualCnt;\n actualCnt++;\n cCnt = cCnt + colSpan - 1;\n }\n }\n integrateModel = columnModel.length > 0 ? columnModel : integrateModel;\n } while (headerCnt > 0);\n integrateModel[0] = {\n field: (0 + '.formattedText'),\n width: this.resColWidth,\n minWidth: 30,\n headerText: '',\n allowReordering: false,\n allowResizing: this.parent.gridSettings.allowResizing,\n visible: true\n };\n }\n else {\n integrateModel = this.frameEmptyColumns();\n }\n this.parent.triggerColumnRenderEvent(integrateModel);\n return integrateModel;\n };\n /** @hidden */\n Render.prototype.setSavedWidth = function (column, width) {\n width = this.parent.resizeInfo[column] ? this.parent.resizeInfo[column] : width;\n return width;\n };\n /** @hidden */\n Render.prototype.frameEmptyColumns = function () {\n var columns = [];\n var colWidth = this.calculateColWidth(2);\n columns.push({ field: '0.formattedText', headerText: '', minWidth: 30, width: this.resColWidth });\n columns.push({ field: '1.formattedText', headerText: this.parent.localeObj.getConstant('grandTotal'), minWidth: 30, width: colWidth });\n return columns;\n };\n /** @hidden */\n Render.prototype.getFormatList = function () {\n var formatArray = [];\n for (var vCnt = 0; vCnt < this.parent.dataSource.values.length; vCnt++) {\n var field = this.parent.dataSource.values[vCnt];\n if (this.parent.dataSource.formatSettings.length > 0) {\n var format = '';\n for (var fCnt = 0; fCnt < this.parent.dataSource.formatSettings.length; fCnt++) {\n var formatSettings = this.parent.dataSource.formatSettings[fCnt];\n if (field.name === formatSettings.name) {\n format = formatSettings.format;\n break;\n }\n else {\n continue;\n }\n }\n formatArray.push(format);\n }\n else {\n formatArray.push('N');\n }\n }\n return formatArray;\n };\n Render.prototype.excelColumnEvent = function (args) {\n args = this.exportHeaderEvent(args);\n this.parent.trigger(events.excelHeaderQueryCellInfo, args);\n };\n Render.prototype.pdfColumnEvent = function (args) {\n args = this.exportHeaderEvent(args);\n this.parent.trigger(events.pdfHeaderQueryCellInfo, args);\n };\n Render.prototype.excelRowEvent = function (args) {\n if (args.column.field === '0.formattedText') {\n var isValueCell = args.data[0].type === 'value';\n var level = isValueCell ? (this.lastSpan + 1) : args.data[0].level;\n this.colPos = 0;\n args.style = { hAlign: 'Left', indent: level * 2 };\n this.lastSpan = isValueCell ? this.lastSpan : level;\n }\n else {\n this.colPos++;\n args.value = args.data[this.colPos].value || args.data[this.colPos].formattedText;\n }\n args = this.exportContentEvent(args);\n this.parent.trigger(events.excelQueryCellInfo, args);\n };\n /* tslint:disable:no-any */\n Render.prototype.pdfRowEvent = function (args) {\n args = this.exportContentEvent(args);\n if (args.column.field === '0.formattedText') {\n var isValueCell = args.data[0].type === 'value';\n var level = isValueCell ? (this.lastSpan + 1) : args.data[0].level;\n args.style = { paragraphIndent: level * 10 };\n this.lastSpan = isValueCell ? this.lastSpan : level;\n }\n this.parent.trigger(events.pdfQueryCellInfo, args);\n };\n Render.prototype.exportHeaderEvent = function (args) {\n var rowSpan = 1;\n if (args.gridCell.column.customAttributes) {\n var cell = args.gridCell.column.customAttributes.cell;\n rowSpan = cell.rowSpan ? cell.rowSpan : 1;\n }\n else {\n rowSpan = Object.keys(this.engine.headerContent).length;\n }\n if (args.cell.rowSpan && args.cell.rowSpan !== rowSpan && rowSpan > -1) {\n args.cell.rowSpan = rowSpan;\n }\n return args;\n };\n Render.prototype.exportContentEvent = function (args) {\n args.value = args.data[Number(args.column.field.split('.formattedText')[0])].type === 'grand sum' ?\n this.parent.localeObj.getConstant('grandTotal') : args.value;\n return args;\n };\n Render.prototype.unWireEvents = function (cell) {\n if (cell.querySelector('.e-hyperlinkcell')) {\n EventHandler.remove(cell.querySelector('.e-hyperlinkcell'), this.parent.isAdaptive ? 'touchend' : 'click', this.onHyperCellClick);\n }\n else {\n return;\n }\n };\n Render.prototype.wireEvents = function (cell) {\n if (cell.querySelector('.e-hyperlinkcell')) {\n EventHandler.add(cell.querySelector('.e-hyperlinkcell'), this.parent.isAdaptive ? 'touchend' : 'click', this.onHyperCellClick, this);\n }\n else {\n return;\n }\n };\n return Render;\n}());\nexport { Render };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, Complex, Collection, ChildProperty } from '@syncfusion/ej2-base';\n/**\n * Configures the fields in dataSource.\n */\nvar FieldOptions = /** @class */ (function (_super) {\n __extends(FieldOptions, _super);\n function FieldOptions() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], FieldOptions.prototype, \"name\", void 0);\n __decorate([\n Property()\n ], FieldOptions.prototype, \"caption\", void 0);\n __decorate([\n Property('Sum')\n ], FieldOptions.prototype, \"type\", void 0);\n __decorate([\n Property()\n ], FieldOptions.prototype, \"axis\", void 0);\n __decorate([\n Property(false)\n ], FieldOptions.prototype, \"showNoDataItems\", void 0);\n __decorate([\n Property()\n ], FieldOptions.prototype, \"baseField\", void 0);\n __decorate([\n Property()\n ], FieldOptions.prototype, \"baseItem\", void 0);\n __decorate([\n Property(true)\n ], FieldOptions.prototype, \"showSubTotals\", void 0);\n return FieldOptions;\n}(ChildProperty));\nexport { FieldOptions };\nvar FieldListFieldOptions = /** @class */ (function (_super) {\n __extends(FieldListFieldOptions, _super);\n function FieldListFieldOptions() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n return FieldListFieldOptions;\n}(FieldOptions));\nexport { FieldListFieldOptions };\n/**\n * Configures the style settings.\n */\nvar Style = /** @class */ (function (_super) {\n __extends(Style, _super);\n function Style() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], Style.prototype, \"backgroundColor\", void 0);\n __decorate([\n Property()\n ], Style.prototype, \"color\", void 0);\n __decorate([\n Property()\n ], Style.prototype, \"fontFamily\", void 0);\n __decorate([\n Property()\n ], Style.prototype, \"fontSize\", void 0);\n return Style;\n}(ChildProperty));\nexport { Style };\n/**\n * Configures the filter settings.\n */\nvar Filter = /** @class */ (function (_super) {\n __extends(Filter, _super);\n function Filter() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], Filter.prototype, \"name\", void 0);\n __decorate([\n Property('Include')\n ], Filter.prototype, \"type\", void 0);\n __decorate([\n Property()\n ], Filter.prototype, \"items\", void 0);\n __decorate([\n Property('DoesNotEquals')\n ], Filter.prototype, \"condition\", void 0);\n __decorate([\n Property()\n ], Filter.prototype, \"value1\", void 0);\n __decorate([\n Property()\n ], Filter.prototype, \"value2\", void 0);\n __decorate([\n Property()\n ], Filter.prototype, \"measure\", void 0);\n return Filter;\n}(ChildProperty));\nexport { Filter };\n/**\n * Configures the conditional format settings.\n */\nvar ConditionalFormatSettings = /** @class */ (function (_super) {\n __extends(ConditionalFormatSettings, _super);\n function ConditionalFormatSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], ConditionalFormatSettings.prototype, \"measure\", void 0);\n __decorate([\n Property()\n ], ConditionalFormatSettings.prototype, \"label\", void 0);\n __decorate([\n Property()\n ], ConditionalFormatSettings.prototype, \"conditions\", void 0);\n __decorate([\n Property()\n ], ConditionalFormatSettings.prototype, \"value1\", void 0);\n __decorate([\n Property()\n ], ConditionalFormatSettings.prototype, \"value2\", void 0);\n __decorate([\n Property()\n ], ConditionalFormatSettings.prototype, \"style\", void 0);\n return ConditionalFormatSettings;\n}(ChildProperty));\nexport { ConditionalFormatSettings };\n/**\n * Configures the sort settings.\n */\nvar Sort = /** @class */ (function (_super) {\n __extends(Sort, _super);\n function Sort() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], Sort.prototype, \"name\", void 0);\n __decorate([\n Property('Ascending')\n ], Sort.prototype, \"order\", void 0);\n return Sort;\n}(ChildProperty));\nexport { Sort };\n/**\n * Configures the format settings of value fields.\n */\nvar FormatSettings = /** @class */ (function (_super) {\n __extends(FormatSettings, _super);\n function FormatSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], FormatSettings.prototype, \"name\", void 0);\n __decorate([\n Property()\n ], FormatSettings.prototype, \"minimumFractionDigits\", void 0);\n __decorate([\n Property()\n ], FormatSettings.prototype, \"maximumFractionDigits\", void 0);\n __decorate([\n Property()\n ], FormatSettings.prototype, \"minimumSignificantDigits\", void 0);\n __decorate([\n Property()\n ], FormatSettings.prototype, \"maximumSignificantDigits\", void 0);\n __decorate([\n Property(true)\n ], FormatSettings.prototype, \"useGrouping\", void 0);\n __decorate([\n Property()\n ], FormatSettings.prototype, \"skeleton\", void 0);\n __decorate([\n Property()\n ], FormatSettings.prototype, \"type\", void 0);\n __decorate([\n Property()\n ], FormatSettings.prototype, \"currency\", void 0);\n __decorate([\n Property()\n ], FormatSettings.prototype, \"minimumIntegerDigits\", void 0);\n __decorate([\n Property()\n ], FormatSettings.prototype, \"format\", void 0);\n return FormatSettings;\n}(ChildProperty));\nexport { FormatSettings };\n/**\n * Configures the group settings of fields.\n */\nvar GroupSettings = /** @class */ (function (_super) {\n __extends(GroupSettings, _super);\n function GroupSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], GroupSettings.prototype, \"name\", void 0);\n __decorate([\n Property()\n ], GroupSettings.prototype, \"groupInterval\", void 0);\n __decorate([\n Property()\n ], GroupSettings.prototype, \"startingAt\", void 0);\n __decorate([\n Property()\n ], GroupSettings.prototype, \"endingAt\", void 0);\n __decorate([\n Property('Date')\n ], GroupSettings.prototype, \"type\", void 0);\n __decorate([\n Property()\n ], GroupSettings.prototype, \"rangeInterval\", void 0);\n return GroupSettings;\n}(ChildProperty));\nexport { GroupSettings };\n/**\n * Configures the calculatedfields settings.\n */\nvar CalculatedFieldSettings = /** @class */ (function (_super) {\n __extends(CalculatedFieldSettings, _super);\n function CalculatedFieldSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], CalculatedFieldSettings.prototype, \"name\", void 0);\n __decorate([\n Property()\n ], CalculatedFieldSettings.prototype, \"formula\", void 0);\n return CalculatedFieldSettings;\n}(ChildProperty));\nexport { CalculatedFieldSettings };\n/**\n * Configures drilled state of field members.\n */\nvar DrillOptions = /** @class */ (function (_super) {\n __extends(DrillOptions, _super);\n function DrillOptions() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], DrillOptions.prototype, \"name\", void 0);\n __decorate([\n Property()\n ], DrillOptions.prototype, \"items\", void 0);\n return DrillOptions;\n}(ChildProperty));\nexport { DrillOptions };\n/**\n * Configures value sort settings.\n */\nvar ValueSortSettings = /** @class */ (function (_super) {\n __extends(ValueSortSettings, _super);\n function ValueSortSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], ValueSortSettings.prototype, \"headerText\", void 0);\n __decorate([\n Property('.')\n ], ValueSortSettings.prototype, \"headerDelimiter\", void 0);\n __decorate([\n Property('None')\n ], ValueSortSettings.prototype, \"sortOrder\", void 0);\n return ValueSortSettings;\n}(ChildProperty));\nexport { ValueSortSettings };\n/**\n * Configures the settings of dataSource.\n */\nvar DataSource = /** @class */ (function (_super) {\n __extends(DataSource, _super);\n function DataSource() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], DataSource.prototype, \"data\", void 0);\n __decorate([\n Collection([], FieldOptions)\n ], DataSource.prototype, \"rows\", void 0);\n __decorate([\n Collection([], FieldOptions)\n ], DataSource.prototype, \"columns\", void 0);\n __decorate([\n Collection([], FieldOptions)\n ], DataSource.prototype, \"values\", void 0);\n __decorate([\n Collection([], FieldOptions)\n ], DataSource.prototype, \"filters\", void 0);\n __decorate([\n Property(false)\n ], DataSource.prototype, \"expandAll\", void 0);\n __decorate([\n Property('column')\n ], DataSource.prototype, \"valueAxis\", void 0);\n __decorate([\n Collection([], Filter)\n ], DataSource.prototype, \"filterSettings\", void 0);\n __decorate([\n Collection([], Sort)\n ], DataSource.prototype, \"sortSettings\", void 0);\n __decorate([\n Property(true)\n ], DataSource.prototype, \"enableSorting\", void 0);\n __decorate([\n Property(false)\n ], DataSource.prototype, \"allowLabelFilter\", void 0);\n __decorate([\n Property(false)\n ], DataSource.prototype, \"allowValueFilter\", void 0);\n __decorate([\n Property(true)\n ], DataSource.prototype, \"showSubTotals\", void 0);\n __decorate([\n Property(true)\n ], DataSource.prototype, \"showRowSubTotals\", void 0);\n __decorate([\n Property(true)\n ], DataSource.prototype, \"showColumnSubTotals\", void 0);\n __decorate([\n Property(true)\n ], DataSource.prototype, \"showGrandTotals\", void 0);\n __decorate([\n Property(true)\n ], DataSource.prototype, \"showRowGrandTotals\", void 0);\n __decorate([\n Property(true)\n ], DataSource.prototype, \"showColumnGrandTotals\", void 0);\n __decorate([\n Property(false)\n ], DataSource.prototype, \"alwaysShowValueHeader\", void 0);\n __decorate([\n Property(true)\n ], DataSource.prototype, \"showAggregationOnValueField\", void 0);\n __decorate([\n Collection([], FormatSettings)\n ], DataSource.prototype, \"formatSettings\", void 0);\n __decorate([\n Collection([], DrillOptions)\n ], DataSource.prototype, \"drilledMembers\", void 0);\n __decorate([\n Complex({}, ValueSortSettings)\n ], DataSource.prototype, \"valueSortSettings\", void 0);\n __decorate([\n Collection([], CalculatedFieldSettings)\n ], DataSource.prototype, \"calculatedFieldSettings\", void 0);\n __decorate([\n Collection([], ConditionalFormatSettings)\n ], DataSource.prototype, \"conditionalFormatSettings\", void 0);\n __decorate([\n Property()\n ], DataSource.prototype, \"emptyCellsTextContent\", void 0);\n __decorate([\n Collection([], GroupSettings)\n ], DataSource.prototype, \"groupSettings\", void 0);\n return DataSource;\n}(ChildProperty));\nexport { DataSource };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty, Event } from '@syncfusion/ej2-base';\n/**\n * Represents Pivot widget model class.\n */\nvar GridSettings = /** @class */ (function (_super) {\n __extends(GridSettings, _super);\n function GridSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Both')\n ], GridSettings.prototype, \"gridLines\", void 0);\n __decorate([\n Property(false)\n ], GridSettings.prototype, \"allowTextWrap\", void 0);\n __decorate([\n Property(false)\n ], GridSettings.prototype, \"allowReordering\", void 0);\n __decorate([\n Property(true)\n ], GridSettings.prototype, \"allowResizing\", void 0);\n __decorate([\n Property(null)\n ], GridSettings.prototype, \"rowHeight\", void 0);\n __decorate([\n Property(110)\n ], GridSettings.prototype, \"columnWidth\", void 0);\n __decorate([\n Property('Ellipsis')\n ], GridSettings.prototype, \"clipMode\", void 0);\n __decorate([\n Property(false)\n ], GridSettings.prototype, \"allowSelection\", void 0);\n __decorate([\n Property(-1)\n ], GridSettings.prototype, \"selectedRowIndex\", void 0);\n __decorate([\n Property({ mode: 'Row', cellSelectionMode: 'Flow', type: 'Single' })\n ], GridSettings.prototype, \"selectionSettings\", void 0);\n __decorate([\n Property('AllPages')\n ], GridSettings.prototype, \"printMode\", void 0);\n __decorate([\n Property()\n ], GridSettings.prototype, \"contextMenuItems\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"beforeCopy\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"printComplete\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"beforePrint\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"contextMenuOpen\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"contextMenuClick\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"queryCellInfo\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"headerCellInfo\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"rowSelecting\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"rowSelected\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"rowDeselecting\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"rowDeselected\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"cellSelecting\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"cellSelected\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"cellDeselecting\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"cellDeselected\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"resizeStart\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"resizing\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"resizeStop\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"pdfHeaderQueryCellInfo\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"pdfQueryCellInfo\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"excelHeaderQueryCellInfo\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"excelQueryCellInfo\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"columnDragStart\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"columnDrag\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"columnDrop\", void 0);\n __decorate([\n Event()\n ], GridSettings.prototype, \"columnRender\", void 0);\n return GridSettings;\n}(ChildProperty));\nexport { GridSettings };\n","import { Workbook } from '@syncfusion/ej2-excel-export';\nimport * as events from '../../common/base/constant';\n/**\n * @hidden\n * `ExcelExport` module is used to handle the Excel export action.\n */\nvar ExcelExport = /** @class */ (function () {\n /**\n * Constructor for the PivotGrid Excel Export module.\n * @hidden\n */\n function ExcelExport(parent) {\n this.parent = parent;\n }\n /**\n * For internal use only - Get the module name.\n * @private\n */\n ExcelExport.prototype.getModuleName = function () {\n return 'excelExport';\n };\n /**\n * Method to perform excel export.\n * @hidden\n */\n ExcelExport.prototype.exportToExcel = function (type) {\n /** Event trigerring */\n if (this.parent.enableVirtualization) {\n var pageSettings = this.parent.engineModule.pageSettings;\n this.parent.engineModule.pageSettings = null;\n this.parent.engineModule.generateGridData(this.parent.dataSource);\n this.parent.engineModule.pageSettings = pageSettings;\n }\n var args = {\n fileName: 'default', header: '', footer: '', dataCollections: [this.parent.engineModule.pivotValues]\n };\n this.parent.trigger(events.beforeExport, args);\n var fileName = args.fileName;\n var header = args.header;\n var footer = args.footer;\n var dataCollections = args.dataCollections;\n /** Fill data and export */\n /* tslint:disable-next-line:no-any */\n var workSheets = [];\n for (var dataColl = 0; dataColl < dataCollections.length; dataColl++) {\n var pivotValues = dataCollections[dataColl];\n var colLen = 0;\n var rowLen = pivotValues.length;\n var actualrCnt = 0;\n var formatList = this.parent.renderModule.getFormatList();\n var rows = [];\n var maxLevel = 0;\n for (var rCnt = 0; rCnt < rowLen; rCnt++) {\n if (pivotValues[rCnt]) {\n actualrCnt++;\n colLen = pivotValues[rCnt].length;\n var cells = [];\n for (var cCnt = 0; cCnt < colLen; cCnt++) {\n if (pivotValues[rCnt][cCnt]) {\n var pivotCell = pivotValues[rCnt][cCnt];\n if (!(pivotCell.level === -1 && !pivotCell.rowSpan)) {\n var cellValue = pivotCell.axis === 'value' ? pivotCell.value : pivotCell.formattedText;\n if (pivotCell.type === 'grand sum') {\n cellValue = this.parent.localeObj.getConstant('grandTotal');\n }\n else if (pivotCell.type === 'sum') {\n cellValue = cellValue.toString().replace('Total', this.parent.localeObj.getConstant('total'));\n }\n else {\n cellValue = cellValue;\n }\n if (!(pivotCell.level === -1 && !pivotCell.rowSpan)) {\n cells.push({\n index: cCnt + 1, value: cellValue,\n colSpan: pivotCell.colSpan, rowSpan: pivotCell.rowSpan,\n });\n if (pivotCell.axis === 'value') {\n cells[cells.length - 1].style = {\n numberFormat: formatList[(cCnt - 1) % this.parent.dataSource.values.length],\n bold: false,\n wrapText: true\n };\n if (pivotCell.style) {\n cells[cells.length - 1].style.backColor = pivotCell.style.backgroundColor;\n cells[cells.length - 1].style.fontColor = pivotCell.style.color;\n cells[cells.length - 1].style.fontName = pivotCell.style.fontFamily;\n cells[cells.length - 1].style.fontSize = Number(pivotCell.style.fontSize.split('px')[0]);\n }\n }\n else {\n cells[cells.length - 1].style = {\n bold: true,\n vAlign: 'Center',\n wrapText: true,\n indent: cCnt === 1 ? pivotCell.level * 10 : 0\n };\n if (pivotCell.axis === 'row' && cCnt === 0) {\n cells[cells.length - 1].style.hAlign = 'Left';\n cells[cells.length - 1].style.indent = pivotCell.level * 2;\n maxLevel = pivotCell.level > maxLevel ? pivotCell.level : maxLevel;\n }\n }\n cells[cells.length - 1].style.borders = { color: '#000000', lineStyle: 'Thin' };\n }\n }\n cCnt = cCnt + (pivotCell.colSpan ? (pivotCell.colSpan - 1) : 0);\n }\n else {\n cells.push({\n index: cCnt + 1, value: '', colSpan: 1, rowSpan: 1,\n });\n }\n }\n rows.push({ index: actualrCnt, cells: cells });\n }\n }\n var columns = [];\n for (var cCnt = 0; cCnt < colLen; cCnt++) {\n columns.push({ index: cCnt + 1, width: 100 });\n }\n if (maxLevel > 0) {\n columns[0].width = 100 + (maxLevel * 20);\n }\n workSheets.push({ columns: columns, rows: rows });\n }\n var book = new Workbook({ worksheets: workSheets }, type === 'Excel' ? 'xlsx' : 'csv');\n book.save(fileName + (type === 'Excel' ? '.xlsx' : '.csv'));\n };\n /**\n * To destroy the excel export module\n * @returns void\n * @hidden\n */\n /* tslint:disable:no-empty */\n ExcelExport.prototype.destroy = function () {\n };\n return ExcelExport;\n}());\nexport { ExcelExport };\n","import { PdfGrid, PdfPen, PointF, PdfDocument, PdfStandardFont, PdfFontFamily, PdfSolidBrush, PdfColor, PdfStringFormat, PdfVerticalAlignment, PdfTextAlignment, PdfFontStyle, PdfPageTemplateElement, RectangleF, PdfBorders } from '@syncfusion/ej2-pdf-export';\nimport * as events from '../../common/base/constant';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\n/**\n * @hidden\n * `PDFExport` module is used to handle the PDF export action.\n */\nvar PDFExport = /** @class */ (function () {\n /**\n * Constructor for the PivotGrid PDF Export module.\n * @hidden\n */\n function PDFExport(parent) {\n this.parent = parent;\n }\n /**\n * For internal use only - Get the module name.\n * @private\n */\n PDFExport.prototype.getModuleName = function () {\n return 'pdfExport';\n };\n PDFExport.prototype.addPage = function (eventParams) {\n var page = eventParams.document.pages.add();\n var header = eventParams.args.header;\n var footer = eventParams.args.footer;\n var font = new PdfStandardFont(PdfFontFamily.TimesRoman, 15, PdfFontStyle.Regular);\n var brush = new PdfSolidBrush(new PdfColor(0, 0, 0));\n var pen = new PdfPen(new PdfColor(0, 0, 0), .5);\n /** Header and Footer to be set */\n var headerTemplate = new PdfPageTemplateElement(new RectangleF(0, 0, page.graphics.clientSize.width, 20));\n headerTemplate.graphics.drawString(header, font, pen, brush, 0, 0, new PdfStringFormat(PdfTextAlignment.Center));\n eventParams.document.template.top = headerTemplate;\n var footerTemplate = new PdfPageTemplateElement(new RectangleF(0, 0, page.graphics.clientSize.width, 20));\n footerTemplate.graphics.drawString(footer, font, pen, brush, 0, 0, new PdfStringFormat(PdfTextAlignment.Center));\n eventParams.document.template.bottom = footerTemplate;\n return page;\n };\n PDFExport.prototype.hexDecToRgb = function (hexDec) {\n if (hexDec === null || hexDec === '' || hexDec.length !== 7) {\n throw new Error('please set valid hex value for color..');\n }\n hexDec = hexDec.substring(1);\n var bigint = parseInt(hexDec, 16);\n var r = (bigint >> 16) & 255;\n var g = (bigint >> 8) & 255;\n var b = bigint & 255;\n return { r: r, g: g, b: b };\n };\n PDFExport.prototype.getFontStyle = function (theme) {\n var fontType = PdfFontStyle.Regular;\n if (!isNullOrUndefined(theme) && theme.bold) {\n fontType |= PdfFontStyle.Bold;\n }\n if (!isNullOrUndefined(theme) && theme.italic) {\n fontType |= PdfFontStyle.Italic;\n }\n if (!isNullOrUndefined(theme) && theme.underline) {\n fontType |= PdfFontStyle.Underline;\n }\n if (!isNullOrUndefined(theme) && theme.strikeout) {\n fontType |= PdfFontStyle.Strikeout;\n }\n return fontType;\n };\n PDFExport.prototype.getBorderStyle = function (borderStyle) {\n var borders = new PdfBorders();\n if (!isNullOrUndefined(borderStyle)) {\n var borderWidth = borderStyle.width;\n // set border width\n var width = (!isNullOrUndefined(borderWidth) && typeof borderWidth === 'number') ? borderWidth * 0.75 : undefined;\n // set border color\n var color = new PdfColor(196, 196, 196);\n if (!isNullOrUndefined(borderStyle.color)) {\n var borderColor = this.hexDecToRgb(borderStyle.color);\n color = new PdfColor(borderColor.r, borderColor.g, borderColor.b);\n }\n var pen = new PdfPen(color, width);\n // set border dashStyle 'Solid , Dash, Dot, DashDot, DashDotDot'\n if (!isNullOrUndefined(borderStyle.dashStyle)) {\n pen.dashStyle = this.getDashStyle(borderStyle.dashStyle);\n }\n borders.all = pen;\n }\n else {\n var pdfColor = new PdfColor(234, 234, 234);\n borders.all = new PdfPen(pdfColor);\n }\n return borders;\n };\n PDFExport.prototype.getDashStyle = function (dashType) {\n switch (dashType) {\n case 'Dash':\n return 1;\n case 'Dot':\n return 2;\n case 'DashDot':\n return 3;\n case 'DashDotDot':\n return 4;\n default:\n return 0;\n }\n };\n PDFExport.prototype.getStyle = function () {\n var border = new PdfBorders();\n if (!isNullOrUndefined(this.gridStyle)) {\n var fontFamily = !isNullOrUndefined(this.gridStyle.header.fontName) ?\n this.getFontFamily(this.gridStyle.header.fontName) : PdfFontFamily.Helvetica;\n var fontStyle = this.getFontStyle(this.gridStyle.header);\n var fontSize = !isNullOrUndefined(this.gridStyle.header.fontSize) ? this.gridStyle.header.fontSize : 10.5;\n var pdfColor = new PdfColor();\n if (!isNullOrUndefined(this.gridStyle.header.fontColor)) {\n var penBrushColor = this.hexDecToRgb(this.gridStyle.header.fontColor);\n pdfColor = new PdfColor(penBrushColor.r, penBrushColor.g, penBrushColor.b);\n }\n var font = new PdfStandardFont(fontFamily, fontSize, fontStyle);\n if (!isNullOrUndefined(this.gridStyle.header.font)) {\n font = this.gridStyle.header.font;\n }\n return {\n border: this.getBorderStyle(this.gridStyle.header.border), font: font, brush: new PdfSolidBrush(pdfColor)\n };\n }\n else {\n return {\n brush: new PdfSolidBrush(new PdfColor()),\n border: border, font: undefined\n };\n }\n };\n PDFExport.prototype.setRecordThemeStyle = function (row, border) {\n if (!isNullOrUndefined(this.gridStyle) && !isNullOrUndefined(this.gridStyle.record)) {\n var fontFamily = !isNullOrUndefined(this.gridStyle.record.fontName) ?\n this.getFontFamily(this.gridStyle.record.fontName) : PdfFontFamily.Helvetica;\n var fontSize = !isNullOrUndefined(this.gridStyle.record.fontSize) ? this.gridStyle.record.fontSize : 9.75;\n var fontStyle = this.getFontStyle(this.gridStyle.record);\n var font = new PdfStandardFont(fontFamily, fontSize, fontStyle);\n if (!isNullOrUndefined(this.gridStyle.record.font)) {\n font = this.gridStyle.record.font;\n }\n row.style.setFont(font);\n var pdfColor = new PdfColor();\n if (!isNullOrUndefined(this.gridStyle.record.fontColor)) {\n var penBrushColor = this.hexDecToRgb(this.gridStyle.record.fontColor);\n pdfColor = new PdfColor(penBrushColor.r, penBrushColor.g, penBrushColor.b);\n }\n row.style.setTextBrush(new PdfSolidBrush(pdfColor));\n }\n var borderRecord = this.gridStyle && this.gridStyle.record &&\n this.gridStyle.record.border ? this.getBorderStyle(this.gridStyle.record.border) : border;\n row.style.setBorder(borderRecord);\n return row;\n };\n /**\n * Method to perform pdf export.\n * @hidden\n */\n /* tslint:disable:max-func-body-length */\n PDFExport.prototype.exportToPDF = function () {\n var eventParams = this.applyEvent();\n var headerStyle = this.getStyle();\n /** Fill data and export */\n var dataCollIndex = 0;\n var pivotValues = eventParams.args.dataCollections[dataCollIndex];\n for (var vLen = 0; eventParams.args.allowRepeatHeader && vLen < pivotValues.length; vLen++) {\n for (var vCnt = 6; pivotValues[vLen] && vCnt < pivotValues[vLen].length; vCnt += 6) {\n pivotValues[vLen].splice(vCnt, 0, pivotValues[vLen][0]);\n }\n }\n var colLength = pivotValues && pivotValues.length > 0 ? pivotValues[0].length : 0;\n var integratedCnt = 0;\n do {\n var page = this.addPage(eventParams);\n var pdfGrid = new PdfGrid();\n if (pivotValues && pivotValues.length > 0) {\n pdfGrid.columns.add(pivotValues[0].length - integratedCnt >= 6 ? 6 : pivotValues[0].length - integratedCnt);\n var rowLen = pivotValues.length;\n var actualrCnt = 0;\n var maxLevel = 0;\n for (var rCnt = 0; rCnt < rowLen; rCnt++) {\n if (pivotValues[rCnt]) {\n var isColHeader = !(pivotValues[rCnt][0] && pivotValues[rCnt][0].axis === 'row');\n var colLen = pivotValues[rCnt].length > (integratedCnt + 6) ? (integratedCnt + 6) :\n pivotValues[rCnt].length;\n if (isColHeader) {\n pdfGrid.headers.add(1);\n }\n var pdfGridRow = !isColHeader ? pdfGrid.rows.addRow() : pdfGrid.headers.getHeader(actualrCnt);\n if (isColHeader) {\n pdfGridRow.style.setBorder(headerStyle.border);\n if (headerStyle.font) {\n pdfGridRow.style.setFont(headerStyle.font);\n }\n pdfGridRow.style.setTextBrush(headerStyle.brush);\n }\n else {\n this.setRecordThemeStyle(pdfGridRow, headerStyle.border);\n }\n var localCnt = 0;\n var isEmptyRow = true;\n for (var cCnt = integratedCnt; cCnt < colLen; cCnt++) {\n var isValueCell = false;\n if (pivotValues[rCnt][cCnt]) {\n var pivotCell = pivotValues[rCnt][cCnt];\n if (!(pivotCell.level === -1 && !pivotCell.rowSpan)) {\n var cellValue = pivotCell.formattedText;\n cellValue = pivotCell.type === 'grand sum' ? this.parent.localeObj.getConstant('grandTotal') :\n (pivotCell.type === 'sum' ?\n cellValue.toString().replace('Total', this.parent.localeObj.getConstant('total')) : cellValue);\n if (!(pivotCell.level === -1 && !pivotCell.rowSpan)) {\n pdfGridRow.cells.getCell(localCnt).columnSpan = pivotCell.colSpan ?\n (6 - localCnt < pivotCell.colSpan ? 6 - localCnt : pivotCell.colSpan) : 1;\n if (isColHeader && pivotCell.rowSpan && pivotCell.rowSpan > 1) {\n pdfGridRow.cells.getCell(localCnt).rowSpan = pivotCell.rowSpan ? pivotCell.rowSpan : 1;\n }\n pdfGridRow.cells.getCell(localCnt).value = cellValue ? cellValue.toString() : '';\n }\n if (cellValue !== '') {\n isEmptyRow = false;\n }\n }\n maxLevel = pivotCell.level > maxLevel ? pivotCell.level : maxLevel;\n isValueCell = pivotCell.axis === 'value';\n cCnt = cCnt + (pdfGridRow.cells.getCell(localCnt).columnSpan ?\n (pdfGridRow.cells.getCell(localCnt).columnSpan - 1) : 0);\n localCnt = localCnt + (pdfGridRow.cells.getCell(localCnt).columnSpan ?\n (pdfGridRow.cells.getCell(localCnt).columnSpan - 1) : 0);\n if (pivotCell.style) {\n pdfGridRow = this.applyStyle(pdfGridRow, pivotCell, localCnt);\n }\n var args = {\n style: (pivotCell && pivotCell.isSum) ? { bold: true } : undefined,\n pivotCell: pivotCell,\n cell: pdfGridRow.cells.getCell(localCnt)\n };\n this.parent.trigger(events.onPdfCellRender, args);\n if (args.style) {\n this.processCellStyle(pdfGridRow.cells.getCell(localCnt), args);\n }\n }\n else {\n var args = {\n style: undefined,\n pivotCell: undefined,\n cell: pdfGridRow.cells.getCell(localCnt)\n };\n this.parent.trigger(events.onPdfCellRender, args);\n if (args.style) {\n this.processCellStyle(pdfGridRow.cells.getCell(localCnt), args);\n }\n pdfGridRow.cells.getCell(localCnt).value = '';\n if (cCnt === 0 && isColHeader && this.parent.dataSource.columns &&\n this.parent.dataSource.columns.length > 0) {\n pdfGrid.headers.getHeader(0).cells.getCell(0).rowSpan++;\n }\n else if (cCnt !== 0 && isColHeader && this.parent.dataSource.columns &&\n this.parent.dataSource.columns.length > 0 &&\n pdfGrid.headers.getHeader(0).cells.getCell(0).rowSpan <\n Object.keys(this.parent.engineModule.headerContent).length) {\n pdfGrid.headers.getHeader(0).cells.getCell(0).rowSpan++;\n }\n }\n var stringFormat = new PdfStringFormat();\n stringFormat.paragraphIndent = (!isColHeader && localCnt === 0 && pivotValues[rCnt][cCnt]) ?\n pivotValues[rCnt][cCnt].level * 15 : 0;\n stringFormat.alignment = isValueCell ? PdfTextAlignment.Right : PdfTextAlignment.Left;\n stringFormat.lineAlignment = PdfVerticalAlignment.Middle;\n pdfGridRow.cells.getCell(localCnt).style.stringFormat = stringFormat;\n localCnt++;\n }\n if (isEmptyRow) {\n pdfGridRow.height = 16;\n }\n actualrCnt++;\n }\n }\n pdfGrid.columns.getColumn(0).width = 100 + (maxLevel * 20);\n }\n if (integratedCnt === 0 && this.parent.dataSource.columns && this.parent.dataSource.columns.length > 0) {\n pdfGrid.headers.getHeader(0).cells.getCell(0).rowSpan--;\n }\n pdfGrid.draw(page, new PointF(10, 20));\n integratedCnt = integratedCnt + 6;\n if (integratedCnt >= colLength && eventParams.args.dataCollections.length > (dataCollIndex + 1)) {\n dataCollIndex++;\n pivotValues = eventParams.args.dataCollections[dataCollIndex];\n colLength = pivotValues && pivotValues.length > 0 ? pivotValues[0].length : 0;\n integratedCnt = 0;\n }\n } while (integratedCnt < colLength);\n eventParams.document.save(eventParams.args.fileName + '.pdf');\n eventParams.document.destroy();\n };\n PDFExport.prototype.applyStyle = function (pdfGridRow, pivotCell, localCnt) {\n var color = this.parent.conditionalFormattingModule.hexToRgb(pivotCell.style.backgroundColor);\n var brush = new PdfSolidBrush(new PdfColor(color.r, color.g, color.b));\n pdfGridRow.cells.getCell(localCnt).style.backgroundBrush = brush;\n var size = Number(pivotCell.style.fontSize.split('px')[0]);\n var font = new PdfStandardFont(PdfFontFamily.TimesRoman, size, PdfFontStyle.Regular);\n pdfGridRow.cells.getCell(localCnt).style.font = font;\n color = this.parent.conditionalFormattingModule.hexToRgb(pivotCell.style.color);\n brush = new PdfSolidBrush(new PdfColor(color.r, color.g, color.b));\n pdfGridRow.cells.getCell(localCnt).style.textBrush = brush;\n return pdfGridRow;\n };\n PDFExport.prototype.getFontFamily = function (family) {\n switch (family) {\n case 'TimesRoman':\n return 2;\n case 'Courier':\n return 1;\n case 'Symbol':\n return 3;\n case 'ZapfDingbats':\n return 4;\n default:\n return 0;\n }\n };\n /* tslint:disable-next-line:no-any */\n PDFExport.prototype.getFont = function (theme) {\n if (theme.style.font) {\n return theme.style.font;\n }\n var fontSize = (!isNullOrUndefined(theme.style.fontSize)) ? (theme.style.fontSize * 0.75) : 9.75;\n var fontFamily = (!isNullOrUndefined(theme.style.fontFamily)) ?\n (this.getFontFamily(theme.style.fontFamily)) : PdfFontFamily.TimesRoman;\n var fontStyle = PdfFontStyle.Regular;\n if (!isNullOrUndefined(theme.style.bold) && theme.style.bold) {\n fontStyle |= PdfFontStyle.Bold;\n }\n if (!isNullOrUndefined(theme.style.italic) && theme.style.italic) {\n fontStyle |= PdfFontStyle.Italic;\n }\n if (!isNullOrUndefined(theme.style.underline) && theme.style.underline) {\n fontStyle |= PdfFontStyle.Underline;\n }\n if (!isNullOrUndefined(theme.style.strikeout) && theme.style.strikeout) {\n fontStyle |= PdfFontStyle.Strikeout;\n }\n return new PdfStandardFont(fontFamily, fontSize, fontStyle);\n };\n PDFExport.prototype.processCellStyle = function (gridCell, arg) {\n if (!isNullOrUndefined(arg.style.backgroundColor)) {\n var backColor = this.hexDecToRgb(arg.style.backgroundColor);\n gridCell.style.backgroundBrush = new PdfSolidBrush(new PdfColor(backColor.r, backColor.g, backColor.b));\n }\n if (!isNullOrUndefined(arg.style.textBrushColor)) {\n var textBrushColor = this.hexDecToRgb(arg.style.textBrushColor);\n gridCell.style.textBrush = new PdfSolidBrush(new PdfColor(textBrushColor.r, textBrushColor.g, textBrushColor.b));\n }\n if (!isNullOrUndefined(arg.style.textPenColor)) {\n var textColor = this.hexDecToRgb(arg.style.textPenColor);\n gridCell.style.textPen = new PdfPen(new PdfColor(textColor.r, textColor.g, textColor.b));\n }\n if (!isNullOrUndefined(arg.style.fontFamily) || !isNullOrUndefined(arg.style.fontSize) || !isNullOrUndefined(arg.style.bold) ||\n !isNullOrUndefined(arg.style.italic) || !isNullOrUndefined(arg.style.underline) || !isNullOrUndefined(arg.style.strikeout)) {\n gridCell.style.font = this.getFont(arg);\n }\n if (!isNullOrUndefined(arg.style.border)) {\n var border = new PdfBorders();\n var borderWidth = arg.style.border.width;\n // set border width\n var width = (!isNullOrUndefined(borderWidth) && typeof borderWidth === 'number') ? (borderWidth * 0.75) : (undefined);\n // set border color\n var color = new PdfColor(196, 196, 196);\n if (!isNullOrUndefined(arg.style.border.color)) {\n var borderColor = this.hexDecToRgb(arg.style.border.color);\n color = new PdfColor(borderColor.r, borderColor.g, borderColor.b);\n }\n var pen = new PdfPen(color, width);\n // set border dashStyle 'Solid , Dash, Dot, DashDot, DashDotDot'\n if (!isNullOrUndefined(arg.style.border.dashStyle)) {\n pen.dashStyle = this.getDashStyle(arg.style.border.dashStyle);\n }\n border.all = pen;\n gridCell.style.borders = border;\n }\n };\n PDFExport.prototype.applyEvent = function () {\n /** Event trigerring */\n if (this.parent.enableVirtualization) {\n var pageSettings = this.parent.engineModule.pageSettings;\n this.parent.engineModule.pageSettings = null;\n this.parent.engineModule.generateGridData(this.parent.dataSource);\n this.parent.engineModule.pageSettings = pageSettings;\n }\n var clonedValues = JSON.parse(JSON.stringify(this.parent.engineModule.pivotValues));\n var style;\n var args = {\n fileName: 'default', header: '', footer: '', dataCollections: [clonedValues], allowRepeatHeader: true, style: style\n };\n this.parent.trigger(events.beforeExport, args);\n this.gridStyle = args.style;\n var document = new PdfDocument();\n return { document: document, args: args };\n };\n /**\n * To destroy the pdf export module\n * @returns void\n * @hidden\n */\n /* tslint:disable:no-empty */\n PDFExport.prototype.destroy = function () {\n };\n return PDFExport;\n}());\nexport { PDFExport };\n","import { KeyboardEvents, closest, addClass, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport * as cls from '../../common/base/css-constant';\n/**\n * PivotView Keyboard interaction\n */\n/** @hidden */\nvar KeyboardInteraction = /** @class */ (function () {\n /**\n * Constructor\n */\n function KeyboardInteraction(parent) {\n this.keyConfigs = {\n tab: 'tab',\n enter: 'enter',\n shiftUp: 'shift+upArrow',\n shiftDown: 'shift+downArrow',\n shiftLeft: 'shift+leftArrow',\n shiftRight: 'shift+rightArrow',\n upArrow: 'upArrow',\n downArrow: 'downArrow',\n leftArrow: 'leftArrow',\n rightArrow: 'rightArrow',\n escape: 'escape'\n };\n this.parent = parent;\n this.parent.element.tabIndex = this.parent.element.tabIndex === -1 ? 0 : this.parent.element.tabIndex;\n this.pivotViewKeyboardModule = new KeyboardEvents(this.parent.element, {\n keyAction: this.keyActionHandler.bind(this),\n keyConfigs: this.keyConfigs,\n eventName: 'keydown'\n });\n }\n KeyboardInteraction.prototype.keyActionHandler = function (e) {\n switch (e.action) {\n case 'tab':\n this.processTab(e);\n break;\n case 'enter':\n this.processEnter(e);\n break;\n case 'shiftUp':\n case 'shiftDown':\n case 'shiftLeft':\n case 'shiftRight':\n case 'upArrow':\n case 'downArrow':\n case 'leftArrow':\n case 'rightArrow':\n this.processSelection(e);\n break;\n case 'escape':\n this.clearSelection();\n break;\n }\n };\n KeyboardInteraction.prototype.getNextButton = function (target) {\n var allPivotButtons = [].slice.call(this.parent.element.querySelectorAll('.' + cls.PIVOT_BUTTON_CLASS));\n var nextElement = target;\n if (this.parent.grid.element.querySelector('.' + cls.PIVOT_BUTTON_CLASS)) {\n var len = allPivotButtons.length;\n for (var i = 0; i < len; i++) {\n if (allPivotButtons[i].getAttribute('data-uid') === target.getAttribute('data-uid')) {\n nextElement = allPivotButtons[i + 1] ? allPivotButtons[i + 1] : nextElement;\n break;\n }\n }\n }\n return nextElement;\n };\n KeyboardInteraction.prototype.processTab = function (e) {\n var target = e.target;\n if (target && closest(target, '.' + cls.PIVOT_BUTTON_CLASS)) {\n var gridFocus = this.parent.grid.serviceLocator.getService('focus');\n var nextButton = this.getNextButton(target);\n if (nextButton.getAttribute('data-uid') !== target.getAttribute('data-uid')) {\n gridFocus.currentInfo.skipAction = true;\n nextButton.focus();\n }\n else {\n gridFocus.focus();\n var element = gridFocus.getFocusedElement();\n addClass([element], ['e-focused', 'e-focus']);\n element.setAttribute('tabindex', '0');\n }\n e.preventDefault();\n return;\n }\n else if (!this.parent.showGroupingBar && this.parent.showFieldList) {\n if (target && closest(target, '.' + cls.TOGGLE_FIELD_LIST_CLASS)) {\n var gridFocus = this.parent.grid.serviceLocator.getService('focus');\n gridFocus.focus();\n var element = gridFocus.getFocusedElement();\n addClass([element], ['e-focused', 'e-focus']);\n element.setAttribute('tabindex', '0');\n }\n }\n else if (!this.parent.showGroupingBar && !this.parent.showFieldList) {\n if (target && closest(target, '.' + cls.PIVOT_VIEW_CLASS)) {\n var gridElement = closest(target, '.' + cls.PIVOT_VIEW_CLASS);\n var gridFocus = this.parent.grid.serviceLocator.getService('focus');\n var rows = [].slice.call(gridElement.getElementsByTagName('tr'));\n if (target.innerHTML === (rows[rows.length - 1]).lastChild.innerHTML) {\n gridFocus.currentInfo.skipAction = true;\n }\n else {\n gridFocus.focus();\n var element = gridFocus.getFocusedElement();\n addClass([element], ['e-focused', 'e-focus']);\n element.setAttribute('tabindex', '0');\n }\n }\n }\n };\n KeyboardInteraction.prototype.processEnter = function (e) {\n var target = e.target;\n if (target && closest(target, '.' + cls.GRID_CLASS)) {\n if (target.querySelector('.' + cls.ICON)) {\n target.querySelector('.' + cls.ICON).click();\n }\n else if (target.classList.contains('e-valuescontent')) {\n target.dispatchEvent(new MouseEvent('dblclick', {\n 'view': window,\n 'bubbles': true,\n 'cancelable': true\n }));\n }\n e.preventDefault();\n return;\n }\n };\n KeyboardInteraction.prototype.clearSelection = function () {\n var control = this.parent;\n /* tslint:disable */\n [].slice.call(control.element.querySelectorAll('.' + cls.CELL_SELECTED_BGCOLOR + ',.' + cls.SELECTED_BGCOLOR)).forEach(function (ele) {\n ele.classList.remove(cls.SELECTED_BGCOLOR);\n ele.classList.remove(cls.CELL_SELECTED_BGCOLOR);\n ele.classList.remove(cls.CELL_ACTIVE_BGCOLOR);\n });\n this.parent.renderModule.selected();\n /* tslint:enable */\n };\n KeyboardInteraction.prototype.processSelection = function (e) {\n if (this.parent.gridSettings.allowSelection && this.parent.gridSettings.selectionSettings.mode !== 'Row') {\n var target = e.target;\n var control = this.parent;\n var colIndex = Number(e.target.getAttribute('aria-colIndex'));\n var rowIndex = Number(e.target.getAttribute('index'));\n var ele = void 0;\n /* tslint:disable */\n if (target.nodeName === 'TH' || target.nodeName === 'TD') {\n if (e.action === 'shiftUp' || e.action === 'upArrow') {\n ele = (rowIndex === 0 || colIndex === 0 || (target.nodeName !== 'TH' &&\n control.renderModule.rowStartPos !== rowIndex)) ? null : this.getParentElement(control, ele, colIndex, rowIndex - 1);\n }\n else if (e.action === 'shiftDown' || e.action === 'downArrow') {\n ele = control.element.querySelector('th[aria-colindex=\"' + colIndex + '\"][index=\"' + (rowIndex + 1) + '\"]');\n }\n else if (e.action === 'shiftLeft' || e.action === 'leftArrow') {\n ele = e.target.previousSibling;\n }\n else {\n ele = e.target.nextSibling;\n }\n }\n if (!isNullOrUndefined(ele)) {\n if (control.gridSettings.selectionSettings.mode === 'Both' ? !ele.classList.contains(cls.ROW_CELL_CLASS) : true) {\n colIndex = Number(ele.getAttribute('aria-colindex'));\n rowIndex = Number(ele.getAttribute('index'));\n var colSpan = Number(ele.getAttribute('aria-colspan'));\n control.clearSelection(ele, e, colIndex, rowIndex);\n control.applyColumnSelection(e, ele, colIndex, colIndex + (colSpan > 0 ? (colSpan - 1) : 0), rowIndex);\n }\n else {\n control.clearSelection(ele, e, colIndex, rowIndex);\n }\n }\n else {\n if (e.action === 'upArrow') {\n ele = control.element.querySelector('[aria-colindex=\"' + colIndex + '\"][index=\"' + (rowIndex - 1) + '\"]');\n rowIndex--;\n }\n else if (e.action === 'downArrow') {\n ele = control.element.querySelector('[aria-colindex=\"' + colIndex + '\"][index=\"' + (rowIndex + 1) + '\"]');\n rowIndex++;\n }\n if (!isNullOrUndefined(ele)) {\n control.clearSelection(ele, e, colIndex, rowIndex);\n }\n }\n }\n /* tslint:enable */\n };\n KeyboardInteraction.prototype.getParentElement = function (control, ele, colIndex, rowIndex) {\n while (!ele) {\n ele = control.element.querySelector('[aria-colindex=\"' + colIndex + '\"][index=\"' + rowIndex + '\"]');\n colIndex--;\n }\n return ele;\n };\n /**\n * To destroy the keyboard module.\n * @return {void}\n * @private\n */\n KeyboardInteraction.prototype.destroy = function () {\n if (this.pivotViewKeyboardModule) {\n this.pivotViewKeyboardModule.destroy();\n }\n else {\n return;\n }\n };\n return KeyboardInteraction;\n}());\nexport { KeyboardInteraction };\n","import { createElement } from '@syncfusion/ej2-base';\nimport { addClass, removeClass } from '@syncfusion/ej2-base';\nimport * as cls from '../../common/base/css-constant';\nimport { ContextMenu } from '@syncfusion/ej2-navigations';\n/**\n * Module to render Pivot button\n */\n/** @hidden */\nvar PivotContextMenu = /** @class */ (function () {\n /** Constructor for render module */\n function PivotContextMenu(parent) {\n this.parent = parent;\n this.parent.contextMenuModule = this;\n }\n /**\n * Initialize the pivot table rendering\n * @returns void\n * @private\n */\n PivotContextMenu.prototype.render = function () {\n this.renderContextMenu();\n };\n PivotContextMenu.prototype.renderContextMenu = function () {\n var menuItems = [\n { text: this.parent.localeObj.getConstant('addToFilter'), id: 'Context_Filters' },\n { text: this.parent.localeObj.getConstant('addToRow'), id: 'Context_Rows' },\n { text: this.parent.localeObj.getConstant('addToColumn'), id: 'Context_Columns' },\n { text: this.parent.localeObj.getConstant('addToValue'), id: 'Context_Values' }\n ];\n var menuOptions = {\n cssClass: cls.PIVOT_CONTEXT_MENU_CLASS,\n items: menuItems,\n enableRtl: this.parent.enableRtl,\n beforeOpen: this.onBeforeMenuOpen.bind(this),\n select: this.onSelectContextMenu.bind(this)\n };\n var cMenu = createElement('ul', {\n id: this.parent.element.id + '_PivotContextMenu'\n });\n this.parent.element.appendChild(cMenu);\n this.menuObj = new ContextMenu(menuOptions);\n this.menuObj.appendTo(cMenu);\n };\n PivotContextMenu.prototype.onBeforeMenuOpen = function (args) {\n var items = [].slice.call(args.element.querySelectorAll('li'));\n var fieldType = this.fieldElement.querySelector('.' + cls.PIVOT_BUTTON_CONTENT_CLASS).getAttribute('data-type');\n removeClass(items, cls.MENU_DISABLE);\n if (fieldType === 'CalculatedField') {\n for (var _i = 0, items_1 = items; _i < items_1.length; _i++) {\n var item = items_1[_i];\n if (item.textContent !== this.parent.localeObj.getConstant('addToValue')) {\n addClass([item], cls.MENU_DISABLE);\n }\n }\n }\n };\n PivotContextMenu.prototype.onSelectContextMenu = function (menu) {\n if (menu.element.textContent !== null) {\n var fieldName = this.fieldElement.getAttribute('data-uid');\n var dropClass = menu.item.id.replace('Context_', '').toLowerCase();\n this.parent.pivotCommon.dataSourceUpdate.updateDataSource(fieldName, dropClass, -1);\n this.parent.updateDataSource(true);\n this.fieldElement = undefined;\n }\n };\n /**\n * To destroy the pivot button event listener\n * @return {void}\n * @hidden\n */\n PivotContextMenu.prototype.destroy = function () {\n if (!this.parent.isDestroyed) {\n return;\n }\n if (this.menuObj && !this.menuObj.isDestroyed) {\n this.menuObj.destroy();\n }\n else {\n return;\n }\n };\n return PivotContextMenu;\n}());\nexport { PivotContextMenu };\n","import { EventHandler, setStyleAttribute } from '@syncfusion/ej2-base';\nimport { contentReady } from '../../common/base/constant';\nimport * as cls from '../../common/base/css-constant';\nimport { showSpinner, hideSpinner } from '@syncfusion/ej2-popups';\n/**\n * `VirtualScroll` module is used to handle scrolling behavior.\n */\nvar VirtualScroll = /** @class */ (function () {\n /**\n * Constructor for PivotView scrolling.\n * @hidden\n */\n function VirtualScroll(parent) {\n this.previousValues = { top: 0, left: 0 };\n this.frozenPreviousValues = { top: 0, left: 0 };\n this.eventType = '';\n this.parent = parent;\n this.addInternalEvents();\n }\n /**\n * It returns the Module name.\n * @returns string\n * @hidden\n */\n VirtualScroll.prototype.getModuleName = function () {\n return 'virtualscroll';\n };\n VirtualScroll.prototype.addInternalEvents = function () {\n this.parent.on(contentReady, this.wireEvents, this);\n };\n VirtualScroll.prototype.wireEvents = function () {\n var mCont = this.parent.element.querySelector('.' + cls.MOVABLECONTENT_DIV);\n var fCont = this.parent.element.querySelector('.' + cls.FROZENCONTENT_DIV);\n var mHdr = this.parent.element.querySelector('.' + cls.MOVABLEHEADER_DIV);\n EventHandler.clearEvents(mCont);\n EventHandler.clearEvents(fCont);\n if (this.parent.engineModule) {\n EventHandler.add(mCont, 'scroll touchmove pointermove', this.onHorizondalScroll(mHdr, mCont, fCont), this);\n EventHandler.add(mCont, 'scroll wheel touchmove pointermove', this.onVerticalScroll(fCont, mCont), this);\n EventHandler.add(mCont, 'mouseup touchend', this.common(mHdr, mCont, fCont), this);\n EventHandler.add(fCont, 'wheel', this.onWheelScroll(mCont, fCont), this);\n EventHandler.add(fCont, 'touchstart pointerdown', this.setPageXY(), this);\n EventHandler.add(fCont, 'touchmove pointermove', this.onTouchScroll(mHdr, mCont, fCont), this);\n EventHandler.add(mHdr, 'touchstart pointerdown', this.setPageXY(), this);\n EventHandler.add(mHdr, 'touchmove pointermove', this.onTouchScroll(mHdr, mCont, fCont), this);\n }\n this.parent.grid.isPreventScrollEvent = true;\n };\n VirtualScroll.prototype.onWheelScroll = function (mCont, fCont) {\n var _this = this;\n var element = mCont;\n return function (e) {\n var top = element.scrollTop + (e.deltaMode === 1 ? e.deltaY * 30 : e.deltaY);\n if (_this.frozenPreviousValues.top === top) {\n return;\n }\n e.preventDefault();\n fCont.scrollTop = top;\n element.scrollTop = top;\n _this.frozenPreviousValues.top = top;\n _this.eventType = e.type;\n };\n };\n VirtualScroll.prototype.getPointXY = function (e) {\n var pageXY = { x: 0, y: 0 };\n if (!(e.touches && e.touches.length)) {\n pageXY.x = e.pageX;\n pageXY.y = e.pageY;\n }\n else {\n pageXY.x = e.touches[0].pageX;\n pageXY.y = e.touches[0].pageY;\n }\n return pageXY;\n };\n VirtualScroll.prototype.onTouchScroll = function (mHdr, mCont, fCont) {\n var _this = this;\n var element = mCont;\n return function (e) {\n if (e.pointerType === 'mouse') {\n return;\n }\n var pageXY = _this.getPointXY(e);\n var top = element.scrollTop + (_this.pageXY.y - pageXY.y);\n var left = element.scrollLeft + (_this.pageXY.x - pageXY.x);\n if (_this.parent.element.querySelector('.' + cls.HEADERCONTENT).contains(e.target)) {\n if (_this.frozenPreviousValues.left === left || left < 0) {\n return;\n }\n mHdr.scrollLeft = left;\n element.scrollLeft = left;\n _this.pageXY.x = pageXY.x;\n _this.frozenPreviousValues.left = left;\n }\n else {\n if (_this.frozenPreviousValues.top === top || top < 0) {\n return;\n }\n fCont.scrollTop = top;\n element.scrollTop = top;\n _this.pageXY.y = pageXY.y;\n _this.frozenPreviousValues.top = top;\n }\n _this.eventType = e.type;\n };\n };\n VirtualScroll.prototype.update = function (mHdr, mCont, top, left, e) {\n if (this.direction === 'vertical') {\n var rowValues = this.parent.dataSource.valueAxis === 'row' ? this.parent.dataSource.values.length : 1;\n var exactSize = (this.parent.pageSettings.rowSize * rowValues * this.parent.gridSettings.rowHeight);\n var section = Math.ceil(top / exactSize);\n if (this.parent.scrollPosObject.vertical === section) {\n hideSpinner(this.parent.element);\n return;\n }\n showSpinner(this.parent.element);\n this.parent.scrollPosObject.vertical = section;\n this.parent.engineModule.pageSettings.rowCurrentPage = section > 1 ? section : 1;\n this.parent.engineModule.generateGridData(this.parent.dataSource, this.parent.engineModule.headerCollection);\n this.parent.pivotValues = this.parent.engineModule.pivotValues;\n var exactPage = Math.ceil(this.parent.engineModule.rowStartPos / (this.parent.pageSettings.rowSize * rowValues));\n var pos = exactSize * exactPage -\n (this.parent.engineModule.rowFirstLvl * rowValues * this.parent.gridSettings.rowHeight);\n this.parent.scrollPosObject.verticalSection = pos;\n }\n else {\n var colValues = this.parent.dataSource.valueAxis === 'column' ? this.parent.dataSource.values.length : 1;\n var exactSize = (this.parent.pageSettings.columnSize *\n colValues * this.parent.gridSettings.columnWidth);\n var section = Math.ceil(left / exactSize);\n if (this.parent.scrollPosObject.horizontal === section) {\n hideSpinner(this.parent.element);\n return;\n }\n showSpinner(this.parent.element);\n this.parent.scrollPosObject.horizontal = section;\n this.parent.engineModule.pageSettings.columnCurrentPage = section > 1 ? section : 1;\n this.parent.engineModule.generateGridData(this.parent.dataSource, this.parent.engineModule.headerCollection);\n // let isLastPage: boolean =\n // (this.parent.engineModule.pivotValues[0] as IAxisSet[])[this.parent.engineModule.pivotValues[0].length - 1].type\n // === 'grand sum' && section > 0;\n this.parent.pivotValues = this.parent.engineModule.pivotValues;\n var exactPage = Math.ceil(this.parent.engineModule.colStartPos / (this.parent.pageSettings.columnSize * colValues));\n // let pos: number = isLastPage ?\n // ((left + mHdr.clientWidth) - ((mHdr.querySelector('.' + cls.TABLE) as HTMLElement).offsetWidth)) :\n // exactSize * exactPage - (this.parent.engineModule.colFirstLvl *\n // colValues * this.parent.gridSettings.columnWidth);\n var pos = exactSize * exactPage - (this.parent.engineModule.colFirstLvl *\n colValues * this.parent.gridSettings.columnWidth);\n this.parent.scrollPosObject.horizontalSection = pos;\n }\n };\n VirtualScroll.prototype.setPageXY = function () {\n var _this = this;\n return function (e) {\n if (e.pointerType === 'mouse') {\n return;\n }\n _this.pageXY = _this.getPointXY(e);\n };\n };\n VirtualScroll.prototype.common = function (mHdr, mCont, fCont) {\n var _this = this;\n return function (e) {\n _this.update(mHdr, mCont, mCont.scrollTop * _this.parent.verticalScrollScale, mCont.scrollLeft * _this.parent.horizontalScrollScale, e);\n };\n };\n VirtualScroll.prototype.onHorizondalScroll = function (mHdr, mCont, fCont) {\n var _this = this;\n /* tslint:disable-next-line */\n var timeOutObj;\n return function (e) {\n var left = mCont.scrollLeft * _this.parent.horizontalScrollScale;\n if (e.type === 'wheel' || e.type === 'touchmove' || _this.eventType === 'wheel' || _this.eventType === 'touchmove') {\n clearTimeout(timeOutObj);\n /* tslint:disable */\n timeOutObj = setTimeout(function () {\n left = e.type === 'touchmove' ? mCont.scrollLeft : left;\n _this.update(mHdr, mCont, mCont.scrollTop * _this.parent.verticalScrollScale, left, e);\n }, 300);\n }\n if (_this.previousValues.left === left) {\n fCont.scrollTop = mCont.scrollTop;\n return;\n }\n _this.direction = 'horizondal';\n var horiOffset = -((left - _this.parent.scrollPosObject.horizontalSection - mCont.scrollLeft));\n var vertiOffset = mCont.querySelector('.' + cls.TABLE).style.transform.split(',')[1].trim();\n if (mCont.scrollLeft < _this.parent.scrollerBrowserLimit) {\n setStyleAttribute(mCont.querySelector('.e-table'), {\n transform: 'translate(' + horiOffset + 'px,' + vertiOffset\n });\n setStyleAttribute(mHdr.querySelector('.e-table'), {\n transform: 'translate(' + horiOffset + 'px,' + 0 + 'px)'\n });\n }\n var excessMove = _this.parent.scrollPosObject.horizontalSection > left ?\n -(_this.parent.scrollPosObject.horizontalSection - left) : ((left + mHdr.offsetWidth) -\n (_this.parent.scrollPosObject.horizontalSection + mCont.querySelector('.e-table').offsetWidth));\n var notLastPage = Math.ceil(_this.parent.scrollPosObject.horizontalSection / _this.parent.horizontalScrollScale) <\n _this.parent.scrollerBrowserLimit;\n if (_this.parent.scrollPosObject.horizontalSection > left ? true : (excessMove > 1 && notLastPage)) {\n // showSpinner(this.parent.element);\n if (left > mHdr.clientWidth) {\n if (_this.parent.scrollPosObject.left < 1) {\n _this.parent.scrollPosObject.left = mHdr.clientWidth;\n }\n _this.parent.scrollPosObject.left = _this.parent.scrollPosObject.left - 50;\n excessMove = _this.parent.scrollPosObject.horizontalSection > left ?\n (excessMove - _this.parent.scrollPosObject.left) : (excessMove + _this.parent.scrollPosObject.left);\n }\n else {\n excessMove = -_this.parent.scrollPosObject.horizontalSection;\n }\n horiOffset = -((left - (_this.parent.scrollPosObject.horizontalSection + excessMove) - mCont.scrollLeft));\n var vWidth = (_this.parent.gridSettings.columnWidth * _this.parent.engineModule.columnCount\n - _this.parent.grid.columns[0].width);\n if (vWidth > _this.parent.scrollerBrowserLimit) {\n _this.parent.horizontalScrollScale = vWidth / _this.parent.scrollerBrowserLimit;\n vWidth = _this.parent.scrollerBrowserLimit;\n }\n if (horiOffset > vWidth && horiOffset > left) {\n horiOffset = left;\n excessMove = 0;\n }\n setStyleAttribute(mCont.querySelector('.e-table'), {\n transform: 'translate(' + horiOffset + 'px,' + vertiOffset\n });\n setStyleAttribute(mHdr.querySelector('.e-table'), {\n transform: 'translate(' + horiOffset + 'px,' + 0 + 'px)'\n });\n _this.parent.scrollPosObject.horizontalSection = _this.parent.scrollPosObject.horizontalSection + excessMove;\n }\n _this.previousValues.left = left;\n _this.frozenPreviousValues.left = left;\n _this.eventType = '';\n mHdr.scrollLeft = mCont.scrollLeft;\n };\n };\n VirtualScroll.prototype.onVerticalScroll = function (fCont, mCont) {\n var _this = this;\n /* tslint:disable-next-line */\n var timeOutObj;\n return function (e) {\n var top = mCont.scrollTop * _this.parent.verticalScrollScale;\n if (e.type === 'wheel' || e.type === 'touchmove' || _this.eventType === 'wheel' || _this.eventType === 'touchmove') {\n clearTimeout(timeOutObj);\n /* tslint:disable */\n timeOutObj = setTimeout(function () {\n _this.update(null, mCont, mCont.scrollTop * _this.parent.verticalScrollScale, mCont.scrollLeft * _this.parent.horizontalScrollScale, e);\n }, 300);\n }\n if (_this.previousValues.top === top) {\n return;\n }\n _this.direction = 'vertical';\n var vertiOffset = -((top - _this.parent.scrollPosObject.verticalSection - mCont.scrollTop));\n var horiOffset = mCont.querySelector('.' + cls.TABLE).style.transform.split(',')[0].trim();\n if (mCont.scrollTop < _this.parent.scrollerBrowserLimit) {\n setStyleAttribute(fCont.querySelector('.e-table'), {\n transform: 'translate(' + 0 + 'px,' + vertiOffset + 'px)'\n });\n setStyleAttribute(mCont.querySelector('.e-table'), {\n transform: horiOffset + ',' + vertiOffset + 'px)'\n });\n }\n var excessMove = _this.parent.scrollPosObject.verticalSection > top ?\n -(_this.parent.scrollPosObject.verticalSection - top) : ((top + fCont.clientHeight) -\n (_this.parent.scrollPosObject.verticalSection + fCont.querySelector('.e-table').offsetHeight));\n var notLastPage = Math.ceil(_this.parent.scrollPosObject.verticalSection / _this.parent.verticalScrollScale) <\n _this.parent.scrollerBrowserLimit;\n if (_this.parent.scrollPosObject.verticalSection > top ? true : (excessMove > 1 && notLastPage)) {\n // showSpinner(this.parent.element);\n if (top > fCont.clientHeight) {\n if (_this.parent.scrollPosObject.top < 1) {\n _this.parent.scrollPosObject.top = fCont.clientHeight;\n }\n _this.parent.scrollPosObject.top = _this.parent.scrollPosObject.top - 50;\n excessMove = _this.parent.scrollPosObject.verticalSection > top ?\n (excessMove - _this.parent.scrollPosObject.top) : (excessMove + _this.parent.scrollPosObject.top);\n }\n else {\n excessMove = -_this.parent.scrollPosObject.verticalSection;\n }\n var movableTable = _this.parent.element.querySelector('.' + cls.MOVABLECONTENT_DIV).querySelector('.e-table');\n vertiOffset = -((top - (_this.parent.scrollPosObject.verticalSection + excessMove) - mCont.scrollTop));\n var vHeight = (_this.parent.gridSettings.rowHeight * _this.parent.engineModule.rowCount + 0.1\n - movableTable.clientHeight);\n if (vHeight > _this.parent.scrollerBrowserLimit) {\n _this.parent.verticalScrollScale = vHeight / _this.parent.scrollerBrowserLimit;\n vHeight = _this.parent.scrollerBrowserLimit;\n }\n if (vertiOffset > vHeight && vertiOffset > top) {\n vertiOffset = top;\n excessMove = 0;\n }\n setStyleAttribute(fCont.querySelector('.e-table'), {\n transform: 'translate(' + 0 + 'px,' + vertiOffset + 'px)'\n });\n setStyleAttribute(mCont.querySelector('.e-table'), {\n transform: horiOffset + ',' + vertiOffset + 'px)'\n });\n _this.parent.scrollPosObject.verticalSection = _this.parent.scrollPosObject.verticalSection + excessMove;\n }\n _this.previousValues.top = top;\n _this.frozenPreviousValues.top = top;\n _this.eventType = '';\n fCont.scrollTop = mCont.scrollTop;\n mCont.scrollTop = fCont.scrollTop;\n };\n };\n /**\n * @hidden\n */\n VirtualScroll.prototype.removeInternalEvents = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(contentReady, this.wireEvents);\n };\n /**\n * To destroy the virtualscrolling event listener\n * @return {void}\n * @hidden\n */\n VirtualScroll.prototype.destroy = function () {\n this.removeInternalEvents();\n };\n return VirtualScroll;\n}());\nexport { VirtualScroll };\n","import { Dialog } from '@syncfusion/ej2-popups';\nimport { createElement, setStyleAttribute, remove, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport * as cls from '../../common/base/css-constant';\nimport { Grid, Reorder, Resize, ColumnChooser, Toolbar } from '@syncfusion/ej2-grids';\nimport { VirtualScroll, Selection, Edit, Page, CommandColumn } from '@syncfusion/ej2-grids';\nimport * as events from '../../common/base/constant';\n/**\n * `DrillThroughDialog` module to create drill-through dialog.\n */\n/** @hidden */\nvar DrillThroughDialog = /** @class */ (function () {\n /**\n * Constructor for the dialog action.\n * @hidden\n */\n function DrillThroughDialog(parent) {\n this.isUpdated = false;\n this.gridIndexObjects = {};\n this.parent = parent;\n }\n /** @hidden */\n DrillThroughDialog.prototype.showDrillThroughDialog = function (eventArgs) {\n var _this = this;\n this.removeDrillThroughDialog();\n var drillThroughDialog = createElement('div', {\n id: this.parent.element.id + '_drillthrough',\n className: cls.DRILLTHROUGH_DIALOG,\n styles: 'visibility:hidden;'\n });\n this.parent.element.appendChild(drillThroughDialog);\n this.dialogPopUp = new Dialog({\n animationSettings: { effect: 'Fade' },\n allowDragging: false,\n header: this.parent.localeObj.getConstant('details'),\n content: this.createDrillThroughGrid(eventArgs),\n beforeOpen: function () {\n /* tslint:disable:align */\n _this.drillThroughGrid.setProperties({\n dataSource: _this.parent.editSettings.allowEditing ?\n _this.dataWithPrimarykey(eventArgs) : eventArgs.rawData, height: 300\n }, true);\n /* tslint:enable:align */\n _this.drillThroughGrid.enableVirtualization = !_this.parent.editSettings.allowEditing;\n },\n beforeClose: function () {\n if (_this.parent.editSettings.allowEditing && _this.isUpdated) {\n var count = Object.keys(_this.gridIndexObjects).length;\n var addItems = [];\n /* tslint:disable:no-string-literal */\n for (var _i = 0, _a = _this.drillThroughGrid.dataSource; _i < _a.length; _i++) {\n var item = _a[_i];\n if (isNullOrUndefined(item['__index']) || item['__index'] === '') {\n for (var _b = 0, _c = _this.parent.engineModule.fields; _b < _c.length; _b++) {\n var field = _c[_b];\n if (isNullOrUndefined(item[field])) {\n delete item[field];\n }\n }\n delete item['__index'];\n addItems.push(item);\n }\n else if (count > 0) {\n delete _this.gridIndexObjects[item['__index'].toString()];\n count--;\n }\n }\n count = 0;\n var items = [];\n for (var _d = 0, _e = _this.parent.dataSource.data; _d < _e.length; _d++) {\n var item = _e[_d];\n delete item['__index'];\n if (_this.gridIndexObjects[count.toString()] === undefined) {\n items.push(item);\n }\n count++;\n }\n /* tslint:enable:no-string-literal */\n items = items.concat(addItems);\n _this.parent.setProperties({ dataSource: { data: items } }, true);\n _this.parent.engineModule.updateGridData(_this.parent.dataSource);\n _this.parent.pivotValues = _this.parent.engineModule.pivotValues;\n }\n _this.isUpdated = false;\n _this.gridIndexObjects = {};\n },\n isModal: true,\n visible: true,\n showCloseIcon: true,\n locale: this.parent.locale,\n enableRtl: this.parent.enableRtl,\n width: this.parent.isAdaptive ? '100%' : '60%',\n position: { X: 'center', Y: 'center' },\n closeOnEscape: true,\n target: document.body,\n close: this.removeDrillThroughDialog.bind(this)\n });\n this.dialogPopUp.appendTo(drillThroughDialog);\n setStyleAttribute(this.dialogPopUp.element, { 'visibility': 'visible' });\n };\n DrillThroughDialog.prototype.removeDrillThroughDialog = function () {\n if (this.dialogPopUp && !this.dialogPopUp.isDestroyed) {\n this.dialogPopUp.destroy();\n }\n var dialogElement = document.getElementById(this.parent.element.id + '_drillthrough');\n if (dialogElement) {\n remove(dialogElement);\n }\n if (document.getElementById(this.parent.element.id + '_drillthroughgrid_ccdlg')) {\n remove(document.getElementById(this.parent.element.id + '_drillthroughgrid_ccdlg'));\n }\n };\n /* tslint:disable:max-func-body-length */\n DrillThroughDialog.prototype.createDrillThroughGrid = function (eventArgs) {\n var drillThroughBody = createElement('div', { id: this.parent.element.id + '_drillthroughbody', className: cls.DRILLTHROUGH_BODY_CLASS });\n var drillThroughBodyHeader = createElement('div', {\n id: this.parent.element.id +\n '_drillthroughbodyheader', className: cls.DRILLTHROUGH_BODY_HEADER_CONTAINER_CLASS\n });\n if (eventArgs.rowHeaders !== '') {\n drillThroughBodyHeader.innerHTML = '' +\n this.parent.localeObj.getConstant('row') + ' :' + eventArgs.rowHeaders + '';\n }\n if (eventArgs.columnHeaders !== '') {\n drillThroughBodyHeader.innerHTML = drillThroughBodyHeader.innerHTML + '' + this.parent.localeObj.getConstant('column') +\n ' :' +\n eventArgs.columnHeaders + '';\n }\n if (eventArgs.value !== '') {\n var measure = eventArgs.value.split('(')[0];\n var value = eventArgs.value.split('(')[1].split(')')[0];\n if (value !== '0') {\n drillThroughBodyHeader.innerHTML = drillThroughBodyHeader.innerHTML + '' +\n measure + ' :' + value + '';\n }\n }\n var toolbarItems = ['ColumnChooser'];\n if (this.parent.editSettings.allowEditing) {\n if (this.parent.editSettings.allowCommandColumns) {\n toolbarItems = ['ColumnChooser', 'Add'];\n }\n else if (this.parent.editSettings.mode === 'Batch') {\n toolbarItems = ['ColumnChooser', 'Add', 'Delete', 'Update', 'Cancel'];\n }\n else if (this.parent.editSettings.mode === 'Dialog') {\n toolbarItems = ['ColumnChooser', 'Add', 'Edit', 'Delete'];\n }\n else {\n toolbarItems = ['ColumnChooser', 'Add', 'Edit', 'Delete', 'Update', 'Cancel'];\n }\n }\n var drillThroughGrid = createElement('div', { id: this.parent.element.id + '_drillthroughgrid', className: cls.DRILLTHROUGH_GRID_CLASS });\n Grid.Inject(Selection, Reorder, Resize, Toolbar, ColumnChooser);\n this.drillThroughGrid = new Grid({\n gridLines: 'Default',\n allowResizing: true,\n allowReordering: true,\n showColumnChooser: true,\n toolbar: toolbarItems,\n columns: this.frameGridColumns(),\n locale: this.parent.locale,\n enableRtl: this.parent.enableRtl,\n enableVirtualization: this.parent.editSettings.allowEditing,\n allowPaging: this.parent.editSettings.allowEditing\n });\n var dialogModule = this;\n this.parent.trigger(events.beginDrillThrough, { cellInfo: eventArgs, gridObj: this.drillThroughGrid, type: 'editing' });\n if (this.parent.editSettings.allowEditing) {\n Grid.Inject(Edit, Page);\n this.drillThroughGrid.editSettings = this.parent.editSettings;\n if (this.parent.editSettings.allowCommandColumns) {\n this.drillThroughGrid.editSettings.mode = 'Normal';\n this.drillThroughGrid.editSettings.allowEditOnDblClick = false;\n Grid.Inject(CommandColumn);\n this.drillThroughGrid.columns.push({\n headerText: this.parent.localeObj.getConstant('manageRecords'), width: 160, showInColumnChooser: false,\n commands: [\n { type: 'Edit', buttonOption: { iconCss: ' e-icons e-edit', cssClass: 'e-flat' } },\n { type: 'Delete', buttonOption: { iconCss: 'e-icons e-delete', cssClass: 'e-flat' } },\n { type: 'Save', buttonOption: { iconCss: 'e-icons e-update', cssClass: 'e-flat' } },\n { type: 'Cancel', buttonOption: { iconCss: 'e-icons e-cancel-icon', cssClass: 'e-flat' } }\n ]\n });\n }\n else {\n this.drillThroughGrid.editSettings.allowEditOnDblClick = this.parent.editSettings.allowEditOnDblClick;\n }\n /* tslint:disable:align */\n this.drillThroughGrid.columns.push({\n field: '__index', visible: false, isPrimaryKey: true, type: 'string', showInColumnChooser: false\n });\n /* tslint:disable-next-line:no-any */\n this.drillThroughGrid.actionComplete = function (args) {\n if (args.requestType === 'batchsave' || args.requestType === 'save' || args.requestType === 'delete') {\n dialogModule.isUpdated = true;\n }\n if ((dialogModule.drillThroughGrid.editSettings.mode === 'Normal' && args.requestType === 'save' &&\n dialogModule.drillThroughGrid.element.querySelectorAll('.e-tbar-btn:hover').length > 0 &&\n !dialogModule.parent.editSettings.allowCommandColumns) || args.requestType === 'batchsave') {\n dialogModule.dialogPopUp.hide();\n }\n };\n this.drillThroughGrid.beforeBatchSave = function () {\n dialogModule.isUpdated = true;\n };\n /* tslint:enable:align */\n }\n else {\n Grid.Inject(VirtualScroll);\n }\n document.body.appendChild(drillThroughGrid);\n this.drillThroughGrid.appendTo(drillThroughGrid);\n drillThroughBody.appendChild(drillThroughBodyHeader);\n drillThroughBody.appendChild(drillThroughGrid);\n return drillThroughBody;\n };\n DrillThroughDialog.prototype.frameGridColumns = function () {\n var keys = Object.keys(this.parent.engineModule.fieldList);\n var columns = [];\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var key = keys_1[_i];\n if (this.parent.engineModule.fieldList[key].aggregateType !== 'CalculatedField') {\n var editType = '';\n if (this.parent.engineModule.fieldList[key].type === 'number') {\n editType = 'numericedit';\n }\n else if (this.parent.engineModule.fieldList[key].type === 'date') {\n editType = 'datepickeredit';\n }\n else {\n editType = '';\n }\n columns.push({\n field: key,\n headerText: this.parent.engineModule.fieldList[key].caption,\n width: 120,\n visible: this.parent.engineModule.fieldList[key].isSelected,\n validationRules: { required: true },\n editType: editType,\n type: 'string'\n });\n }\n }\n return columns;\n };\n DrillThroughDialog.prototype.dataWithPrimarykey = function (eventArgs) {\n var indexString = Object.keys(eventArgs.currentCell.indexObject);\n var rawData = eventArgs.rawData;\n var count = 0;\n for (var _i = 0, rawData_1 = rawData; _i < rawData_1.length; _i++) {\n var item = rawData_1[_i];\n /* tslint:disable-next-line:no-string-literal */\n item['__index'] = indexString[count];\n this.gridIndexObjects[indexString[count].toString()] = Number(indexString[count]);\n count++;\n }\n return rawData;\n };\n return DrillThroughDialog;\n}());\nexport { DrillThroughDialog };\n","import { contentReady } from '../../common/base/constant';\nimport * as events from '../../common/base/constant';\nimport { DrillThroughDialog } from '../../common/popups/drillthrough-dialog';\nimport { EventHandler } from '@syncfusion/ej2-base';\n/**\n * `DrillThrough` module.\n */\nvar DrillThrough = /** @class */ (function () {\n /**\n * Constructor.\n * @hidden\n */\n function DrillThrough(parent) {\n this.parent = parent;\n this.drillThroughDialog = new DrillThroughDialog(this.parent);\n this.addInternalEvents();\n }\n /**\n * It returns the Module name.\n * @returns string\n * @hidden\n */\n DrillThrough.prototype.getModuleName = function () {\n return 'drillthrough';\n };\n DrillThrough.prototype.addInternalEvents = function () {\n this.parent.on(contentReady, this.wireEvents, this);\n };\n DrillThrough.prototype.wireEvents = function () {\n this.unWireEvents();\n EventHandler.add(this.parent.element, 'dblclick', this.mouseClickHandler, this);\n };\n DrillThrough.prototype.unWireEvents = function () {\n EventHandler.remove(this.parent.element, 'dblclick', this.mouseClickHandler);\n };\n DrillThrough.prototype.mouseClickHandler = function (e) {\n var target = e.target;\n var ele = null;\n if (target.classList.contains('e-stackedheadercelldiv') || target.classList.contains('e-cellvalue') ||\n target.classList.contains('e-headercelldiv')) {\n ele = target.parentElement;\n }\n else if (target.classList.contains('e-headercell') || target.classList.contains('e-rowcell')) {\n ele = target;\n }\n else if (target.classList.contains('e-headertext')) {\n ele = target.parentElement.parentElement;\n }\n if (ele) {\n if (this.parent.allowDrillThrough && ele.classList.contains('e-valuescontent') || this.parent.editSettings.allowEditing) {\n this.executeDrillThrough(ele);\n }\n }\n };\n DrillThrough.prototype.executeDrillThrough = function (ele) {\n var colIndex = Number(ele.getAttribute('aria-colindex'));\n var rowIndex = Number(ele.getAttribute('index'));\n var pivotValue = this.parent.pivotValues[rowIndex][colIndex];\n var valueCaption = this.parent.engineModule.fieldList[pivotValue.actualText.toString()] ?\n this.parent.engineModule.fieldList[pivotValue.actualText.toString()].caption : pivotValue.actualText.toString();\n var rawData = [];\n if (pivotValue.rowHeaders !== undefined && pivotValue.columnHeaders !== undefined && pivotValue.value !== undefined) {\n var indexArray = Object.keys(pivotValue.indexObject);\n for (var _i = 0, indexArray_1 = indexArray; _i < indexArray_1.length; _i++) {\n var index = indexArray_1[_i];\n rawData.push(this.parent.dataSource.data[Number(index)]);\n }\n var aggType = this.parent.engineModule.fieldList[pivotValue.actualText].aggregateType;\n var valuetText = aggType === 'CalculatedField' ? valueCaption.toString() :\n (aggType + ' of ' + valueCaption);\n var eventArgs = {\n currentTarget: ele,\n currentCell: pivotValue,\n rawData: rawData,\n rowHeaders: pivotValue.rowHeaders === '' ? '' : pivotValue.rowHeaders.toString().split('.').join(' - '),\n columnHeaders: pivotValue.columnHeaders === '' ? '' : pivotValue.columnHeaders.toString().split('.').join(' - '),\n value: valuetText + '(' + pivotValue.formattedText + ')'\n };\n this.parent.trigger(events.drillThrough, eventArgs);\n this.drillThroughDialog.showDrillThroughDialog(eventArgs);\n }\n };\n return DrillThrough;\n}());\nexport { DrillThrough };\n","import * as events from '../../common/base/constant';\nimport * as cls from '../../common/base/css-constant';\nimport { Chart, ColumnSeries, LineSeries, Legend, Tooltip, Category, AreaSeries, StepLineSeries, SplineSeries, SplineAreaSeries, MultiColoredLineSeries, RangeAreaSeries, StackingAreaSeries, StepAreaSeries, MultiColoredAreaSeries, StackingColumnSeries, RangeColumnSeries, BarSeries, StackingBarSeries, ScatterSeries, BubbleSeries, PolarSeries, RadarSeries, MultiLevelLabel, ScrollBar, Zoom, ParetoSeries, Export, Crosshair } from '@syncfusion/ej2-charts';\nimport { createElement, remove } from '@syncfusion/ej2-base';\nvar PivotChart = /** @class */ (function () {\n function PivotChart() {\n this.headerColl = {};\n this.maxLevel = 0;\n this.columnGroupObject = {};\n }\n /**\n * Get component name.\n * @returns string\n * @private\n */\n PivotChart.prototype.getModuleName = function () {\n return 'pivotchart';\n };\n /* tslint:disable */\n PivotChart.prototype.loadChart = function (parent, chartSettings) {\n this.parent = parent;\n this.engineModule = this.parent.engineModule;\n this.dataSource = this.parent.dataSource;\n this.chartSettings = chartSettings;\n if (this.dataSource.values.length > 0) {\n if (this.chartSettings.enableMultiAxis) {\n this.measureList = this.dataSource.values.map(function (item) { return item.name; });\n }\n else {\n this.measureList = [chartSettings.value === '' ? this.dataSource.values[0].name : chartSettings.value];\n }\n }\n else if (this.parent.chart) {\n this.parent.chart.series = [];\n this.parent.chart.primaryXAxis.title = '';\n this.parent.chart.primaryYAxis.title = '';\n if (this.parent.chart.axes.length > 0) {\n this.parent.chart.axes[0].title = '';\n }\n this.parent.chart.primaryXAxis.zoomFactor = 1;\n this.parent.chart.refresh();\n return;\n }\n else {\n this.parent.notify(events.contentReady, {});\n return;\n }\n this.columnGroupObject = {};\n var pivotValues = this.parent.engineModule.pivotValues;\n this.currentMeasure = chartSettings.enableMultiAxis ? this.measureList[0] :\n (((chartSettings.value === '' || this.dataSource.values.filter(function (item) {\n return item.name === chartSettings.value;\n }).length === 0) && this.dataSource.values.length > 0) ? this.dataSource.values[0].name : chartSettings.value);\n var totColIndex = this.getColumnTotalIndex(pivotValues);\n var rKeys = Object.keys(pivotValues);\n var prevLevel;\n var indexCount = -0.5;\n this.headerColl = {};\n for (var _i = 0, rKeys_1 = rKeys; _i < rKeys_1.length; _i++) {\n var rKey = rKeys_1[_i];\n var rowIndex = Number(rKey);\n if (pivotValues[rowIndex][0] && pivotValues[rowIndex][0].axis === 'row' &&\n (this.dataSource.rows.length === 0 ? true : pivotValues[rowIndex][0].type !== 'grand sum')) {\n var firstRowCell = pivotValues[rowIndex][0];\n this.maxLevel = firstRowCell.level > this.maxLevel ? firstRowCell.level : this.maxLevel;\n if (!(prevLevel === undefined || prevLevel < firstRowCell.level)) {\n indexCount++;\n }\n prevLevel = firstRowCell.level;\n var name_1 = firstRowCell.actualText ? firstRowCell.actualText.toString() : firstRowCell.formattedText.toString();\n var caption = firstRowCell.hasChild ? ((firstRowCell.isDrilled ? ' - ' : ' + ') + name_1) : name_1;\n var cellInfo = {\n name: name_1,\n text: caption,\n levelName: firstRowCell.valueSort['levelName'].toString(),\n level: firstRowCell.level,\n fieldName: firstRowCell.valueSort['axis'] ? firstRowCell.valueSort['axis'].toString() : ''\n };\n if (this.headerColl[indexCount]) {\n this.headerColl[indexCount][firstRowCell.level] = cellInfo;\n }\n else {\n this.headerColl[indexCount] = {};\n this.headerColl[indexCount][firstRowCell.level] = cellInfo;\n }\n var rows = pivotValues[rowIndex];\n var cKeys = Object.keys(rows);\n for (var _a = 0, cKeys_1 = cKeys; _a < cKeys_1.length; _a++) {\n var cKey = cKeys_1[_a];\n var cellIndex = Number(cKey);\n var cell = pivotValues[rowIndex][cellIndex];\n if (!totColIndex[cell.colIndex] && cell.axis === 'value' &&\n (chartSettings.enableMultiAxis ? true : cell.actualText === this.currentMeasure)) {\n if (firstRowCell.isDrilled) {\n break;\n }\n var columnSeries = cell.columnHeaders.toString().split('.').join(' - ') + ' | ' + cell.actualText;\n if (this.columnGroupObject[columnSeries]) {\n this.columnGroupObject[columnSeries].push({\n x: this.dataSource.rows.length === 0 ? firstRowCell.formattedText :\n cell.rowHeaders.toString().split('.').join(' - '),\n y: Number(cell.value)\n });\n }\n else {\n this.columnGroupObject[columnSeries] = [{\n x: this.dataSource.rows.length === 0 ? firstRowCell.formattedText :\n cell.rowHeaders.toString().split('.').join(' - '),\n y: Number(cell.value)\n }];\n }\n }\n }\n }\n }\n this.refreshChart();\n };\n /**\n * Refreshing chart based on the updated chartSettings.\n * @returns void\n */\n PivotChart.prototype.refreshChart = function () {\n this.chartSeries = [];\n var columnKeys = Object.keys(this.columnGroupObject);\n this.persistSettings = JSON.parse(this.parent.getPersistData()).chartSettings;\n for (var _i = 0, columnKeys_1 = columnKeys; _i < columnKeys_1.length; _i++) {\n var key = columnKeys_1[_i];\n var currentSeries = {};\n currentSeries = this.persistSettings.chartSeries ? this.frameObjectWithKeys(this.persistSettings.chartSeries) : currentSeries;\n currentSeries.dataSource = this.columnGroupObject[key];\n currentSeries.xName = 'x';\n currentSeries.yName = 'y';\n currentSeries.name = this.chartSettings.enableMultiAxis ? key : key.split(' | ')[0];\n if (!(this.chartSettings.chartSeries.type === 'Polar' || this.chartSettings.chartSeries.type === 'Radar')) {\n currentSeries.yAxisName = key.split(' | ')[1];\n }\n this.chartSeries = this.chartSeries.concat(currentSeries);\n }\n var seriesEvent = { series: this.chartSeries, cancel: false };\n this.parent.trigger(events.chartSeriesCreated, seriesEvent);\n if (!seriesEvent.cancel) {\n this.bindChart();\n }\n else {\n if (this.element) {\n remove(this.element);\n }\n this.parent.notify(events.contentReady, {});\n }\n };\n PivotChart.prototype.frameObjectWithKeys = function (series) {\n var keys = Object.keys(series);\n var keyPos = 0;\n var framedSeries = {};\n while (keyPos < keys.length) {\n framedSeries[keys[keyPos]] = series[keys[keyPos]];\n keyPos++;\n }\n return framedSeries;\n };\n PivotChart.prototype.bindChart = function () {\n var currentXAxis = this.configXAxis();\n var currentTooltipSettings = this.configTooltipSettings();\n var currentLegendSettings = this.configLegendSettings();\n var currentZoomSettings = this.configZoomSettings();\n var axesWithRows = this.frameAxesWithRows();\n var type = this.chartSettings.chartSeries.type;\n if (this.parent.displayOption.view === 'Both') {\n this.element = this.parent.displayOption.primary === 'Chart' ? (this.parent.element.insertBefore((!this.element ? (createElement('div', {\n className: cls.PIVOTCHART, id: this.parent.element.id + '_chart'\n })) : this.element), this.parent.element.querySelector('.' + cls.GRID_CLASS))) :\n (this.parent.element.appendChild(!this.element ? (createElement('div', {\n className: cls.PIVOTCHART, id: this.parent.element.id + '_chart'\n })) : this.element));\n }\n else if (!this.element) {\n this.element = this.parent.element.appendChild(createElement('div', {\n className: cls.PIVOTCHART, id: this.parent.element.id + '_chart'\n }));\n }\n if (!this.parent.chart) {\n if (this.parent.showGroupingBar) {\n this.element.style.minWidth = '400px !important';\n }\n else {\n this.element.style.minWidth = '310px !important';\n }\n Chart.Inject(ColumnSeries, StackingColumnSeries, RangeColumnSeries, BarSeries, StackingBarSeries, ScatterSeries, BubbleSeries, LineSeries, StepLineSeries, SplineSeries, SplineAreaSeries, MultiColoredLineSeries, PolarSeries, RadarSeries, AreaSeries, RangeAreaSeries, StackingAreaSeries, StepAreaSeries, MultiColoredAreaSeries, ParetoSeries, Legend, Tooltip, Category, MultiLevelLabel, ScrollBar, Zoom, Export, Crosshair);\n this.parent.chart = new Chart({\n series: this.chartSeries,\n legendSettings: currentLegendSettings,\n tooltip: currentTooltipSettings,\n zoomSettings: currentZoomSettings,\n axes: (type === 'Polar' || type === 'Radar') ? [] : axesWithRows.axes,\n rows: (type === 'Polar' || type === 'Radar') ? [{}] : axesWithRows.rows,\n primaryYAxis: (type === 'Polar' || type === 'Radar') ? axesWithRows.axes[0] : { visible: false },\n primaryXAxis: currentXAxis,\n width: this.parent.width.toString(),\n height: this.parent.height.toString(),\n title: this.chartSettings.title,\n titleStyle: this.chartSettings.titleStyle,\n subTitle: this.chartSettings.subTitle,\n subTitleStyle: this.chartSettings.subTitleStyle,\n margin: this.chartSettings.margin,\n border: this.chartSettings.border,\n background: this.chartSettings.background,\n chartArea: this.chartSettings.chartArea,\n palettes: this.chartSettings.palettes,\n theme: this.chartSettings.theme,\n crosshair: this.chartSettings.crosshair,\n selectionMode: this.chartSettings.selectionMode,\n isMultiSelect: this.chartSettings.isMultiSelect,\n enableExport: this.chartSettings.enableExport,\n selectedDataIndexes: this.chartSettings.selectedDataIndexes,\n isTransposed: this.chartSettings.isTransposed,\n enableAnimation: this.chartSettings.enableAnimation,\n description: this.chartSettings.description,\n tabIndex: this.chartSettings.tabIndex,\n locale: this.parent.locale,\n enableSideBySidePlacement: this.chartSettings.enableSideBySidePlacement,\n beforePrint: this.chartSettings.beforePrint ? this.chartSettings.beforePrint.bind(this) : undefined,\n animationComplete: this.chartSettings.animationComplete ? this.chartSettings.animationComplete.bind(this) : undefined,\n legendRender: this.chartSettings.legendRender ? this.chartSettings.legendRender.bind(this) : undefined,\n textRender: this.chartSettings.textRender ? this.chartSettings.textRender.bind(this) : undefined,\n pointRender: this.chartSettings.pointRender ? this.chartSettings.pointRender.bind(this) : undefined,\n seriesRender: this.chartSettings.seriesRender ? this.chartSettings.seriesRender.bind(this) : undefined,\n chartMouseMove: this.chartSettings.chartMouseMove ? this.chartSettings.chartMouseMove.bind(this) : undefined,\n chartMouseClick: this.chartSettings.chartMouseClick ? this.chartSettings.chartMouseClick.bind(this) : undefined,\n pointMove: this.chartSettings.pointMove ? this.chartSettings.pointMove.bind(this) : undefined,\n pointClick: this.chartSettings.pointClick ? this.chartSettings.pointClick.bind(this) : undefined,\n chartMouseLeave: this.chartSettings.chartMouseLeave ? this.chartSettings.chartMouseLeave.bind(this) : undefined,\n chartMouseDown: this.chartSettings.chartMouseDown ? this.chartSettings.chartMouseDown.bind(this) : undefined,\n chartMouseUp: this.chartSettings.chartMouseUp ? this.chartSettings.chartMouseUp.bind(this) : undefined,\n dragComplete: this.chartSettings.dragComplete ? this.chartSettings.dragComplete.bind(this) : undefined,\n zoomComplete: this.chartSettings.zoomComplete ? this.chartSettings.zoomComplete.bind(this) : undefined,\n scrollStart: this.chartSettings.scrollStart ? this.chartSettings.scrollStart.bind(this) : undefined,\n scrollEnd: this.chartSettings.scrollEnd ? this.chartSettings.scrollEnd.bind(this) : undefined,\n scrollChanged: this.chartSettings.scrollChanged ? this.chartSettings.scrollChanged.bind(this) : undefined,\n tooltipRender: this.tooltipRender.bind(this),\n loaded: this.loaded.bind(this),\n load: this.load.bind(this),\n resized: this.resized.bind(this),\n axisLabelRender: this.axisLabelRender.bind(this)\n }, '#' + this.parent.element.id + '_chart');\n }\n else {\n this.parent.chart.series = this.chartSeries;\n this.parent.chart.primaryXAxis = currentXAxis;\n if (type === 'Polar' || type === 'Radar') {\n this.parent.chart.primaryYAxis.visible = true;\n this.parent.chart.primaryYAxis = axesWithRows.axes[0];\n this.parent.chart.axes = [];\n this.parent.chart.rows = [{}];\n }\n else {\n this.parent.chart.primaryYAxis.visible = false;\n this.parent.chart.axes = axesWithRows.axes;\n this.parent.chart.rows = axesWithRows.rows;\n }\n this.parent.chart.refresh();\n }\n };\n PivotChart.prototype.frameAxesWithRows = function () {\n var _this = this;\n var axes = [];\n var rows = [];\n var percentChart = this.persistSettings.chartSeries && (this.persistSettings.chartSeries.type === 'StackingColumn100' ||\n this.persistSettings.chartSeries.type === 'StackingBar100' ||\n this.persistSettings.chartSeries.type === 'StackingArea100');\n if (this.chartSettings.enableMultiAxis) {\n var valCnt = 0;\n var divider = (100 / this.dataSource.values.length) + '%';\n var _loop_1 = function (item) {\n var measureField = this_1.engineModule.fieldList[item.name];\n var measureAggregatedName = this_1.parent.localeObj.getConstant(measureField.aggregateType) + ' of ' + measureField.caption;\n var formatSetting = this_1.dataSource.formatSettings.filter(function (itm) {\n return itm.name === item.name;\n })[0];\n var resFormat = (this_1.chartSettings.chartSeries.type === 'Polar' || this_1.chartSettings.chartSeries.type === 'Radar') ? true : false;\n var currentYAxis = {};\n currentYAxis = this_1.persistSettings.primaryYAxis ?\n this_1.frameObjectWithKeys(this_1.persistSettings.primaryYAxis) : currentYAxis;\n currentYAxis.labelFormat = currentYAxis.labelFormat ?\n currentYAxis.labelFormat : (percentChart ? '' : (formatSetting && !resFormat ? formatSetting.format : 'N'));\n currentYAxis.title = currentYAxis.title ? currentYAxis.title : measureAggregatedName;\n currentYAxis.plotOffset = currentYAxis.plotOffset ? currentYAxis.plotOffset : (valCnt % 2 !== 0 ? 30 : 0);\n currentYAxis.rowIndex = valCnt;\n if (!resFormat) {\n currentYAxis.name = item.name;\n }\n axes = axes.concat(currentYAxis);\n rows.push({ height: divider });\n valCnt++;\n };\n var this_1 = this;\n for (var _i = 0, _a = this.dataSource.values; _i < _a.length; _i++) {\n var item = _a[_i];\n _loop_1(item);\n }\n }\n else {\n var measureField = this.engineModule.fieldList[this.currentMeasure];\n var measureAggregatedName = this.parent.localeObj.getConstant(measureField.aggregateType) + ' of ' +\n measureField.caption;\n var formatSetting = this.dataSource.formatSettings.filter(function (item) {\n return item.name === _this.currentMeasure;\n })[0];\n var currentYAxis = {};\n currentYAxis = this.persistSettings.primaryYAxis ? this.frameObjectWithKeys(this.persistSettings.primaryYAxis) : currentYAxis;\n currentYAxis.rowIndex = 0;\n if (!(this.chartSettings.chartSeries.type === 'Polar' || this.chartSettings.chartSeries.type === 'Radar')) {\n currentYAxis.name = this.currentMeasure;\n }\n currentYAxis.labelFormat = currentYAxis.labelFormat ? currentYAxis.labelFormat : (percentChart ? '' : (formatSetting ?\n formatSetting.format : 'N'));\n currentYAxis.title = currentYAxis.title ? currentYAxis.title : measureAggregatedName;\n axes = axes.concat(currentYAxis);\n rows.push({ height: '100%' });\n }\n return { axes: axes, rows: rows };\n };\n PivotChart.prototype.getColumnTotalIndex = function (pivotValues) {\n var colIndexColl = {};\n var rKeys = Object.keys(pivotValues);\n for (var _i = 0, rKeys_2 = rKeys; _i < rKeys_2.length; _i++) {\n var rowIndex = rKeys_2[_i];\n var rows = pivotValues[Number(rowIndex)];\n var cKeys = Object.keys(rows);\n for (var _a = 0, cKeys_2 = cKeys; _a < cKeys_2.length; _a++) {\n var cellIndex = cKeys_2[_a];\n var cell = rows[Number(cellIndex)];\n if (cell.axis !== 'column') {\n return colIndexColl;\n }\n else if ((cell.type === 'sum' || (this.dataSource.columns.length === 0 ? false : cell.type === 'grand sum'))\n && cell.rowSpan !== -1) {\n colIndexColl[cell.colIndex] = cell.colIndex;\n }\n }\n }\n return colIndexColl;\n };\n // The commented lines will be utilized once we get the requested requirement(of multi-level labels) from chart team.\n // private frameMultiLevelLabels(): MultiLevelLabelsModel[] {\n // let startKeys: string[] = Object.keys(this.headerColl);\n // let parentHeaders: RowHeaderLevelGrouping = this.headerColl[-0.5];\n // for (let startKey of startKeys) {\n // let sKey: number = Number(startKey);\n // let headers = this.headerColl[sKey];\n // let levelPos: number = 0;\n // let isAvail: boolean = false;\n // while (levelPos <= this.maxLevel) {\n // if (!isAvail) {\n // if (!headers[levelPos]) {\n // headers[levelPos] = parentHeaders[levelPos];\n // } else {\n // isAvail = true;\n // }\n // } else if (!headers[levelPos]) {\n // headers[levelPos] = {\n // name: headers[levelPos - 1].name,\n // text: headers[levelPos - 1].text,\n // levelName: headers[levelPos - 1].levelName,\n // level: headers[levelPos - 1].level,\n // fieldName: headers[levelPos - 1].fieldName,\n // span: -1\n // };\n // headers[levelPos - 1].span = 0;\n // }\n // levelPos++;\n // }\n // parentHeaders = this.headerColl[sKey];\n // }\n // let gRows: { [key: number]: any } = {};\n // for (let startKey of startKeys) {\n // let sKey: number = Number(startKey);\n // let headers = this.headerColl[sKey];\n // let lKeys: string[] = Object.keys(headers);\n // for (let levelKey of lKeys) {\n // let lKey: number = Number(levelKey);\n // if (gRows[lKey]) {\n // let len: number = gRows[lKey].length;\n // if (headers[lKey].levelName === parentHeaders[lKey].levelName) {\n // gRows[lKey][len - 1].end = gRows[lKey][len - 1].end as number + 1;\n // } else {\n // gRows[lKey].push({ start: sKey, end: sKey + 1, text: headers[lKey].text, customAttributes: headers[lKey] });\n // }\n // } else {\n // gRows[lKey] = [{ start: sKey, end: sKey + 1, text: headers[lKey].text, customAttributes: headers[lKey] }];\n // }\n // }\n // parentHeaders = headers;\n // }\n // let levellength: number = Object.keys(gRows).length;\n // let multiLevelLabels: MultiLevelLabelsModel[] = [];\n // for (let level: number = levellength - 1; level > -1; level--) {\n // multiLevelLabels.push({ categories: gRows[level] });\n // }\n // return multiLevelLabels;\n // }\n PivotChart.prototype.getZoomFactor = function () {\n if (!isNaN(Number(this.parent.width))) {\n this.calculatedWidth = Number(this.parent.width);\n }\n else if (this.parent.width.indexOf('%') > -1) {\n this.calculatedWidth = this.parent.element.clientWidth * (parseFloat(this.parent.width) / 100);\n }\n else if (this.parent.width.indexOf('px') > -1) {\n this.calculatedWidth = Number(this.parent.width.toString().split('px')[0]);\n }\n else {\n this.calculatedWidth = this.parent.element.clientWidth;\n }\n var seriesLength = (this.chartSeries.length * 10) > 120 ? (this.chartSeries.length * 10) : 120;\n var zoomFactor = this.chartSeries.length > 0 ?\n (this.calculatedWidth / (Object.keys(this.chartSeries[0].dataSource).length * seriesLength)) : 1;\n zoomFactor = (zoomFactor < 1 && zoomFactor > 0) ? zoomFactor : 1;\n return zoomFactor;\n };\n PivotChart.prototype.configTooltipSettings = function () {\n var tooltip = this.chartSettings.tooltip;\n tooltip.enable = tooltip.enable === undefined ? true : tooltip.enable;\n tooltip.header = tooltip.header ? tooltip.header : '';\n tooltip.enableMarker = tooltip.enableMarker === undefined ? true : tooltip.enableMarker;\n return tooltip;\n };\n PivotChart.prototype.configLegendSettings = function () {\n var legendSettings = {};\n legendSettings = this.chartSettings.legendSettings ? this.chartSettings.legendSettings : legendSettings;\n legendSettings.padding = legendSettings.padding ? legendSettings.padding : 25;\n legendSettings.shapePadding = legendSettings.shapePadding ? legendSettings.shapePadding : 10;\n return legendSettings;\n };\n PivotChart.prototype.configXAxis = function () {\n var currentXAxis = {};\n currentXAxis = this.persistSettings.primaryXAxis ? this.frameObjectWithKeys(this.persistSettings.primaryXAxis) : currentXAxis;\n currentXAxis.valueType = 'Category';\n currentXAxis.labelIntersectAction = currentXAxis.labelIntersectAction ? currentXAxis.labelIntersectAction : 'Rotate45';\n currentXAxis.title = currentXAxis.title ? currentXAxis.title :\n this.dataSource.rows.map(function (args) { return args.caption || args.name; }).join(' / ');\n currentXAxis.zoomFactor = this.getZoomFactor();\n return currentXAxis;\n };\n PivotChart.prototype.configZoomSettings = function () {\n var zoomSettings = this.chartSettings.zoomSettings;\n zoomSettings.enableSelectionZooming = zoomSettings.enableSelectionZooming === undefined ? true : zoomSettings.enableSelectionZooming;\n zoomSettings.enableScrollbar = zoomSettings.enableScrollbar === undefined ? true : zoomSettings.enableScrollbar;\n return zoomSettings;\n };\n PivotChart.prototype.tooltipRender = function (args) {\n var measureField = this.engineModule.fieldList[args.series.yAxisName ? (args.series.yAxisName.split('_CumulativeAxis')[0]) :\n (this.chartSettings.enableMultiAxis ? args.series.name.split(' | ')[1] : this.currentMeasure)];\n var measureAggregatedName = this.parent.localeObj.getConstant(measureField.aggregateType) + ' of ' + measureField.caption;\n args.text = measureAggregatedName + ': ' + this.parent.engineModule.getFormattedValue(args.point.y, measureField.id).formattedText + '
' +\n (this.dataSource.columns.length === 0 ? '' :\n this.parent.localeObj.getConstant('column') + ': ' + args.series.name.split(' | ')[0] + '
') +\n (this.dataSource.rows.length === 0 ? '' :\n this.parent.localeObj.getConstant('row') + ': ' + args.point.x);\n this.parent.trigger(events.chartTooltipRender, args);\n };\n // The commented lines will be utilized once we get the requested requirement(of multi-level labels) from chart team.\n PivotChart.prototype.loaded = function (args) {\n this.parent.isChartLoaded = true;\n if (this.parent.chart && this.parent.showGroupingBar && this.parent.groupingBarModule &&\n this.parent.showFieldList && this.parent.currentView === 'Chart') {\n this.parent.groupingBarModule.alignIcon();\n }\n // if (this.chartSettings.showMultiLevelLabels) {\n // this.parent.element.querySelector(\n // \"#\" + this.parent.element.id + \"_chartXAxisMultiLevelLabel0\").setAttribute('cursor', 'pointer');\n // }\n this.parent.notify(events.contentReady, {});\n this.parent.trigger(events.chartLoaded, args);\n };\n // The commented lines will be utilized once we get the requested requirement(of multi-level labels) from chart team.\n PivotChart.prototype.axisLabelRender = function (args) {\n // if (this.chartSettings.showMultiLevelLabels) {\n // if (args.axis.name === 'primaryXAxis') {\n // args.text = '';\n // }\n // }\n this.parent.trigger(events.chartAxisLabelRender, args);\n };\n PivotChart.prototype.load = function (args) {\n if (args.chart.zoomModule) {\n args.chart.zoomModule.isZoomed = true;\n }\n this.parent.trigger(events.chartLoad, args);\n };\n PivotChart.prototype.resized = function (args) {\n args.chart.primaryXAxis.zoomFactor = this.getZoomFactor();\n this.parent.trigger(events.chartResized, args);\n };\n /**\n * To destroy the chart module\n * @returns void\n * @hidden\n */\n /* tslint:disable:no-empty */\n PivotChart.prototype.destroy = function () {\n };\n return PivotChart;\n}());\nexport { PivotChart };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty, Event, Complex, Collection } from '@syncfusion/ej2-base';\nimport { Border, ErrorBarSettings } from '@syncfusion/ej2-charts';\nimport { Trendline, EmptyPointSettings } from '@syncfusion/ej2-charts';\nimport { CornerRadius, ChartSegment, Animation } from '@syncfusion/ej2-charts';\nimport { Theme, Font, Margin } from '@syncfusion/ej2-charts';\nimport { ChartArea, CrosshairSettings } from '@syncfusion/ej2-charts';\nimport { Indexes } from '@syncfusion/ej2-charts';\nimport { MajorTickLines, MinorTickLines, MajorGridLines } from '@syncfusion/ej2-charts';\nimport { MarkerSettings } from '@syncfusion/ej2-charts';\nimport { MinorGridLines, AxisLine, StripLineSettings, LabelBorder } from '@syncfusion/ej2-charts';\nimport { CrosshairTooltip } from '@syncfusion/ej2-charts';\n/**\n * Configures the series in charts.\n */\nvar PivotSeries = /** @class */ (function (_super) {\n __extends(PivotSeries, _super);\n function PivotSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], PivotSeries.prototype, \"fill\", void 0);\n __decorate([\n Complex(null, Animation)\n ], PivotSeries.prototype, \"animation\", void 0);\n __decorate([\n Property('0')\n ], PivotSeries.prototype, \"dashArray\", void 0);\n __decorate([\n Property(1)\n ], PivotSeries.prototype, \"width\", void 0);\n __decorate([\n Property('X')\n ], PivotSeries.prototype, \"segmentAxis\", void 0);\n __decorate([\n Property('Line')\n ], PivotSeries.prototype, \"drawType\", void 0);\n __decorate([\n Property(true)\n ], PivotSeries.prototype, \"isClosed\", void 0);\n __decorate([\n Collection([], ChartSegment)\n ], PivotSeries.prototype, \"segments\", void 0);\n __decorate([\n Property('')\n ], PivotSeries.prototype, \"stackingGroup\", void 0);\n __decorate([\n Complex({ color: 'transparent', width: 0 }, Border)\n ], PivotSeries.prototype, \"border\", void 0);\n __decorate([\n Property(true)\n ], PivotSeries.prototype, \"visible\", void 0);\n __decorate([\n Property(1)\n ], PivotSeries.prototype, \"opacity\", void 0);\n __decorate([\n Property('Line')\n ], PivotSeries.prototype, \"type\", void 0);\n __decorate([\n Complex(null, MarkerSettings)\n ], PivotSeries.prototype, \"marker\", void 0);\n __decorate([\n Complex(null, ErrorBarSettings)\n ], PivotSeries.prototype, \"errorBar\", void 0);\n __decorate([\n Property(true)\n ], PivotSeries.prototype, \"enableTooltip\", void 0);\n __decorate([\n Collection([], Trendline)\n ], PivotSeries.prototype, \"trendlines\", void 0);\n __decorate([\n Property('')\n ], PivotSeries.prototype, \"tooltipMappingName\", void 0);\n __decorate([\n Property('SeriesType')\n ], PivotSeries.prototype, \"legendShape\", void 0);\n __decorate([\n Property(1)\n ], PivotSeries.prototype, \"minRadius\", void 0);\n __decorate([\n Property(null)\n ], PivotSeries.prototype, \"selectionStyle\", void 0);\n __decorate([\n Property('Natural')\n ], PivotSeries.prototype, \"splineType\", void 0);\n __decorate([\n Property(3)\n ], PivotSeries.prototype, \"maxRadius\", void 0);\n __decorate([\n Property(0.5)\n ], PivotSeries.prototype, \"cardinalSplineTension\", void 0);\n __decorate([\n Property(null)\n ], PivotSeries.prototype, \"columnWidth\", void 0);\n __decorate([\n Complex(null, EmptyPointSettings)\n ], PivotSeries.prototype, \"emptyPointSettings\", void 0);\n __decorate([\n Complex(null, CornerRadius)\n ], PivotSeries.prototype, \"cornerRadius\", void 0);\n __decorate([\n Property(0)\n ], PivotSeries.prototype, \"columnSpacing\", void 0);\n return PivotSeries;\n}(ChildProperty));\nexport { PivotSeries };\n/**\n * Configures the axes in charts.\n */\nvar PivotAxis = /** @class */ (function (_super) {\n __extends(PivotAxis, _super);\n function PivotAxis() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Rotate45')\n ], PivotAxis.prototype, \"labelIntersectAction\", void 0);\n __decorate([\n Complex(Theme.axisLabelFont, Font)\n ], PivotAxis.prototype, \"labelStyle\", void 0);\n __decorate([\n Property('')\n ], PivotAxis.prototype, \"title\", void 0);\n __decorate([\n Complex({}, CrosshairTooltip)\n ], PivotAxis.prototype, \"crosshairTooltip\", void 0);\n __decorate([\n Property('')\n ], PivotAxis.prototype, \"labelFormat\", void 0);\n __decorate([\n Complex(Theme.axisTitleFont, Font)\n ], PivotAxis.prototype, \"titleStyle\", void 0);\n __decorate([\n Property(false)\n ], PivotAxis.prototype, \"isIndexed\", void 0);\n __decorate([\n Property(0)\n ], PivotAxis.prototype, \"plotOffset\", void 0);\n __decorate([\n Property('None')\n ], PivotAxis.prototype, \"edgeLabelPlacement\", void 0);\n __decorate([\n Property('BetweenTicks')\n ], PivotAxis.prototype, \"labelPlacement\", void 0);\n __decorate([\n Property('Outside')\n ], PivotAxis.prototype, \"tickPosition\", void 0);\n __decorate([\n Property(false)\n ], PivotAxis.prototype, \"opposedPosition\", void 0);\n __decorate([\n Property(true)\n ], PivotAxis.prototype, \"visible\", void 0);\n __decorate([\n Property('Outside')\n ], PivotAxis.prototype, \"labelPosition\", void 0);\n __decorate([\n Property(0)\n ], PivotAxis.prototype, \"labelRotation\", void 0);\n __decorate([\n Property(0)\n ], PivotAxis.prototype, \"minorTicksPerInterval\", void 0);\n __decorate([\n Property(null)\n ], PivotAxis.prototype, \"maximum\", void 0);\n __decorate([\n Property(null)\n ], PivotAxis.prototype, \"minimum\", void 0);\n __decorate([\n Property(34)\n ], PivotAxis.prototype, \"maximumLabelWidth\", void 0);\n __decorate([\n Property(null)\n ], PivotAxis.prototype, \"interval\", void 0);\n __decorate([\n Complex({}, MajorTickLines)\n ], PivotAxis.prototype, \"majorTickLines\", void 0);\n __decorate([\n Property(false)\n ], PivotAxis.prototype, \"enableTrim\", void 0);\n __decorate([\n Complex({}, MajorGridLines)\n ], PivotAxis.prototype, \"majorGridLines\", void 0);\n __decorate([\n Complex({}, MinorTickLines)\n ], PivotAxis.prototype, \"minorTickLines\", void 0);\n __decorate([\n Complex({}, AxisLine)\n ], PivotAxis.prototype, \"lineStyle\", void 0);\n __decorate([\n Complex({}, MinorGridLines)\n ], PivotAxis.prototype, \"minorGridLines\", void 0);\n __decorate([\n Property(false)\n ], PivotAxis.prototype, \"isInversed\", void 0);\n __decorate([\n Property(null)\n ], PivotAxis.prototype, \"description\", void 0);\n __decorate([\n Property(0)\n ], PivotAxis.prototype, \"startAngle\", void 0);\n __decorate([\n Property(100)\n ], PivotAxis.prototype, \"coefficient\", void 0);\n __decorate([\n Collection([], StripLineSettings)\n ], PivotAxis.prototype, \"stripLines\", void 0);\n __decorate([\n Property(2)\n ], PivotAxis.prototype, \"tabIndex\", void 0);\n __decorate([\n Complex({ color: null, width: 0, type: 'Rectangle' }, LabelBorder)\n ], PivotAxis.prototype, \"border\", void 0);\n return PivotAxis;\n}(ChildProperty));\nexport { PivotAxis };\n/**\n * Configures the ToolTips in the chart.\n */\nvar PivotTooltipSettings = /** @class */ (function (_super) {\n __extends(PivotTooltipSettings, _super);\n function PivotTooltipSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], PivotTooltipSettings.prototype, \"enableMarker\", void 0);\n __decorate([\n Property(true)\n ], PivotTooltipSettings.prototype, \"enable\", void 0);\n __decorate([\n Property(null)\n ], PivotTooltipSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(false)\n ], PivotTooltipSettings.prototype, \"shared\", void 0);\n __decorate([\n Property(0.75)\n ], PivotTooltipSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property(null)\n ], PivotTooltipSettings.prototype, \"header\", void 0);\n __decorate([\n Property(null)\n ], PivotTooltipSettings.prototype, \"format\", void 0);\n __decorate([\n Complex(Theme.tooltipLabelFont, Font)\n ], PivotTooltipSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property(null)\n ], PivotTooltipSettings.prototype, \"template\", void 0);\n __decorate([\n Complex({ color: '#cccccc', width: 0.5 }, Border)\n ], PivotTooltipSettings.prototype, \"border\", void 0);\n __decorate([\n Property(true)\n ], PivotTooltipSettings.prototype, \"enableAnimation\", void 0);\n return PivotTooltipSettings;\n}(ChildProperty));\nexport { PivotTooltipSettings };\n/**\n * Configures the zooming behavior for the chart.\n */\nvar PivotZoomSettings = /** @class */ (function (_super) {\n __extends(PivotZoomSettings, _super);\n function PivotZoomSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], PivotZoomSettings.prototype, \"enablePinchZooming\", void 0);\n __decorate([\n Property(true)\n ], PivotZoomSettings.prototype, \"enableSelectionZooming\", void 0);\n __decorate([\n Property(false)\n ], PivotZoomSettings.prototype, \"enableDeferredZooming\", void 0);\n __decorate([\n Property(false)\n ], PivotZoomSettings.prototype, \"enableMouseWheelZooming\", void 0);\n __decorate([\n Property('XY')\n ], PivotZoomSettings.prototype, \"mode\", void 0);\n __decorate([\n Property(['Zoom', 'ZoomIn', 'ZoomOut', 'Pan', 'Reset'])\n ], PivotZoomSettings.prototype, \"toolbarItems\", void 0);\n __decorate([\n Property(true)\n ], PivotZoomSettings.prototype, \"enableScrollbar\", void 0);\n __decorate([\n Property(false)\n ], PivotZoomSettings.prototype, \"enablePan\", void 0);\n return PivotZoomSettings;\n}(ChildProperty));\nexport { PivotZoomSettings };\n/**\n * Configures the chart settings.\n */\nvar ChartSettings = /** @class */ (function (_super) {\n __extends(ChartSettings, _super);\n function ChartSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Complex({}, PivotSeries)\n ], ChartSettings.prototype, \"chartSeries\", void 0);\n __decorate([\n Complex({}, PivotAxis)\n ], ChartSettings.prototype, \"primaryXAxis\", void 0);\n __decorate([\n Complex({}, PivotAxis)\n ], ChartSettings.prototype, \"primaryYAxis\", void 0);\n __decorate([\n Property('')\n ], ChartSettings.prototype, \"value\", void 0);\n __decorate([\n Property(false)\n ], ChartSettings.prototype, \"enableMultiAxis\", void 0);\n __decorate([\n Complex(Theme.chartTitleFont, Font)\n ], ChartSettings.prototype, \"titleStyle\", void 0);\n __decorate([\n Property('')\n ], ChartSettings.prototype, \"title\", void 0);\n __decorate([\n Complex(Theme.chartSubTitleFont, Font)\n ], ChartSettings.prototype, \"subTitleStyle\", void 0);\n __decorate([\n Property('')\n ], ChartSettings.prototype, \"subTitle\", void 0);\n __decorate([\n Complex({ color: '#DDDDDD', width: 0 }, Border)\n ], ChartSettings.prototype, \"border\", void 0);\n __decorate([\n Complex({}, Margin)\n ], ChartSettings.prototype, \"margin\", void 0);\n __decorate([\n Complex({ border: { color: null, width: 0.5 }, background: 'transparent' }, ChartArea)\n ], ChartSettings.prototype, \"chartArea\", void 0);\n __decorate([\n Property(null)\n ], ChartSettings.prototype, \"background\", void 0);\n __decorate([\n Property('Material')\n ], ChartSettings.prototype, \"theme\", void 0);\n __decorate([\n Property([])\n ], ChartSettings.prototype, \"palettes\", void 0);\n __decorate([\n Complex({}, CrosshairSettings)\n ], ChartSettings.prototype, \"crosshair\", void 0);\n __decorate([\n Complex({}, PivotTooltipSettings)\n ], ChartSettings.prototype, \"tooltip\", void 0);\n __decorate([\n Complex({}, PivotZoomSettings)\n ], ChartSettings.prototype, \"zoomSettings\", void 0);\n __decorate([\n Property()\n ], ChartSettings.prototype, \"legendSettings\", void 0);\n __decorate([\n Property('None')\n ], ChartSettings.prototype, \"selectionMode\", void 0);\n __decorate([\n Property(true)\n ], ChartSettings.prototype, \"enableExport\", void 0);\n __decorate([\n Property(false)\n ], ChartSettings.prototype, \"isMultiSelect\", void 0);\n __decorate([\n Collection([], Indexes)\n ], ChartSettings.prototype, \"selectedDataIndexes\", void 0);\n __decorate([\n Property(true)\n ], ChartSettings.prototype, \"enableAnimation\", void 0);\n __decorate([\n Property(false)\n ], ChartSettings.prototype, \"isTransposed\", void 0);\n __decorate([\n Property(1)\n ], ChartSettings.prototype, \"tabIndex\", void 0);\n __decorate([\n Property(null)\n ], ChartSettings.prototype, \"description\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"resized\", void 0);\n __decorate([\n Property(true)\n ], ChartSettings.prototype, \"enableSideBySidePlacement\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"loaded\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"beforePrint\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"animationComplete\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"load\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"textRender\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"legendRender\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"seriesRender\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"pointRender\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"tooltipRender\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"axisLabelRender\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"chartMouseClick\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"chartMouseMove\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"pointMove\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"pointClick\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"chartMouseDown\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"chartMouseLeave\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"dragComplete\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"chartMouseUp\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"scrollStart\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"zoomComplete\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"scrollChanged\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"scrollEnd\", void 0);\n return ChartSettings;\n}(ChildProperty));\nexport { ChartSettings };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, Browser, Component, createElement, setStyleAttribute, setCurrencyCode } from '@syncfusion/ej2-base';\nimport { EventHandler, Complex, extend, ChildProperty, Collection, isNullOrUndefined, remove } from '@syncfusion/ej2-base';\nimport { Internationalization, L10n, NotifyPropertyChanges, compile } from '@syncfusion/ej2-base';\nimport { removeClass, addClass, Event } from '@syncfusion/ej2-base';\nimport { PivotEngine } from '../../base/engine';\nimport { Tooltip, createSpinner, showSpinner, hideSpinner } from '@syncfusion/ej2-popups';\nimport * as events from '../../common/base/constant';\nimport * as cls from '../../common/base/css-constant';\nimport { Render } from '../renderer/render';\nimport { DataSource } from '../model/dataSource';\nimport { GridSettings } from '../model/gridsettings';\nimport { Grid, Reorder, Resize } from '@syncfusion/ej2-grids';\nimport { ExcelExport } from '../actions/excel-export';\nimport { PDFExport } from '../actions/pdf-export';\nimport { KeyboardInteraction } from '../actions/keyboard';\nimport { PivotContextMenu } from '../../common/popups/context-menu';\nimport { DataManager, Query } from '@syncfusion/ej2-data';\nimport { VirtualScroll } from '../actions/virtualscroll';\nimport { DrillThrough } from '../actions/drill-through';\nimport { PivotUtil } from '../../base/util';\nimport { PivotChart } from '../../pivotchart/index';\nimport { ChartSettings } from '../model/chartsettings';\n/**\n * It holds the settings of Grouping Bar.\n */\nvar GroupingBarSettings = /** @class */ (function (_super) {\n __extends(GroupingBarSettings, _super);\n function GroupingBarSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], GroupingBarSettings.prototype, \"showFilterIcon\", void 0);\n __decorate([\n Property(true)\n ], GroupingBarSettings.prototype, \"showSortIcon\", void 0);\n __decorate([\n Property(true)\n ], GroupingBarSettings.prototype, \"showRemoveIcon\", void 0);\n __decorate([\n Property(true)\n ], GroupingBarSettings.prototype, \"showValueTypeIcon\", void 0);\n __decorate([\n Property('Both')\n ], GroupingBarSettings.prototype, \"displayMode\", void 0);\n __decorate([\n Property(true)\n ], GroupingBarSettings.prototype, \"allowDragAndDrop\", void 0);\n return GroupingBarSettings;\n}(ChildProperty));\nexport { GroupingBarSettings };\n/**\n * Configures the edit behavior of the Grid.\n */\nvar CellEditSettings = /** @class */ (function (_super) {\n __extends(CellEditSettings, _super);\n function CellEditSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], CellEditSettings.prototype, \"allowAdding\", void 0);\n __decorate([\n Property(false)\n ], CellEditSettings.prototype, \"allowEditing\", void 0);\n __decorate([\n Property(false)\n ], CellEditSettings.prototype, \"allowDeleting\", void 0);\n __decorate([\n Property(false)\n ], CellEditSettings.prototype, \"allowCommandColumns\", void 0);\n __decorate([\n Property('Normal')\n ], CellEditSettings.prototype, \"mode\", void 0);\n __decorate([\n Property(true)\n ], CellEditSettings.prototype, \"allowEditOnDblClick\", void 0);\n __decorate([\n Property(true)\n ], CellEditSettings.prototype, \"showConfirmDialog\", void 0);\n __decorate([\n Property(false)\n ], CellEditSettings.prototype, \"showDeleteConfirmDialog\", void 0);\n return CellEditSettings;\n}(ChildProperty));\nexport { CellEditSettings };\n/**\n * Configures the conditional based hyper link settings.\n */\nvar ConditionalSettings = /** @class */ (function (_super) {\n __extends(ConditionalSettings, _super);\n function ConditionalSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], ConditionalSettings.prototype, \"measure\", void 0);\n __decorate([\n Property()\n ], ConditionalSettings.prototype, \"label\", void 0);\n __decorate([\n Property('NotEquals')\n ], ConditionalSettings.prototype, \"conditions\", void 0);\n __decorate([\n Property()\n ], ConditionalSettings.prototype, \"value1\", void 0);\n __decorate([\n Property()\n ], ConditionalSettings.prototype, \"value2\", void 0);\n return ConditionalSettings;\n}(ChildProperty));\nexport { ConditionalSettings };\n/**\n * It holds the settings of Hyperlink.\n */\nvar HyperlinkSettings = /** @class */ (function (_super) {\n __extends(HyperlinkSettings, _super);\n function HyperlinkSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], HyperlinkSettings.prototype, \"showHyperlink\", void 0);\n __decorate([\n Property(false)\n ], HyperlinkSettings.prototype, \"showRowHeaderHyperlink\", void 0);\n __decorate([\n Property(false)\n ], HyperlinkSettings.prototype, \"showColumnHeaderHyperlink\", void 0);\n __decorate([\n Property(false)\n ], HyperlinkSettings.prototype, \"showValueCellHyperlink\", void 0);\n __decorate([\n Property(false)\n ], HyperlinkSettings.prototype, \"showSummaryCellHyperlink\", void 0);\n __decorate([\n Collection([], ConditionalSettings)\n ], HyperlinkSettings.prototype, \"conditionalSettings\", void 0);\n __decorate([\n Property()\n ], HyperlinkSettings.prototype, \"headerText\", void 0);\n __decorate([\n Property('')\n ], HyperlinkSettings.prototype, \"cssClass\", void 0);\n return HyperlinkSettings;\n}(ChildProperty));\nexport { HyperlinkSettings };\n/**\n * It holds the option for configure the chart and grid view.\n */\nvar DisplayOption = /** @class */ (function (_super) {\n __extends(DisplayOption, _super);\n function DisplayOption() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Table')\n ], DisplayOption.prototype, \"view\", void 0);\n __decorate([\n Property('Table')\n ], DisplayOption.prototype, \"primary\", void 0);\n return DisplayOption;\n}(ChildProperty));\nexport { DisplayOption };\n/**\n * Represents the PivotView component.\n * ```html\n * \n * \n * ```\n */\nvar PivotView = /** @class */ (function (_super) {\n __extends(PivotView, _super);\n /**\n * Constructor for creating the widget\n * @param {PivotViewModel} options?\n * @param {string|HTMLElement} element?\n */\n function PivotView(options, element) {\n var _this_1 = _super.call(this, options, element) || this;\n /** @hidden */\n _this_1.verticalScrollScale = 1;\n /** @hidden */\n _this_1.horizontalScrollScale = 1;\n /** @hidden */\n _this_1.scrollerBrowserLimit = 500000;\n /** @hidden */\n _this_1.lastSortInfo = {};\n /** @hidden */\n _this_1.lastFilterInfo = {};\n /** @hidden */\n _this_1.lastAggregationInfo = {};\n /** @hidden */\n _this_1.lastCalcFieldInfo = {};\n _this_1.shiftLockedPos = [];\n _this_1.savedSelectedCellsPos = [];\n _this_1.isPopupClicked = false;\n _this_1.isMouseDown = false;\n _this_1.isMouseUp = false;\n _this_1.defaultItems = {};\n _this_1.isCellBoxMultiSelection = false;\n /** @hidden */\n _this_1.gridHeaderCellInfo = [];\n /** @hidden */\n _this_1.rowRangeSelection = { enable: false, startIndex: 0, endIndex: 0 };\n /** @hidden */\n _this_1.resizeInfo = {};\n /** @hidden */\n _this_1.scrollPosObject = {\n vertical: 0, horizontal: 0, verticalSection: 0,\n horizontalSection: 0, top: 0, left: 0, scrollDirection: { direction: '', position: 0 }\n };\n /** @hidden */\n _this_1.pivotColumns = [];\n /** @hidden */\n _this_1.totColWidth = 0;\n /** @hidden */\n _this_1.posCount = 0;\n /** @hidden */\n _this_1.isModified = false;\n _this_1.needsID = true;\n _this_1.pivotView = _this_1;\n _this_1.engineModule = new PivotEngine();\n return _this_1;\n }\n PivotView_1 = PivotView;\n /**\n * To provide the array of modules needed for control rendering\n * @return {ModuleDeclaration[]}\n * @hidden\n */\n PivotView.prototype.requiredModules = function () {\n var modules = [];\n var isCommonRequire;\n if (this.allowConditionalFormatting) {\n modules.push({ args: [this], member: 'conditionalformatting' });\n }\n if (this.allowCalculatedField) {\n isCommonRequire = true;\n modules.push({ args: [this], member: 'calculatedfield' });\n }\n if (this.showGroupingBar) {\n isCommonRequire = true;\n modules.push({ args: [this], member: 'grouping' });\n }\n if (this.showToolbar && this.toolbar.length > 0) {\n isCommonRequire = true;\n modules.push({ args: [this], member: 'toolbar' });\n }\n if (this.showFieldList) {\n isCommonRequire = true;\n modules.push({ args: [this], member: 'fieldlist' });\n }\n if (this.allowExcelExport) {\n modules.push({ args: [this], member: 'excelExport' });\n }\n if (this.allowPdfExport) {\n modules.push({ args: [this], member: 'pdfExport' });\n }\n if (this.enableVirtualization) {\n modules.push({ args: [this], member: 'virtualscroll' });\n }\n if (this.gridSettings) {\n if (this.gridSettings.contextMenuItems) {\n isCommonRequire = true;\n }\n }\n if (isCommonRequire) {\n modules.push({ args: [this], member: 'common' });\n }\n return modules;\n };\n /**\n * For internal use only - Initializing internal properties;\n * @private\n */\n PivotView.prototype.preRender = function () {\n this.initProperties();\n this.isAdaptive = Browser.isDevice;\n this.renderToolTip();\n this.renderContextMenu();\n this.keyboardModule = new KeyboardInteraction(this);\n this.contextMenuModule = new PivotContextMenu(this);\n this.globalize = new Internationalization(this.locale);\n this.defaultLocale = {\n grandTotal: 'Grand Total',\n total: 'Total',\n value: 'Value',\n noValue: 'No value',\n row: 'Row',\n column: 'Column',\n collapse: 'Collapse',\n expand: 'Expand',\n rowAxisPrompt: 'Drop row here',\n columnAxisPrompt: 'Drop column here',\n valueAxisPrompt: 'Drop value here',\n filterAxisPrompt: 'Drop filter here',\n filter: 'Filter',\n filtered: 'Filtered',\n sort: 'Sort',\n filters: 'Filters',\n rows: 'Rows',\n columns: 'Columns',\n values: 'Values',\n close: 'Close',\n cancel: 'Cancel',\n delete: 'Delete',\n calculatedField: 'Calculated Field',\n createCalculatedField: 'Create Calculated Field',\n fieldName: 'Enter the field name',\n error: 'Error',\n invalidFormula: 'Invalid formula.',\n dropText: 'Example: (\"Sum(Order_Count)\" + \"Sum(In_Stock)\") * 250',\n dropTextMobile: 'Add fields and edit formula here.',\n dropAction: 'Calculated field cannot be place in any other region except value axis.',\n alert: 'Alert',\n warning: 'Warning',\n ok: 'OK',\n search: 'Search',\n drag: 'Drag',\n remove: 'Remove',\n sum: 'Sum',\n average: 'Average',\n count: 'Count',\n min: 'Min',\n max: 'Max',\n allFields: 'All Fields',\n formula: 'Formula',\n addToRow: 'Add to Row',\n addToColumn: 'Add to Column',\n addToValue: 'Add to Value',\n addToFilter: 'Add to Filter',\n emptyData: 'No records to display',\n fieldExist: 'A field already exists in this name. Please enter a different name.',\n confirmText: 'A calculation field already exists in this name. Do you want to replace it?',\n noMatches: 'No matches',\n format: 'Summaries values by',\n edit: 'Edit',\n clear: 'Clear',\n formulaField: 'Drag and drop fields to formula',\n dragField: 'Drag field to formula',\n clearFilter: 'Clear',\n by: 'by',\n all: 'All',\n multipleItems: 'Multiple items',\n /* tslint:disable */\n member: 'Member',\n label: 'Label',\n date: 'Date',\n enterValue: 'Enter value',\n chooseDate: 'Enter date',\n Before: 'Before',\n BeforeOrEqualTo: 'Before Or Equal To',\n After: 'After',\n AfterOrEqualTo: 'After Or Equal To',\n labelTextContent: 'Show the items for which the label',\n dateTextContent: 'Show the items for which the date',\n valueTextContent: 'Show the items for which',\n Equals: 'Equals',\n DoesNotEquals: 'Does Not Equal',\n BeginWith: 'Begins With',\n DoesNotBeginWith: 'Does Not Begin With',\n EndsWith: 'Ends With',\n DoesNotEndsWith: 'Does Not End With',\n Contains: 'Contains',\n DoesNotContains: 'Does Not Contain',\n GreaterThan: 'Greater Than',\n GreaterThanOrEqualTo: 'Greater Than Or Equal To',\n LessThan: 'Less Than',\n LessThanOrEqualTo: 'Less Than Or Equal To',\n Between: 'Between',\n NotBetween: 'Not Between',\n And: 'and',\n Sum: 'Sum',\n Count: 'Count',\n DistinctCount: 'Distinct Count',\n Product: 'Product',\n Avg: 'Avg',\n Min: 'Min',\n SampleVar: 'Sample Var',\n PopulationVar: 'Population Var',\n RunningTotals: 'Running Totals',\n Max: 'Max',\n Index: 'Index',\n SampleStDev: 'Sample StDev',\n PopulationStDev: 'Population StDev',\n PercentageOfRowTotal: '% of Row Total',\n PercentageOfParentTotal: '% of Parent Total',\n PercentageOfParentColumnTotal: '% of Parent Column Total',\n PercentageOfParentRowTotal: '% of Parent Row Total',\n DifferenceFrom: 'Difference From',\n PercentageOfDifferenceFrom: '% of Difference From',\n PercentageOfGrandTotal: '% of Grand Total',\n PercentageOfColumnTotal: '% of Column Total',\n /* tslint:enable */\n NotEquals: 'Not Equals',\n AllValues: 'All Values',\n conditionalFormating: 'Conditional Formatting',\n apply: 'APPLY',\n condition: 'Add Condition',\n formatLabel: 'Format',\n valueFieldSettings: 'Value field settings',\n baseField: 'Base field :',\n baseItem: 'Base item :',\n summarizeValuesBy: 'Summarize values by :',\n sourceName: 'Field name :',\n sourceCaption: 'Field caption :',\n example: 'e.g:',\n editorDataLimitMsg: ' more items. Search to refine further.',\n details: 'Details',\n manageRecords: 'Manage Records',\n Years: 'Years',\n Quarters: 'Quarters',\n Months: 'Months',\n Days: 'Days',\n Hours: 'Hours',\n Minutes: 'Minutes',\n Seconds: 'Seconds',\n save: 'Save a report',\n new: 'Create a new report',\n load: 'Load',\n saveAs: 'Save as current report',\n rename: 'Rename a current report',\n deleteReport: 'Delete a current report',\n export: 'Export',\n subTotals: 'Sub totals',\n grandTotals: 'Grand totals',\n reportName: 'Report Name :',\n pdf: 'PDF',\n excel: 'Excel',\n csv: 'CSV',\n showSubTotals: 'Show sub totals',\n doNotShowSubTotals: 'Do not show sub totals',\n showSubTotalsRowsOnly: 'Show sub totals rows only',\n showSubTotalsColumnsOnly: 'Show sub totals columns only',\n showGrandTotals: 'Show grand totals',\n doNotShowGrandTotals: 'Do not show grand totals',\n showGrandTotalsRowsOnly: 'Show grand totals rows only',\n showGrandTotalsColumnsOnly: 'Show grand totals columns only',\n fieldList: 'Show fieldlist',\n grid: 'Show table',\n toolbarFormatting: 'Conditional formatting',\n chart: 'Chart',\n reportMsg: 'Please enter vaild report name!!!',\n reportList: 'Report list',\n removeConfirm: 'Are you sure want to delete this report?',\n emptyReport: 'No reports found!!',\n bar: 'Bar',\n line: 'Line',\n area: 'Area',\n scatter: 'Scatter',\n polar: 'Polar',\n of: 'of',\n emptyFormat: 'No format found!!!',\n emptyInput: 'Enter a value',\n newReportConfirm: 'Want to save changes to report?',\n emptyReportName: 'Enter a report name'\n };\n this.localeObj = new L10n(this.getModuleName(), this.defaultLocale, this.locale);\n this.isDragging = false;\n this.addInternalEvents();\n setCurrencyCode(this.currencyCode);\n };\n PivotView.prototype.onBeforeTooltipOpen = function (args) {\n args.element.classList.add('e-pivottooltipwrap');\n };\n PivotView.prototype.renderToolTip = function () {\n if (this.showTooltip) {\n this.tooltip = new Tooltip({\n target: 'td.e-valuescontent',\n showTipPointer: false,\n enableRtl: this.enableRtl,\n beforeRender: this.setToolTip.bind(this),\n beforeOpen: this.onBeforeTooltipOpen\n });\n this.tooltip.appendTo(this.element);\n }\n else if (this.tooltip) {\n this.tooltip.destroy();\n }\n };\n /** @hidden */\n PivotView.prototype.renderContextMenu = function () {\n if (this.gridSettings.contextMenuItems) {\n var conmenuItems = [];\n var customItems = [];\n var exportItems = [];\n var aggItems = [];\n var expItems = [];\n var aggregateItems = [];\n for (var _i = 0, _a = this.gridSettings.contextMenuItems; _i < _a.length; _i++) {\n var item = _a[_i];\n if (typeof item === 'string' && this.getDefaultItems().indexOf(item) !== -1) {\n if (item.toString().toLowerCase().indexOf('aggregate') !== -1) {\n aggregateItems = [\n { text: 'Sum', id: 'AggSum' },\n { text: 'Distinct Count', id: 'AggDistinctCount' },\n { text: 'Count', id: 'AggCount' },\n { text: 'Product', id: 'AggProduct' },\n { text: 'Avg', id: 'AggAvg' },\n { text: 'Max', id: 'AggMax' },\n { text: 'Min', id: 'AggMin' },\n { text: 'More...', id: 'AggMoreOption' }\n ];\n }\n else if (item.toString().toLowerCase().indexOf('export') !== -1) {\n exportItems.push(this.buildDefaultItems(item));\n }\n else {\n conmenuItems.push(this.buildDefaultItems(item));\n }\n }\n else if (typeof item !== 'string') {\n customItems.push(item);\n }\n }\n if (aggregateItems.length > 0) {\n var aggregateGroup = this.buildDefaultItems('Aggregate');\n aggregateGroup.items = aggregateItems;\n aggItems.push(aggregateGroup);\n }\n if (exportItems.length > 0) {\n var exportGroupItems = this.buildDefaultItems('export');\n exportGroupItems.items = exportItems;\n expItems.push(exportGroupItems);\n }\n this.gridSettings.contextMenuItems = [];\n Array.prototype.push.apply(this.gridSettings.contextMenuItems, aggItems);\n Array.prototype.push.apply(this.gridSettings.contextMenuItems, conmenuItems);\n Array.prototype.push.apply(this.gridSettings.contextMenuItems, expItems);\n Array.prototype.push.apply(this.gridSettings.contextMenuItems, customItems);\n }\n };\n PivotView.prototype.getDefaultItems = function () {\n return ['Drillthrough', 'Expand',\n 'Collapse', 'Pdf Export', 'Excel Export', 'Csv Export', 'Sort Ascending', 'Sort Descending',\n 'Aggregate', 'CalculatedField'];\n };\n PivotView.prototype.buildDefaultItems = function (item) {\n var menuItem;\n switch (item) {\n case 'Aggregate':\n menuItem = { text: 'Aggregate', target: 'th.e-valuesheader,td.e-valuescontent,.e-stot', id: 'aggregate' };\n break;\n case 'CalculatedField':\n menuItem = { text: 'Calculated Field', target: 'td.e-valuescontent', id: 'CalculatedField' };\n break;\n case 'Drillthrough':\n menuItem = {\n text: 'Drill Through', target: 'td.e-valuescontent',\n id: 'drillthrough', iconCss: cls.PIVOTVIEW_GRID + ' ' + cls.ICON\n };\n break;\n case 'export':\n menuItem = {\n text: 'Export', target: 'td.e-valuescontent',\n id: 'exporting', iconCss: cls.PIVOTVIEW_EXPORT + ' ' + cls.ICON\n };\n break;\n case 'Pdf Export':\n menuItem = { text: 'PDF', id: 'pdf', iconCss: cls.GRID_PDF_EXPORT + ' ' + cls.ICON };\n break;\n case 'Excel Export':\n menuItem = { text: 'Excel', id: 'excel', iconCss: cls.GRID_EXCEL_EXPORT + ' ' + cls.ICON };\n break;\n case 'Csv Export':\n menuItem = { text: 'CSV', id: 'csv', iconCss: cls.GRID_CSV_EXPORT + ' ' + cls.ICON, };\n break;\n case 'Expand':\n menuItem = {\n text: 'Expand', target: 'td.e-rowsheader,.e-columnsheader',\n id: 'expand', iconCss: cls.PIVOTVIEW_EXPAND + ' ' + cls.ICON\n };\n break;\n case 'Collapse':\n menuItem = {\n text: 'Collapse', target: 'td.e-rowsheader,.e-columnsheader',\n id: 'collapse', iconCss: cls.PIVOTVIEW_COLLAPSE + ' ' + cls.ICON\n };\n break;\n case 'Sort Ascending':\n menuItem = {\n text: 'Ascending', target: 'th.e-valuesheader,.e-stot',\n id: 'sortasc', iconCss: cls.ICON_ASC + ' ' + cls.ICON\n };\n break;\n case 'Sort Descending':\n menuItem = {\n text: 'Descending', target: 'th.e-valuesheader,.e-stot',\n id: 'sortdesc', iconCss: cls.ICON_DESC + ' ' + cls.ICON\n };\n break;\n }\n this.defaultItems[item] = {\n text: menuItem.text, id: menuItem.id,\n target: menuItem.target, iconCss: menuItem.iconCss\n };\n return this.defaultItems[item];\n };\n /* tslint:disable:align */\n PivotView.prototype.initProperties = function () {\n this.setProperties({ pivotValues: [] }, true);\n this.queryCellInfo = this.gridSettings.queryCellInfo ? this.gridSettings.queryCellInfo.bind(this) : undefined;\n this.headerCellInfo = this.gridSettings.headerCellInfo ? this.gridSettings.headerCellInfo.bind(this) : undefined;\n this.resizing = this.gridSettings.resizing ? this.gridSettings.resizing.bind(this) : undefined;\n this.resizeStop = this.gridSettings.resizeStop ? this.gridSettings.resizeStop.bind(this) : undefined;\n this.pdfHeaderQueryCellInfo = this.gridSettings.pdfHeaderQueryCellInfo ?\n this.gridSettings.pdfHeaderQueryCellInfo.bind(this) : undefined;\n this.pdfQueryCellInfo = this.gridSettings.pdfQueryCellInfo ? this.gridSettings.pdfQueryCellInfo.bind(this) : undefined;\n this.excelHeaderQueryCellInfo = this.gridSettings.excelHeaderQueryCellInfo ?\n this.gridSettings.excelHeaderQueryCellInfo.bind(this) : undefined;\n this.excelQueryCellInfo = this.gridSettings.excelQueryCellInfo ?\n this.gridSettings.excelQueryCellInfo.bind(this) : undefined;\n this.columnDragStart = this.gridSettings.columnDragStart ? this.gridSettings.columnDragStart.bind(this) : undefined;\n this.columnDrag = this.gridSettings.columnDrag ? this.gridSettings.columnDrag.bind(this) : undefined;\n this.columnDrop = this.gridSettings.columnDrop ? this.gridSettings.columnDrop.bind(this) : undefined;\n this.beforeColumnsRender = this.gridSettings.columnRender ? this.gridSettings.columnRender : undefined;\n this.selected = this.gridSettings.cellSelected ? this.gridSettings.cellSelected : undefined;\n this.cellDeselected = this.gridSettings.cellDeselected ? this.gridSettings.cellDeselected : undefined;\n this.rowSelected = this.gridSettings.rowSelected ? this.gridSettings.rowSelected : undefined;\n this.rowDeselected = this.gridSettings.rowDeselected ? this.gridSettings.rowDeselected : undefined;\n this.chartTooltipRender = this.chartSettings.tooltipRender ? this.chartSettings.tooltipRender : undefined;\n this.chartLoaded = this.chartSettings.loaded ? this.chartSettings.loaded : undefined;\n this.chartLoad = this.chartSettings.load ? this.chartSettings.load : undefined;\n this.chartResized = this.chartSettings.resized ? this.chartSettings.resized : undefined;\n this.chartAxisLabelRender = this.chartSettings.axisLabelRender ? this.chartSettings.axisLabelRender : undefined;\n this.contextMenuClick = this.gridSettings.contextMenuClick ? this.gridSettings.contextMenuClick : undefined;\n this.contextMenuOpen = this.gridSettings.contextMenuOpen ? this.gridSettings.contextMenuOpen : undefined;\n if (this.gridSettings.rowHeight === null) {\n this.setProperties({ gridSettings: { rowHeight: this.isAdaptive ? 48 : 36 } }, true);\n }\n if (this.enableVirtualization) {\n this.height = (typeof this.height === 'string' && this.height.indexOf('%') === -1) ?\n Number(this.height.split('px')[0]) : this.height;\n this.width = (typeof this.width === 'string' && this.width.indexOf('%') === -1) ?\n Number(this.width.split('px')[0]) : this.width;\n this.height = !isNaN(this.height) ? this.height : 300;\n this.width = !isNaN(this.width) ? this.width : 800;\n }\n if (this.enableVirtualization) {\n var colValues = 1;\n var rowValues = 1;\n if (this.dataSource.valueAxis === 'row') {\n rowValues = this.dataSource.values.length;\n }\n else {\n colValues = this.dataSource.values.length;\n }\n this.pageSettings = {\n columnCurrentPage: 1, rowCurrentPage: 1,\n columnSize: Math.ceil((Math.floor(this.width /\n this.gridSettings.columnWidth) - 1) / colValues),\n rowSize: Math.ceil(Math.floor(this.height / this.gridSettings.rowHeight) / rowValues)\n };\n if (this.allowExcelExport) {\n PivotView_1.Inject(ExcelExport);\n }\n if (this.allowPdfExport) {\n PivotView_1.Inject(PDFExport);\n }\n if (this.editSettings.allowEditing) {\n PivotView_1.Inject(DrillThrough);\n }\n }\n this.isCellBoxMultiSelection = this.gridSettings.allowSelection &&\n this.gridSettings.selectionSettings.cellSelectionMode === 'Box' &&\n this.gridSettings.selectionSettings.mode === 'Cell' && this.gridSettings.selectionSettings.type === 'Multiple';\n if (this.displayOption.view !== 'Table') {\n this.chartModule = new PivotChart();\n }\n this.currentView = this.currentView ? this.currentView : (this.displayOption.view === 'Both' ?\n this.displayOption.primary : this.displayOption.view);\n };\n /**\n * Initialize the control rendering\n * @returns void\n * @hidden\n */\n PivotView.prototype.render = function () {\n this.cellTemplateFn = this.templateParser(this.cellTemplate);\n createSpinner({ target: this.element }, this.createElement);\n this.trigger(events.load, { 'dataSource': this.dataSource });\n this.updateClass();\n this.notify(events.initSubComponent, {});\n this.notify(events.initialLoad, {});\n if (this.isAdaptive) {\n this.contextMenuModule.render();\n }\n this.notify(events.initToolbar, {});\n };\n /**\n * Register the internal events.\n * @returns void\n * @hidden\n */\n PivotView.prototype.addInternalEvents = function () {\n this.on(events.initialLoad, this.generateData, this);\n this.on(events.dataReady, this.renderPivotGrid, this);\n this.on(events.contentReady, this.onContentReady, this);\n };\n /**\n * De-Register the internal events.\n * @returns void\n * @hidden\n */\n PivotView.prototype.removeInternalEvents = function () {\n this.off(events.initialLoad, this.generateData);\n this.off(events.dataReady, this.renderPivotGrid);\n this.off(events.contentReady, this.onContentReady);\n };\n /**\n * Get the Pivot widget properties to be maintained in the persisted state.\n * @returns {string}\n * @hidden\n */\n PivotView.prototype.getPersistData = function () {\n var keyEntity = ['dataSource', 'pivotValues', 'gridSettings', 'chartSettings'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * It returns the Module name.\n * @returns string\n * @hidden\n */\n PivotView.prototype.getModuleName = function () {\n return 'pivotview';\n };\n /**\n * Copy the selected rows or cells data into clipboard.\n * @param {boolean} withHeader - Specifies whether the column header text needs to be copied along with rows or cells.\n * @returns {void}\n * @hidden\n */\n PivotView.prototype.copy = function (withHeader) {\n this.grid.copy(withHeader);\n };\n /**\n * By default, prints all the pages of the Grid and hides the pager.\n * > You can customize print options using the\n * [`printMode`](./api-pivotgrid.html#printmode-string).\n * @returns {void}\n * @hidden\n */\n // public print(): void {\n // this.grid.print();\n // }\n /**\n * Called internally if any of the property value changed.\n * @returns void\n * @hidden\n */\n PivotView.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'dataSource':\n case 'hyperlinkSettings':\n case 'allowDrillThrough':\n case 'editSettings':\n if (newProp.dataSource && newProp.dataSource.groupSettings && newProp.dataSource.groupSettings.length > 0) {\n var groupSettings = extend([], this.dataSource.groupSettings, null, true);\n var data = PivotUtil.getClonedData(this.clonedDataSet);\n var dataSource = extend({}, this.clonedReport, null, true);\n dataSource.data = data;\n dataSource.groupSettings = groupSettings;\n this.setProperties({ dataSource: dataSource }, true);\n }\n this.notify(events.initialLoad, {});\n break;\n case 'pivotValues':\n case 'displayOption':\n this.notify(events.dataReady, {});\n break;\n case 'gridSettings':\n this.renderModule.updateGridSettings();\n this.isCellBoxMultiSelection = this.gridSettings.allowSelection &&\n this.gridSettings.selectionSettings.cellSelectionMode === 'Box' &&\n this.gridSettings.selectionSettings.mode === 'Cell' && this.gridSettings.selectionSettings.type === 'Multiple';\n break;\n case 'chartSettings':\n this.chartModule.loadChart(this, this.chartSettings);\n break;\n case 'locale':\n case 'currencyCode':\n if (this.tooltip) {\n this.tooltip.destroy();\n }\n _super.prototype.refresh.call(this);\n break;\n case 'enableRtl':\n this.notify(events.dataReady, {});\n this.updateClass();\n break;\n case 'groupingBarSettings':\n this.axisFieldModule.render();\n break;\n case 'showTooltip':\n this.renderToolTip();\n break;\n case 'toolbar':\n if (this.toolbarModule) {\n this.toolbarModule.refreshToolbar();\n }\n break;\n }\n }\n };\n PivotView.prototype.templateParser = function (template) {\n if (template) {\n try {\n if (document.querySelectorAll(template).length) {\n return compile(document.querySelector(template).innerHTML.trim());\n }\n }\n catch (error) {\n return compile(template);\n }\n }\n return undefined;\n };\n PivotView.prototype.getCellTemplate = function () {\n return this.cellTemplateFn;\n };\n /**\n * Render the UI section of PivotView.\n * @returns void\n * @hidden\n */\n PivotView.prototype.renderPivotGrid = function () {\n if (this.chartModule) {\n this.chartModule.engineModule = this.engineModule;\n this.chartModule.loadChart(this, this.chartSettings);\n }\n if (this.enableVirtualization) {\n this.virtualscrollModule = new VirtualScroll(this);\n }\n if (this.displayOption.view !== 'Chart') {\n if (this.hyperlinkSettings) {\n this.isRowCellHyperlink = (this.hyperlinkSettings.showRowHeaderHyperlink ?\n true : this.hyperlinkSettings.showHyperlink ? true : false);\n this.isColumnCellHyperlink = (this.hyperlinkSettings.showColumnHeaderHyperlink ?\n true : this.hyperlinkSettings.showHyperlink ? true : false);\n this.isValueCellHyperlink = (this.hyperlinkSettings.showValueCellHyperlink ?\n true : this.hyperlinkSettings.showHyperlink ? true : false);\n this.isSummaryCellHyperlink = (this.hyperlinkSettings.showSummaryCellHyperlink ?\n true : this.hyperlinkSettings.showHyperlink ? true : false);\n this.applyHyperlinkSettings();\n }\n if (this.allowDrillThrough || this.editSettings.allowEditing) {\n this.drillThroughModule = new DrillThrough(this);\n }\n this.renderModule = new Render(this);\n this.renderModule.render();\n }\n else if (this.grid) {\n remove(this.grid.element);\n }\n if (this.showFieldList || this.showGroupingBar) {\n this.notify(events.uiUpdate, this);\n if (this.pivotFieldListModule && this.allowDeferLayoutUpdate) {\n this.pivotFieldListModule.clonedDataSource = extend({}, this.dataSource, null, true);\n }\n if (this.showToolbar && this.showGroupingBar) {\n this.notify(events.initToolbar, this);\n }\n }\n this.trigger(events.dataBound);\n if (this.allowConditionalFormatting) {\n this.applyFormatting();\n }\n if (this.showToolbar) {\n if (this.displayOption.view === 'Both' && this.chart && this.grid) {\n if (this.currentView === 'Table') {\n this.grid.element.style.display = '';\n this.chart.element.style.display = 'none';\n }\n else {\n this.grid.element.style.display = 'none';\n this.chart.element.style.display = '';\n }\n }\n }\n if (this.toolbarModule) {\n if (this.toolbarModule && this.toolbarModule.action !== 'New' && this.toolbarModule.action !== 'Load'\n && this.toolbarModule.action !== 'Remove') {\n this.isModified = true;\n }\n else {\n this.toolbarModule.action = '';\n }\n }\n };\n /**\n * Updates the PivotEngine using dataSource from Pivot View component.\n * @method updateDataSource\n * @return {void}\n * @hidden\n */\n PivotView.prototype.updateDataSource = function (isRefreshGrid) {\n showSpinner(this.element);\n /* tslint:disable:align */\n var customProperties = {\n mode: '',\n savedFieldList: this.engineModule.fieldList,\n pageSettings: this.pageSettings,\n enableValueSorting: this.enableValueSorting,\n isDrillThrough: (this.allowDrillThrough || this.editSettings.allowEditing)\n };\n var isSorted = Object.keys(this.lastSortInfo).length > 0 ? true : false;\n var isFiltered = Object.keys(this.lastFilterInfo).length > 0 ? true : false;\n var isAggChange = Object.keys(this.lastAggregationInfo).length > 0 ? true : false;\n var isCalcChange = Object.keys(this.lastCalcFieldInfo).length > 0 ? true : false;\n if (this.enableVirtualization && (isSorted || isFiltered || isAggChange || isCalcChange)) {\n if (isSorted) {\n this.setProperties({ dataSource: { valueSortSettings: { headerText: '' } } }, true);\n this.engineModule.onSort(this.lastSortInfo);\n this.lastSortInfo = {};\n }\n if (isFiltered) {\n this.engineModule.onFilter(this.lastFilterInfo, this.dataSource);\n this.lastFilterInfo = {};\n }\n if (isAggChange) {\n this.engineModule.onAggregation(this.lastAggregationInfo);\n this.lastAggregationInfo = {};\n }\n if (isCalcChange) {\n this.engineModule.onCalcOperation(this.lastCalcFieldInfo);\n this.lastCalcFieldInfo = {};\n }\n }\n else {\n this.engineModule.renderEngine(this.dataSource, customProperties);\n }\n var eventArgs = {\n dataSource: this.dataSource,\n pivotValues: this.engineModule.pivotValues\n };\n this.trigger(events.enginePopulated, eventArgs);\n this.pivotCommon.engineModule = this.engineModule;\n this.pivotCommon.dataSource = this.dataSource;\n this.setProperties({ pivotValues: this.engineModule.pivotValues }, true);\n this.renderPivotGrid();\n };\n /**\n * To destroy the PivotView elements.\n * @returns void\n */\n PivotView.prototype.destroy = function () {\n this.removeInternalEvents();\n if (this.showGroupingBar && this.groupingBarModule) {\n this.groupingBarModule.destroy();\n }\n if (this.showToolbar && this.toolbarModule) {\n this.toolbarModule.destroy();\n }\n if (this.enableVirtualization && this.virtualscrollModule) {\n this.virtualscrollModule.destroy();\n }\n if (this.allowConditionalFormatting && this.conditionalFormattingModule) {\n this.conditionalFormattingModule.destroy();\n }\n if (this.isAdaptive && this.contextMenuModule) {\n this.contextMenuModule.destroy();\n }\n if (this.keyboardModule) {\n this.keyboardModule.destroy();\n }\n if (this.chart) {\n this.chart.destroy();\n }\n this.unwireEvents();\n removeClass([this.element], cls.ROOT);\n removeClass([this.element], cls.RTL);\n removeClass([this.element], cls.DEVICE);\n this.element.innerHTML = '';\n _super.prototype.destroy.call(this);\n };\n /**\n * Export Pivot widget data to Excel file(.xlsx).\n * @param {ExcelExportProperties} excelExportProperties - Defines the export properties of the Grid.\n * @param {boolean} isMultipleExport - Define to enable multiple export.\n * @param {workbook} workbook - Defines the Workbook if multiple export is enabled.\n * @param {boolean} isBlob - If 'isBlob' set to true, then it will be returned as blob data.\n * @returns void\n */\n /* tslint:disable-next-line:no-any */\n PivotView.prototype.excelExport = function (excelExportProperties, isMultipleExport, workbook, isBlob) {\n if (this.enableVirtualization) {\n this.excelExportModule.exportToExcel('Excel');\n }\n else {\n this.grid.excelExport(excelExportProperties, isMultipleExport, workbook, isBlob);\n }\n };\n /**\n * Export PivotGrid data to CSV file.\n * @param {ExcelExportProperties} excelExportProperties - Defines the export properties of the Grid.\n * @param {boolean} isMultipleExport - Define to enable multiple export.\n * @param {workbook} workbook - Defines the Workbook if multiple export is enabled.\n * @param {boolean} isBlob - If 'isBlob' set to true, then it will be returned as blob data.\n * @returns void\n */\n /* tslint:disable-next-line:no-any */\n PivotView.prototype.csvExport = function (excelExportProperties, isMultipleExport, workbook, isBlob) {\n if (this.enableVirtualization) {\n this.excelExportModule.exportToExcel('CSV');\n }\n else {\n this.grid.csvExport(excelExportProperties, isMultipleExport, workbook, isBlob);\n }\n };\n /**\n * Export Pivot widget data to PDF document.\n * @param {pdfExportProperties} PdfExportProperties - Defines the export properties of the Grid.\n * @param {isMultipleExport} isMultipleExport - Define to enable multiple export.\n * @param {pdfDoc} pdfDoc - Defined the Pdf Document if multiple export is enabled.\n * @param {boolean} isBlob - If 'isBlob' set to true, then it will be returned as blob data.\n * @returns void\n */\n PivotView.prototype.pdfExport = function (pdfExportProperties, isMultipleExport, pdfDoc, isBlob) {\n if (this.enableVirtualization) {\n this.pdfExportModule.exportToPDF();\n }\n else {\n this.grid.pdfExport(pdfExportProperties, isMultipleExport, pdfDoc, isBlob);\n }\n };\n /**\n * Export method for the chart.\n * @param type - Defines the export type.\n * @param fileName - Defines file name of export document.\n * @param orientation - Defines the page orientation on pdf export(0 for Portrait mode, 1 for Landscape mode).\n * @param width - Defines width of the export document.\n * @param height - Defines height of the export document.\n */\n PivotView.prototype.chartExport = function (type, fileName, orientation, width, height) {\n if (this.chart && this.chart.enableExport) {\n this.chart.exportModule.export(type, fileName, orientation, null, width, height);\n }\n };\n /**\n * Print method for the chart.\n */\n PivotView.prototype.printChart = function () {\n if (this.chart) {\n this.chart.print();\n }\n };\n /** @hidden */\n PivotView.prototype.onDrill = function (target) {\n var fieldName = target.parentElement.getAttribute('fieldname');\n var memberName = this.engineModule.pivotValues[Number(target.parentElement.getAttribute('index'))][Number(target.parentElement.getAttribute('aria-colindex'))].actualText;\n this.engineModule.fieldList[fieldName].members[memberName].isDrilled =\n target.classList.contains(cls.COLLAPSE) ? false : true;\n var fieldAvail = false;\n if (this.dataSource.drilledMembers.length === 0) {\n this.setProperties({ dataSource: { drilledMembers: [{ name: fieldName, items: [memberName] }] } }, true);\n }\n else {\n for (var fCnt = 0; fCnt < this.dataSource.drilledMembers.length; fCnt++) {\n var field = this.dataSource.drilledMembers[fCnt];\n if (field.name === fieldName) {\n fieldAvail = true;\n var memIndex = field.items.indexOf(memberName);\n if (memIndex > -1) {\n field.items.splice(memIndex, 1);\n }\n else {\n field.items.push(memberName);\n }\n }\n else {\n continue;\n }\n }\n if (!fieldAvail) {\n this.dataSource.drilledMembers.push({ name: fieldName, items: [memberName] });\n }\n }\n showSpinner(this.element);\n var drilledItem = {\n fieldName: fieldName, memberName: memberName,\n axis: target.parentElement.classList.contains(cls.ROWSHEADER) ? 'row' : 'column',\n action: target.classList.contains(cls.COLLAPSE) ? 'up' : 'down'\n };\n if (this.enableVirtualization) {\n this.engineModule.onDrill(drilledItem);\n }\n else {\n this.engineModule.generateGridData(this.dataSource);\n }\n this.setProperties({ pivotValues: this.engineModule.pivotValues }, true);\n this.renderPivotGrid();\n };\n PivotView.prototype.onContentReady = function () {\n this.isPopupClicked = false;\n if (this.showFieldList) {\n hideSpinner(this.pivotFieldListModule.fieldListSpinnerElement);\n }\n else if (this.fieldListSpinnerElement) {\n hideSpinner(this.fieldListSpinnerElement);\n }\n if (!this.isEmptyGrid) {\n hideSpinner(this.element);\n this.trigger(events.dataBound);\n }\n else {\n this.isEmptyGrid = false;\n }\n if (this.grid) {\n if (this.enableVirtualization && this.engineModule) {\n if (this.element.querySelector('.' + cls.MOVABLECONTENT_DIV) &&\n !this.element.querySelector('.' + cls.MOVABLECONTENT_DIV).querySelector('.' + cls.VIRTUALTRACK_DIV)) {\n this.virtualDiv = createElement('div', { className: cls.VIRTUALTRACK_DIV });\n this.element.querySelector('.' + cls.MOVABLECONTENT_DIV).appendChild(this.virtualDiv);\n }\n if (this.element.querySelector('.' + cls.MOVABLEHEADER_DIV) &&\n !this.element.querySelector('.' + cls.MOVABLEHEADER_DIV).querySelector('.' + cls.VIRTUALTRACK_DIV)) {\n this.virtualHeaderDiv = createElement('div', { className: cls.VIRTUALTRACK_DIV });\n this.element.querySelector('.' + cls.MOVABLEHEADER_DIV).appendChild(this.virtualHeaderDiv);\n }\n else {\n this.virtualHeaderDiv =\n this.element.querySelector('.' + cls.MOVABLEHEADER_DIV).querySelector('.' + cls.VIRTUALTRACK_DIV);\n }\n var movableTable = this.element.querySelector('.' + cls.MOVABLECONTENT_DIV).querySelector('.e-table');\n var vHeight = (this.gridSettings.rowHeight * this.engineModule.rowCount + 0.1 - movableTable.clientHeight);\n if (vHeight > this.scrollerBrowserLimit) {\n this.verticalScrollScale = vHeight / this.scrollerBrowserLimit;\n vHeight = this.scrollerBrowserLimit;\n }\n var vWidth = (this.gridSettings.columnWidth * this.engineModule.columnCount\n - this.grid.columns[0].width);\n if (vWidth > this.scrollerBrowserLimit) {\n this.horizontalScrollScale = vWidth / this.scrollerBrowserLimit;\n vWidth = this.scrollerBrowserLimit;\n }\n setStyleAttribute(this.virtualDiv, {\n height: (vHeight > 0.1 ? vHeight : 0.1) + 'px',\n width: (vWidth > 0.1 ? vWidth : 0.1) + 'px'\n });\n setStyleAttribute(this.virtualHeaderDiv, {\n height: 0, width: (vWidth > 0.1 ? vWidth : 0.1) + 'px'\n });\n var mCnt = this.element.querySelector('.' + cls.MOVABLECONTENT_DIV);\n var fCnt = this.element.querySelector('.' + cls.FROZENCONTENT_DIV);\n var mHdr = this.element.querySelector('.' + cls.MOVABLEHEADER_DIV);\n var verOffset = (mCnt.scrollTop > this.scrollerBrowserLimit) ?\n mCnt.querySelector('.' + cls.TABLE).style.transform.split(',')[1].trim() :\n -(((mCnt.scrollTop * this.verticalScrollScale) - this.scrollPosObject.verticalSection - mCnt.scrollTop)) + 'px)';\n var horiOffset = (mCnt.scrollLeft > this.scrollerBrowserLimit) ?\n (mCnt.querySelector('.' + cls.TABLE).style.transform.split(',')[0].trim() + ',') :\n 'translate(' + -(((mCnt.scrollLeft * this.horizontalScrollScale) -\n this.scrollPosObject.horizontalSection - mCnt.scrollLeft)) + 'px,';\n setStyleAttribute(fCnt.querySelector('.e-table'), {\n transform: 'translate(' + 0 + 'px,' + verOffset\n });\n setStyleAttribute(mCnt.querySelector('.e-table'), {\n transform: horiOffset + verOffset\n });\n setStyleAttribute(mHdr.querySelector('.e-table'), {\n transform: horiOffset + 0 + 'px)'\n });\n }\n if (this.showGroupingBar) {\n this.element.style.minWidth = '400px';\n this.grid.element.style.minWidth = '400px';\n }\n else {\n this.element.style.minWidth = '310px';\n this.grid.element.style.minWidth = '310px';\n }\n this.unwireEvents();\n this.wireEvents();\n }\n this.isChartLoaded = false;\n };\n PivotView.prototype.setToolTip = function (args) {\n var colIndex = Number(args.target.getAttribute('aria-colindex'));\n var rowIndex = Number(args.target.getAttribute('index'));\n var cell = this.pivotValues[rowIndex][colIndex];\n this.tooltip.content = '';\n if (cell) {\n this.tooltip.content = '') : '');\n }\n else {\n args.cancel = true;\n }\n };\n PivotView.prototype.getRowText = function (rowIndex, colIndex) {\n var cell = this.pivotValues[rowIndex][colIndex];\n var level = cell.level;\n var rowText = cell.type === 'grand sum' ? this.localeObj.getConstant('grandTotal') : cell.formattedText;\n while (level > 0 || cell.index === undefined) {\n rowIndex--;\n cell = this.pivotValues[rowIndex][colIndex];\n if (cell.index !== undefined) {\n if (level > cell.level) {\n rowText = rowText + ' - ' + cell.formattedText;\n level = level - 1;\n }\n }\n }\n return rowText.split(' - ').reverse().join(' - ');\n };\n PivotView.prototype.getColText = function (rowIndex, colIndex, limit) {\n var cell = this.pivotValues[0][colIndex];\n var axis = cell.axis;\n var colText = cell.type === 'grand sum' ? this.localeObj.getConstant('grandTotal') : cell.formattedText;\n while (axis !== 'value' && limit > rowIndex) {\n rowIndex++;\n if (this.pivotValues[rowIndex]) {\n cell = this.pivotValues[rowIndex][colIndex];\n axis = cell.axis;\n if (cell.type !== 'sum' && cell.type !== 'grand sum' && axis !== 'value') {\n colText = colText + ' - ' + cell.formattedText;\n }\n }\n }\n return colText;\n };\n PivotView.prototype.updateClass = function () {\n if (this.enableRtl) {\n addClass([this.element], cls.RTL);\n }\n else {\n removeClass([this.element], cls.RTL);\n }\n if (this.isAdaptive) {\n addClass([this.element], cls.DEVICE);\n }\n else {\n removeClass([this.element], cls.DEVICE);\n }\n };\n PivotView.prototype.wireEvents = function () {\n if (this.displayOption.view !== 'Chart') {\n EventHandler.add(this.element, this.isAdaptive ? 'touchend' : 'click', this.mouseClickHandler, this);\n EventHandler.add(this.element, 'mousedown', this.mouseDownHandler, this);\n EventHandler.add(this.element.querySelector('.' + cls.GRID_HEADER), 'mousemove', this.mouseMoveHandler, this);\n EventHandler.add(this.element, 'mouseup', this.mouseUpHandler, this);\n EventHandler.add(this.element, this.isAdaptive ? 'touchend' : 'contextmenu', this.mouseRclickHandler, this);\n window.addEventListener('resize', this.onWindowResize.bind(this), true);\n }\n };\n PivotView.prototype.mouseRclickHandler = function (e) {\n if (e.which === 3) {\n this.lastCellClicked = e.target;\n }\n else if (e.which === 0) {\n this.lastCellClicked = e.target;\n }\n this.lastCellClicked = e.target;\n };\n PivotView.prototype.mouseDownHandler = function (e) {\n if (e.which === 3) {\n this.lastCellClicked = e.target;\n }\n if (this.isCellBoxMultiSelection) {\n this.isMouseDown = true;\n this.isMouseUp = false;\n var parent_1 = this.parentAt(e.target, 'TH');\n this.clearSelection(parent_1, e, Number(parent_1.getAttribute('aria-colindex')), Number(parent_1.getAttribute('index')));\n this.lastSelectedElement = undefined;\n }\n };\n PivotView.prototype.mouseMoveHandler = function (e) {\n if (this.isCellBoxMultiSelection) {\n e.preventDefault();\n if (this.isMouseDown && e.target) {\n var ele = e.target;\n var parentElement = this.parentAt(ele, 'TH');\n if (this.lastSelectedElement && this.lastSelectedElement !== parentElement &&\n parentElement.classList.contains(cls.SELECTED_BGCOLOR)) {\n this.lastSelectedElement.classList.remove(cls.CELL_ACTIVE_BGCOLOR);\n this.lastSelectedElement.classList.remove(cls.SELECTED_BGCOLOR);\n this.lastSelectedElement = parentElement;\n }\n else {\n this.lastSelectedElement = parentElement;\n parentElement.classList.add(cls.CELL_ACTIVE_BGCOLOR);\n parentElement.classList.add(cls.SELECTED_BGCOLOR);\n }\n this.renderModule.selected();\n }\n }\n };\n PivotView.prototype.mouseUpHandler = function (e) {\n if (this.isCellBoxMultiSelection) {\n this.isMouseDown = false;\n this.isMouseUp = true;\n }\n };\n PivotView.prototype.parentAt = function (target, tagName) {\n while (target.tagName !== tagName) {\n if (target.parentElement) {\n target = target.parentElement;\n }\n else {\n break;\n }\n }\n return target;\n };\n PivotView.prototype.mouseClickHandler = function (e) {\n if (e.which === 3) {\n this.lastCellClicked = e.target;\n }\n else if (e.which === 0) {\n this.lastCellClicked = e.target;\n }\n var target = e.target;\n if ((target.classList.contains('e-headercell') ||\n target.classList.contains('e-headercelldiv') ||\n target.classList.contains('e-rowsheader') ||\n target.classList.contains('e-rowcell') ||\n target.classList.contains('e-stackedheadercelldiv') ||\n target.classList.contains('e-headertext') ||\n target.classList.contains('e-ascending') ||\n target.classList.contains('e-descending')) && this.enableValueSorting) {\n var ele = null;\n if (target.classList.contains('e-headercell') || target.classList.contains('e-rowsheader')\n || target.classList.contains('e-rowcell')) {\n ele = target;\n }\n else if (target.classList.contains('e-stackedheadercelldiv') || target.classList.contains('e-headercelldiv') ||\n target.classList.contains('e-ascending') || target.classList.contains('e-descending')) {\n ele = target.parentElement;\n }\n else if (target.classList.contains('e-headertext')) {\n ele = target.parentElement.parentElement;\n }\n this.CellClicked(target, e);\n if ((ele.parentElement.parentElement.parentElement.parentElement.classList.contains('e-movableheader')\n && this.dataSource.valueAxis === 'column') || (ele.parentElement.classList.contains('e-row') &&\n this.dataSource.valueAxis === 'row') && (ele.parentElement.classList.contains('e-rowsheader') ||\n ele.classList.contains('e-stot'))) {\n /* tslint:disable */\n var colIndex = Number(ele.getAttribute('aria-colindex'));\n var rowIndex = Number(ele.getAttribute('index'));\n if (this.dataSource.valueAxis === 'row' && (this.dataSource.values.length > 1 || this.dataSource.alwaysShowValueHeader)) {\n rowIndex = this.pivotValues[rowIndex][colIndex].type === 'value' ? rowIndex : (rowIndex + 1);\n }\n else if (this.dataSource.valueAxis === 'column' && (this.dataSource.values.length > 1 || this.dataSource.alwaysShowValueHeader)) {\n colIndex = (Number(ele.getAttribute('aria-colindex')) + Number(ele.getAttribute('aria-colspan')) - 1);\n rowIndex = this.engineModule.headerContent.length - 1;\n }\n this.setProperties({\n dataSource: {\n valueSortSettings: {\n columnIndex: (Number(ele.getAttribute('aria-colindex')) +\n Number(ele.getAttribute('aria-colspan')) - 1),\n sortOrder: this.dataSource.valueSortSettings.sortOrder === 'Descending' ? 'Ascending' : 'Descending',\n headerText: this.pivotValues[rowIndex][colIndex].valueSort.levelName,\n headerDelimiter: this.dataSource.valueSortSettings.headerDelimiter ?\n this.dataSource.valueSortSettings.headerDelimiter : '.'\n }\n }\n }, true);\n /* tslint:enable */\n showSpinner(this.element);\n this.engineModule.enableValueSorting = true;\n if (this.enableVirtualization) {\n if (this.dataSource.enableSorting) {\n for (var _i = 0, _a = Object.keys(this.engineModule.fieldList); _i < _a.length; _i++) {\n var key = _a[_i];\n this.engineModule.fieldList[key].sort = 'Ascending';\n }\n this.setProperties({ dataSource: { sortSettings: [] } }, true);\n }\n this.engineModule.rMembers = this.engineModule.headerCollection.rowHeaders;\n this.engineModule.cMembers = this.engineModule.headerCollection.columnHeaders;\n this.engineModule.applyValueSorting();\n this.engineModule.updateEngine();\n }\n else {\n this.engineModule.generateGridData(this.dataSource);\n }\n this.setProperties({ pivotValues: this.engineModule.pivotValues }, true);\n this.renderPivotGrid();\n }\n }\n else if (target.classList.contains(cls.COLLAPSE) || target.classList.contains(cls.EXPAND)) {\n this.onDrill(target);\n }\n else {\n this.CellClicked(target, e);\n return;\n }\n };\n PivotView.prototype.framePivotColumns = function (gridcolumns) {\n for (var _i = 0, gridcolumns_1 = gridcolumns; _i < gridcolumns_1.length; _i++) {\n var column = gridcolumns_1[_i];\n if (column.columns && column.columns.length > 0) {\n this.framePivotColumns(column.columns);\n }\n else {\n /* tslint:disable */\n var levelName = column.field === '0.formattedText' ? '' :\n (column.customAttributes ? column.customAttributes.cell.valueSort.levelName : '');\n var width = this.renderModule.setSavedWidth(column.field === '0.formattedText' ? column.field :\n levelName, Number(column.width));\n this.pivotColumns.push({\n allowReordering: column.allowReordering,\n allowResizing: column.allowResizing,\n headerText: levelName,\n width: width\n });\n this.totColWidth = this.totColWidth + Number(width);\n /* tslint:enable */\n }\n }\n };\n /** @hidden */\n PivotView.prototype.setGridColumns = function (gridcolumns) {\n if (this.element.offsetWidth < this.totColWidth) {\n for (var _i = 0, gridcolumns_2 = gridcolumns; _i < gridcolumns_2.length; _i++) {\n var column = gridcolumns_2[_i];\n if (column.columns && column.columns.length > 0) {\n this.setGridColumns(column.columns);\n }\n else {\n /* tslint:disable */\n var levelName = column.field === '0.formattedText' ? '' :\n (column.customAttributes ? column.customAttributes.cell.valueSort.levelName : '');\n column.allowReordering = this.pivotColumns[this.posCount].allowReordering;\n column.allowResizing = this.pivotColumns[this.posCount].allowResizing;\n column.width = this.renderModule.setSavedWidth(column.field === '0.formattedText' ? column.field :\n levelName, Number(this.pivotColumns[this.posCount].width));\n this.posCount++;\n if (column.allowReordering) {\n this.gridSettings.allowReordering = true;\n }\n if (column.allowResizing) {\n this.gridSettings.allowResizing = true;\n }\n }\n }\n if (this.gridSettings.allowReordering) {\n Grid.Inject(Reorder);\n }\n if (this.gridSettings.allowResizing) {\n Grid.Inject(Resize);\n }\n /* tslint:enable */\n }\n };\n /** @hidden */\n PivotView.prototype.triggerColumnRenderEvent = function (gridcolumns) {\n this.pivotColumns = [];\n this.totColWidth = 0;\n this.framePivotColumns(gridcolumns);\n var firstColWidth = this.pivotColumns[0].width;\n var eventArgs = {\n columns: this.pivotColumns,\n dataSource: this.dataSource\n };\n this.trigger(events.beforeColumnsRender, eventArgs);\n if (firstColWidth !== this.pivotColumns[0].width && this.element.offsetWidth < this.totColWidth) {\n this.firstColWidth = this.pivotColumns[0].width;\n }\n this.posCount = 0;\n this.setGridColumns(gridcolumns);\n };\n /** @hidden */\n PivotView.prototype.setCommonColumnsWidth = function (columns, width) {\n for (var _i = 0, columns_1 = columns; _i < columns_1.length; _i++) {\n var column = columns_1[_i];\n if (column.field !== '0.formattedText') {\n if (column.columns) {\n this.setCommonColumnsWidth(column.columns, width);\n }\n else {\n column.width = width;\n }\n }\n else {\n column.width = width < this.firstColWidth ? this.firstColWidth : width;\n }\n }\n };\n /** @hidden */\n PivotView.prototype.onWindowResize = function () {\n /* tslint:disable */\n clearTimeout(this.timeOutObj);\n this.timeOutObj = setTimeout(this.windowResize.bind(this), 500);\n /* tslint:enable */\n };\n PivotView.prototype.windowResize = function () {\n if (this.element && this.element.classList.contains('e-pivotview') && this.engineModule && this.engineModule.pivotValues) {\n var colWidth = this.renderModule.resizeColWidth(this.dataSource.values.length > 0 ?\n this.engineModule.pivotValues[0].length : 2);\n this.grid.width = this.renderModule.calculateGridWidth();\n this.setCommonColumnsWidth(this.grid.columns, colWidth);\n this.posCount = 0;\n if (!this.showGroupingBar) {\n this.setGridColumns(this.grid.columns);\n }\n this.grid.headerModule.refreshUI();\n if (this.showGroupingBar && this.groupingBarModule && this.element.querySelector('.' + cls.GROUPING_BAR_CLASS)) {\n this.groupingBarModule.setGridRowWidth();\n }\n }\n };\n PivotView.prototype.CellClicked = function (target, e) {\n var ele = null;\n if (target.classList.contains('e-headercell') || target.classList.contains('e-rowcell')) {\n ele = target;\n }\n else if (target.classList.contains('e-stackedheadercelldiv') || target.classList.contains('e-cellvalue') ||\n target.classList.contains('e-headercelldiv')) {\n ele = target.parentElement;\n }\n else if (target.classList.contains('e-headertext')) {\n ele = target.parentElement.parentElement;\n }\n else if (target.classList.contains(cls.ROW_SELECT)) {\n if (target.classList.contains(cls.SPAN_CLICKED)) {\n this.isPopupClicked = false;\n }\n else {\n this.isPopupClicked = true;\n }\n }\n /* tslint:disable */\n if (ele) {\n var colIndex = Number(ele.getAttribute('aria-colindex'));\n var rowIndex = Number(ele.getAttribute('index'));\n var colSpan = Number(ele.getAttribute('aria-colspan'));\n if (this.cellClick) {\n this.trigger(events.cellClick, {\n currentCell: ele,\n data: this.pivotValues[rowIndex][colIndex]\n });\n }\n if (this.gridSettings.allowSelection) {\n if (this.gridSettings.selectionSettings.mode === 'Both' ? !ele.classList.contains(cls.ROW_CELL_CLASS) :\n this.gridSettings.selectionSettings.mode !== 'Row') {\n this.clearSelection(ele, e, colIndex, rowIndex);\n this.applyColumnSelection(e, ele, colIndex, colIndex + (colSpan > 0 ? (colSpan - 1) : 0), rowIndex);\n }\n else {\n this.clearSelection(ele, e, colIndex, rowIndex);\n }\n if (this.gridSettings.selectionSettings.type === 'Multiple' &&\n (this.gridSettings.selectionSettings.mode === 'Row' || this.gridSettings.selectionSettings.mode === 'Both')) {\n this.applyRowSelection(0, rowIndex);\n }\n }\n }\n };\n /** @hidden */\n PivotView.prototype.clearSelection = function (ele, e, colIndex, rowIndex) {\n if ((!e.shiftKey && !e.ctrlKey) || this.gridSettings.selectionSettings.type === 'Single') {\n if (this.gridSettings.selectionSettings.mode === 'Cell') {\n if (ele.classList.contains(cls.COLUMNSHEADER)) {\n [].slice.call(this.element.querySelectorAll(('.' + cls.ROW_CELL_CLASS + '.') + cls.CELL_SELECTED_BGCOLOR)).forEach(function (ele) {\n ele.classList.remove(cls.CELL_SELECTED_BGCOLOR);\n });\n }\n else {\n [].slice.call(this.element.querySelectorAll(('.' + cls.COLUMNSHEADER + '.') + cls.CELL_ACTIVE_BGCOLOR)).forEach(function (ele) {\n ele.classList.remove(cls.CELL_ACTIVE_BGCOLOR);\n ele.classList.remove(cls.SELECTED_BGCOLOR);\n });\n }\n }\n else if (this.gridSettings.selectionSettings.mode === 'Both') {\n if (ele.classList.contains(cls.ROW_CELL_CLASS)) {\n [].slice.call(this.element.querySelectorAll('.' + cls.SELECTED_BGCOLOR)).forEach(function (ele) {\n if (Number(ele.getAttribute('index')) !== rowIndex) {\n ele.classList.remove(cls.CELL_ACTIVE_BGCOLOR);\n ele.classList.remove(cls.SELECTED_BGCOLOR);\n }\n });\n }\n else {\n [].slice.call(this.element.querySelectorAll('.' + cls.CELL_SELECTED_BGCOLOR)).forEach(function (ele) {\n ele.classList.remove(cls.CELL_SELECTED_BGCOLOR);\n });\n }\n }\n }\n };\n /** @hidden */\n PivotView.prototype.applyRowSelection = function (colIndex, rowIndex) {\n var pivotValue = this.engineModule.pivotValues[rowIndex][colIndex];\n if (pivotValue && pivotValue.isDrilled) {\n var parentLevel = pivotValue.level;\n var rCount = rowIndex;\n do {\n rCount++;\n pivotValue = this.engineModule.pivotValues[rCount][colIndex];\n } while (pivotValue && parentLevel < pivotValue.level);\n var _this = this;\n if (this.isAdaptive) {\n this.rowRangeSelection = {\n enable: true,\n startIndex: rowIndex - _this.renderModule.rowStartPos,\n endIndex: rCount - (1 + _this.renderModule.rowStartPos)\n };\n }\n else {\n _this.grid.selectionModule.selectRowsByRange(rowIndex -\n _this.renderModule.rowStartPos, rCount - (1 + _this.renderModule.rowStartPos));\n }\n }\n };\n /** @hidden */\n PivotView.prototype.applyColumnSelection = function (e, target, colStart, colEnd, rowStart) {\n if (!target.classList.contains(cls.ROWSHEADER) &&\n (this.gridSettings.selectionSettings.mode === 'Cell' ? target.classList.contains(cls.COLUMNSHEADER) : true)) {\n var isCtrl_1 = e.ctrlKey;\n if (this.isAdaptive && this.gridSettings.selectionSettings.type === 'Multiple') {\n this.grid.selectionModule.showPopup(e);\n if (this.isPopupClicked) {\n this.element.querySelector('.' + cls.ROW_SELECT).classList.add(cls.SPAN_CLICKED);\n isCtrl_1 = true;\n }\n else {\n this.element.querySelector('.' + cls.ROW_SELECT).classList.remove(cls.SPAN_CLICKED);\n isCtrl_1 = false;\n }\n }\n var queryStringArray = [];\n var type = this.gridSettings.selectionSettings.type;\n var isToggle_1 = target.classList.contains(cls.CELL_ACTIVE_BGCOLOR);\n var activeColumns_1 = [];\n var actColPos_1 = {};\n for (var cCnt = colStart; cCnt <= colEnd; cCnt++) {\n activeColumns_1.push(cCnt.toString());\n }\n if (!isCtrl_1 || type === 'Single') {\n [].slice.call(this.element.querySelectorAll('.' + cls.CELL_ACTIVE_BGCOLOR)).forEach(function (ele) {\n ele.classList.remove(cls.CELL_ACTIVE_BGCOLOR);\n ele.classList.remove(cls.SELECTED_BGCOLOR);\n if (activeColumns_1.indexOf(ele.getAttribute('aria-colindex')) === -1) {\n isToggle_1 = false;\n }\n var colIndex = Number(ele.getAttribute('aria-colindex'));\n actColPos_1[colIndex] = colIndex;\n });\n /* tslint:disable-next-line:no-any */\n activeColumns_1 = Object.keys(actColPos_1).length > 0 ? Object.keys(actColPos_1).sort(function (a, b) {\n return a - b;\n }) : activeColumns_1;\n }\n else {\n isToggle_1 = false;\n }\n if (type === 'Multiple' && e.shiftKey) {\n this.shiftLockedPos = this.shiftLockedPos.length === 0 ? activeColumns_1 : this.shiftLockedPos;\n if (Number(this.shiftLockedPos[0]) <= colStart) {\n colStart = Number(this.shiftLockedPos[0]);\n }\n else {\n colEnd = colEnd < Number(this.shiftLockedPos[this.shiftLockedPos.length - 1]) ?\n Number(this.shiftLockedPos[this.shiftLockedPos.length - 1]) : colEnd;\n }\n }\n else {\n this.shiftLockedPos = [];\n }\n var rowSelectedList_1 = [];\n if (e.ctrlKey && this.gridSettings.selectionSettings.mode === 'Both' && type === 'Multiple' && !target.classList.contains(cls.ROWSHEADER)) {\n [].slice.call(this.element.querySelectorAll('.' + cls.ROWSHEADER + '.' + cls.CELL_SELECTED_BGCOLOR)).forEach(function (ele) {\n rowSelectedList_1.push(ele.getAttribute('index'));\n });\n }\n var count = colStart;\n while (count <= colEnd) {\n queryStringArray.push('[aria-colindex=\"' + count + '\"]' + (this.gridSettings.selectionSettings.mode === 'Cell' ?\n '[index=\"' + rowStart + '\"]' : \"\") + '');\n count++;\n }\n if (!isToggle_1) {\n rowStart = target.classList.contains('e-headercell') ? rowStart : (this.renderModule.rowStartPos - 1);\n var isTargetSelected_1 = target.classList.contains(cls.CELL_ACTIVE_BGCOLOR);\n [].slice.call(this.element.querySelectorAll(queryStringArray.toString())).forEach(function (ele) {\n if (Number(ele.getAttribute('index')) >= rowStart) {\n if (isTargetSelected_1 && isCtrl_1 && (rowSelectedList_1.indexOf(ele.getAttribute('index')) === -1)) {\n ele.classList.remove(cls.CELL_ACTIVE_BGCOLOR);\n ele.classList.remove(cls.SELECTED_BGCOLOR);\n }\n else {\n ele.classList.add(cls.CELL_ACTIVE_BGCOLOR);\n ele.classList.add(cls.SELECTED_BGCOLOR);\n }\n }\n });\n }\n this.renderModule.selected();\n }\n };\n PivotView.prototype.getSelectedCellsPos = function () {\n var control = this;\n control.savedSelectedCellsPos = [];\n [].slice.call(this.element.querySelectorAll('.' + cls.SELECTED_BGCOLOR)).forEach(function (ele) {\n control.savedSelectedCellsPos.push({ rowIndex: ele.getAttribute('index'), colIndex: ele.getAttribute('aria-colindex') });\n });\n };\n PivotView.prototype.setSavedSelectedCells = function () {\n var control = this;\n [].slice.call(this.savedSelectedCellsPos).forEach(function (item) {\n var query = '[aria-colindex=\"' + item.colIndex + '\"][index=\"' + item.rowIndex + '\"]';\n control.element.querySelector(query).classList.add(cls.CELL_ACTIVE_BGCOLOR);\n control.element.querySelector(query).classList.add(cls.SELECTED_BGCOLOR);\n });\n };\n /* tslint:enable */\n PivotView.prototype.unwireEvents = function () {\n if (this.displayOption.view !== 'Chart') {\n EventHandler.remove(this.element, this.isAdaptive ? 'touchend' : 'click', this.mouseClickHandler);\n EventHandler.remove(this.element, 'mousedown', this.mouseDownHandler);\n if (this.element.querySelector('.' + cls.GRID_HEADER)) {\n EventHandler.remove(this.element.querySelector('.' + cls.GRID_HEADER), 'mousemove', this.mouseMoveHandler);\n }\n EventHandler.remove(this.element, 'mouseup', this.mouseUpHandler);\n EventHandler.remove(this.element, this.isAdaptive ? 'touchend' : 'contextmenu', this.mouseRclickHandler);\n window.removeEventListener('resize', this.onWindowResize.bind(this), true);\n }\n };\n PivotView.prototype.renderEmptyGrid = function () {\n this.isEmptyGrid = true;\n this.renderModule = new Render(this);\n if (this.grid) {\n /* tslint:disable */\n this.grid.setProperties({\n columns: this.renderModule.frameEmptyColumns(),\n dataSource: this.renderModule.frameEmptyData()\n }, true);\n /* tslint:enable */\n this.grid.notify('datasource-modified', {});\n this.grid.refreshColumns();\n }\n else {\n if (this.element.querySelector('.' + cls.GRID_CLASS)) {\n remove(this.element.querySelector('.' + cls.GRID_CLASS));\n }\n this.renderModule.bindGrid(this, true);\n /* tslint:disable:no-empty */\n this.grid.showSpinner = function () { };\n this.grid.hideSpinner = function () { };\n /* tslint:enable:no-empty */\n this.element.appendChild(createElement('div', { id: this.element.id + '_grid' }));\n this.grid.appendTo('#' + this.element.id + '_grid');\n }\n };\n /* tslint:disable */\n PivotView.prototype.initEngine = function () {\n this.trigger(events.enginePopulating, { 'dataSource': this.dataSource });\n if (this.dataSource.groupSettings) {\n var dataSet = this.dataSource.data;\n this.clonedDataSet = this.clonedDataSet ? this.clonedDataSet : PivotUtil.getClonedData(dataSet);\n this.setProperties({ dataSource: { data: [] } }, true);\n this.clonedReport = this.clonedReport ? this.clonedReport : extend({}, this.dataSource, null, true);\n this.setProperties({ dataSource: { data: dataSet } }, true);\n }\n /* tslint:disable:align */\n var customProperties = {\n mode: '',\n savedFieldList: undefined,\n pageSettings: this.pageSettings,\n enableValueSorting: this.enableValueSorting,\n isDrillThrough: (this.allowDrillThrough || this.editSettings.allowEditing),\n localeObj: this.localeObj\n };\n this.engineModule.renderEngine(this.dataSource, customProperties);\n this.setProperties({ pivotValues: this.engineModule.pivotValues }, true);\n this.trigger(events.enginePopulated, { 'pivotValues': this.pivotValues });\n this.notify(events.dataReady, {});\n this.isEmptyGrid = false;\n };\n /* tslint:enable */\n PivotView.prototype.generateData = function () {\n if (this.displayOption.view !== 'Chart') {\n this.renderEmptyGrid();\n }\n showSpinner(this.element);\n /* tslint:disable */\n if (this.dataSource && this.dataSource.data) {\n if (this.dataSource.data instanceof DataManager) {\n setTimeout(this.getData.bind(this), 100);\n }\n else if (this.dataSource.data.length > 0) {\n this.initEngine();\n }\n else {\n hideSpinner(this.element);\n }\n }\n else {\n hideSpinner(this.element);\n }\n /* tslint:enable */\n };\n PivotView.prototype.getData = function () {\n this.dataSource.data.executeQuery(new Query()).then(this.executeQuery.bind(this));\n };\n PivotView.prototype.executeQuery = function (e) {\n if (!this.element.querySelector('.e-spinner-pane')) {\n showSpinner(this.element);\n }\n this.setProperties({ dataSource: { data: e.result } }, true);\n this.initEngine();\n };\n PivotView.prototype.applyFormatting = function () {\n if (this.pivotValues) {\n var colIndex = [];\n for (var len = this.pivotValues.length, i = 0; i < len; i++) {\n if (this.pivotValues[i] !== undefined && this.pivotValues[i][0] === undefined) {\n colIndex.push(i);\n }\n }\n for (var i = 0; i < this.pivotValues.length; i++) {\n for (var j = 1; (this.pivotValues[i] && j < this.pivotValues[i].length); j++) {\n if (this.pivotValues[i][j].axis === 'value') {\n this.pivotValues[i][j].style = undefined;\n this.pivotValues[i][j].cssClass = undefined;\n var format_1 = this.dataSource.conditionalFormatSettings;\n for (var k = 0; k < format_1.length; k++) {\n if (this.checkCondition(this.pivotValues[i][j].value, format_1[k].conditions, format_1[k].value1, format_1[k].value2)) {\n var ilen = (this.dataSource.valueAxis === 'row' ? i : this.engineModule.headerContent.length - 1);\n var jlen = (this.dataSource.valueAxis === 'row' ? 0 : j);\n if ((!format_1[k].measure || this.dataSource.values.length === 1 ||\n (this.pivotValues[ilen][jlen].valueSort &&\n this.pivotValues[ilen][jlen].valueSort.levelName.\n indexOf(format_1[k].measure) > -1)) &&\n (!format_1[k].label || ((this.pivotValues[colIndex[format_1[k].label.split('.').length - 1]] &&\n this.pivotValues[colIndex[format_1[k].label.split('.').length - 1]][j] &&\n this.pivotValues[colIndex[format_1[k].label.split('.').length - 1]][j].valueSort &&\n this.pivotValues[colIndex[format_1[k].label.split('.').length - 1]][j].\n valueSort[format_1[k].label]) || (this.pivotValues[i][0].\n valueSort.levelName.indexOf(format_1[k].label) > -1)))) {\n if (format_1[k].style && format_1[k].style.backgroundColor) {\n format_1[k].style.backgroundColor = this.conditionalFormattingModule\n .isHex(format_1[k].style.backgroundColor.substr(1)) ? format_1[k].style.backgroundColor :\n this.conditionalFormattingModule.colourNameToHex(format_1[k].style.backgroundColor);\n }\n if (format_1[k].style && format_1[k].style.color) {\n format_1[k].style.color = this.conditionalFormattingModule\n .isHex(format_1[k].style.color.substr(1)) ? format_1[k].style.color :\n this.conditionalFormattingModule.colourNameToHex(format_1[k].style.color);\n }\n this.pivotValues[i][j].style = format_1[k].style;\n this.pivotValues[i][j].cssClass = 'format' + this.element.id + k;\n }\n }\n }\n }\n }\n }\n var format = this.dataSource.conditionalFormatSettings;\n for (var k = 0; k < format.length; k++) {\n var sheet = (this.createStyleSheet.bind(this))();\n var str = 'color: ' + format[k].style.color + '!important;background-color: ' + format[k].style.backgroundColor +\n '!important;font-size: ' + format[k].style.fontSize + '!important;font-family: ' + format[k].style.fontFamily +\n ' !important;';\n sheet.insertRule('.format' + this.element.id + k + '{' + str + '}', 0);\n }\n }\n };\n PivotView.prototype.createStyleSheet = function () {\n var style = document.createElement('style');\n style.appendChild(document.createTextNode(''));\n document.head.appendChild(style);\n return style.sheet;\n };\n PivotView.prototype.applyHyperlinkSettings = function () {\n if (this.pivotValues) {\n var pivotValues = this.pivotValues;\n var colIndex = [];\n for (var len = pivotValues.length, i = 0; i < len; i++) {\n if (pivotValues[i] !== undefined && pivotValues[i][0] === undefined) {\n colIndex.push(i);\n }\n }\n if (this.hyperlinkSettings.conditionalSettings.length > 0) {\n for (var i = 0; i < pivotValues.length; i++) {\n for (var j = 1; (pivotValues[i] && j < pivotValues[i].length); j++) {\n if (pivotValues[i][j].axis === 'value') {\n pivotValues[i][j].enableHyperlink = false;\n var collection = this.hyperlinkSettings.conditionalSettings;\n for (var k = 0; k < collection.length; k++) {\n if (this.checkCondition(pivotValues[i][j].value, collection[k].conditions, collection[k].value1, collection[k].value2)) {\n var ilen = (this.dataSource.valueAxis === 'row' ?\n i : this.engineModule.headerContent.length - 1);\n var jlen = (this.dataSource.valueAxis === 'row' ? 0 : j);\n if ((!collection[k].measure || this.dataSource.values.length === 1 ||\n (pivotValues[ilen][jlen].valueSort &&\n pivotValues[ilen][jlen].valueSort.levelName.\n indexOf(collection[k].measure) > -1)) &&\n (!collection[k].label || ((pivotValues[colIndex[collection[k].label.split('.').length - 1]] &&\n pivotValues[colIndex[collection[k].label.split('.').length - 1]][j] &&\n pivotValues[colIndex[collection[k].label.split('.').length - 1]][j].valueSort &&\n pivotValues[colIndex[collection[k].label.split('.').length - 1]][j].\n valueSort[collection[k].label]) || (pivotValues[i][0].\n valueSort.levelName.indexOf(collection[k].label) > -1)))) {\n pivotValues[i][j].enableHyperlink = true;\n }\n }\n }\n }\n }\n }\n }\n if (!isNullOrUndefined(this.hyperlinkSettings.headerText)) {\n for (var i = 0; i < pivotValues.length; i++) {\n for (var j = 1; (pivotValues[i] && j < pivotValues[i].length); j++) {\n if (pivotValues[i][j].axis === 'value') {\n // (pivotValues[i][j] as IAxisSet).enableHyperlink = false;\n var label = this.hyperlinkSettings.headerText;\n var ilen = (this.dataSource.valueAxis === 'row' ?\n i : this.engineModule.headerContent.length - 1);\n var jlen = (this.dataSource.valueAxis === 'row' ? 0 : j);\n if ((pivotValues[colIndex[label.split('.').length - 1]] &&\n pivotValues[colIndex[label.split('.').length - 1]][j] &&\n pivotValues[colIndex[label.split('.').length - 1]][j].\n valueSort && pivotValues[colIndex[label.split('.').length - 1]][j].\n valueSort[label])) {\n for (var _i = 0, colIndex_1 = colIndex; _i < colIndex_1.length; _i++) {\n var index = colIndex_1[_i];\n if (pivotValues[index][j] &&\n pivotValues[index][j].axis === 'column' &&\n (pivotValues[index][j].valueSort.levelName.indexOf(label) > -1)) {\n pivotValues[index][j].enableHyperlink = true;\n }\n }\n pivotValues[i][j].enableHyperlink = true;\n }\n else if (pivotValues[i][0].valueSort.levelName.indexOf(label) > -1) {\n pivotValues[i][0].enableHyperlink = true;\n pivotValues[i][j].enableHyperlink = true;\n }\n }\n }\n }\n }\n else {\n return;\n }\n }\n };\n PivotView.prototype.checkCondition = function (cellValue, conditions, conditionalValue1, conditionalValue2) {\n switch (conditions) {\n case 'LessThan':\n return cellValue < conditionalValue1;\n case 'LessThanOrEqualTo':\n return cellValue <= conditionalValue1;\n case 'GreaterThan':\n return cellValue > conditionalValue1;\n case 'GreaterThanOrEqualTo':\n return cellValue >= conditionalValue1;\n case 'Equals':\n return cellValue === conditionalValue1;\n case 'NotEquals':\n return cellValue !== conditionalValue1;\n case 'Between':\n return (conditionalValue1 < conditionalValue2 && cellValue >= conditionalValue1 && cellValue <= conditionalValue2) ||\n (conditionalValue1 > conditionalValue2 && cellValue <= conditionalValue1 && cellValue >= conditionalValue2);\n case 'NotBetween':\n return !((conditionalValue1 < conditionalValue2 && cellValue >= conditionalValue1 && cellValue <= conditionalValue2) ||\n (conditionalValue1 > conditionalValue2 && cellValue <= conditionalValue1 && cellValue >= conditionalValue2));\n default:\n return false;\n }\n };\n var PivotView_1;\n __decorate([\n Property('USD')\n ], PivotView.prototype, \"currencyCode\", void 0);\n __decorate([\n Property(false)\n ], PivotView.prototype, \"showFieldList\", void 0);\n __decorate([\n Complex({}, GridSettings)\n ], PivotView.prototype, \"gridSettings\", void 0);\n __decorate([\n Complex({}, ChartSettings)\n ], PivotView.prototype, \"chartSettings\", void 0);\n __decorate([\n Complex({}, GroupingBarSettings)\n ], PivotView.prototype, \"groupingBarSettings\", void 0);\n __decorate([\n Complex({}, HyperlinkSettings)\n ], PivotView.prototype, \"hyperlinkSettings\", void 0);\n __decorate([\n Complex({}, DataSource)\n ], PivotView.prototype, \"dataSource\", void 0);\n __decorate([\n Complex({}, CellEditSettings)\n ], PivotView.prototype, \"editSettings\", void 0);\n __decorate([\n Complex({}, DisplayOption)\n ], PivotView.prototype, \"displayOption\", void 0);\n __decorate([\n Property()\n ], PivotView.prototype, \"pivotValues\", void 0);\n __decorate([\n Property(false)\n ], PivotView.prototype, \"showGroupingBar\", void 0);\n __decorate([\n Property(true)\n ], PivotView.prototype, \"showTooltip\", void 0);\n __decorate([\n Property(false)\n ], PivotView.prototype, \"showToolbar\", void 0);\n __decorate([\n Property([])\n ], PivotView.prototype, \"toolbar\", void 0);\n __decorate([\n Property(false)\n ], PivotView.prototype, \"showValuesButton\", void 0);\n __decorate([\n Property(false)\n ], PivotView.prototype, \"allowCalculatedField\", void 0);\n __decorate([\n Property(false)\n ], PivotView.prototype, \"enableValueSorting\", void 0);\n __decorate([\n Property(false)\n ], PivotView.prototype, \"allowConditionalFormatting\", void 0);\n __decorate([\n Property('auto')\n ], PivotView.prototype, \"height\", void 0);\n __decorate([\n Property('auto')\n ], PivotView.prototype, \"width\", void 0);\n __decorate([\n Property(false)\n ], PivotView.prototype, \"allowExcelExport\", void 0);\n __decorate([\n Property(false)\n ], PivotView.prototype, \"enableVirtualization\", void 0);\n __decorate([\n Property(false)\n ], PivotView.prototype, \"allowDrillThrough\", void 0);\n __decorate([\n Property(false)\n ], PivotView.prototype, \"allowPdfExport\", void 0);\n __decorate([\n Property(false)\n ], PivotView.prototype, \"allowDeferLayoutUpdate\", void 0);\n __decorate([\n Property(1000)\n ], PivotView.prototype, \"maxNodeLimitInMemberEditor\", void 0);\n __decorate([\n Property()\n ], PivotView.prototype, \"cellTemplate\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"queryCellInfo\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"headerCellInfo\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"resizing\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"resizeStop\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"pdfHeaderQueryCellInfo\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"pdfQueryCellInfo\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"excelHeaderQueryCellInfo\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"excelQueryCellInfo\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"columnDragStart\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"columnDrag\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"columnDrop\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"beforeColumnsRender\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"selected\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"cellDeselected\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"rowSelected\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"rowDeselected\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"chartTooltipRender\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"chartLoaded\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"chartLoad\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"chartResized\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"chartAxisLabelRender\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"contextMenuClick\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"contextMenuOpen\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"onPdfCellRender\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"saveReport\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"fetchReport\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"loadReport\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"renameReport\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"removeReport\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"newReport\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"toolbarRender\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"toolbarClick\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"load\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"enginePopulating\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"enginePopulated\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"onFieldDropped\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"dataBound\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"destroyed\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"beforeExport\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"cellClick\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"drillThrough\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"beginDrillThrough\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"hyperlinkCellClick\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"cellSelected\", void 0);\n __decorate([\n Event()\n ], PivotView.prototype, \"chartSeriesCreated\", void 0);\n PivotView = PivotView_1 = __decorate([\n NotifyPropertyChanges\n ], PivotView);\n return PivotView;\n}(Component));\nexport { PivotView };\n","import { KeyboardEvents, closest } from '@syncfusion/ej2-base';\nimport * as cls from '../base/css-constant';\n/**\n * Keyboard interaction\n */\n/** @hidden */\nvar CommonKeyboardInteraction = /** @class */ (function () {\n /**\n * Constructor\n */\n function CommonKeyboardInteraction(parent) {\n this.keyConfigs = {\n shiftF: 'shift+F',\n shiftS: 'shift+S',\n delete: 'delete',\n enter: 'enter'\n };\n this.parent = parent;\n this.parent.element.tabIndex = this.parent.element.tabIndex === -1 ? 0 : this.parent.element.tabIndex;\n this.keyboardModule = new KeyboardEvents(this.parent.element, {\n keyAction: this.keyActionHandler.bind(this),\n keyConfigs: this.keyConfigs,\n eventName: 'keydown'\n });\n }\n CommonKeyboardInteraction.prototype.keyActionHandler = function (e) {\n switch (e.action) {\n case 'shiftF':\n this.processFilter(e);\n break;\n case 'shiftS':\n this.processSort(e);\n break;\n case 'delete':\n this.processDelete(e);\n break;\n case 'enter':\n this.processOpenContextMenu(e);\n break;\n }\n };\n CommonKeyboardInteraction.prototype.processOpenContextMenu = function (e) {\n var target = e.target;\n if (target && closest(target, '.' + cls.PIVOT_BUTTON_CLASS) &&\n closest(target, '.' + cls.VALUE_AXIS_CLASS)) {\n target.querySelector('.' + cls.AXISFIELD_ICON_CLASS).click();\n e.preventDefault();\n return;\n }\n };\n CommonKeyboardInteraction.prototype.processSort = function (e) {\n var target = e.target;\n if (target && closest(target, '.' + cls.PIVOT_BUTTON_CLASS) &&\n !closest(target, '.' + cls.VALUE_AXIS_CLASS) && !closest(target, '.' + cls.AXIS_FILTER_CLASS)) {\n target.querySelector('.' + cls.SORT_CLASS).click();\n e.preventDefault();\n return;\n }\n };\n CommonKeyboardInteraction.prototype.processFilter = function (e) {\n var target = e.target;\n if (target && closest(target, '.' + cls.PIVOT_BUTTON_CLASS) && !closest(target, '.' + cls.VALUE_AXIS_CLASS)) {\n target.querySelector('.' + cls.FILTER_COMMON_CLASS).click();\n e.preventDefault();\n return;\n }\n };\n CommonKeyboardInteraction.prototype.processDelete = function (e) {\n var target = e.target;\n if (target && closest(target, '.' + cls.PIVOT_BUTTON_CLASS)) {\n target.querySelector('.' + cls.REMOVE_CLASS).click();\n e.preventDefault();\n return;\n }\n };\n /**\n * To destroy the keyboard module.\n * @return {void}\n * @private\n */\n CommonKeyboardInteraction.prototype.destroy = function () {\n if (this.keyboardModule) {\n this.keyboardModule.destroy();\n }\n else {\n return;\n }\n };\n return CommonKeyboardInteraction;\n}());\nexport { CommonKeyboardInteraction };\n","import { isNullOrUndefined, removeClass, addClass } from '@syncfusion/ej2-base';\nimport { DataManager, Query } from '@syncfusion/ej2-data';\nimport * as cls from '../base/css-constant';\n/**\n * `EventBase` for active fields action.\n */\n/** @hidden */\nvar EventBase = /** @class */ (function () {\n /**\n * Constructor for the dialog action.\n * @hidden\n */\n function EventBase(parent) {\n this.parent = parent;\n }\n /**\n * Updates sorting order for the selected field.\n * @method updateSorting\n * @param {Event} args - Contains clicked element information to update dataSource.\n * @return {void}\n * @hidden\n */\n EventBase.prototype.updateSorting = function (args) {\n if (this.parent.filterDialog.dialogPopUp) {\n this.parent.filterDialog.dialogPopUp.close();\n }\n var target = args.target;\n var fieldName = target.parentElement.id;\n var isDescending = target.classList.contains(cls.SORT_DESCEND_CLASS);\n var sortObj = this.getSortItemByName(fieldName);\n if (!isNullOrUndefined(sortObj)) {\n for (var i = 0; i < this.parent.dataSource.sortSettings.length; i++) {\n if (this.parent.dataSource.sortSettings[i].name === fieldName) {\n this.parent.dataSource.sortSettings.splice(i, 1);\n break;\n }\n }\n var newSortObj = { name: fieldName, order: isDescending ? 'Ascending' : 'Descending' };\n this.parent.dataSource.sortSettings.push(newSortObj);\n }\n else {\n var newSortObj = { name: fieldName, order: isDescending ? 'Ascending' : 'Descending' };\n this.parent.dataSource.sortSettings.push(newSortObj);\n }\n this.parent.control.lastSortInfo = this.parent.dataSource.sortSettings[this.parent.dataSource.sortSettings.length - 1];\n isDescending ? removeClass([target], cls.SORT_DESCEND_CLASS) : addClass([target], cls.SORT_DESCEND_CLASS);\n };\n /**\n * Updates sorting order for the selected field.\n * @method updateFiltering\n * @param {Event} args - Contains clicked element information to update dataSource.\n * @return {void}\n * @hidden\n */\n EventBase.prototype.updateFiltering = function (args) {\n var target = args.target;\n var fieldName = target.parentElement.id;\n var fieldCaption = target.parentElement.textContent;\n var isInclude = false;\n var filterItems = [];\n /* tslint:disable:typedef */\n this.parent.engineModule.fieldList[fieldName].dateMember = this.parent.engineModule.fieldList[fieldName].sort === 'Ascending' ?\n (this.parent.engineModule.fieldList[fieldName].dateMember.sort(function (a, b) { return (a.actualText > b.actualText) ? 1 :\n ((b.actualText > a.actualText) ? -1 : 0); })) :\n this.parent.engineModule.fieldList[fieldName].sort === 'Descending' ?\n (this.parent.engineModule.fieldList[fieldName].dateMember.sort(function (a, b) { return (a.actualText < b.actualText) ? 1 :\n ((b.actualText < a.actualText) ? -1 : 0); })) :\n this.parent.engineModule.fieldList[fieldName].dateMember;\n /* tslint:enable:typedef */\n var filterObj = this.getFilterItemByName(fieldName);\n if (!isNullOrUndefined(filterObj)) {\n isInclude = filterObj.type === 'Include' ? true : false;\n filterItems = filterObj.items ? filterObj.items : [];\n }\n var treeData = this.getTreeData(isInclude, this.parent.engineModule.fieldList[fieldName].dateMember, filterItems, fieldName);\n if (this.parent.filterDialog.dialogPopUp) {\n this.parent.filterDialog.dialogPopUp.close();\n }\n var popupTarget;\n popupTarget = this.parent.moduleName !== 'pivotfieldlist' ?\n popupTarget = this.parent.element : popupTarget = document.getElementById(this.parent.parentID + '_Wrapper');\n this.parent.filterDialog.createFilterDialog(treeData, fieldName, fieldCaption, popupTarget);\n };\n /**\n * Gets sort object for the given field name from the dataSource.\n * @method getSortItemByName\n * @param {string} fieldName - Gets sort settings for the given field name.\n * @return {Sort}\n * @hidden\n */\n EventBase.prototype.getSortItemByName = function (fieldName) {\n var sortObjects = this.parent.dataSource.sortSettings;\n return new DataManager({ json: sortObjects }).executeLocal(new Query().where('name', 'equal', fieldName))[0];\n };\n /**\n * Gets filter object for the given field name from the dataSource.\n * @method getFilterItemByName\n * @param {string} fieldName - Gets filter settings for the given field name.\n * @return {Sort}\n * @hidden\n */\n EventBase.prototype.getFilterItemByName = function (fieldName) {\n var filterObjects = this.parent.dataSource.filterSettings;\n return new DataManager({ json: filterObjects }).executeLocal(new Query().where('name', 'equal', fieldName))[0];\n };\n /**\n * Gets filter object for the given field name from the dataSource.\n * @method getFieldByName\n * @param {string} fieldName - Gets filter settings for the given field name.\n * @return {Sort}\n * @hidden\n */\n EventBase.prototype.getFieldByName = function (fieldName, fields) {\n return new DataManager({ json: fields }).executeLocal(new Query().where('name', 'equal', fieldName))[0];\n };\n /**\n * Gets format object for the given field name from the dataSource.\n * @method getFilterItemByName\n * @param {string} fieldName - Gets format settings for the given field name.\n * @return {IFormatSettings}\n * @hidden\n */\n EventBase.prototype.getFormatItemByName = function (fieldName) {\n var formatObjects = this.parent.dataSource.formatSettings;\n return new DataManager({ json: formatObjects }).executeLocal(new Query().where('name', 'equal', fieldName))[0];\n };\n /**\n * show tree nodes using search text.\n * @hidden\n */\n EventBase.prototype.searchTreeNodes = function (args, treeObj, isFieldCollection) {\n if (isFieldCollection) {\n var searchList = [];\n var nonSearchList = [];\n var list = [].slice.call(treeObj.element.querySelectorAll('li'));\n for (var _i = 0, list_1 = list; _i < list_1.length; _i++) {\n var element = list_1[_i];\n if ((element.querySelector('.e-list-text').textContent.toLowerCase()).indexOf(args.value.toLowerCase()) > -1) {\n searchList.push(element);\n }\n else {\n nonSearchList.push(element);\n }\n }\n treeObj.enableNodes(searchList);\n treeObj.disableNodes(nonSearchList);\n }\n else {\n var searchList = [];\n this.parent.searchTreeItems = [];\n var memberCount = 0;\n memberCount = 1;\n for (var _a = 0, _b = this.parent.currentTreeItems; _a < _b.length; _a++) {\n var item = _b[_a];\n if (item.name.toLowerCase().indexOf(args.value.toLowerCase()) > -1) {\n this.parent.searchTreeItems.push(item);\n if (memberCount <= this.parent.control.maxNodeLimitInMemberEditor) {\n searchList.push(item);\n }\n memberCount++;\n }\n }\n memberCount--;\n if (memberCount > this.parent.control.maxNodeLimitInMemberEditor) {\n this.parent.editorLabelElement.innerText = (memberCount - this.parent.control.maxNodeLimitInMemberEditor) +\n this.parent.control.localeObj.getConstant('editorDataLimitMsg');\n this.parent.filterDialog.dialogPopUp.height = (this.parent.filterDialog.allowExcelLikeFilter ? '440px' : '400px');\n this.parent.isDataOverflow = true;\n }\n else {\n this.parent.editorLabelElement.innerText = '';\n this.parent.filterDialog.dialogPopUp.height = (this.parent.filterDialog.allowExcelLikeFilter ? '400px' : '350px');\n this.parent.isDataOverflow = false;\n }\n this.parent.isDataOverflow = (memberCount > this.parent.control.maxNodeLimitInMemberEditor);\n this.parent.editorLabelElement.parentElement.style.display = this.parent.isDataOverflow ? 'inline-block' : 'none';\n treeObj.fields = { dataSource: searchList, id: 'id', text: 'name', isChecked: 'checkedStatus' };\n treeObj.dataBind();\n }\n };\n EventBase.prototype.getTreeData = function (isInclude, members, filterItems, fieldName) {\n this.parent.currentTreeItems = [];\n this.parent.searchTreeItems = [];\n this.parent.currentTreeItemsPos = {};\n this.parent.savedTreeFilterPos = {};\n this.parent.isDateField = this.parent.engineModule.formatFields[fieldName] &&\n ((['date', 'dateTime', 'time']).indexOf(this.parent.engineModule.formatFields[fieldName].type) > -1);\n var list = [];\n var memberCount = 1;\n var filterObj = {};\n for (var _i = 0, filterItems_1 = filterItems; _i < filterItems_1.length; _i++) {\n var item = filterItems_1[_i];\n filterObj[item] = item;\n }\n for (var _a = 0, members_1 = members; _a < members_1.length; _a++) {\n var member = members_1[_a];\n var memberName = this.parent.isDateField ? member.formattedText : member.actualText.toString();\n var obj = {\n id: member.actualText.toString(),\n name: memberName,\n checkedStatus: isInclude ? false : true\n };\n if (filterObj[memberName] !== undefined) {\n obj.checkedStatus = isInclude ? true : false;\n }\n if (memberCount <= this.parent.control.maxNodeLimitInMemberEditor) {\n list.push(obj);\n }\n if (!obj.checkedStatus) {\n this.parent.savedTreeFilterPos[memberCount - 1] = memberName;\n }\n this.parent.currentTreeItems.push(obj);\n this.parent.searchTreeItems.push(obj);\n this.parent.currentTreeItemsPos[member.actualText] = memberCount - 1;\n memberCount++;\n }\n this.parent.isDataOverflow = ((memberCount - 1) > this.parent.control.maxNodeLimitInMemberEditor);\n return list;\n };\n return EventBase;\n}());\nexport { EventBase };\n","import { isNullOrUndefined, closest } from '@syncfusion/ej2-base';\nimport * as cls from '../base/css-constant';\n/**\n * `DialogAction` module is used to handle field list dialog related behaviour.\n */\n/** @hidden */\nvar NodeStateModified = /** @class */ (function () {\n /**\n * Constructor for the dialog action.\n * @hidden\n */\n function NodeStateModified(parent) {\n this.parent = parent;\n }\n /**\n * Updates the dataSource by drag and drop the selected field from either field list or axis table with dropped target position.\n * @method onStateModified\n * @param {DragEventArgs & DragAndDropEventArgs} args - Contains both pivot button and field list drag and drop information.\n * @param {string} fieldName - Defines dropped field name to update dataSource.\n * @return {void}\n * @hidden\n */\n NodeStateModified.prototype.onStateModified = function (args, fieldName) {\n var droppedClass = '';\n var nodeDropped = true;\n var target = closest(args.target, '.' + cls.DROPPABLE_CLASS);\n var droppedPosition = -1;\n this.parent.dataSourceUpdate.btnElement = args.element ? args.element.parentElement : undefined;\n if (target) {\n droppedClass = target.classList[1] === cls.ROW_AXIS_CLASS ?\n 'rows' : target.classList[1] === cls.COLUMN_AXIS_CLASS ? 'columns' : target.classList[1] === cls.VALUE_AXIS_CLASS ?\n 'values' : target.classList[1] === cls.FILTER_AXIS_CLASS ? 'filters' : '';\n }\n if ((args.cancel && droppedClass === '') ||\n (this.parent.dataSourceUpdate.btnElement && this.parent.dataSourceUpdate.btnElement.getAttribute('isValue') === 'true' &&\n ((droppedClass === 'filters' || droppedClass === 'values') ||\n droppedClass.indexOf(this.parent.dataSource.valueAxis) > -1))) {\n nodeDropped = false;\n return nodeDropped;\n }\n if (droppedClass !== '') {\n if (this.parent.engineModule.fieldList[fieldName] &&\n this.parent.engineModule.fieldList[fieldName].aggregateType === 'CalculatedField' && droppedClass !== 'values') {\n var title = this.parent.localeObj.getConstant('warning');\n var description = this.parent.localeObj.getConstant('dropAction');\n this.parent.errorDialog.createErrorDialog(title, description);\n nodeDropped = false;\n return nodeDropped;\n }\n droppedPosition = this.getButtonPosition(args.target, droppedClass);\n }\n else if (this.parent.engineModule.fieldList[fieldName]) {\n this.parent.engineModule.fieldList[fieldName].isSelected = false;\n }\n this.parent.dataSourceUpdate.updateDataSource(fieldName, droppedClass, droppedPosition);\n return nodeDropped;\n };\n NodeStateModified.prototype.getButtonPosition = function (target, droppedClass) {\n var droppedPosition = -1;\n var targetBtn = closest(target, '.' + cls.PIVOT_BUTTON_WRAPPER_CLASS);\n if (!isNullOrUndefined(targetBtn)) {\n targetBtn = targetBtn.querySelector('.' + cls.PIVOT_BUTTON_CLASS);\n var axisPanel = this.parent.element.querySelector('.e-' + droppedClass);\n var pivotButtons = [].slice.call(axisPanel.querySelectorAll('.' + cls.PIVOT_BUTTON_CLASS));\n for (var i = 0, n = pivotButtons.length; i < n; i++) {\n if (pivotButtons[i].id === targetBtn.id) {\n droppedPosition = i;\n break;\n }\n }\n }\n return droppedPosition;\n };\n return NodeStateModified;\n}());\nexport { NodeStateModified };\n","import * as events from '../../common/base/constant';\n/**\n * `DataSourceUpdate` module is used to update the dataSource.\n */\n/** @hidden */\nvar DataSourceUpdate = /** @class */ (function () {\n /**\n * Constructor for the dialog action.\n * @hidden\n */\n function DataSourceUpdate(parent) {\n this.parent = parent;\n }\n /**\n * Updates the dataSource by adding the given field along with field dropped position to the dataSource.\n * @param {string} fieldName - Defines dropped field name to update dataSource.\n * @param {string} droppedClass - Defines dropped field axis name to update dataSource.\n * @param {number} fieldCaption - Defines dropped position to the axis based on field position.\n * @method updateDataSource\n * @return {void}\n * @hidden\n */\n DataSourceUpdate.prototype.updateDataSource = function (fieldName, droppedClass, droppedPosition) {\n var dataSourceItem;\n if (this.control && this.btnElement && this.btnElement.getAttribute('isvalue') === 'true') {\n switch (droppedClass) {\n case '':\n this.control.setProperties({ dataSource: { values: [] } }, true);\n break;\n case 'rows':\n this.control.setProperties({ dataSource: { valueAxis: 'row' } }, true);\n break;\n case 'columns':\n this.control.setProperties({ dataSource: { valueAxis: 'column' } }, true);\n break;\n }\n }\n else {\n dataSourceItem = this.removeFieldFromReport(fieldName.toString());\n dataSourceItem = dataSourceItem ? dataSourceItem : this.getNewField(fieldName.toString());\n if (dataSourceItem.type === 'CalculatedField' && droppedClass !== '') {\n droppedClass = 'values';\n }\n }\n if (this.control) {\n var eventArgs = {\n 'droppedField': dataSourceItem, 'dataSource': this.parent.dataSource, 'droppedAxis': droppedClass\n };\n this.control.trigger(events.onFieldDropped, eventArgs);\n }\n if (dataSourceItem) {\n switch (droppedClass) {\n case 'filters':\n droppedPosition !== -1 ?\n this.parent.dataSource.filters.splice(droppedPosition, 0, dataSourceItem) :\n this.parent.dataSource.filters.push(dataSourceItem);\n break;\n case 'rows':\n droppedPosition !== -1 ?\n this.parent.dataSource.rows.splice(droppedPosition, 0, dataSourceItem) :\n this.parent.dataSource.rows.push(dataSourceItem);\n break;\n case 'columns':\n droppedPosition !== -1 ?\n this.parent.dataSource.columns.splice(droppedPosition, 0, dataSourceItem) :\n this.parent.dataSource.columns.push(dataSourceItem);\n break;\n case 'values':\n droppedPosition !== -1 ?\n this.parent.dataSource.values.splice(droppedPosition, 0, dataSourceItem) :\n this.parent.dataSource.values.push(dataSourceItem);\n break;\n }\n }\n };\n /**\n * Updates the dataSource by removing the given field from the dataSource.\n * @param {string} fieldName - Defines dropped field name to remove dataSource.\n * @method removeFieldFromReport\n * @return {void}\n * @hidden\n */\n DataSourceUpdate.prototype.removeFieldFromReport = function (fieldName) {\n var dataSourceItem;\n var isDataSource = false;\n var rows = this.parent.dataSource.rows;\n var columns = this.parent.dataSource.columns;\n var values = this.parent.dataSource.values;\n var filters = this.parent.dataSource.filters;\n var fields = [rows, columns, values, filters];\n var field = this.parent.engineModule.fieldList[fieldName];\n for (var len = 0, lnt = fields.length; len < lnt; len++) {\n if (!isDataSource && fields[len]) {\n for (var i = 0, n = fields[len].length; i < n; i++) {\n if (fields[len][i].name === fieldName) {\n dataSourceItem = fields[len][i].properties ?\n fields[len][i].properties : fields[len][i];\n dataSourceItem.type = field.type === 'number' ? dataSourceItem.type :\n 'Count';\n fields[len].splice(i, 1);\n isDataSource = true;\n break;\n }\n }\n }\n }\n return dataSourceItem;\n };\n /**\n * Creates new field object given field name from the field list data.\n * @param {string} fieldName - Defines dropped field name to add dataSource.\n * @method getNewField\n * @return {void}\n * @hidden\n */\n DataSourceUpdate.prototype.getNewField = function (fieldName) {\n var field = this.parent.engineModule.fieldList[fieldName];\n var newField = {\n name: fieldName,\n caption: field.caption,\n type: field.aggregateType === undefined ? field.type === 'number' ? 'Sum' :\n 'Count' : field.aggregateType,\n showNoDataItems: field.showNoDataItems,\n baseField: field.baseField,\n baseItem: field.baseItem,\n };\n return newField;\n };\n return DataSourceUpdate;\n}());\nexport { DataSourceUpdate };\n","import { createElement, remove } from '@syncfusion/ej2-base';\nimport * as cls from '../base/css-constant';\nimport { Dialog } from '@syncfusion/ej2-popups';\n/**\n * `ErrorDialog` module to create error dialog.\n */\n/** @hidden */\nvar ErrorDialog = /** @class */ (function () {\n /**\n * Constructor for the dialog action.\n * @hidden\n */\n function ErrorDialog(parent) {\n this.parent = parent;\n }\n /**\n * Creates the error dialog for the unexpected action done.\n * @method createErrorDialog\n * @return {void}\n * @hidden\n */\n ErrorDialog.prototype.createErrorDialog = function (title, description) {\n var errorDialog = createElement('div', {\n id: this.parent.parentID + '_ErrorDialog',\n className: cls.ERROR_DIALOG_CLASS\n });\n this.parent.element.appendChild(errorDialog);\n this.errorPopUp = new Dialog({\n animationSettings: { effect: 'Fade' },\n allowDragging: false,\n header: title,\n content: description,\n isModal: true,\n visible: true,\n showCloseIcon: true,\n enableRtl: this.parent.enableRtl,\n width: 'auto',\n height: 'auto',\n zIndex: 1000001,\n position: { X: 'center', Y: 'center' },\n buttons: [\n {\n click: this.closeErrorDialog.bind(this),\n buttonModel: { cssClass: cls.OK_BUTTON_CLASS, content: this.parent.localeObj.getConstant('ok'), isPrimary: true }\n }\n ],\n closeOnEscape: true,\n target: document.body,\n close: this.removeErrorDialog.bind(this)\n });\n this.errorPopUp.appendTo(errorDialog);\n };\n ErrorDialog.prototype.closeErrorDialog = function () {\n this.errorPopUp.close();\n };\n ErrorDialog.prototype.removeErrorDialog = function () {\n if (this.errorPopUp && !this.errorPopUp.isDestroyed) {\n this.errorPopUp.destroy();\n }\n if (document.getElementById(this.parent.parentID + '_ErrorDialog')) {\n remove(document.getElementById(this.parent.parentID + '_ErrorDialog'));\n }\n };\n return ErrorDialog;\n}());\nexport { ErrorDialog };\n","import { createElement, removeClass, addClass, remove, isNullOrUndefined, setStyleAttribute } from '@syncfusion/ej2-base';\nimport * as cls from '../base/css-constant';\nimport { TreeView, Tab } from '@syncfusion/ej2-navigations';\nimport { Dialog } from '@syncfusion/ej2-popups';\nimport { MaskedTextBox, NumericTextBox } from '@syncfusion/ej2-inputs';\nimport { setStyleAndAttributes } from '@syncfusion/ej2-grids';\nimport { DropDownList } from '@syncfusion/ej2-dropdowns';\nimport { DateTimePicker } from '@syncfusion/ej2-calendars';\n/**\n * `FilterDialog` module to create filter dialog.\n */\n/** @hidden */\nvar FilterDialog = /** @class */ (function () {\n /**\n * Constructor for the dialog action.\n * @hidden\n */\n function FilterDialog(parent) {\n this.parent = parent;\n }\n /**\n * Creates the member filter dialog for the selected field.\n * @method createFilterDialog\n * @return {void}\n * @hidden\n */\n FilterDialog.prototype.createFilterDialog = function (treeData, fieldName, fieldCaption, target) {\n var editorDialog = createElement('div', {\n id: this.parent.parentID + '_EditorTreeView',\n className: cls.MEMBER_EDITOR_DIALOG_CLASS,\n attrs: { 'data-fieldName': fieldName, 'aria-label': fieldCaption },\n styles: 'visibility:hidden;'\n });\n var filterCaption = this.parent.engineModule.fieldList[fieldName].caption;\n var headerTemplate = this.parent.localeObj.getConstant('filter') + ' ' +\n '\"' + fieldCaption + '\"' + ' ' + this.parent.localeObj.getConstant('by');\n this.filterObject = this.getFilterObject(fieldName);\n this.allowExcelLikeFilter = this.isExcelFilter(fieldName);\n this.parent.element.appendChild(editorDialog);\n this.dialogPopUp = new Dialog({\n animationSettings: { effect: (this.allowExcelLikeFilter ? 'None' : 'Fade') },\n allowDragging: false,\n header: (this.allowExcelLikeFilter ? headerTemplate : filterCaption),\n content: (this.allowExcelLikeFilter ? '' : this.createTreeView(treeData, fieldCaption, fieldName)),\n isModal: this.parent.renderMode === 'Popup' ? true : this.parent.isAdaptive ? true : false,\n visible: true,\n showCloseIcon: this.allowExcelLikeFilter ? true : false,\n enableRtl: this.parent.enableRtl,\n width: 'auto',\n height: this.parent.isDataOverflow ? (this.allowExcelLikeFilter ? '440px' : '400px') :\n (this.allowExcelLikeFilter ? '400px' : '350px'),\n position: { X: 'center', Y: 'center' },\n buttons: [\n {\n buttonModel: {\n cssClass: cls.OK_BUTTON_CLASS, content: this.parent.localeObj.getConstant('ok'), isPrimary: true\n }\n },\n {\n buttonModel: {\n cssClass: 'e-clear-filter-button' + (this.allowExcelLikeFilter ? '' : ' ' + cls.ICON_DISABLE),\n iconCss: 'e-icons e-clear-filter-icon', enableRtl: this.parent.enableRtl,\n content: this.parent.localeObj.getConstant('clearFilter'), disabled: (this.filterObject ? false : true)\n }\n },\n {\n click: this.closeFilterDialog.bind(this),\n buttonModel: { cssClass: cls.CANCEL_BUTTON_CLASS, content: this.parent.localeObj.getConstant('cancel') }\n }\n ],\n closeOnEscape: true,\n target: target,\n close: this.removeFilterDialog.bind(this),\n /* tslint:disable-next-line:typedef */\n open: this.dialogOpen.bind(this)\n });\n this.dialogPopUp.appendTo(editorDialog);\n if (this.allowExcelLikeFilter) {\n this.createTabMenu(treeData, fieldCaption, fieldName);\n addClass([this.dialogPopUp.element], 'e-excel-filter');\n this.updateCheckedState(fieldCaption);\n }\n else {\n this.updateCheckedState(fieldCaption);\n }\n setStyleAttribute(this.dialogPopUp.element, { 'visibility': 'visible' });\n if (this.allowExcelLikeFilter) {\n this.dialogPopUp.element.querySelector('.e-dlg-closeicon-btn').focus();\n }\n else {\n return;\n }\n };\n FilterDialog.prototype.dialogOpen = function (args) {\n if (args.element.querySelector('.e-editor-label-wrapper')) {\n args.element.querySelector('.e-editor-label-wrapper').style.width =\n args.element.offsetWidth + 'px';\n }\n };\n FilterDialog.prototype.createTreeView = function (treeData, fieldCaption, fieldName) {\n var _this = this;\n var editorTreeWrapper = createElement('div', {\n id: this.parent.parentID + 'EditorDiv',\n className: cls.EDITOR_TREE_WRAPPER_CLASS + (this.allowExcelLikeFilter ? ' e-excelfilter' : '')\n });\n var searchWrapper = createElement('div', {\n id: this.parent.parentID + '_SearchDiv', attrs: { 'tabindex': '-1' },\n className: cls.EDITOR_SEARCH_WRAPPER_CLASS\n });\n var filterCaption = this.parent.engineModule.fieldList[fieldName].caption;\n var editorSearch = createElement('input', { attrs: { 'type': 'text' } });\n var labelWrapper = createElement('div', {\n id: this.parent.parentID + '_LabelDiv', attrs: { 'tabindex': '-1' },\n className: cls.EDITOR_LABEL_WRAPPER_CLASS\n });\n this.parent.editorLabelElement = createElement('label', { className: cls.EDITOR_LABEL_CLASS });\n this.parent.editorLabelElement.innerText = this.parent.isDataOverflow ?\n ((this.parent.currentTreeItems.length - this.parent.control.maxNodeLimitInMemberEditor) +\n this.parent.control.localeObj.getConstant('editorDataLimitMsg')) : '';\n labelWrapper.style.display = this.parent.isDataOverflow ? 'inline-block' : 'none';\n labelWrapper.appendChild(this.parent.editorLabelElement);\n searchWrapper.appendChild(editorSearch);\n var selectAllWrapper = createElement('div', {\n id: this.parent.parentID + '_AllDiv', attrs: { 'tabindex': '-1' },\n className: cls.SELECT_ALL_WRAPPER_CLASS\n });\n var selectAllContainer = createElement('div', { className: cls.SELECT_ALL_CLASS });\n var treeViewContainer = createElement('div', { className: cls.EDITOR_TREE_CONTAINER_CLASS });\n var promptDiv = createElement('div', {\n className: cls.EMPTY_MEMBER_CLASS + ' ' + cls.ICON_DISABLE,\n innerHTML: this.parent.localeObj.getConstant('noMatches')\n });\n selectAllWrapper.appendChild(selectAllContainer);\n editorTreeWrapper.appendChild(searchWrapper);\n editorTreeWrapper.appendChild(selectAllWrapper);\n editorTreeWrapper.appendChild(promptDiv);\n this.editorSearch = new MaskedTextBox({\n placeholder: this.parent.localeObj.getConstant('search') + ' ' + '\"' + filterCaption + '\"',\n enableRtl: this.parent.enableRtl,\n cssClass: cls.EDITOR_SEARCH_CLASS,\n showClearButton: true,\n change: function (e) {\n _this.parent.eventBase.searchTreeNodes(e, _this.memberTreeView, false);\n var filterDialog = _this.dialogPopUp.element;\n var liList = [].slice.call(_this.memberTreeView.element.querySelectorAll('li'));\n if (liList.length === 0) {\n _this.allMemberSelect.disableNodes([_this.allMemberSelect.element.querySelector('li')]);\n filterDialog.querySelector('.' + cls.OK_BUTTON_CLASS).setAttribute('disabled', 'disabled');\n removeClass([promptDiv], cls.ICON_DISABLE);\n }\n else {\n _this.allMemberSelect.enableNodes([_this.allMemberSelect.element.querySelector('li')]);\n filterDialog.querySelector('.' + cls.OK_BUTTON_CLASS).removeAttribute('disabled');\n addClass([promptDiv], cls.ICON_DISABLE);\n }\n _this.updateCheckedState(fieldCaption);\n }\n });\n this.editorSearch.appendTo(editorSearch);\n var data = [{ id: 'all', name: 'All', checkedStatus: true }];\n this.allMemberSelect = new TreeView({\n fields: { dataSource: data, id: 'id', text: 'name', isChecked: 'checkedStatus', },\n showCheckBox: true,\n enableRtl: this.parent.enableRtl,\n });\n this.allMemberSelect.appendTo(selectAllContainer);\n editorTreeWrapper.appendChild(treeViewContainer);\n this.memberTreeView = new TreeView({\n fields: { dataSource: treeData, id: 'id', text: 'name', isChecked: 'checkedStatus' },\n showCheckBox: true,\n enableRtl: this.parent.enableRtl,\n nodeChecking: this.validateTreeNode.bind(this)\n });\n this.memberTreeView.appendTo(treeViewContainer);\n editorTreeWrapper.appendChild(labelWrapper);\n return editorTreeWrapper;\n };\n FilterDialog.prototype.createTabMenu = function (treeData, fieldCaption, fieldName) {\n var wrapper = createElement('div', {\n className: 'e-filter-tab-wrapper'\n });\n this.dialogPopUp.content = wrapper;\n this.dialogPopUp.dataBind();\n var types = ['Label', 'Value', 'Include', 'Exclude'];\n var regx = '((-|\\\\+)?[0-9]+(\\\\.[0-9]+)?)+';\n var member = Object.keys(this.parent.engineModule.fieldList[fieldName].members)[0];\n var fieldType = this.parent.engineModule.fieldList[fieldName].type;\n var formatObj = this.parent.eventBase.getFormatItemByName(fieldName);\n var items = [\n {\n header: {\n text: this.parent.localeObj.getConstant('member'),\n iconCss: (this.filterObject && types.indexOf(this.filterObject.type) > 1 ? cls.SELECTED_OPTION_ICON_CLASS : '')\n },\n content: this.createTreeView(treeData, fieldCaption, fieldName)\n }\n ];\n for (var _i = 0, types_1 = types; _i < types_1.length; _i++) {\n var type = types_1[_i];\n if (((type === 'Label') && this.parent.dataSource.allowLabelFilter) ||\n (type === 'Value' && this.parent.dataSource.allowValueFilter)) {\n var filterType = (type === 'Label' && ((member).match(regx) &&\n (member).match(regx)[0].length === (member).length) && fieldType === 'number') ? 'Number' :\n (type === 'Label' && (new Date(member).toString() !== 'Invalid Date') &&\n ((formatObj && formatObj.type) || (this.filterObject && this.filterObject.type === 'Date'))) ? 'Date' : type;\n var item = {\n header: {\n text: (filterType === 'Number' ? this.parent.localeObj.getConstant('label') :\n this.parent.localeObj.getConstant(filterType.toLowerCase())),\n iconCss: (this.filterObject && this.filterObject.type === filterType ? cls.SELECTED_OPTION_ICON_CLASS : '')\n },\n /* tslint:disable-next-line:max-line-length */\n content: this.createCustomFilter(fieldName, (this.filterObject && this.filterObject.type === filterType ? this.filterObject : undefined), filterType.toLowerCase())\n };\n items.push(item);\n }\n }\n var selectedIndex = (this.filterObject ? (['Label', 'Date', 'Number'].indexOf(this.filterObject.type) >= 0) ?\n 1 : this.filterObject.type === 'Value' ?\n (this.parent.dataSource.allowLabelFilter && this.parent.dataSource.allowValueFilter) ? 2 : 1 : 0 : 0);\n this.tabObj = new Tab({\n heightAdjustMode: 'Auto',\n items: items,\n height: '100%',\n selectedItem: selectedIndex,\n enableRtl: this.parent.enableRtl\n });\n this.tabObj.appendTo(wrapper);\n if (selectedIndex > 0) {\n /* tslint:disable-next-line:max-line-length */\n addClass([this.dialogPopUp.element.querySelector('.e-filter-div-content' + '.' + (selectedIndex === 1 && this.parent.dataSource.allowLabelFilter ? 'e-label-filter' : 'e-value-filter'))], 'e-selected-tab');\n }\n };\n FilterDialog.prototype.createCustomFilter = function (fieldName, filterObject, type) {\n var dataSource = [];\n var valueOptions = [];\n var measures = this.parent.dataSource.values;\n var selectedOption = 'DoesNotEquals';\n var selectedValueIndex = 0;\n var options = {\n label: ['Equals', 'DoesNotEquals', 'BeginWith', 'DoesNotBeginWith', 'EndsWith',\n 'DoesNotEndsWith', 'Contains', 'DoesNotContains', 'GreaterThan',\n 'GreaterThanOrEqualTo', 'LessThan', 'LessThanOrEqualTo', 'Between', 'NotBetween'],\n date: ['Equals', 'DoesNotEquals', 'Before', 'BeforeOrEqualTo', 'After', 'AfterOrEqualTo',\n 'Between', 'NotBetween'],\n value: ['Equals', 'DoesNotEquals', 'GreaterThan', 'GreaterThanOrEqualTo', 'LessThan',\n 'LessThanOrEqualTo', 'Between', 'NotBetween']\n };\n var betweenOperators = ['Between', 'NotBetween'];\n var operatorCollection = (type === 'label' ? options.label : type === 'date' ? options.date : options.value);\n for (var _i = 0, operatorCollection_1 = operatorCollection; _i < operatorCollection_1.length; _i++) {\n var operator = operatorCollection_1[_i];\n selectedOption = ((filterObject && operator === filterObject.condition) ?\n operatorCollection.indexOf(filterObject.condition) >= 0 ?\n filterObject.condition : operatorCollection[0] : selectedOption);\n dataSource.push({ value: operator, text: this.parent.localeObj.getConstant(operator) });\n }\n var len = measures.length;\n while (len--) {\n valueOptions.unshift({ value: measures[len].name, text: (measures[len].caption ? measures[len].caption : measures[len].name) });\n selectedValueIndex = filterObject && filterObject.type === 'Value' &&\n filterObject.measure === measures[len].name &&\n filterObject.condition === selectedOption ? len : selectedValueIndex;\n }\n var mainDiv = createElement('div', {\n className: cls.FILTER_DIV_CONTENT_CLASS + ' e-' + ((['date', 'number']).indexOf(type) >= 0 ? 'label' : type) + '-filter',\n id: this.parent.parentID + '_' + type + '_filter_div_content',\n attrs: {\n 'data-type': type, 'data-fieldName': fieldName, 'data-operator': selectedOption,\n 'data-measure': (this.parent.dataSource.values.length > 0 ? this.parent.dataSource.values[selectedValueIndex].name : ''),\n 'data-value1': (filterObject && selectedOption === filterObject.condition ? filterObject.value1.toString() : ''),\n 'data-value2': (filterObject && selectedOption === filterObject.condition ? filterObject.value1.toString() : '')\n }\n });\n var textContentdiv = createElement('div', {\n className: cls.FILTER_TEXT_DIV_CLASS,\n innerHTML: this.parent.localeObj.getConstant(type + 'TextContent')\n });\n var betweenTextContentdiv = createElement('div', {\n className: cls.BETWEEN_TEXT_DIV_CLASS + ' ' +\n (betweenOperators.indexOf(selectedOption) === -1 ? cls.ICON_DISABLE : ''),\n innerHTML: this.parent.localeObj.getConstant('And')\n });\n var separatordiv = createElement('div', { className: cls.SEPARATOR_DIV_CLASS });\n var filterWrapperDiv1 = createElement('div', { className: cls.FILTER_OPTION_WRAPPER_1_CLASS });\n var optionWrapperDiv1 = createElement('div', {\n className: 'e-measure-option-wrapper' + ' ' + (((['label', 'date', 'number']).indexOf(type) >= 0) ? cls.ICON_DISABLE : ''),\n });\n var optionWrapperDiv2 = createElement('div', { className: 'e-condition-option-wrapper' });\n var filterWrapperDiv2 = createElement('div', { className: cls.FILTER_OPTION_WRAPPER_2_CLASS });\n var dropOptionDiv1 = createElement('div', { id: this.parent.parentID + '_' + type + '_measure_option_wrapper' });\n var dropOptionDiv2 = createElement('div', { id: this.parent.parentID + '_' + type + '_contition_option_wrapper' });\n var inputDiv1 = createElement('div', { className: cls.FILTER_INPUT_DIV_1_CLASS });\n var inputDiv2 = createElement('div', {\n className: cls.FILTER_INPUT_DIV_2_CLASS + ' ' +\n (betweenOperators.indexOf(selectedOption) === -1 ? cls.ICON_DISABLE : '')\n });\n var inputField1 = createElement('input', {\n id: this.parent.parentID + '_' + type + '_input_option_1', attrs: { 'type': 'text' }\n });\n var inputField2 = createElement('input', {\n id: this.parent.parentID + '_' + type + '_input_option_2', attrs: { 'type': 'text' }\n });\n inputDiv1.appendChild(inputField1);\n inputDiv2.appendChild(inputField2);\n optionWrapperDiv1.appendChild(dropOptionDiv1);\n optionWrapperDiv1.appendChild(separatordiv);\n optionWrapperDiv2.appendChild(dropOptionDiv2);\n filterWrapperDiv1.appendChild(optionWrapperDiv1);\n filterWrapperDiv1.appendChild(optionWrapperDiv2);\n filterWrapperDiv2.appendChild(inputDiv1);\n filterWrapperDiv2.appendChild(betweenTextContentdiv);\n filterWrapperDiv2.appendChild(inputDiv2);\n /* tslint:disable-next-line:max-line-length */\n this.createElements(filterObject, betweenOperators, dropOptionDiv1, dropOptionDiv2, inputField1, inputField2, valueOptions, dataSource, selectedValueIndex, selectedOption, type);\n mainDiv.appendChild(textContentdiv);\n mainDiv.appendChild(filterWrapperDiv1);\n mainDiv.appendChild(filterWrapperDiv2);\n return mainDiv;\n };\n /* tslint:disable */\n FilterDialog.prototype.createElements = function (filterObj, operators, optionDiv1, optionDiv2, inputDiv1, inputDiv2, vDataSource, oDataSource, valueIndex, option, type) {\n var popupInstance = this;\n var optionWrapper1 = new DropDownList({\n dataSource: vDataSource, enableRtl: this.parent.enableRtl,\n fields: { value: 'value', text: 'text' }, index: valueIndex,\n cssClass: cls.VALUE_OPTIONS_CLASS, width: '100%',\n change: function (args) {\n var element = popupInstance.dialogPopUp.element.querySelector('.e-selected-tab');\n if (!isNullOrUndefined(element)) {\n popupInstance.updateInputValues(element, type, inputDiv1, inputDiv2);\n setStyleAndAttributes(element, { 'data-measure': args.value });\n }\n else {\n return;\n }\n }\n });\n optionWrapper1.appendTo(optionDiv1);\n var optionWrapper = new DropDownList({\n dataSource: oDataSource, enableRtl: this.parent.enableRtl,\n fields: { value: 'value', text: 'text' }, value: option,\n cssClass: cls.FILTER_OPERATOR_CLASS, width: '100%',\n change: function (args) {\n var element = popupInstance.dialogPopUp.element.querySelector('.e-selected-tab');\n if (!isNullOrUndefined(element)) {\n popupInstance.updateInputValues(element, type, inputDiv1, inputDiv2);\n var disabledClasses = [cls.BETWEEN_TEXT_DIV_CLASS, cls.FILTER_INPUT_DIV_2_CLASS];\n for (var _i = 0, disabledClasses_1 = disabledClasses; _i < disabledClasses_1.length; _i++) {\n var className = disabledClasses_1[_i];\n if (operators.indexOf(args.value) >= 0) {\n removeClass([element.querySelector('.' + className)], cls.ICON_DISABLE);\n }\n else {\n addClass([element.querySelector('.' + className)], cls.ICON_DISABLE);\n }\n }\n setStyleAndAttributes(element, { 'data-operator': args.value });\n }\n else {\n return;\n }\n }\n });\n optionWrapper.appendTo(optionDiv2);\n if (type === 'date') {\n var inputObj1_1 = new DateTimePicker({\n placeholder: this.parent.localeObj.getConstant('chooseDate'),\n enableRtl: this.parent.enableRtl,\n format: 'dd/MM/yyyy hh:mm:ss a',\n showClearButton: true,\n value: (filterObj && option === filterObj.condition ? filterObj.value1 : null),\n change: function (e) {\n var element = popupInstance.dialogPopUp.element.querySelector('.e-selected-tab');\n if (!isNullOrUndefined(element)) {\n setStyleAndAttributes(element, { 'data-value1': e.value, 'data-value2': inputObj2_1.value });\n }\n else {\n return;\n }\n },\n width: '100%',\n });\n var inputObj2_1 = new DateTimePicker({\n placeholder: this.parent.localeObj.getConstant('chooseDate'),\n enableRtl: this.parent.enableRtl,\n format: 'dd/MM/yyyy hh:mm:ss a',\n showClearButton: true,\n value: (filterObj && option === filterObj.condition ? filterObj.value2 : null),\n change: function (e) {\n var element = popupInstance.dialogPopUp.element.querySelector('.e-selected-tab');\n if (!isNullOrUndefined(element)) {\n setStyleAndAttributes(element, { 'data-value1': inputObj1_1.value, 'data-value2': e.value });\n }\n else {\n return;\n }\n },\n width: '100%',\n });\n inputObj1_1.appendTo(inputDiv1);\n inputObj2_1.appendTo(inputDiv2);\n }\n else if (type === 'value') {\n var inputObj1_2 = new NumericTextBox({\n placeholder: this.parent.localeObj.getConstant('enterValue'),\n enableRtl: this.parent.enableRtl,\n showClearButton: true,\n format: '###.##',\n value: (filterObj && option === filterObj.condition ? parseInt(filterObj.value1, 10) : undefined),\n change: function (e) {\n var element = popupInstance.dialogPopUp.element.querySelector('.e-selected-tab');\n if (!isNullOrUndefined(element)) {\n setStyleAndAttributes(element, {\n 'data-value1': (e.value ? e.value.toString() : '0'),\n 'data-value2': (inputObj2_2.value ? inputObj2_2.value.toString() : '0')\n });\n }\n else {\n return;\n }\n }, width: '100%'\n });\n var inputObj2_2 = new NumericTextBox({\n placeholder: this.parent.localeObj.getConstant('enterValue'),\n enableRtl: this.parent.enableRtl,\n showClearButton: true,\n format: '###.##',\n value: (filterObj && option === filterObj.condition ? parseInt(filterObj.value2, 10) : undefined),\n change: function (e) {\n var element = popupInstance.dialogPopUp.element.querySelector('.e-selected-tab');\n if (!isNullOrUndefined(element)) {\n setStyleAndAttributes(element, {\n 'data-value1': (inputObj1_2.value ? inputObj1_2.value.toString() : '0'),\n 'data-value2': (e.value ? e.value.toString() : '0')\n });\n }\n else {\n return;\n }\n }, width: '100%'\n });\n inputObj1_2.appendTo(inputDiv1);\n inputObj2_2.appendTo(inputDiv2);\n }\n else {\n var inputObj1_3 = new MaskedTextBox({\n placeholder: this.parent.localeObj.getConstant('enterValue'),\n enableRtl: this.parent.enableRtl,\n showClearButton: true,\n value: (filterObj && option === filterObj.condition ? filterObj.value1 : ''),\n change: function (e) {\n var element = popupInstance.dialogPopUp.element.querySelector('.e-selected-tab');\n if (!isNullOrUndefined(element)) {\n setStyleAndAttributes(element, { 'data-value1': e.value, 'data-value2': inputObj2_3.value });\n }\n else {\n return;\n }\n }, width: '100%'\n });\n var inputObj2_3 = new MaskedTextBox({\n placeholder: this.parent.localeObj.getConstant('enterValue'),\n enableRtl: this.parent.enableRtl,\n showClearButton: true,\n value: (filterObj && option === filterObj.condition ? filterObj.value2 : ''),\n change: function (e) {\n var element = popupInstance.dialogPopUp.element.querySelector('.e-selected-tab');\n if (!isNullOrUndefined(element)) {\n setStyleAndAttributes(element, { 'data-value1': inputObj1_3.value, 'data-value2': e.value });\n }\n else {\n return;\n }\n }, width: '100%'\n });\n inputObj1_3.appendTo(inputDiv1);\n inputObj2_3.appendTo(inputDiv2);\n }\n };\n /* tslint:enable */\n FilterDialog.prototype.updateInputValues = function (element, type, inputDiv1, inputDiv2) {\n var value1;\n var value2;\n if (type === 'date') {\n var inputObj1 = inputDiv1.ej2_instances[0];\n var inputObj2 = inputDiv2.ej2_instances[0];\n value1 = !isNullOrUndefined(inputObj1.value) ? inputObj1.value.toString() : '';\n value2 = !isNullOrUndefined(inputObj2.value) ? inputObj2.value.toString() : '';\n }\n else {\n var inputObj1 = inputDiv1.ej2_instances[0];\n var inputObj2 = inputDiv2.ej2_instances[0];\n value1 = inputObj1.value;\n value2 = inputObj2.value;\n }\n setStyleAndAttributes(element, { 'data-value1': value1, 'data-value2': value2 });\n };\n FilterDialog.prototype.validateTreeNode = function (e) {\n if (e.node.classList.contains(cls.ICON_DISABLE)) {\n e.cancel = true;\n }\n else {\n return;\n }\n };\n /**\n * Update filter state while Member check/uncheck.\n * @hidden\n */\n FilterDialog.prototype.updateCheckedState = function (fieldCaption) {\n var filterDialog = this.dialogPopUp.element;\n setStyleAndAttributes(filterDialog, { 'role': 'menu', 'aria-haspopup': 'true' });\n var list = [].slice.call(this.memberTreeView.element.querySelectorAll('li'));\n var uncheckedNodes = this.getUnCheckedNodes();\n var checkedNodes = this.getCheckedNodes();\n var firstNode = this.allMemberSelect.element.querySelector('li').querySelector('span.' + cls.CHECK_BOX_FRAME_CLASS);\n if (list.length > 0) {\n if (checkedNodes.length > 0) {\n if (uncheckedNodes.length > 0) {\n removeClass([firstNode], cls.NODE_CHECK_CLASS);\n addClass([firstNode], cls.NODE_STOP_CLASS);\n }\n else if (uncheckedNodes.length === 0) {\n removeClass([firstNode], cls.NODE_STOP_CLASS);\n addClass([firstNode], cls.NODE_CHECK_CLASS);\n }\n this.dialogPopUp.buttons[0].buttonModel.disabled = false;\n filterDialog.querySelector('.' + cls.OK_BUTTON_CLASS).removeAttribute('disabled');\n }\n else if (uncheckedNodes.length > 0 && checkedNodes.length === 0) {\n removeClass([firstNode], [cls.NODE_CHECK_CLASS, cls.NODE_STOP_CLASS]);\n if (this.getCheckedNodes().length === checkedNodes.length) {\n this.dialogPopUp.buttons[0].buttonModel.disabled = true;\n filterDialog.querySelector('.' + cls.OK_BUTTON_CLASS).setAttribute('disabled', 'disabled');\n }\n }\n }\n else {\n this.dialogPopUp.buttons[0].buttonModel.disabled = true;\n filterDialog.querySelector('.' + cls.OK_BUTTON_CLASS).setAttribute('disabled', 'disabled');\n }\n };\n FilterDialog.prototype.getCheckedNodes = function () {\n var checkeNodes = this.parent.searchTreeItems.filter(function (item) {\n return item.checkedStatus;\n });\n return checkeNodes;\n };\n FilterDialog.prototype.getUnCheckedNodes = function () {\n var unCheckeNodes = this.parent.searchTreeItems.filter(function (item) {\n return !item.checkedStatus;\n });\n return unCheckeNodes;\n };\n FilterDialog.prototype.isExcelFilter = function (fieldName) {\n var isFilterField = false;\n for (var _i = 0, _a = this.parent.dataSource.filters; _i < _a.length; _i++) {\n var field = _a[_i];\n if (field.name === fieldName) {\n isFilterField = true;\n break;\n }\n }\n if (!isFilterField && (this.parent.dataSource.allowLabelFilter || this.parent.dataSource.allowValueFilter)) {\n return true;\n }\n else {\n return false;\n }\n };\n FilterDialog.prototype.getFilterObject = function (fieldName) {\n var filterObj = this.parent.eventBase.getFilterItemByName(fieldName);\n if (filterObj && (((['Label', 'Date', 'Number'].indexOf(filterObj.type) >= 0) &&\n this.parent.dataSource.allowLabelFilter) || (filterObj.type === 'Value' && this.parent.dataSource.allowValueFilter) ||\n (['Include', 'Exclude'].indexOf(filterObj.type) >= 0))) {\n return filterObj;\n }\n return undefined;\n };\n FilterDialog.prototype.closeFilterDialog = function () {\n if (this.allowExcelLikeFilter) {\n if (this.tabObj && !this.tabObj.isDestroyed) {\n this.tabObj.destroy();\n }\n }\n this.dialogPopUp.close();\n };\n FilterDialog.prototype.removeFilterDialog = function () {\n if (this.dialogPopUp && !this.dialogPopUp.isDestroyed) {\n this.dialogPopUp.destroy();\n }\n if (document.getElementById(this.parent.parentID + '_EditorTreeView')) {\n remove(document.getElementById(this.parent.parentID + '_EditorTreeView'));\n }\n };\n return FilterDialog;\n}());\nexport { FilterDialog };\n","import { CommonKeyboardInteraction } from '../actions/keyboard';\nimport { EventBase } from '../actions/event-base';\nimport { NodeStateModified } from '../actions/node-state-modified';\nimport { DataSourceUpdate } from '../actions/dataSource-update';\nimport { ErrorDialog } from '../popups/error-dialog';\nimport { FilterDialog } from '../popups/filter-dialog';\n/**\n * PivotCommon is used to manipulate the relational or Multi-Dimensional public methods by using their dataSource\n * @hidden\n */\n/** @hidden */\nvar PivotCommon = /** @class */ (function () {\n /**\n * Constructor for PivotEngine class\n * @param {PivotEngine} pivotEngine?\n * @param {DataOptions} dataSource?\n * @param {string} element?\n * @hidden\n */\n function PivotCommon(control) {\n /** @hidden */\n this.currentTreeItems = [];\n /** @hidden */\n this.savedTreeFilterPos = {};\n /** @hidden */\n this.currentTreeItemsPos = {};\n /** @hidden */\n this.searchTreeItems = [];\n /** @hidden */\n this.isDataOverflow = false;\n /** @hidden */\n this.isDateField = false;\n this.element = control.element;\n this.moduleName = control.moduleName;\n this.dataSource = control.dataSource;\n this.engineModule = control.pivotEngine;\n this.enableRtl = control.enableRtl;\n this.isAdaptive = control.isAdaptive;\n this.renderMode = control.renderMode;\n this.parentID = control.id;\n this.localeObj = control.localeObj;\n this.nodeStateModified = new NodeStateModified(this);\n this.dataSourceUpdate = new DataSourceUpdate(this);\n this.eventBase = new EventBase(this);\n this.filterDialog = new FilterDialog(this);\n this.errorDialog = new ErrorDialog(this);\n this.keyboardModule = new CommonKeyboardInteraction(this);\n return this;\n }\n /**\n * To destroy the groupingbar\n * @return {void}\n * @hidden\n */\n PivotCommon.prototype.destroy = function () {\n if (this.keyboardModule) {\n this.keyboardModule.destroy();\n }\n };\n return PivotCommon;\n}());\nexport { PivotCommon };\n","import { createElement, isNullOrUndefined, addClass, removeClass } from '@syncfusion/ej2-base';\nimport { EventHandler, setStyleAttribute, extend } from '@syncfusion/ej2-base';\nimport * as cls from '../../common/base/css-constant';\nimport { Dialog } from '@syncfusion/ej2-popups';\nimport { Button, CheckBox } from '@syncfusion/ej2-buttons';\nimport { Tab } from '@syncfusion/ej2-navigations';\nimport * as events from '../../common/base/constant';\n/**\n * Module to render Pivot Field List Dialog\n */\n/** @hidden */\nvar DialogRenderer = /** @class */ (function () {\n /** Constructor for render module */\n function DialogRenderer(parent) {\n this.parent = parent;\n }\n /**\n * Initialize the field list layout rendering\n * @returns void\n * @private\n */\n DialogRenderer.prototype.render = function () {\n var fieldListWrappper = createElement('div', {\n id: this.parent.element.id + '_Wrapper',\n className: cls.WRAPPER_CLASS,\n styles: 'width:' + this.parent.element.style.width\n });\n if (this.parent.isAdaptive) {\n addClass([fieldListWrappper], cls.DEVICE);\n }\n else {\n removeClass([fieldListWrappper], cls.DEVICE);\n }\n if (this.parent.enableRtl) {\n addClass([fieldListWrappper], cls.RTL);\n }\n else {\n removeClass([fieldListWrappper], cls.RTL);\n }\n if (this.parent.cssClass) {\n addClass([fieldListWrappper], this.parent.cssClass);\n }\n this.parentElement = createElement('div', { className: cls.CONTAINER_CLASS });\n this.parent.element.appendChild(fieldListWrappper);\n if (this.parent.isAdaptive) {\n fieldListWrappper.removeAttribute('style');\n this.parentElement = createElement('div', { className: cls.ADAPTIVE_CONTAINER_CLASS });\n this.renderAdaptiveLayout(fieldListWrappper);\n }\n if (this.parent.renderMode === 'Popup') {\n this.renderFieldListDialog(fieldListWrappper);\n this.unWireDialogEvent(this.parent.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS));\n this.wireDialogEvent(this.parent.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS));\n }\n else {\n this.renderStaticLayout(fieldListWrappper);\n }\n };\n DialogRenderer.prototype.renderStaticLayout = function (fieldListWrappper) {\n if (!this.parent.isAdaptive) {\n var layoutHeader = createElement('div', {\n className: cls.FIELD_LIST_TITLE_CLASS\n });\n var headerContent = createElement('div', {\n className: cls.FIELD_LIST_TITLE_CONTENT_CLASS,\n innerHTML: this.parent.localeObj.getConstant('staticFieldList')\n });\n layoutHeader.appendChild(headerContent);\n layoutHeader.appendChild(this.createCalculatedButton());\n addClass([fieldListWrappper], cls.STATIC_FIELD_LIST_CLASS);\n fieldListWrappper.appendChild(layoutHeader);\n fieldListWrappper.appendChild(this.parentElement);\n addClass([fieldListWrappper], cls.STATIC_FIELD_LIST_CLASS);\n if (this.parent.allowDeferLayoutUpdate) {\n fieldListWrappper.appendChild(this.createDeferUpdateButtons());\n this.renderDeferUpdateButtons();\n }\n }\n };\n DialogRenderer.prototype.renderDeferUpdateButtons = function () {\n if (this.parent.allowDeferLayoutUpdate) {\n this.deferUpdateCheckBox = new CheckBox({\n label: this.parent.localeObj.getConstant('deferLayoutUpdate'),\n checked: true,\n enableRtl: this.parent.enableRtl,\n change: this.onCheckChange.bind(this)\n });\n this.deferUpdateCheckBox.appendTo('#' + this.parent.element.id + 'DeferUpdateCheckBox');\n this.deferUpdateApplyButton = new Button({\n cssClass: cls.DEFER_APPLY_BUTTON + ' ' + cls.DEFER_UPDATE_BUTTON + (this.parent.renderMode === 'Popup' ?\n (' ' + cls.BUTTON_FLAT_CLASS) : ''),\n content: this.parent.localeObj.getConstant('apply'),\n enableRtl: this.parent.enableRtl,\n isPrimary: true\n });\n this.deferUpdateApplyButton.appendTo('#' + this.parent.element.id + '_DeferUpdateButton1');\n this.deferUpdateApplyButton.element.onclick = this.parent.renderMode === 'Fixed' ? this.applyButtonClick.bind(this) :\n this.onDeferUpdateClick.bind(this);\n }\n this.deferUpdateCancelButton = new Button({\n cssClass: cls.DEFER_CANCEL_BUTTON + ' ' + cls.CANCEL_BUTTON_CLASS + (this.parent.renderMode === 'Popup' ?\n (' ' + cls.BUTTON_FLAT_CLASS) : ''),\n content: this.parent.allowDeferLayoutUpdate ? this.parent.localeObj.getConstant('cancel') :\n this.parent.localeObj.getConstant('close'),\n enableRtl: this.parent.enableRtl, isPrimary: !this.parent.allowDeferLayoutUpdate\n });\n this.deferUpdateCancelButton.appendTo('#' + this.parent.element.id + '_DeferUpdateButton2');\n this.deferUpdateCancelButton.element.onclick = this.parent.renderMode === 'Fixed' ? this.cancelButtonClick.bind(this) :\n this.onCloseFieldList.bind(this);\n };\n DialogRenderer.prototype.createDeferUpdateButtons = function () {\n var layoutFooter = createElement('div', {\n className: cls.LAYOUT_FOOTER\n });\n if (this.parent.allowDeferLayoutUpdate) {\n var checkBoxLayout = createElement('div', {\n className: cls.CHECKBOX_LAYOUT\n });\n var deferUpdateCheckBox = createElement('input', {\n id: this.parent.element.id + 'DeferUpdateCheckBox'\n });\n checkBoxLayout.appendChild(deferUpdateCheckBox);\n layoutFooter.appendChild(checkBoxLayout);\n }\n var buttonLayout = createElement('div', {\n className: cls.BUTTON_LAYOUT\n });\n if (this.parent.allowDeferLayoutUpdate) {\n var deferUpdateButton1 = createElement('button', {\n id: this.parent.element.id + '_DeferUpdateButton1'\n });\n buttonLayout.appendChild(deferUpdateButton1);\n }\n var deferUpdateButton2 = createElement('button', {\n id: this.parent.element.id + '_DeferUpdateButton2'\n });\n buttonLayout.appendChild(deferUpdateButton2);\n layoutFooter.appendChild(buttonLayout);\n return layoutFooter;\n };\n DialogRenderer.prototype.onCheckChange = function (args) {\n if (args.checked) {\n this.parent.clonedDataSource = extend({}, this.parent.dataSource, null, true);\n this.parent.clonedFieldList = extend({}, this.parent.pivotFieldList, null, true);\n }\n this.parent.allowDeferLayoutUpdate = !this.parent.allowDeferLayoutUpdate;\n if (this.parent.renderMode === 'Fixed') {\n this.deferUpdateApplyButton.setProperties({ disabled: !this.parent.allowDeferLayoutUpdate });\n this.deferUpdateCancelButton.setProperties({ disabled: !this.parent.allowDeferLayoutUpdate });\n }\n else {\n if (this.parent.allowDeferLayoutUpdate) {\n this.deferUpdateApplyButton.element.style.display = '';\n this.deferUpdateCancelButton.setProperties({ content: this.parent.localeObj.getConstant('cancel') });\n this.deferUpdateCancelButton.isPrimary = false;\n }\n else {\n this.deferUpdateApplyButton.element.style.display = 'none';\n this.deferUpdateCancelButton.setProperties({ content: this.parent.localeObj.getConstant('close') });\n this.deferUpdateCancelButton.isPrimary = true;\n }\n }\n this.cancelButtonClick();\n };\n DialogRenderer.prototype.applyButtonClick = function () {\n this.parent.updateDataSource(false);\n this.parent.axisFieldModule.render();\n this.parent.clonedDataSource = extend({}, this.parent.dataSource, null, true);\n this.parent.clonedFieldList = extend({}, this.parent.pivotFieldList, null, true);\n };\n DialogRenderer.prototype.cancelButtonClick = function () {\n this.parent.\n setProperties({ dataSource: this.parent.clonedDataSource.properties }, true);\n this.parent.engineModule.fieldList = extend({}, this.parent.clonedFieldList, null, true);\n this.parent.updateDataSource(false, true);\n };\n DialogRenderer.prototype.renderFieldListDialog = function (fieldListWrappper) {\n var toggleFieldList = createElement('div', {\n className: cls.TOGGLE_FIELD_LIST_CLASS + ' ' + cls.ICON + ' ' + cls.TOGGLE_SELECT_CLASS,\n attrs: {\n 'tabindex': '0',\n title: this.parent.localeObj.getConstant('fieldList'),\n 'aria-disabled': 'false',\n 'aria-label': this.parent.localeObj.getConstant('fieldList')\n }\n });\n this.parent.element.appendChild(toggleFieldList);\n if (this.parent.isAdaptive) {\n var headerTemplate = '';\n var buttons = [{\n click: this.showFieldListDialog.bind(this),\n buttonModel: {\n cssClass: cls.ADAPTIVE_FIELD_LIST_BUTTON_CLASS + ' ' + cls.BUTTON_SMALL_CLASS + ' ' + cls.BUTTON_ROUND_CLASS,\n iconCss: cls.ICON + ' ' + cls.ADD_ICON_CLASS,\n isPrimary: true\n }\n }, {\n click: this.showCalculatedField.bind(this),\n buttonModel: {\n cssClass: cls.ADAPTIVE_CALCULATED_FIELD_BUTTON_CLASS +\n ' ' + cls.BUTTON_SMALL_CLASS + ' ' + cls.BUTTON_ROUND_CLASS + ' ' + cls.ICON_DISABLE,\n iconCss: cls.ICON + ' ' + cls.ADD_ICON_CLASS, enableRtl: this.parent.enableRtl,\n isPrimary: true\n }\n }];\n this.fieldListDialog = new Dialog({\n animationSettings: { effect: this.parent.enableRtl ? 'SlideRight' : 'SlideLeft' },\n header: headerTemplate,\n content: this.parentElement,\n isModal: true,\n showCloseIcon: false,\n visible: false,\n allowDragging: false,\n closeOnEscape: false,\n enableRtl: this.parent.enableRtl,\n width: '100%',\n height: '100%',\n position: { X: 'center', Y: 'center' },\n buttons: buttons,\n target: document.body,\n close: this.removeFieldListIcon.bind(this)\n });\n this.fieldListDialog.appendTo(fieldListWrappper);\n setStyleAttribute(fieldListWrappper.querySelector('#' + fieldListWrappper.id + '_dialog-content'), {\n 'padding': '0'\n });\n var footer = fieldListWrappper.querySelector('.' + cls.FOOTER_CONTENT_CLASS);\n addClass([footer], cls.FIELD_LIST_FOOTER_CLASS);\n removeClass([footer.querySelector('.' + cls.ADAPTIVE_CALCULATED_FIELD_BUTTON_CLASS)], cls.BUTTON_FLAT_CLASS);\n removeClass([footer.querySelector('.' + cls.ADAPTIVE_FIELD_LIST_BUTTON_CLASS)], cls.BUTTON_FLAT_CLASS);\n this.fieldListDialog.element.querySelector('.' + cls.BACK_ICON).onclick =\n this.parent.allowDeferLayoutUpdate ? this.onDeferUpdateClick.bind(this) : this.onCloseFieldList.bind(this);\n }\n else {\n var template = this.createDeferUpdateButtons().outerHTML;\n var headerTemplate = '';\n this.fieldListDialog = new Dialog({\n animationSettings: { effect: 'Zoom' },\n header: headerTemplate,\n content: this.parentElement,\n isModal: false,\n showCloseIcon: false,\n visible: false,\n allowDragging: true,\n enableRtl: this.parent.enableRtl,\n width: this.parent.element.style.width,\n position: { X: 'center', Y: this.parent.element.offsetTop },\n footerTemplate: template,\n closeOnEscape: true,\n target: !isNullOrUndefined(this.parent.target) ? ((typeof this.parent.target) === 'string') ?\n document.querySelector(this.parent.target) : this.parent.target : document.body,\n close: this.removeFieldListIcon.bind(this)\n });\n this.fieldListDialog.appendTo(fieldListWrappper);\n this.renderDeferUpdateButtons();\n setStyleAttribute(fieldListWrappper.querySelector('#' + fieldListWrappper.id + '_title'), { 'width': '100%' });\n fieldListWrappper.querySelector('.' + cls.TITLE_HEADER_CLASS).appendChild(this.createCalculatedButton());\n }\n };\n /**\n * Called internally if any of the field added to axis.\n * @hidden\n */\n DialogRenderer.prototype.updateDataSource = function (selectedNodes) {\n var axis = ['filters', 'columns', 'rows', 'values'];\n for (var _i = 0, selectedNodes_1 = selectedNodes; _i < selectedNodes_1.length; _i++) {\n var field = selectedNodes_1[_i];\n var fieldName = field;\n var droppedClass = axis[this.adaptiveElement.selectedItem];\n this.parent.pivotCommon.dataSourceUpdate.control = this.parent.getModuleName() === 'pivotview' ?\n this.parent : (this.parent.pivotGridModule ?\n this.parent.pivotGridModule : this.parent);\n this.parent.pivotCommon.dataSourceUpdate.updateDataSource(fieldName, droppedClass, -1);\n }\n this.parent.axisFieldModule.render();\n if (!this.parent.allowDeferLayoutUpdate) {\n this.parent.updateDataSource(true);\n }\n else {\n this.parent.triggerPopulateEvent();\n }\n };\n DialogRenderer.prototype.onDeferUpdateClick = function () {\n this.parent.updateDataSource();\n this.parent.dialogRenderer.fieldListDialog.hide();\n };\n DialogRenderer.prototype.renderAdaptiveLayout = function (fieldListWrappper) {\n var layoutFooter = createElement('div', {\n className: cls.FIELD_LIST_FOOTER_CLASS\n });\n fieldListWrappper.appendChild(this.parentElement);\n var items = [\n {\n header: { 'text': this.parent.localeObj.getConstant('filters') },\n content: this.createAxisTable('filters')\n },\n {\n header: { 'text': this.parent.localeObj.getConstant('columns') },\n content: this.createAxisTable('columns')\n },\n {\n header: { 'text': this.parent.localeObj.getConstant('rows') },\n content: this.createAxisTable('rows')\n },\n {\n header: { 'text': this.parent.localeObj.getConstant('values') },\n content: this.createAxisTable('values')\n },\n {\n header: { 'text': this.parent.localeObj.getConstant('createCalculatedField') },\n content: 'Calculated Field Related UI'\n }\n ];\n if (!this.parent.allowCalculatedField) {\n items.pop();\n }\n this.adaptiveElement = new Tab({\n heightAdjustMode: 'Auto',\n items: items,\n height: '100%',\n enableRtl: this.parent.enableRtl,\n selected: this.tabSelect.bind(this)\n });\n if (this.parent.renderMode === 'Fixed') {\n layoutFooter.appendChild(this.createAddButton());\n addClass([fieldListWrappper], cls.STATIC_FIELD_LIST_CLASS);\n this.adaptiveElement.appendTo(this.parentElement);\n this.parentElement.appendChild(layoutFooter);\n }\n else {\n this.adaptiveElement.appendTo(this.parentElement);\n }\n };\n DialogRenderer.prototype.tabSelect = function (e) {\n if (this.parentElement.querySelector('.' + cls.WRAPPER_CLASS + ' .' + cls.ADAPTIVE_FIELD_LIST_BUTTON_CLASS)) {\n if (e.selectedIndex !== 4) {\n addClass([this.parentElement.querySelector('.' + cls.WRAPPER_CLASS + ' .' + cls.ADAPTIVE_CALCULATED_FIELD_BUTTON_CLASS)], cls.ICON_DISABLE);\n removeClass([this.parentElement.querySelector('.' + cls.WRAPPER_CLASS + ' .' + cls.ADAPTIVE_FIELD_LIST_BUTTON_CLASS)], cls.ICON_DISABLE);\n }\n else {\n removeClass([this.parentElement.querySelector('.' + cls.WRAPPER_CLASS + ' .' + cls.ADAPTIVE_CALCULATED_FIELD_BUTTON_CLASS)], cls.ICON_DISABLE);\n addClass([this.parentElement.querySelector('.' + cls.WRAPPER_CLASS + ' .' + cls.ADAPTIVE_FIELD_LIST_BUTTON_CLASS)], cls.ICON_DISABLE);\n }\n }\n if (e.selectedIndex === 4) {\n this.adaptiveElement.items[4].content = '';\n this.adaptiveElement.dataBind();\n this.parent.notify(events.initCalculatedField, {});\n }\n else {\n this.parent.axisFieldModule.render();\n }\n };\n DialogRenderer.prototype.createCalculatedButton = function () {\n var calculatedButton = createElement('div', {\n id: this.parent.element.id + '_CalculatedField'\n });\n var calculateField = new Button({\n cssClass: cls.CALCULATED_FIELD_CLASS + ' ' + cls.ICON_DISABLE,\n content: this.parent.localeObj.getConstant('calculatedField'),\n enableRtl: this.parent.enableRtl\n });\n calculateField.appendTo(calculatedButton);\n if (this.parent.calculatedFieldModule) {\n removeClass([calculatedButton], cls.ICON_DISABLE);\n }\n calculateField.element.onclick = this.showCalculatedField.bind(this);\n return calculatedButton;\n };\n DialogRenderer.prototype.createAddButton = function () {\n var footerContainer = createElement('div', {\n className: cls.FIELD_LIST_FOOTER_CLASS + '-content'\n });\n var fieldListButton = createElement('div', {});\n var calculatedButton = createElement('div', {});\n var calculateField = new Button({\n cssClass: cls.ADAPTIVE_CALCULATED_FIELD_BUTTON_CLASS +\n ' ' + cls.BUTTON_SMALL_CLASS + ' ' + cls.BUTTON_ROUND_CLASS + ' ' + cls.ICON_DISABLE,\n iconCss: cls.ICON + ' ' + cls.ADD_ICON_CLASS,\n enableRtl: this.parent.enableRtl\n });\n var fieldList = new Button({\n cssClass: cls.ADAPTIVE_FIELD_LIST_BUTTON_CLASS + ' ' + cls.BUTTON_SMALL_CLASS + ' ' + cls.BUTTON_ROUND_CLASS,\n iconCss: cls.ICON + ' ' + cls.ADD_ICON_CLASS,\n enableRtl: this.parent.enableRtl\n });\n fieldList.appendTo(fieldListButton);\n calculateField.appendTo(calculatedButton);\n footerContainer.appendChild(fieldListButton);\n footerContainer.appendChild(calculatedButton);\n calculateField.element.onclick = this.showCalculatedField.bind(this);\n fieldList.element.onclick = this.showFieldListDialog.bind(this);\n return footerContainer;\n };\n DialogRenderer.prototype.createAxisTable = function (axis) {\n var axisWrapper = createElement('div', {\n className: cls.FIELD_LIST_CLASS + '-' + axis\n });\n var axisContent = createElement('div', { className: cls.AXIS_CONTENT_CLASS + ' ' + 'e-' + axis });\n var axisPrompt = createElement('span', {\n className: cls.AXIS_PROMPT_CLASS,\n innerHTML: this.parent.localeObj.getConstant('addPrompt')\n });\n axisWrapper.appendChild(axisContent);\n axisWrapper.appendChild(axisPrompt);\n return axisWrapper;\n };\n DialogRenderer.prototype.showCalculatedField = function (event) {\n if (!this.parent.isAdaptive) {\n if (this.parent.dialogRenderer.fieldListDialog) {\n this.parent.dialogRenderer.fieldListDialog.hide();\n addClass([this.parent.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS)], cls.ICON_HIDDEN);\n }\n }\n this.parent.notify(events.initCalculatedField, {});\n };\n DialogRenderer.prototype.showFieldListDialog = function (event) {\n var activeindex = this.adaptiveElement.selectedItem;\n this.parent.treeViewModule.render(activeindex);\n };\n DialogRenderer.prototype.onShowFieldList = function () {\n if (this.parent.allowDeferLayoutUpdate) {\n if (this.parent.isAdaptive) {\n this.parent.axisFieldModule.render();\n }\n this.parent.clonedDataSource = extend({}, this.parent.dataSource, null, true);\n this.parent.clonedFieldList = extend({}, this.parent.pivotFieldList, null, true);\n }\n addClass([this.parent.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS)], cls.ICON_HIDDEN);\n this.parent.dialogRenderer.fieldListDialog.show();\n this.parent.dialogRenderer.fieldListDialog.element.style.top =\n parseInt(this.parent.dialogRenderer.fieldListDialog.element.style.top, 10) < 0 ?\n '0px' : this.parent.dialogRenderer.fieldListDialog.element.style.top;\n };\n DialogRenderer.prototype.onCloseFieldList = function () {\n if (this.parent.allowDeferLayoutUpdate) {\n this.parent.dataSource =\n extend({}, this.parent.clonedDataSource.properties, null, true);\n this.parent.pivotGridModule.engineModule = this.parent.engineModule;\n this.parent.pivotGridModule.\n setProperties({ dataSource: this.parent.clonedDataSource.properties }, true);\n this.parent.engineModule.fieldList = extend({}, this.parent.clonedFieldList, null, true);\n this.parent.pivotGridModule.notify(events.uiUpdate, this);\n this.parent.pivotGridModule.notify(events.contentReady, this);\n }\n this.parent.dialogRenderer.fieldListDialog.hide();\n };\n DialogRenderer.prototype.removeFieldListIcon = function () {\n if (!document.getElementById(this.parent.element.id + 'calculateddialog')) {\n removeClass([this.parent.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS)], cls.ICON_HIDDEN);\n }\n };\n DialogRenderer.prototype.keyPress = function (e) {\n var target = e.target;\n if (e.keyCode === 13 && e.target) {\n e.target.click();\n e.preventDefault();\n return;\n }\n };\n DialogRenderer.prototype.wireDialogEvent = function (element) {\n EventHandler.add(element, 'keydown', this.keyPress, this);\n EventHandler.add(element, 'click', this.onShowFieldList, this);\n };\n DialogRenderer.prototype.unWireDialogEvent = function (element) {\n EventHandler.remove(element, 'keydown', this.keyPress);\n EventHandler.remove(element, 'click', this.onShowFieldList);\n };\n return DialogRenderer;\n}());\nexport { DialogRenderer };\n","import { createElement, addClass, removeClass, prepend, remove } from '@syncfusion/ej2-base';\nimport { closest } from '@syncfusion/ej2-base';\nimport * as cls from '../../common/base/css-constant';\nimport * as events from '../../common/base/constant';\nimport { TreeView } from '@syncfusion/ej2-navigations';\nimport { Dialog } from '@syncfusion/ej2-popups';\nimport { MaskedTextBox } from '@syncfusion/ej2-inputs';\n/**\n * Module to render Field List\n */\n/** @hidden */\nvar TreeViewRenderer = /** @class */ (function () {\n /** Constructor for render module */\n function TreeViewRenderer(parent) {\n this.selectedNodes = [];\n this.parent = parent;\n this.addEventListener();\n }\n /**\n * Initialize the field list tree rendering\n * @returns void\n * @private\n */\n TreeViewRenderer.prototype.render = function (axis) {\n this.parentElement = this.parent.dialogRenderer.parentElement;\n if (!this.parent.isAdaptive) {\n var fieldTable = createElement('div', { className: cls.FIELD_TABLE_CLASS });\n var treeHeader = createElement('div', {\n className: cls.FIELD_HEADER_CLASS,\n innerHTML: this.parent.localeObj.getConstant('allFields')\n });\n this.treeViewElement = createElement('div', {\n id: this.parent.element.id + '_TreeView',\n className: cls.FIELD_LIST_CLASS\n });\n fieldTable.appendChild(treeHeader);\n fieldTable.appendChild(this.treeViewElement);\n this.parentElement.appendChild(fieldTable);\n if (this.parent.renderMode === 'Fixed') {\n var centerDiv = createElement('div', { className: cls.STATIC_CENTER_DIV_CLASS });\n var axisHeader = createElement('div', {\n className: cls.STATIC_CENTER_HEADER_CLASS,\n innerHTML: this.parent.localeObj.getConstant('centerHeader')\n });\n this.parentElement.appendChild(centerDiv);\n this.parentElement.appendChild(axisHeader);\n }\n this.renderTreeView();\n }\n else {\n this.renderTreeDialog(axis);\n }\n };\n TreeViewRenderer.prototype.renderTreeView = function () {\n this.fieldTable = new TreeView({\n fields: { dataSource: this.getTreeData(), id: 'id', text: 'caption', isChecked: 'isSelected' },\n nodeChecked: this.nodeStateChange.bind(this),\n cssClass: cls.FIELD_LIST_TREE_CLASS,\n showCheckBox: true,\n allowDragAndDrop: true,\n sortOrder: 'Ascending',\n enableRtl: this.parent.enableRtl,\n nodeDragStart: this.dragStart.bind(this),\n nodeDragStop: this.dragStop.bind(this)\n });\n this.treeViewElement.innerHTML = '';\n this.fieldTable.appendTo(this.treeViewElement);\n this.getTreeUpdate();\n };\n TreeViewRenderer.prototype.renderTreeDialog = function (axis) {\n var fieldListDialog = createElement('div', {\n id: this.parent.element.id + '_FieldListTreeView',\n className: cls.ADAPTIVE_FIELD_LIST_DIALOG_CLASS\n });\n this.parentElement.appendChild(fieldListDialog);\n this.fieldDialog = new Dialog({\n animationSettings: { effect: 'Fade' },\n allowDragging: false,\n header: this.parent.localeObj.getConstant('adaptiveFieldHeader'),\n content: this.createTreeView(this.getTreeData(axis)),\n isModal: true,\n visible: true,\n showCloseIcon: false,\n enableRtl: this.parent.enableRtl,\n width: 'auto',\n height: '350px',\n position: { X: 'center', Y: 'center' },\n buttons: [{\n click: this.closeTreeDialog.bind(this),\n buttonModel: {\n cssClass: cls.CANCEL_BUTTON_CLASS, content: this.parent.localeObj.getConstant('cancel')\n }\n }, {\n click: this.onFieldAdd.bind(this),\n buttonModel: {\n cssClass: cls.OK_BUTTON_CLASS, content: this.parent.localeObj.getConstant('add'),\n isPrimary: true\n }\n }],\n closeOnEscape: true,\n target: this.parentElement.parentElement,\n close: this.dialogClose.bind(this)\n });\n this.fieldDialog.appendTo(fieldListDialog);\n };\n TreeViewRenderer.prototype.dialogClose = function () {\n if (document.getElementById(this.parent.element.id + '_FieldListTreeView')) {\n remove(document.getElementById(this.parent.element.id + '_FieldListTreeView'));\n }\n };\n TreeViewRenderer.prototype.createTreeView = function (treeData) {\n var editorTreeWrapper = createElement('div', {\n id: this.parent.element.id + 'EditorDiv',\n className: cls.EDITOR_TREE_WRAPPER_CLASS\n });\n var searchWrapper = createElement('div', {\n id: this.parent.element.id + '_SearchDiv', attrs: { 'tabindex': '-1' },\n className: cls.EDITOR_SEARCH_WRAPPER_CLASS\n });\n var editorSearch = createElement('input', { attrs: { 'type': 'text' } });\n searchWrapper.appendChild(editorSearch);\n var treeViewContainer = createElement('div', { className: cls.EDITOR_TREE_CONTAINER_CLASS });\n editorTreeWrapper.appendChild(searchWrapper);\n this.editorSearch = new MaskedTextBox({\n placeholder: this.parent.localeObj.getConstant('search'),\n enableRtl: this.parent.enableRtl,\n cssClass: cls.EDITOR_SEARCH_CLASS,\n change: this.textChange.bind(this)\n });\n this.editorSearch.appendTo(editorSearch);\n editorTreeWrapper.appendChild(treeViewContainer);\n this.fieldTable = new TreeView({\n fields: { dataSource: treeData, id: 'id', text: 'caption', isChecked: 'isSelected' },\n showCheckBox: true,\n sortOrder: 'Ascending',\n enableRtl: this.parent.enableRtl,\n nodeChecked: this.addNode.bind(this),\n });\n this.fieldTable.appendTo(treeViewContainer);\n return editorTreeWrapper;\n };\n TreeViewRenderer.prototype.textChange = function (e) {\n this.parent.pivotCommon.eventBase.searchTreeNodes(e, this.fieldTable, true);\n };\n TreeViewRenderer.prototype.dragStart = function (args) {\n if (args.event.target.classList.contains(cls.DRAG_CLASS)) {\n this.parent.isDragging = true;\n addClass([args.draggedNode.querySelector('.' + cls.LIST_TEXT_CLASS)], cls.SELECTED_NODE_CLASS);\n var data = this.parent.engineModule.fieldList[args.draggedNode.getAttribute('data-uid')];\n var axis = [cls.ROW_AXIS_CLASS, cls.COLUMN_AXIS_CLASS, cls.FILTER_AXIS_CLASS];\n if (data && data.aggregateType === 'CalculatedField') {\n for (var _i = 0, axis_1 = axis; _i < axis_1.length; _i++) {\n var axisContent = axis_1[_i];\n addClass([this.parentElement.querySelector('.' + axisContent)], cls.NO_DRAG_CLASS);\n }\n }\n }\n else {\n args.cancel = true;\n }\n };\n TreeViewRenderer.prototype.dragStop = function (args) {\n args.cancel = true;\n this.parent.isDragging = false;\n var axis = [cls.ROW_AXIS_CLASS, cls.COLUMN_AXIS_CLASS, cls.FILTER_AXIS_CLASS];\n for (var _i = 0, axis_2 = axis; _i < axis_2.length; _i++) {\n var axisElement = axis_2[_i];\n removeClass([this.parentElement.querySelector('.' + axisElement)], cls.NO_DRAG_CLASS);\n }\n removeClass([args.draggedNode.querySelector('.' + cls.LIST_TEXT_CLASS)], cls.SELECTED_NODE_CLASS);\n if (this.parent.pivotCommon.filterDialog.dialogPopUp) {\n this.parent.pivotCommon.filterDialog.dialogPopUp.close();\n }\n var fieldName = args.draggedNodeData.id.toString();\n if (!this.isNodeDropped(args, fieldName)) {\n return;\n }\n this.parent.pivotCommon.dataSourceUpdate.control = this.parent.getModuleName() === 'pivotview' ? this.parent :\n (this.parent.pivotGridModule ? this.parent.pivotGridModule : this.parent);\n if (this.parent.pivotCommon.nodeStateModified.onStateModified(args, fieldName)) {\n if (this.parent.allowDeferLayoutUpdate) {\n this.updateDataSource();\n }\n else {\n this.parent.updateDataSource();\n }\n this.parent.axisFieldModule.render();\n }\n };\n TreeViewRenderer.prototype.isNodeDropped = function (args, targetID) {\n var isDropped = true;\n if (args.draggedNodeData.isChecked === 'true') {\n var target = this.getButton(targetID);\n var axisPanel = closest(target, '.' + cls.DROPPABLE_CLASS);\n var droppableElement = closest(args.target, '.' + cls.DROPPABLE_CLASS);\n if (target && axisPanel === droppableElement) {\n var pivotButtons = [].slice.call(axisPanel.querySelectorAll('.' + cls.PIVOT_BUTTON_CLASS));\n var dropTarget = closest(args.target, '.' + cls.PIVOT_BUTTON_WRAPPER_CLASS);\n var sourcePosition = void 0;\n var dropPosition = -1;\n for (var i = 0, n = pivotButtons.length; i < n; i++) {\n if (pivotButtons[i].id === target.id) {\n sourcePosition = i;\n }\n if (dropTarget) {\n var droppableButton = dropTarget.querySelector('.' + cls.PIVOT_BUTTON_CLASS);\n if (pivotButtons[i].id === droppableButton.id) {\n dropPosition = i;\n }\n }\n }\n if (sourcePosition === dropPosition || (sourcePosition === (pivotButtons.length - 1) && dropPosition === -1)) {\n var parentElement = document.getElementById(this.parent.element.id + '_Wrapper');\n removeClass([].slice.call(parentElement.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS)), cls.INDICATOR_HOVER_CLASS);\n isDropped = false;\n }\n }\n }\n return isDropped;\n };\n TreeViewRenderer.prototype.getButton = function (fieldName) {\n var wrapperElement = document.getElementById(this.parent.element.id + '_Wrapper');\n var pivotButtons = [].slice.call(wrapperElement.querySelectorAll('.' + cls.PIVOT_BUTTON_CLASS));\n var buttonElement;\n for (var i = 0, n = pivotButtons.length; i < n; i++) {\n if (pivotButtons[i].id === fieldName) {\n buttonElement = pivotButtons[i];\n break;\n }\n }\n return buttonElement;\n };\n TreeViewRenderer.prototype.nodeStateChange = function (args) {\n if (this.parent.pivotCommon.filterDialog.dialogPopUp) {\n this.parent.pivotCommon.filterDialog.dialogPopUp.close();\n }\n var node = closest(args.node, '.' + cls.TEXT_CONTENT_CLASS);\n var list = this.parent.pivotFieldList;\n var selectedNode = list[args.data[0].id.toString()];\n if (args.action === 'check') {\n addClass([node.querySelector('.' + cls.LIST_TEXT_CLASS)], cls.LIST_SELECT_CLASS);\n var addNode = this.parent.pivotCommon.dataSourceUpdate.getNewField(args.data[0].id.toString());\n selectedNode.type === 'number' ?\n this.parent.dataSource.values.push(addNode) : this.parent.dataSource.rows.push(addNode);\n }\n else {\n removeClass([node.querySelector('.' + cls.LIST_TEXT_CLASS)], cls.LIST_SELECT_CLASS);\n this.parent.pivotCommon.dataSourceUpdate.removeFieldFromReport(args.data[0].id.toString());\n }\n if (!this.parent.allowDeferLayoutUpdate) {\n this.parent.updateDataSource(true);\n }\n else {\n if (args.action === 'check') {\n selectedNode.isSelected = true;\n }\n else {\n selectedNode.isSelected = false;\n }\n this.updateDataSource();\n }\n this.parent.axisFieldModule.render();\n };\n TreeViewRenderer.prototype.updateDataSource = function () {\n if (this.parent.getModuleName() === 'pivotfieldlist' && this.parent.renderMode === 'Popup') {\n this.parent.pivotGridModule.engineModule = this.parent.engineModule;\n this.parent.pivotGridModule.\n setProperties({ dataSource: this.parent.dataSource.properties }, true);\n this.parent.pivotGridModule.notify(events.uiUpdate, this);\n }\n else {\n this.parent.triggerPopulateEvent();\n }\n };\n TreeViewRenderer.prototype.addNode = function (args) {\n var fieldList = this.parent.pivotFieldList;\n var selectedNode = fieldList[args.data[0].id.toString()];\n if (args.action === 'check') {\n this.selectedNodes.push(selectedNode.id.toString());\n }\n else {\n var count = this.selectedNodes.length;\n while (count--) {\n if (this.selectedNodes[count] === selectedNode.id.toString()) {\n this.selectedNodes.splice(count, 1);\n break;\n }\n }\n }\n };\n TreeViewRenderer.prototype.getTreeUpdate = function () {\n var liElements = [].slice.call(this.treeViewElement.querySelectorAll('.' + cls.TEXT_CONTENT_CLASS));\n for (var _i = 0, liElements_1 = liElements; _i < liElements_1.length; _i++) {\n var liElement = liElements_1[_i];\n var dragElement = createElement('span', {\n attrs: {\n 'tabindex': '-1',\n title: this.parent.localeObj.getConstant('drag'),\n 'aria-disabled': 'false'\n },\n className: cls.ICON + ' ' + cls.DRAG_CLASS\n });\n prepend([dragElement], liElement);\n if (liElement.querySelector('.' + cls.NODE_CHECK_CLASS)) {\n addClass([liElement.querySelector('.' + cls.LIST_TEXT_CLASS)], cls.LIST_SELECT_CLASS);\n }\n }\n };\n TreeViewRenderer.prototype.refreshTreeView = function () {\n if (this.fieldTable) {\n this.fieldTable.fields = { dataSource: this.getTreeData(), id: 'id', text: 'caption', isChecked: 'isSelected' };\n this.fieldTable.dataBind();\n this.getTreeUpdate();\n }\n };\n TreeViewRenderer.prototype.getTreeData = function (axis) {\n var data = [];\n var keys = Object.keys(this.parent.pivotFieldList);\n var fieldList = {};\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var key = keys_1[_i];\n var member = this.parent.pivotFieldList[key];\n fieldList[key] = { id: member.id, caption: member.caption, isSelected: member.isSelected };\n }\n if (this.parent.isAdaptive) {\n var fields = [this.parent.dataSource.filters, this.parent.dataSource.columns, this.parent.dataSource.rows,\n this.parent.dataSource.values];\n var currentFieldSet = fields[axis];\n var len = keys.length;\n while (len--) {\n fieldList[keys[len]].isSelected = false;\n }\n for (var _a = 0, currentFieldSet_1 = currentFieldSet; _a < currentFieldSet_1.length; _a++) {\n var item = currentFieldSet_1[_a];\n fieldList[item.name].isSelected = true;\n }\n }\n var list = fieldList;\n for (var _b = 0, keys_2 = keys; _b < keys_2.length; _b++) {\n var member = keys_2[_b];\n var obj = list[member];\n data.push(obj);\n }\n return data;\n };\n TreeViewRenderer.prototype.onFieldAdd = function (e) {\n this.parent.dialogRenderer.updateDataSource(this.selectedNodes);\n this.closeTreeDialog();\n };\n TreeViewRenderer.prototype.closeTreeDialog = function () {\n this.selectedNodes = [];\n this.fieldDialog.hide();\n };\n /**\n * @hidden\n */\n TreeViewRenderer.prototype.addEventListener = function () {\n this.parent.on(events.treeViewUpdate, this.refreshTreeView, this);\n };\n /**\n * @hidden\n */\n TreeViewRenderer.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.treeViewUpdate, this.refreshTreeView);\n };\n /**\n * To destroy the tree view event listener\n * @return {void}\n * @hidden\n */\n TreeViewRenderer.prototype.destroy = function () {\n this.removeEventListener();\n };\n return TreeViewRenderer;\n}());\nexport { TreeViewRenderer };\n","import { createElement, Droppable, EventHandler, removeClass, addClass } from '@syncfusion/ej2-base';\nimport * as cls from '../../common/base/css-constant';\n/**\n * Module to render Axis Field Table\n */\n/** @hidden */\nvar AxisTableRenderer = /** @class */ (function () {\n /** Constructor for render module */\n function AxisTableRenderer(parent) {\n this.parent = parent;\n }\n /**\n * Initialize the axis table rendering\n * @returns void\n * @private\n */\n AxisTableRenderer.prototype.render = function () {\n if (!this.parent.isAdaptive) {\n var axisTable = createElement('div', { className: cls.AXIS_TABLE_CLASS });\n this.leftAxisPanel = createElement('div', { className: cls.LEFT_AXIS_PANEL_CLASS });\n this.rightAxisPanel = createElement('div', { className: cls.RIGHT_AXIS_PANEL_CLASS });\n this.parent.dialogRenderer.parentElement.appendChild(axisTable);\n axisTable.appendChild(this.leftAxisPanel);\n axisTable.appendChild(this.rightAxisPanel);\n this.axisTable = axisTable;\n this.renderAxisTable();\n }\n this.parent.axisFieldModule.render();\n };\n AxisTableRenderer.prototype.renderAxisTable = function () {\n var fieldLabels = ['filters', 'rows', 'columns', 'values'];\n for (var len = 0, lnt = fieldLabels.length; len < lnt; len++) {\n var axis = createElement('div', {\n className: cls.FIELD_LIST_CLASS + '-' + fieldLabels[len]\n });\n var axisTitleWrapper = createElement('div', {\n className: cls.AXIS_ICON_CLASS + '-wrapper'\n });\n var axisTitle = createElement('div', {\n className: cls.AXIS_HEADER_CLASS,\n innerHTML: this.parent.localeObj.getConstant(fieldLabels[len])\n });\n axisTitleWrapper.appendChild(this.getIconupdate(fieldLabels[len]));\n axisTitleWrapper.appendChild(axisTitle);\n var axisContent = createElement('div', { className: cls.AXIS_CONTENT_CLASS + ' ' + 'e-' + fieldLabels[len] });\n var localePrompt = void 0;\n if (fieldLabels[len] === 'rows') {\n localePrompt = this.parent.localeObj.getConstant('dropRowPrompt');\n }\n else if (fieldLabels[len] === 'columns') {\n localePrompt = this.parent.localeObj.getConstant('dropColPrompt');\n }\n else if (fieldLabels[len] === 'values') {\n localePrompt = this.parent.localeObj.getConstant('dropValPrompt');\n }\n else {\n localePrompt = this.parent.localeObj.getConstant('dropFilterPrompt');\n }\n var axisPrompt = createElement('span', {\n className: cls.AXIS_PROMPT_CLASS,\n innerHTML: localePrompt\n });\n var droppable = new Droppable(axisContent, {});\n axis.appendChild(axisTitleWrapper);\n axis.appendChild(axisContent);\n axis.appendChild(axisPrompt);\n if (len <= 1) {\n this.leftAxisPanel.appendChild(axis);\n }\n else {\n this.rightAxisPanel.appendChild(axis);\n }\n this.unWireEvent(axisContent);\n this.wireEvent(axisContent);\n }\n };\n AxisTableRenderer.prototype.getIconupdate = function (axis) {\n var axisWrapper = createElement('span', {\n attrs: { 'tabindex': '-1', 'aria-disabled': 'false' },\n className: cls.AXIS_ICON_CLASS + '-icon-wrapper'\n });\n var axisElement = createElement('span', {\n attrs: {\n 'tabindex': '-1', 'aria-disabled': 'false'\n },\n className: cls.ICON + ' ' + cls.AXIS_ICON_CLASS + '-' + axis\n });\n axisWrapper.appendChild(axisElement);\n return axisWrapper;\n };\n AxisTableRenderer.prototype.wireEvent = function (element) {\n EventHandler.add(element, 'mouseover', this.updateDropIndicator, this);\n EventHandler.add(element, 'mouseleave', this.updateDropIndicator, this);\n };\n AxisTableRenderer.prototype.unWireEvent = function (element) {\n EventHandler.remove(element, 'mouseover', this.updateDropIndicator);\n EventHandler.remove(element, 'mouseleave', this.updateDropIndicator);\n };\n AxisTableRenderer.prototype.updateDropIndicator = function (e) {\n var parentElement = this.parent.dialogRenderer.parentElement;\n if (this.parent.isDragging && e.target.classList.contains(cls.AXIS_CONTENT_CLASS) && e.type === 'mouseover') {\n removeClass([].slice.call(parentElement.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS)), cls.INDICATOR_HOVER_CLASS);\n removeClass([].slice.call(parentElement.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS + '-last')), cls.INDICATOR_HOVER_CLASS);\n var element = [].slice.call(e.target.querySelectorAll('.' + cls.PIVOT_BUTTON_WRAPPER_CLASS));\n if (element.length > 0) {\n addClass([element[element.length - 1].querySelector('.' + cls.DROP_INDICATOR_CLASS + '-last')], cls.INDICATOR_HOVER_CLASS);\n }\n }\n else if (e.type === 'mouseleave') {\n removeClass([].slice.call(parentElement.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS)), cls.INDICATOR_HOVER_CLASS);\n removeClass([].slice.call(parentElement.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS + '-last')), cls.INDICATOR_HOVER_CLASS);\n }\n };\n return AxisTableRenderer;\n}());\nexport { AxisTableRenderer };\n","import { createElement, Draggable, remove, extend } from '@syncfusion/ej2-base';\nimport { EventHandler } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined as isNOU, addClass, removeClass, closest, Browser } from '@syncfusion/ej2-base';\nimport { PivotFieldList } from '../../pivotfieldlist/base/field-list';\nimport * as cls from '../../common/base/css-constant';\nimport * as events from '../../common/base/constant';\nimport { Button } from '@syncfusion/ej2-buttons';\nimport { AggregateMenu } from '../popups/aggregate-menu';\nimport { AxisFieldRenderer } from '../../pivotfieldlist/renderer/axis-field-renderer';\nimport { DropDownList } from '@syncfusion/ej2-dropdowns';\n/**\n * Module to render Pivot button\n */\n/** @hidden */\nvar PivotButton = /** @class */ (function () {\n /** Constructor for render module */\n function PivotButton(parent) {\n this.parent = parent;\n this.menuOption = new AggregateMenu(this.parent);\n this.parent.pivotButtonModule = this;\n this.addEventListener();\n if (this.parent instanceof PivotFieldList) {\n this.axisField = new AxisFieldRenderer(this.parent);\n }\n }\n /* tslint:disable */\n PivotButton.prototype.renderPivotButton = function (args) {\n var field = extend([], args.field, null, true);\n var axis = args.axis;\n var axisElement;\n var valuePos = -1;\n var showValuesButton = (this.parent.getModuleName() == \"pivotfieldlist\" &&\n this.parent.pivotGridModule) ?\n this.parent.pivotGridModule.showValuesButton : this.parent.showValuesButton;\n if (((this.parent.dataSource.valueAxis === 'row' && args.axis === 'rows') ||\n (this.parent.dataSource.valueAxis === 'column' && args.axis === 'columns')) && showValuesButton && this.parent.dataSource.values.length > 1) {\n valuePos = field.length;\n field.push({\n name: this.parent.localeObj.getConstant('values'), caption: this.parent.localeObj.getConstant('values'),\n axis: args.axis\n });\n }\n this.parentElement = this.parent.getModuleName() === 'pivotview' ? this.parent.element :\n document.getElementById(this.parent.element.id + '_Wrapper');\n if (this.parent.getModuleName() === 'pivotfieldlist') {\n this.parentElement = document.getElementById(this.parent.element.id + '_Wrapper');\n if (this.parentElement.querySelector('.' + cls.FIELD_LIST_CLASS + '-' + axis)) {\n var axisPrompt = this.parentElement.querySelector('.' + cls.FIELD_LIST_CLASS + '-' + axis)\n .querySelector('.' + cls.AXIS_PROMPT_CLASS);\n if (field.length === 0) {\n removeClass([axisPrompt], cls.ICON_DISABLE);\n }\n else {\n addClass([axisPrompt], cls.ICON_DISABLE);\n }\n axisElement =\n this.parentElement.querySelector('.' + cls.FIELD_LIST_CLASS + '-' + axis).querySelector('.' + cls.AXIS_CONTENT_CLASS);\n }\n else {\n return;\n }\n }\n else {\n this.parentElement = this.parent.element;\n axisElement = this.parentElement.querySelector('.e-group-' + axis);\n }\n if (axisElement) {\n if (this.parent.getModuleName() === 'pivotview' && field.length === 0) {\n for (var _i = 0, _a = this.parentElement.querySelectorAll('.e-group-' + axis); _i < _a.length; _i++) {\n var element = _a[_i];\n if (!element.classList.contains(cls.GROUP_CHART_VALUE)) {\n var axisPrompt = createElement('span', {\n className: cls.AXIS_PROMPT_CLASS,\n innerHTML: (this.parent.groupingBarSettings.allowDragAndDrop ? axis === 'rows' ? this.parent.localeObj.getConstant('rowAxisPrompt') :\n axis === 'columns' ? this.parent.localeObj.getConstant('columnAxisPrompt') :\n axis === 'values' ? this.parent.localeObj.getConstant('valueAxisPrompt') :\n this.parent.localeObj.getConstant('filterAxisPrompt') : '')\n });\n element.appendChild(axisPrompt);\n }\n }\n }\n else {\n for (var i = 0, cnt = field.length; i < cnt; i++) {\n for (var _b = 0, _c = (this.parent.getModuleName() === 'pivotfieldlist' ? [axisElement] : this.parentElement.querySelectorAll('.e-group-' + axis)); _b < _c.length; _b++) {\n var element = _c[_b];\n element = element;\n if (!element.classList.contains(cls.GROUP_CHART_VALUE)) {\n var buttonWrapper = createElement('div', {\n className: cls.PIVOT_BUTTON_WRAPPER_CLASS + (i === 0 ? ' e-first-btn' : ''),\n attrs: { 'data-tag': axis + ':' + field[i].name }\n });\n var buttonElement = createElement('div', {\n id: field[i].name, className: cls.PIVOT_BUTTON_CLASS,\n attrs: {\n 'data-uid': field[i].name, 'tabindex': '0', 'isvalue': i === valuePos ? 'true' : 'false',\n 'aria-disabled': 'false', 'aria-label': field[i].caption ? field[i].caption : field[i].name,\n 'data-type': field[i].type,\n 'data-caption': field[i].caption ? field[i].caption : field[i].name,\n 'data-basefield': field[i].baseField,\n 'data-baseitem': field[i].baseItem\n }\n });\n var dropIndicatorElement = createElement('span', {\n attrs: { 'tabindex': '-1', 'aria-disabled': 'false' },\n className: cls.DROP_INDICATOR_CLASS\n });\n var dropLastIndicatorElement = createElement('span', {\n attrs: { 'tabindex': '-1', 'aria-disabled': 'false' },\n className: cls.DROP_INDICATOR_CLASS + '-last'\n });\n var dragWrapper = this.createButtonDragIcon(buttonElement);\n var contentElement = this.createButtonText(field, i, axis, valuePos);\n buttonElement.appendChild(contentElement);\n if (['filters', 'values'].indexOf(axis) === -1 && valuePos !== i) {\n this.createSortOption(buttonElement, field[i].name);\n }\n if (axis !== 'values' && valuePos !== i) {\n this.createFilterOption(buttonElement, field[i].name);\n }\n if (axis === 'values') {\n this.getTypeStatus(field, i, buttonElement);\n }\n var removeElement = createElement('span', {\n attrs: { 'tabindex': '-1', 'aria-disabled': 'false' },\n className: cls.ICON + ' ' + cls.REMOVE_CLASS\n });\n if (this.parent.getModuleName() === 'pivotview') {\n if (this.parent.groupingBarSettings.showRemoveIcon) {\n removeClass([removeElement], cls.ICON_DISABLE);\n }\n else {\n addClass([removeElement], cls.ICON_DISABLE);\n }\n }\n buttonElement.appendChild(removeElement);\n buttonWrapper.appendChild(dropIndicatorElement);\n buttonWrapper.appendChild(buttonElement);\n buttonWrapper.appendChild(dropLastIndicatorElement);\n element.appendChild(buttonWrapper);\n var pivotButton = new Button({ enableRtl: this.parent.enableRtl });\n pivotButton.appendTo(buttonElement);\n this.unWireEvent(buttonWrapper, i === valuePos ? 'values' : axis);\n this.wireEvent(buttonWrapper, i === valuePos ? 'values' : axis);\n if ((this.parent.getModuleName() === 'pivotview' && !this.parent.isAdaptive) ||\n this.parent.getModuleName() === 'pivotfieldlist') {\n this.createDraggable(this.parent.getModuleName() === 'pivotview' ? contentElement : dragWrapper);\n }\n }\n }\n }\n if (axis === 'values') {\n var _loop_1 = function (element) {\n if (element.classList.contains(cls.GROUP_CHART_VALUE)) {\n var valueData = field.map(function (item) { return { text: item.caption ? item.caption : item.name, value: item.name }; });\n var parent_1 = this_1.parent;\n if (this_1.valueFiedDropDownList && element.querySelector('.' + cls.GROUP_CHART_VALUE_DROPDOWN_DIV)) {\n this_1.valueFiedDropDownList.dataSource = valueData;\n this_1.valueFiedDropDownList.value = !parent_1.chartSettings.enableMultiAxis ?\n parent_1.chartModule.currentMeasure : valueData[0].value;\n }\n else {\n var ddlDiv = createElement('div', { className: cls.GROUP_CHART_VALUE_DROPDOWN_DIV });\n element.appendChild(ddlDiv);\n this_1.valueFiedDropDownList = new DropDownList({\n dataSource: valueData,\n enableRtl: this_1.parent.enableRtl,\n value: !parent_1.chartSettings.enableMultiAxis ?\n parent_1.chartModule.currentMeasure : valueData[0].value,\n width: 200,\n fields: { value: 'value', text: 'text' },\n cssClass: cls.GROUP_CHART_VALUE_DROPDOWN,\n change: function (args) {\n if (args.e && args.e !== null) {\n parent_1.chartSettings.value = args.value;\n }\n }\n });\n this_1.valueFiedDropDownList.appendTo(ddlDiv);\n }\n }\n };\n var this_1 = this;\n for (var _d = 0, _e = this.parentElement.querySelectorAll('.e-group-' + axis); _d < _e.length; _d++) {\n var element = _e[_d];\n _loop_1(element);\n }\n }\n }\n }\n else {\n return;\n }\n };\n PivotButton.prototype.createButtonText = function (field, i, axis, valuePos) {\n var buttonText;\n var aggregation;\n var filterMem;\n if (axis === \"filters\") {\n filterMem = this.updateButtontext(field[i].name);\n }\n if (this.parent.engineModule.fieldList[field[i].name] !== undefined) {\n aggregation = this.parent.engineModule.fieldList[field[i].name].aggregateType;\n if (aggregation === undefined && (this.parent.engineModule.fieldList[field[i].name].type === 'string' || this.parent.engineModule.fieldList[field[i].name].type === 'include' ||\n this.parent.engineModule.fieldList[field[i].name].type === 'exclude')) {\n aggregation = 'Count';\n }\n else if (aggregation === undefined) {\n aggregation = this.parent.engineModule.fieldList[field[i].name].aggregateType !== undefined ?\n this.parent.engineModule.fieldList[field[i].name].aggregateType : 'Sum';\n }\n }\n var text = field[i].caption ? field[i].caption : field[i].name;\n buttonText = createElement('span', {\n attrs: {\n title: axis === 'filters' ? (text + ' (' + filterMem + ')') : (((!this.parent.dataSource.showAggregationOnValueField || axis !== 'values' || aggregation === 'CalculatedField') ? text : this.parent.localeObj.getConstant(aggregation) + ' ' + 'of' + ' ' + text)),\n 'tabindex': '-1', 'aria-disabled': 'false', 'oncontextmenu': 'return false;',\n 'data-type': valuePos === i ? '' : aggregation\n },\n className: cls.PIVOT_BUTTON_CONTENT_CLASS + ' ' +\n (this.parent.getModuleName() === 'pivotview' && !this.parent.groupingBarSettings.allowDragAndDrop ? 'e-disable-drag' : ''),\n innerHTML: axis === 'filters' ? (text + ' (' + filterMem + ')') : (!this.parent.dataSource.showAggregationOnValueField || axis !== 'values' || aggregation === 'CalculatedField' ? text : this.parent.localeObj.getConstant(aggregation) + ' ' + 'of' + ' ' + text)\n });\n return buttonText;\n };\n PivotButton.prototype.getTypeStatus = function (field, i, buttonElement) {\n var fieldListItem = this.parent.engineModule.fieldList[field[i].name];\n if (fieldListItem.aggregateType !== 'CalculatedField' &&\n fieldListItem.type === 'number') {\n this.createSummaryType(buttonElement, field[i].name);\n }\n };\n PivotButton.prototype.createSummaryType = function (pivotButton, fieldName) {\n var spanElement = createElement('span', {\n attrs: { 'tabindex': '-1', 'aria-disabled': 'false' },\n className: cls.ICON + ' ' + cls.AXISFIELD_ICON_CLASS\n });\n if (this.parent.getModuleName() === 'pivotview') {\n if (this.parent.groupingBarSettings.showValueTypeIcon) {\n removeClass([spanElement], cls.ICON_DISABLE);\n }\n else {\n addClass([spanElement], cls.ICON_DISABLE);\n }\n }\n pivotButton.appendChild(spanElement);\n return spanElement;\n };\n PivotButton.prototype.createMenuOption = function (args) {\n this.menuOption.render(args, this.parentElement);\n this.parent.pivotButtonModule = this;\n };\n PivotButton.prototype.createDraggable = function (target) {\n this.draggable = new Draggable(target, {\n clone: true,\n enableTailMode: true,\n enableAutoScroll: true,\n helper: this.createDragClone.bind(this),\n dragStart: this.onDragStart.bind(this),\n drag: this.onDragging.bind(this),\n dragStop: this.onDragStop.bind(this),\n abort: (this.parent.getModuleName() === 'pivotview' && !this.parent.groupingBarSettings.allowDragAndDrop ? '.' + cls.PIVOT_BUTTON_CLASS : '')\n });\n };\n PivotButton.prototype.createButtonDragIcon = function (pivotButton) {\n var dragWrapper = createElement('span', {\n attrs: { 'tabindex': '-1', 'aria-disabled': 'false' }\n });\n var dragElement = createElement('span', {\n attrs: {\n 'tabindex': '-1', 'aria-disabled': 'false'\n },\n className: cls.ICON + ' ' + cls.DRAG_CLASS\n });\n dragWrapper.appendChild(dragElement);\n pivotButton.appendChild(dragWrapper);\n return dragWrapper;\n };\n PivotButton.prototype.createSortOption = function (pivotButton, fieldName) {\n var sortCLass;\n if (!this.parent.allowDeferLayoutUpdate) {\n sortCLass = this.parent.engineModule.fieldList[fieldName].sort === 'Descending' ? cls.SORT_DESCEND_CLASS : '';\n }\n else {\n sortCLass = '';\n for (var i = 0; i < this.parent.dataSource.sortSettings.length; i++) {\n if (this.parent.dataSource.sortSettings[i].name === fieldName) {\n sortCLass = this.parent.dataSource.sortSettings[i].order === 'Descending' ? cls.SORT_DESCEND_CLASS : '';\n }\n }\n }\n var spanElement = createElement('span', {\n attrs: { 'tabindex': '-1', 'aria-disabled': 'false' },\n className: cls.ICON + ' ' + cls.SORT_CLASS + ' ' + sortCLass\n });\n if (this.parent.dataSource.enableSorting) {\n removeClass([spanElement], cls.ICON_DISABLE);\n }\n else {\n addClass([spanElement], cls.ICON_DISABLE);\n }\n if (this.parent.getModuleName() === 'pivotview') {\n if (this.parent.groupingBarSettings.showSortIcon) {\n removeClass([spanElement], cls.ICON_DISABLE);\n }\n else {\n addClass([spanElement], cls.ICON_DISABLE);\n }\n }\n pivotButton.appendChild(spanElement);\n return spanElement;\n };\n PivotButton.prototype.createFilterOption = function (pivotButton, fieldName) {\n var filterCLass;\n if (!this.parent.allowDeferLayoutUpdate) {\n filterCLass = this.parent.engineModule.fieldList[fieldName].filter.length === 0 ?\n !this.parent.engineModule.fieldList[fieldName].isExcelFilter ? cls.FILTER_CLASS : cls.FILTERED_CLASS : cls.FILTERED_CLASS;\n }\n else {\n filterCLass = cls.FILTER_CLASS;\n for (var i = 0; i < this.parent.dataSource.filterSettings.length; i++) {\n if (this.parent.dataSource.filterSettings[i].name === fieldName) {\n filterCLass = cls.FILTERED_CLASS;\n }\n }\n }\n var spanElement = createElement('span', {\n attrs: {\n 'tabindex': '-1', 'aria-disabled': 'false'\n },\n className: cls.FILTER_COMMON_CLASS + ' ' + cls.ICON + ' ' + filterCLass\n });\n if (this.parent.getModuleName() === 'pivotview') {\n if (this.parent.groupingBarSettings.showFilterIcon) {\n removeClass([spanElement], cls.ICON_DISABLE);\n }\n else {\n addClass([spanElement], cls.ICON_DISABLE);\n }\n }\n pivotButton.appendChild(spanElement);\n return spanElement;\n };\n PivotButton.prototype.createDragClone = function (args) {\n var element = closest(args.element, '.' + cls.PIVOT_BUTTON_CLASS);\n var cloneElement = createElement('div', {\n id: this.parent.element.id + '_DragClone',\n className: cls.DRAG_CLONE_CLASS\n });\n var contentElement = createElement('span', {\n className: cls.TEXT_CONTENT_CLASS,\n innerHTML: element.textContent\n });\n cloneElement.appendChild(contentElement);\n document.body.appendChild(cloneElement);\n return cloneElement;\n };\n PivotButton.prototype.onDragStart = function (e) {\n this.parent.isDragging = true;\n var element = closest(e.element, '.' + cls.PIVOT_BUTTON_CLASS);\n var data = this.parent.engineModule.fieldList[element.getAttribute('data-uid')];\n var axis = [cls.ROW_AXIS_CLASS, cls.COLUMN_AXIS_CLASS, cls.FILTER_AXIS_CLASS];\n addClass([element], cls.SELECTED_NODE_CLASS);\n if (data && data.aggregateType === 'CalculatedField') {\n for (var _i = 0, axis_1 = axis; _i < axis_1.length; _i++) {\n var axisContent = axis_1[_i];\n addClass([this.parentElement.querySelector('.' + axisContent)], cls.NO_DRAG_CLASS);\n }\n }\n };\n PivotButton.prototype.onDragging = function (e) {\n this.draggable.setProperties({ cursorAt: { top: (!isNOU(e.event.targetTouches) || Browser.isDevice) ? 60 : -20, } });\n // if (closest(e.event.srcElement, '.' + cls.PIVOT_BUTTON_WRAPPER_CLASS)) {\n // let droppableElement: HTMLElement = closest(e.event.srcElement, '.' + cls.DROPPABLE_CLASS) as HTMLElement;\n // let buttonElement: HTMLElement = closest(e.event.srcElement, '.' + cls.PIVOT_BUTTON_WRAPPER_CLASS) as HTMLElement;\n // if (droppableElement.offsetHeight < droppableElement.scrollHeight) {\n // let scrollPosition: number = (droppableElement.scrollHeight - buttonElement.offsetTop);\n // if (buttonElement.offsetTop >= droppableElement.offsetTop && scrollPosition > droppableElement.scrollTop) {\n // droppableElement.scrollTop += Math.abs(buttonElement.offsetHeight);\n // } else if (buttonElement.offsetTop <= droppableElement.offsetTop) {\n // droppableElement.scrollTop -= Math.abs(buttonElement.offsetHeight);\n // }\n // }\n // }\n };\n PivotButton.prototype.onDragStop = function (args) {\n this.parent.isDragging = false;\n if (args.target.classList && (args.target.classList.contains(cls.GROUP_CHART_VALUE) || args.target.classList.contains(cls.GROUP_CHART_VALUE_DROPDOWN))) {\n args.target = this.parent.element.querySelector('.' + cls.GROUP_CHART_ROW);\n }\n var element = closest(args.element, '.' + cls.PIVOT_BUTTON_CLASS);\n removeClass([].slice.call(this.parentElement.querySelectorAll('.' + cls.PIVOT_BUTTON_CLASS)), cls.SELECTED_NODE_CLASS);\n removeClass([].slice.call(this.parentElement.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS)), cls.INDICATOR_HOVER_CLASS);\n var axis = [cls.ROW_AXIS_CLASS, cls.COLUMN_AXIS_CLASS, cls.FILTER_AXIS_CLASS];\n for (var _i = 0, axis_2 = axis; _i < axis_2.length; _i++) {\n var axisContent = axis_2[_i];\n removeClass([this.parentElement.querySelector('.' + axisContent)], cls.NO_DRAG_CLASS);\n }\n if (this.parent.pivotCommon.filterDialog.dialogPopUp) {\n this.parent.pivotCommon.filterDialog.dialogPopUp.close();\n }\n if (document.getElementById(this.parent.element.id + '_DragClone')) {\n remove(document.getElementById(this.parent.element.id + '_DragClone'));\n }\n document.body.style.cursor = 'auto';\n if (!this.isButtonDropped(args.target, element)) {\n return;\n }\n this.parent.pivotCommon.dataSourceUpdate.control = this.parent.getModuleName() === 'pivotview' ? this.parent :\n (this.parent.pivotGridModule ? this.parent.pivotGridModule : this.parent);\n if (this.parent.pivotCommon.nodeStateModified.onStateModified(args, element.id)) {\n this.updateDataSource();\n this.parent.axisFieldModule.render();\n }\n };\n PivotButton.prototype.isButtonDropped = function (dropTarget, target) {\n var axisPanel = closest(target, '.' + cls.DROPPABLE_CLASS);\n var droppableElement = closest(dropTarget, '.' + cls.DROPPABLE_CLASS);\n var isDropped = true;\n if (axisPanel === droppableElement) {\n var pivotButtons = [].slice.call(axisPanel.querySelectorAll('.' + cls.PIVOT_BUTTON_CLASS));\n var droppableTarget = closest(dropTarget, '.' + cls.PIVOT_BUTTON_WRAPPER_CLASS);\n var sourcePosition = void 0;\n var droppedPosition = -1;\n for (var i = 0, n = pivotButtons.length; i < n; i++) {\n if (pivotButtons[i].id === target.id) {\n sourcePosition = i;\n }\n if (droppableTarget) {\n var droppableButton = droppableTarget.querySelector('.' + cls.PIVOT_BUTTON_CLASS);\n if (pivotButtons[i].id === droppableButton.id) {\n droppedPosition = i;\n }\n }\n }\n if (sourcePosition === droppedPosition || (sourcePosition === (pivotButtons.length - 1) && droppedPosition === -1)) {\n removeClass([].slice.call(this.parentElement.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS)), cls.INDICATOR_HOVER_CLASS);\n isDropped = false;\n }\n }\n return isDropped;\n };\n PivotButton.prototype.updateSorting = function (args) {\n if (((this.parent.getModuleName() === 'pivotview' && this.parent.enableValueSorting) ||\n (this.parent.getModuleName() === 'pivotfieldlist' && this.parent.pivotGridModule !== undefined &&\n this.parent.pivotGridModule.enableValueSorting)) &&\n args.target.parentElement.parentElement.getAttribute('data-tag').split(':')[0] === 'rows') {\n this.parent.setProperties({ dataSource: { valueSortSettings: { headerText: '' } } }, true);\n }\n this.parent.pivotCommon.eventBase.updateSorting(args);\n this.updateDataSource(true);\n };\n PivotButton.prototype.updateDataSource = function (isRefreshGrid) {\n if (!this.parent.allowDeferLayoutUpdate || this.parent.getModuleName() === 'pivotview') {\n this.parent.updateDataSource(isRefreshGrid);\n }\n else {\n if (this.parent.getModuleName() === 'pivotfieldlist' && this.parent.renderMode === 'Popup') {\n this.parent.pivotGridModule.engineModule = this.parent.engineModule;\n this.parent.pivotGridModule.notify(events.uiUpdate, this);\n this.parent.\n pivotGridModule.setProperties({ dataSource: this.parent.dataSource.properties }, true);\n }\n else {\n this.parent.triggerPopulateEvent();\n }\n }\n };\n PivotButton.prototype.updateFiltering = function (args) {\n this.parent.pivotCommon.eventBase.updateFiltering(args);\n var target = args.target;\n this.fieldName = target.parentElement.id;\n this.dialogPopUp = this.parent.pivotCommon.filterDialog.dialogPopUp;\n this.memberTreeView = this.parent.pivotCommon.filterDialog.memberTreeView;\n this.parent.pivotCommon.filterDialog.memberTreeView.nodeChecked = this.nodeStateModified.bind(this);\n this.parent.pivotCommon.filterDialog.allMemberSelect.nodeChecked = this.nodeStateModified.bind(this);\n this.bindDialogEvents();\n };\n PivotButton.prototype.bindDialogEvents = function () {\n if (this.parent.pivotCommon.filterDialog.allowExcelLikeFilter && this.parent.pivotCommon.filterDialog.tabObj) {\n this.updateDialogButtonEvents(this.parent.pivotCommon.filterDialog.tabObj.selectedItem);\n this.dialogPopUp.buttons[1].click = this.ClearFilter.bind(this);\n this.parent.pivotCommon.filterDialog.tabObj.selected = this.tabSelect.bind(this);\n }\n else {\n this.updateDialogButtonEvents(0);\n }\n };\n PivotButton.prototype.tabSelect = function (e) {\n this.updateDialogButtonEvents(e.selectedIndex);\n removeClass([].slice.call(this.dialogPopUp.element.querySelectorAll('.e-selected-tab')), 'e-selected-tab');\n if (e.selectedIndex > 0) {\n /* tslint:disable-next-line:max-line-length */\n addClass([this.dialogPopUp.element.querySelector('.e-filter-div-content' + '.' + (e.selectedIndex === 1 && this.parent.dataSource.allowLabelFilter ? 'e-label-filter' : 'e-value-filter'))], 'e-selected-tab');\n }\n if (e.selectedIndex === 0) {\n this.parent.pivotCommon.filterDialog.updateCheckedState();\n }\n else {\n this.dialogPopUp.buttons[0].buttonModel.disabled = false;\n this.dialogPopUp.element.querySelector('.' + cls.OK_BUTTON_CLASS).removeAttribute('disabled');\n }\n };\n PivotButton.prototype.updateDialogButtonEvents = function (index) {\n this.dialogPopUp.buttons[0].click = (index === 0 ?\n this.updateFilterState.bind(this, this.fieldName) : this.updateCustomFilter.bind(this));\n };\n PivotButton.prototype.updateCustomFilter = function (args) {\n var dialogElement = this.dialogPopUp.element.querySelector('.e-selected-tab');\n var fieldName = dialogElement.getAttribute('data-fieldname');\n var filterType = dialogElement.getAttribute('data-type');\n var measure = dialogElement.getAttribute('data-measure');\n var operator = dialogElement.getAttribute('data-operator');\n var operand1 = dialogElement.getAttribute('data-value1');\n var operand2 = dialogElement.getAttribute('data-value2');\n var type = ((filterType === 'value') ? 'Value' : (filterType === 'date') ? 'Date' :\n (filterType === 'number') ? 'Number' : 'Label');\n var filterItem = {\n name: fieldName,\n type: type,\n measure: measure,\n condition: operator,\n value1: filterType === 'date' ? new Date(operand1) : operand1,\n value2: filterType === 'date' ? new Date(operand2) : operand2\n };\n if ((isNOU(operand1) || operand1 === '') ||\n (['Between', 'NotBetween'].indexOf(operator) > -1 && (isNOU(operand2) || operand2 === ''))) {\n var inputElementString = (type.toLowerCase() + ((isNOU(operand1) || operand1 === '') ? '_input_option_1' : '_input_option_2'));\n var focusElement = dialogElement.querySelector('#' + this.parent.element.id + '_' + inputElementString);\n addClass([focusElement], cls.EMPTY_FIELD);\n focusElement.focus();\n return;\n }\n var filterObject = this.parent.pivotCommon.eventBase.getFilterItemByName(fieldName);\n if (filterObject) {\n // this.removeDataSourceSettings(fieldName);\n filterObject = filterObject.properties ?\n filterObject.properties : filterObject;\n filterObject.type = type;\n filterObject.measure = measure;\n filterObject.condition = operator;\n filterObject.value1 = filterType === 'date' ? new Date(operand1) : operand1;\n filterObject.value2 = filterType === 'date' ? new Date(operand2) : operand2;\n }\n else {\n this.parent.dataSource.filterSettings.push(filterItem);\n }\n if (type !== 'Value') {\n this.parent.lastFilterInfo = this.parent.pivotCommon.eventBase.getFilterItemByName(fieldName);\n }\n this.dialogPopUp.close();\n this.refreshPivotButtonState(fieldName, true);\n this.updateDataSource(true);\n };\n PivotButton.prototype.ClearFilter = function (e) {\n var dialogElement = this.dialogPopUp.element;\n var fieldName = dialogElement.getAttribute('data-fieldname');\n this.dialogPopUp.close();\n this.removeDataSourceSettings(fieldName);\n this.refreshPivotButtonState(fieldName, false);\n this.updateDataSource(true);\n };\n PivotButton.prototype.removeButton = function (args) {\n var target = args.target;\n var fieldName = target.parentElement.id;\n if (target.parentElement.getAttribute('isvalue') === 'true') {\n this.parent.setProperties({ dataSource: { values: [] } }, true);\n }\n else {\n this.parent.pivotCommon.dataSourceUpdate.removeFieldFromReport(fieldName);\n }\n if (this.parent.getModuleName() === 'pivotfieldlist') {\n this.parent.axisFieldModule.render();\n }\n this.updateDataSource();\n };\n PivotButton.prototype.nodeStateModified = function (args) {\n var target = args.node.parentElement.parentElement;\n if (target.getAttribute('data-uid') === 'all') {\n this.memberTreeView.nodeChecked = null;\n if (args.action === 'check') {\n this.memberTreeView.checkAll();\n }\n else {\n this.memberTreeView.uncheckAll();\n }\n this.checkedStateAll(args.action);\n this.memberTreeView.nodeChecked = this.nodeStateModified.bind(this);\n }\n else {\n var pos = this.parent.pivotCommon.currentTreeItemsPos[args.data[0].id];\n if (args.action === 'check') {\n this.parent.pivotCommon.currentTreeItems[pos].checkedStatus = true;\n }\n else {\n this.parent.pivotCommon.currentTreeItems[pos].checkedStatus = false;\n }\n }\n this.parent.pivotCommon.filterDialog.updateCheckedState();\n };\n PivotButton.prototype.checkedStateAll = function (state) {\n var searchItemObj = {};\n for (var _i = 0, _a = this.parent.pivotCommon.searchTreeItems; _i < _a.length; _i++) {\n var item = _a[_i];\n item.checkedStatus = state === 'check';\n searchItemObj[item.id] = item.id;\n }\n for (var _b = 0, _c = this.parent.pivotCommon.currentTreeItems; _b < _c.length; _b++) {\n var item = _c[_b];\n if (searchItemObj[item.id] !== undefined) {\n item.checkedStatus = state === 'check';\n }\n }\n };\n PivotButton.prototype.updateFilterState = function (fieldName, args) {\n var isNodeUnChecked = false;\n var filterItem = { items: [], name: fieldName, type: 'Include' };\n for (var _i = 0, _a = this.parent.pivotCommon.searchTreeItems; _i < _a.length; _i++) {\n var item = _a[_i];\n if (item.checkedStatus) {\n if (this.parent.pivotCommon.isDateField) {\n filterItem.items.push(item.name);\n }\n else {\n filterItem.items.push(item.id);\n }\n }\n }\n isNodeUnChecked = (filterItem.items.length === this.parent.pivotCommon.currentTreeItems.length ?\n false : true);\n var filterObject = this.parent.pivotCommon.eventBase.getFilterItemByName(fieldName);\n if (filterObject) {\n for (var i = 0; i < this.parent.dataSource.filterSettings.length; i++) {\n if (this.parent.dataSource.filterSettings[i].name === fieldName) {\n this.parent.dataSource.filterSettings.splice(i, 1);\n break;\n }\n }\n this.parent.dataSource.filterSettings.push(filterItem);\n }\n else {\n this.parent.dataSource.filterSettings.push(filterItem);\n }\n this.dialogPopUp.close();\n this.refreshPivotButtonState(fieldName, isNodeUnChecked);\n if (!isNodeUnChecked) {\n this.removeDataSourceSettings(fieldName);\n }\n this.parent.lastFilterInfo = filterItem;\n this.updateDataSource(true);\n if (this.parent instanceof PivotFieldList) {\n this.axisField.render();\n }\n };\n PivotButton.prototype.refreshPivotButtonState = function (fieldName, isFiltered) {\n var pivotButtons = [].slice.call(this.parentElement.querySelectorAll('.e-pivot-button'));\n var selectedButton;\n for (var _i = 0, pivotButtons_1 = pivotButtons; _i < pivotButtons_1.length; _i++) {\n var item = pivotButtons_1[_i];\n if (item.getAttribute('data-uid') === fieldName) {\n selectedButton = item.querySelector('.' + cls.FILTER_COMMON_CLASS);\n break;\n }\n }\n if (isFiltered) {\n removeClass([selectedButton], cls.FILTER_CLASS);\n addClass([selectedButton], cls.FILTERED_CLASS);\n }\n else {\n removeClass([selectedButton], cls.FILTERED_CLASS);\n addClass([selectedButton], cls.FILTER_CLASS);\n }\n };\n PivotButton.prototype.removeDataSourceSettings = function (fieldName) {\n var filterSettings = this.parent.dataSource.filterSettings;\n for (var len = 0, lnt = filterSettings.length; len < lnt; len++) {\n if (filterSettings[len].name === fieldName) {\n filterSettings.splice(len, 1);\n break;\n }\n }\n };\n PivotButton.prototype.updateDropIndicator = function (e) {\n if (this.parent.isDragging) {\n removeClass([].slice.call(this.parentElement.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS + '-last')), cls.INDICATOR_HOVER_CLASS);\n removeClass([].slice.call(this.parentElement.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS)), cls.INDICATOR_HOVER_CLASS);\n var element = closest(e.target, '.' + cls.PIVOT_BUTTON_WRAPPER_CLASS);\n addClass([element.querySelector('.' + cls.DROP_INDICATOR_CLASS)], cls.INDICATOR_HOVER_CLASS);\n }\n };\n PivotButton.prototype.wireEvent = function (element, axis) {\n EventHandler.add(element, 'mouseover', this.updateDropIndicator, this);\n if (['filters', 'values'].indexOf(axis) === -1) {\n EventHandler.add(element.querySelector('.' + cls.SORT_CLASS), 'click', this.updateSorting, this);\n }\n if (axis !== 'values') {\n EventHandler.add(element.querySelector('.' + cls.FILTER_COMMON_CLASS), 'click', this.updateFiltering, this);\n }\n if (axis === 'values' && element.querySelector('.' + cls.AXISFIELD_ICON_CLASS) !== null) {\n EventHandler.add(element.querySelector('.' + cls.AXISFIELD_ICON_CLASS), 'click', this.createMenuOption, this);\n }\n EventHandler.add(element.querySelector('.' + cls.REMOVE_CLASS), 'click', this.removeButton, this);\n };\n PivotButton.prototype.unWireEvent = function (element, axis) {\n EventHandler.remove(element, 'mouseover', this.updateDropIndicator);\n if (['filters', 'values'].indexOf(axis) === -1) {\n EventHandler.remove(element.querySelector('.' + cls.SORT_CLASS), 'click', this.updateSorting);\n }\n if (axis !== 'values') {\n EventHandler.remove(element.querySelector('.' + cls.FILTER_COMMON_CLASS), 'click', this.updateFiltering);\n }\n if (axis === 'values' && element.querySelector('.' + cls.AXISFIELD_ICON_CLASS) !== null) {\n EventHandler.remove(element.querySelector('.' + cls.AXISFIELD_ICON_CLASS), 'click', this.createMenuOption);\n }\n EventHandler.remove(element.querySelector('.' + cls.REMOVE_CLASS), 'click', this.removeButton);\n };\n /**\n * @hidden\n */\n PivotButton.prototype.addEventListener = function () {\n this.handlers = {\n load: this.renderPivotButton\n };\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.pivotButtonUpdate, this.handlers.load, this);\n };\n /**\n * @hidden\n */\n PivotButton.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.pivotButtonUpdate, this.handlers.load);\n };\n /**\n * To destroy the pivot button event listener\n * @return {void}\n * @hidden\n */\n PivotButton.prototype.destroy = function () {\n this.menuOption.destroy();\n this.removeEventListener();\n };\n // To update button text\n PivotButton.prototype.updateButtontext = function (fieldName) {\n var filterCount = this.parent.engineModule.fieldList[fieldName].filter.length;\n var filterType = this.parent.engineModule.fieldList[fieldName].filterType;\n var memLen = this.parent.engineModule.fieldList[fieldName].dateMember.length;\n var filterMem;\n var firstNode = this.parent.engineModule.fieldList[fieldName].filter[0];\n if (filterType === \"include\") {\n if (filterCount === 1) {\n filterMem = firstNode;\n }\n else if (filterCount > 1) {\n if (filterCount === memLen) {\n filterMem = this.parent.localeObj.getConstant('all');\n }\n else {\n filterMem = this.parent.localeObj.getConstant('multipleItems');\n }\n }\n }\n else if (filterType === \"exclude\") {\n if (filterCount === 1) {\n if (memLen === 2) {\n if (firstNode !== this.parent.engineModule.fieldList[fieldName].dateMember[0].actualText) {\n filterMem = firstNode;\n }\n else {\n filterMem = this.parent.engineModule.fieldList[fieldName].dateMember[0].actualText;\n }\n }\n else {\n filterMem = this.parent.localeObj.getConstant('multipleItems');\n }\n }\n else if (filterCount > 1) {\n var j = void 0;\n var allNodes = Object.keys(this.parent.engineModule.fieldList[fieldName].members);\n var filteredItems = this.parent.engineModule.fieldList[fieldName].filter;\n if (filterCount === (allNodes.length - 1)) {\n loop: for (j = 0; j < allNodes.length; j++) {\n var test = allNodes[j];\n var x = filteredItems.indexOf(test);\n if (x === -1) {\n filterMem = allNodes[j];\n break loop;\n }\n }\n }\n else {\n filterMem = this.parent.localeObj.getConstant('multipleItems');\n }\n }\n }\n else {\n filterMem = this.parent.localeObj.getConstant('all');\n }\n return filterMem;\n };\n return PivotButton;\n}());\nexport { PivotButton };\n","import * as cls from '../../common/base/css-constant';\nimport * as events from '../../common/base/constant';\nimport { PivotButton } from '../../common/actions/pivot-button';\n/**\n * Module to render Axis Fields\n */\n/** @hidden */\nvar AxisFieldRenderer = /** @class */ (function () {\n /** Constructor for render module */\n function AxisFieldRenderer(parent) {\n this.parent = parent;\n }\n /**\n * Initialize the pivot button rendering\n * @returns void\n * @private\n */\n AxisFieldRenderer.prototype.render = function () {\n this.pivotButton = new PivotButton(this.parent);\n this.createPivotButtons();\n };\n AxisFieldRenderer.prototype.createPivotButtons = function () {\n var rows = this.parent.dataSource.rows;\n var columns = this.parent.dataSource.columns;\n var values = this.parent.dataSource.values;\n var filters = this.parent.dataSource.filters;\n var fields = [rows, columns, values, filters];\n var parentElement = this.parent.dialogRenderer.parentElement;\n if (parentElement.querySelector('.' + cls.FIELD_LIST_CLASS + '-filters')) {\n parentElement.querySelector('.' + cls.FIELD_LIST_CLASS + '-filters').querySelector('.' + cls.AXIS_CONTENT_CLASS).innerHTML = '';\n }\n if (parentElement.querySelector('.' + cls.FIELD_LIST_CLASS + '-rows')) {\n parentElement.querySelector('.' + cls.FIELD_LIST_CLASS + '-rows').querySelector('.' + cls.AXIS_CONTENT_CLASS).innerHTML = '';\n }\n if (parentElement.querySelector('.' + cls.FIELD_LIST_CLASS + '-columns')) {\n parentElement.querySelector('.' + cls.FIELD_LIST_CLASS + '-columns').querySelector('.' + cls.AXIS_CONTENT_CLASS).innerHTML = '';\n }\n if (parentElement.querySelector('.' + cls.FIELD_LIST_CLASS + '-values')) {\n parentElement.querySelector('.' + cls.FIELD_LIST_CLASS + '-values').querySelector('.' + cls.AXIS_CONTENT_CLASS).innerHTML = '';\n }\n var axis = ['rows', 'columns', 'values', 'filters'];\n for (var len = 0, lnt = fields.length; len < lnt; len++) {\n if (fields[len]) {\n var args = {\n field: fields[len],\n axis: axis[len].toString()\n };\n this.parent.notify(events.pivotButtonUpdate, args);\n }\n }\n };\n return AxisFieldRenderer;\n}());\nexport { AxisFieldRenderer };\n","import { DialogRenderer } from '../renderer/dialog-renderer';\nimport { TreeViewRenderer } from '../renderer/tree-renderer';\nimport { AxisTableRenderer } from '../renderer/axis-table-renderer';\nimport { AxisFieldRenderer } from './axis-field-renderer';\n/**\n * Module to render Pivot Table component\n */\n/** @hidden */\nvar Render = /** @class */ (function () {\n /** Constructor for render module */\n function Render(parent) {\n this.parent = parent;\n this.parent.dialogRenderer = new DialogRenderer(this.parent);\n this.parent.treeViewModule = new TreeViewRenderer(this.parent);\n this.parent.axisTableModule = new AxisTableRenderer(this.parent);\n this.parent.axisFieldModule = new AxisFieldRenderer(this.parent);\n }\n /**\n * Initialize the pivot table rendering\n * @returns void\n * @private\n */\n Render.prototype.render = function () {\n this.parent.dialogRenderer.render();\n if (!this.parent.isAdaptive) {\n this.parent.treeViewModule.render();\n }\n this.parent.axisTableModule.render();\n };\n return Render;\n}());\nexport { Render };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, Event, Component, Internationalization, extend } from '@syncfusion/ej2-base';\nimport { L10n, remove, addClass, Browser, Complex } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, removeClass, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { PivotEngine } from '../../base/engine';\nimport * as events from '../../common/base/constant';\nimport * as cls from '../../common/base/css-constant';\nimport { PivotCommon } from '../../common/base/pivot-common';\nimport { Render } from '../renderer/renderer';\nimport { DataSource } from '../../pivotview/model/dataSource';\nimport { createSpinner, showSpinner, hideSpinner } from '@syncfusion/ej2-popups';\nimport { PivotUtil } from '../../base/util';\n/**\n * Represents the PivotFieldList component.\n * ```html\n * \n * \n * ```\n */\nvar PivotFieldList = /** @class */ (function (_super) {\n __extends(PivotFieldList, _super);\n /**\n * Constructor for creating the widget\n * @param {PivotFieldListModel} options?\n * @param {string|HTMLButtonElement} element?\n */\n function PivotFieldList(options, element) {\n var _this = _super.call(this, options, element) || this;\n /** @hidden */\n _this.isRequiredUpdate = true;\n /** @hidden */\n _this.lastSortInfo = {};\n /** @hidden */\n _this.lastFilterInfo = {};\n /** @hidden */\n _this.lastAggregationInfo = {};\n /** @hidden */\n _this.lastCalcFieldInfo = {};\n _this.engineModule = new PivotEngine();\n return _this;\n }\n /**\n * To provide the array of modules needed for control rendering\n * @return {ModuleDeclaration[]}\n * @hidden\n */\n PivotFieldList.prototype.requiredModules = function () {\n var modules = [];\n if (this.allowCalculatedField) {\n modules.push({ args: [this], member: 'calculatedfield' });\n }\n return modules;\n };\n /**\n * For internal use only - Initialize the event handler;\n * @private\n */\n PivotFieldList.prototype.preRender = function () {\n this.isAdaptive = Browser.isDevice;\n this.globalize = new Internationalization(this.locale);\n this.renderModule = new Render(this);\n this.defaultLocale = {\n staticFieldList: 'Pivot Field List',\n fieldList: 'Field List',\n dropFilterPrompt: 'Drop filter here',\n dropColPrompt: 'Drop column here',\n dropRowPrompt: 'Drop row here',\n dropValPrompt: 'Drop value here',\n addPrompt: 'Add field here',\n adaptiveFieldHeader: 'Choose field',\n centerHeader: 'Drag fields between axes below:',\n add: 'add',\n drag: 'Drag',\n filter: 'Filter',\n filtered: 'Filtered',\n sort: 'Sort',\n remove: 'Remove',\n filters: 'Filters',\n rows: 'Rows',\n columns: 'Columns',\n values: 'Values',\n calculatedField: 'Calculated Field',\n createCalculatedField: 'Create Calculated Field',\n fieldName: 'Enter the field name',\n error: 'Error',\n invalidFormula: 'Invalid formula.',\n dropText: 'Example: (\"Sum(Order_Count)\" + \"Sum(In_Stock)\") * 250',\n dropTextMobile: 'Add fields and edit formula here.',\n dropAction: 'Calculated field cannot be place in any other region except value axis.',\n search: 'Search',\n close: 'Close',\n cancel: 'Cancel',\n delete: 'Delete',\n alert: 'Alert',\n warning: 'Warning',\n ok: 'OK',\n sum: 'Sum',\n average: 'Average',\n count: 'Count',\n min: 'Min',\n max: 'Max',\n allFields: 'All Fields',\n formula: 'Formula',\n fieldExist: 'A field already exists in this name. Please enter a different name.',\n confirmText: 'A calculation field already exists in this name. Do you want to replace it?',\n noMatches: 'No matches',\n format: 'Summaries values by',\n edit: 'Edit',\n clear: 'Clear',\n formulaField: 'Drag and drop fields to formula',\n dragField: 'Drag field to formula',\n clearFilter: 'Clear',\n by: 'by',\n enterValue: 'Enter value',\n chooseDate: 'Enter date',\n all: 'All',\n multipleItems: 'Multiple items',\n /* tslint:disable */\n Equals: 'Equals',\n DoesNotEquals: 'Does Not Equal',\n BeginWith: 'Begins With',\n DoesNotBeginWith: 'Does Not Begin With',\n EndsWith: 'Ends With',\n DoesNotEndsWith: 'Does Not End With',\n Contains: 'Contains',\n DoesNotContains: 'Does Not Contain',\n GreaterThan: 'Greater Than',\n GreaterThanOrEqualTo: 'Greater Than Or Equal To',\n LessThan: 'Less Than',\n LessThanOrEqualTo: 'Less Than Or Equal To',\n Between: 'Between',\n NotBetween: 'Not Between',\n Before: 'Before',\n BeforeOrEqualTo: 'Before Or Equal To',\n After: 'After',\n AfterOrEqualTo: 'After Or Equal To',\n member: 'Member',\n label: 'Label',\n date: 'Date',\n value: 'Value',\n labelTextContent: 'Show the items for which the label',\n dateTextContent: 'Show the items for which the date',\n valueTextContent: 'Show the items for which',\n And: 'and',\n Sum: 'Sum',\n Count: 'Count',\n DistinctCount: 'Distinct Count',\n Product: 'Product',\n Avg: 'Avg',\n Min: 'Min',\n Max: 'Max',\n Index: 'Index',\n SampleStDev: 'Sample StDev',\n PopulationStDev: 'Population StDev',\n SampleVar: 'Sample Var',\n PopulationVar: 'Population Var',\n RunningTotals: 'Running Totals',\n DifferenceFrom: 'Difference From',\n PercentageOfDifferenceFrom: '% of Difference From',\n PercentageOfGrandTotal: '% of Grand Total',\n PercentageOfColumnTotal: '% of Column Total',\n PercentageOfRowTotal: '% of Row Total',\n PercentageOfParentTotal: '% of Parent Total',\n PercentageOfParentColumnTotal: '% of Parent Column Total',\n PercentageOfParentRowTotal: '% of Parent Row Total',\n Years: 'Years',\n Quarters: 'Quarters',\n Months: 'Months',\n Days: 'Days',\n Hours: 'Hours',\n Minutes: 'Minutes',\n Seconds: 'Seconds',\n /* tslint:enable */\n apply: 'APPLY',\n valueFieldSettings: 'Value field settings',\n sourceName: 'Field name :',\n sourceCaption: 'Field caption :',\n summarizeValuesBy: 'Summarize values by :',\n baseField: 'Base field :',\n baseItem: 'Base item :',\n example: 'e.g:',\n editorDataLimitMsg: ' more items. Search to refine further.',\n deferLayoutUpdate: 'Defer Layout Update'\n };\n this.localeObj = new L10n(this.getModuleName(), this.defaultLocale, this.locale);\n this.isDragging = false;\n this.captionData = [];\n this.wireEvent();\n };\n PivotFieldList.prototype.frameCustomProperties = function () {\n var pageSettings = this.pivotGridModule ? this.pivotGridModule.pageSettings : undefined;\n var isDrillThrough = this.pivotGridModule ?\n (this.pivotGridModule.allowDrillThrough || this.pivotGridModule.editSettings.allowEditing) : true;\n var enableValueSorting = this.pivotGridModule ? this.pivotGridModule.enableValueSorting : undefined;\n var customProperties = {\n mode: '',\n savedFieldList: undefined,\n pageSettings: pageSettings,\n enableValueSorting: enableValueSorting,\n isDrillThrough: isDrillThrough,\n localeObj: this.localeObj\n };\n return customProperties;\n };\n /**\n * Initialize the control rendering\n * @returns void\n * @private\n */\n PivotFieldList.prototype.render = function () {\n this.trigger(events.load, { 'dataSource': this.dataSource });\n addClass([this.element], cls.ROOT);\n if (this.enableRtl) {\n addClass([this.element], cls.RTL);\n }\n else {\n removeClass([this.element], cls.RTL);\n }\n if (this.isAdaptive) {\n addClass([this.element], cls.DEVICE);\n }\n else {\n removeClass([this.element], cls.DEVICE);\n }\n if (this.cssClass) {\n addClass([this.element], this.cssClass);\n }\n this.notify(events.initialLoad, {});\n };\n /**\n * Binding events to the Pivot Field List element.\n * @hidden\n */\n PivotFieldList.prototype.wireEvent = function () {\n this.on(events.initialLoad, this.generateData, this);\n this.on(events.dataReady, this.fieldListRender, this);\n };\n /**\n * Unbinding events from the element on widget destroy.\n * @hidden\n */\n PivotFieldList.prototype.unWireEvent = function () {\n if (this.pivotGridModule && this.pivotGridModule.isDestroyed) {\n return;\n }\n this.off(events.initialLoad, this.generateData);\n this.off(events.dataReady, this.fieldListRender);\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @return {string}\n * @hidden\n */\n PivotFieldList.prototype.getPersistData = function () {\n var keyEntity = ['dataSource'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Get component name.\n * @returns string\n * @private\n */\n PivotFieldList.prototype.getModuleName = function () {\n return 'pivotfieldlist';\n };\n /**\n * Called internally if any of the property value changed.\n * @hidden\n */\n PivotFieldList.prototype.onPropertyChanged = function (newProp, oldProp) {\n var requireRefresh = false;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'locale':\n this.refresh();\n break;\n case 'enableRtl':\n if (this.enableRtl) {\n addClass([this.element], cls.RTL);\n }\n else {\n removeClass([this.element], cls.RTL);\n }\n requireRefresh = true;\n break;\n }\n if (requireRefresh) {\n this.fieldListRender();\n }\n }\n };\n /* tslint:disable */\n PivotFieldList.prototype.generateData = function () {\n this.pivotFieldList = {};\n if (this.dataSource && this.dataSource.data) {\n this.trigger(events.enginePopulating, { 'dataSource': this.dataSource });\n if (this.dataSource.groupSettings) {\n var pivotDataSet = this.dataSource.data;\n this.clonedDataSet = this.clonedDataSet ? this.clonedDataSet : PivotUtil.getClonedData(pivotDataSet);\n this.setProperties({ dataSource: { data: [] } }, true);\n this.clonedReport = this.clonedReport ? this.clonedReport : extend({}, this.dataSource, null, true);\n this.setProperties({ dataSource: { data: pivotDataSet } }, true);\n }\n this.engineModule.renderEngine(this.dataSource, this.frameCustomProperties());\n this.pivotFieldList = this.engineModule.fieldList;\n var eventArgs = {\n pivotFieldList: this.pivotFieldList,\n pivotValues: this.engineModule.pivotValues\n };\n this.trigger(events.enginePopulated, eventArgs);\n }\n this.notify(events.dataReady, {});\n this.trigger(events.dataBound);\n };\n /* tslint:enable */\n PivotFieldList.prototype.fieldListRender = function () {\n this.element.innerHTML = '';\n if (this.renderMode === 'Popup' && this.dialogRenderer.fieldListDialog && !this.dialogRenderer.fieldListDialog.isDestroyed) {\n this.dialogRenderer.fieldListDialog.destroy();\n remove(document.getElementById(this.element.id + '_Wrapper'));\n }\n this.renderModule.render();\n this.fieldListSpinnerElement = this.renderMode === 'Popup' ?\n this.dialogRenderer.fieldListDialog.element : this.element.querySelector('.e-pivotfieldlist-wrapper');\n createSpinner({ target: this.fieldListSpinnerElement }, this.createElement);\n var args = {\n pivotEngine: this.engineModule,\n dataSource: this.dataSource,\n id: this.element.id,\n element: document.getElementById(this.element.id + '_Wrapper'),\n moduleName: this.getModuleName(),\n enableRtl: this.enableRtl,\n isAdaptive: this.isAdaptive,\n renderMode: this.renderMode,\n localeObj: this.localeObj\n };\n this.pivotCommon = new PivotCommon(args);\n this.pivotCommon.control = this;\n if (this.allowDeferLayoutUpdate) {\n this.clonedDataSource = extend({}, this.dataSource, null, true);\n this.clonedFieldList = extend({}, this.pivotFieldList, null, true);\n }\n };\n PivotFieldList.prototype.getFieldCaption = function (dataSource) {\n this.getFields(dataSource);\n if (this.captionData.length > 0) {\n var lnt = this.captionData.length;\n while (lnt--) {\n if (this.captionData[lnt]) {\n for (var _i = 0, _a = this.captionData[lnt]; _i < _a.length; _i++) {\n var obj = _a[_i];\n if (obj) {\n if (this.engineModule.fieldList[obj.name] && obj.caption) {\n this.engineModule.fieldList[obj.name].caption = obj.caption;\n }\n else {\n this.engineModule.fieldList[obj.name].caption = obj.name;\n }\n }\n }\n }\n }\n }\n else {\n return;\n }\n };\n PivotFieldList.prototype.getFields = function (dataSource) {\n this.captionData = [dataSource.rows, dataSource.columns, dataSource.values, dataSource.filters];\n };\n /**\n * Updates the PivotEngine using dataSource from Pivot Field List component.\n * @method updateDataSource\n * @return {void}\n * @hidden\n */\n PivotFieldList.prototype.updateDataSource = function (isTreeViewRefresh, isEngineRefresh) {\n if (this.pivotGridModule) {\n showSpinner(this.pivotGridModule.element);\n }\n showSpinner(this.fieldListSpinnerElement);\n if (isNullOrUndefined(isEngineRefresh)) {\n var pageSettings = this.pivotGridModule ? this.pivotGridModule.pageSettings : undefined;\n var customProperties = this.frameCustomProperties();\n customProperties.savedFieldList = this.pivotFieldList;\n var lastSortInfo = this.pivotGridModule ? this.pivotGridModule.lastSortInfo : this.lastSortInfo;\n if (this.pivotGridModule) {\n this.pivotGridModule.lastSortInfo = {};\n }\n this.lastSortInfo = {};\n var isAggChange = Object.keys(this.lastAggregationInfo).length > 0 ? true : false;\n var isCalcChange = Object.keys(this.lastCalcFieldInfo).length > 0 ? true : false;\n var isSorted = Object.keys(lastSortInfo).length > 0 ? true : false;\n var isFiltered = Object.keys(this.lastFilterInfo).length > 0 ? true : false;\n if (pageSettings && (isSorted || isFiltered || isAggChange || isCalcChange)) {\n if (isSorted) {\n this.pivotGridModule.setProperties({ dataSource: { valueSortSettings: { headerText: '' } } }, true);\n this.engineModule.onSort(lastSortInfo);\n }\n if (isFiltered) {\n this.engineModule.onFilter(this.lastFilterInfo, this.dataSource);\n this.lastFilterInfo = {};\n }\n if (isAggChange) {\n this.engineModule.onAggregation(this.lastAggregationInfo);\n this.lastAggregationInfo = {};\n }\n if (isCalcChange) {\n this.engineModule.onCalcOperation(this.lastCalcFieldInfo);\n this.lastCalcFieldInfo = {};\n }\n }\n else {\n this.engineModule.renderEngine(this.dataSource, customProperties);\n }\n this.getFieldCaption(this.dataSource);\n }\n else {\n this.axisFieldModule.render();\n this.isRequiredUpdate = false;\n }\n var eventArgs = {\n dataSource: this.dataSource,\n pivotFieldList: this.pivotFieldList,\n pivotValues: this.engineModule.pivotValues\n };\n this.trigger(events.enginePopulated, eventArgs);\n this.pivotCommon.engineModule = this.engineModule;\n this.pivotCommon.dataSource = this.dataSource;\n this.pivotFieldList = this.engineModule.fieldList;\n if (!isTreeViewRefresh && this.treeViewModule.fieldTable && !this.isAdaptive) {\n this.notify(events.treeViewUpdate, {});\n }\n if (this.isRequiredUpdate) {\n if (this.allowDeferLayoutUpdate) {\n this.clonedDataSource = extend({}, this.dataSource, null, true);\n this.clonedFieldList = extend({}, this.pivotFieldList, null, true);\n }\n this.updateView(this.pivotGridModule);\n }\n else if (this.renderMode === 'Popup' && this.allowDeferLayoutUpdate) {\n this.pivotGridModule.engineModule = this.engineModule;\n this.pivotGridModule.\n setProperties({ dataSource: this.dataSource.properties }, true);\n this.pivotGridModule.notify(events.uiUpdate, this);\n hideSpinner(this.fieldListSpinnerElement);\n }\n this.isRequiredUpdate = true;\n if (!this.pivotGridModule) {\n hideSpinner(this.fieldListSpinnerElement);\n }\n else {\n this.pivotGridModule.fieldListSpinnerElement = this.fieldListSpinnerElement;\n }\n };\n /**\n * Updates the Pivot Field List component using dataSource from PivotView component.\n * @method updateControl\n * @return {void}\n * @hidden\n */\n PivotFieldList.prototype.update = function (control) {\n if (control) {\n this.clonedDataSet = control.clonedDataSet;\n this.setProperties({ dataSource: control.dataSource }, true);\n this.engineModule = control.engineModule;\n this.pivotFieldList = control.engineModule.fieldList;\n if (this.renderMode === 'Popup') {\n this.pivotGridModule = control;\n }\n this.getFieldCaption(control.dataSource);\n this.pivotCommon.engineModule = this.engineModule;\n this.pivotCommon.dataSource = this.dataSource;\n this.pivotCommon.control = control;\n if (this.treeViewModule.fieldTable && !this.isAdaptive) {\n this.notify(events.treeViewUpdate, {});\n }\n this.axisFieldModule.render();\n if (this.renderMode === 'Fixed' && this.allowDeferLayoutUpdate) {\n this.clonedDataSource = extend({}, this.dataSource, null, true);\n this.clonedFieldList = extend({}, this.pivotFieldList, null, true);\n }\n }\n };\n /**\n * Updates the PivotView component using dataSource from Pivot Field List component.\n * @method refreshTargetControl\n * @return {void}\n * @hidden\n */\n PivotFieldList.prototype.updateView = function (control) {\n if (control) {\n control.clonedDataSet = this.clonedDataSet;\n control.setProperties({ dataSource: this.dataSource }, true);\n control.engineModule = this.engineModule;\n control.pivotValues = this.engineModule.pivotValues;\n control.dataBind();\n }\n };\n /**\n * Called internally to trigger populate event.\n * @hidden\n */\n PivotFieldList.prototype.triggerPopulateEvent = function () {\n var eventArgs = {\n dataSource: this.dataSource,\n pivotFieldList: this.pivotFieldList,\n pivotValues: this.engineModule.pivotValues\n };\n this.trigger(events.enginePopulated, eventArgs);\n };\n /**\n * Destroys the Field Table component.\n * @method destroy\n * @return {void}\n */\n PivotFieldList.prototype.destroy = function () {\n this.unWireEvent();\n if (this.treeViewModule) {\n this.treeViewModule.destroy();\n }\n if (this.pivotButtonModule) {\n this.pivotButtonModule.destroy();\n }\n if (this.allowDeferLayoutUpdate && this.dialogRenderer &&\n this.dialogRenderer.deferUpdateCheckBox && !this.dialogRenderer.deferUpdateCheckBox.isDestroyed) {\n this.dialogRenderer.deferUpdateCheckBox.destroy();\n }\n _super.prototype.destroy.call(this);\n this.element.innerHTML = '';\n removeClass([this.element], cls.ROOT);\n removeClass([this.element], cls.RTL);\n removeClass([this.element], cls.DEVICE);\n if (this.renderMode === 'Popup') {\n if (this.dialogRenderer.fieldListDialog && !this.dialogRenderer.fieldListDialog.isDestroyed) {\n this.dialogRenderer.fieldListDialog.destroy();\n }\n if (document.getElementById(this.element.id + '_Wrapper')) {\n remove(document.getElementById(this.element.id + '_Wrapper'));\n }\n }\n };\n __decorate([\n Complex({}, DataSource)\n ], PivotFieldList.prototype, \"dataSource\", void 0);\n __decorate([\n Property('Popup')\n ], PivotFieldList.prototype, \"renderMode\", void 0);\n __decorate([\n Property()\n ], PivotFieldList.prototype, \"target\", void 0);\n __decorate([\n Property('')\n ], PivotFieldList.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], PivotFieldList.prototype, \"allowCalculatedField\", void 0);\n __decorate([\n Property(false)\n ], PivotFieldList.prototype, \"showValuesButton\", void 0);\n __decorate([\n Property(false)\n ], PivotFieldList.prototype, \"allowDeferLayoutUpdate\", void 0);\n __decorate([\n Property(1000)\n ], PivotFieldList.prototype, \"maxNodeLimitInMemberEditor\", void 0);\n __decorate([\n Event()\n ], PivotFieldList.prototype, \"load\", void 0);\n __decorate([\n Event()\n ], PivotFieldList.prototype, \"enginePopulating\", void 0);\n __decorate([\n Event()\n ], PivotFieldList.prototype, \"enginePopulated\", void 0);\n __decorate([\n Event()\n ], PivotFieldList.prototype, \"onFieldDropped\", void 0);\n __decorate([\n Event()\n ], PivotFieldList.prototype, \"dataBound\", void 0);\n __decorate([\n Event()\n ], PivotFieldList.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], PivotFieldList.prototype, \"destroyed\", void 0);\n PivotFieldList = __decorate([\n NotifyPropertyChanges\n ], PivotFieldList);\n return PivotFieldList;\n}(Component));\nexport { PivotFieldList };\n","import { Dialog } from '@syncfusion/ej2-popups';\nimport { Droppable, createElement, extend, remove, addClass, closest } from '@syncfusion/ej2-base';\nimport { prepend, append, KeyboardEvents, removeClass } from '@syncfusion/ej2-base';\nimport { Button, RadioButton, CheckBox } from '@syncfusion/ej2-buttons';\nimport { MaskedTextBox } from '@syncfusion/ej2-inputs';\nimport * as cls from '../../common/base/css-constant';\nimport { TreeView } from '@syncfusion/ej2-navigations';\nimport { ContextMenu as Menu } from '@syncfusion/ej2-navigations';\nimport * as events from '../../common/base/constant';\nimport { Accordion } from '@syncfusion/ej2-navigations';\n/**\n * Module to render Calculated Field Dialog\n */\nvar COUNT = 'Count';\nvar AVG = 'Avg';\nvar MIN = 'Min';\nvar MAX = 'Max';\nvar SUM = 'Sum';\nvar DISTINCTCOUNT = 'DistinctCount';\nvar PRODUCT = 'Product';\nvar STDEV = 'SampleStDev';\nvar STDEVP = 'PopulationStDev';\nvar VAR = 'SampleVar';\nvar VARP = 'PopulationVar';\nvar CALC = 'CalculatedField';\nvar AGRTYPE = 'AggregateType';\n/** @hidden */\nvar CalculatedField = /** @class */ (function () {\n /** Constructor for calculatedfield module */\n function CalculatedField(parent) {\n this.parent = parent;\n this.existingReport = null;\n this.parent.calculatedFieldModule = this;\n this.removeEventListener();\n this.addEventListener();\n this.parentID = this.parent.element.id;\n this.dialog = null;\n this.inputObj = null;\n this.treeObj = null;\n this.droppable = null;\n this.menuObj = null;\n this.newFields = null;\n this.isFieldExist = true;\n this.formulaText = null;\n this.fieldText = null;\n this.isEdit = false;\n this.currentFieldName = null;\n this.confirmPopUp = null;\n }\n /**\n * To get module name.\n * @returns string\n */\n CalculatedField.prototype.getModuleName = function () {\n return 'calculatedfield';\n };\n CalculatedField.prototype.keyActionHandler = function (e) {\n var node = e.currentTarget.querySelector('.e-hover.e-node-focus');\n if (node) {\n switch (e.action) {\n case 'moveRight':\n this.displayMenu(node.previousSibling);\n break;\n case 'enter':\n var field = node.getAttribute('data-field');\n var type = node.getAttribute('data-type');\n var dropField = this.dialog.element.querySelector('#' + this.parentID + 'droppable');\n if (dropField.value === '') {\n if (type === CALC) {\n dropField.value = node.getAttribute('data-uid');\n }\n else {\n dropField.value = '\"' + type + '(' + field + ')' + '\"';\n }\n }\n else if (dropField.value !== '') {\n if (type === CALC) {\n dropField.value = dropField.value + node.getAttribute('data-uid');\n }\n else {\n dropField.value = dropField.value + '\"' + type + '(' + field + ')' + '\"';\n }\n }\n break;\n }\n }\n };\n /**\n * Trigger while click treeview icon.\n * @param {MouseEvent} e\n * @returns void\n */\n CalculatedField.prototype.fieldClickHandler = function (e) {\n var node = e.event.target.parentElement;\n if (e.event.target.classList.contains(cls.FORMAT) ||\n e.event.target.classList.contains(cls.CALC_EDIT) ||\n e.event.target.classList.contains(cls.CALC_EDITED)) {\n this.displayMenu(node.parentElement);\n }\n };\n /**\n * To display context menu.\n * @param {HTMLElement} node\n * @returns void\n */\n CalculatedField.prototype.displayMenu = function (node) {\n if (document.querySelector('.' + this.parentID + 'calculatedmenu') !== null &&\n node.querySelector('.e-list-icon').classList.contains(cls.ICON) &&\n !node.querySelector('.e-list-icon').classList.contains(cls.CALC_EDITED) &&\n !node.querySelector('.e-list-icon').classList.contains(cls.CALC_EDIT) && node.tagName === 'LI') {\n this.menuObj.close();\n this.curMenu = node.querySelector('.' + cls.LIST_TEXT_CLASS);\n this.openContextMenu();\n }\n else if (node.querySelector('.e-list-icon').classList.contains(cls.CALC_EDIT) && node.tagName === 'LI') {\n addClass([node.querySelector('.e-list-icon')], cls.CALC_EDITED);\n removeClass([node.querySelector('.e-list-icon')], cls.CALC_EDIT);\n node.querySelector('.' + cls.CALC_EDITED).setAttribute('title', this.parent.localeObj.getConstant('clear'));\n this.isEdit = true;\n this.currentFieldName = node.getAttribute('data-field');\n this.inputObj.value = node.getAttribute('data-caption');\n this.dialog.element.querySelector('.' + cls.CALCINPUT).value = node.getAttribute('data-caption');\n document.querySelector('#' + this.parentID + 'droppable').value = node.getAttribute('data-uid');\n }\n else if (node.querySelector('.e-list-icon').classList.contains(cls.CALC_EDITED) && node.tagName === 'LI') {\n addClass([node.querySelector('.e-list-icon')], cls.CALC_EDIT);\n removeClass([node.querySelector('.e-list-icon')], cls.CALC_EDITED);\n node.querySelector('.' + cls.CALC_EDIT).setAttribute('title', this.parent.localeObj.getConstant('edit'));\n this.isEdit = false;\n this.inputObj.value = '';\n this.dialog.element.querySelector('.' + cls.CALCINPUT).value = '';\n document.querySelector('#' + this.parentID + 'droppable').value = '';\n }\n };\n /**\n * To set position for context menu.\n * @returns void\n */\n CalculatedField.prototype.openContextMenu = function () {\n var pos = this.curMenu.getBoundingClientRect();\n if (this.parent.enableRtl) {\n this.menuObj.open(pos.top + 30, pos.left - 100);\n }\n else {\n this.menuObj.open(pos.top + 30, pos.left + 150);\n }\n };\n /**\n * Triggers while select menu.\n * @param {MenuEventArgs} menu\n * @returns void\n */\n CalculatedField.prototype.selectContextMenu = function (menu) {\n if (menu.element.textContent !== null) {\n var field = closest(this.curMenu, '.e-list-item').getAttribute('data-caption');\n closest(this.curMenu, '.e-list-item').setAttribute('data-type', menu.element.textContent);\n this.curMenu.textContent = field + ' (' + menu.element.textContent + ')';\n addClass([this.curMenu.parentElement.parentElement], ['e-node-focus', 'e-hover']);\n this.curMenu.parentElement.parentElement.setAttribute('tabindex', '-1');\n this.curMenu.parentElement.parentElement.focus();\n }\n };\n /**\n * To create context menu.\n * @returns void\n */\n CalculatedField.prototype.createMenu = function () {\n var menuItems = [\n { text: COUNT, },\n { text: AVG },\n { text: MIN },\n { text: MAX },\n { text: SUM },\n { text: DISTINCTCOUNT, },\n { text: PRODUCT },\n { text: STDEV },\n { text: STDEVP },\n { text: VAR },\n { text: VARP }\n ];\n var menuOptions = {\n cssClass: this.parentID + 'calculatedmenu',\n items: menuItems,\n enableRtl: this.parent.enableRtl,\n beforeOpen: this.beforeMenuOpen.bind(this),\n select: this.selectContextMenu.bind(this)\n };\n var contextMenu = createElement('ul', {\n id: this.parentID + 'contextmenu'\n });\n this.parent.element.appendChild(contextMenu);\n this.menuObj = new Menu(menuOptions);\n this.menuObj.appendTo(contextMenu);\n };\n /**\n * Triggers while click OK button.\n * @returns void\n */\n CalculatedField.prototype.applyFormula = function () {\n var currentObj = this;\n var isExist = false;\n removeClass([document.getElementById(this.parentID + 'ddlelement')], cls.EMPTY_FIELD);\n Object.keys(currentObj.parent.engineModule.fieldList).forEach(function (key, index) {\n if (currentObj.inputObj.value && currentObj.inputObj.value === key &&\n currentObj.parent.engineModule.fieldList[key].aggregateType !== 'CalculatedField') {\n isExist = true;\n }\n });\n if (isExist) {\n currentObj.parent.pivotCommon.errorDialog.createErrorDialog(currentObj.parent.localeObj.getConstant('error'), currentObj.parent.localeObj.getConstant('fieldExist'));\n return;\n }\n this.newFields = extend([], this.parent.dataSource.calculatedFieldSettings, null, true);\n this.existingReport = extend({}, this.parent.dataSource, null, true);\n var report = this.parent.dataSource;\n var dropField = document.querySelector('#' + this.parentID + 'droppable');\n if (this.inputObj.value !== null && this.inputObj.value !== '' && dropField.value !== '') {\n var field = {\n name: this.inputObj.value,\n type: 'CalculatedField'\n };\n var cField = {\n name: this.inputObj.value,\n formula: dropField.value\n };\n this.isFieldExist = true;\n if (!this.isEdit) {\n for (var i = 0; i < report.values.length; i++) {\n if (report.values[i].type === CALC && report.values[i].name === field.name) {\n for (var j = 0; j < report.calculatedFieldSettings.length; j++) {\n if (report.calculatedFieldSettings[j].name === field.name) {\n this.createConfirmDialog(currentObj.parent.localeObj.getConstant('alert'), currentObj.parent.localeObj.getConstant('confirmText'));\n return;\n }\n }\n this.isFieldExist = false;\n }\n }\n }\n else {\n for (var i = 0; i < report.values.length; i++) {\n if (report.values[i].type === CALC && this.currentFieldName !== null &&\n report.values[i].name === this.currentFieldName && this.isEdit) {\n for (var j = 0; j < report.calculatedFieldSettings.length; j++) {\n if (report.calculatedFieldSettings[j].name === this.currentFieldName) {\n report.values[i].caption = this.inputObj.value;\n report.calculatedFieldSettings[j].formula = dropField.value;\n this.parent.engineModule.fieldList[this.currentFieldName].caption = this.inputObj.value;\n this.isFieldExist = false;\n }\n }\n }\n }\n }\n if (this.isFieldExist) {\n report.values.push(field);\n report.calculatedFieldSettings.push(cField);\n }\n this.parent.lastCalcFieldInfo = cField;\n this.addFormula(report, field.name);\n }\n else {\n if (this.inputObj.value === null || this.inputObj.value === '') {\n addClass([document.getElementById(this.parentID + 'ddlelement')], cls.EMPTY_FIELD);\n document.getElementById(this.parentID + 'ddlelement').focus();\n }\n else {\n this.parent.pivotCommon.errorDialog.createErrorDialog(this.parent.localeObj.getConstant('error'), this.parent.localeObj.getConstant('invalidFormula'));\n }\n }\n };\n CalculatedField.prototype.addFormula = function (report, field) {\n try {\n this.parent.setProperties({ dataSource: report }, true);\n if (this.parent.getModuleName() === 'pivotfieldlist' && this.parent.allowDeferLayoutUpdate) {\n this.parent.isRequiredUpdate = false;\n }\n this.parent.updateDataSource(false);\n this.isEdit = false;\n if (this.dialog) {\n this.dialog.close();\n }\n else {\n this.inputObj.value = '';\n this.formulaText = null;\n this.fieldText = null;\n this.parent.\n dialogRenderer.parentElement.querySelector('.' + cls.CALCINPUT).value = '';\n this.parent.\n dialogRenderer.parentElement.querySelector('#' + this.parentID + 'droppable').value = '';\n }\n }\n catch (exception) {\n if (this.parent.engineModule.fieldList[field]) {\n delete this.parent.engineModule.fieldList[field];\n }\n this.parent.pivotCommon.errorDialog.createErrorDialog(this.parent.localeObj.getConstant('error'), this.parent.localeObj.getConstant('invalidFormula'));\n this.parent.setProperties({ dataSource: this.existingReport }, true);\n this.parent.lastCalcFieldInfo = {};\n this.parent.updateDataSource(false);\n }\n };\n /**\n * To get treeview data\n * @param {PivotGrid|PivotFieldList} parent\n * @returns Object\n */\n CalculatedField.prototype.getFieldListData = function (parent) {\n var fields = [];\n Object.keys(parent.engineModule.fieldList).forEach(function (key) {\n var type = null;\n if (parent.engineModule.fieldList[key].type === 'string' || parent.engineModule.fieldList[key].type === 'include' ||\n parent.engineModule.fieldList[key].type === 'exclude') {\n type = COUNT;\n }\n else {\n type = parent.engineModule.fieldList[key].aggregateType !== undefined ?\n parent.engineModule.fieldList[key].aggregateType : SUM;\n }\n fields.push({\n index: parent.engineModule.fieldList[key].index,\n name: parent.engineModule.fieldList[key].caption + ' (' + type + ')',\n type: type,\n icon: cls.FORMAT + ' ' + cls.ICON,\n formula: parent.engineModule.fieldList[key].formula,\n field: key,\n caption: parent.engineModule.fieldList[key].caption ? parent.engineModule.fieldList[key].caption : key\n });\n });\n return fields;\n };\n /**\n * Triggers before menu opens.\n * @param {BeforeOpenCloseMenuEventArgs} args\n * @returns void\n */\n CalculatedField.prototype.beforeMenuOpen = function (args) {\n args.element.style.zIndex = (this.dialog.zIndex + 1).toString();\n args.element.style.display = 'inline';\n };\n /**\n * Trigger while drop node in formula field.\n * @param {DragAndDropEventArgs} args\n * @returns void\n */\n CalculatedField.prototype.fieldDropped = function (args) {\n args.cancel = true;\n var field = args.draggedNode.getAttribute('data-field');\n var type = args.draggedNode.getAttribute('data-type');\n var dropField = this.dialog.element.querySelector('#' + this.parentID + 'droppable');\n if (args.target.id === this.parentID + 'droppable' && dropField.value === '') {\n if (type === CALC) {\n dropField.value = args.draggedNodeData.id.toString();\n }\n else {\n dropField.value = '\"' + type + '(' + field + ')' + '\"';\n }\n dropField.focus();\n }\n else if (args.target.id === (this.parentID + 'droppable') && dropField.value !== '') {\n var textCovered = void 0;\n var cursorPos = dropField.selectionStart;\n var currentValue = dropField.value;\n var textBeforeText = currentValue.substring(0, cursorPos);\n var textAfterText = currentValue.substring(cursorPos, currentValue.length);\n if (type === CALC) {\n textCovered = textBeforeText + args.draggedNodeData.id.toString();\n dropField.value = textBeforeText + args.draggedNodeData.id.toString() + textAfterText;\n }\n else {\n textCovered = textBeforeText + '\"' + type + '(' + field + ')' + '\"';\n dropField.value = textBeforeText + '\"' + type + '(' + field + ')' + '\"' + textAfterText;\n }\n dropField.focus();\n dropField.setSelectionRange(textCovered.length, textCovered.length);\n }\n else {\n args.cancel = true;\n }\n };\n /**\n * To create dialog.\n * @returns void\n */\n CalculatedField.prototype.createDialog = function () {\n if (document.querySelector('#' + this.parentID + 'calculateddialog') !== null) {\n remove(document.querySelector('#' + this.parentID + 'calculateddialog'));\n }\n this.parent.element.appendChild(createElement('div', {\n id: this.parentID + 'calculateddialog',\n className: cls.CALCDIALOG\n }));\n this.dialog = new Dialog({\n allowDragging: true,\n position: { X: 'center', Y: 'center' },\n buttons: [\n {\n click: this.applyFormula.bind(this),\n buttonModel: {\n content: this.parent.localeObj.getConstant('ok'),\n isPrimary: true\n }\n },\n {\n click: this.cancelClick.bind(this),\n buttonModel: {\n content: this.parent.localeObj.getConstant('cancel')\n }\n }\n ],\n close: this.closeDialog.bind(this),\n beforeOpen: this.beforeOpen.bind(this),\n animationSettings: { effect: 'Zoom' },\n width: '25%',\n isModal: false,\n closeOnEscape: true,\n enableRtl: this.parent.enableRtl,\n showCloseIcon: true,\n header: this.parent.localeObj.getConstant('createCalculatedField'),\n target: document.body\n });\n this.dialog.appendTo('#' + this.parentID + 'calculateddialog');\n };\n CalculatedField.prototype.cancelClick = function () {\n this.dialog.close();\n this.isEdit = false;\n };\n CalculatedField.prototype.beforeOpen = function (args) {\n this.dialog.element.querySelector('.e-dlg-header').\n setAttribute('title', this.parent.localeObj.getConstant('createCalculatedField'));\n };\n CalculatedField.prototype.closeDialog = function (args) {\n if (this.parent.getModuleName() === 'pivotfieldlist') {\n this.parent.axisFieldModule.render();\n if (this.parent.renderMode !== 'Fixed') {\n addClass([this.parent.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS)], cls.ICON_HIDDEN);\n this.parent.dialogRenderer.fieldListDialog.show();\n }\n }\n this.treeObj.destroy();\n this.dialog.destroy();\n this.newFields = null;\n remove(document.getElementById(this.parentID + 'calculateddialog'));\n remove(document.querySelector('.' + this.parentID + 'calculatedmenu'));\n };\n /**\n * To render dialog elements.\n * @returns void\n */\n CalculatedField.prototype.renderDialogElements = function () {\n var outerDiv = createElement('div', { id: this.parentID + 'outerDiv', className: cls.CALCOUTERDIV });\n if (this.parent.getModuleName() === 'pivotfieldlist' && this.parent.\n dialogRenderer.parentElement.querySelector('.' + cls.FORMULA) !== null && this.parent.isAdaptive) {\n var accordDiv = createElement('div', { id: this.parentID + 'accordDiv', className: cls.CALCACCORD });\n outerDiv.appendChild(accordDiv);\n var buttonDiv = createElement('div', { id: this.parentID + 'buttonDiv', className: cls.CALCBUTTONDIV });\n var addBtn = createElement('button', {\n id: this.parentID + 'addBtn', innerHTML: this.parent.localeObj.getConstant('add'),\n className: cls.CALCADDBTN\n });\n var cancelBtn = createElement('button', {\n id: this.parentID + 'cancelBtn', innerHTML: this.parent.localeObj.getConstant('cancel'),\n className: cls.CALCCANCELBTN\n });\n buttonDiv.appendChild(cancelBtn);\n buttonDiv.appendChild(addBtn);\n outerDiv.appendChild(buttonDiv);\n }\n else {\n var inputDiv = createElement('div', { id: this.parentID + 'outerDiv', className: cls.CALCINPUTDIV });\n var inputObj = createElement('input', {\n id: this.parentID + 'ddlelement',\n attrs: { 'type': 'text', 'tabindex': '1' },\n className: cls.CALCINPUT\n });\n inputDiv.appendChild(inputObj);\n outerDiv.appendChild(inputDiv);\n if (!this.parent.isAdaptive) {\n var fieldTitle = createElement('div', {\n className: cls.PIVOT_ALL_FIELD_TITLE_CLASS,\n innerHTML: this.parent.localeObj.getConstant('formulaField')\n });\n outerDiv.appendChild(fieldTitle);\n }\n var wrapDiv = createElement('div', { id: this.parentID + 'control_wrapper', className: cls.TREEVIEWOUTER });\n wrapDiv.appendChild(createElement('div', { id: this.parentID + 'tree', className: cls.TREEVIEW }));\n outerDiv.appendChild(wrapDiv);\n if (!this.parent.isAdaptive) {\n var formulaTitle = createElement('div', {\n className: cls.PIVOT_FORMULA_TITLE_CLASS,\n innerHTML: this.parent.localeObj.getConstant('formula')\n });\n outerDiv.appendChild(formulaTitle);\n }\n var dropDiv = createElement('textarea', {\n id: this.parentID + 'droppable',\n className: cls.FORMULA,\n attrs: {\n 'placeholder': this.parent.isAdaptive ? this.parent.localeObj.getConstant('dropTextMobile') :\n this.parent.localeObj.getConstant('dropText')\n }\n });\n outerDiv.appendChild(dropDiv);\n if (this.parent.isAdaptive) {\n var buttonDiv = createElement('div', { id: this.parentID + 'buttonDiv', className: cls.CALCBUTTONDIV });\n var okBtn = createElement('button', {\n id: this.parentID + 'okBtn', innerHTML: this.parent.localeObj.getConstant('apply'),\n className: cls.CALCOKBTN\n });\n buttonDiv.appendChild(okBtn);\n outerDiv.appendChild(buttonDiv);\n }\n }\n return outerDiv;\n };\n /**\n * To create calculated field adaptive layout.\n * @returns void\n */\n CalculatedField.prototype.renderAdaptiveLayout = function () {\n if (document.querySelector('#' + this.parentID + 'droppable')) {\n this.formulaText = document.querySelector('#' + this.parentID + 'droppable').value;\n this.fieldText = this.inputObj.value;\n }\n this.renderMobileLayout(this.parent.dialogRenderer.adaptiveElement);\n };\n /**\n * To create treeview.\n * @returns void\n */\n CalculatedField.prototype.createTreeView = function () {\n this.treeObj = new TreeView({\n fields: { dataSource: this.getFieldListData(this.parent), id: 'formula', text: 'name', iconCss: 'icon' },\n allowDragAndDrop: true,\n enableRtl: this.parent.enableRtl,\n nodeCollapsing: this.nodeCollapsing.bind(this),\n nodeDragStart: this.dragStart.bind(this),\n nodeClicked: this.fieldClickHandler.bind(this),\n nodeDragStop: this.fieldDropped.bind(this),\n drawNode: this.drawTreeNode.bind(this),\n sortOrder: 'Ascending'\n });\n this.treeObj.appendTo('#' + this.parentID + 'tree');\n };\n CalculatedField.prototype.nodeCollapsing = function (args) {\n args.cancel = true;\n };\n CalculatedField.prototype.dragStart = function (args) {\n if (args.event.target.classList.contains(cls.DRAG_CLASS)) {\n var dragItem = document.querySelector('.e-drag-item.e-treeview');\n addClass([dragItem], cls.PIVOTCALC);\n dragItem.style.zIndex = (this.dialog.zIndex + 1).toString();\n dragItem.style.display = 'inline';\n }\n else {\n args.cancel = true;\n }\n };\n /**\n * Trigger before treeview text append.\n * @param {DrawNodeEventArgs} args\n * @returns void\n */\n CalculatedField.prototype.drawTreeNode = function (args) {\n var field = args.nodeData.field;\n args.node.setAttribute('data-field', field);\n args.node.setAttribute('data-caption', args.nodeData.caption);\n args.node.setAttribute('data-type', args.nodeData.type);\n var dragElement = createElement('span', {\n attrs: { 'tabindex': '-1', 'aria-disabled': 'false', 'title': this.parent.localeObj.getConstant('dragField') },\n className: cls.ICON + ' e-drag'\n });\n prepend([dragElement], args.node.querySelector('.' + cls.TEXT_CONTENT_CLASS));\n append([args.node.querySelector('.' + cls.FORMAT)], args.node.querySelector('.' + cls.TEXT_CONTENT_CLASS));\n if (this.parent.engineModule.fieldList[field].type !== 'number' &&\n this.parent.engineModule.fieldList[field].aggregateType !== CALC) {\n removeClass([args.node.querySelector('.' + cls.FORMAT)], cls.ICON);\n }\n else {\n args.node.querySelector('.' + cls.FORMAT).setAttribute('title', this.parent.localeObj.getConstant('format'));\n }\n if (this.parent.engineModule.fieldList[field].aggregateType === CALC) {\n args.node.querySelector('.' + cls.FORMAT).setAttribute('title', this.parent.localeObj.getConstant('edit'));\n addClass([args.node.querySelector('.' + cls.FORMAT)], cls.CALC_EDIT);\n removeClass([args.node.querySelector('.' + cls.FORMAT)], cls.FORMAT);\n }\n };\n /**\n * To create radio buttons.\n * @param {string} key\n * @returns HTMLElement\n */\n CalculatedField.prototype.createTypeContainer = function (key) {\n var wrapDiv = createElement('div', { id: this.parentID + 'control_wrapper', className: cls.TREEVIEWOUTER });\n var type = [SUM, COUNT, AVG, MIN, MAX, DISTINCTCOUNT, PRODUCT, STDEV, STDEVP, VAR, VARP];\n for (var i = 0; i < type.length; i++) {\n var input = createElement('input', {\n id: this.parentID + 'radio' + key + type[i],\n attrs: { 'type': 'radio', 'data-ftxt': key },\n className: cls.CALCRADIO\n });\n wrapDiv.appendChild(input);\n }\n return wrapDiv;\n };\n /**\n * To get Accordion Data.\n * @param {PivotView | PivotFieldList} parent\n * @returns AccordionItemModel\n */\n CalculatedField.prototype.getAccordionData = function (parent) {\n var _this = this;\n var data = [];\n Object.keys(parent.engineModule.fieldList).forEach(function (key, index) {\n data.push({\n header: '',\n content: parent.engineModule.fieldList[key].aggregateType === CALC ||\n _this.parent.engineModule.fieldList[key].type !== 'number' ? '' : _this.createTypeContainer(key).outerHTML\n });\n });\n return data;\n };\n /**\n * To render mobile layout.\n * @param {Tab} tabObj\n * @returns void\n */\n CalculatedField.prototype.renderMobileLayout = function (tabObj) {\n tabObj.items[4].content = this.renderDialogElements().outerHTML;\n tabObj.dataBind();\n var cancelBtn = new Button({ cssClass: cls.FLAT, isPrimary: true });\n cancelBtn.appendTo('#' + this.parentID + 'cancelBtn');\n if (cancelBtn.element) {\n cancelBtn.element.onclick = this.cancelBtnClick.bind(this);\n }\n if (this.parent.\n dialogRenderer.parentElement.querySelector('.' + cls.FORMULA) !== null && this.parent.isAdaptive) {\n var okBtn = new Button({ cssClass: cls.FLAT + ' ' + cls.OUTLINE_CLASS, isPrimary: true });\n okBtn.appendTo('#' + this.parentID + 'okBtn');\n this.inputObj = new MaskedTextBox({\n placeholder: this.parent.localeObj.getConstant('fieldName')\n });\n this.inputObj.appendTo('#' + this.parentID + 'ddlelement');\n if (this.formulaText !== null && this.parent.\n dialogRenderer.parentElement.querySelector('#' + this.parentID + 'droppable') !== null) {\n var drop = this.parent.\n dialogRenderer.parentElement.querySelector('#' + this.parentID + 'droppable');\n drop.value = this.formulaText;\n }\n if (this.fieldText !== null && this.parent.\n dialogRenderer.parentElement.querySelector('.' + cls.CALCINPUT) !== null) {\n this.parent.\n dialogRenderer.parentElement.querySelector('.' + cls.CALCINPUT).value = this.fieldText;\n this.inputObj.value = this.fieldText;\n }\n if (okBtn.element) {\n okBtn.element.onclick = this.applyFormula.bind(this);\n }\n }\n else if (this.parent.isAdaptive) {\n var accordion = new Accordion({\n items: this.getAccordionData(this.parent),\n enableRtl: this.parent.enableRtl,\n expanding: this.accordionExpand.bind(this),\n });\n var addBtn = new Button({ cssClass: cls.FLAT, isPrimary: true });\n addBtn.appendTo('#' + this.parentID + 'addBtn');\n accordion.appendTo('#' + this.parentID + 'accordDiv');\n Object.keys(this.parent.engineModule.fieldList).forEach(this.updateType.bind(this));\n if (addBtn.element) {\n addBtn.element.onclick = this.addBtnClick.bind(this);\n }\n }\n };\n CalculatedField.prototype.accordionExpand = function (args) {\n var _this = this;\n if (args.element.querySelectorAll('.e-radio-wrapper').length === 0) {\n Object.keys(this.parent.engineModule.fieldList).forEach(function (key) {\n var type = [SUM, COUNT, AVG, MIN, MAX, DISTINCTCOUNT, PRODUCT, STDEV, STDEVP, VAR, VARP];\n var radiobutton;\n if (key === args.element.querySelector('[data-field').getAttribute('data-field')) {\n for (var i = 0; i < type.length; i++) {\n radiobutton = new RadioButton({\n label: type[i],\n name: AGRTYPE + key,\n change: _this.onChange.bind(_this),\n });\n radiobutton.appendTo('#' + _this.parentID + 'radio' + key + type[i]);\n }\n }\n });\n }\n };\n CalculatedField.prototype.onChange = function (args) {\n var type = args.event.target.parentElement.querySelector('.e-label').\n innerText;\n var field = args.event.target.closest('.e-acrdn-item').\n querySelector('[data-field').getAttribute('data-caption');\n args.event.target.\n closest('.e-acrdn-item').querySelector('.e-label').\n innerText = field + ' (' + type + ')';\n args.event.target.closest('.e-acrdn-item').\n querySelector('[data-type').setAttribute('data-type', type);\n };\n CalculatedField.prototype.updateType = function (key, index) {\n var type = null;\n if (this.parent.engineModule.fieldList[key].type === 'string' ||\n this.parent.engineModule.fieldList[key].type === 'include' ||\n this.parent.engineModule.fieldList[key].type === 'exclude') {\n type = COUNT;\n }\n else {\n type = this.parent.engineModule.fieldList[key].aggregateType !== undefined ?\n this.parent.engineModule.fieldList[key].aggregateType : SUM;\n }\n var checkbox = new CheckBox({\n label: this.parent.engineModule.fieldList[key].caption + ' (' + type + ')'\n });\n checkbox.appendTo('#' + this.parentID + '_' + index);\n document.querySelector('#' + this.parentID + '_' + index).setAttribute('data-field', key);\n document.querySelector('#' + this.parentID + '_' + index).setAttribute('data-type', type);\n };\n /**\n * Trigger while click cancel button.\n * @returns void\n */\n CalculatedField.prototype.cancelBtnClick = function () {\n this.renderMobileLayout(this.parent.dialogRenderer.adaptiveElement);\n };\n /**\n * Trigger while click add button.\n * @returns void\n */\n CalculatedField.prototype.addBtnClick = function () {\n var node = document.querySelectorAll('.e-accordion .e-check');\n var fieldText = '';\n var field = null;\n var type = null;\n for (var i = 0; i < node.length; i++) {\n field = node[i].parentElement.querySelector('[data-field]').getAttribute('data-field');\n type = node[i].parentElement.querySelector('[data-field]').getAttribute('data-type');\n if (type.indexOf(CALC) === -1) {\n fieldText = fieldText + ('\"' + type + '(' + field + ')' + '\"');\n }\n else {\n for (var j = 0; j < this.parent.dataSource.calculatedFieldSettings.length; j++) {\n if (this.parent.dataSource.calculatedFieldSettings[j].name === field) {\n fieldText = fieldText + this.parent.dataSource.calculatedFieldSettings[j].formula;\n break;\n }\n }\n }\n }\n this.formulaText = this.formulaText !== null ? (this.formulaText + fieldText) : fieldText;\n this.renderMobileLayout(this.parent.dialogRenderer.adaptiveElement);\n };\n /**\n * To create calculated field dialog elements.\n * @returns void\n * @hidden\n */\n CalculatedField.prototype.createCalculatedFieldDialog = function () {\n if (this.parent.isAdaptive && this.parent.getModuleName() === 'pivotfieldlist') {\n this.renderAdaptiveLayout();\n }\n else if (!this.parent.isAdaptive) {\n this.renderDialogLayout();\n this.dialog.element.style.top = parseInt(this.dialog.element.style.top, 10) < 0 ? '0px' : this.dialog.element.style.top;\n }\n };\n /**\n * To create calculated field desktop layout.\n * @returns void\n */\n CalculatedField.prototype.renderDialogLayout = function () {\n this.newFields = extend([], this.parent.dataSource.calculatedFieldSettings, null, true);\n this.createDialog();\n this.dialog.content = this.renderDialogElements();\n this.dialog.refresh();\n this.inputObj = new MaskedTextBox({\n placeholder: this.parent.localeObj.getConstant('fieldName')\n });\n this.inputObj.appendTo('#' + this.parentID + 'ddlelement');\n this.createTreeView();\n this.createMenu();\n this.droppable = new Droppable(this.dialog.element.querySelector('#' + this.parentID + 'droppable'));\n this.keyboardEvents = new KeyboardEvents(this.parent.calculatedFieldModule.dialog.element, {\n keyAction: this.keyActionHandler.bind(this),\n keyConfigs: { moveRight: 'rightarrow', enter: 'enter' },\n eventName: 'keydown'\n });\n };\n /**\n * Creates the error dialog for the unexpected action done.\n * @method createConfirmDialog\n * @return {void}\n * @hidden\n */\n CalculatedField.prototype.createConfirmDialog = function (title, description) {\n var errorDialog = createElement('div', {\n id: this.parentID + '_ErrorDialog',\n className: cls.ERROR_DIALOG_CLASS\n });\n this.parent.element.appendChild(errorDialog);\n this.confirmPopUp = new Dialog({\n animationSettings: { effect: 'Fade' },\n allowDragging: false,\n showCloseIcon: true,\n enableRtl: this.parent.enableRtl,\n width: 'auto',\n height: 'auto',\n position: { X: 'center', Y: 'center' },\n buttons: [\n {\n click: this.replaceFormula.bind(this),\n buttonModel: {\n cssClass: cls.OK_BUTTON_CLASS + ' ' + cls.OUTLINE_CLASS,\n content: this.parent.localeObj.getConstant('ok'), isPrimary: true\n }\n },\n {\n click: this.removeErrorDialog.bind(this),\n buttonModel: {\n cssClass: cls.CANCEL_BUTTON_CLASS,\n content: this.parent.localeObj.getConstant('cancel'), isPrimary: true\n }\n }\n ],\n header: title,\n content: description,\n isModal: true,\n visible: true,\n closeOnEscape: true,\n target: document.body,\n close: this.removeErrorDialog.bind(this)\n });\n this.confirmPopUp.appendTo(errorDialog);\n };\n CalculatedField.prototype.replaceFormula = function () {\n var report = this.parent.dataSource;\n var dropField = document.querySelector('#' + this.parentID + 'droppable');\n for (var i = 0; i < report.values.length; i++) {\n if (report.values[i].type === CALC && report.values[i].name === this.inputObj.value) {\n for (var j = 0; j < report.calculatedFieldSettings.length; j++) {\n if (report.calculatedFieldSettings[j].name === this.inputObj.value) {\n report.calculatedFieldSettings[j].formula = dropField.value;\n this.parent.lastCalcFieldInfo = report.calculatedFieldSettings[j];\n }\n }\n }\n }\n this.addFormula(report, this.inputObj.value);\n this.removeErrorDialog();\n };\n CalculatedField.prototype.removeErrorDialog = function () {\n if (document.getElementById(this.parentID + '_ErrorDialog')) {\n remove(document.getElementById(this.parentID + '_ErrorDialog').parentElement);\n }\n };\n /**\n * To add event listener.\n * @returns void\n * @hidden\n */\n CalculatedField.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.initCalculatedField, this.createCalculatedFieldDialog, this);\n };\n /**\n * To remove event listener.\n * @returns void\n * @hidden\n */\n CalculatedField.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.initCalculatedField, this.createCalculatedFieldDialog);\n };\n /**\n * To destroy the calculated field dialog\n * @returns void\n * @hidden\n */\n CalculatedField.prototype.destroy = function () {\n this.removeEventListener();\n };\n return CalculatedField;\n}());\nexport { CalculatedField };\n","import * as events from '../../common/base/constant';\nimport * as cls from '../base/css-constant';\nimport { PivotFieldList } from '../../pivotfieldlist/base/field-list';\nimport { createElement, setStyleAttribute, formatUnit, prepend, addClass, removeClass } from '@syncfusion/ej2-base';\nimport { CalculatedField } from '../../common/calculatedfield/calculated-field';\nPivotFieldList.Inject(CalculatedField);\n/**\n * Module for Field List rendering\n */\n/** @hidden */\nvar FieldList = /** @class */ (function () {\n /** Constructor for Field List module */\n function FieldList(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n /**\n * For internal use only - Get the module name.\n * @private\n */\n FieldList.prototype.getModuleName = function () {\n return 'fieldlist';\n };\n FieldList.prototype.initiateModule = function () {\n this.element = createElement('div', {\n id: this.parent.element.id + '_PivotFieldList',\n styles: 'position:' + (this.parent.enableRtl ? 'static' : 'absolute') + ';height:0;width:' + this.parent.element.style.width\n });\n this.parent.element.parentElement.setAttribute('id', 'ContainerWrapper');\n this.parent.element.parentElement.appendChild(this.element);\n this.parent.element.parentElement.appendChild(this.parent.element);\n this.parent.pivotFieldListModule = new PivotFieldList({\n dataSource: {\n rows: [],\n columns: [],\n values: [],\n filters: []\n },\n allowDeferLayoutUpdate: this.parent.allowDeferLayoutUpdate,\n renderMode: 'Popup',\n allowCalculatedField: this.parent.allowCalculatedField,\n enableRtl: this.parent.enableRtl,\n locale: this.parent.locale,\n target: this.parent.element.parentElement\n });\n this.parent.pivotFieldListModule.appendTo('#' + this.element.id);\n };\n FieldList.prototype.updateControl = function () {\n if (this.element) {\n prepend([this.element], this.parent.element);\n if (this.parent.showGroupingBar && this.parent.groupingBarModule) {\n clearTimeout(this.timeOutObj);\n this.timeOutObj = setTimeout(this.update.bind(this));\n }\n else {\n if (this.parent.enableRtl) {\n removeClass([this.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS)], 'e-fieldlist-left');\n }\n else {\n addClass([this.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS)], 'e-fieldlist-left');\n }\n }\n setStyleAttribute(this.element, {\n width: formatUnit(this.parent.element.offsetWidth)\n });\n }\n this.parent.pivotFieldListModule.update(this.parent);\n };\n FieldList.prototype.update = function () {\n var currentWidth;\n if (this.parent.currentView !== 'Table') {\n currentWidth = this.parent.chart ? this.parent.chartModule.calculatedWidth : currentWidth;\n }\n else {\n currentWidth = this.parent.grid ? this.parent.grid.element.offsetWidth : currentWidth;\n }\n if (currentWidth) {\n var actualWidth = currentWidth < 400 ? 400 : currentWidth;\n setStyleAttribute(this.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS), {\n left: formatUnit(this.parent.enableRtl ?\n -Math.abs((actualWidth) -\n this.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS).offsetWidth) :\n (actualWidth) -\n this.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS).offsetWidth)\n });\n if (this.parent.enableRtl) {\n addClass([this.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS)], 'e-fieldlist-left');\n }\n else {\n removeClass([this.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS)], 'e-fieldlist-left');\n }\n }\n };\n /**\n * @hidden\n */\n FieldList.prototype.addEventListener = function () {\n this.handlers = {\n load: this.initiateModule,\n update: this.updateControl\n };\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.initSubComponent, this.handlers.load, this);\n this.parent.on(events.uiUpdate, this.handlers.update, this);\n };\n /**\n * @hidden\n */\n FieldList.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.initSubComponent, this.handlers.load);\n this.parent.off(events.uiUpdate, this.handlers.update);\n };\n /**\n * To destroy the Field List\n * @return {void}\n * @hidden\n */\n FieldList.prototype.destroy = function () {\n this.removeEventListener();\n if (this.parent.pivotFieldListModule) {\n this.parent.pivotFieldListModule.destroy();\n }\n else {\n return;\n }\n };\n return FieldList;\n}());\nexport { FieldList };\n","import * as events from '../../common/base/constant';\nimport { PivotCommon } from '../../common/base/pivot-common';\nimport { Browser } from '@syncfusion/ej2-base';\n/**\n * Module for PivotCommon rendering\n */\n/** @hidden */\nvar Common = /** @class */ (function () {\n /** Constructor for Common module */\n function Common(parent) {\n this.parent = parent;\n this.parent.commonModule = this;\n this.addEventListener();\n }\n /**\n * For internal use only - Get the module name.\n * @private\n */\n Common.prototype.getModuleName = function () {\n return 'common';\n };\n Common.prototype.initiateCommonModule = function () {\n if (!this.parent.pivotCommon) {\n var args = {\n pivotEngine: this.parent.engineModule,\n dataSource: this.parent.dataSource.properties ?\n this.parent.dataSource.properties : this.parent.dataSource,\n id: this.parent.element.id,\n element: this.parent.element,\n moduleName: this.parent.getModuleName(),\n enableRtl: this.parent.enableRtl,\n isAdaptive: Browser.isDevice,\n renderMode: 'Popup',\n localeObj: this.parent.localeObj\n };\n this.parent.pivotCommon = new PivotCommon(args);\n }\n else {\n this.parent.pivotCommon.element = this.parent.element;\n this.parent.pivotCommon.engineModule = this.parent.engineModule;\n this.parent.pivotCommon.parentID = this.parent.element.id;\n this.parent.pivotCommon.dataSource = this.parent.dataSource.properties ?\n this.parent.dataSource.properties : this.parent.dataSource;\n this.parent.pivotCommon.moduleName = this.parent.getModuleName();\n this.parent.pivotCommon.enableRtl = this.parent.enableRtl;\n this.parent.pivotCommon.isAdaptive = Browser.isDevice;\n this.parent.pivotCommon.renderMode = 'Popup';\n this.parent.pivotCommon.localeObj = this.parent.localeObj;\n }\n this.parent.pivotCommon.control = this.parent;\n };\n /**\n * @hidden\n */\n Common.prototype.addEventListener = function () {\n this.handlers = {\n load: this.initiateCommonModule\n };\n if (this.parent.isDestroyed) {\n return;\n }\n if (this.parent.gridSettings.contextMenuItems) {\n if ((!this.parent.showFieldList) || (!this.parent.showGroupingBar)) {\n this.parent.on(events.initialLoad, this.handlers.load, this);\n }\n }\n this.parent.on(events.uiUpdate, this.handlers.load, this);\n };\n /**\n * @hidden\n */\n Common.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.uiUpdate, this.handlers.load);\n };\n /**\n * To destroy the groupingbar\n * @return {void}\n * @hidden\n */\n Common.prototype.destroy = function () {\n this.removeEventListener();\n if (this.parent.pivotCommon) {\n this.parent.pivotCommon.destroy();\n }\n };\n return Common;\n}());\nexport { Common };\n","import { PivotButton } from '../actions/pivot-button';\nimport * as events from '../../common/base/constant';\nimport * as cls from '../../common/base/css-constant';\nimport { createElement, prepend } from '@syncfusion/ej2-base';\n/**\n * Module to render Axis Fields\n */\n/** @hidden */\nvar AxisFields = /** @class */ (function () {\n /** Constructor for render module */\n function AxisFields(parent) {\n this.parent = parent;\n }\n /**\n * Initialize the pivot button rendering\n * @returns void\n * @private\n */\n AxisFields.prototype.render = function () {\n this.pivotButton = new PivotButton(this.parent);\n this.createPivotButtons();\n var pivotButtons = [];\n /* tslint:disable:no-any */\n for (var _i = 0, _a = this.parent.element.querySelectorAll('.' + cls.GROUP_ROW_CLASS); _i < _a.length; _i++) {\n var element = _a[_i];\n if (!element.classList.contains(cls.GROUP_CHART_ROW)) {\n pivotButtons = pivotButtons.concat([].slice.call(element.querySelectorAll('.' + cls.PIVOT_BUTTON_WRAPPER_CLASS)));\n }\n }\n var vlen = pivotButtons.length;\n for (var j = 0; j < vlen; j++) {\n var indentWidth = 24;\n var indentDiv = createElement('span', {\n className: 'e-indent-div',\n styles: 'width:' + j * indentWidth + 'px'\n });\n prepend([indentDiv], pivotButtons[j]);\n }\n };\n AxisFields.prototype.createPivotButtons = function () {\n var fields = [this.parent.dataSource.rows, this.parent.dataSource.columns, this.parent.dataSource.values, this.parent.dataSource.filters];\n for (var _i = 0, _a = this.parent.element.querySelectorAll('.' + cls.GROUP_ROW_CLASS + ',.' + cls.GROUP_COLUMN_CLASS + ',.'\n + cls.GROUP_VALUE_CLASS + ',.' + cls.GROUP_FILTER_CLASS); _i < _a.length; _i++) {\n var element = _a[_i];\n if (this.parent.dataSource.values.length > 0 ? !element.classList.contains(cls.GROUP_CHART_VALUE) : true) {\n element.innerHTML = '';\n }\n }\n var axis = ['rows', 'columns', 'values', 'filters'];\n var count = axis.length;\n for (var i = 0, lnt = fields.length; i < lnt; i++) {\n if (fields[i]) {\n var args = {\n field: fields[i],\n axis: axis[i].toString()\n };\n this.parent.notify(events.pivotButtonUpdate, args);\n }\n }\n };\n return AxisFields;\n}());\nexport { AxisFields };\n","import { createElement, remove, Droppable, setStyleAttribute, removeClass } from '@syncfusion/ej2-base';\nimport { EventHandler, Touch, closest, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { addClass, formatUnit } from '@syncfusion/ej2-base';\nimport { PivotView } from '../../pivotview/base/pivotview';\nimport { Common } from '../actions/common';\nimport * as events from '../../common/base/constant';\nimport * as cls from '../../common/base/css-constant';\nimport { AxisFields } from './axis-field-renderer';\nPivotView.Inject(Common);\n/**\n * Module for GroupingBar rendering\n */\n/** @hidden */\nvar GroupingBar = /** @class */ (function () {\n /** Constructor for GroupingBar module */\n function GroupingBar(parent) {\n this.parent = parent;\n this.parent.groupingBarModule = this;\n this.resColWidth = (this.parent.isAdaptive ? 180 : 249);\n this.addEventListener();\n this.parent.axisFieldModule = new AxisFields(this.parent);\n this.touchObj = new Touch(this.parent.element, {\n tapHold: this.tapHoldHandler.bind(this)\n });\n }\n /**\n * For internal use only - Get the module name.\n * @private\n */\n GroupingBar.prototype.getModuleName = function () {\n return 'grouping';\n };\n GroupingBar.prototype.renderLayout = function () {\n this.groupingTable = createElement('div', { className: cls.GROUPING_BAR_CLASS });\n this.leftAxisPanel = createElement('div', { className: cls.LEFT_AXIS_PANEL_CLASS });\n this.rightAxisPanel = createElement('div', { className: cls.RIGHT_AXIS_PANEL_CLASS });\n var rowAxisPanel = createElement('div', { className: cls.AXIS_ROW_CLASS + ' ' + cls.AXIS_ICON_CLASS + 'wrapper' });\n var columnAxisPanel = createElement('div', {\n className: cls.AXIS_COLUMN_CLASS + ' ' + cls.AXIS_ICON_CLASS + 'wrapper'\n });\n var valueAxisPanel = createElement('div', {\n className: cls.AXIS_VALUE_CLASS + ' ' + cls.AXIS_ICON_CLASS + 'wrapper'\n });\n var filterAxisPanel = createElement('div', {\n className: cls.AXIS_FILTER_CLASS + ' ' + cls.AXIS_ICON_CLASS + 'wrapper'\n });\n this.rowPanel = createElement('div', { className: cls.GROUP_ROW_CLASS + ' ' + cls.ROW_AXIS_CLASS });\n this.columnPanel = createElement('div', { className: cls.GROUP_COLUMN_CLASS + ' ' + cls.COLUMN_AXIS_CLASS });\n this.valuePanel = createElement('div', { className: cls.GROUP_VALUE_CLASS + ' ' + cls.VALUE_AXIS_CLASS });\n this.filterPanel = createElement('div', { className: cls.GROUP_FILTER_CLASS + ' ' + cls.FILTER_AXIS_CLASS });\n rowAxisPanel.appendChild(this.rowPanel);\n columnAxisPanel.appendChild(this.columnPanel);\n valueAxisPanel.appendChild(this.valuePanel);\n filterAxisPanel.appendChild(this.filterPanel);\n this.rowAxisPanel = rowAxisPanel;\n this.columnAxisPanel = columnAxisPanel;\n this.valueAxisPanel = valueAxisPanel;\n this.filterAxisPanel = filterAxisPanel;\n this.leftAxisPanel.appendChild(valueAxisPanel);\n this.leftAxisPanel.appendChild(rowAxisPanel);\n this.rightAxisPanel.appendChild(filterAxisPanel);\n this.rightAxisPanel.appendChild(columnAxisPanel);\n this.groupingTable.appendChild(this.leftAxisPanel);\n this.groupingTable.appendChild(this.rightAxisPanel);\n var axisPanels = [this.rowPanel, this.columnPanel, this.valuePanel, this.filterPanel];\n for (var _i = 0, axisPanels_1 = axisPanels; _i < axisPanels_1.length; _i++) {\n var element = axisPanels_1[_i];\n if (this.parent.groupingBarSettings.allowDragAndDrop) {\n new Droppable(element, {});\n }\n this.unWireEvent(element);\n this.wireEvent(element);\n }\n if (this.parent.displayOption.view !== 'Table' && this.parent.groupingBarSettings.displayMode !== 'Table') {\n this.groupingChartTable = this.groupingTable.cloneNode(true);\n this.groupingChartTable.classList.add(cls.CHART_GROUPING_BAR_CLASS);\n this.groupingChartTable.querySelector('.' + cls.GROUP_ROW_CLASS).classList.add(cls.GROUP_CHART_ROW);\n this.groupingChartTable.querySelector('.' + cls.GROUP_COLUMN_CLASS).classList.add(cls.GROUP_CHART_COLUMN);\n if (this.parent.chartSettings.enableMultiAxis) {\n this.groupingChartTable.querySelector('.' + cls.GROUP_VALUE_CLASS).classList.add(cls.GROUP_CHART_MULTI_VALUE);\n }\n else {\n this.groupingChartTable.querySelector('.' + cls.GROUP_VALUE_CLASS).classList.add(cls.GROUP_CHART_VALUE);\n this.groupingChartTable.querySelector('.' + cls.GROUP_VALUE_CLASS).classList.remove(cls.DROPPABLE_CLASS);\n }\n this.groupingChartTable.querySelector('.' + cls.GROUP_FILTER_CLASS).classList.add(cls.GROUP_CHART_FILTER);\n }\n else {\n this.groupingChartTable = undefined;\n }\n if (this.parent.displayOption.view === 'Chart' || this.parent.groupingBarSettings.displayMode === 'Chart') {\n this.groupingTable = undefined;\n }\n };\n GroupingBar.prototype.appendToElement = function () {\n if (this.parent.element.querySelector('.' + cls.GROUPING_BAR_CLASS)) {\n /* tslint:disable:no-any */\n for (var _i = 0, _a = this.parent.element.querySelectorAll('.' + cls.GROUPING_BAR_CLASS); _i < _a.length; _i++) {\n var element = _a[_i];\n remove(element);\n }\n }\n if (this.groupingChartTable) {\n if (this.parent.element.querySelector('#' + this.parent.element.id + '_chart')) {\n setStyleAttribute(this.groupingChartTable, { width: formatUnit(this.parent.chart.width) });\n this.parent.element.insertBefore(this.groupingChartTable, this.parent.element.querySelector('#' + this.parent.element.id + '_chart'));\n }\n else {\n this.groupingChartTable = undefined;\n }\n }\n if (this.parent.displayOption.view !== 'Chart' && this.groupingTable) {\n if (this.parent.isAdaptive) {\n this.leftAxisPanel.style.minWidth = '180px';\n this.valuePanel.style.minWidth = '180px';\n }\n if (this.parent.firstColWidth) {\n this.leftAxisPanel.style.minWidth = 'auto';\n this.valuePanel.style.minWidth = 'auto';\n }\n this.filterPanel.removeAttribute('style');\n this.columnPanel.removeAttribute('style');\n this.rowPanel.removeAttribute('style');\n this.filterPanel.removeAttribute('style');\n var emptyRowCount = Object.keys(this.parent.engineModule.headerContent).length;\n if (emptyRowCount) {\n var emptyHeader = this.parent.element.querySelector('.e-frozenheader').querySelector('.e-columnheader');\n addClass([emptyHeader], 'e-row');\n emptyHeader.removeAttribute('style');\n addClass([emptyHeader.querySelector('.e-headercell')], 'e-group-row');\n emptyHeader.querySelector('.e-group-row').appendChild(this.rowAxisPanel);\n emptyHeader.querySelector('.e-group-row').querySelector('.e-headercelldiv').style.display = 'none';\n emptyHeader.querySelector('.e-group-row').querySelector('.e-sortfilterdiv').style.display = 'none';\n }\n this.parent.element.insertBefore(this.groupingTable, this.parent.element.querySelector('.' + cls.GRID_CLASS));\n setStyleAttribute(this.groupingTable, { width: formatUnit(this.parent.grid.width) });\n this.groupingTable.style.minWidth = '400px';\n this.parent.axisFieldModule.render();\n this.setGridRowWidth();\n var colGroupElement = this.parent.element.querySelector('.e-frozenheader').querySelector('colgroup').children[0];\n var rightAxisPanelWidth = formatUnit(this.groupingTable.offsetWidth - parseInt(colGroupElement.style.width, 10));\n setStyleAttribute(this.valuePanel, { width: colGroupElement.style.width });\n setStyleAttribute(this.rightAxisPanel, { width: rightAxisPanelWidth });\n var rightPanelHeight = (this.valuePanel.offsetHeight / 2);\n if (rightPanelHeight > this.columnPanel.offsetHeight) {\n setStyleAttribute(this.filterPanel, { height: formatUnit(rightPanelHeight) });\n setStyleAttribute(this.columnPanel, { height: formatUnit(rightPanelHeight + 1) });\n }\n var topLeftHeight = this.parent.element.querySelector('.e-headercontent').offsetHeight;\n setStyleAttribute(this.rowPanel, {\n height: topLeftHeight + 'px'\n });\n if (this.parent.element.querySelector('.e-frozenheader').querySelector('.e-rhandler')) {\n this.parent.element.querySelector('.e-frozenheader').querySelector('.e-rhandler').style.height =\n topLeftHeight + 'px';\n }\n var colRows = [].slice.call(this.parent.element.querySelector('.e-movableheader').querySelector('thead').querySelectorAll('tr'));\n var columnRows = colRows.filter(function (trCell) {\n return (trCell.childNodes.length > 0);\n });\n var colHeight = topLeftHeight / columnRows.length;\n for (var _b = 0, columnRows_1 = columnRows; _b < columnRows_1.length; _b++) {\n var element = columnRows_1[_b];\n setStyleAttribute(element, { 'height': colHeight + 'px' });\n var rowHeader = [].slice.call(element.querySelectorAll('.e-rhandler'));\n for (var _c = 0, rowHeader_1 = rowHeader; _c < rowHeader_1.length; _c++) {\n var rhElement = rowHeader_1[_c];\n setStyleAttribute(rhElement, { 'height': colHeight + 'px' });\n }\n }\n }\n else {\n this.parent.axisFieldModule.render();\n }\n };\n /**\n * @hidden\n */\n GroupingBar.prototype.refreshUI = function () {\n setStyleAttribute(this.groupingTable, { width: formatUnit(this.parent.grid.width) });\n this.groupingTable.style.minWidth = '400px';\n var colGroupElement = this.parent.element.querySelector('.e-frozenheader').querySelector('colgroup').children[0];\n var rightAxisWidth = formatUnit(this.groupingTable.offsetWidth - parseInt(colGroupElement.style.width, 10));\n setStyleAttribute(this.valuePanel, { width: colGroupElement.style.width });\n setStyleAttribute(this.rightAxisPanel, { width: rightAxisWidth });\n if (this.parent.showFieldList && this.parent.pivotFieldListModule && this.parent.pivotFieldListModule.element) {\n clearTimeout(this.timeOutObj);\n this.timeOutObj = setTimeout(this.alignIcon.bind(this));\n }\n if (!this.parent.grid.element.querySelector('.e-group-row')) {\n var emptyRowHeader = this.parent.element.querySelector('.e-frozenheader').querySelector('.e-columnheader');\n addClass([emptyRowHeader], 'e-row');\n addClass([emptyRowHeader.querySelector('.e-headercell')], 'e-group-row');\n emptyRowHeader.querySelector('.e-group-row').appendChild(this.rowAxisPanel);\n setStyleAttribute(emptyRowHeader.querySelector('.e-group-row').querySelector('.e-headercelldiv'), {\n display: 'none'\n });\n setStyleAttribute(emptyRowHeader.querySelector('.e-group-row').querySelector('.e-sortfilterdiv'), {\n display: 'none'\n });\n var groupHeight = this.parent.element.querySelector('.e-headercontent').offsetHeight;\n setStyleAttribute(this.rowPanel, {\n height: groupHeight + 'px'\n });\n if (this.parent.element.querySelector('.e-frozenheader').querySelector('.e-rhandler')) {\n this.parent.element.querySelector('.e-frozenheader').querySelector('.e-rhandler').style.height =\n groupHeight + 'px';\n }\n var colRowElements = [].slice.call(this.parent.element.querySelector('.e-movableheader').querySelector('thead').querySelectorAll('tr'));\n var columnRows = colRowElements.filter(function (trCell) {\n return (trCell.childNodes.length > 0);\n });\n var colHeight = groupHeight / columnRows.length;\n for (var _i = 0, columnRows_2 = columnRows; _i < columnRows_2.length; _i++) {\n var element = columnRows_2[_i];\n setStyleAttribute(element, { 'height': colHeight + 'px' });\n var rowHeader = [].slice.call(element.querySelectorAll('.e-rhandler'));\n for (var _a = 0, rowHeader_2 = rowHeader; _a < rowHeader_2.length; _a++) {\n var handlerElement = rowHeader_2[_a];\n setStyleAttribute(handlerElement, { 'height': colHeight + 'px' });\n }\n }\n }\n };\n /** @hidden */\n GroupingBar.prototype.alignIcon = function () {\n var element = this.parent.pivotFieldListModule.element;\n var currentWidth;\n if (this.parent.currentView === 'Table') {\n currentWidth = this.parent.grid ? this.parent.grid.element.offsetWidth : currentWidth;\n }\n else {\n currentWidth = this.parent.chart ? this.parent.chartModule.calculatedWidth : currentWidth;\n }\n if (currentWidth) {\n var actWidth = currentWidth < 400 ? 400 : currentWidth;\n setStyleAttribute(element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS), {\n left: formatUnit(this.parent.enableRtl ?\n -Math.abs((actWidth) -\n element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS).offsetWidth) :\n (actWidth) -\n element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS).offsetWidth)\n });\n }\n };\n /**\n * @hidden\n */\n GroupingBar.prototype.setGridRowWidth = function () {\n var colGroupElement = this.parent.element.querySelector('.e-frozenheader').querySelector('colgroup').children[0];\n if (this.rowPanel.querySelector('.' + cls.PIVOT_BUTTON_CLASS)) {\n if (!this.parent.isAdaptive) {\n var pivotButtons = [].slice.call(this.rowPanel.querySelectorAll('.' + cls.PIVOT_BUTTON_WRAPPER_CLASS));\n var lastButton = pivotButtons[pivotButtons.length - 1];\n var lastButtonWidth = (lastButton.querySelector('.' + cls.PIVOT_BUTTON_CLASS).offsetWidth +\n lastButton.querySelector('.e-indent-div').offsetWidth + 20);\n var buttonWidth = formatUnit(lastButtonWidth < this.resColWidth ? this.resColWidth : lastButtonWidth);\n var rowHeaderTable = this.parent.element.querySelector('.e-frozenheader').querySelector('table');\n var rowContentTable = this.parent.element.querySelector('.e-frozencontent').querySelector('table');\n var rowContent = this.parent.element.querySelector('.e-frozencontent').querySelector('colgroup').children[0];\n var colwidth = parseInt(buttonWidth, 10);\n var gridColumn = this.parent.grid.columns;\n if (gridColumn && gridColumn.length > 0) {\n /* tslint:disable:align */\n gridColumn[0].width = (gridColumn[0].width >= this.resColWidth ?\n (colwidth > this.resColWidth ? colwidth : this.resColWidth) :\n (colwidth > this.resColWidth ? colwidth : this.resColWidth));\n }\n var valueColWidth = this.parent.renderModule.calculateColWidth(this.parent.dataSource.values.length > 0 ?\n this.parent.engineModule.pivotValues[0].length : 2);\n for (var cCnt = 0; cCnt < gridColumn.length; cCnt++) {\n if (cCnt !== 0) {\n if (gridColumn[cCnt].columns) {\n this.setColWidth(gridColumn[cCnt].columns, valueColWidth);\n }\n else {\n gridColumn[cCnt].width = valueColWidth;\n }\n }\n }\n this.parent.posCount = 0;\n this.parent.setGridColumns(this.parent.grid.columns);\n this.parent.grid.headerModule.refreshUI();\n if (!this.parent.firstColWidth) {\n colGroupElement.style.width = buttonWidth;\n rowContent.style.width = buttonWidth;\n rowHeaderTable.style.width = buttonWidth;\n rowContentTable.style.width = buttonWidth;\n setStyleAttribute(rowHeaderTable, { 'width': buttonWidth });\n setStyleAttribute(rowContentTable, { 'width': buttonWidth });\n }\n }\n else {\n if (!this.parent.firstColWidth) {\n var gridColumn = this.parent.grid.columns;\n if (gridColumn && gridColumn.length > 0) {\n gridColumn[0].width = this.resColWidth;\n }\n this.parent.posCount = 0;\n this.parent.grid.headerModule.refreshUI();\n }\n }\n }\n else {\n if (this.parent.grid.columns && this.parent.grid.columns.length > 0) {\n this.parent.grid.columns[0].width = this.parent.grid.columns[0].width > this.resColWidth ?\n this.parent.grid.columns[0].width : this.resColWidth;\n }\n this.parent.grid.headerModule.refreshUI();\n }\n if (this.groupingTable) {\n this.refreshUI();\n }\n };\n GroupingBar.prototype.setColWidth = function (columns, width) {\n for (var cCnt = 0; cCnt < columns.length; cCnt++) {\n if (columns[cCnt].columns) {\n this.setColWidth(columns[cCnt].columns, width);\n }\n else {\n columns[cCnt].width = width;\n }\n }\n };\n GroupingBar.prototype.wireEvent = function (element) {\n EventHandler.add(element, 'mouseover', this.dropIndicatorUpdate, this);\n EventHandler.add(element, 'mouseleave', this.dropIndicatorUpdate, this);\n };\n GroupingBar.prototype.unWireEvent = function (element) {\n EventHandler.remove(element, 'mouseover', this.dropIndicatorUpdate);\n EventHandler.remove(element, 'mouseleave', this.dropIndicatorUpdate);\n };\n GroupingBar.prototype.dropIndicatorUpdate = function (e) {\n if ((this.parent.isDragging && e.target.classList.contains(cls.DROPPABLE_CLASS) && e.type === 'mouseover') ||\n e.type === 'mouseleave') {\n removeClass([].slice.call(this.parent.element.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS)), cls.INDICATOR_HOVER_CLASS);\n removeClass([].slice.call(this.parent.element.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS + '-last')), cls.INDICATOR_HOVER_CLASS);\n }\n };\n GroupingBar.prototype.tapHoldHandler = function (e) {\n var target = closest(e.originalEvent.target, '.' + cls.PIVOT_BUTTON_CLASS);\n if (!isNullOrUndefined(target) && this.parent.isAdaptive) {\n var pos = target.getBoundingClientRect();\n this.parent.contextMenuModule.fieldElement = target;\n this.parent.contextMenuModule.menuObj.open(pos.top, pos.left);\n return;\n }\n };\n /**\n * @hidden\n */\n GroupingBar.prototype.addEventListener = function () {\n this.handlers = {\n load: this.renderLayout,\n end: this.appendToElement,\n };\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.initSubComponent, this.handlers.load, this); //For initial rendering\n this.parent.on(events.uiUpdate, this.handlers.end, this);\n };\n /**\n * @hidden\n */\n GroupingBar.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.initSubComponent, this.handlers.end);\n this.parent.off(events.uiUpdate, this.handlers.load);\n };\n /**\n * To destroy the groupingbar\n * @return {void}\n * @hidden\n */\n GroupingBar.prototype.destroy = function () {\n this.removeEventListener();\n if (this.parent.pivotButtonModule) {\n this.parent.pivotButtonModule.destroy();\n if (this.touchObj && !this.touchObj.isDestroyed) {\n this.touchObj.destroy();\n }\n }\n else {\n return;\n }\n };\n return GroupingBar;\n}());\nexport { GroupingBar };\n","import { Dialog } from '@syncfusion/ej2-popups';\nimport { isNullOrUndefined as isNaN, createElement, extend, remove, addClass } from '@syncfusion/ej2-base';\nimport { Button } from '@syncfusion/ej2-buttons';\nimport { ColorPicker } from '@syncfusion/ej2-inputs';\nimport { DropDownList } from '@syncfusion/ej2-dropdowns';\nimport * as cls from '../../common/base/css-constant';\n/**\n * Module to render Conditional Formatting Dialog\n */\n/** @hidden */\nvar ConditionalFormatting = /** @class */ (function () {\n /** Constructor for conditionalformatting module */\n function ConditionalFormatting(parent) {\n this.parent = parent;\n this.parent.conditionalFormattingModule = this;\n this.parentID = this.parent.element.id;\n this.dialog = null;\n this.fieldsDropDown = [];\n this.conditionsDropDown = [];\n this.fontNameDropDown = [];\n this.fontSizeDropDown = [];\n this.fontColor = [];\n this.backgroundColor = [];\n this.newFormat = [];\n }\n /**\n * To get module name.\n * @returns string\n */\n ConditionalFormatting.prototype.getModuleName = function () {\n return 'conditionalformatting';\n };\n ConditionalFormatting.prototype.createDialog = function () {\n if (document.querySelector('#' + this.parentID + 'conditionalformatting') !== null) {\n remove(document.querySelector('#' + this.parentID + 'conditionalformatting'));\n }\n this.parent.element.appendChild(createElement('div', {\n id: this.parentID + 'conditionalformatting',\n }));\n var buttonModel = [\n {\n click: this.addButtonClick.bind(this),\n buttonModel: {\n cssClass: this.parent.isAdaptive ? (cls.FORMAT_ROUND_BUTTON + ' ' + cls.FORMAT_CONDITION_BUTTON) :\n cls.FORMAT_CONDITION_BUTTON,\n iconCss: cls.ICON + ' ' + cls.ADD_ICON_CLASS,\n content: this.parent.isAdaptive ? '' : this.parent.localeObj.getConstant('condition'),\n }\n },\n {\n click: this.applyButtonClick.bind(this),\n buttonModel: {\n cssClass: cls.FLAT_CLASS + ' ' + cls.FORMAT_APPLY_BUTTON,\n content: this.parent.localeObj.getConstant('apply')\n }\n },\n {\n click: this.cancelButtonClick.bind(this),\n buttonModel: {\n cssClass: cls.FLAT_CLASS + ' ' + cls.FORMAT_CANCEL_BUTTON,\n content: this.parent.localeObj.getConstant('cancel')\n }\n }\n ];\n if (this.parent.isAdaptive) {\n this.dialog = new Dialog({\n animationSettings: { effect: 'Zoom' }, isModal: true, width: '100%', height: '100%',\n showCloseIcon: false, closeOnEscape: false, enableRtl: this.parent.enableRtl,\n position: { X: 'center', Y: 'center' }, allowDragging: true, buttons: buttonModel,\n beforeOpen: this.beforeOpen.bind(this),\n cssClass: cls.FORMAT_DIALOG, header: this.parent.localeObj.getConstant('conditionalFormating'), target: document.body\n });\n }\n else {\n this.dialog = new Dialog({\n allowDragging: true, position: { X: 'center', Y: this.parent.element.offsetTop }, buttons: buttonModel,\n beforeOpen: this.beforeOpen.bind(this),\n cssClass: cls.FORMAT_DIALOG, isModal: false, closeOnEscape: true, enableRtl: this.parent.enableRtl,\n showCloseIcon: true, header: this.parent.localeObj.getConstant('conditionalFormating'), target: this.parent.element\n });\n }\n this.dialog.appendTo('#' + this.parentID + 'conditionalformatting');\n };\n ConditionalFormatting.prototype.beforeOpen = function (args) {\n this.dialog.element.querySelector('.' + cls.DIALOG_HEADER).\n setAttribute('title', this.parent.localeObj.getConstant('conditionalFormating'));\n };\n ConditionalFormatting.prototype.addButtonClick = function () {\n var format = {\n conditions: 'LessThan',\n value1: 0,\n style: {\n backgroundColor: 'white',\n color: 'black',\n fontFamily: 'Arial',\n fontSize: '12px'\n }\n };\n this.refreshConditionValues();\n this.newFormat.push(format);\n this.addFormat();\n };\n ConditionalFormatting.prototype.applyButtonClick = function () {\n if (this.refreshConditionValues()) {\n this.parent.setProperties({ dataSource: { conditionalFormatSettings: this.newFormat } }, true);\n this.parent.renderPivotGrid();\n this.destroy();\n }\n };\n ConditionalFormatting.prototype.cancelButtonClick = function () {\n this.destroy();\n this.newFormat = [];\n };\n ConditionalFormatting.prototype.refreshConditionValues = function () {\n for (var i = 0; i < this.newFormat.length; i++) {\n if (document.querySelector('#' + this.parentID + 'conditionvalue1' + i).value === '' ||\n document.querySelector('#' + this.parentID + 'conditionvalue2' + i).value === '') {\n document.querySelector('#' + this.parentID + 'conditionvalue1' + i).value === '' ?\n document.querySelector('#' + this.parentID + 'conditionvalue1' + i).focus() :\n document.querySelector('#' + this.parentID + 'conditionvalue2' + i).focus();\n return false;\n }\n this.newFormat[i].value1 =\n Number(document.querySelector('#' + this.parentID + 'conditionvalue1' + i).value);\n this.newFormat[i].value2 =\n Number(document.querySelector('#' + this.parentID + 'conditionvalue2' + i).value);\n }\n return true;\n };\n ConditionalFormatting.prototype.addFormat = function () {\n var format = createElement('div', { id: this.parentID + 'formatDiv', className: cls.FORMAT_NEW });\n for (var i = 0; i < this.newFormat.length; i++) {\n format.appendChild(this.createDialogElements(i));\n }\n if (this.newFormat.length === 0) {\n var outerDiv = this.createDialogElements();\n var element = createElement('p', {\n id: this.parentID + 'emptyFormat',\n innerHTML: this.parent.localeObj.getConstant('emptyFormat'),\n styles: 'margin: 10px'\n });\n outerDiv.appendChild(element);\n format.appendChild(outerDiv);\n }\n this.dialog.setProperties({ 'content': format }, false);\n for (var i = 0; i < this.newFormat.length; i++) {\n this.renderDropDowns(i);\n this.renderColorPicker(i);\n }\n };\n ConditionalFormatting.prototype.createDialogElements = function (i) {\n var outerDiv = createElement('div', {\n id: this.parentID + 'outerDiv' + i, className: cls.FORMAT_OUTER\n });\n if (i !== undefined) {\n var format = this.newFormat[i];\n var button = createElement('button', {\n id: this.parentID + 'removeButton' + i, className: cls.FORMAT_DELETE_BUTTON,\n attrs: { 'title': this.parent.localeObj.getConstant('delete') }\n });\n outerDiv.appendChild(button);\n var innerDiv = createElement('div', { id: this.parentID + 'innerDiv', className: cls.FORMAT_INNER });\n var table = createElement('table', { id: this.parentID + 'cftable', className: cls.FORMAT_TABLE });\n var tRow = createElement('tr');\n var td = createElement('td');\n var valuelabel = createElement('span', {\n id: this.parentID + 'valuelabel' + i, className: cls.FORMAT_VALUE_LABEL,\n innerHTML: this.parent.localeObj.getConstant('value')\n });\n td.appendChild(valuelabel);\n tRow.appendChild(td);\n table.appendChild(tRow);\n tRow = createElement('tr');\n td = createElement('td');\n var measureDropdown = createElement('div', { id: this.parentID + 'measure' + i });\n var measureInput = createElement('input', {\n id: this.parentID + 'measureinput' + i,\n attrs: { 'type': 'text', 'tabindex': '1' }\n });\n measureDropdown.appendChild(measureInput);\n td.appendChild(measureDropdown);\n tRow.appendChild(td);\n td = createElement('td');\n var conditionDropdown = createElement('div', { id: this.parentID + 'condition' });\n var conditionInput = createElement('input', {\n id: this.parentID + 'conditioninput' + i,\n attrs: { 'type': 'text', 'tabindex': '1' }\n });\n conditionDropdown.appendChild(conditionInput);\n td.appendChild(conditionDropdown);\n tRow.appendChild(td);\n td = createElement('td');\n var style = !(format.conditions === 'Between' || format.conditions === 'NotBetween') ? 'display:none; width:10px' : '';\n var value1 = createElement('input', {\n id: this.parentID + 'conditionvalue1' + i,\n attrs: {\n 'type': 'text', 'tabindex': '1', 'value': !isNaN(format.value1) ? format.value1.toString() : '0',\n 'placeholder': this.parent.localeObj.getConstant('emptyInput')\n },\n styles: this.parent.isAdaptive ? style === '' ? 'width: 35%' : 'width: 100%' : style === '' ? 'width: 45px' :\n 'width: 120px',\n className: cls.INPUT + ' ' + cls.FORMAT_VALUE1\n });\n td.appendChild(value1);\n var valuespan = createElement('span', {\n id: this.parentID + 'valuespan' + i, className: cls.FORMAT_VALUE_SPAN,\n innerHTML: '&', styles: style\n });\n td.appendChild(valuespan);\n var value2 = createElement('input', {\n id: this.parentID + 'conditionvalue2' + i,\n attrs: {\n 'type': 'text', 'tabindex': '1', 'value': !isNaN(format.value2) ? format.value2.toString() : '0',\n 'placeholder': this.parent.localeObj.getConstant('emptyInput')\n },\n styles: (this.parent.isAdaptive && style === '') ? 'width: 35%' : style === '' ? 'width: 45px' : style,\n className: cls.INPUT + ' ' + cls.FORMAT_VALUE2\n });\n td.appendChild(value2);\n tRow.appendChild(td);\n table.appendChild(tRow);\n if (this.parent.isAdaptive) {\n innerDiv.appendChild(table);\n table = createElement('table', { id: this.parentID + 'cftable', className: cls.FORMAT_TABLE });\n }\n tRow = createElement('tr');\n td = createElement('td');\n var formatlabel = createElement('span', {\n id: this.parentID + 'formatlabel' + i, className: cls.FORMAT_LABEL,\n innerHTML: this.parent.localeObj.getConstant('formatLabel')\n });\n td.appendChild(formatlabel);\n tRow.appendChild(td);\n table.appendChild(tRow);\n tRow = createElement('tr');\n td = createElement('td');\n var fontNameDropdown = createElement('div', { id: this.parentID + 'fontname' });\n var fontNameInput = createElement('input', {\n id: this.parentID + 'fontnameinput' + i, attrs: { 'type': 'text', 'tabindex': '1' }\n });\n fontNameDropdown.appendChild(fontNameInput);\n td.appendChild(fontNameDropdown);\n tRow.appendChild(td);\n td = createElement('td');\n var fontSizeDropdown = createElement('div', { id: this.parentID + 'fontsize' });\n var fontSizeInput = createElement('input', {\n id: this.parentID + 'fontsizeinput' + i, attrs: { 'type': 'text', 'tabindex': '1' }\n });\n fontSizeDropdown.appendChild(fontSizeInput);\n td.appendChild(fontSizeDropdown);\n tRow.appendChild(td);\n if (this.parent.isAdaptive) {\n table.appendChild(tRow);\n tRow = createElement('tr');\n table.appendChild(tRow);\n tRow = createElement('tr');\n }\n td = createElement('td');\n var colorPicker1 = createElement('input', {\n id: this.parentID + 'fontcolor' + i, attrs: { 'type': 'color', 'tabindex': '1' }, className: cls.FORMAT_FONT_COLOR\n });\n td.appendChild(colorPicker1);\n var colorPicker2 = createElement('input', {\n id: this.parentID + 'backgroundcolor' + i, attrs: { 'type': 'color', 'tabindex': '1' }, className: cls.FORMAT_BACK_COLOR\n });\n td.appendChild(colorPicker2);\n tRow.appendChild(td);\n td = createElement('td');\n var valuePreview = createElement('div', {\n id: this.parentID + 'valuepreview' + i, className: cls.INPUT + ' ' + cls.FORMAT_VALUE_PREVIEW,\n innerHTML: '123.45',\n });\n td.appendChild(valuePreview);\n tRow.appendChild(td);\n table.appendChild(tRow);\n innerDiv.appendChild(table);\n outerDiv.appendChild(innerDiv);\n }\n return outerDiv;\n };\n ConditionalFormatting.prototype.renderDropDowns = function (i) {\n var format = this.newFormat[i];\n var fields = [];\n fields.push({\n index: 0, name: this.parent.localeObj.getConstant('AllValues'),\n field: this.parent.localeObj.getConstant('AllValues')\n });\n for (var i_1 = 0; i_1 < this.parent.dataSource.values.length; i_1++) {\n fields.push({\n index: i_1 + 1,\n name: this.parent.dataSource.values[i_1].caption || this.parent.dataSource.values[i_1].name,\n field: this.parent.dataSource.values[i_1].name\n });\n }\n var value = isNaN(format.measure) ? this.parent.localeObj.getConstant('AllValues') : format.measure;\n this.fieldsDropDown[i] = new DropDownList({\n dataSource: fields, fields: { text: 'name' },\n value: value, width: this.parent.isAdaptive ? '100%' : '120px',\n popupHeight: '200px', popupWidth: 'auto',\n change: this.measureChange.bind(this, i)\n });\n this.fieldsDropDown[i].appendTo('#' + this.parentID + 'measureinput' + i);\n var conditions = [\n { value: 'LessThan', name: this.parent.localeObj.getConstant('LessThan') },\n { value: 'LessThanOrEqualTo', name: this.parent.localeObj.getConstant('LessThanOrEqualTo') },\n { value: 'GreaterThan', name: this.parent.localeObj.getConstant('GreaterThan') },\n { value: 'GreaterThanOrEqualTo', name: this.parent.localeObj.getConstant('GreaterThanOrEqualTo') },\n { value: 'Equals', name: this.parent.localeObj.getConstant('Equals') },\n { value: 'NotEquals', name: this.parent.localeObj.getConstant('NotEquals') },\n { value: 'Between', name: this.parent.localeObj.getConstant('Between') },\n { value: 'NotBetween', name: this.parent.localeObj.getConstant('NotBetween') }\n ];\n value = isNaN(format.conditions) ? 'LessThan' : format.conditions;\n this.conditionsDropDown[i] = new DropDownList({\n dataSource: conditions, fields: { value: 'value', text: 'name' },\n value: value, width: this.parent.isAdaptive ? '100%' : '120px',\n popupHeight: '200px', popupWidth: 'auto',\n change: this.conditionChange.bind(this, i)\n });\n this.conditionsDropDown[i].appendTo('#' + this.parentID + 'conditioninput' + i);\n var fontNames = [\n { index: 0, name: 'Arial' }, { index: 1, name: 'San Serif' }, { index: 2, name: 'Impact' },\n { index: 3, name: 'Trebuchet MS' }, { index: 4, name: 'Serif' }, { index: 5, name: 'Verdana' },\n { index: 6, name: 'Courier New' }, { index: 7, name: 'Times New Roman' }, { index: 8, name: 'Tahoma' },\n { index: 9, name: 'Gerogia' }\n ];\n value = isNaN(format.style.fontFamily) ? 'Arial' : format.style.fontFamily;\n this.fontNameDropDown[i] = new DropDownList({\n dataSource: fontNames, fields: { text: 'name' },\n value: value, width: this.parent.isAdaptive ? '100%' : '120px',\n popupWidth: '150px', popupHeight: '200px',\n change: this.fontNameChange.bind(this, i)\n });\n this.fontNameDropDown[i].appendTo('#' + this.parentID + 'fontnameinput' + i);\n var fontSize = [\n { index: 0, name: '9px' }, { index: 1, name: '10px' }, { index: 2, name: '11px' }, { index: 3, name: '12px' },\n { index: 4, name: '13px' }, { index: 5, name: '14px' }, { index: 6, name: '15px' }, { index: 6, name: '16px' }\n ];\n value = isNaN(format.style.fontSize) ? '12px' : format.style.fontSize;\n this.fontSizeDropDown[i] = new DropDownList({\n dataSource: fontSize, fields: { text: 'name' }, popupHeight: '200px',\n value: value, width: this.parent.isAdaptive ? '100%' : '120px',\n change: this.fontSizeChange.bind(this, i)\n });\n this.fontSizeDropDown[i].appendTo('#' + this.parentID + 'fontsizeinput' + i);\n };\n ConditionalFormatting.prototype.conditionChange = function (i, args) {\n this.newFormat[i].conditions = args.value;\n if (args.value === 'Between' || args.value === 'NotBetween') {\n document.querySelector('#' + this.parentID + 'valuespan' + i).style.display = 'inline-block';\n document.querySelector('#' + this.parentID + 'valuespan' + i).style.width =\n this.parent.isAdaptive ? '10%' : '10px';\n document.querySelector('#' + this.parentID + 'conditionvalue2' + i).style.display = 'inline-block';\n document.querySelector('#' + this.parentID + 'conditionvalue2' + i).style.width =\n this.parent.isAdaptive ? '35%' : '45px';\n document.querySelector('#' + this.parentID + 'conditionvalue1' + i).style.width =\n this.parent.isAdaptive ? '35%' : '45px';\n }\n else {\n document.querySelector('#' + this.parentID + 'valuespan' + i).style.display = 'none';\n document.querySelector('#' + this.parentID + 'conditionvalue2' + i).style.display = 'none';\n document.querySelector('#' + this.parentID + 'conditionvalue1' + i).style.width =\n this.parent.isAdaptive ? '100%' : '120px';\n }\n };\n ConditionalFormatting.prototype.fontNameChange = function (i, args) {\n this.newFormat[i].style.fontFamily = args.value.toString();\n document.querySelector('#' + this.parentID + 'valuepreview' + i).style.fontFamily = args.value;\n };\n ConditionalFormatting.prototype.fontSizeChange = function (i, args) {\n this.newFormat[i].style.fontSize = args.value.toString();\n document.querySelector('#' + this.parentID + 'valuepreview' + i).style.fontSize = args.value;\n };\n ConditionalFormatting.prototype.measureChange = function (i, args) {\n this.newFormat[i].measure = args.value.toString() === this.parent.localeObj.getConstant('AllValues') ?\n undefined : args.value.toString();\n };\n ConditionalFormatting.prototype.renderColorPicker = function (i) {\n var format = this.newFormat[i];\n var value = isNaN(format.style.color) ? 'black' : format.style.color;\n var color = this.isHex(value.substr(1)) ? value : this.colourNameToHex(value);\n document.querySelector('#' + this.parentID + 'valuepreview' + i).style.color = color;\n this.fontColor[i] = new ColorPicker({\n cssClass: cls.FORMAT_COLOR_PICKER, value: color, mode: 'Palette',\n change: this.fontColorChange.bind(this, i)\n });\n this.fontColor[i].appendTo('#' + this.parentID + 'fontcolor' + i);\n addClass([this.fontColor[i].element.nextElementSibling.querySelector('.' + cls.SELECTED_COLOR)], cls.ICON);\n value = isNaN(format.style.backgroundColor) ? 'white' : format.style.backgroundColor;\n color = this.isHex(value.substr(1)) ? value : this.colourNameToHex(value);\n document.querySelector('#' + this.parentID + 'valuepreview' + i).style.backgroundColor = color;\n document.querySelector('#' + this.parentID + 'valuepreview' + i).style.fontFamily = format.style.fontFamily;\n document.querySelector('#' + this.parentID + 'valuepreview' + i).style.fontSize = format.style.fontSize;\n this.backgroundColor[i] = new ColorPicker({\n cssClass: cls.FORMAT_COLOR_PICKER, value: color, mode: 'Palette',\n change: this.backColorChange.bind(this, i)\n });\n this.backgroundColor[i].appendTo('#' + this.parentID + 'backgroundcolor' + i);\n addClass([this.backgroundColor[i].element.nextElementSibling.querySelector('.e-selected-color')], cls.ICON);\n var toggleBtn = new Button({\n iconCss: cls.ICON + ' ' + cls.FORMAT_DELETE_ICON,\n cssClass: cls.FLAT\n });\n toggleBtn.appendTo('#' + this.parentID + 'removeButton' + i);\n toggleBtn.element.onclick = this.toggleButtonClick.bind(this, i);\n };\n ConditionalFormatting.prototype.backColorChange = function (i, args) {\n this.newFormat[i].style.backgroundColor = args.currentValue.hex;\n document.querySelector('#' + this.parentID + 'valuepreview' + i).style.backgroundColor =\n args.currentValue.hex;\n };\n ConditionalFormatting.prototype.fontColorChange = function (i, args) {\n this.newFormat[i].style.color = args.currentValue.hex;\n document.querySelector('#' + this.parentID + 'valuepreview' + i).style.color =\n args.currentValue.hex;\n };\n ConditionalFormatting.prototype.toggleButtonClick = function (i) {\n this.newFormat.splice(i, 1);\n this.addFormat();\n };\n /**\n * To check is Hex or not.\n * @returns boolean\n * @hidden\n */\n ConditionalFormatting.prototype.isHex = function (h) {\n var a = parseInt(h, 16);\n while (h.charAt(0) === '0') {\n h = h.substr(1);\n }\n return (a.toString(16) === h.toLowerCase() || (a === 0 && h === ''));\n };\n /**\n * To convert hex to RGB.\n * @returns { r: number, g: number, b: number } | null\n * @hidden\n */\n ConditionalFormatting.prototype.hexToRgb = function (hex) {\n var result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n return result ? {\n r: parseInt(result[1], 16),\n g: parseInt(result[2], 16),\n b: parseInt(result[3], 16)\n } : null;\n };\n /**\n * To convert color to hex.\n * @returns string\n * @hidden\n */\n ConditionalFormatting.prototype.colourNameToHex = function (colour) {\n var colours = {\n 'aliceblue': '#f0f8ff', 'antiquewhite': '#faebd7', 'aqua': '#00ffff', 'aquamarine': '#7fffd4',\n 'azure': '#f0ffff', 'beige': '#f5f5dc', 'bisque': '#ffe4c4', 'black': '#000000',\n 'blanchedalmond': '#ffebcd', 'blue': '#0000ff',\n 'blueviolet': '#8a2be2', 'brown': '#a52a2a', 'burlywood': '#deb887', 'cadetblue': '#5f9ea0',\n 'chartreuse': '#7fff00', 'chocolate': '#d2691e',\n 'coral': '#ff7f50', 'cornflowerblue': '#6495ed', 'cornsilk': '#fff8dc', 'crimson': '#dc143c', 'cyan': '#00ffff',\n 'darkblue': '#00008b', 'darkcyan': '#008b8b', 'darkgoldenrod': '#b8860b', 'darkgray': '#a9a9a9', 'darkgreen': '#006400',\n 'darkkhaki': '#bdb76b', 'darkmagenta': '#8b008b', 'darkolivegreen': '#556b2f',\n 'darkorange': '#ff8c00', 'darkorchid': '#9932cc', 'darkred': '#8b0000', 'darksalmon': '#e9967a', 'darkseagreen': '#8fbc8f',\n 'darkslateblue': '#483d8b', 'darkslategray': '#2f4f4f', 'darkturquoise': '#00ced1',\n 'darkviolet': '#9400d3', 'deeppink': '#ff1493', 'deepskyblue': '#00bfff', 'dimgray': '#696969', 'dodgerblue': '#1e90ff',\n 'firebrick': '#b22222', 'floralwhite': '#fffaf0', 'forestgreen': '#228b22', 'fuchsia': '#ff00ff',\n 'gainsboro': '#dcdcdc', 'ghostwhite': '#f8f8ff', 'gold': '#ffd700', 'goldenrod': '#daa520',\n 'gray': '#808080', 'green': '#008000',\n 'greenyellow': '#adff2f', 'honeydew': '#f0fff0', 'hotpink': '#ff69b4', 'indianred ': '#cd5c5c',\n 'indigo': '#4b0082', 'ivory': '#fffff0',\n 'khaki': '#f0e68c', 'lavender': '#e6e6fa', 'lavenderblush': '#fff0f5', 'lawngreen': '#7cfc00', 'lemonchiffon': '#fffacd',\n 'lightblue': '#add8e6', 'lightcoral': '#f08080', 'lightcyan': '#e0ffff', 'lightgoldenrodyellow': '#fafad2',\n 'lightgrey': '#d3d3d3', 'lightgreen': '#90ee90', 'lightpink': '#ffb6c1', 'lightsalmon': '#ffa07a', 'lightseagreen': '#20b2aa',\n 'lightskyblue': '#87cefa', 'lightslategray': '#778899', 'lightsteelblue': '#b0c4de',\n 'lightyellow': '#ffffe0', 'lime': '#00ff00', 'limegreen': '#32cd32', 'linen': '#faf0e6',\n 'magenta': '#ff00ff', 'maroon': '#800000', 'mediumaquamarine': '#66cdaa', 'mediumblue': '#0000cd', 'mediumorchid': '#ba55d3',\n 'mediumpurple': '#9370d8', 'mediumseagreen': '#3cb371', 'mediumslateblue': '#7b68ee',\n 'mediumspringgreen': '#00fa9a', 'mediumturquoise': '#48d1cc', 'mediumvioletred': '#c71585', 'midnightblue': '#191970',\n 'mintcream': '#f5fffa', 'mistyrose': '#ffe4e1', 'moccasin': '#ffe4b5', 'navajowhite': '#ffdead', 'navy': '#000080',\n 'oldlace': '#fdf5e6', 'olive': '#808000', 'olivedrab': '#6b8e23', 'orange': '#ffa500', 'orangered': '#ff4500',\n 'orchid': '#da70d6',\n 'palegoldenrod': '#eee8aa', 'palegreen': '#98fb98', 'paleturquoise': '#afeeee', 'palevioletred': '#d87093',\n 'papayawhip': '#ffefd5',\n 'peachpuff': '#ffdab9', 'peru': '#cd853f', 'pink': '#ffc0cb', 'plum': '#dda0dd', 'powderblue': '#b0e0e6', 'purple': '#800080',\n 'rebeccapurple': '#663399', 'red': '#ff0000', 'rosybrown': '#bc8f8f', 'royalblue': '#4169e1',\n 'saddlebrown': '#8b4513', 'salmon': '#fa8072', 'sandybrown': '#f4a460', 'seagreen': '#2e8b57',\n 'seashell': '#fff5ee', 'sienna': '#a0522d',\n 'silver': '#c0c0c0', 'skyblue': '#87ceeb', 'slateblue': '#6a5acd', 'slategray': '#708090', 'snow': '#fffafa',\n 'springgreen': '#00ff7f',\n 'steelblue': '#4682b4', 'tan': '#d2b48c', 'teal': '#008080', 'thistle': '#d8bfd8', 'tomato': '#ff6347', 'turquoise': '#40e0d0',\n 'violet': '#ee82ee', 'wheat': '#f5deb3', 'white': '#ffffff', 'whitesmoke': '#f5f5f5', 'yellow': '#ffff00',\n 'yellowgreen': '#9acd32'\n };\n if (typeof colours[colour.toLowerCase()] !== 'undefined') {\n return colours[colour.toLowerCase()];\n }\n return '#d5d5d5';\n };\n /**\n * To create Conditional Formatting dialog.\n * @returns void\n */\n ConditionalFormatting.prototype.showConditionalFormattingDialog = function () {\n this.newFormat = [];\n for (var i = 0; i < this.parent.dataSource.conditionalFormatSettings.length; i++) {\n this.newFormat.push(extend({}, this.parent.dataSource.conditionalFormatSettings[i].properties, null, true));\n }\n this.createDialog();\n this.dialog.refresh();\n this.addFormat();\n };\n /**\n * To destroy the Conditional Formatting dialog\n * @returns void\n * @hidden\n */\n ConditionalFormatting.prototype.destroy = function () {\n if (this.dialog && !this.dialog.isDestroyed) {\n this.dialog.hide();\n for (var i = 0; i < this.newFormat.length; i++) {\n if (this.fontColor[i] && !this.fontColor[i].isDestroyed) {\n this.fontColor[i].destroy();\n }\n if (this.backgroundColor[i] && !this.backgroundColor[i].isDestroyed) {\n this.backgroundColor[i].destroy();\n }\n }\n this.dialog.destroy();\n }\n else {\n return;\n }\n };\n return ConditionalFormatting;\n}());\nexport { ConditionalFormatting };\n","import { Toolbar as tool, Menu } from '@syncfusion/ej2-navigations';\nimport { remove, createElement } from '@syncfusion/ej2-base';\nimport * as events from '../../common/base/constant';\nimport { Dialog } from '@syncfusion/ej2-popups';\nimport { DropDownList } from '@syncfusion/ej2-dropdowns';\nimport * as cls from '../../common/base/css-constant';\nimport { Common } from '../actions/common';\nimport { PivotView } from '../../pivotview/base/pivotview';\nPivotView.Inject(Common);\n/**\n * Module for Toolbar\n */\n/** @hidden */\nvar Toolbar = /** @class */ (function () {\n function Toolbar(parent) {\n this.currentReport = '';\n this.parent = parent;\n this.parent.toolbarModule = this;\n this.addEventListener();\n }\n /**\n * It returns the Module name.\n * @returns string\n * @hidden\n */\n Toolbar.prototype.getModuleName = function () {\n return 'toolbar';\n };\n Toolbar.prototype.createToolbar = function () {\n this.parent.isModified = false;\n this.renderDialog();\n if (document.querySelector('#' + this.parent.element.id + 'pivot-toolbar') !== null) {\n remove(document.querySelector('#' + this.parent.element.id + 'pivot-toolbar'));\n }\n this.parent.element.insertBefore(createElement('div', {\n id: this.parent.element.id + 'pivot-toolbar',\n className: cls.GRID_TOOLBAR\n }), this.parent.element.querySelector('#' + this.parent.element.id + '_PivotFieldList'));\n this.toolbar = new tool({\n created: this.create.bind(this),\n enableRtl: this.parent.enableRtl,\n width: this.parent.width ? (Number(this.parent.width) - 2) : (Number(this.parent.element.offsetWidth) - 2),\n items: this.getItems()\n });\n this.toolbar.appendTo('#' + this.parent.element.id + 'pivot-toolbar');\n };\n Toolbar.prototype.fetchReports = function () {\n var reports = { reportName: [] };\n this.parent.trigger(events.fetchReport, reports);\n return reports;\n };\n /* tslint:disable */\n Toolbar.prototype.getItems = function () {\n var toolbar = this.parent.toolbar.filter(function (v, i, a) { return a.indexOf(v) === i; });\n var items = [];\n for (var _i = 0, toolbar_1 = toolbar; _i < toolbar_1.length; _i++) {\n var item = toolbar_1[_i];\n switch (item) {\n case 'New':\n items.push({\n prefixIcon: cls.GRID_NEW + ' ' + cls.ICON, tooltipText: this.parent.localeObj.getConstant('new'),\n click: this.actionClick.bind(this), id: this.parent.element.id + 'new'\n });\n break;\n case 'Save':\n items.push({\n prefixIcon: cls.GRID_SAVE + ' ' + cls.ICON, tooltipText: this.parent.localeObj.getConstant('save'),\n click: this.actionClick.bind(this), id: this.parent.element.id + 'save'\n });\n break;\n case 'SaveAs':\n items.push({\n prefixIcon: cls.GRID_SAVEAS + ' ' + cls.ICON, tooltipText: this.parent.localeObj.getConstant('saveAs'),\n click: this.actionClick.bind(this), id: this.parent.element.id + 'saveas'\n });\n break;\n case 'Rename':\n items.push({\n prefixIcon: cls.GRID_RENAME + ' ' + cls.ICON, tooltipText: this.parent.localeObj.getConstant('rename'),\n click: this.actionClick.bind(this), id: this.parent.element.id + 'rename'\n });\n break;\n case 'Remove':\n items.push({\n prefixIcon: cls.GRID_REMOVE + ' ' + cls.ICON, tooltipText: this.parent.localeObj.getConstant('deleteReport'),\n click: this.actionClick.bind(this), id: this.parent.element.id + 'remove'\n });\n break;\n case 'Load':\n items.push({\n template: '',\n click: this.actionClick.bind(this),\n id: this.parent.element.id + 'load'\n });\n break;\n case 'Grid':\n var toDisable = this.parent.displayOption.view === 'Chart';\n items.push({\n prefixIcon: cls.TOOLBAR_GRID + ' ' + cls.ICON, tooltipText: this.parent.localeObj.getConstant('grid'),\n id: this.parent.element.id + 'grid', cssClass: toDisable ? cls.MENU_DISABLE : '',\n click: this.gridClick.bind(this),\n });\n break;\n case 'Chart':\n items.push({\n template: '\");\n var moreEventWrapper = createElement('div', {\n className: cls.MORE_POPUP_WRAPPER_CLASS + ' e-popup-close',\n innerHTML: moreEventPopup\n });\n this.parent.element.appendChild(moreEventWrapper);\n this.morePopup = new Popup(moreEventWrapper, {\n targetType: 'relative',\n enableRtl: this.parent.enableRtl,\n hideAnimation: { name: 'ZoomOut', duration: 300 },\n showAnimation: { name: 'ZoomIn', duration: 300 },\n open: this.morePopupOpen.bind(this),\n close: this.morePopupClose.bind(this),\n collision: { X: 'flip', Y: 'flip' },\n viewPortElement: this.parent.element.querySelector('.' + cls.TABLE_CONTAINER_CLASS),\n zIndex: 2\n });\n var closeButton = this.morePopup.element.querySelector('.' + cls.MORE_EVENT_CLOSE_CLASS);\n this.renderButton('e-round', cls.ICON + ' ' + cls.CLOSE_ICON_CLASS, false, closeButton, this.closeClick);\n EventHandler.add(this.morePopup.element.querySelector('.' + cls.MORE_EVENT_HEADER_DATE_CLASS), 'click', this.navigationClick, this);\n };\n QuickPopups.prototype.renderQuickDialog = function () {\n this.quickDialog = new Dialog({\n animationSettings: { effect: 'Zoom' },\n buttons: [\n { buttonModel: { cssClass: 'e-quick-alertok e-flat', isPrimary: true }, click: this.dialogButtonClick.bind(this) },\n { buttonModel: { cssClass: 'e-quick-alertcancel e-flat', isPrimary: false }, click: this.dialogButtonClick.bind(this) },\n {\n buttonModel: { cssClass: 'e-quick-dialog-cancel e-disable e-flat', isPrimary: false },\n click: this.dialogButtonClick.bind(this)\n }\n ],\n cssClass: cls.QUICK_DIALOG_CLASS,\n closeOnEscape: true,\n enableRtl: this.parent.enableRtl,\n beforeClose: this.beforeQuickDialogClose.bind(this),\n isModal: true,\n position: { X: 'center', Y: 'center' },\n showCloseIcon: true,\n target: document.body,\n visible: false,\n width: 'auto'\n });\n var dialogElement = createElement('div', { id: this.parent.element.id + 'QuickDialog' });\n this.parent.element.appendChild(dialogElement);\n this.quickDialog.appendTo(dialogElement);\n var okButton = this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_ALERT_OK);\n if (okButton) {\n okButton.setAttribute('aria-label', this.l10n.getConstant('occurrence'));\n }\n var cancelButton = this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_ALERT_CANCEL);\n if (cancelButton) {\n cancelButton.setAttribute('aria-label', this.l10n.getConstant('series'));\n }\n };\n QuickPopups.prototype.renderButton = function (className, iconName, isDisabled, element, clickEvent) {\n var buttonObj = new Button({\n cssClass: className,\n disabled: isDisabled,\n enableRtl: this.parent.enableRtl,\n iconCss: iconName\n });\n buttonObj.appendTo(element);\n EventHandler.add(element, 'click', clickEvent, this);\n };\n QuickPopups.prototype.quickDialogClass = function (action) {\n var classList = [\n cls.QUICK_DIALOG_OCCURRENCE_CLASS, cls.QUICK_DIALOG_SERIES_CLASS, cls.QUICK_DIALOG_DELETE_CLASS,\n cls.QUICK_DIALOG_CANCEL_CLASS, cls.QUICK_DIALOG_ALERT_BTN_CLASS, cls.DISABLE_CLASS\n ];\n var okButton = this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_ALERT_OK);\n var cancelButton = this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_ALERT_CANCEL);\n removeClass([okButton, cancelButton], classList);\n addClass([this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_CANCEL_CLASS)], cls.DISABLE_CLASS);\n switch (action) {\n case 'Recurrence':\n addClass([okButton], cls.QUICK_DIALOG_OCCURRENCE_CLASS);\n addClass([cancelButton], cls.QUICK_DIALOG_SERIES_CLASS);\n break;\n case 'Delete':\n addClass([okButton], cls.QUICK_DIALOG_DELETE_CLASS);\n addClass([cancelButton], cls.QUICK_DIALOG_CANCEL_CLASS);\n break;\n case 'Alert':\n addClass([okButton], [cls.QUICK_DIALOG_ALERT_OK, cls.QUICK_DIALOG_ALERT_BTN_CLASS]);\n addClass([cancelButton], [cls.QUICK_DIALOG_ALERT_CANCEL, cls.DISABLE_CLASS]);\n break;\n }\n };\n QuickPopups.prototype.applyFormValidation = function () {\n var form = this.quickPopup.element.querySelector('.' + cls.FORM_CLASS);\n var rules = {};\n rules[this.parent.eventSettings.fields.subject.name] = this.parent.eventSettings.fields.subject.validation;\n this.fieldValidator.renderFormValidator(form, rules, this.quickPopup.element);\n };\n QuickPopups.prototype.openRecurrenceAlert = function () {\n var editDeleteOnly = this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_ALERT_OK);\n if (editDeleteOnly) {\n editDeleteOnly.innerHTML = this.l10n.getConstant(this.parent.currentAction === 'Delete' ? 'deleteEvent' : 'editEvent');\n }\n var editDeleteSeries = this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_ALERT_CANCEL);\n if (editDeleteSeries) {\n editDeleteSeries.innerHTML = this.l10n.getConstant(this.parent.currentAction === 'Delete' ? 'deleteSeries' : 'editSeries');\n }\n this.quickDialog.content =\n this.l10n.getConstant(this.parent.currentAction === 'Delete' ? 'deleteRecurrenceContent' : 'editContent');\n this.quickDialog.header = this.l10n.getConstant(this.parent.currentAction === 'Delete' ? 'deleteEvent' : 'editEvent');\n this.quickDialogClass('Recurrence');\n this.showQuickDialog('RecurrenceAlert');\n };\n QuickPopups.prototype.openRecurrenceValidationAlert = function (type) {\n this.quickDialogClass('Alert');\n var okButton = this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_ALERT_OK);\n okButton.innerHTML = this.l10n.getConstant('ok');\n var cancelButton = this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_ALERT_CANCEL);\n cancelButton.innerHTML = this.l10n.getConstant('cancel');\n this.quickDialog.header = this.l10n.getConstant('alert');\n switch (type) {\n case 'wrongPattern':\n addClass([cancelButton], cls.DISABLE_CLASS);\n this.quickDialog.content = this.l10n.getConstant('wrongPattern');\n break;\n case 'dateValidation':\n removeClass([cancelButton], cls.DISABLE_CLASS);\n addClass([cancelButton], cls.QUICK_DIALOG_CANCEL_CLASS);\n this.quickDialog.content = this.l10n.getConstant('recurrenceDateValidation');\n break;\n case 'createError':\n addClass([cancelButton], cls.DISABLE_CLASS);\n this.quickDialog.content = this.l10n.getConstant('createError');\n break;\n case 'sameDayAlert':\n addClass([cancelButton], cls.DISABLE_CLASS);\n this.quickDialog.content = this.l10n.getConstant('sameDayAlert');\n break;\n case 'seriesChangeAlert':\n var dialogCancel = this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_CANCEL_CLASS);\n removeClass([cancelButton, dialogCancel], cls.DISABLE_CLASS);\n this.quickDialog.content = this.l10n.getConstant('seriesChangeAlert');\n okButton.innerHTML = this.l10n.getConstant('yes');\n cancelButton.innerHTML = this.l10n.getConstant('no');\n dialogCancel.innerHTML = this.l10n.getConstant('cancel');\n break;\n }\n this.showQuickDialog('RecurrenceValidationAlert');\n };\n QuickPopups.prototype.openDeleteAlert = function () {\n if (this.parent.activeViewOptions.readonly) {\n return;\n }\n var okButton = this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_ALERT_OK);\n if (okButton) {\n okButton.innerHTML = this.l10n.getConstant('delete');\n }\n var cancelButton = this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_ALERT_CANCEL);\n if (cancelButton) {\n cancelButton.innerHTML = this.l10n.getConstant('cancel');\n }\n this.quickDialog.content = (this.parent.activeEventData.event.length > 1) ?\n this.l10n.getConstant('deleteMultipleContent') : this.l10n.getConstant('deleteContent');\n this.quickDialog.header = (this.parent.activeEventData.event.length > 1) ?\n this.l10n.getConstant('deleteMultipleEvent') : this.l10n.getConstant('deleteEvent');\n this.quickDialogClass('Delete');\n this.showQuickDialog('DeleteAlert');\n };\n QuickPopups.prototype.openValidationError = function (type) {\n this.quickDialog.header = this.l10n.getConstant('alert');\n this.quickDialog.content = this.l10n.getConstant(type);\n var okButton = this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_ALERT_OK);\n if (okButton) {\n okButton.innerHTML = this.l10n.getConstant('ok');\n }\n var cancelButton = this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_ALERT_CANCEL);\n if (cancelButton) {\n cancelButton.innerHTML = this.l10n.getConstant('cancel');\n }\n this.quickDialogClass('Alert');\n this.showQuickDialog('ValidationAlert');\n };\n QuickPopups.prototype.showQuickDialog = function (popupType) {\n this.quickDialog.dataBind();\n var eventProp = {\n type: popupType, cancel: false, data: this.parent.activeEventData, element: this.quickDialog.element\n };\n this.parent.trigger(event.popupOpen, eventProp);\n if (eventProp.cancel) {\n return;\n }\n this.quickDialog.show();\n };\n QuickPopups.prototype.createMoreEventList = function (eventCollection, groupOrder, groupIndex) {\n var fields = this.parent.eventFields;\n var moreEventContentEle = createElement('div', { className: cls.MORE_EVENT_CONTENT_CLASS });\n var moreEventWrapperEle = createElement('div', { className: cls.MORE_EVENT_WRAPPER_CLASS });\n if (eventCollection.length === 0) {\n moreEventWrapperEle = createElement('div', {\n className: cls.MORE_EVENT_CONTENT_CLASS,\n innerHTML: this.l10n.getConstant('emptyContainer')\n });\n }\n else {\n for (var _i = 0, eventCollection_1 = eventCollection; _i < eventCollection_1.length; _i++) {\n var eventData = eventCollection_1[_i];\n var eventText = (eventData[fields.subject] || this.parent.eventSettings.fields.subject.default);\n var appointmentEle = createElement('div', {\n className: cls.APPOINTMENT_CLASS,\n attrs: {\n 'data-id': '' + eventData[fields.id],\n 'data-guid': eventData.Guid, 'role': 'button', 'tabindex': '0',\n 'aria-readonly': this.parent.eventBase.getReadonlyAttribute(eventData),\n 'aria-selected': 'false', 'aria-grabbed': 'true', 'aria-label': eventText\n }\n });\n appointmentEle.appendChild(createElement('div', { className: cls.SUBJECT_CLASS, innerHTML: eventText }));\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n appointmentEle.setAttribute('data-group-index', groupIndex);\n }\n if (!isNullOrUndefined(eventData[fields.recurrenceRule])) {\n var iconClass = (eventData[fields.id] === eventData[fields.recurrenceID]) ?\n cls.EVENT_RECURRENCE_ICON_CLASS : cls.EVENT_RECURRENCE_EDIT_ICON_CLASS;\n appointmentEle.appendChild(createElement('div', { className: cls.ICON + ' ' + iconClass }));\n }\n var args = { data: eventData, element: appointmentEle, cancel: false };\n this.parent.trigger(event.eventRendered, args);\n if (!args.cancel) {\n moreEventWrapperEle.appendChild(appointmentEle);\n this.parent.eventBase.wireAppointmentEvents(appointmentEle, false, eventData);\n this.parent.eventBase.applyResourceColor(appointmentEle, eventData, 'backgroundColor', groupOrder);\n }\n }\n }\n moreEventContentEle.appendChild(moreEventWrapperEle);\n return moreEventContentEle;\n };\n QuickPopups.prototype.tapHoldEventPopup = function (e) {\n var target = closest(e.target, '.' + cls.APPOINTMENT_CLASS);\n this.isMultipleEventSelect = false;\n this.parent.selectedElements = [];\n this.isMultipleEventSelect = true;\n this.parent.eventBase.getSelectedEventElements(target);\n this.parent.activeEventData = this.parent.eventBase.getSelectedEvents();\n var guid = target.getAttribute('data-guid');\n var eventObj = this.parent.eventBase.getEventByGuid(guid);\n var eventTitle = (eventObj[this.parent.eventFields.subject] || this.l10n.getConstant('noTitle'));\n var eventTemplate = \"\");\n this.quickPopup.element.innerHTML = eventTemplate;\n var closeIcon = this.quickPopup.element.querySelector('.' + cls.CLOSE_CLASS);\n this.renderButton('e-flat e-round e-small', cls.ICON + ' ' + cls.CLOSE_ICON_CLASS, false, closeIcon, this.closeClick);\n var editIcon = this.quickPopup.element.querySelector('.' + cls.EDIT_CLASS);\n this.renderButton('e-flat e-round e-small', cls.ICON + ' ' + cls.EDIT_ICON_CLASS, false, editIcon, this.editClick);\n var deleteIcon = this.quickPopup.element.querySelector('.' + cls.DELETE_CLASS);\n this.renderButton('e-flat e-round e-small', cls.ICON + ' ' + cls.DELETE_ICON_CLASS, false, deleteIcon, this.deleteClick);\n this.beforeQuickPopupOpen(target);\n };\n QuickPopups.prototype.isCellBlocked = function (args) {\n var tempObj = {};\n tempObj[this.parent.eventFields.startTime] = this.parent.activeCellsData.startTime;\n tempObj[this.parent.eventFields.endTime] = this.parent.activeCellsData.endTime;\n tempObj[this.parent.eventFields.isAllDay] = this.parent.activeCellsData.isAllDay;\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n var targetCell = args.element instanceof Array ? args.element[0] : args.element;\n var groupIndex = parseInt(targetCell.getAttribute('data-group-index'), 10);\n this.parent.resourceBase.setResourceValues(tempObj, true, isNaN(groupIndex) ? null : groupIndex);\n }\n return this.parent.eventBase.isBlockRange(tempObj);\n };\n QuickPopups.prototype.cellClick = function (args) {\n if (!this.parent.showQuickInfo || this.parent.currentView === 'MonthAgenda' || this.isCellBlocked(args)) {\n this.quickPopupHide();\n return;\n }\n var targetEle = args.event.target;\n if (this.parent.isAdaptive) {\n this.quickPopupHide();\n var newEventClone = this.parent.element.querySelector('.' + cls.NEW_EVENT_CLASS);\n if (isNullOrUndefined(newEventClone)) {\n newEventClone = createElement('div', {\n className: cls.NEW_EVENT_CLASS,\n innerHTML: \"
\");\n var contentTemplate = createElement('div', {\n className: cls.POPUP_CONTENT_CLASS, innerHTML: tempStr\n });\n quickCellPopup.appendChild(contentTemplate);\n }\n if (this.parent.quickInfoTemplates.footer) {\n append(this.parent.getQuickInfoTemplatesFooter()(templateArgs), quickCellPopup);\n }\n else {\n var footerTemplate = createElement('div', {\n className: cls.POPUP_FOOTER_CLASS, innerHTML: \"\" +\n (\"\")\n });\n quickCellPopup.appendChild(footerTemplate);\n }\n var subjectElement = quickCellPopup.querySelector('.' + cls.SUBJECT_CLASS);\n if (subjectElement) {\n Input.createInput({ element: subjectElement, properties: { placeholder: this.l10n.getConstant('addTitle') } });\n }\n var closeIcon = quickCellPopup.querySelector('.' + cls.CLOSE_CLASS);\n if (closeIcon) {\n this.renderButton('e-flat e-round e-small', cls.ICON + ' ' + cls.CLOSE_ICON_CLASS, false, closeIcon, this.quickPopupHide);\n }\n var moreButton = quickCellPopup.querySelector('.' + cls.QUICK_POPUP_EVENT_DETAILS_CLASS);\n if (moreButton) {\n this.renderButton('e-flat', '', false, moreButton, this.detailsClick);\n }\n var saveButton = quickCellPopup.querySelector('.' + cls.EVENT_CREATE_CLASS);\n if (saveButton) {\n this.renderButton('e-flat e-primary', '', this.parent.activeViewOptions.readonly, saveButton, this.saveClick);\n }\n this.quickPopup.content = quickCellPopup;\n this.quickPopup.dataBind();\n this.applyFormValidation();\n if (this.morePopup) {\n this.morePopup.hide();\n }\n this.quickPopup.relateTo = target;\n this.beforeQuickPopupOpen(target);\n };\n QuickPopups.prototype.isSameEventClick = function (events) {\n var isSameTarget = this.quickPopup.relateTo === closest(events.element, '.' + cls.APPOINTMENT_CLASS);\n if (isSameTarget && this.quickPopup.element.classList.contains(cls.POPUP_OPEN)) {\n var editIcon = this.quickPopup.element.querySelector('.' + cls.EDIT_CLASS);\n if (editIcon) {\n editIcon.focus();\n }\n if (!this.parent.isAdaptive) {\n var editButton = this.quickPopup.element.querySelector('.' + cls.EDIT_EVENT_CLASS);\n if (editButton) {\n editButton.focus();\n }\n }\n return true;\n }\n return false;\n };\n QuickPopups.prototype.eventClick = function (events) {\n if (this.parent.eventTooltip) {\n this.parent.eventTooltip.close();\n }\n if (!this.parent.showQuickInfo) {\n return;\n }\n if (this.parent.isAdaptive && this.isMultipleEventSelect) {\n this.updateTapHoldEventPopup(closest(events.element, '.' + cls.APPOINTMENT_CLASS));\n }\n else {\n var isSameTarget = this.isSameEventClick(events);\n if (isSameTarget) {\n return;\n }\n var eventData = events.event;\n var args = this.getFormattedString(eventData);\n var quickEventPopup = createElement('div', { className: cls.EVENT_POPUP_CLASS });\n var templateArgs = extend({}, eventData, { elementType: 'event' }, true);\n if (this.parent.quickInfoTemplates.header) {\n append(this.parent.getQuickInfoTemplatesHeader()(templateArgs), quickEventPopup);\n }\n else {\n var headerTemplate = createElement('div', {\n className: cls.POPUP_HEADER_CLASS,\n innerHTML: \"\")\n });\n quickEventPopup.appendChild(headerTemplate);\n }\n if (this.parent.quickInfoTemplates.content) {\n append(this.parent.getQuickInfoTemplatesContent()(templateArgs), quickEventPopup);\n }\n else {\n var tempStr = \"\") : '')) +\n (\"\" + (eventData[this.parent.eventFields.startTimezone] ||\n eventData[this.parent.eventFields.endTimezone] ? \"\") : '')) +\n (\"\" + (eventData[this.parent.eventFields.description] ? \"\") : '')) +\n (\"\" + (this.parent.resources.length > 0 ? \"\") : ''));\n var contentTemplate = createElement('div', {\n className: cls.POPUP_CONTENT_CLASS, innerHTML: tempStr\n });\n quickEventPopup.appendChild(contentTemplate);\n }\n if (this.parent.quickInfoTemplates.footer) {\n append(this.parent.getQuickInfoTemplatesFooter()(templateArgs), quickEventPopup);\n }\n else {\n var footerTemplate = createElement('div', {\n className: cls.POPUP_FOOTER_CLASS,\n innerHTML: \"\" + (this.parent.isAdaptive ? '' : \"\") +\n (\"\"))\n });\n quickEventPopup.appendChild(footerTemplate);\n }\n var readonly = this.parent.activeViewOptions.readonly || eventData[this.parent.eventFields.isReadonly];\n var editIcon = quickEventPopup.querySelector('.' + cls.EDIT_CLASS);\n if (editIcon) {\n this.renderButton('e-flat e-round e-small', cls.ICON + ' ' + cls.EDIT_ICON_CLASS, readonly, editIcon, this.editClick);\n }\n var deleteIcon = quickEventPopup.querySelector('.' + cls.DELETE_CLASS);\n if (deleteIcon) {\n this.renderButton('e-flat e-round e-small', cls.ICON + ' ' + cls.DELETE_ICON_CLASS, readonly, deleteIcon, this.deleteClick);\n }\n var closeIcon = quickEventPopup.querySelector('.' + cls.CLOSE_CLASS);\n if (closeIcon) {\n this.renderButton('e-flat e-round e-small', cls.ICON + ' ' + cls.CLOSE_ICON_CLASS, false, closeIcon, this.quickPopupHide);\n }\n var editButton = quickEventPopup.querySelector('.' + cls.EDIT_EVENT_CLASS);\n if (editButton) {\n this.renderButton('e-flat e-primary', '', readonly, editButton, this.editClick);\n }\n var deleteButton = quickEventPopup.querySelector('.' + cls.DELETE_EVENT_CLASS);\n if (deleteButton) {\n this.renderButton('e-flat', '', readonly, deleteButton, this.deleteClick);\n }\n this.quickPopup.content = quickEventPopup;\n this.quickPopup.dataBind();\n if (this.morePopup && !closest(events.element, '.' + cls.MORE_EVENT_WRAPPER_CLASS)) {\n this.morePopup.hide();\n }\n this.quickPopup.relateTo = this.parent.isAdaptive ? document.body :\n closest(events.element, '.' + cls.APPOINTMENT_CLASS);\n this.beforeQuickPopupOpen(events.element);\n }\n };\n QuickPopups.prototype.getResourceText = function (args, type) {\n var resourceValue = '';\n if (this.parent.activeViewOptions.group.resources.length === 0) {\n var resourceCollection_1 = this.parent.resourceBase.resourceCollection.slice(-1)[0];\n var resourceData = resourceCollection_1.dataSource;\n var resourceIndex_1 = 0;\n var eventData_1 = args.event;\n resourceData.forEach(function (resource, index) {\n if (resource[resourceCollection_1.idField] === eventData_1[resourceCollection_1.field]) {\n resourceIndex_1 = index;\n }\n });\n resourceValue = resourceData[resourceIndex_1][resourceCollection_1.textField];\n }\n else {\n if (type === 'event') {\n var eventData = args.event;\n var resourceData = void 0;\n var lastResource_1;\n for (var i = this.parent.resourceBase.resourceCollection.length - 1; i >= 0; i--) {\n resourceData = eventData[this.parent.resourceBase.resourceCollection[i].field];\n if (!isNullOrUndefined(resourceData)) {\n lastResource_1 = this.parent.resourceBase.resourceCollection[i];\n break;\n }\n }\n if (!Array.isArray(resourceData)) {\n resourceData = [resourceData];\n }\n var resNames_1 = [];\n var lastResourceData_1 = lastResource_1.dataSource;\n resourceData.map(function (value) {\n var i = util.findIndexInData(lastResourceData_1, lastResource_1.idField, value);\n var text = lastResourceData_1[i][lastResource_1.textField];\n if (text) {\n resNames_1.push(text);\n }\n });\n resourceValue = resNames_1.join(', ');\n }\n else {\n var argsData = args;\n var groupIndex = !isNullOrUndefined(argsData.groupIndex) ? argsData.groupIndex : 0;\n var resourceDetails = this.parent.resourceBase.lastResourceLevel[groupIndex];\n resourceValue = resourceDetails.resourceData[resourceDetails.resource.textField];\n }\n }\n return resourceValue;\n };\n QuickPopups.prototype.getFormattedString = function (eventData) {\n var fields = this.parent.eventFields;\n var eventSubject = (eventData[fields.subject] || this.l10n.getConstant('noTitle'));\n var startDate = eventData[fields.startTime];\n var endDate = eventData[fields.endTime];\n var startDateDetails = this.getDateFormat(startDate, 'long');\n var endDateDetails = (eventData[fields.isAllDay] && endDate.getHours() === 0 && endDate.getMinutes() === 0) ?\n this.getDateFormat(util.addDays(new Date(endDate.getTime()), -1), 'long') : this.getDateFormat(endDate, 'long');\n var startTimeDetail = this.parent.getTimeString(startDate);\n var endTimeDetail = this.parent.getTimeString(endDate);\n var details = '';\n var spanLength = endDate.getDate() !== startDate.getDate() &&\n (endDate.getTime() - startDate.getTime()) / (60 * 60 * 1000) < 24 ? 1 : 0;\n if (eventData[fields.isAllDay]) {\n details = startDateDetails + ' (' + this.l10n.getConstant('allDay') + ')';\n if (((endDate.getTime() - startDate.getTime()) / util.MS_PER_DAY) > 1) {\n details += ' - ' + endDateDetails + ' (' + this.l10n.getConstant('allDay') + ')';\n }\n }\n else if ((((endDate.getTime() - startDate.getTime()) / util.MS_PER_DAY) >= 1) || spanLength > 0) {\n details = startDateDetails + ' (' + startTimeDetail + ')' + ' - ' + endDateDetails + ' (' + endTimeDetail + ')';\n }\n else {\n details = startDateDetails + ' (' + (startTimeDetail + ' - ' + endTimeDetail) + ')';\n }\n return { eventSubject: eventSubject, details: details };\n };\n QuickPopups.prototype.moreEventClick = function (data, endDate, groupIndex) {\n this.quickPopupHide(true);\n var moreEventContentEle = this.morePopup.element.querySelector('.' + cls.MORE_EVENT_CONTENT_CLASS);\n if (moreEventContentEle) {\n remove(moreEventContentEle);\n }\n var selectedDate = ((data.date).getTime()).toString();\n var target = closest(data.element, '.' + cls.MORE_INDICATOR_CLASS);\n this.morePopup.element.querySelector('.' + cls.MORE_EVENT_HEADER_DAY_CLASS).innerHTML = this.getDateFormat(data.date, 'E');\n var dateElement = this.morePopup.element.querySelector('.' + cls.MORE_EVENT_HEADER_DATE_CLASS);\n dateElement.innerHTML = this.getDateFormat(data.date, 'd');\n dateElement.setAttribute('data-date', selectedDate);\n dateElement.setAttribute('data-end-date', endDate.getTime().toString());\n var groupOrder;\n if (!isNullOrUndefined(groupIndex)) {\n dateElement.setAttribute('data-group-index', groupIndex);\n groupOrder = this.parent.resourceBase.lastResourceLevel[parseInt(groupIndex, 10)].groupOrder;\n }\n var moreEventElements = this.createMoreEventList(data.event, groupOrder, groupIndex);\n this.morePopup.element.querySelector('.' + cls.MORE_EVENT_POPUP_CLASS).appendChild(moreEventElements);\n removeClass(this.morePopup.element.querySelector('.' + cls.MORE_EVENT_DATE_HEADER_CLASS).childNodes, cls.CURRENTDATE_CLASS);\n if (util.resetTime(data.date).getTime() === util.resetTime(new Date()).getTime()) {\n addClass(this.morePopup.element.querySelector('.' + cls.MORE_EVENT_DATE_HEADER_CLASS).childNodes, cls.CURRENTDATE_CLASS);\n }\n if (this.parent.currentView.indexOf('Timeline') !== -1) {\n var gIndex = target.getAttribute('data-group-index');\n var startDate = new Date(parseInt(target.getAttribute('data-start-date'), 10));\n startDate.setHours(startDate.getHours(), startDate.getMinutes(), 0);\n var tdDate = startDate.getTime().toString();\n if (isNullOrUndefined(gIndex)) {\n this.morePopup.relateTo = this.parent.element.querySelector('.' + cls.CONTENT_WRAP_CLASS +\n ' tbody tr td[data-date=\"' + tdDate + '\"]');\n }\n else {\n this.morePopup.relateTo = this.parent.element.querySelector('.' + cls.CONTENT_WRAP_CLASS +\n ' tbody tr td[data-group-index=\"' + gIndex + '\"][data-date=\"' + tdDate + '\"]');\n }\n }\n else {\n this.morePopup.relateTo = closest(target, '.' + cls.WORK_CELLS_CLASS);\n }\n var eventProp = { type: 'EventContainer', data: data, cancel: false, element: this.morePopup.element };\n this.parent.trigger(event.popupOpen, eventProp);\n if (eventProp.cancel) {\n return;\n }\n this.morePopup.show();\n };\n QuickPopups.prototype.saveClick = function () {\n if (!this.quickPopup.element.querySelector('.' + cls.FORM_CLASS).ej2_instances[0].validate()) {\n return;\n }\n var fields = this.parent.eventFields;\n var saveObj = extend({}, this.parent.eventWindow.getObjectFromFormData(cls.POPUP_WRAPPER_CLASS));\n this.parent.eventWindow.setDefaultValueToObject(saveObj);\n saveObj[fields.id] = this.parent.eventBase.getEventMaxID();\n saveObj[fields.startTime] = this.parent.activeCellsData.startTime;\n saveObj[fields.endTime] = this.parent.activeCellsData.endTime;\n saveObj[fields.isAllDay] = this.parent.activeCellsData.isAllDay;\n if (this.parent.resourceBase) {\n this.parent.resourceBase.setResourceValues(saveObj, true);\n }\n this.parent.currentAction = 'Add';\n this.crudAction.addEvent(saveObj);\n this.quickPopupHide();\n };\n QuickPopups.prototype.detailsClick = function () {\n var subjectEle = this.quickPopup.element.querySelector('.' + cls.SUBJECT_CLASS);\n if (subjectEle && subjectEle.value !== '') {\n var args = extend(this.parent.activeCellsData, { subject: subjectEle.value });\n }\n this.fieldValidator.destroyToolTip();\n this.quickPopupHide();\n this.parent.eventWindow.openEditor(this.parent.activeCellsData, 'Add');\n };\n QuickPopups.prototype.editClick = function () {\n this.quickPopupHide(true);\n var data = this.parent.activeEventData.event;\n this.parent.currentAction = 'EditSeries';\n if (!isNullOrUndefined(data[this.parent.eventFields.recurrenceRule])) {\n this.parent.currentAction = 'EditOccurrence';\n this.openRecurrenceAlert();\n }\n else {\n this.parent.eventWindow.openEditor(data, this.parent.currentAction);\n }\n };\n QuickPopups.prototype.deleteClick = function () {\n this.quickPopupHide(true);\n this.parent.currentAction = 'Delete';\n if (this.parent.activeEventData.event[this.parent.eventFields.recurrenceRule]) {\n this.openRecurrenceAlert();\n }\n else {\n this.openDeleteAlert();\n }\n };\n QuickPopups.prototype.updateMoreEventContent = function () {\n if (this.morePopup.element.classList.contains('e-popup-close')) {\n return;\n }\n var moreEventContentEle = this.morePopup.element.querySelector('.' + cls.MORE_EVENT_CONTENT_CLASS);\n if (moreEventContentEle) {\n remove(moreEventContentEle);\n }\n var dateElement = this.morePopup.element.querySelector('.' + cls.MORE_EVENT_HEADER_DATE_CLASS);\n var startDate = this.parent.getDateFromElement(dateElement);\n var endDate = new Date(parseInt(dateElement.getAttribute('data-end-date'), 10));\n var groupIndex = dateElement.getAttribute('data-group-index');\n var data;\n var groupOrder;\n if (!isNullOrUndefined(groupIndex)) {\n data = this.parent.resourceBase.lastResourceLevel[parseInt(groupIndex, 10)];\n groupOrder = data.groupOrder;\n }\n var filteredEvents = this.parent.eventBase.filterEvents(startDate, endDate, this.parent.eventsProcessed, data);\n var moreElement = this.createMoreEventList(filteredEvents, groupOrder, groupIndex);\n this.morePopup.element.querySelector('.' + cls.MORE_EVENT_POPUP_CLASS).appendChild(moreElement);\n };\n QuickPopups.prototype.closeClick = function () {\n this.quickPopupHide();\n this.morePopup.hide();\n };\n QuickPopups.prototype.dialogButtonClick = function (event) {\n this.quickDialog.hide();\n var target = event.target;\n var cancelButton = this.quickDialog.element.querySelector('.' + cls.QUICK_DIALOG_ALERT_CANCEL);\n if (target.classList.contains(cls.QUICK_DIALOG_OCCURRENCE_CLASS)) {\n this.parent.currentAction = (this.parent.currentAction === 'Delete') ? 'DeleteOccurrence' : 'EditOccurrence';\n switch (this.parent.currentAction) {\n case 'EditOccurrence':\n this.parent.eventWindow.openEditor(this.parent.activeEventData.event, this.parent.currentAction);\n break;\n case 'DeleteOccurrence':\n this.crudAction.deleteEvent(this.parent.activeEventData.event, this.parent.currentAction);\n break;\n }\n }\n else if (target.classList.contains(cls.QUICK_DIALOG_SERIES_CLASS)) {\n this.parent.currentAction = (this.parent.currentAction === 'Delete') ? 'DeleteSeries' : 'EditSeries';\n switch (this.parent.currentAction) {\n case 'EditSeries':\n var parentEvent = this.parent.eventBase.getRecurrenceEvent(this.parent.activeEventData.event);\n this.parent.eventWindow.openEditor(parentEvent, this.parent.currentAction);\n break;\n case 'DeleteSeries':\n this.crudAction.deleteEvent(this.parent.activeEventData.event, this.parent.currentAction);\n break;\n }\n }\n else if (target.classList.contains(cls.QUICK_DIALOG_DELETE_CLASS)) {\n this.crudAction.deleteEvent(this.parent.activeEventData.event, this.parent.currentAction);\n }\n else if (!cancelButton.classList.contains(cls.DISABLE_CLASS) && (target.classList.contains(cls.QUICK_DIALOG_ALERT_OK) ||\n (target.classList.contains(cls.QUICK_DIALOG_ALERT_CANCEL) &&\n !cancelButton.classList.contains(cls.QUICK_DIALOG_CANCEL_CLASS)))) {\n this.parent.uiStateValues.isIgnoreOccurrence = target.classList.contains(cls.QUICK_DIALOG_ALERT_CANCEL);\n this.parent.eventWindow.eventSave(this.l10n.getConstant('ok'));\n }\n };\n QuickPopups.prototype.updateTapHoldEventPopup = function (target) {\n var selectedElements = this.parent.eventBase.getSelectedEventElements(target);\n this.parent.activeEventData = this.parent.eventBase.getSelectedEvents();\n if (selectedElements.length > 0) {\n var eventObj = this.parent.eventBase.getEventByGuid(selectedElements[0].getAttribute('data-guid'));\n var titleContent = (selectedElements.length === 1) ?\n (eventObj[this.parent.eventFields.subject] || this.l10n.getConstant('noTitle')) :\n '(' + selectedElements.length + ')' + ' ' + this.l10n.getConstant('selectedItems');\n this.quickPopup.element.querySelector('.' + cls.SUBJECT_CLASS).innerHTML = titleContent;\n if (selectedElements.length > 1) {\n addClass([this.quickPopup.element.querySelector('.' + cls.EDIT_ICON_CLASS)], cls.HIDDEN_CLASS);\n }\n else {\n removeClass([this.quickPopup.element.querySelector('.' + cls.EDIT_ICON_CLASS)], cls.HIDDEN_CLASS);\n }\n }\n else {\n this.parent.selectedElements = [];\n this.quickPopupHide();\n }\n };\n QuickPopups.prototype.getTimezone = function (event) {\n var zoneDetails = '';\n zoneDetails += event[this.parent.eventFields.startTimezone] || '';\n zoneDetails += zoneDetails === '' ? '' : ' - ';\n zoneDetails += event[this.parent.eventFields.endTimezone] || '';\n return zoneDetails;\n };\n QuickPopups.prototype.getRecurrenceSummary = function (event) {\n var recurrenceEditor = this.parent.eventWindow.getRecurrenceEditorInstance();\n if (recurrenceEditor) {\n var ruleSummary = recurrenceEditor.getRuleSummary(event[this.parent.eventFields.recurrenceRule]);\n return ruleSummary.charAt(0).toUpperCase() + ruleSummary.slice(1);\n }\n return '';\n };\n QuickPopups.prototype.getDateFormat = function (date, formatString) {\n return this.parent.globalize.formatDate(date, { skeleton: formatString, calendar: this.parent.getCalendarMode() });\n };\n QuickPopups.prototype.getDataFromTarget = function (target) {\n if (target.classList.contains(cls.APPOINTMENT_CLASS)) {\n return this.parent.activeEventData.event;\n }\n // Depricated cells data in quick popups\n var eventObj = {\n startTime: this.parent.activeCellsData.startTime,\n endTime: this.parent.activeCellsData.endTime,\n isAllDay: this.parent.activeCellsData.isAllDay,\n groupIndex: this.parent.activeCellsData.groupIndex\n };\n var cellsData = this.parent.activeCellsData;\n this.parent.eventWindow.convertToEventData(cellsData, eventObj);\n return eventObj;\n };\n QuickPopups.prototype.beforeQuickDialogClose = function () {\n this.parent.eventBase.focusElement();\n };\n QuickPopups.prototype.beforeQuickPopupOpen = function (target) {\n var isEventPopup = this.quickPopup.element.querySelector('.' + cls.EVENT_POPUP_CLASS);\n var popupType = this.parent.isAdaptive ? isEventPopup ? 'ViewEventInfo' : 'EditEventInfo' : 'QuickInfo';\n var eventProp = {\n type: popupType, cancel: false, data: this.getDataFromTarget(target),\n target: target, element: this.quickPopup.element\n };\n this.parent.trigger(event.popupOpen, eventProp);\n if (eventProp.cancel) {\n this.destroyButtons();\n if (eventProp.element.classList.contains(cls.POPUP_OPEN)) {\n this.quickPopupClose();\n }\n this.quickPopup.element.innerHTML = '';\n return;\n }\n var display = this.quickPopup.element.style.display;\n this.quickPopup.element.style.display = 'block';\n if (this.parent.isAdaptive) {\n this.quickPopup.element.removeAttribute('style');\n this.quickPopup.element.style.display = 'block';\n this.quickPopup.element.style.height = formatUnit((popupType === 'EditEventInfo') ? 65 : window.innerHeight);\n }\n else {\n this.quickPopup.offsetX = 10;\n this.quickPopup.collision = { X: 'none', Y: 'fit' };\n this.quickPopup.position = { X: 'right', Y: 'top' };\n this.quickPopup.dataBind();\n this.quickPopup.refreshPosition(null, true);\n var collide = isCollide(this.quickPopup.element, this.parent.element);\n if (collide.indexOf(this.parent.enableRtl ? 'left' : 'right') > -1) {\n this.quickPopup.offsetX = -target.offsetWidth - 10 - this.quickPopup.element.offsetWidth;\n this.quickPopup.dataBind();\n var leftCollide = isCollide(this.quickPopup.element, this.parent.element);\n if (leftCollide.indexOf('left') > -1) {\n this.quickPopup.position = { X: 'center', Y: 'center' };\n this.quickPopup.collision = { X: 'fit', Y: 'fit' };\n this.quickPopup.offsetX = -(this.quickPopup.element.offsetWidth / 2);\n this.quickPopup.dataBind();\n }\n }\n if (this.parent.virtualScrollModule && (collide.indexOf('top') > -1 || collide.indexOf('bottom') > -1)) {\n var element = this.parent.element.querySelector('.' + cls.CONTENT_WRAP_CLASS + ' table');\n var translateY = util.getTranslateY(element);\n this.quickPopup.offsetY = translateY;\n this.quickPopup.dataBind();\n }\n }\n if (isEventPopup) {\n this.applyEventColor();\n }\n this.quickPopup.element.style.display = display;\n this.quickPopup.dataBind();\n this.quickPopup.show();\n };\n QuickPopups.prototype.applyEventColor = function () {\n var colorField = '';\n if (this.parent.currentView === 'Agenda' || this.parent.currentView === 'MonthAgenda') {\n colorField = this.parent.enableRtl ? 'border-right-color' : 'border-left-color';\n }\n else {\n colorField = 'background-color';\n }\n // tslint:disable-next-line:no-any\n var color = this.parent.activeEventData.element.style[colorField];\n if (color === '') {\n return;\n }\n var colorEle = this.quickPopup.element.querySelector('.' + cls.POPUP_HEADER_CLASS);\n var footerEle = this.quickPopup.element.querySelector('.' + cls.POPUP_FOOTER_CLASS);\n if (footerEle && footerEle.offsetParent) {\n colorEle = this.quickPopup.element.querySelector('.' + cls.SUBJECT_CLASS);\n if (colorEle) {\n colorEle.style.borderLeftColor = color;\n color = \"rgba(\" + color.match(/\\d+/g).join() + \",0.3)\";\n }\n }\n if (colorEle) {\n colorEle.style.backgroundColor = color;\n }\n };\n QuickPopups.prototype.quickPopupOpen = function () {\n if (this.parent.isAdaptive) {\n return;\n }\n if (this.quickPopup.element.querySelector('.' + cls.CELL_POPUP_CLASS)) {\n var subjectElement = this.quickPopup.element.querySelector('.' + cls.SUBJECT_CLASS);\n if (subjectElement) {\n subjectElement.focus();\n }\n }\n else {\n var editElement = this.quickPopup.element.querySelector('.' + cls.EDIT_EVENT_CLASS);\n if (editElement) {\n editElement.focus();\n }\n var editIcon = this.quickPopup.element.querySelector('.' + cls.EDIT_CLASS);\n if (editIcon) {\n editIcon.focus();\n }\n }\n };\n QuickPopups.prototype.quickPopupClose = function () {\n this.parent.eventBase.focusElement();\n this.quickPopup.relateTo = cls.WORK_CELLS_CLASS;\n this.fieldValidator.destroyToolTip();\n this.destroyButtons();\n this.quickPopup.element.innerHTML = '';\n };\n QuickPopups.prototype.morePopupOpen = function () {\n this.morePopup.element.querySelector('.' + cls.MORE_EVENT_HEADER_DATE_CLASS).focus();\n this.morePopup.refreshPosition();\n };\n QuickPopups.prototype.morePopupClose = function () {\n var moreWrapper = this.parent.element.querySelector('.' + cls.MORE_EVENT_WRAPPER_CLASS);\n if (moreWrapper) {\n remove(moreWrapper);\n }\n };\n QuickPopups.prototype.quickPopupHide = function (hideAnimation) {\n if (this.quickPopup.element.classList.contains('e-popup-open')) {\n if (hideAnimation) {\n var animation = this.quickPopup.hideAnimation;\n this.quickPopup.hideAnimation = null;\n this.quickPopup.hide();\n this.quickPopup.hideAnimation = animation;\n }\n else {\n this.quickPopup.hide();\n }\n this.isMultipleEventSelect = false;\n }\n };\n QuickPopups.prototype.navigationClick = function (e) {\n var navigateEle = closest(e.target, '.' + cls.NAVIGATE_CLASS);\n if (!isNullOrUndefined(navigateEle)) {\n var date = this.parent.getDateFromElement(e.currentTarget);\n if (!isNullOrUndefined(date) && !this.parent.isAdaptive) {\n this.closeClick();\n this.parent.setProperties({ selectedDate: date }, true);\n this.parent.changeView(this.parent.getNavigateView());\n }\n }\n };\n QuickPopups.prototype.documentClick = function (e) {\n var target = e.event.target;\n var classNames = '.' + cls.POPUP_WRAPPER_CLASS + ',.' + cls.HEADER_CELLS_CLASS + ',.' + cls.ALLDAY_CELLS_CLASS +\n ',.' + cls.WORK_CELLS_CLASS + ',.' + cls.APPOINTMENT_CLASS;\n if (closest(target, '.' + cls.APPOINTMENT_CLASS + ',.' + cls.HEADER_CELLS_CLASS)) {\n this.parent.removeNewEventElement();\n }\n if (!closest(target, classNames)) {\n this.quickPopupHide();\n this.parent.removeNewEventElement();\n }\n if (!closest(target, '.' + cls.MORE_POPUP_WRAPPER_CLASS) && !target.classList.contains(cls.MORE_INDICATOR_CLASS)\n && (!closest(target, '.' + cls.POPUP_OPEN))) {\n this.morePopup.hide();\n }\n };\n QuickPopups.prototype.onClosePopup = function () {\n this.quickPopupHide();\n this.parent.eventBase.focusElement();\n };\n QuickPopups.prototype.addEventListener = function () {\n this.parent.on(event.cellClick, this.cellClick, this);\n this.parent.on(event.eventClick, this.eventClick, this);\n this.parent.on(event.documentClick, this.documentClick, this);\n this.parent.on(event.dataReady, this.updateMoreEventContent, this);\n };\n QuickPopups.prototype.removeEventListner = function () {\n this.parent.off(event.cellClick, this.cellClick);\n this.parent.off(event.eventClick, this.eventClick);\n this.parent.off(event.documentClick, this.documentClick);\n this.parent.off(event.dataReady, this.updateMoreEventContent);\n };\n QuickPopups.prototype.destroyButtons = function () {\n var buttonCollections = [].slice.call(this.quickPopup.element.querySelectorAll('.e-control.e-btn'));\n buttonCollections.forEach(function (button) {\n var instance = button.ej2_instances[0];\n if (instance) {\n instance.destroy();\n }\n });\n };\n QuickPopups.prototype.destroy = function () {\n this.fieldValidator.destroy();\n this.removeEventListner();\n this.destroyButtons();\n this.quickPopup.destroy();\n remove(this.quickPopup.element);\n this.morePopup.destroy();\n remove(this.morePopup.element);\n if (this.quickDialog.element) {\n this.quickDialog.destroy();\n remove(this.quickDialog.element);\n this.quickDialog.element = null;\n }\n };\n return QuickPopups;\n}());\nexport { QuickPopups };\n","import { isNullOrUndefined, append, createElement } from '@syncfusion/ej2-base';\nimport { Tooltip } from '@syncfusion/ej2-popups';\nimport * as cls from '../base/css-constant';\nimport * as util from '../base/util';\n/**\n * Tooltip for Schedule\n */\nvar EventTooltip = /** @class */ (function () {\n function EventTooltip(parent) {\n this.parent = parent;\n this.tooltipObj = new Tooltip({\n content: 'No title',\n position: 'BottomRight',\n offsetY: 10,\n mouseTrail: this.parent.isAdaptive ? false : true,\n showTipPointer: false,\n cssClass: this.parent.cssClass + ' ' + cls.EVENT_TOOLTIP_ROOT_CLASS,\n target: this.getTargets(),\n beforeRender: this.onBeforeRender.bind(this),\n enableRtl: this.parent.enableRtl\n });\n this.tooltipObj.appendTo(this.parent.element);\n }\n EventTooltip.prototype.getTargets = function () {\n var targets = [];\n if (this.parent.activeViewOptions.group.headerTooltipTemplate) {\n targets.push('.' + cls.RESOURCE_CELLS_CLASS);\n }\n if (this.parent.eventSettings.enableTooltip) {\n targets.push('.' + cls.APPOINTMENT_CLASS);\n }\n return targets.join(',');\n };\n EventTooltip.prototype.onBeforeRender = function (args) {\n if (!isNullOrUndefined(args.target.getAttribute('data-tooltip-id'))) {\n return;\n }\n if (args.target.classList.contains(cls.RESOURCE_CELLS_CLASS) && this.parent.activeViewOptions.group.resources.length > 0) {\n var resCollection = void 0;\n if (this.parent.activeView.isTimelineView()) {\n var index = parseInt(args.target.getAttribute('data-group-index'), 0);\n resCollection = this.parent.resourceBase.lastResourceLevel[index];\n }\n else {\n var rowIndex = args.target.parentNode.sectionRowIndex;\n var cellIndex = args.target.cellIndex;\n resCollection = this.parent.activeView.getColumnLevels()[rowIndex][cellIndex];\n }\n var data = {\n resource: resCollection.resource,\n resourceData: resCollection.resourceData\n };\n var contentContainer = createElement('div');\n append(this.parent.getHeaderTooltipTemplate()(data), contentContainer);\n this.setContent(contentContainer);\n return;\n }\n var record = this.parent.eventBase.getEventByGuid(args.target.getAttribute('data-guid'));\n if (!isNullOrUndefined(this.parent.eventSettings.tooltipTemplate)) {\n var contentContainer = createElement('div');\n append(this.parent.getEventTooltipTemplate()(record), contentContainer);\n this.setContent(contentContainer);\n }\n else {\n var globalize = this.parent.globalize;\n var fields = this.parent.eventFields;\n var eventStart = new Date('' + record[fields.startTime]);\n var eventEnd = new Date('' + record[fields.endTime]);\n eventEnd = (eventEnd.getHours() === 0 && eventEnd.getMinutes() === 0) ? new Date(eventEnd.setMilliseconds(-1000)) : eventEnd;\n var startDate = util.resetTime(new Date('' + eventStart));\n var endDate = util.resetTime(new Date('' + eventEnd));\n var tooltipSubject = (record[fields.subject] || this.parent.eventSettings.fields.subject.default);\n var tooltipLocation = !isNullOrUndefined(record[fields.location]) ? record[fields.location] : '';\n var startMonthDate = globalize.formatDate(eventStart, {\n type: 'date', skeleton: 'MMMd', calendar: this.parent.getCalendarMode()\n });\n var startMonthYearDate = globalize.formatDate(eventStart, {\n type: 'date', skeleton: 'medium', calendar: this.parent.getCalendarMode()\n });\n var endMonthYearDate = globalize.formatDate(eventEnd, {\n type: 'date', skeleton: 'medium', calendar: this.parent.getCalendarMode()\n });\n var startTime = globalize.formatDate(eventStart, {\n type: 'time', skeleton: 'short', calendar: this.parent.getCalendarMode()\n });\n var endTime = globalize.formatDate(eventEnd, {\n type: 'time', skeleton: 'short', calendar: this.parent.getCalendarMode()\n });\n var tooltipDetails = void 0;\n if (startDate.getTime() === endDate.getTime()) {\n tooltipDetails = globalize.formatDate(eventStart, {\n type: 'date', skeleton: 'long', calendar: this.parent.getCalendarMode()\n });\n }\n else {\n tooltipDetails = (startDate.getFullYear() === endDate.getFullYear()) ? (startMonthDate + ' - ' + endMonthYearDate) :\n (startMonthYearDate + ' - ' + endMonthYearDate);\n }\n var tooltipTime = (record[fields.isAllDay]) ? this.parent.localeObj.getConstant('allDay') :\n (startTime + ' - ' + endTime);\n var content = '';\n this.setContent(content);\n }\n };\n EventTooltip.prototype.setContent = function (content) {\n this.tooltipObj.setProperties({ content: content }, true);\n };\n EventTooltip.prototype.close = function () {\n this.tooltipObj.close();\n };\n /**\n * To destroy the event tooltip.\n * @return {void}\n * @private\n */\n EventTooltip.prototype.destroy = function () {\n this.tooltipObj.destroy();\n this.tooltipObj = null;\n };\n return EventTooltip;\n}());\nexport { EventTooltip };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, Property, NotifyPropertyChanges, Event, Browser } from '@syncfusion/ej2-base';\nimport { getDefaultDateObject, getValue, cldrData, L10n, isNullOrUndefined, removeClass, addClass } from '@syncfusion/ej2-base';\nimport { DropDownList } from '@syncfusion/ej2-dropdowns';\nimport { NumericTextBox } from '@syncfusion/ej2-inputs';\nimport { DatePicker } from '@syncfusion/ej2-calendars';\nimport { Button, RadioButton } from '@syncfusion/ej2-buttons';\nimport { EventHandler, classList } from '@syncfusion/ej2-base';\nimport { extractObjectFromRule, generate, generateSummary, getRecurrenceStringFromDate, getCalendarUtil } from './date-generator';\nvar HEADER = 'e-editor';\nvar INPUTWARAPPER = 'e-input-wrapper';\nvar INPUTWARAPPERSIDE = 'e-input-wrapper-side';\nvar REPEATELEMENT = 'e-repeat-element';\nvar REPEATINTERVAL = 'e-repeat-interval';\nvar INTERVALCLASS = 'e-interval';\nvar DAYWRAPPER = 'e-days';\nvar WEEKWRAPPER = 'e-non-week';\nvar WEEKPOSITION = 'e-week-position';\nvar YEAREXPANDERWRAPPER = 'e-year-expander';\nvar YEAREXPANDERELEMENT = 'e-year-expander-element';\nvar MONETHEXPANDERWRAPPER = 'e-month-expander';\nvar MONETHEXPANDWRAPPER = 'e-month-expand-wrapper';\nvar MONTHEXPANDERELEMENT = 'e-month-expander-element';\nvar MONTHEXPANDERCHECKBOXWRAPPER = 'e-month-expander-checkbox-wrapper';\nvar FORMLEFT = 'e-form-left';\nvar FORMRIGHT = 'e-form-right';\nvar MONTHDAYWRAPPER = 'e-month-day';\nvar MONTHEXPANNDERELEM = 'e-month-expander-wrapper';\nvar MONTHPOS = 'e-month-pos';\nvar MONTHWEEK = 'e-month-week';\nvar ENDON = 'e-end-on';\nvar MONTHEXPANDERLABEL = 'e-month-expander-label';\nvar WEEKEXPANDERLABEL = 'e-week-expander-label';\nvar ENDONLABEL = 'e-end-on-label';\nvar ENDONLEFT = 'e-end-on-left';\nvar MONTHDAYELEMENT = 'e-monthday-element';\nvar ENDONELEMENT = 'e-end-on-element';\nvar ENDONDATE = 'e-end-on-date';\nvar UNTILDATE = 'e-until-date';\nvar ENDONCOUNTWRAPPER = 'e-end-on-count';\nvar ENDONCOUNT = 'e-recurrence-count';\nvar HIDEWRAPPER = 'e-hide-recurrence-element';\nvar RTLCLASS = 'e-rtl';\nvar PRIMARY = 'e-primary';\nvar ACTIVE = 'e-active';\nvar RECURRENCETABLE = 'e-recurrence-table';\nvar REPEATCONTENT = 'e-repeat-content';\nvar REPEATCONTENTWRAPPER = 'e-repeat-content-wrapper';\nvar NONE = 'none';\nvar DAILY = 'daily';\nvar WEEKLY = 'weekly';\nvar MONTHLY = 'monthly';\nvar YEARLY = 'yearly';\nvar NEVER = 'never';\nvar UNTIL = 'until';\nvar COUNT = 'count';\nvar TEXTFIELD = 'text';\nvar VALUEFIELD = 'value';\nvar LAST = 'last';\nvar REPEAT = 'repeat';\nvar REPEATEVERY = 'repeatEvery';\nvar ON = 'on';\nvar END = 'end';\nvar RADIOLABEL = 'onDay';\nvar RULEUNTIL = 'UNTIL';\nvar RULEBYDAY = 'BYDAY';\nvar RULEBYMONTHDAY = 'BYMONTHDAY';\nvar RULEBYMONTH = 'BYMONTH';\nvar RULEINTERVAL = 'INTERVAL';\nvar RULECOUNT = 'COUNT';\nvar RULESETPOS = 'BYSETPOS';\nvar RULEFREQ = 'FREQ';\nvar RULEDAILY = 'DAILY';\nvar RULEWEEKLY = 'WEEKLY';\nvar RULEMONTHLY = 'MONTHLY';\nvar RULEYEARLY = 'YEARLY';\nvar RULESUNDAY = 'SU';\nvar RULEMONDAY = 'MO';\nvar RULETUESDAY = 'TU';\nvar RULEWEDNESDAY = 'WE';\nvar RULETHURSDAY = 'TH';\nvar RULEFRIDAY = 'FR';\nvar RULESATURDAY = 'SA';\nvar KEYSUNDAY = 'sun';\nvar KEYMONDAY = 'mon';\nvar KEYTUESDAY = 'tue';\nvar KEYWEDNESDAY = 'wed';\nvar KEYTHURSDAY = 'thu';\nvar KEYFRIDAY = 'fri';\nvar KEYSATURDAY = 'sat';\nvar EQUAL = '=';\nvar SEMICOLON = ';';\nvar COMMA = ',';\nvar FIRST = 'first';\nvar SECOND = 'second';\nvar THIRD = 'third';\nvar FOURTH = 'fourth';\nvar contentType = {\n none: '',\n daily: 'days',\n weekly: 'weeks',\n monthly: 'months',\n yearly: 'years'\n};\nvar valueData = {\n 'sun': RULESUNDAY,\n 'mon': RULEMONDAY,\n 'tue': RULETUESDAY,\n 'wed': RULEWEDNESDAY,\n 'thu': RULETHURSDAY,\n 'fri': RULEFRIDAY,\n 'sat': RULESATURDAY\n};\nvar neverClassList = [DAYWRAPPER, WEEKWRAPPER, ENDON, INTERVALCLASS, YEAREXPANDERWRAPPER, MONETHEXPANDERWRAPPER];\nvar weekClassList = [WEEKWRAPPER];\nvar monthClassList = [DAYWRAPPER, YEAREXPANDERWRAPPER];\nvar yearClassList = [DAYWRAPPER];\nvar dailyClassList = [DAYWRAPPER, WEEKWRAPPER, YEAREXPANDERWRAPPER, MONETHEXPANDERWRAPPER];\nvar noEndClassList = [ENDONDATE, ENDONCOUNTWRAPPER];\nvar endOnCountClassList = [ENDONDATE];\nvar endOnDateClassList = [ENDONCOUNTWRAPPER];\n/**\n * Represents the RecurrenceEditor component.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar RecurrenceEditor = /** @class */ (function (_super) {\n __extends(RecurrenceEditor, _super);\n /**\n * Constructor for creating the widget\n * @param {object} options?\n */\n function RecurrenceEditor(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.defaultLocale = {\n none: 'None',\n daily: 'Daily',\n weekly: 'Weekly',\n monthly: 'Monthly',\n month: 'Month',\n yearly: 'Yearly',\n never: 'Never',\n until: 'Until',\n count: 'Count',\n first: 'First',\n second: 'Second',\n third: 'Third',\n fourth: 'Fourth',\n last: 'Last',\n repeat: 'Repeat',\n repeatEvery: 'Repeat every',\n on: 'Repeat On',\n end: 'End',\n onDay: 'Day',\n days: 'Day(s)',\n weeks: 'Week(s)',\n months: 'Month(s)',\n years: 'Year(s)',\n every: 'every',\n summaryTimes: 'time(s)',\n summaryOn: 'on',\n summaryUntil: 'until',\n summaryRepeat: 'Repeats',\n summaryDay: 'day(s)',\n summaryWeek: 'week(s)',\n summaryMonth: 'month(s)',\n summaryYear: 'year(s)',\n monthWeek: 'Month Week',\n monthPosition: 'Month Position',\n monthExpander: 'Month Expander',\n yearExpander: 'Year Expander',\n repeatInterval: 'Repeat Interval'\n };\n _this.renderStatus = false;\n _this.dayButtons = [];\n _this.monthButtons = [];\n _this.calendarUtil = getCalendarUtil(_this.calendarMode);\n return _this;\n }\n RecurrenceEditor.prototype.startState = function (freq, endOn, startDate) {\n this.showFormElement();\n this.updateForm(freq);\n this.freshOnEndForm();\n this.updateEndOnForm(endOn);\n this.selectMonthDay(startDate);\n this.updateUntilDate(startDate);\n this.onMonthDay.setProperties({ checked: true });\n };\n RecurrenceEditor.prototype.preRender = function () {\n this.localeObj = new L10n(this.getModuleName(), this.defaultLocale, this.locale);\n // pre render code snippets\n };\n RecurrenceEditor.prototype.applyCustomClass = function (cssClass) {\n if (cssClass) {\n addClass([this.element], cssClass);\n }\n };\n RecurrenceEditor.prototype.initialize = function () {\n addClass([this.element], 'e-' + this.getModuleName());\n this.renderComponent();\n if (!isNullOrUndefined(this.value)) {\n this.setRecurrenceRule(this.value);\n }\n else {\n this.startState(this.repeatType.value.toString().toUpperCase(), NEVER, this.startDate);\n this.updateForm(this.repeatType.value.toString());\n if (this.selectedType > 0) {\n this.setProperties({ value: this.getRecurrenceRule() }, false);\n }\n }\n this.applyCustomClass(this.cssClass);\n };\n RecurrenceEditor.prototype.triggerChangeEvent = function () {\n if (this.renderStatus) {\n var value = this.getRecurrenceRule();\n this.trigger('change', { value: value });\n this.setProperties({ value: value }, false);\n }\n };\n RecurrenceEditor.prototype.resetDayButton = function () {\n var elements = [].slice.call(this.element.querySelectorAll('.' + DAYWRAPPER + ' button'));\n elements.forEach(function (element) { return removeClass([element], [ACTIVE, PRIMARY]); });\n };\n RecurrenceEditor.prototype.daySelection = function (dayIndex) {\n this.resetDayButton();\n var days = [0, 1, 2, 3, 4, 5, 6];\n this.rotateArray(days, this.firstDayOfWeek);\n var element = this.element.querySelector('.' + DAYWRAPPER + ' button[data-index=\"' + days.indexOf(dayIndex) + '\"]');\n if (element) {\n addClass([element], [ACTIVE, PRIMARY]);\n }\n };\n RecurrenceEditor.prototype.rtlClass = function (status) {\n if (status) {\n addClass([this.element], RTLCLASS);\n }\n else {\n removeClass([this.element], RTLCLASS);\n }\n };\n RecurrenceEditor.prototype.updateUntilDate = function (date) {\n var tempDate = new Date(date.getTime());\n tempDate.setDate(tempDate.getDate() + 60);\n this.untilDateObj.setProperties({ value: tempDate });\n };\n RecurrenceEditor.prototype.selectMonthDay = function (date) {\n var weekday = [KEYSUNDAY, KEYMONDAY, KEYTUESDAY, KEYWEDNESDAY, KEYTHURSDAY, KEYFRIDAY, KEYSATURDAY];\n this.monthDate.setProperties({ value: this.calendarUtil.getDate(date) });\n this.monthWeekDays.setProperties({ value: valueData[weekday[date.getDay()]] });\n this.monthValue.setProperties({ value: '' + this.calendarUtil.getMonth(date) });\n this.monthWeekPos.setProperties({ value: this.getDayPosition(date) });\n this.daySelection(date.getDay());\n };\n RecurrenceEditor.prototype.updateForm = function (state) {\n var _this = this;\n this.repeatType.setProperties({ value: state });\n var end = this.element.querySelector('.' + ENDON);\n if (state === DAILY) {\n classList(end, [FORMLEFT], [FORMRIGHT]);\n }\n else {\n classList(end, [FORMRIGHT], [FORMLEFT]);\n }\n switch (state) {\n case NONE:\n neverClassList.forEach(function (className) { return addClass([_this.element.querySelector('.' + className)], HIDEWRAPPER); });\n break;\n case WEEKLY:\n weekClassList.forEach(function (className) { return addClass([_this.element.querySelector('.' + className)], HIDEWRAPPER); });\n break;\n case MONTHLY:\n monthClassList.forEach(function (className) { return addClass([_this.element.querySelector('.' + className)], HIDEWRAPPER); });\n break;\n case YEARLY:\n yearClassList.forEach(function (className) { return addClass([_this.element.querySelector('.' + className)], HIDEWRAPPER); });\n break;\n case DAILY:\n dailyClassList.forEach(function (className) { return addClass([_this.element.querySelector('.' + className)], HIDEWRAPPER); });\n break;\n }\n };\n RecurrenceEditor.prototype.updateEndOnForm = function (state) {\n var _this = this;\n this.endType.setProperties({ value: state });\n switch (state) {\n case NEVER:\n noEndClassList.forEach(function (className) { return addClass([_this.element.querySelector('.' + className)], HIDEWRAPPER); });\n break;\n case UNTIL:\n endOnDateClassList.forEach(function (className) { return addClass([_this.element.querySelector('.' + className)], HIDEWRAPPER); });\n break;\n case COUNT:\n endOnCountClassList.forEach(function (className) { return addClass([_this.element.querySelector('.' + className)], HIDEWRAPPER); });\n break;\n }\n };\n RecurrenceEditor.prototype.freshOnEndForm = function () {\n var _this = this;\n noEndClassList.forEach(function (className) {\n var element = _this.element.querySelector('.' + className);\n if (element) {\n removeClass([element], HIDEWRAPPER);\n }\n });\n };\n RecurrenceEditor.prototype.showFormElement = function () {\n var _this = this;\n neverClassList.forEach(function (className) { return removeClass([_this.element.querySelector('.' + className)], HIDEWRAPPER); });\n };\n RecurrenceEditor.prototype.renderDropdowns = function () {\n var _this = this;\n var self = this;\n this.repeatType = new DropDownList({\n //set the data to dataSource property\n dataSource: this.getRepeatData(),\n floatLabelType: 'Always',\n enableRtl: this.enableRtl,\n index: this.selectedType,\n fields: {\n text: TEXTFIELD,\n value: VALUEFIELD\n },\n placeholder: this.localeObj.getConstant(REPEAT),\n htmlAttributes: { 'title': this.localeObj.getConstant(REPEAT) },\n change: function (args) {\n self.setProperties({ selectedType: args.value }, false);\n self.element.querySelector('.' + REPEATCONTENT).innerHTML =\n self.localeObj.getConstant(contentType[args.value]);\n self.showFormElement();\n self.updateForm(args.value);\n self.resetFormValues();\n self.triggerChangeEvent();\n }\n });\n // set placeholder to DropDownList input element\n this.repeatType.appendTo(this.element.querySelector('.' + REPEATELEMENT));\n this.endType = new DropDownList({\n dataSource: this.getEndData(),\n popupWidth: this.getPopupWidth(),\n enableRtl: this.enableRtl,\n index: 1,\n fields: {\n text: TEXTFIELD,\n value: VALUEFIELD\n },\n change: function (args) {\n self.freshOnEndForm();\n self.updateEndOnForm(args.value);\n self.resetFormValues();\n self.triggerChangeEvent();\n }\n });\n this.endType.appendTo(this.element.querySelector('.' + ENDONELEMENT));\n var renderDropDownList = function (dropDownData) {\n return new DropDownList({\n dataSource: dropDownData,\n popupWidth: _this.getPopupWidth(),\n enableRtl: _this.enableRtl,\n fields: {\n text: TEXTFIELD,\n value: VALUEFIELD\n },\n index: 1,\n change: function (args) {\n self.onWeekDay.setProperties({ checked: true });\n self.resetFormValues();\n self.triggerChangeEvent();\n }\n });\n };\n this.monthWeekPos = renderDropDownList(this.getMonthPosData());\n this.monthWeekPos.appendTo(this.element.querySelector('.' + MONTHPOS));\n this.monthWeekDays = renderDropDownList(this.getDayData('wide'));\n this.monthWeekDays.appendTo(this.element.querySelector('.' + MONTHWEEK));\n this.monthValue = new DropDownList({\n dataSource: this.getMonthData(),\n fields: {\n text: TEXTFIELD,\n value: VALUEFIELD\n },\n floatLabelType: 'Always',\n enableRtl: this.enableRtl,\n index: 7,\n change: function (args) {\n self.resetFormValues();\n self.triggerChangeEvent();\n }\n });\n this.monthValue.appendTo(this.element.querySelector('.' + YEAREXPANDERELEMENT));\n };\n RecurrenceEditor.prototype.setDefaultValue = function () {\n var formelement = [].slice.call(this.element.querySelectorAll('.e-control .e-numerictextbox'));\n for (var _i = 0, formelement_1 = formelement; _i < formelement_1.length; _i++) {\n var element = formelement_1[_i];\n var instance = element.ej2_instances[0];\n if (instance.element.classList.contains(REPEATINTERVAL)) {\n instance.value = 1;\n instance.dataBind();\n }\n else if (instance.element.classList.contains(ENDONCOUNT)) {\n instance.value = 10;\n instance.dataBind();\n }\n }\n };\n RecurrenceEditor.prototype.resetFormValues = function () {\n var recurreneElement = [].slice.call(this.element.querySelectorAll('.e-control [type=\"text\"]'));\n for (var _i = 0, recurreneElement_1 = recurreneElement; _i < recurreneElement_1.length; _i++) {\n var element = recurreneElement_1[_i];\n var instance = void 0;\n if (element.classList.contains('e-datepicker')) {\n instance = element.ej2_instances[0];\n if (instance.value) {\n instance.value = instance.value;\n instance.dataBind();\n }\n else {\n this.updateUntilDate(this.startDate);\n }\n }\n else if (element.classList.contains('e-dropdownlist')) {\n instance = element.ej2_instances[0];\n instance.index = instance.index || 0;\n instance.dataBind();\n }\n else if (element.classList.contains('e-numerictextbox')) {\n instance = element.ej2_instances[0];\n var value = void 0;\n if (instance.element.classList.contains(REPEATINTERVAL)) {\n value = 1;\n }\n else if (instance.element.classList.contains(ENDONCOUNT)) {\n value = 10;\n }\n else {\n value = this.startDate.getDate();\n }\n instance.value = instance.value || value;\n instance.dataBind();\n }\n }\n };\n RecurrenceEditor.prototype.getPopupWidth = function () {\n return Browser.isDevice ? '100%' : 'auto';\n };\n RecurrenceEditor.prototype.renderDatePickers = function () {\n var self = this;\n this.untilDateObj = new DatePicker({\n enableRtl: this.enableRtl,\n min: this.minDate,\n max: this.maxDate,\n change: function (args) {\n if (args.value) {\n self.triggerChangeEvent();\n }\n }\n });\n this.untilDateObj.appendTo(this.element.querySelector('.' + UNTILDATE));\n };\n RecurrenceEditor.prototype.dayButtonRender = function () {\n var _this = this;\n var btns = [].slice.call(this.element.querySelectorAll('.' + DAYWRAPPER + ' button'));\n var self = this;\n for (var _i = 0, btns_1 = btns; _i < btns_1.length; _i++) {\n var btn = btns_1[_i];\n var button = new Button({ isToggle: true, enableRtl: this.enableRtl }, btn);\n this.dayButtons.push(button);\n EventHandler.add(btn, 'click', function (args) {\n var btns = [].slice.call(_this.element.querySelectorAll('.' + DAYWRAPPER + ' button.' + PRIMARY));\n var element = args.target;\n if (!element.classList.contains(PRIMARY)) {\n addClass([element], PRIMARY);\n self.triggerChangeEvent();\n }\n else if (btns.length > 1) {\n removeClass([element], PRIMARY);\n self.triggerChangeEvent();\n }\n });\n }\n };\n RecurrenceEditor.prototype.radioButtonRender = function () {\n var self = this;\n this.onMonthDay = new RadioButton({\n label: this.localeObj.getConstant(RADIOLABEL),\n enableRtl: this.enableRtl,\n name: 'monthType',\n value: 'day',\n change: function (args) {\n self.resetFormValues();\n self.triggerChangeEvent();\n }\n });\n this.onMonthDay.appendTo(this.element.querySelector('.' + MONTHEXPANDERELEMENT));\n this.monthButtons.push(this.onMonthDay);\n this.onWeekDay = new RadioButton({\n label: '',\n name: 'monthType',\n enableRtl: this.enableRtl,\n value: 'daypos',\n change: function (args) {\n self.resetFormValues();\n self.triggerChangeEvent();\n }\n });\n this.onWeekDay.appendTo(this.element.querySelector('.' + MONTHEXPANNDERELEM));\n this.monthButtons.push(this.onWeekDay);\n };\n RecurrenceEditor.prototype.numericTextboxRender = function () {\n var self = this;\n this.recurrenceCount = new NumericTextBox({\n value: 10,\n format: '#',\n enableRtl: this.enableRtl,\n floatLabelType: 'Always',\n min: 1,\n change: function (args) {\n self.triggerChangeEvent();\n }\n });\n this.recurrenceCount.appendTo(this.element.querySelector('.' + ENDONCOUNT));\n this.monthDate = new NumericTextBox({\n value: 1,\n format: '#',\n enableRtl: this.enableRtl,\n min: 1,\n max: 31,\n change: function (args) {\n self.onMonthDay.setProperties({ checked: true });\n self.triggerChangeEvent();\n }\n });\n this.monthDate.appendTo(this.element.querySelector('.' + MONTHDAYWRAPPER));\n this.repeatInterval = new NumericTextBox({\n value: 1,\n format: '#',\n min: 1,\n enableRtl: this.enableRtl,\n floatLabelType: 'Always',\n placeholder: this.localeObj.getConstant(REPEATEVERY),\n change: function (args) {\n self.triggerChangeEvent();\n }\n });\n this.repeatInterval.appendTo(this.element.querySelector('.' + REPEATINTERVAL));\n };\n RecurrenceEditor.prototype.renderComponent = function () {\n this.setTemplate();\n this.renderDropdowns();\n this.renderDatePickers();\n this.dayButtonRender();\n this.radioButtonRender();\n this.numericTextboxRender();\n };\n RecurrenceEditor.prototype.rotateArray = function (data, count) {\n var temp;\n for (var index = 0; index < count; index++) {\n temp = data.shift();\n data.push(temp);\n }\n };\n RecurrenceEditor.prototype.getEndData = function () {\n var endData = [NEVER, UNTIL, COUNT];\n var self = this;\n var dataSource = [];\n endData.forEach(function (data) {\n dataSource.push({ text: self.localeObj.getConstant(data), value: data });\n });\n return dataSource;\n };\n RecurrenceEditor.prototype.getDayPosition = function (date) {\n var temp = new Date(date.getTime());\n var endDate = new Date(date.getTime());\n var day = date.getDay();\n var positionCollection = [];\n temp = this.calendarUtil.getMonthStartDate(temp);\n endDate = this.calendarUtil.getMonthEndDate(endDate);\n while (temp < endDate) {\n if (temp.getDay() === day) {\n positionCollection.push(temp.getTime());\n }\n temp.setDate(temp.getDate() + 1);\n }\n if (positionCollection.indexOf(date.getTime()) === positionCollection.length - 1) {\n return -1;\n }\n return (positionCollection.indexOf(date.getTime()) + 1);\n };\n RecurrenceEditor.prototype.getRepeatData = function () {\n var data = [];\n var self = this;\n this.frequencies.forEach(function (element) {\n var textValue = (element === NONE) ? NEVER : element;\n data.push({ text: self.localeObj.getConstant(textValue), value: element });\n });\n return data;\n };\n RecurrenceEditor.prototype.getMonthPosData = function () {\n var monthpos = [FIRST, SECOND, THIRD, FOURTH, LAST];\n var monthposValue = {\n first: 1,\n second: 2,\n third: 3,\n fourth: 4,\n last: -1\n };\n var self = this;\n var dataSource = [];\n monthpos.forEach(function (data) {\n dataSource.push({ text: self.localeObj.getConstant(data), value: monthposValue[data] });\n });\n return dataSource;\n };\n RecurrenceEditor.prototype.getDayData = function (format) {\n var weekday = [KEYSUNDAY, KEYMONDAY, KEYTUESDAY, KEYWEDNESDAY, KEYTHURSDAY, KEYFRIDAY, KEYSATURDAY];\n var dayData = [];\n var cldrObj;\n this.rotateArray(weekday, this.firstDayOfWeek);\n if (this.locale === 'en' || this.locale === 'en-US') {\n cldrObj = (getValue('days.stand-alone.' + format, getDefaultDateObject(this.getCalendarMode())));\n }\n else {\n cldrObj = (getValue('main.' + '' + this.locale + '.dates.calendars.' + this.getCalendarMode() + '.days.stand-alone.' + format, cldrData));\n }\n for (var _i = 0, weekday_1 = weekday; _i < weekday_1.length; _i++) {\n var obj = weekday_1[_i];\n dayData.push({ text: getValue(obj, cldrObj), value: valueData[obj] });\n }\n return dayData;\n };\n RecurrenceEditor.prototype.getMonthData = function () {\n var monthData = [];\n var cldrObj;\n if (this.locale === 'en' || this.locale === 'en-US') {\n cldrObj = (getValue('months.stand-alone.wide', getDefaultDateObject(this.getCalendarMode())));\n }\n else {\n cldrObj = (getValue('main.' + '' + this.locale + '.dates.calendars.' + this.getCalendarMode() + '.months.stand-alone.wide', cldrData));\n }\n for (var _i = 0, _a = Object.keys(cldrObj); _i < _a.length; _i++) {\n var obj = _a[_i];\n monthData.push({\n text: getValue(obj, cldrObj),\n value: obj\n });\n }\n return monthData;\n };\n RecurrenceEditor.prototype.setTemplate = function () {\n var dayData = this.getDayData('narrow');\n var fullDay = this.getDayData('wide');\n this.element.innerHTML = '
';\n };\n RecurrenceEditor.prototype.getSelectedDaysData = function () {\n var ruleData = RULEBYDAY + EQUAL;\n var elements = this.element.querySelectorAll('.' + DAYWRAPPER + ' button.' + PRIMARY);\n var weekday = [RULESUNDAY, RULEMONDAY, RULETUESDAY, RULEWEDNESDAY, RULETHURSDAY, RULEFRIDAY, RULESATURDAY];\n this.rotateArray(weekday, this.firstDayOfWeek);\n for (var index = 0; index < elements.length; index++) {\n ruleData += weekday[parseInt(elements[index].getAttribute('data-index'), 10)] + (index === (elements.length - 1) ? '' : COMMA);\n }\n return ruleData + SEMICOLON;\n };\n RecurrenceEditor.prototype.getSelectedMonthData = function () {\n var ruleData;\n if (this.onWeekDay.checked) {\n ruleData = RULEBYDAY + EQUAL + this.monthWeekDays.value + SEMICOLON\n + RULESETPOS + EQUAL + this.monthWeekPos.value + SEMICOLON;\n }\n else {\n ruleData = RULEBYMONTHDAY + EQUAL + this.monthDate.value + SEMICOLON;\n }\n return ruleData;\n };\n RecurrenceEditor.prototype.getIntervalData = function () {\n return RULEINTERVAL + EQUAL + this.repeatInterval.value + SEMICOLON;\n };\n RecurrenceEditor.prototype.getEndOnCount = function () {\n return RULECOUNT + EQUAL + this.recurrenceCount.value + SEMICOLON;\n };\n RecurrenceEditor.prototype.getYearMonthRuleData = function () {\n return RULEBYMONTH + EQUAL + this.monthValue.value + SEMICOLON;\n };\n RecurrenceEditor.prototype.updateWeekButton = function (keys) {\n var weekday = [RULESUNDAY, RULEMONDAY, RULETUESDAY, RULEWEDNESDAY, RULETHURSDAY, RULEFRIDAY, RULESATURDAY];\n this.rotateArray(weekday, this.firstDayOfWeek);\n for (var _i = 0, _a = this.dayButtons; _i < _a.length; _i++) {\n var obj = _a[_i];\n var index = parseInt(obj.element.getAttribute('data-index'), 10);\n if (keys.indexOf(weekday[index]) !== -1) {\n obj.setProperties({ isPrimary: true });\n }\n else {\n obj.setProperties({ isPrimary: false });\n }\n }\n };\n RecurrenceEditor.prototype.updateMonthUI = function () {\n if (this.ruleObject.monthDay.length) {\n this.monthDate.setProperties({ value: this.ruleObject.monthDay[0] });\n this.onMonthDay.setProperties({ checked: true });\n }\n else {\n this.onWeekDay.setProperties({ checked: true });\n this.monthWeekPos.setProperties({ value: this.ruleObject.setPosition });\n for (var _i = 0, _a = Object.keys(valueData); _i < _a.length; _i++) {\n var key = _a[_i];\n if (valueData[key] === this.ruleObject.day[0]) {\n this.monthWeekDays.setProperties({ value: this.ruleObject.day[0] });\n break;\n }\n }\n }\n };\n RecurrenceEditor.prototype.updateUI = function (repeat, state) {\n this.repeatInterval.setProperties({ value: this.ruleObject.interval });\n switch (state) {\n case UNTIL:\n this.untilDateObj.setProperties({ value: this.ruleObject.until });\n break;\n case COUNT:\n this.recurrenceCount.setProperties({ value: this.ruleObject.count });\n break;\n }\n switch (repeat) {\n case WEEKLY:\n this.updateWeekButton(this.ruleObject.day);\n break;\n case YEARLY:\n this.monthValue.setProperties({ index: (this.ruleObject.month[0] - 1) });\n this.updateMonthUI();\n break;\n case MONTHLY:\n this.updateMonthUI();\n break;\n }\n };\n RecurrenceEditor.prototype.getUntilData = function () {\n if (!this.untilDateObj.value) {\n return '';\n }\n var tempStr = getRecurrenceStringFromDate(this.untilDateObj.value);\n return RULEUNTIL + EQUAL + tempStr + SEMICOLON;\n };\n RecurrenceEditor.prototype.destroyComponents = function () {\n if (!this.recurrenceCount.isDestroyed) {\n this.recurrenceCount.destroy();\n }\n if (!this.monthDate.isDestroyed) {\n this.monthDate.destroy();\n }\n if (!this.repeatInterval.isDestroyed) {\n this.repeatInterval.destroy();\n }\n if (!this.untilDateObj.isDestroyed) {\n this.untilDateObj.destroy();\n }\n if (!this.repeatType.isDestroyed) {\n this.repeatType.destroy();\n }\n if (!this.endType.isDestroyed) {\n this.endType.destroy();\n }\n if (!this.monthWeekPos.isDestroyed) {\n this.monthWeekPos.destroy();\n }\n if (!this.monthWeekDays.isDestroyed) {\n this.monthWeekDays.destroy();\n }\n if (!this.monthValue.isDestroyed) {\n this.monthValue.destroy();\n }\n this.dayButtons.forEach(function (element) {\n if (!element.isDestroyed) {\n element.destroy();\n }\n });\n this.dayButtons = [];\n this.monthButtons.forEach(function (element) {\n if (!element.isDestroyed) {\n element.destroy();\n }\n });\n this.monthButtons = [];\n };\n RecurrenceEditor.prototype.resetFields = function () {\n this.startState(NONE, NEVER, this.startDate);\n this.setDefaultValue();\n };\n RecurrenceEditor.prototype.getCalendarMode = function () {\n return this.calendarMode.toLowerCase();\n };\n RecurrenceEditor.prototype.getRuleSummary = function (rule) {\n if (rule === void 0) { rule = this.getRecurrenceRule(); }\n return generateSummary(rule, this.localeObj, this.locale, this.calendarMode);\n };\n RecurrenceEditor.prototype.getRecurrenceDates = function (startDate, rule, excludeDate, maximumCount, viewDate) {\n viewDate = isNullOrUndefined(viewDate) ? this.startDate : viewDate;\n return generate(startDate, rule, excludeDate, this.firstDayOfWeek, maximumCount, viewDate, this.calendarMode);\n };\n RecurrenceEditor.prototype.getRecurrenceRule = function () {\n var ruleData = RULEFREQ + EQUAL;\n switch (this.repeatType.value) {\n case DAILY:\n ruleData += RULEDAILY + SEMICOLON;\n break;\n case WEEKLY:\n ruleData += RULEWEEKLY + SEMICOLON + this.getSelectedDaysData();\n break;\n case MONTHLY:\n ruleData += RULEMONTHLY + SEMICOLON + this.getSelectedMonthData();\n break;\n case YEARLY:\n ruleData += RULEYEARLY + SEMICOLON + this.getSelectedMonthData() + this.getYearMonthRuleData();\n break;\n case NONE:\n return '';\n }\n ruleData += this.getIntervalData();\n switch (this.endType.value) {\n case UNTIL:\n ruleData += this.getUntilData();\n break;\n case COUNT:\n ruleData += this.getEndOnCount();\n break;\n }\n return ruleData;\n };\n RecurrenceEditor.prototype.setRecurrenceRule = function (rule, startDate) {\n if (startDate === void 0) { startDate = this.startDate; }\n if (!rule) {\n this.repeatType.setProperties({ value: NONE });\n }\n this.ruleObject = extractObjectFromRule(rule);\n var endon = this.ruleObject.count ? COUNT : (this.ruleObject.until ? UNTIL : NEVER);\n switch (this.ruleObject.freq) {\n case RULEDAILY:\n this.startState(DAILY, endon, startDate);\n this.updateUI(DAILY, endon);\n break;\n case RULEWEEKLY:\n this.startState(WEEKLY, endon, startDate);\n this.updateUI(WEEKLY, endon);\n break;\n case RULEMONTHLY:\n this.startState(MONTHLY, endon, startDate);\n this.updateUI(MONTHLY, endon);\n break;\n case RULEYEARLY:\n this.startState(YEARLY, endon, startDate);\n this.updateUI(YEARLY, endon);\n break;\n }\n };\n /**\n * Destroys the widget.\n * @returns void\n */\n RecurrenceEditor.prototype.destroy = function () {\n this.destroyComponents();\n _super.prototype.destroy.call(this);\n var removeClasses = ['e-' + this.getModuleName()];\n if (this.cssClass) {\n removeClasses = removeClasses.concat(this.cssClass.split(' '));\n }\n removeClass([this.element], removeClasses);\n this.element.innerHTML = '';\n };\n /**\n * Get component name.\n * @returns string\n * @private\n */\n RecurrenceEditor.prototype.getModuleName = function () {\n return 'recurrenceeditor';\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @returns string\n */\n RecurrenceEditor.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * Initialize the control rendering\n * @returns void\n * @private\n */\n RecurrenceEditor.prototype.render = function () {\n this.initialize();\n this.rtlClass(this.enableRtl);\n this.renderStatus = true;\n };\n /**\n * Called internally, if any of the property value changed.\n * @private\n */\n RecurrenceEditor.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'startDate':\n this.selectMonthDay(newProp.startDate);\n this.updateUntilDate(newProp.startDate);\n this.endType.setProperties({ index: 0 });\n break;\n case 'enableRtl':\n this.rtlClass(newProp.enableRtl);\n break;\n case 'cssClass':\n this.applyCustomClass(newProp.cssClass);\n break;\n case 'selectedType':\n this.repeatType.setProperties({ index: this.selectedType });\n break;\n case 'minDate':\n this.untilDateObj.setProperties({ minDate: this.minDate });\n break;\n case 'maxDate':\n this.untilDateObj.setProperties({ maxDate: this.maxDate });\n break;\n case 'value':\n if (this.getRecurrenceRule() !== this.value) {\n this.setRecurrenceRule(this.value);\n }\n break;\n case 'calendarMode':\n this.calendarMode = newProp.calendarMode;\n this.calendarUtil = getCalendarUtil(newProp.calendarMode);\n break;\n case 'locale':\n case 'frequencies':\n case 'firstDayOfWeek':\n this.refresh();\n break;\n }\n }\n };\n __decorate([\n Property(['none', 'daily', 'weekly', 'monthly', 'yearly'])\n ], RecurrenceEditor.prototype, \"frequencies\", void 0);\n __decorate([\n Property(0)\n ], RecurrenceEditor.prototype, \"firstDayOfWeek\", void 0);\n __decorate([\n Property(new Date())\n ], RecurrenceEditor.prototype, \"startDate\", void 0);\n __decorate([\n Property()\n ], RecurrenceEditor.prototype, \"dateFormat\", void 0);\n __decorate([\n Property('Gregorian')\n ], RecurrenceEditor.prototype, \"calendarMode\", void 0);\n __decorate([\n Property()\n ], RecurrenceEditor.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], RecurrenceEditor.prototype, \"enableRtl\", void 0);\n __decorate([\n Property()\n ], RecurrenceEditor.prototype, \"value\", void 0);\n __decorate([\n Property(new Date(1900, 1, 1))\n ], RecurrenceEditor.prototype, \"minDate\", void 0);\n __decorate([\n Property(new Date(2099, 12, 31))\n ], RecurrenceEditor.prototype, \"maxDate\", void 0);\n __decorate([\n Property(0)\n ], RecurrenceEditor.prototype, \"selectedType\", void 0);\n __decorate([\n Event()\n ], RecurrenceEditor.prototype, \"change\", void 0);\n RecurrenceEditor = __decorate([\n NotifyPropertyChanges\n ], RecurrenceEditor);\n return RecurrenceEditor;\n}(Component));\nexport { RecurrenceEditor };\n","import { createElement, isNullOrUndefined, addClass, remove, EventHandler, extend, append } from '@syncfusion/ej2-base';\nimport { cldrData, removeClass, getValue, getDefaultDateObject, closest } from '@syncfusion/ej2-base';\nimport { DataManager, Query } from '@syncfusion/ej2-data';\nimport { CheckBox, Button } from '@syncfusion/ej2-buttons';\nimport { Dialog } from '@syncfusion/ej2-popups';\nimport { DropDownList, MultiSelect } from '@syncfusion/ej2-dropdowns';\nimport { Input } from '@syncfusion/ej2-inputs';\nimport { DateTimePicker } from '@syncfusion/ej2-calendars';\nimport { Timezone, timezoneData } from '../timezone/timezone';\nimport { FieldValidator } from './form-validator';\nimport { RecurrenceEditor } from '../../recurrence-editor/recurrence-editor';\nimport * as cls from '../base/css-constant';\nimport * as event from '../base/constant';\nimport * as util from '../base/util';\nvar EVENT_FIELD = 'e-field';\nvar REPEAT_CONTAINER_CLASS = 'e-recurrence-container';\nvar REPEAT_BUTTON_ICON_CLASS = 'e-recurrence-edit';\nvar REPEAT_BUTTON_CLASS = 'e-recurrence-edit-button';\nvar REPEAT_DIALOG_CLASS = 'e-recurrence-dialog';\nvar HIDE_STYLE_CLASS = 'e-hide';\n/**\n * Event editor window\n */\nvar EventWindow = /** @class */ (function () {\n /**\n * Constructor for event window\n */\n function EventWindow(parent) {\n this.parent = parent;\n this.l10n = this.parent.localeObj;\n this.fields = this.parent.eventFields;\n this.fieldValidator = new FieldValidator();\n var timezone = new Timezone();\n this.localTimezoneName = timezone.getLocalTimezoneName();\n this.renderEventWindow();\n }\n EventWindow.prototype.renderEventWindow = function () {\n var dialogContent = this.getEventWindowContent();\n this.element = createElement('div', { id: this.parent.element.id + '_dialog_wrapper' });\n this.parent.element.appendChild(this.element);\n if (this.parent.isAdaptive) {\n this.dialogObject = new Dialog({\n animationSettings: { effect: 'Zoom' },\n content: dialogContent,\n cssClass: cls.EVENT_WINDOW_DIALOG_CLASS + ' ' + cls.DEVICE_CLASS,\n enableRtl: this.parent.enableRtl,\n header: ' ' + this.pdfViewer.localeObj.getConstant('File Corrupted') + '
', visible: false,\n // tslint:disable-next-line:max-line-length\n buttons: [{ buttonModel: { content: this.pdfViewer.localeObj.getConstant('OK'), isPrimary: true }, click: this.closeCorruptPopup.bind(this) }],\n target: this.pdfViewer.element, beforeClose: function () {\n _this.corruptPopup.destroy();\n _this.getElement('_corrupted_popup').remove();\n _this.corruptPopup = null;\n _this.waitingPopup = _this.getElement('_loadingIndicator');\n if (_this.waitingPopup != null) {\n hideSpinner(_this.waitingPopup);\n }\n }\n });\n if (this.pdfViewer.enableRtl) {\n // tslint:disable-next-line:max-line-length\n this.corruptPopup.content = '';\n this.corruptPopup.enableRtl = true;\n }\n else {\n // tslint:disable-next-line:max-line-length\n this.corruptPopup.content = '';\n }\n this.corruptPopup.appendTo(popupElement);\n };\n PdfViewerBase.prototype.closeCorruptPopup = function () {\n this.corruptPopup.hide();\n this.waitingPopup = this.getElement('_loadingIndicator');\n if (this.waitingPopup !== null) {\n hideSpinner(this.waitingPopup);\n }\n };\n PdfViewerBase.prototype.createPrintPopup = function () {\n var element = document.getElementById(this.pdfViewer.element.id);\n this.printMainContainer = createElement('div', {\n id: this.pdfViewer.element.id + '_printcontainer',\n className: 'e-pv-print-popup-container'\n });\n element.appendChild(this.printMainContainer);\n this.printMainContainer.style.display = 'none';\n this.printWaitingPopup = createElement('div', {\n id: this.pdfViewer.element.id + '_printLoadingIndicator',\n className: 'e-pv-print-loading-container'\n });\n this.printMainContainer.appendChild(this.printWaitingPopup);\n createSpinner({ target: this.printWaitingPopup, cssClass: 'e-spin-center' });\n this.setLoaderProperties(this.printWaitingPopup);\n };\n PdfViewerBase.prototype.createGoToPagePopup = function () {\n var _this = this;\n // tslint:disable-next-line:max-line-length\n var popupElement = createElement('div', { id: this.pdfViewer.element.id + '_goTopage_popup', className: 'e-pv-gotopage-popup' });\n this.goToPageElement = createElement('span', { id: this.pdfViewer.element.id + '_prompt' });\n this.goToPageElement.textContent = this.pdfViewer.localeObj.getConstant('Enter pagenumber');\n popupElement.appendChild(this.goToPageElement);\n var inputContainer = createElement('span', { className: 'e-pv-text-input' });\n // tslint:disable-next-line:max-line-length\n this.goToPageInput = createElement('input', { id: this.pdfViewer.element.id + '_page_input', className: 'e-input' });\n this.goToPageInput.type = 'text';\n this.goToPageInput.style.maxWidth = '80%';\n this.pageNoContainer = createElement('span', { className: '.e-pv-number-ofpages' });\n inputContainer.appendChild(this.goToPageInput);\n inputContainer.appendChild(this.pageNoContainer);\n popupElement.appendChild(inputContainer);\n this.pageContainer.appendChild(popupElement);\n this.goToPagePopup = new Dialog({\n showCloseIcon: true, closeOnEscape: false, isModal: true,\n header: this.pdfViewer.localeObj.getConstant('GoToPage'), visible: false, buttons: [\n {\n buttonModel: { content: this.pdfViewer.localeObj.getConstant('Cancel') },\n click: this.GoToPageCancelClick.bind(this),\n },\n // tslint:disable-next-line:max-line-length\n {\n buttonModel: { content: this.pdfViewer.localeObj.getConstant('Apply'), disabled: true, cssClass: 'e-pv-gotopage-apply-btn', isPrimary: true },\n click: this.GoToPageApplyClick.bind(this),\n },\n ], close: this.closeGoToPagePopUp.bind(this),\n });\n if (this.pdfViewer.enableRtl) {\n this.goToPagePopup.enableRtl = true;\n }\n this.goToPagePopup.appendTo(popupElement);\n var goToPageTextBox = new NumericTextBox({ format: '##', showSpinButton: false });\n goToPageTextBox.appendTo(this.goToPageInput);\n this.goToPageInput.addEventListener('keyup', function () {\n // tslint:disable-next-line\n var inputValue = _this.goToPageInput.value;\n if (inputValue !== '' && parseFloat(inputValue) > 0 && (_this.pdfViewer.pageCount + 1) > parseFloat(inputValue)) {\n _this.EnableApplyButton();\n }\n else {\n _this.DisableApplyButton();\n }\n });\n };\n PdfViewerBase.prototype.closeGoToPagePopUp = function () {\n this.goToPageInput.value = '';\n this.DisableApplyButton();\n };\n PdfViewerBase.prototype.EnableApplyButton = function () {\n // tslint:disable-next-line\n var popupElements = document.getElementsByClassName('e-pv-gotopage-apply-btn')[0];\n popupElements.removeAttribute('disabled');\n };\n PdfViewerBase.prototype.DisableApplyButton = function () {\n // tslint:disable-next-line\n var popupElements = document.getElementsByClassName('e-pv-gotopage-apply-btn')[0];\n popupElements.setAttribute('disabled', true);\n };\n PdfViewerBase.prototype.GoToPageCancelClick = function () {\n this.goToPagePopup.hide();\n };\n PdfViewerBase.prototype.GoToPageApplyClick = function () {\n this.goToPagePopup.hide();\n // tslint:disable-next-line\n var pageNumber = this.goToPageInput.value;\n this.pdfViewer.navigation.goToPage(pageNumber);\n this.updateMobileScrollerPosition();\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.updateMobileScrollerPosition = function () {\n if (Browser.isDevice) {\n // tslint:disable-next-line\n var ratio = (this.viewerContainer.scrollHeight - this.viewerContainer.clientHeight) / (this.viewerContainer.clientHeight - 56);\n // tslint:disable-next-line\n var differenceRatio = (this.viewerContainer.scrollTop) / ratio;\n this.mobileScrollerContainer.style.top = (this.toolbarHeight + differenceRatio) + 'px';\n }\n };\n PdfViewerBase.prototype.createPasswordPopup = function () {\n var _this = this;\n // tslint:disable-next-line:max-line-length\n var popupElement = createElement('div', { id: this.pdfViewer.element.id + '_password_popup', className: 'e-pv-password-popup', attrs: { 'tabindex': '-1' } });\n this.promptElement = createElement('span', { id: this.pdfViewer.element.id + '_prompt', attrs: { 'tabindex': '-1' } });\n this.promptElement.textContent = this.pdfViewer.localeObj.getConstant('Enter Password');\n popupElement.appendChild(this.promptElement);\n var inputContainer = createElement('span', { className: 'e-input-group e-pv-password-input' });\n // tslint:disable-next-line:max-line-length\n this.passwordInput = createElement('input', { id: this.pdfViewer.element.id + '_password_input', className: 'e-input' });\n this.passwordInput.type = 'password';\n this.passwordInput.name = 'Required';\n inputContainer.appendChild(this.passwordInput);\n popupElement.appendChild(inputContainer);\n this.pageContainer.appendChild(popupElement);\n this.passwordPopup = new Dialog({\n showCloseIcon: true, closeOnEscape: false, isModal: true,\n header: this.pdfViewer.localeObj.getConstant('Password Protected'), visible: false,\n close: this.passwordCancel.bind(this), target: this.pdfViewer.element, beforeClose: function () {\n _this.passwordPopup.destroy();\n _this.getElement('_password_popup').remove();\n _this.passwordPopup = null;\n _this.waitingPopup = _this.getElement('_loadingIndicator');\n if (_this.waitingPopup != null) {\n hideSpinner(_this.waitingPopup);\n }\n }\n });\n if (!Browser.isDevice) {\n this.passwordPopup.buttons = [\n {\n buttonModel: { content: this.pdfViewer.localeObj.getConstant('OK'), isPrimary: true },\n click: this.applyPassword.bind(this)\n },\n { buttonModel: { content: this.pdfViewer.localeObj.getConstant('Cancel') }, click: this.passwordCancelClick.bind(this) }\n ];\n }\n else {\n this.passwordPopup.buttons = [\n { buttonModel: { content: this.pdfViewer.localeObj.getConstant('Cancel') }, click: this.passwordCancelClick.bind(this) },\n {\n buttonModel: { content: this.pdfViewer.localeObj.getConstant('OK'), isPrimary: true },\n click: this.applyPassword.bind(this)\n }\n ];\n }\n if (this.pdfViewer.enableRtl) {\n this.passwordPopup.enableRtl = true;\n }\n this.passwordPopup.appendTo(popupElement);\n this.passwordInput.addEventListener('keyup', function () {\n if (_this.passwordInput.value === '') {\n _this.passwordDialogReset();\n }\n });\n this.passwordInput.addEventListener('focus', function () {\n _this.passwordInput.parentElement.classList.add('e-input-focus');\n });\n this.passwordInput.addEventListener('blur', function () {\n _this.passwordInput.parentElement.classList.remove('e-input-focus');\n });\n };\n // tslint:disable-next-line\n PdfViewerBase.prototype.passwordCancel = function (args) {\n if (args.isInteraction) {\n this.clear(false);\n this.passwordDialogReset();\n this.passwordInput.value = '';\n }\n this.waitingPopup = this.getElement('_loadingIndicator');\n if (this.waitingPopup !== null) {\n hideSpinner(this.waitingPopup);\n }\n };\n PdfViewerBase.prototype.passwordCancelClick = function () {\n this.clear(false);\n this.passwordDialogReset();\n this.passwordPopup.hide();\n this.waitingPopup = this.getElement('_loadingIndicator');\n if (this.waitingPopup !== null) {\n hideSpinner(this.waitingPopup);\n }\n };\n PdfViewerBase.prototype.passwordDialogReset = function () {\n if (this.promptElement) {\n this.promptElement.classList.remove('e-pv-password-error');\n this.promptElement.textContent = this.pdfViewer.localeObj.getConstant('Enter Password');\n this.passwordInput.value = '';\n }\n };\n PdfViewerBase.prototype.applyPassword = function () {\n var password = this.passwordInput.value;\n if (password !== '') {\n this.pdfViewer.load(this.document, password);\n }\n this.focusViewerContainer();\n };\n PdfViewerBase.prototype.wireEvents = function () {\n this.viewerContainer.addEventListener('scroll', this.viewerContainerOnScroll, true);\n if (Browser.isDevice) {\n this.viewerContainer.addEventListener('touchmove', this.viewerContainerOnScroll, true);\n }\n this.viewerContainer.addEventListener('mousedown', this.viewerContainerOnMousedown);\n this.viewerContainer.addEventListener('mouseup', this.viewerContainerOnMouseup);\n this.viewerContainer.addEventListener('wheel', this.viewerContainerOnMouseWheel);\n this.viewerContainer.addEventListener('mousemove', this.viewerContainerOnMousemove);\n this.viewerContainer.addEventListener('mouseleave', this.viewerContainerOnMouseLeave);\n this.viewerContainer.addEventListener('mouseenter', this.viewerContainerOnMouseEnter);\n this.viewerContainer.addEventListener('mouseover', this.viewerContainerOnMouseOver);\n this.viewerContainer.addEventListener('click', this.viewerContainerOnClick);\n this.viewerContainer.addEventListener('dblclick', this.viewerContainerOnClick);\n this.viewerContainer.addEventListener('dragstart', this.viewerContainerOnDragStart);\n this.pdfViewer.element.addEventListener('keydown', this.viewerContainerOnKeyDown);\n window.addEventListener('mouseup', this.onWindowMouseUp);\n window.addEventListener('touchend', this.onWindowTouchEnd);\n window.addEventListener('unload', this.unloadDocument);\n window.addEventListener('resize', this.onWindowResize);\n // tslint:disable-next-line:max-line-length\n if (navigator.userAgent.indexOf('MSIE') !== -1 || navigator.userAgent.indexOf('Edge') !== -1 || navigator.userAgent.indexOf('Trident') !== -1) {\n this.viewerContainer.addEventListener('pointerdown', this.viewerContainerOnPointerDown);\n this.viewerContainer.addEventListener('pointermove', this.viewerContainerOnPointerMove);\n this.viewerContainer.addEventListener('pointerup', this.viewerContainerOnPointerEnd);\n this.viewerContainer.addEventListener('pointerleave', this.viewerContainerOnPointerEnd);\n }\n else {\n this.viewerContainer.addEventListener('touchstart', this.viewerContainerOnTouchStart);\n this.viewerContainer.addEventListener('touchmove', this.viewerContainerOnTouchMove);\n this.viewerContainer.addEventListener('touchend', this.viewerContainerOnTouchEnd);\n this.viewerContainer.addEventListener('touchleave', this.viewerContainerOnTouchEnd);\n this.viewerContainer.addEventListener('touchcancel', this.viewerContainerOnTouchEnd);\n }\n };\n PdfViewerBase.prototype.unWireEvents = function () {\n this.viewerContainer.removeEventListener('scroll', this.viewerContainerOnScroll, true);\n if (Browser.isDevice) {\n this.viewerContainer.removeEventListener('touchmove', this.viewerContainerOnScroll, true);\n }\n this.viewerContainer.removeEventListener('mousedown', this.viewerContainerOnMousedown);\n this.viewerContainer.removeEventListener('mouseup', this.viewerContainerOnMouseup);\n this.viewerContainer.removeEventListener('wheel', this.viewerContainerOnMouseWheel);\n this.viewerContainer.removeEventListener('mousemove', this.viewerContainerOnMousemove);\n this.viewerContainer.removeEventListener('mouseleave', this.viewerContainerOnMouseLeave);\n this.viewerContainer.removeEventListener('mouseenter', this.viewerContainerOnMouseEnter);\n this.viewerContainer.removeEventListener('mouseover', this.viewerContainerOnMouseOver);\n this.viewerContainer.removeEventListener('click', this.viewerContainerOnClick);\n this.viewerContainer.removeEventListener('dragstart', this.viewerContainerOnDragStart);\n this.viewerContainer.removeEventListener('contextmenu', this.viewerContainerOnContextMenuClick);\n this.pdfViewer.element.removeEventListener('keydown', this.viewerContainerOnKeyDown);\n window.removeEventListener('mouseup', this.onWindowMouseUp);\n window.removeEventListener('unload', this.unloadDocument);\n window.removeEventListener('resize', this.onWindowResize);\n // tslint:disable-next-line:max-line-length\n if (navigator.userAgent.indexOf('MSIE') !== -1 || navigator.userAgent.indexOf('Edge') !== -1 || navigator.userAgent.indexOf('Trident') !== -1) {\n this.viewerContainer.removeEventListener('pointerdown', this.viewerContainerOnPointerDown);\n this.viewerContainer.removeEventListener('pointermove', this.viewerContainerOnPointerMove);\n this.viewerContainer.removeEventListener('pointerup', this.viewerContainerOnPointerEnd);\n this.viewerContainer.removeEventListener('pointerleave', this.viewerContainerOnPointerEnd);\n }\n else {\n this.viewerContainer.removeEventListener('touchstart', this.viewerContainerOnTouchStart);\n this.viewerContainer.removeEventListener('touchmove', this.viewerContainerOnTouchMove);\n this.viewerContainer.removeEventListener('touchend', this.viewerContainerOnTouchEnd);\n this.viewerContainer.removeEventListener('touchleave', this.viewerContainerOnTouchEnd);\n this.viewerContainer.removeEventListener('touchcancel', this.viewerContainerOnTouchEnd);\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.updateZoomValue = function () {\n if (this.pdfViewer.magnificationModule) {\n if (this.pdfViewer.magnificationModule.isAutoZoom) {\n this.pdfViewer.magnificationModule.fitToAuto();\n }\n else if (this.pdfViewer.magnificationModule.fitType === 'fitToWidth') {\n this.pdfViewer.magnificationModule.fitToWidth();\n }\n }\n for (var i = 0; i < this.pageCount; i++) {\n this.applyLeftPosition(i);\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.initiatePanning = function () {\n this.isPanMode = true;\n this.textLayer.modifyTextCursor(false);\n this.disableTextSelectionMode();\n this.enableAnnotationAddTools(false);\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.initiateTextSelectMode = function () {\n this.isPanMode = false;\n this.viewerContainer.style.cursor = 'auto';\n if (this.pdfViewer.textSelectionModule) {\n this.textLayer.modifyTextCursor(true);\n this.pdfViewer.textSelectionModule.enableTextSelectionMode();\n }\n if (!Browser.isDevice) {\n this.enableAnnotationAddTools(true);\n }\n };\n PdfViewerBase.prototype.enableAnnotationAddTools = function (isEnable) {\n if (this.pdfViewer.toolbarModule) {\n if (this.pdfViewer.toolbarModule.annotationToolbarModule) {\n this.pdfViewer.toolbarModule.annotationToolbarModule.enableAnnotationAddTools(isEnable);\n }\n }\n };\n PdfViewerBase.prototype.applySelection = function () {\n if (window.getSelection().anchorNode !== null) {\n this.pdfViewer.textSelectionModule.applySpanForSelection();\n }\n this.isViewerContainerDoubleClick = false;\n };\n PdfViewerBase.prototype.handleTaps = function (touchPoints) {\n var _this = this;\n this.singleTapTimer = setTimeout(function () { _this.onSingleTap(touchPoints); }, 300);\n this.tapCount++;\n // tslint:disable-next-line\n var timer = setTimeout(function () { _this.onDoubleTap(touchPoints); }, 200);\n if (this.tapCount > 2) {\n this.tapCount = 0;\n }\n };\n PdfViewerBase.prototype.onSingleTap = function (touches) {\n if (!this.isLongTouchPropagated && !this.navigationPane.isNavigationToolbarVisible) {\n if (this.pdfViewer.toolbarModule) {\n if ((this.touchClientX >= touches[0].clientX - 10) && (this.touchClientX <= touches[0].clientX + 10) &&\n (this.touchClientY >= touches[0].clientY - 10) && (this.touchClientY <= touches[0].clientY + 10)) {\n if (!this.isTapHidden) {\n this.viewerContainer.scrollTop -= this.getElement('_toolbarContainer').clientHeight * this.getZoomFactor();\n this.viewerContainer.style.height = this.updatePageHeight(this.pdfViewer.element.getBoundingClientRect().height, 0);\n if (this.pdfViewer.toolbar.moreDropDown) {\n var dropDown = this.getElement('_more_option-popup');\n if (dropDown.firstElementChild) {\n dropDown.classList.remove('e-popup-open');\n dropDown.classList.add('e-popup-close');\n dropDown.removeChild(dropDown.firstElementChild);\n }\n }\n }\n else {\n this.viewerContainer.scrollTop += this.getElement('_toolbarContainer').clientHeight * this.getZoomFactor();\n // tslint:disable-next-line:max-line-length\n this.viewerContainer.style.height = this.updatePageHeight(this.pdfViewer.element.getBoundingClientRect().height, 56);\n }\n if (this.isTapHidden && Browser.isDevice) {\n this.mobileScrollerContainer.style.display = '';\n this.updateMobileScrollerPosition();\n }\n else if (Browser.isDevice && this.getSelectTextMarkupCurrentPage() == null) {\n this.mobileScrollerContainer.style.display = 'none';\n }\n if (this.getSelectTextMarkupCurrentPage() == null) {\n this.pdfViewer.toolbarModule.showToolbar(this.isTapHidden);\n this.isTapHidden = !this.isTapHidden;\n }\n }\n this.tapCount = 0;\n }\n }\n };\n PdfViewerBase.prototype.onDoubleTap = function (touches) {\n if (this.tapCount === 2) {\n if (Browser.isDevice) {\n this.mobileScrollerContainer.style.display = 'none';\n }\n this.tapCount = 0;\n if ((this.touchClientX >= touches[0].clientX - 10) && (this.touchClientX <= touches[0].clientX + 10) &&\n (this.touchClientY >= touches[0].clientY - 10) && (this.touchClientY <= touches[0].clientY + 10)) {\n if (this.pdfViewer.magnification) {\n this.pdfViewer.magnification.onDoubleTapMagnification();\n }\n this.viewerContainer.style.height = this.updatePageHeight(this.pdfViewer.element.getBoundingClientRect().height, 0);\n this.isTapHidden = false;\n clearTimeout(this.singleTapTimer);\n }\n }\n };\n PdfViewerBase.prototype.preventTouchEvent = function (event) {\n if (this.pdfViewer.textSelectionModule) {\n // tslint:disable-next-line:max-line-length\n if (!this.isPanMode && this.pdfViewer.enableTextSelection && !this.isTextSelectionDisabled && this.getSelectTextMarkupCurrentPage() == null) {\n event.preventDefault();\n event.stopPropagation();\n }\n }\n };\n // tslint:disable-next-line\n PdfViewerBase.prototype.initPageDiv = function (pageValues) {\n if (this.pdfViewer.toolbarModule) {\n this.pdfViewer.toolbarModule.updateTotalPage();\n if (Browser.isDevice && this.mobiletotalPageContainer) {\n this.mobiletotalPageContainer.innerHTML = this.pageCount.toString();\n this.pageNoContainer.innerHTML = '(1-' + this.pageCount.toString() + ')';\n }\n }\n if (this.pageCount > 0) {\n var topValue = 0;\n var pageLimit = 0;\n if (this.pageCount > 100) {\n // to render 100 pages intially.\n pageLimit = 100;\n this.pageLimit = pageLimit;\n }\n else {\n pageLimit = this.pageCount;\n }\n for (var i = 0; i < pageLimit; i++) {\n var pageSize = pageValues.pageSizes[i].split(',');\n if (pageValues.pageSizes[i - 1] !== null && i !== 0) {\n var previousPageHeight = pageValues.pageSizes[i - 1].split(',');\n topValue = this.pageGap + parseFloat(previousPageHeight[1]) + topValue;\n }\n else {\n topValue = this.pageGap;\n }\n var size = { width: parseFloat(pageSize[0]), height: parseFloat(pageSize[1]), top: topValue };\n this.pageSize.push(size);\n }\n var limit = this.pageCount < 10 ? this.pageCount : 10;\n for (var i = 0; i < limit; i++) {\n this.renderPageContainer(i, this.getPageWidth(i), this.getPageHeight(i), this.getPageTop(i));\n }\n // tslint:disable-next-line:max-line-length\n this.pageContainer.style.height = this.getPageTop(this.pageSize.length - 1) + this.getPageHeight(this.pageSize.length - 1) + 'px';\n this.pageContainer.style.position = 'relative';\n if (this.pageLimit === 100) {\n var pageDiv = this.getElement('_pageDiv_' + this.pageLimit);\n if (pageDiv === null && this.pageLimit < this.pageCount) {\n Promise.all([this.renderPagesVirtually()]);\n }\n }\n }\n };\n PdfViewerBase.prototype.renderElementsVirtualScroll = function (pageNumber) {\n var pageValue = pageNumber + 1;\n if (pageValue > this.pageCount) {\n pageValue = this.pageCount;\n }\n for (var i = pageNumber - 1; i <= pageValue; i++) {\n if (i !== -1) {\n this.renderPageElement(i);\n }\n }\n var lowerPageValue = pageNumber - 3;\n if (lowerPageValue < 0) {\n lowerPageValue = 0;\n }\n for (var i = pageNumber - 1; i >= lowerPageValue; i--) {\n if (i !== -1) {\n this.renderPageElement(i);\n }\n }\n for (var j = 0; j < this.pageCount; j++) {\n if (!((lowerPageValue <= j) && (j <= pageValue))) {\n var pageDiv = this.getElement('_pageDiv_' + j);\n var pageCanvas = this.getElement('_pageCanvas_' + j);\n var textLayer = this.getElement('_textLayer_' + j);\n if (pageCanvas) {\n pageCanvas.parentNode.removeChild(pageCanvas);\n if (textLayer) {\n if (this.pdfViewer.textSelectionModule && textLayer.childNodes.length !== 0 && !this.isTextSelectionDisabled) {\n this.pdfViewer.textSelectionModule.maintainSelectionOnScroll(j, true);\n }\n textLayer.parentNode.removeChild(textLayer);\n }\n var indexInArray = this.renderedPagesList.indexOf(j);\n if (indexInArray !== -1) {\n this.renderedPagesList.splice(indexInArray, 1);\n }\n }\n if (pageDiv) {\n pageDiv.parentNode.removeChild(pageDiv);\n var indexInArray = this.renderedPagesList.indexOf(j);\n if (indexInArray !== -1) {\n this.renderedPagesList.splice(indexInArray, 1);\n }\n }\n }\n }\n };\n PdfViewerBase.prototype.renderPageElement = function (i) {\n var pageDiv = this.getElement('_pageDiv_' + i);\n var canvas = this.getElement('_pageCanvas_' + i);\n if (canvas == null && pageDiv == null && i < this.pageSize.length) {\n // tslint:disable-next-line\n this.renderPageContainer(i, this.getPageWidth(i), this.getPageHeight(i), this.getPageTop(i));\n }\n };\n PdfViewerBase.prototype.renderPagesVirtually = function () {\n return __awaiter(this, void 0, void 0, function () {\n var proxy;\n var _this = this;\n return __generator(this, function (_a) {\n proxy = this;\n setTimeout(function () { _this.initiateRenderPagesVirtually(proxy); }, 500);\n return [2 /*return*/];\n });\n });\n };\n // tslint:disable-next-line\n PdfViewerBase.prototype.initiateRenderPagesVirtually = function (proxy) {\n var _this = this;\n var jsonObject = { hashId: proxy.hashId, isCompletePageSizeNotReceived: true };\n var request = new XMLHttpRequest();\n request.open('POST', proxy.pdfViewer.serviceUrl + '/' + proxy.pdfViewer.serverActionSettings.load);\n request.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');\n request.responseType = 'json';\n request.send(JSON.stringify(jsonObject));\n // tslint:disable-next-line\n request.onreadystatechange = function (event) {\n if (request.readyState === 4 && request.status === 200) {\n // tslint:disable-next-line\n var data = event.currentTarget.response;\n if (typeof data !== 'object') {\n data = JSON.parse(data);\n }\n if (data) {\n // tslint:disable-next-line\n var pageValues = data;\n var topValue = proxy.pageSize[proxy.pageLimit - 1].top;\n for (var i = proxy.pageLimit; i < proxy.pageCount; i++) {\n var pageSize = pageValues.pageSizes[i].split(',');\n if (proxy.pageSize[i - 1] !== null && i !== 0) {\n var previousPageHeight = proxy.pageSize[i - 1].height;\n topValue = _this.pageGap + parseFloat(previousPageHeight) + topValue;\n }\n var size = { width: parseFloat(pageSize[0]), height: parseFloat(pageSize[1]), top: topValue };\n _this.pageSize.push(size);\n }\n // tslint:disable-next-line:max-line-length\n _this.pageContainer.style.height = _this.getPageTop(_this.pageSize.length - 1) + _this.getPageHeight(_this.pageSize.length - 1) + 'px';\n }\n }\n else if (request.readyState === 4 && request.status === 400) {\n // error\n _this.pdfViewer.fireAjaxRequestFailed(request.status, request.statusText); // jshint ignore:line\n }\n };\n // tslint:disable-next-line\n request.onerror = function (event) {\n _this.openNotificationPopup();\n _this.pdfViewer.fireAjaxRequestFailed(request.status, request.statusText);\n };\n };\n // tslint:disable-next-line\n PdfViewerBase.prototype.renderPage = function (data, pageIndex) {\n var _this = this;\n if (data) {\n var pageWidth_1 = this.getPageWidth(pageIndex);\n var pageHeight_1 = this.getPageHeight(pageIndex);\n // tslint:disable-next-line:max-line-length\n var canvas_1 = this.getElement('_pageCanvas_' + pageIndex);\n var pageDiv = this.getElement('_pageDiv_' + pageIndex);\n if (pageDiv) {\n pageDiv.style.width = pageWidth_1 + 'px';\n pageDiv.style.height = pageHeight_1 + 'px';\n pageDiv.style.top = this.getPageTop(pageIndex) + 'px';\n if (this.pdfViewer.enableRtl) {\n pageDiv.style.right = this.updateLeftPosition(pageIndex) + 'px';\n }\n else {\n pageDiv.style.left = this.updateLeftPosition(pageIndex) + 'px';\n }\n }\n if (canvas_1) {\n canvas_1.style.width = pageWidth_1 + 'px';\n canvas_1.style.height = pageHeight_1 + 'px';\n var context_1 = canvas_1.getContext('2d');\n // tslint:disable-next-line\n var imageData = data['image'];\n // tslint:disable-next-line\n var matrix_1 = data['transformationMatrix'];\n if (imageData) {\n var image_1 = new Image();\n image_1.onload = function () {\n // tslint:disable-next-line\n if (parseInt((pageWidth_1 * 1.5).toString()) === image_1.width) {\n if (!isNaN(parseFloat(canvas_1.style.width))) {\n canvas_1.style.width = pageWidth_1 + 'px';\n canvas_1.style.height = pageHeight_1 + 'px';\n canvas_1.height = pageHeight_1 * window.devicePixelRatio;\n canvas_1.width = pageWidth_1 * window.devicePixelRatio;\n }\n // tslint:disable-next-line\n context_1.setTransform(matrix_1.Elements[0], matrix_1.Elements[1], matrix_1.Elements[2], matrix_1.Elements[3], matrix_1.Elements[4], matrix_1.Elements[5]);\n context_1.drawImage(image_1, 0, 0, canvas_1.width, canvas_1.height);\n _this.showPageLoadingIndicator(pageIndex, false);\n if (pageIndex === 0 && _this.isDocumentLoaded) {\n _this.pdfViewer.fireDocumentLoad();\n _this.isDocumentLoaded = false;\n }\n if (_this.pdfViewer.magnificationModule) {\n _this.pdfViewer.magnificationModule.rerenderCountIncrement();\n }\n }\n };\n image_1.src = imageData;\n if (this.pdfViewer.magnificationModule) {\n this.pdfViewer.magnificationModule.pushImageObjects(image_1);\n }\n }\n var aElement = pageDiv.getElementsByTagName('a');\n if (aElement.length !== 0) {\n for (var index = aElement.length - 1; index >= 0; index--) {\n aElement[index].parentNode.removeChild(aElement[index]);\n }\n }\n this.renderTextContent(data, pageIndex);\n if (this.pdfViewer.enableHyperlink && this.pdfViewer.linkAnnotationModule) {\n this.pdfViewer.linkAnnotationModule.renderHyperlinkContent(data, pageIndex);\n }\n if (this.pdfViewer.textSelectionModule && !this.isTextSelectionDisabled) {\n this.pdfViewer.textSelectionModule.applySelectionRangeOnScroll(pageIndex);\n }\n if (this.isTextMarkupAnnotationModule()) {\n // tslint:disable-next-line\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.renderTextMarkupAnnotationsInPage(data['textMarkupAnnotation'], pageIndex);\n }\n if (this.pdfViewer.textSearchModule) {\n if (this.pdfViewer.textSearchModule.isTextSearch) {\n this.pdfViewer.textSearchModule.highlightOtherOccurrences(pageIndex);\n }\n }\n }\n }\n };\n // tslint:disable-next-line\n PdfViewerBase.prototype.renderTextContent = function (data, pageIndex) {\n // tslint:disable-next-line\n var texts = data['textContent'];\n // tslint:disable-next-line\n var bounds = data['textBounds'];\n // tslint:disable-next-line\n var rotation = data['rotation'];\n var textLayer = this.getElement('_textLayer_' + pageIndex);\n if (!textLayer) {\n // tslint:disable-next-line:max-line-length\n textLayer = this.textLayer.addTextLayer(pageIndex, this.getPageWidth(pageIndex), this.getPageHeight(pageIndex), this.getElement('_pageDiv_' + pageIndex));\n }\n if (textLayer) {\n if (textLayer.childNodes.length === 0) {\n this.textLayer.renderTextContents(pageIndex, texts, bounds, rotation);\n }\n else {\n this.textLayer.resizeTextContents(pageIndex, texts, bounds, rotation);\n }\n }\n };\n PdfViewerBase.prototype.renderPageContainer = function (pageNumber, pageWidth, pageHeight, topValue) {\n // tslint:disable-next-line:max-line-length\n var pageDiv = createElement('div', { id: this.pdfViewer.element.id + '_pageDiv_' + pageNumber, className: 'e-pv-page-div', attrs: { 'tabindex': '0' } });\n pageDiv.style.width = pageWidth + 'px';\n pageDiv.style.height = pageHeight + 'px';\n if (this.pdfViewer.enableRtl) {\n pageDiv.style.right = this.updateLeftPosition(pageNumber) + 'px';\n }\n else {\n pageDiv.style.left = this.updateLeftPosition(pageNumber) + 'px';\n }\n pageDiv.style.top = topValue + 'px';\n this.pageContainer.appendChild(pageDiv);\n this.pageContainer.style.width = this.viewerContainer.clientWidth + 'px';\n this.createWaitingPopup(pageNumber);\n this.orderPageDivElements(pageDiv, pageNumber);\n this.renderPageCanvas(pageDiv, pageWidth, pageHeight, pageNumber, 'block');\n };\n PdfViewerBase.prototype.orderPageDivElements = function (pageDiv, pageIndex) {\n var nextElement = this.getElement('_pageDiv_' + (pageIndex + 1));\n if (nextElement) {\n this.pageContainer.insertBefore(pageDiv, nextElement);\n }\n else {\n this.pageContainer.appendChild(pageDiv);\n }\n };\n /**\n * @private\n */\n // tslint:disable-next-line:max-line-length\n PdfViewerBase.prototype.renderPageCanvas = function (pageDiv, pageWidth, pageHeight, pageNumber, displayMode) {\n var pageCanvas = createElement('canvas', { id: this.pdfViewer.element.id + '_pageCanvas_' + pageNumber, className: 'e-pv-page-canvas' });\n pageCanvas.width = pageWidth;\n pageCanvas.height = pageHeight;\n pageCanvas.style.display = displayMode;\n pageDiv.appendChild(pageCanvas);\n this.textLayer.addTextLayer(pageNumber, pageWidth, pageHeight, pageDiv);\n if (this.isTextMarkupAnnotationModule()) {\n // tslint:disable-next-line:max-line-length\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.createAnnotationLayer(pageDiv, pageWidth, pageHeight, pageNumber, displayMode);\n }\n return pageCanvas;\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.updateLeftPosition = function (pageIndex) {\n var leftPosition;\n // tslint:disable-next-line:max-line-length\n leftPosition = (this.viewerContainer.getBoundingClientRect().width - this.getPageWidth(pageIndex)) / 2;\n // tslint:disable-next-line:max-line-length\n if (leftPosition < 0 || (this.pdfViewer.magnificationModule ? ((this.pdfViewer.magnificationModule.isAutoZoom && this.getZoomFactor() < 1) || this.pdfViewer.magnificationModule.fitType === 'fitToWidth') : false)) {\n leftPosition = this.pageLeft;\n }\n return leftPosition;\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.applyLeftPosition = function (pageIndex) {\n var leftPosition;\n if (this.pageSize[pageIndex]) {\n // tslint:disable-next-line:max-line-length\n leftPosition = (this.viewerContainer.getBoundingClientRect().width - this.pageSize[pageIndex].width * this.getZoomFactor()) / 2;\n // tslint:disable-next-line:max-line-length\n if (leftPosition < 0 || (this.pdfViewer.magnificationModule ? ((this.pdfViewer.magnificationModule.isAutoZoom && this.getZoomFactor() < 1) || this.pdfViewer.magnificationModule.fitType === 'fitToWidth') : false)) {\n leftPosition = this.pageLeft;\n }\n // tslint:disable-next-line:max-line-length\n var pageDiv = document.getElementById(this.pdfViewer.element.id + '_pageDiv_' + pageIndex);\n if (pageDiv) {\n if (!this.pdfViewer.enableRtl) {\n pageDiv.style.left = leftPosition + 'px';\n }\n else {\n pageDiv.style.right = leftPosition + 'px';\n }\n }\n }\n };\n PdfViewerBase.prototype.updatePageHeight = function (viewerHeight, toolbarHeight) {\n return ((viewerHeight - toolbarHeight) / viewerHeight) * 100 + '%';\n };\n PdfViewerBase.prototype.initiatePageViewScrollChanged = function () {\n if ((this.scrollPosition * this.getZoomFactor()) !== this.viewerContainer.scrollTop) {\n this.scrollPosition = this.viewerContainer.scrollTop;\n this.pageViewScrollChanged(this.currentPageNumber);\n }\n };\n PdfViewerBase.prototype.renderCountIncrement = function () {\n if (this.pdfViewer.magnificationModule) {\n this.pdfViewer.magnificationModule.renderCountIncrement();\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.pageViewScrollChanged = function (currentPageNumber) {\n this.reRenderedCount = 0;\n var currentPageIndex = currentPageNumber - 1;\n if (currentPageNumber !== this.previousPage && currentPageNumber <= this.pageCount) {\n if (this.renderedPagesList.indexOf(currentPageIndex) === -1 && !this.getMagnified()) {\n this.createRequestForRender(currentPageIndex);\n this.renderCountIncrement();\n }\n }\n if (!(this.getMagnified() || this.getPagesPinchZoomed())) {\n var previous = currentPageIndex - 1;\n var canvas = this.getElement('_pageCanvas_' + previous);\n if (canvas !== null) {\n if (this.renderedPagesList.indexOf(previous) === -1 && !this.getMagnified()) {\n this.createRequestForRender(previous);\n this.renderCountIncrement();\n }\n }\n var next = currentPageIndex + 1;\n if (next < this.pageCount) {\n if (this.renderedPagesList.indexOf(next) === -1 && !this.getMagnified()) {\n this.createRequestForRender(next);\n var pageHeight = this.getPageHeight(next);\n this.renderCountIncrement();\n while (this.viewerContainer.clientHeight > pageHeight) {\n next = next + 1;\n if (next < this.pageCount) {\n this.renderPageElement(next);\n this.createRequestForRender(next);\n pageHeight += this.getPageHeight(next);\n this.renderCountIncrement();\n }\n else {\n break;\n }\n }\n }\n }\n }\n };\n PdfViewerBase.prototype.downloadDocument = function (blobUrl) {\n blobUrl = URL.createObjectURL(blobUrl);\n var anchorElement = createElement('a');\n if (anchorElement.click) {\n anchorElement.href = blobUrl;\n anchorElement.target = '_parent';\n if ('download' in anchorElement) {\n anchorElement.download = this.pdfViewer.fileName;\n }\n (document.body || document.documentElement).appendChild(anchorElement);\n anchorElement.click();\n anchorElement.parentNode.removeChild(anchorElement);\n }\n else {\n if (window.top === window &&\n blobUrl.split('#')[0] === window.location.href.split('#')[0]) {\n var padCharacter = blobUrl.indexOf('?') === -1 ? '?' : '&';\n blobUrl = blobUrl.replace(/#|$/, padCharacter + '$&');\n }\n window.open(blobUrl, '_parent');\n }\n };\n PdfViewerBase.prototype.createRequestForDownload = function () {\n var _this = this;\n var jsonObject;\n if (this.isTextMarkupAnnotationModule()) {\n // tslint:disable-next-line:max-line-length\n var textMarkupAnnotationCollection = this.pdfViewer.annotationModule.textMarkupAnnotationModule.saveTextMarkupAnnotations();\n jsonObject = { hashId: this.hashId, textMarkupAnnotations: textMarkupAnnotationCollection };\n }\n else {\n jsonObject = { hashId: this.hashId };\n }\n var request = new XMLHttpRequest();\n request.open('POST', this.pdfViewer.serviceUrl + '/' + this.pdfViewer.serverActionSettings.download);\n request.setRequestHeader('Content-Type', 'application/json;charset=UTF-8'); // jshint ignore:line\n request.responseType = 'text';\n request.send(JSON.stringify(jsonObject));\n // tslint:disable-next-line\n request.onreadystatechange = function (event) {\n if (request.readyState === 4 && request.status === 200) { // jshint ignore:line\n // tslint:disable-next-line\n var data = event.currentTarget.response;\n // tslint:disable-next-line:max-line-length\n if (typeof data === 'object') {\n data = JSON.parse(data);\n }\n if (data) {\n var blobUrl = _this.createBlobUrl(data.split('base64,')[1], 'application/pdf');\n if (Browser.isIE || Browser.info.name === 'edge') {\n window.navigator.msSaveOrOpenBlob(blobUrl, _this.pdfViewer.fileName);\n }\n else {\n _this.downloadDocument(blobUrl);\n }\n }\n }\n else if (request.readyState === 4 && request.status === 400) {\n // error\n _this.pdfViewer.fireAjaxRequestFailed(request.status, request.statusText);\n }\n };\n // tslint:disable-next-line\n request.onerror = function (event) {\n _this.openNotificationPopup();\n _this.pdfViewer.fireAjaxRequestFailed(request.status, request.statusText);\n };\n };\n PdfViewerBase.prototype.createRequestForRender = function (pageIndex) {\n var _this = this;\n var canvas = this.getElement('_pageCanvas_' + pageIndex);\n var oldCanvas = this.getElement('_oldCanvas_' + pageIndex);\n if (!this.getPagesZoomed()) {\n this.showPageLoadingIndicator(pageIndex, true);\n }\n else {\n this.showPageLoadingIndicator(pageIndex, false);\n }\n if (canvas) {\n if (!isNaN(parseFloat(canvas.style.width)) || oldCanvas) {\n this.showPageLoadingIndicator(pageIndex, false);\n }\n // tslint:disable-next-line\n var data = this.getStoredData(pageIndex);\n if (data) {\n this.renderPage(data, pageIndex);\n }\n else {\n var noTileX = 1;\n var noTileY = 1;\n for (var x = 0; x < noTileX; x++) {\n var _loop_1 = function (y) {\n var jsonObject = void 0;\n // tslint:disable-next-line:max-line-length\n jsonObject = { xCoordinate: x, yCoordinate: y, pageNumber: pageIndex, documentId: this_1.documentId, hashId: this_1.hashId, zoomFactor: this_1.getZoomFactor() };\n var request = new XMLHttpRequest();\n request.open('POST', this_1.pdfViewer.serviceUrl + '/' + this_1.pdfViewer.serverActionSettings.renderPages);\n request.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');\n request.responseType = 'json';\n request.send(JSON.stringify(jsonObject));\n // tslint:disable-next-line\n request.onreadystatechange = function (event) {\n var proxy = _this;\n if (request.readyState === 4 && request.status === 200) {\n // tslint:disable-next-line\n var data_1 = event.currentTarget.response;\n // tslint:disable-next-line:max-line-length\n if (typeof data_1 !== 'object') {\n data_1 = JSON.parse(data_1);\n }\n if (data_1) {\n if (data_1.image) {\n proxy.storeWinData(data_1, pageIndex);\n proxy.renderPage(data_1, pageIndex);\n }\n }\n }\n else if (request.readyState === 4 && request.status === 400) {\n // error\n _this.pdfViewer.fireAjaxRequestFailed(request.status, request.statusText);\n }\n };\n // tslint:disable-next-line\n request.onerror = function (event) {\n _this.openNotificationPopup();\n _this.pdfViewer.fireAjaxRequestFailed(request.status, request.statusText);\n };\n };\n var this_1 = this;\n for (var y = 0; y < noTileY; y++) {\n _loop_1(y);\n }\n }\n }\n this.renderedPagesList.push(pageIndex);\n }\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n PdfViewerBase.prototype.getStoredData = function (pageIndex) {\n // tslint:disable-next-line\n var storedData = this.getWindowSessionStorage(pageIndex) ? this.getWindowSessionStorage(pageIndex) : this.getPinchZoomPage(pageIndex);\n // tslint:disable-next-line\n var data = null;\n if (storedData) {\n // tslint:disable-next-line\n data = storedData;\n if (!this.isPinchZoomStorage) {\n data = JSON.parse(storedData);\n }\n this.isPinchZoomStorage = false;\n }\n return data;\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n PdfViewerBase.prototype.storeWinData = function (data, pageIndex) {\n // tslint:disable-next-line\n var blobObj = this.createBlobUrl(data['image'].split('base64,')[1], 'image/png');\n var blobUrl = URL.createObjectURL(blobObj);\n // tslint:disable-next-line\n var storeObject = {\n // tslint:disable-next-line\n image: blobUrl, transformationMatrix: data['transformationMatrix'], hyperlinks: data['hyperlinks'], hyperlinkBounds: data['hyperlinkBounds'], linkAnnotation: data['linkAnnotation'], linkPage: data['linkPage'], annotationLocation: data['annotationLocation'],\n // tslint:disable-next-line\n textContent: data['textContent'], textBounds: data['textBounds'], pageText: data['pageText'], rotation: data['rotation']\n };\n // tslint:disable-next-line:max-line-length\n if (this.pdfViewer.magnificationModule ? this.pdfViewer.magnificationModule.checkZoomFactor() : true) {\n this.manageSessionStorage(pageIndex, storeObject);\n }\n else {\n this.pinchZoomStorage.push({ index: pageIndex, pinchZoomStorage: storeObject });\n }\n };\n PdfViewerBase.prototype.getPinchZoomPage = function (pageIndex) {\n // tslint:disable-next-line\n for (var key in this.pinchZoomStorage) {\n if (this.pinchZoomStorage.hasOwnProperty(key)) {\n if (this.pinchZoomStorage[key].index === pageIndex) {\n this.isPinchZoomStorage = true;\n return this.pinchZoomStorage[key].pinchZoomStorage;\n }\n }\n }\n return null;\n };\n PdfViewerBase.prototype.getWindowSessionStorage = function (pageIndex) {\n return window.sessionStorage.getItem(this.documentId + '_' + pageIndex + '_' + this.getZoomFactor());\n };\n // tslint:disable-next-line\n PdfViewerBase.prototype.manageSessionStorage = function (pageIndex, storeObject) {\n if (this.pageCount > this.sessionLimit && window.sessionStorage.length > this.sessionLimit) {\n var lowerPageValue = this.currentPageNumber - this.sessionLimit;\n if (lowerPageValue < 0) {\n lowerPageValue = 0;\n }\n var higherPageValue = this.currentPageNumber + this.sessionLimit;\n if (higherPageValue > this.pageCount) {\n higherPageValue = this.pageCount;\n }\n for (var i = 0; i <= this.pageCount; i++) {\n if (!((lowerPageValue <= i) && (i < higherPageValue))) {\n window.sessionStorage.removeItem(this.documentId + '_' + i + '_' + this.getZoomFactor());\n }\n }\n }\n window.sessionStorage.setItem(this.documentId + '_' + pageIndex + '_' + this.getZoomFactor(), JSON.stringify(storeObject));\n this.sessionStorage.push(this.documentId + '_' + pageIndex + '_' + this.getZoomFactor());\n };\n PdfViewerBase.prototype.createBlobUrl = function (base64String, contentType) {\n var sliceSize = 512;\n var byteCharacters = atob(base64String);\n // tslint:disable-next-line\n var byteArrays = [];\n for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {\n var slice = byteCharacters.slice(offset, offset + sliceSize);\n // tslint:disable-next-line\n var byteNumbers = new Array(slice.length);\n for (var i = 0; i < slice.length; i++) {\n byteNumbers[i] = slice.charCodeAt(i);\n }\n // tslint:disable-next-line\n var byteArray = new Uint8Array(byteNumbers);\n byteArrays.push(byteArray);\n }\n // tslint:disable-next-line\n var blob = new Blob(byteArrays, { type: contentType });\n return blob;\n };\n PdfViewerBase.prototype.getRandomNumber = function () {\n // tslint:disable-next-line\n return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {\n // tslint:disable-next-line\n var random = Math.random() * 16 | 0, v = c == 'x' ? random : (random & 0x3 | 0x8);\n return random.toString(16);\n });\n };\n PdfViewerBase.prototype.createGUID = function () {\n // tslint:disable-next-line:max-line-length\n return 'Sync_PdfViewer_' + this.getRandomNumber();\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.isClickedOnScrollBar = function (event) {\n var isScrollBar = false;\n this.setScrollDownValue(event.type, false);\n // tslint:disable-next-line:max-line-length\n if ((this.viewerContainer.clientWidth + this.viewerContainer.offsetLeft) < event.clientX && event.clientX < (this.viewerContainer.offsetWidth + this.viewerContainer.offsetLeft)) {\n isScrollBar = true;\n this.setScrollDownValue(event.type, true);\n }\n // tslint:disable-next-line:max-line-length\n if ((this.viewerContainer.clientHeight + this.viewerContainer.offsetTop) < event.clientY && event.clientY < (this.viewerContainer.offsetHeight + this.viewerContainer.offsetTop)) {\n isScrollBar = true;\n this.setScrollDownValue(event.type, true);\n }\n return isScrollBar;\n };\n PdfViewerBase.prototype.setScrollDownValue = function (eventType, boolValue) {\n if (eventType === 'mousedown') {\n this.isScrollbarMouseDown = boolValue;\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.disableTextSelectionMode = function () {\n this.isTextSelectionDisabled = true;\n this.viewerContainer.classList.remove('e-enable-text-selection');\n if (this.pdfViewer.textSelectionModule) {\n this.pdfViewer.textSelectionModule.clearTextSelection();\n }\n this.viewerContainer.classList.add('e-disable-text-selection');\n this.viewerContainer.addEventListener('selectstart', function () { return false; });\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.getElement = function (idString) {\n return document.getElementById(this.pdfViewer.element.id + idString);\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.getPageWidth = function (pageIndex) {\n return this.pageSize[pageIndex].width * this.getZoomFactor();\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.getPageHeight = function (pageIndex) {\n return this.pageSize[pageIndex].height * this.getZoomFactor();\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.getPageTop = function (pageIndex) {\n return this.pageSize[pageIndex].top * this.getZoomFactor();\n };\n PdfViewerBase.prototype.isAnnotationToolbarHidden = function () {\n if (this.pdfViewer.toolbarModule.annotationToolbarModule) {\n return this.pdfViewer.toolbarModule.annotationToolbarModule.isToolbarHidden;\n }\n else {\n return true;\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.getTextMarkupAnnotationMode = function () {\n if (this.isTextMarkupAnnotationModule()) {\n return this.pdfViewer.annotationModule.textMarkupAnnotationModule.isTextMarkupAnnotationMode;\n }\n else {\n return false;\n }\n };\n PdfViewerBase.prototype.getCurrentTextMarkupAnnotation = function () {\n if (this.isTextMarkupAnnotationModule()) {\n if (this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAnnotation) {\n return true;\n }\n else {\n return false;\n }\n }\n else {\n return false;\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.getSelectTextMarkupCurrentPage = function () {\n if (this.isTextMarkupAnnotationModule()) {\n return this.pdfViewer.annotationModule.textMarkupAnnotationModule.selectTextMarkupCurrentPage;\n }\n else {\n return null;\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.getAnnotationToolStatus = function () {\n if (this.pdfViewer.toolbarModule) {\n return this.pdfViewer.toolbarModule.annotationToolbarModule.isAnnotationButtonsEnabled();\n }\n else {\n return false;\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.getPopupNoteVisibleStatus = function () {\n if (this.pdfViewer.annotationModule) {\n return this.pdfViewer.annotationModule.isPopupNoteVisible;\n }\n else {\n return false;\n }\n };\n /**\n * @private\n */\n PdfViewerBase.prototype.isTextMarkupAnnotationModule = function () {\n if (this.pdfViewer.annotationModule) {\n return this.pdfViewer.annotationModule.textMarkupAnnotationModule;\n }\n else {\n return null;\n }\n };\n return PdfViewerBase;\n}());\nexport { PdfViewerBase };\n","import { createElement } from '@syncfusion/ej2-base';\nimport { Dialog } from '@syncfusion/ej2-popups';\n/**\n * TextLayer module is used to handle the text content on the control.\n * @hidden\n */\nvar TextLayer = /** @class */ (function () {\n /**\n * @private\n */\n function TextLayer(pdfViewer, pdfViewerBase) {\n var _this = this;\n // tslint:disable-next-line\n this.textBoundsArray = [];\n this.closeNotification = function () {\n _this.notifyDialog.hide();\n };\n this.pdfViewer = pdfViewer;\n this.pdfViewerBase = pdfViewerBase;\n }\n /**\n * @private\n */\n TextLayer.prototype.addTextLayer = function (pageNumber, pageWidth, pageHeight, pageDiv) {\n var textDiv = document.getElementById(this.pdfViewer.element.id + '_textLayer_' + pageNumber);\n var textLayer;\n if (!textDiv) {\n textLayer = createElement('div', { id: this.pdfViewer.element.id + '_textLayer_' + pageNumber, className: 'e-pv-text-layer' });\n textLayer.style.width = pageWidth + 'px';\n textLayer.style.height = pageHeight + 'px';\n pageDiv.appendChild(textLayer);\n }\n return textLayer;\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n TextLayer.prototype.renderTextContents = function (pageNumber, textContents, textBounds, rotation) {\n var textLayer = document.getElementById(this.pdfViewer.element.id + '_textLayer_' + pageNumber);\n var canvasElement = document.getElementById(this.pdfViewer.element.id + '_pageCanvas_' + pageNumber);\n if (canvasElement && textLayer.childNodes.length === 0) {\n for (var i = 0; i < textContents.length; i++) {\n // tslint:disable-next-line\n var bounds = textBounds[i];\n // tslint:disable-next-line:max-line-length\n var textDiv = createElement('div', { id: this.pdfViewer.element.id + '_text_' + pageNumber + '_' + i, className: 'e-pv-text', attrs: { 'tabindex': '0' } });\n var textContent = textContents[i];\n textContent = textContent.replace(//g, '>');\n textDiv.innerHTML = textContent.replace(/ /g, ' ');\n // tslint:disable-next-line\n var newLine = textContents[i].replace(/ +/g, ' ');\n if (newLine !== ' ') {\n textDiv.style.whiteSpace = 'pre';\n }\n this.setStyleToTextDiv(textDiv, bounds.X, bounds.Y, bounds.Bottom, bounds.Width, bounds.Height);\n this.setTextElementProperties(textDiv);\n var context = canvasElement.getContext('2d');\n context.font = textDiv.style.fontSize + ' ' + textDiv.style.fontFamily;\n var contextWidth = context.measureText(textContents[i].replace(/(\\r\\n|\\n|\\r)/gm, '')).width;\n var scale = bounds.Width * this.pdfViewerBase.getZoomFactor() / contextWidth;\n this.applyTextRotation(scale, textDiv, rotation, bounds.Rotation);\n textLayer.appendChild(textDiv);\n this.resizeExcessDiv(textLayer, textDiv);\n // tslint:disable-next-line:max-line-length\n if (this.pdfViewer.textSelectionModule && this.pdfViewer.enableTextSelection && !this.pdfViewerBase.isTextSelectionDisabled) {\n textDiv.classList.add('e-pv-cursor');\n }\n }\n }\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n TextLayer.prototype.resizeTextContents = function (pageNumber, textContents, textBounds, rotation) {\n var textLayer = this.pdfViewerBase.getElement('_textLayer_' + pageNumber);\n var canvasElement = this.pdfViewerBase.getElement('_pageCanvas_' + pageNumber);\n if (canvasElement) {\n for (var i = 0; i < textLayer.childNodes.length; i++) {\n // tslint:disable-next-line\n var bounds = void 0;\n var textDiv = this.pdfViewerBase.getElement('_text_' + pageNumber + '_' + i);\n if (textBounds) {\n bounds = textBounds[i];\n this.setStyleToTextDiv(textDiv, bounds.X, bounds.Y, bounds.Bottom, bounds.Width, bounds.Height);\n }\n this.setTextElementProperties(textDiv);\n var context = canvasElement.getContext('2d');\n context.font = textDiv.style.fontSize + ' ' + textDiv.style.fontFamily;\n var contextWidth = void 0;\n if (textContents) {\n contextWidth = context.measureText(textContents[i].replace(/(\\r\\n|\\n|\\r)/gm, '')).width;\n }\n else {\n contextWidth = context.measureText(textDiv.textContent.replace(/(\\r\\n|\\n|\\r)/gm, '')).width;\n }\n var scale = bounds.Width * this.pdfViewerBase.getZoomFactor() / contextWidth;\n this.applyTextRotation(scale, textDiv, rotation, bounds.Rotation);\n this.resizeExcessDiv(textLayer, textDiv);\n }\n }\n else {\n textLayer.parentElement.removeChild(textLayer);\n }\n };\n TextLayer.prototype.applyTextRotation = function (scale, textDiv, rotation, textRotation) {\n var scaleString = 'scale(' + scale + ')';\n if (rotation === 0) {\n if (textRotation === 0) {\n textDiv.style.transform = scaleString;\n }\n else {\n textDiv.style.transform = 'rotate(' + textRotation + 'deg) ' + scaleString;\n }\n }\n else if (rotation === 1) {\n if (textRotation === 0) {\n textDiv.style.transform = 'rotate(90deg) ' + scaleString;\n }\n else if (textRotation === -90) {\n textDiv.style.transform = scaleString;\n }\n else {\n textDiv.style.transform = 'rotate(' + textRotation + 'deg) ' + scaleString;\n }\n }\n else if (rotation === 2) {\n if (textRotation === 0) {\n textDiv.style.transform = 'rotate(180deg) ' + scaleString;\n }\n else if (textRotation === 180) {\n textDiv.style.transform = scaleString;\n }\n else {\n textDiv.style.transform = 'rotate(' + textRotation + 'deg) ' + scaleString;\n }\n }\n else if (rotation === 3) {\n if (textRotation === 0) {\n textDiv.style.transform = 'rotate(-90deg) ' + scaleString;\n }\n else if (textRotation === 90) {\n textDiv.style.transform = scaleString;\n }\n else {\n textDiv.style.transform = 'rotate(' + textRotation + 'deg) ' + scaleString;\n }\n }\n };\n TextLayer.prototype.setTextElementProperties = function (textDiv) {\n textDiv.style.fontFamily = 'sans-serif';\n textDiv.style.transformOrigin = '0%';\n };\n /**\n * @private\n */\n TextLayer.prototype.resizeTextContentsOnZoom = function (pageNumber) {\n // tslint:disable-next-line:max-line-length\n var renderObject = window.sessionStorage.getItem(this.pdfViewerBase.getDocumentId() + '_' + pageNumber + '_' + this.getPreviousZoomFactor());\n // tslint:disable-next-line\n var textBounds = [];\n var textContents = [];\n // tslint:disable-next-line\n var rotation;\n if (renderObject) {\n // tslint:disable-next-line\n var data = JSON.parse(renderObject);\n // tslint:disable-next-line\n textBounds = data['textBounds'];\n // tslint:disable-next-line\n textContents = data['textContent'];\n // tslint:disable-next-line\n rotation = data['rotation'];\n }\n if (textBounds.length !== 0) {\n this.textBoundsArray.push({ pageNumber: pageNumber, textBounds: textBounds });\n this.resizeTextContents(pageNumber, textContents, textBounds, rotation);\n }\n else {\n // tslint:disable-next-line\n var textElements = this.textBoundsArray.filter(function (obj) {\n return obj.pageNumber === pageNumber;\n });\n if (textElements) {\n if (textElements.length !== 0) {\n // tslint:disable-next-line\n textBounds = textElements[0]['textBounds'];\n this.resizeTextContents(pageNumber, null, textBounds, rotation);\n }\n }\n }\n };\n TextLayer.prototype.resizeExcessDiv = function (textLayer, textDiv) {\n var textLayerPosition = textLayer.getBoundingClientRect();\n var textDivPosition = textDiv.getBoundingClientRect();\n // tslint:disable-next-line:max-line-length\n if ((textDivPosition.width + textDivPosition.left) >= (textLayerPosition.width + textLayerPosition.left) || (textDivPosition.width > textLayerPosition.width)) {\n // 'auto' width is set to reset the size of the div to its contents.\n textDiv.style.width = 'auto';\n // Client width gets reset by 'auto' width property which has the width of the content.\n textDiv.style.width = textDiv.clientWidth + 'px';\n }\n };\n /**\n * @private\n */\n TextLayer.prototype.clearTextLayers = function () {\n var lowerPageValue = this.pdfViewerBase.currentPageNumber - 3;\n lowerPageValue = (lowerPageValue > 0) ? lowerPageValue : 0;\n var higherPageValue = this.pdfViewerBase.currentPageNumber + 1;\n higherPageValue = (higherPageValue < this.pdfViewerBase.pageCount) ? higherPageValue : (this.pdfViewerBase.pageCount - 1);\n var textLayers = document.querySelectorAll('div[id*=\"_textLayer_\"]');\n for (var i = 0; i < textLayers.length; i++) {\n textLayers[i].style.display = 'block';\n if (this.pdfViewerBase.getMagnified() && (this.getTextSelectionStatus() || this.getTextSearchStatus())) {\n // tslint:disable-next-line:radix\n var pageNumber = parseInt(textLayers[i].id.split('_textLayer_')[1]);\n if (!(((lowerPageValue + 1) <= pageNumber) && (pageNumber <= (higherPageValue - 1)))) {\n textLayers[i].remove();\n }\n }\n else if (this.pdfViewerBase.getPinchZoomed()) {\n textLayers[i].remove();\n }\n else {\n textLayers[i].remove();\n }\n }\n };\n /**\n * @private\n */\n // tslint:disable-next-line:max-line-length\n TextLayer.prototype.convertToSpan = function (pageNumber, divId, fromOffset, toOffset, textString, className) {\n var textDiv = this.pdfViewerBase.getElement('_text_' + pageNumber + '_' + divId);\n var textContent = textString.substring(fromOffset, toOffset);\n var node = document.createTextNode(textContent);\n if (className) {\n var spanElement = createElement('span');\n spanElement.className = className + ' e-pv-text';\n spanElement.appendChild(node);\n textDiv.appendChild(spanElement);\n }\n else {\n textDiv.appendChild(node);\n }\n };\n /**\n * @private\n */\n // tslint:disable-next-line:max-line-length\n TextLayer.prototype.applySpanForSelection = function (startPage, endPage, anchorOffsetDiv, focusOffsetDiv, anchorOffset, focusOffset) {\n if (this.pdfViewer.textSelectionModule) {\n for (var i = startPage; i <= endPage; i++) {\n var startId = void 0;\n var endId = void 0;\n // tslint:disable-next-line\n var textDivs = this.pdfViewerBase.getElement('_textLayer_' + i).childNodes;\n if (i === startPage) {\n startId = anchorOffsetDiv;\n endId = textDivs.length - 1;\n }\n else if (i === endPage) {\n startId = 0;\n endId = focusOffsetDiv;\n }\n else {\n startId = 0;\n endId = textDivs.length - 1;\n }\n if (startPage === endPage) {\n startId = anchorOffsetDiv;\n endId = focusOffsetDiv;\n }\n for (var j = startId; j <= endId; j++) {\n var textDiv = this.pdfViewerBase.getElement('_text_' + i + '_' + j);\n var initId = void 0;\n var lastId = void 0;\n var length_1 = void 0;\n length_1 = textDiv.textContent.length;\n var textContent = textDiv.textContent;\n textDiv.textContent = '';\n if (j === startId) {\n if (i === startPage) {\n initId = anchorOffset;\n }\n else {\n initId = 0;\n }\n lastId = length_1;\n this.convertToSpan(i, j, 0, initId, textContent, null);\n }\n else if (j === endId && i === endPage) {\n initId = 0;\n lastId = focusOffset;\n }\n else {\n initId = 0;\n lastId = length_1;\n }\n if (startId === endId) {\n initId = anchorOffset;\n lastId = focusOffset;\n }\n this.convertToSpan(i, j, initId, lastId, textContent, 'e-pv-maintaincontent');\n if (j === endId && i === endPage) {\n this.convertToSpan(i, j, lastId, textContent.length, textContent, null);\n }\n }\n }\n }\n };\n /**\n * @private\n */\n TextLayer.prototype.clearDivSelection = function () {\n var textLayers = document.querySelectorAll('div[id*=\"_textLayer_\"]');\n for (var i = 0; i < textLayers.length; i++) {\n var childNodes = textLayers[i].childNodes;\n for (var j = 0; j < childNodes.length; j++) {\n var textDiv = childNodes[j];\n var textContent = textDiv.textContent;\n // tslint:disable-next-line:max-line-length\n if (textDiv.childNodes.length > 1 || textDiv.childNodes.length === 1 && (textDiv.childNodes[0].tagName === 'SPAN')) {\n textDiv.textContent = '';\n textDiv.textContent = textContent;\n }\n }\n }\n };\n // tslint:disable-next-line\n TextLayer.prototype.setStyleToTextDiv = function (textDiv, left, top, bottom, width, height) {\n textDiv.style.left = left * this.pdfViewerBase.getZoomFactor() + 'px';\n textDiv.style.top = top * this.pdfViewerBase.getZoomFactor() + 'px';\n var textHeight = height * this.pdfViewerBase.getZoomFactor();\n textDiv.style.height = textHeight + 'px';\n textDiv.style.fontSize = height * this.pdfViewerBase.getZoomFactor() + 'px';\n };\n TextLayer.prototype.getTextSelectionStatus = function () {\n if (this.pdfViewer.textSelectionModule) {\n return this.pdfViewer.textSelectionModule.isTextSelection;\n }\n else {\n return false;\n }\n };\n /**\n * @private\n */\n TextLayer.prototype.modifyTextCursor = function (isAdd) {\n var textLayerList = document.querySelectorAll('div[id*=\"_textLayer_\"]');\n for (var i = 0; i < textLayerList.length; i++) {\n var childNodes = textLayerList[i].childNodes;\n for (var j = 0; j < childNodes.length; j++) {\n var textElement = childNodes[j];\n if (isAdd) {\n textElement.classList.add('e-pv-cursor');\n }\n else {\n textElement.classList.remove('e-pv-cursor');\n }\n }\n }\n };\n /**\n * @private\n */\n TextLayer.prototype.isBackWardSelection = function (selection) {\n var position = selection.anchorNode.compareDocumentPosition(selection.focusNode);\n var backward = false;\n if (!position && selection.anchorOffset > selection.focusOffset || position === Node.DOCUMENT_POSITION_PRECEDING) {\n backward = true;\n }\n return backward;\n };\n /**\n * @private\n */\n TextLayer.prototype.getPageIndex = function (element) {\n var pageId;\n // tslint:disable-next-line\n var parentElement = element.parentElement;\n if (!parentElement) {\n parentElement = element.parentNode;\n }\n if (parentElement.className === 'e-pv-text-layer') {\n // tslint:disable-next-line:radix\n pageId = parseInt(element.id.split('_text_')[1]);\n }\n else {\n // tslint:disable-next-line:radix\n pageId = parseInt(parentElement.id.split('_text_')[1]);\n }\n return pageId;\n };\n /**\n * @private\n */\n TextLayer.prototype.getTextIndex = function (element, pageIndex) {\n var textIndex;\n // tslint:disable-next-line\n var parentElement = element.parentElement;\n if (!parentElement) {\n parentElement = element.parentNode;\n }\n if (parentElement.className === 'e-pv-text-layer') {\n // tslint:disable-next-line:radix\n textIndex = parseInt(element.id.split('_text_' + pageIndex + '_')[1]);\n }\n else {\n // tslint:disable-next-line:radix\n textIndex = parseInt(parentElement.id.split('_text_' + pageIndex + '_')[1]);\n }\n return textIndex;\n };\n TextLayer.prototype.getPreviousZoomFactor = function () {\n if (this.pdfViewer.magnificationModule) {\n return this.pdfViewer.magnificationModule.previousZoomFactor;\n }\n else {\n return 1;\n }\n };\n /**\n * @private\n */\n TextLayer.prototype.getTextSearchStatus = function () {\n if (this.pdfViewer.textSearchModule) {\n return this.pdfViewer.textSearchModule.isTextSearch;\n }\n else {\n return false;\n }\n };\n /**\n * @private\n */\n TextLayer.prototype.createNotificationPopup = function (text) {\n var _this = this;\n // tslint:disable-next-line:max-line-length\n var popupElement = createElement('div', { id: this.pdfViewer.element.id + '_notify', className: 'e-pv-notification-popup' });\n this.pdfViewerBase.viewerContainer.appendChild(popupElement);\n this.notifyDialog = new Dialog({\n showCloseIcon: true, closeOnEscape: false, isModal: true, header: this.pdfViewer.localeObj.getConstant('PdfViewer'),\n buttons: [{\n buttonModel: { content: this.pdfViewer.localeObj.getConstant('OK'), isPrimary: true },\n click: this.closeNotification.bind(this)\n }],\n content: '' + text + '
', target: this.pdfViewer.element,\n beforeClose: function () {\n _this.notifyDialog.destroy();\n _this.pdfViewer.element.removeChild(popupElement);\n if (_this.pdfViewer.textSearchModule) {\n _this.pdfViewer.textSearch.isMessagePopupOpened = false;\n }\n }\n });\n if (this.pdfViewer.enableRtl) {\n this.notifyDialog.enableRtl = true;\n }\n this.notifyDialog.appendTo(popupElement);\n };\n return TextLayer;\n}());\nexport { TextLayer };\n","import { createElement, Browser } from '@syncfusion/ej2-base';\nimport { ContextMenu as Context } from '@syncfusion/ej2-navigations';\n/**\n * ContextMenu module is used to handle the context menus used in the control.\n * @hidden\n */\nvar ContextMenu = /** @class */ (function () {\n /**\n * @private\n */\n function ContextMenu(pdfViewer, pdfViewerBase) {\n this.copyContextMenu = [];\n this.pdfViewer = pdfViewer;\n this.pdfViewerBase = pdfViewerBase;\n this.copyContextMenu = [{ text: this.pdfViewer.localeObj.getConstant('Copy'), iconCss: 'e-pv-copy-icon' },\n { text: this.pdfViewer.localeObj.getConstant('Highlight context'), iconCss: 'e-pv-highlight-icon' },\n { text: this.pdfViewer.localeObj.getConstant('Underline context'), iconCss: 'e-pv-underline-icon' },\n { text: this.pdfViewer.localeObj.getConstant('Strikethrough context'), iconCss: 'e-pv-strikethrough-icon' }];\n }\n /**\n * @private\n */\n ContextMenu.prototype.createContextMenu = function () {\n this.contextMenuElement = createElement('ul', { id: this.pdfViewer.element.id + '_context_menu' });\n this.pdfViewer.element.appendChild(this.contextMenuElement);\n this.contextMenuObj = new Context({\n target: '#' + this.pdfViewerBase.viewerContainer.id, items: this.copyContextMenu,\n beforeOpen: this.contextMenuOnBeforeOpen.bind(this), select: this.onMenuItemSelect.bind(this),\n created: this.contextMenuOnCreated.bind(this)\n });\n if (this.pdfViewer.enableRtl) {\n this.contextMenuObj.enableRtl = true;\n }\n this.contextMenuObj.appendTo(this.contextMenuElement);\n if (Browser.isDevice) {\n this.contextMenuObj.animationSettings.effect = 'ZoomIn';\n }\n else {\n this.contextMenuObj.animationSettings.effect = 'SlideDown';\n }\n };\n ContextMenu.prototype.contextMenuOnCreated = function (args) {\n // tslint:disable-next-line:max-line-length\n var items = [this.pdfViewer.localeObj.getConstant('Highlight context'), this.pdfViewer.localeObj.getConstant('Underline context'),\n this.pdfViewer.localeObj.getConstant('Strikethrough context')];\n if (this.pdfViewer.annotationModule) {\n if (!this.pdfViewer.annotationModule.textMarkupAnnotationModule) {\n this.contextMenuObj.enableItems(items, false);\n }\n }\n else {\n this.contextMenuObj.enableItems(items, false);\n }\n };\n ContextMenu.prototype.contextMenuOnBeforeOpen = function (args) {\n if (this.pdfViewer.textSelectionModule) {\n if (args.event) {\n var isClickWithinSelectionBounds = this.isClickWithinSelectionBounds(args.event);\n // tslint:disable-next-line:max-line-length\n if (isClickWithinSelectionBounds) {\n // tslint:disable-next-line:max-line-length\n if ((!args.event.target.classList.contains('e-pv-maintaincontent') && args.event.target.classList.contains('e-pv-text') || args.event.target.classList.contains('e-pv-text-layer'))) {\n args.cancel = true;\n // tslint:disable-next-line:max-line-length\n }\n else if ((Browser.isIE || Browser.info.name === 'edge') && args.event.target.classList.contains('e-pv-page-container')) {\n args.cancel = true;\n }\n }\n else {\n args.cancel = true;\n }\n }\n }\n else {\n args.cancel = true;\n }\n };\n // tslint:disable-next-line\n ContextMenu.prototype.isClickWithinSelectionBounds = function (event) {\n var isWithin = false;\n var bounds = this.pdfViewer.textSelectionModule.getCurrentSelectionBounds(this.pdfViewerBase.currentPageNumber - 1);\n if (bounds) {\n var currentBound = bounds;\n if (this.getHorizontalValue(currentBound.left) < event.clientX && this.getHorizontalValue(currentBound.right) >\n event.clientX && this.getVerticalValue(currentBound.top) < event.clientY &&\n this.getVerticalValue(currentBound.bottom) > event.clientY) {\n isWithin = true;\n }\n }\n if ((Browser.isIE || Browser.info.name === 'edge') && bounds) {\n isWithin = true;\n }\n return isWithin;\n };\n ContextMenu.prototype.getHorizontalClientValue = function (value) {\n var pageDiv = this.pdfViewerBase.getElement('_pageDiv_' + (this.pdfViewerBase.currentPageNumber - 1));\n var pageBounds = pageDiv.getBoundingClientRect();\n return (value - pageBounds.left);\n };\n ContextMenu.prototype.getVerticalClientValue = function (value) {\n var pageDiv = this.pdfViewerBase.getElement('_pageDiv_' + (this.pdfViewerBase.currentPageNumber - 1));\n var pageBounds = pageDiv.getBoundingClientRect();\n return (value - pageBounds.top);\n };\n ContextMenu.prototype.getHorizontalValue = function (value) {\n var pageDiv = this.pdfViewerBase.getElement('_pageDiv_' + (this.pdfViewerBase.currentPageNumber - 1));\n var pageBounds = pageDiv.getBoundingClientRect();\n return (value * this.pdfViewerBase.getZoomFactor()) + pageBounds.left;\n };\n ContextMenu.prototype.getVerticalValue = function (value) {\n var pageDiv = this.pdfViewerBase.getElement('_pageDiv_' + (this.pdfViewerBase.currentPageNumber - 1));\n var pageBounds = pageDiv.getBoundingClientRect();\n return (value * this.pdfViewerBase.getZoomFactor()) + pageBounds.top;\n };\n ContextMenu.prototype.onMenuItemSelect = function (args) {\n switch (args.item.text) {\n case this.pdfViewer.localeObj.getConstant('Copy'):\n if (this.pdfViewer.textSelectionModule) {\n this.pdfViewer.textSelectionModule.copyText();\n this.contextMenuObj.close();\n }\n break;\n case this.pdfViewer.localeObj.getConstant('Highlight context'):\n if (this.pdfViewer.annotation.textMarkupAnnotationModule) {\n this.pdfViewer.annotation.textMarkupAnnotationModule.drawTextMarkupAnnotations('Highlight');\n this.pdfViewer.annotation.textMarkupAnnotationModule.isTextMarkupAnnotationMode = false;\n }\n break;\n case this.pdfViewer.localeObj.getConstant('Underline context'):\n if (this.pdfViewer.annotation.textMarkupAnnotationModule) {\n this.pdfViewer.annotation.textMarkupAnnotationModule.drawTextMarkupAnnotations('Underline');\n this.pdfViewer.annotation.textMarkupAnnotationModule.isTextMarkupAnnotationMode = false;\n }\n break;\n case this.pdfViewer.localeObj.getConstant('Strikethrough context'):\n if (this.pdfViewer.annotation.textMarkupAnnotationModule) {\n this.pdfViewer.annotation.textMarkupAnnotationModule.drawTextMarkupAnnotations('Strikethrough');\n this.pdfViewer.annotation.textMarkupAnnotationModule.isTextMarkupAnnotationMode = false;\n }\n break;\n default:\n break;\n }\n };\n /**\n * @private\n */\n ContextMenu.prototype.destroy = function () {\n this.contextMenuObj.destroy();\n };\n return ContextMenu;\n}());\nexport { ContextMenu };\n","import { Browser } from '@syncfusion/ej2-base';\n/**\n * Magnification module\n */\nvar Magnification = /** @class */ (function () {\n /**\n * @private\n */\n function Magnification(pdfViewer, viewerBase) {\n /**\n * @private\n */\n this.zoomFactor = 1;\n /**\n * @private\n */\n this.previousZoomFactor = 1;\n this.scrollWidth = 25;\n this.zoomPercentages = [50, 75, 100, 125, 150, 200, 400];\n this.isNotPredefinedZoom = false;\n this.pinchStep = 0.02;\n this.reRenderPageNumber = 0;\n // tslint:disable-next-line\n this.magnifyPageRerenderTimer = null;\n // tslint:disable-next-line\n this.rerenderOnScrollTimer = null;\n // tslint:disable-next-line\n this.rerenderInterval = null;\n this.touchCenterX = 0;\n this.touchCenterY = 0;\n this.pageRerenderCount = 0;\n this.imageObjects = [];\n this.topValue = 0;\n this.isTapToFitZoom = false;\n /**\n * @private\n */\n this.fitType = null;\n /**\n * @private\n */\n this.isPinchZoomed = false;\n /**\n * @private\n */\n this.isPagePinchZoomed = false;\n /**\n * @private\n */\n this.isRerenderCanvasCreated = false;\n /**\n * @private\n */\n this.isMagnified = false;\n /**\n * @private\n */\n this.isPagesZoomed = false;\n /**\n * @private\n */\n this.isPinchScrolled = false;\n /**\n * @private\n */\n this.isAutoZoom = false;\n this.pdfViewer = pdfViewer;\n this.pdfViewerBase = viewerBase;\n this.zoomLevel = 2;\n }\n /**\n * Zoom the PDF document to the given zoom value\n * @param {number} zoomValue - Specifies the Zoom Value for magnify the PDF document\n * @returns void\n */\n Magnification.prototype.zoomTo = function (zoomValue) {\n if (zoomValue < 50) {\n zoomValue = 50;\n }\n else if (zoomValue > 400) {\n zoomValue = 400;\n }\n this.fitType = null;\n this.isNotPredefinedZoom = false;\n if (this.isAutoZoom && this.isInitialLoading) {\n this.pdfViewerBase.onWindowResize();\n }\n else {\n this.isAutoZoom = false;\n this.onZoomChanged(zoomValue);\n }\n this.isInitialLoading = false;\n };\n /**\n * Magnifies the page to the next value in the zoom drop down list.\n * @returns void\n */\n Magnification.prototype.zoomIn = function () {\n if (this.fitType || this.isNotPredefinedZoom) {\n this.zoomLevel = this.lowerZoomLevel;\n this.fitType = null;\n }\n this.isNotPredefinedZoom = false;\n if (this.zoomLevel >= 6) {\n this.zoomLevel = 6;\n }\n else {\n this.zoomLevel++;\n }\n this.isAutoZoom = false;\n this.onZoomChanged(this.zoomPercentages[this.zoomLevel]);\n };\n /**\n * Magnifies the page to the previous value in the zoom drop down list.\n * @returns void\n */\n Magnification.prototype.zoomOut = function () {\n if (this.fitType || this.isNotPredefinedZoom) {\n this.zoomLevel = this.higherZoomLevel;\n this.fitType = null;\n }\n this.isNotPredefinedZoom = false;\n if (this.zoomLevel <= 0) {\n this.zoomLevel = 0;\n }\n else {\n this.zoomLevel--;\n }\n this.isAutoZoom = false;\n this.onZoomChanged(this.zoomPercentages[this.zoomLevel]);\n };\n /**\n * Scales the page to fit the page width to the width of the container in the control.\n * @returns void\n */\n Magnification.prototype.fitToWidth = function () {\n this.isAutoZoom = false;\n var zoomValue = this.calculateFitZoomFactor('fitToWidth');\n this.onZoomChanged(zoomValue);\n };\n /**\n * @private\n */\n Magnification.prototype.fitToAuto = function () {\n this.isAutoZoom = true;\n var zoomValue = this.calculateFitZoomFactor('fitToWidth');\n this.onZoomChanged(zoomValue);\n };\n /**\n * Scales the page to fit the page in the container in the control.\n * @param {number} zoomValue - Defines the Zoom Value for fit the page in the Container\n * @returns void\n */\n Magnification.prototype.fitToPage = function () {\n var zoomValue = this.calculateFitZoomFactor('fitToPage');\n this.isAutoZoom = false;\n this.onZoomChanged(zoomValue);\n if (Browser.isDevice) {\n this.pdfViewerBase.viewerContainer.style.overflowY = 'hidden';\n }\n else {\n this.pdfViewerBase.viewerContainer.style.overflowY = 'auto';\n }\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.viewerContainer.scrollTop = this.pdfViewerBase.pageSize[this.pdfViewerBase.currentPageNumber - 1].top * this.zoomFactor;\n };\n /**\n * Returns zoom factor for the fit zooms.\n */\n Magnification.prototype.calculateFitZoomFactor = function (type) {\n var viewerWidth = this.pdfViewerBase.viewerContainer.getBoundingClientRect().width;\n var viewerHeight = this.pdfViewerBase.viewerContainer.getBoundingClientRect().height;\n var highestWidth = 0;\n var highestHeight = 0;\n this.fitType = type;\n if (this.fitType === 'fitToWidth') {\n var pageWidth = 0;\n for (var i = 0; i < this.pdfViewerBase.pageSize.length; i++) {\n pageWidth = this.pdfViewerBase.pageSize[i].width;\n if (pageWidth > highestWidth) {\n highestWidth = pageWidth;\n }\n }\n var scaleX = ((viewerWidth - this.scrollWidth) / highestWidth);\n if (this.isAutoZoom) {\n this.fitType = null;\n scaleX = Math.min(1, scaleX);\n if (scaleX === 1) {\n this.zoomLevel = 2;\n }\n }\n return scaleX * 100;\n }\n else {\n var pageHeight = 0;\n for (var i = 0; i < this.pdfViewerBase.pageSize.length; i++) {\n pageHeight = this.pdfViewerBase.pageSize[i].height;\n if (pageHeight > highestHeight) {\n highestHeight = pageHeight;\n }\n }\n if (this.pdfViewerBase.pageCount === 1) {\n return ((viewerHeight - this.pdfViewerBase.pageSize[0].top) / highestHeight) * 100;\n }\n else {\n return (viewerHeight / highestHeight) * 100;\n }\n }\n };\n /**\n * Performs pinch in operation\n */\n Magnification.prototype.pinchIn = function () {\n this.fitType = null;\n var temporaryZoomFactor = this.zoomFactor - this.pinchStep;\n if (temporaryZoomFactor < 4 && temporaryZoomFactor > 2) {\n temporaryZoomFactor = this.zoomFactor - this.pinchStep;\n }\n if (temporaryZoomFactor < 0.5) {\n temporaryZoomFactor = 0.5;\n }\n this.isPinchZoomed = true;\n this.onZoomChanged(temporaryZoomFactor * 100);\n };\n /**\n * Performs pinch out operation\n */\n Magnification.prototype.pinchOut = function () {\n this.fitType = null;\n var temporaryZoomFactor = this.zoomFactor + this.pinchStep;\n if (temporaryZoomFactor > 2) {\n temporaryZoomFactor = temporaryZoomFactor + this.pinchStep;\n }\n if (temporaryZoomFactor > 4) {\n temporaryZoomFactor = 4;\n }\n this.isPinchZoomed = true;\n this.onZoomChanged(temporaryZoomFactor * 100);\n };\n /**\n * returns zoom level for the zoom factor.\n */\n Magnification.prototype.getZoomLevel = function (zoomFactor) {\n var min = 0;\n var max = this.zoomPercentages.length - 1;\n while ((min <= max) && !(min === 0 && max === 0)) {\n var mid = Math.round((min + max) / 2);\n if (this.zoomPercentages[mid] <= zoomFactor) {\n min = mid + 1;\n }\n else if (this.zoomPercentages[mid] >= zoomFactor) {\n max = mid - 1;\n }\n }\n this.higherZoomLevel = min;\n this.lowerZoomLevel = max;\n return max;\n };\n /**\n * @private\n */\n Magnification.prototype.checkZoomFactor = function () {\n return this.zoomPercentages.indexOf(this.zoomFactor * 100) > -1;\n };\n /**\n * Executes when the zoom or pinch operation is performed\n */\n Magnification.prototype.onZoomChanged = function (zoomValue) {\n if (this.pdfViewer.annotationModule) {\n this.pdfViewer.annotationModule.closePopupMenu();\n }\n this.previousZoomFactor = this.zoomFactor;\n this.zoomLevel = this.getZoomLevel(zoomValue);\n this.zoomFactor = this.getZoomFactor(zoomValue);\n if (Browser.isDevice) {\n this.pdfViewerBase.viewerContainer.style.overflowY = 'hidden';\n }\n else {\n this.pdfViewerBase.viewerContainer.style.overflowY = 'auto';\n }\n if (this.pdfViewerBase.pageCount > 0) {\n if (this.previousZoomFactor !== this.zoomFactor) {\n if (!this.isPinchZoomed) {\n this.magnifyPages();\n }\n else {\n if (Browser.isDevice) {\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.mobilePageNoContainer.style.left = (this.pdfViewer.element.clientWidth / 2) - (parseFloat(this.pdfViewerBase.mobilePageNoContainer.style.width) / 2) + 'px';\n }\n this.responsivePages();\n }\n }\n if (this.pdfViewer.toolbarModule) {\n this.pdfViewer.toolbarModule.updateZoomButtons();\n }\n this.pdfViewer.fireZoomChange();\n }\n if (this.pdfViewer.toolbarModule) {\n this.pdfViewer.toolbarModule.updateZoomPercentage(this.zoomFactor);\n }\n if (Browser.isDevice && this.isPinchZoomed) {\n // tslint:disable-next-line:radix\n var zoomPercentage = parseInt((this.zoomFactor * 100).toString()) + '%';\n this.pdfViewerBase.navigationPane.createTooltipMobile(zoomPercentage);\n }\n };\n /**\n * @private\n */\n Magnification.prototype.setTouchPoints = function (clientX, clientY) {\n this.touchCenterX = clientX;\n this.touchCenterY = clientY;\n };\n /**\n * @private\n */\n Magnification.prototype.initiatePinchMove = function (pointX1, pointY1, pointX2, pointY2) {\n this.isPinchScrolled = false;\n this.isMagnified = false;\n this.reRenderPageNumber = this.pdfViewerBase.currentPageNumber;\n this.touchCenterX = (pointX1 + pointX2) / 2;\n this.touchCenterY = (pointY1 + pointY2) / 2;\n this.zoomOverPages(pointX1, pointY1, pointX2, pointY2);\n };\n Magnification.prototype.magnifyPages = function () {\n this.clearRerenderTimer();\n if (!this.isPagesZoomed) {\n this.reRenderPageNumber = this.pdfViewerBase.currentPageNumber;\n }\n this.isPagesZoomed = true;\n var scrollValue = this.getMagnifiedValue(this.pdfViewerBase.viewerContainer.scrollTop);\n if (this.pdfViewer.textSelectionModule) {\n this.pdfViewer.textSelectionModule.maintainSelectionOnZoom(false, true);\n }\n this.isMagnified = true;\n this.updatePageLocation();\n this.resizeCanvas(this.reRenderPageNumber);\n if (this.pdfViewer.textSelectionModule) {\n this.pdfViewer.textSelectionModule.resizeTouchElements();\n }\n if (this.pdfViewerBase.pageSize.length > 0) {\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.pageContainer.style.height = this.topValue + this.pdfViewerBase.getPageHeight(this.pdfViewerBase.pageSize.length - 1) + 'px';\n // tslint:disable-next-line \n var proxy_1 = this;\n this.pdfViewerBase.renderedPagesList = [];\n this.pdfViewerBase.pinchZoomStorage = [];\n this.pdfViewerBase.viewerContainer.scrollTop = scrollValue;\n this.magnifyPageRerenderTimer = setTimeout(function () { proxy_1.rerenderMagnifiedPages(); }, 800);\n }\n };\n Magnification.prototype.updatePageLocation = function () {\n this.topValue = 0;\n for (var i = 1; i < this.pdfViewerBase.pageSize.length; i++) {\n this.topValue += (this.pdfViewerBase.pageSize[i].height + this.pdfViewerBase.pageGap) * this.zoomFactor;\n }\n };\n Magnification.prototype.clearRerenderTimer = function () {\n clearTimeout(this.rerenderOnScrollTimer);\n clearTimeout(this.magnifyPageRerenderTimer);\n this.clearIntervalTimer();\n this.isPinchScrolled = false;\n };\n /**\n * @private\n */\n Magnification.prototype.clearIntervalTimer = function () {\n clearInterval(this.rerenderInterval);\n this.rerenderInterval = null;\n this.clearRendering();\n var oldCanvases = document.querySelectorAll('canvas[id*=\"oldCanvas\"]');\n for (var i = 0; i < oldCanvases.length; i++) {\n // tslint:disable-next-line\n var pageNumber = parseInt(oldCanvases[i].id.split('_oldCanvas_')[1]);\n var pageCanvas = this.pdfViewerBase.getElement('_pageCanvas_' + pageNumber);\n if (pageCanvas) {\n oldCanvases[i].id = pageCanvas.id;\n pageCanvas.parentElement.removeChild(pageCanvas);\n }\n else {\n oldCanvases[i].id = this.pdfViewer.element.id + '_pageCanvas_' + pageNumber;\n }\n if (this.pdfViewerBase.isTextMarkupAnnotationModule()) {\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.rerenderAnnotationsPinch(i);\n }\n }\n this.isRerenderCanvasCreated = false;\n };\n /**\n * @private\n */\n Magnification.prototype.pushImageObjects = function (image) {\n this.imageObjects.push(image);\n };\n Magnification.prototype.clearRendering = function () {\n if (this.imageObjects) {\n for (var j = 0; j < this.imageObjects.length; j++) {\n if (this.imageObjects[j]) {\n this.imageObjects[j].onload = null;\n }\n }\n this.imageObjects = [];\n }\n };\n Magnification.prototype.rerenderMagnifiedPages = function () {\n this.renderInSeparateThread(this.reRenderPageNumber);\n this.isPagesZoomed = false;\n };\n Magnification.prototype.renderInSeparateThread = function (pageNumber) {\n var _this = this;\n this.designNewCanvas(pageNumber);\n this.pageRerenderCount = 0;\n this.pdfViewerBase.renderedPagesList = [];\n this.pdfViewerBase.pinchZoomStorage = [];\n this.isMagnified = false;\n this.pdfViewerBase.pageViewScrollChanged(this.reRenderPageNumber);\n // tslint:disable-next-line\n var proxy = this;\n this.rerenderInterval = setInterval(function () { _this.initiateRerender(proxy); }, 1);\n };\n Magnification.prototype.responsivePages = function () {\n this.isPagesZoomed = true;\n this.clearRerenderTimer();\n if (this.pdfViewer.textSelectionModule) {\n this.pdfViewer.textSelectionModule.clearTextSelection();\n }\n var scrollValue = this.pdfViewerBase.viewerContainer.scrollTop;\n this.isAutoZoom = false;\n this.updatePageLocation();\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.pageContainer.style.height = this.topValue + this.pdfViewerBase.pageSize[this.pdfViewerBase.pageSize.length - 1].height * this.zoomFactor + 'px';\n this.resizeCanvas(this.pdfViewerBase.currentPageNumber);\n if (this.isPinchZoomed) {\n this.calculateScrollValues(scrollValue);\n }\n this.pdfViewerBase.renderedPagesList = [];\n this.pdfViewerBase.pinchZoomStorage = [];\n };\n Magnification.prototype.calculateScrollValues = function (scrollValue) {\n var pageIndex = this.pdfViewerBase.currentPageNumber - 1;\n var currentPageCanvas = this.pdfViewerBase.getElement('_pageDiv_' + pageIndex);\n if (currentPageCanvas) {\n var currentPageBounds = currentPageCanvas.getBoundingClientRect();\n // update scroll top for the viewer container based on pinch zoom factor\n var previousPageTop = (currentPageBounds.top) * this.previousZoomFactor;\n var previousY = scrollValue + this.touchCenterY;\n // tslint:disable-next-line:max-line-length\n var currentY = (currentPageBounds.top) * this.zoomFactor + ((previousY - previousPageTop) < 0 ? previousY - previousPageTop : (previousY -\n // tslint:disable-next-line:max-line-length\n previousPageTop) * (this.zoomFactor / this.previousZoomFactor));\n this.pdfViewerBase.viewerContainer.scrollTop = currentY - this.touchCenterY;\n // update scroll left for the viewer container based on pinch zoom factor\n var prevValue = (currentPageBounds.width * this.previousZoomFactor) / currentPageBounds.width;\n var scaleCorrectionFactor = this.zoomFactor / prevValue - 1;\n var scrollX_1 = this.touchCenterX - currentPageBounds.left;\n this.pdfViewerBase.viewerContainer.scrollLeft += scrollX_1 * scaleCorrectionFactor;\n }\n };\n Magnification.prototype.rerenderOnScroll = function () {\n var _this = this;\n this.isPinchZoomed = false;\n if (this.isPinchScrolled) {\n this.rerenderOnScrollTimer = null;\n this.isPinchScrolled = false;\n this.reRenderPageNumber = this.pdfViewerBase.currentPageNumber;\n this.pdfViewerBase.renderedPagesList = [];\n this.pdfViewerBase.pinchZoomStorage = [];\n if (this.pdfViewerBase.textLayer) {\n var textLayers = document.querySelectorAll('div[id*=\"_textLayer_\"]');\n for (var i = 0; i < textLayers.length; i++) {\n textLayers[i].style.display = 'block';\n }\n }\n if (this.pdfViewerBase.isTextMarkupAnnotationModule()) {\n var annotationLayers = document.querySelectorAll('canvas[id*=\"_annotationCanvas_\"]');\n for (var j = 0; j < annotationLayers.length; j++) {\n var pageNumber = annotationLayers[j].id.split('_annotationCanvas_')[1];\n // tslint:disable-next-line:radix\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.rerenderAnnotationsPinch(parseInt(pageNumber));\n }\n }\n this.pdfViewerBase.pageViewScrollChanged(this.reRenderPageNumber);\n this.isPagePinchZoomed = false;\n this.rerenderOnScrollTimer = setTimeout(function () { _this.pdfViewerBase.pageViewScrollChanged(_this.reRenderPageNumber); }, 300);\n }\n };\n /**\n * @private\n */\n Magnification.prototype.pinchMoveScroll = function () {\n var _this = this;\n if (this.isRerenderCanvasCreated) {\n this.clearIntervalTimer();\n }\n if (this.isPagesZoomed || (!this.isRerenderCanvasCreated && this.isPagePinchZoomed)) {\n this.clearRendering();\n this.isPagesZoomed = false;\n clearTimeout(this.magnifyPageRerenderTimer);\n this.isPinchScrolled = true;\n this.rerenderOnScrollTimer = setTimeout(function () { _this.rerenderOnScroll(); }, 100);\n }\n };\n // tslint:disable-next-line\n Magnification.prototype.initiateRerender = function (proxy) {\n if (proxy.pageRerenderCount === proxy.pdfViewerBase.reRenderedCount && proxy.pageRerenderCount !== 0 && proxy.pdfViewerBase.reRenderedCount !== 0) {\n proxy.reRenderAfterPinch(this.reRenderPageNumber);\n }\n };\n Magnification.prototype.reRenderAfterPinch = function (currentPageIndex) {\n this.pageRerenderCount = 0;\n var lowerPageValue = currentPageIndex - 3;\n lowerPageValue = (lowerPageValue > 0) ? lowerPageValue : 0;\n var higherPageValue = currentPageIndex + 1;\n higherPageValue = (higherPageValue < this.pdfViewerBase.pageCount) ? higherPageValue : (this.pdfViewerBase.pageCount - 1);\n for (var i = lowerPageValue; i <= higherPageValue; i++) {\n var pageDiv = this.pdfViewerBase.getElement('_pageDiv_' + i);\n var pageCanvas = this.pdfViewerBase.getElement('_pageCanvas_' + i);\n if (pageCanvas) {\n pageCanvas.style.display = 'block';\n }\n var oldCanvas = this.pdfViewerBase.getElement('_oldCanvas_' + i);\n if (oldCanvas) {\n oldCanvas.parentNode.removeChild(oldCanvas);\n }\n if (this.pdfViewerBase.isTextMarkupAnnotationModule()) {\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.rerenderAnnotations(i);\n }\n if (pageDiv) {\n pageDiv.style.visibility = 'visible';\n }\n }\n this.isRerenderCanvasCreated = false;\n this.isPagePinchZoomed = false;\n if (this.pdfViewerBase.reRenderedCount !== 0) {\n this.pdfViewerBase.reRenderedCount = 0;\n this.pageRerenderCount = 0;\n clearInterval(this.rerenderInterval);\n this.rerenderInterval = null;\n }\n this.imageObjects = [];\n };\n Magnification.prototype.designNewCanvas = function (currentPageIndex) {\n if (this.pdfViewerBase.textLayer) {\n this.pdfViewerBase.textLayer.clearTextLayers();\n }\n var lowerPageValue = currentPageIndex - 3;\n lowerPageValue = (lowerPageValue > 0) ? lowerPageValue : 0;\n var higherPageValue = currentPageIndex + 1; // jshint ignore:line\n higherPageValue = (higherPageValue < this.pdfViewerBase.pageCount) ? higherPageValue : (this.pdfViewerBase.pageCount - 1);\n for (var i = lowerPageValue; i <= higherPageValue; i++) {\n var canvas = this.pdfViewerBase.getElement('_pageCanvas_' + i);\n if (canvas) {\n canvas.id = this.pdfViewer.element.id + '_oldCanvas_' + i;\n if (this.pdfViewerBase.isTextMarkupAnnotationModule()) {\n var annotationCanvas = this.pdfViewerBase.getElement('_annotationCanvas_' + i);\n annotationCanvas.id = this.pdfViewer.element.id + '_old_annotationCanvas_' + i;\n }\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.renderPageCanvas(this.pdfViewerBase.getElement('_pageDiv_' + i), this.pdfViewerBase.pageSize[i].width * this.zoomFactor, this.pdfViewerBase.pageSize[i].height * this.zoomFactor, i, 'none');\n }\n }\n this.isRerenderCanvasCreated = true;\n };\n /**\n * @private\n */\n Magnification.prototype.pageRerenderOnMouseWheel = function () {\n var _this = this;\n if (this.isRerenderCanvasCreated) {\n this.clearIntervalTimer();\n clearTimeout(this.magnifyPageRerenderTimer);\n if (!this.isPinchScrolled) {\n this.isPinchScrolled = true;\n this.rerenderOnScrollTimer = setTimeout(function () { _this.rerenderOnScroll(); }, 100);\n }\n }\n };\n /**\n * @private\n */\n Magnification.prototype.renderCountIncrement = function () {\n if (this.isRerenderCanvasCreated) {\n this.pageRerenderCount++;\n }\n };\n /**\n * @private\n */\n Magnification.prototype.rerenderCountIncrement = function () {\n if (this.pageRerenderCount > 0) {\n this.pdfViewerBase.reRenderedCount++;\n }\n };\n Magnification.prototype.resizeCanvas = function (pageNumber) {\n var lowerPageValue = pageNumber - 3;\n lowerPageValue = (lowerPageValue > 0) ? lowerPageValue : 0;\n var higherPageValue = pageNumber + 3;\n higherPageValue = (higherPageValue < this.pdfViewerBase.pageCount) ? higherPageValue : (this.pdfViewerBase.pageCount - 1);\n for (var i = lowerPageValue; i <= higherPageValue; i++) {\n var pageDiv = this.pdfViewerBase.getElement('_pageDiv_' + i);\n var textLayer = document.getElementById(this.pdfViewer.element.id + '_textLayer_' + i);\n if (pageDiv) {\n if ((lowerPageValue <= i) && (i <= higherPageValue)) {\n var isSelectionAvailable = false;\n if (this.pdfViewer.textSelectionModule) {\n isSelectionAvailable = this.pdfViewer.textSelectionModule.isSelectionAvailableOnScroll(i);\n }\n if (this.pdfViewerBase.pageSize[i] != null) {\n var width = this.pdfViewerBase.pageSize[i].width * this.zoomFactor;\n var height = this.pdfViewerBase.pageSize[i].height * this.zoomFactor;\n pageDiv.style.width = width + 'px';\n pageDiv.style.height = height + 'px';\n // tslint:disable-next-line:max-line-length\n pageDiv.style.top = ((this.pdfViewerBase.pageSize[i].top) * this.zoomFactor) + 'px';\n if (this.pdfViewer.enableRtl) {\n pageDiv.style.right = this.pdfViewerBase.updateLeftPosition(i) + 'px';\n }\n else {\n pageDiv.style.left = this.pdfViewerBase.updateLeftPosition(i) + 'px';\n }\n var canvas = this.pdfViewerBase.getElement('_pageCanvas_' + i);\n if (canvas) {\n canvas.style.width = width + 'px';\n canvas.style.height = height + 'px';\n if (this.pdfViewerBase.isTextMarkupAnnotationModule()) {\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.resizeAnnotations(width, height, i);\n }\n }\n if (textLayer) {\n textLayer.style.width = width + 'px';\n textLayer.style.height = height + 'px';\n if (this.pdfViewer.textSelectionModule) {\n if (this.isPinchZoomed) {\n textLayer.style.display = 'none';\n }\n else if (this.isMagnified) {\n var lowerValue = ((pageNumber - 2) === 0) ? 0 : (pageNumber - 2);\n // tslint:disable-next-line:max-line-length\n var higherValue = ((pageNumber) === (this.pdfViewerBase.pageCount)) ? (this.pdfViewerBase.pageCount - 1) : pageNumber;\n if ((lowerValue <= i) && (i <= higherValue) && ((this.pdfViewer.textSelectionModule.isTextSelection && isSelectionAvailable) || this.pdfViewerBase.textLayer.getTextSearchStatus())) {\n this.pdfViewerBase.textLayer.resizeTextContentsOnZoom(i);\n if (this.pdfViewer.textSelectionModule.isTextSelection && isSelectionAvailable) {\n this.pdfViewer.textSelectionModule.applySelectionRangeOnScroll(i);\n }\n }\n else {\n textLayer.style.display = 'none';\n }\n }\n else {\n textLayer.style.display = 'none';\n }\n }\n }\n }\n }\n }\n }\n };\n Magnification.prototype.zoomOverPages = function (pointX1, pointY1, pointX2, pointY2) {\n // tslint:disable-next-line\n var currentDifference = Math.sqrt(Math.pow((pointX1 - pointX2), 2) + Math.pow((pointY1 - pointY2), 2));\n if (this.previousTouchDifference > -1) {\n if (currentDifference > this.previousTouchDifference) {\n this.pinchOut();\n }\n else if (currentDifference < this.previousTouchDifference) {\n this.pinchIn();\n }\n }\n this.previousTouchDifference = currentDifference;\n };\n /**\n * @private\n */\n Magnification.prototype.pinchMoveEnd = function () {\n this.touchCenterX = 0;\n this.touchCenterY = 0;\n this.previousTouchDifference = -1;\n if (this.isPinchZoomed) {\n this.isPinchScrolled = false;\n this.isPagePinchZoomed = true;\n this.pinchMoveScroll();\n }\n };\n /**\n * @private\n */\n Magnification.prototype.fitPageScrollMouseWheel = function (event) {\n if (this.fitType === 'fitToPage') {\n this.isMagnified = false;\n event.preventDefault();\n if (event.wheelDelta > 0) {\n this.upwardScrollFitPage(this.pdfViewerBase.currentPageNumber - 1);\n }\n else {\n this.downwardScrollFitPage(this.pdfViewerBase.currentPageNumber - 1);\n }\n }\n };\n /**\n * @private\n */\n Magnification.prototype.magnifyBehaviorKeyDown = function (event) {\n var isMac = navigator.platform.match(/(Mac|iPhone|iPod|iPad)/i) ? true : false;\n var isCommandKey = isMac ? event.metaKey : false;\n switch (event.keyCode) {\n case 38: // up arrow\n case 37: // left arrow\n case 33: // page up\n if (this.fitType === 'fitToPage' && !((event.ctrlKey || isCommandKey) && event.shiftKey)) {\n event.preventDefault();\n this.upwardScrollFitPage(this.pdfViewerBase.currentPageNumber - 1);\n }\n break;\n case 40: // down arrow\n case 39: // right arrow\n case 34: // page down\n if (this.fitType === 'fitToPage' && !((event.ctrlKey || isCommandKey) && event.shiftKey)) {\n event.preventDefault();\n this.downwardScrollFitPage(this.pdfViewerBase.currentPageNumber - 1);\n }\n break;\n case 187: // equal key\n if (event.ctrlKey || isCommandKey) {\n event.preventDefault();\n this.zoomIn();\n }\n break;\n case 189: // minus key\n if (event.ctrlKey || isCommandKey) {\n event.preventDefault();\n this.zoomOut();\n }\n break;\n case 48: // zero key\n if ((event.ctrlKey || isCommandKey) && !event.shiftKey) {\n event.preventDefault();\n this.fitToPage();\n }\n break;\n case 49: // one key\n if ((event.ctrlKey || isCommandKey) && !event.shiftKey) {\n event.preventDefault();\n this.zoomTo(100);\n }\n break;\n default:\n break;\n }\n };\n Magnification.prototype.upwardScrollFitPage = function (currentPageIndex) {\n if (currentPageIndex > 0) {\n this.pdfViewerBase.getElement('_pageDiv_' + (currentPageIndex - 1)).style.visibility = 'visible';\n this.pdfViewerBase.viewerContainer.scrollTop = this.pdfViewerBase.pageSize[currentPageIndex - 1].top * this.zoomFactor;\n this.pdfViewerBase.getElement('_pageDiv_' + (currentPageIndex)).style.visibility = 'hidden';\n }\n };\n /**\n * @private\n */\n Magnification.prototype.updatePagesForFitPage = function (currentPageIndex) {\n if (this.fitType === 'fitToPage') {\n if (currentPageIndex > 0) {\n this.pdfViewerBase.getElement('_pageDiv_' + (currentPageIndex - 1)).style.visibility = 'hidden';\n }\n if (currentPageIndex < (this.pdfViewerBase.pageCount - 1)) {\n this.pdfViewerBase.getElement('_pageDiv_' + (currentPageIndex + 1)).style.visibility = 'hidden';\n }\n }\n };\n /**\n * @private\n */\n Magnification.prototype.onDoubleTapMagnification = function () {\n this.pdfViewer.toolbarModule.showToolbar(false);\n var scrollValue = this.pdfViewerBase.viewerContainer.scrollTop;\n if (!this.isTapToFitZoom) {\n if (this.zoomFactor < 2) {\n this.zoomTo(200);\n }\n else {\n this.fitToWidth();\n }\n }\n else {\n this.zoomTo(this.previousZoomFactor * 100);\n }\n this.calculateScrollValues(scrollValue);\n this.isTapToFitZoom = !this.isTapToFitZoom;\n };\n Magnification.prototype.downwardScrollFitPage = function (currentPageIndex) {\n if (currentPageIndex !== (this.pdfViewerBase.pageCount - 1)) {\n this.pdfViewerBase.getElement('_pageDiv_' + (currentPageIndex + 1)).style.visibility = 'visible';\n this.pdfViewerBase.viewerContainer.scrollTop = this.pdfViewerBase.pageSize[currentPageIndex + 1].top * this.zoomFactor;\n if (currentPageIndex + 1 === (this.pdfViewerBase.pageCount - 1)) {\n this.pdfViewerBase.getElement('_pageDiv_' + (currentPageIndex)).style.visibility = 'hidden';\n }\n else {\n this.pdfViewerBase.getElement('_pageDiv_' + (currentPageIndex + 2)).style.visibility = 'hidden';\n }\n }\n };\n Magnification.prototype.getMagnifiedValue = function (value) {\n return (value / this.previousZoomFactor) * this.zoomFactor;\n };\n /**\n * @private\n */\n Magnification.prototype.destroy = function () {\n this.imageObjects = undefined;\n };\n /**\n * returns zoom factor when the zoom percent is passed.\n */\n Magnification.prototype.getZoomFactor = function (zoomValue) {\n return zoomValue / 100;\n };\n /**\n * @private\n */\n Magnification.prototype.getModuleName = function () {\n return 'Magnification';\n };\n return Magnification;\n}());\nexport { Magnification };\n","/**\n * Navigation module\n */\nvar Navigation = /** @class */ (function () {\n /**\n * @private\n */\n function Navigation(viewer, viewerBase) {\n this.pdfViewer = viewer;\n this.pdfViewerBase = viewerBase;\n }\n /**\n * Navigate to Next page of the PDF document\n * @returns void\n */\n Navigation.prototype.goToNextPage = function () {\n this.pageNumber = this.pdfViewerBase.currentPageNumber;\n this.pageNumber++;\n if (this.pageNumber <= this.pdfViewerBase.pageCount) {\n this.pdfViewerBase.updateScrollTop(this.pageNumber - 1);\n }\n };\n /**\n * Navigate to Previous page of the PDF document\n * @returns void\n */\n Navigation.prototype.goToPreviousPage = function () {\n this.pageNumber = this.pdfViewerBase.currentPageNumber;\n this.pageNumber--;\n if (this.pageNumber > 0) {\n this.pdfViewerBase.updateScrollTop(this.pageNumber - 1);\n }\n };\n /**\n * Navigate to given Page number\n * Note : In case if we have provided incorrect page number as argument it will retain the existing page\n * @param {number} pageNumber - Defines the page number to navigate\n * @returns void\n */\n Navigation.prototype.goToPage = function (pageNumber) {\n if (pageNumber > 0 && pageNumber <= this.pdfViewerBase.pageCount && this.pdfViewerBase.currentPageNumber !== pageNumber) {\n this.pdfViewerBase.updateScrollTop(pageNumber - 1);\n }\n };\n /**\n * Navigate to First page of the PDF document\n * @returns void\n */\n Navigation.prototype.goToFirstPage = function () {\n this.pageNumber = 0;\n this.pdfViewerBase.updateScrollTop(this.pageNumber);\n };\n /**\n * Navigate to Last page of the PDF document\n * @returns void\n */\n Navigation.prototype.goToLastPage = function () {\n this.pageNumber = this.pdfViewerBase.pageCount - 1;\n this.pdfViewerBase.updateScrollTop(this.pageNumber);\n };\n /**\n * @private\n */\n Navigation.prototype.destroy = function () {\n this.pageNumber = 0;\n };\n /**\n * @private\n */\n Navigation.prototype.getModuleName = function () {\n return 'Navigation';\n };\n return Navigation;\n}());\nexport { Navigation };\n","import { createElement } from '@syncfusion/ej2-base';\n/**\n * The `ThumbnailView` module is used to handle thumbnail view navigation of PDF viewer.\n * @hidden\n */\nvar ThumbnailView = /** @class */ (function () {\n /**\n * @private\n */\n function ThumbnailView(pdfViewer, pdfViewerBase) {\n var _this = this;\n this.thumbnailLimit = 30;\n this.thumbnailThreshold = 50;\n this.thumbnailTopMargin = 10;\n /**\n * @private\n */\n this.isThumbnailClicked = false;\n /**\n * @private\n */\n this.thumbnailClick = function (event) {\n var proxy = _this;\n var pageNumber = proxy.getPageNumberFromID(event.srcElement.id);\n if (proxy.previousElement) {\n proxy.previousElement.classList.remove('e-pv-thumbnail-selection');\n proxy.previousElement.classList.remove('e-pv-thumbnail-focus');\n proxy.previousElement.classList.add('e-pv-thumbnail-selection-ring');\n }\n if (event.srcElement.parentElement.id === proxy.pdfViewer.element.id + '_thumbnail_Selection_Ring_' + pageNumber) {\n proxy.setSelectionStyle(event.srcElement.parentElement);\n proxy.previousElement = event.srcElement.parentElement;\n }\n else if (event.srcElement.id === proxy.pdfViewer.element.id + '_thumbnail_Selection_Ring_' + pageNumber) {\n proxy.setSelectionStyle(event.srcElement);\n proxy.previousElement = event.srcElement;\n }\n proxy.isThumbnailClicked = true;\n proxy.goToThumbnailPage(pageNumber + 1);\n proxy.pdfViewerBase.focusViewerContainer();\n };\n /**\n * @private\n */\n this.thumbnailMouseOver = function (event) {\n var proxy = _this;\n var pageNumber = proxy.getPageNumberFromID(event.srcElement.id);\n if (event.srcElement.id === proxy.pdfViewer.element.id + '_thumbnail_Selection_Ring_' + pageNumber) {\n proxy.setMouseOverStyle(event.srcElement);\n }\n else if (event.srcElement.id === proxy.pdfViewer.element.id + '_thumbnail_image_' + pageNumber) {\n proxy.setMouseOverStyle(event.srcElement.parentElement);\n }\n };\n /**\n * @private\n */\n this.thumbnailMouseLeave = function (event) {\n var proxy = _this;\n var pageNumber = proxy.getPageNumberFromID(event.srcElement.id);\n if (event.srcElement.parentElement.id === proxy.pdfViewer.element.id + '_thumbnail_view') {\n proxy.setMouseLeaveStyle(event.srcElement.children[0].children[0]);\n }\n else if (event.srcElement.parentElement.id === proxy.pdfViewer.element.id + '_thumbnail_' + pageNumber) {\n proxy.setMouseLeaveStyle(event.srcElement.parentElement.children[0]);\n }\n };\n this.pdfViewer = pdfViewer;\n this.pdfViewerBase = pdfViewerBase;\n }\n /**\n * @private\n */\n ThumbnailView.prototype.createThumbnailContainer = function () {\n // tslint:disable-next-line:max-line-length\n this.thumbnailView = createElement('div', { id: this.pdfViewer.element.id + '_thumbnail_view', className: 'e-pv-thumbnail-view e-pv-thumbnail-row' });\n this.pdfViewerBase.navigationPane.sideBarContent.appendChild(this.thumbnailView);\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n ThumbnailView.prototype.createRequestForThumbnails = function () {\n var proxy = this;\n // tslint:disable-next-line\n var isIE = !!document.documentMode;\n if (!isIE) {\n // tslint:disable-next-line\n return new Promise(\n // tslint:disable-next-line\n function (renderThumbnailImage, reject) {\n proxy.requestCreation(proxy);\n });\n }\n else {\n this.requestCreation(proxy);\n return null;\n }\n };\n ThumbnailView.prototype.requestCreation = function (proxy) {\n var _this = this;\n if (!proxy.isThumbnailCompleted) {\n // tslint:disable-next-line:max-line-length\n proxy.thumbnailLimit = proxy.thumbnailLimit < proxy.pdfViewer.pageCount ? proxy.thumbnailLimit : proxy.pdfViewer.pageCount;\n if (proxy.thumbnailLimit !== proxy.pdfViewer.pageCount) {\n proxy.isThumbnailCompleted = false;\n proxy.startIndex = 0;\n }\n }\n else {\n proxy.startIndex = proxy.thumbnailLimit;\n // tslint:disable-next-line:max-line-length\n proxy.thumbnailLimit = proxy.startIndex + proxy.thumbnailThreshold < proxy.pdfViewer.pageCount ? proxy.startIndex + proxy.thumbnailThreshold : proxy.pdfViewer.pageCount;\n }\n var request = new XMLHttpRequest();\n // tslint:disable-next-line:max-line-length\n var jsonObject = { startPage: proxy.startIndex, endPage: proxy.thumbnailLimit, sizeX: 99.7, sizeY: 141, hashId: proxy.pdfViewerBase.hashId };\n request.open('POST', proxy.pdfViewer.serviceUrl + '/' + proxy.pdfViewer.serverActionSettings.renderThumbnail);\n request.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');\n request.responseType = 'json';\n request.send(JSON.stringify(jsonObject));\n // tslint:disable-next-line\n request.onreadystatechange = function (event) {\n if (request.readyState === 4 && request.status === 200) {\n // tslint:disable-next-line\n var data = event.currentTarget.response;\n if (typeof data !== 'object') {\n data = JSON.parse(data);\n }\n proxy.renderThumbnailImage(data);\n if (!proxy.isThumbnailCompleted) {\n proxy.startIndex = proxy.thumbnailLimit;\n proxy.isThumbnailCompleted = true;\n }\n }\n };\n // tslint:disable-next-line\n request.onerror = function (event) {\n _this.pdfViewerBase.openNotificationPopup();\n proxy.pdfViewer.fireAjaxRequestFailed(request.status, request.statusText);\n };\n };\n /**\n * @private\n */\n ThumbnailView.prototype.gotoThumbnailImage = function (pageNumber) {\n var shouldScroll = this.checkThumbnailScroll(pageNumber);\n if (this.thumbnailView) {\n var thumbnailChild = this.thumbnailView.children[pageNumber];\n if (thumbnailChild) {\n var thumbnailDiv = thumbnailChild.children[0];\n if (shouldScroll) {\n var offsetTop = thumbnailDiv.offsetTop + thumbnailDiv.clientTop - this.thumbnailTopMargin;\n this.pdfViewerBase.navigationPane.sideBarContent.scrollTop = offsetTop;\n }\n if (!this.isThumbnailClicked) {\n if (this.previousElement) {\n this.previousElement.classList.remove('e-pv-thumbnail-selection');\n this.previousElement.classList.remove('e-pv-thumbnail-focus');\n this.previousElement.classList.remove('e-pv-thumbnail-hover');\n this.previousElement.classList.add('e-pv-thumbnail-selection-ring');\n }\n this.setFocusStyle(thumbnailDiv, pageNumber);\n }\n this.previousElement = thumbnailDiv.children[0];\n }\n }\n };\n ThumbnailView.prototype.checkThumbnailScroll = function (pageNumber) {\n var shouldScroll = false;\n if (this.thumbnailView) {\n var visibleThumbs = this.getVisibleThumbs();\n var numVisibleThumbs = visibleThumbs.views.length;\n // if the thumbnail isn't currently visible, scroll it into view.\n if (numVisibleThumbs > 0) {\n var visibleFirstPageID = this.getPageNumberFromID(visibleThumbs.first.id);\n // account for only one thumbnail being visible.\n // tslint:disable-next-line:max-line-length\n var visibleLastPageID = (numVisibleThumbs > 1 ? this.getPageNumberFromID(visibleThumbs.last.id) : visibleFirstPageID);\n if (pageNumber <= visibleFirstPageID || pageNumber >= visibleLastPageID) {\n shouldScroll = true;\n }\n else {\n // tslint:disable-next-line\n visibleThumbs.views.some(function (view) {\n var pageID = view.id.split('_');\n var thumbPageNumber = pageID[pageID.length - 1];\n // tslint:disable-next-line:radix\n if (parseInt(thumbPageNumber) !== pageNumber) {\n return false;\n }\n shouldScroll = view.percent < 100;\n return true;\n });\n }\n }\n }\n return shouldScroll;\n };\n ThumbnailView.prototype.getPageNumberFromID = function (pageId) {\n var pageID = pageId.split('_');\n var pageNumber = pageID[pageID.length - 1];\n // tslint:disable-next-line:radix\n return parseInt(pageNumber);\n };\n ThumbnailView.prototype.setFocusStyle = function (thumbnail, pageNumber) {\n if (thumbnail.children[0].id === this.pdfViewer.element.id + '_thumbnail_Selection_Ring_' + pageNumber) {\n this.setMouseFocusStyle(thumbnail.children[0]);\n }\n };\n // tslint:disable-next-line\n ThumbnailView.prototype.renderThumbnailImage = function (data) {\n if (this.thumbnailView) {\n for (var i = this.startIndex; i < this.thumbnailLimit; i++) {\n // tslint:disable-next-line:max-line-length\n var pageLink = createElement('a', { id: 'page_' + i, attrs: { 'aria-label': 'Thumbnail of Page' + (i + 1), 'tabindex': '-1', 'role': 'link' } });\n // tslint:disable-next-line:max-line-length\n var thumbnail = createElement('div', { id: this.pdfViewer.element.id + '_thumbnail_' + i, className: 'e-pv-thumbnail e-pv-thumbnail-column' });\n // tslint:disable-next-line:max-line-length\n this.thumbnailSelectionRing = createElement('div', { id: this.pdfViewer.element.id + '_thumbnail_Selection_Ring_' + i, className: 'e-pv-thumbnail-selection-ring' });\n thumbnail.appendChild(this.thumbnailSelectionRing);\n // tslint:disable-next-line:max-line-length\n var thumbnailPageNumber = createElement('div', { id: this.pdfViewer.element.id + '_thumbnail_pagenumber_' + i, className: 'e-pv-thumbnail-number' });\n thumbnailPageNumber.textContent = (i + 1).toString();\n thumbnail.appendChild(thumbnailPageNumber);\n // tslint:disable-next-line:max-line-length\n this.thumbnailImage = createElement('img', { id: this.pdfViewer.element.id + '_thumbnail_image_' + i, className: 'e-pv-thumbnail-image' });\n this.thumbnailImage.src = data.thumbnailImage[i];\n this.thumbnailSelectionRing.appendChild(this.thumbnailImage);\n pageLink.appendChild(thumbnail);\n this.thumbnailView.appendChild(pageLink);\n this.wireUpEvents();\n if (i === 0) {\n this.setMouseFocusToFirstPage();\n }\n }\n }\n this.pdfViewerBase.navigationPane.enableThumbnailButton();\n if (this.thumbnailLimit !== this.pdfViewerBase.pageCount && this.thumbnailView) {\n // tslint:disable-next-line\n var isIE = !!document.documentMode;\n if (!isIE) {\n Promise.all([this.createRequestForThumbnails()]);\n }\n else {\n this.createRequestForThumbnails();\n }\n }\n };\n ThumbnailView.prototype.wireUpEvents = function () {\n if (this.thumbnailSelectionRing) {\n this.thumbnailSelectionRing.addEventListener('click', this.thumbnailClick);\n this.thumbnailSelectionRing.addEventListener('mouseover', this.thumbnailMouseOver);\n this.thumbnailSelectionRing.addEventListener('mouseleave', this.thumbnailMouseLeave);\n }\n };\n ThumbnailView.prototype.unwireUpEvents = function () {\n if (this.thumbnailSelectionRing && this.thumbnailImage) {\n this.thumbnailSelectionRing.removeEventListener('click', this.thumbnailClick);\n this.thumbnailSelectionRing.removeEventListener('mouseover', this.thumbnailMouseOver);\n this.thumbnailSelectionRing.removeEventListener('mouseleave', this.thumbnailMouseLeave);\n }\n };\n ThumbnailView.prototype.goToThumbnailPage = function (pageNumber) {\n if (pageNumber > 0 && pageNumber <= this.pdfViewerBase.pageCount && this.pdfViewerBase.currentPageNumber !== pageNumber) {\n this.pdfViewerBase.updateScrollTop(pageNumber - 1);\n }\n else {\n this.isThumbnailClicked = false;\n }\n };\n ThumbnailView.prototype.setSelectionStyle = function (thumbnailElement) {\n thumbnailElement.classList.remove('e-pv-thumbnail-selection-ring');\n thumbnailElement.classList.remove('e-pv-thumbnail-hover');\n thumbnailElement.classList.remove('e-pv-thumbnail-focus');\n thumbnailElement.classList.add('e-pv-thumbnail-selection');\n };\n ThumbnailView.prototype.setMouseOverStyle = function (thumbnailElement) {\n // tslint:disable-next-line:max-line-length\n if (!thumbnailElement.classList.contains('e-pv-thumbnail-selection')) {\n thumbnailElement.classList.remove('e-pv-thumbnail-selection-ring');\n if (!thumbnailElement.classList.contains('e-pv-thumbnail-focus')) {\n thumbnailElement.classList.add('e-pv-thumbnail-hover');\n }\n }\n };\n ThumbnailView.prototype.setMouseLeaveStyle = function (thumbnailElement) {\n if (!thumbnailElement.classList.contains('e-pv-thumbnail-selection')) {\n if (!thumbnailElement.classList.contains('e-pv-thumbnail-focus')) {\n thumbnailElement.classList.add('e-pv-thumbnail-selection-ring');\n }\n thumbnailElement.classList.remove('e-pv-thumbnail-hover');\n }\n else {\n if (!thumbnailElement.classList.contains('e-pv-thumbnail-selection')) {\n thumbnailElement.classList.remove('e-pv-thumbnail-selection');\n thumbnailElement.classList.add('e-pv-thumbnail-focus');\n }\n }\n };\n ThumbnailView.prototype.setMouseFocusStyle = function (thumbnailElement) {\n thumbnailElement.classList.remove('e-pv-thumbnail-selection');\n thumbnailElement.classList.remove('e-pv-thumbnail-hover');\n thumbnailElement.classList.add('e-pv-thumbnail-focus');\n };\n ThumbnailView.prototype.setMouseFocusToFirstPage = function () {\n var thumbnailChild = this.thumbnailView.children[0];\n if (thumbnailChild) {\n var thumbnailDiv = thumbnailChild.children[0].children[0];\n this.setMouseFocusStyle(thumbnailDiv);\n this.previousElement = thumbnailDiv;\n }\n };\n /**\n * @private\n */\n ThumbnailView.prototype.clear = function () {\n this.startIndex = 0;\n this.thumbnailLimit = 0;\n this.isThumbnailCompleted = false;\n if (this.pdfViewerBase.navigationPane) {\n if (this.pdfViewerBase.navigationPane.sideBarContentContainer) {\n this.pdfViewerBase.navigationPane.sideBarContentContainer.style.display = 'block';\n this.pdfViewerBase.navigationPane.sideBarContent.scrollTop = 0;\n this.pdfViewerBase.navigationPane.sideBarContentContainer.style.display = 'none';\n }\n }\n if (this.thumbnailView) {\n while (this.thumbnailView.hasChildNodes()) {\n this.thumbnailView.removeChild(this.thumbnailView.lastChild);\n }\n }\n if (this.pdfViewerBase.navigationPane) {\n this.pdfViewerBase.navigationPane.resetThumbnailView();\n }\n this.unwireUpEvents();\n };\n ThumbnailView.prototype.getVisibleThumbs = function () {\n return this.getVisibleElements(this.pdfViewerBase.navigationPane.sideBarContent, this.thumbnailView.children);\n };\n ThumbnailView.prototype.getVisibleElements = function (scrollElement, thumbnailViewChildren) {\n var top = scrollElement.scrollTop;\n var bottom = top + scrollElement.clientHeight;\n var left = scrollElement.scrollLeft;\n var right = left + scrollElement.clientWidth;\n function isThumbnailElementBottomAfterViewTop(thumbnailViewChildrenElement) {\n var elementBottom = thumbnailViewChildrenElement.offsetTop + thumbnailViewChildrenElement.clientTop + thumbnailViewChildrenElement.clientHeight;\n return elementBottom > top;\n }\n // tslint:disable-next-line\n var visible = [];\n var thumbnailView;\n var element;\n var currentHeight;\n var viewHeight;\n var viewBottom;\n var hiddenHeight;\n var currentWidth;\n var viewWidth;\n var viewRight;\n var hiddenWidth;\n var percentVisible;\n var firstVisibleElementInd = thumbnailViewChildren.length === 0 ? 0 :\n this.binarySearchFirstItem(thumbnailViewChildren, isThumbnailElementBottomAfterViewTop);\n if (thumbnailViewChildren.length > 0) {\n firstVisibleElementInd =\n this.backtrackBeforeAllVisibleElements(firstVisibleElementInd, thumbnailViewChildren, top);\n }\n var lastEdge = -1;\n for (var i = firstVisibleElementInd, ii = thumbnailViewChildren.length; i < ii; i++) {\n thumbnailView = this.getThumbnailElement(i);\n element = thumbnailView;\n currentWidth = element.offsetLeft + element.clientLeft;\n currentHeight = element.offsetTop + element.clientTop;\n viewWidth = element.clientWidth;\n viewHeight = element.clientHeight;\n viewRight = currentWidth + viewWidth;\n viewBottom = currentHeight + viewHeight;\n if (lastEdge === -1) {\n if (viewBottom >= bottom) {\n lastEdge = viewBottom;\n }\n }\n else if (currentHeight > lastEdge) {\n break;\n }\n if (viewBottom <= top || currentHeight >= bottom ||\n viewRight <= left || currentWidth >= right) {\n continue;\n }\n hiddenHeight = Math.max(0, top - currentHeight) +\n Math.max(0, viewBottom - bottom);\n hiddenWidth = Math.max(0, left - currentWidth) +\n Math.max(0, viewRight - right);\n // tslint:disable-next-line:no-bitwise\n percentVisible = ((viewHeight - hiddenHeight) * (viewWidth - hiddenWidth) * 100 / viewHeight / viewWidth) | 0;\n visible.push({\n id: thumbnailView.id,\n x: currentWidth,\n y: currentHeight,\n view: thumbnailView,\n percent: percentVisible,\n });\n }\n var first = visible[0];\n var last = visible[visible.length - 1];\n return { first: first, last: last, views: visible, };\n };\n // tslint:disable-next-line\n ThumbnailView.prototype.binarySearchFirstItem = function (items, condition) {\n var minIndex = 0;\n var maxIndex = items.length - 1;\n if (items.length === 0 || !condition(this.getThumbnailElement(maxIndex))) {\n return items.length - 1;\n }\n if (condition(this.getThumbnailElement(minIndex))) {\n return minIndex;\n }\n while (minIndex < maxIndex) {\n // tslint:disable-next-line:no-bitwise\n var currentIndex = (minIndex + maxIndex) >> 1;\n if (condition(this.getThumbnailElement(currentIndex))) {\n maxIndex = currentIndex;\n }\n else {\n minIndex = currentIndex + 1;\n }\n }\n return minIndex; /* === maxIndex */\n };\n ThumbnailView.prototype.backtrackBeforeAllVisibleElements = function (index, views, top) {\n if (index < 2) {\n return index;\n }\n var thumbnailElement = this.getThumbnailElement(index);\n var pageTop = thumbnailElement.offsetTop + thumbnailElement.clientTop;\n if (pageTop >= top) {\n thumbnailElement = this.getThumbnailElement(index - 1);\n pageTop = thumbnailElement.offsetTop + thumbnailElement.clientTop;\n }\n for (var i = index - 2; i >= 0; --i) {\n thumbnailElement = this.getThumbnailElement(i);\n if (thumbnailElement.offsetTop + thumbnailElement.clientTop + thumbnailElement.clientHeight <= pageTop) {\n break;\n }\n index = i;\n }\n return index;\n };\n ThumbnailView.prototype.getThumbnailElement = function (index) {\n var thumbnailChild = this.thumbnailView.children[index];\n return thumbnailChild.children[0];\n };\n /**\n * @private\n */\n ThumbnailView.prototype.destroy = function () {\n this.clear();\n };\n /**\n * @private\n */\n ThumbnailView.prototype.getModuleName = function () {\n return 'ThumbnailView';\n };\n return ThumbnailView;\n}());\nexport { ThumbnailView };\n","import { createElement, Browser } from '@syncfusion/ej2-base';\nimport { Toolbar as tool } from '@syncfusion/ej2-navigations';\nimport { NumericTextBox } from '@syncfusion/ej2-inputs';\nimport { ComboBox } from '@syncfusion/ej2-dropdowns';\nimport { AnnotationToolbar } from '../index';\nimport { Tooltip } from '@syncfusion/ej2-popups';\nimport { DropDownButton } from '@syncfusion/ej2-splitbuttons';\n/**\n * Toolbar module\n */\nvar Toolbar = /** @class */ (function () {\n /**\n * @private\n */\n function Toolbar(viewer, viewerBase) {\n var _this = this;\n this.isPageNavigationToolDisabled = false;\n this.isMagnificationToolDisabled = false;\n this.isSelectionToolDisabled = false;\n this.isScrollingToolDisabled = false;\n this.isOpenBtnVisible = true;\n this.isNavigationToolVisible = true;\n this.isMagnificationToolVisible = true;\n this.isSelectionBtnVisible = true;\n this.isScrollingBtnVisible = true;\n this.isDownloadBtnVisible = true;\n this.isPrintBtnVisible = true;\n this.isSearchBtnVisible = true;\n this.isTextSearchBoxDisplayed = false;\n this.isUndoRedoBtnsVisible = true;\n this.isAnnotationEditBtnVisible = true;\n this.onToolbarKeydown = function (event) {\n var targetId = event.target.id;\n if (!(targetId === _this.pdfViewer.element.id + '_currentPageInput' || targetId === _this.pdfViewer.element.id + '_zoomDropDown')) {\n event.preventDefault();\n event.stopPropagation();\n }\n };\n this.toolbarClickHandler = function (args) {\n // tslint:disable-next-line:max-line-length\n if (!Browser.isDevice) {\n if (args.originalEvent.target === _this.zoomDropdownItem.parentElement.childNodes[1] || args.originalEvent.target === _this.zoomDropdownItem.parentElement.childNodes[2]) {\n args.cancel = true;\n }\n else if (args.originalEvent.target.id === _this.pdfViewer.element.id + '_openIcon') {\n var tooltipData = args.originalEvent.target.parentElement.dataset;\n if (tooltipData && tooltipData.tooltipId) {\n var tooltipElement = document.getElementById(tooltipData.tooltipId);\n if (tooltipElement) {\n tooltipElement.style.display = 'none';\n }\n }\n }\n }\n _this.handleToolbarButtonClick(args);\n // tslint:disable-next-line:max-line-length\n if (!Browser.isDevice) {\n if (!(args.originalEvent.target === _this.zoomDropdownItem.parentElement.childNodes[1] || args.originalEvent.target === _this.zoomDropdownItem.parentElement.childNodes[2] || args.originalEvent.target === _this.currentPageBoxElement || args.originalEvent.target === _this.textSearchItem.childNodes[0])) {\n args.originalEvent.target.blur();\n _this.pdfViewerBase.focusViewerContainer();\n }\n }\n };\n // tslint:disable-next-line\n this.loadDocument = function (args) {\n // tslint:disable-next-line\n var upoadedFiles = args.target.files;\n if (args.target.files[0] !== null) {\n var uploadedFile = upoadedFiles[0];\n if (uploadedFile) {\n _this.uploadedDocumentName = uploadedFile.name;\n var reader = new FileReader();\n reader.readAsDataURL(uploadedFile);\n // tslint:disable-next-line\n reader.onload = function (e) {\n var uploadedFileUrl = e.currentTarget.result;\n _this.pdfViewer.load(uploadedFileUrl, null);\n };\n }\n }\n };\n this.navigateToPage = function (args) {\n if (args.which === 13) {\n // tslint:disable-next-line\n var enteredValue = parseInt(_this.currentPageBoxElement.value);\n if (enteredValue !== null) {\n if (enteredValue > 0 && enteredValue <= _this.pdfViewerBase.pageCount) {\n if (_this.pdfViewer.navigationModule) {\n _this.pdfViewer.navigationModule.goToPage(enteredValue);\n }\n }\n else {\n _this.updateCurrentPage(_this.pdfViewerBase.currentPageNumber);\n }\n }\n else {\n _this.updateCurrentPage(_this.pdfViewerBase.currentPageNumber);\n }\n _this.currentPageBoxElement.blur();\n _this.pdfViewerBase.focusViewerContainer();\n }\n };\n this.textBoxFocusOut = function () {\n // tslint:disable-next-line\n if (_this.currentPageBox.value === null || _this.currentPageBox.value >= _this.pdfViewerBase.pageCount || _this.currentPageBox.value !== _this.pdfViewerBase.currentPageNumber) {\n _this.updateCurrentPage(_this.pdfViewerBase.currentPageNumber);\n }\n };\n this.pdfViewer = viewer;\n this.pdfViewerBase = viewerBase;\n }\n /**\n * @private\n */\n Toolbar.prototype.intializeToolbar = function (width) {\n var toolbarDiv = this.createToolbar(width);\n // tslint:disable-next-line\n var isIE = !!document.documentMode;\n if (isIE) {\n this.totalPageItem.classList.add('e-pv-total-page-ms');\n }\n this.createFileElement(toolbarDiv);\n this.wireEvent();\n this.updateToolbarItems();\n if (!Browser.isDevice) {\n this.applyToolbarSettings();\n this.initialEnableItems();\n this.pdfViewerBase.navigationPane.adjustPane();\n }\n if (this.pdfViewer.annotationModule) {\n this.annotationToolbarModule = new AnnotationToolbar(this.pdfViewer, this.pdfViewerBase, this);\n if (!Browser.isDevice) {\n this.annotationToolbarModule.initializeAnnotationToolbar();\n }\n }\n return toolbarDiv;\n };\n /**\n * Shows /hides the toolbar in the PdfViewer\n * @param {boolean} enableToolbar - If set true , its show the Toolbar\n * @returns void\n */\n Toolbar.prototype.showToolbar = function (enableToolbar) {\n var toolbar = this.toolbarElement;\n if (enableToolbar) {\n toolbar.style.display = 'block';\n if (Browser.isDevice) {\n this.pdfViewer.toolbarModule.annotationToolbarModule.hideMobileAnnotationToolbar();\n }\n }\n else {\n toolbar.style.display = 'none';\n if (!Browser.isDevice) {\n this.pdfViewerBase.navigationPane.sideBarToolbar.style.display = 'none';\n }\n }\n };\n /**\n * Shows/hides the Navigation toolbar in the PdfViewer\n * @param {boolean} enableNavigationToolbar - If set true , its show the Navigation Toolbar\n * @returns void\n */\n Toolbar.prototype.showNavigationToolbar = function (enableNavigationToolbar) {\n if (!Browser.isDevice) {\n var navigationToolbar = this.pdfViewerBase.navigationPane.sideBarToolbar;\n var navigationToolbarSplitter = this.pdfViewerBase.navigationPane.sideBarToolbarSplitter;\n if (enableNavigationToolbar) {\n navigationToolbar.style.display = 'block';\n navigationToolbarSplitter.style.display = 'block';\n if (this.pdfViewerBase.navigationPane.isBookmarkOpen || this.pdfViewerBase.navigationPane.isThumbnailOpen) {\n this.pdfViewerBase.navigationPane.clear();\n }\n }\n else {\n navigationToolbar.style.display = 'none';\n navigationToolbarSplitter.style.display = 'none';\n if (this.pdfViewerBase.navigationPane.isBookmarkOpen || this.pdfViewerBase.navigationPane.isThumbnailOpen) {\n this.pdfViewerBase.navigationPane.updateViewerContainerOnClose();\n }\n }\n }\n };\n /**\n * Shows /hides the the toolbar items in the PdfViewer\n * @param {string[]} items - Defines the toolbar items in the toolbar\n * @param {boolean} isVisible - If set true, then its show the toolbar Items\n * @returns void\n */\n Toolbar.prototype.showToolbarItem = function (items, isVisible) {\n for (var i = 0; i < items.length; i++) {\n switch (items[i]) {\n case 'OpenOption':\n this.showOpenOption(isVisible);\n break;\n case 'PageNavigationTool':\n this.showPageNavigationTool(isVisible);\n break;\n case 'MagnificationTool':\n this.showMagnificationTool(isVisible);\n break;\n case 'SelectionTool':\n this.showSelectionTool(isVisible);\n break;\n case 'PanTool':\n this.showScrollingTool(isVisible);\n break;\n case 'DownloadOption':\n this.showDownloadOption(isVisible);\n break;\n case 'PrintOption':\n this.showPrintOption(isVisible);\n break;\n case 'SearchOption':\n this.showSearchOption(isVisible);\n break;\n case 'UndoRedoTool':\n this.showUndoRedoTool(isVisible);\n break;\n case 'AnnotationEditTool':\n this.showAnnotationEditTool(isVisible);\n break;\n }\n }\n this.applyHideToToolbar(true, 1, 1);\n this.applyHideToToolbar(true, 8, 8);\n this.applyHideToToolbar(true, 12, 12);\n this.applyHideToToolbar(true, 15, 15);\n this.showSeparator(items);\n };\n /**\n * Enables /disables the the toolbar items in the PdfViewer\n * @param {string[]} items - Defines the toolbar items in the toolbar\n * @param {boolean} isEnable - If set true, then its Enable the toolbar Items\n * @returns void\n */\n Toolbar.prototype.enableToolbarItem = function (items, isEnable) {\n for (var i = 0; i < items.length; i++) {\n switch (items[i]) {\n case 'OpenOption':\n this.enableOpenOption(isEnable);\n break;\n case 'PageNavigationTool':\n this.isPageNavigationToolDisabled = isEnable;\n this.enablePageNavigationTool(isEnable);\n break;\n case 'MagnificationTool':\n this.isMagnificationToolDisabled = isEnable;\n this.enableMagnificationTool(isEnable);\n break;\n case 'SelectionTool':\n this.isSelectionToolDisabled = isEnable;\n this.enableSelectionTool(isEnable);\n break;\n case 'PanTool':\n this.isScrollingToolDisabled = isEnable;\n this.enableScrollingTool(isEnable);\n break;\n case 'DownloadOption':\n this.enableDownloadOption(isEnable);\n break;\n case 'PrintOption':\n this.enablePrintOption(isEnable);\n break;\n case 'SearchOption':\n this.enableSearchOption(isEnable);\n break;\n case 'UndoRedoTool':\n this.enableUndoRedoTool(isEnable);\n break;\n case 'AnnotationEditTool':\n this.enableAnnotationEditTool(isEnable);\n break;\n }\n }\n };\n Toolbar.prototype.showOpenOption = function (enableOpenOption) {\n this.isOpenBtnVisible = enableOpenOption;\n this.applyHideToToolbar(enableOpenOption, 0, 0);\n };\n Toolbar.prototype.showPageNavigationTool = function (enablePageNavigationTool) {\n this.isNavigationToolVisible = enablePageNavigationTool;\n this.applyHideToToolbar(enablePageNavigationTool, 2, 7);\n };\n Toolbar.prototype.showMagnificationTool = function (enableMagnificationTool) {\n this.isMagnificationToolVisible = enableMagnificationTool;\n this.applyHideToToolbar(enableMagnificationTool, 9, 11);\n };\n Toolbar.prototype.showSelectionTool = function (enableSelectionTool) {\n this.isSelectionBtnVisible = enableSelectionTool;\n this.applyHideToToolbar(enableSelectionTool, 13, 13);\n };\n Toolbar.prototype.showScrollingTool = function (enableScrollingTool) {\n this.isScrollingBtnVisible = enableScrollingTool;\n this.applyHideToToolbar(enableScrollingTool, 14, 14);\n };\n Toolbar.prototype.showDownloadOption = function (enableDownloadOption) {\n this.isDownloadBtnVisible = enableDownloadOption;\n this.applyHideToToolbar(enableDownloadOption, 21, 21);\n };\n Toolbar.prototype.showPrintOption = function (enablePrintOption) {\n this.isPrintBtnVisible = enablePrintOption;\n this.applyHideToToolbar(enablePrintOption, 20, 20);\n };\n Toolbar.prototype.showSearchOption = function (enableSearchOption) {\n this.isSearchBtnVisible = enableSearchOption;\n this.applyHideToToolbar(enableSearchOption, 18, 18);\n };\n Toolbar.prototype.showUndoRedoTool = function (isEnable) {\n this.isUndoRedoBtnsVisible = isEnable;\n this.applyHideToToolbar(isEnable, 16, 17);\n };\n Toolbar.prototype.showAnnotationEditTool = function (isEnable) {\n this.isAnnotationEditBtnVisible = isEnable;\n this.applyHideToToolbar(isEnable, 19, 19);\n };\n Toolbar.prototype.enableOpenOption = function (enableOpenOption) {\n this.toolbar.enableItems(this.openDocumentItem.parentElement, enableOpenOption);\n };\n Toolbar.prototype.enablePageNavigationTool = function (enablePageNavigationTool) {\n this.toolbar.enableItems(this.firstPageItem.parentElement, enablePageNavigationTool);\n this.toolbar.enableItems(this.previousPageItem.parentElement, enablePageNavigationTool);\n this.toolbar.enableItems(this.nextPageItem.parentElement, enablePageNavigationTool);\n this.toolbar.enableItems(this.lastPageItem.parentElement, enablePageNavigationTool);\n this.currentPageBox.readonly = !enablePageNavigationTool;\n };\n Toolbar.prototype.enableMagnificationTool = function (enableMagnificationTool) {\n this.toolbar.enableItems(this.zoomInItem.parentElement, enableMagnificationTool);\n this.toolbar.enableItems(this.zoomOutItem.parentElement, enableMagnificationTool);\n this.zoomDropDown.readonly = !enableMagnificationTool;\n };\n Toolbar.prototype.enableSelectionTool = function (enableSelectionTool) {\n this.toolbar.enableItems(this.textSelectItem.parentElement, enableSelectionTool);\n };\n Toolbar.prototype.enableScrollingTool = function (enableScrollingTool) {\n this.toolbar.enableItems(this.panItem.parentElement, enableScrollingTool);\n };\n Toolbar.prototype.enableDownloadOption = function (enableDownloadOption) {\n this.toolbar.enableItems(this.downloadItem.parentElement, enableDownloadOption);\n };\n Toolbar.prototype.enablePrintOption = function (enablePrintOption) {\n this.toolbar.enableItems(this.printItem.parentElement, enablePrintOption);\n };\n Toolbar.prototype.enableSearchOption = function (enableSearchOption) {\n this.toolbar.enableItems(this.textSearchItem.parentElement, enableSearchOption);\n };\n Toolbar.prototype.enableUndoRedoTool = function (isEnable) {\n this.toolbar.enableItems(this.undoItem.parentElement, isEnable);\n this.toolbar.enableItems(this.redoItem.parentElement, isEnable);\n };\n Toolbar.prototype.enableAnnotationEditTool = function (isEnable) {\n this.toolbar.enableItems(this.annotationItem.parentElement, isEnable);\n };\n /**\n * @private\n */\n Toolbar.prototype.resetToolbar = function () {\n if (!Browser.isDevice) {\n this.currentPageBox.min = 0;\n this.currentPageBox.value = 0;\n this.updateTotalPage();\n this.updateToolbarItems();\n if (this.annotationToolbarModule) {\n this.annotationToolbarModule.clear();\n }\n }\n };\n /**\n * @private\n */\n Toolbar.prototype.updateToolbarItems = function () {\n if (!Browser.isDevice) {\n if (this.pdfViewerBase.pageCount === 0) {\n this.toolbar.enableItems(this.downloadItem.parentElement, false);\n this.toolbar.enableItems(this.printItem.parentElement, false);\n this.updateUndoRedoButtons();\n this.updateNavigationButtons();\n this.toolbar.enableItems(this.zoomInItem.parentElement, false);\n this.toolbar.enableItems(this.zoomOutItem.parentElement, false);\n if (this.pdfViewer.magnificationModule) {\n this.zoomDropDown.readonly = true;\n }\n this.toolbar.enableItems(this.pdfViewerBase.getElement('_currentPageInputContainer'), false);\n this.toolbar.enableItems(this.pdfViewerBase.getElement('_zoomDropDownContainer'), false);\n this.toolbar.enableItems(this.textSelectItem.parentElement, false);\n this.toolbar.enableItems(this.annotationItem.parentElement, false);\n this.toolbar.enableItems(this.panItem.parentElement, false);\n this.toolbar.enableItems(this.textSearchItem.parentElement, false);\n this.deSelectItem(this.annotationItem);\n if (this.annotationToolbarModule) {\n this.annotationToolbarModule.resetToolbar();\n }\n }\n else if (this.pdfViewerBase.pageCount > 0) {\n this.toolbar.enableItems(this.downloadItem.parentElement, true);\n this.toolbar.enableItems(this.printItem.parentElement, true);\n this.toolbar.enableItems(this.pdfViewerBase.getElement('_currentPageInputContainer'), true);\n this.toolbar.enableItems(this.pdfViewerBase.getElement('_zoomDropDownContainer'), true);\n this.updateUndoRedoButtons();\n this.updateNavigationButtons();\n this.updateZoomButtons();\n if (this.pdfViewer.magnificationModule) {\n this.zoomDropDown.readonly = false;\n }\n this.updateInteractionItems();\n // modify this condition if new annotation types are added.\n if (this.pdfViewer.annotationModule && this.pdfViewer.enableAnnotation) {\n this.toolbar.enableItems(this.annotationItem.parentElement, true);\n }\n if (this.pdfViewer.textSearchModule && this.pdfViewer.enableTextSearch) {\n this.toolbar.enableItems(this.textSearchItem.parentElement, true);\n }\n }\n if (this.pdfViewer.annotationToolbarSettings.annotationToolbarItem.length === 0 || !this.pdfViewer.annotationModule) {\n this.enableToolbarItem(['AnnotationEditTool'], false);\n }\n }\n else {\n if (this.pdfViewerBase.pageCount === 0) {\n this.toolbar.enableItems(this.textSearchItem.parentElement, false);\n this.toolbar.enableItems(this.moreOptionItem.parentElement, false);\n }\n else if (this.pdfViewerBase.pageCount > 0) {\n this.toolbar.enableItems(this.textSearchItem.parentElement, true);\n this.toolbar.enableItems(this.moreOptionItem.parentElement, true);\n this.updateUndoRedoButtons();\n }\n }\n };\n /**\n * @private\n */\n Toolbar.prototype.updateNavigationButtons = function () {\n if (this.pdfViewer.navigationModule && !this.isPageNavigationToolDisabled) {\n if (this.pdfViewerBase.pageCount === 0 || (this.pdfViewerBase.currentPageNumber === 1 && this.pdfViewerBase.pageCount === 1)) {\n this.toolbar.enableItems(this.firstPageItem.parentElement, false);\n this.toolbar.enableItems(this.previousPageItem.parentElement, false);\n this.toolbar.enableItems(this.nextPageItem.parentElement, false);\n this.toolbar.enableItems(this.lastPageItem.parentElement, false);\n }\n else if (this.pdfViewerBase.currentPageNumber === 1 && this.pdfViewerBase.pageCount > 0) {\n this.toolbar.enableItems(this.firstPageItem.parentElement, false);\n this.toolbar.enableItems(this.previousPageItem.parentElement, false);\n this.toolbar.enableItems(this.nextPageItem.parentElement, true);\n this.toolbar.enableItems(this.lastPageItem.parentElement, true);\n }\n else if (this.pdfViewerBase.currentPageNumber === this.pdfViewerBase.pageCount && this.pdfViewerBase.pageCount > 0) {\n this.toolbar.enableItems(this.firstPageItem.parentElement, true);\n this.toolbar.enableItems(this.previousPageItem.parentElement, true);\n this.toolbar.enableItems(this.nextPageItem.parentElement, false);\n this.toolbar.enableItems(this.lastPageItem.parentElement, false);\n }\n else if (this.pdfViewerBase.currentPageNumber > 1 && this.pdfViewerBase.currentPageNumber < this.pdfViewerBase.pageCount) {\n this.toolbar.enableItems(this.firstPageItem.parentElement, true);\n this.toolbar.enableItems(this.previousPageItem.parentElement, true);\n this.toolbar.enableItems(this.nextPageItem.parentElement, true);\n this.toolbar.enableItems(this.lastPageItem.parentElement, true);\n }\n }\n else {\n this.toolbar.enableItems(this.firstPageItem.parentElement, false);\n this.toolbar.enableItems(this.previousPageItem.parentElement, false);\n this.toolbar.enableItems(this.nextPageItem.parentElement, false);\n this.toolbar.enableItems(this.lastPageItem.parentElement, false);\n this.currentPageBox.readonly = true;\n }\n };\n /**\n * @private\n */\n Toolbar.prototype.updateZoomButtons = function () {\n if (this.pdfViewer.magnificationModule && !this.isMagnificationToolDisabled && !Browser.isDevice) {\n if (this.pdfViewer.magnificationModule.zoomFactor <= 0.5) {\n this.toolbar.enableItems(this.zoomInItem.parentElement, true);\n this.toolbar.enableItems(this.zoomOutItem.parentElement, false);\n }\n else if (this.pdfViewer.magnificationModule.zoomFactor >= 4) {\n this.toolbar.enableItems(this.zoomInItem.parentElement, false);\n this.toolbar.enableItems(this.zoomOutItem.parentElement, true);\n }\n else {\n this.toolbar.enableItems(this.zoomInItem.parentElement, true);\n this.toolbar.enableItems(this.zoomOutItem.parentElement, true);\n }\n }\n };\n /**\n * @private\n */\n Toolbar.prototype.updateUndoRedoButtons = function () {\n if (this.pdfViewer.annotationModule) {\n if (this.pdfViewerBase.pageCount > 0) {\n this.enableCollectionAvailable(this.pdfViewer.annotationModule.actionCollection, this.undoItem.parentElement);\n this.enableCollectionAvailable(this.pdfViewer.annotationModule.redoCollection, this.redoItem.parentElement);\n }\n else {\n this.disableUndoRedoButtons();\n }\n }\n else {\n this.disableUndoRedoButtons();\n }\n };\n // tslint:disable-next-line\n Toolbar.prototype.enableCollectionAvailable = function (collection, item) {\n if (collection.length > 0) {\n this.toolbar.enableItems(item, true);\n }\n else {\n this.toolbar.enableItems(item, false);\n }\n };\n Toolbar.prototype.disableUndoRedoButtons = function () {\n this.toolbar.enableItems(this.undoItem.parentElement, false);\n this.toolbar.enableItems(this.redoItem.parentElement, false);\n };\n /**\n * @private\n */\n Toolbar.prototype.destroy = function () {\n this.unWireEvent();\n if (this.moreDropDown) {\n this.moreDropDown.destroy();\n }\n if (this.annotationToolbarModule) {\n this.annotationToolbarModule.destroy();\n }\n this.toolbar.destroy();\n this.toolbarElement.remove();\n };\n /**\n * @private\n */\n Toolbar.prototype.updateCurrentPage = function (pageIndex) {\n if (!Browser.isDevice) {\n if (this.currentPageBox.value === pageIndex) {\n this.currentPageBoxElement.value = pageIndex.toString();\n }\n this.currentPageBox.value = pageIndex;\n }\n else {\n this.pdfViewerBase.mobileSpanContainer.innerHTML = pageIndex.toString();\n this.pdfViewerBase.mobilecurrentPageContainer.innerHTML = pageIndex.toString();\n }\n this.pdfViewerBase.currentPageNumber = pageIndex;\n };\n /**\n * @private\n */\n Toolbar.prototype.updateTotalPage = function () {\n if (!Browser.isDevice) {\n if (this.pdfViewerBase.pageCount > 0) {\n this.currentPageBox.min = 1;\n }\n this.totalPageItem.textContent = 'of ' + this.pdfViewerBase.pageCount.toString();\n }\n };\n /**\n * @private\n */\n Toolbar.prototype.openFileDialogBox = function (event) {\n event.preventDefault();\n this.fileInputElement.click();\n };\n Toolbar.prototype.createToolbar = function (controlWidth) {\n var _this = this;\n // tslint:disable-next-line:max-line-length\n this.toolbarElement = createElement('div', { id: this.pdfViewer.element.id + '_toolbarContainer', className: 'e-pv-toolbar' });\n this.pdfViewerBase.viewerMainContainer.appendChild(this.toolbarElement);\n if (!Browser.isDevice) {\n this.toolbar = new tool({\n clicked: this.toolbarClickHandler, width: '', height: '', overflowMode: 'Popup',\n items: this.createToolbarItems(), created: function () {\n _this.createZoomDropdown();\n _this.createNumericTextBox();\n _this.toolbar.refreshOverflow();\n }\n });\n if (this.pdfViewer.enableRtl) {\n this.toolbar.enableRtl = true;\n }\n this.toolbar.appendTo(this.toolbarElement);\n this.afterToolbarCreation();\n this.updateTotalPage();\n this.toolbarElement.addEventListener('keydown', this.onToolbarKeydown);\n }\n else {\n this.createToolbarItemsForMobile();\n if (this.pdfViewer.enableRtl) {\n this.toolbar.enableRtl = true;\n }\n this.disableUndoRedoButtons();\n }\n return this.toolbarElement;\n };\n // tslint:disable-next-line\n Toolbar.prototype.createToolbarItems = function () {\n var currentPageInputTemplate = this.createCurrentPageInputTemplate();\n var totalPageTemplate = this.createTotalPageTemplate();\n var zoomDropDownTemplateString = this.createZoomDropdownElement();\n // tslint:disable-next-line\n var items = [];\n // tslint:disable-next-line:max-line-length\n items.push({ prefixIcon: 'e-pv-open-document-icon e-pv-icon', cssClass: 'e-pv-open-document-container', id: this.pdfViewer.element.id + '_open', text: this.pdfViewer.localeObj.getConstant('Open text'), align: 'Left' });\n items.push({ type: 'Separator', align: 'Left' });\n if (!this.pdfViewer.enableRtl) {\n // tslint:disable-next-line:max-line-length\n items.push({ prefixIcon: 'e-pv-first-page-navigation-icon e-pv-icon', cssClass: 'e-pv-first-page-navigation-container', id: this.pdfViewer.element.id + '_firstPage', text: this.pdfViewer.localeObj.getConstant('First text'), align: 'Left' });\n items.push({ prefixIcon: 'e-pv-previous-page-navigation-icon e-pv-icon', cssClass: 'e-pv-previous-page-navigation-container', id: this.pdfViewer.element.id + '_previousPage', text: this.pdfViewer.localeObj.getConstant('Previous text'), align: 'Left' });\n // tslint:disable-next-line:max-line-length\n items.push({ prefixIcon: 'e-pv-next-page-navigation-icon e-pv-icon', cssClass: 'e-pv-next-page-navigation-container', id: this.pdfViewer.element.id + '_nextPage', text: this.pdfViewer.localeObj.getConstant('Next text'), align: 'Left' });\n items.push({ prefixIcon: 'e-pv-last-page-navigation-icon e-pv-icon', cssClass: 'e-pv-last-page-navigation-container', id: this.pdfViewer.element.id + '_lastPage', text: this.pdfViewer.localeObj.getConstant('Last text'), align: 'Left' });\n items.push({ template: currentPageInputTemplate, align: 'Left' });\n items.push({ template: totalPageTemplate, align: 'Left' });\n }\n else {\n // tslint:disable-next-line:max-line-length\n items.push({ prefixIcon: 'e-pv-last-page-navigation-icon e-pv-icon', cssClass: 'e-pv-last-page-navigation-container', id: this.pdfViewer.element.id + '_firstPage', text: this.pdfViewer.localeObj.getConstant('First text'), align: 'Left' });\n items.push({ prefixIcon: 'e-pv-next-page-navigation-icon e-pv-icon', cssClass: 'e-pv-next-page-navigation-container', id: this.pdfViewer.element.id + '_previousPage', text: this.pdfViewer.localeObj.getConstant('Previous text'), align: 'Left' });\n // tslint:disable-next-line:max-line-length\n items.push({ prefixIcon: 'e-pv-previous-page-navigation-icon e-pv-icon', cssClass: 'e-pv-previous-page-navigation-container', id: this.pdfViewer.element.id + '_nextPage', text: this.pdfViewer.localeObj.getConstant('Next text'), align: 'Left' });\n items.push({ prefixIcon: 'e-pv-first-page-navigation-icon e-pv-icon', cssClass: 'e-pv-first-page-navigation-container', id: this.pdfViewer.element.id + '_lastPage', text: this.pdfViewer.localeObj.getConstant('Last text'), align: 'Left' });\n items.push({ template: totalPageTemplate, align: 'Left' });\n items.push({ template: currentPageInputTemplate, align: 'Left' });\n }\n items.push({ type: 'Separator', align: 'Left' });\n // tslint:disable-next-line:max-line-length\n items.push({ prefixIcon: 'e-pv-zoom-out-icon e-pv-icon', cssClass: 'e-pv-zoom-out-container', id: this.pdfViewer.element.id + '_zoomOut', text: this.pdfViewer.localeObj.getConstant('Zoom out text'), align: 'Left' });\n items.push({ prefixIcon: 'e-pv-zoom-in-icon e-pv-icon', cssClass: 'e-pv-zoom-in-container', id: this.pdfViewer.element.id + '_zoomIn', text: this.pdfViewer.localeObj.getConstant('Zoom in text'), align: 'Left' });\n items.push({ template: zoomDropDownTemplateString, cssClass: 'e-pv-zoom-drop-down-container', align: 'Left' });\n items.push({ type: 'Separator', align: 'Left' });\n // tslint:disable-next-line:max-line-length\n items.push({ prefixIcon: 'e-pv-text-select-tool-icon e-pv-icon', cssClass: 'e-pv-text-select-tool-container', id: this.pdfViewer.element.id + '_selectTool', text: this.pdfViewer.localeObj.getConstant('Selection text') });\n items.push({ prefixIcon: 'e-pv-pan-tool-icon e-pv-icon', cssClass: 'e-pv-pan-tool-container', id: this.pdfViewer.element.id + '_handTool', text: this.pdfViewer.localeObj.getConstant('Pan text') });\n items.push({ type: 'Separator', align: 'Left' });\n // tslint:disable-next-line:max-line-length\n items.push({ prefixIcon: 'e-pv-undo-icon e-pv-icon', cssClass: 'e-pv-undo-container', id: this.pdfViewer.element.id + '_undo', text: this.pdfViewer.localeObj.getConstant('Undo'), align: 'Left' });\n items.push({ prefixIcon: 'e-pv-redo-icon e-pv-icon', cssClass: 'e-pv-redo-container', id: this.pdfViewer.element.id + '_redo', text: this.pdfViewer.localeObj.getConstant('Redo'), align: 'Left' });\n // tslint:disable-next-line:max-line-length\n items.push({ prefixIcon: 'e-pv-text-search-icon e-pv-icon', cssClass: 'e-pv-text-search-container', id: this.pdfViewer.element.id + '_search', text: this.pdfViewer.localeObj.getConstant('Search text'), align: 'Right' });\n items.push({ prefixIcon: 'e-pv-annotation-icon e-pv-icon', cssClass: 'e-pv-annotation-container', id: this.pdfViewer.element.id + '_annotation', text: this.pdfViewer.localeObj.getConstant('Annotation Edit text'), align: 'Right' });\n // tslint:disable-next-line:max-line-length\n items.push({ prefixIcon: 'e-pv-print-document-icon e-pv-icon', cssClass: 'e-pv-print-document-container', id: this.pdfViewer.element.id + '_print', text: this.pdfViewer.localeObj.getConstant('Print text'), align: 'Right' });\n items.push({ prefixIcon: 'e-pv-download-document-icon e-pv-icon', cssClass: 'e-pv-download-document-container', id: this.pdfViewer.element.id + '_download', text: this.pdfViewer.localeObj.getConstant('Download'), align: 'Right' });\n return items;\n };\n Toolbar.prototype.afterToolbarCreation = function () {\n this.itemsContainer = this.toolbar.element.childNodes[0];\n this.itemsContainer.id = this.pdfViewer.element.id + '_toolbarItemsContainer';\n this.openDocumentItem = this.addClassToolbarItem('_open', 'e-pv-open-document', this.pdfViewer.localeObj.getConstant('Open'));\n this.undoItem = this.addClassToolbarItem('_undo', 'e-pv-undo', this.pdfViewer.localeObj.getConstant('Undo'));\n this.redoItem = this.addClassToolbarItem('_redo', 'e-pv-redo', this.pdfViewer.localeObj.getConstant('Redo'));\n if (!this.pdfViewer.enableRtl) {\n // tslint:disable-next-line:max-line-length\n this.firstPageItem = this.addClassToolbarItem('_firstPage', 'e-pv-first-page-navigation', this.pdfViewer.localeObj.getConstant('Go To First Page'));\n this.previousPageItem = this.addClassToolbarItem('_previousPage', 'e-pv-previous-page-navigation', this.pdfViewer.localeObj.getConstant('Previous Page'));\n // tslint:disable-next-line:max-line-length\n this.nextPageItem = this.addClassToolbarItem('_nextPage', 'e-pv-next-page-navigation', this.pdfViewer.localeObj.getConstant('Next Page'));\n this.lastPageItem = this.addClassToolbarItem('_lastPage', 'e-pv-last-page-navigation', this.pdfViewer.localeObj.getConstant('Go To Last Page'));\n }\n else {\n // tslint:disable-next-line:max-line-length\n this.firstPageItem = this.addClassToolbarItem('_firstPage', 'e-pv-last-page-navigation', this.pdfViewer.localeObj.getConstant('Go To First Page'));\n this.previousPageItem = this.addClassToolbarItem('_previousPage', 'e-pv-next-page-navigation', this.pdfViewer.localeObj.getConstant('Previous Page'));\n // tslint:disable-next-line:max-line-length\n this.nextPageItem = this.addClassToolbarItem('_nextPage', 'e-pv-previous-page-navigation', this.pdfViewer.localeObj.getConstant('Next Page'));\n this.lastPageItem = this.addClassToolbarItem('_lastPage', 'e-pv-first-page-navigation', this.pdfViewer.localeObj.getConstant('Go To Last Page'));\n }\n this.zoomOutItem = this.addClassToolbarItem('_zoomOut', 'e-pv-zoom-out', this.pdfViewer.localeObj.getConstant('Zoom Out'));\n this.zoomInItem = this.addClassToolbarItem('_zoomIn', 'e-pv-zoom-in', this.pdfViewer.localeObj.getConstant('Zoom In'));\n // tslint:disable-next-line:max-line-length\n this.textSelectItem = this.addClassToolbarItem('_selectTool', 'e-pv-text-select-tool', this.pdfViewer.localeObj.getConstant('Text Selection'));\n this.panItem = this.addClassToolbarItem('_handTool', 'e-pv-pan-tool', this.pdfViewer.localeObj.getConstant('Panning'));\n // tslint:disable-next-line:max-line-length\n this.textSearchItem = this.addClassToolbarItem('_search', 'e-pv-text-search', this.pdfViewer.localeObj.getConstant('Text Search'));\n this.annotationItem = this.addClassToolbarItem('_annotation', 'e-pv-annotation', this.pdfViewer.localeObj.getConstant('Annotation'));\n // tslint:disable-next-line:max-line-length\n this.printItem = this.addClassToolbarItem('_print', 'e-pv-print-document', this.pdfViewer.localeObj.getConstant('Print'));\n this.downloadItem = this.addClassToolbarItem('_download', 'e-pv-download-document', this.pdfViewer.localeObj.getConstant('Download file'));\n this.zoomDropdownItem = this.pdfViewerBase.getElement('_zoomDropDown');\n this.createTooltip(this.zoomDropdownItem, this.pdfViewer.localeObj.getConstant('Zoom'));\n this.zoomDropdownItem.setAttribute('aria-label', this.pdfViewer.localeObj.getConstant('Zoom'));\n // tslint:disable-next-line:max-line-length\n this.addPropertiesToolItemContainer(this.zoomDropdownItem.parentElement.parentElement, null, '_zoomDropDownContainer');\n this.pdfViewerBase.getElement('_zoomDropDownContainer').style.minWidth = '';\n this.createTooltip(this.currentPageBoxElement, this.pdfViewer.localeObj.getConstant('Page Number'));\n this.currentPageBoxElement.setAttribute('aria-label', this.pdfViewer.localeObj.getConstant('Page Number'));\n // tslint:disable-next-line:max-line-length\n this.addPropertiesToolItemContainer(this.currentPageBoxElement.parentElement.parentElement, 'e-pv-current-page-container', '_currentPageInputContainer');\n this.pdfViewerBase.getElement('_currentPageInputContainer').style.minWidth = '20px';\n this.totalPageItem = this.pdfViewerBase.getElement('_totalPage');\n this.addPropertiesToolItemContainer(this.totalPageItem.parentElement, 'e-pv-total-page-container', '_totalPageContainer');\n };\n /**\n * @private\n */\n Toolbar.prototype.addClassToolbarItem = function (idString, className, tooltipText) {\n var element = this.pdfViewerBase.getElement(idString);\n element.classList.add(className);\n element.classList.add('e-pv-tbar-btn');\n element.setAttribute('aria-label', tooltipText);\n element.parentElement.classList.add(className + '-container');\n element.parentElement.classList.add('e-popup-text');\n element.parentElement.id = this.pdfViewer.element.id + idString + 'Container';\n if (element.childNodes.length > 0) {\n var spanElement = element.childNodes[0];\n spanElement.id = this.pdfViewer.element.id + idString + 'Icon';\n spanElement.classList.remove('e-icons');\n spanElement.classList.remove('e-btn-icon');\n if (this.pdfViewer.enableRtl) {\n spanElement.classList.add('e-right');\n }\n var textElement = element.childNodes[1];\n if (textElement) {\n if (textElement.classList.contains('e-tbar-btn-text')) {\n textElement.id = this.pdfViewer.element.id + idString + 'Text';\n }\n }\n }\n element.style.width = '';\n this.createTooltip(element, tooltipText);\n return element;\n };\n Toolbar.prototype.addPropertiesToolItemContainer = function (element, className, idString) {\n if (className !== null) {\n element.classList.add(className);\n }\n element.classList.add('e-popup-text');\n element.id = this.pdfViewer.element.id + idString;\n };\n Toolbar.prototype.createZoomDropdownElement = function () {\n // tslint:disable-next-line:max-line-length\n var zoomDropdownElement = this.createToolbarItem('input', this.pdfViewer.element.id + '_zoomDropDown', null);\n return zoomDropdownElement.outerHTML;\n };\n Toolbar.prototype.createZoomDropdown = function () {\n // tslint:disable-next-line:max-line-length\n var items = [{ percent: '50%', id: '0' }, { percent: '75%', id: '1' }, { percent: '100%', id: '2' }, { percent: '125%', id: '3' },\n // tslint:disable-next-line:max-line-length\n { percent: '150%', id: '4' }, { percent: '200%', id: '5' }, { percent: '400%', id: '6' }, { percent: this.pdfViewer.localeObj.getConstant('Fit Page'), id: '7' }, { percent: this.pdfViewer.localeObj.getConstant('Fit Width'), id: '8' }, { percent: this.pdfViewer.localeObj.getConstant('Automatic'), id: '9' }\n ];\n // tslint:disable-next-line:max-line-length\n this.zoomDropDown = new ComboBox({ dataSource: items, text: '100%', fields: { text: 'percent', value: 'id' }, readonly: true, cssClass: 'e-pv-zoom-drop-down', popupHeight: '402px', showClearButton: false });\n this.zoomDropDown.appendTo(this.pdfViewerBase.getElement('_zoomDropDown'));\n };\n Toolbar.prototype.createCurrentPageInputTemplate = function () {\n // tslint:disable-next-line:max-line-length\n var goToPageElement = this.createToolbarItem('input', this.pdfViewer.element.id + '_currentPageInput', null);\n return goToPageElement.outerHTML;\n };\n Toolbar.prototype.createTotalPageTemplate = function () {\n // tslint:disable-next-line:max-line-length\n var totalPageElement = this.createToolbarItem('span', this.pdfViewer.element.id + '_totalPage', 'e-pv-total-page');\n return totalPageElement.outerHTML;\n };\n Toolbar.prototype.createNumericTextBox = function () {\n this.currentPageBox = new NumericTextBox({ value: 0, format: '##', cssClass: 'e-pv-current-page-box', showSpinButton: false });\n this.currentPageBoxElement = this.pdfViewerBase.getElement('_currentPageInput');\n this.currentPageBox.appendTo(this.currentPageBoxElement);\n };\n Toolbar.prototype.createToolbarItemsForMobile = function () {\n this.toolbarElement.classList.add('e-pv-mobile-toolbar');\n var template = '';\n this.toolbar = new tool({\n // tslint:disable-next-line:max-line-length\n items: [{ prefixIcon: 'e-pv-open-document-icon e-pv-icon', tooltipText: this.pdfViewer.localeObj.getConstant('Open'), id: this.pdfViewer.element.id + '_open' },\n { type: 'Separator', align: 'Left' },\n // tslint:disable-next-line:max-line-length\n { prefixIcon: 'e-pv-undo-icon e-pv-icon', tooltipText: this.pdfViewer.localeObj.getConstant('Undo'), id: this.pdfViewer.element.id + '_undo', },\n // tslint:disable-next-line:max-line-length\n { prefixIcon: 'e-pv-redo-icon e-pv-icon', tooltipText: this.pdfViewer.localeObj.getConstant('Redo'), id: this.pdfViewer.element.id + '_redo', },\n // tslint:disable-next-line:max-line-length\n { prefixIcon: 'e-pv-text-search-icon e-pv-icon', tooltipText: this.pdfViewer.localeObj.getConstant('Text Search'), id: this.pdfViewer.element.id + '_search', align: 'Right' },\n { template: template, align: 'Right' }\n ], clicked: this.toolbarClickHandler, width: '', height: '', overflowMode: 'Popup'\n });\n this.toolbar.appendTo(this.toolbarElement);\n this.openDocumentItem = this.pdfViewerBase.getElement('_open');\n this.openDocumentItem.classList.add('e-pv-open-document');\n this.openDocumentItem.firstElementChild.id = this.pdfViewer.element.id + '_openIcon';\n this.textSearchItem = this.pdfViewerBase.getElement('_search');\n this.textSearchItem.classList.add('e-pv-text-search');\n this.textSearchItem.firstElementChild.id = this.pdfViewer.element.id + '_searchIcon';\n this.undoItem = this.pdfViewerBase.getElement('_undo');\n this.undoItem.classList.add('e-pv-undo');\n this.redoItem = this.pdfViewerBase.getElement('_redo');\n this.redoItem.classList.add('e-pv-redo');\n this.redoItem.firstElementChild.id = this.pdfViewer.element.id + '_redoIcon';\n this.undoItem.firstElementChild.id = this.pdfViewer.element.id + '_undoIcon';\n this.createMoreOption(this.pdfViewer.element.id + '_more_option');\n };\n Toolbar.prototype.createMoreOption = function (idString) {\n var _this = this;\n this.moreOptionItem = document.getElementById(idString);\n var items = [\n {\n text: this.pdfViewer.localeObj.getConstant('Download'), id: this.pdfViewer.element.id + '_menu_download',\n iconCss: 'e-icons e-pv-download-document-icon e-pv-icon'\n },\n {\n text: this.pdfViewer.localeObj.getConstant('Bookmarks'), id: this.pdfViewer.element.id + '_menu_bookmarks',\n iconCss: 'e-icons e-pv-bookmark-icon e-pv-icon'\n }\n ];\n this.moreDropDown = new DropDownButton({\n items: items, iconCss: 'e-pv-more-icon e-pv-icon', cssClass: 'e-caret-hide',\n open: function (args) {\n var dropdownButtonPosition = _this.moreDropDown.element.getBoundingClientRect();\n // tslint:disable-next-line:max-line-length\n if (!_this.pdfViewer.enableRtl) {\n args.element.parentElement.style.left = dropdownButtonPosition.left + dropdownButtonPosition.width - args.element.parentElement.offsetWidth + 'px';\n }\n }, select: function (args) {\n switch (args.item.id) {\n case _this.pdfViewer.element.id + '_menu_download':\n _this.pdfViewerBase.download();\n break;\n case _this.pdfViewer.element.id + '_menu_bookmarks':\n _this.showToolbar(false);\n _this.pdfViewerBase.navigationPane.createNavigationPaneMobile('bookmarks');\n break;\n default:\n break;\n }\n }, beforeItemRender: function (args) {\n if (args.item.id === _this.pdfViewer.element.id + '_menu_bookmarks') {\n if (!_this.pdfViewer.bookmarkViewModule || !_this.pdfViewer.bookmarkViewModule.bookmarks) {\n args.element.classList.add('e-disabled');\n }\n else {\n args.element.classList.remove('e-disabled');\n }\n }\n }, close: function (args) {\n _this.moreOptionItem.blur();\n _this.pdfViewerBase.focusViewerContainer();\n }\n });\n this.moreDropDown.appendTo('#' + idString);\n };\n Toolbar.prototype.createToolbarItem = function (elementName, id, className) {\n var toolbarItem = createElement(elementName, { id: id });\n if (className !== null) {\n toolbarItem.className = className;\n }\n if (elementName === 'input' && id !== this.pdfViewer.element.id + '_zoomDropDown') {\n toolbarItem.type = 'text';\n }\n return toolbarItem;\n };\n /**\n * @private\n */\n Toolbar.prototype.createTooltip = function (toolbarItem, tooltipText) {\n if (tooltipText !== null) {\n // tslint:disable-next-line\n var tooltip = new Tooltip({ content: tooltipText, opensOn: 'Hover', beforeOpen: this.onTooltipBeforeOpen.bind(this) });\n tooltip.appendTo(toolbarItem);\n }\n };\n Toolbar.prototype.onTooltipBeforeOpen = function (args) {\n if (!this.pdfViewer.toolbarSettings.showTooltip && this.toolbarElement.contains(args.target)) {\n args.cancel = true;\n }\n if (this.annotationToolbarModule) {\n // tslint:disable-next-line:max-line-length\n if (!this.pdfViewer.annotationToolbarSettings.showTooltip && this.annotationToolbarModule.toolbarElement.contains(args.target)) {\n args.cancel = true;\n }\n }\n };\n Toolbar.prototype.createFileElement = function (toolbarElement) {\n // tslint:disable-next-line:max-line-length\n this.fileInputElement = createElement('input', { id: this.pdfViewer.element.id + '_fileUploadElement', styles: 'position:fixed; left:-100em', attrs: { 'type': 'file' } });\n this.fileInputElement.setAttribute('accept', '.pdf');\n toolbarElement.appendChild(this.fileInputElement);\n };\n Toolbar.prototype.wireEvent = function () {\n this.fileInputElement.addEventListener('change', this.loadDocument);\n if (!Browser.isDevice) {\n this.toolbarElement.addEventListener('mouseup', this.toolbarOnMouseup.bind(this));\n this.currentPageBoxElement.addEventListener('focusout', this.textBoxFocusOut);\n this.currentPageBoxElement.addEventListener('keypress', this.navigateToPage);\n this.zoomDropDown.change = this.zoomPercentSelect.bind(this);\n this.zoomDropDown.element.addEventListener('keypress', this.onZoomDropDownInput.bind(this));\n this.zoomDropDown.element.addEventListener('click', this.onZoomDropDownInputClick.bind(this));\n }\n };\n Toolbar.prototype.unWireEvent = function () {\n this.fileInputElement.removeEventListener('change', this.loadDocument);\n if (!Browser.isDevice) {\n this.toolbarElement.removeEventListener('mouseup', this.toolbarOnMouseup.bind(this));\n this.currentPageBoxElement.removeEventListener('focusout', this.textBoxFocusOut);\n this.currentPageBoxElement.removeEventListener('keypress', this.navigateToPage);\n this.zoomDropDown.removeEventListener('change', this.zoomPercentSelect);\n this.zoomDropDown.element.removeEventListener('keypress', this.onZoomDropDownInput);\n this.zoomDropDown.element.removeEventListener('click', this.onZoomDropDownInputClick);\n }\n };\n /**\n * @private\n */\n Toolbar.prototype.onToolbarResize = function (viewerWidth) {\n if (Browser.isDevice) {\n this.pdfViewerBase.navigationPane.toolbarResize();\n }\n else {\n this.toolbar.refreshOverflow();\n }\n };\n Toolbar.prototype.toolbarOnMouseup = function (event) {\n if (event.target === this.itemsContainer || event.target === this.toolbarElement) {\n this.pdfViewerBase.focusViewerContainer();\n }\n };\n Toolbar.prototype.applyHideToToolbar = function (show, startIndex, endIndex) {\n var isHide = !show;\n for (var index = startIndex; index <= endIndex; index++) {\n this.toolbar.hideItem(index, isHide);\n }\n };\n Toolbar.prototype.handleToolbarButtonClick = function (args) {\n switch (args.originalEvent.target.id) {\n case this.pdfViewer.element.id + '_open':\n case this.pdfViewer.element.id + '_openIcon':\n case this.pdfViewer.element.id + '_openText':\n this.fileInputElement.click();\n if (Browser.isDevice) {\n args.originalEvent.target.blur();\n this.pdfViewerBase.focusViewerContainer();\n }\n break;\n case this.pdfViewer.element.id + '_download':\n case this.pdfViewer.element.id + '_downloadIcon':\n case this.pdfViewer.element.id + '_downloadText':\n this.pdfViewerBase.download();\n break;\n case this.pdfViewer.element.id + '_print':\n case this.pdfViewer.element.id + '_printIcon':\n case this.pdfViewer.element.id + '_printText':\n if (this.pdfViewer.printModule) {\n this.pdfViewer.printModule.print();\n }\n break;\n case this.pdfViewer.element.id + '_undo':\n case this.pdfViewer.element.id + '_undoIcon':\n case this.pdfViewer.element.id + '_undoText':\n if (this.pdfViewer.annotationModule) {\n this.pdfViewer.annotationModule.undo();\n }\n break;\n case this.pdfViewer.element.id + '_redo':\n case this.pdfViewer.element.id + '_redoIcon':\n case this.pdfViewer.element.id + '_redoText':\n if (this.pdfViewer.annotationModule) {\n this.pdfViewer.annotationModule.redo();\n }\n break;\n case this.pdfViewer.element.id + '_firstPage':\n case this.pdfViewer.element.id + '_firstPageIcon':\n case this.pdfViewer.element.id + '_firstPageText':\n if (this.pdfViewer.navigationModule) {\n this.pdfViewer.navigationModule.goToFirstPage();\n }\n break;\n case this.pdfViewer.element.id + '_previousPage':\n case this.pdfViewer.element.id + '_previousPageIcon':\n case this.pdfViewer.element.id + '_previousPageText':\n if (this.pdfViewer.navigationModule) {\n this.pdfViewer.navigationModule.goToPreviousPage();\n }\n break;\n case this.pdfViewer.element.id + '_nextPage':\n case this.pdfViewer.element.id + '_nextPageIcon':\n case this.pdfViewer.element.id + '_nextPageText':\n if (this.pdfViewer.navigationModule) {\n this.pdfViewer.navigationModule.goToNextPage();\n }\n break;\n case this.pdfViewer.element.id + '_lastPage':\n case this.pdfViewer.element.id + '_lastPageIcon':\n case this.pdfViewer.element.id + '_lastPageText':\n if (this.pdfViewer.navigationModule) {\n this.pdfViewer.navigationModule.goToLastPage();\n }\n break;\n case this.pdfViewer.element.id + '_zoomIn':\n case this.pdfViewer.element.id + '_zoomInIcon':\n case this.pdfViewer.element.id + '_zoomInText':\n this.pdfViewer.magnificationModule.zoomIn();\n break;\n case this.pdfViewer.element.id + '_zoomOut':\n case this.pdfViewer.element.id + '_zoomOutIcon':\n case this.pdfViewer.element.id + '_zoomOutText':\n this.pdfViewer.magnificationModule.zoomOut();\n break;\n case this.pdfViewer.element.id + '_selectTool':\n case this.pdfViewer.element.id + '_selectToolIcon':\n case this.pdfViewer.element.id + '_selectToolText':\n if (!this.isSelectionToolDisabled) {\n this.pdfViewerBase.initiateTextSelectMode();\n this.updateInteractionTools(true);\n }\n break;\n case this.pdfViewer.element.id + '_handTool':\n case this.pdfViewer.element.id + '_handToolIcon':\n case this.pdfViewer.element.id + '_handToolText':\n if (!this.isScrollingToolDisabled) {\n this.pdfViewerBase.initiatePanning();\n this.updateInteractionTools(false);\n }\n break;\n case this.pdfViewer.element.id + '_search':\n case this.pdfViewer.element.id + '_searchIcon':\n case this.pdfViewer.element.id + '_searchText':\n this.textSearchButtonHandler();\n break;\n case this.pdfViewer.element.id + '_annotation':\n case this.pdfViewer.element.id + '_annotationIcon':\n case this.pdfViewer.element.id + '_annotationText':\n this.initiateAnnotationMode();\n break;\n }\n };\n Toolbar.prototype.onZoomDropDownInput = function (event) {\n if ((event.which < 48 || event.which > 57) && event.which !== 8 && event.which !== 13) {\n event.preventDefault();\n return false;\n }\n else {\n if (event.which === 13) {\n event.preventDefault();\n var value = this.zoomDropDown.element.value;\n this.zoomDropDownChange(value);\n }\n return true;\n }\n };\n Toolbar.prototype.onZoomDropDownInputClick = function () {\n this.zoomDropDown.element.select();\n };\n Toolbar.prototype.zoomPercentSelect = function (args) {\n if (this.pdfViewerBase.pageCount > 0) {\n if (args.isInteracted) {\n if (args.itemData) {\n // tslint:disable-next-line:no-any\n var zoomText = args.itemData.percent;\n this.zoomDropDownChange(zoomText);\n }\n }\n else {\n this.updateZoomPercentage(this.pdfViewer.magnificationModule.zoomFactor);\n }\n }\n };\n Toolbar.prototype.zoomDropDownChange = function (zoomText) {\n // tslint:disable-next-line:max-line-length\n if (zoomText !== this.pdfViewer.localeObj.getConstant('Fit Width') && zoomText !== this.pdfViewer.localeObj.getConstant('Fit Page') && zoomText !== this.pdfViewer.localeObj.getConstant('Automatic')) {\n this.pdfViewer.magnificationModule.isAutoZoom = false;\n this.pdfViewer.magnificationModule.zoomTo(parseFloat(zoomText));\n this.zoomDropDown.focusOut();\n }\n else if (zoomText === this.pdfViewer.localeObj.getConstant('Fit Width')) {\n this.pdfViewer.magnificationModule.isAutoZoom = false;\n this.pdfViewer.magnificationModule.fitToWidth();\n this.zoomDropDown.focusOut();\n }\n else if (zoomText === this.pdfViewer.localeObj.getConstant('Fit Page')) {\n this.pdfViewer.magnificationModule.fitToPage();\n this.zoomDropDown.focusOut();\n }\n else if (zoomText === this.pdfViewer.localeObj.getConstant('Automatic')) {\n this.pdfViewer.magnificationModule.isAutoZoom = true;\n this.pdfViewer.magnificationModule.fitToAuto();\n this.zoomDropDown.focusOut();\n }\n };\n /**\n * @private\n */\n Toolbar.prototype.updateZoomPercentage = function (zoomFactor) {\n if (!Browser.isDevice) {\n // tslint:disable-next-line:radix\n var currentPercent = parseInt((zoomFactor * 100).toString()) + '%';\n if (this.zoomDropDown.text === currentPercent) {\n this.zoomDropDown.element.value = currentPercent;\n }\n if (this.zoomDropDown.index === 9) {\n this.zoomDropDown.value = 2;\n }\n // tslint:disable-next-line\n this.zoomDropDown.text = currentPercent;\n }\n };\n Toolbar.prototype.updateInteractionItems = function () {\n if (this.pdfViewer.textSelectionModule) {\n if (this.pdfViewer.enableTextSelection) {\n this.toolbar.enableItems(this.textSelectItem.parentElement, true);\n }\n else {\n this.toolbar.enableItems(this.textSelectItem.parentElement, false);\n }\n }\n else {\n this.toolbar.enableItems(this.textSelectItem.parentElement, false);\n }\n this.toolbar.enableItems(this.panItem.parentElement, true);\n if (this.pdfViewer.interactionMode === 'TextSelection') {\n this.selectItem(this.textSelectItem);\n this.deSelectItem(this.panItem);\n }\n else {\n this.selectItem(this.panItem);\n this.deSelectItem(this.textSelectItem);\n this.pdfViewerBase.initiatePanning();\n }\n };\n /**\n * @private\n */\n Toolbar.prototype.textSearchButtonHandler = function () {\n if (!Browser.isDevice) {\n if (this.pdfViewer.textSearchModule && this.pdfViewerBase.pageCount > 0) {\n this.isTextSearchBoxDisplayed = !this.isTextSearchBoxDisplayed;\n this.pdfViewer.textSearchModule.showSearchBox(this.isTextSearchBoxDisplayed);\n if (this.isTextSearchBoxDisplayed) {\n this.selectItem(this.textSearchItem);\n // tslint:disable-next-line:max-line-length\n var searchInputElement = document.getElementById(this.pdfViewer.element.id + '_search_input');\n searchInputElement.select();\n searchInputElement.focus();\n }\n else {\n this.deSelectItem(this.textSearchItem);\n }\n }\n }\n else {\n this.showToolbar(false);\n this.pdfViewerBase.navigationPane.createNavigationPaneMobile('search');\n }\n };\n Toolbar.prototype.initiateAnnotationMode = function () {\n if (this.annotationToolbarModule) {\n if (this.pdfViewerBase.isPanMode && this.annotationToolbarModule.isToolbarHidden) {\n this.pdfViewerBase.initiateTextSelectMode();\n }\n this.DisableInteractionTools();\n this.annotationToolbarModule.showAnnotationToolbar(this.annotationItem);\n }\n };\n /**\n * @private\n */\n Toolbar.prototype.DisableInteractionTools = function () {\n this.deSelectItem(this.textSelectItem);\n this.deSelectItem(this.panItem);\n };\n /**\n * @private\n */\n Toolbar.prototype.selectItem = function (element) {\n element.classList.add('e-pv-select');\n };\n /**\n * @private\n */\n Toolbar.prototype.deSelectItem = function (element) {\n element.classList.remove('e-pv-select');\n };\n /**\n * @private\n */\n Toolbar.prototype.updateInteractionTools = function (isTextSelect) {\n if (isTextSelect) {\n this.selectItem(this.textSelectItem);\n this.deSelectItem(this.panItem);\n }\n else {\n this.selectItem(this.panItem);\n this.deSelectItem(this.textSelectItem);\n }\n };\n Toolbar.prototype.initialEnableItems = function () {\n if (this.pdfViewer.enableToolbar) {\n this.showToolbar(true);\n }\n else {\n this.showToolbar(false);\n }\n if (this.pdfViewer.enableNavigationToolbar) {\n this.showNavigationToolbar(true);\n }\n else {\n this.showNavigationToolbar(false);\n }\n if (this.isPrintBtnVisible) {\n this.showPrintOption(true);\n }\n else {\n this.showPrintOption(false);\n }\n if (this.isDownloadBtnVisible) {\n this.showDownloadOption(true);\n }\n else {\n this.showDownloadOption(false);\n }\n if (this.isSearchBtnVisible) {\n this.showSearchOption(true);\n }\n else {\n this.showSearchOption(false);\n }\n };\n Toolbar.prototype.showSeparator = function (toolbarItems) {\n if (!this.isOpenBtnVisible || (this.isOpenBtnVisible && toolbarItems.length === 1) ||\n // tslint:disable-next-line:max-line-length\n (!this.isNavigationToolVisible && !this.isMagnificationToolVisible && !this.isSelectionBtnVisible && !this.isScrollingBtnVisible && !this.isUndoRedoBtnsVisible)) {\n this.applyHideToToolbar(false, 1, 1);\n }\n if (((!this.isNavigationToolVisible && !this.isMagnificationToolVisible) && !this.isOpenBtnVisible) ||\n (this.isOpenBtnVisible && !this.isNavigationToolVisible) ||\n // tslint:disable-next-line:max-line-length\n ((!this.isOpenBtnVisible && !this.isNavigationToolVisible) || (!this.isMagnificationToolVisible && !this.isScrollingBtnVisible && !this.isSelectionBtnVisible))) {\n this.applyHideToToolbar(false, 8, 8);\n }\n if ((!this.isMagnificationToolVisible && !this.isSelectionBtnVisible && !this.isScrollingBtnVisible) ||\n (this.isMagnificationToolVisible && (!this.isSelectionBtnVisible && !this.isScrollingBtnVisible)) ||\n (!this.isMagnificationToolVisible && (this.isSelectionBtnVisible || this.isScrollingBtnVisible))) {\n this.applyHideToToolbar(false, 12, 12);\n }\n if (((!this.isMagnificationToolVisible && !this.isNavigationToolVisible && !this.isScrollingBtnVisible\n && !this.isSelectionBtnVisible) && this.isUndoRedoBtnsVisible || !this.isUndoRedoBtnsVisible)) {\n this.applyHideToToolbar(false, 15, 15);\n }\n };\n Toolbar.prototype.applyToolbarSettings = function () {\n var toolbarSettingsItems = this.pdfViewer.toolbarSettings.toolbarItem;\n if (toolbarSettingsItems) {\n if (toolbarSettingsItems.indexOf('OpenOption') !== -1) {\n this.showOpenOption(true);\n }\n else {\n this.showOpenOption(false);\n }\n if (toolbarSettingsItems.indexOf('PageNavigationTool') !== -1) {\n this.showPageNavigationTool(true);\n }\n else {\n this.showPageNavigationTool(false);\n }\n if (toolbarSettingsItems.indexOf('MagnificationTool') !== -1) {\n this.showMagnificationTool(true);\n }\n else {\n this.showMagnificationTool(false);\n }\n if (toolbarSettingsItems.indexOf('SelectionTool') !== -1) {\n this.showSelectionTool(true);\n }\n else {\n this.showSelectionTool(false);\n }\n if (toolbarSettingsItems.indexOf('PanTool') !== -1) {\n this.showScrollingTool(true);\n }\n else {\n this.showScrollingTool(false);\n }\n if (toolbarSettingsItems.indexOf('PrintOption') !== -1) {\n this.showPrintOption(true);\n }\n else {\n this.showPrintOption(false);\n }\n if (toolbarSettingsItems.indexOf('DownloadOption') !== -1) {\n this.showDownloadOption(true);\n }\n else {\n this.showDownloadOption(false);\n }\n if (toolbarSettingsItems.indexOf('SearchOption') !== -1) {\n this.showSearchOption(true);\n }\n else {\n this.showSearchOption(false);\n }\n if (toolbarSettingsItems.indexOf('UndoRedoTool') !== -1) {\n this.showUndoRedoTool(true);\n }\n else {\n this.showUndoRedoTool(false);\n }\n if (toolbarSettingsItems.indexOf('AnnotationEditTool') !== -1) {\n this.showAnnotationEditTool(true);\n }\n else {\n this.showAnnotationEditTool(false);\n }\n this.showSeparator(toolbarSettingsItems);\n }\n };\n /**\n * @private\n */\n Toolbar.prototype.getModuleName = function () {\n return 'Toolbar';\n };\n return Toolbar;\n}());\nexport { Toolbar };\n","import { createElement, Browser } from '@syncfusion/ej2-base';\nimport { Toolbar as Tool } from '@syncfusion/ej2-navigations';\nimport { DropDownButton } from '@syncfusion/ej2-splitbuttons';\nimport { ColorPicker, Slider } from '@syncfusion/ej2-inputs';\n/**\n * @hidden\n */\nvar AnnotationToolbar = /** @class */ (function () {\n function AnnotationToolbar(viewer, viewerBase, toolbar) {\n this.toolbarBorderHeight = 1;\n /**\n * @private\n */\n this.isToolbarHidden = false;\n /**\n * @private\n */\n this.isMobileAnnotEnabled = false;\n this.isHighlightEnabled = false;\n this.isUnderlineEnabled = false;\n this.isStrikethroughEnabled = false;\n this.isHighlightBtnVisible = true;\n this.isUnderlineBtnVisible = true;\n this.isStrikethroughBtnVisible = true;\n this.isColorToolVisible = true;\n this.isOpacityToolVisible = true;\n this.isDeleteAnnotationToolVisible = true;\n this.isCurrentAnnotationOpacitySet = false;\n this.pdfViewer = viewer;\n this.pdfViewerBase = viewerBase;\n this.primaryToolbar = toolbar;\n }\n /**\n * @private\n */\n AnnotationToolbar.prototype.initializeAnnotationToolbar = function () {\n var _this = this;\n // tslint:disable-next-line:max-line-length\n this.toolbarElement = createElement('div', { id: this.pdfViewer.element.id + '_annotation_toolbar', className: 'e-pv-annotation-toolbar' });\n this.pdfViewerBase.viewerMainContainer.appendChild(this.toolbarElement);\n this.toolbar = new Tool({\n width: '', height: '', overflowMode: 'Popup',\n items: this.createToolbarItems(), clicked: this.onToolbarClicked.bind(this),\n created: function () {\n _this.createDropDowns();\n }\n });\n if (this.pdfViewer.enableRtl) {\n this.toolbar.enableRtl = true;\n }\n this.toolbar.appendTo(this.toolbarElement);\n this.afterToolbarCreation();\n this.showAnnotationToolbar(null);\n this.applyAnnotationToolbarSettings();\n this.updateToolbarItems();\n };\n AnnotationToolbar.prototype.createMobileAnnotationToolbar = function (isEnable) {\n var _this = this;\n if (Browser.isDevice) {\n if (this.toolbarElement == null && isEnable) {\n this.isMobileAnnotEnabled = true;\n // tslint:disable-next-line:max-line-length\n this.toolbarElement = createElement('div', { id: this.pdfViewer.element.id + '_annotation_toolbar', className: 'e-pv-annotation-toolbar' });\n this.pdfViewerBase.viewerMainContainer.insertBefore(this.toolbarElement, this.pdfViewerBase.viewerContainer);\n this.toolbar = new Tool({\n width: '', height: '', overflowMode: 'Popup',\n items: this.createMobileToolbarItems(), clicked: this.onToolbarClicked.bind(this),\n created: function () {\n _this.createDropDowns();\n }\n });\n if (this.pdfViewer.enableRtl) {\n this.toolbar.enableRtl = true;\n }\n this.pdfViewerBase.navigationPane.goBackToToolbar();\n this.pdfViewer.toolbarModule.showToolbar(false);\n this.toolbar.appendTo(this.toolbarElement);\n this.deleteItem = this.pdfViewerBase.getElement('_annotation_delete');\n this.deleteItem.firstElementChild.id = this.pdfViewer.element.id + '_annotation_delete';\n }\n else if (this.toolbarElement != null) {\n if (isEnable) {\n this.isMobileAnnotEnabled = true;\n this.pdfViewerBase.navigationPane.goBackToToolbar();\n this.pdfViewer.toolbarModule.showToolbar(false);\n this.toolbarElement.style.display = 'block';\n }\n else if (!isEnable) {\n this.isMobileAnnotEnabled = false;\n this.pdfViewer.toolbarModule.showToolbar(true);\n this.hideMobileAnnotationToolbar();\n }\n }\n }\n else {\n this.isMobileAnnotEnabled = true;\n }\n };\n AnnotationToolbar.prototype.hideMobileAnnotationToolbar = function () {\n if (this.toolbarElement != null) {\n this.toolbarElement.style.display = 'none';\n }\n };\n // tslint:disable-next-line\n AnnotationToolbar.prototype.createMobileToolbarItems = function () {\n var colorTemplate = this.getTemplate('span', '_annotation_color', 'e-pv-annotation-color-container');\n var opacityTemplate = this.getTemplate('span', '_annotation_opacity', 'e-pv-annotation-opacity-container');\n // tslint:disable-next-line\n var items = [];\n items.push({ 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) });\n // tslint:disable-next-line:max-line-length\n items.push({ template: colorTemplate, align: 'right' });\n items.push({ template: opacityTemplate, align: 'right' });\n items.push({ type: 'Separator', align: 'right' });\n // tslint:disable-next-line:max-line-length\n items.push({ prefixIcon: 'e-pv-annotation-delete-icon e-pv-icon', className: 'e-pv-annotation-delete-container', id: this.pdfViewer.element.id + '_annotation_delete', align: 'right' });\n return items;\n };\n AnnotationToolbar.prototype.goBackToToolbar = function () {\n this.isMobileAnnotEnabled = false;\n this.hideMobileAnnotationToolbar();\n this.pdfViewer.toolbarModule.showToolbar(true);\n var page = this.pdfViewerBase.getSelectTextMarkupCurrentPage();\n if (page) {\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.selectTextMarkupCurrentPage = null;\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.clearAnnotationSelection(page);\n }\n };\n // tslint:disable-next-line\n AnnotationToolbar.prototype.createToolbarItems = function () {\n var colorTemplate = this.getTemplate('span', '_annotation_color', 'e-pv-annotation-color-container');\n var opacityTemplate = this.getTemplate('span', '_annotation_opacity', 'e-pv-annotation-opacity-container');\n // tslint:disable-next-line\n var items = [];\n // tslint:disable-next-line:max-line-length\n items.push({ prefixIcon: 'e-pv-highlight-icon e-pv-icon', className: 'e-pv-highlight-container', id: this.pdfViewer.element.id + '_highlight', align: 'Left' });\n items.push({ prefixIcon: 'e-pv-underline-icon e-pv-icon', className: 'e-pv-underline-container', id: this.pdfViewer.element.id + '_underline', align: 'Left' });\n // tslint:disable-next-line:max-line-length\n items.push({ prefixIcon: 'e-pv-strikethrough-icon e-pv-icon', className: 'e-pv-strikethrough-container', id: this.pdfViewer.element.id + '_strikethrough', align: 'Left' });\n items.push({ type: 'Separator', align: 'Left' });\n items.push({ template: colorTemplate, align: 'Left' });\n items.push({ template: opacityTemplate, align: 'Left' });\n items.push({ type: 'Separator', align: 'Left' });\n // tslint:disable-next-line:max-line-length\n items.push({ prefixIcon: 'e-pv-annotation-delete-icon e-pv-icon', className: 'e-pv-annotation-delete-container', id: this.pdfViewer.element.id + '_annotation_delete', align: 'Left' });\n items.push({ prefixIcon: 'e-pv-annotation-tools-close-icon e-pv-icon', className: 'e-pv-annotation-tools-close-container', id: this.pdfViewer.element.id + '_annotation_close', align: 'Right' });\n return items;\n };\n AnnotationToolbar.prototype.getTemplate = function (elementName, id, className) {\n var element = createElement(elementName, { id: this.pdfViewer.element.id + id });\n if (className) {\n element.className = className;\n }\n return element.outerHTML;\n };\n AnnotationToolbar.prototype.createDropDowns = function () {\n this.colorDropDownElement = this.pdfViewerBase.getElement('_annotation_color');\n this.colorPalette = this.createColorPicker(this.colorDropDownElement.id);\n // tslint:disable-next-line:max-line-length\n this.colorDropDown = this.createDropDownButton(this.colorDropDownElement, 'e-pv-annotation-color-icon', this.colorPalette.element.parentElement, this.pdfViewer.localeObj.getConstant('Color edit'));\n this.colorDropDown.beforeOpen = this.colorDropDownBeforeOpen.bind(this);\n this.colorDropDown.open = this.colorDropDownOpen.bind(this);\n this.pdfViewerBase.getElement('_annotation_color-popup').addEventListener('click', this.onColorPickerCancelClick.bind(this));\n this.opacityDropDownElement = this.pdfViewerBase.getElement('_annotation_opacity');\n var sliderContainer = this.createSlider(this.opacityDropDownElement.id);\n // tslint:disable-next-line:max-line-length\n this.opacityDropDown = this.createDropDownButton(this.opacityDropDownElement, 'e-pv-annotation-opacity-icon', sliderContainer, this.pdfViewer.localeObj.getConstant('Opacity edit'));\n this.opacityDropDown.beforeOpen = this.opacityDropDownBeforeOpen.bind(this);\n this.opacitySlider.change = this.opacityChange.bind(this);\n this.opacitySlider.changed = this.opacityChange.bind(this);\n this.opacityDropDown.open = this.opacityDropDownOpen.bind(this);\n };\n AnnotationToolbar.prototype.opacityDropDownOpen = function () {\n if (Browser.isDevice) {\n // tslint:disable-next-line:max-line-length\n var opacityElement = this.pdfViewerBase.getElement('_annotation_opacity-popup');\n opacityElement.style.left = '0px';\n }\n };\n AnnotationToolbar.prototype.onColorPickerCancelClick = function (event) {\n if (event.target.classList.contains('e-cancel')) {\n this.colorDropDown.toggle();\n }\n };\n AnnotationToolbar.prototype.colorDropDownBeforeOpen = function (args) {\n if (this.pdfViewer.annotationModule.textMarkupAnnotationModule) {\n if (this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAnnotation) {\n this.colorPalette.value = this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAnnotation.color;\n }\n else {\n this.setCurrentColorInPicker();\n }\n }\n this.colorPalette.refresh();\n this.updateColorInIcon(this.colorDropDownElement, this.colorPalette.value);\n };\n /**\n * @private\n */\n AnnotationToolbar.prototype.setCurrentColorInPicker = function () {\n if (this.pdfViewer.annotationModule.textMarkupAnnotationModule) {\n switch (this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAddMode) {\n case 'Highlight':\n // tslint:disable-next-line:max-line-length\n this.colorPalette.setProperties({ 'value': this.pdfViewer.annotationModule.textMarkupAnnotationModule.highlightColor }, true);\n break;\n case 'Underline':\n // tslint:disable-next-line:max-line-length\n this.colorPalette.setProperties({ 'value': this.pdfViewer.annotationModule.textMarkupAnnotationModule.underlineColor }, true);\n break;\n case 'Strikethrough':\n // tslint:disable-next-line:max-line-length\n this.colorPalette.setProperties({ 'value': this.pdfViewer.annotationModule.textMarkupAnnotationModule.strikethroughColor }, true);\n break;\n }\n }\n this.updateColorInIcon(this.colorDropDownElement, this.colorPalette.value);\n };\n AnnotationToolbar.prototype.colorDropDownOpen = function () {\n if (Browser.isDevice) {\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.getElement('_annotation_color-popup').style.left = '0px';\n }\n this.colorPalette.refresh();\n };\n AnnotationToolbar.prototype.opacityChange = function (args) {\n if (this.pdfViewer.annotationModule.textMarkupAnnotationModule) {\n if (this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAnnotation) {\n if (this.isCurrentAnnotationOpacitySet && args.name === 'changed') {\n this.isCurrentAnnotationOpacitySet = false;\n }\n else {\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.modifyOpacityProperty(args);\n }\n }\n else {\n switch (this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAddMode) {\n case 'Highlight':\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.highlightOpacity = args.value / 100;\n break;\n case 'Underline':\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.underlineOpacity = args.value / 100;\n break;\n case 'Strikethrough':\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.strikethroughOpacity = args.value / 100;\n break;\n }\n }\n }\n this.updateOpacityIndicator();\n };\n AnnotationToolbar.prototype.opacityDropDownBeforeOpen = function (args) {\n if (this.pdfViewer.annotationModule.textMarkupAnnotationModule) {\n if (this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAnnotation) {\n this.isCurrentAnnotationOpacitySet = true;\n // tslint:disable-next-line:max-line-length\n this.opacitySlider.value = this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAnnotation.opacity * 100;\n }\n else {\n switch (this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAddMode) {\n case 'Highlight':\n this.opacitySlider.value = this.pdfViewer.annotationModule.textMarkupAnnotationModule.highlightOpacity * 100;\n break;\n case 'Underline':\n this.opacitySlider.value = this.pdfViewer.annotationModule.textMarkupAnnotationModule.underlineOpacity * 100;\n break;\n case 'Strikethrough':\n this.opacitySlider.value = this.pdfViewer.annotationModule.textMarkupAnnotationModule.strikethroughOpacity * 100;\n break;\n }\n }\n }\n this.updateOpacityIndicator();\n };\n AnnotationToolbar.prototype.createDropDownButton = function (element, iconClass, target, tooltipText) {\n // tslint:disable-next-line:max-line-length\n var dropDownButton = new DropDownButton({ iconCss: iconClass + ' e-pv-icon', target: target });\n if (this.pdfViewer.enableRtl) {\n dropDownButton.enableRtl = true;\n }\n dropDownButton.appendTo(element);\n this.primaryToolbar.createTooltip(element, tooltipText);\n return dropDownButton;\n };\n AnnotationToolbar.prototype.createColorPicker = function (idString) {\n var inputElement = createElement('input', { id: idString + '_target' });\n document.body.appendChild(inputElement);\n var colorPicker = new ColorPicker({\n inline: true, mode: 'Palette', cssClass: 'e-show-value', enableOpacity: false,\n change: this.onColorPickerChange.bind(this), value: '#000000', showButtons: false,\n });\n if (this.pdfViewer.enableRtl) {\n colorPicker.enableRtl = true;\n }\n colorPicker.appendTo(inputElement);\n return colorPicker;\n };\n AnnotationToolbar.prototype.onColorPickerChange = function (args) {\n if (this.pdfViewer.annotationModule.textMarkupAnnotationModule) {\n if (this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAnnotation) {\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.modifyColorProperty(args.currentValue.hex);\n }\n else {\n switch (this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAddMode) {\n case 'Highlight':\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.highlightColor = args.currentValue.hex;\n break;\n case 'Underline':\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.underlineColor = args.currentValue.hex;\n break;\n case 'Strikethrough':\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.strikethroughColor = args.currentValue.hex;\n break;\n }\n }\n }\n this.updateColorInIcon(this.colorDropDownElement, args.currentValue.hex);\n this.colorDropDown.toggle();\n };\n /**\n * @private\n */\n AnnotationToolbar.prototype.updateColorInIcon = function (element, color) {\n element.childNodes[0].style.borderBottomColor = color;\n };\n AnnotationToolbar.prototype.updateOpacityIndicator = function () {\n this.opacityIndicator.textContent = this.opacitySlider.value + '%';\n };\n AnnotationToolbar.prototype.createSlider = function (idString) {\n var outerContainer = createElement('div', { className: 'e-pv-annotation-opacity-popup-container' });\n document.body.appendChild(outerContainer);\n var label = createElement('span', { id: idString + '_label', className: 'e-pv-annotation-opacity-label' });\n label.textContent = this.pdfViewer.localeObj.getConstant('Opacity');\n var sliderElement = createElement('div', { id: idString + '_slider' });\n this.opacitySlider = new Slider({ type: 'MinRange', cssClass: 'e-pv-annotation-opacity-slider', max: 100, min: 0 });\n // tslint:disable-next-line:max-line-length\n this.opacityIndicator = createElement('div', { id: idString + '_opacity_indicator', className: 'e-pv-annotation-opacity-indicator' });\n this.opacityIndicator.textContent = '100%';\n if (!this.pdfViewer.enableRtl) {\n outerContainer.appendChild(label);\n outerContainer.appendChild(sliderElement);\n this.opacitySlider.appendTo(sliderElement);\n this.opacitySlider.element.parentElement.classList.add('e-pv-annotation-opacity-slider-container');\n outerContainer.appendChild(this.opacityIndicator);\n }\n else {\n outerContainer.appendChild(this.opacityIndicator);\n outerContainer.appendChild(sliderElement);\n this.opacitySlider.enableRtl = true;\n this.opacitySlider.appendTo(sliderElement);\n this.opacitySlider.element.parentElement.classList.add('e-pv-annotation-opacity-slider-container');\n outerContainer.appendChild(label);\n }\n return outerContainer;\n };\n AnnotationToolbar.prototype.afterToolbarCreation = function () {\n // tslint:disable-next-line:max-line-length\n this.highlightItem = this.primaryToolbar.addClassToolbarItem('_highlight', 'e-pv-highlight', this.pdfViewer.localeObj.getConstant('Highlight'));\n this.underlineItem = this.primaryToolbar.addClassToolbarItem('_underline', 'e-pv-underline', this.pdfViewer.localeObj.getConstant('Underline'));\n // tslint:disable-next-line:max-line-length\n this.strikethroughItem = this.primaryToolbar.addClassToolbarItem('_strikethrough', 'e-pv-strikethrough', this.pdfViewer.localeObj.getConstant('Strikethrough'));\n this.deleteItem = this.primaryToolbar.addClassToolbarItem('_annotation_delete', 'e-pv-annotation-delete', this.pdfViewer.localeObj.getConstant('Delete'));\n this.closeItem = this.primaryToolbar.addClassToolbarItem('_annotation_close', 'e-pv-annotation-tools-close', null);\n this.selectAnnotationDeleteItem(false);\n this.enableAnnotationPropertiesTools(false);\n };\n AnnotationToolbar.prototype.onToolbarClicked = function (args) {\n switch (args.originalEvent.target.id) {\n case this.pdfViewer.element.id + '_highlight':\n case this.pdfViewer.element.id + '_highlightIcon':\n this.handleHighlight();\n break;\n case this.pdfViewer.element.id + '_underline':\n case this.pdfViewer.element.id + '_underlineIcon':\n this.handleUnderline();\n break;\n case this.pdfViewer.element.id + '_strikethrough':\n case this.pdfViewer.element.id + '_strikethroughIcon':\n this.handleStrikethrough();\n break;\n case this.pdfViewer.element.id + '_annotation_delete':\n case this.pdfViewer.element.id + '_annotation_deleteIcon':\n this.pdfViewer.annotationModule.deleteAnnotation();\n break;\n case this.pdfViewer.element.id + '_annotation_close':\n case this.pdfViewer.element.id + '_annotation_closeIcon':\n this.showAnnotationToolbar(this.primaryToolbar.annotationItem);\n break;\n }\n };\n /**\n * @private\n */\n AnnotationToolbar.prototype.showAnnotationToolbar = function (element) {\n if (!this.isToolbarHidden) {\n // tslint:disable-next-line\n var annotationModule = this.pdfViewer.annotationModule;\n if (element) {\n this.adjustViewer(false);\n this.primaryToolbar.deSelectItem(element);\n }\n // tslint:disable-next-line:max-line-length \n if (annotationModule && annotationModule.textMarkupAnnotationModule && annotationModule.textMarkupAnnotationModule.currentTextMarkupAnnotation) {\n this.enablePropertiesTool(annotationModule);\n }\n else {\n this.deselectAllItems();\n }\n this.toolbarElement.style.display = 'none';\n this.primaryToolbar.updateInteractionTools(true);\n }\n else {\n var toolBarInitialStatus = this.toolbarElement.style.display;\n this.toolbarElement.style.display = 'block';\n if (element) {\n this.primaryToolbar.selectItem(element);\n if (toolBarInitialStatus === 'none') {\n this.primaryToolbar.DisableInteractionTools();\n this.adjustViewer(true);\n }\n }\n }\n // tslint:disable-next-line:max-line-length \n if (this.pdfViewer.magnification && this.pdfViewer.magnification.fitType === 'fitToPage') {\n this.pdfViewer.magnification.fitToPage();\n }\n if (this.pdfViewerBase.isPanMode) {\n this.enableAnnotationAddTools(false);\n }\n else {\n this.enableAnnotationAddTools(true);\n }\n this.isToolbarHidden = !this.isToolbarHidden;\n };\n // tslint:disable-next-line\n AnnotationToolbar.prototype.enablePropertiesTool = function (annotationModule) {\n this.isHighlightEnabled = false;\n this.isUnderlineEnabled = false;\n this.isStrikethroughEnabled = false;\n if (this.pdfViewerBase.isTextMarkupAnnotationModule()) {\n annotationModule.textMarkupAnnotationModule.isTextMarkupAnnotationMode = false;\n }\n this.primaryToolbar.deSelectItem(this.highlightItem);\n this.primaryToolbar.deSelectItem(this.underlineItem);\n this.primaryToolbar.deSelectItem(this.strikethroughItem);\n this.enableAnnotationPropertiesTools(true);\n // tslint:disable-next-line:max-line-length \n this.updateColorInIcon(this.colorDropDownElement, annotationModule.textMarkupAnnotationModule.currentTextMarkupAnnotation.color);\n this.selectAnnotationDeleteItem(true);\n };\n AnnotationToolbar.prototype.applyAnnotationToolbarSettings = function () {\n if (this.pdfViewer.annotationToolbarSettings.annotationToolbarItem.indexOf('HighlightTool') !== -1) {\n this.showHighlightTool(true);\n }\n else {\n this.showHighlightTool(false);\n }\n if (this.pdfViewer.annotationToolbarSettings.annotationToolbarItem.indexOf('UnderlineTool') !== -1) {\n this.showUnderlineTool(true);\n }\n else {\n this.showUnderlineTool(false);\n }\n if (this.pdfViewer.annotationToolbarSettings.annotationToolbarItem.indexOf('StrikethroughTool') !== -1) {\n this.showStrikethroughTool(true);\n }\n else {\n this.showStrikethroughTool(false);\n }\n if (this.pdfViewer.annotationToolbarSettings.annotationToolbarItem.indexOf('ColorEditTool') !== -1) {\n this.showColorEditTool(true);\n }\n else {\n this.showColorEditTool(false);\n }\n if (this.pdfViewer.annotationToolbarSettings.annotationToolbarItem.indexOf('OpacityEditTool') !== -1) {\n this.showOpacityEditTool(true);\n }\n else {\n this.showOpacityEditTool(false);\n }\n if (this.pdfViewer.annotationToolbarSettings.annotationToolbarItem.indexOf('AnnotationDeleteTool') !== -1) {\n this.showAnnotationDeleteTool(true);\n }\n else {\n this.showAnnotationDeleteTool(false);\n }\n this.showSeparator();\n };\n AnnotationToolbar.prototype.showSeparator = function () {\n if ((!this.isHighlightBtnVisible && !this.isUnderlineBtnVisible && !this.isStrikethroughBtnVisible)\n || (!this.isColorToolVisible && !this.isOpacityToolVisible)) {\n this.applyHideToToolbar(false, 3, 3);\n }\n if ((!this.isColorToolVisible && !this.isOpacityToolVisible) && (!this.isHighlightBtnVisible &&\n !this.isUnderlineBtnVisible && !this.isStrikethroughBtnVisible) || !this.isDeleteAnnotationToolVisible) {\n this.applyHideToToolbar(false, 6, 6);\n }\n };\n AnnotationToolbar.prototype.showHighlightTool = function (isShow) {\n this.isHighlightBtnVisible = isShow;\n this.applyHideToToolbar(isShow, 0, 0);\n };\n AnnotationToolbar.prototype.showUnderlineTool = function (isShow) {\n this.isUnderlineBtnVisible = isShow;\n this.applyHideToToolbar(isShow, 1, 1);\n };\n AnnotationToolbar.prototype.showStrikethroughTool = function (isShow) {\n this.isStrikethroughBtnVisible = isShow;\n this.applyHideToToolbar(isShow, 2, 2);\n };\n AnnotationToolbar.prototype.showColorEditTool = function (isShow) {\n this.isColorToolVisible = isShow;\n this.applyHideToToolbar(isShow, 4, 4);\n };\n AnnotationToolbar.prototype.showOpacityEditTool = function (isShow) {\n this.isOpacityToolVisible = isShow;\n this.applyHideToToolbar(isShow, 5, 5);\n };\n AnnotationToolbar.prototype.showAnnotationDeleteTool = function (isShow) {\n this.isDeleteAnnotationToolVisible = isShow;\n this.applyHideToToolbar(isShow, 7, 7);\n };\n AnnotationToolbar.prototype.applyHideToToolbar = function (show, startIndex, endIndex) {\n var isHide = !show;\n for (var index = startIndex; index <= endIndex; index++) {\n this.toolbar.hideItem(index, isHide);\n }\n };\n AnnotationToolbar.prototype.adjustViewer = function (isAdjust) {\n var splitterElement = this.pdfViewerBase.getElement('_sideBarToolbarSplitter');\n var toolbarContainer = this.pdfViewerBase.getElement('_toolbarContainer');\n var toolbarHeight = this.getToolbarHeight(toolbarContainer);\n var annotationToolbarHeight = this.getToolbarHeight(this.toolbarElement);\n var sideBarToolbar = this.pdfViewerBase.navigationPane.sideBarToolbar;\n var sideBarContentContainer = this.pdfViewerBase.navigationPane.sideBarContentContainer;\n if (isAdjust) {\n // tslint:disable-next-line:max-line-length\n sideBarToolbar.style.top = (toolbarHeight + annotationToolbarHeight) + 'px';\n sideBarContentContainer.style.top = (toolbarHeight + annotationToolbarHeight) + 'px';\n splitterElement.style.top = (toolbarHeight + annotationToolbarHeight) + 'px';\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.viewerContainer.style.height = this.updateViewerHeight(this.getElementHeight(this.pdfViewerBase.viewerContainer), (annotationToolbarHeight)) + 'px';\n sideBarToolbar.style.height = sideBarToolbar.getBoundingClientRect().height - annotationToolbarHeight + 'px';\n splitterElement.style.height = splitterElement.getBoundingClientRect().height - annotationToolbarHeight + 'px';\n }\n else {\n // tslint:disable-next-line:max-line-length\n sideBarToolbar.style.top = toolbarHeight + 'px';\n sideBarContentContainer.style.top = toolbarHeight + 'px';\n splitterElement.style.top = toolbarHeight + 'px';\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.viewerContainer.style.height = this.resetViewerHeight(this.getElementHeight(this.pdfViewerBase.viewerContainer), annotationToolbarHeight) + 'px';\n sideBarToolbar.style.height = this.getHeight(sideBarToolbar, annotationToolbarHeight);\n splitterElement.style.height = this.getHeight(splitterElement, annotationToolbarHeight);\n }\n this.updateContentContainerHeight(isAdjust);\n };\n AnnotationToolbar.prototype.updateContentContainerHeight = function (isAdjust) {\n var annotationToolbarHeight = this.getToolbarHeight(this.toolbarElement);\n var sideBarClientRect = this.pdfViewerBase.navigationPane.sideBarContentContainer.getBoundingClientRect();\n if (sideBarClientRect.height !== 0) {\n if (isAdjust) {\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.navigationPane.sideBarContentContainer.style.height = sideBarClientRect.height - annotationToolbarHeight + 'px';\n }\n else {\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.navigationPane.sideBarContentContainer.style.height = sideBarClientRect.height + annotationToolbarHeight + 'px';\n }\n }\n };\n AnnotationToolbar.prototype.getToolbarHeight = function (element) {\n var toolbarHeight = element.getBoundingClientRect().height;\n if (toolbarHeight === 0 && element === this.pdfViewerBase.getElement('_toolbarContainer')) {\n // getComputedStyle gets the value from style and toolbar border height is added to it.\n // tslint:disable-next-line\n toolbarHeight = parseFloat(window.getComputedStyle(element)['height']) + this.toolbarBorderHeight;\n }\n return toolbarHeight;\n };\n AnnotationToolbar.prototype.getHeight = function (element, toolbarHeight) {\n var height = element.getBoundingClientRect().height;\n return (height !== 0) ? height + toolbarHeight + 'px' : '';\n };\n AnnotationToolbar.prototype.handleHighlight = function () {\n if (!this.isHighlightEnabled) {\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.drawTextMarkupAnnotations('Highlight');\n this.primaryToolbar.selectItem(this.highlightItem);\n this.primaryToolbar.deSelectItem(this.underlineItem);\n this.primaryToolbar.deSelectItem(this.strikethroughItem);\n this.enableAnnotationPropertiesTools(true);\n this.updateColorInIcon(this.colorDropDownElement, this.pdfViewer.annotationModule.textMarkupAnnotationModule.highlightColor);\n this.isHighlightEnabled = true;\n this.isUnderlineEnabled = false;\n this.isStrikethroughEnabled = false;\n }\n else {\n this.deselectAllItems();\n }\n };\n AnnotationToolbar.prototype.handleUnderline = function () {\n if (!this.isUnderlineEnabled) {\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.drawTextMarkupAnnotations('Underline');\n this.primaryToolbar.selectItem(this.underlineItem);\n this.primaryToolbar.deSelectItem(this.highlightItem);\n this.primaryToolbar.deSelectItem(this.strikethroughItem);\n this.enableAnnotationPropertiesTools(true);\n this.updateColorInIcon(this.colorDropDownElement, this.pdfViewer.annotationModule.textMarkupAnnotationModule.underlineColor);\n this.isUnderlineEnabled = true;\n this.isHighlightEnabled = false;\n this.isStrikethroughEnabled = false;\n }\n else {\n this.deselectAllItems();\n }\n };\n AnnotationToolbar.prototype.handleStrikethrough = function () {\n if (!this.isStrikethroughEnabled) {\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.drawTextMarkupAnnotations('Strikethrough');\n this.primaryToolbar.selectItem(this.strikethroughItem);\n this.primaryToolbar.deSelectItem(this.highlightItem);\n this.primaryToolbar.deSelectItem(this.underlineItem);\n this.enableAnnotationPropertiesTools(true);\n // tslint:disable-next-line:max-line-length\n this.updateColorInIcon(this.colorDropDownElement, this.pdfViewer.annotationModule.textMarkupAnnotationModule.strikethroughColor);\n this.isStrikethroughEnabled = true;\n this.isHighlightEnabled = false;\n this.isUnderlineEnabled = false;\n }\n else {\n this.deselectAllItems();\n }\n };\n AnnotationToolbar.prototype.deselectAllItems = function () {\n this.isHighlightEnabled = false;\n this.isUnderlineEnabled = false;\n this.isStrikethroughEnabled = false;\n if (this.pdfViewerBase.isTextMarkupAnnotationModule()) {\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.isTextMarkupAnnotationMode = false;\n }\n this.primaryToolbar.deSelectItem(this.highlightItem);\n this.primaryToolbar.deSelectItem(this.underlineItem);\n this.primaryToolbar.deSelectItem(this.strikethroughItem);\n this.enableAnnotationPropertiesTools(false);\n this.updateColorInIcon(this.colorDropDownElement, '#000000');\n this.selectAnnotationDeleteItem(false);\n };\n /**\n * @private\n */\n AnnotationToolbar.prototype.selectAnnotationDeleteItem = function (isEnable) {\n this.toolbar.enableItems(this.deleteItem.parentElement, isEnable);\n };\n /**\n * @private\n */\n AnnotationToolbar.prototype.enableAnnotationPropertiesTools = function (isEnable) {\n this.toolbar.enableItems(this.colorDropDownElement.parentElement, isEnable);\n this.toolbar.enableItems(this.opacityDropDownElement.parentElement, isEnable);\n };\n /**\n * @private\n */\n AnnotationToolbar.prototype.enableAnnotationAddTools = function (isEnable) {\n this.toolbar.enableItems(this.highlightItem.parentElement, isEnable);\n this.toolbar.enableItems(this.underlineItem.parentElement, isEnable);\n this.toolbar.enableItems(this.strikethroughItem.parentElement, isEnable);\n };\n /**\n * @private\n */\n AnnotationToolbar.prototype.isAnnotationButtonsEnabled = function () {\n var isButtonsEnabled = false;\n if (this.isHighlightEnabled || this.isUnderlineEnabled || this.isStrikethroughEnabled) {\n isButtonsEnabled = true;\n }\n return isButtonsEnabled;\n };\n AnnotationToolbar.prototype.updateToolbarItems = function () {\n if (this.pdfViewer.enableTextMarkupAnnotation) {\n this.enableAnnotationAddTools(true);\n }\n else {\n this.enableAnnotationAddTools(false);\n }\n };\n /**\n * @private\n */\n AnnotationToolbar.prototype.resetToolbar = function () {\n this.adjustViewer(false);\n this.updateToolbarItems();\n this.toolbarElement.style.display = 'none';\n this.isToolbarHidden = true;\n };\n /**\n * @private\n */\n AnnotationToolbar.prototype.clear = function () {\n this.deselectAllItems();\n };\n /**\n * @private\n */\n AnnotationToolbar.prototype.destroy = function () {\n this.colorDropDown.destroy();\n this.opacityDropDown.destroy();\n this.toolbar.destroy();\n };\n AnnotationToolbar.prototype.getElementHeight = function (element) {\n return element.getBoundingClientRect().height;\n };\n AnnotationToolbar.prototype.updateViewerHeight = function (viewerHeight, toolbarHeight) {\n return viewerHeight - toolbarHeight;\n };\n AnnotationToolbar.prototype.resetViewerHeight = function (viewerHeight, toolbarHeight) {\n return viewerHeight + toolbarHeight;\n };\n return AnnotationToolbar;\n}());\nexport { AnnotationToolbar };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, NotifyPropertyChanges, ChildProperty, L10n } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, Property, Event } from '@syncfusion/ej2-base';\nimport { PdfViewerBase } from './index';\n/**\n * The `ToolbarSettings` module is used to provide the toolbar settings of PDF viewer.\n */\nvar ToolbarSettings = /** @class */ (function (_super) {\n __extends(ToolbarSettings, _super);\n function ToolbarSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], ToolbarSettings.prototype, \"showTooltip\", void 0);\n __decorate([\n Property()\n ], ToolbarSettings.prototype, \"toolbarItem\", void 0);\n return ToolbarSettings;\n}(ChildProperty));\nexport { ToolbarSettings };\n/**\n * The `AnnotationToolbarSettings` module is used to provide the annotation toolbar settings of the PDF viewer.\n */\nvar AnnotationToolbarSettings = /** @class */ (function (_super) {\n __extends(AnnotationToolbarSettings, _super);\n function AnnotationToolbarSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], AnnotationToolbarSettings.prototype, \"showTooltip\", void 0);\n __decorate([\n Property()\n ], AnnotationToolbarSettings.prototype, \"annotationToolbarItem\", void 0);\n return AnnotationToolbarSettings;\n}(ChildProperty));\nexport { AnnotationToolbarSettings };\n/**\n * The `ServerActionSettings` module is used to provide the server action methods of PDF viewer.\n */\nvar ServerActionSettings = /** @class */ (function (_super) {\n __extends(ServerActionSettings, _super);\n function ServerActionSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Load')\n ], ServerActionSettings.prototype, \"load\", void 0);\n __decorate([\n Property('Unload')\n ], ServerActionSettings.prototype, \"unload\", void 0);\n __decorate([\n Property('RenderPdfPages')\n ], ServerActionSettings.prototype, \"renderPages\", void 0);\n __decorate([\n Property('RenderPdfPages')\n ], ServerActionSettings.prototype, \"print\", void 0);\n __decorate([\n Property('Download')\n ], ServerActionSettings.prototype, \"download\", void 0);\n __decorate([\n Property('RenderThumbnailImages')\n ], ServerActionSettings.prototype, \"renderThumbnail\", void 0);\n return ServerActionSettings;\n}(ChildProperty));\nexport { ServerActionSettings };\n/**\n * The `StrikethroughSettings` module is used to provide the properties to Strikethrough annotation.\n */\nvar StrikethroughSettings = /** @class */ (function (_super) {\n __extends(StrikethroughSettings, _super);\n function StrikethroughSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(1)\n ], StrikethroughSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property('#ff0000')\n ], StrikethroughSettings.prototype, \"color\", void 0);\n __decorate([\n Property('Guest')\n ], StrikethroughSettings.prototype, \"author\", void 0);\n __decorate([\n Property('strikethrough')\n ], StrikethroughSettings.prototype, \"subject\", void 0);\n __decorate([\n Property('')\n ], StrikethroughSettings.prototype, \"modifiedDate\", void 0);\n return StrikethroughSettings;\n}(ChildProperty));\nexport { StrikethroughSettings };\n/**\n * The `UnderlineSettings` module is used to provide the properties to Underline annotation.\n */\nvar UnderlineSettings = /** @class */ (function (_super) {\n __extends(UnderlineSettings, _super);\n function UnderlineSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(1)\n ], UnderlineSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property('#00ff00')\n ], UnderlineSettings.prototype, \"color\", void 0);\n __decorate([\n Property('Guest')\n ], UnderlineSettings.prototype, \"author\", void 0);\n __decorate([\n Property('underline')\n ], UnderlineSettings.prototype, \"subject\", void 0);\n __decorate([\n Property('')\n ], UnderlineSettings.prototype, \"modifiedDate\", void 0);\n return UnderlineSettings;\n}(ChildProperty));\nexport { UnderlineSettings };\n/**\n * The `HighlightSettings` module is used to provide the properties to Highlight annotation.\n */\nvar HighlightSettings = /** @class */ (function (_super) {\n __extends(HighlightSettings, _super);\n function HighlightSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(1)\n ], HighlightSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property('#ffff00')\n ], HighlightSettings.prototype, \"color\", void 0);\n __decorate([\n Property('Guest')\n ], HighlightSettings.prototype, \"author\", void 0);\n __decorate([\n Property('highlight')\n ], HighlightSettings.prototype, \"subject\", void 0);\n __decorate([\n Property('')\n ], HighlightSettings.prototype, \"modifiedDate\", void 0);\n return HighlightSettings;\n}(ChildProperty));\nexport { HighlightSettings };\n/**\n * Represents the PDF viewer component.\n * ```html\n * \n * \n * ```\n */\nvar PdfViewer = /** @class */ (function (_super) {\n __extends(PdfViewer, _super);\n function PdfViewer(options, element) {\n var _this = _super.call(this, options, element) || this;\n /**\n * Gets or sets the document name loaded in the PdfViewer control.\n */\n _this.fileName = null;\n /** @hidden */\n _this.defaultLocale = {\n 'PdfViewer': 'PDF Viewer',\n 'Cancel': 'Cancel',\n 'Download file': 'Download file',\n 'Download': 'Download',\n 'Enter Password': 'This document is password protected. Please enter a password.',\n 'File Corrupted': 'File Corrupted',\n 'File Corrupted Content': 'The file is corrupted and cannot be opened.',\n 'Fit Page': 'Fit Page',\n 'Fit Width': 'Fit Width',\n 'Automatic': 'Automatic',\n 'Go To First Page': 'Show first page',\n 'Invalid Password': 'Incorrect Password. Please try again.',\n 'Next Page': 'Show next page',\n 'OK': 'OK',\n 'Open': 'Open file',\n 'Page Number': 'Current page number',\n 'Previous Page': 'Show previous page',\n 'Go To Last Page': 'Show last page',\n 'Zoom': 'Zoom',\n 'Zoom In': 'Zoom in',\n 'Zoom Out': 'Zoom out',\n 'Page Thumbnails': 'Page thumbnails',\n 'Bookmarks': 'Bookmarks',\n 'Print': 'Print file',\n 'Password Protected': 'Password Required',\n 'Copy': 'Copy',\n 'Text Selection': 'Text selection tool',\n 'Panning': 'Pan mode',\n 'Text Search': 'Find text',\n 'Find in document': 'Find in document',\n 'Match case': 'Match case',\n 'Apply': 'Apply',\n 'GoToPage': 'Go to Page',\n // tslint:disable-next-line:max-line-length\n 'No matches': 'Viewer has finished searching the document. No more matches were found',\n 'No Text Found': 'No Text Found',\n 'Undo': 'Undo',\n 'Redo': 'Redo',\n 'Annotation': 'Add or Edit annotations',\n 'Highlight': 'Highlight Text',\n 'Underline': 'Underline Text',\n 'Strikethrough': 'Strikethrough Text',\n 'Delete': 'Delete annotation',\n 'Opacity': 'Opacity',\n 'Color edit': 'Change Color',\n 'Opacity edit': 'Change Opacity',\n 'Highlight context': 'Highlight',\n 'Underline context': 'Underline',\n 'Strikethrough context': 'Strike through',\n // tslint:disable-next-line:max-line-length\n 'Server error': 'Web-service is not listening. PDF Viewer depends on web-service for all it\\'s features. Please start the web service to continue.',\n 'Open text': 'Open',\n 'First text': 'First Page',\n 'Previous text': 'Previous Page',\n 'Next text': 'Next Page',\n 'Last text': 'Last Page',\n 'Zoom in text': 'Zoom In',\n 'Zoom out text': 'Zoom Out',\n 'Selection text': 'Selection',\n 'Pan text': 'Pan',\n 'Print text': 'Print',\n 'Search text': 'Search',\n 'Annotation Edit text': 'Edit Annotation'\n };\n _this.viewerBase = new PdfViewerBase(_this);\n return _this;\n }\n Object.defineProperty(PdfViewer.prototype, \"pageCount\", {\n /**\n * Returns the page count of the document loaded in the PdfViewer control.\n */\n get: function () {\n return this.viewerBase.pageCount;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfViewer.prototype, \"isDocumentEdited\", {\n /**\n * Checks whether the PDF document is edited.\n */\n get: function () {\n return this.viewerBase.isDocumentEdited;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfViewer.prototype, \"currentPageNumber\", {\n /**\n * Returns the current page number of the document displayed in the PdfViewer control.\n */\n get: function () {\n return this.viewerBase.currentPageNumber;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfViewer.prototype, \"zoomPercentage\", {\n /**\n * Returns the current zoom percentage of the PdfViewer control.\n */\n get: function () {\n return this.magnificationModule.zoomFactor * 100;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfViewer.prototype, \"bookmark\", {\n /**\n * Gets the bookmark view object of the pdf viewer.\n * @returns { BookmarkView }\n */\n get: function () {\n return this.bookmarkViewModule;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfViewer.prototype, \"print\", {\n /**\n * Gets the print object of the pdf viewer.\n * @returns { Print }\n */\n get: function () {\n return this.printModule;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfViewer.prototype, \"magnification\", {\n /**\n * Gets the magnification object of the pdf viewer.\n * @returns { Magnification }\n */\n get: function () {\n return this.magnificationModule;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfViewer.prototype, \"navigation\", {\n /**\n * Gets the navigation object of the pdf viewer.\n * @returns { Navigation }\n */\n get: function () {\n return this.navigationModule;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfViewer.prototype, \"textSearch\", {\n /**\n * Gets the text search object of the pdf viewer.\n * @returns { TextSearch }\n */\n get: function () {\n return this.textSearchModule;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfViewer.prototype, \"toolbar\", {\n /**\n * Gets the toolbar object of the pdf viewer.\n * @returns { Toolbar }\n */\n get: function () {\n return this.toolbarModule;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(PdfViewer.prototype, \"annotation\", {\n /**\n * Gets the annotation object of the pdf viewer.\n * @returns { Annotation }\n */\n get: function () {\n return this.annotationModule;\n },\n enumerable: true,\n configurable: true\n });\n PdfViewer.prototype.preRender = function () {\n this.localeObj = new L10n(this.getModuleName(), this.defaultLocale, this.locale);\n };\n PdfViewer.prototype.render = function () {\n this.viewerBase.initializeComponent();\n if (this.enableTextSelection && this.textSelectionModule) {\n this.textSelectionModule.enableTextSelectionMode();\n }\n else {\n this.viewerBase.disableTextSelectionMode();\n }\n };\n PdfViewer.prototype.getModuleName = function () {\n return 'PdfViewer';\n };\n /**\n * @private\n */\n PdfViewer.prototype.getLocaleConstants = function () {\n return this.defaultLocale;\n };\n PdfViewer.prototype.onPropertyChanged = function (newProp, oldProp) {\n var requireRefresh = false;\n if (this.isDestroyed) {\n return;\n }\n var properties = Object.keys(newProp);\n for (var _i = 0, properties_1 = properties; _i < properties_1.length; _i++) {\n var prop = properties_1[_i];\n switch (prop) {\n case 'enableToolbar':\n this.notify('', { module: 'toolbar', enable: this.enableToolbar });\n requireRefresh = true;\n break;\n }\n }\n };\n PdfViewer.prototype.getPersistData = function () {\n return 'PdfViewer';\n };\n PdfViewer.prototype.requiredModules = function () {\n var modules = [];\n if (this.enableMagnification) {\n modules.push({\n member: 'Magnification', args: [this, this.viewerBase]\n });\n }\n if (this.enableNavigation) {\n modules.push({\n member: 'Navigation', args: [this, this.viewerBase]\n });\n }\n if (this.enableToolbar) {\n modules.push({\n member: 'Toolbar', args: [this, this.viewerBase]\n });\n }\n if (this.enableHyperlink) {\n modules.push({\n member: 'LinkAnnotation', args: [this, this.viewerBase]\n });\n }\n if (this.enableThumbnail) {\n modules.push({\n member: 'ThumbnailView', args: [this, this.viewerBase]\n });\n }\n if (this.enableBookmark) {\n modules.push({\n member: 'BookmarkView', args: [this, this.viewerBase]\n });\n }\n if (this.enableTextSelection) {\n modules.push({\n member: 'TextSelection', args: [this, this.viewerBase]\n });\n }\n if (this.enableTextSearch) {\n modules.push({\n member: 'TextSearch', args: [this, this.viewerBase]\n });\n }\n if (this.enablePrint) {\n modules.push({\n member: 'Print', args: [this, this.viewerBase]\n });\n }\n if (this.enableAnnotation) {\n modules.push({\n member: 'Annotation', args: [this, this.viewerBase]\n });\n }\n return modules;\n };\n /**\n * Loads the given PDF document in the PDF viewer control\n * @param {string} document - Specifies the document name for load\n * @param {string} password - Specifies the Given document password\n * @returns void\n */\n PdfViewer.prototype.load = function (document, password) {\n if (this.viewerBase.pageCount !== 0) {\n this.viewerBase.clear(true);\n }\n else {\n this.viewerBase.clear(false);\n }\n this.viewerBase.pageCount = 0;\n this.viewerBase.currentPageNumber = 0;\n if (this.toolbarModule) {\n this.toolbarModule.resetToolbar();\n }\n this.viewerBase.initiatePageRender(document, password);\n };\n /**\n * Downloads the PDF document being loaded in the ejPdfViewer control.\n * @returns void\n */\n PdfViewer.prototype.download = function () {\n if (this.enableDownload) {\n this.viewerBase.download();\n }\n };\n /**\n * Perform undo action for the edited annotations\n * @returns void\n */\n PdfViewer.prototype.undo = function () {\n if (this.annotationModule) {\n this.annotationModule.undo();\n }\n };\n /**\n * Perform redo action for the edited annotations\n * @returns void\n */\n PdfViewer.prototype.redo = function () {\n if (this.annotationModule) {\n this.annotationModule.redo();\n }\n };\n /**\n * Unloads the PDF document being displayed in the PDF viewer.\n * @returns void\n */\n PdfViewer.prototype.unload = function () {\n this.viewerBase.clear(true);\n this.viewerBase.pageCount = 0;\n this.toolbarModule.resetToolbar();\n this.magnificationModule.zoomTo(100);\n };\n /**\n * Destroys all managed resources used by this object.\n */\n PdfViewer.prototype.destroy = function () {\n _super.prototype.destroy.call(this);\n if (this.toolbarModule) {\n this.toolbarModule.destroy();\n }\n if (!isNullOrUndefined(this.element)) {\n this.element.classList.remove('e-pdfviewer');\n this.element.innerHTML = '';\n }\n this.viewerBase.destroy();\n };\n /**\n * @private\n */\n PdfViewer.prototype.fireDocumentLoad = function () {\n var eventArgs = { name: 'documentLoad', documentName: this.fileName };\n this.trigger('documentLoad', eventArgs);\n };\n /**\n * @private\n */\n PdfViewer.prototype.fireDocumentUnload = function (fileName) {\n var eventArgs = { name: 'documentUnload', documentName: fileName };\n this.trigger('documentUnload', eventArgs);\n };\n /**\n * @private\n */\n PdfViewer.prototype.fireDocumentLoadFailed = function (isPasswordRequired, password) {\n // tslint:disable-next-line:max-line-length\n var eventArgs = { name: 'documentLoadFailed', documentName: this.fileName, isPasswordRequired: isPasswordRequired, password: password };\n this.trigger('documentLoadFailed', eventArgs);\n };\n /**\n * @private\n */\n PdfViewer.prototype.fireAjaxRequestFailed = function (errorStatusCode, errorMessage) {\n // tslint:disable-next-line:max-line-length\n var eventArgs = { name: 'ajaxRequestFailed', documentName: this.fileName, errorStatusCode: errorStatusCode, errorMessage: errorMessage };\n this.trigger('ajaxRequestFailed', eventArgs);\n };\n /**\n * @private\n */\n PdfViewer.prototype.firePageClick = function (x, y, pageNumber) {\n var eventArgs = { name: 'pageClick', documentName: this.fileName, x: x, y: y, pageNumber: pageNumber };\n this.trigger('pageClick', eventArgs);\n };\n /**\n * @private\n */\n PdfViewer.prototype.firePageChange = function (previousPageNumber) {\n // tslint:disable-next-line:max-line-length\n var eventArgs = { name: 'pageChange', documentName: this.fileName, currentPageNumber: this.viewerBase.currentPageNumber, previousPageNumber: previousPageNumber };\n this.trigger('pageChange', eventArgs);\n };\n /**\n * @private\n */\n PdfViewer.prototype.fireZoomChange = function () {\n // tslint:disable-next-line:max-line-length\n var eventArgs = { name: 'zoomChange', zoomValue: this.magnificationModule.zoomFactor * 100, previousZoomValue: this.magnificationModule.previousZoomFactor * 100 };\n this.trigger('zoomChange', eventArgs);\n };\n /**\n * @private\n */\n PdfViewer.prototype.fireHyperlinkClick = function (hyperlink) {\n // tslint:disable-next-line:max-line-length\n var eventArgs = { name: 'hyperlinkClick', hyperlink: hyperlink };\n this.trigger('hyperlinkClick', eventArgs);\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n PdfViewer.prototype.fireAnnotationAdd = function (pageNumber, index, type, bounds, settings) {\n var eventArgs = { name: 'annotationAdd', pageIndex: pageNumber, annotationId: index, annotationType: type, annotationBound: bounds, annotationSettings: settings };\n this.trigger('annotationAdd', eventArgs);\n };\n /**\n * @private\n */\n PdfViewer.prototype.fireAnnotationRemove = function (pageNumber, index, type) {\n // tslint:disable-next-line:max-line-length\n var eventArgs = { name: 'annotationRemove', pageIndex: pageNumber, annotationId: index, annotationType: type };\n this.trigger('annotationRemove', eventArgs);\n };\n /**\n * @private\n */\n // tslint:disable-next-line:max-line-length\n PdfViewer.prototype.fireAnnotationPropertiesChange = function (pageNumber, index, type, isColorChanged, isOpacityChanged) {\n var eventArgs = { name: 'annotationPropertiesChange', pageIndex: pageNumber, annotationId: index, annotationType: type, isColorChanged: isColorChanged, isOpacityChanged: isOpacityChanged };\n this.trigger('annotationPropertiesChange', eventArgs);\n };\n __decorate([\n Property()\n ], PdfViewer.prototype, \"serviceUrl\", void 0);\n __decorate([\n Property()\n ], PdfViewer.prototype, \"documentPath\", void 0);\n __decorate([\n Property('auto')\n ], PdfViewer.prototype, \"height\", void 0);\n __decorate([\n Property('auto')\n ], PdfViewer.prototype, \"width\", void 0);\n __decorate([\n Property(true)\n ], PdfViewer.prototype, \"enableToolbar\", void 0);\n __decorate([\n Property(true)\n ], PdfViewer.prototype, \"enableNavigationToolbar\", void 0);\n __decorate([\n Property(true)\n ], PdfViewer.prototype, \"enableDownload\", void 0);\n __decorate([\n Property(true)\n ], PdfViewer.prototype, \"enablePrint\", void 0);\n __decorate([\n Property(true)\n ], PdfViewer.prototype, \"enableThumbnail\", void 0);\n __decorate([\n Property(true)\n ], PdfViewer.prototype, \"enableBookmark\", void 0);\n __decorate([\n Property(true)\n ], PdfViewer.prototype, \"enableHyperlink\", void 0);\n __decorate([\n Property('CurrentTab')\n ], PdfViewer.prototype, \"hyperlinkOpenState\", void 0);\n __decorate([\n Property(true)\n ], PdfViewer.prototype, \"enableNavigation\", void 0);\n __decorate([\n Property(true)\n ], PdfViewer.prototype, \"enableMagnification\", void 0);\n __decorate([\n Property(true)\n ], PdfViewer.prototype, \"enableTextSelection\", void 0);\n __decorate([\n Property(true)\n ], PdfViewer.prototype, \"enableTextSearch\", void 0);\n __decorate([\n Property(true)\n ], PdfViewer.prototype, \"enableAnnotation\", void 0);\n __decorate([\n Property(true)\n ], PdfViewer.prototype, \"enableTextMarkupAnnotation\", void 0);\n __decorate([\n Property('TextSelection')\n ], PdfViewer.prototype, \"interactionMode\", void 0);\n __decorate([\n Property({ showTooltip: true, toolbarItem: ['OpenOption', 'UndoRedoTool', 'PageNavigationTool', 'MagnificationTool', 'PanTool', 'SelectionTool', 'CommentOption', 'AnnotationEditTool', 'FreeTextAnnotationOption', 'InkAnnotationOption', 'ShapeAnnotationOption', 'StampAnnotation', 'SignatureOption', 'SearchOption', 'PrintOption', 'DownloadOption'] })\n ], PdfViewer.prototype, \"toolbarSettings\", void 0);\n __decorate([\n Property({ showTooltip: true, annotationToolbarItem: ['HighlightTool', 'UnderlineTool', 'StrikethroughTool', 'ColorEditTool', 'OpacityEditTool', 'AnnotationDeleteTool'] })\n ], PdfViewer.prototype, \"annotationToolbarSettings\", void 0);\n __decorate([\n Property({ load: 'Load', renderPages: 'RenderPdfPages', unload: 'Unload', download: 'Download', renderThumbnail: 'RenderThumbnailImages' })\n ], PdfViewer.prototype, \"serverActionSettings\", void 0);\n __decorate([\n Property({ opacity: 1, color: '#FFDF56', author: 'Guest', subject: 'Highlight', modifiedDate: '' })\n ], PdfViewer.prototype, \"highlightSettings\", void 0);\n __decorate([\n Property({ opacity: 1, color: '#ff0000', author: 'Guest', subject: 'Strikethrough', modifiedDate: '' })\n ], PdfViewer.prototype, \"strikethroughSettings\", void 0);\n __decorate([\n Property({ opacity: 1, color: '#00ff00', author: 'Guest', subject: 'Underline', modifiedDate: '' })\n ], PdfViewer.prototype, \"underlineSettings\", void 0);\n __decorate([\n Event()\n ], PdfViewer.prototype, \"documentLoad\", void 0);\n __decorate([\n Event()\n ], PdfViewer.prototype, \"documentUnload\", void 0);\n __decorate([\n Event()\n ], PdfViewer.prototype, \"documentLoadFailed\", void 0);\n __decorate([\n Event()\n ], PdfViewer.prototype, \"ajaxRequestFailed\", void 0);\n __decorate([\n Event()\n ], PdfViewer.prototype, \"pageClick\", void 0);\n __decorate([\n Event()\n ], PdfViewer.prototype, \"pageChange\", void 0);\n __decorate([\n Event()\n ], PdfViewer.prototype, \"hyperlinkClick\", void 0);\n __decorate([\n Event()\n ], PdfViewer.prototype, \"zoomChange\", void 0);\n __decorate([\n Event()\n ], PdfViewer.prototype, \"annotationAdd\", void 0);\n __decorate([\n Event()\n ], PdfViewer.prototype, \"annotationRemove\", void 0);\n __decorate([\n Event()\n ], PdfViewer.prototype, \"annotationPropertiesChange\", void 0);\n PdfViewer = __decorate([\n NotifyPropertyChanges\n ], PdfViewer);\n return PdfViewer;\n}(Component));\nexport { PdfViewer };\n","import { createElement, Browser } from '@syncfusion/ej2-base';\nimport { TreeView } from '@syncfusion/ej2-navigations';\nimport { ListView } from '@syncfusion/ej2-lists';\n/**\n * BookmarkView module\n */\nvar BookmarkView = /** @class */ (function () {\n /**\n * @private\n */\n function BookmarkView(pdfViewer, pdfViewerBase) {\n var _this = this;\n /**\n * @private\n */\n this.childNavigateCount = 0;\n // tslint:disable-next-line\n this.bookmarkClick = function (args) {\n // tslint:disable-next-line\n if (!args.event.target.classList.contains('e-icons')) {\n var bookid = args.data.Id;\n _this.childNavigateCount = 0;\n _this.pdfViewerBase.navigationPane.goBackToToolbar();\n _this.navigateToBookmark(bookid);\n }\n else {\n _this.childNavigateCount++;\n }\n return false;\n };\n this.nodeClick = function (args) {\n _this.setHeight(args.node);\n var bookid = Number(args.nodeData.id);\n _this.navigateToBookmark(bookid);\n return false;\n };\n this.pdfViewer = pdfViewer;\n this.pdfViewerBase = pdfViewerBase;\n }\n /**\n * @private\n */\n BookmarkView.prototype.createRequestForBookmarks = function () {\n var _this = this;\n var proxy = this;\n var request = new XMLHttpRequest();\n // tslint:disable-next-line:max-line-length\n var jsonObject = { hashId: this.pdfViewerBase.hashId };\n request.open('POST', proxy.pdfViewer.serviceUrl + '/Bookmarks');\n request.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');\n request.responseType = 'json';\n request.send(JSON.stringify(jsonObject));\n // tslint:disable-next-line\n request.onreadystatechange = function (event) {\n if (request.readyState === 4 && request.status === 200) {\n if (_this.pdfViewerBase.navigationPane) {\n _this.pdfViewerBase.navigationPane.disableBookmarkButton();\n }\n // tslint:disable-next-line\n var data = event.currentTarget.response;\n if (data) {\n if (typeof data !== 'object') {\n data = JSON.parse(data);\n }\n _this.bookmarks = { bookMark: data.Bookmarks };\n _this.bookmarksDestination = { bookMarkDestination: data.BookmarksDestination };\n }\n if (_this.pdfViewerBase.navigationPane) {\n if (_this.bookmarks == null) {\n _this.pdfViewerBase.navigationPane.disableBookmarkButton();\n }\n else {\n _this.pdfViewerBase.navigationPane.enableBookmarkButton();\n _this.isBookmarkViewDiv = false;\n }\n }\n }\n };\n // tslint:disable-next-line\n request.onerror = function (event) {\n _this.pdfViewerBase.openNotificationPopup();\n proxy.pdfViewer.fireAjaxRequestFailed(request.status, request.statusText);\n };\n };\n /**\n * @private\n */\n BookmarkView.prototype.renderBookmarkcontent = function () {\n var _this = this;\n if (!this.isBookmarkViewDiv) {\n this.bookmarkView = createElement('div', { id: this.pdfViewer.element.id + '_bookmark_view', className: 'e-pv-bookmark-view' });\n this.pdfViewerBase.navigationPane.sideBarContent.appendChild(this.bookmarkView);\n // tslint:disable-next-line:max-line-length\n var bookmarkIconView = createElement('div', { id: this.pdfViewer.element.id + '_bookmark_iconview', className: 'e-pv-bookmark-icon-view' });\n // tslint:disable-next-line:max-line-length\n if (!this.pdfViewer.enableRtl) {\n // tslint:disable-next-line:max-line-length\n var bookmarkIcon = createElement('span', { id: this.pdfViewer.element.id + '_bookmark_icon', className: 'e-pv-bookmark-icon e-pv-icon' });\n bookmarkIconView.appendChild(bookmarkIcon);\n }\n else {\n // tslint:disable-next-line:max-line-length\n var bookmarkIcon = createElement('span', { id: this.pdfViewer.element.id + '_bookmark_icon', className: 'e-pv-bookmark-icon e-pv-icon e-right' });\n bookmarkIconView.appendChild(bookmarkIcon);\n }\n // tslint:disable-next-line:max-line-length\n var bookmarkTitle = createElement('div', { id: this.pdfViewer.element.id + '_bookmark_Title', className: 'e-pv-bookmark-Title' });\n if (this.pdfViewer.enableRtl) {\n bookmarkTitle.style.paddingRight = 26 + 'px';\n }\n else {\n bookmarkTitle.style.paddingLeft = 40 + 'px';\n }\n bookmarkTitle.innerText = '${Title}';\n bookmarkIconView.appendChild(bookmarkTitle);\n // tslint:disable-next-line:max-line-length\n this.treeObj = new TreeView({\n fields: {\n dataSource: this.bookmarks.bookMark,\n id: 'Id',\n text: 'Title',\n child: 'Child',\n hasChildren: 'HasChild',\n },\n nodeTemplate: bookmarkIconView.outerHTML,\n nodeSelected: this.nodeClick.bind(this),\n });\n if (this.pdfViewer.enableRtl) {\n this.treeObj.enableRtl = true;\n }\n this.treeObj.appendTo(this.bookmarkView);\n ['mouseover', 'keydown'].forEach(function (evt) { return _this.bookmarkView.addEventListener(evt, function (event) {\n _this.setHeight(event.target);\n }); });\n this.isBookmarkViewDiv = true;\n }\n this.bookmarkView.style.display = 'block';\n };\n /**\n * @private\n */\n BookmarkView.prototype.renderBookmarkContentMobile = function () {\n if (this.bookmarkView != null) {\n this.bookmarkView.remove();\n }\n this.bookmarkView = createElement('div', { id: this.pdfViewer.element.id + '_bookmark_view', className: 'e-pv-bookmark-view' });\n this.pdfViewerBase.getElement('_bookmarks_container').appendChild(this.bookmarkView);\n this.bookmarkList = new ListView({\n dataSource: this.bookmarks.bookMark,\n fields: {\n id: 'Id',\n text: 'Title',\n child: 'Child'\n },\n showHeader: false,\n select: this.bookmarkClick.bind(this)\n });\n if (this.pdfViewer.enableRtl) {\n this.bookmarkList.enableRtl = true;\n }\n this.bookmarkList.appendTo(this.bookmarkView);\n };\n // tslint:disable-next-line\n BookmarkView.prototype.setHeight = function (element) {\n if (this.treeObj.fullRowSelect) {\n if (element.classList.contains('e-treeview')) {\n element = element.querySelector('.e-node-focus').querySelector('.e-fullrow');\n }\n else if (element.classList.contains('e-list-parent')) {\n element = element.querySelector('.e-fullrow');\n }\n else if (element.classList.value !== ('e-fullrow') && element.closest('.e-list-item')) {\n element = element.closest('.e-list-item').querySelector('.e-fullrow');\n }\n if (element.nextElementSibling) {\n element.style.height = element.nextElementSibling.offsetHeight + 'px';\n }\n }\n };\n /**\n * @private\n */\n BookmarkView.prototype.setBookmarkContentHeight = function () {\n // tslint:disable-next-line\n var element = this.treeObj.element;\n if (this.treeObj.fullRowSelect) {\n if (element.classList.contains('e-treeview')) {\n element = element.querySelector('.e-node-focus').querySelector('.e-fullrow');\n }\n if (element.nextElementSibling) {\n element.style.height = element.nextElementSibling.offsetHeight + 'px';\n }\n }\n };\n BookmarkView.prototype.navigateToBookmark = function (bookid) {\n var pageIndex = this.bookmarksDestination.bookMarkDestination[bookid].PageIndex;\n var Y = this.bookmarksDestination.bookMarkDestination[bookid].Y;\n this.goToBookmark(pageIndex, Y);\n };\n /**\n * Get Bookmarks of the PDF document being loaded in the ejPdfViewer control\n * @returns any\n */\n // tslint:disable-next-line\n BookmarkView.prototype.getBookmarks = function () {\n if (this.bookmarks && this.bookmarksDestination) {\n // tslint:disable-next-line:max-line-length\n return { bookmarks: this.bookmarks, bookmarksDestination: this.bookmarksDestination };\n }\n };\n /**\n * Navigate To current Bookmark location of the PDF document being loaded in the ejPdfViewer control.\n * @param {number} pageIndex - Specifies the pageIndex for Navigate\n * @param {number} y - Specifies the Y coordinates value of the Page\n * @returns void\n */\n BookmarkView.prototype.goToBookmark = function (pageIndex, y) {\n var proxy = this;\n var destPage = (this.pdfViewerBase.pageSize[pageIndex - 1].height);\n // tslint:disable-next-line:max-line-length\n var scrollValue = this.pdfViewerBase.pageSize[pageIndex].top * this.pdfViewerBase.getZoomFactor() + ((destPage - y) * this.pdfViewerBase.getZoomFactor());\n var scroll = scrollValue.toString();\n // tslint:disable-next-line:radix\n proxy.pdfViewerBase.viewerContainer.scrollTop = parseInt(scroll);\n if (Browser.isDevice) {\n this.pdfViewerBase.mobileScrollerContainer.style.display = '';\n this.pdfViewerBase.updateMobileScrollerPosition();\n }\n proxy.pdfViewerBase.focusViewerContainer();\n return false;\n };\n /**\n * @private\n */\n BookmarkView.prototype.clear = function () {\n if (this.pdfViewerBase.navigationPane) {\n this.pdfViewerBase.navigationPane.disableBookmarkButton();\n this.pdfViewerBase.navigationPane.updateViewerContainerOnClose();\n }\n if (this.bookmarks) {\n this.bookmarks.bookMark = [];\n this.bookmarks = null;\n }\n if (this.bookmarksDestination) {\n this.bookmarksDestination.bookMarkDestination = [];\n }\n if (this.bookmarkView != null) {\n if (this.bookmarkView.parentElement !== null) {\n this.bookmarkView.parentElement.removeChild(this.bookmarkView);\n }\n while (this.bookmarkView.hasChildNodes()) {\n this.bookmarkView.removeChild(this.bookmarkView.lastChild);\n }\n }\n };\n /**\n * @private\n */\n BookmarkView.prototype.destroy = function () {\n this.clear();\n };\n /**\n * @private\n */\n BookmarkView.prototype.getModuleName = function () {\n return 'BookmarkView';\n };\n return BookmarkView;\n}());\nexport { BookmarkView };\n","import { createElement, Browser } from '@syncfusion/ej2-base';\n/**\n * The `TextSelection` module is used to handle the text selection of PDF viewer.\n * @hidden\n */\nvar TextSelection = /** @class */ (function () {\n /**\n * @private\n */\n function TextSelection(pdfViewer, pdfViewerBase) {\n var _this = this;\n /**\n * @private\n */\n this.isTextSelection = false;\n /**\n * @private\n */\n this.selectionStartPage = null;\n this.isBackwardPropagatedSelection = false;\n this.contextMenuHeight = 144;\n /**\n * @private\n */\n this.selectionRangeArray = [];\n this.selectionAnchorTouch = null;\n this.selectionFocusTouch = null;\n // tslint:disable-next-line\n this.scrollMoveTimer = 0;\n this.isMouseLeaveSelection = false;\n this.isTouchSelection = false;\n this.previousScrollDifference = 0;\n this.topStoreLeft = null;\n this.topStoreRight = null;\n this.onLeftTouchSelectElementTouchStart = function (event) {\n _this.initiateSelectionByTouch();\n };\n this.onRightTouchSelectElementTouchStart = function (event) {\n _this.initiateSelectionByTouch();\n };\n this.onLeftTouchSelectElementTouchEnd = function (event) {\n _this.terminateSelectionByTouch(event);\n };\n this.onRightTouchSelectElementTouchEnd = function (event) {\n _this.terminateSelectionByTouch(event);\n };\n this.onLeftTouchSelectElementTouchMove = function (event) {\n var range;\n var nodeElement;\n event.preventDefault();\n event.target.style.zIndex = '0';\n var rightElement = _this.dropDivElementRight;\n var isTouchedWithinViewerContainer = _this.isTouchedWithinContainer(event);\n if (rightElement && isTouchedWithinViewerContainer) {\n var dropBounds = rightElement.getBoundingClientRect();\n var xTouch = event.changedTouches[0].clientX;\n var yTouch = event.changedTouches[0].clientY;\n event.target.style.zIndex = '1000';\n nodeElement = _this.getNodeElement(range, xTouch, yTouch, event, nodeElement);\n if (nodeElement) {\n // tslint:disable-next-line:max-line-length\n var currentDifference = Math.sqrt((yTouch - dropBounds.top) * (yTouch - dropBounds.top) + (xTouch - dropBounds.left) * (xTouch - dropBounds.left));\n var isCloserMovement = _this.isCloserTouchScroll(currentDifference);\n var isTextSelected = false;\n if (yTouch <= dropBounds.top) {\n _this.dropElementLeft.style.transform = 'rotate(0deg)';\n _this.dropElementRight.style.transform = 'rotate(-90deg)';\n isTextSelected = _this.selectTextByTouch(nodeElement.parentElement, xTouch, yTouch, false, 'left', isCloserMovement);\n }\n else {\n _this.dropElementLeft.style.transform = 'rotate(-90deg)';\n _this.dropElementRight.style.transform = 'rotate(0deg)';\n isTextSelected = _this.selectTextByTouch(nodeElement.parentElement, xTouch, yTouch, true, 'left', isCloserMovement);\n }\n if (isTextSelected) {\n var elementClientRect = _this.dropDivElementLeft.getBoundingClientRect();\n var pageTopValue = _this.pdfViewerBase.pageSize[_this.pdfViewerBase.currentPageNumber - 1].top;\n var topClientValue = _this.getClientValueTop(yTouch, _this.pdfViewerBase.currentPageNumber - 1);\n // tslint:disable-next-line:max-line-length\n var currentPageLeft = _this.pdfViewerBase.getElement('_pageDiv_' + (_this.pdfViewerBase.currentPageNumber - 1)).getBoundingClientRect().left;\n var currentRangeLeft = xTouch - currentPageLeft;\n // tslint:disable-next-line:max-line-length\n _this.dropDivElementLeft.style.top = pageTopValue * _this.pdfViewerBase.getZoomFactor() + topClientValue + 'px';\n _this.topStoreLeft = { pageTop: pageTopValue, topClientValue: _this.getMagnifiedValue(topClientValue), pageNumber: _this.pdfViewerBase.currentPageNumber - 1, left: _this.getMagnifiedValue(currentRangeLeft), isHeightNeeded: false };\n // tslint:disable-next-line:max-line-length\n _this.dropDivElementLeft.style.left = xTouch - _this.pdfViewerBase.viewerContainer.getBoundingClientRect().left - (elementClientRect.width / 2) + 'px';\n _this.previousScrollDifference = currentDifference;\n }\n }\n }\n };\n // tslint:disable-next-line\n this.onRightTouchSelectElementTouchMove = function (event) {\n var range;\n var nodeElement;\n event.preventDefault();\n event.target.style.zIndex = '0';\n var leftElement = _this.dropDivElementLeft;\n var isTouchedWithinViewerContainer = _this.isTouchedWithinContainer(event);\n if (leftElement && isTouchedWithinViewerContainer) {\n var dropPosition = leftElement.getBoundingClientRect();\n var touchX = event.changedTouches[0].clientX;\n var touchY = event.changedTouches[0].clientY;\n event.target.style.zIndex = '1000';\n nodeElement = _this.getNodeElement(range, touchX, touchY, event, nodeElement);\n if (nodeElement) {\n // tslint:disable-next-line:max-line-length\n var currentDifference = Math.sqrt((touchY - dropPosition.top) * (touchY - dropPosition.top) + (touchX - dropPosition.left) * (touchX - dropPosition.left));\n var isCloserMovement = _this.isCloserTouchScroll(currentDifference);\n var isTextSelected = false;\n if (touchY >= dropPosition.top) {\n _this.dropElementRight.style.transform = 'rotate(-90deg)';\n _this.dropElementLeft.style.transform = 'rotate(0deg)';\n isTextSelected = _this.selectTextByTouch(nodeElement.parentElement, touchX, touchY, true, 'right', isCloserMovement);\n }\n else {\n _this.dropElementRight.style.transform = 'rotate(0deg)';\n _this.dropElementLeft.style.transform = 'rotate(-90deg)';\n isTextSelected = _this.selectTextByTouch(nodeElement.parentElement, touchX, touchY, false, 'right', isCloserMovement);\n }\n if (isTextSelected) {\n var pageTopValue = _this.pdfViewerBase.pageSize[_this.pdfViewerBase.currentPageNumber - 1].top;\n var topClientValue = _this.getClientValueTop(touchY, _this.pdfViewerBase.currentPageNumber - 1);\n var elementClientRect = _this.dropDivElementRight.getBoundingClientRect();\n _this.dropDivElementRight.style.top = pageTopValue * _this.pdfViewerBase.getZoomFactor() + topClientValue + 'px';\n // tslint:disable-next-line:max-line-length\n var currentPageLeft = _this.pdfViewerBase.getElement('_pageDiv_' + (_this.pdfViewerBase.currentPageNumber - 1)).getBoundingClientRect().left;\n var currentRangeLeft = touchX - currentPageLeft;\n // tslint:disable-next-line:max-line-length\n _this.topStoreRight = { pageTop: pageTopValue, topClientValue: _this.getMagnifiedValue(topClientValue), pageNumber: _this.pdfViewerBase.currentPageNumber - 1, left: _this.getMagnifiedValue(currentRangeLeft), isHeightNeeded: false };\n // tslint:disable-next-line:max-line-length\n _this.dropDivElementRight.style.left = touchX - _this.pdfViewerBase.viewerContainer.getBoundingClientRect().left - (elementClientRect.width / 2) + 'px';\n _this.previousScrollDifference = currentDifference;\n }\n }\n }\n };\n this.pdfViewer = pdfViewer;\n this.pdfViewerBase = pdfViewerBase;\n }\n /**\n * @private\n */\n TextSelection.prototype.textSelectionOnMouseMove = function (target, x, y) {\n var targetElement = target;\n if (targetElement.nodeType === targetElement.TEXT_NODE) {\n this.isBackwardPropagatedSelection = false;\n var range = targetElement.ownerDocument.createRange();\n var selection = window.getSelection();\n if (selection.anchorNode !== null) {\n var position = selection.anchorNode.compareDocumentPosition(selection.focusNode);\n if (!position && selection.anchorOffset > selection.focusOffset || position === Node.DOCUMENT_POSITION_PRECEDING) {\n this.isBackwardPropagatedSelection = true;\n }\n }\n range.selectNodeContents(targetElement);\n var currentPosition = 0;\n var endPosition = range.endOffset;\n while (currentPosition < endPosition) {\n range.setStart(targetElement, currentPosition);\n range.setEnd(targetElement, currentPosition + 1);\n var rangeBounds = range.getBoundingClientRect();\n if (rangeBounds.left <= x && rangeBounds.right >= x && rangeBounds.top <= y && rangeBounds.bottom >= y) {\n if (selection.anchorNode !== null && selection.anchorNode.parentNode.classList.contains('e-pv-text')) {\n range.setStart(selection.anchorNode, selection.anchorOffset);\n }\n selection.removeAllRanges();\n selection.addRange(range);\n if (!this.isTextSelection) {\n this.selectionStartPage = this.pdfViewerBase.currentPageNumber - 1;\n }\n this.isTextSelection = true;\n if (this.isBackwardPropagatedSelection) {\n selection.extend(targetElement, currentPosition);\n }\n else {\n selection.extend(targetElement, currentPosition + 1);\n }\n range.detach();\n }\n currentPosition += 1;\n }\n }\n else {\n for (var i = 0; i < targetElement.childNodes.length; i++) {\n if (targetElement.childNodes[i].nodeType === targetElement.TEXT_NODE) {\n var range = this.getSelectionRange(i, targetElement);\n var rangeBounds = range.getBoundingClientRect();\n if (rangeBounds.left <= x && rangeBounds.right >= x && rangeBounds.top <= y && rangeBounds.bottom >= y) {\n range.detach();\n this.textSelectionOnMouseMove(targetElement.childNodes[i], x, y);\n }\n else {\n range.detach();\n }\n }\n }\n }\n };\n /**\n * @private\n */\n TextSelection.prototype.textSelectionOnMouseLeave = function (event) {\n var _this = this;\n event.preventDefault();\n var viewerTop = this.pdfViewerBase.viewerContainer.offsetTop;\n if (this.pdfViewer.magnificationModule) {\n if (this.pdfViewer.magnificationModule.fitType === 'fitToPage') {\n return;\n }\n }\n if (event.clientY > viewerTop) {\n this.scrollMoveTimer = setInterval(function () { _this.scrollForwardOnSelection(); }, 500);\n }\n else {\n this.scrollMoveTimer = setInterval(function () { _this.scrollBackwardOnSelection(); }, 500);\n }\n };\n TextSelection.prototype.scrollForwardOnSelection = function () {\n this.isMouseLeaveSelection = true;\n this.pdfViewerBase.viewerContainer.scrollTop = this.pdfViewerBase.viewerContainer.scrollTop + 200;\n this.stichSelectionOnScroll(this.pdfViewerBase.currentPageNumber - 1);\n };\n TextSelection.prototype.scrollBackwardOnSelection = function () {\n this.isMouseLeaveSelection = true;\n this.pdfViewerBase.viewerContainer.scrollTop = this.pdfViewerBase.viewerContainer.scrollTop - 200;\n this.stichSelectionOnScroll(this.pdfViewerBase.currentPageNumber - 1);\n };\n /**\n * @private\n */\n TextSelection.prototype.clear = function () {\n if (this.scrollMoveTimer) {\n this.isMouseLeaveSelection = false;\n clearInterval(this.scrollMoveTimer);\n }\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n TextSelection.prototype.selectAWord = function (element, x, y, isStoreSelection) {\n if (element.nodeType === element.TEXT_NODE) {\n var selection = window.getSelection();\n var range = element.ownerDocument.createRange();\n range.selectNodeContents(element);\n var currentPosition = 0;\n var endPosition = range.endOffset;\n while (currentPosition < endPosition) {\n range.setStart(element, currentPosition);\n range.setEnd(element, currentPosition + 1);\n var rangeBounds = range.getBoundingClientRect();\n if (rangeBounds.left <= x && rangeBounds.right >= x && rangeBounds.top <= y && rangeBounds.bottom >= y) {\n var textContent = element.textContent;\n var indices = [];\n var startPosition = void 0;\n var endPos = void 0;\n for (var i = 0; i < textContent.length; i++) {\n if (textContent[i] === ' ') {\n indices.push(i);\n }\n }\n for (var j = 0; j < indices.length; j++) {\n if (currentPosition === indices[j]) {\n startPosition = indices[j];\n endPos = indices[j];\n }\n if (indices[0] > currentPosition) {\n startPosition = 0;\n endPos = indices[j];\n break;\n }\n if (currentPosition > indices[j] && currentPosition < indices[j + 1]) {\n startPosition = indices[j];\n endPos = indices[j + 1];\n }\n else if (currentPosition > indices[j]) {\n if (!indices[j + 1]) {\n startPosition = indices[j];\n }\n }\n }\n if (!endPos) {\n endPos = textContent.length;\n }\n if (startPosition === 0) {\n range.setStart(element, startPosition);\n }\n else {\n range.setStart(element, startPosition + 1);\n }\n range.setEnd(element, endPos);\n selection.removeAllRanges();\n selection.addRange(range);\n this.isTextSelection = true;\n // tslint:disable-next-line:radix\n this.selectionStartPage = parseInt(range.startContainer.parentElement.id.split('_text_')[1]);\n if (isStoreSelection) {\n // tslint:disable-next-line:max-line-length\n this.selectionAnchorTouch = { anchorNode: selection.anchorNode.parentElement.id, anchorOffset: selection.anchorOffset };\n this.selectionFocusTouch = { focusNode: selection.focusNode.parentElement.id, focusOffset: selection.focusOffset };\n }\n range.detach();\n break;\n }\n currentPosition += 1;\n }\n }\n else {\n for (var i = 0; i < element.childNodes.length; i++) {\n var range = this.getSelectionRange(i, element);\n var rangeBounds = range.getBoundingClientRect();\n if (rangeBounds.left <= x && rangeBounds.right >= x && rangeBounds.top <= y && rangeBounds.bottom >= y) {\n range.detach();\n this.selectAWord(element.childNodes[i], x, y, isStoreSelection);\n }\n else {\n range.detach();\n }\n }\n }\n };\n TextSelection.prototype.getSelectionRange = function (index, element) {\n var range = element.childNodes[index].ownerDocument.createRange();\n range.selectNodeContents(element.childNodes[index]);\n return range;\n };\n /**\n * @private\n */\n TextSelection.prototype.selectEntireLine = function (event) {\n var textIds = [];\n var targetElement = event.target;\n var targetRect = targetElement.getBoundingClientRect();\n // tslint:disable-next-line\n var targetcentre = parseInt((targetRect.top + (targetRect.height / 2)).toString());\n // tslint:disable-next-line:radix\n var pageNumber = parseInt(event.target.id.split('_text_')[1]);\n var textDivs = document.querySelectorAll('div[id*=\"_text_' + pageNumber + '\"]');\n if (targetElement.classList.contains('e-pv-text')) {\n for (var i = 0; i < textDivs.length; i++) {\n var rect = textDivs[i].getBoundingClientRect();\n // tslint:disable-next-line:radix\n var topValue = parseInt(rect.top.toString());\n // tslint:disable-next-line:radix\n var bottomValue = parseInt(rect.bottom.toString());\n if ((topValue <= targetcentre && bottomValue > targetcentre) && (targetRect.bottom + 10 > bottomValue)) {\n var textId = textDivs[i].id;\n if (textId !== '') {\n textIds.push(textId);\n }\n }\n }\n var selection = window.getSelection();\n selection.removeAllRanges();\n var range = document.createRange();\n var lengths = (textIds.length - 1);\n var d1 = document.getElementById(textIds[0]);\n var d2 = document.getElementById(textIds[lengths]);\n var childNodes = d2.childNodes.length;\n if (childNodes > 0) {\n range.setStart(d1.childNodes[0], 0);\n range.setEnd(d2.childNodes[0], d2.textContent.length);\n }\n else {\n range.setStart(d1.childNodes[0], 0);\n range.setEnd(d2, 1);\n }\n // tslint:disable-next-line:radix\n this.selectionStartPage = parseInt(range.startContainer.parentElement.id.split('_text_')[1]);\n selection.addRange(range);\n this.isTextSelection = true;\n }\n };\n /**\n * @private\n */\n TextSelection.prototype.enableTextSelectionMode = function () {\n this.pdfViewerBase.isTextSelectionDisabled = false;\n this.pdfViewerBase.viewerContainer.classList.remove('e-disable-text-selection');\n this.pdfViewerBase.viewerContainer.classList.add('e-enable-text-selection');\n this.pdfViewerBase.viewerContainer.addEventListener('selectstart', function () { return true; });\n };\n /**\n * @private\n */\n TextSelection.prototype.clearTextSelection = function () {\n if (this.isTextSelection) {\n this.pdfViewerBase.textLayer.clearDivSelection();\n if (window.getSelection) {\n if (window.getSelection().removeAllRanges) {\n window.getSelection().removeAllRanges();\n }\n }\n if (this.pdfViewer.linkAnnotationModule) {\n var lowerPageIndex = this.pdfViewerBase.currentPageNumber - 3;\n lowerPageIndex = (lowerPageIndex < 0) ? 0 : lowerPageIndex;\n var higherPageIndex = this.pdfViewer.currentPageNumber + 1;\n // tslint:disable-next-line:max-line-length\n higherPageIndex = (higherPageIndex < (this.pdfViewerBase.pageCount - 1)) ? higherPageIndex : (this.pdfViewerBase.pageCount - 1);\n for (var i = lowerPageIndex; i <= higherPageIndex; i++) {\n this.pdfViewer.linkAnnotationModule.modifyZindexForTextSelection(i, false);\n }\n }\n this.selectionRangeArray = [];\n this.isTextSelection = false;\n this.isTouchSelection = false;\n if (this.pdfViewer.textSearchModule) {\n this.pdfViewer.textSearchModule.searchAfterSelection();\n }\n this.pdfViewerBase.contextMenuModule.contextMenuObj.close();\n this.removeTouchElements();\n }\n };\n /**\n * @private\n */\n TextSelection.prototype.removeTouchElements = function () {\n if (this.dropDivElementLeft) {\n this.dropDivElementLeft.parentElement.removeChild(this.dropDivElementLeft);\n this.dropDivElementLeft = null;\n this.dropElementLeft.style.transform = 'rotate(0deg)';\n }\n if (this.dropDivElementRight) {\n this.dropDivElementRight.parentElement.removeChild(this.dropDivElementRight);\n this.dropDivElementRight = null;\n this.dropElementRight.style.transform = 'rotate(-90deg)';\n }\n };\n /**\n * @private\n */\n TextSelection.prototype.resizeTouchElements = function () {\n var viewerContainerLeft = this.pdfViewerBase.viewerContainer.getBoundingClientRect().left;\n if (this.dropDivElementLeft) {\n var elementClientRect = this.dropDivElementLeft.getBoundingClientRect();\n var dropElementHeight = 0;\n // tslint:disable-next-line:max-line-length\n var leftCurrentPagePosition = this.pdfViewerBase.getElement('_pageDiv_' + this.topStoreLeft.pageNumber).getBoundingClientRect();\n this.dropDivElementLeft.style.left = parseFloat(this.topStoreLeft.left.toString()) * this.pdfViewerBase.getZoomFactor() + leftCurrentPagePosition.left - viewerContainerLeft - (elementClientRect.width / 2) + 'px';\n if (this.topStoreLeft.isHeightNeeded) {\n dropElementHeight = (elementClientRect.height / 2) * this.pdfViewerBase.getZoomFactor();\n }\n // tslint:disable-next-line:max-line-length\n this.dropDivElementLeft.style.top = parseFloat(this.topStoreLeft.pageTop.toString()) * this.pdfViewerBase.getZoomFactor() + parseFloat(this.topStoreLeft.topClientValue.toString()) * this.pdfViewerBase.getZoomFactor() + dropElementHeight + 'px';\n }\n if (this.dropDivElementRight) {\n var elementClientRect = this.dropDivElementRight.getBoundingClientRect();\n var dropElementHeight = 0;\n // tslint:disable-next-line:max-line-length\n var rightCurrentPagePosition = this.pdfViewerBase.getElement('_pageDiv_' + this.topStoreRight.pageNumber).getBoundingClientRect();\n this.dropDivElementRight.style.left = parseFloat(this.topStoreRight.left.toString()) * this.pdfViewerBase.getZoomFactor() + rightCurrentPagePosition.left - viewerContainerLeft - (elementClientRect.width / 2) + 'px';\n if (this.topStoreRight.isHeightNeeded) {\n dropElementHeight = (elementClientRect.height / 2) * this.pdfViewerBase.getZoomFactor();\n }\n // tslint:disable-next-line:max-line-length\n this.dropDivElementRight.style.top = parseFloat(this.topStoreRight.pageTop.toString()) * this.pdfViewerBase.getZoomFactor() + parseFloat(this.topStoreRight.topClientValue.toString()) * this.pdfViewerBase.getZoomFactor() + dropElementHeight + 'px';\n }\n };\n /**\n * @private\n */\n TextSelection.prototype.textSelectionOnMouseup = function () {\n this.clear();\n if (window.getSelection().anchorNode !== null) {\n this.isMouseLeaveSelection = false;\n this.maintainSelectionOnZoom(true, false);\n var isTextSearch = this.pdfViewerBase.textLayer.getTextSearchStatus();\n if (isTextSearch) {\n this.pdfViewerBase.textLayer.clearDivSelection();\n // tslint:disable-next-line\n var indexes = this.pdfViewer.textSearchModule.getIndexes();\n var lowerPageValue = parseFloat(indexes.lowerPageValue.toString());\n var higherPageValue = parseFloat(indexes.higherPageValue.toString());\n for (var i = lowerPageValue; i < higherPageValue; i++) {\n this.applySelectionRangeOnScroll(i);\n }\n this.pdfViewer.textSearchModule.searchAfterSelection();\n }\n else {\n this.applySpanForSelection();\n }\n if (this.pdfViewer.linkAnnotationModule) {\n this.pdfViewer.linkAnnotationModule.modifyZindexForTextSelection(this.pdfViewerBase.currentPageNumber - 1, false);\n }\n }\n else {\n this.pdfViewerBase.textLayer.clearDivSelection();\n if (this.pdfViewer.textSearchModule) {\n this.pdfViewer.textSearchModule.searchAfterSelection();\n }\n this.removeTouchElements();\n }\n };\n /**\n * @private\n */\n TextSelection.prototype.maintainSelectionOnZoom = function (isMaintainSelection, isStich) {\n var selection = window.getSelection();\n if (selection.type === 'Range' || (!selection.type && !selection.isCollapsed)) {\n var isBackward = this.pdfViewerBase.textLayer.isBackWardSelection(selection);\n if (selection.anchorNode !== null) {\n // tslint:disable-next-line:radix\n var anchorPageId = parseInt(this.getNodeElementFromNode(selection.anchorNode).id.split('_text_')[1]);\n // tslint:disable-next-line:radix\n var focusPageId = parseInt(this.getNodeElementFromNode(selection.focusNode).id.split('_text_')[1]);\n if (this.isTouchSelection && isNaN(focusPageId)) {\n var focusElement = selection.focusNode;\n if (focusElement === this.pdfViewerBase.pageContainer) {\n var lastChildNode = this.pdfViewerBase.pageContainer.lastChild;\n if (lastChildNode.classList.contains('e-pv-touch-select-drop')) {\n // tslint:disable-next-line:radix\n focusPageId = parseInt(lastChildNode.previousSibling.previousSibling.id.split('_pageDiv_')[1]);\n }\n else if (lastChildNode.classList.contains('e-pv-page-div')) {\n // tslint:disable-next-line:radix\n focusPageId = parseInt(lastChildNode.id.split('_pageDiv_')[1]);\n }\n }\n }\n if (!isBackward) {\n for (var i = anchorPageId; i <= focusPageId; i++) {\n this.maintainSelectionOnScroll(i, isStich);\n }\n }\n else {\n for (var i = anchorPageId; i >= focusPageId; i--) {\n this.maintainSelectionOnScroll(i, isStich);\n }\n }\n }\n if (!isMaintainSelection) {\n selection.removeAllRanges();\n }\n }\n };\n /**\n * @private\n */\n TextSelection.prototype.isSelectionAvailableOnScroll = function (pageNumber) {\n var isSelectionAvailable = false;\n var ranges = this.selectionRangeArray;\n for (var i = 0; i < ranges.length; i++) {\n if (ranges[i] !== null) {\n if (pageNumber === ranges[i].pageNumber) {\n isSelectionAvailable = true;\n if (this.isTouchSelection && !this.pdfViewerBase.getMagnified()) {\n isSelectionAvailable = false;\n }\n break;\n }\n }\n }\n return isSelectionAvailable;\n };\n /**\n * @private\n */\n TextSelection.prototype.applySelectionRangeOnScroll = function (pageNumber) {\n if (this.isMouseLeaveSelection) {\n this.applySelectionMouseScroll(pageNumber);\n }\n else {\n this.applySelectionRange(pageNumber);\n }\n };\n // tslint:disable-next-line\n TextSelection.prototype.getSelectionRangeFromArray = function (pageNumber) {\n var isSelectionAvailable = false;\n var selectionRange = null;\n var ranges = this.selectionRangeArray;\n for (var i = 0; i < ranges.length; i++) {\n if (ranges[i] !== null) {\n if (pageNumber === ranges[i].pageNumber) {\n selectionRange = ranges[i];\n isSelectionAvailable = true;\n break;\n }\n }\n }\n return { isSelectionAvailable: isSelectionAvailable, selectionRange: selectionRange };\n };\n TextSelection.prototype.applySelectionRange = function (pageNumber) {\n var selectionObject = this.getSelectionRangeFromArray(pageNumber);\n var isSelectionAvailable = selectionObject.isSelectionAvailable;\n var textLayer = document.getElementById(this.pdfViewer.element.id + '_textLayer_' + pageNumber);\n if (textLayer) {\n if (isSelectionAvailable && textLayer.childNodes.length !== 0) {\n var selectionRange = selectionObject.selectionRange;\n var anchorOffsetDiv = void 0;\n var focusOffsetDiv = void 0;\n var anchorOffset = void 0;\n var focusOffset = void 0;\n if (selectionRange.isBackward) {\n // tslint:disable-next-line:radix\n var startId = parseInt(selectionRange.endNode.split('_text_')[1].split('_')[1]);\n // tslint:disable-next-line:radix\n var endId = parseInt(selectionRange.startNode.split('_text_')[1].split('_')[1]);\n if (startId < endId) {\n anchorOffsetDiv = startId;\n anchorOffset = selectionRange.endOffset;\n focusOffset = selectionRange.startOffset;\n focusOffsetDiv = endId;\n }\n else {\n anchorOffsetDiv = endId;\n anchorOffset = selectionRange.startOffset;\n focusOffsetDiv = startId;\n focusOffset = selectionRange.endOffset;\n }\n }\n else {\n // tslint:disable-next-line:radix\n anchorOffsetDiv = parseInt(selectionRange.startNode.split('text_')[1].split('_')[1]);\n // tslint:disable-next-line:radix\n focusOffsetDiv = parseInt(selectionRange.endNode.split('text_')[1].split('_')[1]);\n anchorOffset = selectionRange.startOffset;\n focusOffset = selectionRange.endOffset;\n }\n window.getSelection().removeAllRanges();\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.textLayer.applySpanForSelection(pageNumber, pageNumber, anchorOffsetDiv, focusOffsetDiv, anchorOffset, focusOffset);\n if (this.pdfViewer.textSearchModule) {\n this.pdfViewer.textSearchModule.searchAfterSelection();\n }\n }\n }\n };\n TextSelection.prototype.applySelectionMouseScroll = function (pageNumber) {\n var selectionObject = this.getSelectionRangeFromArray(pageNumber);\n var isSelectionAvailable = selectionObject.isSelectionAvailable;\n if (isSelectionAvailable) {\n var selectionRange = selectionObject.selectionRange;\n var selection = window.getSelection();\n var anchorNode = document.getElementById(selectionRange.startNode).childNodes[0];\n var focusNode = document.getElementById(selectionRange.endNode).childNodes[0];\n var range = document.createRange();\n if (selection.anchorNode === null) {\n if (!selectionRange.isBackward) {\n range.setStart(anchorNode, selectionRange.startOffset);\n range.setEnd(focusNode, selectionRange.endOffset);\n }\n else {\n range.setStart(focusNode, selectionRange.endOffset);\n range.setEnd(anchorNode, selectionRange.startOffset);\n }\n }\n else {\n // tslint:disable-next-line\n var anchorPageIndex = isNaN(parseInt(selection.anchorNode.parentElement.id.split('_text_')[1])) ? parseInt(selection.anchorNode.id.split('_pageDiv_')[1]) : parseInt(selection.anchorNode.parentElement.id.split('_text_')[1]);\n if (isNaN(anchorPageIndex)) {\n // tslint:disable-next-line:radix\n anchorPageIndex = parseInt(selection.anchorNode.id.split('_text_')[1]);\n }\n // tslint:disable-next-line\n var focusPageIndex = isNaN(parseInt(selection.focusNode.parentElement.id.split('_text_')[1])) ? parseInt(selection.focusNode.id.split('_pageDiv_')[1]) : parseInt(selection.focusNode.parentElement.id.split('_text_')[1]);\n // tslint:disable-next-line:radix\n var currentAnchorIndex = parseInt(selectionRange.startNode.split('_text_')[1]);\n if ((anchorPageIndex === focusPageIndex) && (anchorPageIndex === currentAnchorIndex)) {\n if (!selectionRange.isBackward) {\n range.setStart(anchorNode, selectionRange.startOffset);\n range.setEnd(focusNode, selectionRange.endOffset);\n }\n else {\n range.setStart(focusNode, selectionRange.endOffset);\n range.setEnd(anchorNode, selectionRange.startOffset);\n }\n }\n else {\n if (!selectionRange.isBackward) {\n // tslint:disable-next-line:max-line-length\n if (anchorPageIndex < currentAnchorIndex && currentAnchorIndex < focusPageIndex && anchorPageIndex !== focusPageIndex) {\n range.setStart(selection.anchorNode, selection.anchorOffset);\n range.setEnd(selection.focusNode, selection.focusOffset);\n }\n else if (anchorPageIndex < currentAnchorIndex) {\n range.setStart(selection.anchorNode, selection.anchorOffset);\n range.setEnd(focusNode, selectionRange.endOffset);\n }\n else {\n range.setStart(anchorNode, selectionRange.startOffset);\n range.setEnd(selection.focusNode, selection.focusOffset);\n }\n }\n else {\n var isBackward = this.pdfViewerBase.textLayer.isBackWardSelection(selection);\n // tslint:disable-next-line:max-line-length\n if (anchorPageIndex > currentAnchorIndex && currentAnchorIndex > focusPageIndex && anchorPageIndex !== focusPageIndex) {\n if (!isBackward) {\n range.setStart(selection.anchorNode, selection.anchorOffset);\n range.setEnd(selection.focusNode, selection.focusOffset);\n }\n else {\n selection.extend(selection.focusNode, selection.focusOffset);\n }\n // tslint:disable-next-line:max-line-length\n }\n else if (anchorPageIndex < currentAnchorIndex && currentAnchorIndex < focusPageIndex && anchorPageIndex !== focusPageIndex) {\n if (!isBackward) {\n range.setStart(selection.anchorNode, selection.anchorOffset);\n range.setEnd(selection.focusNode, selection.focusOffset);\n }\n else {\n selection.extend(selection.focusNode, selection.focusOffset);\n }\n }\n else if (anchorPageIndex < currentAnchorIndex) {\n if (!isBackward) {\n if (currentAnchorIndex !== this.selectionRangeArray[0].pageNumber) {\n range.setStart(selection.anchorNode, selection.anchorOffset);\n range.setEnd(focusNode, selectionRange.endOffset);\n }\n else {\n range.setStart(selection.anchorNode, selection.anchorOffset);\n range.setEnd(anchorNode, selectionRange.startOffset);\n }\n }\n else {\n if (currentAnchorIndex !== this.selectionRangeArray[0].pageNumber) {\n this.extendCurrentSelection(focusNode.parentElement, selectionRange.endOffset, selection, range);\n }\n else {\n this.extendCurrentSelection(anchorNode.parentElement, selectionRange.startOffset, selection, range);\n }\n }\n }\n else if (anchorPageIndex === currentAnchorIndex) {\n if (currentAnchorIndex === focusPageIndex) {\n range.setStart(anchorNode, selectionRange.startOffset);\n range.setEnd(anchorNode, selectionRange.startOffset);\n selection.removeAllRanges();\n selection.addRange(range);\n range = document.createRange();\n selection.extend(focusNode, selectionRange.endOffset);\n }\n else {\n if (isBackward) {\n this.extendCurrentSelection(focusNode.parentElement, selectionRange.endOffset, selection, range);\n }\n else {\n range.setStart(focusNode, selectionRange.endOffset);\n range.setEnd(selection.focusNode, selection.focusOffset);\n }\n }\n }\n else if (focusPageIndex === currentAnchorIndex) {\n if (isBackward) {\n selection.extend(selection.focusNode, selection.focusOffset);\n }\n else {\n range.setStart(selection.anchorNode, selection.anchorOffset);\n range.setEnd(selection.focusNode, selection.focusOffset);\n }\n }\n else if (anchorPageIndex > currentAnchorIndex) {\n // tslint:disable-next-line:radix\n var currentAnchorOffset = parseInt(selectionRange.startNode.split('_' + currentAnchorIndex + '_')[1]);\n // tslint:disable-next-line:radix\n var currentFocusOffset = parseInt(selectionRange.endNode.split('_' + currentAnchorIndex + '_')[1]);\n if (isBackward) {\n if (currentAnchorIndex !== this.selectionRangeArray[0].pageNumber) {\n if (currentAnchorOffset < currentFocusOffset) {\n this.extendCurrentSelection(anchorNode.parentElement, selectionRange.startOffset, selection, range);\n }\n else {\n range.setStart(focusNode.parentElement, selectionRange.endOffset);\n range.setEnd(selection.anchorNode, selection.anchorOffset);\n }\n }\n else {\n this.extendCurrentSelection(focusNode.parentElement, selectionRange.endOffset, selection, range);\n }\n }\n else {\n if (currentAnchorOffset < currentFocusOffset) {\n range.setStart(anchorNode, selectionRange.startOffset);\n range.setEnd(selection.focusNode, selection.focusOffset);\n }\n else {\n range.setStart(focusNode, selectionRange.endOffset);\n range.setEnd(selection.focusNode, selection.focusOffset);\n }\n }\n }\n }\n }\n }\n if (range.toString() !== '') {\n selection.removeAllRanges();\n selection.addRange(range);\n }\n }\n };\n /**\n * @private\n */\n TextSelection.prototype.maintainSelectionOnScroll = function (pageNumber, isStich) {\n var isSelectionAvailable = this.isSelectionAvailableOnScroll(pageNumber);\n if (this.isTextSelection && !isSelectionAvailable) {\n this.maintainSelection(pageNumber, isStich);\n }\n };\n TextSelection.prototype.maintainSelection = function (pageNumber, isStich) {\n var selection = window.getSelection();\n if (this.isTextSelection && (selection.type === 'Range' || (!selection.type && !selection.isCollapsed))) {\n // tslint:disable-next-line\n var anchorPageId = parseInt(this.getNodeElementFromNode(selection.anchorNode).id.split('_text_')[1]);\n // tslint:disable-next-line\n var focusPageId = parseInt(this.getNodeElementFromNode(selection.focusNode).id.split('_text_')[1]);\n if (isNaN(focusPageId) && selection.anchorNode !== null) {\n var backward_1 = this.pdfViewerBase.textLayer.isBackWardSelection(selection);\n if (!backward_1) {\n // tslint:disable-next-line:radix\n var lastChildNode = this.pdfViewerBase.pageContainer.lastChild;\n if (lastChildNode.classList.contains('e-pv-touch-select-drop')) {\n // tslint:disable-next-line:radix\n focusPageId = parseInt(lastChildNode.previousSibling.previousSibling.id.split('_pageDiv_')[1]);\n }\n else {\n // tslint:disable-next-line:radix\n focusPageId = parseInt(lastChildNode.id.split('_pageDiv_')[1]);\n }\n }\n else {\n // tslint:disable-next-line:radix\n focusPageId = parseInt(this.pdfViewerBase.pageContainer.firstChild.id.split('_pageDiv_')[1]);\n }\n }\n var backward = this.pdfViewerBase.textLayer.isBackWardSelection(selection);\n if (this.isTouchSelection && pageNumber > focusPageId && pageNumber > anchorPageId) {\n return;\n }\n if (anchorPageId === focusPageId) {\n var selectionObject = null;\n var selectionBounds = this.getSelectionBounds(selection.getRangeAt(0), pageNumber);\n var selectionRectBounds = this.getSelectionRectangleBounds(selection.getRangeAt(0), pageNumber);\n // tslint:disable-next-line:max-line-length\n var anchorOffsetValue = (this.getNodeElementFromNode(selection.anchorNode).childNodes.length === 1) ? selection.anchorOffset : this.getCorrectOffset(selection.anchorNode, selection.anchorOffset);\n var focusOffsetValue = (this.getNodeElementFromNode(selection.focusNode).childNodes.length === 1) ? selection.focusOffset : this.getCorrectOffset(selection.focusNode, selection.focusOffset);\n selectionObject = {\n isBackward: backward, startNode: this.getNodeElementFromNode(selection.anchorNode).id,\n startOffset: anchorOffsetValue, endNode: this.getNodeElementFromNode(selection.focusNode).id,\n // tslint:disable-next-line:max-line-length\n endOffset: focusOffsetValue, textContent: selection.toString(), pageNumber: pageNumber, bound: selectionBounds, rectangleBounds: selectionRectBounds\n };\n this.pushSelectionRangeObject(selectionObject, pageNumber);\n }\n else {\n var selectionObject = this.createRangeObjectOnScroll(pageNumber, anchorPageId, focusPageId);\n if (selectionObject) {\n this.pushSelectionRangeObject(selectionObject, pageNumber);\n if (isStich) {\n this.stichSelection(backward, selection, pageNumber);\n }\n }\n }\n }\n };\n TextSelection.prototype.getCorrectOffset = function (node, offset) {\n var offsetValue = 0;\n var parentElement = this.getNodeElementFromNode(node);\n for (var i = 0; i < parentElement.childNodes.length; i++) {\n if (parentElement.childNodes[i] === node) {\n offsetValue = offsetValue + offset;\n break;\n }\n else {\n offsetValue = offsetValue + parentElement.childNodes[i].textContent.length;\n }\n }\n return offsetValue;\n };\n TextSelection.prototype.pushSelectionRangeObject = function (selectionObject, pageNumber) {\n if (this.isTouchSelection) {\n var currentObject = this.selectionRangeArray.filter(\n // tslint:disable-next-line\n function (obj) {\n return (obj.pageNumber === pageNumber);\n });\n if (currentObject.length > 0) {\n var currentObjectIndex = this.selectionRangeArray.indexOf(currentObject[0]);\n this.selectionRangeArray.splice(currentObjectIndex, 1, selectionObject);\n return;\n }\n }\n var nextPageObject = this.selectionRangeArray.filter(\n // tslint:disable-next-line\n function (obj) {\n return (obj.pageNumber === (pageNumber + 1));\n });\n if (nextPageObject.length === 0) {\n if (this.isTouchSelection && this.selectionRangeArray.length !== 0) {\n var prevPageObject = this.selectionRangeArray.filter(\n // tslint:disable-next-line\n function (obj) {\n return (obj.pageNumber === (pageNumber - 1));\n });\n if (prevPageObject.length !== 0) {\n var prevIndex = this.selectionRangeArray.indexOf(prevPageObject[0]);\n this.selectionRangeArray.splice(prevIndex + 1, 0, selectionObject);\n }\n else {\n var firstObject = this.selectionRangeArray[0];\n if (pageNumber < firstObject.pageNumber) {\n this.selectionRangeArray.splice(0, 0, selectionObject);\n }\n else {\n this.selectionRangeArray.push(selectionObject);\n }\n }\n }\n else {\n this.selectionRangeArray.push(selectionObject);\n }\n }\n else {\n var index = this.selectionRangeArray.indexOf(nextPageObject[0]);\n this.selectionRangeArray.splice(index, 0, selectionObject);\n }\n };\n TextSelection.prototype.extendCurrentSelection = function (element, offset, selection, range) {\n var currentFocusOffset = selection.focusOffset;\n var currentFocusElement = selection.focusNode.parentElement.id;\n // tslint:disable-next-line\n var focusPageId = isNaN(parseInt(currentFocusElement.split('_text_')[1])) ? parseInt(selection.focusNode.id.split('_pageDiv_')[1]) : parseInt(currentFocusElement.split('_text_')[1]);\n // tslint:disable-next-line:radix\n if (isNaN(parseInt(currentFocusElement.split('_text_')[1]))) {\n // tslint:disable-next-line\n currentFocusElement = this.pdfViewerBase.getElement('_textLayer_' + (focusPageId + 1)).firstChild.id;\n }\n range.setStart(element.childNodes[0], offset);\n range.setEnd(element.childNodes[0], offset);\n selection.removeAllRanges();\n selection.addRange(range);\n selection.extend(document.getElementById(currentFocusElement).childNodes[0], currentFocusOffset);\n };\n TextSelection.prototype.stichSelection = function (backward, selection, pageNumber) {\n var range = document.createRange();\n var nextPageElement;\n if (backward) {\n nextPageElement = document.getElementById(this.pdfViewer.element.id + '_textLayer_' + (pageNumber - 1));\n if (nextPageElement) {\n var lastElement = nextPageElement.lastChild;\n if (lastElement) {\n this.extendCurrentSelection(lastElement, this.getTextLastLength(lastElement), selection, range);\n }\n else {\n nextPageElement = document.getElementById(this.pdfViewer.element.id + '_textLayer_' + (pageNumber - 2));\n lastElement = nextPageElement.lastChild;\n this.extendCurrentSelection(lastElement, this.getTextLastLength(lastElement), selection, range);\n }\n }\n else {\n nextPageElement = document.getElementById(this.pdfViewer.element.id + '_textLayer_' + (pageNumber + 1));\n var lastElement = nextPageElement.firstChild;\n this.extendCurrentSelection(lastElement, 0, selection, range);\n }\n }\n else {\n nextPageElement = document.getElementById(this.pdfViewer.element.id + '_textLayer_' + (pageNumber + 1));\n if (nextPageElement) {\n var firstElement = nextPageElement.firstChild;\n if (!firstElement) {\n nextPageElement = document.getElementById(this.pdfViewer.element.id + '_textLayer_' + (pageNumber + 2));\n firstElement = nextPageElement.firstChild;\n range.setStart(firstElement.childNodes[0], 0);\n }\n else {\n range.setStart(firstElement.childNodes[0], 0);\n }\n range.setEnd(selection.focusNode, selection.focusOffset);\n selection.removeAllRanges();\n selection.addRange(range);\n }\n }\n };\n /**\n * @private\n */\n TextSelection.prototype.textSelectionOnMouseWheel = function (currentPageNumber) {\n this.isMouseLeaveSelection = true;\n this.stichSelectionOnScroll(currentPageNumber);\n };\n /**\n * @private\n */\n TextSelection.prototype.stichSelectionOnScroll = function (currentPageNumber) {\n var selection = window.getSelection();\n if (this.isTextSelection) {\n // tslint:disable-next-line:radix\n var anchorPageId = parseInt(this.getNodeElementFromNode(selection.anchorNode).id.split('_text_')[1]);\n // tslint:disable-next-line:radix\n var focusPageId = parseInt(this.getNodeElementFromNode(selection.focusNode).id.split('_text_')[1]);\n var nextPageElement = void 0;\n if (anchorPageId !== currentPageNumber && focusPageId !== currentPageNumber) {\n var backward = this.pdfViewerBase.textLayer.isBackWardSelection(selection);\n if (!backward) {\n nextPageElement = document.getElementById(this.pdfViewer.element.id + '_textLayer_' + (currentPageNumber - 1));\n if (nextPageElement) {\n var lastElement = nextPageElement.lastChild;\n if (lastElement) {\n if (lastElement.childNodes[0]) {\n this.extendSelectionStich(lastElement.childNodes[0], this.getTextLastLength(lastElement), selection);\n }\n else {\n this.extendSelectionStich(lastElement, this.getTextLastLength(lastElement), selection);\n }\n }\n else {\n nextPageElement = this.pdfViewerBase.getElement('_textLayer_' + currentPageNumber);\n var lastElement_1 = nextPageElement.firstChild;\n this.extendSelectionStich(lastElement_1.childNodes[0], 0, selection);\n }\n }\n }\n else {\n nextPageElement = document.getElementById(this.pdfViewer.element.id + '_textLayer_' + (currentPageNumber - 1));\n if (nextPageElement) {\n var lastElement = nextPageElement.firstChild;\n if (lastElement) {\n this.extendSelectionStich(lastElement.childNodes[0], 0, selection);\n }\n }\n }\n }\n this.maintainSelectionArray();\n }\n };\n TextSelection.prototype.extendSelectionStich = function (node, offset, selection) {\n if (selection.extend) {\n selection.extend(node, offset);\n }\n };\n /**\n * @private\n */\n TextSelection.prototype.createRangeObjectOnScroll = function (pageNumber, anchorPageId, focusPageId) {\n var selectionObject = null;\n var selection = window.getSelection();\n if (selection.anchorNode !== null) {\n var backward = this.pdfViewerBase.textLayer.isBackWardSelection(selection);\n var firstElement = void 0;\n var lastElement = void 0;\n var startOffset = void 0;\n var endOffset = void 0;\n var element = document.getElementById(this.pdfViewer.element.id + '_textLayer_' + pageNumber);\n if (element.childNodes) {\n if (!backward) {\n if (pageNumber === anchorPageId) {\n firstElement = this.getNodeElementFromNode(selection.anchorNode);\n // tslint:disable-next-line:max-line-length\n lastElement = element.lastChild;\n startOffset = this.getCorrectOffset(selection.anchorNode, selection.anchorOffset);\n endOffset = this.getTextLastLength(lastElement);\n }\n else if (pageNumber > anchorPageId && pageNumber < focusPageId) {\n // tslint:disable-next-line:max-line-length\n firstElement = element.firstChild;\n // tslint:disable-next-line:max-line-length\n lastElement = element.lastChild;\n startOffset = 0;\n endOffset = this.getTextLastLength(lastElement);\n }\n else if (pageNumber === focusPageId) {\n // tslint:disable-next-line:max-line-length\n firstElement = element.firstChild;\n var pageNumberIndex = this.getNodeElementFromNode(selection.focusNode).id.indexOf(focusPageId.toString());\n if (pageNumberIndex !== -1) {\n lastElement = this.getNodeElementFromNode(selection.focusNode);\n endOffset = this.getCorrectOffset(selection.focusNode, selection.focusOffset);\n }\n else {\n // tslint:disable-next-line:max-line-length\n lastElement = document.getElementById(this.pdfViewer.element.id + '_textLayer_' + focusPageId).lastChild;\n endOffset = this.getTextLastLength(lastElement);\n }\n startOffset = 0;\n }\n }\n else {\n if (pageNumber === anchorPageId) {\n firstElement = this.getNodeElementFromNode(selection.anchorNode);\n // tslint:disable-next-line:max-line-length\n lastElement = element.firstChild;\n startOffset = this.getCorrectOffset(selection.anchorNode, selection.anchorOffset);\n endOffset = 0;\n }\n else if (pageNumber < anchorPageId && pageNumber > focusPageId) {\n // tslint:disable-next-line:max-line-length\n firstElement = element.firstChild;\n // tslint:disable-next-line:max-line-length\n lastElement = element.lastChild;\n startOffset = 0;\n endOffset = this.getTextLastLength(lastElement);\n }\n else if (pageNumber === focusPageId) {\n firstElement = this.getNodeElementFromNode(selection.focusNode);\n // tslint:disable-next-line:max-line-length\n lastElement = element.lastChild;\n startOffset = this.getCorrectOffset(selection.focusNode, selection.focusOffset);\n endOffset = this.getTextLastLength(lastElement);\n }\n }\n if (firstElement && lastElement) {\n // tslint:disable-next-line:max-line-length\n var selectionRangeObject = this.getSelectionRangeObject(firstElement.id, startOffset, lastElement.id, endOffset, pageNumber);\n var selectionString = selectionRangeObject.toString();\n var selectionBound = this.getSelectionBounds(selectionRangeObject, pageNumber);\n var selectionRectBounds = this.getSelectionRectangleBounds(selectionRangeObject, pageNumber);\n // tslint:disable-next-line:max-line-length\n return selectionObject = { isBackward: backward, startNode: firstElement.id, startOffset: startOffset, endNode: lastElement.id, endOffset: endOffset, textContent: selectionString, pageNumber: pageNumber, bound: selectionBound, rectangleBounds: selectionRectBounds };\n }\n else {\n return null;\n }\n }\n }\n return null;\n };\n TextSelection.prototype.getSelectionRangeObject = function (startNode, startOffset, endNode, endOffset, pageNumber) {\n var startElement = document.getElementById(startNode);\n var endElement = document.getElementById(endNode);\n if (startElement.childNodes[0]) {\n startElement = startElement.childNodes[0];\n }\n if (endElement.childNodes[0]) {\n endElement = endElement.childNodes[0];\n }\n // tslint:disable-next-line:radix\n var currentAnchorOffset = parseInt(startNode.split('_' + pageNumber + '_')[1]);\n // tslint:disable-next-line:radix\n var currentFocusOffset = parseInt(endNode.split('_' + pageNumber + '_')[1]);\n var range = document.createRange();\n if (currentAnchorOffset < currentFocusOffset) {\n range.setStart(startElement, startOffset);\n range.setEnd(endElement, endOffset);\n }\n else {\n range.setStart(endElement, endOffset);\n range.setEnd(startElement, startOffset);\n }\n return range;\n };\n TextSelection.prototype.getSelectionBounds = function (range, pageNumber) {\n var startElement = this.getNodeElementFromNode(range.startContainer);\n var endElement = this.getNodeElementFromNode(range.endContainer);\n var bounds = null;\n if (startElement !== endElement) {\n var newStartRange = document.createRange();\n // tslint:disable-next-line:max-line-length\n var startRange = this.createRangeForSelection(range.startContainer, range.endContainer, range.startOffset, range.endOffset, newStartRange);\n bounds = this.normalizeBounds(startRange.getBoundingClientRect(), pageNumber);\n }\n else {\n bounds = this.normalizeBounds(range.getBoundingClientRect(), pageNumber);\n }\n return bounds;\n };\n TextSelection.prototype.getSelectionRectangleBounds = function (range, pageNumber) {\n var selectionBounds = [];\n var startElement = this.getNodeElementFromNode(range.startContainer);\n var endElement = this.getNodeElementFromNode(range.endContainer);\n var bounds = null;\n if (startElement !== endElement) {\n var startOffset = 0;\n var endOffset = 0;\n var currentId = 0;\n var anchorPageId = this.pdfViewerBase.textLayer.getPageIndex(range.startContainer);\n var anchorTextId = this.pdfViewerBase.textLayer.getTextIndex(range.startContainer, anchorPageId);\n var focusPageId = this.pdfViewerBase.textLayer.getPageIndex(range.endContainer);\n var focusTextId = this.pdfViewerBase.textLayer.getTextIndex(range.endContainer, focusPageId);\n var textDivs = this.pdfViewerBase.getElement('_textLayer_' + focusPageId).childNodes;\n if (pageNumber === anchorPageId) {\n currentId = anchorTextId;\n }\n else {\n currentId = 0;\n }\n for (var j = currentId; j < textDivs.length; j++) {\n var textElement = textDivs[j];\n if (j === anchorTextId) {\n startOffset = range.startOffset;\n }\n else {\n startOffset = 0;\n }\n if (j === focusTextId) {\n endOffset = range.endOffset;\n }\n else {\n endOffset = textElement.textContent.length;\n }\n var newRange = document.createRange();\n for (var k = 0; k < textElement.childNodes.length; k++) {\n var node = textElement.childNodes[k];\n newRange.setStart(node, startOffset);\n newRange.setEnd(node, endOffset);\n }\n var boundingRect = this.normalizeBounds(newRange.getBoundingClientRect(), pageNumber);\n selectionBounds.push(boundingRect);\n newRange.detach();\n if (j === focusTextId) {\n break;\n }\n }\n }\n else {\n bounds = this.normalizeBounds(range.getBoundingClientRect(), pageNumber);\n selectionBounds.push(bounds);\n }\n return selectionBounds;\n };\n TextSelection.prototype.getTextId = function (elementId) {\n var index = elementId.lastIndexOf('_');\n var divId = elementId.substring(index + 1, elementId.length);\n // tslint:disable-next-line:radix\n return parseInt(divId);\n };\n TextSelection.prototype.normalizeBounds = function (bound, pageNumber) {\n var newBounds = null;\n var currentPageElement = this.pdfViewerBase.getElement('_pageDiv_' + pageNumber);\n var currentPageRect = currentPageElement.getBoundingClientRect();\n newBounds = {\n bottom: this.getMagnifiedValue(bound.bottom - currentPageRect.top), height: this.getMagnifiedValue(bound.height),\n left: this.getMagnifiedValue(bound.left - currentPageRect.left), top: this.getMagnifiedValue(bound.top - currentPageRect.top),\n right: this.getMagnifiedValue(bound.right - currentPageRect.left), width: this.getMagnifiedValue(bound.width)\n };\n return newBounds;\n };\n TextSelection.prototype.getMagnifiedValue = function (value) {\n return value / this.pdfViewerBase.getZoomFactor();\n };\n /**\n * @private\n */\n TextSelection.prototype.getCurrentSelectionBounds = function (pageNumber) {\n var bound = null;\n var ranges = this.selectionRangeArray;\n for (var i = 0; i < ranges.length; i++) {\n if (ranges[i] !== null) {\n if (pageNumber === ranges[i].pageNumber) {\n bound = ranges[i].bound;\n }\n }\n }\n return bound;\n };\n TextSelection.prototype.createRangeForSelection = function (start, end, startOffset, endOffset, range) {\n range.setStart(start, startOffset);\n range.setEnd(end, endOffset);\n return range;\n };\n TextSelection.prototype.maintainSelectionArray = function () {\n var _this = this;\n if (this.selectionRangeArray.length !== 0) {\n var selection = window.getSelection();\n var isBackward = this.pdfViewerBase.textLayer.isBackWardSelection(selection);\n // tslint:disable-next-line\n var anchorPage = isNaN(parseInt(this.getNodeElementFromNode(selection.anchorNode).id.split('_text_')[1])) ? parseInt(selection.anchorNode.id.split('_pageDiv_')[1]) : parseInt(selection.anchorNode.parentElement.id.split('_text_')[1]);\n if (isNaN(anchorPage)) {\n // tslint:disable-next-line:radix\n anchorPage = parseInt(selection.anchorNode.id.split('_text_')[1]);\n }\n // tslint:disable-next-line\n var focusPage_1 = isNaN(parseInt(this.getNodeElementFromNode(selection.focusNode).id.split('_text_')[1])) ? parseInt(selection.focusNode.id.split('_pageDiv_')[1]) : parseInt(selection.focusNode.parentElement.id.split('_text_')[1]);\n if (isNaN(focusPage_1)) {\n // tslint:disable-next-line\n focusPage_1 = isNaN(parseInt(selection.focusNode.id.split('_text_')[1])) ? parseInt(selection.focusNode.id.split('_textLayer_')[1]) : parseInt(selection.focusNode.id.split('_text_')[1]);\n }\n var arrayObject = [];\n if (!isBackward) {\n arrayObject = this.selectionRangeArray.filter(\n // tslint:disable-next-line\n function (obj) {\n return (!((_this.selectionStartPage <= obj.pageNumber) && (obj.pageNumber < focusPage_1)));\n });\n }\n else {\n arrayObject = this.selectionRangeArray.filter(\n // tslint:disable-next-line\n function (obj) {\n return (!((focusPage_1 < obj.pageNumber) && (obj.pageNumber <= _this.selectionStartPage)));\n });\n }\n if (arrayObject.length > 0) {\n for (var i = 0; i < arrayObject.length; i++) {\n var indexInArray = this.selectionRangeArray.indexOf(arrayObject[i]);\n if (indexInArray !== -1) {\n this.selectionRangeArray.splice(indexInArray, 1);\n }\n }\n if (this.selectionRangeArray.length === 1) {\n // tslint:disable-next-line:max-line-length\n if (this.selectionRangeArray[0].pageNumber === anchorPage || this.selectionRangeArray[0].pageNumber === focusPage_1) {\n arrayObject = [];\n }\n }\n }\n }\n };\n /**\n * @private\n */\n TextSelection.prototype.applySpanForSelection = function () {\n var selection = window.getSelection();\n // tslint:disable-next-line:max-line-length\n if (selection.anchorNode !== null && this.pdfViewerBase.viewerContainer.contains(this.getNodeElementFromNode(selection.anchorNode))) {\n var isBackWardSelection = this.pdfViewerBase.textLayer.isBackWardSelection(selection);\n var anchorPageId = void 0;\n var focusPageId = void 0;\n var anchorOffsetDiv = void 0;\n var focusOffsetDiv = void 0;\n var anchorOffset = void 0;\n var focusOffset = void 0;\n if (isBackWardSelection) {\n // tslint:disable-next-line:radix\n anchorPageId = parseInt(this.getNodeElementFromNode(selection.focusNode).id.split('_text_')[1]);\n // tslint:disable-next-line:radix\n focusPageId = parseInt(this.getNodeElementFromNode(selection.anchorNode).id.split('_text_')[1]);\n // tslint:disable-next-line:radix\n anchorOffsetDiv = parseInt(this.getNodeElementFromNode(selection.focusNode).id.split('_text_')[1].split('_')[1]);\n // tslint:disable-next-line:radix\n focusOffsetDiv = parseInt(this.getNodeElementFromNode(selection.anchorNode).id.split('_text_')[1].split('_')[1]);\n anchorOffset = selection.focusOffset;\n focusOffset = selection.anchorOffset;\n }\n else {\n var anchorElement = this.getNodeElementFromNode(selection.anchorNode);\n var focusElement = this.getNodeElementFromNode(selection.focusNode);\n // tslint:disable-next-line\n anchorPageId = (anchorElement.id.indexOf('text_') !== -1) ? parseInt(anchorElement.id.split('text_')[1]) : parseInt(anchorElement.id.split('_textLayer_')[1]);\n // tslint:disable-next-line\n focusPageId = (focusElement.id.indexOf('text_') !== -1) ? parseInt(focusElement.id.split('text_')[1]) : parseInt(focusElement.id.split('_textLayer_')[1]);\n var isFocusChanged = false;\n if (this.isTouchSelection) {\n if (selection.focusNode === this.pdfViewerBase.pageContainer) {\n var lastChildNode = this.pdfViewerBase.pageContainer.lastChild;\n if (lastChildNode.classList.contains('e-pv-touch-select-drop')) {\n var lastPageDiv = lastChildNode.previousSibling.previousSibling;\n // tslint:disable-next-line:radix\n focusPageId = parseInt(lastPageDiv.id.split('_pageDiv_')[1]);\n focusElement = this.pdfViewerBase.getElement('_textLayer_' + focusPageId).lastChild;\n isFocusChanged = true;\n }\n else if (lastChildNode.classList.contains('e-pv-page-div')) {\n var lastPageDiv = lastChildNode;\n // tslint:disable-next-line:radix\n focusPageId = parseInt(lastPageDiv.id.split('_pageDiv_')[1]);\n focusElement = this.pdfViewerBase.getElement('_textLayer_' + focusPageId).lastChild;\n isFocusChanged = true;\n }\n }\n }\n if (anchorElement.classList.contains('e-pv-maintaincontent')) {\n anchorElement = this.getNodeElementFromNode(anchorElement);\n // tslint:disable-next-line:radix\n anchorPageId = parseInt(anchorElement.id.split('text_')[1]);\n }\n if (focusElement.classList.contains('e-pv-maintaincontent')) {\n focusElement = this.getNodeElementFromNode(focusElement);\n // tslint:disable-next-line:radix\n focusPageId = parseInt(focusElement.id.split('text_')[1]);\n }\n if (anchorPageId === focusPageId) {\n if (anchorElement.contains(focusElement)) {\n anchorElement = focusElement;\n }\n if (focusElement.contains(anchorElement)) {\n focusElement = anchorElement;\n }\n }\n // tslint:disable-next-line:radix\n anchorOffsetDiv = (anchorElement.id.split('text_')[1]) ? parseInt(anchorElement.id.split('text_')[1].split('_')[1]) : null;\n // tslint:disable-next-line:radix\n focusOffsetDiv = (focusElement.id.split('text_')[1]) ? parseInt(focusElement.id.split('text_')[1].split('_')[1]) : null;\n anchorOffsetDiv = isNaN(anchorOffsetDiv) ? focusOffsetDiv : anchorOffsetDiv;\n focusOffsetDiv = isNaN(focusOffsetDiv) ? anchorOffsetDiv : focusOffsetDiv;\n anchorOffset = selection.anchorOffset;\n focusOffset = !isFocusChanged ? selection.focusOffset : focusElement.textContent.length;\n }\n selection.removeAllRanges();\n this.pdfViewerBase.textLayer.clearDivSelection();\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.textLayer.applySpanForSelection(anchorPageId, focusPageId, anchorOffsetDiv, focusOffsetDiv, anchorOffset, focusOffset);\n if (this.pdfViewer.textSearchModule) {\n this.pdfViewer.textSearchModule.searchAfterSelection();\n }\n }\n };\n /**\n * @private\n */\n TextSelection.prototype.initiateTouchSelection = function (event, x, y) {\n // tslint:disable-next-line\n var element = event.target;\n var belowElements = document.elementsFromPoint(event.touches[0].clientX, event.touches[0].clientY);\n if (belowElements.length !== 0) {\n if (belowElements[0].classList.contains('e-pv-hyperlink') && belowElements[1].classList.contains('e-pv-text')) {\n element = belowElements[1];\n }\n }\n this.selectAWord(element, x, y, true);\n this.createTouchSelectElement(event);\n this.maintainSelectionOnZoom(true, false);\n this.applySpanForSelection();\n };\n // tslint:disable-next-line\n TextSelection.prototype.selectTextByTouch = function (element, x, y, isForwardSelection, target, isCloserMovement) {\n var isTextSelected = false;\n if (element.nodeType === element.TEXT_NODE) {\n var rangeObject = element.ownerDocument.createRange();\n var selection = window.getSelection();\n rangeObject.selectNodeContents(element);\n var currentPosition = 0;\n var endPosition = rangeObject.endOffset;\n while (currentPosition < endPosition) {\n rangeObject.setStart(element, currentPosition);\n rangeObject.setEnd(element, currentPosition + 1);\n var rangeBounds = rangeObject.getBoundingClientRect();\n if (rangeBounds.left <= x && rangeBounds.right >= x && rangeBounds.top <= y && rangeBounds.bottom >= y) {\n if (selection.anchorNode != null) {\n if (isForwardSelection) {\n rangeObject.setStart(selection.anchorNode, selection.anchorOffset);\n }\n // tslint:disable-next-line:max-line-length\n rangeObject = this.setTouchSelectionStartPosition(selection, rangeObject, isForwardSelection, target, element, currentPosition, isCloserMovement);\n if (isForwardSelection) {\n selection.extend(element, currentPosition);\n }\n isTextSelected = true;\n }\n rangeObject.detach();\n return isTextSelected;\n }\n currentPosition += 1;\n }\n }\n else {\n for (var i = 0; i < element.childNodes.length; i++) {\n var range = element.childNodes[i].ownerDocument.createRange();\n range.selectNodeContents(element.childNodes[i]);\n var rangeBounds = range.getBoundingClientRect();\n if (rangeBounds.left <= x && rangeBounds.right >= x && rangeBounds.top <= y && rangeBounds.bottom >= y) {\n range.detach();\n return (this.selectTextByTouch(element.childNodes[i], x, y, isForwardSelection, target, isCloserMovement));\n }\n else {\n range.detach();\n }\n }\n }\n return isTextSelected;\n };\n // tslint:disable-next-line\n TextSelection.prototype.setTouchSelectionStartPosition = function (selection, range, isForwardSelection, target, element, currentPosition, isCloserMovement) {\n if (isForwardSelection) {\n if (target === 'left') {\n // tslint:disable-next-line\n var startNode = this.getTouchFocusElement(selection, true);\n range.setStart(startNode.focusNode, startNode.focusOffset);\n range.setEnd(element, currentPosition);\n this.selectionAnchorTouch = { anchorNode: range.endContainer.parentElement.id, anchorOffset: range.endOffset };\n }\n else if (target === 'right') {\n // tslint:disable-next-line\n var startNode = this.getTouchAnchorElement(selection, false);\n range.setStart(startNode.anchorNode, startNode.anchorOffset);\n range.setEnd(element, currentPosition);\n this.selectionFocusTouch = { focusNode: range.endContainer.parentElement.id, focusOffset: range.endOffset };\n }\n }\n else {\n if (target === 'left') {\n if (!isCloserMovement) {\n // tslint:disable-next-line\n var startNode = this.getTouchFocusElement(selection, false);\n range.setStart(element, currentPosition);\n // tslint:disable-next-line:radix\n range.setEnd(startNode.focusNode, startNode.focusOffset);\n if (range.toString() === '') {\n range.setStart(element, currentPosition);\n range.setEnd(selection.focusNode, selection.focusOffset);\n }\n this.selectionAnchorTouch = { anchorNode: range.startContainer.parentElement.id, anchorOffset: range.startOffset };\n }\n else {\n range.setStart(element, currentPosition);\n range.setEnd(selection.focusNode, selection.focusOffset);\n this.selectionAnchorTouch = { anchorNode: range.startContainer.parentElement.id, anchorOffset: range.startOffset };\n }\n }\n else if (target === 'right') {\n // tslint:disable-next-line\n var startNode = this.getTouchAnchorElement(selection, true);\n range.setStart(element, currentPosition);\n range.setEnd(startNode.anchorNode, startNode.anchorOffset);\n if (range.toString() === '') {\n range.setStart(startNode.anchorNode, startNode.anchorOffset);\n range.setEnd(element, currentPosition);\n }\n this.selectionFocusTouch = { focusNode: range.startContainer.parentElement.id, focusOffset: range.startOffset };\n }\n }\n selection.removeAllRanges();\n selection.addRange(range);\n return range;\n };\n TextSelection.prototype.getTouchAnchorElement = function (selection, isCurrentFocus) {\n var element = document.getElementById(this.selectionAnchorTouch.anchorNode.toString());\n var startNode = null;\n var offset = 0;\n if (element) {\n startNode = element.childNodes[0];\n // tslint:disable-next-line:radix\n offset = parseInt(this.selectionAnchorTouch.anchorOffset.toString());\n }\n else {\n if (isCurrentFocus) {\n startNode = selection.focusNode;\n offset = selection.focusOffset;\n }\n else {\n startNode = selection.anchorNode;\n offset = selection.anchorOffset;\n }\n }\n return { anchorNode: startNode, anchorOffset: offset };\n };\n TextSelection.prototype.getTouchFocusElement = function (selection, isCurrentAnchor) {\n var element = document.getElementById(this.selectionFocusTouch.focusNode.toString());\n var startNode = null;\n var offset = 0;\n if (element) {\n startNode = element.childNodes[0];\n // tslint:disable-next-line:radix\n offset = parseInt(this.selectionFocusTouch.focusOffset.toString());\n }\n else {\n if (isCurrentAnchor) {\n startNode = selection.anchorNode;\n offset = selection.anchorOffset;\n }\n else {\n startNode = selection.focusNode;\n offset = selection.focusOffset;\n }\n }\n return { focusNode: startNode, focusOffset: offset };\n };\n TextSelection.prototype.createTouchSelectElement = function (event) {\n this.isTouchSelection = true;\n var selection = window.getSelection();\n if (selection.type === 'Range') {\n // tslint:disable-next-line:max-line-length\n this.dropDivElementLeft = createElement('div', { id: this.pdfViewer.element.id + '_touchSelect_droplet_left', className: 'e-pv-touch-select-drop' });\n // tslint:disable-next-line:max-line-length\n this.dropDivElementRight = createElement('div', { id: this.pdfViewer.element.id + '_touchSelect_droplet_right', className: 'e-pv-touch-select-drop' });\n this.dropElementLeft = createElement('div', { className: 'e-pv-touch-ellipse' });\n this.dropElementLeft.style.transform = 'rotate(0deg)';\n this.dropDivElementLeft.appendChild(this.dropElementLeft);\n this.dropElementRight = createElement('div', { className: 'e-pv-touch-ellipse' });\n this.dropElementRight.style.transform = 'rotate(-90deg)';\n this.dropDivElementRight.appendChild(this.dropElementRight);\n this.pdfViewerBase.pageContainer.appendChild(this.dropDivElementLeft);\n this.pdfViewerBase.pageContainer.appendChild(this.dropDivElementRight);\n var range = selection.getRangeAt(0);\n var rangePosition = range.getBoundingClientRect();\n var dropElementRect = this.dropDivElementLeft.getBoundingClientRect();\n // tslint:disable-next-line:max-line-length\n var pageTopValue = this.pdfViewerBase.pageSize[this.pdfViewerBase.currentPageNumber - 1].top;\n var viewerLeftPosition = this.pdfViewerBase.viewerContainer.getBoundingClientRect().left;\n var topClientValue = this.getClientValueTop(rangePosition.top, this.pdfViewerBase.currentPageNumber - 1);\n // tslint:disable-next-line:max-line-length\n var topPositionValue = topClientValue + pageTopValue * this.pdfViewerBase.getZoomFactor() + (dropElementRect.height / 2) * this.pdfViewerBase.getZoomFactor() + 'px';\n this.dropDivElementLeft.style.top = topPositionValue;\n this.dropDivElementLeft.style.left = rangePosition.left - (viewerLeftPosition + (dropElementRect.width)) + 'px';\n this.dropDivElementRight.style.top = topPositionValue;\n // tslint:disable-next-line:max-line-length\n this.dropDivElementRight.style.left = rangePosition.left + rangePosition.width - viewerLeftPosition + 'px';\n var currentPageLeft = this.pdfViewerBase.getElement('_pageDiv_' + (this.pdfViewerBase.currentPageNumber - 1)).getBoundingClientRect().left;\n var currentRangeLeft = rangePosition.left - currentPageLeft;\n // tslint:disable-next-line:max-line-length\n this.topStoreLeft = { pageTop: pageTopValue, topClientValue: this.getMagnifiedValue(topClientValue), pageNumber: this.pdfViewerBase.currentPageNumber - 1, left: this.getMagnifiedValue(currentRangeLeft), isHeightNeeded: true };\n // tslint:disable-next-line:max-line-length\n this.topStoreRight = { pageTop: pageTopValue, topClientValue: this.getMagnifiedValue(topClientValue), pageNumber: this.pdfViewerBase.currentPageNumber - 1, left: this.getMagnifiedValue(currentRangeLeft + rangePosition.width), isHeightNeeded: true };\n this.dropDivElementLeft.addEventListener('touchstart', this.onLeftTouchSelectElementTouchStart);\n this.dropDivElementLeft.addEventListener('touchmove', this.onLeftTouchSelectElementTouchMove);\n this.dropDivElementLeft.addEventListener('touchend', this.onLeftTouchSelectElementTouchEnd);\n this.dropDivElementRight.addEventListener('touchstart', this.onRightTouchSelectElementTouchStart);\n this.dropDivElementRight.addEventListener('touchmove', this.onRightTouchSelectElementTouchMove);\n this.dropDivElementRight.addEventListener('touchend', this.onRightTouchSelectElementTouchEnd);\n // tslint:disable-next-line:max-line-length\n this.calculateContextMenuPosition(event.touches[0].clientY, event.touches[0].clientX);\n }\n };\n // tslint:disable-next-line\n TextSelection.prototype.calculateContextMenuPosition = function (top, left) {\n top = top - this.pdfViewerBase.toolbarHeight;\n if (Browser.isDevice) {\n // tslint:disable-next-line\n var contextTop = top - this.contextMenuHeight;\n if (contextTop < this.pdfViewerBase.toolbarHeight) {\n top = top + this.contextMenuHeight;\n }\n else {\n top = contextTop;\n }\n }\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.contextMenuModule.contextMenuObj.open(top, left - this.pdfViewerBase.viewerContainer.clientLeft, this.pdfViewerBase.viewerContainer);\n };\n TextSelection.prototype.initiateSelectionByTouch = function () {\n this.pdfViewerBase.textLayer.clearDivSelection();\n this.pdfViewerBase.contextMenuModule.contextMenuObj.close();\n var lowerPageIndex = this.pdfViewerBase.currentPageNumber - 3;\n lowerPageIndex = (lowerPageIndex < 0) ? 0 : lowerPageIndex;\n var higherPageIndex = this.pdfViewer.currentPageNumber + 1;\n // tslint:disable-next-line:max-line-length\n higherPageIndex = (higherPageIndex < (this.pdfViewerBase.pageCount - 1)) ? higherPageIndex : (this.pdfViewerBase.pageCount - 1);\n for (var i = lowerPageIndex; i <= higherPageIndex; i++) {\n var textLayer = this.pdfViewerBase.getElement('_textLayer_' + i);\n if (textLayer) {\n if (textLayer.childNodes !== null) {\n this.applySelectionMouseScroll(i);\n }\n }\n }\n };\n // tslint:disable-next-line\n TextSelection.prototype.terminateSelectionByTouch = function (event) {\n this.maintainSelectionOnZoom(true, false);\n this.applySpanForSelection();\n if (this.pdfViewerBase.getTextMarkupAnnotationMode()) {\n // tslint:disable-next-line:max-line-length\n this.pdfViewer.annotationModule.textMarkupAnnotationModule.drawTextMarkupAnnotations(this.pdfViewer.annotationModule.textMarkupAnnotationModule.currentTextMarkupAddMode);\n }\n else {\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.contextMenuModule.contextMenuObj.open(event.changedTouches[0].clientY - this.pdfViewerBase.viewerContainer.offsetTop + this.pdfViewerBase.contextMenuModule.contextMenuElement.clientHeight, event.changedTouches[0].clientX - this.pdfViewerBase.viewerContainer.offsetLeft, this.pdfViewerBase.viewerContainer);\n }\n };\n TextSelection.prototype.getNodeElement = function (range, touchX, touchY, event, nodeElement) {\n if (document.caretRangeFromPoint) {\n range = document.caretRangeFromPoint(touchX, touchY);\n nodeElement = this.onTouchElementScroll(range, nodeElement, touchY, event);\n // tslint:disable-next-line\n }\n else if (document.caretPositionFromPoint) {\n // tslint:disable-next-line\n var start = document.caretPositionFromPoint(touchX, touchY);\n // tslint:disable-next-line\n var end = document.caretPositionFromPoint(touchX, touchY);\n range = document.createRange();\n range.setStart(start.offsetNode, start.offset);\n range.setEnd(end.offsetNode, end.offset);\n nodeElement = this.onTouchElementScroll(range, nodeElement, touchY, event);\n }\n return nodeElement;\n };\n TextSelection.prototype.isTouchedWithinContainer = function (event) {\n var elements = document.elementsFromPoint(event.touches[0].clientX, event.touches[0].clientY);\n var isTouchedWithinContainer = false;\n if (elements.length !== 0) {\n isTouchedWithinContainer = true;\n }\n return isTouchedWithinContainer;\n };\n TextSelection.prototype.onTouchElementScroll = function (range, nodeElement, touchY, event) {\n var viewerScrollTop = this.pdfViewerBase.viewerContainer.scrollTop;\n if (range != null) {\n nodeElement = range.startContainer;\n var isScrollBar = this.isScrolledOnScrollBar(event);\n if (!this.pdfViewerBase.viewerContainer.contains(nodeElement.parentElement) || isScrollBar) {\n if (touchY < this.pdfViewerBase.viewerContainer.clientHeight) {\n this.pdfViewerBase.viewerContainer.scrollTop = viewerScrollTop - 30;\n }\n else {\n this.pdfViewerBase.viewerContainer.scrollTop = viewerScrollTop + 30;\n }\n }\n }\n else {\n if (touchY < this.pdfViewerBase.viewerContainer.clientHeight) {\n this.pdfViewerBase.viewerContainer.scrollTop = viewerScrollTop - 30;\n }\n else {\n this.pdfViewerBase.viewerContainer.scrollTop = viewerScrollTop + 30;\n }\n }\n return nodeElement;\n };\n TextSelection.prototype.isCloserTouchScroll = function (currentDifference) {\n var isForwardMovement = false;\n if (this.previousScrollDifference > currentDifference) {\n isForwardMovement = true;\n }\n return isForwardMovement;\n };\n TextSelection.prototype.getClientValueTop = function (clientValue, pageNumber) {\n // tslint:disable-next-line:max-line-length\n return clientValue - this.pdfViewerBase.getElement('_pageDiv_' + pageNumber).getBoundingClientRect().top;\n };\n TextSelection.prototype.isScrolledOnScrollBar = function (event) {\n var isScrollBar = false;\n // tslint:disable-next-line:max-line-length\n if ((this.pdfViewerBase.viewerContainer.clientHeight + this.pdfViewerBase.viewerContainer.offsetTop) < event.touches[0].clientY && event.touches[0].clientY < (this.pdfViewerBase.viewerContainer.offsetHeight + this.pdfViewerBase.viewerContainer.offsetTop)) {\n isScrollBar = true;\n }\n return isScrollBar;\n };\n TextSelection.prototype.getTextLastLength = function (element) {\n if (element) {\n return element.textContent.length;\n }\n else {\n return 0;\n }\n };\n TextSelection.prototype.getNodeElementFromNode = function (node) {\n if (node.parentElement) {\n return node.parentElement;\n }\n else {\n return node.parentNode;\n }\n };\n /**\n * @private\n */\n TextSelection.prototype.copyText = function () {\n var selectionText = '';\n this.maintainSelectionOnZoom(true, false);\n if (this.selectionRangeArray.length > 0) {\n for (var i = 0; i < this.selectionRangeArray.length; i++) {\n selectionText += this.selectionRangeArray[i].textContent;\n }\n }\n if (selectionText.length > 0) {\n var textArea = document.createElement('textarea');\n textArea.contentEditable = 'true';\n textArea.textContent = selectionText;\n textArea.style.position = 'fixed';\n document.body.appendChild(textArea);\n textArea.select();\n try {\n document.execCommand('copy');\n }\n catch (ex) {\n console.warn('Copy to clipboard failed.', ex);\n }\n finally {\n if (textArea) {\n document.body.removeChild(textArea);\n }\n }\n }\n };\n /**\n * @private\n */\n TextSelection.prototype.destroy = function () {\n this.clear();\n };\n /**\n * @private\n */\n TextSelection.prototype.getModuleName = function () {\n return 'TextSelection';\n };\n return TextSelection;\n}());\nexport { TextSelection };\n","import { createElement, Browser } from '@syncfusion/ej2-base';\nimport { CheckBox } from '@syncfusion/ej2-buttons';\n/**\n * TextSearch module\n */\nvar TextSearch = /** @class */ (function () {\n /**\n * @private\n */\n function TextSearch(pdfViewer, pdfViewerBase) {\n var _this = this;\n /**\n * @private\n */\n this.isTextSearch = false;\n this.searchIndex = 0;\n this.currentSearchIndex = 0;\n this.searchPageIndex = null;\n this.searchString = null;\n this.isMatchCase = false;\n // tslint:disable-next-line\n this.textContents = new Array();\n // tslint:disable-next-line\n this.searchMatches = new Array();\n // tslint:disable-next-line\n this.searchCollection = new Array();\n this.searchedPages = [];\n this.isPrevSearch = false;\n // tslint:disable-next-line\n this.tempElementStorage = new Array();\n /**\n * @private\n */\n this.isMessagePopupOpened = false;\n this.checkBoxOnChange = function (event) {\n if (event.checked) {\n _this.isMatchCase = true;\n }\n else {\n _this.isMatchCase = false;\n }\n if (_this.isTextSearch) {\n _this.resetVariables();\n _this.clearAllOccurrences();\n var inputString = _this.searchInput.value;\n _this.searchIndex = 0;\n _this.textSearch(inputString);\n }\n };\n this.searchKeypressHandler = function (event) {\n _this.enableNextButton(true);\n _this.enablePrevButton(true);\n if (event.which === 13) {\n _this.initiateTextSearch(_this.searchInput);\n _this.updateSearchInputIcon(false);\n }\n else {\n _this.resetVariables();\n }\n };\n this.searchClickHandler = function (event) {\n _this.searchButtonClick(_this.searchBtn, _this.searchInput);\n };\n this.nextButtonOnClick = function (event) {\n _this.nextSearch();\n };\n this.prevButtonOnClick = function (event) {\n _this.prevSearch();\n };\n this.pdfViewer = pdfViewer;\n this.pdfViewerBase = pdfViewerBase;\n }\n /**\n * @private\n */\n TextSearch.prototype.createTextSearchBox = function () {\n var _this = this;\n // tslint:disable-next-line:max-line-length\n this.searchBox = createElement('div', { id: this.pdfViewer.element.id + '_search_box', className: 'e-pv-search-bar' });\n var searchElementsContainer = createElement('div', { id: this.pdfViewer.element.id + '_search_box_elements', className: 'e-pv-search-bar-elements' });\n // tslint:disable-next-line:max-line-length\n var searchInputContainer = createElement('div', { id: this.pdfViewer.element.id + '_search_input_container', className: 'e-input-group e-pv-search-input' });\n this.searchInput = createElement('input', { id: this.pdfViewer.element.id + '_search_input', className: 'e-input' });\n this.searchInput.type = 'text';\n this.searchInput.placeholder = this.pdfViewer.localeObj.getConstant('Find in document');\n // tslint:disable-next-line:max-line-length\n this.searchBtn = createElement('span', { id: this.pdfViewer.element.id + '_search_box-icon', className: 'e-input-group-icon e-input-search-group-icon e-pv-search-icon' });\n searchInputContainer.appendChild(this.searchInput);\n searchInputContainer.appendChild(this.searchBtn);\n searchElementsContainer.appendChild(searchInputContainer);\n if (this.pdfViewer.enableRtl) {\n this.prevSearchBtn = this.createSearchBoxButtons('prev_occurrence', 'e-pv-next-search');\n }\n else {\n this.prevSearchBtn = this.createSearchBoxButtons('prev_occurrence', 'e-pv-prev-search');\n }\n this.prevSearchBtn.setAttribute('aria-label', 'Previous Search text');\n searchElementsContainer.appendChild(this.prevSearchBtn);\n if (this.pdfViewer.enableRtl) {\n this.nextSearchBtn = this.createSearchBoxButtons('next_occurrence', 'e-pv-prev-search');\n }\n else {\n this.nextSearchBtn = this.createSearchBoxButtons('next_occurrence', 'e-pv-next-search');\n }\n this.nextSearchBtn.setAttribute('aria-label', 'Next Search text');\n searchElementsContainer.appendChild(this.nextSearchBtn);\n // tslint:disable-next-line:max-line-length\n var matchCaseContainer = createElement('div', { id: this.pdfViewer.element.id + '_match_case_container', className: 'e-pv-match-case-container' });\n var matchCaseInput = createElement('input', { id: this.pdfViewer.element.id + '_match_case' });\n matchCaseInput.type = 'checkbox';\n matchCaseContainer.appendChild(matchCaseInput);\n this.searchBox.appendChild(searchElementsContainer);\n this.searchBox.appendChild(matchCaseContainer);\n this.pdfViewerBase.mainContainer.appendChild(this.searchBox);\n // tslint:disable-next-line:max-line-length\n this.checkBox = new CheckBox({ cssClass: 'e-pv-match-case', label: this.pdfViewer.localeObj.getConstant('Match case'), change: this.checkBoxOnChange.bind(this) });\n this.checkBox.appendTo(matchCaseInput);\n this.showSearchBox(false);\n if (this.pdfViewer.enableRtl) {\n this.searchBox.classList.add('e-rtl');\n this.searchBox.style.left = '88.3px';\n }\n else {\n this.searchBox.classList.remove('e-rtl');\n this.searchBox.style.right = '88.3px';\n }\n this.searchInput.addEventListener('focus', function () {\n _this.searchInput.parentElement.classList.add('e-input-focus');\n });\n this.searchInput.addEventListener('blur', function () {\n _this.searchInput.parentElement.classList.remove('e-input-focus');\n });\n this.searchInput.addEventListener('keypress', this.searchKeypressHandler.bind(this));\n this.searchBtn.addEventListener('click', this.searchClickHandler.bind(this));\n this.nextSearchBtn.addEventListener('click', this.nextButtonOnClick.bind(this));\n this.prevSearchBtn.addEventListener('click', this.prevButtonOnClick.bind(this));\n };\n /**\n * @private\n */\n TextSearch.prototype.textSearchBoxOnResize = function () {\n if (this.pdfViewer.toolbarModule && this.pdfViewer.enableToolbar) {\n var secondaryToolbar = this.pdfViewerBase.getElement('_toolbarContainer_popup');\n if (secondaryToolbar) {\n if (secondaryToolbar.contains(this.pdfViewerBase.getElement('_search').parentElement)) {\n this.searchBox.style.right = '0px';\n }\n }\n }\n else {\n // tslint:disable-next-line:max-line-length\n if (this.pdfViewerBase.viewerContainer.clientWidth + this.pdfViewerBase.viewerContainer.offsetLeft < this.searchBox.offsetLeft + this.searchBox.clientWidth) {\n this.searchBox.style.right = '0px';\n // tslint:disable-next-line\n this.searchBox.style.width = parseInt(this.searchBox.style.width) - ((this.searchBox.offsetLeft + this.searchBox.clientWidth) - (this.pdfViewerBase.viewerContainer.clientWidth)) + 'px';\n // tslint:disable-next-line\n this.searchInput.style.width = parseInt(this.searchInput.style.width) - ((this.searchBox.offsetLeft + this.searchBox.clientWidth) - (this.pdfViewerBase.viewerContainer.clientWidth)) + 'px';\n }\n else {\n this.searchBox.style.right = '88.3px';\n this.searchBox.style.width = '';\n this.searchInput.style.width = '';\n }\n }\n };\n /**\n * @private\n */\n TextSearch.prototype.showSearchBox = function (isShow) {\n if (isShow) {\n this.searchBox.style.display = 'block';\n }\n else {\n this.searchBox.style.display = 'none';\n }\n this.onTextSearchClose();\n };\n /**\n * @private\n */\n TextSearch.prototype.searchAfterSelection = function () {\n if (this.isTextSearch) {\n this.initSearch(this.searchPageIndex, true);\n this.highlightOthers();\n }\n };\n TextSearch.prototype.initiateTextSearch = function (searchElement) {\n var inputString = searchElement.value;\n this.initiateSearch(inputString);\n };\n /**\n * @private\n */\n TextSearch.prototype.initiateSearch = function (inputString) {\n if (inputString !== this.searchString) {\n this.isTextSearch = false;\n this.searchPageIndex = this.pdfViewerBase.currentPageNumber - 1;\n }\n this.clearAllOccurrences();\n if (inputString !== '') {\n if (this.searchCollection[this.searchPageIndex] && inputString === this.searchString) {\n if (this.searchCollection[this.searchPageIndex].length === 0) {\n this.initSearch(this.searchPageIndex, false);\n }\n else {\n this.nextSearch();\n }\n }\n else {\n this.resetVariables();\n this.searchIndex = 0;\n this.textSearch(inputString);\n }\n }\n };\n TextSearch.prototype.textSearch = function (inputString) {\n if (inputString !== '' || inputString) {\n this.searchString = inputString;\n this.isTextSearch = true;\n this.searchPageIndex = this.pdfViewerBase.currentPageNumber - 1;\n this.initSearch(this.searchPageIndex, false);\n this.highlightOthers();\n }\n };\n TextSearch.prototype.nextSearch = function () {\n this.isPrevSearch = false;\n this.isTextSearch = true;\n if (this.searchString) {\n this.clearAllOccurrences();\n this.searchIndex = this.searchIndex + 1;\n if (this.searchCollection[this.searchPageIndex]) {\n // tslint:disable-next-line:max-line-length\n if (this.searchIndex >= this.searchCollection[this.searchPageIndex].length || this.searchPageIndex !== this.pdfViewerBase.currentPageNumber - 1) {\n this.searchIndex = 0;\n this.searchPageIndex = ((this.searchPageIndex + 1) < this.pdfViewerBase.pageCount) ? (this.searchPageIndex + 1) : 0;\n this.initSearch(this.searchPageIndex, false);\n }\n else {\n this.highlightSearchedTexts(this.searchPageIndex, false);\n }\n this.highlightOthers();\n }\n else {\n this.initiateTextSearch(this.searchInput);\n }\n }\n else {\n this.initiateTextSearch(this.searchInput);\n }\n };\n TextSearch.prototype.prevSearch = function () {\n this.isPrevSearch = true;\n this.isTextSearch = true;\n if (this.searchString) {\n this.clearAllOccurrences();\n this.searchIndex = this.searchIndex - 1;\n if (this.searchIndex < 0) {\n this.searchPageIndex = ((this.searchPageIndex - 1) < 0) ? (this.pdfViewerBase.pageCount - 1) : this.searchPageIndex - 1;\n this.initSearch(this.searchPageIndex, false);\n }\n else {\n this.highlightSearchedTexts(this.searchPageIndex, false);\n }\n this.highlightOthers();\n }\n else {\n this.searchIndex = this.searchIndex - 1;\n this.searchPageIndex = ((this.searchPageIndex - 1) < 0) ? (this.pdfViewerBase.pageCount - 1) : this.searchPageIndex - 1;\n var inputString = this.searchInput.value;\n this.textSearch(inputString);\n }\n };\n TextSearch.prototype.initSearch = function (pageIndex, isSinglePageSearch) {\n // tslint:disable-next-line\n var storedData = this.pdfViewerBase.getStoredData(pageIndex);\n var pageText = null;\n var textContents = null;\n if (storedData) {\n // tslint:disable-next-line\n pageText = storedData['pageText'];\n // tslint:disable-next-line\n textContents = storedData['textContent'];\n this.textContents[pageIndex] = textContents;\n this.getPossibleMatches(pageIndex, this.searchString, pageText, textContents, isSinglePageSearch);\n }\n else {\n if (!isSinglePageSearch) {\n this.createRequestForSearch(pageIndex);\n }\n }\n };\n // tslint:disable-next-line:max-line-length\n TextSearch.prototype.getPossibleMatches = function (pageIndex, searchString, pageString, textContents, isSinglePageSearch) {\n var pageText = pageString;\n var searchText = searchString;\n var queryLength = searchString.length;\n if (!this.isMatchCase) {\n searchText = searchString.toLowerCase();\n pageText = pageString.toLowerCase();\n }\n var matches = [];\n var matchIndex = -queryLength;\n while (matchIndex !== 0) {\n if (searchText === '' || searchText === ' ' || !searchText) {\n break;\n }\n matchIndex = pageText.indexOf(searchText, matchIndex + queryLength);\n if (matchIndex === -1) {\n break;\n }\n matches.push(matchIndex);\n }\n this.searchMatches[pageIndex] = matches;\n if (!isSinglePageSearch) {\n if (this.searchedPages.indexOf(pageIndex) === -1) {\n this.searchedPages.push(pageIndex);\n }\n this.updateSearchInputIcon(false);\n }\n if (this.searchMatches[pageIndex].length !== 0) {\n if (!isSinglePageSearch) {\n if (this.isPrevSearch) {\n this.searchIndex = this.searchMatches[pageIndex].length - 1;\n }\n if ((this.pdfViewerBase.currentPageNumber - 1) !== this.searchPageIndex) {\n // tslint:disable-next-line:max-line-length\n if (this.searchCollection.length > 0 && (this.searchIndex === 0 || this.searchIndex === -1) && (this.searchPageIndex) === this.currentSearchIndex) {\n if (!this.isMessagePopupOpened) {\n this.onMessageBoxOpen();\n }\n this.searchPageIndex = this.getSearchPage(this.pdfViewerBase.currentPageNumber - 1);\n this.searchedPages = [];\n }\n this.pdfViewerBase.updateScrollTop(this.searchPageIndex);\n }\n }\n this.convertMatches(pageIndex, queryLength, textContents, isSinglePageSearch);\n }\n else {\n if (!isSinglePageSearch) {\n if (this.isPrevSearch) {\n this.searchPageIndex = ((this.searchPageIndex - 1) < 0) ? (this.pdfViewerBase.pageCount - 1) : this.searchPageIndex - 1;\n }\n else {\n this.searchPageIndex = ((this.searchPageIndex + 1) < this.pdfViewerBase.pageCount) ? (this.searchPageIndex + 1) : 0;\n }\n if (this.searchedPages.indexOf(this.searchPageIndex) === -1 && this.searchedPages.length !== this.pdfViewerBase.pageCount) {\n this.initSearch(this.searchPageIndex, false);\n }\n else {\n var searchPageIndex = this.getSearchPage(pageIndex);\n // tslint:disable-next-line:max-line-length\n if (!this.searchCollection[this.searchPageIndex] && this.searchCollection.length === 0 && this.searchedPages.length === this.pdfViewerBase.pageCount) {\n // tslint:disable-next-line:max-line-length\n if (!this.isMessagePopupOpened) {\n this.onMessageBoxOpen();\n }\n // tslint:disable-next-line:max-line-length\n }\n else if (this.searchCollection.length > 0 && (this.searchIndex === 0 || this.searchIndex === -1) && (searchPageIndex) === this.currentSearchIndex) {\n if (this.isPrevSearch) {\n // tslint:disable-next-line:max-line-length\n if (!this.isMessagePopupOpened) {\n this.onMessageBoxOpen();\n }\n this.searchPageIndex = this.getSearchPage(this.pdfViewerBase.currentPageNumber - 1);\n this.searchedPages = [];\n this.searchIndex = -1;\n }\n else {\n if (!this.isMessagePopupOpened) {\n this.onMessageBoxOpen();\n }\n this.searchPageIndex = this.getSearchPage(this.pdfViewerBase.currentPageNumber - 1);\n this.searchedPages = [];\n this.searchIndex = 0;\n }\n this.highlightSearchedTexts(this.searchPageIndex, isSinglePageSearch);\n }\n }\n }\n }\n };\n TextSearch.prototype.getSearchPage = function (pageIndex) {\n var pageNumber = null;\n if (this.isPrevSearch) {\n for (var i = pageIndex; i >= 0; i--) {\n if (i !== pageIndex && this.searchCollection[i]) {\n pageNumber = i;\n break;\n }\n }\n if (!pageNumber) {\n for (var j = this.pdfViewerBase.pageCount - 1; j > pageIndex; j--) {\n if (this.searchCollection[j]) {\n pageNumber = j;\n break;\n }\n }\n }\n }\n else {\n for (var i = pageIndex; i < this.pdfViewerBase.pageCount; i++) {\n if (i !== pageIndex && this.searchCollection[i]) {\n pageNumber = i;\n break;\n }\n }\n if (!pageNumber) {\n for (var j = 0; j < pageIndex; j++) {\n if (this.searchCollection[j]) {\n pageNumber = j;\n break;\n }\n }\n }\n }\n return pageNumber;\n };\n TextSearch.prototype.convertMatches = function (pageIndex, queryLength, textContents, isSinglePageSearch) {\n var m = 0;\n var matches = this.searchMatches[pageIndex];\n var divIndex = 0;\n var end = textContents.length - 1;\n var matchCollection = [];\n for (var i = 0; i < matches.length; i++) {\n var matchIndex = matches[i];\n while (m !== end && matchIndex >= (divIndex + textContents[m].split('\\r\\n')[0].length)) {\n divIndex += textContents[m].split('\\r\\n')[0].length;\n m++;\n }\n var match = {\n begin: {\n divId: m,\n offsetValue: matchIndex - divIndex,\n }\n };\n matchIndex += queryLength;\n while (m !== end && matchIndex > (divIndex + textContents[m].length)) {\n divIndex += textContents[m].length;\n m++;\n }\n match.end = {\n divId: m,\n offsetValue: matchIndex - divIndex,\n };\n matchCollection.push(match);\n }\n if (this.searchCollection.length === 0) {\n this.currentSearchIndex = pageIndex;\n }\n this.searchCollection[pageIndex] = matchCollection;\n this.highlightSearchedTexts(pageIndex, isSinglePageSearch);\n };\n TextSearch.prototype.highlightSearchedTexts = function (pageIndex, isSinglePageSearch) {\n var matches = this.searchCollection[pageIndex];\n var prevEnd = null;\n // tslint:disable-next-line\n var scrollPoint = { y: -100, x: -100 };\n var startId;\n var className;\n for (var i = 0; i < matches.length; i++) {\n var match = matches[i];\n // tslint:disable-next-line\n var start = match.begin;\n // tslint:disable-next-line\n var end = match.end;\n if (i === this.searchIndex && pageIndex === this.searchPageIndex) {\n className = 'e-pv-search-text-highlight';\n startId = start.divId;\n }\n else {\n className = 'e-pv-search-text-highlightother';\n }\n if (!prevEnd || start.divId !== prevEnd.divId) {\n if (prevEnd !== null) {\n // tslint:disable-next-line:max-line-length\n this.addSpanForSearch(pageIndex, parseFloat(prevEnd.divId.toString()), parseFloat(prevEnd.offsetValue.toString()), undefined, null);\n }\n this.beginText(start, pageIndex, null);\n }\n else {\n // tslint:disable-next-line:max-line-length\n this.addSpanForSearch(pageIndex, parseFloat(prevEnd.divId.toString()), parseFloat(prevEnd.offsetValue.toString()), parseFloat(start.offsetValue.toString()), null);\n }\n if (start.divId === end.divId) {\n this.addSpanForSearch(pageIndex, start.divId, start.offsetValue, end.offsetValue, className);\n }\n else {\n this.addSpanForSearch(pageIndex, start.divId, start.offsetValue, undefined, className);\n for (var k = start.divId + 1; k < end.divId; k++) {\n this.addSpanForSearch(pageIndex, k, 0, undefined, className + ' middle');\n }\n this.beginText(end, pageIndex, className);\n }\n prevEnd = end;\n }\n if (prevEnd) {\n // tslint:disable-next-line:max-line-length\n this.addSpanForSearch(pageIndex, parseFloat(prevEnd.divId.toString()), parseFloat(prevEnd.offsetValue.toString()), undefined, null);\n }\n if (pageIndex === this.searchPageIndex && !isSinglePageSearch) {\n var element = this.pdfViewerBase.getElement('_text_' + pageIndex + '_' + startId);\n if (element) {\n var targetScrollElement = this.getScrollElement(element);\n this.scrollToSearchStr(targetScrollElement, scrollPoint);\n }\n else {\n this.pdfViewerBase.updateScrollTop(pageIndex);\n var element_1 = this.pdfViewerBase.getElement('_text_' + pageIndex + '_' + startId);\n var targetScrollElement = this.getScrollElement(element_1);\n this.scrollToSearchStr(targetScrollElement, scrollPoint);\n }\n }\n };\n // tslint:disable-next-line\n TextSearch.prototype.beginText = function (start, pageIndex, className) {\n var divIndex = parseFloat(start.divId);\n var textDiv = this.pdfViewerBase.getElement('_text_' + pageIndex + '_' + divIndex);\n if (textDiv) {\n // tslint:disable-next-line\n this.tempElementStorage = new Array();\n for (var i = 0; i < textDiv.childNodes.length; i++) {\n // tslint:disable-next-line:max-line-length\n var ele = { text: textDiv.childNodes[i].textContent, classString: textDiv.childNodes[i].className };\n this.tempElementStorage.push(ele);\n }\n textDiv.textContent = '';\n this.addSpanForSearch(pageIndex, divIndex, 0, start.offsetValue, className);\n }\n };\n // tslint:disable-next-line:max-line-length\n TextSearch.prototype.addSpanForSearch = function (pageIndex, divIndex, fromOffset, toOffset, className) {\n var divTextContent;\n var textDiv = this.pdfViewerBase.getElement('_text_' + pageIndex + '_' + divIndex);\n if (textDiv) {\n var textContent = this.textContents[pageIndex];\n divTextContent = textContent[divIndex].substring(fromOffset, toOffset);\n var node = document.createTextNode(divTextContent);\n if (className) {\n var spanElement = document.createElement('span');\n spanElement.className = className;\n if (spanElement.classList.contains('middle')) {\n textDiv.textContent = '';\n }\n spanElement.appendChild(node);\n textDiv.appendChild(spanElement);\n }\n else {\n if (this.pdfViewer.textSelectionModule.isTextSelection) {\n this.searchOnSelection(textDiv, node, divTextContent);\n }\n else {\n textDiv.appendChild(node);\n }\n }\n }\n };\n TextSearch.prototype.isClassAvailable = function () {\n var isClass = false;\n for (var j = 0; j < this.tempElementStorage.length; j++) {\n if (this.tempElementStorage[j].classString) {\n // tslint:disable-next-line:max-line-length\n if (this.tempElementStorage[j].classString === 'e-pv-search-text-highlight' || this.tempElementStorage[j].classString === 'e-pv-search-text-highlightother') {\n isClass = true;\n break;\n }\n }\n }\n return isClass;\n };\n TextSearch.prototype.addSpan = function (text, textDiv) {\n var newNode = document.createTextNode(text);\n var spanElement = document.createElement('span');\n spanElement.className = 'e-pv-maintaincontent';\n spanElement.appendChild(newNode);\n textDiv.appendChild(spanElement);\n };\n TextSearch.prototype.searchOnSelection = function (textDiv, node, divTextContent) {\n if (this.tempElementStorage.length === 1) {\n if (this.tempElementStorage[0].classString) {\n if (this.tempElementStorage[0].classString.indexOf('e-pv-maintaincontent') !== -1) {\n this.addSpan(node.textContent, textDiv);\n }\n }\n else {\n textDiv.appendChild(node);\n }\n }\n else {\n if (this.tempElementStorage.length > 1) {\n for (var i = 0; i < this.tempElementStorage.length; i++) {\n if (this.tempElementStorage[i].classString) {\n if (this.tempElementStorage[i].classString.indexOf('e-pv-maintaincontent') !== -1) {\n if (this.tempElementStorage[i].text === node.textContent) {\n this.addSpan(node.textContent, textDiv);\n break;\n }\n else {\n if (this.tempElementStorage[i].text !== node.textContent) {\n var currentString = node.textContent;\n var isClassAvailable = this.isClassAvailable();\n var subString = void 0;\n if (isClassAvailable) {\n subString = divTextContent.substring(0, this.tempElementStorage[i].text.length);\n }\n else {\n subString = divTextContent.substring(0, this.tempElementStorage[i].text.length);\n } // tslint:disable-next-line\n if (this.tempElementStorage[i].text.indexOf(currentString) !== -1 && !this.tempElementStorage[i].classString) {\n this.addSpan(currentString, textDiv);\n break; // tslint:disable-next-line\n }\n else if (this.tempElementStorage[i].text.indexOf(subString) !== -1 && this.tempElementStorage[i].classString && subString !== '') {\n if (this.tempElementStorage[i].classString.indexOf('e-pv-maintaincontent') !== -1) {\n this.addSpan(subString, textDiv); // tslint:disable-next-line\n var nextSubString = divTextContent.substring(this.tempElementStorage[i].text.length, divTextContent.length);\n if (this.tempElementStorage[i + 1]) { // tslint:disable-next-line\n if (this.tempElementStorage[i + 1].text.indexOf(nextSubString) !== -1 && !this.tempElementStorage[i + 1].classString && nextSubString !== \"\") {\n node.textContent = nextSubString;\n textDiv.appendChild(node);\n }\n }\n break;\n }\n }\n else if (this.tempElementStorage[i + 1]) {\n if (divTextContent === (this.tempElementStorage[i].text + this.tempElementStorage[i + 1].text)) {\n this.addSpan(this.tempElementStorage[i].text, textDiv);\n node.textContent = this.tempElementStorage[i + 1].text;\n textDiv.appendChild(node);\n break;\n }\n else if (this.tempElementStorage[i].text.indexOf(divTextContent) !== -1) {\n this.addSpan(divTextContent, textDiv);\n break;\n }\n else { // tslint:disable-next-line\n var subString_1 = this.tempElementStorage[i].text.substring(textDiv.textContent.length, currentString.length);\n if (this.tempElementStorage[i].text.indexOf(subString_1) !== -1 && this.tempElementStorage[i].classString && // tslint:disable-next-line\n subString_1 !== '' && !this.tempElementStorage[i + 1].classString && divTextContent.indexOf(subString_1) !== -1) {\n this.addSpan(subString_1, textDiv);\n continue;\n }\n }\n }\n else {\n if (this.tempElementStorage[i].text.indexOf(divTextContent) !== -1) {\n this.addSpan(node.textContent, textDiv);\n break;\n }\n else if (this.tempElementStorage[i].text.indexOf(divTextContent.replace('\\r\\n', '')) !== -1) {\n this.addSpan(divTextContent, textDiv);\n }\n }\n }\n }\n }\n }\n else {\n if (this.tempElementStorage[i].text !== node.textContent) {\n var currentString = node.textContent;\n if (currentString !== '') {\n var isClassAvailable = this.isClassAvailable();\n var subString = void 0;\n if (isClassAvailable) {\n subString = divTextContent.substring(0, this.tempElementStorage[i].text.length);\n }\n else { // tslint:disable-next-line\n subString = divTextContent.substring(0, this.tempElementStorage[i].text.length - textDiv.textContent.length);\n } // tslint:disable-next-line\n if (subString === currentString && !this.tempElementStorage[i].classString && this.tempElementStorage[i].text.indexOf(subString) !== -1) {\n node.textContent = subString;\n textDiv.appendChild(node);\n break;\n }\n else { // tslint:disable-next-line\n if (this.tempElementStorage[i].text.indexOf(subString) !== -1 && this.tempElementStorage[i].classString) {\n if (this.tempElementStorage[i].classString.indexOf('e-pv-maintaincontent') !== -1) {\n this.addSpan(subString, textDiv);\n break;\n }\n }\n else if (this.tempElementStorage[i + 1]) { // tslint:disable-next-line\n var balanceString = currentString.substring(this.tempElementStorage[i].text.length, currentString.length);\n var nextString = this.tempElementStorage[i + 1].text.substring(0, balanceString.length);\n if (currentString === (subString + this.tempElementStorage[i + 1].text)) {\n node.textContent = subString;\n textDiv.appendChild(node);\n this.addSpan(this.tempElementStorage[i + 1].text, textDiv);\n break;\n }\n else if (currentString === (subString + nextString) && nextString !== '') {\n node.textContent = subString;\n textDiv.appendChild(node);\n this.addSpan(balanceString, textDiv);\n break;\n }\n else { // tslint:disable-next-line\n if (this.tempElementStorage[i].text.indexOf(subString) !== -1 && !this.tempElementStorage[i].classString && subString !== '') {\n var newSubString = divTextContent.substring(0, subString.length);\n node.textContent = newSubString;\n textDiv.appendChild(node); // tslint:disable-next-line\n var nextNewSubString = divTextContent.substring(subString.length, divTextContent.length);\n if (nextNewSubString !== '' && this.tempElementStorage[i + 1].text.indexOf(nextNewSubString) !== -1 && this.tempElementStorage[i + 1].classString) {\n this.addSpan(nextNewSubString, textDiv);\n }\n break;\n }\n }\n }\n else { // tslint:disable-next-line\n if (this.tempElementStorage[i].text.indexOf(currentString) !== -1 && !this.tempElementStorage[i].classString) {\n node.textContent = currentString;\n textDiv.appendChild(node);\n break; // tslint:disable-next-line\n }\n else if (this.tempElementStorage[i].text.indexOf(currentString.replace('\\r\\n', '')) !== -1 && !this.tempElementStorage[i].classString) {\n node.textContent = currentString;\n textDiv.appendChild(node);\n break;\n }\n else {\n if (divTextContent.indexOf(this.tempElementStorage[i].text) !== -1) {\n node.textContent = this.tempElementStorage[i].text;\n textDiv.appendChild(node);\n break;\n }\n }\n }\n }\n }\n }\n else {\n textDiv.appendChild(node);\n }\n }\n }\n }\n else {\n textDiv.appendChild(node);\n }\n }\n };\n TextSearch.prototype.getScrollElement = function (element) {\n var targetElement = element;\n if (element.childNodes.length > 0) {\n for (var i = 0; i < element.childNodes.length; i++) {\n if (element.childNodes[i].classList) {\n if (element.childNodes[i].classList.contains('e-pv-search-text-highlight')) {\n targetElement = element.childNodes[i];\n }\n }\n }\n }\n return targetElement;\n };\n // tslint:disable-next-line\n TextSearch.prototype.scrollToSearchStr = function (element, scrollPoint) {\n var parent = element.offsetParent;\n var offsetY = element.offsetTop + element.clientTop;\n var offsetX = element.offsetLeft + element.clientLeft;\n while (parent.id !== this.pdfViewerBase.viewerContainer.id) {\n offsetY += parent.offsetTop;\n offsetX += parent.offsetLeft;\n parent = parent.offsetParent;\n }\n if (scrollPoint) {\n offsetY += scrollPoint.y;\n offsetX += scrollPoint.x;\n if (Browser.isDevice) {\n parent.scrollLeft = offsetX;\n }\n else {\n if (this.pdfViewerBase.getZoomFactor() > 1.5) {\n parent.scrollLeft = offsetX;\n }\n }\n }\n parent.scrollTop = offsetY;\n this.pdfViewerBase.updateMobileScrollerPosition();\n };\n /**\n * @private\n */\n TextSearch.prototype.highlightOtherOccurrences = function (pageNumber) {\n this.initSearch(pageNumber, true);\n };\n TextSearch.prototype.highlightOthers = function () {\n var indexes = this.getIndexes();\n var lowerPageValue = parseFloat(indexes.lowerPageValue.toString());\n var higherPageValue = parseFloat(indexes.higherPageValue.toString());\n for (var i = lowerPageValue; i <= higherPageValue; i++) {\n this.highlightOtherOccurrences(i);\n }\n };\n TextSearch.prototype.clearAllOccurrences = function () {\n this.pdfViewerBase.textLayer.clearDivSelection();\n this.applyTextSelection();\n };\n /**\n * @private\n */\n // tslint:disable-next-line\n TextSearch.prototype.getIndexes = function () {\n var lowerPageValue = this.pdfViewerBase.currentPageNumber - 3;\n lowerPageValue = (lowerPageValue > 0) ? lowerPageValue : 0;\n var higherPageValue = this.pdfViewerBase.currentPageNumber + 1;\n higherPageValue = (higherPageValue < this.pdfViewerBase.pageCount) ? higherPageValue : (this.pdfViewerBase.pageCount - 1);\n return { lowerPageValue: lowerPageValue, higherPageValue: higherPageValue };\n };\n TextSearch.prototype.applyTextSelection = function () {\n if (this.pdfViewer.textSelectionModule && !this.pdfViewerBase.isTextSelectionDisabled) {\n var indexes = this.getIndexes();\n var lowerPageValue = parseFloat(indexes.lowerPageValue.toString());\n var higherPageValue = parseFloat(indexes.higherPageValue.toString());\n for (var i = lowerPageValue; i <= higherPageValue; i++) {\n this.pdfViewer.textSelectionModule.applySelectionRangeOnScroll(i);\n }\n }\n };\n /**\n * @private\n */\n TextSearch.prototype.resetTextSearch = function () {\n this.resetVariables();\n this.onTextSearchClose();\n this.searchPageIndex = null;\n this.searchIndex = 0;\n this.updateSearchInputIcon(true);\n this.enableNextButton(false);\n this.enablePrevButton(false);\n };\n TextSearch.prototype.onTextSearchClose = function () {\n this.isPrevSearch = false;\n this.isTextSearch = false;\n if (this.pdfViewerBase.pageCount > 0) {\n this.clearAllOccurrences();\n }\n };\n TextSearch.prototype.createRequestForSearch = function (pageIndex) {\n var _this = this;\n var jsonObject;\n // tslint:disable-next-line:max-line-length\n jsonObject = { xCoordinate: 0, yCoordinate: 0, pageNumber: pageIndex, documentId: this.pdfViewerBase.getDocumentId(), hashId: this.pdfViewerBase.hashId, zoomFactor: this.pdfViewerBase.getZoomFactor() };\n var request = new XMLHttpRequest();\n request.open('POST', this.pdfViewer.serviceUrl + '/' + this.pdfViewer.serverActionSettings.renderPages);\n request.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');\n request.responseType = 'json';\n request.send(JSON.stringify(jsonObject));\n // tslint:disable-next-line\n request.onreadystatechange = function (event) {\n var proxy = _this.pdfViewerBase;\n if (request.readyState === 4 && request.status === 200) {\n // tslint:disable-next-line\n var data = event.currentTarget.response;\n // tslint:disable-next-line:max-line-length\n if (typeof data !== 'object') {\n data = JSON.parse(data);\n }\n if (data) {\n if (data.pageText) {\n proxy.storeWinData(data, pageIndex);\n _this.initSearch(pageIndex, false);\n }\n }\n }\n else if (request.readyState === 4 && request.status === 400) {\n // error\n _this.pdfViewer.fireAjaxRequestFailed(request.status, request.statusText);\n }\n };\n // tslint:disable-next-line\n request.onerror = function (event) {\n _this.pdfViewerBase.openNotificationPopup();\n _this.pdfViewer.fireAjaxRequestFailed(request.status, request.statusText);\n };\n };\n TextSearch.prototype.createSearchBoxButtons = function (id, className) {\n // tslint:disable-next-line:max-line-length\n var button = createElement('button', { id: this.pdfViewer.element.id + '_' + id, className: 'e-btn e-icon-btn e-pv-search-btn ' + className });\n var iconSpan = createElement('span', { id: this.pdfViewer.element.id + '_' + id + 'Icon', className: 'e-pv-icon-search ' + className + '-icon' });\n button.disabled = true;\n button.appendChild(iconSpan);\n return button;\n };\n TextSearch.prototype.enablePrevButton = function (isEnable) {\n if (!Browser.isDevice) {\n if (isEnable) {\n this.prevSearchBtn.removeAttribute('disabled');\n }\n else {\n this.prevSearchBtn.disabled = true;\n }\n }\n };\n TextSearch.prototype.enableNextButton = function (isEnable) {\n if (!Browser.isDevice) {\n if (isEnable) {\n this.nextSearchBtn.removeAttribute('disabled');\n }\n else {\n this.nextSearchBtn.disabled = true;\n }\n }\n };\n /**\n * @private\n */\n TextSearch.prototype.resetVariables = function () {\n this.searchedPages = [];\n // tslint:disable-next-line\n this.searchMatches = new Array();\n // tslint:disable-next-line\n this.searchCollection = new Array();\n };\n /**\n * @private\n */\n TextSearch.prototype.searchButtonClick = function (element, inputElement) {\n if (element.classList.contains('e-pv-search-icon')) {\n this.initiateTextSearch(inputElement);\n }\n else if (element.classList.contains('e-pv-search-close')) {\n inputElement.value = '';\n this.resetTextSearch();\n inputElement.focus();\n }\n };\n TextSearch.prototype.updateSearchInputIcon = function (isEnable) {\n if (this.searchBtn) {\n if (isEnable) {\n this.searchBtn.classList.remove('e-pv-search-close');\n this.searchBtn.classList.add('e-pv-search-icon');\n }\n else {\n this.searchBtn.classList.remove('e-pv-search-icon');\n this.searchBtn.classList.add('e-pv-search-close');\n }\n }\n };\n TextSearch.prototype.onMessageBoxOpen = function () {\n this.pdfViewerBase.getElement('_search_input').blur();\n this.isMessagePopupOpened = true;\n if (!Browser.isDevice) {\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.textLayer.createNotificationPopup(this.pdfViewer.localeObj.getConstant('No matches'));\n }\n else {\n // tslint:disable-next-line:max-line-length\n this.pdfViewerBase.navigationPane.createTooltipMobile(this.pdfViewer.localeObj.getConstant('No Text Found'));\n }\n };\n /**\n * Searches the target text in the PDF document and highlights the occurrences in the pages\n * @param {string} searchText - Specifies the searchText content\n * @param {boolean} isMatchCase - If set true , its highlights the MatchCase content\n * @returns void\n */\n TextSearch.prototype.searchText = function (searchText, isMatchCase) {\n this.searchString = searchText;\n this.isMatchCase = isMatchCase;\n this.searchIndex = 0;\n this.textSearch(searchText);\n };\n /**\n * Searches the next occurrence of the searched text from the current occurrence of the PdfViewer.\n * @returns void\n */\n TextSearch.prototype.searchNext = function () {\n this.nextSearch();\n };\n /**\n * Searches the previous occurrence of the searched text from the current occurrence of the PdfViewer.\n * @returns void\n */\n TextSearch.prototype.searchPrevious = function () {\n this.prevSearch();\n };\n /**\n * Cancels the text search of the PdfViewer.\n * @returns void\n */\n TextSearch.prototype.cancelTextSearch = function () {\n this.resetTextSearch();\n };\n /**\n * @private\n */\n TextSearch.prototype.destroy = function () {\n this.searchCollection = undefined;\n };\n /**\n * @private\n */\n TextSearch.prototype.getModuleName = function () {\n return 'TextSearch';\n };\n return TextSearch;\n}());\nexport { TextSearch };\n","import { createElement, Browser } from '@syncfusion/ej2-base';\n/**\n * Print module\n */\nvar Print = /** @class */ (function () {\n /**\n * @private\n */\n function Print(viewer, base) {\n this.pdfViewer = viewer;\n this.pdfViewerBase = base;\n }\n /**\n * Print the PDF document being loaded in the ejPdfViewer control.\n * @returns void\n */\n Print.prototype.print = function () {\n var _this = this;\n var pageIndex;\n if (this.pdfViewerBase.pageCount > 0) {\n // tslint:disable-next-line:max-line-length\n this.printViewerContainer = createElement('div', {\n id: this.pdfViewer.element.id + '_print_viewer_container',\n className: 'e-pv-print-viewer-container'\n });\n this.pdfViewerBase.showPrintLoadingIndicator(true);\n this.iframe = document.createElement('iframe');\n this.iframe.className = 'iframeprint';\n this.iframe.id = 'iframePrint';\n this.iframe.style.position = 'absolute';\n this.iframe.style.top = '-100000000px';\n document.body.appendChild(this.iframe);\n this.frameDoc = this.iframe.contentWindow ? this.iframe.contentWindow : this.iframe.contentDocument;\n this.frameDoc.document.open();\n setTimeout(function () {\n for (pageIndex = 0; pageIndex < _this.pdfViewerBase.pageCount; pageIndex++) {\n var pageWidth = _this.pdfViewerBase.pageSize[pageIndex].width;\n var pageHeight = _this.pdfViewerBase.pageSize[pageIndex].height;\n _this.pdfViewer.printModule.createRequestForPrint(pageIndex, pageWidth, pageHeight, _this.pdfViewerBase.pageCount);\n }\n }, 100);\n }\n };\n Print.prototype.createRequestForPrint = function (pageIndex, pageWidth, pageHeight, pageCount) {\n var proxy = this;\n var request = new XMLHttpRequest();\n // tslint: disable-next-line:max-line-length\n // set default zoomFactor value. \n var jsonObject = {\n pageNumber: pageIndex, documentId: this.pdfViewerBase.documentId,\n hashId: this.pdfViewerBase.hashId, zoomFactor: 1\n };\n request.open('POST', proxy.pdfViewer.serviceUrl + '/PrintImages', false);\n request.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');\n request.send(JSON.stringify(jsonObject));\n // tslint:disable-next-line\n var printImage = request.responseText;\n if (typeof printImage !== 'object') {\n printImage = JSON.parse(printImage);\n }\n var annotationSource = '';\n if (printImage.textMarkupAnnotation && this.pdfViewerBase.isTextMarkupAnnotationModule()) {\n // tslint:disable-next-line:max-line-length\n annotationSource = this.pdfViewer.annotationModule.textMarkupAnnotationModule.printTextMarkupAnnotations(printImage.textMarkupAnnotation, pageIndex);\n }\n // tslint:disable-next-line:max-line-length\n this.printCanvas = createElement('canvas', { id: this.pdfViewer.element.id + '_printCanvas_' + pageIndex, className: 'e-pv-print-canvas' });\n this.printCanvas.style.width = pageWidth + 'px';\n this.printCanvas.style.height = pageHeight + 'px';\n this.printCanvas.height = 1056 * window.devicePixelRatio;\n this.printCanvas.width = 816 * window.devicePixelRatio;\n var context = this.printCanvas.getContext('2d');\n var pageImage = new Image();\n var annotationImage = new Image();\n pageImage.onload = function () {\n if (pageHeight > pageWidth) {\n context.drawImage(pageImage, 0, 0, proxy.printCanvas.width, proxy.printCanvas.height);\n if (annotationSource) {\n context.drawImage(annotationImage, 0, 0, proxy.printCanvas.width, proxy.printCanvas.height);\n }\n }\n else {\n // translate to center canvas\n context.translate(proxy.printCanvas.width * 0.5, proxy.printCanvas.height * 0.5);\n // rotate the canvas to - 90 degree \n context.rotate(-0.5 * Math.PI);\n // un translate the canvas back to origin\n context.translate(-proxy.printCanvas.height * 0.5, -proxy.printCanvas.width * 0.5);\n // draw the image\n context.drawImage(pageImage, 0, 0, proxy.printCanvas.height, proxy.printCanvas.width);\n if (annotationSource) {\n context.drawImage(annotationImage, 0, 0, proxy.printCanvas.height, proxy.printCanvas.width);\n }\n }\n if (pageIndex === (proxy.pdfViewerBase.pageCount - 1)) {\n proxy.printWindowOpen();\n }\n };\n pageImage.src = printImage.image;\n annotationImage.src = annotationSource;\n this.printViewerContainer.appendChild(this.printCanvas);\n };\n Print.prototype.printWindowOpen = function () {\n var _this = this;\n var browserUserAgent = navigator.userAgent;\n // tslint: disable-next-line:max-line-length\n if ((browserUserAgent.indexOf('Chrome') !== -1) || (browserUserAgent.indexOf('Safari') !== -1) ||\n (browserUserAgent.indexOf('Firefox')) !== -1) {\n //chrome and firefox\n this.frameDoc.document.write('');\n // tslint: disable-next-line:max-line-length\n this.frameDoc.document.write('' +\n (this.dataSource.columns.length === 0 ? '' :\n this.parent.localeObj.getConstant('column') + ': ' + args.series.name.split(' | ')[0] + '
') +\n (this.dataSource.rows.length === 0 ? '' :\n this.parent.localeObj.getConstant('row') + ': ' + args.point.x);\n this.parent.trigger(events.chartTooltipRender, args);\n };\n // The commented lines will be utilized once we get the requested requirement(of multi-level labels) from chart team.\n PivotChart.prototype.loaded = function (args) {\n this.parent.isChartLoaded = true;\n if (this.parent.chart && this.parent.showGroupingBar && this.parent.groupingBarModule &&\n this.parent.showFieldList && this.parent.currentView === 'Chart') {\n this.parent.groupingBarModule.alignIcon();\n }\n // if (this.chartSettings.showMultiLevelLabels) {\n // this.parent.element.querySelector(\n // \"#\" + this.parent.element.id + \"_chartXAxisMultiLevelLabel0\").setAttribute('cursor', 'pointer');\n // }\n this.parent.notify(events.contentReady, {});\n this.parent.trigger(events.chartLoaded, args);\n };\n // The commented lines will be utilized once we get the requested requirement(of multi-level labels) from chart team.\n PivotChart.prototype.axisLabelRender = function (args) {\n // if (this.chartSettings.showMultiLevelLabels) {\n // if (args.axis.name === 'primaryXAxis') {\n // args.text = '';\n // }\n // }\n this.parent.trigger(events.chartAxisLabelRender, args);\n };\n PivotChart.prototype.load = function (args) {\n if (args.chart.zoomModule) {\n args.chart.zoomModule.isZoomed = true;\n }\n this.parent.trigger(events.chartLoad, args);\n };\n PivotChart.prototype.resized = function (args) {\n args.chart.primaryXAxis.zoomFactor = this.getZoomFactor();\n this.parent.trigger(events.chartResized, args);\n };\n /**\n * To destroy the chart module\n * @returns void\n * @hidden\n */\n /* tslint:disable:no-empty */\n PivotChart.prototype.destroy = function () {\n };\n return PivotChart;\n}());\nexport { PivotChart };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty, Event, Complex, Collection } from '@syncfusion/ej2-base';\nimport { Border, ErrorBarSettings } from '@syncfusion/ej2-charts';\nimport { Trendline, EmptyPointSettings } from '@syncfusion/ej2-charts';\nimport { CornerRadius, ChartSegment, Animation } from '@syncfusion/ej2-charts';\nimport { Theme, Font, Margin } from '@syncfusion/ej2-charts';\nimport { ChartArea, CrosshairSettings } from '@syncfusion/ej2-charts';\nimport { Indexes } from '@syncfusion/ej2-charts';\nimport { MajorTickLines, MinorTickLines, MajorGridLines } from '@syncfusion/ej2-charts';\nimport { MarkerSettings } from '@syncfusion/ej2-charts';\nimport { MinorGridLines, AxisLine, StripLineSettings, LabelBorder } from '@syncfusion/ej2-charts';\nimport { CrosshairTooltip } from '@syncfusion/ej2-charts';\n/**\n * Configures the series in charts.\n */\nvar PivotSeries = /** @class */ (function (_super) {\n __extends(PivotSeries, _super);\n function PivotSeries() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], PivotSeries.prototype, \"fill\", void 0);\n __decorate([\n Complex(null, Animation)\n ], PivotSeries.prototype, \"animation\", void 0);\n __decorate([\n Property('0')\n ], PivotSeries.prototype, \"dashArray\", void 0);\n __decorate([\n Property(1)\n ], PivotSeries.prototype, \"width\", void 0);\n __decorate([\n Property('X')\n ], PivotSeries.prototype, \"segmentAxis\", void 0);\n __decorate([\n Property('Line')\n ], PivotSeries.prototype, \"drawType\", void 0);\n __decorate([\n Property(true)\n ], PivotSeries.prototype, \"isClosed\", void 0);\n __decorate([\n Collection([], ChartSegment)\n ], PivotSeries.prototype, \"segments\", void 0);\n __decorate([\n Property('')\n ], PivotSeries.prototype, \"stackingGroup\", void 0);\n __decorate([\n Complex({ color: 'transparent', width: 0 }, Border)\n ], PivotSeries.prototype, \"border\", void 0);\n __decorate([\n Property(true)\n ], PivotSeries.prototype, \"visible\", void 0);\n __decorate([\n Property(1)\n ], PivotSeries.prototype, \"opacity\", void 0);\n __decorate([\n Property('Line')\n ], PivotSeries.prototype, \"type\", void 0);\n __decorate([\n Complex(null, MarkerSettings)\n ], PivotSeries.prototype, \"marker\", void 0);\n __decorate([\n Complex(null, ErrorBarSettings)\n ], PivotSeries.prototype, \"errorBar\", void 0);\n __decorate([\n Property(true)\n ], PivotSeries.prototype, \"enableTooltip\", void 0);\n __decorate([\n Collection([], Trendline)\n ], PivotSeries.prototype, \"trendlines\", void 0);\n __decorate([\n Property('')\n ], PivotSeries.prototype, \"tooltipMappingName\", void 0);\n __decorate([\n Property('SeriesType')\n ], PivotSeries.prototype, \"legendShape\", void 0);\n __decorate([\n Property(1)\n ], PivotSeries.prototype, \"minRadius\", void 0);\n __decorate([\n Property(null)\n ], PivotSeries.prototype, \"selectionStyle\", void 0);\n __decorate([\n Property('Natural')\n ], PivotSeries.prototype, \"splineType\", void 0);\n __decorate([\n Property(3)\n ], PivotSeries.prototype, \"maxRadius\", void 0);\n __decorate([\n Property(0.5)\n ], PivotSeries.prototype, \"cardinalSplineTension\", void 0);\n __decorate([\n Property(null)\n ], PivotSeries.prototype, \"columnWidth\", void 0);\n __decorate([\n Complex(null, EmptyPointSettings)\n ], PivotSeries.prototype, \"emptyPointSettings\", void 0);\n __decorate([\n Complex(null, CornerRadius)\n ], PivotSeries.prototype, \"cornerRadius\", void 0);\n __decorate([\n Property(0)\n ], PivotSeries.prototype, \"columnSpacing\", void 0);\n return PivotSeries;\n}(ChildProperty));\nexport { PivotSeries };\n/**\n * Configures the axes in charts.\n */\nvar PivotAxis = /** @class */ (function (_super) {\n __extends(PivotAxis, _super);\n function PivotAxis() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Rotate45')\n ], PivotAxis.prototype, \"labelIntersectAction\", void 0);\n __decorate([\n Complex(Theme.axisLabelFont, Font)\n ], PivotAxis.prototype, \"labelStyle\", void 0);\n __decorate([\n Property('')\n ], PivotAxis.prototype, \"title\", void 0);\n __decorate([\n Complex({}, CrosshairTooltip)\n ], PivotAxis.prototype, \"crosshairTooltip\", void 0);\n __decorate([\n Property('')\n ], PivotAxis.prototype, \"labelFormat\", void 0);\n __decorate([\n Complex(Theme.axisTitleFont, Font)\n ], PivotAxis.prototype, \"titleStyle\", void 0);\n __decorate([\n Property(false)\n ], PivotAxis.prototype, \"isIndexed\", void 0);\n __decorate([\n Property(0)\n ], PivotAxis.prototype, \"plotOffset\", void 0);\n __decorate([\n Property('None')\n ], PivotAxis.prototype, \"edgeLabelPlacement\", void 0);\n __decorate([\n Property('BetweenTicks')\n ], PivotAxis.prototype, \"labelPlacement\", void 0);\n __decorate([\n Property('Outside')\n ], PivotAxis.prototype, \"tickPosition\", void 0);\n __decorate([\n Property(false)\n ], PivotAxis.prototype, \"opposedPosition\", void 0);\n __decorate([\n Property(true)\n ], PivotAxis.prototype, \"visible\", void 0);\n __decorate([\n Property('Outside')\n ], PivotAxis.prototype, \"labelPosition\", void 0);\n __decorate([\n Property(0)\n ], PivotAxis.prototype, \"labelRotation\", void 0);\n __decorate([\n Property(0)\n ], PivotAxis.prototype, \"minorTicksPerInterval\", void 0);\n __decorate([\n Property(null)\n ], PivotAxis.prototype, \"maximum\", void 0);\n __decorate([\n Property(null)\n ], PivotAxis.prototype, \"minimum\", void 0);\n __decorate([\n Property(34)\n ], PivotAxis.prototype, \"maximumLabelWidth\", void 0);\n __decorate([\n Property(null)\n ], PivotAxis.prototype, \"interval\", void 0);\n __decorate([\n Complex({}, MajorTickLines)\n ], PivotAxis.prototype, \"majorTickLines\", void 0);\n __decorate([\n Property(false)\n ], PivotAxis.prototype, \"enableTrim\", void 0);\n __decorate([\n Complex({}, MajorGridLines)\n ], PivotAxis.prototype, \"majorGridLines\", void 0);\n __decorate([\n Complex({}, MinorTickLines)\n ], PivotAxis.prototype, \"minorTickLines\", void 0);\n __decorate([\n Complex({}, AxisLine)\n ], PivotAxis.prototype, \"lineStyle\", void 0);\n __decorate([\n Complex({}, MinorGridLines)\n ], PivotAxis.prototype, \"minorGridLines\", void 0);\n __decorate([\n Property(false)\n ], PivotAxis.prototype, \"isInversed\", void 0);\n __decorate([\n Property(null)\n ], PivotAxis.prototype, \"description\", void 0);\n __decorate([\n Property(0)\n ], PivotAxis.prototype, \"startAngle\", void 0);\n __decorate([\n Property(100)\n ], PivotAxis.prototype, \"coefficient\", void 0);\n __decorate([\n Collection([], StripLineSettings)\n ], PivotAxis.prototype, \"stripLines\", void 0);\n __decorate([\n Property(2)\n ], PivotAxis.prototype, \"tabIndex\", void 0);\n __decorate([\n Complex({ color: null, width: 0, type: 'Rectangle' }, LabelBorder)\n ], PivotAxis.prototype, \"border\", void 0);\n return PivotAxis;\n}(ChildProperty));\nexport { PivotAxis };\n/**\n * Configures the ToolTips in the chart.\n */\nvar PivotTooltipSettings = /** @class */ (function (_super) {\n __extends(PivotTooltipSettings, _super);\n function PivotTooltipSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], PivotTooltipSettings.prototype, \"enableMarker\", void 0);\n __decorate([\n Property(true)\n ], PivotTooltipSettings.prototype, \"enable\", void 0);\n __decorate([\n Property(null)\n ], PivotTooltipSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(false)\n ], PivotTooltipSettings.prototype, \"shared\", void 0);\n __decorate([\n Property(0.75)\n ], PivotTooltipSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property(null)\n ], PivotTooltipSettings.prototype, \"header\", void 0);\n __decorate([\n Property(null)\n ], PivotTooltipSettings.prototype, \"format\", void 0);\n __decorate([\n Complex(Theme.tooltipLabelFont, Font)\n ], PivotTooltipSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property(null)\n ], PivotTooltipSettings.prototype, \"template\", void 0);\n __decorate([\n Complex({ color: '#cccccc', width: 0.5 }, Border)\n ], PivotTooltipSettings.prototype, \"border\", void 0);\n __decorate([\n Property(true)\n ], PivotTooltipSettings.prototype, \"enableAnimation\", void 0);\n return PivotTooltipSettings;\n}(ChildProperty));\nexport { PivotTooltipSettings };\n/**\n * Configures the zooming behavior for the chart.\n */\nvar PivotZoomSettings = /** @class */ (function (_super) {\n __extends(PivotZoomSettings, _super);\n function PivotZoomSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], PivotZoomSettings.prototype, \"enablePinchZooming\", void 0);\n __decorate([\n Property(true)\n ], PivotZoomSettings.prototype, \"enableSelectionZooming\", void 0);\n __decorate([\n Property(false)\n ], PivotZoomSettings.prototype, \"enableDeferredZooming\", void 0);\n __decorate([\n Property(false)\n ], PivotZoomSettings.prototype, \"enableMouseWheelZooming\", void 0);\n __decorate([\n Property('XY')\n ], PivotZoomSettings.prototype, \"mode\", void 0);\n __decorate([\n Property(['Zoom', 'ZoomIn', 'ZoomOut', 'Pan', 'Reset'])\n ], PivotZoomSettings.prototype, \"toolbarItems\", void 0);\n __decorate([\n Property(true)\n ], PivotZoomSettings.prototype, \"enableScrollbar\", void 0);\n __decorate([\n Property(false)\n ], PivotZoomSettings.prototype, \"enablePan\", void 0);\n return PivotZoomSettings;\n}(ChildProperty));\nexport { PivotZoomSettings };\n/**\n * Configures the chart settings.\n */\nvar ChartSettings = /** @class */ (function (_super) {\n __extends(ChartSettings, _super);\n function ChartSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Complex({}, PivotSeries)\n ], ChartSettings.prototype, \"chartSeries\", void 0);\n __decorate([\n Complex({}, PivotAxis)\n ], ChartSettings.prototype, \"primaryXAxis\", void 0);\n __decorate([\n Complex({}, PivotAxis)\n ], ChartSettings.prototype, \"primaryYAxis\", void 0);\n __decorate([\n Property('')\n ], ChartSettings.prototype, \"value\", void 0);\n __decorate([\n Property(false)\n ], ChartSettings.prototype, \"enableMultiAxis\", void 0);\n __decorate([\n Complex(Theme.chartTitleFont, Font)\n ], ChartSettings.prototype, \"titleStyle\", void 0);\n __decorate([\n Property('')\n ], ChartSettings.prototype, \"title\", void 0);\n __decorate([\n Complex(Theme.chartSubTitleFont, Font)\n ], ChartSettings.prototype, \"subTitleStyle\", void 0);\n __decorate([\n Property('')\n ], ChartSettings.prototype, \"subTitle\", void 0);\n __decorate([\n Complex({ color: '#DDDDDD', width: 0 }, Border)\n ], ChartSettings.prototype, \"border\", void 0);\n __decorate([\n Complex({}, Margin)\n ], ChartSettings.prototype, \"margin\", void 0);\n __decorate([\n Complex({ border: { color: null, width: 0.5 }, background: 'transparent' }, ChartArea)\n ], ChartSettings.prototype, \"chartArea\", void 0);\n __decorate([\n Property(null)\n ], ChartSettings.prototype, \"background\", void 0);\n __decorate([\n Property('Material')\n ], ChartSettings.prototype, \"theme\", void 0);\n __decorate([\n Property([])\n ], ChartSettings.prototype, \"palettes\", void 0);\n __decorate([\n Complex({}, CrosshairSettings)\n ], ChartSettings.prototype, \"crosshair\", void 0);\n __decorate([\n Complex({}, PivotTooltipSettings)\n ], ChartSettings.prototype, \"tooltip\", void 0);\n __decorate([\n Complex({}, PivotZoomSettings)\n ], ChartSettings.prototype, \"zoomSettings\", void 0);\n __decorate([\n Property()\n ], ChartSettings.prototype, \"legendSettings\", void 0);\n __decorate([\n Property('None')\n ], ChartSettings.prototype, \"selectionMode\", void 0);\n __decorate([\n Property(true)\n ], ChartSettings.prototype, \"enableExport\", void 0);\n __decorate([\n Property(false)\n ], ChartSettings.prototype, \"isMultiSelect\", void 0);\n __decorate([\n Collection([], Indexes)\n ], ChartSettings.prototype, \"selectedDataIndexes\", void 0);\n __decorate([\n Property(true)\n ], ChartSettings.prototype, \"enableAnimation\", void 0);\n __decorate([\n Property(false)\n ], ChartSettings.prototype, \"isTransposed\", void 0);\n __decorate([\n Property(1)\n ], ChartSettings.prototype, \"tabIndex\", void 0);\n __decorate([\n Property(null)\n ], ChartSettings.prototype, \"description\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"resized\", void 0);\n __decorate([\n Property(true)\n ], ChartSettings.prototype, \"enableSideBySidePlacement\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"loaded\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"beforePrint\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"animationComplete\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"load\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"textRender\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"legendRender\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"seriesRender\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"pointRender\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"tooltipRender\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"axisLabelRender\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"chartMouseClick\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"chartMouseMove\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"pointMove\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"pointClick\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"chartMouseDown\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"chartMouseLeave\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"dragComplete\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"chartMouseUp\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"scrollStart\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"zoomComplete\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"scrollChanged\", void 0);\n __decorate([\n Event()\n ], ChartSettings.prototype, \"scrollEnd\", void 0);\n return ChartSettings;\n}(ChildProperty));\nexport { ChartSettings };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, Browser, Component, createElement, setStyleAttribute, setCurrencyCode } from '@syncfusion/ej2-base';\nimport { EventHandler, Complex, extend, ChildProperty, Collection, isNullOrUndefined, remove } from '@syncfusion/ej2-base';\nimport { Internationalization, L10n, NotifyPropertyChanges, compile } from '@syncfusion/ej2-base';\nimport { removeClass, addClass, Event } from '@syncfusion/ej2-base';\nimport { PivotEngine } from '../../base/engine';\nimport { Tooltip, createSpinner, showSpinner, hideSpinner } from '@syncfusion/ej2-popups';\nimport * as events from '../../common/base/constant';\nimport * as cls from '../../common/base/css-constant';\nimport { Render } from '../renderer/render';\nimport { DataSource } from '../model/dataSource';\nimport { GridSettings } from '../model/gridsettings';\nimport { Grid, Reorder, Resize } from '@syncfusion/ej2-grids';\nimport { ExcelExport } from '../actions/excel-export';\nimport { PDFExport } from '../actions/pdf-export';\nimport { KeyboardInteraction } from '../actions/keyboard';\nimport { PivotContextMenu } from '../../common/popups/context-menu';\nimport { DataManager, Query } from '@syncfusion/ej2-data';\nimport { VirtualScroll } from '../actions/virtualscroll';\nimport { DrillThrough } from '../actions/drill-through';\nimport { PivotUtil } from '../../base/util';\nimport { PivotChart } from '../../pivotchart/index';\nimport { ChartSettings } from '../model/chartsettings';\n/**\n * It holds the settings of Grouping Bar.\n */\nvar GroupingBarSettings = /** @class */ (function (_super) {\n __extends(GroupingBarSettings, _super);\n function GroupingBarSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], GroupingBarSettings.prototype, \"showFilterIcon\", void 0);\n __decorate([\n Property(true)\n ], GroupingBarSettings.prototype, \"showSortIcon\", void 0);\n __decorate([\n Property(true)\n ], GroupingBarSettings.prototype, \"showRemoveIcon\", void 0);\n __decorate([\n Property(true)\n ], GroupingBarSettings.prototype, \"showValueTypeIcon\", void 0);\n __decorate([\n Property('Both')\n ], GroupingBarSettings.prototype, \"displayMode\", void 0);\n __decorate([\n Property(true)\n ], GroupingBarSettings.prototype, \"allowDragAndDrop\", void 0);\n return GroupingBarSettings;\n}(ChildProperty));\nexport { GroupingBarSettings };\n/**\n * Configures the edit behavior of the Grid.\n */\nvar CellEditSettings = /** @class */ (function (_super) {\n __extends(CellEditSettings, _super);\n function CellEditSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], CellEditSettings.prototype, \"allowAdding\", void 0);\n __decorate([\n Property(false)\n ], CellEditSettings.prototype, \"allowEditing\", void 0);\n __decorate([\n Property(false)\n ], CellEditSettings.prototype, \"allowDeleting\", void 0);\n __decorate([\n Property(false)\n ], CellEditSettings.prototype, \"allowCommandColumns\", void 0);\n __decorate([\n Property('Normal')\n ], CellEditSettings.prototype, \"mode\", void 0);\n __decorate([\n Property(true)\n ], CellEditSettings.prototype, \"allowEditOnDblClick\", void 0);\n __decorate([\n Property(true)\n ], CellEditSettings.prototype, \"showConfirmDialog\", void 0);\n __decorate([\n Property(false)\n ], CellEditSettings.prototype, \"showDeleteConfirmDialog\", void 0);\n return CellEditSettings;\n}(ChildProperty));\nexport { CellEditSettings };\n/**\n * Configures the conditional based hyper link settings.\n */\nvar ConditionalSettings = /** @class */ (function (_super) {\n __extends(ConditionalSettings, _super);\n function ConditionalSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], ConditionalSettings.prototype, \"measure\", void 0);\n __decorate([\n Property()\n ], ConditionalSettings.prototype, \"label\", void 0);\n __decorate([\n Property('NotEquals')\n ], ConditionalSettings.prototype, \"conditions\", void 0);\n __decorate([\n Property()\n ], ConditionalSettings.prototype, \"value1\", void 0);\n __decorate([\n Property()\n ], ConditionalSettings.prototype, \"value2\", void 0);\n return ConditionalSettings;\n}(ChildProperty));\nexport { ConditionalSettings };\n/**\n * It holds the settings of Hyperlink.\n */\nvar HyperlinkSettings = /** @class */ (function (_super) {\n __extends(HyperlinkSettings, _super);\n function HyperlinkSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], HyperlinkSettings.prototype, \"showHyperlink\", void 0);\n __decorate([\n Property(false)\n ], HyperlinkSettings.prototype, \"showRowHeaderHyperlink\", void 0);\n __decorate([\n Property(false)\n ], HyperlinkSettings.prototype, \"showColumnHeaderHyperlink\", void 0);\n __decorate([\n Property(false)\n ], HyperlinkSettings.prototype, \"showValueCellHyperlink\", void 0);\n __decorate([\n Property(false)\n ], HyperlinkSettings.prototype, \"showSummaryCellHyperlink\", void 0);\n __decorate([\n Collection([], ConditionalSettings)\n ], HyperlinkSettings.prototype, \"conditionalSettings\", void 0);\n __decorate([\n Property()\n ], HyperlinkSettings.prototype, \"headerText\", void 0);\n __decorate([\n Property('')\n ], HyperlinkSettings.prototype, \"cssClass\", void 0);\n return HyperlinkSettings;\n}(ChildProperty));\nexport { HyperlinkSettings };\n/**\n * It holds the option for configure the chart and grid view.\n */\nvar DisplayOption = /** @class */ (function (_super) {\n __extends(DisplayOption, _super);\n function DisplayOption() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Table')\n ], DisplayOption.prototype, \"view\", void 0);\n __decorate([\n Property('Table')\n ], DisplayOption.prototype, \"primary\", void 0);\n return DisplayOption;\n}(ChildProperty));\nexport { DisplayOption };\n/**\n * Represents the PivotView component.\n * ```html\n * \n * \n * ```\n */\nvar PivotView = /** @class */ (function (_super) {\n __extends(PivotView, _super);\n /**\n * Constructor for creating the widget\n * @param {PivotViewModel} options?\n * @param {string|HTMLElement} element?\n */\n function PivotView(options, element) {\n var _this_1 = _super.call(this, options, element) || this;\n /** @hidden */\n _this_1.verticalScrollScale = 1;\n /** @hidden */\n _this_1.horizontalScrollScale = 1;\n /** @hidden */\n _this_1.scrollerBrowserLimit = 500000;\n /** @hidden */\n _this_1.lastSortInfo = {};\n /** @hidden */\n _this_1.lastFilterInfo = {};\n /** @hidden */\n _this_1.lastAggregationInfo = {};\n /** @hidden */\n _this_1.lastCalcFieldInfo = {};\n _this_1.shiftLockedPos = [];\n _this_1.savedSelectedCellsPos = [];\n _this_1.isPopupClicked = false;\n _this_1.isMouseDown = false;\n _this_1.isMouseUp = false;\n _this_1.defaultItems = {};\n _this_1.isCellBoxMultiSelection = false;\n /** @hidden */\n _this_1.gridHeaderCellInfo = [];\n /** @hidden */\n _this_1.rowRangeSelection = { enable: false, startIndex: 0, endIndex: 0 };\n /** @hidden */\n _this_1.resizeInfo = {};\n /** @hidden */\n _this_1.scrollPosObject = {\n vertical: 0, horizontal: 0, verticalSection: 0,\n horizontalSection: 0, top: 0, left: 0, scrollDirection: { direction: '', position: 0 }\n };\n /** @hidden */\n _this_1.pivotColumns = [];\n /** @hidden */\n _this_1.totColWidth = 0;\n /** @hidden */\n _this_1.posCount = 0;\n /** @hidden */\n _this_1.isModified = false;\n _this_1.needsID = true;\n _this_1.pivotView = _this_1;\n _this_1.engineModule = new PivotEngine();\n return _this_1;\n }\n PivotView_1 = PivotView;\n /**\n * To provide the array of modules needed for control rendering\n * @return {ModuleDeclaration[]}\n * @hidden\n */\n PivotView.prototype.requiredModules = function () {\n var modules = [];\n var isCommonRequire;\n if (this.allowConditionalFormatting) {\n modules.push({ args: [this], member: 'conditionalformatting' });\n }\n if (this.allowCalculatedField) {\n isCommonRequire = true;\n modules.push({ args: [this], member: 'calculatedfield' });\n }\n if (this.showGroupingBar) {\n isCommonRequire = true;\n modules.push({ args: [this], member: 'grouping' });\n }\n if (this.showToolbar && this.toolbar.length > 0) {\n isCommonRequire = true;\n modules.push({ args: [this], member: 'toolbar' });\n }\n if (this.showFieldList) {\n isCommonRequire = true;\n modules.push({ args: [this], member: 'fieldlist' });\n }\n if (this.allowExcelExport) {\n modules.push({ args: [this], member: 'excelExport' });\n }\n if (this.allowPdfExport) {\n modules.push({ args: [this], member: 'pdfExport' });\n }\n if (this.enableVirtualization) {\n modules.push({ args: [this], member: 'virtualscroll' });\n }\n if (this.gridSettings) {\n if (this.gridSettings.contextMenuItems) {\n isCommonRequire = true;\n }\n }\n if (isCommonRequire) {\n modules.push({ args: [this], member: 'common' });\n }\n return modules;\n };\n /**\n * For internal use only - Initializing internal properties;\n * @private\n */\n PivotView.prototype.preRender = function () {\n this.initProperties();\n this.isAdaptive = Browser.isDevice;\n this.renderToolTip();\n this.renderContextMenu();\n this.keyboardModule = new KeyboardInteraction(this);\n this.contextMenuModule = new PivotContextMenu(this);\n this.globalize = new Internationalization(this.locale);\n this.defaultLocale = {\n grandTotal: 'Grand Total',\n total: 'Total',\n value: 'Value',\n noValue: 'No value',\n row: 'Row',\n column: 'Column',\n collapse: 'Collapse',\n expand: 'Expand',\n rowAxisPrompt: 'Drop row here',\n columnAxisPrompt: 'Drop column here',\n valueAxisPrompt: 'Drop value here',\n filterAxisPrompt: 'Drop filter here',\n filter: 'Filter',\n filtered: 'Filtered',\n sort: 'Sort',\n filters: 'Filters',\n rows: 'Rows',\n columns: 'Columns',\n values: 'Values',\n close: 'Close',\n cancel: 'Cancel',\n delete: 'Delete',\n calculatedField: 'Calculated Field',\n createCalculatedField: 'Create Calculated Field',\n fieldName: 'Enter the field name',\n error: 'Error',\n invalidFormula: 'Invalid formula.',\n dropText: 'Example: (\"Sum(Order_Count)\" + \"Sum(In_Stock)\") * 250',\n dropTextMobile: 'Add fields and edit formula here.',\n dropAction: 'Calculated field cannot be place in any other region except value axis.',\n alert: 'Alert',\n warning: 'Warning',\n ok: 'OK',\n search: 'Search',\n drag: 'Drag',\n remove: 'Remove',\n sum: 'Sum',\n average: 'Average',\n count: 'Count',\n min: 'Min',\n max: 'Max',\n allFields: 'All Fields',\n formula: 'Formula',\n addToRow: 'Add to Row',\n addToColumn: 'Add to Column',\n addToValue: 'Add to Value',\n addToFilter: 'Add to Filter',\n emptyData: 'No records to display',\n fieldExist: 'A field already exists in this name. Please enter a different name.',\n confirmText: 'A calculation field already exists in this name. Do you want to replace it?',\n noMatches: 'No matches',\n format: 'Summaries values by',\n edit: 'Edit',\n clear: 'Clear',\n formulaField: 'Drag and drop fields to formula',\n dragField: 'Drag field to formula',\n clearFilter: 'Clear',\n by: 'by',\n all: 'All',\n multipleItems: 'Multiple items',\n /* tslint:disable */\n member: 'Member',\n label: 'Label',\n date: 'Date',\n enterValue: 'Enter value',\n chooseDate: 'Enter date',\n Before: 'Before',\n BeforeOrEqualTo: 'Before Or Equal To',\n After: 'After',\n AfterOrEqualTo: 'After Or Equal To',\n labelTextContent: 'Show the items for which the label',\n dateTextContent: 'Show the items for which the date',\n valueTextContent: 'Show the items for which',\n Equals: 'Equals',\n DoesNotEquals: 'Does Not Equal',\n BeginWith: 'Begins With',\n DoesNotBeginWith: 'Does Not Begin With',\n EndsWith: 'Ends With',\n DoesNotEndsWith: 'Does Not End With',\n Contains: 'Contains',\n DoesNotContains: 'Does Not Contain',\n GreaterThan: 'Greater Than',\n GreaterThanOrEqualTo: 'Greater Than Or Equal To',\n LessThan: 'Less Than',\n LessThanOrEqualTo: 'Less Than Or Equal To',\n Between: 'Between',\n NotBetween: 'Not Between',\n And: 'and',\n Sum: 'Sum',\n Count: 'Count',\n DistinctCount: 'Distinct Count',\n Product: 'Product',\n Avg: 'Avg',\n Min: 'Min',\n SampleVar: 'Sample Var',\n PopulationVar: 'Population Var',\n RunningTotals: 'Running Totals',\n Max: 'Max',\n Index: 'Index',\n SampleStDev: 'Sample StDev',\n PopulationStDev: 'Population StDev',\n PercentageOfRowTotal: '% of Row Total',\n PercentageOfParentTotal: '% of Parent Total',\n PercentageOfParentColumnTotal: '% of Parent Column Total',\n PercentageOfParentRowTotal: '% of Parent Row Total',\n DifferenceFrom: 'Difference From',\n PercentageOfDifferenceFrom: '% of Difference From',\n PercentageOfGrandTotal: '% of Grand Total',\n PercentageOfColumnTotal: '% of Column Total',\n /* tslint:enable */\n NotEquals: 'Not Equals',\n AllValues: 'All Values',\n conditionalFormating: 'Conditional Formatting',\n apply: 'APPLY',\n condition: 'Add Condition',\n formatLabel: 'Format',\n valueFieldSettings: 'Value field settings',\n baseField: 'Base field :',\n baseItem: 'Base item :',\n summarizeValuesBy: 'Summarize values by :',\n sourceName: 'Field name :',\n sourceCaption: 'Field caption :',\n example: 'e.g:',\n editorDataLimitMsg: ' more items. Search to refine further.',\n details: 'Details',\n manageRecords: 'Manage Records',\n Years: 'Years',\n Quarters: 'Quarters',\n Months: 'Months',\n Days: 'Days',\n Hours: 'Hours',\n Minutes: 'Minutes',\n Seconds: 'Seconds',\n save: 'Save a report',\n new: 'Create a new report',\n load: 'Load',\n saveAs: 'Save as current report',\n rename: 'Rename a current report',\n deleteReport: 'Delete a current report',\n export: 'Export',\n subTotals: 'Sub totals',\n grandTotals: 'Grand totals',\n reportName: 'Report Name :',\n pdf: 'PDF',\n excel: 'Excel',\n csv: 'CSV',\n showSubTotals: 'Show sub totals',\n doNotShowSubTotals: 'Do not show sub totals',\n showSubTotalsRowsOnly: 'Show sub totals rows only',\n showSubTotalsColumnsOnly: 'Show sub totals columns only',\n showGrandTotals: 'Show grand totals',\n doNotShowGrandTotals: 'Do not show grand totals',\n showGrandTotalsRowsOnly: 'Show grand totals rows only',\n showGrandTotalsColumnsOnly: 'Show grand totals columns only',\n fieldList: 'Show fieldlist',\n grid: 'Show table',\n toolbarFormatting: 'Conditional formatting',\n chart: 'Chart',\n reportMsg: 'Please enter vaild report name!!!',\n reportList: 'Report list',\n removeConfirm: 'Are you sure want to delete this report?',\n emptyReport: 'No reports found!!',\n bar: 'Bar',\n line: 'Line',\n area: 'Area',\n scatter: 'Scatter',\n polar: 'Polar',\n of: 'of',\n emptyFormat: 'No format found!!!',\n emptyInput: 'Enter a value',\n newReportConfirm: 'Want to save changes to report?',\n emptyReportName: 'Enter a report name'\n };\n this.localeObj = new L10n(this.getModuleName(), this.defaultLocale, this.locale);\n this.isDragging = false;\n this.addInternalEvents();\n setCurrencyCode(this.currencyCode);\n };\n PivotView.prototype.onBeforeTooltipOpen = function (args) {\n args.element.classList.add('e-pivottooltipwrap');\n };\n PivotView.prototype.renderToolTip = function () {\n if (this.showTooltip) {\n this.tooltip = new Tooltip({\n target: 'td.e-valuescontent',\n showTipPointer: false,\n enableRtl: this.enableRtl,\n beforeRender: this.setToolTip.bind(this),\n beforeOpen: this.onBeforeTooltipOpen\n });\n this.tooltip.appendTo(this.element);\n }\n else if (this.tooltip) {\n this.tooltip.destroy();\n }\n };\n /** @hidden */\n PivotView.prototype.renderContextMenu = function () {\n if (this.gridSettings.contextMenuItems) {\n var conmenuItems = [];\n var customItems = [];\n var exportItems = [];\n var aggItems = [];\n var expItems = [];\n var aggregateItems = [];\n for (var _i = 0, _a = this.gridSettings.contextMenuItems; _i < _a.length; _i++) {\n var item = _a[_i];\n if (typeof item === 'string' && this.getDefaultItems().indexOf(item) !== -1) {\n if (item.toString().toLowerCase().indexOf('aggregate') !== -1) {\n aggregateItems = [\n { text: 'Sum', id: 'AggSum' },\n { text: 'Distinct Count', id: 'AggDistinctCount' },\n { text: 'Count', id: 'AggCount' },\n { text: 'Product', id: 'AggProduct' },\n { text: 'Avg', id: 'AggAvg' },\n { text: 'Max', id: 'AggMax' },\n { text: 'Min', id: 'AggMin' },\n { text: 'More...', id: 'AggMoreOption' }\n ];\n }\n else if (item.toString().toLowerCase().indexOf('export') !== -1) {\n exportItems.push(this.buildDefaultItems(item));\n }\n else {\n conmenuItems.push(this.buildDefaultItems(item));\n }\n }\n else if (typeof item !== 'string') {\n customItems.push(item);\n }\n }\n if (aggregateItems.length > 0) {\n var aggregateGroup = this.buildDefaultItems('Aggregate');\n aggregateGroup.items = aggregateItems;\n aggItems.push(aggregateGroup);\n }\n if (exportItems.length > 0) {\n var exportGroupItems = this.buildDefaultItems('export');\n exportGroupItems.items = exportItems;\n expItems.push(exportGroupItems);\n }\n this.gridSettings.contextMenuItems = [];\n Array.prototype.push.apply(this.gridSettings.contextMenuItems, aggItems);\n Array.prototype.push.apply(this.gridSettings.contextMenuItems, conmenuItems);\n Array.prototype.push.apply(this.gridSettings.contextMenuItems, expItems);\n Array.prototype.push.apply(this.gridSettings.contextMenuItems, customItems);\n }\n };\n PivotView.prototype.getDefaultItems = function () {\n return ['Drillthrough', 'Expand',\n 'Collapse', 'Pdf Export', 'Excel Export', 'Csv Export', 'Sort Ascending', 'Sort Descending',\n 'Aggregate', 'CalculatedField'];\n };\n PivotView.prototype.buildDefaultItems = function (item) {\n var menuItem;\n switch (item) {\n case 'Aggregate':\n menuItem = { text: 'Aggregate', target: 'th.e-valuesheader,td.e-valuescontent,.e-stot', id: 'aggregate' };\n break;\n case 'CalculatedField':\n menuItem = { text: 'Calculated Field', target: 'td.e-valuescontent', id: 'CalculatedField' };\n break;\n case 'Drillthrough':\n menuItem = {\n text: 'Drill Through', target: 'td.e-valuescontent',\n id: 'drillthrough', iconCss: cls.PIVOTVIEW_GRID + ' ' + cls.ICON\n };\n break;\n case 'export':\n menuItem = {\n text: 'Export', target: 'td.e-valuescontent',\n id: 'exporting', iconCss: cls.PIVOTVIEW_EXPORT + ' ' + cls.ICON\n };\n break;\n case 'Pdf Export':\n menuItem = { text: 'PDF', id: 'pdf', iconCss: cls.GRID_PDF_EXPORT + ' ' + cls.ICON };\n break;\n case 'Excel Export':\n menuItem = { text: 'Excel', id: 'excel', iconCss: cls.GRID_EXCEL_EXPORT + ' ' + cls.ICON };\n break;\n case 'Csv Export':\n menuItem = { text: 'CSV', id: 'csv', iconCss: cls.GRID_CSV_EXPORT + ' ' + cls.ICON, };\n break;\n case 'Expand':\n menuItem = {\n text: 'Expand', target: 'td.e-rowsheader,.e-columnsheader',\n id: 'expand', iconCss: cls.PIVOTVIEW_EXPAND + ' ' + cls.ICON\n };\n break;\n case 'Collapse':\n menuItem = {\n text: 'Collapse', target: 'td.e-rowsheader,.e-columnsheader',\n id: 'collapse', iconCss: cls.PIVOTVIEW_COLLAPSE + ' ' + cls.ICON\n };\n break;\n case 'Sort Ascending':\n menuItem = {\n text: 'Ascending', target: 'th.e-valuesheader,.e-stot',\n id: 'sortasc', iconCss: cls.ICON_ASC + ' ' + cls.ICON\n };\n break;\n case 'Sort Descending':\n menuItem = {\n text: 'Descending', target: 'th.e-valuesheader,.e-stot',\n id: 'sortdesc', iconCss: cls.ICON_DESC + ' ' + cls.ICON\n };\n break;\n }\n this.defaultItems[item] = {\n text: menuItem.text, id: menuItem.id,\n target: menuItem.target, iconCss: menuItem.iconCss\n };\n return this.defaultItems[item];\n };\n /* tslint:disable:align */\n PivotView.prototype.initProperties = function () {\n this.setProperties({ pivotValues: [] }, true);\n this.queryCellInfo = this.gridSettings.queryCellInfo ? this.gridSettings.queryCellInfo.bind(this) : undefined;\n this.headerCellInfo = this.gridSettings.headerCellInfo ? this.gridSettings.headerCellInfo.bind(this) : undefined;\n this.resizing = this.gridSettings.resizing ? this.gridSettings.resizing.bind(this) : undefined;\n this.resizeStop = this.gridSettings.resizeStop ? this.gridSettings.resizeStop.bind(this) : undefined;\n this.pdfHeaderQueryCellInfo = this.gridSettings.pdfHeaderQueryCellInfo ?\n this.gridSettings.pdfHeaderQueryCellInfo.bind(this) : undefined;\n this.pdfQueryCellInfo = this.gridSettings.pdfQueryCellInfo ? this.gridSettings.pdfQueryCellInfo.bind(this) : undefined;\n this.excelHeaderQueryCellInfo = this.gridSettings.excelHeaderQueryCellInfo ?\n this.gridSettings.excelHeaderQueryCellInfo.bind(this) : undefined;\n this.excelQueryCellInfo = this.gridSettings.excelQueryCellInfo ?\n this.gridSettings.excelQueryCellInfo.bind(this) : undefined;\n this.columnDragStart = this.gridSettings.columnDragStart ? this.gridSettings.columnDragStart.bind(this) : undefined;\n this.columnDrag = this.gridSettings.columnDrag ? this.gridSettings.columnDrag.bind(this) : undefined;\n this.columnDrop = this.gridSettings.columnDrop ? this.gridSettings.columnDrop.bind(this) : undefined;\n this.beforeColumnsRender = this.gridSettings.columnRender ? this.gridSettings.columnRender : undefined;\n this.selected = this.gridSettings.cellSelected ? this.gridSettings.cellSelected : undefined;\n this.cellDeselected = this.gridSettings.cellDeselected ? this.gridSettings.cellDeselected : undefined;\n this.rowSelected = this.gridSettings.rowSelected ? this.gridSettings.rowSelected : undefined;\n this.rowDeselected = this.gridSettings.rowDeselected ? this.gridSettings.rowDeselected : undefined;\n this.chartTooltipRender = this.chartSettings.tooltipRender ? this.chartSettings.tooltipRender : undefined;\n this.chartLoaded = this.chartSettings.loaded ? this.chartSettings.loaded : undefined;\n this.chartLoad = this.chartSettings.load ? this.chartSettings.load : undefined;\n this.chartResized = this.chartSettings.resized ? this.chartSettings.resized : undefined;\n this.chartAxisLabelRender = this.chartSettings.axisLabelRender ? this.chartSettings.axisLabelRender : undefined;\n this.contextMenuClick = this.gridSettings.contextMenuClick ? this.gridSettings.contextMenuClick : undefined;\n this.contextMenuOpen = this.gridSettings.contextMenuOpen ? this.gridSettings.contextMenuOpen : undefined;\n if (this.gridSettings.rowHeight === null) {\n this.setProperties({ gridSettings: { rowHeight: this.isAdaptive ? 48 : 36 } }, true);\n }\n if (this.enableVirtualization) {\n this.height = (typeof this.height === 'string' && this.height.indexOf('%') === -1) ?\n Number(this.height.split('px')[0]) : this.height;\n this.width = (typeof this.width === 'string' && this.width.indexOf('%') === -1) ?\n Number(this.width.split('px')[0]) : this.width;\n this.height = !isNaN(this.height) ? this.height : 300;\n this.width = !isNaN(this.width) ? this.width : 800;\n }\n if (this.enableVirtualization) {\n var colValues = 1;\n var rowValues = 1;\n if (this.dataSource.valueAxis === 'row') {\n rowValues = this.dataSource.values.length;\n }\n else {\n colValues = this.dataSource.values.length;\n }\n this.pageSettings = {\n columnCurrentPage: 1, rowCurrentPage: 1,\n columnSize: Math.ceil((Math.floor(this.width /\n this.gridSettings.columnWidth) - 1) / colValues),\n rowSize: Math.ceil(Math.floor(this.height / this.gridSettings.rowHeight) / rowValues)\n };\n if (this.allowExcelExport) {\n PivotView_1.Inject(ExcelExport);\n }\n if (this.allowPdfExport) {\n PivotView_1.Inject(PDFExport);\n }\n if (this.editSettings.allowEditing) {\n PivotView_1.Inject(DrillThrough);\n }\n }\n this.isCellBoxMultiSelection = this.gridSettings.allowSelection &&\n this.gridSettings.selectionSettings.cellSelectionMode === 'Box' &&\n this.gridSettings.selectionSettings.mode === 'Cell' && this.gridSettings.selectionSettings.type === 'Multiple';\n if (this.displayOption.view !== 'Table') {\n this.chartModule = new PivotChart();\n }\n this.currentView = this.currentView ? this.currentView : (this.displayOption.view === 'Both' ?\n this.displayOption.primary : this.displayOption.view);\n };\n /**\n * Initialize the control rendering\n * @returns void\n * @hidden\n */\n PivotView.prototype.render = function () {\n this.cellTemplateFn = this.templateParser(this.cellTemplate);\n createSpinner({ target: this.element }, this.createElement);\n this.trigger(events.load, { 'dataSource': this.dataSource });\n this.updateClass();\n this.notify(events.initSubComponent, {});\n this.notify(events.initialLoad, {});\n if (this.isAdaptive) {\n this.contextMenuModule.render();\n }\n this.notify(events.initToolbar, {});\n };\n /**\n * Register the internal events.\n * @returns void\n * @hidden\n */\n PivotView.prototype.addInternalEvents = function () {\n this.on(events.initialLoad, this.generateData, this);\n this.on(events.dataReady, this.renderPivotGrid, this);\n this.on(events.contentReady, this.onContentReady, this);\n };\n /**\n * De-Register the internal events.\n * @returns void\n * @hidden\n */\n PivotView.prototype.removeInternalEvents = function () {\n this.off(events.initialLoad, this.generateData);\n this.off(events.dataReady, this.renderPivotGrid);\n this.off(events.contentReady, this.onContentReady);\n };\n /**\n * Get the Pivot widget properties to be maintained in the persisted state.\n * @returns {string}\n * @hidden\n */\n PivotView.prototype.getPersistData = function () {\n var keyEntity = ['dataSource', 'pivotValues', 'gridSettings', 'chartSettings'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * It returns the Module name.\n * @returns string\n * @hidden\n */\n PivotView.prototype.getModuleName = function () {\n return 'pivotview';\n };\n /**\n * Copy the selected rows or cells data into clipboard.\n * @param {boolean} withHeader - Specifies whether the column header text needs to be copied along with rows or cells.\n * @returns {void}\n * @hidden\n */\n PivotView.prototype.copy = function (withHeader) {\n this.grid.copy(withHeader);\n };\n /**\n * By default, prints all the pages of the Grid and hides the pager.\n * > You can customize print options using the\n * [`printMode`](./api-pivotgrid.html#printmode-string).\n * @returns {void}\n * @hidden\n */\n // public print(): void {\n // this.grid.print();\n // }\n /**\n * Called internally if any of the property value changed.\n * @returns void\n * @hidden\n */\n PivotView.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'dataSource':\n case 'hyperlinkSettings':\n case 'allowDrillThrough':\n case 'editSettings':\n if (newProp.dataSource && newProp.dataSource.groupSettings && newProp.dataSource.groupSettings.length > 0) {\n var groupSettings = extend([], this.dataSource.groupSettings, null, true);\n var data = PivotUtil.getClonedData(this.clonedDataSet);\n var dataSource = extend({}, this.clonedReport, null, true);\n dataSource.data = data;\n dataSource.groupSettings = groupSettings;\n this.setProperties({ dataSource: dataSource }, true);\n }\n this.notify(events.initialLoad, {});\n break;\n case 'pivotValues':\n case 'displayOption':\n this.notify(events.dataReady, {});\n break;\n case 'gridSettings':\n this.renderModule.updateGridSettings();\n this.isCellBoxMultiSelection = this.gridSettings.allowSelection &&\n this.gridSettings.selectionSettings.cellSelectionMode === 'Box' &&\n this.gridSettings.selectionSettings.mode === 'Cell' && this.gridSettings.selectionSettings.type === 'Multiple';\n break;\n case 'chartSettings':\n this.chartModule.loadChart(this, this.chartSettings);\n break;\n case 'locale':\n case 'currencyCode':\n if (this.tooltip) {\n this.tooltip.destroy();\n }\n _super.prototype.refresh.call(this);\n break;\n case 'enableRtl':\n this.notify(events.dataReady, {});\n this.updateClass();\n break;\n case 'groupingBarSettings':\n this.axisFieldModule.render();\n break;\n case 'showTooltip':\n this.renderToolTip();\n break;\n case 'toolbar':\n if (this.toolbarModule) {\n this.toolbarModule.refreshToolbar();\n }\n break;\n }\n }\n };\n PivotView.prototype.templateParser = function (template) {\n if (template) {\n try {\n if (document.querySelectorAll(template).length) {\n return compile(document.querySelector(template).innerHTML.trim());\n }\n }\n catch (error) {\n return compile(template);\n }\n }\n return undefined;\n };\n PivotView.prototype.getCellTemplate = function () {\n return this.cellTemplateFn;\n };\n /**\n * Render the UI section of PivotView.\n * @returns void\n * @hidden\n */\n PivotView.prototype.renderPivotGrid = function () {\n if (this.chartModule) {\n this.chartModule.engineModule = this.engineModule;\n this.chartModule.loadChart(this, this.chartSettings);\n }\n if (this.enableVirtualization) {\n this.virtualscrollModule = new VirtualScroll(this);\n }\n if (this.displayOption.view !== 'Chart') {\n if (this.hyperlinkSettings) {\n this.isRowCellHyperlink = (this.hyperlinkSettings.showRowHeaderHyperlink ?\n true : this.hyperlinkSettings.showHyperlink ? true : false);\n this.isColumnCellHyperlink = (this.hyperlinkSettings.showColumnHeaderHyperlink ?\n true : this.hyperlinkSettings.showHyperlink ? true : false);\n this.isValueCellHyperlink = (this.hyperlinkSettings.showValueCellHyperlink ?\n true : this.hyperlinkSettings.showHyperlink ? true : false);\n this.isSummaryCellHyperlink = (this.hyperlinkSettings.showSummaryCellHyperlink ?\n true : this.hyperlinkSettings.showHyperlink ? true : false);\n this.applyHyperlinkSettings();\n }\n if (this.allowDrillThrough || this.editSettings.allowEditing) {\n this.drillThroughModule = new DrillThrough(this);\n }\n this.renderModule = new Render(this);\n this.renderModule.render();\n }\n else if (this.grid) {\n remove(this.grid.element);\n }\n if (this.showFieldList || this.showGroupingBar) {\n this.notify(events.uiUpdate, this);\n if (this.pivotFieldListModule && this.allowDeferLayoutUpdate) {\n this.pivotFieldListModule.clonedDataSource = extend({}, this.dataSource, null, true);\n }\n if (this.showToolbar && this.showGroupingBar) {\n this.notify(events.initToolbar, this);\n }\n }\n this.trigger(events.dataBound);\n if (this.allowConditionalFormatting) {\n this.applyFormatting();\n }\n if (this.showToolbar) {\n if (this.displayOption.view === 'Both' && this.chart && this.grid) {\n if (this.currentView === 'Table') {\n this.grid.element.style.display = '';\n this.chart.element.style.display = 'none';\n }\n else {\n this.grid.element.style.display = 'none';\n this.chart.element.style.display = '';\n }\n }\n }\n if (this.toolbarModule) {\n if (this.toolbarModule && this.toolbarModule.action !== 'New' && this.toolbarModule.action !== 'Load'\n && this.toolbarModule.action !== 'Remove') {\n this.isModified = true;\n }\n else {\n this.toolbarModule.action = '';\n }\n }\n };\n /**\n * Updates the PivotEngine using dataSource from Pivot View component.\n * @method updateDataSource\n * @return {void}\n * @hidden\n */\n PivotView.prototype.updateDataSource = function (isRefreshGrid) {\n showSpinner(this.element);\n /* tslint:disable:align */\n var customProperties = {\n mode: '',\n savedFieldList: this.engineModule.fieldList,\n pageSettings: this.pageSettings,\n enableValueSorting: this.enableValueSorting,\n isDrillThrough: (this.allowDrillThrough || this.editSettings.allowEditing)\n };\n var isSorted = Object.keys(this.lastSortInfo).length > 0 ? true : false;\n var isFiltered = Object.keys(this.lastFilterInfo).length > 0 ? true : false;\n var isAggChange = Object.keys(this.lastAggregationInfo).length > 0 ? true : false;\n var isCalcChange = Object.keys(this.lastCalcFieldInfo).length > 0 ? true : false;\n if (this.enableVirtualization && (isSorted || isFiltered || isAggChange || isCalcChange)) {\n if (isSorted) {\n this.setProperties({ dataSource: { valueSortSettings: { headerText: '' } } }, true);\n this.engineModule.onSort(this.lastSortInfo);\n this.lastSortInfo = {};\n }\n if (isFiltered) {\n this.engineModule.onFilter(this.lastFilterInfo, this.dataSource);\n this.lastFilterInfo = {};\n }\n if (isAggChange) {\n this.engineModule.onAggregation(this.lastAggregationInfo);\n this.lastAggregationInfo = {};\n }\n if (isCalcChange) {\n this.engineModule.onCalcOperation(this.lastCalcFieldInfo);\n this.lastCalcFieldInfo = {};\n }\n }\n else {\n this.engineModule.renderEngine(this.dataSource, customProperties);\n }\n var eventArgs = {\n dataSource: this.dataSource,\n pivotValues: this.engineModule.pivotValues\n };\n this.trigger(events.enginePopulated, eventArgs);\n this.pivotCommon.engineModule = this.engineModule;\n this.pivotCommon.dataSource = this.dataSource;\n this.setProperties({ pivotValues: this.engineModule.pivotValues }, true);\n this.renderPivotGrid();\n };\n /**\n * To destroy the PivotView elements.\n * @returns void\n */\n PivotView.prototype.destroy = function () {\n this.removeInternalEvents();\n if (this.showGroupingBar && this.groupingBarModule) {\n this.groupingBarModule.destroy();\n }\n if (this.showToolbar && this.toolbarModule) {\n this.toolbarModule.destroy();\n }\n if (this.enableVirtualization && this.virtualscrollModule) {\n this.virtualscrollModule.destroy();\n }\n if (this.allowConditionalFormatting && this.conditionalFormattingModule) {\n this.conditionalFormattingModule.destroy();\n }\n if (this.isAdaptive && this.contextMenuModule) {\n this.contextMenuModule.destroy();\n }\n if (this.keyboardModule) {\n this.keyboardModule.destroy();\n }\n if (this.chart) {\n this.chart.destroy();\n }\n this.unwireEvents();\n removeClass([this.element], cls.ROOT);\n removeClass([this.element], cls.RTL);\n removeClass([this.element], cls.DEVICE);\n this.element.innerHTML = '';\n _super.prototype.destroy.call(this);\n };\n /**\n * Export Pivot widget data to Excel file(.xlsx).\n * @param {ExcelExportProperties} excelExportProperties - Defines the export properties of the Grid.\n * @param {boolean} isMultipleExport - Define to enable multiple export.\n * @param {workbook} workbook - Defines the Workbook if multiple export is enabled.\n * @param {boolean} isBlob - If 'isBlob' set to true, then it will be returned as blob data.\n * @returns void\n */\n /* tslint:disable-next-line:no-any */\n PivotView.prototype.excelExport = function (excelExportProperties, isMultipleExport, workbook, isBlob) {\n if (this.enableVirtualization) {\n this.excelExportModule.exportToExcel('Excel');\n }\n else {\n this.grid.excelExport(excelExportProperties, isMultipleExport, workbook, isBlob);\n }\n };\n /**\n * Export PivotGrid data to CSV file.\n * @param {ExcelExportProperties} excelExportProperties - Defines the export properties of the Grid.\n * @param {boolean} isMultipleExport - Define to enable multiple export.\n * @param {workbook} workbook - Defines the Workbook if multiple export is enabled.\n * @param {boolean} isBlob - If 'isBlob' set to true, then it will be returned as blob data.\n * @returns void\n */\n /* tslint:disable-next-line:no-any */\n PivotView.prototype.csvExport = function (excelExportProperties, isMultipleExport, workbook, isBlob) {\n if (this.enableVirtualization) {\n this.excelExportModule.exportToExcel('CSV');\n }\n else {\n this.grid.csvExport(excelExportProperties, isMultipleExport, workbook, isBlob);\n }\n };\n /**\n * Export Pivot widget data to PDF document.\n * @param {pdfExportProperties} PdfExportProperties - Defines the export properties of the Grid.\n * @param {isMultipleExport} isMultipleExport - Define to enable multiple export.\n * @param {pdfDoc} pdfDoc - Defined the Pdf Document if multiple export is enabled.\n * @param {boolean} isBlob - If 'isBlob' set to true, then it will be returned as blob data.\n * @returns void\n */\n PivotView.prototype.pdfExport = function (pdfExportProperties, isMultipleExport, pdfDoc, isBlob) {\n if (this.enableVirtualization) {\n this.pdfExportModule.exportToPDF();\n }\n else {\n this.grid.pdfExport(pdfExportProperties, isMultipleExport, pdfDoc, isBlob);\n }\n };\n /**\n * Export method for the chart.\n * @param type - Defines the export type.\n * @param fileName - Defines file name of export document.\n * @param orientation - Defines the page orientation on pdf export(0 for Portrait mode, 1 for Landscape mode).\n * @param width - Defines width of the export document.\n * @param height - Defines height of the export document.\n */\n PivotView.prototype.chartExport = function (type, fileName, orientation, width, height) {\n if (this.chart && this.chart.enableExport) {\n this.chart.exportModule.export(type, fileName, orientation, null, width, height);\n }\n };\n /**\n * Print method for the chart.\n */\n PivotView.prototype.printChart = function () {\n if (this.chart) {\n this.chart.print();\n }\n };\n /** @hidden */\n PivotView.prototype.onDrill = function (target) {\n var fieldName = target.parentElement.getAttribute('fieldname');\n var memberName = this.engineModule.pivotValues[Number(target.parentElement.getAttribute('index'))][Number(target.parentElement.getAttribute('aria-colindex'))].actualText;\n this.engineModule.fieldList[fieldName].members[memberName].isDrilled =\n target.classList.contains(cls.COLLAPSE) ? false : true;\n var fieldAvail = false;\n if (this.dataSource.drilledMembers.length === 0) {\n this.setProperties({ dataSource: { drilledMembers: [{ name: fieldName, items: [memberName] }] } }, true);\n }\n else {\n for (var fCnt = 0; fCnt < this.dataSource.drilledMembers.length; fCnt++) {\n var field = this.dataSource.drilledMembers[fCnt];\n if (field.name === fieldName) {\n fieldAvail = true;\n var memIndex = field.items.indexOf(memberName);\n if (memIndex > -1) {\n field.items.splice(memIndex, 1);\n }\n else {\n field.items.push(memberName);\n }\n }\n else {\n continue;\n }\n }\n if (!fieldAvail) {\n this.dataSource.drilledMembers.push({ name: fieldName, items: [memberName] });\n }\n }\n showSpinner(this.element);\n var drilledItem = {\n fieldName: fieldName, memberName: memberName,\n axis: target.parentElement.classList.contains(cls.ROWSHEADER) ? 'row' : 'column',\n action: target.classList.contains(cls.COLLAPSE) ? 'up' : 'down'\n };\n if (this.enableVirtualization) {\n this.engineModule.onDrill(drilledItem);\n }\n else {\n this.engineModule.generateGridData(this.dataSource);\n }\n this.setProperties({ pivotValues: this.engineModule.pivotValues }, true);\n this.renderPivotGrid();\n };\n PivotView.prototype.onContentReady = function () {\n this.isPopupClicked = false;\n if (this.showFieldList) {\n hideSpinner(this.pivotFieldListModule.fieldListSpinnerElement);\n }\n else if (this.fieldListSpinnerElement) {\n hideSpinner(this.fieldListSpinnerElement);\n }\n if (!this.isEmptyGrid) {\n hideSpinner(this.element);\n this.trigger(events.dataBound);\n }\n else {\n this.isEmptyGrid = false;\n }\n if (this.grid) {\n if (this.enableVirtualization && this.engineModule) {\n if (this.element.querySelector('.' + cls.MOVABLECONTENT_DIV) &&\n !this.element.querySelector('.' + cls.MOVABLECONTENT_DIV).querySelector('.' + cls.VIRTUALTRACK_DIV)) {\n this.virtualDiv = createElement('div', { className: cls.VIRTUALTRACK_DIV });\n this.element.querySelector('.' + cls.MOVABLECONTENT_DIV).appendChild(this.virtualDiv);\n }\n if (this.element.querySelector('.' + cls.MOVABLEHEADER_DIV) &&\n !this.element.querySelector('.' + cls.MOVABLEHEADER_DIV).querySelector('.' + cls.VIRTUALTRACK_DIV)) {\n this.virtualHeaderDiv = createElement('div', { className: cls.VIRTUALTRACK_DIV });\n this.element.querySelector('.' + cls.MOVABLEHEADER_DIV).appendChild(this.virtualHeaderDiv);\n }\n else {\n this.virtualHeaderDiv =\n this.element.querySelector('.' + cls.MOVABLEHEADER_DIV).querySelector('.' + cls.VIRTUALTRACK_DIV);\n }\n var movableTable = this.element.querySelector('.' + cls.MOVABLECONTENT_DIV).querySelector('.e-table');\n var vHeight = (this.gridSettings.rowHeight * this.engineModule.rowCount + 0.1 - movableTable.clientHeight);\n if (vHeight > this.scrollerBrowserLimit) {\n this.verticalScrollScale = vHeight / this.scrollerBrowserLimit;\n vHeight = this.scrollerBrowserLimit;\n }\n var vWidth = (this.gridSettings.columnWidth * this.engineModule.columnCount\n - this.grid.columns[0].width);\n if (vWidth > this.scrollerBrowserLimit) {\n this.horizontalScrollScale = vWidth / this.scrollerBrowserLimit;\n vWidth = this.scrollerBrowserLimit;\n }\n setStyleAttribute(this.virtualDiv, {\n height: (vHeight > 0.1 ? vHeight : 0.1) + 'px',\n width: (vWidth > 0.1 ? vWidth : 0.1) + 'px'\n });\n setStyleAttribute(this.virtualHeaderDiv, {\n height: 0, width: (vWidth > 0.1 ? vWidth : 0.1) + 'px'\n });\n var mCnt = this.element.querySelector('.' + cls.MOVABLECONTENT_DIV);\n var fCnt = this.element.querySelector('.' + cls.FROZENCONTENT_DIV);\n var mHdr = this.element.querySelector('.' + cls.MOVABLEHEADER_DIV);\n var verOffset = (mCnt.scrollTop > this.scrollerBrowserLimit) ?\n mCnt.querySelector('.' + cls.TABLE).style.transform.split(',')[1].trim() :\n -(((mCnt.scrollTop * this.verticalScrollScale) - this.scrollPosObject.verticalSection - mCnt.scrollTop)) + 'px)';\n var horiOffset = (mCnt.scrollLeft > this.scrollerBrowserLimit) ?\n (mCnt.querySelector('.' + cls.TABLE).style.transform.split(',')[0].trim() + ',') :\n 'translate(' + -(((mCnt.scrollLeft * this.horizontalScrollScale) -\n this.scrollPosObject.horizontalSection - mCnt.scrollLeft)) + 'px,';\n setStyleAttribute(fCnt.querySelector('.e-table'), {\n transform: 'translate(' + 0 + 'px,' + verOffset\n });\n setStyleAttribute(mCnt.querySelector('.e-table'), {\n transform: horiOffset + verOffset\n });\n setStyleAttribute(mHdr.querySelector('.e-table'), {\n transform: horiOffset + 0 + 'px)'\n });\n }\n if (this.showGroupingBar) {\n this.element.style.minWidth = '400px';\n this.grid.element.style.minWidth = '400px';\n }\n else {\n this.element.style.minWidth = '310px';\n this.grid.element.style.minWidth = '310px';\n }\n this.unwireEvents();\n this.wireEvents();\n }\n this.isChartLoaded = false;\n };\n PivotView.prototype.setToolTip = function (args) {\n var colIndex = Number(args.target.getAttribute('aria-colindex'));\n var rowIndex = Number(args.target.getAttribute('index'));\n var cell = this.pivotValues[rowIndex][colIndex];\n this.tooltip.content = '';\n if (cell) {\n this.tooltip.content = '
' +\n this.localeObj.getConstant('row') + ':
' +\n this.getRowText(rowIndex, 0) +\n '
' +\n this.localeObj.getConstant('column') + ':
' +\n this.getColText(0, colIndex, rowIndex) + '
' + (cell.actualText !== '' ? ('' +\n this.engineModule.fieldList[cell.actualText].aggregateType + ' ' + this.localeObj.getConstant('of') + ' ' +\n this.engineModule.fieldList[cell.actualText].caption + ':
' +\n (((cell.formattedText === '0' || cell.formattedText === '') ?\n this.localeObj.getConstant('noValue') : cell.formattedText)) + '
' + this.parent.localeObj.getConstant('fieldList') +\n '
' + this.parent.localeObj.getConstant('fieldList') + '
\" +\n (\"\") +\n (\"
\") +\n (\"
\" +\n (\"\") +\n (\"
\" + eventTitle + \"
\") +\n (\"\") +\n (\"+ \" + this.l10n.getConstant('newEvent') + \"
\"\n });\n }\n var targetCell = closest(targetEle, '.' + cls.WORK_CELLS_CLASS + ',.' + cls.ALLDAY_CELLS_CLASS);\n if (targetCell) {\n targetCell.appendChild(newEventClone);\n }\n return;\n }\n var target = closest(targetEle, '.' + cls.WORK_CELLS_CLASS + ',.' + cls.ALLDAY_CELLS_CLASS + ',.' +\n cls.HEADER_CELLS_CLASS);\n if (isNullOrUndefined(target) || targetEle.classList.contains(cls.MORE_INDICATOR_CLASS)) {\n return;\n }\n var isSameTarget = this.quickPopup.relateTo === target;\n if (isSameTarget && this.quickPopup.element.classList.contains(cls.POPUP_OPEN)) {\n var subjectElement_1 = this.quickPopup.element.querySelector('.' + cls.SUBJECT_CLASS);\n if (subjectElement_1) {\n subjectElement_1.focus();\n }\n return;\n }\n var temp = {};\n temp[this.parent.eventFields.startTime] = this.parent.activeCellsData.startTime;\n temp[this.parent.eventFields.endTime] = this.parent.activeCellsData.endTime;\n temp[this.parent.eventFields.isAllDay] = this.parent.activeCellsData.isAllDay;\n var cellDetails = this.getFormattedString(temp);\n var quickCellPopup = createElement('div', { className: cls.CELL_POPUP_CLASS });\n var templateArgs = extend({}, temp, { elementType: 'cell' }, true);\n if (this.parent.quickInfoTemplates.header) {\n append(this.parent.getQuickInfoTemplatesHeader()(templateArgs), quickCellPopup);\n }\n else {\n var headerTemplate = createElement('div', {\n className: cls.POPUP_HEADER_CLASS,\n innerHTML: \"\" +\n (\"
\")\n });\n quickCellPopup.appendChild(headerTemplate);\n }\n if (this.parent.quickInfoTemplates.content) {\n append(this.parent.getQuickInfoTemplatesContent()(templateArgs), quickCellPopup);\n }\n else {\n var tempStr = \"| \" +\n (\" |
\") +\n (\" \") +\n ((this.parent.activeViewOptions.group.resources.length > 0 ? \"\" + cellDetails.details + \" \" +\n (\" \") : '') + \"\" + this.getResourceText(args, 'cell') + \" |
\" +\n (\"\") +\n (\"\") +\n (\"
\") +\n (\"\" + args.eventSubject + \"
\" +\n (\"
\") +\n (\"\" + (eventData[this.parent.eventFields.location] ? \"\" + args.details + \"
\") +\n ((eventData[this.parent.eventFields.recurrenceRule] ? \"\" + this.getRecurrenceSummary(eventData) + \"
\") : '') + \"\") +\n (eventData[this.parent.eventFields.location] + \"
\") +\n (this.getTimezone(eventData) + \"
\" + eventData[this.parent.eventFields.description] + \"
\") +\n (this.getResourceText(events, 'event') + \"
' + tooltipSubject + '
' +\n '' + tooltipLocation + '
' +\n '' + tooltipDetails + '
' +\n '' + tooltipTime + '
' +\n '
' +\n '' +\n '
| ' +\n ' | ' +\n ' |
' +\n '
' +\n '' + this.localeObj.getConstant(ON) + '
' +\n '' +\n '' +\n '' +\n '' +\n '' +\n '' +\n '' +\n '
' +\n '' + this.localeObj.getConstant(ON) + '
' +\n '' +\n '' +\n '
' +\n '' +\n '
' +\n '
| ' +\n ' ' +\n '' +\n ' | ' +\n '' +\n '' +\n ' | |
| ' +\n ' ' +\n '' +\n ' | ' +\n '' +\n '' +\n ' | ' +\n '' +\n '' +\n ' |
' +\n '
' +\n '' + this.localeObj.getConstant(END) + '
' +\n '' +\n '' +\n '
' +\n '' +\n '' +\n '
' +\n '' +\n '' +\n '
' +\n this.l10n.getConstant('newEvent') + '
' + this.l10n.getConstant('newEvent') + '
',\n isModal: true,\n showCloseIcon: true,\n target: document.body,\n visible: false,\n width: '500px',\n beforeOpen: this.onBeforeOpen.bind(this),\n beforeClose: this.onBeforeClose.bind(this)\n });\n }\n this.dialogObject.appendTo(this.element);\n addClass([this.element.parentElement], cls.EVENT_WINDOW_DIALOG_CLASS + '-container');\n if (this.parent.isAdaptive) {\n EventHandler.add(this.element.querySelector('.' + cls.EVENT_WINDOW_BACK_ICON_CLASS), 'click', this.dialogClose, this);\n EventHandler.add(this.element.querySelector('.' + cls.EVENT_WINDOW_SAVE_ICON_CLASS), 'click', this.eventSave, this);\n }\n this.applyFormValidation();\n };\n EventWindow.prototype.refresh = function () {\n this.destroy();\n this.renderEventWindow();\n };\n EventWindow.prototype.refreshRecurrenceEditor = function () {\n if (this.recurrenceEditor) {\n var recurrenceEditor = this.recurrenceEditor.element;\n this.recurrenceEditor.destroy();\n this.createRecurrenceEditor(recurrenceEditor);\n }\n };\n EventWindow.prototype.openEditor = function (data, type, isEventData, repeatType) {\n this.parent.removeNewEventElement();\n this.parent.quickPopup.quickPopupHide(true);\n if (!this.parent.isAdaptive && isNullOrUndefined(this.parent.editorTemplate)) {\n removeClass([this.dialogObject.element.querySelector('.e-recurrenceeditor')], cls.DISABLE_CLASS);\n }\n switch (type) {\n case 'Add':\n this.cellClickAction = !isEventData;\n this.parent.activeCellsData = data;\n this.onCellDetailsUpdate(data, repeatType);\n break;\n case 'Save':\n case 'EditOccurrence':\n case 'EditSeries':\n if (type === 'EditOccurrence' && !this.parent.isAdaptive && isNullOrUndefined(this.parent.editorTemplate)) {\n addClass([this.dialogObject.element.querySelector('.e-recurrenceeditor')], cls.DISABLE_CLASS);\n }\n this.cellClickAction = false;\n this.onEventDetailsUpdate(data);\n break;\n }\n };\n EventWindow.prototype.setDialogContent = function () {\n this.dialogObject.content = this.getEventWindowContent();\n this.dialogObject.dataBind();\n };\n EventWindow.prototype.onBeforeOpen = function (args) {\n var eventProp = {\n type: 'Editor',\n data: this.eventData,\n cancel: false,\n element: this.element,\n target: (this.cellClickAction ? this.parent.activeCellsData.element : this.parent.activeEventData.element)\n };\n if (this.cellClickAction) {\n eventProp.duration = this.getSlotDuration();\n }\n this.parent.trigger(event.popupOpen, eventProp);\n args.cancel = eventProp.cancel;\n this.duration = this.cellClickAction ? eventProp.duration : null;\n this.refreshDateTimePicker(this.duration);\n if (this.cellClickAction && eventProp.duration !== this.getSlotDuration() && isNullOrUndefined(this.parent.editorTemplate)) {\n var startObj = this.getInstance(cls.EVENT_WINDOW_START_CLASS);\n var endObj = this.getInstance(cls.EVENT_WINDOW_END_CLASS);\n endObj.value = new Date(startObj.value.getTime() + (util.MS_PER_MINUTE * eventProp.duration));\n endObj.dataBind();\n }\n if (this.parent.editorTemplate && this.element.querySelector('.e-recurrenceeditor') && !this.recurrenceEditor) {\n this.recurrenceEditor = this.getInstance('e-recurrenceeditor');\n }\n };\n EventWindow.prototype.onBeforeClose = function () {\n this.resetForm();\n this.parent.eventBase.focusElement();\n };\n EventWindow.prototype.getEventWindowContent = function () {\n var container = createElement('div', { className: cls.FORM_CONTAINER_CLASS });\n var form = createElement('form', {\n id: this.parent.element.id + 'EditForm',\n className: cls.FORM_CLASS,\n attrs: { onsubmit: 'return false;' }\n });\n if (!isNullOrUndefined(this.parent.editorTemplate)) {\n append(this.parent.getEditorTemplate()(), form);\n }\n else {\n var content = this.getDefaultEventWindowContent();\n form.appendChild(content);\n }\n container.appendChild(form);\n return container;\n };\n EventWindow.prototype.getDefaultEventWindowContent = function () {\n var parentDiv = this.createDivElement(cls.EVENT_WINDOW_DIALOG_PARENT_CLASS);\n var titleLocationDiv = this.createDivElement(cls.EVENT_WINDOW_TITLE_LOCATION_DIV_CLASS);\n var titleDiv = this.renderTextBox(cls.SUBJECT_CLASS);\n var locationDiv = this.renderTextBox(cls.LOCATION_CLASS);\n titleLocationDiv.appendChild(titleDiv);\n titleLocationDiv.appendChild(locationDiv);\n var startEndDateTimeDiv = this.createDivElement(cls.EVENT_WINDOW_START_END_DIV_CLASS);\n var startDateTimeDiv = this.renderDateTimePicker(cls.EVENT_WINDOW_START_CLASS, this.onTimeChange.bind(this));\n var endDateTimeDiv = this.renderDateTimePicker(cls.EVENT_WINDOW_END_CLASS);\n startEndDateTimeDiv.appendChild(startDateTimeDiv);\n startEndDateTimeDiv.appendChild(endDateTimeDiv);\n var timezoneParentDiv = this.createDivElement(cls.EVENT_WINDOW_TIME_ZONE_DIV_CLASS);\n var startTimezoneDiv = this.renderDropDown(cls.EVENT_WINDOW_START_TZ_CLASS);\n var endTimezoneDiv = this.renderDropDown(cls.EVENT_WINDOW_END_TZ_CLASS);\n timezoneParentDiv.appendChild(startTimezoneDiv);\n timezoneParentDiv.appendChild(endTimezoneDiv);\n var allDayTimezoneDiv = this.createDivElement(cls.EVENT_WINDOW_ALLDAY_TZ_DIV_CLASS);\n var allDayDiv = this.renderCheckBox(cls.EVENT_WINDOW_ALL_DAY_CLASS);\n var timezoneDiv = this.renderCheckBox(cls.TIME_ZONE_CLASS);\n allDayTimezoneDiv.appendChild(allDayDiv);\n allDayTimezoneDiv.appendChild(timezoneDiv);\n var repeatParentDiv = this.createDivElement(cls.EVENT_WINDOW_REPEAT_DIV_CLASS);\n var repeatDiv = this.renderCheckBox(cls.EVENT_WINDOW_REPEAT_CLASS);\n var repeatEditConainer = createElement('span', { className: REPEAT_CONTAINER_CLASS });\n var button = createElement('button', {\n className: REPEAT_BUTTON_CLASS,\n attrs: { type: 'button', 'title': this.l10n.getConstant('editRecurrence') }\n });\n this.buttonObj = new Button({ iconCss: REPEAT_BUTTON_ICON_CLASS + ' e-icons', cssClass: 'e-medium ' + this.parent.cssClass });\n repeatEditConainer.appendChild(button);\n this.buttonObj.appendTo(button);\n repeatDiv.appendChild(repeatEditConainer);\n repeatParentDiv.appendChild(repeatDiv);\n var description = this.createDivElement(cls.DESCRIPTION_CLASS + '-row');\n var descriptionDiv = this.renderTextBox(cls.DESCRIPTION_CLASS);\n description.appendChild(descriptionDiv);\n parentDiv.appendChild(titleLocationDiv);\n parentDiv.appendChild(startEndDateTimeDiv);\n parentDiv.appendChild(allDayTimezoneDiv);\n parentDiv.appendChild(timezoneParentDiv);\n parentDiv.appendChild(repeatParentDiv);\n if (!this.parent.isAdaptive) {\n this.createRecurrenceEditor(parentDiv);\n }\n else {\n EventHandler.add(button, 'click', this.loadRecurrenceEditor, this);\n }\n if (this.parent.resources.length > 0) {\n var resourceParentDiv = this.createDivElement(cls.EVENT_WINDOW_RESOURCES_DIV_CLASS);\n for (var i = 0; i < this.parent.resourceBase.resourceCollection.length; i++) {\n resourceParentDiv.appendChild(this.renderResourceDetails(i));\n }\n parentDiv.appendChild(resourceParentDiv);\n }\n parentDiv.appendChild(description);\n var submit = createElement('button', { attrs: { type: 'hidden', title: 'submit', style: 'display:none' } });\n parentDiv.appendChild(submit);\n return parentDiv;\n };\n EventWindow.prototype.createRecurrenceEditor = function (parentDiv) {\n var recurrenceEditor = this.createDivElement();\n parentDiv.appendChild(recurrenceEditor);\n this.recurrenceEditor = this.renderRecurrenceEditor();\n this.recurrenceEditor.appendTo(recurrenceEditor);\n };\n EventWindow.prototype.createDivElement = function (className) {\n return createElement('div', { className: className });\n };\n EventWindow.prototype.createInputElement = function (className, fieldName, type) {\n return createElement(type || 'input', {\n className: className, attrs: {\n type: 'text', name: fieldName, value: '',\n title: ((this.l10n.getConstant(fieldName.charAt(0).toLowerCase() + fieldName.slice(1))) === '') ?\n fieldName : this.l10n.getConstant(fieldName.charAt(0).toLowerCase() + fieldName.slice(1))\n }\n });\n };\n EventWindow.prototype.getSlotDuration = function () {\n return this.parent.activeViewOptions.timeScale.interval / this.parent.activeViewOptions.timeScale.slotCount;\n };\n EventWindow.prototype.renderDateTimePicker = function (value, changeEvent) {\n var dateTimeDiv = this.createDivElement(value + '-container');\n var fieldName = this.getFieldName(value);\n var dateTimeInput = this.createInputElement(value + ' ' + EVENT_FIELD, fieldName);\n dateTimeDiv.appendChild(dateTimeInput);\n var dateTimePicker = new DateTimePicker({\n change: changeEvent,\n calendarMode: this.parent.calendarMode,\n cssClass: this.parent.cssClass,\n enableRtl: this.parent.enableRtl,\n floatLabelType: 'Always',\n format: (isNullOrUndefined(this.parent.dateFormat) ?\n this.getFormat('dateFormats') : this.parent.dateFormat) + ' ' + this.getFormat('timeFormats'),\n placeholder: this.getFieldLabel(value),\n step: this.getSlotDuration(),\n value: new Date(), width: '100%'\n });\n dateTimePicker.appendTo(dateTimeInput);\n return dateTimeDiv;\n };\n EventWindow.prototype.refreshDateTimePicker = function (duration) {\n var _this = this;\n var startEndElement = [].slice.call(this.element.querySelectorAll('.' + cls.EVENT_WINDOW_START_CLASS + ',.' +\n cls.EVENT_WINDOW_END_CLASS));\n startEndElement.forEach(function (element) {\n var instance = element.ej2_instances[0];\n instance.step = duration || _this.getSlotDuration();\n instance.dataBind();\n });\n };\n EventWindow.prototype.onTimeChange = function () {\n var startObj = this.getInstance(cls.EVENT_WINDOW_START_CLASS);\n if (startObj.element.parentElement.classList.contains('e-input-focus')) {\n var endObj = this.getInstance(cls.EVENT_WINDOW_END_CLASS);\n var duration = 0;\n if (this.cellClickAction) {\n duration = util.MS_PER_MINUTE * this.duration;\n }\n else {\n duration = this.eventData[this.fields.endTime].getTime() - this.eventData[this.fields.startTime].getTime();\n }\n endObj.value = new Date(startObj.value.getTime() + duration);\n endObj.dataBind();\n }\n };\n EventWindow.prototype.renderResourceDetails = function (index) {\n var resourceData = this.parent.resourceBase.resourceCollection[index];\n var fieldName = resourceData.field;\n var value = 'e-' + fieldName;\n var labelValue = resourceData.title;\n var resourceDiv = this.createDivElement(value + '-container' + ' ' + 'e-resources');\n var resourceInput = this.createInputElement(value + ' ' + EVENT_FIELD, fieldName);\n resourceDiv.appendChild(resourceInput);\n var resourceTemplate = '${' + resourceData.textField + '}
' +\n '
' + this.parent.globalize.formatDate(date, { format: 'd', calendar: this.parent.getCalendarMode() }) + '
' + '' +\n this.parent.globalize.formatDate(date, { format: 'E', calendar: this.parent.getCalendarMode() }) + '
'\n });\n return wrap;\n };\n ViewBase.prototype.setResourceHeaderContent = function (tdElement, tdData, className) {\n if (className === void 0) { className = 'e-text-ellipsis'; }\n if (this.parent.activeViewOptions.resourceHeaderTemplate) {\n var data = {\n resource: tdData.resource,\n resourceData: tdData.resourceData\n };\n append(this.parent.getResourceHeaderTemplate()(data), tdElement);\n }\n else {\n tdElement.appendChild(createElement('div', {\n className: className, innerHTML: tdData.resourceData[tdData.resource.textField]\n }));\n }\n };\n ViewBase.prototype.renderResourceMobileLayout = function () {\n if (this.parent.resourceBase.lastResourceLevel && this.parent.resourceBase.lastResourceLevel.length <= 0) {\n return;\n }\n this.parent.resourceBase.renderResourceHeader();\n this.parent.resourceBase.renderResourceTree();\n };\n ViewBase.prototype.addAutoHeightClass = function (element) {\n if (!this.parent.uiStateValues.isGroupAdaptive && this.parent.rowAutoHeight && this.parent.activeView.isTimelineView()\n && this.parent.activeViewOptions.group.resources.length > 0) {\n addClass([element], cls.AUTO_HEIGHT);\n }\n };\n return ViewBase;\n}());\nexport { ViewBase };\n","import { extend, closest, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport * as event from '../base/constant';\nimport * as cls from '../base/css-constant';\n/**\n * Work cell interactions\n */\nvar WorkCellInteraction = /** @class */ (function () {\n function WorkCellInteraction(parent) {\n this.parent = parent;\n }\n WorkCellInteraction.prototype.cellMouseDown = function (e) {\n if (this.isPreventAction(e)) {\n return;\n }\n this.parent.notify(event.cellMouseDown, { event: e });\n };\n WorkCellInteraction.prototype.cellClick = function (e) {\n if (this.isPreventAction(e)) {\n return;\n }\n var queryStr = '.' + cls.WORK_CELLS_CLASS + ',.' + cls.ALLDAY_CELLS_CLASS + ',.' + cls.HEADER_CELLS_CLASS;\n var target = closest(e.target, queryStr);\n if (isNullOrUndefined(target)) {\n return;\n }\n if (!isNullOrUndefined(closest(e.target, '.' + cls.NEW_EVENT_CLASS))) {\n this.parent.eventWindow.openEditor(this.parent.activeCellsData, 'Add');\n return;\n }\n var navigateEle = closest(e.target, '.' + cls.NAVIGATE_CLASS);\n var navigateView = this.parent.getNavigateView();\n var sameView = this.parent.currentView === navigateView;\n if (isNullOrUndefined(navigateEle) || sameView ||\n isNullOrUndefined(this.parent.viewOptions[navigateView.charAt(0).toLowerCase() + navigateView.slice(1)])) {\n if (this.parent.activeViewOptions.readonly) {\n this.parent.quickPopup.quickPopupHide();\n return;\n }\n if (this.parent.isAdaptive && (e.target.classList.contains(cls.MORE_INDICATOR_CLASS) ||\n closest(e.target, '.' + cls.MORE_INDICATOR_CLASS))) {\n return;\n }\n var isWorkCell = target.classList.contains(cls.WORK_CELLS_CLASS) ||\n target.classList.contains(cls.ALLDAY_CELLS_CLASS);\n if (isWorkCell && e.shiftKey && e.which === 1 && this.parent.keyboardInteractionModule) {\n this.parent.keyboardInteractionModule.onMouseSelection(e);\n return;\n }\n this.parent.activeCellsData = this.parent.getCellDetails(target);\n var args = extend(this.parent.activeCellsData, { cancel: false, event: e, name: 'cellClick' });\n this.parent.trigger(event.cellClick, args);\n if (args.cancel) {\n return;\n }\n if (isWorkCell) {\n this.parent.selectCell(target);\n }\n this.parent.notify(event.cellClick, args);\n }\n else {\n var date = this.parent.getDateFromElement(target);\n if (!isNullOrUndefined(date) && !this.parent.isAdaptive) {\n this.parent.setProperties({ selectedDate: date }, true);\n this.parent.changeView(this.parent.getNavigateView());\n }\n }\n };\n WorkCellInteraction.prototype.cellDblClick = function (e) {\n if (this.parent.activeViewOptions.readonly || this.isPreventAction(e)) {\n return;\n }\n var args = extend(this.parent.activeCellsData, { cancel: false, event: e, name: 'cellDoubleClick' });\n this.parent.trigger(event.cellDoubleClick, args);\n if (args.cancel) {\n return;\n }\n this.parent.eventWindow.openEditor(this.parent.activeCellsData, 'Add');\n };\n WorkCellInteraction.prototype.isPreventAction = function (e) {\n if (closest(e.target, '.' + cls.NAVIGATE_CLASS)) {\n return false;\n }\n if (closest(e.target, '.' + cls.APPOINTMENT_WRAPPER_CLASS) &&\n !closest(e.target, '.' + cls.MORE_INDICATOR_CLASS)) {\n return true;\n }\n var target = closest(e.target, '.' + cls.APPOINTMENT_CLASS + ',.' + cls.RESOURCE_GROUP_CELLS_CLASS);\n if (!isNullOrUndefined(target)) {\n return true;\n }\n target = closest(e.target, '.' + cls.HEADER_CELLS_CLASS);\n if (this.parent.activeView.isTimelineView() && !isNullOrUndefined(target)) {\n return true;\n }\n return false;\n };\n return WorkCellInteraction;\n}());\nexport { WorkCellInteraction };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { append, createElement, extend, EventHandler, prepend, Animation, formatUnit } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, setStyleAttribute, remove, removeClass, addClass } from '@syncfusion/ej2-base';\nimport { DataManager, Query, Predicate } from '@syncfusion/ej2-data';\nimport { EventBase } from './event-base';\nimport * as util from '../base/util';\nimport * as events from '../base/constant';\nimport * as cls from '../base/css-constant';\n/**\n * Vertical view appointment rendering\n */\nvar VerticalEvent = /** @class */ (function (_super) {\n __extends(VerticalEvent, _super);\n /**\n * Constructor for vertical view\n */\n function VerticalEvent(parent) {\n var _this = _super.call(this, parent) || this;\n _this.dateRender = [];\n _this.renderedEvents = [];\n _this.renderedAllDayEvents = [];\n _this.overlapEvents = [];\n _this.moreEvents = [];\n _this.overlapList = [];\n _this.allDayEvents = [];\n _this.slotCount = _this.parent.activeViewOptions.timeScale.slotCount;\n _this.interval = _this.parent.activeViewOptions.timeScale.interval;\n _this.allDayLevel = 0;\n _this.startHour = _this.parent.activeView.getStartHour();\n _this.endHour = _this.parent.activeView.getEndHour();\n _this.element = _this.parent.activeView.getPanel();\n _this.fields = _this.parent.eventFields;\n _this.animation = new Animation({ progress: _this.animationUiUpdate.bind(_this) });\n _this.addEventListener();\n return _this;\n }\n VerticalEvent.prototype.renderAppointments = function () {\n var wrapperElements = [].slice.call(this.parent.element.querySelectorAll('.' + cls.BLOCK_APPOINTMENT_CLASS +\n ',.' + cls.APPOINTMENT_CLASS + ',.' + cls.ROW_COUNT_WRAPPER_CLASS));\n wrapperElements.forEach(function (element) { return remove(element); });\n if (!this.element.querySelector('.' + cls.WORK_CELLS_CLASS)) {\n return;\n }\n this.allDayElement = [].slice.call(this.element.querySelectorAll('.' + cls.ALLDAY_CELLS_CLASS));\n this.setAllDayRowHeight(0);\n if (this.parent.eventsProcessed.length === 0 && this.parent.blockProcessed.length === 0) {\n return;\n }\n var expandCollapse = this.element.querySelector('.' + cls.ALLDAY_APPOINTMENT_SECTION_CLASS);\n EventHandler.remove(expandCollapse, 'click', this.rowExpandCollapse);\n EventHandler.add(expandCollapse, 'click', this.rowExpandCollapse, this);\n this.renderedEvents = [];\n this.renderedAllDayEvents = [];\n this.initializeValues();\n this.processBlockEvents();\n this.renderEvents('normalEvents');\n if (this.allDayEvents.length > 0) {\n this.allDayEvents = this.allDayEvents.filter(function (item, index, arr) {\n return index === arr.map(function (item) { return item.Guid; }).indexOf(item.Guid);\n });\n removeClass(this.allDayElement, cls.ALLDAY_ROW_ANIMATE_CLASS);\n this.slots.push(this.parent.activeView.renderDates.map(function (date) { return +date; }));\n this.renderEvents('allDayEvents');\n }\n this.parent.notify(events.contentReady, {});\n addClass(this.allDayElement, cls.ALLDAY_ROW_ANIMATE_CLASS);\n };\n VerticalEvent.prototype.initializeValues = function () {\n var _this = this;\n this.resources = (this.parent.activeViewOptions.group.resources.length > 0) ? this.parent.uiStateValues.isGroupAdaptive ?\n [this.parent.resourceBase.lastResourceLevel[this.parent.uiStateValues.groupIndex]] :\n this.parent.resourceBase.lastResourceLevel : [];\n this.cellHeight = this.element.querySelector('.' + cls.WORK_CELLS_CLASS).offsetHeight;\n this.dateRender[0] = this.parent.activeView.renderDates;\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n this.resources.forEach(function (resource, index) { return _this.dateRender[index] = resource.renderDates; });\n }\n };\n VerticalEvent.prototype.isValidEvent = function (eventObj, start, end, schedule) {\n var isHourRange = end.getTime() > schedule.startHour.getTime() && start.getTime() < schedule.endHour.getTime();\n var isSameRange = schedule.startHour.getTime() <= start.getTime() &&\n eventObj[this.fields.startTime].getTime() >= schedule.startHour.getTime() &&\n eventObj[this.fields.endTime].getTime() < schedule.endHour.getTime() && start.getTime() === end.getTime();\n return isHourRange || isSameRange;\n };\n VerticalEvent.prototype.getHeight = function (start, end) {\n var appHeight = (end.getTime() - start.getTime()) / (60 * 1000) * (this.cellHeight * this.slotCount) / this.interval;\n appHeight = (appHeight < this.cellHeight) ? this.cellHeight : appHeight;\n return appHeight;\n };\n VerticalEvent.prototype.appendEvent = function (eventObj, appointmentElement, index, appLeft) {\n var appointmentWrap = [].slice.call(this.element.querySelectorAll('.' + cls.APPOINTMENT_WRAPPER_CLASS));\n if (this.parent.enableRtl) {\n setStyleAttribute(appointmentElement, { 'right': appLeft });\n }\n else {\n setStyleAttribute(appointmentElement, { 'left': appLeft });\n }\n var eventType = appointmentElement.classList.contains(cls.BLOCK_APPOINTMENT_CLASS) ? 'blockEvent' : 'event';\n var args = { data: eventObj, element: appointmentElement, cancel: false, type: eventType };\n this.parent.trigger(events.eventRendered, args);\n if (args.cancel) {\n return;\n }\n appointmentWrap[index].appendChild(appointmentElement);\n };\n VerticalEvent.prototype.processBlockEvents = function () {\n var resources = this.getResourceList();\n var dateCount = 0;\n for (var _i = 0, resources_1 = resources; _i < resources_1.length; _i++) {\n var resource = resources_1[_i];\n var renderDates = this.dateRender[resource];\n for (var day = 0, length_1 = renderDates.length; day < length_1; day++) {\n var startDate = new Date(renderDates[day].getTime());\n var endDate = util.addDays(renderDates[day], 1);\n var filterEvents = this.filterEvents(startDate, endDate, this.parent.blockProcessed, this.resources[resource]);\n for (var _a = 0, filterEvents_1 = filterEvents; _a < filterEvents_1.length; _a++) {\n var event_1 = filterEvents_1[_a];\n if (this.parent.resourceBase) {\n this.setValues(event_1, resource);\n }\n this.renderBlockEvents(event_1, day, resource, dateCount);\n this.cssClass = null;\n this.groupOrder = null;\n }\n dateCount += 1;\n }\n }\n };\n VerticalEvent.prototype.renderBlockEvents = function (eventObj, dayIndex, resource, dayCount) {\n var spannedData = this.isSpannedEvent(eventObj, dayIndex, resource);\n var eStart = spannedData[this.fields.startTime];\n var eEnd = spannedData[this.fields.endTime];\n var currentDate = util.resetTime(new Date(this.dateRender[resource][dayIndex].getTime()));\n var schedule = util.getStartEndHours(currentDate, this.startHour, this.endHour);\n if (eStart <= eEnd && this.isValidEvent(eventObj, eStart, eEnd, schedule)) {\n var blockTop = void 0;\n var blockHeight = void 0;\n if (spannedData[this.fields.isAllDay]) {\n var contentWrap = this.parent.element.querySelector('.' + cls.CONTENT_WRAP_CLASS + ' table');\n blockHeight = formatUnit(contentWrap.offsetHeight);\n blockTop = formatUnit(0);\n }\n else {\n blockHeight = formatUnit(this.getHeight(eStart, eEnd));\n blockTop = formatUnit(this.getTopValue(eStart, dayIndex, resource));\n }\n var appointmentElement = this.createBlockAppointmentElement(eventObj, resource);\n setStyleAttribute(appointmentElement, { 'width': '100%', 'height': blockHeight, 'top': blockTop });\n var index = this.parent.activeViewOptions.group.byDate ? (this.resources.length * dayIndex) + resource : dayCount;\n this.appendEvent(eventObj, appointmentElement, index, '0px');\n }\n };\n VerticalEvent.prototype.renderEvents = function (eventType) {\n removeClass(this.allDayElement, cls.ALLDAY_ROW_ANIMATE_CLASS);\n var eventCollection = (eventType === 'allDayEvents') ? this.sortByDateTime(this.allDayEvents) : undefined;\n var resources = this.getResourceList();\n var dateCount = 0;\n for (var _i = 0, resources_2 = resources; _i < resources_2.length; _i++) {\n var resource = resources_2[_i];\n var renderDates = this.dateRender[resource];\n for (var day = 0, length_2 = renderDates.length; day < length_2; day++) {\n this.renderedEvents = [];\n var startDate = new Date(renderDates[day].getTime());\n var endDate = util.addDays(renderDates[day], 1);\n var filterEvents = this.filterEvents(startDate, endDate, eventCollection, this.resources[resource]);\n for (var _a = 0, filterEvents_2 = filterEvents; _a < filterEvents_2.length; _a++) {\n var event_2 = filterEvents_2[_a];\n if (this.parent.resourceBase) {\n this.setValues(event_2, resource);\n }\n if (eventType === 'allDayEvents') {\n this.renderAllDayEvents(event_2, day, resource, dateCount);\n }\n else {\n if (this.isAllDayAppointment(event_2)) {\n this.allDayEvents.push(extend({}, event_2, null, true));\n }\n else {\n this.renderNormalEvents(event_2, day, resource, dateCount);\n }\n }\n this.cssClass = null;\n this.groupOrder = null;\n }\n dateCount += 1;\n }\n }\n };\n VerticalEvent.prototype.setValues = function (event, resourceIndex) {\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n this.cssClass = this.resources[resourceIndex].cssClass;\n this.groupOrder = this.resources[resourceIndex].groupOrder;\n }\n else {\n this.cssClass = this.parent.resourceBase.getCssClass(event);\n }\n };\n VerticalEvent.prototype.getResourceList = function () {\n var resources = Array.apply(null, {\n length: (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) ?\n this.resources.length : 1\n }).map(function (value, index) { return index; });\n return resources;\n };\n VerticalEvent.prototype.createAppointmentElement = function (record, isAllDay, data, resource) {\n var fieldMapping = this.parent.eventFields;\n var recordSubject = (record[fieldMapping.subject] || this.parent.eventSettings.fields.subject.default);\n var appointmentWrapper = createElement('div', {\n className: cls.APPOINTMENT_CLASS,\n attrs: {\n 'data-id': 'Appointment_' + record[fieldMapping.id],\n 'data-guid': record.Guid,\n 'role': 'button',\n 'tabindex': '0',\n 'aria-readonly': this.parent.eventBase.getReadonlyAttribute(record),\n 'aria-selected': 'false',\n 'aria-grabbed': 'true',\n 'aria-label': recordSubject\n }\n });\n if (record[this.fields.isReadonly]) {\n addClass([appointmentWrapper], 'e-read-only');\n }\n var appointmentDetails = createElement('div', { className: cls.APPOINTMENT_DETAILS });\n appointmentWrapper.appendChild(appointmentDetails);\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n var resourceIndex = this.parent.isAdaptive ? this.parent.uiStateValues.groupIndex : resource;\n appointmentWrapper.setAttribute('data-group-index', resourceIndex.toString());\n }\n var templateElement;\n var eventData = data;\n if (!isNullOrUndefined(this.parent.activeViewOptions.eventTemplate)) {\n templateElement = this.parent.getAppointmentTemplate()(record);\n }\n else {\n var appointmentSubject = createElement('div', { className: cls.SUBJECT_CLASS, innerHTML: recordSubject });\n if (isAllDay) {\n if (record[fieldMapping.isAllDay]) {\n templateElement = [appointmentSubject];\n }\n else {\n templateElement = [];\n var appointmentStartTime = createElement('div', {\n className: cls.APPOINTMENT_TIME + (this.parent.isAdaptive ? ' ' + cls.DISABLE_CLASS : ''),\n innerHTML: this.parent.getTimeString(record[fieldMapping.startTime])\n });\n var appointmentEndTime = createElement('div', {\n className: cls.APPOINTMENT_TIME + (this.parent.isAdaptive ? ' ' + cls.DISABLE_CLASS : ''),\n innerHTML: this.parent.getTimeString(record[fieldMapping.endTime]),\n });\n addClass([appointmentSubject], 'e-text-center');\n if (!eventData.isLeft) {\n templateElement.push(appointmentStartTime);\n }\n templateElement.push(appointmentSubject);\n if (!eventData.isRight) {\n templateElement.push(appointmentEndTime);\n }\n }\n }\n else {\n var timeStr = this.parent.getTimeString(record[fieldMapping.startTime]) + ' - ' +\n this.parent.getTimeString(record[fieldMapping.endTime]);\n var appointmentTime = createElement('div', {\n className: cls.APPOINTMENT_TIME + (this.parent.isAdaptive ? ' ' + cls.DISABLE_CLASS : ''),\n innerHTML: timeStr,\n });\n var appointmentLocation = createElement('div', {\n className: cls.LOCATION_CLASS,\n innerHTML: (record[fieldMapping.location] || this.parent.eventSettings.fields.location.default || '')\n });\n templateElement = [appointmentSubject, appointmentTime, appointmentLocation];\n }\n }\n append(templateElement, appointmentDetails);\n if (!this.parent.isAdaptive &&\n (!isNullOrUndefined(record[fieldMapping.recurrenceRule]) || !isNullOrUndefined(record[fieldMapping.recurrenceID]))) {\n var iconClass = (record[fieldMapping.id] === record[fieldMapping.recurrenceID]) ?\n cls.EVENT_RECURRENCE_ICON_CLASS : cls.EVENT_RECURRENCE_EDIT_ICON_CLASS;\n var recurrenceIcon = createElement('div', { className: cls.ICON + ' ' + iconClass });\n isAllDay ? appointmentDetails.appendChild(recurrenceIcon) : appointmentWrapper.appendChild(recurrenceIcon);\n }\n this.renderSpannedIcon(isAllDay ? appointmentDetails : appointmentWrapper, eventData);\n if (!isNullOrUndefined(this.cssClass)) {\n addClass([appointmentWrapper], this.cssClass);\n }\n this.applyResourceColor(appointmentWrapper, record, 'backgroundColor', this.groupOrder);\n this.renderResizeHandler(appointmentWrapper, eventData, record[this.fields.isReadonly]);\n return appointmentWrapper;\n };\n VerticalEvent.prototype.createMoreIndicator = function (allDayRow, count, currentDay) {\n var index = currentDay + count;\n var countWrapper = allDayRow[index];\n if (countWrapper.childElementCount <= 0) {\n var innerCountWrap = createElement('div', {\n className: cls.ROW_COUNT_WRAPPER_CLASS,\n id: cls.ROW_COUNT_WRAPPER_CLASS + '-' + index.toString()\n });\n var moreIndicatorElement = createElement('div', {\n className: cls.MORE_INDICATOR_CLASS,\n attrs: { 'tabindex': '0', 'data-index': index.toString(), 'data-count': '1' },\n innerHTML: '+1 ' + (this.parent.isAdaptive ? '' : this.parent.localeObj.getConstant('more'))\n });\n innerCountWrap.appendChild(moreIndicatorElement);\n countWrapper.appendChild(innerCountWrap);\n EventHandler.add(moreIndicatorElement, 'click', this.rowExpandCollapse, this);\n }\n else {\n var countCell = countWrapper.querySelector('.' + cls.MORE_INDICATOR_CLASS);\n var moreCount = parseInt(countCell.getAttribute('data-count'), 10) + 1;\n countCell.setAttribute('data-count', moreCount.toString());\n countCell.innerHTML = '+' + moreCount + ' ' + (this.parent.isAdaptive ? '' : this.parent.localeObj.getConstant('more'));\n }\n };\n VerticalEvent.prototype.renderSpannedIcon = function (element, spanEvent) {\n var iconElement = createElement('div', { className: cls.EVENT_INDICATOR_CLASS + ' ' + cls.ICON });\n if (spanEvent.isLeft) {\n var iconLeft = iconElement.cloneNode();\n addClass([iconLeft], cls.EVENT_ICON_LEFT_CLASS);\n prepend([iconLeft], element);\n }\n if (spanEvent.isRight) {\n var iconRight = iconElement.cloneNode();\n addClass([iconRight], cls.EVENT_ICON_RIGHT_CLASS);\n append([iconRight], element);\n }\n if (spanEvent.isTop) {\n var iconTop = iconElement.cloneNode();\n addClass([iconTop], cls.EVENT_ICON_UP_CLASS);\n prepend([iconTop], element);\n }\n if (spanEvent.isBottom) {\n var iconBottom = iconElement.cloneNode();\n addClass([iconBottom], cls.EVENT_ICON_DOWN_CLASS);\n append([iconBottom], element);\n }\n };\n VerticalEvent.prototype.isSpannedEvent = function (record, day, resource) {\n var currentDate = util.resetTime(this.dateRender[resource][day]);\n var fieldMapping = this.parent.eventFields;\n var startEndHours = util.getStartEndHours(currentDate, this.startHour, this.endHour);\n var event = extend({}, record, null, true);\n event.isSpanned = { isBottom: false, isTop: false };\n if (record[fieldMapping.startTime].getTime() < startEndHours.startHour.getTime()) {\n event[fieldMapping.startTime] = startEndHours.startHour;\n event.isSpanned.isTop = true;\n }\n if (record[fieldMapping.endTime].getTime() > startEndHours.endHour.getTime()) {\n event[fieldMapping.endTime] = startEndHours.endHour;\n event.isSpanned.isBottom = true;\n }\n return event;\n };\n VerticalEvent.prototype.renderAllDayEvents = function (eventObj, dayIndex, resource, dayCount) {\n var _this = this;\n var currentDates = this.dateRender[resource];\n if (this.parent.activeViewOptions.group.byDate) {\n this.slots[0] = [this.dateRender[resource][dayIndex].getTime()];\n currentDates = [this.dateRender[resource][dayIndex]];\n }\n var record = this.splitEvent(eventObj, currentDates)[0];\n var allDayRowCell = this.element.querySelector('.' + cls.ALLDAY_CELLS_CLASS + ':first-child');\n var cellTop = allDayRowCell.offsetTop;\n var eStart = new Date(record[this.parent.eventFields.startTime].getTime());\n var eEnd = new Date(record[this.parent.eventFields.endTime].getTime());\n var appWidth = 0;\n var appLeft = '0%';\n var topValue = 1;\n var appLevel = 0;\n var isDateRange = currentDates[0].getTime() <= eStart.getTime() &&\n util.addDays(currentDates.slice(-1)[0], 1).getTime() >= eStart.getTime();\n if (eStart <= eEnd && isDateRange) {\n var isAlreadyRendered = [];\n if (this.renderedAllDayEvents[resource]) {\n isAlreadyRendered = this.renderedAllDayEvents[resource].filter(function (event) {\n return event.Guid === eventObj.Guid;\n });\n if (this.parent.activeViewOptions.group.byDate) {\n isAlreadyRendered = isAlreadyRendered.filter(function (event) {\n return event[_this.parent.eventFields.startTime] >= currentDates[dayIndex] &&\n event[_this.parent.eventFields.endTime] <= util.addDays(new Date(+currentDates[dayIndex]), 1);\n });\n }\n }\n if (isAlreadyRendered.length === 0) {\n var allDayDifference = record.data.count;\n var allDayIndex = this.getOverlapIndex(record, dayIndex, true, resource);\n record.Index = allDayIndex;\n this.allDayLevel = (this.allDayLevel < allDayIndex) ? allDayIndex : this.allDayLevel;\n var widthAdjustment = record.data.isRight ? 0 :\n this.parent.currentView === 'Day' ? 4 : 7;\n if (allDayDifference >= 0) {\n appWidth = (allDayDifference * 100) - widthAdjustment;\n }\n if (isNullOrUndefined(this.renderedAllDayEvents[resource])) {\n this.renderedAllDayEvents[resource] = [];\n }\n this.renderedAllDayEvents[resource].push(extend({}, record, null, true));\n var allDayRow = [].slice.call(this.element.querySelector('.' + cls.ALLDAY_ROW_CLASS).children);\n var wIndex = this.parent.activeViewOptions.group.byDate ? (this.resources.length * dayIndex) + resource : dayCount;\n var eventWrapper = this.element.querySelector('.' + cls.ALLDAY_APPOINTMENT_WRAPPER_CLASS +\n ':nth-child(' + (wIndex + 1) + ')');\n var appointmentElement = this.createAppointmentElement(eventObj, true, record.data, resource);\n addClass([appointmentElement], cls.ALLDAY_APPOINTMENT_CLASS);\n var args = { data: eventObj, element: appointmentElement, cancel: false };\n this.parent.trigger(events.eventRendered, args);\n if (args.cancel) {\n return;\n }\n eventWrapper.appendChild(appointmentElement);\n var appHeight = appointmentElement.offsetHeight;\n topValue += (allDayIndex === 0 ? cellTop : (cellTop + (allDayIndex * appHeight))) + 1;\n setStyleAttribute(appointmentElement, { 'width': appWidth + '%', 'top': topValue + 'px' });\n if (allDayIndex > 1) {\n this.moreEvents.push(appointmentElement);\n for (var count = 0, length_3 = allDayDifference; count < length_3; count++) {\n this.createMoreIndicator(allDayRow, count, wIndex);\n }\n }\n allDayRowCell.setAttribute('data-count', this.allDayLevel.toString());\n var allDayRowHeight = ((!this.parent.uiStateValues.expand && this.allDayLevel > 2) ?\n (3 * appHeight) : ((this.allDayLevel + 1) * appHeight)) + 4;\n this.setAllDayRowHeight(allDayRowHeight);\n this.addOrRemoveClass();\n this.wireAppointmentEvents(appointmentElement, true, eventObj);\n }\n }\n };\n VerticalEvent.prototype.renderNormalEvents = function (eventObj, dayIndex, resource, dayCount) {\n var record = this.isSpannedEvent(eventObj, dayIndex, resource);\n var eStart = record[this.fields.startTime];\n var eEnd = record[this.fields.endTime];\n var appWidth = '0%';\n var appLeft = '0%';\n var topValue = 0;\n var currentDate = util.resetTime(new Date(this.dateRender[resource][dayIndex].getTime()));\n var schedule = util.getStartEndHours(currentDate, this.startHour, this.endHour);\n var isValidEvent = this.isValidEvent(eventObj, eStart, eEnd, schedule);\n if (eStart <= eEnd && isValidEvent) {\n var appHeight = this.getHeight(eStart, eEnd);\n if (eStart.getTime() > schedule.startHour.getTime()) {\n topValue = this.getTopValue(eStart, dayIndex, resource);\n }\n var appIndex = this.getOverlapIndex(record, dayIndex, false, resource);\n record.Index = appIndex;\n this.overlapList.push(record);\n if (this.overlapList.length > 1) {\n if (isNullOrUndefined(this.overlapEvents[appIndex])) {\n this.overlapEvents[appIndex] = [];\n }\n this.overlapEvents[appIndex].push(record);\n }\n else {\n this.overlapEvents = [];\n this.overlapEvents.push([record]);\n }\n var width = this.parent.currentView === 'Day' ? 97 : 94;\n appWidth = ((width - this.overlapEvents.length) / this.overlapEvents.length) + '%';\n var argsData = {\n index: appIndex, left: appLeft, width: appWidth,\n day: dayIndex, dayIndex: dayCount, record: record, resource: resource\n };\n var tempData = this.adjustOverlapElements(argsData);\n appWidth = (tempData.appWidth);\n if (isNullOrUndefined(this.renderedEvents[resource])) {\n this.renderedEvents[resource] = [];\n }\n this.renderedEvents[resource].push(extend({}, record, null, true));\n var appointmentElement = this.createAppointmentElement(eventObj, false, record.isSpanned, resource);\n setStyleAttribute(appointmentElement, { 'width': tempData.appWidth, 'height': appHeight + 'px', 'top': topValue + 'px' });\n var iconHeight = appointmentElement.querySelectorAll('.' + cls.EVENT_INDICATOR_CLASS).length * 15;\n var maxHeight = appHeight - 40 - iconHeight;\n var subjectElement = appointmentElement.querySelector('.' + cls.SUBJECT_CLASS);\n if (!this.parent.isAdaptive && subjectElement) {\n subjectElement.style.maxHeight = formatUnit(maxHeight);\n }\n var index = this.parent.activeViewOptions.group.byDate ? (this.resources.length * dayIndex) + resource : dayCount;\n this.appendEvent(eventObj, appointmentElement, index, tempData.appLeft);\n this.wireAppointmentEvents(appointmentElement, false, eventObj);\n }\n };\n VerticalEvent.prototype.getTopValue = function (date, day, resource) {\n var startEndHours = util.getStartEndHours(util.resetTime(this.dateRender[resource][day]), this.startHour, this.endHour);\n var startHour = startEndHours.startHour;\n var diffInMinutes = ((date.getHours() - startHour.getHours()) * 60) + (date.getMinutes() - startHour.getMinutes());\n return (diffInMinutes * this.cellHeight * this.slotCount) / this.interval;\n };\n VerticalEvent.prototype.getOverlapIndex = function (record, day, isAllDay, resource) {\n var _this = this;\n var fieldMapping = this.parent.eventFields;\n var predicate;\n var eventsList = [];\n var appIndex = -1;\n this.overlapEvents = [];\n if (isAllDay) {\n if (!isNullOrUndefined(this.renderedAllDayEvents[resource])) {\n var date_1 = util.resetTime(new Date(this.dateRender[resource][day].getTime()));\n eventsList = this.renderedAllDayEvents[resource].filter(function (app) {\n return util.resetTime(app[fieldMapping.startTime]).getTime() <= date_1.getTime() &&\n util.resetTime(app[fieldMapping.endTime]).getTime() >= date_1.getTime();\n });\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n eventsList = this.filterEventsByResource(this.resources[resource], eventsList);\n }\n }\n }\n else {\n var appointmentList_1 = !isNullOrUndefined(this.renderedEvents[resource]) ? this.renderedEvents[resource] : [];\n var appointment_1 = [];\n predicate = new Predicate(fieldMapping.endTime, 'greaterthan', record[fieldMapping.startTime]).\n and(new Predicate(fieldMapping.startTime, 'lessthan', record[fieldMapping.endTime]));\n this.overlapList = new DataManager({ json: appointmentList_1 }).executeLocal(new Query().where(predicate));\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n this.overlapList = this.filterEventsByResource(this.resources[resource], this.overlapList);\n }\n this.overlapList.forEach(function (obj) {\n predicate = new Predicate(fieldMapping.endTime, 'greaterthanorequal', obj[fieldMapping.startTime]).\n and(new Predicate(fieldMapping.startTime, 'lessthanorequal', obj[fieldMapping.endTime]));\n var filterList = new DataManager({ json: appointmentList_1 }).executeLocal(new Query().where(predicate));\n if (_this.parent.activeViewOptions.group.resources.length > 0) {\n filterList = _this.filterEventsByResource(_this.resources[resource], filterList);\n }\n var collection = _this.overlapList.filter(function (val) { return filterList.indexOf(val) === -1; });\n return appointment_1.concat(collection);\n });\n this.overlapList = this.overlapList.concat(appointment_1);\n eventsList = this.overlapList;\n for (var _i = 0, eventsList_1 = eventsList; _i < eventsList_1.length; _i++) {\n var event_3 = eventsList_1[_i];\n var record_1 = event_3;\n var index = record_1.Index;\n (isNullOrUndefined(this.overlapEvents[index])) ? this.overlapEvents[index] = [event_3] :\n this.overlapEvents[index].push(event_3);\n }\n }\n if (eventsList.length > 0) {\n var appLevel = eventsList.map(function (obj) { return obj.Index; });\n appIndex = (appLevel.length > 0) ? this.getSmallestMissingNumber(appLevel) : 0;\n }\n return (appIndex === -1) ? 0 : appIndex;\n };\n VerticalEvent.prototype.adjustOverlapElements = function (args) {\n var data = { appWidth: args.width, appLeft: args.left };\n for (var i = 0, length1 = this.overlapEvents.length; i < length1; i++) {\n if (!isNullOrUndefined(this.overlapEvents[i])) {\n for (var j = 0, length2 = this.overlapEvents[i].length; j < length2; j++) {\n var dayCount = this.parent.activeViewOptions.group.byDate ? (this.resources.length * args.day) + args.resource :\n args.dayIndex;\n var element = this.element.querySelector('#e-appointment-wrapper-' + dayCount);\n if (element.childElementCount > 0) {\n var eleGuid = this.overlapEvents[i][j].Guid;\n if (element.querySelectorAll('div[data-guid=\"' + eleGuid + '\"]').length > 0 && eleGuid !== args.record.Guid) {\n var apps = element.querySelector('div[data-guid=\"' + eleGuid + '\"]');\n if (parseFloat(args.width) <= parseFloat(apps.style.width)) {\n (this.parent.enableRtl) ? apps.style.right = ((parseFloat(args.width) + 1) * i) + '%' :\n apps.style.left = ((parseFloat(args.width) + 1) * i) + '%';\n apps.style.width = ((parseFloat(args.width))) + '%';\n data.appWidth = apps.style.width;\n }\n }\n else {\n var appWidth = args.width;\n if (isNullOrUndefined(this.overlapEvents[i - 1])) {\n var width = this.parent.currentView === 'Day' ? 97 : 94;\n appWidth = ((width - this.overlapEvents.length) / this.overlapEvents.length) + '%';\n }\n data.appWidth = appWidth;\n data.appLeft = ((parseInt(appWidth, 0) + 1) * args.index) + '%';\n }\n }\n }\n }\n }\n return data;\n };\n VerticalEvent.prototype.setAllDayRowHeight = function (height) {\n for (var _i = 0, _a = this.allDayElement; _i < _a.length; _i++) {\n var element = _a[_i];\n element.style.height = (height / 12) + 'em';\n }\n this.animation.animate(this.allDayElement[0]);\n };\n VerticalEvent.prototype.addOrRemoveClass = function () {\n var _this = this;\n this.moreEvents.filter(function (element) {\n if (!_this.parent.uiStateValues.expand && _this.allDayLevel > 2) {\n addClass([element], cls.EVENT_COUNT_CLASS);\n element.setAttribute('tabindex', '-1');\n }\n else {\n removeClass([element], cls.EVENT_COUNT_CLASS);\n element.setAttribute('tabindex', '0');\n }\n });\n var moreEventCount = this.element.querySelector('.' + cls.ALLDAY_APPOINTMENT_SECTION_CLASS);\n if (this.parent.uiStateValues.expand) {\n removeClass([moreEventCount], cls.APPOINTMENT_ROW_EXPAND_CLASS);\n addClass([moreEventCount], cls.APPOINTMENT_ROW_COLLAPSE_CLASS);\n }\n else {\n removeClass([moreEventCount], cls.APPOINTMENT_ROW_COLLAPSE_CLASS);\n addClass([moreEventCount], cls.APPOINTMENT_ROW_EXPAND_CLASS);\n }\n (this.allDayLevel > 2) ? removeClass([moreEventCount], cls.DISABLE_CLASS) : addClass([moreEventCount], cls.DISABLE_CLASS);\n var countCell = [].slice.call(this.element.querySelectorAll('.' + cls.ROW_COUNT_WRAPPER_CLASS));\n countCell.filter(function (element) {\n (!_this.parent.uiStateValues.expand && _this.allDayLevel > 2) ? removeClass([element], cls.DISABLE_CLASS) :\n addClass([element], cls.DISABLE_CLASS);\n });\n };\n VerticalEvent.prototype.getEventHeight = function () {\n var eventElement = createElement('div', { className: cls.APPOINTMENT_CLASS, styles: 'visibility:hidden' });\n var eventWrapper = this.element.querySelector('.' + cls.ALLDAY_APPOINTMENT_WRAPPER_CLASS + ':first-child');\n eventWrapper.appendChild(eventElement);\n var height = eventElement.offsetHeight;\n remove(eventElement);\n return height;\n };\n VerticalEvent.prototype.rowExpandCollapse = function () {\n var target = this.element.querySelector('.' + cls.ALLDAY_APPOINTMENT_SECTION_CLASS);\n this.parent.uiStateValues.expand = target.classList.contains(cls.APPOINTMENT_ROW_EXPAND_CLASS);\n var rowHeight;\n if (this.parent.uiStateValues.expand) {\n target.setAttribute('title', 'Collapse-all-day-section');\n target.setAttribute('aria-label', 'Collapse section');\n rowHeight = ((this.allDayLevel + 1) * this.getEventHeight()) + 4;\n }\n else {\n target.setAttribute('title', 'Expand-all-day-section');\n target.setAttribute('aria-label', 'Expand section');\n rowHeight = (3 * this.getEventHeight()) + 4;\n }\n this.setAllDayRowHeight(rowHeight);\n this.addOrRemoveClass();\n this.animation.animate(target);\n };\n VerticalEvent.prototype.animationUiUpdate = function () {\n this.parent.notify(events.contentReady, {});\n };\n return VerticalEvent;\n}(EventBase));\nexport { VerticalEvent };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { append, prepend, createElement, extend, EventHandler, closest, addClass } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, setStyleAttribute, remove } from '@syncfusion/ej2-base';\nimport { EventBase } from './event-base';\nimport * as cls from '../base/css-constant';\nimport * as events from '../base/constant';\nimport * as util from '../base/util';\nvar EVENT_GAP = 0;\n/**\n * Month view events render\n */\nvar MonthEvent = /** @class */ (function (_super) {\n __extends(MonthEvent, _super);\n /**\n * Constructor for month events\n */\n function MonthEvent(parent) {\n var _this = _super.call(this, parent) || this;\n _this.renderedEvents = [];\n _this.moreIndicatorHeight = 19;\n _this.renderType = 'day';\n _this.element = _this.parent.activeView.getPanel();\n _this.fields = _this.parent.eventFields;\n _this.addEventListener();\n return _this;\n }\n MonthEvent.prototype.renderAppointments = function () {\n var appointmentWrapper = [].slice.call(this.element.querySelectorAll('.' + cls.APPOINTMENT_WRAPPER_CLASS));\n for (var _i = 0, appointmentWrapper_1 = appointmentWrapper; _i < appointmentWrapper_1.length; _i++) {\n var wrap = appointmentWrapper_1[_i];\n remove(wrap);\n }\n this.removeHeightProperty(cls.CONTENT_TABLE_CLASS);\n if (!this.element.querySelector('.' + cls.WORK_CELLS_CLASS)) {\n return;\n }\n this.eventHeight = util.getElementHeightFromClass(this.element, cls.APPOINTMENT_CLASS);\n if (this.parent.currentView === 'Month') {\n this.monthHeaderHeight = util.getOuterHeight(this.element.querySelector('.' + cls.DATE_HEADER_CLASS));\n }\n else {\n this.monthHeaderHeight = 0;\n }\n var conWrap = this.parent.element.querySelector('.' + cls.CONTENT_WRAP_CLASS);\n var scrollTop = conWrap.scrollTop;\n if (this.parent.rowAutoHeight && this.parent.virtualScrollModule && !isNullOrUndefined(this.parent.currentAction)) {\n conWrap.scrollTop = conWrap.scrollTop - 1;\n }\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n this.renderResourceEvents();\n }\n else {\n this.renderEventsHandler(this.parent.activeView.renderDates, this.parent.activeViewOptions.workDays);\n }\n if (this.parent.rowAutoHeight) {\n this.updateBlockElements();\n var data = {\n cssProperties: this.parent.getCssProperties(),\n module: this.parent.getModuleName(),\n isPreventScrollUpdate: true\n };\n if (this.parent.virtualScrollModule) {\n if (this.parent.currentAction) {\n conWrap.scrollTop = scrollTop;\n this.parent.currentAction = null;\n }\n else {\n this.parent.virtualScrollModule.updateVirtualScrollHeight();\n }\n }\n this.parent.notify(events.scrollUiUpdate, data);\n }\n };\n MonthEvent.prototype.renderEventsHandler = function (dateRender, workDays, resData) {\n this.renderedEvents = [];\n var eventsList;\n var blockList;\n var resIndex = 0;\n if (resData) {\n resIndex = resData.groupIndex;\n this.cssClass = resData.cssClass;\n this.groupOrder = resData.groupOrder;\n eventsList = this.parent.eventBase.filterEventsByResource(resData, this.parent.eventsProcessed);\n blockList = this.parent.eventBase.filterEventsByResource(resData, this.parent.blockProcessed);\n this.workCells = [].slice.call(this.element.querySelectorAll('.' + cls.WORK_CELLS_CLASS + '[data-group-index=\"' + resIndex + '\"]'));\n }\n else {\n eventsList = this.parent.eventsProcessed;\n blockList = this.parent.blockProcessed;\n this.workCells = [].slice.call(this.element.querySelectorAll('.' + cls.WORK_CELLS_CLASS));\n }\n this.sortByDateTime(eventsList);\n this.sortByDateTime(blockList);\n this.cellWidth = this.workCells.slice(-1)[0].offsetWidth;\n this.cellHeight = this.workCells.slice(-1)[0].offsetHeight;\n this.dateRender = dateRender;\n this.getSlotDates(workDays);\n this.processBlockEvents(blockList, resIndex, resData);\n for (var _i = 0, eventsList_1 = eventsList; _i < eventsList_1.length; _i++) {\n var event_1 = eventsList_1[_i];\n if (this.parent.resourceBase && !resData) {\n this.cssClass = this.parent.resourceBase.getCssClass(event_1);\n }\n var splittedEvents = this.splitEvent(event_1, this.dateRender);\n for (var _a = 0, splittedEvents_1 = splittedEvents; _a < splittedEvents_1.length; _a++) {\n var event_2 = splittedEvents_1[_a];\n this.updateIndicatorIcon(event_2);\n this.renderEvents(event_2, resIndex);\n }\n }\n this.cssClass = null;\n this.groupOrder = null;\n };\n MonthEvent.prototype.processBlockEvents = function (blockEvents, resIndex, resData) {\n for (var _i = 0, blockEvents_1 = blockEvents; _i < blockEvents_1.length; _i++) {\n var event_3 = blockEvents_1[_i];\n if (this.parent.resourceBase && !resData) {\n this.cssClass = this.parent.resourceBase.getCssClass(event_3);\n }\n var blockSpannedList = [];\n if (this.renderType === 'day' && !event_3[this.fields.isAllDay]) {\n var temp = extend({}, event_3, null, true);\n var isSameDate = this.isSameDate(temp[this.fields.startTime], temp[this.fields.endTime]);\n temp.isBlockIcon = isSameDate;\n if (!isSameDate && util.getDateInMs(temp[this.fields.startTime]) > 0) {\n var e = extend({}, event_3, null, true);\n e[this.fields.endTime] = util.addDays(util.resetTime(new Date(event_3[this.fields.startTime] + '')), 1);\n e.isBlockIcon = true;\n temp[this.fields.startTime] = e[this.fields.endTime];\n blockSpannedList.push(e);\n }\n isSameDate = this.isSameDate(temp[this.fields.startTime], temp[this.fields.endTime]);\n if (!isSameDate && util.getDateInMs(temp[this.fields.endTime]) > 0) {\n var e = extend({}, event_3, null, true);\n e[this.fields.startTime] = util.resetTime(new Date(event_3[this.fields.endTime] + ''));\n e.isBlockIcon = true;\n blockSpannedList.push(e);\n temp[this.fields.endTime] = e[this.fields.startTime];\n }\n blockSpannedList.push(temp);\n }\n else {\n blockSpannedList.push(event_3);\n }\n for (var _a = 0, blockSpannedList_1 = blockSpannedList; _a < blockSpannedList_1.length; _a++) {\n var blockEvent = blockSpannedList_1[_a];\n var splittedEvents = this.splitEvent(blockEvent, this.dateRender);\n for (var _b = 0, splittedEvents_2 = splittedEvents; _b < splittedEvents_2.length; _b++) {\n var event_4 = splittedEvents_2[_b];\n this.renderBlockEvents(event_4, resIndex, !!blockEvent.isBlockIcon);\n }\n }\n }\n };\n MonthEvent.prototype.isSameDate = function (start, end) {\n return new Date(+start).setHours(0, 0, 0, 0) === new Date(+end).setHours(0, 0, 0, 0);\n };\n MonthEvent.prototype.renderBlockEvents = function (event, resIndex, isIcon) {\n var eventData = event.data;\n var startTime = this.getStartTime(event, eventData);\n var endTime = this.getEndTime(event, eventData);\n var day = this.parent.getIndexOfDate(this.dateRender, util.resetTime(new Date(startTime.getTime())));\n if (day < 0 || startTime > endTime) {\n return;\n }\n var cellTd = this.getCellTd(day);\n var position = this.getPosition(startTime, endTime, event[this.fields.isAllDay], day);\n if (!isIcon) {\n var diffInDays = eventData.count;\n var appWidth = this.getEventWidth(startTime, endTime, event[this.fields.isAllDay], diffInDays);\n appWidth = (appWidth <= 0) ? this.cellWidth : appWidth;\n var appLeft = (this.parent.enableRtl) ? 0 : position;\n var appRight = (this.parent.enableRtl) ? position : 0;\n var appHeight = this.cellHeight - this.monthHeaderHeight;\n var appTop = this.getRowTop(resIndex);\n var blockElement = this.createBlockAppointmentElement(event, resIndex);\n setStyleAttribute(blockElement, {\n 'width': appWidth + 'px', 'height': appHeight + 'px', 'left': appLeft + 'px', 'right': appRight + 'px', 'top': appTop + 'px'\n });\n this.renderEventElement(event, blockElement, cellTd);\n }\n else {\n this.renderBlockIndicator(cellTd, position, resIndex);\n }\n };\n MonthEvent.prototype.renderBlockIndicator = function (cellTd, position, resIndex) {\n var blockIndicator = createElement('div', { className: 'e-icons ' + cls.BLOCK_INDICATOR_CLASS });\n if (isNullOrUndefined(cellTd.querySelector('.' + cls.BLOCK_INDICATOR_CLASS))) {\n cellTd.appendChild(blockIndicator);\n }\n };\n MonthEvent.prototype.getStartTime = function (event, eventData) {\n return event[this.fields.startTime];\n };\n MonthEvent.prototype.getEndTime = function (event, eventData) {\n return event[this.fields.endTime];\n };\n MonthEvent.prototype.getCellTd = function (day) {\n return this.workCells[day];\n };\n MonthEvent.prototype.getEventWidth = function (startDate, endDate, isAllDay, count) {\n return count * this.cellWidth - 1;\n };\n MonthEvent.prototype.getPosition = function (startTime, endTime, isAllDay, day) {\n return 0;\n };\n MonthEvent.prototype.getRowTop = function (resIndex) {\n return 0;\n };\n MonthEvent.prototype.updateIndicatorIcon = function (event) {\n if (this.parent.currentView.indexOf('Timeline') === -1 || this.parent.currentView === 'TimelineMonth'\n || event[this.fields.isAllDay]) {\n return;\n }\n var cloneData = event.data;\n var startHour = util.getStartEndHours(event[this.fields.startTime], this.parent.activeView.getStartHour(), this.parent.activeView.getEndHour());\n var endHour = util.getStartEndHours(event[this.fields.endTime], this.parent.activeView.getStartHour(), this.parent.activeView.getEndHour());\n cloneData.isLeft = cloneData.isLeft || cloneData[this.fields.startTime].getTime() < startHour.startHour.getTime();\n cloneData.isRight = cloneData.isRight || cloneData[this.fields.endTime].getTime() > endHour.endHour.getTime();\n };\n MonthEvent.prototype.renderResourceEvents = function () {\n var resources = this.parent.uiStateValues.isGroupAdaptive ?\n [this.parent.resourceBase.lastResourceLevel[this.parent.uiStateValues.groupIndex]] :\n this.parent.resourceBase.lastResourceLevel;\n for (var _i = 0, resources_1 = resources; _i < resources_1.length; _i++) {\n var slotData = resources_1[_i];\n this.renderEventsHandler(slotData.renderDates, slotData.workDays, slotData);\n }\n };\n MonthEvent.prototype.getSlotDates = function (workDays) {\n this.slots = [];\n var dates = this.dateRender.map(function (date) { return +date; });\n var noOfDays = this.parent.activeViewOptions.showWeekend ? util.WEEK_LENGTH : workDays.length;\n while (dates.length > 0) {\n this.slots.push(dates.splice(0, noOfDays));\n }\n };\n MonthEvent.prototype.createAppointmentElement = function (record, resIndex) {\n var eventSubject = (record[this.fields.subject] || this.parent.eventSettings.fields.subject.default);\n var appointmentWrapper = createElement('div', {\n className: cls.APPOINTMENT_CLASS,\n attrs: {\n 'data-id': 'Appointment_' + record[this.fields.id],\n 'data-guid': record.Guid, 'role': 'button', 'tabindex': '0',\n 'aria-readonly': this.parent.eventBase.getReadonlyAttribute(record), 'aria-selected': 'false', 'aria-grabbed': 'true',\n 'aria-label': eventSubject\n }\n });\n if (!isNullOrUndefined(this.cssClass)) {\n addClass([appointmentWrapper], this.cssClass);\n }\n if (record[this.fields.isReadonly]) {\n addClass([appointmentWrapper], 'e-read-only');\n }\n var appointmentDetails = createElement('div', { className: cls.APPOINTMENT_DETAILS });\n appointmentWrapper.appendChild(appointmentDetails);\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n appointmentWrapper.setAttribute('data-group-index', resIndex.toString());\n }\n var templateElement;\n var eventData = record.data;\n if (!isNullOrUndefined(this.parent.activeViewOptions.eventTemplate)) {\n templateElement = this.parent.getAppointmentTemplate()(record);\n }\n else {\n var eventLocation = (record[this.fields.location] || this.parent.eventSettings.fields.location.default || '');\n var appointmentSubject = createElement('div', {\n className: cls.SUBJECT_CLASS,\n innerHTML: (eventSubject + (eventLocation ? '; ' + eventLocation : ''))\n });\n var appointmentStartTime = createElement('div', {\n className: cls.APPOINTMENT_TIME + (this.parent.isAdaptive ? ' ' + cls.DISABLE_CLASS : ''),\n innerHTML: this.parent.getTimeString(eventData[this.fields.startTime])\n });\n var appointmentEndTime = createElement('div', {\n className: cls.APPOINTMENT_TIME + (this.parent.isAdaptive ? ' ' + cls.DISABLE_CLASS : ''),\n innerHTML: this.parent.getTimeString(eventData[this.fields.endTime])\n });\n if (this.parent.currentView === 'Month') {\n if (record[this.fields.isAllDay]) {\n templateElement = [appointmentSubject];\n addClass([appointmentSubject], 'e-text-center');\n }\n else if (eventData.count <= 1 && !eventData.isLeft && !eventData.isRight) {\n templateElement = [appointmentStartTime, appointmentSubject];\n }\n else {\n templateElement = [];\n addClass([appointmentSubject], 'e-text-center');\n if (!eventData.isLeft) {\n templateElement.push(appointmentStartTime);\n }\n templateElement.push(appointmentSubject);\n if (!eventData.isRight) {\n templateElement.push(appointmentEndTime);\n }\n }\n }\n else {\n var innerElement = void 0;\n if (record[this.fields.isAllDay]) {\n var allDayString = createElement('div', {\n className: cls.APPOINTMENT_TIME, innerHTML: this.parent.localeObj.getConstant('allDay')\n });\n innerElement = [appointmentSubject, allDayString];\n }\n else {\n var timeString = this.parent.getTimeString(eventData[this.fields.startTime])\n + ' - ' + this.parent.getTimeString(eventData[this.fields.endTime]);\n var appTime = createElement('div', {\n className: cls.APPOINTMENT_TIME + (this.parent.isAdaptive ? ' ' + cls.DISABLE_CLASS : ''), innerHTML: timeString,\n });\n var appLocation = createElement('div', { className: cls.LOCATION_CLASS, innerHTML: eventLocation });\n innerElement = [appointmentSubject, appTime, appLocation];\n }\n var wrap = createElement('div', { className: 'e-inner-wrap' });\n append(innerElement, wrap);\n templateElement = [wrap];\n }\n }\n append(templateElement, appointmentDetails);\n this.appendEventIcons(record, appointmentDetails);\n this.renderResizeHandler(appointmentWrapper, record.data, record[this.fields.isReadonly]);\n return appointmentWrapper;\n };\n MonthEvent.prototype.appendEventIcons = function (record, appointmentDetails) {\n var eventData = record.data;\n if (!isNullOrUndefined(record[this.fields.recurrenceRule]) || !isNullOrUndefined(record[this.fields.recurrenceID])) {\n var iconClass = (record[this.fields.id] === record[this.fields.recurrenceID]) ?\n cls.EVENT_RECURRENCE_ICON_CLASS : cls.EVENT_RECURRENCE_EDIT_ICON_CLASS;\n appointmentDetails.appendChild(createElement('div', {\n className: cls.ICON + ' ' + iconClass + (this.parent.isAdaptive ? ' ' + cls.DISABLE_CLASS : '')\n }));\n }\n if (eventData.isLeft) {\n var iconLeft = createElement('div', {\n className: cls.EVENT_INDICATOR_CLASS + ' ' + cls.ICON + ' ' + cls.EVENT_ICON_LEFT_CLASS\n });\n prepend([iconLeft], appointmentDetails);\n }\n if (eventData.isRight) {\n var iconRight = createElement('div', {\n className: cls.EVENT_INDICATOR_CLASS + ' ' + cls.ICON + ' ' + cls.EVENT_ICON_RIGHT_CLASS\n });\n append([iconRight], appointmentDetails);\n }\n };\n MonthEvent.prototype.renderEvents = function (event, resIndex) {\n var startTime = event[this.fields.startTime];\n var endTime = event[this.fields.endTime];\n var day = this.parent.getIndexOfDate(this.dateRender, util.resetTime(startTime));\n if (day < 0) {\n return;\n }\n var overlapCount = this.getIndex(startTime);\n event.Index = overlapCount;\n var appHeight = this.eventHeight;\n this.renderedEvents.push(extend({}, event, null, true));\n var diffInDays = event.data.count;\n if (startTime.getTime() <= endTime.getTime()) {\n var appWidth = (diffInDays * this.cellWidth) - 3;\n var cellTd = this.workCells[day];\n var appTop = (overlapCount * (appHeight + EVENT_GAP));\n var height = this.monthHeaderHeight + ((overlapCount + 1) * (appHeight + EVENT_GAP)) + this.moreIndicatorHeight;\n if ((this.cellHeight > height) || this.parent.rowAutoHeight) {\n var appointmentElement = this.createAppointmentElement(event, resIndex);\n this.applyResourceColor(appointmentElement, event, 'backgroundColor', this.groupOrder);\n this.wireAppointmentEvents(appointmentElement, false, event);\n setStyleAttribute(appointmentElement, { 'width': appWidth + 'px', 'top': appTop + 'px' });\n this.renderEventElement(event, appointmentElement, cellTd);\n if (this.parent.rowAutoHeight) {\n var firstChild = cellTd.parentElement.firstChild;\n this.updateCellHeight(firstChild, height);\n }\n }\n else {\n for (var i = 0; i < diffInDays; i++) {\n var cellTd_1 = this.workCells[day + i];\n if (cellTd_1 && isNullOrUndefined(cellTd_1.querySelector('.' + cls.MORE_INDICATOR_CLASS))) {\n var startDate = new Date(this.dateRender[day + i].getTime());\n var endDate = util.addDays(this.dateRender[day + i], 1);\n var groupIndex = cellTd_1.getAttribute('data-group-index');\n var filterEvents = this.getFilteredEvents(startDate, endDate, groupIndex);\n var appArea = this.cellHeight - this.monthHeaderHeight - this.moreIndicatorHeight;\n var renderedAppCount = Math.floor(appArea / (appHeight + EVENT_GAP));\n var count = (filterEvents.length - renderedAppCount) <= 0 ? 1 : (filterEvents.length - renderedAppCount);\n var moreIndicatorElement = this.getMoreIndicatorElement(count, startDate, endDate);\n if (!isNullOrUndefined(groupIndex)) {\n moreIndicatorElement.setAttribute('data-group-index', groupIndex);\n }\n moreIndicatorElement.style.top = appArea + 'px';\n moreIndicatorElement.style.width = cellTd_1.offsetWidth - 2 + 'px';\n this.renderElement(cellTd_1, moreIndicatorElement);\n EventHandler.add(moreIndicatorElement, 'click', this.moreIndicatorClick, this);\n }\n }\n }\n }\n };\n MonthEvent.prototype.updateCellHeight = function (cell, height) {\n if ((height > cell.offsetHeight)) {\n setStyleAttribute(cell, { 'height': height + 'px' });\n }\n };\n MonthEvent.prototype.updateBlockElements = function () {\n var blockElement = [].slice.call(this.element.querySelectorAll('.' + cls.BLOCK_APPOINTMENT_CLASS));\n for (var _i = 0, blockElement_1 = blockElement; _i < blockElement_1.length; _i++) {\n var element = blockElement_1[_i];\n var target = closest(element, 'tr');\n element.style.height = ((target.offsetHeight - 1) - this.monthHeaderHeight) + 'px';\n var firstChild = target.firstChild;\n var width = Math.round(element.offsetWidth / firstChild.offsetWidth);\n element.style.width = (firstChild.offsetWidth * width) + 'px';\n }\n };\n MonthEvent.prototype.getFilteredEvents = function (startDate, endDate, groupIndex) {\n var filteredEvents;\n if (isNullOrUndefined(groupIndex)) {\n filteredEvents = this.filterEvents(startDate, endDate);\n }\n else {\n var data = this.parent.resourceBase.lastResourceLevel[parseInt(groupIndex, 10)];\n filteredEvents = this.filterEvents(startDate, endDate, undefined, data);\n }\n return filteredEvents;\n };\n MonthEvent.prototype.getOverlapEvents = function (date, appointments) {\n var appointmentsList = [];\n for (var _i = 0, appointments_1 = appointments; _i < appointments_1.length; _i++) {\n var app = appointments_1[_i];\n if ((util.resetTime(app[this.fields.startTime]).getTime() <= util.resetTime(date).getTime()) &&\n (util.resetTime(app[this.fields.endTime]).getTime() >= util.resetTime(date).getTime())) {\n appointmentsList.push(app);\n }\n }\n return appointmentsList;\n };\n MonthEvent.prototype.getIndex = function (date) {\n var appIndex = -1;\n var appointments = this.renderedEvents;\n if (appointments.length > 0) {\n var appointmentsList = this.getOverlapEvents(date, appointments);\n var appLevel = appointmentsList.map(function (obj) { return obj.Index; });\n appIndex = (appLevel.length > 0) ? this.getSmallestMissingNumber(appLevel) : 0;\n }\n return (appIndex === -1) ? 0 : appIndex;\n };\n MonthEvent.prototype.moreIndicatorClick = function (event) {\n var target = closest(event.target, '.' + cls.MORE_INDICATOR_CLASS);\n var startDate = new Date(parseInt(target.getAttribute('data-start-date'), 10));\n if (!isNullOrUndefined(startDate) && this.parent.isAdaptive) {\n this.parent.setProperties({ selectedDate: startDate }, true);\n this.parent.changeView(this.parent.getNavigateView());\n }\n else {\n var endDate = new Date(parseInt(target.getAttribute('data-end-date'), 10));\n var groupIndex = target.getAttribute('data-group-index');\n var filteredEvents = this.getFilteredEvents(startDate, endDate, groupIndex);\n var moreEventArgs = { date: startDate, event: filteredEvents, element: event.target };\n this.parent.quickPopup.moreEventClick(moreEventArgs, endDate, groupIndex);\n }\n };\n MonthEvent.prototype.renderEventElement = function (event, appointmentElement, cellTd) {\n var eventType = appointmentElement.classList.contains(cls.BLOCK_APPOINTMENT_CLASS) ? 'blockEvent' : 'event';\n var args = { data: event, element: appointmentElement, cancel: false, type: eventType };\n this.parent.trigger(events.eventRendered, args);\n if (args.cancel) {\n this.renderedEvents.pop();\n return;\n }\n this.renderElement(cellTd, appointmentElement);\n };\n MonthEvent.prototype.renderElement = function (cellTd, element) {\n if (cellTd.querySelector('.' + cls.APPOINTMENT_WRAPPER_CLASS)) {\n cellTd.querySelector('.' + cls.APPOINTMENT_WRAPPER_CLASS).appendChild(element);\n }\n else {\n var wrapper = createElement('div', { className: cls.APPOINTMENT_WRAPPER_CLASS });\n wrapper.appendChild(element);\n cellTd.appendChild(wrapper);\n }\n };\n MonthEvent.prototype.getMoreIndicatorElement = function (count, startDate, endDate) {\n var moreIndicatorElement = createElement('div', {\n className: cls.MORE_INDICATOR_CLASS,\n innerHTML: '+' + count + ' ' + (this.parent.isAdaptive ? '' : this.parent.localeObj.getConstant('more')),\n attrs: {\n 'tabindex': '0',\n 'data-start-date': startDate.getTime().toString(),\n 'data-end-date': endDate.getTime().toString()\n }\n });\n return moreIndicatorElement;\n };\n MonthEvent.prototype.removeHeightProperty = function (selector) {\n var rows = [].slice.call(this.element.querySelectorAll('.' + selector + ' tbody tr'));\n for (var _i = 0, rows_1 = rows; _i < rows_1.length; _i++) {\n var row = rows_1[_i];\n row.firstChild.style.height = '';\n }\n };\n return MonthEvent;\n}(EventBase));\nexport { MonthEvent };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { compile, isNullOrUndefined, extend, EventHandler, formatUnit, Browser } from '@syncfusion/ej2-base';\nimport { createElement, remove, addClass, removeClass, append, prepend } from '@syncfusion/ej2-base';\nimport { WorkCellInteraction } from '../actions/work-cells';\nimport { ViewBase } from './view-base';\nimport { VerticalEvent } from '../event-renderer/vertical-view';\nimport { MonthEvent } from '../event-renderer/month';\nimport * as util from '../base/util';\nimport * as event from '../base/constant';\nimport * as cls from '../base/css-constant';\nvar MAJOR_SLOT_TEMPLATE = '${getTime(date)}';\nvar MINOR_SLOT_TEMPLATE = ' ';\n/**\n * vertical view\n */\nvar VerticalView = /** @class */ (function (_super) {\n __extends(VerticalView, _super);\n /**\n * Constructor for vertical view\n */\n function VerticalView(parent) {\n var _this = _super.call(this, parent) || this;\n _this.viewClass = 'e-day-view';\n _this.isInverseTableSelect = true;\n _this.baseCssClass = 'e-vertical-view';\n _this.dateHeaderTemplate = '${getDayName(date)}
' +\n '${getDate(date)}
';\n _this.workCellAction = new WorkCellInteraction(parent);\n return _this;\n }\n VerticalView.prototype.addEventListener = function () {\n this.parent.on(event.scrollUiUpdate, this.scrollUiUpdate, this);\n this.parent.on(event.dataReady, this.renderEvents, this);\n };\n VerticalView.prototype.removeEventListener = function () {\n this.parent.off(event.scrollUiUpdate, this.scrollUiUpdate);\n this.parent.off(event.dataReady, this.renderEvents);\n };\n VerticalView.prototype.renderEvents = function () {\n if (this.parent.activeViewOptions.timeScale.enable) {\n var appointment = new VerticalEvent(this.parent);\n appointment.renderAppointments();\n }\n else {\n var appointment = new MonthEvent(this.parent);\n appointment.renderAppointments();\n }\n };\n VerticalView.prototype.onContentScroll = function (e) {\n this.parent.removeNewEventElement();\n var target = e.target;\n this.parent.notify(event.virtualScroll, e);\n this.scrollLeftPanel(target);\n this.scrollTopPanel(target);\n if (!this.parent.isAdaptive) {\n this.parent.uiStateValues.top = target.scrollTop;\n }\n this.parent.uiStateValues.left = target.scrollLeft;\n if (!isNullOrUndefined(this.parent.quickPopup)) {\n this.parent.quickPopup.quickPopupHide();\n }\n };\n VerticalView.prototype.onApaptiveMove = function (e) {\n if (this.parent.uiStateValues.action) {\n e.preventDefault();\n }\n };\n VerticalView.prototype.onApaptiveScroll = function (e) {\n this.parent.removeNewEventElement();\n this.parent.uiStateValues.top = e.target.scrollTop;\n };\n VerticalView.prototype.scrollLeftPanel = function (target) {\n var leftPanel = this.getLeftPanelElement();\n if (!isNullOrUndefined(leftPanel)) {\n leftPanel.scrollTop = target.scrollTop;\n }\n };\n VerticalView.prototype.scrollUiUpdate = function (args) {\n var headerBarHeight = this.getHeaderBarHeight();\n var timecells = this.getLeftPanelElement();\n var content = this.getScrollableElement();\n var header = this.getDatesHeaderElement();\n var scrollerHeight = this.parent.element.offsetHeight - headerBarHeight - header.offsetHeight;\n this.setContentHeight(content, timecells, scrollerHeight);\n var scrollBarWidth = util.getScrollBarWidth();\n // tslint:disable:no-any\n if (content.offsetWidth - content.clientWidth > 0) {\n header.firstChild.style[args.cssProperties.border] = scrollBarWidth > 0 ? '1px' : '0px';\n header.style[args.cssProperties.padding] = scrollBarWidth > 0 ? scrollBarWidth - 1 + 'px' : '0px';\n }\n else {\n header.firstChild.style[args.cssProperties.border] = '';\n header.style[args.cssProperties.padding] = '';\n }\n // tslint:enable:no-any\n if (!args.isPreventScrollUpdate) {\n if (this.parent.uiStateValues.isInitial) {\n this.scrollToWorkHour();\n this.parent.uiStateValues.isInitial = false;\n }\n else {\n content.scrollTop = this.parent.uiStateValues.top;\n content.scrollLeft = this.parent.uiStateValues.left;\n }\n }\n if (this.parent.activeViewOptions.timeScale.enable) {\n this.highlightCurrentTime();\n }\n };\n VerticalView.prototype.setContentHeight = function (element, leftPanelElement, height) {\n if (this.parent.isAdaptive && !this.isTimelineView()) {\n element.style.height = formatUnit(height);\n }\n else {\n if (!isNullOrUndefined(leftPanelElement)) {\n leftPanelElement.style.height = formatUnit(height - this.getScrollXIndent(element));\n }\n element.style.height = formatUnit(height);\n }\n };\n VerticalView.prototype.scrollToWorkHour = function () {\n if (this.parent.workHours.highlight) {\n var firstWorkHourCell = this.element.querySelector('.' + cls.WORK_HOURS_CLASS);\n if (firstWorkHourCell) {\n this.getScrollableElement().scrollTop = firstWorkHourCell.offsetTop;\n this.parent.uiStateValues.top = firstWorkHourCell.offsetTop;\n this.parent.uiStateValues.left = 0;\n }\n }\n };\n VerticalView.prototype.scrollToHour = function (hour) {\n var date = this.parent.globalize.parseDate(hour, { skeleton: 'Hm', calendar: this.parent.getCalendarMode() });\n if (isNullOrUndefined(date)) {\n return;\n }\n this.getScrollableElement().scrollTop = this.getTopFromDateTime(date);\n };\n VerticalView.prototype.generateColumnLevels = function () {\n var level = this.getDateSlots(this.renderDates, this.parent.activeViewOptions.workDays);\n var columnLevels = [];\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n columnLevels = this.parent.resourceBase.generateResourceLevels(level);\n if (this.parent.uiStateValues.isGroupAdaptive && this.parent.resourceBase.lastResourceLevel.length > 0) {\n var resourceLevel = this.parent.resourceBase.lastResourceLevel[this.parent.uiStateValues.groupIndex];\n var resStartHour = resourceLevel.resourceData[resourceLevel.resource.startHourField];\n var resEndHour = resourceLevel.resourceData[resourceLevel.resource.endHourField];\n var dateSlots = this.getDateSlots(resourceLevel.renderDates, resourceLevel.workDays, resStartHour, resEndHour);\n columnLevels = [dateSlots];\n }\n }\n else {\n columnLevels.push(level);\n }\n this.colLevels = columnLevels;\n return columnLevels;\n };\n VerticalView.prototype.getDateSlots = function (renderDates, workDays, workStartHour, workEndHour) {\n if (workStartHour === void 0) { workStartHour = this.parent.workHours.start; }\n if (workEndHour === void 0) { workEndHour = this.parent.workHours.end; }\n var dateCol = [];\n var start = this.parent.globalize.parseDate(workStartHour, { skeleton: 'Hm', calendar: this.parent.getCalendarMode() });\n var end = this.parent.globalize.parseDate(workEndHour, { skeleton: 'Hm', calendar: this.parent.getCalendarMode() });\n for (var _i = 0, renderDates_1 = renderDates; _i < renderDates_1.length; _i++) {\n var col = renderDates_1[_i];\n var classList = [cls.HEADER_CELLS_CLASS];\n if (this.isCurrentDate(col)) {\n classList.push(cls.CURRENT_DAY_CLASS);\n }\n dateCol.push({\n date: col, type: 'dateHeader', className: classList, colSpan: 1,\n workDays: workDays, startHour: new Date(+start), endHour: new Date(+end)\n });\n }\n return dateCol;\n };\n VerticalView.prototype.isWorkHourRange = function (date) {\n return (this.getStartHour().getTime() <= date.getTime()) && (this.getEndHour().getTime() >= date.getTime());\n };\n VerticalView.prototype.highlightCurrentTime = function () {\n var _this = this;\n if (this.parent.activeViewOptions.headerRows.length > 0 &&\n this.parent.activeViewOptions.headerRows.slice(-1)[0].option !== 'Hour') {\n return;\n }\n if (this.parent.showTimeIndicator && this.isWorkHourRange(new Date())) {\n var currentDateIndex = this.getCurrentTimeIndicatorIndex();\n if (currentDateIndex.length > 0) {\n this.changeCurrentTimePosition();\n if (isNullOrUndefined(this.currentTimeIndicatorTimer)) {\n this.currentTimeIndicatorTimer = window.setInterval(function () { _this.changeCurrentTimePosition(); }, util.MS_PER_MINUTE);\n }\n }\n else {\n this.clearCurrentTimeIndicatorTimer();\n }\n }\n else {\n this.clearCurrentTimeIndicatorTimer();\n }\n };\n VerticalView.prototype.getCurrentTimeIndicatorIndex = function () {\n var currentDateIndex = [];\n if (!isNullOrUndefined(this.parent.resourceBase) && (this.parent.activeViewOptions.group.resources.length > 0) &&\n !this.parent.uiStateValues.isGroupAdaptive) {\n var count = 0;\n for (var _i = 0, _a = this.parent.resourceBase.lastResourceLevel; _i < _a.length; _i++) {\n var resource = _a[_i];\n var index = this.parent.getIndexOfDate(resource.renderDates, util.resetTime(new Date()));\n if (index >= 0) {\n var resIndex = this.parent.activeViewOptions.group.byDate ?\n (this.parent.resourceBase.lastResourceLevel.length * index) + count : count + index;\n currentDateIndex.push(resIndex);\n }\n count += this.parent.activeViewOptions.group.byDate ? 1 : resource.renderDates.length;\n }\n }\n else {\n var renderDates = (this.parent.uiStateValues.isGroupAdaptive && this.parent.resourceBase.lastResourceLevel.length > 0) ?\n this.parent.resourceBase.lastResourceLevel[this.parent.uiStateValues.groupIndex].renderDates : this.renderDates;\n var index = this.parent.getIndexOfDate(renderDates, util.resetTime(new Date()));\n if (index >= 0) {\n currentDateIndex.push(index);\n }\n }\n return currentDateIndex;\n };\n VerticalView.prototype.clearCurrentTimeIndicatorTimer = function () {\n if (!isNullOrUndefined(this.currentTimeIndicatorTimer)) {\n window.clearInterval(this.currentTimeIndicatorTimer);\n this.currentTimeIndicatorTimer = null;\n this.removeCurrentTimeIndicatorElements();\n }\n };\n VerticalView.prototype.removeCurrentTimeIndicatorElements = function () {\n var queryString = '.' + cls.PREVIOUS_TIMELINE_CLASS + ',.' + cls.CURRENT_TIMELINE_CLASS + ',.' + cls.CURRENT_TIME_CLASS;\n var timeIndicator = [].slice.call(this.element.querySelectorAll(queryString));\n timeIndicator.forEach(function (indicator) { return remove(indicator); });\n };\n VerticalView.prototype.changeCurrentTimePosition = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.removeCurrentTimeIndicatorElements();\n var currentDateIndex = this.getCurrentTimeIndicatorIndex();\n var firstRow = this.parent.getContentTable().rows[0];\n var top = this.getTopFromDateTime(new Date());\n var topInPx = formatUnit(top);\n var rowIndex = Math.floor(top / firstRow.cells[0].offsetHeight);\n if (isNullOrUndefined(rowIndex) || isNaN(rowIndex)) {\n return;\n }\n var curTimeWrap = this.element.querySelectorAll('.' + cls.TIMELINE_WRAPPER_CLASS);\n for (var i = 0, length_1 = currentDateIndex[0]; i < length_1; i++) {\n curTimeWrap[i].appendChild(createElement('div', { className: cls.PREVIOUS_TIMELINE_CLASS, styles: 'top:' + topInPx }));\n }\n for (var _i = 0, currentDateIndex_1 = currentDateIndex; _i < currentDateIndex_1.length; _i++) {\n var day = currentDateIndex_1[_i];\n curTimeWrap[day].appendChild(createElement('div', { className: cls.CURRENT_TIMELINE_CLASS, styles: 'top:' + topInPx }));\n }\n var currentTimeEle = createElement('div', {\n innerHTML: this.parent.getTimeString(new Date()),\n className: cls.CURRENT_TIME_CLASS,\n styles: 'top:' + topInPx\n });\n var timeCellsWrap = this.getLeftPanelElement();\n removeClass(timeCellsWrap.querySelectorAll('.' + cls.HIDE_CHILDS_CLASS), cls.HIDE_CHILDS_CLASS);\n addClass([timeCellsWrap.querySelectorAll('tr')[rowIndex].lastChild], cls.HIDE_CHILDS_CLASS);\n prepend([currentTimeEle], timeCellsWrap);\n currentTimeEle.style.top = formatUnit(currentTimeEle.offsetTop - (currentTimeEle.offsetHeight / 2));\n };\n VerticalView.prototype.getTopFromDateTime = function (date) {\n var startHour = this.getStartHour();\n var diffInMinutes = ((date.getHours() - startHour.getHours()) * 60) + (date.getMinutes() - startHour.getMinutes());\n return (diffInMinutes * this.getWorkCellHeight() * this.parent.activeViewOptions.timeScale.slotCount) /\n this.parent.activeViewOptions.timeScale.interval;\n };\n VerticalView.prototype.getWorkCellHeight = function () {\n return this.element.querySelector('.' + cls.WORK_CELLS_CLASS).offsetHeight;\n };\n VerticalView.prototype.getTdContent = function (date, type, groupIndex) {\n var cntEle;\n switch (type) {\n case 'dateHeader':\n if (this.parent.activeViewOptions.dateHeaderTemplate) {\n var args = { date: date, type: type };\n cntEle = this.parent.getDateHeaderTemplate()(args);\n }\n else {\n cntEle = compile(this.dateHeaderTemplate, this.customHelper)({ date: date });\n }\n break;\n case 'majorSlot':\n if (this.parent.activeViewOptions.timeScale.majorSlotTemplate) {\n var args = { date: date, type: type };\n cntEle = this.parent.getMajorSlotTemplate()(args);\n }\n else {\n cntEle = compile(MAJOR_SLOT_TEMPLATE, this.customHelper)({ date: date });\n }\n break;\n case 'minorSlot':\n if (this.parent.activeViewOptions.timeScale.minorSlotTemplate) {\n var args = { date: date, type: type };\n cntEle = this.parent.getMinorSlotTemplate()(args);\n }\n else {\n cntEle = compile(MINOR_SLOT_TEMPLATE, this.customHelper)({ date: date });\n }\n break;\n case 'alldayCells':\n if (this.parent.activeViewOptions.cellTemplate) {\n var args = { date: date, type: type, groupIndex: groupIndex };\n cntEle = this.parent.getCellTemplate()(args);\n }\n break;\n }\n return cntEle;\n };\n VerticalView.prototype.renderLayout = function (type) {\n this.setPanel(createElement('div', { className: cls.TABLE_WRAP_CLASS }));\n var clsList = [this.baseCssClass, this.viewClass];\n clsList.push(type);\n if (this.parent.activeViewOptions.group.byDate) {\n clsList.push('e-by-date');\n }\n if (!this.parent.activeViewOptions.timeScale.enable) {\n addClass([this.element], [cls.TIMESCALE_DISABLE, this.viewClass]);\n }\n if (this.parent.activeViewOptions.allowVirtualScrolling) {\n clsList.push(cls.VIRTUAL_SCROLL_CLASS);\n }\n this.renderPanel(type);\n addClass([this.element], clsList);\n this.element.appendChild(this.createTableLayout(cls.OUTER_TABLE_CLASS));\n this.colLevels = this.generateColumnLevels();\n this.renderHeader();\n this.renderContent();\n if (this.parent.uiStateValues.isGroupAdaptive && !this.parent.element.querySelector('.' + cls.RESOURCE_TOOLBAR_CONTAINER)) {\n this.renderResourceMobileLayout();\n }\n this.parent.notify(event.contentReady, {});\n };\n VerticalView.prototype.renderHeader = function () {\n var tr = createElement('tr');\n var dateTd = createElement('td');\n dateTd.appendChild(this.renderDatesHeader());\n if (this.parent.activeViewOptions.timeScale.enable) {\n var indentTd = createElement('td', { className: cls.LEFT_INDENT_CLASS });\n indentTd.appendChild(this.renderLeftIndent());\n tr.appendChild(indentTd);\n }\n tr.appendChild(dateTd);\n prepend([tr], this.element.querySelector('tbody'));\n };\n VerticalView.prototype.renderContent = function () {\n var tr = createElement('tr');\n var workTd = createElement('td');\n if (this.parent.isAdaptive) {\n workTd.setAttribute('colspan', (this.parent.activeViewOptions.timeScale.enable ? '2' : '1'));\n var scrollContainer = createElement('div', { className: cls.SCROLL_CONTAINER_CLASS });\n if (this.parent.activeViewOptions.timeScale.enable) {\n scrollContainer.appendChild(this.renderTimeCells());\n }\n scrollContainer.appendChild(this.renderContentArea());\n workTd.appendChild(scrollContainer);\n EventHandler.add(scrollContainer, 'scroll', this.onApaptiveScroll, this);\n EventHandler.add(scrollContainer, Browser.touchMoveEvent, this.onApaptiveMove, this);\n tr.appendChild(workTd);\n }\n else {\n workTd.appendChild(this.renderContentArea());\n if (this.parent.activeViewOptions.timeScale.enable) {\n var timesTd = createElement('td');\n timesTd.appendChild(this.renderTimeCells());\n tr.appendChild(timesTd);\n }\n tr.appendChild(workTd);\n }\n this.element.querySelector('tbody').appendChild(tr);\n };\n VerticalView.prototype.renderLeftIndent = function () {\n var wrap = createElement('div', { className: cls.LEFT_INDENT_WRAP_CLASS });\n var tbl = this.createTableLayout();\n var trEle = createElement('tr');\n var rowCount = this.colLevels.length;\n for (var i = 0; i < rowCount; i++) {\n var ntr_1 = trEle.cloneNode();\n var data_1 = { className: [(this.colLevels[i][0] && this.colLevels[i][0].className[0])], type: 'emptyCells' };\n if (this.parent.activeViewOptions.showWeekNumber && data_1.className.indexOf(cls.HEADER_CELLS_CLASS) !== -1) {\n data_1.className.push(cls.WEEK_NUMBER_CLASS);\n var weekNo = util.getWeekNumber(this.renderDates.slice(-1)[0]);\n data_1.template = [createElement('span', {\n innerHTML: '' + weekNo,\n attrs: { title: this.parent.localeObj.getConstant('week') + ' ' + weekNo }\n })];\n }\n ntr_1.appendChild(this.createTd(data_1));\n tbl.querySelector('tbody').appendChild(ntr_1);\n }\n var ntr = trEle.cloneNode();\n var appointmentExpandCollapse = createElement('div', {\n attrs: { 'tabindex': '0', title: 'Expand-all-day-section', 'aria-disabled': 'false', 'aria-label': 'Expand section' },\n className: cls.ALLDAY_APPOINTMENT_SECTION_CLASS + ' ' + cls.APPOINTMENT_ROW_EXPAND_CLASS + ' ' +\n cls.ICON + ' ' + cls.DISABLE_CLASS,\n });\n var data = { className: [cls.ALLDAY_CELLS_CLASS], type: 'emptyCells' };\n var nth = this.createTd(data);\n nth.appendChild(appointmentExpandCollapse);\n ntr.appendChild(nth);\n tbl.querySelector('tbody').appendChild(ntr);\n wrap.appendChild(tbl);\n return wrap;\n };\n VerticalView.prototype.renderDatesHeader = function () {\n var container = createElement('div', { className: cls.DATE_HEADER_CONTAINER_CLASS });\n var wrap = createElement('div', { className: cls.DATE_HEADER_WRAP_CLASS });\n container.appendChild(wrap);\n var tbl = this.createTableLayout();\n var trEle = createElement('tr');\n var rowCount = this.colLevels.length;\n var lastLevel = this.colLevels[rowCount - 1];\n this.createColGroup(tbl, lastLevel);\n for (var i = 0; i < rowCount; i++) {\n var ntr = trEle.cloneNode();\n addClass([ntr], cls.HEADER_ROW_CLASS);\n var level = this.colLevels[i];\n for (var j = 0; j < level.length; j++) {\n ntr.appendChild(this.createTd(level[j]));\n }\n tbl.querySelector('tbody').appendChild(ntr);\n }\n this.createAllDayRow(tbl, lastLevel);\n wrap.appendChild(tbl);\n return container;\n };\n VerticalView.prototype.createAllDayRow = function (table, tdData) {\n var ntr = createElement('tr');\n addClass([ntr], cls.ALLDAY_ROW_CLASS);\n for (var j = 0; j < tdData.length; j++) {\n var td = extend({}, tdData[j]);\n td.className = [cls.ALLDAY_CELLS_CLASS];\n td.type = 'alldayCells';\n var ntd = this.createTd(td);\n ntd.setAttribute('data-date', td.date.getTime().toString());\n if (!isNullOrUndefined(td.groupIndex)) {\n ntd.setAttribute('data-group-index', '' + td.groupIndex);\n }\n this.wireCellEvents(ntd);\n ntr.appendChild(ntd);\n }\n table.querySelector('tbody').appendChild(ntr);\n var thead = createElement('thead');\n thead.appendChild(this.createEventWrapper('allDay'));\n prepend([thead], table);\n };\n VerticalView.prototype.createTd = function (td) {\n var tdEle = createElement('td');\n this.addAttributes(td, tdEle);\n if (td.date && td.type) {\n var ele = this.getTdContent(td.date, td.type, td.groupIndex);\n if (ele && ele.length) {\n append([].slice.call(ele), tdEle);\n }\n }\n if (td.type === 'resourceHeader') {\n this.setResourceHeaderContent(tdEle, td);\n }\n if (td.type === 'dateHeader' && td.className.indexOf(cls.HEADER_CELLS_CLASS) >= 0) {\n tdEle.setAttribute('data-date', td.date.getTime().toString());\n if (!isNullOrUndefined(td.groupIndex)) {\n tdEle.setAttribute('data-group-index', '' + td.groupIndex);\n }\n this.wireMouseEvents(tdEle);\n }\n var args = { elementType: td.type, element: tdEle, date: td.date, groupIndex: td.groupIndex };\n this.parent.trigger(event.renderCell, args);\n return tdEle;\n };\n VerticalView.prototype.wireCellEvents = function (element) {\n EventHandler.add(element, 'mousedown', this.workCellAction.cellMouseDown, this.workCellAction);\n this.wireMouseEvents(element);\n };\n VerticalView.prototype.wireMouseEvents = function (element) {\n EventHandler.add(element, 'click', this.workCellAction.cellClick, this.workCellAction);\n if (!this.parent.isAdaptive) {\n EventHandler.add(element, 'dblclick', this.workCellAction.cellDblClick, this.workCellAction);\n }\n };\n VerticalView.prototype.renderTimeCells = function () {\n var _this = this;\n var wrap = createElement('div', { className: cls.TIME_CELLS_WRAP_CLASS });\n var tbl = this.createTableLayout();\n var trEle = createElement('tr');\n var handler = function (r) {\n r.type = r.first ? 'majorSlot' : 'minorSlot';\n r.className = r.last ? [cls.TIME_CELLS_CLASS] : [];\n var ntr = trEle.cloneNode();\n var data = { date: r.date, type: r.type, className: r.className };\n ntr.appendChild(_this.createTd(data));\n tbl.querySelector('tbody').appendChild(ntr);\n return r;\n };\n this.getTimeSlotRows(handler);\n wrap.appendChild(tbl);\n return wrap;\n };\n VerticalView.prototype.renderContentArea = function () {\n var wrap = createElement('div', { className: cls.CONTENT_WRAP_CLASS });\n var tbl = this.createTableLayout(cls.CONTENT_TABLE_CLASS);\n this.addAutoHeightClass(tbl);\n this.createColGroup(tbl, this.colLevels.slice(-1)[0]);\n this.renderContentTable(tbl);\n wrap.appendChild(tbl);\n this.wireCellEvents(tbl.querySelector('tbody'));\n EventHandler.add(wrap, 'scroll', this.onContentScroll, this);\n EventHandler.add(wrap, Browser.touchMoveEvent, this.onApaptiveMove, this);\n return wrap;\n };\n VerticalView.prototype.renderContentTable = function (table) {\n var _this = this;\n var tr = createElement('tr', { attrs: { role: 'row' } });\n var td = createElement('td', { attrs: { role: 'gridcell', 'aria-selected': 'false' } });\n var tbody = table.querySelector('tbody');\n var handler = function (r) {\n var ntr = tr.cloneNode();\n for (var _i = 0, _a = _this.colLevels[_this.colLevels.length - 1]; _i < _a.length; _i++) {\n var tdData = _a[_i];\n var ntd = _this.createContentTd(tdData, r, td);\n ntr.appendChild(ntd);\n }\n tbody.appendChild(ntr);\n return r;\n };\n this.getTimeSlotRows(handler);\n this.renderContentTableHeader(table);\n };\n VerticalView.prototype.createContentTd = function (tdData, r, td) {\n var ntd = td.cloneNode();\n if (tdData.colSpan) {\n ntd.setAttribute('colspan', tdData.colSpan.toString());\n }\n var clsName = this.getContentTdClass(r);\n var cellDate = util.resetTime(new Date('' + tdData.date));\n util.setTime(cellDate, util.getDateInMs(r.date));\n var type = 'workCells';\n if (tdData.className.indexOf(cls.RESOURCE_PARENT_CLASS) !== -1) {\n clsName.push(cls.RESOURCE_GROUP_CELLS_CLASS);\n type = 'resourceGroupCells';\n }\n if (this.parent.workHours.highlight && ((this.parent.activeViewOptions.timeScale.enable &&\n this.isWorkHour(cellDate, tdData.startHour, tdData.endHour, tdData.workDays)) ||\n (!this.parent.activeViewOptions.timeScale.enable && this.isWorkDay(cellDate, tdData.workDays)))) {\n clsName.push(cls.WORK_HOURS_CLASS);\n }\n addClass([ntd], clsName);\n if (this.parent.activeViewOptions.cellTemplate) {\n var args_1 = { date: cellDate, type: type, groupIndex: tdData.groupIndex };\n append([].slice.call(this.parent.getCellTemplate()(args_1)), ntd);\n }\n ntd.setAttribute('data-date', cellDate.getTime().toString());\n if (!isNullOrUndefined(tdData.groupIndex) || this.parent.uiStateValues.isGroupAdaptive) {\n var groupIndex = this.parent.uiStateValues.isGroupAdaptive ? this.parent.uiStateValues.groupIndex :\n tdData.groupIndex;\n ntd.setAttribute('data-group-index', '' + groupIndex);\n }\n var args = { elementType: type, element: ntd, date: cellDate, groupIndex: tdData.groupIndex };\n this.parent.trigger(event.renderCell, args);\n return ntd;\n };\n VerticalView.prototype.getContentTdClass = function (r) {\n return r.last ? [cls.WORK_CELLS_CLASS] : [cls.WORK_CELLS_CLASS, cls.ALTERNATE_CELLS_CLASS];\n };\n VerticalView.prototype.renderContentTableHeader = function (table) {\n var thead = createElement('thead');\n thead.appendChild(this.createEventWrapper());\n if (this.parent.activeViewOptions.timeScale.enable) {\n thead.appendChild(this.createEventWrapper('timeIndicator'));\n }\n prepend([thead], table);\n };\n VerticalView.prototype.createEventWrapper = function (type) {\n if (type === void 0) { type = ''; }\n var tr = createElement('tr');\n this.colLevels.slice(-1)[0].forEach(function (col, day) {\n var appointmentWrap = createElement('td', {\n className: (type === 'allDay') ? cls.ALLDAY_APPOINTMENT_WRAPPER_CLASS : (type === 'timeIndicator') ?\n cls.TIMELINE_WRAPPER_CLASS : cls.DAY_WRAPPER_CLASS, attrs: { 'data-date': col.date.getTime().toString() }\n });\n if (!isNullOrUndefined(col.groupIndex)) {\n appointmentWrap.setAttribute('data-group-index', col.groupIndex.toString());\n }\n if (type === '') {\n var innerWrapper = createElement('div', {\n id: cls.APPOINTMENT_WRAPPER_CLASS + '-' + day.toString(),\n className: cls.APPOINTMENT_WRAPPER_CLASS\n });\n appointmentWrap.appendChild(innerWrapper);\n }\n tr.appendChild(appointmentWrap);\n });\n return tr;\n };\n VerticalView.prototype.getScrollableElement = function () {\n if (this.parent.isAdaptive && this.parent.currentView.indexOf('Timeline') === -1) {\n return this.element.querySelector('.' + cls.SCROLL_CONTAINER_CLASS);\n }\n else {\n return this.getContentAreaElement();\n }\n };\n VerticalView.prototype.getLeftPanelElement = function () {\n return this.element.querySelector('.' + cls.TIME_CELLS_WRAP_CLASS);\n };\n VerticalView.prototype.getContentAreaElement = function () {\n return this.element.querySelector('.' + cls.CONTENT_WRAP_CLASS);\n };\n VerticalView.prototype.getEndDateFromStartDate = function (start) {\n var msMajorInterval = this.parent.activeViewOptions.timeScale.interval * util.MS_PER_MINUTE;\n var msInterval = msMajorInterval / this.parent.activeViewOptions.timeScale.slotCount;\n var end = new Date(start.getTime());\n end.setMilliseconds(end.getMilliseconds() + msInterval);\n return end;\n };\n VerticalView.prototype.getTimeSlotRows = function (handler) {\n var rows = [];\n var startHour = this.getStartHour();\n var endHour = this.getEndHour();\n var msMajorInterval = this.parent.activeViewOptions.timeScale.interval * util.MS_PER_MINUTE;\n var msInterval = msMajorInterval / this.parent.activeViewOptions.timeScale.slotCount;\n var length = Math.round(util.MS_PER_DAY / msInterval);\n var msStartHour = startHour.getTime();\n var msEndHour = endHour.getTime();\n if (msStartHour !== msEndHour) {\n length = Math.round((msEndHour - msStartHour) / msInterval);\n }\n if (!this.parent.activeViewOptions.timeScale.enable) {\n length = 1;\n }\n var dt = new Date(msStartHour);\n var start = this.parent.globalize.parseDate(this.parent.workHours.start, { skeleton: 'Hm', calendar: this.parent.getCalendarMode() });\n var end = this.parent.globalize.parseDate(this.parent.workHours.end, { skeleton: 'Hm', calendar: this.parent.getCalendarMode() });\n for (var i = 0; i < length; i++) {\n var majorTickDivider = i % (msMajorInterval / msInterval);\n var row = {\n date: new Date('' + dt),\n startHour: start,\n endHour: end,\n first: (majorTickDivider === 0),\n middle: (majorTickDivider < this.parent.activeViewOptions.timeScale.slotCount - 1),\n last: (majorTickDivider === this.parent.activeViewOptions.timeScale.slotCount - 1),\n type: ''\n };\n if (handler) {\n handler(row);\n }\n rows.push(row);\n dt.setMilliseconds(msInterval);\n }\n return rows;\n };\n /**\n * Get module name.\n */\n VerticalView.prototype.getModuleName = function () {\n return 'verticalView';\n };\n /**\n * To destroy the vertical view.\n * @return {void}\n * @private\n */\n VerticalView.prototype.destroy = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.clearCurrentTimeIndicatorTimer();\n if (this.element) {\n var contentScrollableEle = this.getContentAreaElement();\n if (contentScrollableEle) {\n EventHandler.remove(contentScrollableEle, 'scroll', this.onContentScroll);\n }\n if (this.parent.resourceBase) {\n this.parent.resourceBase.destroy();\n }\n remove(this.element);\n this.element = null;\n if (this.parent.scheduleTouchModule) {\n this.parent.scheduleTouchModule.resetValues();\n }\n }\n };\n return VerticalView;\n}(ViewBase));\nexport { VerticalView };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { VerticalView } from './vertical-view';\n/**\n * day view\n */\nvar Day = /** @class */ (function (_super) {\n __extends(Day, _super);\n /**\n * Constructor for day view\n */\n function Day(parent) {\n var _this = _super.call(this, parent) || this;\n _this.viewClass = 'e-day-view';\n return _this;\n }\n /**\n * Get module name.\n */\n Day.prototype.getModuleName = function () {\n return 'day';\n };\n return Day;\n}(VerticalView));\nexport { Day };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { VerticalView } from './vertical-view';\n/**\n * week view\n */\nvar Week = /** @class */ (function (_super) {\n __extends(Week, _super);\n /**\n * Constructor for week view\n */\n function Week(parent) {\n var _this = _super.call(this, parent) || this;\n _this.viewClass = 'e-week-view';\n return _this;\n }\n /**\n * Get module name.\n */\n Week.prototype.getModuleName = function () {\n return 'week';\n };\n return Week;\n}(VerticalView));\nexport { Week };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { VerticalView } from './vertical-view';\n/**\n * work week view\n */\nvar WorkWeek = /** @class */ (function (_super) {\n __extends(WorkWeek, _super);\n /**\n * Constructor for work week view\n */\n function WorkWeek(par) {\n var _this = _super.call(this, par) || this;\n _this.viewClass = 'e-work-week-view';\n return _this;\n }\n /**\n * Get module name.\n */\n WorkWeek.prototype.getModuleName = function () {\n return 'workWeek';\n };\n return WorkWeek;\n}(VerticalView));\nexport { WorkWeek };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { EventHandler, formatUnit, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { createElement, remove, addClass, append, prepend } from '@syncfusion/ej2-base';\nimport { WorkCellInteraction } from '../actions/work-cells';\nimport { ViewBase } from './view-base';\nimport * as util from '../base/util';\nimport * as event from '../base/constant';\nimport * as cls from '../base/css-constant';\nimport { MonthEvent } from '../event-renderer/month';\n/**\n * month view\n */\nvar Month = /** @class */ (function (_super) {\n __extends(Month, _super);\n /**\n * Constructor for month view\n */\n function Month(parent) {\n var _this = _super.call(this, parent) || this;\n _this.dayNameFormat = 'wide';\n _this.viewClass = 'e-month-view';\n _this.isInverseTableSelect = false;\n _this.monthDates = {};\n _this.workCellAction = new WorkCellInteraction(parent);\n return _this;\n }\n Month.prototype.addEventListener = function () {\n this.parent.on(event.scrollUiUpdate, this.onScrollUIUpdate, this);\n this.parent.on(event.dataReady, this.onDataReady, this);\n this.parent.on(event.cellClick, this.onCellClick, this);\n };\n Month.prototype.removeEventListener = function () {\n this.parent.off(event.scrollUiUpdate, this.onScrollUIUpdate);\n this.parent.off(event.dataReady, this.onDataReady);\n this.parent.off(event.cellClick, this.onCellClick);\n };\n Month.prototype.onDataReady = function (args) {\n var monthEvent = new MonthEvent(this.parent);\n monthEvent.renderAppointments();\n };\n Month.prototype.onCellClick = function (event) {\n // Here cell click\n };\n Month.prototype.onContentScroll = function (e) {\n this.parent.removeNewEventElement();\n this.parent.notify(event.virtualScroll, e);\n this.scrollTopPanel(e.target);\n this.scrollLeftPanel(e.target);\n };\n Month.prototype.scrollLeftPanel = function (target) {\n var leftPanel = this.getLeftPanelElement();\n if (leftPanel) {\n leftPanel.scrollTop = target.scrollTop;\n }\n };\n Month.prototype.getLeftPanelElement = function () {\n return this.element.querySelector('.' + cls.WEEK_NUMBER_WRAPPER_CLASS);\n };\n Month.prototype.onScrollUIUpdate = function (args) {\n var headerHeight = this.getHeaderBarHeight();\n var header = this.getDatesHeaderElement();\n var content = this.getContentAreaElement();\n var height = this.parent.element.offsetHeight - headerHeight - header.offsetHeight;\n var leftPanel = this.getLeftPanelElement();\n this.setContentHeight(content, leftPanel, height);\n var scrollBarWidth = util.getScrollBarWidth();\n // tslint:disable:no-any\n if (content.offsetWidth - content.clientWidth > 0) {\n header.firstChild.style[args.cssProperties.border] = scrollBarWidth > 0 ? '1px' : '0px';\n header.style[args.cssProperties.padding] = scrollBarWidth > 0 ? scrollBarWidth - 1 + 'px' : '0px';\n }\n else {\n header.firstChild.style[args.cssProperties.border] = '';\n header.style[args.cssProperties.padding] = '';\n }\n // tslint:enable:no-any\n };\n Month.prototype.setContentHeight = function (content, leftPanelElement, height) {\n content.style.height = 'auto';\n if (this.parent.currentView === 'Month') {\n content.style.height = formatUnit(height);\n }\n if (leftPanelElement) {\n if (this.parent.currentView === 'MonthAgenda') {\n height = this.element.querySelector('.' + cls.CONTENT_TABLE_CLASS).offsetHeight;\n }\n leftPanelElement.style.height = 'auto';\n leftPanelElement.style.height = formatUnit(height - this.getScrollXIndent(content));\n }\n };\n Month.prototype.generateColumnLevels = function () {\n var colLevels = [];\n var level = this.getDateSlots(this.renderDates, this.parent.activeViewOptions.workDays);\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n colLevels = this.parent.resourceBase.generateResourceLevels(level);\n if (this.parent.currentView === 'MonthAgenda') {\n colLevels = [level];\n }\n if (this.parent.uiStateValues.isGroupAdaptive && this.parent.resourceBase.lastResourceLevel.length > 0) {\n var resourceLevel = this.parent.resourceBase.lastResourceLevel[this.parent.uiStateValues.groupIndex];\n colLevels = [this.getDateSlots(resourceLevel.renderDates, resourceLevel.workDays)];\n }\n }\n else {\n colLevels.push(level);\n }\n this.colLevels = colLevels;\n return colLevels;\n };\n Month.prototype.getDateSlots = function (renderDates, workDays) {\n var count = this.parent.activeViewOptions.showWeekend ? util.WEEK_LENGTH : workDays.length;\n var dateSlots = [];\n for (var col = 0; col < count; col++) {\n var classList = [cls.HEADER_CELLS_CLASS];\n var currentDateIndex = renderDates.slice(0, count).map(function (date) { return date.getDay(); });\n if (this.isCurrentMonth(this.parent.selectedDate) && currentDateIndex.indexOf(new Date().getDay()) === col) {\n classList.push(cls.CURRENT_DAY_CLASS);\n }\n dateSlots.push({ date: renderDates[col], type: 'monthDay', className: classList, colSpan: 1, workDays: workDays });\n }\n return dateSlots;\n };\n Month.prototype.getDayNameFormat = function () {\n if (this.parent.isAdaptive || this.parent.activeViewOptions.group.resources.length > 0) {\n return 'abbreviated';\n }\n return 'wide';\n };\n Month.prototype.renderLayout = function (type) {\n this.dayNameFormat = this.getDayNameFormat();\n this.setPanel(createElement('div', { className: cls.TABLE_WRAP_CLASS }));\n var clsList = [this.viewClass];\n clsList.push(type);\n if (this.parent.activeViewOptions.group.byDate) {\n clsList.push('e-by-date');\n }\n if (this.parent.activeViewOptions.allowVirtualScrolling) {\n clsList.push(cls.VIRTUAL_SCROLL_CLASS);\n }\n addClass([this.element], clsList);\n this.renderPanel(type);\n this.element.appendChild(this.createTableLayout(cls.OUTER_TABLE_CLASS));\n this.colLevels = this.generateColumnLevels();\n this.renderHeader();\n this.renderContent();\n var target = (this.parent.currentView === 'MonthAgenda') ? this.parent.activeView.getPanel() : this.parent.element;\n if (this.parent.uiStateValues.isGroupAdaptive && !target.querySelector('.' + cls.RESOURCE_TOOLBAR_CONTAINER)) {\n this.renderResourceMobileLayout();\n }\n this.parent.notify(event.contentReady, {});\n };\n Month.prototype.wireCellEvents = function (element) {\n EventHandler.add(element, 'mousedown', this.workCellAction.cellMouseDown, this.workCellAction);\n EventHandler.add(element, 'click', this.workCellAction.cellClick, this.workCellAction);\n if (!this.parent.isAdaptive) {\n EventHandler.add(element, 'dblclick', this.workCellAction.cellDblClick, this.workCellAction);\n }\n };\n Month.prototype.renderHeader = function () {\n var tr = createElement('tr');\n this.renderLeftIndent(tr);\n var dateTd = createElement('td');\n dateTd.appendChild(this.renderDatesHeader());\n tr.appendChild(dateTd);\n prepend([tr], this.element.querySelector('tbody'));\n };\n Month.prototype.renderLeftIndent = function (tr) {\n if (this.parent.activeViewOptions.showWeekNumber) {\n tr.appendChild(createElement('td', { className: 'e-left-indent' }));\n }\n };\n Month.prototype.renderContent = function () {\n var tr = createElement('tr');\n if (this.parent.activeViewOptions.showWeekNumber) {\n tr.appendChild(this.renderWeekNumberContent());\n }\n var workTd = createElement('td');\n var wrap = createElement('div', { className: cls.CONTENT_WRAP_CLASS });\n var contentArea = this.renderContentArea();\n if (this.parent.currentView === 'Month') {\n wrap.appendChild(contentArea);\n }\n else {\n var monthAgendaWrapper = createElement('div', { className: cls.TABLE_CONTAINER_CLASS });\n monthAgendaWrapper.appendChild(contentArea);\n wrap.appendChild(monthAgendaWrapper);\n }\n EventHandler.add(wrap, 'scroll', this.onContentScroll, this);\n workTd.appendChild(wrap);\n tr.appendChild(workTd);\n this.element.querySelector('tbody').appendChild(tr);\n this.renderAppointmentContainer();\n };\n Month.prototype.renderWeekNumberContent = function () {\n var dateCol = this.renderDates.map(function (date) { return new Date(+date); });\n var td = createElement('td');\n var contentWrapper = createElement('div', { className: cls.WEEK_NUMBER_WRAPPER_CLASS });\n td.appendChild(contentWrapper);\n var contentWrapTable = this.createTableLayout();\n contentWrapper.appendChild(contentWrapTable);\n var noOfDays = this.parent.activeViewOptions.showWeekend ? util.WEEK_LENGTH :\n this.parent.activeViewOptions.workDays.length;\n for (var i = 0, length_1 = (this.renderDates.length / noOfDays); i < length_1; i++) {\n var dates = dateCol.splice(0, noOfDays);\n var weekNumber = util.getWeekNumber(dates.slice(-1)[0]).toString();\n contentWrapTable.querySelector('tbody').appendChild(this.createWeekNumberElement(weekNumber));\n }\n return td;\n };\n Month.prototype.renderAppointmentContainer = function () {\n //Here needs to render mobile view appointment details on selected date\n };\n Month.prototype.renderDatesHeader = function () {\n var container = createElement('div', { className: cls.DATE_HEADER_CONTAINER_CLASS });\n var wrap = createElement('div', { className: cls.DATE_HEADER_WRAP_CLASS });\n container.appendChild(wrap);\n var table = this.createTableLayout();\n this.createColGroup(table, this.colLevels[this.colLevels.length - 1]);\n var trEle = createElement('tr');\n for (var i = 0; i < this.colLevels.length; i++) {\n var level = this.colLevels[i];\n var ntr = trEle.cloneNode();\n for (var j = 0; j < level.length; j++) {\n var td = level[j];\n ntr.appendChild(this.createHeaderCell(td));\n }\n table.querySelector('tbody').appendChild(ntr);\n }\n wrap.appendChild(table);\n return container;\n };\n Month.prototype.createHeaderCell = function (td) {\n var tdEle = createElement('td');\n this.addAttributes(td, tdEle);\n if (td.type === 'monthDay') {\n var ele = createElement('span', { innerHTML: this.parent.getDayNames(this.dayNameFormat)[td.date.getDay()] });\n tdEle.appendChild(ele);\n }\n if (td.type === 'resourceHeader') {\n this.setResourceHeaderContent(tdEle, td);\n }\n if (td.type === 'dateHeader') {\n addClass([tdEle], cls.DATE_HEADER_CLASS);\n tdEle.setAttribute('data-date', td.date.getTime().toString());\n if (this.parent.activeViewOptions.dateHeaderTemplate) {\n var cellArgs = { date: td.date, type: td.type };\n var ele = this.parent.getDateHeaderTemplate()(cellArgs);\n if (ele && ele.length) {\n append([].slice.call(ele), tdEle);\n }\n }\n else {\n var ele = createElement('span', { className: cls.NAVIGATE_CLASS });\n var title = this.parent.globalize.formatDate(td.date, { skeleton: 'full', calendar: this.parent.getCalendarMode() });\n ele.setAttribute('title', title);\n ele.innerHTML =\n (this.parent.calendarUtil.isMonthStart(td.date) && !this.isCurrentDate(td.date) && !this.parent.isAdaptive) ?\n this.parent.globalize.formatDate(td.date, { format: 'MMM d', calendar: this.parent.getCalendarMode() }) :\n this.parent.globalize.formatDate(td.date, { skeleton: 'd', calendar: this.parent.getCalendarMode() });\n tdEle.appendChild(ele);\n }\n this.wireCellEvents(tdEle);\n }\n var args = { elementType: td.type, element: tdEle, date: td.date, groupIndex: td.groupIndex };\n this.parent.trigger(event.renderCell, args);\n return tdEle;\n };\n Month.prototype.getContentSlots = function () {\n if (!(this.colLevels[this.colLevels.length - 1] && this.colLevels[this.colLevels.length - 1][0])) {\n return [];\n }\n var slotDatas = [];\n var prepareSlots = function (rowIndex, renderDate, resData, classList) {\n var data = {\n date: new Date(+renderDate), groupIndex: resData.groupIndex, workDays: resData.workDays,\n type: 'monthCells', className: classList || [cls.WORK_CELLS_CLASS]\n };\n if (!slotDatas[rowIndex]) {\n slotDatas[rowIndex] = [];\n }\n slotDatas[rowIndex].push(data);\n };\n var includeResource = this.parent.currentView !== 'MonthAgenda' &&\n this.parent.activeViewOptions.group.resources.length > 0;\n if (includeResource && !this.parent.uiStateValues.isGroupAdaptive && !this.parent.activeViewOptions.group.byDate) {\n for (var _i = 0, _a = this.colLevels[this.colLevels.length - 2]; _i < _a.length; _i++) {\n var res = _a[_i];\n var dates = res.renderDates.map(function (date) { return new Date(+date); });\n var count = this.parent.activeViewOptions.showWeekend ? util.WEEK_LENGTH : res.workDays.length;\n for (var i = 0; i < (res.renderDates.length / count); i++) {\n var colDates = dates.splice(0, count);\n for (var _b = 0, colDates_1 = colDates; _b < colDates_1.length; _b++) {\n var colDate = colDates_1[_b];\n prepareSlots(i, colDate, res);\n }\n }\n }\n }\n else {\n var dates = this.renderDates.map(function (date) { return new Date(+date); });\n var count = this.parent.activeViewOptions.showWeekend ? util.WEEK_LENGTH :\n this.parent.activeViewOptions.workDays.length;\n for (var i = 0; i < (this.renderDates.length / count); i++) {\n var colDates = dates.splice(0, count);\n for (var _c = 0, colDates_2 = colDates; _c < colDates_2.length; _c++) {\n var colDate = colDates_2[_c];\n if (includeResource) {\n var lastRow = this.colLevels[(this.colLevels.length - 1)];\n var resourcesTd = lastRow.slice(0, lastRow.length / count);\n for (var resIndex = 0; resIndex < resourcesTd.length; resIndex++) {\n var clsList = void 0;\n if (resIndex !== 0) {\n clsList = [cls.WORK_CELLS_CLASS, cls.DISABLE_DATE];\n }\n prepareSlots(i, colDate, resourcesTd[resIndex], clsList);\n }\n }\n else {\n prepareSlots(i, colDate, this.colLevels[this.colLevels.length - 1][0]);\n }\n }\n }\n }\n return slotDatas;\n };\n Month.prototype.updateClassList = function (data) {\n if (this.isOtherMonth(data.date)) {\n data.className.push(cls.OTHERMONTH_CLASS);\n }\n if (this.parent.currentView === 'MonthAgenda' && this.parent.isSelectedDate(data.date)) {\n data.className.push(cls.SELECTED_CELL_CLASS);\n }\n };\n Month.prototype.isOtherMonth = function (date) {\n return date.getTime() < this.monthDates.start.getTime() || date.getTime() > this.monthDates.end.getTime();\n };\n Month.prototype.renderContentArea = function () {\n var tbl = this.createTableLayout(cls.CONTENT_TABLE_CLASS);\n this.addAutoHeightClass(tbl);\n if (this.parent.currentView === 'TimelineMonth') {\n this.createColGroup(tbl, this.colLevels[this.colLevels.length - 1]);\n }\n var monthDate = new Date(this.parent.selectedDate.getTime());\n this.monthDates = {\n start: this.parent.calendarUtil.firstDateOfMonth(monthDate),\n end: this.parent.calendarUtil.lastDateOfMonth(util.addMonths(monthDate, this.parent.activeViewOptions.interval - 1))\n };\n var tBody = tbl.querySelector('tbody');\n append(this.getContentRows(), tBody);\n this.wireCellEvents(tBody);\n return tbl;\n };\n Month.prototype.getContentRows = function () {\n var trows = [];\n var tr = createElement('tr', { attrs: { role: 'row' } });\n var td = createElement('td', { attrs: { role: 'gridcell', 'aria-selected': 'false' } });\n var slotDatas = this.getContentSlots();\n for (var row = 0; row < slotDatas.length; row++) {\n var ntr = tr.cloneNode();\n for (var col = 0; col < slotDatas[row].length; col++) {\n var ntd = this.createContentTd(slotDatas[row][col], td);\n ntr.appendChild(ntd);\n }\n trows.push(ntr);\n }\n return trows;\n };\n Month.prototype.createContentTd = function (data, td) {\n var ntd = td.cloneNode();\n if (data.colSpan) {\n ntd.setAttribute('colspan', data.colSpan.toString());\n }\n this.updateClassList(data);\n var type = data.type;\n if (data.className.indexOf(cls.RESOURCE_PARENT_CLASS) !== -1) {\n data.className.push(cls.RESOURCE_GROUP_CELLS_CLASS);\n type = 'resourceGroupCells';\n }\n if (this.parent.workHours.highlight && this.isWorkDay(data.date, data.workDays)) {\n data.className.push(cls.WORKDAY_CLASS);\n }\n if (this.isCurrentDate(data.date)) {\n data.className.push(cls.CURRENTDATE_CLASS);\n }\n addClass([ntd], data.className);\n ntd.setAttribute('data-date', data.date.getTime().toString());\n if (!isNullOrUndefined(data.groupIndex) || this.parent.uiStateValues.isGroupAdaptive) {\n var groupIndex = this.parent.uiStateValues.isGroupAdaptive ? this.parent.uiStateValues.groupIndex :\n data.groupIndex;\n ntd.setAttribute('data-group-index', '' + groupIndex);\n }\n this.renderDateHeaderElement(data, ntd);\n if (this.parent.activeViewOptions.cellTemplate) {\n var args_1 = { date: data.date, type: type, groupIndex: data.groupIndex };\n append([].slice.call(this.parent.getCellTemplate()(args_1)), ntd);\n }\n var args = { elementType: type, element: ntd, date: data.date, groupIndex: data.groupIndex };\n this.parent.trigger(event.renderCell, args);\n return ntd;\n };\n Month.prototype.getContentAreaElement = function () {\n return this.element.querySelector('.' + cls.CONTENT_WRAP_CLASS);\n };\n Month.prototype.renderDateHeaderElement = function (data, ntd) {\n if (this.parent.currentView === 'TimelineMonth') {\n return;\n }\n var dateHeader = createElement('div', { className: cls.DATE_HEADER_CLASS });\n dateHeader.innerHTML =\n (this.parent.calendarUtil.isMonthStart(data.date) && !this.isCurrentDate(data.date) && !this.parent.isAdaptive) ?\n this.parent.globalize.formatDate(data.date, { format: 'MMM d', calendar: this.parent.getCalendarMode() }) :\n this.parent.globalize.formatDate(data.date, { skeleton: 'd', calendar: this.parent.getCalendarMode() });\n ntd.appendChild(dateHeader);\n if (this.getModuleName() === 'month') {\n addClass([dateHeader], cls.NAVIGATE_CLASS);\n }\n };\n Month.prototype.getMonthStart = function (currentDate) {\n var monthStart = util.getWeekFirstDate(this.parent.calendarUtil.firstDateOfMonth(currentDate), this.parent.firstDayOfWeek);\n var start = new Date(monthStart.getFullYear(), monthStart.getMonth(), monthStart.getDate());\n return start;\n };\n Month.prototype.getMonthEnd = function (currentDate) {\n var endDate = util.addMonths(currentDate, this.parent.activeViewOptions.interval - 1);\n var lastWeekOfMonth = util.getWeekFirstDate(this.parent.calendarUtil.lastDateOfMonth(endDate), this.parent.firstDayOfWeek);\n var monthEnd = util.addDays(lastWeekOfMonth, util.WEEK_LENGTH - 1);\n return monthEnd;\n };\n Month.prototype.getRenderDates = function (workDays) {\n var renderDates = [];\n var currentDate = util.resetTime(this.parent.selectedDate);\n var start = this.getMonthStart(currentDate);\n var monthEnd = this.getMonthEnd(currentDate);\n do {\n if (this.parent.activeViewOptions.showWeekend) {\n renderDates.push(start);\n }\n else {\n if (this.isWorkDay(start, workDays)) {\n renderDates.push(start);\n }\n }\n start = util.addDays(start, 1);\n } while (start.getTime() <= monthEnd.getTime());\n if (!workDays) {\n this.renderDates = renderDates;\n }\n return renderDates;\n };\n Month.prototype.getNextPreviousDate = function (type) {\n if (type === 'next') {\n return util.addMonths(this.parent.selectedDate, this.parent.activeViewOptions.interval);\n }\n else {\n return util.addMonths(this.parent.selectedDate, -(this.parent.activeViewOptions.interval));\n }\n };\n Month.prototype.getEndDateFromStartDate = function (start) {\n return util.addDays(new Date(start.getTime()), 1);\n };\n Month.prototype.getDateRangeText = function () {\n if (this.parent.isAdaptive || isNullOrUndefined(this.parent.activeViewOptions.dateFormat)) {\n if (this.parent.activeViewOptions.interval > 1) {\n var endDate = util.addMonths(util.lastDateOfMonth(this.parent.selectedDate), this.parent.activeViewOptions.interval - 1);\n if (this.parent.selectedDate.getFullYear() === endDate.getFullYear()) {\n var monthNames = (this.parent.globalize.formatDate(this.parent.selectedDate, { format: 'MMMM', calendar: this.parent.getCalendarMode() })) + ' - ' +\n (this.parent.globalize.formatDate(endDate, { format: 'MMMM ', calendar: this.parent.getCalendarMode() })) +\n endDate.getFullYear();\n return monthNames;\n }\n return (this.parent.globalize.formatDate(this.parent.selectedDate, { format: 'MMMM', calendar: this.parent.getCalendarMode() })) + ' ' +\n this.parent.selectedDate.getFullYear() + ' - ' + (this.parent.globalize.formatDate(endDate, { format: 'MMMM ', calendar: this.parent.getCalendarMode() })) +\n endDate.getFullYear();\n }\n return this.parent.globalize.\n formatDate(this.parent.selectedDate, { format: 'MMMM y', calendar: this.parent.getCalendarMode() });\n }\n return this.formatDateRange(this.parent.selectedDate);\n };\n Month.prototype.getLabelText = function (view) {\n return this.parent.localeObj.getConstant(view) + ' of ' +\n this.parent.globalize.formatDate(this.parent.selectedDate, { format: 'MMMM y', calendar: this.parent.getCalendarMode() });\n };\n Month.prototype.createWeekNumberElement = function (text) {\n var tr = createElement('tr');\n var td = createElement('td', {\n className: cls.WEEK_NUMBER_CLASS,\n attrs: { 'title': (text ? this.parent.localeObj.getConstant('week') + ' ' + text : '') },\n innerHTML: (text || '')\n });\n tr.appendChild(td);\n var args = { elementType: 'weekNumberCell', element: td };\n this.parent.trigger(event.renderCell, args);\n return tr;\n };\n Month.prototype.unwireEvents = function () {\n // No scroller events for month view\n };\n /**\n * Get module name.\n */\n Month.prototype.getModuleName = function () {\n return 'month';\n };\n /**\n * To destroy the month.\n * @return {void}\n * @private\n */\n Month.prototype.destroy = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n if (this.element) {\n this.unwireEvents();\n if (this.parent.resourceBase) {\n this.parent.resourceBase.destroy();\n }\n remove(this.element);\n this.element = null;\n if (this.parent.scheduleTouchModule) {\n this.parent.scheduleTouchModule.resetValues();\n }\n }\n };\n return Month;\n}(ViewBase));\nexport { Month };\n","import { isNullOrUndefined, addClass, createElement, append, EventHandler, extend, remove } from '@syncfusion/ej2-base';\nimport { ListBase } from '@syncfusion/ej2-lists';\nimport { DataManager, Query } from '@syncfusion/ej2-data';\nimport { ViewBase } from '../renderer/view-base';\nimport * as util from '../base/util';\nimport * as cls from '../base/css-constant';\nimport * as event from '../base/constant';\nvar AgendaBase = /** @class */ (function () {\n /**\n * Constructor for AgendaBase\n */\n function AgendaBase(parent) {\n this.parent = parent;\n this.viewBase = new ViewBase(parent);\n }\n AgendaBase.prototype.createAgendaContentElement = function (type, listData, aTd, groupOrder, groupIndex) {\n var listElement;\n if (type === 'noEvents') {\n var noEvents = [{ 'subject': this.parent.localeObj.getConstant('noEvents') }];\n listElement = ListBase.createList(this.parent.createElement, noEvents, {\n moduleName: 'agenda',\n listClass: this.parent.activeView.viewClass,\n itemClass: this.parent.activeView.viewClass,\n template: '${subject}
'\n });\n }\n else {\n listElement = ListBase.createList(this.parent.createElement, listData, {\n moduleName: 'agenda',\n listClass: this.parent.activeView.viewClass,\n itemClass: this.parent.activeView.viewClass\n });\n for (var li = 0, length_1 = listData.length; li < length_1; li++) {\n var appWrapper = createElement('div', {\n className: cls.APPOINTMENT_CLASS, attrs: {\n 'data-id': 'Appointment_' + listData[li][this.parent.eventFields.id],\n 'data-guid': listData[li].Guid,\n 'role': 'button',\n 'tabindex': '0',\n 'aria-readonly': this.parent.eventBase.getReadonlyAttribute(listData[li]),\n 'aria-selected': 'false',\n 'aria-grabbed': 'true',\n 'aria-label': (listData[li][this.parent.eventFields.subject]\n || this.parent.eventSettings.fields.subject.default)\n }\n });\n if (!isNullOrUndefined(groupIndex)) {\n appWrapper.setAttribute('data-group-index', groupIndex.toString());\n }\n this.parent.eventBase.applyResourceColor(appWrapper, listData[li], 'borderColor', groupOrder);\n var templateEle = void 0;\n if (!isNullOrUndefined(this.parent.activeViewOptions.eventTemplate)) {\n templateEle = this.parent.getAppointmentTemplate()(listData[li]);\n }\n else {\n templateEle = this.createAppointment(listData[li]);\n }\n append([].slice.call(templateEle), appWrapper);\n listElement.children[li].innerHTML = '';\n listElement.children[li].appendChild(appWrapper);\n var args = { data: listData[li], element: listElement.children[li], cancel: false };\n this.parent.trigger(event.eventRendered, args);\n if (args.cancel) {\n remove(listElement.children[li]);\n }\n }\n }\n aTd.appendChild(listElement);\n if ((this.parent.currentView === 'MonthAgenda' && this.parent.activeViewOptions.group.resources.length > 0)\n || this.parent.currentView === 'Agenda') {\n addClass([aTd], cls.AGENDA_DAY_BORDER_CLASS);\n }\n return aTd;\n };\n AgendaBase.prototype.createAppointment = function (event) {\n var fieldMapping = this.parent.eventFields;\n var eventSubject = (event[fieldMapping.subject] || this.parent.eventSettings.fields.subject.default);\n var eventLocation = (event[fieldMapping.location] || this.parent.eventSettings.fields.location.default);\n var appSubjectWrap = createElement('div', { className: cls.SUBJECT_WRAP });\n if (!isNullOrUndefined(eventLocation) && eventLocation !== '') {\n eventSubject += ',';\n }\n appSubjectWrap.appendChild(createElement('div', { className: cls.SUBJECT_CLASS, innerHTML: eventSubject }));\n if (!isNullOrUndefined(eventLocation) && eventLocation !== '') {\n appSubjectWrap.appendChild(createElement('div', { className: cls.LOCATION_CLASS, innerHTML: eventLocation }));\n }\n if (!isNullOrUndefined(event[fieldMapping.recurrenceRule])) {\n var iconClass = (event[fieldMapping.id] === event[fieldMapping.recurrenceID]) ?\n cls.EVENT_RECURRENCE_ICON_CLASS : cls.EVENT_RECURRENCE_EDIT_ICON_CLASS;\n appSubjectWrap.appendChild(createElement('div', { className: cls.ICON + ' ' + iconClass }));\n }\n var strDate = event[fieldMapping.startTime];\n var endDate = event[fieldMapping.endTime];\n var isAllDay = event[fieldMapping.isAllDay];\n var allDayStr = this.parent.localeObj.getConstant('allDay');\n var timeStr = this.parent.getTimeString(strDate) + ' - ' + this.parent.getTimeString(endDate);\n if (!isNullOrUndefined(event.data)) {\n var eventString = (endDate.getTime() - strDate.getTime()) / util.MS_PER_DAY >= 1 ? allDayStr : timeStr;\n allDayStr = eventString + ' (' + this.parent.localeObj.getConstant('day') + ' '\n + event.data.index + '/' + event.data.count + ')';\n }\n var displayStr = (!isNullOrUndefined(event.data) || isAllDay) ? allDayStr : timeStr;\n var appDateTime = createElement('div', { className: cls.DATE_TIME_CLASS, innerHTML: displayStr });\n return [appSubjectWrap, appDateTime];\n };\n AgendaBase.prototype.processAgendaEvents = function (events) {\n var eventsProcessed = [];\n for (var _i = 0, events_1 = events; _i < events_1.length; _i++) {\n var event_1 = events_1[_i];\n var splited = this.parent.eventBase.splitEventByDay(event_1);\n eventsProcessed = eventsProcessed.concat(splited.length > 1 ? splited : event_1);\n }\n return eventsProcessed;\n };\n AgendaBase.prototype.wireEventActions = function () {\n var eventElement = [].slice.call(this.parent.element.querySelectorAll('.' + cls.APPOINTMENT_CLASS));\n for (var _i = 0, eventElement_1 = eventElement; _i < eventElement_1.length; _i++) {\n var element = eventElement_1[_i];\n this.parent.eventBase.wireAppointmentEvents(element);\n }\n var dateHeaderElement = [].slice.call(this.parent.element.querySelectorAll('.e-m-date'));\n for (var _a = 0, dateHeaderElement_1 = dateHeaderElement; _a < dateHeaderElement_1.length; _a++) {\n var element = dateHeaderElement_1[_a];\n EventHandler.add(element, 'click', this.parent.agendaModule.dayNavigationClick, this);\n }\n };\n AgendaBase.prototype.calculateResourceTableElement = function (tBody, noOfDays, agendaDate) {\n if (isNullOrUndefined(this.parent.resourceBase.lastResourceLevel)) {\n var level = this.viewBase.getDateSlots(this.viewBase.renderDates, this.parent.activeViewOptions.workDays);\n this.parent.resourceBase.generateResourceLevels(level);\n }\n var agendaLastDate = util.addDays(new Date(agendaDate.getTime()), noOfDays);\n var days = (this.parent.activeViewOptions.group.byDate || this.parent.currentView === 'MonthAgenda') ? noOfDays : 1;\n var resColl = this.parent.resourceBase.resourceCollection;\n var resData = this.parent.resourceBase.lastResourceLevel;\n var initialDate = agendaDate;\n for (var i = 0; i < days; i++) {\n var lastLevelInfo = [];\n var tempLastLevelInfo = [];\n var tempIndex = 0;\n var eventObj = void 0;\n var dateObj = void 0;\n var firstDate = util.addDays(initialDate, i);\n var finalDate = (this.parent.activeViewOptions.group.byDate || this.parent.currentView === 'MonthAgenda')\n ? util.addDays(firstDate, 1) : agendaLastDate;\n var agendaCollection = this.parent.eventBase.filterEvents(firstDate, finalDate);\n if (agendaCollection.length > 0 || !this.parent.hideEmptyAgendaDays || this.parent.currentView === 'MonthAgenda') {\n for (var res = 0; res < resData.length; res++) {\n noOfDays = (!this.parent.activeViewOptions.group.byDate || this.parent.currentView === 'MonthAgenda') ? noOfDays : 1;\n var data = [];\n agendaDate = firstDate;\n var resDataCollection = this.parent.eventBase.filterEvents(agendaDate, agendaLastDate, agendaCollection, resData[res]);\n if (resDataCollection.length > 0 || !this.parent.hideEmptyAgendaDays || this.parent.currentView === 'MonthAgenda') {\n for (var r = 0; r < noOfDays; r++) {\n var resDayCollection = this.parent.eventBase.filterEvents(agendaDate, util.addDays(agendaDate, 1), resDataCollection, undefined);\n if (resDayCollection.length > 0 || !this.parent.hideEmptyAgendaDays ||\n this.parent.currentView === 'MonthAgenda') {\n data.push(resDayCollection[0]);\n eventObj = {\n rowSpan: 1, type: 'eventColumn', resource: resColl[resColl.length - 1],\n groupIndex: resData[res].groupIndex, groupOrder: resData[res].groupOrder,\n resourceData: resData[res].resourceData, eventData: resDayCollection, date: agendaDate\n };\n dateObj = {\n rowSpan: 1, type: 'dateColumn', resource: resColl[resColl.length - 1],\n groupOrder: resData[res].groupOrder, resourceData: resData[res].resourceData,\n date: agendaDate\n };\n if (!lastLevelInfo[tempIndex]) {\n lastLevelInfo[tempIndex] = [];\n }\n lastLevelInfo[tempIndex].push(eventObj);\n lastLevelInfo[tempIndex].push(dateObj);\n tempIndex++;\n }\n agendaDate = util.addDays(agendaDate, 1);\n if (agendaDate.getTime() >= agendaLastDate.getTime() || this.parent.activeViewOptions.group.byDate\n || this.parent.currentView === 'MonthAgenda') {\n lastLevelInfo[lastLevelInfo.length - 1][1].cssClass = cls.AGENDA_DAY_BORDER_CLASS;\n var tempObj = {\n rowSpan: data.length, type: 'resourceColumn', resource: resColl[resColl.length - 1],\n groupOrder: resData[res].groupOrder.slice(0, -1), resourceData: resData[res].resourceData,\n groupIndex: (lastLevelInfo.length - data.length), className: [cls.RESOURCE_NAME],\n date: agendaDate\n };\n lastLevelInfo[lastLevelInfo.length - data.length].push(tempObj);\n tempLastLevelInfo.push(extend({}, tempObj, null, true));\n break;\n }\n }\n }\n }\n var topResources = resColl.slice(0, -1);\n var tempGroupedData = [];\n var totalRowSpan = 0;\n for (var y = 0; y < topResources.length; y++) {\n var data = topResources[topResources.length - (y + 1)]\n .dataSource;\n for (var x = 0; x < data.length; x++) {\n var z = 0;\n for (var u = 0; u < tempLastLevelInfo.length; u++) {\n if (tempLastLevelInfo[u].groupOrder[topResources.length - (y + 1)] === data[x][topResources[topResources.length - (y + 1)].idField]) {\n totalRowSpan = totalRowSpan + tempLastLevelInfo[u].rowSpan;\n tempGroupedData.push(extend({}, tempLastLevelInfo[u], null, true));\n }\n if (++z === tempLastLevelInfo.length && tempGroupedData.length > 0) {\n tempGroupedData[0].rowSpan = totalRowSpan;\n tempGroupedData[0].type = 'parentColumnLevel_' + (y + 1);\n tempGroupedData[0].resource = topResources[topResources.length - (y + 1)];\n tempGroupedData[0].resourceData = data[x];\n tempGroupedData[0].date = agendaDate;\n lastLevelInfo[tempGroupedData[0].groupIndex].push(tempGroupedData[0]);\n tempGroupedData = [];\n totalRowSpan = 0;\n }\n }\n }\n }\n this.createResourceTableRow(lastLevelInfo, tBody);\n }\n }\n var totalCollection = this.parent.eventBase.filterEvents(initialDate, agendaLastDate);\n if (totalCollection.length === 0 && !this.parent.activeViewOptions.allowVirtualScrolling && this.parent.hideEmptyAgendaDays) {\n this.renderEmptyContent(tBody, initialDate);\n }\n };\n AgendaBase.prototype.createResourceTableRow = function (tContent, tBody) {\n var tr = createElement('tr', { attrs: { role: 'row' } });\n var ntr;\n var td = createElement('td', { attrs: { role: 'gridcell', 'aria-selected': 'false' } });\n var tempData;\n var rowSpan = 0;\n var level;\n if (this.parent.activeViewOptions.group.byDate || this.parent.currentView === 'MonthAgenda') {\n var tContentCollection = [];\n var parentCollection = this.parent.resourceBase.resourceCollection.slice(0, -1);\n for (var w = 0; w < tContent.length; w++) {\n tContentCollection = tContentCollection.concat(tContent[w]);\n }\n level = (parentCollection.length > 0) ? 'parentColumnLevel_' + parentCollection.length : 'resourceColumn';\n var rowSpanCollection = new DataManager({ json: tContentCollection }).executeLocal(new Query()\n .where('type', 'equal', level));\n for (var x = 0; x < rowSpanCollection.length; x++) {\n rowSpan = rowSpan + rowSpanCollection[x].rowSpan;\n }\n }\n for (var row = 0; row < tContent.length; row++) {\n ntr = tr.cloneNode();\n for (var col = tContent[row].length - 1; col >= 0; col--) {\n var data = tContent[row][col];\n var ntd = td.cloneNode();\n if (data.type === 'dateColumn') {\n if (this.parent.activeViewOptions.group.byDate || this.parent.currentView === 'MonthAgenda') {\n tempData = tContent[row][col];\n continue;\n }\n ntd.setAttribute('data-date', data.date.getTime().toString());\n ntd.appendChild(this.createDateHeaderElement(data.date));\n var className = [cls.AGENDA_CELLS_CLASS, cls.AGENDA_DATE_CLASS];\n if (data.cssClass) {\n className.push(data.cssClass);\n }\n addClass([ntd], className);\n ntr.appendChild(ntd);\n }\n else if (data.type === 'eventColumn') {\n var elementType = (data.eventData.length === 0) ? 'noEvents' : 'data';\n ntd = this.createAgendaContentElement(elementType, data.eventData, ntd, data.groupOrder, data.groupIndex);\n ntd.setAttribute('data-date', data.date.getTime().toString());\n if (this.parent.activeViewOptions.group.byDate || this.parent.currentView === 'MonthAgenda') {\n addClass([ntd], [cls.AGENDA_CELLS_CLASS, cls.AGENDA_DAY_PADDING_CLASS]);\n }\n ntr.appendChild(ntd);\n }\n else {\n ntd.setAttribute('rowspan', data.rowSpan.toString());\n addClass([ntd], cls.AGENDA_RESOURCE_CLASS);\n this.viewBase.setResourceHeaderContent(ntd, data, data.className[0]);\n ntr.appendChild(ntd);\n }\n }\n if (this.parent.activeViewOptions.group.byDate && row === 0 && this.parent.currentView !== 'MonthAgenda') {\n var ntd = td.cloneNode();\n ntd.setAttribute('data-date', tempData.date.getTime().toString());\n ntd.setAttribute('rowspan', rowSpan.toString());\n ntd.appendChild(this.createDateHeaderElement(tempData.date));\n addClass([ntd], [cls.AGENDA_CELLS_CLASS, cls.AGENDA_DATE_CLASS, cls.DATE_BORDER_CLASS]);\n var daysCount = util.getDaysCount(this.parent.selectedDate.getTime(), tempData.date.getTime());\n ntr.setAttribute('aria-rowindex', daysCount.toString());\n if (this.parent.element.querySelector(\".e-agenda-view tr[aria-rowindex=\\\"\" + daysCount + \"\\\"]\")) {\n break;\n }\n ntr.insertBefore(ntd, ntr.childNodes[0]);\n }\n tBody.appendChild(ntr);\n }\n };\n AgendaBase.prototype.createDateHeaderElement = function (date) {\n var dateHeader;\n if (this.parent.activeViewOptions.dateHeaderTemplate) {\n dateHeader = createElement('div', { className: cls.AGENDA_HEADER_CLASS });\n var templateArgs = { date: date, type: 'dateHeader' };\n var template = this.parent.getDateHeaderTemplate()(templateArgs);\n append([].slice.call(template), dateHeader);\n }\n else {\n dateHeader = this.viewBase.getMobileDateElement(date, cls.AGENDA_HEADER_CLASS);\n }\n return dateHeader;\n };\n AgendaBase.prototype.renderEmptyContent = function (tBody, agendaDate) {\n var eTr = this.createTableRowElement(agendaDate, 'noEvents');\n var eTd = eTr.children[0];\n var noEvents = createElement('div', {\n className: cls.AGENDA_EMPTY_EVENT_CLASS,\n innerHTML: this.parent.localeObj.getConstant('noEvents')\n });\n eTd.appendChild(noEvents);\n tBody.appendChild(eTr);\n };\n AgendaBase.prototype.createTableRowElement = function (date, type) {\n var daysCount = util.getDaysCount(this.parent.selectedDate.getTime(), date.getTime());\n var tr = createElement('tr', { attrs: { 'role': 'row', 'aria-rowindex': daysCount.toString() } });\n var td = createElement('td', {\n attrs: {\n 'class': (type === 'monthHeader') ? cls.AGENDA_MONTH_HEADER_CLASS : cls.AGENDA_CELLS_CLASS,\n 'role': 'gridcell',\n 'aria-selected': 'false',\n 'aria-colindex': daysCount.toString(),\n 'data-date': date.getTime().toString()\n }\n });\n var dTd = td.cloneNode();\n var aTd = td.cloneNode();\n tr.appendChild(dTd);\n if (type !== 'noEvents') {\n tr.appendChild(aTd);\n }\n return tr;\n };\n return AgendaBase;\n}());\nexport { AgendaBase };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { formatUnit, isNullOrUndefined, closest, extend, append, prepend } from '@syncfusion/ej2-base';\nimport { createElement, remove, addClass, EventHandler } from '@syncfusion/ej2-base';\nimport { AgendaBase } from '../event-renderer/agenda-base';\nimport { ViewBase } from './view-base';\nimport * as util from '../base/util';\nimport * as event from '../base/constant';\nimport * as cls from '../base/css-constant';\n/**\n * agenda view\n */\nvar Agenda = /** @class */ (function (_super) {\n __extends(Agenda, _super);\n /**\n * Constructor for agenda view\n */\n function Agenda(parent) {\n var _this = _super.call(this, parent) || this;\n _this.viewClass = 'e-agenda-view';\n _this.isInverseTableSelect = false;\n _this.agendaDates = {};\n _this.virtualScrollTop = 1;\n _this.minDate = new Date(1900, 0, 1);\n _this.maxDate = new Date(2099, 11, 31);\n _this.agendaBase = new AgendaBase(parent);\n return _this;\n }\n /**\n * Get module name.\n */\n Agenda.prototype.getModuleName = function () {\n return 'agenda';\n };\n Agenda.prototype.renderLayout = function () {\n this.agendaDates = {};\n this.element = createElement('div', { className: cls.TABLE_WRAP_CLASS });\n addClass([this.element], this.viewClass);\n this.element.appendChild(this.createTableLayout(cls.OUTER_TABLE_CLASS));\n this.parent.element.querySelector('.' + cls.TABLE_CONTAINER_CLASS).appendChild(this.element);\n var eTr = createElement('tr');\n this.element.querySelector('tbody').appendChild(eTr);\n var workTd = createElement('td');\n eTr.appendChild(workTd);\n var wrap = createElement('div', { className: cls.CONTENT_WRAP_CLASS });\n workTd.appendChild(wrap);\n var tbl = this.createTableLayout(cls.CONTENT_TABLE_CLASS);\n wrap.appendChild(tbl);\n var tBody = tbl.querySelector('tbody');\n var agendaDate = util.resetTime(this.parent.selectedDate);\n this.agendaBase.renderEmptyContent(tBody, agendaDate);\n this.wireEvents();\n if (this.parent.resourceBase) {\n this.parent.resourceBase.generateResourceLevels([{ renderDates: this.parent.activeView.renderDates }]);\n }\n if (this.parent.uiStateValues.isGroupAdaptive && !this.parent.element.querySelector('.' + cls.RESOURCE_TOOLBAR_CONTAINER)) {\n this.renderResourceMobileLayout();\n }\n this.parent.notify(event.contentReady, {});\n };\n Agenda.prototype.eventLoad = function (args) {\n this.dataSource = extend([], this.parent.eventsData, null, true);\n for (var _i = 0, _a = this.parent.eventsData; _i < _a.length; _i++) {\n var event_1 = _a[_i];\n delete event_1.generatedDates;\n }\n var eventCollection = args.processedData;\n if (this.parent.uiStateValues.isGroupAdaptive) {\n var resource = this.parent.resourceBase.lastResourceLevel[this.parent.uiStateValues.groupIndex];\n this.dataSource = this.parent.eventBase.filterEventsByResource(resource, this.dataSource);\n eventCollection = this.parent.eventBase.filterEventsByResource(resource, eventCollection);\n }\n this.parent.eventsProcessed = this.agendaBase.processAgendaEvents(eventCollection);\n var agendaDate = util.resetTime(this.parent.selectedDate);\n var tBody = this.parent.getContentTable();\n tBody.innerHTML = '';\n this.renderContent(tBody, agendaDate);\n this.agendaBase.wireEventActions();\n var contentArea = closest(tBody, '.' + cls.CONTENT_WRAP_CLASS);\n contentArea.scrollTop = 1;\n };\n Agenda.prototype.refreshEvent = function (refreshDate) {\n var processedData = [];\n for (var _i = 0, _a = this.dataSource; _i < _a.length; _i++) {\n var eventData = _a[_i];\n var fields = this.parent.eventFields;\n var data = eventData;\n if (isNullOrUndefined(data[fields.recurrenceID]) && !isNullOrUndefined(data[fields.recurrenceRule]) &&\n !isNullOrUndefined(data.generatedDates) && refreshDate >= data.generatedDates.end) {\n processedData = processedData.concat(this.parent.eventBase.generateOccurrence(data, refreshDate));\n }\n }\n this.parent.eventsProcessed = this.parent.eventsProcessed.concat(this.agendaBase.processAgendaEvents(processedData));\n };\n Agenda.prototype.renderContent = function (tBody, agendaDate) {\n var fieldMapping = this.parent.eventFields;\n var firstDate = new Date(agendaDate.getTime());\n var lastDate = (!this.parent.activeViewOptions.allowVirtualScrolling) ?\n util.addDays(firstDate, this.parent.agendaDaysCount) : this.getEndDateFromStartDate(firstDate);\n var isObject = this.appointmentFiltering(firstDate, lastDate);\n if (isObject.length === 0 && this.parent.activeViewOptions.allowVirtualScrolling) {\n lastDate = firstDate;\n firstDate = new Date(this.minDate.getTime());\n isObject = this.appointmentFiltering(firstDate, lastDate);\n if (isObject.length === 0) {\n firstDate = lastDate;\n lastDate = new Date(this.maxDate.getTime());\n isObject = this.appointmentFiltering(firstDate, lastDate);\n }\n }\n if (isObject.length > 0 && this.parent.activeViewOptions.allowVirtualScrolling) {\n var appoint = isObject;\n agendaDate = appoint[0][fieldMapping.startTime];\n agendaDate = new Date(new Date(agendaDate.getTime()).setHours(0, 0, 0, 0));\n this.updateHeaderText(appoint[0][fieldMapping.startTime]);\n }\n var endDate;\n if (!this.parent.hideEmptyAgendaDays || (this.parent.agendaDaysCount > 0 && isObject.length > 0)) {\n var noOfDays = (!this.parent.hideEmptyAgendaDays || !this.parent.activeViewOptions.allowVirtualScrolling ||\n this.parent.agendaDaysCount < isObject.length) ? this.parent.agendaDaysCount : isObject.length;\n if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {\n var date = agendaDate;\n if (!this.parent.activeViewOptions.group.byDate) {\n this.parent.activeViewOptions.allowVirtualScrolling = false;\n date = firstDate;\n if (this.parent.headerModule) {\n this.parent.headerModule.updateDateRange(this.parent.activeView.getDateRangeText());\n this.parent.headerModule.updateHeaderItems('remove');\n }\n }\n this.agendaBase.calculateResourceTableElement(tBody, this.parent.agendaDaysCount, date);\n }\n else {\n for (var day = 0; day < noOfDays; day++) {\n var filterData = [];\n filterData = this.appointmentFiltering(agendaDate);\n var nTr = this.agendaBase.createTableRowElement(agendaDate, 'data');\n if (this.element.querySelector('tr[aria-rowindex=\"' + parseInt(nTr.getAttribute('aria-rowindex'), 10)\n + '\"]')) {\n continue;\n }\n // if (this.isMonthFirstDate(agendaDate)) {\n // tBody.appendChild(this.renderMonthHeader(this.createTableRowElement(agendaDate, 'monthHeader')));\n // }\n var dTd = nTr.children[0];\n var aTd = nTr.children[1];\n if (filterData.length > 0 || (!this.parent.hideEmptyAgendaDays && filterData.length === 0)) {\n var elementType = (!this.parent.hideEmptyAgendaDays && filterData.length === 0) ? 'noEvents' : 'data';\n dTd.appendChild(this.agendaBase.createDateHeaderElement(agendaDate));\n nTr.appendChild(dTd);\n var cTd = this.agendaBase.createAgendaContentElement(elementType, filterData, aTd);\n nTr.appendChild(cTd);\n if (cTd.querySelectorAll('li').length > 0) {\n tBody.appendChild(nTr);\n }\n }\n else if (this.parent.activeViewOptions.allowVirtualScrolling) {\n day--;\n }\n if (this.isCurrentDate(new Date(agendaDate.getTime()))) {\n addClass(dTd.childNodes, cls.AGENDA_CURRENT_DAY_CLASS);\n }\n agendaDate = util.addDays(agendaDate, 1);\n if (agendaDate.getTime() > lastDate.getTime()) {\n break;\n }\n }\n }\n endDate = new Date(agendaDate.getTime() - util.MS_PER_DAY);\n }\n else {\n this.agendaBase.renderEmptyContent(tBody, agendaDate);\n endDate = util.addDays(agendaDate, this.parent.agendaDaysCount - 1);\n }\n this.agendaDates = { start: firstDate, end: endDate };\n };\n // private renderMonthHeader(mTr: Element): Element {\n // mTr.removeAttribute('aria-rowindex');\n // for (let td of [].slice.call(mTr.childNodes)) {\n // td.removeAttribute('aria-colindex');\n // }\n // let headerDate: Date = new Date(parseInt(mTr.children[0].getAttribute('data-date'), 10));\n // let div: Element = createElement('div', {\n // className: cls.DATE_HEADER_CLASS,\n // innerHTML: headerDate.toLocaleString(this.parent.locale, { month: 'long' }) + ' ' + headerDate.getFullYear()\n // });\n // mTr.lastElementChild.appendChild(div);\n // return mTr;\n // }\n Agenda.prototype.agendaScrolling = function (event) {\n this.parent.quickPopup.quickPopupHide();\n if (this.parent.activeViewOptions.allowVirtualScrolling) {\n this.virtualScrolling(event);\n }\n };\n Agenda.prototype.virtualScrolling = function (event) {\n var target = event.target;\n var scrollTop = target.scrollTop;\n var scrollHeight = target.scrollHeight;\n var offsetHeight = target.clientHeight;\n var totalHeight = scrollTop + offsetHeight;\n var direction = (this.virtualScrollTop < scrollTop) ? 'next' : 'previous';\n var tBody = target.querySelector('tbody');\n var emptyTBody = createElement('tbody');\n var topElement = this.getElementFromScrollerPosition(event, direction);\n var scrollDate = new Date(parseInt(topElement.getAttribute('data-date'), 0));\n var filterDate;\n var filterData;\n if (scrollTop === 0) {\n filterDate = this.getPreviousNextDate(util.addDays(scrollDate, -1), direction);\n filterData = this.appointmentFiltering(filterDate.start, filterDate.end);\n if (filterData.length > 0 || !this.parent.hideEmptyAgendaDays) {\n this.renderContent(emptyTBody, filterDate.start);\n prepend([].slice.call(emptyTBody.childNodes), tBody);\n this.agendaBase.wireEventActions();\n for (var s = 0, element = tBody.children; s < element.length; s++) {\n if (element[s].getAttribute('aria-rowindex') === topElement.getAttribute('aria-colindex')) {\n var scrollToValue = element[s].offsetTop -\n this.element.querySelector('.e-agenda-item').offsetHeight;\n target.scrollTop = scrollToValue;\n break;\n }\n }\n this.updateHeaderText(scrollDate);\n }\n }\n else if (totalHeight === scrollHeight) {\n filterDate = this.getPreviousNextDate(util.addDays(scrollDate, 1), direction);\n filterData = this.appointmentFiltering(filterDate.start, filterDate.end);\n if (filterData.length > 0 || !this.parent.hideEmptyAgendaDays) {\n this.renderContent(emptyTBody, filterDate.start);\n append([].slice.call(emptyTBody.childNodes), tBody);\n this.agendaBase.wireEventActions();\n this.updateHeaderText(scrollDate);\n }\n }\n else {\n this.updateHeaderText(scrollDate);\n }\n this.virtualScrollTop = scrollTop;\n var selectedElements = this.parent.eventBase.getSelectedAppointments();\n if (selectedElements.length > 0) {\n selectedElements[selectedElements.length - 1].focus();\n }\n };\n Agenda.prototype.getElementFromScrollerPosition = function (event, direction) {\n var filterElement;\n var target = event.target;\n var scrollTop = target.scrollTop;\n var scrollHeight = target.scrollHeight;\n var offsetHeight = target.clientHeight;\n var totalHeight = scrollTop + offsetHeight;\n var liCollection = [].slice.call(target.querySelectorAll('.e-agenda-item'));\n var li;\n var liDetails;\n if (liCollection.length > 0) {\n if (scrollTop === 0) {\n li = liCollection[0];\n filterElement = closest(li, '.' + cls.AGENDA_CELLS_CLASS);\n }\n else if (totalHeight === scrollHeight) {\n li = liCollection[liCollection.length - 1];\n filterElement = closest(li, '.' + cls.AGENDA_CELLS_CLASS);\n }\n else {\n for (var a = 0, length_1 = liCollection.length; a < length_1; a++) {\n li = liCollection[a];\n liDetails = li.getBoundingClientRect();\n if (liDetails.top >= 0) {\n filterElement = closest(li, '.' + cls.AGENDA_CELLS_CLASS);\n break;\n }\n }\n }\n }\n return filterElement;\n };\n Agenda.prototype.updateHeaderText = function (date) {\n if (this.parent.showHeaderBar) {\n this.parent.headerModule.updateDateRange(this.getDateRangeText(date));\n }\n };\n Agenda.prototype.getPreviousNextDate = function (date, type) {\n var currentDate = new Date(date.getTime());\n var firstDate = this.getStartDateFromEndDate(date);\n var lastDate = this.getEndDateFromStartDate(date);\n var daysCount = 0;\n do {\n var filterData = this.appointmentFiltering(currentDate);\n if (filterData.length > 0 || !this.parent.hideEmptyAgendaDays) {\n daysCount++;\n }\n currentDate = util.addDays(currentDate, (type === 'next') ? 1 : -1);\n if (currentDate < firstDate || currentDate > lastDate) {\n break;\n }\n } while (daysCount !== this.parent.agendaDaysCount);\n var endDate = util.addDays(currentDate, (type === 'next') ? -1 : 1);\n return (type === 'next') ? { start: date, end: util.addDays(endDate, 1) } : { start: endDate, end: util.addDays(date, 1) };\n };\n Agenda.prototype.appointmentFiltering = function (startDate, endDate) {\n var dateStart;\n var dateEnd;\n if (!isNullOrUndefined(startDate) && isNullOrUndefined(endDate)) {\n dateStart = util.resetTime(new Date(startDate.getTime()));\n dateEnd = util.setTime(new Date(dateStart.getTime()), util.MS_PER_DAY);\n }\n else {\n dateStart = new Date(startDate.getTime());\n dateEnd = new Date(endDate.getTime());\n }\n var filterData = this.parent.eventBase.filterEvents(dateStart, dateEnd);\n if (filterData.length === 0) {\n this.refreshEvent(startDate);\n filterData = this.parent.eventBase.filterEvents(dateStart, dateEnd);\n }\n return filterData;\n };\n Agenda.prototype.getStartDateFromEndDate = function (endDate) {\n var filterDate;\n var fieldMapping = this.parent.eventFields;\n if (this.parent.eventsProcessed.length > 0) {\n var firstDate = Math.min.apply(Math, this.parent.eventsProcessed.map(function (a) {\n var date = a[fieldMapping.startTime];\n return date.getTime();\n }));\n filterDate = this.parent.hideEmptyAgendaDays ? new Date(firstDate) : this.minDate;\n }\n else {\n filterDate = this.parent.hideEmptyAgendaDays ? util.addMonths(endDate, -1) : this.minDate;\n }\n return util.resetTime(filterDate);\n };\n Agenda.prototype.getEndDateFromStartDate = function (startDate) {\n var filterDate;\n var fieldMapping = this.parent.eventFields;\n if (this.parent.eventsProcessed.length > 0) {\n var lastDate = Math.max.apply(Math, this.parent.eventsProcessed.map(function (a) {\n var date = a[fieldMapping.endTime];\n return date.getTime();\n }));\n filterDate = this.parent.hideEmptyAgendaDays ? new Date(lastDate) : this.maxDate;\n }\n else {\n filterDate = this.parent.hideEmptyAgendaDays ? util.addMonths(startDate, 1) : this.maxDate;\n }\n return util.resetTime(util.addDays(filterDate, 1));\n };\n Agenda.prototype.getNextPreviousDate = function (type) {\n var noOfDays = (type === 'next') ? 1 : -1;\n return util.addDays(this.parent.selectedDate, noOfDays);\n };\n Agenda.prototype.startDate = function () {\n return util.resetTime(this.parent.selectedDate);\n };\n Agenda.prototype.endDate = function () {\n if (this.parent.activeViewOptions.allowVirtualScrolling) {\n return this.getEndDateFromStartDate(this.startDate());\n }\n else {\n return util.addDays(this.startDate(), this.parent.agendaDaysCount);\n }\n };\n Agenda.prototype.getDateRangeText = function (date) {\n var formatDate = (this.parent.activeViewOptions.dateFormat) ? this.parent.activeViewOptions.dateFormat : 'MMMM y';\n if (this.parent.activeViewOptions.allowVirtualScrolling || this.parent.isAdaptive) {\n var currentDate = isNullOrUndefined(date) ? this.parent.selectedDate : date;\n return this.parent.globalize.formatDate(currentDate, { format: formatDate, calendar: this.parent.getCalendarMode() });\n }\n else {\n var startDate = this.parent.selectedDate;\n var endDate = util.addDays(startDate, this.parent.agendaDaysCount - 1);\n return this.formatDateRange(startDate, endDate);\n }\n };\n Agenda.prototype.dayNavigationClick = function (e) {\n var date = this.parent.getDateFromElement(closest(e.currentTarget, '.' + cls.AGENDA_CELLS_CLASS));\n if (!isNullOrUndefined(date) && !this.parent.isAdaptive) {\n this.parent.setProperties({ selectedDate: date }, true);\n this.parent.changeView('Day');\n }\n };\n // private isMonthFirstDate(date: Date): boolean {\n // return date.getDate() === 1;\n // }\n Agenda.prototype.wireEvents = function () {\n EventHandler.add(this.element.querySelector('.' + cls.CONTENT_WRAP_CLASS), event.scroll, this.agendaScrolling, this);\n };\n Agenda.prototype.unWireEvents = function () {\n EventHandler.remove(this.element.querySelector('.' + cls.CONTENT_WRAP_CLASS), event.scroll, this.agendaScrolling);\n var dateHeaderElement = [].slice.call(this.element.querySelectorAll('.e-m-date'));\n for (var _i = 0, dateHeaderElement_1 = dateHeaderElement; _i < dateHeaderElement_1.length; _i++) {\n var element = dateHeaderElement_1[_i];\n EventHandler.remove(element, 'click', this.dayNavigationClick);\n }\n };\n Agenda.prototype.addEventListener = function () {\n this.parent.on(event.scrollUiUpdate, this.onAgendaScrollUiUpdate, this);\n this.parent.on(event.dataReady, this.eventLoad, this);\n };\n Agenda.prototype.removeEventListener = function () {\n this.parent.off(event.scrollUiUpdate, this.onAgendaScrollUiUpdate);\n this.parent.off(event.dataReady, this.eventLoad);\n };\n Agenda.prototype.onAgendaScrollUiUpdate = function () {\n var headerHeight = this.getHeaderBarHeight();\n if (this.parent.headerModule) {\n if (this.parent.activeViewOptions.allowVirtualScrolling) {\n this.parent.headerModule.updateHeaderItems('add');\n }\n else {\n this.parent.headerModule.updateHeaderItems('remove');\n }\n }\n var contentArea = this.element.querySelector('.' + cls.CONTENT_WRAP_CLASS);\n contentArea.style.height = formatUnit(this.parent.element.offsetHeight - headerHeight);\n };\n /**\n * To destroy the agenda.\n * @return {void}\n * @private\n */\n Agenda.prototype.destroy = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n if (this.element) {\n this.unWireEvents();\n if (this.parent.resourceBase) {\n this.parent.resourceBase.destroy();\n }\n remove(this.element);\n this.element = null;\n if (this.parent.headerModule && this.parent.activeViewOptions.allowVirtualScrolling) {\n this.parent.headerModule.updateHeaderItems('remove');\n }\n }\n };\n return Agenda;\n}(ViewBase));\nexport { Agenda };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { createElement, addClass, formatUnit, remove } from '@syncfusion/ej2-base';\nimport { AgendaBase } from '../event-renderer/agenda-base';\nimport { Month } from './month';\nimport * as util from '../base/util';\nimport * as cls from '../base/css-constant';\n/**\n * month agenda view\n */\nvar MonthAgenda = /** @class */ (function (_super) {\n __extends(MonthAgenda, _super);\n /**\n * Constructor\n */\n function MonthAgenda(parent) {\n var _this = _super.call(this, parent) || this;\n _this.dayNameFormat = 'narrow';\n _this.viewClass = 'e-month-agenda-view';\n _this.agendaDates = {};\n _this.agendaBase = new AgendaBase(parent);\n return _this;\n }\n MonthAgenda.prototype.renderAppointmentContainer = function () {\n var contentArea = this.getContentAreaElement();\n var wrapperContainer = createElement('div', { className: cls.WRAPPER_CONTAINER_CLASS });\n contentArea.appendChild(wrapperContainer);\n var appWrap = createElement('div', { className: cls.APPOINTMENT_WRAP_CLASS });\n wrapperContainer.appendChild(appWrap);\n this.appendAppContainer(appWrap);\n this.setEventWrapperHeight();\n };\n MonthAgenda.prototype.getDayNameFormat = function () {\n if (this.parent.isAdaptive) {\n return 'narrow';\n }\n return 'abbreviated';\n };\n MonthAgenda.prototype.setEventWrapperHeight = function () {\n var headerHeight = (this.parent.headerModule ? this.parent.headerModule.getHeaderElement().offsetHeight : 0) + 2;\n var resourceWrapper = this.parent.element.querySelector('.' + cls.RESOURCE_HEADER_TOOLBAR);\n if (resourceWrapper) {\n headerHeight += resourceWrapper.offsetHeight;\n }\n var contentArea = this.getContentAreaElement().firstChild;\n var dateHeader = this.element.querySelector('.' + cls.DATE_HEADER_WRAP_CLASS);\n var availableHeight = this.parent.element.offsetHeight - headerHeight - dateHeader.offsetHeight - contentArea.offsetHeight;\n var wrapperContainer = this.element.querySelector('.' + cls.WRAPPER_CONTAINER_CLASS);\n var eventWrapper = this.element.querySelector('.' + cls.APPOINTMENT_WRAP_CLASS);\n wrapperContainer.style.height = eventWrapper.style.height = formatUnit(availableHeight);\n };\n MonthAgenda.prototype.onDataReady = function (args) {\n this.setEventWrapperHeight();\n this.clearElements();\n var eventCollection = args.processedData;\n if (this.parent.uiStateValues.isGroupAdaptive) {\n var resource = this.parent.resourceBase.lastResourceLevel[this.parent.uiStateValues.groupIndex];\n eventCollection = this.parent.eventBase.filterEventsByResource(resource, eventCollection);\n }\n this.parent.eventsProcessed = this.agendaBase.processAgendaEvents(eventCollection);\n var count = 0;\n for (var _i = 0, _a = this.renderDates; _i < _a.length; _i++) {\n var date = _a[_i];\n var filterData = this.appointmentFiltering(date);\n var workCell = this.element.querySelectorAll('.' + cls.WORK_CELLS_CLASS)[count];\n if (filterData.length > 0) {\n if (!workCell.querySelector('.' + cls.APPOINTMENT_INDICATOR_CLASS)) {\n workCell.appendChild(createElement('div', { className: cls.APPOINTMENT_INDICATOR_CLASS }));\n }\n if (date.getTime() === util.resetTime(new Date(this.parent.selectedDate.getTime())).getTime()) {\n this.onEventRender(filterData, date);\n }\n }\n count++;\n }\n };\n MonthAgenda.prototype.onCellClick = function (event) {\n this.parent.quickPopup.quickPopupHide();\n var filterData = this.appointmentFiltering(event.startTime);\n this.onEventRender(filterData, event.startTime);\n this.parent.setProperties({ selectedDate: new Date('' + event.startTime) }, true);\n };\n MonthAgenda.prototype.onEventRender = function (events, date) {\n var appWrap = this.element.querySelector('.' + cls.APPOINTMENT_WRAP_CLASS);\n appWrap.innerHTML = '';\n if (this.parent.activeViewOptions.group.resources.length === 0 || this.parent.uiStateValues.isGroupAdaptive) {\n if (events.length > 0) {\n var appContainer = createElement('div', { className: cls.APPOINTMENT_CONTAINER_CLASS });\n appWrap.appendChild(this.agendaBase.\n createAgendaContentElement('data', events, appContainer));\n }\n else {\n this.appendAppContainer(appWrap);\n }\n }\n else {\n if (events.length > 0) {\n var table = this.createTableLayout();\n var tBody = table.querySelector('tbody');\n this.agendaBase.calculateResourceTableElement(tBody, 1, date);\n table.appendChild(tBody);\n appWrap.appendChild(table);\n }\n else {\n this.appendAppContainer(appWrap);\n }\n }\n this.agendaBase.wireEventActions();\n };\n MonthAgenda.prototype.appointmentFiltering = function (date) {\n var dateStart = util.resetTime(new Date(date.getTime()));\n var dateEnd = util.setTime(new Date(dateStart.getTime()), util.MS_PER_DAY);\n return this.parent.eventBase.filterEvents(dateStart, dateEnd);\n };\n MonthAgenda.prototype.clearElements = function () {\n var appointmentIndicators = [].slice.call(this.element.querySelectorAll('.' + cls.APPOINTMENT_INDICATOR_CLASS));\n for (var _i = 0, appointmentIndicators_1 = appointmentIndicators; _i < appointmentIndicators_1.length; _i++) {\n var appointmentIndicator = appointmentIndicators_1[_i];\n remove(appointmentIndicator);\n }\n this.appendAppContainer(this.element.querySelector('.' + cls.APPOINTMENT_WRAP_CLASS));\n };\n MonthAgenda.prototype.appendAppContainer = function (appWrap) {\n var app = createElement('div', { className: cls.APPOINTMENT_CONTAINER_CLASS });\n addClass([app], cls.AGENDA_NO_EVENT_CLASS);\n app.innerHTML = this.parent.localeObj.getConstant('noEvents');\n appWrap.innerHTML = '';\n appWrap.appendChild(app);\n };\n /**\n * Get module name.\n */\n MonthAgenda.prototype.getModuleName = function () {\n return 'monthAgenda';\n };\n return MonthAgenda;\n}(Month));\nexport { MonthAgenda };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { isNullOrUndefined, setStyleAttribute, extend, EventHandler, createElement } from '@syncfusion/ej2-base';\nimport * as cls from '../base/css-constant';\nimport * as util from '../base/util';\nimport { MonthEvent } from './month';\nvar EVENT_GAP = 2;\nvar BLOCK_INDICATOR_WIDTH = 22;\nvar BLOCK_INDICATOR_HEIGHT = 18;\n/**\n * Timeline view events render\n */\nvar TimelineEvent = /** @class */ (function (_super) {\n __extends(TimelineEvent, _super);\n /**\n * Constructor for timeline views\n */\n function TimelineEvent(parent, type) {\n var _this = _super.call(this, parent) || this;\n _this.startHour = _this.parent.activeView.getStartHour();\n _this.endHour = _this.parent.activeView.getEndHour();\n _this.slotCount = _this.parent.activeViewOptions.timeScale.slotCount;\n _this.interval = _this.parent.activeViewOptions.timeScale.interval;\n _this.day = 0;\n _this.rowIndex = 0;\n _this.renderType = type;\n _this.appContainers = [].slice.call(_this.element.querySelectorAll('.' + cls.APPOINTMENT_CONTAINER_CLASS));\n _this.dayLength = _this.element.querySelectorAll('.' + cls.CONTENT_TABLE_CLASS + ' tbody tr')[0].children.length;\n _this.content = _this.parent.element.querySelector('.' + cls.CONTENT_TABLE_CLASS);\n return _this;\n }\n TimelineEvent.prototype.getSlotDates = function () {\n this.slots = [];\n this.slots.push(this.parent.activeView.renderDates.map(function (date) { return +date; }));\n if (this.parent.headerRows.length > 0 &&\n this.parent.headerRows[this.parent.headerRows.length - 1].option !== 'Hour') {\n this.renderType = 'day';\n this.cellWidth = this.content.offsetWidth / this.dateRender.length;\n this.slotsPerDay = 1;\n }\n else {\n this.slotsPerDay = (this.dayLength / this.dateRender.length);\n }\n };\n TimelineEvent.prototype.getOverlapEvents = function (date, appointments) {\n var appointmentsList = [];\n if (this.renderType === 'day') {\n for (var _i = 0, appointments_1 = appointments; _i < appointments_1.length; _i++) {\n var app = appointments_1[_i];\n if ((util.resetTime(app[this.fields.startTime]).getTime() <= util.resetTime(new Date(date.getTime())).getTime()) &&\n (util.resetTime(app[this.fields.endTime]).getTime() >= util.resetTime(new Date(date.getTime())).getTime())) {\n appointmentsList.push(app);\n }\n }\n }\n else {\n for (var _a = 0, appointments_2 = appointments; _a < appointments_2.length; _a++) {\n var app = appointments_2[_a];\n var eventData = app.data;\n if (eventData[this.fields.startTime].getTime() <= date.getTime() &&\n eventData[this.fields.endTime].getTime() > date.getTime()) {\n appointmentsList.push(app);\n }\n }\n }\n return appointmentsList;\n };\n TimelineEvent.prototype.renderResourceEvents = function () {\n this.removeHeightProperty(cls.RESOURCE_COLUMN_TABLE_CLASS);\n var resources = this.parent.uiStateValues.isGroupAdaptive ?\n [this.parent.resourceBase.lastResourceLevel[this.parent.uiStateValues.groupIndex]] :\n this.parent.resourceBase.renderedResources;\n for (var i = 0; i < resources.length; i++) {\n this.rowIndex = i;\n this.renderEventsHandler(this.parent.activeView.renderDates, this.parent.activeViewOptions.workDays, resources[i]);\n }\n };\n TimelineEvent.prototype.renderEvents = function (event, resIndex) {\n var eventData = event.data;\n var startTime = this.getStartTime(event, eventData);\n var endTime = this.getEndTime(event, eventData);\n this.day = this.parent.getIndexOfDate(this.dateRender, util.resetTime(new Date(startTime.getTime())));\n if (this.day < 0) {\n return;\n }\n var cellTd = this.getCellTd();\n var overlapCount = this.getIndex(startTime);\n event.Index = overlapCount;\n var appHeight = this.eventHeight;\n var diffInDays = eventData.count;\n if (startTime <= endTime) {\n var appWidth = this.getEventWidth(startTime, endTime, event[this.fields.isAllDay], diffInDays);\n appWidth = this.renderType === 'day' ? appWidth - 2 : appWidth;\n var appLeft = 0;\n var appRight = 0;\n var position = this.getPosition(startTime, endTime, event[this.fields.isAllDay], this.day);\n appWidth = (appWidth <= 0) ? this.cellWidth : appWidth; // appWidth 0 when start and end time as same\n this.renderedEvents.push(extend({}, event, null, true));\n var top_1 = this.getRowTop(resIndex);\n var appTop = (top_1 + EVENT_GAP) + (overlapCount * (appHeight + EVENT_GAP));\n appLeft = (this.parent.enableRtl) ? 0 : position;\n appRight = (this.parent.enableRtl) ? position : 0;\n var height = ((overlapCount + 1) * (appHeight + EVENT_GAP)) + this.moreIndicatorHeight;\n if ((this.cellHeight > height) || this.parent.rowAutoHeight) {\n var appointmentElement = this.createAppointmentElement(event, resIndex);\n this.applyResourceColor(appointmentElement, event, 'backgroundColor', this.groupOrder);\n setStyleAttribute(appointmentElement, {\n 'width': appWidth + 'px', 'left': appLeft + 'px', 'right': appRight + 'px', 'top': appTop + 'px'\n });\n this.wireAppointmentEvents(appointmentElement, false, event);\n this.renderEventElement(event, appointmentElement, cellTd);\n if (this.parent.rowAutoHeight) {\n var firstChild = this.getFirstChild(resIndex);\n this.updateCellHeight(firstChild, height);\n }\n }\n else {\n for (var i = 0; i < diffInDays; i++) {\n var moreIndicator = cellTd.querySelector('.' + cls.MORE_INDICATOR_CLASS);\n var appPos = (this.parent.enableRtl) ? appRight : appLeft;\n appPos = (Math.floor(appPos / this.cellWidth) * this.cellWidth);\n if ((cellTd && isNullOrUndefined(moreIndicator)) ||\n (!this.isAlreadyAvail(appPos, cellTd))) {\n var interval = this.interval / this.slotCount;\n var startDate = new Date(this.dateRender[this.day + i].getTime());\n var endDate = util.addDays(this.dateRender[this.day + i], 1);\n var startDateTime = new Date(+startTime);\n var slotStartTime = (new Date(startDateTime.setMinutes(Math.floor(startDateTime.getMinutes() / interval) * interval)));\n var slotEndTime = new Date(slotStartTime.getTime() + (60000 * interval));\n var groupIndex = void 0;\n if (this.parent.activeViewOptions.group.resources.length > 0 && !isNullOrUndefined(resIndex)) {\n groupIndex = resIndex.toString();\n }\n var filterEvents = this.getFilterEvents(startDate, endDate, slotStartTime, slotEndTime, groupIndex);\n var appArea = this.cellHeight - this.moreIndicatorHeight;\n var renderedAppCount = Math.floor(appArea / (appHeight + EVENT_GAP));\n var count = (filterEvents.length - renderedAppCount) <= 0 ? 1 : (filterEvents.length - renderedAppCount);\n var moreIndicatorElement = void 0;\n if (this.renderType === 'day') {\n moreIndicatorElement = this.getMoreIndicatorElement(count, startDate, endDate);\n }\n else {\n moreIndicatorElement = this.getMoreIndicatorElement(count, slotStartTime, slotEndTime);\n }\n if (!isNullOrUndefined(groupIndex)) {\n moreIndicatorElement.setAttribute('data-group-index', groupIndex);\n }\n moreIndicatorElement.style.top = top_1 + appArea + 'px';\n moreIndicatorElement.style.width = this.cellWidth + 'px';\n moreIndicatorElement.style.left = (Math.floor(appLeft / this.cellWidth) * this.cellWidth) + 'px';\n moreIndicatorElement.style.right = (Math.floor(appRight / this.cellWidth) * this.cellWidth) + 'px';\n this.renderElement(cellTd, moreIndicatorElement);\n EventHandler.add(moreIndicatorElement, 'click', this.moreIndicatorClick, this);\n }\n }\n }\n }\n };\n TimelineEvent.prototype.updateCellHeight = function (cell, height) {\n if ((height > cell.offsetHeight)) {\n setStyleAttribute(cell, { 'height': height + 'px' });\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n var resourceCell = this.parent.element.querySelector('.' + cls.RESOURCE_COLUMN_TABLE_CLASS + ' ' + 'tbody td[data-group-index=\"' +\n cell.getAttribute('data-group-index') + '\"]');\n setStyleAttribute(resourceCell, { 'height': height + 'px' });\n }\n }\n };\n TimelineEvent.prototype.getFirstChild = function (index) {\n var query = '.' + cls.CONTENT_TABLE_CLASS + ' tbody td';\n var groupIndex = '';\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n groupIndex = '[data-group-index=\"' + index.toString() + '\"]';\n }\n var td = this.parent.element.querySelector(query + groupIndex);\n return td;\n };\n TimelineEvent.prototype.updateBlockElements = function () {\n var blockElement = [].slice.call(this.element.querySelectorAll('.' + cls.BLOCK_APPOINTMENT_CLASS));\n for (var _i = 0, blockElement_1 = blockElement; _i < blockElement_1.length; _i++) {\n var element = blockElement_1[_i];\n var resIndex = parseInt(element.getAttribute('data-group-index'), 10);\n var firstChild = this.getFirstChild(resIndex);\n element.style.height = firstChild.offsetHeight + 'px';\n var width = Math.round(element.offsetWidth / firstChild.offsetWidth);\n element.style.width = (firstChild.offsetWidth * width) + 'px';\n }\n var blockIndicator = [].slice.call(this.element.querySelectorAll('.' + cls.BLOCK_INDICATOR_CLASS));\n for (var _a = 0, blockIndicator_1 = blockIndicator; _a < blockIndicator_1.length; _a++) {\n var element = blockIndicator_1[_a];\n var resIndex = parseInt(element.getAttribute('data-group-index'), 10);\n element.style.top = this.getRowTop(resIndex) +\n this.getFirstChild(resIndex).offsetHeight - BLOCK_INDICATOR_HEIGHT + 'px';\n }\n };\n TimelineEvent.prototype.getStartTime = function (event, eventData) {\n var startTime = event[this.fields.startTime];\n var schedule = util.getStartEndHours(startTime, this.startHour, this.endHour);\n if (schedule.startHour.getTime() >= eventData[this.fields.startTime]) {\n startTime = schedule.startHour;\n }\n else if (schedule.endHour.getTime() <= eventData[this.fields.startTime]) {\n startTime = this.getNextDay(schedule.startHour, eventData);\n }\n else {\n startTime = eventData[this.fields.startTime];\n }\n // To overcome the overflow\n if (event[this.fields.isAllDay]) {\n eventData[this.fields.startTime] = schedule.startHour;\n }\n return startTime;\n };\n TimelineEvent.prototype.getNextDay = function (startTime, eventData) {\n var startDate;\n for (var i = 1; i <= this.dateRender.length; i++) {\n startDate = util.addDays(startTime, i);\n if (this.parent.getIndexOfDate(this.dateRender, util.resetTime(new Date(startTime.getTime()))) !== -1) {\n eventData.count = eventData.count - 1;\n return startDate;\n }\n }\n return startDate;\n };\n TimelineEvent.prototype.getEndTime = function (event, eventData) {\n var endTime = event[this.fields.endTime];\n var schedule = util.getStartEndHours(endTime, this.startHour, this.endHour);\n if (schedule.endHour.getTime() <= eventData[this.fields.endTime]) {\n endTime = schedule.endHour;\n }\n else {\n endTime = eventData[this.fields.endTime];\n }\n // To overcome the overflow\n if (event[this.fields.isAllDay]) {\n eventData[this.fields.endTime] = schedule.endHour;\n }\n return endTime;\n };\n TimelineEvent.prototype.getEventWidth = function (startDate, endDate, isAllDay, count) {\n if (this.renderType === 'day' || isAllDay) {\n return (count * this.slotsPerDay) * this.cellWidth;\n }\n if (this.isSameDay(startDate, endDate)) {\n return this.getSameDayEventsWidth(startDate, endDate);\n }\n else {\n return this.getSpannedEventsWidth(startDate, endDate, count);\n }\n };\n TimelineEvent.prototype.getSameDayEventsWidth = function (startDate, endDate) {\n return (((endDate.getTime() - startDate.getTime())) / (60 * 1000) * (this.cellWidth * this.slotCount) / this.interval);\n };\n TimelineEvent.prototype.getSpannedEventsWidth = function (startDate, endDate, diffInDays) {\n var width = (diffInDays * this.slotsPerDay) * this.cellWidth;\n var startWidth;\n var endWidth;\n var start = util.getStartEndHours(util.resetTime(new Date(startDate.getTime())), this.startHour, this.endHour);\n startWidth = this.getSameDayEventsWidth(start.startHour, startDate);\n if (this.parent.getIndexOfDate(this.dateRender, util.resetTime(new Date(endDate.getTime()))) === -1) {\n endWidth = 0;\n }\n else {\n var end = util.getStartEndHours(util.resetTime(new Date(endDate.getTime())), this.startHour, this.endHour);\n endWidth = this.getSameDayEventsWidth(endDate, end.endHour);\n endWidth = ((this.slotsPerDay * this.cellWidth) === endWidth) ? 0 : endWidth;\n }\n var spannedWidth = startWidth + endWidth;\n return (width > spannedWidth) ? width - spannedWidth : endWidth - startWidth;\n };\n TimelineEvent.prototype.isSameDay = function (startTime, endTime) {\n var startDay = this.parent.getIndexOfDate(this.dateRender, util.resetTime(new Date(startTime.getTime())));\n var endDay = this.parent.getIndexOfDate(this.dateRender, util.resetTime(new Date(endTime.getTime())));\n return (startDay === endDay);\n };\n TimelineEvent.prototype.getAppointmentLeft = function (schedule, startTime, day) {\n var slotTd = (this.isSameDay(startTime, schedule.startHour)) ?\n ((startTime.getTime() - schedule.startHour.getTime()) / ((60 * 1000) * this.interval)) * this.slotCount : 0;\n if (day === 0) {\n return slotTd;\n }\n else {\n var daySlot = (((schedule.endHour.getTime() - schedule.startHour.getTime()) / (60 * 1000)) / this.interval) * this.slotCount;\n return (daySlot * day) + slotTd;\n }\n };\n TimelineEvent.prototype.getPosition = function (startTime, endTime, isAllDay, day) {\n if (this.renderType === 'day' || isAllDay) {\n return (day * this.slotsPerDay) * this.cellWidth;\n }\n var currentDate = util.resetTime(new Date(this.dateRender[day].getTime()));\n var schedule = util.getStartEndHours(currentDate, this.startHour, this.endHour);\n var cellIndex;\n if (schedule.endHour.getTime() <= endTime.getTime() && schedule.startHour.getTime() >= startTime.getTime()) {\n cellIndex = this.getAppointmentLeft(schedule, schedule.startHour, day);\n }\n else if (schedule.endHour.getTime() <= endTime.getTime()) {\n cellIndex = this.getAppointmentLeft(schedule, startTime, day);\n }\n else if (schedule.startHour.getTime() >= startTime.getTime()) {\n cellIndex = this.getAppointmentLeft(schedule, schedule.startHour, day);\n }\n else {\n cellIndex = this.getAppointmentLeft(schedule, startTime, day);\n }\n return cellIndex * this.cellWidth;\n };\n TimelineEvent.prototype.getFilterEvents = function (startDate, endDate, startTime, endTime, gIndex) {\n if (this.renderType === 'day') {\n return this.getFilteredEvents(startDate, endDate, gIndex);\n }\n else {\n return this.getFilteredEvents(startTime, endTime, gIndex);\n }\n };\n TimelineEvent.prototype.isAlreadyAvail = function (appPos, cellTd) {\n var moreIndicator = [].slice.call(cellTd.querySelectorAll('.' + cls.MORE_INDICATOR_CLASS));\n for (var i = 0; i < moreIndicator.length; i++) {\n var indicatorPos = void 0;\n if (moreIndicator) {\n indicatorPos = (this.parent.enableRtl) ? moreIndicator[i].style.right : moreIndicator[i].style.left;\n }\n if (parseInt(indicatorPos, 10) === Math.floor(appPos)) {\n return true;\n }\n }\n return false;\n };\n TimelineEvent.prototype.getRowTop = function (resIndex) {\n if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {\n var td = this.parent.element.querySelector('.' + cls.CONTENT_WRAP_CLASS + ' ' + 'tbody td[data-group-index=\"'\n + resIndex.toString() + '\"]');\n return td.offsetTop;\n }\n return 0;\n };\n TimelineEvent.prototype.getCellTd = function () {\n var wrapIndex = this.parent.uiStateValues.isGroupAdaptive ? 0 : this.rowIndex;\n return this.appContainers[wrapIndex];\n };\n TimelineEvent.prototype.renderBlockIndicator = function (cellTd, position, resIndex) {\n // No need to render block icon for Year, Month and Week header rows\n if (this.parent.headerRows.length > 0 &&\n (this.parent.headerRows[this.parent.headerRows.length - 1].option !== 'Hour' ||\n this.parent.headerRows[this.parent.headerRows.length - 1].option !== 'Date')) {\n return;\n }\n position = (Math.floor(position / this.cellWidth) * this.cellWidth) + this.cellWidth - BLOCK_INDICATOR_WIDTH;\n if (!this.isAlreadyAvail(position, cellTd)) {\n var blockIndicator = createElement('div', { className: 'e-icons ' + cls.BLOCK_INDICATOR_CLASS });\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n blockIndicator.setAttribute('data-group-index', resIndex.toString());\n }\n if (this.parent.enableRtl) {\n blockIndicator.style.right = position + 'px';\n }\n else {\n blockIndicator.style.left = position + 'px';\n }\n blockIndicator.style.top = this.getRowTop(resIndex) + this.cellHeight - BLOCK_INDICATOR_HEIGHT + 'px';\n this.renderElement(cellTd, blockIndicator);\n }\n };\n return TimelineEvent;\n}(MonthEvent));\nexport { TimelineEvent };\n","import { compile } from '@syncfusion/ej2-base';\nimport { MS_PER_DAY, getWeekNumber } from '../base/util';\n/**\n * timeline header\n */\nvar TimelineHeaderRow = /** @class */ (function () {\n function TimelineHeaderRow(parent, renderDates) {\n this.parent = parent;\n this.renderDates = renderDates;\n }\n TimelineHeaderRow.prototype.groupByYear = function (dates) {\n var result = {};\n for (var _i = 0, dates_1 = dates; _i < dates_1.length; _i++) {\n var d = dates_1[_i];\n var key = d.getFullYear();\n result[key] = result[key] || [];\n result[key].push(d);\n }\n return result;\n };\n TimelineHeaderRow.prototype.groupByMonth = function (dates) {\n var result = {};\n for (var _i = 0, dates_2 = dates; _i < dates_2.length; _i++) {\n var d = dates_2[_i];\n var key = (d.getFullYear() - 1970) * 12 + d.getMonth();\n result[key] = result[key] || [];\n result[key].push(d);\n }\n return result;\n };\n TimelineHeaderRow.prototype.groupByWeek = function (dates) {\n var result = {};\n for (var _i = 0, dates_3 = dates; _i < dates_3.length; _i++) {\n var d = dates_3[_i];\n var jsDate = +new Date(1970, 0, 1);\n var key = Math.ceil(((((+d - jsDate)) / MS_PER_DAY) + new Date(jsDate).getDay() + 1) / 7);\n result[key] = result[key] || [];\n result[key].push(d);\n }\n return result;\n };\n TimelineHeaderRow.prototype.generateSlots = function (data, colspan, template, tempFn, cls, type) {\n var _this = this;\n var tdDatas = [];\n var customHelper = {\n getYear: function (dt) {\n return _this.parent.globalize.formatDate(dt, { format: 'y', calendar: _this.parent.getCalendarMode() });\n },\n getMonth: function (dt) {\n return _this.parent.globalize.formatDate(dt, { format: 'MMMM', calendar: _this.parent.getCalendarMode() });\n },\n getWeekNumber: function (dt) {\n return getWeekNumber(dt);\n }\n };\n var keys = Object.keys(data);\n for (var i = 0; i < keys.length; i++) {\n var dates = data[keys[i]];\n var htmlCol = void 0;\n if (!tempFn) {\n htmlCol = compile(template, customHelper)({ date: dates[0] });\n }\n else {\n var args = { date: dates[0], type: type };\n htmlCol = tempFn(args);\n }\n tdDatas.push({\n date: dates[0], type: type, className: [cls], colSpan: dates.length * colspan, template: htmlCol\n });\n }\n return tdDatas;\n };\n TimelineHeaderRow.prototype.generateColumnLevels = function (dateSlots, hourSlots) {\n var levels = [];\n var rows = this.parent.activeViewOptions.headerRows;\n var lastLevelColspan = 1;\n if (rows[rows.length - 1].option === 'Hour' && hourSlots.length > 0) {\n lastLevelColspan = hourSlots.length / dateSlots.length;\n }\n var tdDatas = [];\n var templateFn;\n for (var _i = 0, rows_1 = rows; _i < rows_1.length; _i++) {\n var row = rows_1[_i];\n switch (row.option) {\n case 'Year':\n templateFn = row.template ? this.parent.templateParser(row.template) : undefined;\n var yearTemplate = '${getYear(date)}';\n var byYear = this.groupByYear(this.renderDates);\n tdDatas = this.generateSlots(byYear, lastLevelColspan, yearTemplate, templateFn, 'e-header-year-cell', 'yearHeader');\n levels.push(tdDatas);\n break;\n case 'Month':\n templateFn = row.template ? this.parent.templateParser(row.template) : undefined;\n var monthTemp = '${getMonth(date)}';\n var byMonth = this.groupByMonth(this.renderDates);\n tdDatas = this.generateSlots(byMonth, lastLevelColspan, monthTemp, templateFn, 'e-header-month-cell', 'monthHeader');\n levels.push(tdDatas);\n break;\n case 'Week':\n templateFn = row.template ? this.parent.templateParser(row.template) : undefined;\n var weekTemplate = '${getWeekNumber(date)}';\n var byWeek = this.groupByWeek(this.renderDates);\n tdDatas = this.generateSlots(byWeek, lastLevelColspan, weekTemplate, templateFn, 'e-header-week-cell', 'weekHeader');\n levels.push(tdDatas);\n break;\n case 'Date':\n tdDatas = dateSlots;\n tdDatas = tdDatas.map(function (value) {\n value.colSpan = lastLevelColspan;\n return value;\n });\n levels.push(tdDatas);\n break;\n case 'Hour':\n if (hourSlots.length > 0) {\n levels.push(hourSlots);\n }\n break;\n }\n }\n return levels;\n };\n return TimelineHeaderRow;\n}());\nexport { TimelineHeaderRow };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { isNullOrUndefined, createElement, prepend, extend, formatUnit, append, setStyleAttribute } from '@syncfusion/ej2-base';\nimport { VerticalView } from './vertical-view';\nimport { TimelineEvent } from '../event-renderer/timeline-view';\nimport * as cls from '../base/css-constant';\nimport { getDateInMs, resetTime } from '../base/util';\nimport { TimelineHeaderRow } from './timeline-header-row';\n/**\n * timeline view\n */\nvar TimelineViews = /** @class */ (function (_super) {\n __extends(TimelineViews, _super);\n function TimelineViews(parent) {\n var _this = _super.call(this, parent) || this;\n _this.dateHeaderTemplate = '${getTimelineDate(date)}';\n _this.baseCssClass = 'e-timeline-view';\n return _this;\n }\n TimelineViews.prototype.getLeftPanelElement = function () {\n return this.element.querySelector('.' + cls.RESOURCE_COLUMN_WRAP_CLASS);\n };\n TimelineViews.prototype.scrollTopPanel = function (target) {\n _super.prototype.scrollTopPanel.call(this, target);\n this.scrollHeaderLabels(target);\n };\n TimelineViews.prototype.scrollToWorkHour = function () {\n var start = this.parent.globalize.parseDate(this.parent.workHours.start, { skeleton: 'Hm', calendar: this.parent.getCalendarMode() });\n var currDateTime = this.isWorkDay(this.parent.selectedDate) && this.parent.workHours.highlight &&\n !isNullOrUndefined(start) ? new Date(+this.parent.selectedDate).setHours(start.getHours(), start.getMinutes())\n : new Date(+this.parent.selectedDate).setHours(0, 0, 0, 0);\n var queryString = '[data-date=\"' + currDateTime + '\"]';\n var firstWorkHourCell = this.element.querySelector(queryString);\n if (firstWorkHourCell) {\n this.getScrollableElement().scrollLeft = firstWorkHourCell.offsetLeft;\n }\n };\n TimelineViews.prototype.scrollToHour = function (hour) {\n var date = this.parent.globalize.parseDate(hour, { skeleton: 'Hm', calendar: this.parent.getCalendarMode() });\n if (isNullOrUndefined(date)) {\n return;\n }\n this.getScrollableElement().scrollLeft = this.getLeftFromDateTime(null, date);\n };\n TimelineViews.prototype.generateColumnLevels = function () {\n var levels = [];\n var dateSlots = this.getDateSlots(this.renderDates, this.parent.activeViewOptions.workDays);\n levels.push(dateSlots);\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n this.parent.resourceBase.generateResourceLevels(dateSlots, !this.parent.uiStateValues.isGroupAdaptive);\n }\n var hourSlots = [];\n if (this.parent.activeViewOptions.timeScale.enable) {\n hourSlots = this.generateTimeSlots(levels[levels.length - 1]);\n levels.push(hourSlots);\n }\n if (this.parent.activeViewOptions.headerRows.length > 0) {\n var renderGn = new TimelineHeaderRow(this.parent, this.renderDates);\n levels = renderGn.generateColumnLevels(dateSlots, hourSlots);\n }\n return levels;\n };\n TimelineViews.prototype.generateTimeSlots = function (dateSlots) {\n var _this = this;\n var handler = function (r) {\n r.type = r.first ? 'majorSlot' : 'minorSlot';\n r.className = r.first ? ['e-time-slots'] : ['e-time-slots', cls.TIME_CELLS_CLASS];\n r.workDays = _this.parent.activeViewOptions.workDays;\n return r;\n };\n var timeSlotData = this.getTimeSlotRows(handler);\n var slots = [];\n for (var _i = 0, dateSlots_1 = dateSlots; _i < dateSlots_1.length; _i++) {\n var data = dateSlots_1[_i];\n data.colSpan = timeSlotData.length;\n var tempTimeSlots = extend([], timeSlotData, null, true);\n for (var _a = 0, tempTimeSlots_1 = tempTimeSlots; _a < tempTimeSlots_1.length; _a++) {\n var slot = tempTimeSlots_1[_a];\n slot.date = new Date(+resetTime(data.date) + getDateInMs(slot.date));\n slots.push(slot);\n }\n }\n return slots;\n };\n TimelineViews.prototype.changeCurrentTimePosition = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.removeCurrentTimeIndicatorElements();\n var currentDateIndex = this.getCurrentTimeIndicatorIndex();\n var left = this.getLeftFromDateTime(currentDateIndex, new Date());\n var height = this.element.querySelector('.' + cls.CONTENT_TABLE_CLASS).offsetHeight;\n var headerWrap = this.element.querySelector('.' + cls.DATE_HEADER_WRAP_CLASS);\n var contentWrap = this.element.querySelector('.' + cls.CONTENT_WRAP_CLASS);\n contentWrap.appendChild(createElement('div', {\n className: cls.CURRENT_TIMELINE_CLASS,\n styles: (this.parent.enableRtl ? 'right' : 'left') + ':' + formatUnit(left) + '; height:' + formatUnit(height)\n }));\n if (this.parent.virtualScrollModule) {\n var timeIndicator = this.parent.element.querySelector('.' + cls.CURRENT_TIMELINE_CLASS);\n var element = this.parent.element.querySelector('.' + cls.CONTENT_WRAP_CLASS + ' table');\n setStyleAttribute(timeIndicator, {\n transform: element.style.transform\n });\n }\n var currentTimeEle = createElement('div', {\n innerHTML: this.parent.getTimeString(new Date()),\n className: cls.CURRENT_TIME_CLASS\n });\n headerWrap.appendChild(currentTimeEle);\n currentTimeEle.style[this.parent.enableRtl ? 'right' : 'left'] = formatUnit(left - (currentTimeEle.offsetWidth / 2));\n };\n TimelineViews.prototype.getLeftFromDateTime = function (currentDateIndex, date) {\n var startHour = this.getStartHour();\n var endHour = this.getEndHour();\n var diffInDates = 0;\n var diffInMinutes = ((date.getHours() - startHour.getHours()) * 60) + (date.getMinutes() - startHour.getMinutes());\n if (!isNullOrUndefined(currentDateIndex)) {\n var end = (endHour.getHours() === 0) ? 24 : endHour.getHours();\n if (currentDateIndex[0] !== 0) {\n diffInDates = (currentDateIndex[0]) * ((end - startHour.getHours()) * 60) + (endHour.getMinutes() - startHour.getMinutes());\n }\n diffInMinutes = diffInDates + diffInMinutes;\n }\n return (diffInMinutes * this.getWorkCellWidth() * this.parent.activeViewOptions.timeScale.slotCount) /\n this.parent.activeViewOptions.timeScale.interval;\n };\n TimelineViews.prototype.getWorkCellWidth = function () {\n return this.element.querySelector('.e-work-cells').offsetWidth;\n };\n TimelineViews.prototype.renderHeader = function () {\n var tr = createElement('tr');\n if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {\n this.parent.resourceBase.renderResourceHeaderIndent(tr);\n }\n var dateTd = createElement('td');\n dateTd.appendChild(this.renderDatesHeader());\n tr.appendChild(dateTd);\n prepend([tr], this.element.querySelector('tbody'));\n };\n TimelineViews.prototype.createAllDayRow = function (table, tdData) {\n // For current time indicator wrapper\n };\n TimelineViews.prototype.getCurrentTimeIndicatorIndex = function () {\n var currentDateIndex = [];\n var index = this.parent.getIndexOfDate(this.renderDates, resetTime(new Date()));\n if (index >= 0) {\n currentDateIndex.push(index);\n }\n return currentDateIndex;\n };\n TimelineViews.prototype.renderContent = function () {\n var tr = createElement('tr');\n if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {\n var resTd = createElement('td');\n resTd.appendChild(this.parent.resourceBase.createResourceColumn());\n tr.appendChild(resTd);\n }\n var workTd = createElement('td');\n var wrap = this.renderContentArea();\n wrap.appendChild(this.createEventTable(this.getRowCount()));\n this.collapseRows(wrap);\n workTd.appendChild(wrap);\n tr.appendChild(workTd);\n if (this.parent.virtualScrollModule) {\n this.parent.virtualScrollModule.renderVirtualTrack(wrap);\n }\n this.element.querySelector('tbody').appendChild(tr);\n };\n TimelineViews.prototype.getRowCount = function () {\n if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {\n return this.parent.resourceBase.renderedResources.length;\n }\n return 1;\n };\n TimelineViews.prototype.getResourceTdData = function (i, tdData) {\n var resLevel = this.parent.resourceBase.renderedResources[i];\n var resSHr = resLevel.resourceData[resLevel.resource.startHourField] || this.parent.workHours.start;\n var resEHr = resLevel.resourceData[resLevel.resource.endHourField] || this.parent.workHours.end;\n tdData.startHour = this.parent.globalize.parseDate(resSHr, { skeleton: 'Hm', calendar: this.parent.getCalendarMode() });\n tdData.endHour = this.parent.globalize.parseDate(resEHr, { skeleton: 'Hm', calendar: this.parent.getCalendarMode() });\n tdData.workDays = resLevel.resourceData[resLevel.resource.workDaysField] || this.parent.workDays;\n tdData.className = resLevel.className;\n tdData.groupIndex = resLevel.groupIndex;\n tdData.groupOrder = resLevel.groupOrder;\n return tdData;\n };\n TimelineViews.prototype.renderContentTable = function (table) {\n var tBody = table.querySelector('tbody');\n append(this.getContentRows(), tBody);\n };\n TimelineViews.prototype.getContentRows = function () {\n var rows = [];\n var tr = createElement('tr', { attrs: { role: 'row' } });\n var td = createElement('td', { attrs: { role: 'gridcell', 'aria-selected': 'false' } });\n var trCount = this.getRowCount();\n for (var i = 0; i < trCount; i++) {\n var ntr = tr.cloneNode();\n for (var _i = 0, _a = this.colLevels[this.colLevels.length - 1]; _i < _a.length; _i++) {\n var tdData = _a[_i];\n if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {\n tdData = this.getResourceTdData(i, tdData);\n }\n var ntd = this.createContentTd(tdData, tdData, td);\n ntr.appendChild(ntd);\n }\n rows.push(ntr);\n }\n return rows;\n };\n TimelineViews.prototype.getContentTdClass = function (r) {\n return (r.first || !this.parent.activeViewOptions.timeScale.enable) ? [cls.WORK_CELLS_CLASS] :\n [cls.WORK_CELLS_CLASS, cls.ALTERNATE_CELLS_CLASS];\n };\n TimelineViews.prototype.renderEvents = function () {\n if (this.parent.activeViewOptions.timeScale.enable) {\n var appointment = new TimelineEvent(this.parent, 'hour');\n appointment.renderAppointments();\n }\n else {\n var appointment = new TimelineEvent(this.parent, 'day');\n appointment.renderAppointments();\n }\n };\n TimelineViews.prototype.getModuleName = function () {\n return 'timelineViews';\n };\n return TimelineViews;\n}(VerticalView));\nexport { TimelineViews };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { EventHandler, createElement, formatUnit } from '@syncfusion/ej2-base';\nimport { Month } from './month';\nimport { TimelineEvent } from '../event-renderer/timeline-view';\nimport * as util from '../base/util';\nimport * as cls from '../base/css-constant';\nimport { TimelineHeaderRow } from './timeline-header-row';\n/**\n * timeline month view\n */\nvar TimelineMonth = /** @class */ (function (_super) {\n __extends(TimelineMonth, _super);\n /**\n * Constructor for timeline month view\n */\n function TimelineMonth(parent) {\n var _this = _super.call(this, parent) || this;\n _this.viewClass = 'e-timeline-month-view';\n _this.isInverseTableSelect = true;\n return _this;\n }\n /**\n * Get module name.\n */\n TimelineMonth.prototype.getModuleName = function () {\n return 'timelineMonth';\n };\n TimelineMonth.prototype.onDataReady = function (args) {\n var appointment = new TimelineEvent(this.parent, 'day');\n appointment.renderAppointments();\n };\n TimelineMonth.prototype.getLeftPanelElement = function () {\n return this.element.querySelector('.' + cls.RESOURCE_COLUMN_WRAP_CLASS);\n };\n TimelineMonth.prototype.scrollTopPanel = function (target) {\n _super.prototype.scrollTopPanel.call(this, target);\n this.scrollHeaderLabels(target);\n };\n TimelineMonth.prototype.setContentHeight = function (content, leftPanelElement, height) {\n if (leftPanelElement) {\n leftPanelElement.style.height = formatUnit(height - this.getScrollXIndent(content));\n }\n content.style.height = formatUnit(height);\n };\n TimelineMonth.prototype.getDateSlots = function (renderDates, workDays) {\n var dateSlots = [];\n for (var _i = 0, renderDates_1 = renderDates; _i < renderDates_1.length; _i++) {\n var col = renderDates_1[_i];\n var classList = [cls.HEADER_CELLS_CLASS];\n if (this.isCurrentDate(col)) {\n classList.push(cls.CURRENT_DAY_CLASS);\n }\n dateSlots.push({ date: col, type: 'dateHeader', className: classList, colSpan: 1, workDays: workDays });\n }\n return dateSlots;\n };\n TimelineMonth.prototype.renderLeftIndent = function (tr) {\n if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {\n this.parent.resourceBase.renderResourceHeaderIndent(tr);\n }\n };\n TimelineMonth.prototype.renderContent = function () {\n var contentTr = createElement('tr');\n if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {\n var resTd = createElement('td');\n resTd.appendChild(this.parent.resourceBase.createResourceColumn());\n contentTr.appendChild(resTd);\n }\n var contentTd = createElement('td');\n this.element.querySelector('tbody').appendChild(contentTr);\n var wrap = createElement('div', { className: cls.CONTENT_WRAP_CLASS });\n wrap.appendChild(this.renderContentArea());\n wrap.appendChild(this.createEventTable(this.getRowCount()));\n this.collapseRows(wrap);\n EventHandler.add(wrap, 'scroll', this.onContentScroll, this);\n contentTd.appendChild(wrap);\n if (this.parent.virtualScrollModule) {\n this.parent.virtualScrollModule.renderVirtualTrack(wrap);\n }\n contentTr.appendChild(contentTd);\n };\n TimelineMonth.prototype.getRowCount = function () {\n if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {\n return this.parent.resourceBase.renderedResources.length;\n }\n return 1;\n };\n TimelineMonth.prototype.getContentSlots = function () {\n var slotDatas = [];\n for (var row = 0; row < this.getRowCount(); row++) {\n for (var _i = 0, _a = this.colLevels[this.colLevels.length - 1]; _i < _a.length; _i++) {\n var data = _a[_i];\n data.className = [cls.WORK_CELLS_CLASS];\n if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {\n var resLevel = this.parent.resourceBase.renderedResources[row];\n data.workDays = resLevel.resourceData[resLevel.resource.workDaysField] || this.parent.workDays;\n data.className = data.className.concat(resLevel.className);\n data.groupIndex = resLevel.groupIndex;\n data.groupOrder = resLevel.groupOrder;\n }\n var slotData = {\n date: new Date(+data.date), colSpan: data.colSpan, groupIndex: data.groupIndex, workDays: data.workDays,\n type: 'monthCells', className: data.className\n };\n if (!slotDatas[row]) {\n slotDatas[row] = [];\n }\n slotDatas[row].push(slotData);\n }\n }\n return slotDatas;\n };\n TimelineMonth.prototype.updateClassList = function () {\n // No need to update content for timeline month view\n };\n TimelineMonth.prototype.unwireEvents = function () {\n EventHandler.remove(this.getContentAreaElement(), 'scroll', this.onContentScroll);\n };\n TimelineMonth.prototype.getMonthStart = function (currentDate) {\n var monthStart = this.parent.calendarUtil.firstDateOfMonth(util.resetTime(currentDate));\n return new Date(monthStart.getFullYear(), monthStart.getMonth(), monthStart.getDate());\n };\n TimelineMonth.prototype.getMonthEnd = function (currentDate) {\n var monthStart = this.parent.calendarUtil.firstDateOfMonth(util.resetTime(currentDate));\n return this.parent.calendarUtil.lastDateOfMonth(util.addMonths(new Date(+monthStart), this.parent.activeViewOptions.interval - 1));\n };\n TimelineMonth.prototype.generateColumnLevels = function () {\n var colLevels = [];\n var level = this.getDateSlots(this.renderDates, this.parent.activeViewOptions.workDays);\n colLevels.push(level);\n if (this.parent.activeViewOptions.group.resources.length > 0) {\n this.parent.resourceBase.generateResourceLevels(level, !this.parent.uiStateValues.isGroupAdaptive);\n }\n var hourSlots = [];\n if (this.parent.activeViewOptions.headerRows.length > 0) {\n var renderGn = new TimelineHeaderRow(this.parent, this.renderDates);\n colLevels = renderGn.generateColumnLevels(level, hourSlots);\n }\n this.colLevels = colLevels;\n return colLevels;\n };\n return TimelineMonth;\n}(Month));\nexport { TimelineMonth };\n","import { Workbook } from '@syncfusion/ej2-excel-export';\nimport { extend } from '@syncfusion/ej2-base';\n/**\n * Excel Export Module\n */\nvar ExcelExport = /** @class */ (function () {\n function ExcelExport(parent) {\n this.parent = parent;\n }\n ExcelExport.prototype.initializeExcelExport = function (excelExportOptions) {\n var _this = this;\n var exportFields = excelExportOptions.fields || Object.keys(this.parent.eventFields).map(function (field) {\n return _this.parent.eventFields[field];\n });\n var exportName = excelExportOptions.fileName || 'Schedule';\n var exportType = excelExportOptions.exportType || 'xlsx';\n var isIncludeOccurrences = excelExportOptions.includeOccurrences || false;\n var eventCollection;\n if (excelExportOptions.customData) {\n eventCollection = !isIncludeOccurrences ? excelExportOptions.customData :\n this.parent.eventBase.getProcessedEvents(excelExportOptions.customData);\n }\n else {\n eventCollection = (!isIncludeOccurrences ? this.parent.eventsData : this.parent.eventsProcessed);\n }\n this.processWorkbook(exportFields, exportName, exportType, eventCollection);\n };\n ExcelExport.prototype.processWorkbook = function (fields, name, type, eventCollection) {\n var _this = this;\n var columns = [];\n var rows = [];\n var columnHeader = [];\n fields.forEach(function (field, i) { return columns.push({ index: i + 1, width: (field === 'Id' ? 20 : 150) }); });\n var style = { fontSize: 12, borders: { color: '#E0E0E0' }, bold: true };\n fields.forEach(function (field, i) { return columnHeader.push({ index: i + 1, value: field, style: style }); });\n rows.push({ index: 1, cells: columnHeader });\n var i = 2;\n var _loop_1 = function (event_1) {\n var columnData = [];\n fields.forEach(function (field, n) {\n var columnRule = { index: n + 1, value: event_1[field || ''] };\n if (field === _this.parent.eventFields.startTime || field === _this.parent.eventFields.endTime) {\n var styleRule = { fontSize: 12, numberFormat: 'm/d/yyyy h:mm AM/PM' };\n columnRule = extend({}, columnRule, { style: styleRule }, true);\n }\n columnData.push(columnRule);\n });\n rows.push({ index: i, cells: columnData });\n i++;\n };\n for (var _i = 0, eventCollection_1 = eventCollection; _i < eventCollection_1.length; _i++) {\n var event_1 = eventCollection_1[_i];\n _loop_1(event_1);\n }\n var workSheet = [{ columns: columns, rows: rows }];\n var book = new Workbook({ worksheets: workSheet }, type, this.parent.locale);\n book.save(name + '.' + type);\n };\n ExcelExport.prototype.getModuleName = function () {\n return 'excelExport';\n };\n ExcelExport.prototype.destroy = function () {\n this.parent = null;\n };\n return ExcelExport;\n}());\nexport { ExcelExport };\n","import { extend } from '@syncfusion/ej2-base';\nimport { DataManager, Query } from '@syncfusion/ej2-data';\nimport { getDateFromRecurrenceDateString, getRecurrenceStringFromDate } from '../../recurrence-editor/date-generator';\nimport { Timezone } from '../timezone/timezone';\n/**\n * ICalendar Export Module\n */\nvar ICalendarExport = /** @class */ (function () {\n function ICalendarExport(parent) {\n this.parent = parent;\n this.timezone = new Timezone();\n }\n ICalendarExport.prototype.initializeCalendarExport = function (fileName) {\n var _this = this;\n var eventsData = extend([], this.parent.eventsData, null, true);\n eventsData = this.parent.eventBase.sortByTime(eventsData);\n var SEPARATOR = (navigator.appVersion.indexOf('Win') !== -1) ? '\\r\\n' : '\\n';\n var iCalendarEvents = [];\n var filterCollection = [];\n var timeZone = this.parent.timezone || this.timezone.getLocalTimezoneName();\n var fields = this.parent.eventFields;\n eventsData.forEach(function (eventObj) {\n var uId = _this.parent.eventBase.generateGuid();\n var editedExDate = [];\n if (eventObj[fields.recurrenceID]) {\n var filter = _this.filterEvents(filterCollection, fields.id, eventObj[fields.recurrenceID]);\n uId = filter[0].UID;\n }\n if (!eventObj[fields.recurrenceID] && eventObj[fields.recurrenceRule] && eventObj[fields.recurrenceException]) {\n var exceptionDateList = void 0;\n var exDate = (eventObj[fields.recurrenceException]).split(',');\n var editedObj = _this.filterEvents(eventsData, fields.recurrenceID, eventObj[fields.id]);\n editedObj.forEach(function (edited) {\n editedExDate.push(getRecurrenceStringFromDate(edited[fields.startTime]));\n });\n exceptionDateList = exDate.filter(function (value) { return (editedExDate.indexOf(value) === -1); });\n eventObj[fields.recurrenceException] = (exceptionDateList.length > 0) ? (exceptionDateList.join(',') + ',') : '';\n }\n var startZone = (eventObj[fields.startTimezone] || timeZone);\n var endZone = (eventObj[fields.endTimezone] || timeZone);\n var calendarEvent = [\n 'BEGIN:VEVENT',\n 'LOCATION:' + (eventObj[fields.location] || ''),\n 'SUMMARY:' + (eventObj[fields.subject] || ''),\n 'UID:' + uId,\n 'DESCRIPTION:' + (eventObj[fields.description] || ''),\n 'END:VEVENT'\n ];\n if (eventObj[fields.isAllDay]) {\n calendarEvent.splice(4, 0, 'DTEND;VALUE=DATE:' + _this.convertDateToString(eventObj[fields.endTime], true));\n calendarEvent.splice(4, 0, 'DTSTART;VALUE=DATE:' + _this.convertDateToString(eventObj[fields.startTime], true));\n }\n else if (!eventObj[fields.isAllDay] && !eventObj[fields.recurrenceRule]) {\n calendarEvent.splice(4, 0, 'DTEND:' + _this.convertDateToString(eventObj[fields.endTime]));\n calendarEvent.splice(4, 0, 'DTSTART:' + _this.convertDateToString(eventObj[fields.startTime]));\n }\n else {\n calendarEvent.splice(4, 0, 'DTEND;TZID=\"' + endZone + '\":' + _this.convertDateToString(eventObj[fields.endTime]));\n calendarEvent.splice(4, 0, 'DTSTART;TZID=\"' + startZone + '\":'\n + _this.convertDateToString(eventObj[fields.startTime]));\n }\n if (eventObj[fields.recurrenceRule]) {\n calendarEvent.splice(4, 0, 'RRULE:' + eventObj[fields.recurrenceRule]);\n }\n if (eventObj[fields.recurrenceException]) {\n var exDate = eventObj[fields.recurrenceException].split(',');\n for (var i = 0; i < exDate.length - 1; i++) {\n calendarEvent.splice(5, 0, 'EXDATE:' +\n _this.convertDateToString(getDateFromRecurrenceDateString(exDate[i]), eventObj[fields.isAllDay]));\n }\n }\n if (eventObj[fields.recurrenceID]) {\n calendarEvent.splice(4, 0, 'RECURRENCE-ID;TZID=\"' + startZone + '\":'\n + _this.convertDateToString(eventObj[fields.startTime], eventObj[fields.isAllDay]));\n }\n var customFields = _this.customFieldFilter(eventObj, fields);\n if (customFields.length > 0) {\n customFields.forEach(function (customField) {\n return calendarEvent.splice(4, 0, customField + ':' + (eventObj[customField] || ''));\n });\n }\n var app = extend({}, eventObj);\n app.UID = uId;\n filterCollection.push(app);\n iCalendarEvents.push(calendarEvent.join(SEPARATOR));\n });\n var iCalendar = [\n 'BEGIN:VCALENDAR',\n 'PRODID:-//Syncfusion Inc//Scheduler//EN',\n 'VERSION:2.0',\n 'CALSCALE:GREGORIAN',\n 'METHOD:PUBLISH',\n 'X-WR-CALNAME:' + (fileName || 'Calendar'),\n 'X-WR-TIMEZONE:' + timeZone,\n ].join(SEPARATOR);\n var icsString = iCalendar + SEPARATOR + iCalendarEvents.join(SEPARATOR) + SEPARATOR + 'END:VCALENDAR';\n this.download(icsString, fileName);\n };\n ICalendarExport.prototype.customFieldFilter = function (eventObj, fields) {\n var defaultFields = Object.keys(fields).map(function (key) { return fields[key]; });\n var eventFields = Object.keys(eventObj);\n return eventFields.filter(function (value) { return (defaultFields.indexOf(value) === -1) && (value !== 'Guid'); });\n };\n ICalendarExport.prototype.convertDateToString = function (eventDate, allDay) {\n var year = ('0000' + (eventDate.getFullYear().toString())).slice(-4);\n var month = ('00' + ((eventDate.getMonth() + 1).toString())).slice(-2);\n var date = ('00' + ((eventDate.getDate()).toString())).slice(-2);\n var hours = ('00' + (eventDate.getHours().toString())).slice(-2);\n var minutes = ('00' + (eventDate.getMinutes().toString())).slice(-2);\n var seconds = ('00' + (eventDate.getSeconds().toString())).slice(-2);\n var timeString = (allDay) ? year + month + date : year + month + date + 'T' + hours + minutes + seconds;\n return timeString;\n };\n ICalendarExport.prototype.download = function (icsString, fileName) {\n var buffer = new Blob([icsString], { type: 'data:text/calendar;charset=utf8' });\n fileName = (fileName || 'Calendar') + '.ics';\n if (!(!navigator.msSaveBlob)) {\n navigator.msSaveBlob(buffer, fileName);\n }\n else {\n var downloadLink_1 = document.createElementNS('http://www.w3.org/1999/xhtml', 'a');\n downloadLink_1.download = fileName;\n downloadLink_1.href = URL.createObjectURL(buffer);\n var event_1 = document.createEvent('MouseEvent');\n event_1.initEvent('click', true, true);\n downloadLink_1.dispatchEvent(event_1);\n setTimeout(function () {\n URL.revokeObjectURL(downloadLink_1.href);\n downloadLink_1.href = undefined;\n });\n }\n };\n ICalendarExport.prototype.filterEvents = function (data, field, value) {\n return new DataManager({ json: data }).executeLocal(new Query().where(field, 'equal', value));\n };\n /**\n * Get module name.\n */\n ICalendarExport.prototype.getModuleName = function () {\n return 'iCalendarExport';\n };\n /**\n * To destroy the ICalendarExport.\n * @return {void}\n * @private\n */\n ICalendarExport.prototype.destroy = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n if (this.timezone) {\n this.timezone = null;\n }\n };\n return ICalendarExport;\n}());\nexport { ICalendarExport };\n","import { isNullOrUndefined, extend } from '@syncfusion/ej2-base';\nimport { DataManager, Query } from '@syncfusion/ej2-data';\nimport { getRecurrenceStringFromDate } from '../../recurrence-editor/date-generator';\n/**\n * ICalendar Import Module\n */\nvar ICalendarImport = /** @class */ (function () {\n function ICalendarImport(parent) {\n this.allDay = false;\n this.parent = parent;\n }\n ICalendarImport.prototype.initializeCalendarImport = function (fileContent) {\n var _this = this;\n if (fileContent) {\n var fileReader_1 = new FileReader();\n fileReader_1.onload = function (event) {\n var iCalString = fileReader_1.result;\n _this.iCalendarParser(iCalString);\n };\n fileReader_1.readAsText(fileContent, 'ISO-8859-8');\n }\n };\n ICalendarImport.prototype.iCalendarParser = function (iCalString) {\n var _this = this;\n var fields = this.parent.eventFields;\n var events = [];\n var uId = 'UID';\n var calArray = iCalString.replace(new RegExp('\\\\r', 'g'), '').split('\\n');\n var isEvent = false;\n var curEvent = null;\n var id = this.parent.eventBase.getEventMaxID();\n calArray.forEach(function (element) {\n var index;\n var type;\n var value;\n if (!isEvent && element === 'BEGIN:VEVENT') {\n isEvent = true;\n curEvent = {};\n }\n if (isEvent && element === 'END:VEVENT') {\n isEvent = false;\n events.push(curEvent);\n curEvent = null;\n }\n if (isEvent) {\n index = element.indexOf(':');\n type = element.substr(0, index).replace(/^\\s\\s*/, '').replace(/\\s\\s*$/, '');\n value = element.substr(index + 1, element.length - (index + 1)).replace(/^\\s\\s*/, '').replace(/\\s\\s*$/, '');\n if (element.indexOf('SUMMARY') !== -1) {\n type = 'SUMMARY';\n }\n if (element.indexOf('DTSTART') !== -1) {\n curEvent[fields.startTime] = _this.dateParsing(element);\n curEvent[fields.isAllDay] = _this.allDay;\n _this.allDay = false;\n }\n else if (element.indexOf('DTEND') !== -1) {\n curEvent[fields.endTime] = _this.dateParsing(element);\n }\n else if (element.indexOf('EXDATE') !== -1) {\n value = getRecurrenceStringFromDate(_this.dateParsing(element));\n curEvent[fields.recurrenceException] = (isNullOrUndefined(curEvent[fields.recurrenceException])) ?\n value : curEvent[fields.recurrenceException] + ',' + value;\n }\n else if (element.indexOf('RECURRENCE-ID') !== -1) {\n value = getRecurrenceStringFromDate(_this.dateParsing(element));\n curEvent[fields.recurrenceException] = value;\n curEvent[fields.recurrenceID] = value;\n }\n else {\n switch (type) {\n case 'BEGIN':\n break;\n case 'UID':\n curEvent[uId] = value;\n curEvent[fields.id] = id++;\n break;\n case 'SUMMARY':\n curEvent[fields.subject] = value;\n break;\n case 'LOCATION':\n curEvent[fields.location] = value;\n break;\n case 'DESCRIPTION':\n curEvent[fields.description] = value;\n break;\n case 'RRULE':\n curEvent[fields.recurrenceRule] = value;\n break;\n default:\n curEvent[type] = value;\n }\n }\n }\n });\n var app = extend([], events, null, true);\n this.parent.addEvent(this.processOccurrence(app));\n };\n ICalendarImport.prototype.processOccurrence = function (app) {\n var appoint = [];\n var uId = 'UID';\n var fields = this.parent.eventFields;\n app.forEach(function (eventObj) {\n var parentObj;\n var id;\n if (!eventObj.hasOwnProperty(fields.recurrenceID)) {\n parentObj = eventObj;\n id = eventObj[fields.id];\n }\n var data = (new DataManager({ json: app }).executeLocal(new Query().where('UID', 'equal', eventObj[uId])));\n if (data.length > 1 && isNullOrUndefined(eventObj[fields.recurrenceID])) {\n for (var i = 0; i < data.length; i++) {\n if (data[i].hasOwnProperty(fields.recurrenceID)) {\n var exdate = data[i][fields.recurrenceID];\n data[i][fields.recurrenceID] = id;\n data[i][fields.recurrenceException] = null;\n parentObj[fields.recurrenceException] = (isNullOrUndefined(parentObj[fields.recurrenceException])) ?\n exdate : parentObj[fields.recurrenceException] + ',' + exdate;\n appoint.push(data[i]);\n }\n }\n appoint.push(parentObj);\n }\n else if (!eventObj.hasOwnProperty(fields.recurrenceID)) {\n appoint.push(eventObj);\n }\n });\n return appoint;\n };\n ICalendarImport.prototype.getDateString = function (value) {\n value = value || '';\n return (value\n .replace(/\\\\\\,/g, ',')\n .replace(/\\\\\\;/g, ';')\n .replace(/\\\\[nN]/g, '\\n')\n .replace(/\\\\\\\\/g, '\\\\'));\n };\n ICalendarImport.prototype.dateParsing = function (element) {\n var expression = /([^':;]+)((?:;(?:[^':;]+)(?:=(?:(?:'[^']*')|(?:[^':;]+))))*):(.*)/;\n var split = (element.match(expression)).slice(1);\n var value = split[split.length - 1];\n var newDate = new Date(this.getDateString(value));\n if (element && element.indexOf('VALUE=DATE') > -1) {\n var data_1 = /^(\\d{4})(\\d{2})(\\d{2})$/.exec(value);\n if (data_1 !== null) {\n newDate = new Date(parseInt(data_1[1], 10), parseInt(data_1[2], 10) - 1, parseInt(data_1[3], 10));\n }\n if (element.indexOf('DTSTART') > -1) {\n this.allDay = true;\n }\n }\n var data = /^(\\d{4})(\\d{2})(\\d{2})T(\\d{2})(\\d{2})(\\d{2})(Z)?$/.exec(value);\n if (data !== null) {\n if (data[7] === 'Z') {\n newDate = new Date(Date.UTC(parseInt(data[1], 10), parseInt(data[2], 10) - 1, parseInt(data[3], 10), parseInt(data[4], 10), parseInt(data[5], 10), parseInt(data[6], 10)));\n }\n else {\n newDate = new Date(parseInt(data[1], 10), parseInt(data[2], 10) - 1, parseInt(data[3], 10), parseInt(data[4], 10), parseInt(data[5], 10), parseInt(data[6], 10));\n }\n }\n return newDate;\n };\n /**\n * Get module name.\n */\n ICalendarImport.prototype.getModuleName = function () {\n return 'iCalendarImport';\n };\n /**\n * To destroy the ICalendarImport.\n * @return {void}\n * @private\n */\n ICalendarImport.prototype.destroy = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n };\n return ICalendarImport;\n}());\nexport { ICalendarImport };\n","import * as index from '@syncfusion/ej2-schedule';\nindex.Schedule.Inject( index.Day,index.Week,index.WorkWeek,index.Month,index.Agenda,index.MonthAgenda,index.TimelineViews,index.TimelineMonth,index.Resize,index.DragAndDrop,index.ExcelExport,index.ICalendarExport,index.ICalendarImport);\nexport * from '@syncfusion/ej2-schedule';\n","import * as index from '@syncfusion/ej2-treegrid';\nindex.TreeGrid.Inject( index.Filter,index.Page,index.Sort,index.Reorder,index.Toolbar,index.Aggregate,index.Resize,index.ColumnMenu,index.ExcelExport,index.PdfExport,index.CommandColumn,index.ContextMenu,index.Edit,index.Selection);\nexport * from '@syncfusion/ej2-treegrid';\n","/**\n * TreeMap constants doc\n */\n/**\n * Specifies TreeMap load event name.\n * @private\n */\nexport var load = 'load';\n/**\n * Specifies TreeMap loaded event name.\n * @private\n */\nexport var loaded = 'loaded';\n/**\n * Specifies TreeMap beforePrint event name.\n * @private\n */\nexport var beforePrint = 'beforePrint';\n/**\n * Specifies the itemRendering event name.\n * @private\n */\nexport var itemRendering = 'itemRendering';\n/**\n * Specifies the drilldown start event name.\n * @private\n */\nexport var drillStart = 'drillStart';\n/**\n * Specifies the drilldown end event name.\n * @private\n */\nexport var drillEnd = 'drillEnd';\n/**\n * Specifies the item selected event name.\n * @private\n */\nexport var itemSelected = 'itemSelected';\n/**\n * Specifies the item highlight event name.\n * @private\n */\nexport var itemHighlight = 'itemHighlight';\n/**\n * Specifies the tooltip rendering event name.\n * @private\n */\nexport var tooltipRendering = 'tooltipRendering';\n/**\n * Specifies the item click event name.\n * @private\n */\nexport var itemClick = 'itemClick';\n/**\n * Specifies the item move event name.\n * @private\n */\nexport var itemMove = 'itemMove';\n/**\n * Specifies the mouse click event name.\n * @private\n */\nexport var click = 'click';\n/**\n * Specifies maps double click event name.\n * @private\n */\nexport var doubleClick = 'doubleClick';\n/**\n * Specifies maps right click event name.\n * @private\n */\nexport var rightClick = 'rightClick';\n/**\n * Specifies the mouse move event name.\n * @private\n */\nexport var mouseMove = 'mouseMove';\n/**\n * Specifies legend item rendering event name.\n * @private\n */\nexport var legendItemRendering = 'legendItemRendering';\n/**\n * Specifies legend rendering event name.\n * @private\n */\nexport var legendRendering = 'legendRendering';\n/**\n * Specifies treemap resize event name.\n * @private\n */\nexport var resize = 'resize';\n/**\n * Specifies the font family\n * @private\n */\nexport var defaultFont = 'Roboto, Segoe UI, Noto, Sans-serif';\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n/**\n * Maps base doc\n */\nimport { Property, ChildProperty, Complex, Collection } from '@syncfusion/ej2-base';\nimport { defaultFont } from './constants';\nvar Border = /** @class */ (function (_super) {\n __extends(Border, _super);\n function Border() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('#808080')\n ], Border.prototype, \"color\", void 0);\n __decorate([\n Property(0)\n ], Border.prototype, \"width\", void 0);\n return Border;\n}(ChildProperty));\nexport { Border };\n/**\n * Configures the treemap margin.\n */\nvar Margin = /** @class */ (function (_super) {\n __extends(Margin, _super);\n function Margin() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(10)\n ], Margin.prototype, \"left\", void 0);\n __decorate([\n Property(10)\n ], Margin.prototype, \"right\", void 0);\n __decorate([\n Property(10)\n ], Margin.prototype, \"top\", void 0);\n __decorate([\n Property(10)\n ], Margin.prototype, \"bottom\", void 0);\n return Margin;\n}(ChildProperty));\nexport { Margin };\n/**\n * Configures the fonts in treemap.\n */\nvar Font = /** @class */ (function (_super) {\n __extends(Font, _super);\n function Font() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], Font.prototype, \"size\", void 0);\n __decorate([\n Property(null)\n ], Font.prototype, \"color\", void 0);\n __decorate([\n Property(defaultFont)\n ], Font.prototype, \"fontFamily\", void 0);\n __decorate([\n Property('Normal')\n ], Font.prototype, \"fontWeight\", void 0);\n __decorate([\n Property('Normal')\n ], Font.prototype, \"fontStyle\", void 0);\n __decorate([\n Property(1)\n ], Font.prototype, \"opacity\", void 0);\n return Font;\n}(ChildProperty));\nexport { Font };\n/**\n * To configure title of the maps.\n */\nvar CommonTitleSettings = /** @class */ (function (_super) {\n __extends(CommonTitleSettings, _super);\n function CommonTitleSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], CommonTitleSettings.prototype, \"text\", void 0);\n __decorate([\n Property('')\n ], CommonTitleSettings.prototype, \"description\", void 0);\n return CommonTitleSettings;\n}(ChildProperty));\nexport { CommonTitleSettings };\n/**\n * To configure subtitle of the maps.\n */\nvar SubTitleSettings = /** @class */ (function (_super) {\n __extends(SubTitleSettings, _super);\n function SubTitleSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Complex({ size: '14px' }, Font)\n ], SubTitleSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property('Center')\n ], SubTitleSettings.prototype, \"alignment\", void 0);\n return SubTitleSettings;\n}(CommonTitleSettings));\nexport { SubTitleSettings };\n/**\n * To configure title of the maps.\n */\nvar TitleSettings = /** @class */ (function (_super) {\n __extends(TitleSettings, _super);\n function TitleSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Complex({ size: '15px' }, Font)\n ], TitleSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property('Center')\n ], TitleSettings.prototype, \"alignment\", void 0);\n __decorate([\n Complex({}, SubTitleSettings)\n ], TitleSettings.prototype, \"subtitleSettings\", void 0);\n return TitleSettings;\n}(CommonTitleSettings));\nexport { TitleSettings };\nvar ColorMapping = /** @class */ (function (_super) {\n __extends(ColorMapping, _super);\n function ColorMapping() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], ColorMapping.prototype, \"from\", void 0);\n __decorate([\n Property(null)\n ], ColorMapping.prototype, \"to\", void 0);\n __decorate([\n Property(null)\n ], ColorMapping.prototype, \"color\", void 0);\n __decorate([\n Property(null)\n ], ColorMapping.prototype, \"label\", void 0);\n __decorate([\n Property(null)\n ], ColorMapping.prototype, \"value\", void 0);\n __decorate([\n Property(null)\n ], ColorMapping.prototype, \"minOpacity\", void 0);\n __decorate([\n Property(null)\n ], ColorMapping.prototype, \"maxOpacity\", void 0);\n __decorate([\n Property(true)\n ], ColorMapping.prototype, \"showLegend\", void 0);\n return ColorMapping;\n}(ChildProperty));\nexport { ColorMapping };\n/**\n * Configures the legend settings.\n */\nvar LegendSettings = /** @class */ (function (_super) {\n __extends(LegendSettings, _super);\n function LegendSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], LegendSettings.prototype, \"visible\", void 0);\n __decorate([\n Property('Default')\n ], LegendSettings.prototype, \"mode\", void 0);\n __decorate([\n Property('transparent')\n ], LegendSettings.prototype, \"background\", void 0);\n __decorate([\n Property('Circle')\n ], LegendSettings.prototype, \"shape\", void 0);\n __decorate([\n Property('')\n ], LegendSettings.prototype, \"width\", void 0);\n __decorate([\n Property('')\n ], LegendSettings.prototype, \"height\", void 0);\n __decorate([\n Complex({ size: '13px' }, Font)\n ], LegendSettings.prototype, \"textStyle\", void 0);\n __decorate([\n Property(null)\n ], LegendSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(1)\n ], LegendSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property(15)\n ], LegendSettings.prototype, \"shapeWidth\", void 0);\n __decorate([\n Property(15)\n ], LegendSettings.prototype, \"shapeHeight\", void 0);\n __decorate([\n Property(10)\n ], LegendSettings.prototype, \"shapePadding\", void 0);\n __decorate([\n Property(null)\n ], LegendSettings.prototype, \"imageUrl\", void 0);\n __decorate([\n Complex({ color: '#000000', width: 0 }, Border)\n ], LegendSettings.prototype, \"border\", void 0);\n __decorate([\n Complex({ color: '#000000', width: 0 }, Border)\n ], LegendSettings.prototype, \"shapeBorder\", void 0);\n __decorate([\n Complex({}, CommonTitleSettings)\n ], LegendSettings.prototype, \"title\", void 0);\n __decorate([\n Complex({ size: '14px' }, Font)\n ], LegendSettings.prototype, \"titleStyle\", void 0);\n __decorate([\n Property('Bottom')\n ], LegendSettings.prototype, \"position\", void 0);\n __decorate([\n Property('None')\n ], LegendSettings.prototype, \"orientation\", void 0);\n __decorate([\n Property(false)\n ], LegendSettings.prototype, \"invertedPointer\", void 0);\n __decorate([\n Property('After')\n ], LegendSettings.prototype, \"labelPosition\", void 0);\n __decorate([\n Property('None')\n ], LegendSettings.prototype, \"labelDisplayMode\", void 0);\n __decorate([\n Property('Center')\n ], LegendSettings.prototype, \"alignment\", void 0);\n __decorate([\n Property({ x: 0, y: 0 })\n ], LegendSettings.prototype, \"location\", void 0);\n __decorate([\n Property(null)\n ], LegendSettings.prototype, \"showLegendPath\", void 0);\n __decorate([\n Property(null)\n ], LegendSettings.prototype, \"valuePath\", void 0);\n __decorate([\n Property(false)\n ], LegendSettings.prototype, \"removeDuplicateLegend\", void 0);\n return LegendSettings;\n}(ChildProperty));\nexport { LegendSettings };\nvar InitialDrillSettings = /** @class */ (function (_super) {\n __extends(InitialDrillSettings, _super);\n function InitialDrillSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], InitialDrillSettings.prototype, \"groupIndex\", void 0);\n __decorate([\n Property(null)\n ], InitialDrillSettings.prototype, \"groupName\", void 0);\n return InitialDrillSettings;\n}(ChildProperty));\nexport { InitialDrillSettings };\nvar LeafItemSettings = /** @class */ (function (_super) {\n __extends(LeafItemSettings, _super);\n function LeafItemSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('#808080')\n ], LeafItemSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(false)\n ], LeafItemSettings.prototype, \"autoFill\", void 0);\n __decorate([\n Complex({}, Border)\n ], LeafItemSettings.prototype, \"border\", void 0);\n __decorate([\n Property(0)\n ], LeafItemSettings.prototype, \"gap\", void 0);\n __decorate([\n Property(10)\n ], LeafItemSettings.prototype, \"padding\", void 0);\n __decorate([\n Property(1)\n ], LeafItemSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property(true)\n ], LeafItemSettings.prototype, \"showLabels\", void 0);\n __decorate([\n Property(null)\n ], LeafItemSettings.prototype, \"labelPath\", void 0);\n __decorate([\n Property(null)\n ], LeafItemSettings.prototype, \"labelFormat\", void 0);\n __decorate([\n Property('TopLeft')\n ], LeafItemSettings.prototype, \"labelPosition\", void 0);\n __decorate([\n Complex({ color: null, size: '12px' }, Font)\n ], LeafItemSettings.prototype, \"labelStyle\", void 0);\n __decorate([\n Property(null)\n ], LeafItemSettings.prototype, \"labelTemplate\", void 0);\n __decorate([\n Property('Center')\n ], LeafItemSettings.prototype, \"templatePosition\", void 0);\n __decorate([\n Property('Trim')\n ], LeafItemSettings.prototype, \"interSectAction\", void 0);\n __decorate([\n Collection([], ColorMapping)\n ], LeafItemSettings.prototype, \"colorMapping\", void 0);\n return LeafItemSettings;\n}(ChildProperty));\nexport { LeafItemSettings };\nvar TooltipSettings = /** @class */ (function (_super) {\n __extends(TooltipSettings, _super);\n function TooltipSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], TooltipSettings.prototype, \"visible\", void 0);\n __decorate([\n Property('')\n ], TooltipSettings.prototype, \"template\", void 0);\n __decorate([\n Property(null)\n ], TooltipSettings.prototype, \"format\", void 0);\n __decorate([\n Property('#000816')\n ], TooltipSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(0.75)\n ], TooltipSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property(['Circle'])\n ], TooltipSettings.prototype, \"markerShapes\", void 0);\n __decorate([\n Complex({}, Border)\n ], TooltipSettings.prototype, \"border\", void 0);\n __decorate([\n Complex({ fontFamily: defaultFont, size: '13px' }, Font)\n ], TooltipSettings.prototype, \"textStyle\", void 0);\n return TooltipSettings;\n}(ChildProperty));\nexport { TooltipSettings };\nvar SelectionSettings = /** @class */ (function (_super) {\n __extends(SelectionSettings, _super);\n function SelectionSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], SelectionSettings.prototype, \"enable\", void 0);\n __decorate([\n Property('#808080')\n ], SelectionSettings.prototype, \"fill\", void 0);\n __decorate([\n Property('0.5')\n ], SelectionSettings.prototype, \"opacity\", void 0);\n __decorate([\n Complex({}, Border)\n ], SelectionSettings.prototype, \"border\", void 0);\n __decorate([\n Property('Item')\n ], SelectionSettings.prototype, \"mode\", void 0);\n return SelectionSettings;\n}(ChildProperty));\nexport { SelectionSettings };\nvar HighlightSettings = /** @class */ (function (_super) {\n __extends(HighlightSettings, _super);\n function HighlightSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], HighlightSettings.prototype, \"enable\", void 0);\n __decorate([\n Property('#808080')\n ], HighlightSettings.prototype, \"fill\", void 0);\n __decorate([\n Property('0.5')\n ], HighlightSettings.prototype, \"opacity\", void 0);\n __decorate([\n Complex({}, Border)\n ], HighlightSettings.prototype, \"border\", void 0);\n __decorate([\n Property('Item')\n ], HighlightSettings.prototype, \"mode\", void 0);\n return HighlightSettings;\n}(ChildProperty));\nexport { HighlightSettings };\n/**\n * Options for customizing the tree map levels.\n */\nvar LevelSettings = /** @class */ (function (_super) {\n __extends(LevelSettings, _super);\n function LevelSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], LevelSettings.prototype, \"groupPath\", void 0);\n __decorate([\n Property(0)\n ], LevelSettings.prototype, \"groupGap\", void 0);\n __decorate([\n Property(10)\n ], LevelSettings.prototype, \"groupPadding\", void 0);\n __decorate([\n Complex({}, Border)\n ], LevelSettings.prototype, \"border\", void 0);\n __decorate([\n Property('#808080')\n ], LevelSettings.prototype, \"fill\", void 0);\n __decorate([\n Property(false)\n ], LevelSettings.prototype, \"autoFill\", void 0);\n __decorate([\n Property(1)\n ], LevelSettings.prototype, \"opacity\", void 0);\n __decorate([\n Property(true)\n ], LevelSettings.prototype, \"showHeader\", void 0);\n __decorate([\n Property(20)\n ], LevelSettings.prototype, \"headerHeight\", void 0);\n __decorate([\n Property(null)\n ], LevelSettings.prototype, \"headerTemplate\", void 0);\n __decorate([\n Property(null)\n ], LevelSettings.prototype, \"headerFormat\", void 0);\n __decorate([\n Property('Near')\n ], LevelSettings.prototype, \"headerAlignment\", void 0);\n __decorate([\n Complex({ color: null, size: '13px' }, Font)\n ], LevelSettings.prototype, \"headerStyle\", void 0);\n __decorate([\n Property('TopLeft')\n ], LevelSettings.prototype, \"templatePosition\", void 0);\n __decorate([\n Collection([], ColorMapping)\n ], LevelSettings.prototype, \"colorMapping\", void 0);\n return LevelSettings;\n}(ChildProperty));\nexport { LevelSettings };\n","import { Rect, itemsToOrder, TextOption, measureText, textTrim, hide, wordWrap, textWrap, getTemplateFunction, convertElement, findLabelLocation, PathOption, textFormatter, colorNameToHex, convertHexToColor, colorMap, measureElement, convertToContainer, convertToRect, getShortestEdge, getArea, orderByArea, isParentItem } from '../utils/helper';\nimport { isNullOrUndefined, createElement, extend } from '@syncfusion/ej2-base';\nimport { Location, findChildren, renderTextElement } from '../utils/helper';\nimport { itemRendering } from '../model/constants';\n/**\n * To calculate and render the shape layer\n */\nvar LayoutPanel = /** @class */ (function () {\n function LayoutPanel(treemap) {\n this.treemap = treemap;\n }\n /* tslint:disable:no-string-literal */\n LayoutPanel.prototype.processLayoutPanel = function () {\n var data;\n var totalRect;\n if (this.treemap.levelsOfData && this.treemap.levelsOfData.length > 0) {\n data = (!isNullOrUndefined(this.treemap.initialDrillDown.groupIndex) &&\n !isNullOrUndefined(this.treemap.initialDrillDown.groupName)) &&\n (isNullOrUndefined(this.treemap.drilledItems) ? isNullOrUndefined(this.treemap.drilledItems)\n : this.treemap.drilledItems.length === 0) ?\n this.getDrilldownData(this.treemap.levelsOfData[0], [])[0] : this.treemap.levelsOfData[0];\n totalRect = extend({}, this.treemap.areaRect, totalRect, false);\n if (!isNullOrUndefined(this.treemap.treeMapLegendModule) && !isNullOrUndefined(this.treemap.totalRect)) {\n if (this.treemap.legendSettings.position !== 'Float') {\n totalRect = this.treemap.totalRect;\n }\n }\n if (!isNullOrUndefined(this.treemap.currentLevel) &&\n (isNullOrUndefined(this.treemap.drilledItems) ? !isNullOrUndefined(this.treemap.drilledItems)\n : this.treemap.drilledItems.length !== 0)) {\n var count = this.treemap.drilledItems.length - 1;\n var x = this.treemap.drilledItems[count]['data'];\n var y = new Object();\n y[this.treemap.drilledItems[count]['data']['groupName']] = [x];\n if (!isNullOrUndefined(this.treemap.initialDrillDown.groupIndex) && !this.treemap.enableBreadcrumb) {\n this.treemap.currentLevel = this.treemap.drilledItems[count]['data']['groupIndex'];\n }\n this.calculateLayoutItems(y || this.treemap.levelsOfData[0], totalRect);\n this.renderLayoutItems(y || this.treemap.levelsOfData[0]);\n }\n else {\n if (!isNullOrUndefined(this.treemap.initialDrillDown.groupIndex) &&\n (isNullOrUndefined(this.treemap.drilledItems) ? isNullOrUndefined(this.treemap.drilledItems)\n : this.treemap.drilledItems.length === 0)) {\n this.treemap.currentLevel = this.treemap.initialDrillDown.groupIndex;\n }\n this.calculateLayoutItems(data || this.treemap.levelsOfData[0], totalRect);\n this.renderLayoutItems(data || this.treemap.levelsOfData[0]);\n }\n }\n };\n LayoutPanel.prototype.getDrilldownData = function (data, drillData) {\n var treemap = this.treemap;\n var newData = {};\n var child = findChildren(data)['values'];\n if (child && child.length > 0 && drillData.length === 0) {\n for (var i = 0; i < child.length; i++) {\n if (child[i]['groupIndex'] === treemap.initialDrillDown.groupIndex &&\n child[i]['name'] === treemap.initialDrillDown.groupName) {\n child[i]['isDrilled'] = true;\n newData[child[i]['groupName']] = [child[i]];\n drillData.push(newData);\n }\n }\n for (var j = 0; j < child.length; j++) {\n this.getDrilldownData(child[j], drillData);\n }\n }\n return drillData;\n };\n LayoutPanel.prototype.calculateLayoutItems = function (data, rect) {\n this.renderItems = [];\n this.parentData = [];\n if (!isNullOrUndefined(this.treemap.weightValuePath)) {\n if (this.treemap.layoutType.indexOf('SliceAndDice') > -1) {\n this.computeSliceAndDiceDimensional(data, rect);\n }\n else {\n rect.height = rect.height + rect.y;\n rect.width = rect.width + rect.x;\n this.computeSquarifyDimensional(data, rect);\n }\n }\n };\n LayoutPanel.prototype.computeSliceAndDiceDimensional = function (data, coords) {\n var leafItem = this.treemap.leafItemSettings;\n var rect;\n var groups = this.treemap.levels;\n var groupIndex;\n var isLeafItem = false;\n var children = findChildren(data)['values'];\n var gap;\n var headerHeight;\n if (children && children.length > 0) {\n this.sliceAndDiceProcess(children, coords);\n if (this.treemap.levels.length > 0) {\n for (var i = 0; i < children.length; i++) {\n groupIndex = children[i]['groupIndex'];\n isLeafItem = (groups.length === 0 || groupIndex === groups.length);\n gap = isLeafItem ? leafItem.gap : groups[groupIndex].groupGap;\n headerHeight = groups.length === 0 ? 0 : groups[groupIndex] ? groups[groupIndex].showHeader ?\n groups[groupIndex].headerHeight : 0 : groups[groupIndex - 1].showHeader ? groups[groupIndex - 1].headerHeight : 0;\n rect = children[i]['rect'];\n rect = new Rect(rect.x + (gap / 2), rect.y + (headerHeight + (gap / 2)), rect.width - gap, Math.abs(rect.height - (gap + headerHeight)));\n this.computeSliceAndDiceDimensional(children[i], rect);\n }\n }\n }\n return data;\n };\n LayoutPanel.prototype.sliceAndDiceProcess = function (processData, rect) {\n var parentArea = rect.height * rect.width;\n var levels = this.treemap.levels;\n var childValue;\n var alottedValue = 0;\n var totalWeight = 0;\n processData.forEach(function (data) { totalWeight += data['weight']; });\n processData.forEach(function (child) {\n child['weightArea'] = parentArea * child['weight'] / totalWeight;\n });\n var isHorizontal = (this.treemap.layoutType === 'SliceAndDiceAuto') ? (rect.width > rect.height) :\n (this.treemap.layoutType === 'SliceAndDiceHorizontal');\n processData.sort(itemsToOrder);\n for (var i = 0; i < processData.length; i++) {\n var item = processData[i];\n item['isLeafItem'] = (levels.length === 0) || ((this.treemap.isHierarchicalData ||\n isNullOrUndefined(this.treemap.leafItemSettings.labelPath)) ?\n item['groupIndex'] === levels.length - 1 : item['groupIndex'] === this.treemap.levels.length);\n if (isHorizontal) {\n childValue = ((parentArea / totalWeight) * processData[i]['weight']) / rect.height;\n if (alottedValue <= rect.width) {\n processData[i]['rect'] = new Rect(alottedValue + rect.x, rect.y, childValue, rect.height);\n }\n }\n else {\n childValue = ((parentArea / totalWeight) * processData[i]['weight']) / rect.width;\n if (alottedValue <= rect.height) {\n processData[i]['rect'] = new Rect(rect.x, alottedValue + rect.y, rect.width, childValue);\n }\n }\n alottedValue += childValue;\n this.renderItems.push(processData[i]);\n }\n };\n LayoutPanel.prototype.computeSquarifyDimensional = function (data, coords) {\n var leaf = this.treemap.leafItemSettings;\n var rect;\n var levels = this.treemap.levels;\n var groupIndex;\n var isLeafItem = false;\n var item;\n var child = findChildren(data)['values'];\n var index;\n var gap;\n var padding;\n var headerHeight;\n if (child && child.length > 0) {\n if (this.parentData.length === 0) {\n this.parentData = [];\n this.parentData.push(child);\n }\n this.calculateChildrenLayout(data, child, coords);\n if (this.treemap.levels.length > 0) {\n for (var i = 0; i < child.length; i++) {\n item = child[i];\n index = item['groupIndex'];\n rect = item['rect'];\n gap = (item['isLeafItem'] ? leaf.gap : levels[index].groupGap) / 2;\n padding = (item['isLeafItem'] ? leaf.padding : levels[index].groupPadding) / 2;\n headerHeight = this.treemap.isHierarchicalData ? index === 0 && item['isLeafItem'] ? 0 : levels[index] ?\n levels[index].showHeader ? levels[index].headerHeight : 0 : 0 : (levels.length === 0) ? 0 : levels[index] ?\n levels[index].showHeader ? levels[index].headerHeight : 0 : 0;\n rect = new Rect(rect.x + padding, rect.y + (headerHeight + padding), rect.width - padding, rect.height - padding);\n if (!item['isLeafItem'] && item['weight'] > 0) {\n this.computeSquarifyDimensional(child[i], rect);\n }\n }\n }\n }\n };\n LayoutPanel.prototype.calculateChildrenLayout = function (parent, children, coords) {\n this.computeTotalArea(children, getArea(coords));\n children.sort(orderByArea);\n this.performRowsLayout(children, [], coords, []);\n };\n LayoutPanel.prototype.performRowsLayout = function (data, currentRow, rect, stack) {\n var dataLength = data.length;\n if (dataLength === 0) {\n var newCoordinates = this.getCoordinates(currentRow, rect);\n var newStack = stack.concat(newCoordinates);\n return newStack;\n }\n var width = getShortestEdge(rect);\n var nextDatum = data[0];\n var restData = data.slice(1, dataLength);\n if (this.aspectRatio(currentRow, nextDatum, width)) {\n var newRow = currentRow.concat(nextDatum);\n return this.performRowsLayout(restData, newRow, rect, stack);\n }\n else {\n var currentRowLength = currentRow.length;\n var valueSum = 0;\n for (var i = 0; i < currentRowLength; i += 1) {\n valueSum += currentRow[i]['itemArea'];\n }\n var newContainer = this.cutArea(rect, valueSum);\n var newCoordinates = this.getCoordinates(currentRow, rect);\n var newStack = stack.concat(newCoordinates);\n return this.performRowsLayout(data, [], newContainer, newStack);\n }\n };\n LayoutPanel.prototype.aspectRatio = function (currentRow, nextDatum, length) {\n if (currentRow.length === 0) {\n return true;\n }\n else {\n var newRow = currentRow.concat(nextDatum);\n var currentMaxAspectRatio = this.findMaxAspectRatio(currentRow, length);\n var newMaxAspectRatio = this.findMaxAspectRatio(newRow, length);\n return (currentMaxAspectRatio >= newMaxAspectRatio);\n }\n };\n LayoutPanel.prototype.findMaxAspectRatio = function (row, length) {\n var rowLength = row.length;\n var minArea = Infinity;\n var maxArea = -Infinity;\n var sumArea = 0;\n for (var i = 0; i < rowLength; i += 1) {\n var area = row[i]['itemArea'];\n if (area < minArea) {\n minArea = area;\n }\n if (area > maxArea) {\n maxArea = area;\n }\n sumArea += area;\n }\n var result = Math.max((Math.pow(length, 2)) * maxArea / (Math.pow(sumArea, 2)), (Math.pow(sumArea, 2)) /\n ((Math.pow(length, 2)) * minArea));\n return result;\n };\n LayoutPanel.prototype.cutArea = function (rect, area) {\n var newContainer = convertToContainer(rect);\n var width = newContainer.width;\n var height = newContainer.height;\n var xOffset = newContainer.x;\n var yOffset = newContainer.y;\n if (width >= height) {\n var areaWidth = area / height;\n var newWidth = width - areaWidth;\n var container = {\n x: xOffset + areaWidth,\n y: yOffset,\n width: newWidth,\n height: height,\n };\n return convertToRect(container);\n }\n else {\n var areaHeight = area / width;\n var newHeight = height - areaHeight;\n var container = {\n x: xOffset,\n y: yOffset + areaHeight,\n width: width,\n height: newHeight,\n };\n return convertToRect(container);\n }\n };\n LayoutPanel.prototype.getCoordinates = function (row, rect) {\n var container = convertToContainer(rect);\n var headerHeight;\n var width = container.width;\n var height = container.height;\n var xOffset = container.x;\n var yOffset = container.y;\n var rowLength = row.length;\n var levels = this.treemap.levels;\n var leaf = this.treemap.leafItemSettings;\n var index;\n var valueSum = 0;\n for (var i = 0; i < rowLength; i += 1) {\n valueSum += row[i]['itemArea'];\n }\n var areaWidth = valueSum / height;\n var areaHeight = valueSum / width;\n var subXOffset = xOffset;\n var subYOffset = yOffset;\n var padding;\n var coordinates = [];\n var isParent;\n var gap;\n var parentRect;\n for (var i = 0; i < rowLength; i += 1) {\n var item = row[i];\n index = item['groupIndex'];\n item['isLeafItem'] = (levels.length === 0) || (this.treemap.isHierarchicalData ? index === levels.length :\n isNullOrUndefined(leaf.labelPath) ? false : index === levels.length);\n isParent = isParentItem(this.parentData[0], item);\n parentRect = isParent ? this.treemap.areaRect : item['parent'].rect;\n padding = item['isLeafItem'] ? leaf.padding : levels[index].groupPadding;\n if (width >= height) {\n var y1 = subYOffset + item['itemArea'] / areaWidth;\n item['rect'] = {\n x: subXOffset,\n y: subYOffset,\n width: subXOffset + areaWidth,\n height: y1,\n };\n subYOffset = y1;\n }\n else {\n var x1 = subXOffset + item['itemArea'] / areaHeight;\n item['rect'] = {\n x: subXOffset,\n y: subYOffset,\n width: x1,\n height: subYOffset + areaHeight,\n };\n subXOffset = x1;\n }\n if (item['weight'] > 0 && (isParent || (Math.round(rect.y + (padding / 2)) <=\n Math.round(parentRect.y + (parentRect.height - parentRect.y)) && Math.round(rect.x + (padding / 2)) <=\n Math.round(parentRect.x + (parentRect.width - parentRect.x))))) {\n this.renderItems.push(item);\n coordinates.push(item);\n }\n }\n return coordinates;\n };\n LayoutPanel.prototype.computeTotalArea = function (data, area) {\n var dataLength = data.length;\n var dataSum = 0;\n var result = [];\n for (var i = 0; i < dataLength; i += 1) {\n var dataLength_1 = data.length;\n var dataSum_1 = 0;\n for (var i_1 = 0; i_1 < dataLength_1; i_1 += 1) {\n dataSum_1 += data[i_1]['weight'];\n }\n var multiplier = area / dataSum_1;\n var datum = void 0;\n for (var j = 0; j < dataLength_1; j++) {\n datum = data[j];\n datum['itemArea'] = datum['weight'] * multiplier;\n result.push(datum);\n }\n }\n return result;\n };\n LayoutPanel.prototype.onDemandProcess = function (childItems) {\n var parentItem = new Object();\n var totalRect;\n parentItem = childItems[0]['parent'];\n this.treemap.currentLevel = parentItem['isDrilled'] ? parentItem['groupIndex'] : null;\n var parentItemGroupname = new Object();\n if (isNullOrUndefined(parentItem['groupName'])) {\n parentItemGroupname = parentItem;\n }\n else {\n parentItemGroupname[parentItem['groupName']] = [parentItem];\n }\n totalRect = extend({}, this.treemap.areaRect, totalRect, false);\n if (!isNullOrUndefined(this.treemap.treeMapLegendModule) && !isNullOrUndefined(this.treemap.totalRect)) {\n totalRect = this.treemap.totalRect;\n }\n var count = this.treemap.levels.length;\n for (var i = 0; i < count; i++) {\n var levelCount = childItems[0]['groupIndex'];\n if (count === levelCount) {\n this.treemap.levels[count] = this.treemap.levels[i];\n }\n else {\n this.treemap.levels.splice(count - 1, 1);\n }\n }\n this.calculateLayoutItems(parentItemGroupname, totalRect);\n this.renderLayoutItems(parentItemGroupname);\n };\n /* tslint:disable-next-line:max-func-body-length */\n LayoutPanel.prototype.renderLayoutItems = function (renderData) {\n var textCollection = [];\n var position;\n var treeMap = this.treemap;\n var colorMapping;\n var txtVisible;\n var getItemColor;\n var eventArgs;\n this.renderer = treeMap.renderer;\n var trimHeader;\n var textLocation = new Location(0, 0);\n var pathOptions;\n var elementID = treeMap.element.id;\n var index;\n var templatePosition;\n var mode = treeMap.layoutType;\n var rect;\n var format;\n var interSectAction = this.treemap.leafItemSettings.interSectAction;\n var textSize;\n var fill;\n var item;\n var renderText;\n var opacity;\n var padding = 5;\n var rectPath = '';\n var isRender;\n var secondaryEle = document.getElementById(treeMap.element.id + '_Secondary_Element');\n var groupId;\n var textOptions;\n var templateEle;\n var gap;\n var textStyle;\n var levels = treeMap.levels;\n this.layoutGroup = this.renderer.createGroup({ id: elementID + '_TreeMap_' + mode + '_Layout' });\n var itemGroup;\n var level;\n var template;\n var border;\n var templateGroup = createElement('div', {\n id: treeMap.element.id + '_Label_Template_Group',\n className: 'template',\n styles: 'overflow: hidden; position: absolute;pointer-events: none;' +\n 'top:' + treeMap.areaRect.y + 'px;' +\n 'left:' + treeMap.areaRect.x + 'px;' +\n 'height:' + treeMap.areaRect.height + 'px;' +\n 'width:' + treeMap.areaRect.width + 'px;'\n });\n var isLeafItem = false;\n var leaf = treeMap.leafItemSettings;\n var childItems;\n var connectorText;\n for (var i = 0; i < this.renderItems.length; i++) {\n item = this.renderItems[i];\n index = item['groupIndex'];\n if (this.treemap.drillDownView && isNullOrUndefined(this.treemap.currentLevel)\n && index > 0 || this.treemap.drillDownView\n && index > (this.treemap.currentLevel + 1)) {\n continue;\n }\n rect = item['rect'];\n isLeafItem = item['isLeafItem'];\n groupId = elementID + '_Level_Index_' + index + '_Item_Index_' + i;\n itemGroup = this.renderer.createGroup({ id: groupId + '_Group' });\n gap = (isLeafItem ? leaf.gap : levels[index].groupGap) / 2;\n var treemapItemRect = this.treemap.totalRect ? convertToContainer(this.treemap.totalRect) : this.treemap.areaRect;\n if (treeMap.layoutType === 'Squarified') {\n rect.width = Math.abs(rect.x - rect.width) - gap;\n rect.height = Math.abs(rect.y - rect.height) - gap;\n }\n if (treeMap.renderDirection === 'TopRightBottomLeft') {\n rect.x = (treemapItemRect.x + treemapItemRect.width) - rect.width - Math.abs(treemapItemRect.x - rect.x);\n }\n else if (treeMap.renderDirection === 'BottomLeftTopRight') {\n rect.y = (treemapItemRect.y + treemapItemRect.height) - rect.height - Math.abs(treemapItemRect.y - rect.y);\n }\n else if (treeMap.renderDirection === 'BottomRightTopLeft') {\n rect.x = (treemapItemRect.x + treemapItemRect.width) - rect.width - Math.abs(treemapItemRect.x - rect.x);\n rect.y = (treemapItemRect.y + treemapItemRect.height) - rect.height - Math.abs(treemapItemRect.y - rect.y);\n }\n colorMapping = isLeafItem ? leaf.colorMapping : levels[index].colorMapping;\n getItemColor = this.getItemColor(isLeafItem, item);\n fill = getItemColor['fill'];\n opacity = getItemColor['opacity'];\n format = isLeafItem ? leaf.labelFormat : (levels[index]).headerFormat;\n var levelName = void 0;\n txtVisible = isLeafItem ? leaf.showLabels : (levels[index]).showHeader;\n if (index === this.treemap.currentLevel) {\n if (this.treemap.enableBreadcrumb) {\n var re = /_/gi;\n connectorText = '_' + this.treemap.breadcrumbConnector + '_';\n levelName = item['levelOrderName'].replace(re, connectorText);\n levelName = index !== 0 ? '_' + levelName : levelName;\n }\n else {\n levelName = item['name'];\n }\n }\n else {\n if (this.treemap.enableBreadcrumb) {\n item['isDrilled'] = false;\n }\n levelName = item['name'];\n }\n renderText = textFormatter(format, item['data'], this.treemap) || levelName;\n childItems = findChildren(item)['values'];\n renderText = !isLeafItem && childItems && childItems.length > 0 && this.treemap.enableDrillDown ?\n !item['isDrilled'] ? treeMap.enableRtl ? renderText + ' [+]' : '[+] ' + renderText :\n treeMap.enableRtl ? renderText + ' [-]' : '[-] ' + renderText : renderText;\n textStyle = (isLeafItem ? leaf.labelStyle : levels[index].headerStyle);\n textStyle.fontFamily = this.treemap.themeStyle.labelFontFamily || textStyle.fontFamily;\n border = isLeafItem ? leaf.border : levels[index].border;\n position = !isLeafItem ? (levels[index].headerAlignment) === 'Near' ? 'TopLeft' : (levels[index].headerAlignment) === 'Center' ?\n 'TopCenter' : 'TopRight' : leaf.labelPosition;\n templatePosition = isLeafItem ? leaf.templatePosition : levels[index].templatePosition;\n template = isLeafItem ? leaf.labelTemplate : levels[index].headerTemplate;\n item['options'] = { border: border, opacity: opacity, fill: fill };\n eventArgs = {\n cancel: false, name: itemRendering, treemap: this.treemap,\n currentItem: item, RenderItems: this.renderItems, options: item['options']\n };\n this.treemap.trigger(itemRendering, eventArgs);\n if (!eventArgs.cancel) {\n rectPath = ' M ' + rect.x + ' ' + rect.y + ' L ' + (rect.x + rect.width) + ' ' + rect.y +\n ' L ' + (rect.x + rect.width) + ' ' + (rect.y + rect.height) + ' L ' + rect.x + ' ' + (rect.y + rect.height) + 'z';\n pathOptions = new PathOption(groupId + '_RectPath', fill, border.width, border.color, opacity, null, rectPath);\n var path = this.renderer.drawPath(pathOptions);\n itemGroup.appendChild(path);\n if (txtVisible) {\n this.renderItemText(renderText.toString(), itemGroup, textStyle, rect, interSectAction, groupId, fill, position, connectorText);\n }\n if (template) {\n templateEle = this.renderTemplate(secondaryEle, groupId, rect, templatePosition, template, item);\n templateGroup.appendChild(templateEle);\n }\n itemGroup.setAttribute('aria-label', item['name']);\n itemGroup.setAttribute('tabindex', (this.treemap.tabIndex + i + 2).toString());\n this.layoutGroup.appendChild(itemGroup);\n }\n }\n if (templateGroup.childNodes.length > 0) {\n secondaryEle.appendChild(templateGroup);\n }\n this.treemap.svgObject.appendChild(this.layoutGroup);\n };\n LayoutPanel.prototype.renderItemText = function (text, parentElement, textStyle, rect, interSectAction, groupId, fill, position, connectorText) {\n var level;\n var textOptions;\n var headerPosition;\n var secondaryEle = document.getElementById(this.treemap.element.id + '_Secondary_Element');\n var leaf = this.treemap.leafItemSettings;\n var padding = 5;\n var textSize;\n var textLocation;\n var textCollection = [];\n var customText;\n var templateEle;\n var tspanText = [];\n var height = 0;\n var textName;\n textCollection = ((text.indexOf('')) !== -1) ? text.split('
') : null;\n customText = this.labelInterSectAction(rect, text, textStyle, interSectAction);\n textSize = measureText(textCollection && textCollection[0] || customText[0], textStyle);\n if (this.treemap.enableRtl) {\n var labelSize = measureText(text, textStyle);\n var drillSymbolCount = text.search('[+]') || text.search('[-]');\n if (rect.width < labelSize.width && drillSymbolCount > 0) {\n var label = text.substring(drillSymbolCount - 1, text.length);\n var drillSymbol = '[+]';\n var drillSymbolSize = measureText(drillSymbol, textStyle);\n customText['0'] = textTrim(rect.width - drillSymbolSize.width - padding, customText[0], textStyle) + label;\n }\n }\n textLocation = findLabelLocation(rect, position, textSize, 'Text', this.treemap);\n if (!isNullOrUndefined(textCollection)) {\n var collection = [];\n var texts = null;\n var maxNumber = [];\n for (var i = 0; i < textCollection.length; i++) {\n texts = textTrim((rect.width - 5), textCollection[i], textStyle);\n textSize = measureText(texts, textStyle);\n height += textSize.height;\n maxNumber.push(textSize.width);\n collection.push(texts);\n }\n customText = collection;\n textSize.width = Math.max.apply(null, maxNumber);\n textSize.height = height;\n }\n if (interSectAction === 'WrapByWord' || interSectAction === 'Wrap' || interSectAction === 'Trim') {\n for (var j = 0; j < customText.length; j++) {\n textSize = measureText(customText[j], textStyle);\n height += textSize.height;\n if ((rect.height - padding) > height) {\n tspanText.push(customText[j]);\n }\n }\n if (interSectAction === 'Wrap' && customText.length !== tspanText.length && tspanText.length) {\n var collectionLength = tspanText.length - 1;\n var stringText = tspanText[collectionLength];\n stringText = stringText.substring(0, (stringText.length - 1)) + '...';\n tspanText.splice(collectionLength);\n if (stringText !== '...') {\n tspanText.push(stringText);\n }\n }\n }\n else {\n textName = customText;\n tspanText.push(textName);\n }\n textOptions = new TextOption(groupId + '_Text', textLocation.x, textLocation.y, 'start', tspanText, '', '', connectorText);\n renderTextElement(textOptions, textStyle, textStyle.color || this.getSaturatedColor(fill), parentElement);\n };\n LayoutPanel.prototype.getItemColor = function (isLeafItem, item) {\n var treemap = this.treemap;\n var itemFill = isLeafItem ? treemap.leafItemSettings.fill : treemap.levels[item['groupIndex']].fill;\n var itemOpacity = isLeafItem ? treemap.leafItemSettings.opacity : treemap.levels[item['groupIndex']].opacity;\n if (!isNullOrUndefined(this.treemap.defaultLevelData)) {\n if (this.treemap.defaultLevelData.length > 0) {\n treemap.levelsOfData = this.treemap.defaultLevelData;\n }\n }\n var parentData = findChildren(treemap.levelsOfData[0])['values'];\n var colorMapping = isLeafItem ? treemap.leafItemSettings.colorMapping :\n treemap.levels[item['groupIndex']].colorMapping;\n if (colorMapping.length > 0) {\n var option = colorMap(colorMapping, item['data'][this.treemap.equalColorValuePath], item['data'][this.treemap.rangeColorValuePath], item['data'][this.treemap.weightValuePath]);\n itemFill = !isNullOrUndefined(option['fill']) ? option['fill'] : treemap.leafItemSettings.fill;\n itemOpacity = option['opacity'];\n }\n else {\n for (var i = 0; i < parentData.length; i++) {\n if (parentData[i]['levelOrderName'] === item['levelOrderName'].split('_')[0]) {\n itemFill = treemap.palette.length > 0 ? treemap.palette[i % treemap.palette.length] :\n !isNullOrUndefined(treemap.colorValuePath) ?\n parentData[i]['data'][treemap.colorValuePath] : itemFill;\n }\n }\n }\n return { fill: itemFill, opacity: itemOpacity };\n };\n /**\n * To find saturated color for datalabel\n */\n LayoutPanel.prototype.getSaturatedColor = function (color) {\n var saturatedColor = color;\n saturatedColor = (saturatedColor === 'transparent') ? window.getComputedStyle(document.body, null).backgroundColor : saturatedColor;\n var rgbValue = convertHexToColor(colorNameToHex(saturatedColor));\n var contrast = Math.round((rgbValue.r * 299 + rgbValue.g * 587 + rgbValue.b * 114) / 1000);\n return contrast >= 128 ? 'black' : 'white';\n };\n LayoutPanel.prototype.renderTemplate = function (secondaryEle, groupId, rect, position, template, item) {\n var templateElement;\n var labelEle;\n var templateSize;\n var templateFn;\n var templateLocation;\n if (isNullOrUndefined(template['prototype'])) {\n var keys = Object.keys(item['data']);\n for (var i = 0; i < keys.length; i++) {\n template = template.replace(new RegExp('{{:' + keys[i] + '}}', 'g'), item['data'][keys[i].toString()]);\n }\n }\n templateFn = getTemplateFunction(template);\n templateElement = templateFn(item['data'], this.treemap);\n labelEle = convertElement(templateElement, groupId + '_Template', item['data']);\n templateSize = measureElement(labelEle, secondaryEle);\n templateLocation = findLabelLocation(rect, position, templateSize, 'Template', this.treemap);\n labelEle.style.left = templateLocation.x + 'px';\n labelEle.style.top = templateLocation.y + 'px';\n return labelEle;\n };\n LayoutPanel.prototype.labelInterSectAction = function (rect, text, textStyle, alignment) {\n var textValue;\n var maxWidth = rect.width - 10;\n switch (alignment) {\n case 'Hide':\n textValue = [hide(maxWidth, rect.height, text, textStyle)];\n break;\n case 'Trim':\n textValue = [textTrim((maxWidth + 3), text, textStyle)];\n break;\n case 'WrapByWord':\n textValue = wordWrap(maxWidth, text, textStyle);\n break;\n case 'Wrap':\n textValue = textWrap(maxWidth, text, textStyle);\n break;\n }\n return textValue;\n };\n return LayoutPanel;\n}());\nexport { LayoutPanel };\n","import { print as printWindow, createElement, isNullOrUndefined, Browser } from '@syncfusion/ej2-base';\nimport { getElement } from '../utils/helper';\nimport { beforePrint } from '../model/constants';\nimport { PdfPageOrientation, PdfDocument, PdfBitmap } from '@syncfusion/ej2-pdf-export';\n/**\n * Annotation Module handles the Annotation for Maps\n */\nvar ExportUtils = /** @class */ (function () {\n /**\n * Constructor for Maps\n * @param control\n */\n function ExportUtils(control) {\n this.control = control;\n }\n /**\n * To print the Maps\n * @param elements\n */\n ExportUtils.prototype.print = function (elements) {\n this.printWindow = window.open('', 'print', 'height=' + window.outerHeight + ',width=' + window.outerWidth + ',tabbar=no');\n this.printWindow.moveTo(0, 0);\n this.printWindow.resizeTo(screen.availWidth, screen.availHeight);\n var argsData = {\n cancel: false, htmlContent: this.getHTMLContent(elements), name: beforePrint\n };\n this.control.trigger(beforePrint, argsData);\n if (!argsData.cancel) {\n printWindow(argsData.htmlContent, this.printWindow);\n }\n };\n /**\n * To get the html string of the Maps\n * @param elements\n * @private\n */\n ExportUtils.prototype.getHTMLContent = function (elements) {\n var div = createElement('div');\n if (elements) {\n if (elements instanceof Array) {\n elements.forEach(function (value) {\n div.appendChild(getElement(value).cloneNode(true));\n });\n }\n else if (elements instanceof Element) {\n div.appendChild(elements.cloneNode(true));\n }\n else {\n div.appendChild(getElement(elements).cloneNode(true));\n }\n }\n else {\n div.appendChild(this.control.element.cloneNode(true));\n }\n return div;\n };\n /**\n * To export the file as image/svg format\n * @param type\n * @param fileName\n */\n ExportUtils.prototype.export = function (type, fileName, orientation) {\n var _this = this;\n var element = createElement('canvas', {\n id: 'ej2-canvas',\n attrs: {\n 'width': this.control.availableSize.width.toString(),\n 'height': this.control.availableSize.height.toString()\n }\n });\n var isDownload = !(Browser.userAgent.toString().indexOf('HeadlessChrome') > -1);\n orientation = isNullOrUndefined(orientation) ? PdfPageOrientation.Landscape : orientation;\n var svgData = '';\n var url = window.URL.createObjectURL(new Blob(type === 'SVG' ? [svgData] :\n [(new XMLSerializer()).serializeToString(this.control.svgObject)], { type: 'image/svg+xml' }));\n if (type === 'SVG') {\n this.triggerDownload(fileName, type, url, isDownload);\n }\n else {\n var image_1 = new Image();\n var ctx_1 = element.getContext('2d');\n image_1.onload = (function () {\n ctx_1.drawImage(image_1, 0, 0);\n window.URL.revokeObjectURL(url);\n if (type === 'PDF') {\n var document_1 = new PdfDocument();\n var imageString = element.toDataURL('image/jpeg').replace('image/jpeg', 'image/octet-stream');\n document_1.pageSettings.orientation = orientation;\n imageString = imageString.slice(imageString.indexOf(',') + 1);\n document_1.pages.add().graphics.drawImage(new PdfBitmap(imageString), 0, 0, (_this.control.availableSize.width - 60), _this.control.availableSize.height);\n if (isDownload) {\n document_1.save(fileName + '.pdf');\n document_1.destroy();\n }\n }\n else {\n _this.triggerDownload(fileName, type, element.toDataURL('image/png').replace('image/png', 'image/octet-stream'), isDownload);\n }\n });\n image_1.src = url;\n }\n };\n /**\n * To trigger the download element\n * @param fileName\n * @param type\n * @param url\n */\n ExportUtils.prototype.triggerDownload = function (fileName, type, url, isDownload) {\n createElement('a', {\n attrs: {\n 'download': fileName + '.' + type.toLocaleLowerCase(),\n 'href': url\n }\n }).dispatchEvent(new MouseEvent(isDownload ? 'click' : 'move', {\n view: window,\n bubbles: false,\n cancelable: true\n }));\n };\n return ExportUtils;\n}());\nexport { ExportUtils };\n","/**\n * Tree Map Component\n */\nvar __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n }\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, NotifyPropertyChanges, Property, extend, Ajax } from '@syncfusion/ej2-base';\nimport { Complex, Collection } from '@syncfusion/ej2-base';\nimport { Event, Internationalization } from '@syncfusion/ej2-base';\nimport { SvgRenderer } from '@syncfusion/ej2-svg-base';\nimport { isNullOrUndefined, createElement, EventHandler, Browser, remove } from '@syncfusion/ej2-base';\nimport { Border, Margin, TitleSettings, LegendSettings, InitialDrillSettings } from './model/base';\nimport { SelectionSettings, TooltipSettings, LevelSettings, LeafItemSettings, HighlightSettings, } from './model/base';\nimport { Size, stringToNumber, RectOption, Rect, textTrim, measureText, findChildren } from '../treemap/utils/helper';\nimport { removeClassNames, removeShape } from '../treemap/utils/helper';\nimport { findPosition, TextOption, renderTextElement, isContainsData, TreeMapAjax } from '../treemap/utils/helper';\nimport { load, loaded, drillStart, drillEnd } from '../treemap/model/constants';\nimport { itemClick, itemMove, click, mouseMove, resize, doubleClick, rightClick } from '../treemap/model/constants';\nimport { LayoutPanel } from './layout/render-panel';\nimport { ExportUtils } from '../treemap/utils/export';\nimport { DataManager, Query } from '@syncfusion/ej2-data';\nimport { getThemeStyle } from './model/theme';\n/**\n * Represents the TreeMap control.\n * ```html\n *
\n * \n * ```\n */\nvar TreeMap = /** @class */ (function (_super) {\n __extends(TreeMap, _super);\n /**s\n * Constructor for TreeMap component.\n */\n function TreeMap(options, element) {\n var _this = _super.call(this, options, element) || this;\n /** @private */\n _this.orientation = 'Horizontal';\n /** @private */\n _this.drilledItems = [];\n /** @private */\n _this.defaultLevelData = [];\n /** @private */\n _this.isHierarchicalData = false;\n return _this;\n }\n TreeMap.prototype.preRender = function () {\n this.trigger(load, { treemap: this });\n this.initPrivateVariable();\n this.unWireEVents();\n this.createSvg();\n this.wireEVents();\n this.setCulture();\n };\n TreeMap.prototype.render = function () {\n this.createSecondaryElement();\n this.addTabIndex();\n this.themeStyle = getThemeStyle(this.theme);\n this.renderBorder();\n this.renderTitle(this.titleSettings, 'title', null, null);\n if (!isNullOrUndefined(this.levelsOfData)) {\n this.defaultLevelData = this.levelsOfData;\n }\n this.processDataManager();\n };\n /* tslint:disable:no-string-literal */\n /* tslint:disable:no-eval */\n TreeMap.prototype.processDataManager = function () {\n var _this = this;\n var dataModule;\n var queryModule;\n var ajaxModule;\n var localAjax;\n if (this.dataSource instanceof DataManager) {\n dataModule = this.dataSource;\n queryModule = this.query instanceof Query ? this.query : new Query();\n var dataManager = dataModule.executeQuery(queryModule);\n dataManager.then(function (e) {\n _this.dataSource = e['result'];\n _this.renderTreeMapElements();\n });\n }\n else if (this.dataSource instanceof TreeMapAjax) {\n localAjax = this.dataSource;\n ajaxModule = new Ajax(localAjax.dataOptions, localAjax.type, localAjax.async, localAjax.contentType);\n ajaxModule.onSuccess = function (args) {\n _this.dataSource = JSON.parse('[' + args + ']')[0];\n _this.renderTreeMapElements();\n };\n ajaxModule.send(localAjax.sendData);\n }\n else {\n this.renderTreeMapElements();\n }\n };\n TreeMap.prototype.renderTreeMapElements = function () {\n this.processingData();\n if (this.treeMapLegendModule && this.legendSettings.visible) {\n this.treeMapLegendModule.renderLegend();\n }\n this.layout.processLayoutPanel();\n this.element.appendChild(this.svgObject);\n this.elementChange();\n this.trigger(loaded, { treemap: this });\n };\n TreeMap.prototype.createSvg = function () {\n if (this.svgObject) {\n while (this.svgObject.childNodes.length > 0) {\n this.svgObject.removeChild(this.svgObject.firstChild);\n }\n if (!this.svgObject.hasChildNodes() && this.svgObject.parentNode) {\n remove(this.svgObject);\n }\n }\n var containerWidth = this.element.clientWidth;\n var containerHeight = this.element.clientHeight;\n this.availableSize = new Size(stringToNumber(this.width, containerWidth) || containerWidth || 600, stringToNumber(this.height, containerHeight) || containerHeight || 450);\n this.svgObject = this.renderer.createSvg({\n id: this.element.id + '_svg',\n width: this.availableSize.width,\n height: this.availableSize.height\n });\n };\n /**\n * To initilize the private varibales of treemap.\n */\n TreeMap.prototype.initPrivateVariable = function () {\n if (this.element.id === '') {\n var collection = document.getElementsByClassName('e-treemap').length;\n this.element.id = 'treemap_control_' + collection;\n }\n this.renderer = new SvgRenderer(this.element.id);\n this.layout = new LayoutPanel(this);\n };\n TreeMap.prototype.createSecondaryElement = function () {\n var secondaryEle = document.getElementById(this.element.id + '_Secondary_Element');\n if (secondaryEle && secondaryEle.childElementCount > 0) {\n secondaryEle.remove();\n }\n if (isNullOrUndefined(document.getElementById(this.element.id + '_Secondary_Element'))) {\n var secondaryElement = createElement('div', {\n id: this.element.id + '_Secondary_Element',\n styles: 'position: absolute;z-index:1;'\n });\n this.element.appendChild(secondaryElement);\n }\n };\n TreeMap.prototype.elementChange = function () {\n if (this.treeMapLegendModule && this.legendSettings.visible && this.treeMapLegendModule.legendGroup && this.layout.layoutGroup) {\n this.svgObject.insertBefore(this.layout.layoutGroup, this.treeMapLegendModule.legendGroup);\n }\n };\n /**\n * @private\n * Render the treemap border\n */\n TreeMap.prototype.renderBorder = function () {\n var width = this.border.width;\n var borderElement = this.svgObject.querySelector('#' + this.element.id + '_TreeMap_Border');\n if ((this.border.width > 0 || (this.background || this.themeStyle.backgroundColor)) && isNullOrUndefined(borderElement)) {\n var borderRect = new RectOption(this.element.id + '_TreeMap_Border', this.background || this.themeStyle.backgroundColor, this.border, 1, new Rect(width / 2, width / 2, this.availableSize.width - width, this.availableSize.height - width));\n this.svgObject.appendChild(this.renderer.drawRectangle(borderRect));\n }\n else if (borderElement) {\n borderElement.setAttribute('fill', this.background || this.themeStyle.backgroundColor);\n }\n };\n TreeMap.prototype.renderTitle = function (title, type, bounds, groupEle) {\n var style = title.textStyle;\n var height;\n var titlePadding = 10;\n var width = (this.availableSize.width - this.margin.right - this.margin.left);\n title.textStyle.fontFamily = this.themeStyle.fontFamily || title.textStyle.fontFamily;\n title.textStyle.size = this.themeStyle.fontSize || title.textStyle.size;\n if (title.text) {\n if (isNullOrUndefined(groupEle)) {\n groupEle = this.renderer.createGroup({ id: this.element.id + '_Title_Group' });\n }\n var trimmedTitle = textTrim(width, title.text, style);\n var elementSize = measureText(trimmedTitle, style);\n var rect = (isNullOrUndefined(bounds)) ? new Rect(this.margin.left, this.margin.top, this.availableSize.width, this.availableSize.height) : bounds;\n var location_1 = findPosition(rect, title.alignment, elementSize, type);\n var options = new TextOption(this.element.id + '_TreeMap_' + type, location_1.x, location_1.y, 'start', trimmedTitle);\n var titleBounds = new Rect(location_1.x, location_1.y, elementSize.width, elementSize.height);\n var element = renderTextElement(options, style, style.color || (type === 'title' ? this.themeStyle.titleFontColor : this.themeStyle.subTitleFontColor), groupEle);\n element.setAttribute('aria-label', title.description || title.text);\n element.setAttribute('tabindex', (this.tabIndex + (type === 'title' ? 1 : 2)).toString());\n if ((type === 'title' && !title.subtitleSettings.text) || (type === 'subtitle')) {\n height = (this.availableSize.height - titleBounds.y - titlePadding - this.margin.bottom);\n this.areaRect = new Rect(this.margin.left, titleBounds.y + titlePadding, width, height);\n }\n if (type !== 'subtitle' && title.subtitleSettings.text) {\n this.renderTitle(title.subtitleSettings, 'subtitle', titleBounds, groupEle);\n }\n else {\n this.svgObject.appendChild(groupEle);\n }\n }\n else {\n height = (this.availableSize.height - this.margin.top - this.margin.bottom);\n this.areaRect = new Rect(this.margin.left, this.margin.top, width, height);\n }\n };\n TreeMap.prototype.processingData = function () {\n var _this = this;\n var path;\n this.dataSource = this.dataSource;\n if (!isNullOrUndefined(this.dataSource) && this.dataSource.length > 0 && this.weightValuePath) {\n this.levelsOfData = [];\n this.dataSource.map(function (data) {\n data[_this.weightValuePath] = (data[_this.weightValuePath]) ? data[_this.weightValuePath].toString() :\n data[_this.weightValuePath];\n });\n this.leafItemSettings.labelPath = this.leafItemSettings.labelPath || this.weightValuePath;\n this.checkIsHierarchicalData();\n if (this.levels.length === 0) {\n var data_1 = new Object();\n data_1['level'] = 0;\n path = this.leafItemSettings.labelPath;\n data_1[path] = [];\n for (var i = 0; i < this.dataSource.length; i++) {\n var child = findChildren(this.dataSource[i])['values'];\n if (this.isHierarchicalData && child && child.length > 0) {\n child.forEach(function (currentData, dataIndex) {\n if (currentData[path]) {\n data_1[path].push({\n groupIndex: 0, name: currentData[path], levelOrderName: currentData[path].toString(),\n data: currentData, weight: currentData[_this.weightValuePath]\n });\n }\n });\n }\n else {\n if (this.dataSource[i][path]) {\n data_1[path].push({\n groupIndex: 0, name: this.dataSource[i][path], levelOrderName: this.dataSource[i][path].toString(), data: this.dataSource[i],\n weight: this.dataSource[i][this.weightValuePath]\n });\n }\n }\n }\n this.levelsOfData.push(data_1);\n }\n else {\n if (this.isHierarchicalData) {\n this.hierarchyData = [];\n this.hierarchyData = extend([], this.dataSource, this.hierarchyData, true);\n for (var i = 0; i < this.hierarchyData.length; i++) {\n this.processHierarchicalData(this.hierarchyData[i], i);\n }\n this.levelsOfData = this.hierarchyData;\n }\n else {\n this.processFlatJsonData();\n if (this.levelsOfData.length > 1) {\n this.reOrderLevelData(this.levelsOfData.length - 1);\n }\n }\n path = this.levels[0].groupPath;\n }\n if (!this.isHierarchicalData) {\n this.findTotalWeight(this.levelsOfData[0][path], 'Parent');\n }\n }\n };\n TreeMap.prototype.checkIsHierarchicalData = function () {\n var child;\n this.dataSource = this.dataSource;\n for (var i = 0; i < this.dataSource.length; i++) {\n child = findChildren(this.dataSource[i])['values'];\n if (child && child.length) {\n this.isHierarchicalData = true;\n break;\n }\n else if (i === this.dataSource.length - 1) {\n this.isHierarchicalData = false;\n }\n }\n };\n TreeMap.prototype.processHierarchicalData = function (data, dataCount) {\n var _this = this;\n var childData;\n var levelData = [];\n var newData = new Object();\n var levelIndex;\n var path = this.leafItemSettings.labelPath ? this.leafItemSettings.labelPath : this.weightValuePath;\n var currentData = new Object();\n var level;\n var key;\n newData = findChildren(data);\n childData = newData ? newData['values'] : null;\n if (childData && childData.length > 0) {\n key = newData['key'];\n for (var i = 0; i < this.levels.length; i++) {\n if (key === this.levels[i].groupPath) {\n level = this.levels[i];\n levelIndex = i;\n }\n }\n for (var j = 0; j < childData.length; j++) {\n childData[j]['name'] = childData[j][path];\n childData[j]['levelOrderName'] = (levelIndex === 0 ? childData[j]['name'] :\n data['levelOrderName'] + '_' + childData[j]['name']) + '';\n var childItemLevel = childData[j]['levelOrderName'];\n var childLevel = void 0;\n if (childItemLevel.search('_') > 0) {\n childLevel = childItemLevel.split('_').length - 1;\n }\n childData[j]['groupIndex'] = isNullOrUndefined(levelIndex) ? childLevel === this.levels.length\n ? this.levels.length : childLevel : levelIndex;\n if (levelIndex !== 0) {\n childData[j]['parent'] = data;\n }\n childData[j]['groupName'] = key;\n childData[j]['data'] = childData[j];\n childData[j]['isDrilled'] = false;\n childData[j]['weight'] = childData[j][this.weightValuePath];\n }\n childData.forEach(function (currentData) {\n _this.processHierarchicalData(currentData, dataCount);\n });\n }\n if (dataCount === this.hierarchyData.length - 1) {\n var mainData_1 = this.hierarchyData[0][this.levels[0].groupPath];\n for (var k = 0; k < this.hierarchyData.length; k++) {\n childData = findChildren(this.hierarchyData[k])['values'];\n if (k !== 0 && childData) {\n childData.forEach(function (currentData) { mainData_1.push(currentData); });\n this.hierarchyData.splice(k, 1);\n k -= 1;\n }\n }\n mainData_1 = this.hierarchyData[0][this.levels[0].groupPath];\n for (var l = 0; l < mainData_1.length; l++) {\n newData[this.levels[0].groupPath] = mainData_1;\n mainData_1[l]['parent'] = newData;\n }\n }\n };\n /**\n * Handles the print method for chart control.\n */\n TreeMap.prototype.print = function (id) {\n var exportChart = new ExportUtils(this);\n exportChart.print(id);\n };\n /**\n * Handles the export method for chart control.\n * @param type\n * @param fileName\n */\n TreeMap.prototype.export = function (type, fileName, orientation) {\n var exportMap = new ExportUtils(this);\n exportMap.export(type, fileName, orientation);\n };\n /* tslint:disable:no-string-literal */\n TreeMap.prototype.processFlatJsonData = function () {\n this.dataSource = this.dataSource;\n var groupPath;\n var childGroupPath;\n var orderNames = [];\n var process = false;\n for (var i = 0; i < this.levels.length + 1; i++) {\n groupPath = this.levels[i] ? this.levels[i].groupPath : this.leafItemSettings.labelPath;\n var level = new Object();\n level['level'] = i;\n level[groupPath] = [];\n this.levelsOfData.push(level);\n for (var j = 0; j < this.dataSource.length; j++) {\n var currentData = {};\n var childName = '';\n if (this.dataSource[j][groupPath]) {\n var name_1 = this.dataSource[j][groupPath];\n if (i !== 0) {\n for (var k = 0; k <= i; k++) {\n var childGroupPath_1 = this.levels[k] ? this.levels[k].groupPath : groupPath;\n childName += (this.dataSource[j][childGroupPath_1]) + ((k === i) ? '' : '_');\n }\n }\n if (!(orderNames.length > 0 ? orderNames.indexOf(childName ?\n childName : name_1) !== -1 : false)) {\n currentData['name'] = name_1;\n currentData['levelOrderName'] = ((childName) ? childName : name_1) + '';\n currentData['groupIndex'] = i;\n currentData['isDrilled'] = false;\n currentData['groupName'] = groupPath;\n currentData['data'] = this.dataSource[j];\n this.levelsOfData[this.levelsOfData.length - 1][groupPath].push(currentData);\n orderNames.push((childName) ? childName : name_1);\n }\n }\n }\n }\n };\n TreeMap.prototype.reOrderLevelData = function (start) {\n var currentName;\n var currentPath = this.levels[start] ? this.levels[start].groupPath : this.leafItemSettings.labelPath;\n var prevPath = this.levels[start - 1].groupPath;\n var currentData = this.levelsOfData[start][currentPath];\n var previousData = this.levelsOfData[start - 1][prevPath];\n for (var i = 0; i < currentData.length; i++) {\n currentName = currentData[i]['levelOrderName'];\n for (var j = 0; j < previousData.length; j++) {\n previousData[j][currentPath] = isNullOrUndefined(previousData[j][currentPath]) ? [] : previousData[j][currentPath];\n if (currentName.indexOf(previousData[j]['levelOrderName']) !== -1) {\n if (isNullOrUndefined(currentData[i]['parent'])) {\n currentData[i]['parent'] = previousData[j];\n }\n previousData[j][currentPath].push(currentData[i]);\n break;\n }\n }\n }\n this.findTotalWeight(this.levelsOfData[this.levelsOfData.length - 1][currentPath], 'Child');\n this.levelsOfData.splice(start, 1);\n if ((start - 1) > 0) {\n this.reOrderLevelData(start - 1);\n }\n };\n TreeMap.prototype.findTotalWeight = function (processData, type) {\n var _this = this;\n var totalWeight;\n var childData;\n var levelName;\n var start = 0;\n var split;\n var groupName;\n var groupObj = new Object();\n var _loop_1 = function (i) {\n totalWeight = 0;\n groupName = processData[i]['groupName'];\n split = processData[i]['levelOrderName'].split('_');\n this_1.dataSource.forEach(function (data) {\n if (isContainsData(split, processData[i]['levelOrderName'], data, _this)) {\n totalWeight += parseFloat(data[_this.weightValuePath]);\n }\n });\n if (type === 'Parent') {\n groupObj[groupName] = processData;\n processData[i]['parent'] = groupObj;\n }\n processData[i]['weight'] = totalWeight;\n };\n var this_1 = this;\n for (var i = 0; i < processData.length; i++) {\n _loop_1(i);\n }\n };\n /**\n * To unbind event handlers for treemap.\n */\n TreeMap.prototype.unWireEVents = function () {\n EventHandler.remove(this.element, 'click', this.clickOnTreeMap);\n EventHandler.remove(this.element, 'dblclick', this.doubleClickOnTreeMap);\n EventHandler.remove(this.element, 'contextmenu', this.rightClickOnTreeMap);\n EventHandler.remove(this.element, Browser.touchStartEvent, this.mouseDownOnTreeMap);\n EventHandler.remove(this.element, Browser.touchMoveEvent, this.mouseMoveOnTreeMap);\n EventHandler.remove(this.element, Browser.touchEndEvent, this.mouseEndOnTreeMap);\n EventHandler.remove(this.element, 'pointerleave mouseleave', this.mouseLeaveOnTreeMap);\n window.removeEventListener('resize', this.resizeOnTreeMap);\n };\n /**\n * To bind event handlers for treemap.\n */\n TreeMap.prototype.wireEVents = function () {\n EventHandler.add(this.element, 'click', this.clickOnTreeMap, this);\n EventHandler.add(this.element, 'dblclick', this.doubleClickOnTreeMap, this);\n EventHandler.add(this.element, 'contextmenu', this.rightClickOnTreeMap, this);\n EventHandler.add(this.element, Browser.touchStartEvent, this.mouseDownOnTreeMap, this);\n EventHandler.add(this.element, Browser.touchMoveEvent, this.mouseMoveOnTreeMap, this);\n EventHandler.add(this.element, Browser.touchEndEvent, this.mouseEndOnTreeMap, this);\n EventHandler.add(this.element, 'pointerleave mouseleave', this.mouseLeaveOnTreeMap, this);\n window.addEventListener('resize', this.resizeOnTreeMap.bind(this));\n };\n /**\n * Method to set culture for maps\n */\n TreeMap.prototype.setCulture = function () {\n this.intl = new Internationalization();\n };\n /**\n * To add tab index for treemap element\n */\n TreeMap.prototype.addTabIndex = function () {\n this.element.setAttribute('aria-label', this.description || 'TreeMap Element');\n this.element.setAttribute('tabindex', this.tabIndex.toString());\n };\n /**\n * To handle the window resize event on treemap.\n */\n TreeMap.prototype.resizeOnTreeMap = function (e) {\n var _this = this;\n var args = {\n name: resize,\n cancel: false,\n previousSize: this.availableSize,\n currentSize: new Size(0, 0),\n treemap: this\n };\n if (this.resizeTo) {\n clearTimeout(this.resizeTo);\n }\n if (this.element.classList.contains('e-treemap')) {\n this.resizeTo = setTimeout(function () {\n _this.unWireEVents();\n _this.createSvg();\n _this.refreshing = true;\n _this.wireEVents();\n args.currentSize = _this.availableSize;\n _this.trigger(resize, args);\n _this.render();\n }, 500);\n }\n };\n TreeMap.prototype.clickOnTreeMap = function (e) {\n var targetEle = e.target;\n var targetId = targetEle.id;\n var eventArgs;\n var itemIndex;\n var clickArgs = { cancel: false, name: click, treemap: this, mouseEvent: e };\n this.trigger(click, clickArgs);\n if (targetId.indexOf('_Item_Index') > -1) {\n e.preventDefault();\n itemIndex = parseFloat(targetId.split('_')[6]);\n eventArgs = {\n cancel: false, name: itemClick, treemap: this, item: this.layout.renderItems[itemIndex], mouseEvent: e,\n groupIndex: this.layout.renderItems[itemIndex]['groupIndex'], groupName: this.layout.renderItems[itemIndex]['name']\n };\n this.trigger(itemClick, eventArgs);\n }\n var end = new Date().getMilliseconds();\n var doubleTapTimer1;\n if (!isNullOrUndefined(this.doubleClick)) {\n if (!isNullOrUndefined(doubleTapTimer1) && end - doubleTapTimer1 < 500) {\n this.doubleClickOnTreeMap(e);\n }\n doubleTapTimer1 = end;\n }\n };\n TreeMap.prototype.doubleClickOnTreeMap = function (e) {\n var doubleClickArgs = { cancel: false, name: doubleClick, treemap: this, mouseEvent: e };\n this.trigger(doubleClick, doubleClickArgs);\n //this.notify('dblclick', e);\n };\n TreeMap.prototype.rightClickOnTreeMap = function (e) {\n var rightClickArgs = { cancel: false, name: rightClick, treemap: this, mouseEvent: e };\n this.trigger(rightClick, rightClickArgs);\n };\n /* tslint:disable-next-line:max-func-body-length */\n TreeMap.prototype.mouseDownOnTreeMap = function (e) {\n if (e.target.id.indexOf('_Item_Index') > -1) {\n this.mouseDown = true;\n }\n this.notify(Browser.touchStartEvent, e);\n };\n TreeMap.prototype.mouseMoveOnTreeMap = function (e) {\n var targetEle = e.target;\n var targetId = targetEle.id;\n var eventArgs;\n var item;\n var moveArgs = { cancel: false, name: mouseMove, treemap: this, mouseEvent: e };\n this.trigger(mouseMove, moveArgs);\n var childItems;\n this.drillMouseMove = this.mouseDown;\n if (targetId.indexOf('_Item_Index') > -1) {\n item = this.layout.renderItems[parseFloat(targetId.split('_')[6])];\n childItems = findChildren(item)['values'];\n this.element.style.cursor = (!item['isLeafItem'] && childItems && childItems.length > 0 && this.enableDrillDown) ?\n 'pointer' : 'auto';\n eventArgs = { cancel: false, name: itemMove, treemap: this, item: item, mouseEvent: e };\n this.trigger(itemMove, eventArgs);\n }\n this.notify(Browser.touchMoveEvent, e);\n };\n TreeMap.prototype.calculateSelectedTextLevels = function (labelText, item) {\n //to find the levels by clicking the particular text both for drillDownView as true / false.\n var drillLevel;\n var k;\n var text;\n var levelLabels = item['levelOrderName'];\n var levelText = levelLabels.split('_');\n for (var _i = 0, _a = Object.keys(levelText); _i < _a.length; _i++) {\n k = _a[_i];\n if (levelText[k] === labelText) {\n drillLevel = parseInt(k, 10);\n text = labelText;\n }\n }\n return { drillLevel: drillLevel, currentLevelLabel: text, levelText: levelText };\n };\n TreeMap.prototype.calculatePreviousLevelChildItems = function (labelText, drillLevelValues, item, directLevel) {\n //By clicking any child items drilldown to the particular level.\n //At the time store all the previous drilled level items in drilledItems\n // This condition satisfies while drilldown View is set as false and the text contains '[+]'\n var text;\n var p = 0;\n var levelItems;\n var text1;\n var drillTextLevel = this.layout.renderItems[0]['levelOrderName'].split('_').length;\n for (var h = 0; h < drillTextLevel; h++) {\n text1 = h === 0 ? drillLevelValues['levelText'][h] : text1 + '_' + drillLevelValues['levelText'][h];\n }\n p = drillTextLevel > 1 ? drillTextLevel : p;\n for (var _i = 0, _a = Object['values'](this.layout.renderItems); _i < _a.length; _i++) {\n levelItems = _a[_i];\n var drillLevelText = levelItems['levelOrderName'].split('_');\n if (drillLevelText[0] === drillLevelValues['levelText'][0]) {\n text = p === 0 ? isNullOrUndefined(text1) ? text1 : drillLevelValues['levelText'][p] :\n directLevel ? text1 : text1 + '_' + drillLevelValues['levelText'][p];\n if (text === levelItems['levelOrderName']) {\n this.drilledItems.push({ name: levelItems['levelOrderName'], data: levelItems });\n p++;\n directLevel = true;\n if (p <= item['groupIndex']) {\n text = text + '_' + drillLevelValues['levelText'][p];\n text1 = text;\n }\n }\n }\n }\n return directLevel;\n };\n TreeMap.prototype.compareSelectedLabelWithDrillDownItems = function (drillLevelValues, item, i) {\n var drillLevelChild;\n var newDrillItem = new Object();\n var b = drillLevelValues['drillLevel'] + 1;\n if (b === this.drilledItems[i]['data']['groupIndex']) {\n drillLevelChild = this.drilledItems[i]['data']['parent'];\n drillLevelChild['isDrilled'] = true;\n newDrillItem[drillLevelChild[this.drilledItems[i]['data']['groupName']]]\n = [drillLevelChild];\n // to remove all the items after matched drilled items\n this.drilledItems.splice(i, this.drilledItems.length);\n }\n else if (drillLevelValues['drillLevel'] === (this.drilledItems.length - 1)\n || drillLevelValues['drillLevel'] === item['groupIndex']) {\n newDrillItem[item['groupName']] = [item];\n }\n return newDrillItem;\n };\n /* tslint:disable-next-line:max-func-body-length */\n TreeMap.prototype.mouseEndOnTreeMap = function (e) {\n var targetEle = e.target;\n var targetId = targetEle.id;\n var totalRect;\n var startEvent;\n var endEvent;\n var directLevel = false;\n var index;\n var newDrillItem = new Object();\n var item;\n var process = true;\n var layoutID = this.element.id + '_TreeMap_' + this.layoutType + '_Layout';\n var drillLevel;\n var templateID = this.element.id + '_Label_Template_Group';\n var drillLevelValues;\n if (targetId.indexOf('_Item_Index') > -1 && this.enableDrillDown && !this.drillMouseMove) {\n e.preventDefault();\n index = parseFloat(targetId.split('_')[6]);\n item = this.layout.renderItems[index];\n var labelText = targetEle.innerHTML;\n if (this.enableBreadcrumb) {\n drillLevelValues = this.calculateSelectedTextLevels(labelText, item);\n drillLevel = drillLevelValues['drillLevel'];\n if (!this.drillDownView && labelText.search('[+]') !== -1) {\n directLevel = this.calculatePreviousLevelChildItems(labelText, drillLevelValues, item, directLevel);\n }\n }\n if (this.levels.length !== 0 && !item['isLeafItem'] && findChildren(item)['values'] &&\n findChildren(item)['values'].length > 0) {\n if (this.drilledItems.length > 0) {\n item = directLevel ? this.drilledItems[this.drilledItems.length - 1]['data'] : item;\n for (var i = 0; i < this.drilledItems.length; i++) {\n if (!isNullOrUndefined(drillLevel)) { //Compare the selected text level with drilled items\n var drillLength = this.drilledItems.length;\n newDrillItem = this.compareSelectedLabelWithDrillDownItems(drillLevelValues, item, i);\n if (drillLength !== this.drilledItems.length) {\n i -= 1;\n break;\n }\n } //when clicking the levels drill back to the previous level process takes place\n if (item['levelOrderName'] === this.drilledItems[i]['name'] && !directLevel && isNullOrUndefined(drillLevel)) {\n if (item['groupIndex'] === 0 && item['parent'][item['groupName']] instanceof Array) {\n item['isDrilled'] = !(item['isDrilled']);\n if (!item['isDrilled']) {\n newDrillItem = item['parent'];\n }\n else {\n newDrillItem[item['groupName']] = [item];\n }\n }\n else {\n item['isDrilled'] = false;\n item['parent']['isDrilled'] = true;\n item = item['parent'];\n newDrillItem[item['groupName']] = [item];\n }\n this.drilledItems.splice(i, 1);\n i -= 1;\n break;\n }\n else if (i === this.drilledItems.length - 1 && isNullOrUndefined(drillLevel)) {\n item['isDrilled'] = true; // click the items move to next level.\n newDrillItem[item['groupName']] = [item];\n }\n }\n }\n else {\n item['isDrilled'] = true;\n newDrillItem[item['groupName']] = [item];\n }\n startEvent = {\n cancel: false, name: drillStart, treemap: this, item: newDrillItem, element: targetEle,\n groupIndex: this.enableBreadcrumb && this.drilledItems.length !== 0 && !isNullOrUndefined(drillLevel) ?\n this.drilledItems[this.drilledItems.length - 1]['data']['groupIndex'] : item['groupIndex'],\n groupName: this.enableBreadcrumb && this.drilledItems.length !== 0 && !isNullOrUndefined(drillLevel) ?\n this.drilledItems[this.drilledItems.length - 1]['data']['name'] : item['name'],\n rightClick: e.which === 3 ? true : false, childItems: null\n };\n this.trigger(drillStart, startEvent);\n this.currentLevel = item['isDrilled'] && isNullOrUndefined(drillLevel) ? item['groupIndex'] :\n (!isNullOrUndefined(drillLevel) && this.enableBreadcrumb && item['isDrilled']) ? drillLevel : null;\n if (!startEvent.cancel) {\n if (document.getElementById(layoutID)) {\n document.getElementById(layoutID).remove();\n }\n totalRect = extend({}, this.areaRect, totalRect, true);\n if (this.legendSettings.visible && !isNullOrUndefined(this.treeMapLegendModule)) {\n if (!isNullOrUndefined(newDrillItem)) {\n this.treeMapLegendModule.legendGroup.textContent = '';\n this.treeMapLegendModule.legendGroup = null;\n this.treeMapLegendModule.widthIncrement = 0;\n this.treeMapLegendModule.heightIncrement = 0;\n if (this.enableBreadcrumb && !isNullOrUndefined(drillLevel)) {\n this.drilledLegendItems = {\n name: this.drilledItems[this.drilledItems.length - 1]['data']['levelOrderName'],\n data: this.drilledItems[this.drilledItems.length - 1]['data']\n };\n }\n else {\n this.drilledLegendItems = { name: item['levelOrderName'], data: item };\n }\n this.treeMapLegendModule.renderLegend();\n }\n totalRect = !isNullOrUndefined(this.totalRect) ? this.totalRect : totalRect;\n }\n if (document.getElementById(templateID)) {\n document.getElementById(templateID).remove();\n }\n if (!isNullOrUndefined(startEvent.childItems) && !startEvent.cancel) {\n this.layout.onDemandProcess(startEvent.childItems);\n }\n else {\n this.layout.calculateLayoutItems(newDrillItem, totalRect);\n this.layout.renderLayoutItems(newDrillItem);\n }\n }\n endEvent = { cancel: false, name: drillEnd, treemap: this, renderItems: this.layout.renderItems };\n this.trigger(drillEnd, endEvent);\n if (process) {\n if (!directLevel && isNullOrUndefined(drillLevel)) {\n this.drilledItems.push({ name: item['levelOrderName'], data: item });\n }\n }\n }\n }\n this.mouseDown = false;\n this.notify(Browser.touchEndEvent, e);\n };\n TreeMap.prototype.mouseLeaveOnTreeMap = function (e) {\n if (this.treeMapTooltipModule) {\n this.treeMapTooltipModule.removeTooltip();\n }\n if (this.treeMapLegendModule) {\n this.treeMapLegendModule.removeInteractivePointer();\n }\n removeClassNames(document.getElementsByClassName('treeMapHighLight'), 'treeMapHighLight', this);\n if (this.treeMapHighlightModule) {\n removeShape(this.treeMapHighlightModule.shapeHighlightCollection, 'highlight');\n this.treeMapHighlightModule.highLightId = '';\n }\n };\n /**\n * To provide the array of modules needed for maps rendering\n * @return {ModuleDeclaration[]}\n * @private\n */\n TreeMap.prototype.requiredModules = function () {\n var modules = [];\n if (this.tooltipSettings.visible) {\n modules.push({\n member: 'treeMapTooltip',\n args: [this]\n });\n }\n if (this.highlightSettings.enable) {\n modules.push({\n member: 'treeMapHighlight',\n args: [this]\n });\n }\n if (this.selectionSettings.enable) {\n modules.push({\n member: 'treeMapSelection',\n args: [this]\n });\n }\n if (this.legendSettings.visible) {\n modules.push({\n member: 'treeMapLegend',\n args: [this]\n });\n }\n return modules;\n };\n TreeMap.prototype.onPropertyChanged = function (newProp, oldProp) {\n var render = false;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'background':\n this.renderBorder();\n break;\n case 'height':\n case 'width':\n render = true;\n break;\n }\n }\n if (render) {\n this.createSvg();\n this.render();\n }\n };\n /**\n * Get component name\n */\n TreeMap.prototype.getModuleName = function () {\n return 'treemap';\n };\n /**\n * To destroy the treemap control.\n */\n TreeMap.prototype.destroy = function () {\n this.unWireEVents();\n _super.prototype.destroy.call(this);\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @private\n */\n TreeMap.prototype.getPersistData = function () {\n return '';\n };\n __decorate([\n Property(null)\n ], TreeMap.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], TreeMap.prototype, \"height\", void 0);\n __decorate([\n Complex({}, Border)\n ], TreeMap.prototype, \"border\", void 0);\n __decorate([\n Complex({}, Margin)\n ], TreeMap.prototype, \"margin\", void 0);\n __decorate([\n Property(null)\n ], TreeMap.prototype, \"background\", void 0);\n __decorate([\n Property('Material')\n ], TreeMap.prototype, \"theme\", void 0);\n __decorate([\n Complex({}, TitleSettings)\n ], TreeMap.prototype, \"titleSettings\", void 0);\n __decorate([\n Property('Squarified')\n ], TreeMap.prototype, \"layoutType\", void 0);\n __decorate([\n Property(null)\n ], TreeMap.prototype, \"dataSource\", void 0);\n __decorate([\n Property(null)\n ], TreeMap.prototype, \"query\", void 0);\n __decorate([\n Property(null)\n ], TreeMap.prototype, \"weightValuePath\", void 0);\n __decorate([\n Property('')\n ], TreeMap.prototype, \"rangeColorValuePath\", void 0);\n __decorate([\n Property('')\n ], TreeMap.prototype, \"equalColorValuePath\", void 0);\n __decorate([\n Property(null)\n ], TreeMap.prototype, \"colorValuePath\", void 0);\n __decorate([\n Property([])\n ], TreeMap.prototype, \"palette\", void 0);\n __decorate([\n Property('TopLeftBottomRight')\n ], TreeMap.prototype, \"renderDirection\", void 0);\n __decorate([\n Property(false)\n ], TreeMap.prototype, \"enableDrillDown\", void 0);\n __decorate([\n Property(false)\n ], TreeMap.prototype, \"enableBreadcrumb\", void 0);\n __decorate([\n Property(' - ')\n ], TreeMap.prototype, \"breadcrumbConnector\", void 0);\n __decorate([\n Property(false)\n ], TreeMap.prototype, \"drillDownView\", void 0);\n __decorate([\n Complex({}, InitialDrillSettings)\n ], TreeMap.prototype, \"initialDrillDown\", void 0);\n __decorate([\n Complex({}, LeafItemSettings)\n ], TreeMap.prototype, \"leafItemSettings\", void 0);\n __decorate([\n Collection([], LevelSettings)\n ], TreeMap.prototype, \"levels\", void 0);\n __decorate([\n Complex({}, HighlightSettings)\n ], TreeMap.prototype, \"highlightSettings\", void 0);\n __decorate([\n Complex({}, SelectionSettings)\n ], TreeMap.prototype, \"selectionSettings\", void 0);\n __decorate([\n Complex({}, TooltipSettings)\n ], TreeMap.prototype, \"tooltipSettings\", void 0);\n __decorate([\n Complex({}, LegendSettings)\n ], TreeMap.prototype, \"legendSettings\", void 0);\n __decorate([\n Property(false)\n ], TreeMap.prototype, \"useGroupingSeparator\", void 0);\n __decorate([\n Property(null)\n ], TreeMap.prototype, \"description\", void 0);\n __decorate([\n Property(1)\n ], TreeMap.prototype, \"tabIndex\", void 0);\n __decorate([\n Property(null)\n ], TreeMap.prototype, \"format\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"load\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"beforePrint\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"loaded\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"itemRendering\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"drillStart\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"drillEnd\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"itemSelected\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"itemHighlight\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"tooltipRendering\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"itemClick\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"itemMove\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"click\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"doubleClick\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"rightClick\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"mouseMove\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"resize\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"legendItemRendering\", void 0);\n __decorate([\n Event()\n ], TreeMap.prototype, \"legendRendering\", void 0);\n TreeMap = __decorate([\n NotifyPropertyChanges\n ], TreeMap);\n return TreeMap;\n}(Component));\nexport { TreeMap };\n","import { findChildren, Location, Rect, Size, measureText, TextOption, PathOption, RectOption, drawSymbol, orderByArea } from '../utils/helper';\nimport { Browser, isNullOrUndefined, EventHandler, extend } from '@syncfusion/ej2-base';\nimport { renderTextElement, textTrim } from '../utils/helper';\nimport { legendItemRendering, legendRendering } from '../model/constants';\n/**\n * Legend module class\n */\nvar TreeMapLegend = /** @class */ (function () {\n function TreeMapLegend(treemap) {\n this.page = 0;\n this.legendBorderRect = new Rect(0, 0, 0, 0);\n this.currentPage = 0;\n this.heightIncrement = 0;\n this.widthIncrement = 0;\n this.textMaxWidth = 0;\n this.legendInteractiveGradient = [];\n this.legendItemRect = new Rect(0, 0, 0, 0);\n this.treemap = treemap;\n this.addEventListener();\n }\n /**\n * method for legend\n */\n TreeMapLegend.prototype.renderLegend = function () {\n this.legendRenderingCollections = [];\n this.legendCollections = [];\n this.legendNames = [];\n this.totalPages = [];\n this.gradientCount = 1;\n this.widthIncrement = 0;\n this.heightIncrement = 0;\n this.defsElement = this.treemap.renderer.createDefs();\n this.treemap.svgObject.appendChild(this.defsElement);\n var eventArgs;\n eventArgs = {\n cancel: false, name: legendRendering, treemap: this.treemap, _changePosition: this.treemap.legendSettings.position,\n position: this.treemap.legendSettings.position\n };\n this.treemap.trigger(legendRendering, eventArgs);\n if (!eventArgs.cancel && eventArgs._changePosition !== this.treemap.legendSettings.position) {\n this.treemap.legendSettings.position = eventArgs._changePosition;\n }\n this.calculateLegendBounds();\n if (this.legendCollections.length > 0) {\n this.drawLegend();\n }\n };\n /* tslint:disable:no-string-literal */\n /* tslint:disable-next-line:max-func-body-length */\n TreeMapLegend.prototype.calculateLegendBounds = function () {\n var _this = this;\n var treemap = this.treemap;\n var legend = treemap.legendSettings;\n this.findColorMappingLegendItems(treemap.levelsOfData[0]);\n if ((this.treemap.palette.length > 0 || !isNullOrUndefined(this.treemap.colorValuePath))\n && this.legendCollections.length === 0) {\n this.findPaletteLegendItems(this.treemap.levelsOfData[0], 'Parent');\n }\n if (this.legendCollections.length > 0) {\n var defaultSize = 25;\n var textPadding = 10;\n var position = legend.position;\n var legendTitle = legend.title.text;\n var titleTextStyle = legend.titleStyle;\n var legendMode = legend.mode;\n var shapeX = 0;\n var shapeY = 0;\n var textX = 0;\n var textY = 0;\n var shapeHeight = legend.shapeHeight;\n var shapeWidth = legend.shapeWidth;\n var shapeLocation = [];\n var textLocation = [];\n var orientation_1 = (legend.orientation === 'None') ? ((position === 'Top' || position === 'Bottom'\n || (position === 'Auto' && treemap.availableSize.width <= treemap.availableSize.height))\n ? 'Horizontal' : 'Vertical') : legend.orientation;\n var leftPadding = 10;\n var topPadding = 10;\n var spacing = 10;\n var legendWidth = (legend.width.length > 1) ? (legend.width.indexOf('%') > -1) ? (treemap.availableSize.width / 100)\n * parseFloat(legend.width) : parseFloat(legend.width) : null;\n var legendHeight = (legend.height.length > 1) ? (legend.height.indexOf('%') > -1) ?\n (treemap.availableSize.height / 100) * parseFloat(legend.height) : parseFloat(legend.height) : null;\n titleTextStyle.fontFamily = treemap.themeStyle.fontFamily || titleTextStyle.fontFamily;\n titleTextStyle.size = treemap.themeStyle.legendFontSize || titleTextStyle.size;\n var legendTitleSize = measureText(legendTitle, titleTextStyle);\n var startX_1 = 0;\n var startY_1 = 0;\n var shapePadding = legend.shapePadding;\n var rectWidth = void 0;\n var rectHeight = void 0;\n var itemTextStyle = legend.textStyle;\n var legendLength = this.legendCollections.length;\n legend.textStyle.size = treemap.themeStyle.legendFontSize || legend.textStyle.size;\n legend.textStyle.fontFamily = treemap.themeStyle.fontFamily || legend.textStyle.fontFamily;\n if (legendMode === 'Default') {\n legendWidth = (isNullOrUndefined(legendWidth)) ? treemap.areaRect.width : legendWidth;\n legendHeight = (isNullOrUndefined(legendHeight)) ? treemap.areaRect.height : legendHeight;\n var j = 0;\n for (var i = 0; i < this.legendCollections.length; i++) {\n var legendItem = this.legendCollections[i];\n if (isNullOrUndefined(this.totalPages[this.page])) {\n this.totalPages[this.page] = { Page: (this.page + 1), Collection: [] };\n }\n var legendTextSize = measureText(legendItem['legendName'], legend.textStyle);\n this.textMaxWidth = Math.max(this.textMaxWidth, legendTextSize.width);\n if (i === 0) {\n startX_1 = shapeX = (leftPadding + (shapeWidth / 2));\n startY_1 = shapeY = topPadding + legendTitleSize.height + (shapeHeight > legendTextSize.height ? shapeHeight / 2\n : (legendTextSize.height / 4));\n }\n else {\n var maxSize = (legendTextSize.height > shapeHeight) ? legendTextSize.height : shapeHeight;\n if (orientation_1 === 'Horizontal') {\n var prvePositionX = (textLocation[j - 1].x + textLocation[j - 1].width) + textPadding + shapeWidth;\n if ((prvePositionX + shapePadding + legendTextSize.width) > legendWidth) {\n var nextPositionY = (textLocation[j - 1].y > (shapeLocation[j - 1].y + (shapeHeight / 2)) ?\n textLocation[j - 1].y : (shapeLocation[j - 1].y + (shapeHeight / 2))) + topPadding;\n if ((nextPositionY + maxSize) > legendHeight) {\n this.getPageChanged();\n j = 0;\n shapeLocation = [];\n textLocation = [];\n shapeX = startX_1;\n shapeY = startY_1;\n }\n else {\n shapeX = (shapeLocation[0].x);\n shapeY = (nextPositionY + (maxSize / 2));\n }\n }\n else {\n shapeX = (prvePositionX - (shapeWidth / 2));\n shapeY = (shapeLocation[j - 1]).y;\n }\n }\n else {\n var prevPositionY = textLocation[j - 1].y > shapeLocation[j - 1].y + (shapeHeight / 2) ?\n textLocation[j - 1].y : shapeLocation[j - 1].y + (shapeHeight / 2);\n if ((prevPositionY + topPadding + maxSize) > legendHeight) {\n var nextPositionX = (textLocation[j - 1].x + this.textMaxWidth + textPadding);\n if ((nextPositionX + shapePadding + legendTextSize.width) > legendWidth) {\n shapeX = startX_1;\n shapeY = startY_1;\n textLocation = [];\n shapeLocation = [];\n this.getPageChanged();\n j = 0;\n }\n else {\n shapeX = nextPositionX + (shapeWidth / 2);\n shapeY = (shapeLocation[0].y);\n }\n }\n else {\n shapeX = shapeLocation[j - 1].x;\n shapeY = prevPositionY + topPadding + (shapeHeight / 2);\n }\n }\n }\n textX = shapeX + (shapeWidth / 2) + shapePadding;\n textY = shapeY + (legendTextSize.height / 4);\n shapeLocation.push({ x: shapeX, y: shapeY });\n textLocation.push({ x: textX, y: textY, width: legendTextSize.width, height: (legendTextSize.height / 2) });\n this.totalPages[this.page]['Collection'].push({\n DisplayText: legendItem['legendName'], element: legendItem['gradientElement'],\n Shape: { x: shapeX, y: shapeY },\n Text: { x: textX, y: textY },\n Fill: legendItem['legendFill'],\n Data: legendItem['legendData'],\n Rect: {\n x: shapeLocation[j].x - (shapeWidth / 2),\n y: (shapeLocation[j].y - (shapeHeight / 2)) < (textY - legendTextSize.height) ?\n (shapeLocation[j].y - (shapeHeight / 2)) : (textY - legendTextSize.height),\n width: Math.abs((shapeLocation[j].x - (shapeWidth / 2)) - (textX + legendTextSize.width)),\n height: ((shapeHeight > legendTextSize.height) ? shapeHeight : legendTextSize.height)\n }\n });\n j++;\n }\n var collection = this.totalPages[0]['Collection'];\n collection.forEach(function (legendObj, index) {\n var legendRect = new Rect(legendObj['Rect']['x'], legendObj['Rect']['y'], legendObj['Rect']['width'], legendObj['Rect']['height']);\n if (index === 0) {\n startX_1 = legendRect.x;\n startY_1 = legendRect.y;\n }\n _this.widthIncrement = Math.max(_this.widthIncrement, Math.abs(startX_1 - (legendRect.x + legendRect.width)));\n _this.heightIncrement = Math.max(_this.heightIncrement, Math.abs(startY_1 - (legendRect.y + legendRect.height)));\n });\n legendWidth = ((this.widthIncrement < legendWidth) ? this.widthIncrement : legendWidth);\n legendHeight = ((this.heightIncrement < legendHeight) ? this.heightIncrement : legendHeight);\n this.legendItemRect = {\n x: collection[0]['Rect']['x'], y: collection[0]['Rect']['y'],\n width: legendWidth, height: legendHeight\n };\n }\n else {\n var itemTextStyle_1 = legend.textStyle;\n var rectWidth_1;\n var rectHeight_1;\n var legendLength_1 = this.legendCollections.length;\n rectWidth_1 = (orientation_1 === 'Horizontal') ? (isNullOrUndefined(legendWidth)) ? (treemap.areaRect.width / legendLength_1) :\n (legendWidth / legendLength_1) : (isNullOrUndefined(legendWidth)) ? defaultSize : legendWidth;\n rectHeight_1 = (orientation_1 === 'Horizontal') ? (isNullOrUndefined(legendHeight)) ? defaultSize : legendHeight :\n (isNullOrUndefined(legendHeight)) ? (treemap.areaRect.height / legendLength_1) : (legendHeight / legendLength_1);\n startX_1 = 0;\n startY_1 = legendTitleSize.height + spacing;\n var textPadding_1 = 10;\n var placement = legend.labelPosition;\n var itemStartX = 0;\n var itemStartY = 0;\n var labelAction = legend.labelDisplayMode;\n var maxTextHeight = 0;\n var maxTextWidth = 0;\n for (var i = 0; i < this.legendCollections.length; i++) {\n startX_1 = (orientation_1 === 'Horizontal') ? (startX_1 + rectWidth_1) : startX_1;\n startY_1 = (orientation_1 === 'Horizontal') ? startY_1 : (startY_1 + rectHeight_1);\n var legendText = this.legendCollections[i]['legendName'];\n var itemTextSize = new Size(0, 0);\n if (labelAction === 'None') {\n itemTextSize = measureText(legendText, itemTextStyle_1);\n }\n else if (labelAction === 'Trim') {\n legendText = textTrim((orientation_1 === 'Horizontal' ? rectWidth_1 : rectHeight_1), legendText, itemTextStyle_1);\n itemTextSize = measureText(legendText, itemTextStyle_1);\n }\n else {\n legendText = '';\n }\n maxTextHeight = Math.max(maxTextHeight, itemTextSize.height);\n maxTextWidth = Math.max(maxTextWidth, itemTextSize.width);\n if (itemTextSize.width > 0 && itemTextSize.height > 0) {\n if (orientation_1 === 'Horizontal') {\n textX = startX_1 + (rectWidth_1 / 2);\n textY = (placement === 'After') ? (startY_1 + rectHeight_1 + (itemTextSize.height / 2)) + textPadding_1 :\n (startY_1 - textPadding_1);\n }\n else {\n textX = (placement === 'After') ? startX_1 - (itemTextSize.width / 2) - textPadding_1\n : (startX_1 + rectWidth_1 + itemTextSize.width / 2) + textPadding_1;\n textY = startY_1 + (rectHeight_1 / 2) + (itemTextSize.height / 4);\n }\n }\n if (i === 0) {\n itemStartX = (orientation_1 === 'Horizontal') ? startX_1 : (placement === 'After') ?\n textX - (itemTextSize.width / 2) : startX_1;\n itemStartY = (orientation_1 === 'Horizontal') ? (placement === 'After') ? startY_1 :\n textY - (itemTextSize.height / 2) : startY_1;\n }\n if (i === legendLength_1 - 1) {\n legendWidth = (orientation_1 === 'Horizontal') ? Math.abs((startX_1 + rectWidth_1) - itemStartX) :\n (rectWidth_1 + maxTextWidth + textPadding_1);\n legendHeight = (orientation_1 === 'Horizontal') ? (rectHeight_1 + (maxTextHeight / 2) + textPadding_1) :\n Math.abs((startY_1 + rectHeight_1) - itemStartY);\n }\n this.legendRenderingCollections.push({\n fill: this.legendCollections[i]['legendFill'], x: startX_1, y: startY_1,\n width: rectWidth_1, height: rectHeight_1, element: this.legendCollections[i]['gradientElement'],\n text: legendText, textX: textX, textY: textY,\n textWidth: itemTextSize.width, textHeight: itemTextSize.height,\n data: this.legendCollections[i]['legendData']\n });\n }\n this.legendItemRect = { x: itemStartX, y: itemStartY, width: legendWidth, height: legendHeight };\n }\n }\n };\n TreeMapLegend.prototype.getPageChanged = function () {\n this.page++;\n if (isNullOrUndefined(this.totalPages[this.page])) {\n this.totalPages[this.page] = { Page: (this.page + 1), Collection: [] };\n }\n };\n TreeMapLegend.prototype.findColorMappingLegendItems = function (data) {\n var child = findChildren(data)['values'];\n if (child && child.length > 0) {\n this.calculateLegendItems(child);\n if (this.treemap.levels.length > 0) {\n for (var i = 0; i < child.length; i++) {\n this.findColorMappingLegendItems(child[i]);\n }\n }\n }\n };\n TreeMapLegend.prototype.findPaletteLegendItems = function (data, type) {\n var child;\n var legendFillColor;\n if (!isNullOrUndefined(this.treemap.drilledItems)) {\n if (this.treemap.drilledItems.length === 0 && !isNullOrUndefined(this.treemap.initialDrillDown.groupName)\n && isNullOrUndefined(this.treemap.drilledLegendItems)) {\n var items = findChildren(data)['values'];\n for (var k = 0; k < items.length; k++) {\n if (items[k]['Name'] === this.treemap.initialDrillDown.groupName) {\n items[k]['isDrilled'] = !items[k]['isDrilled'];\n data = items[k];\n this.treemap.currentLevel = this.treemap.initialDrillDown.groupIndex;\n legendFillColor = this.treemap.palette.length > 0 ? this.treemap.palette[k % this.treemap.palette.length] :\n items[k]['data'][this.treemap.colorValuePath];\n break;\n }\n }\n }\n }\n if (this.treemap.enableDrillDown && !isNullOrUndefined(this.treemap.drilledLegendItems)) {\n var childElement = this.treemap.drilledLegendItems;\n legendFillColor = childElement['data']['options']['fill'];\n if (childElement['data']['isDrilled']) {\n child = findChildren(childElement['data'])['values'];\n }\n else {\n var parentElement = childElement['data']['parent'];\n child = findChildren(parentElement)['values'];\n }\n }\n else {\n child = findChildren(data)['values'];\n }\n var isDuplicate;\n var legendName;\n if (child && child.length > 0) {\n for (var i = 0; i < child.length; i++) {\n if (isNullOrUndefined(child[i]['data'][this.treemap.legendSettings.showLegendPath]) ||\n child[i]['data'][this.treemap.legendSettings.showLegendPath]) {\n legendName = child[i]['data'][this.treemap.legendSettings.valuePath] ?\n child[i]['data'][this.treemap.legendSettings.valuePath] : child[i]['name'];\n isDuplicate = this.treemap.legendSettings.removeDuplicateLegend ?\n this.removeDuplicates(this.legendCollections, legendName) : false;\n if (!isDuplicate) {\n this.legendCollections.push({\n legendName: legendName,\n legendFill: this.treemap.palette.length > 0 ? !isNullOrUndefined(this.treemap.currentLevel)\n ? legendFillColor : this.treemap.palette[i % this.treemap.palette.length] :\n child[i]['data'][this.treemap.colorValuePath],\n legendData: [],\n itemArea: child[i]['weight']\n });\n }\n }\n }\n this.legendCollections.sort(orderByArea);\n if (this.treemap.palette.length > 0) {\n for (var j = 0; j < this.legendCollections.length; j++) {\n this.legendCollections[j]['legendFill'] = !isNullOrUndefined(this.treemap.currentLevel)\n ? legendFillColor : this.treemap.palette[j % this.treemap.palette.length];\n }\n }\n }\n };\n /* tslint:disable-next-line:max-func-body-length */\n TreeMapLegend.prototype.calculateLegendItems = function (data) {\n var isAddData;\n var fill;\n var rangeValue;\n var currentData;\n var legendText;\n var itemValue;\n var isLeafItem;\n var colorMapProcess = false;\n var colorMapping;\n var groupIndex;\n var leaf = this.treemap.leafItemSettings;\n var levels = this.treemap.levels;\n var equalValue;\n var position = this.treemap.legendSettings.position;\n var gradientElement;\n var x2;\n var y2;\n var actualValue;\n var isDuplicate;\n var isEqualColor;\n var isRange;\n var isDesaturation = false;\n var legendIndex = 0;\n var outfill;\n var labelLegend;\n var otherIndex;\n this.outOfRangeLegend = null;\n for (var i = 0; i < data.length; i++) {\n fill = '';\n isEqualColor = false;\n isRange = false;\n isDesaturation = false;\n currentData = data[i]['data'];\n groupIndex = data[i]['groupIndex'];\n isLeafItem = (this.treemap.levels.length === 0 || groupIndex === this.treemap.levels.length);\n colorMapping = isLeafItem ? leaf.colorMapping : levels[groupIndex].colorMapping;\n for (var _i = 0, colorMapping_1 = colorMapping; _i < colorMapping_1.length; _i++) {\n var colorMap = colorMapping_1[_i];\n gradientElement = null;\n rangeValue = Number(currentData[this.treemap.rangeColorValuePath]);\n equalValue = currentData[this.treemap.equalColorValuePath];\n colorMap.value = !isNullOrUndefined(colorMap.value) ? colorMap.value.toString() : colorMap.value;\n if (!isNullOrUndefined(colorMap.from) && !isNullOrUndefined(colorMap.to) &&\n rangeValue >= colorMap.from && rangeValue <= colorMap.to && colorMap.showLegend) {\n colorMapProcess = true;\n isRange = true;\n actualValue = colorMap.from + ' - ' + colorMap.to;\n legendText = !isNullOrUndefined(colorMap.label) ? colorMap.label : colorMap.from + ' - ' + colorMap.to;\n fill = isNullOrUndefined(colorMap.color) ? fill : colorMap.color;\n isAddData = this.isAddNewLegendData(actualValue);\n }\n else if (!isNullOrUndefined(colorMap.value) && equalValue === colorMap.value && colorMap.showLegend) {\n colorMapProcess = true;\n isEqualColor = true;\n actualValue = colorMap.value.toString();\n legendText = !isNullOrUndefined(colorMap.label) ? colorMap.label : colorMap.value.toString();\n fill = isNullOrUndefined(colorMap.color) ? fill :\n Object.prototype.toString.call(colorMap.color) === '[object Array]' ? colorMap.color[0] : colorMap.color;\n isAddData = this.isAddNewLegendData(actualValue);\n }\n if (colorMapProcess && isNullOrUndefined(colorMap.value) && colorMap.maxOpacity && colorMap.minOpacity\n && this.treemap.legendSettings.mode === 'Interactive') {\n var colors = [];\n var gradient = void 0;\n isDesaturation = true;\n if (Object.prototype.toString.call(colorMap.color) === '[object Array]') {\n for (var q = 0; q < colorMap.color.length; q++) {\n var offsetColor = 100 / (colorMap.color.length - 1);\n var offsetValue = q * offsetColor + '%';\n var stop1Color = { colorStop: offsetValue.toString(), color: colorMap.color[q] };\n colors.push(stop1Color);\n }\n }\n else {\n var stop1Color = { colorStop: '0%', color: fill };\n var stop2Color = { colorStop: '100%', color: fill };\n colors.push(stop1Color);\n colors.push(stop2Color);\n }\n x2 = position === 'Top' || position === 'Bottom' ? '100%' : '0%';\n y2 = position === 'Top' || position === 'Bottom' ? '0%' : '100%';\n gradient = {\n id: 'groupIndex_' + groupIndex + '_colorIndex_' + this.gradientCount, x1: '0%', y1: '0%', x2: x2, y2: y2\n };\n gradientElement = this.treemap.renderer.drawGradient('linearGradient', gradient, colors).childNodes[0];\n if (Object.prototype.toString.call(colorMap.color) !== '[object Array]') {\n gradientElement.childNodes[0].setAttribute('stop-opacity', colorMap.minOpacity.toString());\n gradientElement.childNodes[1].setAttribute('stop-opacity', colorMap.maxOpacity.toString());\n }\n this.defsElement.appendChild(gradientElement);\n this.gradientCount++;\n }\n isDuplicate = this.treemap.legendSettings.removeDuplicateLegend ?\n this.removeDuplicates(this.legendCollections, legendText) : false;\n if (isAddData && isAddData['process'] && colorMapProcess && !isDuplicate) {\n colorMapProcess = false;\n fill = ((Object.prototype.toString.call(colorMap.color) === '[object Array]')) && isNullOrUndefined(gradientElement)\n && isNullOrUndefined(colorMap.value) ? this.legendGradientColor(colorMap, legendIndex) : fill;\n this.legendCollections.push({\n actualValue: actualValue,\n legendName: legendText, legendFill: fill, legendData: [],\n gradientElement: !isNullOrUndefined(gradientElement) ? gradientElement : isNullOrUndefined(colorMap.value)\n ? this.legendLinearGradient : null, name: data[i]['name'],\n opacity: this.treemap.legendSettings.opacity, borderColor: this.treemap.legendSettings.border.color,\n borderWidth: this.treemap.legendSettings.border.width\n });\n this.legendCollections[this.legendCollections.length - 1]['legendData'].push(data[i]);\n legendIndex++;\n }\n else if (colorMapProcess && !isDuplicate) {\n colorMapProcess = false;\n this.legendCollections[isAddData['value']]['legendData'].push(data[i]);\n }\n if (!isRange && !isDesaturation && !isEqualColor) {\n if (isNullOrUndefined(colorMap.from) && isNullOrUndefined(colorMap.to)\n && isNullOrUndefined(colorMap.minOpacity) &&\n isNullOrUndefined(colorMap.maxOpacity) && isNullOrUndefined(colorMap.value) &&\n !isNullOrUndefined(colorMap.color)) {\n outfill = ((Object.prototype.toString.call(colorMap.color) === '[object Array]'))\n ? colorMap.color[0] : colorMap.color;\n labelLegend = !isNullOrUndefined(colorMap.label) ? colorMap.label : 'Others';\n if (isNullOrUndefined(this.outOfRangeLegend)) {\n this.legendCollections.push({\n actualValue: labelLegend, legendData: [],\n legendName: labelLegend, legendFill: outfill\n });\n otherIndex = this.legendCollections.length;\n this.outOfRangeLegend = this.legendCollections[otherIndex - 1];\n legendIndex++;\n }\n this.legendCollections[otherIndex - 1]['legendData'].push(data[i]);\n }\n }\n }\n }\n };\n TreeMapLegend.prototype.removeDuplicates = function (legendCollection, text) {\n var isDuplicate = false;\n for (var i = 0; i < legendCollection.length; i++) {\n if (legendCollection[i]['legendName'] === text) {\n isDuplicate = true;\n break;\n }\n else {\n continue;\n }\n }\n return isDuplicate;\n };\n TreeMapLegend.prototype.isAddNewLegendData = function (legendText) {\n var newDataProcess;\n var itemValue;\n if (this.legendCollections.length === 0) {\n newDataProcess = true;\n }\n else {\n for (var j = 0; j < this.legendCollections.length; j++) {\n if (legendText === this.legendCollections[j]['actualValue']) {\n newDataProcess = false;\n itemValue = j;\n break;\n }\n else if (j === this.legendCollections.length - 1) {\n newDataProcess = true;\n }\n }\n }\n return { process: newDataProcess, value: itemValue };\n };\n /* tslint:disable-next-line:max-func-body-length */\n /**\n * To draw the legend\n */\n TreeMapLegend.prototype.drawLegend = function () {\n var treemap = this.treemap;\n var legend = treemap.legendSettings;\n var render = treemap.renderer;\n var fill;\n var textOptions;\n var gradientElement;\n var textFont = legend.textStyle;\n this.legendGroup = render.createGroup({ id: treemap.element.id + '_Legend_Group' });\n this.renderLegendBorder();\n this.renderLegendTitle();\n if (legend.mode === 'Default') {\n this.drawLegendItem(this.currentPage);\n }\n else {\n for (var i = 0; i < this.legendRenderingCollections.length; i++) {\n var itemId = treemap.element.id + '_Legend_Index_' + i;\n var textId = treemap.element.id + '_Legend_Index_' + i + '_Text';\n var item = this.legendRenderingCollections[i];\n gradientElement = item['element'];\n fill = gradientElement ? 'url(#' + gradientElement.id + ')' : item['fill'];\n var bounds = new Rect(item['x'], item['y'], item['width'], item['height']);\n var textLocation = new Location(item['textX'], item['textY']);\n var rectOptions = new RectOption(itemId, fill, legend.shapeBorder, legend.opacity, bounds);\n if (this.treemap.enableRtl) {\n if (treemap.legendSettings.position === 'Left' || treemap.legendSettings.position === 'Right'\n || (treemap.legendSettings.position === 'Auto'\n && this.treemap.availableSize.width >= this.treemap.availableSize.height)) {\n rectOptions.y = (this.translate.y + this.legendBorderRect.y + this.legendBorderRect.height)\n - (this.translate.y + rectOptions.height) - Math.abs(this.legendBorderRect.y - rectOptions.y);\n textLocation.y = (this.translate.y + this.legendBorderRect.y + this.legendBorderRect.height)\n - (this.translate.y) + (item['textHeight'] / 2)\n - Math.abs(this.legendBorderRect.y - textLocation.y);\n }\n else {\n rectOptions.x = (this.translate.x + this.legendBorderRect.x + this.legendBorderRect.width)\n - (this.translate.x + rectOptions.width)\n - Math.abs(this.legendBorderRect.x - rectOptions.x);\n textLocation.x = (this.translate.x + this.legendBorderRect.x + this.legendBorderRect.width)\n - this.translate.x - Math.abs(this.legendBorderRect.x - textLocation.x);\n }\n }\n textOptions = new TextOption(textId, textLocation.x, textLocation.y, 'middle', item['text'], '', '');\n renderTextElement(textOptions, textFont, textFont.color || this.treemap.themeStyle.legendTextColor, this.legendGroup);\n this.legendGroup.appendChild(render.drawRectangle(rectOptions));\n }\n }\n };\n TreeMapLegend.prototype.defaultLegendRtlLocation = function (collection, spacing, treemap, legend) {\n var shapeLocation = collection['Shape'];\n var textLocation = collection['Text'];\n var legendText = collection['DisplayText'];\n var textSize = measureText(legendText, legend.textStyle);\n shapeLocation.x = (this.translate.x + this.legendBorderRect.x + this.legendBorderRect.width)\n - (this.translate.x + spacing) - Math.abs(this.legendBorderRect.x - shapeLocation.x);\n textLocation.x = (this.translate.x + this.legendBorderRect.x + this.legendBorderRect.width)\n - (this.translate.x + textSize.width + spacing) - Math.abs(this.legendBorderRect.x - textLocation.x);\n if (treemap.legendSettings.position === 'Left' || treemap.legendSettings.position === 'Right'\n || (treemap.legendSettings.position === 'Auto'\n && this.treemap.availableSize.width >= this.treemap.availableSize.height)) {\n shapeLocation.y = (this.translate.y + this.legendBorderRect.y + this.legendBorderRect.height)\n - this.translate.y - Math.abs(Math.abs(this.legendBorderRect.y) - shapeLocation.y) - (legend.shapeHeight / 2);\n textLocation.y = (this.translate.y + this.legendBorderRect.y + this.legendBorderRect.height)\n - this.translate.y - Math.abs(Math.abs(this.legendBorderRect.y) - textLocation.y);\n }\n return { shapeLocation: shapeLocation, textLocation: textLocation };\n };\n TreeMapLegend.prototype.drawLegendItem = function (page) {\n var treemap = this.treemap;\n var spacing = 10;\n var legend = treemap.legendSettings;\n var shapeSize = new Size(legend.shapeWidth, legend.shapeHeight);\n var textOptions;\n var legendRtlLocation;\n var renderOptions;\n var render = treemap.renderer;\n var shapeBorder = legend.shapeBorder;\n var eventArgs;\n if (page >= 0 && page < this.totalPages.length) {\n if (document.getElementById(this.legendGroup.id)) {\n document.getElementById(this.legendGroup.id).remove();\n }\n var isLineShape = (legend.shape === 'HorizontalLine' || legend.shape === 'VerticalLine' || legend.shape === 'Cross');\n var strokeColor = isLineShape ? isNullOrUndefined(legend.fill) ? '#000000' : legend.fill : shapeBorder.color;\n var strokeWidth = isLineShape ? (shapeBorder.width === 0) ? 1 : shapeBorder.width : shapeBorder.width;\n for (var i = 0; i < this.totalPages[page]['Collection'].length; i++) {\n var collection = this.totalPages[page]['Collection'][i];\n var legendElement = render.createGroup({ id: treemap.element.id + '_Legend_Index_' + i });\n var legendText = collection['DisplayText'];\n var shapeId = treemap.element.id + '_Legend_Shape_Index_' + i;\n var textId = treemap.element.id + '_Legend_Text_Index_' + i;\n var shapeLocation = collection['Shape'];\n var textLocation = collection['Text'];\n if (treemap.enableRtl) {\n legendRtlLocation = this.defaultLegendRtlLocation(collection, spacing, treemap, legend);\n shapeLocation = legendRtlLocation['shapeLocation'];\n textLocation = legendRtlLocation['textLocation'];\n }\n eventArgs = {\n cancel: false, name: legendItemRendering, treemap: treemap, fill: collection['Fill'],\n shape: legend.shape, imageUrl: legend.imageUrl\n };\n this.treemap.trigger(legendItemRendering, eventArgs);\n var renderOptions_1 = new PathOption(shapeId, eventArgs.fill, strokeWidth, isLineShape ? collection['Fill'] : strokeColor, legend.opacity, '');\n legendElement.appendChild(drawSymbol(shapeLocation, eventArgs.shape, shapeSize, eventArgs.imageUrl, renderOptions_1, legendText));\n textOptions = new TextOption(textId, textLocation.x, textLocation.y, 'start', legendText, '', '');\n renderTextElement(textOptions, legend.textStyle, legend.textStyle.color || this.treemap.themeStyle.legendTextColor, legendElement);\n this.legendGroup.appendChild(legendElement);\n }\n var pagingGroup = void 0;\n var width = spacing;\n var height = (spacing / 2);\n if (this.page !== 0) {\n var pagingText = (page + 1) + '/' + this.totalPages.length;\n var pagingFont = legend.textStyle;\n var pagingTextSize = measureText(pagingText, pagingFont);\n var leftPageX = (this.legendItemRect.x + this.legendItemRect.width) - pagingTextSize.width -\n (width * 2) - spacing;\n var rightPageX = (this.legendItemRect.x + this.legendItemRect.width);\n var locY = (this.legendItemRect.y + this.legendItemRect.height) + (height / 2) + spacing;\n var pageTextX = rightPageX - width - (pagingTextSize.width / 2) - (spacing / 2);\n pagingGroup = render.createGroup({ id: treemap.element.id + '_Legend_Paging_Group' });\n var leftPageElement = render.createGroup({ id: treemap.element.id + '_Legend_Left_Paging_Group' });\n var rightPageElement = render.createGroup({ id: treemap.element.id + '_Legend_Right_Paging_Group' });\n var rightPath = ' M ' + rightPageX + ' ' + locY + ' L ' + (rightPageX - width) + ' ' + (locY - height) +\n ' L ' + (rightPageX - width) + ' ' + (locY + height) + ' z ';\n var leftPath = ' M ' + leftPageX + ' ' + locY + ' L ' + (leftPageX + width) + ' ' + (locY - height) +\n ' L ' + (leftPageX + width) + ' ' + (locY + height) + ' z ';\n var leftPageOptions = new PathOption(treemap.element.id + '_Left_Page', '#a6a6a6', 0, '#a6a6a6', 1, '', leftPath);\n leftPageElement.appendChild(render.drawPath(leftPageOptions));\n var leftRectPageOptions = new RectOption(treemap.element.id + '_Left_Page_Rect', 'transparent', {}, 1, new Rect(leftPageX - (width / 2), (locY - (height * 2)), width * 2, spacing * 2), '');\n leftPageElement.appendChild(render.drawRectangle(leftRectPageOptions));\n this.wireEvents(leftPageElement);\n var rightPageOptions = new PathOption(treemap.element.id + '_Right_Page', '#a6a6a6', 0, '#a6a6a6', 1, '', rightPath);\n rightPageElement.appendChild(render.drawPath(rightPageOptions));\n var rightRectPageOptions = new RectOption(treemap.element.id + '_Right_Page_Rect', 'transparent', {}, 1, new Rect((rightPageX - width), (locY - height), width, spacing), '');\n rightPageElement.appendChild(render.drawRectangle(rightRectPageOptions));\n this.wireEvents(rightPageElement);\n pagingGroup.appendChild(leftPageElement);\n pagingGroup.appendChild(rightPageElement);\n var pageTextOptions = {\n 'id': treemap.element.id + '_Paging_Text',\n 'x': pageTextX,\n 'y': locY + (pagingTextSize.height / 4),\n 'fill': '#a6a6a6',\n 'font-size': '14px',\n 'font-style': pagingFont.fontStyle,\n 'font-family': pagingFont.fontFamily,\n 'font-weight': pagingFont.fontWeight,\n 'text-anchor': 'middle',\n 'transform': '',\n 'opacity': 1,\n 'dominant-baseline': ''\n };\n pagingGroup.appendChild(render.createText(pageTextOptions, pagingText));\n this.legendGroup.appendChild(pagingGroup);\n }\n }\n };\n TreeMapLegend.prototype.renderLegendBorder = function () {\n var treemap = this.treemap;\n var legend = treemap.legendSettings;\n var legendTitle = legend.title.text;\n var spacing = 10;\n var textStyle = legend.titleStyle;\n var textOptions;\n var title = textTrim((this.legendItemRect.width + (spacing * 2)), legendTitle, textStyle);\n var textSize = measureText(title, textStyle);\n this.legendBorderRect = new Rect((this.legendItemRect.x - spacing), (this.legendItemRect.y - spacing - textSize.height), (this.legendItemRect.width) + (spacing * 2), (this.legendItemRect.height) + (spacing * 2) + textSize.height +\n (legend.mode === 'Interactive' ? 0 : (this.page !== 0) ? spacing : 0));\n var renderOptions = new RectOption(treemap.element.id + '_Legend_Border', legend.background, legend.border, 1, this.legendBorderRect, '');\n var legendBorder = treemap.renderer.drawRectangle(renderOptions);\n legendBorder.style.pointerEvents = 'none';\n this.legendGroup.appendChild(legendBorder);\n this.getLegendAlignment(treemap, this.legendBorderRect.width, this.legendBorderRect.height, legend);\n this.legendGroup.setAttribute('transform', 'translate( ' + (this.translate.x + (-(this.legendBorderRect.x))) + ' ' +\n (this.translate.y + (-(this.legendBorderRect.y))) + ' )');\n treemap.svgObject.appendChild(this.legendGroup);\n };\n TreeMapLegend.prototype.renderLegendTitle = function () {\n var treemap = this.treemap;\n var legend = treemap.legendSettings;\n var textStyle = legend.titleStyle;\n var legendTitle = legend.title.text;\n var textOptions;\n var spacing = 10;\n var trimTitle = textTrim((this.legendItemRect.width + (spacing * 2)), legendTitle, textStyle);\n var textSize = measureText(trimTitle, textStyle);\n if (legendTitle) {\n textOptions = new TextOption(treemap.element.id + '_LegendTitle', (this.legendItemRect.x) + (this.legendItemRect.width / 2), this.legendItemRect.y - (textSize.height / 2) - (spacing / 2), 'middle', trimTitle, '');\n renderTextElement(textOptions, textStyle, textStyle.color || this.treemap.themeStyle.legendTitleColor, this.legendGroup);\n }\n };\n /**\n * To rendered the interactive pointer\n */\n TreeMapLegend.prototype.renderInteractivePointer = function (e) {\n var treemap = this.treemap;\n var target = e.target;\n var interactiveId = treemap.element.id + '_Interactive_Legend';\n target = !(e.type.indexOf('touch') > -1) ? target :\n document.elementFromPoint(e.changedTouches[0].clientX, e.changedTouches[0].clientY);\n var targetItem;\n var legend = treemap.legendSettings;\n if (target.id.indexOf('_Item_Index') > -1 && legend.visible && this.legendRenderingCollections.length > 0) {\n var currentData = void 0;\n var legendRect = void 0;\n var rect = void 0;\n var data = void 0;\n var fill = void 0;\n var stroke = void 0;\n var strokeWidth = void 0;\n var legendElement = void 0;\n targetItem = treemap.layout.renderItems[parseFloat(target.id.split('_')[6])];\n var svgRect = treemap.svgObject.getBoundingClientRect();\n for (var i = 0; i < this.legendCollections.length; i++) {\n currentData = this.legendCollections[i];\n legendElement = document.getElementById(treemap.element.id + '_Legend_Index_' + i);\n legendRect = legendElement.getBoundingClientRect();\n var rect_1 = new Rect(Math.abs(legendRect.left - svgRect.left), Math.abs(legendRect.top - svgRect.top), legendRect.width, legendRect.height);\n fill = legendElement.getAttribute('fill');\n stroke = legend.shapeBorder.color;\n strokeWidth = legend.shapeBorder.width;\n if (!isNullOrUndefined(currentData['legendData'])) {\n data = currentData['legendData'];\n for (var j = 0; j < data.length; j++) {\n if (data[j]['levelOrderName'] === targetItem['levelOrderName']) {\n this.drawInteractivePointer(legend, fill, stroke, interactiveId, strokeWidth, rect_1);\n break;\n }\n }\n }\n }\n }\n else {\n this.removeInteractivePointer();\n }\n };\n TreeMapLegend.prototype.drawInteractivePointer = function (legend, fill, stroke, id, strokeWidth, rect) {\n var path;\n var pathOptions;\n var locX;\n var locY;\n var height = 10;\n var width = 10;\n var direction = (legend.orientation === 'None') ? (legend.position === 'Top' || legend.position === 'Bottom')\n ? 'Horizontal' : 'Vertical' : legend.orientation;\n if (direction === 'Horizontal') {\n if (!legend.invertedPointer) {\n locX = rect.x + (rect.width / 2);\n locY = rect.y;\n path = ' M ' + locX + ' ' + locY + ' L ' + (locX - width) + ' ' + (locY - height) +\n ' L ' + (locX + width) + ' ' + (locY - height) + ' Z ';\n }\n else {\n locX = rect.x + (rect.width / 2);\n locY = rect.y + (rect.height);\n path = ' M ' + locX + ' ' + locY + ' L ' + (locX - width) + ' ' + (locY + height) +\n ' L ' + (locX + width) + ' ' + (locY + height) + ' Z ';\n }\n }\n else {\n if (!legend.invertedPointer) {\n locX = rect.x + (rect.width);\n locY = rect.y + (rect.height / 2);\n path = ' M ' + locX + ' ' + locY + ' L ' + (locX + width) + ' ' + (locY - height) +\n ' L ' + (locX + width) + ' ' + (locY + height) + ' z ';\n }\n else {\n locX = rect.x;\n locY = rect.y + (rect.height / 2);\n path = ' M ' + locX + ' ' + locY + ' L ' + (locX - width) + ' ' + (locY - height) +\n ' L ' + (locX - width) + ' ' + (locY + height) + ' z ';\n }\n }\n pathOptions = new PathOption(id, fill, strokeWidth, stroke, 1, '', path);\n this.treemap.svgObject.appendChild(this.treemap.renderer.drawPath(pathOptions));\n };\n TreeMapLegend.prototype.getLegendAlignment = function (treemap, width, height, legend) {\n var x;\n var y;\n var spacing = 10;\n var totalRect;\n totalRect = extend({}, treemap.areaRect, totalRect, true);\n var areaX = totalRect.x;\n var areaY = totalRect.y;\n var areaHeight = totalRect.height;\n var areaWidth = totalRect.width;\n var totalWidth = treemap.availableSize.width;\n var totalHeight = treemap.availableSize.height;\n var position = legend.position === 'Auto' ? (totalWidth > totalHeight) ? 'Right' : 'Bottom' : legend.position;\n if (legend.position === 'Float') {\n this.translate = legend.location;\n }\n else {\n switch (position) {\n case 'Top':\n case 'Bottom':\n totalRect.height = (areaHeight - height);\n x = (totalWidth / 2) - (width / 2);\n y = (position === 'Top') ? areaY : (areaY + totalRect.height) + spacing;\n totalRect.y = (position === 'Top') ? areaY + height + spacing : areaY;\n break;\n case 'Left':\n case 'Right':\n totalRect.width = (areaWidth - width);\n x = (position === 'Left') ? areaX : areaX + totalRect.width;\n y = (totalHeight / 2) - (height / 2);\n totalRect.x = (position === 'Left') ? areaX + width : areaX;\n break;\n }\n switch (legend.alignment) {\n case 'Near':\n if (position === 'Top' || position === 'Bottom') {\n x = totalRect.x;\n }\n else {\n y = totalRect.y;\n }\n break;\n case 'Far':\n if (position === 'Top' || position === 'Bottom') {\n x = totalWidth - width;\n }\n else {\n y = totalHeight - height;\n }\n break;\n }\n this.treemap.totalRect = totalRect;\n this.translate = new Location(x, y);\n }\n };\n TreeMapLegend.prototype.mouseUpHandler = function (e) {\n this.renderInteractivePointer(e);\n clearTimeout(this.clearTimeout);\n this.clearTimeout = setTimeout(this.removeInteractivePointer.bind(this), 3000);\n };\n /**\n * To remove the interactive pointer\n */\n TreeMapLegend.prototype.removeInteractivePointer = function () {\n if (document.getElementById(this.treemap.element.id + '_Interactive_Legend')) {\n document.getElementById(this.treemap.element.id + '_Interactive_Legend').remove();\n }\n };\n /**\n * To change the next page\n */\n TreeMapLegend.prototype.changeNextPage = function (e) {\n this.currentPage = (e.target.id.indexOf('_Left_Page_') > -1) ? (this.currentPage - 1) :\n (this.currentPage + 1);\n this.drawLegend();\n };\n /**\n * Wire events for event handler\n */\n TreeMapLegend.prototype.wireEvents = function (element) {\n EventHandler.add(element, Browser.touchStartEvent, this.changeNextPage, this);\n };\n /**\n * To add the event listener\n */\n TreeMapLegend.prototype.addEventListener = function () {\n if (this.treemap.isDestroyed) {\n return;\n }\n this.treemap.on(Browser.touchMoveEvent, this.renderInteractivePointer, this);\n this.treemap.on(Browser.touchEndEvent, this.mouseUpHandler, this);\n };\n /**\n * To remove the event listener\n */\n TreeMapLegend.prototype.removeEventListener = function () {\n if (this.treemap.isDestroyed) {\n return;\n }\n this.treemap.off(Browser.touchMoveEvent, this.renderInteractivePointer);\n this.treemap.off(Browser.touchEndEvent, this.mouseUpHandler);\n };\n /**\n * Get module name.\n */\n TreeMapLegend.prototype.getModuleName = function () {\n return 'treeMapLegend';\n };\n /**\n * To destroy the legend.\n * @return {void}\n * @private\n */\n TreeMapLegend.prototype.destroy = function (treemap) {\n /**\n * Destroy method performed here\n */\n this.removeEventListener();\n };\n /**\n * Get the gradient color for interactive legend.\n */\n TreeMapLegend.prototype.legendGradientColor = function (colorMap, legendIndex) {\n var legendFillColor;\n var xmlns = 'http://www.w3.org/2000/svg';\n if (!isNullOrUndefined(colorMap.color) && Object.prototype.toString.call(colorMap.color) === '[object Array]') {\n var defElement = this.treemap.renderer.createDefs();\n var linerGradientEle = document.createElementNS(xmlns, 'linearGradient');\n var opacity = 1;\n var position = this.treemap.legendSettings.position;\n var x2 = void 0;\n var y2 = void 0;\n x2 = position === 'Top' || position === 'Bottom' ? '100' : '0';\n y2 = position === 'Top' || position === 'Bottom' ? '0' : '100';\n linerGradientEle.setAttribute('id', 'linear_' + legendIndex);\n linerGradientEle.setAttribute('x1', 0 + '%');\n linerGradientEle.setAttribute('y1', 0 + '%');\n linerGradientEle.setAttribute('x2', x2 + '%');\n linerGradientEle.setAttribute('y2', y2 + '%');\n for (var b = 0; b < colorMap.color.length; b++) {\n var offsetColor = 100 / (colorMap.color.length - 1);\n var stopEle = document.createElementNS(xmlns, 'stop');\n stopEle.setAttribute('offset', b * offsetColor + '%');\n stopEle.setAttribute('stop-color', colorMap.color[b]);\n stopEle.setAttribute('stop-opacity', opacity.toString());\n linerGradientEle.appendChild(stopEle);\n }\n defElement.appendChild(linerGradientEle);\n this.legendLinearGradient = linerGradientEle;\n var color = 'url(' + '#linear_' + legendIndex + ')';\n this.defsElement.appendChild(linerGradientEle);\n legendFillColor = color;\n }\n return legendFillColor;\n };\n return TreeMapLegend;\n}());\nexport { TreeMapLegend };\n","import { Browser } from '@syncfusion/ej2-base';\nimport { itemHighlight, itemSelected } from '../model/constants';\nimport { findHightLightItems, removeClassNames, applyOptions, removeShape, removeLegend, removeSelectionWithHighlight, setColor, getLegendIndex, pushCollection } from '../utils/helper';\n/**\n * Performing treemap highlight\n */\nvar TreeMapHighlight = /** @class */ (function () {\n function TreeMapHighlight(treeMap) {\n this.target = 'highlight';\n this.shapeTarget = 'highlight';\n this.shapeHighlightCollection = [];\n this.legendHighlightCollection = [];\n this.currentElement = [];\n this.treemap = treeMap;\n this.addEventListener();\n }\n /* tslint:disable:no-string-literal */\n //tslint:disable:max-func-body-length\n /* tslint:disable:max-line-length */\n TreeMapHighlight.prototype.mouseMove = function (e) {\n var treemap = this.treemap;\n var processHighlight;\n var targetId = e.target.id;\n var eventArgs;\n var items = [];\n var highlight = this.treemap.highlightSettings;\n var item;\n var highLightElements = [];\n var process;\n var treeMapElement;\n var element;\n var orders;\n var selectionModule = this.treemap.treeMapSelectionModule;\n if (targetId.indexOf('_Item_Index') > -1 && (selectionModule ? selectionModule.selectionId !== targetId : true)) {\n if (this.highLightId !== targetId) {\n treeMapElement = document.getElementById(treemap.element.id + '_TreeMap_' + treemap.layoutType + '_Layout');\n var selectionElements = document.getElementsByClassName('treeMapSelection');\n item = this.treemap.layout.renderItems[parseFloat(targetId.split('_')[6])];\n var index = void 0;\n if (this.treemap.legendSettings.visible) {\n var collection = this.treemap.treeMapLegendModule.legendCollections;\n var length_1 = this.treemap.treeMapLegendModule.legendCollections.length;\n index = getLegendIndex(length_1, item, treemap);\n this.shapeElement = this.treemap.legendSettings.mode === 'Default' ? document.getElementById('container_Legend_Shape_Index_' + index) : document.getElementById('container_Legend_Index_' + index);\n if (this.shapeElement !== null && (selectionModule ? this.shapeElement.getAttribute('id') !== selectionModule.legendSelectId : true)) {\n if (selectionModule ? this.shapeElement !== selectionModule.shapeElement : true) {\n this.currentElement.push({ currentElement: this.shapeElement });\n removeShape(this.shapeHighlightCollection, 'highlight');\n this.shapeHighlightCollection.push({ legendEle: this.shapeElement, oldFill: collection[index]['legendFill'],\n oldOpacity: collection[index]['opacity'], oldBorderColor: collection[index]['borderColor'],\n oldBorderWidth: collection[index]['borderWidth']\n });\n setColor(this.shapeElement, highlight.fill, highlight.opacity, highlight.border.color, highlight.border.width.toString());\n this.target = 'highlight';\n }\n else if (this.currentElement.length > 0 && this.currentElement[this.currentElement.length - 1]['currentElement'] !== this.shapeElement) {\n removeSelectionWithHighlight(this.shapeHighlightCollection, this.currentElement, treemap);\n this.highLightId = '';\n }\n }\n else if (this.currentElement.length > 0 && this.currentElement[this.currentElement.length - 1]['currentElement'] !== this.shapeElement) {\n removeSelectionWithHighlight(this.shapeHighlightCollection, this.currentElement, treemap);\n this.highLightId = '';\n }\n }\n orders = findHightLightItems(item, [], highlight.mode, treemap);\n if (this.treemap.legendSettings.visible ? selectionModule ? this.shapeElement ? this.shapeElement.getAttribute('id') !== selectionModule.legendSelectId : true : true : true) {\n if (this.treemap.legendSettings.visible ? selectionModule ? this.shapeElement !== selectionModule.shapeElement : true : true) {\n for (var i = 0; i < treeMapElement.childElementCount; i++) {\n element = treeMapElement.childNodes[i];\n process = true;\n item = treemap.layout.renderItems[element.id.split('_')[6]];\n for (var j = 0; j < selectionElements.length; j++) {\n if (element.id === selectionElements[j].id) {\n process = false;\n break;\n }\n }\n if (orders.indexOf(item['levelOrderName']) > -1 && process) {\n highLightElements.push(element);\n items.push(item);\n }\n }\n removeClassNames(document.getElementsByClassName('treeMapHighLight'), 'treeMapHighLight', treemap);\n for (var k = 0; k < highLightElements.length; k++) {\n element = highLightElements[k];\n applyOptions(element.childNodes[0], { border: highlight.border, fill: highlight.fill, opacity: highlight.opacity });\n element.classList.add('treeMapHighLight');\n this.highLightId = targetId;\n }\n eventArgs = { cancel: false, name: itemHighlight, treemap: treemap, items: items, elements: highLightElements };\n treemap.trigger(itemHighlight, eventArgs);\n }\n else {\n processHighlight = false;\n }\n }\n }\n }\n else if (targetId.indexOf('_Legend_Shape') > -1 || targetId.indexOf('_Legend_Index') > -1) {\n if (this.treemap.legendSettings.visible && (selectionModule ? selectionModule.legendSelectId !== targetId : true) && (selectionModule ? selectionModule.shapeSelectId !== targetId : true)) {\n var index = void 0;\n var itemIndex = void 0;\n var groupIndex = void 0;\n var length_2;\n var targetEle = document.getElementById(targetId);\n if (this.shapeTarget === 'highlight') {\n removeLegend(this.legendHighlightCollection, 'highlight');\n }\n this.shapeTarget = 'highlight';\n index = this.treemap.legendSettings.mode === 'Default' ? parseFloat(targetId.split('_')[4]) : parseFloat(targetId.split('_')[3]);\n var dataLength = this.treemap.treeMapLegendModule.legendCollections[index]['legendData'].length;\n var collection = this.treemap.treeMapLegendModule.legendCollections;\n var legendIndex = parseInt(targetId[targetId.length - 1], 10);\n for (var i = 0; i < dataLength; i++) {\n for (var j = 0; j < this.treemap.layout.renderItems.length; j++) {\n if (this.treemap.treeMapLegendModule.legendCollections[index]['legendData'][i]['levelOrderName'] === this.treemap.layout.renderItems[j]['levelOrderName']) {\n itemIndex = j;\n groupIndex = this.treemap.layout.renderItems[j]['groupIndex'];\n var nodeEle = document.getElementById('container_Level_Index_' + groupIndex + '_Item_Index_' + itemIndex + '_RectPath');\n if (i === 0) {\n this.legendHighlightCollection = [];\n pushCollection(this.legendHighlightCollection, legendIndex, j, targetEle, nodeEle, this.treemap.layout.renderItems, collection);\n length_2 = this.legendHighlightCollection.length;\n this.legendHighlightCollection[length_2 - 1]['ShapeCollection'] = { Elements: [] };\n }\n setColor(targetEle, highlight.fill, highlight.opacity, highlight.border.color, highlight.border.width.toString());\n setColor(nodeEle, highlight.fill, highlight.opacity, highlight.border.color, highlight.border.width.toString());\n length_2 = this.legendHighlightCollection.length;\n this.legendHighlightCollection[length_2 - 1]['ShapeCollection']['Elements'].push(nodeEle);\n }\n }\n }\n }\n }\n else {\n if (selectionModule ? this.shapeElement ? this.shapeElement.getAttribute('id') !== selectionModule.legendSelectId : true : true) {\n if (selectionModule ? this.shapeElement !== selectionModule.shapeElement : true && this.treemap.legendSettings.visible) {\n removeClassNames(document.getElementsByClassName('treeMapHighLight'), 'treeMapHighLight', treemap);\n }\n }\n if ((this.shapeTarget === 'highlight' || this.target === 'highlight') && this.treemap.legendSettings.visible) {\n if (selectionModule ? this.shapeElement ? this.shapeElement.getAttribute('id') !== selectionModule.legendSelectId : true : true) {\n if (selectionModule ? this.shapeElement !== selectionModule.shapeElement : true && selectionModule ? selectionModule.legendSelect : true) {\n removeShape(this.shapeHighlightCollection, 'highlight');\n this.shapeHighlightCollection = [];\n }\n }\n }\n if (this.shapeTarget === 'highlight' && this.treemap.legendSettings.visible) {\n removeLegend(this.legendHighlightCollection, 'highlight');\n }\n this.highLightId = '';\n processHighlight = false;\n }\n return processHighlight;\n };\n /**\n * To bind events for highlight\n */\n TreeMapHighlight.prototype.addEventListener = function () {\n if (this.treemap.isDestroyed) {\n return;\n }\n this.treemap.on(Browser.touchMoveEvent, this.mouseMove, this);\n };\n /**\n * To unbind events for highlight\n */\n TreeMapHighlight.prototype.removeEventListener = function () {\n if (this.treemap.isDestroyed) {\n return;\n }\n this.treemap.off(Browser.touchMoveEvent, this.mouseMove);\n };\n /**\n * Get module name.\n */\n TreeMapHighlight.prototype.getModuleName = function () {\n return 'treeMapHighlight';\n };\n /**\n * To destroy the hightlight.\n * @return {void}\n * @private\n */\n TreeMapHighlight.prototype.destroy = function (treeMap) {\n this.removeEventListener();\n };\n return TreeMapHighlight;\n}());\nexport { TreeMapHighlight };\n/**\n * Performing treemap selection\n */\nvar TreeMapSelection = /** @class */ (function () {\n function TreeMapSelection(treeMap) {\n this.shapeSelectionCollection = [];\n this.legendSelectionCollection = [];\n this.shapeSelect = true;\n this.legendSelect = true;\n this.treemap = treeMap;\n this.addEventListener();\n }\n /* tslint:disable:no-string-literal */\n /**\n * Mouse down event in selection\n */\n TreeMapSelection.prototype.mouseDown = function (e) {\n var targetEle = e.target;\n var eventArgs;\n var treemap = this.treemap;\n var items = [];\n var targetId = targetEle.id;\n var item;\n var selectionElements = [];\n var opacity;\n var treeMapElement;\n var element;\n var orders;\n var selection = treemap.selectionSettings;\n var highlightModule = this.treemap.treeMapHighlightModule;\n var layoutID = treemap.element.id + '_TreeMap_' + treemap.layoutType + '_Layout';\n if (targetId.indexOf('_Item_Index') > -1) {\n e.preventDefault();\n if (this.selectionId !== targetId && this.legendSelect) {\n treeMapElement = document.getElementById(layoutID);\n item = treemap.layout.renderItems[parseFloat(targetId.split('_')[6])];\n var index = void 0;\n if (this.treemap.legendSettings.visible) {\n this.shapeSelect = false;\n var length_3 = this.treemap.treeMapLegendModule.legendCollections.length;\n var collection = this.treemap.treeMapLegendModule.legendCollections;\n this.shapeElement = undefined;\n removeShape(this.shapeSelectionCollection, 'selection');\n if (highlightModule) {\n highlightModule.shapeTarget = 'selection';\n highlightModule.shapeHighlightCollection = [];\n }\n index = getLegendIndex(length_3, item, treemap);\n this.shapeElement = this.treemap.legendSettings.mode === 'Default' ? document.getElementById('container_Legend_Shape_Index_' + index) : document.getElementById('container_Legend_Index_' + index);\n if (this.shapeElement !== null) {\n this.shapeSelectId = this.shapeElement.getAttribute('id');\n this.shapeSelectionCollection.push({ legendEle: this.shapeElement, oldFill: collection[index]['legendFill'],\n oldOpacity: collection[index]['opacity'], oldBorderColor: collection[index]['borderColor'],\n oldBorderWidth: collection[index]['borderWidth']\n });\n setColor(this.shapeElement, selection.fill, selection.opacity, selection.border.color, selection.border.width.toString());\n }\n }\n orders = findHightLightItems(item, [], selection.mode, treemap);\n for (var i = 0; i < treeMapElement.childElementCount; i++) {\n element = treeMapElement.childNodes[i];\n item = treemap.layout.renderItems[element.id.split('_')[6]];\n if (orders.indexOf(item['levelOrderName']) > -1) {\n selectionElements.push(element);\n items.push(item);\n }\n }\n removeClassNames(document.getElementsByClassName('treeMapSelection'), 'treeMapSelection', treemap);\n this.selectionId = targetId;\n var highLightElements = document.getElementsByClassName('treeMapHighLight');\n for (var k = 0; k < selectionElements.length; k++) {\n element = selectionElements[k];\n if (highLightElements.length > 0) {\n for (var j = 0; j < highLightElements.length; j++) {\n if (highLightElements[j].id === element.id) {\n highLightElements[j].classList.remove('treeMapHighLight');\n }\n applyOptions(element.childNodes[0], { border: selection.border, fill: selection.fill, opacity: selection.opacity });\n element.classList.add('treeMapSelection');\n }\n }\n else {\n applyOptions(element.childNodes[0], { border: selection.border, fill: selection.fill, opacity: selection.opacity });\n element.classList.add('treeMapSelection');\n }\n eventArgs = { cancel: false, name: itemSelected, treemap: treemap, items: items, elements: selectionElements };\n treemap.trigger(itemSelected, eventArgs);\n }\n }\n else {\n removeShape(this.shapeSelectionCollection, 'selection');\n this.shapeElement = undefined;\n this.shapeSelect = true;\n this.shapeSelectId = '';\n removeClassNames(document.getElementsByClassName('treeMapSelection'), 'treeMapSelection', treemap);\n this.selectionId = '';\n }\n }\n else if (targetId.indexOf('_Legend_Shape') > -1 || targetId.indexOf('_Legend_Index') > -1) {\n var collection = this.treemap.treeMapLegendModule.legendCollections;\n if (this.treemap.legendSettings.visible && this.legendSelectId !== targetId && this.shapeSelect) {\n var index = void 0;\n var itemIndex = void 0;\n var groupIndex = void 0;\n var length_4;\n this.legendSelectId = targetId;\n this.legendSelect = false;\n var legendIndex = parseInt(targetId[targetId.length - 1], 10);\n var targetEle_1 = document.getElementById(targetId);\n removeLegend(this.legendSelectionCollection, 'selection');\n if (highlightModule) {\n highlightModule.shapeTarget = 'selection';\n }\n index = this.treemap.legendSettings.mode === 'Default' ? parseFloat(targetId.split('_')[4]) : parseFloat(targetId.split('_')[3]);\n var dataLength = this.treemap.treeMapLegendModule.legendCollections[index]['legendData'].length;\n for (var k = 0; k < dataLength; k++) {\n for (var l = 0; l < this.treemap.layout.renderItems.length; l++) {\n if (this.treemap.treeMapLegendModule.legendCollections[index]['legendData'][k]['levelOrderName'] === this.treemap.layout.renderItems[l]['levelOrderName']) {\n itemIndex = l;\n groupIndex = this.treemap.layout.renderItems[l]['groupIndex'];\n var nodeEle = document.getElementById('container_Level_Index_' + groupIndex + '_Item_Index_' + itemIndex + '_RectPath');\n if (k === 0) {\n pushCollection(this.legendSelectionCollection, legendIndex, l, targetEle_1, nodeEle, this.treemap.layout.renderItems, collection);\n length_4 = this.legendSelectionCollection.length;\n this.legendSelectionCollection[length_4 - 1]['ShapeCollection'] = { Elements: [] };\n }\n setColor(targetEle_1, selection.fill, selection.opacity, selection.border.color, selection.border.width.toString());\n setColor(nodeEle, selection.fill, selection.opacity, selection.border.color, selection.border.width.toString());\n length_4 = this.legendSelectionCollection.length;\n this.legendSelectionCollection[length_4 - 1]['ShapeCollection']['Elements'].push(nodeEle);\n }\n }\n }\n }\n else {\n removeLegend(this.legendSelectionCollection, 'Selection');\n if (highlightModule) {\n highlightModule.shapeTarget = 'highlight';\n }\n this.legendSelect = true;\n this.legendSelectId = '';\n }\n }\n };\n /**\n * To bind events for selection\n */\n TreeMapSelection.prototype.addEventListener = function () {\n if (this.treemap.isDestroyed) {\n return;\n }\n this.treemap.on(Browser.touchStartEvent, this.mouseDown, this);\n };\n /**\n * To unbind events for selection\n */\n TreeMapSelection.prototype.removeEventListener = function () {\n if (this.treemap.isDestroyed) {\n return;\n }\n this.treemap.off(Browser.touchStartEvent, this.mouseDown);\n };\n /**\n * Get module name.\n */\n TreeMapSelection.prototype.getModuleName = function () {\n return 'treeMapSelection';\n };\n /**\n * To destroy the selection.\n * @return {void}\n * @private\n */\n TreeMapSelection.prototype.destroy = function (treeMap) {\n this.removeEventListener();\n };\n return TreeMapSelection;\n}());\nexport { TreeMapSelection };\n","import { Tooltip } from '@syncfusion/ej2-svg-base';\nimport { Browser, createElement, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { getMousePosition, textFormatter, formatValue } from '../utils/helper';\nimport { tooltipRendering } from '../model/constants';\n/**\n * Render Tooltip\n */\nvar TreeMapTooltip = /** @class */ (function () {\n function TreeMapTooltip(treeMap) {\n this.treemap = treeMap;\n this.tooltipSettings = this.treemap.tooltipSettings;\n this.tooltipId = this.treemap.element.id + '_TreeMapTooltip';\n this.addEventListener();\n }\n /* tslint:disable:no-string-literal */\n TreeMapTooltip.prototype.renderTooltip = function (e) {\n var pageX;\n var pageY;\n var target;\n var touchArg;\n var tootipArgs;\n if (e.type.indexOf('touch') !== -1) {\n this.isTouch = true;\n touchArg = e;\n pageX = touchArg.changedTouches[0].pageX;\n pageY = touchArg.changedTouches[0].pageY;\n target = touchArg.target;\n }\n else {\n this.isTouch = e.pointerType === 'touch';\n pageX = e.pageX;\n pageY = e.pageY;\n target = e.target;\n }\n var value;\n var targetId = target.id;\n var item = {};\n var tooltipEle;\n var location;\n var toolTipHeader;\n var toolTipData = {};\n var tooltipContent = [];\n var markerFill;\n if (targetId.indexOf('_Item_Index') > -1) {\n item = this.treemap.layout.renderItems[parseFloat(targetId.split('_')[6])];\n if (!isNullOrUndefined(item)) {\n toolTipHeader = item['name'];\n value = item['weight'];\n toolTipData = item['data'];\n markerFill = item['options']['fill'];\n if (this.treemap.enableRtl) {\n tooltipContent = [textFormatter(this.tooltipSettings.format, toolTipData, this.treemap) ||\n formatValue(value, this.treemap) + ' : ' + this.treemap.weightValuePath.toString()];\n }\n else {\n tooltipContent = [textFormatter(this.tooltipSettings.format, toolTipData, this.treemap) ||\n this.treemap.weightValuePath.toString() + ' : ' + formatValue(value, this.treemap)];\n }\n if (document.getElementById(this.tooltipId)) {\n tooltipEle = document.getElementById(this.tooltipId);\n }\n else {\n tooltipEle = createElement('div', {\n id: this.treemap.element.id + '_TreeMapTooltip',\n className: 'EJ2-TreeMap-Tooltip',\n styles: 'position: absolute;pointer-events:none;'\n });\n document.getElementById(this.treemap.element.id + '_Secondary_Element').appendChild(tooltipEle);\n }\n location = getMousePosition(pageX, pageY, this.treemap.svgObject);\n location.y = (this.tooltipSettings.template) ? location.y + 10 : location.y;\n this.tooltipSettings.textStyle.fontFamily = this.treemap.theme === 'Bootstrap4' ? 'HelveticaNeue-Medium'\n : this.tooltipSettings.textStyle.fontFamily;\n this.tooltipSettings.textStyle.color = this.treemap.themeStyle.tooltipFontColor\n || this.tooltipSettings.textStyle.color;\n this.tooltipSettings.textStyle.opacity = this.treemap.themeStyle.tooltipTextOpacity\n || this.tooltipSettings.textStyle.opacity;\n tootipArgs = {\n cancel: false, name: tooltipRendering, item: item,\n options: {\n location: location, text: tooltipContent, data: toolTipData,\n textStyle: this.tooltipSettings.textStyle, template: this.tooltipSettings.template\n },\n treemap: this.treemap,\n element: target, eventArgs: e\n };\n this.treemap.trigger(tooltipRendering, tootipArgs);\n if (!tootipArgs.cancel) {\n this.svgTooltip = new Tooltip({\n enable: true,\n header: '',\n data: tootipArgs.options['data'],\n template: tootipArgs.options['template'],\n content: tootipArgs.options['text'],\n shapes: [],\n location: tootipArgs.options['location'],\n palette: [markerFill],\n areaBounds: this.treemap.areaRect,\n textStyle: tootipArgs.options['textStyle']\n });\n this.svgTooltip.opacity = this.treemap.themeStyle.tooltipFillOpacity || this.svgTooltip.opacity;\n this.svgTooltip.appendTo(tooltipEle);\n }\n else {\n this.removeTooltip();\n }\n }\n }\n else {\n this.removeTooltip();\n }\n };\n TreeMapTooltip.prototype.mouseUpHandler = function (e) {\n this.renderTooltip(e);\n clearTimeout(this.clearTimeout);\n this.clearTimeout = setTimeout(this.removeTooltip.bind(this), 2000);\n };\n TreeMapTooltip.prototype.removeTooltip = function () {\n if (document.getElementsByClassName('EJ2-TreeMap-Tooltip').length > 0) {\n document.getElementsByClassName('EJ2-TreeMap-Tooltip')[0].remove();\n }\n };\n /**\n * To bind events for tooltip module\n */\n TreeMapTooltip.prototype.addEventListener = function () {\n if (this.treemap.isDestroyed) {\n return;\n }\n this.treemap.on(Browser.touchMoveEvent, this.renderTooltip, this);\n this.treemap.on(Browser.touchEndEvent, this.mouseUpHandler, this);\n };\n /**\n * To unbind events for tooltip module\n */\n TreeMapTooltip.prototype.removeEventListener = function () {\n if (this.treemap.isDestroyed) {\n return;\n }\n this.treemap.off(Browser.touchMoveEvent, this.renderTooltip);\n this.treemap.off(Browser.touchEndEvent, this.mouseUpHandler);\n };\n /**\n * Get module name.\n */\n TreeMapTooltip.prototype.getModuleName = function () {\n return 'treeMapTooltip';\n };\n /**\n * To destroy the tooltip.\n * @return {void}\n * @private\n */\n TreeMapTooltip.prototype.destroy = function (treeMap) {\n /**\n * Destroy method performed here\n */\n this.removeEventListener();\n };\n return TreeMapTooltip;\n}());\nexport { TreeMapTooltip };\n","import * as index from '@syncfusion/ej2-treemap';\nindex.TreeMap.Inject( index.TreeMapTooltip,index.TreeMapLegend,index.TreeMapHighlight,index.TreeMapSelection);\nexport * from '@syncfusion/ej2-treemap';\n"],"names":["createInstance","classFunction","params","arrayParam","unshift","undefined","Function","prototype","bind","apply","setImmediate","handler","unbind","num","Uint16Array","window","msCrypto","crypto","getRandomValues","secret","combineArray","messageHandler","event","source","data","length","addEventListener","postMessage","removeEventListener","getValue","nameSpace","obj","value","splits","replace","split","i","isUndefined","setValue","key","keys","start","fromObj","isNullOrUndefined","deleteObject","isObject","constructor","getEnumValue","enumObject","enumValue","merge","destination","temrObj","tempProp","_i","keys_1","Object","indexOf","Array","isArray","extend","copied","first","second","deep","result","arguments","_loop_1","arguments_1","obj1","forEach","clone","src","copy","getUniqueID","definedName","uid","debounce","eventFunction","delay","out","_this","this","args","clearTimeout","setTimeout","queryParams","array","keys_2","push","encodeURIComponent","join","isObjectArray","parser","toString","call","compareElementParent","child","parent","node","document","parentNode","throwError","message","Error","e","stack","print","element","printWindow","div","createElement","links","slice","getElementsByTagName","querySelectorAll","reference","open","appendChild","cloneNode","len","outerHTML","write","innerHTML","close","focus","interval","setInterval","ready","clearInterval","formatUnit","getInstance","component","elem","querySelector","instances","_a","inst","addInstance","instance","uniqueID","ret","tagName","properties","SVG_REG","test","createElementNS","className","id","styles","setAttribute","attrs","attributes","addClass","elements","classes","classList","getClassList","ele","_b","classList_1","contains","add","removeClass","classList_2","remove","isVisible","style","visibility","offsetWidth","prepend","fromElements","toElement","isEval","docFrag","createDocumentFragment","insertBefore","firstElementChild","executeScript","append","script","text","head","detach","removeChild","EventHandler","clearEvents","select","selector","context","selectAll","closest","el","nodeType","matches","siblings","childNodes_1","childNodes","curNode","Node","ELEMENT_NODE","getAttributeOrDefault","property","attrVal","getAttribute","setStyleAttribute","addClasses","removeClasses","msMatchesSelector","webkitMatchesSelector","getComponent","comp","getElementById","ej2_instances","getModuleName","getObject","curKey","defaultValue","type","hasOwnProperty","getObjectArray","isSetter","isFactory","curType","setProperties","propertyGetter","propertySetter","newValue","oldVal","saveChanges","complexGetter","complexSetter","complexFactoryGetter","complexFactorySetter","complexArrayGetter","defCollection","complexArraySetter","oldValueCollection","newValCollection","complexArrayFactorySetter","complexArrayFactoryGetter","Property","target","propertyDescriptor","set","get","enumerable","configurable","defineProperty","addPropertyCollection","Complex","ComplexFactory","Collection","CollectionFactory","Event","eventDescriptor","oldValue","finalContext","getParentContext","prefix","NotifyPropertyChanges","classConstructor","propertyType","propList","props","complexProps","colProps","events","propNames","complexPropNames","colPropNames","eventNames","propertyName","getBuilderProperties","builderObject","propCollections","isPropertyArray","rex","prop","childType","tempValue","_c","CreateBuilder","builderFunction","create","temp","curText","rippleEffect","rippleOptions","done","rippleModel","getRippleModel","rippleFlag","isRippleEnabled","rippleHandler","rippleUpHandler","rippleLeaveHandler","Browser","isPointer","removeAttribute","ignore","isCenterRipple","duration","offset","getBoundingClientRect","offsetX","pageX","body","scrollLeft","offsetY","pageY","scrollTop","documentElement","Math","max","abs","left","right","top","bottom","radius","sqrt","diameter","x","y","rippleElement","getComputedStyle","getPropertyValue","transform","removeRipple","eventArgs","rippleElements","opacity","getElementsByClassName","enableRipple","isRipple","setCulture","cultureName","defaultCulture","onIntlChange","notify","locale","setCurrencyCode","currencyCode","defaultCurrencyCode","loadCldr","data_1","cldrData","enableRtl","status","rightToLeft","getNumericObject","numObject","IntlBase","getDependables","mapper","dateObject","numSystem","symbPattern","pattern","getSymbolPattern","getFormatData","dateSeparator","getDateSeparator","getDefaultDateObject","mode","compile","template","helper","fnCode","evalExp","str","varCOunt","localKeys","LINES","DBL_QUOTED_STR","exp","match","cnt","matchStr","CALL_FUNCTION","rlStr","ELSEIF_STMT","WORD","trim","addNameSpace","QUOTES","IF_STMT","strs","FOR_STMT","rlStr_1","mtc","fnStr","fNameSpace","ELSE_STMT","IF_OR_FOR","addNS","ignoreList","NOT_NUMBER","templateString","compiler","engineObj","propName","HAS_SVG","HAS_ROW","setTemplateEngine","classObj","getTemplateEngine","wrapperInitialize","tag","WRAPPER","role","input","ejInstance","index","nodeName","nodeValue","class","aria-checked","getTextNode","childnode","destroy","ejInst","wrapper","checked","preRender","proxy","control","moduleName","createCheckBox","options","cssClass","rippleSpan","frameSpan","label","labelSpan","rippleMouseHandler","event_1","createEvent","initEvent","dispatchEvent","setHiddenInput","wrap","name","calculateRelativeBasedPosition","anchor","fixedElement","anchorPos","tempAnchor","offsetParent","position","offsetLeft","offsetTop","parentElement","calculatePosition","currentElement","positionX","positionY","targetValues","popupRect","fixedParent","parentDocument","ownerDocument","updatePosition","toLowerCase","setPosx","pos","setPosy","posX","posY","elementRect","getElementHCenter","getElementTop","getElementRight","getElementVCenter","getElementLeft","getElementBottom","getBodyScrollTop","getBodyScrollLeft","height","width","fit","viewPortElement","axis","X","Y","elemData","targetContainer","containerWidth","getTargetContainerWidth","getViewPortWidth","containerLeft","ContainerLeft","containerRight","ContainerRight","overLeft","overRight","containerHeight","getTargetContainerHeight","getViewPortHeight","containerTop","ContainerTop","containerBottom","ContainerBottom","overTop","overBottom","isCollide","elemOffset","yAxis","topCollideCheck","xAxis","leftCollideCheck","topSide","rightSide","leftSide","bottomSide","flip","tEdge","TL","TR","BL","BR","eEdge","updateElementData","setPosition","leftFlip","topFlip","setPopup","edge","eStatus","deepCheck","collideSide","getTargetContainerLeft","getTargetContainerTop","innerHeight","windowWidth","innerWidth","getScrollableParent","eleStyle","scrollParents","overflowRegex","parentStyle","overflow","overflowY","overflowX","getZindexPartial","parentZindex","defaultView","childrenZindex","children","isEqualNode","siblingsZindex","finalValue","concat","currentZindexValue","getMaxZindex","maxZindex","i_1","createResize","resizeStart","resizeBegin","resize","resizing","resizeEnd","resizeComplete","targetElement","getDOMElement","containerElement","boundary","directions","direction","resizeHandler","RESIZE_HANDLER","minHeight","minWidth","maxWidth","maxHeight","wireEvents","domElement","resizers","selectedHandler","onMouseDown","eventName","info","onTouchStart","getEventType","preventDefault","calculateValues","originalMouseX","originalMouseY","FOCUSED_HANDLER","onMouseMove","onMouseUp","RESTRICT_LEFT","setLeft","touchMoveEvent","touchEndEvent","originalWidth","parseFloat","originalHeight","originalX","originalY","touches","resizeTowards","elementClass","resizeSouth","resizeNorth","resizeWest","resizeEast","getClientRectValues","containerRectValues","documentHeight","clientHeight","calculateValue","currentpageY","targetRectValues","calculatedHeight","borderValue","offsetHeight","topWithoutborder","RESIZE_WITHIN_VIEWPORT","parseInt","targetTop","calculatedTop","boundaryRectValues","currentHeight","top_1","rectValues","documentWidth","clientWidth","resizeWestWidth","calculatedWidth","left_1","previousWidth","setWidth","setMinHeight","minimumHeight","removeResize","handlers","createSpinner","internalCreateElement","makeElement","container","create_spinner_container","spinTemplate","theme","getTheme","calculateRadius","setTheme","createLabel","inner_wrap","CLS_SPINTEMPLATE","replaceContent","spinCSSClass","CLS_HIDESPIN","labelEle","CLS_SPINLABEL","textContent","createMaterialSpinner","random_generator","globalTimeOut","timeOut","create_material_element","CLS_MATERIALSPIN","mat_calculate_attributes","createBootstrap4Spinner","CLS_BOOT4SPIN","startMatAnimate","globalObject","globalVariables","animateMaterial","globalInfo","timeOutVar","createFabricSpinner","create_fabric_element","CLS_FABRICSPIN","fb_calculate_attributes","createHighContrastSpinner","CLS_HIGHCONTRASTSPIN","innerContainer","CLS_SPININWRAP","svg","createBootstrapSpinner","create_bootstrap_element","boot_calculate_attributes","svgBoot","CLS_BOOTSPIN","firstChild","item","bootCircle","CLS_SPINCIRCLE","defaultRadius","startArc","defineArcPoints","circleEle","generateSeries","begin","stop","formSeries","series","end","count","increment","toFixed","animateBootstrap","circle","boot_animate","isAnimate","rotation","defaultSize","DEFT_MAT_WIDTH","DEFT_FAB_WIDTH","DEFT_BOOT4_WIDTH","DEFT_BOOT_WIDTH","previousId","random","combine","charAt","floor","innerCon","themeClass","svgFabric","fabricCirclePath","fabricCircleArc","CLS_SPINARC","cls","svgMaterial","matCirclePath","spinnerContainer","CLS_SPINWRAP","spinnerInnerContainer","spinnerInfo","createCircle","easeAnimation","easing","mat_animation","currentTime","min","Date","getTime","startTime","path","getDashOffset","strokeSize","updatePath","change","getSize","getStrokeSize","rotate","transformOrigin","drawArc","PI","current","timestamp","timecount","innerConainer","trgClass","centerX","centerY","defineCircle","defineArc","angle","radians","cos","sin","endArc","showSpinner","showHideSpinner","isHide","spinnerWrap","inner","CLS_SHOWSPIN","svgEle","hideSpinner","setSpinner","ensureTemplate","makeEle","replaceTheme","svgElement","createMask","autocomplete","autocorrect","autocapitalize","spellcheck","aria-live","aria-valuenow","mask","splitMask","splitInnerMask","j","pushIntoRegExpCollec","chkSpace","customRegExpCollec","hiddenMask","promptChar","escapeMaskValue","promptMask","customCharacters","RegExp","escapeNumber","substring","aria-invalid","applyMask","setElementValue","setMaskValue","maskInputKeyDownHandler","maskInputKeyPressHandler","maskInputKeyUpHandler","maskInputHandler","maskInputFocusHandler","maskInputBlurHandler","maskInputPasteHandler","maskInputCutHandler","maskInputDropHandler","enabled","bindClearEvent","formElement","resetFormHandler","unwireEvents","showClearButton","inputObj","clearButton","resetHandler","clear","redoCollec","startIndex","selectionStart","endIndex","selectionEnd","triggerMaskChangeEvent","setSelectionRange","initInputValue","unstrippedValue","strippedValue","maskValues","k","checkMask","maskValue","regExpCollec","focusEventArgs","maskedValue","trigger","isFocus","isDevice","version","isIos","blurEventArgs","placeholder","floatLabelType","labelElement","TOPLABEL","sIndex_1","eIndex_1","oldValue_1","_callPasteHandler","maskKeyPress","validateValue","preValue_1","sIndex_2","eIndex","undoCollec","value_1","isIE","ctrlKey","keyCode","removeMaskInputValues","addedValues","preEleVal","val","prevValue","startValue","collec","splice","mobileRemoveFunction","sIndex","autoFillMaskInputValues","isRemove","oldEventVal","isDeleted","initStartIndex","initEndIndex","curMask","multipleDel","preValue","prompt_1","elementValue","code","String","fromCharCode","isIosInvalid","prevOnChange","isProtectedOnChange","changeEventArgs","isInitial","isInteraction","isInteracted","removeMaskError","val_1","startIndex_1","isSpace","isAndroid","preventUnsupportedValues","temp_1","mobileSwipeCheck","mobileValidation","isCtrlKey","eventOldVal","allowText","prevSupport","isEqualVal","keyValue","customValArr","applySupportedValues","addMaskErrorClass","changeToLowerUpperCase","sIdx","idx","ctrl","chkSupport","timer","INPUTGROUP","FLOATINPUT","ERROR","curVal","caseCount","toUpperCase","newVal","BOTTOMLABEL","Input","maskInput","inputEle","getMaskInput","UTILMASK","regularExpressions","getVal","getUtilMaskEle","getMaskedVal","getModel","model","createButtonGroup","btnElem","nextChild","btnModel","childs","buttons","disabled","Button","getFieldValues","dataItem","fields","fieldData","isHeader","dataField","moveTo","from","to","targetIndexes","targetElements","insertElement_1","getSeriesColor","palette","getThemeColor","axisLabel","axisTitle","axisLine","majorGridLine","minorGridLine","majorTickLine","minorTickLine","chartTitle","legendLabel","background","areaBorder","errorBar","crosshairLine","crosshairFill","crosshairLabel","tooltipFill","tooltipBoldLabel","tooltipLightLabel","tooltipHeaderLine","markerShadow","selectionRectFill","selectionRectStroke","selectionCircleStroke","getScrollbarThemeColor","scrollStyle","backRect","thumb","circleHover","arrow","grip","arrowHover","backRectBorder","getTooltipThemeColor","measureText","font","htmlObject","fontSize","size","fontWeight","fontStyle","fontFamily","whiteSpace","lineHeight","Size","findDirection","rX","rY","rect","arrowLocation","arrowPadding","tipX","tipY","tipRadius","startX","startY","getElement","removeElement","drawSymbol","location","shape","url","renderer","SvgRenderer","calculateShapes","functionName","renderOption","locX","locY","rx","ry","cx","cy","d","xValue","yValue","href","textElement","color","renderOptions","fill","font-size","font-style","font-family","font-weight","text-anchor","dominant-baseline","baseLine","createText","sort","isDescending","sortData","a","b","rotateTextSize","chart","box","delayRedraw","redraw","svgObject","logBase","base","log","showTooltip","areaWidth","isTouch","tooltip","inside","range","withIn","logWithIn","valueType","withInRange","previousPoint","currentPoint","nextPoint","mX2","mX1","mX3","xStart","visibleRange","xEnd","ceil","sum","values","values_1","subArraySum","last","yName","subtractThickness","thickness","subtractRect","degreeToLocation","degree","center","radian","ChartLocation","getAccumulationLegend","r","cartesianlarge","cartesiansmall","getAngle","point","atan2","subArray","valueToCoefficient","isInversed","TransformToVisible","isInverted","labelPlacement","CoefficientToVector","valueToPolarCoefficient","primaryXAxis","startAngle","clipRect","indexFinder","isPoint","ids","Index","coefficient","delta","dateTimeInterval","visibleLabels","createTooltip","createZoomingLabels","isVertical","opposedPosition","chartRect","availableSize","scrollBarHeight","scrollbarSettings","enable","zoomingScrollBar","endLabel","startLabel","labelStyle","Rect","drawPath","PathOption","themeStyle","TextOption","withInBounds","bounds","getValueXByPoint","getValueYByPoint","findClipRect","requireInvertedAxis","firstToLowerCase","substr","getMinPointsDelta","seriesCollection","xValues","minVal","seriesMin","minDelta","Number","MAX_VALUE","visible","xAxisName","points","map","xMin","xMax","getAnimationFunction","effect","linear","endValue","markerAnimate","pointIndex","isLabel","Animation","animate","progress","timeStamp","animateRectElement","currentRect","previousRect","setStyle","pathAnimation","previousDirection","animateduration","currentDireciton","c","startDirections","splitDirections","endDirections","startPath","endPath","appendClipElement","clipPath","clipElement","redrawElement","def","createDefs","triggerLabelRender","tempInterval","argsData","cancel","axisLabelRender","isLineBreakLabels","text_1","lineBreakLabelTrim","maximumLabelWidth","textTrim","VisibleLabels","setRange","minimum","maximum","getActualDesiredIntervalsCount","orientation","desiredIntervals","desiredIntervalsCount","maximumLabels","templateAnimate","chartRenderer","shapeOption","drawElement","dir","lx","ly","xVal","yVal","calculateLegendShapes","getRectLocation","startLocation","endLocation","outerRect","minMax","getTemplateFunction","templateFn","templateComplier","createTemplate","childElement","content","templateElement","elementData","getFontStyle","measureElementRect","findlElement","length_1","getPoint","xLength","yLength","appendElement","hasChildNodes","appendChildElement","forceAnimate","isRect","existChild","animateRedrawElement","replaceChild","getDraggedRectLocation","x1","y1","x2","y2","checkBounds","getLabelText","labelFormat","customLabelFormat","seriesType","high","low","median","upperQuartile","lowerQuartile","outliers","liers","format","stopTimer","collections","some","isOverlap","containsRect","calculateRect","textSize","margin","convertToHexCode","componentToHex","g","hex","convertHexToColor","exec","ColorValue","colorNameToHex","isRGBValue","getSaturationColor","factor","colorCode","rgb","round","getMedian","half","space","stroke","labelCollection","breakLabels","stringToNumber","containerSize","setElementAttributes","isDiv","option","isMinus","tspanElement","createTSpan","calculateSize","stockChart","marginHeight","tooltipSpace","periodHeight","periodSelectorSettings","periods","labelSize","enableGrouping","disableRangeSelector","createSvg","chartObject","selectorObject","getTitle","title","titleCollection","textOverflow","textWrap","titlePositionX","titleStyle","textAlignment","currentLabel","maximumWidth","textCollection","defaultToString","validateNullOrUndefined","createScrollSvg","scrollbar","isHorizontalAxis","getSeriesFromIndex","visibleSeries","visibleSeries_1","pointByIndex","points_1","themeColors","axisLineColor","dataLabelColor","rangeBandColor","tooltipFontColor","trackerLineColor","tooltipFillOpacity","tooltipTextOpacity","labelFontFamily","sparkline","appendShape","drawCircle","calculateRoundedRectPath","topLeft","topRight","bottomLeft","bottomRight","drawRectangle","renderTextElement","textOptions","getIdElement","rangeValueToCoefficient","inversed","getXLocation","getRangeValueXByPoint","getExactData","selectedData","getNearestValue","reduce","prev","curr","getRangeThemeColor","thumbSize","navigatorStyleSettings","thumbWidth","thumbHeight","darkAxisColor","darkGridlineColor","darkBackground","gridLineColor","labelFontColor","unselectedRectColor","thumpLineColor","thumbBackground","gripColor","thumbHoverColor","selectedRegionColor","tooltipBackground","initialArray","numrows","numcols","initial","arr","columns","smithchart","maxwidth","convertElementFromLabel","labelId","templateHtml","_getEpsilonValue","SmithchartSize","reverselinear","dataLabel","toPixel","maxDimension","setStyles","border","stroke-width","appendPath","gauge","calculateSum","getAngleFromValue","maximumValue","minimumValue","endAngle","isClockWise","isCompleteAngle","getDegree","getValueFromAngle","totalAngle","getAngleFromLocation","getLocationFromAngle","GaugeLocation","getPathArc","startWidth","endWidth","startRadius","endRadius","arcRadius","getRangePath","getCirclePath","innerStart","innerEnd","clockWise","getRoundedPathArc","actualStart","actualEnd","oldStart","oldEnd","getRoundedPath","outerOldEnd","innerOldEnd","outerOldStart","innerOldStart","getCompleteArc","innerRadius","getCompletePath","getPointer","targetId","tempString","axisIndex","pointerIndex","getElementSize","elementSize","getMousePosition","pageXOffset","pageYOffset","clientTop","clientLeft","getLabelFormat","getRangeColor","ranges","currentRange","filter","rangeColor","getRangePalette","getThemeStyle","backgroundColor","titleFontColor","tooltipFillColor","labelColor","lineColor","majorTickColor","minorTickColor","pointerColor","capColor","needleColor","needleTailColor","processPathData","collection","arrayCollection","parsePathData","ob","char","command","r1","r2","largeArc","sweep","tokenizer","commands","lastIndex","isExponential","getRectanglePath","cornerRadius","point2","next","corners","corner","getPolygonPath","seg","pathSegmentCollection","x0","y0","segments","cpt2","newSeg","transformPath","sX","sY","s","bX","bY","iX","iY","scalePathData","updatedSegment","getPathString","segment","isScale","scaleFactor","oldOffset","newOffset","splitArrayCollection","getNewString","getString","string","cmd","ang","l","identityMatrix","Matrix","MatrixTypes","Identity","transformPointByMatrix","matrix","pt","multiplyPoint","transformPointsByMatrix","transformedPoints","rotateMatrix","multiplyMatrix","createRotationRadians","scaleMatrix","scaleX","scaleY","createScaling","translateMatrix","Translation","setMatrix","Unknown","Scaling","num2","m11","m22","m21","m12","matrix1","matrix2","type2","assignMatrix","mat","getBasicShape","basicShapes","getPortShape","portShapes","getDecoratorShape","decorator","pathData","decoratorShapes","getIconShape","icon","getFlowShape","flowShapes","initTooltip","diagram","tooltipOption","Tooltip","updateTooltipContent","beforeCollision","beforeOpen","opensOn","appendTo","display","collidedPosition","updateTooltip","tooltipObject","showTipPointer","animation","findConnectorPoints","layoutOrientation","intermeditatePoints","sourcePoint","sourceWrapper","getSourcePoint","terminateConnection","targetPoint","setLineEndPoint","srcPoint","sourcePortWrapper","srcPort","srcNode","getPortDirection","cornersPointsBeforeRotation","sourceID","targetWrapper","sPoint","tPoint","getIntersection","getDirection","tarPoint","sourceCorners","targetCorners","sourceNode","targetNode","sourcePort","targetPort","targetPortWrapper","srcCorner","srcDir","tarCorner","tarDir","port","tarPortPt","equals","containsPoint","topCenter","defaultOrthoConnection","checkLastSegmentasTerminal","connectToOneEnd","intermeditatePointsForStraight","findPointToPointOrtho","extra","adjustSegmentLength","getOppositeDirection","Point","orthoConnection3Segment","updateSegmentPoints","segPoint","addLineSegment","pointToPoint","portdirection","findSourceDirection","orthoConnection2Segment","pointToNode","addPoints","refPoint","findSegmentDirection","portDir","update","pointToPort","removeSegment","seg_1","checkConsectiveSegmentAsSame","lastSegment","checkSourcePointInTarget","checkPreviousSegment","checkPortdirection","returnIntermeditatePoints","pointsFromNodeToPoint","tPoints","connector","actualSegment","actualLastPoint","distancePoints","fixedPoint","nodeMargin","nodeConnectingPoint","nodeDirection","findPoint","target_1","segmentPoint","sourcePadding","addPaddingToConnector","targetPadding","isTarget","padding","paddingPort","actualSize","segmentPoints","thisSegment","getIntersectionPoints","checkSourceAndTargetIntersect","sourceSegment","createSegmentsCollection","targetSegment","srcSegment","intersect3","getPoints","createLineSegment","sPt","tPt","swapBounds","object","outerBounds","rectBounds","rotateAngle","parentTransform","middleLeft","bottomCenter","middleRight","sourceEle","targetEle","tarPort","srcCor","tarCor","srcBounds","tarBounds","isInterSect","isEmptyPoint","vector1","distance","vector2","findIntermeditatePoints","OrthogonalSegment","findOrthoSegments","BezierSegment","StraightSegment","nodeOrPortToNode","length_3","lastPoint","nodeCorners","shortes","swap","getSwapping","swapPoints","getRightToLeftSegmentCount","getRightToRightSegmentCount","getRightToTopSegmentCount","getRightToBottomSegmentCount","getBottomToTopSegmentCount","getBottomToBottomSegmentCount","getBottomToLeftSegmentCount","getLeftToLeftSegmentCount","getLeftToTopSegmentCount","getTopToTopSegmentCount","addOrthoSegments","findAngle","re","findLength","es","asin","cor","endPoint","reverse","isTar","sPt1","rotatePoint","tPt1","angle_2","angle_3","PathElement","pts","minimal","intersection","intersectSegment","isNaN","intersect","dist","segment1","segment2","a1","a2","b1","b2","c1","c2","r3","r4","denom","x3","y3","x4","y4","sameSign","diffY","NoOfSegments","One","Three","Five","sourceObj","targetObj","diffX","Two","Four","difX","segLength","tar","orthoConnection4Segment","orthoConnection5Segment","point1","allow","segmentValue","diffx","diffy","sLeft","sRight","sBottom","sTop","tLeft","tRight","tBottom","tTop","prevDir","interPt","getLeftLength","getRightLength","getTopLength","getBottomLength","getOrtho3Seg","point3","gap","preDir","closeEdge","boundsValue","one","two","three","four","fourty5","one35","two25","three15","getOuterBounds","sourceDecorator","uniteRect","targetDecorator","excludeBounds","part","isEmptyVector","getBezierPoints","getBezierBounds","startPoint","controlPoint1","controlPoint2","minx","miny","maxx","maxy","t","bezierPoints","canSelect","ShapeAnnotation","PathAnnotation","constraints","AnnotationConstraints","Select","Connector","ConnectorConstraints","NodeConstraints","canMove","Drag","Selector","canEnablePointerEvents","PointerEvents","canDelete","Delete","canBridge","Bridging","InheritBridging","DiagramConstraints","canDragSourceEnd","DragSourceEnd","canDragTargetEnd","DragTargetEnd","canDragSegmentThumb","DragSegmentThumb","canRotate","Rotate","canShadow","Shadow","canInConnect","InConnect","canPortInConnect","PortConstraints","None","canOutConnect","OutConnect","canPortOutConnect","canResize","returnValue","Resize","ResizeSouthEast","ResizeEast","ResizeNorthEast","ResizeSouth","ResizeNorth","ResizeSouthWest","ResizeWest","ResizeNorthWest","canAllowDrop","AllowDrop","canVitualize","Virtualization","canEnableToolTip","state","InheritTooltip","canSingleSelect","tool","DiagramTools","SingleSelect","canMultiSelect","MultipleSelect","canZoomPan","ZoomPan","canContinuousDraw","ContinuousDraw","canDrawOnce","DrawOnce","defaultTool","canZoom","Zoom","canPan","Pan","canUserInteract","UserInteraction","canApiInteract","ApiUpdate","canPanX","PanX","canPanY","PanY","canZoomTextEdit","ZoomTextEdit","canPageEditable","diagramActions","DiagramAction","ToolAction","enableReadOnly","annotation","ReadOnly","InheritReadOnly","canDraw","Draw","canDrag","canPreventClearSelection","PreventClearSelection","canDrawThumbs","rendererActions","RendererAction","DrawSelectorBorder","avoidDrawSelector","PreventRenderSelector","getULMClassifierShapes","classifier","enumeration","interface","Default","HideThumbs","strokeColor","strokeWidth","newObj","annotations","bold","textWrapping","verticalAlignment","horizontalAlignment","initObject","nodes","getClassNodes","getClassMembers","borderColor","member","members","addSeparator","memberText","getStyle","randomId","isSeparator","attributeText","attribute","scope","methods","argumentText","methodText","method","parameters","lineObject","newStyle","updateCanvasBounds","isBoundsUpdate","groupAction","checkParentAsContainer","protectPropertyChange","nameTable","parentId","parentWrapper","parent_1","updateLaneBoundsAfterAddChild","parent_2","shape_1","rowIndex","updateColumnWidth","columnIndex","phaseSize","updatePhaseMaxWidth","updateHeaderMaxWidth","drag","scale","updateRowHeight","updateConnectorsProperties","removeChildInContainer","undoObj","cloneObject","clearSelection","removeChildrenInLane","entry","category","undoObject","redoObject","addHistoryEntry","commandHandler","isContainer","endGroupAction","findBounds","rows","cells","createHelper","getObjectType","updateDiagramObject","renderContainerHelper","selectedObject","helperObject","selectedItems","connectors","actualObject","strokeDashArray","isChild","checkChildNodeInContainer","nodePropertyChange","isLane","measure","arrange","desiredSize","prevParentNode","swimlane","canvasId","prevParentId","lanes","lane","deleteChild","addChildToContainer","isUndo","currentSymbol","removeElements","addChild","currentParentId","UndoRedo","swimLane","isUpdateRow","isGroupAction","containerBounds","containerOuterBounds","nodeBounds","grid","startGroupAction","swimLaneMeasureAndArrange","checkPhaseOffset","checkLaneSize","considerSwimLanePadding","renderStackHighlighter","isUml","isSwimlane","adornerSvg","getAdornerLayerSvg","diagramRenderer","scroller","moveChildInStack","action","sourceParent","targetIndex","sourceIndex","undoElement","initSwimLane","row","header","hasHeader","createRow","initGridRow","initGridColumns","setDefinitions","headerDefine","phases","phaseDefine","laneCollection","addObjectToGrid","isPhase","canvas","DiagramElement","isCalculateDesiredSize","TextElement","canConsiderBounds","isLaneOrientation","refreshTextElement","columnDefinitions","addObject","indexValue","phaseIndex","rowValue","colValue","phaseObject","laneIndex","laneNode","gridCell","childWrapper","phaseCount","RowDefinition","createColumn","cols","ColumnDefinition","totalHeight","phaseHeight","phaseOffset","totalWidth","getConnectors","isRowUpdate","childNode","edges","conn","rowDefinitions","inEdges","outEdges","GridPanel","isMeasure","ChangeLaneIndex","startRowIndex","subChild","cell","arrangeChildNodesInSwimLane","rowvalue","columnValue","col","addChildToLane","k_1","updateChildOuterBounds","checkLaneChildrenOffset","findStartLaneIndex","phaseRow","phase","gridRowIndex","connectorPropertyChange","targetID","laneInterChanged","sourceLaneIndex","targetLaneIndex","updateRowIndex","columnSpan","updateColumnIndex","updateSwimLaneObject","helperWidth","helperHeight","objWidth","objHeight","findLaneIndex","laneObj","findPhaseIndex","headerNode","addLane","redoObj","orientation_1","Lane","rowDef","addRow","colDef","addColumn","changeType","addChildNodeToNewLane","addPhase","newPhase","phaseNode","previousPhase","nextPhase","laneHeaderSize","phasesCollection","orientation_2","nextCol","addPhase_1","nextRow","addPhase_2","historyManager","currentEntry","isLastPhase","addLastPhase","phaseObj","Phase","fristRow","i_2","addHorizontalPhase","nextPhaseNode","addVerticalPhase","prevPhase","prevOffset","addPhase_3","addPhase_4","addSwimlanePhases","nextCell","prevRow","prevCell","desiredCellWidth","desiredCellHeight","arrangeChildInGrid","changeCell","zIndex","swimLaneSelection","pasteSwimLane","clipboardData","cloneLane","childX","childY","ranId","nodeX","nodeY","childTable","pasteIndex","i_3","refreshDiagramLayer","gridSelection","selectorModel","isSymbolDrag","targetnode","swimLaneId","Canvas","removeLaneChildNode","swimLaneNode","currentObj","isChildNode","preventHistory","lanenode","removeDependentConnector","getGridChildren","removeSwimLane","removeNode","deleteNode","PreventHistory","removeFromAQuad","removeObjectsFromLayer","removeLane","removeChildren","removeRow","removeColumn","removePhase","phaseLength","removeHorizontalPhase","removeVerticalPhase","actualChild","prevCanvas","prevChild_1","prevNode","object_1","prevChild","laneHeader","renderOverlapElement","rulerSize","getRulerSize","overlap","createHtmlElement","renderRuler","isHorizontal","rulerGeometry","getRulerGeometry","diagramRuler","rulerSettings","horizontalRuler","verticalRuler","ruler","Ruler","segmentWidth","hRuler","vRuler","rulerObj","updateRuler","hOffset","horizontalOffset","vOffset","verticalOffset","showRulers","updateRulerDimension","removeRulerElements","viewPortHeight","viewPortWidth","removeRulerMarkers","marker","markers","drawRulerMarkers","drawRulerMarker","updateRulerDiv","updateRulerSpace","currentZoom","arrangeTick","getFunction","dataBind","marginLeft","hRulerOffset","marginTop","vRulerOffset","getUMLActivityShape","umlActivityShapes","completeRegion","region","selectedObjects","findNodeByName","findObjectType","drawingObject","setSwimLaneDefaults","setUMLActivityDefaults","flow","findNearestPoint","shortestPoint","angleBWStAndEnd","angleBWStAndRef","vaAngle","pointsForBezier","bezierPoint1","bezierPoint2","isDiagramChild","htmlLayer","hasClass","groupHasType","isPointOverConnector","intermediatePoints","toBounds","Inflate","hitPadding","intersectinPt","intersectDetails","intersectPt","rect_1","lineUtil1","lineUtil2","l1","l2","na","nb","ua","ub","intersect2","start1","end1","start2","end2","line3","getLineSegment","line","getTooltipOffset","mousePosition","inheritTooltip","objectTooltip","tooltipOffset","relativeMode","isMouseBased","offsetPoint","bound","objects","getBounds","getAnnotationPosition","getloop","getOffsetOfConnector","alignednumber","getAlignedPosition","offsetLength","prevLength","kCount","lengths","cnst","alignment","alignLabelOnSegments","vAlign","hAlign","getBezierDirection","removeChildNodes","getChild","getSwimLaneChildren","removeUnnecessaryNodes","serialize","removeNodes","clonedObject","getCustomProperty","serializationSettings","preventDefaults","JSON","stringify","defaultObject","isNodeShape","getConstructor","properties_1","preventArrayDefaults","SwimLane","every","isSameArray","Diagram","Path","Native","Html","Image","Text","BasicShape","FlowShape","BpmnShape","UmlActivityShape","UmlClassifierShape","Header","PointPort","BpmnGateway","BpmnDataObject","BpmnEvent","BpmnSubEvent","BpmnActivity","BpmnAnnotation","MethodArguments","UmlClassAttribute","UmlClassMethod","UmlClass","UmlInterface","UmlEnumerationMember","UmlEnumeration","ChildContainer","Stop","UserHandle","Command","deserialize","dataSourceSettings","doBinding","nodeTemp","setNodeTemplate","getDescription","commandManager","execute","canExecute","arrangeTickHorizontal","arrangeTickVertical","getLayoutInfo","layout","getBranch","nodeDefaults","getNodeDefaults","connectorDefaults","getConnectorDefaults","dataObj","parse","upgrade","contextMenuSettings","bridgeDirection","pageSettings","addInfo","scrollSettings","layers","basicElements","snapSettings","isLoading","views","refresh","nodes_1","ports","updateStyle","changedObject","canApplyStyle","StrokeStyle","italic","textAlign","textDecoration","updateGradient","gradient","changedGradient","targetGradient","fx","fy","stops","updateHyperlink","actualAnnotation","hyperlink","link","updateShapeContent","elementId","updateShape","oldObject","pathContent","imageContent","ImageElement","imageAlign","align","imageScale","flowShapeElement","nativeContent","DiagramNativeElement","htmlContent","DiagramHtmlElement","updateContent","newValues","nativeElement","getDiagramElement","getContent","htmlElement","flowshapedata","updateUmlActivityNode","basicShapeData","canMeasurePath","umlActivityShapeData","getUMLFinalNode","finalNodeShape","innerFinalNode","outerFinalNode","getUMLActivityShapes","umlActivityShape","removeGradient","svgId","removeItem","updateConnector","anglePoint","srcDecorator","tarDecorator","updateSegmentElement","firstSegment","clipDecorators","updateDecoratorElement","updateShapeElement","getUserHandlePosition","selectorItem","handle","pivot","side","connectorOffset","getPointloop","canResizeCorner","selectorConstraints","thumbsConstraints","SelectorConstraints","ThumbsConstraints","canShowCorner","checkPortRestriction","portVisibility","findAnnotation","annotationId","findPort","portId","getInOutConnectPorts","isInConnect","findObjectIndex","getObjectFromCollection","scaleElement","sw","sh","refObject","Container","newPosition","arrangeChild","drop","initContainer","init","insertObject","mid","diagramElement","diagramId","getPaletteSymbols","nodeId","getAnnotation","enterObject","enterTable","symbolPalette","palettes","symbols","w","h","cornerPoint","trans","findSegmentPoints","sample","sampleLength","measureElement","pathNode","getChildNode","setAttributeNS","absoluteBounds","pathLength","getTotalLength","getPointAtLength","translatePoints","translatedPts","pt1","measurePath","getBBox","svgBounds","getTextOptions","pivotX","pivotY","dashArray","shadow","description","doWrap","whiteSpaceToString","breakWord","wordBreakToString","textAlignToString","wrapSvgText","textValue","laneWidth","txtValue","bounds1","bBoxText","dy","wordWrapping","words","newText","existingWidth","existingText","eachLine","wrapSvgTextAlign","txtWidth","wrapBounds","measureHtmlText","wordBreak","measureImage","contentSize","imageElement","measureNativeContent","nativeSVG","measureNativeSvg","bBox","newPathString","getDiagramLayerSvg","elementcoll","contentId","getDomIndex","viewId","layer","postId","getNativeLayer","getHTMLLayer","getDiagramLayer","getSelectorElement","getAdornerLayer","getPortLayerSvg","getNativeLayerSvg","getGridLayerSvg","getBackgroundLayerSvg","getBackgroundImageLayer","getBackgroundLayer","getGridLayer","elementType","setAttributeHtml","createSvgElement","setAttributeSvg","parentsUntil","isID","animVal","getScrollerWidth","outer","widthNoScroll","widthWithScroll","addTouchPointer","touchList","clientX","clientY","pointerId","isHtml","compiledString","createMeasureElements","usageCount","divElement","createTextNode","tSpan","chars","additionalProp","newObject","sourceObject","customProperties","propAdditional","internalProp","getInternalProperties","cloneArray","HTMLElement","innerHtml","sourceArray","clonedArray","extendObject","childObject","extendeArray","extendArray","extendedObject","childArray","reset","middleElement","overFlow","middle","rotateSize","minX","minY","maxX","maxY","getOffset","findToolToActivate","touchStart","touchMove","hasSelection","userHandles","obj_1","paddedBounds","selectorBnds","hasSingleConnection","conn_1","sourcePaddingValue","targetPaddingValue","checkForConnectorSegment","ten","rotateThumb","labelSelection","labelRotate","checkResizeHandles","findPortToolToActivate","isSelected","checkResizeHandleForContainer","checkForResizeHandles","connectorEditingToolModule","PortVisibility","Hover","Visible","sourcePortID","currentDrawingObject","forty","firstLevel","getCursor","cursor","cursors","getBpmnShapePathData","bpmnShapes","getBpmnTriggerShapePathData","bpmnTriggerShapes","getBpmnGatewayShapePathData","bpmnGatewayShapes","getBpmnTaskShapePathData","bpmnTaskShapes","getBpmnLoopShapePathData","bpmnLoopShapes","getGraphBounds","collectionContains","coll","incrementalSearch","items","selectedIndex","ignoreCase","queryString","prevString","activeClass","listItems","strLength","innerText","Search","inputVal","searchType","itemData","queryStr","toLocaleLowerCase","itemsData","highlightSearch","query","ignoreRegex","replaceQuery","findTextNode","revertHighlightSearch","contentElement","createFloatLabel","overAllWrapper","searchWrapper","inputElement","floatLinelement","floatLabelElement","FLOATLINE","FLOATTEXT","aria-labelledby","updateFloatLabelState","LABELBOTTOM","LABELTOP","removeFloating","componentWrapper","placeholderText","placeholderElement","floatLine","setPlaceHolder","floatLabelFocus","floatLabelBlur","copyPath","file","targetPath","lastIndexOf","getPath","pathId","getPathId","matched","getParents","isId","isNOU","CLS.LIST_ITEM","parentText","CLS.LIST_TEXT","treeNodes","tree","gridFiles","files","isFile","copyNodes","treeObj","selectedNodes","activeElement","isGrid","nodeNames","removeBlur","blurEle","activeElements","getModule","addBlur","activeModule","CLS.LARGE_ICON_FOLDER","detailsviewModule","gridSelectNodes","navigationpaneModule","CLS.BLUR","hover","CLS.HOVER","CLS.ROWCELL","CLS.LARGE_ICON","getPathObject","read","events.refreshEnd","openAction","events.openEnd","getFileObject","currFiles","feFiles","feParent","copyFiles","cutNodes","fileAction","enablePaste","events.showPaste","cutFiles","fileType","filetype","CLS.ICON_IMAGE","CLS.ICON_MUSIC","CLS.ICON_VIDEO","getImageUrl","baseUrl","ajaxSettings","breadcrumbbarModule","searchObj","getSortedData","Query","sortBy","sortOrder","group","DataManager","executeLocal","getItemObject","where","createEmptyElement","operation","CLS.EMPTY","emptyDiv","emptyFolder","CLS.LARGE_EMPTY_FOLDER","emptyEle","CLS.EMPTY_CONTENT","dragFile","CLS.EMPTY_INNER_CONTENT","view","CLS.GRID_VIEW","getLocaleText","getDirectories","events.isFile","setNodeId","rootId","cwd","dirs","setDateObject","localeObj","getConstant","getCssClass","css","sortbyClickHandler","getSortField","isMobile","events.layoutChange","events.sortColumn","module","events.sortByChange","field","setNextPath","currfolders","folders","originalPath","events.finalizeEnd","events.initialEnd","newPath","openSearchFolder","fPath","events.clearPathInit","selectedNode","createAjax","showHiddenItems","readSuccess","createFolder","itemName","createSuccess","rename","itemNewName","currentItemText","renameSuccess","paste","names","pasteOperation","navigationPane","replaceItems","itemNames","CommonFiles","pasteSuccess","treeView","deleteSuccess","GetDetails","detailsSuccess","fn","dataType","contentType","onSuccess","onFailure","events.beforeRequest","Ajax","events.afterRequest","expandedId","error","fileExists","send","events.selectionChanged","dialogObj","nextElementSibling","hide","createdItem","events.createEnd","renamedItem","treePath","parentPath","renameText","events.renameEnd","fileLength","createDialog","largeiconsviewModule","duplicateItems","pasteNodes","events.pathChanged","moveNode","copyNode","events.hidePaste","events.deleteEnd","details","searchString","caseSensitive","searchSuccess","Download","selectedRecords","itemPath","downloadUrl","filterPath","form","download","forms","namedItem","submit","getOptions","Dialog","animationSettings","showCloseIcon","closeOnEscape","isModal","CLS.DIALOG_ID","changeOptions","focusInput","onFolderDialogOpen","createInput","oninput","onValidate","onkeyup","getKeyCode","onSubmit","onRenameDialogOpen","onReSubmit","onFocusRenameInput","multipleFiles","buttonModel","isPrimary","click","onDeleteSubmit","show","intl","Internationalization","formattedString","parseDate","modified","formatDate","CLS.VALUE","location_1","CLS.ERROR_CONTENT","onSubmitValidate","extDialogObj","CLS.EXTN_DIALOG_ID","delItems","deleteHandler","addInvalid","which","charCode","createImageDialog","imageUrl","image","viewerObj","enableResize","allowDragging","openImage","updateImage","resizeStop","CLS.IMG_DIALOG_ID","imgWrap","cssObj","paddingWidth","paddingRight","paddingHeight","paddingBottom","getCloneProperties","doesImplementInterface","checkFor","valueAccessor","column","DataUtil","getUpdateUsingRaf","updateFunction","callBack","requestAnimationFrame","updatecloneRow","nRows","actualRows","vRows","isDataRow","isExpand","getCollapsedRowsCount","vcRows","gLen","groupSettings","indent","gLevel","GroupGuid","childLevels","recursive","nLevel","iterateArrayOrObject","predicate","pred","iterateExtend","baseExtend","getActualProperties","templateCompiler","baseTemplateComplier","setStyleAndAttributes","customAttributes","copyAttr","literals","exclude","moved","prepareColumns","autoWidth","Column","headerText","foreignKeyValue","foreignKeyField","setCssInGridPopUp","popUp","isBottomTail","popUpSpan","targetPosition","changedTouches","getPopupLeftPosition","popup","getPosition","ChildProperty","getElementIndex","inArray","getActualPropFromColl","getUid","appendChildren","parents","calculateAggregate","customAggregate","aggregates","getScrollBarWidth","scrollWidth","divNode","cssText","getRowHeight","rowHeight","table","isComplexField","getComplexFieldID","setComplexFieldID","isEditable","isOldRow","isIdentity","isPrimaryKey","allowEditing","isActionPrevent","dlg","editSettings","showConfirmDialog","setFormatter","serviceLocator","fmtr","getService","getFormatFunction","skeleton","setParser","getParserFunction","addRemoveActiveClasses","distinctStringValues","res","getFilterMenuPostion","elementVisible","newpos","dlgWidth","leftPos","getZIndexCalcualtion","toogleCheckbox","span","createCboxWithWrap","removeAddCboxClasses","refreshForeignData","getForeignData","foreignKeyData","isForeignKey","lValue","fField","fdata","dataSource","json","columnData","getDay","getDatePredicate","operator","matchCase","getColumnByForeignKeyValue","filterObject","datePredicate","prevDate","nextDate","prevObj","nextObj","setSeconds","getSeconds","setHours","predicateSt","Predicate","predicateEnd","and","or","ejpredicate","renderMovable","frzCols","mEle","childElementCount","isGroupAdaptive","enableVirtualization","isVirtualAdaptive","getCustomDateFormat","colType","getDatePattern","getExpandedState","gObj","hierarchyPrintMode","rows_1","getRowsObject","isDetailRow","allowPaging","printMode","currentPage","pageSize","gridModel","getPrintGridModel","childGrid","printGridModel","Print","printGridProp","expandedRows","extendObjWithFn","getPrototypeOf","getPrototypesOfObj","cln","cpy","measureColumnDepth","depth","checkDepth","indices","setStateAndProperties","summaryIterator","callback","dateanddatetimerender","rtl","isInline","rowData","requestType","isScheduledTask","ganttProp","startDate","endDate","getSwapKey","isRemoteData","adaptor","ODataAdaptor","WebApiAdaptor","WebMethodAdaptor","CacheAdaptor","UrlAdaptor","getTaskData","records","taskData","formatString","regx","getIndex","key1","key2","findParentRecords","datas","getExpandStatus","record","childParent","parentRecord","parentItem","getParentData","initialRender","expandStateMapping","expanded","findChildrenRecords","hasChildRecords","childRecords","isOffline","objArr","getPlainData","level","requireFilter","editAction","isSelfReference","addRowIndex","columnName","getPrimaryKeyFieldNames","treeData","modifiedData","originalData","isSkip","getCurrentViewRecords","addAct","addAction","newRowPosition","parentIdMapping","idMapping","childMapping","updateParentRow","currentData_1","parentData","flatData","p","removeChildRecords","currentViewRecords","isChildAll","currentRecords","setRowData","getRowByIndex","renderModule","cellRender","treeColumnIndex","getColumns","getLocale","self","localeItems","subCommand","updateDropDownLocale","alignmentItems","alignmentLocale","imageDisplayItems","displayLocale","tableRowsItems","tableRowLocale","tableColumnsItems","tableColumnLocale","TableCellVerticalAlignItems","tableVerticalLocale","TableStyleItems","tableStyleLocale","getDropDownValue","returnType","iconCss","isIDevice","iosDevices","navigator","platform","getFormattedFontSize","isIFrame","getTooltipText","i10n","itemLocale","toolsLocale","setToolbarStatus","isPopToolbar","dropDown","dropDownModule","tbItems","itemStr","tbElements","classes.CLS_ACTIVE","toolbarSettings","formatDropDown","isDestroyed","formatItems","types","formatContent","default","alignDropDown","model.alignmentItems","fontNameDropDown","fontNameItems","fontNameContent","name_1","fontSizeDropDown","fontSizeItems","fontSizeContent","getCollection","getTBarItemsIndex","toolbarItems","itemsIndex","updateUndoRedoStatus","baseToolbar","undoRedoStatus","trgItems","undoRedoItems","toolbarObj","classes.CLS_TB_ITEM","enableItems","evt","parseHtml","tempNode","DocumentFragment","createRange","createContextualFragment","getTextNodesUnder","docElement","nextSibling","toObjectLowerCase","convertedValue","setAttributes","htmlAttributes","rte","isFrame","contentModule","getDocument","htmlAttr","setEnable","readonly","setReadOnly","valueContainer","heatMapTitle","cellBorder","cellTextColor","toggledColor","emptyCellColor","leftPadding","rightPadding","titlePositionY","heatmapSize","topPadding","bottomPadding","textNone","heatmap","initialClipRect","titleSettings","increaseDateTimeInterval","intervalType","setFullYear","getFullYear","setMonth","getMonth","setDate","getDate","getHours","setMinutes","getMinutes","tooltipCollection","xPosition","yPosition","RgbColor","R","G","B","formatValue","isCustom","formatFun","parseValue","date","getCompValue","convertPixelToValue","pointerElement","pointerRect","lineBounds","newSize","divideVal","getPathToRect","tempDiv","svgRect","isPointerDrag","axes","pointerEnable","pointers","pointer","enableDrag","textFormatter","getNumberFormat","useGrouping","useGroupingSeparator","formatFunction","getElementOffset","calculateNiceInterval","currentInterval","niceInterval","minInterval","pow","intervalDivs_1","interior","placement","getBox","boxName","rectWidth","rectHeight","bottomRadius","topRadius","addValue","y1_1","locHeight","x1_1","locWidth","containerBackground","maps","MapLocation","degreesToRadians","deg","radiansToDegrees","convertGeoToPoint","latitude","longitude","mapModel","lat","lng","mapSize","mapAreaRect","longitudeMinMax","baseMapBounds","latitudeMinMax","latRadian","lngRadian","projectionType","geometryType","pixelOrigin","sinY","calculateBound","aitoff","tan","Infinity","roundTo","xToCoordinate","yToCoordinate","convertTileLatLongToPoint","zoomLevel","tileTranslatePoint","isMapCoordinates","sinLatitude","pixelX","pixelY","mapObject","totalSize","baseSize","cosy","sincia","sinci","acos","measureObject","convertElement","markerId","mapObj","drawPolygon","drawPolyline","drawLine","markerEle","tempGroup","drawBalloon","drawDiamond","drawTriangle","drawCross","drawHorizontalLine","drawVerticalLine","drawStar","balloon","createGroup","drawPattern","createPattern","elements_1","getFieldData","newData","dataSource_1","fields_1","checkShapeDataFields","dataPath","propertyPath","shapePath","checkPropertyPath","shapeData","shapePropertyPath","pointObject","findMidPointOfPolygon","startX1","startY1","xSum","ySum","rightMinPoint","rightMaxPoint","leftMinPoint","leftMaxPoint","bottomMinPoint","bottomMaxPoint","topMinPoint","topMaxPoint","rightMin","rightMax","leftMin","leftMax","topMax","topMin","bottomMax","bottomMin","isCustomPath","layerData","customPath","findPosition","getTranslate","zoomFactor","zoomSettings","baseMapRectBounds","mapWidth","mapHeight","centerPosition","leftPosition","topPosition","mapLayerPanel","calculateFactor","getElementByID","Internalize","getShapeData","layerIndex","shapeIndex","shapeDataPath","triggerShapeEvent","selection","elementSelector","getTargetElement","createStyle","customizeStyle","elementAnimate","animationComplete","timeout","areaHeight","demo","size1","wordWrap","renderLegendShape","renderPath","shapeWidth","shapeHeight","shapeX","shapeY","changeBorderWidth","changeNavaigationLineWidth","currentStroke","layersCollection","shapeSettings","m","navigationLineSettings","targetTouches","calculateScale","startTouches","endTouches","startDistance","getDistance","getTouches","posTop","posLeft","touch","getTouchCenter","zoomAnimate","previousLocation","preScale","previousScale","diffScale","currentLocation","currentScale","slopeFactor","slope","slopeIntersection","slopeValue","intercept","horizontalDifference","verticalDifference","translatePoint","zoomModule","processTemplate","process","clearAnimation","startAnimation","cancelAnimationFrame","smoothTranslate","getShapeColor","areaBackgroundColor","subTitleFontColor","legendTitleFontColor","legendTextColor","dataLabelFontColor","zoomFillColor","titleFontSize","legendFontSize","getElementHeightFromClass","getOuterHeight","getTranslateY","WebKitCSSMatrix","webkitTransform","m42","getWeekFirstDate","date1","firstDayOfWeek","firstDateOfMonth","lastDateOfMonth","dt","getWeekNumber","currentDate","valueOf","MS_PER_DAY","setTime","time","tzOffsetBefore","getTimezoneOffset","tzOffsetDiff","MS_PER_MINUTE","resetTime","getDateInMs","addDays","addMonths","day","getMaxDays","addYears","getStartEndHours","startHour","endHour","date2","getDaysCount","strTime","getDateFromString","findIndexInData","marginBottom","generateSummary","rule","localeObject","calendarType","cldrObj","cldrObj1","ruleObject","extractObjectFromRule","summary","EVERY","calendarMode","freq","DAYS","WEEKS","ON","DAYINDEXOBJECT","MONTHS","getMonthSummary","YEARS","month","TIMES","until","tempDate","UNTIL","monthDay","WEEKPOS","generate","excludeDate","startDayOfWeek","maximumCount","viewDate","MAXOCCURRENCE","cacheDate","calendarUtil","getCalendarUtil","modifiedDate","tempViewDate","maxOccurrence","setFirstDayOfWeek","DAYINDEX","tempExcludeDate","parsedDate","getDateFromRecurrenceDateString","dailyType","weeklyType","monthlyType","yearlyType","recDateString","excludeDateHandler","zeroIndex","expectedCount","expectedDays","compareDates","validateRules","wkstIndex","weekState","weekCollection","wkst","dayIndex","startDateDiff","weekendDate","compareTempDate","insertDataCollection","getStartDateForWeek","validateMonthlyRuleType","monthlyDayTypeProcessforMonthFreq","monthlyDayTypeProcess","monthlyDateTypeProcessforMonthFreq","monthlyDateTypeProcess","checkYearlyType","processWeekNo","processYearDay","firstWeekSpan","weekNo","maxDate","minDate","stDate","getYearLastDate","weekNos","insertDateCollection","insertDatasIntoExistingCollection","dateCollection","yearDay","getLeapYearDaysCount","isLeapYear","getYearDaysCount","initializeRecRuleVariables","ruleData","monthCollection","mainDate","monthInit","currentMonthDate","getMonthStartDate","isSameYear","checkMonth","setValidDate","processDateCollectionForByMonthDay","beginDate","setNextValidDate","isLastMonth","recRuleVariables","isByMonth","getMonthDaysCount","validateProperDate","monthData","getMonthCollection","dates","HASNUMBER","expectedDaysArray","SPLITNUMBERANDSTRING","isSameMonth","filterDateCollectionByIndex","insertDateCollectionBasedonBySetPos","dayCycleData","processWeekDays","initialDate","week","insertDateCollectionBasedonIndex","isHavingNumber","processDateCollectionforByDayWithInteger","compareMonth","newstr","getDayString","getRecurrenceCollection","recurrenceCollectionObject","expectedDaysArrays","arrPosition","getDateCollectionforBySetPosNull","recurrenceCollections","dayData","chDate","REMOVENUMBERINSTRING","checkDayIndex","sortedExpectedDays","expectedDaysNumberSplit","expectedDaysArr","rules","validRules","splitData","dayCycle","checkDate","expectedDate","shift","checkYear","expectedyearDay","getYearDay","startDateCollection","diff","days","expectedMonth","getExpectedDays","Islamic","Gregorian","getRecurrenceStringFromDate","getUTCFullYear","roundDateValues","getUTCMonth","getUTCDate","getUTCHours","getUTCMinutes","getUTCSeconds","Location","createTextStyle","connectorText","search","drillLevelText","z","drillText","itemsToOrder","isContainsData","pathName","processData","treemap","isExist","leaf","leafItemSettings","levels","groupPath","labelPath","weightValuePath","findChildren","findHightLightItems","treeMap","parentName","currentItem","renderItems","findLabelLocation","areaRect","enableDrillDown","renderDirection","getArea","getShortestEdge","convertToContainer","convertToRect","xOffset","yOffset","colorMap","colorMapping","equalValue","paths","isEqualColor","dataValue","colorCollections","minOpacity","maxOpacity","deSaturationColor","rangeValue","getColorByValue","rgbToHex","rbg","getGradientColor","previousOffset","nextOffset","percent","full","previousColor","nextColor","splitColorValueOffset","splitColor","getPercentageColor","previous","prevColor","getPercentage","resultText","currentLength","totalLength","sliceString","orderByArea","removeClassNames","applyOptions","svgRenderer","isParentItem","removeShape","setColor","removeLegend","dataCount","borderWidth","removeSelectionWithHighlight","getLegendIndex","dataLength","treeMapLegendModule","legendCollections","pushCollection","number","legendElement","shapeElement","legendCollection","legendEle","oldFill","oldOpacity","oldBorderColor","oldBorderWidth","shapeOldFill","shapeOldOpacity","shapeOldBorderColor","shapeOldBorderWidth","legendTitleColor","headerRegex","defaultType","async","emitError","Promise","resolve","reject","httpRequest","XMLHttpRequest","onreadystatechange","stateChange","onLoad","onload","onProgress","onprogress","onAbort","onabort","onError","onerror","onUploadProgress","upload","setRequestHeader","beforeSend","successHandler","failureHandler","reason","responseText","readyState","statusText","getResponseHeader","responseHeaders","headers","getAllResponseHeaders","addOrGetEventData","__eventList","listener","bindTo","intDebounce","debounceListener","eventData","copyData","eventProp","eventData_1","Observer","ranArray","boundedEvents","on","cntxt","notExist","isHandlerPresent","off","curObject","indexLocation","argument","curObject_1","cur","boundedEvents_1","isColEName","Base","changedProperties","oldProperties","refreshing","finalUpdate","childChangedProperties","modelObserver","muteOnChange","prevDetection","callChildDataBind","clearChanges","getOwnPropertyNames","newChanges","oldChanges","onPropertyChanged","moduleClass","REGX_MOBILE","REGX_IE","REGX_IE11","REGX_IOS","REGX_IOS7","REGX_ANDROID","REGX_WINDOWS","REGX_VERSION","REGX_BROWSER","OPERA","EDGE","CHROME","PANTHOMEJS","SAFARI","WEBKIT","MSIE","MOZILLA","browserDetails","extractBrowserDetail","browserInfo","culture","clientInfo","userAgent","language","getEvent","move","getTouchStartEvent","getTouchEndEvent","getTouchMoveEvent","getTouchCancelEvent","regX","uA","isMSPointer","isWebView","cordova","PhoneGap","phonegap","forge","touchStartEvent","touchCancelEvent","__extends","extendStatics","setPrototypeOf","__proto__","__","__decorate","decorators","desc","getOwnPropertyDescriptor","Reflect","decorate","_super","ease","easeIn","easeOut","easeInOut","elasticInOut","elasticIn","elasticOut","Animation_1","element_1","delayAnimation","animationId","frameId","applyAnimation","step","timerId","prevTimeStamp","avg","timingFunction","performance","now","fail","newProp","oldProp","MODULE_SUFFIX","ModuleLoader","loadedModules","inject","requiredModules","moduleList","reqLength","clearUnusedModule","modl","moduleList_1","modName","isModuleLoaded","moduleObject","memberName","getMemberName","isProperty","loadedModule","clean","modules","usedModules","arg","removableModule_1","mod","parentObj","controlParent","isParentArray","updateChange","updateTimeOut","changeTime_1","curIndex","defaultNumberingSystem","latn","_digits","_type","defaultNumberSymbols","decimal","percentSign","plusSign","minusSign","infinity","nan","exponential","latnNumberSystem","ParserBase","getMainObject","cName","getNumberingSystem","numberingSystems","reverseObject","propKeys_1","getSymbolRegex","regexStr","getSymbolMatch","matchKeys_1","constructRegex","convertValueParts","regex","getDefaultNumberingSystem","nSystem","getCurrentNumericOptions","curObj","numberSystem","needSymbols","digits","numericPair","numberParseRegex","numericRegex","symbolNumberSystem","symbolMatch","getNumberMapper","isNumber","numberSymbols","timeSeparator","latnNumberSystem_1","nPair","nRegex","errorText","ms","ls","mf","lf","NumberFormat","numberFormatter","cldr","symbolPattern","fOptions","cOptions","dOptions","dependable","numberMapper","parserObject","currencySymbol","getCurrencySymbol","numericObject","currency","percentSymbol","minusSymbol","formatRegex","customFormat","getProperNumericSkeleton","isCurrency","isPercent","isAccount","groupOne","checkValueRange","maximumSignificantDigits","minimumSignificantDigits","maximumFractionDigits","minimumFractionDigits","fractionDigits","defaultCurrency","nData","pData","groupSeparator","groupData","getGroupingDetails","minimumFraction","mval","maximumFraction","mfrac","lfrac","isFinite","intNumberFormatter","negativeDataRegex","pattern_1","primary","secondary","val1","val2","checkbothExist","isFraction","decide","dint","str1","str2","checkRange","curData","zeroData","fValue","processSignificantDigits","processFraction","minimumIntegerDigits","processMinimumIntegers","toExponential","groupNumbers","latnParseRegex","nlead","nend","toPrecision","level1","sep","decimalSymbol","level2","flag","lead","getResultantPattern","isIslamic","resPattern","iType","basicPatterns","dPattern","tPattern","calendartype","patternMatcher","needFraction","cSymbol","fractionOnly","customRegex","changeCurrencySymbol","groupPattern","fraction","fmatch","fractionRegex","sym","isCurrencyPercent","parts","actual","symbol","loc","typeMapper","patternRegex","patternMatch","M","L","H","'"," a","yy","EEEE","E","defaultFirstDay","islamicRegex","firstDayMapper","sun","mon","tue","wed","thu","fri","sat","currencyFormatRegex","curWithoutNumberRegex","$","%","-","0","1","dateParseRegex","calendars","gregorian","months","stand-alone","abbreviated","2","3","4","5","6","7","8","9","10","11","12","narrow","wide","short","dayPeriods","am","pm","eras","eraNames","0-alt-variant","1-alt-variant","eraAbbr","eraNarrow","dateFormats","long","medium","timeFormats","dateTimeFormats","availableFormats","Ed","Ehm","EHm","Ehms","EHms","Gy","GyMMM","GyMMMd","GyMMMEd","hm","Hm","hms","Hms","hmsv","Hmsv","hmv","Hmv","Md","MEd","MMM","MMMd","MMMEd","MMMMd","yM","yMd","yMEd","yMMM","yMMMd","yMMMEd","yMMMM","islamic","yyyy","yyyyM","yyyyMd","yyyyMEd","yyyyMMM","yyyyMMMd","yyyyMMMEd","yyyyMMMM","yyyyQQQ","yyyyQQQQ","timeZoneNames","hourFormat","gmtFormat","gmtZeroFormat","numbers","currencies","USD","displayName","symbol-alt-narrow","EUR","GBP","minimumGroupingDigits","symbols-numberSystem-latn","list","superscriptingExponent","perMille","decimalFormats-numberSystem-latn","standard","percentFormats-numberSystem-latn","currencyFormats-numberSystem-latn","accounting","scientificFormats-numberSystem-latn","monthIndex","C","P","N","A","formatSplit","integerPart","fractionPart","customNumberFormat","dateObj","getActualDateTimeFormat","isExcelFormat","calendar","actualPattern","tLength","timeZonePattern","options_1","timeZone","numMapper","timezone","DateFormat","getTimeZoneValue","getActualNumberFormat","minFrac","parseOptions","custom","curMatch","curCode","hasNegativePattern","minDigits","maxDigits","fractionDigitsPattern","integer","minimumIntegerPattern","no","groupingPattern","cPattern","getWeekData","firstDay","iCulture","HijriParser","dateCorrection","getHijriDate","gDate","year","tMonth","tYear","yPrefix","julilanOffset","julianNumber","tempMonth","modifiedJulianDate","cyc","iy","im","tempDay","iln","ii","hYear","hmonth","hDate","toGregorian","julianDate","gDay","gMonth","gYear","abbreviateRegexGlobal","standalone","weekdayKey","timeSetter","datePartMatcher","Z","dateFormat","formatOptions","dateSeperator","patternMatch_1","weekday","designator","eText","era","intDateFormatter","dObject","getCurrentDateValue","matches_1","curval","processNumber","curstr","desig","dec","retu","checkTwodigitNumber","tVal","curPattern","ishour","latnRegex","minute","hour","DateParser","dateParser","hourOnly","numOptions","regexString","evalposition","gmtCorrection","zCorrectTemp","isgmtTraversed","nRegx","canUpdate","charKey","optional","weekObject","hour12","tzone","hpattern","parseTimeZoneRegx","parserRegex","parsedDateParts","internalDateParse","dobj","tDate","ystrig","is2DigitYear","getDateObject","setMilliseconds","tKeys_1","tValue","pDate","lDate","lastDay","tzValue","retOptions","props_1","matchString","internalNumberParser","tmatch","getZoneValue","tZone","splitStr","cRegex","ival","parseRegex","groupRegex","NumberParser","numberParser","symbolRegex","symbolpattern","getParsedNumber","isNegative","NaN","exponent","getDateFormat","getCulture","getDateParser","getNumberParser","formatNumber","parseNumber","getNumberPattern","getFirstDayOfWeek","componentCount","lastPageID","lastHistoryLen","Component","needsID","moduleLoader","localObserver","detectFunction","enablePersistence","setPersistData","injectModules","render","mergePersistData","event_2","getInjectedModules","injectedModules","Inject","localStorage","getItem","setItem","getPersistData","clearTemplate","templateName","isHistoryChanged","pageID","history","hash","charCodeAt","addOnPersist","persistObj","objValue","ignoreOnPersist","iterateJsonProperties","newList","this_1","defaultPosition","Position","Draggable","dragLimit","Draggable_1","getDefaultPosition","prevLeft","prevTop","dragProcessStarted","tapHoldTimer","externalInitialize","droppables","toggleEvents","isUnWire","enableTapHold","mobileInitialize","initialize","currentTarget","removeTapholdTimer","tapHoldThreshold","curTarget","abort","intCoord","getCoordinates","initialPosition","relativeXPosition","relativeYPosition","intDragStart","intDestroy","isChangeTouch","intCordinate","styleProp","marginRight","dragTarget","intClosest","calculateParentPosition","getHelperElement","dragTargetElement","helperElement","parentClientRect","dragStart","getProperTargetElement","dragArea","setDragArea","enableTailMode","posValue","getProcessedPositionValue","getDragPosition","intDrag","intDragStop","setGlobalDroppables","elementInViewport","queryPositionInfo","docHeight","getDocumentWidthHeight","docWidth","eleObj","checkTargetElement","dragData","intOver","hoverObject","intOut","pagex","pagey","dLeft","dTop","skipDistanceCheck","scrollX","scrollY","iTop","iLeft","dragValue","enableAutoScroll","scrollIntoView","docBody","docEle","dragStop","dragStopCalled","intDrop","eleWidthBound","eleHeightBound","elementArea","tborder","tpadding","lowerKey","prevStyle","elementFromPoint","cursorAt","sender","draggable","draggedElement","dropIns","getDropInstance","eleInst","eleInst_1","Droppable","mouseOver","area","accept","isDrag","isDropArea","canDrop","droppedElement","coord","backspace","tab","enter","alt","pause","capslock","escape","pageup","pagedown","home","leftarrow","uparrow","rightarrow","downarrow","insert","delete","f1","f2","f3","f4","f5","f6","f7","f8","f9","f10","f11","f12","semicolon","plus","comma","minus","dot","forwardslash","graveaccent","openbracket","backslash","closebracket","singlequote","KeyboardEvents","keyPressHandler","isAltKey","altKey","isShiftKey","shiftKey","curkeyCode","keyConfigs","configCollection_1","rconfig","rKeyObj","KeyboardEvents_1","getKeyConfigData","keyAction","config","configCache","keyData","keyVal","L10n","controlName","localeStrings","setLocale","intLocale","intGetControlConstant","currentLocale","load","SwipeSettings","swipeRegex","Touch","touchAction","tapCount","startEvent","isTouchMoved","movedDirection","lastMovedPoint","startEventData","hScrollLocked","vScrollLocked","tStampStart","timeOutTapHold","tapHoldEvent","moveEvent","endEvent","cancelEvent","movedPoint","eScrollArgs","calcScrollPoints","startEvents","originalEvent","distanceX","distanceY","scrollDirection","velocity","getVelocity","timeOutTap","swipeFn","tap","tapThreshold","modeclear","calcPoints","swipeArgs","swipeDirection","eSwipeArgs","tDistance","swipeSettings","swipeThresholdDistance","defaultArgs","canTrigger","scrollBool","isScrollable","checkSwipe","modeClear","lastTapTime","eTapArgs","pnt","newX","newY","newT","xDist","yDist","Engine","cssClassName","RTL","BUTTON","PRIMARY","ICONBTN","setIconCss","controlStatus","removeRippleEffect","iconPosition","isToggle","btnClickHandler","unWireEvents","CHECK","DISABLED","FRAME","INDETERMINATE","LABEL","RIPPLE","RIPPLECHECK","RIPPLEINDETERMINATE","CheckBox","isFocused","isMouseClick","changeState","ariaState","getWrapper","indeterminate","clickHandler","focusOutHandler","focusHandler","initialCheckedValue","setDisabled","initWrapper","for","labelPosition","setText","keyUpHandler","labelMouseHandler","labelWrap","changeHandler","stopPropagation","formResetHandler","RadioButton","isKeyPressed","RadioButton_1","radioGrp","angularValue","radioWrap","getLabel","keyDownHandler","labelRippleHandler","mouseDownHandler","formControlName","textLabel","rippleLabel","RIPPLE_CHECK","ACTIVE","Switch","bar","initialSwitchCheckedValue","onLabel","offLabel","setLabel","switchInner","rippleTouchHandler","eventType","onText","offText","switchFocusHandler","switchMouseUp","toggle","delegateMouseUpHandler","delegateKeyDownHandler","classNames","chipSet","chip","avatar","deleteIcon","multiSelection","singleSelection","active","chipWrapper","iconWrapper","focused","ChipList","chips","createChip","setRtl","wireEvent","selectedChips","rippleFunctin","chipCreation","tabIndex","chipListArray","fieldsData","chipArray","elementCreation","avatarIconCss","avatarText","leadingIconCss","aria-label","aria-selected","chipEnabled","trailingIconCss","chipAvatarElement","chipIconElement","chipTextElement","enableDelete","chipdeleteElement","find","chipData","chipElement","chipsData","selectionHandler","chipElements_1","chipCollection_1","getSelectedChips","slectedChips","selectedItems_1","texts","Indexes","selectedItem","unWireEvent","keyHandler","focusInHandler","focusedElement","del","deletedItemArgs","selected","selectedItemArgs","clickedItemArgs","removeMultipleAttributes","attr","Chip","OTHERMONTH","OTHERDECADE","ROOT","DEVICE","HEADER","CONTENT","YEAR","MONTH","DECADE","ICON","PREVICON","NEXTICON","PREVSPAN","NEXTSPAN","ICONCONTAINER","OVERLAY","WEEKEND","WEEKNUMBER","SELECTED","FOCUSEDDATE","OTHERMONTHROW","TODAY","TITLE","LINK","CELL","WEEKHEADER","ZOOMIN","FOOTER","BTN","FLAT","CSS","dayMilliSeconds","minutesMilliSeconds","CalendarBase","controlUp","controlDown","moveDown","moveUp","moveLeft","moveRight","pageUp","pageDown","shiftPageUp","shiftPageDown","controlHome","controlEnd","altUpArrow","spacebar","altRightArrow","altLeftArrow","calendarEleCopy","globalize","todayDisabled","todayDate","data-role","hasAttribute","calendarElement","createHeader","createContent","validateDate","checkDateValue","checkValue","minMaxUpdate","headerElement","iconContainer","previousIcon","aria-disabled","nextIcon","headerTitleElement","aria-atomic","aria-activedescendant","createContentHeader","createContentBody","showTodayButton","createContentFooter","getCultureValues","culShortNames","getCultureObjects","shortNames","html","tableHeadElement","weekNumber","shiftArray","renderYears","renderDecades","renderMonths","updateFooter","todayElement","l10","today","footer","todayButtonClick","navigateTitle","keyboardModule","keyActionHandle","currentView","getViewNumber","navigateTo","selectedDate","focusedDate","tableBodyElement","depthValue","levelRestrict","KeyboardNavigate","selectDate","contentClick","isMonthYearRange","addDay","isMinMaxRange","navigatePreviousHandler","navigatePrevious","navigateNextHandler","navigateNext","navigateHandler","triggerNavigate","minMaxDate","localDate","tdEles","numCells","renderDays","islamicModule","islamicRenderDays","renderTemplate","islamicRenderTemplate","currentMonth","titleUpdate","getMilliseconds","setStartDate","weekEle","weekAnchor","getWeek","dateFormatOptions","tdEle","dayCell","dayLink","renderDayCellArgs","isDisabled","isOutOfRange","renderDayCellEvent","otherMnthBool","disabledCls","getDateVal","updateFocus","otherMonth","tableElement","removeTableHeadElement","valueUtil","curDate","yr","curYrs","minYr","minMonth","maxYr","maxMonth","localMonth","localYr","startYr","endYr","startFullYr","endFullYr","startHdrYr","endHdrYr","startYear","rowIterator","lastDate","timeOffset","findLastDay","classNm","trEle","otherMonthCell","iconHandler","islamicIconHandler","setAriaActiveDescendant","clickEventEmitter","eve","getIdValue","islamicDate","getIslamicDate","switchView","validateValues","checkView","copyValues","skipIndex","tempValueString","minFormatOption","minString","maxFormatOption","maxString","setValueUpdate","dayFormatOptions","monthFormatOptions","setActiveDescendant","focusedEle","selectedEle","previousIconHandler","nextIconHandler","compareYear","compareDecade","stringVal","islamicPrevious","islamicNext","ld","tzOffset","dateString","setDateDecade","setDateYear","checkPresentDate","tempElement","selectedElement","previousValue","checkPrevious","navigatedEvent","navigatedArgs","compare","modifier","findNextTD","tmpDate","inValue","toUTCString","Calendar","isMultiSelection","tempValues","limit","copyDate","previousValues","changedArgs","triggerChange","previousDate","tempDays","islamicRenderYears","islamicRenderDecade","storeView","addDate","tempDates","removeDate","changeEvent","minDecade","maxDecade","calendarInstance","islamicTitleUpdate","islamicInValue","gregorianObject","islamicDayCell","prevMonthCompare","islamicCompareMonth","nextMonthCompare","prevYearCompare","hijriCompareYear","nextYearCompare","prevDecadeCompare","hijriCompareDecade","nextDecadeCompare","islamicDate_1","rowCount","islamicDate_2","hijriStart","hijriEnd","islamicCompare","PositionData","CLASSNAMES","OPEN","CLOSE","Popup","setEnableRtl","refreshPosition","setContent","actionOnScroll","wireScrollEvents","unwireScrollEvents","orientationOnChange","getRelateToElement","scrollRefresh","relateToElement","relateTo","targetVisible","isElementOnViewport","targetInvisibleStatus","scrollElement","parent_3","isElementVisible","checkGetBoundingClientRect","win","windowView","outerWidth","outerHeight","parent_4","reposition","collision","checkFixedParent","checkCollision","parentDisplay","getAnchorPosition","anchorEle","eleRect","anchorRect","targetType","callFlip","param","callFit","viewPortRect","horz","vert","animationOptions","relativeElement","zIndexElement","showAnimation","hideAnimation","ButtonProps","AnimationSettings","DLG_HEADER_CONTENT","DLG_HEADER","DLG_FOOTER_CONTENT","MODAL_DLG","DLG_CONTENT","DLG_CLOSE_ICON","DLG_OVERLAY","DLG_CONTAINER","SCROLL_DISABLED","DLG_PRIMARY_BUTTON","POPUP_ROOT","FULLSCREEN","DLG_CLOSE_ICON_BTN","DLG_HIDE","DLG_SHOW","DLG_UTIL_DEFAULT_TITLE","DLG_UTIL_ROOT","DLG_UTIL_ALERT","DLG_UTIL_CONFIRM","DLG_RESIZABLE","DLG_RESTRICT_LEFT_VALUE","DLG_RESTRICT_WIDTH_VALUE","initRender","setResize","getMinHeight","headerContent","allowMaxHeight","classArray","clonedEle","closeIconClickEventHandler","dlgOverlayClickEventHandler","l10n","checkPositionData","isNumberValue","computedHeaderHeight","computedFooterHeight","onResizeStart","onResizing","onResizeComplete","computedHeight","computedWidth","keyDown","buttonObj","btnObj","focusableElements","isTagName","isContentEdit","primaryButtonEle","buttonIndex_1","setCSSClass","setMaxHeight","setzIndex","calculatezIndex","setTargetContent","setHeader","renderCloseIcon","footerTemplate","setButton","setFooterTemplate","setAllowDragging","aria-modal","setIsModal","dlgContainer","popupObj","focusContent","dlgOverlay","unBindEvent","closeArgs","blur","storeActiveElement","positionChange","setEnableRTL","setOverlayZindex","zIndexValue","setPopupPosition","handleContent","dragObj","buttonContent","buttonType","btn","ftrTemplateContent","aria-describedby","contentEle","innerContentElement","setTemplate","isContent","headerEle","createHeaderContent","closeIcon","closeIconBtnObj","closeIconTitle","oldCSSClass","getValidFocusNode","u","disableElement","getAutoFocusNode","validNode","elementMatch","Element","bindEvent","updateIsModal","buttonCount","setPopupZindex","isFullScreen","fullScreen","openAnimation","dialogOpen","closeAnimation","getButtons","DialogUtility","dialogObject","formOptions","isDraggable","formButtonModel","buttonPropModel","buttonProps","alert","dialogElement","alertDialogObj","alertButtonModel","okButton","setAlertButtonModel","alertOptions","confirm","confirmDialogObj","okButtonModel","cancelButtonModel","cancelButton","setConfirmButtonModel","confirmOptions","TOUCHEND_HIDE_DELAY","TAPHOLD_THRESHOLD","SHOW_POINTER_TIP_GAP","HIDE_POINTER_TIP_GAP","MOUSE_TRAIL_GAP","POINTER_ADJUST","TOOLTIP_WRAP","ARROW_TIP","ARROW_TIP_OUTER","ARROW_TIP_INNER","TIP_BOTTOM","TIP_TOP","TIP_LEFT","TIP_RIGHT","POPUP_OPEN","POPUP_CLOSE","POPUP_LIB","formatPosition","tooltipPositionY","tooltipPositionX","renderArrow","setTipClass","tip","tipClass","tooltipEle","renderPopup","elePos","mouseTrail","getTooltipPosition","openPopupHandler","closePopupHandler","offsetPos","calculateTooltipOffset","collisionFlipFit","tooltipEventArgs","tooltipEleWidth","tooltipEleHeight","arrowEle","tipWidth","tipHeight","tipAdjust","tipHeightAdjust","tipWidthAdjust","updateTipPosition","selEle","adjustArrow","leftValue","topValue","tooltipWidth","tooltipHeight","arrowInnerELe","tipPosExclude","tipPointerPosition","renderContent","tooltipContent","templateFunction","isSticky","tipClose","onStickyClose","addDescribedBy","describedby","data-tooltip-id","removeDescribedBy","orgdescribedby","tapHoldHandler","autoCloseTimer","targetHover","touchEndHandler","targetClick","hideTooltip","targetList_1","ctrlId","restoreElement","wireMouseEvents","showTimer","hideTimer","isHidden","aria-hidden","PopupAnimation","openDelay","horizontal","vertical","affectedPos","eleOffset","arrowleft","closeAnimation_1","closeDelay","unwireMouseEvents","onMouseOut","eventPageX","eventPageY","colpos","touchEnd","scrollHandler","triggerList_1","getTriggerList","wireFocusEvents","touchModule","tapHold","targetList_2","triggerList_2","unwireFocusEvents","targetList_3","triggerList_3","findTarget","DISABLE","INPUT","CLEARICON","CLEARICONHIDE","NOFLOATLABEL","INPUTCUSTOMTAG","FLOATCUSTOMTAG","_focusFn","getParentNode","_blurFn","createFloatingInput","inputObject","wireFloatingEvents","createInputContainer","customTag","updateLabelState","updateIconState","button","createClearButton","insertAdjacentElement","readOnly","wireClearBtnEvents","validateLabel","tagClass","setCssClass","oldClass","setPlaceholder","spanEle","encodePlaceHolder","aria-placeholder","setReadonly","isReadonly","isRtl","setEnabled","isEnable","inputContainer","disabledAttrs","considerWrapper","removeAttributes","addAttributes","setClearButton","isClear","_internalRipple","argsButton","_onMouseDownRipple","_onMouseUpRipple","parentEle","_onMouseRipple","appendSpan","iconClass","setPropertyValue","unwireFloatingEvents","addFloating","iconEle","floatText","setRipple","SPINICON","SPINUP","SPINDOWN","INCREMENT","DECREMENT","INTREGEXP","DECIMALSEPARATOR","COMPONENT","CONTROL","NumericTextBox","isPrevFocused","decimalSeparator","intRegExp","isCalled","cloneElement","angularTagName","formEle","tabindex","incrementTitle","decrementTitle","isValidState","inputStyle","inputName","cultureInfo","initCultureInfo","initCultureFunc","checkAttributes","inputEleValue","validateMinMax","validateStep","updatePlaceholder","createWrapper","showSpinButton","spinBtnCreation","changeValue","strictMode","trimValue","decimals","roundNumber","attributes_1","inputWrapper","aria-readonly","hiddenInput","validateHidden","spinDown","spinUp","wireSpinBtnEvents","formattedValue","aria-valuemin","aria-valuemax","isInteract","performAction","raiseChangeEvent","checkErrorClass","updateValue","focusIn","focusOut","inputHandler","pasteHandler","mouseDownOnSpinner","mouseUpOnSpinner","touchMoveOnSpinner","unwireSpinBtnEvents","parsedInput","beforeUpdate","preventHandler","iOS","currentPos","prevPos","ignoreKeyCode","valArray","prevVal","nextEle","cursorPosChanged","updatedValue","correctRounding","floatExp","floatValue","floatStep","valueCount","stepCount","roundValue","precision","divide","updateCurrency","propVal","numberOfDecimals","decimalPart","modifyText","validateState","result1","result2","metaKey","currentChar","fractionRule","validateDecimalOnType","mouseWheel","rawEvent","wheelDelta","detail","formatValue_1","ele_1","focusEvent","getElementData","mouseUpClick","floatLabelTypeUpdate","decrement","getText","propValue","#","?","&","MaskUndo","MaskedTextBox","resetMaskedTextBox","setMaskPlaceholder","setVal","dynamicPlaceholder","strippedValue_1","strippedVal","getMaskedValue","TicksData","LimitData","TooltipData","bootstrapTooltipOffset","bootstrap4TooltipOffset","root","sliderHiddenInput","controlWrapper","sliderHandle","rangeBar","sliderButton","firstButton","secondButton","tick","large","tickValue","sliderTooltip","sliderHover","sliderFirstHandle","sliderSecondHandle","sliderDisabled","sliderContainer","horizontalTooltipBefore","horizontalTooltipAfter","verticalTooltipBefore","verticalTooltipAfter","materialTooltip","materialTooltipOpen","materialTooltipActive","materialSlider","sliderTrack","sliderHandleFocused","verticalSlider","horizontalSlider","sliderHandleStart","sliderTooltipStart","sliderTabHandle","sliderButtonIcon","sliderSmallSize","sliderTickPosition","sliderFirstTick","sliderLastTick","sliderButtonClass","sliderTooltipWrapper","sliderTabTrack","sliderTabRange","sliderActiveHandle","sliderMaterialHandle","sliderMaterialRange","sliderMaterialDefault","materialTooltipShow","materialTooltipHide","limits","limitBarDefault","limitBarFirst","limitBarSecond","dragHorizontal","dragVertical","Slider","horDir","verDir","transition","transitionOnMaterialTooltip","scaleTransform","customAriaText","isElementFocused","tickElementCollection","tooltipFormatInfo","ticksFormatInfo","formChecker","isForm","formResetValue","internationalization","ticks","formatInfo","makeRoundNumber","elementVal","fractionalToInteger","noOfDecimals","tens","setZindex","tooltipElement","showOn","getThemeInitialization","setHandler","createRangeBar","createLimitBar","setOrientClass","showButtons","setButtons","rangeValueUpdate","previousVal","checkHandleValue","previousChanged","setLimitBar","renderScale","renderTooltip","isMaterial","isBootstrap","isBootstrap4","isMaterialTooltip","firstElementClassName","firstHandle","secondHandle","setAriaAttributes","customValues","createSecondHandle","createFirstHandle","materialHandle","wireFirstHandleEvt","handleFocus","transitionEnd","handleOver","handleLeave","wireSecondHandleEvt","handleStart","handlePos1","getHandle","tooltipToggle","closeTooltip","handleFocusOut","tooltipValue","setTooltipContent","tooltipObj","addTooltipClass","setAriaAttrValue","ariaContent","handle1","handleVal1","handle2","handleVal2","oldCss","newCss","getTooltipTransformProperties","previousTooltipClass","tooltipPlacement","tooltipBeforeOpen","setTooltipTransform","tooltipCollision","tooltipOffsetValue","wireMaterialTooltipEvent","sliderDown","tooltipPositionCalculation","transformProperties","translate","openMaterialTooltip","refreshTooltip","tooltipContentElement","closeMaterialTooltip","tooltipTarget","checkTooltipPosition","tooltipCollidedPosition","tooltipClass","beforeClose","tooltipBeforeClose","initializeTooltipProps","tooltipShowOn","firstBtn","secondBtn","buttonTitle","enabledRTL","buttonFocusOut","repeatButton","hVal","handleValueUpdate","getLimitCorrectedValues","changeHandleValue","repeatHandlerMouse","buttonClick","repeatInterval","materialChange","repeatHandlerUp","customTickCounter","bigNum","tickCount","orien","ul","smallStep","showSmallTicks","largeStep","steps","customStep","li","islargeTick","tickWidth","largestep","repeat","createTick","formatTicksValue","decimalPoints","tickesAlignment","lastChild","lastElementChild","ticksWrapper","tickElements","scaleAlignment","tickText","tickElement","tickValuePosition","other","otherChild","ariaValueText","isTickFormatted","valuenow","aria-valuetext","activeHandle","getLimitValueAndPosition","minStart","minEnd","maxStart","maxEnd","focusSliderElement","buttonUp","openTooltip","setRangeBar","handlePos2","checkValidValueAndPos","checkHandlePosition","setLimitBarPositions","fromMinPostion","fromMaxpostion","toMinPostion","toMaxpostion","fromPosition","toPosition","currentValue","minValue","maxValue","limitBar","preHandlePos1","setHandlePosition","validateRangeValue","setRangeValue","modifyZindex","updateRangeValue","setPreviousVal","preHandlePos2","tempStartEnd","startHandleFixed","endHandleFixed","xyToPosition","stepValueCalculation","percentStep","remain","addition","positionToValue","sliderBarClick","handlepos","handleVal","checkRepeatedValue","xPostion","yPostion","firstPartRemain","secondPartRemain","minDiff","dragRangeBarMove","dragRangeBarUp","sliderBarMove","sliderBarUp","handleValueAdjust","handleValue","assignValue","handleNumber","valueAndPostion","wireButtonEvt","sliderFocusOut","onresize","keyUp","relatedTarget","changeSliderType","updateConfig","changeRtl","changeOrientation","limitsPropertyChange","setMinMaxValue","setTooltip","EMAIL","URL","DATE_ISO","DIGITS","PHONE","CREDITCARD","ErrorOption","FormValidator","validated","errorRules","allowSubmit","required","infoElement","selectQuery","localyMessage","defaultMessages","email","dateIso","creditcard","maxLength","minLength","rangeLength","tel","equalTo","localeFunc","afterLocalization","inputElements","createHTML5Rules","FormValidator_1","addRules","removeRules","validate","rules_1","clearForm","getInputElement","errorClass","validClass","elements_2","getErrorElement","hideMessage","defRules","acceptedTypes","allRule","defRules_1","defRule","annotationRule","ruleCon","ruleName","rulesList","ruleFirstName","ruleSecondName","minvalue","maxvalue","customMessage","annotationMessage","getErrorMessage","isCheckable","submitHandler","hiddenType","validateHiddenType","vhPos","hPos","rules_2","errorMessage","errorRule","isValid","removeErrorRules","showMessage","createErrorElement","errorElement","optionalValidationStatus","refer","currentRule","checkValidator","ruleValue","formats","errorOption","Message","errorContainer","containerId","customPlacement","checkRequired","inputType","uNum","compareTo","Label","CONTROL_WRAPPER","INPUT_WRAPPER","DROP_AREA","DROP_WRAPPER","LIST_PARENT","FILE","STATUS","ACTION_BUTTONS","UPLOAD_BUTTONS","CLEAR_BUTTONS","FILE_NAME","FILE_TYPE","FILE_SIZE","REMOVE_ICON","DELETE_ICON","ABORT_ICON","RETRY_ICON","DRAG_HOVER","PROGRESS_WRAPPER","PROGRESSBAR","PROGRESSBAR_TEXT","UPLOAD_INPROGRESS","UPLOAD_SUCCESS","UPLOAD_FAILED","TEXT_CONTAINER","VALIDATION_FAILS","RTL_CONTAINER","ICON_FOCUSED","PROGRESS_INNER_WRAPPER","PAUSE_UPLOAD","RESUME_UPLOAD","RESTRICT_RETRY","FilesProp","ButtonsProps","AsyncSettings","Uploader","initialAttr","multiple","fileList","filesData","uploadedFilesData","allTypes","pausedData","uploadMetaData","btnTabIndex","disableKeyboardNavigation","actionCompleteCount","selectedFiles","setExtensions","allowedExtensions","clearAll","setControlStatus","setMultipleSelection","setRTL","reRenderFileList","browse","renderButtonTemplates","unBindDropEvents","setDropArea","renderPreLoadFiles","updateDirectoryAttributes","setLocalizedTexts","preLocaleObj","browseButton","localizedTexts","uploadWrapper","updateFileList","getKeyValue","autoUpload","uploadButton","listParent","createFileList","actionButtons","removeActionButtons","renderActionButtons","checkActionButtonStatus","localeText","Browse","Clear","Upload","dropFilesHint","invalidMaxFileSize","invalidMinFileSize","invalidFileType","uploadFailedMessage","uploadSuccessMessage","removedSuccessMessage","removedFailedMessage","inProgress","readyToUploadMessage","pauseUpload","resume","retry","fileUploadCancel","checkHTMLAttributes","isPureReactComponent","browserName","directoryUpload","renderBrowseButton","initializeUpload","wireActionButtonEvents","uploadButtonClick","clearButtonClick","unwireActionButtonEvents","uploadText","clearText","dropAreaWrapper","fileDropArea","clearData","files_1","fileData","rawFile","validationMessages","minSize","maxSize","statusCode","allowUpload","showFileList","dropTextArea","dropArea","dropZoneElement","enableDropText","bindDropEvents","newAttr","createAttribute","setAttributeNode","checkAutoUpload","sequentialUpload","sequenceUpload","isFileListCreated","browseButtonClick","onSelectFiles","removeFocus","keyActionHandler","resetForm","metaData","getCurrentMetaData","abortUpload","resumeUpload","chunkUpload","removeFiles","fileInfo","targetMetaData","dropElement","dragHover","onDragLeave","onPasteFile","dataTransfer","pasteFile","kind","renderSelectedFiles","getAsFile","liElement","spinnerTarget","uploadSequential","checkActionComplete","removeFilesData","customTemplate","getLiElement","removeUploadedFile","removeDirectly","ajax","asyncSettings","removeUrl","formData","FormData","currentRequest","postRawFile","updateFormData","customFormData","removeCompleted","removeFailed","customData","response","getResponse","updateStatus","rootElement","statusElement","getFilesFromFolder","filesEntries","checkDirectoryUpload","_loop_2","webkitGetAsEntry","files_2","fileObj","fullPath","isDirectory","traverseFileTree","files_3","_loop_3","this_2","createReader","readEntries","entries","targetFiles","sortFileList","directory","isModified","modifiedFilesData","progressInterval","isCanceled","fileDetails","getFileType","webkitRelativePath","validatedFileSize","fileSource","checkExtension","dataFiles","updateSortedFileList","raiseActionComplete","allowFormUpload","saveUrl","singleUpload","previousListClone","added","removedList_1","oldList","createParentUL","isBlank","dropFiles","extensions_1","extension","fileSize","minSizeError","maxSizeError","minFileSize","maxFileSize","isPreLoadFile","isPreload","createCustomfileList","fileData_1","listItem","data-file-name","uploadTemplateFn","eventsArgs","fileData_2","textContainer","getFileNameOnly","fileExtension","rtlContainer","bytesToSize","iconElement","truncateName","getSlicedName","nameElement","dataset","tail","setInitialAttributes","filterfileList","filterFiles","updateLiStatus","createProgressBar","progressbarWrapper","progressBar","progressbarInnerWrapper","progressbarText","updateProgressbar","loaded","total","changeProgressValue","progressValue","uploadInProgress","customUI","request","cancelUploadingFile","updateProgressBarClasses","removecanceledFile","renderFailureState","removeProgressbar","pauseButton","reloadcanceledFile","uploadComplete","raiseSuccessEvent","uploadFailed","withCredentials","statusMessage","getSelectedFileStatus","matchFiles","matchFilesIndex","selectFileIndex","selectedFileData","fileDataIndex","callType","progressAnimation","animateProgressBar","extensions","uploadTemplate","exception","chunkSize","chunkIndex","blob","retryCount","sendRequest","totalChunk","chunkUploadComplete","chunkUploadInProgress","currentChunkIndex","eventCancelByArgs","chunkUploadFailed","checkChunkUpload","requestResponse","updateMetaData","eventArgs_1","sendNextRequest","name_2","removeChunkFile","removeChunkProgressBar","pauseIcon","chunkCount","retryRequest","retryAfterDelay","failureMessage","checkPausePlayAction","retryUpload","fromcanceledStage","retryElement","clearIcon","loadedSize","bytes","fileNames","sortedFilesData","sortedFileNames_1","name_3","uploadFiles","validateFileType","chunkEnabled","_loop_4","this_3","name_4","getFilesData","validUrl","removeFiles_1","fileDataFiles","pauseUploading","getFiles","resumeFiles","retryFailedFiles","cancelingFiles","cancelUpload","showHideUploadSpinner","Item","FOCUS","ITEM","POPUP","SEPARATOR","VERTICAL","DropDownButton","canOpen","openPopUp","closePopup","createPopup","getPopUpElement","createItems","showIcon","hasIcon","separator","createAnchor","appendArrowSpan","setActiveElem","activeElem","popupEle","getULElement","popupElement","delegateMousedownHandler","mousedownHandler","keyBoardHandler","rippleFn","upDownKeyHandler","keyEventHandler","defaultIdx","liIdx","removeCustomSelection","isValidLI","selectedLi","getLI","trgt","beforeOpenArgs","openArgs","focusEle","beforeCloseArgs","TAGNAME","SplitButton","createPrimaryButton","createSecondaryButton","secondaryBtnObj","setAria","primaryBtnObj","dropDownBtnModel","beforeItemRender","aria-expanded","aria-haspopup","aria-owns","primaryBtnClickHandler","btnKeyBoardHandler","altdownarrow","HIDESPINNER","PROGRESS","PROGRESSACTIVE","CONTENTCLS","SpinSettings","ProgressButton","isPaused","startProgress","progressTime","spinSettings","enableProgress","createProgress","spinner","setSpinPosition","getSpinner","getProgress","cont","clsList","startAnimate","startContAnimate","prevTime","prevPercent","prevProgressTime","args_1","timeDiff","stepTime","timeDiffBuffer","currentDuration","hideSpin","setSpinnerSize","setIconSpan","iconSpan","APPLY","CANCEL","CURRENT","CONTAINER","CTRLBTN","CTRLSWITCH","FORMATSWITCH","HANDLER","HEX","HIDEHEX","HIDEOPACITY","HIDERGBA","HIDEVALUE","HIDEVALUESWITCH","HSVAREA","HSVCONTAINER","INPUTWRAPPER","MODESWITCH","NOCOLOR","OPACITY","PALETTES","PALETTECONTENT","PICKERCONTENT","PREVIEW","PREVIOUS","SHOWVALUE","SELECT","SPLITPREVIEW","TILE","presets","ColorPicker","Apply","Cancel","ModeSwitcher","inline","createWidget","createSplitBtn","enableOpacity","slicedValue","initialInputValue","tileRipple","ctrlBtnRipple","createPalette","firstPaletteFocus","createPicker","getDragHandler","isRgb","createCtrlBtn","toggleDisabled","refreshPopupPos","splitButton","splitBtn","beforeOpenFn","onOpen","beforePopupClose","rgba","convertToRgbString","hexToRgb","preview","getPopupEle","popupInst","getPopupInst","modal","onPopupClose","destroyOtherComp","presetColors","paletteGroup","appendPalette","modeSwitcher","noColor","setNoColor","borderBottomWidth","hsv","rgbToHsv","colors","refEle","tile","roundedColor","presetName","addTileSelection","noColorEle","insertPos","hsvContainer","dragHandler","setHsvContainerBg","setHandlerPosition","createSlider","createDragTooltip","getHsvContainer","hsvToRgb","hsvArea","sliderPreviewWrapper","createPreview","sliderWrapper","slider","hueSlider","hueChange","createOpacitySlider","opacitySlider","opacityChange","opacityBgTrack","updateOpacitySliderBg","convertToOtherFormat","pValue","cValue","updatePreview","triggerEvent","previewContainer","colorValue","isPicker","createNumericInput","numericInput","inputWrap","appendValueSwitchBtn","hexInput","maxlength","clsName","appendOpacityValue","valueSwitchBtn","formatSwitchHandler","btnWrapper","controlBtnWrapper","appendModeSwitchBtn","getTooltipInst","setTooltipOffset","convertToHsvString","updateHsv","isKey","updateInput","removeTileSelection","convertRgbToNumberArray","n","pickerKeyDown","handlerDown","addCtrlSwitchEvent","previewHandler","paletteClickHandler","paletteKeyDown","handlerDragPosition","enterKeyHandler","triggerChangeEvent","prob","setHsv","handlerMove","handlerEnd","switchToPalette","ctrlBtnClick","noColorTile","switchToPicker","grpEle","tiles","prevSelectedEle","pop","tilePosition","keySelectionChanges","newEle","cIdx","emptyCount","inputValueChange","isPopupOpen","tooltipInst","len_1","bigInt","v","f","q","changeModeSwitcherProp","ctrlSwitchWrapper","changeShowBtnProps","ctrlBtnWrapper","changeValueProp","setInputEleProps","changeDisabledProp","changeCssClassProps","popupWrapper","changeRtlProps","changePaletteProps","changeOpacityProps","count_1","HIDE_CLEAR","TextBox","isAngular","isHiddenInput","textboxWrapper","respectiveElement","preventChange","multiline","textarea","initialValue","setInitialValue","resetValue","localChange","interaction","resetInputHandler","DATEWRAPPER","LIBRARY","POPUPWRAPPER","INPUTCONTAINER","INPUTFOCUS","INPUTROOT","OVERFLOW","DATEICON","ICONS","OPENDURATION","OFFSETVALUE","NONEDIT","DatePicker","previousElementValue","isDateIconClicked","isAltKeyPressed","invalidValueString","checkPreviousValue","altDownArrow","calendarKeyConfigs","bindEvents","setAllowEdit","allowEdit","checkInvalidValue","inputValueCopy","ariaAttrs","isCalendar","disabledDates","minMaxUpdates","dateValue","tempFormat","dateTimeFormat","checkStringValue","returnDate","formatDateTime","valueDate","valueString","invalid","basicISOString","dateIconHandler","inputFocusHandler","inputBlurHandler","inputChangeHandler","keyboardModules","inputKeyActionHandle","restoreValue","popupUpdate","CalendarKeyActionHandle","focusArguments","strictModeUpdate","changeTrigger","blurArguments","calendarKeyboardModules","documentHandler","defaultAction","targetdate","dateOptions","createCalendar","modelHeader","yearHeading","h2","daySpan","monthSpan","selectCalendar","prevent_1","outOfRange","preventArgs","prevent_2","inputElementCopy","ensureInputAttribute","ngTag","validationAttribute","checkHtmlAttributes","nameAttribute","checkFormat","skeletonString","valueCopy","previousValCopy","dateIdString","isDisabledDate","subQuery","distincts","queries","fKey","fromTable","lookups","expands","sortedColumns","groupedColumns","setKey","using","dataManager","always","executeQuery","cloned","subQuerySelector","isCountRequired","tableName","addParams","distinct","expand","tables","fieldName","ignoreAccent","searchKey","fieldNames","comparer","fnOperators","isFromGroup","sorts","order","endsWith","fnSort","filterQueries","sortByDesc","page","pageIndex","take","nos","skip","hierarchy","selectorFn","foreignKey","requiresCount","aggregate","filterQueryLists","singles","filtered","isComplex","processOperator","condition","predicates","combinePredicates","fromJson","fromJSONData","isAnd","toJson","preds","consts","startsWith","fnAscending","fnDescending","localeCompare","extractFields","jsonArray","groupDs","jsonData","indx","grouped","groupedArray","tempObj","aggs","buildHierarchy","lookup","pKey","grp","fKeyData","getFieldList","copyObj","ds","ignoreDiacritics","diacritics","callAdaptorFunction","fnName","param1","param2","getAddParams","adp","dm","req","reqParams","isPlainObject","isCors","xhr","getGuid","rand","Uint8Array","isNull","getItemFromComparer","castRequired","requiresCompleteRecord","tmp","serverTimezoneOffset","average","truecount","falsecount","operatorSymbols","<",">","<