init repo

OfficeWeb/apps/spreadsheeteditor/main/app/controller/CellEdit.js

@@ -0,0 +1,288 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.controller.CellEdit", {
+    extend: "Ext.app.Controller",
+    views: ["CellInfo"],
+    refs: [{
+        ref: "infoBox",
+        selector: "ssecellinfo"
+    },
+    {
+        ref: "dlgFormula",
+        selector: "sseformuladialog"
+    },
+    {
+        ref: "formulaList",
+        selector: "#formulas-list"
+    },
+    {
+        ref: "toolBar",
+        selector: "ssetoolbar"
+    },
+    {
+        ref: "cellTextBox",
+        selector: "#infobox-cell-edit"
+    },
+    {
+        ref: "buttonExpand",
+        selector: "#infobox-cell-multiline-button"
+    }],
+    init: function () {
+        this.control({
+            "sseformuladialog": {
+                beforeshow: function (o, eOpts) {},
+                show: function () {
+                    this.getFormulaList().getSelectionModel().select(0);
+                    this.getDlgFormula().focus(undefined, 100);
+                },
+                beforerender: function () {
+                    if (! (this.getFormulaList().getStore().getCount() > 0)) {
+                        this._reloadFormulas();
+                    }
+                    this.getDlgFormula().setGroups(this.arrGroups);
+                },
+                hide: function () {
+                    this.getToolBar().fireEvent("editcomplete", this.getToolBar());
+                }
+            },
+            "sseformuladialog #formulas-group-combo": {
+                select: function (combo, records, eOpts) {
+                    this.getFormulaList().getStore().clearFilter();
+                    if (records[0].data["groupid"] !== "all") {
+                        this.getFormulaList().getStore().filter("group", records[0].data["groupid"]);
+                    }
+                }
+            },
+            "sseformuladialog #formulas-button-ok": {
+                click: function (btn) {
+                    var data = this.getFormulaList().getSelectionModel().getSelection()[0].data;
+                    this.api.asc_insertFormula(data.func);
+                    this.getDlgFormula().hide();
+                }
+            },
+            "#formulas-list > gridview": {
+                afterrender: function (cmp) {
+                    this.funcSearch = {
+                        index: 0,
+                        update: false,
+                        word: ""
+                    };
+                    cmp.addElListener("keypress", Ext.bind(this.keypressFormulasList, this));
+                }
+            },
+            "#toolbar-button-insertformula": {
+                click: function (btn) {
+                    this._handleInsertFormula(btn.menu, {
+                        func: "SUM"
+                    });
+                }
+            },
+            "#toolbar-menu-insertformula": {
+                click: this._handleInsertFormula
+            },
+            "#infobox-cell-edit": {
+                blur: function (o) {
+                    if (this.api.isTextAreaBlur !== null) {
+                        this.api.isTextAreaBlur = true;
+                    }
+                },
+                specialkey: function (o, e) {
+                    if (e.getKey() == e.ENTER && !e.altKey) {
+                        this.api.isTextAreaBlur = null;
+                    }
+                }
+            },
+            "ssecellinfo #infobox-cell-name": {
+                specialkey: function (o, e) {
+                    if (e.getKey() == e.ENTER) {
+                        this.api.asc_findCell(o.getValue());
+                        this.getInfoBox().fireEvent("editcomplete", this.getInfoBox());
+                    }
+                }
+            },
+            "ssecellinfo": {
+                resize: function (o, adjWidth, adjHeight, opts) {
+                    this.getButtonExpand()[adjHeight > 23 ? "addCls" : "removeCls"]("button-collapse");
+                }
+            },
+            "ssecellinfo #infobox-cell-multiline-button": {
+                click: this._expandFormulaField
+            },
+            "#field-formula-splitter": {
+                beforedragstart: function (obj, event) {
+                    return event.currentTarget && !event.currentTarget.disabled;
+                },
+                move: function (obj, x, y) {
+                    delete this.getInfoBox().width;
+                }
+            }
+        });
+    },
+    setApi: function (o) {
+        this.api = o;
+        if (this.api) {
+            this.api.isTextAreaBlur = false;
+            this.api.asc_registerCallback("asc_onSelectionNameChanged", Ext.bind(this.updateBox, this));
+            this.api.asc_registerCallback("asc_onEditCell", Ext.bind(this._onEditCell, this));
+            this.api.asc_registerCallback("asc_onСoAuthoringDisconnect", Ext.bind(this.onCoAuthoringDisconnect, this));
+        }
+    },
+    updateBox: function (info) {
+        this.getInfoBox().updateCellInfo(info);
+    },
+    _onEditCell: function (state) {
+        if (state == c_oAscCellEditorState.editStart) {
+            this.api.isCellEdited = true;
+        } else {
+            if (state == c_oAscCellEditorState.editEnd) {
+                this.api.isCellEdited = false;
+            }
+        }
+    },
+    _reloadFormulas: function () {
+        var arrFuncs = [];
+        this.arrGroups = [];
+        dlgFormulas.arrayFormula = [];
+        var groupFuncs, groupName, addGroup;
+        var qa = this.api.asc_getFormulasInfo();
+        for (var i = 0; i < qa.length; i++) {
+            groupName = qa[i].asc_getGroupName();
+            groupFuncs = qa[i].asc_getFormulasArray();
+            addGroup = false;
+            for (var j = 0; j < groupFuncs.length; j++) {
+                if (addGroup !== true) {
+                    this.arrGroups.push(groupName);
+                    addGroup = true;
+                }
+                arrFuncs.push({
+                    group: groupName,
+                    func: groupFuncs[j].asc_getName(),
+                    args: groupFuncs[j].asc_getArguments()
+                });
+                dlgFormulas.arrayFormula.push(groupFuncs[j].asc_getName());
+            }
+        }
+        this.getFormulaList().getStore().loadData(arrFuncs);
+    },
+    _smoothScrollIntoView: function (element, container) {
+        var c = Ext.getDom(container) || Ext.getBody().dom,
+        o = element.getOffsetsTo(c),
+        t = o[1] + c.scrollTop;
+        var newCTop = t - c.clientHeight / 2;
+        if (newCTop < 0) {
+            newCTop = 0;
+        }
+        container.scrollTo("top", newCTop, true);
+    },
+    scrollViewToNode: function (dataview, node) {
+        if (dataview && node) {
+            var plugin = dataview.getPlugin("scrollpane");
+            if (plugin) {
+                var doScroll = new Ext.util.DelayedTask(function () {
+                    plugin.scrollToElement(node, false, true);
+                });
+                doScroll.delay(100);
+            }
+        }
+    },
+    keypressFormulasList: function (event, el) {
+        if ((new Date().getTime()) - this.funcSearch.presstime > 3000) {
+            this.funcSearch.word = "";
+        }
+        var store = this.getFormulaList().getStore();
+        var symbol = String.fromCharCode(event.getCharCode());
+        var index = this.funcSearch.index;
+        if (/[a-zA-Z]/.test(symbol)) {
+            this.funcSearch.word += symbol;
+            this.funcSearch.index = store.find("func", this.funcSearch.word, index);
+            if (this.funcSearch.index < 0) {
+                this.funcSearch.word = symbol;
+                this.funcSearch.index = store.find("func", this.funcSearch.word, index + 1);
+            }
+            if (this.funcSearch.index < 0) {
+                this.funcSearch.index = store.find("func", this.funcSearch.word, 0);
+            }
+            if (! (this.funcSearch.index < 0)) {
+                this.getFormulaList().getSelectionModel().select(this.funcSearch.index);
+                var row = this.getFormulaList().getView().getNode(this.funcSearch.index);
+                this.scrollViewToNode(this.getFormulaList(), row);
+            }
+        }
+        this.funcSearch.presstime = new Date().getTime();
+    },
+    _handleInsertFormula: function (menu, item, opt) {
+        if (item.func === "more") {
+            var me = this;
+            dlgFormulas.addListener("onmodalresult", function (o, mr, s) {
+                me.getToolBar().fireEvent("editcomplete", me.getToolBar(), {
+                    checkorder: true
+                });
+                Common.component.Analytics.trackEvent("Toolbar", "Insert formula");
+            },
+            this, {
+                single: true
+            });
+            dlgFormulas.show();
+        } else {
+            if (! (this.getFormulaList().getStore().getCount() > 0)) {
+                this._reloadFormulas();
+            }
+            var index = this.getFormulaList().getStore().findExact("func", item.func);
+            if (! (index < 0)) {
+                var record = this.getFormulaList().getStore().getAt(index);
+                this.api.asc_insertFormula(record.data.func, true);
+            }
+            this.getToolBar().fireEvent("editcomplete", this.getToolBar(), {
+                checkorder: true
+            });
+            Common.component.Analytics.trackEvent("ToolBar", "Insert formula");
+        }
+    },
+    _expandFormulaField: function () {
+        if (this.getInfoBox().getHeight() > 23) {
+            this.getInfoBox().keep_height = this.getInfoBox().getHeight();
+            this.getInfoBox().setHeight(23);
+            this.getButtonExpand().removeCls("button-collapse");
+        } else {
+            this.getInfoBox().setHeight(this.getInfoBox().keep_height);
+            this.getButtonExpand().addCls("button-collapse");
+        }
+    },
+    onCoAuthoringDisconnect: function () {
+        if (dlgFormulas.isVisible()) {
+            dlgFormulas.hide();
+        }
+        this.getInfoBox().setMode({
+            isDisconnected: true
+        });
+    }
+});

OfficeWeb/apps/spreadsheeteditor/main/app/controller/CreateFile.js

@@ -0,0 +1,164 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ var url_create_template = "{0}?title={1}&template={2}&action=create&doctype=spreadsheet";
+var url_create_new = "{0}?title={1}&action=create&doctype=spreadsheet";
+Ext.define("SSE.controller.CreateFile", {
+    extend: "Ext.app.Controller",
+    uses: ["SSE.view.OpenDialog"],
+    views: ["CreateFile"],
+    stores: ["FileTemplates"],
+    refs: [{
+        ref: "filePanel",
+        selector: "ssefile"
+    }],
+    init: function () {
+        Common.Gateway.on("init", Ext.bind(this.loadConfig, this));
+        this.control({
+            "ssecreatenew": {
+                afterrender: Ext.bind(this.onRenderView, this, {
+                    single: true
+                })
+            },
+            "ssecreatenew dataview": {
+                itemclick: this.onTemplateClick
+            },
+            "ssefile #file-button-createnew": {
+                click: function (el, event) {
+                    var templates = this.getFileTemplatesStore();
+                    if (! (templates && templates.getCount())) {
+                        this.onBlankDocClick(event, el);
+                    }
+                }
+            },
+            "ssefile button[docType]": {
+                click: this.clickBtnDownloadAs
+            },
+            "ssefile button[docType=0]": {
+                click: this.clickBtnDownloadAs
+            }
+        });
+    },
+    loadConfig: function (data) {
+        var templates = this.getFileTemplatesStore();
+        if (templates) {
+            templates.removeAll();
+            if (data && data.config) {
+                this.createUrl = data.config.createUrl;
+                this.nativeApp = data.config.nativeApp;
+                if (data.config.templates) {
+                    templates.add(data.config.templates);
+                }
+            }
+        }
+    },
+    onRenderView: function () {
+        var btnBlankDocument = Ext.fly("id-create-blank-document");
+        if (btnBlankDocument) {
+            btnBlankDocument.addClsOnOver("over");
+            btnBlankDocument.on("click", this.onBlankDocClick, this);
+        }
+    },
+    onBlankDocClick: function (event, el) {
+        var filePanel = this.getFilePanel();
+        if (filePanel) {
+            filePanel.closeMenu();
+        }
+        if (this.nativeApp === true) {
+            this.api.asc_openNewDocument();
+        } else {
+            if (this.createUrl && this.createUrl.length) {
+                var newDocumentPage = window.open(Ext.String.format(url_create_new, this.createUrl, this.newDocumentTitle));
+                if (newDocumentPage) {
+                    newDocumentPage.focus();
+                }
+            }
+        }
+        Common.component.Analytics.trackEvent("Create New", "Blank");
+    },
+    onTemplateClick: function (view, record, item, index, e) {
+        var filePanel = this.getFilePanel();
+        if (filePanel) {
+            filePanel.closeMenu();
+        }
+        if (this.nativeApp === true) {
+            this.api.asc_openNewDocument(record.data.name);
+        } else {
+            if (this.createUrl && this.createUrl.length) {
+                var newDocumentPage = window.open(Ext.String.format(url_create_template, this.createUrl, this.newDocumentTitle, record.data.name));
+                if (newDocumentPage) {
+                    newDocumentPage.focus();
+                }
+            }
+        }
+        Common.component.Analytics.trackEvent("Create New");
+    },
+    setApi: function (o) {
+        this.api = o;
+        return this;
+    },
+    clickBtnDownloadAs: function (btn) {
+        if (this.api) {
+            if (this.api.asc_drawingObjectsExist() && btn.docType != c_oAscFileType.XLSX) {
+                Ext.create("Ext.window.MessageBox", {
+                    buttonText: {
+                        ok: "OK",
+                        yes: "Yes",
+                        no: "No",
+                        cancel: this.textCancel
+                    }
+                }).show({
+                    title: this.textWarning,
+                    msg: this.warnDownloadAs,
+                    icon: Ext.Msg.QUESTION,
+                    buttons: Ext.Msg.OKCANCEL,
+                    scope: this,
+                    fn: function (res, text) {
+                        if (res == "ok") {
+                            this.getFilePanel().fireEvent("downloadas");
+                            this.api.asc_DownloadAs(btn.docType);
+                            this.getFilePanel().closeMenu();
+                        }
+                    }
+                });
+            } else {
+                this.getFilePanel().fireEvent("downloadas");
+                this.api.asc_DownloadAs(btn.docType);
+                this.getFilePanel().closeMenu();
+            }
+        }
+        Common.component.Analytics.trackEvent("Download As", String(btn.docType));
+    },
+    warnDownloadAs: "If you continue saving in this format all the charts and images will be lost.<br>Are you sure you want to continue?",
+    newDocumentTitle : "Unnamed document",
+    textWarning: "Warning",
+    textCancel: "Cancel"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/controller/DocumentHolder.js

@@ -0,0 +1,818 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.controller.DocumentHolder", {
+    extend: "Ext.app.Controller",
+    requires: [],
+    views: ["DocumentHolder"],
+    uses: ["SSE.view.AutoFilterDialog", "SSE.view.DigitalFilterDialog", "SSE.view.SetValueDialog", "SSE.view.ParagraphSettingsAdvanced", "SSE.view.HyperlinkSettings"],
+    refs: [{
+        ref: "documentHolder",
+        selector: "ssedocumentholder"
+    },
+    {
+        ref: "splitterMainMenu",
+        selector: "#main-menu-splitter"
+    }],
+    init: function () {
+        this.tooltips = {
+            hyperlink: {},
+            comment: {},
+            coauth: {
+                ttHeight: 20
+            }
+        };
+        this.mouse = {};
+        this.popupmenu = false;
+        this.control({
+            "ssedocumentholder": {
+                resize: this._handleDocumentResize,
+                afterrender: this._onAfterRender
+            },
+            "menu[group=menu-document]": {
+                show: function () {
+                    this.popupmenu = true;
+                    if (this.tooltips.comment.editCommentId || this.tooltips.comment.viewCommentId) {
+                        this.tooltips.comment.viewCommentId = this.tooltips.comment.editCommentId = this.tooltips.comment.moveCommentId = undefined;
+                        this.getController("Common.controller.CommentsPopover").onApiHideComment();
+                    }
+                },
+                hide: function (cnt, eOpt) {
+                    this.popupmenu = false;
+                    this.getDocumentHolder().fireEvent("editcomplete", this.getDocumentHolder());
+                }
+            },
+            "#view-main-menu": {
+                panelbeforeshow: function (fullscreen) {
+                    this._isMenuHided = true;
+                    if (fullscreen !== true) {
+                        this.getSplitterMainMenu().show();
+                        this.getDocumentHolder().addCls("left-border");
+                        Ext.ComponentQuery.query("#infobox-container-cell-name")[0].addCls("left-border");
+                    }
+                },
+                panelbeforehide: function () {
+                    this._isMenuHided = true;
+                },
+                panelshow: function (panel, fullscreen) {
+                    this._isMenuHided = false;
+                    this._isFullscreenMenu = fullscreen;
+                    if (!fullscreen) {
+                        var me = this;
+                        me._handleDocumentResize(me.getDocumentHolder(), me.getDocumentHolder().getWidth(), me.getDocumentHolder().getHeight());
+                        if (!panel.isSizeInit) {
+                            panel.isSizeInit = true;
+                            var view = panel.down("dataview");
+                            if (view) {
+                                var nodes = view.getNodes(),
+                                width_parent = panel.getWidth();
+                                for (var item in nodes) {
+                                    nodes[item].style["width"] = width_parent + "px";
+                                }
+                            }
+                        }
+                    }
+                },
+                panelhide: function (panel, fullscreen) {
+                    this._isMenuHided = false;
+                    this._isFullscreenMenu = false;
+                    if (!fullscreen) {
+                        var me = this;
+                        me._handleDocumentResize(me.getDocumentHolder(), me.getDocumentHolder().getWidth(), me.getDocumentHolder().getHeight());
+                        me.getSplitterMainMenu().hide();
+                        me.getDocumentHolder().removeCls("left-border");
+                        Ext.ComponentQuery.query("#infobox-container-cell-name")[0].removeCls("left-border");
+                    }
+                }
+            },
+            "#cmi-add-comment": {
+                click: this._addComment
+            },
+            "menu[action=insert-cells]": {
+                click: this.handleCellInsertMenu
+            },
+            "menu[action=delete-cells]": {
+                click: this.handleCellDeleteMenu
+            },
+            "#cmi-sort-cells": {
+                click: this.handleCellSortMenu
+            },
+            "#context-menu-cell": {
+                click: this.handleCellsMenu
+            },
+            "#main-menu-splitter": {
+                beforedragstart: function (obj, event) {
+                    return !event.currentTarget.disabled;
+                },
+                move: function (obj, x, y) {
+                    if (this._isMenuHided) {
+                        return;
+                    }
+                    var jsp_container, width_parent = obj.up("container").down("ssemainmenu").getWidth();
+                    if (width_parent > 40) {
+                        width_parent -= 40;
+                        Ext.ComponentQuery.query("dataview[group=scrollable]").forEach(function (list) {
+                            var nodes = list.getNodes();
+                            for (var item in nodes) {
+                                nodes[item].style["width"] = width_parent + "px";
+                            }
+                            list.getEl().setWidth(width_parent);
+                            jsp_container = list.getEl().down(".jspContainer");
+                            if (jsp_container) {
+                                jsp_container.setWidth(width_parent);
+                                list.getEl().down(".jspPane").setWidth(width_parent);
+                            }
+                        });
+                    }
+                }
+            },
+            "menu[action=setting-hide]": {
+                click: function (menu, item) {
+                    var current = this.api.asc_getSheetViewSettings();
+                    switch (item.action) {
+                    case "headers":
+                        current.asc_setShowRowColHeaders(item.checked);
+                        break;
+                    case "lines":
+                        current.asc_setShowGridLines(item.checked);
+                        break;
+                    }
+                    this.api.asc_setSheetViewSettings(current);
+                }
+            },
+            "menuitem[group=popupparagraphvalign]": {
+                click: this._onParagraphVAlign
+            },
+            "menuitem[action=image-grouping]": {
+                click: function (btn) {
+                    this.api[btn.grouping ? "asc_groupGraphicsObjects" : "asc_unGroupGraphicsObjects"]();
+                    this.getDocumentHolder().fireEvent("editcomplete", this.getDocumentHolder());
+                }
+            },
+            "menuitem[action=add-hyperlink-shape]": {
+                click: this._handleAddHyperlink
+            },
+            "menuitem[action=remove-hyperlink-shape]": {
+                click: this._handleRemoveHyperlink
+            },
+            "menuitem[action=remove-hyperlink]": {
+                click: this._handleRemoveHyperlink
+            },
+            "menuitem[action=text-advanced]": {
+                click: this._handleTextAdvanced
+            }
+        });
+        this.wrapEvents = {
+            apiShowComment: Ext.bind(this.onApiShowComment, this),
+            apiHideComment: Ext.bind(this.onApiHideComment, this)
+        };
+    },
+    setApi: function (o) {
+        this.api = o;
+        this.api.asc_registerCallback("asc_onMouseMove", Ext.bind(this.onApiMouseMove, this));
+        this.api.asc_registerCallback("asc_onHideComment", this.wrapEvents.apiHideComment);
+        this.api.asc_registerCallback("asc_onShowComment", this.wrapEvents.apiShowComment);
+        this.api.asc_registerCallback("asc_onHyperlinkClick", Ext.bind(this.onHyperlinkClick, this));
+        this.api.asc_registerCallback("asc_onSetAFDialog", Ext.bind(this.onAutofilter, this));
+        this.api.asc_registerCallback("asc_onСoAuthoringDisconnect", Ext.bind(this.onCoAuthoringDisconnect, this));
+        return this;
+    },
+    resetApi: function (api) {
+        this.api.asc_unregisterCallback("asc_onHideComment", this.wrapEvents.apiHideComment);
+        this.api.asc_unregisterCallback("asc_onShowComment", this.wrapEvents.apiShowComment);
+        this.api.asc_registerCallback("asc_onHideComment", this.wrapEvents.apiHideComment);
+        this.api.asc_registerCallback("asc_onShowComment", this.wrapEvents.apiShowComment);
+    },
+    onCoAuthoringDisconnect: function () {
+        this.permissions.isEdit = false;
+    },
+    loadConfig: function (data) {
+        this.editorConfig = data.config;
+    },
+    setMode: function (m) {
+        this.permissions = m;
+    },
+    onApiMouseMove: function (dataarray) {
+        if (!this._isFullscreenMenu && dataarray.length) {
+            var index_hyperlink, index_comments, index_locked;
+            for (var i = dataarray.length; i > 0; i--) {
+                switch (dataarray[i - 1].asc_getType()) {
+                case c_oAscMouseMoveType.Hyperlink:
+                    index_hyperlink = i;
+                    break;
+                case c_oAscMouseMoveType.Comment:
+                    index_comments = i;
+                    break;
+                case c_oAscMouseMoveType.LockedObject:
+                    index_locked = i;
+                    break;
+                }
+            }
+            var me = this;
+            if (index_hyperlink) {
+                var data = dataarray[index_hyperlink - 1];
+                var props = data.asc_getHyperlink();
+                if (props.asc_getType() == c_oAscHyperlinkType.WebLink) {
+                    var linkstr = props.asc_getTooltip();
+                    if (linkstr) {
+                        linkstr = Ext.String.htmlEncode(linkstr) + "<br><b>" + me.textCtrlClick + "</b>";
+                    } else {
+                        linkstr = props.asc_getHyperlinkUrl() + "<br><b>" + me.textCtrlClick + "</b>";
+                    }
+                } else {
+                    linkstr = props.asc_getTooltip() || (props.asc_getSheet() + "!" + props.asc_getRange());
+                }
+                if (me.tooltips.hyperlink.ref && me.tooltips.hyperlink.ref.isVisible()) {
+                    if (me.tooltips.hyperlink.text != linkstr) {
+                        me.tooltips.hyperlink.ref.close();
+                    }
+                }
+                if (!me.tooltips.hyperlink.ref || !me.tooltips.hyperlink.ref.isVisible()) {
+                    me.tooltips.hyperlink.text = linkstr;
+                    me.tooltips.hyperlink.ref = Ext.create("Ext.tip.ToolTip", {
+                        closeAction: "destroy",
+                        dismissDelay: 2000,
+                        html: linkstr,
+                        listeners: {
+                            beforeclose: function () {
+                                me.tooltips.hyperlink.ref = undefined;
+                                me.tooltips.hyperlink.text = "";
+                            },
+                            hide: function () {
+                                me.tooltips.hyperlink.ref = undefined;
+                                me.tooltips.hyperlink.text = "";
+                            }
+                        }
+                    });
+                    me.tooltips.hyperlink.ref.show();
+                    var xy = me.tooltips.hyperlink.ref.getEl().getAlignToXY("editor_sdk", "tl?", [data.asc_getX() + 4, data.asc_getY() + 6]);
+                    me.tooltips.hyperlink.ref.showAt(xy);
+                }
+            }
+            if (me.permissions.isEdit) {
+                if (index_comments && !this.popupmenu) {
+                    data = dataarray[index_comments - 1];
+                    if (!me.tooltips.comment.editCommentId && me.tooltips.comment.moveCommentId != data.asc_getCommentIndexes()[0]) {
+                        me.tooltips.comment.moveCommentId = data.asc_getCommentIndexes()[0];
+                        if (me.tooltips.comment.moveCommentTimer) {
+                            clearTimeout(me.tooltips.comment.moveCommentTimer);
+                        }
+                        var idxs = data.asc_getCommentIndexes(),
+                        x = data.asc_getX(),
+                        y = data.asc_getY(),
+                        leftx = data.asc_getReverseX();
+                        me.tooltips.comment.moveCommentTimer = setTimeout(function () {
+                            if (me.tooltips.comment.moveCommentId && !me.tooltips.comment.editCommentId) {
+                                me.tooltips.comment.viewCommentId = me.tooltips.comment.moveCommentId;
+                                me.getController("Common.controller.CommentsPopover").onApiShowComment(idxs, x, y, leftx, false);
+                            }
+                        },
+                        400);
+                    }
+                } else {
+                    me.tooltips.comment.moveCommentId = undefined;
+                    if (me.tooltips.comment.viewCommentId != undefined) {
+                        me.tooltips.comment = {};
+                        this.getController("Common.controller.CommentsPopover").onApiHideComment();
+                    }
+                }
+                if (index_locked) {
+                    data = dataarray[index_locked - 1];
+                    if (!me.tooltips.coauth.XY) {
+                        me._handleDocumentResize(me.getDocumentHolder(), me.getDocumentHolder().getWidth(), me.getDocumentHolder().getHeight());
+                    }
+                    if (me.tooltips.coauth.x_point != data.asc_getX() || me.tooltips.coauth.y_point != data.asc_getY()) {
+                        me.hideTips();
+                        me.tooltips.coauth.x_point = data.asc_getX();
+                        me.tooltips.coauth.y_point = data.asc_getY();
+                        var src = Ext.DomHelper.append(Ext.getBody(), {
+                            tag: "div",
+                            cls: "username-tip"
+                        },
+                        true);
+                        src.applyStyles({
+                            height: me.tooltips.coauth.ttHeight + "px",
+                            position: "absolute",
+                            zIndex: "19000",
+                            visibility: "visible"
+                        });
+                        me.tooltips.coauth.ref = src;
+                        var is_sheet_lock = data.asc_getLockedObjectType() == c_oAscMouseMoveLockedObjectType.Sheet || data.asc_getLockedObjectType() == c_oAscMouseMoveLockedObjectType.TableProperties;
+                        var showPoint = [me.tooltips.coauth.x_point + me.tooltips.coauth.XY[0], me.tooltips.coauth.y_point + me.tooltips.coauth.XY[1]]; ! is_sheet_lock && (showPoint[0] = me.tooltips.coauth.bodyWidth - showPoint[0]);
+                        if (showPoint[1] > me.tooltips.coauth.XY[1] && showPoint[1] + me.tooltips.coauth.ttHeight < me.tooltips.coauth.XY[1] + me.tooltips.coauth.apiHeight) {
+                            Ext.DomHelper.overwrite(src, me._getUserName(data.asc_getUserId()));
+                            src.applyStyles({
+                                visibility: "visible"
+                            });
+                            is_sheet_lock && src.applyStyles({
+                                top: showPoint[1] + "px",
+                                left: showPoint[0] + "px"
+                            }) || src.applyStyles({
+                                top: showPoint[1] + "px",
+                                right: showPoint[0] + "px"
+                            });
+                        }
+                    }
+                } else {
+                    me.hideTips();
+                }
+            }
+        }
+    },
+    onApiHideComment: function () {
+        this.tooltips.comment.viewCommentId = this.tooltips.comment.editCommentId = this.tooltips.comment.moveCommentId = undefined;
+    },
+    onApiShowComment: function (commentId, posX, posY, leftx, isnew) {
+        commentId = commentId[0];
+        if (this.tooltips.comment.viewCommentId) {
+            this.tooltips.comment.viewCommentId = undefined;
+            this.tooltips.comment.editCommentId = commentId;
+            this.getController("Common.controller.CommentsPopover").makeCommentEditable(commentId);
+        } else {
+            if (this.tooltips.comment.editCommentId == commentId) {} else {
+                this.tooltips.comment.editCommentId = commentId;
+                if (isnew) {
+                    if (!this.getDocumentHolder().isLiveCommenting) {
+                        var mainMenuCmp = Ext.getCmp("view-main-menu");
+                        mainMenuCmp && mainMenuCmp.selectMenu("menuComments");
+                    }
+                    var popupComment = Ext.ComponentQuery.query("commoncommentspopover");
+                    if (popupComment.length) {
+                        popupComment = popupComment[0];
+                        popupComment.fireTransformToAdd();
+                        var dataView = popupComment.query("dataview")[0];
+                        if (dataView) {
+                            dataView.on("viewready", function () {
+                                popupComment.fireTransformToAdd();
+                            },
+                            this);
+                        }
+                    }
+                }
+            }
+        }
+    },
+    onHyperlinkClick: function (url) {
+        var newDocumentPage = window.open(url, "_blank");
+        if (newDocumentPage) {
+            newDocumentPage.focus();
+        }
+    },
+    _getUserName: function (id) {
+        var usersStore = Ext.getStore("Common.store.Users");
+        if (usersStore) {
+            var rec = usersStore.findRecord("id", id);
+            if (rec) {
+                return Ext.String.ellipsis(Ext.String.htmlEncode(rec.get("username")), 25, true);
+            }
+        }
+        return this.guestText;
+    },
+    hideTips: function () {
+        if (this.tooltips.coauth.ref) {
+            Ext.destroy(this.tooltips.coauth.ref);
+            this.tooltips.coauth.ref = undefined;
+            this.tooltips.coauth.x_point = undefined;
+            this.tooltips.coauth.y_point = undefined;
+        }
+    },
+    _handleDocumentResize: function (obj, width, height) {
+        var me = this;
+        setTimeout(function () {
+            me.tooltips.coauth.XY = obj.getPosition();
+            me.tooltips.coauth.apiHeight = height;
+            me.tooltips.coauth.bodyWidth = Ext.getBody().getWidth();
+        },
+        10);
+    },
+    _onAfterRender: function (ct) {
+        ct.addCls("top-border");
+        document.body.onmousedown = Ext.bind(this._handleRightDown, this);
+        document.body.onmouseup = Ext.bind(this._handleRightUp, this);
+        var meEl = ct.getEl();
+        meEl.on({
+            contextmenu: {
+                fn: this._showObjectMenu,
+                preventDefault: true,
+                scope: this
+            },
+            mousewheel: this._handleDocumentWheel,
+            keydown: this._handleKeyDown,
+            click: function (event, el) {
+                if (this.api) {
+                    this.api.isTextAreaBlur = false;
+                    if (! (el instanceof HTMLTextAreaElement || el instanceof HTMLInputElement)) {
+                        this.getDocumentHolder().focus(false);
+                    }
+                }
+            },
+            scope: this
+        });
+        Ext.getDoc().on("mousewheel", this._handleDocumentWheel, this);
+        Ext.getDoc().on("keydown", this._handleDocumentKeyDown, this);
+    },
+    _handleDocumentWheel: function (event) {
+        if (this.api) {
+            var delta = event.getWheelDelta();
+            if (event.ctrlKey) {
+                var f = this.api.asc_getZoom();
+                if (delta < 0) {
+                    f -= 0.1;
+                    if (! (f < 0.5)) {
+                        this.api.asc_setZoom(f);
+                    }
+                } else {
+                    if (delta > 0) {
+                        f += 0.1;
+                        if (f > 0 && !(f > 2)) {
+                            this.api.asc_setZoom(f);
+                        }
+                    }
+                }
+                event.stopEvent();
+            }
+        }
+    },
+    _handleDocumentKeyDown: function (event) {
+        if (this.api) {
+            var key = event.getKey();
+            if ((event.ctrlKey || event.metaKey) && !event.shiftKey) {
+                if (key === event.NUM_PLUS || (Ext.isOpera && key == 43)) {
+                    if (!this.api.isCellEdited) {
+                        var f = this.api.asc_getZoom() + 0.1;
+                        if (f > 0 && !(f > 2)) {
+                            this.api.asc_setZoom(f);
+                        }
+                        event.stopEvent();
+                        return false;
+                    }
+                } else {
+                    if (key === event.NUM_MINUS || (Ext.isOpera && key == 45)) {
+                        if (!this.api.isCellEdited) {
+                            f = this.api.asc_getZoom() - 0.1;
+                            if (! (f < 0.5)) {
+                                this.api.asc_setZoom(f);
+                            }
+                            event.stopEvent();
+                            return false;
+                        }
+                    }
+                }
+            }
+        }
+    },
+    _handleRightDown: function (event, docElement, eOpts) {
+        event.button == 0 && (this.mouse.isLeftButtonDown = true);
+        event.button == 2 && (this.mouse.isRightButtonDown = true);
+    },
+    _handleRightUp: function (event, docElement, eOpts) {
+        event.button == 0 && (this.mouse.isLeftButtonDown = false);
+    },
+    _handleKeyDown: function (event, docElement, eOpts) {
+        if (event.getKey() == event.F10 && event.shiftKey) {
+            event.stopEvent();
+            this._showObjectMenu(event, docElement, eOpts);
+        }
+    },
+    _showObjectMenu: function (event, docElement, eOpts) {
+        if (this.api && this.permissions.isEdit && !this.mouse.isLeftButtonDown) {
+            var iscellmenu, isrowmenu, iscolmenu, isallmenu, ischartmenu, isimagemenu, istextshapemenu;
+            var holder = this.getDocumentHolder();
+            var cellinfo = this.api.asc_getCellInfo();
+            var seltype = cellinfo.asc_getFlags().asc_getSelectionType();
+            switch (seltype) {
+            case c_oAscSelectionType.RangeCells:
+                iscellmenu = true;
+                break;
+            case c_oAscSelectionType.RangeRow:
+                isrowmenu = true;
+                break;
+            case c_oAscSelectionType.RangeCol:
+                iscolmenu = true;
+                break;
+            case c_oAscSelectionType.RangeMax:
+                isallmenu = true;
+                break;
+            case c_oAscSelectionType.RangeImage:
+                isimagemenu = true;
+                break;
+            case c_oAscSelectionType.RangeShape:
+                isimagemenu = true;
+                break;
+            case c_oAscSelectionType.RangeShapeText:
+                istextshapemenu = true;
+                break;
+            }
+            if (isimagemenu) {
+                holder.mnuUnGroupImg.setDisabled(!this.api.asc_canUnGroupGraphicsObjects());
+                holder.mnuGroupImg.setDisabled(!this.api.asc_canGroupGraphicsObjects());
+                this._showPopupMenu(holder.imgMenu, {},
+                event, docElement, eOpts);
+            } else {
+                if (istextshapemenu) {
+                    holder.pmiTextAdvanced.textInfo = undefined;
+                    var SelectedObjects = this.api.asc_getGraphicObjectProps();
+                    for (var i = 0; i < SelectedObjects.length; i++) {
+                        var elType = SelectedObjects[i].asc_getObjectType();
+                        if (elType == c_oAscTypeSelectElement.Image) {
+                            var value = SelectedObjects[i].asc_getObjectValue();
+                            var align = value.asc_getVerticalTextAlign();
+                            holder.menuParagraphTop.setChecked(align == c_oAscVerticalTextAlign.TEXT_ALIGN_TOP);
+                            holder.menuParagraphCenter.setChecked(align == c_oAscVerticalTextAlign.TEXT_ALIGN_CTR);
+                            holder.menuParagraphBottom.setChecked(align == c_oAscVerticalTextAlign.TEXT_ALIGN_BOTTOM);
+                        } else {
+                            if (elType == c_oAscTypeSelectElement.Paragraph) {
+                                holder.pmiTextAdvanced.textInfo = SelectedObjects[i].asc_getObjectValue();
+                            }
+                        }
+                    }
+                    var hyperinfo = cellinfo.asc_getHyperlink();
+                    holder.pmiInsHyperlinkShape.setVisible(this.api.asc_canAddShapeHyperlink() !== false);
+                    holder.pmiInsHyperlinkShape.cellInfo = cellinfo;
+                    holder.pmiInsHyperlinkShape.setText((hyperinfo) ? holder.editHyperlinkText : holder.txtInsHyperlink);
+                    holder.pmiRemoveHyperlinkShape.setVisible(hyperinfo !== undefined && hyperinfo !== null);
+                    holder.pmiTextAdvanced.setVisible(holder.pmiTextAdvanced.textInfo !== undefined);
+                    this._showPopupMenu(holder.textInShapeMenu, {},
+                    event, docElement, eOpts);
+                } else {
+                    if ((seltype !== c_oAscSelectionType.RangeImage && seltype !== c_oAscSelectionType.RangeShape && seltype !== c_oAscSelectionType.RangeShapeText)) {
+                        holder.pmiInsertEntire.setVisible(isrowmenu || iscolmenu);
+                        holder.pmiDeleteEntire.setVisible(isrowmenu || iscolmenu);
+                        holder.pmiInsertCells.setVisible(iscellmenu);
+                        holder.pmiDeleteCells.setVisible(iscellmenu);
+                        holder.pmiSortCells.setVisible(iscellmenu || isallmenu);
+                        holder.pmiInsFunction.setVisible(iscellmenu);
+                        holder.pmiInsHyperlink.setVisible(iscellmenu);
+                        holder.pmiDelHyperlink.setVisible(false);
+                        if (iscellmenu) {
+                            if (cellinfo.asc_getHyperlink()) {
+                                holder.pmiInsHyperlink.setText(holder.editHyperlinkText);
+                                holder.pmiDelHyperlink.setVisible(true);
+                            } else {
+                                holder.pmiInsHyperlink.setText(holder.txtInsHyperlink);
+                            }
+                        }
+                        holder.pmiRowHeight.setVisible(isrowmenu || isallmenu);
+                        holder.pmiColumnWidth.setVisible(iscolmenu || isallmenu);
+                        holder.pmiEntireHide.setVisible(iscolmenu || isrowmenu);
+                        holder.pmiEntireShow.setVisible(iscolmenu || isrowmenu);
+                        holder.ssMenu.items.items[10].setVisible(iscellmenu && this.permissions.canCoAuthoring);
+                        holder.pmiAddComment.setVisible(iscellmenu && this.permissions.canCoAuthoring);
+                        holder.pmiCellMenuSeparator.setVisible(iscellmenu || isrowmenu || iscolmenu || isallmenu);
+                        holder.pmiEntireHide.isrowmenu = isrowmenu;
+                        holder.pmiEntireShow.isrowmenu = isrowmenu;
+                        this._showPopupMenu(holder.ssMenu, {},
+                        event, docElement, eOpts);
+                    }
+                }
+            }
+        }
+        this.mouse.isRightButtonDown = false;
+    },
+    _showPopupMenu: function (menu, value, event, docElement, eOpts) {
+        if (Ext.isDefined(menu)) {
+            Ext.menu.Manager.hideAll();
+            var showPoint = event.getXY();
+            if (!this.mouse.isRightButtonDown) {
+                var coord = this.api.asc_getActiveCellCoord();
+                var offset = $("#" + this.getDocumentHolder().id).offset();
+                showPoint[0] = coord.asc_getX() + coord.asc_getWidth() + offset.left;
+                showPoint[1] = (coord.asc_getY() < 0 ? 0 : coord.asc_getY()) + coord.asc_getHeight() + offset.top;
+            } else {}
+            if (Ext.isFunction(menu.initMenu)) {
+                menu.initMenu(value);
+            }
+            menu.showAt(event.getXY());
+        }
+    },
+    _addComment: function (item, e, eOpt) {
+        var ascCommentData = new asc_CCommentData();
+        var now = new Date(),
+        timeZoneOffsetInMs = now.getTimezoneOffset() * 60000;
+        if (ascCommentData) {
+            ascCommentData.asc_putText("");
+            ascCommentData.asc_putTime((now.getTime() - timeZoneOffsetInMs).toString());
+            ascCommentData.asc_putUserId(this.editorConfig.user.id);
+            ascCommentData.asc_putUserName(this.editorConfig.user.name);
+            ascCommentData.asc_putDocumentFlag(false);
+            ascCommentData.asc_putSolved(false);
+            this.api.asc_addComment(ascCommentData);
+        }
+    },
+    handleCellsMenu: function (menu, item) {
+        if (item) {
+            if (item.action == "insert-entire") {
+                switch (this.api.asc_getCellInfo().asc_getFlags().asc_getSelectionType()) {
+                case c_oAscSelectionType.RangeRow:
+                    this.api.asc_insertCells(c_oAscInsertOptions.InsertRows);
+                    break;
+                case c_oAscSelectionType.RangeCol:
+                    this.api.asc_insertCells(c_oAscInsertOptions.InsertColumns);
+                    break;
+                }
+            } else {
+                if (item.action == "delete-entire") {
+                    switch (this.api.asc_getCellInfo().asc_getFlags().asc_getSelectionType()) {
+                    case c_oAscSelectionType.RangeRow:
+                        this.api.asc_deleteCells(c_oAscDeleteOptions.DeleteRows);
+                        break;
+                    case c_oAscSelectionType.RangeCol:
+                        this.api.asc_deleteCells(c_oAscDeleteOptions.DeleteColumns);
+                        break;
+                    }
+                } else {
+                    if (item.action == "row-height" || item.action == "column-width") {
+                        var me = this;
+                        var win = Ext.widget("setvaluedialog", {
+                            title: item.text,
+                            startvalue: item.action == "row-height" ? me.api.asc_getRowHeight() : me.api.asc_getColumnWidth(),
+                            maxvalue: 409,
+                            valuecaption: item.action == "row-height" ? this.txtHeight : this.txtWidth
+                        });
+                        win.addListener("onmodalresult", function (o, mr, v) {
+                            if (mr) {
+                                item.action == "row-height" ? me.api.asc_setRowHeight(v) : me.api.asc_setColumnWidth(v);
+                            }
+                            me.getDocumentHolder().fireEvent("editcomplete", me.getDocumentHolder());
+                        },
+                        me, {
+                            single: true
+                        });
+                        win.show();
+                    } else {
+                        if (item.action == "clear-all") {
+                            this.api.asc_emptyCells(c_oAscCleanOptions.All);
+                        }
+                    }
+                }
+            }
+        }
+    },
+    handleCellInsertMenu: function (menu, item) {
+        this.api.asc_insertCells(item.kind);
+        this.getDocumentHolder().fireEvent("editcomplete", this.getDocumentHolder());
+    },
+    handleCellDeleteMenu: function (menu, item) {
+        this.api.asc_deleteCells(item.kind);
+        this.getDocumentHolder().fireEvent("editcomplete", this.getDocumentHolder());
+    },
+    handleCellSortMenu: function (menu, item) {
+        this.api.asc_sortColFilter(item.direction, "");
+    },
+    onAutofilter: function (config) {
+        var me = this;
+        var dlgFilter = Ext.widget("sseautofilterdialog", {});
+        dlgFilter.addListener("onmodalresult", function (obj, mr, s) {
+            if (mr == 1) {
+                var sett = obj.getSettings();
+                me.api.asc_applyAutoFilter("mainFilter", sett);
+            } else {
+                if (mr == 2) {
+                    dlgCustom.show();
+                    return;
+                } else {
+                    if (mr == 3) {
+                        me.api.asc_sortColFilter(s, config.asc_getCellId());
+                    }
+                }
+            }
+            me.mouse.isLeftButtonDown = me.mouse.isRightButtonDown = false;
+            me.getDocumentHolder().fireEvent("editcomplete", me.getDocumentHolder());
+        },
+        this);
+        dlgFilter.setSettings(config);
+        dlgFilter.show();
+        var dlgCustom = Ext.widget("ssedigitalfilterdialog", {});
+        dlgCustom.setSettings(config);
+        dlgCustom.addListener("onmodalresult", function (obj, mr, s) {
+            if (mr == 1) {
+                me.api.asc_applyAutoFilter("digitalFilter", obj.getSettings());
+            }
+            me.mouse.isLeftButtonDown = me.mouse.isRightButtonDown = false;
+            me.getDocumentHolder().fireEvent("editcomplete", me.getDocumentHolder());
+        },
+        this);
+    },
+    onCellChanged: function (text, cursorPosition, isFormula, formulaPos, formulaName) {
+        if (isFormula && text.length > 1) {
+            var menu = this.getDocumentHolder().funcMenu;
+            var arr = dlgFormulas.arrayFormula.filter(function (item) {
+                return new RegExp("^" + text.substr(1), "i").test(item);
+            });
+            if (arr && arr.length) {
+                var i = -1;
+                while (++i < 5) {
+                    if (arr[i]) {
+                        menu.items.getAt(i).setText(arr[i]);
+                        menu.items.getAt(i).show();
+                    } else {
+                        menu.items.getAt(i).hide();
+                    }
+                }
+                var coord = this.api.asc_getActiveCellCoord();
+                var xy = menu.show().getEl().getAlignToXY("editor_sdk", "tl?", [coord.asc_getX(), coord.asc_getY() + coord.asc_getHeight() + 4]);
+                menu.showAt(xy);
+            }
+        }
+        console.log("onCellChanged: " + text + ", " + cursorPosition + ", " + isFormula + ", " + formulaPos + ", " + formulaName);
+    },
+    _onParagraphVAlign: function (item, e) {
+        var properties = new Asc.asc_CImgProperty();
+        properties.asc_putVerticalTextAlign(item.valign);
+        this.api.asc_setGraphicObjectProps(properties);
+    },
+    _handleAddHyperlink: function (item) {
+        var me = this;
+        var win, props;
+        if (me.api && item) {
+            var wc = me.api.asc_getWorksheetsCount(),
+            i = -1;
+            var items = [];
+            while (++i < wc) {
+                if (!this.api.asc_isWorksheetHidden(i)) {
+                    items.push([me.api.asc_getWorksheetName(i)]);
+                }
+            }
+            win = Ext.widget("ssehyperlinksettings", {
+                sheets: items
+            });
+            win.setSettings(item.cellInfo.asc_getHyperlink(), item.cellInfo.asc_getText(), item.cellInfo.asc_getFlags().asc_getLockText());
+        }
+        if (win) {
+            win.addListener("onmodalresult", function (o, mr) {
+                if (mr == 1) {
+                    props = win.getSettings();
+                    me.api.asc_insertHyperlink(props);
+                }
+                me.getDocumentHolder().fireEvent("editcomplete", me.getDocumentHolder());
+            },
+            false);
+            win.show();
+        }
+    },
+    _handleRemoveHyperlink: function () {
+        if (this.api) {
+            this.api.asc_removeHyperlink();
+            this.getDocumentHolder().fireEvent("editcomplete", this.getDocumentHolder());
+        }
+    },
+    _handleTextAdvanced: function (item) {
+        var me = this;
+        var win;
+        if (me.api && item) {
+            win = Ext.create("SSE.view.ParagraphSettingsAdvanced");
+            win.updateMetricUnit();
+            win.setSettings({
+                paragraphProps: item.textInfo,
+                api: me.api
+            });
+        }
+        if (win) {
+            win.addListener("onmodalresult", Ext.bind(function (o, mr, s) {
+                if (mr == 1 && s) {
+                    me.api.asc_setGraphicObjectProps(s.paragraphProps);
+                }
+            },
+            me), false);
+            win.addListener("close", function () {
+                me.getDocumentHolder().fireEvent("editcomplete", me.getDocumentHolder());
+            },
+            false);
+            win.show();
+        }
+    },
+    guestText: "Guest",
+    textCtrlClick: "Press CTRL and click link",
+    txtRowHeight: "Row Height",
+    txtHeight: "Height",
+    txtWidth: "Width",
+    tipIsLocked: "This element is being edited by another user."
+});

OfficeWeb/apps/spreadsheeteditor/main/app/controller/Print.js

@@ -0,0 +1,382 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.controller.Print", {
+    extend: "Ext.app.Controller",
+    uses: ["SSE.view.DocumentStatusInfo", "SSE.view.PrintSettings"],
+    views: ["MainSettingsPrint"],
+    refs: [{
+        ref: "toolbar",
+        selector: "ssetoolbar"
+    },
+    {
+        ref: "printAdvanced",
+        selector: "ssemainsettingsprint"
+    }],
+    init: function () {
+        this.adjPrintParams = new Asc.asc_CAdjustPrint();
+        this.adjPrintParams.asc_setPrintType(c_oAscPrintType.ActiveSheets);
+        this.adjPrintParams.asc_setLayoutPageType(c_oAscLayoutPageType.FitToWidth);
+        this.control({
+            "documentstatusinfo": {
+                "updatesheetsinfo": function () {
+                    this.isFillSheets = false;
+                    this.diffParams = {};
+                }
+            },
+            "ssemainsettingsprint": {
+                show: function () {
+                    if (!this.isFillSheets) {
+                        this.isFillSheets = true;
+                        this.updateSettings();
+                    }
+                    if (!this.isUpdatedSettings) {
+                        this.isUpdatedSettings = true;
+                        this.getPrintAdvanced().cmbSheet.select(this.getPrintAdvanced().cmbSheet.getStore().findRecord("sheetindex", this.api.asc_getActiveWorksheetIndex()));
+                    }
+                }
+            },
+            "sseprintsettings": {
+                onmodalresult: this.closePrintSettings
+            },
+            "#advsettings-print-combo-sheets": {
+                change: this.comboSheetsChange
+            },
+            "#advsettings-print-button-save": {
+                click: this.querySavePrintSettings
+            },
+            "#toolbar-menuitem-print-options": {
+                click: this.openPrintSettings
+            },
+            "#dialog-print-options-ok": {
+                click: this.queryClosePrintSettings
+            },
+            "#dialog-printoptions-grouprange": {
+                change: function (obj, newvalue, oldvalue, opts) {
+                    if (typeof(newvalue.printrange) == "number") {
+                        var panel = obj.up("window");
+                        if (newvalue.printrange == c_oAscPrintType.EntireWorkbook) {
+                            this.indeterminatePageOptions(panel);
+                        } else {
+                            if (obj.lastCheckedRange == c_oAscPrintType.EntireWorkbook) {
+                                this.fillPageOptions(panel, this.api.asc_getPageOptions());
+                            }
+                        }
+                        obj.lastCheckedRange = newvalue.printrange;
+                    }
+                }
+            }
+        });
+    },
+    setApi: function (o) {
+        this.api = o;
+    },
+    updateSettings: function () {
+        var panel = this.getPrintAdvanced();
+        panel.cmbSheet.getStore().removeAll();
+        var wc = this.api.asc_getWorksheetsCount(),
+        i = -1;
+        var items = [{
+            sheetname: this.strAllSheets,
+            sheetindex: -255
+        }];
+        while (++i < wc) {
+            if (!this.api.asc_isWorksheetHidden(i)) {
+                items.push({
+                    sheetname: this.api.asc_getWorksheetName(i).replace(/\s/g, "&nbsp;"),
+                    sheetindex: i
+                });
+            }
+        }
+        panel.cmbSheet.getStore().loadData(items);
+    },
+    comboSheetsChange: function (combo, newvalue, oldvalue, eopts) {
+        var panel = this.getPrintAdvanced();
+        if (newvalue == -255) {
+            this.indeterminatePageOptions(panel);
+        } else {
+            this.fillPageOptions(panel, this.api.asc_getPageOptions(newvalue));
+        }
+    },
+    isDiffRefill: function () {
+        for (var item in this.diffParams) {
+            if (this.diffParams[item] == undefined) {
+                return true;
+            }
+        }
+        return item == undefined;
+    },
+    indeterminatePageOptions: function (panel) {
+        if (this.isDiffRefill()) {
+            var wc = this.api.asc_getWorksheetsCount();
+            if (wc == 1) {
+                this.diffParams.orientation = false;
+                this.diffParams.size = false;
+                this.diffParams.headings = false;
+                this.diffParams.grid = false;
+                this.diffParams.margintop = false;
+                this.diffParams.marginright = false;
+                this.diffParams.marginbottom = false;
+                this.diffParams.marginleft = false;
+            } else {
+                var index = 0;
+                var opts = this.api.asc_getPageOptions(index),
+                opts_next;
+                while (++index < wc) {
+                    opts_next = this.api.asc_getPageOptions(index);
+                    if (this.diffParams.orientation == undefined) {
+                        this.diffParams.orientation = opts.asc_getPageSetup().asc_getOrientation() != opts_next.asc_getPageSetup().asc_getOrientation();
+                    }
+                    if (this.diffParams.size == undefined) {
+                        this.diffParams.size = (opts.asc_getPageSetup().asc_getWidth() != opts_next.asc_getPageSetup().asc_getWidth() || opts.asc_getPageSetup().asc_getHeight() != opts_next.asc_getPageSetup().asc_getHeight());
+                    }
+                    if (this.diffParams.headings == undefined) {
+                        this.diffParams.headings = opts.asc_getHeadings() != opts_next.asc_getHeadings();
+                    }
+                    if (this.diffParams.grid == undefined) {
+                        this.diffParams.grid = opts.asc_getGridLines() != opts_next.asc_getGridLines();
+                    }
+                    if (this.diffParams.margintop == undefined) {
+                        this.diffParams.margintop = opts.asc_getPageMargins().asc_getTop() != opts_next.asc_getPageMargins().asc_getTop();
+                    }
+                    if (this.diffParams.marginright == undefined) {
+                        this.diffParams.marginright = opts.asc_getPageMargins().asc_getRight() != opts_next.asc_getPageMargins().asc_getRight();
+                    }
+                    if (this.diffParams.marginbottom == undefined) {
+                        this.diffParams.marginbottom = opts.asc_getPageMargins().asc_getBottom() != opts_next.asc_getPageMargins().asc_getBottom();
+                    }
+                    if (this.diffParams.marginleft == undefined) {
+                        this.diffParams.marginleft = opts.asc_getPageMargins().asc_getLeft() != opts_next.asc_getPageMargins().asc_getLeft();
+                    }
+                }
+            }
+        }
+        if (this.diffParams.orientation) {
+            panel.cmbPaperOrientation.setValue("-");
+        }
+        if (this.diffParams.size) {
+            panel.cmbPaperSize.setValue("-");
+        }
+        if (this.diffParams.margintop) {
+            panel.spnMarginTop.setRawValue("-");
+        }
+        if (this.diffParams.marginright) {
+            panel.spnMarginRight.setRawValue("-");
+        }
+        if (this.diffParams.marginbottom) {
+            panel.spnMarginBottom.setRawValue("-");
+        }
+        if (this.diffParams.marginleft) {
+            panel.spnMarginLeft.setRawValue("-");
+        }
+        if (this.diffParams.grid) {
+            panel.chPrintGrid.setValue("indeterminate");
+        }
+        if (this.diffParams.headings) {
+            panel.chPrintRows.setValue("indeterminate");
+        }
+    },
+    fillPageOptions: function (panel, props) {
+        var opt = props.asc_getPageSetup();
+        var index = panel.cmbPaperOrientation.getStore().find("orient", opt.asc_getOrientation());
+        panel.cmbPaperOrientation.select(panel.cmbPaperOrientation.getStore().getAt(index));
+        var w = opt.asc_getWidth();
+        var h = opt.asc_getHeight();
+        index = panel.cmbPaperSize.getStore().find("size", w + "|" + h);
+        if (index < 0) {
+            panel.cmbPaperSize.setValue("Custom (" + w + " x " + h);
+        } else {
+            panel.cmbPaperSize.select(panel.cmbPaperSize.getStore().getAt(index));
+        }
+        opt = props.asc_getPageMargins();
+        panel.spnMarginLeft.setValue(Common.MetricSettings.fnRecalcFromMM(opt.asc_getLeft()));
+        panel.spnMarginTop.setValue(Common.MetricSettings.fnRecalcFromMM(opt.asc_getTop()));
+        panel.spnMarginRight.setValue(Common.MetricSettings.fnRecalcFromMM(opt.asc_getRight()));
+        panel.spnMarginBottom.setValue(Common.MetricSettings.fnRecalcFromMM(opt.asc_getBottom()));
+        panel.chPrintGrid.setValue(props.asc_getGridLines());
+        panel.chPrintRows.setValue(props.asc_getHeadings());
+    },
+    fillPrintOptions: function (panel, props) {
+        panel.groupRange.setValue({
+            printrange: props.asc_getPrintType()
+        });
+        panel.groupLayout.setValue({
+            printlayout: props.asc_getLayoutPageType()
+        });
+    },
+    getPageOptions: function (panel) {
+        var props = new Asc.asc_CPageOptions();
+        props.asc_setGridLines(panel.chPrintGrid.getValue() == "indeterminate" ? undefined : panel.chPrintGrid.getValue() == "checked" ? 1 : 0);
+        props.asc_setHeadings(panel.chPrintRows.getValue() == "indeterminate" ? undefined : panel.chPrintRows.getValue() == "checked" ? 1 : 0);
+        var opt = new Asc.asc_CPageSetup();
+        opt.asc_setOrientation(panel.cmbPaperOrientation.getValue() == "-" ? undefined : panel.cmbPaperOrientation.getValue());
+        var pagew = /^\d{3}\.?\d*/.exec(panel.cmbPaperSize.getValue());
+        var pageh = /\d{3}\.?\d*$/.exec(panel.cmbPaperSize.getValue());
+        opt.asc_setWidth(!pagew ? undefined : parseFloat(pagew[0]));
+        opt.asc_setHeight(!pageh ? undefined : parseFloat(pageh[0]));
+        props.asc_setPageSetup(opt);
+        opt = new Asc.asc_CPageMargins();
+        opt.asc_setLeft(panel.spnMarginLeft.getRawValue() == "-" ? undefined : Common.MetricSettings.fnRecalcToMM(panel.spnMarginLeft.getNumberValue()));
+        opt.asc_setTop(panel.spnMarginTop.getRawValue() == "-" ? undefined : Common.MetricSettings.fnRecalcToMM(panel.spnMarginTop.getNumberValue()));
+        opt.asc_setRight(panel.spnMarginRight.getRawValue() == "-" ? undefined : Common.MetricSettings.fnRecalcToMM(panel.spnMarginRight.getNumberValue()));
+        opt.asc_setBottom(panel.spnMarginBottom.getRawValue() == "-" ? undefined : Common.MetricSettings.fnRecalcToMM(panel.spnMarginBottom.getNumberValue()));
+        props.asc_setPageMargins(opt);
+        return props;
+    },
+    savePageOptions: function (panel, index) {
+        var opts = this.getPageOptions(panel);
+        if (index == -255) {
+            var wc = this.api.asc_getWorksheetsCount();
+            index = -1;
+            while (++index < wc) {
+                this.api.asc_setPageOptions(opts, index);
+            }
+            if (this.diffParams.orientation) {
+                this.diffParams.orientation = opts.asc_getPageSetup().asc_getOrientation() == undefined;
+            }
+            if (this.diffParams.size) {
+                this.diffParams.size = (opts.asc_getPageSetup().asc_getWidth() == undefined || opts.asc_getPageSetup().asc_getHeight() == undefined);
+            }
+            if (this.diffParams.headings) {
+                this.diffParams.headings = opts.asc_getHeadings() == undefined;
+            }
+            if (this.diffParams.grid) {
+                this.diffParams.grid = opts.asc_getGridLines() == undefined;
+            }
+            if (this.diffParams.margintop) {
+                this.diffParams.margintop = opts.asc_getPageMargins().asc_getTop() == undefined;
+            }
+            if (this.diffParams.marginright) {
+                this.diffParams.marginright = opts.asc_getPageMargins().asc_getRight() == undefined;
+            }
+            if (this.diffParams.marginbottom) {
+                this.diffParams.marginbottom = opts.asc_getPageMargins().asc_getBottom() == undefined;
+            }
+            if (this.diffParams.marginleft) {
+                this.diffParams.marginleft = opts.asc_getPageMargins().asc_getLeft() == undefined;
+            }
+        } else {
+            this.api.asc_setPageOptions(opts, index);
+            this.diffParams = {};
+        }
+    },
+    openPrintSettings: function () {
+        if (this.api) {
+            var win = Ext.widget("sseprintsettings", {});
+            this.fillPageOptions(win, this.api.asc_getPageOptions());
+            this.fillPrintOptions(win, this.adjPrintParams);
+            win.updateMetricUnit();
+            win.show();
+        }
+    },
+    closePrintSettings: function (obj, mr) {
+        if (mr == 1) {
+            this.savePageOptions(obj, obj.groupRange.getValue().printrange == c_oAscPrintType.EntireWorkbook ? -255 : undefined);
+            this.adjPrintParams.asc_setPrintType(obj.groupRange.getValue().printrange);
+            this.adjPrintParams.asc_setLayoutPageType(obj.groupLayout.getValue().printlayout);
+            this.api.asc_Print(this.adjPrintParams);
+            this.isUpdatedSettings = false;
+        }
+        this.getToolbar().fireEvent("editcomplete", this.getToolbar());
+    },
+    querySavePrintSettings: function () {
+        var panel = this.getPrintAdvanced();
+        if (this.checkMargins(panel)) {
+            this.savePageOptions(panel, panel.cmbSheet.getValue());
+            panel.up("ssedocumentsettings").fireEvent("savedocsettings", panel);
+        }
+    },
+    queryClosePrintSettings: function (btn) {
+        var panel = btn.up("window");
+        if (this.checkMargins(panel)) {
+            panel.fireEvent("onmodalresult", panel, 1);
+            panel.close();
+        }
+    },
+    checkMargins: function (panel) {
+        if (panel.cmbPaperOrientation.getValue() == c_oAscPageOrientation.PagePortrait) {
+            var pagewidth = /^\d{3}\.?\d*/.exec(panel.cmbPaperSize.getValue());
+            var pageheight = /\d{3}\.?\d*$/.exec(panel.cmbPaperSize.getValue());
+        } else {
+            pageheight = /^\d{3}\.?\d*/.exec(panel.cmbPaperSize.getValue());
+            pagewidth = /\d{3}\.?\d*$/.exec(panel.cmbPaperSize.getValue());
+        }
+        var ml = Common.MetricSettings.fnRecalcToMM(panel.spnMarginLeft.getNumberValue());
+        var mr = Common.MetricSettings.fnRecalcToMM(panel.spnMarginRight.getNumberValue());
+        var mt = Common.MetricSettings.fnRecalcToMM(panel.spnMarginTop.getNumberValue());
+        var mb = Common.MetricSettings.fnRecalcToMM(panel.spnMarginBottom.getNumberValue());
+        var result = false;
+        if (ml > pagewidth) {
+            result = "left";
+        } else {
+            if (mr > pagewidth - ml) {
+                result = "right";
+            } else {
+                if (mt > pageheight) {
+                    result = "top";
+                } else {
+                    if (mb > pageheight - mt) {
+                        result = "bottom";
+                    }
+                }
+            }
+        }
+        if (result) {
+            Ext.Msg.show({
+                title: this.textWarning,
+                msg: this.warnCheckMargings,
+                icon: Ext.Msg.WARNING,
+                buttons: Ext.Msg.OK,
+                fn: function (btn, text) {
+                    switch (result) {
+                    case "left":
+                        panel.spnMarginLeft.focus();
+                        return;
+                    case "right":
+                        panel.spnMarginRight.focus();
+                        return;
+                    case "top":
+                        panel.spnMarginTop.focus();
+                        return;
+                    case "bottom":
+                        panel.spnMarginBottom.focus();
+                        return;
+                    }
+                }
+            });
+            return false;
+        }
+        return true;
+    },
+    warnCheckMargings: "Margins are incorrect",
+    strAllSheets: "All Sheets",
+    textWarning: "Warning"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/controller/RecentFiles.js

@@ -0,0 +1,64 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.controller.RecentFiles", {
+    extend: "Ext.app.Controller",
+    views: ["RecentFiles"],
+    stores: ["RecentFiles"],
+    refs: [{
+        ref: "filePanel",
+        selector: "ssefile"
+    }],
+    init: function () {
+        this.control({
+            "sserecentfiles dataview": {
+                itemclick: this.onRecentFileClick
+            }
+        });
+    },
+    loadConfig: function (data) {
+        var recent = this.getRecentFilesStore();
+        if (recent && data && data.config && data.config.recent) {
+            recent.removeAll();
+            recent.add(data.config.recent);
+        }
+    },
+    onRecentFileClick: function (view, record, item, index, e) {
+        var filePanel = this.getFilePanel();
+        if (filePanel) {
+            filePanel.closeMenu();
+        }
+        var recentDocPage = window.open(record.data.url);
+        if (recentDocPage) {
+            recentDocPage.focus();
+        }
+    }
+});

OfficeWeb/apps/spreadsheeteditor/main/app/controller/Search.js

@@ -0,0 +1,193 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.controller.Search", {
+    extend: "Ext.app.Controller",
+    refs: [{
+        ref: "searchDialog",
+        selector: "commonsearchdialog"
+    },
+    {
+        ref: "searchQuery",
+        selector: "#search-dialog-text-search"
+    },
+    {
+        ref: "replaceQuery",
+        selector: "#search-dialog-text-replace"
+    }],
+    init: function () {
+        var me = this;
+        this.control({
+            "commonsearchdialog": {
+                show: function () {
+                    me.api.asc_closeCellEditor();
+                    me.setDefaultView();
+                }
+            },
+            "commonsearchdialog  button[group=search-text]": {
+                click: function (btn) {
+                    this._startSearch(btn.direction);
+                }
+            },
+            "commonsearchdialog  button[group=replace-text]": {
+                click: this.btnReplaceText
+            },
+            "#search-dialog-text-search": {
+                searchstart: function (obj, text) {
+                    this._startSearch("next");
+                    obj.stopSearch(true);
+                }
+            },
+            "ssemainmenu #main-menu-search": {
+                toggle: this.showSearchDialog
+            }
+        });
+    },
+    setMode: function (mode) {
+        this.mode = mode;
+        this._frmSearch && this._frmSearch.setViewMode(!this.mode.isEdit);
+    },
+    setApi: function (o) {
+        this.api = o;
+        this.api.asc_registerCallback("asc_onRenameCellTextEnd", Ext.bind(this._onRenameText, this));
+        this.api.asc_registerCallback("asc_onСoAuthoringDisconnect", Ext.bind(this.onCoAuthoringDisconnect, this));
+    },
+    setDefaultView: function () {
+        this.getSearchDialog().searchMode();
+    },
+    showWarning: function (text) {
+        var me = this;
+        if (!this.msgbox) {
+            this.msgbox = Ext.create("Ext.window.MessageBox", {
+                listeners: {
+                    beforehide: function () {
+                        me.getSearchQuery().focus(true, 100);
+                    }
+                }
+            });
+        }
+        var config = {
+            title: this.textSearch,
+            msg: text,
+            icon: Ext.Msg.INFO,
+            buttons: Ext.Msg.OK
+        };
+        if (Common.userAgent.isIE) {
+            var oldFn = {
+                enter: Ext.FocusManager.navigateIn,
+                esc: Ext.FocusManager.navigateOut
+            };
+            Ext.FocusManager.navigateIn = Ext.emptyFn;
+            Ext.FocusManager.navigateOut = function (event) {
+                me.msgbox.close();
+            };
+            config.fn = function (btn) {
+                Ext.FocusManager.navigateIn = oldFn.enter;
+                Ext.FocusManager.navigateOut = oldFn.esc;
+            };
+        }
+        this.msgbox.show(config);
+    },
+    btnReplaceText: function (btn, event, opts) {
+        var me = this;
+        if (me.getSearchQuery().isValueValid()) {
+            var sett = this.getSearchDialog().getSettings();
+            this.api.isReplaceAll = (btn.type == "all");
+            this.api.asc_replaceText(sett.textsearch, sett.textreplace, btn.type == "all", sett.casesensitive, sett.wholewords);
+        }
+    },
+    _startSearch: function (direction) {
+        if (this.api && this.getSearchQuery().isValueValid()) {
+            var sett = this.getSearchDialog().getSettings();
+            if (!this.api.asc_findText(sett.textsearch, true, direction == "next", sett.casesensitive, sett.wholewords)) {
+                this.showWarning(this.textNoTextFound);
+            }
+        }
+    },
+    _onRenameText: function (found, replaced) {
+        var me = this;
+        if (this.api.isReplaceAll) {
+            if (found) {
+                if (! (found - replaced)) {
+                    me.showWarning(Ext.String.format(this.textReplaceSuccess, replaced));
+                } else {
+                    me.showWarning(Ext.String.format(this.textReplaceSkipped, found - replaced));
+                }
+            } else {
+                me.showWarning(me.textNoTextFound);
+            }
+        } else {
+            var sett = this.getSearchDialog().getSettings();
+            if (!me.api.asc_findText(sett.textsearch, true, true, sett.casesensitive, sett.wholewords)) {
+                me.showWarning(me.textNoTextFound);
+            }
+        }
+    },
+    showSearchDialog: function (btn, pressed) {
+        if (pressed) {
+            var mainmenu = btn.up("#view-main-menu");
+            mainmenu.closeFullScaleMenu();
+            var me = this;
+            if (!me._frmSearch) {
+                me._frmSearch = Ext.create("Common.view.SearchDialog", {
+                    animateTarget: "main-menu-search",
+                    closeAction: "hide",
+                    isViewMode: !me.mode.isEdit,
+                    highlight: false,
+                    listeners: {
+                        hide: function (cnt, eOpts) {
+                            if (!btn.ownrise) {
+                                btn.ownrise = true;
+                                btn.toggle(false, true);
+                                mainmenu.fireEvent("editcomplete", mainmenu);
+                            }
+                            btn.ownrise = false;
+                        }
+                    }
+                });
+            }
+            me._frmSearch.show();
+        } else {
+            if (this._frmSearch && !btn.ownrise) {
+                btn.ownrise = true;
+                this._frmSearch.hide();
+            }
+        }
+    },
+    onCoAuthoringDisconnect: function () {
+        this.mode.isEdit = false;
+        this._frmSearch && this._frmSearch.setViewMode(true);
+    },
+    textSearch: "Search",
+    textNoTextFound: "Text not found",
+    textReplaceSuccess: "Search has been done. {0} occurrences have been replaced",
+    textReplaceSkipped: "The replacement has been made. {0} occurrences were skipped."
+});

OfficeWeb/apps/spreadsheeteditor/main/app/model/FileTemplate.js

@@ -0,0 +1,46 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.model.FileTemplate", {
+    extend: "Ext.data.Model",
+    fields: [{
+        type: "string",
+        name: "name"
+    },
+    {
+        type: "string",
+        name: "icon"
+    },
+    {
+        type: "string",
+        name: "displayName"
+    }]
+});

OfficeWeb/apps/spreadsheeteditor/main/app/model/Formula.js

@@ -0,0 +1,43 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.model.Formula", {
+    extend: "Ext.data.Model",
+    fields: [{
+        name: "group"
+    },
+    {
+        name: "func"
+    },
+    {
+        name: "args"
+    }]
+});

OfficeWeb/apps/spreadsheeteditor/main/app/model/RecentFile.js

@@ -0,0 +1,46 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.model.RecentFile", {
+    extend: "Ext.data.Model",
+    fields: [{
+        type: "string",
+        name: "title"
+    },
+    {
+        type: "string",
+        name: "url"
+    },
+    {
+        type: "string",
+        name: "folder"
+    }]
+});

OfficeWeb/apps/spreadsheeteditor/main/app/model/ShapeGroup.js

@@ -0,0 +1,52 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.model.ShapeModel", {
+    extend: "Ext.data.Model",
+    fields: [{
+        name: "imageUrl"
+    },
+    {
+        name: "data"
+    }]
+});
+Ext.define("SSE.model.ShapeGroup", {
+    extend: "Ext.data.Model",
+    fields: [{
+        name: "groupName"
+    },
+    {
+        name: "groupId"
+    },
+    {
+        name: "groupStore"
+    }]
+});

OfficeWeb/apps/spreadsheeteditor/main/app/model/TableTemplate.js

@@ -0,0 +1,35 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.model.TableTemplate", {
+    extend: "Ext.data.Model",
+    fields: ["type", "name", "imageUrl"]
+});

OfficeWeb/apps/spreadsheeteditor/main/app/plugin/TabBarScroller.js

@@ -0,0 +1,133 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.plugin.TabBarScroller", {
+    alias: "plugin.tabbarscroller",
+    constructor: function (config) {
+        config = config || {};
+        Ext.apply(this, config);
+    },
+    init: function (tabBar) {
+        var me = this;
+        Ext.apply(tabBar, me.parentOverrides);
+        me.tabBar = tabBar;
+        tabBar.on({
+            render: function () {
+                me.layout = me.tabBar.layout;
+                if (me.lastButton) {
+                    me.lastButton.on("click", me.scrollToLast, me);
+                }
+                if (me.firstButton) {
+                    me.firstButton.on("click", me.scrollToFirst, me);
+                }
+                if (me.prevButton) {
+                    me.beforeRepeater = Ext.create("Ext.util.ClickRepeater", me.prevButton.getEl(), {
+                        interval: me.layout.overflowHandler.scrollRepeatInterval,
+                        handler: me.layout.overflowHandler.scrollLeft,
+                        scope: me.layout.overflowHandler
+                    });
+                }
+                if (me.nextButton) {
+                    me.afterRepeater = Ext.create("Ext.util.ClickRepeater", me.nextButton.getEl(), {
+                        interval: me.layout.overflowHandler.scrollRepeatInterval,
+                        handler: me.layout.overflowHandler.scrollRight,
+                        scope: me.layout.overflowHandler
+                    });
+                }
+                me.tabBar.addCls("asc-page-scroller");
+                me.layout.overflowHandler.updateScrollButtons = Ext.Function.createSequence(me.layout.overflowHandler.updateScrollButtons, me.updateButtons, me);
+                me.layout.overflowHandler.handleOverflow = Ext.Function.createSequence(me.layout.overflowHandler.handleOverflow, me.updateButtons, me);
+                me.layout.overflowHandler.clearOverflow = Ext.Function.createSequence(me.layout.overflowHandler.clearOverflow, me.disableButtons, me);
+            },
+            single: true
+        });
+    },
+    disableButtons: function () {
+        var me = this;
+        if (me.lastButton) {
+            me.lastButton.addClsWithUI("disabled");
+            me.lastButton.addCls("x-item-disabled");
+            me.lastButton.disabled = true;
+        }
+        if (me.firstButton) {
+            me.firstButton.addClsWithUI("disabled");
+            me.firstButton.addCls("x-item-disabled");
+            me.firstButton.disabled = true;
+        }
+        if (me.prevButton) {
+            me.prevButton.addClsWithUI("disabled");
+            me.prevButton.addCls("x-item-disabled");
+            me.prevButton.disabled = true;
+        }
+        if (me.nextButton) {
+            me.nextButton.addClsWithUI("disabled");
+            me.nextButton.addCls("x-item-disabled");
+            me.nextButton.disabled = true;
+        }
+    },
+    scrollToFirst: function (e) {
+        var me = this;
+        me.layout.overflowHandler.scrollTo(0);
+    },
+    scrollToLast: function (e) {
+        var me = this;
+        me.layout.overflowHandler.scrollTo(me.layout.overflowHandler.getMaxScrollPosition());
+    },
+    updateButtons: function () {
+        var me = this;
+        var beforeMethAll = me.layout.overflowHandler.atExtremeBefore() ? "addClsWithUI" : "removeClsWithUI",
+        afterMethAll = me.layout.overflowHandler.atExtremeAfter() ? "addClsWithUI" : "removeClsWithUI",
+        beforeMeth = me.layout.overflowHandler.atExtremeBefore() ? "addCls" : "removeCls",
+        afterMeth = me.layout.overflowHandler.atExtremeAfter() ? "addCls" : "removeCls",
+        beforeDisabled = (beforeMeth == "addCls"),
+        afterDisabled = (afterMeth == "addCls");
+        if (me.lastButton) {
+            me.lastButton[afterMethAll]("disabled");
+            me.lastButton[afterMeth]("x-item-disabled");
+            me.lastButton.disabled = afterDisabled;
+        }
+        if (me.nextButton) {
+            me.nextButton[afterMethAll]("disabled");
+            me.nextButton[afterMeth]("x-item-disabled");
+            me.nextButton.disabled = afterDisabled;
+        }
+        if (me.firstButton) {
+            me.firstButton[beforeMethAll]("disabled");
+            me.firstButton[beforeMeth]("x-item-disabled");
+            me.firstButton.disabled = beforeDisabled;
+        }
+        if (me.prevButton) {
+            me.prevButton[beforeMethAll]("disabled");
+            me.prevButton[beforeMeth]("x-item-disabled");
+            me.prevButton.disabled = beforeDisabled;
+        }
+    }
+});

OfficeWeb/apps/spreadsheeteditor/main/app/plugin/TabReorderer.js

@@ -0,0 +1,52 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.plugin.TabReorderer", {
+    extend: "SSE.ux.BoxReorderer",
+    alias: "plugin.tabreorderer",
+    itemSelector: ".x-tab",
+    config: {
+        disabled: false
+    },
+    init: function (tabPanel) {
+        this.callParent(arguments);
+    },
+    clickValidator: function (e) {
+        return this.getDisabled() ? false : this.callParent(arguments);
+    },
+    afterBoxReflow: function () {
+        var me = this;
+        SSE.ux.BoxReorderer.prototype.afterBoxReflow.apply(me, arguments);
+        if (me.dragCmp) {
+            me.container.setActiveTab(me.dragCmp);
+        }
+    }
+});

OfficeWeb/apps/spreadsheeteditor/main/app/store/FileTemplates.js

@@ -0,0 +1,35 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.store.FileTemplates", {
+    extend: "Ext.data.Store",
+    model: "SSE.model.FileTemplate"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/store/FormulaGroups.js

@@ -0,0 +1,37 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.store.FormulaGroups", {
+    extend: "Ext.data.ArrayStore",
+    storeId: "groupStore",
+    idIndex: 0,
+    fields: ["groupname", "groupid"]
+});

OfficeWeb/apps/spreadsheeteditor/main/app/store/Formulas.js

@@ -0,0 +1,36 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.store.Formulas", {
+    extend: "Ext.data.Store",
+    model: "SSE.model.Formula",
+    sorters: ["func"]
+});

OfficeWeb/apps/spreadsheeteditor/main/app/store/RecentFiles.js

@@ -0,0 +1,35 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.store.RecentFiles", {
+    extend: "Ext.data.Store",
+    model: "SSE.model.RecentFile"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/store/ShapeGroups.js

@@ -0,0 +1,35 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.store.ShapeGroups", {
+    extend: "Ext.data.Store",
+    model: "SSE.model.ShapeGroup"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/store/TableTemplates.js

@@ -0,0 +1,35 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.store.TableTemplates", {
+    extend: "Ext.data.Store",
+    model: "SSE.model.TableTemplate"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/ux/BoxReorderer.js

@@ -0,0 +1,234 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.ux.BoxReorderer", {
+    mixins: {
+        observable: "Ext.util.Observable"
+    },
+    itemSelector: ".x-box-item",
+    animate: 100,
+    constructor: function () {
+        this.addEvents("startdrag", "drag", "changeindex", "drop");
+        this.mixins.observable.constructor.apply(this, arguments);
+    },
+    init: function (container) {
+        this.container = container;
+        this.container.afterLayout = Ext.Function.createSequence(this.container.afterLayout, this.afterFirstLayout, this);
+        container.destroy = Ext.Function.createSequence(container.destroy, this.onContainerDestroy, this);
+    },
+    onContainerDestroy: function () {
+        if (this.dd) {
+            this.dd.unreg();
+        }
+    },
+    afterFirstLayout: function () {
+        var me = this,
+        l = me.container.getLayout();
+        delete me.container.afterLayout;
+        me.dd = Ext.create("Ext.dd.DD", l.innerCt, me.container.id + "-reorderer");
+        Ext.apply(me.dd, {
+            animate: me.animate,
+            reorderer: me,
+            container: me.container,
+            getDragCmp: this.getDragCmp,
+            clickValidator: Ext.Function.createInterceptor(me.dd.clickValidator, me.clickValidator, me, false),
+            onMouseDown: me.onMouseDown,
+            startDrag: me.startDrag,
+            onDrag: me.onDrag,
+            endDrag: me.endDrag,
+            getNewIndex: me.getNewIndex,
+            doSwap: me.doSwap,
+            findReorderable: me.findReorderable
+        });
+        me.dd.dim = l.parallelPrefix;
+        me.dd.startAttr = l.parallelBefore;
+        me.dd.endAttr = l.parallelAfter;
+    },
+    getDragCmp: function (e) {
+        return this.container.getChildByElement(e.getTarget(this.itemSelector, 10));
+    },
+    clickValidator: function (e) {
+        var cmp = this.getDragCmp(e);
+        return !! (cmp && cmp.reorderable !== false);
+    },
+    onMouseDown: function (e) {
+        var me = this,
+        container = me.container,
+        containerBox, cmpEl, cmpBox;
+        me.dragCmp = me.getDragCmp(e);
+        if (me.dragCmp) {
+            cmpEl = me.dragCmp.getEl();
+            me.startIndex = me.curIndex = container.items.indexOf(me.dragCmp);
+            cmpBox = cmpEl.getPageBox();
+            me.lastPos = cmpBox[this.startAttr];
+            containerBox = container.el.getPageBox();
+            if (me.dim === "width") {
+                me.minX = containerBox.left;
+                me.maxX = containerBox.right - cmpBox.width;
+                me.minY = me.maxY = cmpBox.top;
+                me.deltaX = e.getPageX() - cmpBox.left;
+            } else {
+                me.minY = containerBox.top;
+                me.maxY = containerBox.bottom - cmpBox.height;
+                me.minX = me.maxX = cmpBox.left;
+                me.deltaY = e.getPageY() - cmpBox.top;
+            }
+            me.constrainY = me.constrainX = true;
+        }
+    },
+    startDrag: function () {
+        var me = this;
+        if (me.dragCmp) {
+            me.dragCmp.setPosition = Ext.emptyFn;
+            if (!me.container.layout.animate && me.animate) {
+                me.container.layout.animate = me.animate;
+                me.removeAnimate = true;
+            }
+            me.dragElId = me.dragCmp.getEl().id;
+            me.reorderer.fireEvent("StartDrag", me, me.container, me.dragCmp, me.curIndex);
+            me.dragCmp.suspendEvents();
+            me.dragCmp.disabled = true;
+            me.dragCmp.el.setStyle("zIndex", 100);
+        } else {
+            me.dragElId = null;
+        }
+    },
+    findReorderable: function (newIndex) {
+        var me = this,
+        items = me.container.items,
+        newItem;
+        if (items.getAt(newIndex).reorderable === false) {
+            newItem = items.getAt(newIndex);
+            if (newIndex > me.startIndex) {
+                while (newItem && newItem.reorderable === false) {
+                    newIndex++;
+                    newItem = items.getAt(newIndex);
+                }
+            } else {
+                while (newItem && newItem.reorderable === false) {
+                    newIndex--;
+                    newItem = items.getAt(newIndex);
+                }
+            }
+        }
+        newIndex = Math.min(Math.max(newIndex, 0), items.getCount() - 1);
+        if (items.getAt(newIndex).reorderable === false) {
+            return -1;
+        }
+        return newIndex;
+    },
+    doSwap: function (newIndex) {
+        var me = this,
+        items = me.container.items,
+        orig, dest, tmpIndex;
+        newIndex = me.findReorderable(newIndex);
+        if (newIndex === -1) {
+            return;
+        }
+        me.reorderer.fireEvent("ChangeIndex", me, me.container, me.dragCmp, me.startIndex, newIndex);
+        orig = items.getAt(me.curIndex);
+        dest = items.getAt(newIndex);
+        items.remove(orig);
+        tmpIndex = Math.min(Math.max(newIndex, 0), items.getCount() - 1);
+        items.insert(tmpIndex, orig);
+        items.remove(dest);
+        items.insert(me.curIndex, dest);
+        me.container.layout.layout();
+        me.curIndex = newIndex;
+    },
+    onDrag: function (e) {
+        var me = this,
+        newIndex;
+        newIndex = me.getNewIndex(e.getPoint());
+        if ((newIndex !== undefined)) {
+            me.reorderer.fireEvent("Drag", me, me.container, me.dragCmp, me.startIndex, me.curIndex);
+            me.doSwap(newIndex);
+        }
+    },
+    endDrag: function (e) {
+        e.stopEvent();
+        var me = this;
+        if (me.dragCmp) {
+            delete me.dragElId;
+            if (me.animate) {
+                me.container.layout.animate = {
+                    callback: Ext.Function.bind(me.reorderer.afterBoxReflow, me)
+                };
+            }
+            delete me.dragCmp.setPosition;
+            me.container.layout.layout();
+            if (me.removeAnimate) {
+                delete me.removeAnimate;
+                delete me.container.layout.animate;
+            } else {
+                me.reorderer.afterBoxReflow.call(me);
+            }
+            me.reorderer.fireEvent("drop", me, me.container, me.dragCmp, me.startIndex, me.curIndex);
+        }
+    },
+    afterBoxReflow: function () {
+        var me = this;
+        me.dragCmp.el.setStyle("zIndex", "");
+        me.dragCmp.disabled = false;
+        me.dragCmp.resumeEvents();
+    },
+    getNewIndex: function (pointerPos) {
+        var me = this,
+        dragEl = me.getDragEl(),
+        dragBox = Ext.fly(dragEl).getPageBox(),
+        targetEl,
+        targetBox,
+        targetMidpoint,
+        i = 0,
+        it = me.container.items.items,
+        ln = it.length,
+        lastPos = me.lastPos;
+        me.lastPos = dragBox[me.startAttr];
+        for (; i < ln; i++) {
+            targetEl = it[i].getEl();
+            if (targetEl.is(me.reorderer.itemSelector)) {
+                targetBox = targetEl.getPageBox();
+                targetMidpoint = targetBox[me.startAttr] + (targetBox[me.dim] >> 1);
+                if (i < me.curIndex) {
+                    if ((dragBox[me.startAttr] < lastPos) && (dragBox[me.startAttr] < (targetMidpoint - 5))) {
+                        return i;
+                    }
+                } else {
+                    if (i > me.curIndex) {
+                        if ((dragBox[me.startAttr] > lastPos) && (dragBox[me.endAttr] > (targetMidpoint + 5))) {
+                            return i;
+                        }
+                    }
+                }
+            }
+        }
+    }
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/AutoFilterDialog.js

@@ -0,0 +1,331 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.AutoFilterDialog", {
+    extend: "Ext.window.Window",
+    alias: "widget.sseautofilterdialog",
+    requires: ["Ext.window.Window", "Common.plugin.GridScrollPane", "Common.component.SearchField"],
+    modal: true,
+    closable: true,
+    resizable: false,
+    height: 350,
+    width: 270,
+    constrain: true,
+    padding: "20px 20px 0 20px",
+    layout: {
+        type: "vbox",
+        align: "stretch"
+    },
+    initComponent: function () {
+        var me = this;
+        this.addEvents("onmodalresult");
+        this.btnSortDesc = Ext.create("Ext.Button", {
+            iconCls: "asc-toolbar-btn btn-sort-up",
+            width: 28,
+            enableToggle: true,
+            toggleGroup: "autoFilterSort",
+            allowDepress: false,
+            listeners: {
+                click: function () {
+                    me.fireEvent("onmodalresult", me, 3, "descending");
+                    me.close();
+                }
+            }
+        });
+        this.btnSortAsc = Ext.create("Ext.Button", {
+            iconCls: "asc-toolbar-btn btn-sort-down",
+            width: 28,
+            enableToggle: true,
+            style: "margin: 0 6px 0 0",
+            toggleGroup: "autoFilterSort",
+            allowDepress: false,
+            listeners: {
+                click: function () {
+                    me.fireEvent("onmodalresult", me, 3, "ascending");
+                    me.close();
+                }
+            }
+        });
+        this.chCustomFilter = Ext.widget("checkbox", {
+            style: "margin: 0 6px 0 0",
+            disabled: true,
+            boxLabel: ""
+        });
+        var btnCustomFilter = Ext.create("Ext.Button", {
+            width: 120,
+            text: me.btnCustomFilter,
+            listeners: {
+                click: function () {
+                    me.fireEvent("onmodalresult", me, 2);
+                    me.close();
+                }
+            }
+        });
+        var range, full_range;
+        var txtSearch = Ext.create("Common.component.SearchField", {
+            style: "margin: 10px 0",
+            emptyText: me.txtEmpty,
+            listeners: {
+                change: function (obj, newval, oldval, opts) {
+                    me.cellsStore.clearFilter(true);
+                    if (oldval && newval.length < oldval.length) {
+                        selectionModel.selected.clear();
+                        full_range = me.cellsStore.getAt(0).ischecked;
+                        range = me.cellsStore.getRange(full_range ? 0 : 1);
+                        range.forEach(function (record) {
+                            (full_range || record.ischecked) && selectionModel.selected.add(record);
+                        });
+                    }
+                    if (newval.length) {
+                        me.cellsStore.filter([{
+                            property: "cellvalue",
+                            value: new RegExp(newval, "i")
+                        },
+                        {
+                            property: "rowvisible",
+                            value: /^((?!ever|hidden).)*$/
+                        }]);
+                    } else {
+                        me.cellsStore.filter("rowvisible", /^((?!hidden).)*$/);
+                    }
+                },
+                searchstart: function (obj, text) {
+                    me.cellsStore.filter([{
+                        property: "cellvalue",
+                        value: new RegExp(text, "i")
+                    },
+                    {
+                        property: "rowvisible",
+                        value: /^((?!ever|hidden).)*$/
+                    }]);
+                    this.stopSearch(true);
+                },
+                searchclear: function () {}
+            }
+        });
+        this.cellsStore = Ext.create("Ext.data.Store", {
+            fields: ["cellvalue", "rowvisible", "groupid", "intval", "strval"]
+        });
+        var selectionModel = Ext.create("Ext.selection.CheckboxModel", {
+            mode: "SIMPLE",
+            listeners: {
+                deselect: function (obj, record, index) {
+                    me.chCustomFilter.getValue() && me.chCustomFilter.setValue(false);
+                    record.ischecked = false;
+                    if (record.data.rowvisible == "ever") {
+                        obj.deselectAll();
+                        me.cellsStore.getRange(1).forEach(function (rec) {
+                            rec.ischecked = false;
+                        });
+                    } else {
+                        var srecord = me.cellList.getStore().getAt(0);
+                        if (srecord.data.rowvisible == "ever" && obj.isSelected(srecord)) {
+                            srecord.ischecked = false;
+                            obj.deselect(srecord, true);
+                        }
+                    }
+                },
+                select: function (obj, record, index) {
+                    me.chCustomFilter.getValue() && me.chCustomFilter.setValue(false);
+                    record.ischecked = true;
+                    if (record.data.rowvisible == "ever") {
+                        obj.select(me.cellList.getStore().getRange(1), false, true);
+                        obj.select(me.cellList.getStore().getAt(0), true, true);
+                        me.cellsStore.getRange(1).forEach(function (rec) {
+                            rec.ischecked = true;
+                        });
+                    }
+                }
+            }
+        });
+        this.cellList = Ext.create("Ext.grid.Panel", {
+            activeItem: 0,
+            selModel: selectionModel,
+            store: this.cellsStore,
+            stateful: true,
+            stateId: "stateGrid",
+            scroll: false,
+            columns: [{
+                flex: 1,
+                sortable: false,
+                dataIndex: "cellvalue"
+            }],
+            height: 160,
+            hideHeaders: true,
+            style: "margin: 0 0 14px 0",
+            viewConfig: {
+                stripeRows: false
+            },
+            plugins: [{
+                ptype: "gridscrollpane"
+            }]
+        });
+        var btnOk = Ext.create("Ext.Button", {
+            text: Ext.Msg.buttonText.ok,
+            width: 80,
+            cls: "asc-blue-button",
+            listeners: {
+                click: function () {
+                    if (!selectionModel.getCount()) {
+                        Ext.Msg.show({
+                            title: me.textWarning,
+                            msg: me.warnNoSelected,
+                            icon: Ext.Msg.WARNING,
+                            buttons: Ext.Msg.OK
+                        });
+                    } else {
+                        me.fireEvent("onmodalresult", me, me.chCustomFilter.getValue() ? 0 : 1);
+                        me.close();
+                    }
+                }
+            }
+        });
+        var btnCancel = Ext.create("Ext.Button", {
+            text: me.cancelButtonText,
+            width: 80,
+            listeners: {
+                click: function () {
+                    me.fireEvent("onmodalresult", me, 0);
+                    me.close();
+                }
+            }
+        });
+        this.items = [{
+            xtype: "container",
+            height: 30,
+            layout: {
+                type: "hbox"
+            },
+            items: [this.btnSortAsc, this.btnSortDesc, {
+                xtype: "tbspacer",
+                flex: 1
+            },
+            this.chCustomFilter, btnCustomFilter]
+        },
+        txtSearch, this.cellList, {
+            xtype: "container",
+            width: 250,
+            layout: "hbox",
+            layoutConfig: {
+                align: "stretch"
+            },
+            items: [{
+                xtype: "tbspacer",
+                flex: 1
+            },
+            btnOk, {
+                xtype: "tbspacer",
+                width: 5
+            },
+            btnCancel]
+        }];
+        this.callParent(arguments);
+        this.setTitle(this.txtTitle);
+    },
+    afterRender: function () {
+        this.callParent(arguments);
+        this._setDefaults();
+    },
+    setSettings: function (config) {
+        var arr = [{
+            cellvalue: this.textSelectAll,
+            rowvisible: "ever",
+            groupid: "0"
+        }];
+        var isnumber, value;
+        config.asc_getResult().forEach(function (item) {
+            value = item.asc_getVal();
+            isnumber = Ext.isNumeric(value);
+            arr.push({
+                cellvalue: value,
+                rowvisible: item.asc_getVisible(),
+                groupid: "1",
+                intval: isnumber ? parseFloat(value) : undefined,
+                strval: !isnumber ? value : ""
+            });
+        });
+        this.cellsStore.loadData(arr);
+        this.cellsStore.group("groupid");
+        this._defaults = [];
+        this._defaults.properties = config;
+    },
+    getSettings: function () {
+        var ret_out = new Asc.AutoFiltersOptions();
+        ret_out.asc_setCellId(this._defaults.properties.asc_getCellId());
+        var result_arr = [],
+        visibility,
+        me = this;
+        this.cellsStore.clearFilter(true);
+        var records = this.cellsStore.getRange(1);
+        records.forEach(function (item) {
+            if ((visibility = item.get("rowvisible")) != "hidden") {
+                visibility = me.cellList.getSelectionModel().isSelected(item);
+            }
+            result_arr.push(new Asc.AutoFiltersOptionsElements(item.get("cellvalue"), visibility));
+        });
+        ret_out.asc_setResult(result_arr);
+        ret_out.sortState = this._defaults.properties.asc_getSortState();
+        return ret_out;
+    },
+    _setDefaults: function () {
+        var sort = this._defaults.properties.asc_getSortState();
+        if (sort) {
+            this[sort == "ascending" ? "btnSortAsc" : "btnSortDesc"].toggle(true, true);
+        }
+        var store = this.cellList.getStore(),
+        selectionModel = this.cellList.getSelectionModel();
+        store.filter("rowvisible", /^((?!hidden).)*$/);
+        var count = store.getCount(),
+        item,
+        isSelectAll = true;
+        while (count > 1) {
+            item = store.getAt(--count);
+            if (item.data.rowvisible === true) {
+                selectionModel.select(item, true, true);
+                item.ischecked = true;
+            } else {
+                isSelectAll = false;
+            }
+        }
+        if (isSelectAll) {
+            store.getAt(0).ischecked = true;
+            selectionModel.select(0, true, true);
+        }
+        this.chCustomFilter.setValue(this._defaults.properties.asc_getIsCustomFilter() === true);
+    },
+    btnCustomFilter: "Custom Filter",
+    textSelectAll: "Select All",
+    txtTitle: "Filter",
+    warnNoSelected: "You must choose at least one value",
+    textWarning: "Warning",
+    cancelButtonText: "Cancel",
+    txtEmpty: "Enter cell's filter"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/CellInfo.js

@@ -0,0 +1,141 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.CellInfo", {
+    extend: "Ext.container.Container",
+    alias: "widget.ssecellinfo",
+    cls: "sse-cellinfo",
+    uses: ["SSE.view.FormulaDialog"],
+    height: 23,
+    initComponent: function () {
+        var me = this;
+        this.addEvents("editcomplete");
+        this.txtName = Ext.widget("textfield", {
+            id: "infobox-cell-name",
+            width: 70,
+            height: this.height,
+            cls: "asc-input-aslabel",
+            fieldStyle: "border-radius:0;"
+        });
+        this._cellInput = Ext.widget("textarea", {
+            id: "infobox-cell-edit",
+            inputId: "infobox-cell-input",
+            flex: 1,
+            style: "margin:0;opacity:1;",
+            fieldStyle: "border-radius:0;font-size:14px;padding:0 3px;line-height:21px;",
+            enableKeyEvents: true,
+            enterIsSpecial: true
+        });
+        var style = "padding:4px 0 0 4px;border-bottom:solid 1px #AFAFAF; background:#E9E9E9 url(resources/img/toolbar-menu.png) no-repeat 0 -1416px;";
+        style += 'background-image: -webkit-image-set(url("resources/img/toolbar-menu.png") 1x, url("resources/img/toolbar-menu@2x.png") 2x);';
+        this._lblFunct = Ext.widget("box", {
+            width: 20,
+            height: this.height,
+            id: "func-label-box",
+            style: style,
+            listeners: {
+                afterrender: function (c) {
+                    $("#func-label-box").hover(function () {
+                        this.style.backgroundPosition = this.mdown ? "-40px -1416px" : "-20px -1416px";
+                    },
+                    function () {
+                        this.style.backgroundPosition = "0 -1416px";
+                    });
+                    $("#func-label-box").mousedown(function () {
+                        this.style.backgroundPosition = "-40px -1416px";
+                        var hdown = this;
+                        hdown.mdown = true;
+                        var upHandler = function () {
+                            hdown.mdown = false;
+                            $(document).unbind("mouseup", upHandler);
+                        };
+                        $(document).mouseup(upHandler);
+                    });
+                    $("#func-label-box").click(function (e) {
+                        if (me.permissions.isEdit) {
+                            dlgFormulas.addListener("onmodalresult", function (o, mr, s) {
+                                me.fireEvent("editcomplete", me);
+                            },
+                            me, {
+                                single: true
+                            });
+                            dlgFormulas.show();
+                        }
+                    });
+                }
+            }
+        });
+        this.keep_height = 180;
+        var btnExpand = Ext.widget("button", {
+            width: 16,
+            height: this.height,
+            id: "infobox-cell-multiline-button",
+            style: "border-radius: 0;",
+            iconCls: "infobox-cell-multiline-button"
+        });
+        Ext.apply(me, {
+            style: "overflow:visible;",
+            layout: {
+                type: "hbox",
+                align: "stretch"
+            },
+            items: [{
+                xtype: "container",
+                cls: "infobox-container-border",
+                id: "infobox-container-cell-name",
+                width: 90,
+                layout: {
+                    type: "hbox"
+                },
+                items: [this.txtName, this._lblFunct]
+            },
+            this._cellInput, {
+                xtype: "container",
+                items: [btnExpand]
+            }]
+        },
+        me.initialConfig);
+        me.callParent(arguments);
+    },
+    updateCellInfo: function (info) {
+        if (info) {
+            this.txtName.setValue(typeof(info) == "string" ? info : info.asc_getName());
+        }
+    },
+    setMode: function (m) {
+        if (m.isDisconnected) {
+            this.permissions.isEdit = false;
+        } else {
+            this.permissions = m;
+        }
+        $("#" + this._lblFunct.id).css("cursor", m.isEdit ? "pointer" : "default");
+    }
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/CreateFile.js

@@ -0,0 +1,87 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.CreateFile", {
+    extend: "Ext.panel.Panel",
+    alias: "widget.ssecreatenew",
+    cls: "sse-file-createnew",
+    layout: {
+        type: "vbox",
+        align: "stretch"
+    },
+    requires: ["Ext.container.Container", "Ext.data.Model", "Ext.data.Store", "Ext.view.View", "Ext.XTemplate", "Common.plugin.DataViewScrollPane"],
+    constructor: function (config) {
+        this.initConfig(config);
+        this.callParent(arguments);
+        return this;
+    },
+    initComponent: function () {
+        this.callParent(arguments);
+        var me = this;
+        me.add({
+            xtype: "container",
+            html: "<h3>" + me.fromBlankText + "</h3>" + "<hr noshade>" + '<div class="blank-document">' + '<div id="id-create-blank-document" class="btn-blank-document"></div>' + '<div class="blank-document-info">' + "<h3>" + me.newDocumentText + "</h3>" + me.newDescriptionText + "</div>" + "</div>" + '<div style="clear: both;"></div>' + "<h3>" + me.fromTemplateText + "</h3>" + "<hr noshade>"
+        },
+        {
+            xtype: "container",
+            flex: 1,
+            layout: "fit",
+            cls: "container-template-list",
+            items: [{
+                xtype: "dataview",
+                store: "FileTemplates",
+                tpl: Ext.create("Ext.XTemplate", '<tpl for=".">', '<div class="thumb-wrap">', '<tpl if="this.isEmptyIcon(icon)">', '<div class="thumb"></div>', "</tpl>", '<tpl if="this.isEmptyIcon(icon) == false">', '<div class="thumb" style="background-image: url(' + "'{icon}'" + ');"></div>', "</tpl>", '<div class="title">{name:htmlEncode}</div>', "</div>", "</tpl>", {
+                    isEmptyIcon: function (icon) {
+                        return icon == "";
+                    }
+                }),
+                singleSelect: true,
+                trackOver: true,
+                autoScroll: true,
+                overItemCls: "x-item-over",
+                itemSelector: "div.thumb-wrap",
+                cls: "x-view-context",
+                plugins: [{
+                    ptype: "dataviewscrollpane",
+                    pluginId: "scrollpane",
+                    areaSelector: ".x-view-context",
+                    settings: {
+                        enableKeyboardNavigation: true
+                    }
+                }]
+            }]
+        });
+    },
+    fromBlankText: "From Blank",
+    newDocumentText: "New Text Document",
+    newDescriptionText: "Create a new blank text document which you will be able to style and format after it is created during the editing. Or choose one of the templates to start a document of a certain type or purpose where some styles have already been pre-applied.",
+    fromTemplateText: "From Template"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/DigitalFilterDialog.js

@@ -0,0 +1,276 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.DigitalFilterDialog", {
+    extend: "Ext.window.Window",
+    alias: "widget.ssedigitalfilterdialog",
+    requires: ["Ext.window.Window"],
+    modal: true,
+    closable: true,
+    resizable: false,
+    height: 226,
+    width: 500,
+    constrain: true,
+    padding: "20px 20px 0 20px",
+    layout: {
+        type: "vbox",
+        align: "stretch"
+    },
+    initComponent: function () {
+        var me = this;
+        var storeCondition = Ext.create("Ext.data.Store", {
+            fields: ["condition", "caption"],
+            data: [{
+                condition: c_oAscCustomAutoFilter.equals,
+                caption: me.capCondition1
+            },
+            {
+                condition: c_oAscCustomAutoFilter.doesNotEqual,
+                caption: me.capCondition2
+            },
+            {
+                condition: c_oAscCustomAutoFilter.isGreaterThan,
+                caption: me.capCondition3
+            },
+            {
+                condition: c_oAscCustomAutoFilter.isGreaterThanOrEqualTo,
+                caption: me.capCondition4
+            },
+            {
+                condition: c_oAscCustomAutoFilter.isLessThan,
+                caption: me.capCondition5
+            },
+            {
+                condition: c_oAscCustomAutoFilter.isLessThanOrEqualTo,
+                caption: me.capCondition6
+            },
+            {
+                condition: c_oAscCustomAutoFilter.beginsWith,
+                caption: me.capCondition7
+            },
+            {
+                condition: c_oAscCustomAutoFilter.doesNotBeginWith,
+                caption: me.capCondition8
+            },
+            {
+                condition: c_oAscCustomAutoFilter.endsWith,
+                caption: me.capCondition9
+            },
+            {
+                condition: c_oAscCustomAutoFilter.doesNotEndWith,
+                caption: me.capCondition10
+            },
+            {
+                condition: c_oAscCustomAutoFilter.contains,
+                caption: me.capCondition11
+            },
+            {
+                condition: c_oAscCustomAutoFilter.doesNotContain,
+                caption: me.capCondition12
+            }]
+        });
+        this.cmbCondition1 = Ext.create("Ext.form.field.ComboBox", {
+            store: storeCondition,
+            displayField: "caption",
+            valueField: "condition",
+            queryMode: "local",
+            typeAhead: false,
+            style: "margin-right: 10px",
+            width: 200,
+            editable: false
+        });
+        this.txtValue1 = Ext.create("Ext.form.Text", {
+            flex: 1,
+            value: ""
+        });
+        this.txtValue2 = Ext.create("Ext.form.Text", {
+            flex: 1,
+            value: ""
+        });
+        var storeCondition2 = Ext.create("Ext.data.Store", {
+            fields: ["condition", "caption"],
+            data: [{
+                condition: 0,
+                caption: me.textNoFilter
+            }]
+        });
+        storeCondition2.loadRecords(storeCondition.data.getRange(), {
+            addRecords: true
+        });
+        this.cmbCondition2 = Ext.create("Ext.form.field.ComboBox", {
+            store: storeCondition2,
+            displayField: "caption",
+            valueField: "condition",
+            queryMode: "local",
+            typeAhead: false,
+            style: "margin-right: 10px",
+            width: 200,
+            editable: false
+        });
+        this.rbMixer = Ext.widget("radiogroup", {
+            columns: 2,
+            width: 120,
+            items: [{
+                boxLabel: me.capAnd,
+                name: "mix",
+                inputValue: "and",
+                checked: true
+            },
+            {
+                boxLabel: me.capOr,
+                name: "mix",
+                inputValue: "or"
+            }]
+        });
+        var btnOk = Ext.create("Ext.Button", {
+            text: Ext.Msg.buttonText.ok,
+            width: 80,
+            cls: "asc-blue-button",
+            listeners: {
+                click: function () {
+                    me.fireEvent("onmodalresult", me, 1);
+                    me.close();
+                }
+            }
+        });
+        var btnCancel = Ext.create("Ext.Button", {
+            text: me.cancelButtonText,
+            width: 80,
+            listeners: {
+                click: function () {
+                    me.fireEvent("onmodalresult", me, 0);
+                    me.close();
+                }
+            }
+        });
+        this.items = [{
+            xtype: "label",
+            style: "font-weight: bold;margin:0 0 4px 0;",
+            text: me.textShowRows
+        },
+        {
+            xtype: "container",
+            style: "margin:10px 0 0 0;",
+            layout: {
+                type: "hbox",
+                align: "middle"
+            },
+            items: [this.cmbCondition1, this.txtValue1]
+        },
+        {
+            xtype: "container",
+            layout: {
+                type: "hbox",
+                align: "middle"
+            },
+            items: [this.rbMixer]
+        },
+        {
+            xtype: "container",
+            layout: {
+                type: "hbox",
+                align: "middle"
+            },
+            items: [this.cmbCondition2, this.txtValue2]
+        },
+        {
+            xtype: "tbspacer",
+            height: 3
+        },
+        {
+            xtype: "container",
+            width: 400,
+            style: "margin:10px 0 0 0;",
+            layout: {
+                type: "hbox",
+                align: "middle"
+            },
+            items: [{
+                xtype: "tbspacer",
+                flex: 1
+            },
+            btnOk, {
+                xtype: "tbspacer",
+                width: 5
+            },
+            btnCancel]
+        }];
+        this.callParent(arguments);
+        this.setTitle(this.txtTitle);
+    },
+    afterRender: function () {
+        this.callParent(arguments);
+        this._setDefaults();
+    },
+    setSettings: function (config) {
+        this._defaults = [];
+        this._defaults.properties = config;
+    },
+    getSettings: function () {
+        var ret_out = new Asc.AutoFiltersOptions();
+        ret_out.asc_setCellId(this._defaults.properties.asc_getCellId());
+        ret_out.asc_setIsChecked(this.rbMixer.getValue().mix == "or");
+        ret_out.asc_setFilter1(this.cmbCondition1.getValue());
+        ret_out.asc_setFilter2(this.cmbCondition2.getValue() || undefined);
+        ret_out.asc_setValFilter1(this.txtValue1.getValue());
+        ret_out.asc_setValFilter2(this.txtValue2.getValue());
+        return ret_out;
+    },
+    _setDefaults: function () {
+        this.rbMixer.setValue({
+            mix: this._defaults.properties.asc_getIsChecked() ? "or" : "and"
+        });
+        this.cmbCondition1.setValue(this._defaults.properties.asc_getFilter1() || c_oAscCustomAutoFilter.equals);
+        this.cmbCondition2.setValue(this._defaults.properties.asc_getFilter2() || 0);
+        this.txtValue1.setValue(this._defaults.properties.asc_getValFilter1());
+        this.txtValue2.setValue(this._defaults.properties.asc_getValFilter2());
+    },
+    txtTitle: "Custom Filter",
+    capCondition1: "equals",
+    capCondition2: "does not equal",
+    capCondition3: "is greater than",
+    capCondition4: "is greater than or equal to",
+    capCondition5: "is less than",
+    capCondition6: "is less than or equal to",
+    capCondition7: "begins with",
+    capCondition8: "does not begin with",
+    capCondition9: "ends with",
+    capCondition10: "does not end with",
+    capCondition11: "contains",
+    capCondition12: "does not contain",
+    capAnd: "And",
+    capOr: "Or",
+    textShowRows: "Show rows where",
+    textUse1: "Use ? to present any single character",
+    textUse2 : "Use * to present any series of character",
+    textNoFilter: "no filter",
+    cancelButtonText: "Cancel"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/DocumentHelp.js

@@ -0,0 +1,267 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.model.ModelHelpMenu", {
+    extend: "Ext.data.Model",
+    fields: [{
+        type: "string",
+        name: "name"
+    },
+    {
+        type: "string",
+        name: "src"
+    },
+    {
+        type: "string",
+        name: "headername"
+    }]
+});
+Ext.define("SSE.view.DocumentHelp", {
+    extend: "Ext.container.Container",
+    alias: "widget.ssedocumenthelp",
+    cls: "sse-documenthelp-body",
+    autoScroll: true,
+    requires: ["Ext.container.Container", "Ext.XTemplate", "Ext.view.View", "Ext.data.Model", "Ext.data.Store", "Common.plugin.DataViewScrollPane"],
+    constructor: function (config) {
+        this.initConfig(config);
+        this.callParent(arguments);
+        return this;
+    },
+    initComponent: function () {
+        var me = this;
+        this.urlPref = "resources/help/en/";
+        var en_data = [{
+            src: "UsageInstructions/OpenCreateNew.htm",
+            name: "Create a new spreadsheet or open an existing one",
+            headername: "Usage Instructions"
+        },
+        {
+            src: "UsageInstructions/ManageSheets.htm",
+            name: "Manage sheets"
+        },
+        {
+            src: "UsageInstructions/InsertDeleteCells.htm",
+            name: "Insert or delete cells, rows, and columns"
+        },
+        {
+            src: "UsageInstructions/CopyPasteData.htm",
+            name: "Copy and paste data"
+        },
+        {
+            src: "UsageInstructions/FontTypeSizeStyle.htm",
+            name: "Set font type, size, style, and colors"
+        },
+        {
+            src: "UsageInstructions/AlignText.htm",
+            name: "Align data in cells"
+        },
+        {
+            src: "UsageInstructions/AddBorders.htm",
+            name: "Add borders"
+        },
+        {
+            src: "UsageInstructions/MergeCells.htm",
+            name: "Merge cells"
+        },
+        {
+            src: "UsageInstructions/ClearFormatting.htm",
+            name: "Clear text, format in a cell"
+        },
+        {
+            src: "UsageInstructions/SortData.htm",
+            name: "Sort data"
+        },
+        {
+            src: "UsageInstructions/InsertFunction.htm",
+            name: "Insert function"
+        },
+        {
+            src: "UsageInstructions/ChangeNumberFormat.htm",
+            name: "Change number format"
+        },
+        {
+            src: "UsageInstructions/UndoRedo.htm",
+            name: "Undo/redo your actions"
+        },
+        {
+            src: "UsageInstructions/ViewDocInfo.htm",
+            name: "View file information"
+        },
+        {
+            src: "UsageInstructions/SavePrintDownload.htm",
+            name: "Save/print/download your spreadsheet"
+        },
+        {
+            src: "HelpfulHints/About.htm",
+            name: "About ONLYOFFICE Spreadsheet Editor",
+            headername: "Helpful Hints"
+        },
+        {
+            src: "HelpfulHints/SupportedFormats.htm",
+            name: "Supported Formats of Spreadsheets"
+        },
+        {
+            src: "HelpfulHints/Navigation.htm",
+            name: "Navigation through Your Spreadsheet"
+        },
+        {
+            src: "HelpfulHints/Search.htm",
+            name: "Search Function"
+        },
+        {
+            src: "HelpfulHints/KeyboardShortcuts.htm",
+            name: "Keyboard Shortcuts"
+        }];
+        this.menuStore = Ext.create("Ext.data.Store", {
+            model: "SSE.model.ModelHelpMenu",
+            proxy: {
+                type: "ajax",
+                url: "help/Contents.json",
+                noCache: false
+            },
+            listeners: {
+                load: function (store, records, successful) {
+                    if (!successful) {
+                        if (me.urlPref.indexOf("resources/help/en/") < 0) {
+                            me.urlPref = "resources/help/en/";
+                            store.getProxy().url = "resources/help/en/Contents.json";
+                            store.load();
+                        } else {
+                            me.urlPref = "resources/help/en/";
+                            store.loadData(en_data);
+                        }
+                    }
+                }
+            }
+        });
+        var menuTpl = new Ext.XTemplate('<tpl for=".">', '<tpl if="headername">', '<div class="header-wrap">', '<span class="header">{headername}</span>', "</div>", "</tpl>", '<div class="thumb-wrap">', '<span class="caption">{name}</span>', "</div>", "</tpl>", '<div class="x-clear"></div>');
+        this.cntMenu = Ext.create("Ext.container.Container", {
+            layout: "fit",
+            cls: "help-menu-container",
+            width: 200,
+            items: [this.menuView = Ext.create("Ext.view.View", {
+                store: this.menuStore,
+                tpl: menuTpl,
+                singleSelect: true,
+                trackOver: true,
+                style: "overflow:visible;",
+                width: "100%",
+                overItemCls: "x-item-over",
+                itemSelector: "div.thumb-wrap",
+                cls: "help-menu-view",
+                listeners: {
+                    afterrender: function (view) {
+                        view.getSelectionModel().deselectOnContainerClick = false;
+                        if (view.getStore().getCount()) {
+                            view.select(0);
+                            me.iFrame.src = me.urlPref + view.getStore().getAt(0).data.src;
+                        }
+                    },
+                    selectionchange: function (model, selections) {
+                        var record = model.getLastSelected();
+                        if (record) {
+                            me.iFrame.src = me.urlPref + record.data.src;
+                        }
+                    }
+                },
+                plugins: [{
+                    ptype: "dataviewscrollpane",
+                    areaSelector: ".help-menu-view",
+                    pluginId: "docHelpPluginId",
+                    settings: {
+                        enableKeyboardNavigation: true,
+                        keyboardSpeed: 0.001
+                    }
+                }]
+            })]
+        });
+        this.iFrame = document.createElement("iframe");
+        this.iFrame.src = "";
+        this.iFrame.align = "top";
+        this.iFrame.frameBorder = "0";
+        this.iFrame.width = "100%";
+        this.iFrame.height = "100%";
+        this.iFrame.onload = Ext.bind(function () {
+            var src = arguments[0].currentTarget.contentDocument.URL;
+            Ext.each(this.menuStore.data.items, function (item, index) {
+                var res = src.indexOf(item.data.src);
+                if (res > 0) {
+                    this.menuView.select(index);
+                    var node = this.menuView.getNode(index),
+                    plugin = this.menuView.getPlugin("docHelpPluginId");
+                    if (plugin) {
+                        plugin.scrollToElement(node);
+                    }
+                    return false;
+                }
+            },
+            this);
+        },
+        this);
+        this.items = [{
+            xtype: "container",
+            layout: {
+                type: "hbox",
+                align: "stretch"
+            },
+            height: "100%",
+            items: [this.cntMenu, {
+                xtype: "tbspacer",
+                width: 2,
+                style: "border-left: 1px solid #C7C7C7"
+            },
+            {
+                xtype: "container",
+                flex: 1,
+                layout: "fit",
+                listeners: {
+                    afterrender: function (cmp) {
+                        cmp.getEl().appendChild(me.iFrame);
+                    }
+                }
+            }]
+        }];
+        this.callParent(arguments);
+    },
+    setApi: function (o) {
+        if (o) {
+            this.api = o;
+        }
+    },
+    setLangConfig: function (lang) {
+        if (lang) {
+            lang = lang.split("-")[0];
+            this.menuStore.getProxy().url = "resources/help/" + lang + "/Contents.json";
+            this.menuStore.load();
+            this.urlPref = "resources/help/" + lang + "/";
+        }
+    }
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/DocumentHolder.js

@@ -0,0 +1,399 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.DocumentHolder", {
+    extend: "Ext.container.Container",
+    alias: "widget.ssedocumentholder",
+    cls: "sse-documentholder",
+    uses: ["Ext.menu.Menu", "Ext.menu.Manager", "SSE.view.FormulaDialog", "Common.plugin.MenuExpand"],
+    config: {},
+    constructor: function (config) {
+        this.initConfig(config);
+        this.callParent(arguments);
+        return this;
+    },
+    layout: "fit",
+    initComponent: function () {
+        var me = this;
+        this.setApi = function (o) {
+            me.api = o;
+            return me;
+        };
+        var value = window.localStorage.getItem("sse-settings-livecomment");
+        me.isLiveCommenting = !(value !== null && parseInt(value) == 0);
+        me.addEvents("editcomplete");
+        me.callParent(arguments);
+    },
+    createDelayedElements: function () {
+        var me = this;
+        function fixSubmenuPosition(submenu) {
+            if (!submenu.getPosition()[0]) {
+                if (submenu.floatParent) {
+                    var xy = submenu.el.getAlignToXY(submenu.parentItem.getEl(), "tl-tr?"),
+                    region = submenu.floatParent.getTargetEl().getViewRegion();
+                    submenu.setPosition([xy[0] - region.x, xy[1] - region.y]);
+                }
+            }
+        }
+        this.pmiInsertEntire = Ext.widget("menuitem", {
+            action: "insert-entire",
+            text: me.txtInsert
+        });
+        this.pmiInsertCells = Ext.widget("menuitem", {
+            text: me.txtInsert,
+            hideOnClick: false,
+            menu: {
+                action: "insert-cells",
+                showSeparator: false,
+                bodyCls: "no-icons",
+                items: [{
+                    text: me.txtShiftRight,
+                    kind: c_oAscInsertOptions.InsertCellsAndShiftRight
+                },
+                {
+                    text: me.txtShiftDown,
+                    kind: c_oAscInsertOptions.InsertCellsAndShiftDown
+                },
+                {
+                    text: me.txtRow,
+                    kind: c_oAscInsertOptions.InsertRows
+                },
+                {
+                    text: me.txtColumn,
+                    kind: c_oAscInsertOptions.InsertColumns
+                }],
+                plugins: [{
+                    ptype: "menuexpand"
+                }],
+                listeners: {
+                    show: fixSubmenuPosition
+                }
+            }
+        });
+        this.pmiDeleteEntire = Ext.widget("menuitem", {
+            action: "delete-entire",
+            text: me.txtDelete
+        });
+        this.pmiDeleteCells = Ext.widget("menuitem", {
+            text: me.txtDelete,
+            hideOnClick: false,
+            menu: {
+                action: "delete-cells",
+                showSeparator: false,
+                bodyCls: "no-icons",
+                items: [{
+                    text: me.txtShiftLeft,
+                    kind: c_oAscDeleteOptions.DeleteCellsAndShiftLeft
+                },
+                {
+                    text: me.txtShiftUp,
+                    kind: c_oAscDeleteOptions.DeleteCellsAndShiftTop
+                },
+                {
+                    text: me.txtRow,
+                    kind: c_oAscDeleteOptions.DeleteRows
+                },
+                {
+                    text: me.txtColumn,
+                    kind: c_oAscDeleteOptions.DeleteColumns
+                }],
+                plugins: [{
+                    ptype: "menuexpand"
+                }],
+                listeners: {
+                    show: fixSubmenuPosition
+                }
+            }
+        });
+        this.pmiSortCells = Ext.widget("menuitem", {
+            text: me.txtSort,
+            hideOnClick: false,
+            menu: {
+                id: "cmi-sort-cells",
+                bodyCls: "no-icons",
+                showSeparator: false,
+                items: [{
+                    text: me.txtAscending,
+                    direction: "descending"
+                },
+                {
+                    text: me.txtDescending,
+                    direction: "ascending"
+                }],
+                plugins: [{
+                    ptype: "menuexpand"
+                }],
+                listeners: {
+                    show: fixSubmenuPosition
+                }
+            }
+        });
+        this.pmiInsFunction = Ext.widget("menuitem", {
+            text: me.txtFormula,
+            listeners: {
+                click: function (item) {
+                    dlgFormulas.addListener("onmodalresult", function (o, mr, s) {
+                        me.fireEvent("editcomplete", me);
+                    },
+                    me, {
+                        single: true
+                    });
+                    dlgFormulas.show();
+                }
+            }
+        });
+        this.pmiInsHyperlink = Ext.widget("menuitem", {
+            action: "insert-hyperlink",
+            text: me.txtInsHyperlink
+        });
+        this.pmiDelHyperlink = Ext.widget("menuitem", {
+            action: "remove-hyperlink",
+            text: me.removeHyperlinkText
+        });
+        this.pmiRowHeight = Ext.widget("menuitem", {
+            action: "row-height",
+            text: this.txtRowHeight
+        });
+        this.pmiColumnWidth = Ext.widget("menuitem", {
+            action: "column-width",
+            text: this.txtColumnWidth
+        });
+        this.pmiEntireHide = Ext.widget("menuitem", {
+            text: this.txtHide,
+            handler: function (item, event) {
+                me.api[item.isrowmenu ? "asc_hideRows" : "asc_hideColumns"]();
+            }
+        });
+        this.pmiEntireShow = Ext.widget("menuitem", {
+            text: this.txtShow,
+            handler: function (item, event) {
+                me.api[item.isrowmenu ? "asc_showRows" : "asc_showColumns"]();
+            }
+        });
+        this.pmiAddComment = Ext.widget("menuitem", {
+            id: "cmi-add-comment",
+            text: this.txtAddComment
+        });
+        this.pmiCellMenuSeparator = Ext.widget("menuseparator");
+        this.ssMenu = Ext.widget("menu", {
+            id: "context-menu-cell",
+            showSeparator: false,
+            bodyCls: "no-icons",
+            group: "menu-document",
+            items: [{
+                text: this.txtCut,
+                group: "copy-paste",
+                action: "cut"
+            },
+            {
+                text: this.txtCopy,
+                group: "copy-paste",
+                action: "copy"
+            },
+            {
+                text: this.txtPaste,
+                group: "copy-paste",
+                action: "paste"
+            },
+            {
+                xtype: "menuseparator"
+            },
+            this.pmiInsertEntire, this.pmiInsertCells, this.pmiDeleteEntire, this.pmiDeleteCells, {
+                action: "clear-all",
+                text: me.txtClear
+            },
+            this.pmiSortCells, {
+                xtype: "menuseparator"
+            },
+            this.pmiAddComment, this.pmiCellMenuSeparator, this.pmiInsFunction, this.pmiInsHyperlink, this.pmiDelHyperlink, this.pmiRowHeight, this.pmiColumnWidth, this.pmiEntireHide, this.pmiEntireShow],
+            plugins: [{
+                ptype: "menuexpand"
+            }]
+        });
+        this.mnuGroupImg = Ext.create("Ext.menu.Item", {
+            iconCls: "mnu-icon-item mnu-group",
+            text: this.txtGroup,
+            action: "image-grouping",
+            grouping: true
+        });
+        this.mnuUnGroupImg = Ext.create("Ext.menu.Item", {
+            iconCls: "mnu-icon-item mnu-ungroup",
+            text: this.txtUngroup,
+            action: "image-grouping",
+            grouping: false
+        });
+        this.imgMenu = Ext.widget("menu", {
+            showSeparator: false,
+            group: "menu-document",
+            listeners: {
+                click: function (menu, item) {
+                    if (item) {
+                        me.api.asc_setSelectedDrawingObjectLayer(item.arrange);
+                    }
+                    me.fireEvent("editcomplete", me);
+                }
+            },
+            items: [{
+                iconCls: "mnu-icon-item mnu-arrange-front",
+                text: this.textArrangeFront,
+                arrange: c_oAscDrawingLayerType.BringToFront
+            },
+            {
+                iconCls: "mnu-icon-item mnu-arrange-back",
+                text: this.textArrangeBack,
+                arrange: c_oAscDrawingLayerType.SendToBack
+            },
+            {
+                iconCls: "mnu-icon-item mnu-arrange-forward",
+                text: this.textArrangeForward,
+                arrange: c_oAscDrawingLayerType.BringForward
+            },
+            {
+                iconCls: "mnu-icon-item mnu-arrange-backward",
+                text: this.textArrangeBackward,
+                arrange: c_oAscDrawingLayerType.SendBackward
+            },
+            {
+                xtype: "menuseparator"
+            },
+            this.mnuGroupImg, this.mnuUnGroupImg]
+        });
+        this.menuParagraphVAlign = Ext.widget("menuitem", {
+            text: this.vertAlignText,
+            hideOnClick: false,
+            menu: {
+                showSeparator: false,
+                bodyCls: "no-icons",
+                items: [this.menuParagraphTop = Ext.widget("menucheckitem", {
+                    text: this.topCellText,
+                    checked: false,
+                    group: "popupparagraphvalign",
+                    valign: c_oAscVerticalTextAlign.TEXT_ALIGN_TOP
+                }), this.menuParagraphCenter = Ext.widget("menucheckitem", {
+                    text: this.centerCellText,
+                    checked: false,
+                    group: "popupparagraphvalign",
+                    valign: c_oAscVerticalTextAlign.TEXT_ALIGN_CTR
+                }), this.menuParagraphBottom = Ext.widget("menucheckitem", {
+                    text: this.bottomCellText,
+                    checked: false,
+                    group: "popupparagraphvalign",
+                    valign: c_oAscVerticalTextAlign.TEXT_ALIGN_BOTTOM
+                })],
+                plugins: [{
+                    ptype: "menuexpand"
+                }]
+            }
+        });
+        this.pmiInsHyperlinkShape = Ext.widget("menuitem", {
+            text: me.txtInsHyperlink,
+            action: "add-hyperlink-shape"
+        });
+        this.pmiRemoveHyperlinkShape = Ext.widget("menuitem", {
+            text: me.removeHyperlinkText,
+            action: "remove-hyperlink-shape"
+        });
+        this.pmiTextAdvanced = Ext.widget("menuitem", {
+            text: me.txtTextAdvanced,
+            action: "text-advanced"
+        });
+        this.textInShapeMenu = Ext.widget("menu", {
+            showSeparator: false,
+            bodyCls: "no-icons",
+            group: "menu-document",
+            items: [this.menuParagraphVAlign, this.pmiInsHyperlinkShape, this.pmiRemoveHyperlinkShape, {
+                xtype: "menuseparator"
+            },
+            this.pmiTextAdvanced]
+        });
+        this.funcMenu = Ext.widget("menu", {
+            showSeparator: false,
+            bodyCls: "no-icons",
+            group: "menu-document",
+            items: [{
+                text: "item 1"
+            },
+            {
+                text: "item 2"
+            },
+            {
+                text: "item 3"
+            },
+            {
+                text: "item 4"
+            },
+            {
+                text: "item 5"
+            }]
+        });
+    },
+    setLiveCommenting: function (value) {
+        this.isLiveCommenting = value;
+    },
+    txtSort: "Sort",
+    txtAscending: "Ascending",
+    txtDescending: "Descending",
+    txtFormula: "Insert Function",
+    txtInsHyperlink: "Add Hyperlink",
+    txtCut: "Cut",
+    txtCopy: "Copy",
+    txtPaste: "Paste",
+    txtInsert: "Insert",
+    txtDelete: "Delete",
+    txtFilter: "Filter",
+    txtClear: "Clear All",
+    txtShiftRight: "Shift cells right",
+    txtShiftLeft: "Shift cells left",
+    txtShiftUp: "Shift cells up",
+    txtShiftDown: "Shift cells down",
+    txtRow: "Entire Row",
+    txtColumn: "Entire Column",
+    txtColumnWidth: "Column Width",
+    txtRowHeight: "Row Height",
+    txtWidth: "Width",
+    txtHide: "Hide",
+    txtShow: "Show",
+    textArrangeFront: "Bring To Front",
+    textArrangeBack: "Send To Back",
+    textArrangeForward: "Bring Forward",
+    textArrangeBackward: "Send Backward",
+    txtArrange: "Arrange",
+    txtAddComment: "Add Comment",
+    txtUngroup: "Ungroup",
+    txtGroup: "Group",
+    topCellText: "Align Top",
+    centerCellText: "Align Center",
+    bottomCellText: "Align Bottom",
+    vertAlignText: "Vertical Alignment",
+    txtTextAdvanced: "Text Advanced Settings",
+    editHyperlinkText: "Edit Hyperlink",
+    removeHyperlinkText: "Remove Hyperlink"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/DocumentInfo.js

@@ -0,0 +1,250 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.DocumentInfo", {
+    extend: "Ext.container.Container",
+    alias: "widget.ssedocumentinfo",
+    cls: "sse-documentinfo-body",
+    autoScroll: true,
+    requires: ["Ext.button.Button", "Ext.container.Container", "Common.plugin.ScrollPane", "Ext.form.Label", "Ext.XTemplate", "Ext.Date"],
+    uses: ["Common.view.DocumentAccessDialog"],
+    listeners: {
+        afterrender: function (cmp, eOpts) {
+            cmp.updateInfo(cmp.doc);
+        }
+    },
+    constructor: function (config) {
+        this.initConfig(config);
+        this.callParent(arguments);
+        return this;
+    },
+    initComponent: function () {
+        this.infoObj = {
+            PageCount: 0,
+            WordsCount: 0,
+            ParagraphCount: 0,
+            SymbolsCount: 0,
+            SymbolsWSCount: 0
+        };
+        this.inProgress = false;
+        this.lblTitle = Ext.create("Ext.form.Label", {
+            text: "-",
+            height: 14
+        });
+        this.lblPlacement = Ext.create("Ext.form.Label", {
+            text: "-",
+            width: 150,
+            height: 14,
+            style: "text-align:left",
+            hideId: "element-to-hide"
+        });
+        this.lblDate = Ext.create("Ext.form.Label", {
+            text: "-",
+            width: 150,
+            height: 14,
+            style: "text-align:left",
+            hideId: "element-to-hide"
+        });
+        var userTpl = Ext.create("Ext.XTemplate", '<span class="userLink">{text:htmlEncode}</span>');
+        this.cntAuthor = Ext.create("Ext.container.Container", {
+            tpl: userTpl,
+            data: {
+                text: "-"
+            },
+            hideId: "element-to-hide"
+        });
+        var rightsTpl = Ext.create("Ext.XTemplate", "<table>", '<tpl for=".">', "<tr>", '<td style="padding: 0 20px 5px 0;"><span class="userLink">{user:htmlEncode}</span></td>', '<td style="padding: 0 20px 5px 0;">{permissions:htmlEncode}</td>', "</tr>", "</tpl>", "</table>");
+        this.cntRights = Ext.create("Ext.container.Container", {
+            tpl: rightsTpl,
+            hideId: "element-to-hide"
+        });
+        this.items = [{
+            xtype: "tbspacer",
+            height: 30
+        },
+        {
+            xtype: "container",
+            layout: {
+                type: "table",
+                columns: 2,
+                tableAttrs: {
+                    style: "width: 100%;"
+                },
+                tdAttrs: {
+                    style: "padding: 5px 10px;vertical-align: top;"
+                }
+            },
+            items: [{
+                xtype: "label",
+                cellCls: "doc-info-label-cell",
+                text: this.txtTitle,
+                style: "display: block;text-align: right;",
+                width: "100%"
+            },
+            this.lblTitle, {
+                xtype: "label",
+                cellCls: "doc-info-label-cell",
+                text: this.txtAuthor,
+                style: "display: block;text-align: right;",
+                width: "100%"
+            },
+            this.cntAuthor, {
+                xtype: "label",
+                cellCls: "doc-info-label-cell",
+                text: this.txtPlacement,
+                style: "display: block;text-align: right;",
+                width: "100%"
+            },
+            this.lblPlacement, {
+                xtype: "label",
+                cellCls: "doc-info-label-cell",
+                text: this.txtDate,
+                style: "display: block;text-align: right;",
+                width: "100%"
+            },
+            this.lblDate, {
+                xtype: "tbspacer",
+                colspan: 2,
+                height: 5
+            },
+            {
+                xtype: "label",
+                cellCls: "doc-info-label-cell",
+                text: this.txtRights,
+                style: "display: block;text-align: right;",
+                width: "100%"
+            },
+            this.cntRights, this.tbsRights = Ext.create("Ext.toolbar.Spacer", {
+                colspan: 2,
+                height: 5,
+                hideId: "element-to-hide"
+            }), {
+                xtype: "box"
+            },
+            this.btnEditRights = Ext.widget("button", {
+                id: "doc-info-set-rights",
+                cls: "asc-blue-button",
+                text: this.txtBtnAccessRights,
+                hideId: "element-to-hide",
+                listeners: {
+                    click: Ext.bind(this._changeAccessRights, this)
+                }
+            })]
+        }];
+        Ext.apply(this, {
+            plugins: [{
+                ptype: "scrollpane",
+                areaSelector: ".x-container",
+                pluginId: "docInfoPluginId",
+                settings: {
+                    enableKeyboardNavigation: true
+                }
+            }]
+        });
+        this.callParent(arguments);
+    },
+    updateInfo: function (doc) {
+        this.doc = doc;
+        if (!this.rendered) {
+            return;
+        }
+        doc = doc || {};
+        this.lblTitle.setText((doc.title) ? doc.title : "-");
+        if (doc.info) {
+            if (doc.info.author) {
+                this.cntAuthor.update({
+                    text: doc.info.author
+                });
+            }
+            this._ShowHideInfoItem(this.cntAuthor, doc.info.author !== undefined && doc.info.author !== null);
+            if (doc.info.created) {
+                this.lblDate.setText(doc.info.created);
+            }
+            this._ShowHideInfoItem(this.lblDate, doc.info.created !== undefined && doc.info.created !== null);
+            if (doc.info.folder) {
+                this.lblPlacement.setText(doc.info.folder);
+            }
+            this._ShowHideInfoItem(this.lblPlacement, doc.info.folder !== undefined && doc.info.folder !== null);
+            if (doc.info.sharingSettings) {
+                this.cntRights.update(doc.info.sharingSettings);
+            }
+            this._ShowHideInfoItem(this.cntRights, doc.info.sharingSettings !== undefined && doc.info.sharingSettings !== null && this._readonlyRights !== true);
+            this._ShowHideInfoItem(this.tbsRights, doc.info.sharingSettings !== undefined && doc.info.sharingSettings !== null && this._readonlyRights !== true);
+            this._ShowHideInfoItem(this.btnEditRights, !!this.sharingSettingsUrl && this.sharingSettingsUrl.length && this._readonlyRights !== true);
+        } else {
+            this._ShowHideDocInfo(false);
+        }
+    },
+    _ShowHideInfoItem: function (cmp, visible) {
+        var tr = cmp.getEl().up("tr");
+        if (tr) {
+            tr.setDisplayed(visible);
+        }
+    },
+    _ShowHideDocInfo: function (visible) {
+        var components = Ext.ComponentQuery.query('[hideId="element-to-hide"]', this);
+        for (var i = 0; i < components.length; i++) {
+            this._ShowHideInfoItem(components[i], visible);
+        }
+    },
+    stopUpdatingStatisticInfo: function () {},
+    setApi: function (o) {},
+    loadConfig: function (data) {
+        this.sharingSettingsUrl = data.config.sharingSettingsUrl;
+        return this;
+    },
+    _changeAccessRights: function (btn, event, opts) {
+        var win = Ext.widget("commondocumentaccessdialog", {
+            settingsurl: this.sharingSettingsUrl
+        });
+        var me = this;
+        win.on("accessrights", function (obj, rights) {
+            me.doc.info.sharingSettings = rights;
+            me.cntRights.update(rights);
+        });
+        win.show();
+    },
+    onLostEditRights: function () {
+        this._readonlyRights = true;
+        if (!this.rendered) {
+            return;
+        }
+        this._ShowHideInfoItem(this.cntRights, false);
+        this._ShowHideInfoItem(this.tbsRights, false);
+        this._ShowHideInfoItem(this.btnEditRights, false);
+    },
+    txtTitle: "Document Title",
+    txtAuthor: "Author",
+    txtPlacement: "Placement",
+    txtDate: "Creation Date",
+    txtRights: "Persons who have rights",
+    txtBtnAccessRights: "Change access rights"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/DocumentSettings.js

@@ -0,0 +1,161 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.DocumentSettings", {
+    extend: "Ext.container.Container",
+    alias: "widget.ssedocumentsettings",
+    cls: "sse-documentsettings-panel",
+    autoScroll: true,
+    requires: ["Ext.container.Container", "Ext.XTemplate", "Ext.view.View", "Ext.data.Model", "Ext.data.Store", "Common.plugin.DataViewScrollPane", "SSE.view.MainSettingsGeneral", "SSE.view.MainSettingsPrint"],
+    listeners: {
+        show: function (cmp, eOpts) {
+            cmp.updateSettings();
+        }
+    },
+    constructor: function (config) {
+        this.initConfig(config);
+        this.callParent(arguments);
+        return this;
+    },
+    initComponent: function () {
+        var me = this;
+        me.addEvents("savedocsettings");
+        this.addEvents("changemeasureunit");
+        me.generalSettings = Ext.widget("ssemainsettingsgeneral");
+        me.printSettings = Ext.widget("ssemainsettingsprint");
+        me.printSettings.updateMetricUnit();
+        var settingsPanels = [me.generalSettings, me.printSettings, 1];
+        me.generalSettings.addListener("savedocsettings", function () {
+            me.fireEvent("savedocsettings", me);
+        });
+        me.generalSettings.addListener("changemeasureunit", function () {
+            var value = window.localStorage.getItem("sse-settings-unit");
+            Common.MetricSettings.setCurrentMetric((value !== null) ? parseInt(value) : Common.MetricSettings.c_MetricUnits.cm);
+            me.printSettings.updateMetricUnit();
+            me.fireEvent("changemeasureunit", me);
+        });
+        this.menuStore = Ext.create("Ext.data.Store", {
+            fields: ["name", {
+                type: "int",
+                name: "panelindex"
+            },
+            "iconCls"],
+            data: [{
+                name: me.txtGeneral,
+                panelindex: 0,
+                iconCls: "mnu-settings-general"
+            },
+            {
+                name: me.txtPrint,
+                panelindex: 1,
+                iconCls: "mnu-print"
+            }]
+        });
+        var menuTpl = new Ext.XTemplate('<tpl for=".">', '<div class="thumb-wrap">', '<img class="icon {iconCls}" src="' + Ext.BLANK_IMAGE_URL + '" />', '<span class="caption">{name}</span>', "</div>", "</tpl>", '<div class="x-clear"></div>');
+        this.cntMenu = Ext.create("Ext.container.Container", {
+            layout: "fit",
+            cls: "help-menu-container",
+            width: 200,
+            items: [this.menuView = Ext.create("Ext.view.View", {
+                store: this.menuStore,
+                tpl: menuTpl,
+                singleSelect: true,
+                trackOver: true,
+                style: "overflow:visible;",
+                width: "100%",
+                overItemCls: "x-item-over",
+                itemSelector: "div.thumb-wrap",
+                cls: "help-menu-view",
+                listeners: {
+                    afterrender: function (view) {
+                        view.getSelectionModel().deselectOnContainerClick = false;
+                        view.select(0);
+                    },
+                    selectionchange: function (model, selections) {
+                        var record = model.getLastSelected();
+                        if (record) {
+                            if (settingsPanels[record.data.panelindex].updateSettings) {
+                                settingsPanels[record.data.panelindex].updateSettings();
+                            }
+                            settingsPanels[record.data.panelindex].setVisible(true);
+                            settingsPanels[settingsPanels[settingsPanels.length - 1]].setVisible(false);
+                            settingsPanels[settingsPanels.length - 1] = record.data.panelindex;
+                        }
+                    }
+                },
+                plugins: [{
+                    ptype: "dataviewscrollpane",
+                    areaSelector: ".help-menu-view",
+                    pluginId: "docHelpPluginId",
+                    settings: {
+                        enableKeyboardNavigation: true,
+                        keyboardSpeed: 0.001
+                    }
+                }]
+            })]
+        });
+        this.items = [{
+            xtype: "container",
+            layout: {
+                type: "hbox",
+                align: "stretch"
+            },
+            height: "100%",
+            items: [this.cntMenu, {
+                xtype: "tbspacer",
+                width: 2,
+                style: "border-left: 1px solid #C7C7C7"
+            },
+            {
+                xtype: "container",
+                flex: 1,
+                layout: "fit",
+                items: [me.generalSettings, me.printSettings],
+                listeners: {}
+            }]
+        }];
+        this.callParent(arguments);
+    },
+    setApi: function (o) {
+        if (o) {
+            this.api = o;
+        }
+    },
+    updateSettings: function () {
+        this.generalSettings && this.generalSettings.updateSettings();
+    },
+    setMode: function (mode) {
+        this.mode = mode;
+        this.generalSettings && this.generalSettings.setMode(this.mode);
+    },
+    txtGeneral: "General",
+    txtPrint: "Print"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/DocumentStatusInfo.js

@@ -0,0 +1,711 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ var ACTIVE_TAB_NEXT = -255;
+var ACTIVE_TAB_PREV = -254;
+Ext.define("SSE.view.DocumentStatusInfo", {
+    extend: "Ext.container.Container",
+    alias: "widget.documentstatusinfo",
+    requires: ["Ext.form.field.Number", "Ext.button.Button", "Ext.form.Label", "Ext.toolbar.Spacer", "SSE.plugin.TabBarScroller", "SSE.plugin.TabReorderer"],
+    uses: ["Ext.tip.ToolTip", "Ext.menu.Menu", "SSE.view.SheetRenameDialog", "SSE.view.SheetCopyDialog", "Common.view.Participants"],
+    cls: "sse-documentstatusinfo",
+    height: 27,
+    layout: {
+        type: "hbox",
+        align: "middle"
+    },
+    style: "padding-left:5px;padding-right:40px;",
+    initComponent: function () {
+        var me = this;
+        this.permissions = {};
+        this.txtZoom = Ext.widget("label", {
+            id: "status-label-zoom",
+            text: Ext.String.format(me.zoomText, 0),
+            cls: "statusinfo-pages",
+            style: "cursor: pointer; white-space:nowrap; text-align: center;",
+            listeners: {
+                afterrender: function (ct) {
+                    ct.getEl().on("mousedown", onShowZoomMenu, me);
+                    ct.getEl().set({
+                        "data-qtip": me.tipZoomFactor,
+                        "data-qalign": "bl-tl?"
+                    });
+                    ct.setWidth(Ext.util.TextMetrics.measure(ct.getEl(), Ext.String.format(me.zoomText, 999)).width);
+                }
+            }
+        });
+        this.btnZoomIn = Ext.widget("button", {
+            id: "status-button-zoom-in",
+            cls: "asc-btn-zoom asc-statusbar-icon-btn",
+            iconCls: "asc-statusbar-btn btn-zoomin",
+            style: "margin-left:5px;"
+        });
+        this.btnZoomOut = Ext.widget("button", {
+            id: "status-button-zoom-out",
+            cls: "asc-btn-zoom asc-statusbar-icon-btn",
+            iconCls: "asc-statusbar-btn btn-zoomout",
+            style: "margin:0 5px 0 40px;"
+        });
+        this.userPanel = Ext.widget("statusinfoparticipants", {
+            pack: "end",
+            userIconCls: "sse-icon-statusinfo-users"
+        });
+        var onShowZoomMenu = function (event, elem) {
+            if (!elem.disabled) {
+                this.menuZoomTo.show();
+                this.menuZoomTo.showBy(me.txtZoom, "b-t", [0, -10]);
+            }
+        };
+        this.setApi = function (o) {
+            this.api = o;
+            this.api.asc_registerCallback("asc_onZoomChanged", Ext.bind(me.onZoomChange, me));
+            this.api.asc_registerCallback("asc_onSheetsChanged", Ext.bind(me.updateInfo, me));
+            this.api.asc_registerCallback("asc_onEditCell", Ext.bind(me._onStartEditCell, me));
+            this.api.asc_registerCallback("asc_onActiveSheetChanged", Ext.bind(me._onActiveSheetChanged, me));
+            this.api.asc_registerCallback("asc_onСoAuthoringDisconnect", Ext.bind(me.onCoAuthoringDisconnect, me));
+            this.api.asc_registerCallback("asc_onWorkbookLocked", Ext.bind(me.onWorkbookLocked, me));
+            this.api.asc_registerCallback("asc_onWorksheetLocked", Ext.bind(me.onWorksheetLocked, me));
+            this.userPanel.setApi(this.api);
+            return this;
+        };
+        var btnPageFirst = Ext.widget("button", {
+            cls: "asc-btn-zoom asc-statusbar-icon-btn",
+            iconCls: "asc-page-scroller-btn btn-scroll-first"
+        });
+        var btnPageLast = Ext.widget("button", {
+            cls: "asc-btn-zoom asc-statusbar-icon-btn",
+            iconCls: "asc-page-scroller-btn btn-scroll-last"
+        });
+        var btnPagePrev = Ext.widget("button", {
+            cls: "asc-btn-zoom asc-statusbar-icon-btn",
+            iconCls: "asc-page-scroller-btn btn-scroll-prev"
+        });
+        var btnPageNext = Ext.widget("button", {
+            cls: "asc-btn-zoom asc-statusbar-icon-btn",
+            iconCls: "asc-page-scroller-btn btn-scroll-next"
+        });
+        this.barWorksheets = Ext.widget("tabbar", {
+            dock: "bottom",
+            plain: true,
+            width: "100%",
+            style: "margin:-2px 0 0 5px;",
+            plugins: [{
+                ptype: "tabbarscroller",
+                pluginId: "tabbarscroller",
+                firstButton: btnPageFirst,
+                lastButton: btnPageLast,
+                prevButton: btnPagePrev,
+                nextButton: btnPageNext
+            },
+            {
+                ptype: "tabreorderer",
+                pluginId: "scheetreorderer"
+            }]
+        });
+        me.items = [btnPageFirst, btnPagePrev, btnPageNext, btnPageLast, {
+            xtype: "container",
+            flex: 1,
+            height: "100%",
+            items: [this.barWorksheets]
+        },
+        this.userPanel, this.btnZoomOut, this.txtZoom, this.btnZoomIn];
+        me.callParent(arguments);
+    },
+    onZoomChange: function (zf, type) {
+        switch (type) {
+        case 1:
+            case 2:
+            case 0:
+            default:
+            this.txtZoom.setText(Ext.String.format(this.zoomText, Math.floor((zf + 0.005) * 100)));
+        }
+        this.doLayout();
+    },
+    updateInfo: function () {
+        this.fireEvent("updatesheetsinfo", this);
+        this.barWorksheets.removeAll();
+        this.ssMenu.items.items[6].menu.removeAll();
+        this.ssMenu.items.items[6].setVisible(false);
+        if (this.api) {
+            var me = this;
+            var wc = this.api.asc_getWorksheetsCount(),
+            i = -1;
+            var hidentems = [],
+            items = [],
+            tab,
+            locked;
+            var sindex = this.api.asc_getActiveWorksheetIndex();
+            while (++i < wc) {
+                locked = me.api.asc_isWorksheetLockedOrDeleted(i);
+                tab = {
+                    sheetindex: i,
+                    text: me.api.asc_getWorksheetName(i).replace(/\s/g, "&nbsp;"),
+                    reorderable: !locked,
+                    closable: false,
+                    cls: locked ? "coauth-locked" : undefined
+                };
+                this.api.asc_isWorksheetHidden(i) ? hidentems.push(tab) : items.push(tab);
+                if (sindex == i) {
+                    sindex = items.length - 1;
+                }
+            }
+            var checkcount = items.length;
+            if (this.permissions.isEdit) {
+                items.push({
+                    iconCls: "asc-add-page-icon",
+                    width: 36,
+                    closable: false,
+                    reorderable: false,
+                    disabled: me.api.asc_isWorkbookLocked(),
+                    listeners: {
+                        afterrender: function (cmp) {
+                            cmp.getEl().on("click", me._onAddTabClick, me, {
+                                preventDefault: true,
+                                tabid: "tab-add-new"
+                            });
+                        }
+                    }
+                });
+            }
+            if (hidentems.length) {
+                this.ssMenu.items.items[6].setVisible(true);
+                this.ssMenu.items.items[6].menu.add(hidentems);
+            }
+            if (checkcount) {
+                this.barWorksheets.add(items);
+                if (! (sindex < 0) && sindex < checkcount) {
+                    this.barWorksheets.suspendEvents();
+                    this.barWorksheets.setActiveTab(this.barWorksheets.items.items[sindex]);
+                    this.barWorksheets.resumeEvents();
+                }
+                this.barWorksheets.getPlugin("tabbarscroller").scrollToLast();
+                this.barWorksheets.getPlugin("scheetreorderer").dd.unlock();
+            }
+            this.barWorksheets.enable(true);
+            this.txtZoom.setText(Ext.String.format(this.zoomText, this.api.asc_getZoom() * 100));
+        }
+    },
+    setMode: function (m) {
+        this.permissions = m;
+        this.userPanel.setMode(m);
+        var plugin = this.barWorksheets.getPlugin("scheetreorderer");
+        if (plugin) {
+            plugin.setDisabled(!this.permissions.isEdit);
+        }
+    },
+    setActiveWorksheet: function (index, opt) {
+        if (!index) {
+            var new_index = this.barWorksheets.activeTab ? this.barWorksheets.items.items.indexOf(this.barWorksheets.activeTab) : 0;
+            if (opt == ACTIVE_TAB_NEXT) {
+                if (! (++new_index < this.barWorksheets.items.items.length - 1)) {
+                    new_index = 0;
+                }
+            } else {
+                if (opt == ACTIVE_TAB_PREV) {
+                    if (--new_index < 0) {
+                        new_index = this.barWorksheets.items.items.length - 2;
+                    }
+                }
+            }
+            this.barWorksheets.setActiveTab(this.barWorksheets.items.items[new_index]);
+        }
+    },
+    _onTabClick: function (tabBar, tab, card, eOpts) {
+        if (! (tab.sheetindex < 0)) {
+            this.api.asc_showWorksheet(tab.sheetindex);
+            if (tab.newindex != undefined) {
+                var new_index = tab.newindex + 1;
+                new_index < this.barWorksheets.items.length - 1 ? new_index = this.barWorksheets.items.getAt(new_index).sheetindex : new_index = this.api.asc_getWorksheetsCount();
+                this.api.asc_moveWorksheet(new_index);
+                tab.newindex = undefined;
+            }
+        }
+        this.fireEvent("editcomplete", this);
+    },
+    _onAddTabClick: function (e, el, opt) {
+        e.stopEvent();
+        if (!e.target.parentNode.disabled && this.permissions.isEdit) {
+            this.api.asc_addWorksheet();
+        }
+    },
+    _onTabContextMenu: function (event, docElement, eOpts) {
+        if (this.api && this.permissions.isEdit) {
+            var tab = Ext.getCmp(eOpts.tabid);
+            if (tab && tab.sheetindex >= 0) {
+                if (!this.barWorksheets.activeTab || tab.id != this.barWorksheets.activeTab.id) {
+                    this.barWorksheets.setActiveTab(tab);
+                }
+                var issheetlocked = this.api.asc_isWorksheetLockedOrDeleted(tab.sheetindex),
+                isdoclocked = this.api.asc_isWorkbookLocked();
+                this.ssMenu.items.items[0].setDisabled(isdoclocked);
+                this.ssMenu.items.items[1].setDisabled(issheetlocked);
+                this.ssMenu.items.items[2].setDisabled(issheetlocked);
+                this.ssMenu.items.items[3].setDisabled(issheetlocked);
+                this.ssMenu.items.items[4].setDisabled(issheetlocked);
+                this.ssMenu.items.items[5].setDisabled(issheetlocked);
+                this.ssMenu.items.items[6].setDisabled(isdoclocked);
+                this.api.asc_closeCellEditor();
+                this._showPopupMenu(this.ssMenu, {},
+                event, tab.getEl(), eOpts);
+            }
+        }
+    },
+    _onTabDblClick: function (event, docElement, eOpts) {
+        if (this.api && this.permissions.isEdit) {
+            var tab = Ext.getCmp(eOpts.tabid);
+            if (tab && tab.sheetindex >= 0) {
+                if (!this.api.asc_isWorksheetLockedOrDeleted(tab.sheetindex) && this.api.asc_getActiveWorksheetIndex() == tab.sheetindex) {
+                    this._renameWorksheet();
+                }
+            }
+        }
+    },
+    _showPopupMenu: function (menu, value, event, docElement, eOpts) {
+        if (Ext.isDefined(menu)) {
+            Ext.menu.Manager.hideAll();
+            var showPoint = event.getXY();
+            showPoint[1] += 10;
+            if (Ext.isFunction(menu.initMenu)) {
+                menu.initMenu(value);
+            }
+            menu.show();
+            menu.showBy(docElement, "bl-tl");
+        }
+    },
+    _getNewSheetName: function (n) {
+        var nameindex = 1;
+        var firstname = this.strSheet;
+        var wc = this.api.asc_getWorksheetsCount(),
+        i = -1;
+        var items = [];
+        while (++i < wc) {
+            items.push(this.api.asc_getWorksheetName(i));
+        }
+        while (true) {
+            if (Ext.Array.contains(items, firstname + nameindex)) {
+                nameindex++;
+                if (nameindex > 100) {
+                    return "";
+                }
+            } else {
+                break;
+            }
+        }
+        return firstname + nameindex;
+    },
+    _insertWorksheet: function () {
+        var name = this._getNewSheetName();
+        this.api.asc_insertWorksheet(name);
+    },
+    _deleteWorksheet: function () {
+        var me = this;
+        if (this.barWorksheets.items.items.length == 2) {
+            Ext.Msg.show({
+                title: this.textWarning,
+                msg: this.errorLastSheet,
+                icon: Ext.Msg.WARNING,
+                buttons: Ext.Msg.OK
+            });
+        } else {
+            Ext.create("Ext.window.MessageBox", {
+                buttonText: {
+                    ok: "OK",
+                    yes: "Yes",
+                    no: "No",
+                    cancel: me.textCancel
+                }
+            }).show({
+                title: this.textWarning,
+                msg: this.warnDeleteSheet,
+                icon: Ext.Msg.WARNING,
+                buttons: Ext.Msg.OKCANCEL,
+                fn: function (bid) {
+                    if (bid == "ok") {
+                        var index = me.api.asc_getActiveWorksheetIndex();
+                        var uid = me.api.asc_getActiveWorksheetId();
+                        if (!me.api.asc_deleteWorksheet()) {
+                            Ext.Msg.show({
+                                title: me.textError,
+                                msg: me.msgDelSheetError,
+                                icon: Ext.Msg.ERROR,
+                                buttons: Ext.Msg.OK
+                            });
+                        } else {
+                            me.fireEvent("removeworksheet", index, uid);
+                        }
+                    }
+                }
+            });
+        }
+    },
+    _renameWorksheet: function () {
+        var me = this;
+        var wc = me.api.asc_getWorksheetsCount(),
+        items = [],
+        i = -1;
+        while (++i < wc) {
+            items.push(me.api.asc_getWorksheetName(i));
+        }
+        var win = Ext.create("SSE.view.SheetRenameDialog", {
+            title: "Rename",
+            renameindex: me.api.asc_getActiveWorksheetIndex(),
+            names: items
+        });
+        win.addListener("onmodalresult", function (o, mr, s) {
+            if (mr) {
+                me.api.asc_renameWorksheet(s);
+                me.barWorksheets.activeTab.setText(s.replace(/\s/g, "&nbsp;"));
+            }
+            me.fireEvent("editcomplete", me);
+        },
+        false);
+        win.show();
+        var xy = win.getEl().getAlignToXY(me.barWorksheets.activeTab.getEl(), "bl-tl");
+        win.showAt(xy[0], xy[1] - 4);
+    },
+    _getSheetCopyName: function (n) {
+        var result = /^(.*)\((\d)\)$/.exec(n);
+        var nameindex = 2;
+        var firstname = result ? result[1] : n + " ";
+        var tn = firstname + "(" + nameindex + ")";
+        var wc = this.api.asc_getWorksheetsCount(),
+        i = -1;
+        var items = [];
+        while (++i < wc) {
+            items.push(this.api.asc_getWorksheetName(i));
+        }
+        while (true) {
+            if (Ext.Array.contains(items, tn)) {
+                nameindex++;
+                if (nameindex > 100) {
+                    return "";
+                }
+                tn = firstname + "(" + nameindex + ")";
+            } else {
+                break;
+            }
+        }
+        return tn;
+    },
+    _copyWorksheet: function (cut) {
+        var me = this;
+        var wc = me.api.asc_getWorksheetsCount(),
+        i = -1;
+        var items = [];
+        while (++i < wc) {
+            if (!this.api.asc_isWorksheetHidden(i)) {
+                items.push({
+                    name: me.api.asc_getWorksheetName(i).replace(/\s/g, "&nbsp;"),
+                    sheetindex: i
+                });
+            }
+        }
+        if (items.length) {
+            items.push({
+                name: cut ? me.itemMoveToEnd : me.itemCopyToEnd,
+                sheetindex: -255
+            });
+        }
+        var win = Ext.create("SSE.view.SheetCopyDialog", {
+            title: cut ? me.itemMoveWS : me.itemCopyWS,
+            listtitle: cut ? this.textMoveBefore : undefined,
+            names: items
+        });
+        win.addListener("onmodalresult", function (o, mr, i) {
+            if (mr && me.api) {
+                if (cut) {
+                    me.api.asc_moveWorksheet(i == -255 ? wc : i);
+                } else {
+                    var new_text = me._getSheetCopyName(me.api.asc_getWorksheetName(me.api.asc_getActiveWorksheetIndex()));
+                    me.api.asc_copyWorksheet(i == -255 ? wc : i, new_text);
+                }
+            }
+            me.fireEvent("editcomplete", me);
+        },
+        false);
+        win.show();
+    },
+    _showWorksheet: function (show, index) {
+        Ext.menu.Manager.hideAll();
+        if (!show && this.barWorksheets.items.items.length == 2) {
+            Ext.Msg.show({
+                title: this.textWarning,
+                msg: this.errorLastSheet,
+                icon: Ext.Msg.WARNING,
+                buttons: Ext.Msg.OK
+            });
+            return;
+        }
+        this.api[show ? "asc_showWorksheet" : "asc_hideWorksheet"](index);
+    },
+    _onStartEditCell: function (isstart) {
+        this.txtZoom.setDisabled(isstart);
+        this.btnZoomIn.setDisabled(isstart);
+        this.btnZoomOut.setDisabled(isstart);
+    },
+    _onActiveSheetChanged: function (index) {
+        var seltab, item, ic = this.barWorksheets.items.items.length;
+        while (! (--ic < 0)) {
+            item = this.barWorksheets.items.items[ic];
+            if (item.sheetindex == index) {
+                seltab = item;
+                break;
+            }
+        }
+        if (seltab) {
+            this.barWorksheets.setActiveTab(seltab);
+        }
+    },
+    createDelayedElements: function () {
+        var me = this;
+        this.btnZoomIn.getEl().set({
+            "data-qtip": me.tipZoomIn,
+            "data-qalign": "bl-tl?"
+        });
+        this.btnZoomOut.getEl().set({
+            "data-qtip": me.tipZoomOut,
+            "data-qalign": "bl-tl?"
+        });
+        this.btnZoomIn.on("click", function () {
+            var f = me.api.asc_getZoom() + 0.1;
+            if (f > 0 && !(f > 2)) {
+                me.api.asc_setZoom(f);
+            }
+        });
+        this.btnZoomOut.on("click", function () {
+            var f = me.api.asc_getZoom() - 0.1;
+            if (! (f < 0.5)) {
+                me.api.asc_setZoom(f);
+            }
+        });
+        this.barWorksheets.on("change", this._onTabClick, this);
+        this.barWorksheets.getEl().on({
+            contextmenu: {
+                fn: function (event, docElement, eOpts) {
+                    var tab = /x-tab(?!\S)/.test(docElement.className) ? docElement : Ext.fly(docElement).up(".x-tab");
+                    tab && me._onTabContextMenu(event, docElement, {
+                        tabid: tab.id
+                    });
+                },
+                preventDefault: true
+            },
+            dblclick: {
+                fn: function (event, docElement, eOpts) {
+                    var tab = /x-tab(?!\S)/.test(docElement.className) ? docElement : Ext.fly(docElement).up(".x-tab");
+                    tab && me._onTabDblClick(event, docElement, {
+                        tabid: tab.id
+                    });
+                },
+                preventDefault: true
+            }
+        });
+        this.barWorksheets.getPlugin("scheetreorderer").on({
+            drop: function (obj, tabbar, tab, idx, nidx, opts) {
+                if (nidx != idx) {
+                    obj.lock();
+                    tab.newindex = nidx;
+                    tab.reorderable = false;
+                }
+            }
+        });
+        this.menuZoomTo = Ext.widget("menu", {
+            plain: true,
+            bodyCls: "status-zoom-menu",
+            minWidth: 100,
+            listeners: {
+                click: function (menu, item) {
+                    if (me.api) {
+                        me.api.asc_setZoom(item.fz);
+                    }
+                    me.onZoomChange(item.fz);
+                    me.fireEvent("editcomplete", me);
+                }
+            },
+            items: [{
+                text: "50%",
+                fz: 0.5
+            },
+            {
+                text: "75%",
+                fz: 0.75
+            },
+            {
+                text: "100%",
+                fz: 1
+            },
+            {
+                text: "125%",
+                fz: 1.25
+            },
+            {
+                text: "150%",
+                fz: 1.5
+            },
+            {
+                text: "175%",
+                fz: 1.75
+            },
+            {
+                text: "200%",
+                fz: 2
+            }]
+        });
+        this.ssMenu = Ext.widget("menu", {
+            showSeparator: false,
+            bodyCls: "no-icons",
+            listeners: {
+                hide: function (cnt, eOpt) {
+                    me.fireEvent("editcomplete", me);
+                },
+                click: function (menu, item) {
+                    if (!item.isDisabled()) {
+                        if (item.action == "ins") {
+                            me._insertWorksheet();
+                        } else {
+                            if (item.action == "del") {
+                                me._deleteWorksheet();
+                            } else {
+                                if (item.action == "ren") {
+                                    me._renameWorksheet();
+                                } else {
+                                    if (item.action == "copy") {
+                                        me._copyWorksheet(false);
+                                    } else {
+                                        if (item.action == "move") {
+                                            me._copyWorksheet(true);
+                                        } else {
+                                            if (item.action == "hide") {
+                                                me._showWorksheet(false);
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+            },
+            items: [{
+                text: this.itemInsertWS,
+                action: "ins"
+            },
+            {
+                text: this.itemDeleteWS,
+                action: "del"
+            },
+            {
+                text: this.itemRenameWS,
+                action: "ren"
+            },
+            {
+                text: this.itemCopyWS,
+                action: "copy"
+            },
+            {
+                text: this.itemMoveWS,
+                action: "move"
+            },
+            {
+                text: this.itemHideWS,
+                action: "hide"
+            },
+            {
+                text: this.itemHidenWS,
+                hideOnClick: false,
+                menu: {
+                    showSeparator: false,
+                    items: [],
+                    listeners: {
+                        click: function (menu, item) {
+                            me._showWorksheet(true, item.sheetindex);
+                        }
+                    }
+                }
+            }]
+        });
+    },
+    onCoAuthoringDisconnect: function () {
+        this.permissions.isEdit = false;
+        this.barWorksheets.getPlugin("scheetreorderer").setDisabled(true);
+        this.updateInfo();
+    },
+    onWorkbookLocked: function (locked) {
+        this.barWorksheets[locked ? "addCls" : "removeCls"]("coauth-locked");
+        var item, ic = this.barWorksheets.items.items.length;
+        while (! (--ic < 0)) {
+            item = this.barWorksheets.items.items[ic];
+            if (item.sheetindex >= 0) {
+                if (locked) {
+                    item.reorderable = false;
+                } else {
+                    item.reorderable = !this.api.asc_isWorksheetLockedOrDeleted(item.sheetindex);
+                }
+            } else {
+                item.setDisabled(locked);
+            }
+        }
+    },
+    onWorksheetLocked: function (index, locked) {
+        var tabs = this.barWorksheets.items.items;
+        for (var i = 0; i < tabs.length; i++) {
+            if (index == tabs[i].sheetindex) {
+                tabs[i][locked ? "addCls" : "removeCls"]("coauth-locked");
+                tabs[i].reorderable = !locked;
+                break;
+            }
+        }
+    },
+    zoomText: "Zoom {0}%",
+    tipZoomIn: "Zoom In",
+    tipZoomOut: "Zoom Out",
+    tipZoomFactor: "Magnification",
+    txtFirst: "First Sheet",
+    txtLast: "Last Sheet",
+    txtPrev: "Previous Sheet",
+    txtNext: "Next Sheet",
+    itemInsertWS: "Insert",
+    itemDeleteWS: "Delete",
+    itemRenameWS: "Rename",
+    itemCopyWS: "Copy",
+    itemMoveWS: "Move",
+    itemHideWS: "Hide",
+    itemHidenWS: "Hiden",
+    itemCopyToEnd: "(Copy to end)",
+    itemMoveToEnd: "(Move to end)",
+    msgDelSheetError: "Can't delete the worksheet.",
+    textMoveBefore: "Move before sheet",
+    warnDeleteSheet: "The worksheet maybe has data. Proceed operation?",
+    errorLastSheet : "Workbook must have at least one visible worksheet.",
+    strSheet: "Sheet",
+    textError: "Error",
+    textWarning: "Warning",
+    textCancel: "Cancel"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/File.js

@@ -0,0 +1,391 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.File", {
+    extend: "Ext.panel.Panel",
+    alias: "widget.ssefile",
+    cls: "sse-file-body",
+    layout: "card",
+    btnSaveCaption: "Save",
+    btnDownloadCaption: "Download as...",
+    btnInfoCaption: "Document Info...",
+    btnCreateNewCaption: "Create New...",
+    btnRecentFilesCaption: "Open Recent...",
+    btnPrintCaption: "Print",
+    btnHelpCaption: "Help...",
+    btnReturnCaption: "Back to Document",
+    btnToEditCaption: "Edit Document",
+    btnBackCaption: "Go to Documents",
+    btnSettingsCaption: "Advanced Settings...",
+    toolbarWidth: 260,
+    activeBtn: undefined,
+    uses: ["Ext.container.Container", "Ext.toolbar.Toolbar", "Ext.button.Button", "SSE.view.DocumentInfo", "SSE.view.RecentFiles", "SSE.view.CreateFile", "SSE.view.DocumentHelp", "SSE.view.DocumentSettings"],
+    listeners: {
+        afterrender: function (Component, eOpts) {
+            var cnt = this.ownerCt;
+            if (Ext.isDefined(cnt)) {
+                cnt.addListener("show", Ext.Function.bind(this._onShow, this));
+            }
+        }
+    },
+    constructor: function (config) {
+        this.initConfig(config);
+        this.callParent(arguments);
+        return this;
+    },
+    initComponent: function () {
+        var me = this;
+        this.addEvents("editdocument", "downloadas");
+        this.callParent(arguments);
+    },
+    loadConfig: function (data) {
+        this.editorConfig = data.config;
+    },
+    _onShow: function () {
+        if (this.activeBtn === undefined) {
+            this.activeBtn = this.btnDownloadAs.isVisible() ? this.btnCreateNew : this.btnDocumentInfo;
+        }
+        if (this.activeBtn == this.btnDocumentInfo) {
+            this.getLayout().setActiveItem(this.cardDocumentInfo);
+        } else {
+            if (this.activeBtn == this.btnDocumentSettings) {
+                this.getLayout().setActiveItem(this.cardDocumentSettings);
+                this.cardDocumentSettings.updateSettings();
+            } else {
+                if (this.activeBtn == this.btnCreateNew) {
+                    if (this.btnDownloadAs.isVisible()) {
+                        this.getLayout().setActiveItem(this.cardDownloadAs);
+                        this.activeBtn = this.btnDownloadAs;
+                    } else {
+                        this.getLayout().setActiveItem(this.cardDocumentInfo);
+                        this.activeBtn = this.btnDocumentInfo;
+                    }
+                }
+            }
+        }
+        this.redrawButton(this.activeBtn);
+    },
+    buildDockedItems: function () {
+        this.btnSave = Ext.create("Ext.button.Button", {
+            id: "file-button-save",
+            text: this.btnSaveCaption,
+            textAlign: "left",
+            enableToggle: true,
+            cls: "asc-filemenu-btn",
+            padding: "0 27px",
+            height: 27,
+            listeners: {
+                click: Ext.bind(function (btnCall) {
+                    if (btnCall.pressed) {
+                        this.api = this.ownerCt.getApi();
+                        if (this.api) {
+                            this.redrawButton(btnCall);
+                            this.api.asc_Save();
+                            this.closeMenu();
+                        }
+                        Common.component.Analytics.trackEvent("Save");
+                        Common.component.Analytics.trackEvent("File Menu", "Save");
+                    }
+                },
+                this)
+            }
+        });
+        this.btnPrint = this.btnSave.cloneConfig({
+            id: "file-button-print",
+            text: this.btnPrintCaption,
+            listeners: {
+                click: Ext.bind(function (btnCall) {
+                    if (btnCall.pressed) {
+                        this.api = this.ownerCt.getApi();
+                        if (this.api) {
+                            this.api.asc_Print();
+                            this.closeMenu();
+                        }
+                        Common.component.Analytics.trackEvent("Print");
+                        Common.component.Analytics.trackEvent("File Menu", "Print");
+                    }
+                },
+                this)
+            }
+        });
+        this.btnToEdit = this.btnSave.cloneConfig({
+            id: "file-button-edit",
+            text: this.btnToEditCaption,
+            listeners: {
+                click: Ext.bind(function (btnCall) {
+                    this.redrawButton(btnCall);
+                    if (btnCall.pressed) {
+                        this.closeMenu();
+                        this.fireEvent("editdocument");
+                        Common.component.Analytics.trackEvent("Edit");
+                        Common.component.Analytics.trackEvent("File Menu", "Edit");
+                    }
+                },
+                this)
+            }
+        });
+        this.btnDownloadAs = Ext.create("Ext.button.Button", Ext.applyIf(this.getFileMenuButton(this.btnDownloadCaption, this.cardDownloadAs), {
+            id: "file-button-download"
+        }));
+        this.btnDocumentInfo = Ext.create("Ext.button.Button", Ext.applyIf(this.getFileMenuButton(this.btnInfoCaption, this.cardDocumentInfo), {
+            id: "file-button-info"
+        }));
+        this.btnDocumentSettings = Ext.create("Ext.button.Button", Ext.applyIf(this.getFileMenuButton(this.btnSettingsCaption, this.cardDocumentSettings), {
+            id: "file-button-settings"
+        }));
+        this.btnBack = this.btnPrint.cloneConfig({
+            id: "file-button-back",
+            text: this.btnBackCaption,
+            listeners: {
+                click: Ext.bind(function (btnCall) {
+                    this.redrawButton(btnCall);
+                    if (btnCall.pressed) {
+                        Common.Gateway.goBack();
+                        this.closeMenu();
+                    }
+                },
+                this)
+            }
+        });
+        this.btnHelp = Ext.create("Ext.button.Button", this.getFileMenuButton(this.btnHelpCaption, this.cardHelp));
+        this.btnReturn = Ext.create("Ext.button.Button", {
+            id: "file-button-return",
+            text: this.btnReturnCaption,
+            textAlign: "left",
+            enableToggle: true,
+            cls: "asc-filemenu-btn",
+            padding: "0 27px",
+            height: 27,
+            listeners: {
+                click: Ext.bind(function (btnCall) {
+                    if (btnCall.pressed) {
+                        this.closeMenu();
+                        Common.component.Analytics.trackEvent("File Menu", "Return");
+                    }
+                },
+                this)
+            }
+        });
+        this.btnCreateNew = Ext.create("Ext.button.Button", Ext.apply(this.getFileMenuButton(this.btnCreateNewCaption, this.cardCreateNew), {
+            id: "file-button-createnew",
+            label: "Create",
+            listeners: {},
+            enableToggle: false
+        }));
+        this.btnOpenRecent = Ext.create("Ext.button.Button", Ext.applyIf(this.getFileMenuButton(this.btnRecentFilesCaption, this.cardRecentFiles), {
+            id: "file-button-recentfiles",
+            label: "Recent"
+        }));
+        this.tbFileMenu = Ext.create("Ext.toolbar.Toolbar", {
+            dock: "left",
+            layout: {
+                type: "vbox",
+                align: "stretch"
+            },
+            cls: "sse-file-toolbar",
+            vertical: true,
+            width: this.toolbarWidth,
+            defaults: {
+                height: 22,
+                width: "100%"
+            },
+            items: [{
+                xtype: "container",
+                height: 15
+            },
+            this.btnReturn, this.getSeparator(), this.btnSave, this.btnToEdit, this.btnDownloadAs, this.btnPrint, this.getSeparator(), this.btnOpenRecent, this.btnCreateNew, this.getSeparator(), this.btnDocumentInfo, this.getSeparator(), this.btnDocumentSettings, this.getSeparator(), this.btnHelp, this.getSeparator(), this.btnBack]
+        });
+        return this.tbFileMenu;
+    },
+    setApi: function (api) {
+        this.api = api;
+    },
+    getSeparator: function () {
+        return {
+            xtype: "container",
+            html: '<hr class="sse-file-separator" />'
+        };
+    },
+    getFileMenuButton: function (caption, card) {
+        return {
+            text: caption,
+            textAlign: "left",
+            enableToggle: true,
+            cls: "asc-filemenu-btn",
+            padding: "0 27px",
+            height: 27,
+            listeners: {
+                click: Ext.Function.bind(this._itemClick, this, [card], true),
+                toggle: Ext.Function.bind(this._itemTogglge, this)
+            }
+        };
+    },
+    redrawButton: function (btnCall) {
+        var tb = this.tbFileMenu;
+        for (var i = 0; i < tb.items.length; i++) {
+            var btn = tb.items.items[i];
+            if (btn.componentCls === "x-btn") {
+                if (btn.id != btnCall.id && btn.pressed) {
+                    btn.toggle(false, true);
+                }
+            }
+        }
+        btnCall.toggle(true, true);
+    },
+    closeMenu: function () {
+        this.ownerCt.closeMenu();
+    },
+    _itemClick: function (btnCall, event, opt, card) {
+        if (btnCall.pressed) {
+            if (this.activeBtn != btnCall) {
+                this.getLayout().setActiveItem(card);
+                this.activeBtn = btnCall;
+            }
+            Common.component.Analytics.trackEvent("File Menu", btnCall.label);
+        }
+    },
+    _itemTogglge: function (btnCall) {
+        this.redrawButton(btnCall);
+    },
+    applyMode: function () {
+        this.btnDownloadAs.setVisible(this.mode.canDownload);
+        this.hkSaveAs[this.mode.canDownload ? "enable" : "disable"]();
+        this.hkSave[this.mode.isEdit ? "enable" : "disable"]();
+        this.hkHelp.enable();
+        this.btnSave.setVisible(this.mode.isEdit);
+        this.btnToEdit.setVisible(this.mode.canEdit && this.mode.isEdit === false);
+        this.btnDocumentSettings.setVisible(this.mode.isEdit);
+        this.tbFileMenu.items.items[14].setVisible(this.mode.isEdit);
+        this.btnBack.setVisible(this.mode.canBack);
+        this.tbFileMenu.items.items[16].setVisible(this.mode.canBack);
+        this.btnOpenRecent.setVisible(this.mode.canOpenRecent);
+        this.btnCreateNew.setVisible(this.mode.canCreateNew);
+        this.tbFileMenu.items.items[10].setVisible(this.mode.canCreateNew || this.mode.canOpenRecent);
+        this.cardDocumentSettings.setMode(this.mode);
+    },
+    setMode: function (mode, delay) {
+        if (mode.isDisconnected) {
+            this.mode.canEdit = this.mode.isEdit = false;
+            this.mode.canOpenRecent = this.mode.canCreateNew = false;
+        } else {
+            this.mode = mode;
+        }
+        if (!delay) {
+            this.applyMode();
+        }
+    },
+    createDelayedElements: function () {
+        var me = this;
+        this.hkSaveAs = new Ext.util.KeyMap(document, [{
+            key: "s",
+            ctrl: true,
+            shift: true,
+            defaultEventAction: "stopEvent",
+            fn: function () {
+                if (me.ownerCt && me.ownerCt.isVisible()) {
+                    me.btnDownloadAs.toggle(true);
+                    me.btnDownloadAs.fireEvent("click", me.btnDownloadAs);
+                }
+            }
+        }]);
+        this.hkSave = new Ext.util.KeyMap(document, [{
+            key: "s",
+            ctrl: true,
+            shift: false,
+            defaultEventAction: "stopEvent",
+            fn: function () {
+                if (canHotKey()) {
+                    var api = me.ownerCt.getApi();
+                    if (api) {
+                        api.asc_Save();
+                    }
+                }
+            }
+        }]);
+        this.hkHelp = new Ext.util.KeyMap(document, {
+            key: Ext.EventObject.F1,
+            ctrl: false,
+            shift: false,
+            defaultEventAction: "stopEvent",
+            fn: function () {
+                if (me.ownerCt && me.ownerCt.isVisible()) {
+                    me.btnHelp.toggle(true);
+                    me.btnHelp.fireEvent("click", me.btnHelp, [me.cardHelp]);
+                }
+            }
+        });
+        var docInfo = [{
+            name: "XLSX",
+            imgCls: "tabular-format btn-xlsx",
+            type: c_oAscFileType.XLSX
+        }];
+        this.cardDownloadAs = Ext.widget("container", {
+            cls: "sse-file-table",
+            layout: {
+                type: "table",
+                columns: 2
+            }
+        });
+        Ext.each(docInfo, function (item) {
+            this.cardDownloadAs.add({
+                xtype: "container",
+                items: [{
+                    xtype: "button",
+                    id: "file-format-" + item.name,
+                    cls: item.imgCls + " download-button-style",
+                    docType: item.type,
+                    width: 102,
+                    height: 129,
+                    margin: "65px 25px 0 25px"
+                }]
+            });
+        },
+        this);
+        this.cardDocumentInfo = Ext.widget("ssedocumentinfo");
+        this.cardCreateNew = Ext.widget("ssecreatenew");
+        this.cardRecentFiles = Ext.widget("sserecentfiles");
+        this.cardHelp = Ext.widget("ssedocumenthelp");
+        this.cardDocumentSettings = Ext.widget("ssedocumentsettings");
+        this.cardDocumentSettings.addListener("savedocsettings", Ext.bind(this.closeMenu, this));
+        this.add([this.cardDownloadAs, this.cardHelp, this.cardDocumentInfo, this.cardRecentFiles, this.cardDocumentSettings]);
+        this.addDocked(this.buildDockedItems());
+        this.setConfig();
+        this.applyMode();
+    },
+    setConfig: function () {
+        this.cardHelp.setLangConfig(this.editorConfig.lang);
+        if (this.editorConfig.templates && this.editorConfig.templates.length > 0) {
+            this.btnCreateNew.enableToggle = true;
+            this.btnCreateNew.on("click", Ext.bind(this._itemClick, this, [this.cardCreateNew], true));
+            this.btnCreateNew.on("toggle", Ext.bind(this._itemTogglge, this));
+        }
+    }
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/FormulaDialog.js

@@ -0,0 +1,247 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.FormulaDialog", {
+    extend: "Ext.window.Window",
+    alias: "widget.sseformuladialog",
+    requires: ["Ext.window.Window", "Common.plugin.GridScrollPane"],
+    modal: true,
+    closable: true,
+    resizable: false,
+    height: 490,
+    width: 300,
+    constrain: true,
+    padding: "10px 20px 0 20px",
+    layout: {
+        type: "vbox",
+        align: "stretch"
+    },
+    initComponent: function () {
+        var gp_store = Ext.create("SSE.store.FormulaGroups");
+        this.cmbGroup = Ext.create("Ext.form.field.ComboBox", {
+            id: "formulas-group-combo",
+            store: gp_store,
+            displayField: "groupname",
+            queryMode: "local",
+            queryDelay: 1000,
+            typeAhead: false,
+            editable: false,
+            listeners: {
+                select: function (combo, records, eOpts) {},
+                specialkey: function (obj, event) {
+                    if (!obj.isExpanded && event.getKey() == Ext.EventObject.ESC) {
+                        this.fireEvent("onmodalresult", this, 0);
+                        this.hide();
+                    }
+                },
+                scope: this
+            }
+        });
+        Ext.create("SSE.store.Formulas", {
+            storeId: "appFormulasStore"
+        });
+        var funcList = Ext.create("Ext.grid.Panel", {
+            activeItem: 0,
+            id: "formulas-list",
+            store: Ext.data.StoreManager.lookup("appFormulasStore"),
+            stateful: true,
+            stateId: "stateGrid",
+            scroll: false,
+            columns: [{
+                flex: 1,
+                sortable: false,
+                dataIndex: "func"
+            }],
+            height: 250,
+            hideHeaders: true,
+            viewConfig: {
+                stripeRows: false
+            },
+            plugins: [{
+                pluginId: "scrollpane",
+                ptype: "gridscrollpane"
+            }],
+            listeners: {
+                itemdblclick: function (o, record, item, index, e, eOpts) {
+                    this.btnOk.fireEvent("click", this.btnOk);
+                },
+                select: function (o, record, index, eOpts) {
+                    lblSyntax.setText("Syntax: " + record.data.func + record.data.args);
+                },
+                viewready: function (cmp) {
+                    cmp.getView().on("cellkeydown", function (obj, cell, cellIndex, record, row, rowIndex, e) {
+                        if (e.getKey() == Ext.EventObject.ESC) {
+                            this.fireEvent("onmodalresult", this, 0);
+                            this.hide();
+                            return false;
+                        }
+                    },
+                    this);
+                },
+                scope: this
+            }
+        });
+        var lblSyntax = Ext.widget("label", {});
+        this.items = [{
+            xtype: "container",
+            layout: {
+                type: "vbox",
+                align: "stretch"
+            },
+            height: 57,
+            width: 260,
+            items: [{
+                xtype: "label",
+                text: this.textGroupDescription,
+                style: "font-weight: bold;margin:0 0 4px 0;"
+            },
+            this.cmbGroup]
+        },
+        {
+            xtype: "container",
+            layout: {
+                type: "vbox",
+                align: "stretch"
+            },
+            height: 277,
+            width: 260,
+            items: [{
+                xtype: "label",
+                text: this.textListDescription,
+                style: "font-weight:bold;margin:0 0 4px 0;"
+            },
+            funcList]
+        },
+        {
+            xtype: "container",
+            layout: {
+                type: "vbox",
+                align: "stretch"
+            },
+            height: 56,
+            items: [lblSyntax]
+        },
+        {
+            xtype: "tbspacer",
+            height: 8,
+            html: '<div style="width: 100%; height: 40%; border-bottom: 1px solid #C7C7C7"></div>'
+        },
+        {
+            xtype: "container",
+            height: 40,
+            layout: {
+                type: "vbox",
+                align: "center",
+                pack: "center"
+            },
+            items: [{
+                xtype: "container",
+                width: 182,
+                height: 24,
+                layout: {
+                    type: "hbox",
+                    align: "middle"
+                },
+                items: [this.btnOk = Ext.widget("button", {
+                    id: "formulas-button-ok",
+                    cls: "asc-blue-button",
+                    width: 86,
+                    height: 22,
+                    margin: "0 5px 0 0",
+                    text: this.okButtonText,
+                    listeners: {
+                        click: function (btn) {
+                            this.fireEvent("onmodalresult", this, 1, funcList.getSelectionModel().selected.items[0].data.func);
+                        },
+                        scope: this
+                    }
+                }), this.btnCancel = Ext.widget("button", {
+                    cls: "asc-darkgray-button",
+                    width: 86,
+                    height: 22,
+                    text: this.cancelButtonText,
+                    listeners: {
+                        click: function (btn) {
+                            this.fireEvent("onmodalresult", this, 0);
+                            this.hide();
+                        },
+                        scope: this
+                    }
+                })]
+            }]
+        }];
+        this.listeners = {
+            show: function () {}
+        };
+        this.callParent(arguments);
+        this.setTitle(this.txtTitle);
+    },
+    setGroups: function (arr) {
+        var groupDesc = {
+            "Cube": this.sCategoryCube,
+            "Database": this.sCategoryDatabase,
+            "DateAndTime": this.sCategoryDateTime,
+            "Engineering": this.sCategoryEngineering,
+            "Financial": this.sCategoryFinancial,
+            "Information": this.sCategoryInformation,
+            "Logical": this.sCategoryLogical,
+            "LookupAndReference": this.sCategoryLookupAndReference,
+            "Mathematic": this.sCategoryMathematics,
+            "Statistical": this.sCategoryStatistical,
+            "TextAndData": this.sCategoryTextData
+        };
+        var garr = [[this.sCategoryAll, "all"]];
+        Ext.each(arr, function (item) {
+            garr.push([groupDesc[item], item]);
+        });
+        this.cmbGroup.getStore().removeAll(true);
+        this.cmbGroup.getStore().loadData(garr);
+        this.cmbGroup.select(this.cmbGroup.getStore().getAt(0));
+    },
+    cancelButtonText: "Cancel",
+    okButtonText: "Ok",
+    sCategoryAll: "All",
+    sCategoryLogical: "Logical",
+    sCategoryCube: "Cube",
+    sCategoryDatabase: "Database",
+    sCategoryDateTime: "Date and time",
+    sCategoryEngineering: "Engineering",
+    sCategoryFinancial: "Financial",
+    sCategoryInformation: "Information",
+    sCategoryLookupAndReference: "LookupAndReference",
+    sCategoryMathematics: "Math and trigonometry",
+    sCategoryStatistical: "Statistical",
+    sCategoryTextData: "Text and data",
+    textGroupDescription: "Select Function Group",
+    textListDescription: "Select Function",
+    sDescription: "Description",
+    txtTitle: "Insert Function"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/HyperlinkSettings.js

@@ -0,0 +1,339 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.HyperlinkSettings", {
+    extend: "Ext.window.Window",
+    alias: "widget.ssehyperlinksettings",
+    requires: ["Ext.window.Window", "Ext.form.field.ComboBox", "Ext.form.field.Text", "Ext.Array"],
+    cls: "asc-advanced-settings-window",
+    modal: true,
+    resizable: false,
+    plain: true,
+    constrain: true,
+    height: 348,
+    width: 366,
+    layout: {
+        type: "vbox",
+        align: "stretch"
+    },
+    listeners: {
+        show: function () {
+            if (this.contExtLink.isVisible()) {
+                this.txtLink.focus(false, 500);
+            } else {
+                this.txtLinkText.focus(false, 500);
+            }
+        }
+    },
+    initComponent: function () {
+        var me = this;
+        this.addEvents("onmodalresult");
+        this._spacer = Ext.create("Ext.toolbar.Spacer", {
+            width: "100%",
+            height: 10,
+            html: '<div style="width: 100%; height: 40%; border-bottom: 1px solid #C7C7C7"></div>'
+        });
+        this.cmbLinkType = Ext.widget("combo", {
+            store: Ext.create("Ext.data.Store", {
+                fields: ["description", "type"],
+                data: [{
+                    type: c_oAscHyperlinkType.RangeLink,
+                    description: me.textInternalLink
+                },
+                {
+                    type: c_oAscHyperlinkType.WebLink,
+                    description: me.textExternalLink
+                }]
+            }),
+            displayField: "description",
+            valueField: "type",
+            queryMode: "local",
+            editable: false,
+            listeners: {
+                change: function (o, nV, oV) {
+                    var isinter = nV == c_oAscHyperlinkType.RangeLink;
+                    me.contIntLink.setVisible(isinter);
+                    me.contExtLink.setVisible(!isinter);
+                }
+            }
+        });
+        this.cmbSheets = Ext.widget("combo", {
+            store: Ext.create("Ext.data.ArrayStore", {
+                fields: ["name"],
+                data: this.sheets
+            }),
+            displayField: "name",
+            queryMode: "local",
+            editable: false
+        });
+        this.txtDataRange = Ext.widget("textfield", {
+            allowBlank: false,
+            check: false,
+            blankText: me.txtEmpty,
+            msgTarget: "side",
+            validator: function (value) {
+                if (!this.check) {
+                    return true;
+                }
+                var isvalid = /^[A-Z]+[1-9]\d*:[A-Z]+[1-9]\d*$/.test(value); ! isvalid && (isvalid = /^[A-Z]+[1-9]\d*$/.test(value));
+                if (isvalid) {
+                    $("#" + this.id + " input").css("color", "black");
+                    return true;
+                } else {
+                    $("#" + this.id + " input").css("color", "red");
+                    return me.textInvalidRange;
+                }
+            },
+            listeners: {
+                blur: function (o) {
+                    this.check = true;
+                    this.check = !this.validate();
+                }
+            }
+        });
+        this.txtLink = Ext.widget("textfield", {
+            allowBlank: false,
+            blankText: me.txtEmpty,
+            emptyText: me.textEmptyLink,
+            validateOnChange: false,
+            msgTarget: "side",
+            regex: /(([\-\wа-яё]+\.)+[\wа-яё]{2,3}(\/[%\-\wа-яё]+(\.[\wа-яё]{2,})?)*(([\wа-яё\-\.\?\\\/+@&#;`~=%!]*)(\.[\wа-яё]{2,})?)*\/?)/i,
+            regexText: me.txtNotUrl
+        });
+        this.txtLinkText = Ext.widget("textfield", {
+            allowBlank: false,
+            blankText: me.txtEmpty,
+            msgTarget: "side",
+            emptyText: me.textEmptyDesc
+        });
+        this.txtLinkTip = Ext.widget("textfield", {
+            emptyText: me.textEmptyTooltip
+        });
+        this.label = Ext.widget("label", {
+            width: "100%",
+            margin: "0 0 3 0"
+        });
+        this.contExtLink = Ext.widget("container", {
+            height: 44,
+            layout: {
+                type: "vbox",
+                align: "stretch"
+            },
+            items: [this.label.cloneConfig({
+                text: me.strLinkTo
+            }), this.txtLink]
+        });
+        this.contIntLink = Ext.widget("container", {
+            height: 44,
+            hidden: true,
+            layout: {
+                type: "hbox",
+                align: "stretch"
+            },
+            items: [{
+                xtype: "container",
+                flex: 1,
+                layout: {
+                    type: "vbox",
+                    align: "stretch"
+                },
+                items: [this.label.cloneConfig({
+                    text: me.strSheet
+                }), this.cmbSheets]
+            },
+            {
+                xtype: "tbspacer",
+                width: 18
+            },
+            {
+                xtype: "container",
+                flex: 1,
+                layout: {
+                    type: "vbox",
+                    align: "stretch"
+                },
+                items: [this.label.cloneConfig({
+                    text: me.strRange
+                }), this.txtDataRange]
+            }]
+        });
+        this.items = [{
+            xtype: "container",
+            height: 254,
+            padding: "18",
+            layout: {
+                type: "vbox",
+                align: "stretch"
+            },
+            items: [this.label.cloneConfig({
+                text: me.textLinkType
+            }), this.cmbLinkType, {
+                xtype: "tbspacer",
+                height: 10
+            },
+            this.contExtLink, this.contIntLink, {
+                xtype: "tbspacer",
+                height: 10
+            },
+            this.labelDisplay = this.label.cloneConfig({
+                text: me.strDisplay
+            }), this.txtLinkText, {
+                xtype: "tbspacer",
+                height: 10
+            },
+            this.label.cloneConfig({
+                text: me.textTipText
+            }), this.txtLinkTip]
+        },
+        this._spacer.cloneConfig({
+            style: "margin: 0 18px"
+        }), {
+            xtype: "container",
+            height: 40,
+            layout: {
+                type: "vbox",
+                align: "center",
+                pack: "center"
+            },
+            items: [{
+                xtype: "container",
+                width: 182,
+                height: 24,
+                layout: {
+                    type: "hbox",
+                    align: "middle"
+                },
+                items: [this.btnOk = Ext.widget("button", {
+                    cls: "asc-blue-button",
+                    width: 86,
+                    height: 22,
+                    margin: "0 5px 0 0",
+                    text: Ext.Msg.buttonText.ok,
+                    listeners: {
+                        click: function (btn) {
+                            if (me.cmbLinkType.getValue() == c_oAscHyperlinkType.RangeLink) {
+                                me.txtDataRange.check = true;
+                                if (!me.txtDataRange.validate()) {
+                                    me.txtDataRange.focus(true, 500);
+                                    return;
+                                }
+                            } else {
+                                if (!me.txtLink.isValid()) {
+                                    me.txtLink.focus(true, 500);
+                                    return;
+                                }
+                            }
+                            if (!me.txtLinkText.isValid()) {
+                                me.txtLinkText.focus(true, 500);
+                                return;
+                            }
+                            this.fireEvent("onmodalresult", this, 1);
+                            this.close();
+                        },
+                        scope: this
+                    }
+                }), this.btnCancel = Ext.widget("button", {
+                    cls: "asc-darkgray-button",
+                    width: 86,
+                    height: 22,
+                    text: me.cancelButtonText,
+                    listeners: {
+                        click: function (btn) {
+                            this.fireEvent("onmodalresult", this, 0);
+                            this.close();
+                        },
+                        scope: this
+                    }
+                })]
+            }]
+        }];
+        this.callParent(arguments);
+        this.setTitle(this.textTitle);
+    },
+    afterRender: function () {
+        this.callParent(arguments);
+    },
+    setSettings: function (props, text, islock) {
+        if (!props) {
+            this.cmbLinkType.select(this.cmbLinkType.getStore().getAt(1));
+            this.txtLinkText.setValue(text);
+        } else {
+            var index = this.cmbLinkType.getStore().find("type", props.asc_getType());
+            this.cmbLinkType.select(this.cmbLinkType.getStore().getAt(index));
+            if (props.asc_getType() == c_oAscHyperlinkType.RangeLink) {
+                index = this.cmbSheets.getStore().find("name", props.asc_getSheet());
+                if (! (index < 0)) {
+                    this.cmbSheets.select(this.cmbSheets.getStore().getAt(index));
+                }
+                this.txtDataRange.setValue(props.asc_getRange());
+            } else {
+                this.txtLink.setValue(props.asc_getHyperlinkUrl());
+            }
+            this.txtLinkText.setValue(props.asc_getText());
+            this.txtLinkTip.setValue(props.asc_getTooltip());
+        }
+        this.txtLinkText.setDisabled(islock);
+        this.labelDisplay.setDisabled(islock);
+    },
+    getSettings: function () {
+        var props = new Asc.asc_CHyperlink();
+        props.asc_setType(this.cmbLinkType.getValue());
+        if (this.cmbLinkType.getValue() == c_oAscHyperlinkType.RangeLink) {
+            props.asc_setSheet(this.cmbSheets.getValue());
+            props.asc_setRange(this.txtDataRange.getValue());
+        } else {
+            var url = this.txtLink.getValue().replace(/^\s+|\s+$/g, "");
+            if (!/(((^https?)|(^ftp)):\/\/)/i.test(url)) {
+                url = "http://" + url;
+            }
+            props.asc_setHyperlinkUrl(url);
+        }
+        props.asc_setText(this.txtLinkText.isDisabled() ? null : this.txtLinkText.getValue());
+        props.asc_setTooltip(this.txtLinkTip.getValue());
+        return props;
+    },
+    textTitle: "Hyperlink Settings",
+    textInternalLink: "Internal Data Range",
+    textExternalLink: "Web Link",
+    textEmptyLink: "Enter link here",
+    textEmptyDesc: "Enter caption here",
+    textEmptyTooltip: "Enter tooltip here",
+    strSheet: "Sheet",
+    strRange: "Range",
+    textLinkType: "Link Type",
+    strDisplay: "Display",
+    textTipText: "Screen Tip Text",
+    strLinkTo: "Link To",
+    txtEmpty: "This field is required",
+    textInvalidRange: "ERROR! Invalid cells range",
+    txtNotUrl: 'This field should be a URL in the format "http://www.example.com"',
+    cancelButtonText: "Cancel"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/ImageSettings.js

@@ -0,0 +1,389 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.ImageSettings", {
+    extend: "Common.view.AbstractSettingsPanel",
+    alias: "widget.sseimagesettings",
+    height: 192,
+    requires: ["Ext.ComponentQuery", "Ext.container.Container", "Ext.button.Button", "Ext.form.Label", "Ext.toolbar.Spacer", "Common.view.ImageFromUrlDialog", "Ext.util.Cookies"],
+    constructor: function (config) {
+        this.callParent(arguments);
+        this.initConfig(config);
+        return this;
+    },
+    initComponent: function () {
+        this.title = this.txtTitle;
+        this._initSettings = true;
+        this._nRatio = 1;
+        this._state = {
+            Width: 0,
+            Height: 0
+        };
+        this._spnWidth = Ext.create("Common.component.MetricSpinner", {
+            id: "image-spin-width",
+            readOnly: false,
+            maxValue: 55.88,
+            minValue: 0,
+            step: 0.1,
+            defaultUnit: "cm",
+            value: "3 cm",
+            width: 78,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    var w = field.getNumberValue();
+                    var h = this._spnHeight.getNumberValue();
+                    if (this._btnRatio.pressed) {
+                        h = w / this._nRatio;
+                        if (h > this._spnHeight.maxValue) {
+                            h = this._spnHeight.maxValue;
+                            w = h * this._nRatio;
+                            this._spnWidth.suspendEvents(false);
+                            this._spnWidth.setValue(w);
+                            this._spnWidth.resumeEvents();
+                        }
+                        this._spnHeight.suspendEvents(false);
+                        this._spnHeight.setValue(h);
+                        this._spnHeight.resumeEvents();
+                    }
+                    if (this.api) {
+                        var props = new Asc.asc_CImgProperty();
+                        props.asc_putWidth(Common.MetricSettings.fnRecalcToMM(w));
+                        props.asc_putHeight(Common.MetricSettings.fnRecalcToMM(h));
+                        this.api.asc_setGraphicObjectProps(props);
+                    }
+                    this.fireEvent("editcomplete", this);
+                },
+                this)
+            }
+        });
+        this.controls.push(this._spnWidth);
+        this._spnHeight = Ext.create("Common.component.MetricSpinner", {
+            id: "image-span-height",
+            readOnly: false,
+            maxValue: 55.88,
+            minValue: 0,
+            step: 0.1,
+            defaultUnit: "cm",
+            value: "3 cm",
+            width: 78,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    var h = field.getNumberValue(),
+                    w = this._spnWidth.getNumberValue();
+                    if (this._btnRatio.pressed) {
+                        w = h * this._nRatio;
+                        if (w > this._spnWidth.maxValue) {
+                            w = this._spnWidth.maxValue;
+                            h = w / this._nRatio;
+                            this._spnHeight.suspendEvents(false);
+                            this._spnHeight.setValue(h);
+                            this._spnHeight.resumeEvents();
+                        }
+                        this._spnWidth.suspendEvents(false);
+                        this._spnWidth.setValue(w);
+                        this._spnWidth.resumeEvents();
+                    }
+                    if (this.api) {
+                        var props = new Asc.asc_CImgProperty();
+                        props.asc_putWidth(Common.MetricSettings.fnRecalcToMM(w));
+                        props.asc_putHeight(Common.MetricSettings.fnRecalcToMM(h));
+                        this.api.asc_setGraphicObjectProps(props);
+                    }
+                    this.fireEvent("editcomplete", this);
+                },
+                this)
+            }
+        });
+        this.controls.push(this._spnHeight);
+        var value = window.localStorage.getItem("sse-settings-imageratio");
+        this._btnRatio = Ext.create("Ext.Button", {
+            id: "image-button-ratio",
+            iconCls: "advanced-btn-ratio",
+            enableToggle: true,
+            width: 22,
+            height: 22,
+            pressed: (value === null || parseInt(value) == 1),
+            style: "margin: 0 0 0 4px;",
+            tooltip: this.textKeepRatio,
+            toggleHandler: Ext.bind(function (btn) {
+                if (btn.pressed && this._spnHeight.getNumberValue() > 0) {
+                    this._nRatio = this._spnWidth.getNumberValue() / this._spnHeight.getNumberValue();
+                }
+                window.localStorage.setItem("sse-settings-imageratio", (btn.pressed) ? 1 : 0);
+            },
+            this)
+        });
+        this._btnOriginalSize = Ext.create("Ext.Button", {
+            id: "image-button-original-size",
+            text: this.textOriginalSize,
+            width: 106,
+            listeners: {
+                click: this.setOriginalSize,
+                scope: this
+            }
+        });
+        this._btnInsertFromFile = Ext.create("Ext.Button", {
+            id: "image-button-from-file",
+            text: this.textFromFile,
+            width: 85,
+            listeners: {
+                click: function (btn) {
+                    if (this.api) {
+                        this.api.asc_changeImageFromFile();
+                    }
+                    this.fireEvent("editcomplete", this);
+                },
+                scope: this
+            }
+        });
+        this._btnInsertFromUrl = Ext.create("Ext.Button", {
+            id: "image-button-from-url",
+            text: this.textFromUrl,
+            width: 85,
+            listeners: {
+                click: function (btn) {
+                    var w = Ext.create("Common.view.ImageFromUrlDialog");
+                    w.addListener("onmodalresult", Ext.bind(this._onOpenImageFromURL, [this, w]), false);
+                    w.addListener("close", Ext.bind(function (cnt, eOpts) {
+                        this.fireEvent("editcomplete", this);
+                    },
+                    this));
+                    w.show();
+                },
+                scope: this
+            }
+        });
+        this._SizePanel = Ext.create("Ext.container.Container", {
+            layout: "vbox",
+            layoutConfig: {
+                align: "stretch"
+            },
+            height: 88,
+            width: 195,
+            items: [{
+                xtype: "tbspacer",
+                height: 8
+            },
+            {
+                xtype: "container",
+                layout: {
+                    type: "table",
+                    columns: 2
+                },
+                defaults: {
+                    xtype: "container",
+                    layout: "vbox",
+                    layoutConfig: {
+                        align: "stretch"
+                    },
+                    height: 43,
+                    style: "float:left;"
+                },
+                items: [{
+                    items: [{
+                        xtype: "label",
+                        text: this.textWidth,
+                        width: 78
+                    },
+                    {
+                        xtype: "tbspacer",
+                        height: 3
+                    },
+                    {
+                        xtype: "container",
+                        width: 108,
+                        layout: {
+                            type: "hbox"
+                        },
+                        items: [this._spnWidth, this._btnRatio, {
+                            xtype: "tbspacer",
+                            width: 4
+                        }]
+                    }]
+                },
+                {
+                    items: [{
+                        xtype: "label",
+                        text: this.textHeight,
+                        width: 78
+                    },
+                    {
+                        xtype: "tbspacer",
+                        height: 3
+                    },
+                    this._spnHeight]
+                }]
+            },
+            {
+                xtype: "tbspacer",
+                height: 7
+            },
+            this._btnOriginalSize, {
+                xtype: "tbspacer",
+                height: 3
+            }]
+        });
+        this._UrlPanel = Ext.create("Ext.container.Container", {
+            layout: "vbox",
+            layoutConfig: {
+                align: "stretch"
+            },
+            height: 36,
+            width: 195,
+            items: [{
+                xtype: "tbspacer",
+                height: 8
+            },
+            {
+                xtype: "container",
+                layout: {
+                    type: "table",
+                    columns: 2,
+                    tdAttrs: {
+                        style: "padding-right: 8px;"
+                    }
+                },
+                items: [this._btnInsertFromFile, this._btnInsertFromUrl]
+            },
+            {
+                xtype: "tbspacer",
+                height: 2
+            }]
+        });
+        this.items = [{
+            xtype: "tbspacer",
+            height: 9
+        },
+        {
+            xtype: "label",
+            style: "font-weight: bold;margin-top: 1px;",
+            text: this.textSize
+        },
+        this._SizePanel, {
+            xtype: "tbspacer",
+            height: 5
+        },
+        {
+            xtype: "tbspacer",
+            width: "100%",
+            height: 10,
+            style: "padding-right: 10px;",
+            html: '<div style="width: 100%; height: 40%; border-bottom: 1px solid #C7C7C7"></div>'
+        },
+        {
+            xtype: "label",
+            style: "font-weight: bold;margin-top: 1px;",
+            text: this.textInsert
+        },
+        this._UrlPanel];
+        this.addEvents("editcomplete");
+        this.callParent(arguments);
+    },
+    setOriginalSize: function () {
+        if (this.api) {
+            var imgsize = this.api.asc_getOriginalImageSize();
+            if (imgsize) {
+                var w = imgsize.asc_getImageWidth();
+                var h = imgsize.asc_getImageHeight();
+                var properties = new Asc.asc_CImgProperty();
+                properties.asc_putWidth(w);
+                properties.asc_putHeight(h);
+                this.api.asc_setGraphicObjectProps(properties);
+            }
+            this.fireEvent("editcomplete", this);
+        }
+    },
+    setApi: function (api) {
+        if (api == undefined) {
+            return;
+        }
+        this.api = api;
+    },
+    ChangeSettings: function (props) {
+        if (this._initSettings) {
+            this.createDelayedElements();
+            this._initSettings = false;
+        }
+        if (props) {
+            this.SuspendEvents();
+            var value = props.asc_getWidth();
+            if (Math.abs(this._state.Width - value) > 0.001 || (this._state.Width === null || value === null) && (this._state.Width !== value)) {
+                this._spnWidth.setValue((value !== null) ? Common.MetricSettings.fnRecalcFromMM(value) : "");
+                this._state.Width = value;
+            }
+            value = props.asc_getHeight();
+            if (Math.abs(this._state.Height - value) > 0.001 || (this._state.Height === null || value === null) && (this._state.Height !== value)) {
+                this._spnHeight.setValue((value !== null) ? Common.MetricSettings.fnRecalcFromMM(value) : "");
+                this._state.Height = value;
+            }
+            this.ResumeEvents();
+            if (props.asc_getHeight() > 0) {
+                this._nRatio = props.asc_getWidth() / props.asc_getHeight();
+            }
+            this._btnOriginalSize.setDisabled(props.asc_getImageUrl() === null || props.asc_getImageUrl() === undefined);
+        }
+    },
+    _onOpenImageFromURL: function (mr) {
+        var self = this[0];
+        var url = this[1].txtUrl;
+        if (mr == 1 && self.api) {
+            var checkurl = url.value.replace(/ /g, "");
+            if (checkurl != "") {
+                var props = new Asc.asc_CImgProperty();
+                props.asc_putImageUrl(url.value);
+                self.api.asc_setGraphicObjectProps(props);
+            }
+        }
+    },
+    updateMetricUnit: function () {
+        var spinners = this.query("commonmetricspinner");
+        if (spinners) {
+            for (var i = 0; i < spinners.length; i++) {
+                var spinner = spinners[i];
+                spinner.setDefaultUnit(Common.MetricSettings.metricName[Common.MetricSettings.getCurrentMetric()]);
+                spinner.setStep(Common.MetricSettings.getCurrentMetric() == Common.MetricSettings.c_MetricUnits.cm ? 0.1 : 1);
+            }
+        }
+    },
+    createDelayedElements: function () {
+        this.updateMetricUnit();
+    },
+    textKeepRatio: "Constant Proportions",
+    textSize: "Size",
+    textWidth: "Width",
+    textHeight: "Height",
+    textOriginalSize: "Default Size",
+    textUrl: "Image URL",
+    textInsert: "Change Image",
+    textFromUrl: "From URL",
+    textFromFile: "From File",
+    txtTitle: "Picture"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/MainMenu.js

@@ -0,0 +1,358 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ var SCALE_MIN = 40;
+var SCALE_FULL = "100%";
+var SCALE_PART = 300;
+var MAINMENU_TOOLBAR_ID = "mainmenu-toolbar-id";
+var MAINMENU_PANEL_ID = "mainmenu-panel-id";
+var MAINMENU_FULL_PANEL_ID = "mainmenu-full-panel-id";
+Ext.define("SSE.view.MainMenu", {
+    extend: "Ext.panel.Panel",
+    alias: "widget.ssemainmenu",
+    requires: ["Ext.toolbar.Toolbar", "Ext.button.Button", "Ext.container.Container", "Ext.toolbar.Spacer"],
+    cls: "lm-style",
+    id: MAINMENU_PANEL_ID,
+    bodyCls: "lm-body",
+    width: SCALE_MIN,
+    layout: "card",
+    currentFullScaleMenuBtn: undefined,
+    fullScaledItemCnt: undefined,
+    buttonCollection: [],
+    constructor: function (config) {
+        this.initConfig(config);
+        this.callParent(arguments);
+        return this;
+    },
+    listeners: {
+        afterrender: function () {
+            var owner = this.ownerCt;
+            if (Ext.isDefined(owner)) {
+                owner.addListener("resize", Ext.bind(this.resizeMenu, this));
+            }
+        }
+    },
+    initComponent: function () {
+        this.items = [];
+        this.dockedItems = this.buildDockedItems();
+        this.addEvents("panelshow", "panelhide");
+        this.callParent(arguments);
+    },
+    buildDockedItems: function () {
+        var addedButtons = [],
+        item,
+        cardId,
+        config;
+        var me = this;
+        for (var i = 0; i < this.buttonCollection.length; i++) {
+            item = this.buttonCollection[i];
+            cardId = -1;
+            config = {
+                xtype: "button",
+                id: item.id,
+                itemScale: item.scale,
+                tooltip: item.tooltip,
+                disabled: item.disabled === true,
+                cls: "asc-main-menu-buttons",
+                iconCls: "asc-main-menu-btn " + item.cls,
+                style: "margin-bottom: 8px;"
+            };
+            if (item.scale == "modal") {
+                config.enableToggle = true;
+                config.listeners = item.listeners;
+                config.getApi = function () {
+                    return me.api;
+                };
+            } else {
+                config.isFullScale = item.scale == "full";
+                config.bodyItems = item.items;
+                config.toggleGroup = "tbMainMenu";
+                config.listeners = {
+                    click: function (btnCall) {
+                        if (btnCall.pressed) {
+                            me.openButtonMenu(btnCall);
+                        }
+                    },
+                    toggle: function (btnCall, pressed) {
+                        btnCall[pressed ? "addCls" : "removeCls"]("asc-main-menu-btn-selected");
+                        if (!pressed) {
+                            me.fireEvent("panelbeforehide");
+                            if (btnCall.isFullScale) {
+                                if (Ext.isDefined(me.fullScaledItemCnt) && me.fullScaledItemCnt.isVisible()) {
+                                    me.fullScaledItemCnt.hide();
+                                    me.currentFullScaleMenuBtn = undefined;
+                                }
+                                var panel = me.fullScaledItemCnt;
+                            } else {
+                                window.localStorage.setItem("sse-mainmenu-width", me.getWidth());
+                                panel = Ext.getCmp(btnCall.bodyCardId);
+                                me.setWidth(SCALE_MIN);
+                            }
+                            me.fireEvent("panelhide", panel, btnCall.isFullScale);
+                        }
+                    }
+                };
+            }
+            addedButtons.push(config);
+        }
+        this.mainToolbar = Ext.create("Ext.toolbar.Toolbar", {
+            cls: "lm-default-toolbar",
+            width: this.width || SCALE_MIN,
+            vertical: true,
+            dock: "left",
+            defaultType: "button",
+            items: addedButtons,
+            style: "padding-top:15px;",
+            listeners: {
+                afterrender: function (cmp) {
+                    cmp.getEl().on("keydown", me._onMenuKeyDown, me, {
+                        button: undefined
+                    });
+                }
+            }
+        });
+        return this.mainToolbar;
+    },
+    closeFullScaleMenu: function () {
+        if (Ext.isDefined(this.currentFullScaleMenuBtn)) {
+            this.currentFullScaleMenuBtn.toggle(false);
+        }
+    },
+    openButtonMenu: function (btn) {
+        this.fireEvent("panelbeforeshow", btn.isFullScale);
+        if (Ext.isNumber(btn.itemScale)) {
+            var saved_width = window.localStorage.getItem("sse-mainmenu-width");
+            saved_width = saved_width ? parseInt(saved_width) : btn.itemScale;
+            this.setSize({
+                width: saved_width
+            });
+        } else {
+            this.setWidth(btn.isFullScale ? SCALE_MIN : SCALE_PART);
+        }
+        if (btn.isFullScale) {
+            var ownerEl = this.ownerCt.el;
+            var startPos = ownerEl.getXY();
+            var panel = this.fullScaledItemCnt;
+            this.currentFullScaleMenuBtn = btn;
+            this.fullScaledItemCnt.setSize(ownerEl.getWidth() - SCALE_MIN, ownerEl.getHeight());
+            this.fullScaledItemCnt.setPosition(startPos[0] + this.width, startPos[1]);
+            this.fullScaledItemCnt.show();
+            this.fullScaledItemCnt.getLayout().setActiveItem(Ext.getCmp(btn.bodyCardId));
+        } else {
+            panel = Ext.getCmp(btn.bodyCardId);
+            this.getLayout().setActiveItem(btn.bodyCardId);
+        }
+        btn.removeCls("notify");
+        this.fireEvent("panelshow", panel, btn.isFullScale);
+        this.doComponentLayout();
+        Common.component.Analytics.trackEvent("Main Menu", btn.tooltip);
+    },
+    resizeMenu: function (Component, adjWidth, adjHeight, eOpts) {
+        if (Ext.isDefined(this.fullScaledItemCnt) && this.fullScaledItemCnt.isVisible()) {
+            var ownerEl = this.ownerCt.el;
+            var startPos = ownerEl.getXY();
+            this.fullScaledItemCnt.setSize(adjWidth - SCALE_MIN, adjHeight);
+            this.fullScaledItemCnt.setPosition(startPos[0] + this.width, startPos[1]);
+        } else {
+            for (var i = 0; i < this.items.length; i++) {
+                var h = this.items.items[i].getHeight();
+                if (adjHeight != h) {
+                    this.items.items[i].setHeight(adjHeight);
+                }
+            }
+        }
+        this.doComponentLayout();
+    },
+    setApi: function (o) {
+        this.api = o;
+        this.api.asc_registerCallback("asc_onCoAuthoringChatReceiveMessage", Ext.bind(this.onCoAuthoringChatReceiveMessage, this));
+        this.api.asc_registerCallback("asc_onСoAuthoringDisconnect", Ext.bind(this.onCoAuthoringDisconnect, this));
+        this.api.asc_registerCallback("asc_onGetLicense", Ext.bind(this.onGetLicense, this));
+        return this;
+    },
+    selectMenu: function (clsname) {
+        var btnCall, btn, i, panel;
+        var tbMain = this.mainToolbar;
+        for (i = tbMain.items.length; i > 0; i--) {
+            btnCall = tbMain.items.items[i - 1];
+            if (btnCall.iconCls && !(btnCall.iconCls.search(clsname) < 0)) {
+                break;
+            } else {
+                btnCall = undefined;
+            }
+        }
+        if (btnCall && !btnCall.pressed) {
+            if (Ext.isDefined(tbMain)) {
+                for (i = 0; i < tbMain.items.length; i++) {
+                    btn = tbMain.items.items[i];
+                    if (Ext.isDefined(btn) && btn.componentCls === "x-btn") {
+                        if (btn.id != btnCall.id && btn.pressed) {
+                            btn.toggle(false);
+                        }
+                    }
+                }
+            }
+            btnCall.toggle(true);
+            if (btnCall.itemScale != "modal") {
+                this.openButtonMenu(btnCall);
+            }
+        }
+    },
+    clearSelection: function (exclude) {
+        var btn, i;
+        var tbMain = this.mainToolbar;
+        if (Ext.isDefined(tbMain)) {
+            for (i = 0; i < tbMain.items.length; i++) {
+                btn = tbMain.items.items[i];
+                if (Ext.isDefined(btn) && btn.componentCls === "x-btn") {
+                    if (btn.pressed) {
+                        if (exclude) {
+                            if (typeof exclude == "object") {
+                                if (exclude.id == btn.id) {
+                                    continue;
+                                }
+                            } else {
+                                if (btn.iconCls && !(btn.iconCls.search(exclude) < 0)) {
+                                    continue;
+                                }
+                            }
+                        }
+                        btn.toggle(false);
+                    }
+                }
+            }
+        }
+    },
+    disableMenu: function (btns, disabled) {
+        var btn, i;
+        var tbMain = this.mainToolbar;
+        if (Ext.isDefined(tbMain)) {
+            var apply_all = false;
+            typeof btns == "string" && (btns == "all" ? apply_all = true : btns = [btns]);
+            for (i = 0; i < tbMain.items.length; i++) {
+                btn = tbMain.items.items[i];
+                if (Ext.isDefined(btn) && btn.componentCls === "x-btn") {
+                    if (apply_all || !(btns.indexOf(btn.id) < 0)) {
+                        btn.pressed && btn.toggle(false);
+                        btn.setDisabled(disabled);
+                    }
+                }
+            }
+        }
+    },
+    onCoAuthoringChatReceiveMessage: function (messages) {
+        var mainMenu = Ext.getCmp("view-main-menu");
+        if (mainMenu) {
+            var activeStep;
+            mainMenu.getLayout().getActiveItem() && (activeStep = mainMenu.getLayout().getActiveItem().down("container"));
+            var btnChat = Ext.getCmp("id-menu-chat");
+            if (btnChat) {
+                if (!activeStep || !activeStep.isXType("commonchatpanel") || activeStep.getWidth() < 1) {
+                    btnChat.addCls("notify");
+                }
+            }
+        }
+    },
+    onCoAuthoringDisconnect: function () {
+        this.disableMenu(["id-menu-comments", "id-menu-chat"], true);
+    },
+    onGetLicense: function (license) {
+        var panel = Ext.getCmp("main-menu-about");
+        if (panel) {
+            panel.setLicInfo(license);
+        }
+    },
+    createDelayedElements: function () {
+        var me = this;
+        this.hkEsc = new Ext.util.KeyMap(document, [{
+            key: Ext.EventObject.ESC,
+            fn: function (key, e) {
+                if (Ext.isDefined(me.currentFullScaleMenuBtn)) {
+                    e.stopPropagation();
+                    e.preventDefault();
+                    me.currentFullScaleMenuBtn.toggle(false);
+                }
+            }
+        }]);
+        var addedItems = [],
+        addedButtons = this.mainToolbar.items.items,
+        item;
+        for (var i = 0; i < this.buttonCollection.length; i++) {
+            item = this.buttonCollection[i];
+            if (item.scale == "modal") {} else {
+                if (item.scale != "full") {
+                    var cardPanel = Ext.create("Ext.container.Container", {
+                        items: item.items,
+                        menubutton: addedButtons[i],
+                        listeners: {
+                            afterrender: function (cmp) {
+                                cmp.getEl().on("keydown", me._onMenuKeyDown, me, {
+                                    button: cmp.menubutton
+                                });
+                            }
+                        }
+                    });
+                    addedButtons[i].bodyCardId = cardPanel.getId();
+                    addedItems.push(cardPanel);
+                } else {
+                    if (this.fullScaledItemCnt === undefined) {
+                        this.fullScaledItemCnt = Ext.create("Ext.container.Container", {
+                            id: MAINMENU_FULL_PANEL_ID,
+                            layout: "card",
+                            shadow: false,
+                            floating: true,
+                            toFrontOnShow: true,
+                            closeMenu: function () {
+                                me.closeFullScaleMenu();
+                            },
+                            getApi: function () {
+                                return me.api;
+                            }
+                        });
+                    }
+                    addedButtons[i].bodyCardId = item.items[0].id;
+                    this.fullScaledItemCnt.add(item.items);
+                }
+            }
+        }
+        me.api.asc_getLicense();
+        this.add(addedItems);
+    },
+    _onMenuKeyDown: function (event, target, opt) {
+        if (event.getKey() == event.ESC) {
+            if (opt.button) {
+                opt.button.toggle(false);
+            } else {
+                this.clearSelection();
+            }
+        }
+    }
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/MainSettingsGeneral.js

@@ -0,0 +1,353 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.MainSettingsGeneral", {
+    extend: "Ext.container.Container",
+    alias: "widget.ssemainsettingsgeneral",
+    cls: "sse-documentsettings-body",
+    requires: ["Ext.button.Button", "Ext.container.Container", "Ext.form.Label", "Ext.form.field.Checkbox", "Ext.util.Cookies"],
+    constructor: function (config) {
+        this.initConfig(config);
+        this.callParent(arguments);
+        return this;
+    },
+    initComponent: function () {
+        this._changedProps = {
+            zoomIdx: 5,
+            showchangesIdx: 1,
+            fontrenderIdx: 0,
+            unitIdx: 0,
+            saveVal: 600
+        };
+        this._oldUnit = undefined;
+        this.chLiveComment = Ext.create("Ext.form.field.Checkbox", {
+            id: "docsettings-live-comment",
+            checked: true,
+            boxLabel: this.strLiveComment,
+            width: 500
+        });
+        this._arrZoom = [[50, "50%"], [60, "60%"], [70, "70%"], [80, "80%"], [90, "90%"], [100, "100%"], [110, "110%"], [120, "120%"], [150, "150%"], [175, "175%"], [200, "200%"]];
+        this.cmbZoom = Ext.create("Ext.form.field.ComboBox", {
+            width: 90,
+            editable: false,
+            store: this._arrZoom,
+            mode: "local",
+            triggerAction: "all",
+            value: this._arrZoom[5][1],
+            listeners: {
+                select: Ext.bind(function (combo, records, eOpts) {
+                    this._changedProps.zoomIdx = records[0].index;
+                    combo.blur();
+                },
+                this)
+            }
+        });
+        this._arrFontRender = [[c_oAscFontRenderingModeType.hintingAndSubpixeling, this.txtWin], [c_oAscFontRenderingModeType.noHinting, this.txtMac], [c_oAscFontRenderingModeType.hinting, this.txtNative]];
+        this.cmbFontRender = Ext.create("Ext.form.field.ComboBox", {
+            id: "docsettings-font-render",
+            width: 150,
+            editable: false,
+            store: this._arrFontRender,
+            mode: "local",
+            triggerAction: "all",
+            value: this._arrFontRender[0][1],
+            listeners: {
+                select: Ext.bind(function (combo, records, eOpts) {
+                    this._changedProps.fontrenderIdx = records[0].index;
+                    combo.blur();
+                },
+                this)
+            }
+        });
+        this._arrUnit = [[Common.MetricSettings.c_MetricUnits.cm, this.txtCm], [Common.MetricSettings.c_MetricUnits.pt, this.txtPt]];
+        this.cmbUnit = Ext.create("Ext.form.field.ComboBox", {
+            id: "docsettings-combo-unit",
+            width: 150,
+            editable: false,
+            store: this._arrUnit,
+            mode: "local",
+            triggerAction: "all",
+            value: this._arrUnit[0][1],
+            listeners: {
+                select: Ext.bind(function (combo, records, eOpts) {
+                    this._changedProps.unitIdx = records[0].index;
+                    combo.blur();
+                },
+                this)
+            }
+        });
+        this._arrAutoSave = [[0, this.textDisabled], [60, this.textMinute], [300, this.text5Minutes], [600, this.text10Minutes], [1800, this.text30Minutes], [3600, this.text60Minutes]];
+        this.cmbAutoSave = Ext.create("Ext.form.field.ComboBox", {
+            id: "docsettings-combo-save",
+            width: 150,
+            editable: false,
+            store: this._arrAutoSave,
+            mode: "local",
+            triggerAction: "all",
+            value: this._arrAutoSave[3][1],
+            listeners: {
+                select: Ext.bind(function (combo, records, eOpts) {
+                    this._changedProps.saveVal = records[0].data.field1;
+                    combo.blur();
+                },
+                this)
+            }
+        });
+        this.btnOk = Ext.widget("button", {
+            cls: "asc-blue-button",
+            width: 90,
+            height: 22,
+            text: this.okButtonText,
+            listeners: {
+                click: function (btn) {
+                    this.applySettings();
+                },
+                scope: this
+            }
+        });
+        this.items = [{
+            xtype: "container",
+            layout: {
+                type: "table",
+                columns: 2,
+                tableAttrs: {
+                    style: "width: 100%;"
+                },
+                tdAttrs: {
+                    style: "padding: 5px 10px;"
+                }
+            },
+            height: "100%",
+            items: [{
+                xtype: "label",
+                cellCls: "doc-info-label-cell",
+                text: this.txtLiveComment,
+                style: "display: block;text-align: right; margin-bottom: 1px;",
+                width: "100%",
+                hideId: "element-coauthoring"
+            },
+            this.chLiveComment, {
+                xtype: "tbspacer",
+                hideId: "element-coauthoring"
+            },
+            {
+                xtype: "tbspacer"
+            },
+            {
+                xtype: "label",
+                cellCls: "doc-info-label-cell",
+                text: this.strZoom,
+                style: "display: block;text-align: right; margin-bottom: 5px;",
+                width: "100%"
+            },
+            this.cmbZoom, {
+                xtype: "tbspacer"
+            },
+            {
+                xtype: "tbspacer"
+            },
+            {
+                xtype: "label",
+                cellCls: "doc-info-label-cell",
+                text: this.strFontRender,
+                style: "display: block;text-align: right; margin-bottom: 5px;",
+                width: "100%"
+            },
+            this.cmbFontRender, {
+                xtype: "tbspacer",
+                hideId: "element-edit-mode"
+            },
+            {
+                xtype: "tbspacer"
+            },
+            {
+                xtype: "label",
+                cellCls: "doc-info-label-cell",
+                text: this.textAutoSave,
+                style: "display: block;text-align: right; margin-bottom: 5px;",
+                width: "100%",
+                hideId: "element-autosave"
+            },
+            this.cmbAutoSave, {
+                xtype: "tbspacer",
+                hideId: "element-autosave"
+            },
+            {
+                xtype: "tbspacer"
+            },
+            {
+                xtype: "label",
+                cellCls: "doc-info-label-cell",
+                text: this.strUnit,
+                style: "display: block;text-align: right; margin-bottom: 5px;",
+                width: "100%",
+                hideId: "element-edit-mode"
+            },
+            this.cmbUnit, {
+                xtype: "tbspacer",
+                height: 10
+            },
+            {
+                xtype: "tbspacer",
+                height: 10
+            },
+            {
+                xtype: "tbspacer"
+            },
+            this.btnOk]
+        }];
+        this.addEvents("savedocsettings");
+        this.addEvents("changemeasureunit");
+        this.callParent(arguments);
+    },
+    setApi: function (o) {
+        this.api = o;
+    },
+    applySettings: function () {
+        window.localStorage.setItem("sse-settings-livecomment", this.chLiveComment.getValue() ? 1 : 0);
+        window.localStorage.setItem("sse-settings-zoom", this._arrZoom[this._changedProps.zoomIdx][0]);
+        window.localStorage.setItem("sse-settings-fontrender", this._arrFontRender[this._changedProps.fontrenderIdx][0]);
+        window.localStorage.setItem("sse-settings-unit", this._arrUnit[this._changedProps.unitIdx][0]);
+        window.localStorage.setItem("sse-settings-autosave", this._changedProps.saveVal);
+        Common.component.Analytics.trackEvent("File Menu", "SaveSettings");
+        this.fireEvent("savedocsettings", this);
+        if (this._oldUnit !== this._arrUnit[this._changedProps.unitIdx][0]) {
+            this.fireEvent("changemeasureunit", this);
+        }
+    },
+    updateSettings: function () {
+        value = window.localStorage.getItem("sse-settings-livecomment");
+        this.chLiveComment.setValue(!(value !== null && parseInt(value) == 0));
+        var value = window.localStorage.getItem("sse-settings-zoom");
+        this._changedProps.zoomIdx = 5;
+        if (value !== null) {
+            for (var i = 0; i < this._arrZoom.length; i++) {
+                if (this._arrZoom[i][0] == parseInt(value)) {
+                    this._changedProps.zoomIdx = i;
+                    break;
+                }
+            }
+        }
+        this.cmbZoom.setValue(this._arrZoom[this._changedProps.zoomIdx][1]);
+        value = window.localStorage.getItem("sse-settings-fontrender");
+        if (value !== null) {
+            value = parseInt(value);
+        } else {
+            value = window.devicePixelRatio > 1 ? c_oAscFontRenderingModeType.noHinting : c_oAscFontRenderingModeType.hintingAndSubpixeling;
+        }
+        for (i = 0; i < this._arrFontRender.length; i++) {
+            if (this._arrFontRender[i][0] == value) {
+                this._changedProps.fontrenderIdx = i;
+                break;
+            }
+        }
+        this.cmbFontRender.setValue(this._arrFontRender[this._changedProps.fontrenderIdx][1]);
+        value = window.localStorage.getItem("sse-settings-unit");
+        this._changedProps.unitIdx = 0;
+        if (value !== null) {
+            for (i = 0; i < this._arrUnit.length; i++) {
+                if (this._arrUnit[i][0] == parseInt(value)) {
+                    this._changedProps.unitIdx = i;
+                    break;
+                }
+            }
+        }
+        this.cmbUnit.setValue(this._arrUnit[this._changedProps.unitIdx][1]);
+        this._oldUnit = this._arrUnit[this._changedProps.unitIdx][0];
+        value = window.localStorage.getItem("sse-settings-autosave");
+        value = (value !== null) ? parseInt(value) : 600;
+        this._changedProps.saveVal = 600;
+        var idx = 3;
+        for (i = 0; i < this._arrAutoSave.length; i++) {
+            if (this._arrAutoSave[i][0] == value) {
+                this._changedProps.saveVal = value;
+                idx = i;
+                break;
+            }
+        }
+        this.cmbAutoSave.setValue(this._arrAutoSave[idx][1]);
+        this._ShowHideDocSettings("element-autosave", this.mode.isEdit && (this.mode.canAutosave > -1));
+    },
+    _ShowHideSettingsItem: function (cmp, visible) {
+        var tr = cmp.getEl().up("tr");
+        if (tr) {
+            tr.setDisplayed(visible);
+        }
+    },
+    _ShowHideDocSettings: function (id, visible) {
+        if (!this.rendered) {
+            return;
+        }
+        var components = Ext.ComponentQuery.query('[hideId="' + id + '"]', this);
+        for (var i = 0; i < components.length; i++) {
+            this._ShowHideSettingsItem(components[i], visible);
+        }
+    },
+    setMode: function (mode) {
+        this.mode = mode;
+        if (this.mode.canAutosave > -1) {
+            var idx = 0;
+            for (idx = 1; idx < this._arrAutoSave.length; idx++) {
+                if (this.mode.canAutosave < this._arrAutoSave[idx][0]) {
+                    break;
+                }
+            }
+        }
+        var arr = [];
+        arr = this._arrAutoSave.slice(idx, this._arrAutoSave.length);
+        arr.unshift(this._arrAutoSave[0]);
+        if (arr.length > 0) {
+            this.cmbAutoSave.getStore().loadData(arr);
+        }
+    },
+    strLiveComment: "Turn on live commenting option",
+    txtLiveComment: "Live Commenting",
+    strInputMode: "Turn on hieroglyphs",
+    strZoom: "Default Zoom Value",
+    strShowChanges: "Realtime Collaboration Changes",
+    txtAll: "View All",
+    txtLast: "View Last",
+    okButtonText: "Apply",
+    txtWin: "as Windows",
+    txtMac: "as OS X",
+    txtNative: "Native",
+    strFontRender: "Font Hinting",
+    strUnit: "Unit of Measurement",
+    txtCm: "Centimeter",
+    txtPt: "Point",
+    textDisabled: "Disabled",
+    textMinute: "Every Minute",
+    text5Minutes: "Every 5 Minutes",
+    text10Minutes: "Every 10 Minutes",
+    text30Minutes: "Every 30 Minutes",
+    text60Minutes: "Every Hour",
+    textAutoSave: "Autosave"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/MainSettingsPrint.js

@@ -0,0 +1,366 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.MainSettingsPrint", {
+    extend: "Ext.container.Container",
+    alias: "widget.ssemainsettingsprint",
+    cls: "sse-documentsettings-body",
+    requires: ["Ext.button.Button", "Ext.container.Container", "Ext.form.Label", "Common.component.IndeterminateCheckBox"],
+    listeners: {
+        show: function (cmp, eOpts) {}
+    },
+    height: "100%",
+    initComponent: function () {
+        var me = this;
+        this.cmbSheet = Ext.create("Ext.form.field.ComboBox", {
+            id: "advsettings-print-combo-sheets",
+            width: 260,
+            editable: false,
+            store: Ext.create("Ext.data.Store", {
+                fields: ["sheetname", {
+                    type: "int",
+                    name: "sheetindex"
+                }],
+                data: [{
+                    sheetname: me.strAllSheets,
+                    sheetindex: -255
+                }]
+            }),
+            queryMode: "local",
+            displayField: "sheetname",
+            valueField: "sheetindex",
+            triggerAction: "all"
+        });
+        this.cmbPaperSize = Ext.widget("combo", {
+            width: 260,
+            store: Ext.create("Ext.data.Store", {
+                fields: ["description", "size"],
+                data: [{
+                    size: "215.9|279.4",
+                    description: "US Letter (21,59cm x 27,94cm)"
+                },
+                {
+                    size: "215.9|355.6",
+                    description: "US Legal (21,59cm x 35,56cm)"
+                },
+                {
+                    size: "210|297",
+                    description: "A4 (21cm x 29,7cm)"
+                },
+                {
+                    size: "148.1|209.9",
+                    description: "A5 (14,81cm x 20,99cm)"
+                },
+                {
+                    size: "176|250.1",
+                    description: "B5 (17,6cm x 25,01cm)"
+                },
+                {
+                    size: "104.8|241.3",
+                    description: "Envelope #10 (10,48cm x 24,13cm)"
+                },
+                {
+                    size: "110.1|220.1",
+                    description: "Envelope DL (11,01cm x 22,01cm)"
+                },
+                {
+                    size: "279.4|431.7",
+                    description: "Tabloid (27,94cm x 43,17cm)"
+                },
+                {
+                    size: "297|420.1",
+                    description: "A3 (29,7cm x 42,01cm)"
+                },
+                {
+                    size: "304.8|457.1",
+                    description: "Tabloid Oversize (30,48cm x 45,71cm)"
+                },
+                {
+                    size: "196.8|273",
+                    description: "ROC 16K (19,68cm x 27,3cm)"
+                },
+                {
+                    size: "119.9|234.9",
+                    description: "Envelope Choukei 3 (11,99cm x 23,49cm)"
+                },
+                {
+                    size: "330.2|482.5",
+                    description: "Super B/A3 (33,02cm x 48,25cm)"
+                }]
+            }),
+            displayField: "description",
+            valueField: "size",
+            queryMode: "local",
+            editable: false
+        });
+        this.cmbPaperOrientation = Ext.widget("combo", {
+            store: Ext.create("Ext.data.Store", {
+                fields: ["description", "orient"],
+                data: [{
+                    description: me.strPortrait,
+                    orient: c_oAscPageOrientation.PagePortrait
+                },
+                {
+                    description: me.strLandscape,
+                    orient: c_oAscPageOrientation.PageLandscape
+                }]
+            }),
+            displayField: "description",
+            valueField: "orient",
+            queryMode: "local",
+            editable: false,
+            width: 200
+        });
+        this.chPrintGrid = Ext.widget("cmdindeterminatecheckbox", {
+            boxLabel: this.textPrintGrid,
+            width: 500
+        });
+        this.chPrintRows = Ext.widget("cmdindeterminatecheckbox", {
+            boxLabel: this.textPrintHeadings,
+            width: 500
+        });
+        this.spnMarginLeft = Ext.create("Common.component.MetricSpinner", {
+            readOnly: false,
+            maxValue: 48.25,
+            minValue: 0,
+            step: 0.1,
+            defaultUnit: "cm",
+            value: "0.19 cm",
+            listeners: {}
+        });
+        this.spnMarginRight = Ext.create("Common.component.MetricSpinner", {
+            readOnly: false,
+            maxValue: 48.25,
+            minValue: 0,
+            step: 0.1,
+            defaultUnit: "cm",
+            value: "0.19 cm",
+            listeners: {}
+        });
+        this.spnMarginTop = Ext.create("Common.component.MetricSpinner", {
+            readOnly: false,
+            maxValue: 48.25,
+            minValue: 0,
+            step: 0.1,
+            defaultUnit: "cm",
+            value: "0 cm",
+            listeners: {}
+        });
+        this.spnMarginBottom = Ext.create("Common.component.MetricSpinner", {
+            readOnly: false,
+            maxValue: 48.25,
+            minValue: 0,
+            step: 0.1,
+            defaultUnit: "cm",
+            value: "0 cm",
+            listeners: {}
+        });
+        this.btnOk = Ext.widget("button", {
+            id: "advsettings-print-button-save",
+            cls: "asc-blue-button",
+            width: 90,
+            height: 22,
+            text: this.okButtonText
+        });
+        this.items = [{
+            xtype: "container",
+            layout: {
+                type: "table",
+                columns: 2,
+                tableAttrs: {
+                    style: "width: 100%;"
+                },
+                tdAttrs: {
+                    style: "padding: 10px 10px;"
+                }
+            },
+            items: [{
+                xtype: "label",
+                cellCls: "doc-info-label-cell",
+                text: me.textSettings,
+                style: "display: block;text-align: right; margin-bottom: 5px;",
+                width: "100%"
+            },
+            this.cmbSheet, {
+                xtype: "tbspacer",
+                height: 5
+            },
+            {
+                xtype: "tbspacer",
+                height: 5
+            },
+            {
+                xtype: "label",
+                cellCls: "doc-info-label-cell",
+                text: me.textPageSize,
+                style: "display: block;text-align: right; margin-bottom: 5px;",
+                width: "100%"
+            },
+            this.cmbPaperSize, {
+                xtype: "label",
+                cellCls: "doc-info-label-cell",
+                text: me.textPageOrientation,
+                style: "display: block;text-align: right; margin-bottom: 5px;",
+                width: "100%"
+            },
+            this.cmbPaperOrientation, {
+                xtype: "label",
+                cellCls: "doc-info-label-cell label-align-top",
+                text: me.strMargins,
+                style: "display: block;text-align: right;",
+                width: "100%"
+            },
+            this.cntMargins = Ext.widget("container", {
+                height: 100,
+                width: 200,
+                layout: {
+                    type: "hbox"
+                },
+                defaults: {
+                    xtype: "container",
+                    layout: {
+                        type: "vbox",
+                        align: "stretch"
+                    },
+                    height: 100
+                },
+                items: [{
+                    flex: 1,
+                    items: [{
+                        xtype: "label",
+                        width: "100%",
+                        text: me.strTop
+                    },
+                    {
+                        xtype: "tbspacer",
+                        height: 3
+                    },
+                    this.spnMarginTop, {
+                        xtype: "tbspacer",
+                        height: 12
+                    },
+                    {
+                        xtype: "label",
+                        width: "100%",
+                        text: me.strLeft
+                    },
+                    {
+                        xtype: "tbspacer",
+                        height: 3
+                    },
+                    this.spnMarginLeft]
+                },
+                {
+                    xtype: "tbspacer",
+                    width: 20
+                },
+                {
+                    flex: 1,
+                    items: [{
+                        xtype: "label",
+                        text: me.strBottom,
+                        width: "100%"
+                    },
+                    {
+                        xtype: "tbspacer",
+                        height: 3
+                    },
+                    this.spnMarginBottom, {
+                        xtype: "tbspacer",
+                        height: 12
+                    },
+                    {
+                        xtype: "label",
+                        text: me.strRight,
+                        width: "100%"
+                    },
+                    {
+                        xtype: "tbspacer",
+                        height: 3
+                    },
+                    this.spnMarginRight]
+                }]
+            }), {
+                xtype: "label",
+                cellCls: "doc-info-label-cell label-align-top",
+                text: me.strPrint,
+                style: "display: block;text-align: right; margin-top: 4px;",
+                width: "100%"
+            },
+            this.cntAdditional = Ext.widget("container", {
+                height: 45,
+                width: 500,
+                layout: {
+                    type: "vbox",
+                    align: "stretch"
+                },
+                items: [this.chPrintGrid, this.chPrintRows]
+            }), {
+                xtype: "tbspacer"
+            },
+            {
+                xtype: "tbspacer"
+            },
+            {
+                xtype: "tbspacer"
+            },
+            this.btnOk]
+        }];
+        this.addEvents("savedocsettings");
+        this.callParent(arguments);
+    },
+    applySettings: function () {},
+    setMode: function (mode) {},
+    updateMetricUnit: function () {
+        var spinners = this.query("commonmetricspinner");
+        if (spinners) {
+            for (var i = 0; i < spinners.length; i++) {
+                var spinner = spinners[i];
+                spinner.setDefaultUnit(Common.MetricSettings.metricName[Common.MetricSettings.getCurrentMetric()]);
+                spinner.setStep(Common.MetricSettings.getCurrentMetric() == Common.MetricSettings.c_MetricUnits.cm ? 0.1 : 1);
+            }
+        }
+    },
+    okButtonText: "Save",
+    strPortrait: "Portrait",
+    strLandscape: "Landscape",
+    textPrintGrid: "Print Gridlines",
+    textPrintHeadings: "Print Rows and Columns Headings",
+    strLeft: "Left",
+    strRight: "Right",
+    strTop: "Top",
+    strBottom: "Bottom",
+    strMargins: "Margins",
+    textPageSize: "Page Size",
+    textPageOrientation: "Page Orientation",
+    strPrint: "Print",
+    textSettings: "Settings for"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/OpenDialog.js

@@ -0,0 +1,274 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.OpenDialog", {
+    extend: "Ext.window.Window",
+    alias: "widget.sseopendialog",
+    requires: ["Ext.window.Window", "Common.plugin.ComboBoxScrollPane"],
+    modal: true,
+    closable: false,
+    resizable: false,
+    height: 218,
+    width: 250,
+    padding: "15px 0 0 0",
+    layout: {
+        type: "vbox",
+        align: "stretch"
+    },
+    cls: "csv-open-dialog",
+    initComponent: function () {
+        this.title = this.title || this.txtTitle;
+        var encodedata = [];
+        if (this.codepages) {
+            encodedata = [];
+            for (var i = 0; i < this.codepages.length; i++) {
+                var codepage = this.codepages[i];
+                var c = [];
+                c[0] = codepage.asc_getCodePage();
+                c[1] = codepage.asc_getCodePageName();
+                encodedata.push(c);
+            }
+        } else {
+            encodedata = [[37, "IBM EBCDIC (US-Canada)"], [437, "OEM United States"], [500, "IBM EBCDIC (International)"], [708, "Arabic (ASMO 708)"], [720, "Arabic (DOS)"], [737, "Greek (DOS)"], [775, "Baltic (DOS)"], [850, "Western European (DOS)"], [852, "Central European (DOS)"], [855, "OEM Cyrillic"], [857, "Turkish (DOS)"], [858, "OEM Multilingual Latin I"], [860, "Portuguese (DOS)"], [861, "Icelandic (DOS)"], [862, "Hebrew (DOS)"], [863, "French Canadian (DOS)"], [864, "Arabic (864) "], [865, "Nordic (DOS)"], [866, "Cyrillic (DOS)"], [869, "Greek, Modern (DOS)"], [870, "IBM EBCDIC (Multilingual Latin-2)"], [874, "Thai (Windows)"], [875, "IBM EBCDIC (Greek Modern)"], [932, "Japanese (Shift-JIS)"], [936, "Chinese Simplified (GB2312)"], [949, "Korean"], [950, "Chinese Traditional (Big5)"], [1026, "IBM EBCDIC (Turkish Latin-5)"], [1047, "IBM Latin-1"], [1140, "IBM EBCDIC (US-Canada-Euro)"], [1141, "IBM EBCDIC (Germany-Euro)"], [1142, "IBM EBCDIC (Denmark-Norway-Euro)"], [1143, "IBM EBCDIC (Finland-Sweden-Euro)"], [1144, "IBM EBCDIC (Italy-Euro)"], [1145, "IBM EBCDIC (Spain-Euro)"], [1146, "IBM EBCDIC (UK-Euro)"], [1147, "IBM EBCDIC (France-Euro)"], [1148, "IBM EBCDIC (International-Euro)"], [1149, "IBM EBCDIC (Icelandic-Euro)"], [1200, "Unicode"], [1201, "Unicode (Big-Endian)"], [1250, "Central European (Windows)"], [1251, "Cyrillic (Windows)"], [1252, "Western European (Windows)"], [1253, "Greek (Windows)"], [1254, "Turkish (Windows)"], [1255, "Hebrew (Windows) "], [1256, "Arabic (Windows) "], [1257, "Baltic (Windows)"], [1258, "Vietnamese (Windows)"], [1361, "Korean (Johab)"], [10000, "Western European (Mac)"], [10001, "Japanese (Mac)"], [10002, "Chinese Traditional (Mac)"], [10003, "Korean (Mac)"], [10004, "Arabic (Mac) "], [10005, "Hebrew (Mac)"], [10006, "Greek (Mac) "], [10007, "Cyrillic (Mac)"], [10008, "Chinese Simplified (Mac)"], [10010, "Romanian (Mac)"], [10017, "Ukrainian (Mac)"], [10021, "Thai (Mac)"], [10029, "Central European (Mac) "], [10079, "Icelandic (Mac)"], [10081, "Turkish (Mac)"], [10082, "Croatian (Mac)"], [12000, "Unicode (UTF-32)"], [12001, "Unicode (UTF-32 Big-Endian)"], [20000, "Chinese Traditional (CNS)"], [20001, "TCA Taiwan"], [20002, "Chinese Traditional (Eten)"], [20003, "IBM5550 Taiwan"], [20004, "TeleText Taiwan"], [20005, "Wang Taiwan"], [20105, "Western European (IA5)"], [20106, "German (IA5)"], [20107, "Swedish (IA5) "], [20108, "Norwegian (IA5) "], [20127, "US-ASCII"], [20261, "T.61 "], [20269, "ISO-6937"], [20273, "IBM EBCDIC (Germany)"], [20277, "IBM EBCDIC (Denmark-Norway) "], [20278, "IBM EBCDIC (Finland-Sweden)"], [20280, "IBM EBCDIC (Italy)"], [20284, "IBM EBCDIC (Spain)"], [20285, "IBM EBCDIC (UK)"], [20290, "IBM EBCDIC (Japanese katakana)"], [20297, "IBM EBCDIC (France)"], [20420, "IBM EBCDIC (Arabic)"], [20423, "IBM EBCDIC (Greek)"], [20424, "IBM EBCDIC (Hebrew)"], [20833, "IBM EBCDIC (Korean Extended)"], [20838, "IBM EBCDIC (Thai)"], [20866, "Cyrillic (KOI8-R)"], [20871, "IBM EBCDIC (Icelandic) "], [20880, "IBM EBCDIC (Cyrillic Russian)"], [20905, "IBM EBCDIC (Turkish)"], [20924, "IBM Latin-1 "], [20932, "Japanese (JIS 0208-1990 and 0212-1990)"], [20936, "Chinese Simplified (GB2312-80) "], [20949, "Korean Wansung "], [21025, "IBM EBCDIC (Cyrillic Serbian-Bulgarian)"], [21866, "Cyrillic (KOI8-U)"], [28591, "Western European (ISO) "], [28592, "Central European (ISO)"], [28593, "Latin 3 (ISO)"], [28594, "Baltic (ISO)"], [28595, "Cyrillic (ISO) "], [28596, "Arabic (ISO)"], [28597, "Greek (ISO) "], [28598, "Hebrew (ISO-Visual)"], [28599, "Turkish (ISO)"], [28603, "Estonian (ISO)"], [28605, "Latin 9 (ISO)"], [29001, "Europa"], [38598, "Hebrew (ISO-Logical)"], [50220, "Japanese (JIS)"], [50221, "Japanese (JIS-Allow 1 byte Kana) "], [50222, "Japanese (JIS-Allow 1 byte Kana - SO/SI)"], [50225, "Korean (ISO)"], [50227, "Chinese Simplified (ISO-2022)"], [51932, "Japanese (EUC)"], [51936, "Chinese Simplified (EUC) "], [51949, "Korean (EUC)"], [52936, "Chinese Simplified (HZ)"], [54936, "Chinese Simplified (GB18030)"], [57002, "ISCII Devanagari "], [57003, "ISCII Bengali "], [57004, "ISCII Tamil"], [57005, "ISCII Telugu "], [57006, "ISCII Assamese "], [57007, "ISCII Oriya"], [57008, "ISCII Kannada"], [57009, "ISCII Malayalam "], [57010, "ISCII Gujarati"], [57011, "ISCII Punjabi"], [65000, "Unicode (UTF-7)"], [65001, "Unicode (UTF-8)"]];
+        }
+        var encodestore = Ext.create("Ext.data.ArrayStore", {
+            autoDestroy: true,
+            storeId: "encodeStore",
+            idIndex: 0,
+            fields: [{
+                name: "value",
+                type: "int"
+            },
+            {
+                name: "name",
+                type: "string"
+            }],
+            data: encodedata
+        });
+        this.cmbEncoding = Ext.create("Ext.form.field.ComboBox", {
+            store: encodestore,
+            displayField: "name",
+            queryMode: "local",
+            typeAhead: false,
+            editable: false,
+            listeners: {
+                keydown: this._handleKeyDown,
+                select: function (combo, records, eOpts) {
+                    this.encoding = records[0].data.value;
+                },
+                scope: this
+            },
+            enableKeyEvents: true,
+            plugins: [{
+                pluginId: "scrollpane",
+                ptype: "comboboxscrollpane",
+                settings: {
+                    enableKeyboardNavigation: true
+                }
+            }]
+        });
+        this.cmbEncoding.select(encodestore.getAt(0));
+        this.encoding = encodestore.getAt(0).data.value;
+        var delimiterstore = Ext.create("Ext.data.ArrayStore", {
+            autoDestroy: true,
+            storeId: "delimiterStore",
+            idIndex: 0,
+            fields: [{
+                name: "value",
+                type: "int"
+            },
+            {
+                name: "description",
+                type: "string"
+            }],
+            data: [[4, ","], [2, ";"], [3, ":"], [1, this.txtTab], [5, this.txtSpace]]
+        });
+        this.cmbDelimiter = Ext.create("Ext.form.field.ComboBox", {
+            width: 70,
+            store: delimiterstore,
+            displayField: "description",
+            queryMode: "local",
+            typeAhead: false,
+            editable: false,
+            listeners: {
+                select: function (combo, records, eOpts) {
+                    this.delimiter = records[0].data.value;
+                },
+                scope: this
+            }
+        });
+        this.cmbDelimiter.select(delimiterstore.getAt(0));
+        this.delimiter = delimiterstore.getAt(0).data.value;
+        this.items = [{
+            xtype: "container",
+            layout: {
+                type: "vbox",
+                align: "stretch"
+            },
+            padding: "0 20px 0 20px",
+            height: 46,
+            width: 210,
+            items: [{
+                xtype: "label",
+                text: this.txtEncoding,
+                style: "font-weight: bold;margin:0 0 4px 0;"
+            },
+            this.cmbEncoding]
+        },
+        {
+            xtype: "tbspacer",
+            height: 10
+        },
+        {
+            xtype: "container",
+            layout: {
+                type: "vbox",
+                align: "left"
+            },
+            padding: "0 20px 0 20px",
+            height: 46,
+            width: 210,
+            items: [{
+                xtype: "label",
+                text: this.txtDelimiter,
+                style: "font-weight: bold;margin:0 0 4px 0;"
+            },
+            this.cmbDelimiter]
+        },
+        {
+            xtype: "tbspacer",
+            height: 10
+        },
+        {
+            xtype: "tbspacer",
+            height: 8,
+            html: '<div style="width: 100%; height: 40%; border-bottom: 1px solid #C7C7C7"></div>'
+        },
+        {
+            xtype: "container",
+            height: 40,
+            layout: {
+                type: "vbox",
+                align: "center",
+                pack: "center"
+            },
+            items: [{
+                xtype: "container",
+                width: 86,
+                height: 24,
+                layout: {
+                    type: "hbox",
+                    align: "middle"
+                },
+                items: [this.btnOk = Ext.widget("button", {
+                    cls: "asc-blue-button",
+                    width: 86,
+                    height: 22,
+                    margin: "0 5px 0 0",
+                    text: this.okButtonText,
+                    listeners: {
+                        click: function (btn) {
+                            this.fireEvent("onmodalresult", this, 1, {
+                                encoding: this.encoding,
+                                delimiter: this.delimiter
+                            });
+                            this.close();
+                        },
+                        scope: this
+                    }
+                })]
+            }]
+        }];
+        this.callParent(arguments);
+    },
+    setSettings: function (s) {
+        var index = this.cmbEncoding.getStore().find("value", s.asc_getCodePage ? s.asc_getCodePage() : s.encoding);
+        if (! (index < 0)) {
+            this.cmbEncoding.select(this.cmbEncoding.getStore().getAt(index));
+            this.encoding = s.asc_getCodePage();
+        }
+        index = this.cmbDelimiter.getStore().find("value", s.asc_getDelimiter ? s.asc_getDelimiter() : s.delimiter);
+        if (! (index < 0)) {
+            this.cmbDelimiter.select(this.cmbDelimiter.getStore().getAt(index));
+            this.delimiter = s.asc_getDelimiter();
+        }
+    },
+    scrollViewToNode: function (dataview, node) {
+        if (dataview && node) {
+            var plugin = dataview.getPlugin("scrollpane");
+            if (plugin) {
+                var doScroll = new Ext.util.DelayedTask(function () {
+                    plugin.scrollToElement(node, false, true);
+                });
+                doScroll.delay(100);
+            }
+        }
+    },
+    _handleKeyDown: function (combo, event) {
+        if (event.ctrlKey || event.altKey) {
+            return;
+        }
+        var charcode = String.fromCharCode(event.getCharCode());
+        if (/[A-Z0-9]/.test(charcode)) {
+            if ((new Date().getTime()) - combo.lastsearchtime > 3000) {
+                combo.lastsearchquery = "";
+            }
+            var str = combo.lastsearchquery + charcode;
+            var index = combo.getStore().find("name", str, combo.lastsearchindex);
+            if (index < 0) {
+                str = charcode;
+                index = combo.getStore().find("name", str, combo.lastsearchindex);
+                if (index < 0) {
+                    index = combo.getStore().find("name", str, 0);
+                }
+            }
+            combo.lastsearchtime = new Date().getTime();
+            if (! (index < 0)) {
+                var item = combo.getStore().getAt(index);
+                var node = combo.getPicker().getNode(item);
+                combo.select(item);
+                this.scrollViewToNode(combo, node);
+                combo.lastsearchquery = str;
+                combo.lastsearchindex = ++index < combo.getStore().getCount() ? index : 0;
+            } else {
+                combo.lastsearchquery = "";
+                combo.lastsearchindex = 0;
+            }
+        }
+    },
+    cancelButtonText: "Cancel",
+    okButtonText: "Ok",
+    txtEncoding: "Encoding ",
+    txtDelimiter: "Delimiter",
+    txtTab: "Tab",
+    txtSpace: "Space",
+    txtTitle: "Choose CSV options"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/ParagraphSettings.js

@@ -0,0 +1,441 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ var c_paragraphLinerule = {
+    LINERULE_LEAST: 0,
+    LINERULE_AUTO: 1,
+    LINERULE_EXACT: 2
+};
+Ext.define("SSE.view.ParagraphSettings", {
+    extend: "Common.view.AbstractSettingsPanel",
+    alias: "widget.sseparagraphsettings",
+    height: 176,
+    requires: ["Ext.DomHelper", "Ext.button.Button", "Ext.form.Label", "Ext.container.Container", "Ext.toolbar.Spacer", "Common.component.MetricSpinner", "Ext.form.field.ComboBox", "SSE.view.ParagraphSettingsAdvanced"],
+    constructor: function (config) {
+        this.callParent(arguments);
+        this.initConfig(config);
+        return this;
+    },
+    setApi: function (o) {
+        this.api = o;
+        this.api.asc_registerCallback("asc_onParaSpacingLine", Ext.bind(this._onLineSpacing, this));
+    },
+    initComponent: function () {
+        this.title = this.txtTitle;
+        this._initSettings = true;
+        this._state = {
+            LineRuleIdx: 1,
+            LineHeight: 1.5,
+            LineSpacingBefore: 0,
+            LineSpacingAfter: 0.35
+        };
+        this._arrLineRule = [this.textAtLeast, this.textAuto, this.textExact];
+        this._arrLineDefaults = [[5, "cm", 0.03, 0.01], [1, "", 0.5, 0.01], [5, "cm", 0.03, 0.01]];
+        this.cmbLineRule = Ext.create("Ext.form.field.ComboBox", {
+            id: "table-combo-line-rule",
+            width: 85,
+            editable: false,
+            store: this._arrLineRule,
+            mode: "local",
+            triggerAction: "all",
+            listeners: {
+                select: Ext.bind(function (combo, records, eOpts) {
+                    if (this.api) {
+                        this.api.asc_putPrLineSpacing(records[0].index, this._arrLineDefaults[records[0].index][0]);
+                    }
+                    this.numLineHeight.setDefaultUnit(this._arrLineDefaults[records[0].index][1]);
+                    this.numLineHeight.setMinValue(this._arrLineDefaults[records[0].index][2]);
+                    this.numLineHeight.setStep(this._arrLineDefaults[records[0].index][3]);
+                    this.fireEvent("editcomplete", this);
+                },
+                this)
+            }
+        });
+        this.cmbLineRule.setValue(this._arrLineRule[1]);
+        this.controls.push(this.cmbLineRule);
+        this.numLineHeight = Ext.widget("commonmetricspinner", {
+            id: "paragraph-spin-line-height",
+            readOnly: false,
+            step: 0.01,
+            width: 85,
+            value: "1.5",
+            defaultUnit: "",
+            maxValue: 132,
+            minValue: 0,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    if (this.cmbLineRule.getValue() == "") {
+                        return;
+                    }
+                    var type = c_paragraphLinerule.LINERULE_AUTO;
+                    for (var i = 0; i < this._arrLineRule.length; i++) {
+                        if (this.cmbLineRule.getValue() == this._arrLineRule[i]) {
+                            type = i;
+                            break;
+                        }
+                    }
+                    if (this.api) {
+                        this.api.asc_putPrLineSpacing(type, (type == c_paragraphLinerule.LINERULE_AUTO) ? field.getNumberValue() : Common.MetricSettings.fnRecalcToMM(field.getNumberValue()));
+                    }
+                    this.fireEvent("editcomplete", this);
+                },
+                this)
+            }
+        });
+        this.controls.push(this.numLineHeight);
+        this.numSpacingBefore = Ext.create("Common.component.MetricSpinner", {
+            id: "paragraph-spin-spacing-before",
+            readOnly: false,
+            step: 0.1,
+            width: 85,
+            defaultUnit: "cm",
+            value: "0 cm",
+            maxValue: 55.88,
+            minValue: 0,
+            allowAuto: true,
+            autoText: this.txtAutoText,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    if (this.api) {
+                        var num = field.getNumberValue();
+                        if (num < 0) {
+                            this.api.asc_putLineSpacingBeforeAfter(0, -1);
+                        } else {
+                            this.api.asc_putLineSpacingBeforeAfter(0, Common.MetricSettings.fnRecalcToMM(field.getNumberValue()));
+                        }
+                    }
+                    this.fireEvent("editcomplete", this);
+                },
+                this)
+            }
+        });
+        this.controls.push(this.numSpacingBefore);
+        this.numSpacingAfter = Ext.create("Common.component.MetricSpinner", {
+            id: "paragraph-spin-spacing-after",
+            readOnly: false,
+            step: 0.1,
+            width: 85,
+            defaultUnit: "cm",
+            value: "0.35 cm",
+            maxValue: 55.88,
+            minValue: 0,
+            allowAuto: true,
+            autoText: this.txtAutoText,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    if (this.api) {
+                        var num = field.getNumberValue();
+                        if (num < 0) {
+                            this.api.asc_putLineSpacingBeforeAfter(1, -1);
+                        } else {
+                            this.api.asc_putLineSpacingBeforeAfter(1, Common.MetricSettings.fnRecalcToMM(field.getNumberValue()));
+                        }
+                    }
+                    this.fireEvent("editcomplete", this);
+                },
+                this)
+            }
+        });
+        this.controls.push(this.numSpacingAfter);
+        this._SpacingPanel = Ext.create("Ext.container.Container", {
+            layout: "vbox",
+            layoutConfig: {
+                align: "stretch"
+            },
+            height: 107,
+            width: 190,
+            items: [{
+                xtype: "tbspacer",
+                height: 8
+            },
+            {
+                xtype: "container",
+                height: 41,
+                layout: {
+                    type: "table",
+                    columns: 2,
+                    tdAttrs: {
+                        style: "padding-right: 8px;vertical-align: middle;"
+                    }
+                },
+                items: [{
+                    xtype: "label",
+                    text: this.strLineHeight,
+                    style: "display: block;",
+                    width: 85
+                },
+                {
+                    xtype: "label",
+                    text: this.textAt,
+                    style: "display: block;",
+                    width: 85
+                },
+                {
+                    xtype: "tbspacer",
+                    height: 2
+                },
+                {
+                    xtype: "tbspacer",
+                    height: 2
+                },
+                this.cmbLineRule, this.numLineHeight]
+            },
+            {
+                xtype: "tbspacer",
+                height: 10
+            },
+            {
+                xtype: "container",
+                layout: {
+                    type: "table",
+                    columns: 2,
+                    tdAttrs: {
+                        style: "padding-right: 8px;"
+                    }
+                },
+                defaults: {
+                    xtype: "container",
+                    layout: "vbox",
+                    layoutConfig: {
+                        align: "stretch"
+                    },
+                    height: 48,
+                    style: "float:left;"
+                },
+                items: [{
+                    items: [{
+                        xtype: "label",
+                        text: this.strSpacingBefore,
+                        width: 85
+                    },
+                    {
+                        xtype: "tbspacer",
+                        height: 3
+                    },
+                    this.numSpacingBefore]
+                },
+                {
+                    items: [{
+                        xtype: "label",
+                        text: this.strSpacingAfter,
+                        width: 85
+                    },
+                    {
+                        xtype: "tbspacer",
+                        height: 3
+                    },
+                    this.numSpacingAfter]
+                }]
+            }]
+        });
+        this.items = [{
+            xtype: "tbspacer",
+            height: 9
+        },
+        {
+            xtype: "label",
+            style: "font-weight: bold;margin-top: 1px;",
+            text: this.strParagraphSpacing
+        },
+        this._SpacingPanel, {
+            xtype: "tbspacer",
+            height: 3
+        },
+        {
+            xtype: "tbspacer",
+            width: "100%",
+            height: 10,
+            style: "padding-right: 10px;",
+            html: '<div style="width: 100%; height: 40%; border-bottom: 1px solid #C7C7C7"></div>'
+        },
+        {
+            xtype: "tbspacer",
+            height: 3
+        },
+        {
+            xtype: "container",
+            height: 20,
+            width: "100%",
+            items: [{
+                xtype: "box",
+                html: '<div style="width:100%;text-align:center;padding-right:15px;"><label id="paragraph-advanced-link" class="asc-advanced-link">' + this.textAdvanced + "</label></div>",
+                listeners: {
+                    afterrender: function (cmp) {
+                        document.getElementById("paragraph-advanced-link").onclick = Ext.bind(this._openAdvancedSettings, this);
+                    },
+                    scope: this
+                }
+            }]
+        }];
+        this.addEvents("editcomplete");
+        this.callParent(arguments);
+    },
+    _onLineSpacing: function (value) {
+        var linerule = value.asc_getLineRule();
+        var line = value.asc_getLine();
+        this.numLineHeight.suspendEvents(false);
+        this.cmbLineRule.suspendEvents(false);
+        if (this._state.LineRuleIdx !== linerule) {
+            this.cmbLineRule.setValue((linerule !== null) ? this._arrLineRule[linerule] : "");
+            this.numLineHeight.setMinValue(this._arrLineDefaults[(linerule !== null) ? linerule : 1][2]);
+            this.numLineHeight.setDefaultUnit(this._arrLineDefaults[(linerule !== null) ? linerule : 1][1]);
+            this.numLineHeight.setStep(this._arrLineDefaults[(linerule !== null) ? linerule : 1][3]);
+            this._state.LineRuleIdx = linerule;
+        }
+        if (Math.abs(this._state.LineHeight - line) > 0.001 || (this._state.LineHeight === null || line === null) && (this._state.LineHeight !== line)) {
+            var val = "";
+            if (linerule == c_paragraphLinerule.LINERULE_AUTO) {
+                val = line;
+            } else {
+                if (linerule !== null && line !== null) {
+                    val = Common.MetricSettings.fnRecalcFromMM(line);
+                }
+            }
+            this.numLineHeight.setValue((val !== null) ? val : "");
+            this._state.LineHeight = line;
+        }
+        this.numLineHeight.resumeEvents();
+        this.cmbLineRule.resumeEvents();
+    },
+    ChangeSettings: function (prop) {
+        if (this._initSettings) {
+            this.createDelayedElements();
+            this._initSettings = false;
+        }
+        if (prop) {
+            this.SuspendEvents();
+            var Spacing = {
+                Line: prop.asc_getSpacing().asc_getLine(),
+                Before: prop.asc_getSpacing().asc_getBefore(),
+                After: prop.asc_getSpacing().asc_getAfter(),
+                LineRule: prop.asc_getSpacing().asc_getLineRule()
+            };
+            if (this._state.LineRuleIdx !== Spacing.LineRule) {
+                this.cmbLineRule.setValue((Spacing.LineRule !== null) ? this._arrLineRule[Spacing.LineRule] : "");
+                this.numLineHeight.setMinValue(this._arrLineDefaults[(Spacing.LineRule !== null) ? Spacing.LineRule : 1][2]);
+                this.numLineHeight.setDefaultUnit(this._arrLineDefaults[(Spacing.LineRule !== null) ? Spacing.LineRule : 1][1]);
+                this.numLineHeight.setStep(this._arrLineDefaults[(Spacing.LineRule !== null) ? Spacing.LineRule : 1][3]);
+                this._state.LineRuleIdx = Spacing.LineRule;
+            }
+            if (Math.abs(this._state.LineHeight - Spacing.Line) > 0.001 || (this._state.LineHeight === null || Spacing.Line === null) && (this._state.LineHeight !== Spacing.Line)) {
+                var val = "";
+                if (Spacing.LineRule == c_paragraphLinerule.LINERULE_AUTO) {
+                    val = Spacing.Line;
+                } else {
+                    if (Spacing.LineRule !== null && Spacing.Line !== null) {
+                        val = Common.MetricSettings.fnRecalcFromMM(Spacing.Line);
+                    }
+                }
+                this.numLineHeight.setValue((val !== null) ? val : "");
+                this._state.LineHeight = Spacing.Line;
+            }
+            if (Math.abs(this._state.LineSpacingBefore - Spacing.Before) > 0.001 || (this._state.LineSpacingBefore === null || Spacing.Before === null) && (this._state.LineSpacingBefore !== Spacing.Before)) {
+                this.numSpacingBefore.setValue((Spacing.Before !== null) ? ((Spacing.Before < 0) ? Spacing.Before : Common.MetricSettings.fnRecalcFromMM(Spacing.Before)) : "");
+                this._state.LineSpacingBefore = Spacing.Before;
+            }
+            if (Math.abs(this._state.LineSpacingAfter - Spacing.After) > 0.001 || (this._state.LineSpacingAfter === null || Spacing.After === null) && (this._state.LineSpacingAfter !== Spacing.After)) {
+                this.numSpacingAfter.setValue((Spacing.After !== null) ? ((Spacing.After < 0) ? Spacing.After : Common.MetricSettings.fnRecalcFromMM(Spacing.After)) : "");
+                this._state.LineSpacingAfter = Spacing.After;
+            }
+            this.ResumeEvents();
+        }
+    },
+    updateMetricUnit: function () {
+        var spinners = this.query("commonmetricspinner");
+        if (spinners) {
+            for (var i = 0; i < spinners.length; i++) {
+                var spinner = spinners[i];
+                if (spinner.id == "paragraph-spin-line-height") {
+                    continue;
+                }
+                spinner.setDefaultUnit(Common.MetricSettings.metricName[Common.MetricSettings.getCurrentMetric()]);
+                spinner.setStep(Common.MetricSettings.getCurrentMetric() == Common.MetricSettings.c_MetricUnits.cm ? 0.01 : 1);
+            }
+        }
+        this._arrLineDefaults[2][1] = this._arrLineDefaults[0][1] = Common.MetricSettings.metricName[Common.MetricSettings.getCurrentMetric()];
+        this._arrLineDefaults[2][2] = this._arrLineDefaults[0][2] = parseFloat(Common.MetricSettings.fnRecalcFromMM(0.3).toFixed(2));
+        this._arrLineDefaults[2][3] = this._arrLineDefaults[0][3] = (Common.MetricSettings.getCurrentMetric() == Common.MetricSettings.c_MetricUnits.cm) ? 0.01 : 1;
+        if (this._state.LineRuleIdx !== null) {
+            this.numLineHeight.setDefaultUnit(this._arrLineDefaults[this._state.LineRuleIdx][1]);
+            this.numLineHeight.setStep(this._arrLineDefaults[this._state.LineRuleIdx][3]);
+        }
+    },
+    _openAdvancedSettings: function (e) {
+        var me = this;
+        var win;
+        if (me.api) {
+            var selectedElements = me.api.asc_getGraphicObjectProps();
+            if (selectedElements && Ext.isArray(selectedElements)) {
+                var elType, elValue;
+                for (var i = selectedElements.length - 1; i >= 0; i--) {
+                    elType = selectedElements[i].asc_getObjectType();
+                    elValue = selectedElements[i].asc_getObjectValue();
+                    if (c_oAscTypeSelectElement.Paragraph == elType) {
+                        win = Ext.create("SSE.view.ParagraphSettingsAdvanced");
+                        win.updateMetricUnit();
+                        win.setSettings({
+                            paragraphProps: elValue,
+                            api: me.api
+                        });
+                        break;
+                    }
+                }
+            }
+        }
+        if (win) {
+            win.addListener("onmodalresult", Ext.bind(function (o, mr, s) {
+                if (mr == 1 && s) {
+                    me.api.asc_setGraphicObjectProps(s.paragraphProps);
+                }
+            },
+            this), false);
+            win.addListener("close", function () {
+                me.fireEvent("editcomplete", me);
+            },
+            false);
+            win.show();
+        }
+    },
+    createDelayedElements: function () {
+        this.updateMetricUnit();
+    },
+    strParagraphSpacing: "Spacing",
+    strLineHeight: "Line Spacing",
+    strSpacingBefore: "Before",
+    strSpacingAfter: "After",
+    textAuto: "Multiple",
+    textAtLeast: "At least",
+    textExact: "Exactly",
+    textAt: "At",
+    txtTitle: "Paragraph",
+    txtAutoText: "Auto",
+    textAdvanced: "Show advanced settings"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/ParagraphSettingsAdvanced.js

@@ -0,0 +1,964 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.ParagraphSettingsAdvanced", {
+    extend: "Ext.window.Window",
+    alias: "widget.sseparagraphsettingsadvanced",
+    requires: ["Ext.Array", "Ext.form.field.ComboBox", "Ext.window.Window", "Common.component.ThemeColorPalette", "Common.component.MetricSpinner", "Common.component.IndeterminateCheckBox", "Common.plugin.GridScrollPane", "Ext.grid.Panel"],
+    cls: "asc-advanced-settings-window",
+    modal: true,
+    resizable: false,
+    plain: true,
+    constrain: true,
+    height: 390,
+    width: 516,
+    layout: {
+        type: "vbox",
+        align: "stretch"
+    },
+    initComponent: function () {
+        var me = this;
+        this.addEvents("onmodalresult");
+        this._changedProps = null;
+        this.checkGroup = 0;
+        this._noApply = true;
+        this._tabListChanged = false;
+        this.numFirstLine = Ext.create("Common.component.MetricSpinner", {
+            id: "paragraphadv-spin-first-line",
+            readOnly: false,
+            step: 0.1,
+            width: 85,
+            defaultUnit: "cm",
+            value: "0 cm",
+            maxValue: 55.87,
+            minValue: -55.87,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    if (this._changedProps) {
+                        if (this._changedProps.asc_getInd() === null || this._changedProps.asc_getInd() === undefined) {
+                            this._changedProps.asc_putInd(new Asc.asc_CParagraphInd());
+                        }
+                        this._changedProps.asc_getInd().asc_putFirstLine(Common.MetricSettings.fnRecalcToMM(field.getNumberValue()));
+                    }
+                },
+                this)
+            }
+        });
+        this.numIndentsLeft = Ext.widget("commonmetricspinner", {
+            id: "paragraphadv-spin-indent-left",
+            readOnly: false,
+            step: 0.1,
+            width: 85,
+            defaultUnit: "cm",
+            value: "0 cm",
+            maxValue: 55.87,
+            minValue: -55.87,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    if (this._changedProps) {
+                        if (this._changedProps.asc_getInd() === null || this._changedProps.asc_getInd() === undefined) {
+                            this._changedProps.asc_putInd(new Asc.asc_CParagraphInd());
+                        }
+                        this._changedProps.asc_getInd().asc_putLeft(Common.MetricSettings.fnRecalcToMM(field.getNumberValue()));
+                    }
+                },
+                this)
+            }
+        });
+        this.numIndentsRight = Ext.widget("commonmetricspinner", {
+            id: "paragraphadv-spin-indent-right",
+            readOnly: false,
+            step: 0.1,
+            width: 85,
+            defaultUnit: "cm",
+            value: "0 cm",
+            maxValue: 55.87,
+            minValue: -55.87,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    if (this._changedProps) {
+                        if (this._changedProps.asc_getInd() === null || this._changedProps.asc_getInd() === undefined) {
+                            this._changedProps.asc_putInd(new Asc.asc_CParagraphInd());
+                        }
+                        this._changedProps.asc_getInd().asc_putRight(Common.MetricSettings.fnRecalcToMM(field.getNumberValue()));
+                    }
+                },
+                this)
+            }
+        });
+        this._spacer = Ext.create("Ext.toolbar.Spacer", {
+            width: "100%",
+            height: 10,
+            html: '<div style="width: 100%; height: 40%; border-bottom: 1px solid #C7C7C7"></div>'
+        });
+        this.chStrike = Ext.create("Common.component.IndeterminateCheckBox", {
+            id: "paragraphadv-checkbox-strike",
+            width: 140,
+            boxLabel: this.strStrike,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    if (this._changedProps && this.checkGroup != 1) {
+                        this._changedProps.asc_putStrikeout(field.getValue() == "checked");
+                    }
+                    this.checkGroup = 0;
+                    if (field.getValue() == "checked") {
+                        this.checkGroup = 1;
+                        this.chDoubleStrike.setValue(0);
+                        if (this._changedProps) {
+                            this._changedProps.asc_putDStrikeout(false);
+                        }
+                        this.checkGroup = 0;
+                    }
+                    if (this.api && !this._noApply) {
+                        var properties = (this._originalProps) ? this._originalProps : new Asc.asc_CParagraphProperty();
+                        properties.asc_putStrikeout(field.getValue() == "checked");
+                        properties.asc_putDStrikeout(this.chDoubleStrike.getValue() == "checked");
+                        this.api.asc_setDrawImagePlaceParagraph("paragraphadv-font-img", properties);
+                    }
+                },
+                this)
+            }
+        });
+        this.chDoubleStrike = Ext.create("Common.component.IndeterminateCheckBox", {
+            id: "paragraphadv-checkbox-double-strike",
+            width: 140,
+            boxLabel: this.strDoubleStrike,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    if (this._changedProps && this.checkGroup != 1) {
+                        this._changedProps.asc_putDStrikeout(field.getValue() == "checked");
+                    }
+                    this.checkGroup = 0;
+                    if (field.getValue() == "checked") {
+                        this.checkGroup = 1;
+                        this.chStrike.setValue(0);
+                        if (this._changedProps) {
+                            this._changedProps.asc_putStrikeout(false);
+                        }
+                        this.checkGroup = 0;
+                    }
+                    if (this.api && !this._noApply) {
+                        var properties = (this._originalProps) ? this._originalProps : new Asc.asc_CParagraphProperty();
+                        properties.asc_putDStrikeout(field.getValue() == "checked");
+                        properties.asc_putStrikeout(this.chStrike.getValue() == "checked");
+                        this.api.asc_setDrawImagePlaceParagraph("paragraphadv-font-img", properties);
+                    }
+                },
+                this)
+            }
+        });
+        this.chSuperscript = Ext.create("Common.component.IndeterminateCheckBox", {
+            id: "paragraphadv-checkbox-superscript",
+            width: 140,
+            boxLabel: this.strSuperscript,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    if (this._changedProps && this.checkGroup != 2) {
+                        this._changedProps.asc_putSuperscript(field.getValue() == "checked");
+                    }
+                    this.checkGroup = 0;
+                    if (field.getValue() == "checked") {
+                        this.checkGroup = 2;
+                        this.chSubscript.setValue(0);
+                        if (this._changedProps) {
+                            this._changedProps.asc_putSubscript(false);
+                        }
+                        this.checkGroup = 0;
+                    }
+                    if (this.api && !this._noApply) {
+                        var properties = (this._originalProps) ? this._originalProps : new Asc.asc_CParagraphProperty();
+                        properties.asc_putSuperscript(field.getValue() == "checked");
+                        properties.asc_putSubscript(this.chSubscript.getValue() == "checked");
+                        this.api.asc_setDrawImagePlaceParagraph("paragraphadv-font-img", properties);
+                    }
+                },
+                this)
+            }
+        });
+        this.chSubscript = Ext.create("Common.component.IndeterminateCheckBox", {
+            id: "paragraphadv-checkbox-subscript",
+            width: 140,
+            boxLabel: this.strSubscript,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    if (this._changedProps && this.checkGroup != 2) {
+                        this._changedProps.asc_putSubscript(field.getValue() == "checked");
+                    }
+                    this.checkGroup = 0;
+                    if (field.getValue() == "checked") {
+                        this.checkGroup = 2;
+                        this.chSuperscript.setValue(0);
+                        if (this._changedProps) {
+                            this._changedProps.asc_putSuperscript(false);
+                        }
+                        this.checkGroup = 0;
+                    }
+                    if (this.api && !this._noApply) {
+                        var properties = (this._originalProps) ? this._originalProps : new Asc.asc_CParagraphProperty();
+                        properties.asc_putSubscript(field.getValue() == "checked");
+                        properties.asc_putSuperscript(this.chSuperscript.getValue() == "checked");
+                        this.api.asc_setDrawImagePlaceParagraph("paragraphadv-font-img", properties);
+                    }
+                },
+                this)
+            }
+        });
+        this.chSmallCaps = Ext.create("Common.component.IndeterminateCheckBox", {
+            id: "paragraphadv-checkbox-small-caps",
+            width: 140,
+            boxLabel: this.strSmallCaps,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    if (this._changedProps && this.checkGroup != 3) {
+                        this._changedProps.asc_putSmallCaps(field.getValue() == "checked");
+                    }
+                    this.checkGroup = 0;
+                    if (field.getValue() == "checked") {
+                        this.checkGroup = 3;
+                        this.chAllCaps.setValue(0);
+                        if (this._changedProps) {
+                            this._changedProps.asc_putAllCaps(false);
+                        }
+                        this.checkGroup = 0;
+                    }
+                    if (this.api && !this._noApply) {
+                        var properties = (this._originalProps) ? this._originalProps : new Asc.asc_CParagraphProperty();
+                        properties.asc_putSmallCaps(field.getValue() == "checked");
+                        properties.asc_putAllCaps(this.chAllCaps.getValue() == "checked");
+                        this.api.asc_setDrawImagePlaceParagraph("paragraphadv-font-img", properties);
+                    }
+                },
+                this)
+            }
+        });
+        this.chAllCaps = Ext.create("Common.component.IndeterminateCheckBox", {
+            id: "paragraphadv-checkbox-all-caps",
+            width: 140,
+            boxLabel: this.strAllCaps,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    if (this._changedProps && this.checkGroup != 3) {
+                        this._changedProps.asc_putAllCaps(field.getValue() == "checked");
+                    }
+                    this.checkGroup = 0;
+                    if (field.getValue() == "checked") {
+                        this.checkGroup = 3;
+                        this.chSmallCaps.setValue(0);
+                        if (this._changedProps) {
+                            this._changedProps.asc_putSmallCaps(false);
+                        }
+                        this.checkGroup = 0;
+                    }
+                    if (this.api && !this._noApply) {
+                        var properties = (this._originalProps) ? this._originalProps : new Asc.asc_CParagraphProperty();
+                        properties.asc_putAllCaps(field.getValue() == "checked");
+                        properties.asc_putSmallCaps(this.chSmallCaps.getValue() == "checked");
+                        this.api.asc_setDrawImagePlaceParagraph("paragraphadv-font-img", properties);
+                    }
+                },
+                this)
+            }
+        });
+        this.numSpacing = Ext.create("Common.component.MetricSpinner", {
+            id: "paragraphadv-spin-spacing",
+            readOnly: false,
+            step: 0.01,
+            width: 100,
+            defaultUnit: "cm",
+            value: "0 cm",
+            maxValue: 55.87,
+            minValue: -55.87,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    if (this._changedProps) {
+                        this._changedProps.asc_putTextSpacing(Common.MetricSettings.fnRecalcToMM(field.getNumberValue()));
+                    }
+                    if (this.api && !this._noApply) {
+                        var properties = (this._originalProps) ? this._originalProps : new Asc.asc_CParagraphProperty();
+                        properties.asc_putTextSpacing(Common.MetricSettings.fnRecalcToMM(field.getNumberValue()));
+                        this.api.asc_setDrawImagePlaceParagraph("paragraphadv-font-img", properties);
+                    }
+                },
+                this)
+            }
+        });
+        this.fontImage = Ext.create("Ext.container.Container", {
+            id: "paragraphadv-font-img",
+            width: "100%",
+            height: 80,
+            style: "background-color:#ffffff; border:1px solid #CDCDCD;"
+        });
+        this.numTab = Ext.widget("commonmetricspinner", {
+            id: "paragraphadv-spin-tab",
+            readOnly: false,
+            step: 0.1,
+            width: 180,
+            defaultUnit: "cm",
+            value: "1.25 cm",
+            maxValue: 55.87,
+            minValue: 0
+        });
+        this.numDefaultTab = Ext.widget("commonmetricspinner", {
+            id: "paragraphadv-spin-default-tab",
+            readOnly: false,
+            step: 0.1,
+            width: 107,
+            defaultUnit: "cm",
+            value: "1.25 cm",
+            maxValue: 55.87,
+            minValue: 0,
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {
+                    if (this._changedProps) {
+                        this._changedProps.asc_putDefaultTab(Common.MetricSettings.fnRecalcToMM(field.getNumberValue()));
+                    }
+                },
+                this)
+            }
+        });
+        this.btnAddTab = Ext.create("Ext.Button", {
+            width: 90,
+            text: this.textSet,
+            enableToggle: false,
+            listeners: {
+                click: Ext.bind(function (btn, eOpts) {
+                    var val = this.numTab.getNumberValue();
+                    var align = this.radioLeft.getValue() ? 1 : (this.radioCenter.getValue() ? 3 : 2);
+                    var idx = fieldStore.findBy(function (record, id) {
+                        return (Math.abs(record.data.tabPos - val) < 0.001);
+                    },
+                    this);
+                    if (idx < 0) {
+                        var rec = fieldStore.add({
+                            tabPos: this.numTab.getNumberValue(),
+                            tabStr: this.numTab.getNumberValue() + " " + Common.MetricSettings.metricName[Common.MetricSettings.getCurrentMetric()],
+                            tabAlign: align
+                        });
+                        fieldStore.sort();
+                        this.tabList.getSelectionModel().select(rec);
+                    } else {
+                        var rec = fieldStore.getAt(idx);
+                        rec.set("tabAlign", align);
+                    }
+                },
+                this)
+            }
+        });
+        this.btnRemoveTab = Ext.create("Ext.Button", {
+            width: 90,
+            text: this.textRemove,
+            enableToggle: false,
+            listeners: {
+                click: Ext.bind(function (btn, eOpts) {
+                    var rec = this.tabList.getSelectionModel().getSelection();
+                    if (rec.length > 0) {
+                        var idx = rec[0].index;
+                        fieldStore.remove(rec);
+                        if (idx > fieldStore.count() - 1) {
+                            idx = fieldStore.count() - 1;
+                        }
+                        if (idx > -1) {
+                            this.tabList.getSelectionModel().select(idx);
+                        }
+                    }
+                },
+                this)
+            }
+        });
+        this.btnRemoveAll = Ext.create("Ext.Button", {
+            width: 90,
+            text: this.textRemoveAll,
+            enableToggle: false,
+            listeners: {
+                click: Ext.bind(function (btn, eOpts) {
+                    fieldStore.removeAll();
+                },
+                this)
+            }
+        });
+        this.radioLeft = Ext.create("Ext.form.field.Radio", {
+            boxLabel: this.textTabLeft,
+            name: "asc-radio-tab",
+            checked: true
+        });
+        this.radioCenter = Ext.create("Ext.form.field.Radio", {
+            boxLabel: this.textTabCenter,
+            name: "asc-radio-tab",
+            checked: false
+        });
+        this.radioRight = Ext.create("Ext.form.field.Radio", {
+            boxLabel: this.textTabRight,
+            name: "asc-radio-tab",
+            checked: false
+        });
+        Ext.define("SSE.model.TabDataModel", {
+            extend: "Ext.data.Model",
+            fields: [{
+                name: "tabPos",
+                name: "tabStr",
+                name: "tabAlign"
+            }]
+        });
+        var fieldStore = Ext.create("Ext.data.Store", {
+            model: "SSE.model.TabDataModel",
+            data: [],
+            sorters: ["tabPos"],
+            listeners: {
+                datachanged: Ext.bind(function (btn, eOpts) {
+                    if (!this._noApply) {
+                        this._tabListChanged = true;
+                    }
+                },
+                this),
+                update: Ext.bind(function (btn, eOpts) {
+                    if (!this._noApply) {
+                        this._tabListChanged = true;
+                    }
+                },
+                this),
+                clear: Ext.bind(function (btn, eOpts) {
+                    if (!this._noApply) {
+                        this._tabListChanged = true;
+                    }
+                },
+                this)
+            }
+        });
+        this.tabList = Ext.create("Ext.grid.Panel", {
+            activeItem: 0,
+            id: "paragraphadv-tab-list",
+            store: fieldStore,
+            mode: "local",
+            scroll: false,
+            columns: [{
+                flex: 1,
+                dataIndex: "tabStr"
+            }],
+            height: 80,
+            width: 180,
+            hideHeaders: true,
+            viewConfig: {
+                stripeRows: false
+            },
+            plugins: [{
+                pluginId: "scrollpane",
+                ptype: "gridscrollpane"
+            }],
+            listeners: {
+                select: function (o, record, index, eOpts) {
+                    this.numTab.setValue(record.data.tabPos);
+                    (record.data.tabAlign == 1) ? this.radioLeft.setValue(true) : ((record.data.tabAlign == 3) ? this.radioCenter.setValue(true) : this.radioRight.setValue(true));
+                },
+                scope: this
+            }
+        });
+        this.btnIndents = Ext.widget("button", {
+            width: 160,
+            height: 27,
+            cls: "asc-dialogmenu-btn",
+            text: this.strParagraphIndents,
+            textAlign: "right",
+            enableToggle: true,
+            allowDepress: false,
+            toggleGroup: "advtablecardGroup",
+            pressed: true,
+            listeners: {
+                click: function (btn) {
+                    if (btn.pressed) {
+                        this.mainCard.getLayout().setActiveItem("card-indents");
+                    }
+                },
+                scope: this
+            }
+        });
+        this.btnFont = Ext.widget("button", {
+            width: 160,
+            height: 27,
+            cls: "asc-dialogmenu-btn",
+            text: this.strParagraphFont,
+            textAlign: "right",
+            enableToggle: true,
+            allowDepress: false,
+            toggleGroup: "advtablecardGroup",
+            listeners: {
+                click: function (btn) {
+                    if (btn.pressed) {
+                        this.mainCard.getLayout().setActiveItem("card-font");
+                    }
+                },
+                scope: this
+            }
+        });
+        this.btnTabs = Ext.widget("button", {
+            width: 160,
+            height: 27,
+            cls: "asc-dialogmenu-btn",
+            textAlign: "right",
+            text: this.strTabs,
+            enableToggle: true,
+            allowDepress: false,
+            toggleGroup: "advtablecardGroup",
+            listeners: {
+                click: function (btn) {
+                    if (btn.pressed) {
+                        this.mainCard.getLayout().setActiveItem("card-tabs");
+                        this.tabList.getPlugin("scrollpane").updateScrollPane();
+                    }
+                },
+                scope: this
+            }
+        });
+        this._IndentsContainer = {
+            xtype: "container",
+            itemId: "card-indents",
+            width: 330,
+            layout: {
+                type: "vbox",
+                align: "stretch"
+            },
+            items: [{
+                xtype: "container",
+                padding: "0 10",
+                layout: {
+                    type: "table",
+                    columns: 5
+                },
+                defaults: {
+                    xtype: "container",
+                    layout: "vbox",
+                    layoutConfig: {
+                        align: "stretch"
+                    },
+                    height: 40,
+                    style: "float:left;"
+                },
+                items: [{
+                    items: [{
+                        xtype: "label",
+                        text: this.strIndentsFirstLine,
+                        width: 85
+                    },
+                    {
+                        xtype: "tbspacer",
+                        height: 3
+                    },
+                    this.numFirstLine]
+                },
+                {
+                    xtype: "tbspacer",
+                    width: 23,
+                    height: 3
+                },
+                {
+                    items: [{
+                        xtype: "label",
+                        text: this.strIndentsLeftText,
+                        width: 85
+                    },
+                    {
+                        xtype: "tbspacer",
+                        height: 3
+                    },
+                    this.numIndentsLeft]
+                },
+                {
+                    xtype: "tbspacer",
+                    width: 23,
+                    height: 3
+                },
+                {
+                    items: [{
+                        xtype: "label",
+                        text: this.strIndentsRightText,
+                        width: 85
+                    },
+                    {
+                        xtype: "tbspacer",
+                        height: 3
+                    },
+                    this.numIndentsRight]
+                }]
+            }]
+        };
+        this._FontContainer = {
+            xtype: "container",
+            itemId: "card-font",
+            width: 330,
+            layout: {
+                type: "vbox",
+                align: "stretch"
+            },
+            items: [{
+                xtype: "label",
+                style: "font-weight: bold;margin-top: 1px; padding-left:10px;height:13px;",
+                text: this.textEffects
+            },
+            {
+                xtype: "tbspacer",
+                height: 8
+            },
+            {
+                xtype: "container",
+                height: 85,
+                width: "100%",
+                padding: "0 10",
+                layout: {
+                    type: "table",
+                    columns: 3,
+                    tdAttrs: {
+                        style: "vertical-align: middle;"
+                    }
+                },
+                items: [this.chStrike, {
+                    xtype: "tbspacer",
+                    width: 20,
+                    height: 2
+                },
+                this.chSubscript, this.chDoubleStrike, {
+                    xtype: "tbspacer",
+                    width: 20,
+                    height: 2
+                },
+                this.chSmallCaps, this.chSuperscript, {
+                    xtype: "tbspacer",
+                    width: 20,
+                    height: 2
+                },
+                this.chAllCaps]
+            },
+            {
+                xtype: "label",
+                style: "font-weight: bold;margin-top: 1px; padding-left:10px;height:13px;",
+                text: this.textCharacterSpacing
+            },
+            {
+                xtype: "tbspacer",
+                height: 8
+            },
+            {
+                xtype: "container",
+                height: 26,
+                padding: "0 10",
+                layout: {
+                    type: "vbox",
+                    align: "left"
+                },
+                items: [this.numSpacing]
+            },
+            {
+                xtype: "tbspacer",
+                height: 10
+            },
+            {
+                xtype: "container",
+                height: 85,
+                padding: "0 10",
+                items: [this.fontImage]
+            }]
+        };
+        this._TabsContainer = {
+            xtype: "container",
+            itemId: "card-tabs",
+            width: 330,
+            layout: {
+                type: "vbox",
+                align: "stretch"
+            },
+            items: [{
+                xtype: "container",
+                padding: "0 0 0 10",
+                layout: {
+                    type: "table",
+                    columns: 3,
+                    tdAttrs: {
+                        style: "padding-right: 7px;"
+                    }
+                },
+                defaults: {
+                    xtype: "container",
+                    layout: "vbox",
+                    layoutConfig: {
+                        align: "stretch"
+                    },
+                    style: "float:left;"
+                },
+                items: [{
+                    height: 50,
+                    colspan: 2,
+                    items: [{
+                        xtype: "label",
+                        text: this.textTabPosition,
+                        width: 85
+                    },
+                    {
+                        xtype: "tbspacer",
+                        height: 3
+                    },
+                    this.numTab]
+                },
+                {
+                    height: 50,
+                    items: [{
+                        xtype: "label",
+                        text: this.textDefault,
+                        width: 107
+                    },
+                    {
+                        xtype: "tbspacer",
+                        height: 3
+                    },
+                    this.numDefaultTab]
+                },
+                {
+                    height: 95,
+                    colspan: 3,
+                    items: [this.tabList]
+                },
+                {
+                    height: 100,
+                    colspan: 3,
+                    items: [{
+                        xtype: "label",
+                        text: this.textAlign,
+                        width: 85
+                    },
+                    {
+                        xtype: "tbspacer",
+                        height: 3
+                    },
+                    this.radioLeft, this.radioCenter, this.radioRight]
+                },
+                this.btnAddTab, this.btnRemoveTab, this.btnRemoveAll]
+            }]
+        };
+        this.items = [{
+            xtype: "container",
+            height: 300,
+            layout: {
+                type: "hbox",
+                align: "stretch"
+            },
+            items: [{
+                xtype: "container",
+                width: 160,
+                padding: "5px 0 0 0",
+                layout: {
+                    type: "vbox",
+                    align: "stretch"
+                },
+                defaults: {
+                    xtype: "container",
+                    layout: {
+                        type: "hbox",
+                        align: "middle",
+                        pack: "end"
+                    }
+                },
+                items: [{
+                    height: 30,
+                    items: [this.btnIndents]
+                },
+                {
+                    height: 30,
+                    items: [this.btnFont]
+                },
+                {
+                    height: 30,
+                    items: [this.btnTabs]
+                }]
+            },
+            {
+                xtype: "box",
+                cls: "advanced-settings-separator",
+                height: "100%",
+                width: 8
+            },
+            this.mainCard = Ext.create("Ext.container.Container", {
+                height: 300,
+                flex: 1,
+                padding: "12px 18px 0 10px",
+                layout: "card",
+                items: [this._IndentsContainer, this._FontContainer, this._TabsContainer]
+            })]
+        },
+        this._spacer.cloneConfig({
+            style: "margin: 0 18px"
+        }), {
+            xtype: "container",
+            height: 40,
+            layout: {
+                type: "vbox",
+                align: "center",
+                pack: "center"
+            },
+            items: [{
+                xtype: "container",
+                width: 182,
+                height: 24,
+                layout: {
+                    type: "hbox",
+                    align: "middle"
+                },
+                items: [this.btnOk = Ext.widget("button", {
+                    cls: "asc-blue-button",
+                    width: 86,
+                    height: 22,
+                    margin: "0 5px 0 0",
+                    text: this.okButtonText,
+                    listeners: {
+                        click: function (btn) {
+                            this.fireEvent("onmodalresult", this, 1, this.getSettings());
+                            this.close();
+                        },
+                        scope: this
+                    }
+                }), this.btnCancel = Ext.widget("button", {
+                    cls: "asc-darkgray-button",
+                    width: 86,
+                    height: 22,
+                    text: this.cancelButtonText,
+                    listeners: {
+                        click: function (btn) {
+                            this.fireEvent("onmodalresult", this, 0);
+                            this.close();
+                        },
+                        scope: this
+                    }
+                })]
+            }]
+        }];
+        this.callParent(arguments);
+    },
+    afterRender: function () {
+        this.callParent(arguments);
+        this._setDefaults(this._originalProps);
+        this.setTitle(this.textTitle);
+    },
+    setSettings: function (props) {
+        this._originalProps = new Asc.asc_CParagraphProperty(props.paragraphProps);
+        this._changedProps = null;
+        this.api = props.api;
+    },
+    _setDefaults: function (props) {
+        if (props) {
+            this._originalProps = new Asc.asc_CParagraphProperty(props);
+            this.numFirstLine.setValue((props.asc_getInd() !== null && props.asc_getInd().asc_getFirstLine() !== null) ? Common.MetricSettings.fnRecalcFromMM(props.asc_getInd().asc_getFirstLine()) : "");
+            this.numIndentsLeft.setValue((props.asc_getInd() !== null && props.asc_getInd().asc_getLeft() !== null) ? Common.MetricSettings.fnRecalcFromMM(props.asc_getInd().asc_getLeft()) : "");
+            this.numIndentsRight.setValue((props.asc_getInd() !== null && props.asc_getInd().asc_getRight() !== null) ? Common.MetricSettings.fnRecalcFromMM(props.asc_getInd().asc_getRight()) : "");
+            this._noApply = true;
+            this.chStrike.setValue((props.asc_getStrikeout() !== null && props.asc_getStrikeout() !== undefined) ? props.asc_getStrikeout() : "indeterminate");
+            this.chDoubleStrike.setValue((props.asc_getDStrikeout() !== null && props.asc_getDStrikeout() !== undefined) ? props.asc_getDStrikeout() : "indeterminate");
+            this.chSubscript.setValue((props.asc_getSubscript() !== null && props.asc_getSubscript() !== undefined) ? props.asc_getSubscript() : "indeterminate");
+            this.chSuperscript.setValue((props.asc_getSuperscript() !== null && props.asc_getSuperscript() !== undefined) ? props.asc_getSuperscript() : "indeterminate");
+            this.chSmallCaps.setValue((props.asc_getSmallCaps() !== null && props.asc_getSmallCaps() !== undefined) ? props.asc_getSmallCaps() : "indeterminate");
+            this.chAllCaps.setValue((props.asc_getAllCaps() !== null && props.asc_getAllCaps() !== undefined) ? props.asc_getAllCaps() : "indeterminate");
+            this.numSpacing.setValue((props.asc_getTextSpacing() !== null && props.asc_getTextSpacing() !== undefined) ? Common.MetricSettings.fnRecalcFromMM(props.asc_getTextSpacing()) : "");
+            this.api.asc_setDrawImagePlaceParagraph("paragraphadv-font-img", this._originalProps);
+            this.numDefaultTab.setValue((props.asc_getDefaultTab() !== null && props.asc_getDefaultTab() !== undefined) ? Common.MetricSettings.fnRecalcFromMM(props.asc_getDefaultTab()) : "");
+            var tabs = props.asc_getTabs();
+            if (tabs) {
+                var arr = [];
+                var count = tabs.asc_getCount();
+                for (var i = 0; i < count; i++) {
+                    var tab = tabs.asc_getTab(i);
+                    var rec = {
+                        tabPos: Common.MetricSettings.fnRecalcFromMM(tab.asc_getPos()),
+                        tabAlign: tab.asc_getValue()
+                    };
+                    rec.tabStr = parseFloat(Ext.Number.toFixed(rec.tabPos, 3)) + " " + Common.MetricSettings.metricName[Common.MetricSettings.getCurrentMetric()];
+                    arr.push(rec);
+                }
+                this.tabList.getStore().loadData(arr);
+                this.tabList.getStore().sort();
+                if (this.tabList.getStore().count() > 0) {
+                    this.tabList.getSelectionModel().select(0);
+                }
+            }
+            this._noApply = false;
+            this._changedProps = new Asc.asc_CParagraphProperty();
+        }
+    },
+    getSettings: function () {
+        if (this._tabListChanged) {
+            if (this._changedProps.asc_getTabs() === null || this._changedProps.asc_getTabs() === undefined) {
+                this._changedProps.asc_putTabs(new Asc.asc_CParagraphTabs());
+            }
+            this.tabList.getStore().each(function (item, index) {
+                var tab = new Asc.asc_CParagraphTab(Common.MetricSettings.fnRecalcToMM(item.data.tabPos), item.data.tabAlign);
+                this._changedProps.asc_getTabs().add_Tab(tab);
+            },
+            this);
+        }
+        return {
+            paragraphProps: this._changedProps
+        };
+    },
+    updateMetricUnit: function () {
+        var spinners = this.query("commonmetricspinner");
+        if (spinners) {
+            for (var i = 0; i < spinners.length; i++) {
+                var spinner = spinners[i];
+                spinner.setDefaultUnit(Common.MetricSettings.metricName[Common.MetricSettings.getCurrentMetric()]);
+                if (spinner.id == "paragraphadv-spin-spacing") {
+                    spinner.setStep(Common.MetricSettings.getCurrentMetric() == Common.MetricSettings.c_MetricUnits.cm ? 0.01 : 1);
+                } else {
+                    spinner.setStep(Common.MetricSettings.getCurrentMetric() == Common.MetricSettings.c_MetricUnits.cm ? 0.1 : 1);
+                }
+            }
+        }
+    },
+    textTitle: "Paragraph - Advanced Settings",
+    strIndentsFirstLine: "First line",
+    strIndentsLeftText: "Left",
+    strIndentsRightText: "Right",
+    strParagraphIndents: "Indents & Placement",
+    strParagraphFont: "Font",
+    cancelButtonText: "Cancel",
+    okButtonText: "Ok",
+    textEffects: "Effects",
+    textCharacterSpacing: "Character Spacing",
+    strDoubleStrike: "Double strikethrough",
+    strStrike: "Strikethrough",
+    strSuperscript: "Superscript",
+    strSubscript: "Subscript",
+    strSmallCaps: "Small caps",
+    strAllCaps: "All caps",
+    strTabs: "Tab",
+    textSet: "Specify",
+    textRemove: "Remove",
+    textRemoveAll: "Remove All",
+    textTabLeft: "Left",
+    textTabRight: "Right",
+    textTabCenter: "Center",
+    textAlign: "Alignment",
+    textTabPosition: "Tab Position",
+    textDefault: "Default Tab"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/PrintSettings.js

@@ -0,0 +1,579 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.PrintSettings", {
+    extend: "Ext.window.Window",
+    alias: "widget.sseprintsettings",
+    requires: ["Ext.window.Window", "Ext.form.field.ComboBox", "Ext.form.RadioGroup", "Ext.Array", "Common.component.MetricSpinner", "Common.component.IndeterminateCheckBox"],
+    cls: "asc-advanced-settings-window",
+    modal: true,
+    resizable: false,
+    plain: true,
+    constrain: true,
+    height: 588,
+    width: 466,
+    layout: {
+        type: "vbox",
+        align: "stretch"
+    },
+    initComponent: function () {
+        var me = this;
+        this.addEvents("onmodalresult");
+        this._spacer = Ext.create("Ext.toolbar.Spacer", {
+            width: "100%",
+            height: 10,
+            html: '<div style="width: 100%; height: 40%; border-bottom: 1px solid #C7C7C7"></div>'
+        });
+        this.cmbPaperSize = Ext.widget("combo", {
+            store: Ext.create("Ext.data.Store", {
+                fields: ["description", "size"],
+                data: [{
+                    size: "215.9|279.4",
+                    description: "US Letter (21,59cm x 27,94cm)"
+                },
+                {
+                    size: "215.9|355.6",
+                    description: "US Legal (21,59cm x 35,56cm)"
+                },
+                {
+                    size: "210|297",
+                    description: "A4 (21cm x 29,7cm)"
+                },
+                {
+                    size: "148.1|209.9",
+                    description: "A5 (14,81cm x 20,99cm)"
+                },
+                {
+                    size: "176|250.1",
+                    description: "B5 (17,6cm x 25,01cm)"
+                },
+                {
+                    size: "104.8|241.3",
+                    description: "Envelope #10 (10,48cm x 24,13cm)"
+                },
+                {
+                    size: "110.1|220.1",
+                    description: "Envelope DL (11,01cm x 22,01cm)"
+                },
+                {
+                    size: "279.4|431.7",
+                    description: "Tabloid (27,94cm x 43,17cm)"
+                },
+                {
+                    size: "297|420.1",
+                    description: "A3 (29,7cm x 42,01cm)"
+                },
+                {
+                    size: "304.8|457.1",
+                    description: "Tabloid Oversize (30,48cm x 45,71cm)"
+                },
+                {
+                    size: "196.8|273",
+                    description: "ROC 16K (19,68cm x 27,3cm)"
+                },
+                {
+                    size: "119.9|234.9",
+                    description: "Envelope Choukei 3 (11,99cm x 23,49cm)"
+                },
+                {
+                    size: "330.2|482.5",
+                    description: "Super B/A3 (33,02cm x 48,25cm)"
+                }]
+            }),
+            displayField: "description",
+            valueField: "size",
+            queryMode: "local",
+            editable: false,
+            flex: 1
+        });
+        this.cmbPaperOrientation = Ext.widget("combo", {
+            store: Ext.create("Ext.data.Store", {
+                fields: ["description", "orient"],
+                data: [{
+                    description: me.strPortrait,
+                    orient: c_oAscPageOrientation.PagePortrait
+                },
+                {
+                    description: me.strLandscape,
+                    orient: c_oAscPageOrientation.PageLandscape
+                }]
+            }),
+            displayField: "description",
+            valueField: "orient",
+            queryMode: "local",
+            editable: false,
+            width: 115
+        });
+        this.chPrintGrid = Ext.widget("cmdindeterminatecheckbox", {
+            boxLabel: this.textPrintGrid
+        });
+        this.chPrintRows = Ext.widget("cmdindeterminatecheckbox", {
+            boxLabel: this.textPrintHeadings
+        });
+        this.spnMarginLeft = Ext.create("Common.component.MetricSpinner", {
+            readOnly: false,
+            maxValue: 48.25,
+            minValue: 0,
+            step: 0.1,
+            defaultUnit: "cm",
+            value: "0.19 cm",
+            listeners: {
+                change: Ext.bind(function (field, newValue, oldValue, eOpts) {},
+                this)
+            }
+        });
+        this.spnMarginRight = Ext.create("Common.component.MetricSpinner", {
+            readOnly: false,
+            maxValue: 48.25,
+            minValue: 0,
+            step: 0.1,
+            defaultUnit: "cm",
+            value: "0.19 cm",
+            listeners: {
+                change: function (field, newValue, oldValue, eOpts) {}
+            }
+        });
+        this.spnMarginTop = Ext.create("Common.component.MetricSpinner", {
+            readOnly: false,
+            maxValue: 48.25,
+            minValue: 0,
+            step: 0.1,
+            defaultUnit: "cm",
+            value: "0 cm",
+            listeners: {
+                change: function (field, newValue, oldValue, eOpts) {}
+            }
+        });
+        this.spnMarginBottom = Ext.create("Common.component.MetricSpinner", {
+            readOnly: false,
+            maxValue: 48.25,
+            minValue: 0,
+            step: 0.1,
+            defaultUnit: "cm",
+            value: "0 cm",
+            listeners: {
+                change: function (field, newValue, oldValue, eOpts) {}
+            }
+        });
+        this.items = [this.topCnt = Ext.widget("container", {
+            height: 490,
+            layout: {
+                type: "hbox",
+                align: "stretch"
+            },
+            items: [{
+                xtype: "container",
+                width: 160,
+                padding: "18 0 0 0",
+                layout: {
+                    type: "vbox",
+                    align: "stretch"
+                },
+                defaults: {
+                    xtype: "container",
+                    padding: "0 10 0 0",
+                    layout: {
+                        type: "hbox",
+                        align: "middle",
+                        pack: "end"
+                    }
+                },
+                items: [{
+                    height: 80,
+                    padding: "0 10px 10px 0",
+                    items: [{
+                        xtype: "label",
+                        text: me.textPrintRange,
+                        style: "font-weight: bold;"
+                    }]
+                },
+                {
+                    height: 62,
+                    items: [{
+                        xtype: "label",
+                        text: me.textPageSize,
+                        style: "font-weight: bold;"
+                    }]
+                },
+                {
+                    height: 58,
+                    items: [{
+                        xtype: "label",
+                        text: me.textPageOrientation,
+                        style: "font-weight: bold;"
+                    }]
+                },
+                {
+                    height: 124,
+                    items: [{
+                        xtype: "label",
+                        text: this.strMargins,
+                        style: "font-weight: bold;"
+                    }]
+                },
+                {
+                    height: 68,
+                    items: [{
+                        xtype: "label",
+                        text: me.textLayout,
+                        style: "font-weight: bold;"
+                    }]
+                },
+                {
+                    height: 70,
+                    items: [{
+                        xtype: "label",
+                        text: me.strPrint,
+                        style: "font-weight: bold;"
+                    }]
+                }]
+            },
+            {
+                xtype: "box",
+                cls: "advanced-settings-separator",
+                height: "100%",
+                width: 8
+            },
+            {
+                xtype: "container",
+                padding: "18 0 0 10",
+                width: 280,
+                layout: {
+                    type: "vbox",
+                    align: "stretch"
+                },
+                items: [{
+                    xtype: "container",
+                    height: 70,
+                    padding: "0 10",
+                    layout: {
+                        type: "hbox",
+                        align: "middle"
+                    },
+                    items: [this.groupRange = Ext.widget("radiogroup", {
+                        id: "dialog-printoptions-grouprange",
+                        columns: 1,
+                        width: 280,
+                        vertical: true,
+                        items: [{
+                            boxLabel: this.textCurrentSheet,
+                            name: "printrange",
+                            inputValue: c_oAscPrintType.ActiveSheets,
+                            checked: true
+                        },
+                        {
+                            boxLabel: this.textAllSheets,
+                            name: "printrange",
+                            inputValue: c_oAscPrintType.EntireWorkbook
+                        },
+                        {
+                            boxLabel: this.textSelection,
+                            name: "printrange",
+                            inputValue: c_oAscPrintType.Selection
+                        }]
+                    })]
+                },
+                this._spacer.cloneConfig({
+                    style: "margin: 15px 0 10px 0;",
+                    height: 6
+                }), {
+                    xtype: "container",
+                    height: 25,
+                    padding: "0 10",
+                    layout: {
+                        type: "hbox",
+                        align: "middle"
+                    },
+                    items: [this.cmbPaperSize]
+                },
+                this._spacer.cloneConfig({
+                    style: "margin: 17px 0 10px 0;",
+                    height: 6
+                }), {
+                    xtype: "container",
+                    height: 25,
+                    padding: "0 10",
+                    layout: {
+                        type: "hbox",
+                        align: "middle"
+                    },
+                    items: [this.cmbPaperOrientation]
+                },
+                this._spacer.cloneConfig({
+                    style: "margin: 16px 0 4px 0;",
+                    height: 6
+                }), this.cntMargins = Ext.widget("container", {
+                    height: 100,
+                    padding: "0 10",
+                    layout: {
+                        type: "hbox"
+                    },
+                    defaults: {
+                        xtype: "container",
+                        layout: {
+                            type: "vbox",
+                            align: "stretch"
+                        },
+                        height: 100
+                    },
+                    items: [{
+                        flex: 1,
+                        items: [{
+                            xtype: "label",
+                            width: "100%",
+                            text: me.strTop
+                        },
+                        {
+                            xtype: "tbspacer",
+                            height: 3
+                        },
+                        this.spnMarginTop, {
+                            xtype: "tbspacer",
+                            height: 12
+                        },
+                        {
+                            xtype: "label",
+                            width: "100%",
+                            text: me.strLeft
+                        },
+                        {
+                            xtype: "tbspacer",
+                            height: 3
+                        },
+                        this.spnMarginLeft]
+                    },
+                    {
+                        xtype: "tbspacer",
+                        width: 20
+                    },
+                    {
+                        flex: 1,
+                        items: [{
+                            xtype: "label",
+                            text: me.strBottom,
+                            width: "100%"
+                        },
+                        {
+                            xtype: "tbspacer",
+                            height: 3
+                        },
+                        this.spnMarginBottom, {
+                            xtype: "tbspacer",
+                            height: 12
+                        },
+                        {
+                            xtype: "label",
+                            text: me.strRight,
+                            width: "100%"
+                        },
+                        {
+                            xtype: "tbspacer",
+                            height: 3
+                        },
+                        this.spnMarginRight]
+                    }]
+                }), this._spacer.cloneConfig({
+                    style: "margin: 14px 0 6px 0;",
+                    height: 6
+                }), this.cntLayout = Ext.widget("container", {
+                    height: 45,
+                    padding: "0 10",
+                    layout: {
+                        type: "vbox",
+                        align: "stretch"
+                    },
+                    items: [this.groupLayout = Ext.widget("radiogroup", {
+                        columns: 1,
+                        width: 280,
+                        vertical: true,
+                        items: [{
+                            boxLabel: this.textActualSize,
+                            name: "printlayout",
+                            inputValue: c_oAscLayoutPageType.ActualSize
+                        },
+                        {
+                            boxLabel: this.textFit,
+                            name: "printlayout",
+                            inputValue: c_oAscLayoutPageType.FitToWidth,
+                            checked: true
+                        }]
+                    })]
+                }), this._spacer.cloneConfig({
+                    style: "margin: 14px 0 8px 0;",
+                    height: 6
+                }), this.cntAdditional = Ext.widget("container", {
+                    height: 65,
+                    padding: "0 10",
+                    layout: {
+                        type: "vbox",
+                        align: "stretch"
+                    },
+                    items: [this.chPrintGrid, this.chPrintRows]
+                })]
+            }]
+        }), this._spacer.cloneConfig({
+            style: "margin: 0 18px"
+        }), {
+            xtype: "container",
+            height: 40,
+            layout: {
+                type: "vbox",
+                align: "center",
+                pack: "center"
+            },
+            items: [{
+                xtype: "container",
+                width: 466,
+                height: 24,
+                style: "padding: 0 30px;",
+                layout: {
+                    type: "hbox",
+                    align: "stretch"
+                },
+                items: [{
+                    xtype: "button",
+                    width: 100,
+                    height: 22,
+                    text: this.textHideDetails,
+                    listeners: {
+                        scope: this,
+                        click: this.handlerShowDetails
+                    }
+                },
+                this.btnOk = Ext.widget("button", {
+                    id: "dialog-print-options-ok",
+                    cls: "asc-blue-button",
+                    width: 150,
+                    height: 22,
+                    style: "margin:0 10px 0 60px;",
+                    text: this.btnPrint,
+                    listeners: {}
+                }), this.btnCancel = Ext.widget("button", {
+                    cls: "asc-darkgray-button",
+                    width: 86,
+                    height: 22,
+                    text: this.cancelButtonText,
+                    listeners: {
+                        click: function (btn) {
+                            this.fireEvent("onmodalresult", this, 0);
+                            this.close();
+                        },
+                        scope: this
+                    }
+                })]
+            }]
+        }];
+        this.callParent(arguments);
+        this.setTitle(this.textTitle);
+    },
+    afterRender: function () {
+        this.callParent(arguments);
+    },
+    checkMargins: function () {
+        if (this.cmbPaperOrientation.getValue() == c_oAscPageOrientation.PagePortrait) {
+            var pagewidth = /^\d{3}\.?\d*/.exec(this.cmbPaperSize.getValue());
+            var pageheight = /\d{3}\.?\d*$/.exec(this.cmbPaperSize.getValue());
+        } else {
+            pageheight = /^\d{3}\.?\d*/.exec(this.cmbPaperSize.getValue());
+            pagewidth = /\d{3}\.?\d*$/.exec(this.cmbPaperSize.getValue());
+        }
+        var ml = Common.MetricSettings.fnRecalcToMM(this.spnMarginLeft.getNumberValue());
+        var mr = Common.MetricSettings.fnRecalcToMM(this.spnMarginRight.getNumberValue());
+        var mt = Common.MetricSettings.fnRecalcToMM(this.spnMarginTop.getNumberValue());
+        var mb = Common.MetricSettings.fnRecalcToMM(this.spnMarginBottom.getNumberValue());
+        if (ml > pagewidth) {
+            return "left";
+        }
+        if (mr > pagewidth - ml) {
+            return "right";
+        }
+        if (mt > pageheight) {
+            return "top";
+        }
+        if (mb > pageheight - mt) {
+            return "bottom";
+        }
+        return null;
+    },
+    handlerShowDetails: function (btn) {
+        if (!this.extended) {
+            this.extended = true;
+            this.cntMargins.setDisabled(true);
+            this.cntLayout.setDisabled(true);
+            this.cntAdditional.setDisabled(true);
+            this.topCnt.setHeight(218);
+            this.setHeight(316);
+            btn.setText(this.textShowDetails);
+        } else {
+            this.extended = false;
+            this.cntMargins.setDisabled(false);
+            this.cntLayout.setDisabled(false);
+            this.cntAdditional.setDisabled(false);
+            this.topCnt.setHeight(490);
+            this.setHeight(588);
+            btn.setText(this.textHideDetails);
+        }
+    },
+    updateMetricUnit: function () {
+        var spinners = this.query("commonmetricspinner");
+        if (spinners) {
+            for (var i = 0; i < spinners.length; i++) {
+                var spinner = spinners[i];
+                spinner.setDefaultUnit(Common.MetricSettings.metricName[Common.MetricSettings.getCurrentMetric()]);
+                spinner.setStep(Common.MetricSettings.getCurrentMetric() == Common.MetricSettings.c_MetricUnits.cm ? 0.1 : 1);
+            }
+        }
+    },
+    textTitle: "Print Settings",
+    strLeft: "Left",
+    strRight: "Right",
+    strTop: "Top",
+    strBottom: "Bottom",
+    strPortrait: "Portrait",
+    strLandscape: "Landscape",
+    textPrintGrid: "Print Gridlines",
+    textPrintHeadings: "Print Rows and Columns Headings",
+    textPageSize: "Page Size",
+    textPageOrientation: "Page Orientation",
+    strMargins: "Margins",
+    strPrint: "Print",
+    btnPrint: "Save & Print",
+    textPrintRange: "Print Range",
+    textLayout: "Layout",
+    textCurrentSheet: "Current Sheet",
+    textAllSheets: "All Sheets",
+    textSelection: "Selection",
+    textActualSize: "Actual Size",
+    textFit: "Fit to width",
+    textShowDetails: "Show Details",
+    cancelButtonText: "Cancel",
+    textHideDetails: "Hide Details"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/RecentFiles.js

@@ -0,0 +1,75 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.RecentFiles", {
+    extend: "Ext.panel.Panel",
+    alias: "widget.sserecentfiles",
+    cls: "sse-recentfiles",
+    layout: {
+        type: "vbox",
+        align: "stretch"
+    },
+    requires: ["Ext.container.Container", "Ext.data.Model", "Ext.data.Store", "Ext.view.View", "Ext.XTemplate", "Common.plugin.DataViewScrollPane"],
+    constructor: function (config) {
+        this.initConfig(config);
+        this.callParent(arguments);
+        return this;
+    },
+    initComponent: function () {
+        this.callParent(arguments);
+        var me = this;
+        me.add({
+            xtype: "container",
+            flex: 1,
+            layout: "fit",
+            cls: "container-recent-file-list",
+            items: [{
+                xtype: "dataview",
+                store: "RecentFiles",
+                tpl: Ext.create("Ext.XTemplate", '<tpl for=".">', '<div class="thumb-wrap">', '<div class="thumb"></div>', '<div class="file-name">{title:htmlEncode}</div>', '<div class="file-info">{folder:htmlEncode}</div>', "</div>", "</tpl>"),
+                singleSelect: true,
+                trackOver: true,
+                style: "overflow:auto",
+                overItemCls: "x-item-over",
+                itemSelector: "div.thumb-wrap",
+                cls: "x-view-context",
+                plugins: [{
+                    ptype: "dataviewscrollpane",
+                    pluginId: "scrollpane",
+                    areaSelector: ".x-view-context",
+                    settings: {
+                        enableKeyboardNavigation: true
+                    }
+                }]
+            }]
+        });
+    }
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/RightMenu.js

@@ -0,0 +1,231 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ var SCALE_MIN = 40;
+var MENU_SCALE_PART = 260;
+var RIGHTMENU_TOOLBAR_ID = "rightmenu-toolbar-id";
+var RIGHTMENU_PANEL_ID = "rightmenu-panel-id";
+Ext.define("SSE.view.RightMenu", {
+    extend: "Ext.panel.Panel",
+    alias: "widget.sserightmenu",
+    requires: ["Ext.toolbar.Toolbar", "Ext.button.Button", "Ext.container.Container", "Ext.toolbar.Spacer", "SSE.view.RightPanel", "Ext.util.Cookies"],
+    cls: "rm-style",
+    id: RIGHTMENU_PANEL_ID,
+    bodyCls: "rm-body",
+    width: SCALE_MIN,
+    buttonCollection: [],
+    listeners: {
+        afterrender: function () {
+            var owner = this.ownerCt;
+            if (Ext.isDefined(owner)) {
+                owner.addListener("resize", Ext.bind(this.resizeMenu, this));
+            }
+        }
+    },
+    initComponent: function () {
+        this.dockedItems = this.buildDockedItems();
+        this._rightSettings = Ext.widget("sserightpanel", {
+            id: "view-right-panel-settings",
+            btnImage: this.btnImage,
+            btnShape: this.btnShape,
+            btnText: this.btnText
+        });
+        this.items = [this._rightSettings];
+        this.addEvents("editcomplete");
+        this.callParent(arguments);
+    },
+    buildDockedItems: function () {
+        var me = this;
+        me.btnShape = Ext.create("Ext.button.Button", {
+            id: "id-right-menu-shape",
+            cls: "asc-main-menu-buttons",
+            iconCls: "asc-main-menu-btn menuShape",
+            asctype: c_oAscTypeSelectElement.Shape,
+            enableToggle: true,
+            allowDepress: true,
+            toggleGroup: "tabpanelbtnsGroup",
+            disabled: true,
+            style: "margin-bottom:8px;"
+        });
+        me.btnImage = Ext.create("Ext.Button", {
+            id: "id-right-menu-image",
+            cls: "asc-main-menu-buttons",
+            iconCls: "asc-main-menu-btn menuImage",
+            asctype: c_oAscTypeSelectElement.Image,
+            enableToggle: true,
+            allowDepress: true,
+            toggleGroup: "tabpanelbtnsGroup",
+            disabled: true,
+            style: "margin-bottom:8px;"
+        });
+        me.btnText = Ext.create("Ext.Button", {
+            id: "id-right-menu-text",
+            cls: "asc-main-menu-buttons",
+            iconCls: "asc-main-menu-btn menuText",
+            asctype: c_oAscTypeSelectElement.Paragraph,
+            enableToggle: true,
+            allowDepress: true,
+            disabled: true,
+            toggleGroup: "tabpanelbtnsGroup"
+        });
+        this.rightToolbar = Ext.create("Ext.toolbar.Toolbar", {
+            cls: "rm-default-toolbar",
+            width: this.width || SCALE_MIN,
+            vertical: true,
+            dock: "right",
+            defaultType: "button",
+            style: "padding-top:15px",
+            items: [me.btnShape, me.btnImage, me.btnText]
+        });
+        return this.rightToolbar;
+    },
+    resizeMenu: function (Component, adjWidth, adjHeight, eOpts) {
+        for (var i = 0; i < this.items.length; i++) {
+            if (this.items.items[i].el && adjHeight != this.items.items[i].getHeight()) {
+                this.items.items[i].setHeight(adjHeight);
+            }
+        }
+        this.doComponentLayout();
+    },
+    setApi: function (o) {
+        this.api = o;
+        this.api.asc_registerCallback("asc_onСoAuthoringDisconnect", Ext.bind(this.onCoAuthoringDisconnect, this));
+        return this;
+    },
+    disableMenu: function (disabled) {
+        var btn, i;
+        var tbMain = this.rightToolbar;
+        if (Ext.isDefined(tbMain)) {
+            for (i = 0; i < tbMain.items.length; i++) {
+                btn = tbMain.items.items[i];
+                if (btn) {
+                    btn.pressed && btn.toggle(false);
+                    btn.setDisabled(disabled);
+                }
+            }
+        }
+    },
+    onCoAuthoringDisconnect: function () {
+        this.disableMenu(true);
+        if (this._rightSettings) {
+            this._rightSettings.setDisabled(true);
+            this._rightSettings.setMode({
+                isEdit: false
+            });
+        }
+    },
+    onSelectionChanged: function (info) {
+        var SelectedObjects = [];
+        if (info.asc_getFlags().asc_getSelectionType() == c_oAscSelectionType.RangeImage || info.asc_getFlags().asc_getSelectionType() == c_oAscSelectionType.RangeShape || info.asc_getFlags().asc_getSelectionType() == c_oAscSelectionType.RangeShapeText) {
+            SelectedObjects = this.api.asc_getGraphicObjectProps();
+        }
+        if (SelectedObjects.length <= 0 && !this._rightSettings.minimizedMode) {
+            this.clearSelection();
+            this._rightSettings.minimizedMode = true;
+            this.setWidth(SCALE_MIN);
+        }
+        this._rightSettings.onFocusObject(SelectedObjects);
+    },
+    clearSelection: function (exclude) {
+        var btn, i;
+        var tbMain = this.rightToolbar;
+        if (Ext.isDefined(tbMain)) {
+            for (i = 0; i < tbMain.items.length; i++) {
+                btn = tbMain.items.items[i];
+                if (Ext.isDefined(btn) && btn.componentCls === "x-btn") {
+                    if (btn.pressed) {
+                        if (exclude) {
+                            if (typeof exclude == "object") {
+                                if (exclude.id == btn.id) {
+                                    continue;
+                                }
+                            } else {
+                                if (btn.iconCls && !(btn.iconCls.search(exclude) < 0)) {
+                                    continue;
+                                }
+                            }
+                        }
+                        btn.toggle(false);
+                    }
+                }
+            }
+        }
+    },
+    createDelayedElements: function () {
+        var me = this;
+        this.api.asc_registerCallback("asc_onSelectionChanged", Ext.bind(this.onSelectionChanged, this));
+        me._rightSettings.setHeight(me.getHeight());
+        var toggleHandler = function (btn, pressed) {
+            if (pressed && !me._rightSettings.minimizedMode) {
+                btn.addCls("asc-main-menu-btn-selected");
+                var panel = me._rightSettings._settings[btn.asctype].panel;
+                var props = me._rightSettings._settings[btn.asctype].props;
+                me._rightSettings.TabPanel.getLayout().setActiveItem(panel);
+                me._rightSettings.TabPanel.setHeight(panel.initialHeight);
+                if (props) {
+                    panel.ChangeSettings.call(panel, props);
+                }
+            }
+        };
+        var clickHandler = function (btn) {
+            if (btn.pressed) {
+                if (me._rightSettings.minimizedMode) {
+                    if (me._rightSettings.TabPanel.hidden) {
+                        me._rightSettings.TabPanel.setVisible(true);
+                    }
+                    me.setWidth(MENU_SCALE_PART);
+                    me._rightSettings.minimizedMode = false;
+                    toggleHandler(btn, btn.pressed);
+                } else {
+                    btn.addCls("asc-main-menu-btn-selected");
+                }
+            } else {
+                me._rightSettings.minimizedMode = true;
+                me.setWidth(SCALE_MIN);
+                btn.removeCls("asc-main-menu-btn-selected");
+            }
+            me.fireEvent("editcomplete", me);
+        };
+        var button;
+        var tips = [me.txtShapeSettings, me.txtImageSettings, me.txtParagraphSettings];
+        for (var i = this.rightToolbar.items.items.length; i--;) {
+            button = this.rightToolbar.items.items[i];
+            button.on({
+                "click": clickHandler,
+                "toggle": toggleHandler
+            });
+            button.setTooltip(tips[i]);
+        }
+    },
+    txtImageSettings: "Image Settings",
+    txtShapeSettings: "Shape Settings",
+    txtParagraphSettings: "Text Settings"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/RightPanel.js

@@ -0,0 +1,262 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.RightPanel", {
+    extend: "Ext.container.Container",
+    alias: "widget.sserightpanel",
+    width: 220,
+    layout: {
+        type: "auto"
+    },
+    autoScroll: true,
+    cls: "asc-right-panel-container",
+    preventHeader: true,
+    requires: ["Ext.toolbar.Toolbar", "Ext.container.Container", "Common.plugin.ScrollPane", "SSE.view.ImageSettings", "SSE.view.ShapeSettings", "SSE.view.ParagraphSettings", "Ext.button.Button", "Ext.panel.Panel"],
+    uses: ["Ext.DomHelper", "Ext.util.Cookies"],
+    listeners: {
+        afterrender: function () {
+            var owner = this.ownerCt;
+            if (Ext.isDefined(owner)) {
+                owner.addListener("resize", Ext.bind(this.resizeRightPanels, this));
+            }
+        }
+    },
+    resizeRightPanels: function (cnt) {
+        this.doComponentLayout();
+    },
+    constructor: function (config) {
+        this.callParent(arguments);
+        this.initConfig(config);
+        return this;
+    },
+    initComponent: function () {
+        var me = this;
+        me.editMode = true;
+        me.minimizedMode = true;
+        me.plugins = [{
+            ptype: "scrollpane",
+            pluginId: "scrollpane",
+            areaSelector: ".x-container",
+            settings: {
+                enableKeyboardNavigation: true,
+                verticalGutter: 0
+            }
+        }];
+        me.callParent(arguments);
+    },
+    updateScrollPane: function () {
+        var me = this;
+        me.getPlugin("scrollpane").updateScrollPane();
+    },
+    onFocusObject: function (SelectedObjects) {
+        if (!this.editMode) {
+            return;
+        }
+        for (var i = 0; i < this._settings.length; i++) {
+            if (this._settings[i]) {
+                this._settings[i].hidden = 1;
+            }
+        }
+        for (i = 0; i < SelectedObjects.length; i++) {
+            var type = SelectedObjects[i].asc_getObjectType();
+            if (type >= this._settings.length || this._settings[type] === undefined) {
+                continue;
+            }
+            var value = SelectedObjects[i].asc_getObjectValue();
+            if (type == c_oAscTypeSelectElement.Image) {
+                if (value.asc_getShapeProperties() !== null) {
+                    type = c_oAscTypeSelectElement.Shape;
+                }
+            }
+            this._settings[type].props = value;
+            this._settings[type].hidden = 0;
+        }
+        var lastactive = -1,
+        currentactive, priorityactive = -1;
+        for (i = 0; i < this._settings.length; i++) {
+            if (this._settings[i] === undefined) {
+                continue;
+            }
+            if (this._settings[i].hidden) {
+                if (!this._settings[i].btn.isDisabled()) {
+                    this._settings[i].btn.setDisabled(true);
+                }
+                if (this.TabPanel.getLayout().getActiveItem() == this._settings[i].panel) {
+                    currentactive = -1;
+                }
+            } else {
+                if (this._settings[i].btn.isDisabled()) {
+                    this._settings[i].btn.setDisabled(false);
+                }
+                lastactive = i;
+                if (this._settings[i].needShow) {
+                    this._settings[i].needShow = false;
+                    priorityactive = i;
+                } else {
+                    if (this.TabPanel.getLayout().getActiveItem() == this._settings[i].panel) {
+                        currentactive = i;
+                    }
+                }
+            }
+        }
+        if (!this.minimizedMode) {
+            var active;
+            if (priorityactive > -1) {
+                active = priorityactive;
+            } else {
+                if (lastactive >= 0 && currentactive < 0) {
+                    active = lastactive;
+                } else {
+                    if (currentactive >= 0) {
+                        active = currentactive;
+                    }
+                }
+            }
+            if (active !== undefined) {
+                if (!this._settings[active].btn.pressed) {
+                    this._settings[active].btn.toggle();
+                } else {
+                    if (this._settings[active].panel.ChangeSettings) {
+                        this._settings[active].panel.ChangeSettings.call(this._settings[active].panel, this._settings[active].props);
+                    }
+                }
+            }
+        }
+        this._settings[c_oAscTypeSelectElement.Image].needShow = false;
+    },
+    onInsertImage: function () {
+        this._settings[c_oAscTypeSelectElement.Image].needShow = true;
+    },
+    SendThemeColors: function (effectcolors, standartcolors) {
+        this.effectcolors = effectcolors;
+        if (standartcolors && standartcolors.length > 0) {
+            this.standartcolors = standartcolors;
+        }
+        if (this.ShapePanel) {
+            this.ShapePanel.SendThemeColors(effectcolors, standartcolors);
+        }
+    },
+    setApi: function (api) {
+        this.api = api;
+        return this;
+    },
+    setMode: function (mode) {
+        this.editMode = mode.isEdit;
+    },
+    FillAutoShapes: function () {
+        this.ShapePanel.FillAutoShapes();
+    },
+    hideMenus: function () {
+        for (var i = 0; i < this._settings.length; i++) {
+            if (this._settings[i] === undefined) {
+                continue;
+            }
+            if (Ext.isDefined(this._settings[i].panel.hideMenus)) {
+                this._settings[i].panel.hideMenus();
+            }
+        }
+    },
+    updateMetricUnit: function () {
+        this.ImagePanel.updateMetricUnit();
+        this.ParagraphPanel.updateMetricUnit();
+    },
+    _onSelectionChanged: function (info) {
+        var need_disable = info.asc_getLocked();
+        if (this._settings.prevDisabled != need_disable) {
+            this._settings.prevDisabled = need_disable;
+            this._settings.forEach(function (item) {
+                item.panel[need_disable ? "disable" : "enable"]();
+            });
+        }
+    },
+    createDelayedElements: function () {
+        var me = this;
+        me.panelHolder = Ext.create("Ext.container.Container", {
+            layout: {
+                type: "anchor"
+            },
+            items: [me.TabPanel = Ext.create("Ext.panel.Panel", {
+                hidden: true,
+                id: "view-tab-panel",
+                cls: "asc-right-tabpanel",
+                preventHeader: true,
+                layout: "card",
+                items: [me.ShapePanel = Ext.create("SSE.view.ShapeSettings", {
+                    id: "view-shape-settings",
+                    cls: "asc-right-panel",
+                    type: c_oAscTypeSelectElement.Shape
+                }), me.ImagePanel = Ext.create("SSE.view.ImageSettings", {
+                    id: "view-image-settings",
+                    cls: "asc-right-panel",
+                    type: c_oAscTypeSelectElement.Image
+                }), me.ParagraphPanel = Ext.create("SSE.view.ParagraphSettings", {
+                    id: "view-paragraph-settings",
+                    cls: "asc-right-panel",
+                    type: c_oAscTypeSelectElement.Paragraph
+                })],
+                listeners: {
+                    afterlayout: function () {
+                        me.updateScrollPane();
+                    }
+                }
+            })],
+            listeners: {
+                afterlayout: function () {
+                    me.updateScrollPane();
+                }
+            }
+        });
+        me.add(me.panelHolder);
+        me.ShapePanel.setApi(me.api);
+        me.ImagePanel.setApi(me.api);
+        me.ParagraphPanel.setApi(me.api);
+        me.api.asc_registerCallback("asc_onSelectionChanged", Ext.bind(me._onSelectionChanged, me));
+        me._settings = [];
+        me._settings[c_oAscTypeSelectElement.Image] = {
+            panel: me.ImagePanel,
+            btn: me.btnImage,
+            hidden: 1
+        };
+        me._settings[c_oAscTypeSelectElement.Shape] = {
+            panel: me.ShapePanel,
+            btn: me.btnShape,
+            hidden: 1
+        };
+        me._settings[c_oAscTypeSelectElement.Paragraph] = {
+            panel: me.ParagraphPanel,
+            btn: me.btnText,
+            hidden: 1
+        };
+        if (this.effectcolors && this.standartcolors) {
+            this.ShapePanel.SendThemeColors(this.effectcolors, this.standartcolors);
+        }
+    }
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/SetValueDialog.js

@@ -0,0 +1,133 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.SetValueDialog", {
+    extend: "Ext.window.Window",
+    alias: "widget.setvaluedialog",
+    requires: ["Ext.window.Window", "Ext.window.MessageBox"],
+    modal: true,
+    resizable: false,
+    plain: true,
+    height: 138,
+    width: 222,
+    padding: "20px",
+    layout: {
+        type: "vbox",
+        align: "stretch"
+    },
+    listeners: {
+        show: function () {
+            this.udRetValue.focus(false, 500);
+        }
+    },
+    initComponent: function () {
+        var me = this;
+        this.addEvents("onmodalresult");
+        this.items = [{
+            xtype: "container",
+            height: 42,
+            layout: {
+                type: "hbox",
+                align: "stretch"
+            },
+            items: [this.udRetValue = Ext.widget("numberfield", {
+                minValue: 0,
+                maxValue: me.maxvalue,
+                value: me.startvalue,
+                step: 1,
+                flex: 1,
+                allowDecimals: true,
+                validateOnBlur: false,
+                msgTarget: "side",
+                minText: this.txtMinText,
+                maxText: this.txtMaxText,
+                listeners: {
+                    specialkey: function (field, e) {
+                        if (e.getKey() == e.ENTER) {
+                            me.btnOk.fireEvent("click");
+                        } else {
+                            if (e.getKey() == e.ESC) {
+                                me.btnCancel.fireEvent("click");
+                            }
+                        }
+                    }
+                }
+            })]
+        },
+        {
+            xtype: "container",
+            height: 30,
+            layout: {
+                type: "vbox",
+                align: "center"
+            },
+            items: [{
+                xtype: "container",
+                width: 182,
+                layout: {
+                    type: "hbox",
+                    align: "middle"
+                },
+                items: [this.btnOk = Ext.widget("button", {
+                    cls: "asc-blue-button",
+                    width: 86,
+                    height: 22,
+                    margin: "0 5px 0 0",
+                    text: this.okButtonText,
+                    listeners: {
+                        click: function (btn) {
+                            if (me.udRetValue.isValid()) {
+                                me.fireEvent("onmodalresult", me, 1, me.udRetValue.value);
+                                me.close();
+                            }
+                        }
+                    }
+                }), this.btnCancel = Ext.widget("button", {
+                    cls: "asc-darkgray-button",
+                    width: 86,
+                    height: 22,
+                    text: this.cancelButtonText,
+                    listeners: {
+                        click: function (btn) {
+                            me.fireEvent("onmodalresult", this, 0);
+                            me.close();
+                        }
+                    }
+                })]
+            }]
+        }];
+        this.callParent(arguments);
+    },
+    cancelButtonText: "Cancel",
+    okButtonText: "Ok",
+    txtMinText: "The minimum value for this field is {0}",
+    txtMaxText: "The maximum value for this field is {0}"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/SheetCopyDialog.js

@@ -0,0 +1,152 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.SheetCopyDialog", {
+    extend: "Ext.window.Window",
+    alias: "widget.ssesheetcopydialog",
+    requires: ["Ext.window.Window", "Common.plugin.GridScrollPane"],
+    modal: true,
+    closable: true,
+    resizable: false,
+    plain: true,
+    height: 300,
+    width: 280,
+    padding: "20px",
+    layout: "vbox",
+    constrain: true,
+    layoutConfig: {
+        align: "stretch"
+    },
+    listeners: {
+        show: function () {
+            this.sheetList.getSelectionModel().select(0);
+        }
+    },
+    initComponent: function () {
+        var me = this;
+        var _btnOk = Ext.create("Ext.Button", {
+            id: "wscopydialog-button-ok",
+            text: Ext.Msg.buttonText.ok,
+            width: 80,
+            cls: "asc-blue-button",
+            listeners: {
+                click: function () {
+                    me._modalresult = 1;
+                    me.fireEvent("onmodalresult", me, me._modalresult, me.sheetList.getSelectionModel().selected.items[0].data.sheetindex);
+                    me.close();
+                }
+            }
+        });
+        var _btnCancel = Ext.create("Ext.Button", {
+            id: "wscopydialog-button-cancel",
+            text: me.cancelButtonText,
+            width: 80,
+            cls: "asc-darkgray-button",
+            listeners: {
+                click: function () {
+                    me._modalresult = 0;
+                    me.fireEvent("onmodalresult", this, this._modalresult);
+                    me.close();
+                }
+            }
+        });
+        Ext.define("worksheet", {
+            extend: "Ext.data.Model",
+            fields: [{
+                type: "int",
+                name: "sheetindex"
+            },
+            {
+                type: "string",
+                name: "name"
+            }]
+        });
+        this.sheetList = Ext.create("Ext.grid.Panel", {
+            activeItem: 0,
+            id: "wscopydialog-sheetlist-list",
+            scroll: false,
+            store: {
+                model: "worksheet",
+                data: this.names
+            },
+            columns: [{
+                flex: 1,
+                sortable: false,
+                dataIndex: "name"
+            }],
+            plugins: [{
+                ptype: "gridscrollpane"
+            }],
+            height: 160,
+            width: 240,
+            hideHeaders: true,
+            listeners: {
+                itemdblclick: function (o, record, item, index, e, eOpts) {
+                    _btnOk.fireEvent("click", _btnOk);
+                }
+            }
+        });
+        this.items = [{
+            xtype: "label",
+            text: this.listtitle || this.labelList,
+            width: "100%",
+            style: "text-align:left"
+        },
+        {
+            xtype: "tbspacer",
+            height: 10
+        },
+        this.sheetList, {
+            xtype: "tbspacer",
+            height: 14
+        },
+        {
+            xtype: "container",
+            width: 240,
+            layout: "hbox",
+            layoutConfig: {
+                align: "stretch"
+            },
+            items: [{
+                xtype: "tbspacer",
+                flex: 1
+            },
+            _btnOk, {
+                xtype: "tbspacer",
+                width: 5
+            },
+            _btnCancel]
+        }];
+        this.callParent(arguments);
+    },
+    labelList: "Copy before sheet",
+    cancelButtonText: "Cancel"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/SheetRenameDialog.js

@@ -0,0 +1,178 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.SheetRenameDialog", {
+    extend: "Ext.window.Window",
+    alias: "widget.ssesheetrenamedialog",
+    requires: ["Ext.window.Window"],
+    modal: true,
+    closable: true,
+    resizable: false,
+    preventHeader: true,
+    plain: true,
+    height: 116,
+    width: 280,
+    padding: "20px",
+    layout: "vbox",
+    constrain: true,
+    layoutConfig: {
+        align: "stretch"
+    },
+    listeners: {
+        show: function () {
+            this.txtName.focus(true, 100);
+        }
+    },
+    initComponent: function () {
+        this.addEvents("onmodalresult");
+        var me = this;
+        var checkName = function (n) {
+            var ac = me.names.length;
+            while (! (--ac < 0)) {
+                if (me.names[ac] == n) {
+                    return ac == me.renameindex ? -255 : true;
+                }
+            }
+            return false;
+        };
+        var _btnOk = Ext.create("Ext.Button", {
+            id: "wsrenamedialog-button-ok",
+            text: Ext.Msg.buttonText.ok,
+            width: 80,
+            cls: "asc-blue-button",
+            listeners: {
+                click: function () {
+                    if (
+                    /*me.txtName.getValue().length ||*/
+                    ! me.txtName.isValid()) {} else {
+                        var res = checkName(me.txtName.getValue());
+                        if (res === true) {
+                            Ext.Msg.show({
+                                title: me.errTitle,
+                                msg: me.errNameExists,
+                                icon: Ext.Msg.ERROR,
+                                buttons: Ext.Msg.OK,
+                                fn: function () {
+                                    me.txtName.focus(true, 500);
+                                }
+                            });
+                        } else {
+                            me._modalresult = res == -255 ? 0 : 1;
+                            me.fireEvent("onmodalresult", me, me._modalresult, me.txtName.getValue());
+                            me.close();
+                        }
+                    }
+                }
+            }
+        });
+        var _btnCancel = Ext.create("Ext.Button", {
+            id: "wsrenamedialog-button-cancel",
+            text: me.cancelButtonText,
+            width: 80,
+            cls: "asc-darkgray-button",
+            listeners: {
+                click: function () {
+                    me._modalresult = 0;
+                    me.fireEvent("onmodalresult", me, me._modalresult);
+                    me.close();
+                }
+            }
+        });
+        this.txtName = Ext.create("Ext.form.Text", {
+            id: "wsrenamedialog-text-wsname",
+            width: 240,
+            msgTarget: "side",
+            validateOnBlur: false,
+            allowBlank: false,
+            value: this.names[this.renameindex],
+            enforceMaxLength: true,
+            maxLength: 31,
+            validator: function (value) {
+                if (value.length > 2 && value[0] == '"' && value[value.length - 1] == '"') {
+                    return true;
+                }
+                if (!/[:\\\/\*\?\[\]\']/.test(value)) {
+                    return true;
+                } else {
+                    return me.errNameWrongChar;
+                }
+            },
+            listeners: {
+                specialkey: function (field, e) {
+                    if (e.getKey() == e.ENTER) {
+                        _btnOk.fireEvent("click");
+                    } else {
+                        if (e.getKey() == e.ESC) {
+                            _btnCancel.fireEvent("click");
+                        }
+                    }
+                }
+            }
+        });
+        this.items = [{
+            xtype: "label",
+            text: this.labelSheetName,
+            width: "100%",
+            style: "text-align:left"
+        },
+        {
+            xtype: "tbspacer",
+            height: 4
+        },
+        this.txtName, {
+            xtype: "tbspacer",
+            height: 4
+        },
+        {
+            xtype: "container",
+            width: 240,
+            layout: "hbox",
+            layoutConfig: {
+                align: "stretch"
+            },
+            items: [{
+                xtype: "tbspacer",
+                flex: 1
+            },
+            _btnOk, {
+                xtype: "tbspacer",
+                width: 5
+            },
+            _btnCancel]
+        }];
+        this.callParent(arguments);
+    },
+    labelSheetName: "Sheet Name",
+    errTitle: "Error",
+    errNameExists: "Worksheet with such name already exist.",
+    errNameWrongChar: "A sheet name cannot contain characters: \\/*?[]:",
+    cancelButtonText: "Cancel"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/TableOptionsDialog.js

@@ -0,0 +1,149 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ Ext.define("SSE.view.TableOptionsDialog", {
+    extend: "Ext.window.Window",
+    alias: "widget.tableoptionsdialog",
+    requires: ["Ext.window.Window"],
+    closable: true,
+    resizable: false,
+    height: 145,
+    width: 300,
+    padding: "12px 20px 0 20px",
+    constrain: true,
+    layout: {
+        type: "vbox",
+        align: "stretch"
+    },
+    listeners: {
+        show: function () {
+            var options = this.api.asc_getAddFormatTableOptions();
+            this.txtDataRange.setValue(options.asc_getRange());
+            this.chTitle.setValue(options.asc_getIsTitle());
+            this.api.asc_setSelectionDialogMode(true, options.asc_getRange());
+        },
+        beforedestroy: function () {
+            this.api.asc_setSelectionDialogMode(false);
+        }
+    },
+    initComponent: function () {
+        var me = this;
+        var worksheets = "",
+        names = this.names;
+        if (names) {
+            worksheets = names[0];
+            var i = names.length;
+            while (--i) {
+                worksheets += ("|" + names[i]);
+            }
+        }
+        var longRe = new RegExp(worksheets + "![A-Z]+[1-9]\d*:[A-Z]+[1-9]\d*");
+        var shortRe = new RegExp(worksheets + "![A-Z]+[1-9]\d*");
+        this.txtDataRange = Ext.create("Ext.form.Text", {
+            height: 22,
+            msgTarget: "side",
+            validateOnBlur: false,
+            allowBlank: false,
+            value: "",
+            editable: false,
+            check: false,
+            validator: function (value) {
+                if (!this.check) {
+                    return true;
+                }
+                var isvalid = longRe.test(value); ! isvalid && (isvalid = shortRe.test(value));
+                if (isvalid) {
+                    $("#" + this.id + " input").css("color", "black");
+                    return true;
+                } else {
+                    $("#" + this.id + " input").css("color", "red");
+                    return "ERROR! Invalid cells range";
+                }
+            }
+        });
+        this.chTitle = Ext.widget("checkbox", {
+            style: "margin: 0 26px 0 0",
+            boxLabel: this.txtTitle
+        });
+        var _btnOk = Ext.create("Ext.Button", {
+            text: Ext.Msg.buttonText.ok,
+            width: 80,
+            style: "margin: 0 6px 0 0;",
+            cls: "asc-blue-button",
+            listeners: {
+                click: function () {
+                    if (me.txtDataRange.validate()) {
+                        me.fireEvent("onmodalresult", me, 1, me.getSettings());
+                        me.close();
+                    }
+                }
+            }
+        });
+        var _btnCancel = Ext.create("Ext.Button", {
+            text: this.textCancel,
+            width: 80,
+            cls: "asc-darkgray-button",
+            listeners: {
+                click: function () {
+                    me.close();
+                }
+            }
+        });
+        this.items = [this.txtDataRange, this.chTitle, {
+            xtype: "container",
+            height: 26,
+            style: "margin: 8px 0 0 0;",
+            layout: {
+                type: "hbox",
+                align: "stretch",
+                pack: "end"
+            },
+            items: [_btnOk, _btnCancel]
+        }];
+        if (this.api) {
+            this.api.asc_registerCallback("asc_onSelectionRangeChanged", Ext.bind(this._onRangeChanged, this));
+        }
+        this.callParent(arguments);
+        this.setTitle(this.txtFormat);
+    },
+    _onRangeChanged: function (info) {
+        this.txtDataRange.setValue(info);
+    },
+    getSettings: function () {
+        var options = this.api.asc_getAddFormatTableOptions();
+        options.asc_setRange(this.txtDataRange.getValue());
+        options.asc_setIsTitle(this.chTitle.getValue());
+        return options;
+    },
+    txtTitle: "Title",
+    txtFormat: "Format as table",
+    textCancel: "Cancel"
+});

OfficeWeb/apps/spreadsheeteditor/main/app/view/Viewport.js

@@ -0,0 +1,312 @@
+/*
+ * (c) Copyright Ascensio System SIA 2010-2014
+ *
+ * This program is a free software product. You can redistribute it and/or 
+ * modify it under the terms of the GNU Affero General Public License (AGPL) 
+ * version 3 as published by the Free Software Foundation. In accordance with 
+ * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect 
+ * that Ascensio System SIA expressly excludes the warranty of non-infringement
+ * of any third-party rights.
+ *
+ * This program is distributed WITHOUT ANY WARRANTY; without even the implied 
+ * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For 
+ * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+ *
+ * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
+ * EU, LV-1021.
+ *
+ * The  interactive user interfaces in modified source and object code versions
+ * of the Program must display Appropriate Legal Notices, as required under 
+ * Section 5 of the GNU AGPL version 3.
+ *
+ * Pursuant to Section 7(b) of the License you must retain the original Product
+ * logo when distributing the program. Pursuant to Section 7(e) we decline to
+ * grant you any rights under trademark law for use of our trademarks.
+ *
+ * All the Product's GUI elements, including illustrations and icon sets, as
+ * well as technical writing content are licensed under the terms of the
+ * Creative Commons Attribution-ShareAlike 4.0 International. See the License
+ * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+ *
+ */
+ window.cancelButtonText = "Cancel";
+Ext.define("SSE.view.Viewport", {
+    extend: "Ext.container.Viewport",
+    alias: "widget.sseviewport",
+    layout: "fit",
+    uses: ["SSE.view.DocumentHolder", "SSE.view.MainMenu", "SSE.view.File", "SSE.view.DocumentStatusInfo", "SSE.view.CellInfo", "Common.view.ChatPanel", "Common.view.CommentsPanel", "Common.view.Header", "SSE.view.Toolbar", "Common.view.SearchDialog", "Common.view.About", "SSE.view.RightMenu"],
+    initComponent: function () {
+        this.header = Ext.widget("commonheader", {
+            config: {
+                headerCaption: "Spreadsheet Editor"
+            }
+        });
+        this.applicationUI = Ext.widget("container", {
+            layout: {
+                type: "vbox",
+                align: "stretch"
+            },
+            flex: 1,
+            hidden: true,
+            items: [{
+                xtype: "container",
+                flex: 1,
+                layout: {
+                    type: "hbox",
+                    align: "stretch"
+                },
+                items: [{
+                    xtype: "ssemainmenu",
+                    id: "view-main-menu",
+                    maxWidth: 600,
+                    listeners: {
+                        panelshow: function (panel, fulscreen) {
+                            if (fulscreen) {
+                                var menu = Ext.getCmp("view-main-menu");
+                                menu.clearSelection({
+                                    id: menu.currentFullScaleMenuBtn.id
+                                });
+                            }
+                        }
+                    },
+                    buttonCollection: [{
+                        cls: "menuFile",
+                        tooltip: this.tipFile + " (Alt+F)",
+                        id: "id-menu-file",
+                        scale: "full",
+                        disabled: true,
+                        items: [{
+                            xtype: "ssefile",
+                            id: "main-menu-file-options",
+                            width: "100%",
+                            height: "100%"
+                        }]
+                    },
+                    {
+                        cls: "menuSearch",
+                        scale: "modal",
+                        id: "main-menu-search",
+                        disabled: true,
+                        tooltip: this.tipSearch + " (Ctrl+F)"
+                    },
+                    {
+                        cls: "menuComments",
+                        id: "id-menu-comments",
+                        hideMode: "display",
+                        scale: 300,
+                        tooltip: this.tipComments + " (Ctrl+Shift+H)",
+                        disabled: true,
+                        items: [{
+                            xtype: "commoncommentspanel",
+                            height: "100%"
+                        }]
+                    },
+                    {
+                        cls: "menuChat",
+                        id: "id-menu-chat",
+                        scale: 300,
+                        tooltip: this.tipChat + " (Ctrl+Alt+Q)",
+                        disabled: true,
+                        items: [{
+                            xtype: "commonchatpanel",
+                            height: "100%"
+                        }]
+                    },
+                    {
+                        cls: "menuAbout",
+                        id: "id-menu-about",
+                        tooltip: "About",
+                        scale: "full",
+                        disabled: true,
+                        items: [{
+                            xtype: "commonabout",
+                            id: "main-menu-about",
+                            width: "100%",
+                            height: "100%"
+                        }]
+                    }]
+                },
+                {
+                    xtype: "splitter",
+                    id: "main-menu-splitter",
+                    cls: "splitter-document-area",
+                    defaultSplitMin: 300,
+                    hidden: true
+                },
+                {
+                    xtype: "container",
+                    layout: {
+                        type: "vbox",
+                        align: "stretch"
+                    },
+                    maintainFlex: true,
+                    flex: 1,
+                    items: [{
+                        xtype: "ssecellinfo",
+                        id: "cell-edit",
+                        style: "border-left:solid 1px #afafaf;"
+                    },
+                    {
+                        xtype: "splitter",
+                        id: "field-formula-splitter",
+                        defaultSplitMin: 23,
+                        cls: "splitter-document-area"
+                    },
+                    {
+                        id: "editor_sdk",
+                        minHeight: 70,
+                        xtype: "ssedocumentholder",
+                        maintainFlex: true,
+                        flex: 1
+                    }]
+                }]
+            },
+            {
+                xtype: "documentstatusinfo",
+                id: "view-status"
+            }]
+        });
+        this.items = {
+            xtype: "container",
+            layout: {
+                type: "vbox",
+                align: "stretch"
+            },
+            items: [this.header, this.applicationUI]
+        };
+        Ext.tip.QuickTipManager.init();
+        this.callParent(arguments);
+    },
+    applyMode: function () {
+        this.hkSaveAs[this.mode.canDownload ? "enable" : "disable"]();
+        this.hkChat[this.mode.canCoAuthoring ? "enable" : "disable"]();
+        this.hkComments[(this.mode.canCoAuthoring && this.mode.isEdit) ? "enable" : "disable"]();
+    },
+    setMode: function (m, delay) {
+        m.isDisconnected ? this.mode.canDownload = this.mode.canCoAuthoring = false : this.mode = m;
+        if (!delay) {
+            this.applyMode();
+        }
+    },
+    applyEditorMode: function () {
+        var me = this;
+        me._toolbar = Ext.widget("ssetoolbar", {
+            id: "view-toolbar"
+        });
+        me._rightMenu = Ext.widget("sserightmenu", {
+            id: "view-right-menu"
+        });
+        me.applicationUI.insert(0, me._toolbar);
+        me.applicationUI.items.items[1].add(me._rightMenu);
+        me._toolbar.setVisible(true);
+    },
+    createDelayedElements: function () {
+        var _self = this;
+        this.hotKeys = new Ext.util.KeyMap(document, [{
+            key: "f",
+            ctrl: true,
+            shift: false,
+            defaultEventAction: "stopEvent",
+            fn: function () {
+                if (canHotKey()) {
+                    var cmp = Ext.getCmp("view-main-menu");
+                    if (cmp) {
+                        cmp.selectMenu("menuSearch");
+                    }
+                }
+            }
+        },
+        {
+            key: [Ext.EventObject.PAGE_DOWN, Ext.EventObject.PAGE_UP],
+            ctrl: false,
+            shift: false,
+            alt: true,
+            defaultEventAction: "stopEvent",
+            fn: function (key, event) {
+                if (canHotKey()) {
+                    var cmp = Ext.getCmp("view-status");
+                    if (cmp) {
+                        cmp.setActiveWorksheet(undefined, key == event.PAGE_DOWN ? ACTIVE_TAB_NEXT : ACTIVE_TAB_PREV);
+                    }
+                }
+            }
+        },
+        {
+            key: "f",
+            alt: true,
+            defaultEventAction: "stopEvent",
+            fn: function () {
+                if (canHotKey()) {
+                    Ext.menu.Manager.hideAll();
+                    var cmp = Ext.getCmp("view-main-menu");
+                    if (cmp) {
+                        cmp.selectMenu("menuFile");
+                    }
+                }
+            }
+        }]);
+        this.hkSaveAs = new Ext.util.KeyMap(document, {
+            key: "s",
+            ctrl: true,
+            shift: true,
+            defaultEventAction: "stopEvent",
+            fn: function () {
+                if (canHotKey()) {
+                    Ext.menu.Manager.hideAll();
+                    var cmp = Ext.getCmp("view-main-menu");
+                    if (cmp) {
+                        cmp.selectMenu("menuFile");
+                    }
+                }
+            }
+        });
+        this.hkHelp = new Ext.util.KeyMap(document, {
+            key: Ext.EventObject.F1,
+            ctrl: false,
+            shift: false,
+            defaultEventAction: "stopEvent",
+            scope: this,
+            fn: function () {
+                if (canHotKey()) {
+                    Ext.menu.Manager.hideAll();
+                    var cmp = Ext.getCmp("view-main-menu");
+                    if (cmp) {
+                        cmp.selectMenu("menuFile");
+                    }
+                }
+            }
+        });
+        this.hkChat = new Ext.util.KeyMap(document, {
+            key: "q",
+            ctrl: true,
+            alt: true,
+            defaultEventAction: "stopEvent",
+            fn: function () {
+                if (canHotKey()) {
+                    var cmp = Ext.getCmp("view-main-menu");
+                    if (cmp) {
+                        cmp.selectMenu("menuChat");
+                    }
+                }
+            }
+        });
+        this.hkComments = new Ext.util.KeyMap(document, {
+            key: "H",
+            ctrl: true,
+            shift: true,
+            defaultEventAction: "stopEvent",
+            fn: function () {
+                if (canHotKey()) {
+                    var cmp = Ext.getCmp("view-main-menu");
+                    if (cmp) {
+                        cmp.selectMenu("menuComments");
+                    }
+                }
+            }
+        });
+    },
+    tipChat: "Chat",
+    tipComments: "Comments",
+    tipFile: "File",
+    tipSearch: "Search"
+});