all files / spreadsheet/integrations/ formula-bar.js

91.72% Statements 410/447
84.8% Branches 251/296
91.67% Functions 44/48
91.7% Lines 409/446
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437 438 439 440 441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459 460 461 462 463 464 465 466 467 468 469 470 471 472 473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549 550 551 552 553 554 555 556 557 558 559 560 561 562 563 564 565 566 567 568 569 570 571 572 573 574 575 576 577 578 579 580 581 582 583 584 585 586 587 588 589 590 591 592 593 594 595 596 597 598 599 600 601 602 603 604 605 606 607 608 609 610 611 612 613 614 615 616 617 618 619 620 621 622 623 624 625 626 627 628 629 630 631 632 633 634 635 636 637 638 639 640 641 642 643 644 645 646 647 648 649 650 651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681   882× 882× 882× 882× 882×   126650×   883× 883×       883× 883× 883× 883× 883× 883× 883×       888×                       883× 883× 883×   883×     883× 883× 883× 883× 883×       883× 883×           883× 883×     883×     882×                         556× 556× 178×     177×       81× 18× 18×                         21× 12× 12×                             10711× 10711× 10711× 10711× 10711× 10711× 10711× 10711×                           10711× 10711× 10711× 10709× 31×   10678× 10678× 10678× 10678× 10678× 10678× 10678× 10678× 7153×   10678× 63×   60× 60×           10711×   10811× 10811× 10811× 5246×   5565× 4235× 4235× 4235× 359× 359× 320× 320× 320× 311×   320× 320×     320× 320× 320×   320× 194× 194× 194× 194×       126× 14×   126×       3876× 67× 67×       4235× 3848× 3848× 59×   3789× 65× 65× 16×         1330×     10811×   96×   10807× 10807× 10807×     10807× 10807× 15×   10807× 10807× 4146×   6661× 6661×     1083× 1083× 53×     1030×         1827× 1827× 1827× 1827× 1827× 1827× 1827×   1823×           1814× 20×         12× 12×     1826×             12× 12× 12× 12×     11× 11×   10× 10× 10× 10×   10× 10× 10×   10× 10× 10× 10× 10× 10× 10× 10× 10× 10× 10× 10× 10× 10×       10× 10× 10× 10×         10× 10× 10×             10×     10× 10×     10×                         10× 10× 10×                                   10× 10× 10×     10× 10×   10× 10× 10× 10× 10×                 16× 16×     14× 14×                         14× 14× 14×   30× 30×           30× 30× 30×     30× 30× 30×                     882× 882× 882× 882× 882× 882× 882× 882× 882× 882×   882× 882× 882×   882× 882× 882× 882× 882× 882× 882×   882× 882× 882× 882× 882×   882×   882× 13× 13× 13× 13× 13× 13× 13× 13× 13× 13×     359×   359× 133×     226×   359×           6775× 6775×     6773×     1442×        
define(["require", "exports", "../common/index", "../common/index", "./../../workbook/common/address", "../../workbook/index", "../../workbook/index", "@syncfusion/ej2-dropdowns", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "../common/event", "../../workbook/common/math", "@syncfusion/ej2-lists", "../../workbook/index", "../common/index"], function (require, exports, index_1, index_2, address_1, index_3, index_4, ej2_dropdowns_1, ej2_base_1, ej2_base_2, event_1, math_1, ej2_lists_1, index_5, index_6) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var FormulaBar = (function () {
        function FormulaBar(parent) {
            this.categoryCollection = [];
            this.formulaCollection = [];
            this.isGoto = false;
            this.parent = parent;
            this.addEventListener();
        }
        FormulaBar.prototype.getModuleName = function () {
            return 'formulaBar';
        };
        FormulaBar.prototype.createFormulaBar = function (args) {
            var _this = this;
            Iif (!this.parent.showFormulaBar && this.insertFnRipple) {
                this.destroy();
                return;
            }
            var l10n = this.parent.serviceLocator.getService(index_1.locale);
            var id = this.parent.element.id;
            var fBarWrapper = this.parent.createElement('div', { className: 'e-formula-bar-panel' });
            Eif (!this.parent.isMobileView()) {
                var nameBox = this.parent.createElement('input', { id: id + '_name_box', attrs: { type: 'text' } });
                fBarWrapper.appendChild(nameBox);
                this.comboBoxInstance = new ej2_dropdowns_1.ComboBox({
                    value: 'A1',
                    cssClass: 'e-name-box',
                    width: '',
                    noRecordsTemplate: ej2_base_2.initializeCSPTemplate(function () { return ''; }),
                    fields: { text: 'name', value: 'refersTo' },
                    beforeOpen: this.nameBoxBeforeOpen.bind(this),
                    blur: this.nameBoxBlur.bind(this),
                    select: this.nameBoxSelect.bind(this),
                    open: function () {
                        Iif (_this.isDevice) {
                            window.browserDetails.isDevice = true;
                        }
                    },
                    change: function () {
                    }
                });
                this.comboBoxInstance.createElement = this.parent.createElement;
                this.comboBoxInstance.appendTo(nameBox);
                this.comboBoxInstance.element.parentElement.title = l10n.getConstant('NameBox');
            }
            var insertFnBtn = fBarWrapper.appendChild(this.parent.createElement('button', {
                className: 'e-btn e-css e-flat e-icon-btn e-insert-function', attrs: { 'title': l10n.getConstant('InsertFunction'), 'type': 'button' }
            }));
            insertFnBtn.appendChild(this.parent.createElement('span', { className: 'e-btn-icon e-icons' }));
            this.insertFnRipple = ej2_base_1.rippleEffect(fBarWrapper, { selector: '.e-insert-function' });
            fBarWrapper.appendChild(this.parent.createElement('div', { className: 'e-separator' }));
            var formulaBarLocale = l10n.getConstant('FormulaBar');
            var textarea = fBarWrapper.appendChild(this.parent.createElement('textarea', {
                className: 'e-formula-bar e-css', id: id + '_formula_input',
                attrs: { 'title': formulaBarLocale, 'aria-label': formulaBarLocale, 'spellcheck': 'false' }
            }));
            textarea.rows = 1;
            Iif (this.parent.isMobileView()) {
                textarea.placeholder = l10n.getConstant('MobileFormulaBarPlaceHolder');
                ej2_base_1.EventHandler.add(textarea, 'focus', this.textAreaFocusIn, this);
                ej2_base_1.EventHandler.add(textarea, 'blur', this.textAreaFocusOut, this);
            }
            else {
                var text = l10n.getConstant('ExpandFormulaBar');
                fBarWrapper.appendChild(this.parent.createElement('span', { className: 'e-drop-icon e-icons', attrs: { 'title': text, 'role': 'button',
                        'tabindex': '-1', 'aria-label': text } }));
            }
            if (args && args.uiUpdate) {
                this.parent.element.insertBefore(fBarWrapper, document.getElementById(id + '_sheet_panel'));
            }
            else {
                this.parent.element.appendChild(fBarWrapper);
            }
        };
        FormulaBar.prototype.textAreaFocusIn = function () {
            var formulaPanel = this.parent.element.querySelector('.e-formula-bar-panel');
            var tickBtn = this.parent.createElement('button', { className: 'e-btn e-css e-flat e-icon-btn e-formula-submit', attrs: { 'type': 'button' } });
            tickBtn.appendChild(this.parent.createElement('span', { className: 'e-btn-icon e-icons e-tick-icon' }));
            formulaPanel.classList.add('e-focused');
            formulaPanel.appendChild(tickBtn);
        };
        FormulaBar.prototype.textAreaFocusOut = function () {
            var formulaPanel = this.parent.element.querySelector('.e-formula-bar-panel');
            formulaPanel.classList.remove('e-focused');
            ej2_base_1.detach(formulaPanel.querySelector('.e-formula-submit'));
        };
        FormulaBar.prototype.keyDownHandler = function (e) {
            var trgtElem = e.target;
            if (this.parent.isEdit && (!this.parent.getActiveSheet().isProtected || (trgtElem.classList.contains('e-formula-bar') && !trgtElem.disabled))) {
                if ((index_3.checkIsFormula(trgtElem.value) || (trgtElem.validity && trgtElem.value.toString().indexOf('=') === 0)) &&
                    (e.keyCode === 16 || e.keyCode === 17)) {
                    return;
                }
                if (trgtElem.classList.contains('e-formula-bar') && (!e.shiftKey || (e.shiftKey && !index_1.isNavigationKey(e.keyCode)))) {
                    this.parent.notify(event_1.editOperation, { action: 'refreshEditor', value: trgtElem.value, refreshEditorElem: true });
                }
            }
        };
        FormulaBar.prototype.keyUpHandler = function (e) {
            if (this.parent.isEdit) {
                var trgtElem = e.target;
                if (trgtElem.classList.contains('e-formula-bar')) {
                    var eventArg = { action: 'getCurrentEditValue', editedValue: '' };
                    this.parent.notify(event_1.editOperation, eventArg);
                    if (eventArg.editedValue !== trgtElem.value && e.keyCode !== 16 && e.keyCode !== 17 &&
                        (!e.shiftKey || (e.shiftKey && !index_1.isNavigationKey(e.keyCode)))) {
                        this.parent.notify(event_1.editOperation, { action: 'refreshEditor', value: trgtElem.value, refreshEditorElem: true });
                    }
                }
            }
        };
        FormulaBar.prototype.nameBoxBeforeOpen = function (args) {
            Iif (this.comboBoxInstance.element.classList.contains('e-name-editing')) {
                args.cancel = true;
            }
            else {
                this.comboBoxInstance.element.select();
                this.isDevice = window.browserDetails.isDevice;
                Iif (this.isDevice) {
                    window.browserDetails.isDevice = false;
                }
            }
        };
        FormulaBar.prototype.nameBoxBlur = function () {
            if (this.comboBoxInstance.element.classList.contains('e-name-editing')) {
                this.comboBoxInstance.element.classList.remove('e-name-editing');
                this.UpdateValueAfterMouseUp();
            }
        };
        FormulaBar.prototype.nameBoxSelect = function (args) {
            Eif (args.isInteracted && (!args.e || args.e.type !== 'keydown' || (args.e.keyCode !== 40 &&
                args.e.keyCode !== 38))) {
                var refersTo = args.itemData.refersTo.substr(1);
                var sheetIdx = index_4.getSheetIndex(this.parent, index_4.getSheetNameFromAddress(refersTo));
                if (sheetIdx === undefined) {
                    return;
                }
                var range = address_1.getRangeFromAddress(refersTo);
                var sheet = index_3.getSheet(this.parent, sheetIdx);
                var left = void 0;
                var right = void 0;
                if (range.indexOf(':') === -1) {
                    left = right = range.replace('$', '');
                }
                else {
                    var colIndex = range.indexOf(':');
                    left = range.substr(0, colIndex).replace('$', '');
                    right = range.substr(colIndex + 1, range.length).replace('$', '');
                }
                if (right.match(/\D/g) && !right.match(/[0-9]/g) && left.match(/\D/g) && !left.match(/[0-9]/g)) {
                    left = left + '1';
                    right = right + sheet.rowCount;
                    range = left + ':' + right;
                }
                else if (!right.match(/\D/g) && right.match(/[0-9]/g) && !left.match(/\D/g) && left.match(/[0-9]/g)) {
                    left = address_1.getCellAddress(parseInt(left, 10) - 1, 0);
                    right = address_1.getCellAddress(parseInt(right, 10) - 1, sheet.colCount - 1);
                    range = left + ':' + right;
                }
                if (sheetIdx === this.parent.activeSheetIndex) {
                    this.parent.selectRange(range);
                    index_1.focus(this.parent.element);
                }
                else {
                    index_4.updateSelectedRange(this.parent, range, sheet);
                    this.parent.activeSheetIndex = sheetIdx;
                }
            }
        };
        FormulaBar.prototype.formulaBarUpdateHandler = function (e) {
            var _this = this;
            var sheet = this.parent.getActiveSheet();
            var range = sheet.selectedRange.split(':');
            var address;
            var editArgs = { action: 'getElement', element: null };
            this.parent.notify(event_1.editOperation, editArgs);
            var formulaBar = this.parent.element.querySelector('.e-formula-bar');
            Iif (e.type === 'mousemove' || e.type === 'pointermove') {
                var indexes1 = address_1.getRangeIndexes(range[0]);
                var indexes2 = address_1.getRangeIndexes(range[1]);
                address = Math.abs(indexes1[0] - indexes2[0]) + 1 + "R x " + (Math.abs(indexes1[1] - indexes2[1]) + 1) + "C";
                if (this.parent.isEdit) {
                    if (e.target && !e.target.classList.contains('e-spreadsheet-edit')) {
                        this.parent.notify(event_1.editValue, {});
                    }
                    else if (editArgs.element) {
                        formulaBar.value = editArgs.element.textContent;
                    }
                }
            }
            else {
                address = range[0];
                var cellAddr = index_3.getSheetName(this.parent) + "!" + address;
                index_5.getData(this.parent, cellAddr, false, true).then(function (values) {
                    if (!_this.parent) {
                        return;
                    }
                    values.forEach(function (cell) {
                        var value = _this.getFormulaBarValue(cell);
                        var eventArgs = { action: 'getCurrentEditValue', editedValue: '' };
                        _this.parent.notify(event_1.editOperation, eventArgs);
                        var formulaInp = document.getElementById(_this.parent.element.id + '_formula_input');
                        var previousVal = formulaInp.value;
                        formulaInp.value = value;
                        if (!eventArgs.editedValue || !index_3.checkIsFormula(eventArgs.editedValue.toString(), true)) {
                            _this.parent.notify(event_1.editOperation, { action: 'refreshEditor', value: value, refreshEditorElem: true });
                        }
                        if (_this.parent.isEdit) {
                            if (e.target && !e.target.classList.contains('e-spreadsheet-edit')) {
                                _this.parent.notify(event_1.editValue, { isMouseDown: index_1.isMouseDown(e), formulaBarVal: previousVal });
                            }
                            else Eif (editArgs.element) {
                                formulaBar.value = editArgs.element.textContent;
                            }
                        }
                    });
                });
            }
            this.updateComboBoxValue(address);
        };
        FormulaBar.prototype.getFormulaBarValue = function (cell) {
            var value = '';
            Eif (cell) {
                if (cell.formula) {
                    value = cell.formula;
                }
                else if (!ej2_base_1.isNullOrUndefined(cell.value) && cell.value !== '') {
                    var option = {};
                    var type = cell.format && index_3.isCustomDateTime(cell.format, true, option, true) && option.type;
                    if (type === 'date' || type === 'time' || type === 'datetime') {
                        var dateVal = math_1.intToDate(Number(cell.value));
                        if (dateVal && dateVal.toString() !== 'Invalid Date' && dateVal.getFullYear() >= 1900) {
                            var intl = new ej2_base_1.Internationalization();
                            var time = index_5.getFormatFromType('Time');
                            if (time === 'h:mm:ss AM/PM') {
                                time = 'h:mm:ss a';
                            }
                            var format = cell.format.toLowerCase();
                            if (type === 'time' && format.includes('m') && !format.includes(':m') && !format.includes('m:') &&
                                !format.includes('[m') && !format.includes('am')) {
                                type = 'date';
                            }
                            var valArr = cell.value.toString().split('.');
                            var isDateTimeVal = valArr.length === 2;
                            var timeVal = isDateTimeVal ? math_1.intToDate(parseFloat((valArr[0] + 1) + '.' + valArr[1]) ||
                                Number(cell.value)) : dateVal;
                            if (type === 'date') {
                                var dateObj = { type: 'date' };
                                dateObj.skeleton = 'yMd';
                                value = intl.formatDate(dateVal, dateObj);
                                if (isDateTimeVal) {
                                    value += ' ' + intl.formatDate(timeVal, { type: 'time', skeleton: 'medium', format: time });
                                }
                            }
                            else {
                                if (Number(cell.value) >= 1 || type === 'datetime') {
                                    value = intl.formatDate(dateVal, { type: 'date', skeleton: 'yMd' }) + ' ';
                                }
                                value += intl.formatDate(timeVal, { type: 'time', skeleton: 'medium', format: time });
                            }
                        }
                    }
                    else if (cell.format && cell.format.includes('%') && math_1.isNumber(cell.value)) {
                        value = this.parent.getDisplayText(cell);
                        Iif (!value.includes('%')) {
                            value = '';
                        }
                    }
                    if (!value) {
                        value = cell.value.toString();
                        if (value.toLowerCase() === 'true' || value.toLowerCase() === 'false') {
                            value = value.toUpperCase();
                        }
                        else if (this.parent.locale !== 'en-US') {
                            var decimalSep = ej2_base_2.getNumericObject(this.parent.locale).decimal;
                            if (decimalSep !== '.' && math_1.isNumber(value) && value.includes('.')) {
                                value = value.replace('.', decimalSep);
                            }
                        }
                    }
                }
                else if (cell.hyperlink) {
                    value = typeof cell.hyperlink === 'string' ? cell.hyperlink : (cell.hyperlink.address || '');
                }
            }
            return value;
        };
        FormulaBar.prototype.UpdateValueAfterMouseUp = function () {
            this.updateComboBoxValue(this.parent.getActiveSheet().selectedRange.split(':')[0]);
        };
        FormulaBar.prototype.updateComboBoxValue = function (value) {
            var sheet = this.parent.getActiveSheet();
            var range = index_3.getSheetName(this.parent) + '!' + sheet.selectedRange;
            var eventArgs = {
                action: 'getNameFromRange', range: range, definedName: null
            };
            this.parent.notify(event_1.formulaOperation, eventArgs);
            if (eventArgs.definedName) {
                value = eventArgs.definedName.name;
            }
            Eif (!this.parent.isMobileView()) {
                if (this.comboBoxInstance.text === value) {
                    return;
                }
                this.comboBoxInstance.text = value;
                this.comboBoxInstance.dataBind();
            }
        };
        FormulaBar.prototype.disabletextarea = function () {
            var element = this.getFormulaBar();
            if (this.parent.getActiveSheet().isProtected && !this.parent.isEdit) {
                element.disabled = true;
            }
            else {
                element.disabled = false;
            }
        };
        FormulaBar.prototype.formulaBarScrollEdit = function () {
            var index = address_1.getRangeIndexes(this.parent.getActiveSheet().selectedRange);
            var viewportIndexes = address_1.getCellIndexes(this.parent.getActiveSheet().topLeftCell);
            if (index[0] < viewportIndexes[0]) {
                this.parent.goTo(this.parent.getActiveSheet().selectedRange);
                this.isGoto = true;
            }
            this.parent.notify(event_1.editOperation, { action: 'startEdit', refreshCurPos: false });
        };
        FormulaBar.prototype.formulaBarClickHandler = function (e) {
            var target = e.target;
            var sheet = this.parent.getActiveSheet();
            var isSheetProtected = sheet.isProtected;
            var range = address_1.getCellIndexes(sheet.activeCell);
            var cell = index_3.getCell(range[0], range[1], sheet);
            var isCellLocked = index_4.isLocked(cell, index_4.getColumn(sheet, range[1]));
            if (target.classList.contains('e-drop-icon') && target.parentElement.classList.contains('e-formula-bar-panel')) {
                this.toggleFormulaBar(target);
            }
            else if (target.classList.contains('e-formula-bar')) {
                if (index_3.isReadOnly(cell, index_4.getColumn(sheet, range[1]), index_3.getRow(sheet, range[0]))) {
                    this.parent.notify(event_1.readonlyAlert, null);
                    return;
                }
                if ((!this.parent.isEdit && (!isSheetProtected || (isSheetProtected && !isCellLocked))) ||
                    (this.parent.isEdit && isSheetProtected && !target.disabled)) {
                    this.formulaBarScrollEdit();
                }
                else Eif (isSheetProtected && isCellLocked) {
                    this.parent.notify(event_1.editAlert, null);
                }
            }
            else if (target.parentElement && target.parentElement.classList.contains('e-name-box')) {
                if (target.classList.contains('e-ddl-icon')) {
                    var eventArgs = { action: 'getNames', names: [] };
                    this.parent.notify(event_1.formulaOperation, eventArgs);
                    Eif (this.comboBoxInstance.dataSource.length !== eventArgs.names.length ||
                        this.comboBoxInstance.value === this.comboBoxInstance.text) {
                        var searchText_1 = this.comboBoxInstance.text;
                        this.comboBoxInstance.dataSource = eventArgs.names;
                        var definedName = eventArgs.names.find(function (name) { return name.name === searchText_1; });
                        this.comboBoxInstance.value = definedName ? definedName.refersTo : this.comboBoxInstance.value;
                        this.comboBoxInstance.dataBind();
                    }
                }
                else {
                    this.comboBoxInstance.element.classList.add('e-name-editing');
                    this.comboBoxInstance.element.select();
                }
            }
            if (!ej2_base_1.isNullOrUndefined(target.offsetParent) && ((target.offsetParent.classList.contains('e-insert-function')) ||
                (target.classList.contains('e-insert-function')) || (this.parent.element.id + '_insert_function' === target.offsetParent.id)
                || (this.parent.element.id + '_insert_function' === target.id) ||
                target.parentElement.classList.contains('e-insert-function')
                || (this.parent.element.id + '_insert_function' === target.parentElement.id))) {
                this.renderInsertDlg();
            }
        };
        FormulaBar.prototype.renderInsertDlg = function () {
            var _this = this;
            var sheet = this.parent.getActiveSheet();
            var activeCell = address_1.getCellIndexes(sheet.activeCell);
            if (sheet.isProtected) {
                Eif (index_4.isLocked(index_3.getCell(activeCell[0], activeCell[1], sheet), index_4.getColumn(sheet, activeCell[1])) && !this.parent.isEdit) {
                    this.parent.notify(event_1.editAlert, null);
                    return;
                }
            }
            var cell = index_3.getCell(activeCell[0], activeCell[1], sheet);
            if (index_3.isReadOnly(cell, index_4.getColumn(sheet, activeCell[1]), index_3.getRow(sheet, activeCell[0]))) {
                this.parent.notify(event_1.readonlyAlert, null);
                return;
            }
            var l10n = this.parent.serviceLocator.getService(index_1.locale);
            var isOpen = !this.parent.isEdit;
            var args = { action: 'getCurrentEditValue', editedValue: '' };
            if (!isOpen) {
                var eventArgs = { action: 'isFormulaEditing', isFormulaEdit: false };
                this.parent.notify(event_1.formulaOperation, eventArgs);
                isOpen = eventArgs.isFormulaEdit;
                this.parent.notify(event_1.editOperation, args);
            }
            Eif (isOpen || args.editedValue === '') {
                Eif (args.editedValue === '') {
                    this.parent.notify(event_1.editOperation, { action: 'refreshEditor', value: '=' });
                }
                var formulaDescription = this.parent.createElement('div', { className: 'e-formula-description', id: this.parent.element.id + '_description_content' });
                var categoryContent = this.parent.createElement('div', { className: 'e-category-content', id: this.parent.element.id + '_category_content' });
                categoryContent.innerText = l10n.getConstant('PickACategory');
                var dropDownElement = this.parent.createElement('input', { className: 'e-formula-category', id: this.parent.element.id + '_formula_category' });
                var listViewElement = this.parent.createElement('div', { className: 'e-formula-list', id: this.parent.element.id + '_formula_list' });
                var descriptionContent = this.parent.createElement('div', { className: 'e-description-content' });
                descriptionContent.innerText = l10n.getConstant('Description');
                var headerContent = this.parent.createElement('div', { className: 'e-header-content' });
                headerContent.innerText = l10n.getConstant('InsertFunction');
                var categoryArgs = { action: 'getFormulaCategory', categoryCollection: [] };
                this.parent.notify(index_5.workbookFormulaOperation, categoryArgs);
                this.categoryCollection = categoryArgs.categoryCollection;
                var categoryPopupOpen_1;
                this.categoryList = new ej2_dropdowns_1.DropDownList({
                    dataSource: this.categoryCollection, cssClass: 'e-ss-formula-category', index: 0, width: '285px', popupHeight: '210px',
                    select: this.dropDownSelect.bind(this),
                    open: function () { return categoryPopupOpen_1 = true; },
                    close: function () { return categoryPopupOpen_1 = false; }
                });
                var listArgs = { action: 'getLibraryFormulas', formulaCollection: [] };
                this.parent.notify(index_5.workbookFormulaOperation, listArgs);
                this.formulaCollection = listArgs.formulaCollection;
                this.formulaList = new ej2_lists_1.ListView({
                    dataSource: this.formulaCollection.sort(),
                    actionComplete: this.updateFormulaList.bind(this),
                    select: this.listSelected.bind(this), width: '285px', height: '200px'
                });
                this.dialog = this.parent.serviceLocator.getService(index_1.dialog);
                Eif (!this.parent.element.querySelector('.e-spreadsheet-function-dlg')) {
                    this.dialog.show({
                        header: headerContent.outerHTML,
                        content: categoryContent.outerHTML + dropDownElement.outerHTML + listViewElement.outerHTML +
                            descriptionContent.outerHTML + formulaDescription.outerHTML,
                        width: '320px', height: '485px', cssClass: 'e-spreadsheet-function-dlg',
                        showCloseIcon: true, isModal: true,
                        beforeOpen: function (args) {
                            var dlgArgs = {
                                dialogName: 'InsertFunctionDialog', element: args.element, target: args.target, cancel: args.cancel
                            };
                            _this.parent.trigger('dialogBeforeOpen', dlgArgs);
                            Iif (dlgArgs.cancel) {
                                args.cancel = true;
                            }
                            index_1.focus(_this.parent.element);
                        },
                        open: this.dialogOpen.bind(this), beforeClose: this.dialogBeforeClose.bind(this), close: this.dialogClose.bind(this),
                        buttons: [
                            {
                                click: function (event) {
                                    Iif (event && event.keyCode === 13 && !categoryPopupOpen_1) {
                                        return;
                                    }
                                    _this.selectFormula();
                                },
                                buttonModel: { content: l10n.getConstant('Ok'), isPrimary: true }
                            }
                        ]
                    });
                    this.categoryList.appendTo('#' + this.parent.element.id + '_formula_category');
                    this.formulaList.appendTo('#' + this.parent.element.id + '_formula_list');
                    ej2_base_1.EventHandler.add(this.formulaList.element, 'dblclick', this.formulaClickHandler, this);
                }
            }
        };
        FormulaBar.prototype.toggleFormulaBar = function (target) {
            var parent = target.parentElement;
            var l10n = this.parent.serviceLocator.getService(index_1.locale);
            if (parent.classList.contains('e-expanded')) {
                parent.classList.remove('e-expanded');
                document.getElementById(this.parent.element.id + '_formula_input').rows = 1;
                target.title = l10n.getConstant('ExpandFormulaBar');
                target.setAttribute('aria-label', l10n.getConstant('CollapseFormulaBar'));
            }
            else {
                parent.classList.add('e-expanded');
                document.getElementById(this.parent.element.id + '_formula_input').rows = 3;
                target.title = l10n.getConstant('CollapseFormulaBar');
                target.setAttribute('aria-label', l10n.getConstant('ExpandFormulaBar'));
            }
            this.parent.setPanelSize();
        };
        FormulaBar.prototype.dialogOpen = function () {
            var _this = this;
            index_1.getUpdateUsingRaf(function () {
                var okBtn = _this.dialog.dialogInstance.element.querySelector('.e-footer-content .e-primary');
                var l10n = _this.parent.serviceLocator.getService(index_1.locale);
                okBtn.setAttribute('aria-label', l10n.getConstant('InsertFunction') + ' ' + l10n.getConstant('Ok'));
                if (_this.categoryList) {
                    index_1.focus(_this.categoryList.element);
                }
            });
        };
        FormulaBar.prototype.dialogClose = function () {
            var args = { action: 'getCurrentEditValue', editedValue: '' };
            this.parent.notify(event_1.editOperation, args);
            if (args.editedValue.toString().trim() === '=') {
                this.parent.notify(event_1.editOperation, { action: 'refreshEditor', value: '' });
            }
        };
        FormulaBar.prototype.dialogBeforeClose = function () {
            ej2_base_1.EventHandler.remove(this.formulaList.element, 'dblclick', this.formulaClickHandler);
            var dialogContentEle = document.getElementsByClassName('e-spreadsheet-function-dlg')[0].
                querySelector('.e-dlg-content');
            dialogContentEle.parentNode.removeChild(dialogContentEle);
            this.categoryList.destroy();
            this.categoryList = null;
            this.formulaList.destroy();
            this.formulaList = null;
        };
        FormulaBar.prototype.selectFormula = function () {
            var formulaText = this.formulaList.getSelectedItems().text;
            var sheet = index_3.getSheet(this.parent, this.parent.activeSheetIndex);
            if (this.parent.isEdit) {
                this.parent.notify(event_1.editOperation, {
                    action: 'refreshEditor', value: formulaText + '(', refreshFormulaBar: true,
                    refreshEditorElem: true, isAppend: true
                });
            }
            else {
                this.parent.notify(event_1.editOperation, { action: 'startEdit', value: '=' + formulaText + '(', address: sheet.activeCell });
                this.parent.notify(event_1.formulaBarOperation, { action: 'refreshFormulabar', value: '=' + formulaText + '(' });
            }
            this.dialog.dialogInstance.storeActiveElement = document.getElementById(this.parent.element.id + '_edit');
            this.dialog.hide();
        };
        FormulaBar.prototype.listSelected = function (args) {
            this.updateFormulaDescription();
            if (args.isInteracted && args.item) {
                args.item.focus();
            }
        };
        FormulaBar.prototype.updateFormulaList = function () {
            this.activeListFormula();
            this.updateFormulaDescription();
        };
        FormulaBar.prototype.dropDownSelect = function (args) {
            this.formulaCollection = [];
            var listArgs = {
                action: 'getLibraryFormulas',
                formulaCollection: []
            };
            if (args.item.textContent === 'All') {
                this.parent.notify(index_5.workbookFormulaOperation, listArgs);
                this.formulaCollection = listArgs.formulaCollection;
            }
            else {
                var category = args.item.textContent;
                var selectArgs = {
                    action: 'dropDownSelectFormulas',
                    formulaCollection: [],
                    selectCategory: category
                };
                this.parent.notify(index_5.workbookFormulaOperation, selectArgs);
                this.formulaCollection = selectArgs.formulaCollection;
            }
            this.formulaList.dataSource = this.formulaCollection.sort();
        };
        FormulaBar.prototype.activeListFormula = function () {
            var acListEle = document.getElementById(this.parent.element.id + '_formula_list');
            var firstElement = acListEle.children[0].children[0].firstElementChild;
            this.formulaList.selectItem(firstElement);
        };
        FormulaBar.prototype.updateFormulaDescription = function () {
            var selectedFormula = this.formulaList.getSelectedItems().text;
            var descriptionArgs = {
                action: 'getFormulaDescription',
                description: '',
                selectedList: selectedFormula,
                isCustom: false
            };
            this.parent.notify(index_5.workbookFormulaOperation, descriptionArgs);
            var okBtn = this.dialog.dialogInstance.element.querySelector('.e-footer-content .e-primary');
            Iif (okBtn.hasAttribute('aria-label')) {
                okBtn.removeAttribute('aria-label');
            }
            var descriptionArea = document.getElementById(this.parent.element.id + '_description_content');
            selectedFormula = (selectedFormula === 'AND') ? 'CalculateAND' : (selectedFormula === 'OR') ? 'CalculateOR' : selectedFormula;
            descriptionArea.textContent = descriptionArgs.isCustom ? descriptionArgs.description :
                this.parent.serviceLocator.getService(index_1.locale).getConstant(selectedFormula);
        };
        FormulaBar.prototype.formulaClickHandler = function (args) {
            var trgtElem = args.target;
            var sheet = index_3.getSheet(this.parent, this.parent.activeSheetIndex);
            Eif (trgtElem.offsetParent.classList.contains('e-text-content') || trgtElem.classList.contains('e-list-item')) {
                if (this.parent.isEdit) {
                    this.parent.notify(event_1.editOperation, {
                        action: 'refreshEditor', value: trgtElem.innerText + '(', refreshFormulaBar: true,
                        refreshEditorElem: true, isAppend: true
                    });
                }
                else {
                    this.parent.notify(event_1.editOperation, { action: 'startEdit', value: '=' + trgtElem.innerText + '(', address: sheet.activeCell });
                    this.parent.notify(event_1.formulaBarOperation, { action: 'refreshFormulabar', value: '=' + trgtElem.innerText + '(' });
                }
                this.dialog.hide();
            }
        };
        FormulaBar.prototype.addEventListener = function () {
            this.parent.on(index_1.formulaBar, this.createFormulaBar, this);
            this.parent.on(index_2.click, this.formulaBarClickHandler, this);
            this.parent.on(event_1.keyDown, this.keyDownHandler, this);
            this.parent.on(event_1.renderInsertDlg, this.renderInsertDlg, this);
            this.parent.on(event_1.keyUp, this.keyUpHandler, this);
            this.parent.on(index_5.selectionComplete, this.formulaBarUpdateHandler, this);
            this.parent.on(index_2.mouseUpAfterSelection, this.UpdateValueAfterMouseUp, this);
            this.parent.on(event_1.formulaBarOperation, this.editOperationHandler, this);
            this.parent.on(index_1.enableFormulaInput, this.disabletextarea, this);
            this.parent.on(index_6.isFormulaBarEdit, this.isFormulaBarEdit, this);
        };
        FormulaBar.prototype.destroy = function () {
            this.removeEventListener();
            Eif (this.comboBoxInstance) {
                this.comboBoxInstance.destroy();
            }
            this.comboBoxInstance = null;
            this.categoryCollection = null;
            this.formulaCollection = null;
            this.dialog = null;
            this.isGoto = null;
            Eif (this.insertFnRipple) {
                this.insertFnRipple();
            }
            this.insertFnRipple = null;
            var formulaPanel = this.parent.element.querySelector('.e-formula-bar-panel');
            Eif (formulaPanel) {
                index_6.removeAllChildren(formulaPanel);
                ej2_base_1.detach(formulaPanel);
            }
            this.parent = null;
        };
        FormulaBar.prototype.removeEventListener = function () {
            if (!this.parent.isDestroyed) {
                this.parent.off(index_1.formulaBar, this.createFormulaBar);
                this.parent.off(index_2.click, this.formulaBarClickHandler);
                this.parent.off(event_1.renderInsertDlg, this.renderInsertDlg);
                this.parent.off(event_1.keyDown, this.keyDownHandler);
                this.parent.off(event_1.keyUp, this.keyUpHandler);
                this.parent.off(index_5.selectionComplete, this.formulaBarUpdateHandler);
                this.parent.off(index_2.mouseUpAfterSelection, this.UpdateValueAfterMouseUp);
                this.parent.off(event_1.formulaBarOperation, this.editOperationHandler);
                this.parent.off(index_1.enableFormulaInput, this.disabletextarea);
                this.parent.off(index_6.isFormulaBarEdit, this.isFormulaBarEdit);
            }
        };
        FormulaBar.prototype.editOperationHandler = function (args) {
            switch (args.action) {
                case 'refreshFormulabar':
                    if (args.cell) {
                        this.getFormulaBar().value = this.getFormulaBarValue(args.cell);
                    }
                    else {
                        this.getFormulaBar().value = ej2_base_2.isUndefined(args.value) ? '' : args.value;
                    }
                    break;
                case 'getElement':
                    args.element = this.getFormulaBar();
                    break;
            }
        };
        FormulaBar.prototype.isFormulaBarEdit = function (args) {
            var edit = this.parent.isEdit;
            if (edit && this.isGoto) {
                args.isEdit = true;
            }
            else {
                args.isEdit = false;
            }
        };
        FormulaBar.prototype.getFormulaBar = function () {
            return ej2_base_1.select('#' + this.parent.element.id + '_formula_input', this.parent.element);
        };
        return FormulaBar;
    }());
    exports.FormulaBar = FormulaBar;
});