WebBuild/wwwroot/apps/collaboration/components/sheets/ribbon.js

var Unibase;
(function (Unibase) {
    let Apps;
    (function (Apps) {
        let Collaboration;
        (function (Collaboration) {
            let Components;
            (function (Components) {
                let Sheets;
                (function (Sheets) {
                    class Ribbon {
                        constructor() {
                            this.hederText = {};
                            this.imageInCell = false;
                        }
                        init(result) {
                            this.result = result;
                            this.FileName = this.result.FileTitle;
                            this.FileId = this.result.FileId;
                            this.documentGroup = this.result.DocumentGroup;
                            this.documentId = this.result.DocumentId;
                            this.filepath = this.result.TempFilePath;
                            this.fileDownload = Unibase.Apps.Collaboration.Components.Common.Download.Instance();
                            this.base = Unibase.Apps.Collaboration.Components.Sheets.Base.Instance();
                            this.dialogue = Unibase.Apps.Collaboration.Components.Sheets.Dialogue.Instance();
                            this.spreadsheetMenuBar(this.FileId, this.documentGroup, this.FileName);
                            this.dialogue.init(this.base);
                        }
                        addListeners() {
                        }
                        destroy() {
                        }
                        removeListeners() {
                        }
                        renderOpenNewDialogue() {
                            this.importOpenSelectButton = new ej.buttons.Button({ cssClass: `e-flat` });
                            this.importOpenCancelButton = new ej.buttons.Button({ cssClass: `e-flat` });
                            var elem = document.getElementById("importopenfile");
                            if (elem == null) {
                                this.ssImportOpenDialougObj = new ej.popups.Dialog({
                                    isModal: true,
                                    header: 'Open File',
                                    content: `<div id='tabobjforopen'></div>`,
                                    target: document.getElementById("container"),
                                    width: '470px',
                                    height: '330px',
                                    animationSettings: { effect: 'Zoom' },
                                    cssClass: "biz-ss-importopen-dialog"
                                });
                                this.ssImportOpenDialougObj.appendTo('#dialog');
                                var tabObjForOpen = new ej.navigations.Tab({
                                    items: [{
                                            header: { 'text': 'Upload' },
                                            content: `<div id="importopenfile-wrapper">
                                        <h2 style="color: #ccc">Drag a file...</h2>
                                        <label id='importopenfilelable'>
                                            select file from device
                                            <br>
                                        <input type="file" name="" id="importopenfile" accept=".xlsx, .xls, .csv" placeholder="select a file from your device" >
                                        </label>
                                            <div id="filename"></div>
                                        </div>

                                        </div>
                                        <button id='importopenfile-select-btn' class='e-disabled'>select</button>
                                        <button  id='importopenfile-cancel-btn'>cancel</button>`
                                        }, {
                                            header: { 'text': 'Drive' },
                                            content: ''
                                        }, {
                                            header: { 'text': 'Recent' },
                                            content: ''
                                        }]
                                });
                                tabObjForOpen.appendTo('#tabobjforopen');
                            }
                            else {
                                this.ssImportOpenDialougObj.show();
                            }
                            this.importOpenDialogcreated();
                        }
                        renderImportDialogue(driveList) {
                            this.importSelectButton = new ej.buttons.Button({ cssClass: `e-flat` });
                            this.importCancelButton = new ej.buttons.Button({ cssClass: `e-flat` });
                            var elem = document.getElementById("tabobj");
                            let height = window.innerHeight - 200;
                            let width = window.innerWidth - 600;
                            if (elem == null) {
                                this.ssImportDialougObj = new ej.popups.Dialog({
                                    isModal: true,
                                    header: 'Import File',
                                    content: `<div id='tabobj'></div>`,
                                    target: document.getElementById("container"),
                                    width: width + 'px',
                                    height: height + 'px',
                                    animationSettings: { effect: 'Zoom' },
                                    cssClass: "biz-ss-import-dialog"
                                });
                                this.ssImportDialougObj.appendTo('#dialog');
                                var tabObj = new ej.navigations.Tab({
                                    selected: this.tabSelected.bind(this),
                                    items: [{
                                            header: { 'text': 'Upload' },
                                            content: `<div id="importfile-wrapper">
                                        <h2 style="color: #ccc">Drag a file...</h2>
                                        <label id='importfilelable'>
                                            select file from device
                                            <br>
                                        <input type="file" name="" id="importfile" accept=".xlsx, .xls, .csv" placeholder="select a file from your device" >
                                        </label>
                                            <div id="filename"></div>
                                        </div>

                                        </div>
                                        <button id='importfile-upload-select-btn' class='e-disabled'>select</button>
                                        <button  id='importfile-upload-cancel-btn'>cancel</button>`
                                        }, {
                                            header: { 'text': 'Drive' },
                                            content: driveList,
                                        }, {
                                            header: { 'text': 'Recent' },
                                            content: ''
                                        }]
                                });
                                tabObj.appendTo('#tabobj');
                            }
                            else {
                                this.ssImportDialougObj.show();
                            }
                            this.importDialogcreated();
                        }
                        renderCloudSavedDialogue() {
                            var elem = document.getElementById("biz-ss-cloudsave-container");
                            if (elem == null) {
                                this.ssCloudSavedDialougObj = new ej.popups.Dialog({
                                    isModal: false,
                                    content: `<div id="biz-ss-cloudsave-container"  style="max-width: 420px;min-width: 320px;padding: 10px;border-radius: 10px;display: block;border: 1px solid;" >
                                                    <div id="biz-ss-cloudsave-container-title" style = "font-size: 15px;border-color: green;color: green;background-color: #e6f4ea;min-height: 40px;padding: 10px;" >
                                                            <img class="biz-ss-cloudsave-container-img" src="imgs/cloud-computing.svg" >
                                                                All changes saved to Drive
                                                    </div>
                                                    <div id="biz-ss-cloudsave-container-body" style = "padding: 10px;font-size: 10px;">
                                                            Every change you make is automatically saved to Drive.
                                                    </div>
                                               </div>`,
                                    target: document.getElementById("container"),
                                    width: '340px',
                                    height: '95px',
                                    animationSettings: { effect: 'Zoom' },
                                    cssClass: "biz-ss-cloudsave-container",
                                    position: { X: 260, Y: 34 },
                                });
                                this.ssCloudSavedDialougObj.appendTo('#dialog');
                            }
                            else {
                                this.ssCloudSavedDialougObj.show();
                            }
                            document.getElementById('dialog_dialog-content').style.padding = "0px";
                            document.getElementById('dialog_dialog-content').style.borderRadius = "10px";
                        }
                        renderCloudSavingDialogue() {
                            var elem = document.getElementById("biz-ss-cloudloading-container");
                            if (elem == null) {
                                this.ssCloudSavingDialougObj = new ej.popups.Dialog({
                                    isModal: false,
                                    content: `<div id="biz-ss-cloudloading-container"  style="max-width: 420px;min-width: 320px;padding: 10px;border-radius: 10px;display: block;border: 1px solid;" >
                                                    <div id="biz-ss-cloudloading-container-title" style = "font-size: 15px;border-color: green;color: green;background-color: #e6f4ea;min-height: 40px;padding: 10px;" >
                                                            <div class="biz-ss-cloudloading-container-img e-icons">
                                                            </div>
                                                           Saving...
                                                    </div>
                                                    <div id="biz-ss-cloudloading-container-body" style = "padding: 10px;font-size: 10px;">
                                                            Every change you make is automatically saved to Drive.
                                                    </div>
                                               </div>`,
                                    target: document.getElementById("container"),
                                    width: '340px',
                                    height: '95px',
                                    animationSettings: { effect: 'Zoom' },
                                    cssClass: "biz-ss-cloudloading-container",
                                    position: { X: 260, Y: 34 },
                                });
                                this.ssCloudSavingDialougObj.appendTo('#dialog');
                            }
                            else {
                                this.ssCloudSavingDialougObj.show();
                            }
                            document.getElementById('dialog_dialog-content').style.padding = "0px";
                            document.getElementById('dialog_dialog-content').style.borderRadius = "10px";
                        }
                        tabSelected(args) {
                            if (args.selectedItem.firstElementChild.firstElementChild.textContent == "Drive") {
                                this.importSelectButton.appendTo('#importfile-drive-select-btn');
                                this.importCancelButton.appendTo('#importfile-drive-cancel-btn');
                                let dailogHeight = document.getElementsByClassName("biz-ss-import-dialog")[0].offsetHeight;
                                document.getElementsByClassName("biz_drive_list")[0].style.height = dailogHeight - 165 + "px";
                            }
                        }
                        openSpreadSheetDocument() {
                            Unibase.Apps.Collaboration.DocumentManager.Instance().importCreateSpreadSheet(this.spreadsheetImportedFileData).then((response) => {
                                var result = response.result;
                                this.ssImportOpenDialougObj.hide();
                            });
                        }
                        importSpreadSheetDocument() {
                            Unibase.Apps.Collaboration.DocumentManager.Instance().importCreateSpreadSheet(this.spreadsheetImportedFileData).then((response) => {
                                var result = response.result;
                                var newtaburl = this._url + result + "/Excel/0";
                                document.getElementById('sucessfullmessage').style.display = 'inline-block';
                                document.getElementById('importcreatenewdocument').setAttribute('href', newtaburl);
                            });
                        }
                        importReplaceSpreadSheet() {
                            Unibase.Apps.Collaboration.DocumentManager.Instance().importReplaceSpreadSheet(this.spreadsheetImportedReplaceFileData).then((response) => {
                                this.base.ssObj.destroy();
                                this.base.filedata = JSON.parse(response.result[0]);
                                this.base.customresult = JSON.parse(response.result[1]);
                                this.base.unwireEvents();
                                this.base.unwireBootStrapKeyEvent();
                                this.base.ssRender();
                                this.ssImprotedFileDailogueObj.hide();
                                this.importedFile.value = null;
                                let args = { action: 'importReplace', origin: 'biz', };
                                this.base.bizSignalr(args);
                            });
                        }
                        insertSheet() {
                            Unibase.Apps.Collaboration.DocumentManager.Instance().insertNewSpreadsheet(this.spreadsheetImportedFileData).then((response) => {
                                let importedStr = response.result[0];
                                let importedSheets = JSON.parse(importedStr).Workbook.sheets;
                                this.base.ssObj.saveAsJson().then((e) => {
                                    let wb = e.jsonObject;
                                    let curentSheets = wb.Workbook.sheets;
                                    let sheetNames = [];
                                    for (let i = 0; i < curentSheets.length; i++) {
                                        sheetNames.push(curentSheets[i].name);
                                    }
                                    for (let i = 0; i < importedSheets.length; i++) {
                                        let name = importedSheets[i].name;
                                        importedSheets[i].name = this.generateSheetName(sheetNames, name);
                                    }
                                    curentSheets = curentSheets.concat(importedSheets);
                                    wb.Workbook.sheets = curentSheets;
                                    this.base.removeSheetIndexProp(wb.Workbook);
                                    this.base.ssObj.openFromJson({ file: wb });
                                });
                                this.ssImprotedFileDailogueObj.hide();
                            });
                        }
                        documentCopy() {
                            var data = {
                                FileId: this.FileId,
                                FileName: this.FileName,
                            };
                            this.copyDocumentDataDailog(data);
                        }
                        copyDocumentDataDailog(data) {
                            var copyDocumentOk = new ej.buttons.Button({ cssClass: `e-flat`, content: 'OK' });
                            var copyDocumentCancel = new ej.buttons.Button({ cssClass: `e-flat`, content: 'Cancel' });
                            let inputobj = new ej.inputs.TextBox({ placeholder: 'Enter Document Name', floatLabelType: 'Auto' });
                            this._url = window.location.origin + "/#/documents/";
                            var elem = document.getElementById("copyobj");
                            if (elem == null) {
                                this.copyDocumentDailogue = new ej.popups.Dialog({
                                    isModal: true,
                                    header: 'Copy Document',
                                    content: `<div id='copyobj'><div id='copy-document-container'>
                                            <div id='copy-document-div'>
                                            <div class='row'>
                                            <div class='col-md-12'>
                                            <input id='copydocument-textbox' type='text' value='Copy Of ` + data.FileName + `'/>
                                            </div></div>
                                            <div id='sucessfullmessagecopy' style="display:none">File imported successfully. <a id="spreadsheetopennowcopy" target="_blank">Open now »</a></div>
                                            </div></div>
                                            <br><br>
                                            <br>
                                            <button id="copy-document-ok-btn" class="pull-right"></button>
                                            <button id="copy-document-close-btn" class="pull-right"></button>
                                            </div>`,
                                    target: document.getElementById("container"),
                                    placeholder: "Please Enter File Name",
                                    popupHeight: "100px",
                                    width: '350px',
                                    height: '250px',
                                    animationSettings: { effect: 'Zoom' },
                                });
                                this.copyDocumentDailogue.appendTo('#copydocument-container');
                                copyDocumentOk.appendTo('#copy-document-ok-btn');
                                copyDocumentCancel.appendTo('#copy-document-close-btn');
                                inputobj.appendTo("#copydocument-textbox");
                                this.copyDocumentDailogue.show();
                                document.getElementById('copy-document-ok-btn').addEventListener('click', () => {
                                    var FileId = this.FileId;
                                    var FileName = $("#copydocument-textbox").val();
                                    var data = {
                                        FileId: FileId,
                                        FileTitle: FileName,
                                    };
                                    Unibase.Apps.Collaboration.FileManager.Instance().copyFile(data).then((response) => {
                                        var result = response.result;
                                        this.copyDocumentDailogue.destroy();
                                    });
                                });
                                document.getElementById('copy-document-close-btn').addEventListener('click', () => {
                                    this.copyDocumentDailogue.hide();
                                });
                            }
                            else {
                                this.copyDocumentDailogue.show();
                            }
                        }
                        spreadSheetTrim() {
                            let range = this.base.ssObj.biz.getIndexes();
                            this.base.ssObj.updateUndoRedoCollection({ name: 'bizAction', args: { action: 'trim', range: range, oldCells: this.base.getCellsFromIndexes(range) } });
                            let count = this.processTrim(range);
                            this.setSpreadsheettrimDialouge(count);
                            let args = { range: range, action: 'trim', origin: 'biz', sheetIndex: this.base.getSheetIndex() };
                            Unibase.Apps.Collaboration.Components.Sheets.Base.Instance().bizSignalr(args);
                        }
                        processTrim(ranges) {
                            var sheet = this.base.ssObj.biz.getActiveSheet();
                            var fromRowCell = ranges[0];
                            var fromColumnCell = ranges[1];
                            var toRowCell = ranges[2];
                            var toColumnCell = ranges[3];
                            var count = 0;
                            for (var i = fromRowCell; i <= toRowCell; i++) {
                                if (!sheet.rows[i]) {
                                    continue;
                                }
                                for (var j = fromColumnCell; j <= toColumnCell; j++) {
                                    var rowandcell = { rowindex: i, cellindex: j };
                                    var cellObj = ej.spreadsheet.getCell(rowandcell.rowindex, rowandcell.cellindex, sheet);
                                    if (cellObj && cellObj.value != null) {
                                        if (cellObj.value.indexOf('  ') >= 0) {
                                            cellObj.value = cellObj.value.replace(/\s+/g, ' ');
                                            ;
                                            cellObj.value = cellObj.value.trim();
                                            this.base.ssObj.biz.setCell(rowandcell.rowindex, rowandcell.cellindex, sheet, cellObj);
                                            count++;
                                        }
                                        else if (cellObj.value.indexOf(' ') == 0) {
                                            cellObj.value = cellObj.value.trim();
                                            this.base.ssObj.biz.setCell(rowandcell.rowindex, rowandcell.cellindex, sheet, cellObj);
                                            count++;
                                        }
                                        else {
                                            continue;
                                        }
                                    }
                                    else {
                                        continue;
                                    }
                                }
                            }
                            return count;
                        }
                        setSpreadsheettrimDialouge(count) {
                            var temp = 0;
                            if (temp != count) {
                                temp = count;
                            }
                            var countPara = "";
                            if (temp > 1) {
                                countPara = `Trimmed whitespace from the ` + temp + ` selected cells.`;
                            }
                            else if (temp == 1) {
                                countPara = `Trimmed whitespace from the ` + temp + ` selected cell.`;
                            }
                            else if (temp == 0) {
                                countPara = `No selected cells had whitespace trimmed.`;
                            }
                            var elem = document.getElementById("trimobj");
                            if (elem == null) {
                                this.spreadhsheetTrimDialog = new ej.popups.Dialog({
                                    isModal: true,
                                    content: `<div id='trimobj'><div id="trimdialoguebox1"><p id="trimpara">` + countPara + `</p>
                                        <button id='spreadsheettrimedok' class='btn btn-secondary btn-sm pull-right'>Ok</button></div>`,
                                    target: document.getElementById("container"),
                                    width: '500px',
                                    height: '100px',
                                    animationSettings: { effect: 'Zoom' },
                                });
                                this.spreadhsheetTrimDialog.appendTo('#spreadsheettrim-container');
                                document.getElementById('spreadsheettrimedok').addEventListener('click', () => {
                                    this.spreadhsheetTrimDialog.hide();
                                });
                            }
                            else {
                                document.getElementById("trimpara").innerHTML = '';
                                document.getElementById("trimpara").innerHTML = countPara;
                                this.spreadhsheetTrimDialog.show();
                            }
                            (temp != 0) && Unibase.Apps.Collaboration.Components.Common.Download.Instance().ssAutoSave({ action: "trim", eventArgs: {} }, this.base, true);
                        }
                        generateSheetName(names, name) {
                            if (names.indexOf(name) < 0) {
                                return name;
                            }
                            let i = 1;
                            while (names.indexOf(name + ' (' + i + ')') > -1) {
                                i++;
                            }
                            return name + ' (' + i + ')';
                        }
                        importOpenDialogcreated() {
                            document.getElementById('importopenfile-select-btn').setAttribute("disabled", 'true');
                            document.getElementById('importopenfile-select-btn').addEventListener('click', () => {
                                this.openSpreadSheetDocument();
                                this.ssImportOpenDialougObj.destroy();
                            });
                            document.getElementById('importopenfile-cancel-btn').addEventListener('click', () => {
                                this.ssImportOpenDialougObj.hide();
                                document.getElementById('importopenfile-select-btn').classList.add('e-disabled');
                                document.getElementById('filename').innerHTML = "";
                                (this.importedFile) && (this.importedFile.value = null);
                                if (this.ssImportOpenDialougObj) {
                                    this.ssImportOpenDialougObj.destroy();
                                    this.ssImportOpenDialougObj = null;
                                }
                            });
                            this.importOpenSelectButton.appendTo('#importopenfile-select-btn');
                            this.importOpenCancelButton.appendTo('#importopenfile-cancel-btn');
                            document.body.addEventListener('dragover', (e) => {
                                e.preventDefault();
                            });
                            document.getElementsByClassName('biz-ss-importopen-dialog')[0].addEventListener('dragover', (e) => {
                                e.preventDefault();
                            });
                            document.getElementsByClassName('biz-ss-importopen-dialog')[0].addEventListener("drop", (e) => {
                                e.preventDefault();
                                document.getElementById('importopenfile').files = e.dataTransfer.files;
                                var ele = { target: { files: e.dataTransfer.files } };
                                this.openFileSelected(ele);
                            });
                            document.getElementById('importopenfile').addEventListener('change', (e) => {
                                debugger;
                                this.openFileSelected(e);
                            });
                        }
                        importDialogcreated() {
                            document.getElementById('importfile-upload-select-btn').setAttribute("disabled", 'true');
                            let ele = document.getElementById("importfile-wrapper");
                            ele.style.height = window.innerHeight - 375 + "px";
                            ele.style.width = window.innerWidth - 635 + "px";
                            document.getElementById('importfile-upload-select-btn').addEventListener('click', () => {
                                this.ssImportDialougObj.hide();
                                this.ssimportedFileDataDailog();
                                document.getElementById('filename').innerHTML = "";
                                document.getElementById('importedfilename').innerHTML = this.importedFile.files[0].name;
                            });
                            document.getElementById('importfile-upload-cancel-btn').addEventListener('click', () => {
                                this.ssImportDialougObj.hide();
                                document.getElementById('importfile-upload-select-btn').classList.add('e-disabled');
                                document.getElementById('filename').innerHTML = "";
                                (this.importedFile) && (this.importedFile.value) && (this.importedFile.value = null);
                                if (this.ssImportDialougObj) {
                                    this.ssImportDialougObj.destroy();
                                    this.ssImportDialougObj = null;
                                }
                            });
                            this.importSelectButton.appendTo('#importfile-upload-select-btn');
                            this.importCancelButton.appendTo('#importfile-upload-cancel-btn');
                            document.body.addEventListener('dragover', (e) => {
                                e.preventDefault();
                            });
                            document.getElementsByClassName('biz-ss-import-dialog')[0].addEventListener('dragover', (e) => {
                                e.preventDefault();
                            });
                            document.getElementsByClassName('biz-ss-import-dialog')[0].addEventListener("drop", (e) => {
                                e.preventDefault();
                                document.getElementById('importfile').files = e.dataTransfer.files;
                                var ele = { target: { files: e.dataTransfer.files } };
                                this.fileSelected(ele);
                            });
                            document.getElementById('importfile').addEventListener('change', (e) => {
                                this.fileSelected(e);
                            });
                            document.getElementsByClassName('biz-ss-import-dialog')[0].style.maxHeight = "";
                        }
                        getAll(parentid) {
                            let driveList = ``;
                            Unibase.Platform.Helpers.FileCacheHelper.Instance().loadJsFile("apps/collaboration/managers/filemanager.js", () => {
                                Unibase.Apps.Collaboration.FileManager.Instance().getAll(parentid).then((response) => {
                                    let folders = response.result.Folders;
                                    let foldershtml = ``;
                                    for (let i = 0; i < folders.length; i++) {
                                        var foldername = folders[i].FolderName;
                                        folders[i].FolderName = folders[i].Title;
                                        if (folders[i].FolderName == null) {
                                            folders[i].FolderName = foldername;
                                        }
                                        foldershtml += `<li class="list-group-item copyto_list copyto_folder" id="li_folder_` + folders[i].FolderId + `" style="border: none;cursor:pointer;font-size:14px;"><a onclick="Unibase.Apps.Collaboration.Components.UniCloud.Instance().getFolderItems(` + folders[i].FolderId + `,'` + folders[i].FolderName + `',` + true + `)"><i class="fa fa-folder mr-15 text-light"></i>  ` + folders[i].FolderName + `<i class="fa fa-angle-right pull-right"></i></a></li>`;
                                    }
                                    let fileshtml = ``;
                                    let files = response.result.Files;
                                    for (let i = 0; i < files.length; i++) {
                                        fileshtml += `<li class="list-group-item copyto_list copyto_file " id="li_file_` + files[i].FileId + `" style="border: none;cursor:pointer;font-size:14px;"  onselect="this.style.background='#e5e5e5'"> <a onclick=""><div class="d-flex flex-row " > <img src="/tenants/default/documenttypes/sheet.svg"  data-dynamic="1" data-loaded="0" alt = "filetype" onerror = "ReloadImage(event)" class="w-25p h-25p img-fluid mr-10" > <span class="text-truncate importfile-drive-filename" > ` + files[i].FileTitle + ` </span> </div ></a></li>`;
                                    }
                                    if (!this.ssImportDialougObj) {
                                        driveList = `<div class="biz_drive_list">
                                                  <ul class="list-group" id="biz_drive_foldersList">` + foldershtml + ` </ul>
                                                   <ul class="list-group" id="biz_drive_filesList">` + fileshtml + `</ul>
                                                     <div id="div_createfolder" class="hidden row"><i class="fa fa-arrow-left col-sm-1 mt-10" id="back_create"
                                                    onclick=" Unibase.Apps.Collaboration.Components.UniCloud.Instance().getAll(` + Unibase.Apps.Collaboration.Components.UniCloud.Instance().selectedfolderid + `)"></i>
                                                    <input type="text" class="form-control col-sm-11" placeholder="Folder Name" id="createfolder"></div></div>
                                                    <div class="pull-down">
                                                        <button id='importfile-drive-select-btn' class='e-disabled'>select</button>
                                                        <button  id='importfile-drive-cancel-btn'>cancel</button></div>`;
                                        this.renderImportDialogue(driveList);
                                    }
                                    else {
                                        if (document.getElementById("breadcrumb-ul"))
                                            document.getElementById("breadcrumb-ul").remove();
                                        document.getElementById("biz_drive_foldersList") && (document.getElementById("biz_drive_foldersList").innerHTML = "");
                                        document.getElementById("biz_drive_foldersList") && (document.getElementById("biz_drive_foldersList").innerHTML = foldershtml);
                                        document.getElementById("biz_drive_filesList") && (document.getElementById("biz_drive_filesList").innerHTML = "");
                                        document.getElementById("biz_drive_filesList") && (document.getElementById("biz_drive_filesList").innerHTML = fileshtml);
                                    }
                                });
                            });
                        }
                        getFolderList() {
                            Unibase.Platform.Helpers.FileCacheHelper.Instance().loadJsFile("apps/collaboration/managers/filemanager.js", () => {
                                Unibase.Apps.Collaboration.FileManager.Instance().getFolders().then((response) => {
                                    let folders = response.result;
                                    var foldershtml = ``;
                                    for (let i = 0; i <= folders.length; i++) {
                                        foldershtml += `<li class="list-group-item" id="li_folder_` + folders[i].FolderId + `"><a onclick="Unibase.Apps.Collaboration.Components.old_unicloud.Instance().getFolderItems(` + folders[i].FolderId + `,'` + folders[i].FolderName + `')"><input class="hidden" id="hdn_folder_` + folders[i].FolderId + `" value="` + folders[i].FolderId + `"><i class="fa fa-folder mr-15 text-light"></i>` + folders[i].FolderName + `<i class="fa fa-angle-right pull-right"></i></a></li>`;
                                    }
                                    return foldershtml;
                                });
                            });
                        }
                        getFilesList() {
                            Unibase.Platform.Helpers.FileCacheHelper.Instance().loadJsFile("apps/collaboration/managers/filemanager.js", function () {
                                Unibase.Apps.Collaboration.FileManager.Instance().getFiles(0).then((response) => {
                                    var parentid = response.result.Parentid;
                                    var folders = response.result.Folders;
                                    var breadcrumb;
                                    breadcrumb = `<a href="javascript:void(0);" onclick="Unibase.Apps.Collaboration.Components.old_unicloud.Instance().getAll(` + parentid + "," + true + `)"> ` + +` ></a>`;
                                    $("#folder_breadcrumb").append(breadcrumb);
                                    for (let j = 0; j < folders.length; j++) {
                                        var childfolderhtml = `<li class="list-group-item" id="li_childfolder_` + folders[j].FolderId + `" style="border: none;cursor:pointer;font-size:14px;" onmouseover="this.style.background='#e5e5e5'" onmouseout="this.style.background='#FFF'"><a onclick=""><input class="hidden" id="hdn_childfolderid_` + folders[j].FolderId + `" value="` + folders[j].FolderId + `"><i class="fa fa-folder mr-15 text-light"></i> ` + folders[j].FolderName + `</a></li>`;
                                        $("#li_hdn_childfolders:last").after(childfolderhtml);
                                    }
                                    var files = response.result.Files;
                                    $("#ul_filesList").html(`<li class="list-group-item hidden" id="li_hdn_file"></li><li class="list-group-item hidden" id="li_hdn_childfolders"></li> `);
                                    for (let i = 0; i < files.length; i++) {
                                        var fileshtml = `<li class="list-group-item disabled" id="li_file_` + files[i].FileId + `" style="border: none;cursor:pointer;font-size:14px;"><a onclick=""><input class="hidden" id="hdn_file_` + files[i].FileId + `" value="` + files[i].FileId + `"><input class="hidden" id="hdn_file_folderid_` + files[i].FolderId + `" value="` + files[i].FolderId + `"><div class="d-flex flex-row " > <img src="/tenants/default/documenttypes/sheet.svg"  data-dynamic="1" data-loaded="0" alt = "filetype" onerror = "ReloadImage(event)" class="w-25p h-25p img-fluid mr-10" > <span class="text-truncate" > ` + files[i].FileName + ` </span> </div ></a></li>`;
                                        $("#li_hdn_file:last").after(fileshtml);
                                    }
                                });
                                $("#ul_filesList").removeClass("hidden");
                            });
                        }
                        getFolderItems(folderid, foldername, copyto) {
                            let fldrname = foldername;
                            Unibase.Platform.Helpers.FileCacheHelper.Instance().loadJsFile("apps/collaboration/managers/filemanager.js", () => {
                                Unibase.Apps.Collaboration.FileManager.Instance().getFiles(folderid).then((response) => {
                                    debugger;
                                    let parentid = response.result.Parentid;
                                    let breadcrumb = `<ul id="breadcrumb-ul"><li id="breadcrumb-li"><a href="javascript:void(0);" onclick="Unibase.Apps.Collaboration.Components.Sheets.Ribbon.Instance().getAll(` + parentid + `)"> ` + fldrname + ` ></a></li></ul>`;
                                    $(".biz_drive_list").empty();
                                    let folders = response.result.Folders;
                                    let foldershtml = ``;
                                    for (let i = 0; i < folders.length; i++) {
                                        var foldername = folders[i].FolderName;
                                        folders[i].FolderName = folders[i].Title;
                                        if (!folders[i].FolderName)
                                            folders[i].FolderName = foldername;
                                        foldershtml += `<li class="list-group-item copyto_list copyto_folder" id="li_folder_` + folders[i].FolderId + `" style="border: none;cursor:pointer;font-size:14px;"><a onclick="Unibase.Apps.Collaboration.Components.old_unicloud.Instance().getFolderItems(` + folders[i].FolderId + `,'` + folders[i].FolderName + `',` + true + `)"><i class="fa fa-folder mr-15 text-light"></i>  ` + folders[i].FolderName + `<i class="fa fa-angle-right pull-right"></i></a></li>`;
                                    }
                                    let fileshtml = ``;
                                    let files = response.result.Files;
                                    for (let i = 0; i < files.length; i++) {
                                        fileshtml += `<li class="list-group-item copyto_list copyto_file " id="li_file_` + files[i].FileId + `" style="border: none;cursor:pointer;font-size:14px;"  onselect="this.style.background='#e5e5e5'"> <a onclick=""><div class="d-flex flex-row " > <img src="/tenants/default/documenttypes/sheet.svg"  data-dynamic="1" data-loaded="0" alt = "filetype" onerror = "ReloadImage(event)" class="w-25p h-25p img-fluid mr-10" > <span class="text-truncate" > ` + files[i].FileTitle + ` </span> </div ></a></li>`;
                                    }
                                    let html = breadcrumb + `<ul class="list-group" id="biz_drive_foldersList">` + foldershtml + ` </ul>
                                                   <ul class="list-group" id="biz_drive_filesList">` + fileshtml + `</ul>`;
                                    $(".biz_drive_list").append(html);
                                });
                            });
                        }
                        openFileSelected(e) {
                            document.getElementById('importopenfile-select-btn').removeAttribute('disabled');
                            document.getElementById('importopenfile-select-btn').classList.remove('e-disabled');
                            this.importedFile = document.getElementById('importopenfile');
                            document.getElementById('filename').innerHTML = this.importedFile.files[0].name;
                            Unibase.Platform.Helpers.FileCacheHelper.Instance().loadJsFile('platform/core/helpers/file/filehelper.js', () => {
                                Unibase.Platform.Helpers.FileHelper.Instance().getBase64(e).then((response) => {
                                    if (Unibase.Themes.Providers.Detail_Settings.Instance().InputParameters.length != 0) {
                                        var InstalledAppId = Unibase.Themes.Providers.DetailHelper.installedAppId;
                                        var refId = Number(Unibase.Themes.Providers.Detail_Settings.Instance().InputParameters.find(x => x.Key == "hf_" + InstalledAppId + "_recordid").Value);
                                        if (refId != 0 && refId != null && refId != undefined) {
                                        }
                                    }
                                    var fileobject = {
                                        filedata: response.FileData,
                                        filename: response.FileName,
                                        filetype: response.FileType,
                                        RefId: refId,
                                        FileId: this.FileId,
                                        Upload: true,
                                    };
                                    this.spreadsheetImportedFileData = fileobject;
                                });
                            });
                        }
                        fileSelected(e) {
                            document.getElementById('importfile-upload-select-btn').removeAttribute('disabled');
                            document.getElementById('importfile-upload-select-btn').classList.remove('e-disabled');
                            this.importedFile = document.getElementById('importfile');
                            document.getElementById('filename').innerHTML = this.importedFile.files[0].name;
                            Unibase.Platform.Helpers.FileCacheHelper.Instance().loadJsFile('platform/core/helpers/file/filehelper.js', () => {
                                Unibase.Platform.Helpers.FileHelper.Instance().getBase64(e).then((response) => {
                                    if (Unibase.Themes.Providers.Detail_Settings.Instance().InputParameters.length != 0) {
                                        var InstalledAppId = Unibase.Themes.Providers.DetailHelper.installedAppId;
                                        var refId = Number(Unibase.Themes.Providers.Detail_Settings.Instance().InputParameters.find(x => x.Key == "hf_" + InstalledAppId + "_recordid").Value);
                                        if (refId != 0 && refId != null && refId != undefined) {
                                        }
                                    }
                                    var fileobject = {
                                        filedata: response.FileData,
                                        filename: response.FileName,
                                        filetype: response.FileType,
                                        RefId: refId,
                                        FileId: this.FileId,
                                        Upload: true,
                                    };
                                    this.spreadsheetImportedFileData = fileobject;
                                    var fileobjectreplace = {
                                        filedata: response.FileData,
                                        filename: response.FileName,
                                        filetype: response.FileType,
                                        RefId: refId,
                                        FileId: this.FileId,
                                        FilePath: this.filepath,
                                        Upload: true,
                                    };
                                    this.spreadsheetImportedReplaceFileData = fileobjectreplace;
                                });
                            });
                        }
                        spreadsheetMenuBar(FileId, documentGroup, filename) {
                            var menuItems = [
                                {
                                    text: 'File',
                                    items: [
                                        { text: 'New', iconCss: 'e-icons add-new' },
                                        { text: 'Open', iconCss: 'e-icons e-open' },
                                        { text: 'Import', iconCss: 'e-icons e-import', cssClass: "menuitem-viewonly" },
                                        { text: 'Make a copy', iconCss: 'e-icons e-makeacopy' },
                                        {
                                            text: 'Download', iconCss: 'e-icons e-save', items: [
                                                { text: 'Microsoft excel (.xlsx)', iconCss: 'e-icons M_ExcelExport' },
                                                { text: 'Microsoft excel 97-2003 (.xls)', iconCss: 'e-icons M_ExcelExport' },
                                                { text: 'Comma-Seperated values (.csv)', iconCss: 'e-icons M_CSVExport' },
                                                { text: 'PDF document (.pdf)', iconCss: 'e-icons M_PDF' },
                                                { text: 'OpenDocument spreadsheet (.ods)', iconCss: 'e-icons M_ODS' },
                                            ]
                                        },
                                        { text: 'Close', iconCss: 'e-icons cross-close' },
                                    ]
                                },
                                {
                                    text: 'Edit',
                                    items: [
                                        { text: 'Undo', iconCss: "e-icons MT_Undo" },
                                        { text: 'Redo', iconCss: "e-icons MT_Redo" },
                                        { text: 'Cut', iconCss: "e-icons MT_Cut" },
                                        { text: 'Copy', iconCss: "e-icons MT_Copy" },
                                        { text: 'Paste', iconCss: "e-icons MT_Paste" },
                                        { text: 'Special paste', iconCss: "e-icons MT_Paste", items: [{ text: 'All' }, { text: 'Values' }, { text: 'Formats' }] },
                                        { text: 'Find and replace', iconCss: "e-icons MT_Search" },
                                        { text: 'Delete value' },
                                        { text: 'Delete row' },
                                        { text: 'Delete column' },
                                        { text: 'Delete cells and shift up' },
                                        { text: 'Delete cells and shift left' },
                                        { text: 'Clear Notes' },
                                    ]
                                },
                                {
                                    text: 'View',
                                    items: [
                                        {
                                            text: 'Freeze', iconCss: 'e-icons b_freezepane', items: [
                                                { text: 'No rows' }, { text: '1 row' }, { text: '2 rows' }, { text: 'Upto current row ()' }, { separator: true },
                                                { text: 'No columns' }, { text: '1 column' }, { text: '2 columns' }, { text: 'Upto current column ()' }, { separator: true },
                                                { text: 'Freeze panes' },
                                            ]
                                        },
                                        { separator: true },
                                        { text: 'Hide headers', iconCss: 'e-icons e-hideheadings' },
                                        { text: 'Hide gridlines', iconCss: 'e-icons e-hidegridlines' },
                                        { separator: true },
                                        { text: 'Formula bar', iconCss: 'e-icons ' },
                                        { text: 'Show formula', iconCss: 'e-icons ' },
                                        { separator: true },
                                        {
                                            text: 'Hidden sheets', iconCss: 'e-icons ', items: [
                                                { text: 'dummyHiddenSheet' }
                                            ]
                                        },
                                        { separator: true },
                                        { text: 'Full screen', iconCss: 'e-icons biz-enterfullscreen' },
                                    ]
                                },
                                {
                                    text: 'Insert',
                                    items: [
                                        { text: 'Row above' },
                                        { text: 'Row below' },
                                        { separator: true },
                                        { text: 'Column left' },
                                        { text: 'Column right' },
                                        { separator: true },
                                        { text: 'Cells and shift down' },
                                        { text: 'Cells and shift right' },
                                        { separator: true },
                                        { text: 'Link', iconCss: 'e-icons e-hyperlink' },
                                        { text: 'Note', iconCss: 'e-icons biz-comment-icon' },
                                        { text: 'Function', iconCss: 'e-icons f_formulafunction' },
                                        {
                                            text: 'Image', iconCss: 'e-icons b_image',
                                            items: [
                                                { text: 'Image in cell' },
                                                { text: 'Image over cells' },
                                            ]
                                        },
                                        {
                                            text: 'Chart', iconCss: 'e-icons m_chart',
                                            items: [
                                                { text: 'Column', iconCss: 'e-icons m_3d_column2', items: [{ text: 'Clustered column' }, { text: 'Stacked column' }, { text: '100% stacked column' }] },
                                                { text: 'Bar', iconCss: 'e-icons b_bar_chart', items: [{ text: 'Clustered bar' }, { text: 'Stacked bar' }, { text: '100% stacked bar' }] },
                                                { text: 'Area', iconCss: 'e-icons b_area_chart', items: [{ text: 'Clustered area' }, { text: 'Stacked area' }, { text: '100% stacked area' }] },
                                                { text: 'Pie/Doughnut', iconCss: 'e-icons f_pie_chart', items: [{ text: 'Pie' }, { text: 'Doughnut' }] },
                                                { text: 'Line', iconCss: 'e-icons f_2d_line6', items: [{ text: 'Clustered line' }, { text: 'Stacked line' }, { text: '100% stacked line' }] },
                                                { text: 'Scatter', iconCss: 'e-icons b_more_scatter_charts', items: [{ text: 'Scatter chart' }] }
                                            ]
                                        },
                                    ]
                                },
                                {
                                    text: 'Format',
                                    items: [
                                        {
                                            text: 'Number formatting', iconCss: 'e-icons ', items: [
                                                { text: 'General', iconCss: "e-icons" },
                                                { text: 'Number', iconCss: "e-icons" },
                                                { text: 'Currency', iconCss: "e-icons" },
                                                { text: 'Currency (rounded)', iconCss: "e-icons" },
                                                { text: 'Accounting', iconCss: "e-icons" },
                                                { text: 'Short date', iconCss: "e-icons" },
                                                { text: 'Long date', iconCss: "e-icons" },
                                                { text: 'Time', iconCss: "e-icons" },
                                                { text: 'Percentage', iconCss: "e-icons" },
                                                { text: 'Fraction', iconCss: "e-icons" },
                                                { text: 'Scientific', iconCss: "e-icons" },
                                                { text: 'Text', iconCss: "e-icons" },
                                            ]
                                        },
                                        { text: 'Bold', iconCss: 'e-icons ' },
                                        { text: 'Italic', iconCss: 'e-icons ' },
                                        { text: 'Underline', iconCss: 'e-icons ' },
                                        { text: 'Strikethrough', iconCss: 'e-icons ' },
                                        {
                                            text: 'Font size', iconCss: 'e-icons ', items: [
                                                { text: '8', iconCss: 'e-icons ' },
                                                { text: '9', iconCss: 'e-icons ' },
                                                { text: '10', iconCss: 'e-icons ' },
                                                { text: '11', iconCss: 'e-icons ' },
                                                { text: '12', iconCss: 'e-icons ' },
                                                { text: '14', iconCss: 'e-icons ' },
                                                { text: '16', iconCss: 'e-icons ' },
                                                { text: '18', iconCss: 'e-icons ' },
                                                { text: '20', iconCss: 'e-icons ' },
                                                { text: '22', iconCss: 'e-icons ' },
                                                { text: '24', iconCss: 'e-icons ' },
                                                { text: '26', iconCss: 'e-icons ' },
                                                { text: '28', iconCss: 'e-icons ' },
                                                { text: '36', iconCss: 'e-icons ' },
                                                { text: '48', iconCss: 'e-icons ' },
                                                { text: '72', iconCss: 'e-icons ' },
                                            ]
                                        },
                                        {
                                            text: 'Align', iconCss: 'e-icons ', items: [
                                                { text: 'Left', iconCss: 'e-icons ' },
                                                { text: 'Center', iconCss: 'e-icons ' },
                                                { text: 'Right', iconCss: 'e-icons ' },
                                                { separator: true },
                                                { text: 'Top', iconCss: 'e-icons ' },
                                                { text: 'Middle', iconCss: 'e-icons ' },
                                                { text: 'Bottom', iconCss: 'e-icons ' },
                                            ]
                                        },
                                        {
                                            text: 'Merge cells', iconCss: 'e-icons Merge_cells', items: [
                                                { text: 'Merge all', iconCss: 'e-icons' },
                                                { text: 'Merge vertically', iconCss: 'e-icons' },
                                                { text: 'Merge horizontally', iconCss: 'e-icons' },
                                                { text: 'Unmerge', iconCss: 'e-icons' },
                                            ]
                                        },
                                        { text: 'Wrap text', iconCss: 'e-icons M_Wrap' },
                                        {
                                            text: 'Conditional formatting', iconCss: 'e-icons M_ConditionalFormatting', items: [
                                                {
                                                    text: 'Highlight Cells Rules', items: [
                                                        { text: 'Greater than' },
                                                        { text: 'Less than' },
                                                        { text: 'Between' },
                                                        { text: 'Equal to' },
                                                        { text: 'Text that contains' },
                                                        { text: 'A date occuring' },
                                                        { text: 'Duplicate values' },
                                                    ]
                                                },
                                                {
                                                    text: 'Top/Bottom rules', items: [
                                                        { text: 'Top 10 items' },
                                                        { text: 'Top 10%' },
                                                        { text: 'Bottom 10 items' },
                                                        { text: 'Bottom 10%' },
                                                        { text: 'Above average' },
                                                        { text: 'Below average' },
                                                    ]
                                                },
                                                {
                                                    text: 'Data bars', items: [
                                                        { text: 'Blue data bar' },
                                                        { text: 'Green data bar' },
                                                        { text: 'Red data dar' },
                                                        { text: 'Orange data bar' },
                                                        { text: 'Light blue data bar' },
                                                        { text: 'Purple data bar' },
                                                    ]
                                                },
                                                {
                                                    text: 'Color scales',
                                                    items: [
                                                        { text: 'Green -yellow - red' },
                                                        { text: 'Red - yellow - green' },
                                                        { text: 'Green - white - red' },
                                                        { text: 'Red - white - green' },
                                                        { text: 'Blue - white - red' },
                                                        { text: 'Red - white - Blue' },
                                                        { text: 'White - red' },
                                                        { text: 'Red - white' },
                                                        { text: 'Green - white' },
                                                        { text: 'White - green' },
                                                        { text: 'Green - yellow' },
                                                        { text: 'Yellow - Green' },
                                                    ]
                                                },
                                                {
                                                    text: 'Icon sets',
                                                    items: [
                                                        { text: '3 arrows (colored)' },
                                                        { text: '3 arrows (gray)' },
                                                        { text: '4 arrows (colored)' },
                                                        { text: '4 arrows (gray)' },
                                                        { text: '5 arrows (colored)' },
                                                        { text: '5 arrows (gray)' },
                                                        { text: '3 triangles' },
                                                        { text: '3 triangles lights (unrimmed)' },
                                                        { text: '3 triangles lights (rimmed)' },
                                                        { text: '3 signs' },
                                                        { text: '4 traffic lights' },
                                                        { text: 'Red to black' },
                                                        { text: '3 symbols (circled)' },
                                                        { text: '3 symbols (uncircled)' },
                                                        { text: '3 flags' },
                                                        { text: '3 stars' },
                                                        { text: '5 quarters' },
                                                        { text: '5 quarters' },
                                                        { text: '4 ratings' },
                                                        { text: '5 ratings' },
                                                        { text: '5 boxes' },
                                                    ]
                                                },
                                                {
                                                    text: 'Clear rules', items: [
                                                        { text: 'Selected cells' },
                                                        { text: 'Entire sheet' },
                                                    ]
                                                },
                                            ]
                                        },
                                        {
                                            text: 'Clear formatting', iconCss: 'e-icons M_CFormatting', items: [
                                                { text: 'Clear all' },
                                                { text: 'Clear formats' },
                                                { text: 'Clear contents' },
                                                { text: 'Clear hyperlinks' },
                                            ]
                                        },
                                    ]
                                },
                                {
                                    text: 'Data',
                                    items: [
                                        { text: 'Sort sheet by column asc, A → Z', iconCss: 'e-icons' },
                                        { text: 'Sort sheet by column dsc, Z → A', iconCss: 'e-icons' },
                                        { separator: true },
                                        { text: 'Protect sheet', iconCss: 'e-icons b_protectsheet' },
                                        { text: 'Protect workbook', iconCss: 'e-icons m_protectworkbook' },
                                        { separator: true },
                                        {
                                            text: 'Validation', iconCss: 'e-icons m_datavalidation',
                                            items: [
                                                { text: 'Data validation', iconCss: 'e-icons b_datavalidation' },
                                                { text: 'Highlight invalid data', iconCss: 'e-icons m_pv_highlight' },
                                                { text: 'Clear highlight', iconCss: 'e-icons mt_clearall' },
                                                { text: 'Clear validation', iconCss: 'e-icons mt_clearall' }
                                            ]
                                        },
                                        { separator: true },
                                        { text: 'Remove duplicates' },
                                        { text: 'Split text to columns' },
                                        { text: 'Trim whitespaces' },
                                    ]
                                },
                                {
                                    text: 'Tools',
                                    items: [
                                        { text: 'Spelling' }
                                    ]
                                }
                            ];
                            let ExcelFormat;
                            (function (ExcelFormat) {
                                ExcelFormat[ExcelFormat["Xlsx"] = 0] = "Xlsx";
                                ExcelFormat[ExcelFormat["Xls"] = 1] = "Xls";
                                ExcelFormat[ExcelFormat["CSV"] = 2] = "CSV";
                                ExcelFormat[ExcelFormat["PDF"] = 3] = "PDF";
                                ExcelFormat[ExcelFormat["ODS"] = 4] = "ODS";
                            })(ExcelFormat || (ExcelFormat = {}));
                            ;
                            if (!this.ssMenubarObj) {
                                var menuitems = ['File', 'Edit', 'View', "Insert", "Format", "Formulas", "Data", "Tools"];
                                this.ssMenubarObj = new ej.navigations.Menu({
                                    cssClass: 'biz-ss-menu',
                                    beforeClose: e => {
                                        if (menuitems.indexOf(e.parentItem.text) > -1) {
                                            this.ssMenubarObj.showItemOnClick = true;
                                        }
                                        let hiddensheet = this.base.ssObj.sheets.filter(sheet => sheet.state == "Hidden");
                                        if (hiddensheet.length > 0) {
                                            if (e.parentItem.text === "View") {
                                                let hiddenSheetNames = [];
                                                hiddensheet.forEach(state => hiddenSheetNames.push(state.name));
                                                this.ssMenubarObj.insertBefore([{ text: 'dummyHiddenSheet' }], hiddenSheetNames[0], false);
                                                this.ssMenubarObj.removeItems(hiddenSheetNames, false);
                                            }
                                        }
                                    },
                                    showItemOnClick: true,
                                    beforeItemRender: (ele) => {
                                        let sheet = this.base.ssObj.biz.getActiveSheet();
                                        if (sheet.frozenColumns != 0 || sheet.frozenRows != 0) {
                                            if (ele.item.text == "Freeze panes") {
                                                ele.element.innerHTML = "Unfreeze panes";
                                            }
                                        }
                                        if (!sheet.showHeaders) {
                                            if (ele.item.text == "Hide headers") {
                                                var child = ele.element.firstElementChild;
                                                ele.element.innerHTML = child.outerHTML + "Show Headers";
                                            }
                                        }
                                        if (!sheet.showGridLines) {
                                            if (ele.item.text == "Hide gridlines") {
                                                var child = ele.element.firstElementChild;
                                                ele.element.innerHTML = child.outerHTML + "Show Gridlines";
                                            }
                                        }
                                        if (ele.item.text == "Formula bar") {
                                            let formulaBarDisplay = document.getElementsByClassName("e-formula-bar-panel")[0];
                                            if (formulaBarDisplay.style.display == "") {
                                                this.addOrRemoveSelectIcon(ele);
                                            }
                                        }
                                        var index = this.base.getIndexesFromAddress(sheet.activeCell);
                                        var cellInfo = ej.spreadsheet.getCell(index[0], index[1], sheet);
                                        if (cellInfo) {
                                            if (ele.item.text === "Bold") {
                                                cellInfo.style && (cellInfo.style.fontWeight) && (cellInfo.style.fontWeight.toLowerCase() == "bold") && this.addOrRemoveSelectIcon(ele);
                                            }
                                            if (ele.item.text === "Italic") {
                                                cellInfo.style && (cellInfo.style.fontStyle) && (cellInfo.style.fontStyle.toLowerCase() == "italic") && this.addOrRemoveSelectIcon(ele);
                                            }
                                            if (ele.item.text === "Underline") {
                                                cellInfo.style && (cellInfo.style.textDecoration) && (((cellInfo.style.textDecoration.toLowerCase() == "underline line-through")) || (cellInfo.style.textDecoration.toLowerCase() == "underline")) && this.addOrRemoveSelectIcon(ele);
                                            }
                                            if (ele.item.text === "Strikethrough") {
                                                (cellInfo.style) && (cellInfo.style.textDecoration) && (((cellInfo.style.textDecoration.toLowerCase() == "underline line-through")) || (cellInfo.style.textDecoration.toLowerCase() == "line-through")) && this.addOrRemoveSelectIcon(ele);
                                            }
                                            if (ele.item.text === "Font size") {
                                                this.addOrRemoveSelectIcon(ele);
                                            }
                                            if (ele.item.text === "Wrap text") {
                                                (cellInfo.wrap) && (cellInfo.wrap == true) && this.addOrRemoveSelectIcon(ele);
                                            }
                                            if (ele.item.text === "Number formatting") {
                                                this.addOrRemoveSelectIcon(ele);
                                            }
                                            if (ele.item.text === "Align") {
                                                this.addOrRemoveSelectIcon(ele);
                                            }
                                            if (ele.item.text === "Merge cells") {
                                                (cellInfo.rowSpan || cellInfo.colSpan) && this.addOrRemoveSelectIcon(ele);
                                            }
                                            if (ele.item.text === "Merge all") {
                                                (cellInfo.rowSpan && cellInfo.colSpan) && this.addOrRemoveSelectIcon(ele);
                                            }
                                            if (ele.item.text === "Merge vertically") {
                                                (cellInfo.rowSpan) && this.addOrRemoveSelectIcon(ele);
                                            }
                                            if (ele.item.text === "Merge horizontally") {
                                                (cellInfo.colSpan) && this.addOrRemoveSelectIcon(ele);
                                            }
                                            if (ele.item.text === "General") {
                                                !(cellInfo.format) && this.addOrRemoveSelectIcon(ele);
                                            }
                                            var numberformat = ["General", "Number", "Currency", "Accounting", "Short date", "Long date", "Time", "Percentage", "Fraction", "Scientific", "Text"];
                                            if (numberformat.includes(ele.item.text)) {
                                                if (cellInfo.format) {
                                                    if (ele.item.text === "General") {
                                                        (cellInfo.format.toLowerCase() == "general") && this.addOrRemoveSelectIcon(ele);
                                                    }
                                                    else if (ele.item.text === "Number") {
                                                        (cellInfo.format === "0.00") && this.addOrRemoveSelectIcon(ele);
                                                    }
                                                    else if (ele.item.text === "Currency") {
                                                        (cellInfo.format.startsWith("$#,##0.00")) && this.addOrRemoveSelectIcon(ele);
                                                    }
                                                    else if (ele.item.text === "Accounting") {
                                                        (cellInfo.format == "_($* #,##0.00_);_($* (#,##0.00);_($* \"-\"??_);_(@_)") && this.addOrRemoveSelectIcon(ele);
                                                    }
                                                    else if (ele.item.text === "Short date") {
                                                        (cellInfo.format == "mm-dd-yyyy") && this.addOrRemoveSelectIcon(ele);
                                                    }
                                                    else if (ele.item.text === "Long date") {
                                                        (cellInfo.format == "dddd, mmmm dd, yyyy") && this.addOrRemoveSelectIcon(ele);
                                                    }
                                                    else if (ele.item.text === "Time") {
                                                        (cellInfo.format == "h:mm:ss AM/PM") && this.addOrRemoveSelectIcon(ele);
                                                    }
                                                    else if (ele.item.text === "Percentage") {
                                                        (cellInfo.format.startsWith("0.00%")) && this.addOrRemoveSelectIcon(ele);
                                                    }
                                                    else if (ele.item.text === "Fraction") {
                                                        (cellInfo.format == "# ?/?") && this.addOrRemoveSelectIcon(ele);
                                                    }
                                                    else if (ele.item.text === "Scientific") {
                                                        (cellInfo.format == "0.00E+00") && this.addOrRemoveSelectIcon(ele);
                                                    }
                                                    else if (ele.item.text === "Text") {
                                                        (cellInfo.format == "@") && this.addOrRemoveSelectIcon(ele);
                                                    }
                                                }
                                            }
                                            let numbers = ["8", "9", "10", "11", "12", "14", "16", "18", "20", "22", "24", "26", "28", "36", "48", "72"];
                                            if (numbers.includes(ele.item.text)) {
                                                if (cellInfo.style && cellInfo.style.fontSize) {
                                                    if (ele.item.text == cellInfo.style.fontSize.slice(0, -2)) {
                                                        this.addOrRemoveSelectIcon(ele);
                                                    }
                                                }
                                                else if (ele.item.text == "11") {
                                                    this.addOrRemoveSelectIcon(ele);
                                                }
                                            }
                                            let textAlign = ["Center", "Right"];
                                            let verticalAlign = ["Middle", "Top"];
                                            if (ele.item.text == "Left") {
                                                cellInfo.style ? (!(cellInfo.style.textAlign) || cellInfo.style.textAlign.toLowerCase() == 'left') && this.addOrRemoveSelectIcon(ele) : this.addOrRemoveSelectIcon(ele);
                                            }
                                            if (ele.item.text == "Bottom") {
                                                cellInfo.style ? (!(cellInfo.style.verticalAlign) || cellInfo.style.verticalAlign.toLowerCase() == 'bottom') && this.addOrRemoveSelectIcon(ele) : this.addOrRemoveSelectIcon(ele);
                                            }
                                            if (textAlign.includes(ele.item.text)) {
                                                if ((cellInfo.style) && cellInfo.style.textAlign) {
                                                    (ele.item.text.toLowerCase() == cellInfo.style.textAlign.toLowerCase()) && this.addOrRemoveSelectIcon(ele);
                                                }
                                            }
                                            if (verticalAlign.includes(ele.item.text)) {
                                                if ((cellInfo.style) && cellInfo.style.verticalAlign) {
                                                    (ele.item.text.toLowerCase() == cellInfo.style.verticalAlign.toLowerCase()) && this.addOrRemoveSelectIcon(ele);
                                                }
                                            }
                                        }
                                        if (ele.item.parentObj.text === "Edit") {
                                            if (!this.base.formatpainter.range) {
                                                this.base.formatpainter.range = "A1:A1";
                                            }
                                            let spt = this.base.formatpainter.range.split(':');
                                            let stCol = spt[0].replace(/[0-9]/g, '');
                                            let endCol = spt[1].replace(/[0-9]/g, '');
                                            let stRow = spt[0].match(/\d+$/)[0];
                                            let endRow = spt[1].match(/\d+$/)[0];
                                            switch (ele.item.text) {
                                                case 'Delete row':
                                                    if (stRow === endRow) {
                                                        ele.element.innerHTML = 'Delete row ' + stRow;
                                                    }
                                                    else {
                                                        ele.element.innerHTML = 'Delete rows ' + stRow + ' - ' + endRow;
                                                    }
                                                    break;
                                                case 'Delete column':
                                                    if (stCol === endCol) {
                                                        ele.element.innerHTML = 'Delete column ' + stCol;
                                                    }
                                                    else {
                                                        ele.element.innerHTML = 'Delete columns ' + stCol + ' - ' + endCol;
                                                    }
                                                    break;
                                            }
                                        }
                                        if (ele.item.parentObj.text === "Insert") {
                                            if (!this.base.formatpainter.range) {
                                                this.base.formatpainter.range = "A1:A1";
                                            }
                                            let spt = this.base.formatpainter.range.split(':');
                                            let stCol = spt[0].replace(/[0-9]/g, '');
                                            let endCol = spt[1].replace(/[0-9]/g, '');
                                            let stRow = spt[0].match(/\d+$/)[0];
                                            let endRow = spt[1].match(/\d+$/)[0];
                                            switch (ele.item.text) {
                                                case 'Row above':
                                                    if (stRow !== endRow) {
                                                        ele.element.innerHTML = (this.base.formatpainter.formatIndexes[2] - this.base.formatpainter.formatIndexes[0] + 1) + ' Rows above';
                                                    }
                                                    break;
                                                case 'Row below':
                                                    if (stRow !== endRow) {
                                                        ele.element.innerHTML = (this.base.formatpainter.formatIndexes[2] - this.base.formatpainter.formatIndexes[0] + 1) + ' Rows below';
                                                    }
                                                    break;
                                                case 'Column left':
                                                    if (stCol !== endCol) {
                                                        ele.element.innerHTML = (this.base.formatpainter.formatIndexes[3] - this.base.formatpainter.formatIndexes[1] + 1) + ' Columns left ';
                                                    }
                                                    break;
                                                case 'Column right':
                                                    if (stCol !== endCol) {
                                                        ele.element.innerHTML = (this.base.formatpainter.formatIndexes[3] - this.base.formatpainter.formatIndexes[1] + 1) + ' Columns right';
                                                    }
                                                    break;
                                            }
                                        }
                                        if (ele.item.text === "Hidden sheets") {
                                            this.hiddensheets = this.base.ssObj.sheets.filter(sheet => sheet.state == "Hidden");
                                            if (this.hiddensheets.length > 0) {
                                                let hiddenSheetNames = [];
                                                this.hiddensheets.forEach(state => hiddenSheetNames.push({ text: state.name }));
                                                this.ssMenubarObj.insertBefore(hiddenSheetNames, 'dummyHiddenSheet', false);
                                                this.ssMenubarObj.removeItems(['dummyHiddenSheet'], false);
                                            }
                                        }
                                        if (ele.item.text.startsWith("Upto current row (")) {
                                            ele.element.innerHTML = "Up to current row (" + (index[0] + 1) + ")";
                                        }
                                        if (ele.item.text.startsWith("Upto current column (")) {
                                            ele.element.innerHTML = "Up to current column (" + this.base.generateText(index[1] + 1) + ")";
                                        }
                                        if (ele.item.text.startsWith("Sort sheet by column asc")) {
                                            ele.element.innerHTML = "Sort sheet by column " + this.base.generateText(index[1] + 1) + ", A → Z ";
                                        }
                                        if (ele.item.text.startsWith("Sort sheet by column dsc")) {
                                            ele.element.innerHTML = "Sort sheet by column " + this.base.generateText(index[1] + 1) + ", Z → A ";
                                        }
                                    },
                                    beforeOpen: (e) => {
                                        (e.parentItem.text != "Special paste") && this.ssMenubarObj.enableItems(["Undo", "Redo", "Paste", "Special paste", "Hidden sheets"], false);
                                        this.hiddensheets = this.base.ssObj.sheets.filter(sheet => sheet.state == "Hidden");
                                        if (this.hiddensheets.length > 0) {
                                            this.ssMenubarObj.enableItems(["Hidden sheets"], true);
                                        }
                                        if (menuitems.indexOf(e.parentItem.text) > -1) {
                                            this.ssMenubarObj.showItemOnClick = false;
                                        }
                                        if (this.base.permissionLevel == 1) {
                                            this.ssMenubarObj.enableItems(["Import", "Make a copy", "Freeze panes", "Hide headers", "Hide gridlines", "Freeze"], false);
                                        }
                                        if (e.parentItem.text === 'Icon sets') {
                                            ej.base.closest(e.element, '.e-menu-wrapper').style.maxHeight = '450px';
                                            ej.base.closest(e.element, '.e-menu-wrapper').style.overflowY = 'scroll';
                                        }
                                        if (e.items.find(x => x.text == "Undo") != null) {
                                            if (this.base.ssObj.undoredoModule.undoCollection.length > 0) {
                                                this.ssMenubarObj.enableItems(["Undo"], true);
                                            }
                                        }
                                        if (e.items.find(x => x.text == "Redo") != null) {
                                            if (this.base.ssObj.undoredoModule.redoCollection.length > 0) {
                                                this.ssMenubarObj.enableItems(["Redo"], true);
                                            }
                                        }
                                        if (e.items.find(x => x.text == "Paste") != null) {
                                            if (this.base.ssObj.clipboardModule.copiedInfo != undefined) {
                                                this.ssMenubarObj.enableItems(["Paste", "Special paste"], true);
                                            }
                                        }
                                    },
                                    onOpen: (e) => {
                                        if (e.parentItem.text === 'Icon sets') {
                                            ej.base.closest(e.element, '.e-menu-wrapper').style.maxHeight = '450px';
                                            ej.base.closest(e.element, '.e-menu-wrapper').style.overflowY = 'scroll';
                                        }
                                    },
                                    select: (e) => {
                                        let gSheet = this.base.ssObj.biz.getActiveSheet();
                                        var indexes = this.base.ssObj.biz.getIndexes();
                                        let addr = this.base.ssObj.biz.getActiveSheet().selectedRange;
                                        if (document.getElementById("DocumentViewer_number_format"))
                                            var numberFormat = document.getElementById("DocumentViewer_number_format").ej2_instances[0];
                                        if (document.getElementById("DocumentViewer_font_size"))
                                            var fontSize = document.getElementById("DocumentViewer_font_size").ej2_instances[0];
                                        if (document.getElementById("DocumentViewer_text_align"))
                                            var textAlign = document.getElementById("DocumentViewer_text_align").ej2_instances[0];
                                        if (document.getElementById("DocumentViewer_merge"))
                                            var merge = document.getElementById("DocumentViewer_merge").ej2_instances[0];
                                        if (document.getElementById("DocumentViewer_clear"))
                                            var clear = document.getElementById("DocumentViewer_clear").ej2_instances[0];
                                        if (document.getElementById("DocumentViewer_vertical_align"))
                                            var verticalAlign = document.getElementById("DocumentViewer_vertical_align").ej2_instances[0];
                                        if (document.getElementById("DocumentViewer_paste_dropdownbtn"))
                                            var specialpaste = document.getElementById("DocumentViewer_paste_dropdownbtn").ej2_instances[0];
                                        let verticalElem = this.base.ssObj.element.querySelector('.e-main-panel');
                                        let horizontalElem = this.base.ssObj.getScrollElement();
                                        let hiddenSheetNames = [];
                                        this.base.ssObj.sheets.filter(sheet => sheet.state == "Hidden").forEach(state => hiddenSheetNames.push(state.name));
                                        switch (e.item.text) {
                                            case 'Undo':
                                                document.getElementById(this.base.ssObj.element.id + "_undo").firstElementChild.click();
                                                break;
                                            case 'Redo':
                                                document.getElementById(this.base.ssObj.element.id + "_redo").firstElementChild.click();
                                                break;
                                            case 'Copy':
                                                document.getElementById(this.base.ssObj.element.id + "_copy").firstElementChild.click();
                                                break;
                                            case 'Cut':
                                                document.getElementById(this.base.ssObj.element.id + "_cut").firstElementChild.click();
                                                break;
                                            case 'Paste':
                                                document.getElementById(this.base.ssObj.element.id + "_paste").firstElementChild.click();
                                                break;
                                            case 'All':
                                                specialpaste.trigger('select', { item: specialpaste.items[0] });
                                                break;
                                            case 'Values':
                                                specialpaste.trigger('select', { item: specialpaste.items[1] });
                                                break;
                                            case 'Formats':
                                                specialpaste.trigger('select', { item: specialpaste.items[2] });
                                                break;
                                            case 'Find and replace':
                                                document.getElementById(this.base.ssObj.element.id + "_findbtn").firstElementChild.click();
                                                break;
                                            case 'Delete value':
                                                this.base.ssObj.editModule.editingHandler('delete');
                                                this.base.download.ssAutoSave({ action: "cellSave", eventArgs: { address: "sheet!" + this.base.ssObj.biz.getRange() } }, this.base, true);
                                                break;
                                            case 'Delete row':
                                                this.base.ssObj.contextMenuModule.selectHandler({ item: { id: this.base.ssObj.element.id + '_cmenu_delete_row' } });
                                                break;
                                            case 'Delete column':
                                                this.base.ssObj.contextMenuModule.selectHandler({ item: { id: this.base.ssObj.element.id + '_cmenu_delete_column' } });
                                                break;
                                            case 'Delete cells and shift up':
                                                this.base.formatpainter.deleteShiftUp(addr);
                                                break;
                                            case 'Delete cells and shift left':
                                                this.base.formatpainter.deleteShiftLeft(addr);
                                                break;
                                            case 'Clear Notes':
                                                this.base.formatpainter.clearComment();
                                                break;
                                            case "Spelling":
                                                this.base.spellchecker.renderSpellDialog();
                                                break;
                                            case "Bold":
                                                document.getElementById("DocumentViewer_bold").click();
                                                break;
                                            case "Italic":
                                                document.getElementById("DocumentViewer_italic").click();
                                                break;
                                            case "Underline":
                                                document.getElementById("DocumentViewer_underline").click();
                                                break;
                                            case "Strikethrough":
                                                document.getElementById("DocumentViewer_line-through").click();
                                                ;
                                                break;
                                            case "New":
                                                this.processNewSheet();
                                                break;
                                            case "Open":
                                                debugger;
                                                this.renderOpenNewDialogue();
                                                break;
                                            case "Import":
                                                this.getAll(0);
                                                break;
                                            case "Make a copy":
                                                this.documentCopy();
                                                break;
                                            case "Microsoft excel (.xlsx)":
                                                this.fileDownload.downloadDocumentFile(FileId, documentGroup, filename, ExcelFormat.Xlsx, "");
                                                break;
                                            case "Microsoft excel 97-2003 (.xls)":
                                                this.fileDownload.downloadDocumentFile(FileId, documentGroup, filename, ExcelFormat.Xls, "");
                                                break;
                                            case "Comma-Seperated values (.csv)":
                                                this.fileDownload.downloadDocumentFile(FileId, documentGroup, filename, ExcelFormat.CSV, "");
                                                break;
                                            case "PDF document (.pdf)":
                                                this.fileDownload.downloadDocumentFile(FileId, documentGroup, filename, ExcelFormat.PDF, "");
                                                break;
                                            case "OpenDocument spreadsheet (.ods)":
                                                this.fileDownload.downloadDocumentFile(FileId, documentGroup, filename, ExcelFormat.ODS, "");
                                                break;
                                            case "Close":
                                                this.closePopup();
                                                break;
                                            case "Show headers":
                                            case "Hide headers":
                                                this.imageInCell = false;
                                                this.base.ssObj.ribbonModule.toolbarClicked({ item: { id: this.base.ssObj.element.id + "_headers" }, name: "clicked", originalEvent: { target: this.base.ssObj.element } });
                                                break;
                                            case "Show gridlines":
                                            case "Hide gridlines":
                                                this.imageInCell = false;
                                                this.base.ssObj.element.querySelector('[data-id="tabitem_5"]').click();
                                                this.base.ssObj.ribbonModule.toolbarClicked({ item: { id: this.base.ssObj.element.id + "_gridlines" }, name: "clicked", originalEvent: { target: this.base.ssObj.element } });
                                                this.base.ssObj.element.querySelector('[data-id="tabitem_1"]').click();
                                                break;
                                            case "Freeze panes":
                                                this.imageInCell = false;
                                                let indexes = this.base.ssObj.biz.getIndexes();
                                                if (gSheet.frozenColumns != 0 || gSheet.frozenRows != 0) {
                                                    this.base.ssObj.Unfreeze();
                                                }
                                                else {
                                                    this.base.ssObj.freezePanes(indexes[0] + 1, indexes[1] + 1);
                                                }
                                                break;
                                            case "No rows":
                                                this.imageInCell = false;
                                                gSheet.frozenRows = 0;
                                                break;
                                            case "1 row":
                                                this.imageInCell = false;
                                                verticalElem.scrollTop = 0;
                                                setTimeout(() => { gSheet.frozenRows = 1; }, 0);
                                                break;
                                            case "2 rows":
                                                this.imageInCell = false;
                                                verticalElem.scrollTop = 0;
                                                setTimeout(() => { gSheet.frozenRows = 2; }, 0);
                                                break;
                                            case "No columns":
                                                this.imageInCell = false;
                                                gSheet.frozenColumns = 0;
                                                break;
                                            case "1 column":
                                                this.imageInCell = false;
                                                horizontalElem.scrollLeft = 0;
                                                setTimeout(() => { gSheet.frozenColumns = 1; }, 0);
                                                break;
                                            case "2 columns":
                                                this.imageInCell = false;
                                                horizontalElem.scrollLeft = 0;
                                                setTimeout(() => { gSheet.frozenColumns = 2; }, 0);
                                                break;
                                            case "Formula bar":
                                                let formulaBarDisplay = document.getElementsByClassName("e-formula-bar-panel")[0];
                                                let currentHeight = document.getElementById("DocumentViewer_sheet_panel").offsetHeight;
                                                if (formulaBarDisplay.style.display == "") {
                                                    formulaBarDisplay.style.display = "none";
                                                    document.getElementById("DocumentViewer_sheet_panel").style.height = currentHeight + 24 + "px";
                                                }
                                                else {
                                                    formulaBarDisplay.style.display = "";
                                                    document.getElementById("DocumentViewer_sheet_panel").style.height = currentHeight - 24 + "px";
                                                }
                                                break;
                                            case "Show formula":
                                                this.setShowFormula();
                                                break;
                                            case "Full screen":
                                                this.imageInCell = false;
                                                Unibase.Apps.Collaboration.Components.Fullscreen.Instance().refreshSpreadsheetHeight(this.base.ssObj);
                                                break;
                                            case 'Row above':
                                                this.base.ssObj.contextMenuModule.selectHandler({ item: { id: this.base.ssObj.element.id + '_cmenu_insert_row_above' } });
                                                break;
                                            case 'Row below':
                                                this.base.ssObj.contextMenuModule.selectHandler({ item: { id: this.base.ssObj.element.id + '_cmenu_insert_row_below' } });
                                                break;
                                            case 'Column left':
                                                this.base.ssObj.contextMenuModule.selectHandler({ item: { id: this.base.ssObj.element.id + '_cmenu_insert_column_before' } });
                                                break;
                                            case 'Column right':
                                                this.base.ssObj.contextMenuModule.selectHandler({ item: { id: this.base.ssObj.element.id + '_cmenu_insert_column_after' } });
                                                break;
                                            case 'Cells and shift down':
                                                this.base.formatpainter.insertShiftDown(addr);
                                                break;
                                            case 'Cells and shift right':
                                                this.base.formatpainter.insertShiftRight(addr);
                                                break;
                                            case "Link":
                                                this.imageInCell = false;
                                                this.base.ssObj.ribbonModule.getHyperlinkDlg();
                                                break;
                                            case "Note":
                                                this.base.formatpainter.insertNote();
                                                break;
                                            case "Image over cells":
                                                this.imageInCell = false;
                                                ej.base.select('#' + this.base.ssObj.element.id + '_imageUpload', this.base.ssObj.element).click();
                                                break;
                                            case "Image in cell":
                                                this.imageInCell = true;
                                                ej.base.select('#' + this.base.ssObj.element.id + '_imageUpload', this.base.ssObj.element).click();
                                                break;
                                            case "Clustered column":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "column_chart", id: "clusteredColumn", isChart: true, name: "insertChart" });
                                                break;
                                            case "Stacked column":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "column_chart", id: "stackedColumn", isChart: true, name: "insertChart" });
                                                break;
                                            case "100% stacked column":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "column_chart", id: "stackedColumn100", isChart: true, name: "insertChart" });
                                                break;
                                            case "Clustered bar":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "bar_chart", id: "clusteredBar", isChart: true, name: "insertChart" });
                                                break;
                                            case "Stacked bar":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "bar_chart", id: "stackedBar", isChart: true, name: "insertChart" });
                                                break;
                                            case "100% stacked bar":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "bar_chart", id: "stackedBar100", isChart: true, name: "insertChart" });
                                                break;
                                            case "Clustered area":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "area_chart", id: "area", isChart: true, name: "insertChart" });
                                                break;
                                            case "Stacked area":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "area_chart", id: "stackedArea", isChart: true, name: "insertChart" });
                                                break;
                                            case "100% stacked area":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "area_chart", id: "stackedArea100", isChart: true, name: "insertChart" });
                                                break;
                                            case "Pie":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "pie_doughnut_chart", id: "pie", isChart: true, name: "insertChart" });
                                                break;
                                            case "Doughnut":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "pie_doughnut_chart", id: "doughnut", isChart: true, name: "insertChart" });
                                                break;
                                            case "Clustered line":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "line_chart", id: "line", isChart: true, name: "insertChart" });
                                                break;
                                            case "Stacked line":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "line_chart", id: "stackedLine", isChart: true, name: "insertChart" });
                                                break;
                                            case "100% stacked line":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "line_chart", id: "stackedLine100", isChart: true, name: "insertChart" });
                                                break;
                                            case "Scatter chart":
                                                this.imageInCell = false;
                                                this.base.ssObj.spreadsheetChartModule.insertChartHandler({ action: "scatter_chart", id: "scatter", isChart: true, name: "insertChart" });
                                                break;
                                            case "Function":
                                                this.imageInCell = false;
                                                this.base.ssObj.element.querySelector('.e-insert-function').click();
                                                break;
                                            case 'Split text to columns':
                                                this.base.formatpainter.initSplitDialog();
                                                break;
                                            case "Trim whitespaces":
                                                this.spreadSheetTrim();
                                                break;
                                            case "Protect sheet":
                                                this.base.ssObj.setSheetPropertyOnMute(gSheet, "isProtected", !gSheet.isProtected);
                                                this.base.ssObj.notify("applyProtect", { isActive: !gSheet.isProtected });
                                                break;
                                            case "Protect workbook":
                                                this.base.ssObj.ribbonModule.toolbarClicked({ item: { id: this.base.ssObj.element.id + "_protectworkbook" }, name: "clicked", originalEvent: { target: this.base.ssObj.element } });
                                                break;
                                            case "Data validation":
                                                this.base.ssObj.notify('initiatedatavalidation', null);
                                                break;
                                            case "Highlight invalid data":
                                                this.base.ssObj.addInvalidHighlight();
                                                break;
                                            case "Clear highlight":
                                                this.base.ssObj.removeInvalidHighlight();
                                                break;
                                            case "Clear validation":
                                                this.base.ssObj.notify('removeDataValidation', null);
                                                break;
                                            case "Remove duplicates":
                                                this.dialogue.renderDuplicateDailouge();
                                                break;
                                            case "General":
                                                numberFormat.trigger('select', { item: numberFormat.items[0] });
                                                break;
                                            case "Number":
                                                numberFormat.trigger('select', { item: numberFormat.items[1] });
                                                break;
                                            case "Currency":
                                                numberFormat.trigger('select', { item: numberFormat.items[2] });
                                                break;
                                            case "Currency (rounded)":
                                                this.updateCurrencyRounded();
                                                numberFormat.trigger('select', { item: numberFormat.items[2] });
                                                break;
                                            case "Accounting":
                                                numberFormat.trigger('select', { item: numberFormat.items[3] });
                                                break;
                                            case "Short date":
                                                numberFormat.trigger('select', { item: numberFormat.items[4] });
                                                break;
                                            case "Long date":
                                                numberFormat.trigger('select', { item: numberFormat.items[5] });
                                                break;
                                            case "Time":
                                                numberFormat.trigger('select', { item: numberFormat.items[6] });
                                                break;
                                            case "Percentage":
                                                numberFormat.trigger('select', { item: numberFormat.items[7] });
                                                break;
                                            case "Fraction":
                                                numberFormat.trigger('select', { item: numberFormat.items[8] });
                                                break;
                                            case "Scientific":
                                                numberFormat.trigger('select', { item: numberFormat.items[9] });
                                                break;
                                            case "Text":
                                                numberFormat.trigger('select', { item: numberFormat.items[10] });
                                                break;
                                            case "8":
                                                fontSize.trigger('select', { item: fontSize.items[0] });
                                                break;
                                            case "9":
                                                fontSize.trigger('select', { item: fontSize.items[1] });
                                                break;
                                            case "10":
                                                fontSize.trigger('select', { item: fontSize.items[2] });
                                                break;
                                            case "11":
                                                fontSize.trigger('select', { item: fontSize.items[3] });
                                                break;
                                            case "12":
                                                fontSize.trigger('select', { item: fontSize.items[4] });
                                                break;
                                            case "14":
                                                fontSize.trigger('select', { item: fontSize.items[5] });
                                                break;
                                            case "16":
                                                fontSize.trigger('select', { item: fontSize.items[6] });
                                                break;
                                            case "18":
                                                fontSize.trigger('select', { item: fontSize.items[7] });
                                                break;
                                            case "20":
                                                fontSize.trigger('select', { item: fontSize.items[8] });
                                                break;
                                            case "22":
                                                fontSize.trigger('select', { item: fontSize.items[9] });
                                                break;
                                            case "24":
                                                fontSize.trigger('select', { item: fontSize.items[10] });
                                                break;
                                            case "26":
                                                fontSize.trigger('select', { item: fontSize.items[11] });
                                                break;
                                            case "28":
                                                fontSize.trigger('select', { item: fontSize.items[12] });
                                                break;
                                            case "36":
                                                fontSize.trigger('select', { item: fontSize.items[13] });
                                                break;
                                            case "48":
                                                fontSize.trigger('select', { item: fontSize.items[14] });
                                                break;
                                            case "72":
                                                fontSize.trigger('select', { item: fontSize.items[15] });
                                                break;
                                            case "Left":
                                                textAlign.trigger('select', { item: textAlign.items[0] });
                                                break;
                                            case "Center":
                                                textAlign.trigger('select', { item: textAlign.items[1] });
                                                break;
                                            case "Right":
                                                textAlign.trigger('select', { item: textAlign.items[2] });
                                                break;
                                            case "Top":
                                                verticalAlign.trigger('select', { item: verticalAlign.items[0] });
                                                break;
                                            case "Middle":
                                                verticalAlign.trigger('select', { item: verticalAlign.items[1] });
                                                break;
                                            case "Bottom":
                                                verticalAlign.trigger('select', { item: verticalAlign.items[2] });
                                                break;
                                            case "Merge all":
                                                merge.trigger('select', { item: merge.items[0] });
                                                break;
                                            case "Merge vertically":
                                                merge.trigger('select', { item: merge.items[2] });
                                                break;
                                            case "Merge horizontally":
                                                merge.trigger('select', { item: merge.items[1] });
                                                break;
                                            case "Unmerge":
                                                merge.trigger('select', { item: merge.items[4] });
                                                break;
                                            case "Wrap text":
                                                document.getElementById("DocumentViewer_wrap").click();
                                                break;
                                            case "Clear all":
                                                clear.trigger('select', { item: clear.items[0] });
                                                break;
                                            case "Clear formats":
                                                clear.trigger('select', { item: clear.items[1] });
                                                break;
                                            case "Clear contents":
                                                clear.trigger('select', { item: clear.items[2] });
                                                break;
                                            case "Clear hyperlinks":
                                                clear.trigger('select', { item: clear.items[3] });
                                                this.base.download.ssAutoSave({ action: 'multipleCells', eventArgs: { range: addr } }, this.base, true);
                                                break;
                                            case "Greater than":
                                                this.base.ssObj.conditionalFormattingModule.initiateCFHandler({ action: "Greater Than...", name: "initiateConditionalFormat" });
                                                break;
                                            case "Less than":
                                                this.base.ssObj.conditionalFormattingModule.initiateCFHandler({ action: "Less Than...", name: "initiateConditionalFormat" });
                                                break;
                                            case "Between":
                                                this.base.ssObj.conditionalFormattingModule.initiateCFHandler({ action: "Between...", name: "initiateConditionalFormat" });
                                                break;
                                            case "Equal to":
                                                this.base.ssObj.conditionalFormattingModule.initiateCFHandler({ action: "Equal To...", name: "initiateConditionalFormat" });
                                                break;
                                            case "Text that contains":
                                                this.base.ssObj.conditionalFormattingModule.initiateCFHandler({ action: "Text that Contains...", name: "initiateConditionalFormat" });
                                                break;
                                            case "A date occuring":
                                                this.base.ssObj.conditionalFormattingModule.initiateCFHandler({ action: "A Date Occuring...", name: "initiateConditionalFormat" });
                                                break;
                                            case "Duplicate values":
                                                this.base.ssObj.conditionalFormattingModule.initiateCFHandler({ action: "Duplicate Values...", name: "initiateConditionalFormat" });
                                                break;
                                            case "Top 10 items":
                                                this.base.ssObj.conditionalFormattingModule.initiateCFHandler({ action: "Top 10 Items...", name: "initiateConditionalFormat" });
                                                break;
                                            case "Top 10%":
                                                this.base.ssObj.conditionalFormattingModule.initiateCFHandler({ action: "Top 10 %...", name: "initiateConditionalFormat" });
                                                break;
                                            case "Bottom 10 items":
                                                this.base.ssObj.conditionalFormattingModule.initiateCFHandler({ action: "Bottom 10 Items...", name: "initiateConditionalFormat" });
                                                break;
                                            case "Bottom 10%":
                                                this.base.ssObj.conditionalFormattingModule.initiateCFHandler({ action: "Bottom 10 %...", name: "initiateConditionalFormat" });
                                                break;
                                            case "Above average":
                                                this.base.ssObj.conditionalFormattingModule.initiateCFHandler({ action: "Above Average...", name: "initiateConditionalFormat" });
                                                break;
                                            case "Below average":
                                                this.base.ssObj.conditionalFormattingModule.initiateCFHandler({ action: "Below Average...", name: "initiateConditionalFormat" });
                                                break;
                                            case "Blue data bar":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_databars", id: "BlueDataBar", name: "setCF" });
                                                break;
                                            case "Green data bar":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_databars", id: "GreenDataBar", name: "setCF" });
                                                break;
                                            case "Red data bar":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_databars", id: "RedDataBar", name: "setCF" });
                                                break;
                                            case "Orange data bar":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_databars", id: "OrangeDataBar", name: "setCF" });
                                                break;
                                            case "Light blue data bar":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_databars", id: "LightBlueDataBar", name: "setCF" });
                                                break;
                                            case "Purple data bar":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_databars", id: "PurpleDataBar", name: "setCF" });
                                                break;
                                            case "Green - yellow - red":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_colorscales", id: "GYRColorScale", name: "setCF" });
                                                break;
                                            case "Red - yellow - green":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_colorscales", id: "RYGColorScale", name: "setCF" });
                                                break;
                                            case "Green - white - red":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_colorscales", id: "GWRColorScale", name: "setCF" });
                                                break;
                                            case "Red - white - green":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_colorscales", id: "RWGColorScale", name: "setCF" });
                                                break;
                                            case "Blue - white - red":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_colorscales", id: "BWRColorScale", name: "setCF" });
                                                break;
                                            case "Red - white - Blue":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_colorscales", id: "RWBColorScale", name: "setCF" });
                                                break;
                                            case "White - red":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_colorscales", id: "WRColorScale", name: "setCF" });
                                                break;
                                            case "Red - white":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_colorscales", id: "RWColorScale", name: "setCF" });
                                                break;
                                            case "White - green":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_colorscales", id: "WGColorScale", name: "setCF" });
                                                break;
                                            case "Green - white":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_colorscales", id: "GWColorScale", name: "setCF" });
                                                break;
                                            case "Green - yellow":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_colorscales", id: "GYColorScale", name: "setCF" });
                                                break;
                                            case "Yellow - green":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_colorscales", id: "YGColorScale", name: "setCF" });
                                                break;
                                            case "3 arrows (colored)":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "ThreeArrows", name: "setCF" });
                                                break;
                                            case "3 arrows (gray)":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "ThreeArrowsGray", name: "setCF" });
                                                break;
                                            case "4 arrows (colored)":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "FourArrows", name: "setCF" });
                                                break;
                                            case "4 arrows (gray)":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "FourArrowsGray", name: "setCF" });
                                                break;
                                            case "5 arrows (colored)":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "FiveArrows", name: "setCF" });
                                                break;
                                            case "5 arrows (gray)":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "FiveArrowsGray", name: "setCF" });
                                                break;
                                            case "3 triangles":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "ThreeTriangles", name: "setCF" });
                                                break;
                                            case "3 traffice lights (unrimmed)":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "ThreeTrafficLights1", name: "setCF" });
                                                break;
                                            case "3 traffice lights (rimmed)":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "ThreeTrafficLights2", name: "setCF" });
                                                break;
                                            case "3 signs":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "ThreeSigns", name: "setCF" });
                                                break;
                                            case "4 traffice lights":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "FourTrafficLights", name: "setCF" });
                                                break;
                                            case "Red to black":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "FourRedToBlack", name: "setCF" });
                                                break;
                                            case "3 symbols (circled)":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "ThreeSymbols", name: "setCF" });
                                                break;
                                            case "3 symbols (uncircled)":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "ThreeSymbols2", name: "setCF" });
                                                break;
                                            case "3 flags":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "ThreeFlags", name: "setCF" });
                                                break;
                                            case "3 stars":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "ThreeStars", name: "setCF" });
                                                break;
                                            case "5 quarters":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "FiveQuarters", name: "setCF" });
                                                break;
                                            case "5 quarters":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "FiveQuarters", name: "setCF" });
                                                break;
                                            case "4 ratings":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "FourRating", name: "setCF" });
                                                break;
                                            case "5 ratings":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "FiveRating", name: "setCF" });
                                                break;
                                            case "5 boxes":
                                                this.base.ssObj.conditionalFormattingModule.setCFHandler({ action: "cf_iconsets", id: "FiveBoxes", name: "setCF" });
                                                break;
                                            case "Selected cells":
                                                this.base.ssObj.notify('clearCFRule', { range: gSheet.selectedRange, isPublic: !1 });
                                                break;
                                            case "Entire sheet":
                                                let range = ej.spreadsheet.getRangeAddress([0, 0, gSheet.rowCount - 1, gSheet.colCount - 1]);
                                                this.base.ssObj.conditionalFormat = null;
                                                this.base.ssObj.notify("clearCFRule", { range: range, isPublic: false });
                                                break;
                                        }
                                        if (hiddenSheetNames.includes(e.item.text)) {
                                            this.ssMenubarObj.insertBefore([{ text: 'dummyHiddenSheet' }], e.item.text, false);
                                            this.ssMenubarObj.removeItems([e.item.text], false);
                                            this.base.ssObj.sheetTabsModule.updateSheetTab({ idx: this.base.ssObj.biz.getSheetIndexByname(e.item.text) });
                                        }
                                        else if (e.item.text === "Upto current row ()") {
                                            this.base.ssObj.sheets[this.base.getSheetIndex()].frozenRows = indexes[0] + 1;
                                        }
                                        else if (e.item.text === "Upto current column ()") {
                                            this.base.ssObj.sheets[this.base.getSheetIndex()].frozenColumns = indexes[1] + 1;
                                        }
                                        else if (e.item.text === 'Sort sheet by column asc, A → Z') {
                                            this.base.ssObj.sort();
                                        }
                                        else if (e.item.text === 'Sort sheet by column dsc, Z → A') {
                                            this.base.ssObj.sort({ sortDescriptors: { order: 'Descending' } });
                                        }
                                        const freezeActions = ["Upto current row ()", "Upto current column ()", "No rows", "1 row", "2 rows", "No columns", "1 column", "2 columns", "Freeze panes"];
                                        if (freezeActions.includes(e.item.text)) {
                                            setTimeout(() => {
                                                let sheet = this.base.ssObj.biz.getActiveSheet();
                                                this.base.download.ssAutoSave({ action: "freezePanes", eventArgs: { row: sheet.frozenRows, column: sheet.frozenColumns, sheetIdx: this.base.getSheetIndex() } }, this.base, true);
                                            }, 500);
                                        }
                                    },
                                    items: menuItems,
                                });
                                this.ssMenubarObj.appendTo("#menu");
                            }
                        }
                        setShowFormula() {
                            this.base.showFormula ? (this.base.showFormula = false) : (this.base.showFormula = true);
                            this.base.ssObj.refresh();
                        }
                        processNewSheet() {
                            var _type = Unibase.Themes.Providers.Detail_Settings.Instance().InputParameters.find(x => x.Key == "hf_" + Unibase.Themes.Providers.DetailHelper.installedAppId + "_folderid");
                            var type;
                            if (_type != undefined) {
                                type = btoa(_type.Value.toString());
                            }
                            else {
                                type = 0;
                            }
                            Unibase.Platform.Helpers.FileCacheHelper.Instance().loadJsFile("apps/collaboration/components/common/util.js", () => {
                                let urlStr = Unibase.Apps.Collaboration.Components.Common.Util.Instance().makeid(40);
                                window.open(window.origin + "#/newdocuments/" + type + "/" + urlStr + "/newexcel");
                            });
                        }
                        addOrRemoveSelectIcon(ele) {
                            if (!ele.element.firstElementChild.classList.contains("biz-ss-selecticon")) {
                                ele.element.firstElementChild.classList.add("biz-ss-selecticon");
                            }
                        }
                        closePopup() {
                            this.base.download.ssAutoSave({ action: "destroy" }, this.base, false);
                            if (!this.base.NewDocument) {
                                Unibase.Apps.Collaboration.Components.DocConnector.Instance().closeDoc();
                            }
                        }
                        ssimportedFileDataDailog() {
                            if (!document.getElementById('file-label')) {
                                var importSelectButton = new ej.buttons.Button({ cssClass: `e-flat`, content: 'Import Data' });
                                var importCancelButton = new ej.buttons.Button({ cssClass: `e-flat`, content: 'Cancel' });
                                var importFileDropDownListData = ['Create new spreadsheet', 'insert new sheet', 'Replace spreadsheet'];
                                this._url = window.location.origin + "/#/documents/";
                                this.ssImprotedFileDailogueObj = new ej.popups.Dialog({
                                    isModal: true,
                                    header: 'Import File',
                                    content: `<div id='file-label'>File</div>
                                <div id='importedfilename'></div>

                                <div id='sucessfullmessage' style="display:none">File imported successfully. <a id="importcreatenewdocument" href="${this._url}" target="blank">Open now »</a></div>
                                <br><br>
                                <div id='import-location'>Import location</div>
                                <div id="import-dropdowncontainer">
                                <div id='import-dropdown'></div>
                                </div>
                                <br>
                                <button id="importdata-select-btn"></button>
                                <button id="importdata-cancel-btn"></button>`,
                                    target: document.getElementById("container"),
                                    width: '420px',
                                    height: '290px',
                                    animationSettings: { effect: 'Zoom' },
                                });
                                this.ssImprotedFileDailogueObj.appendTo('#importfile-container');
                                this.dropdownObj = new ej.dropdowns.DropDownList({
                                    dataSource: importFileDropDownListData,
                                    placeholder: "Select a Import",
                                    popupHeight: "200px",
                                    width: '345px',
                                });
                                this.dropdownObj.appendTo('#import-dropdown');
                                this.dropdownObj.index = 0;
                                importSelectButton.appendTo('#importdata-select-btn');
                                importCancelButton.appendTo('#importdata-cancel-btn');
                                document.getElementById('importedfilename').innerHTML = this.importedFile.files[0].name;
                            }
                            else {
                                this.ssImportDialougObj.show();
                            }
                            document.getElementById('importdata-cancel-btn').addEventListener('click', () => {
                                this.ssImportDialougObj.hide();
                                if (document.getElementById('importfile-upload-select-btn'))
                                    document.getElementById('importfile-upload-select-btn').classList.add('e-disabled');
                                (this.importedFile) && (this.importedFile.value = null);
                                document.getElementById("importedfilename").innerHTML = "";
                                if (document.getElementById('filename'))
                                    document.getElementById('filename').innerHTML = "";
                                this.hideImportandImportFileDialog();
                            });
                            document.getElementById('importdata-select-btn').addEventListener('click', () => {
                                var documentId = this.documentId;
                                var dropdownSelectedValue = this.dropdownObj.value;
                                if (dropdownSelectedValue == "Create new spreadsheet") {
                                    this.importSpreadSheetDocument();
                                }
                                else if (dropdownSelectedValue == "insert new sheet") {
                                    this.insertSheet();
                                    this.hideImportandImportFileDialog();
                                }
                                else if (dropdownSelectedValue == "Replace spreadsheet") {
                                    this.importReplaceSpreadSheet();
                                    this.hideImportandImportFileDialog();
                                }
                            });
                        }
                        hideImportandImportFileDialog() {
                            if (this.ssImportDialougObj) {
                                this.ssImportDialougObj.destroy();
                                this.ssImportDialougObj = null;
                            }
                            if (this.ssImprotedFileDailogueObj) {
                                this.ssImprotedFileDailogueObj.destroy();
                                this.ssImprotedFileDailogueObj = null;
                            }
                        }
                        formula(sheet, formula) {
                            var range = this.base.ssObj.biz.getIndexes();
                            this.cellRowStart = range[0];
                            this.cellColStart = range[1];
                            this.cellRowEnd = range[2];
                            this.cellColEnd = range[3];
                            let noOfRow = this.cellRowEnd - this.cellRowStart;
                            let noOfCol = this.cellColEnd - this.cellColStart;
                            let editDiv = document.getElementById("DocumentViewer_edit");
                            if (noOfRow == 0 && noOfCol == 0) {
                                this.base.ssObj.startEdit();
                                setTimeout(() => {
                                    this.base.ssObj.startEdit();
                                    editDiv.textContent = "=" + formula + "()";
                                }, 0);
                            }
                            else if (noOfRow == 0 && noOfCol > 0) {
                                let formulaRange = this.base.generateHeaderText(this.cellColStart + 1) + (this.cellRowStart + 1) + ":" + this.base.generateHeaderText(this.cellColEnd + 1) + (this.cellRowEnd + 1);
                                if (this.base.getSheetIndex() >= 0) {
                                    this.base.ssObj.selectRange(this.base.generateHeaderText(this.cellColEnd + 2) + (this.cellRowStart + 1) + ":" + this.base.generateHeaderText(this.cellColEnd + 2) + (this.cellRowStart + 1));
                                    setTimeout(() => {
                                        this.base.ssObj.startEdit();
                                        editDiv.textContent = "=" + formula + "(" + formulaRange + ")";
                                    }, 0);
                                }
                            }
                            else if (noOfRow >= 1) {
                                let col = this.base.generateHeaderText(this.cellColStart + 1) + (this.cellRowStart + 1) + ":" + this.base.generateHeaderText(this.cellColEnd + 1) + (this.cellRowEnd + 1);
                                this.base.ssObj.notify("initiateFormulaReference", { range: col, formulaSheetIdx: this.base.getSheetIndex() });
                                if (this.base.getSheetIndex() >= 0) {
                                    this.base.ssObj.selectRange(this.base.generateHeaderText(this.cellColStart + 1) + (this.cellRowEnd + 2) + ":" + this.base.generateHeaderText(this.cellColStart + 1) + (this.cellRowEnd + 2));
                                    setTimeout(() => {
                                        this.base.ssObj.startEdit();
                                        editDiv.textContent = "=" + formula + "(" + col + ")";
                                    }, 0);
                                }
                            }
                            setTimeout(() => {
                                var el = this.base.ssObj.element.querySelector('#' + this.base.ssObj.element.id + '_edit');
                                ;
                                let range = document.createRange();
                                var sel = window.getSelection();
                                range.setStart(el.childNodes[0], el.innerHTML.length - 1);
                                range.collapse(true);
                                sel.removeAllRanges();
                                sel.addRange(range);
                                this.base.ssObj.isEdit = true;
                            }, 200);
                        }
                        getFormulaBtnDdb() {
                            var formulaList = [{
                                    text: 'SUM', items: [
                                        { iconCss: 'e-icons e-selected-icon', id: "_1px" }, { id: "_2px" },
                                        { id: "_3px" }, { id: "_dashed" },
                                        { id: "_dotted" }, { id: "_double" }
                                    ]
                                }, { text: 'AVERAGE' }, { text: 'COUNT' }, { text: 'MAX' }, { text: 'MIN' },
                                { separator: true }, { text: 'ABS' }, { text: 'AND' }, { text: 'AVERAGE' }, { text: 'AVERAGEA' },
                                { text: 'AVERAGEIF' }, { text: 'AVERAGEIFS' }, { text: 'CEILING' }, { text: 'CHOOSE' }, { text: 'CONCAT' },
                                { text: 'CONCATENATE' }, { text: 'COUNT' }, { text: 'COUNTA' }, { text: 'COUNTIF' }, { text: 'COUNTIFS' },
                                { text: 'DATE' }, { text: 'DAY' }, { text: 'DAYS' }, { text: 'EXP' }, { text: 'FIND' }, { text: 'FLOOR' },
                                { text: 'GEOMEAN' }, { text: 'IF' }, { text: 'IFERROR' }, { text: 'IFS' }, { text: 'INDEX' },
                                { text: 'INT' }, { text: 'INTERCEPT' }, { text: 'ISNUMBER' }, { text: 'LN' }, { text: 'LOG' },
                                { text: 'MATCH' }, { text: 'MAX' }, { text: 'MIN' }, { text: 'OR' }, { text: 'POWER' },
                                { text: 'PRODUCT' }, { text: 'RADIANS' }, { text: 'RAND' }, { text: 'RANDBETWEEN' }, { text: 'ROUND' },
                                { text: 'ROUNDUP' }, { text: 'SLOPE' }, { text: 'SORT' }, { text: 'SUBTOTAL' }, { text: 'SUM' }, { text: 'SUMIF' },
                                { text: 'SUMIFS' }, { text: 'SUMPRODUCT' }, { text: 'TEXT' }, { text: 'TODAY' }, { text: 'TRUNC' }];
                            var formulapDownBtn = new ej.splitbuttons.DropDownButton({
                                cssClass: 'biz-ss-formula-ddb',
                                iconCss: 'e-icons biz-ss-formulaicon',
                                items: formulaList,
                                select: (args) => {
                                    let sheet = this.base.ssObj.biz.getActiveSheet();
                                    switch (args.item.text) {
                                        case args.item.text:
                                            this.formula(sheet, args.item.text);
                                    }
                                },
                                beforeOpen: (e) => {
                                    e.items[0].text === "SUM" && ((ej.base.closest(e.element, '.biz-ss-formula-ddb').style.maxHeight = '450px'),
                                        ej.base.closest(e.element, '.biz-ss-formula-ddb').style.overflowY = 'scroll');
                                }
                            });
                            formulapDownBtn.appendTo(Unibase.Apps.Collaboration.Components.Common.Util.Instance().createElement("button", "class", "biz-ss-formula-wrapper"));
                            return formulapDownBtn.element;
                        }
                        updateCurrencyRounded() {
                            var rngIndexes = this.base.ssObj.biz.getIndexes();
                            let sheet = this.base.ssObj.biz.getActiveSheet();
                            for (let i = rngIndexes[0]; i <= rngIndexes[2]; i++) {
                                if (!sheet.rows[i]) {
                                    return;
                                }
                                for (let j = rngIndexes[1]; j <= rngIndexes[3]; j++) {
                                    let cellObj = ej.spreadsheet.getCell(i, j, sheet);
                                    if (cellObj && cellObj.value && cellObj.value.toString().length && (!cellObj.forumula || !cellObj.formula.length) && (typeof (cellObj.value) === 'number' || !isNaN(cellObj.value))) {
                                        cellObj.value = Math.round(cellObj.value);
                                        this.base.ssObj.biz.setCell(i, j, sheet, cellObj);
                                    }
                                }
                            }
                        }
                        static Instance() {
                            if (this.instance === undefined) {
                                this.instance = new Ribbon();
                            }
                            return this.instance;
                        }
                    }
                    Sheets.Ribbon = Ribbon;
                })(Sheets = Components.Sheets || (Components.Sheets = {}));
            })(Components = Collaboration.Components || (Collaboration.Components = {}));
        })(Collaboration = Apps.Collaboration || (Apps.Collaboration = {}));
    })(Apps = Unibase.Apps || (Unibase.Apps = {}));
})(Unibase || (Unibase = {}));